:root{--acid:#cefb64;--muted:#a3afc1;--edge:#3d485f;--paper:#edf1e5}
html{scroll-behavior:smooth;scroll-padding:18px}body{min-width:280px}button,a,select,input{-webkit-tap-highlight-color:transparent}button{min-height:44px}button:focus-visible,select:focus-visible,input:focus-visible{outline:2px solid var(--acid);outline-offset:3px}button[hidden],[hidden]{display:none!important}
header{gap:18px}.brand{font-size:13px;letter-spacing:1px}.header-actions{display:flex;gap:8px}.header-actions button{font-size:12px;padding:10px 13px}.header-actions .install-button{border-color:#cefb6477;color:var(--acid);background:#cefb6410}
.intro{margin-top:2px;padding:24px 24px 21px}.edition{font-size:11px;letter-spacing:1.6px;color:#b9c4d6;margin-bottom:21px;display:flex;align-items:center;gap:9px}.edition-dot{width:6px;height:6px;background:var(--acid);box-shadow:0 0 12px #cefb6470}.language-badge{font-size:10px;letter-spacing:0;border:1px solid #7d8b6755;background:#cefb6410;padding:3px 5px;color:var(--acid)}.eyebrow{font-size:11px;letter-spacing:2px}h1{font-size:clamp(38px,5.5vw,66px);margin:12px 0 2px}.intro-copy p{font-size:14px;margin:0 0 17px}.app-status{font-size:11px;color:#b2bfcd;display:flex;flex-wrap:wrap;align-items:center;gap:8px}.app-status [data-ready=true]{color:var(--acid)}#update-app{font-size:11px;min-height:28px;padding:5px 8px}
.screen{isolation:isolate;overflow:hidden}.race-actions{display:flex;align-items:center;justify-content:flex-end;gap:6px;padding:7px 10px;background:#171f30;border-bottom:1px solid #3d485f}.race-actions button{font-size:11px;min-height:32px;padding:6px 10px;background:#222e42}.hud{font-size:12px;padding:12px;gap:8px;min-height:40px;align-items:center}.hud:first-of-type{border-bottom:1px solid #2f3a4c}.track-hud{font-size:11px;background:#141d2b}.under{font-size:12px;line-height:1.5}.under>span:last-child{white-space:nowrap;font-size:10px;letter-spacing:1px}
.sidebar{padding:18px}h2{font-size:14px}.characters{gap:6px}.character{min-height:0;transition:border-color .15s,background .15s}.character[aria-pressed=true]{box-shadow:inset 0 -3px 0 var(--acid)}label{font-size:11px;letter-spacing:1px}select{font-size:12px;min-height:45px}#progress{font-size:11px!important;line-height:1.6}.controls{font-size:11px;line-height:1.8}.touch-help{display:none;color:var(--acid);font-size:11px;letter-spacing:1px;border-top:1px solid #343b44;margin-top:18px;padding-top:14px}.touch-help span{display:block;color:#b2bfcd;letter-spacing:0;line-height:1.7;margin-top:5px}
.scoreboard{padding:23px;background:#141d2bf0}.scoreboard h2{font-size:16px}.scoreboard h2 small{color:#b1becb;font-size:11px}.scoreboard #notice{font-size:12px;color:#a9b5c5;line-height:1.7;max-width:650px;margin-bottom:12px}#refresh-scores{font-size:10px;min-height:34px;padding:8px 12px}.scoreboard ol{padding-left:30px;margin:15px 0 0}.scoreboard li{font-size:13px;border-bottom:1px solid #2a3445;padding:12px 2px}.scoreboard li::marker{color:#7b8ba2}.scoreboard li:first-child{color:var(--acid)}footer{display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;font-size:10px;line-height:1.7}
.touch-controls{display:none;touch-action:none;user-select:none;-webkit-user-select:none;gap:10px;align-items:center;justify-content:space-between;padding:10px 12px;background:#121c2c}.steering,.pedals{display:flex;gap:8px}.pedals{align-items:center}.drive-button,.item-button{width:58px;height:58px;min-height:0;padding:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;font-size:23px;border:1px solid #69819e;background:#253852ed;color:#ecf3e9;box-shadow:0 3px 0 #080f1a;touch-action:none;user-select:none;-webkit-user-select:none}.drive-button small,.item-button small{font-size:9px;letter-spacing:.6px}.drive-button.gas{background:#cefb64e8;color:#172212;border-color:#e6ffa1}.drive-button.brake{background:#493349ed;border-color:#9a7c8d}.item-button{width:50px;height:50px;border-radius:50%;font-size:23px;background:#40334de8;border-color:#a78abb}.item-button:disabled{opacity:.4}.drive-button.is-held,.drive-button:active,.item-button:active{transform:translateY(2px);box-shadow:none;border-color:#fff}.drive-button:disabled{opacity:.4;transform:none}
.panel{border-color:#798863;box-shadow:6px 6px 0 #050708;padding:24px}.panel h2{font-size:25px;line-height:1.15}.panel p{font-size:13px}.panel button{font-size:12px}.panel form{margin-top:12px}.panel input{font-size:16px}.panel .secondary{display:block;background:transparent;border-color:#66748a;font-size:11px}
dialog{color:var(--paper);background:#182234;border:1px solid #798863;max-width:480px;width:calc(100% - 32px);padding:30px;line-height:1.7;box-shadow:8px 8px 0 #070c14}dialog::backdrop{background:#070b15db;backdrop-filter:blur(4px)}dialog h2{font-size:25px;margin-top:14px;line-height:1.2;color:var(--acid)}dialog p{font-size:13px}dialog .muted{color:#aab8c9;font-size:11px}.dialog-close{position:absolute;top:6px;right:8px;background:transparent;border:0;font-size:24px;padding:0 10px}
body.race-mode{overflow:hidden}.race-mode #race-shell{position:fixed;inset:0;z-index:30;border:0;display:flex;flex-direction:column;align-items:stretch;background:#070e19;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);height:100dvh}.race-mode #race{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:min(100%,calc((100dvh - 65px)*1.6));height:auto;max-height:calc(100dvh - 65px);object-fit:contain;z-index:-1}.race-mode .race-actions{position:absolute;top:calc(env(safe-area-inset-top) + 40px);left:50%;transform:translateX(-50%);padding:0;background:transparent;border:0;z-index:3}.race-mode .race-actions button{background:#172539d9}.race-mode .hud{z-index:2;background:#141e2ee8;flex-shrink:0}.race-mode .track-hud{margin-top:auto;padding-bottom:10px}.race-mode .touch-controls{position:absolute;bottom:calc(env(safe-area-inset-bottom) + 40px);left:0;right:0;padding:10px 20px;background:transparent;pointer-events:none;z-index:3}.race-mode .touch-controls button{pointer-events:auto}.race-mode .overlay{z-index:5;padding:15px max(15px,env(safe-area-inset-right)) 15px max(15px,env(safe-area-inset-left))}.race-mode .overlay:not([hidden])~.touch-controls{visibility:hidden}
@media(any-pointer:coarse){.touch-controls{display:flex}.touch-help{display:block}.controls{margin-top:14px;padding-top:12px}.race-mode .drive-button{width:64px;height:60px}.race-mode .item-button{width:54px;height:54px}}
@media(max-width:880px){.intro{align-items:flex-start;display:flex}.intro-copy{max-width:230px;padding-top:40px}.sidebar{display:grid;grid-template-columns:1fr 1fr;gap:24px}.sidebar h2{margin-bottom:14px}.controls{margin-top:15px}.edition{font-size:9px;letter-spacing:1px}.eyebrow{font-size:10px}.detail{min-height:0}.touch-help{margin-top:14px}}
@media(max-width:550px){header{padding:12px 16px;flex-wrap:wrap;gap:12px}.brand{font-size:10px}.header-actions{margin-left:auto}.header-actions button{font-size:10px;padding:8px 10px;min-height:38px}main{padding:14px}.intro{display:block;padding:18px 17px;margin-bottom:16px}.intro-copy{max-width:none;padding-top:16px}.intro-copy p{font-size:12px;line-height:1.6;margin:0 0 10px}.intro-copy p br{display:none}.edition{margin-bottom:18px}h1{font-size:47px;letter-spacing:-2px}.eyebrow{font-size:9px;letter-spacing:1.3px}.app-status{font-size:10px}.layout{gap:16px}.sidebar{display:block;padding:18px}.sidebar>div+div{border-top:1px solid #384459;margin-top:18px;padding-top:2px}.characters{grid-template-columns:repeat(8,minmax(0,1fr));gap:4px}.detail{margin-top:12px}.detail p{font-size:11px}.detail p br{display:none}.detail strong{font-size:13px}.character{padding:0;aspect-ratio:3/4}.sidebar h2{font-size:12px}#start{font-size:13px}.under>span:last-child{display:none}.scoreboard{margin-top:16px;padding:18px}.scoreboard h2{font-size:13px}.drive-button{width:51px;height:54px}.item-button{width:44px;height:44px}.touch-controls{padding:10px}.steering,.pedals{gap:6px}.race-mode #race{width:100%;max-height:calc(100dvh - 160px);top:45%}.race-mode .touch-controls{bottom:calc(env(safe-area-inset-bottom) + 56px);padding:12px 14px}.race-mode .track-hud{font-size:10px}.race-mode .drive-button{width:57px;height:62px}.panel{padding:20px}.panel h2{font-size:23px}}
@media(max-height:520px) and (orientation:landscape){.race-mode .hud{font-size:10px;padding:8px 14px;min-height:30px}.race-mode .race-actions{top:calc(env(safe-area-inset-top) + 35px)}.race-mode .race-actions button{font-size:10px;min-height:29px;padding:5px 8px}.race-mode .race-actions span{display:none}.race-mode #race{width:min(100%,calc((100dvh - 50px)*1.6));max-height:calc(100dvh - 50px);top:50%}.race-mode .touch-controls{bottom:calc(env(safe-area-inset-bottom) + 33px);padding:7px 16px}.race-mode .drive-button{width:58px;height:54px}.race-mode .item-button{width:49px;height:49px}.panel{max-width:540px;padding:16px 24px}.panel h2{font-size:22px;margin-bottom:6px}.panel p{margin:6px 0;line-height:1.5}.panel button{margin-top:8px;min-height:40px;padding:9px 13px}.panel label{margin-top:8px}.panel input{padding:8px}.panel form{margin-top:7px}.panel form button{margin-left:8px}.panel form input{width:55%}.panel form label{margin-bottom:5px}}
@media(max-width:360px){.touch-controls{align-items:flex-end}.pedals{display:grid;grid-template-columns:repeat(2,max-content)}.pedals .item-button{grid-column:1/-1;justify-self:end}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}
