:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg:#141414;--panel:#1f1f21;--line:#333336;--text:#ececec;--muted:#9a9aa0;--accent:#f9e2ce;font-family:system-ui,-apple-system,Segoe UI,sans-serif;font-size:14px;line-height:1.4}*{box-sizing:border-box}body{background:var(--bg);color:var(--text);margin:0}button{font:inherit;color:inherit;background:var(--panel);border:1px solid var(--line);cursor:pointer;border-radius:6px;padding:8px 12px}button:hover:not(:disabled){border-color:var(--muted)}button:disabled{opacity:.5;cursor:default}.editor{grid-template-columns:minmax(280px,640px) minmax(280px,360px);justify-content:center;align-items:start;gap:24px;padding:24px;display:grid}@media (width<=720px){.editor{grid-template-columns:1fr}}.stage{gap:12px;display:grid;position:sticky;top:24px}.stage canvas,.preset img{background:repeating-conic-gradient(#2a2a2d 0% 25%,#3a3a3e 0% 50%) 0 0/16px 16px}.stage canvas{border-radius:8px;width:100%;display:block}.downloads{gap:8px;display:flex}.panels h1{margin:0 0 12px;font-size:18px}.panel{background:var(--panel);border:1px solid var(--line);border-radius:8px;margin-bottom:12px;padding:12px 14px}.panel h2{text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin:0 0 10px;font-size:13px}.control{gap:6px;margin-bottom:12px;display:grid}.control-label{justify-content:space-between;align-items:center;gap:8px;display:flex}.control-label output{color:var(--muted);font-variant-numeric:tabular-nums}.control input[type=range]{width:100%;accent-color:var(--accent)}.hex-input{font:inherit;text-transform:uppercase;width:6.5em;color:var(--text);background:var(--bg);border:1px solid var(--line);border-radius:4px;padding:4px 6px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}.control .react-colorful{width:100%;height:120px}.swatches,.preset-picker{flex-wrap:wrap;gap:8px;display:flex}.swatch{border:2px solid #0000;border-radius:50%;width:28px;height:28px;padding:0}.swatch[aria-checked=true]{border-color:var(--text)}.preset-picker.thumbnails .preset{justify-items:center;gap:4px;padding:6px;font-size:12px;display:grid}.preset-picker.thumbnails img{border-radius:4px;height:56px;display:block}.preset[aria-checked=true]{border-color:var(--accent);color:var(--accent)}.render-stage{max-width:none}.render-stage canvas{display:block}.render-error{color:#ff8a80;white-space:pre-wrap;padding:16px}