:root{--bg:#f8fafc;--surface:#fff;--text:#0f172a;--muted:#475569;--border:#e2e8f0;--accent:#4f46e5;--accent-text:#fff;--warn-bg:#fef3c7;--warn-text:#92400e;--error:#b91c1c;color-scheme:light dark}@media (prefers-color-scheme:dark){:root{--bg:#0b1120;--surface:#111827;--text:#e5e7eb;--muted:#94a3b8;--border:#1f2937;--accent:#818cf8;--accent-text:#0b1120;--warn-bg:#422006;--warn-text:#fde68a;--error:#fca5a5}}*{box-sizing:border-box}body{background:var(--bg);color:var(--text);margin:0;font:16px/1.5 system-ui,-apple-system,Segoe UI,sans-serif}a{color:var(--accent)}.top{justify-content:space-between;align-items:center;max-width:72rem;margin:0 auto;padding:1rem;display:flex}.brand{color:var(--text);letter-spacing:-.02em;font-size:1.375rem;font-weight:700;text-decoration:none}main{max-width:72rem;margin:0 auto;padding:0 1rem 3rem}.intro h1{letter-spacing:-.02em;margin:1rem 0 .25rem;font-size:clamp(1.75rem,4vw,2.5rem)}.intro p{color:var(--muted);max-width:40rem;margin:0 0 1.5rem}.generator{grid-template-columns:minmax(0,1fr);gap:1.5rem;display:grid}.output{order:-1}@media (width>=52rem){.generator{grid-template-columns:minmax(0,1fr) minmax(0,24rem);align-items:start}.output{order:0;position:sticky;top:1rem}}.controls,.output{background:var(--surface);border:1px solid var(--border);border-radius:.75rem;padding:1.25rem}fieldset{border:0;border-top:1px solid var(--border);min-width:0;margin:0;padding:1rem 0 .5rem}fieldset:first-child{border-top:0;padding-top:0}legend{float:left;width:100%;margin-bottom:.5rem;padding:0;font-weight:600}legend+*{clear:both}.field{color:var(--muted);margin-bottom:.75rem;font-size:.875rem;display:block}.field input:not([type=range]),.field select,.field textarea{width:100%;font:inherit;color:var(--text);background:var(--bg);border:1px solid var(--border);border-radius:.5rem;margin-top:.25rem;padding:.5rem .625rem;display:block}.field input[type=range]{width:100%;accent-color:var(--accent);margin-top:.25rem;display:block}.check{align-items:center;gap:.5rem;margin-bottom:.75rem;font-size:.875rem;display:flex}.row{flex-wrap:wrap;gap:0 1rem;display:flex}.row .field{flex:8rem}.color{color:var(--muted);align-items:center;gap:.5rem;margin-bottom:.75rem;font-size:.875rem;display:flex}.color input{border:1px solid var(--border);background:0 0;border-radius:.375rem;width:2.5rem;height:2rem;padding:0}.tabs{flex-wrap:wrap;gap:.5rem;display:flex}.tabs label{text-align:center;border:1px solid var(--border);cursor:pointer;border-radius:.5rem;flex:1;padding:.5rem;font-weight:500}.tabs input{opacity:0;pointer-events:none;position:absolute}.tabs label:has(input:checked){border-color:var(--accent);color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent)}.tabs label:has(input:focus-visible){outline:2px solid var(--accent);outline-offset:2px}.preview{border:1px solid var(--border);background:#fff;border-radius:.5rem;place-items:center;padding:1rem;display:grid}.preview svg{width:100%;max-width:20rem;height:auto;display:block}.preview.placeholder svg{opacity:.25}.warnings{margin:.75rem 0 0;padding:0;list-style:none}.warnings li{background:var(--warn-bg);color:var(--warn-text);border-radius:.5rem;margin-bottom:.5rem;padding:.5rem .75rem;font-size:.875rem}.error{color:var(--error);font-size:.875rem}.downloads{gap:.5rem;margin-top:1rem;display:flex}.downloads button{font:inherit;color:var(--accent-text);background:var(--accent);cursor:pointer;border:0;border-radius:.5rem;flex:1;padding:.625rem;font-weight:600}.downloads button:disabled{opacity:.4;cursor:not-allowed}.hint{color:var(--muted);margin:.5rem 0 0;font-size:.8125rem}button.link{font:inherit;color:var(--accent);cursor:pointer;background:0 0;border:0;padding:0;font-size:.875rem;text-decoration:underline}.cta{border:1px solid var(--border);border-radius:.5rem;margin-top:1.25rem;padding:1rem;font-size:.875rem;transition:border-color .3s,box-shadow .3s}.cta p{margin:0 0 .75rem}.cta.after-export{border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb, var(--accent) 25%, transparent)}.cta-button{border:1px solid var(--accent);border-radius:.5rem;padding:.5rem .875rem;font-weight:600;text-decoration:none;display:inline-block}[hidden]{display:none!important}