:root{color-scheme:dark;--bg:#101923;--panel:#18232e;--canvas:#13222c;--border:#30404b;--ink:#f2f4ee;--muted:#9badb8;--lime:#d6ef72;--blue:#70b8ee;--red:#f48275;--radius:16px;font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;font-size:16px}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink)}button,input,select{font:inherit}button,a,input,select{-webkit-tap-highlight-color:transparent}button{cursor:pointer;border:0;color:inherit}button:disabled{opacity:.42;cursor:not-allowed}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid var(--lime);outline-offset:3px}button:hover:not(:disabled){filter:brightness(1.12)}a{color:inherit;text-decoration:none}button,input,select{min-height:42px}input,select{width:100%;background:#111c25;border:1px solid var(--border);border-radius:8px;padding:10px 11px;color:var(--ink);font-size:.875rem}select{cursor:pointer}input[type=range]{padding:0;accent-color:var(--lime)}[hidden]{display:none!important}.topbar{height:92px;max-width:1600px;margin:auto;padding:0 38px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--border);gap:20px}.brand{display:flex;align-items:center;gap:13px;font-size:1.2rem;letter-spacing:.05em;white-space:nowrap}.brand strong{color:var(--lime)}.brand small{display:block;font-size:.625em;letter-spacing:.22em;color:var(--muted);margin-top:5px}.brand-mark{font-size:2.6rem;font-weight:900;font-style:italic;color:var(--lime);letter-spacing:-.15em}.brand-mark span{color:#edf4ef;font-weight:300;margin-left:3px}.tabs{display:flex;gap:6px;background:#0c151d;padding:5px;border-radius:40px}.tab{font-size:.9rem;border-radius:30px;padding:10px 22px;background:transparent;color:var(--muted)}.tab.active{background:#34432f;color:#e6f5ae}.header-actions{display:flex;align-items:center;gap:8px}.version{color:var(--muted);font-size:.75rem;letter-spacing:.12em;margin-right:12px}.icon-button{background:transparent;border:1px solid var(--border);border-radius:50%;height:40px;width:40px;min-height:40px;font-size:1.2rem;flex-shrink:0}.icon-button.active{background:var(--lime);color:var(--bg)}main{max-width:1600px;margin:auto;padding:26px 38px 20px}.page-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:23px;gap:20px}.eyebrow{font-size:.75rem;font-weight:650;letter-spacing:.14em;color:var(--muted);margin:0 0 9px}h1{margin:0;font-size:clamp(1.6rem,2.6vw,2.6rem);font-weight:620;letter-spacing:-.045em}h2{font-size:1rem;font-weight:600;margin:0}p{line-height:1.55}.heading-meta{text-align:right;font-size:.9rem}.heading-meta small{display:block;color:var(--muted);margin-top:8px;font-size:.8rem}.workspace{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:22px;align-items:start}.track-column{min-width:0}.circuit-panel{position:relative;border:1px solid var(--border);background:var(--canvas);border-radius:var(--radius);overflow:hidden}.track-toolbar{position:absolute;top:20px;left:23px;right:23px;display:flex;justify-content:space-between;align-items:center;gap:12px;z-index:2;pointer-events:none}.track-toolbar button{pointer-events:auto}.mode-badge{font-size:.72rem;letter-spacing:.12em;color:var(--lime);background:#20332d;border:1px solid #3d5141;border-radius:6px;padding:8px 11px}.race-clock{font-family:ui-monospace,monospace;color:#b5c7ce;font-size:.9rem;font-variant-numeric:tabular-nums}#circuit{width:100%;height:clamp(370px,52vw,575px);display:block;touch-action:none}.text-button{background:transparent;color:var(--lime);padding:4px 0;font-size:.8rem;font-weight:600}.track-legend{display:flex;gap:18px;position:absolute;bottom:17px;left:23px;right:23px;align-items:center;font-size:.75rem;color:var(--muted);pointer-events:none}.track-legend>span{display:flex;align-items:center;gap:6px}.legend-line{display:inline-block;width:15px;height:3px;background:#c1c9c3}.legend-line.sand{background:#bfa27c}.legend-line.switch{background:var(--lime)}#guide-hint{margin-left:auto;font-size:.8rem;color:#c2cdd2}.race-overlay{position:absolute;left:50%;top:52%;transform:translate(-50%,-50%);width:285px;text-align:center;background:rgba(15,25,33,.95);border:1px solid #405048;border-radius:16px;padding:22px;box-shadow:0 14px 50px #050f1670}.race-overlay strong{display:block;font-size:1.65rem;letter-spacing:-.04em}.race-overlay p{font-size:.85rem;color:var(--muted);margin:9px 0 18px}.race-overlay .primary{width:100%;font-size:.9rem}.countdown{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:5rem;line-height:1;color:var(--lime);font-weight:750;text-shadow:0 4px 24px #000;pointer-events:none}.primary{background:var(--lime);color:#182417;border-radius:9px;padding:13px 16px;font-weight:700;display:flex;justify-content:space-between;align-items:center;gap:10px;min-height:48px}.primary span{font-size:1.35rem}.secondary{background:#25323d;border:1px solid #3a4b57;border-radius:8px;padding:9px 10px;font-size:.85rem}.full{width:100%;margin-top:14px}.side-panel{background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);padding:21px}.panel-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px}.panel-heading .eyebrow{margin:0;font-size:.7rem}.tiny-number{color:#85959c;font-size:.7rem;font-family:monospace}.segmented{display:flex;gap:4px;padding:4px;background:#101a22;border-radius:9px;margin-bottom:18px}.segmented button{flex:1;background:transparent;font-size:.85rem;color:var(--muted);border-radius:7px}.segmented button.selected{background:#394537;color:#e7f4c1}.field{display:block;font-size:.8rem;color:#b8c5cc;margin-top:13px}.field input,.field select{display:block;margin-top:7px}.field-pair{display:grid;grid-template-columns:1fr 1fr;gap:12px}.field-note{font-size:.8rem;color:var(--muted);margin:10px 0}.divider{height:1px;background:var(--border);margin:21px 0}.garage-heading,.leader-heading{display:flex;align-items:center;justify-content:space-between;gap:8px}.garage-heading .text-button{font-size:.75rem}.garage-card{display:flex;align-items:center;gap:13px;margin-top:8px}.car-token{display:grid;place-items:center;width:40px;height:40px;border-radius:10px;background:color-mix(in srgb,var(--car-color) 15%,transparent);color:var(--car-color);border:1px solid color-mix(in srgb,var(--car-color) 45%,transparent);font-weight:750;font-size:1rem;flex-shrink:0}.garage-card strong{display:block;font-size:.9rem}.garage-card small{display:block;font-size:.75rem;color:var(--muted);margin-top:5px}.leader-heading span{font-size:.6rem;letter-spacing:.08em;color:var(--muted)}.leaderboard{list-style:none;margin:12px 0 16px;padding:0}.leaderboard li{display:flex;align-items:center;gap:10px;font-size:.83rem;min-height:37px;border-bottom:1px solid #ffffff07}.leaderboard .place{color:var(--muted);width:14px;font-size:.75rem}.driver-dot{width:7px;height:7px;border-radius:50%;background:var(--car-color);flex-shrink:0}.leaderboard .driver-time{margin-left:auto;color:var(--muted);font-size:.75rem;font-variant-numeric:tabular-nums}.start-button{width:100%;margin-top:16px}.race-actions{display:flex;gap:9px;margin-top:9px}.race-actions>*{flex:1}.driving-controls{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:12px;margin-top:14px}.driver-controls{background:var(--panel);border:1px solid var(--border);border-radius:12px;padding:15px;min-width:0}.driver-controls-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:11px;gap:10px}.driver-name{display:flex;align-items:center;gap:9px;font-size:.9rem;font-weight:600}.driver-speed{font-size:.8rem;color:var(--muted);font-variant-numeric:tabular-nums}.pedal-row{display:flex;gap:8px}.pedal{flex:1;min-height:56px;border-radius:8px;background:#354b35;color:#e0f0b6;border:1px solid #627841;font-size:.9rem;touch-action:none;user-select:none;position:relative;overflow:hidden;font-weight:650}.pedal.active{background:#b3d263;color:#16230e}.pedal small{display:block;font-weight:450;opacity:.7;font-size:.7rem;margin-top:3px}.lane-button{width:50px;border-radius:8px;background:#25323d;border:1px solid #41545e;font-size:1.5rem;touch-action:none}.lane-button.queued{background:var(--lime);color:#1b2813;border-color:var(--lime)}.driver-feedback{display:flex;align-items:center;gap:10px;margin-top:11px;color:var(--muted);font-size:.7rem;min-height:20px}.grip-bar{height:4px;border-radius:3px;background:#3b4750;flex:1;max-width:120px;overflow:hidden}.grip-bar i{display:block;height:100%;width:0;background:var(--lime);transition:width .12s}.driver-feedback .status{margin-left:auto;text-align:right}.race-bottom{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-top:18px}.race-bottom span{font-size:.68rem;color:#cbdcb9;letter-spacing:.14em}.race-bottom p{margin:0;font-size:.8rem;color:var(--muted)}footer{max-width:1600px;margin:15px auto 0;padding:22px 38px 26px;border-top:1px solid var(--border);display:flex;gap:18px;justify-content:space-between;font-size:.75rem;color:var(--muted)}.editor-status{padding:15px 0;font-size:.85rem;color:var(--lime)}.editor-status.invalid{color:#f4b19c}.piece-strip{display:flex;gap:7px;flex-wrap:wrap;max-height:240px;overflow:auto}.piece-chip{background:#22323d;border:1px solid #3d5360;border-radius:8px;padding:7px 12px;color:#a5b8c3;font-size:.8rem}.piece-chip.selected{color:var(--lime);border-color:var(--lime);background:#354437}.piece-buttons{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:15px}.piece-buttons button{background:#263640;border:1px solid #3b5059;border-radius:8px;font-size:.8rem;padding:10px 5px}.piece-buttons b{display:block;font-size:1.5rem;color:var(--lime);font-weight:400;margin-bottom:5px}.editor-bottom{min-height:100px}dialog{background:#182630;color:var(--ink);border:1px solid #45585e;border-radius:20px;width:min(770px,calc(100vw - 32px));max-height:88dvh;padding:28px;box-shadow:0 40px 120px #0009}dialog::backdrop{background:#050d16c9;backdrop-filter:blur(4px)}.dialog-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:12px}.dialog-heading h2{font-size:1.6rem;letter-spacing:-.035em;line-height:1.25}.muted{color:var(--muted);font-size:.9rem}.garage-setup{border:1px solid var(--border);border-radius:12px;margin:18px 0;padding:17px}.garage-setup header{display:flex;align-items:center;gap:10px}.garage-setup input[type=text]{flex:1}.garage-setup .field-pair{grid-template-columns:repeat(3,1fr)}.range-ends{display:flex;justify-content:space-between;color:var(--muted);font-size:.75rem;margin-top:5px}.garage-explanation{font-size:.8rem;color:var(--muted);margin-bottom:0}.garage-setup .car-token{height:42px}.saved-row{display:flex;align-items:center;gap:15px;padding:14px 0;border-bottom:1px solid var(--border)}.saved-row strong{margin-right:auto;overflow-wrap:anywhere}.saved-row button{flex-shrink:0}table{border-collapse:collapse;width:100%;font-size:.9rem;margin:20px 0}th,td{text-align:left;padding:12px 8px;border-bottom:1px solid var(--border)}th{font-size:.75rem;color:var(--muted);font-weight:600}#toast{position:fixed;bottom:25px;left:50%;transform:translate(-50%,15px);padding:13px 20px;border-radius:12px;background:#d6ef72;color:#172019;box-shadow:0 4px 24px #0005;max-width:calc(100vw - 32px);z-index:20;opacity:0;pointer-events:none;transition:.2s;font-size:.9rem}#toast.show{opacity:1;transform:translate(-50%,0)}body.editor .race-overlay{display:none}body.editor .track-legend #guide-hint{display:none}body.editor #circuit{cursor:crosshair}body.racing .heading-meta{color:var(--lime)}
@media(min-width:1500px){#circuit{height:640px}.workspace{grid-template-columns:minmax(0,1fr) 350px}}
@media(max-width:1100px){.topbar{padding:0 24px}main{padding:24px}.workspace{grid-template-columns:minmax(0,1fr) 300px;gap:16px}.side-panel{padding:17px}.track-toolbar{left:16px;right:16px}.track-legend{left:16px;right:16px;gap:12px}#guide-hint{display:none}.version{display:none}.race-bottom{display:block}.race-bottom p{margin-top:5px}footer{padding:22px 24px}.tabs .tab{padding:10px 15px}}
@media(max-width:820px){.topbar{height:78px;gap:10px;padding:0 18px}.brand{font-size:1rem;gap:8px}.brand-mark{font-size:2.2rem}.header-actions{gap:5px}.header-actions .icon-button{width:34px;height:34px;min-height:34px}.tabs .tab{padding:8px 12px;font-size:.8rem}.workspace{grid-template-columns:1fr}.side-panel{display:grid;grid-template-columns:1fr 1fr;gap:0 20px}.side-panel>.panel-heading,.side-panel>.segmented,.side-panel>.divider,.side-panel>.field-note,.side-panel>.garage-heading,.side-panel>#garage-summary,.side-panel>.leader-heading,.side-panel>.leaderboard,.side-panel>.start-button,.side-panel>.race-actions{grid-column:1/-1}.side-panel>.field-pair{grid-column:span 1}.side-panel>.field{grid-column:1/-1}.side-panel>.divider{margin:15px 0}.side-panel .start-button{grid-column:1}.side-panel .race-actions{grid-column:2;margin-top:16px}.side-panel .race-actions .secondary{width:50%}#editor-panel{display:block}#circuit{height:480px}.heading-meta{max-width:200px}.track-column{order:0}main{padding:21px 18px}.page-heading{margin-bottom:18px}.race-bottom{display:flex}.leaderboard{display:grid;grid-template-columns:1fr 1fr;gap:0 20px}footer{padding:20px 18px;flex-wrap:wrap;font-size:.7rem}.header-actions #fullscreen{display:none}}
@media(max-width:550px){.topbar{height:auto;min-height:104px;padding:14px 16px;flex-wrap:wrap}.brand{flex:1}.tabs{order:3;width:100%;justify-content:center;margin-top:2px}.tabs .tab{flex:1;min-height:34px;padding:6px}.header-actions{margin-left:auto}.brand small{font-size:.55rem}.brand-mark{font-size:2rem}.page-heading{align-items:start;gap:10px}h1{font-size:1.75rem}.heading-meta{font-size:.75rem;max-width:125px}.heading-meta small{font-size:.7rem;line-height:1.5}.eyebrow{font-size:.65rem}.page-heading .eyebrow{margin-bottom:5px}main{padding:17px 12px}.workspace{gap:15px}#circuit{height:355px}.track-toolbar{top:12px;left:12px;right:12px;gap:6px}.mode-badge{font-size:.6rem;padding:6px}.track-toolbar .text-button{font-size:.7rem}.race-clock{font-size:.75rem}.track-legend{font-size:.65rem;bottom:12px;left:12px}.race-overlay{width:238px;padding:15px;top:52%}.race-overlay strong{font-size:1.35rem}.race-overlay p{font-size:.8rem;margin-bottom:12px}.race-overlay .eyebrow{font-size:.65rem}.race-bottom{display:block;margin-top:12px}.race-bottom p{font-size:.75rem}.driver-controls{padding:12px}.driving-controls{margin-top:11px}.side-panel{display:block;padding:17px}.side-panel .race-actions{margin-top:9px}.side-panel .start-button{margin-top:15px}.leaderboard{display:block}.side-panel>.field-pair{gap:12px}.garage-setup .field-pair{grid-template-columns:1fr}.garage-setup .field{margin-top:14px}.dialog-heading h2{font-size:1.3rem}dialog{padding:18px}.saved-row{flex-wrap:wrap}table{font-size:.8rem}th,td{padding:10px 5px}footer{gap:10px;padding:18px 12px}.editor-status{line-height:1.5}}
@media(max-height:550px) and (orientation:landscape){.topbar{height:60px;min-height:60px;flex-wrap:nowrap}.tabs{width:auto;order:0}.brand small,.page-heading,.race-bottom,footer{display:none}main{padding-top:12px}.workspace{grid-template-columns:minmax(0,1fr) 270px}.side-panel{display:block;max-height:calc(100dvh - 86px);overflow:auto}.side-panel .race-actions{margin-top:9px}#circuit{height:calc(100dvh - 211px);min-height:200px}.driving-controls{grid-template-columns:1fr}.driver-controls{padding:9px}.driver-controls-head{margin-bottom:5px}.pedal{min-height:42px}.driver-feedback{margin-top:5px}.race-overlay{padding:12px;width:245px}.race-overlay p,.race-overlay .eyebrow{display:none}.race-overlay strong{font-size:1.3rem;margin-bottom:10px}.leaderboard{display:block}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
/* Readable control labels at every viewport. */
.field,.field-note,.text-button,.leaderboard li,.driver-speed{font-size:.875rem}.leader-heading span,.panel-heading .eyebrow,.brand small,.driver-feedback,.pedal small,.race-bottom span,.track-legend,footer{font-size:.75rem}.garage-heading .text-button{font-size:.8125rem}@media(max-width:550px){.eyebrow,.page-heading .eyebrow,.mode-badge,.track-toolbar .text-button,.track-legend,footer{font-size:.75rem}.heading-meta{font-size:.8125rem}.heading-meta small{font-size:.75rem}.side-panel{padding:17px}.garage-heading{flex-wrap:wrap}}
/* 0.2: configure first; the race occupies the whole application viewport. */
body:not(.editor) .track-toolbar,body:not(.editor) .track-legend,#race-bottom{display:none}.race-overlay #overlay-kicker,.race-overlay #overlay-text:empty{display:none}.race-overlay .secondary{width:100%;margin-top:10px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
body.playing{overflow:hidden;overscroll-behavior:none;background:#13252e}body.playing>.topbar,body.playing>footer,body.playing .page-heading,body.playing .side-panel,body.playing .editor-bottom,body.playing #race-bottom{display:none!important}body.playing main{padding:0;margin:0;max-width:none}body.playing .workspace{display:block}body.playing .track-column{position:fixed;inset:0;z-index:5;width:100%;height:100dvh;display:grid;grid-template-rows:minmax(0,1fr) auto;gap:0}body.playing .circuit-panel{min-width:0;min-height:0;border:0;border-radius:0;background:#13252e}body.playing #circuit{width:100%;height:100%!important;min-height:0!important;outline:none;touch-action:none}body.playing .driving-controls{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;width:100%;margin:0;padding:10px max(12px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left));background:#101c24;border-top:1px solid #526768;justify-items:center}body.playing .driving-controls[data-players="1"]{grid-template-columns:1fr}body.playing .driver-controls{width:100%;max-width:560px;border:0;border-radius:0;background:transparent;padding:0}body.playing .pedal-row{gap:10px;align-items:stretch}body.playing .pedal{min-height:64px;background:color-mix(in srgb,var(--car-color) 18%,#122028);color:var(--car-color);border:1px solid color-mix(in srgb,var(--car-color) 60%,transparent);display:flex;align-items:center;justify-content:center;gap:8px;font-size:.95rem;letter-spacing:.09em;transition:background .08s}body.playing .pedal.active{background:var(--car-color);color:#132027}body.playing .pedal.offtrack{opacity:.45}body.playing .lane-button{width:72px;min-width:54px;min-height:64px;font-size:1.7rem;border-color:#61747a;background:#263942}body.playing .lane-button.queued{background:var(--car-color);color:#142029}.pedal-player{font-size:.75rem;letter-spacing:0;border:1px solid currentColor;border-radius:5px;padding:3px}
.race-hud{position:absolute;inset:0;z-index:3;pointer-events:none}.race-position{position:absolute;display:flex;gap:7px;align-items:center;border-radius:12px;padding:7px 12px;background:#0b1824cc;border:1px solid color-mix(in srgb,var(--car-color) 50%,transparent);color:var(--car-color);backdrop-filter:blur(6px);min-width:57px}.race-position strong{font-size:1.65rem;line-height:1;font-variant-numeric:tabular-nums}.race-position small{font-size:.75rem;font-weight:600}.play-tools{position:absolute;top:max(12px,env(safe-area-inset-top));right:max(12px,env(safe-area-inset-right));display:flex;gap:7px;pointer-events:auto}.play-tool{display:flex;align-items:center;justify-content:center;gap:6px;background:#0b1824db;border:1px solid #62787a;min-width:44px;min-height:44px;border-radius:12px;color:#eff5df;padding:8px 11px;font-size:1.1rem}.play-tool span{font-size:.875rem}.camera-menu{position:absolute;top:66px;right:12px;pointer-events:auto;display:grid;gap:4px;padding:7px;min-width:170px;background:#142631f5;border:1px solid #688078;border-radius:12px;box-shadow:0 10px 30px #0008}.camera-menu button{padding:10px 13px;text-align:left;background:transparent;border-radius:8px;font-size:.9rem}.camera-menu button[aria-pressed="true"]{background:#d6ef72;color:#132124}body.playing .race-overlay{z-index:4}.race-overlay .primary{margin-top:17px}
@media(min-width:1050px){body.playing .driving-controls[data-players="3"]{grid-template-columns:repeat(3,minmax(0,1fr))}body.playing .driving-controls[data-players="4"]{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:550px){body.playing .pedal-row{gap:6px}body.playing .driving-controls{padding:8px 9px max(10px,env(safe-area-inset-bottom));gap:7px}body.playing .lane-button{width:60px;min-width:44px;min-height:62px}body.playing .pedal{min-height:62px;font-size:.85rem;letter-spacing:.03em}body.playing .driving-controls:not([data-players="1"]) .lane-button{width:39px;min-width:34px;min-height:48px}body.playing .driving-controls:not([data-players="1"]) .pedal{min-height:48px;font-size:.7rem;gap:3px;flex-wrap:wrap;letter-spacing:0}.pedal-player{font-size:.7rem;padding:2px}.race-position{padding:8px 10px}.race-position strong{font-size:1.5rem}.play-tool{min-height:42px}.camera-menu{top:62px}}
@media(max-height:550px) and (orientation:landscape){body.playing .track-column{height:100dvh}body.playing .driving-controls{padding-top:6px;padding-bottom:max(6px,env(safe-area-inset-bottom));gap:6px}body.playing .pedal,body.playing .lane-button{min-height:47px}body.playing .driving-controls[data-players="3"],body.playing .driving-controls[data-players="4"]{grid-template-columns:repeat(4,minmax(0,1fr))}body.playing .driving-controls:not([data-players="1"]) .lane-button{width:37px;min-width:32px}body.playing .driving-controls:not([data-players="1"]) .pedal{font-size:.75rem;letter-spacing:0}.race-position strong{font-size:1.4rem}.race-position{padding:7px 10px}}

/* The snap controls only appear inside the circuit editor. */
.snap-controls{margin-top:17px;padding-top:14px;border-top:1px solid var(--border)}.snap-toggle{display:flex;align-items:center;gap:10px;line-height:1.4;font-size:.875rem;color:var(--ink)}.snap-toggle input{width:19px;height:19px;min-height:19px;margin:0;accent-color:var(--lime);flex:0 0 auto}.snap-controls .field-note{font-size:.8125rem}.snap-controls .full{margin-top:9px}

/* Online rooms sit outside the uncluttered driving screen. */
.online-button{margin-top:10px;grid-column:1/-1}#online-dialog{width:min(520px,calc(100vw - 24px))}#online-dialog .full{margin-top:10px}#online-dialog input{font-size:1rem}.room-code{font-family:ui-monospace,monospace;font-size:clamp(1.25rem,5vw,1.9rem);font-weight:700;letter-spacing:.08em;color:var(--lime);padding:18px 4px;text-align:center}.online-members{list-style:none;padding:0;margin:18px 0;display:grid;gap:8px}.online-members li{display:flex;align-items:center;gap:10px;padding:10px 12px;border:1px solid var(--border);border-radius:9px;font-size:.9rem}.online-members i{width:12px;height:12px;border-radius:4px;flex:0 0 auto}.online-members small{margin-left:auto;color:var(--muted);font-size:.75rem}#online-status{min-height:1.4em}#online-leave{color:#f58b7b}#connection-warning{position:absolute;bottom:12px;left:50%;transform:translateX(-50%);max-width:90%;background:#291d17eb;color:#ffdbb7;border:1px solid #b89569;border-radius:9px;padding:9px 14px;font-size:.875rem;text-align:center;pointer-events:none}

/* Long presses are driving inputs, including on Safari and nested pedal labels. */
.driving-controls,.driving-controls *{user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;-webkit-user-drag:none;touch-action:none}
.pedal>*,.lane-button>*{pointer-events:none}
#account-dialog{width:min(480px,calc(100vw - 24px))}.password-row{display:flex;gap:8px;margin-top:7px}.password-row input{min-width:0}.password-row button{flex:none}.account-switches{display:flex;flex-wrap:wrap;gap:14px;margin-top:18px}.consent{display:flex;align-items:start;gap:8px}.consent input{width:18px;min-height:18px;flex:none}.consent a,footer a{text-decoration:underline;text-underline-offset:3px}#account-status{min-height:1.5em}#account-email-label{overflow-wrap:anywhere}.header-actions .version{display:none}
@media(max-width:550px){.header-actions{gap:5px}.header-actions #account-button{padding:7px;font-size:.8rem}.header-actions .icon-button{width:34px;height:34px;min-height:34px}.brand{font-size:1rem;gap:7px}}

#editor-build-tools{margin-top:20px}.mobile-undo{display:none}body:not(.editor) #editor-build-tools{display:none}.keyboard-help{line-height:1.6}body.playing .keyboard-help{display:none}
@media(max-width:900px){
 body.editor .workspace{display:flex;flex-direction:column;align-items:stretch}
 body.editor .track-column{position:sticky;top:0;z-index:4;background:var(--bg);padding-bottom:6px}
 body.editor #editor-panel{display:block;max-height:none;width:100%}
 body.editor #editor-build-tools{margin:0;padding:8px 4px;background:var(--bg)}
 #editor-build-tools>h2,#editor-build-tools>.field-note{display:none}
 #editor-build-tools .piece-buttons{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:5px;margin:0}
 #editor-build-tools .piece-buttons button{font-size:.75rem;min-height:44px;padding:4px 2px}
 #editor-build-tools .piece-buttons b{display:inline;font-size:1.15rem;margin:0 4px 0 0}
 #editor-build-tools .field-pair{display:grid;grid-template-columns:1fr 1fr;gap:8px}
 #editor-build-tools .field{margin-top:4px;font-size:.75rem}
 #editor-build-tools select{min-height:34px;padding:4px 8px;margin-top:3px;font-size:1rem}
 #editor-build-tools .mobile-undo{display:block;min-height:30px;font-size:.75rem;padding:3px}
 body.editor #circuit{height:clamp(150px,30dvh,300px);min-height:0}
 body.editor .track-legend{display:none}
 body.editor .editor-bottom{min-height:0}
 body.editor .editor-status{padding:5px 0;font-size:.75rem;max-height:2.8em;overflow:auto}
 body.editor .piece-strip{flex-wrap:nowrap;overflow-x:auto;max-height:40px;gap:4px}
 body.editor .piece-chip{flex:none;min-height:32px;padding:4px 8px;font-size:.75rem}
}
@media(max-width:900px) and (max-height:500px){
 body.editor .workspace{display:grid;grid-template-columns:minmax(0,1fr) 230px;align-items:start}
 body.editor #circuit{height:calc(100dvh - 190px);min-height:100px}
 body.editor .track-column{top:0}
 #editor-build-tools .field-pair{grid-template-columns:1fr 1fr}
 #editor-build-tools .field{display:flex;align-items:center;gap:5px}
 #editor-build-tools select{min-width:0;margin:0}
}

@media(max-width:900px) and (max-height:500px){#editor-build-tools .mobile-undo{display:none}body.editor .editor-status{max-height:1.4em}}

/* Community, race order and sound settings. */
.race-position{min-width:108px;flex-wrap:wrap;gap:4px 9px;max-width:124px}.race-position .lap-label{flex-basis:100%;font-size:11px;color:#e8edf1;font-weight:600;white-space:nowrap}
.race-order{position:absolute;left:12px;right:12px;bottom:12px;display:flex;gap:5px;flex-wrap:wrap;list-style:none;margin:0;padding:0;pointer-events:none}.race-order li{display:flex;align-items:center;gap:5px;padding:6px 8px;border-radius:9px;background:#101c27e8;border:1px solid #ffffff25;color:white;font-size:12px}.race-order li.your-car{border-color:var(--car-color)}.race-order i{display:block;width:9px;height:17px;border-radius:3px;background:var(--car-color);box-shadow:inset 0 3px #ffffff30,inset 0 -3px #0004}.play-tools .active{color:var(--accent,#d8f36a)}
.catalog-search{display:flex;gap:8px;margin-top:18px}.catalog-search input{min-width:0;flex:1}.community-list{display:grid;gap:12px;margin:16px 0}.community-card{border:1px solid var(--line,#d6dce0);border-radius:14px;padding:16px}.community-card h3{margin:0 0 6px;overflow-wrap:anywhere}.community-card .race-actions{flex-wrap:wrap}.community-card a{font-size:13px;overflow-wrap:anywhere}.sound-sample{padding:16px 0;border-bottom:1px solid var(--line,#d6dce0)}.sound-sample h3{margin:0}.sound-sample input[type=file]{font-size:12px;max-width:100%;padding:10px}.sound-sample .field-note{overflow-wrap:anywhere}
@media(max-width:480px){.race-order{gap:4px;left:10px;right:10px}.race-order li{padding:5px 6px;gap:4px}.race-position{min-width:102px}.header-actions #account-button{font-size:10px;padding:7px}.community-card .race-actions{gap:6px}}
