:root{
  --bg:#181c22; --bg2:#1f242c; --bg3:#262d37; --line:#333b47;
  --ink:#dfe6ef; --dim:#8f9bab; --dim2:#6b7686;
  --accent:#2ea3f2; --accent2:#0d7fc4;
  --ok:#3fbf6f; --warn:#e8a33d; --err:#e2564a;
  --canvas:#11151a;
  --h:34px;
  font-synthesis-weight:none;
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{
  background:var(--bg); color:var(--ink); overflow:hidden;
  font:12px/1.45 "Segoe UI",Inter,system-ui,-apple-system,sans-serif;
  -webkit-font-smoothing:antialiased;
  user-select:none;
}
button,input,select,textarea{font:inherit;color:inherit}

/* ---------- App frame ---------- */
#app{display:flex;flex-direction:column;height:100vh}

.titlebar{
  height:30px;display:flex;align-items:center;gap:12px;padding:0 10px;
  background:linear-gradient(#232a33,#1b2027); border-bottom:1px solid var(--line);
}
.logo{display:flex;align-items:center;gap:7px;font-weight:700;letter-spacing:.3px}
.logo .mark{
  width:16px;height:16px;border-radius:3px;
  background:conic-gradient(from 200deg,var(--accent),#7ad0ff,var(--accent2),var(--accent));
}
.logo small{font-weight:400;color:var(--dim);letter-spacing:0}
.titlebar .doc{color:var(--dim);margin-left:6px}
.titlebar .spacer{flex:1}
.tb-btn{
  background:none;border:1px solid transparent;border-radius:4px;
  padding:3px 9px;color:var(--dim);cursor:pointer
}
.tb-btn:hover{background:var(--bg3);color:var(--ink);border-color:var(--line)}

/* ---------- Ribbon ---------- */
.ribbon{background:var(--bg2);border-bottom:1px solid var(--line)}
.ribbon-tabs{display:flex;gap:2px;padding:0 8px;border-bottom:1px solid var(--line)}
.rtab{
  padding:6px 14px;color:var(--dim);cursor:pointer;border:none;background:none;
  border-bottom:2px solid transparent;font-weight:500
}
.rtab:hover{color:var(--ink)}
.rtab.on{color:var(--accent);border-bottom-color:var(--accent)}
.ribbon-body{display:none;padding:8px 10px;gap:6px;align-items:stretch;min-height:74px}
.ribbon-body.on{display:flex}
.rgroup{
  display:flex;flex-direction:column;gap:5px;padding:0 12px 0 0;
  border-right:1px solid var(--line);margin-right:6px
}
.rgroup:last-child{border-right:none}
.rgroup .row{display:flex;gap:4px;align-items:center;flex-wrap:wrap}
.rgroup .lbl{font-size:10px;color:var(--dim2);text-transform:uppercase;letter-spacing:.7px}
.rbtn{
  display:flex;flex-direction:column;align-items:center;gap:3px;min-width:56px;
  padding:5px 7px;background:var(--bg3);border:1px solid var(--line);border-radius:5px;
  cursor:pointer;color:var(--ink);font-size:10.5px;transition:.12s
}
.rbtn:hover{border-color:var(--accent);background:#2c3743}
.rbtn.on{background:var(--accent2);border-color:var(--accent);color:#fff}
.rbtn svg{width:17px;height:17px;stroke:currentColor;fill:none;stroke-width:1.6}
.rbtn.wide{flex-direction:row;min-width:0;gap:6px}
.rbtn:disabled{opacity:.4;cursor:not-allowed}

/* ---------- Main split ---------- */
.main{flex:1;display:flex;min-height:0}
.panel{
  width:250px;background:var(--bg2);border-right:1px solid var(--line);
  display:flex;flex-direction:column;min-height:0
}
.panel.right{border-right:none;border-left:1px solid var(--line);width:290px}
.pane-h{
  height:26px;display:flex;align-items:center;justify-content:space-between;
  padding:0 9px;background:var(--bg3);border-bottom:1px solid var(--line);
  font-size:10.5px;font-weight:600;text-transform:uppercase;letter-spacing:.8px;color:var(--dim)
}
.pane-b{overflow:auto;padding:8px;flex:1;min-height:0}
.pane-b.tight{padding:0}

.stage{flex:1;position:relative;background:var(--canvas);min-width:0;overflow:hidden}
#plan{position:absolute;inset:0;width:100%;height:100%;display:block}

/* ---------- Floating 3D Building window ---------- */
.win3d{
  position:absolute;left:8%;top:5%;width:76%;height:82%;display:none;
  flex-direction:column;background:var(--bg2);border:1px solid #454f5c;border-radius:6px;
  box-shadow:0 26px 70px rgba(0,0,0,.7);z-index:20;overflow:hidden;min-width:360px;min-height:240px
}
.win3d.on{display:flex}
.win3d.max{left:0;top:0;width:100%;height:100%;border-radius:0}
.win3d-bar{
  height:24px;display:flex;align-items:center;gap:6px;padding:0 4px 0 9px;cursor:move;
  background:linear-gradient(#2c3949,#212a35);border-bottom:1px solid var(--line);font-size:11px
}
.win3d-bar .t{color:var(--ink)}
.win3d-bar .spacer{flex:1}
.wbtn{background:none;border:none;color:var(--dim);cursor:pointer;padding:2px 7px;border-radius:3px;font-size:10px}
.wbtn:hover{background:#3a4553;color:var(--ink)}
#win3dClose:hover{background:#c0392b;color:#fff}
.win3d-menu{display:flex;gap:2px;padding:2px 5px;background:var(--bg3);border-bottom:1px solid var(--line)}
.wm{padding:3px 9px;font-size:11px;color:var(--dim);cursor:pointer;border-radius:3px;position:relative}
.wm:hover{background:#39424f;color:var(--ink)}
.wmenu{
  display:none;position:absolute;left:0;top:100%;background:var(--bg2);border:1px solid var(--line);
  border-radius:5px;min-width:120px;z-index:5;box-shadow:0 10px 26px rgba(0,0,0,.5);padding:3px
}
.wm.open .wmenu{display:block}
.wmenu div{padding:5px 10px;font-size:11px;color:var(--ink);border-radius:3px;cursor:pointer}
.wmenu div:hover{background:var(--accent2)}
.win3d-body{flex:1;display:flex;min-height:0}
.win3d-side{
  width:168px;background:var(--bg2);border-right:1px solid var(--line);overflow:auto;
  padding:6px;flex:none
}
.w3h{font-size:9.5px;text-transform:uppercase;letter-spacing:.6px;color:var(--dim);margin-bottom:5px}
.win3d-canvas{flex:1;position:relative;min-width:0;background:#0d1116}
#view3d{position:absolute;inset:0;width:100%;height:100%;display:block}
.win3d-foot{
  height:20px;display:flex;align-items:center;gap:10px;padding:0 9px;background:#0d1116;
  border-top:1px solid var(--line);font-size:10px;color:#3fbf6f
}
.win3d-foot .spacer{flex:1}
.f3row{display:flex;align-items:center;gap:6px;padding:3px 4px;border-radius:3px;font-size:11px;cursor:pointer}
.f3row:hover{background:var(--bg3)}
.f3row input{accent-color:var(--accent);cursor:pointer}
.f3row.on{color:var(--accent)}

/* ---------- Layers rows ---------- */
.lrow2{display:flex;align-items:center;gap:5px;padding:3px 5px;border-radius:3px;font-size:11px}
.lrow2:hover{background:var(--bg3)}
.lrow2 .nm{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lrow2 .ic{width:16px;text-align:center;cursor:pointer;opacity:.55;font-size:11px;user-select:none}
.lrow2 .ic:hover{opacity:1}
.lrow2 .ic.off{opacity:.16}
.lrow2.hidden .nm{color:var(--dim2);text-decoration:line-through}

/* ---------- Catalog tree ---------- */
.cat-search{
  width:100%;background:var(--bg3);border:1px solid var(--line);border-radius:4px;
  padding:5px 8px;margin-bottom:7px;outline:none
}
.cat-search:focus{border-color:var(--accent)}
.cgroup{margin-bottom:3px}
.cgroup>summary{
  cursor:pointer;padding:4px 5px;border-radius:4px;color:var(--dim);
  font-weight:600;font-size:11px;list-style:none;display:flex;align-items:center;gap:5px
}
.cgroup>summary::-webkit-details-marker{display:none}
.cgroup>summary::before{content:"▸";transition:.15s;font-size:9px}
.cgroup[open]>summary::before{transform:rotate(90deg)}
.cgroup>summary:hover{background:var(--bg3);color:var(--ink)}
.citem{
  display:flex;align-items:center;gap:7px;padding:5px 6px 5px 16px;border-radius:4px;
  cursor:grab;color:var(--ink);border:1px solid transparent
}
.citem:hover{background:var(--bg3);border-color:var(--line)}
.citem.on{background:var(--accent2);border-color:var(--accent)}
.citem .dot{width:8px;height:8px;border-radius:50%;flex:none}
.citem .nm{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11px}
.citem .mt{font-size:9.5px;color:var(--dim2)}
.citem.on .mt{color:#cfe8fa}

/* ---------- Floors ---------- */
.floor{
  display:flex;align-items:center;gap:7px;padding:6px 8px;border-radius:4px;cursor:pointer;
  border:1px solid transparent
}
.floor:hover{background:var(--bg3)}
.floor.on{background:var(--accent2);border-color:var(--accent)}
.floor .nm{flex:1;font-weight:500}
.floor .ct{font-size:9.5px;color:var(--dim2)}
.floor.on .ct{color:#cfe8fa}
.floor .x{opacity:0;color:var(--dim);padding:0 3px;border:none;background:none;cursor:pointer}
.floor:hover .x{opacity:1}
.floor .x:hover{color:var(--err)}

/* ---------- Properties ---------- */
.prop{display:flex;align-items:center;gap:8px;margin-bottom:6px}
.prop label{width:88px;color:var(--dim);flex:none;font-size:11px}
.prop input,.prop select{
  flex:1;min-width:0;background:var(--bg3);border:1px solid var(--line);border-radius:4px;
  padding:4px 6px;outline:none
}
.prop input:focus,.prop select:focus{border-color:var(--accent)}
.prop input[type=range]{padding:0}
.prop .unit{color:var(--dim2);font-size:10px;width:26px;flex:none}
.sect{
  font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.8px;color:var(--dim2);
  margin:12px 0 7px;padding-bottom:4px;border-bottom:1px solid var(--line)
}
.sect:first-child{margin-top:0}
.empty{color:var(--dim2);text-align:center;padding:26px 12px;line-height:1.7}
.empty svg{width:30px;height:30px;stroke:var(--dim2);fill:none;stroke-width:1.2;opacity:.6;margin-bottom:8px}

.kv{display:flex;justify-content:space-between;padding:3px 0;font-size:11px}
.kv span:first-child{color:var(--dim)}
.kv b{font-weight:600;font-variant-numeric:tabular-nums}
.kv.big b{font-size:14px;color:var(--accent)}

/* ---------- Legend ---------- */
.legend{
  position:absolute;right:10px;bottom:34px;background:rgba(24,28,34,.94);
  border:1px solid var(--line);border-radius:6px;padding:8px 9px;backdrop-filter:blur(6px);
  min-width:120px;pointer-events:none
}
.legend h5{font-size:9.5px;text-transform:uppercase;letter-spacing:.7px;color:var(--dim);margin-bottom:6px}
.lrow{display:flex;align-items:center;gap:6px;font-size:10.5px;margin-bottom:2px;font-variant-numeric:tabular-nums}
.lsw{width:16px;height:9px;border-radius:2px;flex:none}

.hint{
  position:absolute;left:10px;top:48px;background:rgba(24,28,34,.94);border:1px solid var(--line);
  border-radius:6px;padding:6px 10px;color:var(--dim);font-size:11px;pointer-events:none;
  max-width:340px
}
.hint b{color:var(--accent)}

/* ---------- Status bar ---------- */
.status{
  height:22px;display:flex;align-items:center;gap:14px;padding:0 10px;
  background:var(--bg2);border-top:1px solid var(--line);color:var(--dim);font-size:11px;
  font-variant-numeric:tabular-nums
}
.status .spacer{flex:1}
.status b{color:var(--ink);font-weight:600}
.pill{padding:1px 7px;border-radius:9px;font-size:10px;font-weight:600}
.pill.ok{background:rgba(63,191,111,.16);color:var(--ok)}
.pill.warn{background:rgba(232,163,61,.16);color:var(--warn)}
.pill.err{background:rgba(226,86,74,.16);color:var(--err)}

/* ---------- Errors list ---------- */
.err-item{
  display:flex;gap:7px;padding:6px 7px;border-radius:4px;margin-bottom:4px;
  background:var(--bg3);border-left:2px solid var(--warn);cursor:pointer
}
.err-item.sev-err{border-left-color:var(--err)}
.err-item.sev-ok{border-left-color:var(--ok)}
.err-item:hover{background:#2f3742}
.err-item .t{flex:1;font-size:11px;line-height:1.5}
.err-item .t b{display:block;color:var(--ink)}
.err-item .t span{color:var(--dim)}

/* ---------- Modal ---------- */
.modal{
  position:fixed;inset:0;background:rgba(8,10,13,.66);display:none;align-items:center;
  justify-content:center;z-index:50;backdrop-filter:blur(3px)
}
.modal.on{display:flex}
.mbox{
  background:var(--bg2);border:1px solid var(--line);border-radius:9px;width:min(880px,92vw);
  max-height:86vh;display:flex;flex-direction:column;box-shadow:0 24px 70px rgba(0,0,0,.6)
}
.mbox header{
  display:flex;align-items:center;justify-content:space-between;padding:11px 14px;
  border-bottom:1px solid var(--line)
}
.mbox header h3{font-size:13px;font-weight:600}
.mbox .body{padding:14px;overflow:auto;user-select:text}
.mbox footer{padding:10px 14px;border-top:1px solid var(--line);display:flex;gap:8px;justify-content:flex-end}
.btn{
  background:var(--bg3);border:1px solid var(--line);border-radius:5px;padding:6px 14px;
  cursor:pointer;font-weight:500
}
.btn:hover{border-color:var(--accent)}
.btn.p{background:var(--accent2);border-color:var(--accent);color:#fff}
.btn.p:hover{background:var(--accent)}

table.rep{width:100%;border-collapse:collapse;font-size:11.5px}
table.rep th,table.rep td{padding:6px 9px;text-align:left;border-bottom:1px solid var(--line)}
table.rep th{color:var(--dim);font-size:10px;text-transform:uppercase;letter-spacing:.6px}
table.rep td.n,table.rep th.n{text-align:right;font-variant-numeric:tabular-nums}
table.rep tfoot td{font-weight:700;border-top:1px solid var(--accent);border-bottom:none}
.rep-h{display:flex;justify-content:space-between;align-items:end;margin-bottom:14px}
.rep-h h2{font-size:17px;font-weight:600}
.rep-h p{color:var(--dim)}
.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:16px}
.card{background:var(--bg3);border:1px solid var(--line);border-radius:6px;padding:9px 11px}
.card .k{font-size:9.5px;text-transform:uppercase;letter-spacing:.6px;color:var(--dim2)}
.card .v{font-size:18px;font-weight:650;margin-top:2px;font-variant-numeric:tabular-nums}

::-webkit-scrollbar{width:9px;height:9px}
::-webkit-scrollbar-track{background:var(--bg)}
::-webkit-scrollbar-thumb{background:#3a434f;border-radius:5px;border:2px solid var(--bg)}
::-webkit-scrollbar-thumb:hover{background:#4a5563}

/* ---------- Floor tab strip ---------- */
.floortabs{
  display:flex;align-items:stretch;height:24px;background:var(--bg);border-bottom:1px solid var(--line);
  overflow-x:auto;overflow-y:hidden;flex:none
}
.floortabs::-webkit-scrollbar{height:0}
.ftab{
  display:flex;align-items:center;gap:5px;padding:0 11px;font-size:11px;color:var(--dim);
  border-right:1px solid var(--line);cursor:pointer;white-space:nowrap;background:var(--bg2)
}
.ftab:hover{color:var(--ink)}
.ftab.on{background:var(--canvas);color:var(--accent);box-shadow:inset 0 -2px 0 var(--accent)}
.ftab svg{width:11px;height:11px;stroke:currentColor;fill:none;stroke-width:1.6}

/* ---------- Right dock tabs ---------- */
.dock{width:300px;background:var(--bg2);border-left:1px solid var(--line);display:flex;flex-direction:column;min-height:0}
.dock-tabs{display:flex;background:var(--bg3);border-bottom:1px solid var(--line);overflow-x:auto}
.dock-tabs::-webkit-scrollbar{height:0}
.dtab{
  padding:6px 10px;font-size:10.5px;color:var(--dim);cursor:pointer;white-space:nowrap;
  border-bottom:2px solid transparent
}
.dtab:hover{color:var(--ink)}
.dtab.on{color:var(--accent);border-bottom-color:var(--accent)}
.dock-body{flex:1;overflow:auto;min-height:0}
.dock-pane{display:none;padding:8px}
.dock-pane.on{display:block}
.dock-pane.tight{padding:0}

/* ---------- Tree (parts / systems / layers) ---------- */
.tree{font-size:11.5px}
.tnode{user-select:none}
.trow{
  display:flex;align-items:center;gap:5px;padding:3px 6px;border-radius:4px;cursor:pointer;
  color:var(--ink);border:1px solid transparent;position:relative
}
.trow:hover{background:var(--bg3)}
.trow.on{background:var(--accent2);border-color:var(--accent)}
.trow .tw{width:12px;text-align:center;color:var(--dim2);font-size:9px;flex:none}
.trow .ti{width:14px;height:14px;flex:none;color:var(--dim)}
.trow .ti svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:1.5}
.trow .tn{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.trow .tc{font-size:9px;color:var(--dim2)}
.trow .dot{width:8px;height:8px;border-radius:2px;flex:none}
.trow .eye{opacity:.5;cursor:pointer;padding:0 2px}
.trow .eye:hover{opacity:1}
.trow .eye.off{opacity:.2}
.tchildren{margin-left:12px;border-left:1px solid var(--line);padding-left:3px}
.tdrag{cursor:grab}

.cat-search{
  width:100%;background:var(--bg3);border:1px solid var(--line);border-radius:4px;
  padding:5px 8px;margin-bottom:7px;outline:none
}
.cat-search:focus{border-color:var(--accent)}

/* Part item in the flat catalog under a subcategory */
.citem{display:flex;align-items:center;gap:7px;padding:4px 6px 4px 8px;border-radius:4px;cursor:grab;border:1px solid transparent}
.citem:hover{background:var(--bg3);border-color:var(--line)}
.citem.on{background:var(--accent2);border-color:var(--accent)}
.citem .dot{width:8px;height:8px;border-radius:50%;flex:none}
.citem .nm{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11px}
.citem .mt{font-size:9px;color:var(--dim2)}
.citem.on .mt{color:#cfe8fa}
.citem .vd{font-size:8.5px;color:var(--dim2)}

/* ---------- Map-type selector row on canvas ---------- */
.maptypes{
  position:absolute;left:10px;top:10px;display:flex;gap:3px;background:rgba(24,28,34,.94);
  border:1px solid var(--line);border-radius:7px;padding:3px;backdrop-filter:blur(6px)
}
.mtbtn{padding:4px 9px;border-radius:5px;font-size:10.5px;color:var(--dim);cursor:pointer;border:none;background:none;white-space:nowrap}
.mtbtn:hover{color:var(--ink);background:var(--bg3)}
.mtbtn.on{background:var(--accent2);color:#fff}

/* ---------- Select Part dialog ---------- */
.selpart{display:grid;grid-template-columns:260px 1fr;gap:0;height:460px}
.selpart .col{display:flex;flex-direction:column;min-height:0;border-right:1px solid var(--line)}
.selpart .col:last-child{border-right:none}
.selpart .colh{padding:6px 9px;font-size:10px;text-transform:uppercase;letter-spacing:.6px;color:var(--dim);border-bottom:1px solid var(--line)}
.selpart .list{overflow:auto;flex:1}
.selpart .li{padding:5px 9px;cursor:pointer;font-size:11.5px;border-bottom:1px solid rgba(255,255,255,.03)}
.selpart .li:hover{background:var(--bg3)}
.selpart .li.on{background:var(--accent2);color:#fff}
.selpart .li .sub{font-size:9.5px;color:var(--dim2)}
.selpart .li.on .sub{color:#cfe8fa}
.pgrid{width:100%;border-collapse:collapse;font-size:11px}
.pgrid tr{border-bottom:1px solid rgba(255,255,255,.04)}
.pgrid td{padding:4px 8px}
.pgrid td:first-child{color:var(--dim);width:52%}
.pgrid .grp td{background:var(--bg3);color:var(--accent);font-weight:600;font-size:9.5px;text-transform:uppercase;letter-spacing:.5px}

/* ---------- Pattern viewer ---------- */
.patviz{background:var(--canvas);border:1px solid var(--line);border-radius:6px;padding:6px;margin-top:8px}

/* ---------- Capacity legend ---------- */
.caplegend{position:absolute;right:10px;top:10px;background:rgba(24,28,34,.95);border:1px solid var(--line);border-radius:7px;padding:9px;min-width:190px;pointer-events:none}
.caplegend h5{font-size:10px;text-transform:uppercase;letter-spacing:.6px;color:var(--dim);margin-bottom:7px}
.caprow{display:flex;align-items:center;gap:7px;font-size:10.5px;margin-bottom:3px;font-variant-numeric:tabular-nums}
.caprow .sw{width:14px;height:11px;border-radius:2px;flex:none}

/* mini toolbar buttons for panels */
.ptool{display:flex;gap:3px;padding:5px 7px;border-bottom:1px solid var(--line);flex-wrap:wrap}
.pt{background:var(--bg3);border:1px solid var(--line);border-radius:4px;padding:3px 8px;font-size:10.5px;cursor:pointer;color:var(--ink)}
.pt:hover{border-color:var(--accent)}
.pt.on{background:var(--accent2);border-color:var(--accent);color:#fff}

.weather{display:flex;align-items:center;gap:6px;color:var(--dim);font-size:11px}
.badge-count{background:var(--accent2);color:#fff;border-radius:9px;padding:0 5px;font-size:9px;margin-left:3px}

/* ---------- AI Copilot ---------- */
#paneAI{display:none;padding:8px}
#paneAI.on{display:flex;flex-direction:column;min-height:0}
.ai-head{margin-bottom:7px;line-height:1.5}
.ai-spark{color:#7ad0ff}
.ai-ta{
  width:100%;background:var(--bg3);border:1px solid var(--line);border-radius:5px;
  padding:6px 8px;outline:none;resize:vertical;min-height:38px;font-size:11.5px
}
.ai-ta:focus{border-color:var(--accent)}
.ai-chips{display:flex;gap:4px;flex-wrap:wrap;margin-bottom:8px}
.chip{
  background:var(--bg3);border:1px solid var(--line);border-radius:10px;padding:2px 9px;
  font-size:10px;color:var(--dim);cursor:pointer
}
.chip:hover{border-color:var(--accent);color:var(--ink)}
#aiStages{margin-bottom:8px}
.stg{display:flex;align-items:center;gap:7px;font-size:10.5px;color:var(--dim2);padding:2px 2px}
.stg .ic{width:13px;text-align:center}
.stg.run{color:var(--accent)}
.stg.run .ic{animation:aispin 1s linear infinite;display:inline-block}
.stg.done{color:var(--ok)}
@keyframes aispin{to{transform:rotate(360deg)}}
#aiChat{flex:1;min-height:120px;max-height:340px;overflow:auto;display:flex;flex-direction:column;gap:6px;padding-top:4px;border-top:1px solid var(--line)}
.ai-msg{border-radius:7px;padding:6px 9px;font-size:11px;line-height:1.55;max-width:96%}
.ai-msg.user{background:var(--accent2);color:#fff;align-self:flex-end}
.ai-msg.bot{background:var(--bg3);border:1px solid var(--line);align-self:flex-start}
.ai-msg.log{background:none;border:none;color:var(--dim);padding:0 4px;font-size:10.5px}
