/* /live — additions to the week-page stylesheet, in the main site's palette:
   #111 ink, #888 secondary, #eee rules, green #2e7d32 on #e8f5e9 for results,
   live orange #c2410c on #fff3ee (the homepage's live links). */

.live-nav { display: flex; gap: 6px; justify-content: center; flex-wrap: wrap; padding: 2px 0 14px; margin-bottom: 8px; border-bottom: 1px solid #eee; }
.live-nav a { font-size: 0.7rem; font-weight: 700; color: #c2410c; background: #fff3ee; border: 1px solid #f3d4c4; border-radius: 12px; padding: 5px 12px; text-decoration: none; letter-spacing: 0.2px; }
.live-nav a:hover { background: #ffe6da; }
.live-nav a.active { background: #c2410c; border-color: #c2410c; color: #fff; }

.live-status { text-align: center; color: #555; font-size: 0.75rem; padding: 6px 0 14px; font-variant-numeric: tabular-nums; }
.live-status strong { color: #111; }
.muted { color: #888; }
.live-dot { display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: #c2410c; margin-right: 5px; vertical-align: 1px; animation: live-pulse 1.6s ease-in-out infinite; }
@keyframes live-pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.35; } }

.sec-title { font-size: 0.95rem; font-weight: 700; letter-spacing: 0.3px; text-align: center; margin: 4px 0 10px; }
.sub-title { font-size: 0.7rem; font-weight: 700; color: #888; text-transform: uppercase; letter-spacing: 0.5px; margin: 14px 0 6px; }
.note, .more { text-align: center; font-size: 0.65rem; color: #888; margin-top: 8px; }
.more a, .back a { color: #555; }

/* ---------- board cards ---------- */
.bcard { border: 1px solid #f3d4c4; background: #fffaf7; border-radius: 8px; margin-bottom: 10px; }
.bcard summary { list-style: none; cursor: pointer; padding: 10px 12px 8px; }
.bcard summary::-webkit-details-marker { display: none; }
.bcard summary:focus-visible { outline: 2px solid #c2410c; outline-offset: 2px; border-radius: 8px; }
.bc-top { display: flex; justify-content: space-between; align-items: center; font-size: 0.6rem; font-weight: 700; color: #888; text-transform: uppercase; letter-spacing: 0.5px; margin-bottom: 6px; }
.bc-head, .bc-pl { display: grid; grid-template-columns: 1fr 34px 40px 44px; align-items: center; gap: 6px; }
.bc-head { font-size: 0.55rem; color: #999; text-transform: uppercase; letter-spacing: 0.5px; font-weight: 600; padding-bottom: 2px; }
.bc-head span:not(:first-child) { text-align: right; }
.bc-pl { padding: 5px 0; border-top: 1px solid #f6e6dd; }
.bc-pl .nm { font-size: 0.82rem; font-weight: 600; color: #222; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bc-pl .nm a { color: inherit; text-decoration: none; }
.bc-pl .pips { justify-self: end; }
.bc-pl .mpr { text-align: right; font-size: 0.75rem; color: #555; font-variant-numeric: tabular-nums; }
.bc-pl .pts { position: relative; text-align: right; font-size: 1.15rem; font-weight: 700; color: #888; font-variant-numeric: tabular-nums; }
.bc-pl.lead .pts { color: #111; }
.bc-pl.cur .nm { color: #111; }
.pips { display: inline-flex; gap: 3px; }
.pip { width: 7px; height: 7px; border-radius: 50%; border: 1.5px solid #bbb; }
.pip.on { background: #2e7d32; border-color: #2e7d32; }

.tag { display: inline-block; font-size: 0.5rem; font-weight: 700; letter-spacing: 0.5px; text-transform: uppercase; padding: 1px 5px; border-radius: 3px; margin-left: 6px; vertical-align: 1px; }
.tag.live { margin: 0; color: #c2410c; background: #fff; border: 1px solid #f3d4c4; padding: 2px 7px; border-radius: 10px; }
.tag.throwing { color: #fff; background: #c2410c; }
.tag.hot { color: #7a4a00; background: #ffe7b3; }

.bc-last { font-size: 0.68rem; color: #666; padding-top: 6px; }
.bc-last b { color: #2e7d32; }
.bc-last b.big { color: #c2410c; }
.bc-last.fresh { animation: bc-in 500ms ease-out; }
.bc-event { margin-top: 6px; text-align: center; font-size: 0.8rem; font-weight: 800; letter-spacing: 0.5px; text-transform: uppercase; color: #c2410c; background: #fff3ee; border-radius: 6px; padding: 6px; animation: bc-in 400ms ease-out; }
@keyframes bc-in { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }
.bc-more { text-align: center; font-size: 0.6rem; font-weight: 700; color: #c2410c; text-transform: uppercase; letter-spacing: 0.5px; padding-top: 6px; }
.bcard .open-label, .bcard[open] .closed-label { display: none; }
.bcard[open] .open-label { display: inline; }
.bc-share { text-align: center; font-size: 0.65rem; padding: 0 0 10px; }
.bc-share a { color: #555; }

.pop { position: absolute; right: 0; bottom: 100%; font-size: 0.8rem; font-weight: 800; color: #2e7d32; animation: pop-up 2.6s ease-out both; pointer-events: none; }
@keyframes pop-up { 0% { opacity: 0; transform: translateY(6px); } 15% { opacity: 1; transform: none; } 70% { opacity: 1; } 100% { opacity: 0; transform: translateY(-4px); } }

/* ---------- marks grid ---------- */
.grid { display: grid; gap: 4px; padding: 4px 12px 12px; }
.crow { display: grid; grid-template-columns: 1fr 52px 1fr; gap: 4px; }
.crow .n { display: grid; place-items: center; background: #fff; border: 1px solid #eee; border-radius: 4px; font-size: 0.8rem; font-weight: 700; padding: 5px 0; }
.crow.dead .n { color: #bbb; text-decoration: line-through; }
.mk { display: grid; place-items: center; background: #fff; border: 1px solid #eee; border-radius: 4px; color: #2e7d32; min-height: 30px; }
.mk svg { width: 18px; height: 18px; }
.mk.closed { background: #e8f5e9; border-color: #c8e6c9; }
.crow.dead .mk { background: #fafafa; color: #9bbf9d; }
.mk.live-hit { border-color: #c2410c; box-shadow: inset 0 0 0 1px #c2410c; }
.mk.hit { animation: mk-hit 5s ease-out both; }
@keyframes mk-hit { 0%, 12% { background: #2e7d32; color: #fff; } 100% { background: #fff; color: #2e7d32; } }
.mk.closed.hit { animation-name: mk-hit-closed; }
@keyframes mk-hit-closed { 0%, 12% { background: #2e7d32; color: #fff; } 100% { background: #e8f5e9; color: #2e7d32; } }

/* ---------- tonight's MPR ---------- */
.mpr-row { grid-template-columns: 26px 1fr auto 50px; }
.mpr-row.up .wk-lb-name { color: #999; font-weight: 500; }
.mpr-row .wk-lb-name a { color: inherit; text-decoration: none; }
.st-cell { text-align: right; }
.st { font-size: 0.55rem; font-weight: 700; letter-spacing: 0.4px; text-transform: uppercase; padding: 2px 6px; border-radius: 3px; white-space: nowrap; color: #888; }
.st.W { background: #e8f5e9; color: #2e7d32; }
.st.L { background: #f5f5f5; color: #888; }
.st.live { background: #fff3ee; color: #c2410c; }
.st.at { padding: 0; font-weight: 600; letter-spacing: 0; text-transform: none; color: #aaa; }

/* ---------- storylines ---------- */
.stories { list-style: none; }
.story { display: grid; grid-template-columns: 96px 1fr; column-gap: 8px; padding: 7px 4px; border-bottom: 1px solid #f0f0f0; font-size: 0.75rem; }
.story .k { grid-row: span 2; font-size: 0.55rem; font-weight: 700; color: #888; text-transform: uppercase; letter-spacing: 0.5px; padding-top: 3px; }
.story.best .k { color: #c2410c; }
.story.upset .k { color: #2e7d32; }
.story .who { font-weight: 600; }
.story .who a { color: #111; text-decoration: none; }
.story .ln { color: #666; font-size: 0.68rem; }

/* ---------- slate (week grid) ---------- */
.board-cell .player-name a { color: inherit; text-decoration: none; }
.board-cell .result { display: block; text-decoration: none; }
.board-cell .seed { color: #999; font-weight: 500; font-size: 0.6rem; }
.board-cell.live-cell { background: #fff3ee; border-color: #f3d4c4; }
.board-cell .result.live { color: #c2410c; }
.board-grid.extras { grid-template-columns: repeat(3, 1fr); }

/* ---------- one match ---------- */
.back { font-size: 0.7rem; padding: 4px 0 10px; }
.mv { border: 1px solid #eee; border-radius: 8px; padding: 14px 12px; }
.mv-meta { text-align: center; font-size: 0.6rem; color: #888; text-transform: uppercase; letter-spacing: 0.5px; font-weight: 600; }
.mv-state { color: #111; }
.mv-line { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 10px; margin: 14px 0 10px; }
.mv-side { text-align: center; }
.mv-name { font-size: 0.9rem; font-weight: 700; }
.mv-name a { color: #222; text-decoration: none; }
.mv-side.won .mv-name a { color: #2e7d32; }
.mv-mpr { font-size: 0.65rem; color: #888; margin-top: 2px; }
.mv-score { font-size: 1.8rem; font-weight: 800; font-variant-numeric: tabular-nums; }
.mv-score span { color: #bbb; margin: 0 4px; }
.mv-score.vs { font-size: 0.8rem; color: #aaa; font-style: italic; font-weight: 500; }
.mv-h2h { text-align: center; font-size: 0.72rem; color: #555; margin-top: 6px; }
.mv-actions { display: flex; justify-content: center; align-items: center; gap: 14px; margin-top: 14px; font-size: 0.7rem; }
.mv-actions button { font: inherit; font-weight: 700; color: #fff; background: #111; border: 0; border-radius: 14px; padding: 7px 14px; cursor: pointer; }
.mv-actions a { color: #555; }
.mv .grid { padding: 6px 0 0; }

@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; } }