/* Base styles extracted from the actual ManiLoop local workspace (src/maniloop/ui/index.html). */
:root{--bg:#0d1117;--panel:#151b24;--panel-deep:#10161e;--border:#28313e;--muted:#8490a2;--text:#e8edf4;--subtle:#b1bbc9;--orange:#ff9d54;--orange-hover:#ffb376;--green:#81cba9;--red:#ff9292;--radius:14px;--mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}
    *{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font:14px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;letter-spacing:.005em}button,input,textarea,select{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.42}button,input,textarea,select{outline:none}button:focus-visible,a:focus-visible{outline:2px solid var(--orange);outline-offset:3px}input:focus,textarea:focus,select:focus{border-color:var(--orange)!important;box-shadow:0 0 0 3px #ff9d5410}button{transition:background .16s,border-color .16s,opacity .16s}button:active:not(:disabled){transform:translateY(1px)}[hidden]{display:none!important}.mono{font-family:var(--mono);font-variant-numeric:tabular-nums}.muted{color:var(--muted)}
    .shell{max-width:1640px;margin:auto;padding:28px 36px 20px}.topbar{display:flex;align-items:center;justify-content:space-between;margin-bottom:28px;gap:16px}.brand{display:flex;align-items:center;gap:13px}.brandmark{width:38px;height:38px;border:1px solid #ff9d5450;display:grid;place-items:center;border-radius:10px;background:#ff9d540b;color:var(--orange)}.brandmark svg{width:24px;height:24px}.brandname{font-size:19px;font-weight:650;letter-spacing:.035em}.brandname span{font-weight:400;color:var(--muted);margin-left:9px;font-size:15px;letter-spacing:0}.eyebrow{font:10px/1.5 var(--mono);letter-spacing:.15em;color:var(--muted);margin-top:3px}.topmeta{display:flex;align-items:center;gap:19px;font-size:12px;color:var(--muted)}.connection{display:flex;gap:7px;align-items:center}.dot{width:6px;height:6px;background:var(--muted);border-radius:100%;display:inline-block;flex-shrink:0}.dot.ok{background:var(--green)}.dot.busy{background:var(--orange);box-shadow:0 0 9px #ff9d5440}.dot.error{background:var(--red)}.pill{padding:5px 10px;border:1px solid var(--border);border-radius:6px;font:11px var(--mono);color:var(--subtle)}
    .intro{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:23px}.intro h1{font-size:27px;font-weight:580;letter-spacing:-.035em;margin:0 0 6px}.intro p{margin:0;color:var(--muted);font-size:13px}.flow{display:flex;gap:10px;align-items:center;font-size:11px;color:var(--muted);white-space:nowrap;padding-bottom:5px}.flow strong{color:var(--subtle);font-weight:500}.flow .arrow{color:#435269}
    .workspace{display:grid;grid-template-columns:minmax(0,1.68fr) minmax(350px,1fr);gap:20px;align-items:start}.left-column,.right-column{display:flex;flex-direction:column;gap:17px}.panel{background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden}.panel-header{height:52px;padding:0 19px;display:flex;align-items:center;justify-content:space-between;gap:10px;border-bottom:1px solid var(--border)}.panel-title{font-size:13px;font-weight:550;display:flex;align-items:center;gap:9px}.panel-title svg{width:15px;height:15px;color:var(--muted)}.panel-header .small{font-size:11px;color:var(--muted)}.status-chip{font-size:11px;color:var(--subtle);display:flex;gap:7px;align-items:center}.status-chip .dot{width:5px;height:5px}.viewport{position:relative;background:#090d13;aspect-ratio:1.51;min-height:315px;isolation:isolate}.camera{height:100%;width:100%;object-fit:contain;display:block;background:#090d13}.camera-main{position:absolute;inset:0;z-index:-1}.camera-placeholder{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;color:var(--muted);pointer-events:none}.camera-placeholder svg{width:37px;height:37px;color:#455366}.camera-placeholder span{font-size:12px}.camera-label{position:absolute;top:16px;left:17px;display:flex;align-items:center;gap:7px;font:10px var(--mono);letter-spacing:.07em;color:#d0d9e6;background:#10161ed6;border:1px solid #3e4a5a70;border-radius:5px;padding:5px 8px;backdrop-filter:blur(8px)}.camera-label .dot{background:var(--green);width:5px;height:5px}.viewport-corner{position:absolute;right:17px;top:18px;font:10px var(--mono);color:#b0bbc9;letter-spacing:.04em;background:#10161ec0;padding:4px 7px;border-radius:4px}.wrist-view{position:absolute;width:25%;min-width:135px;max-width:210px;aspect-ratio:4/3;bottom:18px;right:18px;border:1px solid #4e5a6c;border-radius:8px;overflow:hidden;background:#0d131c;box-shadow:0 5px 25px #0006}.wrist-view .camera-label{font-size:9px;top:6px;left:6px;padding:3px 5px;border:none}.wrist-wait{position:absolute;inset:0;display:grid;place-items:center;font-size:11px;color:var(--muted)}.axes-label{position:absolute;left:18px;bottom:19px;font:10px var(--mono);color:#b9c4d3;letter-spacing:.035em;display:flex;gap:10px;background:#10161ed9;padding:6px 9px;border-radius:4px}.axes-label b{font-weight:500}.axes-label .x{color:#ef9b91}.axes-label .y{color:#95cba8}.axes-label .z{color:#9cb9f1}.view-footer{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:11px 18px;color:var(--muted);font-size:11px;background:var(--panel-deep)}.legend{display:flex;gap:17px;align-items:center}.legend span{display:inline-flex;gap:6px;align-items:center}.swatch{display:inline-block;width:7px;height:7px;border-radius:2px;background:#cb5e51}.swatch.goal{background:#7cad80}
    .metrics{display:grid;grid-template-columns:1.5fr 1fr .8fr 1fr;gap:0;padding:19px 0}.metric{padding:0 19px;border-right:1px solid var(--border);min-width:0}.metric:last-child{border:0}.metric-label{font-size:10px;color:var(--muted);margin-bottom:7px;white-space:nowrap}.metric-value{font:18px/1.35 var(--mono);letter-spacing:-.025em;white-space:nowrap}.metric-value.coords{font-size:13px;margin-top:5px;letter-spacing:-.02em}.metric-value small{color:var(--muted);font-size:10px;margin-left:3px}.metric-sub{margin-top:4px;font:10px var(--mono);color:#65748a}
    .task-panel .panel-header{border-bottom:none}.number-tag{width:18px;height:18px;font:10px var(--mono);display:grid;place-items:center;border:1px solid #ff9d5445;background:#ff9d5408;color:var(--orange);border-radius:5px}.task-body{padding:0 20px 20px}.field-label{display:flex;align-items:center;justify-content:space-between;font-size:11px;color:var(--subtle);margin-bottom:8px;gap:10px}.field-label span{font-size:10px;color:var(--muted)}.task-input{width:100%;resize:vertical;min-height:98px;max-height:220px;border:1px solid #364253;border-radius:8px;background:var(--panel-deep);color:var(--text);padding:12px 13px;font-size:13px;line-height:1.75;display:block}.task-input::placeholder,input::placeholder{color:#667386}.hint-row{display:flex;align-items:center;justify-content:space-between;margin:7px 0 17px;font-size:10px;color:var(--muted)}.keyboard{font:9px var(--mono);color:#718097}.configuration{display:grid;grid-template-columns:1fr 83px;gap:12px}.input{width:100%;border:1px solid var(--border);background:var(--panel-deep);color:var(--text);border-radius:7px;height:36px;padding:0 10px;font-size:12px;min-width:0}.input.model-input{font-family:var(--mono);font-size:11px}.key-row{margin-top:14px}.key-status{font-size:10px;color:var(--muted)}.key-status.configured{color:var(--green)}.key-hint{margin:6px 0 0;font-size:10px;color:#718097;line-height:1.6}.task-actions{display:grid;grid-template-columns:1fr 86px;gap:9px;margin-top:19px}.button{border:1px solid var(--border);border-radius:7px;padding:9px 14px;background:#1b2430;color:var(--text);font-size:12px;font-weight:500;display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:36px;white-space:nowrap}.button:hover:not(:disabled){background:#253141;border-color:#475870}.button.primary{background:var(--orange);border-color:var(--orange);color:#24170e}.button.primary:hover:not(:disabled){background:var(--orange-hover);border-color:var(--orange-hover)}.button svg{width:13px;height:13px}.button.stop:hover:not(:disabled){color:var(--red);border-color:#be68685c;background:#49272b45}.button.subtle{background:transparent;font-size:11px;padding:6px 10px;min-height:30px}.session-notice{border:1px solid #ad714138;background:#ff9d5407;border-radius:7px;padding:9px 11px;margin-top:13px;font-size:11px;color:#baa994;line-height:1.65}.session-notice.running{border-color:#5eaf8638;background:#81cba906;color:#a7cbb8}.inline-error{background:#ef797910;color:#f0a5a5;border:1px solid #f0919133;padding:10px 12px;border-radius:7px;font-size:11px;line-height:1.6;margin-top:12px;word-break:break-word}.manual-body{padding:15px 19px 19px}.manual-top{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:15px;font-size:11px;color:var(--muted)}.select-compact{height:28px;border:1px solid var(--border);border-radius:5px;background:var(--panel-deep);color:var(--subtle);font-size:11px;padding:0 7px}.manual-controls{display:grid;grid-template-columns:1fr 1fr 1fr;gap:9px}.axis-control{display:grid;grid-template-columns:1fr 1fr;gap:5px}.jog{font:11px var(--mono);padding:8px 0;background:var(--panel-deep);border:1px solid var(--border);color:var(--subtle);border-radius:6px;min-height:34px}.jog:hover:not(:disabled){border-color:#576a83;background:#1f2a39}.axis-name{text-align:center;font:10px var(--mono);color:var(--muted);grid-column:span 2;margin-bottom:1px}.axis-name.x{color:#d98b87}.axis-name.y{color:#86b394}.axis-name.z{color:#94abe0}.gripper-actions{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:13px}.gripper-actions .button{font-size:11px;background:var(--panel-deep)}.reset-row{margin-top:15px;padding-top:13px;border-top:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;gap:10px}.seed-input{max-width:73px;height:29px;font:11px var(--mono)}.seed-wrap{display:flex;gap:8px;align-items:center;font-size:10px;color:var(--muted)}
    .diagnostics{display:grid;grid-template-columns:1fr 1fr;gap:17px;margin-top:19px}.log-panel{grid-column:1/-1}.tabs{display:flex;gap:22px;align-items:stretch;height:100%}.tab{position:relative;border:0;background:none;padding:0;color:var(--muted);font-size:12px}.tab[aria-selected=true]{color:var(--text)}.tab[aria-selected=true]:after{content:"";position:absolute;height:2px;background:var(--orange);left:0;right:0;bottom:-1px}.inspect-body{padding:15px 18px;min-height:112px;max-height:245px;overflow:auto}.inspect-body pre{white-space:pre-wrap;overflow-wrap:anywhere;margin:0;color:#aebcd0;font:11px/1.8 var(--mono)}.empty-inspect{font-size:11px;color:var(--muted);margin:4px 0}.result-summary{display:flex;align-items:start;gap:10px;font-size:12px;color:var(--subtle);line-height:1.75}.result-icon{width:23px;height:23px;border:1px solid var(--border);border-radius:50%;display:grid;place-items:center;flex-shrink:0;color:var(--muted);font:12px var(--mono)}.log-container{max-height:206px;min-height:96px;overflow:auto;padding:8px 18px 12px}.log-row{display:grid;grid-template-columns:73px 72px 1fr;gap:12px;padding:8px 0;border-bottom:1px solid #28313e85;font-size:11px;align-items:start}.log-row:last-child{border:0}.log-time{font:10px/1.65 var(--mono);color:#718099;padding-top:1px}.log-type{font:9px/1.5 var(--mono);display:inline-block;text-transform:uppercase;color:#a6b5c9;background:#829bc110;border:1px solid #91a8c51c;padding:1px 5px;border-radius:4px;width:max-content;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.log-type.error{color:var(--red);background:#ff92920a;border-color:#ff92921a}.log-type.action{color:var(--orange);background:#ff9d540a;border-color:#ff9d541a}.log-type.success{color:var(--green);background:#81cba90a;border-color:#81cba91a}.log-message{color:#b6c1d0;word-break:break-word;line-height:1.7}.log-empty{padding:25px 0;font-size:11px;color:var(--muted)}.footer{display:flex;justify-content:space-between;gap:16px;margin-top:19px;font-size:10px;color:#657185;line-height:1.65}.footer .mono{font-size:9px;white-space:nowrap}.toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);background:#24332f;border:1px solid #59896d;color:#c9e5d5;padding:11px 18px;border-radius:8px;box-shadow:0 10px 40px #0005;font-size:12px;z-index:10;max-width:calc(100vw - 40px)}::-webkit-scrollbar{width:5px;height:5px}::-webkit-scrollbar-thumb{background:#344155;border-radius:5px}
    .credentials-section{border-top:1px solid var(--border);padding-top:14px;margin-bottom:16px}.config-path-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;margin-top:8px}.config-path-row .button{padding:7px 10px;font-size:11px}.config-preview{margin:9px 0 0;padding:10px 11px;border:1px solid var(--border);border-radius:7px;background:var(--panel-deep);font-size:10px;color:var(--subtle);overflow-wrap:anywhere}.config-preview dl{display:grid;grid-template-columns:55px minmax(0,1fr);gap:4px 9px;margin:0}.config-preview dt{color:var(--muted)}.config-preview dd{margin:0;font-family:var(--mono);font-size:10px}.config-preview .config-error{color:var(--red);margin:0}.config-preview .config-empty{color:var(--muted);margin:0}.model-tools{display:flex;justify-content:space-between;align-items:start;gap:10px;margin-top:8px}.model-tools .key-hint{margin:0;flex:1}.model-tools .button{font-size:10px;min-height:28px;flex-shrink:0}.custom-model{margin-top:8px}.config-source-label{margin-top:10px}.input:disabled{opacity:.6}.key-row{margin-top:10px}
    @media(min-width:1400px){.shell{padding-top:32px}.viewport{aspect-ratio:1.55}.intro{margin-bottom:27px}.metrics{padding-top:23px;padding-bottom:23px}.manual-body{padding-bottom:20px}}
    @media(max-width:1120px){.shell{padding:23px}.workspace{grid-template-columns:minmax(0,1.5fr) minmax(315px,1fr);gap:15px}.flow{display:none}.metric{padding:0 12px}.metric-value.coords{font-size:11px}.metrics{grid-template-columns:1.45fr 1fr .7fr .85fr}.metric-value{font-size:16px}.viewport{min-height:320px}.task-body{padding:0 16px 16px}.manual-body{padding-left:16px;padding-right:16px}.viewport-corner{display:none}}
    @media(max-width:850px){.workspace{grid-template-columns:1fr}.left-column{gap:14px}.right-column{display:grid;grid-template-columns:1.15fr 1fr;align-items:start;gap:14px}.viewport{aspect-ratio:1.55;min-height:0}.metric-value.coords{font-size:13px}.topmeta .pill{display:none}.diagnostics{margin-top:15px;gap:14px}.task-panel .panel-header,.manual-panel .panel-header{padding-left:16px}.manual-controls{gap:6px}.gripper-actions{gap:6px}.gripper-actions .button{padding:8px}.task-actions{grid-template-columns:1fr 75px}}
    @media(max-width:620px){.shell{padding:19px 14px}.topbar{margin-bottom:24px}.brandname{font-size:17px}.brandname span{font-size:13px;margin-left:6px}.brandmark{width:33px;height:33px}.eyebrow{font-size:8px}.topmeta{font-size:10px}.intro h1{font-size:23px}.intro p{font-size:11px;line-height:1.7}.right-column{display:flex}.metrics{padding:16px 0;grid-template-columns:1.5fr 1fr .65fr .8fr}.metric{padding:0 9px}.metric-value.coords{font-size:10px}.metric-value{font-size:15px}.metric-label{font-size:9px}.metric-sub{font-size:8px}.metric-value small{font-size:8px}.panel-header{padding:0 14px;height:47px}.view-footer{font-size:9px;padding:10px 13px}.legend{gap:10px}.wrist-view{bottom:12px;right:12px;min-width:105px}.axes-label{left:11px;bottom:12px;font-size:8px;gap:6px;padding:4px 6px}.camera-label{top:11px;left:11px;font-size:8px}.diagnostics{grid-template-columns:1fr}.log-panel{grid-column:auto}.log-row{grid-template-columns:58px 61px 1fr;gap:7px;font-size:10px}.log-time{font-size:9px}.log-type{font-size:8px}.log-container{padding-left:13px;padding-right:13px}.footer{flex-direction:column;gap:3px}.footer .mono{font-size:8px}.configuration{grid-template-columns:1fr 90px}}
    @media(prefers-reduced-motion:reduce){*{transition:none!important}}
    @media(min-width:1060px) and (min-height:700px){.left-column{position:sticky;top:18px}}
/* Recorded workspace additions. Base panel, camera, controls, metrics and log
   styles above are reused directly from the live application's workbench. */
a{color:inherit;text-decoration:none}.brand .eyebrow{display:block}.brandname{display:block}.project-link{color:var(--subtle);white-space:nowrap}.language-switch{display:flex;gap:2px;padding:3px;border:1px solid var(--border);border-radius:8px}.language-switch .button{border:0}.language-switch [aria-pressed=true]{background:#ff9d5417;color:var(--orange)}.recorded-label{display:flex;align-items:center;gap:8px;color:var(--orange);font:10px var(--mono);letter-spacing:.09em;margin-bottom:12px}.intro h1{font-size:30px}.recorded-notice{margin:0 0 20px;max-width:100%;color:var(--subtle)}.recorded-notice strong{color:var(--orange)}.workspace .left-column{position:static}.right-column{gap:17px}.camera-panel .viewport{aspect-ratio:1.44}.camera-main{z-index:0}.camera-label,.axes-label,.viewport-corner,.wrist-view{z-index:1}.camera-panel .wrist-view{width:31%;max-width:230px;aspect-ratio:1}.camera-panel .view-footer{min-height:45px}.camera-panel .view-footer .button{font-size:10px}.phase-controls{display:flex;align-items:center;gap:6px;padding:10px 15px;border-top:1px solid var(--border)}.phase-controls [aria-pressed=true]{background:#ff9d5415;border-color:#ff9d5440;color:var(--orange)}.phase-controls .mono{margin-left:auto;font-size:11px;color:var(--subtle)}.viewport.side-by-side{aspect-ratio:2;min-height:0;display:grid;grid-template-columns:1fr 1fr}.viewport.side-by-side .camera-main{position:static;min-width:0}.viewport.side-by-side .wrist-view{position:relative;inset:auto;width:100%;max-width:none;min-width:0;aspect-ratio:1;box-shadow:none;border:0;border-left:1px solid var(--border);border-radius:0}.viewport.side-by-side .wrist-view .camera-label{top:16px;left:17px}.viewport.side-by-side .viewport-corner,.viewport.side-by-side .axes-label{display:none}.decision-body{padding:16px 19px 19px}.decision-body>p:first-child{margin:0 0 9px;line-height:1.8;color:var(--text);font-size:13px}.decision-body details{margin-top:12px}.decision-body details p{font-size:12px;line-height:1.7;color:var(--subtle)}details summary{cursor:pointer;color:var(--muted);font-size:11px}details pre{margin-top:9px}.value-grid{display:grid;grid-template-columns:1fr 1.3fr;gap:7px 12px;margin:14px 0 0;font-size:11px}.value-grid dt{color:var(--muted)}.value-grid dd{margin:0;color:var(--subtle);font-family:var(--mono);overflow-wrap:anywhere}.task-description{font-size:13px;line-height:1.75;margin:0 0 18px;border:1px solid #364253;border-radius:8px;background:var(--panel-deep);padding:12px 13px}.playback-main{display:grid;grid-template-columns:1fr 80px;gap:8px}.playback-secondary{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:8px}.playback-secondary .button{font-size:11px;padding:9px 7px}.timeline-control{margin:19px 0 14px}.timeline-control .field-label{color:var(--subtle)}.timeline-control output{color:var(--orange);font:11px var(--mono)}input[type=range]{display:block;width:100%;accent-color:var(--orange);cursor:pointer;height:5px;margin:15px 0}.playback-options{grid-template-columns:1fr 110px}.configuration-body,.result-body{padding:15px 19px 18px}.config-grid{display:grid;grid-template-columns:1fr 1.5fr;gap:9px 14px;margin:0;font-size:11px}.config-grid dt{color:var(--muted)}.config-grid dd{margin:0;font-family:var(--mono);font-size:10px;text-align:right;color:var(--subtle);overflow-wrap:anywhere}.config-grid+.key-hint{margin-top:14px}.success-tag{color:var(--green);font:10px var(--mono);border:1px solid #81cba932;background:#81cba908;border-radius:5px;padding:4px 7px}.result-body>p:first-child{margin:0;color:var(--subtle);line-height:1.75;font-size:12px}.boundary-note{border-top:1px solid var(--border);padding-top:10px;font-size:10px;color:var(--green);line-height:1.7}.text-link{font-size:11px;color:var(--orange)}.text-link:hover,.project-link:hover{color:var(--orange-hover)}.feedback-body{max-height:320px;min-height:180px}.feedback-body>p{font-size:12px;color:var(--subtle);line-height:1.75;margin:0}.feedback-body details{margin-top:15px}.feedback-body .value-grid{margin-bottom:15px}.decision-rail{display:grid;grid-template-columns:repeat(23,minmax(0,1fr));gap:5px;padding:15px 18px;border-bottom:1px solid var(--border)}.decision-mark{height:30px;border:1px solid var(--border);border-radius:5px;color:var(--muted);background:var(--panel-deep);font:10px var(--mono);padding:0;min-width:0}.decision-mark.gripper{border-bottom:2px solid #81cba962}.decision-mark[aria-current=true]{color:#24170e;background:var(--orange);border-color:var(--orange)}.decision-mark:hover{color:var(--text);border-color:var(--orange)}.log-container{min-height:110px;max-height:230px}.log-row{grid-template-columns:62px 85px 1fr}.log-time{color:var(--orange)}.log-type.terminal{color:var(--green)}.log-message small{display:block;color:var(--muted);font-size:10px}.complete-video,.local-panel{margin-top:19px}.video-body{padding:18px;max-width:1120px;margin:auto}.video-body video{display:block;width:100%;max-height:590px;background:#090d13;border-radius:7px}.video-body .key-hint{margin-top:12px}.local-body{padding:16px 19px 20px}.local-body p{color:var(--subtle);font-size:12px;line-height:1.75;margin:0 0 13px}.local-body pre{padding:14px;border:1px solid var(--border);border-radius:7px;background:var(--panel-deep);white-space:pre-wrap;overflow-wrap:anywhere;color:var(--subtle);font:11px/1.75 var(--mono);margin:0}.local-links{display:flex;flex-wrap:wrap;gap:9px;align-items:center;margin-top:14px}.footer{padding-bottom:12px}.button{touch-action:manipulation}button[disabled]{pointer-events:none}
@media(min-width:1400px){.shell{max-width:1460px}.workspace{grid-template-columns:minmax(0,1.65fr) minmax(350px,1fr)}}
@media(max-width:1120px){.intro h1{font-size:27px}.config-grid{grid-template-columns:1fr 1.6fr}.decision-rail{grid-template-columns:repeat(16,minmax(0,1fr))}.camera-panel .viewport{min-height:0}.camera-panel .viewport.side-by-side{aspect-ratio:2}}
@media(max-width:850px){.right-column{display:flex}.metrics{grid-template-columns:1.6fr 1fr .85fr 1fr}.camera-panel .viewport{aspect-ratio:1.5}.camera-panel .viewport.side-by-side{aspect-ratio:2}.workspace{gap:16px}.decision-rail{grid-template-columns:repeat(12,minmax(0,1fr))}.topbar{align-items:start}.brandname span{font-size:13px}.topmeta{gap:12px}.project-link{display:none}}
@media(max-width:620px){.topbar{gap:8px;margin-bottom:22px}.brand{gap:9px}.brandname span{display:none}.language-switch{padding:2px}.language-switch .button{padding:5px 8px;font-size:10px;min-height:26px}.recorded-label{font-size:8px;line-height:1.7}.intro{align-items:start;flex-direction:column;gap:12px}.intro h1{font-size:25px}.intro p{max-width:320px}.recorded-notice{font-size:10px;margin-bottom:16px}.camera-panel .view-footer{gap:5px;align-items:center}.camera-panel .view-footer .button{font-size:9px;padding:5px 6px;white-space:normal}.phase-controls{padding:9px 11px}.phase-controls .button{font-size:10px}.phase-controls .mono{font-size:10px}.viewport.side-by-side .camera-label,.viewport.side-by-side .wrist-view .camera-label{top:7px;left:7px;font-size:7px;padding:4px}.metrics{grid-template-columns:1.6fr 1fr .85fr 1fr}.metric-value.coords{font-size:9px}.metric-value{font-size:13px}.metric-label{font-size:8px}.metric-sub{font-size:7px;white-space:normal}.decision-rail{grid-template-columns:repeat(10,minmax(0,1fr));padding:13px;gap:5px}.decision-body,.configuration-body,.result-body{padding:14px}.decision-body>p:first-child{font-size:12px}.value-grid{font-size:10px}.log-row{grid-template-columns:42px 73px 1fr}.log-message{font-size:10px}.video-body{padding:12px}.complete-video .panel-header{align-items:center;height:auto;min-height:48px;padding-top:10px;padding-bottom:10px}.complete-video .small{font-size:8px;white-space:nowrap}.local-body{padding:14px}.local-links .button{font-size:10px}.footer{line-height:1.8}}