/* 賽果頁版型（2026/09 改版，參考 Apple Sports 的賽果頁）
 *
 * 與 game_result.css 並存：那支有 300+ 頁在用，這支只給改版過的頁面，
 * 兩支同時載入時本檔在後、需要覆寫的地方由本檔勝出。
 * 注意：class 命名不可與 game_result.css 相撞（例如那支已有
 * .score { color:#fa363a }，所以比分列容器叫 .scoreline）。
 */

:root { --red:#dc3545; --grey:#adb5bd; --slate:#41566b; --ink:#333; --line:#e0e0e0; }
body { margin:0; background:#f0f0f0; font-family:Arial,"PingFang TC","Microsoft JhengHei",sans-serif; color:var(--ink); }
/* 不要 min-height:100vh：會把後面的 Shopee 區塊推到一整螢幕之下，看起來像消失了 */
.container { max-width:760px; margin:0 auto; background:#fff; padding:0; }
.head { padding:16px 16px 14px; border-bottom:1px solid var(--line); }
.meta { text-align:center; font-size:12px; color:#6c757d; margin-bottom:12px; }
.meta b { color:var(--ink); font-size:13px; }
/* 不能叫 .score：共用的 game_result.css 已經有 .score { color:#fa363a } */
.scoreline { display:flex; align-items:center; gap:10px; }
.side { flex:1; display:flex; flex-direction:column; align-items:center; gap:4px; min-width:0; }
.tag { font-size:11px; color:#868e96; letter-spacing:.08em; }
.tname { font-size:15px; font-weight:bold; text-align:center; }
.tscore { font-size:58px; font-weight:bold; line-height:1; }
.tscore.win { color:var(--red); } .tscore.lose { color:var(--grey); }
.state { font-size:12px; color:#868e96; padding-bottom:22px; white-space:nowrap; }
table.det { width:100%; border-collapse:collapse; margin-top:14px; }
table.det th { font-size:11px; font-weight:normal; color:#6c757d; padding:6px 4px; border-bottom:1px solid var(--line); text-align:center; }
table.det th:first-child { text-align:left; }
table.det td { font-size:14px; padding:8px 4px; text-align:center; border-bottom:1px solid #f2f2f2; }
table.det td:first-child { text-align:left; font-weight:bold; font-size:13px; }
table.det td.fin { font-weight:bold; font-size:16px; color:var(--red); }
table.det td.fin.lose { color:var(--grey); }
.sec { padding:16px; border-bottom:1px solid var(--line); }
.cmp { margin-bottom:12px; }
.cmp-top { display:flex; align-items:baseline; justify-content:space-between; margin-bottom:4px; }
.cmp-v { font-size:17px; font-weight:bold; width:46px; }
.cmp-v:last-child { text-align:right; }
.cmp-v.lead { color:var(--red); } .cmp-v.trail { color:var(--grey); }
.cmp-l { font-size:13px; color:#6c757d; }
.cmp-bar { display:flex; height:6px; border-radius:3px; overflow:hidden; background:#eee; }
.cmp-bar i { display:block; }
.sw { display:inline-block; width:9px; height:9px; border-radius:2px; margin-right:6px; vertical-align:baseline; }
.legend { display:flex; justify-content:space-between; font-size:12px; color:#6c757d; margin-bottom:6px; }
.strip { display:flex; height:22px; border-radius:4px; overflow:hidden; gap:1px; }
.strip i { display:flex; align-items:center; justify-content:center; font-size:10px; font-style:normal; color:#fff; }
.sg.on-a { background:var(--slate); } .sg.on-h { background:var(--red); } .sg.off { background:#f1f3f5; }
/* 分頁用 Apple Sports 的拆法：純文字平均分佈、不做色塊，只用一小段底線標示 */
.tabs { display:flex; border-bottom:1px solid var(--line); }
.tab { flex:1; text-align:center; font-size:15px; padding:9px 0 8px; color:#868e96; cursor:pointer; border:none; background:none; font-family:inherit; position:relative; }
.tab.on { color:var(--red); font-weight:bold; }
.tab.on::after { content:''; position:absolute; left:50%; transform:translateX(-50%); bottom:-1px; width:46px; height:3px; border-radius:2px; background:var(--red); }
.pane { padding:10px 16px 24px; }
.ptitle { font-size:14px; font-weight:bold; margin-bottom:8px; }
.ptitle.mt { margin-top:22px; }
table.g { width:100%; border-collapse:collapse; }
table.g th { font-size:11px; font-weight:normal; color:#fff; background:#4a4a4a; padding:7px 4px; }
table.g td { font-size:14px; padding:5px 6px; border-bottom:1px solid #f0f0f0; text-align:center; }
td.st { width:132px; line-height:1.3; }
td.st .l1 { display:flex; align-items:center; justify-content:center; gap:5px; }
td.st b { font-size:12px; }
.ty { font-size:10px; color:#adb5bd; white-space:nowrap; }
/* 賽局欄的內容必須不換行，這一欄才有寬度下限。
   否則 .nm 的 nowrap 讓兩個隊伍欄變成剛性，視窗一窄，table-layout:auto
   就把全部壓縮丟給賽局欄，分值徽章會被折成「3 / 分」兩行。 */
.pt { font-size:10px; padding:1px 5px; border-radius:3px; background:#f1f3f5; color:#6c757d; white-space:nowrap; flex-shrink:0; }
.pt.p3 { background:#fff4e0; color:#8a6d00; } .pt.p4 { background:#fdeaec; color:#b02a37; }
td.pl { vertical-align:top; }
td.pl.win .nm { font-weight:bold; color:var(--red); }
.nm { line-height:1.3; } .nm.n3 { font-size:12.5px; white-space:nowrap; } .nm.n4 { white-space:nowrap; }
.fa-row { min-height:15px; margin-top:1px; line-height:1; }
.fa { font-size:9px; color:#8a6d00; background:#fff4e0; padding:1px 4px; border-radius:2px; }
td.pn { text-align:left; font-weight:bold; } td.wv { font-weight:bold; color:var(--red); }

/* 極窄螢幕：三人／四人賽的隊名放行換行，讓隊伍欄也一起分擔壓縮，
   否則三欄全部剛性會撐出橫向捲軸 */
@media screen and (max-width: 359px) {
    .nm.n3, .nm.n4 { white-space: normal; }
}