:root{--bg:#0f172a;--surface:#111c33;--surface-2:#18243f;--text:#f8fafc;--text-dim:#94a3b8;--accent:#22c55e;--accent-strong:#16a34a;--danger:#ef4444;--radius:12px;--radius-sm:8px;--gap:16px;--max-width:720px;font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif}*{box-sizing:border-box}html,body{background:var(--bg);color:var(--text);min-height:100vh;margin:0;padding:0;overflow-x:hidden}.viewer{gap:var(--gap);max-width:var(--max-width);flex-direction:column;margin:0 auto;padding:16px;display:flex}.viewer__header{flex-direction:column;gap:4px;display:flex}.viewer__title{letter-spacing:-.01em;margin:0;font-size:clamp(20px,5vw,28px)}.viewer__subtitle{color:var(--text-dim);margin:0;font-size:14px}.viewer__stream{background:var(--surface);border-radius:var(--radius);overflow:hidden}@media (width>=800px){.viewer__stream{border-radius:0;width:100vw;position:relative;left:50%;transform:translate(-50%)}}.stream-frame{aspect-ratio:16/9;width:100%;position:relative}.stream-frame iframe{border:0;width:100%;height:100%;display:block}.stream-frame__placeholder{color:var(--text-dim);text-align:center;place-items:center;padding:16px;font-size:14px;display:grid;position:absolute;inset:0}.stream-frame__placeholder[hidden]{display:none}.scorecard{background:var(--surface);border-radius:var(--radius);flex-direction:column;gap:12px;padding:16px;display:flex}.scorecard__row{justify-content:space-between;align-items:baseline;gap:12px;display:flex}.scorecard__row--primary{font-size:24px;font-weight:600}.scorecard__score{font-variant-numeric:tabular-nums}.scorecard__row--secondary{color:var(--text-dim);font-size:16px}.scorecard__row--over{flex-direction:column;align-items:stretch;gap:8px}.scorecard__label{color:var(--text-dim);text-transform:uppercase;letter-spacing:.08em;font-size:11px}.over-balls{flex-wrap:wrap;gap:6px;margin:0;padding:0;list-style:none;display:flex}.over-balls li{background:var(--surface-2);border-radius:999px;justify-content:center;align-items:center;min-width:32px;height:32px;padding:0 10px;font-size:13px;font-weight:600;display:inline-flex}.over-balls li[data-kind=boundary]{background:var(--accent-strong)}.over-balls li[data-kind=wicket]{background:var(--danger)}.over-balls li[data-kind=dot]{border:1px solid var(--text-dim);color:var(--text-dim);background:0 0}.over-balls li[data-kind=extra]{color:#1c1917;background:#ca8a04}.viewer__connection{color:var(--text-dim);text-align:center;margin:0;font-size:12px}.viewer__connection[data-status=error]{color:var(--danger)}.viewer__connection[data-status=ok]{color:var(--accent)}.scorecard__updated{color:var(--text-dim);margin:0;font-size:12px}.viewer__footer{justify-content:center;display:flex}.share-button{appearance:none;background:var(--accent);color:#052e16;border-radius:var(--radius-sm);cursor:pointer;border:0;width:100%;max-width:320px;padding:12px 20px;font-size:16px;font-weight:600}.share-button:hover{background:var(--accent-strong);color:var(--text)}.viewer[data-state=error] .scorecard,.viewer[data-state=error] .viewer__stream{opacity:.5}