:root{--bg:#f6f6fb;--surface:#fff;--surface-2:#f0f0f7;--text:#16151f;--muted:#5d5b6e;--border:#e2e1ec;--accent:#5b4bff;--accent-hover:#4a3ae6;--accent-soft:#ecebff;--warn-bg:#fff6e0;--warn-text:#7a5300;--radius:14px;--shadow:0 1px 2px #1412280a, 0 8px 24px #1412280f;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}@media (prefers-color-scheme:dark){:root{--bg:#0f0f14;--surface:#18181f;--surface-2:#22222b;--text:#ececf3;--muted:#a3a1b5;--border:#2e2d39;--accent:#8579ff;--accent-hover:#9a90ff;--accent-soft:#26234a;--warn-bg:#3a2e10;--warn-text:#f5d58a;--shadow:none;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}}*{box-sizing:border-box}[hidden]{display:none!important}html{-webkit-text-size-adjust:100%}body{background:var(--bg);color:var(--text);margin:0;font:16px/1.55 system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif}a{color:var(--accent)}.site-header,main,.site-footer{max-width:1180px;margin:0 auto;padding-inline:16px}.site-header{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px 20px;padding-block:16px;display:flex}.site-nav{flex-wrap:wrap;gap:4px;display:flex}.site-nav a{color:var(--muted);border-radius:8px;padding:6px 10px;font-size:.9rem;font-weight:500;text-decoration:none}.site-nav a:hover{color:var(--text);background:var(--surface-2)}.site-nav a[aria-current=page]{color:var(--accent);background:var(--accent-soft)}a.related{color:inherit;text-decoration:none;transition:border-color .15s}a.related:hover{border-color:var(--accent)}a.related h3{color:var(--accent)}.brand{color:var(--text);align-items:center;gap:10px;font-size:1.2rem;font-weight:600;text-decoration:none;display:inline-flex}.brand b{color:var(--accent)}.site-footer{color:var(--muted);text-align:center;padding-block:32px;font-size:.875rem}.hero{text-align:center;padding:16px 0 28px}.hero h1{letter-spacing:-.02em;margin:0 0 12px;font-size:clamp(1.8rem,4.5vw,2.8rem);line-height:1.15}.hero p{color:var(--muted);max-width:640px;margin:0 auto;font-size:1.05rem}.badges{flex-wrap:wrap;justify-content:center;gap:8px;margin-top:16px;padding:0;list-style:none;display:flex}.badges li{background:var(--accent-soft);color:var(--accent);border-radius:999px;padding:4px 12px;font-size:.85rem;font-weight:500}.tool{grid-template-columns:minmax(0,1fr) 380px;grid-template-areas:"content preview""options preview";align-items:start;gap:20px;display:grid}.content-panel{grid-area:content}.options-panel{grid-area:options}.preview-panel{grid-area:preview;position:sticky;top:16px}@media (width<=860px){.tool{grid-template-columns:minmax(0,1fr);grid-template-areas:"content""preview""options"}.preview-panel{position:static}}.panel{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);min-width:0;padding:20px}.tabs{flex-wrap:wrap;gap:6px;margin-bottom:18px;display:flex}.tab{border:1px solid var(--border);background:var(--surface-2);color:var(--text);font:inherit;cursor:pointer;border-radius:999px;padding:7px 14px;font-size:.9rem}.tab:hover{border-color:var(--accent)}.tab[aria-selected=true]{background:var(--accent);border-color:var(--accent);color:#fff}.type-form[hidden]{display:none}.type-form{gap:12px;display:grid}.row-2{grid-template-columns:1fr 1fr;gap:12px;display:grid}@media (width<=520px){.row-2{grid-template-columns:1fr}}label.field{color:var(--muted);gap:6px;font-size:.875rem;font-weight:500;display:grid}input[type=text],input[type=url],input[type=email],input[type=tel],input[type=password],textarea,select{width:100%;font:inherit;color:var(--text);background:var(--surface);border:1px solid var(--border);border-radius:10px;padding:10px 12px}textarea{resize:vertical;min-height:96px}input:focus-visible,textarea:focus-visible,select:focus-visible,button:focus-visible{outline:2px solid var(--accent);outline-offset:1px}.check{cursor:pointer;align-items:center;gap:8px;font-size:.9rem;display:flex}.check input{width:18px;height:18px;accent-color:var(--accent)}input[type=range]{width:100%;accent-color:var(--accent)}.color-field{align-items:center;gap:10px;display:flex}.color-field input[type=color]{border:1px solid var(--border);background:var(--surface);cursor:pointer;border-radius:10px;width:44px;height:44px;padding:3px}.color-field input[type=text]{text-transform:uppercase;max-width:120px;font-family:ui-monospace,SFMono-Regular,Consolas,monospace}.options-panel{padding:0}.options-panel details{border-bottom:1px solid var(--border)}.options-panel details:last-child{border-bottom:0}.options-panel summary{cursor:pointer;justify-content:space-between;align-items:center;padding:16px 20px;font-weight:600;list-style:none;display:flex}.options-panel summary::-webkit-details-marker{display:none}.options-panel summary:after{content:"+";color:var(--muted);font-size:1.2rem;font-weight:400}.options-panel details[open] summary:after{content:"–"}.section-body{gap:16px;padding:0 20px 20px;display:grid}.group-title{text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin:4px 0 -6px;font-size:.8rem;font-weight:600}.pills{flex-wrap:wrap;gap:6px;display:flex}.pills label{position:relative}.pills input{opacity:0;pointer-events:none;position:absolute}.pills span{border:1px solid var(--border);background:var(--surface-2);cursor:pointer;border-radius:8px;padding:6px 12px;font-size:.875rem;display:inline-block}.pills input:checked+span{background:var(--accent-soft);border-color:var(--accent);color:var(--accent);font-weight:600}.pills input:focus-visible+span{outline:2px solid var(--accent);outline-offset:1px}.presets{flex-wrap:wrap;gap:8px;display:flex}.preset{border:2px solid var(--border);cursor:pointer;border-radius:10px;width:40px;height:40px;padding:0}.preset:hover{border-color:var(--accent);transform:scale(1.06)}.dropzone{border:2px dashed var(--border);text-align:center;color:var(--muted);cursor:pointer;border-radius:12px;padding:18px;transition:border-color .15s,background .15s;display:block}.dropzone:hover,.dropzone.dragover{border-color:var(--accent);background:var(--accent-soft)}.dropzone strong{color:var(--accent)}.logo-current{align-items:center;gap:12px;display:flex}.logo-current[hidden]{display:none}.logo-current img{object-fit:contain;background:var(--surface-2);border:1px solid var(--border);border-radius:8px;width:48px;height:48px}.logo-current span{text-overflow:ellipsis;white-space:nowrap;flex:1;font-size:.875rem;overflow:hidden}.hint{color:var(--muted);margin:0;font-size:.8rem}.qr-box{aspect-ratio:1;background:repeating-conic-gradient(var(--surface-2) 0% 25%, transparent 0% 50%) 50% / 20px 20px;border-radius:12px;place-items:center;width:100%;display:grid;overflow:hidden}.qr-box svg,.qr-box canvas{display:block;width:100%!important;height:100%!important}.warning{background:var(--warn-bg);color:var(--warn-text);border-radius:10px;margin-top:12px;padding:10px 12px;font-size:.85rem}.warning[hidden]{display:none}.export{gap:12px;margin-top:16px;display:grid}.downloads{grid-template-columns:repeat(4,1fr);gap:6px;display:grid}.btn{font:inherit;border:1px solid var(--border);background:var(--surface-2);color:var(--text);cursor:pointer;border-radius:10px;padding:11px 14px;font-weight:600}.btn:hover{border-color:var(--accent)}.btn-primary{background:var(--accent);border-color:var(--accent);color:#fff;width:100%;font-size:1.02rem}.btn-primary:hover{background:var(--accent-hover)}.btn-small{padding:6px 10px;font-size:.85rem}.privacy-note{color:var(--muted);text-align:center;margin:4px 0 0;font-size:.8rem}.article{max-width:780px;margin:56px auto 0}.article h2{letter-spacing:-.01em;margin:40px 0 12px;font-size:1.6rem}.article h3{margin:24px 0 6px;font-size:1.1rem}.article p,.article li{color:var(--muted)}.article ol li,.article ul li{margin-bottom:6px}.article strong{color:var(--text)}.features{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px;margin-top:16px;display:grid}.feature{background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:16px}.feature h3{margin:0 0 6px;font-size:1rem}.feature p{margin:0;font-size:.92rem}.faq details{background:var(--surface);border:1px solid var(--border);border-radius:12px;margin-bottom:10px;padding:14px 16px}.faq summary{cursor:pointer;font-weight:600}.faq details p{margin:10px 0 0}
