/* Match page only (enqueued from inc/match.php on template-match.php). Shares the FCS tokens from style.css. */
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.crumbs a { color: var(--muted); }
.crumbs a:hover { color: var(--text); }
.crumbs [aria-current] { color: var(--text); font-weight: 600; }
.match-hero { text-align: left; padding: 4px 0 8px; }
.match-hero h1 { font-size: clamp(1.45rem, 3.4vw, 1.9rem); }
.match-hero .lede { margin: 14px 0 8px; }
.match-hero .lede strong { color: var(--text); }
.match-grid { margin-top: 16px; align-items: start; grid-template-columns: 1fr; }
.match-grid > div:first-child { min-width: 0; }
.match-side { grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); align-items: start; }
.match-side > .card { min-width: 0; margin: 0; }
.match-grid .mcard:hover { border-color: var(--line); }
.match-side { display: grid; gap: 14px; }
.eyebrow { color: var(--muted); font-size: .72rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; margin-bottom: 10px; }
.toss-box.is-known { border-color: color-mix(in srgb, var(--gold) 55%, transparent); background: color-mix(in srgb, var(--gold) 6%, var(--surface)); }
.toss-box.is-known .eyebrow { color: var(--gold); }
.toss-line { display: flex; align-items: center; gap: 12px; }
.toss-line > div { display: grid; gap: 2px; }
.toss-line b { font-size: 1.05rem; }
.toss-line span { color: var(--muted); font-size: .9rem; }
.toss-line strong { color: var(--text); }
.toss-line .coin { width: 40px; height: 40px; border-radius: 50%; flex: none; background: radial-gradient(circle at 35% 30%, #fde68a, var(--gold) 55%, #92400e); }
.toss-box .chips { margin-top: 12px; }
.note-line { margin: 10px 0 0; color: var(--muted); font-size: .88rem; }
.note-line.small { font-size: .78rem; }
.pick-row { display: grid; gap: 8px; }
.pick { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border-radius: 8px; background: var(--surface-2); border: 1px solid transparent; }
.pick.is-pick { border-color: color-mix(in srgb, var(--brand) 60%, transparent); background: var(--brand-soft); }
.pick div { display: grid; }
.pick b { font-size: .95rem; }
.pick span { color: var(--muted); font-size: .82rem; }
.pick.is-pick span { color: var(--brand-text); font-weight: 600; }
.reasons { list-style: none; margin: 12px 0 0; padding: 0; display: grid; gap: 7px; color: var(--muted); font-size: .88rem; }
.reasons li { position: relative; padding-left: 16px; }
.reasons li::before { content: ""; position: absolute; left: 0; top: .55em; width: 7px; height: 7px; border-radius: 50%; background: var(--accent); }
.reasons b { color: var(--text); }
.trend-line { color: var(--muted); font-size: .88rem; margin: 12px 0 0; }
.trend-line .chips { display: inline-flex; margin: 0; vertical-align: middle; }
.hubs a small { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }