/* ── MOSS 3D Viewer ──────────────────────────────────────────── */
*{margin:0;padding:0;box-sizing:border-box;}
html,body{height:100%;overflow:hidden;
  --bg:#090909;--bg2:#121212;--bg3:#1a1a1a;
  --bdr:rgba(255,255,255,.07);--bdr2:rgba(255,255,255,.14);--bdr3:rgba(255,255,255,.22);
  --txt:rgba(255,255,255,.92);--txt2:rgba(255,255,255,.58);--txt3:rgba(255,255,255,.30);
  --acc:#e8341f;--acc2:rgba(232,52,31,.13);--acc3:rgba(232,52,31,.30);
  --sf:rgba(255,255,255,.04);--sf2:rgba(255,255,255,.08);--sf3:rgba(255,255,255,.12);
  --grn:#3ddc84;--ylw:#f5b731;--blu:#7ab8f5;
  --font:'Inter','Noto Sans Thai',sans-serif;--rad:5px;
  background:var(--bg);color:var(--txt);font-family:var(--font);font-size:12px;
  user-select:none;}

/* ── HEADER ─────────────────────────────────────────────────── */
.v3d-hdr{height:40px;background:var(--bg2);border-bottom:1px solid var(--bdr);
  display:flex;align-items:center;gap:3px;padding:0 10px;flex-shrink:0;
  box-shadow:0 1px 0 rgba(0,0,0,.5);}
.v3d-title{display:flex;align-items:center;gap:6px;font-size:12px;font-weight:700;
  color:var(--blu);margin-right:4px;flex-shrink:0;}
.v3d-title .ti{font-size:16px;}
.v3d-hdr .btn{background:var(--sf);border:1px solid var(--bdr);color:var(--txt2);
  padding:0 9px;height:26px;cursor:pointer;border-radius:var(--rad);font-size:11px;
  font-family:var(--font);font-weight:500;transition:all .12s;white-space:nowrap;
  display:inline-flex;align-items:center;gap:4px;}
.v3d-hdr .btn .ti{font-size:13px;}
.v3d-hdr .btn:hover{background:var(--sf2);color:var(--txt);border-color:var(--bdr2);}
.v3d-hdr .btn.on{background:var(--acc2);border-color:var(--acc3);color:var(--acc);}
.v3d-hdr .btn.blu{color:var(--blu);border-color:rgba(122,184,245,.25);}
.v3d-hdr .btn.blu.on{background:rgba(122,184,245,.12);border-color:rgba(122,184,245,.4);}
.v3d-hdr .sep{width:1px;height:18px;background:var(--bdr2);margin:0 3px;flex-shrink:0;}
.v3d-hdr label{font-size:10.5px;color:var(--txt3);flex-shrink:0;}
.v3d-hdr input[type=number]{background:var(--sf);border:1px solid var(--bdr);color:var(--txt);
  padding:0 5px;height:24px;border-radius:var(--rad);font-size:11px;width:54px;
  font-family:var(--font);}
#v3d-info{margin-left:auto;font-size:10.5px;color:var(--txt3);font-variant-numeric:tabular-nums;}

/* ── BODY ───────────────────────────────────────────────────── */
.v3d-body{display:flex;height:calc(100vh - 40px);overflow:hidden;}

/* ── 3D CANVAS ──────────────────────────────────────────────── */
.v3d-cw{flex:1;position:relative;overflow:hidden;background:#0a0c10;}
.v3d-cw canvas{display:block;width:100%;height:100%;}

/* Overlay labels */
.v3d-badge{position:absolute;top:10px;left:12px;display:flex;gap:6px;pointer-events:none;}
.v3d-chip{background:rgba(0,0,0,.55);border:1px solid rgba(255,255,255,.08);
  padding:2px 8px;border-radius:3px;font-size:10px;color:rgba(255,255,255,.45);}
.v3d-coord{position:absolute;bottom:12px;left:14px;font-size:10px;
  color:rgba(255,255,255,.3);pointer-events:none;font-family:'Courier New',monospace;}
.v3d-empty{position:absolute;inset:0;display:flex;flex-direction:column;
  align-items:center;justify-content:center;gap:8px;pointer-events:none;}
.v3d-empty .ti{font-size:48px;color:rgba(255,255,255,.07);}
.v3d-empty p{font-size:12px;color:rgba(255,255,255,.2);}

/* ── RIGHT PANEL ────────────────────────────────────────────── */
.v3d-rp{width:220px;flex-shrink:0;background:var(--bg);border-left:1px solid var(--bdr);
  display:flex;flex-direction:row;overflow:hidden;
  transition:width .22s cubic-bezier(.4,0,.2,1);}
.v3d-rp.rp-off{width:14px;}
.v3d-rp-tab{width:14px;flex-shrink:0;background:var(--bg2);border:none;
  border-left:1px solid var(--bdr);cursor:pointer;color:var(--txt3);
  display:flex;align-items:center;justify-content:center;
  transition:background .12s,color .12s;}
.v3d-rp-tab:hover{background:var(--sf3);color:var(--txt);}
.v3d-rp-tab .ti{font-size:12px;line-height:1;
  transition:transform .22s cubic-bezier(.4,0,.2,1);}
.v3d-rp.rp-off .v3d-rp-tab{border-left:none;}
.v3d-rp.rp-off .v3d-rp-tab .ti{transform:rotate(180deg);}
.v3d-rp-body{flex:1;display:flex;flex-direction:column;overflow-y:auto;min-width:0;}
.v3d-rp-body::-webkit-scrollbar{width:3px;}
.v3d-rp-body::-webkit-scrollbar-thumb{background:var(--bdr2);border-radius:2px;}
.v3d-ph{background:var(--bg2);padding:0 10px;height:28px;font-size:10.5px;
  color:var(--txt2);display:flex;align-items:center;gap:5px;
  border-bottom:1px solid var(--bdr);flex-shrink:0;font-weight:600;
  letter-spacing:.03em;text-transform:uppercase;}
.v3d-ph .ti{font-size:13px;opacity:.7;}
.v3d-ph em{color:var(--txt3);font-style:normal;font-weight:400;
  text-transform:none;margin-left:auto;}
.v3d-scroll{overflow-y:auto;flex:1;min-height:0;}
.v3d-scroll::-webkit-scrollbar{width:3px;}
.v3d-scroll::-webkit-scrollbar-thumb{background:var(--bdr2);border-radius:2px;}

/* Entity list rows */
.v3d-item{display:flex;align-items:center;gap:6px;padding:5px 10px;
  font-size:11px;border-bottom:1px solid var(--bdr);color:var(--txt2);
  transition:background .1s;}
.v3d-item:hover{background:var(--sf);}
.v3d-item-icon{width:18px;height:18px;border-radius:3px;
  display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.v3d-item-icon .ti{font-size:11px;}
.v3d-item-name{flex:1;font-size:10.5px;color:var(--txt2);}
.v3d-item-count{font-size:10px;color:var(--txt3);font-variant-numeric:tabular-nums;}

/* Material swatches */
.v3d-mat-row{display:flex;align-items:center;gap:7px;padding:5px 10px;
  font-size:11px;border-bottom:1px solid var(--bdr);color:var(--txt2);}
.v3d-mat-swatch{width:10px;height:10px;border-radius:2px;flex-shrink:0;}
.v3d-mat-name{flex:1;text-transform:uppercase;font-size:10px;letter-spacing:.04em;}
.v3d-mat-count{font-size:10px;color:var(--txt3);}

/* Dimensions section */
.v3d-dims{padding:8px 10px;font-size:11px;}
.v3d-dim-row{display:flex;justify-content:space-between;align-items:center;
  padding:3px 0;border-bottom:1px solid var(--bdr);color:var(--txt2);}
.v3d-dim-row:last-child{border-bottom:none;}
.v3d-dim-label{color:var(--txt3);font-size:10px;}
.v3d-dim-val{font-variant-numeric:tabular-nums;color:var(--txt);font-weight:500;}

/* Section cut slider */
.v3d-cut{padding:8px 10px;border-top:1px solid var(--bdr);}
.v3d-cut label{font-size:10px;color:var(--txt3);display:block;margin-bottom:4px;}
.v3d-cut input[type=range]{width:100%;accent-color:var(--blu);}