:root{--fg:#d7e1ee;--dim:#7d8899;--accent:#39a7ff;--warm:#ff9a2e;--bad:#ff3b2f;--panel:#080b10b8;--line:#8caad224;color:var(--fg);background:#030406;font-family:JetBrains Mono,ui-monospace,SFMono-Regular,Menlo,monospace}*{box-sizing:border-box}html,body,#root{background:#030406;height:100%;margin:0;overflow:hidden}canvas{touch-action:none;display:block}button{font:inherit;color:inherit}.fade{opacity:0;pointer-events:none;z-index:5;background:#000;position:fixed;inset:0}.letterbox .bar{z-index:4;pointer-events:none;background:#000;height:0;transition:height .9s cubic-bezier(.6,0,.2,1);position:fixed;left:0;right:0;overflow:hidden}.letterbox .top{top:0}.letterbox .bottom{align-items:center;display:flex;bottom:0}.letterbox.on .bar{height:9vh}.caption{letter-spacing:.22em;text-transform:uppercase;color:var(--dim);white-space:nowrap;margin-left:6vw;font-size:clamp(11px,1.3vw,15px)}.brand{z-index:6;pointer-events:none;flex-direction:column;gap:8px;display:flex;position:fixed;top:16px;left:16px}.logo{letter-spacing:.5em;color:var(--fg);text-shadow:0 0 18px #39a7ff99;font-size:13px}.stats{color:var(--dim);flex-wrap:wrap;gap:6px 14px;font-size:12px;display:flex}.stats b{color:var(--fg);font-weight:500}.pill{border:1px solid var(--line);border-radius:99px;padding:0 8px;font-size:11px}.pill.link{color:var(--fg);pointer-events:auto;border-color:#39a7ff73;text-decoration:none}.pill.link:hover{background:#39a7ff26}.pill.warn{color:var(--warm);border-color:var(--warm)}.modes{z-index:6;background:var(--panel);border:1px solid var(--line);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:10px;gap:2px;padding:3px;display:flex;position:fixed;top:16px;right:16px}.modes button{color:var(--dim);cursor:pointer;background:0 0;border:0;border-radius:7px;padding:6px 12px;font-size:12px}.modes button.on{color:var(--fg);background:#39a7ff29}.modes button:hover{color:var(--fg)}.tv-exit{z-index:6;opacity:0;background:var(--panel);border:1px solid var(--line);cursor:pointer;border-radius:8px;padding:4px 10px;transition:opacity .3s;position:fixed;top:12px;right:12px}.tv-exit:hover{opacity:1}.alarms{z-index:6;flex-direction:column;gap:6px;display:flex;position:fixed;bottom:calc(9vh + 16px);left:16px}.alarm{color:#ffd2cc;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#280606cc;border:1px solid #ff3b2f80;border-radius:8px;padding:7px 12px;font-size:12px;animation:.4s ease-out in}.alarm .dot{background:var(--bad);width:7px;height:7px;box-shadow:0 0 10px var(--bad);border-radius:50%;margin-right:6px;animation:1s steps(2,end) infinite blink;display:inline-block}@keyframes blink{50%{opacity:.2}}@keyframes in{0%{opacity:0;transform:translateY(6px)}}.details{z-index:6;background:var(--panel);border:1px solid var(--line);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-radius:14px;width:min(340px,100vw - 32px);max-height:calc(100vh - 96px);padding:16px 16px 12px;font-size:12px;animation:.3s ease-out in;position:fixed;top:64px;right:16px;overflow:auto}.details h2{letter-spacing:.12em;text-transform:uppercase;margin:0 0 12px;font-size:15px;font-weight:500}.details .close{color:var(--dim);cursor:pointer;background:0 0;border:0;font-size:20px;position:absolute;top:8px;right:10px}.kv{grid-template-columns:auto 1fr;gap:5px 14px;margin-bottom:12px;display:grid}.kv span{color:var(--dim)}.kv b{text-align:right;font-weight:500}.ok{color:#5ee08a}.bad{color:var(--bad)}.guests{border-top:1px solid var(--line);gap:5px;margin:0;padding:10px 0 0;list-style:none;display:grid}.guests li{grid-template-columns:34px 1fr 70px;align-items:center;gap:8px;display:grid}.guests li.down{color:var(--bad)}.guests .id{color:var(--dim)}.guests em{color:#a37bff;margin-left:6px;font-size:10px;font-style:normal}.guests .bar{background:#ffffff0f;border-radius:2px;height:4px;overflow:hidden}.guests .bar i{background:linear-gradient(90deg, var(--accent), var(--warm));height:100%;transition:width .6s;display:block}.disks{border-top:1px solid var(--line);flex-wrap:wrap;gap:4px;margin-top:10px;padding-top:10px;display:flex}.disks i{background:#2c6fc0;border-radius:2px;width:18px;height:8px}.disks i.warn{background:var(--warm)}.disks i.fail{background:var(--bad)}@media (width<=600px){.details{max-height:45vh;top:auto;bottom:calc(9vh + 12px)}.modes button{padding:6px 9px}}
