:root { --st-ink:#101820; --st-muted:#687078; --st-line:#d8dde2; --st-paper:#fff; --st-bg:#eef1f4; --st-accent:#ef6c00; }
.st-app { max-width:1050px; margin:30px auto 80px; padding:0 18px; color:var(--st-ink); font-family:Arial,sans-serif; }
.st-app * { box-sizing:border-box; }
.st-screen[hidden] { display:none !important; }
.st-page-heading { text-align:center; margin-bottom:22px; }
.st-page-heading h1 { margin:3px 0 6px; font-size:clamp(2rem,5vw,3.3rem); }
.st-page-heading p { margin:0; color:var(--st-muted); }
.st-kicker { font-size:.73rem; letter-spacing:.16em; font-weight:900; color:var(--st-accent) !important; }
.st-card { background:var(--st-paper); border:1px solid var(--st-line); border-radius:14px; padding:20px; box-shadow:0 4px 14px rgba(16,24,32,.07); }
.st-team-setup-grid,.st-lineup-grid { display:grid; grid-template-columns:1fr 1fr; gap:20px; }
.st-team-setup { border:2px solid var(--st-line); border-radius:12px; padding:18px; }
.st-team-setup legend { font-weight:900; letter-spacing:.1em; padding:0 8px; }
.st-team-setup label,.st-game-options label { display:grid; gap:6px; margin-bottom:14px; font-size:.85rem; font-weight:800; }
.st-team-setup input,.st-team-setup textarea,.st-game-options input,.st-game-options select { width:100%; padding:10px; border:1px solid #aeb6be; border-radius:7px; font:inherit; background:#fff; }
.st-team-setup textarea { resize:vertical; font-family:monospace; line-height:1.45; }
.st-color-row,.st-game-options { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.st-hint { color:var(--st-muted); font-weight:400; }
.st-primary,.st-secondary,.st-entry-controls button,.st-clock-controls button,.st-entry-nav button { border:0; border-radius:9px; padding:13px 17px; font-weight:900; cursor:pointer; background:#e5e9ed; color:#111; }
.st-primary { background:var(--st-ink); color:#fff; }
.st-secondary { border:2px solid var(--st-ink); background:#fff; }
.st-wide { display:block; width:100%; font-size:1rem; }
.st-centered-actions { display:flex; justify-content:center; gap:10px; margin-top:15px; }
.st-error { min-height:1.2em; color:#b00020; font-weight:800; text-align:center; }
.st-lineup-team { padding:20px; border-radius:14px; border-top:8px solid var(--team-color); background:#fff; box-shadow:0 4px 14px rgba(0,0,0,.08); }
.st-lineup-team h2 { margin-top:0; }
.st-roster-choice { display:flex; align-items:center; gap:11px; padding:10px; margin:7px 0; border:2px solid var(--st-line); border-radius:9px; cursor:pointer; }
.st-roster-choice:has(input:checked) { border-color:var(--team-color); background:#f2f5f7; }
.st-roster-choice input { width:20px; height:20px; }
.st-jersey-small { min-width:45px; font-size:1.35rem; font-weight:900; }
.st-scoreboard { display:grid; grid-template-columns:1fr 220px 1fr; border-radius:15px; overflow:hidden; background:#12171d; color:#fff; box-shadow:0 6px 18px rgba(0,0,0,.2); }
.st-score-team,.st-score-center { padding:19px; text-align:center; }
.st-score-team { background:var(--team-color); color:var(--team-text); }
.st-score-name { font-size:1.05rem; font-weight:900; text-transform:uppercase; }
.st-score { font:4rem/1 'clockFont',monospace; margin:5px; }
.st-score-meta { font-size:.78rem; font-weight:900; min-height:1em; }
.st-period { font-weight:900; letter-spacing:.1em; }
.st-clock { min-height:60px; font:3.4rem/1.1 'clockFont',monospace; }
.st-clock-display { display:inline-block; min-width:4.4ch; border-radius:6px; cursor:text; outline:2px solid transparent; outline-offset:3px; }
.st-clock-display:hover,.st-clock-display:focus-visible { outline-color:rgba(255,255,255,.45); }
.st-clock-edit { grid-area:auto; display:block; width:5.2ch; max-width:100%; margin:0 auto; padding:0 4px; border:2px solid #f6b73c; border-radius:6px; background:#fff; color:#111; font:inherit; line-height:1.05; text-align:center; }
.st-clock-toggle { grid-area:auto; justify-self:center; min-width:150px; margin-top:5px; padding:9px 14px; border:2px solid #70e09b; border-radius:8px; background:#176b38; color:#fff; cursor:pointer; font-size:.76rem; font-weight:1000; letter-spacing:.04em; }
.st-clock-toggle.is-running { border-color:#ff9c9c; background:#a51d2d; }
.st-clock-hint { margin-top:5px; color:#aeb7c0; font-size:.6rem; letter-spacing:.03em; }
.st-clock-feedback { min-height:.8rem; margin-top:2px; color:#ffd166; font:700 .65rem/1.2 Arial,sans-serif; }
.st-current-five { display:grid; grid-template-columns:1fr 1fr; gap:15px; margin:15px 0; }
.st-five-team { display:flex; align-items:center; justify-content:center; gap:8px; padding:10px; border:1px solid rgba(0,0,0,.2); border-radius:12px; background:var(--team-color); color:var(--team-text); box-shadow:0 2px 7px rgba(0,0,0,.16); }
.st-five-label { font-size:.68rem; font-weight:900; color:var(--st-muted); }
.st-five-label { color:inherit; opacity:.8; }
.st-five-number { display:grid; align-content:center; width:54px; height:54px; min-width:0; color:var(--team-text); text-align:center; overflow:hidden; }
.st-five-number b { font-size:1.55rem; line-height:1; }
.st-five-number small { overflow:hidden; max-width:100%; opacity:0; font-size:.55rem; line-height:1.1; text-overflow:ellipsis; white-space:nowrap; transition:opacity .12s ease; }
.st-five-number:hover small,.st-five-number:focus-within small { opacity:1; }
.st-game-grid { display:grid; grid-template-columns:minmax(0,2fr) minmax(260px,1fr); gap:15px; align-items:start; }
.st-side-stack { display:grid; gap:15px; }
.st-card h2 { font-size:1rem; letter-spacing:.07em; margin:0 0 13px; }
.st-entry-card { min-height:380px; display:flex; flex-direction:column; }
.st-entry-prompt { text-align:center; font-size:1.35rem; font-weight:1000; margin-bottom:18px; }
.st-entry-controls { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:11px; flex:1; align-content:start; min-width:0; }
.st-entry-controls button { grid-area:auto; justify-self:stretch; width:100%; min-width:0; min-height:72px; font-size:1.05rem; border:3px solid transparent; }
.st-entry-controls.is-player-selection { grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; }
.st-player-group { min-width:0; border:1px solid rgba(0,0,0,.22); border-radius:12px; padding:12px; background:#f7f9fa; box-shadow:0 2px 7px rgba(0,0,0,.12); }
.st-player-group h3 { overflow:hidden; margin:0 0 10px; color:var(--team-color); font-size:.82rem; font-weight:1000; letter-spacing:.08em; text-align:center; text-overflow:ellipsis; text-transform:uppercase; white-space:nowrap; }
.st-player-list { display:grid; grid-template-columns:minmax(0,1fr); gap:10px; }
.st-entry-controls .st-player-button { display:grid; grid-template-rows:2.15rem 1rem; place-content:center; width:100%; min-width:0; height:76px; min-height:76px; padding:8px; border-color:rgba(0,0,0,.22); background:var(--team-color); color:var(--team-text); font-weight:1000; line-height:1; box-shadow:0 2px 6px rgba(0,0,0,.16); overflow:hidden; }
.st-entry-controls .st-player-button span { display:block; min-width:0; max-width:100%; text-align:center; font-variant-numeric:tabular-nums; }
.st-player-number { align-self:end; font-size:2rem; }
.st-player-last-name { align-self:start; overflow:hidden; opacity:0; font-size:.68rem; line-height:1rem; text-overflow:ellipsis; white-space:nowrap; transition:opacity .12s ease; }
.st-player-button:hover .st-player-last-name,.st-player-button:focus-visible .st-player-last-name { opacity:1; }
.st-entry-prompt small { display:block; margin-top:6px; font-size:.72rem; letter-spacing:.08em; }
.st-entry-controls .st-team-rebound { min-height:58px; background:var(--team-color); color:var(--team-text); border-color:rgba(0,0,0,.22); box-shadow:0 2px 6px rgba(0,0,0,.16); }
.st-entry-controls .st-action-primary { background:#1b2733; color:#fff; }
.st-entry-controls .st-danger { background:#9d1028; color:#fff; }
.st-entry-nav { display:flex; gap:8px; justify-content:center; border-top:1px solid var(--st-line); padding-top:15px; margin-top:16px; }
.st-entry-nav button { padding:9px 13px; font-size:.75rem; }
.st-button-grid { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.st-button-grid button { padding:10px 6px; font-size:.75rem; }
.st-clock-period-button { grid-column:1 / -1; width:100%; }
.st-recent { margin:0; padding-left:22px; font-size:.78rem; line-height:1.35; }
.st-recent li { padding:6px 2px; border-bottom:1px solid #eee; }
.st-section-heading { display:flex; align-items:center; justify-content:space-between; gap:10px; }
.st-box-card { margin-top:15px; overflow:hidden; }
.st-box-wrap { overflow-x:auto; margin:0 -20px -20px; }
.st-box-team { display:flex; justify-content:space-between; gap:12px; padding:12px 20px 5px; border-top:5px solid var(--team-color); margin-top:8px; font-size:.75rem; }
.st-table { width:100%; border-collapse:collapse; font-size:.72rem; white-space:nowrap; }
.st-table th,.st-table td { padding:7px 5px; border-bottom:1px solid #e4e7ea; text-align:center; }
.st-table th:first-child,.st-table td:first-child { text-align:left; padding-left:20px; position:sticky; left:0; background:#fff; }
.st-final-review { display:flex; align-items:center; justify-content:space-between; gap:20px; margin:15px 0; padding:18px 20px; border:3px solid #ef6c00; border-radius:13px; background:#fff4e8; }
.st-final-review[hidden] { display:none; }
.st-final-review h2,.st-final-review p { margin:3px 0; }
.st-finalize-button { grid-area:auto; flex:0 0 auto; padding:13px 18px; border:0; border-radius:9px; background:#b42318; color:#fff; cursor:pointer; font-weight:1000; }
.st-history-card { margin-top:15px; }
.st-history { max-height:390px; margin:0; padding:0; overflow:auto; counter-reset:event-history; }
.st-history li { display:grid; grid-template-columns:70px 1fr; gap:10px; padding:8px; border-bottom:1px solid var(--st-line); text-align:left; }
.st-history li strong { font-size:.85rem; }
.st-grading-form { max-width:900px; margin:auto; }
.st-grading-form label { display:block; margin-bottom:8px; font-weight:1000; }
.st-grading-form textarea { width:100%; padding:14px; border:2px solid #9fa8b1; border-radius:9px; font:500 .9rem/1.5 monospace; resize:vertical; }
.st-parsing-preview { margin:14px 0; padding:13px; border-left:5px solid #d99a00; background:#fff7dc; line-height:1.45; }
.st-parsing-preview ul { max-height:160px; overflow:auto; }
.st-dialog { max-width:520px; padding:25px; border:0; border-radius:14px; box-shadow:0 18px 60px rgba(0,0,0,.3); }
.st-dialog::backdrop { background:rgba(10,15,20,.7); }
.st-results-hero { padding:30px; border-radius:16px; background:#101820; color:#fff; text-align:center; }
.st-results-grade { font:5rem/1 'clockFont',monospace; }
.st-results-hero h1 { margin:8px 0 20px; font-size:1rem; letter-spacing:.15em; }
.st-component-scores { display:flex; justify-content:center; gap:35px; }
.st-component-scores strong { color:#ffd166; }
.st-results-grid { display:grid; grid-template-columns:1fr 1fr; gap:15px; margin-top:15px; }
.st-metric-list { display:grid; grid-template-columns:1fr auto; gap:9px 20px; margin:0; }
.st-metric-list dt { color:var(--st-muted); }
.st-metric-list dd { margin:0; font-weight:900; }
.st-diagnostics { margin-top:15px; }
.st-diagnostic { margin:9px 0; padding:12px; border-left:5px solid #d3d8dd; background:#f5f7f8; line-height:1.45; }
.st-diagnostic.is-error { border-color:#b42318; }
.st-diagnostic.is-warning { border-color:#d99a00; }
.st-parser-warning { color:#9c2f00; font-weight:800; }
@media (max-width:760px) { .st-team-setup-grid,.st-lineup-grid,.st-game-grid { grid-template-columns:1fr; } .st-scoreboard { grid-template-columns:1fr 130px 1fr; } .st-score-team,.st-score-center { padding:10px 5px; } .st-score { font-size:2.8rem; } .st-clock { font-size:2.15rem; } .st-current-five { grid-template-columns:1fr; } .st-five-number { font-size:1.6rem; } }
@media (max-width:760px) { .st-final-review { align-items:stretch; flex-direction:column; } .st-results-grid { grid-template-columns:1fr; } .st-component-scores { flex-direction:column; gap:7px; } }
@media (max-width:480px) { .st-entry-controls.is-player-selection { grid-template-columns:1fr; } }