:root {
  --ink: #f2ecdf;
  --muted: #aaa99f;
  --paper: #151715;
  --white: #1e211e;
  --green-950: #111311;
  --green-800: #b9cfb8;
  --green-600: #9db59f;
  --lime: #d2c39f;
  --red: #e8897c;
  --amber: #d4aa67;
  --line: #393e39;
  --shadow: 0 18px 52px rgba(0, 0, 0, .28);
}

* { box-sizing: border-box; }
html { background: var(--paper); color: var(--ink); color-scheme: dark; font-family: "DM Sans", sans-serif; }
body { margin: 0; min-width: 320px; overflow-x: hidden; }
button, input { font: inherit; }
button { cursor: pointer; }
button:focus-visible, input:focus-visible { outline: 2px solid var(--green-600); outline-offset: 3px; }
::selection { background: var(--green-600); color: #111311; }
::-webkit-scrollbar { height: 10px; width: 10px; }
::-webkit-scrollbar-thumb { background: #4a504a; border: 2px solid var(--paper); }
::-webkit-scrollbar-track { background: var(--paper); }

.masthead { background: #111311; color: var(--ink); min-height: 280px; overflow: visible; position: relative; }
.masthead::after { background: var(--green-600); content: ""; height: 4px; inset: auto 0 0; position: absolute; }
.masthead-inner { align-items: flex-end; display: flex; justify-content: space-between; margin: 0 auto; max-width: 1180px; min-height: 280px; padding: 48px 30px 52px; position: relative; z-index: 3; }
.eyebrow { color: var(--green-600); font-size: 11px; font-weight: 700; letter-spacing: .14em; margin: 0 0 9px; text-transform: uppercase; }
.eyebrow.dark { color: var(--green-600); }
h1, h2 { font-family: "Newsreader", Georgia, serif; font-weight: 600; letter-spacing: -.025em; margin: 0; text-transform: none; }
h1 { font-size: clamp(54px, 8vw, 94px); line-height: .88; }
h1 strong { color: var(--lime); font-style: italic; font-weight: 500; }
h2 { font-size: 38px; line-height: 1; }
.subhead { color: #b8b9b0; font-size: 16px; margin: 18px 0 0; max-width: 560px; }
.pitch-lines { border: 1px solid rgba(210,195,159,.11); border-radius: 50%; height: 460px; position: absolute; right: 4%; top: -180px; width: 460px; }
.pitch-lines::before, .pitch-lines::after, .pitch-lines span { border: 1px solid rgba(210,195,159,.08); content: ""; position: absolute; }
.pitch-lines::before { height: 100%; left: 50%; top: 0; }
.pitch-lines::after { border-radius: 50%; height: 100px; left: calc(50% - 50px); top: calc(50% - 50px); width: 100px; }
.pitch-lines span { height: 100%; left: -220px; top: 0; width: 900px; }
.update-status { align-items: center; color: var(--muted); display: inline-flex; gap: 8px; margin-top: 17px; }
.update-status > div { align-items: baseline; display: flex; flex-wrap: wrap; gap: 4px 7px; }
.update-status span:not(.status-dot) { color: #9a9d95; font-size: 9px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
.update-status strong { color: #c1c3ba; font-size: 10px; font-weight: 600; }
.update-status small { color: #7f827b; font-size: 8px; }
.header-actions { align-items: flex-end; display: flex; flex-direction: column; gap: 8px; }
.account-control { min-width: 250px; }
.account-sign-in { align-items: center; background: #252925; border: 1px solid #465047; color: var(--ink); display: flex; font-size: 10px; font-weight: 700; justify-content: center; min-height: 38px; padding: 8px 14px; text-decoration: none; text-transform: uppercase; }
.account-sign-in:hover { background: #303530; border-color: var(--green-600); }
.account-sign-in[hidden], .account-user[hidden] { display: none; }
.account-user { position: relative; }
.account-menu-trigger { align-items: center; background: #1b1e1b; border: 1px solid #465047; color: var(--ink); display: flex; gap: 9px; min-height: 46px; padding: 6px 10px; text-align: left; width: 100%; }
.account-menu-trigger:hover, .account-menu-trigger[aria-expanded="true"] { background: #252925; border-color: var(--green-600); }
.account-online { background: #83cc93; border-radius: 50%; box-shadow: 0 0 0 4px rgba(131,204,147,.12); flex: 0 0 auto; height: 7px; width: 7px; }
.account-avatar { align-items: center; background: #344038; border: 1px solid #57675a; border-radius: 50%; color: #d7ead3; display: flex; flex: 0 0 auto; font-family: "Newsreader", Georgia, serif; font-size: 16px; height: 30px; justify-content: center; width: 30px; }
.account-identity { min-width: 0; }
.account-identity strong { display: block; font-size: 10px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.account-identity small { color: var(--muted); display: block; font-size: 8px; margin-top: 2px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.account-chevron { border-bottom: 1px solid var(--muted); border-right: 1px solid var(--muted); flex: 0 0 auto; height: 7px; margin-left: auto; margin-right: 3px; transform: rotate(45deg) translateY(-2px); transition: transform .18s ease; width: 7px; }
.account-menu-trigger[aria-expanded="true"] .account-chevron { transform: rotate(225deg) translate(-2px, -1px); }
.account-menu { background: #202420; border: 1px solid #465047; box-shadow: 0 14px 30px rgba(0,0,0,.35); left: 0; margin-top: 5px; padding: 5px; position: absolute; right: 0; top: 100%; z-index: 20; }
.account-menu[hidden] { display: none; }
.account-menu button, .account-menu a { background: transparent; border: 0; color: var(--ink); display: block; font-size: 9px; font-weight: 700; padding: 10px 11px; text-align: left; text-decoration: none; text-transform: uppercase; width: 100%; }
.account-menu button:hover, .account-menu a:hover { background: #303630; color: #d7ead3; }
.account-menu a { border-top: 1px solid var(--line); color: var(--muted); }
.account-toast { align-items: center; background: #252b26; border: 1px solid #66836c; box-shadow: 0 14px 38px rgba(0,0,0,.34); color: var(--ink); display: flex; gap: 10px; opacity: 0; padding: 12px 16px; position: fixed; right: 22px; top: 22px; transform: translateY(-10px); transition: opacity .2s ease, transform .2s ease; z-index: 1000; }
.account-toast.is-visible { opacity: 1; transform: translateY(0); }
.account-toast span { align-items: center; background: #405747; border-radius: 50%; color: #d9eadb; display: flex; font-size: 11px; height: 22px; justify-content: center; width: 22px; }
.account-toast strong { font-size: 11px; letter-spacing: .02em; }
.status-dot { background: var(--green-600); border-radius: 50%; box-shadow: 0 0 0 3px rgba(157,181,159,.1); flex: 0 0 auto; height: 6px; width: 6px; }
.status-dot.is-live { background: var(--amber); box-shadow: 0 0 0 3px rgba(212,170,103,.12); }
.status-dot.is-warning { background: var(--red); box-shadow: 0 0 0 3px rgba(232,137,124,.12); }

main { margin: 0 auto; max-width: 1180px; padding: 0 30px 70px; }
.scoreboard { background: var(--white); box-shadow: var(--shadow); display: grid; grid-template-columns: repeat(4, 1fr); margin-top: -24px; min-height: 124px; position: relative; z-index: 2; }
.scoreboard > div { border-right: 1px solid var(--line); display: flex; flex-direction: column; justify-content: center; padding: 22px 28px; }
.scoreboard > div:last-child { border-right: 0; }
.scoreboard span { color: var(--muted); font-size: 11px; font-weight: 700; text-transform: uppercase; }
.scoreboard strong { font-family: "Newsreader", Georgia, serif; font-size: 28px; font-weight: 600; line-height: 1.15; margin-top: 7px; }
.scoreboard small { color: var(--muted); font-size: 12px; margin-top: 5px; }
.overview-progress { background: #303530; height: 4px; margin-top: 13px; overflow: hidden; width: 100%; }
.overview-progress span { background: var(--green-600); display: block; height: 100%; transition: width .35s ease; width: 0; }
.scoreboard .scoreboard-context { color: var(--lime); font-size: 10px; font-weight: 700; letter-spacing: .04em; margin-top: 9px; text-transform: uppercase; }

.view-tabs { border-bottom: 1px solid var(--line); display: flex; gap: 28px; margin-top: 42px; overflow-x: auto; }
.tab { background: transparent; border: 0; color: var(--muted); flex: 0 0 auto; font-size: 13px; font-weight: 700; padding: 15px 2px; position: relative; text-transform: uppercase; }
.tab.is-active { color: var(--ink); }
.tab.is-active::after { background: var(--green-600); bottom: -1px; content: ""; height: 3px; left: 0; position: absolute; right: 0; }
.view { display: none; }
.view.is-active { display: block; }
.section-heading { align-items: end; display: flex; justify-content: space-between; padding: 38px 0 22px; }
.live-standings-note { align-items: center; color: #e0b974; display: inline-flex; font-size: 10px; font-weight: 700; gap: 6px; margin: 10px 0 0; text-transform: uppercase; }
.live-standings-note::before { background: var(--amber); border-radius: 50%; box-shadow: 0 0 0 4px rgba(217,153,43,.15); content: ""; height: 7px; width: 7px; }
.live-standings-note[hidden] { display: none; }
.leaderboard-tools { align-items: center; display: flex; gap: 14px; }
.provisional-toggle { align-items: center; color: var(--muted); cursor: pointer; display: flex; font-size: 10px; font-weight: 700; gap: 9px; line-height: 1.3; max-width: 210px; text-transform: uppercase; }
.provisional-toggle input { opacity: 0; pointer-events: none; position: absolute; }
.toggle-track { background: #343934; border: 1px solid #4a504a; border-radius: 999px; display: block; flex: 0 0 auto; height: 22px; padding: 2px; transition: background .18s ease, border-color .18s ease; width: 40px; }
.toggle-track span { background: #8f9189; border-radius: 50%; display: block; height: 16px; transform: translateX(0); transition: background .18s ease, transform .18s ease; width: 16px; }
.provisional-toggle input:checked + .toggle-track { background: #3e5943; border-color: var(--green-600); }
.provisional-toggle input:checked + .toggle-track span { background: #d7ead3; transform: translateX(16px); }
.provisional-toggle input:focus-visible + .toggle-track { outline: 2px solid var(--green-600); outline-offset: 3px; }
.leaderboard-live-matches { border: 1px solid #47664d; margin-bottom: 18px; padding: 14px; }
.leaderboard-live-matches[hidden] { display: none; }
.live-matches-heading { align-items: center; display: flex; justify-content: space-between; margin-bottom: 10px; }
.live-matches-heading h3 { align-items: center; display: flex; font-size: 11px; gap: 8px; letter-spacing: .08em; margin: 0; text-transform: uppercase; }
.live-matches-heading h3 b { font: inherit; }
.live-matches-heading h3 span { background: #83cc93; border-radius: 50%; box-shadow: 0 0 0 5px rgba(131,204,147,.12); height: 7px; width: 7px; }
.live-matches-heading small { color: var(--muted); font-size: 9px; font-weight: 700; text-transform: uppercase; }
.leaderboard-live-grid { display: grid; gap: 10px; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); }
.leaderboard-live-card { background: #1a1d1a; border: 1px solid var(--line); color: var(--ink); padding: 12px 14px; text-align: left; transition: background .15s ease, border-color .15s ease; }
.leaderboard-live-card:hover { background: #252925; border-color: #657066; }
.live-card-meta { align-items: center; color: var(--muted); display: flex; font-size: 9px; font-weight: 700; justify-content: space-between; margin-bottom: 7px; text-transform: uppercase; }
.live-card-meta strong { color: #b8d9bc; }
.leaderboard-live-card > small { color: #b8d9bc; display: block; font-size: 9px; font-weight: 700; margin-top: 7px; text-transform: uppercase; }
.leaderboard-live-card .pick-distribution { margin-top: 10px; padding-top: 9px; }
.leaderboard-live-card .distribution-bar { height: 7px; }
.leaderboard-live-matches.is-upcoming { border-color: #665b43; }
.leaderboard-live-matches.is-upcoming .live-matches-heading h3 span { background: var(--amber); box-shadow: 0 0 0 5px rgba(212,170,103,.12); }
.leaderboard-live-matches.is-upcoming .live-card-meta strong { color: var(--lime); }
.leaderboard-live-card > .kickoff-countdown { color: var(--lime); font-size: 10px; letter-spacing: .04em; }
.awards-section { margin-bottom: 18px; }
.awards-heading { align-items: flex-end; display: flex; justify-content: space-between; margin-bottom: 12px; }
.awards-heading h3 { font-family: "Newsreader", Georgia, serif; font-size: 25px; margin: 0; }
.awards-heading > span { color: var(--muted); font-size: 9px; font-weight: 700; text-transform: uppercase; }
.awards-grid { display: grid; gap: 8px; grid-template-columns: repeat(5, minmax(0, 1fr)); }
.award-card { align-items: flex-start; background: #1a1d1a; border: 1px solid var(--line); display: grid; gap: 10px; grid-template-columns: auto 1fr; min-width: 0; padding: 12px; }
.award-icon { font-family: "Apple Color Emoji", "Segoe UI Emoji", "Noto Color Emoji", sans-serif; font-size: 20px; line-height: 1; }
.award-card h4 { font-size: 9px; letter-spacing: .06em; line-height: 1.25; margin: 0 0 7px; text-transform: uppercase; }
.award-winners { align-items: center; display: flex; flex-wrap: wrap; font-size: 11px; font-weight: 700; gap: 3px; line-height: 1.3; }
.award-winners button { background: none; border: 0; color: var(--ink); font-weight: 700; padding: 0; text-align: left; }
.award-winners button:hover { color: var(--green-600); text-decoration: underline; }
.award-winners > span { color: var(--muted); }
.award-card p { color: var(--muted); font-size: 9px; line-height: 1.35; margin: 5px 0 0; }
.player-awards { display: inline-flex; gap: 3px; margin-left: 8px; vertical-align: middle; }
.player-award { font-family: "Apple Color Emoji", "Segoe UI Emoji", "Noto Color Emoji", sans-serif; font-size: 13px; line-height: 1; }

.search { align-items: center; background: var(--white); border: 1px solid var(--line); display: flex; height: 42px; padding: 0 13px; width: 230px; }
.search input { background: transparent; border: 0; color: var(--ink); min-width: 0; outline: 0; width: 100%; }
.search input::placeholder { color: #8f9189; opacity: 1; }
.search span:not(.sr-only) { color: var(--muted); font-size: 20px; }
.leaderboard-shell { background: var(--white); border: 1px solid var(--line); overflow-x: auto; }
table { border-collapse: collapse; min-width: 720px; width: 100%; }
th { background: #252925; color: #bebdb3; font-size: 10px; padding: 13px 18px; text-align: left; text-transform: uppercase; }
td { border-top: 1px solid var(--line); padding: 14px 18px; }
tr:first-child td { border-top: 0; }
tbody tr { transition: background .15s ease; }
tbody tr:hover { background: #272b27; }
.number { text-align: right; }
.rank { color: var(--muted); font-family: "Newsreader", Georgia, serif; font-size: 20px; width: 90px; }
.rank.medal { color: var(--green-600); }
.rank-content { align-items: center; display: inline-flex; gap: 7px; }
.rank-medal { font-family: "Apple Color Emoji", "Segoe UI Emoji", "Noto Color Emoji", sans-serif; font-size: 20px; line-height: 1; }
.rank-change { align-items: center; display: inline-flex; font-size: 13px; font-weight: 700; justify-content: flex-end; min-width: 32px; }
.rank-change span { font-size: 17px; line-height: 1; }
.rank-change.gained { color: var(--green-600); }
.rank-change.lost { color: var(--red); }
.rank-change.unchanged { color: var(--amber); }
.player-button { background: none; border: 0; color: var(--ink); font-weight: 700; padding: 0; text-align: left; }
.player-button:hover { color: var(--green-600); text-decoration: underline; }
.points { font-family: "Newsreader", Georgia, serif; font-size: 24px; font-weight: 600; }
.accuracy { color: var(--muted); }

.today-section { border-bottom: 1px solid var(--line); padding-bottom: 36px; }
.today-heading { padding-bottom: 18px; }
.today-date { color: var(--muted); font-size: 12px; font-weight: 700; text-transform: uppercase; }
.today-match-grid { grid-template-columns: repeat(3, 1fr); }
.yesterday-section { border-top: 1px solid var(--line); margin-top: 30px; padding-top: 24px; }
.yesterday-heading { align-items: baseline; display: flex; justify-content: space-between; margin-bottom: 14px; }
.yesterday-heading h3 { font-family: "Newsreader", Georgia, serif; font-size: 24px; font-weight: 600; margin: 0; }
.yesterday-results { display: grid; gap: 8px; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.yesterday-result { background: #1a1d1a; border: 1px solid var(--line); color: var(--ink); padding: 12px 14px; text-align: left; transition: border-color .15s ease, background .15s ease; }
.yesterday-result:hover { background: #252925; border-color: #657066; }
.compact-result-meta { align-items: center; color: var(--muted); display: flex; font-size: 9px; font-weight: 700; justify-content: space-between; margin-bottom: 9px; text-transform: uppercase; }
.compact-result-meta strong { color: var(--green-600); }
.compact-team-row { align-items: center; display: grid; font-size: 12px; gap: 8px; grid-template-columns: 26px 1fr 22px; min-height: 27px; }
.compact-team-row > span:first-child { align-items: center; display: flex; }
.compact-team-row strong { font-family: "Newsreader", Georgia, serif; font-size: 18px; text-align: right; }
.compact-team-name { align-items: flex-start; display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.compact-team-name > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.compact-empty { padding: 16px; }
.no-matches { background: var(--white); border: 1px dashed #4a504a; color: var(--muted); grid-column: 1 / -1; margin: 0; padding: 24px; text-align: center; }
.match-grid { display: grid; gap: 12px; grid-template-columns: repeat(3, 1fr); }
.match-card { background: var(--white); border: 1px solid var(--line); color: var(--ink); min-height: 206px; padding: 17px; text-align: left; transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease; width: 100%; }
.match-card:hover { border-color: #657066; box-shadow: 0 14px 30px rgba(0,0,0,.26); transform: translateY(-2px); }
.match-card:focus-visible { outline: 3px solid rgba(157,181,159,.45); outline-offset: 2px; }
.match-meta { align-items: center; color: var(--muted); display: flex; font-size: 10px; font-weight: 700; justify-content: space-between; text-transform: uppercase; }
.match-status { align-items: center; display: flex; gap: 6px; text-align: right; white-space: nowrap; }
.match-status::before { background: #aeb9b3; border-radius: 50%; content: ""; height: 6px; width: 6px; }
.match-card.finished .match-status { color: var(--green-600); }
.match-card.finished .match-status::before { background: var(--green-600); }
.match-card.live { border-color: #b68c4f; }
.match-card.live .match-status, .match-card.live .team-score { color: #e0b974; }
.match-card.live .match-status::before { background: var(--amber); box-shadow: 0 0 0 4px rgba(217,153,43,.15); }
.team-row { align-items: center; display: grid; gap: 10px; grid-template-columns: 42px 1fr 28px; margin-top: 14px; }
.team-code { align-items: center; background: transparent; display: flex; font-size: 10px; font-weight: 700; height: 28px; justify-content: center; }
.team-flag { display: block; height: 20px; object-fit: cover; width: 26px; }
.team-name { align-items: flex-start; display: flex; flex-direction: column; font-size: 13px; font-weight: 600; gap: 1px; min-width: 0; }
.team-name > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fifa-rank { color: #b3b4ac; flex: 0 0 auto; font-size: 9px; font-weight: 400; letter-spacing: .01em; white-space: nowrap; }
.team-score { font-family: "Newsreader", Georgia, serif; font-size: 22px; text-align: right; }
.live-disclaimer { color: #b8d9bc; font-size: 10px; font-weight: 700; margin: 10px 0 -4px; text-transform: uppercase; }
.pick-distribution { border-top: 1px solid var(--line); margin-top: 14px; padding-top: 12px; }
.distribution-labels { color: var(--muted); display: grid; font-size: 9px; grid-template-columns: repeat(3, 1fr); margin-bottom: 7px; text-transform: uppercase; }
.distribution-labels span:nth-child(2) { text-align: center; }
.distribution-labels span:last-child { text-align: right; }
.distribution-labels strong { color: var(--ink); }
.distribution-labels span { align-items: center; display: flex; gap: 3px; }
.distribution-labels span:nth-child(2) { justify-content: center; }
.distribution-labels span:last-child { justify-content: flex-end; }
.distribution-labels .is-correct { color: var(--green-800); font-weight: 700; }
.distribution-labels .is-correct strong { color: var(--green-800); font-weight: 800; }
.distribution-labels .is-incorrect { color: #858b85; }
.distribution-labels .is-incorrect strong { color: #9aa09a; }
.correct-result-mark { align-items: center; background: var(--green-600); border-radius: 50%; color: #111311; display: inline-flex; font-size: 8px; height: 14px; justify-content: center; margin-left: 2px; width: 14px; }
.distribution-bar { background: #303530; display: flex; height: 8px; overflow: hidden; width: 100%; }
.distribution-bar span { display: block; height: 100%; min-width: 0; }
.distribution-team1 { background: var(--green-600); }
.distribution-draw { background: var(--amber); }
.distribution-team2 { background: var(--lime); }
.pick-distribution.has-result .distribution-bar { background: #2a2e2a; box-shadow: inset 0 0 0 1px #454a45; overflow: visible; }
.pick-distribution.has-result .distribution-bar span { opacity: .28; }
.pick-distribution.has-result .distribution-bar span.is-correct { box-shadow: 0 0 0 2px #111311, 0 0 0 4px #fffdf7, 0 0 16px rgba(255,253,247,.3); opacity: 1; position: relative; z-index: 1; }

dialog { background: var(--white); border: 0; box-shadow: 0 30px 80px rgba(0,0,0,.55); color: var(--ink); height: min(820px, calc(100vh - 24px)); margin: auto 0 auto auto; max-width: 560px; padding: 0; width: calc(100% - 28px); }
dialog::backdrop { background: rgba(5,6,5,.76); }
#player-dialog[open] { display: flex; flex-direction: column; }
.dialog-header { align-items: center; border-bottom: 1px solid var(--line); display: flex; justify-content: space-between; padding: 16px 20px; }
.dialog-header .eyebrow { margin-bottom: 5px; }
.dialog-header h2 { font-size: 31px; }
.dialog-score { color: var(--lime); display: block; font-family: "Newsreader", Georgia, serif; font-size: 24px; line-height: 1; margin-top: 7px; }
.dialog-score[hidden] { display: none; }
.icon-button { align-items: center; background: #2a2e2a; border: 0; color: var(--ink); display: flex; font-size: 25px; height: 36px; justify-content: center; line-height: 1; width: 36px; }
.dialog-summary { background: var(--green-950); color: var(--ink); display: grid; grid-template-columns: repeat(4, 1fr); }
.dialog-summary div { border-right: 1px solid rgba(255,255,255,.14); padding: 10px 14px; }
.dialog-summary div:last-child { border-right: 0; }
.dialog-summary span { color: var(--muted); display: block; font-size: 9px; text-transform: uppercase; }
.dialog-summary strong { display: block; font-family: "Newsreader", Georgia, serif; font-size: 22px; margin-top: 2px; }
.dialog-insights { border-bottom: 1px solid var(--line); display: grid; flex: 0 0 auto; grid-template-columns: 1fr; padding: 1px 0; }
.prediction-highlight { background: #252925; column-gap: 16px; display: grid; grid-template-columns: minmax(0, 1fr) auto; min-height: 0; padding: 10px 18px 12px; }
.prediction-highlight.best { border-top: 2px solid var(--green-600); }
.prediction-label { color: var(--muted); font-size: 8px; font-weight: 700; grid-column: 1 / -1; letter-spacing: .1em; margin: 0 0 6px; text-transform: uppercase; }
.prediction-highlight h3 { font-family: "Newsreader", Georgia, serif; font-size: 17px; line-height: 1.1; margin: 0; }
.prediction-highlight > p:not(.prediction-label) { color: var(--muted); font-size: 10px; line-height: 1.35; margin: 4px 0 0; }
.prediction-highlight strong { align-self: center; color: var(--ink); display: block; font-size: 10px; grid-column: 2; grid-row: 2 / 4; line-height: 1.35; margin: 0; max-width: 190px; text-align: right; }
.prediction-highlight.best strong { color: #c7dec4; }
.prediction-highlight .prediction-empty { margin-top: 24px; }
.rank-history { background: #1a1d1a; border-top: 1px solid var(--line); padding: 10px 18px 5px; }
.rank-history-heading { align-items: flex-start; display: flex; justify-content: space-between; }
.rank-history-heading h3 { font-family: "Newsreader", Georgia, serif; font-size: 16px; margin: -2px 0 0; }
.rank-history-heading > span { color: var(--muted); font-size: 9px; font-weight: 700; margin-top: 2px; text-transform: uppercase; }
.rank-chart { display: block; height: auto; margin-top: 0; overflow: visible; width: 100%; }
.rank-grid { stroke: #343934; stroke-width: 1; vector-effect: non-scaling-stroke; }
.rank-axis-label, .rank-date-label { fill: #8f9189; font-family: "DM Sans", sans-serif; font-size: 8px; }
.rank-line { fill: none; stroke: var(--green-600); stroke-linecap: round; stroke-linejoin: round; stroke-width: 3; vector-effect: non-scaling-stroke; }
.rank-point { fill: #1a1d1a; stroke: var(--green-600); stroke-width: 2; vector-effect: non-scaling-stroke; }
.rank-point.is-current { fill: #fffdf7; stroke: #111311; stroke-width: 2; }
.rank-history-empty { color: var(--muted); font-size: 11px; margin: 24px 0 12px; }
.pick-list { flex: 1 1 auto; height: auto; min-height: 0; overflow-y: auto; padding: 4px 20px 20px; }
.pick-group-title { color: var(--green-600); font-size: 10px; font-weight: 700; margin: 15px 0 5px; text-transform: uppercase; }
.pick-row { align-items: center; border-top: 1px solid var(--line); display: grid; gap: 10px; grid-template-columns: 1fr auto; padding: 7px 0; }
.pick-row:first-of-type { border-top: 0; }
.pick-match { font-size: 12px; font-weight: 600; }
.pick-choice { color: var(--muted); font-size: 10px; margin-top: 2px; }
.pick-result { border: 1px solid var(--line); font-size: 9px; font-weight: 700; min-width: 58px; padding: 4px 6px; text-align: center; text-transform: uppercase; }
.pick-result.correct { background: #26372a; border-color: #47664d; color: #b8d9bc; }
.pick-result.incorrect { background: #3a2725; border-color: #68423e; color: #f0a096; }
.pick-result.live-correct { background: #3a3322; border-color: #705e31; color: #efd08e; }
.pick-result.live-incorrect { background: #392b20; border-color: #704d32; color: #e7af7b; }
.dialog-meta { color: var(--muted); font-size: 11px; margin: 8px 0 0; text-transform: uppercase; }
.match-dialog-distribution { background: var(--green-950); color: var(--ink); padding: 20px 26px; }
.match-dialog-distribution .pick-distribution { border: 0; margin: 0; padding: 0; }
.match-dialog-distribution .distribution-labels { color: var(--muted); font-size: 10px; margin-bottom: 9px; }
.match-dialog-distribution .distribution-labels strong { color: var(--ink); }
.match-dialog-distribution .distribution-labels .is-incorrect, .match-dialog-distribution .distribution-labels .is-incorrect strong { color: #72877e; }
.match-dialog-distribution .distribution-labels .is-correct, .match-dialog-distribution .distribution-labels .is-correct strong { color: #c7dec4; }
.match-dialog-distribution .distribution-bar { height: 12px; }
.match-pick-list { display: grid; gap: 18px; grid-template-columns: repeat(3, minmax(0, 1fr)); height: calc(100% - 190px); overflow-y: auto; padding: 24px 26px 32px; }
.match-pick-column { min-width: 0; }
.match-pick-heading { border-bottom: 2px solid var(--green-600); min-height: 58px; padding-bottom: 10px; }
.match-pick-heading h3 { font-size: 13px; margin: 0; overflow-wrap: anywhere; }
.match-pick-heading span { color: var(--muted); display: block; font-size: 10px; margin-top: 5px; text-transform: uppercase; }
.match-pick-column ul { list-style: none; margin: 0; padding: 0; }
.match-pick-column li { border-bottom: 1px solid var(--line); font-size: 12px; padding: 9px 0; }
.match-pick-column li.muted { color: var(--muted); }
.match-pick-column li.correct-pick { color: var(--green-800); font-weight: 800; }
.match-pick-column li.incorrect-pick { color: #858b85; }
.summary-heading { align-items: flex-end; }
.summary-filters { align-items: flex-end; display: flex; gap: 8px; }
.summary-filters > label:not(.search) { color: var(--muted); display: flex; flex-direction: column; font-size: 9px; font-weight: 700; gap: 4px; text-transform: uppercase; }
.summary-filters select { background: var(--white); border: 1px solid var(--line); color: var(--ink); font: inherit; height: 42px; min-width: 120px; padding: 0 30px 0 11px; }
.summary-list { border: 1px solid var(--line); }
.summary-row { align-items: center; background: var(--white); border: 0; border-bottom: 1px solid var(--line); color: var(--ink); display: grid; gap: 16px; grid-template-columns: 145px minmax(280px, 1fr) 74px 280px; min-height: 82px; padding: 11px 15px; text-align: left; transition: background .15s ease; width: 100%; }
.summary-row:last-child { border-bottom: 0; }
.summary-row:hover { background: #252925; }
.summary-row.live { box-shadow: inset 3px 0 0 #83cc93; }
.summary-meta strong { display: block; font-size: 11px; }
.summary-meta span { color: var(--muted); display: block; font-size: 9px; margin-top: 4px; text-transform: uppercase; }
.summary-fixture { align-items: center; display: grid; gap: 10px; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); }
.summary-team { align-items: center; display: flex; font-size: 12px; gap: 8px; min-width: 0; }
.summary-team-name { align-items: flex-start; display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.summary-team-name b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.summary-team.away { justify-content: flex-end; text-align: right; }
.summary-team.away .summary-team-name { align-items: flex-end; }
.summary-score { font-family: "Newsreader", Georgia, serif; font-size: 22px; min-width: 44px; text-align: center; }
.summary-status { color: var(--muted); font-size: 9px; font-weight: 700; text-align: center; text-transform: uppercase; }
.summary-row.final .summary-status { color: var(--green-600); }
.summary-row.live .summary-status { color: #b8d9bc; }
.summary-distribution .pick-distribution { border-top: 0; margin: 0; padding: 0; }
.summary-distribution .distribution-labels { margin-bottom: 5px; }
.summary-distribution .distribution-bar { height: 6px; }
.group-table-source { color: var(--muted); font-size: 10px; font-weight: 700; margin: 10px 0 0; text-transform: uppercase; }
.group-table-rules { color: #8f9189; font-size: 10px; line-height: 1.45; margin: 5px 0 0; max-width: 690px; }
.group-live-toggle { margin-bottom: 4px; max-width: none; }
.group-tables { display: grid; gap: 14px; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.group-table-card { background: var(--white); border: 1px solid var(--line); min-width: 0; }
.group-table-title { align-items: center; border-bottom: 1px solid var(--line); display: flex; justify-content: space-between; padding: 14px 16px; }
.group-table-title h3 { font-family: "Newsreader", Georgia, serif; font-size: 23px; margin: 0; }
.group-table-title span { align-items: center; color: #b8d9bc; display: flex; font-size: 9px; font-weight: 700; gap: 7px; text-transform: uppercase; }
.group-table-title i { background: #83cc93; border-radius: 50%; box-shadow: 0 0 0 4px rgba(131,204,147,.12); height: 6px; width: 6px; }
.group-table-scroll { overflow-x: auto; }
.group-table-card table { min-width: 0; }
.group-table-card th { font-size: 8px; padding: 9px 10px; }
.group-table-card td { font-size: 11px; padding: 10px; }
.group-table-card tr.qualification-place { box-shadow: inset 3px 0 0 #708d73; }
.group-table-card tr.third-place { box-shadow: inset 3px 0 0 #8f8265; }
.group-position { color: var(--muted); font-family: "Newsreader", Georgia, serif; font-size: 16px !important; width: 38px; }
.group-team { align-items: center; display: flex; gap: 7px; min-width: 0; }
.group-team strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.group-team .team-flag { flex: 0 0 auto; height: 16px; width: 22px; }
.group-team-button { background: transparent; border: 0; color: var(--ink); font: inherit; padding: 0; text-align: left; }
.group-team-button:hover strong { color: var(--green-800); text-decoration: underline; }
.group-points { color: var(--green-800); font-weight: 800; }
.group-tie-note { border-top: 1px solid var(--line); color: var(--amber); font-size: 9px; line-height: 1.4; margin: 0; padding: 10px 13px; }
#team-dialog { height: auto; margin: auto; max-height: calc(100vh - 30px); max-width: 520px; overflow: hidden; }
.team-dialog-analytics { background: var(--green-950); display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.team-dialog-analytics > div { border-right: 1px solid var(--line); padding: 11px 10px; }
.team-dialog-analytics > div:last-child { border-right: 0; }
.team-dialog-analytics span, .team-dialog-analytics small { color: var(--muted); display: block; font-size: 8px; line-height: 1.25; text-transform: uppercase; }
.team-dialog-analytics strong { display: block; font-family: "Newsreader", Georgia, serif; font-size: 20px; margin: 3px 0; }
.team-dialog-analytics p { color: var(--muted); font-size: 10px; grid-column: 1 / -1; margin: 0; padding: 14px 20px; }
.team-dialog-fixtures { max-height: 54vh; overflow-y: auto; padding: 6px 12px 14px; }
.team-fixture-entry { margin-top: 9px; }
.team-fixture-row { align-items: center; background: #1a1d1a; border: 1px solid var(--line); display: grid; gap: 10px; grid-template-columns: 74px minmax(0, 1fr); min-height: 48px; padding: 10px 12px 11px; position: relative; }
.team-fixture-date strong, .team-fixture-opponent strong, .team-fixture-result strong { display: block; font-size: 11px; }
.team-fixture-date small, .team-fixture-opponent small, .team-fixture-result small { color: var(--muted); display: block; font-size: 8px; margin-top: 2px; text-transform: uppercase; }
.team-fixture-opponent { align-items: center; display: flex; gap: 8px; min-width: 0; padding-right: 72px; }
.team-fixture-opponent > span { min-width: 0; }
.team-fixture-opponent strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.team-fixture-opponent .team-flag { flex: 0 0 auto; height: 17px; width: 23px; }
.team-fixture-result { position: absolute; right: 11px; text-align: right; top: 9px; }
.team-fixture-result strong { font-family: "Newsreader", Georgia, serif; font-size: 18px; }
.team-fixture-entry.final .team-fixture-result small { color: var(--green-600); }
.team-fixture-outcome { color: #a7a9a2; font-style: italic; font-weight: 400; text-transform: lowercase; }
.team-fixture-entry.live .team-fixture-result small { color: #b8d9bc; }
.team-fixture-distribution { grid-column: 1 / -1; padding-top: 3px; }
.team-fixture-distribution .pick-distribution { border-top: 0; margin: 0; padding: 0; }
.team-fixture-distribution .distribution-labels { margin-bottom: 5px; }
.team-fixture-distribution .distribution-bar { height: 6px; }
.analytics-source { color: var(--muted); font-size: 10px; font-weight: 700; margin: 10px 0 0; text-transform: uppercase; }
.analytics-kpis { display: grid; gap: 10px; grid-template-columns: repeat(6, minmax(0, 1fr)); }
.analytics-kpi { background: var(--white); border: 1px solid var(--line); min-width: 0; padding: 16px; }
.analytics-kpi > span { color: var(--muted); display: block; font-size: 9px; font-weight: 700; line-height: 1.3; min-height: 24px; text-transform: uppercase; }
.analytics-kpi > strong { display: block; font-family: "Newsreader", Georgia, serif; font-size: 30px; margin-top: 7px; }
.analytics-kpi > small { color: #92958e; display: block; font-size: 9px; line-height: 1.4; margin-top: 6px; }
.analytics-panels { display: grid; gap: 12px; grid-template-columns: 1.15fr .85fr; margin-top: 12px; }
.analytics-panel, .analytics-superlatives, .analytics-team-section { background: var(--white); border: 1px solid var(--line); }
.analytics-panel-heading { align-items: baseline; border-bottom: 1px solid var(--line); display: flex; justify-content: space-between; padding: 14px 16px; }
.analytics-panel-heading h3 { font-family: "Newsreader", Georgia, serif; font-size: 21px; margin: 0; }
.analytics-panel-heading span { color: var(--muted); font-size: 8px; font-weight: 700; text-transform: uppercase; }
#analytics-pool-read, #analytics-draws { padding: 14px 16px 16px; }
.analytics-progress-row + .analytics-progress-row { margin-top: 13px; }
.analytics-progress-row > div:first-child { align-items: center; display: flex; font-size: 10px; justify-content: space-between; }
.analytics-progress-row > div:first-child span { color: var(--muted); }
.analytics-progress-row > div:first-child strong { font-size: 11px; }
.analytics-progress-track { background: #303530; height: 5px; margin-top: 5px; overflow: hidden; }
.analytics-progress-track span { background: var(--green-600); display: block; height: 100%; }
.analytics-progress-row > small { color: #858981; display: block; font-size: 8px; margin-top: 4px; }
.analytics-callout { background: #191c19; border: 1px solid var(--line); color: var(--ink); display: block; margin-top: 14px; padding: 11px 12px; text-align: left; width: 100%; }
.analytics-callout > span { color: var(--green-600); display: block; font-size: 8px; font-weight: 700; text-transform: uppercase; }
.analytics-callout > strong { align-items: center; display: flex; font-size: 12px; gap: 7px; margin-top: 5px; }
.analytics-callout > small { color: var(--muted); display: block; font-size: 9px; margin-top: 4px; }
.analytics-callout.clickable { cursor: pointer; }
.analytics-callout.clickable:hover { border-color: #657066; }
.draw-stat-grid { display: grid; gap: 6px; grid-template-columns: repeat(3, 1fr); }
.draw-stat-grid div { background: #252925; padding: 11px 8px; text-align: center; }
.draw-stat-grid strong { display: block; font-family: "Newsreader", Georgia, serif; font-size: 23px; }
.draw-stat-grid span { color: var(--muted); display: block; font-size: 8px; line-height: 1.25; margin-top: 3px; text-transform: uppercase; }
.analytics-superlatives, .analytics-team-section { margin-top: 12px; }
.analytics-superlative-grid { display: grid; gap: 8px; grid-template-columns: repeat(4, minmax(0, 1fr)); padding: 12px; }
.analytics-superlative-card { background: #1a1d1a; border: 1px solid var(--line); color: var(--ink); min-height: 104px; padding: 12px; text-align: left; }
.analytics-superlative-card:not(.empty-card):hover { background: #252925; border-color: #657066; }
.analytics-superlative-card > span { color: var(--lime); display: block; font-size: 8px; font-weight: 700; text-transform: uppercase; }
.analytics-superlative-card > strong { display: block; font-size: 11px; line-height: 1.35; margin-top: 8px; }
.analytics-superlative-card > small { color: var(--muted); display: block; font-size: 9px; line-height: 1.35; margin-top: 6px; }
.analytics-superlative-card.empty-card { cursor: default; }
.analytics-team-table { overflow-x: auto; }
.analytics-team-table table { min-width: 680px; }
.analytics-team-table th, .analytics-team-table td { padding: 11px 14px; }
.analytics-method-note { color: var(--muted); font-size: 9px; line-height: 1.45; margin: 0; padding: 10px 14px; }
.analytics-team-row { cursor: pointer; }
.analytics-team-row:focus-visible { outline: 2px solid var(--green-600); outline-offset: -2px; }
.analytics-team { align-items: center; display: flex; gap: 8px; }
.analytics-team .team-flag { height: 17px; width: 23px; }
.analytics-team strong { font-size: 11px; }
.analytics-record { font-family: "DM Sans", sans-serif; font-weight: 700; }
.my-picks-intro { color: var(--muted); font-size: 11px; margin: 10px 0 0; }
.my-picks-intro strong { color: var(--ink); }
.private-heading { border-bottom: 1px solid var(--line); }
.private-badge { background: #263029; border: 1px solid #46594a; color: #b9cfb8; font-size: 9px; font-weight: 700; letter-spacing: .06em; padding: 7px 9px; text-transform: uppercase; }
.private-dashboard { display: grid; gap: 18px; padding-top: 22px; }
.private-status-card { align-items: flex-start; background: var(--white); border: 1px solid var(--line); display: flex; justify-content: space-between; padding: 24px; }
.private-status-card--primary { border-left: 3px solid var(--green-600); }
.private-card-label { color: var(--green-600); display: block; font-size: 9px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.private-status-card h3, .private-panel h3 { font-family: "Newsreader", Georgia, serif; font-size: 24px; margin: 7px 0 0; }
.private-status-card p, .private-panel p { color: var(--muted); font-size: 11px; line-height: 1.55; margin: 7px 0 0; max-width: 620px; }
.private-status-pill { background: #2d312e; border: 1px solid #4a504a; color: var(--muted); flex: 0 0 auto; font-size: 9px; font-weight: 700; margin-left: 20px; padding: 7px 9px; text-transform: uppercase; }
.private-metrics { background: var(--white); border: 1px solid var(--line); display: grid; grid-template-columns: repeat(3, 1fr); }
.private-metrics > div { border-right: 1px solid var(--line); padding: 20px 22px; }
.private-metrics > div:last-child { border-right: 0; }
.private-metrics span, .private-metrics small { color: var(--muted); display: block; font-size: 9px; }
.private-metrics span { font-weight: 700; text-transform: uppercase; }
.private-metrics strong { display: block; font-family: "Newsreader", Georgia, serif; font-size: 21px; margin-top: 7px; }
.private-metrics small { margin-top: 5px; }
.private-panel { background: var(--white); border: 1px solid var(--line); padding: 22px; }
.private-panel-heading { align-items: flex-start; display: flex; justify-content: space-between; }
.private-panel-heading > span { color: var(--muted); font-size: 9px; font-weight: 700; text-transform: uppercase; }
.private-empty-state { align-items: center; border-top: 1px solid var(--line); display: flex; gap: 14px; margin-top: 20px; padding: 22px 0 2px; }
.private-empty-state > span { align-items: center; border: 1px solid #4a504a; border-radius: 50%; color: var(--green-600); display: flex; flex: 0 0 auto; height: 38px; justify-content: center; width: 38px; }
.private-empty-state strong { font-size: 12px; }
.private-empty-state p { margin-top: 4px; }
.account-page-grid { display: grid; gap: 18px; grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); padding-top: 22px; }
.account-profile-card { align-items: center; display: flex; gap: 17px; }
.account-page-avatar { align-items: center; background: #344038; border: 1px solid #57675a; border-radius: 50%; color: #d7ead3; display: flex; flex: 0 0 auto; font-family: "Newsreader", Georgia, serif; font-size: 28px; height: 58px; justify-content: center; width: 58px; }
.account-profile-card h3 { margin-top: 4px; }
.account-profile-card p { margin-top: 2px; }
.account-security-card { border-top: 3px solid var(--green-600); }
.private-secondary-action { border: 1px solid #4a504a; color: var(--ink); display: inline-flex; font-size: 9px; font-weight: 700; margin-top: 17px; padding: 9px 11px; text-decoration: none; text-transform: uppercase; }
.private-secondary-action:hover { border-color: var(--green-600); }
.pick-workspace { padding: 0; }
.pick-list-heading { align-items: center; padding: 20px 22px; }
.pick-filter { align-items: center; display: flex; gap: 8px; }
.pick-filter > span { color: var(--muted); font-size: 9px; font-weight: 700; text-transform: uppercase; }
.pick-filter select { background: #272b27; border: 1px solid #4a504a; color: var(--ink); font-size: 10px; min-width: 145px; padding: 8px 28px 8px 10px; }
.private-pick-list { border-top: 1px solid var(--line); }
.private-pick-date { align-items: center; background: #181b18; border-bottom: 1px solid var(--line); border-top: 1px solid var(--line); display: flex; justify-content: space-between; padding: 10px 16px; position: sticky; top: 0; z-index: 3; }
.private-pick-date:first-child { border-top: 0; }
.private-pick-date strong { font-family: "Newsreader", Georgia, serif; font-size: 15px; }
.private-pick-date span { color: var(--muted); font-size: 8px; font-weight: 700; text-transform: uppercase; }
.private-pick-row { align-items: stretch; border-bottom: 1px solid var(--line); display: grid; grid-template-columns: 105px minmax(0, 1fr) 72px; min-height: 82px; }
.private-pick-row:last-child { border-bottom: 0; }
.private-pick-meta { align-items: flex-start; border-right: 1px solid var(--line); display: flex; flex-direction: column; justify-content: center; padding: 12px 14px; }
.private-pick-meta span { color: var(--muted); font-size: 8px; font-weight: 700; line-height: 1.35; text-transform: uppercase; }
.private-pick-meta strong { font-size: 11px; margin-top: 5px; }
.private-pick-choices { display: grid; gap: 7px; grid-template-columns: 1fr minmax(120px, .58fr) 1fr; padding: 9px; }
.private-pick-choice { align-items: center; background: #252925; border: 1px solid #3f453f; color: var(--ink); display: flex; gap: 10px; min-width: 0; padding: 9px 11px; position: relative; text-align: left; }
.private-pick-choice:hover:not(:disabled) { background: #2d332e; border-color: #6a786b; }
.private-pick-choice.is-selected { background: #3c5141; border: 2px solid #b8d1b9; box-shadow: inset 0 0 0 1px #263429; padding: 8px 10px; }
.private-pick-choice .team-flag { flex: 0 0 auto; height: 24px; width: 32px; }
.private-choice-team { display: block; min-width: 0; }
.private-choice-team strong { display: block; font-size: 11px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.private-choice-team small, .private-choice-team .fifa-rank { color: #aaa99f; display: block; font-size: 8px; font-weight: 500; margin-top: 3px; }
.private-draw-mark { align-items: center; background: #303530; border-radius: 50%; color: var(--muted); display: flex; flex: 0 0 auto; font-family: "Newsreader", Georgia, serif; height: 25px; justify-content: center; width: 25px; }
.private-choice-check { align-items: center; background: #d7ead3; border-radius: 50%; color: #1b261d; display: none; flex: 0 0 auto; font-size: 9px; height: 19px; justify-content: center; margin-left: auto; width: 19px; }
.private-pick-choice.is-selected .private-choice-check { display: flex; }
.private-pick-choice:disabled { cursor: not-allowed; opacity: .58; }
.private-pick-choice.is-selected:disabled { opacity: .82; }
.private-pick-state { align-items: center; border-left: 1px solid var(--line); display: flex; justify-content: center; padding: 8px; text-align: center; }
.private-pick-state span { color: var(--muted); font-size: 8px; font-weight: 700; line-height: 1.3; text-transform: uppercase; }
.private-pick-row:has(.private-pick-choice.is-selected) .private-pick-state span { color: #b9cfb8; }
.leaderboard-name-card form { margin-top: 16px; }
.leaderboard-name-card form > label { color: var(--muted); display: block; font-size: 9px; font-weight: 700; margin-bottom: 6px; text-transform: uppercase; }
.leaderboard-name-card form > div { display: flex; }
.leaderboard-name-card input { background: #171a17; border: 1px solid #4a504a; color: var(--ink); min-width: 0; padding: 10px 11px; width: 100%; }
.leaderboard-name-card button { background: var(--green-600); border: 0; color: #111311; font-size: 9px; font-weight: 800; padding: 0 15px; text-transform: uppercase; }
.leaderboard-name-card form > small { color: var(--green-600); display: block; font-size: 9px; line-height: 1.4; margin-top: 7px; min-height: 13px; }
.error-state { background: var(--red); bottom: 20px; color: #111311; left: 20px; padding: 14px 18px; position: fixed; right: 20px; z-index: 5; }
.empty { color: var(--muted); padding: 40px; text-align: center; }
.sr-only { height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; clip: rect(0,0,0,0); }

@media (max-width: 850px) {
  .scoreboard { grid-template-columns: repeat(2, 1fr); }
  .scoreboard > div:nth-child(2) { border-right: 0; }
  .scoreboard > div:nth-child(-n+2) { border-bottom: 1px solid var(--line); }
  .match-grid { grid-template-columns: repeat(2, 1fr); }
  .today-match-grid { grid-template-columns: repeat(2, 1fr); }
  .yesterday-results { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .section-heading { align-items: flex-start; gap: 18px; }
  .awards-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .summary-heading { align-items: stretch; flex-direction: column; }
  .summary-filters { align-items: stretch; flex-wrap: wrap; }
  .summary-filters .search { flex: 1 1 100%; }
  .summary-filters > label:not(.search) { flex: 1; }
  .summary-filters select { width: 100%; }
  .summary-row { grid-template-areas: "meta status" "fixture fixture" "distribution distribution"; grid-template-columns: 1fr auto; gap: 9px 14px; }
  .group-tables { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .analytics-kpis { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .analytics-panels { grid-template-columns: 1fr; }
  .analytics-superlative-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .account-page-grid { grid-template-columns: 1fr; }
  .private-pick-row { grid-template-columns: 88px minmax(0, 1fr); }
  .private-pick-state { border-left: 0; border-top: 1px solid var(--line); grid-column: 1 / -1; justify-content: flex-end; min-height: 24px; padding: 5px 10px; }
  .private-pick-choices { grid-template-columns: 1fr; }
  .summary-meta { grid-area: meta; }
  .summary-fixture { grid-area: fixture; }
  .summary-status { grid-area: status; }
  .summary-distribution { grid-area: distribution; }
}

@media (max-width: 600px) {
  .masthead, .masthead-inner { min-height: 310px; }
  .masthead-inner { align-items: flex-start; flex-direction: column; justify-content: flex-end; padding: 36px 20px 38px; }
  h1 { font-size: 54px; }
  .subhead { font-size: 14px; margin-top: 14px; }
  .header-actions { align-items: stretch; margin-top: 24px; width: 100%; }
  .update-status { margin-top: 13px; }
  .account-control { min-width: 0; width: 100%; }
  .private-status-card { display: block; padding: 19px; }
  .private-status-pill { display: inline-block; margin: 15px 0 0; }
  .private-metrics { grid-template-columns: 1fr; }
  .private-metrics > div { border-bottom: 1px solid var(--line); border-right: 0; }
  .private-metrics > div:last-child { border-bottom: 0; }
  .pick-list-heading { align-items: stretch; flex-direction: column; gap: 14px; }
  .pick-filter { justify-content: space-between; }
  .pick-filter select { flex: 1; }
  .private-pick-row { display: block; }
  .private-pick-meta { align-items: center; border-bottom: 1px solid var(--line); border-right: 0; flex-direction: row; justify-content: space-between; padding: 9px 11px; }
  .private-pick-meta strong { margin-top: 0; }
  .private-pick-choices { grid-template-columns: 1fr 1fr 1fr; }
  .private-pick-choice { flex-direction: column; justify-content: center; min-height: 92px; padding: 8px 6px; text-align: center; }
  .private-pick-choice.is-selected { padding: 7px 5px; }
  .private-choice-team strong { white-space: normal; }
  .private-choice-check { margin: 2px 0 0; position: absolute; right: 5px; top: 5px; }
  .private-pick-state { border-top: 0; }
  main { padding: 0 14px 50px; }
  .scoreboard { margin-top: -8px; }
  .scoreboard > div { min-height: 105px; padding: 16px; }
  .scoreboard strong { font-size: 21px; }
  .section-heading { align-items: stretch; flex-direction: column; }
  .leaderboard-tools { align-items: stretch; flex-direction: column; }
  .provisional-toggle { max-width: none; }
  .awards-heading { align-items: flex-start; flex-direction: column; gap: 5px; }
  .search { width: 100%; }
  th, td { padding: 13px 14px; }
  .match-grid { grid-template-columns: 1fr; }
  .today-match-grid { grid-template-columns: 1fr; }
  .yesterday-heading { align-items: flex-start; flex-direction: column; gap: 5px; }
  .yesterday-results { grid-template-columns: 1fr; }
  .summary-row { padding: 12px; }
  .summary-team { font-size: 11px; }
  .summary-team .team-flag { height: 17px; width: 22px; }
  .summary-score { font-size: 20px; }
  .group-tables { grid-template-columns: 1fr; }
  .analytics-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .analytics-superlative-grid { grid-template-columns: 1fr; }
  .analytics-panel-heading { align-items: flex-start; flex-direction: column; gap: 4px; }
  .team-dialog-analytics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .team-dialog-analytics > div:nth-child(2) { border-right: 0; }
  .team-dialog-analytics > div:nth-child(-n+2) { border-bottom: 1px solid var(--line); }
  dialog { height: 100%; max-height: none; width: 100%; }
  .dialog-header, .pick-list { padding-left: 18px; padding-right: 18px; }
  .dialog-summary { grid-template-columns: repeat(2, 1fr); }
  .dialog-summary div:nth-child(2) { border-right: 0; }
  .dialog-summary div:nth-child(-n+2) { border-bottom: 1px solid rgba(255,255,255,.14); }
  .match-dialog-distribution { padding-left: 18px; padding-right: 18px; }
  .match-pick-list { display: block; padding-left: 18px; padding-right: 18px; }
  .match-pick-column + .match-pick-column { margin-top: 28px; }
  .match-pick-heading { min-height: 0; }
}

@media (max-width: 430px) {
  .prediction-highlight { grid-template-columns: 1fr; }
  .prediction-highlight strong { grid-column: 1; grid-row: auto; margin-top: 6px; max-width: none; text-align: left; }
}

