:root{--ink:#101828;--muted:#667085;--line:#e6e9f0;--surface:#ffffffeb;--brand:#3451db;--brand-dark:#243cb6;--brand-soft:#eef1ff;--success:#087a55;--danger:#b42318;--shadow:0 24px 70px #14214e1a}*{box-sizing:border-box}html{scroll-behavior:smooth}body{color:var(--ink);-webkit-font-smoothing:antialiased;background:#f7f8fc;margin:0;font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}button,input{font:inherit}button,label[for=logo-file]{-webkit-tap-highlight-color:transparent}.site-shell{min-height:100vh;padding:0 28px;position:relative;overflow:hidden}.background-orb{z-index:-1;filter:blur(4px);pointer-events:none;border-radius:999px;position:absolute}.orb-one{background:radial-gradient(circle,#5b70e530,#0000 68%);width:520px;height:520px;top:-300px;left:-120px}.orb-two{background:radial-gradient(circle,#3dcdab21,#0000 68%);width:560px;height:560px;top:380px;right:-330px}.topbar{border-bottom:1px solid #d0d5ddb8;justify-content:space-between;align-items:center;width:min(1180px,100%);height:88px;margin:0 auto;display:flex}.brand{color:inherit;align-items:center;gap:12px;text-decoration:none;display:flex}.brand-mark{color:#fff;background:linear-gradient(145deg,#4964e8,#263db3);border-radius:13px;place-items:center;width:44px;height:44px;display:grid;box-shadow:0 10px 24px #3451db3d}.brand>span:last-child{gap:2px;display:grid}.brand strong{letter-spacing:-.2px;font-size:16px}.brand small{color:var(--muted);font-size:12px}.privacy-pill{color:#166b51;background:#edfaf6db;border:1px solid #cce9df;border-radius:999px;align-items:center;gap:8px;padding:9px 13px;font-size:13px;font-weight:650;display:flex}.hero{text-align:center;width:min(880px,100%);margin:70px auto 52px}.eyebrow{color:var(--brand);letter-spacing:.05em;text-transform:uppercase;align-items:center;gap:8px;font-size:13px;font-weight:750;display:inline-flex}.eyebrow span{background:#3dcdab;border-radius:99px;width:7px;height:7px;box-shadow:0 0 0 5px #3dcdab21}.hero h1{color:#121a3a;letter-spacing:-.055em;margin:20px 0;font-size:clamp(42px,6vw,68px);line-height:1.04}.hero h1 span{color:var(--brand)}.hero p{max-width:660px;color:var(--muted);margin:0 auto;font-size:17px;line-height:1.65}.hero .creator-credit{color:#34417a;max-width:760px;margin:-4px auto 14px;font-size:14px;font-weight:750;line-height:1.5}.workspace{grid-template-columns:minmax(0,1.14fr) minmax(350px,.86fr);align-items:start;gap:28px;width:min(1180px,100%);margin:0 auto;display:grid}.workspace>*{min-width:0}.form-card,.preview-card{background:var(--surface);width:100%;min-width:0;box-shadow:var(--shadow);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border:1px solid #dee2ecf0;border-radius:24px}.form-card{padding:34px}.card-heading{align-items:center;gap:14px;margin-bottom:26px;display:flex}.card-heading.compact{margin-bottom:20px}.step-number{width:40px;height:40px;color:var(--brand);background:var(--brand-soft);border:1px solid #d9dfff;border-radius:12px;flex:none;place-items:center;font-size:13px;font-weight:800;display:grid}.card-heading h2,.preview-heading h2{letter-spacing:-.025em;margin:0;font-size:20px}.card-heading p{color:var(--muted);margin:4px 0 0;font-size:13px}.field{gap:8px;display:grid}.field+.field{margin-top:20px}.two-columns .field+.field{margin-top:0}.field label{font-size:13px;font-weight:750}.field label span{color:#e34d59}.field input{width:100%;height:50px;color:var(--ink);background:#fff;border:1px solid #d8dde8;border-radius:12px;outline:none;padding:0 15px;transition:border-color .18s,box-shadow .18s}.field input::placeholder{color:#98a2b3}.field input:focus{border-color:#7185ed;box-shadow:0 0 0 4px #3451db1a}.field small{color:#7b8495;font-size:12px}.input-wrap{position:relative}.input-wrap svg{color:#8b95a7;position:absolute;top:15px;left:15px}.input-wrap input{padding-left:45px}.two-columns{grid-template-columns:1fr 1fr;gap:16px;margin-top:20px;display:grid}.divider{background:var(--line);height:1px;margin:30px 0}.upload-box{background:#fafbfe;border:1.5px dashed #c9d0e1;border-radius:16px;align-items:center;gap:15px;min-width:0;min-height:96px;padding:16px;display:flex}.upload-box.has-logo{background:#f8f9ff;border-style:solid;border-color:#cbd3f3}.upload-box>img,.upload-icon{background:#fff;border:1px solid #dfe4ef;border-radius:13px;flex:none;width:56px;height:56px}.upload-box>img{object-fit:contain;padding:5px}.upload-icon{color:var(--brand);place-items:center;display:grid}.upload-copy{flex:1;gap:5px;min-width:0;display:grid}.upload-copy strong{text-overflow:ellipsis;white-space:nowrap;font-size:13px;overflow:hidden}.upload-copy span{color:var(--muted);font-size:11.5px;line-height:1.4}.upload-actions{align-items:center;gap:8px;display:flex}.browse-button,.remove-button{cursor:pointer;border-radius:9px;padding:9px 12px;font-size:12px;font-weight:750}.browse-button{color:var(--brand);background:#fff;border:1px solid #cfd6fb}.remove-button{color:var(--danger);background:0 0;border:0}#logo-file{opacity:0;pointer-events:none;width:1px;height:1px;position:absolute;overflow:hidden}.recommendation{background:#f3f5fb;border-radius:12px;grid-template-columns:auto 1fr;gap:10px;margin-top:13px;padding:12px 13px;display:grid}.recommendation span{color:#526178;text-transform:uppercase;font-size:11px;font-weight:800}.recommendation p{color:#697386;margin:0;font-size:11.5px;line-height:1.5}.error-message{color:#8f2018;background:#fff3f2;border:1px solid #f0c8c4;border-radius:11px;margin-top:16px;padding:12px 14px;font-size:13px;line-height:1.45}.generate-button,.download-button{cursor:pointer;border:0;border-radius:13px;justify-content:center;align-items:center;gap:10px;width:100%;height:54px;font-weight:800;transition:transform .18s,box-shadow .18s,background .18s;display:flex}.generate-button{color:#fff;background:linear-gradient(135deg,#3f5de5,#293fb6);margin-top:22px;box-shadow:0 14px 30px #3451db3d}.generate-button:hover,.download-button:hover{transform:translateY(-1px)}.generate-button:disabled{opacity:.7;cursor:wait}.preview-card{padding:28px;position:sticky;top:24px}.preview-heading{justify-content:space-between;align-items:flex-start;display:flex}.result-label{color:var(--brand);letter-spacing:.1em;text-transform:uppercase;margin-bottom:7px;font-size:11px;font-weight:800;display:block}.ready-badge{color:var(--success);background:#e9f8f2;border-radius:99px;padding:7px 10px;font-size:11px;font-weight:800}.qr-stage{aspect-ratio:1;background-color:#fafbfe;background-image:linear-gradient(45deg,#f4f5f9 25%,#0000 25%),linear-gradient(-45deg,#f4f5f9 25%,#0000 25%),linear-gradient(45deg,#0000 75%,#f4f5f9 75%),linear-gradient(-45deg,#0000 75%,#f4f5f9 75%);background-position:0 0,0 8px,8px -8px,-8px 0;background-repeat:repeat,repeat,repeat,repeat;background-size:16px 16px;background-attachment:scroll,scroll,scroll,scroll;background-origin:padding-box,padding-box,padding-box,padding-box;background-clip:border-box,border-box,border-box,border-box;border:1px solid #e1e5ef;border-radius:20px;place-items:center;width:100%;min-width:0;margin-top:24px;display:grid;position:relative;overflow:hidden}.qr-stage canvas{background:#fff;width:100%;min-width:0;max-width:100%;height:100%;display:none}.qr-stage canvas.visible{display:block}.empty-state{text-align:center;place-items:center;padding:30px;display:grid}.empty-icon{color:#8190a8;background:#ffffffd1;border:1px solid #dce1eb;border-radius:26px;place-items:center;width:102px;height:102px;margin-bottom:18px;display:grid;box-shadow:0 12px 26px #23315312}.empty-state strong{font-size:15px}.empty-state p{color:var(--muted);margin:7px 0 0;font-size:12px;line-height:1.5}.quality-list{grid-template-columns:repeat(3,1fr);gap:8px;margin-top:20px;display:grid}.quality-list>div{background:#f4f6fa;border-radius:11px;align-items:center;gap:9px;min-width:0;padding:11px 8px;display:flex}.quality-list>div>span,.quality-list>div>svg{width:28px;height:28px;color:var(--brand);background:#fff;border-radius:8px;flex:none;place-items:center;font-size:10px;font-weight:900;display:grid}.quality-list p{min-width:0;color:var(--muted);gap:2px;margin:0;font-size:8.5px;line-height:1.3;display:grid}.quality-list strong{color:#344054;text-overflow:ellipsis;white-space:nowrap;font-size:10px;overflow:hidden}.payload-preview{background:#f8f9fc;border:1px solid #e3e6ee;border-radius:13px;margin-top:18px;padding:14px}.payload-title{color:#667085;letter-spacing:.06em;text-transform:uppercase;justify-content:space-between;align-items:center;font-size:10px;font-weight:800;display:flex}.payload-title button{color:var(--brand);text-transform:none;cursor:pointer;background:0 0;border:0;align-items:center;gap:5px;padding:0;font-size:10px;font-weight:800;display:flex}.payload-preview pre{color:#344054;white-space:pre-wrap;word-break:break-word;margin:10px 0 0;font:11px/1.55 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;overflow:auto}.download-button{color:var(--brand);background:var(--brand-soft);box-shadow:none;border:1px solid #cfd6fb;margin-top:14px}.scan-note{color:#7a8495;text-align:center;margin:10px 0 0;font-size:10.5px}footer{width:min(1180px,100%);color:var(--muted);border-top:1px solid #d0d5ddb8;justify-content:space-between;align-items:center;margin:54px auto 0;padding:28px 0 36px;font-size:12px;display:flex}footer>div{color:#344054;align-items:center;gap:8px;font-weight:750;display:flex}footer p{margin:0}@media (max-width:920px){.workspace{grid-template-columns:1fr}.preview-card{width:100%;max-width:620px;margin:0 auto;position:static}.hero{margin-top:56px}}@media (max-width:640px){.site-shell{padding:0 16px}.topbar{height:76px}.privacy-pill{padding:8px;font-size:0}.brand small{display:none}.hero{text-align:left;margin:44px auto 36px}.hero h1{margin-top:16px;font-size:clamp(38px,12vw,52px)}.hero p{font-size:15px}.form-card,.preview-card{border-radius:19px;padding:22px}.two-columns{grid-template-columns:1fr}.two-columns .field+.field{margin-top:4px}.upload-box{flex-wrap:wrap;align-items:flex-start}.upload-actions{width:100%;padding-left:71px}.recommendation,.quality-list{grid-template-columns:1fr}.quality-list p{font-size:10px}.quality-list strong{font-size:11px}footer{flex-direction:column;align-items:flex-start;gap:10px}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition:none!important}}