:root {
  --ink: #081426;
  --ink-2: #12233a;
  --muted: #66758a;
  --muted-2: #8b98a9;
  --line: #dfe5ec;
  --line-strong: #cbd5e1;
  --panel: #ffffff;
  --panel-alt: #f7f9fc;
  --surface: #eef3f8;
  --navy: #0d2747;
  --blue: #0f61c3;
  --blue-soft: #eaf2ff;
  --red: #d9271c;
  --red-deep: #b9180f;
  --red-soft: #fff0ee;
  --orange: #f4691d;
  --green: #18864b;
  --gold: #af8328;
  --gold-soft: #fff7e4;
  --shadow-sm: 0 2px 8px rgba(15, 30, 50, .06);
  --shadow-md: 0 10px 26px rgba(15, 30, 50, .09);
  --radius: 14px;
  --radius-sm: 9px;
  --max: 1200px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--ink);
  background: #fbfcfe;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans JP", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
  font-size: 15px;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
}
button, input, select { font: inherit; }
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; }

.site-shell { min-height: 100vh; }
.container { width: min(var(--max), calc(100% - 40px)); margin: 0 auto; }

/* Header */
.site-header {
  position: sticky;
  top: 0;
  z-index: 40;
  background: rgba(255,255,255,.96);
  backdrop-filter: blur(16px);
  border-bottom: 1px solid var(--line);
}
.header-inner { height: 72px; display: flex; align-items: center; gap: 30px; }
.brand { display: flex; align-items: baseline; gap: 10px; white-space: nowrap; }
.brand-word { font-weight: 900; letter-spacing: -.035em; font-size: 27px; font-style: italic; }
.brand-sub { color: var(--muted); font-size: 10px; letter-spacing: .12em; font-weight: 700; }
.main-nav { display: flex; gap: 26px; margin-left: auto; font-weight: 700; font-size: 14px; }
.main-nav a { color: #1c2a3d; padding: 25px 0 22px; border-bottom: 3px solid transparent; }
.main-nav a:hover, .main-nav a.active { color: var(--blue); border-bottom-color: var(--blue); }
.header-actions { display: flex; gap: 12px; align-items: center; }
.header-link { display:flex; align-items:center; gap:7px; font-weight:700; color:#25344a; }
.menu-btn { display:none; border:0; background:transparent; width:42px; height:42px; border-radius:10px; cursor:pointer; }
.menu-btn span, .menu-btn:before, .menu-btn:after { content:""; display:block; height:2px; background:#193150; margin:6px 8px; }

/* Status */
.top-status { background:#fff; border-bottom:1px solid var(--line); }
.status-inner { display:grid; grid-template-columns:1.35fr repeat(4,1fr); align-items:stretch; }
.date-block { display:flex; align-items:center; gap:14px; padding-right:28px; }
.date-icon { width:34px; height:34px; border:2px solid var(--navy); border-radius:8px; position:relative; }
.date-icon:before { content:""; position:absolute; left:5px; right:5px; top:9px; border-top:2px solid var(--navy); }
.date-icon:after { content:""; position:absolute; width:4px; height:4px; border-radius:50%; background:var(--navy); left:8px; top:17px; box-shadow: 7px 0 var(--navy), 14px 0 var(--navy), 0 7px var(--navy), 7px 7px var(--navy), 14px 7px var(--navy); }
.date-text { font-size:30px; font-weight:800; letter-spacing:-.03em; }
.snapshot-updated { margin-top:3px; color:var(--muted); font-size:11px; font-weight:700; }
.stat-box { border-left:1px solid var(--line); display:flex; flex-direction:column; justify-content:center; align-items:center; gap:4px; text-align:center; }
.stat-label { color:#314055; font-weight:700; font-size:13px; }
.stat-value { font-size:28px; font-weight:850; letter-spacing:-.04em; }
.stat-value.red { color:var(--red); }
.stat-value.blue { color:var(--blue); }
.accuracy-group { grid-column:1/-1; display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); border-top:1px solid var(--line); min-height:82px; }
.accuracy-stat { display:flex; flex-direction:column; justify-content:center; align-items:center; gap:4px; padding:12px 8px; text-align:center; border-left:1px solid var(--line); }
.accuracy-stat:first-child { border-left:0; }
.accuracy-stat span { color:#314055; font-weight:700; font-size:11px; white-space:nowrap; }
.accuracy-stat strong { color:var(--blue); font-size:24px; font-weight:850; letter-spacing:-.04em; }
.accuracy-stat-hot strong { color:var(--red); }
.accuracy-stat-upset strong { color:#b56b00; }

/* Sections */
.main-content { background:#fbfcfe; }
.section { padding:28px 0; border-bottom:1px solid #edf1f5; }
.section-head { display:flex; justify-content:space-between; align-items:end; gap:20px; margin-bottom:16px; }
.section-title { font-size:22px; font-weight:850; letter-spacing:-.025em; display:flex; align-items:center; gap:8px; }
.section-title .fire { color:var(--orange); }
.section-link { color:var(--blue); font-weight:750; font-size:13px; }
.section-note { color:var(--muted); font-size:12px; }

/* Upcoming */
.upcoming-row { display:grid; grid-template-columns:repeat(3, 1fr); gap:14px; }
.upcoming-card {
  background:#fff;
  border:1px solid var(--line);
  border-radius:var(--radius-sm);
  padding:16px;
  min-width:0;
  box-shadow: var(--shadow-sm);
}
.upcoming-top { display:flex; justify-content:space-between; gap:12px; border-bottom:1px solid #e7edf3; padding-bottom:12px; }
.race-name { font-size:18px; font-weight:850; }
.race-name small { font-size:12px; color:var(--muted); margin-left:4px; }
.countdown { margin-top:7px; color:var(--blue); font-weight:800; }
.countdown strong { font-size:24px; letter-spacing:-.03em; }
.countdown.hot { color:var(--red); }
.conf-mini { min-width:76px; border-left:1px solid var(--line); padding-left:14px; text-align:center; }
.conf-mini span { display:block; color:var(--muted); font-size:10px; font-weight:700; }
.conf-mini strong { font-size:28px; line-height:1.2; }
.upcoming-bottom { display:flex; align-items:center; justify-content:space-between; margin-top:12px; gap:14px; }
.top-pick { display:flex; align-items:center; gap:8px; min-width:0; }
.top-pick-label { color:var(--muted); font-size:11px; font-weight:750; }
.prob { font-size:20px; font-weight:850; color:var(--blue); white-space:nowrap; }
.prob.hot { color:var(--red); }

/* Badges */
.badge { display:inline-flex; align-items:center; gap:4px; border-radius:999px; padding:4px 9px; font-size:11px; font-weight:800; white-space:nowrap; }
.badge-hot { color:#fff; background:var(--red); }
.badge-normal { color:#415066; background:#edf1f5; }
.badge-ai { color:#715513; background:#f4d890; }
.badge-hit { color:#fff; background:var(--green); }
.badge-miss { color:#526175; background:#edf1f5; }

/* Featured */
.featured-grid { display:grid; grid-template-columns:repeat(4, 1fr); gap:14px; }
.featured-card { position:relative; display:flex; flex-direction:column; background:#fff; border:1px solid var(--line); border-radius:var(--radius-sm); overflow:hidden; box-shadow:var(--shadow-sm); }
.result-stamp { position:absolute; z-index:5; width:clamp(76px,24%,118px); height:auto; opacity:.95; pointer-events:none; object-fit:contain; filter:drop-shadow(0 2px 3px rgba(11,31,57,.18)); }
.result-stamp--layout-a { top:10px; right:10px; transform:rotate(5deg); }
.result-stamp--layout-b { top:38px; left:10px; transform:rotate(-6deg); }
.result-stamp--layout-c { right:12px; bottom:64px; transform:rotate(4deg); }
.result-stamp--layout-d { top:7px; right:8px; width:clamp(58px,18%,78px); transform:rotate(1deg); }
.result-stamp--out { opacity:.9; }
.upset-outcome-stamp { top:7px; right:8px; width:clamp(58px,18%,78px); transform:rotate(1deg); }
.upset-outcome-stamp--normal { opacity:.92; }
.upset-conditional-slot { display:flex; align-items:flex-start; justify-content:center; min-height:36px; }
.upset-conditional-result { width:max-content; max-width:100%; margin:0; padding:5px 10px; border-radius:999px; background:#edf1f5; color:#415066; font-size:11px; font-weight:850; }
.upset-conditional-result--upset-hit { background:#e9f8ef; color:#176b3a; }
.upset-conditional-result--upset-out { background:#fff0f0; color:#9e2f27; }
.stamp-preview-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; }
.stamp-state-grid { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:14px; }
.stamp-preview-item h3 { margin:0 0 9px; color:#314055; font-size:14px; }
.featured-media { position:relative; height:82px; background:#dfe7ef; overflow:hidden; }
.featured-media img { width:100%; height:100%; object-fit:cover; }
.featured-media:after { content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(8,20,38,.05), rgba(8,20,38,.48)); }
.featured-labels { position:absolute; z-index:2; left:11px; top:9px; display:flex; flex-wrap:wrap; gap:4px; max-width:calc(100% - 82px); }
.featured-labels .badge { margin:0; padding:4px 7px; font-size:10px; }
.featured-race { position:absolute; z-index:2; left:12px; bottom:10px; color:white; font-weight:850; font-size:17px; text-shadow:0 1px 4px rgba(0,0,0,.35); }
.featured-badge { position:absolute; z-index:2; right:12px; top:12px; }
.featured-confidence { position:absolute; z-index:2; left:50%; transform:translateX(-50%); bottom:4px; text-align:center; color:white; }
.featured-confidence span { display:block; font-size:10px; font-weight:800; text-shadow:0 1px 4px rgba(0,0,0,.45); }
.featured-confidence strong { display:block; font-size:38px; line-height:1; color:#fff; -webkit-text-stroke:1px rgba(120,0,0,.35); text-shadow:0 2px 4px rgba(0,0,0,.28); }
.featured-body { display:flex; flex:1; flex-direction:column; padding:13px 14px 14px; text-align:center; }
.featured-body .badge-ai { margin-bottom:10px; }
.featured-combo { justify-content:flex-end; margin:0; }
.featured-odds { color:#36455a; font-size:12px; font-weight:650; }
.featured-odds strong { font-size:16px; color:var(--ink); }
.featured-data-row { display:flex; align-items:center; justify-content:space-between; gap:10px; min-height:32px; border-bottom:1px solid #edf1f5; color:#526175; font-size:12px; font-weight:700; text-align:left; }
.featured-data-row strong { color:var(--ink); font-size:15px; }
.featured-data-row--upset strong { color:#bd6900; }
.conditional-note { display:block; margin-top:7px; color:#6e7d8f; font-size:9px; line-height:1.4; text-align:left; }
.featured-result-details { display:grid; grid-template-columns:1fr 1fr; gap:5px 10px; margin-top:8px; padding:8px 0; border-top:1px solid #edf1f5; font-size:10px; text-align:left; }
.featured-result-details > div { display:flex; align-items:center; justify-content:space-between; gap:5px; }
.featured-result-details > div:first-child { grid-column:1/-1; }
.featured-result-details span { color:#66758a; font-weight:700; }
.featured-result-details strong { color:#17283d; font-size:12px; }
.featured-result-details strong.is-out { color:#6d7888; }
.featured-body .btn-outline { flex:0 0 38px; margin-top:auto; }
.btn-outline { display:flex; align-items:center; justify-content:center; height:38px; margin-top:11px; border:1.5px solid #ef665d; color:var(--red); font-weight:850; border-radius:7px; transition:.2s; }
.btn-outline:hover { background:var(--red-soft); }

/* Venue cards */
.venue-grid { display:grid; grid-template-columns:repeat(4, 1fr); gap:14px; }
.venue-card { background:#fff; border:1px solid var(--line); border-radius:var(--radius-sm); overflow:hidden; box-shadow:var(--shadow-sm); transition:.2s; }
.venue-card:hover { transform:translateY(-2px); box-shadow:var(--shadow-md); }
.venue-head { display:flex; justify-content:space-between; align-items:center; padding:12px 14px; }
.venue-title { font-size:18px; font-weight:850; }
.venue-head small { color:#344257; font-weight:700; }
.venue-photo { height:74px; background:#dfe7ef; }
.venue-photo img { width:100%; height:100%; object-fit:cover; }
.venue-meta { display:flex; justify-content:space-between; padding:12px 14px; font-weight:750; }
.venue-meta .blue { color:var(--blue); }
.venue-meta .hot { color:var(--red); }
.venue-focus { display:flex; align-items:center; gap:9px; }
.venue-meta .upset { color:#d88400; }

/* Grid data area */
.data-grid { display:grid; grid-template-columns:1.35fr .86fr; gap:24px; align-items:start; }
.panel { background:#fff; border:1px solid var(--line); border-radius:var(--radius-sm); overflow:hidden; box-shadow:var(--shadow-sm); }
.table-wrap { overflow:auto; }
.race-table { width:100%; border-collapse:collapse; min-width:680px; }
.race-table th { background:#f7f9fc; color:#314056; font-size:12px; text-align:left; padding:12px 13px; border-bottom:1px solid var(--line-strong); white-space:nowrap; }
.race-table td { padding:12px 13px; border-bottom:1px solid #e7edf3; font-size:13px; vertical-align:middle; }
.race-table tr:last-child td { border-bottom:0; }
.race-table tr:hover td { background:#fbfdff; }
.race-table .venue-r { font-weight:800; }
.decision { font-weight:800; color:#4d5b6d; }
.decision.hot { color:var(--red); }
.result-dash { color:var(--muted-2); }

/* boat chips */
.combo { display:inline-flex; gap:3px; align-items:center; }
.boat { width:24px; height:24px; border-radius:4px; display:inline-flex; align-items:center; justify-content:center; font-weight:850; font-size:13px; border:1px solid rgba(0,0,0,.14); line-height:1; }
.boat-1 { background:#fff; color:#1b1b1b; }
.boat-2 { background:#232426; color:#fff; }
.boat-3 { background:#d9251b; color:#fff; }
.boat-4 { background:#1666c5; color:#fff; }
.boat-5 { background:#f5d900; color:#111; }
.boat-6 { background:#188d3f; color:#fff; }
.boat-sm { width:19px; height:19px; font-size:10px; border-radius:3px; }

/* Results */
.result-panel-head { display:grid; grid-template-columns:repeat(3, 1fr); border-bottom:1px solid var(--line); }
.result-stat { padding:16px 10px; text-align:center; border-right:1px solid var(--line); }
.result-stat:last-child { border-right:0; }
.result-stat span { display:block; color:#344358; font-size:11px; font-weight:750; }
.result-stat strong { display:block; margin-top:4px; font-size:28px; letter-spacing:-.04em; }
.result-stat strong.red { color:var(--red); }
.result-stat strong.blue { color:var(--blue); }
.panel-subhead { display:flex; justify-content:space-between; align-items:center; padding:12px 14px; font-size:13px; font-weight:850; border-bottom:1px solid #edf1f5; }
.result-list { list-style:none; margin:0; padding:0; }
.result-list li { display:grid; grid-template-columns:56px 95px 1fr auto; gap:8px; align-items:center; padding:11px 14px; border-bottom:1px solid #edf1f5; font-size:12px; }
.result-list li:last-child { border-bottom:0; }
.result-list .hit-text { font-weight:750; }

/* Performance */
.bottom-grid { display:grid; grid-template-columns:1.05fr 1fr; gap:24px; }
.segmented { display:inline-flex; border:1px solid var(--line); border-radius:8px; overflow:hidden; background:#fff; }
.segmented button { min-width:58px; border:0; background:#fff; padding:7px 12px; cursor:pointer; font-size:12px; font-weight:750; color:#526175; }
.segmented button.active { background:var(--navy); color:#fff; }
.performance-panel { padding:18px; }
.metric-grid { display:grid; grid-template-columns:repeat(4,1fr); }
.metric { padding:12px 16px; border-right:1px solid var(--line); text-align:center; }
.metric:last-child { border-right:0; }
.metric span { display:block; font-size:12px; font-weight:750; min-height:38px; color:#344257; }
.metric strong { display:block; margin-top:7px; font-size:29px; letter-spacing:-.04em; }
.metric small { color:var(--muted); font-size:10px; }

/* Timeline */
.timeline { position:relative; padding:6px 18px 10px 35px; }
.timeline:before { content:""; position:absolute; left:18px; top:13px; bottom:17px; width:1px; background:#9eabc0; }
.timeline-item { position:relative; display:grid; grid-template-columns:52px 100px 64px 1fr auto; align-items:center; gap:6px; min-height:40px; font-size:12px; }
.timeline-item:before { content:""; position:absolute; left:-21px; width:8px; height:8px; border-radius:50%; background:var(--navy); box-shadow:0 0 0 3px #fff; }
.timeline-item .hit { color:var(--green); font-weight:850; }
.timeline-item .miss { color:#4b576a; font-weight:750; }

/* About */
.about-strip { display:grid; grid-template-columns:1.4fr repeat(3,1fr); border:1px solid var(--line); border-radius:var(--radius-sm); background:#fff; overflow:hidden; }
.about-copy, .about-point { padding:18px; }
.about-copy { border-right:1px solid var(--line); }
.about-copy h3 { margin:0 0 7px; font-size:18px; }
.about-copy p { margin:0; color:#465469; font-size:12px; line-height:1.8; }
.about-point { display:flex; gap:11px; align-items:flex-start; }
.about-icon { flex:0 0 38px; height:38px; border:1.5px solid #56708f; border-radius:8px; display:flex; align-items:center; justify-content:center; color:#29496e; font-weight:900; font-size:16px; }
.about-point strong { display:block; font-size:12px; margin-bottom:4px; }
.about-point span { color:#66758a; font-size:10px; line-height:1.6; }

/* Footer */
.site-footer { background:#0b1728; color:#dfe7f2; margin-top:30px; }
.footer-inner { display:flex; justify-content:space-between; gap:30px; padding:28px 0; align-items:flex-start; }
.footer-brand .brand-word { color:#fff; }
.footer-brand p { max-width:520px; color:#8fa0b6; font-size:11px; }
.footer-links { display:flex; gap:20px; color:#b9c4d2; font-size:12px; }
.footer-copy { border-top:1px solid rgba(255,255,255,.08); padding:12px 0 18px; color:#74859b; font-size:10px; }

/* Page common */
.page-head { padding:22px 0 14px; }
.breadcrumb { color:var(--muted); font-size:11px; margin-bottom:10px; }
.page-title { font-size:30px; margin:0; letter-spacing:-.04em; }
.page-lead { color:var(--muted); font-size:13px; margin-top:6px; }

/* Today discovery */
.today-summary { display:grid; grid-template-columns:repeat(7,1fr); margin-top:18px; background:#fff; border:1px solid var(--line); border-radius:10px; overflow:hidden; }
.today-summary > div { padding:12px 10px; text-align:center; border-right:1px solid var(--line); }
.today-summary > div:last-child { border-right:0; }
.today-summary span { display:block; min-height:28px; color:#526175; font-size:10px; font-weight:750; }
.today-summary strong { display:block; font-size:18px; }
.today-mode-switch { display:inline-flex; gap:3px; margin-top:14px; padding:3px; border:1px solid var(--line); border-radius:9px; background:#f2f6fa; }
.today-mode-switch button { min-width:82px; padding:8px 14px; border:0; border-radius:6px; background:transparent; color:#526175; font-weight:850; cursor:pointer; }
.today-mode-switch button.active { background:var(--navy); color:#fff; box-shadow:0 2px 7px rgba(6,38,75,.16); }
.waiting-result-note { margin:-4px 0 12px; color:#66758a; font-size:12px; font-weight:750; }
.today-results-section { padding-top:4px; }
#venues { scroll-margin-top:18px; }
.today-focus-section { margin-bottom:28px; }
.today-focus-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; }
.today-focus-card { display:flex; flex-direction:column; min-height:238px; overflow:hidden; background:#fff; border:1px solid var(--line); border-radius:10px; box-shadow:var(--shadow-sm); }
.today-focus-head { display:flex; justify-content:space-between; gap:10px; padding:12px 13px; background:#f5f8fc; border-bottom:1px solid var(--line); }
.today-focus-card--hot .today-focus-head { background:#fff4f2; }
.today-focus-card--upset .today-focus-head { background:#fff8e9; }
.today-focus-card--target { border-color:#a7dec3; }
.today-focus-card--target .today-focus-head { background:#f0fbf6; }
.today-focus-card--target .today-focus-head b { color:#087443; }
.today-focus-card--big-payout { border-color:#e1c9aa; }
.today-focus-card--big-payout .today-focus-head { background:#fff2df; }
.today-focus-card--big-payout .today-focus-head b { color:#7b3f00; }
.today-focus-head b,.today-focus-head strong { display:block; }
.today-focus-head b { margin-bottom:4px; font-size:11px; }
.today-focus-head strong { font-size:16px; }
.today-focus-head > span { color:#637287; font-size:10px; text-align:right; }
.today-focus-primary { display:grid; grid-template-columns:1fr auto; align-items:center; gap:7px 10px; padding:12px 13px; border-bottom:1px solid #edf1f5; font-size:12px; }
.today-focus-primary > span,.today-focus-primary > small { color:#526175; font-weight:750; }
.today-focus-primary > strong { color:#0f61c3; font-size:17px; text-align:right; }
.today-focus-primary .combo { justify-content:flex-end; }
.today-market { display:flex; align-items:center; gap:7px; min-height:40px; padding:8px 13px; color:#526175; font-size:11px; }
.today-market strong { margin-left:auto; color:#17283d; font-size:14px; }
.today-market small { color:#748398; }
.today-market.result { flex-wrap:wrap; }
.today-market.result .prediction-rank { margin-left:auto; color:#0f61c3; }
.today-market.result .prediction-rank.is-out { color:#6d7888; }
.today-market.result small { width:100%; }
.today-focus-foot { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:auto; padding:10px 13px; border-top:1px solid #edf1f5; font-size:11px; }
.today-focus-foot a { color:var(--blue); font-weight:850; }
.big-payout-reference { display:grid; grid-template-columns:auto 1fr; gap:5px 12px; margin-top:12px; padding-top:10px; border-top:1px solid #eadcc9; color:#6d4a24; }
.big-payout-reference span { font-size:11px; font-weight:800; }
.big-payout-reference b { text-align:right; font-size:13px; }
.big-payout-reference small { grid-column:1/-1; color:#7d6a55; font-size:10px; line-height:1.5; }
.big-payout-reference--compact { margin:0; padding:8px 13px; border-top:0; border-bottom:1px solid #f0e5d7; background:#fffaf3; }
.big-payout-outcome { margin-left:auto!important; color:#7b3f00!important; }
.big-payout-outcome.is-established { color:#c53b19!important; }
.big-payout-detail-outcome { margin:12px 0 2px; padding:9px 12px; border-radius:8px; background:#f3f5f7; color:#536272; font-weight:850; text-align:center; }
.big-payout-detail-outcome.is-established { background:#fff0e7; color:#bd3518; }
.today-all-section { margin-top:8px; }
.today-controls { display:flex; align-items:flex-end; justify-content:space-between; gap:14px; margin-bottom:12px; }
.today-controls .filters { margin:0; }
.today-sort { display:flex; align-items:center; gap:7px; color:#526175; font-size:11px; font-weight:750; white-space:nowrap; }
.today-sort select { min-width:148px; padding:8px 28px 8px 9px; border:1px solid var(--line-strong); border-radius:7px; background:#fff; color:#17283d; }
.today-race-table .today-market { padding:0; min-height:0; }
.today-race-table .today-market.result { display:block; }
.today-race-table .today-market.result strong { display:block; margin:2px 0 0; }

/* Race detail */
.race-nav { display:grid; grid-template-columns:repeat(12,1fr); border:1px solid var(--line); border-radius:10px; overflow:hidden; background:#fff; margin:16px 0 20px; }
.race-nav a { padding:10px 4px; text-align:center; font-size:12px; font-weight:800; border-right:1px solid var(--line); }
.race-nav a:last-child { border-right:0; }
.race-nav a.active { background:var(--navy); color:#fff; }
.race-hero { display:grid; grid-template-columns:1.25fr .75fr; gap:20px; margin-bottom:22px; }
.race-main-card, .race-side-card { background:#fff; border:1px solid var(--line); border-radius:12px; box-shadow:var(--shadow-sm); }
.race-main-card { padding:22px; }
.race-header-line { display:flex; justify-content:space-between; gap:20px; align-items:flex-start; padding-bottom:18px; border-bottom:1px solid var(--line); }
.race-identity h1 { margin:0; font-size:30px; }
.race-identity p { margin:4px 0 0; color:var(--muted); }
.race-deadline { text-align:right; }
.race-deadline span { display:block; color:var(--muted); font-size:11px; }
.race-deadline strong { display:block; font-size:27px; }
.race-selected { display:grid; grid-template-columns:140px 1fr; gap:18px; padding:18px 0; border-bottom:1px solid var(--line); }
.conf-big { text-align:center; border-right:1px solid var(--line); }
.conf-big span { display:block; color:var(--muted); font-size:11px; font-weight:750; }
.conf-big strong { display:block; font-size:58px; line-height:1; color:var(--red); letter-spacing:-.06em; }
.selection-copy h3 { margin:3px 0 6px; font-size:20px; }
.selection-copy p { margin:0; color:#526175; font-size:12px; }
.selection-bar { margin-top:12px; height:8px; border-radius:999px; background:#edf1f5; overflow:hidden; }
.selection-bar > i { display:block; width:79%; height:100%; background:var(--red); }
.selection-meta { display:flex; gap:16px; margin-top:7px; color:var(--muted); font-size:10px; }
.prediction-block { padding-top:18px; }
.prediction-head { display:flex; justify-content:space-between; gap:14px; align-items:center; margin-bottom:11px; }
.prediction-head h3 { margin:0; font-size:19px; }
.rank-list { list-style:none; margin:0; padding:0; }
.rank-list li { display:grid; grid-template-columns:34px 1fr 80px 90px; align-items:center; gap:10px; padding:11px 0; border-bottom:1px solid #edf1f5; }
.rank-list li:last-child { border-bottom:0; }
.rank-no { font-weight:900; color:#546175; }
.rank-list li:first-child .rank-no { color:var(--red); font-size:18px; }
.rank-prob { text-align:right; font-weight:850; color:#0f61c3; }
.rank-list li:first-child .rank-prob { color:var(--red); }
.rank-bar { height:6px; background:#edf1f5; border-radius:999px; overflow:hidden; }
.rank-bar i { display:block; height:100%; background:#2f6faa; }
.rank-list li:first-child .rank-bar i { background:var(--red); }
.race-side-card { overflow:hidden; }
.side-status { padding:18px; border-bottom:1px solid var(--line); }
.side-status h3 { margin:0 0 12px; font-size:15px; }
.status-large { background:#f7f9fc; padding:15px; border-radius:9px; }
.status-large span { display:block; color:var(--muted); font-size:11px; }
.status-large strong { display:block; font-size:28px; margin-top:2px; }
.side-list { list-style:none; margin:0; padding:0; }
.side-list li { display:flex; justify-content:space-between; gap:14px; padding:12px 18px; border-bottom:1px solid #edf1f5; font-size:12px; }
.side-list li:last-child { border-bottom:0; }
.side-list span { color:var(--muted); }
.side-list strong { text-align:right; }
.result-box { margin-top:18px; padding:16px; background:#f2fbf6; border:1px solid #cfeada; border-radius:10px; }
.result-box h3 { margin:0 0 7px; color:#176b40; }
.result-box p { margin:0; font-size:12px; }

/* venue */
.venue-hero { display:grid; grid-template-columns:1fr 1fr; gap:20px; align-items:stretch; margin-bottom:20px; }
.venue-visual { min-height:180px; border-radius:12px; overflow:hidden; border:1px solid var(--line); }
.venue-visual img { width:100%; height:100%; object-fit:cover; }
.venue-summary { background:#fff; border:1px solid var(--line); border-radius:12px; padding:20px; }
.venue-summary h1 { margin:0 0 6px; font-size:30px; }
.venue-summary p { margin:0; color:var(--muted); }
.venue-scoreline { display:grid; grid-template-columns:repeat(3,1fr); margin-top:22px; border-top:1px solid var(--line); }
.venue-scoreline > div { text-align:center; padding:16px 8px 0; border-right:1px solid var(--line); }
.venue-scoreline > div:last-child { border-right:0; }
.venue-scoreline span { display:block; color:var(--muted); font-size:11px; }
.venue-scoreline strong { font-size:24px; }
.race-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; }
.race-mini { background:#fff; border:1px solid var(--line); border-radius:10px; padding:14px; }
.race-mini-top { display:flex; justify-content:space-between; gap:10px; align-items:center; }
.race-mini h3 { margin:0; font-size:18px; }
.race-mini .time { color:var(--muted); font-size:11px; }
.race-mini .mini-pick { display:flex; align-items:center; justify-content:space-between; margin-top:13px; padding-top:12px; border-top:1px solid var(--line); }
.race-mini .mini-pick span { color:var(--muted); font-size:10px; }
.race-mini .mini-pick strong { font-size:13px; }

/* archive / results */
.filters { display:flex; flex-wrap:wrap; gap:10px; margin:12px 0 18px; }
.filter-btn { border:1px solid var(--line); background:#fff; border-radius:8px; padding:8px 12px; font-weight:750; font-size:12px; cursor:pointer; }
.filter-btn.active { background:var(--navy); color:#fff; border-color:var(--navy); }
.archive-day { margin-bottom:20px; }
.archive-day h2 { font-size:18px; margin:0 0 10px; }

/* responsive */
@media (max-width: 980px) {
  .main-nav { display:none; }
  .menu-btn { display:block; }
  .brand-sub { display:none; }
  .status-inner { grid-template-columns:1.3fr repeat(4,1fr); }
  .date-block { grid-row:auto; }
  .accuracy-group { grid-column:1/-1; border-left:0; border-top:1px solid var(--line); min-height:82px; }
  .featured-grid, .venue-grid { grid-template-columns:repeat(2,1fr); }
  .stamp-preview-grid, .stamp-state-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .data-grid, .bottom-grid, .race-hero { grid-template-columns:1fr; }
  .about-strip { grid-template-columns:1fr 1fr; }
  .about-copy { grid-column:1/-1; border-right:0; border-bottom:1px solid var(--line); }
  .race-grid { grid-template-columns:repeat(3,1fr); }
  .today-summary { grid-template-columns:repeat(3,1fr); }
  .today-summary > div:nth-child(3) { border-right:0; }
  .today-summary > div:nth-child(-n+3) { border-bottom:1px solid var(--line); }
  .today-focus-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .today-controls { align-items:stretch; flex-direction:column; }
  .today-sort { align-self:flex-end; }
}

@media (max-width: 680px) {
  .container { width:min(100% - 24px, var(--max)); }
  .header-inner { height:60px; }
  .brand-word { font-size:23px; }
  .header-link { display:none; }
  .status-inner { grid-template-columns:1fr 1fr; }
  .date-block { grid-column:1/-1; grid-row:auto; min-height:78px; padding:0; }
  .date-text { font-size:25px; }
  .stat-box { min-height:78px; border-top:1px solid var(--line); }
  .stat-box:nth-child(2), .stat-box:nth-child(4) { border-left:0; }
  .stat-value { font-size:24px; }
  .accuracy-group { grid-column:1/-1; grid-template-columns:repeat(2,minmax(0,1fr)); min-height:78px; }
  .accuracy-stat { border-top:1px solid var(--line); }
  .accuracy-stat:nth-child(odd) { border-left:0; }
  .accuracy-stat:nth-child(-n+2) { border-top:0; }
  .accuracy-stat:last-child { grid-column:1/-1; }
  .accuracy-stat span { font-size:10px; white-space:normal; }
  .accuracy-stat strong { font-size:22px; }
  .section { padding:22px 0; }
  .section-title { flex-shrink:0; font-size:19px; white-space:nowrap; }
  .upcoming-row { grid-template-columns:1fr; }
  .featured-grid, .venue-grid { grid-template-columns:1fr 1fr; }
  .stamp-preview-grid, .stamp-state-grid { grid-template-columns:1fr; }
  .result-stamp { width:clamp(82px,28%,110px); }
  .result-stamp--layout-d { width:clamp(56px,21%,72px); }
  .upset-outcome-stamp { width:clamp(56px,21%,72px); }
  .featured-media { height:76px; }
  .featured-body { padding:11px; }
  .race-table { min-width:640px; }
  .metric-grid { grid-template-columns:1fr 1fr; }
  .metric:nth-child(2) { border-right:0; }
  .metric:nth-child(-n+2) { border-bottom:1px solid var(--line); }
  .timeline-item { grid-template-columns:46px 78px 55px 1fr; }
  .timeline-item > .combo { display:none; }
  .about-strip { grid-template-columns:1fr; }
  .about-point { border-bottom:1px solid var(--line); }
  .footer-inner { flex-direction:column; }
  .footer-links { flex-wrap:wrap; }
  .race-nav { grid-template-columns:repeat(6,1fr); }
  .race-nav a { border-bottom:1px solid var(--line); }
  .race-selected { grid-template-columns:100px 1fr; }
  .conf-big strong { font-size:48px; }
  .rank-list li { grid-template-columns:28px 1fr 65px; }
  .rank-list .rank-bar { display:none; }
  .venue-hero { grid-template-columns:1fr; }
  .race-grid { grid-template-columns:1fr 1fr; }
  .today-summary { grid-template-columns:repeat(2,1fr); }
  .today-summary > div { border-bottom:1px solid var(--line); }
  .today-summary > div:nth-child(2n) { border-right:0; }
  .today-summary > div:nth-last-child(-n+2) { border-bottom:0; }
  .today-focus-grid { grid-template-columns:1fr; }
  .today-focus-card { min-height:220px; }
  .today-mode-switch { display:grid; grid-template-columns:repeat(3,1fr); width:100%; box-sizing:border-box; }
  .today-mode-switch button { min-width:0; padding:9px 7px; }
  .today-sort { align-self:stretch; justify-content:space-between; }
  .today-sort select { flex:1; }
}

@media (max-width: 460px) {
  .featured-grid, .venue-grid, .race-grid { grid-template-columns:1fr; }
  .result-panel-head { grid-template-columns:1fr 1fr; }
  .result-stat:nth-child(3) { grid-column:1/-1; border-top:1px solid var(--line); }
  .result-stat:nth-child(2) { border-right:0; }
  .rank-list li { grid-template-columns:28px 1fr 55px; gap:6px; }
}