:root{color-scheme:dark;font-family:Arial,sans-serif;background:#061c25;color:#e5faf1}*{box-sizing:border-box}body{margin:0;overscroll-behavior:none}button{font:inherit;color:inherit;cursor:pointer;touch-action:manipulation;border:1px solid #a5ded32c;border-radius:12px;background:#ffffff08;min-height:44px;padding:10px 17px}button:hover{border-color:#9ee7ce}button:focus-visible,canvas:focus-visible{outline:2px solid #ffd8a0;outline-offset:3px}[hidden]{display:none!important}main{height:100svh;min-height:350px;max-width:900px;margin:auto;display:flex;flex-direction:column;padding:14px 20px 10px;gap:12px}header{display:flex;justify-content:space-between;align-items:center;flex:none}.brand{display:flex;gap:12px;align-items:center}.brand img{width:37px;height:45px;object-fit:contain}.brand small{font-size:8px;letter-spacing:2px;color:#83aeb2}h1{font-size:25px;margin:3px 0 0;letter-spacing:-1px}h1 span{color:#f3ba86}#pause{font-size:12px}.hud{display:flex;justify-content:space-between;align-items:center;gap:12px;padding-inline:6px;flex:none}.hud span{font-size:8px;letter-spacing:1.5px;color:#86b9ba;display:block}.hud strong{display:block;font-size:25px;font-weight:500;margin-top:3px;font-variant-numeric:tabular-nums}.hud .right{text-align:right}.hud p{font-size:9px;letter-spacing:2px;color:#b1dcd3}#stage{position:relative;flex:1;min-height:0;max-width:520px;width:100%;align-self:center;overflow:hidden;border-radius:22px;border:1px solid #9bd7c126;background:#0b3c48}canvas{display:block;width:100%;height:100%;touch-action:none;user-select:none;-webkit-user-select:none}.tap-cue{pointer-events:none;position:absolute;bottom:20px;left:0;right:0;text-align:center;color:#d5f6dd;font-size:10px;letter-spacing:3px;opacity:.8}.overlay{position:absolute;inset:0;background:#062630cd;display:flex;align-items:center;justify-content:center;overflow:auto;backdrop-filter:blur(5px);padding:18px}.panel{max-width:360px;width:100%;padding:12px 6px}.eyebrow{font-size:8px;letter-spacing:1.8px;color:#b9e5ce;margin:0 0 15px}h2{font:500 clamp(38px,7vh,61px)/.98 Georgia,serif;letter-spacing:-2px;margin:0 0 18px}h2 em{font-weight:400;color:#b5f0d2}.panel>p:not(.eyebrow):not(.credit){font-size:12px;line-height:1.6;color:#bbd5d4;margin:0 0 18px}.levels{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-bottom:19px}.levels button{font-size:11px;padding:9px 5px}.levels button[aria-pressed=true]{background:#b5f0d2;color:#123834;border-color:#b5f0d2}.crew-head{display:flex;justify-content:space-between;color:#a6cfcc;font-size:8px;letter-spacing:1px;margin-bottom:9px}.crew{display:flex;gap:7px}.crew button{width:25%;padding:8px 2px;font-size:9px;display:flex;flex-direction:column;align-items:center;gap:5px}.crew button svg{width:30px;height:25px}.crew button[aria-pressed=true]{border-color:#b5f0d2;background:#b5f0d21c}.crew button span{color:#8eb8b9;font-size:8px}.note{font-size:9px;color:#89b1b4;line-height:1.5;min-height:15px;margin:9px 0 15px}.primary{width:100%;display:flex;justify-content:space-between;align-items:center;background:#b5f0d2;color:#113934;font-weight:600;border:0;border-radius:12px;padding:15px 18px}.primary span{font-size:20px}.secondary{width:100%;margin-top:9px;font-size:12px}.panel .controls{font-size:9px!important;text-align:center;margin:13px 0 0!important}.credit{font-size:8px;text-align:center;letter-spacing:.6px;color:#7ca3a7;margin:14px 0 0}footer{display:flex;justify-content:space-between;font-size:8px;color:#769a9f;letter-spacing:.5px;flex:none}button:disabled{opacity:.4;cursor:default}@media(max-width:600px){main{padding:8px 12px max(8px,env(safe-area-inset-bottom));gap:8px}.brand img{width:28px;height:34px}.brand small{font-size:7px}h1{font-size:22px}.hud strong{font-size:22px}.hud p{font-size:8px;letter-spacing:1px}#stage{border-radius:17px}.overlay{padding:14px}.panel{padding:9px 5px}footer{font-size:7px}}@media(max-height:650px) and (min-width:600px){main{gap:6px;padding-block:6px}.hud{position:absolute;top:61px;left:30px;right:30px;pointer-events:none;z-index:2}.hud strong{font-size:19px}.hud p{display:none}#stage{max-width:650px}.overlay{padding:12px}.panel{max-width:580px;display:grid;grid-template-columns:1fr 1fr;gap:0 22px;align-items:center}.eyebrow,h2,#description{grid-column:1}h2{font-size:39px;margin-bottom:10px}.eyebrow{margin-bottom:9px}#setup{grid-column:2;grid-row:1/5}.levels{margin-bottom:10px}.crew-head{margin-bottom:6px}.crew button{min-height:50px;padding:4px 2px}.crew button svg{height:18px}.note{margin:6px 0}.primary,.secondary{grid-column:1}.panel .controls,.credit{grid-column:1/-1;font-size:8px!important;margin-top:8px!important}.panel>p:not(.eyebrow):not(.credit){font-size:11px;margin-bottom:10px}.tap-cue{bottom:10px}footer{display:none}}@media(prefers-reduced-motion:reduce){.overlay{backdrop-filter:none}}

/* Fit the actual frame, including short landscape windows and the score HUD. */
html,body{height:100%;overflow:hidden}main{height:100dvh;min-height:0}