/* robot studio — shop-tool house style (omax-path / coyote lineage) */
:root{
  --page:#d0d0cc; --panel:#e8e8e4; --paper:#f0f0ec; --hover:#e2e2dc;
  --ink:#1a1a18; --ink2:#454440; --ink3:#6e6d68; --line:#c8c8c2;
  --accent:#C96B3A; --accent2:#a85830;
  --ok:#2f8f6c; --warn:#c98a2e; --fail:#b8433a;
  --deck:#9a9993; --part:#b08a5a; --field:#f0f0ec; --edge:#9a9992;
  --font:'SF Mono','Cascadia Mono',Consolas,'Liberation Mono',Menlo,monospace;
  --rail:296px;
}
/* dark — the shared think-dark surfaces, same accent */
html[data-theme="dark"]{
  --page:#141311; --panel:#201f1d; --paper:#1b1a18; --hover:#2a2926;
  --ink:#e2e0d8; --ink2:#b4b1a6; --ink3:#8d8b81; --line:#343330;
  --accent:#C96B3A; --accent2:#da7c4a;
  --ok:#3fa06a; --warn:#d9a13b; --fail:#cf5b40;
  --deck:#5d5c57; --part:#8a6c44; --field:#171614; --edge:#454440;
}
html[data-theme="dark"] img,html[data-theme="dark"] canvas{color-scheme:dark}
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{background:var(--page);color:var(--ink);font:13px/1.5 var(--font);overflow:hidden;-webkit-font-smoothing:antialiased}
#app{display:grid;grid-template-rows:38px 28px 1fr;grid-template-columns:var(--rail) minmax(0,1fr);height:100dvh;width:100vw}

header{grid-column:1/-1;background:var(--panel);border-bottom:1px solid var(--line);display:flex;align-items:center;gap:12px;padding:0 12px}
header .logo{font-weight:600}
header .logo b{color:var(--accent)}
header .sub{color:var(--ink3);font-size:11px}
header .flag{font-size:10px;color:#fff;background:var(--fail);padding:1px 6px;border-radius:2px;letter-spacing:.02em}
header .read{margin-left:auto;font-size:11.5px;color:var(--ink2);font-variant-numeric:tabular-nums;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
header .read b{color:var(--ink)}
button,.btn{font:inherit;font-size:11px;padding:2px 9px;border:1px solid var(--edge);background:var(--panel);color:var(--ink);border-radius:3px;cursor:pointer;min-height:22px}
button:hover,.btn:hover{background:var(--hover);border-color:var(--accent)}
button.ghost{border-color:transparent;background:transparent;color:var(--ink3)}
button.ghost:hover{color:var(--ink);background:transparent}
button.go{background:var(--accent);border-color:var(--accent2);color:#fff;font-weight:600}
button.go:hover{background:var(--accent2)}
button.wide,.btn.wide{display:block;width:100%;margin-top:6px;text-align:center}

.cmd{grid-column:1/-1;background:var(--paper);border-bottom:1px solid var(--line);display:flex;align-items:center;gap:10px;padding:0 12px;font-size:11.5px;min-width:0}
.cmd .prompt{color:var(--accent);font-weight:600}
.cmd .hint{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--ink2)}
.cmd .views{display:flex;gap:4px}
.cmd .views button.on{background:var(--hover);border-color:var(--accent);color:var(--accent)}

#rail{background:var(--panel);border-right:1px solid var(--line);overflow-y:auto}
.pan{border-bottom:1px solid var(--line)}
.pan h3{font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.06em;padding:7px 12px;cursor:pointer;display:flex;align-items:center;gap:6px;color:var(--ink2)}
.pan h3::before{content:'▸';color:var(--ink3);font-size:9px}
.pan[data-open] h3::before{content:'▾'}
.pan .body{display:none;padding:0 12px 12px}
.pan[data-open] .body{display:block}
.lbl{font-size:10px;text-transform:uppercase;letter-spacing:.05em;color:var(--ink3);margin:10px 0 4px;display:flex;gap:6px;align-items:center}
.row{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:3px 0}
.row span{color:var(--ink2);font-size:11px}
input[type=number],input[type=text],select{font:inherit;font-size:11px;padding:2px 5px;border:1px solid var(--line);background:var(--field);color:var(--ink);border-radius:2px;width:96px;text-align:right}
input[type=text]{text-align:left}
select{width:130px;text-align:left}
input:focus,select:focus{outline:1px solid var(--accent);border-color:var(--accent)}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:3px 8px}
.grid2 label{display:flex;align-items:center;justify-content:space-between;gap:4px;font-size:11px;color:var(--ink2)}
.grid2 input{width:64px}
.limits{display:grid;grid-template-columns:auto 1fr 1fr;gap:2px 6px;font-size:11px;align-items:center}
.limits b{color:var(--ink2);font-weight:500}
.limits input{width:100%}
.faces{display:flex;gap:10px;font-size:11px;color:var(--ink2);margin:4px 0}
.inline{font-size:10px;color:var(--ink3);text-transform:none;letter-spacing:0}
.note{font-size:10.5px;color:var(--ink3);line-height:1.45;margin-top:8px}
.prov{font-size:9px;padding:0 5px;border-radius:2px;color:#fff;text-transform:uppercase;letter-spacing:.04em}
.prov.ok{background:var(--ok)} .prov.warn{background:var(--warn)} .prov.fail{background:var(--fail)}

.specs{display:grid;grid-template-columns:1fr auto;gap:1px 8px;font-size:11px;color:var(--ink2);margin-bottom:4px}
.specs b{color:var(--ink);font-weight:600;font-variant-numeric:tabular-nums}

.result{background:var(--paper);border:1px solid var(--line);border-radius:3px;padding:8px;margin-top:8px;font-size:11px;line-height:1.55}
.result.muted{color:var(--ink3)}
.result.small{font-size:10.5px}
.result b{font-variant-numeric:tabular-nums}
.big{font-size:21px;font-weight:600;line-height:1.1;font-variant-numeric:tabular-nums}
.verdict{display:flex;align-items:baseline;gap:8px;margin-bottom:6px}
.pill{font-size:10px;padding:1px 6px;border-radius:2px;color:#fff}
.pill.ok{background:var(--ok)} .pill.warn{background:var(--warn)} .pill.fail{background:var(--fail)}
.kv{display:grid;grid-template-columns:auto 1fr;gap:1px 8px}
.kv span{color:var(--ink3)}

#sliders .sl{margin:5px 0}
#sliders .top{display:flex;justify-content:space-between;font-size:10.5px;color:var(--ink2)}
#sliders input[type=range]{width:100%;accent-color:var(--accent);height:14px}
#sliders .bar{height:3px;background:var(--line);border-radius:2px;overflow:hidden}
#sliders .bar i{display:block;height:100%;background:var(--ok)}

main{display:grid;grid-template-rows:1.35fr 1fr;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);min-width:0;min-height:0}
.pane{position:relative;background:var(--paper);min-width:0;min-height:0;overflow:hidden}
.pane.v3d{grid-column:1/-1}
.pane canvas{width:100%;height:100%;display:block}
.tag{position:absolute;top:6px;left:8px;font-size:10px;color:var(--ink3);background:var(--paper);padding:1px 5px;border-radius:2px;pointer-events:none;opacity:.92}
.tag.right{left:auto;right:8px;pointer-events:auto;color:var(--ink2)}

.modal[hidden]{display:none}
.modal{position:fixed;inset:0;background:rgba(26,26,24,.55);display:flex;align-items:center;justify-content:center;z-index:20;padding:24px}
.modal .sheet{background:var(--paper);border:1px solid var(--line);border-radius:4px;max-width:640px;max-height:84vh;overflow:auto;padding:22px 26px;line-height:1.6;font-size:12px}
.modal h2{font-size:14px;margin-bottom:10px}
.modal h3{font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--ink3);margin:14px 0 4px}
.modal p{margin:6px 0;color:var(--ink2)}
.modal ul{margin:4px 0 4px 16px;color:var(--ink2)}
.modal li{margin:3px 0}
.modal code{background:var(--panel);padding:0 3px;border-radius:2px}
.modal button{margin-top:14px}

/* model panel */
.models{display:grid;grid-template-columns:auto 1fr auto;gap:3px 8px;align-items:center;font-size:11px}
.models b{color:var(--ink2);font-weight:500}
.models .st{color:var(--ink3);font-size:10px;text-align:right}
.models .st.on{color:var(--ok)}
.models .btn{padding:1px 6px;min-height:19px;font-size:10px}
