.touch-controls[hidden]{display:none!important}
.touch-controls{--touch-unit:min(clamp(48px,calc(58px * var(--touch-scale,1)),76px),calc((var(--touch-frame-width,100vw) - 56px) / 4));position:absolute;inset:0;z-index:3;pointer-events:none;user-select:none;-webkit-user-select:none}
.touch-movement,.touch-actions{position:absolute;bottom:max(12px,env(safe-area-inset-bottom));display:grid;gap:8px;pointer-events:none}
.touch-movement{left:max(12px,env(safe-area-inset-left));grid-template-columns:repeat(2,var(--touch-unit));grid-template-areas:'direction direction' 'crouch sit'}
.touch-actions{right:max(12px,env(safe-area-inset-right));grid-template-columns:repeat(2,var(--touch-unit));grid-template-areas:'attack jump' 'kick interact'}
.touch-button,.touch-direction{appearance:none;pointer-events:auto;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;min-width:48px;min-height:48px;width:var(--touch-unit);height:var(--touch-unit);padding:2px;font:bold 13px Georgia,serif;color:white;text-shadow:1px 1px #152254;background:linear-gradient(#1728ee,#717bff);border:2px solid #080b20;border-radius:3px;box-shadow:inset 1px 1px #b1baff,inset -1px -1px #344591,1px 2px #080b2080;opacity:var(--touch-opacity,.8);cursor:pointer}
.touch-button.is-held{opacity:1;background:linear-gradient(#7186fa,#263cc0);box-shadow:inset 1px 2px #141d58;transform:translateY(1px)}
.touch-button:disabled{color:#c3c7d0;text-shadow:1px 1px #333b4c;background:linear-gradient(#444b60,#72798d);border-color:#262b37;box-shadow:inset 1px 1px #9299ab,inset -1px -1px #464e60,1px 2px #080b2080;cursor:default}
.touch-button:focus-visible{outline:2px solid #fff59c;outline-offset:2px}
.touch-direction{grid-area:direction;position:relative;display:flex;width:calc(var(--touch-unit) * 2 + 8px);padding:0;overflow:hidden}
.touch-direction::after{content:'';position:absolute;left:calc(50% - 1px);top:25%;bottom:25%;width:2px;background:#080b20;box-shadow:1px 0 #aab5ff;pointer-events:none}
.touch-direction:has(.is-held){opacity:1}
.touch-direction-half{flex:1;min-width:0;min-height:0;width:50%;height:100%;border:0;border-radius:0;background:none;box-shadow:none;opacity:1}
.touch-direction-half.is-held{transform:none;box-shadow:none;background:#d3e4ff35}
.touch-direction-half:focus-visible{outline-offset:-3px}
.touch-direction-half span,.touch-crouch span{font:24px Tahoma,sans-serif}
.touch-crouch{grid-area:crouch}
.touch-attack{grid-area:attack}.touch-jump{grid-area:jump}
.touch-button[data-action=sit]{grid-area:sit}.touch-button[data-action=kick]{grid-area:kick}.touch-button[data-action=interact]{grid-area:interact;font-size:12px}
.touch-settings{width:min(390px,calc(100vw - 32px));max-height:calc(100dvh - 24px);overflow:auto;color:white;background:linear-gradient(#1927a6,#335bd0);border:3px solid #080b20;border-radius:4px;box-shadow:inset 0 0 0 1px #8297ff;padding:18px;font:14px Tahoma,sans-serif;touch-action:pan-y}
.touch-settings::backdrop{background:#060b31a8}
.touch-settings h2{margin:0 0 18px;font:bold 22px Georgia,serif;text-align:center}
.touch-settings label{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:12px 0 8px}
.touch-settings label[for=touch-enabled]{min-height:44px;cursor:pointer}
.touch-settings input[type=checkbox]{width:22px;height:22px;accent-color:#e4eeff;cursor:pointer}
.touch-settings input[type=range]{display:block;width:100%;min-height:32px;accent-color:#e4eeff;touch-action:pan-x}
.touch-settings p{font-size:12px;line-height:1.45;color:#e8edff}
.touch-settings .classic-button{display:block;margin:16px auto 0;min-width:110px;min-height:44px}
.world-page.touch-enabled{height:100dvh;min-height:0;display:flex;flex-direction:column;padding:6px max(6px,env(safe-area-inset-right)) 6px max(6px,env(safe-area-inset-left));padding-top:max(6px,env(safe-area-inset-top));overflow:hidden}
.touch-enabled .world-header{width:100%;max-width:none;min-height:36px;flex:0 0 auto;margin:0 0 6px;gap:8px}
.touch-enabled .world-header img{width:110px}.touch-enabled .world-header h1{font-size:13px;min-width:0}
.touch-enabled .world-header .classic-button{min-height:36px;font-size:12px;padding:6px 9px;white-space:nowrap}
.touch-enabled .game-frame{flex:1 1 auto;min-height:0;width:100%;aspect-ratio:auto;display:flex;align-items:center;justify-content:center;overflow:hidden;background:#09065e}
.touch-enabled .game-frame canvas{flex:none;width:min(100%,calc(var(--touch-frame-height,600px) * 950 / 600));height:auto;aspect-ratio:950/600;touch-action:none}
.touch-enabled .world-footer{display:none}
.game-frame:fullscreen{height:100dvh}
@media(max-width:650px){.touch-enabled .world-header h1{display:none}.touch-enabled .world-header img{margin-right:auto}.touch-enabled .world-header{flex-wrap:nowrap}}
@media(max-width:420px) and (orientation:portrait){.touch-enabled .world-header img{display:none}.touch-enabled .world-header{justify-content:space-between}}