[hidden]{display:none!important}
:root{--bg:#0b1220;--panel:#121b2e;--panel2:#18243d;--line:#26365a;--text:#e6edf8;--mute:#8da2c4;--ok:#2fe39a;--bad:#ff5d6c;--warn:#ffb547;--acc:#4cc9ff;--acc2:#9b7bff;--ted:#4cc9ff;--atlas:#9b7bff;--qc:#2fe39a;--server:#ffb547;
--sat:env(safe-area-inset-top);--sab:env(safe-area-inset-bottom)}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;height:100%;background:var(--bg);color:var(--text);font:15px/1.4 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif}
body{padding-top:calc(52px + var(--sat));padding-bottom:calc(64px + var(--sab));overscroll-behavior:none}
button{font:inherit;color:var(--text);background:linear-gradient(180deg,#2a7dff,#1f5fd1);border:0;border-radius:12px;padding:10px 14px;font-weight:600;cursor:pointer}
button.ghost{background:var(--panel2);border:1px solid var(--line)}button.warn{background:linear-gradient(180deg,#ff6b5a,#d93b4a)}
input,textarea{font:inherit;color:var(--text);background:#0e1628;border:1px solid var(--line);border-radius:12px;padding:10px 12px;width:100%}
textarea{resize:vertical}label{display:block;color:var(--mute);font-size:13px;margin:0 0 6px}
.top{position:fixed;top:0;left:0;right:0;z-index:20;height:calc(52px + var(--sat));padding:var(--sat) 12px 0;display:flex;align-items:center;justify-content:space-between;background:rgba(11,18,32,.85);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.brand{display:flex;align-items:center;gap:8px}.brand small{color:var(--mute);margin-left:6px}
.dot{width:10px;height:10px;border-radius:50%;background:var(--ok);box-shadow:0 0 10px var(--ok);animation:pulse 2s infinite}.dot.bad{background:var(--bad);box-shadow:0 0 10px var(--bad)}
@keyframes pulse{50%{opacity:.4}}
.iconbtn{background:transparent;padding:6px;position:relative}.iconbtn svg{width:24px;height:24px;fill:none;stroke:var(--text);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.badge{position:absolute;top:0;right:0;background:var(--bad);color:#fff;border-radius:10px;font-size:11px;padding:1px 6px;font-weight:700}
.banner{margin:8px 10px 0;padding:10px 12px;border-radius:12px;background:linear-gradient(90deg,#5a1d24,#3b1530);border:1px solid var(--bad);font-weight:600}
.view{display:none;padding:10px}.view.on{display:block}
.card{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:14px;margin:0 0 12px}.card h2{font-size:16px;margin:0 0 8px}
.hint{color:var(--mute);font-size:13px;margin:6px 0}.err{color:var(--bad);min-height:1em}
.row{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.row input{flex:1;min-width:140px}
#taskform button{margin-top:8px;width:100%}
.list{list-style:none;margin:0;padding:0}.list li{border-top:1px solid var(--line);padding:10px 2px}.list li:first-child{border-top:0}
.list.small li{font-size:12.5px;padding:6px 2px;color:var(--mute)}
.chip{display:inline-block;font-size:11px;font-weight:700;border-radius:999px;padding:2px 8px;margin-right:6px;text-transform:uppercase;letter-spacing:.03em}
.chip.queued{background:#26365a;color:#bcd}.chip.running{background:#123a5c;color:var(--acc)}.chip.done{background:#0f3d2c;color:var(--ok)}.chip.blocked{background:#4a1f26;color:var(--bad)}
.meta{color:var(--mute);font-size:12px}
.filters{display:flex;gap:6px;overflow-x:auto;margin-bottom:8px}.filters button{background:var(--panel2);border:1px solid var(--line);padding:6px 10px;font-size:13px;border-radius:999px}.filters button.on{background:#2a7dff}
.tabs{position:fixed;left:0;right:0;bottom:0;z-index:20;display:flex;background:rgba(11,18,32,.92);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-top:1px solid var(--line);padding-bottom:var(--sab)}
.tabs button{flex:1;background:none;border-radius:0;padding:8px 0 10px;font-size:11px;color:var(--mute);display:flex;flex-direction:column;align-items:center;gap:2px}
.tabs button svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.tabs button.on{color:var(--acc)}
.scenewrap{position:relative;border-radius:18px;overflow:hidden;border:1px solid var(--line);background:radial-gradient(120% 80% at 50% 0%,#162447 0%,#0b1220 70%);touch-action:none;height:min(62vh,640px)}
#scene{width:100%;height:100%;display:block;user-select:none;-webkit-user-select:none}
.zoomctl{position:absolute;right:8px;top:8px;display:flex;flex-direction:column;gap:6px}.zoomctl button{width:36px;height:36px;padding:0;border-radius:10px;background:rgba(24,36,61,.85);border:1px solid var(--line)}
.ticker{position:absolute;left:8px;bottom:8px;right:52px;font-size:12px;color:var(--mute);background:rgba(11,18,32,.7);border-radius:10px;padding:6px 8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.stats{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin-top:10px}
.stat{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:10px}.stat b{font-size:18px;display:block}.stat span{color:var(--mute);font-size:12px}
.bar{height:8px;border-radius:6px;background:#0e1628;overflow:hidden;margin-top:6px}.bar i{display:block;height:100%;background:linear-gradient(90deg,var(--ok),var(--warn),var(--bad))}
.sheet{position:fixed;left:0;right:0;bottom:0;z-index:30;max-height:78vh;background:var(--panel);border-top:1px solid var(--line);border-radius:20px 20px 0 0;box-shadow:0 -10px 40px rgba(0,0,0,.5);display:flex;flex-direction:column;padding-bottom:var(--sab);animation:up .22s ease-out}
@keyframes up{from{transform:translateY(40px);opacity:0}}
.sheethead{display:flex;justify-content:space-between;align-items:center;padding:12px 14px;border-bottom:1px solid var(--line)}.sheetbody{overflow:auto;padding:12px 14px}
.kv{display:grid;grid-template-columns:auto 1fr;gap:4px 12px;font-size:14px}.kv dt{color:var(--mute)}.kv dd{margin:0;word-break:break-word}
.modal{position:fixed;inset:0;z-index:40;background:rgba(0,0,0,.6);display:flex;align-items:center;justify-content:center;padding:16px}
.modalbox{background:var(--panel);border:1px solid var(--bad);border-radius:18px;padding:16px;max-width:520px;width:100%;max-height:86vh;overflow:auto}.modalbox ul{padding-left:18px}.modalbox input{margin:8px 0}
.treemap{width:100%;height:auto;border-radius:12px;background:#0e1628;margin-top:8px}
.login{display:flex;align-items:center;justify-content:center;padding:20px}.loginbox{width:100%;max-width:360px;background:var(--panel);border:1px solid var(--line);border-radius:20px;padding:22px;text-align:center}
.loginbox form{text-align:left;margin-top:14px}.loginbox label{margin-top:10px}.loginbox button{width:100%;margin-top:14px}.sub{color:var(--mute);margin:4px 0 0}
.logo{width:64px;height:64px}.lg-a{fill:#18243d;stroke:var(--acc);stroke-width:2}.lg-b{fill:none;stroke:var(--ok);stroke-width:3;stroke-linecap:round}.lg-c{fill:var(--acc2)}
/* scene */
.st{cursor:pointer}.st .body{fill:#15213a;stroke:#2c4372;stroke-width:2}.st:hover .body,.st.sel .body{stroke:var(--acc)}
.st .scr{fill:#081020}.st .ico{fill:none;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.st .lbl{fill:var(--text);font-size:15px;font-weight:600;text-anchor:middle}.st .sub2{fill:var(--mute);font-size:12px;text-anchor:middle}
.led{animation:pulse 1.6s infinite}.led.ok{fill:var(--ok)}.led.bad{fill:var(--bad);animation:pulse .6s infinite}.led.idle{fill:#56627a;animation:none}
.zone{fill:none;stroke-dasharray:6 8;stroke-width:1.5;opacity:.6}.zlabel{font-size:14px;font-weight:800;letter-spacing:.15em}
.op{transition:transform 1.6s cubic-bezier(.45,.05,.3,1)}.op .leg{transform-origin:0 0;animation:walk .5s infinite alternate}.op .leg2{animation-direction:alternate-reverse}
.op.idle .leg{animation:none}@keyframes walk{from{transform:rotate(16deg)}to{transform:rotate(-16deg)}}
.op .arm{transform-origin:0 0;animation:type .35s infinite alternate}@keyframes type{to{transform:rotate(-10deg)}}
.bubble rect{fill:#e6edf8}.bubble text{fill:#0b1220;font-size:13px;font-weight:600}
.flow{stroke-dasharray:4 10;animation:flow 1.2s linear infinite}@keyframes flow{to{stroke-dashoffset:-28}}
.box{animation:belt 6s linear infinite}@keyframes belt{from{transform:translateX(0)}to{transform:translateX(420px)}}
@media(min-width:900px){body{max-width:1100px;margin:0 auto}.stats{grid-template-columns:repeat(4,1fr)}.scenewrap{height:70vh}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
