﻿:root{font-family:'Segoe UI','Malgun Gothic',sans-serif;font-synthesis:none;--panel:#fff;--line:#eeedf5;--muted:#9a98ab;--input:#faf9fd;--ink:#3c3553;--purple:#8b6cde}html.dark{color-scheme:dark;--panel:#1b1c2b;--line:#2c2b40;--muted:#9391a9;--input:#232435;--ink:#e6e2f2}body{margin:0}.shell{display:flex;min-height:100vh}.rail{width:84px;flex-shrink:0;position:fixed;inset:0 auto 0 0;background:var(--panel);border-right:1px solid var(--line);display:flex;align-items:center;flex-direction:column;gap:16px;padding:27px 0;z-index:20}.brand{background:#9071df;color:white;border-radius:16px;width:43px;height:43px;display:grid;place-items:center;font-size:30px;box-shadow:0 7px 18px #9c80df33}.rail-label{font-size:9px;letter-spacing:2px;color:#b4a4d4;font-weight:700}.rail-item{width:43px;height:43px;display:grid;place-items:center;border-radius:13px;font-size:23px;color:#aaa5bd;cursor:pointer}.rail-item:hover,.rail-item.selected{color:#8c6bd5;background:#f1edfd}.dark .rail-item.selected{background:#32284d}.workspace{margin-left:84px;padding:32px 34px;width:calc(100% - 84px);max-width:1900px}.dashboard-grid{display:grid;grid-template-columns:minmax(250px,300px) minmax(350px,1fr) minmax(240px,300px);gap:22px;align-items:start}.panel{background:var(--panel);border:1px solid var(--line);border-radius:21px;padding:23px;box-shadow:0 3px 16px #35315a03}.panel h2{font-size:14px;font-weight:700;letter-spacing:-.2px;color:var(--ink)}h3{font-size:13px;font-weight:600}.section-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:22px}.eyebrow{font-size:9px;letter-spacing:1.5px;color:#aaa0bf;font-weight:600}.summary{border-radius:19px;padding:21px 24px;position:relative;display:flex;flex-direction:column;min-height:143px;color:#655278}.summary-label{font-size:12px;font-weight:600;opacity:.75}.summary strong{font-size:32px;line-height:1.5;letter-spacing:-1px;font-weight:650}.summary em{font-size:14px;font-style:normal;opacity:.45;letter-spacing:0}.summary small{font-size:10px;opacity:.6}.summary-icon{position:absolute;right:21px;top:18px;font-size:25px;opacity:.35}.dark .summary{color:#d8cbee}.icon-tile{width:38px;height:38px;border-radius:12px;background:#f1ecff;color:#9b7add;display:grid;place-items:center;font-size:25px}.dark .icon-tile{background:#372a54}.muted{color:var(--muted)}.status-pill{font-size:10px;border:1px solid var(--line);border-radius:20px;padding:6px 11px;white-space:nowrap;color:var(--muted)}.status-pill.good{color:#449d83;background:#ecf8f2;border-color:#ddf0e6}.dark .status-pill.good{background:#203f34}.status-pill.bad{color:#d7798e;background:#fceef2}.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:10px 14px;border-radius:10px;font-size:12px;font-weight:600;white-space:nowrap;transition:.2s;cursor:pointer;border:1px solid transparent}.btn:hover{filter:brightness(.97);transform:translateY(-1px)}.btn:disabled{opacity:.45;cursor:wait}.primary{color:#fff;background:#9273df;box-shadow:0 4px 10px #9273df22}.secondary{background:var(--input);border-color:var(--line);color:#9690ab}.danger{background:#fff1f3;color:#cf7b8d}.dark .danger{background:#3d2633}.small{padding:6px 9px;font-size:10px}.field-label{font-size:11px;color:var(--muted);display:block;margin-bottom:12px;font-weight:500}.field-label input,.field-label select{margin-top:7px}input:not([type=checkbox]):not([type=color]):not([type=range]):not([type=file]),select{width:100%;background:var(--input);border:1px solid var(--line);padding:10px 11px;border-radius:9px;color:var(--ink);font-size:12px;outline:none;min-width:0}input:focus,select:focus{border-color:#aa91e4!important;box-shadow:0 0 0 3px #9c7de612}input[type=checkbox]{accent-color:#9875de;width:15px;height:15px;flex-shrink:0}input[type=color]{width:30px;height:24px;border:0;background:none;border-radius:5px;cursor:pointer}input[type=range]{width:100%;accent-color:#9674df}input[type=file]{font-size:10px;width:100%;padding:8px 0}.help{font-size:10px;line-height:1.7;color:var(--muted);margin-top:6px}.check{display:flex;align-items:center;gap:7px;font-size:11px;color:var(--muted);margin-bottom:8px;cursor:pointer}.preset{flex:1;background:var(--input);border:1px solid var(--line);padding:5px 2px;border-radius:6px;font-size:10px;color:var(--muted);cursor:pointer}.preset:hover{color:#9675da;border-color:#c3afea}.divider{height:1px;background:var(--line);margin:21px 0}.details{border-top:1px solid var(--line);padding-top:13px;font-size:11px;color:var(--muted)}summary{cursor:pointer;font-weight:500}.controls-strip{padding:12px 14px;background:var(--input);border-radius:11px}.controls-strip .check{margin:0}.board-wrap{max-width:100%;margin:auto}.number-grid{display:grid;gap:3px;background:var(--board-image,none);background-size:cover;background-position:center}.number-cell{aspect-ratio:1;display:flex;align-items:center;justify-content:center;min-width:0;overflow:hidden;border:1px solid #e9e6f1;border-radius:7px;position:relative;transition:background .25s,transform .2s;cursor:pointer;padding:2px;font-weight:500;line-height:1.2;overflow-wrap:anywhere}.number-cell:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 3px 8px #9178bc22}.number-cell:disabled{cursor:default}.number-cell.picked{animation:reveal .5s ease}.number-cell .cell-num{position:absolute;top:3px;left:4px;font-size:8px;opacity:.4}.number-cell.won{box-shadow:0 0 0 1px #9f81e344}.board-tip{font-size:11px;text-align:center;color:var(--muted);line-height:1.7;padding:9px 0;overflow-wrap:anywhere}.overlay .board-tip{color:var(--ink);background:#ffffffcc;border-radius:6px}.legend{display:inline-block;width:8px;height:8px;border-radius:3px;margin-right:5px;border:1px solid #cfc8dc55}.progress-track{height:5px;background:var(--input);border-radius:8px;overflow:hidden}.progress-track div{height:100%;background:linear-gradient(90deg,#c5b2f5,#9875df);width:0;transition:width .4s}.filter{font-size:11px;padding:6px 11px;border-radius:8px;color:var(--muted);cursor:pointer}.filter.active{background:#f1ebff;color:#9272d3}.dark .filter.active{background:#342747}.filter span{font-size:9px;margin-left:4px}.live-dot{width:7px;height:7px;border-radius:100%;background:#9bcebd;box-shadow:0 0 0 4px #9bcebd18}.result{display:flex;align-items:center;gap:10px;padding:15px 0;border-bottom:1px solid var(--line)}.result:last-child{border-bottom:0}.result-icon{width:33px;height:33px;border-radius:11px;background:var(--input);display:grid;place-items:center;font-size:12px;color:#b8afc9;flex-shrink:0}.result.win .result-icon{background:#eee6ff;color:#a388d4}.dark .result.win .result-icon{background:#3a2c50}.result-name{font-size:11px;font-weight:600;color:var(--ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:130px}.result-meta{font-size:9px;color:var(--muted);margin-top:5px}.result-label{font-size:11px;color:#b6adbf;text-align:right;max-width:72px;overflow-wrap:anywhere}.result.win .result-label{color:#9571cf}.empty{text-align:center;padding:45px 5px;color:var(--muted);font-size:11px;line-height:2}.empty span{display:block;font-size:32px;color:#d4c8ed;margin-bottom:7px}.feed-panel #results-feed{max-height:610px;overflow:auto}.winner-card{text-align:center}.winner-card>span{color:#b39bdf}.winner-entry{font-size:11px;padding:10px;border-radius:10px;background:var(--input);margin-bottom:7px;display:flex;justify-content:space-between}.dirty-dot{width:5px;height:5px;border-radius:100%;background:#a8cebd}.dirty-dot.dirty{background:#e1b67f}#toast{position:fixed;bottom:28px;left:50%;transform:translate(-50%,20px);background:#40364f;color:white;border-radius:12px;padding:13px 20px;font-size:12px;max-width:90vw;opacity:0;pointer-events:none;transition:.2s;z-index:100}#toast.show{opacity:1;transform:translate(-50%,0)}dialog{max-width:620px;width:92vw;border:1px solid var(--line);border-radius:20px;padding:25px;background:var(--panel);color:var(--ink);max-height:90vh;overflow:auto;margin:auto}dialog::backdrop{background:#19152977;backdrop-filter:blur(4px)}#winner-picker .number-cell{font-size:13px}#winner-picker .selected{background:#c8b6f0!important;color:#503778!important}button,a,input,select{touch-action:manipulation}button:focus-visible,a:focus-visible{outline:3px solid #b69be8;outline-offset:3px}.overlay{background:transparent!important;margin:0;padding:12px;width:max-content;max-width:100vw;--ink:#3c3553}.overlay #overlay-board{width:var(--overlay-width,560px);max-width:calc(100vw - 24px)}.overlay .number-cell{border-radius:4px;border-color:#9885bc99}.overlay-status{font-size:11px;color:#a37bd9;position:fixed;bottom:8px;left:8px}.overlay audio{display:none}.sound-row{display:flex;gap:6px;align-items:center;margin-top:10px}.sound-row label{font-size:10px;color:var(--muted);width:48px;flex-shrink:0}.sound-row select{flex:1}.color-control{display:flex;justify-content:space-between;align-items:center;font-size:10px;color:var(--muted)}@keyframes reveal{0%{transform:scale(.8);opacity:.4}65%{transform:scale(1.06)}100%{transform:scale(1)}}@media(min-width:1600px){.workspace{padding:38px 48px}.dashboard-grid{grid-template-columns:310px minmax(400px,1fr) 320px;gap:27px}.panel{padding:26px}}@media(max-width:1190px){.workspace{padding:25px 20px}.dashboard-grid{grid-template-columns:260px minmax(300px,1fr)}.dashboard-grid>section:last-child{grid-column:1/-1;display:grid;grid-template-columns:2fr 1fr}.dashboard-grid>section:last-child>div:last-child{display:none}}@media(max-width:780px){.rail{width:58px;padding:20px 0}.brand{width:35px;height:35px;border-radius:12px}.rail-item{width:35px;height:35px}.rail-label{font-size:7px}.workspace{margin-left:58px;width:calc(100% - 58px);padding:20px 14px}.workspace h1{font-size:21px}.dashboard-grid{display:flex;flex-direction:column}.dashboard-grid>section{width:100%}.dashboard-grid>section:first-child{order:2}.dashboard-grid>section:nth-child(2){order:1}.dashboard-grid>section:last-child{order:3;display:flex}.summary{padding:16px;min-height:130px}.summary strong{font-size:27px}.summary-icon{right:12px;top:12px}.panel{padding:18px;border-radius:16px}.number-grid{gap:2px}.number-cell{border-radius:4px}.connection h2{font-size:12px}.connection .status-pill{font-size:8px;padding:5px 7px}.board-panel .controls-strip{gap:10px}.board-panel .check{font-size:10px}}

.history-select{max-width:290px}.history-table-scroll{max-height:560px;overflow:auto;border:1px solid var(--line);border-radius:12px}.history-table{width:100%;min-width:1050px;border-collapse:separate;border-spacing:0;font-size:12px;color:var(--ink)}.history-table th{position:sticky;top:0;z-index:1;background:var(--input);font-size:11px;font-weight:600;color:var(--muted);padding:14px 13px;white-space:nowrap;text-align:left;border-bottom:1px solid var(--line)}.history-table td{padding:13px;border-bottom:1px solid var(--line);vertical-align:top;line-height:1.7;overflow-wrap:anywhere}.history-table tbody tr:nth-child(even){background:var(--input)}.history-table tbody tr:last-child td{border-bottom:0}.history-table th:nth-child(1){width:100px}.history-table th:nth-child(2){width:145px}.history-table th:nth-child(3){width:155px}.history-table th:nth-child(4){width:30%}.history-table th:nth-child(5),.history-table th:nth-child(7){text-align:right;width:90px}.history-table td:nth-child(5),.history-table td:nth-child(7){text-align:right;font-variant-numeric:tabular-nums}.history-table th:nth-child(6){width:110px}.history-table th:nth-child(8){width:110px}.history-table .win-label{font-weight:600;color:#9670d6}.history-table .history-empty{text-align:center;padding:45px;color:var(--muted)}.detailed-history{min-width:0;max-width:100%}.history-chat{white-space:pre-wrap;max-width:500px;overflow-wrap:anywhere}@media(max-width:780px){.history-select{max-width:100%}.history-table-scroll{max-height:420px}}

/* Broadcast captions: one readable line scrolling like the reference overlay. */
.board-tip,.overlay .board-tip{position:relative;overflow:hidden;white-space:nowrap;height:1.55em;min-height:1.55em;padding:0;margin:4px 0;border-radius:3px;background:rgba(8,8,14,.86);color:#fff;font-size:var(--tip-font-size,24px);font-weight:700;line-height:1.55;text-align:left;letter-spacing:-.02em;text-shadow:0 1px 2px #0009}
.board-tip-text{position:absolute;top:0;left:0;display:inline-block;min-width:100%;padding:0 6px;white-space:nowrap;will-change:transform;animation:board-caption-scroll 10s linear infinite}
@keyframes board-caption-scroll{0%{transform:translateX(50%);opacity:0}10%{opacity:1}90%{opacity:1}100%{transform:translateX(-100%);opacity:0}}
@media(prefers-reduced-motion:reduce){.board-tip,.overlay .board-tip{height:auto;overflow-x:auto}.board-tip-text{position:static;animation:none;transform:none;opacity:1}}
