*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:#101525;color:#fff3d8;font-family:ui-monospace,SFMono-Regular,Consolas,monospace}button,select{font:inherit;color:inherit;background:#263348;border:1px solid #54647a;border-radius:6px;min-height:42px;padding:8px 12px;cursor:pointer}button:hover,button:focus-visible,select:focus-visible{outline:2px solid #ffc75b;outline-offset:2px}button:active{transform:translateY(2px)}button:disabled{opacity:.5;cursor:wait}[hidden]{display:none!important}#shell{max-width:950px;margin:auto;padding:10px;height:100dvh;display:flex;flex-direction:column}header{display:flex;align-items:center;justify-content:space-between;gap:10px;flex:none;margin-bottom:10px}header strong{font-size:20px;letter-spacing:-1px}em{font-style:normal;color:#ffc85c}nav{display:flex;gap:6px}.stage{position:relative;flex:1;min-height:0;display:flex;align-items:center;justify-content:center;background:#080d18;border:2px solid #37445c;border-radius:9px;overflow:hidden}canvas{width:100%;height:100%;object-fit:contain;image-rendering:pixelated;touch-action:none;outline:none}#overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:linear-gradient(#08132270,#081322c9);padding:12px;overflow:auto}.panel{width:min(430px,100%);text-align:center;background:#101c2eef;border:2px solid #b89051;box-shadow:0 8px 0 #070e1c;padding:22px;border-radius:6px;max-height:100%;overflow:auto}.eyebrow{font-size:12px;letter-spacing:2px;color:#dfc9a1}h1{font-size:clamp(34px,7vw,56px);line-height:.92;letter-spacing:-3px;text-shadow:3px 4px #683e2f;margin:22px 0}p{font-size:14px;line-height:1.6}#status{color:#ffd17a;margin:7px 0}#status:empty{display:none}.primary{display:block;width:100%;background:#ffc85c;color:#1e2535;border:0;border-bottom:4px solid #ae7835;font-weight:900;letter-spacing:1px;font-size:16px;margin-top:15px}#configure{font-size:12px;min-height:32px;margin-top:12px;background:transparent;border-color:#52627c}#pad-status{font-size:12px;margin:8px 0 0}#practice,#retry{margin-top:10px}#pause-button{position:absolute;right:8px;top:70px;background:#162439cf;min-height:36px;padding:5px 12px}#exit-full{position:absolute;top:70px;left:8px}.touch{display:none;justify-content:space-between;gap:8px;flex:none;padding:10px 0 0;user-select:none;-webkit-user-select:none;touch-action:none}.touch>div{display:flex;gap:8px}.touch button{width:clamp(54px,12vw,78px);height:68px;padding:4px;background:#243951;border-bottom:4px solid #080e1e;touch-action:none}.touch b{display:block;font-size:28px}.touch small{font-size:9px;font-weight:bold}.touch button[data-key=jump]{background:#be883d}.touch button[data-key=whip]{background:#685290}.touch button[data-key=bomb]{background:#99494c}footer{flex:none;text-align:center}footer p{font-size:12px;margin:6px 0;color:#9baabd}#scores{padding:0;list-style:none;margin:12px 0;text-align:left}#scores li{display:grid;grid-template-columns:30px 45px 1fr;gap:6px;font-size:14px;padding:4px 0;border-bottom:1px solid #30415a}#scores li span:last-child{text-align:right;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}.letter-row{display:flex;gap:10px;justify-content:center;margin:15px}.letter-row button{font-size:30px;width:60px;height:60px}.letter-row .active{background:#ffd06b;color:#172137;animation:blink .7s steps(2) infinite}.letter-controls{display:flex;justify-content:center;gap:9px}@keyframes blink{50%{box-shadow:0 0 0 3px #ffdfac}}html.embedded header{display:none}html.immersive #shell{max-width:none;padding:0}html.immersive header,html.immersive footer{display:none}html.immersive .stage{border:0;border-radius:0}html.immersive .touch{padding:6px max(10px,env(safe-area-inset-right)) max(6px,env(safe-area-inset-bottom)) max(10px,env(safe-area-inset-left));background:#101525}html.touch-show .touch{display:flex}html.touch-hide .touch{display:none!important}@media(pointer:coarse){.touch{display:flex}}@media(max-width:500px){#shell{padding:5px}header strong{font-size:15px}header select{max-width:95px}.panel{padding:16px}.touch{gap:4px}.touch>div{gap:5px}.touch button{width:clamp(51px,15vw,67px)}footer #pad-help{display:none}}@media(orientation:landscape) and (max-height:600px){.touch{padding:4px 10px}.touch button{height:54px;width:66px}.touch b{font-size:22px}footer{display:none}.panel{padding:10px;max-width:530px}h1{font-size:34px;margin:8px}.panel p{margin:5px;font-size:12px}.primary{margin-top:8px}.eyebrow{font-size:10px}#configure{margin-top:5px}}@media(prefers-reduced-motion:reduce){.letter-row .active{animation:none}}

/* Game controls must not invoke browser text selection or long-press menus. */
.stage,.stage *,button,button *,.touch,.touch *{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent}
.touch,.touch *{touch-action:none}

html.cinematic #pause-button,html.cinematic #exit-full{top:8px}

#sound{position:absolute;bottom:8px;right:12px;min-height:34px;width:38px;padding:4px;background:#162439e8;z-index:2}#sound[aria-pressed=false]{color:#ff998c}

/* Keep the canvas aspect ratio and place landscape controls over its corners. */
canvas{flex:none;max-width:100%;max-height:100%}
@media(orientation:landscape) and (max-height:600px){
 #shell{position:relative}
 .touch,html.immersive .touch{position:absolute;inset:0;pointer-events:none;align-items:flex-end;padding:0 max(12px,env(safe-area-inset-right)) max(14px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left));background:transparent}
 .touch>div{pointer-events:auto;gap:8px}
 .touch>div:last-child{display:grid;grid-template-columns:repeat(2,58px)}
 .touch button{width:58px;height:54px;min-height:54px}
 .touch button[data-key=jump]{grid-column:2;grid-row:1 / span 2;align-self:end;height:72px}
 #sound{bottom:auto;top:115px}
 html.cinematic #sound{top:50px}
 .panel{max-width:min(430px,calc(100% - 150px))}
}

html.embedded.immersive,html.embedded.immersive body{height:100%;min-height:0;overflow:hidden}
html.embedded.immersive #shell{height:100%;width:100%;min-width:0;padding-top:40px}
html.immersive .touch button{background-color:#243951bb}