:root{--surface:#111c29;--surface-raised:#182536;--border-soft:#ffffff14;--text-soft:#a5b6c8;--home:#78a8ff;--away:#e6edf5}
body{background:radial-gradient(ellipse at 20% 0,#17304766,transparent 45%),#0a111b;color:#edf3f8}
.topbar{background:#0a111be8;border-color:var(--border-soft);height:76px}
.brand{font-size:20px}.brandmark{border-radius:11px 11px 11px 2px;box-shadow:0 4px 20px #b3ef8912}
.brand small{letter-spacing:3px;font-size:8px}.match-meta{color:#91a6ba}
main{max-width:1680px;padding-top:28px}
.match-heading{display:block;padding:22px 30px 26px;margin-bottom:22px;border:1px solid var(--border-soft);border-radius:16px;background:linear-gradient(120deg,#182b40d9,#122130a8 52%,#1b2839b3);box-shadow:0 10px 38px #00000018}
.match-intro{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:21px}
.match-intro .eyebrow{font-size:9px;margin:0;letter-spacing:1.7px}.match-intro .subtitle{font-size:11px;margin:0;color:var(--text-soft)}
.match-scoreboard{display:grid;grid-template-columns:minmax(0,1fr) 210px minmax(0,1fr);align-items:center;gap:26px;max-width:1060px;margin:auto}
.team-identity{display:flex;align-items:center;gap:20px;min-width:0}
.team-identity img{width:76px;height:76px;object-fit:contain;flex-shrink:0;filter:drop-shadow(0 3px 8px #0004)}
img[src*="rangers.gif"]{clip-path:circle(49% at 50% 50%)}
img[src*="dundee.gif"]{clip-path:polygon(25% 1%,50% 5%,75% 1%,96% 21%,89% 39%,87% 60%,78% 80%,62% 90%,50% 99%,38% 90%,22% 80%,12% 60%,10% 39%,4% 21%)}
.team-identity>div{display:flex;flex-direction:column;gap:7px;min-width:0}
.team-identity small{font-size:9px;letter-spacing:1.5px;color:#93a8bf;text-transform:uppercase}
.team-identity strong{font-size:27px;font-weight:650;letter-spacing:-.6px;line-height:1.15}
.team-identity>div>span{font-size:11px;color:#93a8bf}
.away-identity{justify-content:flex-end;text-align:right}
.result{padding:0;display:flex;flex-direction:column;gap:7px;align-items:center;justify-content:center}
.result-label{display:block;font-size:8px;letter-spacing:1.6px;text-transform:uppercase;color:#b5c4d4}
.result strong{font-size:52px;font-weight:600;line-height:1.05;letter-spacing:5px;font-variant-numeric:tabular-nums;white-space:nowrap}
.complete{display:block;font-size:10px;line-height:1.5;color:#c7e5b5;background:#b3ef890b;border:1px solid #b3ef8924;padding:4px 10px;border-radius:20px;white-space:nowrap}
.workspace{grid-template-columns:minmax(0,1fr) 346px;gap:20px}
.viewer-shell,.match-panel{border-color:var(--border-soft);border-radius:14px;background:var(--surface);box-shadow:0 12px 40px #0002}
.viewer-toolbar{min-height:58px;padding-inline:15px;background:#152232;border-bottom:1px solid var(--border-soft);gap:7px}
.view-tabs{gap:2px}.view-tabs button{font-size:11px;border-radius:6px;padding-inline:12px;min-height:35px}
.view-tabs [aria-pressed=true]{background:#b3ef8916;color:var(--accent)}
.view-tools{gap:10px}.view-tools label{font-size:10px;color:#b7c8da}.clear-selection{font-size:9px;min-height:32px}
.stage{height:clamp(460px,39vw,650px)}
.scorebug{top:20px;left:20px;border:1px solid #ffffff1f;border-radius:7px;box-shadow:0 3px 18px #0004;overflow:hidden;background:#0c1624ee}
.team-code{display:flex;align-items:center;justify-content:center;gap:7px;min-width:56px;padding:8px 10px;font-size:10px}
.mini-crest{width:20px;height:20px;object-fit:contain}.scorebug strong{font-size:19px;padding-inline:10px;display:flex;align-items:center}.clock{display:flex;align-items:center;background:#b3ef890e;color:#c6efab;font-size:11px}
.stage-badge{font-size:8px;top:29px;right:20px}.stage-bottom{font-size:7px;color:#d1dfd4b3}
.commentary{background:#142231;border-color:var(--border-soft);padding:16px 20px;min-height:65px}.commentary p{font-size:12px;line-height:1.6;color:#d9e3ec}.commentary-time{font-size:11px}.commentary-source{font-size:8px;color:#8aa2b9}
.transport{background:#101d2b;padding:18px 20px 13px}.transport-row{gap:12px}.play-button{font-size:12px;min-height:42px;border-radius:7px}
.broadcast-controls{font-size:11px;margin-top:14px;padding-top:12px;border-color:var(--border-soft);gap:8px}
.broadcast-controls button,.broadcast-controls label{font-size:10px;min-height:35px}.replay-controls,.audio-controls{gap:8px}.audio-controls input[type=range]{width:76px}
.viewer-note{font-size:9px;border-color:var(--border-soft);background:#0f1b28;color:#95aabd;padding:11px 20px}
.match-panel{display:flex;flex-direction:column;align-self:start;overflow:hidden}
.panel-switch{display:flex;gap:5px;padding:9px;border-bottom:1px solid var(--border-soft);background:#132130}
.panel-switch button{flex:1;min-height:40px;padding-inline:10px;border-radius:7px;font-size:12px;font-weight:550;color:#99aec4;display:flex;align-items:center;justify-content:center;gap:14px}
.panel-switch [aria-pressed=true]{background:#21354c;color:#ecf4ff;box-shadow:inset 0 0 0 1px #a6c5f31f}
.panel-switch button span{color:#8ba8c7;font-size:14px}
#historyPane[hidden],#analysisPane[hidden]{display:none}
.panel-heading{padding:18px 18px 12px;gap:10px}.panel-heading h2{font-size:13px;font-weight:600}.panel-heading>span{font-size:9px;color:#94abc2;white-space:nowrap}
.episodes{padding:0 9px;min-height:390px;max-height:570px;scrollbar-width:thin;scrollbar-color:#314b65 transparent}
.episode{position:relative;border:1px solid transparent;min-height:66px;gap:9px;margin:2px 0;padding:11px 8px;grid-template-columns:29px minmax(0,1fr) 16px;border-radius:7px}
.episode:hover{background:#1e3043}.episode[aria-current=true]{background:#b3ef890b;border-color:#b3ef8930}
.episode .minute{color:#819db8;font-size:10px;padding-top:3px}.episode strong{font-size:12px;font-weight:550;color:#e0eaf4}.episode small{font-size:10px;line-height:1.45;color:#99aec4;margin-top:5px}
.episode.goal{background:#b3ef8906}.episode.goal .minute,.episode.goal strong{color:#cbefae}.episode.substitution .event-symbol{color:#84b5ff}
.history-empty,.history-hint{font-size:10px;line-height:1.6;color:#91a7be}.history-empty{padding:18px 12px}.history-hint{margin:0;padding:13px 18px;border-top:1px solid var(--border-soft);background:#0e1a27}
.selected-player{padding:17px 18px;border-color:var(--border-soft);background:#101e2d;gap:12px}.selected-player strong{font-size:12px}.selected-player p{font-size:10px;color:#9cb0c5}.player-placeholder{font-size:29px;color:#7899ba}
.heatmap-controls{display:grid;grid-template-columns:1fr 1.2fr;gap:8px;padding:0 16px 12px}
.heatmap-controls label{display:flex;flex-direction:column;gap:7px;font-size:9px;color:#98b0c7}
.heatmap-controls select{min-width:0;max-width:100%;width:100%;min-height:35px;border:1px solid #30465e;border-radius:6px;background:#17283a;color:#dae7f3;font-size:11px;padding:5px 7px}
.heatmap-card{margin:0 14px;border-radius:9px;overflow:hidden;border:1px solid #a7d4df24;background:#11212b}
.heatmap-direction{display:flex;justify-content:space-between;font-size:8px;text-transform:uppercase;letter-spacing:1.2px;color:#a9c3c5;padding:10px 11px 0}.heatmap-direction span{font-size:16px;line-height:9px}
#heatmap{display:block;width:100%;height:auto;aspect-ratio:640/440}
.heatmap-legend{display:flex;align-items:center;gap:9px;padding:0 12px 11px;font-size:8px;color:#b1c6d1}.heatmap-legend i{flex:1;height:4px;border-radius:3px;background:linear-gradient(90deg,#2964c1,#23c6c0,#edd359,#f2853e,#eb4642)}
.analysis-note{margin:0;padding:10px 18px 14px;font-size:9px;line-height:1.55;color:#95abc0;min-height:49px}
.stats-heading{padding-top:16px;border-top:1px solid var(--border-soft)}
.stats{padding:0 18px 12px}.stat-teams{margin:0 0 7px;color:#b5c9dc;font-size:10px;letter-spacing:0}
.stat-teams>span{gap:5px;align-items:center}.stat-teams img{width:22px;height:22px;object-fit:contain}
.metric-row{padding:7px 0 8px}.stat-line{padding:3px 0 7px}.stat-line strong{font-size:16px;font-weight:550;color:#e8f2fc}.stat-line>span{font-size:10px;color:#a0b4c8}
.comparison-bar,.possession-bar{height:4px;background:var(--away);border-radius:3px;overflow:hidden;margin:0}.comparison-bar>span,.possession-bar>span{display:block;height:100%;width:50%;background:var(--home)}
.comparison-bar[data-empty=true]{background:#2d4359}.comparison-bar[data-empty=true]>span{background:#2d4359}
footer{color:#8fa8c0;font-size:9px;min-height:67px}.footer-tag{border-color:#a6c5f326;color:#9db4ce}
.replay-bar{background:#0d1d2bf0;border-color:#c8dfca38;backdrop-filter:blur(7px)}
button:focus-visible,select:focus-visible,input:focus-visible{outline:2px solid #c7f3a8;outline-offset:3px}
@media(min-width:1500px){.workspace{grid-template-columns:minmax(0,1fr) 365px}.episodes{max-height:635px}.match-heading{padding-block:25px}.match-scoreboard{max-width:1140px}}
@media(max-width:1100px){main{padding-inline:20px}.workspace{grid-template-columns:minmax(0,1fr) 315px;gap:15px}.team-identity strong{font-size:24px}.team-identity{gap:13px}.team-identity img{width:64px;height:64px}.match-scoreboard{grid-template-columns:minmax(0,1fr) 165px minmax(0,1fr);gap:17px}.match-heading{padding-inline:22px}.match-intro{gap:12px}.view-tools{gap:7px}.viewer-toolbar{padding-inline:10px}.view-tabs button{padding-inline:9px;font-size:10px}.stage{height:500px}}
@media(max-width:980px){.workspace{grid-template-columns:1fr}.match-panel{width:100%}.episodes{max-height:360px;min-height:190px}.stage{height:clamp(440px,57vw,580px)}.heatmap-controls{grid-template-columns:1fr 2fr}.heatmap-card{max-width:600px;margin-inline:auto;width:calc(100% - 32px)}.stats{padding-inline:22px}.analysis-note{text-align:center}.panel-switch{padding:8px}.match-intro{flex-wrap:wrap;row-gap:8px}.match-intro .subtitle{font-size:10px}}
@media(max-width:600px){main{padding:18px 12px 0}.topbar{height:65px;padding-inline:14px}.brand{font-size:16px}.brandmark{width:33px;height:36px;font-size:23px;border-radius:8px 8px 8px 2px}.brand small{font-size:6px;letter-spacing:2px}.match-heading{padding:17px 12px 19px;margin-bottom:16px;border-radius:12px}.match-intro{justify-content:center;text-align:center;margin-bottom:18px;gap:8px}.match-intro .eyebrow{font-size:8px}.match-intro .subtitle{font-size:9px;line-height:1.7;width:100%;text-wrap:balance}.match-intro .subtitle span{margin-inline:3px}.match-scoreboard{grid-template-columns:minmax(0,1fr) 102px minmax(0,1fr);gap:8px}.team-identity{flex-direction:column;gap:9px;text-align:center}.away-identity>div{order:2}.team-identity img{width:54px;height:54px}.team-identity>div{gap:5px}.team-identity strong{font-size:16px;letter-spacing:-.3px}.team-identity small{font-size:7px;letter-spacing:1px}.team-identity>div>span{display:none}.result-label{display:block;font-size:7px;letter-spacing:1px}.result strong{font-size:34px;letter-spacing:2px}.complete{display:block;font-size:8px;max-width:107px;padding:4px 7px}.result{gap:8px}.viewer-shell,.match-panel{border-radius:11px}.viewer-toolbar{padding:7px;gap:5px}.view-tabs{width:100%;justify-content:space-between}.view-tabs button{font-size:10px;padding-inline:9px;min-height:33px}.view-tools{gap:9px;justify-content:flex-end;width:100%}.stage{height:440px}.scorebug{left:11px;top:15px;height:34px}.team-code{min-width:44px;font-size:8px;gap:4px;padding:7px}.mini-crest{width:17px;height:17px}.scorebug strong{font-size:15px;padding-inline:6px}.clock{font-size:9px;padding:7px}.stage-badge{font-size:6px;right:10px;top:62px}.commentary{padding:13px 12px}.commentary p{font-size:11px}.transport{padding:15px 9px 10px}.broadcast-controls{gap:7px;margin-top:11px}.replay-controls,.audio-controls{width:100%;justify-content:space-between;gap:6px}.broadcast-controls label,.broadcast-controls button{font-size:9px;min-height:37px}.audio-controls input[type=range]{width:100px}.viewer-note{font-size:8px;padding:11px 12px}.stage-bottom{font-size:6px}.episodes{min-height:180px;max-height:350px}.panel-heading{padding:16px 16px 10px}.panel-switch button{min-height:40px;font-size:12px}.episode strong{font-size:12px}.episode small{font-size:10px}.heatmap-controls select{font-size:12px;min-height:39px}.heatmap-controls{grid-template-columns:1fr 1.4fr}.stat-line strong{font-size:16px}.stat-line>span{font-size:11px}.analysis-note{font-size:10px}.history-hint{font-size:10px}.selected-player{padding:16px}.play-button{min-width:100px;font-size:11px;min-height:40px}.playback-time{display:none}.speed-controls{gap:4px}.speed-controls .quiet{font-size:9px;padding-inline:5px}.view-tools label{font-size:10px}.clear-selection{font-size:9px}.top-actions .quiet{font-size:9px}.appearance-open{font-size:9px}}
@media(max-width:360px){.team-identity strong{font-size:14px}.team-identity img{width:46px;height:46px}.match-scoreboard{grid-template-columns:minmax(0,1fr) 94px minmax(0,1fr);gap:5px}.replay-controls{justify-content:flex-start;column-gap:10px}.heatmap-controls{grid-template-columns:1fr 1.25fr}}
@media(max-width:600px){.heatmap-controls select{font-size:16px}}

.panel-switch button{font-size:11px;padding-inline:6px;gap:5px;min-width:0}
#ratingsPane[hidden]{display:none}
.ratings-team-switch{display:flex;gap:7px;padding:0 14px 13px}
.ratings-team-switch button{flex:1;min-height:39px;display:flex;align-items:center;justify-content:center;gap:7px;background:#152638;border:1px solid #344a614d;border-radius:6px;font-size:11px;color:#a4b8cc}
.ratings-team-switch [aria-pressed=true]{background:#233b53;border-color:#93b7df55;color:#eff7ff}
.ratings-team-switch img{width:24px;height:24px;object-fit:contain}
.ratings-tools{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:0 16px 12px;font-size:9px;color:#9eb3c9}
.ratings-tools label{display:flex;align-items:center;gap:7px}.ratings-tools select{min-height:33px;max-width:130px;border:1px solid #30465e;border-radius:5px;background:#17283a;color:#d7e6f5;font-size:10px;padding:4px 7px}
.ratings-list{padding:0 9px 7px;max-height:560px;overflow:auto;scrollbar-width:thin;scrollbar-color:#314b65 transparent}
.rating-row{display:flex;align-items:center;gap:10px;text-align:left;width:100%;min-height:55px;padding:9px 8px;margin:2px 0;border:1px solid transparent;border-radius:7px}
.rating-row:hover{background:#1e3043}.rating-row[aria-pressed=true]{background:#b3ef890c;border-color:#b3ef8935}
.rating-shirt{width:23px;flex-shrink:0;font-size:12px;font-variant-numeric:tabular-nums;color:#839fbc;text-align:center}
.rating-person{display:flex;flex:1;min-width:0;flex-direction:column;gap:5px}.rating-person strong{font-size:12px;font-weight:550;color:#e1edf8;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.rating-person small{font-size:9px;color:#93abc3}
.rating-row[data-status=substituted] .rating-person small,.rating-row[data-status=off_pitch] .rating-person small{color:#a8a9aa}.rating-row[data-status=sent_off] .rating-person small{color:#f0a093}
.rating-badge{display:inline-flex;align-items:center;justify-content:center;min-width:39px;min-height:30px;padding:3px 6px;border-radius:5px;font-size:13px;font-weight:650;font-variant-numeric:tabular-nums;line-height:1;background:#283d53;color:#eef6ff;border:1px solid #ffffff0a;flex-shrink:0}
.rating-badge.good{background:#294733;color:#c8f2b1}.rating-badge.excellent{background:#194640;color:#a0efda}.rating-badge.low{background:#512f35;color:#ffc0b0}.rating-badge.unknown{background:#1b2b3c;color:#91a8bd}
.selected-player>div{min-width:0;flex:1}.selected-rating{min-width:38px;font-size:14px;min-height:34px}
.ratings-note{margin:0;padding:13px 17px;border-top:1px solid var(--border-soft);font-size:10px;line-height:1.6;color:#91a7be;background:#0e1a27}
@media(max-width:600px){.ratings-list{max-height:455px}.rating-row{min-height:59px}.ratings-team-switch button{min-height:41px;font-size:12px}.ratings-tools select{font-size:16px;min-height:38px;max-width:150px}.ratings-tools{font-size:10px}.rating-person strong{font-size:13px}.rating-person small{font-size:10px}.rating-badge{font-size:14px;min-height:32px}.panel-switch button{font-size:11px}.selected-player{gap:9px}.selected-player strong{font-size:11px}.ratings-team-switch{padding-inline:12px}}
