:root{color-scheme:dark;--bg:#0c1510;--panel:#17291d;--text:#f2f7f2;--muted:#9cb4a2;--home:#c5f395;--away:#a6caff;--line:#3a5241}*{box-sizing:border-box}body{margin:0;min-height:100vh;display:grid;place-items:center;background:radial-gradient(ellipse at top,#1e3824,var(--bg) 70%);color:var(--text);font-family:'Segoe UI','Microsoft YaHei',sans-serif;padding:3vw}.light{color-scheme:light;--bg:#edf2eb;--panel:#fff;--text:#18311e;--muted:#5a715e;--home:#3c7420;--away:#245598;--line:#c2d1c3;background:var(--bg)}.transparent{background:transparent}.connection{position:fixed;top:10px;right:15px;font-size:10px;color:var(--muted);z-index:5}.connection.ok{opacity:0;pointer-events:none}main{width:min(1500px,100%);padding:3.4vw;border:1px solid var(--line);border-radius:24px;background:var(--panel);box-shadow:0 20px 90px #0003}header{display:flex;justify-content:space-between;align-items:center;gap:20px;border-bottom:1px solid var(--line);padding-bottom:24px}header>div{display:grid;gap:9px;white-space:nowrap}.sport{color:var(--home);font-size:clamp(12px,1.6vw,24px);font-weight:700;letter-spacing:2px}header h1{font-size:clamp(18px,2.4vw,36px);text-align:center;overflow-wrap:anywhere;line-height:1.4;margin:0}header>span{color:var(--muted);font-size:14px}#period{color:var(--muted);font-size:14px}.scores{display:grid;grid-template-columns:minmax(0,1fr) minmax(160px,.65fr) minmax(0,1fr);gap:3vw;align-items:center;padding:35px 0}.scores article{text-align:center;min-width:0}.scores h2{font-size:clamp(20px,3.2vw,48px);line-height:1.4;min-height:1.4em;overflow-wrap:anywhere;margin:9px 0 0}.scores strong{display:block;font-size:clamp(80px,12vw,190px);font-weight:850;line-height:1.35;letter-spacing:-.04em;font-variant-numeric:tabular-nums}.home strong{color:var(--home)}.away strong{color:var(--away)}.scores article p{font-size:clamp(12px,1.6vw,24px);color:var(--muted);margin:0}.serve{font-size:13px;color:var(--home);min-height:20px}.time{text-align:center;min-width:0}.time>span{font-size:12px;color:var(--muted)}#clock{font-size:clamp(27px,4.5vw,72px);font-weight:800;letter-spacing:-1px;font-variant-numeric:tabular-nums}#shot{display:block;color:#ffca89;font-size:32px;margin:10px 0}#status{font-size:12px;color:var(--muted)}.history{display:flex;justify-content:center;gap:12px;flex-wrap:wrap}.history span{padding:9px 15px;background:#7ba16e15;border:1px solid var(--line);border-radius:7px;font-size:13px}.winner{margin-top:25px;padding:14px;background:#78ad4a20;text-align:center;color:var(--home);font-size:clamp(18px,2vw,30px);font-weight:700;border-radius:8px}footer{display:flex;justify-content:space-between;margin-top:25px;border-top:1px solid var(--line);padding-top:17px;color:var(--muted);font-size:10px;letter-spacing:1.5px}#fullscreen{position:fixed;bottom:12px;right:12px;color:var(--muted);background:var(--panel);border:1px solid var(--line);border-radius:8px;min-height:44px;padding:8px 14px;opacity:.25;cursor:pointer}#fullscreen:hover,#fullscreen:focus{opacity:1}[hidden]{display:none!important}.compact{padding:0;min-height:0;display:block;background:transparent}.compact main{border-radius:0;box-shadow:none;padding:16px 28px;max-width:100%;background:var(--panel)}.compact header{padding-bottom:10px;gap:12px}.compact header h1{font-size:20px}.compact header>div{display:flex;align-items:center;gap:15px}.compact .sport{font-size:13px}.compact .scores{padding:10px 0;gap:20px;grid-template-columns:1fr .5fr 1fr}.compact .scores article{display:grid;grid-template-columns:1fr auto;column-gap:15px;align-items:center}.compact h2{font-size:24px;text-align:left;margin:0;grid-column:1;grid-row:1}.compact .scores strong{font-size:65px;grid-column:2;grid-row:1/3;line-height:1.1}.compact .serve{grid-column:1;grid-row:2;text-align:left;font-size:10px;min-height:14px}.compact .scores article p{grid-column:1/-1;font-size:12px;text-align:left;margin-top:7px}.compact #clock{font-size:30px}.compact #shot{font-size:18px;margin:3px}.compact .time>span{font-size:10px}.compact #status{margin:0;font-size:10px}.compact footer{display:none}.compact .winner{margin-top:10px;padding:7px;font-size:16px}.compact .history{margin-top:6px;gap:6px}.compact .history span{font-size:10px;padding:4px 8px}#rosterDisplay{width:min(1100px,100%);padding:35px;background:var(--panel);border:1px solid var(--line);border-radius:16px}#rosterDisplay h1{font-size:clamp(25px,4vw,50px);overflow-wrap:anywhere;margin:14px 0}#rosterDisplay>p{color:var(--muted)}.player{display:grid;grid-template-columns:70px 1fr 110px;gap:15px;align-items:center;border-top:1px solid var(--line);padding:14px 0}.player b{color:var(--home);font-size:28px}.player span{font-size:24px;overflow-wrap:anywhere}.player small{font-size:14px;color:var(--muted)}.transparent #fullscreen{display:none}
@media(max-width:700px){body{padding:12px}main{padding:20px 13px;border-radius:14px}header{display:grid;grid-template-columns:1fr auto;gap:10px;padding-bottom:16px}header h1{grid-column:1/-1;grid-row:2;font-size:19px;text-align:left}header>div{display:flex;gap:15px;align-items:center}header>span{font-size:11px}.sport{font-size:13px}.scores{grid-template-columns:1fr 1fr;gap:12px;padding:20px 0}.time{grid-column:1/-1;grid-row:1;display:flex;justify-content:center;align-items:center;gap:12px;border-bottom:1px solid var(--line);padding-bottom:12px}.time>span{font-size:10px}#clock{font-size:30px}#shot{font-size:21px;margin:0}#status{font-size:10px}.scores h2{font-size:20px}.scores strong{font-size:78px}.scores article p{font-size:12px}.serve{font-size:11px}.history{gap:7px}.history span{font-size:11px;padding:6px 9px}footer{font-size:8px;letter-spacing:0}#rosterDisplay{padding:20px 14px}.player{grid-template-columns:40px 1fr 60px;gap:8px}.player b{font-size:22px}.player span{font-size:20px}.player small{font-size:12px}.compact{padding:0}.compact main{padding:12px}.compact .scores{grid-template-columns:1fr 1fr;gap:9px}.compact .time{grid-column:1/-1}.compact .scores article{grid-template-columns:1fr auto;gap:8px}.compact h2{font-size:16px}.compact .scores strong{font-size:42px}.compact header h1{font-size:16px}.compact header>div{display:flex;flex-wrap:wrap}.compact .history span{font-size:9px}.compact #clock{font-size:26px}}

body.compact{background:var(--bg)}body.transparent,body.compact.transparent{background:transparent}body.transparent main,body.transparent #rosterDisplay{background:transparent;box-shadow:none;border-color:transparent}.light #shot{color:#89511e}

/* 3.1 sport-specific hierarchy */
.rules{text-align:center;color:var(--muted);font-size:clamp(11px,1.1vw,17px);margin:20px 0 0;line-height:1.8}.scores{align-items:start;gap:2.4vw;padding:25px 0 30px}.scores article{padding:18px;border:1px solid var(--line);border-radius:15px;background:#708b6a08}.scores h2{font-size:clamp(20px,2.8vw,42px);margin:8px 0 20px;min-height:1.5em}.score-label{color:var(--muted);font-size:clamp(11px,1.1vw,17px);letter-spacing:1px}.scores strong{line-height:1.15;margin:4px 0 22px;font-size:clamp(76px,10.5vw,160px)}.metrics{display:flex;justify-content:center;gap:9px;flex-wrap:wrap}.metrics>div{background:#7893690c;border:1px solid var(--line);border-radius:8px;padding:10px 13px;min-width:80px;flex:1}.metrics span{display:block;font-size:clamp(10px,1vw,15px);color:var(--muted);white-space:nowrap}.metrics b{display:block;font-size:clamp(22px,2.5vw,38px);margin-top:4px;font-variant-numeric:tabular-nums}.home .metrics b{color:var(--home)}.away .metrics b{color:var(--away)}.time{align-self:center;padding:15px 0}.time>span{font-size:clamp(10px,1vw,16px)}#clock{line-height:1.4}#shot{border:1px solid #c9954a66;background:#b7803310;padding:10px 12px;border-radius:9px;white-space:nowrap;font-size:clamp(16px,2.3vw,34px)}#shot.urgent{color:#ff9c83;border-color:#d9785a}#status{font-size:clamp(10px,1vw,15px)}.serve{display:inline-block;min-width:70px;min-height:26px;line-height:26px;font-size:12px}.serve.has-serve{border:1px solid var(--line);background:#95b67718;padding:0 10px;border-radius:18px}.away .serve{color:var(--away)}.history{display:block;border-top:1px solid var(--line);padding-top:18px}.history h3{text-align:center;font-size:14px;color:var(--muted);font-weight:500;margin:0 0 12px}.history-scroll{overflow-x:auto}.history table{border-collapse:collapse;width:100%;font-size:clamp(12px,1.2vw,18px);table-layout:fixed;text-align:center}.history th{font-size:clamp(10px,1vw,15px);font-weight:400;color:var(--muted);padding:8px;overflow-wrap:anywhere}.history td{border-top:1px solid var(--line);padding:10px 8px;font-variant-numeric:tabular-nums}.history td:last-child{font-size:clamp(10px,1vw,14px);color:var(--muted)}.history .current{background:#91b06c12}.history .current td:last-child{color:var(--home)}.set-winner{font-weight:800;color:var(--home)}.match-finished .score-label{color:var(--home)}body[data-sport=football] .metrics{display:grid;grid-template-columns:repeat(4,1fr)}body[data-sport=football] .metrics>div{min-width:0;padding:10px 5px}body[data-sport=football] .metrics>div:first-child b{color:#eac66a}body[data-sport=football] .metrics>div:nth-child(2) b{color:#ef9b8a}.light #shot.urgent{color:#b03222}.light .serve.has-serve{background:#5b8a2220}
.compact .rules{margin:8px 0 0;font-size:11px}.compact .scores{align-items:center;gap:18px;padding:14px 0}.compact .scores article{grid-template-columns:minmax(0,1fr) auto;grid-template-rows:auto auto auto auto;padding:10px 14px;gap:3px 14px;border-radius:8px}.compact .scores h2{grid-column:1;grid-row:1;margin:0;min-height:0;font-size:clamp(15px,2vw,28px)}.compact .scores strong{grid-column:2;grid-row:1/4;font-size:clamp(40px,5.5vw,78px);margin:0;line-height:1.2}.compact .score-label{grid-column:1;grid-row:2;text-align:left;font-size:10px;letter-spacing:0}.compact .serve{grid-column:1;grid-row:3;min-height:19px;line-height:19px;min-width:0;width:fit-content;font-size:10px}.compact .metrics{grid-column:1/-1;grid-row:4;justify-content:flex-start;gap:6px;margin-top:5px;display:flex!important;flex-wrap:wrap}.compact .metrics>div{display:flex;align-items:center;gap:6px;min-width:0;flex:0 1 auto;padding:3px 7px;border-radius:4px}.compact .metrics span{font-size:10px}.compact .metrics b{font-size:15px;margin:0}.compact .time{padding:0}.compact #shot{font-size:16px;padding:5px;margin:4px 0}.compact .history{margin-top:3px;padding-top:10px}.compact .history h3{font-size:11px;margin:0 0 4px}.compact .history th{font-size:10px;padding:4px}.compact .history td{font-size:12px;padding:5px}.compact .history td:last-child{font-size:10px}.compact .winner{font-size:16px}.compact header h1{font-size:clamp(16px,2vw,25px)}
@media(max-width:700px){.rules{font-size:11px;margin:14px 0 0}.scores{gap:9px;padding:16px 0}.scores article{padding:13px 9px;border-radius:10px}.scores h2{font-size:18px;margin:8px 0 13px;min-height:2.6em}.scores strong{font-size:70px;margin:2px 0 14px}.score-label{font-size:11px}.metrics{gap:5px}.metrics>div{padding:7px 4px;min-width:50px;border-radius:6px}.metrics span{font-size:10px}.metrics b{font-size:24px}.serve{font-size:10px;line-height:22px;min-height:22px;min-width:45px}.time{padding:0 0 13px;gap:9px;flex-wrap:wrap}#clock{font-size:30px}#shot{font-size:19px;margin:0;padding:5px 9px}#status{font-size:10px}.history{padding-top:14px}.history h3{font-size:12px}.history th{font-size:10px}.history td{font-size:13px;padding:9px 4px}.history td:last-child{font-size:10px}body[data-sport=football] .metrics{grid-template-columns:repeat(2,1fr)}.compact .scores{gap:9px}.compact .scores article{padding:9px 8px;gap:3px 8px}.compact .scores h2{font-size:16px;min-height:0}.compact .scores strong{font-size:43px}.compact .score-label{font-size:9px}.compact .metrics>div{padding:3px 5px}.compact .metrics span{font-size:9px}.compact .metrics b{font-size:13px}.compact .time{padding-bottom:10px}.compact .history{padding-top:8px}.compact .rules{font-size:10px}}

@media(min-width:701px){body:not(.compact){padding:2vh 3vw}body:not(.compact) main{padding:3vh 3vw}body:not(.compact) .scores strong{font-size:clamp(70px,min(10.5vw,14vh),160px)}}
@media(min-width:701px) and (max-height:900px){body:not(.compact){padding:12px 3vw}body:not(.compact) main{padding:20px 28px}body:not(.compact) header{padding-bottom:12px}body:not(.compact) header h1{font-size:24px}body:not(.compact) header>div{gap:4px}body:not(.compact) .rules{margin:10px 0 0;font-size:12px}body:not(.compact) .scores{padding:15px 0;gap:24px}body:not(.compact) .scores article{padding:12px}body:not(.compact) .scores h2{font-size:24px;min-height:1.4em;margin:5px 0 10px}body:not(.compact) .scores strong{font-size:clamp(60px,12vh,110px);margin:2px 0 12px}body:not(.compact) .score-label{font-size:12px}body:not(.compact) .metrics>div{padding:7px;min-width:64px}body:not(.compact) .metrics span{font-size:10px}body:not(.compact) .metrics b{font-size:26px;margin-top:2px}body:not(.compact) .serve{font-size:10px;min-height:20px;line-height:20px}body:not(.compact) #clock{font-size:44px}body:not(.compact) #shot{font-size:23px;padding:8px}body:not(.compact) .history{padding-top:10px}body:not(.compact) .history h3{font-size:12px;margin-bottom:4px}body:not(.compact) .history th{font-size:11px;padding:5px}body:not(.compact) .history td{font-size:13px;padding:6px}body:not(.compact) .history td:last-child{font-size:11px}body:not(.compact) footer{margin-top:12px;padding-top:10px}body:not(.compact) .winner{margin-top:12px;padding:10px}}

body.no-clock .scores{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}

body.light[data-sport=football] .metrics>div:first-child b{color:#88621b}body.light[data-sport=football] .metrics>div:nth-child(2) b{color:#b43e31}

.match-context{text-align:center;color:var(--home);font-size:clamp(12px,1.2vw,18px);margin-top:12px;overflow-wrap:anywhere}.compact .match-context{font-size:12px;margin-top:8px}@media(max-width:700px){.match-context{font-size:12px;text-align:left;line-height:1.8}}

.player small{white-space:normal;line-height:1.6;overflow-wrap:anywhere}.metrics>div{min-width:0;overflow-wrap:anywhere}