/* Faithful dusk game UI. auteur-allow: backdrop -- functional scene dimming under intro. auteur-allow: svg sky gradient -- reference dusk illustration, not gradient UI styling. */
:root{color-scheme:dark;--ink:#f6f5f1;--black:#050506;--amber:#ffb648;--surface:#15151b;--muted:#b9b7c2;--line:#35353e;font-family:"Segoe UI","Avenir Next",sans-serif;font-synthesis:none}
*{box-sizing:border-box}html,body{height:100%;margin:0;overflow:hidden}body{background:var(--black);color:var(--ink);overscroll-behavior:none}button{font:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:none;color:inherit}button:focus-visible{outline:3px solid var(--amber);outline-offset:4px}button:disabled{opacity:.55;cursor:wait}#game{position:relative;width:100%;height:100%;height:100dvh;overflow:hidden;touch-action:none;user-select:none;-webkit-user-select:none}#scene{position:absolute;inset:0;display:block;width:100%;height:100%}.hud{position:absolute;left:0;right:0;top:0;padding:calc(10px + env(safe-area-inset-top,0px)) 10px 0;pointer-events:none}.hudRow{display:flex;gap:6px;align-items:stretch}.pill{background:rgba(5,5,6,.79);border:1px solid rgba(246,245,241,.2);border-radius:12px;padding:6px 10px;min-width:76px}.pill small{display:block;font-size:10px;line-height:1.1;color:#cfccd7}.pill b{display:block;font-size:20px;line-height:1.2;font-weight:800;font-variant-numeric:tabular-nums;white-space:nowrap}#timePanel.low b{color:#ff7367}#muteButton{pointer-events:auto;margin-left:auto;width:44px;border:1px solid rgba(246,245,241,.2);border-radius:12px;background:rgba(5,5,6,.79);font-size:20px}#mission{display:inline-block;max-width:calc(100% - 100px);padding:8px 11px;margin-top:8px;background:var(--ink);color:var(--black);font-size:12px;font-weight:750;border-radius:10px;line-height:1.3}#seats{display:flex;gap:5px;margin:9px 0 0 3px}#seats i{width:13px;height:13px;border:2px solid #deded7;border-radius:50%;background:rgba(5,5,6,.6)}#seats i.on{border-color:var(--amber);background:var(--amber)}.speed{position:absolute;right:20px;bottom:calc(115px + env(safe-area-inset-bottom,0px));text-align:right;text-shadow:0 2px 9px #000;pointer-events:none}.speed strong{display:block;font-size:40px;line-height:.95;font-weight:800;font-variant-numeric:tabular-nums}.speed small{font-size:12px;color:#e9e8e4}.controls{position:absolute;bottom:calc(18px + env(safe-area-inset-bottom,0px));left:16px;right:16px;display:flex;justify-content:space-between;align-items:flex-end;gap:14px}.steering{text-align:center}.steering>div{display:flex;gap:9px}.steering small{display:block;font-size:11px;margin-top:5px;color:#eee}.controls button{height:64px;min-width:65px;border-radius:18px;background:rgba(5,5,6,.75);border:1px solid rgba(246,245,241,.3);font-weight:750;box-shadow:0 3px 10px rgba(0,0,0,.15);transition:background-color 120ms ease-out,transform 120ms ease-out}.controls .steerButton{font-size:24px}.pedals{display:flex;gap:10px;padding-bottom:17px}.pedals button{width:79px}#gasButton{color:var(--black);background:var(--amber);border-color:var(--amber)}.controls button.pressed{transform:translateY(2px);background:#f6f5f1;color:#050506}#gasButton.pressed{background:#f1d090}.keyHint{position:absolute;bottom:102px;left:50%;transform:translateX(-50%);white-space:nowrap;font-size:12px;color:#e1e1da;text-shadow:0 1px 5px #000;pointer-events:none}.overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:20px;background:rgba(5,5,6,.61);z-index:10;overflow-y:auto;touch-action:pan-y}.hidden{display:none!important}.card{width:min(420px,100%);flex:none;background:var(--surface);border:1px solid #38383e;border-radius:24px;overflow:hidden;box-shadow:0 18px 70px rgba(0,0,0,.4)}.hero{height:155px;background:#726d85;overflow:hidden}.hero svg{width:100%;height:100%;display:block;object-fit:cover}.cardBody{padding:24px}.card h1{font-size:27px;letter-spacing:-.025em;font-weight:850;margin:0;line-height:1.15}.subtitle{font-size:12px;font-weight:650;margin:7px 0 0;color:var(--muted)}.lead{font-size:13px;line-height:1.55;color:#d2d0d9;margin:19px 0}.rule{display:flex;gap:13px;align-items:flex-start;margin:15px 0}.rule>span{display:flex;align-items:center;justify-content:center;flex:none;width:30px;height:30px;border:1px solid #44414a;border-radius:9px;color:var(--amber);font-size:19px;font-weight:800}.rule p{margin:1px 0 0;font-size:12px;line-height:1.45;color:#d2d0d9}.rule b{color:var(--ink)}.primary{display:block;width:100%;margin-top:22px;padding:14px 18px;background:var(--amber);color:var(--black);border:0;border-radius:12px;font-size:15px;font-weight:800;transition:background-color 120ms ease-out}.best{font-size:11px;color:var(--muted);text-align:center;min-height:0;margin:11px 0 0}.best:empty{display:none}.resultCard{text-align:center}.resultCard .cardBody{padding:34px 28px}.resultPanda{font-size:53px;margin-bottom:17px}.resultAmount{font-size:64px;font-weight:850;margin:22px 0;color:var(--amber);font-variant-numeric:tabular-nums;line-height:1}.resultStats{display:flex;justify-content:center;gap:44px;margin:21px 0}.resultStats b{font-size:27px;display:block}.resultStats span{display:block;font-size:12px;color:var(--muted);margin-top:4px}
@media(hover:hover){button:hover{filter:brightness(1.08)}}@media(max-width:600px){.keyHint{display:none}.overlay{padding:14px}.cardBody{padding:21px}.hero{height:140px}.controls{left:12px;right:12px;bottom:calc(14px + env(safe-area-inset-bottom,0px))}.controls button{min-width:58px;height:61px;border-radius:16px}.pedals button{width:70px}.speed{right:17px;bottom:calc(111px + env(safe-area-inset-bottom,0px))}.pill{min-width:70px}.card h1{font-size:25px}}@media(max-height:650px){.overlay{align-items:flex-start;padding:12px}.hero{height:100px}.cardBody{padding:16px 21px}.lead{margin:12px 0}.rule{margin:10px 0}.primary{margin-top:14px}.keyHint{display:none}.resultCard{margin:auto}.resultAmount{font-size:48px;margin:14px 0}.resultPanda{display:none}}@media(prefers-reduced-motion:reduce){button{transition:none}}
/* Arcade extensions reuse the established scene/HUD design, not a new skin. */
.level{display:inline-block;margin:7px 0 0 3px;padding:3px 7px;border-radius:6px;background:rgba(5,5,6,.8);font-size:10px;color:#dedbd4}
.healthPill{min-width:68px}.healthPill b{font-size:19px}.leaderboard{margin-top:16px;border-top:1px solid var(--line);padding-top:12px;font-size:13px}.leaderboard summary{cursor:pointer;touch-action:manipulation;min-height:24px}.leaderboard ol{list-style:none;padding:0;margin:10px 0;max-height:220px;overflow:auto;touch-action:pan-y}.leaderboard li{display:flex;justify-content:space-between;gap:12px;padding:8px 0;border-bottom:1px solid var(--line)}.leaderboard li span{overflow-wrap:anywhere}.leaderboard li strong{white-space:nowrap;color:var(--amber)}.scoreForm{text-align:left;margin:18px 0 8px}.scoreForm label{display:block;font-size:13px;margin-bottom:7px;font-weight:700}.scoreForm>div{display:flex;gap:8px}.scoreForm input{min-width:0;flex:1;background:#0d0e12;border:1px solid #646472;border-radius:9px;padding:12px;color:var(--ink);font:inherit;touch-action:auto;user-select:text;-webkit-user-select:text}.scoreForm input:focus{outline:2px solid var(--amber);outline-offset:2px}.scoreForm button{border:0;border-radius:9px;padding:10px 12px;font-size:13px;font-weight:700;background:var(--amber);color:var(--black);touch-action:manipulation}.scoreForm small{display:block;color:var(--muted);font-size:11px;line-height:1.5;margin-top:8px}#scoreStatus{overflow-wrap:anywhere;min-height:1.3em}.scoreForm.hidden{display:none}
@media(max-width:600px){.hudRow{gap:5px}.pill{min-width:62px;padding:6px 8px}.pill b{font-size:18px}.healthPill{min-width:60px}.hudRow #muteButton{width:40px;min-width:36px}.scoreForm>div{flex-wrap:wrap}.scoreForm input{flex-basis:160px}.scoreForm button{flex:1}}


/* Genuine owner PNGs retain aspect ratio, with no redraw or color filter. */
.hero.brandHero{display:flex;align-items:center;justify-content:center;height:145px;background:#0c1115}.hero.brandHero .brandMark{display:block;width:112px;height:112px;object-fit:contain}.rule .instructionBrand{width:32px;height:32px;object-fit:contain;flex:0 0 32px}.originalResultBrand{display:block;width:64px;height:64px;object-fit:contain;margin:0 auto 12px}@media(max-height:650px){.hero.brandHero{height:104px}.hero.brandHero .brandMark{width:82px;height:82px}}
