/* ============ 滚球 ============ */
.live-toolbar { display: flex; align-items: center; gap: 8px; padding: 2px var(--page-x) 10px; flex-wrap: wrap; }
.lcard { padding: 10px 12px 12px; cursor: pointer; }
.lcard.is-live { border-color: rgba(73,226,173,.28); }
.lcard .m-head { height: 28px; }
.lscore { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); align-items: center; gap: 6px; margin: 8px 0 4px; }
.lstatus { text-align: center; font-size: 11px; color: var(--ink-3); line-height: 15px; margin-bottom: 8px; min-height: 15px; }
.lstatus.w { color: var(--warn); }
.lscore .side { display: flex; align-items: center; gap: 7px; min-width: 0; }
.lscore .side.home { justify-content: flex-start; text-align: left; }
.lscore .side.away { justify-content: flex-end; text-align: right; flex-direction: row-reverse; }
.lscore .side .tn { font-size: 14px; line-height: 18px; font-weight: 500; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-break: break-all; }
.lscore .side .tn.long { font-size: 12.5px; line-height: 16px; }
.lscore .side .crest-row { display: flex; align-items: center; gap: 6px; }
.lscore .side .sub { font-size: 11px; color: var(--ink-4); font-variant-numeric: tabular-nums; }
.lscore .big { display: flex; flex-direction: column; align-items: center; min-width: 80px; }
.lscore .big .sc { font-size: var(--t-score-live); line-height: 36px; font-weight: 700; color: var(--score); font-variant-numeric: tabular-nums; letter-spacing: .02em; display: inline-flex; align-items: baseline; gap: 8px; }
.lscore .big .sc .sep { color: var(--ink-3); font-weight: 400; font-size: 22px; }
.lscore .big .sc.na { color: var(--ink-3); font-size: 18px; font-weight: 500; }
.lscore .big .st { font-size: 11px; color: var(--ink-3); line-height: 14px; text-align: center; }
.lscore .big .st.w { color: var(--warn); }
.sc-flash { animation: scflash 900ms var(--ease); }
@keyframes scflash { 0% { text-shadow: 0 0 14px rgba(95,240,197,.9); transform: scale(1.06); } 100% { text-shadow: none; transform: none; } }
@media (prefers-reduced-motion: reduce) { .sc-flash { animation: none; } }

.odds2 { display: grid; grid-template-columns: 30px 1fr 1fr 1fr; gap: 4px 4px; margin-top: 2px; }
.odds2 .lab { font-size: 11px; color: var(--ink-4); display: flex; align-items: center; }
.odds2 .cell { height: 30px; display: flex; align-items: center; justify-content: center; gap: 5px; border-radius: 8px; background: var(--surface-2); border: 1px solid var(--line); font-size: 14px; font-variant-numeric: tabular-nums; }
.odds2 .cell .k { font-size: 11px; color: var(--ink-4); }
.odds2 .cell.line { color: var(--cyan); font-weight: 600; background: var(--cyan-soft); border-color: rgba(54,221,236,.25); }
.odds2 .cell.na { color: var(--ink-4); border-style: dashed; background: transparent; }

.tl { margin-top: 10px; }
.tl-track { position: relative; height: 8px; border-radius: 4px; background: linear-gradient(90deg, var(--surface-3), var(--surface-2)); border: 1px solid var(--line); }
.tl-fill { position: absolute; left: 0; top: 0; bottom: 0; border-radius: 4px; background: linear-gradient(90deg, var(--pos), var(--cyan) 70%, var(--blue)); opacity: .8; }
.tl-now { position: absolute; top: -5px; width: 2px; height: 18px; background: var(--neg); border-radius: 1px; transform: translateX(-1px); }
.tl-ticks { position: relative; height: 16px; margin-top: 22px; font-size: 10px; color: var(--ink-4); font-variant-numeric: tabular-nums; }
.tl-ticks span { position: absolute; transform: translateX(-50%); }
.tl-ticks span:first-child { transform: none; }
.tl-ticks span:last-child { transform: translateX(-100%); }
.tl-ev { position: absolute; top: -9px; width: 22px; height: 22px; border-radius: 50%; display: flex; align-items: center; justify-content: center; transform: translateX(-50%); background: var(--surface-solid); border: 1px solid var(--line-strong); color: var(--ink); z-index: 1; }
.tl-ev.home { top: -24px; } .tl-ev.away { top: 12px; }

.tl-ev.goal { border-color: rgba(255,255,255,.55); background: #0b2038; box-shadow: 0 0 10px rgba(95,240,197,.35); }
.tl-ev.yellow { color: var(--warn); } .tl-ev.red { color: var(--neg); border-color: rgba(255,137,146,.5); }
.tl-ev.sub { color: var(--blue); }
.tl-ev.stack { font-size: 10px; font-weight: 700; }
.tl-wrap { padding: 22px 0 6px; }
.tl-seg-label { position: absolute; top: -16px; font-size: 10px; color: var(--ink-4); transform: translateX(-50%); }
.tl-extra { position: absolute; top: 0; bottom: 0; background: repeating-linear-gradient(135deg, transparent 0 3px, rgba(255,208,131,.35) 3px 4px); border-left: 1px dashed rgba(255,208,131,.6); }
.tl-legend { display: flex; flex-wrap: wrap; gap: 10px; font-size: 11px; color: var(--ink-3); margin-top: 4px; }
.tl-legend span { display: inline-flex; align-items: center; gap: 4px; }

.lexp:not(.rl-tabs) { margin-top: 10px; display: flex; gap: 6px; }
.lexp:not(.rl-tabs) button { flex: 1; min-height: 36px; border-radius: 10px; border: 1px solid var(--line); background: var(--surface-2); font-size: 13px; color: var(--ink-2); display: inline-flex; align-items: center; justify-content: center; gap: 4px; }
.lexp:not(.rl-tabs) button[aria-expanded="true"] { background: var(--cyan-soft); color: var(--cyan); border-color: rgba(54,221,236,.4); }
.lpanel { margin-top: 10px; padding: 10px; border-radius: 12px; background: var(--surface-2); border: 1px solid var(--line); }
.lpanel h4 { font-size: 13px; font-weight: 600; color: var(--ink-2); margin-bottom: 8px; display: flex; align-items: center; gap: 6px; }
.lpanel h4 .src { margin-left: auto; font-size: 11px; font-weight: 400; color: var(--ink-4); }
.lfacts { display: flex; flex-wrap: wrap; gap: 6px 14px; font-size: 12px; color: var(--ink-3); margin-top: 4px; }
.lfacts b { color: var(--ink-2); font-weight: 500; font-variant-numeric: tabular-nums; }
.lfacts .na { color: var(--ink-4); }

/* 成对统计条 */
.stat-rows { display: flex; flex-direction: column; gap: 7px; }
.stat-row { display: grid; grid-template-columns: 44px 1fr 44px; align-items: center; gap: 8px; }
.stat-row .v { font-size: 14px; font-weight: 600; font-variant-numeric: tabular-nums; text-align: right; }
.stat-row .v.away { text-align: left; }
.stat-row .v.na { color: var(--ink-4); font-weight: 400; font-size: 12px; }
.stat-row .mid { display: flex; flex-direction: column; align-items: center; gap: 3px; }
.stat-row .lab { font-size: 11px; color: var(--ink-3); line-height: 14px; }
.bar2 { position: relative; width: 100%; height: 6px; border-radius: 3px; background: var(--surface-3); overflow: hidden; }
.bar2 i { position: absolute; top: 0; bottom: 0; }
.bar2 .l { right: 50%; border-radius: 3px 0 0 3px; background: linear-gradient(90deg, var(--cyan), var(--pos)); }
.bar2 .r { left: 50%; border-radius: 0 3px 3px 0; background: linear-gradient(90deg, var(--blue), var(--violet)); }
.bar2.partial { background: repeating-linear-gradient(90deg, var(--surface-3) 0 4px, transparent 4px 7px); }
.stat-note { font-size: 11px; color: var(--ink-4); margin-top: 6px; }

/* 事件列表 */
.ev-list { display: flex; flex-direction: column; gap: 4px; }
.ev { display: grid; grid-template-columns: 1fr 48px 1fr; align-items: center; gap: 6px; min-height: 26px; font-size: 13px; }
.ev .side { display: flex; align-items: center; gap: 6px; min-width: 0; }
.ev .side.home { justify-content: flex-end; text-align: right; }
.ev .side .who { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ev .side .kind { font-size: 11px; color: var(--ink-3); white-space: nowrap; }
.ev .min { text-align: center; font-size: 12px; color: var(--ink-3); font-variant-numeric: tabular-nums; }
.ev .min.approx { color: var(--warn); }
.ev .ico { flex: 0 0 auto; }
.ev.goal .ico { color: var(--pos); } .ev.yellow .ico { color: var(--warn); } .ev.red .ico { color: var(--neg); } .ev.sub .ico { color: var(--blue); } .ev.var .ico { color: var(--violet); }

/* ============ 账本 ============ */
.ledger-top { display: grid; grid-template-columns: repeat(6, 1fr); gap: 4px; padding: 10px 8px; }
.ledger-top .st { display: flex; flex-direction: column; align-items: center; gap: 2px; min-width: 0; }
.ledger-top .st b { font-size: 20px; line-height: 24px; font-weight: 700; font-variant-numeric: tabular-nums; letter-spacing: -.01em; }
.ledger-top .st span { font-size: 11px; color: var(--ink-3); white-space: nowrap; }
.ledger-top .st.red b { color: var(--neg); } .ledger-top .st.black b { color: var(--ink-2); } .ledger-top .st.push b { color: var(--push); } .ledger-top .st.rate b { color: var(--pos); }
@media (min-width: 420px) { .ledger-top .st b { font-size: 24px; line-height: 28px; } }
.ledger-sub { display: flex; flex-wrap: wrap; gap: 6px 14px; padding: 0 12px 10px; font-size: 11px; color: var(--ink-4); }
.ledger-sub b { color: var(--ink-3); font-weight: 500; }

.donut-wrap { display: grid; grid-template-columns: 132px 1fr; gap: 12px; align-items: center; }
.donut { position: relative; width: 132px; height: 132px; }
.donut svg { width: 100%; height: 100%; transform: rotate(-90deg); }
.donut .c { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; }
.donut .c b { font-size: 24px; line-height: 28px; font-weight: 700; color: var(--pos); font-variant-numeric: tabular-nums; }
.donut .c span { font-size: 10px; color: var(--ink-3); line-height: 12px; text-align: center; }
.legend { display: flex; flex-direction: column; gap: 8px; }
.legend .li { display: grid; grid-template-columns: 12px auto 1fr; align-items: center; gap: 8px; font-size: 13px; }
.legend .li .v { text-align: right; }
.legend .foot { font-size: 11px; color: var(--ink-3); line-height: 16px; margin-top: 2px; }
.legend .li i { width: 12px; height: 12px; border-radius: 3px; }
.legend .li .n { color: var(--ink-2); }
.legend .li .v { font-variant-numeric: tabular-nums; font-weight: 600; }
.legend .li .v small { color: var(--ink-3); font-weight: 400; margin-left: 4px; }
.ring-tiles { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.ring-tile { display: flex; align-items: center; gap: 10px; padding: 10px; }
.ring { position: relative; width: 52px; height: 52px; flex: 0 0 auto; }
.ring svg { width: 100%; height: 100%; transform: rotate(-90deg); }
.ring-tile b { font-size: 22px; line-height: 26px; font-weight: 700; font-variant-numeric: tabular-nums; display: block; }
.ring-tile span { font-size: 11px; color: var(--ink-3); }

.tbl { width: 100%; font-size: 13px; }
.tbl th { font-size: 11px; font-weight: 500; color: var(--ink-3); text-align: right; padding: 6px 6px; border-bottom: 1px solid var(--line); white-space: nowrap; }
.tbl th:first-child, .tbl td:first-child { text-align: left; padding-left: 10px; }
.tbl td { padding: 9px 6px; text-align: right; border-bottom: 1px solid var(--line); font-variant-numeric: tabular-nums; }
.tbl tr:last-child td { border-bottom: 0; }
.tbl tbody tr { cursor: pointer; transition: background var(--m-fast); }
.tbl tbody tr:active, .tbl tbody tr.on { background: var(--cyan-soft); }
.tbl .c-red { color: var(--neg); } .tbl .c-black { color: var(--ink-2); } .tbl .c-push { color: var(--push); }
.tbl .rate { color: var(--pos); font-weight: 700; }
.tbl .rate.small { color: var(--warn); }
.tbl .rate.na { color: var(--ink-4); font-weight: 400; }
.tbl .n { color: var(--ink-3); }
.tbl .lgname { font-weight: 500; color: var(--ink); }
.tbl .smp { font-size: 10px; color: var(--ink-4); margin-left: 4px; }
.tbl-scroll { overflow-x: auto; }
.drill-bar { display: flex; align-items: center; gap: 8px; padding: 8px 10px; border-radius: 12px; background: var(--cyan-soft); border: 1px solid rgba(54,221,236,.3); font-size: 13px; }
.drill-bar b { color: var(--cyan); }
.drill-bar button { margin-left: auto; }

.rec { display: grid; grid-template-columns: 1fr auto; gap: 4px 8px; padding: 10px 12px; cursor: pointer; }
.rec .r1 { display: flex; align-items: center; gap: 6px; font-size: 12px; color: var(--ink-3); min-width: 0; }
.rec .r2 { font-size: 14px; font-weight: 500; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rec .r3 { font-size: 12px; color: var(--ink-2); display: flex; flex-wrap: wrap; gap: 4px 8px; align-items: center; }
.rec .r3 .odd { color: var(--cyan); font-weight: 600; }
.rec .res { grid-row: 1 / span 3; display: flex; flex-direction: column; align-items: flex-end; justify-content: center; gap: 4px; }
.rec .res .sc { font-size: 15px; font-weight: 600; font-variant-numeric: tabular-nums; color: var(--ink-2); }
.rec .res .tag { font-size: 12px; height: 22px; padding: 0 8px; }
.rec .r4 { grid-column: 1 / -1; font-size: 11px; color: var(--ink-4); line-height: 16px; }
.rec .r4 button { color: var(--cyan); text-decoration: underline; text-underline-offset: 2px; font-size: 11px; }
.pager { display: flex; align-items: center; justify-content: center; gap: 8px; padding: 6px 0; font-size: 12px; color: var(--ink-3); }

/* ============ 桌面停靠 ============ */
.dock-grid { display: grid; grid-template-columns: minmax(420px, 1fr) minmax(460px, 560px); gap: 0 20px; align-items: start; }
.dock-list { min-width: 0; }
.dock-panel { position: sticky; top: calc(var(--topbar-h) + 30px); height: calc(100vh - var(--topbar-h) - 40px); }
.dock-panel .detail { position: static; height: 100%; border-radius: var(--r-card); border: 1px solid var(--line); overflow: hidden; }
@media (min-width: 981px) {
  .list { max-width: 720px; }
  .page-live .list, .page-ledger .stack { max-width: 760px; }
  .dock-grid .list { max-width: none; }
}

.more-row { display: flex; justify-content: center; padding: 10px 0 4px; }
.more-row .btn { min-width: 60%; }