:root{--bg:#17150f;--bg-panel:#1f1d16;--bg-panel-2:#262319;--bg-input:#12100b;--border:#3d3829;--border-strong:#57503a;--text:#cfc7a8;--text-dim:#8d8465;--text-faint:#5f5945;--accent:#8a7f4f;--accent-bright:#b3a668;--blood:#9a2b22;--blood-bright:#c0392b;--grid-line:#2e2a1e;--grid-fill:#4f4727;--font:"Liberation Mono","DejaVu Sans Mono",ui-monospace,monospace}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:radial-gradient(1200px 600px at 20% -10%,#221f16 0%,transparent 60%),var(--bg);color:var(--text);font-family:var(--font);font-size:13px}.app{display:flex;flex-direction:column;height:100%}.topbar{display:flex;border-bottom:1px solid var(--border);background:var(--bg-panel);flex:none;align-items: center;gap:14px;padding:10px 16px}.brand{letter-spacing:3px;text-transform:uppercase;color:var(--accent-bright);font-size:15px;font-weight:700}.brand em{color:var(--blood);font-style:normal}.topbar .spacer{flex:1}.topbar .count{color:var(--text-dim);letter-spacing:1px;text-transform:uppercase;font-size:11px}.btn{background:var(--bg-input);color:var(--text);border:1px solid var(--border-strong);font-family:var(--font);letter-spacing:1px;text-transform:uppercase;cursor:pointer;padding:6px 14px;font-size:12px}.btn:hover{border-color:var(--accent-bright);color:var(--accent-bright)}.btn.export{background:var(--blood);border-color:var(--blood);color:#f0e6d0;font-weight:700}.btn.export:hover{background:var(--blood-bright)}.btn.small{padding:3px 8px;font-size:11px}.body{display:flex;flex:auto;min-height:0}.pane-list{display:flex;border-right:1px solid var(--border);background:var(--bg-panel);flex-direction:column;flex:none;width:340px;min-height:0}.search{border-bottom:1px solid var(--border);padding:10px}.search input{background:var(--bg-input);border:1px solid var(--border);color:var(--text);font-family:var(--font);outline:none;width:100%;padding:7px 9px;font-size:13px}.search input:focus{border-color:var(--accent)}.search-filters{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}.vanilla-toggle{display:flex;letter-spacing:1px;text-transform:uppercase;font-size:11px;font-family:var(--font);color:var(--text-dim);background:var(--bg-input);border:1px solid var(--border);cursor:pointer;user-select:none;border-radius:999px;align-items: center;gap:7px;padding:4px 10px}.vanilla-toggle .vt-dot{border:1px solid var(--border-strong);border-radius:50%;flex:none;width:8px;height:8px}.vanilla-toggle.on{color:var(--accent-bright);border-color:var(--accent-bright);box-shadow:0 0 8px #b3a66873,inset 0 0 4px #b3a66833}.vanilla-toggle.on .vt-dot{background:var(--accent-bright);border-color:var(--accent-bright);box-shadow:0 0 4px #b3a668cc}.row .mod-wrench{color:var(--accent-bright);filter:grayscale(.4);flex:none;padding-right:2px;font-size:11px}.list-scroll{overflow-y:auto;flex:auto;min-height:0}.row{display:flex;border-bottom:1px solid var(--grid-line);cursor:pointer;overflow:hidden;white-space:nowrap;align-items: center;gap:8px;height:100%;padding:0 10px}.row:hover{background:var(--bg-panel-2)}.row.selected{background:var(--grid-fill);box-shadow:inset 3px 0 0 var(--accent-bright)}.row .thumb{object-fit:contain;image-rendering:pixelated;flex:none;width:28px;height:28px}.row .thumb.placeholder{border:1px dashed var(--border)}.row .rname{overflow:hidden;text-overflow:ellipsis;flex:auto}.row .rname .mod{color:var(--text-faint);font-size:10px}.ctr-icon{display:inline-flex;vertical-align:-1px;color:var(--accent-bright);flex:none;margin-right:5px}.row .rweight{color:var(--text-dim);flex:none;font-size:11px}.row .rsize{color:var(--accent-bright);text-align:right;flex:none;min-width:34px;font-size:11px}.row .rsize.prefilled{color:var(--text-dim);text-decoration:underline dotted}.row .rsize .auto-size{color:var(--text-faint)}.row .badge{letter-spacing:1px;border:1px solid var(--border-strong);color:var(--text-dim);flex:none;padding:1px 4px;font-size:9px}.row .badge.container{color:var(--accent-bright);border-color:var(--accent)}.pane-detail{overflow-y:auto;flex:auto;min-width:0;padding:18px 22px 40px}.empty-state{color:var(--text-faint);letter-spacing:2px;text-transform:uppercase;text-align:center;margin-top:60px}.detail-head{display:flex;align-items: flex-start;gap:16px;margin-bottom:18px}.detail-head img{object-fit:contain;image-rendering:pixelated;border:1px solid var(--border);background:var(--bg-input);flex:none;width:64px;height:64px}.detail-head img.placeholder{border-style:dashed}.detail-head .dh-name{color:var(--accent-bright);word-break:break-all;font-size:16px}.detail-head .dh-name .override-mark{display:inline-block;color:var(--accent-bright);vertical-align:2px;margin-left:8px}.row .override-mark{color:var(--accent-bright);display:inline-flex;flex:none}.detail-head .dh-sub{color:var(--text-dim);margin-top:3px;font-size:11px}.detail-head .dh-tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}.detail-head .dh-mods{display:flex;flex-wrap:wrap;gap:8px;margin-top:6px}.dh-mods .mod-link{color:var(--accent-bright);text-decoration:none;border-bottom:1px dotted var(--accent);padding-bottom:1px;font-size:11px}.dh-mods .mod-link:hover{color:#e8d9a0}.section{border:1px solid var(--border);background:var(--bg-panel);margin-bottom:16px}.section h3{letter-spacing:2px;text-transform:uppercase;color:var(--text-dim);border-bottom:1px solid var(--border);background:var(--bg-panel-2);margin:0;padding:8px 12px;font-size:11px}.section .sec-body{padding:12px}.field{display:flex;align-items: center;gap:10px;margin-bottom:10px}.field label{color:var(--text-dim);letter-spacing:1px;text-transform:uppercase;flex:none;width:130px;font-size:11px}.field input[type=number],.field input[type=text],.field select{background:var(--bg-input);border:1px solid var(--border);color:var(--text);font-family:var(--font);outline:none;width:120px;padding:5px 8px;font-size:13px}.field input:focus,.field select:focus{border-color:var(--accent)}.field .hint{color:var(--text-faint);font-size:11px}.checkbox-row{display:flex;flex-wrap:wrap;gap:6px 14px}.checkbox-row label{display:flex;color:var(--text-dim);cursor:pointer;letter-spacing:1px;align-items: center;gap:5px;font-size:11px}.checkbox-row input{accent-color:var(--accent)}.save-state{color:var(--text-faint);margin-left:8px;font-size:11px}.save-state.saved{color:var(--accent-bright)}.save-state.error{color:var(--blood-bright)}.footprint{display:inline-block}.fp-grid{display:grid;border:1px solid var(--border-strong);background:var(--bg-input);user-select:none;touch-action:none}.fp-cell{border:1px solid var(--grid-line)}.fp-cell.filled{background:var(--grid-fill);border-color:#5a5230}.fp-cell.fill-preview{background:#3d3720}.fp-cell.auto-cell{border-color:var(--grid-line);background:#94928a24}.fp-size{color:var(--accent-bright);letter-spacing:1px;margin-top:8px}.cgrid-wrap{position:relative}.cgrid{position:relative;border:1px solid var(--border-strong);background:var(--bg-input);user-select:none;touch-action:none}.cgrid .bg-cell{position:absolute;border:1px solid var(--grid-line)}.cgrid-rect{position:absolute;border:1px solid var(--accent-bright);cursor:move;display:flex;color:var(--accent-bright);background:#8a7f4f47;justify-content:center;align-items: center;font-size:10px}.cgrid-rect>span{pointer-events:none}.cgrid-rect.selected{box-shadow:0 0 0 1px var(--bg-input);background:#8a7f4f73;border-color:#e8d9a0}.cgrid-rect.placeholder{border:1px dashed var(--border-strong);color:var(--text-faint);cursor:default;background:#8d846514}.cgrid-rect .resize{position:absolute;background:var(--accent-bright);border:1px solid var(--bg-input);cursor:nwse-resize;width:8px;height:8px;bottom:-4px;right:-4px}.cgrid-tools{display:flex;align-items: center;gap:10px;margin-top:10px}.grid-list{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}.grid-chip{color:var(--text-dim);border:1px solid var(--border);cursor:pointer;letter-spacing:.5px;padding:2px 6px;font-size:10px}.grid-chip.selected{color:var(--accent-bright);border-color:var(--accent-bright)}.grid-chip .del{color:var(--blood-bright);margin-left:6px}.recipe-total{display:flex;border:1px dashed var(--border);background:var(--bg-panel-2);flex-wrap:wrap;align-items: center;gap:6px;margin-bottom:8px;padding:6px 8px}.recipe-total .total-label{letter-spacing:1px;text-transform:uppercase;color:var(--text-dim);font-size:10px}.recipe-total .total-chip{color:var(--accent-bright);font-size:11px}.recipe-block{border:1px solid var(--border);background:var(--bg-panel);margin-bottom:8px}.recipe-head{display:flex;border-bottom:1px solid var(--border);background:var(--bg-panel-2);flex-wrap:wrap;align-items: center;gap:8px;padding:6px 8px}.recipe-name{color:var(--text);font-size:12px}.req-badges{display:inline-flex;flex-wrap:wrap;gap:5px}.req-badge{letter-spacing:.5px;border:1px solid var(--border-strong);color:var(--text-dim);text-transform:uppercase;padding:1px 6px;font-size:10px}.req-badge.skill{color:var(--accent-bright);border-color:var(--accent)}.req-badge.surface{color:#a8935a}.req-badge.light{color:#c9a94e}.recipe-meta{color:var(--text-faint);margin-left:auto;font-size:11px}.recipe-outputs{display:flex;flex-wrap:wrap;gap:6px;padding:6px 8px}.output-chip{color:var(--text-dim);border:1px solid var(--border);padding:1px 6px;font-size:11px}.recipe-inputs{padding:4px 8px 8px}.recipe-input{display:flex;position:relative;align-items: center;gap:7px;padding:2px 0}.recipe-input .expand{color:var(--text-dim);cursor:pointer;background:0 0;border:none;flex:none;width:16px;padding:0 2px;font-size:11px}.recipe-input .expand.open{transform:rotate(90deg)}.recipe-input .expand:disabled{color:var(--text-faint);cursor:default}.recipe-input .input-count{color:var(--text-dim);flex:none;min-width:28px;font-size:11px}.recipe-input .input-item{border:none;border-bottom:1px dotted var(--border-strong);color:var(--text);font-family:var(--font);cursor:pointer;background:0 0;padding:0;font-size:12px}.recipe-input .input-item:hover{color:var(--accent-bright)}.recipe-input .alt-select{background:var(--bg-input);border:1px solid var(--border);color:var(--text);font-family:var(--font);max-width:260px;padding:1px 4px;font-size:11px}.recipe-input .tag-chip{color:var(--text-faint);border:1px dashed var(--border);padding:1px 6px;font-size:11px;font-style:italic}.recipe-input .kept{color:var(--text-faint);text-transform:uppercase;letter-spacing:1px;font-size:10px}.usage{display:inline-flex;flex:none;align-items: center;gap:5px;margin-left:2px}.usage-bar{border:1px solid var(--border-strong);background:var(--bg-input);overflow:hidden;width:42px;height:6px}.usage-fill{display:block;background:var(--accent);height:100%}.usage-label{color:var(--accent-bright);font-size:10px}.recipes .recipes{border-left:1px solid var(--grid-line);margin-left:18px;padding-left:10px}::-webkit-scrollbar{width:10px}::-webkit-scrollbar-track{background:var(--bg)}::-webkit-scrollbar-thumb{background:var(--border);border:2px solid var(--bg)}::-webkit-scrollbar-thumb:hover{background:var(--border-strong)}