:root{--bg:#f8fafc;--border:#d8e2df;--ink:#123c3a;--label:#214a47;--muted:#63706e;--orange:#f97316;--teal:#0f766e;color:var(--ink);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-size:16px;font-weight:400;line-height:1.45}*{box-sizing:border-box}body{background:linear-gradient(135deg, #0f766e1a, transparent 34%), linear-gradient(315deg, #f9731621, transparent 30%), var(--bg);min-width:320px;margin:0}button,input,textarea{letter-spacing:0}#root{min-height:100svh}.app-shell{grid-template-columns:minmax(0,1.15fr) minmax(340px,.85fr);gap:24px;min-height:100svh;padding:24px;display:grid}.builder,.preview-panel{min-width:0}.builder{align-content:start;gap:22px;display:grid}.intro{gap:10px;display:grid}.brand-lockup{align-items:center;gap:16px;min-width:0;display:flex}.site-logo{border-radius:18px;flex:none;width:74px;height:74px;box-shadow:0 12px 28px #123c3a24}.eyebrow{color:var(--muted);text-transform:uppercase;align-items:center;gap:8px;margin:0;font-size:.84rem;font-weight:700;display:flex}.eyebrow-logo{border-radius:5px;width:18px;height:18px}.intro h1{color:var(--ink);margin:0;font-size:clamp(2.25rem,7vw,5.2rem);line-height:.95}.subhead{color:var(--muted);max-width:42rem;margin:0;font-size:1.04rem}.card-form{gap:16px;display:grid}.field-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;display:grid}.field{gap:7px;display:grid}.field span{color:var(--label);align-items:center;gap:8px;font-size:.9rem;font-weight:700;display:flex}input,textarea{border:1px solid var(--border);box-sizing:border-box;color:var(--ink);font:inherit;background:#fff;border-radius:8px;outline:none;width:100%;min-width:0;padding:13px 14px;transition:border-color .16s,box-shadow .16s}textarea{resize:vertical}input:focus,textarea:focus{border-color:var(--teal);box-shadow:0 0 0 4px #0f766e24}.upload-row,.action-row{flex-wrap:wrap;gap:10px;display:flex}.upload-button,button{cursor:pointer;font:inherit;border:0;border-radius:8px;justify-content:center;align-items:center;gap:8px;min-height:44px;padding:0 16px;font-weight:800;display:inline-flex}.upload-button{background:var(--ink);color:#fff;position:relative}.upload-button input{opacity:0;position:absolute;inset:0}.ghost-button,.secondary-button{color:#0f4f4a;background:#e6fffb}.primary-button{background:var(--orange);color:#281200;flex:124px}.secondary-button{flex:124px}button:disabled{cursor:not-allowed;filter:grayscale();opacity:.5}.text-button{color:var(--muted);background:0 0;min-height:auto;padding:6px 8px}.field-error{color:#b42318;margin:0;font-size:.9rem;font-weight:700}.field-hint{color:var(--muted);margin:-6px 0 0;font-size:.88rem;font-weight:700}.preview-panel{align-content:start;justify-items:center;gap:16px;display:grid}.share-card,.download-panel{border:1px solid var(--border);border-radius:8px;box-shadow:0 18px 50px #123c3a1a}.share-card{background:linear-gradient(#0f766e21,#0000 48%),linear-gradient(135deg,#fbfaf6 0%,#f7fbfa 100%);justify-items:stretch;gap:22px;width:min(100%,432px);min-height:640px;padding:30px 28px 28px;display:grid;position:relative;overflow:hidden}.share-card:before{background:linear-gradient(90deg, var(--teal), #22c55e, var(--orange));content:"";height:8px;position:absolute;inset:0 0 auto}.contact-card{min-width:0;padding-top:6px;display:grid}.card-topline{text-align:center;place-items:start center;gap:14px;min-width:0;display:grid}.avatar{color:var(--ink);background:#d9f99d;border:3px solid #ffffffe0;border-radius:20px;flex:none;justify-content:center;align-items:center;width:72px;height:72px;display:grid;overflow:hidden}.avatar img{object-fit:cover;width:100%;height:100%}.identity{gap:3px;min-width:0;display:grid}.identity h2{color:var(--ink);overflow-wrap:anywhere;margin:0;font-size:2.2rem;line-height:1}.identity p{font-size:1rem}.identity p,.contact-list p{color:var(--muted);overflow-wrap:anywhere;margin:0}.contact-list{gap:8px;display:grid}.contact-list p{align-items:center;gap:9px;min-width:0;line-height:1.25;display:flex}.contact-list span{min-width:0}.qr-card{justify-items:center;gap:10px;padding:0;display:grid}.scan-label{color:var(--label);margin:0;font-size:.98rem;font-weight:900}.qr-frame{background:linear-gradient(#fff, #fff) padding-box, linear-gradient(135deg, var(--teal), #22c55e, var(--orange)) border-box;border:5px solid #0000;border-radius:8px;width:min(300px,100%);max-width:100%;padding:2px;display:grid;overflow:hidden}.qr-frame>div{width:100%;height:auto}.qr-frame canvas{display:block;width:100%!important;height:auto!important}.qr-image{width:100%;height:auto;display:block}.card-note{color:var(--label);overflow-wrap:anywhere;border-top:1px solid #0f766e2e;margin:0;padding-top:10px;font-size:.88rem;font-weight:800}.details-card{background:#ffffff9e;border:1px solid #0f766e21;border-radius:8px;align-self:end;gap:12px;padding:16px;display:grid}.status{color:#b42318;margin:0;font-size:.95rem;font-weight:800}.status.ready{color:var(--teal)}.download-panel{box-sizing:border-box;background:#fff;justify-items:center;gap:14px;width:min(100%,432px);padding:18px;display:grid}@media (width<=860px){.app-shell{grid-template-columns:1fr;padding:18px}.field-grid{grid-template-columns:1fr}.share-card{justify-self:center}}@media (width<=430px){.app-shell{padding:12px}.download-panel{padding:16px}.brand-lockup{gap:12px}.site-logo{border-radius:14px;width:54px;height:54px}.intro h1{font-size:2.35rem}}