:root{--ink:#0f172a;--muted:#64748b;--line:#dbe3ee;--canvas:#f4f7fb;--accent:#0f766e;--soft:#ccfbf1;--danger:#b91c1c;--shadow:0 24px 70px rgba(15,23,42,.12);--radius:20px}*{box-sizing:border-box}body{margin:0;min-width:320px;background:var(--canvas);color:var(--ink);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;line-height:1.55}button,input,textarea,select{font:inherit}button,select,input[type=color],input[type=range]{cursor:pointer}.container{width:min(1180px,calc(100% - 32px));margin-inline:auto}.hero{padding:68px 0 86px;background:radial-gradient(circle at 90% 0%,rgba(45,212,191,.22),transparent 36%),linear-gradient(135deg,#020617,#0f172a 55%,#134e4a);color:#fff}.hero-inner{display:flex;justify-content:space-between;align-items:flex-end;gap:36px}.eyebrow,.kicker{margin:0 0 8px;text-transform:uppercase;letter-spacing:.14em;font-size:.72rem;font-weight:900}.eyebrow{color:rgba(255,255,255,.66)}.kicker{color:var(--accent)}h1,h2,p{margin-top:0}.hero h1{max-width:800px;margin-bottom:18px;font-size:clamp(2.5rem,6vw,5.4rem);line-height:.96;letter-spacing:-.055em}.lead{max-width:760px;margin-bottom:0;color:rgba(255,255,255,.72);font-size:1.08rem}.privacy-badge{flex:0 0 auto;padding:12px 16px;border:1px solid rgba(255,255,255,.18);border-radius:999px;background:rgba(255,255,255,.08);font-size:.88rem;font-weight:700}.app-shell{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(340px,.75fr);gap:24px;align-items:start;margin-top:-42px;margin-bottom:56px}.panel{border:1px solid rgba(219,227,238,.95);border-radius:var(--radius);background:#fff;box-shadow:var(--shadow)}.editor-panel{padding:30px}.preview-panel{position:sticky;top:18px;padding:26px}.panel-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:18px;margin-bottom:22px}.panel-heading.small{margin-bottom:16px}.panel-heading h2{margin-bottom:0;font-size:1.5rem}.tabs{display:flex;gap:8px;margin-bottom:26px;padding-bottom:4px;overflow-x:auto}.tab{flex:0 0 auto;padding:10px 14px;border:1px solid var(--line);border-radius:999px;background:#fff;color:var(--muted);font-size:.9rem;font-weight:800}.tab.active{border-color:var(--accent);background:var(--accent);color:#fff}.form-section{min-height:180px}label{display:block;margin-bottom:7px;font-size:.9rem;font-weight:800}input,textarea,select{width:100%;border:1px solid #cbd5e1;border-radius:11px;background:#fff;color:var(--ink)}input,select{min-height:46px;padding:0 13px}textarea{min-height:110px;padding:12px 13px;resize:vertical}input:focus,textarea:focus,select:focus{outline:3px solid rgba(15,118,110,.18);border-color:var(--accent)}.help{margin:7px 0 0;color:var(--muted);font-size:.8rem}.help.right{text-align:right}.grid,.settings{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.top-space{margin-top:18px}.check{align-self:end;display:flex;align-items:center;gap:10px;min-height:46px;margin:0}.check input{width:18px;min-height:18px;accent-color:var(--accent)}.input-action{position:relative}.input-action input{padding-right:68px}.input-action button{position:absolute;top:50%;right:7px;transform:translateY(-50%);border:0;border-radius:7px;padding:6px 9px;background:#e2e8f0;font-size:.78rem;font-weight:800}.validation{min-height:24px;margin:13px 0 0;color:var(--danger);font-size:.88rem;font-weight:700}.customize{margin-top:12px;padding-top:26px;border-top:1px solid var(--line)}.settings{align-items:end}.wide{grid-column:span 2}.range-row,.color-row{display:flex;align-items:center;gap:12px}.range-row input{min-height:auto;padding:0;accent-color:var(--accent)}.range-row output,.color-row output{flex:0 0 auto;color:var(--muted);font-size:.82rem;font-weight:800}.color-row input{width:58px;height:46px;padding:4px}.button{min-height:43px;border:1px solid transparent;border-radius:11px;padding:10px 15px;font-weight:850}.button:disabled{cursor:not-allowed;opacity:.45}.primary{background:var(--accent);color:#fff}.dark{background:var(--ink);color:#fff}.ghost{border-color:var(--line);background:#fff;color:var(--ink)}.status{border-radius:999px;padding:7px 10px;background:var(--soft);color:#115e59;font-size:.74rem;font-weight:900}.status.warning{background:#fef3c7;color:#92400e}.qr-stage{min-height:360px;display:grid;place-items:center;margin-bottom:18px;padding:22px;border:1px dashed #b8c5d4;border-radius:16px;background:#f8fafc}#qrCode{display:grid;place-items:center;max-width:100%;overflow:hidden;border-radius:12px}#qrCode canvas,#qrCode svg{display:block;max-width:100%;height:auto}.downloads{display:grid;grid-template-columns:1fr 1fr;gap:10px}.downloads .full{grid-column:span 2}.payload-box{margin-top:18px;padding:16px;border-radius:13px;background:#f8fafc;border:1px solid var(--line)}.payload-box>div{display:flex;justify-content:space-between;gap:12px;margin-bottom:9px;font-size:.78rem}.payload-box span{color:var(--muted)}.payload-box code{display:block;max-height:150px;overflow:auto;color:#334155;font-size:.75rem;white-space:pre-wrap;overflow-wrap:anywhere}.privacy-note{margin:15px 0 0;color:var(--muted);font-size:.78rem}footer{padding:28px 0;border-top:1px solid var(--line);background:#fff;color:var(--muted);font-size:.88rem}@media(max-width:900px){.hero-inner{align-items:flex-start;flex-direction:column}.app-shell{grid-template-columns:1fr}.preview-panel{position:static}}@media(max-width:600px){.container{width:min(100% - 20px,1180px)}.hero{padding:48px 0 70px}.editor-panel,.preview-panel{padding:20px}.grid,.settings{grid-template-columns:1fr}.wide{grid-column:auto}.downloads{grid-template-columns:1fr}.downloads .full{grid-column:auto}.qr-stage{min-height:310px;padding:14px}}