/* Eiffel — modern dark UI */
:root{
  --bg:#121212; --panel:#1e1e1e; --panel2:#232323; --line:#3a3a3a;
  --ink:#f0f0f0; --mut:#aaaaaa; --accent:#888888; --accent2:#bbbbbb;
  --danger:#ff5555; --good:#55ff55; --radius:9px;
}
*{box-sizing:border-box}
html,body{height:100%;margin:0}
body{
  background:var(--bg); color:var(--ink);
  font:13px/1.45 "Segoe UI", Helvetica, Arial, sans-serif;
  display:flex; flex-direction:column; overflow:hidden; user-select:none;
}
b{font-weight:700}
h3{font-size:11px;letter-spacing:.09em;text-transform:uppercase;color:var(--mut);margin:0 0 8px}

/* ---- topbar ---- */
.topbar{display:flex;align-items:center;gap:12px;padding:8px 12px;background:var(--bg);border-bottom:1px solid var(--line);flex:0 0 auto}
.brand{font-size:15px;font-weight:600;display:flex;align-items:center;gap:8px;letter-spacing:.02em}
.brand b{color:var(--accent)}
.brand-text{display:flex;flex-direction:column;line-height:1.1}
.brand .build{font-size:9.5px;font-weight:400;letter-spacing:0;color:var(--mut);font-family:Consolas,monospace;white-space:nowrap}
.dot{width:11px;height:11px;border-radius:50%;background:linear-gradient(135deg,var(--accent),var(--accent2))}
.ws-name{background:var(--panel2);border:1px solid var(--line);color:var(--ink);border-radius:7px;padding:6px 10px;width:170px;font-size:13px}
.menus{display:flex;align-items:center;gap:6px;margin-left:auto;flex-wrap:wrap}
.mbtn{background:var(--panel2);border:1px solid var(--line);color:var(--ink);border-radius:7px;padding:6px 11px;cursor:pointer;font-size:12.5px}
.mbtn:hover{background:var(--hover);border-color:var(--line2)}
.mbtn.primary{background:var(--accent);border-color:var(--accent);color:var(--on-accent);font-weight:600}
.mbtn.primary:hover{background:var(--accent)}
.divider{width:1px;height:22px;background:var(--line);margin:0 3px}
.scale{display:flex;align-items:center;gap:5px;color:var(--mut);font-size:12px}
.scale select,select.sel{background:var(--panel2);border:1px solid var(--line);color:var(--ink);border-radius:6px;padding:4px 6px}

/* ---- layout ---- */
.main{flex:1 1 auto;display:flex;min-height:0}
.left,.right{width:248px;flex:0 0 auto;background:var(--panel);display:flex;flex-direction:column;overflow:hidden}
.left{border-right:1px solid var(--line)}
.right{border-left:1px solid var(--line);width:288px}
.panel{padding:12px;border-bottom:1px solid var(--line);overflow:auto}
.panel.grow{flex:1 1 auto;min-height:0}
.stage{flex:1 1 auto;position:relative;background:var(--bg);overflow:hidden}
.stage.panning{cursor:grab}
canvas{position:absolute;inset:0;width:100%;height:100%;display:block;touch-action:none}
.zhint{position:absolute;left:50%;bottom:12px;transform:translateX(-50%);background:rgba(10,14,20,.72);border:1px solid var(--line);color:var(--mut);padding:5px 12px;border-radius:20px;font-size:11.5px;pointer-events:none}

/* ---- toolbar ---- */
.toolbar{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.tool{display:flex;align-items:center;gap:7px;background:var(--panel2);border:1px solid var(--line);color:var(--ink);border-radius:8px;padding:7px 8px;cursor:pointer;text-align:left;font-size:11.5px}
.tool:hover{background:var(--hover)}
.tool.active{background:var(--accent);border-color:var(--accent);color:var(--on-accent);font-weight:600}
.tool .ti{font-size:15px;width:18px;text-align:center}
.tool .tl{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sticky{display:flex;align-items:center;gap:7px;margin-top:9px;color:var(--mut);font-size:12px;cursor:pointer}

.arrange{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.abtn{background:var(--panel2);border:1px solid var(--line);color:var(--ink);border-radius:7px;padding:8px 0;cursor:pointer;font-size:14px}
.abtn:hover{background:var(--hover)}
.abtn.danger:hover{background:#3a2128;border-color:var(--danger);color:var(--danger)}

/* ---- boards ---- */
.board-tools{display:flex;flex-direction:column;gap:6px;margin-bottom:8px}
.wbtn{background:var(--panel2);border:1px solid var(--line);color:var(--ink);border-radius:7px;padding:8px;cursor:pointer;font-size:12px}
.wbtn:hover{background:var(--hover);border-color:var(--line2)}
.boards-list{display:flex;flex-direction:column;gap:6px}
.board-item{display:flex;gap:8px;align-items:center;background:var(--panel2);border:1px solid var(--line);border-radius:8px;padding:8px;cursor:pointer}
.board-item.active{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent) inset}
.board-item .binfo{flex:1;min-width:0}
.board-item .bname{font-weight:600;font-size:12.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.board-item .bmeta{color:var(--mut);font-size:11px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bacts{display:flex;gap:3px}
.mini{background:var(--hover);border:1px solid var(--line);color:var(--mut);border-radius:5px;width:22px;height:22px;cursor:pointer;font-size:11px;padding:0;line-height:1}
.mini:hover{color:var(--ink);background:#2c3647}
.mini.add{width:auto;padding:5px 8px;color:var(--ink)}

/* ---- layers ---- */
.layers{display:flex;flex-direction:column;gap:3px;max-height:180px}
.layer{display:flex;align-items:center;gap:6px;padding:5px 7px;border-radius:6px;cursor:default;background:var(--panel2);border:1px solid transparent}
.layer.sel{border-color:var(--accent)}
.layer .lname{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;cursor:pointer;font-size:12px}
.layer:hover{background:var(--hover)}

/* ---- inspector ---- */
.inspector .empty,.hint{color:var(--mut);font-size:12px;line-height:1.6}
.hint{padding:4px 0}
.el-head{display:flex;flex-direction:column;gap:2px;margin-bottom:8px}
.el-type{font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--accent)}
.el-name{font-weight:600;font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sec-title{font-size:10.5px;letter-spacing:.07em;text-transform:uppercase;color:var(--mut);margin:12px 0 5px;border-top:1px solid var(--line);padding-top:9px}
.row{display:flex;align-items:center;gap:8px;margin:6px 0}
.row .rlab{flex:0 0 70px;color:var(--mut);font-size:11.5px}
.row>*:not(.rlab){flex:1;min-width:0}
.numbox{background:var(--panel2);border:1px solid var(--line);color:var(--ink);border-radius:6px;padding:5px 6px;width:100%;font-size:12px}
.numbox.wide{width:100%}
.range{display:flex;align-items:center;gap:7px}
.range input[type=range]{flex:1;accent-color:var(--accent)}
.range .numbox{flex:0 0 52px}
.txt{background:var(--panel2);border:1px solid var(--line);color:var(--ink);border-radius:6px;padding:6px 8px;width:100%;font-size:12px;font-family:inherit}
textarea.txt{min-height:54px;resize:vertical}
.colorctrl{display:flex;gap:6px;align-items:center}
.colorctrl .sel{flex:1}
.colorctrl .pick.grow{flex:1;width:auto}
.colorctrl .mini{flex:0 0 28px;height:28px;font-size:13px}
.colorctrl .mini.on{color:var(--ink);border-color:var(--line2)}
.pick{width:34px;height:28px;border:1px solid var(--line);border-radius:6px;background:none;padding:2px;cursor:pointer}
.pair{display:flex;gap:6px}
.pair>*{flex:1}
/* ---- multi-text rows (label segments) ---- */
.seg-list{display:flex;flex-direction:column;gap:8px;margin-bottom:6px}
.seg-card{background:var(--panel2);border:1px solid var(--line);border-radius:8px;padding:8px;display:flex;flex-direction:column;gap:6px}
.seg-card .txt{min-height:38px}
.seg-ctr{display:flex;gap:6px}
.seg-ctr .numbox{flex:0 0 52px}
.seg-ctr .sel{flex:1;min-width:0}
.seg-acts{display:flex;gap:4px;justify-content:flex-end}

.legend-items{display:flex;flex-direction:column;gap:6px}
.litem{display:flex;gap:6px;align-items:center}
.litem .colorctrl{flex:0 0 120px}
.litem .txt{flex:1}
.btnrow{display:flex;gap:6px}
.btnrow .mini{flex:1;width:auto;height:26px;font-size:13px}
.linkbar{display:flex;align-items:center;gap:8px;background:rgba(57,217,138,.12);border:1px solid var(--good);border-radius:7px;padding:7px 9px;margin-bottom:8px;font-size:11.5px;color:var(--ink)}
.linkbar span{flex:1;line-height:1.4}
.linkbar .mini{flex:0 0 auto;width:auto;padding:3px 8px;color:var(--ink);border-color:var(--good)}

/* ---- element templates ---- */
.tpl-tools{margin-bottom:8px}
.tpl-list{display:flex;flex-direction:column;gap:6px}
.tpl-list .empty{color:var(--mut);font-size:11.5px;line-height:1.6}
.tpl-item{display:flex;gap:8px;align-items:center;background:var(--panel2);border:1px solid var(--line);border-radius:8px;padding:8px}
.tpl-item .tinfo{flex:1;min-width:0}
.tpl-item .tname{font-weight:600;font-size:12.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tpl-item .tmeta{color:var(--mut);font-size:11px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tacts{display:flex;gap:3px;flex-wrap:wrap;justify-content:flex-end}

/* ---- inline text editor ---- */
.inline-editor{position:absolute;z-index:50;background:rgba(255,255,255,.97);color:#111;border:2px solid var(--accent);border-radius:6px;padding:4px 6px;font-family:Helvetica,Arial,sans-serif;line-height:1.25;resize:none;outline:none;box-shadow:0 6px 24px rgba(0,0,0,.4)}

/* ---- toast ---- */
.toast{position:fixed;left:50%;bottom:26px;transform:translateX(-50%) translateY(20px);background:#0c1118;border:1px solid var(--accent);color:var(--ink);padding:10px 18px;border-radius:9px;opacity:0;pointer-events:none;transition:.25s;z-index:100;box-shadow:0 8px 30px rgba(0,0,0,.5);max-width:70vw}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}

::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-thumb{background:#2a3342;border-radius:6px;border:2px solid var(--panel)}
::-webkit-scrollbar-track{background:transparent}

/* ---- arrange: align + snap subsections ---- */
h3.sub{margin-top:12px;display:flex;align-items:center;gap:6px}
h3.sub .subhint{font-size:9.5px;color:var(--mut);text-transform:none;letter-spacing:0;opacity:.8}
.arrange.align{margin-top:2px}
.snaprow{display:flex;flex-direction:column;gap:7px;margin-top:4px}
.snapchk{display:flex;align-items:center;gap:7px;color:var(--mut);font-size:12px;cursor:pointer}
.snapchk.gridsize{gap:6px}
.snapchk.gridsize .numbox{flex:0 0 56px;width:56px;cursor:text}

/* ---- popover (PDF options) ---- */
.popover{position:fixed;z-index:120;min-width:264px;background:var(--panel);border:1px solid var(--line2);border-radius:10px;padding:12px;box-shadow:0 14px 40px rgba(0,0,0,.55);display:none;flex-direction:column;gap:9px}
.popover.show{display:flex}
.popover h4{margin:0 0 2px;font-size:12px;letter-spacing:.04em;color:var(--ink)}
.poprow{display:flex;flex-direction:column;gap:4px;font-size:11.5px;color:var(--mut)}
.poprow select{background:var(--panel2);border:1px solid var(--line);color:var(--ink);border-radius:6px;padding:5px 7px;font-size:12px}
.poprow.check{flex-direction:row;align-items:center;gap:8px;color:var(--ink);cursor:pointer}
.pophint{margin:2px 0 0;font-size:10.5px;color:var(--mut);line-height:1.5}

/* ---- context menu ---- */
.ctx-menu{position:fixed;z-index:200;min-width:208px;background:var(--panel);border:1px solid var(--line2);border-radius:10px;padding:5px;box-shadow:0 16px 44px rgba(0,0,0,.6);display:none;font-size:12.5px}
.ctx-menu.show{display:block}
.ctx-sub{position:absolute;top:-5px;left:100%;min-width:208px;background:var(--panel);border:1px solid var(--line2);border-radius:10px;padding:5px;box-shadow:0 16px 44px rgba(0,0,0,.6);display:none}
.ctx-sub.flip{left:auto;right:100%}
.ctx-item.has-sub:hover>.ctx-sub,.ctx-item.has-sub.open>.ctx-sub{display:block}
.ctx-item{position:relative;display:flex;align-items:center;gap:9px;padding:7px 10px;border-radius:7px;cursor:pointer;white-space:nowrap;color:var(--ink)}
.ctx-item:hover{background:var(--hover)}
.ctx-item .ci{width:18px;text-align:center;font-size:14px;opacity:.95}
.ctx-item .cl{flex:1}
.ctx-item .ca{color:var(--mut);font-size:11px}
.ctx-item.danger:hover{background:#3a2128;color:var(--danger)}
.ctx-item.disabled{opacity:.38;pointer-events:none}
.ctx-sep{height:1px;background:var(--line);margin:4px 6px}

/* ---- mobile tab bar (hidden on desktop) ---- */
.mobile-tabs{display:none}
.mtab{flex:1;display:flex;flex-direction:column;align-items:center;gap:1px;background:none;border:none;color:var(--mut);padding:6px 2px;cursor:pointer;font-size:9.5px;min-width:0}
.mtab .mti{font-size:16px;line-height:1}
.mtab.active{color:var(--accent)}

/* ---- responsive: collapse side panels into a bottom drawer + tabs ---- */
@media (max-width:820px),(max-height:500px) and (pointer:coarse){
  body.is-mobile .main{flex-direction:column}
  body.is-mobile .stage{flex:1 1 auto;min-height:0}
  body.is-mobile .left,body.is-mobile .right{
    position:fixed;left:0;right:0;bottom:56px;width:100%!important;height:48vh;max-height:48vh;
    z-index:60;border:0;border-top:1px solid var(--line);border-radius:16px 16px 0 0;
    box-shadow:0 -12px 34px rgba(0,0,0,.55);
    /* slide up when a tab is open */
    transform:translateY(0);transition:transform .22s ease;
  }
  /* grab-handle affordance at the top of the drawer */
  body.is-mobile .left::before,body.is-mobile .right::before{
    content:"";position:sticky;top:0;display:block;width:40px;height:4px;margin:7px auto 3px;
    border-radius:3px;background:var(--line2);flex:0 0 auto;
  }
  body.is-mobile .panel{border-bottom:1px solid var(--line);padding:12px 14px}
  body.is-mobile .panel.grow{flex:1 1 auto}
  body.is-mobile .mobile-tabs{
    display:flex;position:fixed;left:0;right:0;bottom:0;height:56px;z-index:70;
    background:var(--bg);border-top:1px solid var(--line);align-items:stretch;
    padding-bottom:env(safe-area-inset-bottom,0)
  }
  body.is-mobile .toast{bottom:66px}
  body.is-mobile .zhint{display:none}
  /* roomier touch targets */
  body.is-mobile .abtn{padding:13px 0;font-size:17px}
  body.is-mobile .tool{padding:12px 10px;font-size:13px}
  body.is-mobile .wbtn{padding:11px}
  /* sized by their content (a fixed 30 px squeezed every text button - '+ La', 'Collap'); icon minis keep the minimum */
  body.is-mobile .mini{width:auto;min-width:30px;height:30px;padding:0 9px;font-size:13px;white-space:nowrap}
  body.is-mobile .lt-tools{flex-wrap:wrap}
  body.is-mobile .board-item{padding:11px}
  body.is-mobile .layer{padding:9px 10px}
  body.is-mobile .layers{max-height:none}
  /* active mobile tab gets a filled pill so the current panel is obvious */
  body.is-mobile .mtab.active{color:var(--accent)}
  body.is-mobile .mtab.active .mti{transform:translateY(-1px)}
  /* header: keep the brand row tidy and let the action buttons scroll in one
     line instead of wrapping into several rows that eat the canvas. */
  .topbar{gap:8px;flex-wrap:wrap}
  .menus{flex-wrap:nowrap;overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;padding-bottom:2px;scrollbar-width:none}
  .menus::-webkit-scrollbar{display:none}
  .mbtn{flex:0 0 auto}
  .ws-name{width:120px}
}
/* larger controls on true touch devices regardless of width */
@media (pointer:coarse){
  .mtab{padding:8px 2px}
  .ctx-item{padding:10px 12px}
}

/* ---- Bitmap Editor Modal ------------------------------------------------- */
.bmp-modal{
  position:fixed;inset:0;z-index:900;
  background:rgba(5,8,14,.97);
  display:flex;flex-direction:column;
}
.bmp-tb{
  flex:0 0 auto;display:flex;align-items:center;gap:7px;flex-wrap:wrap;
  padding:9px 14px;background:var(--bg);border-bottom:1px solid var(--line);
}
.bmp-title{font-weight:700;color:var(--ink);font-size:13px;margin-right:2px}
.bmp-sep{width:1px;height:20px;background:var(--line);flex-shrink:0;margin:0 1px}
.bmp-tb-btn{
  background:var(--panel2);border:1px solid var(--line);color:var(--ink);
  border-radius:7px;padding:5px 10px;cursor:pointer;font-size:12px;white-space:nowrap;
}
.bmp-tb-btn:hover{background:var(--hover)}
.bmp-tb-btn.active,.bmp-tb-btn.bmp-commit{
  background:var(--accent);border-color:var(--accent);color:var(--on-accent);font-weight:600;
}
.bmp-tb-btn.bmp-done{background:var(--good);border-color:var(--good);color:var(--on-accent);font-weight:600}
.bmp-tb-btn.bmp-cancel:hover{background:var(--danger);border-color:var(--danger)}
.bmp-slider-lbl{
  display:flex;align-items:center;gap:5px;
  color:var(--ink);font-size:12px;white-space:nowrap;
}
.bmp-slider-lbl input[type=range]{width:80px;accent-color:var(--accent)}
.bmp-hint-bar{
  flex:0 0 auto;padding:5px 14px;
  background:#0d1016;color:var(--mut);font-size:11.5px;border-bottom:1px solid var(--line);
}
.bmp-stage{
  flex:1 1 auto;position:relative;overflow:hidden;background:#07090e;
}
.bmp-stage canvas{position:absolute}
#bmp-overlay{cursor:crosshair}

/* ---- board size ---- */
/* Sits under the board tools in the Boards panel. Compact: this is a control
   you reach for occasionally, not a primary surface. */
.bsize{display:grid;gap:6px;margin:10px 0 12px;padding:10px;
  background:var(--panel2);border:1px solid var(--line);border-radius:8px}
.bsize-row{display:flex;align-items:center;gap:6px}
.bsize-row.nums{gap:4px}
.bsize .sel{flex:1 1 auto;min-width:0}
.bsize .numbox{width:72px;background:var(--bg);border:1px solid var(--line);
  color:var(--ink);border-radius:6px;padding:5px 7px;font-size:12.5px}
.bsize .numbox:focus{outline:none;border-color:var(--accent)}
.bsize .bx{color:var(--mut);font-size:12px}
.bsize .bunit{color:var(--mut);font-size:10.5px;margin-left:auto;white-space:nowrap}
.bsize .bsel{display:flex;align-items:center;gap:6px;color:var(--mut);
  font-size:11.5px;flex:1 1 auto;min-width:0}
.bsize .bsel .sel{font-size:12px}
.bsize .bsel select:disabled{opacity:.45}
.bsize-row.apply{margin-top:2px}
.bsize .bsel.all{flex:0 0 auto;cursor:pointer}
.bsize .wbtn.primary{background:var(--accent);border-color:var(--accent);
  color:var(--on-accent);font-weight:600}
.bsize .wbtn.primary:hover{background:var(--accent)}
.bsize .mini{flex:0 0 auto}
.bsize .colbox{width:34px;height:24px;padding:0;border:1px solid var(--line);
  border-radius:5px;background:var(--bg);cursor:pointer}

/* ---- keyboard hint chip ---- */
.kbd{display:inline-block;font-size:9.5px;line-height:1;padding:3px 5px;border-radius:4px;
  border:1px solid var(--line);background:var(--bg);color:var(--mut);letter-spacing:.04em}

/* ---- mobile: fewer chrome pixels, bigger touch targets ----
   The stage is the product; on a phone everything else should get out of its
   way. Panels already collapse into the tab bar, so this trims the top bar to
   what you actually reach for and makes every control thumb-sized (44px is the
   usual minimum for a reliable tap). */
@media (max-width:760px){
  .topbar{gap:6px;padding:6px 8px;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}
  .topbar::-webkit-scrollbar{display:none}
  .brand{font-size:13px}
  .brand b{display:none}                  /* the dot + "EX3D" is enough */
  .brand .build{font-size:8.5px}
  .ws-name{width:104px;font-size:12px;padding:5px 8px}
  .menus{gap:4px;flex-wrap:nowrap}
  .mbtn{padding:9px 10px;font-size:12px;min-height:38px}
  .divider{display:none}
  /* Hide only what is meaningless on a phone: pointer advice, and a file-naming
     preference whose default is right. Everything else stays reachable — the
     bar scrolls horizontally, which is cheaper than losing a capability with
     nowhere else to get it. */
  .zhint,#name-on-save{display:none}

  .panel{padding:10px}
  .toolbar{grid-template-columns:1fr 1fr;gap:8px}
  .tool{min-height:44px}
  .arrange{gap:8px}
  .abtn,.mini{min-width:40px;min-height:40px}
  .bsize .numbox{width:64px;padding:8px 7px}
  .bsize .sel,.bsize .colbox{min-height:36px}
  .sh-btn,.sh-icon{min-height:40px}
  .sh-grid{gap:12px}
}

/* Coarse pointers get the same generous targets even on a big screen. */
@media (pointer:coarse){
  .mbtn,.wbtn{min-height:38px}
  .abtn,.mini{min-width:38px;min-height:38px}
}

/* The mobile tab bar is position:fixed, so it sits ON TOP of the stage rather
   than below it — the bottom 56px of the canvas (and of any open panel) was
   underneath it. Reserve that space, including the home-indicator inset. */
@media (max-width:820px),(max-height:500px) and (pointer:coarse){
  body.is-mobile .editor{padding-bottom:calc(56px + env(safe-area-inset-bottom,0px))}
}

/* ---- board scale ---- */
.bsize .unit{flex:0 0 auto;width:62px}
.bsize-row.scale2{gap:8px}
.scaleinfo{font-size:10.5px;color:var(--mut);margin-left:auto;text-align:right;
  white-space:nowrap;font-variant-numeric:tabular-nums}
.scaleinfo.set{color:var(--accent)}
/* the calibrate rubber-band readout, pinned near the cursor */
.calib-hint{position:absolute;z-index:60;background:var(--panel);border:1px solid var(--accent);
  color:var(--ink);border-radius:6px;padding:5px 9px;font-size:12px;pointer-events:none;
  white-space:nowrap;box-shadow:0 6px 20px rgba(0,0,0,.5)}

/* ---- ARCHICAD modify commands: the tracker ---- */
.op-hint{position:absolute;left:50%;top:14px;transform:translateX(-50%);z-index:55;
  display:flex;align-items:center;gap:10px;flex-wrap:wrap;justify-content:center;
  background:rgba(16,20,28,.94);border:1px solid #ffc24b;border-radius:8px;
  padding:7px 12px;font-size:12.5px;color:var(--ink);pointer-events:none;max-width:92%}
.op-hint[hidden]{display:none}
.op-hint b{color:#ffc24b;font-weight:600}
.op-hint .op-val{font-variant-numeric:tabular-nums;color:#fff;background:var(--hover);
  border-radius:4px;padding:2px 7px;font-family:Consolas,monospace}
.op-hint .op-keys{color:var(--mut);font-size:11px}

/* ---- shortcut sheet ---- */
.km-sheet{position:fixed;inset:0;z-index:9500;background:rgba(5,8,12,.7);
  display:flex;align-items:center;justify-content:center;padding:24px}
.km-sheet[hidden]{display:none}
.km-card{background:var(--panel);border:1px solid var(--line);border-radius:12px;
  max-width:980px;width:100%;max-height:86vh;overflow:auto;padding:18px 22px}
.km-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}
.km-head h2{margin:0;font-size:16px}
.km-cols{column-width:270px;column-gap:28px}
.km-cols section{break-inside:avoid;margin-bottom:16px}
.km-cols h3{font-size:10.5px;letter-spacing:.09em;text-transform:uppercase;color:var(--mut);margin:0 0 6px}
.km-row{display:flex;justify-content:space-between;gap:12px;padding:4px 0;border-bottom:1px dashed var(--line);font-size:12.5px}
.km-keys{display:flex;gap:4px;flex-wrap:wrap;justify-content:flex-end}
.km-keys kbd{font-family:Consolas,monospace;font-size:11px;background:var(--bg);border:1px solid var(--line);
  border-bottom-width:2px;border-radius:4px;padding:1px 6px;color:var(--ink);white-space:nowrap}
.km-note{color:var(--mut);font-size:11.5px;margin:8px 0 0}
.km-flash{outline:2px solid #ffc24b;outline-offset:-2px}

/* architecture tools */
.tool-sep{font-size:9.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--mut);padding:10px 6px 3px;border-top:1px solid var(--line);margin-top:6px}
.mmwrap{display:flex;align-items:center;gap:6px}
.mmwrap .unit{color:var(--mut);font-size:11px}
.readout{font-variant-numeric:tabular-nums}

/* 3D view */
.v3d{position:absolute;top:0;right:0;bottom:0;width:50%;z-index:40;display:flex;flex-direction:column;background:#e9ecef;border-left:1px solid var(--line);box-shadow:-8px 0 24px rgba(0,0,0,.25)}
.v3d.full{width:100%}
.v3d[hidden]{display:none}
.v3d-bar{display:flex;align-items:center;gap:8px;padding:6px 8px;background:var(--panel);color:var(--ink);font-size:12px;border-bottom:1px solid var(--line);flex-wrap:wrap}
.v3d-bar b{letter-spacing:.06em}
.v3d-chk{display:flex;align-items:center;gap:4px;color:var(--mut)}
.v3d-info{color:var(--mut);font-size:11px}
.v3d-sp{flex:1}
.v3d-host{flex:1;position:relative;min-height:0;overflow:hidden}
.v3d-host canvas{display:block;cursor:grab}
.v3d-host canvas:active{cursor:grabbing}
.v3d-help{position:absolute;left:8px;bottom:6px;font-size:10.5px;color:#5b6472;pointer-events:none}
.v3d-btn{font-weight:700}
body.is-mobile .v3d{width:100%;top:auto;height:55%;border-left:0;border-top:1px solid var(--line)}

/* element maker + material maker */
.em-wrap{position:fixed;inset:0;z-index:9400;background:rgba(5,8,12,.66);display:flex;align-items:center;justify-content:center;padding:18px}
.em-wrap[hidden]{display:none}
.em-card{background:var(--panel);color:var(--ink);border:1px solid var(--line);border-radius:12px;width:min(1280px,100%);height:min(860px,100%);display:flex;flex-direction:column;overflow:hidden}
.mm-card{width:min(980px,100%);height:min(700px,100%)}
/* Import IFC (ifcimport.js) */
.ifc-card{width:min(860px,100%);height:auto;max-height:100%}
.ifc-body{padding:12px 16px 16px;overflow:auto;display:flex;flex-direction:column;gap:8px}
.ifc-cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:10px}
.ifc-box{border:1px solid var(--line);border-radius:8px;padding:2px 10px 8px}
.ifc-native{border-color:color-mix(in srgb,var(--accent,#3b82f6) 55%,var(--line))}
.ifc-row{display:flex;justify-content:space-between;gap:10px;font-size:12.5px;padding:2px 0}
.ifc-row span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ifc-notes{margin:0;padding-left:18px;font-size:12px;color:var(--mut)}
.ifc-busy{min-height:1.2em}
/* Gaussian splat lighting (render/splatview.js panel) */
.splat-panel{margin:8px 0;padding:6px 0;border-top:1px solid var(--line)}
.splat-title{font-size:10px;letter-spacing:.09em;text-transform:uppercase;color:var(--mut);margin:2px 0 6px}
.splat-row{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:12px;padding:2px 0}
.splat-ctl{display:flex;align-items:center;gap:6px;flex:1;max-width:62%}
.splat-ctl input[type=range]{flex:1;min-width:0}
.splat-ctl b{font-weight:500;min-width:38px;text-align:right;font-variant-numeric:tabular-nums}
.em-head{display:flex;align-items:center;gap:10px;padding:10px 14px;border-bottom:1px solid var(--line)}
.em-head h2{margin:0;font-size:16px}
.em-sub{color:var(--mut);font-size:12px}
.em-sp{flex:1}
.em-body{flex:1;display:flex;min-height:0}
.em-list{width:220px;flex:none;overflow:auto;border-right:1px solid var(--line);padding:8px;display:flex;flex-direction:column;gap:2px}
.em-group{font-size:10px;letter-spacing:.09em;text-transform:uppercase;color:var(--mut);margin:10px 4px 4px}
.em-item{display:flex;align-items:center;gap:8px;text-align:left;background:none;border:0;color:var(--ink);padding:6px 8px;border-radius:6px;cursor:pointer;font-size:12.5px}
.em-item:hover{background:rgba(255,255,255,.05)}
.em-item.active{background:var(--accent,var(--accent));color:var(--bg)}
.em-item span:nth-child(2),.em-item span:first-child{flex:1}
.em-count{flex:none!important;color:inherit;opacity:.6;font-size:11px}
.em-new{background:none;border:1px dashed var(--line);color:var(--mut);border-radius:6px;padding:4px;margin:2px 0 6px;cursor:pointer;font-size:12px}
.em-main{flex:1;min-width:0;display:flex;flex-direction:column;padding:10px 14px;gap:8px;overflow:auto}
.em-main.empty{align-items:center;justify-content:center;color:var(--mut)}
.em-row.id{display:flex;align-items:flex-end;gap:10px;flex-wrap:wrap}
.em-lab{display:flex;flex-direction:column;gap:3px;font-size:11px;color:var(--mut)}
.em-used{color:var(--mut);font-size:11.5px}
.em-tabs{display:flex;gap:4px;border-bottom:1px solid var(--line)}
.em-tab{background:none;border:0;border-bottom:2px solid transparent;color:var(--mut);padding:6px 10px;cursor:pointer;font-size:12.5px}
.em-tab.active{color:var(--ink);border-bottom-color:var(--accent,var(--accent))}
.em-split{display:grid;grid-template-columns:minmax(0,1fr) 540px;gap:14px;min-height:0;flex:1}
@media (max-width:1100px){.em-split{grid-template-columns:1fr}}
.em-pane{min-width:0;overflow:auto}
.em-preview{display:flex;flex-direction:column;gap:6px}
.em-ptitle{display:flex;align-items:center;gap:8px;font-size:12px}
.em-draw{display:flex;gap:4px}
.em-draw .mini.on{background:var(--accent,var(--accent));color:var(--bg)}
.em-canvas{width:100%;max-width:520px;border:1px solid var(--line);border-radius:6px;background:#fff;cursor:crosshair;touch-action:none}
.em-3d{width:100%;max-width:520px;height:260px;border:1px solid var(--line);border-radius:6px;overflow:hidden;background:#eef0f3}
.em-tablewrap{overflow-x:auto}
.em-table{border-collapse:collapse;width:100%;font-size:12px}
.em-table th{text-align:left;color:var(--mut);font-weight:500;padding:4px;border-bottom:1px solid var(--line)}
.em-table td{padding:4px;border-bottom:1px dashed var(--line);vertical-align:top}
.em-table input.txt{width:100%;min-width:3em;box-sizing:border-box}
.em-table input.bad{border-color:#e5484d;background:rgba(229,72,77,.12)}
.em-fields{display:flex;flex-wrap:wrap;gap:4px 8px}
.em-f{display:flex;flex-direction:column;font-size:10px;color:var(--mut);width:78px}
.em-f.wide{width:150px}
.em-kind{font-family:Consolas,monospace;font-size:11px;color:var(--mut)}
.mini.danger{color:#ff7a70}
.mm-main{gap:12px}
.mm-cols{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.mm-col{display:flex;flex-direction:column;gap:6px}
.mm-field{display:grid;grid-template-columns:120px 1fr;align-items:center;gap:8px;font-size:12px;color:var(--mut)}
.mm-previews{display:flex;gap:14px;flex-wrap:wrap}
.mm-previews > div{display:flex;flex-direction:column;gap:4px;font-size:12px}
.mm-previews canvas{border:1px solid var(--line);border-radius:6px;background:#fff}
.mm-dot{width:12px;height:12px;border-radius:50%;flex:none!important;border:1px solid rgba(0,0,0,.25)}
.hint.warn{color:#ffb14a}
.v3d-cams{max-width:180px}

.em-card canvas{position:static;inset:auto;height:auto}
.em-3d{position:relative}
.em-3d canvas{position:absolute;inset:0;width:100%;height:100%}
.em-draw .mini,.em-row.id .mini{white-space:nowrap;padding:3px 8px;margin-left:2px}

/* Pet Palette */
.pet{position:fixed;z-index:9300;display:flex;align-items:center;gap:3px;padding:4px;background:rgba(16,20,28,.96);border:1px solid var(--line2);border-radius:10px;box-shadow:0 8px 24px rgba(0,0,0,.45)}
.pet-btn{position:relative;width:34px;height:34px;border-radius:7px;border:1px solid transparent;background:var(--panel2);color:#e8edf5;cursor:pointer;display:flex;align-items:center;justify-content:center}
.pet-btn:hover{border-color:var(--accent);background:#233047}
.pet-ic{font-size:16px;line-height:1}
.pet-n{position:absolute;right:2px;bottom:1px;font-size:8.5px;color:#8b95a5}
.pet-label{position:absolute;left:50%;top:100%;transform:translate(-50%,4px);white-space:nowrap;font-size:10.5px;color:#c9d2de;background:rgba(16,20,28,.9);padding:2px 7px;border-radius:5px;pointer-events:none}

/* tracker + status bar */
.tracker{position:fixed;z-index:9200;pointer-events:none;display:flex;gap:6px;align-items:center;padding:4px 6px;background:rgba(16,20,28,.94);border:1px solid var(--line2);border-radius:6px;font:11.5px/1.2 Consolas,monospace;color:#e8edf5;box-shadow:0 4px 12px rgba(0,0,0,.35)}
.tracker[hidden]{display:none}
.tracker b{font:600 11px system-ui,sans-serif;color:var(--mut);margin-right:2px}
.tk-f{padding:2px 6px;border-radius:4px;background:var(--panel2);min-width:60px}
.tk-f i{font-style:normal;color:#7d8899;margin-right:5px}
.tk-f.on{outline:1px solid var(--accent)}
.tk-f.typed{background:#23406a;color:#fff}
.tk-f.locked{background:#3a3016;color:#ffe2a8;box-shadow:inset 0 -2px 0 var(--accent,#d8a55a)}
.tk-f.locked i{color:#d8a55a}
.tk-k{color:#6d7889;font-size:10px}
.statusbar{position:absolute;left:0;right:0;bottom:0;height:26px;display:flex;align-items:center;justify-content:space-between;gap:8px;padding:0 8px;background:rgba(13,16,22,.92);border-top:1px solid var(--line);font-size:11px;color:var(--mut);z-index:30}
.sb-left,.sb-right{display:flex;align-items:center;gap:5px;min-width:0;overflow:hidden}
.sb-chip{background:none;border:1px solid var(--line);color:var(--mut);border-radius:10px;padding:1px 8px;font-size:11px;cursor:pointer}
.sb-chip.on{background:var(--cyan);border-color:var(--cyan);color:#fff}
.sb-sel{background:var(--panel2);color:var(--ink);border:1px solid var(--line);border-radius:5px;font-size:11px;padding:0 2px;height:19px}
.sb-xy{font-family:Consolas,monospace;color:var(--ink);white-space:nowrap}
.sb-scale{color:var(--mut)}
.sb-hint{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body.is-mobile .statusbar .sb-sel,body.is-mobile .sb-hint{display:none}

/* ── CAD chrome: menu bar, sheet tabs, sheet setup, layer tree ── */
.menubar{display:flex;align-items:center;gap:1px;margin-left:4px}
.mb-item{background:none;border:0;color:var(--ink);padding:5px 9px;border-radius:5px;font-size:12.5px;cursor:pointer}
.mb-item:hover{background:var(--hover)}
.mb-quick{display:flex;gap:4px;margin-left:auto}
.cad-chrome .topbar{gap:8px;padding:4px 10px}
.cad-chrome .ws-name{max-width:220px}
.board-tabs{display:flex;align-items:flex-end;gap:2px;padding:4px 8px 0;background:var(--bg);border-bottom:1px solid var(--line);overflow-x:auto;overflow-y:hidden;flex:0 0 auto;scrollbar-width:thin}
.btab{display:flex;align-items:center;gap:6px;padding:5px 6px 5px 10px;border:1px solid var(--line);border-bottom:0;border-radius:7px 7px 0 0;background:var(--panel2);color:var(--mut);font-size:12px;cursor:pointer;white-space:nowrap;max-width:220px;user-select:none}
.btab:hover{color:var(--ink)}
.btab.active{background:var(--panel);color:var(--ink);border-color:var(--line2);position:relative;top:1px}
.bt-ic{font-size:12px;opacity:.85}
.btab.k-plan .bt-ic{color:var(--accent)}.btab.k-3d .bt-ic{color:var(--cyan)}
.bt-name{overflow:hidden;text-overflow:ellipsis}
.bt-x{background:none;border:0;color:inherit;opacity:0;padding:0 3px;border-radius:4px;cursor:pointer}
.btab:hover .bt-x,.btab.active .bt-x{opacity:.6}
.bt-x:hover{opacity:1;background:#3a2128}
.btab-add{background:none;border:1px dashed var(--line);color:var(--mut);border-radius:6px;margin:0 0 3px 4px;padding:2px 9px;cursor:pointer}
.sheet-dlg{position:fixed;z-index:9000;top:90px;left:260px;width:300px;max-height:calc(100vh - 120px);overflow:auto;background:var(--panel);border:1px solid var(--line2);border-radius:10px;box-shadow:0 16px 44px rgba(0,0,0,.55);padding:8px 10px}
.sheet-dlg[hidden]{display:none}
.sd-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:6px}
.sd-extra{margin-top:8px;display:flex;gap:6px}
.panel.folded>*:not(h3){display:none}
.panel.folded{flex:0 0 auto!important}
#panel-layers{flex:1 1 auto;min-height:160px}
.lt-tools{display:flex;gap:4px;margin-bottom:6px}
.lt-layer{display:flex;align-items:center;gap:3px;padding:3px 2px;border-radius:5px;font-size:12px;font-weight:600;color:var(--ink);border:1px solid transparent}
.lt-layer.off{opacity:.5}.lt-layer.locked .lt-name{font-style:italic}
.lt-layer.drop{border-color:var(--accent);background:var(--accent-soft)}
.lt-car{background:none;border:0;color:var(--mut);width:16px;cursor:pointer;padding:0}
.lt-btn{background:none;border:0;color:var(--mut);cursor:pointer;padding:0 2px;font-size:11px}
.lt-name{flex:1;cursor:pointer;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lt-count{color:var(--mut);font-weight:400;font-size:11px;min-width:16px;text-align:right}
.lt-el{display:flex;align-items:center;gap:3px;padding:2px 2px 2px 26px;border-radius:5px;font-size:11.5px;color:var(--mut)}
.lt-el:hover{background:var(--hover);color:var(--ink)}
.lt-el.sel{background:var(--accent-soft);color:#fff}
.lt-el.off{opacity:.5}
body.is-mobile .menubar .mb-item{padding:5px 6px}

.lt-tools .mini{white-space:nowrap}

/* 3D sheet render bar */
.sheet3d-bar{position:absolute;top:10px;left:50%;transform:translateX(-50%);z-index:35;display:flex;flex-wrap:wrap;justify-content:center;row-gap:5px;align-items:center;gap:8px;padding:5px 8px;background:rgba(16,20,28,.94);border:1px solid var(--line2);border-radius:10px;box-shadow:0 6px 18px rgba(0,0,0,.35);font-size:12px;color:var(--ink);white-space:nowrap;max-width:calc(100% - 20px);overflow-x:auto}
.sheet3d-bar[hidden]{display:none}
.s3-title{color:var(--mut);font-weight:600;letter-spacing:.04em}
.s3-seg{display:flex;border:1px solid var(--line2);border-radius:7px;overflow:hidden}
.s3-opt{background:var(--panel2);color:var(--mut);border:0;padding:4px 10px;cursor:pointer;font-size:12px}
.s3-opt.on{background:var(--accent);color:#fff}
.s3-opt:disabled{opacity:.4;cursor:default}
.s3-sel{display:flex;align-items:center;gap:4px;color:var(--mut)}
.s3-sel select{background:var(--panel2);color:var(--ink);border:1px solid var(--line);border-radius:5px;font-size:11.5px}
.s3-status{color:var(--accent);font-family:Consolas,monospace;font-size:11px;min-width:90px}
/* layer tree buttons were squeezed to 22px */
.lt-tools .mini{width:auto;height:22px;padding:0 8px;white-space:nowrap}

/* 3D walk joysticks (touch) */
.joy{position:absolute;bottom:40px;width:120px;height:120px;border-radius:50%;background:rgba(16,20,28,.35);border:2px solid rgba(255,255,255,.35);z-index:36;touch-action:none;display:flex;align-items:center;justify-content:center}
.joy[hidden]{display:none}
.joy-left{left:18px}.joy-right{right:18px}
body.is-mobile .joy{bottom:112px}
.walk-btns{position:absolute;right:14px;bottom:130px;z-index:36;display:flex;flex-direction:column;gap:10px;touch-action:none}
.walk-btns[hidden]{display:none}
body.is-mobile .walk-btns{bottom:200px}
.walk-btn{width:54px;height:54px;border-radius:50%;border:2px solid rgba(255,255,255,.35);background:rgba(16,20,28,.45);color:#fff;font-size:22px;line-height:1;touch-action:none;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.walk-btn.on{background:#7c5cff;border-color:#b9a8ff}
.joy-knob{width:52px;height:52px;border-radius:50%;background:rgba(124,92,255,.85);box-shadow:0 2px 8px rgba(0,0,0,.4);pointer-events:none;transition:transform .05s}
.joy-label{position:absolute;bottom:-18px;font-size:10px;color:#cfd6e2;text-shadow:0 1px 2px #000;pointer-events:none}

/* story bar (plan views) + story manager */
.story-bar{position:absolute;top:10px;left:10px;z-index:35;display:flex;align-items:center;gap:6px;padding:5px 8px;background:rgba(16,20,28,.94);border:1px solid var(--line2);border-radius:10px;box-shadow:0 6px 18px rgba(0,0,0,.35);font-size:12px;color:var(--ink);white-space:nowrap;max-width:calc(100% - 20px);overflow-x:auto}
.story-bar[hidden]{display:none}
.story-bar select{background:var(--panel2);color:var(--ink);border:1px solid var(--line);border-radius:5px;font-size:12px;padding:2px 4px;max-width:220px}
.sb-step{background:var(--panel2);color:var(--ink);border:1px solid var(--line);border-radius:5px;width:24px;height:24px;cursor:pointer;font-size:10px}
.sb-step:hover{border-color:var(--accent)}
.st-card{width:min(760px,calc(100vw - 32px));height:auto;max-height:calc(100vh - 60px)}
.st-body{padding:12px 16px;overflow:auto}
.st-table{width:100%;border-collapse:collapse}
.st-table th{text-align:left;color:var(--mut);font-weight:500;padding:4px 6px}
.st-table td{padding:4px 6px;border-top:1px solid var(--line)}
.st-table tr.on td{background:rgba(124,92,255,.12)}
.st-table .txt{width:100%}
.st-actions{display:flex;gap:4px;flex-wrap:wrap}
.st-actions{flex-wrap:nowrap}
.st-actions .mini{width:auto;height:24px;padding:0 7px;white-space:nowrap}
.st-table .numbox.wide{width:80px}

/* 3D view selection panel + opening handles */
.sel3d{position:absolute;right:10px;top:60px;z-index:36;width:260px;max-height:calc(100% - 110px);overflow:auto;background:rgba(16,20,28,.95);border:1px solid var(--line2);border-radius:10px;box-shadow:0 6px 18px rgba(0,0,0,.35);font-size:12px;color:var(--ink)}
.sel3d[hidden]{display:none}
.sel3d-head{display:flex;align-items:center;gap:4px;padding:6px 8px;border-bottom:1px solid #2b3445}
.sel3d-head .mini{width:auto;height:22px;padding:0 6px}
.sel3d-body{padding:6px 8px;display:flex;flex-direction:column;gap:5px}
.sel3d-row{display:flex;align-items:center;justify-content:space-between;gap:8px;color:var(--mut)}
.sel3d-row .numbox,.sel3d-row .sel{width:120px}
.sel3d-tf{border-bottom:1px solid var(--line2,#333)}
.sel3d-tfh{text-transform:uppercase;letter-spacing:.06em;font-size:10.5px}
.sel3d-row.tri .numbox{width:62px}.sel3d-row.duo .numbox{width:59px}
.sel3d-row.tri span,.sel3d-row.duo span{flex:1}
.sel3d-sub{color:var(--accent);font-weight:600}
.sel3d-ro{color:var(--mut);font:11.5px var(--mono,ui-monospace,monospace);text-align:right;max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sel3d-warn{color:#e8a33d}
.asm-w{position:absolute;transform:translate(-50%,-50%);z-index:30;height:24px;padding:0 10px;border-radius:999px;border:1px solid var(--accent);background:rgba(16,20,28,.88);color:#fff;font:600 11px var(--sans,system-ui);cursor:pointer;white-space:nowrap;pointer-events:auto;box-shadow:0 2px 8px rgba(0,0,0,.35)}
.asm-w:hover{background:var(--accent);color:var(--on-accent,#111)}
.asm-w[hidden]{display:none}
.sel3d .btnrow .mini{width:auto;padding:0 8px}
/* the workbench command panel (modeler/benchui.js): 3ds Max's Create / Modify tabs */
.sel3d.bench{width:280px}
.bench-head b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:150px}
.bench-views{padding:5px 8px 0}
.bench-tabs{display:flex;gap:2px;padding:6px 8px 0;border-bottom:1px solid #2b3445}
.bench-tab{flex:1;height:26px;background:transparent;border:1px solid transparent;border-bottom:none;border-radius:6px 6px 0 0;color:var(--mut);font-size:12px;cursor:pointer}
.bench-tab.on{background:rgba(255,255,255,.06);border-color:#2b3445;color:var(--ink);font-weight:600}
.bench-grid{display:grid;grid-template-columns:1fr 1fr;gap:4px}
.bench-grid .mini{width:100%;height:28px}
.bench-row{display:flex;gap:3px;align-items:center}
.bench-part{flex:1;min-width:0;display:flex;align-items:center;gap:6px;height:26px;padding:0 6px;background:transparent;border:1px solid #2b3445;border-radius:5px;color:var(--ink);font-size:12px;cursor:pointer;text-align:left}
.bench-part.on{border-color:var(--accent);background:rgba(90,160,255,.12)}
.bench-part i{width:10px;height:10px;border-radius:2px;flex:none}
.bench-part span{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bench-part small{color:var(--mut);font-size:10.5px}
.stack-base .mini{flex:1;text-align:left;font-weight:600}
.bench-display{padding:4px 8px 0;flex-wrap:wrap;gap:3px}
.bench-display .mini{padding:0 6px!important;height:22px}
.bench-display .bd-sep{width:1px;align-self:stretch;background:#2b3445;margin:0 2px}
.vm-bar{position:absolute;left:calc(12px + var(--ovl,0px));top:40px;z-index:35;display:flex;gap:2px;pointer-events:auto}
.vm-bar[hidden]{display:none}
.vm-lbl{height:20px;padding:0 6px;border:0;border-radius:4px;background:rgba(20,24,30,.62);color:#e9ebee;font:500 11.5px var(--sans,system-ui);cursor:pointer;text-shadow:0 1px 2px rgba(0,0,0,.6);opacity:.85}
.vm-lbl:hover{color:var(--accent);opacity:1}
.vm-menu{position:absolute;z-index:60;min-width:210px;padding:4px;border-radius:6px;background:rgba(36,40,46,.98);border:1px solid var(--line2,#3a4250);box-shadow:0 8px 24px rgba(0,0,0,.4)}
.vm-menu hr{border:0;border-top:1px solid var(--line2,#3a4250);margin:4px 2px}
.vm-item{display:flex;justify-content:space-between;width:100%;padding:4px 10px;border:0;border-radius:4px;background:transparent;color:var(--ink,#ddd);font:12px var(--sans,system-ui);text-align:left;cursor:pointer}
.vm-item:hover{background:var(--accent);color:var(--on-accent,#111)}
.vm-item.on{font-weight:600}
.vm-item span{opacity:.6;margin-left:16px}
.vm-head{padding:4px 10px 2px;color:var(--mut,#999);font:600 10px var(--sans,system-ui);letter-spacing:.06em;text-transform:uppercase}
.nh-pop{position:absolute;z-index:70}
.nh-stats{font:500 10.5px var(--mono,ui-monospace,monospace);opacity:.8}
.nh-stats:empty{display:none}
.bench-exit{position:absolute;left:50%;top:10px;transform:translateX(-50%);z-index:37;display:flex;align-items:center;gap:8px;padding:4px 4px 4px 12px;border-radius:999px;background:rgba(16,20,28,.92);border:1px solid var(--accent);color:var(--ink);font-size:12px;box-shadow:0 4px 14px rgba(0,0,0,.3)}
.bench-exit[hidden]{display:none}
.bench-exit button{height:24px;padding:0 12px;border-radius:999px;border:0;background:var(--accent);color:var(--on-accent,#111);font-weight:600;cursor:pointer}
.bench-wc{width:20px;height:20px;padding:0;border:1px solid #2b3445;border-radius:4px;background:none;flex:none;cursor:pointer}
.bench-grid{grid-template-columns:1fr 1fr 1fr}
@media (max-width:700px){.sel3d{top:auto;bottom:44px;right:8px;left:8px;width:auto;max-height:40%}}
.h3d-layer{position:absolute;inset:0;pointer-events:none;z-index:34}
.h3d{position:absolute;width:14px;height:14px;margin:-7px 0 0 -7px;border-radius:50%;background:var(--cyan);border:2px solid #fff;box-shadow:0 1px 4px rgba(0,0,0,.5);pointer-events:auto;cursor:grab;touch-action:none}
.gz3d{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}
.gz3d .gz-hit{pointer-events:stroke;cursor:grab}
.gz3d .gz-grip{pointer-events:all;cursor:grab}
.gz3d .gz-read{font:600 11px var(--mono,monospace);fill:#fff;paint-order:stroke;stroke:rgba(0,0,0,.7);stroke-width:3px}
.gz3d .gz-hit,.gz3d .gz-grip{touch-action:none}
.gz3d.touch .gz-read{font-size:15px}
/* the action bar under a 3D selection (js/gizmobar.js) */
.gzbar{position:absolute;left:0;top:0;z-index:2;display:flex;align-items:center;gap:2px;padding:4px;border-radius:14px;background:rgba(12,15,20,.82);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);box-shadow:0 4px 16px rgba(0,0,0,.35);pointer-events:auto;touch-action:none;font:600 11px ui-sans-serif,system-ui,sans-serif;color:#e8ecf2;white-space:nowrap}
.gzbar[hidden]{display:none}
.marquee3d{position:absolute;z-index:3;border:1px dashed #f5d90a;background:rgba(245,217,10,.08);pointer-events:none}
.gzbar select{height:28px;margin:0 2px;padding:0 4px;border:1px solid rgba(255,255,255,.18);border-radius:8px;background:rgba(255,255,255,.06);color:inherit;font:inherit;cursor:pointer}
.gzbar select option{background:#1b2029;color:#e8ecf2}
.gzbar.sub button:not([data-a=del]):not([data-p]),.gzbar.sub .gzbar-sep{display:none}
.gzbar-seg{display:flex;gap:1px;margin:0 2px;padding:1px;border-radius:9px;background:rgba(255,255,255,.06)}
.gzbar .gzbar-seg button{width:26px;height:26px;border-radius:8px;color:#8a93a3}
.gzbar .gzbar-seg button.on{background:rgba(245,217,10,.18);color:#f5d90a}
.gzbar-name{max-width:260px}
.stack-item.cur{box-shadow:inset 3px 0 #f5d90a;background:rgba(245,217,10,.08);border-radius:6px}
.gzbar.touch select{height:36px}
.gzbar-name{max-width:150px;overflow:hidden;text-overflow:ellipsis;padding:0 8px 0 6px;color:#aab3c2}
.gzbar button{display:grid;place-items:center;width:32px;height:32px;padding:0;border:0;border-radius:10px;background:transparent;color:inherit;cursor:pointer}
.gzbar button:hover{background:rgba(255,255,255,.1)}
.gzbar button[data-a=del]:hover{background:rgba(229,72,77,.25);color:#ff9592}
.gzbar button.on{background:#f0a830;color:#1a1204}
.gzbar-sep{width:1px;height:20px;margin:0 3px;background:rgba(255,255,255,.14)}
.gzbar .gzbar-t{display:none}
.gzbar.touch .gzbar-t{display:grid}.gzbar.touch i.gzbar-t{display:block}
.gzbar.touch{padding:5px;gap:4px;border-radius:18px;font-size:13px}
.gzbar.touch button{width:44px;height:44px;border-radius:13px}
.gzbar.touch button svg{width:22px;height:22px}
.gzbar .gzbar-m{display:none}
body.is-mobile .gzbar .gzbar-m{display:grid}
body.is-mobile .sel3d:not(.open){display:none}
body.is-mobile .gzbar-name{display:none}
.place3d-mark{position:absolute;width:26px;height:26px;margin:-13px 0 0 -13px;border:2px solid #f5d90a;border-radius:50%;box-shadow:0 0 0 1px rgba(0,0,0,.6),inset 0 0 0 1px rgba(0,0,0,.4);pointer-events:none;z-index:35}
.place3d-mark::after{content:"";position:absolute;left:50%;top:50%;width:4px;height:4px;margin:-2px 0 0 -2px;background:#f5d90a;border-radius:50%}
.place3d-mark i{position:absolute;left:30px;top:-2px;white-space:nowrap;font:600 11px var(--sans,sans-serif);color:#fff;text-shadow:0 1px 3px #000;font-style:normal}
#stage.placing3d canvas{cursor:crosshair}
.h3d[hidden]{display:none}
.h3d-j0,.h3d-j1{cursor:ew-resize}
.h3d-lpos{background:#f5d90a}.h3d-ltgt{background:#ff5d5d;border-radius:3px}.h3d-lcone{background:#fff;width:11px;height:11px;margin:-5.5px 0 0 -5.5px}
.h3d-head,.h3d-sill{cursor:ns-resize;background:var(--accent)}

/* material maker: physical, textures, library */
.mm-card{width:min(1100px,100%);height:min(820px,100%)}
.mbtn.on{background:var(--accent);color:#fff;border-color:var(--accent)}
.mm-tex{display:flex;flex-direction:column;gap:6px}
.mm-tex .range .numbox{width:90px}
.mm-maps{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:8px}
.mm-map{display:flex;gap:8px;align-items:center;border:1px solid var(--line);border-radius:8px;padding:6px}
.mm-thumb{width:56px;height:56px;flex:none;border-radius:6px;background:#1a2029 center/cover no-repeat;border:1px solid var(--line)}
.mm-map-body{display:flex;flex-direction:column;gap:4px;min-width:0;flex:1;font-size:12px}
.mm-map-body .sel{width:100%}
.mm-map-body .mini{width:auto;padding:0 8px}
.mm-libgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}
.mm-libcard{display:flex;flex-direction:column;gap:4px;border:1px solid var(--line);border-radius:8px;padding:6px;font-size:12px}
.mm-libcard .mini{width:auto;padding:0 6px}
.mm-libsw{height:90px;border-radius:6px;background-size:cover;background-position:center;border:1px solid var(--line)}
.mm-libadd{min-height:90px}
@media (max-width:700px){.mm-cols{grid-template-columns:1fr}}

/* sun & sky popover */
.site-pop{position:absolute;top:58px;left:50%;transform:translateX(-50%);z-index:37;width:min(340px,calc(100% - 20px));background:rgba(16,20,28,.96);border:1px solid var(--line2);border-radius:10px;box-shadow:0 8px 24px rgba(0,0,0,.45);padding:8px 10px;display:flex;flex-direction:column;gap:6px;font-size:12px;color:var(--ink)}
.site-pop[hidden]{display:none}
.sp-head{display:flex;align-items:center;gap:6px}
.sp-head .mini{width:auto;padding:0 6px}
.sp-row{display:grid;grid-template-columns:96px 1fr auto;align-items:center;gap:8px;color:var(--mut)}
.sp-row .numbox,.sp-row .txt{grid-column:2 / span 2;width:100%}
.sp-val{min-width:44px;text-align:right;font-family:Consolas,monospace;color:var(--ink)}
.site-pop .s3-seg{align-self:flex-start}

/* texture tiler frame */
.tiler-wrap{z-index:9600}
.tiler-card{width:min(1500px,100%);height:min(940px,100%)}
.tiler-frame{flex:1;border:0;width:100%;background:#111}
.mm-tilerbtn{width:auto!important;padding:0 10px!important}

/* bulk editing */
input.mixed::placeholder{color:#e0a63a;font-style:italic}
select.mixed{color:#e0a63a}
.bulk-hint{margin:4px 0 8px}

.sel3d-lines,.sel3d-cone{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible}

/* render region + renders list */
.rregion{position:absolute;z-index:33;border:2px dashed #ff9d2e;pointer-events:none;touch-action:none}
.rr-label,.rr-x,.rr-h{pointer-events:auto;touch-action:none}
.rr-label{cursor:move}
.rregion[hidden]{display:none}
.rr-label{position:absolute;left:-2px;top:-22px;background:#ff9d2e;color:#1a1206;font:600 11px/18px system-ui,sans-serif;padding:0 6px;border-radius:4px 4px 0 0;white-space:nowrap}
.rr-x{position:absolute;right:-2px;top:-22px;height:18px;border:0;background:#ff9d2e;color:#1a1206;border-radius:4px 4px 0 0;cursor:pointer;font-size:11px;padding:0 6px}
.rr-h{position:absolute;width:12px;height:12px;background:#ff9d2e;border:2px solid #fff;border-radius:2px}
.rr-nw{left:-7px;top:-7px;cursor:nwse-resize}.rr-ne{right:-7px;top:-7px;cursor:nesw-resize}.rr-sw{left:-7px;bottom:-7px;cursor:nesw-resize}.rr-se{right:-7px;bottom:-7px;cursor:nwse-resize}
.rl-card{width:min(1100px,100%);height:min(820px,100%)}
.rl-grid{flex:1;overflow:auto;padding:12px 16px;display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:12px;align-content:start}
.rl-item{display:flex;flex-direction:column;gap:6px;border:1px solid var(--line);border-radius:8px;padding:8px}
.rl-img{width:100%;aspect-ratio:16/10;object-fit:cover;border-radius:6px;background:#0c0f14;cursor:zoom-in}
.rl-item .mini{width:auto;padding:0 8px}
.rl-item .sel{max-width:140px}
.rl-full{position:fixed;inset:0;z-index:9800;background:rgba(0,0,0,.88);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;cursor:zoom-out;padding:16px}
.rl-full img{max-width:100%;max-height:calc(100% - 30px);object-fit:contain}
.rl-cap{color:#dfe6ee;font-size:13px}
.site-pop{max-height:calc(100% - 70px);overflow:auto}
.rl-item .mini{white-space:nowrap}

/* camera effects, HDRI picker, render button, performance */
.site-pop{max-height:calc(100% - 70px);overflow:auto}
.sp-group{display:flex;align-items:center;gap:8px;color:var(--mut);margin-top:2px}
.sp-chk input{justify-self:start}
.lens-pop .sel{grid-column:2 / span 2;width:100%}
.s3-go{min-width:78px}
.s3-go.stop{background:#e25563;border-color:#e25563;color:#fff}
.hdri-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:6px}
.hdri-item{display:flex;flex-direction:column;gap:3px;background:var(--panel2);border:1px solid var(--line);border-radius:7px;padding:4px;color:var(--mut);font-size:11px;cursor:pointer;text-align:left}
.hdri-item img{width:100%;aspect-ratio:2/1;object-fit:cover;border-radius:4px;display:block}
.hdri-item.on{border-color:var(--accent);color:#fff;box-shadow:0 0 0 1px var(--accent)}
.hdri-wait{display:flex;align-items:center;justify-content:center;aspect-ratio:2/1;background:var(--bg);border-radius:4px;font-size:18px}
.perf-hud{position:absolute;right:10px;bottom:34px;z-index:36;white-space:pre;font:11px/1.35 Consolas,monospace;color:#cfe3ff;background:rgba(10,14,20,.82);border:1px solid var(--line2);border-radius:8px;padding:6px 8px;pointer-events:none}
.perf-hud[hidden]{display:none}
.pf-card{width:min(680px,100%);height:auto;max-height:min(860px,100%)}
.pf-body{padding:12px 16px;overflow:auto;display:flex;flex-direction:column;gap:8px}
.pf-live{margin:0;padding:8px 10px;background:var(--bg);border:1px solid var(--line);border-radius:8px;font:12px/1.45 Consolas,monospace;color:#cfe3ff;white-space:pre-wrap}
.pf-table{border-collapse:collapse;font-size:12.5px}
.pf-table th{text-align:left;color:var(--mut);font-weight:500;padding:3px 12px 3px 0;vertical-align:top;white-space:nowrap}
.pf-table td{padding:3px 0;word-break:break-word}
.pf-row{display:grid;grid-template-columns:190px 1fr;align-items:center;gap:10px;color:var(--mut)}
.pf-log{margin:0;max-height:180px;overflow:auto;padding:8px 10px;background:var(--bg);border:1px solid var(--line);border-radius:8px;font:11px/1.4 Consolas,monospace;color:#ffb4b4;white-space:pre-wrap}
@media (max-width:600px){.pf-row{grid-template-columns:1fr}.hdri-grid{grid-template-columns:repeat(2,1fr)}}

/* material preview */
.mm-pvwrap{flex:1 1 420px;min-width:260px}
.mp{display:flex;flex-direction:column;gap:6px}
.mp-bar{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.mp-canvas{width:100%;height:auto;border:1px solid var(--line);border-radius:8px;background:#15171b;cursor:grab;touch-action:none}
.mp-canvas:active{cursor:grabbing}
.mp-controls{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:4px 12px}
.mp-field{display:grid;grid-template-columns:92px 1fr auto;align-items:center;gap:6px;color:var(--mut);font-size:12px}
.mp-field .sel{grid-column:2 / span 2;width:100%}
.mp-chk{grid-template-columns:auto 1fr}
.mp-go[hidden]{display:none}

.site-pop .pop-group{margin-top:6px;padding-top:6px;border-top:1px solid var(--line2);font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--mut)}
.lens-pop{width:min(380px,calc(100% - 20px))}

/* import dialog + model handles */
.imp-card{width:min(1180px,100%);height:min(820px,100%)}
.imp-body{flex:1;display:grid;grid-template-columns:minmax(0,1.5fr) minmax(280px,1fr);gap:16px;padding:14px 16px;overflow:auto}
.imp-left{min-width:0;display:flex;flex-direction:column}
.imp-right{display:flex;flex-direction:column;gap:7px;min-width:0}
.imp-drop{flex:1;min-height:320px;border:2px dashed var(--line2);border-radius:12px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;text-align:center;padding:24px;color:var(--mut)}
.imp-drop.over{border-color:var(--accent);background:rgba(124,92,255,.08)}
.imp-drop-icon{font-size:42px;color:var(--accent)}
.imp-pv .mp-canvas{max-height:52vh;object-fit:contain}
.imp-row{display:grid;grid-template-columns:120px 1fr;align-items:center;gap:8px;color:var(--mut);font-size:12.5px}
.imp-row .txt,.imp-row .sel{width:100%}
.imp-chk{grid-template-columns:auto 1fr}
.imp-stats td{font-family:Consolas,monospace;font-size:12px}
.imp-warn{margin:0;padding:6px 10px 6px 24px;background:rgba(255,176,32,.08);border:1px solid rgba(255,176,32,.35);border-radius:8px;color:#ffcf7a;font-size:12px}
.imp-err{color:#ff8a8a;font-size:12.5px}
.imp-place{flex-wrap:wrap;gap:6px}
.h3d-mv,.h3d-lift{width:22px;height:22px;margin:-11px 0 0 -11px;border-radius:6px;background:var(--cyan);color:#fff;font-size:13px;line-height:18px;text-align:center;cursor:move;user-select:none}
.h3d-lift{background:#12a37f;cursor:ns-resize;font-size:10px}
.h3d-rot{background:#ff9f1c;cursor:alias}
@media (max-width:760px){.imp-body{grid-template-columns:1fr}}
.mp-field input[type=range]{min-width:0;width:100%}
.mp-field{min-width:0}
.imp-pv .mp-controls{grid-template-columns:repeat(auto-fill,minmax(250px,1fr))}

.imp-lib{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:8px;overflow:auto;max-height:60vh}
.imp-lib-item{position:relative}
.imp-lib-use{width:100%;display:flex;flex-direction:column;gap:3px;background:var(--panel2);border:1px solid var(--line);border-radius:8px;padding:5px;color:var(--ink);cursor:pointer;text-align:left;font-size:11.5px}
.imp-lib-use:hover{border-color:var(--accent)}
.imp-lib-use img,.imp-lib-none{width:100%;aspect-ratio:3/2;object-fit:cover;border-radius:5px;background:var(--bg);display:flex;align-items:center;justify-content:center;font-size:26px;color:var(--accent)}
.imp-lib-use span{color:var(--mut);font-size:10.5px}
.imp-lib-del{position:absolute;top:8px;right:8px;width:auto;padding:0 6px;opacity:.75}

/* render tools that stay out of the render's way */
.sheet3d-bar{top:8px;flex-wrap:nowrap;gap:5px;padding:4px 6px;background:rgba(14,18,25,.72);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);border-color:rgba(90,105,128,.45);box-shadow:0 4px 14px rgba(0,0,0,.25);transition:opacity .2s}
.sheet3d-bar .s3-opt{padding:3px 8px}
.s3-q{background:var(--panel2);color:var(--ink);border:1px solid var(--line);border-radius:5px;font-size:11.5px;padding:2px 2px}
.s3-ic{background:transparent;border:1px solid transparent;color:var(--ink);border-radius:6px;min-width:26px;height:26px;padding:0 5px;cursor:pointer;font-size:13.5px;line-height:1}
.s3-ic:hover{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.12)}
.s3-ic.on{background:rgba(124,92,255,.35);border-color:var(--accent)}
.s3-sep{width:1px;align-self:stretch;background:rgba(255,255,255,.12);margin:2px 2px}
.sheet3d-bar .s3-go{padding:3px 10px;min-width:70px;font-size:12px}
.sheet3d-bar .s3-status{min-width:0;max-width:170px;overflow:hidden;text-overflow:ellipsis}
.sheet3d-bar.collapsed{padding:3px 5px}
#stage.orbiting .sheet3d-bar,#stage.orbiting .site-pop,#stage.orbiting .sel3d{opacity:.12;pointer-events:none}
.s3-pill{display:none;position:absolute;top:8px;right:10px;z-index:38;background:rgba(14,18,25,.6);color:var(--ink);border:1px solid rgba(90,105,128,.45);border-radius:14px;padding:3px 10px;font-size:11.5px;cursor:pointer;opacity:.6}
.s3-pill:hover{opacity:1}
#stage.clean3d .sheet3d-bar,#stage.clean3d .site-pop,#stage.clean3d .sel3d,#stage.clean3d .perf-hud,#stage.clean3d .h3d-layer{display:none!important}
#stage.clean3d .s3-pill{display:block}
/* popovers dock at the left edge, translucent, never over the middle of the render */
.site-pop{top:48px;left:10px;transform:none;width:min(310px,calc(100% - 20px));max-height:calc(100% - 96px);background:rgba(14,18,25,.84);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-color:rgba(90,105,128,.45)}
.lens-pop{width:min(330px,calc(100% - 20px))}
.sel3d{top:48px;background:rgba(14,18,25,.84);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
@media (max-width:700px){.sheet3d-bar{left:8px;right:8px;transform:none;max-width:none;overflow-x:auto}.site-pop{top:auto;bottom:44px;max-height:45%}}

.hidden-layers-chip{position:absolute;left:50%;bottom:40px;transform:translateX(-50%);z-index:36;display:flex;align-items:center;gap:8px;padding:4px 6px 4px 10px;background:rgba(40,30,10,.9);border:1px solid rgba(255,176,32,.5);border-radius:14px;color:#ffcf7a;font-size:12px}
.hidden-layers-chip[hidden]{display:none}
.hidden-layers-chip .mini{width:auto;padding:0 8px}



/* ---- video players over the canvas (js/media.js) ---- */
#media-layer{position:absolute;inset:0;pointer-events:none;z-index:4;overflow:hidden}
.md-player{position:absolute;pointer-events:auto;overflow:hidden;background:#000;transform-origin:50% 50%}
.md-player video,.md-player iframe{position:static;display:block;width:100%;height:100%;border:0;background:#000;object-fit:contain}
/* a dark app scheme over the embed's light one would paint it an opaque white */
.md-player iframe{color-scheme:normal}
.md-player.md-x,.md-player.md-x iframe{background:transparent}
.md-stop{position:absolute;top:6px;right:6px;width:26px;height:26px;border-radius:50%;border:1px solid rgba(255,255,255,.35);background:rgba(0,0,0,.65);color:#fff;font-size:13px;line-height:1;cursor:pointer;opacity:.75}
.md-stop:hover{opacity:1}
.md-dlg{width:min(520px,100%);background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:18px;box-shadow:0 20px 60px rgba(0,0,0,.5)}
.md-dlg h3{font-size:13px;color:var(--ink);letter-spacing:.04em}
.md-lab{display:block;color:var(--mut);font-size:12px;margin:4px 0 6px}
.md-url{width:100%;padding:9px 10px;border-radius:8px;border:1px solid var(--line);background:var(--bg);color:var(--ink);font:inherit;user-select:text}
.md-hint{min-height:18px;margin:6px 0 10px;color:var(--mut);font-size:12px}
.md-row{display:flex;gap:8px;align-items:center}
.md-grow{flex:1}
.md-row button{padding:7px 12px;border-radius:8px;border:1px solid var(--line);background:var(--panel2);color:var(--ink);font:inherit;cursor:pointer}
.md-row button.primary{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.md-src{word-break:break-all;user-select:text}
/* model editor (js/modeledit.js): the node map of an imported model */
.mx-tree{max-height:300px;overflow:auto;border:1px solid var(--line);border-radius:5px;padding:2px 0;font-size:12px}
.mx-row{display:flex;align-items:center;gap:3px;padding:2px 4px;cursor:pointer;white-space:nowrap}
.mx-row:hover{background:var(--hover)}
.mx-row.on{background:#3a2a1a;color:#ffb070}
.mx-row.off .mx-name{opacity:.45}
.mx-row.del .mx-name{text-decoration:line-through}
.mx-tw{flex:0 0 12px;color:var(--mut);text-align:center}
.mx-name{flex:1;overflow:hidden;text-overflow:ellipsis}
.mx-b{flex:0 0 20px;height:18px;padding:0;border:0;background:none;color:var(--mut);cursor:pointer;font-size:11px}
.mx-b:hover{color:var(--ink)}
.mx-mats summary{cursor:pointer;color:var(--mut);font-size:12px;padding:3px 0}
/* tone curves (js/render/curves.js) in the Post panel */
.cv-host{padding:4px 0}
.cv-wrap{position:relative;width:100%;aspect-ratio:1/1;max-width:260px;margin:0 auto;border:1px solid var(--line);border-radius:6px;overflow:hidden;background:#12161f}
.cv-canvas{display:block;position:static;touch-action:none;cursor:crosshair}
.s3-opt.dirty::after{content:'•';margin-left:3px;opacity:.9}
.s3-opt.cv-ch-r.on{color:#ff6b6b}
.s3-opt.cv-ch-g.on{color:#5fd47a}
.s3-opt.cv-ch-b.on{color:#5aa9ff}
.colbox{width:40px;height:22px;padding:0;border:1px solid var(--line);border-radius:4px;background:none}

/* grade a saved render (js/rendergrade.js) */
.rg-card{width:min(1500px,100%);height:min(920px,100%)}
.rg-body{flex:1;display:flex;min-height:0}
.rg-view{flex:1;display:flex;align-items:center;justify-content:center;background:#0b0e13;padding:14px;min-width:0}
.rg-canvas{position:static;max-width:100%;max-height:100%;width:auto;height:auto;box-shadow:0 6px 24px rgba(0,0,0,.5)}
.rg-side.site-pop{position:static;transform:none;top:auto;left:auto;width:360px;max-height:none;border-radius:0;border-width:0 0 0 1px;overflow:auto;box-shadow:none}
/* Grade = a full-screen workspace: the picture takes the window, the controls fold away */
.rg-wrap{padding:0;z-index:9600;background:#07090c}
.rg-wrap:focus{outline:none}
.rg-wrap>.rg-card{width:100%;height:100%;max-width:none;max-height:none;border:0;border-radius:0;box-shadow:none}
.rg-head{padding:6px 10px;gap:8px;flex-wrap:nowrap;min-height:44px}
.rg-title{display:flex;align-items:baseline;gap:10px;min-width:0;overflow:hidden;white-space:nowrap}
.rg-title .em-sub{overflow:hidden;text-overflow:ellipsis}
.rg-head .rg-icon{min-width:34px;padding:0 8px;display:inline-flex;align-items:center;justify-content:center;align-self:stretch;margin:3px 0}
.rg-head .rg-icon svg{display:block}
.rg-head .rg-icon.on{color:var(--accent,#d8a55a);border-color:var(--accent,#d8a55a);background:transparent}
.rg-view{padding:0}
.rg-card .rg-side.site-pop{width:340px;flex:none;transition:margin-right .18s ease}
.rg-card.rg-noside .rg-side.site-pop{display:none}
@media (max-width:900px){.rg-head .rg-wide{display:none}}
@media (max-width:640px),(max-height:500px) and (pointer:coarse){
  .rg-body{flex-direction:column}
  .rg-card .rg-side.site-pop{width:auto;height:44%;border-width:1px 0 0 0}
  .rg-zoom{left:8px;right:8px;justify-content:center;flex-wrap:wrap}
  .rg-title .em-sub{display:none}
}
.rl-item .btnrow{flex-wrap:wrap;gap:4px}
.rl-item .btnrow .sel{flex:1 1 100%;min-width:0}
/* public projects (js/cloud/public.js): cards on the Welcome screen and in the library */
.pub-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:10px;text-align:left}
.pub-card{position:relative;display:flex;align-items:center;gap:12px;padding:8px;border-radius:10px;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.03);color:inherit;font:inherit;cursor:pointer;text-align:left}
.pub-card:hover,.pub-card:focus-visible{border-color:#e8b04a;background:rgba(232,176,74,.08);outline:none}
.pub-thumb{flex:none;width:84px;height:56px;border-radius:6px;overflow:hidden;background:#1d232c;display:grid;place-items:center;color:#556}
.pub-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.pub-meta b{display:block;font-size:13px}
.pub-meta small{display:block;color:#9aa4b1;font-size:11px;margin-top:2px}
.pub-copy{position:absolute;top:6px;right:8px;font-size:11px;color:#e8b04a;padding:2px 6px;border-radius:4px;background:rgba(232,176,74,.1)}
.pub-copy:hover{background:rgba(232,176,74,.25)}
.pub-admin{position:absolute;top:6px;left:8px;display:flex;gap:4px}
.pub-admin .pub-copy{position:static;background:rgba(20,22,26,.75)}
.showcase-bar{display:inline-flex;gap:6px;align-items:center}
.pub-head{margin-top:26px}
.pub-head .sh-sub{color:#8b95a3;font-size:12px}
.sh-chip.pub{background:rgba(232,176,74,.18);color:#e8b04a}
.wl-pub{margin-top:4px}
/* the start screen of a fresh project (js/welcome.js) */
.wl{position:fixed;inset:0;z-index:1000;display:grid;place-items:center;padding:20px;background:rgba(6,8,12,.72);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);animation:wl-in .25s ease}
@keyframes wl-in{from{opacity:0}to{opacity:1}}
.wl-card{width:min(860px,100%);max-height:100%;overflow:auto;padding:28px 28px 20px;border-radius:16px;background:#12161d;border:1px solid rgba(255,255,255,.08);box-shadow:0 24px 64px rgba(0,0,0,.5);color:#e9edf2;font:14px ui-sans-serif,system-ui,sans-serif;text-align:center}
.wl-brand{font:700 12px ui-sans-serif,system-ui,sans-serif;letter-spacing:.14em;color:#e8b04a;text-transform:uppercase}
.wl-brand span{color:#8b95a3;font-weight:600;letter-spacing:.08em}
.wl-card h1{margin:10px 0 22px;font:600 26px ui-sans-serif,system-ui,sans-serif;letter-spacing:-.01em}
.wl-row{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.wl-opt{position:relative;display:flex;flex-direction:column;align-items:center;gap:8px;padding:22px 16px 18px;border-radius:12px;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.03);color:inherit;font:inherit;cursor:pointer;transition:border-color .15s,background .15s,transform .15s}
.wl-opt:hover,.wl-opt:focus-visible{border-color:#e8b04a;background:rgba(232,176,74,.08);transform:translateY(-2px);outline:none}
.wl-ic{color:#e8b04a;display:grid;place-items:center;width:64px;height:64px;border-radius:16px;background:rgba(232,176,74,.1)}
.wl-opt b{font-size:15px}
.wl-opt small{color:#9aa4b1;font-size:12px;line-height:1.45}
.wl-opt kbd{position:absolute;top:10px;right:10px;font:600 10px ui-monospace,monospace;color:#8b95a3;border:1px solid rgba(255,255,255,.14);border-radius:4px;padding:1px 5px}
.wl-cont{position:relative;display:flex;align-items:center;gap:14px;width:100%;margin:0 0 6px;padding:14px 16px;border-radius:12px;border:1px solid #e8b04a;background:rgba(232,176,74,.1);color:inherit;font:inherit;text-align:left;cursor:pointer}
.wl-cont:hover,.wl-cont:focus-visible{background:rgba(232,176,74,.18);outline:none}
.wl-cont b{display:block;font-size:15px}
.wl-cont small{display:block;color:#9aa4b1;font-size:12px;margin-top:2px}
.wl-cont-ic{display:grid;place-items:center;width:40px;height:40px;border-radius:10px;background:rgba(232,176,74,.2);color:#e8b04a;font-size:20px;flex:none}
.wl-cont kbd{margin-left:auto;font:600 10px ui-monospace,monospace;color:#8b95a3;border:1px solid rgba(255,255,255,.14);border-radius:4px;padding:1px 5px}
.wl-or{margin:14px 0 12px;color:#8b95a3;font-size:12px;text-transform:uppercase;letter-spacing:.1em}
/* the featured project, the centre piece of the start screen */
.wl-hero{display:grid;grid-template-columns:1.35fr 1fr;gap:0;margin:16px 0 8px;border-radius:14px;overflow:hidden;border:1px solid rgba(232,176,74,.35);background:rgba(255,255,255,.03);text-align:left}
.wl-hero[hidden]{display:none}
.wl-hero-img{display:block;padding:0;border:0;background:#0b0e13;cursor:pointer;min-height:220px}
.wl-hero-img img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .4s}
.wl-hero-img:hover img{transform:scale(1.03)}
.wl-hero-txt{padding:20px 22px;display:flex;flex-direction:column;gap:8px}
.wl-hero-tag{font:700 10.5px ui-sans-serif,system-ui,sans-serif;letter-spacing:.12em;text-transform:uppercase;color:#e8b04a}
.wl-hero h2{margin:0;font:600 26px ui-sans-serif,system-ui,sans-serif;letter-spacing:-.01em}
.wl-hero-meta{color:#9aa4b1;font-size:12.5px}
.wl-hero p{margin:4px 0 6px;color:#c9d0da;font-size:13px;line-height:1.55}
.wl-hero-go{margin-top:auto;display:flex;flex-direction:column;gap:6px}
.wl-explore{align-self:flex-start;display:inline-flex;align-items:center;gap:8px;padding:10px 16px;font-size:14px}
.wl-explore kbd{font:600 10px ui-monospace,monospace;opacity:.7;border:1px solid rgba(0,0,0,.25);border-radius:4px;padding:0 4px}
.wl-hero-hint{color:#8b95a3;font-size:11.5px}
.wl-card h1{font-size:15px;font-weight:600;color:#9aa4b1;margin:18px 0 10px;text-transform:uppercase;letter-spacing:.08em}
.wl-row .wl-opt{padding:12px 12px 12px;gap:4px}
.wl-row .wl-ic{width:40px;height:40px;border-radius:10px}
.wl-row .wl-ic svg{width:28px;height:28px}
.wl-row .wl-opt b{font-size:13.5px}
.wl-row .wl-opt small{font-size:11px}
@media (max-width:640px){.wl-hero{grid-template-columns:1fr}.wl-hero-img{min-height:180px;max-height:220px}.wl-hero h2{font-size:21px}.wl-hero p{font-size:12.5px}}
.wl-skip{margin-top:18px;background:none;border:0;color:#8b95a3;font:inherit;font-size:12px;cursor:pointer;text-decoration:underline}
.wl-skip:hover{color:#e9edf2}
@media (max-width:640px){.wl-row{grid-template-columns:1fr}.wl-opt{flex-direction:row;text-align:left;padding:14px}.wl-opt small{display:none}.wl-ic{width:48px;height:48px}.wl-card h1{font-size:21px}}
/* quick camera controls over the 3D view (js/camquick.js) */
.cq{position:fixed;right:12px;bottom:58px;z-index:36;display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:6px;max-width:min(560px,calc(100vw - 24px));padding:5px 6px;border-radius:14px;background:rgba(12,15,20,.78);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);box-shadow:0 4px 16px rgba(0,0,0,.35);font:600 11px ui-sans-serif,system-ui,sans-serif}
.cq[hidden]{display:none}
.cq-grp{display:flex;align-items:center;gap:2px;padding:0 2px}
.cq-grp+.cq-grp{border-left:1px solid rgba(255,255,255,.12);padding-left:6px}
/* tap to focus / drag the sun for exposure (js/camquick.js) */
.cq-af{--ev:0;--c:#ffd60a;position:absolute;z-index:35;width:0;height:0;pointer-events:none;transition:opacity .4s}
.cq-af[hidden]{display:none}
.cq-af.dim{opacity:.45}
.cq-af-box{position:absolute;left:-38px;top:-38px;width:76px;height:76px;box-sizing:border-box;border:1.5px solid var(--c);pointer-events:auto;touch-action:none;cursor:ns-resize;
  background:linear-gradient(var(--c),var(--c)) 50% 0/1.5px 6px no-repeat,linear-gradient(var(--c),var(--c)) 50% 100%/1.5px 6px no-repeat,linear-gradient(var(--c),var(--c)) 0 50%/6px 1.5px no-repeat,linear-gradient(var(--c),var(--c)) 100% 50%/6px 1.5px no-repeat}
.cq-af.pop .cq-af-box{animation:cqpop .35s ease-out}
@keyframes cqpop{0%{transform:scale(1.45);opacity:.2}100%{transform:scale(1);opacity:1}}
.cq-af-sun{position:absolute;left:44px;top:-60px;width:44px;height:120px;pointer-events:auto;touch-action:none;cursor:ns-resize;display:flex;flex-direction:column;align-items:center}
.cq-af-sun b{flex:1;width:1.5px;background:var(--c);opacity:0;transition:opacity .2s}
.cq-af.live .cq-af-sun b{opacity:.9}
.cq-af-sun span{position:absolute;left:50%;top:calc(50% + var(--ev) * 50px);transform:translate(-50%,-50%);color:var(--c);font-size:20px;line-height:1;text-shadow:0 0 3px rgba(0,0,0,.6)}
.cq-af::after{content:attr(data-ev);position:absolute;left:92px;top:-8px;font:600 12px ui-sans-serif,system-ui,sans-serif;color:var(--c);text-shadow:0 0 3px rgba(0,0,0,.7);white-space:nowrap}
.cq-af.lock::before{content:'AE/AF LOCK';position:absolute;left:-44px;top:-64px;padding:3px 7px;border-radius:5px;background:var(--c);color:#1a1400;font:700 10.5px ui-sans-serif,system-ui,sans-serif;letter-spacing:.04em;white-space:nowrap}
body.is-mobile .cq-af-sun{left:46px;width:52px}
.cq-chip{min-width:26px;height:26px;padding:0 7px;border-radius:13px;border:0;background:rgba(255,255,255,.08);color:#e9edf2;font:inherit;cursor:pointer;white-space:nowrap}
.cq-chip:hover{background:rgba(255,255,255,.16)}
.cq-chip.on{background:#ffd60a;color:#1a1a1a}
.cq-chip.lens{min-width:30px}
.cq-chip.lock{font-size:10px;letter-spacing:.02em}
.cq-val{color:#ffd60a;padding:0 4px}
.cq-ev{flex-basis:100%;display:flex;align-items:center;gap:8px;padding:2px 6px 0}
.cq-ev[hidden]{display:none}
.cq-ev input{flex:1;accent-color:#ffd60a}
.cq-lab{color:#ffd60a}
/* the day dial (js/daydial.js) */
.dd{display:flex;flex-direction:column;gap:3px;margin:2px 0}
.dd-head{display:flex;align-items:center;gap:6px;min-height:22px}
.dd-phase{font-weight:600;color:var(--ink);white-space:nowrap}
.dd-time{font:600 12px ui-monospace,monospace;background:none;border:1px solid transparent;border-radius:4px;color:var(--accent,#e8b04a);padding:1px 4px;cursor:text}
.dd-time:hover{border-color:var(--line2)}
.dd-in{width:54px;font:600 12px ui-monospace,monospace;background:rgba(0,0,0,.35);color:var(--ink);border:1px solid var(--accent,#e8b04a);border-radius:4px;padding:1px 4px}
.dd-btn{background:none;border:1px solid var(--line2);border-radius:4px;color:var(--ink);font-size:10px;width:24px;height:20px;cursor:pointer}
.dd-btn:hover{border-color:var(--accent,#e8b04a)}
.dd-pre{display:flex;gap:2px;justify-content:space-between;flex-wrap:wrap}
.dd-p{background:none;border:0;color:var(--mute,#8b95a3);font-size:10px;padding:1px 3px;border-radius:3px;cursor:pointer}
.dd-p:hover{color:var(--ink);background:rgba(255,255,255,.06)}
.dd-svg{width:100%;height:auto;display:block;cursor:ew-resize;touch-action:none;outline:none;border-radius:6px;background:rgba(0,0,0,.18)}
.dd-svg:focus-visible{box-shadow:0 0 0 1px var(--accent,#e8b04a)}
.dd-svg .dd-hor{stroke:rgba(255,255,255,.28);stroke-width:.8}
.dd-svg .dd-hr{stroke:rgba(255,255,255,.35);stroke-width:.8}
.dd-svg .dd-curve{fill:none;stroke:rgba(245,196,107,.85);stroke-width:1.3}
.dd-svg .dd-tick{stroke:#f5c46b;stroke-width:1}
.dd-svg .dd-lab{fill:var(--mute,#8b95a3);font:9px ui-monospace,monospace;text-anchor:middle}
.dd-svg .dd-now-l{stroke:rgba(255,255,255,.18);stroke-width:.8;stroke-dasharray:2 2}
.dd-svg .dd-sun{fill:#ffd27a;stroke:#fff5dc;stroke-width:1.2;filter:drop-shadow(0 0 3px rgba(255,200,110,.8))}
.dd-svg .dd-sun.night{fill:#c9d3e8;stroke:#8c9ab5;filter:drop-shadow(0 0 3px rgba(170,190,230,.6))}
.dd-band{position:relative;height:6px;border-radius:3px;cursor:ew-resize;touch-action:none}
.dd-band i{position:absolute;top:-2px;width:2px;height:10px;margin-left:-1px;background:#fff;border-radius:1px;box-shadow:0 0 2px rgba(0,0,0,.8)}
/* the cabinet maker's module strip (model/cabinet.js) · a system's numbers (model/sysfields.js) */
.sys-info{color:var(--accent,#f0a830);font-variant-numeric:tabular-nums}
.cab-head{margin:8px 0 4px;font-size:11px;letter-spacing:.05em;text-transform:uppercase;color:var(--mut,#98a2b3)}
.cab-strip{display:flex;gap:2px;height:54px;margin-bottom:6px;padding:3px;border-radius:8px;background:rgba(0,0,0,.25)}
.cab-mod{position:relative;min-width:0;padding:0;border:1px solid rgba(255,255,255,.18);border-radius:4px;background:#2a2f38;color:#cfd6e2;cursor:pointer;overflow:hidden;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;font:600 9.5px ui-sans-serif,system-ui,sans-serif}
.cab-mod:hover{border-color:rgba(255,255,255,.45)}
.cab-mod.on{border-color:#f0a830;box-shadow:inset 0 0 0 1px #f0a830;background:#3a3325}
.cab-mod i{position:absolute;inset:4px 4px 16px;border:1px solid rgba(255,255,255,.28);border-radius:2px}
.cab-mod span{padding-bottom:2px;white-space:nowrap}
.cab-mod.f-doors i{background:linear-gradient(90deg,transparent calc(50% - .5px),rgba(255,255,255,.28) calc(50% - .5px) calc(50% + .5px),transparent 0)}
.cab-mod.f-drawers i,.cab-mod.f-hob i{background:linear-gradient(transparent 20%,rgba(255,255,255,.28) 20% calc(20% + 1px),transparent 0 60%,rgba(255,255,255,.28) 60% calc(60% + 1px),transparent 0)}
.cab-mod.f-drawers2 i{background:linear-gradient(transparent calc(50% - .5px),rgba(255,255,255,.28) 0 calc(50% + .5px),transparent 0)}
.cab-mod.f-drawers4 i{background:repeating-linear-gradient(transparent 0 calc(25% - 1px),rgba(255,255,255,.28) calc(25% - 1px) 25%)}
.cab-mod.f-open i{border-style:dashed;background:linear-gradient(transparent calc(50% - .5px),rgba(255,255,255,.2) 0 calc(50% + .5px),transparent 0)}
.cab-mod.f-sink i::after{content:'';position:absolute;left:18%;right:18%;top:-3px;height:5px;border-radius:0 0 3px 3px;background:#9fb4c8}
.cab-mod.f-hob i::after{content:'';position:absolute;left:10%;right:10%;top:-3px;height:3px;background:#111}
.cab-mod.f-oven i{background:linear-gradient(#11141a,#11141a) 50% 70%/78% 55% no-repeat}
.cab-mod.f-fridge i{background:linear-gradient(transparent 38%,rgba(255,255,255,.28) 38% calc(38% + 1px),transparent 0)}
.cab-mod.f-blank i{border-color:transparent;background:rgba(255,255,255,.06)}
.cab-btns{flex-wrap:wrap;gap:4px}

/* sheet hyperlinks (js/links.js) */
canvas.lk-hover{cursor:pointer!important}
.lk-tip{position:fixed;z-index:9000;pointer-events:none;padding:4px 9px;border-radius:6px;background:rgba(13,16,22,.88);color:#f1e3c4;font:600 12px/1.3 ui-sans-serif,system-ui,sans-serif;box-shadow:0 4px 14px rgba(0,0,0,.3)}
.lk-tip[hidden]{display:none}
.lk-back{position:absolute;left:14px;top:58px;z-index:40;padding:8px 14px;border-radius:999px;border:1px solid rgba(232,176,74,.45);background:rgba(13,16,22,.78);color:#f1e3c4;font:600 13px/1 ui-sans-serif,system-ui,sans-serif;cursor:pointer;backdrop-filter:blur(6px)}
.lk-back:hover{background:rgba(13,16,22,.92)}
.lk-back[hidden]{display:none}
/* zoom / pan viewer for renders (js/zoomview.js): the Grade dialog and the full-size lightbox */
.rg-view{position:relative;padding:0;overflow:hidden}
.rg-zoom{position:absolute;right:10px;bottom:10px;display:flex;gap:6px;align-items:center;padding:4px 6px;border-radius:10px;background:rgba(11,14,19,.78);border:1px solid var(--line,#2a3140)}
.zv-pct{min-width:48px;text-align:right;font:600 11.5px var(--mono,monospace);color:var(--mut,#9aa3b2)}
.zv-lightbox{position:fixed;inset:0;z-index:950;display:flex;flex-direction:column;background:#0b0e13}
.zv-bar{display:flex;align-items:center;gap:8px;padding:8px 12px;border-bottom:1px solid var(--line,#2a3140);flex-wrap:wrap}
.zv-cap{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:600}
.zv-host{flex:1;min-height:0;position:relative}
.zv-tip{position:absolute;left:10px;bottom:10px;padding:3px 8px;border-radius:6px;background:rgba(11,14,19,.8);color:#dfe6ee;font:600 11px var(--mono,monospace);pointer-events:none;white-space:pre}
.zv-bar .mbtn.on,.rg-zoom .mbtn.on{background:rgba(216,165,90,.16);border-color:var(--accent,#d8a55a);color:var(--accent,#d8a55a)}
.zv-cmp{padding:4px 6px;border-radius:8px;border:1px solid var(--line,#2a3140);background:transparent;color:inherit;font:inherit}
/* local versions (js/cloud/safety.js) */
.hist-card{width:min(760px,100%);max-height:min(80vh,760px)}
/* Version history (js/cloud/historypanel.js): a centred dialog, a full-screen sheet on a phone */
.hp-wrap{position:fixed;inset:0;z-index:9500;background:rgba(6,8,10,.72);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);display:flex;align-items:center;justify-content:center;padding:18px}
.hp-card{width:min(880px,100%);height:min(86vh,820px);max-height:none}
.hp-bar{display:flex;align-items:center;gap:10px;padding:8px 16px;border-bottom:1px solid var(--line,#2a3140);flex-wrap:wrap}
.hp-note{color:var(--mut,#9aa3b2);font-size:12px}
.hp-row{align-items:flex-start;flex-wrap:wrap}
.hp-row.pinned{border-color:var(--accent,#d8a55a)}
.hp-row .hist-t b{font-weight:600;font-size:13px;display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.hp-badge{font-size:10px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;padding:1px 6px;border-radius:6px;border:1px solid var(--line,#2a3140);color:var(--mut,#9aa3b2)}
.hp-badge.cloud{color:#7fb6ff;border-color:rgba(127,182,255,.4)}
.hp-badge.local{color:#b9d68a;border-color:rgba(185,214,138,.4)}
.hp-pin{color:var(--accent,#d8a55a)}
.hp-diff{font-style:italic}
.hp-acts{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
@media (max-width:640px){.hp-wrap{padding:0}.hp-card{width:100%;height:100%;border-radius:0}.hp-acts{width:100%}}
.hist-body{overflow:auto;padding:8px 16px 16px;display:flex;flex-direction:column;gap:6px}
.hist-row{display:flex;align-items:center;gap:8px;padding:8px 10px;border:1px solid var(--line,#2a3140);border-radius:10px}
.hist-t{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.hist-t span{color:var(--mut,#9aa3b2);font-size:12px}
/* the version checker (js/cloud/safety.js askVersion) */
.vc-box{width:min(460px,calc(100vw - 32px))}
.vc-v{font-size:12.5px;padding:6px 10px;border-radius:8px;margin:2px 0}
.vc-d { font-size: 11.5px; opacity: .72; margin-top: 3px; line-height: 1.35; }
.vc-new{background:rgba(80,170,110,.14);border:1px solid rgba(80,170,110,.45)}
.vc-old{background:rgba(216,165,90,.12);border:1px solid rgba(216,165,90,.45)}
.vc-q{font-size:12.5px;color:var(--mut,#9aa3b2);margin:6px 0 2px}
.vc-later{align-self:center;margin-top:4px;font-size:12px}

/* 3D navigation feedback (js/nav3d.js): the lens / focus chip and the focus ring */
.nav-chip{position:absolute;left:50%;top:14px;transform:translate(-50%,-6px);z-index:40;padding:5px 12px;border-radius:999px;background:rgba(11,14,19,.82);color:#e8edf3;font:600 12px/1.3 var(--mono,monospace);pointer-events:none;opacity:0;transition:opacity .18s,transform .18s;border:1px solid rgba(255,255,255,.12);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.nav-chip.on{opacity:1;transform:translate(-50%,0)}
.nav-ring{position:absolute;z-index:40;width:44px;height:44px;margin:-22px 0 0 -22px;border-radius:50%;border:2px solid var(--accent,#d8a55a);pointer-events:none;animation:navRing .7s ease-out forwards}
@keyframes navRing{0%{transform:scale(.4);opacity:1}100%{transform:scale(1.5);opacity:0}}

/* the Undo chip (App.toastUndo): the toast takes clicks while it offers Undo */
.toast.has-undo{pointer-events:auto;display:flex;align-items:center;gap:12px}
.toast .toast-undo{border:0;background:none;color:var(--accent,#d8a55a);font:inherit;font-weight:700;cursor:pointer;padding:2px 4px;border-radius:6px}
.toast .toast-undo:hover{background:rgba(216,165,90,.15)}
/* Split a GLB into library pieces (splitdialog.js) */
.sp-card{width:min(760px,100%);height:min(780px,100%)}
.sp-body{flex:1;display:flex;flex-direction:column;gap:8px;padding:14px 16px;overflow:hidden;min-height:0}
.sp-list{flex:1;overflow:auto;border:1px solid var(--line,#444);border-radius:6px;min-height:120px}
.sp-row{display:flex;align-items:center;gap:8px;padding:3px 8px;font-size:12.5px}
.sp-row.on{background:rgba(120,160,255,.10)}.sp-row.dim{opacity:.45}
.sp-name{flex:1;min-width:0}.sp-lbl{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sp-n{color:var(--mut);font-family:Consolas,monospace;font-size:11.5px;white-space:nowrap}
.sp-foot{display:flex;gap:6px;flex-wrap:wrap}.sp-busy{min-height:1.2em}
.imp-split{display:flex;align-items:center;gap:10px;padding:6px 8px;border:1px dashed var(--line,#555);border-radius:6px}
.imp-split p{margin:0;flex:1}
/* the 3D view's bounding box, set in the view (areabox3d.js) */
.ab3d{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}
.ab3d .ab-grip{pointer-events:all;cursor:grab;touch-action:none}
.ab3d .ab-read{font:600 12px var(--mono,monospace);fill:#fff;paint-order:stroke;stroke:rgba(0,0,0,.75);stroke-width:3px}

/* walking settings: the accordion that unfolds from the walk icon on a long press (walkmenu.js) */
.wm-pop{position:fixed;z-index:200;width:268px;padding:10px 12px 8px;border-radius:12px;background:color-mix(in srgb,var(--panel,#1b1e24) 90%,transparent);border:1px solid var(--line,#333);box-shadow:0 14px 40px rgba(0,0,0,.45);backdrop-filter:blur(14px);color:var(--ink,#eee);font:12px var(--sans,system-ui);opacity:0;transform:translateY(8px) scale(.97);transform-origin:50% 100%;transition:opacity .2s ease,transform .22s cubic-bezier(.2,.8,.2,1)}
.wm-pop.on{opacity:1;transform:none}
.wm-title{font:600 13px var(--sans,system-ui);margin:0 2px 6px}
.wm-sec{border-top:1px solid var(--line,#333)}
.wm-head{display:flex;align-items:center;gap:6px;width:100%;padding:7px 2px;background:none;border:0;color:inherit;cursor:pointer;text-align:left}
.wm-head b{font-weight:600}.wm-chev{display:inline-block;width:10px;font-size:10px;opacity:.7;transition:transform .2s}
.wm-sec.open .wm-chev{transform:rotate(90deg)}
.wm-body{display:grid;grid-template-rows:0fr;transition:grid-template-rows .25s ease}
.wm-sec.open .wm-body{grid-template-rows:1fr}
.wm-inner{overflow:hidden;min-height:0}
.wm-row{display:grid;grid-template-columns:70px minmax(0,1fr) 54px;align-items:center;gap:8px;padding:2px 2px 4px}
.wm-lab{opacity:.75}.wm-val{text-align:right;font:600 11.5px var(--mono,monospace)}
.wm-range{width:100%;accent-color:var(--accent,#e0a548)}
.wm-chips{display:flex;flex-wrap:wrap;gap:5px;padding:0 2px 8px}
.wm-chip{padding:3px 8px;border-radius:999px;border:1px solid var(--line,#444);background:none;color:inherit;font-size:11px;cursor:pointer}
.wm-chip:hover{border-color:var(--accent,#e0a548);color:var(--accent,#e0a548)}
.wm-hint{margin:2px 2px 2px;font-size:10.5px;opacity:.6;line-height:1.35}

/* a saved render laid over the 3D view when you click its floating plane (renderplanes.js) */
.rpl-overlay{position:absolute;inset:0;z-index:20;overflow:hidden;opacity:0;transition:opacity .8s ease;cursor:pointer;background:transparent}
.rpl-overlay.on{opacity:1}
.rpl-overlay img{position:absolute;top:0;bottom:0;left:50%;height:100%;width:auto;max-width:none;transform:translateX(-50%);user-select:none;-webkit-user-drag:none}
.rpl-chip{position:absolute;left:50%;bottom:16px;transform:translateX(-50%);padding:5px 14px;border-radius:999px;background:rgba(14,18,26,.72);color:#e8eef6;font:600 12px system-ui,sans-serif;pointer-events:none;white-space:nowrap}

/* tap to walk: the ring where you tapped (walk3d.js) */
.walk-tap{position:absolute;z-index:25;width:34px;height:34px;margin:-17px 0 0 -17px;border-radius:50%;border:3px solid #fff;box-shadow:0 0 0 2px rgba(0,0,0,.35),0 0 14px rgba(255,255,255,.6);pointer-events:none;animation:walk-tap .85s ease-out forwards}
@keyframes walk-tap{from{transform:scale(.3);opacity:1}to{transform:scale(1.5);opacity:0}}
.wm-check{display:flex;align-items:center;gap:8px;margin:6px 2px 2px;font-size:12px;cursor:pointer}

/* the plan window marquee (planwindow.js) */
.pw-chip{position:absolute;left:50%;top:64px;transform:translateX(-50%);z-index:40;display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:8px 10px;width:max-content;max-width:min(620px,calc(100% - 40px));padding:8px 12px;border-radius:12px;background:rgba(14,18,26,.86);color:#e8eef6;font:12px system-ui,sans-serif;box-shadow:0 8px 26px rgba(0,0,0,.4)}
.pw-chip b{font-weight:600;white-space:nowrap}.pw-chip span{opacity:.8;flex:1 1 280px;min-width:0}
.pw-chip button{padding:4px 11px;border-radius:8px;border:1px solid rgba(255,255,255,.25);background:rgba(255,255,255,.08);color:inherit;cursor:pointer;font:600 12px system-ui,sans-serif}
.pw-chip button:hover{background:rgba(240,168,72,.3);border-color:#f0a830}

/* Export sheets… (exportdialog.js) */
.ex-card{width:min(860px,100%);height:min(640px,100%)}
.ex-body{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:16px;padding:12px 14px;min-height:0;flex:1}
.ex-left,.ex-right{display:flex;flex-direction:column;gap:6px;min-height:0;overflow:auto}
.ex-quick{display:flex;gap:6px;flex-wrap:wrap}
.ex-list{display:flex;flex-direction:column;gap:2px;overflow:auto;border:1px solid var(--line);border-radius:10px;padding:6px;flex:1}
.ex-group{font-size:10px;letter-spacing:.09em;text-transform:uppercase;color:var(--mut);margin:8px 4px 2px}
.ex-row{display:flex;align-items:center;gap:8px;padding:5px 8px;border-radius:8px;cursor:pointer}
.ex-row:hover{background:rgba(127,127,127,.12)}.ex-row.on{background:rgba(80,140,255,.14)}
.ex-name{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ex-sub{color:var(--mut);font-size:11.5px}
.ex-opt{display:flex;gap:8px;align-items:flex-start;padding:8px 10px;border:1px solid var(--line);border-radius:10px;cursor:pointer}
.ex-opt.on{border-color:#5a8cff;background:rgba(80,140,255,.1)}
.ex-opt div{display:flex;flex-direction:column;gap:2px}
.ex-go{margin-top:10px}
@media (max-width:700px){.ex-body{grid-template-columns:1fr;overflow:auto}}

/* what does nothing on this kind of board is hidden (Scene._bkind sets body[data-bkind]) */
body[data-bkind="plan"] .tool[data-g="sheet"]{display:none}
body[data-bkind="sheet"] .tool[data-g="arch"],body[data-bkind="sheet"] .tool-sep[data-g="arch"]{display:none}
body[data-bkind="sheet"] #st-rr-material,body[data-bkind="sheet"] #st-rr-sun{display:none}
body[data-bkind="sheet"] #st-rr-plan,body[data-bkind="3d"] #st-rr-plan,body[data-bkind="sheet"] #st-rr-globe,body[data-bkind="plan"] #st-rr-globe,body[data-bkind="sheet"] #st-rr-lens,body[data-bkind="sheet"] #st-rr-eye,body[data-bkind="sheet"] #st-rr-sparkle,body[data-bkind="sheet"] #st-rr-bake,body[data-bkind="sheet"] #st-rr-grade,
body[data-bkind="plan"] #st-rr-lens,body[data-bkind="plan"] #st-rr-eye,body[data-bkind="plan"] #st-rr-sparkle,body[data-bkind="plan"] #st-rr-bake,body[data-bkind="plan"] #st-rr-grade{display:none}

/* 3D dimensions (dim3d.js) */
.d3d{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}
.d3d .d3-hit,.d3d .d3-text[data-id]{pointer-events:stroke;cursor:pointer}
.d3d .d3-text[data-id]{pointer-events:all}
.d3d .d3-grip{pointer-events:all;cursor:grab;touch-action:none}
.d3d .d3-text{font-family:var(--mono,monospace);font-weight:700;paint-order:stroke;stroke:rgba(255,255,255,.88);stroke-width:4px;stroke-linejoin:round}
.d3-pop{position:absolute;right:96px;top:64px;z-index:60;width:min(280px,calc(100% - 24px));display:flex;flex-direction:column;gap:6px;padding:10px 12px;border-radius:12px;background:rgba(18,22,30,.9);backdrop-filter:blur(8px);color:#e8eef6;font:12px system-ui,sans-serif;box-shadow:0 10px 30px rgba(0,0,0,.45)}
.d3-head{display:flex;align-items:center;gap:8px}.d3-head b{font-size:13px}.d3-len{flex:1;opacity:.75}
.d3-row{display:grid;grid-template-columns:104px 1fr;align-items:center;gap:8px;color:#aab4c2}
.d3-row input[type=color]{width:44px;height:24px;padding:0;border:0;background:none}
@media (max-width:760px){.d3-pop{left:50%;right:auto;top:auto;bottom:86px;transform:translateX(-50%)}}
.d3-btns{display:flex;gap:8px;margin-top:4px}
/* Assembly editor (js/asmeditor.js) + the placement Properties panel (js/placepanel.js) */
.asm-pane{overflow:auto;max-height:62vh}
.asm-table input.numbox{width:5.2em}
.asm-table td.asm-box{white-space:nowrap}
.asm-table td.asm-box input{width:4.2em;margin-right:2px}
.asm-table tr.asm-pset td{background:color-mix(in srgb,var(--line) 25%,transparent)}
.asm-node code{font-size:11px}.asm-node small{color:var(--mut)}
.asm-json{width:100%;min-width:14em;box-sizing:border-box;font:11px/1.35 ui-monospace,monospace;resize:vertical}
.em-list input[type=search]{width:100%;box-sizing:border-box;margin-bottom:6px}
.pp-type{display:flex;gap:4px;align-items:center;min-width:0}.pp-type select{flex:1;min-width:0}
.pp-group{font-size:11px;letter-spacing:.04em;text-transform:uppercase;color:var(--mut)}
.asm-wrap .em-split{grid-template-columns:minmax(0,1fr) 360px}
.asm-wrap .em-canvas{width:100%}
.asm-wrap .asm-pane{max-height:none;min-height:0}
@media (max-width:1100px){.asm-wrap .em-split{grid-template-columns:1fr}}
/* A8: the wiring graph + tables (js/asmgraph.js) */
.asm-wrap .em-split.asm-full{grid-template-columns:1fr}.asm-wrap .asm-full .em-preview{display:none}
.ag-wrap{overflow:auto;border:1px solid var(--line);border-radius:8px;background:var(--bg);max-height:52vh}
.ag-svg{display:block;font:11px system-ui,sans-serif}
.ag-box{fill:var(--panel);stroke:var(--line)}
.ag-node{cursor:pointer}.ag-node.on .ag-box{stroke:var(--accent);stroke-width:2}
.ag-input .ag-box{fill:color-mix(in srgb,var(--accent) 10%,var(--panel))}
.ag-derived .ag-box{fill:color-mix(in srgb,var(--accent2) 14%,var(--panel))}
.ag-nested .ag-box{fill:color-mix(in srgb,var(--good) 10%,var(--panel))}
.ag-light .ag-box{fill:color-mix(in srgb,#f2c94c 18%,var(--panel))}
.ag-check .ag-box{fill:color-mix(in srgb,var(--danger) 10%,var(--panel))}
.ag-state .ag-box,.ag-widget .ag-box,.ag-table .ag-box{fill:color-mix(in srgb,var(--mut) 12%,var(--panel))}
.ag-title{fill:var(--ink);font-weight:600}.ag-sub,.ag-pl{fill:var(--mut)}
.ag-edge{fill:none;stroke:color-mix(in srgb,var(--mut) 55%,transparent);stroke-width:1.3}
.ag-edge.hot{stroke:var(--accent);stroke-width:2.2}.ag-edge.drag{stroke:var(--accent);stroke-dasharray:4 3}
.ag-port{fill:var(--mut);stroke:var(--panel)}.ag-port.free{fill:var(--panel);stroke:var(--mut)}.ag-port.child{fill:var(--good)}
.ag-out{fill:var(--accent);stroke:var(--panel);stroke-width:2;cursor:crosshair}
.ag-detail{margin-top:8px}.ag-rows{display:grid;gap:4px;margin-top:6px}
.ag-row{display:grid;grid-template-columns:9em 1fr;gap:6px;align-items:center}.ag-row input{width:100%;box-sizing:border-box}
/* B2: a placement's handles in 3D (js/handles3d.js) */
.asm-hd{position:absolute;width:14px;height:14px;margin:-7px 0 0 -7px;border-radius:50%;pointer-events:auto;z-index:6;box-sizing:border-box}
.asm-hd.free{background:#1f6fff;border:2px solid #fff;box-shadow:0 0 0 1px rgba(0,0,0,.35);cursor:ew-resize}
.asm-hd.free.ax-z{cursor:ns-resize}.asm-hd.free:hover{transform:scale(1.3)}
.asm-hd.wired{width:10px;height:10px;margin:-5px 0 0 -5px;border-radius:2px;transform:rotate(45deg);background:rgba(242,163,58,.25);border:2px solid #f2a33a;cursor:not-allowed}
svg.asm-hd-lines{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible}
.asm-hd-read{position:absolute;pointer-events:none;z-index:7;background:rgba(20,22,26,.85);color:#fff;font:12px system-ui,sans-serif;padding:3px 7px;border-radius:6px;white-space:nowrap}
.ag-handle .ag-box{fill:color-mix(in srgb,#f2a33a 16%,var(--panel))}
.asm-w.sw{padding-left:26px;position:absolute}.asm-w.sw::before{content:'';position:absolute;left:8px;top:50%;width:10px;height:10px;margin-top:-5px;border-radius:50%;background:#555;box-shadow:inset 0 0 0 1px rgba(255,255,255,.35)}
.asm-w.sw.on{border-color:#f2c94c}.asm-w.sw.on::before{background:#ffd75a;box-shadow:0 0 8px 2px rgba(255,215,90,.8)}
.asm-w.ws-rounded{border-radius:6px}.asm-w.ws-square{border-radius:0}.asm-w.ws-circle{border-radius:50%;width:28px;padding:0;text-align:center}
.asm-w.ws-s{height:18px;font-size:10px;padding:0 7px}.asm-w.ws-l{height:32px;font-size:14px;padding:0 14px}.asm-w.ws-circle.ws-s{width:20px}.asm-w.ws-circle.ws-l{width:36px}
.asm-w.ws-notext.sw{padding-right:6px}.ag-col{display:flex;gap:4px;align-items:center}.ag-col input{width:42px;height:22px;padding:0}
/* B3: the node editor pane (js/nodeview.js in a SplitView pane) */
.sv-pane.is-graph .sv-cv,.sv-pane.is-graph .sv-hint,.sv-pane.is-graph .sv-label{display:none}
.sv-graph{position:absolute;inset:0;display:flex;flex-direction:column;background:var(--bg);z-index:1}
.nv-head{display:flex;gap:6px;align-items:center;padding:6px 8px;border-bottom:1px solid var(--line);background:var(--panel);padding-right:120px}
.nv-head .nv-pick{flex:1;min-width:0;max-width:280px}.nv-head .nv-pin.on{background:var(--accent);color:#111}
.nv-svg{flex:1;min-height:0;width:100%;cursor:grab;touch-action:none;user-select:none}.nv-svg:active{cursor:grabbing}
.nv-grip{fill:transparent;cursor:move}.ag-edge.drv{stroke-dasharray:5 4}
.nv-detail{max-height:38%;overflow:auto;padding:6px 10px;border-top:1px solid var(--line);background:var(--panel)}.nv-detail:empty{display:none}
.sv-pane.is-graph .sv-head{z-index:2}.sv-pane.is-graph .sv-gut{z-index:3}
.ag-port.snap{fill:var(--accent);stroke:#fff;stroke-width:2;r:7}
.ag-vset .ag-box{fill:color-mix(in srgb,#b15cff 14%,var(--panel))}.pp-col{display:flex;gap:4px;align-items:center}.pp-col input{width:42px;height:24px;padding:0}
.nv-head .mini.on{background:var(--accent);color:#111}.ag-edge{opacity:.55}.ag-edge.hot,.ag-edge.pin{opacity:1;stroke:var(--accent);stroke-width:2}
.nv-svg.focus .ag-edge{opacity:.06}.nv-svg.focus .ag-edge.pin,.nv-svg.focus .ag-edge.hot{opacity:1}
/* B5: property controls (js/propcontrols.js) + Design mode (js/placepanel.js) */
.pc-slider,.pc-stepper,.pc-dialwrap,.pc-seg,.pc-swatches,.pc-handle{display:flex;align-items:center;gap:6px;min-width:0;flex-wrap:wrap}
.pc-range{flex:1;min-width:80px}.pc-val{min-width:3em;text-align:right;font-variant-numeric:tabular-nums}.pc-stepper .pc-val{text-align:center}
.pc-dial{width:40px;height:40px;cursor:grab;touch-action:none}.pc-dial-ring{fill:var(--panel2,#1b1f27);stroke:var(--line);stroke-width:2}.pc-dial-hand{stroke:var(--accent);stroke-width:3;stroke-linecap:round}
.pc-toggle{width:38px;height:20px;border-radius:999px;border:1px solid var(--line);background:var(--panel2,#2a2f39);position:relative;padding:0;cursor:pointer}
.pc-toggle span{position:absolute;top:2px;left:2px;width:14px;height:14px;border-radius:50%;background:#bbb;transition:left .15s}.pc-toggle.on{background:var(--accent)}.pc-toggle.on span{left:20px;background:#fff}
.pc-seg .mini.on{background:var(--accent);color:#111}.pc-chip{width:22px;height:22px;border-radius:6px;border:2px solid transparent;padding:0;cursor:pointer;box-shadow:inset 0 0 0 1px rgba(0,0,0,.25)}.pc-chip.on{border-color:var(--accent)}
.pc-hint{font-size:11px;color:var(--mut)}.pp-design{display:flex;gap:6px;flex-wrap:wrap}.pp-design .mini.on{background:var(--accent);color:#111}
.pp-author{display:grid;grid-template-columns:1.2fr .8fr 1fr auto;gap:4px;padding:2px 0 6px;border-bottom:1px dashed var(--line)}.pp-author input,.pp-author select{min-width:0;width:100%;box-sizing:border-box;font-size:11px}
/* 3D snaps (js/snap3d.js) */
.snap3d-mark{position:absolute;z-index:40;pointer-events:none;transform:translate(-50%,-50%);display:flex;align-items:center;gap:6px}
.snap3d-mark b{display:grid;place-items:center;width:18px;height:18px;color:#f5d90a;font-size:15px;text-shadow:0 0 3px #000,0 0 2px #000}
.snap3d-mark span{transform:translate(10px,-14px);background:rgba(20,22,26,.86);color:#f5d90a;font:11px system-ui,sans-serif;padding:2px 6px;border-radius:5px;white-space:nowrap}
.snap3d-mark[hidden]{display:none}
.nh-snap{position:relative}.nh-snapmode{position:absolute;right:-2px;bottom:-3px;font:600 8px system-ui;color:var(--accent)}
.nh-snapmore{position:absolute;right:-7px;top:-4px;font-size:9px;line-height:1;padding:2px;opacity:.75;cursor:pointer}.nh-snapmore:hover{opacity:1;color:var(--accent)}
/* Focus (js/focus.js): the node in focus, the part outlined in 3D, the handle lit */
.ag-node.focus .ag-box{stroke:#f2a33a;stroke-width:3}
svg.asm-focus{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible}
.asm-hd.focus{box-shadow:0 0 0 3px #f2a33a,0 0 10px 2px rgba(242,163,58,.8)}
/* D2: node editor groups, menus, multi-pick */
.nv-ghead,.nv-gbox .nv-grip{cursor:move}.ag-node.multi .ag-box{stroke:var(--accent);stroke-dasharray:4 3;stroke-width:2}
.nv-menu{position:absolute;z-index:20;min-width:190px}.nv-colors{display:flex;gap:4px;padding:6px 8px}.nv-chip{width:18px;height:18px;border-radius:5px;border:1px solid var(--line);padding:0;font-size:10px;cursor:pointer;background:var(--panel)}
/* D3: the Modify stack (placements: js/placepanel.js · morphs: js/poly/stackpanel.js) */
.pp-stack{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:8px;overflow:hidden;max-height:240px;overflow-y:auto;background:var(--bg)}
.pp-srow{all:unset;cursor:pointer;padding:3px 8px;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.pp-srow:hover{background:color-mix(in srgb,var(--accent) 12%,transparent)}
.pp-srow.on{background:var(--accent);color:#111}.pp-obj{font-weight:600}.pp-lv{color:var(--mut);font-size:11px;text-transform:uppercase;letter-spacing:.03em}
.pp-sub{width:100%}.stack-level .mini{margin-left:22px}.stack-tw{min-width:22px}
/* the Properties panel, readable at any width (owner 2026-10-16: "unreadable, unusable") */
.pp-group{margin:10px 0 2px;font-size:10.5px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--mut);border-bottom:1px solid var(--line);padding-bottom:3px}
.pp-design{display:grid;grid-template-columns:1fr 1fr;gap:6px}.pp-design .mini{width:100%;height:28px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pp-stack{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:8px;max-height:260px;overflow-y:auto;background:var(--bg);padding:3px 0}
.pp-stack .pp-srow{all:unset;box-sizing:border-box;display:flex;align-items:center;gap:6px;width:100%;min-height:26px;padding:2px 8px;cursor:pointer;font-size:12px;line-height:1.3;color:var(--ink);border-left:3px solid transparent}
.pp-stack .pp-srow:hover{background:color-mix(in srgb,var(--accent) 10%,transparent)}
.pp-stack .pp-srow.on{background:color-mix(in srgb,var(--accent) 20%,transparent);border-left-color:var(--accent);color:var(--ink);font-weight:600}
.pp-stack .pp-srow:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
.pp-stack .pp-obj{font-weight:600;min-height:30px}
.pp-stack .pp-lv{min-height:24px;font-size:10.5px;letter-spacing:.05em;text-transform:uppercase;color:var(--mut);margin-top:2px}
.pp-stack .pp-tx{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pp-stack .pp-ic{width:14px;text-align:center;color:var(--mut);flex:none}.pp-stack .pp-srow.on .pp-ic{color:var(--accent)}
.pp-stack .pp-tw{width:10px;flex:none}.pp-stack .pp-n{flex:none;font-size:10px;padding:0 6px;border-radius:999px;background:var(--line);color:var(--mut);letter-spacing:0}
.pp-back{all:unset;box-sizing:border-box;cursor:pointer;display:block;width:100%;padding:6px 8px;border-radius:7px;font-size:12px;color:var(--accent);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pp-back:hover{background:color-mix(in srgb,var(--accent) 12%,transparent)}
.pp-head{display:flex;align-items:baseline;gap:8px;margin-top:6px}.pp-head b{font-size:14px;color:var(--ink);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pp-kind{font-size:10px;text-transform:uppercase;letter-spacing:.05em;color:var(--mut);flex:none}
.pp-sub{display:block}.pp-sub>b{display:none}
.pp-sub .ag-rows{display:flex;flex-direction:column;gap:6px;margin:0}
.pp-sub .ag-row{display:grid;grid-template-columns:minmax(42px,30%) minmax(0,1fr);gap:8px;align-items:center}
.pp-sub .ag-row>span{font-size:11.5px;color:var(--mut);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pp-sub .ag-row input,.pp-sub .ag-row select{width:100%;min-width:0;height:30px;box-sizing:border-box;font-family:var(--mono, ui-monospace, monospace);font-size:12px;background:var(--bg);border:1px solid var(--line);border-radius:7px;color:var(--ink);padding:0 8px}
.pp-sub .hint{font-size:11px;line-height:1.4;margin:4px 0 0}
.pp-author{grid-template-columns:minmax(0,1.3fr) minmax(0,.8fr) minmax(0,1fr) 28px}
.sel3d-warn{white-space:normal}

/* ── the Create panel of a 3D view (createpanel.js) — the plan's drawing tools stay with plan views ── */
.cp{display:none}
body.ov3d #panel-tools .cp{display:block}
body.ov3d #panel-tools #toolbar, body.ov3d #panel-tools label.sticky{display:none}
.cp-tabs{display:grid;grid-template-columns:repeat(6,1fr);gap:2px;margin:2px 0 6px}
.cp-tab{min-height:36px;border:1px solid var(--line);background:var(--panel2,transparent);color:inherit;border-radius:6px;font-size:16px;cursor:pointer}
.cp-tab.on{background:var(--accent);color:#fff;border-color:var(--accent)}
.cp-cat{font-weight:600;margin:2px 0 6px}
.cp-sub{width:100%;margin-bottom:6px}
.cp-roll{border-top:1px solid var(--line);padding:4px 0}
.cp-roll>summary{cursor:pointer;font-weight:600;padding:4px 0;min-height:28px;display:flex;align-items:center}
.cp-grid{display:grid;grid-template-columns:1fr 1fr;gap:4px;margin:4px 0}
.cp-type{min-height:36px;padding:4px 6px;border:1px solid var(--line);border-radius:6px;background:transparent;color:inherit;cursor:pointer;text-align:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cp-type.on{background:var(--accent);color:#fff;border-color:var(--accent)}
.cp-check{display:flex;align-items:center;gap:6px;min-height:28px}
.cp-row{display:flex;gap:6px;align-items:center}
.cp-name{flex:1;min-width:0;min-height:32px}
.cp-color{width:40px;height:32px;padding:0;border:1px solid var(--line);border-radius:6px;background:none;position:static}
.cp-radio{display:flex;gap:12px;flex-wrap:wrap}.cp-radio label{display:flex;align-items:center;gap:4px;min-height:28px}
.cp-fields{display:grid;grid-template-columns:1fr;gap:3px;margin:4px 0}
.cp-field{display:grid;grid-template-columns:minmax(0,1fr) 96px;align-items:center;gap:6px}
.cp-field>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cp-field input[type=number]{width:100%;min-height:30px}
.cp-go{width:100%;min-height:36px;margin-top:4px}
.cp-note{opacity:.75;font-size:12px;margin:4px 0}
#stage.creating3d canvas{cursor:crosshair}
.c3d-ov{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:30;overflow:visible}
.c3d-ov polyline{fill:none;stroke:#ffb020;stroke-width:1.5;stroke-linejoin:round}
.c3d-snap{position:absolute;pointer-events:none;z-index:31;transform:translate(8px,-22px);font:11px/1.2 system-ui,sans-serif;background:rgba(20,24,30,.85);color:#ffd47a;padding:2px 5px;border-radius:4px;white-space:nowrap}
.c3d-snap:empty{display:none}
.c3d-snap::before{content:'';position:absolute;left:-12px;top:16px;width:8px;height:8px;border:2px solid #ffb020;border-radius:2px}

/* ── a 3D view has no 2D scale and no plan snaps (owner 2026-10-17): its snaps are the magnet's (Snap3D) ── */
body.ov3d .bsize-row.scale, body.ov3d .bsize-row.scale2{display:none}
body.ov3d .statusbar .sb-left{display:none}