:root{--bg: #0d1117;--panel: #12161e;--panel-edge: #232b38;--ink: #dde3ec;--ink-dim: #7b8595;--accent: #4fd6c9;--accent-dim: #2a6f6a;--pris: #d6a54f;--danger: #e06c75;--mono: "SF Mono", "JetBrains Mono", "Cascadia Code", ui-monospace, Menlo, Consolas, monospace;--sans: "Inter", "Segoe UI", system-ui, -apple-system, sans-serif}*{box-sizing:border-box;margin:0;padding:0}html,body,#root{height:100%}body{background:var(--bg);color:var(--ink);font-family:var(--sans);overflow:hidden}.app{display:flex;height:100%}.panel{width:330px;min-width:330px;display:flex;flex-direction:column;background:var(--panel);border-right:1px solid var(--panel-edge)}.panel-header{padding:20px 20px 14px;border-bottom:1px solid var(--panel-edge)}.panel-header h1{font-family:var(--mono);font-size:20px;font-weight:600;letter-spacing:.06em}.panel-header h1 .dim{color:var(--accent);font-weight:400}.subtitle{margin-top:4px;font-size:12px;color:var(--ink-dim);letter-spacing:.04em}.panel-scroll{flex:1;overflow-y:auto;padding:14px 20px;scrollbar-width:thin;scrollbar-color:var(--panel-edge) transparent}section{margin-bottom:22px}.section-head{display:flex;align-items:baseline;gap:8px;margin-bottom:10px}.section-head h2{font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.12em;color:var(--ink-dim)}.count{font-family:var(--mono);font-size:10px;color:var(--accent);border:1px solid var(--accent-dim);border-radius:3px;padding:0 5px}.section-toggle{display:flex;align-items:center;gap:8px;width:100%;background:none;border:none;color:var(--ink-dim);font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.12em;cursor:pointer;padding:4px 0;margin-bottom:8px}.section-toggle:hover{color:var(--ink)}.chevron{width:10px}.joint-row{margin-bottom:14px}.joint-head{display:flex;align-items:baseline;gap:8px;margin-bottom:5px}.joint-name{font-family:var(--mono);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1}.joint-type{font-family:var(--mono);font-size:9px;letter-spacing:.08em;padding:1px 4px;border-radius:2px;border:1px solid var(--accent-dim);color:var(--accent)}.joint-type.prismatic{border-color:#6d5526;color:var(--pris)}.joint-value{font-family:var(--mono);font-size:12px;color:var(--accent);min-width:64px;text-align:right;font-variant-numeric:tabular-nums}input[type=range]{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:100%;height:3px;background:var(--panel-edge);border-radius:2px;outline:none}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:13px;height:13px;border-radius:50%;background:var(--accent);border:2px solid var(--panel);cursor:grab;transition:transform .1s ease}input[type=range]::-webkit-slider-thumb:hover{transform:scale(1.2)}input[type=range]::-webkit-slider-thumb:active{cursor:grabbing}input[type=range]::-moz-range-thumb{width:13px;height:13px;border-radius:50%;background:var(--accent);border:2px solid var(--panel);cursor:grab}input[type=range]:focus-visible{box-shadow:0 0 0 2px var(--accent-dim)}input[type=range]:disabled{opacity:.55}input[type=range]:disabled::-webkit-slider-thumb{cursor:default;transform:none}input[type=range]:disabled::-moz-range-thumb{cursor:default}.hint{font-size:11.5px;line-height:1.5;color:var(--ink-dim);margin-bottom:10px}.hint.error{color:var(--danger)}.hint.live{color:var(--accent)}.panel-footer{padding:14px 20px;border-top:1px solid var(--panel-edge)}.reset{width:100%;padding:9px 0;font-family:var(--mono);font-size:12px;letter-spacing:.06em;color:var(--ink);background:transparent;border:1px solid var(--panel-edge);border-radius:4px;cursor:pointer;transition:border-color .15s ease,color .15s ease}.reset:hover{border-color:var(--accent);color:var(--accent)}.viewport{flex:1;position:relative;min-width:0}.viewport canvas{display:block}.viewport-hud{position:absolute;bottom:12px;right:16px;display:flex;gap:16px;font-family:var(--mono);font-size:10px;letter-spacing:.05em;color:var(--ink-dim);pointer-events:none;-webkit-user-select:none;user-select:none}.viewport-hud .hud-sep{opacity:.35}@media (max-width: 760px){.app{flex-direction:column-reverse}.panel{width:100%;min-width:0;height:45%;border-right:none;border-top:1px solid var(--panel-edge)}.viewport{height:55%;flex:none}}@media (prefers-reduced-motion: reduce){*{transition:none!important}}.mode-switch{display:flex;margin-top:12px;border:1px solid var(--panel-edge);border-radius:5px;overflow:hidden}.mode-switch button{flex:1;padding:6px 0;font-family:var(--mono);font-size:11px;letter-spacing:.05em;color:var(--ink-dim);background:transparent;border:none;cursor:pointer;transition:color .15s ease,background .15s ease}.mode-switch button.on{color:var(--bg);background:var(--accent);font-weight:600}.readout-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-bottom:10px}.readout{display:flex;flex-direction:column;gap:2px;padding:7px 9px;border:1px solid var(--panel-edge);border-radius:4px;background:#ffffff04}.readout-name{font-family:var(--mono);font-size:10px;color:var(--ink-dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.readout-val{font-family:var(--mono);font-size:13px;color:var(--accent);font-variant-numeric:tabular-nums}.hint.limit{color:var(--pris)}.joint-row.at-limit input[type=range]::-webkit-slider-thumb{background:var(--pris)}.joint-row.at-limit input[type=range]::-moz-range-thumb{background:var(--pris)}.robot-title{margin:0 0 6px;font-family:var(--mono);font-size:14px;font-weight:600;letter-spacing:.04em;color:var(--accent)}.realtime-card{margin-top:12px;padding:10px;border:1px solid var(--panel-edge);border-radius:6px;background:#ffffff05}.realtime-head{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:8px;font-family:var(--mono);font-size:11px;color:var(--ink-dim)}.status-dot{width:8px;height:8px;border-radius:50%;background:var(--ink-dim)}.status-dot.connected{background:var(--accent)}.status-dot.connecting,.status-dot.disconnecting{background:var(--pris)}.status-dot.error{background:var(--danger)}.link-button{font-family:var(--mono);font-size:11px;color:var(--accent);background:transparent;border:none;cursor:pointer}.link-button:hover{color:var(--ink)}.url-row{margin-top:8px}.url-row input{width:100%;padding:7px 8px;font-family:var(--mono);font-size:11px;color:var(--ink);background:var(--bg);border:1px solid var(--panel-edge);border-radius:4px}.url-row input:disabled{color:var(--ink-dim)}.check-row{display:flex;align-items:center;gap:8px;margin-top:8px;font-size:11.5px;color:var(--ink-dim)}.check-row input{accent-color:var(--accent)}.field-row{display:grid;grid-template-columns:1fr auto;align-items:center;gap:10px;margin-top:8px;font-size:11.5px;color:var(--ink-dim)}.field-row select{min-width:86px;padding:5px 7px;font-family:var(--mono);font-size:11px;color:var(--ink);background:var(--bg);border:1px solid var(--panel-edge);border-radius:4px}.field-row.teleop-scale{grid-template-columns:1fr auto}.field-row.teleop-scale input[type=range]{grid-column:1 / -1;width:100%;accent-color:var(--accent)}.device-readout,.angle-triplet{display:grid;gap:6px;margin-top:8px;font-family:var(--mono);font-size:10.5px;color:var(--ink-dim)}.device-readout{grid-template-columns:1fr auto}.device-readout span:last-child{color:var(--accent)}.angle-triplet{grid-template-columns:repeat(3,1fr);color:var(--accent);font-variant-numeric:tabular-nums}.follower-card{margin-bottom:18px;padding-bottom:14px;border-bottom:1px solid var(--panel-edge)}.follower-card .section-head{margin-bottom:6px}.follower-card .section-head h2{font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-dim);font-weight:600}.follower-actions{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:8px;margin-bottom:8px}.follower-home{margin-top:14px;padding-top:12px;border-top:1px solid var(--panel-edge)}.follower-home .section-head h2{font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-dim);font-weight:600}button.browse{border:none;font-family:var(--sans)}.browse{display:inline-flex;align-items:center;padding:6px 10px;font-size:11.5px;color:var(--bg);background:var(--accent);border-radius:4px;cursor:pointer}.browse:hover{filter:brightness(1.08)}.browse input{display:none}.urdf-picker{margin-top:10px;display:flex;flex-direction:column;gap:6px}.urdf-picker button{text-align:left;padding:7px 9px;font-family:var(--mono);font-size:10.5px;color:var(--ink);background:var(--bg);border:1px solid var(--panel-edge);border-radius:4px;cursor:pointer}.urdf-picker button:hover{border-color:var(--accent);color:var(--accent)}.viewport.drop-hot{outline:2px dashed var(--accent);outline-offset:-8px}.drop-overlay{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;background:#0d1117b8;pointer-events:none;z-index:5}.drop-overlay p{font-family:var(--mono);font-size:14px;letter-spacing:.04em;color:var(--accent)}