[hidden]{display:none!important}:root{--bg: #f1f5f9;--panel: #ffffff;--text: #0f172a;--muted: #64748b;--border: #e2e8f0;--accent: #2563eb;--accent-text: #ffffff;--danger: #dc2626;--input: #ffffff;--stage: #e2e8f0;color-scheme:light}@media(prefers-color-scheme:dark){:root{--bg: #0b1120;--panel: #111827;--text: #e5e7eb;--muted: #94a3b8;--border: #1f2937;--accent: #3b82f6;--danger: #f87171;--input: #0f172a;--stage: #1e293b;color-scheme:dark}}*{box-sizing:border-box}html,body{margin:0;height:100%}body{font:14px/1.4 system-ui,-apple-system,Segoe UI,Roboto,sans-serif;background:var(--bg);color:var(--text)}#app{display:flex;flex-direction:column;height:100vh}.topbar{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:8px 16px;background:var(--panel);border-bottom:1px solid var(--border)}.brand strong{font-size:16px}.actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center}button,select,input,textarea{font:inherit;color:var(--text);background:var(--input);border:1px solid var(--border);border-radius:6px}button{padding:6px 12px;cursor:pointer}button:hover:not(:disabled){border-color:var(--accent)}button:disabled{opacity:.5;cursor:default}button.primary{background:var(--accent);color:var(--accent-text);border-color:var(--accent)}button.danger{color:var(--danger)}select,input,textarea{padding:5px 8px;width:100%;min-width:0}input[type=checkbox]{width:auto}input[type=color]{padding:2px;height:32px}input[type=range]{padding:0;border:0;background:transparent}textarea{resize:vertical}.actions select{width:auto}.layout{flex:1;display:grid;grid-template-columns:290px 1fr 290px;min-height:0}.panel{background:var(--panel);overflow-y:auto;padding:12px 16px}.panel.left{border-right:1px solid var(--border)}.panel.right{border-left:1px solid var(--border)}.panel section{margin-bottom:18px}h2{font-size:13px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);margin:8px 0 10px}.subhead{font-weight:600;margin:10px 0 4px}.field{display:flex;flex-direction:column;gap:3px;margin-bottom:8px}.field>span{font-size:12px;color:var(--muted)}.field small,.hint{color:var(--muted);font-size:11px;display:block;margin:-2px 0 6px}.check{display:flex;align-items:center;gap:6px;margin:6px 0;cursor:pointer}.grid2{display:grid;grid-template-columns:1fr 1fr;gap:0 8px}.grid3{display:grid;grid-template-columns:1fr 1fr 70px;gap:0 8px}.info{background:var(--bg);border-radius:6px;padding:8px;font-size:12px}.info.error{color:var(--danger)}.mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace}.muted{color:var(--muted)}.privacy{color:var(--muted);font-size:11px}.center{display:flex;flex-direction:column;min-width:0;min-height:0}.toolbar,.previewbar{display:flex;gap:8px;align-items:center;flex-wrap:wrap;padding:8px 12px;background:var(--panel);border-bottom:1px solid var(--border)}.previewbar{border-bottom:0;border-top:1px solid var(--border)}.previewbar input[type=range]{width:220px;max-width:40vw}.toolbar .check{margin:0}.sep{width:1px;height:22px;background:var(--border)}.stage{flex:1;min-height:320px;background:var(--stage);position:relative;overflow:hidden}.stage.drop{outline:3px dashed var(--accent);outline-offset:-8px}.btnrow{display:flex;flex-wrap:wrap;gap:6px;margin:8px 0}.btnrow button{padding:4px 8px;font-size:12px}.layers{list-style:none;margin:0;padding:0}.layers li{padding:6px 8px;border:1px solid var(--border);border-radius:6px;margin-bottom:4px;cursor:pointer;display:flex;justify-content:space-between;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.layers li.active{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 12%,transparent)}@media(max-width:1000px){#app{height:auto;min-height:100vh}.layout{grid-template-columns:1fr}.center{order:-1}.stage{height:60vh;flex:none}.panel.left,.panel.right{border:0;border-top:1px solid var(--border)}}