* { box-sizing: border-box; }

:root {
  --bg:#020617;
  --panel:rgba(15,23,42,.88);
  --panel2:rgba(2,6,23,.72);
  --border:rgba(255,255,255,.12);
  --text:#f8fafc;
  --muted:#94a3b8;
  --cyan:#67e8f9;
  --green:#86efac;
  --amber:#fde68a;
  --red:#fda4af;
  --blue:#93c5fd;
  --shadow:0 26px 90px rgba(0,0,0,.38);
  --good:#22c55e;
  --bad:#ef4444;
  --warn:#f59e0b;
}

html[data-theme="light"] {
  --bg:#eff6ff;
  --panel:rgba(255,255,255,.92);
  --panel2:rgba(248,250,252,.94);
  --border:rgba(15,23,42,.12);
  --text:#020617;
  --muted:#475569;
  --shadow:0 20px 70px rgba(15,23,42,.14);
}

*::-webkit-scrollbar { width:6px; height:6px; }
*::-webkit-scrollbar-track { background:transparent; }
*::-webkit-scrollbar-thumb { background:rgba(148,163,184,.35); border-radius:999px; }
* { scrollbar-width:thin; scrollbar-color:rgba(148,163,184,.35) transparent; }

body {
  margin:0;
  min-height:100vh;
  font-family:Arial, Helvetica, sans-serif;
  color:var(--text);
  background:
    radial-gradient(circle at top left, rgba(103,232,249,.20), transparent 35%),
    radial-gradient(circle at bottom right, rgba(134,239,172,.16), transparent 35%),
    var(--bg);
}

button, input, select, textarea { font:inherit; }
p { color:var(--muted); line-height:1.42; margin:6px 0; }
h1,h2,h3,h4 { margin:0; letter-spacing:-.03em; }
code { color:var(--cyan); }

.wrap { width:min(1340px,100%); margin:0 auto; padding:22px; }
.nav { display:flex; justify-content:space-between; gap:12px; align-items:center; margin-bottom:14px; }
.brand { display:flex; gap:11px; align-items:center; font-weight:950; letter-spacing:-.04em; font-size:19px; }
.mark { width:42px; height:42px; border-radius:16px; display:grid; place-items:center; color:#020617; background:linear-gradient(135deg,var(--cyan),var(--green)); flex:0 0 auto; }
.nav-actions { display:flex; gap:8px; flex-wrap:wrap; justify-content:flex-end; }

.btn {
  border:1px solid var(--border);
  background:rgba(255,255,255,.07);
  color:var(--text);
  border-radius:14px;
  padding:9px 12px;
  font-weight:900;
  cursor:pointer;
  text-decoration:none;
  display:inline-flex;
  gap:7px;
  align-items:center;
  justify-content:center;
  min-height:38px;
  line-height:1;
}
.btn.primary { background:var(--cyan); color:#020617; border-color:transparent; }
.btn.green { background:var(--green); color:#020617; border-color:transparent; }
.btn.amber { background:var(--amber); color:#020617; border-color:transparent; }
.btn.danger { color:var(--red); border-color:rgba(253,164,175,.3); background:rgba(253,164,175,.1); }
.btn:disabled { opacity:.42; cursor:not-allowed; filter:grayscale(.55); }

.screen.hidden, .hidden { display:none!important; }
.panel, .hero { background:var(--panel); border:1px solid var(--border); border-radius:28px; box-shadow:var(--shadow); padding:18px; }
.hero { border-radius:32px; padding:30px; margin-bottom:18px; }
.hero h1 { margin:0; font-size:clamp(42px,7vw,84px); line-height:.9; letter-spacing:-.075em; max-width:960px; }
.hero-actions { display:flex; gap:10px; flex-wrap:wrap; margin-top:16px; }
.landing-grid { display:grid; grid-template-columns:1.1fr .9fr; gap:18px; align-items:stretch; }
.feature-list { display:grid; gap:10px; margin-top:12px; }
.feature { border:1px solid var(--border); background:rgba(255,255,255,.045); border-radius:18px; padding:14px; }
.feature strong { display:block; margin-bottom:5px; }

.badge { display:inline-flex; align-items:center; border:1px solid var(--border); border-radius:999px; padding:6px 9px; font-size:11px; font-weight:950; color:var(--muted); background:rgba(255,255,255,.055); line-height:1; white-space:nowrap; }
.badge.green { color:#bbf7d0; background:rgba(34,197,94,.13); border-color:rgba(134,239,172,.28); }
.badge.blue { color:#bfdbfe; background:rgba(59,130,246,.13); border-color:rgba(147,197,253,.28); }
.badge.amber { color:#fef3c7; background:rgba(245,158,11,.13); border-color:rgba(253,230,138,.30); }
.badge.red { color:#fecdd3; background:rgba(244,63,94,.13); border-color:rgba(253,164,175,.30); }
.badge.gray { color:var(--muted); }

.career-bar { display:grid; grid-template-columns:repeat(6,1fr); gap:10px; margin-bottom:14px; }
.stat { border:1px solid var(--border); border-radius:18px; padding:12px; background:rgba(255,255,255,.045); min-width:0; }
.stat span { display:block; font-size:10px; letter-spacing:.16em; text-transform:uppercase; color:var(--muted); font-weight:950; }
.stat strong { display:block; margin-top:4px; font-size:20px; overflow-wrap:anywhere; color:var(--text); }
.stat strong.tone-positive { color:#bbf7d0; }
.stat strong.tone-negative { color:#fecdd3; }
.stat strong.tone-neutral { color:var(--text); }

.game-grid { display:grid; grid-template-columns:minmax(0,1fr) 380px; gap:18px; align-items:start; }
.side { display:grid; gap:14px; }
.control-bar { display:flex; justify-content:space-between; align-items:center; gap:10px; flex-wrap:wrap; margin-bottom:10px; }
.control-bar.compact { align-items:stretch; }
.control-left { display:flex; gap:7px; flex-wrap:wrap; align-items:center; }
.segmented-tabs { display:inline-grid; grid-template-columns:repeat(3,1fr); border:1px solid var(--border); border-radius:15px; overflow:hidden; background:rgba(255,255,255,.045); min-width:285px; }
.view-tab { border:0; border-right:1px solid var(--border); background:transparent; color:var(--text); padding:9px 12px; font-size:13px; font-weight:950; cursor:pointer; min-height:38px; }
.view-tab:last-child { border-right:0; }
.view-tab.active { background:var(--cyan); color:#020617; }
.view-tab:disabled { opacity:.42; cursor:not-allowed; background:rgba(148,163,184,.08); color:var(--muted); }

.race-card { border:1px solid var(--border); border-radius:24px; overflow:hidden; background:var(--panel2); }
.race-card.used-daily { opacity:.66; filter:saturate(.65); }
.race-head { padding:13px 14px; border-bottom:1px solid var(--border); display:flex; justify-content:space-between; gap:10px; flex-wrap:wrap; }
.race-head h2 { margin:0; font-size:22px; }
.race-meta { display:flex; flex-wrap:wrap; gap:6px; margin-top:8px; }
.runner-list { display:grid; gap:8px; padding:12px; }
.runner { border-radius:19px; background:rgba(255,255,255,.045); border:1px solid rgba(255,255,255,.08); overflow:hidden; }
.runner.strategy-match { border-color:rgba(134,239,172,.55); box-shadow:0 0 0 1px rgba(134,239,172,.20) inset; }
.runner.non-runner { opacity:.55; filter:grayscale(.7); }
.runner.dnf { opacity:.78; filter:saturate(.65); }
.runner-row { display:grid; grid-template-columns:44px minmax(0,1fr) auto; gap:10px; align-items:center; padding:10px 12px; min-height:70px; }
.runner-toggle { display:block; width:100%; background:transparent; color:var(--text); border:0; padding:0; cursor:pointer; text-align:left; }
.num { width:38px; height:38px; border-radius:14px; background:linear-gradient(135deg,var(--cyan),var(--green)); color:#020617; display:grid; place-items:center; font-weight:950; }
.runner.non-runner .num { background:#64748b; color:white; }
.runner.dnf .num { background:#94a3b8; color:#020617; }
.runner small { display:block; margin-top:3px; color:var(--muted); line-height:1.28; font-size:12px; }
.runner-actions { display:flex; gap:5px; justify-content:flex-end; align-items:center; flex-wrap:nowrap; }
.bet-btn { border-radius:999px; padding:7px 9px; border:1px solid transparent; font-size:12px; font-weight:950; cursor:pointer; color:#020617; min-width:50px; min-height:31px; line-height:1; }
.bet-btn.win { background:var(--green); }
.bet-btn.place { background:var(--blue); }
.bet-btn.ew { background:var(--amber); }
.bet-btn:disabled { opacity:.45; cursor:not-allowed; }
.runner-body { display:none; border-top:1px solid var(--border); padding:12px; background:rgba(2,6,23,.20); }
.runner.open .runner-body { display:block; }
.metric-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:7px; }
.metric { border:1px solid var(--border); border-radius:14px; padding:9px; background:rgba(255,255,255,.04); min-height:58px; }
.metric span { display:block; color:var(--muted); font-size:9px; font-weight:950; text-transform:uppercase; letter-spacing:.1em; }
.metric strong { display:block; margin-top:5px; font-size:13px; overflow-wrap:anywhere; }
.runner-note, .empty-state { border:1px dashed var(--border); border-radius:14px; padding:12px; color:var(--muted); font-size:13px; background:rgba(255,255,255,.035); }

.assist-label-row { display:flex; flex-wrap:wrap; gap:5px; margin-top:7px; }
.assist-panel { border:1px solid rgba(103,232,249,.22); background:rgba(103,232,249,.07); border-radius:16px; padding:11px; margin-bottom:10px; }
.assist-panel h4 { margin:0 0 7px; letter-spacing:-.02em; }
.signal-pill, .prediction-pill, .filter-chip { display:inline-flex; align-items:center; gap:6px; border:1px solid var(--border); border-radius:999px; padding:6px 8px; font-size:11px; font-weight:950; background:rgba(255,255,255,.06); color:var(--muted); line-height:1; }
.signal-pill.good { color:#bbf7d0; background:rgba(34,197,94,.14); border-color:rgba(134,239,172,.28); }
.signal-pill.warn { color:#fef3c7; background:rgba(245,158,11,.14); border-color:rgba(253,230,138,.30); }
.signal-pill.bad { color:#fecdd3; background:rgba(244,63,94,.14); border-color:rgba(253,164,175,.30); }
.prediction-pill { color:#bfdbfe; background:rgba(59,130,246,.13); border-color:rgba(147,197,253,.28); }
.reason-list { margin:8px 0 0; padding-left:18px; color:var(--muted); font-size:14px; line-height:1.55; }

.animation-head { display:flex; justify-content:space-between; gap:12px; align-items:center; flex-wrap:wrap; margin-bottom:12px; }
.track { position:relative; padding:15px; border-radius:24px; border:1px solid rgba(134,239,172,.25); background:linear-gradient(90deg, rgba(15,23,42,.85), rgba(6,78,59,.50)); overflow:hidden; }
.track:after { content:""; position:absolute; top:42px; bottom:15px; right:14%; width:5px; border-radius:999px; background:var(--amber); box-shadow:0 0 25px rgba(253,230,138,.58); z-index:1; }
.track-labels { display:flex; justify-content:space-between; color:var(--muted); font-size:10px; text-transform:uppercase; letter-spacing:.16em; font-weight:950; margin-bottom:10px; padding:0 6px; }
.lane { position:relative; height:54px; margin-bottom:9px; border:1px solid rgba(255,255,255,.075); border-radius:17px; background:rgba(255,255,255,.04); overflow:hidden; }
.lane.non-runner { opacity:.5; background:rgba(100,116,139,.18); }
.lane.dnf { opacity:.72; background:rgba(148,163,184,.14); }
.lane-fill { position:absolute; left:0; top:0; bottom:0; width:0%; background:linear-gradient(90deg, rgba(103,232,249,.08), rgba(134,239,172,.18)); transition:width .16s linear; }
.lane-time { position:absolute; right:12px; top:50%; transform:translateY(-50%); color:rgba(248,250,252,.72); font-size:12px; font-weight:950; z-index:0; }
.horse { position:absolute; top:50%; left:0%; transform:translateY(-50%); display:flex; align-items:center; gap:8px; transition:left .18s linear; z-index:2; max-width:calc(100% - 8px); }
.horse.nr, .horse.dnf { filter:grayscale(1); opacity:.72; }
.horse.finished.label-left { flex-direction:row-reverse; }
.horse.finished.label-left .horse-label { text-align:right; }
.chip { width:38px; height:38px; border-radius:999px; display:grid; place-items:center; color:#020617; font-weight:950; background:linear-gradient(135deg,#67e8f9,#3b82f6); flex:0 0 auto; }
.lane.dnf .chip { background:#94a3b8; color:#020617; }
.horse-label { border:1px solid rgba(255,255,255,.12); background:rgba(2,6,23,.82); color:#f8fafc; padding:6px 9px; border-radius:13px; font-size:12px; min-width:112px; max-width:155px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

.results-shell { padding:2px 0; }
.result-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin-bottom:12px; }
.result-summary .summary-box { border:1px solid var(--border); border-radius:16px; padding:12px; background:rgba(255,255,255,.045); }
.summary-box span { display:block; color:var(--muted); font-size:10px; text-transform:uppercase; letter-spacing:.14em; font-weight:950; }
.summary-box strong { display:block; margin-top:5px; font-size:22px; }
.result-list { display:grid; gap:8px; margin-top:10px; }
.result-line, .slip-line, .history-line { border:1px solid var(--border); border-radius:16px; padding:10px; background:rgba(255,255,255,.045); display:flex; justify-content:space-between; gap:10px; align-items:flex-start; margin-top:8px; }
.result-line { display:grid; grid-template-columns:52px 1fr auto; align-items:center; }
.result-line.compact { grid-template-columns:52px 1fr; }
.result-line .place-chip { width:42px; height:34px; border-radius:12px; display:grid; place-items:center; background:rgba(255,255,255,.08); font-weight:950; }
.result-line small, .slip-line small, .history-line small { color:var(--muted); display:block; margin-top:3px; line-height:1.25; }

input, select, textarea { width:100%; border:1px solid var(--border); border-radius:14px; padding:10px 12px; background:rgba(255,255,255,.06); color:var(--text); outline:none; }
input[type="number"] { appearance:textfield; -moz-appearance:textfield; }
input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button { -webkit-appearance:none; margin:0; }
option { color:#020617; }
label { display:block; margin:10px 0 5px; font-size:10px; text-transform:uppercase; letter-spacing:.14em; font-weight:950; color:var(--muted); }
.two { display:grid; grid-template-columns:1fr 1fr; gap:9px; }
.subtle { color:var(--muted); }
.stake-control { display:grid; grid-template-columns:34px minmax(0,1fr) 34px; gap:7px; align-items:center; }
.stake-step { width:34px; height:38px; border-radius:13px; padding:0; border:1px solid var(--border); background:rgba(255,255,255,.07); color:var(--text); font-weight:950; cursor:pointer; }
.slip-actions { display:flex; gap:8px; margin-top:12px; flex-wrap:wrap; }
.slip-locked #betControlsBox, .slip-locked #slipList, .slip-locked #clearSlipBtn { display:none!important; }

.toast { position:fixed; right:20px; bottom:20px; z-index:99; max-width:420px; padding:14px 16px; border-radius:18px; border:1px solid var(--border); background:rgba(2,6,23,.92); color:#f8fafc; box-shadow:var(--shadow); display:none; }
.toast.show { display:block; }
.modal { position:fixed; inset:0; background:rgba(2,6,23,.74); display:none; align-items:center; justify-content:center; z-index:80; padding:20px; }
.modal.show { display:flex; }
.modal-card { width:min(760px,100%); max-height:92vh; overflow:auto; border:1px solid var(--border); border-radius:28px; padding:18px; background:var(--panel); box-shadow:var(--shadow); }
.modal-card.wide { width:min(980px,100%); }
.tabs { display:flex; gap:8px; margin:12px 0; }
.tab { flex:1; border:1px solid var(--border); background:rgba(255,255,255,.06); color:var(--text); border-radius:15px; padding:10px; font-weight:950; cursor:pointer; }
.tab.active { background:var(--cyan); color:#020617; }

.performance-head, .section-title-row { display:flex; justify-content:space-between; gap:12px; align-items:flex-start; flex-wrap:wrap; }
.performance-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:10px; }
.condition-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-top:12px; }
.analysis-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin-top:12px; }
.analysis-grid.coach-grid { grid-template-columns:1fr 1fr; }
.analysis-card { border:1px solid var(--border); background:rgba(255,255,255,.045); border-radius:18px; padding:14px; }
.analysis-card h4 { margin:0 0 8px; }
.analysis-card.coach-card p { font-size:15px; line-height:1.55; color:var(--text); }
.history-table-wrap { max-height:360px; overflow:auto; border:1px solid var(--border); border-radius:18px; margin-top:12px; }
.history-table { width:100%; border-collapse:collapse; min-width:860px; }
.history-table th, .history-table td { padding:10px; border-bottom:1px solid var(--border); text-align:left; font-size:13px; vertical-align:top; }
.history-table th { position:sticky; top:0; background:rgba(15,23,42,.98); z-index:2; color:var(--muted); text-transform:uppercase; letter-spacing:.1em; font-size:10px; cursor:pointer; }
.history-table tr:last-child td { border-bottom:0; }

.checkout-grid { display:grid; grid-template-columns:1fr 360px; gap:18px; align-items:start; }
.legal { border:1px solid var(--border); border-radius:18px; padding:14px; background:rgba(255,255,255,.045); }
.checkout-card { border:1px solid var(--border); border-radius:18px; background:rgba(255,255,255,.045); padding:14px; display:grid; gap:12px; }
.receipt-card { border:1px solid var(--border); border-radius:16px; background:rgba(255,255,255,.04); padding:12px; display:grid; gap:9px; }
.receipt-row { display:flex; align-items:flex-start; justify-content:space-between; gap:14px; }
.receipt-row span { color:var(--muted); font-weight:800; }
.receipt-row strong:last-child { text-align:right; }
.receipt-divider { height:1px; background:var(--border); }
.receipt-row.total strong:last-child { font-size:20px; }
.discount-inline-row { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:8px; align-items:center; }
.plan-points { list-style:none; padding:0; margin:0; display:grid; gap:8px; }
.plan-points li { border:1px solid var(--border); background:rgba(255,255,255,.04); border-radius:14px; padding:10px; color:var(--muted); font-weight:800; font-size:13px; }
.consent-row { display:grid; grid-template-columns:18px 1fr; gap:10px; align-items:start; padding:10px 12px; border:1px solid var(--border); border-radius:14px; background:rgba(255,255,255,.04); margin-top:10px; }
.consent-row input { width:18px; height:18px; margin:1px 0 0; accent-color:var(--cyan); }
.tiny-note { color:var(--muted); font-size:12px; font-weight:700; line-height:1.45; }

.filter-builder-grid { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:10px; }
.filter-picker-row { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:8px; align-items:center; }
.filter-chip-list { display:flex; flex-wrap:wrap; gap:6px; min-height:32px; margin-top:8px; }
.filter-chip button { border:0; background:transparent; color:inherit; cursor:pointer; font-weight:950; padding:0; line-height:1; }
.prebuild-note { border:1px solid rgba(253,230,138,.28); background:rgba(245,158,11,.09); border-radius:16px; padding:12px; margin-top:12px; color:var(--muted); font-size:13px; line-height:1.42; }

.strategy-workspace { display:grid; grid-template-columns:minmax(0,1fr) 250px; gap:12px; margin-top:14px; }
.strategy-main { display:grid; gap:12px; min-width:0; }
.strategy-help-panel { border:1px solid var(--border); border-radius:18px; padding:14px; background:rgba(255,255,255,.045); }
.rule-builder-row { display:grid; grid-template-columns:1.25fr .9fr .9fr .9fr .8fr auto; gap:8px; align-items:end; margin-top:10px; }
.strategy-rule-list { display:grid; gap:8px; margin-top:12px; }
.rule-row { border:1px solid var(--border); border-radius:14px; padding:10px; background:rgba(255,255,255,.045); display:grid; grid-template-columns:minmax(0,1fr) auto; gap:10px; align-items:center; }
.rule-row strong { display:block; }
.rule-row small { display:block; color:var(--muted); margin-top:2px; }
.notes-list { display:grid; gap:8px; margin-top:12px; }
.note-card { border:1px solid var(--border); border-radius:16px; padding:10px; background:rgba(255,255,255,.045); }
.note-actions { display:flex; gap:8px; flex-wrap:wrap; margin-top:10px; }
textarea { resize:vertical; min-height:90px; }
.strategy-summary-select { margin-bottom:10px; }
.strategy-match-box { border:1px solid rgba(134,239,172,.28); background:rgba(34,197,94,.08); border-radius:16px; padding:10px; margin-top:10px; }

.tone-positive { color:#bbf7d0!important; }
.tone-negative { color:#fecdd3!important; }
.tone-neutral { color:var(--text)!important; }

@media (max-width:1120px) {
  .game-grid, .landing-grid, .checkout-grid, .career-bar, .strategy-workspace { grid-template-columns:1fr; }
}
@media (max-width:860px) {
  .metric-grid, .performance-grid, .condition-grid, .analysis-grid, .analysis-grid.coach-grid { grid-template-columns:1fr 1fr; }
  .runner-row { grid-template-columns:38px 1fr; }
  .runner-actions { grid-column:1/-1; justify-content:flex-start; }
  .rule-builder-row { grid-template-columns:1fr 1fr; }
  .segmented-tabs { min-width:100%; }
}
@media (max-width:560px) {
  .metric-grid, .performance-grid, .condition-grid, .analysis-grid, .analysis-grid.coach-grid, .filter-builder-grid, .two { grid-template-columns:1fr; }
  .result-summary { grid-template-columns:1fr; }
  .wrap { padding:14px; }
}


/* v7 compact/gameplay fixes */
:root { --green:#4ade80; --red:#fb7185; --amber:#facc15; --blue:#60a5fa; }
.badge.green { color:#ecfdf5; background:rgba(22,163,74,.52); border-color:rgba(134,239,172,.65); }
.badge.red { color:#fff1f2; background:rgba(220,38,38,.62); border-color:rgba(253,164,175,.7); }
.signal-pill.good { color:#ecfdf5; background:rgba(22,163,74,.52); border-color:rgba(134,239,172,.62); }
.signal-pill.bad { color:#fff1f2; background:rgba(220,38,38,.62); border-color:rgba(253,164,175,.7); }
.signal-pill.warn, .badge.amber { color:#422006; background:rgba(250,204,21,.82); border-color:rgba(253,230,138,.86); }
.prediction-pill, .badge.blue { color:#eff6ff; background:rgba(37,99,235,.48); border-color:rgba(147,197,253,.55); }
.compact-panel { padding:14px; border-radius:22px; }
.account-mini { display:grid; gap:10px; }
.account-title { display:flex; justify-content:space-between; gap:8px; align-items:center; }
.account-title strong { font-size:18px; }
.account-actions { display:grid; grid-template-columns:1fr 1fr; gap:7px; }
.empty-flat { border:1px dashed var(--border); border-radius:12px; padding:8px 10px; color:var(--muted); font-size:13px; background:rgba(255,255,255,.03); }
#pinnedNotesBox { margin-top:8px; }
.compact-strategy-workspace, .strategy-workspace { grid-template-columns:minmax(0,1fr); }
.strategy-main, .strategy-help-panel { display:none; }
.rule-builder-row { grid-template-columns:1.15fr .85fr .9fr .85fr .9fr auto; }
.soft-divider { border:0; border-top:1px solid var(--border); margin:14px 0; }
.info-btn { border:1px solid rgba(103,232,249,.45); background:rgba(103,232,249,.16); color:var(--cyan); width:24px; height:24px; border-radius:999px; font-size:13px; font-weight:950; cursor:pointer; }
.info-popover { position:relative; border:1px solid rgba(103,232,249,.3); background:rgba(2,6,23,.95); border-radius:16px; padding:12px; margin:8px 0; }
.info-popover ul { margin:8px 0 0; padding-left:18px; color:var(--muted); font-size:13px; line-height:1.5; }
.analysis-card.coach-card { position:relative; overflow:hidden; padding-left:20px; }
.analysis-card.coach-card:before { content:""; position:absolute; left:0; top:12px; bottom:12px; width:5px; border-radius:999px; background:linear-gradient(180deg,#22d3ee,#4ade80); box-shadow:0 0 13px rgba(34,211,238,.9),0 0 26px rgba(74,222,128,.5); }
.history-tools { display:grid; grid-template-columns:1fr 170px; gap:8px; margin-top:10px; }
.history-tools input, .history-tools select { padding:9px 10px; border-radius:12px; }
.history-table { min-width:980px; table-layout:fixed; }
.history-table th, .history-table td { padding:9px; font-size:12px; vertical-align:middle; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.history-table th { user-select:none; }
.track:after { right:10px; }
.lane { height:48px; margin-bottom:6px; overflow:visible; }
.horse { transform:translate(-50%,-50%); }
.lane-time { left:50%; right:auto; transform:translate(-50%,-50%); z-index:6; text-align:center; white-space:nowrap; pointer-events:none; font-weight:950; color:rgba(248,250,252,.88); text-shadow:0 1px 10px rgba(0,0,0,.7); }
.result-list { gap:6px; }
.settled-bets-card, .results-table-card { border:1px solid var(--border); border-radius:18px; background:rgba(255,255,255,.045); overflow:hidden; margin-top:12px; }
.settled-bets-card h3, .results-table-card h3 { padding:12px 12px 0; }
.settled-bets-table, .compact-results-table { width:100%; border-collapse:collapse; table-layout:fixed; }
.settled-bets-table th, .settled-bets-table td, .compact-results-table th, .compact-results-table td { padding:8px 9px; border-bottom:1px solid var(--border); font-size:12px; text-align:left; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.settled-bets-table th, .compact-results-table th { color:var(--muted); font-size:10px; text-transform:uppercase; letter-spacing:.1em; }
.settled-bets-table tr:last-child td, .compact-results-table tr:last-child td { border-bottom:0; }
.bet-row-win { background:rgba(22,163,74,.52); }
.bet-row-place { background:rgba(250,204,21,.76); color:#1f1600; }
.bet-row-loss { background:rgba(220,38,38,.62); }
.bet-row-void { background:rgba(100,116,139,.45); }
.tone-positive { color:#4ade80!important; }
.tone-negative { color:#fb7185!important; }
@media (max-width:860px) { .rule-builder-row { grid-template-columns:1fr 1fr; } .history-tools { grid-template-columns:1fr; } }
@media (max-width:560px) { .account-actions { grid-template-columns:1fr; } }
:root {
  --surface-strong: rgba(255,255,255,.075);
  --surface-soft: rgba(255,255,255,.045);
  --text-strong: #f8fafc;
}

html[data-theme="light"] {
  --surface-strong: rgba(15,23,42,.075);
  --surface-soft: rgba(15,23,42,.035);
  --text-strong: #020617;
}

/* Header and layout polish */
.nav { position: sticky; top: 0; z-index: 50; backdrop-filter: blur(16px); padding: 8px 0; }
.brand { min-width: 0; }
.nav-actions .btn { white-space: nowrap; }
.panel, .hero, .modal-card { backdrop-filter: blur(18px); }
.control-bar.compact { gap: 12px; }
.control-left .btn { flex: 0 0 auto; }

/* Better button feedback */
.btn, .bet-btn, .tab, .view-tab, .stake-step {
  transition: transform .14s ease, filter .14s ease, background .14s ease, border-color .14s ease, opacity .14s ease;
}
.btn:not(:disabled):hover,
.bet-btn:not(:disabled):hover,
.tab:not(:disabled):hover,
.view-tab:not(:disabled):hover,
.stake-step:not(:disabled):hover { filter: brightness(1.08); }
.btn:not(:disabled):active,
.bet-btn:not(:disabled):active,
.tab:not(:disabled):active,
.view-tab:not(:disabled):active,
.stake-step:not(:disabled):active { transform: translateY(1px) scale(.99); }

/* Racecard compact stats table used by game.js v8 */
.runner-metrics-table-wrap {
  border: 1px solid var(--border);
  border-radius: 16px;
  overflow: hidden;
  background: rgba(255,255,255,.035);
}

.runner-metrics-table {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
}

.runner-metrics-table th,
.runner-metrics-table td {
  padding: 8px 10px;
  border-bottom: 1px solid var(--border);
  font-size: 12px;
  line-height: 1.25;
  vertical-align: middle;
}

.runner-metrics-table tr:last-child th,
.runner-metrics-table tr:last-child td { border-bottom: 0; }

.runner-metrics-table th {
  width: 46%;
  color: var(--muted);
  text-align: left;
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: .1em;
  font-weight: 950;
}

.runner-metrics-table td {
  color: var(--text);
  text-align: right;
  font-weight: 900;
  overflow-wrap: anywhere;
}

.metric-good td { color: #86efac; }
.metric-warn td { color: #fde68a; }
.metric-bad td { color: #fda4af; }
.metric-neutral td { color: var(--text); }

html[data-theme="light"] .metric-good td { color: #15803d; }
html[data-theme="light"] .metric-warn td { color: #92400e; }
html[data-theme="light"] .metric-bad td { color: #be123c; }

/* Valid strategy highlights */
.strategy-race-summary {
  margin-top: 7px !important;
  max-width: 820px;
}
.runner.strategy-match {
  background: linear-gradient(135deg, rgba(34,197,94,.12), rgba(255,255,255,.045));
}
.runner.strategy-match .num { box-shadow: 0 0 0 3px rgba(134,239,172,.18); }
.strategy-match-box strong { color: #bbf7d0; }
html[data-theme="light"] .strategy-match-box strong { color: #166534; }

/* Assist labels: keep compact rows readable on narrow cards */
.runner-toggle .assist-label-row { max-width: 100%; }
.signal-pill, .prediction-pill { max-width: 100%; }
.signal-pill, .prediction-pill, .filter-chip { overflow-wrap: anywhere; }
.assist-panel .reason-list li { margin-bottom: 2px; }

/* Slip locked state: show the result summary but hide editable controls */
.slip-locked #slipResultVisual { display: block; }
.slip-locked #runRaceBtn { opacity: 1; filter: none; }
#runRaceBtn.ready-new-race { opacity: 1!important; filter: none!important; }

/* Animation: fix finish-line overlap, DNF/NR states and mobile clipping */
.track {
  isolation: isolate;
  overflow: hidden;
  padding-right: 26px;
}
.track:after {
  right: 18px;
  z-index: 3;
}
.lane {
  overflow: hidden;
  background: linear-gradient(90deg, rgba(255,255,255,.035), rgba(255,255,255,.055));
}
.horse {
  will-change: left;
  min-width: 152px;
  max-width: 230px;
}
.horse.finished .chip { box-shadow: 0 0 0 4px rgba(134,239,172,.18), 0 0 24px rgba(134,239,172,.28); }
.horse.nr .chip, .horse.dnf .chip { box-shadow: none; }
.horse-label { box-shadow: 0 10px 24px rgba(0,0,0,.22); }
.lane-time { background: rgba(2,6,23,.56); border: 1px solid rgba(255,255,255,.12); border-radius: 999px; padding: 4px 8px; }
html[data-theme="light"] .lane-time { background: rgba(255,255,255,.74); color: #020617; text-shadow: none; }

/* Results tables */
.settled-bets-card,
.results-table-card { box-shadow: 0 16px 45px rgba(0,0,0,.14); }
.settled-bets-card h3,
.results-table-card h3 { margin-bottom: 8px; }
.settled-bets-table th:nth-child(1) { width: 80px; }
.settled-bets-table th:nth-child(3) { width: 96px; }
.settled-bets-table th:nth-child(4) { width: 82px; }
.settled-bets-table th:nth-child(5),
.settled-bets-table th:nth-child(6),
.settled-bets-table th:nth-child(7) { width: 90px; }
.compact-results-table th:nth-child(1) { width: 72px; }
.compact-results-table th:nth-child(2) { width: 56px; }
.compact-results-table th:nth-child(5) { width: 140px; }
.bet-row-win td:first-child,
.bet-row-place td:first-child,
.bet-row-loss td:first-child,
.bet-row-void td:first-child { font-weight: 950; }

/* Performance and strategy editor */
.performance-head p { max-width: 760px; }
.analysis-card.coach-card ul { margin-top: 6px; }
.history-table-wrap { background: rgba(255,255,255,.025); }
.history-table td.tone-positive { font-weight: 950; }
.history-table td.tone-negative { font-weight: 950; }
.strategy-editor-card { margin-top: 4px; }
.strategy-editor-card textarea { min-height: 72px; }
.rule-builder-row > div,
.rule-builder-row > button { min-width: 0; }
.rule-row { align-items: start; }
.note-card p { max-height: 4.5em; overflow: hidden; }
#ruleInfoPopover { z-index: 4; }

/* Account/settings modal */
.bank-warning { border-color: rgba(253,230,138,.30); background: rgba(245,158,11,.08); }
.account-mini .btn { width: 100%; }

/* Forms and modals */
.modal-card { overscroll-behavior: contain; }
input:focus, select:focus, textarea:focus {
  border-color: rgba(103,232,249,.58);
  box-shadow: 0 0 0 3px rgba(103,232,249,.10);
}

@media (max-width: 1120px) {
  .nav { position: static; }
  .side { grid-template-columns: 1fr 1fr; align-items: start; }
  .side .panel:first-child,
  .side #strategyNotesPanel { grid-column: 1 / -1; }
}

@media (max-width: 860px) {
  .control-left { width: 100%; display: grid; grid-template-columns: 1fr 1fr; }
  .control-left .btn { width: 100%; }
  .side { grid-template-columns: 1fr; }
  .runner-row { align-items: start; }
  .runner-actions { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); width: 100%; }
  .bet-btn { width: 100%; }
  .horse { min-width: 132px; max-width: 190px; }
  .horse-label { min-width: 96px; max-width: 132px; font-size: 11px; }
  .settled-bets-card,
  .results-table-card,
  .history-table-wrap { overflow-x: auto; }
}

@media (max-width: 560px) {
  .hero { padding: 22px; border-radius: 24px; }
  .hero h1 { font-size: clamp(36px, 13vw, 56px); }
  .nav { align-items: flex-start; }
  .nav-actions { width: 100%; justify-content: stretch; }
  .nav-actions .btn { flex: 1 1 auto; }
  .control-left { grid-template-columns: 1fr; }
  .runner-row { grid-template-columns: 34px 1fr; padding: 9px; }
  .num { width: 34px; height: 34px; border-radius: 12px; }
  .runner small { font-size: 11px; }
  .runner-metrics-table th,
  .runner-metrics-table td { padding: 7px 8px; font-size: 11px; }
  .runner-metrics-table th { font-size: 9px; }
  .track { padding: 10px 18px 10px 10px; }
  .lane { height: 44px; }
  .chip { width: 32px; height: 32px; }
  .horse { min-width: 118px; max-width: 160px; }
  .horse-label { display: none; }
  .lane-time { font-size: 10px; padding: 3px 6px; }
  .settled-bets-table,
  .compact-results-table { min-width: 720px; }
}
/* v10 frontend polish: daily labels, odds, auto strategy, compact metrics, animation */
:root { --finish-line-left:84%; }
.loading-overlay {
  position:fixed;
  inset:0;
  z-index:120;
  display:none;
  align-items:center;
  justify-content:center;
  padding:22px;
  background:rgba(2,6,23,.64);
  backdrop-filter:blur(8px);
}
.loading-overlay.show { display:flex; }
.loading-card {
  width:min(430px,100%);
  border:1px solid rgba(103,232,249,.30);
  border-radius:28px;
  padding:24px;
  background:var(--panel);
  box-shadow:var(--shadow);
  text-align:center;
}
.loader-horse {
  width:70px;
  height:70px;
  margin:0 auto 12px;
  border-radius:24px;
  display:grid;
  place-items:center;
  color:#020617;
  background:linear-gradient(135deg,var(--cyan),var(--green));
  font-size:34px;
  animation:horse-bob .75s ease-in-out infinite alternate;
}
.loading-card strong { display:block; font-size:28px; letter-spacing:-.04em; }
.loading-card p { font-size:15px; margin-top:8px; color:var(--text); }
.loading-bar { height:9px; border-radius:999px; overflow:hidden; background:rgba(255,255,255,.08); margin-top:16px; }
.loading-bar span { display:block; width:42%; height:100%; border-radius:inherit; background:linear-gradient(90deg,var(--cyan),var(--green)); animation:loading-slide 1.15s ease-in-out infinite; }
@keyframes horse-bob { from { transform:translateY(0) rotate(-2deg); } to { transform:translateY(-8px) rotate(2deg); } }
@keyframes loading-slide { 0% { transform:translateX(-110%); } 55% { transform:translateX(80%); } 100% { transform:translateX(260%); } }
.is-loading .control-bar .btn, .is-loading .view-tab { pointer-events:none; }

.control-bar.compact { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:stretch; gap:12px; overflow:visible; }
.race-action-tabs { display:inline-grid; grid-auto-flow:column; grid-auto-columns:minmax(118px,max-content); gap:0; border:1px solid var(--border); border-radius:16px; overflow:hidden; background:rgba(255,255,255,.045); width:max-content; max-width:100%; }
.race-action-tabs .btn { min-width:0; width:100%; border:0!important; border-right:1px solid var(--border)!important; border-radius:0!important; background:transparent!important; color:var(--text)!important; padding:10px 13px; min-height:42px; white-space:nowrap; box-shadow:none; }
.race-action-tabs .btn:last-child { border-right:0!important; }
.race-action-tabs .btn:not(:disabled):hover { background:rgba(103,232,249,.13)!important; transform:none; filter:none; outline:1px solid rgba(103,232,249,.18); outline-offset:-1px; }
.race-action-tabs .btn.active { background:linear-gradient(135deg,rgba(103,232,249,.30),rgba(134,239,172,.20))!important; color:var(--text)!important; }
.race-action-tabs .btn.dim { color:var(--muted)!important; }
.race-action-tabs .btn.used, .race-action-tabs .btn:disabled.used { background:rgba(100,116,139,.18)!important; color:var(--muted)!important; filter:grayscale(.75); opacity:.68; }
.btn.glow, .race-action-tabs .btn.glow { box-shadow:0 0 0 1px rgba(134,239,172,.35) inset, 0 0 26px rgba(134,239,172,.30)!important; animation:soft-glow 1.4s ease-in-out infinite alternate; }
@keyframes soft-glow { from { filter:saturate(1); } to { filter:saturate(1.18) brightness(1.05); } }
#performanceBtn { min-width:126px; }

select, input, textarea { min-height:42px; box-shadow:0 0 0 1px transparent inset; transition:border-color .12s ease, background-color .12s ease, box-shadow .12s ease; }
select:focus, input:focus, textarea:focus { border-color:rgba(103,232,249,.45); box-shadow:0 0 0 3px rgba(103,232,249,.12); }
select { appearance:none; background-image:linear-gradient(45deg,transparent 50%,var(--muted) 50%),linear-gradient(135deg,var(--muted) 50%,transparent 50%); background-position:calc(100% - 18px) 18px,calc(100% - 12px) 18px; background-size:6px 6px,6px 6px; background-repeat:no-repeat; padding-right:34px; }
.rule-builder-row { grid-template-columns:minmax(170px,1.15fr) minmax(120px,.75fr) minmax(150px,.95fr) minmax(120px,.75fr) minmax(150px,.95fr) auto!important; gap:10px!important; align-items:end; border:1px solid var(--border); border-radius:20px; padding:12px; background:rgba(255,255,255,.035); }
.rule-builder-row label { margin-top:0; }
.rule-builder-row .hidden { display:none!important; }
.strategy-rule-list { margin-top:12px; }

.analysis-grid.coach-grid { margin-bottom:18px; }
.history-table-wrap { margin-top:18px; }
.performance-head + #performanceBox { margin-bottom:14px; }

.race-head-main { display:flex; width:100%; justify-content:space-between; align-items:flex-start; gap:14px; }
.race-title-block { min-width:0; flex:1 1 auto; }
.racecard-settings-button { width:42px; height:42px; flex:0 0 auto; border-radius:15px; border:1px solid var(--border); background:rgba(255,255,255,.065); color:var(--text); font-size:18px; cursor:pointer; }
.racecard-settings-button:hover { background:rgba(103,232,249,.13); }
.racecard-settings-button.active { background:var(--cyan); color:#020617; border-color:transparent; }
.racecard-options-panel { width:100%; margin-top:12px; border:1px solid var(--border); border-radius:20px; padding:12px; background:rgba(255,255,255,.045); }
.racecard-options-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
.racecard-option { margin:0; display:flex; align-items:flex-start; gap:9px; padding:11px; border:1px solid var(--border); border-radius:16px; background:rgba(255,255,255,.045); color:var(--text); font-size:13px; text-transform:none; letter-spacing:0; }
.racecard-option input { width:auto; min-height:0; margin-top:2px; }
.racecard-option small { display:block; margin-top:3px; color:var(--muted); line-height:1.3; }
.metric-exclude-details { margin-top:11px; }
.metric-exclude-details summary { cursor:pointer; color:var(--text); font-weight:950; }
.metric-exclude-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:7px 12px; margin-top:10px; }
.metric-exclude-grid label { margin:0; display:flex; gap:7px; align-items:center; color:var(--muted); font-size:12px; text-transform:none; letter-spacing:0; }
.metric-exclude-grid input { width:auto; min-height:0; }
.strategy-match-box.valid { border-color:rgba(134,239,172,.34); background:rgba(34,197,94,.10); }
.strategy-match-box.invalid { border-color:rgba(253,164,175,.34); background:rgba(244,63,94,.10); }
.strategy-match-box.invalid strong { color:#fecdd3; }
html[data-theme="light"] .strategy-match-box.invalid strong { color:#991b1b; }

.track:after { left:var(--finish-line-left); right:auto; }
.track-labels span:last-child { margin-right:2%; }
.lane { overflow:hidden; contain:layout paint; }
.horse, .lane-fill { will-change:left,width,transform; }
body.race-animating .horse, body.race-animating .lane-fill { transition:none!important; }
.horse.finished .chip { box-shadow:0 0 0 3px rgba(253,230,138,.22), 0 0 20px rgba(253,230,138,.26); }
.horse.nr { left:2%!important; }
.lane.non-runner .lane-fill { display:none; }

.settled-bets-table th, .settled-bets-table td, .compact-results-table th, .compact-results-table td { font-size:14px; line-height:1.35; padding:10px 11px; }
.compact-results-table td:nth-child(3), .settled-bets-table td:nth-child(2) { font-size:15px; font-weight:950; }
.result-summary .summary-box strong { font-size:26px; }
.bet-row-place { background:rgba(245,158,11,.34)!important; color:var(--text)!important; }
.bet-row-place td:first-child { color:#fef3c7; }
html[data-theme="light"] .bet-row-place { background:rgba(245,158,11,.18)!important; color:#3b2500!important; }
html[data-theme="light"] .bet-row-place td:first-child { color:#92400e; }
.result-muted { opacity:.68; filter:grayscale(.75); }

@media (max-width: 980px) {
  .control-bar.compact { grid-template-columns:1fr; }
  .race-action-tabs { width:100%; grid-auto-flow:row; grid-auto-columns:unset; grid-template-columns:1fr 1fr; }
  .race-action-tabs .btn { border-right:0!important; border-bottom:1px solid var(--border)!important; }
  .race-action-tabs .btn:nth-last-child(-n+2) { border-bottom:0!important; }
  .segmented-tabs { justify-self:stretch; width:100%; }
  .racecard-options-grid, .metric-exclude-grid { grid-template-columns:1fr; }
}
@media (max-width: 760px) {
  .rule-builder-row { grid-template-columns:1fr!important; }
  .race-action-tabs { grid-template-columns:1fr; }
  .race-action-tabs .btn:nth-last-child(-n+2) { border-bottom:1px solid var(--border)!important; }
  .race-action-tabs .btn:last-child { border-bottom:0!important; }
  .settled-bets-table, .compact-results-table { min-width:720px; }
  .settled-bets-card, .results-table-card { overflow:auto; }
}

/* v10 odds, strategy switch, metrics and race animation fixes */
.runner.market-favourite {
  border-color: rgba(253,230,138,.55);
  box-shadow: 0 0 0 1px rgba(253,230,138,.18) inset, 0 12px 34px rgba(245,158,11,.10);
}
.runner.market-favourite .num {
  background: linear-gradient(135deg, var(--amber), #f97316);
}
.favourite-badge { text-transform: uppercase; letter-spacing: .06em; }
.odds-row {
  display:flex;
  align-items:center;
  gap:6px;
  flex-wrap:wrap;
  margin-top:7px;
}
.odds-badge {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:62px;
  padding:7px 10px;
  border-radius:999px;
  font-size:14px;
  font-weight:950;
  line-height:1;
  color:#020617;
  background:linear-gradient(135deg,#f8fafc,#cbd5e1);
  border:1px solid rgba(255,255,255,.30);
}
.odds-badge.fav {
  background:linear-gradient(135deg,var(--amber),#fb923c);
  box-shadow:0 0 0 3px rgba(245,158,11,.16);
}
.odds-decimal {
  display:inline-flex;
  border:1px solid var(--border);
  border-radius:999px;
  padding:5px 8px;
  color:var(--muted);
  font-size:11px;
  font-weight:950;
  line-height:1;
}
.odds-source { font-size:10px; line-height:1; }

.runner-metrics-categories {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
}
.runner-metric-category {
  border:1px solid var(--border);
  border-radius:16px;
  overflow:hidden;
  background:rgba(255,255,255,.035);
  min-width:0;
}
.runner-metric-category h4 {
  padding:8px 10px;
  border-bottom:1px solid var(--border);
  color:var(--text);
  font-size:12px;
  letter-spacing:.02em;
  background:rgba(255,255,255,.045);
}
.runner-metric-category .runner-metrics-table th { width:54%; }
.runner-metric-category .runner-metrics-table td { width:46%; }

.strategy-toggle-row {
  display:grid;
  grid-template-columns:46px minmax(0,1fr);
  grid-template-areas:"switch text";
  gap:10px;
  align-items:center;
  margin:10px 0 0;
  padding:10px;
  border:1px solid var(--border);
  border-radius:16px;
  background:rgba(255,255,255,.045);
  text-transform:none;
  letter-spacing:0;
  color:var(--text);
  cursor:pointer;
}
.strategy-toggle-row input {
  position:absolute;
  opacity:0;
  pointer-events:none;
}
.strategy-toggle-row .switch-ui {
  grid-area:switch;
  width:46px;
  height:26px;
  border-radius:999px;
  border:1px solid var(--border);
  background:rgba(148,163,184,.28);
  position:relative;
  transition:background .16s ease, border-color .16s ease;
}
.strategy-toggle-row .switch-ui:after {
  content:"";
  position:absolute;
  width:20px;
  height:20px;
  top:2px;
  left:2px;
  border-radius:999px;
  background:#f8fafc;
  box-shadow:0 4px 12px rgba(0,0,0,.24);
  transition:transform .16s ease;
}
.strategy-toggle-row input:checked + .switch-ui {
  background:rgba(34,197,94,.58);
  border-color:rgba(134,239,172,.72);
}
.strategy-toggle-row input:checked + .switch-ui:after { transform:translateX(20px); }
.strategy-toggle-row span:last-child { grid-area:text; }
.strategy-toggle-row small { display:block; margin-top:3px; color:var(--muted); line-height:1.25; }
.strategy-toggle-row input:disabled + .switch-ui { opacity:.45; filter:grayscale(.8); }

.horse.bet-win .chip, .lane.bet-win .chip { background:linear-gradient(135deg,#86efac,#22c55e); color:#052e16; }
.horse.bet-ew .chip, .lane.bet-ew .chip { background:linear-gradient(135deg,#fde68a,#f97316); color:#351a03; }
.horse.bet-place .chip, .lane.bet-place .chip { background:linear-gradient(135deg,#bfdbfe,#60a5fa); color:#0f172a; }
.horse.finished.label-left { transform:translate(-100%,-50%); }
.horse.finished.label-left .horse-label {
  max-width:190px;
  background:rgba(2,6,23,.92);
}
.horse.bet-win.finished .chip { box-shadow:0 0 0 4px rgba(34,197,94,.22), 0 0 24px rgba(34,197,94,.35); }
.horse.bet-ew.finished .chip { box-shadow:0 0 0 4px rgba(245,158,11,.24), 0 0 24px rgba(245,158,11,.35); }
.track:after { left:var(--finish-line-left)!important; right:auto!important; }

@media (max-width: 980px) {
  .runner-metrics-categories { grid-template-columns:1fr; }
}
@media (max-width: 560px) {
  .odds-row { gap:5px; }
  .odds-badge { min-width:52px; font-size:12px; padding:6px 8px; }
  .runner-metric-category h4 { font-size:11px; }
  .horse.finished.label-left { transform:translate(-100%,-50%); }
}

/* v12 real fixes: odds column, compact metric pairs, stable finish animation */
.runner-row {
  grid-template-columns: 44px minmax(0,1fr) minmax(96px,128px) auto !important;
  overflow: hidden;
}
.runner-toggle { min-width:0; }
.runner-toggle small { overflow-wrap:anywhere; }
.runner-odds-cell {
  min-width:0;
  align-self:stretch;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  gap:4px;
  padding:6px 7px;
  border:1px solid var(--border);
  border-radius:16px;
  background:rgba(255,255,255,.055);
  overflow:hidden;
}
.runner-odds-cell.fav {
  border-color:rgba(253,230,138,.58);
  background:rgba(245,158,11,.13);
}
.runner-odds-cell .odds-badge {
  min-width:72px;
  max-width:100%;
  font-size:15px;
  padding:8px 10px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.runner-odds-cell .odds-meta {
  display:block;
  width:100%;
  color:var(--muted);
  font-size:10px;
  font-weight:900;
  line-height:1.15;
  text-align:center;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.runner-actions { min-width:max-content; }

.compact-metric-table { table-layout:fixed; }
.compact-metric-table th,
.compact-metric-table td {
  width:25% !important;
  padding:7px 8px;
  border-bottom:1px solid var(--border);
  vertical-align:middle;
}
.compact-metric-table th {
  color:var(--muted);
  font-size:9px;
  letter-spacing:.08em;
  text-transform:uppercase;
  text-align:left;
}
.compact-metric-table td {
  color:var(--text);
  text-align:right;
  font-size:12px;
  font-weight:950;
  overflow-wrap:anywhere;
}
.compact-metric-table th.metric-good,
.compact-metric-table td.metric-good { color:#86efac; }
.compact-metric-table th.metric-warn,
.compact-metric-table td.metric-warn { color:#fde68a; }
.compact-metric-table th.metric-bad,
.compact-metric-table td.metric-bad { color:#fda4af; }
html[data-theme="light"] .compact-metric-table th.metric-good,
html[data-theme="light"] .compact-metric-table td.metric-good { color:#15803d; }
html[data-theme="light"] .compact-metric-table th.metric-warn,
html[data-theme="light"] .compact-metric-table td.metric-warn { color:#92400e; }
html[data-theme="light"] .compact-metric-table th.metric-bad,
html[data-theme="light"] .compact-metric-table td.metric-bad { color:#be123c; }

.track { padding-right:34px; }
.track:after { left:var(--finish-line-left)!important; right:auto!important; }
.horse { transform:translate(-50%,-50%)!important; transition:left .12s linear; }
body.race-animating .horse, body.race-animating .lane-fill { transition:none!important; }
.horse.finished.label-left {
  flex-direction:row-reverse!important;
  transform:translate(-50%,-50%)!important;
}
.horse.finished.label-left .horse-label {
  text-align:right;
  max-width:190px;
  background:rgba(2,6,23,.92);
}
.lane { overflow:hidden; }

@media (max-width: 860px) {
  .runner-row { grid-template-columns: 38px minmax(0,1fr) minmax(86px,110px) !important; }
  .runner-actions { grid-column:1/-1; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); width:100%; }
  .runner-odds-cell { align-self:center; }
}
@media (max-width: 560px) {
  .runner-row { grid-template-columns:34px minmax(0,1fr) 82px !important; }
  .runner-odds-cell .odds-badge { min-width:54px; font-size:12px; padding:6px 7px; }
  .runner-odds-cell .odds-meta { display:none; }
  .compact-metric-table th,
  .compact-metric-table td { display:block; width:100%!important; text-align:left; }
  .compact-metric-table tr { display:grid; grid-template-columns:1fr 1fr; gap:0; border-bottom:1px solid var(--border); }
  .compact-metric-table tr:last-child { border-bottom:0; }
  .compact-metric-table tr th:nth-child(3), .compact-metric-table tr td:nth-child(4) { border-top:1px solid rgba(255,255,255,.06); }
}


/* v13 landing polish, cleaner odds text, smoother race animation and DNF final states */
.landing-grid > .landing-card,
.landing-grid > .hero,
.landing-grid > .panel {
  border-radius:32px;
  padding:30px;
  min-height:100%;
}
.landing-info-panel h2 { margin-top:8px; }
.landing-info-panel > p { max-width:760px; margin-top:8px; }
.landing-info-panel .feature-list {
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
  margin-top:16px;
}
.landing-info-panel .feature {
  border-radius:18px;
  border:1px solid var(--border);
  background:rgba(255,255,255,.045);
  min-height:104px;
}
html[data-theme="light"] .landing-info-panel .feature { background:rgba(15,23,42,.035); }
.runner-odds-cell .odds-meta { font-size:10px; }
.horse.dnf,
.horse.nr { filter:grayscale(1); opacity:.72; }
.lane.dnf {
  background:rgba(100,116,139,.20)!important;
  border-color:rgba(148,163,184,.30)!important;
}
.lane.dnf .lane-fill {
  background:linear-gradient(90deg, rgba(100,116,139,.10), rgba(148,163,184,.24))!important;
}
.horse.dnf .chip,
.lane.dnf .chip,
.horse.dnf.bet-win .chip,
.horse.dnf.bet-ew .chip,
.horse.dnf.bet-place .chip,
.lane.dnf.bet-win .chip,
.lane.dnf.bet-ew .chip,
.lane.dnf.bet-place .chip {
  background:#94a3b8!important;
  color:#020617!important;
  box-shadow:none!important;
}
.horse.dnf .horse-label {
  background:rgba(51,65,85,.92)!important;
  border-color:rgba(148,163,184,.38)!important;
  color:#f8fafc!important;
}
body.race-animating .horse,
body.race-animating .lane-fill { transition:none!important; }
.horse.finished.label-left { transform:translate(-50%,-50%)!important; }
.track { padding-right:42px; }
@media (max-width: 860px) {
  .landing-info-panel .feature-list { grid-template-columns:1fr; }
}
@media (max-width: 560px) {
  .landing-grid > .landing-card,
  .landing-grid > .hero,
  .landing-grid > .panel { padding:22px; }
  .landing-info-panel .feature { min-height:auto; }
}


/* v14 EW terms, notes scroll/delete, strategy controls and streamlined checkout */
.runner-odds-cell.no-place-terms {
  background: rgba(148,163,184,.10);
  border-color: rgba(148,163,184,.24);
}
.runner-odds-cell.no-place-terms .odds-meta { color: rgba(203,213,225,.78); }
html[data-theme="light"] .runner-odds-cell.no-place-terms .odds-meta { color:#64748b; }

select optgroup {
  color: var(--text);
  background: #0f172a;
  font-weight: 950;
}
select option {
  color: #020617;
  background: #f8fafc;
}
html[data-theme="light"] select optgroup { color:#020617; background:#e2e8f0; }
.rule-value-select[multiple] {
  min-height: 118px;
  padding: 6px;
}
.select-help {
  display:block;
  color:var(--muted);
  font-size:11px;
  font-weight:800;
  margin-top:5px;
  line-height:1.25;
}
.strategy-rule-list,
.notes-list,
.pinned-notes-scroll {
  max-height: 380px;
  overflow:auto;
  padding-right: 4px;
}
#notesList.notes-list { max-height: 430px; }
.note-card-head {
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:8px;
  margin-bottom:4px;
}
.note-card.is-pinned {
  border-color: rgba(253,230,138,.40);
  background: rgba(245,158,11,.08);
}
.note-actions .btn.danger { margin-left:auto; }
.strategy-editor-card textarea#strategyNoteBody { max-height:180px; }

.checkout-grid.streamlined-checkout {
  grid-template-columns:minmax(0,1fr) 320px;
  gap:14px;
}
.checkout-grid.streamlined-checkout .panel,
.checkout-grid.streamlined-checkout .checkout-card,
.checkout-grid.streamlined-checkout .legal,
.checkout-grid.streamlined-checkout .receipt-card {
  border-radius:16px;
  padding:12px;
}
.checkout-grid.streamlined-checkout .checkout-card { gap:10px; }
.checkout-grid.streamlined-checkout .plan-points {
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:7px;
}
.checkout-grid.streamlined-checkout .plan-points li {
  border-radius:12px;
  padding:8px 9px;
  font-size:12px;
  line-height:1.28;
}
.checkout-grid.streamlined-checkout .legal h3 { margin-bottom:4px; }
.checkout-grid.streamlined-checkout .tiny-note p { margin:4px 0; }
.checkout-grid.streamlined-checkout .receipt-row.total strong:last-child { font-size:18px; }
.checkout-hero-slim {
  border-radius:22px!important;
  padding:18px!important;
  margin-bottom:12px!important;
}
.checkout-hero-slim h1 { font-size:clamp(32px,5vw,54px)!important; }
.checkout-hero-slim p { max-width:860px; }

.settled-bets-table th:nth-child(4) { width:84px; }
.settled-bets-table th:nth-child(5) { width:82px; }
.settled-bets-table th:nth-child(6),
.settled-bets-table th:nth-child(7),
.settled-bets-table th:nth-child(8) { width:88px; }

@media (max-width:1120px) {
  .checkout-grid.streamlined-checkout { grid-template-columns:1fr; }
}
@media (max-width:760px) {
  .checkout-grid.streamlined-checkout .plan-points { grid-template-columns:1fr; }
  .strategy-rule-list,
  .notes-list,
  .pinned-notes-scroll { max-height:320px; }
}

/* v22 account creation/sign-up fixes */
.auth-card-v22 {
  width: min(760px, 100%);
  padding: 18px;
}
.auth-card-v22 .modal-head-row {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: flex-start;
  margin-bottom: 10px;
}
.auth-modal-intro {
  margin-top: 6px;
  max-width: 620px;
  font-size: 13px;
}
.auth-tabs-v22 { margin: 10px 0 14px; }
.auth-form-v22 {
  display: grid;
  gap: 8px;
}
.auth-form-v22.hidden { display: none !important; }
.auth-form-v22 label:not(.signup-check-row) {
  margin: 7px 0 0;
}
.auth-form-v22 input,
.auth-form-v22 select {
  min-height: 40px;
}
.signup-two {
  gap: 8px;
}
.signup-warning-box,
.signup-error-box {
  border: 1px solid rgba(253, 230, 138, .32);
  background: rgba(245, 158, 11, .10);
  border-radius: 16px;
  padding: 11px 12px;
  color: var(--text);
  font-size: 13px;
  line-height: 1.45;
}
.signup-warning-box.compact p { margin: 4px 0 0; }
.signup-warning-box ul {
  margin: 7px 0 0;
  padding-left: 18px;
  color: var(--muted);
}
.signup-error-box {
  border-color: rgba(253, 164, 175, .45);
  background: rgba(244, 63, 94, .14);
  color: #fecdd3;
  font-weight: 850;
  margin-bottom: 10px;
}
.signup-checkbox-stack {
  display: grid;
  gap: 7px;
  margin-top: 6px;
}
.signup-check-row {
  display: grid !important;
  grid-template-columns: 18px minmax(0, 1fr);
  gap: 10px !important;
  align-items: start !important;
  margin: 0 !important;
  padding: 10px 11px;
  border: 1px solid var(--border);
  border-radius: 14px;
  background: rgba(255, 255, 255, .045);
  text-transform: none !important;
  letter-spacing: 0 !important;
  font-size: 13px !important;
  color: var(--text) !important;
}
.signup-check-row.optional {
  background: rgba(255, 255, 255, .028);
}
.signup-check-row input {
  width: 18px !important;
  height: 18px;
  min-height: 18px;
  margin: 2px 0 0;
  accent-color: var(--cyan);
}
.signup-check-row strong {
  display: block;
  font-size: 13px;
  color: var(--text);
  line-height: 1.2;
}
.signup-check-row small {
  display: block;
  margin-top: 3px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.35;
  font-weight: 700;
}
.signup-check-row a,
.game-signup-tos a,
.auth-help-copy a {
  color: var(--cyan);
  text-decoration: underline;
  font-weight: 900;
}
.game-signup-tos {
  border-top: 1px solid var(--border);
  padding-top: 10px;
  margin-top: 4px;
  font-size: 12px;
  line-height: 1.45;
}
.auth-help-copy {
  margin: -2px 0 2px;
  text-align: left;
}
.full-width { width: 100%; }
.verify-actions-v22 {
  margin-top: 8px;
}
html[data-theme="light"] .signup-warning-box {
  color: #1f2937;
  background: rgba(245, 158, 11, .14);
}
html[data-theme="light"] .signup-error-box {
  color: #9f1239;
  background: rgba(244, 63, 94, .10);
}
@media (max-width: 560px) {
  .auth-card-v22 { padding: 14px; }
  .auth-card-v22 .modal-head-row { flex-direction: column; }
  .verify-actions-v22 { grid-template-columns: 1fr; }
}
/* v25 tiered game subscription checkout */
.tiered-plan-hero {
  display:flex;
  justify-content:space-between;
  gap:18px;
  align-items:flex-start;
  flex-wrap:wrap;
}
.tier-hero-badges,
.page-badges {
  display:flex;
  gap:7px;
  flex-wrap:wrap;
  justify-content:flex-end;
}
.tiered-checkout-grid {
  align-items:start;
}
.tiered-plan-panel,
.tiered-checkout-card {
  min-width:0;
}
.game-tier-grid {
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:12px;
  margin:14px 0;
}
.checkout-tier-grid {
  margin-top:8px;
}
.game-tier-card {
  width:100%;
  color:var(--text);
  text-align:left;
  border:1px solid var(--border);
  background:rgba(255,255,255,.045);
  border-radius:22px;
  padding:14px;
  cursor:pointer;
  display:grid;
  gap:10px;
  min-height:100%;
  box-shadow:none;
}
.game-tier-card:hover {
  border-color:rgba(103,232,249,.45);
  transform:translateY(-1px);
}
.game-tier-card.selected {
  border-color:rgba(134,239,172,.72);
  box-shadow:0 0 0 1px rgba(134,239,172,.25) inset, 0 20px 50px rgba(34,197,94,.10);
  background:rgba(34,197,94,.08);
}
.game-tier-card.current {
  border-color:rgba(253,230,138,.70);
}
.game-tier-card-head {
  display:flex;
  justify-content:space-between;
  gap:10px;
  align-items:flex-start;
  flex-wrap:wrap;
}
.game-tier-card-head strong {
  font-size:18px;
  letter-spacing:-.03em;
}
.game-tier-price {
  display:flex;
  align-items:flex-end;
  gap:6px;
}
.game-tier-price strong {
  font-size:30px;
  line-height:1;
  letter-spacing:-.05em;
  color:var(--text);
}
.game-tier-price span {
  color:var(--muted);
  font-weight:900;
  font-size:13px;
  padding-bottom:3px;
}
.game-tier-card p {
  margin:0;
  min-height:38px;
}
.game-tier-card ul {
  margin:0;
  padding:0;
  list-style:none;
  display:grid;
  gap:7px;
}
.game-tier-card li {
  color:var(--muted);
  font-size:12px;
  font-weight:800;
  line-height:1.35;
  border:1px solid var(--border);
  border-radius:12px;
  padding:8px;
  background:rgba(255,255,255,.035);
}
.selected-tier-summary,
.checkout-selected-summary {
  border:1px solid var(--border);
  border-radius:18px;
  padding:14px;
  background:rgba(255,255,255,.045);
  display:grid;
  gap:10px;
}
.purchase-side-panel {
  position:sticky;
  top:14px;
}
@media (max-width:1120px) {
  .game-tier-grid { grid-template-columns:1fr; }
  .purchase-side-panel { position:static; }
}
@media (max-width:620px) {
  .tiered-plan-hero { padding:22px; }
  .game-tier-price strong { font-size:24px; }
  .game-tier-card { border-radius:18px; }
}


/* v26 shared static page and footer cleanup */
body { display:flex; flex-direction:column; }
.wrap { flex:1 0 auto; }
.game-page-wrap { width:min(1180px,100%); }
.game-page-shell,
.checkout-page-shell { display:grid; gap:14px; }
.page-hero-card { display:flex; justify-content:space-between; gap:16px; align-items:flex-start; flex-wrap:wrap; }
.page-hero-card h1 { font-size:clamp(34px,5vw,64px); line-height:.94; }
.page-hero-card p { max-width:780px; }
.page-badges { display:flex; gap:7px; flex-wrap:wrap; justify-content:flex-end; align-items:center; }
.page-grid,
.legal-layout-v17 { display:grid; grid-template-columns:minmax(0,1fr) 340px; gap:14px; align-items:start; }
.legal-layout-v17 { grid-template-columns:320px minmax(0,1fr); }
.page-main-stack,
.page-side-stack { display:grid; gap:14px; min-width:0; }
.page-card,
.legal-section-card { border:1px solid var(--border); background:var(--panel); border-radius:24px; box-shadow:var(--shadow); padding:18px; min-width:0; }
.page-card.soft { background:var(--panel2); }
.page-card h2,
.legal-section-card h2 { font-size:24px; margin-bottom:8px; }
.page-card h3 { font-size:18px; margin-bottom:8px; }
.page-list,
.readable-list { display:grid; gap:8px; margin:8px 0 0; padding-left:20px; color:var(--muted); line-height:1.5; }
.legal-copy { display:grid; gap:10px; }
.legal-copy p,
.legal-copy li { color:var(--muted); font-weight:700; line-height:1.55; }
.toc-list { list-style:none; padding:0; margin:8px 0 0; display:grid; gap:8px; }
.toc-list a { display:block; padding:10px 12px; border:1px solid var(--border); border-radius:14px; background:rgba(255,255,255,.045); color:var(--text); text-decoration:none; font-weight:900; }
.toc-list a:hover { border-color:rgba(103,232,249,.45); background:rgba(103,232,249,.08); }
.checkout-card-v17,
.checkout-card-v20 { display:grid; gap:14px; }
.video-consent-box,
.video-frame-shell { border:1px solid var(--border); border-radius:18px; background:rgba(255,255,255,.045); padding:14px; margin-top:10px; }
.video-frame-shell iframe { width:100%; aspect-ratio:16 / 9; border:0; border-radius:14px; }
.site-footer { flex:0 0 auto; margin-top:auto; background:rgba(15,23,42,.74); color:var(--muted); text-align:center; padding:18px 14px 24px; font-size:12px; line-height:1.45; border-top:1px solid var(--border); position:relative; z-index:8; box-shadow:0 -2px 20px rgba(0,0,0,.15); backdrop-filter:blur(12px); }
html[data-theme="light"] .site-footer { background:rgba(255,255,255,.82); box-shadow:0 -2px 20px rgba(15,23,42,.08); }
.site-footer p { margin:.35rem 0; color:var(--muted); }
.site-footer-inner { max-width:920px; margin:0 auto; display:grid; gap:.1rem; justify-items:center; text-align:center; }
.site-footer p,
.site-footer-links { width:100%; }
.site-footer a { color:var(--cyan); text-decoration:none; font-weight:900; }
html[data-theme="light"] .site-footer a { color:#0369a1; }
.site-footer-links { display:flex; flex-wrap:wrap; justify-content:center; gap:.35rem .6rem; margin:.35rem 0 .5rem; }
.site-footer-support,
.site-footer-meta { max-width:900px; margin:.4rem auto 0; }
.daily-limit-card { max-width:560px; }
.daily-limit-actions { display:flex; gap:8px; flex-wrap:wrap; margin-top:14px; }
@media (max-width:980px) { .page-grid, .legal-layout-v17 { grid-template-columns:1fr; } .page-badges { justify-content:flex-start; } }
@media (max-width:560px) { .page-hero-card h1 { font-size:34px; } .page-card, .legal-section-card { border-radius:20px; padding:14px; } .site-footer { padding-left:10px; padding-right:10px; } }

/* v27 cleanup: stronger modal layer, readable static pages, centred footer */
.modal { z-index: 180; }
.daily-limit-modal { z-index: 220; }
.daily-limit-card { max-width: 540px; text-align: center; display: grid; gap: 12px; }
.daily-limit-icon { width: 66px; height: 66px; margin: 0 auto; border-radius: 24px; display: grid; place-items: center; background: linear-gradient(135deg, var(--cyan), var(--green)); color: #020617; font-size: 34px; font-weight: 950; }
.daily-limit-card h2 { margin: 0; font-size: 30px; line-height: 1; }
.daily-limit-actions { justify-content: center; }
.daily-limit-actions .btn { min-width: 142px; }

body.static-game-page .wrap.game-page-wrap { width: min(1180px, calc(100% - 28px)); padding-left: 0; padding-right: 0; }
.static-game-main { display: grid; gap: 14px; }
.static-page-layout { display: grid; grid-template-columns: 320px minmax(0, 1fr); gap: 14px; align-items: start; }
.static-page-layout.reverse-priority { grid-template-columns: minmax(0, 1fr) 340px; }
.static-main-stack, .static-side-stack { display: grid; gap: 14px; min-width: 0; }
.static-card { border: 1px solid var(--border); background: linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.032)), var(--panel); border-radius: 24px; box-shadow: var(--shadow); padding: 18px; min-width: 0; }
.static-card.soft { background: var(--panel2); box-shadow: none; }
.static-card h2 { font-size: 24px; margin-bottom: 10px; }
.static-card h3 { font-size: 18px; margin-bottom: 8px; }
.static-copy { display: grid; gap: 10px; }
.static-copy p, .static-copy li { color: var(--muted); font-weight: 750; line-height: 1.58; }
.static-copy ul, .static-copy ol { margin: 0; padding-left: 20px; display: grid; gap: 8px; }
.static-callout { border: 1px solid rgba(253,230,138,.30); background: rgba(245,158,11,.10); border-radius: 18px; padding: 14px; color: var(--muted); font-size: 13px; font-weight: 800; line-height: 1.5; }
.static-callout.blue { border-color: rgba(103,232,249,.30); background: rgba(103,232,249,.08); }
.static-media-grid { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(260px, .9fr); gap: 14px; align-items: stretch; }
.media-placeholder, .video-consent-box, .video-frame-shell { min-height: 240px; display: grid; place-items: center; text-align: center; border: 1px dashed rgba(103,232,249,.34); border-radius: 20px; background: radial-gradient(circle at top left, rgba(103,232,249,.12), transparent 38%), rgba(255,255,255,.04); padding: 18px; }
.media-placeholder strong { display: block; font-size: 18px; margin-bottom: 6px; }
.video-frame-shell iframe { width: 100%; min-height: 300px; aspect-ratio: 16/9; border: 0; border-radius: 16px; }
.toc-list a, .static-game-page a:not(.btn), .site-footer a { color: var(--cyan); text-decoration: none; font-weight: 900; }
.toc-list a:visited, .static-game-page a:visited:not(.btn), .site-footer a:visited { color: var(--cyan); }
.toc-list a:hover, .static-game-page a:hover:not(.btn), .site-footer a:hover { color: var(--green); text-decoration: none; }
html[data-theme="light"] .toc-list a,
html[data-theme="light"] .static-game-page a:not(.btn),
html[data-theme="light"] .site-footer a,
html[data-theme="light"] .toc-list a:visited,
html[data-theme="light"] .static-game-page a:visited:not(.btn),
html[data-theme="light"] .site-footer a:visited { color: #0f8faf; }
html[data-theme="light"] .toc-list a:hover,
html[data-theme="light"] .static-game-page a:hover:not(.btn),
html[data-theme="light"] .site-footer a:hover { color: #047857; }
.site-footer { width: 100%; margin-top: 20px; padding: 22px 14px 28px; background: rgba(15,23,42,.84); text-align: center; }
.site-footer-inner { width: min(920px, calc(100% - 20px)); margin: 0 auto; display: grid; gap: 8px; justify-items: center; text-align: center; }
.site-footer p { width: 100%; max-width: 900px; margin: 0; text-align: center; }
.site-footer-links { width: 100%; display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 6px 10px; margin: 2px auto 4px; }
.site-footer-links span { color: var(--muted); opacity: .7; }
.site-footer-support { padding-top: 4px; }
.site-footer-meta { font-size: 11px; }
html[data-theme="light"] .site-footer { background: rgba(255,255,255,.88); }

@media (max-width: 980px) {
  .static-page-layout, .static-page-layout.reverse-priority, .static-media-grid { grid-template-columns: 1fr; }
  .static-side-stack { order: -1; }
}
@media (max-width: 560px) {
  body.static-game-page .wrap.game-page-wrap { width: min(100%, calc(100% - 18px)); }
  .static-card { border-radius: 20px; padding: 14px; }
  .static-media-grid { gap: 10px; }
  .site-footer-links span { display: none; }
  .site-footer-links a { width: 100%; }
}


/* v28 merge: dark-only header actions and tighter plan cards */
html { color-scheme: dark; }
.nav-actions { align-items: center; }
.nav-actions .btn { min-width: 86px; }
.game-tier-grid { gap: 8px; margin: 8px 0 10px; }
.game-tier-card { padding: 11px; gap: 7px; border-radius: 18px; }
.game-tier-card-head { gap: 7px; }
.game-tier-card-head strong { font-size: 17px; }
.game-tier-price strong { font-size: 25px; }
.game-tier-card p { min-height: 0; font-size: 12px; line-height: 1.34; }
.game-tier-card ul { gap: 5px; }
.game-tier-card li { padding: 6px 7px; font-size: 11px; line-height: 1.28; }
.game-tier-card .btn { min-height: 32px; padding: 7px 9px; }
.selected-tier-summary, .checkout-selected-summary { padding: 12px; gap: 7px; }
.tiered-checkout-card { gap: 9px; }
.tiered-plan-hero { margin-bottom: 12px; }
@media (max-width: 1120px) {
  .game-tier-grid { gap: 8px; }
}
@media (max-width: 560px) {
  .nav-actions { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); width: 100%; }
  .nav-actions .btn { min-width: 0; padding-left: 8px; padding-right: 8px; }
}
/* v29 tier permissions and history table fixes */
.feature-lock {
  border: 1px dashed rgba(253,230,138,.42);
  border-radius: 18px;
  padding: 14px;
  background: rgba(245,158,11,.08);
  display: grid;
  gap: 8px;
  margin-top: 10px;
}
.feature-lock h3 { margin: 0; }
.feature-lock p { margin: 0; }
.feature-lock .btn { justify-self: start; margin-top: 2px; }
.permission-locked { position: relative; }
.permission-locked input,
.permission-locked select,
.permission-locked textarea,
.permission-locked .stake-step,
.permission-locked .btn:not(.amber) {
  opacity: .62;
}
.filter-builder.permission-locked {
  border: 1px dashed rgba(253,230,138,.28);
  border-radius: 16px;
  padding: 10px;
  background: rgba(245,158,11,.06);
}
.filter-lock-note { margin-top: 7px; }
.racecard-option.feature-disabled {
  opacity: .72;
  border-style: dashed;
}
.tier-note {
  border-color: rgba(253,230,138,.34);
  background: rgba(245,158,11,.08);
}
.history-title-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}
.history-title-row h4 { margin: 0; }
.history-table th[role="button"] { outline-offset: -3px; }
.history-table th[role="button"]:focus-visible {
  outline: 2px solid var(--cyan);
  outline-offset: -2px;
}
.game-tier-card.unavailable {
  opacity: .66;
  filter: saturate(.72);
}
.game-tier-card.unavailable:hover {
  transform: none;
  border-color: var(--border);
}
.game-tier-card.unavailable .btn {
  color: var(--muted);
  background: rgba(148,163,184,.12);
}
@media (max-width:560px) {
  .feature-lock .btn { width: 100%; }
}

/* v33 targeted fixes: locked bet display, aligned save actions, account recovery, readable receipt */
.slip-locked #slipList { display: grid !important; }
.slip-locked #clearSlipBtn { display: none !important; }
.active-bets-note { margin-bottom: 8px; }
.active-bets-note span { color: var(--muted); font-size: 12px; font-weight: 700; }
.active-slip-line .badge { align-self: center; }
.block-save-row { display: flex; justify-content: flex-end; gap: 8px; margin-top: 12px; }
.block-save-row .btn { min-width: 150px; }
.strategy-block-head, .notes-block-head { align-items: flex-start; }
.security-panel, .account-delete-panel { background: rgba(255,255,255,.035); }
.account-delete-panel { border-color: rgba(253,164,175,.32); }
.deletion-text-input { letter-spacing: .08em; font-weight: 950; text-transform: uppercase; }
.password-reset-card { width: min(620px, 100%); }
.password-reset-card .auth-form-v22 { margin-top: 12px; }
.btn.subtle { background: rgba(255,255,255,.035); }
.receipt-status-card { display: grid; gap: 16px; }
.payment-status-intro { display: grid; gap: 6px; }
.receipt-status-header { display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; align-items: flex-start; }
.payment-status-grid.readable-receipt { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.payment-status-row { border: 1px solid var(--border); border-radius: 16px; padding: 12px; background: rgba(255,255,255,.045); min-width: 0; }
.payment-status-row span { display: block; color: var(--muted); font-size: 10px; font-weight: 950; text-transform: uppercase; letter-spacing: .14em; margin-bottom: 7px; }
.payment-status-row strong { display: block; color: var(--text); font-size: 16px; line-height: 1.25; overflow-wrap: anywhere; }
.payment-status-row.highlight-row { grid-column: 1 / -1; background: linear-gradient(135deg, rgba(103,232,249,.13), rgba(134,239,172,.11)); border-color: rgba(103,232,249,.28); }
.payment-status-row.highlight-row strong { font-size: 24px; }
.receipt-next-actions { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.receipt-support-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 10px; }
.checkout-legal-box { border:1px solid var(--border); border-radius:18px; padding:14px; background:rgba(255,255,255,.045); }
.checkout-copy p { margin: 7px 0; }
@media (max-width: 720px) {
  .payment-status-grid.readable-receipt, .receipt-support-grid { grid-template-columns: 1fr; }
  .block-save-row .btn { width: 100%; }
}