:root{color-scheme:dark;--bg:#101918;--panel:#172320;--line:#31423e;--text:#edf3ef;--sub:#adc2b8;--accent:#a9efc8;--ink:#12251a;--warn:#f2ce8b;--rail:280px;--right:330px;--hud-top:98px}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font:15px/1.6 "Microsoft YaHei","PingFang SC",sans-serif}a{color:var(--accent);text-underline-offset:4px}button,input,textarea{font:inherit}button{min-height:40px;padding:8px 12px;color:var(--text);background:var(--panel);border:1px solid var(--line);border-radius:6px;cursor:pointer}button:hover:not(:disabled){background:#293c33;border-color:#83a993}button:disabled{opacity:.5;cursor:default}button[aria-pressed=true],#room-advance:not(:disabled){background:var(--accent);color:var(--ink);border-color:var(--accent)}button:focus-visible,input:focus-visible,textarea:focus-visible,video:focus-visible,a:focus-visible{outline:2px solid var(--accent);outline-offset:3px}input,textarea{width:100%;padding:9px 12px;background:var(--bg);color:var(--text);border:1px solid var(--line);border-radius:6px;caret-color:var(--accent)}label,legend{color:var(--sub)}::selection{background:var(--accent);color:var(--ink)}::-webkit-scrollbar{width:7px}::-webkit-scrollbar-thumb{background:#476155;border-radius:4px}button,a,input,textarea{scroll-margin:16px}
.room-header{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:12px 20px;border-bottom:1px solid var(--line)}.room-header a{color:var(--text);text-decoration:none;font-size:20px;font-weight:600}.room-header span{color:var(--sub)}
.room-stage{position:relative;height:calc(100dvh - 70px);min-height:580px;overflow:hidden;background:#060c09}.room-preview,#room-video{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}#room-video{visibility:hidden}.room-stage.live #room-video{visibility:visible}.room-stage.live .room-preview{display:none}.room-cover{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:flex-end;padding:32px;pointer-events:none;background:linear-gradient(0deg,#08150bed,#08150b24 70%)}.room-cover h1{font-size:30px;line-height:1.3;margin:0 0 12px}.room-cover p{max-width:50ch;color:var(--sub);margin:0}.room-stage.live .room-cover{display:none}
.room-top{position:absolute;z-index:4;top:12px;left:20px;right:20px;display:flex;align-items:center;gap:10px 16px;flex-wrap:wrap;background:#101918f5;padding:12px 16px;min-height:64px}.room-top strong{font-size:19px;margin-inline-end:auto}.room-top span{color:var(--sub);font-size:13px;font-variant-numeric:tabular-nums}#room-phase{color:var(--accent);font-size:16px;font-weight:600}.room-top button{font-size:13px;min-height:36px}.room-panel{background:#101918f2;padding:18px;overflow:auto;scrollbar-color:#476155 var(--bg);scrollbar-width:thin}.room-panel h2{font-size:20px;line-height:1.3;margin:0 0 14px}.room-panel h3{font-size:16px;margin:20px 0 8px}.room-panel p{margin:10px 0;color:var(--sub);overflow-wrap:anywhere}
.room-left{position:absolute;z-index:3;top:var(--hud-top);left:20px;bottom:70px;width:var(--rail);display:flex;flex-direction:column;gap:12px;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin}.room-left>.room-panel{flex-shrink:0}.room-session{font-size:13px}.room-session h2{font-size:18px}.room-mode-choices{display:grid;gap:6px}.room-mode-choices button{font-size:14px;text-align:left}#room-roster{list-style:none;margin:12px 0;padding:0;max-height:144px;overflow:auto}#room-roster li{padding:6px 0;border-bottom:1px solid var(--line);overflow-wrap:anywhere}#room-organizer{color:var(--text)}.room-flow{list-style:none;padding:0;margin:16px 0;display:flex;flex-wrap:wrap;gap:4px 12px}.room-flow li{color:var(--sub)}.room-flow li[aria-current=step]{color:var(--accent);font-weight:600;text-decoration:underline;text-underline-offset:4px}.room-flow .flow-complete{color:var(--text)}#room-stage-status{color:var(--warn)}#room-advance{width:100%;margin-top:8px}#room-pause{width:100%;margin-top:8px}
.room-lobby{position:absolute;z-index:3;left:calc(50% + var(--rail)/2);top:var(--hud-top);transform:translateX(-50%);width:min(680px,calc(100% - var(--rail) - 80px));max-height:calc(100% - var(--hud-top) - 78px);padding:24px}.room-lobby h2{font-size:26px}.room-join-row{display:flex;gap:10px;margin-top:8px}.room-join-row button{flex-shrink:0}.room-role-row{display:grid;grid-template-columns:1fr 1fr;gap:8px}.room-role-row button{text-align:left;min-height:48px}fieldset{padding:0;border:0;margin:20px 0 12px;min-width:0}legend{margin-bottom:10px}#room-join-status{color:var(--text);min-height:24px}#room-role-description{font-size:13px}#room-lobby-leave{margin-top:12px}
.room-task ul{list-style:none;margin:12px 0;padding:0}.room-task li{padding:5px 0;font-size:14px}.room-task button{width:100%}.room-task p{font-size:14px}#room-review-result{color:var(--text);font-variant-numeric:tabular-nums}.room-controls{position:absolute;z-index:3;right:20px;top:var(--hud-top);bottom:80px;width:var(--right);max-height:calc(100% - var(--hud-top) - 80px);overscroll-behavior:contain}.room-controls button{margin:4px 4px 4px 0}.room-controls textarea{margin:8px 0}.room-common-actions{margin-top:16px;border-top:1px solid var(--line);padding-top:12px}
.room-telemetry{position:absolute;z-index:2;bottom:68px;left:calc(var(--rail) + 40px);right:calc(var(--right) + 40px);display:flex;flex-wrap:wrap;gap:12px 24px;margin:0;padding:12px 16px;background:#101918ee;pointer-events:none}.room-telemetry div{flex:1 1 100px}.room-telemetry dt{color:var(--sub);font-size:13px}.room-telemetry dd{margin:3px 0 0;font-size:23px;line-height:1.2;font-variant-numeric:tabular-nums}.room-key-hint{position:absolute;z-index:4;bottom:12px;left:20px;right:20px;margin:0;background:#101918f2;padding:10px 14px;color:var(--sub);font-size:13px;pointer-events:none}.room-notice{position:absolute;z-index:8;top:var(--hud-top);left:50%;transform:translateX(-50%);width:min(680px,calc(100% - 48px));margin:0;padding:12px 18px;background:var(--panel);color:var(--warn);text-align:center;pointer-events:none;box-shadow:0 6px 24px #0006}
.room-markers{position:absolute;inset:0;pointer-events:none;z-index:1}.room-marker{position:absolute;transform:translate(-50%,-50%);text-align:center;color:var(--accent);font-size:13px;text-shadow:0 1px 2px #000}.room-marker:before{content:"";display:block;margin:0 auto 5px;width:28px;height:28px;border:2px solid var(--accent);border-radius:50%}.room-station-info{position:absolute;z-index:2;left:calc(var(--rail) + 40px);top:var(--hud-top);width:220px;max-height:calc(100% - 220px);overflow:auto;padding:14px;background:var(--panel);color:var(--text);pointer-events:none}.room-station-info p{font-size:13px;line-height:1.5;margin:8px 0;color:var(--sub)}.room-station-info svg{display:block;width:100%;height:auto;margin-top:12px;background:var(--bg)}.radar-ring{fill:none;stroke:var(--line);stroke-width:1}.radar-sweep{stroke:var(--accent);stroke-width:1.5}.radar-contact{fill:var(--accent)}
.room-information{position:absolute;z-index:7;top:var(--hud-top);right:20px;bottom:70px;width:min(680px,calc(100% - 40px));overflow:auto;overscroll-behavior:contain;background:var(--bg);box-shadow:0 8px 28px #0008;padding:24px}.room-info-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:24px}.room-info-heading h2{margin:0;font-size:23px}.room-details>div{margin-bottom:24px}.room-details h2,.room-report-history h2{font-size:18px;margin:0 0 10px}.room-details p,.room-report-history p{color:var(--sub);max-width:65ch}.room-details ol{padding-left:20px;color:var(--sub)}.room-details li{margin:6px 0}.room-report-history{padding-top:20px;border-top:1px solid var(--line)}.room-report-history ul{list-style:none;padding:0}.room-report-history a{display:block;padding:8px 0;overflow-wrap:anywhere;font-variant-numeric:tabular-nums}
.room-stage:fullscreen,.room-stage.immersive{height:100dvh;min-height:0;max-height:none;width:100vw;aspect-ratio:auto}.room-stage.immersive{position:fixed;inset:0;z-index:1000}body.view-open{overflow:hidden}.panels-hidden .room-left,.panels-hidden .room-controls,.panels-hidden .room-station-info{display:none}.panels-hidden .room-telemetry{left:20px;right:auto;bottom:68px;max-width:780px}[hidden]{display:none!important}
@media(max-width:1550px){:root{--hud-top:116px}.room-top strong{font-size:17px}.room-top{padding:10px 14px;gap:8px 12px}#room-connection{order:1}.room-top button{order:1}}
@media(max-width:1100px){:root{--rail:240px;--right:280px}.room-top{left:12px;right:12px}.room-left{left:12px}.room-controls{right:12px}.room-panel{padding:14px}.room-telemetry{right:calc(var(--right) + 24px);left:calc(var(--rail) + 24px);gap:10px}.room-telemetry dd{font-size:19px}.room-lobby{width:calc(100% - var(--rail) - 52px)}.room-station-info{width:180px;left:calc(var(--rail) + 24px)}}
@media(max-height:760px) and (min-width:851px){.room-session p{margin:6px 0}.room-flow{margin:10px 0}#room-roster{max-height:100px}.room-telemetry dd{font-size:19px}.room-information{padding:18px}}
@media(max-width:850px){.room-header{padding:12px;flex-wrap:wrap}.room-header a{font-size:18px}.room-header span{font-size:13px}.room-stage{height:auto;min-height:740px;padding:250px 12px 70px;overflow:auto}.room-top{position:absolute;gap:6px 10px;left:8px;right:8px;top:8px}.room-top strong{font-size:16px;width:100%}.room-left{position:relative;inset:auto;width:100%;display:flex;overflow:visible;margin-top:12px}.room-lobby{position:relative;left:auto;top:auto;transform:none;width:100%;max-height:none}.room-left{order:2}.room-controls{position:relative;inset:auto;width:100%;max-height:none;margin-top:12px}.room-role-row{grid-template-columns:1fr 1fr}.room-session{font-size:14px}.room-flow{gap:8px}.room-telemetry{position:relative;inset:auto;margin:12px 0}.room-key-hint{position:relative;inset:auto;margin-top:12px}.room-cover{padding:20px}.room-cover h1{font-size:25px}.room-stage.live #room-video{position:absolute;top:0;height:250px;object-fit:contain}.room-marker{display:none}.room-station-info{position:relative;inset:auto;width:100%;max-height:none;margin-top:12px}.room-station-info svg{max-width:220px}.room-stage:fullscreen,.room-stage.immersive{overflow:auto}.room-information{position:fixed;top:150px;right:12px;left:12px;bottom:12px;width:auto}.room-notice{top:180px}.room-join-row{flex-wrap:wrap}.room-join-row input{font-size:16px}.room-join-row button{width:100%}}
@media(prefers-reduced-motion:no-preference){button{transition:background .15s ease-out,border-color .15s ease-out}}
