/* R1 Teleoperation — desktop design system (v2, 14 Oct 2026).
 * One toolbar, two columns: the robot on the left, the session on the right.
 * The session column owns the height of the window: its content scrolls and its
 * actions stay pinned, so no step, notice or control is ever clipped. */

:root{
  font-family:"Segoe UI Variable Text","Segoe UI",-apple-system,BlinkMacSystemFont,"Helvetica Neue",sans-serif;
  --display:"Segoe UI Variable Display","Segoe UI",-apple-system,BlinkMacSystemFont,"Helvetica Neue",sans-serif;
  --mono:"Cascadia Mono",Consolas,"SFMono-Regular",ui-monospace,monospace;
  --bg:#f5f5f7;--surface:#fff;--fill:#f4f4f6;--fill-2:#ececf0;--hover:#ebebef;
  --separator:#e3e3e8;--hairline:rgba(60,60,67,.1);
  --label:#1d1d1f;--label-2:#5f6168;--label-3:#8a8c93;--label-4:#b2b4ba;
  --accent:#0071e3;--accent-wash:#eaf3fe;--accent-text:#0062c4;
  --green:#1f8a4c;--green-wash:#e9f6ee;--green-fill:#2fa45d;
  --orange:#b25a00;--orange-wash:#fff4e5;
  --red:#d70015;--red-wash:#fff0f0;--red-fill:#e0301e;
  --live:#b45309;--live-strong:#9a4708;--live-wash:#fff6ea;--live-line:#f0d3a8;
  --sim:#0a66c2;--sim-wash:#edf5fe;--sim-line:#bcd7f3;
  --radius-card:20px;--radius-group:14px;--radius-control:12px;
  --shadow-card:0 1px 2px rgba(0,0,0,.04),0 6px 24px rgba(17,24,39,.05);
  --toolbar:60px;
  /* Compatibility tokens used by the walking, motion and chat modules. */
  --blue:var(--accent);--muted:var(--label-2);--border:var(--separator);
  color:var(--label);background:var(--bg);font-synthesis:none;-webkit-font-smoothing:antialiased;
}
*{box-sizing:border-box}
html,body{height:100%}
body{margin:0;background:var(--bg);font-size:13px;line-height:1.45}
button,input,select{font:inherit;color:inherit}
button{cursor:pointer}button:disabled{cursor:default}
/* Scrollbars you can always see. Windows 11 hides the window's (overlay) scrollbars until the
 * pointer is over them, so long lists such as Dances and Actions gave no sign they scroll.
 * An element that sets scrollbar-width keeps its own (the tab strips hide theirs). */
@media(pointer:fine){
  ::-webkit-scrollbar{width:12px;height:12px}
  ::-webkit-scrollbar-track,::-webkit-scrollbar-corner{background:transparent}
  ::-webkit-scrollbar-thumb{min-height:36px;background:#c7c7cc padding-box;border:3px solid transparent;border-radius:8px}
  ::-webkit-scrollbar-thumb:hover{background-color:#a1a1a6}
  ::-webkit-scrollbar-thumb:active{background-color:#8a8c93}
}
button,select,summary{outline-offset:3px}
:focus-visible{outline:3px solid #7ab8fb}
svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
.symbol-sheet{position:absolute;width:0;height:0;overflow:hidden}
[hidden]{display:none!important}
h1,h2,h3,h4{font-family:var(--display);color:var(--label);margin:0}
p{margin:0;color:var(--label-2)}
code{font-family:var(--mono)}
.caption,.eyebrow{font-size:11px;letter-spacing:.06em;font-weight:650;color:var(--label-3);text-transform:uppercase}

/* ─── Shell ─────────────────────────────────────────────────────────────── */
.app-shell{height:100dvh;min-height:540px;display:flex;flex-direction:column}
.topbar{position:relative;z-index:20;flex:0 0 var(--toolbar);height:var(--toolbar);display:flex;align-items:center;gap:18px;padding:0 20px;
  background:rgba(251,251,253,.86);backdrop-filter:saturate(180%) blur(18px);border-bottom:1px solid var(--hairline)}
.brand{display:flex;align-items:center;gap:14px;flex:none}
.brand-mark{font-family:var(--display);font-size:22px;letter-spacing:-1.5px;font-weight:750;color:var(--label);line-height:1}
.brand-mark span{font-weight:400;margin-left:1px}
.brand-divider{height:18px;width:1px;background:var(--separator)}
.brand-name{font-size:13px;font-weight:600}
.top-actions{display:flex;align-items:center;gap:8px;margin-left:auto;flex:none}
.icon-button{border:0;background:none;display:grid;place-items:center;color:var(--label-2);width:34px;height:34px;border-radius:10px}
.icon-button:hover{background:var(--hover);color:var(--label)}
.toolbar-button{display:inline-flex;align-items:center;gap:7px;height:34px;padding:0 12px;border:0;border-radius:10px;background:none;color:var(--label-2);font-size:13px;font-weight:600;white-space:nowrap}
.toolbar-button svg{width:17px;height:17px}
.toolbar-button:hover,.toolbar-button[aria-expanded=true]{background:var(--hover);color:var(--label)}
body.performance-view #details-toggle{display:none}
.header-stop{display:inline-flex;align-items:center;gap:7px;height:34px;padding:0 14px;border:0;border-radius:999px;background:var(--red);color:#fff;font-size:13px;font-weight:650;box-shadow:0 1px 2px rgba(215,0,21,.25)}
.header-stop svg{width:15px;height:15px;stroke-width:2.2}
.header-stop:hover:not(:disabled){background:#b80012}
.header-stop:disabled{background:var(--fill-2);color:var(--label-3);box-shadow:none}

main{flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;padding:18px 20px 0;display:flex;flex-direction:column;gap:14px;scrollbar-gutter:stable}
.workspace{flex:0 0 auto;height:clamp(540px,calc(100dvh - var(--toolbar) - 112px),980px);display:grid;grid-template-columns:minmax(330px,.82fr) minmax(470px,1.18fr);gap:16px;max-width:1500px;width:100%;margin:0 auto}
.robot-card,.setup-card{min-height:0;background:var(--surface);border-radius:var(--radius-card);box-shadow:var(--shadow-card);border:1px solid var(--hairline)}

/* ─── Robot column ──────────────────────────────────────────────────────── */
.robot-card{position:relative;overflow:hidden;display:flex;flex-direction:column}
.card-topline{position:relative;z-index:5;display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:18px 20px 0}
.robot-identity{display:flex;flex-direction:column;gap:7px;min-width:0}
.card-topline h2{font-size:19px;font-weight:650;letter-spacing:-.3px}
.mode-badge{display:inline-flex;align-items:center;gap:6px;align-self:flex-start;font-size:11px;font-weight:600;color:var(--label-2);background:var(--fill);border-radius:999px;padding:4px 9px;white-space:nowrap}
.mode-badge span{width:6px;height:6px;border-radius:50%;background:var(--label-4)}
.mode-badge.live{color:var(--green);background:var(--green-wash)}.mode-badge.live span{background:var(--green-fill)}
.status-pill{display:inline-flex;align-items:center;gap:6px;flex:none;font-size:12px;font-weight:600;border-radius:999px;background:var(--fill);color:var(--label-3);padding:5px 10px}
.status-pill>span{width:7px;height:7px;border-radius:50%;background:currentColor}
.status-pill.connected{background:var(--green-wash);color:var(--green)}
.status-pill.warning{background:var(--orange-wash);color:var(--orange)}
.status-pill.error{background:var(--red-wash);color:var(--red)}

.robot-scene{flex:1 1 auto;position:relative;min-height:180px;overflow:hidden;container-type:size}
.simulator-frame{position:absolute;inset:8px 12px;width:calc(100% - 24px);height:calc(100% - 16px);object-fit:contain;background:#eef1f5;border-radius:14px;z-index:2}
.simulator-frame-note{position:absolute;bottom:16px;left:50%;transform:translateX(-50%);background:rgba(255,255,255,.9);backdrop-filter:blur(10px);color:var(--label-2);padding:6px 11px;border-radius:999px;font-size:11px;font-weight:600;z-index:4;white-space:nowrap;box-shadow:0 1px 6px rgba(0,0,0,.08)}
.robot-scene.has-simulation>.robot-illustration,.robot-scene.has-simulation>.scene-label,.robot-scene.has-simulation>.scene-caption,.robot-scene.has-simulation>.scene-halo,.robot-scene.has-simulation>.scene-floor{visibility:hidden}
.robot-illustration{position:absolute;left:50%;top:50%;height:min(92cqh,430px);width:auto;aspect-ratio:430/470;transform:translate(-50%,-52%);overflow:visible;z-index:2}
.scene-halo{position:absolute;left:50%;top:48%;width:min(78cqw,88cqh);aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(circle,#eef3f9 0,#f7f9fc 52%,transparent 70%)}
.robot-card.active .scene-halo{background:radial-gradient(circle,#e3f3ea 0,#f4faf6 52%,transparent 70%)}
.scene-floor{position:absolute;left:50%;bottom:7%;width:min(70cqw,320px);height:52px;transform:translateX(-50%);border-radius:50%;background:radial-gradient(ellipse,#e9edf2,transparent 68%)}
.scene-label{position:absolute;z-index:3;display:flex;align-items:center;gap:7px;font-size:11px;font-weight:600;color:var(--label-3);white-space:nowrap}
.label-head{top:calc(50% - min(31cqh,150px));left:calc(50% + min(10cqh,48px))}
.label-arms{top:calc(50% - min(4cqh,20px));right:min(calc(50% + min(17cqh,82px)),calc(100% - 122px))}
.label-line{width:26px;height:1px;background:var(--separator)}
.scene-label i{width:8px;height:8px;border-radius:50%;background:var(--label-4);box-shadow:0 0 0 3px #fff}
.scene-label i.live{background:var(--green-fill)}.scene-label i.stale{background:#f59e0b}
.scene-caption{position:absolute;z-index:3;left:50%;bottom:10px;transform:translateX(-50%);display:flex;align-items:center;gap:7px;font-size:11px;color:var(--label-3);white-space:nowrap}
.robot-scene:has(.simulator-frame-note:not([hidden])) .scene-caption{visibility:hidden}
.small-dot{width:5px;height:5px;border-radius:50%;background:var(--label-4);display:inline-block}

/* Three live vitals, as one grouped list under the robot. */
.status-grid{flex:none;margin:0 14px;border-radius:var(--radius-group);background:var(--fill);overflow:hidden}
.status-card{position:relative;display:grid;grid-template-columns:30px minmax(0,1fr) auto;align-items:center;column-gap:11px;padding:9px 13px;min-height:52px}
.status-card+.status-card:before{content:'';position:absolute;top:0;left:54px;right:0;height:1px;background:var(--separator)}
.tile-icon{width:30px;height:30px;border-radius:9px;display:grid;place-items:center;background:var(--surface);color:var(--label-2)}
.tile-icon svg{width:17px;height:17px}
.tile-copy{display:grid;grid-template-columns:auto minmax(0,1fr);column-gap:8px;align-items:baseline;min-width:0}
.tile-label{grid-column:1/-1;font-size:11px;font-weight:600;color:var(--label-3)}
.status-card strong{font-size:14px;font-weight:650;color:var(--label);white-space:nowrap}
.tile-detail{font-size:12px;color:var(--label-2);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tile-dot{width:9px;height:9px;border-radius:50%;background:var(--label-4)}
.tile-dot.live{background:var(--green-fill)}.tile-dot.stale{background:#f59e0b}
.session-time{font-size:13px;font-weight:650;font-variant-numeric:tabular-nums;color:var(--label)}
.status-card[data-tone=good] .tile-icon{color:var(--green)}.status-card[data-tone=good] strong{color:var(--green)}
.status-card[data-tone=waiting] .tile-icon{color:var(--accent)}.status-card[data-tone=waiting] strong{color:var(--accent-text)}
.status-card[data-tone=warning] .tile-icon,.status-card[data-tone=warning] strong{color:var(--orange)}
.status-card[data-tone=error] .tile-icon,.status-card[data-tone=error] strong{color:var(--red)}
.robot-footer{flex:none;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 20px 13px;font-size:11px;color:var(--label-3)}
.robot-footer>div{display:flex;align-items:center;gap:7px;min-width:0;white-space:nowrap}
.robot-footer svg{width:16px;height:16px}
.illustration-note{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* Network, in the top bar on every tab (robot_link.py): a pill naming the hub that reaches Tony,
 * opening a panel with the laptop hotspot / router Wi-Fi switch and the connection test (link_test.py). */
.link-pill{display:inline-flex;align-items:center;gap:7px;flex:none;height:34px;padding:0 12px 0 10px;border:0;border-radius:10px;background:var(--fill-2);color:var(--label);font-size:13px;font-weight:600;white-space:nowrap;transition:background .15s}
.link-pill[hidden]{display:none}
.link-pill svg{width:17px;height:17px;color:var(--label-2)}
.link-pill:hover,.link-pill[aria-expanded=true]{background:var(--hover)}
.link-pill:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.link-pill-dot{width:7px;height:7px;border-radius:50%;background:var(--label-3)}
/* Tony there or not (James, 8 Nov): a robot, green when the app can reach him (Wi-Fi, cable or Bluetooth), red and
 * struck through when it cannot, grey until the first check. Its own colours, whatever the network dot says. */
.link-pill-robot{display:grid;place-items:center;flex:none;width:24px;height:24px;margin-left:-3px;border-radius:7px;background:var(--fill-2);color:var(--label-3);transition:background .2s,color .2s}
.link-pill .link-pill-robot[data-online] svg{width:18px;height:18px;color:inherit;stroke-width:1.8}
.link-pill-robot[data-online=yes]{background:var(--green-wash);color:var(--green)}
.link-pill-robot[data-online=no]{background:var(--red-wash);color:var(--red)}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.link-pill[data-level=ok] .link-pill-dot{background:#34c759}
.link-pill[data-level=warn] .link-pill-dot{background:#ff9f0a}
.link-pill[data-level=fail] .link-pill-dot{background:#ff3b30}
.link-pill[data-level=busy] .link-pill-dot{background:var(--accent);animation:link-pulse .8s ease-in-out infinite alternate}
.link-pill[data-level=none]{color:var(--orange)}
.link-pill[data-level=none] svg,.link-pill[data-level=none] .link-pill-dot{color:var(--orange);background-color:transparent}
.link-pill[data-level=none] .link-pill-dot{display:none}
.link-panel{position:absolute;top:calc(100% + 4px);left:var(--link-panel-left,16px);width:min(420px,calc(100vw - 24px));z-index:30;max-height:calc(100dvh - 80px);overflow:auto;padding:14px 16px 10px;border-radius:16px;background:var(--surface);box-shadow:0 10px 36px rgba(0,0,0,.16),0 0 0 .5px rgba(0,0,0,.08);font-size:12px;color:var(--label-2)}
/* With the pill, the Simulator / Real robot switch stops being centred below 1260 px, and Phone and
 * Activity & details become icons below 1100 px, so the top bar never overlaps (phones: mobile.css). */
@media(min-width:641px) and (max-width:1260px){
  .topbar:has(.link-pill:not([hidden])) .destination-controls{position:static;transform:none;margin-left:auto;order:2}
  .topbar:has(.link-pill:not([hidden])) .top-actions{margin-left:0;order:3}}
@media(min-width:641px) and (max-width:1100px){
  .topbar:has(.link-pill:not([hidden])) .top-actions{gap:4px}
  .topbar:has(.link-pill:not([hidden])) .toolbar-button{width:36px;padding:0;justify-content:center}
  .topbar:has(.link-pill:not([hidden])) .toolbar-button>span:not([class]){display:none}
  .topbar:has(.link-pill:not([hidden])) #help-button{display:none}}   /* the same "i" as Activity & details */
.link-panel>header{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}
.link-panel>header strong{font-size:15px;font-weight:650;color:var(--label)}
.link-switch-status{margin:7px 2px 0;line-height:1.4;color:var(--label-3)}
.link-switch-status:empty{display:none}
.link-switch[data-switching=true] .link-switch-status{color:var(--accent-text);font-weight:600}
.link-segments{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));padding:2px;border-radius:9px;background:var(--fill-2)}
.link-segments button{min-height:38px;padding:4px 6px;border:0;border-radius:7px;background:none;color:var(--label-2);font-size:13px;font-weight:600;transition:background .15s,color .15s}
.link-segments button[aria-checked=true]{background:var(--surface);color:var(--label);box-shadow:0 1px 2px rgba(0,0,0,.12)}
.link-segments button:hover:not(:disabled):not([aria-checked=true]){color:var(--label)}
.link-segments button:disabled{cursor:default}
.link-segments button:disabled:not([aria-checked=true]),.link-segments button[aria-disabled=true]:not([aria-checked=true]){opacity:.55}
.link-segments button:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
.link-switch[data-switching=true] .link-segments button[aria-checked=true]{color:var(--accent-text)}
.link-via{display:flex;align-items:center;gap:10px;margin-top:8px}
.link-via[hidden]{display:none}
.link-via>span{flex:none;color:var(--label-3)}
.link-via .link-segments{flex:1}
.link-segments-two{grid-template-columns:repeat(2,minmax(0,1fr))}
.link-segments-two button{min-height:30px;font-size:12px}
/* Four networks (7 Nov: Direct Wi-Fi added): two by two, so each name stays whole on a phone. */
.link-segments-four{grid-template-columns:repeat(2,minmax(0,1fr));gap:2px}
@keyframes link-pulse{to{opacity:.35}}
/* Tony's own Wi-Fi, under the test's verdict: the link first, the lists behind a disclosure. */
.link-history{margin-top:14px;padding-top:4px;border-top:.5px solid var(--separator)}
.link-history>summary{display:flex;align-items:center;gap:8px;min-height:44px;font-size:15px;font-weight:650;color:var(--label);cursor:pointer;list-style:none}
.link-history>summary::-webkit-details-marker{display:none}
.link-history>summary:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:8px}
.link-history-note{margin:0 0 6px;line-height:1.45;color:var(--label-2)}
.link-history-note:empty{display:none}
.link-history-list{list-style:none;margin:0;padding:0}
.link-history-list li{display:grid;grid-template-columns:auto minmax(0,1fr);column-gap:10px;padding:8px 0;border-top:.5px solid var(--separator)}
.link-history-list time{color:var(--label-2);font-variant-numeric:tabular-nums;white-space:nowrap}
.link-history-list span{color:var(--label);line-height:1.4;overflow-wrap:anywhere}
.link-history-list small{grid-column:2;margin-top:2px;color:var(--label-3);overflow-wrap:anywhere}
.link-tony{margin-top:14px;padding-top:12px;border-top:.5px solid var(--separator)}
.link-tony[hidden],.link-tony [hidden]{display:none}
.link-tony header{display:flex;align-items:center;justify-content:space-between;gap:10px}
.link-tony header strong{font-size:15px;font-weight:650;color:var(--label)}
.link-tony-now{margin:6px 0 0;font-size:13px;font-weight:600;color:var(--label);overflow-wrap:anywhere}
.link-tony[data-band="5"] .link-tony-now{color:var(--accent-text)}
.link-tony-detail{margin:2px 0 0;color:var(--label-3)}
.link-tony-detail:empty,.link-tony-reason:empty{display:none}
.link-tony-try{width:100%;min-height:38px;margin-top:10px}
.link-tony-try[hidden]{display:none}
.link-tony-try[data-running=true]{color:var(--accent-text)}
.link-tony-reason{margin:7px 2px 0;line-height:1.4;color:var(--label-2);overflow-wrap:anywhere}
.link-tony-more{margin-top:8px}
.link-tony-more summary{display:flex;align-items:center;min-height:30px;font-weight:600;color:var(--label-2);cursor:pointer;list-style:none}
.link-tony-more summary::before{content:'';flex:none;width:7px;height:7px;margin:0 9px 0 2px;border-right:1.6px solid currentColor;border-bottom:1.6px solid currentColor;transform:rotate(-45deg);transition:transform .15s}
.link-tony-more[open] summary::before{transform:rotate(45deg)}
.link-tony-more summary::-webkit-details-marker{display:none}
.link-tony-more summary:focus-visible{outline:2px solid var(--accent);outline-offset:1px;border-radius:6px}
.link-tony-list{list-style:none;margin:2px 0 0;padding:0}
.link-tony-list li{display:flex;flex-direction:column;gap:1px;padding:6px 0;border-top:.5px solid var(--separator);overflow-wrap:anywhere}
.link-tony-list li strong{font-weight:600;color:var(--label)}
.link-tony-list li span{color:var(--label-3);line-height:1.35}
.link-tony-list li[data-use=true] strong{color:var(--accent-text)}
.link-tony-list li[data-ok=false] strong{color:#c4291c}
.link-tony-list .link-tony-note{color:var(--label-3);border-top:0}
/* Saved networks (James, 6 Nov): add, join, forget, "Stay on this one". */
.link-tony-nets{margin-top:10px}
.link-tony-stay{margin-top:0}
.link-tony-change{margin:7px 2px 0;line-height:1.4;color:var(--label-2);overflow-wrap:anywhere}
.link-tony-change:empty{display:none}
.link-tony-change[data-ok=true]{color:var(--accent-text)}
.link-tony-change[data-ok=false]{color:#c4291c}
.link-tony-saved-list li{flex-direction:row;align-items:center;gap:10px}
.link-tony-saved-list .link-tony-net{display:flex;flex:1;min-width:0;flex-direction:column;gap:1px}
.link-tony-saved-list li[data-on=true] .link-tony-net strong{color:var(--accent-text)}
.link-tony-net-actions{display:flex;flex:none;gap:4px}
.link-tony-net-actions .text-button{min-height:32px;padding:0 8px}
.link-tony-net-actions .text-button[data-act=forget]{color:#c4291c}
.link-tony-add{width:100%;min-height:38px;margin-top:10px}
.tony-net-dialog{padding:24px}
.tony-net-dialog h2{font-size:20px}
.tony-net-field{display:flex;flex-direction:column;gap:6px;margin-top:14px;font-size:13px;font-weight:600;color:var(--label-2)}
.tony-net-field[hidden]{display:none}
.tony-net-field input{min-height:40px;padding:0 12px;border:1px solid var(--separator);border-radius:10px;background:var(--surface);color:var(--label);font:inherit;font-size:15px;font-weight:500}
.tony-net-field input:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
.tony-net-kinds{grid-template-columns:repeat(3,1fr)}
.tony-net-check{display:flex;align-items:center;gap:8px;min-height:36px;margin-top:6px;font-size:13px;color:var(--label-2)}
.tony-net-check[hidden]{display:none}
.tony-net-check input{width:18px;height:18px;margin:0}
dialog .tony-net-note{margin-top:10px;font-size:13px;line-height:1.45;color:var(--label-3)}
dialog .tony-net-error{margin-top:8px;font-size:13px;color:#c4291c}
dialog .tony-net-error:empty{display:none}
.tony-net-buttons{display:flex;justify-content:flex-end;gap:10px;margin-top:16px}
.tony-net-buttons{align-items:stretch}
.tony-net-dialog .tony-net-buttons button{height:40px;min-height:0;margin:0;padding:0 16px}
/* Connection test results, under the switch in the Network panel. */
.link-slow{display:grid;gap:3px;margin-bottom:12px;padding:10px 12px;border-radius:10px;background:rgba(255,159,10,.14);overflow-wrap:anywhere}
.link-slow[hidden]{display:none}
.link-slow strong{font-size:14px;font-weight:650;color:var(--label)}
.link-slow span{font-size:13px;line-height:1.35;color:var(--label-2)}
.link-slow[data-moving=true]{background:rgba(10,132,255,.14)}
.link-report{margin-top:14px;padding-top:12px;border-top:.5px solid var(--separator)}
.link-report header{display:flex;align-items:center;gap:9px}
.link-report header strong{flex:1;font-size:15px;font-weight:650;color:var(--label)}
.link-report-mark{flex:none;width:10px;height:10px;border-radius:50%;background:var(--label-3)}
.link-report[data-level=ok] .link-report-mark{background:#34c759}
.link-report[data-level=warn] .link-report-mark{background:#ff9f0a}
.link-report[data-level=fail] .link-report-mark{background:#ff3b30}
.link-report[data-level=running] .link-report-mark,.link-report[data-level=none] .link-report-mark{background:var(--label-3)}
.link-report[data-level=running] .link-report-mark{background:var(--accent);animation:link-pulse .8s ease-in-out infinite alternate}
.link-report-close{display:inline-grid;place-items:center;width:26px;height:26px;border:0;border-radius:50%;background:var(--fill-2);color:var(--label-2)}
.link-report-close svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round}
.link-report-close:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.link-report>p{margin:6px 0 0 19px;line-height:1.45;color:var(--label-2)}
.link-report>p:empty{display:none}
.link-speed{margin:10px 0 2px}
.link-speed table{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums}
.link-speed thead th{padding:0 0 4px 8px;font-size:10.5px;font-weight:500;text-align:right;color:var(--label-3)}
.link-speed thead th:first-child{padding-left:17px;text-align:left}
.link-path>th{padding:6px 0;font-weight:500;text-align:left;color:var(--label);border-top:.5px solid var(--separator)}
.link-path>th::before{content:'';display:inline-block;width:7px;height:7px;margin-right:10px;border-radius:50%;background:var(--label-3);transform:translateY(-1px)}
.link-path[data-status=ok]>th::before{background:#34c759}
.link-path[data-status=warn]>th::before{background:#ff9f0a}
.link-path[data-status=fail]>th::before{background:#ff3b30}
.link-path>td{width:58px;padding:6px 0 6px 8px;font-weight:600;text-align:right;color:var(--label);border-top:.5px solid var(--separator)}
.link-path>td.link-latency{width:62px;font-weight:500;color:var(--label-2);white-space:nowrap}
.link-path-note>td{padding:0 0 6px 17px;font-size:11px;line-height:1.35;color:var(--label-3);overflow-wrap:anywhere}
.link-checks{list-style:none;margin:8px 0 0;padding:0}
.link-checks li{display:grid;grid-template-columns:10px 92px minmax(0,1fr);align-items:baseline;column-gap:9px;padding:6px 0;border-top:.5px solid var(--separator)}
.link-checks li::before{content:'';width:7px;height:7px;border-radius:50%;background:#34c759;transform:translateY(-1px)}
.link-checks li[data-status=warn]::before{background:#ff9f0a}
.link-checks li[data-status=fail]::before{background:#ff3b30}
.link-checks li strong{font-weight:600;color:var(--label)}
.link-checks li span{line-height:1.4}
.link-report footer{display:flex;align-items:center;justify-content:space-between;margin-top:6px;color:var(--label-3)}
@media (prefers-reduced-motion:reduce){.link-tony-more summary::before{transition:none}.link-segments button,.link-pill,.link-pill-robot{transition:none}.link-pill[data-level=busy] .link-pill-dot,.link-report[data-level=running] .link-report-mark{animation:none}}

/* ─── Session column ────────────────────────────────────────────────────── */
.setup-card{display:flex;flex-direction:column;overflow:hidden}
.setup-scroll{--setup-pad-top:22px;--setup-pad-x:24px;flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:var(--setup-pad-top) var(--setup-pad-x) 18px;display:flex;flex-direction:column;gap:14px}
.setup-heading{display:flex;flex-direction:column;gap:6px}
/* Session kicker, timer and title stay pinned while the rest of the card scrolls. */
.setup-pinned{position:sticky;top:calc(-1 * var(--setup-pad-top));z-index:5;margin:calc(-1 * var(--setup-pad-top)) calc(-1 * var(--setup-pad-x)) -14px;padding:var(--setup-pad-top) var(--setup-pad-x) 6px;background:var(--surface);border-radius:calc(var(--radius-card) - 1px) calc(var(--radius-card) - 1px) 0 0}
@supports (animation-timeline:scroll()){.setup-pinned{animation:setup-pinned-edge linear both;animation-timeline:scroll(nearest);animation-range:0 16px}}
@keyframes setup-pinned-edge{from{box-shadow:0 1px 0 transparent}to{box-shadow:0 1px 0 var(--hairline)}}
.setup-kicker{display:flex;align-items:center;gap:6px;min-height:20px}
.setup-kicker .caption{font-size:11px}
.setup-kicker-sep{color:var(--label-4)}
.setup-kicker h2{font-family:inherit;font-size:11px;font-weight:650;letter-spacing:.06em;text-transform:uppercase;color:var(--label-3)}
.setup-kicker .caption,.setup-kicker-sep{display:none}
.stage-counter{margin-left:auto;font-size:13px;font-weight:650;color:var(--label-2);font-variant-numeric:tabular-nums}
.stage-counter:empty{display:none}
#page-title{font-size:28px;line-height:1.15;font-weight:650;letter-spacing:-.7px}
#page-subtitle{font-size:14px;line-height:1.5;color:var(--label-2)}
#page-subtitle:empty{display:none}
#setup-description{font-size:13px;line-height:1.5;color:var(--label-3);display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;cursor:pointer}
#setup-description.expanded{display:block;cursor:default}
#setup-description[hidden]{display:none}
.destination-note-slot{margin:0}
.destination-note-slot:empty{display:none}
.destination-note-slot .destination-note{display:inline-flex;align-items:center;gap:6px;margin:2px 0 0;font-size:12px;font-weight:600;color:var(--label-3)}
.destination-note-slot .destination-note:before{content:'';width:6px;height:6px;border-radius:50%;background:var(--label-4)}
.app-shell[data-destination=live] .destination-note-slot .destination-note{color:var(--live)}
.app-shell[data-destination=live] .destination-note-slot .destination-note:before{background:#d97706}
.app-shell[data-destination=simulator] .destination-note-slot .destination-note{color:var(--sim)}
.app-shell[data-destination=simulator] .destination-note-slot .destination-note:before{background:var(--sim)}

/* Live status line: what is happening right now. */
.connection-progress{display:grid;grid-template-columns:20px minmax(0,1fr);column-gap:11px;row-gap:2px;align-items:center;padding:12px 14px;border-radius:var(--radius-group);background:var(--accent-wash)}
.connection-progress-heading{display:contents}
.connection-progress-marker{grid-row:1;width:18px;height:18px;border-radius:50%;border:2.5px solid #b9d6f7;border-top-color:var(--accent)}
.connection-progress[data-loading=true] .connection-progress-marker{animation:spin 1s linear infinite}
.connection-progress-heading strong{font-size:14px;font-weight:650;color:var(--accent-text)}
#connection-progress-count{display:none}
.connection-progress p{grid-column:2;font-size:13px;color:var(--label-2);overflow-wrap:anywhere}
.connection-progress p:empty{display:none}
.connection-progress-steps{display:none}
.connection-progress[data-tone=ready]{background:var(--green-wash)}
.connection-progress[data-tone=ready] .connection-progress-marker{border:0;background:var(--green-fill) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 12 4 4 8-9'/%3E%3C/svg%3E") center/12px no-repeat}
.connection-progress[data-tone=ready] strong{color:var(--green)}
.connection-progress[data-tone=error]{display:none}
@keyframes spin{to{transform:rotate(360deg)}}

/* Notices sit directly under the status, never below the fold. */
.notice-area{display:block}
.notice{padding:12px 14px;border-radius:var(--radius-group);background:var(--fill);color:var(--label);font-size:13px;line-height:1.5;max-height:180px;overflow:auto;overflow-wrap:anywhere;white-space:pre-line}
.notice.error{background:var(--red-wash);color:#a3000f}
.notice.good{background:var(--green-wash);color:#17663a}
.power-cycle-recovery{display:flex;flex-direction:column;gap:8px;padding:14px;border-radius:var(--radius-group);background:var(--orange-wash)}
.power-cycle-recovery .secondary-button{align-self:stretch;background:var(--accent);color:#fff}
.power-cycle-recovery .secondary-button:hover:not(:disabled){background:#0062c4}
.power-cycle-recovery .secondary-button:disabled{background:var(--fill-2);color:var(--label-3);opacity:1}
.power-cycle-recovery p{font-size:12px;color:var(--orange)}
.power-cycle-recovery[data-pending=true] .secondary-button{opacity:.7}
.robot-packages{display:flex;align-items:center;gap:14px;padding:14px;border-radius:var(--radius-group);background:var(--orange-wash)}
.robot-packages[hidden]{display:none}
.robot-packages-copy{flex:1;min-width:0}
.robot-packages-copy strong{display:block;font-size:13px;color:var(--orange)}
.robot-packages-copy p{margin-top:2px;font-size:12px;color:var(--orange);overflow-wrap:anywhere}
.robot-packages .secondary-button{flex:none;background:var(--accent);color:#fff}
.robot-packages .secondary-button:hover:not(:disabled){background:#0062c4}
.robot-packages .secondary-button:disabled{background:var(--fill-2);color:var(--label-3);opacity:1}
.setup-card[data-recovery=true] .setup-content,.setup-card[data-recovery=true] #connection-progress,.setup-card[data-recovery=true] #primary-action,.setup-card[data-recovery=true] #primary-note{display:none!important}
.setup-content{display:flex;flex-direction:column;gap:14px}

/* Tracking: three inputs on one line. */
.tracking-panel{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.tracking-input{display:grid;grid-template-columns:24px minmax(0,1fr);column-gap:9px;align-items:center;padding:10px 12px;border-radius:var(--radius-control);background:var(--fill)}
.input-marker{grid-row:span 2;width:24px;height:24px;border-radius:50%;display:grid;place-items:center;background:var(--fill-2);color:var(--label-3)}
.input-marker svg{width:14px;height:14px;stroke-width:2}
.tracking-input strong{font-size:12px;font-weight:650;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.input-value{font-size:11px;color:var(--label-3)}
.tracking-input[data-tone=good] .input-marker{background:var(--green-fill);color:#fff}
.tracking-input[data-tone=good] .input-value{color:var(--green)}
.tracking-input[data-tone=warning]{background:var(--orange-wash)}
.tracking-input[data-tone=warning] .input-marker{background:#f59e0b;color:#fff}
.tracking-input[data-tone=warning] .input-value{color:var(--orange)}

/* Quest address: one quiet row; instructions only when they matter. */
.quest-guide{border-radius:var(--radius-group);background:var(--fill);padding:10px 12px 10px 12px;display:flex;flex-direction:column;gap:8px}
.guide-row{display:grid;grid-template-columns:30px minmax(0,1fr) auto;align-items:center;column-gap:11px}
.guide-icon{width:30px;height:30px;border-radius:9px;display:grid;place-items:center;background:var(--surface);color:var(--label-2)}
.guide-icon svg{width:17px;height:17px}
.guide-copy{display:flex;flex-direction:column;min-width:0}
.guide-title{font-size:11px;font-weight:600;color:var(--label-3)}
.quest-address{font-size:13px;color:var(--label);user-select:all;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.copy-link{display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 11px;border:0;border-radius:999px;background:var(--surface);color:var(--accent-text);font-size:12px;font-weight:650}
.copy-link svg{width:14px;height:14px}
.copy-link:hover:not(:disabled){background:var(--accent-wash)}
.copy-link:disabled{opacity:.45}
#quest-instructions{font-size:12px;line-height:1.5;color:var(--label-2);padding-left:41px}
.quest-guide[data-emphasis=false] #quest-instructions{display:none}
.quest-guide[data-headset=pico] #quest-instructions{display:block}
.quest-guide[data-emphasis=true]{background:var(--accent-wash);padding:14px}
.quest-guide[data-emphasis=true] .guide-icon{background:var(--accent);color:#fff}
.quest-guide[data-emphasis=true] .quest-address{font-size:15px;font-weight:600}
.tracking-chips{display:flex;flex-wrap:wrap;gap:6px;padding-left:41px}
.tracking-chips:empty{display:none}
.tracking-chip{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:600;color:var(--label-2);background:var(--surface);border-radius:999px;padding:4px 9px}
.tracking-chip:before{content:'';width:6px;height:6px;border-radius:50%;background:var(--label-4)}
.tracking-chip.live{color:var(--green)}.tracking-chip.live:before{background:var(--green-fill)}
.tracking-chip.stale{color:var(--orange)}.tracking-chip.stale:before{background:#f59e0b}

/* Disclosure groups (steps, options). */
.stage-disclosure{border-radius:var(--radius-group);background:var(--surface);border:1px solid var(--separator)}
.stage-disclosure>summary{list-style:none;display:flex;align-items:center;gap:8px;min-height:44px;padding:0 14px;cursor:pointer;border-radius:var(--radius-group);user-select:none}
.stage-disclosure>summary::-webkit-details-marker{display:none}
.stage-disclosure>summary:hover{background:#fafafb}
.disclosure-chevron{display:grid;place-items:center;color:var(--label-3);transition:transform .18s ease}
.disclosure-chevron svg{width:14px;height:14px;stroke-width:2.4}
details[open]>summary .disclosure-chevron{transform:rotate(90deg)}
.disclosure-title{font-size:13px;font-weight:650}
.disclosure-value{margin-left:auto;font-size:12px;color:var(--label-3);font-variant-numeric:tabular-nums;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.stage-disclosure[data-tone=good] .disclosure-value{color:var(--green)}
.stage-disclosure[data-tone=error] .disclosure-value{color:var(--red)}
.stage-disclosure[data-tone=running] .disclosure-value{color:var(--accent-text)}

/* The six checks, always one per row, with their evidence beneath. */
.stages{list-style:none;margin:0;padding:2px 14px 12px}
.stage{position:relative;display:grid;grid-template-columns:26px minmax(0,1fr);column-gap:12px;padding:7px 0}
.stage:not(:last-child):before{content:'';position:absolute;left:12.5px;top:35px;bottom:-5px;width:1px;background:var(--separator)}
.stage-symbol{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;background:var(--surface);border:1.5px solid var(--separator);font-size:10px;font-weight:700;color:var(--label-3);font-variant-numeric:tabular-nums}
.stage-symbol svg{width:14px;height:14px;stroke-width:2.6}
.stage-copy{display:flex;flex-direction:column;justify-content:center;min-height:26px;min-width:0}
.stage-name{font-size:13px;font-weight:600;color:var(--label-3)}
.stage-detail{font-size:12px;line-height:1.45;color:var(--label-3);overflow-wrap:anywhere}
.stage-detail:empty{display:none}
.stage.done .stage-symbol{background:var(--green-fill);border-color:var(--green-fill);color:#fff}
.stage.done .stage-name{color:var(--label)}
.stage.done .stage-detail{color:var(--label-3)}
.stage.running .stage-symbol{border:2.5px solid #cfe2f8;border-top-color:var(--accent);animation:spin 1s linear infinite;color:transparent}
.stage.running .stage-symbol span{animation:spin 1s linear infinite reverse;color:var(--accent-text)}
.stage.running .stage-name,.stage.waiting .stage-name{color:var(--accent-text);font-weight:650}
.stage.running .stage-detail,.stage.waiting .stage-detail{color:var(--label-2)}
.stage.waiting .stage-symbol{background:var(--accent-wash);border-color:var(--accent-wash);color:var(--accent)}
.stage.error .stage-symbol{background:var(--red);border-color:var(--red);color:#fff;font-size:13px}
.stage.error .stage-name{color:var(--red);font-weight:650}
.stage.error .stage-detail{color:#a3000f}

/* Profile & motion: always first, one grouped list, never collapsed. */
.setup-options{display:flex;flex-direction:column;gap:6px}
.setup-options-heading{display:flex;align-items:baseline;justify-content:space-between;gap:10px;padding:0 2px;font-size:11px;font-weight:650;letter-spacing:.06em;text-transform:uppercase;color:var(--label-3)}
#setup-options-summary{text-transform:none;letter-spacing:0;font-weight:600;color:var(--label-2)}
.setup-options-body{display:flex;flex-direction:column;border-radius:var(--radius-group);background:var(--fill);overflow:hidden}
.setup-options-body>*{position:relative}
.setup-options-body>*:not([hidden])~*:not([hidden]):before{content:'';position:absolute;top:0;left:14px;right:0;height:1px;background:var(--separator);z-index:1}
.setup-options-body .walking-profile-row{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:4px 12px;margin:0;padding:10px 14px;border-radius:0;background:none}
.setup-options-body .walking-profile-row select{justify-self:end;min-width:200px}
.setup-options-body #walking-profile-help{grid-column:1/-1;font-size:12px;color:var(--label-3)}
.hand-options-row{padding:10px 14px}
.headset-row{display:flex;flex-direction:column;gap:8px;padding:10px 14px}
.headset-choice{display:flex;align-items:center;justify-content:space-between;gap:12px}
.headset-choice label{font-size:13px;font-weight:650;color:var(--label)}
.headset-choice select{min-width:200px;height:34px;border:1px solid var(--separator);border-radius:9px;padding:0 28px 0 12px;background:var(--surface);color:var(--label);font-family:inherit;font-size:13px;font-weight:600}
.headset-choice select:disabled{opacity:.55}
.pico-install{display:flex;flex-direction:column;gap:6px}
.pico-install[hidden]{display:none}
.pico-summary{display:flex;align-items:center;justify-content:space-between;gap:4px 12px;flex-wrap:wrap}
.pico-summary .text-button{margin:-6px -10px -6px 0}
.pico-more-panel{display:flex;flex-direction:column;gap:6px}
.pico-more-panel[hidden],.pico-summary [hidden]{display:none}
#pico-status,.pico-status{margin:0;font-size:13px;font-weight:600;color:var(--label)}
#pico-status[data-tone=error],.pico-status[data-tone=error]{color:var(--red)}
#pico-status[data-tone=good]:before,.pico-status[data-tone=good]:before{content:"✓ ";color:var(--green)}
.pico-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.pico-actions .secondary-button{height:32px;padding:0 14px;border-radius:999px;font-size:13px;background:var(--accent);color:#fff}
.pico-actions button:disabled{opacity:.5}
#pico-help,.pico-help{margin:0;font-size:12px;line-height:1.5;color:var(--label-3)}
.tracker-status{margin:0;font-size:13px;font-weight:600;color:var(--label-2)}
.tracker-status[hidden],.tracker-walk[hidden]{display:none}
.tracker-status[data-tone=good]:before{content:"\25CF\00A0";color:var(--green)}
.tracker-status[data-tone=warn]{color:var(--orange)}
.tracker-walk label{display:flex;align-items:center;gap:10px;min-height:30px;font-size:13px;font-weight:600;cursor:pointer}
.tracker-walk input{width:18px;height:18px;accent-color:var(--accent);flex-shrink:0}
.tracker-walk input:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.tracker-walk p{margin:3px 0 0 28px;color:var(--label-3);font-size:12px;line-height:1.5}
.ia-settings .headset-row{border:1px solid #dfe6e6;border-radius:12px;margin-top:12px;background:#ffffffaa;max-width:880px;box-sizing:border-box}
.hand-options-row label{display:flex;align-items:center;gap:10px;min-height:30px;font-size:13px;font-weight:600;cursor:pointer}
.hand-options-row input{width:18px;height:18px;accent-color:var(--accent);flex-shrink:0}
.hand-options-row input:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.hand-options-row p{margin:3px 0 0 28px;color:var(--label-3);font-size:12px;line-height:1.5}
.step-gain-row p{margin:0;color:var(--label-3);font-size:12px;line-height:1.5}

/* ─── Actions (pinned) ──────────────────────────────────────────────────── */
.primary-area{flex:none;display:flex;flex-direction:column;gap:10px;padding:14px 24px 16px;border-top:1px solid var(--separator);background:linear-gradient(rgba(255,255,255,.9),#fff)}
.action-row{display:flex;gap:10px}
.action-row>.primary-button,.action-row>.session-controls{flex:1;min-width:0}
.primary-button{display:flex;align-items:center;justify-content:center;gap:9px;width:100%;min-height:50px;border:0;border-radius:14px;background:var(--accent);color:#fff;font-size:15px;font-weight:650;letter-spacing:-.1px;box-shadow:0 1px 2px rgba(0,113,227,.25);transition:background .15s,transform .08s}
.primary-button svg{width:18px;height:18px;stroke-width:2.2}
.primary-button:hover:not(:disabled){background:#0062c4}
.primary-button:active:not(:disabled){transform:scale(.99)}
.primary-button:disabled{background:var(--fill-2);color:var(--label-3);box-shadow:none}
.primary-button:disabled svg{display:none}
.session-controls{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.secondary-button,.stop-button{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:50px;padding:0 16px;border:0;border-radius:14px;font-size:15px;font-weight:650}
.secondary-button svg,.stop-button svg{width:17px;height:17px;stroke-width:2.2}
.secondary-button{background:var(--fill-2);color:var(--label)}
.secondary-button:hover:not(:disabled){background:#e0e0e5}
.stop-button{background:var(--red);color:#fff;box-shadow:0 1px 2px rgba(215,0,21,.25)}
.stop-button:hover:not(:disabled){background:#b80012}
.secondary-button:disabled{opacity:.45}
.stop-button:disabled{background:var(--fill-2);color:var(--label-3);box-shadow:none}
.primary-meta{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:10px;min-height:28px}
#primary-note{font-size:12px;color:var(--label-3);line-height:1.4}
.restart-button{flex:none;display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:50px;padding:0 18px;border:0;border-radius:14px;background:var(--fill-2);color:var(--label);font-size:15px;font-weight:650;white-space:nowrap}
.restart-button svg{width:17px;height:17px;stroke-width:2.2}
.restart-button:hover:not(:disabled){background:#e0e0e5}
.restart-button:disabled{color:var(--label-4)}
.notice-details,.notice-view-details{justify-self:end;white-space:nowrap;height:32px;padding:0 14px;border:0;border-radius:999px;background:var(--accent-wash);color:var(--accent-text);font-size:13px;font-weight:650}
.notice-details:hover,.notice-details[aria-expanded=true],.notice-view-details:hover{background:#d6e8fd}
.notice-area{display:flex;flex-direction:column;align-items:flex-start;gap:8px}
.notice-area .notice{align-self:stretch}
.notice-area:has(.notice[hidden]) .notice-view-details{display:none}
/* The Quest address appears once setup reaches "Connect Quest" (and stays for the session). */
.app-shell:not([data-status=waiting_headset]):not([data-status=active]):not([data-status=paused]) #quest-guide{display:none}
.app-shell[data-status=starting]:has(#stages .stage:is([data-stage=quest],[data-stage=tracking],[data-stage=active]):is(.running,.waiting,.done)) #quest-guide:not([hidden]){display:flex}

/* ─── Details drawer ────────────────────────────────────────────────────── */
.details-section{max-width:1500px;width:100%;margin:0 auto}
#details-content{position:fixed;z-index:12;top:calc(var(--toolbar) + 12px);bottom:16px;left:20px;width:min(640px,calc(100vw - 40px));display:flex;flex-direction:column;overflow:hidden;background:rgba(255,255,255,.97);backdrop-filter:blur(20px);border:1px solid var(--hairline);border-radius:var(--radius-card);box-shadow:0 18px 60px rgba(17,24,39,.18)}
@media(min-width:1000px){#details-content{width:min(640px,calc(100vw - 560px))}}
#details-content .details-toolbar{flex:none;display:flex;align-items:center;gap:6px;padding:18px 18px 12px}
.details-toolbar>div{display:flex;flex-direction:column;gap:3px;margin-right:auto}
.details-kicker{font-size:11px;font-weight:650;letter-spacing:.06em;color:var(--label-3)}
.details-toolbar h2{font-size:20px;font-weight:650;letter-spacing:-.3px}
.text-button{border:0;background:none;color:var(--accent-text);font-size:13px;font-weight:600;padding:6px 10px;border-radius:8px}
.text-button:hover:not(:disabled){background:var(--accent-wash)}
.text-button:disabled{color:var(--label-4)}
.details-close{width:30px;height:30px;border:0;border-radius:50%;background:var(--fill);color:var(--label-2);font-size:18px;line-height:1}
.details-close:hover{background:var(--fill-2);color:var(--label)}
.diagnostic-tabs{flex:none;display:flex;gap:2px;margin:0 18px;padding:3px;background:var(--fill);border-radius:10px}
.diagnostic-tabs button{flex:1;height:30px;border:0;border-radius:8px;background:none;font-size:12px;font-weight:600;color:var(--label-2)}
.diagnostic-tabs button:hover{color:var(--label)}
.diagnostic-tabs button[aria-selected=true]{background:var(--surface);color:var(--label);box-shadow:0 1px 3px rgba(0,0,0,.1)}
.diagnostic-body{flex:1;min-height:0;overflow:auto;padding:18px}
.diagnostic-panel{outline:none}
.diagnostic-summary{margin-bottom:18px}
.diagnostic-status-badge{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:650;padding:4px 9px;border-radius:999px;color:var(--label-2);background:var(--fill)}
.diagnostic-status-badge:before{content:'';width:6px;height:6px;border-radius:50%;background:currentColor}
.diagnostic-summary[data-tone=attention] .diagnostic-status-badge{background:var(--orange-wash);color:var(--orange)}
.diagnostic-summary[data-tone=good] .diagnostic-status-badge{background:var(--green-wash);color:var(--green)}
#diagnostic-heading{font-size:18px;font-weight:650;margin:10px 0 4px}
.diagnostic-summary p{font-size:13px;line-height:1.55;overflow-wrap:anywhere}
.diagnostic-facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-bottom:16px}
.diagnostic-card{min-width:0;padding:12px;border-radius:12px;background:var(--fill)}
.diagnostic-card>span{display:block;font-size:11px;font-weight:600;color:var(--label-3)}
.diagnostic-card strong{display:flex;align-items:center;gap:6px;font-size:13px;font-weight:650;margin:5px 0 3px}
.diagnostic-card strong:before{content:'';width:7px;height:7px;border-radius:50%;background:var(--label-4)}
.diagnostic-card[data-tone=good] strong{color:var(--green)}.diagnostic-card[data-tone=good] strong:before{background:var(--green-fill)}
.diagnostic-card[data-tone=attention] strong{color:var(--orange)}.diagnostic-card[data-tone=attention] strong:before{background:#f59e0b}
.diagnostic-card p{font-size:11px;color:var(--label-3);line-height:1.4}
.diagnostic-checks,.diagnostic-technical{border-top:1px solid var(--separator);padding:2px 0}
.diagnostic-checks>summary,.diagnostic-technical>summary{display:flex;justify-content:space-between;gap:10px;padding:11px 0;font-size:13px;font-weight:600;cursor:pointer}
.diagnostic-checks>summary>span:last-child{font-weight:500;color:var(--label-3)}
.diagnostic-stages{list-style:none;margin:0 0 10px;padding:0;display:flex;flex-direction:column;gap:2px}
.diagnostic-stages li{display:grid;grid-template-columns:1fr auto;gap:2px 10px;padding:8px 10px;border-radius:8px;background:var(--fill)}
.diagnostic-stages strong{font-size:12px;font-weight:600}
.diagnostic-stages li>span{font-size:11px;font-weight:600;color:var(--label-3)}
.diagnostic-stages p{grid-column:1/-1;font-size:11px;color:var(--label-3);overflow-wrap:anywhere}
.diagnostic-stages [data-status=error]>span{color:var(--red)}
.diagnostic-stages [data-status=done]>span{color:var(--green)}
#diagnostic-meta{display:flex;flex-direction:column;gap:2px;margin-bottom:10px}
#diagnostic-meta>div{display:flex;justify-content:space-between;gap:16px;padding:7px 10px;border-radius:8px;background:var(--fill)}
#diagnostic-meta span{font-size:12px;color:var(--label-2)}
#diagnostic-meta code{font-size:11px;color:var(--label);overflow-wrap:anywhere;text-align:right}
.preview-options{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:14px;padding-top:14px;border-top:1px solid var(--separator);font-size:12px;color:var(--label-2)}
.preview-options select{padding:6px 8px;border-radius:8px;border:1px solid var(--separator);background:var(--surface)}
.diagnostic-panel-intro{margin-bottom:14px}
.diagnostic-panel-intro h3{font-size:16px;font-weight:650}
.diagnostic-panel-intro p{font-size:12px;margin-top:3px}
.activity-list{display:flex;flex-direction:column}
.activity-list>p{font-size:12px;color:var(--label-3)}
.activity-row{position:relative;display:grid;grid-template-columns:70px minmax(0,1fr);gap:12px;padding:8px 0 8px 14px;border-bottom:1px solid var(--separator);font-size:12px}
.activity-row:before{content:'';position:absolute;left:0;top:14px;width:6px;height:6px;border-radius:50%;background:var(--label-4)}
.activity-row:last-child{border-bottom:0}
.activity-row time{color:var(--label-3);font-variant-numeric:tabular-nums}
.activity-row span{color:var(--label);overflow-wrap:anywhere}
.activity-row.error:before{background:var(--red)}
.activity-row.error span{color:#a3000f}
#diagnostic-output{margin:0;min-height:180px;padding:14px;border-radius:12px;background:var(--fill);font:12px/1.7 var(--mono);color:var(--label-2);white-space:pre-wrap;overflow-wrap:anywhere;user-select:text}
.diagnostic-history-card{padding:14px;border-radius:12px;background:var(--fill);margin-bottom:8px}
.diagnostic-history-heading{display:flex;justify-content:space-between;gap:10px;font-size:11px;color:var(--label-3);font-weight:600}
.diagnostic-history-card h4{font-size:14px;font-weight:650;margin:6px 0 4px}
.diagnostic-history-card>p{font-size:12px;overflow-wrap:anywhere}
.diagnostic-history-card details{margin-top:8px}
.diagnostic-history-card summary{font-size:12px;font-weight:600;color:var(--accent-text);cursor:pointer}
.diagnostic-history-card pre{margin:8px 0 0;padding:10px;border-radius:8px;background:var(--surface);font:11px/1.6 var(--mono);white-space:pre-wrap;overflow-wrap:anywhere;color:var(--label-2)}
.diagnostic-empty{padding:28px 10px;text-align:center}
.diagnostic-empty strong{font-size:14px}
.diagnostic-empty p{font-size:12px;margin-top:4px}
.diagnostic-footer{flex:none;display:flex;align-items:center;gap:12px;padding:10px 18px;border-top:1px solid var(--separator);font-size:11px;color:var(--label-3)}
.diagnostic-readonly{font-weight:600}
.diagnostic-footer [role=status]{margin-left:auto;text-align:right}

.app-footer{display:flex;justify-content:space-between;gap:10px;max-width:1500px;width:100%;margin:0 auto;padding:0 4px 12px;font-size:11px;color:var(--label-3)}

/* ─── Dialogs and toast ─────────────────────────────────────────────────── */
dialog{border:0;border-radius:22px;padding:30px;width:min(460px,calc(100vw - 32px));box-shadow:0 30px 90px rgba(17,24,39,.28);color:var(--label);background:var(--surface)}
dialog::backdrop{background:rgba(17,24,39,.32);backdrop-filter:blur(4px)}
dialog .eyebrow{display:block;margin-bottom:10px}
dialog h2{font-size:24px;font-weight:650;letter-spacing:-.5px;line-height:1.2}
dialog p{font-size:14px;line-height:1.6;margin-top:12px}
.dialog-close{position:absolute;top:14px;right:14px;font-size:20px}
.info-item{display:flex;flex-direction:column;gap:3px;padding:12px 0;border-top:1px solid var(--separator);margin-top:12px}
.info-item+.info-item{margin-top:0}
.info-item strong{font-size:13px}
.info-item span{font-size:13px;color:var(--label-2);line-height:1.5}
dialog .primary-button{margin-top:18px}
.toast{position:fixed;z-index:30;bottom:24px;left:50%;transform:translateX(-50%);max-width:calc(100vw - 32px);padding:11px 18px;border-radius:999px;background:rgba(29,29,31,.92);backdrop-filter:blur(12px);color:#fff;font-size:13px;font-weight:500;box-shadow:0 8px 30px rgba(0,0,0,.2);pointer-events:none}

/* ─── Compact windows (min 920 × 740) and zoom ──────────────────────────── */
@media(max-width:1100px){
  .topbar{gap:12px;padding:0 14px}
  .brand-name,.brand-divider{display:none}
  main{padding:14px 14px 0}
  .workspace{gap:12px;grid-template-columns:minmax(300px,.78fr) minmax(440px,1.22fr)}
  .setup-scroll{--setup-pad-top:18px;--setup-pad-x:18px;padding-bottom:14px}
  .primary-area{padding:12px 18px 14px}
  #page-title{font-size:25px}
  .tile-detail{display:none}
}
@media(max-height:820px){
  .card-topline{padding-top:14px}
  .status-card{min-height:46px;padding-top:7px;padding-bottom:7px}
  .robot-footer{padding:8px 18px 10px}
  .setup-scroll{gap:12px}
  .primary-button,.secondary-button,.stop-button,.restart-button{min-height:46px}
}
@media(max-width:860px){
  .workspace{height:auto;grid-template-columns:1fr}
  .robot-card{height:420px}
  .setup-card{max-height:none}
  .setup-scroll{overflow:visible}
  .setup-pinned{position:static;margin:0 0 -8px;padding:0;background:none;animation:none}
  .tracking-panel{grid-template-columns:1fr}
  .setup-options-body .walking-profile-row{grid-template-columns:1fr}
  .setup-options-body .walking-profile-row select{justify-self:stretch;min-width:0;width:100%}
  #details-content{left:12px;right:12px;width:auto}
  .diagnostic-facts{grid-template-columns:1fr}
}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}
/* Real robot with the old 'interactive' profile saved (interactive_controls.js): no session to set up, so Teleoperate hides its setup. */
.app-shell[data-interactive-profile] #primary-action,.app-shell[data-interactive-profile] #restart-action,
.app-shell[data-interactive-profile] #stage-disclosure,.app-shell[data-interactive-profile] #quest-guide,
.app-shell[data-interactive-profile] #tracking-panel,.app-shell[data-interactive-profile] .motion-destination-settings,
.app-shell[data-interactive-profile] #hand-options,.app-shell[data-interactive-profile] #step-gain-options,.app-shell[data-interactive-profile] #tracking-card{display:none!important}
/* API keys: masked text fields, not password fields, so phone password managers leave the page alone (no_autofill.js). */
.no-autofill-secret{-webkit-text-security:disc;text-security:disc}