body{margin:0;font-family:Inter,system-ui,sans-serif;color:#1f2933;background:#f7f9fb}.page.svelte-1uha8ag{display:flex;flex-direction:column;gap:2rem;padding:2.5rem clamp(1.5rem,4vw,3rem)}.header.svelte-1uha8ag{display:flex;flex-wrap:wrap;gap:1.5rem;align-items:center;justify-content:space-between}.header.svelte-1uha8ag h1:where(.svelte-1uha8ag){margin:0 0 .4rem;font-size:2rem}.header.svelte-1uha8ag p:where(.svelte-1uha8ag){margin:0;color:#54616f}.summary.svelte-1uha8ag{display:flex;gap:1rem;flex-wrap:wrap;font-size:.95rem;color:#334155}.panel.svelte-1uha8ag{background:#fff;border-radius:1.25rem;padding:1.5rem;box-shadow:0 20px 45px #0f172a14}.controls.svelte-1uha8ag{display:flex;flex-wrap:wrap;gap:2rem;align-items:flex-start}.visualizer.svelte-1uha8ag{display:flex;gap:1.5rem;flex-direction:column;align-items:flex-start}.visualizer-preview.svelte-1uha8ag{display:flex;flex-direction:row;gap:.75rem;align-items:center;padding:1rem;border-radius:1rem;border:1px solid #e2e8f0;background:#f8fafc}.visualizer-cell.svelte-1uha8ag{position:relative;border:1px solid #d9e2ec;background:#fff;box-sizing:border-box}.visualizer-preview.svelte-1uha8ag .is-swatch:where(.svelte-1uha8ag){background:var(--preview-color, #2b323b);border-color:var(--preview-color, #2b323b);position:relative;cursor:pointer}.gap-handle.svelte-1uha8ag{background:#fff;border-color:#d9e2ec;cursor:ew-resize;display:flex;align-items:center;justify-content:center}.gap-handle-indicator.svelte-1uha8ag{display:block;width:14px;height:6px;border-radius:999px;background:#4c6ef5}.visualizer-preview.svelte-1uha8ag .color-picker-input:where(.svelte-1uha8ag){position:absolute;inset:0;width:100%;height:100%;border:none;padding:0;opacity:0;cursor:pointer;z-index:1}.radius-slider.svelte-1uha8ag{width:max(var(--preview-cell-size),50px);height:var(--preview-cell-size);display:flex;flex-direction:row;align-items:center;justify-content:center;line-height:0;gap:2px}.radius-slider.svelte-1uha8ag input[type=range]:where(.svelte-1uha8ag){width:calc(max(var(--preview-cell-size),50px) - 20px);height:1px;margin:0;background:transparent;-webkit-appearance:none;appearance:none;cursor:ew-resize}.radius-slider.svelte-1uha8ag input[type=range]:where(.svelte-1uha8ag)::-webkit-slider-runnable-track{height:1px;background:#4c6ef5;border-radius:999px}.radius-slider.svelte-1uha8ag input[type=range]:where(.svelte-1uha8ag)::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:10px;height:10px;border-radius:999px;background:#4c6ef5;margin-top:-4.5px}.radius-slider.svelte-1uha8ag input[type=range]:where(.svelte-1uha8ag)::-moz-range-track{height:1px;background:#4c6ef5;border-radius:999px}.radius-slider.svelte-1uha8ag input[type=range]:where(.svelte-1uha8ag)::-moz-range-thumb{width:10px;height:10px;border-radius:999px;background:#4c6ef5;border:none}.radius-end.svelte-1uha8ag{width:8px;height:8px;background:#000;flex:0 0 auto}.radius-end.circle.svelte-1uha8ag{border-radius:999px}.resize-handle.svelte-1uha8ag{position:absolute;right:-16px;bottom:-16px;width:14px;height:14px;border-radius:4px;background:#4c6ef5;border:2px solid white;box-shadow:0 4px 8px #0f172a40;cursor:nwse-resize;z-index:2}.grid-resize-wrapper.svelte-1uha8ag{position:relative;width:fit-content}.grid-resize-handle.svelte-1uha8ag{position:absolute;right:-18px;bottom:-18px;width:16px;height:16px;border-radius:4px;background:#4c6ef5;border:2px solid white;box-shadow:0 4px 8px #0f172a40;cursor:nwse-resize}input[type=range].svelte-1uha8ag{accent-color:#4c6ef5}.actions-panel.svelte-1uha8ag{display:none}.actions-toolbar.svelte-1uha8ag{display:flex;gap:.75rem;align-items:center;margin:1rem 0 .5rem;flex-wrap:wrap}.actions-toolbar.svelte-1uha8ag button:where(.svelte-1uha8ag){border:none;border-radius:999px;padding:.55rem 1rem;background:#2b323b;color:#fff;font-size:.9rem;cursor:pointer}.actions-toolbar.svelte-1uha8ag button:where(.svelte-1uha8ag):first-child{background:#e03131}.actions-toolbar.svelte-1uha8ag button:where(.svelte-1uha8ag):nth-child(2){background:#12b886}.actions-toolbar.svelte-1uha8ag button:where(.svelte-1uha8ag):nth-child(3){background:#4c6ef5}.export-actions.svelte-1uha8ag{display:flex;gap:.75rem;align-items:center;margin-bottom:.75rem}.export-actions.svelte-1uha8ag button:where(.svelte-1uha8ag){border:none;border-radius:999px;padding:.55rem 1rem;background:#2b323b;color:#fff;font-size:.9rem;cursor:pointer}.export-actions.svelte-1uha8ag button:where(.svelte-1uha8ag):first-child{background:#12b886}.export-actions.svelte-1uha8ag button:where(.svelte-1uha8ag):nth-child(2){background:#4c6ef5}details.svelte-1uha8ag summary:where(.svelte-1uha8ag){cursor:pointer;font-weight:600;color:#1f2933;padding:.35rem 0;list-style:none}details.svelte-1uha8ag summary:where(.svelte-1uha8ag):before{content:"▸";display:inline-block;margin-right:.5rem;transition:transform .2s ease}details[open].svelte-1uha8ag summary:where(.svelte-1uha8ag):before{transform:rotate(90deg)}details.svelte-1uha8ag summary:where(.svelte-1uha8ag)::-webkit-details-marker{display:none}.sr-only.svelte-1uha8ag{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}label.svelte-1uha8ag{display:flex;flex-direction:column;gap:.35rem;font-size:.9rem;color:#2b323b}input[type=color].svelte-1uha8ag{width:100%;border:1px solid #d0d7de;border-radius:.6rem;padding:.3rem;height:2.6rem}.status.svelte-1uha8ag{font-size:.85rem;color:#16a34a}.grid-panel.svelte-1uha8ag{margin-top:1.5rem;overflow:visible;padding:1rem;border-radius:1rem;border:1px solid #e2e8f0;background:#f8fafc;width:fit-content}.grid.svelte-1uha8ag{display:grid;width:fit-content}.grid.svelte-1uha8ag button:where(.svelte-1uha8ag){width:100%;height:100%;border-radius:var(--corner-radius, .35rem);border:1px solid #d9e2ec;background:#fff;cursor:pointer;padding:0}.grid.svelte-1uha8ag button.active:where(.svelte-1uha8ag){background:var(--fill-color, #2b323b);border-color:var(--fill-color, #2b323b)}.export.svelte-1uha8ag{display:flex;flex-direction:column;gap:.75rem}textarea.svelte-1uha8ag{width:100%;border-radius:.8rem;border:1px solid #d0d7de;padding:.75rem;font-family:SFMono-Regular,ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.85rem;min-height:220px;resize:vertical}
