*{box-sizing:border-box}:root{color-scheme:dark}.boot-error{margin:10px 14px 0;padding:12px 14px;border:1px solid #b3372f;border-radius:9px;background:#3a1b1a;color:#ffc9c4;font-size:14px;line-height:1.6;word-break:break-word}.boot-error[hidden]{display:none}html,body{margin:0;height:100%}body{background:#0e1116;color:#e8ecf2;font:15px/1.5 -apple-system,BlinkMacSystemFont,Segoe UI,PingFang SC,Microsoft YaHei,sans-serif}#app{min-height:100%;display:flex;flex-direction:column}.topbar{display:flex;align-items:center;justify-content:space-between;padding:12px 18px;border-bottom:1px solid #222a35;background:#12171f}.brand{font-weight:600;letter-spacing:.5px}.status{font-size:13px;color:#8b98a9}.status.ok{color:#4ade80}.status.warn{color:#fbbf24}.status.bad{color:#f87171}.stage{flex:1;position:relative;display:flex;align-items:center;justify-content:center;min-height:45vh;padding:12px}.remote{position:relative;width:min(100%,1100px);aspect-ratio:16/9;background:#000;border-radius:14px;overflow:hidden;border:1px solid #222a35}.remote video{display:block;position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:contain;background:#000}.placeholder{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;color:#6b7686;font-size:14px;pointer-events:none}.local{position:absolute;right:22px;bottom:22px;z-index:6;width:clamp(96px,22vw,220px);aspect-ratio:3/4;background:#000;border-radius:10px;overflow:hidden;border:2px solid #2f3a49;box-shadow:0 6px 24px #00000080}.local video{width:100%;height:100%;object-fit:cover;transform:scaleX(-1)}.local-tag{position:absolute;left:6px;bottom:6px;background:#0000008c;padding:2px 7px;border-radius:5px;font-size:11px}.join{width:min(100%,420px);margin:0 auto;padding:20px 20px 32px;display:flex;flex-direction:column;gap:12px}.join h1{margin:0;font-size:20px}.hint,.tip{margin:0;color:#8b98a9;font-size:13px}.tip{margin-top:6px;line-height:1.6}.join label{display:flex;flex-direction:column;gap:6px;font-size:13px;color:#aab6c5}.join label small{font-weight:400;color:#6b7686}.join input,.join select{width:100%;padding:11px 12px;border-radius:9px;border:1px solid #2f3a49;background:#161c26;color:#e8ecf2;font-size:15px;outline:none}.join select{-webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:pointer}.join input:focus,.join select:focus{border-color:#4c8bf5}button{padding:12px 16px;border-radius:9px;border:1px solid #2f3a49;background:#1b2330;color:#e8ecf2;font-size:15px;cursor:pointer}button:disabled{opacity:.55;cursor:not-allowed}.primary{background:#2f6fed;border-color:#2f6fed;font-weight:600}.ghost{background:transparent}.danger{background:#b3372f;border-color:#b3372f}.err{min-height:18px;margin:0;color:#f87171;font-size:13px}.controls{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;padding:14px 12px calc(14px + env(safe-area-inset-bottom));border-top:1px solid #222a35;background:#12171f}.controls button{flex:1 1 auto;min-width:92px;max-width:180px}.screen{position:absolute;top:12px;right:12px;bottom:12px;left:12px;z-index:5;background:#000;border-radius:14px;overflow:hidden;border:1px solid #222a35}.screen[hidden]{display:none}.screen video{width:100%;height:100%;object-fit:contain;background:#000}.local{cursor:zoom-in}.local.zoomed{position:fixed;top:0;right:0;bottom:0;left:0;z-index:80;width:100vw;height:100vh;aspect-ratio:auto;border:0;border-radius:0;box-shadow:none;cursor:zoom-out}.local.zoomed video{object-fit:contain}.local.zoomed .local-tag{display:none}.remote{cursor:zoom-in}.remote.zoomed{position:fixed;top:0;right:0;bottom:0;left:0;z-index:90;width:100vw;height:100vh;aspect-ratio:auto;border:0;border-radius:0;cursor:zoom-out}.chat{position:fixed;right:16px;bottom:calc(84px + env(safe-area-inset-bottom));width:min(330px,calc(100vw - 32px));max-height:58vh;z-index:70;display:flex;flex-direction:column;background:#12171f;border:1px solid #222a35;border-radius:12px;box-shadow:0 12px 32px #0000008c}.chat[hidden]{display:none}.chat-head{display:flex;align-items:center;justify-content:space-between;padding:8px 12px;border-bottom:1px solid #222a35;font-size:14px}.chat-close{background:transparent;border:0;color:#8b98a9;padding:2px 6px;font-size:15px;min-width:0;flex:0 0 auto}.chat-list{flex:1;overflow-y:auto;padding:10px 12px;display:flex;flex-direction:column;gap:8px;font-size:14px}.msg{max-width:86%;padding:7px 10px;border-radius:10px;background:#1b2330;word-break:break-word;line-height:1.45}.msg.me{align-self:flex-end;background:#2f6fed}.msg .who{display:block;font-size:11px;opacity:.7;margin-bottom:2px}.chat-form{display:flex;gap:6px;padding:8px;border-top:1px solid #222a35}.chat-form input{flex:1;padding:9px 10px;border-radius:8px;border:1px solid #2f3a49;background:#161c26;color:#e8ecf2;font-size:14px;outline:none}.chat-form input:focus{border-color:#4c8bf5}.chat-form button{padding:8px 12px;font-size:14px}@media(min-width:760px){#app{max-width:1200px;margin:0 auto}}@media(max-width:760px){.stage{padding:8px}.local{right:12px;bottom:12px}.controls{gap:6px;padding:10px 8px calc(10px + env(safe-area-inset-bottom))}.controls button{flex:1 1 calc(33.33% - 6px);min-width:0;font-size:13px;padding:10px 6px}.chat{right:8px;left:8px;width:auto;bottom:calc(78px + env(safe-area-inset-bottom));max-height:50vh}}