@font-face{font-family:'Permanent Marker';src:url('/fonts/PermanentMarker-Regular.ttf') format('truetype');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Racing Sans One';src:url('/fonts/RacingSansOne-Regular.ttf') format('truetype');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:Rajdhani;src:url('/fonts/Rajdhani-SemiBold.ttf') format('truetype');font-weight:600;font-style:normal;font-display:swap}
:root{--font-brand:'Permanent Marker',cursive;--font-display:'Racing Sans One',sans-serif;--font-menu:Rajdhani,sans-serif;--font-numeric:Rajdhani,sans-serif;--paper:#cacecf;--muted:#8d9698;--line:#45494b;--red:#e8563f;--panel:#212426;--ink:#101214;--focus:var(--red);font-family:var(--font-menu);font-weight:600;font-synthesis:none;color:var(--paper);background:var(--ink)}
:root{--icon-control:24px;--icon-inline:16px;--icon-empty:32px;--icon-frame:100%;--icon-size:var(--icon-control)}
.game-icon{width:var(--icon-size);height:var(--icon-size);display:block;flex:0 0 var(--icon-size);fill:currentColor;overflow:hidden}
:where(.room-capacity,.players,.pilot .profile-trigger,.ready-indicator,.garage-options small){--icon-size:var(--icon-inline)}
:where(.empty-room,.profile-message,.profile-empty){--icon-size:var(--icon-empty)}
:where(.hud-bezel,.drift-vfx-art,.hud-nitro-frame){--icon-size:var(--icon-frame)}
:where(.game-select-indicator){--icon-size:var(--icon-inline)}
:where(.garage-cars em){--icon-size:var(--icon-inline)}
:where(.garage-empty){--icon-size:var(--icon-empty)}
:where(.car-stat,.car-stats-facts,.hud-nitro){--icon-size:var(--icon-inline)}
:where(.voice-speaker){--icon-size:var(--icon-inline)}
:where(.pilot-rank){--icon-size:var(--icon-control)}
:where(.race-standing-rank .pilot-rank){--icon-size:var(--icon-inline)}
:where(.race-standing-rank .pilot-rank){--icon-size:var(--icon-inline)}
:where(.profile-avatar .pilot-rank){--icon-size:var(--icon-empty)}
:root{--control-height:40px;--control-padding:12px}
/* Compact mobile menus; active races retain the normal shared roles. */
:root.mobile-device:not(:has(#race-shell:not([hidden]))){--control-height:28px;--control-padding:8px;--icon-control:20px;--icon-inline:14px;--icon-empty:24px;--mobile-left:max(8px,env(safe-area-inset-left));--mobile-right:max(8px,env(safe-area-inset-right))}
:root{--race-utility:44px;--race-control-gap:8px;--race-edge:14px}
:where(input:not([type="checkbox"]):not([type="range"]),select){box-sizing:border-box;min-height:var(--control-height);padding-inline:var(--control-padding);font:600 15px var(--font-menu)}
:root{--focus-width:2px}
button,input,select{font-family:inherit}h1,h2,h3{font-family:var(--font-display);font-weight:400}button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,a:focus-visible{outline:var(--focus-width) solid var(--focus);outline-offset:calc(0px - var(--focus-width))}progress{accent-color:var(--red)}
html,body{overscroll-behavior:none;touch-action:pan-x pan-y;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}
input,textarea,select,[contenteditable="true"],[contenteditable=""],[contenteditable="plaintext-only"]{user-select:text;-webkit-user-select:text;-webkit-touch-callout:default}
canvas{touch-action:none}img,svg,canvas,a{-webkit-user-drag:none}

:root{--title-background:#050607}
:root{--launch-ready:#9fc58b}
:root{--minimap-route:var(--paper);--minimap-player-1:#47d7ef;--minimap-player-2:#f5d75a;--minimap-player-3:#f080c8;--minimap-player-4:#76d568;--minimap-player-5:#6498ff;--minimap-player-6:#fa6b68;--minimap-player-7:#b398f5;--minimap-player-8:#f3a34e}

/* Browser-painted controls share the same charcoal, silver and coral roles. */
:root{color-scheme:dark;scrollbar-color:var(--line) var(--ink);scrollbar-width:thin}
*{scrollbar-color:var(--line) var(--ink);scrollbar-width:thin}
::-webkit-scrollbar{width:8px;height:8px}
::-webkit-scrollbar-track,::-webkit-scrollbar-corner{background:var(--ink)}
::-webkit-scrollbar-thumb{background:var(--line);border:2px solid var(--ink);border-radius:0}
::-webkit-scrollbar-thumb:hover{background:var(--muted)}
::selection{background:var(--red);color:var(--ink)}
:where(button,input,textarea,select){appearance:none;-webkit-appearance:none;border-radius:0;box-sizing:border-box;color:var(--paper);font:600 15px var(--font-menu)}
:where(button,input[type="button"],input[type="submit"]){border:1px solid var(--line);background:var(--panel);min-height:var(--control-height);padding:8px var(--control-padding);cursor:pointer}
:where(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),textarea,select){background:var(--ink);border:1px solid var(--line);caret-color:var(--red)}
:where(textarea){padding:10px var(--control-padding);resize:vertical}
:where(input,textarea)::placeholder{color:var(--muted);opacity:1}
:where(input,textarea):autofill{box-shadow:0 0 0 1000px var(--ink) inset;color:var(--paper);-webkit-text-fill-color:var(--paper)}
:where(input,textarea):-webkit-autofill{box-shadow:0 0 0 1000px var(--ink) inset;-webkit-text-fill-color:var(--paper)}
:where(input[aria-invalid="true"],textarea[aria-invalid="true"]){border-color:var(--red)}
input::-webkit-inner-spin-button,input::-webkit-outer-spin-button,input::-webkit-search-cancel-button,input::-webkit-search-decoration{appearance:none;-webkit-appearance:none;margin:0}
:where(input[type="number"]){appearance:textfield}
:where(input[type="checkbox"],input[type="radio"]){position:relative;flex-shrink:0;width:20px;height:20px;margin:0;background:var(--ink);border:1px solid var(--line);cursor:pointer}
:where(input[type="checkbox"],input[type="radio"])::before{content:"";position:absolute;inset:4px;background:var(--muted);transform:scale(0);transition:transform .12s ease,background .12s ease}
:where(input[type="checkbox"],input[type="radio"]):checked{border-color:var(--red)}
:where(input[type="checkbox"],input[type="radio"]):checked::before{background:var(--red);transform:scale(1)}
:where(input[type="radio"]),:where(input[type="radio"])::before{border-radius:50%}
:where(input[role="switch"]){width:40px;height:24px}
:where(input[role="switch"])::before{inset:auto;left:3px;top:3px;width:15px;height:15px;transform:none;transition:left .12s ease,background .12s ease}
:where(input[role="switch"]):checked::before{left:20px}
:where(input[type="range"]){height:4px;min-width:20px;width:100%;padding:0;border:0;background:var(--line);cursor:pointer}
input[type="range"]::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:12px;height:18px;border:0;border-radius:0;background:var(--red)}
input[type="range"]::-moz-range-thumb{width:12px;height:18px;border:0;border-radius:0;background:var(--red)}
input[type="range"]::-moz-range-track{height:4px;background:var(--line);border:0}
:where(button,input,textarea,select):disabled{cursor:default;opacity:.45}
:where(a){color:var(--paper);text-decoration-color:var(--red)}
progress{appearance:none;-webkit-appearance:none;display:block;border:0;border-radius:0;background:var(--line);overflow:hidden}
progress::-webkit-progress-bar{background:var(--line)}
progress::-webkit-progress-value{background:var(--red);transition:width .18s ease}
progress::-moz-progress-bar{background:var(--red)}
progress:indeterminate{background:linear-gradient(90deg,var(--line) 0 35%,var(--red) 35% 65%,var(--line) 65%);background-size:240% 100%;animation:game-progress 1.2s linear infinite}
@keyframes game-progress{to{background-position:240% 0}}

.game-tooltip{position:fixed;inset:auto;margin:0;box-sizing:border-box;width:max-content;max-width:calc(100vw - 20px);padding:8px 12px;border:1px solid var(--line);border-left:3px solid var(--red);background:var(--ink);color:var(--paper);box-shadow:4px 5px 0 #0006;font:600 14px/1.25 var(--font-menu);letter-spacing:.15px;text-align:left;text-transform:none;white-space:pre-line;overflow-wrap:anywhere;pointer-events:auto;z-index:400;animation:game-tooltip-enter .12s ease-out}
.game-tooltip[hidden]{display:none}
.game-tooltip::backdrop{background:transparent;pointer-events:none}
@keyframes game-tooltip-enter{from{opacity:0;transform:translateY(3px)}to{opacity:1;transform:translateY(0)}}
.game-field-error{margin:0;color:var(--red);font:600 15px/1.3 var(--font-menu)}
.game-browser-error{position:fixed;inset:auto 10px max(16px,env(safe-area-inset-bottom));box-sizing:border-box;width:max-content;max-width:calc(100vw - 20px);margin:0 auto;padding:12px 16px;border:1px solid var(--line);border-left:3px solid var(--red);background:var(--ink);color:var(--paper);font:600 15px/1.3 var(--font-menu);overflow-wrap:anywhere;pointer-events:none;z-index:400;animation:game-tooltip-enter .12s ease-out}
.game-browser-error[hidden]{display:none}.game-browser-error::backdrop{background:transparent;pointer-events:none}
:root{--rank-skid:#a1aab2;--rank-skid-double:#c99a73;--rank-skid-triple:#d8bd8b;--rank-spark:#e1ca67;--rank-spark-ring:#c3d77c;--rank-flare:#87cd9a;--rank-wing:#74cfb8;--rank-wings:#78cddd;--rank-wings-diamond:#86b3f2;--rank-fox:#b0a1ef;--rank-wolf:#d1a0e7;--rank-oni:#ea9dc5;--rank-dragon:#ef8d8d;--rank-dragon-wings:#f5ad7b;--rank-sovereign:#f4d985}
[data-rank="skid"]{--rank-color:var(--rank-skid)}[data-rank="skid-double"]{--rank-color:var(--rank-skid-double)}[data-rank="skid-triple"]{--rank-color:var(--rank-skid-triple)}[data-rank="spark"]{--rank-color:var(--rank-spark)}[data-rank="spark-ring"]{--rank-color:var(--rank-spark-ring)}[data-rank="flare"]{--rank-color:var(--rank-flare)}[data-rank="wing"]{--rank-color:var(--rank-wing)}[data-rank="wings"]{--rank-color:var(--rank-wings)}[data-rank="wings-diamond"]{--rank-color:var(--rank-wings-diamond)}[data-rank="fox"]{--rank-color:var(--rank-fox)}[data-rank="wolf"]{--rank-color:var(--rank-wolf)}[data-rank="oni"]{--rank-color:var(--rank-oni)}[data-rank="dragon"]{--rank-color:var(--rank-dragon)}[data-rank="dragon-wings"]{--rank-color:var(--rank-dragon-wings)}[data-rank="sovereign"]{--rank-color:var(--rank-sovereign)}
:root{--rank-outline:#09090e}
.rank-summary,.rank-table tbody th{color:var(--rank-color,var(--paper))}
.pilot-rank,.pilot-rank .game-icon,.pilot .profile-trigger .pilot-rank .game-icon,.rank-table .game-icon{color:var(--rank-outline)}
:root{--currency-gold:#dfc36c;--currency-cash:#83d5f2}
.currency-amount[data-currency="gold"],input[data-currency="gold"]{color:var(--currency-gold)}
.currency-amount[data-currency="cash"],input[data-currency="cash"]{color:var(--currency-cash)}
