@font-face{font-family:Plex;src:url(/fonts/IBMPlexMono-Light.ttf) format("truetype");font-weight:300}:root{--bg: #030304;--fg: #e9e9e9;--dim: rgba(255, 255, 255, .45);--faint: rgba(255, 255, 255, .22);--line: rgba(255, 255, 255, .13);--amber: #ff9a3c;--gap: 10px}*{box-sizing:border-box;margin:0;padding:0}html,body{min-height:100%}body{background:radial-gradient(120% 90% at 50% 40%,#0b0b0d 0%,var(--bg) 70%);color:var(--fg);font:300 11px/1.5 Plex,ui-monospace,PingFang SC,Microsoft YaHei,monospace;letter-spacing:.04em;overflow:hidden;-webkit-font-smoothing:antialiased}body:after{content:"";position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;background:repeating-linear-gradient(0deg,rgba(255,255,255,.025) 0 1px,transparent 1px 3px);z-index:20}#grain{position:fixed;top:0;right:0;bottom:0;left:0;width:100%;height:100%;pointer-events:none;opacity:.055;mix-blend-mode:screen;z-index:21}.frame{height:100vh;display:grid;grid-template-rows:44px minmax(0,1fr) 18px;gap:var(--gap);padding:12px 14px;max-width:1280px;margin:0 auto}.frame>*{min-width:0}.main-grid{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,1fr);grid-template-rows:minmax(0,1.4fr) minmax(0,2.1fr) minmax(0,1fr);grid-template-areas:"detect kpi" "detect chart" "log log";gap:var(--gap);min-height:0}.detect-panel{grid-area:detect;min-height:0;overflow:hidden}.kpi-panel{grid-area:kpi;min-height:0}.chart-panel{grid-area:chart;min-height:0}.log-panel{grid-area:log;min-height:0}.top{display:grid;grid-template-columns:auto 1fr auto;gap:var(--gap);align-items:center;border-bottom:1px solid var(--line);position:relative;min-width:0}.top:after{content:"";position:absolute;left:0;bottom:-1px;width:140px;height:1px;background:var(--fg)}.brand{display:flex;align-items:center;gap:12px}.brand svg{width:26px;height:26px;color:var(--amber)}.brand b{display:block;font-size:16px;letter-spacing:.32em;font-weight:300}.brand small{display:block;font-size:9px;letter-spacing:.22em;color:var(--dim)}.ticker{display:flex;justify-content:center;gap:28px;color:var(--dim);font-size:9.5px;white-space:nowrap;overflow:hidden}.status{display:flex;flex-direction:column;align-items:flex-end}.status small{display:block;color:var(--dim);font-size:9px;letter-spacing:.2em}.status b{display:block;font-size:15px;font-weight:300;letter-spacing:.12em}.status b.pending,.status b.error{color:var(--amber)}.panel{position:relative;border:1px solid var(--line);background:linear-gradient(180deg,#ffffff06,#ffffff02);display:flex;flex-direction:column}.panel:before,.panel:after{content:"";position:absolute;width:9px;height:9px;border:1px solid var(--fg);pointer-events:none;z-index:3}.panel:before{top:-1px;left:-1px;border-right:0;border-bottom:0}.panel:after{bottom:-1px;right:-1px;border-left:0;border-top:0}.panel>header{display:flex;align-items:center;gap:8px;padding:7px 10px 4px;letter-spacing:.16em;font-size:11px}.panel>header small{color:var(--faint);font-size:9px;letter-spacing:.14em;margin-left:auto;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:46%}.tag{display:inline-grid;place-items:center;width:13px;height:13px;border:1px solid var(--dim);font-size:8px;letter-spacing:0;flex:none}.body{position:relative;margin:2px 10px 10px}.body>canvas{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;display:block}.mode{display:flex;margin-left:auto;flex:none}.mode button{font:inherit;font-size:10px;letter-spacing:.16em;color:var(--faint);background:transparent;border:1px solid rgba(255,255,255,.2);padding:3px 10px;cursor:pointer}.mode button+button{border-left:none}.mode button.on{color:var(--fg);border-color:#ffffff80;background:#ffffff0f}.stage-wrap{flex:1;min-height:0;display:grid;place-items:center;padding:6px 10px 10px}.stage{position:relative;margin:0 auto;line-height:0;background:#000;border:1px solid var(--line);aspect-ratio:var(--arn);width:min(100%,calc(66vh * var(--arn)))}.stage.empty{display:grid;place-items:center;cursor:pointer;background:linear-gradient(180deg,#ffffff04,#ffffff01)}.stage.empty:hover{border-color:var(--dim)}.stage.empty svg{width:40px;height:40px;color:var(--faint)}.stage.empty p{font-size:11px;letter-spacing:.18em;color:var(--dim);line-height:1.8}.stage.empty p.small{font-size:9px;letter-spacing:.14em;color:var(--faint)}.stage img,.stage video{display:block;width:100%;height:100%;object-fit:cover}.stage canvas.result{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;opacity:0;transition:opacity .15s;pointer-events:none}.stage canvas.result.on{opacity:1}.stage .hint{position:absolute;left:8px;bottom:6px;color:var(--faint);font-size:9px;letter-spacing:.14em;line-height:1.4;pointer-events:none;text-shadow:0 0 8px rgba(0,0,0,.9);max-width:65%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.stage .cam-msg{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-content:center;gap:10px;text-align:center;color:var(--dim);font-size:11px;letter-spacing:.14em;line-height:1.6}.stage .cam-msg button{font:inherit;font-size:10px;letter-spacing:.14em;color:var(--amber);background:transparent;border:1px solid rgba(255,154,60,.5);padding:4px 12px;cursor:pointer;justify-self:center}.stage .tip{position:absolute;right:8px;bottom:6px;color:var(--amber);font-size:10px;letter-spacing:.14em;pointer-events:none;text-shadow:0 0 8px rgba(0,0,0,.9)}.stage .tip:before{content:"● ";animation:live-blink 1.2s steps(2) infinite}@keyframes live-blink{50%{opacity:.2}}.stage-actions{position:absolute;right:8px;top:6px;display:flex;gap:4px}.stage-actions button{font:inherit;font-size:9px;letter-spacing:.14em;color:var(--dim);background:#030304b3;border:1px solid rgba(255,255,255,.2);padding:3px 8px;cursor:pointer;line-height:1.4}.stage-actions button:hover{color:var(--fg);border-color:var(--dim)}.kpi-panel{display:flex}.kpis{flex:1;display:grid;grid-template-columns:repeat(2,1fr);gap:12px 14px;align-content:center;padding:8px 12px 14px}.kpis>div{justify-self:center}.kpis>div:nth-child(4){transform:translate(-8px)}.kpis small{display:block;font-size:9px;color:var(--dim);letter-spacing:.16em}.kpis b{display:block;font-size:20px;font-weight:300;letter-spacing:.06em;font-variant-numeric:tabular-nums}.kpis b.hot{color:var(--amber)}.chart-panel .body,.log-panel .body{flex:1;min-height:0}.chart-body{overflow-x:auto;overflow-y:hidden}.chart-body>.chart-inner{position:relative;width:max-content;min-width:100%;height:100%;display:flex;justify-content:center}.chart-body>.chart-inner>canvas{position:static;inset:auto;flex:none}.chart-body::-webkit-scrollbar{height:4px}.chart-body::-webkit-scrollbar-thumb{background:#ffffff2e}.chart-body::-webkit-scrollbar-track{background:transparent}.tele-tip{position:absolute;top:6px;transform:translate(-50%);background:#030304eb;border:1px solid var(--line);padding:4px 8px;font-size:9px;line-height:1.7;letter-spacing:.12em;color:var(--fg);white-space:nowrap;pointer-events:none;z-index:5}.tele-tip div:first-child{color:var(--amber)}.log-panel .body{overflow-y:auto}#log{list-style:none}#log li{display:flex;gap:10px;padding:2px 0;font-size:10.5px;color:#ffffffb3;line-height:1.5}#log li span{min-width:0;overflow-wrap:anywhere}#log li:first-child{color:var(--fg)}#log li.warn{color:var(--amber)}#log time{color:var(--faint);font-variant-numeric:tabular-nums;flex:none}.bottom{display:flex;align-items:center;gap:16px;color:var(--dim);font-size:9.5px;border-top:1px solid var(--line);padding-top:4px;overflow:hidden;white-space:nowrap}.bottom i{display:inline-block;width:6px;height:6px;background:var(--fg);margin-right:5px}.bottom i.amber{background:var(--amber)}.bottom em{margin-left:auto;font-style:normal;color:var(--faint)}@media(min-width:761px){.stage-wrap{container-type:size}.stage{width:min(100cqw,calc(100cqh * var(--arn)))}}@media(max-width:760px){body{overflow:auto}.frame{height:auto;min-height:100vh;grid-template-rows:44px auto 18px;padding:10px 12px}.main-grid{display:flex;flex-direction:column}.kpi-panel{order:-1}.chart-panel .body,.log-panel .body{flex:none}.chart-panel .body{height:156px}.log-panel .body{height:132px}.ticker{display:none}.top{grid-template-columns:1fr auto}.brand b{font-size:14px;letter-spacing:.24em}.kpis b{font-size:18px}.bottom{flex-wrap:wrap;gap:6px 12px}.bottom em{margin-left:0}}