@font-face{font-family:Chakra;src:url('../fonts/chakra-petch-700.woff2') format('woff2');font-weight:700;font-display:swap}
:root{--navy:#102f46;--paper:#f5f2e9;--red:#e94f37;--yellow:#ffd166;--muted:#a9cbdc;--panel:rgba(16,47,70,.96);--line:rgba(205,227,231,.22);font-family:system-ui,-apple-system,'PingFang SC','Microsoft YaHei',sans-serif;color:var(--paper);background:#a9d7e6;scrollbar-width:thin;scrollbar-color:#90afbb #173b4e}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden}body{overscroll-behavior:none;-webkit-tap-highlight-color:transparent}button,a,input,select{touch-action:manipulation}button,select{font:inherit}button,a{cursor:pointer}button{color:inherit}button:disabled{cursor:default;opacity:.48}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid var(--yellow);outline-offset:4px}a{color:inherit;text-underline-offset:4px}button{border:0}button:hover:not(:disabled){filter:brightness(1.12)}[hidden]{display:none!important}button:active:not(:disabled){transform:translateY(1px)}::-webkit-scrollbar{width:9px;height:9px}::-webkit-scrollbar-track{background:#173b4e}::-webkit-scrollbar-thumb{background:#90afbb;border:2px solid #173b4e;border-radius:8px}
#world{position:fixed;inset:0}#world canvas{width:100%;height:100%;display:block}.screen-shade{position:fixed;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(10,35,48,.12),transparent 28%,transparent 73%,rgba(10,35,48,.2))}
.overlay{position:fixed;inset:0;overflow:auto;scrollbar-gutter:stable;z-index:5}.setup{padding:clamp(20px,3.2vw,48px);padding-top:max(24px,env(safe-area-inset-top));background:linear-gradient(90deg,rgba(10,34,48,.70),rgba(10,34,48,.12) 60%,rgba(10,34,48,.35));display:flex;flex-direction:column;gap:24px}.menu-nav{display:flex;align-items:center;justify-content:space-between;gap:16px}.backlink,.langbtn{text-decoration:none;font-size:13px;font-weight:650;padding:10px 0}.langbtn{border:1px solid rgba(245,242,233,.5);padding:8px 15px;min-width:54px;text-align:center}.wordmark{font:700 13px Chakra,system-ui;letter-spacing:.14em}.wordmark i{color:var(--yellow);font-style:normal;padding:0 7px}.menu-layout{display:grid;grid-template-columns:1fr minmax(330px,390px);align-items:center;gap:60px;flex:1}.title-block{align-self:center;max-width:640px;padding-bottom:70px;text-shadow:0 2px 20px rgba(8,26,38,.3)}.kicker{font:700 11px Chakra,system-ui;letter-spacing:.17em;text-transform:uppercase;color:var(--muted)}.title-block>.kicker{color:var(--paper)}h1{font:700 clamp(52px,7.1vw,110px)/.96 Chakra,system-ui;margin:22px 0 26px;letter-spacing:-.035em;max-width:680px}html[data-lang=zh] h1{font-family:Chakra,'PingFang SC','Microsoft YaHei',sans-serif;font-size:clamp(48px,6vw,86px);line-height:1.12;letter-spacing:.02em}.title-rule{height:5px;width:76px;background:var(--red);margin-bottom:28px}.title-block h2{font-size:clamp(21px,2vw,30px);line-height:1.2;margin:0 0 12px;font-weight:650}.title-block>p{font-size:15px;line-height:1.75;color:#e0e7e2;margin:0;max-width:370px}.circuit-caption{margin-top:65px;display:flex;gap:15px;align-items:center;max-width:380px}.circuit-caption strong{display:block;font:700 20px Chakra,system-ui;margin-bottom:5px}.circuit-caption span:not(.flag-mark){font-size:12px;line-height:1.7;color:#e0e7e2;display:block}.flag-mark{width:24px;height:24px;flex:none;transform:skewY(-10deg);background:conic-gradient(var(--paper) 25%,transparent 0 50%,var(--paper) 0 75%,transparent 0) 0 0/12px 12px}
.setup-card{background:var(--panel);border:1px solid rgba(255,255,255,.25);padding:24px;box-shadow:0 18px 55px rgba(10,31,44,.22);align-self:center;display:flex;flex-direction:column;gap:17px}.card-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:1px}.roundel{font:700 16px Chakra;color:var(--muted);border:1px solid var(--line);width:33px;height:33px;display:grid;place-items:center;border-radius:50%}.field-label,label>span,.tyre-field>span{font-size:12px;color:var(--muted);display:block;margin-bottom:8px}.field-label{margin-bottom:-8px}.track-picker{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}.track-picker button{background:rgba(255,255,255,.035);border:1px solid var(--line);padding:7px 4px 10px;display:grid;gap:3px;text-align:center;min-width:0}.track-picker button[aria-pressed=true]{border-color:var(--yellow);background:rgba(255,209,102,.10)}.track-picker svg{width:100%;height:54px;stroke:#8dabb5;fill:none;stroke-width:4;stroke-linejoin:round}.track-picker [aria-pressed=true] svg{stroke:var(--yellow)}.track-picker span{font-size:11px;line-height:1.35}.track-meta{display:flex;justify-content:space-between;font:700 10px Chakra,system-ui;letter-spacing:.04em;color:var(--muted);margin-top:-6px;padding-bottom:14px;border-bottom:1px solid var(--line)}.settings-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}select{appearance:auto;color:var(--paper);background:#21475a;width:100%;border:1px solid #557282;border-radius:0;font-size:12px;padding:10px 8px;cursor:pointer;min-height:39px}.tyre-field{display:grid;grid-template-columns:60px 1fr;align-items:center}.tyre-field>span{margin:0}.auto-field{position:relative;display:flex;align-items:center;gap:10px;cursor:pointer}.auto-field>div{flex:1}.auto-field strong{font-size:12px;font-weight:600;display:block;margin-bottom:4px}.auto-field div span{color:var(--muted);font-size:10px;line-height:1.6;display:block;max-width:250px}.auto-field input{position:absolute;right:0;width:38px;height:24px;opacity:0;cursor:pointer}.switch{width:33px;height:19px;background:#4f6874;position:relative;border-radius:12px;flex:none;margin:0}.switch:before{content:'';position:absolute;top:3px;left:3px;width:13px;height:13px;border-radius:50%;background:var(--paper);transition:transform .15s}input:checked+.switch{background:var(--red)}input:checked+.switch:before{transform:translateX(14px)}input:focus-visible+.switch{outline:3px solid var(--yellow);outline-offset:4px}.best-row{display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--line);padding-top:13px;font-size:11px;color:var(--muted)}.best-row strong{font:700 15px Chakra,system-ui;color:var(--paper);font-variant-numeric:tabular-nums}
.primary,.secondary{width:100%;min-height:48px;padding:13px 17px;font-weight:700;font-size:14px;display:flex;justify-content:space-between;align-items:center;gap:14px;text-align:center}.primary{background:var(--red);color:white;justify-content:center}.primary:has(span+span){justify-content:space-between}.primary span+span{font-size:22px;line-height:1}.secondary{background:transparent;border:1px solid var(--line);justify-content:center}.setup-footer{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:-6px;font-size:10px;color:var(--muted)}.text-button{background:none;padding:6px 0;color:var(--muted);font-size:12px;text-decoration:underline;text-underline-offset:4px}.icon-button{background:rgba(14,44,60,.55);border:1px solid var(--line);width:40px;height:38px;display:grid;place-items:center;font-weight:700;font-size:17px;padding:0}.setup-footer .icon-button{width:29px;height:29px;font-size:14px}.menu-footer{display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px 24px;color:#f1f2e7;font-size:10px;line-height:1.7}.touch-hint{display:none}
#loading{position:fixed;inset:0;display:grid;place-items:center;background:var(--navy);z-index:20;font-size:18px}.hud-top{position:fixed;top:max(20px,env(safe-area-inset-top));left:max(24px,env(safe-area-inset-left));right:max(24px,env(safe-area-inset-right));display:flex;justify-content:space-between;align-items:flex-start;gap:20px;pointer-events:none}.hud-label{display:block;font:700 10px Chakra,system-ui;letter-spacing:.08em;color:#d1e0e3;line-height:1.6}.position-badge{padding:10px 18px 8px;background:rgba(16,47,70,.9);border-left:4px solid var(--red)}.position-badge strong{font:700 48px/.95 Chakra;display:inline-block;letter-spacing:-2px}.position-badge>span:last-child{color:var(--muted);font:700 15px Chakra;padding-left:6px}.timing{display:flex;gap:25px;background:rgba(16,47,70,.83);padding:12px 20px;align-items:center}.timing strong{font:700 25px/1.1 Chakra;font-variant-numeric:tabular-nums}.timing b{font:700 19px Chakra;font-variant-numeric:tabular-nums}.lap-badge{border-right:1px solid var(--line);padding-right:22px}.race-actions{display:flex;gap:8px;pointer-events:auto}.race-actions .icon-button{width:42px;height:42px;background:rgba(16,47,70,.9)}
.map-panel{position:fixed;bottom:25px;left:26px;display:flex;flex-direction:column;align-items:center;pointer-events:none;text-shadow:0 1px 6px #173b4e}.map-panel canvas{width:180px;height:150px}.map-panel>span{font:700 11px Chakra,system-ui;letter-spacing:.08em}.map-best{font-size:10px;margin-top:9px;display:flex;gap:15px}.map-best b{font:700 13px Chakra;font-variant-numeric:tabular-nums}.telemetry{position:fixed;right:28px;bottom:24px;width:202px;background:rgba(16,47,70,.85);padding:15px 18px;pointer-events:none}.speed-readout{display:flex;justify-content:space-between;gap:15px;align-items:center}.gear{display:flex;flex-direction:column;align-items:center;border:1px solid var(--line);padding:3px 10px;margin-top:6px}.gear b{font:700 31px/1.2 Chakra}.gear span{font:700 8px Chakra;color:var(--muted);letter-spacing:.06em}.speed-readout>div:last-child{text-align:right}.speed-readout strong{font:700 62px/.95 Chakra;letter-spacing:-2px;font-variant-numeric:tabular-nums;display:block}.speed-readout>div:last-child>span{font-size:10px;color:var(--muted)}.rpm{margin:9px 0 12px;height:4px;background:linear-gradient(90deg,var(--red) var(--rpm,0%),rgba(255,255,255,.18) var(--rpm,0%))}.resource{display:grid;grid-template-columns:1fr auto;font-size:9px;margin-top:8px;color:#d3e2e5;gap:4px}.resource b{font:700 11px Chakra}.resource i{grid-column:1/-1;display:block;height:3px;background:rgba(255,255,255,.14)}.resource i span{height:100%;display:block;background:#a9cbdc}.resource i span.low{background:var(--yellow)}.utility-actions{position:fixed;top:126px;right:26px;display:flex;gap:8px}.utility-actions button{background:rgba(16,47,70,.85);border:1px solid var(--line);min-width:62px;min-height:34px;padding:7px 13px;font-size:10px;font-weight:650}.utility-actions button[aria-pressed=true]{background:var(--yellow);color:var(--navy)}.pit-status{position:fixed;top:26%;left:50%;transform:translateX(-50%);padding:12px 20px;background:var(--yellow);color:var(--navy);font-size:13px;font-weight:700;text-align:center;max-width:85%}
#countdown{position:fixed;top:32%;left:0;right:0;pointer-events:none;text-align:center;font:700 clamp(80px,14vw,150px)/1 Chakra;color:var(--paper);text-shadow:0 3px 20px rgba(12,36,45,.6)}#notice{position:fixed;left:50%;transform:translate(-50%,-8px);top:22%;padding:10px 18px;background:rgba(16,47,70,.9);color:var(--paper);font:700 15px Chakra,system-ui;text-align:center;max-width:85%;opacity:0;pointer-events:none;transition:opacity .15s,transform .15s;z-index:10}#notice.visible{opacity:1;transform:translate(-50%,0)}.centered{display:grid;place-items:center;padding:25px;background:rgba(9,30,43,.72)}.dialog-card{width:min(410px,100%);background:var(--panel);border:1px solid var(--line);padding:32px;display:flex;flex-direction:column;gap:17px;box-shadow:0 22px 70px rgba(5,20,30,.2)}.dialog-card h2{font:700 30px/1.2 Chakra,system-ui;margin:0}.dialog-card p{font-size:13px;line-height:1.7;color:var(--muted);margin:0}.help-card{width:min(540px,100%)}.help-card ol{padding-left:21px;margin:0;color:#d1e0e3;font-size:13px;line-height:1.8}.help-card li{padding-left:6px;margin:10px 0}.help-card .keyboard-help{font-size:10px}.result-card{width:min(540px,100%);gap:15px}.result-head{display:flex;align-items:center;justify-content:space-between;gap:20px}.result-head h2{font-size:23px;margin-top:8px;max-width:310px}.finish-position{display:flex;flex-direction:column;align-items:center;flex:none}.finish-position strong{font:700 59px/1 Chakra;color:var(--yellow);font-variant-numeric:tabular-nums}.finish-position span{font-size:9px;color:var(--muted)}.result-stats{display:grid;grid-template-columns:1fr 1fr;border-block:1px solid var(--line);padding:13px 0;gap:25px}.result-stats span{display:block;font-size:10px;color:var(--muted);margin-bottom:4px}.result-stats b{font:700 24px Chakra;font-variant-numeric:tabular-nums}.result-card .record{color:var(--yellow);font-size:11px}.result-card table{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums;font-size:12px}.result-card th{font-size:9px;color:var(--muted);font-weight:500;text-align:left;padding:0 8px 6px}.result-card td{padding:6px 8px;border-top:1px solid rgba(255,255,255,.07)}.result-card tr.is-player{background:rgba(233,79,55,.18);color:var(--yellow)}.result-card td:last-child,.result-card th:last-child{text-align:right;font-family:Chakra,system-ui}.noscript{position:fixed;inset:0;z-index:30;background:var(--navy);display:grid;place-items:center;color:var(--paper);padding:25px}
#touchControls{display:none;position:fixed;left:max(20px,env(safe-area-inset-left));right:max(20px,env(safe-area-inset-right));bottom:max(20px,env(safe-area-inset-bottom));justify-content:space-between;gap:20px;pointer-events:none}.steering-buttons,.pedal-buttons{display:flex;gap:12px;align-items:flex-end;pointer-events:auto}#touchControls button{user-select:none;-webkit-user-select:none;touch-action:none;background:rgba(16,47,70,.6);border:1px solid rgba(245,242,233,.45);border-radius:8px;width:72px;height:65px;font-size:47px;line-height:1;font-weight:700;backdrop-filter:blur(4px)}#touchControls button[data-drive=brake]{background:rgba(172,54,43,.7);font-size:12px;width:77px;height:60px}#touchControls button[data-drive=gas]{font-size:12px;height:78px}#touchControls button.held{background:var(--paper);color:var(--navy)}
@media(min-width:1600px){.menu-layout{gap:100px;grid-template-columns:1fr 420px}.setup-card{padding:30px;gap:20px}}
@media(max-height:750px) and (min-width:851px){.setup{gap:12px;padding:20px 32px}.setup-card{padding:18px 22px;gap:12px}.title-block{padding-bottom:30px}h1{font-size:clamp(48px,7vw,90px)}.circuit-caption{margin-top:40px}.menu-footer{font-size:9px}.track-picker svg{height:44px}}
@media(max-width:1000px){.menu-layout{gap:30px;grid-template-columns:1fr 350px}.title-block{padding-bottom:30px}.title-block h2{font-size:24px}.wordmark{font-size:11px}.timing{gap:16px;padding:12px 15px}.race-total{display:none}.lap-badge{padding-right:16px}.circuit-caption{margin-top:40px}}
@media(max-width:720px){.setup{padding:18px;gap:25px;display:block;background:linear-gradient(180deg,rgba(10,34,48,.45),rgba(10,34,48,.4) 40%,rgba(10,34,48,.85))}.menu-nav{margin-bottom:30px}.wordmark{font-size:9px}.menu-layout{display:flex;flex-direction:column;gap:26px;align-items:stretch}.title-block{max-width:none;padding:0;align-self:stretch}.title-block>.kicker{font-size:9px}h1{font-size:58px;margin:12px 0 18px;max-width:350px}html[data-lang=zh] h1{font-size:43px;margin:16px 0 18px}.title-rule{width:45px;height:4px;margin-bottom:17px}.title-block h2{font-size:19px;margin-bottom:7px}.title-block>p{font-size:12px}.circuit-caption{display:none}.setup-card{width:100%;padding:20px;gap:16px;max-width:450px;align-self:stretch}.menu-footer{margin-top:18px;display:block;font-size:9px}.menu-footer>span{display:block;margin-top:6px}.menu-footer .touch-hint{display:none}.hud-top{top:max(12px,env(safe-area-inset-top));left:12px;right:12px;gap:8px}.position-badge{padding:8px 10px;border-left-width:3px}.hud-label{font-size:8px}.position-badge strong{font-size:34px}.position-badge>span:last-child{font-size:11px;padding-left:4px}.timing{padding:9px 12px;gap:12px}.timing strong{font-size:19px}.timing b{font-size:14px}.lap-badge{padding-right:12px}.race-actions{gap:5px;flex-direction:column}.race-actions .icon-button{width:32px;height:30px;font-size:14px}.map-panel{left:12px;bottom:23px}.map-panel canvas{width:126px;height:105px}.map-panel>span{font-size:9px}.map-best{font-size:8px;gap:6px}.map-best b{font-size:10px}.telemetry{right:12px;bottom:18px;width:149px;padding:12px}.speed-readout strong{font-size:45px}.gear{padding:2px 7px}.gear b{font-size:23px}.gear span{font-size:6px}.speed-readout>div:last-child>span{font-size:8px}.rpm{margin:7px 0 9px}.resource{margin-top:6px;font-size:8px}.resource b{font-size:9px}.utility-actions{top:98px;right:12px;gap:5px}.utility-actions button{min-width:48px;min-height:32px;font-size:9px;padding:6px 10px}.centered{padding:16px}.dialog-card{padding:26px;gap:16px}.result-card{padding:23px}.result-head h2{font-size:21px}.finish-position strong{font-size:45px}.result-stats b{font-size:21px}.result-card table{font-size:11px}#notice{top:24%;font-size:12px;max-width:88%;width:max-content}#countdown{top:36%}}
@media(pointer:coarse),(max-width:900px){#touchControls{display:flex}.telemetry{bottom:118px}.map-panel{bottom:120px}.menu-footer>span:not(.touch-hint),.keyboard-help{display:none}.touch-hint,.menu-footer .touch-hint{display:block}}
@media(pointer:coarse) and (max-height:550px),(max-width:900px) and (max-height:550px){.setup{padding:12px 22px;gap:8px}.menu-nav{margin-bottom:8px}.menu-layout{display:grid;grid-template-columns:1fr 300px;gap:20px}.title-block{padding:20px 0}h1,html[data-lang=zh] h1{font-size:43px}.title-block h2{font-size:17px}.title-block>p{font-size:11px}.title-rule{margin-bottom:15px}.setup-card{padding:16px;gap:10px}.track-picker svg{height:35px}.auto-field div span{font-size:9px}.menu-footer{display:none}.telemetry{bottom:112px;width:140px;padding:10px}.map-panel{bottom:110px;left:17px}.map-panel canvas{width:115px;height:95px}.map-panel>span,.map-best{display:none}.utility-actions{top:92px}.timing{padding:8px 15px}#touchControls{bottom:12px}#touchControls button{width:64px;height:55px}#touchControls button[data-drive=gas]{height:65px}#touchControls button[data-drive=brake]{height:50px}.result-card{padding:20px;gap:12px}.result-card table td{padding:4px 8px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition:none!important;scroll-behavior:auto!important}}
@media(max-width:900px) and (max-height:550px){.utility-actions{top:auto;bottom:22px;right:50%;transform:translateX(50%)}}
@media(max-width:420px){#touchControls{left:14px;right:14px;gap:12px}.steering-buttons,.pedal-buttons{gap:8px}#touchControls button{width:62px;height:61px}#touchControls button[data-drive=brake]{width:66px;height:55px}#touchControls button[data-drive=gas]{height:73px}}
@media(forced-colors:active){button,a,input,select{forced-color-adjust:auto}.switch{border:1px solid ButtonText}.track-picker button[aria-pressed=true]{outline:2px solid Highlight}}
