:root{color-scheme:dark;--bg:#07111e;--panel:#101e2c;--edge:#24384b;--muted:#91a4b3;--text:#e9f4ff;--cyan:#72e9ff;--orange:#f0b47e}*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:Inter,'Segoe UI',system-ui,sans-serif;color:var(--text);background:radial-gradient(circle at 28% 25%,#172c3f 0%,#07111e 58%);font-synthesis:none}button,select,input{font:inherit}button{cursor:pointer}.app{max-width:1800px;margin:auto;min-height:100vh;display:flex;flex-direction:column}.topbar{height:85px;display:flex;align-items:center;justify-content:space-between;padding:15px clamp(18px,3vw,56px);border-bottom:1px solid #263748}.identity{display:flex;gap:15px;align-items:center}.logo{background:#12283b;border:1px solid #34536b;border-radius:12px;font-size:29px;font-weight:900;letter-spacing:-2px;padding:7px 13px}.accent{color:var(--cyan)}.identity strong{display:block;letter-spacing:.24em;font-size:15px}.identity small{display:block;color:#95b0c2;font-size:10px;letter-spacing:.17em;padding-top:5px}.tag{font-size:11px;color:#8aa9bd;letter-spacing:.19em}.thin{background:transparent;border:1px solid #344a5d;color:#b8d5e8;border-radius:7px;padding:9px 15px;font-size:10px;letter-spacing:.1em}.thin:hover{border-color:var(--cyan);color:white}.layout{display:grid;grid-template-columns:minmax(0,1fr) 365px;gap:18px;flex:1;padding:23px clamp(16px,2.4vw,40px)}.stage{min-width:0;background:#0a1725;border:1px solid #1f3a4c;border-radius:14px;overflow:hidden;position:relative;display:flex;flex-direction:column}.stage-head,.scene-foot{height:49px;display:flex;justify-content:space-between;align-items:center;padding:0 20px;color:#7f9cae;font-size:10px;letter-spacing:.11em;z-index:2}.stage-head{border-bottom:1px solid #192d3c}.scene-foot{border-top:1px solid #213747;gap:8px}.scene-actions{display:flex;gap:7px}.livetag{color:#d1eefa}.live-dot{width:7px;height:7px;display:inline-block;background:#69f1e0;box-shadow:0 0 10px #69f1e0;border-radius:50%;margin-right:7px}#scene,#offline{display:block;aspect-ratio:1.44;flex:1;min-height:345px;width:100%;touch-action:none}#scene[hidden],#offline[hidden]{display:none}.outcomes{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid #233d4e;background:#0d2131}.outcomes>div{padding:18px 15px;border-right:1px solid #234054}.outcomes>div:last-child{border-right:none}.outcomes small{font-size:9px;letter-spacing:.09em;color:#82a4b7;display:block}.outcomes strong{font-size:21px;display:block;margin-top:7px;font-variant-numeric:tabular-nums;color:#e4faff}.panel{background:linear-gradient(165deg,#142436,#101c2b);border:1px solid #2a4052;border-radius:14px;padding:27px 26px}.eyebrow{letter-spacing:.18em;font-size:10px;color:#84d4e6;font-weight:700}.panel h1{font-size:clamp(28px,2.5vw,40px);font-weight:760;line-height:1.1;letter-spacing:-.03em;margin:20px 0 15px}.panel h1 em{color:var(--cyan);font-style:normal}.intro{color:#a6bdcb;line-height:1.7;font-size:12px;margin-bottom:30px}.group{border-top:1px solid #2a3f51;padding:20px 0 10px}.controlHead{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px;font-size:12px;font-weight:600}.controlHead output{color:var(--cyan);font-variant-numeric:tabular-nums}.group input[type=range]{accent-color:#6fe2f9;width:100%;height:16px;cursor:pointer}.gradient{height:4px;border-radius:6px;background:linear-gradient(90deg,#7434e9,#3058f2,#28cffa,#30fa80,#fff75b,#fd862d,#e12c3c);margin:0 3px}.ticks{display:flex;justify-content:space-between;color:#6d889b;font-size:10px;margin-top:7px}.group select{background:#102839;color:#d3e9fa;border:1px solid #476377;border-radius:7px;width:100%;padding:12px}.mode{padding-bottom:17px}.switches{display:flex;background:#0b1925;border:1px solid #2e475a;border-radius:8px;padding:4px}.switches button{flex:1;line-height:1.2;padding:10px 3px;border:0;background:transparent;color:#84a2b5;font-size:10px;border-radius:5px}.switches button.selected{background:#1d596f;color:#e7faff}.primary{width:100%;border:1px solid #a2f1ff;background:linear-gradient(110deg,#6ad9f2,#85eff2);color:#06283c;font-weight:800;letter-spacing:.06em;font-size:11px;border-radius:8px;padding:16px 9px;margin-top:16px}.note{font-size:10px;color:#829aa9;line-height:1.6;margin-top:19px}footer{display:flex;justify-content:space-between;gap:15px;border-top:1px solid #263748;padding:17px 40px;font-size:9px;letter-spacing:.13em;color:#718a9b}dialog{border:1px solid #427287;border-radius:18px;background:#102233;color:#e6f4fd;max-width:520px;padding:0;box-shadow:0 12px 50px #0009}dialog::backdrop{background:#000b}.guideBody{padding:33px;position:relative}.guideBody h2{font-size:28px;margin:18px 0}.guideBody p{color:#bbccda;font-size:14px;line-height:1.8}.close{float:right;background:transparent;color:white;border:0;font-size:19px}button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid #5be6ff;outline-offset:3px}@media(max-width:1100px){.layout{grid-template-columns:1fr}.panel{max-width:none}.stage #scene,.stage #offline{aspect-ratio:1.65;min-height:345px}.tag{display:none}}@media(max-width:620px){.topbar{height:70px;padding:8px 14px}.topbar>.thin{font-size:9px;padding:9px}.layout{padding:9px;gap:9px}.stage #scene,.stage #offline{aspect-ratio:1.05;min-height:300px}.stage-head,.scene-foot{padding:0 9px;font-size:8px}.scene-foot>span{max-width:52%}.scene-actions .thin{padding:8px;font-size:8px}.outcomes{grid-template-columns:repeat(2,1fr)}.outcomes>div{padding:13px}.panel{padding:22px}footer{padding:14px;font-size:8px;display:block}footer span{display:block;margin-bottom:6px}}