:root{--bg: #0e1317;--panel: #151c21;--panel-2: #1b242b;--line: #26323b;--text: #e6edf2;--muted: #8796a1;--ok: #1fbf8f;--info: #4c8dff;--warn: #f0a020;--danger: #e5483a;--radius: 10px;font-family:NanumGothic,Nanum Gothic,Pretendard,Apple SD Gothic Neo,Noto Sans KR,Malgun Gothic,WenQuanYi Micro Hei,system-ui,sans-serif;color:var(--text);background:var(--bg);font-size:13px;line-height:1.4}*{box-sizing:border-box}[hidden]{display:none!important}html,body,#root{margin:0;height:100%}button,select,input{font:inherit;color:inherit}button{background:var(--panel-2);border:1px solid var(--line);border-radius:7px;padding:6px 10px;cursor:pointer;transition:background .15s,border-color .15s}button:hover:not(:disabled){border-color:#3b4b57;background:#212c34}button:disabled{opacity:.42;cursor:not-allowed}button.primary{background:#15634f;border-color:#1c8a6d}button.primary:hover:not(:disabled){background:#187559}button.danger-ghost{border-color:#6b2a24;color:#ff9b90}button.mini{padding:2px 8px;font-size:12px}select{background:var(--panel-2);border:1px solid var(--line);border-radius:7px;padding:6px 8px}code{font-family:JetBrains Mono,ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px}.muted{color:var(--muted)}.hl{color:#9fe8cf}.moving{color:#7fd1ff}.bad{color:#ff8a7d;font-style:normal}.warn-text{color:#ffc56b}.info-text{color:#8fb6ff}.app{display:flex;flex-direction:column;height:100vh;min-width:1200px}.topbar{display:flex;align-items:center;gap:16px;padding:8px 16px;border-bottom:1px solid var(--line);background:#11171b}.brand{display:flex;align-items:center;gap:12px;min-width:0}.brand .logo{background:var(--ok);color:#05261d;font-weight:800;letter-spacing:.04em;border-radius:7px;padding:6px 8px;font-size:13px}.brand h1{margin:0;font-size:16px;font-weight:700}.brand p{margin:1px 0 0;color:var(--muted);font-size:12px}.sim-badge{border:1px dashed #b98a2c;color:#ffcf7a;border-radius:999px;padding:3px 10px;font-size:12px;white-space:nowrap}.top-stats{margin-left:auto;display:flex;align-items:center;gap:14px;white-space:nowrap}.stat b{color:var(--muted);font-weight:500;margin-right:6px}.pill{border-radius:999px;padding:4px 12px;font-weight:700;font-size:13px}.pill-ok{background:#0f3b30;color:#6ff0c4}.pill-idle{background:#222c33;color:#a9b6bf}.pill-warn{background:#3d2c0b;color:#ffcb6b}.pill-info{background:#13284a;color:#9cc1ff}.pill-danger{background:#4a1511;color:#ffb1a8;animation:blink 1s steps(2) infinite}@keyframes blink{50%{opacity:.65}}.seg{display:inline-flex;border:1px solid var(--line);border-radius:8px;overflow:hidden;background:var(--panel-2)}.seg button{border:0;border-radius:0;background:transparent;padding:5px 10px}.seg button+button{border-left:1px solid var(--line)}.seg button.on{background:#1d4a3f;color:#b5f5df}.seg.small button{padding:3px 8px;font-size:12px}.layout{flex:1;min-height:0;display:grid;grid-template-columns:minmax(0,1fr) 390px;gap:12px;padding:12px}.left,.right{display:flex;flex-direction:column;gap:12px;min-height:0}.card{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:12px}.card h2{margin:0;font-size:15px}.card h3{margin:0 0 8px;font-size:13px;display:flex;align-items:center;gap:8px}.sim-tag{font-size:10px;font-weight:500;color:#ffcf7a;border:1px dashed #8c6a24;border-radius:4px;padding:0 5px}.viewport{position:relative;flex:1;min-height:300px;border-radius:var(--radius);overflow:hidden;border:1px solid var(--line);background:#dfe3e0}.viewport.vp-estop{box-shadow:inset 0 0 0 3px var(--danger);border-color:var(--danger)}.viewport.vp-fault{box-shadow:inset 0 0 0 3px var(--warn);border-color:var(--warn)}.gl{position:absolute;inset:0}.gl .scene-canvas{display:block;outline:none}.gl .scene-labels{position:absolute;inset:0;pointer-events:none}.scene-label{background:#10161bc7;color:#eef3f6;border-radius:6px;padding:2px 7px;font-size:11.5px;white-space:nowrap;border:1px solid rgba(255,255,255,.08);transform:translateY(-50%)}.scene-label.small{font-size:10.5px;padding:1px 5px}.scene-label.robot{background:#0e5242e0;font-weight:700}.gl-error{position:absolute;inset:40% 10% auto;background:#3a1512;color:#ffd0ca;padding:12px;border-radius:8px}.vp-top{position:absolute;top:10px;left:10px;display:flex;gap:8px;align-items:center}.vp-top .seg{background:#11171bdb}.chip{background:#11171bdb;border-radius:999px;padding:4px 11px;font-size:12px}.chip.on{border-color:#1c8a6d;color:#b5f5df}.vp-sim{position:absolute;top:12px;right:12px;background:#3c2806d1;color:#ffd98f;border-radius:6px;padding:3px 9px;font-size:11.5px}.vp-banner{position:absolute;top:50px;left:50%;transform:translate(-50%);padding:7px 18px;border-radius:8px;font-weight:700;font-size:14px}.vp-banner.danger{background:#aa1e14eb;color:#fff}.vp-banner.warn{background:#965f0aeb;color:#fff}.vp-action{position:absolute;right:12px;bottom:12px;display:flex;gap:8px;align-items:center;max-width:calc(100% - 380px);background:#10161bdb;padding:6px 12px;border-radius:8px;font-size:13px}.vp-action .dot{width:8px;height:8px;border-radius:50%;background:var(--ok);flex:none}.tone-warn .vp-action .dot,.tone-info .vp-action .dot{background:var(--warn)}.tone-danger .vp-action .dot{background:var(--danger)}.tone-idle .vp-action .dot{background:#6f7d86}.pip{position:absolute;left:12px;bottom:12px;width:clamp(240px,26%,340px);aspect-ratio:4 / 3;border-radius:9px;border:2px solid var(--ok);display:flex;flex-direction:column;justify-content:space-between;overflow:hidden;pointer-events:auto;box-shadow:0 6px 22px #00000059}.pip-clutch{border-color:var(--warn)}.pip-estop{border-color:var(--danger)}.pip-link{border-color:#7d8a93}.pip-head,.pip-foot{display:flex;justify-content:space-between;gap:6px;padding:4px 8px;background:#0e1317d1;font-size:11px}.pip-head b{font-size:12px}.pip-state{font-weight:700;color:#7ff0c8;letter-spacing:.02em}.pip-clutch .pip-state{color:#ffc96b}.pip-estop .pip-state{color:#ff9a8f}.pip-link .pip-state{color:#b8c4cc}.pip-foot{color:#b9c6ce;font-size:10.5px}.timeline{padding:10px 12px}.tl-head{display:flex;align-items:baseline;gap:12px;margin-bottom:8px}.tl-head .right{margin-left:auto}.steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(10,minmax(0,1fr));gap:6px}.step{display:flex;flex-direction:column;gap:3px;min-width:0}.step .bar{height:5px;border-radius:3px;background:#26323b;overflow:hidden}.step .bar i{display:block;height:100%;background:var(--ok);transition:width .1s linear}.step .name{font-size:12px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.step .actor{font-size:10.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.step.pending .name{color:#6f7d86}.step.active .name{color:#8ff2cf}.step.awaiting .bar{background:#5a4310}.step.awaiting .name{color:#ffcb6b}.step.fault .bar{background:var(--danger)}.step.fault .name{color:#ff9a8f}.step.skipped .name{color:#6f7d86;text-decoration:line-through}.steps .empty{grid-column:1 / -1;color:var(--muted)}.telemetry{display:grid;grid-template-columns:1.35fr 1fr 1fr;gap:12px}.tele{padding:10px 12px}.kv{display:flex;justify-content:space-between;gap:8px;padding:2px 0}.kv>span:first-child{color:var(--muted)}.arms{display:grid;grid-template-columns:1fr 1fr;gap:10px}.arm{background:var(--panel-2);border-radius:8px;padding:6px 8px}.arm-head{display:flex;justify-content:space-between;margin-bottom:2px}.grip{position:relative;display:inline-block;padding-left:46px;white-space:nowrap}.grip:before,.grip i{position:absolute;left:0;top:50%;height:5px;margin-top:-2.5px;border-radius:3px}.grip:before{content:"";width:40px;background:#1d2a2f}.grip i{background:#2a5d50}.foot{margin-top:6px;font-size:11.5px}.row-btns{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px;align-items:center}.row-btns.between{justify-content:space-between}.belt-track{position:relative;height:10px;border-radius:5px;background:repeating-linear-gradient(90deg,#2a3238 0 6px,#232a2f 6px 12px);margin:2px 0 6px}.belt-tray{position:absolute;top:-3px;width:22px;height:16px;margin-left:-11px;border-radius:3px;background:#8a5d3f;border:1px solid #c08a62;transition:left .1s linear}.temps{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin:6px 0}.temps div{background:var(--panel-2);border-radius:7px;padding:4px 6px;text-align:center}.temps b{display:block;font-size:14px}.temps span{color:var(--muted);font-size:11px}.temps .bad b{color:#ff8a7d}.safety{display:grid;grid-template-columns:116px 1fr;gap:12px;align-items:start}.estop{width:116px;height:116px;border-radius:50%;border:6px solid #f2c230;background:radial-gradient(circle at 40% 35%,#ff5a46,#b5180c 70%);color:#fff;font-weight:800;font-size:16px;display:flex;flex-direction:column;align-items:center;justify-content:center;box-shadow:0 4px #6d0c05,0 0 0 3px #3c2f08}.estop small{font-weight:500;opacity:.8;font-size:11px}.estop:hover:not(:disabled){background:radial-gradient(circle at 40% 35%,#ff6b58,#c41d10 70%);border-color:#ffd23d}.estop.active{transform:translateY(3px);box-shadow:0 1px #6d0c05,0 0 0 3px #3c2f08,0 0 24px #e5483a99}.safety-side{display:flex;flex-direction:column;gap:8px}.safety-side>button{width:100%}.safety-side .row-btns{margin-top:0}.safety-side .row-btns button{flex:1}.safety-side .seg{width:100%}.safety-side .seg button{flex:1}.pulse{animation:pulse 1.4s ease-in-out infinite}@keyframes pulse{50%{box-shadow:0 0 0 4px #1fbf8f40}}.alarm{border-color:#7a2c22;background:#24130f}.alarm h3{color:#ffb1a8;font-size:14px}.alarm p{margin:0;color:#f0d2cd}.tabs-card{flex:1;min-height:0;display:flex;flex-direction:column;padding:0}.tabs{display:flex;border-bottom:1px solid var(--line)}.tabs button{flex:1;border:0;border-radius:0;background:transparent;padding:9px 4px;color:var(--muted);border-bottom:2px solid transparent;position:relative}.tabs button.on{color:var(--text);border-bottom-color:var(--ok)}.badge{display:inline-block;margin-left:5px;background:var(--warn);color:#2a1a00;border-radius:999px;font-size:10.5px;padding:0 6px;font-weight:700}.tab-body{flex:1;min-height:0;overflow:auto;padding:12px}.note{background:var(--panel-2);border-radius:8px;padding:8px 10px;margin:0 0 8px;font-size:12px}.quick{display:grid;grid-template-columns:1fr 1fr;gap:8px}.quick button{display:flex;flex-direction:column;align-items:flex-start;padding:10px 12px;font-weight:700;font-size:14px}.quick small{font-weight:400;color:var(--muted);font-size:11.5px}.check{display:flex;align-items:center;gap:6px;color:var(--muted)}.order-list{list-style:none;margin:10px 0 0;padding:0;display:flex;flex-direction:column;gap:4px}.order-list li{display:grid;grid-template-columns:44px 1fr auto auto;gap:8px;align-items:center;background:var(--panel-2);border-radius:7px;padding:6px 9px}.o-state{color:var(--muted);font-size:12px}.o-active{outline:1px solid #1c8a6d}.o-active .o-state{color:#8ff2cf}.o-ready .o-state{color:#ffcb6b}.o-cancelled{opacity:.6}.stock{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}.stock li{background:var(--panel-2);border-radius:8px;padding:7px 9px}.stock li.low{outline:1px solid #6a4c12}.stock li.empty{outline:1px solid #7a2c22}.s-head{display:flex;gap:8px;align-items:baseline}.s-head .muted{font-size:11.5px;flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.s-state{font-size:11.5px;font-weight:700}.s-state.ok{color:#6fe0b8}.s-state.warn{color:#ffcb6b}.s-state.bad{color:#ff9a8f}.s-state.info{color:#9cc1ff}.s-bar{position:relative;height:6px;background:#26323b;border-radius:3px;margin:5px 0}.s-bar i{position:absolute;inset:0 auto 0 0;background:var(--ok);border-radius:3px}.low .s-bar i{background:var(--warn)}.empty .s-bar i{background:var(--danger)}.s-bar em{position:absolute;top:-3px;width:2px;height:12px;background:#c99530}.s-foot{display:flex;justify-content:space-between;align-items:center}.stock .note{background:transparent;padding:4px 2px}.manual .jog{display:flex;gap:12px;margin:10px 0}.pad{display:grid;grid-template-columns:repeat(3,64px);grid-template-rows:repeat(3,38px);gap:6px}.zcol{display:flex;flex-direction:column;gap:6px}.zcol button{width:76px;height:57px}.faults{display:flex;flex-direction:column;gap:8px}.fault-btn{display:flex;flex-direction:column;align-items:flex-start;text-align:left;padding:8px 10px}.fault-btn small{color:var(--muted)}.log{list-style:none;margin:0;padding:0;font-size:12px;display:flex;flex-direction:column;gap:2px}.log li{display:grid;grid-template-columns:42px 1fr;gap:8px;padding:2px 0;border-bottom:1px solid #1d262d}.log time{color:var(--muted);font-family:ui-monospace,monospace}.lv-ok span{color:#8ff2cf}.lv-warn span{color:#ffcb6b}.lv-error span{color:#ff9a8f}.toasts{position:fixed;top:64px;left:50%;transform:translate(-50%);display:flex;flex-direction:column;gap:6px;z-index:10}.toast{padding:8px 14px;border-radius:8px;font-size:13px;box-shadow:0 4px 16px #00000059}.toast.ok{background:#13463a;color:#c8f7e6}.toast.error{background:#561a14;color:#ffd4ce}