/* GALLOP — Mission Control visual identity — see docs/STYLEGUIDE.md
   Midnight Navy #071A2F · Racing Green #0B3D2E · Ivory #F6F1E7
   Champagne Gold #C8A45D · Charcoal #151515 · Oxblood #5A1E2B            */

:root {
  --navy:#071A2F; --green:#0B3D2E; --ivory:#F6F1E7; --gold:#C8A45D;
  --charcoal:#151515; --oxblood:#5A1E2B;
  --navy-2:#0c2944; --gold-soft:#e6d3a8; --ink:#1d2733; --bronze:#9a6b1f;
  --line:rgba(200,164,93,.30); --line-soft:rgba(21,21,21,.10);
  --paper:#fbf8f1; --muted:#6b7280;
  --shadow:0 10px 30px -12px rgba(7,26,47,.35);
  --serif:"Iowan Old Style","Palatino Linotype",Palatino,Georgia,"Times New Roman",serif;
  --sans:-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;
}

* { box-sizing:border-box; margin:0; padding:0; }
html,body { height:100%; }
body {
  font-family:var(--sans); color:var(--ink); background:var(--ivory);
  -webkit-font-smoothing:antialiased; line-height:1.5;
}
a { color:inherit; text-decoration:none; }
.mono { font-variant-numeric:tabular-nums; font-feature-settings:"tnum"; }

/* ---------------------------------------------------------------- header */
header.topbar {
  background:linear-gradient(125deg,var(--navy) 0%,#0a2034 55%,var(--green) 160%);
  color:var(--ivory); border-bottom:2px solid var(--gold);
  padding:18px 28px; display:flex; align-items:center; gap:26px;
  position:sticky; top:0; z-index:20;
}
.brand { display:flex; align-items:baseline; gap:14px; }
.brand .mark {
  font-family:var(--serif); font-size:30px; letter-spacing:.18em; font-weight:700;
  color:var(--gold); text-transform:uppercase; line-height:1;
}
.brand .tag { font-size:11.5px; letter-spacing:.22em; text-transform:uppercase;
  color:var(--gold-soft); opacity:.85; }
.topbar .spacer { flex:1; }
.statefilter { display:flex; flex-wrap:wrap; gap:6px; row-gap:6px; justify-content:flex-end; }
/* NZ is a different country from the AU states — set it off with a leading divider. */
.statefilter button.intl { margin-left:10px; position:relative; }
.statefilter button.intl::before { content:""; position:absolute; left:-6px; top:50%;
  transform:translateY(-50%); width:1px; height:16px; background:var(--line); }
.statefilter button {
  font:600 11px/1 var(--sans); letter-spacing:.1em; text-transform:uppercase;
  color:var(--gold-soft); background:transparent; border:1px solid var(--line);
  padding:8px 10px; border-radius:999px; cursor:pointer; transition:.15s;
}
.statefilter button.on { background:var(--gold); color:var(--navy); border-color:var(--gold); }
/* Overview time-window toggle — live leaderboards from TODAY back to all-time. */
.winfilter { display:flex; flex-wrap:wrap; gap:6px; margin:2px 0 16px; }
.winfilter button {
  font:600 11px/1 var(--sans); letter-spacing:.1em; text-transform:uppercase;
  color:var(--gold-soft); background:transparent; border:1px solid var(--line);
  padding:8px 14px; border-radius:999px; cursor:pointer; transition:.15s;
}
.winfilter button:hover { border-color:var(--gold-soft); }
.winfilter button.on { background:var(--gold); color:var(--navy); border-color:var(--gold); }
.winfilter.loading { opacity:.55; pointer-events:none; }
#search {
  background:rgba(255,255,255,.06); border:1px solid var(--line); color:var(--ivory);
  padding:9px 14px; border-radius:999px; width:230px; font-size:13px; outline:none;
}
#search::placeholder { color:rgba(230,211,168,.55); }

/* live status — honest freshness pill (synced time + corpus recency) */
.livestatus { display:flex; align-items:center; gap:8px; cursor:default;
  padding:6px 12px; border:1px solid var(--line); border-radius:999px;
  background:rgba(255,255,255,.04); white-space:nowrap; }
.livestatus .pulse { width:8px; height:8px; border-radius:50%; flex:none;
  background:#3fbf7f; box-shadow:0 0 0 0 rgba(63,191,127,.6);
  animation:pulse 2s ease-out infinite; }
@keyframes pulse {
  0%   { box-shadow:0 0 0 0 rgba(63,191,127,.55); }
  70%  { box-shadow:0 0 0 7px rgba(63,191,127,0); }
  100% { box-shadow:0 0 0 0 rgba(63,191,127,0); }
}
.livestatus .lstext { font:600 11px/1 var(--sans); letter-spacing:.06em;
  color:var(--gold-soft); }
.livestatus .lstext b { color:var(--ivory); font-weight:700; }
/* engine unreachable — say so plainly rather than show stale-as-fresh */
.livestatus.stale { border-color:rgba(200,120,60,.5); }
.livestatus.stale .pulse { background:#d8843c; animation:none;
  box-shadow:0 0 0 3px rgba(216,132,60,.18); }
.livestatus.stale .lstext { color:#e6b483; }
@media (prefers-reduced-motion:reduce) { .livestatus .pulse { animation:none; } }
@media (max-width:1100px) { .livestatus { display:none; } }
/* DEV-ONLY: how current gallop.run (prod) is vs this local build. Only rendered on the local
   board (peer-comparing); never shown to end users on prod. */
.prodparity { display:inline-flex; align-items:center; cursor:default; white-space:nowrap;
  padding:6px 11px; border-radius:999px; border:1px solid var(--line);
  font:700 11px/1 var(--sans); letter-spacing:.05em; }
.prodparity.ok      { color:#8ff0c0; border-color:rgba(63,191,127,.5);  background:rgba(63,191,127,.10); }
.prodparity.warn    { color:#e6b483; border-color:rgba(216,132,60,.5);  background:rgba(216,132,60,.10); }
.prodparity.unknown { color:var(--muted); border-color:var(--line);     background:rgba(255,255,255,.04); }
@media (max-width:1100px) { .prodparity { display:none; } }

/* a KPI number that just updated on a live sync — flashes champagne gold */
.kpi .n.tick { animation:tick 1.4s ease-out; }
@keyframes tick {
  0%   { color:var(--gold); transform:translateY(-2px) scale(1.06); text-shadow:0 0 14px rgba(200,164,93,.7); }
  100% { color:inherit; transform:none; text-shadow:none; }
}
@media (prefers-reduced-motion:reduce) { .kpi .n.tick { animation:none; } }

/* ---------------------------------------------------------------- shell */
.shell { display:grid; grid-template-columns:212px 1fr; min-height:calc(100vh - 71px); }
nav.side { background:var(--paper); border-right:1px solid var(--line-soft); padding:22px 14px;
  display:flex; flex-direction:column; }
nav.side .navitem {
  display:flex; align-items:center; gap:10px; padding:11px 14px; border-radius:10px;
  font-weight:600; font-size:13.5px; color:var(--ink); cursor:pointer; margin-bottom:3px;
  letter-spacing:.01em;
}
nav.side .navitem:hover { background:rgba(11,61,46,.06); }
nav.side .navitem.on { background:var(--navy); color:var(--ivory); }
nav.side .navitem.on .dot { background:var(--gold); }
nav.side .dot { width:7px; height:7px; border-radius:50%; background:var(--green); }
/* The personal cluster — My Stable, My Races, My Store — share one "popped" gold capsule so
   they read as one group (your own gallopers, your plans, your store), set apart from the
   intelligence view tabs above. Defined after .navitem so the capsule wins on equal specificity. */
nav.side .nav-cap { display:flex; align-items:center; justify-content:center; gap:8px;
  margin:6px 4px 5px; padding:11px 14px; border-radius:10px; background:var(--gold);
  color:var(--navy); font-weight:800; font-size:12.5px; letter-spacing:.08em;
  text-transform:uppercase; text-decoration:none; cursor:pointer;
  box-shadow:0 6px 16px -6px rgba(200,164,93,.75); transition:.15s; }
nav.side .nav-cap .dot { width:7px; height:7px; border-radius:2px; background:var(--navy); }
nav.side .nav-cap:hover { background:var(--gold-soft);
  box-shadow:0 9px 22px -6px rgba(200,164,93,.9); transform:translateY(-1px); }
/* the active personal page (My Stable / My Races) — invert to navy so you know which you're on */
nav.side .nav-cap.on { background:var(--navy); color:var(--gold);
  box-shadow:0 6px 16px -8px rgba(11,61,46,.6); }
nav.side .nav-cap.on:hover { background:var(--navy); transform:none; }
nav.side .nav-cap.on .dot { background:var(--gold); }
nav.side .sectlabel { font-size:10px; letter-spacing:.2em; text-transform:uppercase;
  color:var(--muted); margin:20px 14px 8px; }
.nav-admin-link { display:flex; align-items:center; gap:10px; padding:11px 14px;
  border-radius:10px; font-weight:600; font-size:13.5px; color:var(--ink); cursor:pointer;
  margin-bottom:3px; letter-spacing:.01em; text-decoration:none; }
.nav-admin-link:hover { background:rgba(11,61,46,.06); }
.nav-user-foot { margin-top:auto; padding:16px 14px 6px; border-top:1px solid var(--line-soft);
  display:flex; flex-direction:column; gap:8px; }
.nav-user-email { font-size:11.5px; color:var(--muted); overflow:hidden;
  text-overflow:ellipsis; white-space:nowrap; }
.nav-logout-btn { width:100%; padding:8px 12px; border:1px solid var(--line-soft);
  border-radius:8px; background:#fff; font-size:12px; font-weight:600; color:var(--ink);
  cursor:pointer; text-align:center; transition:.15s; letter-spacing:.02em; }
.nav-logout-btn:hover { border-color:var(--oxblood); color:var(--oxblood); }

main { padding:26px 30px 60px; overflow:auto; }
.view { display:none; } .view.on { display:block; animation:fade .25s ease; }
@keyframes fade { from{opacity:0;transform:translateY(4px)} to{opacity:1;transform:none} }

h2.viewtitle { font-family:var(--serif); font-size:24px; font-weight:700; color:var(--navy);
  margin-bottom:3px; letter-spacing:.01em; }
.viewsub { color:var(--muted); font-size:13px; margin-bottom:22px; }

/* ---------------------------------------------------------------- cards */
.card { background:#fff; border:1px solid var(--line-soft); border-radius:14px;
  box-shadow:var(--shadow); overflow:hidden; }
.card .hd { padding:14px 18px; border-bottom:1px solid var(--line-soft);
  display:flex; align-items:center; gap:10px; }
.card .hd .ttl { font-family:var(--serif); font-size:15px; color:var(--navy); font-weight:700;
  letter-spacing:.02em; }
.card .hd .gold-rule { flex:1; height:1px; background:linear-gradient(90deg,var(--line),transparent); }
.card .bd { padding:16px 18px; }

/* KPI row */
/* The record-so-far tiles. They sit at the FOOT of Leaderboards — a compact summary of the
   window with a trend on the frame before, not a hero row stealing the top of the page. */
.kpis { display:grid; grid-template-columns:repeat(5,1fr); gap:9px; margin:24px 0 4px; }
.kpi { background:linear-gradient(160deg,var(--navy),#0a2438); color:var(--ivory);
  border-radius:11px; padding:11px 13px; border:1px solid var(--line); position:relative; }
.kpi.green { background:linear-gradient(160deg,var(--green),#0e4a38); }
.kpi.blood { background:linear-gradient(160deg,var(--oxblood),#3f1620); }
.kpi-hd { display:flex; align-items:flex-start; justify-content:space-between; gap:6px; }
.kpi .n { font-family:var(--serif); font-size:21px; font-weight:700; color:#fff; line-height:1;
  font-variant-numeric:tabular-nums; }
.kpi.gold-n .n { color:var(--gold); }
.kpi .l { font-size:9px; letter-spacing:.13em; text-transform:uppercase;
  color:var(--gold-soft); margin-top:6px; line-height:1.35; }
/* trend chip — green up / red down / muted flat, vs the equal-length window before. A dark
   chip so it reads on both the navy and green tiles. Semantic status, not a brand accent. */
.kpi-tr { flex:0 0 auto; margin-top:1px; font:800 10px/1 var(--sans); font-variant-numeric:tabular-nums;
  letter-spacing:.02em; display:inline-flex; align-items:center; gap:2px; padding:3px 6px;
  border-radius:6px; background:rgba(4,16,29,.5); white-space:nowrap; }
.kpi-tr.up { color:#4fd68f; }
.kpi-tr.down { color:#f0908a; }
.kpi-tr.flat { color:var(--gold-soft); opacity:.7; }
/* tiny legend above the strip — names the frame the arrows compare against ("vs last week") */
.kpis-cap { display:flex; align-items:center; justify-content:flex-end; gap:5px;
  margin:24px 0 7px; font:700 9.5px/1 var(--sans); letter-spacing:.12em; text-transform:uppercase;
  color:var(--muted); }
.kpis-cap:empty { display:none; }
.kpis-cap:not(:empty) + .kpis { margin-top:0; }
.kpis-cap .kc-a { font-size:9px; line-height:1; }
.kpis-cap .kc-a.up { color:#4fd68f; }
.kpis-cap .kc-a.dn { color:#f0908a; margin-right:3px; }

.grid3 { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.grid2 { display:grid; grid-template-columns:1fr 1.55fr; gap:20px; align-items:start; }

/* leaderboards — premium top-5 boards, built to read like a shareable card */
.lb .row { display:flex; align-items:center; gap:14px; padding:13px 6px;
  border-bottom:1px solid var(--line-soft); cursor:pointer; transition:background .15s; }
.lb .row:last-child { border-bottom:0; }
.lb .row:hover { background:rgba(200,164,93,.07); }
/* the leader wears a quiet champagne wash + gold spine — first among equals, never a tip */
.lb .row:first-child { background:linear-gradient(90deg,rgba(200,164,93,.09),transparent 70%);
  box-shadow:inset 3px 0 0 var(--gold); }
.lb .row:first-child:hover { background:linear-gradient(90deg,rgba(200,164,93,.14),transparent 70%); }
.lb .rank { width:22px; flex:none; text-align:center; font-family:var(--serif); color:var(--gold);
  font-weight:700; font-size:15.5px; font-variant-numeric:tabular-nums; }
/* the entity block owns the row — name on top at full width (never truncated), muted line beneath */
.lb .ent { flex:1; min-width:0; display:flex; flex-direction:column; gap:2px; }
.lb .nm-line { display:flex; align-items:center; gap:6px; min-width:0; }
.lb .nm { font-weight:600; font-size:14px; color:var(--ink); min-width:0;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.lb .val { font-variant-numeric:tabular-nums; font-weight:700; color:var(--navy);
  white-space:nowrap; flex:none; font-size:15px; }
.lb .val.small { font-size:12px; color:var(--muted); font-weight:600; }

/* ---- live SPEED dashboard (the landing page) ---- */
/* the day band — the live tone, named honestly (latest CLOCKED day) */
.spd-dayhead { margin-bottom:18px; padding:11px 16px; border-radius:11px;
  background:var(--paper); border:1px solid var(--line-soft); font-size:14px; color:var(--ink); }
.spd-dayhead.live { background:linear-gradient(120deg,rgba(11,61,46,.10),rgba(200,164,93,.10));
  border-color:var(--line); }
.spd-dayhead b { color:var(--navy); font-family:var(--serif); font-size:16px; }
.spd-dayhead .rd-live { color:var(--green); margin-right:6px; animation:pulse 2s ease-out infinite; }
.spd-dayhead .spd-daysub { display:block; margin-top:3px; font-size:12px; color:var(--muted); }
/* last-updated trust stamp — a quiet, honest freshness signal on the landing page */
.spd-dayhead .spd-updated { display:inline-block; margin-top:7px; font:600 10.5px/1 var(--sans);
  letter-spacing:.06em; text-transform:uppercase; color:var(--green);
  background:rgba(11,61,46,.08); border:1px solid var(--line); border-radius:999px;
  padding:5px 10px; }
/* board subtitle (sits in the card header beside the title) */
.card .hd .spd-sub { font:600 10px/1 var(--sans); letter-spacing:.08em; text-transform:uppercase;
  color:var(--muted); }
/* the muted descriptor now sits as the row's second line, so the name keeps the full width */
.lb .ent .spd-meta { font-size:11px; color:var(--muted); font-weight:600;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis; margin:0; padding:0;
  letter-spacing:.01em; }
/* a board with nothing clocked is not rendered at all — this is the one line shown when
   EVERY board came back empty, and it spans the grid rather than sitting as a lone box */
.lb-none { grid-column:1 / -1; }
/* TOP EXPERTS board — the expert layer on the leaderboards grid. Wears the layer's
   steel-blue (source-attributed external opinion), never the speed boards' gold. */
.card .hd .steel-rule { flex:1; height:1px; background:linear-gradient(90deg, rgba(46,95,127,.45), transparent); }
.lb-experts .lb .rank { color:#4a7d9f; }
.lb-experts .lb .row:hover { background:rgba(46,95,127,.07); }
.lb-experts .lb .val.lb-ex-val { color:#2e5f7f; }
.lb-experts .lb-ex-val .ex-up, .lb-experts .lb-ex-val .ex-dn { font-size:11px; font-weight:700; margin-left:2px; }
.lb-experts .lb-ex-val .lb-ex-strike { font-size:11px; font-weight:600; color:var(--muted); margin-left:3px; }
/* a track on the card whose races have not run yet — honest "to come", not a faked speed */
.lb .val.spd-tocome { color:var(--muted); font-weight:600; font-size:11px; letter-spacing:.06em;
  text-transform:uppercase; }

/* ---------------------------------------------------------------- horse */
/* compact horse switcher — replaces the always-on stable list so the whole
   screen celebrates the horse on show */
.horse-switch { margin-bottom:20px; }
.hs-eyebrow { display:block; font-size:11px; letter-spacing:.2em; text-transform:uppercase;
  color:var(--muted); margin-bottom:10px; }
.hs-controls { display:flex; align-items:center; gap:10px; }
.hs-nav { width:36px; height:36px; flex:none; border-radius:10px; border:1px solid var(--line-soft);
  background:#fff; font-size:19px; line-height:1; color:var(--navy); cursor:pointer; transition:.15s; }
.hs-nav:hover { background:var(--navy); color:var(--ivory); border-color:var(--navy); }
.hs-search { position:relative; flex:1; max-width:380px; }
.hs-search input { width:100%; padding:10px 38px 10px 14px; border-radius:10px; border:1px solid var(--line);
  background:#fff; font-size:14px; color:var(--ink); outline:none; cursor:pointer; }
.hs-search input:focus { border-color:var(--gold); cursor:text; }
.hs-caret { position:absolute; top:0; right:0; height:100%; width:34px; display:flex; align-items:center;
  justify-content:center; border:0; background:none; color:var(--muted); font-size:13px; cursor:pointer;
  border-radius:0 10px 10px 0; transition:.15s; }
.hs-caret:hover { color:var(--navy); }
.hs-search.open .hs-caret { color:var(--gold); transform:rotate(180deg); }
.hs-drop { position:absolute; top:calc(100% + 5px); left:0; right:0; background:#fff;
  border:1px solid var(--line-soft); border-radius:11px; box-shadow:var(--shadow);
  max-height:360px; overflow:auto; z-index:30; display:none; padding:5px; }
.hs-drop.on { display:block; }
.hs-drop .hrow { display:flex; align-items:center; gap:10px; padding:9px 11px; border-radius:8px; cursor:pointer; }
.hs-drop .hrow:hover, .hs-drop .hrow.on { background:rgba(11,61,46,.08); }
.hs-drop .hrow .nm { flex:1; font-weight:600; font-size:13.5px; }
.hs-drop .hrow .meta { font-size:11px; color:var(--muted); }
.hs-count { font-size:12px; color:var(--muted); white-space:nowrap; font-variant-numeric:tabular-nums; }

/* the speed celebration band — one huge gold number, the horse's top pace */
.speedhero { display:flex; align-items:center; gap:30px; flex-wrap:wrap;
  background:linear-gradient(150deg,var(--navy),#0a2438 70%,var(--green));
  border:1px solid var(--line); border-radius:14px; padding:22px 28px; margin:18px 0 6px;
  color:var(--ivory); }
.speedhero.held { background:linear-gradient(150deg,var(--oxblood),#3f1620); }
.speedhero .sh-big { font-family:var(--serif); font-size:64px; line-height:.85; font-weight:700;
  color:var(--gold); font-variant-numeric:tabular-nums; }
.speedhero.held .sh-big { font-size:34px; color:var(--ivory); }
.speedhero .sh-big .sh-unit { font-size:22px; margin-left:9px; color:var(--gold-soft); letter-spacing:.04em; }
.speedhero .sh-cap { margin-top:11px; font-size:11.5px; letter-spacing:.13em; text-transform:uppercase;
  color:var(--gold-soft); }
.speedhero .sh-cap b { color:var(--ivory); font-weight:700; }
.speedhero .sh-sub { display:flex; gap:28px; margin-left:auto; }
.speedhero .sh-sub .stat { text-align:center; }
.speedhero .sh-sub .stat .n { font-family:var(--serif); font-size:26px; font-weight:700; color:var(--ivory);
  font-variant-numeric:tabular-nums; }
.speedhero .sh-sub .stat .l { font-size:9.5px; letter-spacing:.13em; text-transform:uppercase;
  color:var(--gold-soft); margin-top:5px; }
@media (max-width:760px){ .speedhero .sh-sub { margin-left:0; gap:20px; } .speedhero .sh-big { font-size:48px; } }

.horsehead { display:flex; align-items:flex-start; gap:18px; }
.horsehead .nameblock { flex:1; }

/* jockey silks / owner colours — a colour identity for every horse. The wrapper
   layers a generated silk (always present) under the real RA silk (when we have
   it); a 404 removes the image and reveals the generated colours beneath. */
.silk { position:relative; display:inline-block; overflow:hidden; flex:none;
  border:1px solid var(--gold); border-radius:6px; vertical-align:middle;
  background:var(--ivory); box-shadow:0 1px 3px rgba(7,26,47,.09); }
.silk .silk-gen, .silk .silk-real { position:absolute; inset:0; width:100%; height:100%; display:block; }
/* small badges (lists, tables, leaderboards): zoom into the colourful torso of the
   figure so the real owner colours fill the gold-framed chip and read even at 18–26px
   — the pale head, hands and breeches fall outside. The large profile badge keeps the
   whole silk. Both are the real registered silk; the generated emblem only shows when
   none is on file. */
.silk .silk-real { object-fit:cover; transform:scale(1.9); transform-origin:center 52%; background:var(--ivory); }
.silk-lg .silk-real { object-fit:contain; transform:none; }
.silk-lg { width:54px; height:54px; box-shadow:0 1px 5px rgba(7,26,47,.12); }
.silk-sm { width:26px; height:26px; margin-right:8px; }
.silk-xs { width:22px; height:22px; }                    /* leaderboards / lists — relies on container gap */
.horsecell { display:inline-flex; align-items:center; }
.horsehead h3 { font-family:var(--serif); font-size:26px; color:var(--navy); font-weight:700; }
.acca-line { color:var(--ink); font-size:13px; margin-top:4px; }

.chip { display:inline-flex; align-items:center; gap:6px; font:700 10.5px/1 var(--sans);
  letter-spacing:.1em; text-transform:uppercase; padding:5px 10px; border-radius:999px; }
.chip.metro { background:rgba(11,61,46,.12); color:var(--green); }
.chip.country { background:rgba(90,30,43,.12); color:var(--oxblood); }
.chip.mixed { background:rgba(7,26,47,.10); color:var(--navy); }
/* run-shape signature chip — gold, the owned vocabulary */
.chip.shape { background:rgba(200,164,93,.18); color:#8a6d2f; border:1px solid rgba(200,164,93,.5); }

/* further-indices block, beneath the four-pillar bars */
.idxblock { margin-top:14px; padding-top:12px; border-top:1px dashed rgba(7,26,47,.14); }
.idxhd { font:700 9px/1 var(--sans); letter-spacing:.13em; text-transform:uppercase;
  color:var(--muted); margin-bottom:9px; }

/* per-run speed-read tags (shape · against-the-shape · first-up) */
.srtags { display:flex; flex-wrap:wrap; gap:6px; margin-bottom:11px; }
.srtag { font:700 10px/1 var(--sans); letter-spacing:.04em; padding:5px 9px; border-radius:999px;
  background:rgba(7,26,47,.07); color:var(--ink); }
.srtag.tag-credit { background:rgba(11,61,46,.13); color:var(--green); }   /* ran against the shape */
.srtag.tag-soft { background:rgba(90,30,43,.10); color:var(--oxblood); }    /* had the run of the race */

.accawrap { display:grid; grid-template-columns:230px 1fr; gap:24px; align-items:center; }
.bars .bar { margin-bottom:13px; }
.bars .bar .lab { display:flex; justify-content:space-between; font-size:12px; margin-bottom:5px; }
.bars .bar .lab b { color:var(--navy); letter-spacing:.04em; text-transform:uppercase; font-size:11px; }
.bars .bar .lab .g { color:var(--muted); font-weight:600; }
.bars .track { height:9px; background:rgba(21,21,21,.08); border-radius:6px; overflow:hidden; }
.bars .track > i { display:block; height:100%; border-radius:6px;
  background:linear-gradient(90deg,var(--green),var(--gold)); }
.bars .bar.held .track { background:repeating-linear-gradient(45deg,
  rgba(90,30,43,.13),rgba(90,30,43,.13) 5px,transparent 5px,transparent 10px); }
.bars .bar.held .lab .g { color:var(--oxblood); }

.recordrow { display:flex; gap:22px; margin:14px 0 4px; }
.recordrow .stat { text-align:center; }
.recordrow .stat .n { font-family:var(--serif); font-size:22px; color:var(--navy); font-weight:700; }
.recordrow .stat .l { font-size:10px; letter-spacing:.12em; text-transform:uppercase; color:var(--muted); }

/* run list / race table */
.runs-wrap { overflow-x:auto; -webkit-overflow-scrolling:touch; }
table.runs { width:100%; border-collapse:collapse; font-size:13px; }
table.runs td.div, table.runs th.div { padding-left:7px; padding-right:7px; white-space:nowrap; }
table.runs th { text-align:left; font-size:10px; letter-spacing:.13em; text-transform:uppercase;
  color:var(--muted); padding:9px 13px; border-bottom:1px solid var(--line-soft); }
table.runs td { padding:11px 13px; border-bottom:1px solid var(--line-soft);
  font-variant-numeric:tabular-nums; }
table.runs tr:hover td { background:rgba(200,164,93,.05); }
table.runs th.grp { text-align:center; letter-spacing:.22em; padding-bottom:4px; }
table.runs th.grp.race { color:var(--muted); }
table.runs th.grp.run { color:var(--gold); }
/* F1-telemetry section breaks — a hairline between column groups (identity | race | speed | merit) */
table.runs .sep, table.runs th.sep { border-left:1px solid var(--line); }
/* barrier-bias matrix: overall + per-condition columns, kept compact so 5+ columns fit a card */
table.runs.biasgrid th, table.runs.biasgrid td { padding:7px 9px; }
table.runs.biasgrid th.num, table.runs.biasgrid td.num { text-align:center; font-variant-numeric:tabular-nums; }
table.runs.biasgrid th { letter-spacing:.05em; }
/* cell tone: favoured (green) / against (oxblood) / no edge (muted); the best draw per
   column is popped gold — bold on a faint champagne wash so the eye lands on it */
table.runs.biasgrid td.pos-v { color:var(--green); font-weight:600; }
table.runs.biasgrid td.neg-v { color:var(--oxblood); }
table.runs.biasgrid td.zero-v { color:var(--muted); }
table.runs.biasgrid td.gold-v { color:#8a6d23; font-weight:700; background:rgba(200,164,93,.18); }
/* the single strongest draw across the whole track — ringed gold on a deeper wash */
table.runs.biasgrid td.gold-best { background:rgba(200,164,93,.32);
  outline:1.5px solid var(--gold); outline-offset:-3px; }
.pos { font-family:var(--serif); font-weight:700; color:var(--navy); }
.pos.win { color:var(--gold); }
.div { font-weight:700; } .div.pos-v { color:var(--green); } .div.neg-v { color:var(--oxblood); }
.div.zero-v { color:var(--muted); }

.st { font:700 10px/1 var(--sans); letter-spacing:.08em; text-transform:uppercase;
  padding:4px 9px; border-radius:6px; display:inline-block; }
.st.PEAK { background:var(--gold); color:var(--navy); }
.st.WON_SOFT { background:var(--green); color:var(--ivory); }
.st.BLINDER { background:transparent; color:var(--navy); border:1px solid var(--gold); }
.st.OUTCLASSED { background:rgba(21,21,21,.08); color:var(--charcoal); }
.st.UNDERPERF { background:var(--oxblood); color:var(--ivory); }
.st.WITHHELD { background:var(--oxblood); color:var(--ivory); opacity:.55; }

/* race + track */
.metarow { display:flex; gap:26px; flex-wrap:wrap; margin-bottom:6px; }
.metarow .m .l { font-size:10px; letter-spacing:.14em; text-transform:uppercase; color:var(--muted); }
.metarow .m .v { font-family:var(--serif); font-size:18px; color:var(--navy); font-weight:700; }
.pace { text-transform:capitalize; }

.selectline { display:flex; gap:10px; flex-wrap:wrap; margin-bottom:18px; align-items:center; }
.selectline select { padding:9px 12px; border-radius:9px; border:1px solid var(--line);
  background:#fff; font-size:13px; color:var(--ink); min-width:200px; }
/* Route bar — the in-app navigation signal that replaced the full-screen loader takeover.
   Fixed to the very top so it reads on any scroll position, and inert to pointer events so it
   can never sit between the user and a control. */
.routebar { position:fixed; inset:0 0 auto 0; height:2px; z-index:9999; pointer-events:none;
  background:transparent; }
.routebar.go::after { content:""; display:block; height:100%; width:100%;
  background:linear-gradient(90deg, transparent, var(--gold), transparent);
  transform:translateX(-100%); animation:routesweep .9s ease-in-out; }
@keyframes routesweep { to { transform:translateX(100%); } }
@media (prefers-reduced-motion:reduce) {
  /* no sweep — hold a steady hairline for the same beat, so the signal survives without motion */
  .routebar.go::after { animation:none; transform:none;
    background:linear-gradient(90deg, transparent, var(--gold), transparent); }
}

/* THE INTELLIGENCE LINK — a proven corpus finding, with THIS subject's number beside it, and
   the proven priors for a next start. Styled as evidence, not as a call. */
.il { margin:18px 0 6px; display:grid; gap:14px; }
.il-sec { padding:16px 18px 14px; border-radius:12px; background:var(--paper);
  border:1px solid var(--line-soft); border-left:2px solid var(--gold); }
.il-k { font:700 9.5px/1 var(--sans); letter-spacing:.2em; text-transform:uppercase;
  color:var(--bronze); margin-bottom:12px; }
.il-find { display:flex; gap:14px; align-items:flex-start; padding:10px 0;
  border-top:1px solid var(--line-soft); }
.il-find:first-of-type { border-top:none; padding-top:0; }
.il-stat { font-family:var(--serif); font-size:20px; font-weight:700; color:var(--navy);
  min-width:92px; font-variant-numeric:tabular-nums; line-height:1.15; }
.il-body { min-width:0; }
.il-claim { margin:0 0 6px; font-size:12.5px; line-height:1.55; color:var(--muted); }
.il-mine { margin:0; font-size:13.5px; line-height:1.6; color:var(--ink); }
.il-mine b, .il-rec b { color:var(--ink); }
.il-next-h { margin:0 0 10px; font-size:13.5px; font-weight:600; color:var(--ink); }
.il-rows { list-style:none; margin:0; padding:0; }
.il-rows li { display:flex; align-items:baseline; gap:12px; flex-wrap:wrap;
  padding:8px 0; border-top:1px solid var(--line-soft); }
.il-rows li:first-child { border-top:none; }
.il-cond { font-size:13px; color:var(--ink); }
.il-rec { margin-left:auto; font-size:12.5px; color:var(--muted); white-space:nowrap; }
.il-held { font-size:11px; letter-spacing:.06em; color:var(--oxblood); opacity:.72; }
.il-warn { margin:12px 0 0; font-size:11.5px; line-height:1.5; color:var(--muted); font-style:italic; }
.ct-rows { margin-top:12px; }
.ct-hint { display:block; font-size:11px; color:var(--muted); font-weight:400; }
@media (max-width:700px) {
  .il-find { flex-direction:column; gap:6px; }
  .il-stat { min-width:0; font-size:24px; }
  .il-rec { margin-left:0; }
}

/* SUBJECT-FIRST Race Analysis — the stable, then its runs by time and by condition. */
.subj { margin:18px 0 14px; }
.subj-hd { display:flex; align-items:baseline; gap:12px; flex-wrap:wrap; }
.subj-k { font:700 10px/1 var(--sans); letter-spacing:.2em; text-transform:uppercase; color:var(--bronze); }
.subj-sub { font-size:12.5px; color:var(--muted); }
.subj-list { display:flex; flex-wrap:wrap; gap:7px; margin-top:12px; }
.sj-chip { display:inline-flex; align-items:baseline; gap:7px; cursor:pointer;
  font:600 13px/1 var(--sans); color:var(--ink); background:#fff;
  border:1px solid var(--line); border-radius:999px; padding:9px 14px; }
.sj-chip:hover { border-color:var(--gold); }
.sj-chip.on { background:var(--navy); border-color:var(--navy); color:var(--ivory); }
.sj-chip:focus-visible { outline:2px solid var(--gold); outline-offset:2px; }
.sj-k { font:700 8.5px/1 var(--sans); letter-spacing:.14em; text-transform:uppercase; opacity:.62; }
.subj-body { margin-top:16px; }
.sj-loading { font-size:13px; color:var(--muted); padding:14px 2px; }
.sj-lenses { display:flex; flex-wrap:wrap; gap:6px; }
.sj-lens { font:600 12.5px/1 var(--sans); padding:9px 13px; border-radius:8px;
  border:1px solid var(--line); background:#fff; color:var(--ink); cursor:pointer; }
.sj-lens:hover { border-color:var(--gold); }
.sj-lens.on { background:var(--navy); border-color:var(--navy); color:var(--ivory); }
.sj-lens:focus-visible, .sj-cond select:focus-visible { outline:2px solid var(--gold); outline-offset:2px; }
.sj-conds { display:flex; flex-wrap:wrap; gap:10px; margin-top:11px; align-items:flex-end; }
.sj-cond { display:flex; flex-direction:column; gap:4px; }
.sj-cond span { font:700 9px/1 var(--sans); letter-spacing:.14em; text-transform:uppercase; color:var(--muted); }
.sj-cond select { padding:8px 10px; border-radius:8px; border:1px solid var(--line);
  background:#fff; color:var(--ink); font-size:13px; }
.sj-clear { align-self:flex-end; font:600 12px/1 var(--sans); color:var(--ink);
  background:none; border:1px solid var(--line); border-radius:8px; padding:9px 12px; cursor:pointer; }
.sj-read { display:flex; flex-wrap:wrap; gap:6px 16px; margin:14px 0 10px; font-size:12.5px; color:var(--muted); }
.sj-read b { color:var(--ink); }
.sj-ms { color:var(--racing-green, #0B3D2E); font-variant-numeric:tabular-nums; }
.sj-warn { color:var(--oxblood); }
.sj-tablewrap { overflow-x:auto; -webkit-overflow-scrolling:touch; }
.sj-table { width:100%; border-collapse:collapse; font-size:13px; }
.sj-table th { text-align:left; font:700 9.5px/1 var(--sans); letter-spacing:.12em;
  text-transform:uppercase; color:var(--muted); padding:0 10px 8px 0; white-space:nowrap; }
.sj-table td { padding:9px 10px 9px 0; border-top:1px solid var(--line-soft); vertical-align:top; }
.sj-table .sj-n { font-variant-numeric:tabular-nums; white-space:nowrap; }
.sj-table .sj-d { color:var(--muted); white-space:nowrap; }
.sj-table .sj-win { font-weight:700; color:var(--racing-green, #0B3D2E); }
.sj-table .sj-vs { color:var(--muted); white-space:nowrap; }
.sj-sub { display:block; font-size:11.5px; color:var(--muted); }
.sj-held { font-size:10px; letter-spacing:.1em; color:var(--oxblood); opacity:.62; }
.sj-empty { color:var(--muted); padding:16px 0; }
.sj-foot { margin-top:12px; font-size:11.5px; color:var(--muted); font-style:italic; }
.race-oneoff { margin-top:26px; border-top:1px solid var(--line-soft); padding-top:14px; }
.race-oneoff > summary { cursor:pointer; font:600 12.5px/1 var(--sans); color:var(--muted);
  padding:8px 0; list-style:none; }
.race-oneoff > summary::-webkit-details-marker { display:none; }
.race-oneoff > summary::before { content:"▸ "; color:var(--gold); }
.race-oneoff[open] > summary::before { content:"▾ "; }
#view-race.race-locked .subj, #view-race.race-locked .race-oneoff { display:none; }
@media (max-width:700px) {
  /* A stable of 18 pushed the analysis clean off the screen. Cap the picker at roughly three
     rows and scroll it VERTICALLY — the subject list is a way in, not the answer, and it must
     not cost the whole viewport. Vertical, not horizontal: a sideways scroller hides names the
     same way it hid the date input. */
  .subj-list { max-height:154px; overflow-y:auto; -webkit-overflow-scrolling:touch;
    padding:2px; margin-right:-2px; }
  .sj-chip, .sj-lens { min-height:44px; }
  .sj-cond { flex:1 1 45%; }
  .sj-cond select { min-height:44px; font-size:16px; }   /* 16px: below this iOS zooms */
  .sj-table { font-size:12.5px; }
}

/* Race Analysis, locked until the member follows a horse, rider or stable. Everything the
   page would otherwise build is hidden rather than disabled — a filter row above an empty
   read is worse than one clear ask. */
#view-race.race-locked .rd-filtertoggle,
#view-race.race-locked #race-scope,
#view-race.race-locked .selectline,
#view-race.race-locked #race-pending,
#view-race.race-locked #racedetail,
#view-race.race-locked #cmp-race { display:none; }
.racegate:empty { display:none; }
.rg { margin:18px 0 0; padding:26px 26px 22px; border-radius:14px;
  background:var(--paper); border:1px solid var(--line-soft); border-left:2px solid var(--gold); }
.rg-k { font:700 10px/1 var(--sans); letter-spacing:.22em; text-transform:uppercase;
  color:var(--bronze); }
.rg-h { font-family:var(--serif); font-size:22px; font-weight:700; color:var(--ink);
  margin:11px 0 9px; line-height:1.22; }
.rg-p { margin:0; font-size:14px; line-height:1.62; color:var(--muted); max-width:60ch; }
.rg-go { display:flex; align-items:center; flex-wrap:wrap; gap:12px; margin-top:18px; }
.rg-btn { font:700 13px/1 var(--sans); color:var(--navy); background:var(--gold);
  border:none; border-radius:9px; padding:12px 18px; cursor:pointer; }
.rg-btn:hover { background:var(--gold-soft); }
.rg-btn:focus-visible { outline:2px solid var(--gold); outline-offset:2px; }
.rg-or { font-size:12.5px; color:var(--muted); }
@media (max-width:700px) {
  .rg { padding:20px 17px 18px; }
  .rg-btn { flex:1 1 auto; min-height:44px; }
}

/* Race scope — "My stable" against "Every race". The count on each side makes the narrowing
   visible: 42 of 78,000 is the whole point, and a member should see that rather than wonder
   where the rest went. */
.racescope { display:flex; align-items:center; flex-wrap:wrap; gap:8px; margin:0 0 12px; }
.rs-tab { display:inline-flex; align-items:baseline; gap:8px; cursor:pointer;
  font:600 13px/1 var(--sans); color:var(--ink); background:#fff;
  border:1px solid var(--line); border-radius:999px; padding:10px 16px; }
.rs-tab:hover { border-color:var(--gold); }
.rs-tab.on { background:var(--navy); border-color:var(--navy); color:var(--ivory); }
.rs-tab:focus-visible { outline:2px solid var(--gold); outline-offset:2px; }
.rs-n { font-size:11px; opacity:.72; font-variant-numeric:tabular-nums; }
.rs-note { font-size:12px; color:var(--muted); }
@media (max-width:700px) {
  .rs-tab { flex:1 1 auto; justify-content:center; min-height:44px; }
  .rs-note { flex:1 0 100%; }
}

/* The date rail — replaced two 3,098-option <select>s. Recent days as chips, the archive
   behind a native date input (every platform's own calendar; a real wheel on mobile). */
.daterail { display:flex; gap:6px; flex-wrap:wrap; align-items:center; }
.dr-chip { font:600 12.5px/1 var(--sans); padding:9px 12px; border-radius:9px;
  border:1px solid var(--line); background:#fff; color:var(--ink); cursor:pointer;
  white-space:nowrap; }
.dr-chip:hover { border-color:var(--gold); }
.dr-chip.on { background:var(--navy); border-color:var(--navy); color:var(--ivory); }
.dr-chip.dr-far { border-style:dashed; }
.dr-chip:focus-visible, .dr-date:focus-visible { outline:2px solid var(--gold); outline-offset:2px; }
.dr-more { display:inline-flex; align-items:center; gap:7px; padding:0 2px 0 6px; }
.dr-more-k { font:700 9.5px/1 var(--sans); letter-spacing:.14em; text-transform:uppercase;
  color:var(--muted); }
.dr-date { padding:8px 10px; border-radius:9px; border:1px solid var(--line);
  background:#fff; font-size:12.5px; color:var(--ink); font-family:var(--sans); }
.dr-note { font-size:11.5px; color:var(--oxblood); }
/* pick acknowledged, board still fetching — the rail reads as working, not stuck */
.daterail.dr-busy { opacity:.72; }
.daterail.dr-busy .dr-chip.on { border-style:dashed; }
@media (max-width:700px) {
  /* WRAP, never scroll. The first version scrolled sideways here and put the date input
     off-screen — a control you cannot see is not a control. Fewer chips (see
     DATERAIL_CHIPS_NARROW) keep this to two short rows. */
  .daterail { flex-wrap:wrap; width:100%; gap:8px; }
  .dr-chip { flex:0 0 auto; padding:11px 14px; }        /* a real tap target */
  /* the precise control gets its own full row, so the archive is always one tap away */
  .dr-more { flex:1 0 100%; display:flex; align-items:center; gap:10px; padding:0; }
  .dr-date { flex:1; min-height:44px; font-size:16px; }  /* 16px: iOS zooms in below this */
  .dr-note { flex:1 0 100%; }
}

/* Race Day upgrade hook (free pass → Premium · Live) + Sydney-time freshness stamp */
.rd-upsell { display:flex; align-items:center; justify-content:space-between; gap:16px;
  flex-wrap:wrap; margin:0 0 12px;
  background:linear-gradient(100deg, rgba(200,164,93,.16), rgba(200,164,93,.05));
  border:1px solid rgba(200,164,93,.45); border-radius:12px; padding:14px 18px; }
.rd-upsell-txt { display:flex; align-items:center; gap:12px; flex:1; min-width:260px; }
.rd-upsell-tag { flex:none; font:800 10px/1 var(--sans); letter-spacing:.1em;
  text-transform:uppercase; color:var(--navy); background:var(--gold);
  padding:5px 9px; border-radius:6px; }
.rd-upsell-msg { font-size:13px; line-height:1.5; color:var(--ink); }
.rd-upsell-cta { flex:none; background:var(--navy); color:var(--gold-soft); font-weight:700;
  font-size:13.5px; letter-spacing:.02em; padding:.6rem 1.2rem; border-radius:9px;
  text-decoration:none; white-space:nowrap; transition:background .15s; }
.rd-upsell-cta:hover { background:#0c2944; }
.rd-updated { font-size:12px; color:var(--muted); letter-spacing:.02em; margin:0 0 14px; }
.rd-updated b { color:var(--ink); font-weight:600; font-variant-numeric:tabular-nums; }

/* The trial countdown — a slim strip under the topbar, gold on navy like the upsell tag */
.trialbar { display:flex; align-items:center; justify-content:center; gap:14px;
  flex-wrap:wrap; padding:7px 16px;
  background:linear-gradient(100deg, rgba(200,164,93,.20), rgba(200,164,93,.08));
  border-bottom:1px solid rgba(200,164,93,.45); }
.trialbar-msg { font-size:12.5px; color:var(--ink); letter-spacing:.01em; }
.trialbar-msg b { color:var(--bronze); font-weight:800; text-transform:uppercase;
  font-size:11px; letter-spacing:.08em; }
.trialbar-cta { background:var(--navy); color:var(--gold-soft); font-weight:700;
  font-size:12px; letter-spacing:.02em; padding:.35rem .9rem; border-radius:7px;
  text-decoration:none; white-space:nowrap; transition:background .15s; }
.trialbar-cta:hover { background:#0c2944; }

.empty { color:var(--muted); font-size:13px; padding:30px; text-align:center; }
.foot { margin-top:26px; color:var(--muted); font-size:11px; letter-spacing:.04em; }
.foot b { color:var(--gold); }

/* ============================================================ speed curve
   The signature visual — a run drawn as speed-over-distance. Green where it held
   above winning pace, oxblood where it bled below. */
.curvewrap { background:linear-gradient(180deg,#fbf9f4,#fff); border:1px solid var(--line);
  border-radius:12px; padding:12px 14px 8px; margin-bottom:16px; }
.curvewrap.held { background:repeating-linear-gradient(45deg,rgba(90,30,43,.05),
  rgba(90,30,43,.05) 6px,transparent 6px,transparent 12px); border-color:var(--line-soft); }
.curvehd { display:flex; align-items:baseline; justify-content:space-between; margin-bottom:4px; }
.curvettl { font:700 10px/1 var(--sans); letter-spacing:.16em; text-transform:uppercase;
  color:var(--navy); }
.curvekey { display:flex; gap:12px; }
.curvekey .ck { font:600 9.5px/1 var(--sans); letter-spacing:.04em; text-transform:uppercase;
  color:var(--muted); display:inline-flex; align-items:center; gap:5px; }
.curvekey .ck::before { content:""; width:13px; height:3px; border-radius:2px; display:inline-block; }
.curvekey .ck-win::before { background:var(--green); }
.curvekey .ck-below::before { background:var(--oxblood); }
.spdcurve { width:100%; height:auto; display:block; }
.spdcurve text { font-family:var(--sans); font-variant-numeric:tabular-nums; }
/* inline sparkline in the run tables — the run's shape at a glance */
.spdcurve.mini { width:96px; height:26px; vertical-align:middle; }
td.spark { padding:4px 8px; }
.nospark { color:var(--muted); font-size:11px; }

/* performance radar */
.radar text { font-family:var(--sans); }
@media (max-width:1100px){ .kpis{grid-template-columns:repeat(3,1fr)} .grid3{grid-template-columns:1fr}
  .grid2{grid-template-columns:1fr} .accawrap{grid-template-columns:1fr} }

/* ============================================================ loader
   Race-results trust screen — a galloping thoroughbred in champagne gold
   on midnight navy. Legs run a true gallop cycle; turf scrolls beneath.   */
.loader {
  position:fixed; inset:0; z-index:9999; display:flex;
  align-items:center; justify-content:center;
  background:radial-gradient(120% 120% at 50% 18%,#0c2944 0%,var(--navy) 55%,#04101c 100%);
  transition:opacity .38s ease, visibility .38s ease;
}
.loader.done { opacity:0; visibility:hidden; pointer-events:none; }
.loader-inner { width:min(440px,86vw); text-align:center; }

/* Stage must be tall enough to hold the full rendered horse (340px wide → 255px
   tall at the source 4:3 ratio); a shorter stage let the legs hang over the title
   on narrow screens. Horse is centred, not shifted down, and width-capped so it
   scales with the viewport instead of overrunning the copy on mobile. */
.loader-stage {
  position:relative; height:260px; margin-bottom:20px;
}

/* --- the horse (keyed APNG of a galloping jockey) --- */
.horse-img { position:absolute; left:50%; top:50%; width:340px; max-width:88%; height:auto;
  transform:translate(-50%,-50%); image-rendering:auto;
  filter:drop-shadow(0 14px 18px rgba(0,0,0,.45));
  animation:bob .9s ease-in-out infinite; }
@keyframes bob {
  0%,100% { transform:translate(-50%,-50%); }
  50%     { transform:translate(-50%,-53%); }
}

/* --- progress --- */
.loader-bar { margin:22px auto 0; width:220px; height:3px; border-radius:999px;
  background:rgba(230,211,168,.18); overflow:hidden; }
.loader-bar span { display:block; height:100%; width:40%; border-radius:999px;
  background:linear-gradient(90deg,transparent,var(--gold),var(--gold-soft));
  animation:sweep 1.3s ease-in-out infinite; }
@keyframes sweep { 0%{ transform:translateX(-110%) } 100%{ transform:translateX(330%) } }

@media (prefers-reduced-motion:reduce) {
  .horse-img, .loader-bar span { animation:none; }
}

/* --- the quiet static frame: these findings are OURS, proven on the clock --- */
.loader-eyebrow { margin:20px auto 0; font:700 11px/1 var(--sans);
  letter-spacing:.22em; text-transform:uppercase; color:var(--gold); opacity:.7; }
/* --- HERO: the rotating insight — a proven, positive truth from GALLOP Intelligence --- */
.loader-insight { margin:12px auto 0; max-width:26ch; min-height:3.4em;
  font:400 20px/1.42 var(--serif); color:var(--ivory);
  opacity:0; transition:opacity .34s ease; }
.loader-insight.show { opacity:.96; }
.loader-insight b { color:var(--gold); font-weight:700; font-size:1.12em;
  font-variant-numeric:tabular-nums; }
@media (max-width:420px) {
  .loader-insight { font-size:17px; max-width:22ch; }
}

/* --- the scale of the database on the trust screen: what the wait is buying --- */
.loader-stats { margin:22px auto 0; display:flex; flex-wrap:wrap;
  justify-content:center; gap:8px 22px; max-width:400px;
  opacity:0; transition:opacity .4s ease; }
.loader-stats.on { opacity:1; }
.loader-stat { display:flex; flex-direction:column; align-items:center; gap:2px; }
.loader-stat .n { font:700 18px/1 var(--serif); color:var(--gold);
  letter-spacing:.02em; font-variant-numeric:tabular-nums; }
.loader-stat .l { font:600 10px/1 var(--sans); letter-spacing:.1em;
  text-transform:uppercase; color:var(--gold-soft); opacity:.75; }
@media (max-width:420px) {
  .loader-stats { gap:6px 16px; }
  .loader-stat .n { font-size:16px; }
}

/* --- reassurance while a long build runs, and the give-up / retry state --- */
.loader-note { margin:16px auto 0; color:var(--gold-soft); opacity:.8;
  font-size:12.5px; letter-spacing:.06em; }
.loader-error { margin:14px auto 0; color:var(--gold-soft); opacity:.92;
  font-size:14px; line-height:1.55; max-width:34ch; }
.loader-retry { margin:20px auto 0; display:inline-block; cursor:pointer;
  padding:.6rem 1.4rem; border:1px solid rgba(230,211,168,.5); border-radius:8px;
  background:transparent; color:var(--gold); font-size:13px; font-weight:600;
  letter-spacing:.08em; text-transform:uppercase; transition:.15s; }
.loader-retry:hover { background:rgba(230,211,168,.12); border-color:var(--gold); }

/* --- build provenance on the splash, muted against the navy --- */
.loader-ver { margin:26px auto 0; display:flex; align-items:center;
  justify-content:center; gap:7px;
  font:600 11px/1 var(--sans); letter-spacing:.06em; color:var(--gold-soft);
  opacity:.55; }
.loader-ver .ver-brand { font-family:var(--serif); letter-spacing:.18em;
  text-transform:uppercase; color:var(--gold); }
.loader-ver .ver-sep { opacity:.5; }
.loader-ver .ver-hash { font-family:var(--mono,ui-monospace,Menlo,monospace);
  color:var(--gold-soft); text-decoration:none; border-bottom:1px dotted var(--line); }
.loader-ver a.ver-hash:hover { color:#fff; border-bottom-color:var(--gold); }
.loader-ver .ver-built { color:var(--gold-soft); opacity:.8; }

/* clickable horse names in the race table → Horse Intelligence */
.hlink { cursor:pointer; border-bottom:1px dotted transparent; }
.hlink:hover { color:var(--gold); border-bottom-color:var(--gold); }
.rlink { cursor:pointer; border-bottom:1px dotted transparent; }
.rlink:hover { color:var(--gold); border-bottom-color:var(--gold); }

/* ============================================================ follow star */
.followstar { cursor:pointer; font-size:19px; line-height:1; color:var(--muted);
  user-select:none; transition:transform .12s ease, color .12s ease; flex:none;
  padding:2px 4px; border-radius:6px; }
.followstar:hover { color:var(--gold); transform:scale(1.15); }
.followstar.on { color:var(--gold); }
.followstar:focus-visible { outline:2px solid var(--gold); outline-offset:1px; }

/* ============================================================ race day board */
.rd-dayhead { margin-bottom:16px; padding:12px 16px; border-radius:11px;
  background:var(--paper); border:1px solid var(--line-soft); font-size:14px; color:var(--ink); }
.rd-dayhead.upcoming { background:linear-gradient(120deg,rgba(11,61,46,.10),rgba(200,164,93,.10));
  border-color:var(--line); }
.rd-dayhead b { color:var(--navy); font-family:var(--serif); font-size:16px; }
.rd-dayhead .rd-live { color:var(--green); margin-right:4px; animation:pulse 2s ease-out infinite; }
.rd-dayhead .rd-daysub { display:block; margin-top:3px; font-size:12px; color:var(--muted); }
/* trust badge — when fields & scratchings were last pulled. The board is dated, never
   silently stale. */
.rd-dayhead .rd-checked { display:inline-flex; align-items:center; gap:5px; margin-top:8px;
  font:600 11px/1 var(--sans); letter-spacing:.02em; color:var(--green);
  background:rgba(11,61,46,.08); border:1px solid var(--line-soft);
  padding:5px 10px; border-radius:999px; }
.rd-dayhead .rd-checked b { color:var(--navy); font-weight:700; }
/* IN STABLES — the board put to bed at 8:30pm. A trust signal: the card has stopped
   taking the day's fields. Muted, settled, no live pulse. */
.rd-dayhead.stables { background:linear-gradient(120deg,rgba(11,30,46,.07),rgba(120,120,130,.07));
  border-color:var(--line-soft); }
.rd-stabled { display:inline-block; font:700 10px/1 var(--sans); letter-spacing:.14em;
  text-transform:uppercase; color:var(--navy); background:rgba(11,30,46,.07);
  border:1px solid var(--line); border-radius:6px; padding:4px 8px; margin-right:6px;
  vertical-align:1px; }
.rd-stables { padding:34px 30px; }
.rd-stables-ttl { margin-bottom:10px; }
.rd-stables-ttl .rd-stabled { font-size:12px; letter-spacing:.16em; padding:6px 12px; }
.rd-stables-sub { max-width:520px; margin:0 auto; line-height:1.55; color:var(--muted); font-size:13px; }
.rd-stables-sub .golink { color:var(--gold); cursor:pointer; }
.rd-stables-sub .golink:hover { text-decoration:underline; }
.raceday-meeting { margin-bottom:18px; }
.raceday-meeting .hd .blink { cursor:pointer; }
.raceday-meeting .hd .blink:hover { color:var(--gold); }
/* the day as one chronological flow — every meeting woven together by jump time */
.raceday-chrono { margin-bottom:18px; }
.raceday-chrono.all-run .hd .ttl { opacity:.75; }
.rd-going { font:600 10.5px/1 var(--sans); letter-spacing:.1em; text-transform:uppercase;
  color:var(--muted); }
.rd-race { padding:30px 0 22px; border-top:1px solid var(--gold); }
.rd-race:first-child { border-top:0; padding-top:6px; }
.rd-race:last-child { border-bottom:0; padding-bottom:2px; }
.rd-racehd { display:flex; align-items:baseline; gap:12px; margin-bottom:8px; }
/* the track each race belongs to — shown per-race now the day isn't grouped by track */
.rd-track { font:700 11px/1 var(--sans); letter-spacing:.02em; color:var(--navy); cursor:pointer;
  border-bottom:1px dotted transparent; white-space:nowrap; }
.rd-track:hover { color:var(--gold); border-bottom-color:var(--gold); }
.rd-track-st { font-weight:600; font-size:9.5px; letter-spacing:.08em; color:var(--muted); }
.rd-rno { font-family:var(--serif); font-weight:700; color:var(--gold); font-size:16px; }
.rd-rclass { font-size:12.5px; color:var(--ink); font-weight:600; flex:1; }
/* scheduled jump time */
.rd-time { font:700 11px/1 var(--sans); letter-spacing:.02em; color:var(--navy);
  background:rgba(7,26,47,.07); padding:4px 8px; border-radius:6px; font-variant-numeric:tabular-nums; }
.rd-time.done { color:var(--muted); background:transparent; padding:0; font-weight:600; }
/* count of horses popped for proven near-winning pace */
.rd-pop { font:700 10px/1 var(--sans); letter-spacing:.05em; text-transform:uppercase;
  color:var(--navy); background:var(--gold); padding:4px 9px; border-radius:999px; white-space:nowrap; }
.rd-result { font-size:11px; color:var(--muted); cursor:pointer; white-space:nowrap;
  border-bottom:1px dotted transparent; }
.rd-result:hover { color:var(--gold); border-bottom-color:var(--gold); }
/* the "to come" count chip on a meeting header, and the all-run dimming */
.rd-count { font:600 10px/1 var(--sans); letter-spacing:.08em; text-transform:uppercase;
  color:var(--green); border:1px solid var(--line); border-radius:6px; padding:3px 7px; }
.rd-count.done { color:var(--muted); }
/* TAB-style race-number selector — jump to a race by number within a single meeting */
.rd-rstrip { display:flex; gap:6px; overflow-x:auto; padding:2px 0 14px; margin-bottom:8px;
  border-bottom:1px solid var(--line); -webkit-overflow-scrolling:touch; scrollbar-width:none; }
.rd-rstrip::-webkit-scrollbar { display:none; }
.rd-rtab { font:700 13px/1 var(--serif); color:var(--navy); background:rgba(7,26,47,.05);
  border:1px solid var(--line); border-radius:8px; padding:8px 12px; cursor:pointer;
  white-space:nowrap; flex:0 0 auto; font-variant-numeric:tabular-nums;
  transition:background .12s, color .12s, border-color .12s; }
.rd-rtab:hover { color:var(--gold); border-color:var(--gold); }
.rd-rtab.on { color:var(--navy); background:var(--gold); border-color:var(--gold); }
/* jumped-to races clear the sticky masthead (≈137px) instead of hiding beneath it */
.rd-race[id^="rdrace-"], .rd-donerow[id^="rdrace-"] { scroll-margin-top:150px; }
/* brief highlight on the race you jumped to */
.rd-jumped { animation:rdJump 1.2s ease; }
@keyframes rdJump { 0%,25% { background:rgba(200,164,93,.16); } 100% { background:transparent; } }
.raceday-meeting.all-run .hd .ttl { opacity:.75; }
/* completed races — shifted off the active card into a compact Race-Intelligence list */
.rd-completed { margin-top:10px; padding-top:10px; border-top:1px dashed var(--line); }
.rd-completed-hd { font:600 10px/1 var(--sans); letter-spacing:.1em; text-transform:uppercase;
  color:var(--muted); margin-bottom:6px; }
.rd-donerow { display:flex; align-items:baseline; gap:12px; padding:5px 6px; border-radius:6px; }
.rd-donerow:hover { background:rgba(200,164,93,.05); }
.rd-pending { font-size:11px; color:var(--muted); font-style:italic; }
.rd-field { display:flex; flex-direction:column; gap:2px; }
/* Race Day field — an aligned speed table: runner · form · the four speed-model dimensions,
   the field-best in each popped in gold. */
.entrant-row { display:grid; align-items:center; gap:13px; padding:9px 18px; border-radius:8px;
  grid-template-columns: 16px 28px 30px minmax(138px,1.4fr) minmax(112px,0.95fr) minmax(92px,0.68fr) minmax(120px,0.86fr) 58px 58px 58px 58px 58px 24px; }
/* F1-telemetry section break — a hairline between the identity block (runner · jockey · unit) and
   the speed categories (top speed · start · ground · mid-race · finish), their own panel */
.entrant-row > *:nth-child(8), .entrant-row.rd-fieldhead > span:nth-child(8) {
  border-left:1px solid var(--line); }
.entrant-row:hover { background:rgba(200,164,93,.06); }
.entrant-row.rd-fieldhead { padding-top:2px; padding-bottom:6px; border-bottom:1px solid var(--line); }
.entrant-row.rd-fieldhead:hover { background:transparent; }
.entrant-row.rd-fieldhead span { font-size:8.5px; letter-spacing:.1em; text-transform:uppercase;
  color:var(--muted); text-align:right; }
.entrant-row.rd-fieldhead .rd-h-name, .entrant-row.rd-fieldhead .rd-h-form,
.entrant-row.rd-fieldhead .rd-h-unit { text-align:left; }
.entrant-row.rd-fieldhead .rd-h-jock { text-align:center; }

/* SPEED × MARKET × EXPERTS terminal row — barrier · silk · runner · 5 speeds · market ·
   experts · star. Three sensors, aligned; the money is a ticker; the desk's consensus stands
   in its own column beside it; depth on click.
   The two NAMES lead. Chips beside them (Speed Signature, turn habit) and the pilot's
   sub-line (unit lift, the rider's turn record) were truncating the very thing a reader
   scans for — "NOSTRO …", "SAVANN…" — so they moved into the Unit read one click away
   (carPilotUnit). Nothing was dropped; it is read where there is room to read it. */
.entrant-row.rd-term { grid-template-columns:26px 26px minmax(152px,1.7fr) minmax(120px,1.15fr) 52px 52px 52px 52px 52px 48px minmax(84px,0.9fr) minmax(54px,0.6fr) minmax(58px,0.65fr) 22px; gap:10px; cursor:pointer; }
.entrant-row.rd-term > *:nth-child(5), .entrant-row.rd-term.rd-fieldhead > span:nth-child(5) { border-left:1px solid var(--line); padding-left:7px; }
.entrant-row.rd-term > *:nth-child(11), .entrant-row.rd-term.rd-fieldhead > span:nth-child(11) { border-left:1px solid var(--line); padding-left:9px; }
.entrant-row.rd-term > *:nth-child(13), .entrant-row.rd-term.rd-fieldhead > span:nth-child(13) { border-left:1px solid var(--line); padding-left:9px; }
/* TURN % — the position record beside the speed dimensions, not a speed. Kept in the speed
   panel (both answer "what has it done"), but quieter: no gold field-best pop, because the
   field's highest turn % is a record, not a ranking of today. Lit only against the winners'
   81% — the one frame that makes the number mean something. */
.entrant-row.rd-term > .rd-turnpct { font-variant-numeric:tabular-nums; color:var(--ink); }
.entrant-row.rd-term > .rd-turnpct.turn-ahead { color:var(--green); font-weight:700; }
.entrant-row.rd-term.open { background:rgba(200,164,93,.09); }
.entrant-row.rd-term.rd-fieldhead .rd-h-mkt, .entrant-row.rd-term.rd-fieldhead .rd-h-avgmkt, .entrant-row.rd-term.rd-fieldhead .rd-h-jockcol, .entrant-row.rd-term.rd-fieldhead .rd-h-desk { text-align:left; }
/* the laptop tier (a 13"/14" MacBook sits here): 14 columns against ~970px of card. Tighten
   the GUTTERS and the numeric cells rather than the names — a squeezed price still reads,
   a squeezed name becomes "SAVANN…". Below 768px the phone board replaces this grid entirely.
   Its gutters and cell sizes are also the base the narrow band below inherits; that band
   overrides only the template, so 1280–1399 is where this tier stands on its own. */
@media (min-width:768px) and (max-width:1399px) {
  .entrant-row.rd-term { column-gap:6px; padding-left:12px; padding-right:12px;
    grid-template-columns:24px 24px minmax(150px,1.7fr) minmax(128px,1.2fr) 43px 43px 43px 43px 43px 38px minmax(76px,0.9fr) minmax(48px,0.6fr) minmax(52px,0.65fr) 20px; }
  .entrant-row.rd-term > .rd-dim { font-size:12.5px; }
}
/* THE CARRIED WEIGHT is the one thing that shares the rider's line, and it costs ~48px — which
   the pilot column can only spare on a wide desktop. Measured on the live national card, rider
   names truncated with the weight on the row: 105 of 327 at 1440px, 11 at 1600px, 0 at 1722px.
   So it shows from 1700 up and comes off the row below that, where it is read in the Unit panel
   (the pilot cell, beside the rider's name) instead. The name outranks the fact beside it. */
@media (max-width:1699px) {
  .entrant-row.rd-term .ent-jockname .ent-wt { display:none; }
}
/* the narrow band — an iPad, a half-screen window, a small laptop. Fourteen columns cannot
   hold here: measured on the live national card, the row outran its card by 38px at 1100 and
   198px at 768, and `.card` is overflow-x:hidden, so the follow star was simply CUT OFF (this
   predates the row rework — the old grid was worse: 129px and 289px). Two things fix it:
   (1) the two market-RECORD columns step off — average market and the experts' desk, exactly
       the pair the phone board already drops. Today's price stays; the record of past prices
       and the desk's share are read on the horse's own page. Twelve columns, and the two names
       keep their floor.
   (2) a floor + scroll on the field itself, so that where even twelve outrun the card (an iPad
       in portrait) the board SCROLLS instead of clipping. Nothing is ever hidden off the edge.
   The 1280 boundary is where the fourteen-column tier can first afford the runner column the
   same ~180px this band gives it (measured: field 970px at 1280 → 181px). Below that, fourteen
   columns only buy two market-record cells at the names' expense — so twelve wins. */
@media (min-width:768px) and (max-width:1279px) {
  .entrant-row.rd-term {
    grid-template-columns:24px 24px minmax(180px,1.8fr) minmax(128px,1.2fr) 43px 43px 43px 43px 43px 38px minmax(78px,1fr) 20px; }
  .entrant-row.rd-term > *:nth-child(12), .entrant-row.rd-term > *:nth-child(13),
  .entrant-row.rd-term.rd-fieldhead > span:nth-child(12),
  .entrant-row.rd-term.rd-fieldhead > span:nth-child(13) { display:none; }
  /* the floor is the RUNNER column's floor plus the eleven cells beside it. Where the card is
     narrower than that (iPad portrait), the field scrolls those last ~130px rather than
     shaving the names down again — a name that has to be scrolled to is still a name. */
  .rd-field { overflow-x:auto; }
  .rd-field > .entrant-row.rd-term { min-width:800px; }
}
/* AVERAGE MARKET — the horse's settled-price record (market form). Its own quiet cell
   inside the market panel: the last-3 mean, the stock's trend arrow, career beneath. */
.avgmkt-col { display:flex; flex-direction:column; min-width:0; }
.avgmkt-lead { display:flex; align-items:baseline; gap:4px; }
.avgmkt-v { font-size:12.5px; font-weight:600; color:var(--ink); font-variant-numeric:tabular-nums; }
.avgmkt-tr { font-size:9px; }
.avgmkt-sub { font-size:10px; color:var(--muted); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.avgmkt-none { color:var(--muted); }
.avgmkt-td { white-space:nowrap; }
.mf-up { color:#0B5C42; font-style:normal; }
.mf-dn { color:var(--oxblood); font-style:normal; }
.mf-st { color:var(--muted); font-style:normal; }
/* the pilot column — the rider, respected: name + a ● when the money follows the booking */
.ent-jockcol { min-width:0; }
.ent-jockname { font-size:13px; color:var(--ink); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.entrant-row.rd-term .ent-jockname { font-weight:500; }
.pilot-hot { color:#0B5C42; font-size:8px; vertical-align:middle; margin-left:4px; }
.entrant-row.scratched .ent-jockcol { color:var(--muted); font-size:12px; }
.ent-line { display:flex; align-items:baseline; gap:6px; min-width:0; }
.ent-line .ent-name { font-size:13.5px; font-weight:500; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
/* the runner's NAME is the row's headline on the Race Day board — nothing shares its line */
.entrant-row.rd-term .ent-line .ent-name { font-size:14.5px; font-weight:600; }
.rd-conten { color:var(--gold); font-size:10px; }
/* the Market column stacks two channels, never blended: the real money's move on top,
   the assessed line's re-rate as a quiet second row beneath */
.mkt-col { display:flex; flex-direction:column; gap:2px; align-items:flex-start; min-width:0; }
.mkt-col .mkt-ass { font:500 8.5px/1.2 var(--sans); letter-spacing:.04em; text-transform:uppercase;
  color:var(--muted); font-variant-numeric:tabular-nums; white-space:nowrap; }
/* the market ticker cell — the live price leads (the punter's number), the move descriptor
   beneath in green back / clay ease. Below the significance floor the word is a muted
   "steady": no arrow, no %. A dot for conviction; the 'why' on hover. */
.mkt-cell { display:flex; flex-direction:column; line-height:1.15; align-items:flex-start; }
.mkt-cell .mkt-price { font-size:12.5px; font-weight:700; color:var(--navy);
  font-variant-numeric:tabular-nums; }
.mkt-cell .mkt-word { font-size:9px; letter-spacing:.05em; text-transform:uppercase;
  color:var(--muted); font-variant-numeric:tabular-nums; white-space:nowrap; }
.mkt-firm .mkt-word { color:#0B5C42; font-weight:700; }
.mkt-drift .mkt-word { color:#993C1D; font-weight:700; }
.mkt-cell.mkt-none { color:var(--muted); font-weight:400; }
.mkt-cell.mkt-await { font-size:9px; font-style:italic; letter-spacing:.03em; opacity:.85; }
.mkt-cell.mkt-flag .mkt-price::after { content:"●"; font-size:7px; vertical-align:middle;
  margin-left:5px; color:#0B5C42; }
/* the money and the form analysts disagree, both beyond the noise floor — rare by
   construction. Signal-blue, NOT gold: gold is reserved for GALLOP's signature fusion
   (speed × market), and this tag is two external voices with no GALLOP clock in it. */
.mkt-col .mkt-div { font:800 7.5px/1 var(--sans); letter-spacing:.13em; text-transform:uppercase;
  color:#2e5f7f; border:1px solid rgba(127,155,181,.55);
  border-radius:4px; padding:2px 4px 1px; background:rgba(157,180,201,.14); }
/* the delta made explicit: where the money opened, under where it sits now */
.mkt-cell .mkt-openline { font-size:8.5px; color:var(--muted); letter-spacing:.03em;
  font-variant-numeric:tabular-nums; white-space:nowrap; }
/* THE DESK — the EXPERTS column beside the market: one clean number, the share of the
   race's active analysts who named this runner, with a bar. Click it for the backers
   popover. Steel-blue like every external-vs-external read (no GALLOP clock → never
   gold); the bordered state marks calls sealed within the last two hours — the delta.
   WITHHELD (—) when the desk is silent. */
.desk-col { display:flex; flex-direction:column; gap:2px; align-items:flex-start;
  min-width:0; }
.desk-col.desk-click { cursor:pointer; }
.desk-col.desk-click:hover .desk-rankno { text-decoration:underline;
  text-underline-offset:2px; }
.desk-col.desk-none { color:var(--muted); cursor:default; }
.desk-col .desk-lead { display:flex; align-items:center; gap:5px; white-space:nowrap; }
.desk-col .desk-rankno { font-size:12.5px; font-weight:700; color:#2e5f7f;
  font-variant-numeric:tabular-nums; }
/* the bar — the analyst share made visible; the track is every analyst on the race */
.desk-col .desk-bar { width:40px; height:3px; border-radius:2px;
  background:rgba(46,95,127,.16); overflow:hidden; flex:none; }
.desk-col .desk-bar i { display:block; height:100%; background:#2e5f7f; border-radius:2px; }
.desk-col .desk-word { font:700 8.5px/1 var(--sans); letter-spacing:.08em;
  text-transform:uppercase; color:#2e5f7f; font-variant-numeric:tabular-nums; }
.desk-col.desk-fresh .desk-lead { border:1px solid rgba(127,155,181,.55); border-radius:4px;
  padding:2px 4px 1px; background:rgba(157,180,201,.14); }
/* the backers popover — who named it: analyst (→ their file) · call · proven strike · seal */
#desk-pop { position:fixed; z-index:80; background:var(--paper); border:1px solid var(--line);
  border-radius:12px; box-shadow:0 12px 34px rgba(21,21,21,.18); padding:12px 14px 10px; }
#desk-pop .dp-head { font-family:var(--serif); font-size:14px; font-weight:700;
  color:var(--navy); margin-bottom:8px; }
#desk-pop .dp-row { display:grid; grid-template-columns:minmax(96px,1.2fr) auto 1fr auto;
  gap:10px; align-items:baseline; padding:5px 0; border-top:1px solid var(--line-soft);
  font-size:11.5px; }
#desk-pop .dp-name { font-weight:700; color:var(--navy); white-space:nowrap; }
#desk-pop .dp-name.dp-link { color:#2e5f7f; cursor:pointer; }
#desk-pop .dp-name.dp-link:hover { text-decoration:underline; text-underline-offset:2px; }
#desk-pop .dp-call { font:700 8.5px/1 var(--sans); letter-spacing:.08em;
  text-transform:uppercase; color:#2e5f7f; white-space:nowrap; }
#desk-pop .dp-strike { color:var(--ink); font-variant-numeric:tabular-nums;
  white-space:nowrap; }
#desk-pop .dp-strike i { font-style:normal; color:var(--muted); font-size:10px; }
#desk-pop .dp-seal { color:var(--muted); font-size:10px; white-space:nowrap; }
#desk-pop .dp-foot { font-size:9.5px; color:var(--muted); font-style:italic;
  margin-top:8px; }
/* Horse · Jockey · Unit — the identity block, three aligned columns */
.ent-horse { display:flex; align-items:center; gap:6px; min-width:0; text-align:left; }
.ent-horse .ent-name { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.ent-jock { display:flex; align-items:center; justify-content:center; gap:4px; min-width:0;
  font-size:11.5px; color:#43505e; background:none; border:0; cursor:pointer; font-family:inherit; }
button.ent-jock:hover { color:var(--gold); }
button.ent-jock .rd-cpuchev { font-size:9px; color:var(--gold); transition:transform .15s ease; }
button.ent-jock.open .rd-cpuchev { transform:rotate(90deg); }
.ent-jock .rd-jock { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.ent-unit { display:flex; align-items:center; min-width:0; font-size:11.5px; }
.u-read { display:inline-flex; align-items:baseline; gap:5px; white-space:nowrap; }
.u-read .u-pos { color:var(--green); font-weight:700; }
.u-read .u-neg { color:var(--oxblood); font-weight:700; }
.u-read .u-n { font-size:9.5px; color:var(--muted); }
.u-none { color:var(--muted); }
/* a popped runner — proven a speed within x% of the winning baseline */
.entrant-row .pop-flag { width:13px; text-align:center; color:var(--gold); font-size:10px; line-height:1; }
.entrant-row .pop-flag.pop-none { color:transparent; }
.entrant-row.contender { background:linear-gradient(90deg,rgba(200,164,93,.16),rgba(200,164,93,.02));
  box-shadow:inset 3px 0 0 var(--gold); }
.entrant-row.contender:hover { background:linear-gradient(90deg,rgba(200,164,93,.22),rgba(200,164,93,.05)); }
.entrant-row.contender .ent-name { color:var(--navy); }
.barbadge { width:24px; height:24px; display:inline-flex; align-items:center;
  justify-content:center; border:1px solid var(--line); border-radius:6px;
  font:700 12px/1 var(--sans); color:var(--navy); font-variant-numeric:tabular-nums;
  background:var(--paper); }
/* barrier fallback — shown when the official saddlecloth number isn't on file yet.
   Visibly a barrier ("B3", dimmed, dashed), never masquerading as the number. */
.barbadge.bar-only { color:var(--muted); border-style:dashed; font-weight:600; font-size:10px;
  letter-spacing:.02em; background:transparent; }
/* THE PILOTS — the stable's followed riders, same card grammar as the horses */
.stable-sec { grid-column:1/-1; font:700 11px/1 var(--sans); letter-spacing:.16em;
  text-transform:uppercase; color:var(--gold-deep,#9a7d3c); margin:18px 0 10px;
  padding-top:14px; border-top:1px solid var(--line); }
/* My Stable onboarding — the getting-started guide + an empty slot per followable kind */
.stable-cta { margin:2px 0 6px; padding:13px 16px; font-size:13px; line-height:1.5;
  color:var(--muted); border:1px solid var(--line); border-radius:12px;
  background:rgba(200,164,93,.07); }
.stable-cta b { color:var(--gold-deep,#9a7d3c); }
.stable-slot { border:1px dashed var(--line); border-radius:14px; padding:20px 18px;
  display:flex; flex-direction:column; align-items:flex-start; gap:6px; max-width:420px; }
.stable-slot .ss-star { font-size:20px; line-height:1; color:var(--gold); }
.stable-slot .ss-t { font:700 14px/1.2 var(--serif); color:var(--navy); }
.stable-slot .ss-h { font-size:12.5px; line-height:1.5; color:var(--muted); }
.stable-slot .ss-h b { color:var(--ink); }
.stable-slot .ss-add { margin-top:6px; padding:7px 13px; font:600 12px/1 var(--sans);
  color:var(--navy); background:var(--gold); border:none; border-radius:8px; cursor:pointer; }
.stable-slot .ss-add:hover { background:var(--gold-soft); }
.stable-slot .ss-add:focus-visible { outline:2px solid var(--gold); outline-offset:2px; }

/* ADD TO YOUR STABLE — the four kinds, added from inside the room they belong to. */
.stable-add { margin:0 0 20px; padding:18px 18px 14px; border-radius:12px;
  background:var(--paper); border:1px solid var(--line-soft); }
.sa-hd { display:flex; align-items:baseline; gap:12px; flex-wrap:wrap; }
.sa-eyebrow { font:700 10px/1 var(--sans); letter-spacing:.2em; text-transform:uppercase;
  color:var(--bronze); }
.sa-sub { font-size:12.5px; color:var(--muted); }
.sa-tabs { display:flex; flex-wrap:wrap; gap:7px; margin-top:13px; }
.sa-tab { font:600 12.5px/1 var(--sans); padding:9px 14px; border-radius:999px;
  border:1px solid var(--line); background:#fff; color:var(--ink); cursor:pointer; }
.sa-tab:hover { border-color:var(--gold); }
.sa-tab.on { background:var(--navy); border-color:var(--navy); color:var(--ivory); }
.sa-tab:focus-visible, .sa-q:focus-visible { outline:2px solid var(--gold); outline-offset:2px; }
.sa-searchwrap { margin-top:11px; }
.sa-q { width:100%; padding:11px 13px; border-radius:9px; border:1px solid var(--line);
  background:#fff; color:var(--ink); font:14px/1.2 var(--sans); }
.sa-results { margin-top:10px; max-height:302px; overflow-y:auto; }
.sa-row { display:flex; align-items:center; gap:11px; padding:9px 4px;
  border-bottom:1px solid var(--line-soft); }
.sa-n { font-size:13.5px; font-weight:600; color:var(--ink); min-width:0;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.sa-m { margin-left:auto; font-size:11.5px; color:var(--muted); white-space:nowrap; }
.sa-hint { font-size:12.5px; color:var(--muted); padding:10px 4px; }
@media (max-width:700px) {
  .sa-tab { flex:1 1 auto; text-align:center; min-height:44px; }
  .sa-q { font-size:16px; min-height:44px; }     /* 16px: below this iOS zooms the page */
  .sa-row { padding:12px 4px; }                  /* a real tap target for the star */
  .sa-results { max-height:none; }
}
.sp-card .sp-craft { margin:4px 0 2px; }
.sp-card .sp-form { font-size:12px; margin-top:4px; }
.sp-card .sp-held { color:var(--muted); font-size:11.5px; }
.sp-card .sp-rides { margin-top:8px; display:flex; flex-wrap:wrap; gap:6px; }
.sp-card .jklink { cursor:pointer; }
.sp-card .jklink:hover { color:var(--gold); }
/* a followed pilot's booking on the Race Day board — the stable's own star, in miniature */
.ent-jockname .pilot-followed { color:var(--gold); font-size:10px; margin-right:3px; }
/* the carried weight beside the booking — a quiet fact, not a signal */
.ent-jockname .ent-wt { color:var(--muted); font-weight:400; font-size:11px; margin-left:4px;
  font-variant-numeric:tabular-nums; white-space:nowrap; }
.ent-cell { min-width:0; display:flex; align-items:center; gap:7px; flex-wrap:wrap; }
.entrant-row .ent-name { font-weight:600; font-size:13.5px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.rd-formcell { min-width:0; }
.rd-dim { text-align:right; font-size:13.5px; font-variant-numeric:tabular-nums; color:var(--ink);
  white-space:nowrap; letter-spacing:.01em; }
.rd-dim.best { display:inline-block; color:var(--navy); font-weight:700;
  background:var(--gold-soft); border-radius:999px; padding:1px 8px; box-shadow:inset 0 0 0 1px var(--gold); }
.entrant-row.scratched .rd-dim { color:var(--muted); }
/* the LEVEL fallback — a real clocking, a lesser lens. Deliberately quieter than a ground
   read (muted ink, lighter weight, a dotted underline that reads as "different kind") so it
   can never be mistaken for one. Never gold: gold marks the Speed x Market fusion alone. */
.rd-dim-lvl { color:var(--muted); font-weight:400;
  border-bottom:1px dotted color-mix(in srgb, var(--muted) 55%, transparent); }
.rd-dim-lvl .rd-rk { opacity:.7; }
/* the INDICATIVE par — the faintest tier: a class benchmark, not a clocking. Italic + a lighter
   ink than even the level read, no underline, no rank — so the eye reads it as "≈, provisional",
   never a proven number. The ≈ in the value carries the rest of the message. */
.rd-dim-indic { color:color-mix(in srgb, var(--muted) 78%, transparent); font-weight:400;
  font-style:italic; letter-spacing:0; }
/* the field rank carried by every metric — a small superscript; gold-1st is the pill */
.rd-rk { font-size:8px; font-weight:600; color:var(--muted); vertical-align:super; margin-left:1px; }
.rd-dim.best .rd-rk, .pill-gold .rd-rk { color:var(--navy); opacity:.65; }
/* the sector trend arrow — this frame vs the horse's own usual level in that sector */
.rd-trend { font-size:8px; font-weight:700; margin-right:2px; vertical-align:middle; line-height:1; }
.rd-trend-up { color:var(--green); }
.rd-trend-down { color:#9a5a1e; }
.rd-dim.best .rd-trend { opacity:.8; }
/* the gold "best in field" pill — used wherever a best metric is popped (rows + tables) */
.pill-gold { display:inline-block; color:var(--navy); font-weight:700; background:var(--gold-soft);
  border-radius:999px; padding:1px 8px; box-shadow:inset 0 0 0 1px var(--gold); font-variant-numeric:tabular-nums; }
/* a value derived/recovered from data we hold (not in the source) — marked honestly */
.infmark { color:var(--gold); font-weight:700; cursor:help; font-size:.85em; }
/* two stacked reads: the all-time proven pill on top, recent (last-3) beneath */
.entrant-row .pp-slot { flex:none; width:128px; display:flex; flex-direction:column;
  align-items:flex-start; gap:3px; }
/* career best — context behind the form hero: best proven speed ever at this trip. Quiet,
   secondary to the form pill; an up/down tint reads at a glance whether it's near its best. */
.pp-ctx { display:inline-flex; align-items:baseline; gap:4px; font:700 10px/1 var(--sans);
  letter-spacing:.01em; color:var(--muted); font-variant-numeric:tabular-nums; white-space:nowrap; }
.pp-ctx .ctx-lab { font-weight:600; font-size:8.5px; letter-spacing:.08em; text-transform:uppercase;
  color:var(--muted); opacity:.8; }
.pp-ctx .pp-ms { font-size:8.5px; font-weight:600; opacity:.7; }
.pp-ctx.up { color:var(--green); }
.pp-ctx.dn { color:var(--oxblood); }
.pp-ctx.held { color:var(--muted); font-style:italic; }

/* top proven speed by time frame — the shared strip on every speed profile (horse,
   jockey, trainer, track): career / this year / this month, WITHHELD frames muted. */
.sw-strip { margin:14px 0 4px; }
.sw-lead { font:600 10px/1 var(--sans); letter-spacing:.13em; text-transform:uppercase;
  color:var(--muted); margin-bottom:8px; }
.sw-cells { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; }
.sw-cell { background:var(--paper); border:1px solid var(--line-soft); border-radius:11px;
  padding:11px 13px; }
.sw-cell .sw-v { font-family:var(--serif); font-size:22px; font-weight:700; color:var(--navy);
  line-height:1; font-variant-numeric:tabular-nums; }
.sw-cell .sw-v .sw-u { font:600 10px/1 var(--sans); color:var(--muted); margin-left:4px;
  letter-spacing:.04em; }
.sw-cell .sw-l { font:600 10px/1 var(--sans); letter-spacing:.1em; text-transform:uppercase;
  color:var(--green); margin-top:8px; }
.sw-cell .sw-n { font-size:10.5px; color:var(--muted); margin-top:4px; font-variant-numeric:tabular-nums; }
/* a frame with no runs in the window — shown, but plainly empty (WITHHELD, never guessed) */
.sw-cell.held { border-style:dashed; opacity:.7; }
.sw-cell.held .sw-v { color:var(--muted); }
.sw-cell.held .sw-l { color:var(--muted); }
.sw-cell.held .sw-n { color:var(--oxblood); font-style:italic; }
/* the AVERAGE MARKET strip — same instrument as the speed windows, five frames wide */
.mf-strip .sw-cells { grid-template-columns:repeat(5,1fr); }
.mf-strip .sw-cell .sw-v { font-size:19px; }
.mf-trend { display:inline-flex; align-items:baseline; gap:4px; margin-left:10px;
  font:700 9.5px/1 var(--sans); letter-spacing:.12em; }
.mf-trend i { font-style:normal; text-transform:uppercase; }
@media (max-width:760px){ .mf-strip .sw-cells { grid-template-columns:repeat(3,1fr); row-gap:8px; } }

/* proven-pace pill — a + / − % of the speed each runner has EARNED against the
   speed to win this trip. A ranking of what they've run, never a tip:
   gold = the fastest earned speed in the race (popped) · silver = also at/above the
   winning speed · faded = below it. */
.pp { display:inline-flex; align-items:baseline; gap:5px; font:700 11px/1 var(--sans);
  letter-spacing:.01em; padding:5px 9px; border-radius:999px;
  font-variant-numeric:tabular-nums; white-space:nowrap; }
.pp .pp-ms { font-size:9px; font-weight:600; opacity:.7; }
/* the FORM micro-tag inside the hero pill — names the hero as recent form, never career */
.pp .pp-tag { font-weight:700; font-size:8px; letter-spacing:.1em; text-transform:uppercase;
  opacity:.6; margin-right:1px; }
/* the pop — fastest proven speed in the race */
.pp-top { background:var(--gold); color:var(--navy);
  box-shadow:0 0 0 1px rgba(200,164,93,.55), 0 2px 8px -2px rgba(200,164,93,.55); }
/* the rest above the winning speed — silver */
.pp-pos { background:linear-gradient(160deg,#e9ecf1,#cfd4dc); color:#3a4452;
  box-shadow:inset 0 0 0 1px rgba(120,130,145,.30); }
/* below the winning speed — faded back */
.pp-neg { background:rgba(21,21,21,.05); color:var(--muted); font-weight:600; opacity:.6; }
/* no speed-to-win baseline for this trip — show the earned speed, flat/uncoloured */
.pp-flat { background:rgba(21,21,21,.05); color:var(--muted); font-weight:600; }
.pp-flat.pp-top { background:var(--gold); color:var(--navy); opacity:1; }
.foot-gold { color:#9a7b34; }
/* scratched — withdrawn after acceptances. Kept on the board (transparency) but clearly
   FADED OUT, with a bold line struck through the name, sunk below the live field. The
   SCRATCHED tag sits in the pill slot. */
.entrant-row.scratched { opacity:.45; }
.entrant-row.scratched:hover { background:transparent; opacity:.7; }   /* lift on hover so it stays readable */
.entrant-row.scratched .barbadge { color:var(--muted); border-style:dashed; }
.entrant-row.scratched .silk-sm { filter:grayscale(1); }
.entrant-row.scratched .ent-name { color:var(--muted); font-weight:600;
  text-decoration:line-through; text-decoration-color:var(--oxblood);
  text-decoration-thickness:2px; text-underline-offset:1px; }
.pp-scr { background:repeating-linear-gradient(45deg,rgba(90,30,43,.12),rgba(90,30,43,.12) 5px,transparent 5px,transparent 10px);
  color:var(--oxblood); font-weight:700; letter-spacing:.05em; }
/* the per-race scratched count on the race header */
.rd-scr { font:700 10px/1 var(--sans); letter-spacing:.05em; text-transform:uppercase;
  color:var(--oxblood); background:rgba(90,30,43,.08); padding:4px 9px; border-radius:999px;
  white-space:nowrap; }
.pp-none { background:repeating-linear-gradient(45deg,rgba(90,30,43,.13),rgba(90,30,43,.13) 5px,transparent 5px,transparent 10px);
  color:var(--oxblood); font-weight:600; }

/* baseline-to-win/place readout under each race header */
.rd-base { font-size:12px; color:var(--ink); margin:2px 0 10px; display:flex;
  align-items:baseline; gap:10px; flex-wrap:wrap; }
.rd-base .bw { color:var(--gold); } .rd-base .bp { color:var(--green); }
.rd-base.muted { color:var(--muted); }
.rd-base .rd-n { font-size:10px; letter-spacing:.1em; text-transform:uppercase; color:var(--muted); }
/* the all-WITHHELD sector note — one quiet line under the header row, same muted grammar
   as the rd-base notes: an honest silence, explained, never dressed as an alert */
.rd-secnote { font-size:11px; color:var(--muted); padding:5px 2px 6px;
  border-bottom:0.5px solid var(--line-soft); }

/* GALLOP's read — the sealed pace point of view + the reckoning against the clock */
.rd-reads { display:flex; gap:8px; flex-wrap:wrap; margin:0 0 10px; }
.rd-reads .rd-read { margin:0; flex:1 1 320px; }
.rd-read { display:flex; align-items:baseline; flex-wrap:wrap; gap:6px 10px; margin:0 0 10px;
  padding:8px 10px; border:1px solid var(--line); border-radius:8px; background:rgba(200,164,93,.06); }
/* The money — the market read, distinct from the gold pace read (green = the money lens) */
.rd-money { background:rgba(11,61,46,.05); border-color:color-mix(in srgb, var(--green) 34%, var(--line-soft)); }
.rd-money .pr-tag { color:var(--green); }
.rd-money .pr-shape .ti { color:var(--green); }
.rd-money .pr-why b.hlink { cursor:pointer; color:var(--navy); }
.rd-money .pr-why b.hlink:hover { color:var(--green); }
.rd-money .mr-tail { color:var(--muted); }
.rd-read .pr-tag { font:700 9.5px/1 var(--sans); letter-spacing:.12em; text-transform:uppercase;
  color:var(--muted); }
.rd-read .pr-shape { font:700 10.5px/1 var(--sans); letter-spacing:.04em; text-transform:uppercase;
  color:var(--navy); display:inline-flex; align-items:center; gap:5px; padding:3px 9px;
  background:var(--gold-soft); border:0.5px solid var(--gold); border-radius:20px; }
.rd-read .pr-shape .ti { color:var(--bronze); font-size:13px; }
.rd-read .pr-why { font-size:11.5px; color:var(--muted); flex:1 1 220px; line-height:1.45; }
.rd-read .pr-reck { font:700 10.5px/1.3 var(--sans); letter-spacing:.02em; color:var(--muted);
  display:inline-flex; align-items:center; gap:4px; }
.rd-read .pr-reck.pr-ok { color:var(--green); }
.rd-read .pr-reck.pr-no { color:var(--red, #c2410c); }

/* Market-as-sensor: the crowd's money move fused with proven speed — a where-to-look chip */
.mk-chip { display:inline-flex; align-items:center; gap:3px; font:700 9px/1 var(--sans);
  letter-spacing:.04em; text-transform:uppercase; padding:2px 6px; border-radius:20px;
  border:1px solid var(--line-soft); color:var(--muted); vertical-align:middle; white-space:nowrap; }
.mk-chip .ti { font-size:11px; }
/* the sweet-spot chip — the money AND the clock agree on this runner. Slightly elevated
   (a whisper of gold ground under the green), never shouting. */
.mk-chip.mk-confirmed { color:var(--green); border-color:color-mix(in srgb, var(--green) 45%, transparent);
  background:rgba(200,164,93,.12); box-shadow:0 0 0 1px rgba(200,164,93,.16); }
.mk-chip.mk-crowd { color:var(--gold); border-color:var(--line); }
.mk-chip.mk-speed { color:var(--navy); border-color:var(--line-soft); }
.mk-chip.mk-mover { background:rgba(200,164,93,.10); font-weight:800; }
.rd-movers { font:700 10px/1 var(--sans); letter-spacing:.04em; text-transform:uppercase;
  color:var(--gold); display:inline-flex; align-items:center; gap:4px; }
.rd-movers .ti { font-size:12px; }
/* the desk's presence on this field — the expert layer's race-header count, steel-blue */
.rd-desk { font:700 10px/1 var(--sans); letter-spacing:.04em; text-transform:uppercase;
  color:#2e5f7f; display:inline-flex; align-items:center; gap:4px; cursor:help; }
/* MONEY ON THE CLOCK — a read on the market's behaviour, calm: gold-adjacent when the
   money follows proven speed, quiet claret when it tells a different story */
.rd-onclock { font:700 10px/1 var(--sans); letter-spacing:.06em; text-transform:uppercase;
  color:var(--gold-deep,#9a7d3c); border:1px solid color-mix(in srgb, var(--gold) 50%, transparent);
  background:rgba(200,164,93,.10); border-radius:999px; padding:4px 9px;
  display:inline-flex; align-items:center; gap:4px; white-space:nowrap; }
.rd-onclock .ti, .rd-offclock .ti { font-size:12px; }
.rd-offclock { font:600 10px/1 var(--sans); letter-spacing:.06em; text-transform:uppercase;
  color:#8a3b26; border:1px solid rgba(153,60,29,.28); background:rgba(153,60,29,.06);
  border-radius:999px; padding:4px 9px; display:inline-flex; align-items:center; gap:4px;
  white-space:nowrap; }
/* the day strip beside the board title */
.rd-clockstrip { font:600 11px/1.2 var(--sans); color:var(--ink);
  display:inline-flex; align-items:center; gap:5px; white-space:nowrap; }
.rd-clockstrip .ti { font-size:13px; color:var(--gold-deep,#9a7d3c); }
.rd-clockstrip b { color:var(--gold-deep,#9a7d3c); }
.rd-record { font:700 10px/1 var(--sans); letter-spacing:.04em; color:var(--navy);
  display:inline-flex; align-items:center; gap:5px; }
.rd-record .ti { color:var(--gold); font-size:13px; }
.rd-record .rd-record-n { color:var(--muted); font-weight:600; }
.ec-wrap { flex:1; display:flex; flex-wrap:wrap; gap:6px 12px; align-items:center;
  font-size:11.5px; color:var(--muted); }
.ec { white-space:nowrap; } .ec b { color:var(--navy); font-weight:700; }
.ec.pace b { color:var(--gold); }
.ec b.held, .ec-held { color:var(--oxblood); font-weight:700; font-size:10.5px;
  letter-spacing:.04em; }
@media (max-width:760px){ .entrant-row{flex-wrap:wrap} .ec-wrap{width:100%} }

/* ============================================================ my stable */
.stable-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr));
  gap:18px; }
.stable-card .sc-head { display:flex; align-items:flex-start; gap:14px; }
.stable-card .sc-name { flex:1; }
.stable-card .sc-name h3 { font-family:var(--serif); font-size:19px; color:var(--navy);
  font-weight:700; cursor:pointer; }
.stable-card .sc-name h3:hover { color:var(--gold); }
.stable-card .sc-rec { font-size:11.5px; color:var(--muted); margin-top:3px; }
.stable-card .sc-sub { font-size:11px; color:var(--slate); margin-top:2px; letter-spacing:.02em; }
.sbars { margin-top:14px; display:flex; flex-direction:column; gap:7px; }
.sbar { display:flex; align-items:center; gap:10px; }
.sbar .sbl { width:92px; font:600 10.5px/1 var(--sans); letter-spacing:.04em;
  text-transform:uppercase; color:var(--ink); }
.sbar .strack { flex:1; height:7px; background:rgba(21,21,21,.08); border-radius:5px;
  overflow:hidden; }
.sbar .strack > i { display:block; height:100%; border-radius:5px;
  background:linear-gradient(90deg,var(--green),var(--gold)); }
.sbar.held .strack { background:repeating-linear-gradient(45deg,
  rgba(90,30,43,.13),rgba(90,30,43,.13) 5px,transparent 5px,transparent 10px); }
.oncard { display:inline-block; margin-top:14px; font:600 10.5px/1 var(--sans);
  letter-spacing:.04em; text-transform:uppercase; color:var(--green);
  background:rgba(11,61,46,.10); padding:6px 10px; border-radius:999px; cursor:pointer; }
.oncard:hover { background:rgba(11,61,46,.18); }

/* ---------------------------------------------------------------- trust & coverage */
.cov-summary { font-family:var(--serif); font-size:18px; color:var(--navy); font-weight:700;
  margin-bottom:16px; }
.cov-win { font:400 12px/1.5 var(--sans); color:var(--muted); margin-top:4px; }
.cov-ch { margin-bottom:14px; }
.cov-top { display:flex; justify-content:space-between; align-items:baseline; margin-bottom:5px; }
.cov-lab { font:600 13px/1 var(--sans); color:var(--ink); }
.cov-pct { font:700 14px/1 var(--serif); color:var(--gold); }
.cov-track { height:9px; background:rgba(21,21,21,.08); border-radius:5px; overflow:hidden; }
.cov-track > i { display:block; height:100%; border-radius:5px;
  background:linear-gradient(90deg,var(--green),var(--gold)); }
.cov-reason { font-size:11px; color:var(--muted); margin-top:5px; }
.cov-reason b { color:var(--oxblood); font-weight:700; }
.cov-ledger { font-size:13.5px; color:var(--ink); margin-bottom:12px; }
.cov-states { display:flex; flex-wrap:wrap; gap:8px 10px; align-items:center; }
.cov-states .cov-sn { font:700 12px/1 var(--sans); color:var(--navy); margin-left:3px; }
.cov-card-img { width:100%; max-width:640px; border-radius:12px; display:block;
  box-shadow:0 10px 30px -14px rgba(7,26,47,.4); }

/* card / seal links (horse + race views) */
.cardlink { font:600 11px/1 var(--sans); letter-spacing:.04em; color:var(--green);
  border:1px solid var(--line); border-radius:999px; padding:4px 9px; cursor:pointer;
  white-space:nowrap; transition:all .15s; }
.cardlink:hover { background:var(--navy); color:var(--ivory); border-color:var(--navy); }
.cardlink.dl-busy { opacity:.6; cursor:progress; background:var(--paper); color:var(--muted); }
.run-links { margin-left:auto; display:flex; gap:8px; align-items:center; }
.seallink { font:600 10px/1 var(--sans); letter-spacing:.03em; color:var(--muted);
  white-space:nowrap; cursor:pointer; }
.seallink:hover { color:var(--gold); }
td.vcell { white-space:nowrap; }
td.vcell .seallink { margin-left:7px; opacity:.6; }
td.vcell:hover .seallink { opacity:1; }

/* ── Competitive zones — where its earned speed meets the winning baseline ───── */
.zsub { font-size:11px; color:var(--muted); margin-left:auto; font-style:italic; }
.zbest { font-size:13px; color:var(--ink); background:rgba(11,61,46,.06);
  border-left:3px solid var(--green); padding:8px 11px; border-radius:6px; margin-bottom:13px; }
.zrows { display:flex; flex-direction:column; gap:8px; }
.zrow { display:grid; grid-template-columns:148px 112px minmax(70px,1fr) auto 64px;
  align-items:center; gap:11px; font-size:12px; }
.zlab { font-weight:600; color:var(--ink); }
.zchip { font-size:9.5px; font-weight:700; text-transform:uppercase; letter-spacing:.04em;
  padding:3px 8px; border-radius:999px; text-align:center; white-space:nowrap; }
.z-win { background:rgba(11,61,46,.14); color:var(--green); }
.z-place { background:rgba(200,164,93,.20); color:#7a5a1e; }
.z-outclassed { background:rgba(90,30,43,.12); color:var(--oxblood); }
.z-withheld { background:rgba(107,114,128,.14); color:var(--muted); }
.zwin { height:7px; border-radius:999px; background:rgba(7,26,47,.07); overflow:hidden; }
.zwin i { display:block; height:100%; border-radius:999px; }
.zwin i.z-win { background:var(--green); }
.zwin i.z-place { background:var(--gold); }
.zwin i.z-outclassed { background:var(--oxblood); }
.zmeta { color:var(--muted); white-space:nowrap; }
.zspd { text-align:right; font-weight:700; color:var(--navy); }
.ztags { margin-top:14px; display:flex; flex-wrap:wrap; gap:6px; align-items:center; }
.ztags-lab { font-size:11px; color:var(--muted); margin-right:4px; }
.ztag { font-size:11px; padding:3px 9px; border-radius:999px; border:1px solid var(--line);
  color:var(--ink); }
.ztag.z-outclassed { color:var(--oxblood); }
.zheld { margin-top:11px; font-size:11px; color:var(--muted); }
@media (max-width:720px){ .zrow{ grid-template-columns:1fr auto; row-gap:4px; }
  .zwin,.zmeta{ grid-column:1 / -1; } }

/* ---- Jockey Intelligence ------------------------------------------------ */
.jk-card { cursor:pointer; transition:border-color .15s, transform .15s; }
.jk-card:hover { border-color:var(--gold); transform:translateY(-2px); }
.jk-card:focus-visible { outline:2px solid var(--gold); outline-offset:2px; }
#view-jockey .selectline { margin-bottom:18px; }
#jockey-search, #track-search { width:100%; max-width:340px; padding:9px 12px; font:inherit; font-size:13px;
  color:var(--ink); background:rgba(255,255,255,.04); border:1px solid var(--line);
  border-radius:8px; }
#jockey-search:focus, #track-search:focus { outline:none; border-color:var(--gold); }
#view-track .selectline { margin-bottom:18px; }
.jk-detail { margin-bottom:22px; }
.jk-horse { color:var(--ink); text-decoration:none; border-bottom:1px dotted var(--muted); }
.jk-horse:hover { color:var(--gold); border-bottom-color:var(--gold); }
.jk-hd { display:flex; align-items:center; gap:10px; }
.jk-avatar { display:inline-flex; align-items:center; justify-content:center; border-radius:50%;
  font-weight:700; letter-spacing:.01em; position:relative; overflow:hidden; flex:0 0 auto; }
.jk-av-sm { width:34px; height:34px; font-size:13px; }
.jk-av-lg { width:54px; height:54px; font-size:20px; }
.jk-av-real { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.jk-apprentice { font-size:9px; letter-spacing:.08em; text-transform:uppercase; color:var(--gold);
  border:1px solid var(--gold); border-radius:4px; padding:1px 5px; vertical-align:middle; }
.jk-stylebar { display:flex; height:12px; border-radius:6px; overflow:hidden; background:rgba(0,0,0,.12); }
.jk-stylebar span { display:block; height:100%; }
.jk-stylekey { display:flex; flex-wrap:wrap; gap:12px; margin-top:8px; font-size:11px; color:var(--muted); }
.jk-stylekey i { display:inline-block; width:9px; height:9px; border-radius:2px; margin-right:5px;
  vertical-align:middle; }
/* filterable speed-signature controls (distance / horse / jockey) */
.sig-controls { display:flex; flex-wrap:wrap; gap:10px; margin-bottom:12px; }
.sig-controls select { font:inherit; font-size:12.5px; color:var(--ink); background:var(--paper);
  border:1px solid var(--line); border-radius:8px; padding:7px 11px; cursor:pointer; max-width:280px; }
.sig-controls select:focus { outline:none; border-color:var(--gold); }
/* the career / ride / stable signature now rides on the same dark instrument stage as the
   race profile — gold-standard speed UI everywhere */
.sig-chart { min-height:120px; margin:2px 0 6px; padding:10px 14px 6px; border-radius:14px;
  background:radial-gradient(130% 150% at 50% -10%, #0d2c49 0%, #08203a 55%, #06131f 100%);
  box-shadow:0 14px 34px rgba(7,26,47,.30), inset 0 1px 0 rgba(255,255,255,.06); }
.sig-chart .empty { color:rgba(231,222,200,.6); }
/* The Journey · running-style signature — identity chips + the replay dot */
.jsig-chips { display:flex; flex-wrap:wrap; gap:7px; margin:12px 0 0; }
.jchip { font:700 10px/1 var(--sans); letter-spacing:.09em; text-transform:uppercase; padding:6px 10px;
  border-radius:999px; border:1px solid var(--line-soft); background:#fff; color:var(--navy); }
.jchip .k { color:var(--muted); font-weight:600; margin-right:6px; }
.jchip-win { background:var(--navy); border-color:var(--navy); color:#fff; }
.jchip-win .k { color:rgba(231,236,247,.7); }
@media (prefers-reduced-motion: reduce) { .jrep { display:none; } }

/* ---------------------------------------------------------------- compare */
.cmp-kinds { display:flex; gap:8px; flex-wrap:wrap; margin-bottom:16px; }
.cmp-kind { font:600 12px/1 var(--sans); letter-spacing:.08em; text-transform:uppercase;
  color:var(--ink); background:#fff; border:1px solid var(--line-soft); border-radius:999px;
  padding:9px 16px; cursor:pointer; transition:.15s; }
.cmp-kind:hover { border-color:var(--gold); }
.cmp-kind.on { background:var(--navy); color:var(--ivory); border-color:var(--navy); }
.cmp-addrow { display:flex; gap:12px; align-items:flex-start; margin-bottom:14px; flex-wrap:wrap; }
.cmp-add { position:relative; flex:1; min-width:240px; }
#cmp-search { width:100%; background:#fff; border:1px solid var(--line-soft); border-radius:10px;
  padding:11px 14px; font-size:14px; outline:none; }
#cmp-search:focus { border-color:var(--gold); }
.cmp-results { position:absolute; z-index:30; left:0; right:0; top:46px; background:#fff;
  border:1px solid var(--line); border-radius:10px; box-shadow:var(--shadow); overflow:hidden;
  display:none; max-height:320px; overflow-y:auto; }
.cmp-results.on { display:block; }
.cmp-opt { padding:10px 14px; font-size:13.5px; cursor:pointer; border-bottom:1px solid var(--line-soft); }
.cmp-opt:last-child { border-bottom:0; }
.cmp-opt:hover { background:rgba(200,164,93,.12); }
.cmp-opt.empty { color:var(--muted); cursor:default; }
.cmp-twinbtn { font:700 12px/1 var(--sans); letter-spacing:.06em; color:var(--navy);
  background:var(--gold); border:1px solid var(--gold); border-radius:10px; padding:11px 18px;
  cursor:pointer; white-space:nowrap; transition:.15s; }
.cmp-twinbtn:hover:not(:disabled) { background:var(--gold-soft); }
.cmp-twinbtn:disabled { opacity:.4; cursor:not-allowed; }
.cmp-chips { display:flex; gap:8px; flex-wrap:wrap; margin-bottom:18px; min-height:20px; }
.cmp-chip { display:inline-flex; align-items:center; gap:8px; background:#fff;
  border:1px solid var(--line-soft); border-radius:999px; padding:6px 8px 6px 14px; font-size:13px; }
.cmp-twinbadge { font:700 9.5px/1 var(--sans); letter-spacing:.04em; text-transform:uppercase;
  color:#8a6d2f; background:rgba(200,164,93,.2); border-radius:999px; padding:3px 7px; }
.cmp-x { border:none; background:rgba(7,26,47,.07); color:var(--ink); width:20px; height:20px;
  border-radius:50%; cursor:pointer; font-size:14px; line-height:1; }
.cmp-x:hover { background:var(--oxblood); color:#fff; }
.cmp-tablewrap { overflow-x:auto; }
.cmp-table { width:100%; border-collapse:collapse; font-size:13px; }
.cmp-table th, .cmp-table td { padding:9px 12px; text-align:left; border-bottom:1px solid var(--line-soft);
  white-space:nowrap; }
.cmp-table thead th { font-family:var(--serif); font-size:13.5px; color:var(--navy); font-weight:700;
  border-bottom:1px solid var(--line); }
.cmp-table .cmp-statcol { font-size:10px; letter-spacing:.1em; text-transform:uppercase;
  color:var(--muted); font-weight:700; background:var(--paper); position:sticky; left:0; }
.cmp-dot { display:inline-block; width:9px; height:9px; border-radius:50%; margin-right:7px; vertical-align:middle; }
.cmp-legendrow { display:flex; gap:16px; flex-wrap:wrap; justify-content:center; margin:10px 0 4px; }
.cmp-legend { font-size:12px; color:var(--ink); display:inline-flex; align-items:center; gap:6px; }
.cmp-legend i { width:11px; height:11px; border-radius:3px; display:inline-block; }
.cmp-toast { position:fixed; bottom:28px; left:50%; transform:translateX(-50%) translateY(20px);
  background:var(--navy); color:var(--ivory); padding:13px 20px; border-radius:10px; font-size:13.5px;
  box-shadow:var(--shadow); border:1px solid var(--gold); opacity:0; pointer-events:none;
  transition:.3s; z-index:60; max-width:90vw; }
.cmp-toast.on { opacity:1; transform:translateX(-50%) translateY(0); }

/* embedded (per-page) compare widget */
.cmp-embed { margin-top: 18px; }
.cmp-card .bd { padding-top: 14px; }
.cmp-clear { font:600 12px/1 var(--sans); color:var(--muted); background:transparent;
  border:1px solid var(--line-soft); border-radius:10px; padding:11px 14px; cursor:pointer; }
.cmp-clear:hover { border-color:var(--oxblood); color:var(--oxblood); }
.cmp-chip.cmp-seed { border-color:var(--gold); box-shadow:0 0 0 1px var(--gold) inset; }

/* ＋ compare toggle on roster cards (jockey / trainer / track) */
.cmp-pick { flex:none; width:24px; height:24px; border-radius:50%; cursor:pointer;
  border:1px solid var(--line); background:#fff; color:var(--navy);
  font:700 13px/1 var(--sans); display:inline-flex; align-items:center; justify-content:center;
  transition:.15s; padding:0; }
.cmp-pick:hover { border-color:var(--gold); background:rgba(200,164,93,.14); }
.cmp-pick.on { background:var(--green); border-color:var(--green); color:#fff; }

/* over-raced warning tag (behavioural) */
.srtag.tag-warn { background:rgba(184,110,40,.15); color:#9a5a1e; }

/* ---- % speed signal + run-position pie (jockey & trainer) --------------- */
.jk-sig { display:flex; align-items:baseline; gap:10px; flex-wrap:wrap; }
.jk-sigbig { font-size:20px; font-weight:700; font-variant-numeric:tabular-nums; }
.jk-sigsub { font-size:11px; color:var(--muted); }
.jk-pie-wrap { display:flex; align-items:center; gap:20px; flex-wrap:wrap; margin-top:4px; }
.jk-pie { width:120px; height:120px; flex:0 0 auto; }
.jk-pie path, .jk-pie circle { stroke:#fff; stroke-width:1.5; }
.jk-pie-key { display:flex; flex-direction:column; gap:6px; font-size:12.5px; color:var(--ink); }
.jk-pie-key i { display:inline-block; width:11px; height:11px; border-radius:3px; margin-right:8px; vertical-align:middle; }

/* condition + trajectory chips on the horse head */
.chip.cond { background:rgba(7,26,47,.08); color:var(--navy); }
.chip.trend-up { background:rgba(11,61,46,.14); color:var(--green); }
.chip.trend-down { background:rgba(184,110,40,.16); color:#9a5a1e; }
.chip.trend-flat { background:rgba(7,26,47,.06); color:var(--muted); }

/* ── Admin panel ─────────────────────────────────────────────────────────── */
.admin-card { background:var(--paper); border:1px solid var(--line-soft); border-radius:10px; padding:28px 32px; max-width:600px; margin-top:24px; }
.admin-section-title { font-family:var(--serif); font-size:17px; font-weight:700; color:var(--navy); margin-bottom:8px; }
.admin-desc { font-size:13.5px; color:var(--muted); line-height:1.6; margin-bottom:20px; }
.admin-row { display:flex; align-items:center; gap:12px; flex-wrap:wrap; }
.admin-label { font-size:13px; font-weight:600; color:var(--ink); white-space:nowrap; }
.admin-input { width:72px; padding:7px 10px; border:1px solid var(--line); border-radius:5px; font-size:14px; background:#fff; color:var(--ink); }
.admin-btn { padding:8px 20px; background:var(--navy); color:var(--ivory); border:none; border-radius:5px; font-size:13.5px; font-weight:600; cursor:pointer; transition:background .15s; }
.admin-btn:hover { background:var(--navy-2); }
.admin-btn:disabled { opacity:.5; cursor:default; }
.seed-status { margin-top:20px; border-top:1px solid var(--line-soft); padding-top:16px; }
.seed-state-row { display:flex; align-items:center; gap:8px; margin-bottom:10px; font-size:14px; font-weight:600; color:var(--ink); }
.seed-dot { width:10px; height:10px; border-radius:50%; background:var(--muted); flex-shrink:0; }
.seed-dot.running { background:var(--gold); animation:pulse 1s ease-in-out infinite; }
.seed-dot.done { background:#16a34a; }
.seed-dot.error { background:var(--oxblood); }
.seed-log { font-family:monospace; font-size:12.5px; color:var(--muted); line-height:1.8; }
.seed-log-line::before { content:"› "; color:var(--gold); }

/* ── THE SPEED SIGNATURE — GALLOP's speed icon, consistent on every intelligence page ── */
.sig-card { position:relative; }
.sig-card::before {            /* a thin gold spine marks it as the signature card */
  content:""; position:absolute; left:0; top:0; bottom:0; width:3px;
  background:linear-gradient(var(--gold),var(--gold-soft)); border-radius:14px 0 0 14px; }
/* ---- GALLOP Intelligence — the proven-truths page ---- */
#view-intel { max-width:1120px; }
.iq-hero { padding:4px 0 22px; border-bottom:1px solid var(--line); margin-bottom:28px; }
.iq-hero-t { font-family:var(--serif); font-size:30px; font-weight:700; color:var(--navy); letter-spacing:-.01em; line-height:1.05; }
.iq-hero-s { font-size:15px; color:var(--ink); margin-top:9px; max-width:660px; line-height:1.55; }
.iq-hero-scale { font-size:12px; color:var(--muted); margin-top:15px; letter-spacing:.03em; }
.iq-hero-scale b { color:var(--navy); font-variant-numeric:tabular-nums; }
.iq-theme { margin-bottom:30px; }
.iq-theme-h { font:700 11px/1 var(--sans); letter-spacing:.16em; text-transform:uppercase;
  color:var(--gold-deep,#9a7d3c); margin:0 0 14px; }
.iq-cards { display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:14px; }
.iq-card { border:1px solid var(--line); border-radius:14px; padding:18px 18px 15px;
  background:linear-gradient(180deg,rgba(200,164,93,.05),transparent); display:flex; flex-direction:column; }
.iq-stat { font-family:var(--serif); font-size:29px; font-weight:700; color:var(--navy); line-height:1;
  letter-spacing:-.01em; font-variant-numeric:tabular-nums; }
.iq-stat span { display:block; font-family:var(--sans); font-size:10.5px; font-weight:600; letter-spacing:.03em;
  text-transform:uppercase; color:var(--muted); margin-top:7px; }
.iq-head { font-size:16px; font-weight:700; color:var(--navy); margin-top:15px; line-height:1.25; }
.iq-body { font-size:13.5px; color:var(--ink); margin-top:7px; line-height:1.55; flex:1; }
.iq-ev { font-size:11px; color:var(--muted); margin-top:13px; display:flex; align-items:center; gap:6px;
  font-variant-numeric:tabular-nums; }
.dot-ev { width:5px; height:5px; border-radius:50%; background:var(--gold); flex:none; }
/* feature sections — the five speeds + the carry effect */
.iq-feature { border:1px solid var(--line); border-radius:16px; padding:22px 22px 18px; margin-bottom:26px;
  background:linear-gradient(180deg,rgba(200,164,93,.05),transparent); }
.iq-feat-h { font-family:var(--serif); font-size:22px; font-weight:700; color:var(--navy); margin:0 0 8px; letter-spacing:-.01em; }
.iq-feat-s { font-size:14px; color:var(--ink); line-height:1.55; max-width:720px; margin-bottom:18px; }
.iq-feat-foot { font-size:12px; color:var(--muted); line-height:1.5; margin-top:16px; }
.iq-feat-foot b, .iq-feat-s b { color:var(--navy); }
.iq-speeds, .iq-carry { display:flex; flex-direction:column; gap:11px; }
.iq-sp, .iq-cr { display:grid; grid-template-columns:210px 1fr 132px; gap:14px; align-items:center; }
.iq-sp-name { font-size:14px; font-weight:700; color:var(--navy); }
.iq-sp-name span { display:block; font-size:10.5px; font-weight:400; color:var(--muted); margin-top:2px; line-height:1.3; }
.iq-sp-bar, .iq-cr-bar { position:relative; height:16px; background:var(--surface-0,rgba(7,26,47,.05)); border-radius:8px; overflow:hidden; }
.iq-sp-bar i, .iq-cr-bar i { position:absolute; left:0; top:0; bottom:0; border-radius:8px; display:block; }
.iq-sp-spine i { background:linear-gradient(90deg,var(--gold),var(--gold-soft)); }
.iq-sp-body  i { background:var(--green); }
.iq-sp-resid i { background:#3f7a5e; }
.iq-sp-flash i { background:#b9bdc6; }
.iq-sp-meta { text-align:right; font-variant-numeric:tabular-nums; }
.iq-sp-meta b { font-family:var(--serif); font-size:16px; color:var(--navy); }
.iq-sp-meta span { display:block; font-size:10px; text-transform:uppercase; letter-spacing:.04em; color:var(--muted); margin-top:2px; }
.iq-cr-lab { font-size:13px; color:var(--navy); } .iq-cr-lab b { font-weight:700; } .iq-cr-lab span { color:var(--muted); font-size:11px; }
.iq-cr-good i { background:linear-gradient(90deg,#1f7a52,#34b97e); }
.iq-cr-bad  i { background:linear-gradient(90deg,#d56b7c,#b3505f); }
.iq-cr-ghost .iq-cr-bar i { background:#c9ccd2; } .iq-cr-ghost { opacity:.72; }
.iq-cr-v { text-align:right; font-family:var(--serif); font-size:16px; font-weight:700; color:var(--navy); font-variant-numeric:tabular-nums; }
@media (max-width:640px){ .iq-sp, .iq-cr { grid-template-columns:1fr 88px; } .iq-sp-bar, .iq-cr-bar { grid-column:1/-1; order:3; } }
/* the market vs the clock — paired-answer ladders (RESTORED from #116 after #118's squash) */
.iq-mkt { display:flex; flex-direction:column; gap:20px; }
.iq-mkt-grp { display:flex; flex-direction:column; gap:11px; }
.iq-mkt-q { font:700 11px/1 var(--sans); letter-spacing:.16em; text-transform:uppercase; color:var(--muted); }
.iq-mkt-foot { font-size:12px; color:var(--muted); line-height:1.5; margin-top:2px; max-width:720px; }
.iq-mkt-foot b { color:var(--navy); }
.iq-cr-mkt i { background:linear-gradient(90deg,var(--gold),var(--gold-soft)); }
.iq-key { display:inline-block; width:18px; height:8px; border-radius:4px; vertical-align:middle; margin-right:4px; }
.iq-key-mkt { background:linear-gradient(90deg,var(--gold),var(--gold-soft)); }
.iq-key-clk { background:linear-gradient(90deg,#1f7a52,#34b97e); }
/* the pattern — rank cliff + market x speed heat grid (RESTORED from #117) */
.iq-cliff { display:flex; flex-direction:column; gap:6px; }
.iq-cliff-row { display:grid; grid-template-columns:38px 1fr 1fr; gap:12px; align-items:center; }
.iq-cliff-head { font-size:10.5px; font-weight:600; letter-spacing:.04em; text-transform:uppercase; color:var(--muted); margin-bottom:2px; }
.iq-cliff-r { font-size:12px; font-weight:700; color:var(--muted); font-variant-numeric:tabular-nums; }
.iq-cliff-cell { display:grid; grid-template-columns:1fr 46px; gap:8px; align-items:center; }
.iq-cliff-cell span { font-size:11.5px; font-weight:600; color:var(--navy); font-variant-numeric:tabular-nums; text-align:right; }
.iq-cliff-bar { position:relative; height:11px; background:var(--surface-0,rgba(7,26,47,.05)); border-radius:6px; overflow:hidden; }
.iq-cliff-bar i { position:absolute; left:0; top:0; bottom:0; border-radius:6px; display:block; }
.iq-heat { display:flex; flex-direction:column; gap:4px; }
.iq-heat-row { display:grid; grid-template-columns:110px repeat(4,1fr); gap:4px; }
.iq-heat-head div { font-size:10.5px; font-weight:600; letter-spacing:.04em; text-transform:uppercase; color:var(--muted); text-align:center; align-self:end; padding-bottom:2px; }
.iq-heat-lab { font-size:12px; font-weight:700; color:var(--navy); align-self:center; }
.iq-heat-cell { border-radius:8px; padding:9px 0; text-align:center; font-size:13px; font-weight:700; font-variant-numeric:tabular-nums; }
@media (max-width:640px){ .iq-heat-row { grid-template-columns:82px repeat(4,1fr); } .iq-cliff-row { grid-template-columns:30px 1fr 1fr; gap:8px; } .iq-cliff-cell { grid-template-columns:1fr 40px; gap:5px; } }
/* swap-the-lens table */
.iq-lens { display:flex; flex-direction:column; gap:5px; }
.iq-lens-row { display:grid; grid-template-columns:1.6fr 1fr 1fr 1fr 1.2fr; gap:8px; align-items:center;
  padding:7px 10px; border-radius:10px; font-size:13px; font-weight:700; color:var(--navy);
  font-variant-numeric:tabular-nums; text-align:right; }
.iq-lens-row > div:first-child { text-align:left; }
.iq-lens-head { font-size:10.5px; font-weight:600; letter-spacing:.04em; text-transform:uppercase;
  color:var(--muted); padding-top:0; padding-bottom:2px; }
.iq-lens-row:not(.iq-lens-head) { background:var(--surface-0,rgba(7,26,47,.04)); }
.iq-lens-ref { border:1px solid var(--gold); background:rgba(200,164,93,.10) !important; }
.iq-lens-name { font-size:13px; font-weight:700; color:var(--navy); }
.iq-lens-name span { display:block; font-size:10.5px; font-weight:400; color:var(--muted); margin-top:1px; }
@media (max-width:640px){ .iq-lens-row { grid-template-columns:1.4fr .8fr .9fr .8fr 1fr; gap:5px; font-size:12px; padding:6px 7px; } .iq-lens-head { font-size:9px; } .iq-lens-name span { display:none; } }
.iq-brand { text-align:center; font:700 10px/1 var(--sans); letter-spacing:.22em; color:var(--muted);
  margin:36px 0 12px; opacity:.68; }

/* ---- MARKET INTELLIGENCE — the market's form guide. Steel-blue throughout, never gold:
   these scores are the market graded against the result — two external voices with no
   GALLOP clock in them (gold is reserved for reads that carry our clock). Upsets and
   withheld headlines are stated plainly, in the same claret the doctrine uses. ---- */
#view-market { max-width:1120px; }
.mi-hero { padding:4px 0 24px; border-bottom:1px solid var(--line); margin-bottom:24px; }
.mi-hero-t { font-family:var(--serif); font-size:30px; font-weight:700; color:var(--navy);
  letter-spacing:-.01em; line-height:1.05; }
.mi-hero-s { font-size:15px; color:var(--ink); margin-top:9px; max-width:720px; line-height:1.55; }
.mi-hero-s b { color:#2e5f7f; }
.mi-national { display:grid; grid-template-columns:repeat(auto-fit,minmax(190px,1fr)); gap:12px;
  margin-top:20px; }
.mi-cell { border:1px solid rgba(127,155,181,.45); border-radius:14px; padding:15px 16px;
  background:linear-gradient(180deg,rgba(157,180,201,.13),transparent); }
.mi-cell-big { border-color:#2e5f7f; box-shadow:inset 0 0 0 1px rgba(46,95,127,.25); }
.mi-cell-v { font-family:var(--serif); font-size:31px; font-weight:700; color:#2e5f7f; line-height:1; }
.mi-cell-l { font:700 10.5px/1 var(--sans); letter-spacing:.14em; text-transform:uppercase;
  color:var(--navy); margin-top:8px; }
.mi-cell-n { font-size:10.5px; color:var(--muted); margin-top:6px; font-variant-numeric:tabular-nums;
  line-height:1.45; }
.mi-trendwrap { margin-top:20px; }
.mi-trend-h { font:600 10px/1.4 var(--sans); letter-spacing:.1em; text-transform:uppercase;
  color:var(--muted); margin-bottom:8px; }
.mi-trend { display:flex; align-items:flex-end; gap:3px; height:74px; }
.mi-bar { flex:1; max-width:34px; height:100%; position:relative; display:flex; align-items:flex-end; }
.mi-bar i { display:block; width:100%; border-radius:3px 3px 0 0; background:linear-gradient(180deg,#4a7d9f,#2e5f7f); }
.mi-bar span { position:absolute; bottom:-14px; left:0; right:0; text-align:center;
  font:600 8.5px/1 var(--sans); color:var(--muted); }
.mi-card { margin-bottom:18px; }
.mi-rule { flex:1; height:1px; background:linear-gradient(90deg,rgba(46,95,127,.45),transparent);
  margin-left:14px; }
.mi-lead { font-size:12.5px; color:var(--muted); line-height:1.55; margin-bottom:12px; max-width:760px; }
/* meet rows — a form line each; open for the race-by-race verdicts */
.mi-meets { display:flex; flex-direction:column; }
.mi-meet { border-top:1px solid var(--line-soft); }
.mi-meet:first-child { border-top:0; }
.mi-meet-row { display:grid; grid-template-columns:86px minmax(150px,1.2fr) 76px minmax(230px,2fr) 18px;
  gap:12px; align-items:center; padding:9px 4px; cursor:pointer; }
.mi-meet-row:hover { background:rgba(157,180,201,.10); }
.mi-date { font-size:11.5px; color:var(--muted); }
.mi-track { font-size:13px; font-weight:600; color:var(--navy); white-space:nowrap; overflow:hidden;
  text-overflow:ellipsis; }
.mi-perf { font-family:var(--serif); font-size:16px; font-weight:700; color:#2e5f7f; text-align:right; }
.mi-perf.held { color:var(--oxblood); font-family:var(--sans); font-size:11px; font-style:italic; }
.mi-comp { font-size:11px; color:var(--muted); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.mi-comp .mi-f { color:#2e5f7f; } .mi-comp .mi-u { color:var(--oxblood); }
.mi-chev { color:var(--muted); font-size:10px; transition:transform .15s ease; text-align:center; }
.mi-meet.open .mi-chev { transform:rotate(180deg); }
.mi-meet-races { display:none; padding:2px 4px 12px; gap:6px; flex-wrap:wrap; }
.mi-meet.open .mi-meet-races { display:flex; }
.mi-race { display:inline-flex; align-items:center; gap:7px; border:1px solid var(--line-soft);
  border-radius:8px; padding:5px 9px; font-size:11px; color:var(--ink); background:var(--paper); }
.mi-race b { color:var(--navy); font-variant-numeric:tabular-nums; }
.mi-rho { font-size:10px; color:var(--muted); }
.mi-v { font:700 8.5px/1 var(--sans); letter-spacing:.09em; text-transform:uppercase;
  border-radius:4px; padding:2.5px 5px 2px; }
.mi-v-framed { color:#2e5f7f; border:1px solid rgba(127,155,181,.55); background:rgba(157,180,201,.16); }
.mi-v-mixed { color:var(--muted); border:1px solid var(--line-soft); background:rgba(21,21,21,.03); }
.mi-v-upset { color:#8a3b26; border:1px solid rgba(153,60,29,.30); background:rgba(153,60,29,.07); }
.mi-mv { font:700 9px/1 var(--sans); letter-spacing:.05em; text-transform:uppercase; }
.mi-mv.ok { color:#0B5C42; } .mi-mv.no { color:#8a3b26; }
.mi-floor { flex-basis:100%; font-size:10.5px; color:var(--oxblood); font-style:italic; }
/* the track league */
.mi-table { width:100%; border-collapse:collapse; font-size:12px; }
.mi-table th { font:700 9.5px/1 var(--sans); letter-spacing:.1em; text-transform:uppercase;
  color:var(--muted); text-align:left; padding:6px 8px; border-bottom:1px solid var(--line); }
.mi-table td { padding:7px 8px; border-bottom:1px solid var(--line-soft); }
.mi-table .mi-rank { color:var(--muted); font-size:10.5px; width:26px; }
.mi-perf-td { font-weight:700; color:#2e5f7f; }
.mi-gap td { text-align:center; color:var(--muted); font-size:10.5px; font-style:italic;
  padding:6px; border-bottom:1px solid var(--line-soft); }
/* the methodology block — the formula and the exclusions, in the house voice */
.mi-method p { font-size:12.5px; color:var(--ink); line-height:1.6; margin:0 0 11px; max-width:820px; }
.mi-method p b { color:var(--navy); }
.mi-method .mi-live { border-top:1px solid var(--line-soft); padding-top:11px; color:var(--muted); }
.mi-method .mi-live b { color:#2e5f7f; }
.mi-scale { font-size:11px; color:var(--muted); margin-top:8px; letter-spacing:.03em; }
@media (max-width:760px){
  .mi-meet-row { grid-template-columns:76px 1fr 66px 18px; }
  .mi-meet-row .mi-comp { grid-column:1/-1; padding-left:2px; }
}
/* ---- EXPERT INTELLIGENCE — the experts' form guide. Wears the market page's steel
   blue for the same reason: an expert graded against the result is external-vs-external,
   no GALLOP clock in the read, so it never wears gold. ---- */
#view-expert { max-width:1120px; }
#exwinfilter { margin:0 0 14px; }
#exwinfilter button.on { background:#2e5f7f; color:var(--ivory); border-color:#2e5f7f; }
.ex-table td { white-space:nowrap; }
.ex-table .held { color:var(--oxblood); font:italic 10.5px var(--sans); }
.ex-outlet { display:block; font-size:10px; color:var(--muted); margin-top:1px; }
.ex-up { color:#0B5C42; } .ex-dn { color:#8a3b26; }
.ex-n { font-size:9.5px; color:var(--muted); margin-left:2px; }
.ex-uf td { opacity:.6; }
.ex-last { font-size:10.5px; color:var(--muted); }
.ex-follow { border:0; background:none; cursor:pointer; font-size:15px; line-height:1;
  color:var(--muted); padding:2px 4px; }
.ex-follow.on { color:#2e5f7f; }
.ex-follow:hover { color:var(--navy); }
/* THE EXPERT FILE — the clickable name and the accountability page */
.ex-link { cursor:pointer; }
.ex-link:hover b, .ex-link:focus b { color:#2e5f7f; text-decoration:underline;
  text-underline-offset:2px; }
.ex-backrow { margin-bottom:8px; }
.ex-back { font:600 11px/1 var(--sans); letter-spacing:.05em; text-transform:uppercase;
  color:#2e5f7f; cursor:pointer; }
.ex-back:hover { text-decoration:underline; text-underline-offset:2px; }
.ex-follow-hero { font-size:22px; vertical-align:middle; margin-left:6px; }
.exf-grid { display:grid; grid-template-columns:1fr 1fr; gap:0 18px; align-items:start; }
@media (max-width:980px){ .exf-grid { grid-template-columns:1fr; } }
.ex-won { color:#2e5f7f; letter-spacing:.05em; }
.ex-scr, .ex-torun { color:var(--muted); font-size:10.5px; font-style:italic; }
.ex-chips { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:14px; }
.ex-chip { display:inline-flex; align-items:center; gap:7px; border:1px solid rgba(127,155,181,.45);
  border-radius:9px; padding:6px 10px; font-size:12px; color:var(--ink);
  background:linear-gradient(180deg,rgba(157,180,201,.13),transparent); }
.ex-chip b { color:var(--navy); }
.ex-chip i { font-style:normal; font-size:10px; color:var(--muted); }
.ex-form { display:flex; flex-wrap:wrap; gap:7px; align-items:center; }
.ex-form input, .ex-form select { border:1px solid var(--line); border-radius:8px;
  background:var(--paper); color:var(--ink); font:inherit; font-size:12.5px; padding:7px 9px; }
.ex-form input::placeholder { color:var(--muted); }
.ex-form .ex-rno { width:96px; }
.ex-form button { border:1px solid #2e5f7f; border-radius:8px; background:#2e5f7f;
  color:var(--ivory); font:600 12px var(--sans); letter-spacing:.04em; padding:8px 13px;
  cursor:pointer; }
.ex-form button:hover { background:#24506c; }
.ex-formnote { font-size:11.5px; color:var(--oxblood); margin-top:8px; min-height:14px; }
.ex-srctable td { vertical-align:top; }
.ex-srcd { font-size:11px; color:var(--muted); line-height:1.5; white-space:normal; }
.ex-wired { font:700 9px/1 var(--sans); letter-spacing:.08em; text-transform:uppercase;
  color:var(--ivory); background:#2e5f7f; border:1px solid #2e5f7f;
  border-radius:4px; padding:2.5px 5px 2px; white-space:nowrap; }
.ex-hist { font:700 9px/1 var(--sans); letter-spacing:.08em; text-transform:uppercase;
  color:#2e5f7f; border:1px solid rgba(127,155,181,.55); background:rgba(157,180,201,.16);
  border-radius:4px; padding:2.5px 5px 2px; white-space:nowrap; }
.ex-nohist { font:700 9px/1 var(--sans); letter-spacing:.08em; text-transform:uppercase;
  color:var(--muted); border:1px solid var(--line-soft); border-radius:4px;
  padding:2.5px 5px 2px; white-space:nowrap; }
/* shape-first LEAD: the horse's finishing character, ahead of the tiered hexagon */
.spd-char { border:1px solid var(--line); border-radius:12px; padding:11px 14px; margin-bottom:16px;
  background:linear-gradient(180deg,rgba(200,164,93,.08),transparent); }
.spd-char-lab { display:flex; align-items:center; gap:8px; font-family:var(--serif); font-size:19px;
  font-weight:700; color:var(--navy); line-height:1.1; }
.spd-char-mark { width:9px; height:9px; border-radius:50%; flex:none;
  background:linear-gradient(var(--gold),var(--gold-soft)); box-shadow:0 0 0 3px rgba(200,164,93,.18); }
.spd-char-gloss { font-size:13px; color:var(--ink); margin-top:5px; line-height:1.5; }
.spd-char-ev { font-size:10.5px; letter-spacing:.03em; color:var(--muted); margin-top:7px;
  font-variant-numeric:tabular-nums; }
.spd-char-ev b { color:var(--navy); } .spd-char-ev span { text-transform:none; letter-spacing:0; }
/* the signature hexagon is the HERO of the card — big on the left, the tiered
   dimension rows filling the whole remaining width beside it */
.sig-hero { display:grid; grid-template-columns:minmax(230px,400px) 1fr; gap:8px 44px; align-items:center; }
.sig-hexwrap { text-align:center; }
.sig-hexwrap .spdhex { width:100%; height:auto; max-width:400px; }
.spdhex { display:block; margin:0 auto; }
.spdhex-name { font-family:var(--serif); font-size:15px; letter-spacing:.05em; text-transform:uppercase;
  color:var(--navy); font-weight:700; margin-top:6px; }
.sig-dims { margin:0; min-width:0; }
.sig-dimhd { font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:var(--muted); margin-bottom:12px; }
.spd-tier { margin-top:15px; }
.spd-tierhd { display:flex; align-items:baseline; gap:8px; border-left:3px solid var(--tiercol,var(--gold));
  padding-left:9px; margin-bottom:5px; }
.spd-tierhd b { font-size:12.5px; color:var(--tiercol,var(--navy)); letter-spacing:.02em; }
.spd-tierhd span { font-size:11px; color:var(--muted); }
.spd-row { display:grid; grid-template-columns:168px 1fr 108px; align-items:center; gap:16px; padding:5.5px 0; }
.spd-row.dim { opacity:.62; }
.spd-row-lab { font-size:14px; color:var(--navy); letter-spacing:.01em; }
.spd-row-track { height:9px; background:rgba(21,21,21,.07); border-radius:6px; overflow:hidden; }
.spd-row-track > i { display:block; height:100%; border-radius:6px; }
.spd-row-g { text-align:right; font-size:12.5px; font-weight:600; color:var(--ink); white-space:nowrap; }
.spd-row.held .spd-row-g { color:var(--oxblood); }
.spd-row.held .spd-row-track { background:repeating-linear-gradient(45deg,
  rgba(90,30,43,.13),rgba(90,30,43,.13) 5px,transparent 5px,transparent 10px); }
/* the raw layer strip spreads under the hero, set off by a hairline */
.spd-stats { justify-content:space-between; max-width:860px; border-top:1px solid var(--line);
  margin-top:20px; padding-top:16px; }
.spd-stats .stat .n { font-size:26px; }
@media (max-width:900px){
  .sig-hero { grid-template-columns:1fr; }
  .sig-hexwrap .spdhex { max-width:340px; }
  .spd-row { grid-template-columns:118px 1fr 96px; gap:10px; }
  .spd-row-lab { font-size:12.5px; }
}
/* the race-level speed read (Race Intelligence) */
.rd-speedread { margin-top:16px; padding-top:14px; border-top:1px dashed rgba(7,26,47,.14); }
/* Race Intelligence / Race Day — field speed-profile overlay: leader tiles are the dimension
   selector (click to pop that dimension's leader in gold); the chart is interactive. */
.fl-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(120px,1fr)); gap:9px; margin-top:12px; }
.fl-tile { border:1px solid var(--line); border-radius:10px; padding:9px 11px; background:rgba(200,164,93,.04);
  text-align:left; font:inherit; cursor:pointer; transition:border-color .12s, background .12s; }
.fl-tile.on { border-color:var(--gold); background:rgba(200,164,93,.14); box-shadow:inset 0 0 0 1px var(--gold); }
.fl-lab { font-size:9px; letter-spacing:.09em; text-transform:uppercase; color:var(--muted); margin-bottom:3px; }
.fl-name { font-size:12.5px; font-weight:700; color:var(--navy); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.fl-val { font-family:var(--serif); font-size:17px; color:var(--gold); font-weight:700; margin-top:1px; }
/* click-to-reveal: the race profile expands from a clear, clickable bar — board stays scannable */
.ovx-toggle { display:flex; align-items:center; gap:10px; width:100%; text-align:left; cursor:pointer;
  background:linear-gradient(180deg, rgba(7,26,47,.035), rgba(7,26,47,.06)); border:1px solid var(--line);
  border-radius:11px; padding:11px 12px; margin-top:10px; font:inherit; transition:border-color .14s, background .14s; }
.ovx-toggle:hover { border-color:var(--gold); background:linear-gradient(180deg, rgba(200,164,93,.07), rgba(200,164,93,.12)); }
.ovx-chev { color:var(--gold); font-size:12px; transition:transform .18s ease; }
.ovx-toggle.open .ovx-chev { transform:rotate(90deg); }
.ovx-toglabel { font-size:11px; letter-spacing:.13em; text-transform:uppercase; color:var(--navy); font-weight:700; }
.ovx-toghint { font-size:10.5px; color:var(--muted); letter-spacing:.02em; }
.ovx-reveal { margin-left:auto; flex:0 0 auto; font-size:11px; font-weight:700; letter-spacing:.06em;
  text-transform:uppercase; color:var(--navy); background:var(--gold-soft); border-radius:999px; padding:4px 12px; }
.ovx-toggle:hover .ovx-reveal { background:var(--gold); }
.ovx-revchev { font-weight:700; }
.ovx-empty { cursor:default; background:rgba(7,26,47,.03); }
.ovx-empty:hover { border-color:var(--line); background:rgba(7,26,47,.03); }
.ovx-body[hidden] { display:none; }
/* the premium race-profile instrument: a dark stage, gold-glow curves, drop shadow for depth */
.ovx-stage { margin:8px 0 4px; padding:8px 12px 4px; border-radius:14px;
  background:radial-gradient(130% 150% at 50% -10%, #0d2c49 0%, #08203a 55%, #06131f 100%);
  box-shadow:0 14px 34px rgba(7,26,47,.30), inset 0 1px 0 rgba(255,255,255,.06); }
.ovx-svg { width:100%; height:auto; display:block; }
.ov-hit { cursor:pointer; }
.ovx-cap { min-height:16px; margin:8px 2px 0; font-size:11px; letter-spacing:.02em; color:var(--muted); }
.ovx-cap b { color:var(--navy); font-weight:700; }
.ovx-tip { position:fixed; z-index:9999; display:none; pointer-events:none; min-width:190px;
  background:linear-gradient(160deg,#0d2c49,#071a2f); color:var(--ivory);
  border:1px solid rgba(200,164,93,.55); border-radius:11px; padding:10px 12px;
  box-shadow:0 16px 40px rgba(0,0,0,.45); font-size:12px; }
.ovx-tiphead { display:flex; align-items:center; gap:8px; margin-bottom:7px; }
.ovx-tiphead .silk-sm { width:22px; height:22px; border-radius:5px; box-shadow:0 0 0 1px rgba(200,164,93,.4); flex:0 0 auto; }
.ovx-tipname { font-family:var(--serif); font-weight:700; color:#fff; font-size:13.5px; letter-spacing:.02em; }
.ovx-tiprow { display:flex; align-items:baseline; gap:12px; line-height:1.75; }
.ovx-tipk { color:var(--gold-soft); }
.ovx-tipv { color:#fff; font-variant-numeric:tabular-nums; margin-left:auto; }
.ovx-tipr { color:var(--gold); font-weight:700; min-width:36px; text-align:right; font-variant-numeric:tabular-nums; }
.ovx-tiphint { margin-top:7px; font-size:9px; letter-spacing:.1em; text-transform:uppercase; color:rgba(231,222,200,.5); }
@media (max-width:560px){ .fl-grid { grid-template-columns:repeat(2,1fr); } }
/* Race Day — form-by-frame overlay: each entrant's proven speed in the frame, best in gold */
.rd-frametoggle { display:inline-flex; align-items:center; gap:3px; margin-left:auto; }
.rd-frametoggle .rdf-lab { font-size:9.5px; letter-spacing:.1em; text-transform:uppercase; color:var(--muted); margin-right:5px; }
.rdf { font-size:11px; padding:2px 9px; border:1px solid var(--line); background:transparent;
  color:var(--muted); border-radius:999px; cursor:pointer; }
.rdf.on { background:var(--navy); color:var(--ivory); border-color:var(--navy); }
.fb { display:inline-flex; align-items:baseline; gap:4px; min-width:54px; justify-content:flex-end;
  font-size:12.5px; color:var(--ink); font-variant-numeric:tabular-nums; }
.fb b { font-weight:600; }
.fb-none { color:var(--muted); }
.fb-top b { color:var(--gold); font-weight:700; }
.fb-top .fb-adv { font-size:10px; font-weight:700; color:var(--gold);
  background:rgba(200,164,93,.14); border-radius:999px; padding:0 6px; }
.rd-formoverlay { margin:6px 0 10px; padding:8px 10px; background:rgba(7,26,47,.02);
  border:1px solid var(--line); border-radius:10px; }
.rd-formhd { display:flex; align-items:baseline; gap:8px; font-size:10px; letter-spacing:.1em;
  text-transform:uppercase; color:var(--muted); margin-bottom:4px; }
.rd-formhd b { color:var(--navy); }
.rd-formgold { margin-left:auto; color:var(--gold); font-weight:700; letter-spacing:.04em; }
.rd-formoverlay .spdcurve { width:100%; height:auto; }

/* Winner-vs-fastest — the race honesty banner (diagnostic, never a tip) */
.wvf{display:flex;gap:10px;align-items:flex-start;margin:12px 0 4px;padding:10px 13px;
  border-radius:9px;font-size:12.5px;line-height:1.5}
.wvf-tag{flex:none;font-weight:800;font-size:10.5px;letter-spacing:.04em;text-transform:uppercase;
  padding:3px 9px;border-radius:20px;white-space:nowrap;margin-top:1px}
.wvf-earned{background:rgba(11,61,46,.06);border:1px solid rgba(11,61,46,.18)}
.wvf-earned .wvf-tag{background:var(--green);color:var(--gold-soft)}
.wvf-soft{background:rgba(176,122,30,.09);border:1px solid rgba(176,122,30,.34)}
.wvf-soft .wvf-tag{background:#9a6a1a;color:#fff}
.wvf-grade{font-size:9.5px;font-weight:700;color:var(--green);border:1px solid rgba(11,61,46,.3);
  border-radius:10px;padding:0 6px;margin-left:2px;vertical-align:1px;cursor:help}
.wvf-grade.off{color:#9a6a1a;border-color:rgba(154,106,26,.4)}
/* Jockey uplift confidence band — horse-controlled rider read */
.jk-ci{font-size:11px;color:var(--muted);font-weight:600;margin-left:6px;vertical-align:2px}
.jk-verdict{display:inline-block;font-size:9.5px;font-weight:700;letter-spacing:.03em;
  text-transform:uppercase;border-radius:10px;padding:1px 7px;margin-left:7px;vertical-align:2px}
.jk-verdict.real{color:var(--green);background:rgba(11,61,46,.10);border:1px solid rgba(11,61,46,.28)}
.jk-verdict.noise{color:var(--muted);background:rgba(107,114,128,.10);border:1px solid rgba(107,114,128,.28)}

/* ================================================================ responsive
   Breakpoints:
     ≥ 1280px  desktop large   — full layout, no changes
     1024–1279 desktop small   — narrower sidebar, tighter padding
     768–1023  tablet / iPad   — nav collapses to off-canvas drawer
     < 768     phone           — compact header, single-column layout     */

/* ---- hamburger toggle button ------------------------------------------ */
.nav-toggle {
  display: none;
  flex-direction: column;
  justify-content: center;
  gap: 5px;
  width: 38px;
  height: 38px;
  padding: 8px;
  background: rgba(255,255,255,.06);
  border: 1px solid var(--line);
  border-radius: 9px;
  cursor: pointer;
  flex: none;
  transition: background .15s;
}
.nav-toggle:hover { background: rgba(255,255,255,.13); }
.nav-toggle span {
  display: block;
  height: 2px;
  background: var(--ivory);
  border-radius: 2px;
  transition: transform .22s ease, opacity .22s ease;
}
body.nav-open .nav-toggle span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
body.nav-open .nav-toggle span:nth-child(2) { opacity: 0; transform: scaleX(0); }
body.nav-open .nav-toggle span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* ---- nav backdrop — full-screen dimmer behind the off-canvas nav ------ */
.nav-backdrop {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(7,26,47,.5);
  z-index: 29;
  animation: backdrop-in .2s ease;
}
@keyframes backdrop-in { from { opacity:0 } to { opacity:1 } }

/* ---- small desktop (1024–1279px) -------------------------------------- */
@media (min-width:1024px) and (max-width:1279px) {
  .shell { grid-template-columns: 188px 1fr; }
  nav.side { padding: 16px 10px; }
  main { padding: 20px 22px 50px; }
}

/* ---- search input inside the nav drawer (tablet + phone only) --------- */
.nav-search-wrap { display: none; padding: 0 14px 14px; }
.nav-search {
  width: 100%; padding: 9px 12px; border-radius: 9px;
  border: 1px solid var(--line); background: #fff;
  font-size: 13px; color: var(--ink); outline: none;
}
.nav-search:focus { border-color: var(--gold); box-shadow: 0 0 0 2px rgba(200,164,93,.3); }

/* ---- tablet + phone (≤ 1023px): off-canvas nav ------------------------ */
@media (max-width:1023px) {
  .nav-toggle { display: flex; }
  .brand .tag { display: none; }
  #search { display: none; }
  .nav-search-wrap { display: block; }

  .shell { grid-template-columns: 1fr; }

  /* Prevent body scroll while the drawer is open */
  body.nav-open { overflow: hidden; }

  nav.side {
    position: fixed;
    left: 0; top: 0; bottom: 0;
    width: 260px;
    z-index: 30;
    transform: translateX(-100%);
    transition: transform .24s cubic-bezier(.4,0,.2,1);
    box-shadow: 4px 0 24px rgba(7,26,47,.25);
    overflow-y: auto;
    padding-top: 10px;
  }
  body.nav-open nav.side      { transform: translateX(0); }
  body.nav-open .nav-backdrop { display: block; }
}

/* ---- phone (< 768px): compact header and simplified grid layouts ------ */
@media (max-width:767px) {
  /* Header — pad the top by the safe-area inset so the navy bar fills behind the
     status bar / notch (black-translucent standalone) without content sliding under it */
  header.topbar { padding: calc(11px + env(safe-area-inset-top)) 14px 11px; gap: 10px; }
  main { padding-left: max(14px, env(safe-area-inset-left)); padding-right: max(14px, env(safe-area-inset-right)); }
  .brand .mark  { font-size: 22px; letter-spacing: .12em; }
  .statefilter button { padding: 6px 8px; font-size: 10px; letter-spacing: .06em; }
  .livestatus { display: none; }

  /* Content area */
  main { padding: 16px 14px 54px; }
  h2.viewtitle { font-size: 20px; }
  .viewsub { font-size: 12px; margin-bottom: 16px; }

  /* KPI tiles — a compact 2-column footer strip on phones (shrunk + trend arrows) */
  .kpis { grid-template-columns: repeat(2,1fr); gap: 7px; }
  .kpi { padding: 9px 11px; }
  .kpi .n { font-size: 18px; }
  .kpi-tr { font-size: 9px; padding: 2px 5px; }

  /* Grids already collapse at 1100px; stable grid to single column */
  .stable-grid { grid-template-columns: 1fr; }

  /* Select rows: vertical stack, full-width */
  .selectline { flex-direction: column; align-items: stretch; }
  .selectline select { min-width: unset; }

  /* Race-day entrant row: drop the four speed-dimension columns on phone. Horse · Jockey · Unit +
     the proven-pace pill stay; Top / Accel / Pace / Finish are hidden.
     Grid reflows to 8 columns: flag | barrier | silk | horse | jockey | unit | form | star */
  .entrant-row {
    padding:9px 12px; gap:10px;
    grid-template-columns: 16px 26px 28px minmax(66px,1fr) minmax(60px,0.8fr) 58px 82px 24px;
  }
  .entrant-row .rd-dim { display: none; }
  /* the AVERAGE MARKET cell folds away with the speed columns on phone — the full
     read lives in the runner tooltip and on the horse page; the row keeps its shape */
  .entrant-row .avgmkt-col { display: none; }
  /* hide the five speed-category headers (8th–12th child of the header row) */
  .entrant-row.rd-fieldhead > span:nth-child(8),
  .entrant-row.rd-fieldhead > span:nth-child(9),
  .entrant-row.rd-fieldhead > span:nth-child(10),
  .entrant-row.rd-fieldhead > span:nth-child(11),
  .entrant-row.rd-fieldhead > span:nth-child(12) { display: none; }

  /* Quaddie legs already use a 6-column grid; match the narrower name col */
  .quaddie-leg .entrant-row {
    grid-template-columns: 13px 24px 26px minmax(80px,1fr) 96px 22px;
  }

  /* Quaddie panel: stack legs vertically */
  .quaddie-mtg .bd.quaddie-legs { grid-template-columns: 1fr; }
  .quaddie-leg { border-right: 0; border-bottom: 1px solid var(--line-soft); }
  .quaddie-leg:last-child { border-bottom: 0; }

  /* Speed hero: compact */
  .speedhero { padding: 16px 18px; gap: 16px; }
  .speedhero .sh-big { font-size: 44px; }

  /* Race header: allow wrapping so chips don't fight for one line;
     hide the profile frame toggle (it controls hover-only speed curves) */
  .rd-racehd { flex-wrap: wrap; align-items: center; gap: 8px; }
  .rd-frametoggle { display: none; }

  /* Follow star: expand tap target to ~36px so it's reliably tappable */
  .followstar { font-size: 21px; padding: 8px; margin: -8px; }

  /* Horse-search dropdown: cap at 55vh so it never covers the whole screen */
  .hs-drop { max-height: min(320px, 55vh); }

  /* Card body: tighter padding on a narrow screen */
  .card .bd { padding: 12px 14px; }
}


/* ============================================================ MOBILE · RACE DAY BOARD
   The at-the-track flow. The desktop board is a 13-column SPEED × MARKET × EXPERTS terminal
   (~900px wide) — it cannot hold on a phone, and its `.entrant-row.rd-term` grid out-specifies
   the generic `.entrant-row` phone reflow, so without this the board horizontally scrolls.
   Here each runner becomes a stacked card, placed by grid-area on a 10-col track:
     line 1  barrier · silk · name ............................. ★ follow
     line 2  jockey · unit% ......................... live market (price + move)
     line 3  the five-speed strip — Top · Start · Ground · Mid · Finish, labelled inline
              (the aligned column header is dropped on phone, so each cell names itself)
   Avg-market + the desk fold into the tap-to-expand Unit read — off the glanceable card. */
@media (max-width:767px) {
  .rd-field { gap: 8px; }

  /* the column-header row is meaningless once rows stack vertically */
  .entrant-row.rd-term.rd-fieldhead { display: none; }

  .entrant-row.rd-term {
    grid-template-columns: repeat(12, 1fr);
    column-gap: 6px; row-gap: 9px; align-items: center;
    padding: 12px 13px; border: 1px solid var(--line-soft); border-radius: 12px;
    background: #fff;
  }
  .entrant-row.rd-term.contender {
    border-color: color-mix(in srgb, var(--gold) 55%, transparent);
    background: linear-gradient(180deg, rgba(200,164,93,.08), #fff 62%);
  }
  .entrant-row.rd-term.open { background: rgba(200,164,93,.08); }
  .entrant-row.rd-term:hover { background: #fff; }
  .entrant-row.rd-term.contender:hover { background: linear-gradient(180deg, rgba(200,164,93,.08), #fff 62%); }
  /* the desktop vertical section-break borders don't map onto a card */
  .entrant-row.rd-term > *:nth-child(5),
  .entrant-row.rd-term > *:nth-child(11),
  .entrant-row.rd-term > *:nth-child(13) { border-left: 0; padding-left: 0; }

  /* line 1 — identity + follow (nth-child 1/2 are always barbadge · silk) */
  .entrant-row.rd-term > *:nth-child(1) { grid-area: 1 / 1 / 2 / 2; }
  .entrant-row.rd-term > *:nth-child(2) { grid-area: 1 / 2 / 2 / 3; }
  .entrant-row.rd-term > .ent-horse     { grid-area: 1 / 3 / 2 / 11; min-width: 0; }
  .entrant-row.rd-term > .followstar    { grid-area: 1 / 11 / 2 / 13; justify-self: end; }
  .entrant-row.rd-term .ent-line .ent-name { font-size: 15px; }

  /* line 2 — pilot + the live market (nth-child 11 is always the market cell) */
  .entrant-row.rd-term > .ent-jockcol    { grid-area: 2 / 1 / 3 / 8; min-width: 0; }
  .entrant-row.rd-term .ent-jockname     { font-size: 13px; }
  .entrant-row.rd-term > *:nth-child(11) { grid-area: 2 / 8 / 3 / 13; justify-self: end; text-align: right; }
  .entrant-row.rd-term > *:nth-child(11) .mkt-cell,
  .entrant-row.rd-term > *:nth-child(11).mkt-cell { align-items: flex-end; }
  /* avg-market + experts live in the expand, not the card */
  .entrant-row.rd-term > *:nth-child(12),
  .entrant-row.rd-term > *:nth-child(13) { display: none; }

  /* line 3 — the five-speed strip + TURN %, each cell self-labelled from data-dl. Six cells
     across a 12-col track (the phone card widened from 10 when TURN % joined the row). */
  .entrant-row.rd-term > .rd-dim {
    display: block; text-align: center; line-height: 1.15; min-width: 0;
    padding: 6px 2px 5px; border-radius: 8px; background: var(--paper);
    font-size: 13px; font-weight: 600; color: var(--ink); font-variant-numeric: tabular-nums;
  }
  .entrant-row.rd-term > .rd-dim::before {
    content: attr(data-dl); display: block; margin-bottom: 2px;
    font: 700 8px/1 var(--sans); letter-spacing: .05em; text-transform: uppercase; color: var(--muted);
  }
  .entrant-row.rd-term > .rd-dim.best { background: var(--gold-soft); color: var(--bronze); }
  .entrant-row.rd-term > .rd-dim.best::before { color: var(--bronze); }
  .entrant-row.rd-term > .rd-dim .rd-rk { font-size: 8px; }
  .entrant-row.rd-term > .rd-dim:nth-child(5) { grid-area: 3 / 1 / 4 / 3; }
  .entrant-row.rd-term > .rd-dim:nth-child(6) { grid-area: 3 / 3 / 4 / 5; }
  .entrant-row.rd-term > .rd-dim:nth-child(7) { grid-area: 3 / 5 / 4 / 7; }
  .entrant-row.rd-term > .rd-dim:nth-child(8) { grid-area: 3 / 7 / 4 / 9; }
  .entrant-row.rd-term > .rd-dim:nth-child(9) { grid-area: 3 / 9 / 4 / 11; }
  .entrant-row.rd-term > .rd-dim:nth-child(10) { grid-area: 3 / 11 / 4 / 13; }

  /* the per-runner expand fills the card width */
  .rd-cpu { padding: 0; }
}


/* ---------------------------------------------------------------- brand footer
   The Actual Sport sign-off carried at the foot of every page — discreet, bronze on the
   ivory ground so it holds ownership without pulling focus. Mirrors the card/report lockup. */
.brand-footer {
  display:flex; align-items:baseline; justify-content:center; gap:11px;
  padding:22px 16px calc(24px + env(safe-area-inset-bottom));
  border-top:1px solid rgba(154,107,31,.16);
}
.brand-footer .bf-pre {
  font-family:var(--serif); font-weight:400; font-size:9px; letter-spacing:.34em;
  color:var(--muted); opacity:.7; text-transform:uppercase;
}
.brand-footer .bf-name {
  font-family:var(--serif); font-weight:500; font-size:10.5px; letter-spacing:.2em;
  color:var(--bronze);
}

/* ── THE SPEED READ INSTRUMENT — The Trace (dark stage) + The Delta (diverging grammar) ──── */
/* The Trace rides the same dark instrument stage as the race profile — gold-standard speed UI. */
.trace-stage { margin:2px 0 14px; padding:12px 16px 10px; border-radius:14px;
  background:radial-gradient(130% 150% at 50% -10%, #0d2c49 0%, #08203a 55%, #06131f 100%);
  box-shadow:0 14px 34px rgba(7,26,47,.30), inset 0 1px 0 rgba(255,255,255,.06); }
.trace-stage.held { background:repeating-linear-gradient(45deg,#0a2034,#0a2034 8px,#0c2238 8px,#0c2238 16px); }
.trace-hd { display:flex; align-items:baseline; justify-content:space-between; gap:10px; margin-bottom:2px; }
.trace-ttl { font:700 10px/1 var(--sans); letter-spacing:.18em; text-transform:uppercase; color:var(--gold); }
.trace-stage .tr-read { font-size:11px; color:#9db4c9; font-variant-numeric:tabular-nums; white-space:nowrap; }
.trace-stage .spdcurve { cursor:crosshair; }
.trace-key { display:flex; gap:16px; flex-wrap:wrap; margin-top:4px; }
.trace-key .tk { font:600 9.5px/1 var(--sans); letter-spacing:.04em; text-transform:uppercase; color:#9db4c9; }
.trace-key .tk::before { content:""; display:inline-block; width:13px; height:3px; border-radius:2px; margin-right:6px; vertical-align:middle; }
.trace-key .tk-held::before  { background:#34b97e; }
.trace-key .tk-below::before { background:#d56b7c; }
.trace-key .tk-ghost::before { background:rgba(231,222,200,.5); }
.trace-foot { margin-top:6px; font-size:10.5px; color:#8ba3b8; line-height:1.55; }
.trace-foot b { color:#e6d3a8; font-weight:700; }

/* The Delta — one diverging grammar for every reference frame */
.delta-panel { margin-bottom:14px; padding:13px 15px; border:1px solid var(--line-soft);
  border-radius:12px; background:var(--paper); }
.delta-hd { font:700 9px/1 var(--sans); letter-spacing:.13em; text-transform:uppercase;
  color:var(--muted); margin-bottom:11px; }
.delta-row { display:flex; align-items:center; gap:10px; margin-bottom:8px; }
.delta-row:last-of-type { margin-bottom:0; }
.delta-lab { width:120px; flex:none; font-size:11.5px; color:var(--ink); }
.delta-bar { position:relative; flex:1; height:9px; background:rgba(7,26,47,.06); border-radius:5px; }
.delta-bar::before { content:""; position:absolute; left:50%; top:-2px; bottom:-2px; width:1px; background:rgba(7,26,47,.28); }
.delta-fill { position:absolute; top:0; height:9px; }
.delta-fill.pos { background:linear-gradient(90deg,#1f7a52,#34b97e); border-radius:0 5px 5px 0; }
.delta-fill.neg { background:linear-gradient(90deg,#d56b7c,#b3505f); border-radius:5px 0 0 5px; }
.delta-wh { position:absolute; inset:0; border-radius:5px;
  background:repeating-linear-gradient(45deg,rgba(90,30,43,.16),rgba(90,30,43,.16) 4px,transparent 4px,transparent 8px); }
.delta-val { width:52px; flex:none; text-align:right; font-size:11px; font-weight:700; font-variant-numeric:tabular-nums; }
.delta-val.wh { color:var(--oxblood); font-size:9px; letter-spacing:.06em; }
@media (max-width:560px){ .delta-lab { width:92px; } }

/* ---- The Baseline Matrix panel — the run vs every reference (sibling of The Delta) ---- */
.mx-panel { margin-bottom:14px; padding:13px 15px; border:1px solid var(--line-soft); border-radius:12px; }
.mx-hd { font:700 9px/1 var(--sans); letter-spacing:.13em; text-transform:uppercase; color:var(--muted);
  margin-bottom:11px; display:flex; align-items:baseline; gap:8px; }
.mx-cov { font-weight:600; letter-spacing:.04em; color:var(--gold); text-transform:none; font-size:9.5px; }
.mx-row { padding:8px 0; border-top:1px solid var(--line-soft); }
.mx-row:first-of-type { border-top:none; padding-top:2px; }
.mx-lead { display:flex; align-items:baseline; justify-content:space-between; gap:8px; margin-bottom:6px; }
.mx-dim { font-size:13px; font-weight:600; color:var(--ink); }
.mx-spine { font-size:8.5px; letter-spacing:.1em; text-transform:uppercase; color:var(--gold);
  border:1px solid var(--line); border-radius:4px; padding:1px 4px; margin-left:6px; vertical-align:middle; }
.mx-obs { font-family:var(--serif); font-size:19px; font-weight:700; color:var(--ink); font-variant-numeric:tabular-nums; }
.mx-obs i { font:600 9px/1 var(--sans); font-style:normal; color:var(--muted); margin-left:2px; }
.mx-refs { display:flex; flex-direction:column; gap:5px; }
.mx-ref { display:flex; align-items:center; gap:10px; }
.mx-rl { width:96px; flex:none; font-size:10.5px; color:var(--muted); font-variant-numeric:tabular-nums; }
.mx-read { font-size:12px; color:var(--ink); margin-top:6px; opacity:.85; }
.mx-tiles { display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:7px; margin-top:12px; }
.mx-tile { border:1px solid var(--line-soft); border-radius:10px; padding:8px 10px; }
.mx-tl { font-size:10px; color:var(--muted); margin-bottom:3px; }
.mx-tv { font-size:13px; font-weight:600; font-variant-numeric:tabular-nums; }
.mx-tv.pos-v { color:var(--green); } .mx-tv.neg-v { color:var(--oxblood); } .mx-tv.zero-v { color:var(--muted); }
@media (max-width:560px){ .mx-rl { width:80px; } }

/* per-runner expand to the full Speed Read on Race Intelligence */
.rd-expbtn { border:none; background:transparent; color:var(--gold); cursor:pointer; font-size:11px;
  line-height:1; padding:2px 5px 2px 0; transition:transform .16s ease; transform:rotate(0deg); }
.rd-expbtn.open { transform:rotate(90deg); }
.rd-expbtn:hover { color:var(--navy); }
.runs .rd-detail > td { padding:0; border-bottom:1px solid var(--line-soft); }
.rd-detailcell { background:linear-gradient(180deg,#f5f2ea,#fbf9f4); }
.rd-instrument { padding:14px 16px 16px; max-width:720px; }

/* ---- track record boards: fastest start/mid/top/finish here, by frame ---- */
.trk-records { margin-top:18px; }
.trk-rec-btn { width:100%; text-align:left; background:transparent; cursor:pointer;
  border:1px solid var(--line); border-radius:10px; padding:9px 12px;
  font:700 10px/1.2 var(--sans); letter-spacing:.1em; text-transform:uppercase;
  color:var(--navy); }
.trk-rec-btn:hover { border-color:var(--gold); background:rgba(200,164,93,.06); }
.trk-rec-wins { display:flex; gap:6px; margin:14px 0 12px; }
.trk-rec-wins .trk-win { font:600 11px/1 var(--sans); letter-spacing:.04em;
  color:var(--muted); background:transparent; border:1px solid var(--line);
  border-radius:999px; padding:5px 12px; cursor:pointer; }
.trk-rec-wins .trk-win:hover { border-color:var(--gold-soft); color:var(--navy); }
.trk-rec-wins .trk-win.on { background:var(--gold); color:var(--navy); border-color:var(--gold); }
.trk-boards { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
@media (max-width:760px) { .trk-boards { grid-template-columns:1fr; } }
.trk-board { border:1px solid var(--line-soft); border-radius:12px; overflow:hidden; }
.trk-board .hd { display:flex; align-items:center; gap:8px; padding:10px 13px;
  border-bottom:1px solid var(--line-soft); }
.trk-board .hd .ttl { font:700 11px/1 var(--sans); letter-spacing:.12em;
  text-transform:uppercase; color:var(--navy); }
.trk-board .lb { padding:4px 13px 8px; }
.trk-board .lb .row { gap:9px; padding:7px 2px; }
.trk-board .empty { padding:18px 6px; font-size:12px; }
/* a record board with no rows is not rendered — this is the one line shown when the venue
   has nothing in the frame, and it spans the pair rather than sitting as a lone half-box */
.trk-boards .trk-none { grid-column:1 / -1; border:1px solid var(--line-soft);
  border-radius:12px; padding:20px 16px; font-size:12.5px; }

/* ── Build-provenance footer — the running commit, traceable to source ───────── */
.sitefoot {
  display:flex; align-items:center; justify-content:center; gap:7px;
  padding:18px 16px 22px; margin-top:8px;
  border-top:1px solid var(--line-soft);
  font:600 11px/1 var(--sans); letter-spacing:.06em;
  color:var(--muted); }
.sitefoot .ver-brand { font-family:var(--serif); letter-spacing:.18em;
  text-transform:uppercase; color:var(--gold); }
.sitefoot .ver-sep { opacity:.5; }
.sitefoot .ver-hash { font-family:var(--mono,ui-monospace,Menlo,monospace);
  color:var(--muted); text-decoration:none; border-bottom:1px dotted var(--line); }
.sitefoot a.ver-hash:hover { color:var(--navy); border-bottom-color:var(--gold); }
.sitefoot .ver-built { color:var(--muted); opacity:.8; }

/* ── Car · Pilot · Unit — the F1 read on Race Day + Race Intelligence ───────── */
.rd-cpubtn { display:inline-flex; align-items:center; gap:5px; background:none; border:0; padding:1px 0;
  cursor:pointer; font:inherit; color:var(--muted); font-size:10px; line-height:1.25; text-align:left; }
.rd-cpubtn:hover { color:var(--gold); }
.rd-cpubtn .rd-cpuchev { transition:transform .15s ease; font-size:9px; color:var(--gold); }
.rd-cpubtn.open .rd-cpuchev { transform:rotate(90deg); }
.rd-jock { font-weight:500; color:#43505e; }
.rd-unit { font-weight:700; color:var(--gold); }
.rd-cpu { padding:2px 8px 10px 40px; }
.cpu { background:#fbf8f1; border:0.5px solid rgba(11,31,42,.1); border-radius:10px;
  padding:12px 14px; color:#13212e; }
.rd-instrument .cpu { margin-top:12px; }
.cpu-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }
.cpu-cell { border-left:2px solid; padding-left:11px; min-width:0; }
.cpu-cell.cpu-car { border-color:#7b8794; }
.cpu-cell.cpu-pilot { border-color:var(--gold); }
.cpu-cell.cpu-unit { border-color:#0B3D2E; }
@media (max-width:760px){ .cpu-grid { grid-template-columns:1fr; } .rd-cpu { padding-left:8px; } }
/* The Unit read — car · pilot · unit · stable, with the money decomposed */
.cpu-grid-4 { grid-template-columns:repeat(4,1fr); }
@media (max-width:860px){ .cpu-grid-4 { grid-template-columns:1fr 1fr; } }
@media (max-width:520px){ .cpu-grid-4 { grid-template-columns:1fr; } }
.cpu-cell.cpu-stable { border-color:#185FA5; }
.cpu-money { display:flex; align-items:baseline; gap:9px; flex-wrap:wrap; margin:0 0 12px; padding:8px 11px;
  background:rgba(11,61,46,.06); border:0.5px solid rgba(11,61,46,.24); border-radius:8px; }
.cpu-money-tag { font:700 9.5px/1 var(--sans); letter-spacing:.12em; text-transform:uppercase; color:#0B3D2E; }
.cpu-money-val { font-size:15px; color:#0B3D2E; }
.cpu-money-sub { font-size:11.5px; color:var(--muted); }
.cpu-read { margin-top:10px; padding:9px 12px; background:#071A2F; color:#EAE3D5; border-radius:8px;
  font-size:12.5px; line-height:1.55; }
.cpu-read b { color:var(--gold); font-weight:500; }
.entrant-row.mkt-mover { box-shadow:inset 3px 0 0 var(--gold); }

/* Race Intelligence — Jockey + Unit columns */
.runs td.jockcell { font-size:11px; color:#43505e; white-space:normal; line-height:1.55; max-width:160px; }
.runs td.jockcell .rd-jock { font-weight:500; }
.runs td.unitcell { font-size:11.5px; white-space:nowrap; }

/* Race Intelligence — the speed-model sectors read as a telemetry panel (a whisper-tint behind
   the five columns), and the Jockey · Unit identity cells breathe */
table.runs td.sm { background:rgba(200,164,93,.05); }
table.runs tr:hover td.sm { background:rgba(200,164,93,.11); }
table.runs td.jockcell, table.runs td.unitcell { vertical-align:middle; }

/* ---- Readiness — the can-vs-will read on the horse page ---- */
.rdy-tag { display:inline-block; font:700 8.5px/1 var(--sans); letter-spacing:.14em; text-transform:uppercase;
  color:var(--navy); background:rgba(200,164,93,.2); border-radius:5px; padding:3px 6px; margin-right:9px; vertical-align:middle; }
.rdy-tag-will { background:rgba(11,61,46,.14); color:var(--green); }
.rdy-can { font-size:16px; color:var(--navy); padding-bottom:12px; border-bottom:1px solid var(--line-soft); margin-bottom:12px; }
.rdy-can b { font-weight:700; } .rdy-can i { font-style:normal; color:var(--muted); font-size:13px; margin-left:8px; }
.rdy-will { margin-bottom:9px; } .rdy-will-q { font-size:13.5px; color:var(--ink); }
.rdy-notes { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:8px; }
.rdy-note { display:flex; align-items:center; gap:8px; font-size:13px; color:var(--ink);
  border:1px solid var(--line-soft); border-radius:10px; padding:9px 11px; }
.rdy-note i { color:var(--gold-deep,#9a7d3c); font-size:16px; flex:none; }
.rdy-strong { border-color:var(--line); background:linear-gradient(180deg,rgba(200,164,93,.09),transparent); }
.rdy-strong i, .rdy-strong span { color:var(--navy); font-weight:500; }

/* ============================ MY RACES ================================= */
/* A trainer's race-plan canvas inside My Stable — proven records, WITHHELD-honest. */
.stable-tabs { display:flex; gap:4px; margin:-6px 0 18px; border-bottom:1px solid var(--line-soft); }
.stable-tab { appearance:none; background:none; border:none; cursor:pointer; padding:9px 14px;
  font:inherit; font-size:13px; font-weight:600; letter-spacing:.02em; color:var(--muted);
  border-bottom:2px solid transparent; margin-bottom:-1px; }
.stable-tab:hover { color:var(--ink); }
.stable-tab.on { color:var(--navy); border-bottom-color:var(--gold); }

.rp-intro { max-width:70ch; }
.rp-intro b { color:var(--navy); }
.rp-actions { margin:6px 0 18px; }
.btn-gold { appearance:none; cursor:pointer; font:inherit; font-size:13px; font-weight:700;
  letter-spacing:.02em; color:var(--navy); background:linear-gradient(180deg,var(--gold-soft),var(--gold));
  border:1px solid var(--gold); border-radius:9px; padding:8px 16px; }
.btn-gold:hover { filter:brightness(1.04); }

/* My Races = the simulator: a strip of saved races above the mounted Race Simulator */
.rp-saved { margin:2px 0 16px; }
.rp-saved-h { font:700 10px/1 var(--sans); letter-spacing:.16em; text-transform:uppercase;
  color:var(--gold-deep,#9a7d3c); margin-bottom:8px; }
.rp-saved-row { display:flex; flex-wrap:wrap; gap:8px; }
.rp-chip { display:flex; align-items:stretch; gap:4px; }
.rp-chip .rp-open { display:flex; flex-direction:column; align-items:flex-start; gap:2px;
  text-align:left; cursor:pointer; font:inherit; background:#fff; border:1px solid var(--line-soft);
  border-radius:11px; padding:9px 13px; }
.rp-chip .rp-open:hover { border-color:var(--gold); }
.rp-chip-nm { font-size:13.5px; font-weight:700; color:var(--navy); }
.rp-chip-meta { font-size:11.5px; color:var(--muted); }
.races-lab { margin-top:4px; }
.rp-list { display:flex; flex-direction:column; gap:8px; }
.rp-lc { display:flex; align-items:stretch; gap:6px; }
.rp-lc .rp-open { flex:1; display:flex; flex-direction:column; align-items:flex-start; gap:2px;
  text-align:left; cursor:pointer; font:inherit; background:#fff; border:1px solid var(--line-soft);
  border-radius:12px; padding:12px 14px; }
.rp-lc .rp-open:hover { border-color:var(--gold); }
.rp-lc-nm { font-size:14px; font-weight:700; color:var(--navy); }
.rp-lc-meta { font-size:12px; color:var(--muted); }
.rp-del { appearance:none; cursor:pointer; background:none; border:1px solid var(--line-soft);
  border-radius:10px; color:var(--muted); width:38px; font-size:14px; }
.rp-del:hover { border-color:var(--oxblood); color:var(--oxblood); }

.rp-bar { display:flex; align-items:center; flex-wrap:wrap; gap:12px; padding:12px 14px;
  background:var(--paper); border:1px solid var(--line-soft); border-radius:12px; margin-bottom:12px; }
.rp-back { appearance:none; cursor:pointer; background:none; border:none; font:inherit; font-size:13px;
  font-weight:600; color:var(--muted); }
.rp-back:hover { color:var(--navy); }
.rp-name { flex:1; min-width:180px; font:inherit; font-size:15px; font-weight:700; color:var(--navy);
  background:#fff; border:1px solid var(--line-soft); border-radius:9px; padding:8px 12px; }
.rp-cond { display:flex; gap:14px; align-items:center; flex-wrap:wrap; font-size:12.5px; color:var(--muted); }
.rp-cond label { display:inline-flex; align-items:center; gap:6px; }
.rp-cond input, .rp-cond select { font:inherit; font-size:13px; color:var(--ink); background:#fff;
  border:1px solid var(--line-soft); border-radius:8px; padding:6px 8px; }
.rp-cond input[type=number] { width:82px; }
.rp-band { color:var(--gold); font-weight:700; }
.rp-exp .cardlink { font-size:12px; }

.rp-add { position:relative; margin-bottom:14px; display:flex; align-items:center; gap:12px; flex-wrap:wrap; }
.rp-hsearch { position:relative; width:min(340px,100%); }
.rp-hsearch > input { width:100%; font:inherit; font-size:13px; background:#fff;
  border:1px solid var(--line-soft); border-radius:9px; padding:9px 12px; }
.rp-hint { font-size:12px; color:var(--muted); }
.rp-drop { position:absolute; z-index:20; left:0; right:0; top:calc(100% + 4px); background:#fff;
  border:1px solid var(--line-soft); border-radius:10px; box-shadow:0 8px 24px rgba(7,26,47,.10);
  overflow:hidden; display:none; }
.rp-drop.on { display:block; }
.rp-opt { padding:9px 12px; font-size:13px; cursor:pointer; }
.rp-opt:hover { background:var(--paper); }
.rp-opt.rp-none { color:var(--muted); cursor:default; }

.rp-entries { display:grid; grid-template-columns:repeat(auto-fill,minmax(320px,1fr)); gap:12px; }
.rp-entry { background:#fff; border:1px solid var(--line-soft); border-radius:14px; padding:14px; }
.rp-eh { display:flex; align-items:center; justify-content:space-between; margin-bottom:10px; }
.rp-enm { font-size:15px; font-weight:700; color:var(--navy); }
.rp-rm { appearance:none; cursor:pointer; background:none; border:none; color:var(--muted); font-size:13px; }
.rp-rm:hover { color:var(--oxblood); }
.rp-ctl { display:flex; gap:6px; margin-bottom:12px; }
.rp-ctl input, .rp-ctl select { font:inherit; font-size:12.5px; color:var(--ink); background:var(--paper);
  border:1px solid var(--line-soft); border-radius:8px; padding:6px 8px; }
.rp-jk { flex:1; min-width:0; }
.rp-barr { width:64px; }
.rp-read { border-top:1px dashed var(--line-soft); padding-top:10px; display:flex; flex-direction:column; gap:6px; }
.rp-reading { color:var(--muted); font-size:12px; }
.rp-line { display:flex; gap:8px; font-size:12.5px; line-height:1.35; }
.rp-k { flex:none; width:52px; color:var(--muted); text-transform:uppercase; font-size:10.5px;
  letter-spacing:.06em; font-weight:700; padding-top:2px; }
.rp-v { flex:1; color:var(--ink); }
.rp-v b { color:var(--navy); }
.rp-ok .rp-v b { color:var(--green); }
.rp-heldrow .rp-v { color:var(--muted); }
.rp-w, .rp-held { color:var(--oxblood); font-weight:700; }
.rp-held { font-weight:600; font-style:italic; }
.rp-withheld { color:var(--oxblood); font-size:12.5px; }
.rp-cmp { margin-top:4px; border-top:1px dashed var(--line-soft); padding-top:8px; }
.rp-cmp-h { font-size:10.5px; text-transform:uppercase; letter-spacing:.06em; font-weight:700;
  color:var(--muted); margin-bottom:5px; }
.rp-cmp-row { display:flex; justify-content:space-between; gap:8px; font-size:12px; padding:2px 0; }
.rp-cmp-row.on { color:var(--navy); font-weight:600; }
.rp-cmp-nm { flex:none; }
.rp-cmp-v { text-align:right; color:var(--ink); }

/* ---- My Races · the dashboard (Race-Day-style field of proven speed) ---- */
.rp-dash { display:flex; flex-direction:column; gap:14px; }
.rp-add { align-items:center; }
.rp-addlab { font-size:11px; text-transform:uppercase; letter-spacing:.06em; font-weight:700; color:var(--muted); }
.rp-chips { display:flex; flex-wrap:wrap; gap:6px; flex:1; }
.rp-chip { appearance:none; cursor:pointer; font:inherit; font-size:12.5px; font-weight:600; color:var(--navy);
  background:#fff; border:1px solid var(--line-soft); border-radius:999px; padding:5px 11px; }
.rp-chip:hover { border-color:var(--gold); background:var(--paper); }
.rp-chip-none { font-size:12px; color:var(--muted); }

.rp-profrow { display:flex; align-items:center; gap:12px; flex-wrap:wrap; }
.rp-proflab { font-size:11px; text-transform:uppercase; letter-spacing:.06em; font-weight:700; color:var(--navy); }
.rp-wtoggle { display:inline-flex; background:var(--paper); border:1px solid var(--line-soft); border-radius:999px; padding:2px; }
.rp-wbtn { appearance:none; cursor:pointer; font:inherit; font-size:12px; font-weight:600; color:var(--muted);
  background:none; border:none; border-radius:999px; padding:5px 11px; }
.rp-wbtn.on { color:var(--navy); background:#fff; box-shadow:0 1px 3px rgba(7,26,47,.10); }
.rp-profhint { font-size:11.5px; color:var(--muted); }
.rp-onehint, .rp-fctlhint, .rp-fcap { font-size:11.5px; color:var(--muted); }
.rp-onehint { padding:10px 2px; }

.rp-field { display:flex; flex-direction:column; gap:8px; }
.rp-row { background:#fff; border:1px solid var(--line-soft); border-radius:12px; overflow:hidden; }
.rp-row.open { border-color:var(--gold); box-shadow:0 2px 12px rgba(7,26,47,.06); }
.rp-rowhd { display:grid; grid-template-columns:auto minmax(120px,1.5fr) minmax(90px,1fr) auto auto auto auto;
  align-items:center; gap:12px; padding:10px 12px; cursor:pointer; }
.rp-rowhd:hover { background:var(--paper); }
.rp-rowsilk { display:flex; }
.rp-rowname { display:flex; flex-direction:column; gap:1px; min-width:0; }
.rp-nm { font-size:14.5px; font-weight:700; color:var(--navy); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.rp-typ { font-size:11px; color:var(--muted); }
.rp-rowjk { font-size:12.5px; color:var(--ink); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.rp-nojk { color:var(--muted); font-style:italic; }
.rp-fivewrap { display:flex; gap:10px; }
.rp-dim { display:flex; flex-direction:column; align-items:center; min-width:38px; }
.rp-dl { font-size:9px; text-transform:uppercase; letter-spacing:.05em; color:var(--muted); }
.rp-dv { font-size:13px; font-weight:700; color:var(--ink); font-variant-numeric:tabular-nums; }
.rp-dim.best .rp-dv { color:var(--gold); }
.rp-dim.best .rp-dl { color:var(--gold); }
.rp-unknown { font-size:12px; color:var(--oxblood); }
.rp-badge { font-size:10.5px; font-weight:700; letter-spacing:.05em; padding:3px 9px; border-radius:999px; white-space:nowrap; }
.rp-badge.win { color:#fff; background:var(--green); }
.rp-badge.place { color:var(--navy); background:rgba(200,164,93,.22); border:1px solid rgba(200,164,93,.5); }
.rp-badge.short { color:var(--muted); background:var(--paper); border:1px solid var(--line-soft); }
.rp-badge.held { color:var(--oxblood); background:rgba(90,30,43,.07); border:1px solid rgba(90,30,43,.22); }
.rp-rm-btn { appearance:none; cursor:pointer; background:none; border:none; color:var(--muted); font-size:13px; }
.rp-rm-btn:hover { color:var(--oxblood); }
.rp-chev { color:var(--muted); font-size:12px; }

.rp-focus { border-top:1px solid var(--line-soft); padding:14px 14px 4px; background:var(--paper); }
.rp-focusgrid { display:grid; grid-template-columns:minmax(0,1.3fr) minmax(0,1fr); gap:16px; }
.rp-fcurve { min-width:0; }
.rp-fcurve .spdcurve { width:100%; height:auto; }
.rp-freads { display:flex; flex-direction:column; gap:6px; }
.rp-nocurve { color:var(--muted); font-size:13px; padding:24px; text-align:center; }
.rp-fctl { display:flex; align-items:center; gap:14px; flex-wrap:wrap; margin-top:12px; padding-top:12px; border-top:1px dashed var(--line-soft); }
.rp-fctl label { display:inline-flex; align-items:center; gap:6px; font-size:12px; color:var(--muted); }
.rp-fctl input { font:inherit; font-size:13px; color:var(--ink); background:#fff; border:1px solid var(--line-soft); border-radius:8px; padding:6px 9px; }
.rp-fctl input[type=number] { width:70px; }

@media (max-width:760px) {
  .rp-rowhd { grid-template-columns:auto 1fr auto; grid-auto-rows:auto; row-gap:8px; }
  .rp-rowjk { grid-column:2 / -1; }
  .rp-fivewrap { grid-column:1 / -1; justify-content:space-between; }
  .rp-focusgrid { grid-template-columns:1fr; }
}

/* ---- My Races · import an upcoming race from the board ---- */
.btn-ghost { appearance:none; cursor:pointer; font:inherit; font-size:13px; font-weight:600;
  color:var(--navy); background:#fff; border:1px solid var(--line-soft); border-radius:9px; padding:8px 14px; }
.btn-ghost:hover { border-color:var(--gold); background:var(--paper); }
.rp-actions { display:flex; gap:8px; flex-wrap:wrap; }
.rd-tomyraces { appearance:none; cursor:pointer; font:inherit; font-size:10.5px; font-weight:700;
  letter-spacing:.04em; color:var(--gold); background:rgba(200,164,93,.10); border:1px solid rgba(200,164,93,.45);
  border-radius:999px; padding:2px 9px; margin-left:auto; }
.rd-tomyraces:hover { background:rgba(200,164,93,.20); }

.rp-import { display:flex; flex-direction:column; gap:6px; }
.rp-imp-h { font-size:17px; font-weight:700; color:var(--navy); margin:6px 0 0; }
.rp-imp-list { display:flex; flex-direction:column; gap:16px; margin-top:8px; }
.rp-imp-meet { display:flex; flex-direction:column; gap:5px; }
.rp-imp-track { font-size:11px; text-transform:uppercase; letter-spacing:.06em; font-weight:700; color:var(--gold); }
.rp-imp-race { display:grid; grid-template-columns:64px 60px 1fr; align-items:center; gap:12px; text-align:left;
  cursor:pointer; font:inherit; background:#fff; border:1px solid var(--line-soft); border-radius:10px; padding:10px 14px; }
.rp-imp-race:hover { border-color:var(--gold); background:var(--paper); }
.rp-imp-when { font-size:13px; font-weight:700; color:var(--navy); font-variant-numeric:tabular-nums; }
.rp-imp-where { font-size:13px; font-weight:700; color:var(--ink); }
.rp-imp-meta { font-size:12px; color:var(--muted); }

/* ---- My Races · speed check + winning bar ---- */
.rp-checkbtn { appearance:none; cursor:pointer; font:inherit; font-size:12px; font-weight:700; letter-spacing:.02em;
  color:var(--navy); background:#fff; border:1px solid var(--line-soft); border-radius:999px; padding:5px 12px; }
.rp-checkbtn:hover { border-color:var(--gold); }
.rp-checkbtn.on { color:#fff; background:var(--green); border-color:var(--green); }
.rp-winbar { font-size:12px; color:var(--muted); }
.rp-winbar b { color:var(--navy); font-variant-numeric:tabular-nums; }
.rp-chk { font-size:11px; font-weight:700; padding:3px 9px; border-radius:999px; white-space:nowrap; font-variant-numeric:tabular-nums; }
.rp-chk.above { color:#fff; background:var(--green); }
.rp-chk.below { color:#fff; background:var(--oxblood); }
.rp-chk.held { color:var(--muted); background:var(--paper); border:1px solid var(--line-soft); }

/* ---- Race Day · sortable column headers ---- */
.rd-sorth { cursor:pointer; user-select:none; white-space:nowrap; }
.rd-sorth:hover { color:var(--gold); }
.rd-sorth.on { color:var(--gold); }
.rd-sortar { font-size:9px; }
.rd-sortmini { cursor:pointer; font-size:9px; font-weight:600; text-transform:none; letter-spacing:0;
  color:var(--muted); border:1px solid var(--line-soft); border-radius:4px; padding:0 4px; margin-left:4px; }
.rd-sortmini:hover, .rd-sortmini.on { color:var(--gold); border-color:var(--gold); }

/* ============================================================ MOBILE · BOTTOM TAB BAR
   The at-the-track thumb zone. A fixed bottom nav on phones mirrors the foyer's doors &
   departments — Home · My Stable · Race Day · Research — one tap away, with More opening
   the full drawer. Each tab lights for its whole department (deptOf in show()), so
   Research stays lit across Horse/Jockey/Trainer/etc. Desktop keeps the side nav and
   never shows this. Placed last in the sheet so its `main`/footer clearance overrides
   the generic phone block's padding. */
.tabbar { display:none; }

@media (max-width:767px) {
  .tabbar {
    display:flex; position:fixed; left:0; right:0; bottom:0; z-index:40;
    background:var(--navy); border-top:1px solid rgba(255,255,255,.09);
    box-shadow:0 -8px 22px rgba(7,26,47,.24);
    padding-bottom:env(safe-area-inset-bottom);
  }
  .tabitem {
    flex:1; appearance:none; cursor:pointer; background:none; border:0; margin:0;
    display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px;
    padding:8px 2px 7px; min-height:54px;
    color:rgba(231,222,200,.60); font:600 10px/1 var(--sans); letter-spacing:.01em;
    -webkit-tap-highlight-color:transparent; transition:color .14s;
  }
  .tabitem svg { width:23px; height:23px; }
  .tabitem span { white-space:nowrap; }
  .tabitem.on { color:var(--gold); }
  .tabitem.on svg { filter:drop-shadow(0 0 6px rgba(200,164,93,.35)); }
  .tabitem:active { color:var(--ivory); }

  /* clear the fixed bar so nothing hides behind it (last card, footer, drawer foot) */
  main { padding-bottom:calc(70px + env(safe-area-inset-bottom)) !important; }
  .brand-footer { padding-bottom:calc(80px + env(safe-area-inset-bottom)); }
  body.nav-open nav.side { padding-bottom:calc(72px + env(safe-area-inset-bottom)); }
}


/* ============================================================ MOBILE · POLISH
   Overflow containment + touch ergonomics for the phone. Appended last so these win. */
@media (max-width:767px) {
  /* card headers (Race/Horse/Track: title · chip · rule · Save card/sheet) wrap instead
     of pushing the export buttons off the card edge */
  .card .hd { flex-wrap: wrap; row-gap: 8px; }
  .card .hd .gold-rule, .card .hd .steel-rule { min-width: 24px; }

  /* 44px follow-star tap target — the primary "save this horse" action at the track */
  .followstar { font-size: 22px; padding: 11px; margin: -11px; line-height: 1; }

  /* state filter (ALL/VIC/NSW/QLD) — taller tap via min-height, but tight horizontally
     so the four pills + brand + hamburger still fit one 375px row */
  .statefilter button { padding: 4px 7px; min-height: 34px; }
  .statefilter { gap: 3px; }

  /* wide tables (the runs history) scroll horizontally — hint it with a soft right fade
     so the off-screen columns are discoverable, and give the touch scroll momentum */
  .runs-wrap { position: relative; -webkit-overflow-scrolling: touch; }
  .runs-wrap::after {
    content: ""; position: absolute; top: 0; right: 0; bottom: 0; width: 22px;
    pointer-events: none; background: linear-gradient(90deg, rgba(251,248,241,0), var(--paper));
  }
  /* sort chips inside any remaining table headers — bigger hit area */
  .rd-sortmini { padding: 3px 7px; }
}

/* the tightest phones (SE / mini, ≤360px): keep the header honest */
@media (max-width:360px) {
  .brand .mark { font-size: 20px; letter-spacing: .10em; }
  .statefilter button { padding: 6px 7px; font-size: 9.5px; }
  .entrant-row.rd-term { column-gap: 4px; padding: 11px 11px; }
  .entrant-row.rd-term > .rd-dim { font-size: 12px; }
}

/* ============================================================ RACE DAY · MOBILE (GLANCE→SCROLL→CLICK)
   Phone-only board (rendered by renderRaceDayMobile in app.js). One race at a time, a
   rank-by selector, compact one-line runners, and the depth in a sheet / landscape profile.
   The classes only appear on <=767px, so no media gate is needed. */
.rdm-strip { display:flex; gap:6px; padding:4px 2px 10px; overflow-x:auto; scrollbar-width:none; }
.rdm-strip::-webkit-scrollbar { display:none; }
/* Two-line chip: the MEETING names itself first, the race number and jump sit beneath —
   "R2 Pake" on one line read as the day's second race. Max-width keeps a long synthetic
   track name from eating the strip; it ellipses rather than wraps. */
.rdm-chip { flex:none; appearance:none; cursor:pointer; display:flex; flex-direction:column;
  align-items:flex-start; gap:3px; max-width:44vw; text-align:left;
  font:700 12px/1 var(--sans); color:var(--muted); background:#fff; border:1px solid var(--line-soft);
  border-radius:14px; padding:7px 12px; }
.rdm-chip i { font-style:normal; font-size:9.5px; font-weight:600; color:var(--muted); opacity:.8; }
.rdm-chip i.rdm-chip-trk { max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
  font-size:11px; font-weight:700; color:var(--navy); opacity:1; letter-spacing:.01em; }
.rdm-chip-line { display:flex; align-items:baseline; gap:6px; }
.rdm-chip-line b { font-size:13px; color:var(--navy); }
.rdm-chip em { font-style:normal; font-size:8.5px; font-weight:800; letter-spacing:.09em;
  text-transform:uppercase; padding:1px 5px; border-radius:999px; }
.rdm-chip-next { color:var(--navy); background:var(--gold); }
.rdm-chip-run { color:var(--muted); background:var(--line-soft); }
.rdm-chip.on { color:var(--navy); background:var(--gold); border-color:var(--gold); }
.rdm-chip.on i { color:var(--navy); opacity:.72; }
.rdm-chip.on i.rdm-chip-trk, .rdm-chip.on .rdm-chip-line b { color:var(--navy); }
.rdm-chip.on .rdm-chip-next { background:var(--navy); color:var(--gold); }
.rdm-chip.done { opacity:.55; }

.rdm-head { padding:2px 2px 2px; }
.rdm-h1 { display:flex; align-items:baseline; gap:9px; flex-wrap:wrap; }
.rdm-no { font-family:var(--serif); font-weight:700; font-size:21px; color:var(--gold-deep,#9a7d3c); line-height:1; }
.rdm-trk { font-family:var(--serif); font-weight:700; font-size:21px; color:var(--navy); line-height:1; }
.rdm-st { font:700 9px/1 var(--sans); letter-spacing:.1em; color:var(--muted); border:1px solid var(--line-soft); border-radius:4px; padding:2px 4px; }
/* nowrap: a zone-labelled NZ jump ("12:17PM NZST") is long enough to break across two
   lines inside the pill, which reads as two separate times. */
.rdm-time { margin-left:auto; flex:none; white-space:nowrap; font:700 12.5px/1 var(--sans); color:var(--navy); background:var(--gold-soft); border-radius:999px; padding:5px 10px; font-variant-numeric:tabular-nums; }
.rdm-done-tag { margin-left:auto; font:700 8.5px/1 var(--sans); letter-spacing:.08em; text-transform:uppercase; color:var(--muted); border:1px solid var(--line-soft); border-radius:999px; padding:4px 8px; }
.rdm-h2 { display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin-top:6px; font-size:12.5px; color:var(--muted); }
.rdm-win { margin-left:auto; font-size:12px; color:var(--muted); white-space:nowrap; }
.rdm-win b { color:var(--gold-deep,#9a7d3c); font-variant-numeric:tabular-nums; }
.rdm-wh2 { color:var(--oxblood); font-weight:600; }

.rdm-ctl { display:flex; flex-direction:column; gap:8px; padding:11px 0 9px; }
.rdm-ctl-lab { font:700 10px/1 var(--sans); letter-spacing:.09em; text-transform:uppercase; color:var(--muted); }
.rdm-seg { display:flex; background:var(--paper); border:1px solid var(--line-soft); border-radius:999px; padding:3px; gap:2px; }
.rdm-seg button { flex:1; appearance:none; cursor:pointer; font:700 12.5px/1 var(--sans); color:var(--muted);
  background:none; border:0; border-radius:999px; padding:9px 4px; white-space:nowrap; }
.rdm-seg button.on { color:var(--navy); background:var(--gold); box-shadow:0 1px 4px rgba(200,164,93,.5); }
.rdm-seg button.lock { color:var(--muted); opacity:.85; }
.rdm-lk { font-size:10px; }
.rdm-sub2 { display:flex; gap:8px; }
.rdm-sel { position:relative; flex:1; }
.rdm-sel span { position:absolute; left:12px; top:-7px; font:700 8px/1 var(--sans); letter-spacing:.07em; text-transform:uppercase; color:var(--muted); background:var(--ivory); padding:0 4px; }
.rdm-sel::after { content:"\25BE"; position:absolute; right:12px; top:50%; transform:translateY(-50%); color:var(--gold-deep,#9a7d3c); font-size:10px; pointer-events:none; }
.rdm-sel select { appearance:none; -webkit-appearance:none; width:100%; cursor:pointer; font:600 12.5px/1 var(--sans);
  color:var(--ink); background:#fff; border:1px solid var(--line-soft); border-radius:999px; padding:9px 26px 9px 13px; }

.rdm-field { display:flex; flex-direction:column; gap:6px; padding:2px 0 8px; }
.rdm-run { display:grid; grid-template-columns:26px 26px 1fr auto 12px; align-items:center; gap:10px;
  background:#fff; border:1px solid var(--line-soft); border-radius:13px; padding:9px 12px; cursor:pointer;
  text-align:left; width:100%; font-family:var(--sans); color:inherit; }
.rdm-run:active { transform:scale(.987); }
.rdm-run.lead { border-color:color-mix(in srgb,var(--gold) 55%,transparent); background:linear-gradient(100deg,rgba(200,164,93,.10),#fff 60%); }
.rdm-run.scr { opacity:.6; }
.rdm-rk { font:700 12px/1 var(--sans); color:var(--muted); text-align:center; font-variant-numeric:tabular-nums; }
.rdm-run.lead .rdm-rk { color:var(--gold-deep,#9a7d3c); }
.rdm-run .silk { width:26px; height:26px; }
.rdm-who { min-width:0; }
.rdm-nm { display:flex; align-items:center; gap:6px; }
.rdm-name { font-size:15px; font-weight:600; color:var(--navy); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.rdm-cont { color:var(--gold); font-size:11px; flex:none; }
.rdm-star { color:var(--gold); font-size:11px; }
.rdm-scrtag { font:700 8.5px/1 var(--sans); letter-spacing:.06em; color:var(--oxblood); }
.rdm-sub { font-size:11.5px; color:var(--muted); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; margin-top:1px; }
.rdm-metric { text-align:right; min-width:58px; }
.rdm-mval { font-size:17px; font-weight:750; color:var(--navy); font-variant-numeric:tabular-nums; line-height:1; }
.rdm-run.lead .rdm-mval { color:var(--gold-deep,#9a7d3c); }
.rdm-mlab { display:block; font:700 8px/1 var(--sans); letter-spacing:.06em; text-transform:uppercase; color:var(--muted); margin-top:3px; }
.rdm-wh { font-size:16px; font-weight:700; color:var(--oxblood); }
/* the LEVEL fallback on the phone board — same rule as the desktop cell: muted, lighter, and
   labelled AVG, so a proven level never reads as a GPS ground speed. Its bar is drawn on its
   own tier's scale, so the length never invites a cross-lens comparison either. */
.rdm-metric-lvl .rdm-mval { color:var(--muted); font-weight:600; }
.rdm-metric-lvl .rdm-bar i { opacity:.45; }
/* the INDICATIVE par on the phone board — faintest tier, italic, no bar (a class benchmark, not
   a clocking). The ≈ prefix + "Indic" label carry that it isn't a proven read. */
.rdm-metric-indic .rdm-mval { color:color-mix(in srgb, var(--muted) 80%, transparent);
  font-weight:500; font-style:italic; }
.rdm-bar { position:relative; display:block; margin-top:5px; height:3px; border-radius:2px; background:var(--line-soft); overflow:hidden; }
.rdm-bar i { display:block; height:100%; border-radius:2px; background:var(--green); }
.rdm-run.lead .rdm-bar i { background:var(--gold); }
/* TURN % lens — the bar is scaled 0..100 absolutely, not across the field, so the bronze tick
   (where winners sit: top-5 at the turn 81% of the time) is the thing it is read against. The
   bar sits taller and lets the tick out of the clip so that mark is actually visible on a phone. */
.rdm-metric-turn .rdm-bar { height:5px; overflow:visible; }
.rdm-bar-win { position:absolute; top:-2px; bottom:-2px; width:2px; border-radius:1px;
  background:var(--bronze); }
.rdm-turnnote { display:block; font:400 11px/1.5 var(--sans); color:var(--muted); }
.rdm-turnnote b { color:var(--ink); font-weight:700; }
.rdm-chev { color:var(--muted); font-size:15px; line-height:1; }

.rdm-actions { display:flex; gap:9px; padding:6px 0 2px; }
.rdm-abtn { appearance:none; cursor:pointer; border-radius:12px; padding:13px 12px; font:700 12.5px/1 var(--sans);
  display:inline-flex; align-items:center; justify-content:center; gap:7px; }
.rdm-abtn.ghost { flex:none; color:var(--navy); background:#fff; border:1px solid var(--line-soft); }
.rdm-abtn.primary { flex:1; color:var(--ivory); background:var(--navy); border:1px solid var(--navy); }
.rdm-ar { color:var(--gold); }
.rdm-abtn small { font-weight:600; opacity:.72; }
.rdm-hint { text-align:center; font-size:10.5px; color:var(--muted); opacity:.8; padding:4px 20px 14px; }

/* ---- host overlays (sheet / race profile / toast) ---- */
.rdm-scrim { position:fixed; inset:0; background:rgba(7,26,47,.5); opacity:0; pointer-events:none; transition:opacity .22s; z-index:60; }
.rdm-scrim.on { opacity:1; pointer-events:auto; }
.rdm-sheet { position:fixed; left:0; right:0; bottom:0; background:var(--ivory); border-radius:20px 20px 0 0; z-index:61;
  box-shadow:0 -12px 40px rgba(7,26,47,.35); transform:translateY(102%); transition:transform .26s cubic-bezier(.4,0,.2,1);
  max-height:90vh; overflow-y:auto; padding-bottom:calc(16px + env(safe-area-inset-bottom)); }
.rdm-sheet.on { transform:translateY(0); }
.rdm-grab { width:38px; height:4px; border-radius:3px; background:var(--line-soft); margin:9px auto 4px; }
.rdm-sh-hd { display:flex; align-items:center; gap:12px; padding:6px 16px 12px; border-bottom:1px solid var(--line-soft); }
.rdm-sh-hd .silk { width:40px; height:40px; }
.rdm-sh-name { font-family:var(--serif); font-weight:700; font-size:21px; color:var(--navy); line-height:1.05; }
.rdm-sh-sub { font-size:12.5px; color:var(--muted); margin-top:3px; }
.rdm-sh-x { margin-left:auto; appearance:none; cursor:pointer; width:32px; height:32px; border-radius:50%; border:1px solid var(--line-soft); background:#fff; color:var(--muted); font-size:14px; flex:none; }
.rdm-sh-sec { padding:13px 16px 4px; }
.rdm-sh-lab { font:700 9.5px/1 var(--sans); letter-spacing:.11em; text-transform:uppercase; color:var(--muted); margin-bottom:9px; display:flex; align-items:center; gap:8px; }
.rdm-sh-lab i { flex:1; height:1px; background:var(--line-soft); }
.rdm-sh-lab b { color:var(--gold-deep,#9a7d3c); }
.rdm-five { display:grid; grid-template-columns:repeat(5,1fr); gap:6px; }
.rdm-cell { text-align:center; background:var(--paper); border:1px solid var(--line-soft); border-radius:9px; padding:8px 2px 7px; }
.rdm-cl { font:700 8px/1 var(--sans); letter-spacing:.05em; text-transform:uppercase; color:var(--muted); }
.rdm-cv { font-size:14px; font-weight:750; color:var(--navy); font-variant-numeric:tabular-nums; margin-top:4px; }
.rdm-cell.best { background:var(--gold-soft); }
.rdm-cell.best .rdm-cv, .rdm-cell.best .rdm-cl { color:var(--bronze); }
.rdm-money { display:flex; align-items:baseline; gap:10px; }
.rdm-price { font-size:23px; font-weight:750; color:var(--navy); font-variant-numeric:tabular-nums; }
.rdm-mvw { font:700 11px/1 var(--sans); letter-spacing:.04em; text-transform:uppercase; }
.rdm-mvw.firm { color:#12805a; } .rdm-mvw.drift { color:var(--oxblood); }
.rdm-note { margin:8px 16px 2px; padding:11px 13px; border-radius:11px; font-size:12.5px; line-height:1.5; color:var(--ink); background:rgba(200,164,93,.10); border:1px solid rgba(200,164,93,.34); }
.rdm-note b { color:var(--gold-deep,#9a7d3c); }
.rdm-sh-actions { display:flex; gap:9px; padding:14px 16px 6px; }
.rdm-act { flex:1; appearance:none; cursor:pointer; text-align:center; padding:13px 8px; border-radius:12px; font:700 12.5px/1 var(--sans); }
.rdm-act.primary { color:var(--ivory); background:var(--navy); border:1px solid var(--navy); }
.rdm-act.ghost { color:var(--navy); background:#fff; border:1px solid var(--line-soft); }
.rdm-act.ghost.on { color:var(--green); border-color:color-mix(in srgb,var(--green) 45%,transparent); background:rgba(11,61,46,.07); }

.rdm-rp { position:fixed; inset:0; z-index:62; background:var(--ivory); display:flex; flex-direction:column; transform:translateY(100%); transition:transform .3s cubic-bezier(.4,0,.2,1); }
.rdm-rp.on { transform:translateY(0); }
.rdm-rp-top { display:flex; align-items:center; gap:10px; padding:11px 14px; color:var(--ivory); background:linear-gradient(120deg,var(--navy),#0a2034); border-bottom:2px solid var(--gold); }
.rdm-rp-ttl { font-family:var(--serif); font-weight:700; font-size:16px; }
.rdm-rp-ttl b { color:var(--gold); }
.rdm-rp-tabs { display:flex; gap:3px; margin-left:auto; background:rgba(255,255,255,.08); border-radius:999px; padding:3px; }
.rdm-rp-tabs button { appearance:none; cursor:pointer; font:700 11px/1 var(--sans); color:var(--gold-soft); background:none; border:0; border-radius:999px; padding:6px 12px; }
.rdm-rp-tabs button.on { color:var(--navy); background:var(--gold); }
.rdm-rp-x { appearance:none; cursor:pointer; width:34px; height:34px; border-radius:50%; border:1px solid rgba(255,255,255,.2); background:rgba(255,255,255,.06); color:var(--ivory); font-size:15px; }
.rdm-rp-rotate { display:flex; align-items:center; gap:9px; margin:12px 16px 0; padding:11px 14px; border-radius:11px; background:rgba(200,164,93,.12); border:1px solid rgba(200,164,93,.4); color:var(--gold-deep,#9a7d3c); font:600 12.5px/1.4 var(--sans); }
.rdm-rp-rotate .ic { font-size:20px; }
@media (orientation:landscape) { .rdm-rp-rotate { display:none; } }
.rdm-rp-scroll { flex:1; overflow:auto; padding:12px; }
.rdm-rp-tab { border-collapse:separate; border-spacing:0; width:100%; min-width:620px; font-variant-numeric:tabular-nums; }
.rdm-rp-tab th { position:sticky; top:0; background:var(--ivory); z-index:2; font:700 9px/1.2 var(--sans); letter-spacing:.06em; text-transform:uppercase; color:var(--muted); padding:8px 6px; text-align:right; white-space:nowrap; }
.rdm-rp-tab th.l, .rdm-rp-tab td.l { text-align:left; }
.rdm-rp-tab td { padding:9px 6px; font-size:13px; border-top:1px solid var(--line-soft); white-space:nowrap; text-align:right; }
.rdm-rp-tab td.name { position:sticky; left:0; background:var(--ivory); font-weight:600; color:var(--navy); }
.rdm-rp-tab th.name { position:sticky; left:0; z-index:3; }
.rdm-rp-tab td.name i { color:var(--muted); font-style:normal; font-size:11px; }
.rdm-rp-tab tr.lead td { background:linear-gradient(90deg,rgba(200,164,93,.12),transparent 70%); }
.rdm-rp-tab td.best { color:var(--gold-deep,#9a7d3c); font-weight:750; }
.rdm-rp-tab .rp-n { display:inline-block; min-width:20px; text-align:center; font-weight:700; color:var(--muted); }
.rdm-rp-foot { font-size:11px; color:var(--muted); opacity:.85; padding:6px 4px 8px; }

.rdm-toast { position:fixed; left:50%; bottom:78px; transform:translate(-50%,16px); z-index:70; background:var(--navy); color:var(--ivory); font:600 12.5px/1.35 var(--sans); padding:11px 16px; border-radius:11px; box-shadow:0 8px 24px rgba(7,26,47,.4); opacity:0; pointer-events:none; transition:.25s; max-width:320px; text-align:center; }
.rdm-toast.on { opacity:1; transform:translate(-50%,0); }
.rdm-toast b { color:var(--gold); }

/* ============================================================ RACE DAY · MOBILE controls fix
   Keep the day/meeting/class filters and the "not live" banner ON the page — no horizontal
   drift. The native <select> min-content width and the banner's flex row were pushing the
   board sideways on a phone. Scoped to Race Day so other views' .selectline is untouched. */
@media (max-width:767px) {
  /* day picker full width; meeting + class share the second row. min-width:0 lets the
     selects shrink to the column instead of forcing the page wider than the viewport. */
  #view-raceday .selectline { display:grid; grid-template-columns:1fr 1fr; gap:8px; align-items:stretch; }
  #view-raceday .selectline select { min-width:0; max-width:100%; width:100%; }
  #view-raceday #raceday-pick { grid-column:1 / -1; }

  /* the base-tier "This board isn't live" upsell stacks on a phone — never a ~500px flex row
     (min-width:260 text + a fixed CTA can't sit side by side at 375–393px) */
  .rd-upsell { flex-direction:column; align-items:stretch; gap:10px; }
  .rd-upsell-txt { min-width:0; }
  .rd-upsell-cta { text-align:center; }

  /* hard guard: nothing in the Race Day board may push the page sideways. The race strip
     keeps its OWN internal scroll (overflow-x:auto on .rdm-strip); this only clips stray drift. */
  #racedaygrid { overflow-x:clip; }
}

/* ============================================================ RACE DAY · MOBILE · GLANCE HERO
   The answer before the field: the race's fastest PROVEN runner, its read against the win
   bar, and its speed SHAPE (typology + native mini-trace). Rides GALLOP's dark instrument
   stage (like the Race Profile traces) so it reads as the signature intelligence headline.
   Diagnostic — a read of what's earned, never a tip. Mobile-only (rendered by rdmHero). */
.rdm-hero {
  display:grid; grid-template-columns:1fr auto; grid-template-areas:"body viz" "foot foot";
  gap:2px 12px; width:100%; text-align:left; appearance:none; cursor:pointer; margin:2px 0 6px;
  background:radial-gradient(130% 150% at 12% -20%, #0d2c49 0%, #08203a 55%, #06131f 100%);
  color:var(--ivory); border:1px solid rgba(200,164,93,.34); border-radius:14px;
  padding:12px 15px 11px; box-shadow:0 8px 22px rgba(7,26,47,.22);
}
.rdm-hero:active { transform:scale(.99); }
.rdm-hero-body { grid-area:body; min-width:0; }
.rdm-hero-lab { font:700 8.5px/1 var(--sans); letter-spacing:.14em; text-transform:uppercase; color:var(--gold-soft); }
.rdm-hero-name { font-family:var(--serif); font-weight:700; font-size:19px; color:var(--ivory);
  line-height:1.1; margin-top:4px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.rdm-hero-name .rdm-cont { color:var(--gold); font-size:13px; }
.rdm-hero-read { font-size:12.5px; color:#a9c0d4; margin-top:4px; font-variant-numeric:tabular-nums; }
.rdm-hero-read b { color:#e6eef5; }
.rdm-hero-ms { color:#34b97e !important; font-size:16px; font-weight:750; }
.rdm-hero-viz { grid-area:viz; display:flex; flex-direction:column; align-items:flex-end; justify-content:center; gap:5px; color:#34b97e; }
.rdm-spark { display:block; }
.rdm-hero-shape { font:700 8px/1 var(--sans); letter-spacing:.07em; text-transform:uppercase; color:var(--gold-soft); }
.rdm-hero-foot { grid-area:foot; margin-top:6px; padding-top:7px; border-top:1px solid rgba(255,255,255,.10);
  font-size:10.5px; line-height:1.4; color:#8ba3b8; }
.rdm-hero-foot b { color:var(--gold-soft); font-variant-numeric:tabular-nums; }

/* ============================================================ MOBILE · EXPERT overflow + tap targets
   The Expert board/file tables are 8–12 non-wrapping columns with no scroll wrapper, so on a
   phone they were forcing the WHOLE page to scroll sideways (main{overflow:auto}) — the last
   true page-wide overflow in the app, and a direct bounce cause. Let each expert table scroll
   INSIDE its own box instead. Plus 44px tap targets on the time-window pills / stable tabs. */
@media (max-width:767px) {
  /* every expert table (board · file call-log · the four source-split tables), scoped to the
     expert view so market's .mi-table is untouched — each scrolls inside its own box */
  #view-expert .mi-table { display:block; overflow-x:auto; -webkit-overflow-scrolling:touch; max-width:100%; }
  .winfilter button, #exwinfilter button { min-height:44px; }
  .stable-tab { min-height:42px; }
  .ex-follow { padding:10px; margin:-10px; font-size:17px; }
}

/* ============================================================ RACE INTELLIGENCE · MOBILE dossier cards
   The 20-column runner terminal → a stacked dossier per runner (rendered by raceIntelMobileCards).
   Completed race: GLANCE = finish · silk · name/jockey·margin · RUN score + field bar; a strip =
   the verdict + the run's speed SHAPE (mini-trace); tap = the full Speed Read instrument, in place. */
@media (max-width:767px) {
  .ri-field { display:flex; flex-direction:column; gap:7px; }
  .ri-card { background:#fff; border:1px solid var(--line-soft); border-radius:13px; overflow:hidden; }
  .ri-card.open { border-color:color-mix(in srgb,var(--gold) 55%,transparent); box-shadow:0 3px 14px rgba(7,26,47,.07); }
  .ri-row { display:grid; grid-template-columns:38px 26px 1fr auto 12px; align-items:center; gap:10px;
    width:100%; text-align:left; appearance:none; background:none; border:0; padding:10px 12px; cursor:pointer;
    font-family:var(--sans); color:inherit; }
  .ri-row:active { background:var(--paper); }
  .ri-fin { font-family:var(--serif); font-weight:700; font-size:15px; color:var(--muted); text-align:center; font-variant-numeric:tabular-nums; }
  .ri-fin.win { color:var(--navy); background:var(--gold); border-radius:7px; padding:4px 0; }
  .ri-row .silk { width:26px; height:26px; }
  .ri-who { min-width:0; }
  .ri-nm { font-size:15px; font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; display:block; }
  .ri-nm .hlink { color:var(--navy); }
  .ri-sub { display:block; font-size:11.5px; color:var(--muted); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; margin-top:1px; }
  .ri-metric { text-align:right; min-width:52px; }
  .ri-mv { font-size:17px; font-weight:750; color:var(--navy); font-variant-numeric:tabular-nums; line-height:1; }
  .ri-mv.best { color:var(--gold-deep,#9a7d3c); }
  .ri-ml { display:block; font:700 8px/1 var(--sans); letter-spacing:.06em; color:var(--muted); margin-top:3px; }
  .ri-wh { font-size:16px; font-weight:700; color:var(--oxblood); }
  .ri-bar { display:block; margin-top:5px; height:3px; border-radius:2px; background:var(--line-soft); overflow:hidden; }
  .ri-bar i { display:block; height:100%; background:var(--green); border-radius:2px; }
  .ri-bar.best i { background:var(--gold); }
  .ri-chev { color:var(--muted); font-size:15px; line-height:1; }
  .ri-strip { display:flex; align-items:center; gap:9px; padding:0 12px 9px; flex-wrap:wrap; }
  .ri-spark { display:inline-flex; align-items:center; gap:6px; color:var(--green); }
  .ri-shape { font:700 8px/1 var(--sans); letter-spacing:.06em; text-transform:uppercase; color:var(--muted); }
  .ri-detail { border-top:1px solid var(--line-soft); background:linear-gradient(180deg,#f5f2ea,#fbf9f4); }
  .ri-detail-in { padding:12px 12px 14px; }
}

/* ============================================================ MOBILE · RACE DAY "THE READ FIRST"
   Doctrine Law 2 / §7: the answer comes before the interface. On a phone, drop the intro
   paragraph (the board + hero already carry the diagnostic framing) and collapse the
   day/meeting/class filters behind a disclosure that NAMES the active pick — so Context → The
   Read reach the glance instead of a filter wall. Desktop shows the selects inline (toggle hidden).
   Shares AF's collapsed-filter grammar (Law 14 · consistency). */
.rd-filtertoggle { display:none; }

@media (max-width:767px) {
  #view-raceday > .viewsub { display:none; }

  .rd-filtertoggle { display:flex; align-items:center; gap:9px; width:100%; margin:0 0 8px;
    appearance:none; cursor:pointer; text-align:left; background:#fff;
    border:1px solid var(--line-soft); border-radius:11px; padding:11px 14px; min-height:44px; }
  .rd-ft-lab { font:700 10px/1 var(--sans); letter-spacing:.09em; text-transform:uppercase; color:var(--muted); flex:none; }
  .rd-ft-sum { font-size:13px; font-weight:600; color:var(--navy); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; flex:1; min-width:0; }
  .rd-ft-car { color:#9a7d3c; font-size:11px; flex:none; transition:transform .18s; }
  #view-raceday.filters-open .rd-ft-car { transform:rotate(180deg); }

  #view-raceday #raceday-filters { display:none; margin-top:0; }
  #view-raceday.filters-open #raceday-filters { display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-bottom:14px; }
}

/* ============================================================ RACE INTELLIGENCE · THE READ HERO
   A completed race opens with its most consequential finding (Doctrine §7 Layer 2 · Law 2):
   a TRUE WIN, or the HIDDEN RUN — the run the result line hides — with the two runs' shapes
   overlaid so a faster beaten line reads at a glance. GALLOP's dark instrument stage; desktop
   + mobile. Diagnostic, never a tip. Green = the clock (speed); gold stays Speed×Market only. */
.rrh { position:relative; margin:0 0 16px; padding:16px 18px 13px; border-radius:16px;
  background:radial-gradient(130% 150% at 10% -20%, #0d2c49 0%, #08203a 55%, #06131f 100%);
  color:var(--ivory); border:1px solid rgba(200,164,93,.30); box-shadow:0 12px 30px rgba(7,26,47,.24);
  display:grid; grid-template-columns:1fr auto; grid-template-areas:"main viz" "foot foot"; gap:2px 20px; }
.rrh-main { grid-area:main; min-width:0; }
/* WITHHELD — visibly present but dimmed (STYLEGUIDE: never hidden, never faked). Oxblood
   marks the state; no green, because no clock was read. */
.rrh-wh { border-color:rgba(200,164,93,.16); box-shadow:0 8px 22px rgba(7,26,47,.18);
  grid-template-columns:1fr; grid-template-areas:"main" "foot"; }
.rrh-wh .rrh-eyebrow b { color:#d4788c; }
.rrh-wh .rrh-headline { color:rgba(246,241,231,.72); }
.rrh-wh .rrh-read { color:#a9bccd; }
.rrh-eyebrow { font:700 9px/1.3 var(--sans); letter-spacing:.15em; text-transform:uppercase; color:#8ba3b8; }
.rrh-earned .rrh-eyebrow b { color:#34b97e; }
.rrh-hidden .rrh-eyebrow b { color:#e6d3a8; }
.rrh-headline { font-family:var(--serif); font-weight:700; font-size:23px; color:var(--ivory);
  line-height:1.12; margin:7px 0 6px; text-wrap:balance; }
.rrh-headline .hlink { color:var(--ivory); cursor:pointer; border-bottom:1px solid transparent; }
.rrh-headline .hlink:hover { border-bottom-color:rgba(230,211,168,.55); }
.rrh-headline .rrh-hl { color:#7fe0b0; }
.rrh-read { font-size:13.5px; line-height:1.55; color:#c3d2df; }
.rrh-read b { color:#eef4f8; }
.rrh-ms { color:#34b97e !important; font-variant-numeric:tabular-nums; }
.rrh-viz { grid-area:viz; display:flex; flex-direction:column; align-items:flex-end; justify-content:center; gap:6px; }
.rrh-viz svg { display:block; }
.rrh-key { font:700 8px/1.3 var(--sans); letter-spacing:.05em; text-transform:uppercase; text-align:right; }
.rrh-key .k-hid { color:#34b97e; } .rrh-key .k-win { color:#8ba3b8; }
.rrh-foot { grid-area:foot; margin-top:9px; padding-top:8px; border-top:1px solid rgba(255,255,255,.10);
  font-size:10.5px; color:#8ba3b8; }
@media (max-width:767px) {
  .rrh { grid-template-columns:1fr; grid-template-areas:"main" "viz" "foot"; gap:8px 0; padding:14px 15px 12px; }
  .rrh-viz { align-items:flex-start; }
  .rrh-key { text-align:left; }
  .rrh-headline { font-size:20px; }
}

/* ============================================================ MOBILE · RACE INTELLIGENCE "READ FIRST"
   Same doctrine as Race Day: The Read leads. Drop the intro; keep the race picker inline (primary
   nav); collapse the four narrowing filters (state/date/class/track) behind the shared Filters
   disclosure. Desktop shows all five selects inline (toggle hidden). */
@media (max-width:767px) {
  #view-race > .viewsub { display:none; }
  #view-race .selectline { display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-bottom:12px; }
  #view-race .selectline select { min-width:0; max-width:100%; width:100%; }
  #view-race .selectline #race-pick { grid-column:1 / -1; }
  #view-race .selectline .race-narrow { display:none; }
  #view-race.filters-open .selectline .race-narrow { display:block; }
}

/* ── Correlation engine — WHOOP-style record patterns (horse page) ── */
.corr-card .corr-base { font-size:13px; color:var(--muted); margin-bottom:14px; }
.corr-card .corr-base b { color:var(--navy); }
.corr-cols { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
@media (max-width:720px){ .corr-cols { grid-template-columns:1fr; } }
.corr-h { font:700 10px/1 var(--sans); letter-spacing:.13em; text-transform:uppercase; margin-bottom:9px; }
.corr-h.pos { color:var(--green,#0B3D2E); } .corr-h.neg { color:var(--oxblood,#7c2d2d); }
.corr-hl { font-size:13px; line-height:1.5; color:var(--ink,#1d2733); padding:8px 11px; border-radius:9px;
  border:1px solid var(--line-soft); margin-bottom:7px; border-left-width:3px; }
.corr-hl.pos { border-left-color:var(--green-hi,#2f9e6e); background:rgba(47,158,110,.05); }
.corr-hl.neg { border-left-color:var(--oxblood,#9a3b3b); background:rgba(154,59,59,.05); }
.corr-hl b { font-variant-numeric:tabular-nums; }
.corr-none { font-size:12px; color:var(--muted); font-style:italic; padding:6px 0; }
.corr-detail { margin-top:16px; border-top:1px solid var(--line-soft); padding-top:10px; }
.corr-detail > summary { cursor:pointer; font:700 11px/1 var(--sans); letter-spacing:.06em; text-transform:uppercase; color:var(--gold-deep,#9a7d3c); }
.corr-ax { margin:6px 0; }
.corr-ax > summary { cursor:pointer; font-size:12.5px; font-weight:600; color:var(--navy); padding:4px 0; }
.corr-brow { display:flex; flex-wrap:wrap; align-items:center; gap:12px; padding:4px 0 4px 14px; font-size:12px; }
.corr-brow .lab { min-width:150px; font-weight:600; color:var(--ink,#1d2733); }
.corr-brow .n { color:var(--muted); min-width:52px; }
.corr-brow .v { font-variant-numeric:tabular-nums; color:var(--ink,#1d2733); }
.corr-brow .v.mut { color:var(--muted); }

/* Conditional record — "what its record expected coming in", per runner on the race page.
   Renders as a .card (inherits the instrument's surface, light or dark). */
.cr-card .cr-base { font-size:12.5px; color:var(--muted); margin-bottom:12px; }
.cr-card .cr-base b { color:var(--navy); }
.cr-row { display:flex; flex-wrap:wrap; align-items:baseline; gap:8px 12px; padding:6px 10px;
  border-radius:9px; border:1px solid var(--line-soft); border-left-width:3px; border-left-color:transparent;
  margin-bottom:6px; font-size:13px; }
.cr-row .cr-lead { min-width:150px; font-weight:600; color:var(--ink,#1d2733); }
.cr-row .cr-rec { color:var(--ink,#1d2733); font-variant-numeric:tabular-nums; }
.cr-row .cr-rec b { font-variant-numeric:tabular-nums; }
.cr-row .cr-n { color:var(--muted); font-size:11.5px; }
.cr-row.pos { border-left-color:var(--green-hi,#2f9e6e); background:rgba(47,158,110,.05); }
.cr-row.neg { border-left-color:var(--oxblood,#9a3b3b); background:rgba(154,59,59,.05); }
.cr-row.wh { opacity:.6; }
.cr-row.wh .cr-rec { color:var(--muted); font-style:italic; }
.cr-flag { font:700 10px/1 var(--sans); letter-spacing:.05em; text-transform:uppercase; margin-left:auto; }
.cr-flag.pos { color:var(--green-hi,#2f9e6e); } .cr-flag.neg { color:var(--oxblood,#9a3b3b); }
.cr-inter { border-left-color:var(--gold,#C8A45D); background:rgba(200,164,93,.08); margin-top:9px; }
.cr-inter .cr-lead { color:var(--gold-deep,#9a7d3c); }
/* the glance-level standout chip on a horse/jockey hero — the panel below carries the full read */
.chip.corr-hero { border-color:var(--green-hi,#2f9e6e); color:var(--green,#0B3D2E);
  background:rgba(47,158,110,.08); font-variant-numeric:tabular-nums; }

/* ---- The MARKET-BLIND ledger (Intelligence page) ------------------------------
   GALLOP graded against the market. The "money never came" rows are styled to be as
   legible as the hits — this surface is only worth anything if it shows both. */
.iq-mbl-head{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));margin:4px 0 12px}
.iq-mbl-stat{display:flex;align-items:baseline;gap:12px;padding:14px 16px;
  border:1px solid var(--line-soft);border-radius:13px;background:rgba(255,255,255,.02);
  border-left:3px solid var(--green-glo,#4fd69a)}
.iq-mbl-stat.iq-mbl-alt{border-left-color:var(--slate,#9fb0c0)}
.iq-mbl-stat b{font-family:var(--serif);font-size:30px;font-variant-numeric:tabular-nums;
  color:var(--ivory);line-height:1}
.iq-mbl-stat span{font-size:12.5px;color:var(--gold-soft);line-height:1.45}
.iq-mbl-stat em{display:block;font-style:normal;font-size:10.5px;color:var(--slate,#9fb0c0);
  margin-top:3px;font-variant-numeric:tabular-nums}
.iq-mbl-note{font-size:11.5px;color:var(--slate,#9fb0c0);line-height:1.55;margin:0 0 14px;max-width:78ch}
.iq-mbl-grp{font:700 9.5px/1.4 var(--sans);letter-spacing:.14em;text-transform:uppercase;
  color:var(--gold);margin:16px 0 7px;padding-top:12px;border-top:1px solid var(--line-soft)}
.iq-mbl-row{display:grid;gap:10px;align-items:center;padding:9px 2px;
  grid-template-columns:96px minmax(0,1fr) 132px 152px;border-bottom:1px solid var(--line-soft)}
.iq-mbl-row:last-child{border-bottom:0}
.iq-mbl-when{font-size:11.5px;color:var(--slate,#9fb0c0);font-variant-numeric:tabular-nums}
.iq-mbl-when span{display:block;font-size:10.5px;opacity:.8}
.iq-mbl-who{min-width:0}
.iq-mbl-who b{display:block;font-size:13.5px;color:var(--ivory);overflow-wrap:anywhere}
.iq-mbl-who span{font-size:11.5px;color:var(--slate,#9fb0c0)}
.iq-mbl-money{font-variant-numeric:tabular-nums;font-size:13px;color:var(--gold-soft);white-space:nowrap}
.iq-mbl-state{font:700 9.5px/1.3 var(--sans);letter-spacing:.1em;text-transform:uppercase}
.iq-mbl-good{color:var(--green-glo,#4fd69a)}
.iq-mbl-mkt{color:var(--ox-hi,#b5566a)}
.iq-mbl-ghost{color:var(--slate,#9fb0c0);opacity:.75}
.iq-mbl-wait{font-size:12.5px;color:var(--slate,#9fb0c0);padding:10px 0}
@media (max-width:640px){
  .iq-mbl-row{grid-template-columns:1fr auto;row-gap:2px}
  .iq-mbl-when{order:1;font-size:11px}
  .iq-mbl-state{order:2;text-align:right}
  .iq-mbl-who{order:3;grid-column:1/-1}
  .iq-mbl-money{order:4;grid-column:1/-1;font-size:12.5px}
}

/* ---- Race Day leads with your horses ------------------------------------------
   The band sits above the meetings board and is the first thing a member who follows
   horses reads. The board keeps its place underneath — demoted, not removed. */
.yh{border:1px solid var(--line-soft);border-radius:14px;padding:15px 17px;margin:0 0 16px;
  background:rgba(255,255,255,.02)}
.yh-hd{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;
  font:700 10px/1.4 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--gold);
  margin-bottom:10px}
.yh-hd span{font:400 11.5px/1.4 var(--sans);letter-spacing:0;text-transform:none;color:var(--slate,#9fb0c0)}
.yh-list{display:flex;flex-direction:column;gap:5px}
.yh-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap;width:100%;text-align:left;
  min-height:44px;padding:8px 12px;border:1px solid var(--line-soft);border-radius:11px;
  background:transparent;cursor:pointer;color:inherit;font:inherit}
.yh-row:hover{border-color:var(--gold);background:rgba(200,164,93,.06)}
.yh-row:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.yh-nm{flex:1 1 150px;min-width:0;font-size:13.5px;font-weight:600;color:var(--ivory);overflow-wrap:anywhere}
.yh-nm em{display:block;font-style:normal;font-weight:400;font-size:11.5px;color:var(--slate,#9fb0c0)}
.yh-at{font-size:12px;color:var(--gold-soft);white-space:nowrap}
.yh-st{font:700 9.5px/1.3 var(--sans);letter-spacing:.1em;text-transform:uppercase;white-space:nowrap}
.yh-run{color:var(--gold)}
.yh-done{color:var(--green-glo,#4fd69a)}
.yh-pend{color:var(--slate,#9fb0c0)}
.yh-scr{color:var(--slate,#9fb0c0);opacity:.75}
.yh-foot{font-size:11.5px;color:var(--slate,#9fb0c0);line-height:1.55;margin-top:10px}
@media (max-width:560px){
  .yh-row{gap:6px}
  .yh-at{order:3;flex:1 1 100%}
}