:root{--bg: #0e0e0e;--bg-panel: #161616;--bg-input: #0a0a0a;--border: #2a2a2a;--border-q: #1f1f1f;--text: #efe7d6;--text-dim: #888;--text-mut: #666;--accent: #e8442e;--accent-hi: #ff5a40;--good: #6db04e;--bad: #e8442e}*{box-sizing:border-box}html,body{margin:0;padding:0;height:100%;font-family:ui-sans-serif,-apple-system,system-ui,Inter,sans-serif;-webkit-font-smoothing:antialiased}body{display:flex;flex-direction:column;background:var(--bg);color:var(--text)}.toolbar{display:flex;align-items:center;gap:24px;padding:10px 18px;background:var(--bg-panel);border-bottom:1px solid var(--border)}.toolbar h1{font-size:14px;font-weight:600;margin:0;letter-spacing:.2px;color:var(--text)}.toolbar h1.brand{display:flex;align-items:center;gap:10px}.toolbar h1.brand .logo{display:block;width:28px;height:28px;border-radius:6px}.bbox-controls label{font-family:ui-monospace,Menlo,monospace;font-size:11px;letter-spacing:.4px;color:var(--text-dim);text-transform:uppercase;display:flex;align-items:center;gap:6px}.bbox-controls input{width:64px;padding:4px 8px;background:var(--bg-input);border:1px solid var(--border);color:var(--text);border-radius:2px;font-family:ui-monospace,Menlo,monospace;font-size:12px;text-align:right;-moz-appearance:textfield;-webkit-appearance:textfield;appearance:textfield}.bbox-controls input::-webkit-outer-spin-button,.bbox-controls input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.bbox-controls input:focus{outline:none;border-color:var(--accent)}.actions{margin-left:auto;display:flex;gap:8px}.actions button{padding:6px 14px;background:transparent;color:var(--text);border:1px solid var(--border);border-radius:2px;font-family:ui-monospace,Menlo,monospace;font-size:11px;letter-spacing:.4px;text-transform:uppercase;cursor:pointer}.actions button:hover:not(:disabled){border-color:var(--text-dim)}.actions button[aria-pressed=true]{background:var(--text);border-color:var(--text);color:var(--bg)}.actions button:disabled{color:var(--text-mut);border-color:var(--border-q);cursor:not-allowed;opacity:.5}.actions button.primary{background:var(--accent);border-color:var(--accent);color:#0a0a0a;font-weight:600}.actions button.primary:hover:not(:disabled){background:var(--accent-hi);border-color:var(--accent-hi)}.actions button.primary:disabled{background:transparent;border-color:var(--border-q);color:var(--text-mut);font-weight:400}main{flex:1;display:flex;overflow:hidden}#designer-canvas{flex:1;min-width:0;background:radial-gradient(circle,rgba(60,60,60,.18) 1px,transparent 1.5px) 0 0 / 20px 20px,var(--bg);display:block}.status{flex:0 0 240px;padding:14px 16px;background:var(--bg-panel);border-left:1px solid var(--border);font-family:ui-monospace,Menlo,monospace;font-size:11px;color:var(--text-dim);overflow-y:auto;letter-spacing:.2px}@media (min-width: 1500px){.status{flex:0 0 300px;padding:18px 22px}}@media (min-width: 1900px){.status{flex:0 0 360px}}.status>div{margin-bottom:4px;display:flex;justify-content:space-between;align-items:baseline}.status>#inventory-container{display:block}.status .label{color:var(--text-mut);text-transform:uppercase;letter-spacing:.6px;font-size:10px}.status .value{color:var(--text);font-weight:500}.status .value.closure-ok{color:var(--good)}.status .value.closure-warn{color:#e6c34c}.status .value.closure-bad{color:var(--bad);font-weight:700}.status .hint{display:block;color:var(--text-mut);font-size:10px;line-height:1.55;margin-top:18px;padding-top:14px;border-top:1px solid var(--border-q)}.status .hint h3{margin:0 0 8px;text-transform:uppercase;letter-spacing:.6px;color:var(--text-dim);font-size:9px;font-weight:500}.status .hint ul{list-style:none;margin:0;padding:0}.status .hint li{display:grid;grid-template-columns:1fr;gap:2px;padding:4px 0;border-bottom:1px dotted var(--border-q)}.status .hint li:last-child{border-bottom:none}.status .hint .effect{color:var(--text);font-size:11px;line-height:1.35}.status .hint .gesture{color:var(--text-mut);font-family:ui-monospace,Menlo,monospace;font-size:10px}.status .hint kbd{background:var(--bg-input);color:var(--text);border:1px solid var(--border);border-radius:2px;padding:1px 5px;font-family:ui-monospace,Menlo,monospace;font-size:9px}.inventory-section{margin-top:14px}.inventory-section:first-child{margin-top:8px}.inventory-section-title{font-size:9px;letter-spacing:.6px;text-transform:uppercase;color:var(--text-mut);margin-bottom:4px}.inventory-header{font-size:10px;letter-spacing:.6px;text-transform:uppercase;color:var(--text-mut);margin:18px 0 6px;display:flex;justify-content:space-between;align-items:baseline}table.inventory{width:100%;border-collapse:collapse;font-family:ui-monospace,Menlo,monospace;font-size:11px;color:var(--text)}table.inventory th{text-align:right;padding:4px;font-weight:400;color:var(--text-mut);border-bottom:1px solid var(--border-q);text-transform:uppercase;font-size:9px;letter-spacing:.6px}table.inventory th.piece{text-align:left}table.inventory td{text-align:right;padding:2px 4px;vertical-align:middle}table.inventory td.piece{text-align:left;color:var(--text-dim)}table.inventory td.used{color:var(--text)}table.inventory tr.over td.used{color:var(--bad);font-weight:700}table.inventory td.remaining.ok{color:var(--good)}table.inventory td.remaining.over{color:var(--bad);font-weight:700}table.inventory td.available{color:var(--text-mut);padding:1px 0}table.inventory tr.empty td.used,table.inventory tr.empty td.remaining{color:var(--border)}table.inventory tr.empty td.piece{color:var(--text-mut)}.avail-input{width:100%;max-width:48px;padding:2px 4px;background:transparent;border:1px solid transparent;border-radius:2px;color:var(--text-mut);font-family:ui-monospace,Menlo,monospace;font-size:11px;text-align:right;-moz-appearance:textfield}.avail-input::-webkit-outer-spin-button,.avail-input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.avail-input:hover{border-color:var(--border-q);background:var(--bg-input);color:var(--text)}.avail-input:focus{outline:none;border-color:var(--accent);background:var(--bg-input);color:var(--text)}dialog.modal{border:1px solid var(--border);background:var(--bg-panel);color:var(--text);border-radius:4px;padding:22px 24px 18px;max-width:360px;font-family:inherit;box-shadow:0 18px 60px #0009}dialog.modal::backdrop{background:#0009;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}dialog.modal h2{margin:0 0 10px;font-size:15px;font-weight:600;letter-spacing:.2px}dialog.modal p{margin:0 0 18px;color:var(--text-dim);font-size:12px;line-height:1.5}.modal-actions{display:flex;justify-content:flex-end;gap:8px}.modal-actions button{padding:6px 14px;background:transparent;color:var(--text);border:1px solid var(--border);border-radius:2px;font-family:ui-monospace,Menlo,monospace;font-size:11px;letter-spacing:.4px;text-transform:uppercase;cursor:pointer}.modal-actions button:hover{border-color:var(--text-dim)}.modal-actions button.primary{background:var(--accent);border-color:var(--accent);color:#0a0a0a;font-weight:600}.modal-actions button.primary:hover{background:var(--accent-hi);border-color:var(--accent-hi)}.inventory-header a{color:var(--text-mut);text-decoration:none;cursor:pointer;font-size:9px;letter-spacing:.4px}.inventory-header a:hover{color:var(--accent)}
