.uplot,.uplot *,.uplot *:before,.uplot *:after{box-sizing:border-box}.uplot{font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,"Noto Color Emoji";line-height:1.5;width:min-content}.u-title{text-align:center;font-size:18px;font-weight:700}.u-wrap{position:relative;-webkit-user-select:none;user-select:none}.u-over,.u-under{position:absolute}.u-under{overflow:hidden}.uplot canvas{display:block;position:relative;width:100%;height:100%}.u-axis{position:absolute}.u-legend{font-size:14px;margin:auto;text-align:center}.u-inline{display:block}.u-inline *{display:inline-block}.u-inline tr{margin-right:16px}.u-legend th{font-weight:600}.u-legend th>*{vertical-align:middle;display:inline-block}.u-legend .u-marker{width:1em;height:1em;margin-right:4px;background-clip:padding-box!important}.u-inline.u-live th:after{content:":";vertical-align:middle}.u-inline:not(.u-live) .u-value{display:none}.u-series>*{padding:4px}.u-series th{cursor:pointer}.u-legend .u-off>*{opacity:.3}.u-select{background:#00000012;position:absolute;pointer-events:none}.u-cursor-x,.u-cursor-y{position:absolute;left:0;top:0;pointer-events:none;will-change:transform}.u-hz .u-cursor-x,.u-vt .u-cursor-y{height:100%;border-right:1px dashed #607D8B}.u-hz .u-cursor-y,.u-vt .u-cursor-x{width:100%;border-bottom:1px dashed #607D8B}.u-cursor-pt{position:absolute;top:0;left:0;border-radius:50%;border:0 solid;pointer-events:none;will-change:transform;background-clip:padding-box!important}.u-axis.u-off,.u-select.u-off,.u-cursor-x.u-off,.u-cursor-y.u-off,.u-cursor-pt.u-off{display:none}:root{--bg: #14161a;--panel: #1c1f26;--panel-head: #242832;--border: #2e3340;--text: #d7dae0;--text-dim: #8b91a0;--accent: #4da3ff;--ok: #3fca6b;--warn: #e8b93c;--bad: #e85c5c;font-family:Pretendard,Noto Sans KR,system-ui,sans-serif}*{box-sizing:border-box}html,body,#root{height:100%;margin:0;background:var(--bg);color:var(--text)}.app{display:flex;flex-direction:column;height:100%}.topbar{display:flex;align-items:center;gap:16px;padding:8px 14px;background:var(--panel-head);border-bottom:1px solid var(--border);flex:0 0 auto}.topbar h1{font-size:15px;margin:0;font-weight:700;letter-spacing:.5px}.topbar .brand{height:18px;width:auto;flex:0 0 auto;display:block;background:#fff;padding:3px 7px;border-radius:4px;box-sizing:content-box}.topbar .spacer{flex:1}.badge{padding:2px 10px;border-radius:10px;font-size:12px;font-weight:600;background:var(--border);color:var(--text-dim)}.badge.ok{background:#3fca6b26;color:var(--ok)}.badge.warn{background:#e8b93c26;color:var(--warn)}.badge.bad{background:#e85c5c26;color:var(--bad)}.workspace{flex:1;min-height:0;position:relative}.grid{display:grid;height:100%;gap:0;padding:6px;--split: 8px}.grid>.panel{margin:3px}.panel-3d{grid-column:1;grid-row:1 / 6}.panel-plot{grid-column:3;grid-row:1}.panel-stack{grid-column:3;grid-row:5}.splitter{position:relative;touch-action:none;z-index:5}.splitter:after{content:"";position:absolute;border-radius:3px;background:var(--border);transition:background .12s}.splitter-x{grid-column:2;grid-row:1 / 6;cursor:col-resize}.splitter-x:after{top:12px;bottom:12px;left:2px;right:2px}.splitter-y{grid-column:3;cursor:row-resize}.grid>.splitter-y{grid-row:2}.grid>.splitter-cam{grid-row:4}.splitter-y:after{left:12px;right:12px;top:2px;bottom:2px}.splitter:hover:after,.splitter.dragging:after{background:var(--accent)}.panel-stack>.splitter-y,.panel-stack>.splitter-x{grid-column:auto;grid-row:auto;flex:0 0 var(--split, 8px)}.panel{background:var(--panel);border:1px solid var(--border);border-radius:6px;display:flex;flex-direction:column;min-height:0;min-width:0;overflow:hidden}.panel-head{padding:5px 10px;font-size:12px;font-weight:600;color:var(--text-dim);background:var(--panel-head);border-bottom:1px solid var(--border);display:flex;align-items:center;gap:8px;flex:0 0 auto;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;white-space:nowrap;user-select:none;-webkit-user-select:none}.panel-head::-webkit-scrollbar{display:none}.panel-head>*{flex:0 0 auto;white-space:nowrap}.panel-body{flex:1;min-height:0;position:relative}.status-grid{display:grid;grid-template-columns:1fr;gap:5px;padding:8px}.cam-row{grid-column:3;grid-row:3;display:grid;grid-template-columns:repeat(3,1fr);gap:6px;min-height:0;margin:3px}.cam-row>.panel{margin:0;min-width:0}.stat{background:var(--bg);border-radius:4px;padding:5px 8px}.stat .k{font-size:10px;color:var(--text-dim)}.stat .v{font-size:11px;font-weight:600;margin-top:1px;font-variant-numeric:tabular-nums;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.control{display:flex;gap:12px;padding:10px;align-items:center;flex-wrap:nowrap}.joystick{width:140px;height:140px;border-radius:50%;background:radial-gradient(circle at 50% 42%,#262c38,#1b2028 62%,#14181f);border:1px solid #39404f;position:relative;touch-action:none;flex:0 0 auto;box-shadow:inset 0 2px 10px #0000008c,0 1px #ffffff08}.joystick:after{content:"";position:absolute;top:26%;right:26%;bottom:26%;left:26%;border-radius:50%;border:1px dashed rgba(255,255,255,.1);pointer-events:none}.joystick.joy-active{border-color:var(--accent);box-shadow:0 0 0 2px #4da3ff40}.joystick .knob{width:44px;height:44px;border-radius:50%;background:radial-gradient(circle at 44% 34%,#8ccbff,#4da3ff 46%,#2f7fd0);position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);cursor:grab;box-shadow:0 3px 10px #00000073,inset 0 -2px 5px #00000047;border:1px solid rgba(255,255,255,.22)}.joystick.joy-active .knob{cursor:grabbing}.joy-dir,.joy-label{position:absolute;color:#ffffff4d;pointer-events:none;-webkit-user-select:none;user-select:none;line-height:1}.joy-dir{font-size:11px}.joy-n{top:6px;left:50%;transform:translate(-50%)}.joy-s{bottom:6px;left:50%;transform:translate(-50%)}.joy-w{left:6px;top:50%;transform:translateY(-50%)}.joy-e{right:6px;top:50%;transform:translateY(-50%)}.joy-label{font-size:9px;letter-spacing:.5px;color:#ffffff38}.joy-lab-n{top:19px;left:50%;transform:translate(-50%)}.joy-lab-s{bottom:19px;left:50%;transform:translate(-50%)}.ctl-col{display:flex;flex-flow:row wrap;align-items:flex-start;align-content:flex-start;gap:6px 10px;min-width:0;flex:1 1 auto}.ctl-col>label{flex:0 0 auto}.ctl-col>input[type=range]{flex:0 1 150px;min-width:110px}.ctl-col>div[style*="font-size: 11px"],.ctl-col>div[style*="font-size: 12px"]{flex:1 0 100%}.btn-row{display:flex;gap:6px;flex-wrap:wrap}.ctl-col>.btn-row{flex:1 0 100%}.control .btn-row button,.control .btn-row select{flex:1 1 auto}button:disabled{opacity:.45;cursor:default}button{background:linear-gradient(180deg,#333a49,#2b313d);color:var(--text);border:1px solid #3d4553;border-radius:6px;padding:7px 13px;font-size:13px;font-weight:500;cursor:pointer;transition:background .12s,border-color .12s,transform .06s;line-height:1.2}button:hover:not(:disabled){background:linear-gradient(180deg,#3d4557,#333a49);border-color:#4a5364}button:active:not(:disabled){transform:translateY(1px)}button.primary{background:linear-gradient(180deg,#5fb0ff,#3f92e8);color:#05101d;font-weight:700;border-color:#6cb8ff;box-shadow:0 1px 6px #4da3ff40}button.primary:hover:not(:disabled){background:linear-gradient(180deg,#74bcff,#4c9df0)}button.danger{background:linear-gradient(180deg,#ef6a63,#d9504a);color:#fff;font-weight:700;border-color:#f07b74}button.danger:hover:not(:disabled){background:linear-gradient(180deg,#f57a72,#e35b55)}input[type=text],select{background:var(--bg);color:var(--text);border:1px solid var(--border);border-radius:4px;padding:6px 8px;font-size:13px}input[type=range]{width:100%}.replaybar{display:flex;align-items:center;gap:10px;padding:6px 14px;background:var(--panel-head);border-top:1px solid var(--border);flex:0 0 auto}.replaybar .time{font-variant-numeric:tabular-nums;font-size:12px;color:var(--text-dim)}.replaybar input[type=range]{flex:1}.uplot-wrap{position:absolute;top:0;right:0;bottom:0;left:0;padding:4px}canvas{display:block}.cam-body{display:block;height:100%;padding:0;overflow:hidden}.cam-body img{width:100%;height:100%;object-fit:cover;display:block}.placeholder{color:var(--text-dim);font-size:13px;display:flex;align-items:center;justify-content:center;height:100%}.mode-chip{padding:1px 8px;border-radius:9px;font-size:11px;font-weight:600;background:var(--border);color:var(--text-dim);margin-left:2px;display:inline-flex;align-items:baseline;gap:5px}.mode-chip i{font-style:normal;font-size:10px;font-weight:500;opacity:.62}.mode-chip.gait{background:#4da3ff29;color:var(--accent)}.mode-chip.auto{background:#3fca6b29;color:var(--ok)}.mode-chip.idle{background:#8b91a029;color:var(--text-dim)}.mode-chip.pick{background:#e8b93c2e;color:var(--warn)}.ros-sec{padding:8px 10px;border-bottom:1px solid var(--border);min-width:0}.ros-sub{font-size:12px;font-weight:700;margin-bottom:4px}.ros-stale{color:var(--warn);font-weight:400}.ros-hint{font-size:10px;color:var(--text-dim);margin:4px 0;overflow-wrap:anywhere}.ros-empty{padding:12px;font-size:12px;color:var(--text-dim);overflow-wrap:anywhere}.ros-empty ul{margin:6px 0 0;padding-left:18px;line-height:1.7}.ros-empty code{background:var(--bg);padding:1px 5px;border-radius:3px;font-size:11px}.ros-tbl{width:100%;table-layout:fixed;border-collapse:collapse;font-size:11px}.ros-tbl td,.ros-tbl th{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ros-tbl th{text-align:left;color:var(--text-dim);font-weight:600;border-bottom:1px solid var(--border);padding:3px 4px}.ros-tbl td{padding:2px 4px;border-bottom:1px solid rgba(46,51,64,.5)}.ros-tbl .mono{font-family:ui-monospace,monospace}.ros-tbl .dim{color:var(--text-dim)}.ros-tbl .num{text-align:right;font-variant-numeric:tabular-nums}.ros-sim-tag{margin-left:6px;padding:0 6px;border-radius:8px;font-size:10px;font-weight:700;font-family:inherit;background:#e8b93c2e;color:var(--warn)}.cloud-fit{position:absolute;left:10px;bottom:10px;z-index:6;background:#1c1f26f0;border:1px solid var(--border);border-radius:6px;padding:8px 10px;min-width:208px;box-shadow:0 6px 20px #00000080}.cf-head{font-size:12px;font-weight:700;color:var(--text);margin-bottom:6px;display:flex;align-items:baseline;gap:8px}.cf-hint{font-size:10px;font-weight:400;color:var(--text-dim)}.cf-row{display:flex;align-items:center;gap:6px;margin-top:4px;font-size:11px;color:var(--text-dim)}.cf-row>span:first-child{width:40px;flex:0 0 auto}.cf-row>b{flex:1;text-align:center;font-size:12px;color:var(--text);font-variant-numeric:tabular-nums}.cf-row button{padding:2px 9px;font-size:12px}.cf-row select{font-size:11px;padding:1px 4px}.cf-note{margin-top:6px;font-size:10px;color:var(--text-dim)}.cf-auto{color:var(--text);background:var(--bg);border-radius:4px;padding:4px 6px;line-height:1.5;max-width:240px}.control-dock{position:fixed;z-index:45;width:min(470px,calc(100vw - 24px));resize:both;overflow:hidden;min-width:260px;min-height:90px;max-height:calc(100vh - 120px);box-shadow:0 8px 28px #0000008c;background:#1e222af0;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}.control-dock .dock-head{cursor:grab;-webkit-user-select:none;user-select:none;touch-action:none;overflow:hidden}.control-dock .dock-head.dragging{cursor:grabbing}.control-dock .dock-body{overflow:auto}.control-dock.collapsed{max-height:none}.dock-toggle{padding:0 7px;font-size:12px;line-height:18px;border-radius:4px}.camera-dock{position:fixed;right:12px;bottom:48px;z-index:40;width:min(420px,calc(100vw - 24px));height:min(260px,40vh)}.mobile-controls{display:none}@media (max-width: 860px){.mobile-controls{display:flex;position:fixed;left:0;right:0;bottom:54px;z-index:30;justify-content:space-between;align-items:flex-end;padding:0 14px;pointer-events:none;gap:22px}.mobile-controls>*{pointer-events:auto}.mobile-controls>.joystick{flex:0 0 auto}.mobile-right{display:flex;flex-direction:column;gap:8px;align-items:stretch;flex:1 1 auto;min-width:0;max-width:62vw}.mobile-right>.badge{align-self:flex-end}.mobile-controls .btn-row{flex-wrap:nowrap}.mobile-controls .btn-row button{flex:1 1 auto;min-width:0}.joystick.joy-overlay{background:#1c1f268c;border-color:#4da3ff80;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.joystick.joy-overlay .knob{opacity:.9}.camera-dock{bottom:218px;height:min(230px,30vh)}.control-dock{display:none}.grid{display:flex;flex-direction:column;overflow-y:auto;gap:6px;height:100%;-webkit-overflow-scrolling:touch}.grid>.panel{margin:0}.panel{flex:0 0 auto}.splitter{display:none}.panel-stack{display:flex!important;flex-direction:column}.panel-3d{height:52vh;min-height:280px}.panel-plot{height:220px}.panel-stack{min-height:auto;overflow:visible}.panel-stack>.stack-sec{flex:0 0 auto}.panel-stack>.stack-sec>.panel-body{overflow:visible!important;flex:0 0 auto}.topbar{flex-wrap:wrap;gap:6px;padding:6px 10px;row-gap:4px}.topbar h1{font-size:14px}.topbar .brand{height:14px;padding:2px 5px}.topbar select{max-width:46vw}.badge{font-size:11px;padding:2px 7px}.joystick{width:180px;height:180px}.joystick .knob{width:56px;height:56px}.control{justify-content:center;flex-wrap:wrap}.status-grid{grid-template-columns:repeat(2,1fr);gap:6px;padding:8px}.cam-row{grid-template-columns:1fr;height:auto;gap:6px;margin:0;flex:0 0 auto}.cam-row>.panel{height:30vh;min-height:190px}.stat .v{font-size:13px}.replaybar{padding:8px 10px}button{padding:9px 14px}.mobile-controls button,.panel-stack .control button{padding:7px 10px;font-size:12px}.mobile-controls .btn-row,.panel-stack .control .btn-row{gap:5px}.panel-head button{padding:5px 8px;font-size:11px}}.overlay{position:absolute;top:0;right:0;bottom:0;left:0;background:#14161abf;display:flex;align-items:center;justify-content:center;z-index:10;font-size:15px;font-weight:600;color:var(--warn);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.scene-legend{position:absolute;left:10px;bottom:10px;display:flex;flex-direction:column;gap:3px;padding:6px 8px;border-radius:6px;background:#0c0f149e;border:1px solid rgba(255,255,255,.08);font-size:11px;color:#cdd3dc;pointer-events:none}.scene-legend span{display:flex;align-items:center;gap:6px}.scene-legend i{width:18px;height:0;border-radius:2px}.scene-legend b{color:#8b93a1;font-weight:400;font-size:10px}.scene-legend .lg-plan{border-top:3px solid rgba(77,163,255,.45)}.scene-legend .lg-trail{border-top:3px solid rgba(255,77,77,.8)}@media (max-width: 860px){.scene-legend{font-size:10px;padding:4px 6px}.scene-legend b{display:none}}.help-back{position:fixed;top:0;right:0;bottom:0;left:0;z-index:100;background:#080a0eb8;display:flex;align-items:center;justify-content:center;padding:20px}.help{background:var(--panel);border:1px solid var(--border);border-radius:10px;width:min(920px,100%);max-height:100%;display:flex;flex-direction:column;min-height:0;box-shadow:0 18px 50px #00000080}.help-head{display:flex;align-items:center;gap:10px;padding:12px 16px;border-bottom:1px solid var(--border);background:var(--panel-head);border-radius:10px 10px 0 0}.help-head h2{margin:0;font-size:15px;flex:1}.help-head button{background:none;border:none;color:var(--text-dim);font-size:15px;cursor:pointer;padding:2px 6px}.help-head button:hover{color:var(--text)}.help-body{padding:14px 16px;overflow:auto;font-size:12.5px}.help h3{margin:0 0 6px;font-size:13px;color:var(--accent)}.help p{margin:0 0 6px;line-height:1.6}.help ul{margin:0;padding-left:17px;line-height:1.75}.help li{margin-bottom:2px}.help b{color:var(--text)}.help-warn{border:1px solid rgba(232,185,60,.35);background:#e8b93c12;border-radius:8px;padding:10px 12px 10px 14px;margin-bottom:14px}.help-warn h3{color:var(--warn)}.help-cols{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 22px}.help-line{display:inline-block;width:22px;height:0;vertical-align:middle;margin-right:2px}.help-line.lg-plan{border-top:3px solid rgba(77,163,255,.5)}.help-line.lg-trail{border-top:3px solid rgba(255,77,77,.9)}.help-foot{display:flex;align-items:center;gap:12px;padding:10px 16px;border-top:1px solid var(--border);font-size:11.5px;color:var(--text-dim)}.help-foot span{flex:1}@media (max-width: 860px){.help-back{padding:8px}.help-cols{grid-template-columns:minmax(0,1fr);gap:12px}.help-body{font-size:12px;padding:12px}}.voice-confirm{display:flex;align-items:center;gap:6px;padding:6px 8px;border-radius:6px;font-size:12px;background:#4da3ff1f;border:1px solid rgba(77,163,255,.45)}.voice-confirm span{flex:1}.voice-confirm button{padding:3px 10px;font-size:11px}
