:root{color-scheme:dark;font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;background:#0a111b;color:#dbe8f0;font-synthesis:none;-webkit-font-smoothing:antialiased}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;}body{background:radial-gradient(ellipse at 50% -25%,#182c3a 0%,#0a111b 44%,#09111a 100%);font-size:13px}button,input{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible{outline:2px solid #35dbc6;outline-offset:3px}button:disabled{opacity:.40;cursor:not-allowed}.app-shell{min-height:100vh;max-width:1800px;margin:auto;padding:0 36px 30px}.topbar{height:79px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #20313f;gap:12px}.brand{display:flex;align-items:center;gap:11px;color:#dae9ef;font-size:16px;font-weight:600;letter-spacing:1.6px;white-space:nowrap}.brand-strong{font-weight:850}.brand small{font-size:9px;letter-spacing:1.1px;color:#6e8796;font-weight:650}.brand-mark{position:relative;width:37px;height:37px;display:grid;place-items:center;border:1px solid #2ad5c1;border-radius:8px;color:#53e9d1;font-size:26px;font-weight:900;line-height:1;box-shadow:0 0 22px #1ac4a821;background:#183039}.brand-mark i{position:absolute;right:-4px;bottom:3px;width:8px;height:8px;background:#49e4cf;border:2px solid #0a111b;border-radius:50%}.top-center{color:#718b9c;font-weight:700;font-size:10px;letter-spacing:1.6px}.small-dot,.pulse,.tiny-dot{display:inline-block;width:6px;height:6px;background:#3fe0bd;border-radius:50%;box-shadow:0 0 14px #33c8ae;margin-right:9px}.top-divider{display:inline-block;height:12px;border-left:1px solid #2c4353;margin:0 15px;vertical-align:middle}.top-right{display:flex;align-items:center;gap:13px}.top-status{border:1px solid #245449;background:#143027;padding:8px 12px;border-radius:6px;color:#57cdb0;white-space:nowrap;font-size:9px;font-weight:800;letter-spacing:1px}.icon-button{height:32px;width:32px;border:1px solid #2b4350;border-radius:7px;background:#132331;color:#8ed8d0;font-size:18px}.crumb{height:54px;display:flex;align-items:center;gap:13px;font-size:10px;letter-spacing:1.65px;color:#688292;font-weight:700}.crumb strong{color:#e3f1ef}.crumb .slash{color:#395569}.crumb-right{margin-left:auto;color:#567081}.work-area{display:grid;grid-template-columns:minmax(0,1fr) 348px;gap:18px;align-items:start}.visual-column{min-width:0;display:flex;flex-direction:column;gap:15px}.panel{border:1px solid #263b4c;border-radius:11px;background:#111d2a;box-shadow:0 16px 35px #020a142b}.viewer{height:clamp(390px,48vw,570px);position:relative;overflow:hidden;background:radial-gradient(ellipse at 52% 40%,#172f3d 0%,#0b1723 65%,#08131d 100%)}.viewer:after{content:"";pointer-events:none;position:absolute;inset:0;box-shadow:inset 0 0 110px #030c1478;border-radius:10px}#scene{position:absolute;inset:0;width:100%;height:100%;display:block;touch-action:none;cursor:grab}#scene:active{cursor:grabbing}.viewer-top,.viewer-bottom,.viewer-label{position:absolute;z-index:2;pointer-events:none}.viewer-top{top:26px;left:30px;right:28px;display:flex;justify-content:space-between;align-items:flex-start;gap:10px}.eyebrow{font-size:10px;letter-spacing:2px;color:#68b4ac;font-weight:800}.viewer h1{margin:9px 0 3px;font-size:clamp(25px,2.6vw,36px);letter-spacing:1px;line-height:1;font-weight:850}.viewer h1 em{color:#37dbc5;font-style:normal;font-weight:300}.viewer-top p{margin:7px 0;color:#96abb8;font-size:9px;letter-spacing:1.75px;font-weight:750}.viewer-status{display:flex;align-items:flex-end;flex-direction:column;gap:10px}.state-badge{display:flex;align-items:center;gap:9px;padding:9px 12px;border:1px solid #8c7149;background:#30292099;color:#ffc779;border-radius:5px;font-size:10px;letter-spacing:1px;font-weight:800}.state-badge.run{background:#15382e;border-color:#28795f;color:#53e7b6}.state-badge.trip{background:#492329;border-color:#bd4045;color:#ff777a}.status-led{display:block;width:8px;height:8px;background:currentColor;border-radius:50%;box-shadow:0 0 11px currentColor}.sim-clock{color:#a9bec9;font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:14px;letter-spacing:1.5px}.sim-clock small{font-size:9px;color:#63808e}.viewer-bottom{bottom:21px;left:28px;right:28px;display:flex;justify-content:space-between;gap:10px;color:#718d9b;font-size:9px;letter-spacing:1px;font-weight:750}.viewer-bottom b{color:#45e6d1}.view-mono{font-family:ui-monospace,monospace;color:#6b8593}.view-mono strong{color:#b9e8e1}.viewer-label{top:52%;font-size:9px;letter-spacing:1.1px;color:#7695a0;font-weight:800;white-space:nowrap}.label-left{left:26px}.label-right{right:27px}.label-square{display:inline-block;width:7px;height:7px;margin-right:7px;border:1px solid #ffc653}.label-square.cyan{border-color:#41e8ce}.tiny-rule{display:inline-block;width:17px;border-top:1px solid #53747c;margin:0 7px 3px}.fallback{z-index:3;position:absolute;bottom:60px;left:25%;right:25%;color:#f3c37d;background:#30201caa;border:1px solid #b77a46;border-radius:6px;padding:10px;text-align:center}.metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:11px}.metric{background:#111e2b;border:1px solid #263a4a;border-radius:9px;padding:16px 17px 14px;min-width:0}.metric-caption{font-size:9px;letter-spacing:1.1px;color:#7c9baa;font-weight:800;white-space:nowrap}.metric-icon{float:right;color:#4ba9a5;font-size:13px}.metric-value{display:flex;align-items:baseline;gap:7px;margin:11px 0 8px}.metric-value strong{font-size:28px;line-height:1;font-family:ui-monospace,SFMono-Regular,Consolas,monospace;color:#eff8f8;font-weight:640;letter-spacing:-.8px}.metric-value span{font-size:11px;color:#80a19e}.metric-foot{font-size:8px;letter-spacing:.9px;color:#667f8c;font-weight:750}.analytics{padding:17px 21px 11px;min-height:162px}.analytics-head,.event-head{display:flex;align-items:center;justify-content:space-between;gap:15px}.analytics h2,.event-panel h2{font-size:15px;font-weight:720;color:#dbe8ef;margin:6px 0 0}.analytics h2 small{font-size:10px;font-weight:400;color:#7b9bac;margin-left:7px}.key-wrap{font-size:9px;color:#8ea8b3;font-weight:800;white-space:nowrap}.key-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:#2ee3c9;margin-right:7px}.chart{width:100%;height:80px;display:block;margin-top:14px;overflow:visible}.event-panel{padding:19px 21px;min-height:153px}.text-button{font-size:10px;letter-spacing:.8px;font-weight:800;color:#3cdecc;background:none;border:0}.text-button span{margin-left:4px}.events{margin-top:14px;max-height:145px;overflow-y:auto}.event-item{display:grid;grid-template-columns:80px 85px 1fr;align-items:baseline;gap:10px;padding:7px 0;border-bottom:1px solid #223644;font-size:11px}.event-time{font-family:ui-monospace,Consolas,monospace;color:#71929b;font-size:10px}.event-code{color:#47d8be;font-weight:800;letter-spacing:.6px;font-size:10px}.event-item.danger .event-code{color:#ff7875}.event-text{color:#afc4cd;overflow-wrap:anywhere}.controls{padding:0;overflow:hidden;align-self:stretch}.controls-title{padding:25px 23px 23px;border-bottom:1px solid #283d4b;background:linear-gradient(140deg,#172839,#10202d)}.subtle-pill{color:#62d8c4;font-size:9px;font-weight:850;letter-spacing:1.5px}.subtle-pill span{margin-left:7px;font-size:6px;vertical-align:middle}.controls-title h2{margin:12px 0 6px;font-size:23px;letter-spacing:-.7px}.controls-title p{margin:0;color:#7e9aa9;font-size:11px}.control-section{padding:20px 23px 21px;border-bottom:1px solid #283b49}.section-header{display:flex;align-items:center;gap:10px;margin-bottom:16px}.section-index{font-family:ui-monospace,monospace;color:#48b5ae;font-size:10px}.section-header h3{font-size:12px;letter-spacing:.1px;color:#e1edf0;margin:0;font-weight:750}.section-tag{margin-left:auto;font-size:9px;color:#6d8f9e;letter-spacing:.8px;font-weight:850}.commands{display:grid;grid-template-columns:1fr 1fr;gap:8px}.command{border:1px solid #355063;border-radius:6px;background:#1b2c39;color:#bed0d9;height:39px;font-size:10px;font-weight:850;letter-spacing:.65px}.command.primary{background:#23cdb3;border-color:#3ae0c6;color:#06312f}.command.reset{grid-column:1/3;background:#242e3c;color:#d6e2e7}.command-symbol{margin-right:6px;font-size:12px}.command:hover:not(:disabled){filter:brightness(1.16)}.operation-message{font-size:10px;color:#7795a3;margin:12px 0 0;line-height:1.5;min-height:15px}.operation-message.error{color:#fba3a1}.switch-row{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:10px 0;cursor:pointer;position:relative}.switch-row b{display:block;color:#dce9ee;font-size:11px;font-weight:700}.switch-row small{display:block;font-size:10px;color:#6f91a1;margin-top:5px}.switch-row input{position:absolute;width:1px;height:1px;opacity:0;right:20px}.switch-track{height:21px;width:38px;flex:none;background:#3e4c59;border-radius:20px;position:relative;border:1px solid #546371;transition:background .16s}.switch-track:before{content:'';position:absolute;width:15px;height:15px;top:2px;left:2px;border-radius:50%;background:#c8d5dc;transition:transform .16s}.switch-row input:checked+.switch-track{background:#2ec9b1;border-color:#47e5c7}.switch-row input:checked+.switch-track:before{transform:translateX(16px);background:#07342d}.switch-row input:checked+.switch-track.danger{background:#d24d59;border-color:#fd7b78}.switch-row input:checked+.switch-track.danger:before{background:#3f0d17}.switch-row input:focus-visible+.switch-track{outline:2px solid #67e3cf;outline-offset:3px}.channel-test{display:flex;align-items:center;gap:10px;justify-content:space-between;margin-top:10px}.channel-test>span{font-size:9px;color:#6f8e9c;letter-spacing:1px;font-weight:800}.fault-button{border:1px dashed #73534b;background:#352d2b;color:#fac48e;border-radius:4px;padding:8px 9px;font-size:9px;font-weight:850;letter-spacing:.3px}.fault-button span{font-size:15px;margin-left:4px}.io-line{font-family:ui-monospace,monospace;font-size:10px;color:#7f9caa;margin-top:11px;white-space:nowrap}.io-line b{color:#c2e4e4}.slider-field{margin:17px 0 22px}.slider-field:last-child{margin-bottom:0}.slider-label{display:flex;justify-content:space-between;align-items:center;gap:6px;font-size:11px;color:#b9ccd3}.slider-label output{color:#4ce2cc;font-family:ui-monospace,monospace;white-space:nowrap;font-size:10px}input[type=range]{appearance:none;width:100%;height:4px;margin:16px 0 9px;outline:none;background:linear-gradient(90deg,#38d4b9 35%,#304554 35%);border-radius:5px;cursor:pointer}input[type=range]::-webkit-slider-thumb{appearance:none;height:13px;width:13px;background:#41e3c9;border:3px solid #123834;border-radius:50%;box-shadow:0 0 0 1px #66e8d6}input[type=range]::-moz-range-thumb{height:11px;width:11px;background:#41e3c9;border:2px solid #123834;border-radius:50%}.range-label{display:flex;justify-content:space-between;color:#607d8e;font-size:9px;font-family:ui-monospace,monospace}.controls-footer{padding:21px 23px;text-align:center;color:#7998a1;font-size:9px;line-height:1.9;letter-spacing:1.1px;font-weight:850}.controls-footer small{font-size:9px;letter-spacing:.5px;color:#a08270}.controls-footer .tiny-dot{width:5px;height:5px;margin-right:7px}@media(max-width:1140px){.app-shell{padding:0 18px 18px}.work-area{grid-template-columns:minmax(0,1fr) 310px;gap:12px}.metric{padding:14px 10px}.metric-caption{font-size:8px}.metric-value strong{font-size:25px}.control-section,.controls-title{padding-left:17px;padding-right:17px}.viewer-label{display:none}}@media(max-width:850px){.app-shell{padding:0 13px 30px}.topbar{height:65px}.top-center{display:none}.crumb-right{display:none}.work-area{display:flex;flex-direction:column}.visual-column,.controls{width:100%}.viewer{height:440px}.controls{order:1}.metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.controls-title{padding:19px 20px}.controls-title h2{font-size:21px}.control-section{padding:17px 20px}.viewer-top{top:20px;left:20px;right:17px}.viewer-bottom{left:18px;right:18px}.viewer-top p{max-width:180px;line-height:1.5}.events{max-height:150px}}@media(max-width:430px){.brand small{display:none}.brand{font-size:13px}.top-status{font-size:8px;padding:8px}.crumb{font-size:9px;gap:9px}.viewer{height:380px}.viewer h1{font-size:24px}.viewer-top p{font-size:8px}.state-badge{font-size:9px;padding:6px}.sim-clock{font-size:11px}.viewer-bottom{font-size:8px}.view-mono{display:none}.analytics h2 small{display:none}}
.fallback{z-index:3;position:absolute;bottom:48px;left:auto;right:27px;color:#8cbbc6;background:#112634dd;border:1px solid #375162;border-radius:4px;padding:6px 9px;text-align:right;font-size:9px;letter-spacing:.5px;font-weight:800}
