:root{--bg:#12191d;--panel:#1b2429;--line:#344047;--muted:#9ba9b0;--text:#f5f2eb;--accent:#ff613c}*{box-sizing:border-box}body{background:var(--bg);color:var(--text);margin:0;font-family:Arial,Hiragino Kaku Gothic ProN,Noto Sans JP,sans-serif;font-size:16px}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline-offset:4px;outline:3px solid #ffd15c}button{border:0}a{color:inherit;text-decoration:none}.game-shell{max-width:1800px;margin:auto;padding:0 36px}.topbar{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;height:88px;display:flex}.brand{letter-spacing:-1px;align-items:center;gap:9px;font-size:25px;font-weight:900;display:flex}.brand-mark{background:var(--accent);color:var(--bg);padding:4px 8px;font-style:italic;transform:skew(-8deg)}.brand-divider{background:var(--line);width:1px;height:22px;margin:0 15px}.brand small{letter-spacing:2px;color:var(--muted);font-size:12px;font-weight:500}.session{letter-spacing:1.3px;align-items:center;gap:12px;font-size:12px;font-weight:600;display:flex}.session-dot{background:var(--accent);border-radius:50%;width:6px;height:6px}.session-number{color:var(--muted);margin-left:12px}.race-header{justify-content:space-between;align-items:center;padding:30px 0;display:flex}.eyebrow{letter-spacing:2px;color:var(--accent);margin:0 0 12px;font-size:12px;font-weight:700}h1{letter-spacing:.04em;margin:0;font-size:26px;font-weight:700}h1 span{color:var(--muted);letter-spacing:.02em;margin-left:20px;font-size:13px;font-weight:400}.race-spec{gap:32px;display:flex}.race-spec>div{align-items:baseline;gap:8px;display:flex}.race-spec strong{letter-spacing:-1px;font-size:25px;font-weight:500}.race-spec span{color:var(--muted);font-size:12px}.race-spec .view-spec{border-left:1px solid var(--line);flex-direction:column;gap:4px;padding-left:24px}.view-spec strong{font-size:14px}.workspace{grid-template-columns:minmax(0,1fr) 280px;gap:20px;display:grid}.track-panel{background:radial-gradient(at 50% 45%,#667374 0%,#495657 60%,#344246 100%);border:1px solid #49545a;border-radius:4px;min-height:620px;position:relative;overflow:hidden}.viewport{position:absolute;inset:0}.viewport canvas{width:100%;height:100%;display:block}.track-label{letter-spacing:1.5px;color:#f4f2e9;pointer-events:none;align-items:center;gap:8px;font-size:12px;font-weight:700;display:flex;position:absolute;top:22px;left:24px}.track-label>span:last-child{color:#d8e0dc;letter-spacing:0;margin-left:12px;font-size:12px;font-weight:400}.live-dot{background:#ffb06c;border-radius:50%;width:6px;height:6px}.start-card{border:1px solid #566167;border-top:3px solid var(--accent);background:#12191df2;width:290px;padding:26px 28px;position:absolute;bottom:65px;left:28px;box-shadow:0 15px 40px #0003}.start-card h2{letter-spacing:.06em;margin:0 0 14px;font-size:30px;line-height:1.5}.start-card p:not(.eyebrow){color:#b9c4c8;margin:0 0 20px;font-size:14px;line-height:1.9}.primary{background:var(--accent);color:#111a1e;border-radius:2px;justify-content:space-between;align-items:center;width:100%;padding:16px 18px;font-size:14px;font-weight:700;transition:background .15s;display:flex}.primary:hover{background:#ff805e}.primary span{font-size:22px;line-height:16px}.keyboard-note{text-align:center;color:var(--muted);margin-top:12px;font-size:12px;display:block}.viewport-footer{letter-spacing:1px;color:#c4cecc;background:#172126d9;border-top:1px solid #74818466;justify-content:space-between;align-items:center;height:42px;padding:0 24px;font-size:12px;display:flex;position:absolute;bottom:0;left:0;right:0}.viewport-footer b{margin-left:10px;font-weight:500}.viewport-footer i{background:#647177;width:1px;height:10px;margin:0 12px;display:inline-block}.sidebar{flex-direction:column;gap:18px;display:flex}.sidebar section{border:1px solid var(--line);background:var(--panel);border-radius:3px;overflow:hidden}.section-title{justify-content:space-between;align-items:center;padding:16px 16px 12px;display:flex}.section-title h2{margin:0;font-size:14px;font-weight:500}.section-title>span{letter-spacing:1px;color:var(--muted);font-size:12px}ol{margin:0;padding:0;list-style:none}.standings li{border-top:1px solid #2d393f;align-items:center;gap:12px;padding:12px 16px;display:flex}.standings li.you{border-left:3px solid var(--accent);background:#ff613c0c;padding-left:13px}.rank{color:var(--muted);font-family:monospace;font-size:13px}.car-swatch{border-radius:2px;width:8px;height:20px;transform:skew(-12deg)}.standings li>div{flex-direction:column;gap:4px;display:flex}.standings strong{letter-spacing:1px;font-size:13px;font-weight:600}.standings li>div>span{color:var(--muted);letter-spacing:.5px;font-size:12px}.driver-status{color:var(--muted);margin-left:auto;font-family:monospace;font-size:12px}.map-section svg{width:100%;height:120px;padding:0 14px;display:block}.map-key{color:var(--muted);justify-content:space-between;padding:8px 16px 14px;font-size:12px;display:flex}.map-key i{background:var(--accent);border-radius:50%;width:6px;height:6px;margin-right:4px;display:inline-block}.controls dl{margin:0;padding:0 16px}.controls dl>div{justify-content:space-between;align-items:center;gap:4px;margin:9px 0;display:flex}.controls dt{white-space:nowrap;align-items:center;gap:4px;display:flex}.controls dt>span{color:var(--muted);font-size:12px}kbd{text-align:center;background:#29353c;border:1px solid #53616a;border-bottom-width:2px;border-radius:3px;min-width:20px;height:22px;padding:3px 4px;font:12px/14px monospace}.controls dd{color:#c7cfd2;margin:0;font-size:12px}.controls p{color:var(--muted);margin:12px 0 0;padding:0 16px 14px;font-size:12px;line-height:1.8}.bottom-bar{color:var(--muted);justify-content:space-between;align-items:center;gap:12px;padding:22px 0;font-size:12px;display:flex}.bottom-bar i{background:var(--accent);border-radius:50%;width:5px;height:5px;margin-right:9px;display:inline-block}.footer-right{letter-spacing:1.6px;font-size:12px}.bottom-bar button{color:var(--text);border:1px solid var(--line);background:0 0;border-radius:3px;padding:8px 14px;font-size:13px}.telemetry{pointer-events:none;background:#172126ef;border:1px solid #6c7a7e77;border-radius:3px;display:flex;position:absolute;top:58px;right:24px}.telemetry>div{border-right:1px solid var(--line);flex-direction:column;gap:6px;padding:12px 18px;display:flex}.telemetry>div:last-child{border:0}.telemetry span{color:#aebcc1;letter-spacing:1.2px;font-size:12px}.telemetry strong{font:26px monospace}.telemetry small{color:#96a5ac;font-size:14px}.overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:20;background:#0c141975;justify-content:center;align-items:center;padding:20px;display:flex;position:absolute;inset:0}.dialog{background:#182227;border:1px solid #596970;width:min(420px,100%);padding:32px;box-shadow:0 25px 60px #0005}.dialog h2{margin:0 0 14px;font-size:26px}.dialog>p:not(.eyebrow){color:var(--muted);margin-bottom:24px;font-size:14px;line-height:1.8}.secondary{color:#d0dadd;background:0 0;width:100%;padding:15px;font-size:13px;display:block}.countdown{pointer-events:none;text-shadow:0 3px 24px #0007;flex-direction:column;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.countdown span{letter-spacing:.2em;font-size:16px}.countdown strong{font-size:130px;font-style:italic}.finish-toast{border-top:3px solid var(--accent);text-align:center;white-space:nowrap;background:#172126f2;flex-direction:column;gap:10px;padding:20px 30px;display:flex;position:absolute;bottom:65px;left:50%;transform:translate(-50%)}.finish-toast strong{font-size:24px}.finish-toast span{color:var(--muted);font-size:13px}table{border-collapse:collapse;width:100%;margin:20px 0}th{text-align:left;color:var(--muted);padding:10px 8px;font-size:12px;font-weight:400}td{border-top:1px solid var(--line);padding:13px 8px;font:14px monospace}td:last-child,th:last-child{text-align:right}td i{border-radius:50%;width:7px;height:7px;margin-right:8px;display:inline-block}tr.you{color:var(--accent)}.boot{flex-direction:column;justify-content:center;align-items:center;gap:20px;min-height:100vh;font-size:30px;font-weight:800;display:flex}.boot span{color:var(--muted);font-size:14px;font-weight:400}@media (min-width:1600px){.track-panel{min-height:730px}}@media (max-width:1100px){.game-shell{padding:0 20px}.workspace{grid-template-columns:minmax(0,1fr) 250px;gap:14px}.track-panel{min-height:640px}.race-spec{gap:16px}.race-spec .view-spec{display:none}.start-card{width:260px;padding:20px;bottom:58px;left:18px}.telemetry{right:14px}.telemetry>div{padding:10px}.track-label>span:last-child{display:none}}@media (max-width:800px){.topbar{height:70px}.brand small,.brand-divider,.session-dot,.session-number,h1 span{display:none}.session{font-size:12px}.race-header{padding:22px 0}h1{font-size:20px}.race-spec{gap:16px}.race-spec strong{font-size:20px}.race-spec>div{flex-direction:column;gap:4px}.workspace{flex-direction:column;display:flex}.track-panel{min-height:540px}.sidebar{grid-template-columns:1fr 1fr;gap:12px;display:grid}.standings{grid-row:span 2}.controls{grid-column:1/-1}.controls dl{grid-template-columns:1fr 1fr;column-gap:25px;display:grid}.controls p{font-size:12px}.footer-right{display:none}.start-card{width:250px;left:16px}.start-card h2{font-size:25px}.map-section svg{height:160px}}@media (max-width:480px){.game-shell{padding:0 12px}.track-panel{min-height:520px}.sidebar{grid-template-columns:1fr}.standings{grid-row:auto}.map-section svg{height:150px}.start-card{width:225px;padding:18px;bottom:55px}.start-card h2{font-size:24px}.telemetry{justify-content:space-between;top:52px;left:12px;right:12px}.telemetry strong{font-size:22px}.telemetry .time-value{font-size:20px}.viewport-footer{padding:0 12px;font-size:12px}.track-label{top:20px;left:16px}.race-spec span{font-size:12px}.result-dialog{padding:20px}.dialog h2{font-size:22px}.bottom-bar{flex-wrap:wrap}}.checkpoint-guide{pointer-events:none;background:#142027ed;border-left:3px solid #ffd15c;flex-wrap:wrap;align-items:center;gap:6px 16px;width:fit-content;max-width:calc(100% - 40px);padding:10px 14px;display:flex;position:absolute;top:146px;left:20px;right:20px}.checkpoint-guide strong{color:#ffd15c;font-size:14px}.checkpoint-guide span{color:#d0dadd;font-size:12px}.checkpoint-legend{color:var(--muted);margin:0;padding:0 16px 14px;font-size:12px;line-height:1.8}.map-section svg{height:180px}@media (max-width:480px){.checkpoint-guide{max-width:calc(100% - 24px);top:139px;left:12px;right:12px}.checkpoint-guide span{font-size:12px}}.personal-best .best-value{flex-wrap:wrap;align-items:center;gap:8px 16px;padding:0 16px;display:flex}.best-value strong{font-variant-numeric:tabular-nums;color:#ffd15c;font:28px monospace}.new-record{color:#ffd15c;font-size:12px;font-weight:700}.personal-best p{color:var(--muted);margin:10px 16px 16px;font-size:12px;line-height:1.7}.result-best strong{color:#ffd15c;white-space:nowrap;font-family:monospace;font-size:20px}.result-best span{margin-top:5px;font-size:12px;display:block}@media (max-width:800px){.personal-best{grid-column:1/-1}}.camera-controls{background:#192227;border:1px solid #354047;border-radius:12px;align-items:center;gap:24px;margin-bottom:16px;padding:14px 18px;font-size:12px;display:flex}.camera-controls label{white-space:nowrap;font-weight:700}.camera-controls output{color:#ff805c;font-variant-numeric:tabular-nums;min-width:42px;margin-left:12px;display:inline-block}.camera-slider{flex:1;align-items:center;gap:12px;display:flex}.camera-slider span{white-space:nowrap;color:#aebdc4}.camera-slider input{accent-color:#ff613c;cursor:pointer;flex:1;min-width:90px;height:28px}.camera-controls button{color:#e8eeef;cursor:pointer;white-space:nowrap;background:0 0;border:1px solid #526169;border-radius:6px;padding:8px 12px}.camera-controls :focus-visible{outline-offset:4px;outline:2px solid #ff805c}@media (max-width:800px){.camera-controls{flex-wrap:wrap;gap:10px}.camera-slider{flex-basis:100%;order:3;gap:8px}.camera-controls button{margin-left:auto}}.difficulty-controls{background:#192227;border:1px solid #354047;border-radius:12px;flex-wrap:wrap;align-items:center;gap:12px;margin-bottom:12px;padding:14px 18px;font-size:12px;display:flex}.difficulty-controls label{font-weight:700}.difficulty-controls select{color:#fff;background:#253139;border:1px solid #526169;border-radius:6px;padding:8px 14px}.difficulty-controls select:disabled{opacity:.7}.difficulty-controls small{color:#aebdc4;margin-left:auto}.difficulty-controls select:focus-visible{outline-offset:3px;outline:2px solid #ff805c}.stage-result{background:#ffd15c12;border-left:3px solid #ffd15c;padding:8px 10px;font-weight:700;color:#ffd15c!important;margin:4px 0 8px!important}.stage-result.locked{background:#71808712;border-color:#718087;color:#aebbc0!important}.game-shell{grid-template-rows:42px 56px auto minmax(0,1fr) 42px;gap:8px;max-width:none;height:100dvh;padding:0 18px;display:grid}.topbar{height:auto}.brand{font-size:20px}.brand small{font-size:10px}.race-header{padding:0}.race-header .eyebrow{margin-bottom:5px;font-size:10px}h1,.race-spec strong{font-size:21px}.settings-bar{grid-template-columns:1fr 1fr;gap:10px;min-width:0;display:grid}.difficulty-controls,.camera-controls{border-radius:6px;gap:10px;min-width:0;margin:0;padding:8px 12px}.difficulty-controls small{display:none}.difficulty-controls>span{font-size:11px}.difficulty-controls select{padding:6px 10px}.camera-slider{gap:6px;min-width:0}.camera-slider span{font-size:11px}.camera-slider input{width:100%;min-width:50px}.camera-controls output{min-width:34px;margin-left:6px}.camera-controls button{padding:6px 8px}.workspace{grid-template-columns:minmax(0,1fr) 250px;gap:12px;min-height:0}.track-panel{min-height:0}.sidebar{scrollbar-width:thin;gap:7px;min-height:0;overflow:auto}.sidebar section{flex-shrink:0}.section-title{padding:8px 10px 6px}.section-title h2{font-size:12px}.section-title>span{letter-spacing:0;font-size:10px}.personal-best .best-value{gap:6px;padding:0 10px}.best-value strong{font-size:22px}.personal-best p{margin:4px 10px 7px;font-size:10px;line-height:1.4}.standings li{gap:9px;padding:6px 10px}.standings li.you{padding-left:7px}.standings li>div>span{display:none}.car-swatch{height:14px}.standings strong{font-size:12px}.map-section svg{height:105px;padding:0 8px}.map-key{padding:3px 10px 5px;font-size:10px}.checkpoint-legend{padding:0 10px 6px;font-size:10px;line-height:1.35}.controls dl{padding:0 10px}.controls dl>div{margin:4px 0}.controls dd{font-size:11px}kbd{min-width:18px;height:20px;padding:2px 3px;font-size:11px}.controls p{margin:4px 0 0;padding:0 10px 7px;font-size:10px;line-height:1.4}.bottom-bar{padding:0;font-size:11px}.bottom-bar button{padding:6px 12px}.track-label{font-size:10px;top:12px;left:14px}.telemetry{top:36px;right:14px}.telemetry>div{gap:3px;padding:7px 12px}.telemetry strong{font-size:22px}.telemetry span{font-size:10px}.telemetry .time-value{font-size:21px}.checkpoint-guide{gap:4px 10px;max-width:calc(100% - 28px);padding:6px 9px;top:104px;left:14px;right:14px}.checkpoint-guide strong{font-size:12px}.checkpoint-guide span{font-size:10px}.viewport-footer{height:30px;padding:0 14px;font-size:10px}.start-card{width:250px;padding:16px 18px;bottom:44px;left:18px}.start-card h2{margin-bottom:8px;font-size:23px;line-height:1.3}.start-card p:not(.eyebrow){margin-bottom:12px;font-size:12px;line-height:1.5}.start-card .eyebrow{margin-bottom:7px;font-size:10px}.primary{padding:12px 14px}.keyboard-note{margin-top:6px;font-size:10px}.overlay{padding:12px}.dialog{max-height:100%;padding:18px;overflow:auto}.dialog h2{margin-bottom:8px;font-size:22px}.dialog>p:not(.eyebrow){margin:8px 0 12px;font-size:12px}.dialog .eyebrow{margin-bottom:8px}.dialog table{margin:10px 0}.dialog td,.dialog th{padding:8px}.finish-toast{padding:12px 18px;bottom:44px}@media (min-width:1200px) and (max-height:780px){.workspace{grid-template-columns:minmax(0,1fr) 420px}.sidebar{grid-template-rows:auto minmax(0,1fr);grid-template-columns:1fr 1fr;align-content:start;display:grid}.personal-best{grid-area:1/1}.map-section{grid-area:1/2}.standings{grid-area:2/1}.controls{grid-area:2/2}.sidebar section{align-self:start}.map-section svg{height:90px}.checkpoint-legend{font-size:10px}.standings li{padding-top:9px;padding-bottom:9px}}@media (max-width:1100px){.settings-bar{grid-template-columns:1fr}.difficulty-controls,.camera-controls{padding:5px 10px}.game-shell{grid-template-rows:36px 46px auto minmax(0,1fr) 36px;gap:6px}.brand-divider,.brand small,.race-header .eyebrow{display:none}.workspace{grid-template-columns:minmax(0,1fr) 230px}.footer-right{display:none}}@media (max-width:800px){.game-shell{grid-template-rows:36px 44px auto auto auto;height:auto;min-height:100dvh;padding:0 10px}.workspace{grid-template-columns:minmax(0,1fr);display:grid}.track-panel{height:clamp(300px,55dvh,560px);min-height:0}.sidebar{grid-template-columns:1fr 1fr;gap:8px;display:grid;overflow:visible}.sidebar section{grid-area:auto}.controls dl{display:block}.personal-best{grid-column:auto}.camera-controls{flex-wrap:nowrap}.camera-slider{flex-basis:auto;order:0}.camera-slider span{display:none}.camera-controls button{margin-left:0}.difficulty-controls>span{font-size:10px}.race-spec>div{flex-direction:row}.bottom-bar{min-height:36px}.start-card{width:220px}.start-card h2{font-size:20px}.start-card p:not(.eyebrow),.keyboard-note{display:none}.track-label{top:9px}.telemetry{top:29px;left:auto}.checkpoint-guide{top:96px}.checkpoint-guide span{display:none}}@media (max-height:650px) and (min-width:801px){.game-shell{grid-template-rows:32px 38px auto minmax(0,1fr) 32px;gap:5px}.start-card h2,.start-card p:not(.eyebrow),.keyboard-note{display:none}.start-card{width:230px;padding:10px}.dialog td,.dialog th{padding:5px}.sidebar{overflow:auto}.controls p,.checkpoint-legend{display:none}}.sound-controls{order:3;grid-column:1/-1;justify-content:flex-end;align-items:center;gap:10px;font-size:11px;display:flex}.sound-controls button{color:#fff;background:#253139;border:1px solid #526169;border-radius:5px;padding:5px 10px;font-size:11px}.sound-controls input{accent-color:#ff613c;width:100px}.sound-controls output{font-variant-numeric:tabular-nums;min-width:32px}.sound-controls input:focus-visible{outline-offset:3px;outline:2px solid #ff805c}.lap-notice{z-index:30;pointer-events:none;white-space:nowrap;background:#142027ed;border-top:2px solid #ffd15c;border-radius:6px;flex-direction:column;align-items:center;gap:8px;max-width:calc(100% - 24px);padding:16px 24px;animation:1.6s ease-out both lap-flash;display:flex;position:absolute;top:16px;left:50%;transform:translate(-50%);box-shadow:0 12px 32px #0004}.lap-notice strong{color:#ffd15c;letter-spacing:.02em;font-variant-numeric:tabular-nums;font:900 clamp(30px,4.5vw,64px)/1.1 monospace}.lap-notice>span{color:#fff;font-variant-numeric:tabular-nums;font:400 clamp(15px,1.8vw,22px) monospace}@keyframes lap-flash{0%{opacity:0;transform:translate(-50%,8px)scale(.92)}12%,48%{opacity:1;transform:translate(-50%)scale(1)}to{opacity:0;transform:translate(-50%,-8px)scale(1)}}@media (prefers-reduced-motion:reduce){.lap-notice{animation-name:lap-flash-reduced}@keyframes lap-flash-reduced{0%,60%{opacity:1}to{opacity:0}}}.debug-controls{border-color:#a77939;grid-column:1/-1}.debug-controls>strong{color:#ffd15c;letter-spacing:.12em}.touch-controller{z-index:40;padding:10px max(12px,env(safe-area-inset-right)) max(8px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left));-webkit-user-select:none;user-select:none;background:#12191df5;border-top:1px solid #526169;grid-template-columns:1fr auto 1fr;align-items:center;gap:6px 12px;display:grid;position:fixed;bottom:0;left:0;right:0}.touch-steering,.touch-pedals{gap:8px;display:flex}.touch-pedals{justify-content:flex-end}.touch-pad{color:#fff;touch-action:none;-webkit-touch-callout:none;background:#293a43;border:1px solid #64747b;border-radius:12px;flex-direction:column;justify-content:center;align-items:center;gap:4px;min-width:56px;min-height:68px;padding:8px 10px;display:flex}.touch-pad b{font-size:25px;line-height:1}.touch-pad span{white-space:nowrap;font-size:10px}.touch-brake{max-width:82px}.touch-brake span{white-space:normal;text-align:center}.touch-throttle{background:#b8482d}.touch-pad[data-held=true]{color:#142027;background:#ffd15c;transform:translateY(2px)}.touch-pad:disabled,.touch-recover:disabled{opacity:.4}.touch-recover{color:#fff;touch-action:manipulation;background:#354047;border-radius:8px;min-height:44px;padding:8px;font-size:11px}.touch-controller p{text-align:center;color:#b9c4c8;grid-column:1/-1;margin:0;font-size:10px}.has-touch-controller{height:auto;min-height:100dvh;padding-bottom:calc(130px + env(safe-area-inset-bottom))}.has-touch-controller .track-panel{height:clamp(300px,55dvh,560px)}@media (max-width:390px){.touch-controller{gap:5px}.touch-steering,.touch-pedals{gap:4px}.touch-pad{min-width:48px;padding:8px 5px}.touch-recover{max-width:65px}.touch-brake{max-width:66px}.touch-pad span{font-size:9px}}@media (orientation:landscape) and (max-height:600px){.touch-pad{min-height:52px}.touch-controller p{display:none}.has-touch-controller{padding-bottom:calc(80px + env(safe-area-inset-bottom))}}
