:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;color:#15313a;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;--heading:#15313a;--muted:#5a7078;--surface:#fff;--input:#fff;--border:#ccd9dd;--border-strong:#9db1b8;--accent:#087f7a;--accent-hover:#056b67;--accent-soft:#dff4f1;--focus:#19cec5;--error:#b83a45;--text-on-accent:#fff;background:#f4f7f8;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}:root[data-theme=dark]{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;color:#f4f9fa;--heading:#f4f9fa;--muted:#bfd0d5;--surface:#1d313c;--input:#203844;--border:#45606b;--border-strong:#66808a;--accent:#19cec5;--accent-hover:#5de0d8;--accent-soft:#1f575c;--focus:#19cec5;--error:#ff7b7b;background:#233946}*{box-sizing:border-box}html,body,#root{min-width:320px;min-height:100%;margin:0}body{min-height:100dvh}.designer{grid-template-rows:auto minmax(0,1fr);width:min(100% - 48px,1240px);max-width:100%;height:100dvh;min-height:0;margin:0 auto;padding:14px 0;display:grid}.app-header{border-bottom:1px solid var(--border);align-items:center;min-width:0;padding:0 0 12px;display:flex}.brand{align-items:center;gap:9px;min-width:0;display:flex}.brand>div{min-width:0}.brand img{object-fit:contain;flex:none;width:30px;height:30px;display:block}.brand h1{overflow-wrap:anywhere;margin:0;font-size:.98rem;line-height:1.1}.brand p{color:var(--muted);margin:2px 0 0;font-size:.68rem;line-height:1}.theme-toggle{width:1.9rem;min-width:1.9rem;min-height:1.9rem;color:var(--muted);background:0 0;border-color:#0000;margin-left:auto;padding:0;font-size:1rem}.workspace{grid-template-columns:minmax(440px,.95fr) minmax(500px,1.05fr);align-items:stretch;gap:clamp(32px,5vw,72px);min-width:0;min-height:0;padding-top:16px;display:grid}.controls{min-width:0;min-height:0;padding:0 12px 18px 0;overflow-y:auto}.control-section{border:0;min-width:0;margin:0;padding:0 0 14px}.control-section+.control-section{border-top:1px solid var(--border);padding-top:14px}h2,h3{color:var(--heading);overflow-wrap:anywhere;margin:0}h2{font-size:.92rem}h3{font-size:.84rem}label,legend,.field-label{min-width:0;max-width:100%;color:var(--heading);margin:9px 0 5px;font-size:.82rem;font-weight:650;display:block}.label-hint,.legend-hint{color:var(--muted);margin-left:7px;font-size:.75rem;font-weight:450}.legend-hint{white-space:nowrap}textarea{resize:vertical;width:100%;min-width:0;max-width:100%;min-height:72px;color:var(--heading);background:var(--input);border:1px solid var(--border-strong);font:inherit;border-radius:6px;padding:8px 10px;font-size:.9rem;line-height:1.35;display:block}textarea:hover,.color-fields input[type=text]:hover{border-color:#9ca3af}textarea:focus-visible,input:focus-visible,button:focus-visible{border-color:var(--accent);outline:3px solid var(--focus);outline-offset:1px}select,.controls input:not([type=range]):not([type=checkbox]):not([type=color]):not([type=file]){width:100%;min-width:0;max-width:100%;min-height:30px;color:var(--heading);background:var(--input);border:1px solid var(--border-strong);font:inherit;border-radius:6px;padding:5px 7px;font-size:.8rem;display:block}.controls details{min-width:0;color:var(--muted);margin-top:8px;font-size:.78rem}.controls summary{cursor:pointer}.controls pre{white-space:pre-wrap;overflow-wrap:anywhere;max-width:100%;max-height:8rem;overflow:auto}.inline-options{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:end;gap:8px;display:grid}.inline-options label:last-child{font-size:.78rem}.inline-options input[type=checkbox]{width:auto}.segmented-field{min-width:0;margin-top:10px}.segmented-field .field-label{margin:0 0 5px}.segmented{flex-wrap:wrap;gap:5px;min-width:0;max-width:100%;display:flex}.segmented button{border-color:var(--border-strong);min-height:40px;color:var(--heading);background:var(--input);padding:7px 11px;font-size:.78rem}.segmented button:hover:not(:disabled){border-color:var(--accent);color:var(--heading);background:var(--accent-soft)}.segmented button.active{border-color:var(--accent);color:var(--text-on-accent,#062f2d);background:var(--accent);box-shadow:inset 0 0 0 1px var(--accent)}.range-label{grid-template-columns:minmax(0,1fr) auto;min-width:0;display:grid}.range-label output{color:var(--muted);font-variant-numeric:tabular-nums}.range-label input{width:100%;min-width:0;accent-color:var(--accent);grid-column:1/-1;margin-top:5px}.error-text,.warning-text,.help-text,.export-note{overflow-wrap:anywhere;max-width:100%}.error-text,.warning-text{color:var(--error);margin:6px 0;font-size:.76rem}.controls .secondary{color:var(--heading);background:var(--input);border-color:var(--border-strong)}.level-options{grid-template-columns:repeat(4,1fr);margin-top:7px;display:grid}.level-option{cursor:pointer}.level-option input,.style-options input{opacity:0;position:absolute}.level-option span{border:1px solid var(--border-strong);text-align:center;border-right:0;place-items:center;min-height:34px;display:grid}.level-option:first-child span{border-radius:6px 0 0 6px}.level-option:last-child span{border-right:1px solid var(--border-strong);border-radius:0 6px 6px 0}.level-option strong{color:var(--heading);font-size:.82rem}.level-option small{display:none}.level-option input:checked+span{z-index:1;border-color:var(--accent);background:var(--accent-soft);position:relative}.level-option input:checked+span strong{color:var(--accent)}.level-option input:focus-visible+span,.style-options input:focus-visible+span{outline:3px solid var(--focus);outline-offset:2px}.selected-level{color:var(--muted);margin:5px 0 0;font-size:.75rem}.selected-level strong{color:var(--heading)}.color-fields{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px;min-width:0;display:grid}.color-fields label{min-width:0;margin:8px 0 0;font-size:.75rem}.color-fields label>span{min-width:0;max-width:100%;margin-top:4px;display:flex}.color-fields input[type=color]{border:1px solid var(--border-strong);background:var(--input);border-right:0;border-radius:6px 0 0 6px;width:32px;min-width:32px;height:32px;padding:2px}.color-fields input:not([type=color]){border:1px solid var(--border-strong);width:100%;min-width:0;color:var(--heading);background:var(--input);border-radius:0 6px 6px 0;flex:1 1 0;padding:0 7px;font:.78rem ui-monospace,monospace}.color-fields input[aria-invalid=true]{border-color:var(--error)}.check-option{cursor:pointer;align-items:center;gap:7px;margin-top:11px;display:flex}.check-option input{width:15px;height:15px;accent-color:var(--accent);margin:0}.check-option span{font-size:.8rem;font-weight:500}.style-control{margin-top:12px}.style-control .field-label{margin:0 0 5px;font-size:.75rem}.style-options{grid-template-columns:repeat(3,1fr);gap:6px;display:grid}.style-options label{cursor:pointer;margin:0}.style-options span{border:1px solid var(--border-strong);min-height:34px;color:var(--muted);text-align:center;border-radius:6px;place-items:center;padding:4px;font-size:.74rem;font-weight:600;display:grid}.style-options input:checked+span{border-color:var(--accent);color:var(--accent);background:var(--accent-soft)}.range-option{grid-template-columns:1fr auto;margin-top:10px;font-size:.78rem;display:grid}.range-option output{color:var(--muted);font-variant-numeric:tabular-nums}.range-option input{width:100%;height:16px;accent-color:var(--accent);grid-column:1/-1;margin:2px 0 0}.appearance-note{color:var(--muted);margin:8px 0 0;font-size:.72rem}.preview-panel{border:1px solid var(--border);background:var(--surface);border-radius:10px;flex-direction:column;min-width:0;min-height:0;padding:18px;display:flex;box-shadow:0 8px 28px #18201c0d}.preview-heading{justify-content:space-between;align-items:center;gap:12px;min-width:0;margin-bottom:10px;display:flex}.preview-heading>div,.preview-heading span{min-width:0}.section-label{color:var(--muted);letter-spacing:.07em;text-transform:uppercase;margin:0 0 2px;font-size:.66rem;font-weight:700}.preview-heading span{color:var(--muted);font-variant-numeric:tabular-nums;font-size:.75rem}.qr-preview{aspect-ratio:1;background:#fff;border:1px solid #e4e7e5;border-radius:7px;align-self:center;place-items:center;width:min(100%,100dvh - 220px);max-width:100%;max-height:100%;padding:clamp(14px,5%,34px);display:grid}.qr-preview.is-transparent{background-color:#f7f7f6;background-image:linear-gradient(45deg,#e3e5e3 25%,#0000 25%),linear-gradient(-45deg,#e3e5e3 25%,#0000 25%),linear-gradient(45deg,#0000 75%,#e3e5e3 75%),linear-gradient(-45deg,#0000 75%,#e3e5e3 75%);background-position:0 0,0 6px,6px -6px,-6px 0;background-size:12px 12px}.qr-preview img{width:100%;min-width:0;height:100%;image-rendering:pixelated;display:block}.qr-preview p{max-width:28ch;color:var(--error);overflow-wrap:anywhere;text-align:center;margin:0}.export-actions{justify-content:space-between;align-items:center;gap:16px;min-width:0;margin-top:auto;padding-top:12px;display:flex}.export-note{color:var(--muted);margin:3px 0 0;font-size:.72rem}.downloads{flex:none;gap:7px;display:flex}button{appearance:none;border:1px solid var(--accent);color:#fff;background:var(--accent);min-height:34px;font:inherit;cursor:pointer;border-radius:6px;padding:7px 10px;font-size:.78rem;font-weight:700}button:hover:not(:disabled){background:var(--accent-hover);border-color:var(--accent-hover)}button.secondary{color:var(--heading);background:var(--surface);border-color:var(--border-strong)}button.secondary:hover:not(:disabled){background:var(--input);border-color:#9ca3af}button:disabled{cursor:not-allowed;opacity:.45}@media (height<=720px) and (width>=761px){.controls{padding-right:12px;overflow-y:auto}.designer{height:auto;min-height:100dvh}.workspace{min-height:calc(100dvh - 60px)}.qr-preview{width:min(100%,100dvh - 190px)}}@media (width<=900px) and (width>=761px){.workspace{grid-template-columns:minmax(380px,1fr) minmax(360px,1fr);gap:24px}}@media (width<=760px){.designer{width:min(100% - 32px,560px);height:auto;min-height:100dvh;padding:20px 0}.workspace{grid-template-columns:minmax(0,1fr);gap:8px;padding-top:24px}.controls{padding-right:0;overflow:visible}.control-section{padding-bottom:22px}.control-section+.control-section{padding-top:20px}.preview-panel{margin-top:8px}.qr-preview{width:100%;max-height:none}textarea{min-height:108px}}@media (width<=520px){.segmented{overscroll-behavior-x:contain;scrollbar-width:thin;flex-wrap:nowrap;padding-bottom:3px;overflow-x:auto}.segmented button{flex:none;min-height:44px}}@media (width<=430px){.designer{width:min(100% - 24px,560px)}.export-actions{display:block}.downloads{margin-top:12px}.color-fields{grid-template-columns:minmax(0,1fr)}}