/* ===== Tokens ===== */
:root{
  --bg:#EDF0F6; --bg-2:#FFFFFF; --bg-3:#F4F6FA; --line:#D9DFEB; --line-2:#C9D1E1;
  --ink:#0E1427; --ink-2:#47526F; --ink-3:#7A85A4;
  --accent:#B6F03C; --accent-ink:#0E1427; --accent-text:#3D7505; --accent-soft:rgba(140,200,20,.16);
  --lobby-a:#B6F03C; --lobby-a-text:#3D7505;
  --lobby-b:#38BDF8; --lobby-b-text:#0A6E9E;
  --lobby-c:#A584FF; --lobby-c-text:#5F3DD0;
  --red:#E0343A; --red-soft:rgba(224,52,58,.12);
  --gold:#E9B63B; --silver:#B9C2D0; --bronze:#C87A42;
  --chrome:#0E1427; --chrome-2:#18213D; --chrome-ink:#EEF2FB; --chrome-ink-2:#93A0C4; --chrome-line:#232D4C;
  --skeleton:#E2E7F0; --skeleton-hi:#F3F5F9;
  --elev: 0 1px 0 rgba(14,20,39,.03), 0 10px 30px -18px rgba(14,20,39,.25);
  --r-lg:20px; --r-md:14px; --r-sm:10px; --r-xs:7px;
  --font: 'Archivo', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
  --tabbar-h: 64px;
  color-scheme: light;
  box-sizing: border-box;
  padding-top: env(safe-area-inset-top, 0px);
  padding-bottom: env(safe-area-inset-bottom, 0px);
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --bg:#0E1427; --bg-2:#141C35; --bg-3:#1A2442; --line:#243055; --line-2:#2F3C66;
    --ink:#EEF2FB; --ink-2:#A6B1D1; --ink-3:#6F7BA2;
    --accent-text:#C6F566; --accent-soft:rgba(182,240,60,.13);
    --lobby-a-text:#C6F566; --lobby-b-text:#62D2FF; --lobby-c-text:#BDA5FF;
    --red:#FF5157; --red-soft:rgba(255,81,87,.14);
    --skeleton:#18213E; --skeleton-hi:#222D52;
    --elev: none;
    color-scheme: dark;
  }
}
:root[data-theme="dark"]{
  --bg:#0E1427; --bg-2:#141C35; --bg-3:#1A2442; --line:#243055; --line-2:#2F3C66;
  --ink:#EEF2FB; --ink-2:#A6B1D1; --ink-3:#6F7BA2;
  --accent-text:#C6F566; --accent-soft:rgba(182,240,60,.13);
  --lobby-a-text:#C6F566; --lobby-b-text:#62D2FF; --lobby-c-text:#BDA5FF;
  --red:#FF5157; --red-soft:rgba(255,81,87,.14);
  --skeleton:#18213E; --skeleton-hi:#222D52;
  --elev: none;
  color-scheme: dark;
}
html{ scroll-padding-top: calc(env(safe-area-inset-top, 0px) + 72px); background: var(--chrome); -webkit-text-size-adjust:100%; text-size-adjust:100%; }
*,*::before,*::after{ box-sizing: inherit; }
body{
  margin:0; min-height:100%; background:var(--bg); color:var(--ink);
  font-family:var(--font); font-size:15px; line-height:1.45; font-stretch:100%;
  -webkit-font-smoothing:antialiased; -webkit-tap-highlight-color:transparent;
  text-rendering:optimizeLegibility;
}
button,input,select,textarea{ font:inherit; color:inherit; }
button{ cursor:pointer; background:none; border:0; padding:0; }
a{ color:inherit; text-decoration:none; }
img{ max-width:100%; display:block; }
.num{ font-variant-numeric: tabular-nums; }
.display{ font-family:'Archivo','Avenir Next Condensed','Roboto Condensed','Arial Narrow',var(--font); font-stretch:66%; font-style:italic; font-weight:850; letter-spacing:-.01em; line-height:.95; }
.muted{ color:var(--ink-2); }
.faint{ color:var(--ink-3); }
.sr{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
:focus-visible{ outline:2px solid var(--accent); outline-offset:2px; border-radius:6px; }

/* ===== Shell ===== */
.app-header{
  position:sticky; top:env(safe-area-inset-top,0px); z-index:40;
  background:var(--chrome); color:var(--chrome-ink); border-bottom:1px solid var(--chrome-line);
  view-transition-name: app-header;
}
.app-header .in{ max-width:1160px; margin:0 auto; height:60px; display:flex; align-items:center; gap:18px; padding:0 16px; }
.logo{ display:flex; align-items:center; height:60px; }
.logo img{ height:34px; width:auto; }
.top-nav{ display:none; position:relative; gap:4px; margin-left:8px; }
.top-nav a{ position:relative; padding:8px 12px; border-radius:10px; color:var(--chrome-ink-2); font-weight:560; font-size:14.5px; transition:color .15s; }
.top-nav a[aria-current="page"]{ color:var(--chrome-ink); }
.top-nav .ind{ position:absolute; bottom:-11px; height:3px; border-radius:3px; background:var(--accent); left:0; width:0; transition: transform .38s cubic-bezier(.2,.9,.25,1.15), width .38s cubic-bezier(.2,.9,.25,1.15); }
.hdr-actions{ margin-left:auto; display:flex; align-items:center; gap:6px; }
.icon-btn{ position:relative; width:40px; height:40px; border-radius:12px; display:grid; place-items:center; color:var(--chrome-ink); }
.icon-btn:hover{ background:var(--chrome-2); }
.icon-btn svg{ width:22px; height:22px; }
.badge-dot{ position:absolute; top:6px; right:6px; min-width:17px; height:17px; padding:0 4px; border-radius:9px; background:var(--red); color:#fff; font-size:11px; font-weight:700; display:grid; place-items:center; border:2px solid var(--chrome); }
.me-btn{ width:36px; height:36px; border-radius:11px; overflow:hidden; }
.demo-pill{ font-size:11.5px; font-weight:700; color:var(--chrome); background:#F2C14E; padding:3px 8px; border-radius:999px; white-space:nowrap; }

.tabbar{
  position:fixed; left:0; right:0; bottom:0; z-index:40; background:var(--chrome); color:var(--chrome-ink-2);
  border-top:1px solid var(--chrome-line); padding-bottom:env(safe-area-inset-bottom,0px);
  view-transition-name: tabbar;
}
.tabbar .in{ display:grid; grid-template-columns:repeat(5,1fr); height:var(--tabbar-h); position:relative; }
.tabbar a{ display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px; font-size:11.5px; font-weight:600; position:relative; z-index:1; transition:color .2s; }
.tabbar a svg{ width:23px; height:23px; }
.tabbar a[aria-current="page"]{ color:var(--chrome-ink); }
.tabbar .ind{ position:absolute; top:8px; height:30px; width:56px; border-radius:15px; background:var(--chrome-2); left:0; transition: transform .42s cubic-bezier(.2,.9,.25,1.12); }


main#view{ max-width:1160px; margin:0 auto; padding:18px 16px calc(var(--tabbar-h) + 32px); view-transition-name: page; }
@media (min-width: 900px){
  .top-nav{ display:flex; }
  .tabbar{ display:none; }
  main#view{ padding:28px 24px 64px; }
  body{ font-size:15.5px; }
}

/* ===== View transitions ===== */
::view-transition-group(app-header), ::view-transition-group(tabbar){ animation:none; z-index:50; }
::view-transition-old(page), ::view-transition-new(page){ animation-duration:.26s; animation-timing-function:cubic-bezier(.2,.8,.2,1); }
html[data-dir="fwd"]::view-transition-old(page){ animation-name: vt-out-left; }
html[data-dir="fwd"]::view-transition-new(page){ animation-name: vt-in-right; }
html[data-dir="back"]::view-transition-old(page){ animation-name: vt-out-right; }
html[data-dir="back"]::view-transition-new(page){ animation-name: vt-in-left; }
html[data-dir="fade"]::view-transition-old(page){ animation-name: vt-fade-out; animation-duration:.14s; }
html[data-dir="fade"]::view-transition-new(page){ animation-name: vt-fade-in; animation-duration:.22s; }
@keyframes vt-out-left{ to{ opacity:0; transform:translateX(-28px); } }
@keyframes vt-in-right{ from{ opacity:0; transform:translateX(36px); } }
@keyframes vt-out-right{ to{ opacity:0; transform:translateX(28px); } }
@keyframes vt-in-left{ from{ opacity:0; transform:translateX(-36px); } }
@keyframes vt-fade-out{ to{ opacity:0; } }
@keyframes vt-fade-in{ from{ opacity:0; transform:translateY(6px); } }
::view-transition-group(drv-hero){ animation-duration:.38s; animation-timing-function:cubic-bezier(.2,.9,.25,1.05); }
::view-transition-old(drv-hero), ::view-transition-new(drv-hero){ animation-duration:.38s; height:100%; }

/* ===== Type ===== */
h1,h2,h3{ margin:0; }
.page-title{ font-size:40px; margin:6px 0 4px; }
.page-sub{ color:var(--ink-2); margin:0 0 18px; }
.sec-head{ display:flex; align-items:baseline; justify-content:space-between; gap:12px; margin:30px 0 12px; }
.sec-head h2{ font-size:26px; }
.sec-head .link{ color:var(--accent-text); font-weight:620; font-size:14px; padding:6px 0; }
.lbl-sm{ }
@media (max-width:600px){ .hide-sm{ display:none !important; } }
.label{ font-size:12.5px; color:var(--ink-3); font-weight:560; }

/* ===== Buttons & controls ===== */
.btn{ display:inline-flex; align-items:center; justify-content:center; gap:8px; min-height:46px; padding:0 18px; border-radius:var(--r-md); font-weight:700; font-size:15px; background:var(--bg-3); color:var(--ink); border:1px solid var(--line); user-select:none; touch-action:manipulation; }
.btn svg{ width:19px; height:19px; }
.btn.primary{ background:var(--accent); color:var(--accent-ink); border-color:transparent; }
.btn.danger{ background:var(--red-soft); color:var(--red); border-color:transparent; }
.btn.small{ min-height:36px; padding:0 12px; font-size:13.5px; border-radius:var(--r-sm); }
.btn.block{ width:100%; }
.btn[disabled]{ opacity:.42; pointer-events:none; }
.tap{ touch-action:manipulation; user-select:none; -webkit-user-select:none; }

.seg{ position:relative; display:inline-grid; grid-auto-flow:column; grid-auto-columns:1fr; background:var(--bg-3); border:1px solid var(--line); border-radius:13px; padding:3px; max-width:100%; }
.seg button{ position:relative; z-index:1; padding:8px 14px; border-radius:10px; font-weight:640; font-size:14px; color:var(--ink-2); white-space:nowrap; transition:color .2s; }
.seg button[aria-pressed="true"]{ color:var(--ink); }
.seg .thumb{ position:absolute; top:3px; bottom:3px; left:0; border-radius:10px; background:var(--bg-2); box-shadow:0 1px 2px rgba(0,0,0,.12); border:1px solid var(--line); transition: transform .4s cubic-bezier(.2,.9,.25,1.12), width .4s cubic-bezier(.2,.9,.25,1.12); }
.seg.scroll{ display:flex; overflow-x:auto; scrollbar-width:none; }
.seg.scroll::-webkit-scrollbar{ display:none; }
.seg.scroll button{ flex:0 0 auto; }

.chips{ display:flex; gap:8px; overflow-x:auto; scrollbar-width:none; padding:2px 0 4px; margin:0 -16px; padding-left:16px; padding-right:16px; }
.chips::-webkit-scrollbar{ display:none; }
.chip{ flex:0 0 auto; min-height:34px; padding:0 13px; border-radius:999px; border:1px solid var(--line); background:var(--bg-2); color:var(--ink-2); font-weight:600; font-size:13.5px; display:inline-flex; align-items:center; gap:6px; }
.chip[aria-pressed="true"]{ background:var(--ink); color:var(--bg); border-color:var(--ink); }
.chip .x{ opacity:.6; }

.field{ display:flex; align-items:center; gap:10px; background:var(--bg-2); border:1px solid var(--line); border-radius:var(--r-md); padding:0 14px; min-height:48px; }
.field svg{ width:19px; height:19px; color:var(--ink-3); flex:0 0 auto; }
.field input{ flex:1; border:0; outline:0; background:transparent; min-width:0; font-size:16px; }
select.select{ appearance:none; background:var(--bg-2) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%237A85A4' stroke-width='2' fill='none'/%3E%3C/svg%3E") no-repeat right 12px center; border:1px solid var(--line); border-radius:var(--r-md); min-height:40px; padding:0 34px 0 12px; font-weight:600; font-size:14px; }

/* ===== Cards ===== */
.panel{ background:var(--bg-2); border:1px solid var(--line); border-radius:var(--r-lg); box-shadow:var(--elev); }
.panel.pad{ padding:18px; }
.grid-2{ display:grid; gap:16px; }
@media (min-width: 900px){ .grid-2{ grid-template-columns: 1.35fr 1fr; gap:24px; align-items:start; } }

/* ===== Lobby badge, positions, avatars ===== */
.lobby{ display:inline-grid; place-items:center; width:24px; height:24px; border-radius:7px; font-weight:850; font-size:13px; font-style:italic; font-stretch:75%; color:var(--accent-ink); flex:0 0 auto; }
.lobby.A{ background:var(--lobby-a); } .lobby.B{ background:var(--lobby-b); } .lobby.C{ background:var(--lobby-c); }
.lobby.lg{ width:44px; height:44px; border-radius:12px; font-size:26px; }
.lobby-text.A{ color:var(--lobby-a-text); } .lobby-text.B{ color:var(--lobby-b-text); } .lobby-text.C{ color:var(--lobby-c-text); }
.avatar{ position:relative; display:grid; place-items:center; width:40px; height:40px; border-radius:12px; font-weight:800; font-size:14px; color:#fff; flex:0 0 auto; overflow:hidden; font-stretch:80%; }
.avatar::after{ content:""; position:absolute; inset:auto 0 0 0; height:4px; background:var(--t2, transparent); }
.avatar.lg{ width:88px; height:88px; border-radius:24px; font-size:30px; }
.avatar.lg::after{ height:7px; }
.rnum{ font-stretch:68%; font-style:italic; font-weight:850; }
.cc{ display:inline-grid; place-items:center; min-width:34px; height:20px; padding:0 5px; border-radius:5px; border:1px solid var(--line-2); font-size:11px; font-weight:750; color:var(--ink-2); letter-spacing:.02em; }

/* ===== Home hero ===== */
.hero{ position:relative; overflow:hidden; border-radius:24px; background:var(--chrome); color:var(--chrome-ink); padding:20px 20px 22px; isolation:isolate; }
.hero .cover{ position:absolute; inset:0; z-index:-2; background-size:cover; background-position:center 35%; opacity:.22; filter:saturate(1.1); }
.hero::before{ content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(180deg, rgba(14,20,39,.55) 0%, rgba(14,20,39,.92) 62%, var(--chrome) 100%); }
.hero-top{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.state-pill{ display:inline-flex; align-items:center; gap:7px; font-size:13px; font-weight:700; padding:5px 11px 5px 9px; border-radius:999px; background:rgba(255,255,255,.08); color:var(--chrome-ink); }
.state-pill .live{ width:8px; height:8px; border-radius:50%; background:var(--accent); box-shadow:0 0 0 0 rgba(182,240,60,.6); animation:pulse 2s infinite; }
@keyframes pulse{ 0%{ box-shadow:0 0 0 0 rgba(182,240,60,.55);} 70%{ box-shadow:0 0 0 9px rgba(182,240,60,0);} 100%{ box-shadow:0 0 0 0 rgba(182,240,60,0);} }
.hero h1{ font-size:clamp(44px, 12vw, 76px); margin:18px 0 2px; }
.hero .track{ font-size:17px; font-weight:600; color:var(--chrome-ink); display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.hero .track .cc{ color:var(--chrome-ink-2); border-color:rgba(255,255,255,.22); }
.hero .when{ color:var(--chrome-ink-2); margin-top:4px; font-size:14.5px; }
.lights{ display:flex; gap:9px; margin:22px 0 10px; height:22px; }
.lights i{ width:22px; height:22px; border-radius:50%; background:#2A1416; box-shadow: inset 0 0 0 2px rgba(255,255,255,.06); transition: background .08s, box-shadow .08s; }
.lights i.on{ background:#FF2D36; box-shadow: 0 0 14px 2px rgba(255,45,54,.55), inset 0 0 0 2px rgba(255,255,255,.12); }
.lights.out i{ transition: background .25s, box-shadow .25s; }
.countdown{ display:flex; align-items:flex-end; gap:4px; max-width:100%; }
.countdown .u{ display:flex; flex-direction:column; align-items:flex-start; }
.countdown .v{ font-family:'Archivo','Avenir Next Condensed','Roboto Condensed','Arial Narrow',var(--font); font-size:clamp(44px, 13vw, 84px); line-height:.86; font-stretch:62%; font-style:italic; font-weight:900; font-variant-numeric:tabular-nums; }
.countdown .k{ font-size:12px; color:var(--chrome-ink-2); font-weight:600; margin-top:6px; }
.countdown .sep{ font-size:clamp(30px, 8vw, 54px); line-height:1; color:var(--chrome-ink-2); font-weight:300; padding-bottom:22px; }
.hero-season{ display:flex; gap:6px; margin-top:22px; }
.hero-season .rd{ flex:1; height:6px; border-radius:3px; background:rgba(255,255,255,.12); position:relative; overflow:hidden; }
.hero-season .rd.done{ background:rgba(255,255,255,.55); }
.hero-season .rd.next{ background:repeating-linear-gradient(-45deg, #FF3B3F 0 7px, #fff 7px 14px); }
.hero-season-l{ display:flex; justify-content:space-between; font-size:12px; color:var(--chrome-ink-2); margin-top:8px; }
.hero-actions{ display:flex; gap:10px; margin-top:20px; flex-wrap:wrap; }
.hero-actions .btn{ flex:1 1 auto; }
@media (min-width: 900px){
  .hero{ padding:30px 36px 32px; }
  .hero .cover{ left:38%; opacity:.62; -webkit-mask-image:linear-gradient(90deg, transparent 0%, #000 45%); mask-image:linear-gradient(90deg, transparent 0%, #000 45%); background-position:center 40%; }
  .hero::before{ background:linear-gradient(90deg, var(--chrome) 30%, rgba(14,20,39,.35) 100%); }
  .hero-season, .hero-season-l{ max-width:560px; }
  .hero-actions .btn{ flex:0 0 auto; }
}
.hero .btn{ background:rgba(255,255,255,.08); color:var(--chrome-ink); border-color:rgba(255,255,255,.12); }
.hero .btn.primary{ background:var(--accent); color:var(--accent-ink); border-color:transparent; }

.me-card{ display:grid; grid-template-columns:auto minmax(0,1fr); align-items:center; gap:12px 14px; padding:16px; }
.me-card .acts{ grid-column:1 / -1; display:flex; gap:8px; }
.me-card .acts .btn{ flex:1 1 0; }
@media (min-width:560px){ .me-card{ grid-template-columns:auto minmax(0,1fr) auto; } .me-card .acts{ grid-column:auto; } .me-card .acts .btn{ flex:0 0 auto; } }
.me-card .big{ font-size:44px; line-height:.9; }
.me-card .meta{ flex:1; min-width:0; }
.me-card .meta b{ display:block; font-size:16px; }
.stat-row{ display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid var(--line); }
.stat-row > div{ padding:14px 16px; }
.stat-row > div + div{ border-left:1px solid var(--line); }
.stat-row .v{ font-size:30px; line-height:1; }
.stat-row .k{ font-size:12.5px; color:var(--ink-3); margin-top:4px; }

/* ===== Timing tower ===== */
.tower-wrap{ container-type:inline-size; border-radius:var(--r-lg); background:var(--bg-2); border:1px solid var(--line); overflow:hidden; box-shadow:var(--elev); }
.tower{ list-style:none; margin:0; padding:0; background:var(--bg-2); }
.tower li{ position:relative; }
.trow{ display:grid; grid-template-columns: 44px 20px minmax(0,1fr) auto; align-items:center; gap:10px; padding:0 14px 0 0; min-height:54px; width:100%; text-align:left; background:var(--bg-2); }
.tower li + li .trow{ border-top:1px solid var(--line); }
.trow:active{ background:var(--bg-3); }
.trow .pos{ height:100%; min-height:54px; display:grid; place-items:center; font-size:22px; font-family:'Archivo','Avenir Next Condensed','Roboto Condensed','Arial Narrow',var(--font); font-stretch:62%; font-style:italic; font-weight:900; font-variant-numeric:tabular-nums; background:var(--bg-3); }
.trow .pos.p1{ background:var(--gold); color:#2A1E00; } .trow .pos.p2{ background:var(--silver); color:#1A2030; } .trow .pos.p3{ background:var(--bronze); color:#2A1405; }
.trow .delta{ font-size:11.5px; font-weight:800; display:flex; align-items:center; justify-content:center; font-variant-numeric:tabular-nums; }
.delta.up{ color:#2FB36B; } .delta.down{ color:var(--red); } .delta.same{ color:var(--ink-3); }
.trow .who{ display:flex; align-items:center; gap:10px; min-width:0; }
.trow .stripe{ width:4px; height:30px; border-radius:2px; flex:0 0 auto; background:var(--t1, var(--line-2)); }
.trow .nm{ min-width:0; }
.trow .nm b{ display:block; font-size:15px; font-weight:700; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.trow .nm > span{ display:block; font-size:12.5px; color:var(--ink-3); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.trow .pts{ display:flex; align-items:center; gap:10px; }
.trow .pts b{ font-size:20px; font-family:'Archivo','Avenir Next Condensed','Roboto Condensed','Arial Narrow',var(--font); font-stretch:68%; font-weight:850; font-variant-numeric:tabular-nums; min-width:52px; text-align:right; }
.trow.me{ background:linear-gradient(90deg, var(--accent-soft), transparent 70%); }
.trow .cols{ display:none; gap:0; }
.trow .cols span{ width:64px; text-align:right; font-variant-numeric:tabular-nums; color:var(--ink-2); font-size:14px; }
.tower-head{ display:none; }
@container (min-width: 620px){
  .trow{ grid-template-columns: 52px 22px minmax(0,1fr) auto auto; }
  .trow .cols{ display:flex; }
  .tower-head{ display:grid; grid-template-columns: 52px 22px minmax(0,1fr) auto auto; gap:10px; padding:10px 14px 10px 0; font-size:12px; color:var(--ink-3); font-weight:600; border-bottom:1px solid var(--line); background:var(--bg-3); }
  .tower-head .cols{ display:flex; } .tower-head .cols span{ width:64px; text-align:right; }
  .tower-head .p{ text-align:center; }
  .tower-head .pt{ min-width:86px; text-align:right; }
}
.tower-tools{ display:flex; align-items:center; justify-content:space-between; gap:10px; flex-wrap:wrap; margin-bottom:12px; }

/* ===== Lists & cards ===== */
.list{ list-style:none; margin:0; padding:0; }
.drv-grid{ display:grid; grid-template-columns:1fr; gap:10px; }
@media (min-width: 640px){ .drv-grid{ grid-template-columns:1fr 1fr; } }
@media (min-width: 1000px){ .drv-grid{ grid-template-columns:1fr 1fr 1fr; } }
.drv-card{ display:flex; align-items:center; gap:12px; padding:12px 14px; background:var(--bg-2); border:1px solid var(--line); border-radius:var(--r-md); text-align:left; width:100%; }
.drv-card .nm{ flex:1; min-width:0; }
.drv-card .nm b{ display:block; font-size:15px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.drv-card .nm > span{ display:block; font-size:12.5px; color:var(--ink-3); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.rating{ display:flex; gap:4px; }
.rating span{ font-size:12px; font-weight:800; padding:3px 6px; border-radius:6px; background:var(--bg-3); border:1px solid var(--line); font-variant-numeric:tabular-nums; }
.rating .dr{ color:var(--ink); }
.rating .srb{ color:var(--ink-2); }

.toolbar{ display:flex; flex-direction:column; gap:12px; margin-bottom:16px; }
.toolbar .row{ display:flex; gap:10px; align-items:center; justify-content:space-between; flex-wrap:wrap; }
.count-line{ font-size:13.5px; color:var(--ink-3); }

/* ===== Profile ===== */
.profile-head{ display:flex; gap:16px; align-items:flex-end; padding:20px; border-radius:24px; background:var(--chrome); color:var(--chrome-ink); position:relative; overflow:hidden; isolation:isolate; }
.profile-head .bign{ position:absolute; right:-6px; bottom:-26px; font-size:170px; line-height:1; font-stretch:62%; font-style:italic; font-weight:900; color:rgba(255,255,255,.06); z-index:-1; }
.profile-head h1{ font-size:34px; }
.profile-head .sub{ color:var(--chrome-ink-2); font-size:14px; margin-top:6px; display:flex; gap:8px; flex-wrap:wrap; align-items:center; }
.profile-head .rating span{ background:rgba(255,255,255,.08); border-color:rgba(255,255,255,.14); color:var(--chrome-ink); }
.kv{ display:grid; grid-template-columns:repeat(2,1fr); gap:1px; background:var(--line); border:1px solid var(--line); border-radius:var(--r-lg); overflow:hidden; }
@media (min-width:760px){ .kv{ grid-template-columns:repeat(4,1fr); } }
.kv > div{ background:var(--bg-2); padding:14px 16px; }
.kv .v{ font-size:17px; font-weight:700; margin-top:3px; display:flex; align-items:center; gap:8px; }
.kv .v svg{ width:20px; height:20px; flex:0 0 auto; color:var(--ink-3); }
.kv .v.big{ font-size:30px; font-stretch:66%; font-style:italic; font-weight:850; line-height:1; }

/* ===== Seasons ===== */
.season-card{ display:block; overflow:hidden; border-radius:var(--r-lg); background:var(--bg-2); border:1px solid var(--line); box-shadow:var(--elev); }
.season-card .img{ aspect-ratio: 545/190; background-size:cover; background-position:center; }
.season-card .body{ padding:14px 16px 16px; }
.season-card h3{ font-size:24px; }
.season-card .meta{ display:flex; gap:12px; flex-wrap:wrap; color:var(--ink-2); font-size:13.5px; margin-top:8px; }
.season-card .meta span{ display:inline-flex; align-items:center; gap:6px; }
.season-card .meta svg{ width:16px; height:16px; color:var(--ink-3); }
.season-list{ display:grid; gap:14px; }
@media (min-width: 760px){ .season-list{ grid-template-columns:1fr 1fr; } }
.status{ display:inline-flex; align-items:center; gap:6px; font-size:12.5px; font-weight:700; padding:4px 10px; border-radius:999px; background:var(--bg-3); color:var(--ink-2); border:1px solid var(--line); }
.status.live{ background:var(--accent-soft); color:var(--accent-text); border-color:transparent; }
.status.live::before{ content:""; width:7px; height:7px; border-radius:50%; background:currentColor; }

.season-hero{ position:relative; border-radius:24px; overflow:hidden; background:var(--chrome); color:var(--chrome-ink); }
.season-hero .img{ aspect-ratio: 596/308; background-size:cover; background-position:center; }
@media (min-width: 900px){ .season-hero{ display:grid; grid-template-columns: 1.1fr 1fr; } .season-hero .img{ aspect-ratio:auto; min-height:300px; } }
.season-hero .body{ padding:18px 20px 20px; }
.season-hero h1{ font-size:clamp(34px, 8vw, 48px); margin:10px 0 6px; }
.season-hero .facts{ display:grid; grid-template-columns:auto 1fr; gap:6px 14px; font-size:14px; margin-top:12px; }
.season-hero .facts dt{ color:var(--chrome-ink-2); }
.season-hero .facts dd{ margin:0; font-weight:600; }
.tabs-sticky{ position:sticky; top:calc(env(safe-area-inset-top,0px) + 60px); z-index:20; background:var(--bg); padding:12px 0 10px; margin:0 -16px; padding-left:16px; padding-right:16px; }
.kerb{ height:10px; border-radius:5px; background:var(--bg-3); border:1px solid var(--line); overflow:hidden; }
.kerb > i{ display:block; height:100%; background:repeating-linear-gradient(-45deg, #FF3B3F 0 8px, #fff 8px 16px); transform-origin:left; }

.round-item{ display:flex; align-items:center; gap:14px; padding:14px 16px; background:var(--bg-2); border:1px solid var(--line); border-radius:var(--r-md); width:100%; text-align:left; }
.round-item .no{ font-size:38px; width:34px; line-height:.9; color:var(--ink-3); }
.round-item.next .no{ color:var(--accent-text); }
.round-item .t{ flex:1; min-width:0; }
.round-item .t b{ display:block; font-size:16px; }
.round-item .t .sub{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; font-size:13px; color:var(--ink-3); margin-top:2px; }
.round-item .t .sub .status{ font-size:11.5px; padding:2px 8px; }
.round-item svg.chev{ width:20px; height:20px; color:var(--ink-3); }

/* results table */
.rtable{ width:100%; border-collapse:collapse; font-size:14px; }
.rtable-wrap{ background:var(--bg-2); border:1px solid var(--line); border-radius:var(--r-lg); overflow-x:auto; }
.rtable th{ text-align:left; font-size:12px; font-weight:600; color:var(--ink-3); padding:10px 10px; border-bottom:1px solid var(--line); white-space:nowrap; background:var(--bg-3); }
.rtable td{ padding:10px; border-bottom:1px solid var(--line); white-space:nowrap; }
.rtable tr:last-child td{ border-bottom:0; }
.rtable td.r, .rtable th.r{ text-align:right; font-variant-numeric:tabular-nums; }
.rtable .p{ font-weight:900; font-stretch:66%; font-style:italic; font-size:18px; width:36px; text-align:center; }
.rtable .nm b{ font-weight:700; }
.fl{ display:inline-flex; align-items:center; padding:1px 6px; border-radius:5px; font-size:11px; font-weight:800; background:#7C3AED; color:#fff; margin-left:6px; }
.st{ font-size:11.5px; font-weight:800; padding:2px 6px; border-radius:5px; }
.st.dsq{ background:var(--red); color:#fff; }
.st.dnf{ background:var(--red-soft); color:var(--red); } .st.dns{ background:var(--bg-3); color:var(--ink-3); border:1px solid var(--line); }

.pq-cut{ display:flex; align-items:center; gap:10px; padding:6px 14px; font-size:12.5px; font-weight:700; color:var(--ink-2); background:var(--bg-3); border-top:1px dashed var(--line-2); border-bottom:1px dashed var(--line-2); }
.pq-cut::before, .pq-cut::after{ content:""; flex:1; height:2px; border-radius:1px; background:repeating-linear-gradient(90deg, #FF3B3F 0 8px, #fff 8px 16px); opacity:.85; }

.grid-sheet{ display:grid; grid-template-columns:1fr 1fr; gap:10px 14px; }
.grid-slot{ display:flex; align-items:center; gap:10px; padding:10px 12px; background:var(--bg-2); border:1px solid var(--line); border-radius:var(--r-sm); }
.grid-slot:nth-child(even){ margin-top:28px; }
.grid-slot .gp{ font-size:22px; width:30px; color:var(--ink-3); }
.grid-slot b{ font-size:14px; display:block; }
.grid-slot span{ font-size:12px; color:var(--ink-3); }

/* ===== Results entry ===== */
.entry-wrap{ display:grid; gap:16px; }
@media (min-width: 900px){ .entry-wrap{ grid-template-columns: 1.2fr 1fr; align-items:start; } }
.order{ list-style:none; margin:0; padding:0; background:var(--bg-2); border:1px solid var(--line); border-radius:var(--r-lg); overflow:hidden; }
.order li{ display:grid; grid-template-columns:44px minmax(0,1fr) auto; align-items:center; gap:10px; min-height:52px; padding-right:8px; border-bottom:1px solid var(--line); background:var(--bg-2); }
.order li:last-child{ border-bottom:0; }
.order li.slot{ color:var(--ink-3); }
.order li .p{ height:100%; min-height:52px; display:grid; place-items:center; font-size:20px; font-stretch:62%; font-style:italic; font-weight:900; background:var(--bg-3); }
.order li.slot .p{ color:var(--ink-3); }
.order li.slot .hint{ font-size:13px; }
.order li.next .p{ background:var(--accent); color:var(--accent-ink); }
.order .acts{ display:flex; gap:4px; }
.order .acts button{ width:34px; height:34px; border-radius:9px; display:grid; place-items:center; color:var(--ink-2); }
.order .acts button:active{ background:var(--bg-3); }
.order .acts button[disabled]{ opacity:.25; }
.order .acts svg{ width:18px; height:18px; }
.pool{ display:flex; flex-wrap:wrap; gap:8px; padding:14px; background:var(--bg-2); border:1px solid var(--line); border-radius:var(--r-lg); min-height:80px; }
.pool .pchip{ display:inline-flex; align-items:center; gap:8px; padding:8px 12px 8px 8px; border-radius:12px; background:var(--bg-3); border:1px solid var(--line); font-weight:650; font-size:14px; }
.pool .pchip .rn{ display:grid; place-items:center; min-width:30px; height:26px; border-radius:7px; background:var(--chrome); color:var(--chrome-ink); font-size:14px; font-stretch:68%; font-style:italic; font-weight:850; padding:0 4px; border-bottom:3px solid var(--t1, transparent); }
.entry-bar{ position:sticky; bottom:calc(var(--tabbar-h) + env(safe-area-inset-bottom,0px) + 10px); z-index:15; display:flex; gap:10px; align-items:center; padding:10px; background:var(--bg-2); border:1px solid var(--line); border-radius:var(--r-lg); box-shadow:0 10px 30px -10px rgba(0,0,0,.35); margin-top:16px; }
@media (min-width:900px){ .entry-bar{ bottom:16px; } }
.entry-bar .prog{ flex:1; font-size:13.5px; color:var(--ink-2); }
.entry-bar .prog b{ color:var(--ink); }

/* ===== Sheet / toast ===== */
.backdrop{ position:fixed; inset:0; z-index:80; background:rgba(5,8,18,.55); opacity:0; }
.sheet{ position:fixed; left:0; right:0; bottom:0; z-index:81; max-height:88vh; display:flex; flex-direction:column; background:var(--bg-2); color:var(--ink); border-radius:22px 22px 0 0; padding-bottom:env(safe-area-inset-bottom,0px); transform:translateY(100%); box-shadow:0 -10px 40px rgba(0,0,0,.35); }
@media (min-width: 700px){ .sheet{ left:50%; right:auto; width:520px; margin-left:-260px; bottom:24px; border-radius:22px; max-height:80vh; } }
.sheet .grab{ padding:10px 0 4px; display:grid; place-items:center; touch-action:none; cursor:grab; }
.sheet .grab i{ width:42px; height:5px; border-radius:3px; background:var(--line-2); }
.sheet .sh-head{ display:flex; align-items:center; justify-content:space-between; padding:4px 18px 10px; touch-action:none; }
.sheet .sh-head h3{ font-size:24px; }
.sheet .sh-body{ overflow-y:auto; padding:0 18px 18px; overscroll-behavior:contain; }
.menu-item{ display:flex; align-items:center; gap:12px; width:100%; min-height:52px; padding:0 4px; border-bottom:1px solid var(--line); text-align:left; font-weight:600; }
.menu-item svg{ width:20px; height:20px; color:var(--ink-3); }
.menu-item .end{ margin-left:auto; color:var(--ink-3); font-weight:500; font-size:14px; }
.menu-item .chev{ margin-left:auto; }
.menu-item .end + .chev{ margin-left:8px; }
.menu-item[aria-pressed="true"]{ color:var(--accent-text); }
.menu-item[aria-pressed="true"] svg{ color:var(--accent-text); }
.notif{ display:flex; gap:12px; padding:14px 2px; border-bottom:1px solid var(--line); text-align:left; width:100%; }
.notif .ic{ width:38px; height:38px; border-radius:11px; display:grid; place-items:center; background:var(--bg-3); flex:0 0 auto; }
.notif .ic svg{ width:19px; height:19px; }
.notif b{ display:block; font-size:14.5px; }
.notif span{ font-size:13px; color:var(--ink-2); }
.notif time{ display:block; font-size:12px; color:var(--ink-3); margin-top:3px; }
.notif.unread b::after{ content:""; display:inline-block; width:8px; height:8px; border-radius:50%; background:var(--red); margin-left:8px; vertical-align:middle; }
.toast{ position:fixed; left:50%; bottom:calc(var(--tabbar-h) + env(safe-area-inset-bottom,0px) + 16px); z-index:90; transform:translate(-50%, 20px); opacity:0; display:flex; align-items:center; gap:10px; padding:12px 16px; border-radius:14px; background:var(--ink); color:var(--bg); font-weight:650; font-size:14.5px; box-shadow:0 10px 30px rgba(0,0,0,.3); max-width:calc(100% - 32px); }
.toast svg{ width:18px; height:18px; color:var(--accent); }
@media (min-width:900px){ .toast{ bottom:28px; } }

/* ===== Skeleton ===== */
.skel{ border-radius:10px; background:linear-gradient(90deg, var(--skeleton) 0%, var(--skeleton-hi) 40%, var(--skeleton) 80%); background-size:200% 100%; animation:shimmer 1.1s linear infinite; }
@keyframes shimmer{ from{ background-position:120% 0; } to{ background-position:-80% 0; } }

.empty{ padding:28px 18px; text-align:center; color:var(--ink-2); background:var(--bg-2); border:1px dashed var(--line-2); border-radius:var(--r-lg); }
.note{ font-size:13px; color:var(--ink-3); margin-top:10px; }
.callout{ display:flex; gap:12px; align-items:flex-start; padding:14px 16px; border-radius:var(--r-md); background:var(--accent-soft); color:var(--ink); }
.callout svg{ width:20px; height:20px; color:var(--accent-text); flex:0 0 auto; margin-top:1px; }
.callout.warn{ background:var(--red-soft); } .callout.warn svg{ color:var(--red); }
.stack{ display:grid; gap:12px; }
.row-between{ display:flex; align-items:center; justify-content:space-between; gap:12px; }
.spacer{ height:24px; }

@media (prefers-reduced-motion: reduce){
  *, *::before, *::after{ animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; scroll-behavior:auto !important; }
  ::view-transition-group(*), ::view-transition-old(*), ::view-transition-new(*){ animation:none !important; }
}

/* ===================================================================
   Phase 1 additions: forms, wizard, banners, admin
   =================================================================== */
.narrow{ max-width:520px; margin:0 auto; }
.form{ display:grid; gap:16px; }
.f-row{ display:grid; gap:6px; }
.f-row > label, .f-label{ font-size:13.5px; font-weight:650; color:var(--ink-2); }
.f-row .hint{ font-size:12.5px; color:var(--ink-3); }
.f-row .err{ font-size:12.5px; color:var(--red); font-weight:600; }
.f-row .err:empty{ display:none; }
.input{ width:100%; min-height:50px; padding:0 14px; border-radius:var(--r-md); border:1px solid var(--line); background:var(--bg-2); font-size:16px; outline:0; transition:border-color .15s, box-shadow .15s; }
.input:focus{ border-color:var(--accent-text); box-shadow:0 0 0 3px var(--accent-soft); }
.input[aria-invalid="true"]{ border-color:var(--red); }
.input.big{ font-size:34px; font-weight:850; font-style:italic; font-stretch:66%; min-height:64px; font-family:'Archivo','Avenir Next Condensed','Roboto Condensed','Arial Narrow',var(--font); }
.pw-wrap{ position:relative; }
.pw-wrap .input{ padding-right:52px; }
.pw-wrap button{ position:absolute; right:4px; top:4px; width:42px; height:42px; display:grid; place-items:center; color:var(--ink-3); border-radius:10px; }
.pw-wrap svg{ width:20px; height:20px; }
.choice{ display:flex; flex-wrap:wrap; gap:8px; }
.choice .chip{ min-height:40px; padding:0 15px; font-size:14.5px; }
.chip[disabled]{ opacity:.4; }
.auth-card{ padding:24px 20px; }
.auth-card h1{ font-size:40px; margin-bottom:6px; }
.auth-alt{ text-align:center; color:var(--ink-2); font-size:14.5px; margin-top:16px; }
.auth-alt a{ color:var(--accent-text); font-weight:700; }
.form-error{ display:flex; gap:10px; align-items:flex-start; padding:12px 14px; border-radius:var(--r-md); background:var(--red-soft); color:var(--red); font-weight:600; font-size:14px; }
.form-error svg{ width:18px; height:18px; flex:0 0 auto; margin-top:1px; }
.spin{ width:18px; height:18px; border-radius:50%; border:2.5px solid currentColor; border-right-color:transparent; animation:spin .7s linear infinite; }
@keyframes spin{ to{ transform:rotate(360deg); } }
.wizard-steps{ display:flex; gap:6px; margin:4px 0 22px; }
.wizard-steps i{ flex:1; height:6px; border-radius:3px; background:var(--bg-3); border:1px solid var(--line); }
.wizard-steps i.done{ background:var(--accent); border-color:transparent; }
.wizard-steps i.on{ background:repeating-linear-gradient(-45deg, #FF3B3F 0 7px, #fff 7px 14px); border-color:transparent; }
.wizard-body{ min-height:320px; }
.wizard-foot{ display:flex; gap:10px; margin-top:26px; }
.wizard-foot .btn{ flex:1; }
.team-pick{ display:grid; gap:8px; }
.team-opt{ display:flex; align-items:center; gap:12px; padding:12px 14px; border-radius:var(--r-md); border:1px solid var(--line); background:var(--bg-2); text-align:left; width:100%; }
.team-opt[aria-pressed="true"]{ border-color:var(--accent-text); box-shadow:0 0 0 3px var(--accent-soft); }
.team-opt .sw{ width:6px; height:30px; border-radius:3px; flex:0 0 auto; }
.team-opt b{ flex:1; font-size:15px; }
.team-opt .status{ font-size:11.5px; padding:2px 8px; }
.banner{ display:flex; align-items:center; gap:12px; padding:12px 14px; margin-bottom:16px; border-radius:var(--r-md); background:var(--accent-soft); }
.banner.warn{ background:var(--red-soft); }
.banner > svg{ width:20px; height:20px; color:var(--accent-text); flex:0 0 auto; }
.banner.warn > svg{ color:var(--red); }
.banner .txt{ flex:1; min-width:0; font-size:14px; }
.banner .txt b{ display:block; font-size:14.5px; }
.tiles{ display:grid; grid-template-columns:1fr 1fr; gap:10px; }
@media (min-width:760px){ .tiles{ grid-template-columns:repeat(4,1fr); } }
.tile{ display:flex; flex-direction:column; gap:10px; padding:16px; border-radius:var(--r-lg); background:var(--bg-2); border:1px solid var(--line); min-height:118px; }
.tile svg{ width:22px; height:22px; color:var(--accent-text); }
.tile b{ font-size:16px; }
.tile .n{ margin-top:auto; font-size:34px; line-height:1; }
.row-card{ display:flex; align-items:center; gap:12px; padding:12px 14px; border-radius:var(--r-md); background:var(--bg-2); border:1px solid var(--line); width:100%; text-align:left; }
.row-card .nm{ flex:1; min-width:0; }
.row-card .nm b{ display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.row-card .nm > span{ display:block; font-size:12.5px; color:var(--ink-3); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.roles{ display:flex; gap:4px; flex-wrap:wrap; }
.role-tag{ font-size:11px; font-weight:800; padding:2px 7px; border-radius:6px; background:var(--bg-3); border:1px solid var(--line); color:var(--ink-2); }
.role-tag.owner{ background:#F2C14E; color:#2A1E00; border-color:transparent; }
.role-tag.admin{ background:var(--accent); color:var(--accent-ink); border-color:transparent; }
.toggle-row{ display:flex; align-items:center; justify-content:space-between; gap:12px; min-height:54px; border-bottom:1px solid var(--line); font-weight:600; }
.toggle-row small{ display:block; font-weight:500; color:var(--ink-3); font-size:12.5px; }
.switch{ position:relative; width:52px; height:32px; border-radius:16px; background:var(--line-2); transition:background .2s; flex:0 0 auto; }
.switch::after{ content:""; position:absolute; top:3px; left:3px; width:26px; height:26px; border-radius:50%; background:#fff; box-shadow:0 1px 3px rgba(0,0,0,.3); transition:transform .32s cubic-bezier(.3,1.4,.5,1); }
.switch[aria-checked="true"]{ background:var(--accent); }
.switch[aria-checked="true"]::after{ transform:translateX(20px); }
.switch[disabled]{ opacity:.4; }
.audit-row{ padding:12px 2px; border-bottom:1px solid var(--line); font-size:14px; }
.audit-row time{ display:block; font-size:12px; color:var(--ink-3); margin-bottom:2px; }
.color-in{ width:56px; height:46px; padding:2px; border:1px solid var(--line); border-radius:12px; background:var(--bg-2); }
.mode-pill{ font-size:11.5px; font-weight:700; color:#2A1E00; background:#F2C14E; padding:3px 8px; border-radius:999px; white-space:nowrap; }
.boot{ min-height:60vh; display:grid; place-items:center; color:var(--ink-3); }

.kv > div:last-child:nth-child(odd){ grid-column:1 / -1; }
@media (min-width:760px){ .kv > div:last-child:nth-child(odd){ grid-column:auto; } }

/* ===== Phase 2: seasons & entries ===== */
.cover-ph{ display:grid; place-items:center; background:radial-gradient(120% 140% at 85% 10%, rgba(182,240,60,.22), transparent 55%), linear-gradient(135deg, #18213D, #0E1427); color:#EEF2FB; position:relative; overflow:hidden; }
.cover-ph::after{ content:""; position:absolute; left:0; right:0; bottom:0; height:8px; background:repeating-linear-gradient(-45deg, #FF3B3F 0 10px, #fff 10px 20px); opacity:.9; }
.cover-ph span{ font-size:clamp(36px, 9vw, 64px); letter-spacing:-.01em; }
.cover-ph b{ color:var(--accent); margin-left:6px; font-weight:900; }
.season-hero .img.cover-ph{ min-height:180px; }
.reg-card{ padding:18px; }
.reg-card .head{ display:flex; align-items:center; justify-content:space-between; gap:10px; flex-wrap:wrap; }
.reg-card .count{ display:flex; align-items:baseline; gap:8px; margin:14px 0 8px; }
.reg-card .count b{ font-size:44px; line-height:.9; }
.reg-card .count span{ color:var(--ink-3); font-weight:600; }
.reg-card .times{ display:grid; grid-template-columns:auto 1fr; gap:4px 14px; font-size:14px; margin-top:12px; color:var(--ink-2); }
.reg-card .times b{ color:var(--ink); font-weight:650; }
.my-entry{ display:grid; gap:12px; padding:16px; border-radius:var(--r-lg); border:1px solid var(--accent-text); background:linear-gradient(135deg, var(--accent-soft), transparent 70%); }
.my-entry.wait{ border-color:var(--line-2); background:var(--bg-2); }
.my-entry .big{ font-size:46px; line-height:.85; }
.my-entry .top{ display:flex; align-items:center; gap:14px; }
.snap{ display:grid; grid-template-columns:repeat(2,1fr); gap:1px; background:var(--line); border:1px solid var(--line); border-radius:var(--r-md); overflow:hidden; }
.snap > div{ background:var(--bg-2); padding:10px 12px; }
.snap .label{ font-size:12px; }
.snap b{ display:block; font-size:15px; margin-top:2px; }
.entry-row{ display:flex; align-items:center; gap:12px; padding:10px 14px 10px 0; background:var(--bg-2); border:1px solid var(--line); border-radius:var(--r-md); width:100%; text-align:left; overflow:hidden; }
.entry-row .ep{ width:44px; align-self:stretch; display:grid; place-items:center; background:var(--bg-3); font-size:20px; font-family:'Archivo','Avenir Next Condensed','Roboto Condensed','Arial Narrow',var(--font); font-stretch:62%; font-style:italic; font-weight:900; color:var(--ink-2); margin:-10px 0; }
.entry-row .nm{ flex:1; min-width:0; }
.entry-row .nm b{ display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.entry-row .nm > span{ display:block; font-size:12.5px; color:var(--ink-3); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.entry-row.waitlist .ep{ color:var(--ink-3); background:repeating-linear-gradient(-45deg, var(--bg-3) 0 6px, var(--bg-2) 6px 12px); }
.entry-row .star{ color:var(--gold); margin-left:6px; }
.cut{ display:flex; align-items:center; gap:10px; font-size:12.5px; font-weight:700; color:var(--ink-2); margin:6px 0; }
.cut::before, .cut::after{ content:""; flex:1; height:2px; background:repeating-linear-gradient(90deg, #FF3B3F 0 8px, #fff 8px 16px); opacity:.85; border-radius:1px; }
.multi .chip[aria-pressed="true"]{ background:var(--ink); color:var(--bg); border-color:var(--ink); }
.round-edit{ display:grid; gap:10px; padding:14px; border:1px solid var(--line); border-radius:var(--r-lg); background:var(--bg-2); }
.round-edit .head{ display:flex; align-items:center; justify-content:space-between; gap:8px; }
.round-edit .head b{ font-size:22px; }
.inline{ display:flex; gap:10px; align-items:center; flex-wrap:wrap; }
.inline > *{ flex:1 1 140px; }
.pts-grid{ display:grid; grid-template-columns:repeat(4, 1fr); gap:6px; }
@media (min-width:600px){ .pts-grid{ grid-template-columns:repeat(8, 1fr); } }
.pts-grid label{ display:grid; gap:2px; font-size:11.5px; color:var(--ink-3); font-weight:650; }
.pts-grid input{ min-height:40px; padding:0 8px; font-size:15px; text-align:center; }
textarea.input{ min-height:90px; padding:12px 14px; resize:vertical; line-height:1.4; }
.summary dl{ display:block; margin:0; font-size:15px; }
.summary dt{ color:var(--ink-3); font-size:12.5px; font-weight:650; padding-top:12px; }
.summary dd{ margin:2px 0 0; font-weight:650; padding-bottom:12px; border-bottom:1px solid var(--line); white-space:pre-line; }
.summary dd:last-child{ border-bottom:0; padding-bottom:0; }
.summary dt:first-child{ padding-top:0; }
.strip{ display:flex; gap:10px; overflow-x:auto; scrollbar-width:none; margin:12px -16px 0; padding:0 16px 4px; }
.strip::-webkit-scrollbar{ display:none; }
.strip .round-item{ flex:0 0 auto; width:min(320px, 82vw); }

/* ===== Phase 3: race ===== */
.time-row{ display:grid; grid-template-columns:34px minmax(0,1fr) minmax(0,1.1fr) minmax(0,1fr); gap:8px; align-items:center; padding:6px 8px; background:var(--bg-2); border:1px solid var(--line); border-radius:var(--r-sm); }
.time-row.q{ grid-template-columns:34px minmax(0,1fr) minmax(0,1.2fr); }
.time-row .p{ font-size:20px; text-align:center; color:var(--ink-3); }
.time-row .nm{ white-space:nowrap; overflow:hidden; text-overflow:ellipsis; font-size:14px; }
.res-mini{ display:grid; gap:8px; }
.entry-bar.wrap{ flex-wrap:wrap; }
.entry-bar.wrap .prog{ flex:1 0 100%; font-weight:650; }
.entry-bar.wrap .btn{ flex:1 1 0; }
@media (min-width:700px){ .entry-bar.wrap .prog{ flex:1 1 auto; } .entry-bar.wrap .btn{ flex:0 0 auto; } }

/* Default icon size: zero specificity, so any component rule still wins. */
:where(svg[aria-hidden="true"]){ width:20px; height:20px; flex:0 0 auto; vertical-align:-4px; }
.row-card > svg{ color:var(--ink-3); }

/* ===== 0.5: rules page, notifications, GT7 data ===== */
.md{ line-height:1.6; font-size:15.5px; }
.md h2{ font-family:'Archivo','Avenir Next Condensed','Roboto Condensed','Arial Narrow',var(--font); font-stretch:66%; font-style:italic; font-weight:850; font-size:28px; margin:28px 0 8px; }
.md h3{ font-size:18px; margin:22px 0 6px; }
.md h4{ font-size:16px; margin:18px 0 4px; }
.md p{ margin:0 0 12px; color:var(--ink); }
.md ul, .md ol{ margin:0 0 12px; padding-left:22px; }
.md li{ margin:4px 0; }
.md blockquote{ margin:0 0 12px; padding:12px 14px; border-left:4px solid var(--accent); background:var(--accent-soft); border-radius:0 var(--r-sm) var(--r-sm) 0; }
.md > :first-child{ margin-top:0; }
.bell-btn{ position:relative; }
.notif-day{ font-size:12px; color:var(--ink-3); font-weight:650; margin:14px 0 2px; }
.car-pick{ position:relative; }
.car-sugg{ position:absolute; left:0; right:0; top:calc(100% + 4px); z-index:30; background:var(--bg-2); border:1px solid var(--line); border-radius:var(--r-md); box-shadow:0 12px 30px -10px rgba(0,0,0,.45); max-height:300px; overflow-y:auto; }
.car-sugg button{ display:flex; align-items:center; gap:10px; width:100%; padding:10px 12px; text-align:left; border-bottom:1px solid var(--line); font-size:14.5px; }
.car-sugg button:last-child{ border-bottom:0; }
.car-sugg button:hover, .car-sugg button:focus{ background:var(--bg-3); }
.car-sugg .cls{ margin-left:auto; font-size:11.5px; font-weight:800; padding:2px 7px; border-radius:6px; background:var(--bg-3); border:1px solid var(--line); color:var(--ink-2); white-space:nowrap; }
.sync-log{ font-size:13px; color:var(--ink-2); max-height:180px; overflow-y:auto; background:var(--bg-3); border:1px solid var(--line); border-radius:var(--r-sm); padding:8px 10px; white-space:pre-line; font-variant-numeric:tabular-nums; }

/* Keyboard open on a phone: give the form the whole screen. */
.kb-open .tabbar{ display:none; }
.kb-open main#view{ padding-bottom:40vh; }
.kb-open .entry-bar{ position:static; }

/* ===== 0.5.2: profile ===== */
.head-chips{ display:flex; gap:6px; flex-wrap:wrap; margin-top:10px; }
.head-chip{ display:inline-flex; align-items:center; gap:7px; font-size:12.5px; font-weight:700; padding:4px 10px; border-radius:999px; background:rgba(255,255,255,.08); color:var(--chrome-ink); }
.team-dot{ display:inline-block; width:10px; height:10px; border-radius:3px; flex:0 0 auto; }
.rating-grid{ display:grid; gap:12px; margin-top:16px; }
@media (min-width:760px){ .rating-grid{ grid-template-columns:1.35fr 1fr; align-items:start; } }
.gauge-card{ padding:14px 16px 12px; }
.gauge{ display:block; width:100%; max-width:420px; margin:4px auto 0; color:var(--ink); overflow:visible; }
.g-tick{ font-size:10px; font-weight:700; fill:var(--ink-3); font-family:var(--font); }
.g-cls{ font-size:13px; font-weight:900; font-style:italic; font-family:'Archivo','Avenir Next Condensed','Roboto Condensed','Arial Narrow',var(--font); }
.g-letter{ font-size:46px; font-weight:900; font-style:italic; fill:var(--ink); font-family:'Archivo','Avenir Next Condensed','Roboto Condensed','Arial Narrow',var(--font); font-stretch:66%; }
.g-pts{ font-size:20px; font-weight:800; fill:var(--ink-2); font-variant-numeric:tabular-nums; font-family:var(--font); }
.gauge-note{ text-align:center; margin:0; font-size:13.5px; color:var(--ink-2); font-weight:600; }
.sr-card{ padding:14px 16px; }
.sr-row{ display:flex; align-items:center; gap:16px; margin-top:6px; }
.sr-big{ font-size:56px; line-height:.9; }
.sr-scale{ display:flex; gap:4px; flex:1; }
.sr-scale span{ flex:1; text-align:center; padding:7px 0; border-radius:8px; font-weight:850; font-size:13px; background:var(--bg-3); border:1px solid var(--line); color:var(--ink-3); }
.sr-scale span.past{ color:var(--ink-2); }
.sr-scale span.on{ background:var(--accent); border-color:transparent; color:var(--accent-ink); }
.info-list{ margin-top:12px; padding:0 16px; }
.info-row{ display:flex; align-items:center; gap:12px; min-height:52px; border-bottom:1px solid var(--line); }
.info-row:last-child{ border-bottom:0; }
.info-row > svg{ width:20px; height:20px; color:var(--ink-3); flex:0 0 auto; }
.info-row .k{ color:var(--ink-2); font-size:14px; }
.info-row .v{ margin-left:auto; font-weight:700; display:flex; align-items:center; gap:8px; text-align:right; }

/* ===== 0.6: track photos and maps, photos ===== */
.round-item.trk{ position:relative; overflow:hidden; min-height:92px; isolation:isolate; padding-right:min(36%, 160px); }
.round-item.trk > *:not(.trk-photo):not(.trk-map){ position:relative; z-index:1; }
.trk-photo{ position:absolute; inset:0; z-index:0; background-size:cover; background-position:center; opacity:.72;
  -webkit-mask-image:linear-gradient(90deg, transparent 0%, rgba(0,0,0,.35) 35%, #000 75%); mask-image:linear-gradient(90deg, transparent 0%, rgba(0,0,0,.35) 35%, #000 75%); }
:root[data-theme="light"] .trk-photo{ opacity:.55; }
.trk::after{ content:""; position:absolute; inset:0; z-index:0; pointer-events:none; background:linear-gradient(90deg, transparent 50%, rgba(8,12,24,.35) 100%); }
.trk-map{ position:absolute; z-index:1; right:14px; top:50%; transform:translateY(-50%); height:70%; max-width:32%; object-fit:contain;
  filter:brightness(0) invert(1) drop-shadow(0 2px 6px rgba(0,0,0,.55)); opacity:.95; pointer-events:none; }
.round-item.trk .chev{ display:none; }
.trk-stats{ font-weight:650; }
.round-banner{ position:relative; overflow:hidden; border-radius:var(--r-lg); padding:18px 16px 14px; margin-bottom:12px; background:var(--bg-2); border:1px solid var(--line); isolation:isolate; }
.round-banner .rb-body{ position:relative; z-index:1; max-width:68%; }
.round-banner.trk .trk-map{ height:78%; max-width:30%; }
.round-banner .page-title{ margin-bottom:4px; }
.avatar{ position:relative; overflow:hidden; }
.avatar.has-photo img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.avatar-edit{ position:absolute; right:-4px; bottom:-4px; width:34px; height:34px; border-radius:50%; display:grid; place-items:center; background:var(--accent); color:var(--accent-ink); border:3px solid var(--chrome); }
.avatar-edit svg{ width:16px; height:16px; }
.logo-prev{ width:64px; height:64px; border-radius:14px; background:var(--bg-3) center/contain no-repeat; border:1px solid var(--line); }

/* ===== 0.6.1 ===== */
/* iPhone: date/time inputs ignore width:100% unless their native look is reset */
.input[type="date"], .input[type="datetime-local"], .input[type="time"]{ -webkit-appearance:none; appearance:none; display:block; min-width:0; max-width:100%; width:100%; text-align:left; line-height:48px; }
.input::-webkit-date-and-time-value{ text-align:left; }
.inline > *, .f-row, .form > *{ min-width:0; }
details.adv{ margin-top:16px; border:1px solid var(--line); border-radius:var(--r-lg); padding:0 14px; background:var(--bg-2); }
details.adv > summary{ list-style:none; cursor:pointer; display:flex; align-items:center; gap:10px; min-height:52px; font-weight:750; }
details.adv > summary::-webkit-details-marker{ display:none; }
details.adv > summary .chev{ margin-left:auto; transition:transform .25s; }
details.adv[open] > summary .chev{ transform:rotate(180deg); }
details.adv[open]{ padding-bottom:14px; }
details.adv > summary svg{ width:20px; height:20px; color:var(--ink-3); }
.dropzone{ display:grid; place-items:center; gap:8px; width:100%; min-height:150px; padding:18px; border:2px dashed var(--line-2); border-radius:var(--r-lg); background:var(--bg-2) center/cover no-repeat; color:var(--ink-2); text-align:center; cursor:pointer; position:relative; overflow:hidden; transition:border-color .15s, background-color .15s; }
.dropzone.drag{ border-color:var(--accent-text); background-color:var(--accent-soft); }
.dropzone.has-img{ min-height:180px; color:#fff; border-style:solid; border-color:transparent; }
.dropzone.has-img::before{ content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(0,0,0,.05), rgba(0,0,0,.55)); }
.dropzone > *{ position:relative; }
.dropzone svg{ width:28px; height:28px; }
.dropzone b{ font-size:15px; }
.dropzone small{ font-size:12.5px; opacity:.8; }
.cover-trk{ position:relative; background-size:cover; background-position:center; display:grid; place-items:center; }
.cover-trk::before{ content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(8,12,24,.25), rgba(8,12,24,.75)); }
.cover-trk .cover-no{ position:relative; color:#fff; font-size:clamp(34px, 8vw, 56px); text-shadow:0 2px 12px rgba(0,0,0,.5); }
.cover-trk .cover-no b{ color:var(--accent); margin-left:6px; }
.cover-trk .trk-map{ right:16px; height:62%; max-width:28%; }
.hero-map{ position:absolute; right:18px; top:56px; height:120px; max-width:34%; object-fit:contain; filter:brightness(0) invert(1) drop-shadow(0 2px 8px rgba(0,0,0,.5)); opacity:.85; pointer-events:none; z-index:1; }
@media (max-width:520px){ .hero-map{ height:84px; top:62px; } }
.track-sample{ position:relative; margin-top:10px; height:150px; border-radius:var(--r-md); background:var(--bg-3) center/cover no-repeat; overflow:hidden; display:flex; align-items:flex-end; padding:10px 12px; color:#fff; font-weight:700; text-shadow:0 1px 6px rgba(0,0,0,.6); }
.track-sample .trk-map{ height:70%; }

/* ===== 0.6.4: GT7 profile pictures ===== */
.avatar.has-photo img.gt7{ object-fit:cover; object-position:50% 0; transform:scale(1.9); transform-origin:50% 4%; }
.profile-head{ position:relative; overflow:hidden; isolation:isolate; }
.profile-head .head-cover{ position:absolute; inset:0; z-index:-1; background-size:cover; background-position:center; opacity:.42;
  -webkit-mask-image:linear-gradient(90deg, rgba(0,0,0,.2), #000 70%); mask-image:linear-gradient(90deg, rgba(0,0,0,.2), #000 70%); }
.script-box{ font-family:ui-monospace,Menlo,Consolas,monospace; font-size:12px; min-height:110px; }

/* ===== 0.7: teams, hall of fame, medals ===== */
.team-badge{ display:inline-block; vertical-align:middle; }
.medals{ display:grid; grid-template-columns:repeat(3, 1fr); gap:8px; }
.medal{ display:grid; justify-items:center; text-align:center; gap:2px; padding:12px 6px; border-radius:var(--r-md); background:var(--bg-3); border:1px solid var(--line); }
.medal.none{ opacity:.45; }
.medal .m-emoji{ font-size:22px; line-height:1; }
.medal b{ font-size:30px; line-height:1; }
.medal .k{ font-size:12px; color:var(--ink-3); font-weight:650; }
.medal .m-list{ font-size:11px; color:var(--ink-2); line-height:1.35; margin-top:4px; }
.hof{ display:grid; gap:12px; }
@media (min-width:900px){ .hof{ grid-template-columns:1fr 1fr; } }
.hof-card{ padding:14px 16px; }
.hof-card .hof-head{ display:flex; align-items:baseline; gap:10px; flex-wrap:wrap; margin-bottom:10px; }
.hof-card .hof-head .display{ font-size:26px; }
.hof-card .hof-head span{ color:var(--ink-3); font-size:13px; }
.hof-cols{ display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.hof-col .label{ margin-bottom:6px; }
.pod{ display:flex; align-items:center; gap:8px; min-height:30px; font-size:14px; }
.pod .e{ width:20px; text-align:center; }
.pod a, .pod span.n{ min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-weight:650; }
.pod a{ color:inherit; }
.pod small{ color:var(--ink-3); font-weight:500; }
.hof details{ margin-top:8px; }
.hof details summary{ cursor:pointer; font-size:13px; font-weight:700; color:var(--ink-2); }
.medal-table{ display:grid; gap:6px; }
.mt-row{ display:flex; align-items:center; gap:10px; padding:8px 12px; border-radius:var(--r-sm); background:var(--bg-2); border:1px solid var(--line); font-size:14px; }
.mt-row .nm{ flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-weight:650; color:inherit; }
.mt-row .cnt{ font-variant-numeric:tabular-nums; white-space:nowrap; font-weight:700; }
.team-hero{ position:relative; overflow:hidden; padding:20px 16px; border-radius:var(--r-lg); background:var(--chrome); color:var(--chrome-ink); display:flex; align-items:center; gap:16px; margin-bottom:14px; }
.team-hero::before{ content:""; position:absolute; inset:0; background:linear-gradient(120deg, var(--t1, transparent) 0%, transparent 60%); opacity:.35; }
.team-hero > *{ position:relative; }
.team-hero h1{ font-size:clamp(30px, 7vw, 46px); margin:0; line-height:.95; }
.team-hero .logo-big{ width:84px; height:84px; border-radius:18px; background:rgba(255,255,255,.08) center/contain no-repeat; flex:0 0 auto; display:grid; place-items:center; }
.team-card{ display:flex; gap:12px; align-items:center; padding:14px; color:inherit; }
.team-card .nm{ flex:1; min-width:0; }
.team-card .nm b{ display:block; font-size:16px; }
.team-card .nm span{ display:block; font-size:13px; color:var(--ink-3); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.team-card .cups{ font-size:13px; white-space:nowrap; }
.drv-card .team-line{ display:flex; align-items:center; gap:6px; font-size:12.5px; color:var(--ink-3); margin-top:2px; min-width:0; }
.drv-card .team-line span{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.head-chip .team-badge{ border-radius:4px; }

/* ===== 0.7.1: trophies, team grid, title cards ===== */
.tcount{ display:inline-flex; align-items:center; gap:4px; font-weight:800; font-variant-numeric:tabular-nums; margin-left:8px; vertical-align:-2px; }
.mt-row .cnt{ display:flex; gap:10px; }
.mt-row .cnt .tcount{ margin-left:0; }
.pod .e{ display:grid; place-items:center; }
.team-grid{ display:grid; grid-template-columns:repeat(auto-fill, minmax(min(100%, 300px), 1fr)); gap:10px; }
.team-grid .team-card{ height:100%; align-items:flex-start; }
.team-grid .team-card .nm b{ display:flex; align-items:center; flex-wrap:wrap; gap:2px; }
.team-grid .team-card .nm span{ white-space:normal; overflow:visible; line-height:1.4; }
.medal{ position:relative; overflow:hidden; justify-items:start; text-align:left; padding:14px 14px 12px; border:0; color:#1B1405; }
.medal.m0{ background:linear-gradient(135deg, #FFE9A6 0%, #F2C14E 45%, #C98F1E 100%); }
.medal.m1{ background:linear-gradient(135deg, #F4F7FC 0%, #C9D2E3 50%, #8D99AE 100%); color:#141a26; }
.medal.m2{ background:linear-gradient(135deg, #F6C9A0 0%, #D4884A 50%, #9A5525 100%); color:#1e1006; }
.medal.none{ opacity:.35; filter:saturate(.4); }
.medal .m-top{ display:flex; align-items:center; gap:8px; }
.medal .m-top .trophy{ color:rgba(0,0,0,.55) !important; }
.medal b{ font-size:44px; line-height:.9; color:inherit; }
.medal .k{ color:inherit; opacity:.8; font-size:12.5px; font-weight:750; margin-top:4px; }
.medal .m-list{ color:inherit; opacity:.85; font-size:11.5px; margin-top:6px; }
.medal::after{ content:""; position:absolute; inset:0; background:linear-gradient(120deg, transparent 30%, rgba(255,255,255,.35) 45%, transparent 60%); pointer-events:none; }
.status.champ{ display:inline-flex; align-items:center; gap:6px; background:rgba(242,193,78,.18); color:#F2C14E; }
.status.champ .tcount{ margin-left:0; }
.head-titles .tcount{ color:#F2C14E; margin-left:4px; font-size:15px; }

/* ===== 0.7.1: lobby settings ===== */
.round-edit .seg{ margin:2px 0 4px; }
.lobby-sec{ border:1px solid var(--line); border-radius:var(--r-md); background:var(--bg-2); padding:0 12px; }
.lobby-sec > summary{ list-style:none; cursor:pointer; display:flex; align-items:center; gap:8px; min-height:48px; font-weight:800; letter-spacing:.02em; text-transform:uppercase; font-size:14px; }
.lobby-sec > summary::-webkit-details-marker{ display:none; }
.lobby-sec > summary .chev{ margin-left:auto; transition:transform .25s; width:18px; height:18px; }
.lobby-sec[open] > summary .chev{ transform:rotate(180deg); }
.lobby-sec[open]{ padding-bottom:10px; }
.lobby-field{ display:grid; gap:4px; font-size:13px; font-weight:650; color:var(--ink-2); }
.lobby-list{ display:grid; gap:2px; padding:4px 0; }
.lobby-line{ font-family:ui-monospace,Menlo,Consolas,monospace; font-size:13.5px; padding:7px 10px; border-radius:8px; background:var(--bg-3); }
.practice-btn{ margin:0 0 14px; }
.lobby-field, .lobby-sec, .lobby-sec > div{ min-width:0; }
.lobby-field select{ min-width:0; max-width:100%; width:100%; text-overflow:ellipsis; }

/* ===== 0.8: lobby editor, tickers, diagnostics ===== */
select.select{ box-sizing:border-box; max-width:100%; }
.lobby-field select.select{ width:100%; min-height:44px; }
.ticker{ display:grid; gap:6px; }
.tick-row{ display:flex; align-items:center; gap:10px; }
.tick-row .icon-btn{ width:44px; height:44px; border:1px solid var(--line); border-radius:12px; background:var(--bg-3); }
.tick-val{ min-width:120px; text-align:center; font-size:16px; font-variant-numeric:tabular-nums; }
.ticker input[type=range]{ width:100%; accent-color:var(--accent); }
.lobby-chips{ display:flex; flex-wrap:wrap; gap:6px; }
.lobby-chips .chip{ min-height:36px; padding:0 10px; font-size:13px; }
.pq-chip{ display:grid; justify-items:end; font-variant-numeric:tabular-nums; font-weight:800; font-size:14px; margin-left:auto; }
.pq-chip small{ font-weight:600; color:var(--ink-3); font-size:11.5px; }
.diag-list{ display:grid; gap:4px; margin:6px 0 4px; }
.diag-row{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.2fr); gap:2px 10px; padding:8px 10px; border-radius:10px; background:var(--bg-3); color:inherit; font-size:13.5px; }
.diag-row small{ grid-column:1 / -1; color:var(--ink-3); }
.diag-row:empty{ display:none; }

/* ===== 0.9: MCSM Rating, news, install ===== */
.mr-box{ padding:14px 16px; margin-top:12px; }
.linkish{ background:none; border:0; color:var(--accent-text); font-weight:700; font-size:13px; display:inline-flex; gap:6px; align-items:center; cursor:pointer; padding:4px 0; }
.linkish svg{ width:16px; height:16px; }
.mr-main{ display:flex; align-items:flex-end; gap:12px; flex-wrap:wrap; }
.mr-num{ font-size:60px; line-height:.85; }
.mr-delta{ font-weight:800; font-size:15px; padding:4px 10px; border-radius:999px; background:var(--bg-3); margin-bottom:6px; }
.mr-delta.up{ color:var(--green, #22C55E); } .mr-delta.down{ color:var(--red); }
.mr-spark{ flex:1; min-width:120px; height:46px; color:var(--accent-text); }
.mr-subs{ display:grid; gap:8px; margin:14px 0 12px; }
.mr-sub{ display:grid; grid-template-columns:110px 1fr 48px; align-items:center; gap:10px; font-size:13.5px; }
.mr-sub b{ text-align:right; font-variant-numeric:tabular-nums; }
.mr-bar{ height:8px; border-radius:6px; background:var(--bg-3); overflow:hidden; }
.mr-bar i{ display:block; height:100%; border-radius:6px; background:linear-gradient(90deg, var(--accent), #38BDF8); }
.mr-facts{ display:grid; grid-template-columns:repeat(4, 1fr); gap:8px; }
.mr-facts > div{ background:var(--bg-3); border-radius:12px; padding:10px; display:grid; gap:2px; }
.mr-facts b{ font-size:18px; font-variant-numeric:tabular-nums; }
.mr-facts span{ font-size:11.5px; color:var(--ink-3); font-weight:650; }
@media (max-width:520px){ .mr-facts{ grid-template-columns:repeat(2, 1fr); } .mr-sub{ grid-template-columns:90px 1fr 44px; } }
.mr-prov b.display{ font-size:30px; display:block; }
.mr-prov > span{ color:var(--ink-2); font-weight:650; }
.mr-progress{ display:grid; grid-template-columns:repeat(5, 1fr); gap:6px; margin-top:10px; }
.mr-progress i{ height:10px; border-radius:6px; background:var(--bg-3); }
.mr-progress i.on{ background:var(--accent); }
.mr-chip{ margin-left:8px; font-weight:850; font-size:12px; padding:2px 7px; vertical-align:1px; border-radius:8px; background:var(--accent-soft); color:var(--accent-text); font-variant-numeric:tabular-nums; }
.mr-explain h3{ margin:16px 0 4px; }
.mr-formula{ font-family:ui-monospace,Menlo,Consolas,monospace; font-size:13px; padding:10px 12px; border-radius:10px; background:var(--bg-3); margin:8px 0; }
.mr-row .choice{ flex-wrap:nowrap; }
.mr-row .choice .chip{ min-width:42px; padding:0 8px; }
.news-dot{ position:absolute; top:7px; right:7px; width:9px; height:9px; border-radius:50%; background:var(--accent); box-shadow:0 0 0 2px var(--chrome); }
.news-art .news-img{ height:180px; border-radius:var(--r-md); background:var(--bg-3) center/cover no-repeat; margin-bottom:12px; }
.news-meta{ font-size:12.5px; color:var(--ink-3); font-weight:650; }
.news-title{ font-size:26px; margin:2px 0 8px; }
.news-body{ font-size:15px; line-height:1.55; }
.news-body a{ color:var(--accent-text); }
.news-row .news-thumb{ width:52px; height:52px; border-radius:12px; background:var(--bg-3) center/cover no-repeat; display:grid; place-items:center; flex:0 0 auto; }
.md-tools{ display:flex; flex-wrap:wrap; gap:6px; margin-bottom:6px; }
.nc-overlay{ position:fixed; inset:0; z-index:200; background:rgba(5,8,18,.72); display:grid; place-items:center; padding:16px; animation:ncIn .22s ease; }
.nc-overlay.out{ opacity:0; transition:opacity .2s; }
@keyframes ncIn{ from{ opacity:0; } }
.nc-card{ width:min(560px, 100%); max-height:min(86vh, 760px); display:flex; flex-direction:column; background:var(--bg-2); border:1px solid var(--line); border-radius:var(--r-lg); overflow:hidden; box-shadow:0 30px 80px rgba(0,0,0,.5); }
.nc-head{ display:flex; align-items:center; justify-content:space-between; padding:12px 14px 6px; }
.nc-head b{ font-size:22px; }
.nc-track{ display:flex; overflow-x:auto; scroll-snap-type:x mandatory; scrollbar-width:none; flex:1; min-height:0; }
.nc-track::-webkit-scrollbar{ display:none; }
.nc-slide{ flex:0 0 100%; scroll-snap-align:start; overflow-y:auto; padding:6px 16px 10px; }
.nc-foot{ display:flex; align-items:center; justify-content:center; gap:10px; padding:6px; }
.nc-dots{ display:flex; gap:6px; }
.nc-dots i{ width:8px; height:8px; border-radius:50%; background:var(--line-2); }
.nc-dots i.on{ background:var(--accent); width:20px; border-radius:6px; }
.nc-bottom{ display:flex; align-items:center; justify-content:space-between; gap:10px; padding:10px 14px 14px; border-top:1px solid var(--line); }
.nc-never{ display:flex; align-items:center; gap:8px; font-size:14px; font-weight:600; color:var(--ink-2); }
.nc-never input{ width:20px; height:20px; accent-color:var(--accent); }
.install-item small{ display:block; font-size:12px; color:var(--ink-3); font-weight:500; }
/* phones: filter chips scroll sideways; rating tier rows wrap */
.toolbar .chips{ overflow-x:auto; flex-wrap:nowrap; scrollbar-width:none; max-width:100%; }
.toolbar .chips::-webkit-scrollbar{ display:none; }
.toolbar .chips .chip{ flex:0 0 auto; }
.mr-row{ flex-wrap:wrap; }
.mr-row .nm{ min-width:140px; }
.mr-row .choice{ max-width:100%; overflow-x:auto; }
.drv-card{ min-width:0; max-width:100%; }
.drv-card .nm{ min-width:0; }
.drv-card .nm b{ white-space:normal; overflow-wrap:anywhere; }
.news-btn{ position:relative; }

/* ===== 0.9.1: MCSM Rating card ===== */
.mr-card{ padding:14px 16px 12px; container-type:inline-size; --mr-track:rgba(255,255,255,.11); background:radial-gradient(120% 90% at 10% 0%, rgba(182,240,60,.07), transparent 55%), var(--bg-2); }
:root[data-theme="light"] .mr-card{ --mr-track:rgba(14,20,39,.13); }
@media (prefers-color-scheme: light){ :root:not([data-theme="dark"]) .mr-card{ --mr-track:rgba(14,20,39,.13); } }
.mr-head{ display:flex; align-items:center; gap:10px; margin-bottom:6px; }
.mr-head .label{ font-size:13px; }
.mr-demo{ font-size:10.5px; font-weight:850; letter-spacing:.08em; padding:2px 7px; border-radius:6px; background:rgba(242,193,78,.18); color:#F2C14E; }
.mr-help{ margin-left:auto; width:26px; height:26px; border-radius:50%; border:0; background:var(--bg-3); color:var(--ink-2); font-weight:900; font-size:14px; cursor:pointer; display:grid; place-items:center; }
.mr-help:hover{ background:var(--accent); color:var(--accent-ink); }
.mr-body{ display:grid; gap:14px; }
@container (min-width:400px){ .mr-body{ grid-template-columns:minmax(0, 1.05fr) minmax(0, 1fr); align-items:center; } .mr-parts{ border-left:1px solid var(--line); padding-left:14px; } }
.mr-mainwrap{ position:relative; width:min(220px, 100%); margin:6px auto 0; aspect-ratio:1 / 1; }
.mr-mainwrap .mr-dial{ width:100%; height:auto; display:block; }
.mr-avg{ position:absolute; transform:translate(-80%, -60%); font-size:11px; font-weight:800; color:var(--ink); font-variant-numeric:tabular-nums; }
.mr-center{ position:absolute; inset:0; display:grid; place-content:center; justify-items:center; gap:4px; padding-bottom:16%; }
.mr-big{ font-size:clamp(34px, 10.5cqi, 46px); line-height:.9; color:var(--accent-text); letter-spacing:-.01em; }
.mr-unranked{ font-size:24px; color:var(--ink-2); letter-spacing:.02em; }
.mr-delta{ font-size:12.5px; font-weight:850; padding:2px 8px; border-radius:999px; background:var(--bg-3); }
.mr-delta.up{ color:#22C55E; } .mr-delta.down{ color:var(--red); }
.mr-status{ position:absolute; left:0; right:0; bottom:4%; text-align:center; font-size:12px; font-weight:850; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-3); }
.mr-status.up{ color:var(--accent-text); } .mr-status.down{ color:var(--red); }
.mr-parts{ display:grid; grid-template-columns:1fr; gap:8px; }

.mr-part{ display:flex; align-items:center; gap:10px; min-width:0; }
.mr-ring{ position:relative; width:52px; height:52px; flex:0 0 auto; }
.mr-ring .mr-dial{ width:100%; height:100%; }
.mr-ring b{ position:absolute; inset:0; display:grid; place-items:center; font-size:12.5px; font-weight:850; font-variant-numeric:tabular-nums; padding-top:2px; }
.mr-ptext{ display:grid; min-width:0; }
.mr-pname{ font-size:12px; font-weight:850; letter-spacing:.06em; text-transform:uppercase; }
.mr-pstat{ font-size:11.5px; font-weight:750; color:var(--ink-3); text-transform:uppercase; letter-spacing:.04em; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.mr-pstat.up{ color:var(--accent-text); } .mr-pstat.down{ color:var(--red); }
.mr-facts2{ display:flex; flex-wrap:wrap; gap:6px 16px; margin-top:12px; padding-top:10px; border-top:1px solid var(--line); font-size:12.5px; color:var(--ink-3); font-weight:650; }
.mr-facts2 b{ color:var(--ink); margin-left:6px; font-variant-numeric:tabular-nums; }

.drv-card .team-line{ gap:8px; }
.nc-track{ overscroll-behavior-x:contain; touch-action:pan-x pan-y; }
.nc-overlay{ overflow:hidden; overscroll-behavior:contain; touch-action:none; }
.nc-card{ touch-action:pan-x pan-y; }

/* ===== 0.9.3: read results from screenshots ===== */
.ai-panel > summary{ list-style:none; cursor:pointer; display:flex; align-items:center; gap:10px; padding:14px 16px; font-weight:800; }
.ai-panel > summary::-webkit-details-marker{ display:none; }
.ai-panel > summary svg{ width:20px; height:20px; color:var(--accent-text); }
.ai-zone{ min-height:110px; }
.ai-thumbs{ display:flex; gap:8px; flex-wrap:wrap; }
.ai-thumb{ position:relative; width:120px; height:68px; border-radius:10px; background:var(--bg-3) center/cover no-repeat; border:1px solid var(--line); }
.ai-thumb span{ position:absolute; left:6px; top:6px; font-weight:900; font-size:12px; background:rgba(0,0,0,.6); color:#fff; border-radius:6px; padding:1px 6px; }
.ai-thumb .icon-btn{ position:absolute; right:2px; top:2px; width:28px; height:28px; background:rgba(0,0,0,.55); color:#fff; border-radius:8px; }
.ai-rows{ display:grid; gap:6px; margin-top:8px; }
.ai-row{ display:grid; grid-template-columns:34px minmax(0,1fr) minmax(0,1.1fr); gap:10px; align-items:center; padding:8px 10px; border-radius:12px; background:var(--bg-3); border:1px solid transparent; }
.ai-row.check{ border-color:#F2C14E; background:rgba(242,193,78,.08); }
.ai-row.bad{ border-color:var(--red); background:rgba(239,68,68,.08); }
.ai-pos{ font-size:20px; text-align:center; }
.ai-read{ display:grid; min-width:0; }
.ai-name{ font-weight:750; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ai-read small{ color:var(--ink-3); font-variant-numeric:tabular-nums; }
.ai-warn{ color:#F2C14E !important; }
.ai-row select.select{ width:100%; min-height:40px; }
@media (max-width:560px){ .ai-row{ grid-template-columns:30px minmax(0,1fr); } .ai-row select.select{ grid-column:1 / -1; } }
.dropzone{ box-sizing:border-box; max-width:100%; }

/* PSN ID beside names in rankings and result entry (under the name on phones) */
.psn-tag{ margin-left:8px; font-size:.78em; font-weight:550; color:var(--ink-3); letter-spacing:.01em; white-space:nowrap; }
@media (max-width:560px){ .rtable .psn-tag, .order .psn-tag, .time-row .psn-tag{ display:block; margin-left:0; line-height:1.2; } }

.mh-chart{ width:100%; height:auto; display:block; }
.mh-tick{ font-size:10.5px; fill:var(--ink-3); font-weight:650; }
.mh-grid{ stroke:var(--line); stroke-width:1; }
.mh-legend{ display:flex; flex-wrap:wrap; gap:6px 14px; font-size:12px; font-weight:700; color:var(--ink-2); margin:6px 0 12px; }
.mh-legend i{ display:inline-block; width:14px; height:3px; border-radius:2px; margin-right:6px; vertical-align:middle; }
.mh-table{ display:grid; gap:4px; }
.mh-table > div{ display:grid; grid-template-columns:1fr auto 60px; gap:10px; padding:8px 10px; border-radius:10px; background:var(--bg-3); font-size:13.5px; }
.mh-table b{ font-variant-numeric:tabular-nums; }
.mh-table small{ text-align:right; font-weight:800; font-variant-numeric:tabular-nums; }
.mh-table small.up{ color:#22C55E; } .mh-table small.down{ color:var(--red); }

/* ===== 0.9.5 ===== */
.app-version{ text-align:center; color:var(--ink-3); font-size:12px; font-weight:700; letter-spacing:.06em; margin:16px 0 4px; }
.danger-zone{ margin-top:26px; padding:14px; border:1px solid rgba(239,68,68,.35); border-radius:var(--r-md); background:rgba(239,68,68,.05); }
.podiums{ margin-bottom:18px; }
.pd-grid{ display:grid; gap:12px; }
@media (min-width:900px){ .pd-grid{ grid-template-columns:repeat(auto-fit, minmax(300px, 1fr)); } }
.pd-card{ padding:14px 14px 0; overflow:hidden; }
.pd-head{ display:flex; align-items:center; gap:10px; margin-bottom:10px; }
.pd-head b{ font-size:20px; }
.pd-row{ display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:8px; align-items:end; }
.pd-step{ display:flex; flex-direction:column; align-items:center; color:inherit; min-width:0; }
.pd-who{ display:grid; justify-items:center; text-align:center; gap:3px; padding:0 2px 8px; min-width:0; }
.pd-who > b{ font-size:13.5px; line-height:1.2; overflow-wrap:anywhere; }
.pd-sub{ font-size:11.5px; color:var(--ink-3); font-weight:650; overflow-wrap:anywhere; }
.pd-team{ display:inline-flex; align-items:center; gap:6px; font-size:11.5px; font-weight:700; color:var(--ink-2); }
.pd-bar{ width:100%; display:grid; justify-items:center; align-content:start; gap:2px; padding-top:10px; border-radius:12px 12px 0 0; color:#1B1405; }
.pd-bar b{ font-size:30px; line-height:1; }
.pd-bar span{ font-size:11.5px; font-weight:800; opacity:.8; }
.pd-bar .trophy{ color:rgba(0,0,0,.5) !important; }
.p1 .pd-bar{ height:130px; background:linear-gradient(180deg, #FFE9A6, #F2C14E 55%, #C98F1E); }
.p2 .pd-bar{ height:100px; background:linear-gradient(180deg, #F4F7FC, #C9D2E3 55%, #8D99AE); }
.p3 .pd-bar{ height:78px; background:linear-gradient(180deg, #F6C9A0, #D4884A 55%, #9A5525); color:#1e1006; }
.cmp-head{ display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:10px; margin-bottom:14px; }
.cmp-who{ display:grid; justify-items:center; text-align:center; gap:4px; color:inherit; min-width:0; }
.cmp-who > b{ font-size:16px; overflow-wrap:anywhere; }
.cmp-who > span{ font-size:12.5px; color:var(--ink-3); font-weight:650; overflow-wrap:anywhere; }
.cmp-vs{ font-size:26px; color:var(--accent-text); }
.cmp-table{ padding:4px 12px; }
.cmp-row{ display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:10px; min-height:46px; border-bottom:1px solid var(--line); }
.cmp-row:last-child{ border-bottom:0; }
.cmp-k{ font-size:12px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-3); text-align:center; }
.cmp-v{ font-size:17px; font-weight:800; font-variant-numeric:tabular-nums; text-align:center; padding:4px 0; border-radius:8px; }
.cmp-v.win{ color:var(--accent-text); background:var(--accent-soft); }

/* GP grid: staggered two columns like a real grid, photo + name + number + PSN ID */
.grid-sheet{ display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:10px 14px; }
.grid-slot{ min-width:0; gap:10px; padding:10px 12px; border-left:4px solid var(--line-2); }
.grid-slot.right{ margin-top:34px; }
.grid-slot:nth-child(even){ margin-top:34px; }
.grid-slot .avatar{ flex:0 0 auto; }
.gs-nm{ display:grid; min-width:0; }
.gs-nm b{ font-size:14px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.gs-first{ font-weight:500; color:var(--ink-2); }
.gs-nm > span{ font-size:12px; color:var(--ink-3); font-weight:650; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
@media (max-width:560px){ .grid-slot{ padding:8px; gap:8px; } .grid-slot .gp{ font-size:18px; width:22px; } .gs-first{ display:none; } .gs-nm .psn-tag{ display:block; margin-left:0; } }
.grid-sheet{ align-items:start; }

/* ===== 0.9.6 ===== */
.top-row{ display:flex; align-items:center; justify-content:space-between; gap:10px; }
.top-row > .back, .top-row > a{ margin-bottom:0; }
.top-row{ margin-bottom:14px; }
.sort-fig{ margin-left:auto; display:grid; justify-items:end; gap:0; padding-left:8px; flex:0 0 auto; }
.sort-fig b{ font-size:17px; font-weight:850; font-variant-numeric:tabular-nums; line-height:1.1; }
.sort-fig small{ font-size:10.5px; font-weight:800; letter-spacing:.08em; color:var(--ink-3); }
.sort-fig.dim small{ letter-spacing:.02em; }
.sort-fig .tcount{ margin-left:0; font-size:17px; color:#F2C14E; }
@media (max-width:560px){
  .medals{ grid-template-columns:1fr; }
  .medal{ grid-template-columns:auto 1fr; justify-items:start; align-items:center; column-gap:14px; row-gap:2px; }
  .medal .m-top{ grid-row:1 / span 2; }
  .medal .k{ margin-top:0; align-self:end; }
  .medal .m-list{ margin-top:0; align-self:start; }
}

/* MCSM Rating card 0.9.6: big centred dial, standing under it, three parts in a row */
.mr-body{ display:block; }
.mr-card .mr-body{ grid-template-columns:none !important; }
.mr-mainwrap{ width:min(250px, 78%); margin:4px auto 0; aspect-ratio:1 / 1; }
.mr-center{ padding-bottom:0; }
.mr-big{ font-size:clamp(46px, 15cqi, 64px); }
.mr-status{ position:static; margin:-14% 0 14px; text-align:center; font-size:13px; }
.mr-parts{ display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:8px; border-left:0 !important; padding-left:0 !important; border-top:1px solid var(--line); padding-top:12px; }
.mr-part{ display:grid; justify-items:center; text-align:center; gap:4px; }
.mr-ring{ width:60px; height:60px; }
.mr-ring b{ font-size:13.5px; }
.mr-pname{ font-size:11.5px; }
.mr-pstat{ font-size:11px; white-space:normal; }

/* compare 0.9.6: equal columns, no boxes, accent text for the better value */
.cmp-head{ grid-template-columns:minmax(0, 1fr) 48px minmax(0, 1fr); align-items:start; }
.cmp-table{ padding:4px 14px 6px; margin-bottom:12px; }
.cmp-sec{ font-size:11.5px; font-weight:850; letter-spacing:.1em; text-transform:uppercase; color:var(--ink-3); padding:10px 0 4px; text-align:center; }
.cmp-row{ grid-template-columns:minmax(0, 1fr) minmax(96px, 128px) minmax(0, 1fr); min-height:50px; }
.cmp-v{ display:grid; justify-items:center; gap:0; padding:4px 0; background:none !important; }
.cmp-v b{ font-size:17px; font-weight:800; font-variant-numeric:tabular-nums; }
.cmp-v.win b{ color:var(--accent-text); }
.cmp-v.dim b, .cmp-v.dim{ color:var(--ink-3); font-size:13px; font-weight:700; }
.cmp-v.big b{ font-size:30px; font-family:'Archivo','Avenir Next Condensed','Roboto Condensed','Arial Narrow',var(--font); font-style:italic; font-weight:900; font-stretch:66%; }
.cmp-gap{ font-size:11.5px; font-weight:800; color:var(--red); font-variant-numeric:tabular-nums; }
.cmp-tk{ display:inline-flex; align-items:center; gap:6px; }
.cmp-row.big{ min-height:72px; }

/* rules: the published Google Doc */
.rules-paper{ background:#fff; border-radius:var(--r-lg); overflow:hidden; border:1px solid var(--line); }
.rules-frame{ display:block; width:100%; height:78vh; min-height:520px; border:0; background:#fff; }
/* live streams */
.live-box{ margin-bottom:18px; }
.live-title{ font-size:24px; margin:0; display:flex; align-items:center; gap:10px; }
.live-dot{ width:10px; height:10px; border-radius:50%; background:#EF4444; box-shadow:0 0 0 0 rgba(239,68,68,.6); animation:livePulse 1.6s infinite; }
@keyframes livePulse{ 0%{ box-shadow:0 0 0 0 rgba(239,68,68,.6); } 70%{ box-shadow:0 0 0 10px rgba(239,68,68,0); } 100%{ box-shadow:0 0 0 0 rgba(239,68,68,0); } }
.live-track{ display:flex; gap:10px; overflow-x:auto; scroll-snap-type:x mandatory; scrollbar-width:none; padding-bottom:2px; overscroll-behavior-x:contain; }
.live-track::-webkit-scrollbar{ display:none; }
.live-card{ flex:0 0 min(260px, 72%); scroll-snap-align:start; color:inherit; border-radius:var(--r-md); background:var(--bg-2); border:1px solid var(--line); overflow:hidden; }
.live-thumb{ position:relative; aspect-ratio:16 / 9; background:var(--bg-3) center/cover no-repeat; }
.live-badge{ position:absolute; left:8px; top:8px; background:#EF4444; color:#fff; font-size:11px; font-weight:900; letter-spacing:.06em; padding:2px 7px; border-radius:6px; }
.live-viewers{ position:absolute; right:8px; top:8px; display:inline-flex; align-items:center; gap:4px; background:rgba(0,0,0,.65); color:#fff; font-size:11.5px; font-weight:800; padding:2px 7px; border-radius:6px; }
.live-viewers svg{ width:13px; height:13px; }
.live-who{ display:flex; align-items:center; gap:10px; padding:10px 12px; }
.live-nm{ display:grid; min-width:0; }
.live-nm b{ font-size:14px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.live-nm small{ font-size:12px; color:var(--ink-3); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

/* ===== 0.9.7 ===== */
:root{ --star:#F2C14E; --star-empty:rgba(255,255,255,.12); }
:root[data-theme="light"]{ --star-empty:rgba(14,20,39,.12); }
.stars{ display:inline-flex; gap:3px; align-items:center; }
.stars .star{ width:16px; height:15px; }
.stars-lg .star{ width:26px; height:25px; }
.stars-sm .star{ width:13px; height:12px; }
.mr-status .stars{ justify-content:center; }
.notif-top{ position:sticky; top:-1px; z-index:2; background:var(--bg-2); padding:0 0 10px; margin-bottom:6px; }
.wx-seq{ list-style:none; margin:0; padding:0; display:grid; gap:4px; }
.wx-seq li{ display:grid; grid-template-columns:22px 42px minmax(0, 1fr) repeat(3, 34px); align-items:center; gap:6px; padding:4px 6px; border-radius:10px; background:var(--bg-3); font-size:13px; }
.wx-seq li b{ text-align:center; color:var(--ink-3); }
.wx-code{ font-weight:850; }
.wx-name{ color:var(--ink-2); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.wx-seq .icon-btn{ width:32px; height:32px; }
.wx-seq .icon-btn[disabled]{ opacity:.3; }
.wx-seq .wx-empty{ display:block; color:var(--ink-3); background:none; padding:4px 0; }
/* round header: status right after the title */
.round-head-row{ display:flex; align-items:center; gap:12px; flex-wrap:wrap; }
/* long dropdowns stay inside their cards */
.round-edit select.select, .round-edit .f-row, .round-edit .inline > *{ min-width:0; max-width:100%; }
.round-edit .inline{ flex-wrap:wrap; }
details.adv select.select, .panel select.select{ max-width:100%; min-width:0; }
.protest-btn{ background:#E5484D; color:#fff; border-color:transparent; }
.protest-btn:hover{ background:#d93b40; }
.vote-sum{ display:grid; gap:2px; font-size:13.5px; padding-top:4px; border-top:1px solid var(--line); }
.vote-sum .label{ margin-bottom:2px; }
details.adv .round-item, .stack > .round-item{ box-sizing:border-box; max-width:100%; min-width:0; }

/* 0.9.8 */
.stars-lg .star{ width:19px; height:18px; }
.mr-status{ margin:-4% 0 14px; }