#rds-r1 {
  --bg: #120c04;
  --bg-2: #1a130a;
  --bg-3: #221a0f;
  --gold: #c8a227;
  --gold-soft: #d4b347;
  --gold-dim: rgba(200,162,39,.35);
  --text: #f5efe2;
  --text-dim: #a89880;
  --border: rgba(200,162,39,.18);
  --live: #e74c3c;
  font-family: 'Gilroy', -apple-system, BlinkMacSystemFont, 'Helvetica Neue', sans-serif;
  color: var(--text);
  background: var(--bg);
  padding: 120px 0 80px;
  margin: 0;
  scroll-behavior: smooth;
  /* No contain/transform/filter here – those create a containing block for
     position:fixed and break the sticky-tabs JS fallback. */
}
#rds-r1 * { box-sizing: border-box; }
#rds-r1 .rds-wrap { max-width: 1240px; margin: 0 auto; padding: 0 24px; }

/* Back */
#rds-r1 .rds-back {
  display: inline-flex; align-items: center; gap: 8px;
  font-size: 12px; letter-spacing: .14em; text-transform: uppercase; font-weight: 600;
  color: var(--text-dim); text-decoration: none;
  padding: 8px 14px; border: 1px solid var(--border); border-radius: 6px;
  margin-bottom: 28px;
  transition: color .15s, border-color .15s;
}
#rds-r1 .rds-back:hover { color: var(--gold); border-color: var(--gold-dim); }

/* Hero */
#rds-r1 .rds-hero {
  position: relative;
  margin: 0 0 32px;
  padding: 0 0 32px;
  border-bottom: 1px solid var(--border);
}
#rds-r1 .rds-hero-brand {
  font-size: 12px; font-weight: 700; letter-spacing: .28em;
  color: var(--gold); text-transform: uppercase;
  margin-bottom: 12px;
}
#rds-r1 .rds-hero-round {
  display: inline-flex; align-items: center; gap: 10px;
  font-size: 11px; letter-spacing: .22em; text-transform: uppercase;
  color: var(--text-dim); font-weight: 700; margin-bottom: 14px;
}
#rds-r1 .rds-live-badge {
  display: inline-flex; align-items: center; gap: 6px;
  background: var(--live); color: #fff;
  padding: 4px 10px; border-radius: 4px;
  font-size: 10px; letter-spacing: .14em; font-weight: 700;
}
#rds-r1 .rds-live-badge.rds-done { background: var(--gold); color: #120c04; }
#rds-r1 .rds-live-dot {
  width: 6px; height: 6px; border-radius: 50%; background: #fff;
  animation: rds-pulse 1.4s ease-in-out infinite;
}
@keyframes rds-pulse { 0%,100% { opacity: 1; } 50% { opacity: .4; } }
#rds-r1 .rds-hero-title-cn {
  font-size: 56px; font-weight: 800; color: var(--text); line-height: 1.05;
  letter-spacing: .02em; margin-bottom: 8px;
}
#rds-r1 .rds-hero-title-en {
  font-size: 15px; letter-spacing: .3em; text-transform: uppercase;
  color: var(--text-dim); font-weight: 600; margin-bottom: 28px;
}
#rds-r1 .rds-hero-meta {
  display: grid;
  grid-template-columns: repeat(3, auto);
  gap: 12px 48px;
  font-size: 13px;
  justify-content: start;
}
#rds-r1 .rds-hero-meta .item .label {
  font-size: 10px; letter-spacing: .18em; text-transform: uppercase;
  color: var(--gold); font-weight: 700; margin-bottom: 4px;
}
#rds-r1 .rds-hero-meta .item .val { color: var(--text); font-size: 14px; }
/* ---- Live broadcast buttons (top-right of hero) ---- */
#rds-r1 .rds-live-links { position: absolute; top: 0; right: 0; display: flex; gap: 10px; z-index: 3; }
#rds-r1 .rds-live-btn {
  display: inline-flex; align-items: center; gap: 11px;
  padding: 9px 16px 9px 9px; border-radius: 13px;
  text-decoration: none; color: var(--text);
  background: linear-gradient(150deg, rgba(42,31,12,.95), rgba(20,15,7,.95));
  border: 1px solid var(--gold-dim);
  box-shadow: 0 6px 20px -10px rgba(0,0,0,.7), inset 0 1px 0 rgba(255,255,255,.05);
  position: relative; overflow: hidden;
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}
#rds-r1 .rds-live-btn:hover { transform: translateY(-2px); border-color: var(--gold); box-shadow: 0 12px 28px -10px rgba(200,162,39,.5), inset 0 1px 0 rgba(255,255,255,.07); }
#rds-r1 .rds-live-btn::after { content: ''; position: absolute; top: 0; left: -70%; width: 45%; height: 100%; background: linear-gradient(100deg, transparent, rgba(255,255,255,.16), transparent); transform: skewX(-18deg); pointer-events: none; transition: left .55s ease; }
#rds-r1 .rds-live-btn:hover::after { left: 130%; }
#rds-r1 .rds-live-ico { flex: 0 0 auto; width: 36px; height: 36px; border-radius: 10px; display: flex; align-items: center; justify-content: center; background: rgba(0,0,0,.4); box-shadow: inset 0 0 0 1px rgba(255,255,255,.06); }
#rds-r1 .rds-live-ico svg { display: block; width: 23px; height: auto; }
#rds-r1 .rds-live-dy svg { width: 21px; }
#rds-r1 .rds-live-txt { display: flex; flex-direction: column; line-height: 1.08; }
#rds-r1 .rds-live-lang { font-size: 15px; font-weight: 800; letter-spacing: .01em; color: var(--text); }
#rds-r1 .rds-live-sub { display: flex; align-items: center; gap: 5px; margin-top: 3px; font-size: 10px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--gold-soft); }
#rds-r1 .rds-live-pip { width: 7px; height: 7px; border-radius: 50%; background: #ff3b30; flex: 0 0 auto; box-shadow: 0 0 0 0 rgba(255,59,48,.6); animation: rdsLivePulse 1.5s infinite; }
@keyframes rdsLivePulse { 0% { box-shadow: 0 0 0 0 rgba(255,59,48,.55); } 70% { box-shadow: 0 0 0 7px rgba(255,59,48,0); } 100% { box-shadow: 0 0 0 0 rgba(255,59,48,0); } }
@media (prefers-reduced-motion: reduce) { #rds-r1 .rds-live-pip { animation: none; } }

/* Tabs */
#rds-r1 .rds-tabs {
  position: sticky; top: 98px; z-index: 10;
  background: rgba(18,12,4,.92);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
  margin: 32px -24px 40px;
  padding: 0 24px;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
#rds-r1 .rds-tabs-inner {
  display: flex; gap: 4px;
  min-width: max-content;
}
#rds-r1 .rds-tab {
  display: flex; flex-direction: column; gap: 2px;
  padding: 14px 18px;
  color: var(--text-dim);
  text-decoration: none;
  border-bottom: 2px solid transparent;
  white-space: nowrap;
  transition: color .15s, border-color .15s, background .15s;
}
#rds-r1 .rds-tab:hover { color: var(--text); background: rgba(200,162,39,.04); }
#rds-r1 .rds-tab.active { color: var(--gold); border-bottom-color: var(--gold); }
#rds-r1 .rds-tab .cn { font-size: 14px; font-weight: 700; line-height: 1.1; }
#rds-r1 .rds-tab .en { font-size: 10px; letter-spacing: .14em; text-transform: uppercase; font-weight: 600; line-height: 1.1; }

/* Section */
#rds-r1 .rds-section { scroll-margin-top: 180px; margin-bottom: 64px; }
#rds-r1 .rds-section-title {
  display: flex; flex-direction: column; gap: 4px;
  margin: 0 0 20px;
}
#rds-r1 .rds-section-title .cn {
  font-size: 26px; font-weight: 800; color: var(--gold); line-height: 1.1;
}
#rds-r1 .rds-section-title .en {
  font-size: 12px; font-weight: 600; letter-spacing: .22em; text-transform: uppercase;
  color: var(--text-dim);
}
#rds-r1 .rds-section-sub {
  font-size: 12px; color: var(--text-dim);
  margin: -12px 0 20px;
  letter-spacing: .04em;
}

/* Table */
#rds-r1 .rds-table-wrap {
  background: var(--bg-2);
  border: 1px solid var(--border);
  border-radius: 12px;
  overflow: hidden;
}
#rds-r1 .rds-table-scroll { overflow-x: auto; width: 100%; -webkit-overflow-scrolling: touch; }
#rds-r1 table.rds-tbl {
  width: 100%; min-width: 800px;
  border-collapse: collapse;
  font-size: 13px;
}
#rds-r1 .rds-tbl thead th {
  background: var(--bg-3);
  color: var(--gold);
  font-weight: 700;
  text-align: left;
  padding: 14px 12px;
  border-bottom: 1px solid var(--border);
  font-size: 12px;
  white-space: nowrap;
}
#rds-r1 .rds-tbl thead th .cn { display: block; font-size: 12px; font-weight: 700; }
#rds-r1 .rds-tbl thead th .en { display: block; font-size: 10px; opacity: .7; letter-spacing: .12em; text-transform: uppercase; margin-top: 2px; }
#rds-r1 .rds-tbl tbody td {
  padding: 12px;
  border-bottom: 1px solid rgba(200,162,39,.06);
  vertical-align: middle;
}
#rds-r1 .rds-tbl tbody tr:hover { background: rgba(200,162,39,.04); }
#rds-r1 .rds-num { width: 60px; font-variant-numeric: tabular-nums; color: var(--gold-soft); font-weight: 600; }
#rds-r1 .rds-rank { width: 52px; text-align: center; font-weight: 700; font-size: 14px; color: var(--text-dim); font-variant-numeric: tabular-nums; }
#rds-r1 .rds-rank-gold .rds-rank { color: var(--gold); font-size: 17px; }
#rds-r1 .rds-rank-silver .rds-rank { color: #d8d8d8; font-size: 16px; }
#rds-r1 .rds-rank-bronze .rds-rank { color: #cd7f32; font-size: 16px; }
#rds-r1 .rds-rank-gold, #rds-r1 .rds-rank-silver, #rds-r1 .rds-rank-bronze {
  background: linear-gradient(90deg, rgba(200,162,39,.06), transparent);
}
#rds-r1 .rds-rank-top32 .rds-rank { color: var(--text); }
#rds-r1 .rds-rank-out { opacity: .55; }
#rds-r1 .rds-driver-cell { display: flex; align-items: center; gap: 12px; min-width: 180px; }
#rds-r1 .rds-flag { width: 24px; height: auto; border-radius: 2px; flex-shrink: 0; box-shadow: 0 0 0 1px rgba(255,255,255,.08); }
#rds-r1 .rds-name-cn { font-size: 14px; font-weight: 700; color: var(--text); line-height: 1.2; }
#rds-r1 .rds-name-en { font-size: 11px; color: var(--text-dim); line-height: 1.2; letter-spacing: .03em; text-transform: uppercase; margin-top: 2px; }
#rds-r1 .rds-name-en-only { font-size: 13px; color: var(--text); font-weight: 700; letter-spacing: .02em; }
#rds-r1 .rds-team-cell { font-size: 12px; color: var(--text-dim); }
#rds-r1 .rds-team-row { display: flex; align-items: center; gap: 16px; }
#rds-r1 .rds-team-medal { width: 48px; height: 48px; flex: 0 0 auto; filter: drop-shadow(0 2px 5px rgba(0,0,0,.5)); }
#rds-r1 .rds-team-medal-empty { width: 48px; height: 48px; }
#rds-r1 .rds-car-cell { font-size: 12px; color: var(--text); }
#rds-r1 .rds-engine { font-size: 12px; color: var(--text-dim); }
#rds-r1 .rds-att { width: 70px; text-align: center; font-variant-numeric: tabular-nums; color: var(--text); }
#rds-r1 .rds-stage-total { font-weight: 800; color: var(--gold-soft); }
#rds-r1 .rds-stage-await { text-align: center; color: var(--text-dim); padding: 28px 12px; font-size: 13px; }
#rds-r1 .rds-stage-await .en { letter-spacing: .1em; text-transform: uppercase; opacity: .8; }
#rds-r1 .rds-rank-dns { opacity: .8; }
#rds-r1 .rds-rank-dns .rds-att, #rds-r1 .rds-rank-dns .rds-best, #rds-r1 .rds-rank-dns .rds-pts { color: var(--text-dim); font-size: 11px; letter-spacing: .12em; font-weight: 700; }
#rds-r1 .rds-best { width: 80px; text-align: center; font-variant-numeric: tabular-nums; color: var(--text); font-weight: 700; font-size: 15px; }
#rds-r1 .rds-pts { width: 70px; text-align: center; font-variant-numeric: tabular-nums; color: var(--gold); font-weight: 700; font-size: 15px; }
#rds-r1 .rds-zero { color: rgba(168,152,128,.35); font-weight: 400; }

/* Top-32 separator */
#rds-r1 .rds-cutoff td {
  background: var(--bg-3) !important;
  padding: 8px 12px !important;
  font-size: 10px; letter-spacing: .18em; text-transform: uppercase;
  color: var(--gold); font-weight: 700; text-align: center;
  border-top: 1px solid var(--gold-dim);
  border-bottom: 1px solid var(--gold-dim);
}

/* Placeholder for upcoming */
#rds-r1 .rds-placeholder {
  background: var(--bg-2);
  border: 1px dashed var(--border);
  border-radius: 12px;
  padding: 48px 24px;
  text-align: center;
}
#rds-r1 .rds-placeholder .ph-icon { font-size: 32px; margin-bottom: 12px; opacity: .6; }
#rds-r1 .rds-placeholder .ph-cn { font-size: 18px; font-weight: 700; color: var(--gold); margin-bottom: 6px; }
#rds-r1 .rds-placeholder .ph-en { font-size: 11px; letter-spacing: .18em; text-transform: uppercase; color: var(--text-dim); font-weight: 600; }
#rds-r1 .rds-placeholder .ph-note { margin-top: 16px; font-size: 12px; color: var(--text-dim); }

/* Footer */
#rds-r1 .rds-foot {
  margin-top: 48px; padding-top: 24px;
  border-top: 1px solid var(--border);
  font-size: 11px; color: var(--text-dim);
  display: flex; justify-content: space-between; flex-wrap: wrap; gap: 12px;
}
#rds-r1 .rds-foot a { color: var(--gold); text-decoration: none; }

/* Mobile */
@media (max-width: 720px) {
  #rds-r1 { padding: 110px 0 56px; }
  #rds-r1 .rds-wrap { padding: 0 16px; }
  #rds-r1 .rds-hero { margin: 0 0 24px; padding: 0 0 24px; }
  #rds-r1 .rds-hero-brand { font-size: 10px; letter-spacing: .22em; margin-bottom: 10px; }
  #rds-r1 .rds-hero-round {
    display: flex; flex-direction: column; align-items: flex-start; gap: 8px;
    font-size: 10px; letter-spacing: .18em; margin-bottom: 12px;
  }
  #rds-r1 .rds-live-badge { font-size: 9px; padding: 3px 8px; }
  #rds-r1 .rds-hero-title-cn { font-size: 40px; margin-bottom: 6px; }
  #rds-r1 .rds-hero-title-en { font-size: 11px; letter-spacing: .22em; margin-bottom: 20px; }
  #rds-r1 .rds-hero-meta {
    grid-template-columns: 1fr; gap: 14px 0;
    padding-top: 16px; border-top: 1px solid var(--border);
  }
  #rds-r1 .rds-hero-meta .item .label { margin-bottom: 2px; }
  #rds-r1 .rds-hero-meta .item .val { font-size: 13px; }
  /* live buttons fill the top, full-width side-by-side on phones */
  #rds-r1 .rds-live-links { position: static; margin: 0 0 20px; gap: 8px; }
  #rds-r1 .rds-live-btn { flex: 1 1 0; min-width: 0; }
  #rds-r1 .rds-live-lang { font-size: 14px; }
  #rds-r1 .rds-tabs { margin: 24px -16px 32px; padding: 0 16px; }
  #rds-r1 .rds-tab { padding: 12px 14px; }
  #rds-r1 .rds-section-title .cn { font-size: 22px; }
  #rds-r1 table.rds-tbl { min-width: 0; width: 100%; font-size: 12px; table-layout: auto; }
  #rds-r1 .rds-tbl thead th, #rds-r1 .rds-tbl tbody td { padding: 10px 6px; }
  /* Entry table (5 cols): keep № · Driver · Car; hide Team(3) + Engine(5) */
  #rds-r1 #sec-entry .rds-tbl thead th:nth-child(3),
  #rds-r1 #sec-entry .rds-tbl tbody td:nth-child(3),
  #rds-r1 #sec-entry .rds-tbl thead th:nth-child(5),
  #rds-r1 #sec-entry .rds-tbl tbody td:nth-child(5) { display: none; }
  /* Quali table (7 cols): keep Rank · № · Driver · Best · Pts; hide Att1(4) + Att2(5) */
  #rds-r1 #sec-quali .rds-tbl thead th:nth-child(4),
  #rds-r1 #sec-quali .rds-tbl tbody td:nth-child(4),
  #rds-r1 #sec-quali .rds-tbl thead th:nth-child(5),
  #rds-r1 #sec-quali .rds-tbl tbody td:nth-child(5) { display: none; }
}

/* Sticky-tabs JS-fallback: when Tilda parent wrapper kills position:sticky,
   we fall back to position:fixed via JS-added class. */
#rds-r1 .rds-tabs.is-fixed {
  position: fixed; top: 98px; left: 0; right: 0; z-index: 100;
  margin: 0; padding-left: 16px; padding-right: 16px;
  background: #120c04;
  box-shadow: 0 4px 12px rgba(0,0,0,.5);
}
#rds-r1 .rds-tabs.is-fixed .rds-tabs-inner {
  max-width: 1280px; margin: 0 auto;
}
#rds-r1 .rds-tabs-placeholder { display: none; }
#rds-r1 .rds-tabs-placeholder.is-active { display: block; }
/* ≤1360px Tilda switches to the burger bar, which is position:relative and
   scrolls away with the page — so the section-tabs must pin to the very top
   (otherwise they hang with an empty band above them). JS also sets the exact
   top inline; these are the CSS fallbacks. */
@media (max-width: 1360px){
  #rds-r1 .rds-tabs { top: 0; }
  #rds-r1 .rds-tabs.is-fixed { top: 0; }
}

/* ============================== Tandem bracket ============================ */
/* Meta strip */
#rds-r1 .rds-bracket-meta {
  display: flex; flex-wrap: wrap; gap: 20px;
  margin: 0 0 20px;
  padding: 14px 18px;
  background: var(--bg-2);
  border: 1px solid var(--border);
  border-radius: 8px;
  font-size: 12px;
}
#rds-r1 .rds-bracket-meta .item .lbl {
  display: block;
  font-size: 10px; letter-spacing: .18em; text-transform: uppercase;
  color: var(--gold); font-weight: 700; margin-bottom: 2px;
}
#rds-r1 .rds-bracket-meta .item .val { color: var(--text); }

/* Stage legend chips */
#rds-r1 .rds-bracket-legend {
  display: flex; flex-wrap: wrap; gap: 8px;
  margin: 0 0 16px;
  font-size: 11px; letter-spacing: .04em;
}
#rds-r1 .rds-bracket-legend .chip {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 4px 10px;
  background: var(--bg-2); border: 1px solid var(--border);
  border-radius: 999px; color: var(--text-dim);
}
#rds-r1 .rds-bracket-legend .dot {
  width: 7px; height: 7px; border-radius: 50%;
  background: var(--gold-dim);
}
#rds-r1 .rds-bracket-legend .dot.live { background: var(--live); box-shadow: 0 0 0 3px rgba(231,76,60,.15); }
#rds-r1 .rds-bracket-legend .dot.decided { background: var(--gold); }
#rds-r1 .rds-bracket-legend .dot.tbd { background: var(--text-dim); opacity: .5; }

/* ----- Pair card (used in Top32/Top16/Top8) -----
   Fixed height = 26 (head) + 38 + 38 + 1 = 103px. Critical for stage centering. */
#rds-r1 .bp {
  position: relative;
  background: var(--bg-2);
  border: 1px solid var(--border);
  border-radius: 6px;
  overflow: hidden;
  min-height: 103px;
}
#rds-r1 .bp + .bp { margin-top: 0; }
#rds-r1 .bp[data-status="decided"] { border-color: rgba(200,162,39,.45); }
/* Decided battle: winner accented, loser dimmed */
#rds-r1 .bp[data-status="decided"] .bd.is-winner .bd-name,
#rds-r1 .bp[data-status="decided"] .bd.is-winner .bd-num { color: var(--gold-soft); font-weight: 800; }
#rds-r1 .bp[data-status="decided"] .bd.is-winner .bd-seed { color: var(--gold); font-weight: 800; }
#rds-r1 .bp[data-status="decided"] .bd.is-loser { opacity: .4; }
#rds-r1 .rr-standings tbody tr.rr-st-leader .rr-st-rank,
#rds-r1 .rr-standings tbody tr.rr-st-leader .rr-st-p { color: var(--gold); font-weight: 800; }
#rds-r1 .bp[data-live="true"] { border-color: var(--live); box-shadow: 0 0 0 1px rgba(231,76,60,.2); }
#rds-r1 .bp-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 5px 10px;
  background: rgba(200,162,39,.05);
  border-bottom: 1px solid var(--border);
  font-size: 10px; letter-spacing: .12em; text-transform: uppercase;
  color: var(--text-dim);
}
#rds-r1 .bp-head .bp-code { color: var(--gold); font-weight: 700; }
#rds-r1 .bp-head .bp-live {
  font-size: 9px; padding: 1px 6px; border-radius: 3px;
  background: var(--live); color: #fff; font-weight: 700; letter-spacing: .1em;
  animation: rds-pulse 1.4s ease-in-out infinite;
}
@keyframes rds-pulse {
  0%,100% { opacity: 1; } 50% { opacity: .55; }
}
#rds-r1 .bp .bd {
  display: flex; align-items: center; gap: 8px;
  padding: 8px 10px;
  font-size: 12px;
  height: 38px;
  box-sizing: border-box;
}
#rds-r1 .bp .bd + .bp-vs + .bd { border-top: 1px solid var(--border); }
#rds-r1 .bp .bd-seed {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 20px; height: 20px;
  font-size: 10px; font-weight: 700;
  background: rgba(200,162,39,.12); color: var(--gold);
  border-radius: 4px;
}
#rds-r1 .bp .bd-flag .rds-flag,
#rds-r1 .bp .rds-flag {
  width: 20px; height: 13px; object-fit: cover; border-radius: 2px;
  box-shadow: 0 0 0 1px rgba(0,0,0,.4);
  flex-shrink: 0;
}
#rds-r1 .bp .bd-num { color: var(--gold-soft); font-weight: 700; font-size: 11px; min-width: 36px; }
#rds-r1 .bp .bd-name { display: flex; flex-direction: column; gap: 0; line-height: 1.15; flex: 1; min-width: 0; }
#rds-r1 .bp .bn-cn { font-size: 12px; font-weight: 600; color: var(--text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#rds-r1 .bp .bn-en { font-size: 9px; letter-spacing: .04em; text-transform: uppercase; color: var(--text-dim); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#rds-r1 .bp .bn-en-only { font-size: 11px; letter-spacing: .02em; text-transform: none; color: var(--text); font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; }
#rds-r1 .bp .bd.bd-tbd {
  color: var(--text-dim);
  min-height: 38px;
  gap: 8px;
}
#rds-r1 .bp .bd-tbd .bd-tbd-cn { font-size: 12px; color: var(--text-dim); font-style: italic; }
#rds-r1 .bp .bd-tbd .bd-tbd-code {
  font-size: 10px; letter-spacing: .06em; color: var(--gold);
  background: rgba(200,162,39,.08);
  padding: 2px 6px; border-radius: 3px;
  font-weight: 700;
}
#rds-r1 .bp .bp-vs {
  position: absolute; left: 78px; top: 50%;
  transform: translate(-50%, -50%);
  font-size: 8px; letter-spacing: .08em; font-weight: 700;
  color: var(--gold); background: var(--bg);
  padding: 1px 4px; border-radius: 3px;
  border: 1px solid var(--gold-dim);
  margin-top: 9px; /* offset for header */
}
/* mirror: right-side cards put numbers on the right, so anchor VS to the right number column */
#rds-r1 [data-stage-col$="-r"] .bp .bp-vs { left: auto; right: 78px; transform: translate(50%, -50%); }

/* ============================== DESKTOP layout ============================ */
/* Foldable mirrored bracket. The active stage column shows full pairs;
   the rest collapse into compact rails (flag + #num stacked vertically).
   Center column (Top 4 round-robin) is always full.

   Geometry (reworked 2026-06): every column is an independent, vertically
   centred stack with one uniform gap – no strict tree padding. This keeps the
   whole bracket short enough to fit a 14" screen in every state (the old tree
   math made Top-32 ~850px tall and left late stages mostly empty). The merge
   structure is shown by the live-drawn SVG connectors (r1_bracket.js), which
   measure real positions, so they stay correct no matter the column heights. */
#rds-r1 .rds-bracket-desktop {
  display: grid;
  /* Column widths morph with active stage – see overrides below.
     Fixed px (no fr) → total bracket width is constant across stages and the
     grid is centered, so it never stretches awkwardly wide on FullHD. */
  grid-template-columns:
    var(--col-t32, 64px)
    var(--col-t16, 64px)
    var(--col-t8,  64px)
    var(--col-c,   150px)
    var(--col-t8,  64px)
    var(--col-t16, 64px)
    var(--col-t32, 64px);
  gap: 14px;
  align-items: center;     /* short (late-stage) columns center against the tall T32 rail */
  justify-content: center; /* fixed tracks pack to centre instead of stretching */
  min-height: 690px;       /* normalize module height across all stages — no jump when switching (TOP-32 is the tallest) */
}
#rds-r1 .rds-stage-col { display: flex; flex-direction: column; min-width: 0; }
/* Central round-robin column is vertically centered inside the bracket grid. */
#rds-r1 .rds-stage-col[data-side="c"] { align-self: center; }
#rds-r1 .rds-stage-col .stage-h {
  font-size: 10px; letter-spacing: .14em; text-transform: uppercase;
  font-weight: 700; color: var(--gold);
  text-align: center;
  padding-bottom: 6px;
  border-bottom: 1px solid var(--border);
  margin-bottom: 8px;
  white-space: nowrap;
  cursor: pointer; /* will become clickable in step 2 */
  user-select: none;
  transition: color .2s ease, border-color .2s ease;
}
#rds-r1 .rds-stage-col .stage-h .cn { display: inline-block; margin-right: 6px; color: var(--text); }
#rds-r1 .rds-stage-col .pair-list { display: flex; flex-direction: column; gap: 8px; padding-top: 0; }
/* Active (full) column packs its pairs tightly so all 8 Top-32 cells fit one screen. */
#rds-r1 .rds-bracket-desktop .rds-stage-col[data-mode="full"] .pair-list { gap: 6px; }

/* ---- Desktop bracket: compact full-pair card (fits 8 Top-32 cells on one screen).
   Scoped to .rds-bracket-desktop so the mobile horizontal-scroll bracket keeps
   its taller cards and its own tree spacing untouched. ---- */
#rds-r1 .rds-bracket-desktop .bp { min-height: 0; }
#rds-r1 .rds-bracket-desktop .bp-head { padding: 2px 8px; font-size: 9px; }
#rds-r1 .rds-bracket-desktop .bp .bd { height: 30px; padding: 2px 9px; gap: 8px; }
#rds-r1 .rds-bracket-desktop .bp .bd.bd-tbd { min-height: 30px; }
#rds-r1 .rds-bracket-desktop .bp .bd-seed { min-width: 18px; height: 18px; font-size: 9px; }
#rds-r1 .rds-bracket-desktop .bp .bd-num { min-width: 30px; font-size: 11px; }
#rds-r1 .rds-bracket-desktop .bp .bd-name { gap: 2px; }   /* breathing room between CN + latin lines (Gilroy stacked them flush) */
#rds-r1 .rds-bracket-desktop .bp .bn-cn { font-size: 12px; line-height: 1.1; }
#rds-r1 .rds-bracket-desktop .bp .bn-en { font-size: 9px; line-height: 1.1; }
#rds-r1 .rds-bracket-desktop .bp .bn-en-only { font-size: 11.5px; }

/* ---- Pair compact mode ----
   When a column is compact, pairs render as a small vertical stack:
   header chip (code) + two driver rows showing only flag + #num.
*/
#rds-r1 .rds-stage-col[data-mode="compact"] .bp {
  min-height: 0;
  /* fill the column so collapsed chips scale with the rail width */
  width: auto;
  align-self: stretch;
}
#rds-r1 .rds-stage-col[data-mode="compact"] .bp-head {
  padding: 1px 4px;
  font-size: 8px;
  letter-spacing: .03em;
  justify-content: center;
  text-align: center;
}
#rds-r1 .rds-stage-col[data-mode="compact"] .bp-head .bp-live { font-size: 8px; padding: 0 4px; }
/* Force compact rows centered regardless of left/right side */
#rds-r1 .rds-stage-col[data-mode="compact"] .bp .bd {
  height: 15px;
  min-height: 0;   /* beat .bd-tbd min-height → empty compact chips match filled, stay centered */
  padding: 1px 4px;
  font-size: 9px;
  gap: 3px;
  flex-direction: row;
  text-align: center;
  justify-content: center;
}
#rds-r1 .rds-stage-col[data-mode="compact"] .bp .bd-seed { display: none; }
#rds-r1 .rds-stage-col[data-mode="compact"] .bp .bd-name { display: none; }
#rds-r1 .rds-stage-col[data-mode="compact"] .bp .bd-num { font-size: 10px; min-width: 0; }
#rds-r1 .rds-stage-col[data-mode="compact"] .bp .bd-flag .rds-flag,
#rds-r1 .rds-stage-col[data-mode="compact"] .bp .rds-flag { width: 14px; height: 10px; }
#rds-r1 .rds-stage-col[data-mode="compact"] .bp .bp-vs { display: none; }
/* TBD plates in compact: single line with code chip only */
#rds-r1 .rds-stage-col[data-mode="compact"] .bp .bd-tbd .bd-tbd-cn { display: none; }
#rds-r1 .rds-stage-col[data-mode="compact"] .bp .bd-tbd .bd-tbd-code {
  font-size: 9px; padding: 1px 4px;
}
/* Center stage header for compact columns too */
#rds-r1 .rds-stage-col[data-mode="compact"] .stage-h { text-align: center; }

/* ---- Column widths per active stage ----
   Fixed px so the total bracket width is constant across stages (centred, never
   stretches on FullHD). The active knockout column is wide; the rest are thin
   rails. Vertical rhythm is a single uniform gap (see .pair-list above) – we no
   longer pad/gap pairs into a strict tree, which is what made Top-32 huge and
   late stages mostly empty. The live-drawn SVG connectors show the merge
   geometry instead, so every stage stays short enough to fit one screen. */
#rds-r1 .rds-bracket-desktop[data-active-stage="top32"] {
  --col-t32: 256px;
  --col-t16: 64px;
  --col-t8:  64px;
  --col-c:   150px;
}

#rds-r1 .rds-bracket-desktop[data-active-stage="top16"] {
  --col-t32: 64px;
  --col-t16: 256px;
  --col-t8:  64px;
  --col-c:   150px;
}

#rds-r1 .rds-bracket-desktop[data-active-stage="top8"] {
  --col-t32: 64px;
  --col-t16: 64px;
  --col-t8:  256px;
  --col-c:   150px;
}

#rds-r1 .rds-bracket-desktop[data-active-stage="top4"] {
  --col-t32: 108px;
  --col-t16: 108px;
  --col-t8:  108px;
  --col-c:   440px;
}

/* Center column – in non-top4 states show the "FINAL BATTLE" capsule,
   hide both the RR block and the small stage-h header. In top4 state
   show the RR block + stage-h, hide the capsule. */
#rds-r1 .rds-bracket-desktop:not([data-active-stage="top4"]) [data-stage="t4"] .rr-center-premium {
  display: none;
}
#rds-r1 .rds-bracket-desktop:not([data-active-stage="top4"]) [data-stage="t4"] .stage-h {
  display: none;
}
#rds-r1 .rds-bracket-desktop[data-active-stage="top4"] [data-stage="t4"] .rr-capsule {
  display: none;
}

/* ===== TOP-4 "FINAL BATTLE" capsule (non-top4 states only) =====
   "Pillar Trophy" – vertical premium stele with the RoyalDS crown,
   engraved hairline frame, gold halo on hover. Focal point of the bracket. */
#rds-r1 .rr-capsule {
  align-self: center;
  width: 132px;
  margin: 0 auto;
  padding: 20px 10px 18px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  background:
    radial-gradient(120% 60% at 50% 0%, rgba(200,162,39,.16) 0%, transparent 65%),
    linear-gradient(180deg, rgba(38,28,12,.96) 0%, rgba(22,15,6,.96) 100%);
  border: 1px solid rgba(200,162,39,.42);
  border-radius: 14px;
  box-shadow:
    inset 0 1px 0 rgba(255,220,130,.14),
    inset 0 -1px 0 rgba(200,162,39,.10),
    0 14px 36px -18px rgba(0,0,0,.7);
  text-align: center !important;
  position: relative;
  cursor: pointer;
  transition: border-color .3s ease, box-shadow .3s ease, transform .3s ease;
}
#rds-r1 .rr-capsule::before {
  content: "";
  position: absolute;
  inset: 5px;
  border: 1px solid rgba(200,162,39,.18);
  border-radius: 10px;
  pointer-events: none;
  transition: border-color .3s ease;
}
#rds-r1 .rr-capsule::after {
  content: "";
  position: absolute;
  left: 50%; top: 0; bottom: 0;
  width: 1px;
  background: linear-gradient(180deg,
    transparent 0%,
    rgba(200,162,39,.22) 12%,
    rgba(200,162,39,.10) 50%,
    rgba(200,162,39,.22) 88%,
    transparent 100%);
  pointer-events: none;
  opacity: .55;
  transition: opacity .3s ease;
}
#rds-r1 .rds-stage-col[data-stage="t4"]:hover .rr-capsule {
  border-color: rgba(200,162,39,.80);
  box-shadow:
    inset 0 1px 0 rgba(255,220,130,.22),
    inset 0 -1px 0 rgba(200,162,39,.18),
    0 0 0 1px rgba(200,162,39,.22),
    0 0 32px -2px rgba(200,162,39,.28),
    0 18px 44px -16px rgba(0,0,0,.8);
  transform: translateY(-2px);
}
#rds-r1 .rds-stage-col[data-stage="t4"]:hover .rr-capsule::before {
  border-color: rgba(200,162,39,.35);
}
#rds-r1 .rds-stage-col[data-stage="t4"]:hover .rr-capsule::after {
  opacity: .85;
}
#rds-r1 .rr-capsule-crown {
  width: 46px; height: 46px;
  color: #feb301;   /* brand crown gold */
  display: flex; align-items: center; justify-content: center;
  margin: 2px 0 6px;
  position: relative;
  z-index: 1;
  filter:
    drop-shadow(0 1px 0 rgba(255,220,130,.25))
    drop-shadow(0 4px 10px rgba(200,162,39,.20));
  transition: filter .3s ease, transform .3s ease;
}
#rds-r1 .rds-stage-col[data-stage="t4"]:hover .rr-capsule-crown {
  filter:
    drop-shadow(0 1px 0 rgba(255,220,130,.35))
    drop-shadow(0 6px 16px rgba(200,162,39,.42));
  transform: translateY(-1px) scale(1.04);
}
#rds-r1 .rr-capsule-crown-svg { width: 100%; height: 100%; display: block; }
#rds-r1 .rr-capsule-cn {
  font-size: 26px; line-height: 1.0; font-weight: 800;
  color: var(--text);
  letter-spacing: .08em;
  position: relative; z-index: 1;
  text-shadow: 0 1px 0 rgba(0,0,0,.5);
}
#rds-r1 .rr-capsule-en {
  font-size: 9px; line-height: 1.2; font-weight: 700;
  color: var(--gold);
  letter-spacing: .28em; text-transform: uppercase;
  margin-top: 4px;
  position: relative; z-index: 1;
}
#rds-r1 .rr-capsule-divider {
  width: 42px; height: 1px;
  background: linear-gradient(90deg, transparent, var(--gold), transparent);
  margin: 8px 0 6px;
  position: relative; z-index: 1;
  opacity: .7;
}
#rds-r1 .rr-capsule-cn-sub {
  font-size: 12px; line-height: 1.15; font-weight: 700;
  color: var(--text-dim);
  letter-spacing: .04em;
  position: relative; z-index: 1;
}
#rds-r1 .rr-capsule-en-sub {
  font-size: 8px; line-height: 1.2; font-weight: 600;
  color: var(--text-dim);
  letter-spacing: .22em; text-transform: uppercase;
  margin-top: 2px;
  opacity: .80;
  position: relative; z-index: 1;
}
#rds-r1 .rds-stage-col[data-stage="t4"] { cursor: pointer; }

/* Active stage header gets highlighted */
#rds-r1 .rds-bracket-desktop[data-active-stage="top32"] [data-stage="t32"] .stage-h,
#rds-r1 .rds-bracket-desktop[data-active-stage="top16"] [data-stage="t16"] .stage-h,
#rds-r1 .rds-bracket-desktop[data-active-stage="top8"]  [data-stage="t8"]  .stage-h,
#rds-r1 .rds-bracket-desktop[data-active-stage="top4"]  [data-stage="t4"]  .stage-h {
  color: var(--gold);
  border-bottom-color: var(--gold);
}
#rds-r1 .rds-bracket-desktop[data-active-stage="top32"] [data-stage="t16"] .stage-h,
#rds-r1 .rds-bracket-desktop[data-active-stage="top32"] [data-stage="t8"]  .stage-h,
#rds-r1 .rds-bracket-desktop[data-active-stage="top32"] [data-stage="t4"]  .stage-h,
#rds-r1 .rds-bracket-desktop[data-active-stage="top16"] [data-stage="t32"] .stage-h,
#rds-r1 .rds-bracket-desktop[data-active-stage="top16"] [data-stage="t8"]  .stage-h,
#rds-r1 .rds-bracket-desktop[data-active-stage="top16"] [data-stage="t4"]  .stage-h,
#rds-r1 .rds-bracket-desktop[data-active-stage="top8"]  [data-stage="t32"] .stage-h,
#rds-r1 .rds-bracket-desktop[data-active-stage="top8"]  [data-stage="t16"] .stage-h,
#rds-r1 .rds-bracket-desktop[data-active-stage="top8"]  [data-stage="t4"]  .stage-h,
#rds-r1 .rds-bracket-desktop[data-active-stage="top4"]  [data-stage="t32"] .stage-h,
#rds-r1 .rds-bracket-desktop[data-active-stage="top4"]  [data-stage="t16"] .stage-h,
#rds-r1 .rds-bracket-desktop[data-active-stage="top4"]  [data-stage="t8"]  .stage-h {
  color: var(--text-dim);
}

/* Mirror right side: flip flag-num-name reading direction visually –
   we keep DOM order but right-align contents. Only applies to FULL mode;
   compact rows are centered (rule above already overrides this). */
#rds-r1 [data-stage-col$="-r"][data-mode="full"] .bp .bd { flex-direction: row-reverse; text-align: right; }
#rds-r1 [data-stage-col$="-r"][data-mode="full"] .bp .bd-name { align-items: flex-end; }
#rds-r1 [data-stage-col$="-r"][data-mode="full"] .bp-head { flex-direction: row-reverse; }

/* ============================ CENTER: Top 4 ============================== */
/* Premium round-robin block: matrix + combined standings + linear podium.
   Compact width (~260–320px), 3 sub-blocks separated by hair dividers.
*/
#rds-r1 .rr-center-premium {
  background:
    radial-gradient(120% 80% at 50% 0%, rgba(200,162,39,.06) 0%, transparent 60%),
    var(--bg-2);
  border: 1px solid var(--gold-dim);
  border-radius: 10px;
  padding: 10px 10px 12px;
  display: flex; flex-direction: column; gap: 10px;
  box-shadow:
    0 0 0 1px rgba(200,162,39,.06),
    0 10px 30px -12px rgba(0,0,0,.6) inset;
}
#rds-r1 .rr-block { display: flex; flex-direction: column; gap: 6px; }
#rds-r1 .rr-mini-title {
  display: flex; align-items: baseline; gap: 6px;
  font-size: 9px; letter-spacing: .14em; text-transform: uppercase;
  color: var(--gold); font-weight: 700;
  padding-bottom: 4px;
  border-bottom: 1px solid rgba(200,162,39,.18);
}
#rds-r1 .rr-mini-title .cn {
  color: var(--text); font-size: 11px; letter-spacing: .04em;
  text-transform: none; font-weight: 700;
}
#rds-r1 .rr-mini-title .en { opacity: .75; }

/* ----- Premium 4x4 matrix ----- */
#rds-r1 .rr-matrix {
  width: 100%;
  border-collapse: separate;
  border-spacing: 3px;
  font-size: 11px;
  table-layout: fixed;
}
#rds-r1 .rr-matrix th, #rds-r1 .rr-matrix td {
  width: 25%; height: 26px;
  text-align: center; vertical-align: middle;
  border-radius: 4px;
  position: relative;
  font-feature-settings: "tnum" 1;
}
#rds-r1 .rr-matrix th.rr-h {
  background: linear-gradient(180deg, rgba(200,162,39,.22) 0%, rgba(200,162,39,.10) 100%);
  color: var(--gold);
  font-weight: 700; font-size: 12px;
  letter-spacing: .06em;
  box-shadow: 0 0 0 1px rgba(200,162,39,.25) inset;
}
#rds-r1 .rr-matrix th.rr-corner {
  background: transparent; box-shadow: none;
}
#rds-r1 .rr-matrix td.rr-self {
  background:
    repeating-linear-gradient(
      45deg,
      rgba(200,162,39,.05) 0 4px,
      transparent 4px 8px
    ),
    var(--bg-3);
  color: transparent;
  box-shadow: 0 0 0 1px rgba(200,162,39,.10) inset;
}
#rds-r1 .rr-matrix td.rr-self::after {
  content: "•";
  position: absolute; inset: 0;
  display: flex; align-items: center; justify-content: center;
  color: rgba(200,162,39,.45); font-size: 12px;
}
#rds-r1 .rr-matrix td.rr-cell {
  background: var(--bg-3);
  color: var(--text-dim);
  box-shadow: 0 0 0 1px rgba(200,162,39,.06) inset;
  transition: background .2s ease, box-shadow .2s ease;
}
#rds-r1 .rr-matrix td.rr-cell[data-status="decided"] {
  background:
    linear-gradient(180deg, rgba(200,162,39,.22) 0%, rgba(200,162,39,.10) 100%),
    var(--bg-3);
  box-shadow:
    0 0 0 1px rgba(200,162,39,.45) inset,
    0 2px 8px -2px rgba(200,162,39,.20);
}
#rds-r1 .rr-matrix td.rr-cell[data-live="true"] {
  background:
    linear-gradient(180deg, rgba(231,76,60,.25) 0%, rgba(231,76,60,.12) 100%),
    var(--bg-3);
  box-shadow:
    0 0 0 1px rgba(231,76,60,.55) inset,
    0 0 12px rgba(231,76,60,.25);
  animation: rds-pulse 1.6s ease-in-out infinite;
}
#rds-r1 .rr-matrix .rr-cell-code {
  font-family: ui-monospace, Menlo, Consolas, monospace;
  font-size: 9px; letter-spacing: .02em; color: var(--gold-soft); opacity: .55;
}
#rds-r1 .rr-matrix .rr-cell-w { color: var(--gold); font-weight: 800; font-size: 13px; letter-spacing: .04em; }
#rds-r1 .rr-matrix .rr-cell-l { color: var(--text-dim); font-weight: 600; font-size: 12px; }
#rds-r1 .rr-matrix .rr-cell-d { color: var(--text); font-weight: 700; font-size: 12px; }

/* ----- Combined slots+standings table ----- */
#rds-r1 .rr-standings {
  width: 100%;
  border-collapse: collapse;
  font-size: 11px;
  font-feature-settings: "tnum" 1;
}
#rds-r1 .rr-standings thead th {
  font-size: 9px; letter-spacing: .12em; text-transform: uppercase;
  color: var(--gold); font-weight: 700;
  padding: 4px 2px;
  border-bottom: 1px solid rgba(200,162,39,.18);
  text-align: center;
}
#rds-r1 .rr-standings thead th.th-driver {
  text-align: left; padding-left: 4px;
}
#rds-r1 .rr-standings thead th.th-driver .th-en {
  margin-left: 4px; opacity: .55; font-weight: 400;
  text-transform: none; letter-spacing: 0;
}
#rds-r1 .rr-standings tbody td {
  padding: 5px 2px;
  text-align: center;
  border-bottom: 1px solid rgba(200,162,39,.06);
  color: var(--text);
  vertical-align: middle;
}
#rds-r1 .rr-standings tbody td.rr-st-rank { color: var(--text-dim); font-weight: 700; width: 20px; }
#rds-r1 .rr-standings tbody td.rr-st-slot { width: 24px; }
#rds-r1 .rr-standings tbody td.rr-st-slot .rr-letter {
  display: inline-flex; align-items: center; justify-content: center;
  width: 18px; height: 18px;
  font-weight: 800; font-size: 10px;
  background: linear-gradient(180deg, var(--gold) 0%, #a8861e 100%);
  color: var(--bg);
  border-radius: 4px;
  box-shadow: 0 1px 2px rgba(0,0,0,.4);
}
#rds-r1 .rr-standings tbody td.rr-st-driver {
  text-align: left;
  padding-left: 4px;
}
#rds-r1 .rr-standings tbody td.rr-st-driver .rr-flag .rds-flag,
#rds-r1 .rr-standings tbody td.rr-st-driver .rds-flag {
  width: 16px; height: 11px; object-fit: cover; border-radius: 2px;
  vertical-align: middle; margin-right: 4px;
}
#rds-r1 .rr-standings tbody td.rr-st-driver .rr-flag-tbd {
  display: inline-block; width: 16px; height: 11px;
  margin-right: 4px; vertical-align: middle;
  border: 1px dashed rgba(200,162,39,.25); border-radius: 2px;
}
#rds-r1 .rr-standings tbody td.rr-st-driver .rr-num {
  display: inline-block; min-width: 36px; margin-right: 8px;
  color: var(--gold-soft); font-weight: 700; font-variant-numeric: tabular-nums;
}
#rds-r1 .rr-standings tbody td.rr-st-driver .rr-name { display: inline; }
#rds-r1 .rr-standings tbody td.rr-st-driver .rr-bn-cn {
  font-size: 11px; font-weight: 600; color: var(--text);
}
#rds-r1 .rr-standings tbody td.rr-st-driver .rr-bn-en {
  font-size: 9px; color: var(--text-dim); margin-left: 4px;
  letter-spacing: .04em; text-transform: uppercase;
}
#rds-r1 .rr-standings tbody td.rr-st-driver .rr-bn-en-only {
  font-size: 11px; color: var(--text); text-transform: none; letter-spacing: 0;
}
#rds-r1 .rr-standings tbody td.rr-st-driver .rr-tbd-text {
  color: var(--text-dim); font-style: italic; font-size: 10px;
}
#rds-r1 .rr-standings tbody td.rr-st-driver .rr-tbd-code {
  font-family: ui-monospace, Menlo, Consolas, monospace;
  font-size: 9px; color: var(--gold); opacity: .8;
  padding: 1px 4px; background: rgba(200,162,39,.08); border-radius: 3px;
  margin-left: 2px;
}
#rds-r1 .rr-standings tbody td.rr-st-w,
#rds-r1 .rr-standings tbody td.rr-st-d,
#rds-r1 .rr-standings tbody td.rr-st-l {
  width: 24px; color: var(--text-dim);
}
#rds-r1 .rr-standings tbody td.rr-st-p {
  width: 30px; font-weight: 800; color: var(--gold-soft);
  background: rgba(200,162,39,.04);
}
#rds-r1 .rr-standings tbody tr.rds-rank-gold td.rr-st-rank,
#rds-r1 .rr-standings tbody tr.rds-rank-gold td.rr-st-p { color: #f4d666; }
#rds-r1 .rr-standings tbody tr.rds-rank-silver td.rr-st-rank,
#rds-r1 .rr-standings tbody tr.rds-rank-silver td.rr-st-p { color: #d9d9d9; }
#rds-r1 .rr-standings tbody tr.rds-rank-bronze td.rr-st-rank,
#rds-r1 .rr-standings tbody tr.rds-rank-bronze td.rr-st-p { color: #c98a55; }

/* ----- Linear podium (one row) ----- */
#rds-r1 .rr-podium {
  display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 6px;
}
#rds-r1 .pod {
  display: flex; align-items: center; gap: 5px;
  padding: 5px 7px;
  background: var(--bg-3);
  border: 1px solid rgba(200,162,39,.18);
  border-radius: 5px;
  min-height: 32px;
}
#rds-r1 .pod[data-pos="p1"] {
  background: linear-gradient(180deg, rgba(244,214,102,.08) 0%, rgba(244,214,102,.02) 100%), var(--bg-3);
  border-color: rgba(244,214,102,.35);
}
#rds-r1 .pod[data-pos="p2"] {
  background: linear-gradient(180deg, rgba(217,217,217,.06) 0%, rgba(217,217,217,.02) 100%), var(--bg-3);
  border-color: rgba(217,217,217,.25);
}
#rds-r1 .pod[data-pos="p3"] {
  background: linear-gradient(180deg, rgba(201,138,85,.06) 0%, rgba(201,138,85,.02) 100%), var(--bg-3);
  border-color: rgba(201,138,85,.25);
}
#rds-r1 .pod .pod-medal { font-size: 14px; line-height: 1; flex-shrink: 0; }
#rds-r1 .pod .pod-place {
  display: flex; flex-direction: column; line-height: 1; gap: 1px;
  flex-shrink: 0; min-width: 14px;
}
#rds-r1 .pod .pod-place .pod-cn { font-size: 11px; color: var(--text); font-weight: 700; }
#rds-r1 .pod .pod-place .pod-en {
  font-size: 7px; letter-spacing: .08em; text-transform: uppercase; color: var(--text-dim);
}
#rds-r1 .pod .pod-driver { display: inline-flex; align-items: center; gap: 3px; min-width: 0; flex: 1; }
#rds-r1 .pod .pod-driver .rds-flag { width: 14px; height: 10px; object-fit: cover; border-radius: 2px; }
#rds-r1 .pod .pod-driver .pod-num { color: var(--gold-soft); font-weight: 700; font-size: 10px; }
#rds-r1 .pod .pod-tbd { color: var(--text-dim); opacity: .4; font-size: 11px; }

/* ============================== MOBILE layout ============================ */
/* Horizontal-scroll classic bracket: 4 columns Top32 → Top16 → Top8 → Top4 */
#rds-r1 .rds-bracket-mobile { display: none; }
#rds-r1 .rds-bracket-mobile-scroll {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  padding-bottom: 12px;
  scroll-snap-type: x proximity;
}
#rds-r1 .rds-bracket-mobile-grid {
  display: grid;
  grid-template-columns: 240px 220px 220px 260px;
  gap: 8px;
  align-items: start;
  min-width: 960px;
}
#rds-r1 .rds-bracket-mobile-grid .rds-stage-col { scroll-snap-align: start; }
/* Round-robin (TOP-4) floats in the vertical middle of the bracket height,
   like the desktop center column — not glued to the top of the grid. */
#rds-r1 .rds-bracket-mobile-grid [data-stage-col="m-t4"] { align-self: center; }
#rds-r1 .rds-bracket-mobile-grid [data-stage-col="m-t32"] .pair-list { gap: 6px; }
#rds-r1 .rds-bracket-mobile-grid [data-stage-col="m-t16"] .pair-list { gap: 76px; padding-top: 36px; }
#rds-r1 .rds-bracket-mobile-grid [data-stage-col="m-t8"] .pair-list { gap: 232px; padding-top: 108px; }
#rds-r1 .rds-bracket-mobile-hint {
  display: none;
  font-size: 11px; color: var(--text-dim);
  margin: 0 0 8px;
  padding: 6px 10px;
  background: var(--bg-2); border: 1px solid var(--border);
  border-radius: 5px;
}
#rds-r1 .rds-bracket-mobile-hint .arrow { color: var(--gold); }

/* Note block */
#rds-r1 .rds-bracket-note {
  margin-top: 20px;
  padding: 14px 18px;
  background: var(--bg-2);
  border-left: 3px solid var(--gold);
  border-radius: 0 6px 6px 0;
  font-size: 12px; color: var(--text-dim); line-height: 1.6;
}
#rds-r1 .rds-bracket-note .cn { display: block; color: var(--text); font-size: 13px; margin-bottom: 4px; }

/* Breakpoint: switch desktop → mobile.
   1280 because 7-col layout needs at least ~1240px to read comfortably. */
@media (max-width: 1280px) {
  #rds-r1 .rds-bracket-desktop { display: none; }
  #rds-r1 .rds-bracket-mobile { display: block; }
  #rds-r1 .rds-bracket-mobile-hint { display: block; }
}
@media (max-width: 720px) {
  #rds-r1 .rds-bracket-mobile-grid {
    grid-template-columns: 220px 200px 200px 240px;
    min-width: 880px;
  }
  #rds-r1 .bp .bd { padding: 8px 8px; font-size: 11px; min-height: 34px; }
  #rds-r1 .bp .bn-cn { font-size: 11px; }
  #rds-r1 .bp .bp-vs { font-size: 7px; padding: 1px 4px; }
  #rds-r1 .rds-bracket-meta { font-size: 11px; gap: 12px; padding: 10px 12px; }
  #rds-r1 .rr-podium { grid-template-columns: 1fr; }
}
/* ===== Winners (hero) — cut-out figures on transparent bg, compact, no frames ===== */
#rds-r1 .rr-podium { display: none; }   /* old small podium hidden in favour of the hero block */
#rds-r1 .rds-wpod { position: relative; isolation: isolate; margin: 0 0 22px; }
/* Winners glow lives on a ::before so it can reach up to the tabs divider without the
   box clipping it into a hard top edge. Masked top fades it softly onto the divider. */
#rds-r1 .rds-wpod::before {
  content: ""; position: absolute; z-index: -1; pointer-events: none;
  left: 50%; transform: translateX(-50%);
  top: -42px; height: calc(100% + 42px); width: min(1060px, 122%);
  background: radial-gradient(72% 58% at 50% 36%, rgba(200,162,39,.20) 0%, rgba(200,162,39,.06) 46%, transparent 74%);
  -webkit-mask-image: linear-gradient(180deg, transparent 0, #000 16px, #000 88%, transparent 100%);
          mask-image: linear-gradient(180deg, transparent 0, #000 16px, #000 88%, transparent 100%);
}
#rds-r1 .rds-wpod-row { display: grid; grid-template-columns: 1fr 1.15fr 1fr; align-items: end; gap: 8px; max-width: 720px; margin: 0 auto; }
#rds-r1 .rds-wpod-spot { position: relative; display: flex; flex-direction: column; align-items: center; text-align: center; }
/* winner gets a soft gold halo behind the figure */
#rds-r1 .rds-wpod-c::before { content: ""; position: absolute; top: 18px; left: 50%; width: 240px; height: 240px; transform: translateX(-50%);
  background: radial-gradient(circle, rgba(200,162,39,.30), transparent 66%); pointer-events: none; z-index: 0; }
#rds-r1 .rds-wpod-crown { width: 52px; margin: 0 auto 4px; position: relative; z-index: 2; animation: rds-crown-glow 2.6s ease-in-out infinite; }
#rds-r1 .rds-wpod-crown svg { display: block; width: 100%; height: auto; }
@keyframes rds-crown-glow {
  0%, 100% { filter: drop-shadow(0 0 3px rgba(231,194,74,.45)) drop-shadow(0 2px 5px rgba(0,0,0,.55)); }
  50%      { filter: drop-shadow(0 0 11px rgba(255,228,130,.95)) drop-shadow(0 0 22px rgba(231,194,74,.6)) drop-shadow(0 2px 5px rgba(0,0,0,.55)); }
}
@media (prefers-reduced-motion: reduce) { #rds-r1 .rds-wpod-crown { animation: none; filter: drop-shadow(0 0 7px rgba(231,194,74,.6)); } }
/* figwrap = invisible clip (no box/border/bg) → figure reads as a cut-out, waist-up framing */
#rds-r1 .rds-wpod-figwrap { position: relative; z-index: 1; overflow: hidden; }
#rds-r1 .rds-wpod-s .rds-wpod-figwrap, #rds-r1 .rds-wpod-b .rds-wpod-figwrap { width: 150px; height: 172px; }
#rds-r1 .rds-wpod-c .rds-wpod-figwrap { width: 188px; height: 214px; }
#rds-r1 .rds-wpod-fig { width: 100%; height: 100%; object-fit: cover; object-position: center top; display: block; filter: drop-shadow(0 12px 18px rgba(0,0,0,.5)); }
/* soft elliptical floor shadow so figures don't float */
#rds-r1 .rds-wpod-figwrap::after { content: ""; position: absolute; left: 50%; bottom: 0; width: 80%; height: 16px; transform: translateX(-50%);
  background: radial-gradient(ellipse at center, rgba(0,0,0,.55), transparent 70%); }
#rds-r1 .rds-wpod-coin { width: 44px; height: 44px; margin-top: -20px; position: relative; z-index: 3; filter: drop-shadow(0 3px 6px rgba(0,0,0,.6)); }
#rds-r1 .rds-wpod-c .rds-wpod-coin { width: 56px; height: 56px; margin-top: -26px; }
#rds-r1 .rds-wpod-medal { margin-top: 7px; font-size: 11px; font-weight: 800; letter-spacing: .2em; text-transform: uppercase; }
#rds-r1 .rds-wpod-c .rds-wpod-medal { color: var(--gold,#c8a227); font-size: 12px; }
#rds-r1 .rds-wpod-s .rds-wpod-medal { color: #cfd3d8; }
#rds-r1 .rds-wpod-b .rds-wpod-medal { color: #d08a4e; }
#rds-r1 .rds-wpod-nm { font-weight: 800; color: #fff; line-height: 1.08; margin-top: 5px; font-size: 17px; }
#rds-r1 .rds-wpod-c .rds-wpod-nm { font-size: 22px; }
#rds-r1 .rds-wpod-sub { font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: var(--text-dim,#a89880); margin-top: 2px; }
#rds-r1 .rds-wpod-who { display: flex; align-items: center; justify-content: center; gap: 8px; margin-top: 7px; }
#rds-r1 .rds-wpod-flag { width: 28px; height: auto; border-radius: 3px; box-shadow: 0 0 0 1px rgba(255,255,255,.18),0 2px 6px rgba(0,0,0,.5); }
#rds-r1 .rds-wpod-c .rds-wpod-flag { width: 33px; }
#rds-r1 .rds-wpod-car { font-size: 13px; font-weight: 700; color: var(--gold-soft,#d4b347); font-variant-numeric: tabular-nums; }
#rds-r1 .rds-wpod-team { font-size: 11px; color: var(--gold-soft,#d4b347); opacity: .82; margin-top: 6px; max-width: 190px; }
#rds-r1 .rds-wpod-pts { margin-top: 9px; font-weight: 800; color: var(--gold,#c8a227); font-variant-numeric: tabular-nums; line-height: 1; font-size: 26px; }
#rds-r1 .rds-wpod-c .rds-wpod-pts { font-size: 34px; }
#rds-r1 .rds-wpod-pts small { display: block; font-size: 9px; letter-spacing: .16em; color: var(--text-dim,#a89880); text-transform: uppercase; font-weight: 600; margin-top: 4px; }
@media (max-width: 720px) {
  #rds-r1 .rds-wpod-row { grid-template-columns: 1fr; gap: 10px; max-width: 440px; }
  #rds-r1 .rds-wpod-spot { flex-direction: row; text-align: left; align-items: center; gap: 14px; background: var(--bg-2,#1a130a); border: 1px solid var(--gold-dim,rgba(200,162,39,.3)); border-radius: 16px; padding: 10px 16px; }
  #rds-r1 .rds-wpod-c { order: -1; border-color: var(--gold,#c8a227); }
  #rds-r1 .rds-wpod-c::before { display: none; }
  #rds-r1 .rds-wpod::before { display: none; }
  /* figure sits at padding-left 16 + 72/2 = 52px → centre the crown over the head */
  #rds-r1 .rds-wpod-crown { position: absolute; margin: 0; width: 38px; left: 52px; top: 2px; transform: translateX(-50%); z-index: 4; }
  #rds-r1 .rds-wpod-figwrap, #rds-r1 .rds-wpod-c .rds-wpod-figwrap, #rds-r1 .rds-wpod-s .rds-wpod-figwrap, #rds-r1 .rds-wpod-b .rds-wpod-figwrap { width: 72px; height: 84px; flex: 0 0 auto; }
  #rds-r1 .rds-wpod-coin, #rds-r1 .rds-wpod-c .rds-wpod-coin { width: 30px; height: 30px; margin: 0; position: absolute; left: 66px; bottom: 8px; }
  #rds-r1 .rds-wpod-info { flex: 1; }
  #rds-r1 .rds-wpod-medal, #rds-r1 .rds-wpod-c .rds-wpod-medal { margin-top: 0; }
  #rds-r1 .rds-wpod-team { max-width: none; }
  #rds-r1 .rds-wpod-pts, #rds-r1 .rds-wpod-c .rds-wpod-pts { font-size: 22px; margin-top: 3px; }
  #rds-r1 .rds-wpod-who { justify-content: flex-start; }
}
/* ===== Stage tables: avatars + achievement badges + team chips + entry cards ===== */
#rds-r1 .rds-avatar { position: relative; width: 40px; height: 40px; flex: 0 0 auto; }
#rds-r1 .rds-avatar-img { width: 40px; height: 40px; border-radius: 50%; display: block; object-fit: cover; object-position: center top; background: radial-gradient(circle at 50% 32%, #2c2114, #151007); box-shadow: inset 0 0 0 1px var(--gold-dim, rgba(200,162,39,.35)); }
#rds-r1 .rds-rank-gold .rds-avatar-img { box-shadow: inset 0 0 0 1.5px var(--gold,#c8a227); }
#rds-r1 .rds-rank-silver .rds-avatar-img { box-shadow: inset 0 0 0 1.5px #cfd3d8; }
#rds-r1 .rds-rank-bronze .rds-avatar-img { box-shadow: inset 0 0 0 1.5px #d08a4e; }
#rds-r1 .rds-avatar-flag { position: absolute; right: -3px; bottom: -3px; width: 17px; height: 17px; border-radius: 50%; object-fit: cover; box-shadow: 0 0 0 2px var(--bg-2,#1a130a); }
#rds-r1 .rds-avatar-empty .rds-avatar-img { visibility: hidden; }
#rds-r1 .rds-ach-row { display: inline-flex; align-items: center; gap: 6px; margin-left: auto; padding-left: 12px; flex: 0 0 auto; }
#rds-r1 .rds-ach { width: 42px; height: 42px; display: block; filter: drop-shadow(0 2px 5px rgba(0,0,0,.55)); }
#rds-r1 .rds-ach-row[data-n="2"] .rds-ach { width: 36px; height: 36px; }
#rds-r1 .rds-ach-row[data-n="3"] .rds-ach { width: 30px; height: 30px; }
#rds-r1 .rds-ach-inline { width: 18px; height: 18px; vertical-align: -4px; margin-left: 7px; }
/* TOP-8 collapse on the personal stage table */
#rds-r1 #sec-standings tbody[data-bind="stage-standings"] tr:nth-child(n+9) { display: none; }
#rds-r1 #sec-standings.show-all tbody[data-bind="stage-standings"] tr:nth-child(n+9) { display: table-row; }
#rds-r1 .rds-expand-btn { display: block; margin: 14px auto 0; padding: 9px 22px; border-radius: 999px; cursor: pointer;
  background: rgba(200,162,39,.10); border: 1px solid var(--gold-dim, rgba(200,162,39,.35)); color: var(--gold-soft,#d4b347);
  font: 600 12px/1 Gilroy, sans-serif; letter-spacing: .1em; transition: background .15s, border-color .15s; }
#rds-r1 .rds-expand-btn:hover { background: rgba(200,162,39,.18); border-color: var(--gold,#c8a227); }
/* team chips (stage team standings) — horizontal row, larger photos */
#rds-r1 .rds-team-name { font-size: 15px; font-weight: 800; color: var(--text,#f5efe2); line-height: 1.2; flex: 0 1 auto; min-width: 90px; }
#rds-r1 .rds-team-mems { display: flex; flex-wrap: wrap; gap: 8px; margin-left: auto; justify-content: flex-end; }
#rds-r1 .rds-tmem { position: relative; width: 42px; height: 42px; flex: 0 0 auto; }
#rds-r1 .rds-tmem img { width: 42px; height: 42px; border-radius: 50%; object-fit: cover; object-position: center top; background: radial-gradient(circle at 50% 32%, #2c2114, #151007); display: block; }
#rds-r1 .rds-tmem-on img { box-shadow: inset 0 0 0 1.5px var(--gold,#c8a227); }
#rds-r1 .rds-tmem-off img { opacity: .42; filter: grayscale(.5); }
#rds-r1 .rds-tmem-empty img { visibility: hidden; }
/* entry list — enriched cards */
#rds-r1 .rds-entry-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 14px; }
#rds-r1 .rds-entry-card { background: var(--bg-2,#1a130a); border: 1px solid var(--gold-dim, rgba(200,162,39,.18)); border-radius: 14px; padding: 16px; transition: border-color .2s, transform .2s; }
#rds-r1 .rds-entry-card:hover { border-color: var(--gold,#c8a227); transform: translateY(-2px); }
#rds-r1 .rds-entry-top { display: flex; align-items: center; justify-content: space-between; }
#rds-r1 .rds-entry-av { position: relative; width: 64px; height: 64px; flex: 0 0 auto; }
#rds-r1 .rds-entry-img { width: 64px; height: 64px; border-radius: 50%; object-fit: cover; object-position: center top; background: radial-gradient(circle at 50% 30%, #2c2114, #151007); box-shadow: inset 0 0 0 1px var(--gold-dim, rgba(200,162,39,.35)); }
#rds-r1 .rds-entry-empty .rds-entry-img { visibility: hidden; }
#rds-r1 .rds-entry-flag { position: absolute; right: -2px; bottom: -2px; width: 22px; height: 22px; border-radius: 50%; object-fit: cover; box-shadow: 0 0 0 2px var(--bg-2,#1a130a); }
#rds-r1 .rds-entry-num { font-size: 22px; font-weight: 800; color: var(--gold,#c8a227); font-variant-numeric: tabular-nums; }
#rds-r1 .rds-entry-name { margin-top: 12px; line-height: 1.2; }
#rds-r1 .rds-entry-name b { display: block; font-size: 15px; font-weight: 800; color: var(--text,#f5efe2); }
#rds-r1 .rds-entry-name span { display: block; font-size: 11px; letter-spacing: .04em; text-transform: uppercase; color: var(--text-dim,#a89880); margin-top: 2px; }
#rds-r1 .rds-entry-team { font-size: 11px; color: var(--gold-soft,#d4b347); margin-top: 8px; }
#rds-r1 .rds-entry-spec { font-size: 11px; color: var(--text-dim,#a89880); margin-top: 8px; padding-top: 8px; border-top: 1px solid rgba(200,162,39,.1); }
#rds-r1 .rds-entry-hp { color: var(--gold-soft,#d4b347); font-weight: 700; }
@media (max-width: 720px) {
  #rds-r1 .rds-ach { width: 36px; height: 36px; }
  #rds-r1 .rds-ach-row[data-n="2"] .rds-ach { width: 31px; height: 31px; }
  #rds-r1 .rds-ach-row[data-n="3"] .rds-ach { width: 26px; height: 26px; }
  #rds-r1 .rds-entry-grid { grid-template-columns: 1fr 1fr; gap: 10px; }
  /* roster avatars: fixed 2-col grid so every team looks the same regardless of
     team-name length (long names used to squeeze the flex row down to 1 column). */
  #rds-r1 .rds-team-mems { display: grid; grid-template-columns: repeat(2, 42px); gap: 8px; justify-content: end; }
}
