/* Fullscreen-sized play without requiring the browser Fullscreen API (including iPhone). */
:root{--play-height:100dvh;--touch-dock:154px;--safe-bottom:env(safe-area-inset-bottom,0px)}
body.touch-mode.playing{position:fixed;inset:0;margin:0;width:100%;height:var(--play-height);overflow:hidden;overscroll-behavior:none;-webkit-user-select:none;user-select:none}
body.touch-mode.playing>header,body.touch-mode.playing .under,body.touch-mode.playing .journey,body.touch-mode.playing footer{display:none}
body.touch-mode.playing>main{padding:0;max-width:none;width:100%;height:100%}
body.touch-mode.playing #stage{position:absolute;inset:0;width:100%;height:var(--play-height);min-height:0;max-height:none;border:0;border-radius:0;box-shadow:none;touch-action:none}
body.touch-mode.playing #game{position:absolute;left:0;top:0;width:100%;height:calc(100% - var(--touch-dock) - var(--safe-bottom));touch-action:none}
body.touch-mode.playing #touch{position:absolute;bottom:0;left:0;right:0;height:calc(var(--touch-dock) + var(--safe-bottom));padding:9px max(12px,env(safe-area-inset-right,0px)) calc(11px + var(--safe-bottom)) max(12px,env(safe-area-inset-left,0px));display:grid;grid-template-columns:1fr 1fr;grid-template-rows:44px 1fr;gap:8px 12px;align-items:center;background:linear-gradient(180deg,#fff3f8f5,#f4d9e9);border-top:2px solid #fff8;pointer-events:auto;z-index:4;touch-action:none;-webkit-touch-callout:none}
#touch .touch-directions{grid-column:1;grid-row:2;display:flex;gap:10px;align-items:center;justify-content:flex-start}
#touch .touch-actions{grid-column:2;grid-row:2;display:flex;gap:12px;align-items:center;justify-content:flex-end}
#touch .touch-extras{grid-column:1/-1;grid-row:1;display:flex;justify-content:center;align-items:center;gap:10px}
body.touch-mode #touch button{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0;width:68px;height:68px;min-width:48px;min-height:48px;border:3px solid #fff;border-radius:23px;background:#fffaf4;color:#ad6591;box-shadow:0 5px 0 #bd83a536;font-size:32px;font-weight:700;line-height:1;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}
body.touch-mode #touch button small{font:600 10px 'DM Sans',sans-serif;margin-top:4px;line-height:1;color:#a57591}
body.touch-mode #touch .touch-jump{width:86px;height:86px;border-radius:30px;background:#d187af;color:#fff;font-size:35px;box-shadow:0 6px 0 #b670963d}
body.touch-mode #touch .touch-jump small{font-size:12px;color:#fff8fc}
body.touch-mode #touch .touch-scratch{width:56px;height:60px;font-size:24px;border-radius:20px}
body.touch-mode #touch .touch-scratch small{font-size:9px}
body.touch-mode #touch .touch-extra{flex-direction:row;width:auto;min-width:74px;height:44px;min-height:44px;padding:0 13px;border-radius:16px;font-size:11px;box-shadow:0 3px 0 #c58eaa25;gap:4px}
body.touch-mode #touch button.active,body.touch-mode #touch button:active{transform:translateY(4px);box-shadow:0 1px 0 #bd83a536;background:#edbdd9}
body.touch-mode #touch .touch-extra[aria-pressed=true]{background:#e1f1e9;color:#638c7e}
body.touch-mode.playing #hud{left:max(10px,env(safe-area-inset-left,0px));right:max(10px,env(safe-area-inset-right,0px));top:max(10px,env(safe-area-inset-top,0px));z-index:2;gap:10px}
body.touch-mode.playing .health button{min-width:48px;min-height:48px;padding:0 8px;font-size:23px;touch-action:manipulation}
body.touch-mode.playing .health{min-width:0;gap:4px;padding:7px 8px;border-radius:16px}
body.touch-mode.playing #companion{left:max(12px,env(safe-area-inset-left,0px));bottom:calc(var(--touch-dock) + var(--safe-bottom) + 10px);z-index:2;pointer-events:none;padding:4px 10px 4px 0}
body.touch-mode.playing #companion img{width:32px;height:32px}
body.touch-mode.playing #companion b{font-size:9px}
body.touch-mode.playing #companion small{font-size:8px}
body.touch-mode.playing #hint{top:calc(max(10px,env(safe-area-inset-top,0px)) + 148px);bottom:auto;left:max(12px,env(safe-area-inset-left,0px));right:auto;max-width:min(300px,calc(100vw - 24px));padding:8px 12px;font-size:10px;pointer-events:none}
body.touch-mode.playing #powers{top:calc(max(10px,env(safe-area-inset-top,0px)) + 120px);left:max(12px,env(safe-area-inset-left,0px));padding:6px 10px;font-size:10px}
body.touch-mode.playing #bossbar{top:calc(max(10px,env(safe-area-inset-top,0px)) + 201px);width:195px;z-index:2}
body.touch-mode.playing #toast{top:34%;max-width:90%;white-space:normal;text-align:center;z-index:5}
body.touch-mode.playing #modal{z-index:10;padding:max(12px,env(safe-area-inset-top,0px)) max(10px,env(safe-area-inset-right,0px)) max(12px,env(safe-area-inset-bottom,0px)) max(10px,env(safe-area-inset-left,0px));touch-action:pan-y}
body.touch-mode .dialog{max-height:100%;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;touch-action:pan-y;user-select:text}
body.touch-mode .dialog .primary{min-height:52px}
body.touch-mode .text-button{min-height:44px;padding:8px 12px;margin-top:10px}
#pause-tools{display:flex;justify-content:center;gap:8px;margin-top:14px;flex-wrap:wrap}
#pause-tools button{min-height:46px;border:1px solid #ecd3e2;background:#fffaf8;border-radius:13px;padding:10px 15px;font-size:11px;color:#a47494;touch-action:manipulation}
body.touch-mode .settings-row{min-height:44px}
body.touch-mode .settings-row input[type=checkbox]{width:24px;height:24px}
body.touch-mode .settings-row input[type=range]{min-height:40px;touch-action:pan-x}
body.touch-mode.playing #travel{z-index:12;border-radius:0;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
@media(any-pointer:coarse),(max-width:1024px){header{padding-left:max(14px,env(safe-area-inset-left,0px));padding-right:max(14px,env(safe-area-inset-right,0px))}.top-actions button{min-width:44px;min-height:44px}.top-actions .rank-button{min-width:44px}#nickname{font-size:16px;min-height:46px}.consent{min-height:44px;align-items:center}.consent input{width:23px;height:23px;flex-shrink:0}.primary{min-height:50px}.top-actions{gap:5px}}
@media(max-width:400px){body.touch-mode #touch .touch-directions{gap:7px}body.touch-mode #touch .touch-actions{gap:8px}body.touch-mode #touch button{width:64px;height:64px}body.touch-mode #touch .touch-jump{width:78px;height:78px}body.touch-mode #touch .touch-scratch{width:50px;height:56px}.top-actions .rank-button{font-size:8px;padding:0 7px}.brand{font-size:15px}.brand small{font-size:5px;letter-spacing:.4px}header{gap:8px}.brand b{font-size:12px}}
@media(orientation:portrait){body.touch-mode.playing .quest{position:absolute;top:83px;left:0;width:235px;max-width:calc(100vw - 24px);padding:6px 10px;text-align:left}body.touch-mode.playing .quest>span{font-size:14px}body.touch-mode.playing .quest #score{font-size:9px}body.touch-mode.playing .counter{padding:10px 12px;gap:8px}body.touch-mode.playing .counter small{font-size:6px}body.touch-mode.playing .counter strong{font-size:24px}body.touch-mode.playing .health #hearts{font-size:18px}body.touch-mode.playing .health #lives{font-size:8px}body.touch-mode.playing .health>div{max-width:123px}}
@media(orientation:landscape){body.touch-mode{--touch-dock:100px}body.touch-mode.playing #touch{display:flex;justify-content:space-between;gap:15px;padding-top:9px}#touch .touch-directions{order:0}#touch .touch-extras{order:1;gap:10px}#touch .touch-actions{order:2}body.touch-mode #touch button{width:68px;height:68px}body.touch-mode #touch .touch-jump{width:82px;height:82px}body.touch-mode #touch .touch-scratch{width:56px;height:60px}body.touch-mode.playing .quest{position:static;width:255px;max-width:38vw;text-align:center}body.touch-mode.playing #hint{top:auto;bottom:calc(var(--touch-dock) + var(--safe-bottom) + 13px);left:auto;right:max(12px,env(safe-area-inset-right,0px));max-width:315px}body.touch-mode.playing #powers{top:91px}body.touch-mode.playing #bossbar{top:88px}body.touch-mode.playing #companion{bottom:calc(var(--touch-dock) + var(--safe-bottom) + 10px)}}
@media(orientation:landscape) and (max-height:540px){body.touch-mode{--touch-dock:86px}body.touch-mode #touch button{width:59px;height:59px;border-radius:20px;font-size:29px}body.touch-mode #touch .touch-jump{width:68px;height:68px;border-radius:23px}body.touch-mode #touch .touch-scratch{width:51px;height:54px}body.touch-mode #touch .touch-extra{height:44px;min-width:70px;padding:0 10px;font-size:10px}body.touch-mode.playing .counter{padding:6px 12px;border-radius:13px}body.touch-mode.playing .counter strong{font-size:23px}body.touch-mode.playing .counter small{font-size:6px}body.touch-mode.playing .health{padding:4px 7px}body.touch-mode.playing .health #hearts{font-size:17px}body.touch-mode.playing .health #lives{font-size:7px}body.touch-mode.playing .health small:first-child{font-size:6px}body.touch-mode.playing .quest{padding:6px 10px;width:230px}.quest>span{font-size:14px}body.touch-mode.playing .quest #score{font-size:8px}body.touch-mode.playing .health button{min-width:44px;min-height:44px}body.touch-mode.playing #hint{display:none}body.touch-mode.playing #companion{background:#fff8f4cf;bottom:calc(var(--touch-dock) + var(--safe-bottom) + 5px)}body.touch-mode.playing #companion img{width:26px;height:26px}body.touch-mode.playing #companion small{display:none}body.touch-mode.playing #bossbar{top:75px}body.touch-mode.playing #powers{top:75px;font-size:9px;padding:5px 9px}body.touch-mode .dialog{padding:16px 23px;border-radius:20px}body.touch-mode .dialog h2{font-size:25px;margin:8px 0}body.touch-mode .dialog p{font-size:11px;margin:7px 0;line-height:1.5}body.touch-mode .dialog .primary{margin-top:10px;min-height:48px}body.touch-mode .settings-row{margin:5px 0}body.touch-mode .stars-big{font-size:28px}body.touch-mode .stat-row{margin:6px 0;padding:6px 0}body.touch-mode.playing #travel{flex-direction:row;gap:35px}.travel-info h2{font-size:28px}.lift-shaft{height:220px;width:165px}.lift-cabin{height:150px}.lift-cabin img{height:100px}body:not(.playing) #stage{height:470px;min-height:470px}.menu-copy{top:5%}.menu-copy h1{font-size:38px;margin:10px 0}.menu-copy p{font-size:11px;margin:8px 0;line-height:1.5}.menu-note{font-size:8px}#profile{margin-bottom:8px}.menu-cat.black{height:65%}.menu-cat.white{height:58%}}
@media(orientation:portrait) and (min-width:700px){body.touch-mode{--touch-dock:173px}body.touch-mode #touch button{width:82px;height:82px;border-radius:27px}body.touch-mode #touch .touch-jump{width:98px;height:98px;border-radius:33px}body.touch-mode #touch .touch-scratch{width:68px;height:70px}body.touch-mode.playing #touch{padding-left:max(30px,env(safe-area-inset-left,0px));padding-right:max(30px,env(safe-area-inset-right,0px))}body.touch-mode.playing .quest{left:50%;transform:translateX(-50%);top:0;text-align:center;max-width:270px;width:32vw}}