*{box-sizing:border-box;margin:0;padding:0}
body{font-family:'Courier New',monospace;background:#141414;color:#ccc;height:100vh;overflow:hidden;display:flex;flex-direction:column;user-select:none}

/* TOOLBAR */
#toolbar{height:46px;background:#1c1c1c;border-bottom:2px solid #f80;display:flex;align-items:center;padding:0 10px;gap:6px;flex-shrink:0}
.app-title{font-size:17px;font-weight:bold;color:#f80;letter-spacing:3px;margin-right:10px;white-space:nowrap}
.tb-btn{background:#2a2a2a;color:#bbb;border:1px solid #3a3a3a;padding:4px 10px;font-family:'Courier New',monospace;font-size:11px;cursor:pointer;border-radius:2px;transition:all .12s;white-space:nowrap}
.tb-btn:hover{background:#3a3a3a;color:#fff}
.tb-btn.active{background:#f80;color:#000;border-color:#f80;font-weight:bold}
.tb-sep{width:1px;height:24px;background:#333;flex-shrink:0;margin:0 2px}
.snap-sel{background:#2a2a2a;color:#bbb;border:1px solid #3a3a3a;padding:4px 6px;font-family:'Courier New',monospace;font-size:11px;cursor:pointer}
#hint-text{font-size:10px;color:#aaa;margin-left:4px;white-space:nowrap;overflow:hidden}

/* MAIN */
#main{display:flex;flex:1;overflow:hidden;min-height:0}

/* LEFT PANEL */
#left-panel{width:188px;background:#191919;border-right:2px solid #2a2a2a;display:flex;flex-direction:column;overflow-y:auto;flex-shrink:0}
.panel-hdr{padding:7px 10px;background:#222;color:#f80;font-size:10px;font-weight:bold;letter-spacing:2px;border-bottom:1px solid #2a2a2a;position:sticky;top:0;z-index:1}
.cat-group{border-bottom:1px solid #222}
.cat-lbl{padding:5px 10px;font-size:10px;color:#999;text-transform:uppercase;letter-spacing:1px;background:#1e1e1e;cursor:pointer;display:flex;align-items:center;justify-content:space-between}
.cat-lbl:hover{background:#252525;color:#ccc}
.cat-lbl .arrow{font-size:9px;transition:transform .15s}
.cat-lbl.collapsed .arrow{transform:rotate(-90deg)}
.cat-items{}
.fit-item{padding:5px 10px 5px 18px;font-size:10px;color:#aaa;cursor:pointer;border-left:2px solid transparent;transition:all .1s;display:flex;align-items:center;gap:6px;line-height:1.3}
.fit-item:hover{background:#252525;color:#eee;border-left-color:#f80}
.fit-item.active{background:#252525;color:#f80;border-left-color:#f80}
.fit-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}

/* PLAN TOOLS PANEL */
.plan-hdr{padding:7px 10px;background:#1a2a1a;color:#4d4;font-size:10px;font-weight:bold;letter-spacing:2px;border-bottom:1px solid #2a3a2a}
.plan-tool-grid{display:grid;grid-template-columns:1fr 1fr;gap:4px;padding:6px 8px}
.ptool{background:#1e281e;color:#8c8;border:1px solid #2a3a2a;padding:5px 4px;font-family:'Courier New',monospace;font-size:9px;cursor:pointer;text-align:center;line-height:1.3;border-radius:2px;transition:all .1s}
.ptool:hover{background:#253525;color:#afa;border-color:#4d4}
.ptool.active{background:#253525;color:#4f4;border-color:#4d4;font-weight:bold}
.plan-prop-row{display:flex;align-items:center;justify-content:space-between;padding:4px 8px;font-size:10px;color:#888;gap:6px}
.plan-input{background:#1e281e;border:1px solid #2a3a2a;color:#afa;padding:3px 5px;font-family:'Courier New',monospace;font-size:10px;width:70px;text-align:right}
.plan-input:focus{outline:none;border-color:#4d4}

/* CANVAS */
#canvas-wrap{flex:1;position:relative;overflow:hidden;background:#0f0f0f;cursor:crosshair;min-width:0}
#cad{position:absolute;top:0;left:0;touch-action:none}
#status{position:absolute;bottom:8px;left:8px;font-size:10px;color:#888;pointer-events:none}
#empty-hint{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center;color:#666;pointer-events:none;font-size:13px;line-height:2}
#empty-hint .big{font-size:28px;color:#555;display:block}

/* RIGHT PANEL */
#right-panel{width:232px;background:#191919;border-left:2px solid #2a2a2a;display:flex;flex-direction:column;flex-shrink:0}
.tabs{display:flex;background:#1c1c1c;border-bottom:2px solid #2a2a2a;flex-shrink:0}
.tab-btn{flex:1;padding:7px 2px;font-family:'Courier New',monospace;font-size:9px;background:none;border:none;color:#999;cursor:pointer;text-transform:uppercase;letter-spacing:.5px;border-bottom:2px solid transparent;margin-bottom:-2px;transition:all .1s}
.tab-btn:hover{color:#ddd}
.tab-btn.active{color:#f80;border-bottom-color:#f80}
.tab-pane{flex:1;overflow-y:auto;padding:10px;display:none;min-height:0}
.tab-pane.active{display:block}
.prop-row{display:flex;justify-content:space-between;align-items:baseline;padding:3px 0;border-bottom:1px solid #252525;font-size:10px}
.prop-lbl{color:#888}
.prop-val{color:#eee;font-weight:bold;text-align:right;font-size:11px}
.sec-title{font-size:9px;color:#f80;text-transform:uppercase;letter-spacing:1px;margin:10px 0 5px;border-bottom:1px solid #2a2a2a;padding-bottom:3px}
.mat-row{padding:3px 0;font-size:10px;border-bottom:1px solid #252525;display:flex;justify-content:space-between;align-items:center;gap:4px}
.mat-name{color:#bbb;flex:1;font-size:9px}
.mat-qty{color:#f80;font-weight:bold;flex-shrink:0}
.no-sel{color:#777;font-size:11px;text-align:center;margin-top:24px;line-height:1.8}
.exp-btn{display:block;width:100%;padding:6px;background:#252525;color:#bbb;border:1px solid #444;font-family:'Courier New',monospace;font-size:10px;cursor:pointer;margin-top:6px;text-align:left;transition:all .1s}
.exp-btn:hover{background:#333;color:#fff}
.action-row{display:flex;gap:5px;margin-top:8px}
.act-btn{flex:1;padding:5px 4px;background:#2a2a2a;color:#bbb;border:1px solid #333;font-family:'Courier New',monospace;font-size:10px;cursor:pointer;transition:all .1s}
.act-btn:hover{background:#333;color:#fff}
.act-btn.danger{border-color:#622;color:#a44}
.act-btn.danger:hover{background:#622;color:#f88}
.z-input{width:100%;background:#252525;border:1px solid #333;color:#fff;padding:4px 6px;font-family:'Courier New',monospace;font-size:11px;margin-top:3px}
.z-input:focus{outline:none;border-color:#f80}

/* Scrollbar */
::-webkit-scrollbar{width:5px}
::-webkit-scrollbar-track{background:#111}
::-webkit-scrollbar-thumb{background:#333}
::-webkit-scrollbar-thumb:hover{background:#555}

/* MODAL */
#modal-overlay{position:fixed;inset:0;background:#000c;z-index:100;display:flex;align-items:center;justify-content:center}
#modal-overlay.hidden{display:none}
.hidden{display:none!important}
.modal{background:#1c1c1c;border:2px solid #f80;padding:28px 32px;max-width:560px;width:92%;font-family:'Courier New',monospace}
.modal h2{color:#f80;font-size:18px;letter-spacing:3px;margin:0 0 6px}
.modal .sub{color:#666;font-size:10px;margin-bottom:20px;letter-spacing:1px}
.dn-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:20px}
.dn-card{background:#252525;border:2px solid #333;padding:12px 14px;cursor:pointer;transition:all .12s;border-radius:2px}
.dn-card:hover{border-color:#f80;background:#2e2e2e}
.dn-card.sel{border-color:#0f9;background:#1a2e22}
.dn-card .dn-size{font-size:16px;font-weight:bold;color:#fff;margin-bottom:3px}
.dn-card .dn-desc{font-size:9px;color:#777;line-height:1.4}
.dn-card.sel .dn-size{color:#0f9}
.modal-ok{display:block;width:100%;padding:10px;background:#f80;color:#000;border:none;font-family:'Courier New',monospace;font-size:13px;font-weight:bold;cursor:pointer;letter-spacing:2px;margin-top:4px;transition:background .1s}
.modal-ok:hover{background:#ffa030}
.modal-note{font-size:9px;color:#555;margin-top:10px;text-align:center}
.dim-form{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:12px 0}
.dim-form label{font-size:10px;color:#888;margin-bottom:2px;display:block}
.dim-form input{width:100%;background:#252525;border:1px solid #444;color:#fff;padding:6px 8px;font-family:'Courier New',monospace;font-size:13px}
.dim-form input:focus{outline:none;border-color:#f80}
.modal-cancel{display:block;width:100%;padding:7px;background:transparent;color:#666;border:1px solid #333;font-family:'Courier New',monospace;font-size:11px;cursor:pointer;margin-top:6px}
.modal-cancel:hover{color:#aaa;border-color:#555}

/* FILE DROPDOWN */
.tb-dropdown{position:relative;display:inline-block}
.tb-dropdown-trigger{min-width:72px}
.tb-dropdown-menu{
  display:none;position:absolute;top:100%;left:0;z-index:200;
  background:#1c1c1c;border:1px solid #f80;min-width:140px;
  box-shadow:0 4px 16px #000a;margin-top:2px;
}
.tb-dropdown-menu.open{display:block}
.tb-dropdown-menu button{
  display:block;width:100%;padding:8px 14px;
  background:none;color:#ccc;border:none;border-bottom:1px solid #2a2a2a;
  font-family:'Courier New',monospace;font-size:11px;
  text-align:left;cursor:pointer;white-space:nowrap;
}
.tb-dropdown-menu button:last-child{border-bottom:none}
.tb-dropdown-menu button:hover{background:#2a2a2a;color:#fff}
