:root{color-scheme:dark;--bg: #0b0c10;--surface: #15161d;--surface-2: #1d1f29;--border: #2a2d3a;--border-hover: #3a3e4f;--text: #e7e8ef;--muted: #9aa0b4;--faint: #8b91a8;--accent: #6366f1;--accent-hover: #818cf8;--accent-press: #4f46e5;--accent-weak: rgba(99, 102, 241, .12);--on-accent: #f7f8ff;--cyan: #22d3ee;--amber: #f59e0b;--error: #f43f5e;--success: #34d399;--r-sm: 6px;--r: 10px;--r-lg: 14px;--shadow-1: 0 1px 2px rgba(0, 0, 0, .4);--shadow-2: 0 8px 28px rgba(0, 0, 0, .45);--ease: .16s cubic-bezier(.2, .6, .2, 1)}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font:14px/1.55 Inter,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}input[type=number]{font-variant-numeric:tabular-nums}:focus-visible{outline:2px solid var(--accent);outline-offset:2px}:focus:not(:focus-visible){outline:none}.app{max-width:1280px;margin:0 auto;padding:28px 24px 56px}header{display:flex;align-items:center;gap:12px;margin-bottom:20px}.logo{display:grid;place-items:center;width:38px;height:38px;border-radius:var(--r);background:linear-gradient(140deg,var(--accent),var(--accent-press));color:var(--on-accent);box-shadow:var(--shadow-1);flex:none}header h1{margin:0;font-size:17px;font-weight:700;letter-spacing:-.01em}header .sub{margin:1px 0 0;color:var(--muted);font-size:12.5px}.dropzone{display:flex;flex-direction:column;align-items:center;gap:6px;border:1.5px dashed var(--border);border-radius:var(--r-lg);padding:30px;text-align:center;cursor:pointer;background:linear-gradient(180deg,rgba(255,255,255,.015),transparent);transition:border-color var(--ease),background var(--ease),transform var(--ease)}.dropzone:hover{border-color:var(--border-hover)}.dropzone.drag{border-color:var(--accent);background:var(--accent-weak)}.dropzone.disabled{opacity:.5;pointer-events:none}.dropzone .dz-icon{color:var(--accent-hover);margin-bottom:2px}.dz-title{margin:0;font-weight:600}.hint{color:var(--muted);margin:0;font-size:12px}.status{color:var(--accent-hover);font-size:13px}.err{color:var(--error)}.err.big{display:flex;gap:8px;align-items:center;padding:10px 12px;border:1px solid var(--error);border-radius:var(--r);background:#f43f5e14}.measure-host{position:fixed;left:-99999px;top:0;opacity:0;pointer-events:none}.result{display:grid;grid-template-columns:minmax(0,480px) 1fr;gap:24px;margin-top:24px;align-items:start}@media(max-width:900px){.result{grid-template-columns:1fr}}.left{position:sticky;top:20px}@media(max-width:900px){.left{position:static}}.controls{display:flex;flex-wrap:wrap;gap:10px 14px;align-items:flex-end;padding:12px 14px;background:var(--surface);border:1px solid var(--border);border-radius:var(--r);margin-bottom:12px}.controls label{display:inline-flex;flex-direction:column;gap:4px;color:var(--muted);font-size:11px}.controls label.row{flex-direction:row;align-items:center;gap:7px;font-size:12px}.controls input[type=text],.controls input:not([type]),.controls input[type=number]{background:var(--surface-2);border:1px solid var(--border);color:var(--text);border-radius:var(--r-sm);padding:6px 8px;width:130px;transition:border-color var(--ease)}.controls input:hover{border-color:var(--border-hover)}.controls input:focus{border-color:var(--accent)}.controls input[type=checkbox]{width:15px;height:15px;accent-color:var(--accent)}.controls input.readonly{color:var(--muted);background:transparent;cursor:default}.preview-canvas{width:100%;max-width:480px;height:auto;display:block;cursor:pointer;border:1px solid var(--border);border-radius:var(--r);background:repeating-conic-gradient(#1a1b22,#1a1b22 25%,#14151b 0%,#14151b 50%) 50% / 22px 22px;box-shadow:var(--shadow-2)}.card-width{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;max-width:480px;margin-bottom:10px;padding:8px 12px;border:1px solid var(--border);border-radius:var(--r);background:var(--surface)}.card-width .cw-label{font-size:12px;font-weight:600;color:var(--text);white-space:nowrap}.card-width input[type=range]{flex:1 1 160px;min-width:120px;accent-color:var(--amber);cursor:pointer}.card-width .cw-val{font-size:12px;font-variant-numeric:tabular-nums;color:var(--muted);min-width:48px;text-align:right}.card-width .cw-fit{font-size:12px;padding:3px 10px;color:var(--text);background:transparent;border:1px solid var(--border);border-radius:var(--r-sm);cursor:pointer;transition:border-color var(--ease),color var(--ease)}.card-width .cw-fit:hover:not(:disabled){border-color:var(--border-hover)}.card-width .cw-fit:disabled{opacity:.4;cursor:default}.card-width .cw-hint{flex-basis:100%;font-size:11px;color:var(--faint)}.actions{display:flex;gap:10px;align-items:center;margin-top:14px}.btn{display:inline-flex;align-items:center;gap:7px;padding:10px 16px;border-radius:var(--r);border:1px solid transparent;font:inherit;font-weight:600;font-size:13px;cursor:pointer;transition:background var(--ease),border-color var(--ease),transform var(--ease),opacity var(--ease)}.btn:active{transform:translateY(1px)}.btn:disabled{opacity:.45;cursor:not-allowed}.btn-primary{background:var(--accent);color:var(--on-accent);box-shadow:var(--shadow-1)}.btn-primary:hover:not(:disabled){background:var(--accent-hover)}.btn-ghost{background:var(--surface-2);border-color:var(--border);color:var(--text)}.btn-ghost:hover:not(:disabled){border-color:var(--border-hover)}.section-title{margin:0 0 10px;font-size:11.5px;font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:var(--muted)}.right .section-title{margin-top:4px}.editor{display:grid;gap:8px;margin-bottom:18px}.slot{border:1px solid var(--border);border-radius:var(--r);background:var(--surface);transition:border-color var(--ease),box-shadow var(--ease)}.slot:hover{border-color:var(--border-hover)}.slot.active{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}.slot-summary{display:flex;align-items:center;gap:9px;width:100%;padding:11px 13px;background:none;border:0;border-radius:var(--r);color:inherit;font:inherit;text-align:left;cursor:pointer}.slot-summary .chev{flex:none;color:var(--faint);transition:transform var(--ease),color var(--ease)}.slot.active .slot-summary .chev{transform:rotate(90deg);color:var(--accent-hover)}.slot-summary:hover .chev{color:var(--muted)}.slot-summary .swatch{width:13px;height:13px;border-radius:4px;border:1px solid rgba(255,255,255,.22);box-shadow:inset 0 0 0 1px #00000040;flex:none}.slot-name{flex:none;font-weight:700;font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:var(--cyan)}.slot.active .slot-name{color:var(--accent-hover)}.slot-val{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--muted);font-size:12px}.slot-pos{flex:none;color:var(--faint);font-size:11px;font-variant-numeric:tabular-nums}.slot-body{padding:2px 13px 13px}.group{display:flex;flex-wrap:wrap;align-items:flex-end;gap:8px 10px}.group.geo{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));align-items:end}.group+.group{margin-top:11px;padding-top:11px;border-top:1px dashed var(--border)}.group-label{width:100%;font-size:9.5px;text-transform:uppercase;letter-spacing:.06em;color:var(--faint);margin-bottom:-2px}.group.geo .group-label{grid-column:1 / -1}.f{display:inline-flex;flex-direction:column;gap:3px;color:var(--muted)}.group.geo .f{display:flex}.f span{font-size:9.5px;letter-spacing:.02em;color:var(--faint)}.f input[type=number],.f select{background:var(--surface-2);border:1px solid var(--border);color:var(--text);border-radius:var(--r-sm);padding:6px 7px;width:92px;transition:border-color var(--ease)}.group.geo .f input[type=number]{width:100%}.f select{width:84px;cursor:pointer}.f input[type=number]:hover,.f select:hover{border-color:var(--border-hover)}.f input[type=number]:focus,.f select:focus{border-color:var(--accent)}.f.color input[type=color]{width:44px;height:30px;padding:2px;border:1px solid var(--border);border-radius:var(--r-sm);background:var(--surface-2);cursor:pointer}.warnings ul{list-style:none;padding:0;margin:0 0 18px;display:grid;gap:7px}.warnings li{display:flex;gap:8px;align-items:flex-start;padding:8px 10px;border-radius:var(--r-sm);font-size:12px;border:1px solid var(--border);background:var(--surface);line-height:1.45}.warnings li .ic{flex:none;margin-top:1px}.warnings li.error{border-color:#f43f5e80;background:#f43f5e14}.warnings li.error .ic{color:var(--error)}.warnings li.warn{border-color:#f59e0b73;background:#f59e0b12}.warnings li.warn .ic{color:var(--amber)}.warnings code{color:var(--accent-hover);font-size:11px}details{margin-top:4px}details summary{cursor:pointer;color:var(--muted);font-size:12px;-webkit-user-select:none;user-select:none}details summary:hover{color:var(--text)}details pre{max-height:380px;overflow:auto;background:var(--surface);border:1px solid var(--border);border-radius:var(--r);padding:12px;font-size:11.5px;line-height:1.5;font-variant-numeric:tabular-nums}.mode-toggle{margin-left:auto;display:inline-flex;gap:2px;padding:3px;background:var(--surface);border:1px solid var(--border);border-radius:var(--r)}.mode-btn{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border:0;border-radius:var(--r-sm);background:transparent;color:var(--muted);font:inherit;font-size:12.5px;font-weight:600;cursor:pointer;transition:background var(--ease),color var(--ease)}.mode-btn:hover{color:var(--text)}.mode-btn.active{background:var(--accent);color:var(--on-accent)}.batch-toolbar{display:grid;gap:12px;margin-bottom:16px}.batch-controls{display:flex;flex-wrap:wrap;gap:10px;align-items:center}.file-btn{position:relative;overflow:hidden}.batch-queue{list-style:none;margin:0 0 16px;padding:0;display:grid;gap:6px}.batch-row{display:flex;align-items:center;gap:10px;padding:8px 10px;background:var(--surface);border:1px solid var(--border);border-radius:var(--r-sm);cursor:pointer;font-size:12.5px;transition:border-color var(--ease),background var(--ease)}.batch-row:hover{border-color:var(--border-hover)}.batch-row.selected{border-color:var(--accent);background:var(--accent-weak)}.batch-id{font-weight:600;color:var(--text)}.batch-file{color:var(--muted);font-size:11.5px}.batch-row .icon-btn{margin-left:auto;display:inline-flex;align-items:center;padding:4px;border:0;background:transparent;color:var(--muted);cursor:pointer;border-radius:var(--r-sm)}.batch-row .icon-btn:hover{color:var(--error);background:var(--surface-2)}.badge{display:inline-flex;align-items:center;gap:4px;padding:2px 8px;border-radius:999px;font-size:10.5px;font-weight:600;white-space:nowrap;background:var(--surface-2);color:var(--muted)}.badge.st-ready,.badge.st-approved{color:var(--success)}.badge.st-warn{color:var(--amber)}.badge.st-error{color:var(--error)}.badge.dup{color:var(--amber);background:transparent}.batch-approve{margin-bottom:12px}@media(prefers-reduced-motion:reduce){*{transition:none!important}}