:root {
  --bg: #f5f6f8; --card: #ffffff; --text: #16181d; --muted: #6b7280; --line: #e5e7eb;
  --accent: #0f766e; --chip: #eef2f7;
  --r-top: #047857; --r-good: #16a34a; --r-mid: #6b7280; --r-low: #d97706;
  --home-ink: var(--home); --away-ink: var(--away);
}
@media (prefers-color-scheme: dark) {
  :root { --bg: #0e1116; --card: #171b22; --text: #e8eaee; --muted: #9aa3b2; --line: #262c36; --accent: #2dd4bf; --chip: #222833;
    /* 남색·검정 계열 팀색이 어두운 배경에 묻히지 않도록 밝게 보정 */
    --home-ink: color-mix(in srgb, var(--home) 55%, #fff); --away-ink: color-mix(in srgb, var(--away) 55%, #fff); }
}
* { box-sizing: border-box; }
body { margin: 0; background: var(--bg); color: var(--text); font-family: 'Pretendard Variable', Pretendard, -apple-system, 'Malgun Gothic', sans-serif; line-height: 1.7; -webkit-font-smoothing: antialiased; }
a { color: inherit; text-decoration: none; }
h1, h2, h3 { line-height: 1.35; margin: 0; }

.site-header { display: flex; align-items: center; gap: 12px; padding: 14px 16px; border-bottom: 1px solid var(--line); background: var(--card); position: sticky; top: 0; z-index: 10; }
.brand { font-weight: 800; font-size: 18px; letter-spacing: -0.02em; display: inline-flex; align-items: center; gap: 8px; align-self: center; }
.logo { width: 28px; height: 28px; border-radius: 7px; background: #0e1116; color: #2dd4bf; display: inline-flex; align-items: center; justify-content: center; font-size: 12.5px; font-weight: 900; letter-spacing: -0.06em; position: relative; padding-right: 2px; }
.logo i { width: 2.5px; height: 2.5px; border-radius: 50%; background: #2dd4bf; margin-left: 1px; align-self: flex-end; margin-bottom: 9px; }
.tagline { color: var(--muted); font-size: 13px; }
.wrap { max-width: 760px; margin: 0 auto; padding: 16px; }
.site-footer { text-align: center; color: var(--muted); font-size: 13px; padding: 32px 16px; }

/* 스코어보드 */
.scoreboard { background: linear-gradient(135deg, color-mix(in srgb, var(--home) 22%, var(--card)), var(--card) 50%, color-mix(in srgb, var(--away) 22%, var(--card))); border: 1px solid var(--line); border-radius: 16px; padding: 20px 16px; text-align: center; }
.comp { font-size: 13px; font-weight: 600; color: var(--muted); }
.teams { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 8px; margin: 14px 0 8px; }
.team { display: flex; flex-direction: column; align-items: center; gap: 8px; min-width: 0; }
.crest { width: 48px; height: 48px; border-radius: 50%; color: #fff; display: grid; place-items: center; font-weight: 800; font-size: 20px; box-shadow: 0 2px 8px rgb(0 0 0 / .15); }
.tname { font-weight: 700; font-size: 15px; word-break: keep-all; }
.score { font-size: 44px; font-weight: 800; letter-spacing: -0.02em; font-variant-numeric: tabular-nums; }
.score span { color: var(--muted); margin: 0 6px; font-weight: 400; }
.scorers { display: grid; grid-template-columns: 1fr auto 1fr; gap: 8px; font-size: 13px; color: var(--muted); }
.scorers .ht { font-size: 12px; padding: 0 6px; }
.meta { margin-top: 12px; font-size: 12px; color: var(--muted); }

/* 리뷰 본문 */
.review { padding: 24px 2px 8px; }
.review h1 { font-size: 24px; letter-spacing: -0.02em; word-break: keep-all; text-wrap: balance; }
.summary { color: var(--muted); font-size: 15px; margin: 8px 0 18px; }
.review p { font-size: 16.5px; margin: 0 0 16px; word-break: keep-all; }
.keypoints { background: var(--card); border: 1px solid var(--line); border-left: 4px solid var(--accent); border-radius: 12px; padding: 14px 16px; margin-bottom: 20px; }
.keypoints h2 { font-size: 14px; color: var(--accent); margin-bottom: 6px; }
.keypoints ul { margin: 0; padding-left: 18px; }
.keypoints li { font-size: 15px; margin: 4px 0; word-break: keep-all; }

.card { background: var(--card); border: 1px solid var(--line); border-radius: 16px; padding: 18px 16px; margin: 16px 0; }
.card h2 { font-size: 17px; margin-bottom: 14px; }
.card h3 { font-size: 15px; margin-bottom: 8px; }

/* 최우수 선수 */
.pom { border-color: color-mix(in srgb, var(--accent) 40%, var(--line)); }
.pom-label { font-size: 12px; font-weight: 700; color: var(--accent); }
.pom-name { font-size: 20px; font-weight: 800; margin: 2px 0 6px; display: flex; align-items: center; gap: 8px; }
.pom p { margin: 0; color: var(--muted); font-size: 15px; }
.pom p.pom-analysis { margin-top: 10px; color: var(--text); line-height: 1.7; }

/* 스탯 비교 */
.stat-teams { display: flex; justify-content: space-between; font-weight: 700; font-size: 14px; margin-bottom: 6px; }
.stat-row { margin: 10px 0; }
.stat-head { display: grid; grid-template-columns: 64px 1fr 64px; font-size: 14px; font-variant-numeric: tabular-nums; }
.stat-head span:last-child { text-align: right; }
.stat-head .lead { font-weight: 800; }
.stat-label { text-align: center; color: var(--muted); font-size: 13px; }
.stat-bar { display: flex; gap: 3px; height: 6px; margin-top: 4px; }
.stat-bar span { border-radius: 3px; min-width: 2px; }
.bar-home { background: var(--home-ink); }
.bar-away { background: var(--away-ink); }

/* 타임라인 */
.timeline { list-style: none; margin: 0; padding: 0; }
.ev { display: grid; grid-template-columns: 52px 44px 1fr; align-items: center; gap: 8px; padding: 8px 0; border-bottom: 1px solid var(--line); font-size: 14px; }
.ev:last-child { border-bottom: 0; }
.ev-home { border-left: 3px solid var(--home-ink); padding-left: 8px; }
.ev-away { border-left: 3px solid var(--away-ink); padding-left: 8px; }
.ev-min { color: var(--muted); font-variant-numeric: tabular-nums; }
.ev-chip { font-size: 11px; font-weight: 700; text-align: center; border-radius: 6px; padding: 2px 0; background: var(--chip); }
.ev-goal { background: var(--accent); color: #fff; }
.ev-yellow { background: #facc15; color: #422006; }
.ev-red { background: #dc2626; color: #fff; }
.ev-out { color: var(--muted); }
.ev-out::before { content: '▼ '; color: #dc2626; font-size: 11px; }
.ev-in { font-weight: 600; }
.ev-assist { color: var(--muted); font-size: 12px; }

/* 평점·라인업 */
.two-col { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
@media (max-width: 640px) { .two-col { grid-template-columns: 1fr; } }
.ratings { width: 100%; border-collapse: collapse; font-size: 13.5px; font-variant-numeric: tabular-nums; }
.ratings th { text-align: left; color: var(--muted); font-weight: 500; font-size: 12px; padding: 4px 2px; border-bottom: 1px solid var(--line); }
.ratings td { padding: 6px 2px; border-bottom: 1px solid var(--line); }
.ratings td:not(:first-child), .ratings th:not(:first-child) { text-align: center; width: 40px; }
.sub-tag { font-size: 10px; color: var(--muted); border: 1px solid var(--line); border-radius: 4px; padding: 0 3px; }
.rating { display: inline-block; min-width: 34px; text-align: center; border-radius: 6px; color: #fff; font-weight: 700; font-size: 12.5px; padding: 1px 4px; }
.r-top { background: var(--r-top); } .r-good { background: var(--r-good); } .r-mid { background: var(--r-mid); } .r-low { background: var(--r-low); }
.formation { font-size: 13px; color: var(--muted); margin-bottom: 6px; }
.xi { list-style: none; margin: 0; padding: 0; font-size: 14px; }
.xi li { padding: 3px 0; }
.num { display: inline-block; width: 26px; color: var(--muted); font-variant-numeric: tabular-nums; }

.tags { display: flex; flex-wrap: wrap; gap: 6px; margin: 20px 0; }
.tags span { background: var(--chip); border-radius: 999px; padding: 3px 10px; font-size: 13px; color: var(--muted); }
.ad-slot { border: 1px dashed var(--line); border-radius: 12px; color: var(--muted); font-size: 12px; display: grid; place-items: center; min-height: 100px; margin: 20px 0; }
.disclosure { color: var(--muted); font-size: 12.5px; text-align: center; }

/* 목록 */
.page-title { font-size: 20px; margin: 8px 0 12px; }
.list-card { display: block; background: var(--card); border: 1px solid var(--line); border-radius: 14px; padding: 14px 16px; margin-bottom: 10px; }
.list-meta { font-size: 12px; color: var(--muted); }
.list-score { display: flex; align-items: center; gap: 8px; font-weight: 700; margin: 4px 0; }
.list-score strong { font-size: 18px; }
.dot { width: 10px; height: 10px; border-radius: 50%; display: inline-block; }
.list-title { font-size: 15px; }

/* 헤더 언어 전환 · 칩 · 고정 페이지 */
.nav-link { margin-left: auto; font-size: 14px; font-weight: 700; color: var(--accent); }
.nav-link + .lang-switch { margin-left: 6px; }
.lang-switch { margin-left: auto; font-size: 13px; font-weight: 600; border: 1px solid var(--line); border-radius: 999px; padding: 2px 10px; }
.site-footer nav { margin-bottom: 6px; }
.site-footer a { text-decoration: underline; text-underline-offset: 3px; }
.comp:hover, .team:hover .tname { text-decoration: underline; }
.chips { display: flex; flex-wrap: wrap; gap: 8px; }
.chip { background: var(--card); border: 1px solid var(--line); border-radius: 999px; padding: 6px 14px; font-size: 14px; font-weight: 600; }
.static h1 { font-size: 24px; margin: 8px 0 16px; }
.static h2 { font-size: 17px; margin: 24px 0 8px; }
.static p { margin: 0 0 12px; }
.static a { color: var(--accent); text-decoration: underline; }
.empty { color: var(--muted); }

/* 경기 흐름 막대 */
.flow-bar { position: relative; height: 34px; margin: 26px 0 10px; }
.flow-bar .seg { position: absolute; top: 12px; height: 10px; }
.flow-bar .seg:first-child { border-radius: 5px 0 0 5px; }
.seg-home { background: var(--home-ink); } .seg-away { background: var(--away-ink); } .seg-level { background: var(--line); }
.flow-bar .goal { position: absolute; top: 0; width: 2px; height: 34px; background: var(--text); transform: translateX(-1px); }
.flow-bar .goal b { position: absolute; top: -20px; left: 50%; transform: translateX(-50%); font-size: 11px; white-space: nowrap; font-variant-numeric: tabular-nums; }
.flow-bar .tick { position: absolute; top: 8px; width: 1px; height: 18px; background: var(--muted); opacity: .5; }
.flow-sum { font-size: 13.5px; color: var(--muted); }
.flow-notes { margin: 10px 0 0; padding-left: 18px; font-size: 14px; }
/* 평소와 비교 */
.ctx-span { font-size: 12px; color: var(--muted); margin: -4px 0 6px; }
.ctx { width: 100%; border-collapse: collapse; font-size: 13.5px; font-variant-numeric: tabular-nums; }
.ctx th { text-align: left; color: var(--muted); font-weight: 500; font-size: 12px; padding: 4px 2px; border-bottom: 1px solid var(--line); }
.ctx td { padding: 5px 2px; border-bottom: 1px solid var(--line); }
.ctx .v { font-weight: 700; } .ctx .v.up::after { content: ' ▲'; font-size: 9px; color: var(--muted); } .ctx .v.down::after { content: ' ▼'; font-size: 9px; color: var(--muted); }
.muted { color: var(--muted); }
.badge { font-size: 11px; font-weight: 700; border-radius: 5px; padding: 1px 6px; }
.badge.hi { background: color-mix(in srgb, var(--accent) 18%, transparent); color: var(--accent); }
.badge.lo { background: color-mix(in srgb, #d97706 18%, transparent); color: #d97706; }
/* 항목별 최고 */
.leaders { list-style: none; margin: 0; padding: 0; }
.leaders li { display: grid; grid-template-columns: 120px 1fr auto; gap: 8px; align-items: center; padding: 7px 0; border-bottom: 1px solid var(--line); font-size: 14px; }
.leaders li:last-child { border-bottom: 0; }
.leaders .lk { color: var(--muted); font-size: 13px; }
.leaders .lv { font-weight: 700; font-variant-numeric: tabular-nums; }
.leaders .dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; margin-right: 6px; vertical-align: middle; }
.flow-bar .goal.below b { top: auto; bottom: -20px; }
.flow-bar { margin-bottom: 26px; }
.standings { margin-top: 8px; font-size: 13px; font-weight: 600; }
.standings .sep { color: var(--line); margin: 0 10px; }
.ev-no { font-size: 11px; font-weight: 700; color: var(--accent); border: 1px solid color-mix(in srgb, var(--accent) 40%, transparent); border-radius: 5px; padding: 0 5px; margin-left: 4px; }

/* 자체 평점 */
.ratings td.prov { color: var(--muted); font-size: 12.5px; }
.fn-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 12px; }
.fn-card { border: 1px solid var(--line); border-radius: 12px; padding: 12px; }
.swing-note { margin: 0 0 10px; font-size: 13px; color: var(--muted); }
.swing-list { display: grid; gap: 6px; margin-bottom: 12px; }
.swing-row { display: grid; grid-template-columns: 44px minmax(0, 1fr) 80px 40px; gap: 8px; align-items: center; font-size: 14px; }
.swing-row .sw-min { color: var(--muted); font-variant-numeric: tabular-nums; }
.swing-row .sw-who { min-width: 0; line-height: 1.35; }
.swing-row .sw-name, .swing-row .sw-kind { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.swing-row .sw-who .dot { width: 8px; height: 8px; margin-right: 6px; }
.swing-row .pb { height: 6px; background: var(--chip); border-radius: 3px; overflow: hidden; }
.swing-row .pb i { display: block; height: 100%; border-radius: 3px; }
.swing-row .pb i.pos { background: var(--accent); } .swing-row .pb i.neg { background: #d97706; }
.swing-row .sw-kind { font-size: 12px; color: var(--muted); padding-left: 14px; }
.swing-row .pv { text-align: right; font-weight: 700; font-variant-numeric: tabular-nums; }
.swing-team { display: flex; flex-wrap: wrap; gap: 4px 12px; font-size: 13px; color: var(--muted); padding: 8px 0; border-top: 1px solid var(--line); }
.swing-team b { color: var(--text); }
.grade { font-size: 12px; font-weight: 700; color: var(--accent); margin-left: 6px; white-space: nowrap; }
.fn-head .grade { margin: 0 4px 0 0; }
.fn-note { margin: 10px 0 0; font-size: 14px; line-height: 1.6; color: var(--muted); }
.fn-head { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; flex-wrap: wrap; font-size: 14.5px; }
.fn-head .dot { width: 8px; height: 8px; border-radius: 50%; display: inline-block; }
.fn-head .muted { font-size: 12px; }
.part { display: grid; grid-template-columns: 52px 1fr 44px; align-items: center; gap: 6px; font-size: 12px; margin: 3px 0; }
.part .pk { color: var(--muted); }
.part .pb { height: 6px; background: var(--chip); border-radius: 3px; overflow: hidden; }
.part .pb i { display: block; height: 100%; border-radius: 3px; }
.part .pb i.pos { background: var(--accent); } .part .pb i.neg { background: #d97706; }
.part .pv { text-align: right; font-variant-numeric: tabular-nums; }
.how { display: inline-block; margin-top: 10px; font-size: 13px; color: var(--accent); }
.method table { border-collapse: collapse; width: 100%; font-size: 14px; margin: 8px 0 16px; }
.method th, .method td { border-bottom: 1px solid var(--line); padding: 6px 4px; text-align: left; vertical-align: top; }

/* 홈 상단 소개 */
.hero { padding: 20px 2px 8px; }
.hero-mark { width: 44px; height: 44px; border-radius: 11px; background: #2dd4bf; color: #0e1116; display: inline-flex; align-items: center; justify-content: center; font-size: 19px; font-weight: 900; letter-spacing: -0.06em; padding-right: 3px; }
.hero-mark i { width: 4px; height: 4px; border-radius: 50%; background: #0e1116; margin: 0 0 14px 1px; align-self: flex-end; }
.hero h1 { font-size: 26px; line-height: 1.3; margin: 14px 0 8px; letter-spacing: -0.02em; word-break: keep-all; }
.hero p { margin: 0 0 14px; color: var(--muted); font-size: 15px; word-break: keep-all; }
.hero p b { color: var(--text); }
h2.page-title { margin-top: 22px; }

/* FN 랭킹 */
.rk-intro, .rk-meta { color: var(--muted); font-size: 14px; margin: 0 0 12px; }
.rk h3 { font-size: 15px; margin: 4px 0 2px; }
.rk-note { font-size: 12px; color: var(--muted); margin: 0 0 6px; }
.rk-list { list-style: none; padding: 0; margin: 0 0 8px; }
.rk-list li { display: grid; grid-template-columns: 22px minmax(0, 1fr) auto; gap: 8px; align-items: center; padding: 8px 0; border-top: 1px solid var(--line); }
.rk-n { color: var(--muted); font-weight: 700; font-variant-numeric: tabular-nums; }
.rk-name { min-width: 0; line-height: 1.3; }
.rk-name b, .rk-name small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rk-name small { color: var(--muted); font-size: 12px; }
.rk-v { font-weight: 800; font-variant-numeric: tabular-nums; }
.rk-swing .rk-v { color: var(--accent); }

/* 목록 카드 아랫줄 */
.list-fn { display: flex; flex-wrap: wrap; gap: 4px 14px; margin-top: 8px; padding-top: 8px; border-top: 1px dashed var(--line); font-size: 13px; color: var(--muted); }
.list-fn b { color: var(--text); font-weight: 700; }
.list-fn .rating { font-size: 12px; padding: 0 6px; }
.list-fn .sw { color: var(--accent); font-weight: 800; }
@media (max-width: 640px) { .tagline { display: none; } }

/* 라인업: 경기장 그림 */
.pitch-team { font-size: 13px; color: var(--muted); margin: 6px 0; }
.pitch-team b { font-size: 15px; margin-right: 4px; }
.pitch { position: relative; width: 100%; max-width: 520px; margin: 0 auto; aspect-ratio: 68 / 100; border-radius: 12px; overflow: hidden;
  background: repeating-linear-gradient(0deg, #1f7a45 0 10%, #1c7040 10% 20%); border: 2px solid rgb(255 255 255 / .35); }
.pitch i.pl-half { position: absolute; left: 0; right: 0; top: 50%; border-top: 2px solid rgb(255 255 255 / .35); }
.pitch i.pl-circle { position: absolute; left: 50%; top: 50%; width: 22%; aspect-ratio: 1; transform: translate(-50%, -50%); border: 2px solid rgb(255 255 255 / .35); border-radius: 50%; }
.pitch i.pl-box { position: absolute; left: 22%; right: 22%; height: 11%; border: 2px solid rgb(255 255 255 / .35); }
.pitch i.pl-box.top { top: -2px; } .pitch i.pl-box.bottom { bottom: -2px; }
.pm { position: absolute; transform: translate(-50%, -50%); width: 22%; display: flex; flex-direction: column; align-items: center; text-align: center; color: #fff; line-height: 1.15; }
.pm-num { width: 26px; height: 26px; border-radius: 50%; display: grid; place-items: center; font-size: 12px; font-weight: 800; color: #fff; border: 2px solid #fff; box-shadow: 0 2px 6px rgb(0 0 0 / .35); }
.pm-name { max-width: 100%; margin-top: 2px; font-size: 11.5px; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-shadow: 0 1px 2px rgb(0 0 0 / .7); }
.pm-meta { display: flex; gap: 3px; align-items: center; justify-content: center; margin-top: 2px; flex-wrap: wrap; }
.pm-meta .rating, .bench .rating { font-size: 10.5px; padding: 0 4px; min-width: 0; border-radius: 4px; line-height: 1.5; }
.pm i, .bench i { font-style: normal; font-size: 10px; font-weight: 700; }
.pm-card { display: inline-block; width: 7px; height: 10px; border-radius: 1.5px; } .pm-card.yellow { background: #facc15; } .pm-card.red { background: #ef4444; }
.pm-off { color: #fca5a5; } .bench .pm-off { color: #dc2626; }
.pm-on { color: #16a34a; font-size: 11px; font-weight: 700; }
.bench-title { margin: 16px 0 4px; font-size: 15px; }
.bench { list-style: none; padding: 0; margin: 0; font-size: 14px; }
.bench li { display: flex; align-items: center; gap: 6px; padding: 4px 0; border-top: 1px solid var(--line); color: var(--muted); }
.bench li.used { color: var(--text); }
.bench .bn { flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
@media (max-width: 480px) { .pm-name { font-size: 10.5px; } .pm-num { width: 22px; height: 22px; font-size: 11px; } }
@media (max-width: 480px) { .pitch { aspect-ratio: 60 / 100; } }

/* 뒤로가기 · 벤치 접기 */
.back-link { display: inline-block; margin: 2px 0 10px; font-size: 14px; font-weight: 600; color: var(--muted); }
.back-link:hover { color: var(--text); }
.bench-wrap { margin-top: 12px; }
.bench-wrap summary { cursor: pointer; font-size: 14px; font-weight: 700; color: var(--accent); padding: 6px 0; list-style: none; }
.bench-wrap summary::-webkit-details-marker { display: none; }
.bench-wrap summary::after { content: ' ▾'; }
.bench-wrap[open] summary::after { content: ' ▴'; }
.lineup-card { margin-top: 12px; }

/* 광고: 좌우 사이드 (1200px 이상에서만) + 맨 아래 */
.page-grid { display: grid; grid-template-columns: 1fr minmax(0, 760px) 1fr; }
.page-grid > .wrap { grid-column: 2; width: 100%; box-sizing: border-box; }
.rail { display: none; }
@media (min-width: 1200px) {
  .rail { display: block; padding: 16px 20px; }
  .rail-left { grid-column: 1; justify-self: end; } .rail-right { grid-column: 3; justify-self: start; }
  .rail .ad-slot { position: sticky; top: 76px; width: 160px; min-height: 600px; margin: 0; }
}

/* 헤더 뒤로가기 */
.hdr-back { font-size: 20px; font-weight: 700; line-height: 1; padding: 4px 8px 4px 0; margin-right: -4px; color: var(--text); align-self: center; }

/* FN 랭킹 가독성 */
.rk-tabs .chip.on { background: var(--accent); border-color: var(--accent); color: #062b27; }
.rk-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; }
.rk-toggle { display: none; }
.rk h3 { font-size: 16px; margin: 4px 0 2px; }
.rk-note { font-size: 12.5px; }
.rk-list li { padding: 10px 4px; border-radius: 8px; }
.rk-list li.pod { background: color-mix(in srgb, var(--accent) 7%, transparent); border-top-color: transparent; margin-bottom: 4px; }
.rk-list li.pod .rk-n { color: var(--accent); font-size: 17px; }
.rk-name b { font-size: 15.5px; }
.rk-name small { font-size: 12.5px; display: flex; align-items: center; gap: 5px; }
.rk-name small .dot { width: 8px; height: 8px; flex: none; }
.rk-v .rating { font-size: 14px; padding: 2px 8px; }
.rk-swing .rk-v { font-size: 17px; }
.rk-bar { display: block; height: 4px; margin-top: 6px; background: var(--chip); border-radius: 2px; overflow: hidden; }
.rk-bar i { display: block; height: 100%; background: var(--accent); border-radius: 2px; }
@media (max-width: 640px) {
  .rk-cols { grid-template-columns: 1fr; gap: 0; }
  .rk-toggle { display: flex; gap: 6px; margin: 4px 0 10px; }
  .rk-toggle button { flex: 1; font: inherit; font-size: 14px; font-weight: 700; padding: 8px; border-radius: 10px; border: 1px solid var(--line); background: var(--card); color: var(--muted); cursor: pointer; }
  .rk-toggle button.on { background: var(--accent); border-color: var(--accent); color: #062b27; }
  .rk-col { display: none; } .rk-col.on { display: block; }
  .rk-col h3 { display: none; }
}

/* ── 넓은 화면: 본문 폭을 넓히고 2단 구성 ── */
.wrap { max-width: 1180px; }
.page-grid { grid-template-columns: 1fr minmax(0, 1180px) 1fr; }
.rail { display: none !important; }
@media (min-width: 1600px) {
  .rail { display: block !important; padding: 16px 20px; }
  .rail .ad-slot { position: sticky; top: 76px; width: 160px; min-height: 600px; margin: 0; }
}

/* 홈 */
.home-grid { display: grid; grid-template-columns: minmax(0, 1fr) 380px; gap: 8px 28px; align-items: start; }
.home-grid .hero { grid-column: 1 / -1; }
.home-side { position: sticky; top: 76px; }
.list-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.list-grid .list-card { margin: 0; }
.rk-compact .rk-cols { grid-template-columns: 1fr; gap: 0; }
.rk-compact .rk-toggle { display: flex; gap: 6px; margin: 4px 0 10px; }
.rk-compact .rk-toggle button { flex: 1; font: inherit; font-size: 13px; font-weight: 700; padding: 7px; border-radius: 10px; border: 1px solid var(--line); background: var(--card); color: var(--muted); cursor: pointer; }
.rk-compact .rk-toggle button.on { background: var(--accent); border-color: var(--accent); color: #062b27; }
.rk-compact .rk-col { display: none; } .rk-compact .rk-col.on { display: block; } .rk-compact .rk-col h3 { display: none; }

/* 경기 페이지: 왼쪽 리뷰·기록 / 오른쪽 라인업·FN 스코어·평점 */
.match-grid { display: grid; grid-template-columns: minmax(0, 1fr) 420px; gap: 0 24px; align-items: start; margin-top: 12px; }
.m-side .card { margin-top: 0; margin-bottom: 12px; }
.m-side .two-col { grid-template-columns: 1fr; }
.m-side .fn-grid { grid-template-columns: 1fr; }
.lineup-card { margin-top: 0; }

/* 리뷰 본문 가독성 */
.review h1 { font-size: 28px; line-height: 1.3; letter-spacing: -0.02em; word-break: keep-all; }
.review .summary { font-size: 17px; }
.review .para h3 { font-size: 18px; margin: 26px 0 6px; letter-spacing: -0.01em; word-break: keep-all; }
.review .para p, .review > p { font-size: 16.5px; line-height: 1.85; margin: 0 0 6px; word-break: keep-all; }
.review strong { color: var(--text); background: linear-gradient(transparent 62%, color-mix(in srgb, var(--accent) 30%, transparent) 62%); font-weight: 700; }

/* 모바일 하단 탭 바 (PC에선 숨김) */
.tabbar { display: none; }

@media (max-width: 1023px) {
  .home-grid, .match-grid { display: flex; flex-direction: column; gap: 0; }
  .home-side { position: static; margin-bottom: 8px; } .home-grid .hero { order: 0; } /* 목록·랭킹 순서는 아래 (max-width: 1023px) 블록: 목록 1, 랭킹 2 */
  .m-main, .m-side { display: contents; }
  .lineup-card { order: -1; } .m-main > * { order: 0; } .m-side > *:not(.lineup-card) { order: 1; }
  .m-side .two-col { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 640px) {
  .list-grid { grid-template-columns: 1fr; }
  .m-side .two-col { grid-template-columns: 1fr; }
  .hero h1 { font-size: 22px; }
  .hero p { font-size: 14px; }
  .hero .chips { flex-wrap: nowrap; overflow-x: auto; margin: 0 -16px; padding: 0 16px 4px; scrollbar-width: none; }
  .hero .chips::-webkit-scrollbar { display: none; }
  .hero .chip { flex: none; }
  .review h1 { font-size: 23px; }
  .review .para p { font-size: 16px; }
  .site-header .nav-link { display: none; }
  .tabbar { display: flex; position: fixed; left: 0; right: 0; bottom: 0; z-index: 20; background: var(--card); border-top: 1px solid var(--line); padding: 6px 4px calc(6px + env(safe-area-inset-bottom)); }
  .tabbar a { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 1px; font-size: 11px; font-weight: 600; color: var(--muted); }
  .tabbar a b { font-size: 17px; line-height: 1.1; }
  .tabbar a.on { color: var(--accent); }
  body { padding-bottom: 64px; }
}
@media (min-width: 1024px) {
  .home-list { grid-column: 1; grid-row: 2; }
  .home-side { grid-column: 2; grid-row: 2; }
  .m-side .pitch { aspect-ratio: 60 / 100; }
}
@media (max-width: 1023px) { .home-grid, .match-grid { align-items: stretch; } }
.crest { width: 56px; height: 56px; font-size: 15px; font-weight: 900; letter-spacing: -0.02em; box-shadow: 0 2px 8px rgb(0 0 0 / .15), inset 0 0 0 3px rgb(255 255 255 / .25); }
.logo { box-shadow: inset 0 0 0 1px rgb(45 212 191 / .35); }

/* 3초 요약 (스코어보드 하단) */
.quick { margin-top: 14px; padding-top: 14px; border-top: 1px solid color-mix(in srgb, var(--line) 70%, transparent); text-align: center; }
.q-verdict { margin: 0 0 10px; font-size: 16px; font-weight: 700; line-height: 1.5; word-break: keep-all; }
.q-chips { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; }
.q-chip { display: inline-flex; align-items: center; gap: 6px; background: var(--card); border: 1px solid var(--line); border-radius: 999px; padding: 5px 12px; font-size: 13px; }
.q-chip em { font-style: normal; color: var(--muted); font-size: 12px; }
.q-chip .rating { font-size: 12px; padding: 0 6px; }
.q-chip .sw { color: var(--accent); font-weight: 800; }

/* 바로가기 탭 */
.jump { position: sticky; top: 57px; z-index: 9; display: flex; gap: 4px; margin: 10px 0 0; padding: 6px; background: color-mix(in srgb, var(--bg) 88%, transparent); backdrop-filter: blur(8px); border-radius: 12px; }
.jump a { flex: 1; text-align: center; font-size: 14px; font-weight: 700; padding: 7px 0; border-radius: 9px; color: var(--muted); }
.jump a:hover { background: var(--card); color: var(--text); }
[id] { scroll-margin-top: 120px; }

/* 즐겨찾기 */
.fav { background: none; border: none; cursor: pointer; font-size: 18px; color: var(--muted); padding: 0 2px; line-height: 1; }
.fav.on { color: #facc15; }
.scoreboard .team + .fav { margin-top: -4px; }
#my-teams { margin-bottom: 8px; }

/* 브리프 경기 한 줄 행 */
.rows-title { font-size: 15px; margin: 22px 0 8px; color: var(--muted); }
.list-rows { background: var(--card); border: 1px solid var(--line); border-radius: 14px; overflow: hidden; }
.list-row { display: grid; grid-template-columns: 110px minmax(0, 1fr) 48px minmax(0, 1fr) 190px; align-items: center; gap: 8px; padding: 10px 14px; border-top: 1px solid var(--line); font-size: 14px; }
.list-row:first-child { border-top: none; }
.list-row:hover { background: color-mix(in srgb, var(--accent) 6%, transparent); }
.lr-comp { font-size: 12px; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lr-h { text-align: right; } .lr-h, .lr-a { font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: flex; align-items: center; gap: 6px; }
.lr-h { justify-content: flex-end; }
.lr-s { text-align: center; font-size: 15px; font-variant-numeric: tabular-nums; }
.lr-mom { font-size: 12px; color: var(--muted); text-align: right; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lr-mom .rating { font-size: 11px; padding: 0 5px; }
@media (max-width: 640px) {
  .list-row { grid-template-columns: minmax(0, 1fr) 42px minmax(0, 1fr); row-gap: 2px; }
  .lr-comp { grid-column: 1 / -1; } .lr-mom { grid-column: 1 / -1; text-align: center; }
  .jump { top: 53px; }
}
.team-wrap { position: relative; display: flex; flex-direction: column; align-items: center; }
.team-wrap .fav { position: absolute; top: 0; right: calc(50% - 46px); font-size: 16px; }

/* 선수·팀 페이지 */
.plink { color: inherit; text-decoration: none; border-bottom: 1px dotted color-mix(in srgb, var(--muted) 60%, transparent); }
.plink:hover { color: var(--accent); }
.profile-head { display: flex; align-items: center; gap: 14px; margin: 8px 0 14px; }
.profile-head h1 { margin: 0 0 2px; font-size: 26px; letter-spacing: -0.02em; }
.profile-head .crest { flex: none; }
.tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap: 10px; margin-bottom: 12px; }
.tile { background: var(--card); border: 1px solid var(--line); border-radius: 14px; padding: 12px 14px; display: flex; flex-direction: column; gap: 2px; }
.tile span { font-size: 12px; color: var(--muted); } .tile b { font-size: 22px; font-variant-numeric: tabular-nums; } .tile small { font-size: 12px; color: var(--muted); }
.tile .rating { font-size: 18px; padding: 0 8px; }
.bars { display: flex; gap: 6px; align-items: flex-end; overflow-x: auto; padding-bottom: 4px; }
.bar-col { flex: 1 0 34px; max-width: 56px; display: flex; flex-direction: column; align-items: center; gap: 4px; color: inherit; }
.bar-v { font-size: 11px; font-weight: 700; font-variant-numeric: tabular-nums; }
.bar-track { width: 100%; height: 140px; background: var(--chip); border-radius: 6px; display: flex; align-items: flex-end; justify-content: center; gap: 2px; overflow: hidden; }
.bar-track i { display: block; width: 100%; border-radius: 6px 6px 0 0; }
.bars.two .bar-track i { width: 45%; }
.bar-track i.r-top { background: #047857; } .bar-track i.r-good { background: #16a34a; } .bar-track i.r-mid { background: #6b7280; } .bar-track i.r-low { background: #d97706; }
.bar-track i.xgf, .legend-row i.xgf { background: var(--accent); } .bar-track i.xga, .legend-row i.xga { background: #94a3b8; }
.bar-track.na { align-items: center; color: var(--muted); font-size: 14px; background: repeating-linear-gradient(135deg, var(--chip) 0 6px, transparent 6px 10px); }
.bar-v.res-w { color: #16a34a; } .bar-v.res-l { color: #dc2626; } .bar-v.res-d { color: var(--muted); }
.bar-l { font-size: 10.5px; color: var(--muted); font-weight: 700; }
.legend-row { display: flex; gap: 14px; font-size: 12px; color: var(--muted); margin-top: 8px; }
.legend-row i { display: inline-block; width: 10px; height: 10px; border-radius: 3px; margin-right: 5px; vertical-align: -1px; }
.table-wrap { overflow-x: auto; }
.log td, .log th { white-space: nowrap; }
.res { font-weight: 800; font-variant-numeric: tabular-nums; } .res-W { color: #16a34a; } .res-L { color: #dc2626; } .res-D { color: var(--muted); }
.mom-tag { font-size: 10px; font-weight: 800; color: var(--accent); }
.log .sw { color: var(--accent); font-weight: 700; }

/* 시즌 기록 */
.badge { font-size: 11px; font-weight: 800; padding: 2px 8px; border-radius: 999px; background: color-mix(in srgb, var(--accent) 18%, transparent); color: var(--accent); vertical-align: middle; margin-left: 6px; }
.badge.muted { background: var(--chip); color: var(--muted); }
.standings-table td, .standings-table th { text-align: center; font-variant-numeric: tabular-nums; }
.standings-table td.tm { text-align: left; white-space: nowrap; }
.standings-table .tm-in { display: inline-flex; align-items: center; gap: 8px; }
.standings-table th:nth-child(2) { text-align: left; }
.standings-table { width: 100%; }
.mini-crest { display: inline-grid; place-items: center; width: 30px; height: 18px; border-radius: 4px; font-size: 9.5px; font-weight: 900; color: #fff; flex: none; }

/* 라운드·팀 필터 */
.filter-bar { display: flex; gap: 8px; flex-wrap: wrap; margin: 4px 0 12px; }
.filter-bar select { font: inherit; font-size: 14px; font-weight: 600; padding: 8px 32px 8px 12px; border-radius: 10px; border: 1px solid var(--line); background: var(--card); color: var(--text);
  appearance: none; background-image: linear-gradient(45deg, transparent 50%, var(--muted) 50%), linear-gradient(135deg, var(--muted) 50%, transparent 50%);
  background-position: calc(100% - 16px) 55%, calc(100% - 11px) 55%; background-size: 5px 5px; background-repeat: no-repeat; max-width: 100%; }
@media (max-width: 640px) { .filter-bar select { flex: 1 1 140px; } }

/* 다른 언어 안내 띠 (브라우저 언어와 페이지 언어가 다를 때) */
.lang-hint { position: fixed; left: 50%; transform: translateX(-50%); bottom: 16px; z-index: 30; display: flex; align-items: center; gap: 10px; background: var(--text); color: var(--bg); border-radius: 999px; padding: 8px 10px 8px 16px; font-size: 14px; font-weight: 700; box-shadow: 0 6px 20px rgb(0 0 0 / .25); }
.lang-hint a { color: inherit; }
.lang-hint button { background: none; border: none; color: inherit; font-size: 18px; cursor: pointer; opacity: .7; }
@media (max-width: 640px) { .lang-hint { bottom: 76px; } }
.lang-hint[hidden] { display: none; }
.notfound { text-align: center; padding: 80px 16px; } .notfound h1 { font-size: 56px; margin: 0; }

/* 리뷰 반영: PC 헤더 메뉴 */
.hdr-nav { margin-left: auto; display: flex; gap: 4px; }
.hdr-nav a { font-size: 14px; font-weight: 700; padding: 8px 10px; border-radius: 8px; color: var(--muted); }
.hdr-nav a:hover { color: var(--text); background: var(--chip); }
.hdr-nav + .lang-switch { margin-left: 8px; }
@media (max-width: 640px) { .hdr-nav { display: none; } .lang-switch { margin-left: auto; } }
/* 모바일 홈: 경기 목록 먼저, 랭킹은 그 다음 */
@media (max-width: 1023px) { .home-list { order: 1; } .home-side { order: 2; margin-top: 12px; } }
/* 터치 영역 */
.fav { min-width: 32px; min-height: 32px; display: inline-grid; place-items: center; }
.team-wrap .fav { right: calc(50% - 52px); top: -6px; }
.site-footer nav a { display: inline-block; padding: 6px 2px; }
.lang-switch { padding: 6px 12px; }
/* 라이트 모드에서 연한 팀색 글자가 흰 바탕에 묻히지 않게 */
:root { --home-ink: color-mix(in srgb, var(--home) 72%, #000); --away-ink: color-mix(in srgb, var(--away) 72%, #000); }
@media (prefers-color-scheme: dark) { :root { --home-ink: color-mix(in srgb, var(--home) 55%, #fff); --away-ink: color-mix(in srgb, var(--away) 55%, #fff); } }
.crest, .mini-crest, .pm-num { text-shadow: 0 1px 2px rgb(0 0 0 / .45); }

.standings-table tr.z-ucl td:first-child { box-shadow: inset 3px 0 0 var(--accent); }
.standings-table tr.z-rel td:first-child { box-shadow: inset 3px 0 0 #dc2626; }

/* 모바일 경기 페이지 탭 (리뷰 | 라인업 | 기록 | 선수) */
@media (max-width: 1023px) {
  .lineup-card { order: 0; }
  .match-grid.tabbed [data-tab]:not(.tab-on) { display: none; }
  .jump a.on { background: var(--accent); color: #062b27; }
}

/* 검색 */
.search-btn { background: none; border: 1px solid var(--line); border-radius: 999px; width: 34px; height: 34px; font-size: 18px; line-height: 1; color: var(--text); cursor: pointer; margin-left: 8px; }
.hdr-nav + .search-btn { margin-left: 8px; }
@media (max-width: 640px) { .search-btn { margin-left: auto; } .search-btn + .lang-switch { margin-left: 6px; } }
.search-box { position: fixed; inset: 0; z-index: 50; background: rgb(0 0 0 / .45); display: flex; justify-content: center; align-items: flex-start; padding: 70px 12px 12px; }
.search-box[hidden] { display: none; }
.search-inner { width: 100%; max-width: 560px; background: var(--card); border: 1px solid var(--line); border-radius: 16px; padding: 12px; box-shadow: 0 20px 50px rgb(0 0 0 / .35); }
.search-inner input { width: 100%; box-sizing: border-box; font: inherit; font-size: 16px; padding: 12px 14px; border-radius: 10px; border: 1px solid var(--line); background: var(--bg); color: var(--text); }
.search-results { list-style: none; margin: 8px 0 0; padding: 0; max-height: 60vh; overflow-y: auto; }
.search-results a { display: flex; justify-content: space-between; gap: 10px; padding: 10px 8px; border-radius: 8px; }
.search-results a:hover { background: var(--chip); }
.search-results small { color: var(--muted); font-size: 12px; white-space: nowrap; }
.search-results .none { padding: 10px 8px; color: var(--muted); }
.search-hint { margin: 8px 4px 0; font-size: 12px; color: var(--muted); }

.team-status { display: flex; flex-wrap: wrap; gap: 8px; margin: -4px 0 12px; }
.team-status span { background: var(--card); border: 1px solid var(--line); border-radius: 999px; padding: 6px 12px; font-size: 13px; font-weight: 600; }

/* 시즌 하이라이트 */
.hl-list { display: grid; gap: 6px; margin: 4px 0 12px; }
.hl { display: grid; grid-template-columns: 110px repeat(3, minmax(0, 1fr)); gap: 8px; align-items: center; padding: 8px 10px; border-radius: 10px; background: color-mix(in srgb, var(--chip) 60%, transparent); font-size: 13px; }
.hl:hover { background: var(--chip); }
.hl b { font-size: 13px; }
.hl span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: var(--muted); }
@media (max-width: 640px) { .hl { grid-template-columns: 1fr 1fr; } .hl b { grid-column: 1 / -1; } }
@media (max-width: 640px) { .hl span:last-child { grid-column: 1 / -1; } }

/* 모바일 선수 평점표: 출전 시간 열은 숨기고 행을 넉넉하게 */
@media (max-width: 480px) {
  .m-side table.ratings:not(.log) th:nth-child(2), .m-side table.ratings:not(.log) td:nth-child(2) { display: none; }
  .m-side table.ratings td, .m-side table.ratings th { padding-top: 8px; padding-bottom: 8px; font-size: 14px; }
  .m-side table.ratings td:first-child { max-width: 150px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
}
.ratings th { white-space: nowrap; }

/* 헤더: 본문과 같은 폭으로 가운데 정렬, 메뉴·검색·언어는 오른쪽에 한 묶음 */
.site-header { display: block; padding: 0; }
.hdr-in { max-width: 1180px; margin: 0 auto; display: flex; align-items: center; gap: 12px; padding: 12px 16px; box-sizing: border-box; }
.hdr-in .hdr-nav { margin-left: auto; }
.hdr-in .search-btn { margin-left: 4px; }
.hdr-in .lang-switch { margin-left: 4px; }
@media (max-width: 640px) { .hdr-in { gap: 8px; } .hdr-in .search-btn { margin-left: auto; } }
/* 날짜 제목 간격 */
.day-title { margin: 26px 0 10px; }
.day-group:first-of-type .day-title { margin-top: 8px; }
.nb { white-space: nowrap; }
.break-notice { margin: 14px 0 0; padding: 10px 14px; border-radius: 12px; background: color-mix(in srgb, var(--accent) 12%, transparent); font-size: 14px; font-weight: 600; }
.small { font-size: 12.5px; line-height: 1.5; }

.search-row { display: flex; gap: 8px; align-items: center; }
.search-row input { flex: 1; }
.search-close { flex: none; width: 44px; height: 44px; border-radius: 10px; border: 1px solid var(--line); background: var(--chip); color: var(--text); font-size: 18px; cursor: pointer; }
.tabbar { transition: transform .2s ease; }
.tabbar.hide { transform: translateY(110%); }

.ai-byline { margin: -4px 0 12px; font-size: 12.5px; color: var(--muted); }
.ai-byline a { color: inherit; text-decoration: underline; }

.part .pavg { grid-column: 1 / -1; font-size: 11px; color: var(--muted); margin-top: -2px; }

.site-footer .foot-method { display: block; max-width: 560px; margin: 0 auto 14px; padding: 12px 14px; border: 1px solid var(--line); border-radius: 12px; background: var(--card); color: var(--text); font-weight: 600; font-size: 14px; text-decoration: none; }

.chip-sep { display: inline-block; width: 1px; height: 22px; background: var(--line); margin: 0 4px; align-self: center; }

/* ── 3차 QA 반영 ── */
/* 활성 탭·칩 글자: 라이트 모드는 흰 글자(대비 확보), 다크 모드는 진한 글자 */
:root { --on-accent: #ffffff; }
@media (prefers-color-scheme: dark) { :root { --on-accent: #062b27; } }
.rk-tabs .chip.on, .rk-toggle button.on, .rk-compact .rk-toggle button.on, .jump a.on { color: var(--on-accent); }
/* FN 기대승점 장면 행: 모바일에서도 득점·도움 몫과 이름이 잘리지 않게 줄바꿈 */
.swing-row .sw-name, .swing-row .sw-kind { white-space: normal; overflow: visible; text-overflow: clip; word-break: keep-all; overflow-wrap: break-word; }
/* 랭킹 빈 상태 안내는 그리드가 아닌 한 줄 문단으로 */
.rk-list li.rk-empty { display: block; color: var(--muted); font-size: 14px; padding: 12px 4px; border-top: 0; }
/* 한국어는 단어 중간에서 줄바꿈하지 않음 (너무 긴 단어만 예외) */
html[lang="ko"] body { word-break: keep-all; overflow-wrap: break-word; }
/* 스코어보드: 팀 이름이 두 줄이어도 엠블럼 높이가 같게 */
.teams { align-items: start; }
.teams .score { align-self: start; line-height: 48px; }
/* 검색창: 브라우저 기본 지우기 버튼 숨김 (사이트 ✕와 중복) */
.search-inner input::-webkit-search-cancel-button { -webkit-appearance: none; appearance: none; }
.stat-bar.empty { background: var(--chip); }