:root{font-family:Inter,Segoe UI,Arial,sans-serif;color:#e9edf3;background:#0d1015;font-synthesis:none}
*{box-sizing:border-box}
body{margin:0;min-height:100vh;background:radial-gradient(circle at 30% 10%,#28313d 0,#12171e 32%,#090b0f 78%)}
main{height:100vh;display:flex;flex-direction:column;padding:16px;gap:13px}
header{display:flex;align-items:flex-end;justify-content:space-between;padding:0 3px}
h1{font-size:20px;margin:4px 0 0;font-weight:500;letter-spacing:-.02em}
h1 b{font-weight:700;color:#d99b3c}
.eyebrow{font-size:9px;letter-spacing:.16em;color:#9098a4}
.status{display:flex;gap:8px;align-items:center;font-size:13px;color:#aab1bb}
.status i{width:8px;height:8px;border-radius:50%;background:#d99b3c;box-shadow:0 0 14px #d99b3c}
.status.ready i{background:#58c67b;box-shadow:0 0 14px #58c67b}
.workspace{flex:1;min-height:0;display:grid;grid-template-columns:minmax(0,1fr) 290px;border:1px solid #2b323c;border-radius:18px;overflow:hidden;background:#11161dcc;box-shadow:0 30px 70px #0008}
#canvas{min-height:420px;position:relative;background:linear-gradient(145deg,#1a212a,#0e1218)}
#hardware-tooltip{display:none;position:fixed;z-index:20;max-width:260px;padding:7px 9px;border:1px solid #596675;border-radius:7px;background:#0b0f14ee;color:#f0f4f8;font-size:12px;line-height:1.35;pointer-events:none;box-shadow:0 6px 18px #0008}
#hardware-tooltip.show{display:block}
canvas{display:block;width:100%;height:100%}
aside{padding:19px;background:#141920;border-left:1px solid #2b323c;display:flex;flex-direction:column}
#part-name{font-size:19px;line-height:1.2;margin:0 0 13px}
.code{font-size:11px;letter-spacing:.14em;color:#8f98a4;border-bottom:1px solid #303741;padding-bottom:14px}
.code strong{display:block;font:600 45px/1 ui-monospace,SFMono-Regular,Consolas,monospace;color:#efaa42;letter-spacing:-.08em;margin-top:6px}
label{font-size:12px;color:#9da5af;margin:18px 0 6px}
select,button{width:100%;border-radius:9px;border:1px solid #39414c;background:#1c222b;color:#eef1f5;padding:11px 12px;font-size:14px}
dl{margin:19px 0}
dl div{padding:10px 0;border-top:1px solid #282f38}
dt{font-size:11px;text-transform:uppercase;letter-spacing:.1em;color:#78818d}
dd{margin:5px 0 0;font-size:14px;line-height:1.4}
.hint{margin:auto 0 14px;color:#7f8995;font-size:12px;line-height:1.55}
button{background:#d99532;border-color:#d99532;color:#17120b;font-weight:650;cursor:pointer}
button:hover{background:#efaa42}
button.secondary{background:#283442;border-color:#52657a;color:#e4ebf3}
button.secondary:hover{background:#344559;border-color:#6f87a1}
.display-controls{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:13px}
.display-controls button{margin:0;min-width:0}
#view-mode{background:#29445d;border-color:#426784;color:#edf5fb}
#view-mode:hover{background:#365773;border-color:#5b82a1}
#dimensions-mode{background:#4a4228;border-color:#756638;color:#f5edcb}
#dimensions-mode:hover{background:#41365d;border-color:#806cad}
#dimensions-mode.active{background:#4c3f6d;border-color:#806cad;box-shadow:inset 0 0 0 1px #a18dce}
#visibility-mode{margin-top:10px;background:#51413f;border-color:#755b56;color:#f5ecea}
#visibility-mode:hover{background:#654e4a;border-color:#916e67}
#restore-all{margin-top:10px;background:#30463d;border-color:#597565;color:#e2eee7}
#restore-all:hover{background:#3b594c;border-color:#71947f}
@media(max-width:760px){
  body{min-height:100dvh;overflow-y:auto}
  main{height:auto;min-height:100dvh;padding:0;gap:0}
  .workspace{flex:none;display:flex;flex-direction:column;min-height:0;border-radius:0;border:0;overflow:visible}
  header{padding:11px 13px}
  .status span{display:none}
  #canvas{flex:0 0 58dvh;height:58vh;height:58dvh;min-height:340px}
  aside{flex:none;border-left:0;border-top:1px solid #2b323c;padding:14px 14px calc(22px + env(safe-area-inset-bottom))}
  #part-name{font-size:17px;margin-bottom:10px}
  .code{padding-bottom:11px}
  .code strong{display:inline;font-size:22px;margin-left:6px}
  label{margin-top:14px}
  dl{display:grid;grid-template-columns:1fr 1fr;margin:11px 0}
  .hint{display:none}
  button{min-height:48px}
  .display-controls{gap:8px;margin-top:10px}
  .display-controls button{padding-left:7px;padding-right:7px;font-size:12px}
}