:root{--bg:#0b0b0d;--panel:#141418;--border:#26262e;--text:#e8e8ea;--muted:#8b8b95;--accent:#5b7cfa;--danger:#e0554b}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--bg);color:var(--text);font:15px/1.5 system-ui,-apple-system,Segoe UI,sans-serif}button{font:inherit;cursor:pointer;border:1px solid var(--border);background:var(--panel);color:var(--text);border-radius:8px;padding:8px 14px;transition:background .15s,border-color .15s}button:hover:not(:disabled){border-color:#3a3a46}button:disabled{opacity:.45;cursor:not-allowed}button.primary{background:var(--accent);border-color:var(--accent);color:#fff;font-weight:600}button.danger{background:var(--danger);border-color:var(--danger);color:#fff;font-weight:600}button.link{color:var(--muted);background:0 0;border:none;padding:4px 6px}button.link:hover{color:var(--text)}input,select{font:inherit;background:var(--panel);color:var(--text);border:1px solid var(--border);border-radius:8px;padding:8px 10px}input:focus,select:focus{outline:2px solid var(--accent);outline-offset:-1px}.lobby{place-items:center;height:100%;padding:24px;display:grid}.lobby-card{text-align:center;width:min(420px,100%)}.lobby-card h1{letter-spacing:-.02em;margin:0 0 8px;font-size:32px}.lobby-tagline{color:var(--muted);margin:0 0 28px}.lobby-card form{gap:8px;margin-bottom:12px;display:flex}.lobby-card input{flex:1}.app{grid-template-rows:auto 1fr auto;height:100%;display:grid}header,footer{border-color:var(--border);border-style:solid;border-width:0;flex-wrap:wrap;align-items:center;gap:12px;padding:10px 16px;display:flex}header{border-bottom-width:1px}footer{border-top-width:1px}.room-name{font-weight:600}.peer-count{color:var(--muted);margin-right:auto}main{min-height:0;padding:16px;position:relative}button.active{border-color:var(--accent);color:var(--accent)}.dot{vertical-align:1px;border-radius:50%;width:8px;height:8px;margin-right:7px;display:inline-block}.grade-excellent{color:#4ec97b}.grade-good{color:#9ad14b}.grade-fair{color:#e8b23c}.grade-poor{color:var(--danger)}.dot.grade-excellent{background:#4ec97b}.dot.grade-good{background:#9ad14b}.dot.grade-fair{background:#e8b23c}.dot.grade-poor{background:var(--danger)}.stats-panel{border:1px solid var(--border);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#101014f5;border-radius:12px;width:300px;max-height:calc(100% - 48px);padding:12px 14px;font-size:13px;position:absolute;top:24px;right:24px;overflow-y:auto}.stats-panel>header{border:none;border-bottom:1px solid var(--border);align-items:center;gap:8px;margin-bottom:6px;padding:0 0 10px;display:flex}.stats-panel>header strong{margin-right:auto}.switch{color:var(--muted);align-items:center;gap:5px;font-size:11px;display:flex}.stats-empty{color:var(--muted);margin:6px 0}.stats-peer+.stats-peer{border-top:1px solid var(--border);margin-top:14px;padding-top:12px}.stats-peer-head{justify-content:space-between;margin:8px 0 6px;font-weight:600;display:flex}.stats-direction h4{text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin:12px 0 4px;font-size:11px;font-weight:600}.stats-row{font-variant-numeric:tabular-nums;justify-content:space-between;gap:12px;padding:2px 0;display:flex}.stats-row>span:first-child{color:var(--muted)}.stats-row .warn{color:#e8b23c}.stats-control{border-top:1px dashed var(--border);margin-top:12px;padding-top:10px}.stats-reason{color:var(--muted);margin:6px 0 0;font-size:12px;line-height:1.4}.stats-reason.action-lower,.stats-reason.action-scale-down{color:#e8b23c}.stats-reason.action-raise,.stats-reason.action-scale-up{color:#4ec97b}.stage{border:1px solid var(--border);background:#000;border-radius:12px;height:100%;position:relative;overflow:hidden}.stage video{object-fit:contain;width:100%;height:100%;display:block}.stage-empty{color:var(--muted);place-items:center;display:grid}.stage-overlay{opacity:0;background:linear-gradient(#0000,#000000bf);align-items:center;gap:12px;padding:10px 12px;transition:opacity .2s;display:flex;position:absolute;inset:auto 0 0}.stage:hover .stage-overlay,.stage:focus-within .stage-overlay{opacity:1}.stage-label{margin-right:auto;font-size:13px}.stage-label em{color:var(--muted);font-style:normal}.stage-actions{gap:8px;display:flex}.stage-actions button{padding:5px 10px;font-size:13px}.sharer-tabs{gap:6px;display:flex}.sharer-tabs button{padding:6px 12px;font-size:13px}.sharer-tabs button.active{border-color:var(--accent);color:var(--accent)}.quality{flex-wrap:wrap;align-items:center;gap:12px;margin-left:auto;display:flex}.quality label{text-transform:uppercase;letter-spacing:.06em;color:var(--muted);flex-direction:column;gap:3px;font-size:11px;display:flex}.quality select{text-transform:none;letter-spacing:normal;color:var(--text);padding:5px 8px;font-size:13px}.quality label.checkbox{flex-direction:row;align-items:center;gap:6px}.error{background:var(--danger);color:#fff;padding:10px 16px;font-size:13px}.stats-note{color:var(--muted);margin:4px 0 0;font-size:12px;line-height:1.4}.stage-gate{color:var(--text);text-align:center;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);background:#000000b8;border:none;border-radius:0;flex-direction:column;justify-content:center;align-items:center;gap:14px;font-size:15px;display:flex;position:absolute;inset:0}.stage-gate span{flex-direction:column;gap:4px;display:flex}.stage-gate em{color:var(--muted);font-size:13px;font-style:normal}.stage-gate-icon{background:var(--accent);color:#fff;border-radius:50%;justify-content:center;align-items:center;width:62px;height:62px;padding-left:4px;font-size:24px}