.race-room{background:linear-gradient(#0a0b10a0,#090d12bc 72%,#0e0e12d9),url('/assets/racing/raceway.jpg') center/cover}
.race-hero{padding:.6em 1em .45em}
.race-hero h1{margin:0;font-size:clamp(1.7rem,4vw,4.2rem);letter-spacing:-.045em;line-height:1}
.race-hero h1 .icon{color:#e7c78a;width:1em;height:1em}
.race-hero p{margin:.3em 0;color:#eee}
.race-layout{display:grid;grid-template-columns:minmax(235px,29fr) minmax(0,71fr);grid-template-rows:minmax(0,1fr) auto;flex:1;min-height:0;gap:.6em}
.race-layout>section,.race-alternate{background:var(--work-panel);border:1px solid var(--work-border);border-radius:13px;padding:.8em;min-width:0;min-height:0;overflow:auto}
.race-layout h2{font-size:clamp(1.05rem,1.5vw,1.65rem);margin:0 0 .55em;line-height:1.15}
.race-modes{grid-row:1/3}
.race-modes>button{display:flex;gap:.65em;align-items:center;width:100%;text-align:left;margin:.48em 0;padding:.8em}
.race-modes>button .icon{width:2.6em;height:2.6em;color:#e9d0ad}
.race-modes>button[aria-pressed=true],.race-tracks>button[aria-pressed=true]{color:#fff;background:#241d14;border-color:#ffc442;box-shadow:inset 0 0 0 1px #ffc442,0 0 12px #ffa53536}
.race-modes>button strong,.race-tracks strong{display:block;font-size:1.14em}
.race-modes small,.race-tracks small{display:block;color:#c5c5c5;font-weight:500}
.race-modes h3{margin:.7em 0 .3em}
.race-modes label{display:block;margin:.7em 0 .15em}
.race-modes input{accent-color:#ffc247}
.race-options{display:flex;gap:.35em;min-width:0;overflow:auto;scrollbar-width:thin}
.race-options button{white-space:nowrap;padding:.4em .65em}
.race-prize{display:flex;gap:.55em;align-items:center;color:#ffd77e}
.race-prize>*{padding:.45em .65em;border:1px solid var(--work-border);border-radius:7px;background:#15191a}
.race-track-panel header{display:flex;justify-content:space-between;gap:.5em;align-items:baseline}
.race-tracks{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.6em}
.race-tracks>button{display:block;text-align:left;padding:0;overflow:hidden}
.race-tracks img{display:block;width:100%;height:clamp(75px,15vh,180px);object-fit:cover}
.race-tracks button>span{display:block;padding:.45em .55em}
.race-car-row{display:grid;grid-template-columns:minmax(90px,34%) minmax(0,1fr) minmax(0,1.1fr);align-items:center;gap:.7em}
.race-car-row select{width:100%}
.race-car-photo{display:grid;place-items:center;height:clamp(70px,13vh,145px);background:radial-gradient(ellipse,#41301c,#141517);border-radius:8px}
.race-car-photo img{width:100%;height:100%;object-fit:contain}
.race-car-row p{margin:.3em 0;color:#ddd}
.race-ready{color:#8ce680}
.race-start{flex:none;display:grid;justify-items:center;margin:.65em 0 0}
.race-start>button{font-size:clamp(1rem,1.8vw,2rem);min-width:min(22rem,95%);min-height:42px}
.race-start p:empty,.race-live p:empty{display:none}
.race-start p{margin:.2em;color:#ffd88d}
.race-alternate{flex:1}
.race-alternate table{border-collapse:collapse;width:100%;text-align:left}
.race-alternate :is(td,th){padding:.5em;border-bottom:1px solid var(--work-border)}
.race-event{display:flex;gap:.8em;padding:.7em;border-bottom:1px solid var(--work-border)}
.race-event img{width:min(30%,240px);object-fit:cover;border-radius:8px}
.race-event :is(h3,p){margin:.2em 0}
.race-message{align-self:center;margin:auto 0;max-height:100%;overflow:auto;padding:1.2em 1.5em;background:var(--work-panel);border:1px solid #b5843d;border-radius:13px;min-width:min(32rem,98%);display:grid;gap:.45em}
.race-message :is(h1,h2,h3,p,ul){margin:0}
.race-players{display:grid;grid-template-columns:repeat(2,1fr);gap:.75em;margin:.5em 0}
.race-players article{padding:.65em;border:1px solid var(--work-border);border-radius:7px;background:#0f1115}
.race-live{position:absolute;inset:0;touch-action:none;overflow:hidden}
.race-live canvas{width:100%;height:100%;display:block}
.race-hud{position:absolute;top:.6em;left:.6em;display:grid;padding:.45em .65em;border:1px solid #ffffff35;border-radius:8px;background:#101417dd}
.race-hud strong{font-size:1.5em;color:#ffcb65}
.race-live-menu{position:absolute;top:.6em;right:.6em;display:flex;gap:.35em}
.race-countdown{position:absolute;top:34%;left:50%;transform:translateX(-50%);font-size:clamp(2rem,5vw,5rem);font-weight:800;color:#ffca55;text-shadow:0 3px 12px #000;white-space:nowrap}
.race-inputs{position:absolute;bottom:max(.6em,env(safe-area-inset-bottom));left:max(.6em,env(safe-area-inset-left));right:max(.6em,env(safe-area-inset-right));display:flex;justify-content:space-between;gap:.5em;pointer-events:none}
.race-inputs>div{display:flex;gap:.55em}
.race-inputs button{touch-action:none;user-select:none;pointer-events:auto;min-height:52px;min-width:54px;font-weight:800}
.race-live>p{position:absolute;left:50%;bottom:1em;transform:translateX(-50%);background:#151719;color:#ffc675}
.race-signin{align-self:center;margin:auto 0}
@media(max-width:1000px),(max-height:540px){
  .race-room{padding-bottom:.4em}
  .race-hero{padding:.25em .4em}
  .race-hero h1{font-size:1.65rem}
  .race-hero p{display:none}
  .race-tabs{display:flex;padding:0 0 .28em;gap:.3em}
  .race-tabs button{padding:.33em .55em}
  .race-layout{grid-template-columns:minmax(195px,32%) minmax(0,1fr);gap:.35em}
  .race-layout>section{padding:.42em}
  .race-layout h2{margin-bottom:.3em}
  .race-modes>button{margin:.25em 0;padding:.35em}
  .race-modes>button .icon{width:1.5em;height:1.5em}
  .race-modes small{display:none}
  .race-modes h3{margin:.35em 0 .15em;font-size:.9em}
  .race-modes label{margin:.26em 0;font-size:.9em}
  .race-modes .race-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
  .race-modes .race-options button{padding:.24em}
  .race-prize>*{padding:.2em .35em}
  .race-track-panel header{display:block}
  .race-track-panel .race-options{margin-bottom:.35em}
  .race-track-panel .race-options button{padding:.23em .4em}
  .race-tracks{display:flex;overflow:auto;gap:.35em;scrollbar-width:thin}
  .race-tracks>button{flex:0 0 42%;font-size:.75rem}
  .race-tracks img{height:42px}
  .race-tracks button>span{padding:.2em .3em}
  .race-car h2{display:none}
  .race-car-row{grid-template-columns:minmax(65px,23%) minmax(0,1fr) minmax(0,1fr);gap:.35em;font-size:.72rem}
  .race-car-row p{margin:.1em 0}
  .race-car-photo{height:47px}
  .race-start{margin-top:.35em}
  .race-start>button{min-height:36px;padding:.25em 1em}
}
.race-mobile {
  display:grid;grid-template-rows:auto minmax(0,1fr) auto;gap:8px;
  flex:1;min-height:0;padding:2px 0 3px;font:500 13px/1.25 Inter,Arial,sans-serif;
}
.rm-top,.rm-footer,.rm-track-controls,.rm-options,.rm-readiness,.rm-top nav {
  display:flex;align-items:center;gap:8px;min-width:0
}
.rm-top {justify-content:space-between;min-height:34px}
.rm-top h1 {margin:0;display:flex;align-items:center;gap:5px;white-space:nowrap;font-size:16px}
.rm-top h1 .icon {color:#ffc047;width:17px;height:17px}
.rm-top h1 small {font-size:12px;color:#c4c1bb;font-weight:500;overflow:hidden;text-overflow:ellipsis}
.rm-top nav {gap:4px;overflow:auto;scrollbar-width:none;max-width:53%}
.race-room .rm-top nav button {background:#171a1ec9;border:0;padding:7px 7px;white-space:nowrap;font-size:11px}
.rm-body {display:grid;grid-template-columns:minmax(0,57fr) minmax(0,43fr);gap:9px;min-height:0}
.rm-track {isolation:isolate;position:relative;overflow:hidden;display:flex;align-items:end;border-radius:12px;background:#191715;min-height:0}
.rm-track>img {position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
.rm-track::after {content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(0deg,#090b0ef7 0%,#101013a0 29%,transparent 65%),linear-gradient(180deg,#0b0e15a0,transparent 30%)}
.rm-track-controls {position:absolute;top:9px;right:9px;left:12px;gap:6px}
.rm-track-controls>span {margin-right:auto;color:#f1dbb5;font-weight:700;font-variant-numeric:tabular-nums}
.race-room .rm-track-controls button {min-width:38px;height:38px;padding:0;font-size:25px;line-height:1;background:#101418d9}
.rm-track-info {padding:12px 14px;width:100%}
.rm-track-info>span {display:inline-block;color:#ffd174;font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.075em}
.rm-track-info h2 {margin:3px 0 6px;font-size:clamp(19px,3.25vw,31px);line-height:1.02;letter-spacing:-.04em;text-wrap:balance}
.rm-track-info p {display:flex;align-items:center;gap:12px;margin:0;color:#d2d3d4}
.rm-track-info b {color:white;font-size:15px}
.rm-setup {display:grid;grid-template-rows:auto auto minmax(0,1fr);gap:7px;min-width:0;min-height:0}
.rm-modes {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
.race-room .rm-modes button {display:grid;grid-template-columns:24px minmax(0,1fr);align-content:center;column-gap:5px;padding:8px 7px;text-align:left;background:linear-gradient(140deg,#252b2f,#14191e);min-height:56px}
.rm-modes button .icon {grid-row:span 2;align-self:center;width:22px;height:22px}
.rm-modes strong {font-size:clamp(12px,1.85vw,18px);white-space:nowrap}
.rm-modes small {font-size:10px;color:#c6c9ca;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.race-room .rm-modes button[aria-pressed=true] {color:#ffe6af;background:linear-gradient(135deg,#604420,#262019);border-color:#e9a936}
.rm-modes button[aria-pressed=true] .icon {color:#ffbd3d}
.rm-options {min-height:33px;justify-content:space-between;color:#d4d4d4;white-space:nowrap;font-size:11px}
.rm-options label {display:flex;align-items:center;gap:4px}
.race-room .rm-options select {padding:5px;min-height:32px}
.race-room .rm-manual input {margin:0;width:15px;height:15px;accent-color:#ffbf41}
.rm-car {position:relative;min-height:0;min-width:0;display:grid;grid-template-columns:43% minmax(0,1fr);grid-template-rows:minmax(0,1fr) auto;gap:0 3px;align-items:center;background:radial-gradient(ellipse at 18% 35%,#6f482943,transparent 56%),linear-gradient(145deg,#25252a,#11151a);border-radius:10px;padding:6px 8px}
.rm-car>img {width:100%;height:100%;object-fit:contain;min-height:0;transform:scale(1.25);filter:drop-shadow(0 5px 5px #000b)}
.rm-car-info {grid-column:2;min-width:0}
.rm-car-info h2 {font-size:clamp(12px,1.7vw,17px);line-height:1.1;margin:0 0 5px}
.rm-car-info dl {margin:0;font-size:clamp(10px,1.4vw,13px)}
.rm-car-info dl>div {display:flex;justify-content:space-between;gap:4px}
.rm-car-info dt {color:#b9babc}.rm-car-info dd {margin:0;white-space:nowrap;font-weight:750}
.rm-readiness {grid-column:1/-1;justify-content:space-between;min-height:25px;padding:2px 0 0;color:#9ce584;font-size:clamp(10px,1.45vw,13px);line-height:1.1}
.rm-readiness.is-blocked {color:#ffd080}
.rm-readiness a {white-space:nowrap;color:#ffe8b7;text-decoration:underline;align-self:center;padding:5px 0}
.rm-footer {display:grid;grid-template-columns:auto minmax(0,1fr) minmax(150px,38%);gap:9px}
.race-room .rm-footer button {min-height:42px;font-weight:750;white-space:nowrap}
.race-room .rm-footer [data-start] {font-size:clamp(13px,2.05vw,19px);padding:6px}
.race-room .rm-footer [data-start]:disabled {opacity:.7}
.rm-reward {display:grid;justify-content:center;color:#ffd174;font-variant-numeric:tabular-nums;white-space:nowrap}
.rm-reward small {color:#c9c4ba}.rm-reward strong {font-size:clamp(12px,1.9vw,18px)}
.rm-status {position:absolute;bottom:51px;left:12px;margin:0;background:#17191eea;color:#ffdc92;padding:7px;border-radius:5px;max-width:80%;z-index:2}
.rm-status:empty {display:none}
.rm-picker {width:min(480px,80vw);max-height:calc(100dvh - 24px);padding:12px;background:#171c21}
.rm-picker header,.rm-picker button[data-race-car] {display:flex;align-items:center;justify-content:space-between;gap:8px}
.rm-picker header form {padding:0;border:0}
.rm-picker header h2 {margin:0}
.rm-picker button[data-race-car] {justify-content:flex-start;width:100%;margin-top:6px;text-align:left}
.rm-picker button[data-race-car] img {width:90px;height:52px;object-fit:contain}
.rm-picker button[data-race-car] small {display:block}
@media (max-height:380px) {
  .race-mobile {gap:5px}
  .rm-top {min-height:27px}
  .rm-setup {gap:4px}
  .race-room .rm-modes button {min-height:49px;padding-block:5px}
  .rm-track-info {padding-block:9px}
}
@media (max-width:720px) {
  .rm-modes small {font-size:9px}
  .rm-options {gap:4px;font-size:10px}
  .race-room .rm-options select {font-size:11px}
  .rm-car {grid-template-columns:39% minmax(0,1fr)}
  .rm-readiness a {padding-block:4px}
}
body:has(.race-mobile) .account-toast {top:49px;left:50%;bottom:auto;padding:5px 10px}

.race-room .race-difficulty-trigger{display:grid;grid-template-columns:1fr auto;gap:2px 12px;align-items:center;min-width:145px;text-align:left;padding:7px 11px;background:linear-gradient(125deg,#30291f,#191e26);border:1px solid #bb8c445e;border-radius:7px;color:#f2d5a0}
.race-difficulty-trigger>span{font-size:8px;letter-spacing:.12em;color:#a7a7aa}.race-difficulty-trigger>strong{grid-column:1;display:flex;align-items:center;gap:8px;font-size:13px}.race-difficulty-trigger>b{grid-column:2;grid-row:1/3;font-size:24px;color:#f2b84b}
.difficulty-bars{display:inline-flex;gap:3px;align-items:flex-end;height:15px;flex:none}.difficulty-bars i{width:4px;background:#4d5058;border-radius:1px;height:5px}.difficulty-bars i:nth-child(2){height:8px}.difficulty-bars i:nth-child(3){height:11px}.difficulty-bars i:nth-child(4){height:15px}.difficulty-bars .lit{background:#ffc455;box-shadow:0 0 6px #ffb32d35}
.race-difficulty-dialog{width:min(600px,calc(100vw - 26px));max-height:calc(100dvh - 24px);padding:18px;background:linear-gradient(135deg,#20262f,#12171f);border:1px solid #c294465e;border-radius:12px;color:#e8eaed;overflow:auto;box-shadow:0 20px 70px #000b}
.race-difficulty-dialog::backdrop{background:#06090dbe}.race-difficulty-dialog>header{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px;gap:15px}.race-difficulty-dialog h2{font-size:25px;margin:3px 0 0}.race-difficulty-dialog header small{color:#e8b45f;font-size:9px;letter-spacing:.15em}.race-difficulty-dialog header button{width:36px;min-height:36px;padding:0;font-size:24px}
.difficulty-choices{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.race-room .difficulty-choices>button{position:relative;display:grid;grid-template-columns:auto 1fr;gap:7px 10px;align-items:center;text-align:left;min-width:0;padding:12px;background:linear-gradient(130deg,#2a313b,#191e26);border:1px solid #ffffff20;border-radius:7px;transition:background .18s,box-shadow .18s,border-color .18s}
.difficulty-choices strong{font-size:16px}.difficulty-choices button>span:not(.difficulty-bars){grid-column:1/-1;font-size:11px;color:#aeb6c3;white-space:normal;line-height:1.35}.difficulty-choices button>small{grid-column:1/-1;color:#ddba7d;font-size:10px}.difficulty-choices button>b{position:absolute;right:12px;bottom:10px;color:#efc069}.race-room .difficulty-choices>button[aria-pressed=true]{background:linear-gradient(130deg,#493720,#24211c);border-color:#f2b84b;box-shadow:inset 0 0 20px #d69c2214,0 0 14px #d69c2220;color:#ffdc9a}.race-room .difficulty-choices>button:hover{border-color:#cc9d51}.race-difficulty-dialog>p{color:#969fac;font-size:11px;margin:12px 0 0;line-height:1.4}
@media(max-height:460px){.race-difficulty-dialog{padding:12px 16px}.race-difficulty-dialog>header{margin-bottom:9px}.race-difficulty-dialog h2{font-size:21px}.race-room .difficulty-choices>button{padding:9px 11px;gap:5px 8px}.difficulty-choices strong{font-size:14px}.difficulty-choices button>span:not(.difficulty-bars){font-size:10px}.race-difficulty-dialog>p{margin-top:9px}.race-room .race-difficulty-trigger{padding:4px 8px;min-height:40px;min-width:140px}}

.race-room :is([data-pick-difficulty],[data-race-rules],[data-difficulty],[data-close-difficulty],dialog form button){
  touch-action:manipulation;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;min-height:44px
}
.race-room :is([data-pick-difficulty],[data-race-rules],[data-difficulty]):active{filter:brightness(1.2)}
.race-room dialog[open]{overscroll-behavior:contain;touch-action:pan-y}

.race-room .rm-airfield-shortcut{position:absolute;top:8px;left:8px;z-index:2;min-height:38px;padding:4px 10px;touch-action:manipulation;background:#181715e8}
