*{box-sizing:border-box;margin:0;padding:0}:root{--primary: #0ea5e9;--primary-dark: #0284c7;--bg: #ffffff;--bg-alt: #f8fafc;--text: #0f172a;--text-muted: #64748b;--border: #e2e8f0;--success: #22c55e;--danger: #ef4444}.dev-indicator{position:fixed;top:8px;left:8px;background:#fef3c7;color:#92400e;padding:4px 10px;border-radius:4px;font-size:11px;font-weight:700;z-index:99999;border:1px solid #fcd34d;box-shadow:0 2px 8px #0000001a;font-family:monospace}body{font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;line-height:1.6;color:var(--text);background:var(--bg)}header{position:fixed;top:0;left:0;right:0;height:64px;background:#ffffffe6;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid var(--border);z-index:1000;display:flex;align-items:center;justify-content:space-between;padding:0 24px}.logo{font-size:20px;font-weight:700;color:var(--primary);display:flex;align-items:center;gap:8px;text-decoration:none}.logo svg{width:28px;height:28px}nav a{color:var(--text);text-decoration:none;font-weight:500;margin-left:24px}nav a:hover{color:var(--primary)}@media(max-width:768px){header{padding:0 16px}.logo{font-size:16px}.logo span{display:none}nav{display:flex;align-items:center;gap:0}nav a{margin-left:12px;font-size:13px}nav a.btn{padding:8px 12px;font-size:12px}@media(max-width:480px){nav a:not(.btn){display:none}nav a.btn{margin-left:0}}}.btn{display:inline-flex;align-items:center;gap:8px;padding:10px 20px;border-radius:8px;font-weight:500;font-size:14px;cursor:pointer;border:none;transition:all .15s;text-decoration:none}.btn-primary{background:var(--primary);color:#fff}.btn-primary:hover{background:var(--primary-dark)}.btn-outline{background:transparent;border:1px solid var(--border);color:var(--text)}.btn-outline:hover{border-color:var(--primary);color:var(--primary)}.btn-secondary{background:var(--bg-alt);border:1px solid var(--border);color:var(--text)}.btn-secondary:hover{border-color:var(--primary);color:var(--primary)}.btn-danger{background:var(--danger);color:#fff}.btn-danger:hover{background:#dc2626}.hero{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:120px 24px 80px;text-align:center;background:linear-gradient(180deg,var(--bg-alt) 0%,var(--bg) 100%)}.hero-content{max-width:800px}.hero h1{font-size:clamp(40px,8vw,72px);font-weight:700;line-height:1.1;margin-bottom:24px}.hero h1 span{color:var(--primary)}.hero p{font-size:20px;color:var(--text-muted);margin-bottom:40px;max-width:600px;margin-left:auto;margin-right:auto}.hero-buttons{display:flex;gap:16px;justify-content:center;flex-wrap:wrap}.demo-section{padding:80px 24px;background:var(--bg-alt);position:relative}.demo-container{max-width:1000px;margin:0 auto;text-align:center}.demo-container h2{font-size:36px;margin-bottom:16px}.demo-container p{color:var(--text-muted);margin-bottom:20px}.hero-hint{margin-top:20px;color:var(--text-muted);font-size:15px}.path-selector{display:flex;gap:24px;align-items:center;justify-content:center;margin-top:40px}.path-card{background:#fff;border:2px solid var(--border);border-radius:16px;padding:40px 32px;text-align:center;cursor:pointer;transition:all .3s ease;max-width:320px;flex:1}.path-card:hover{border-color:var(--primary);transform:translateY(-4px);box-shadow:0 12px 40px #0ea5e926}.path-icon{font-size:48px;margin-bottom:16px}.path-card h3{font-size:24px;margin-bottom:12px}.path-card p{color:var(--text-muted);font-size:15px;margin-bottom:24px;line-height:1.5}.path-divider{display:flex;align-items:center;color:var(--text-muted);font-size:14px;font-weight:500}.path-divider span{padding:0 16px}.flow-container{max-width:600px;margin:0 auto;animation:flowSlideIn .4s ease-out}@keyframes flowSlideIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.back-button{background:none;border:none;color:var(--primary);font-size:14px;cursor:pointer;padding:8px 0;margin-bottom:16px;display:flex;align-items:center;gap:4px}.back-button:hover{text-decoration:underline}.flow-header{display:flex;align-items:center;gap:12px;margin-bottom:32px}.flow-header .flow-icon{font-size:32px}.flow-header h2{font-size:28px;margin:0}.upload-dropzone{border:2px dashed var(--border);border-radius:16px;padding:48px 24px;text-align:center;transition:all .3s ease;position:relative;cursor:pointer;background:var(--bg-alt)}.upload-dropzone:hover,.upload-dropzone.dragging{border-color:var(--primary);background:#0ea5e90d}.upload-dropzone.uploading{pointer-events:none;opacity:.8}.upload-icon{font-size:48px;margin-bottom:16px}.upload-text{font-size:16px;margin-bottom:8px}.upload-hint{color:var(--text-muted);font-size:13px}.file-input{position:absolute;top:0;left:0;right:0;bottom:0;opacity:0;cursor:pointer}.upload-progress{display:flex;flex-direction:column;align-items:center;gap:12px}.spinner{width:40px;height:40px;border:3px solid var(--border);border-top-color:var(--primary);border-radius:50%;animation:spin 1s linear infinite}.upload-error{margin-top:16px;padding:12px 16px;background:#fef2f2;border:1px solid #fecaca;border-radius:8px;color:var(--danger);font-size:14px}.flow-info{margin-top:32px;padding:24px;background:var(--bg-alt);border-radius:12px}.flow-info h4{margin-bottom:12px;font-size:16px}.flow-info ol{margin-left:20px;color:var(--text-muted)}.flow-info li{margin-bottom:4px}.retention-note{margin-top:16px;padding-top:16px;border-top:1px solid var(--border);color:var(--text-muted);font-size:14px}.snippet-generator{background:var(--bg-alt);border-radius:12px;padding:24px}.snippet-options{display:flex;gap:16px;flex-wrap:wrap;margin-bottom:20px}.option-group{display:flex;flex-direction:column;gap:6px;flex:1;min-width:120px}.option-group label{font-size:12px;font-weight:600;text-transform:uppercase;color:var(--text-muted)}.option-group select{padding:10px 12px;border:1px solid var(--border);border-radius:8px;font-size:14px;background:#fff;cursor:pointer}.color-input-wrapper{display:flex;align-items:center;gap:8px;padding:6px 12px;background:#fff;border:1px solid var(--border);border-radius:8px}.color-input-wrapper input[type=color]{width:28px;height:28px;border:none;padding:0;background:none;cursor:pointer}.color-input-wrapper span{font-size:13px;font-family:monospace;color:var(--text-muted)}.snippet-code{position:relative;background:#1e293b;border-radius:8px;padding:16px;margin-top:16px}.snippet-code pre{margin:0;overflow-x:auto}.snippet-code code{color:#e2e8f0;font-size:13px;font-family:Fira Code,Consolas,monospace;white-space:pre}.copy-button{position:absolute;top:12px;right:12px;padding:8px 16px;background:var(--primary);color:#fff;border:none;border-radius:6px;font-size:13px;cursor:pointer;transition:all .2s}.copy-button:hover{background:var(--primary-dark)}.copy-button.copied{background:var(--success)}.snippet-preview{margin-top:24px}.snippet-preview h4{margin-bottom:12px;font-size:14px;color:var(--text-muted)}.preview-frame{background:#f1f5f9;border-radius:8px;padding:16px}.preview-mockup{position:relative;background:#fff;border-radius:8px;height:120px;border:1px solid var(--border);overflow:hidden}.preview-header{height:20px;background:#e2e8f0;border-bottom:1px solid var(--border)}.preview-content{display:flex;gap:8px;padding:12px}.preview-content:before,.preview-content:after{content:"";height:8px;background:#e2e8f0;border-radius:4px}.preview-content:before{width:60%}.preview-content:after{width:30%}.preview-fab{position:absolute;width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-size:18px;box-shadow:0 4px 12px #0003;transition:transform .2s}.preview-fab:hover{transform:scale(1.1)}.preview-fab.bottom-right{bottom:12px;right:12px}.preview-fab.bottom-left{bottom:12px;left:12px}.preview-fab.top-right{top:32px;right:12px}.preview-fab.top-left{top:32px;left:12px}.embed-info{text-align:center}.demo-note{color:var(--success);font-weight:500;margin-bottom:8px!important}.signup-note{color:var(--text-muted)}.immersive-flow{position:fixed;top:0;left:0;right:0;bottom:0;z-index:9999;background:linear-gradient(180deg,#f0f9ff,#fff);display:flex;flex-direction:column;overflow:hidden;animation:flowFadeIn .3s ease-out}@keyframes flowFadeIn{0%{opacity:0;transform:scale(.98)}to{opacity:1;transform:scale(1)}}.flow-app-header{display:flex;align-items:center;justify-content:space-between;padding:16px 24px;background:#fff;border-bottom:1px solid var(--border);box-shadow:0 1px 3px #0000000d}.flow-app-header .back-link{display:inline-flex;align-items:center;line-height:1;padding:8px 12px}.flow-app-header .back-link svg{vertical-align:middle}.back-link{display:flex;align-items:center;gap:6px;color:var(--text-muted);background:none;border:none;font-size:15px;cursor:pointer;padding:8px 12px;border-radius:8px;transition:all .2s;line-height:1}.back-link svg{flex-shrink:0;vertical-align:middle}.back-link:hover{background:var(--bg-alt);color:var(--text)}.flow-title{display:flex;align-items:center;gap:10px;font-size:18px;font-weight:600}.flow-icon-small{font-size:24px}.flow-spacer{width:100px}.flow-app-main{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:32px;overflow-y:auto}.drop-zone-full{width:100%;max-width:600px;padding:80px 48px;border:3px dashed var(--border);border-radius:24px;text-align:center;background:#fff;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 24px #0000000a}.drop-zone-full:hover,.drop-zone-full.dragover{border-color:var(--primary);background:#0ea5e908;transform:translateY(-2px);box-shadow:0 8px 32px #0ea5e91f}.drop-zone-full .drop-icon{width:80px;height:80px;color:var(--primary);margin-bottom:24px}.drop-zone-full h2{font-size:28px;margin-bottom:12px;color:var(--text)}.drop-zone-full p{color:var(--text-muted);font-size:16px;margin-bottom:8px}.paste-hint{color:var(--text-muted);font-size:14px;margin:20px 0;opacity:.7}.btn-lg{padding:14px 32px;font-size:16px}.size-hint{font-size:13px;color:var(--text-muted);margin-top:16px;opacity:.8}.file-input-hidden{display:none}.flow-error{margin-top:16px;padding:14px 20px;background:#fef2f2;border:1px solid #fecaca;border-radius:12px;color:var(--danger);font-size:14px;max-width:600px;text-align:center}.preview-full{width:100%;max-width:900px;background:#fff;border-radius:16px;box-shadow:0 4px 24px #00000014;overflow:hidden}.preview-toolbar{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;background:var(--bg-alt);border-bottom:1px solid var(--border)}.preview-filename{display:flex;align-items:center;gap:8px;font-size:14px;color:var(--text-muted)}.preview-actions-bar{display:flex;gap:12px}.btn-ghost{background:transparent;color:var(--text-muted);border:none;padding:10px 16px;border-radius:8px;cursor:pointer;font-size:14px;transition:all .2s}.btn-ghost:hover{background:var(--bg-alt);color:var(--text)}.btn-spinner{display:inline-block;width:16px;height:16px;border:2px solid transparent;border-top-color:#fff;border-radius:50%;animation:spin .8s linear infinite;margin-right:8px}.preview-area{display:flex;align-items:center;justify-content:center;padding:32px;min-height:300px;max-height:60vh;overflow:auto;background:#f8fafc}.preview-img{max-width:100%;max-height:100%;border-radius:8px;box-shadow:0 2px 12px #0000001a}.pdf-preview{display:flex;flex-direction:column;align-items:center;gap:16px;padding:40px;background:#fff;border-radius:12px;border:1px solid var(--border)}.pdf-badge{background:#dc2626;color:#fff;padding:8px 20px;border-radius:6px;font-weight:700;font-size:18px}.share-full{text-align:center;max-width:500px;padding:40px}.success-badge{width:64px;height:64px;background:var(--success);border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;margin:0 auto 20px;animation:successPop .4s ease-out}@keyframes successPop{0%{transform:scale(0)}70%{transform:scale(1.2)}to{transform:scale(1)}}.share-full h2{font-size:28px;margin-bottom:8px}.share-full>p{color:var(--text-muted);margin-bottom:24px}.share-box{display:flex;gap:8px;margin-bottom:16px}.share-input{flex:1;padding:14px 16px;border:2px solid var(--border);border-radius:10px;font-size:14px;background:#fff}.share-input:focus{outline:none;border-color:var(--primary)}.btn-success{background:var(--success)!important}.retention-warning{font-size:14px;color:var(--text-muted);margin-bottom:24px}.retention-warning a{color:var(--primary)}.share-buttons{display:flex;gap:12px;justify-content:center;margin-bottom:24px}.signup-cta{margin-top:24px;padding-top:24px;border-top:1px solid var(--border)}.signup-cta p{margin-bottom:12px;color:var(--text-muted)}.retention-upsell{margin-top:32px;padding:24px;background:linear-gradient(135deg,#fef3c7,#fef9e7);border:2px solid #fbbf24;border-radius:16px;text-align:center}.upsell-header{display:flex;align-items:center;justify-content:center;gap:8px;margin-bottom:12px;font-size:18px}.upsell-icon{font-size:24px}.retention-upsell>p{color:var(--text-muted);margin-bottom:16px;font-size:15px}.upsell-benefits{display:flex;justify-content:center;gap:20px;flex-wrap:wrap;margin-bottom:20px}.upsell-benefits span{font-size:14px;color:#166534;font-weight:500}.upsell-btn{width:100%;max-width:280px}.upsell-fine-print{margin-top:12px;font-size:13px;color:var(--text-muted)}.signed-in-note{margin-top:24px;padding:12px 20px;background:#f0fdf4;border:1px solid #bbf7d0;border-radius:10px;color:#166534;font-weight:500;display:inline-flex;align-items:center;gap:8px}.loading-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#ffffffe6;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;z-index:10000}.spinner-large{width:48px;height:48px;border:4px solid var(--border);border-top-color:var(--primary);border-radius:50%;animation:spin 1s linear infinite}.embed-main{justify-content:flex-start;padding-top:48px}.embed-content{display:grid;grid-template-columns:1fr 1fr;gap:48px;max-width:1100px;width:100%}.embed-generator{background:#fff;padding:32px;border-radius:16px;box-shadow:0 4px 24px #0000000f}.embed-generator h2{font-size:24px;margin-bottom:8px}.embed-generator>p{color:var(--text-muted);margin-bottom:24px}.embed-options{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:24px}.color-picker{display:flex;align-items:center;gap:8px;padding:8px 12px;background:#fff;border:1px solid var(--border);border-radius:8px}.color-picker input[type=color]{width:28px;height:28px;border:none;padding:0;background:none;cursor:pointer}.color-hex{font-family:Fira Code,monospace;font-size:13px;color:var(--text-muted)}.code-block{position:relative;background:#1e293b;border-radius:12px;padding:20px;margin-bottom:20px}.code-block pre{margin:0;overflow-x:auto}.code-block code{color:#e2e8f0;font-size:13px;font-family:Fira Code,Consolas,monospace;white-space:pre}.copy-btn{position:absolute;top:12px;right:12px;padding:10px 18px;background:var(--primary);color:#fff;border:none;border-radius:8px;font-size:14px;cursor:pointer;transition:all .2s}.copy-btn:hover{background:var(--primary-dark)}.copy-btn.copied{background:var(--success)}.embed-notes{display:flex;flex-direction:column;gap:12px}.note-card{display:flex;align-items:flex-start;gap:12px;padding:14px 16px;border-radius:10px;text-align:left}.note-card .note-icon{font-size:18px;flex-shrink:0}.note-card div{display:flex;flex-direction:column;gap:2px}.note-card strong{font-size:14px;color:var(--text)}.note-card span:not(.note-icon){font-size:13px;color:var(--text-muted)}.demo-note-card{background:#f0fdf4;border:1px solid #bbf7d0}.demo-note-card strong{color:#166534}.upgrade-note-card{background:#f0f9ff;border:1px solid #bae6fd}.upgrade-note-card strong{color:#0369a1}.note-card.clickable{align-items:center;justify-content:space-between}.note-card.clickable div{flex:1}.note-card .btn-sm{padding:8px 16px;font-size:13px;flex-shrink:0}.embed-preview-section h3{margin-bottom:16px;color:var(--text-muted);font-size:14px;text-transform:uppercase;letter-spacing:.5px}.browser-mockup{background:#f1f5f9;border-radius:12px;overflow:hidden;box-shadow:0 4px 16px #00000014}.browser-bar{display:flex;align-items:center;gap:12px;padding:12px 16px;background:#e2e8f0;border-bottom:1px solid #cbd5e1}.browser-dots{display:flex;gap:6px}.browser-dots span{width:12px;height:12px;border-radius:50%;background:#cbd5e1}.browser-dots span:first-child{background:#f87171}.browser-dots span:nth-child(2){background:#fbbf24}.browser-dots span:last-child{background:#34d399}.browser-url{flex:1;padding:6px 12px;background:#fff;border-radius:6px;font-size:13px;color:var(--text-muted)}.browser-content{position:relative;height:280px;background:#fff;padding:24px}.mock-header{height:24px;width:50%;background:#e2e8f0;border-radius:4px;margin-bottom:16px}.mock-text{height:12px;width:80%;background:#e2e8f0;border-radius:4px;margin-bottom:8px}.mock-text.short{width:50%}.mock-fab{position:absolute;width:48px;height:48px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-size:22px;box-shadow:0 4px 16px #0003;transition:all .3s}.mock-fab.bottom-right{bottom:20px;right:20px}.mock-fab.bottom-left{bottom:20px;left:20px}.mock-fab.top-right{top:20px;right:20px}.mock-fab.top-left{top:20px;left:20px}.embed-cta{grid-column:1 / -1;text-align:center;padding:32px;background:linear-gradient(135deg,var(--primary) 0%,#38bdf8 100%);border-radius:16px;color:#fff}.embed-cta p{font-size:18px;margin-bottom:16px}.embed-cta .btn-primary{background:#fff;color:var(--primary)}.embed-cta .btn-primary:hover{background:#f0f9ff}.cta-hint{font-size:14px;opacity:.9;margin-top:12px}.feedback-callout{background:linear-gradient(90deg,#f0f9ff,#eff6ff);padding:24px 32px;border-top:1px solid var(--border);border-bottom:1px solid var(--border)}.feedback-content{max-width:800px;margin:0 auto;display:flex;align-items:center;gap:16px;text-align:left}.feedback-icon{font-size:32px}.feedback-content p{margin:0;color:var(--text-muted);font-size:15px}.feedback-content strong{color:var(--text)}@media(max-width:900px){.embed-content{grid-template-columns:1fr;gap:32px}.embed-options{grid-template-columns:1fr}}@media(max-width:768px){.flow-app-header{padding:12px 16px}.flow-title{font-size:16px}.flow-spacer{display:none}.flow-app-main{padding:20px}.drop-zone-full{padding:48px 24px}.drop-zone-full h2{font-size:22px}.drop-zone-full .drop-icon{width:56px;height:56px}.preview-toolbar{flex-direction:column;gap:12px;align-items:stretch}.preview-actions-bar{justify-content:stretch}.preview-actions-bar .btn{flex:1}.share-box,.share-buttons{flex-direction:column}.embed-generator{padding:20px}.feedback-content{flex-direction:column;text-align:center}}@media(max-width:768px){.path-selector{flex-direction:column;gap:16px}.path-divider{transform:rotate(90deg)}.path-card{max-width:none;width:100%}.snippet-options{flex-direction:column}.option-group{min-width:100%}}.hero{position:relative;overflow:visible;padding-bottom:80px}.demo-pointer{position:fixed;bottom:90px;right:24px;display:flex;flex-direction:column;align-items:flex-end;gap:4px;z-index:10;pointer-events:none;transition:opacity .6s ease-out}.demo-pointer-text{font-size:18px;font-weight:600;color:var(--primary);text-align:right;line-height:1.2;opacity:.9}.demo-pointer-arrow{width:40px;height:40px;color:var(--primary);opacity:.7}@media(max-width:768px){.demo-pointer{bottom:85px;right:20px}.demo-pointer-text{font-size:14px}.demo-pointer-arrow{width:30px;height:30px}}.use-cases{padding:80px 24px;background:#fff}.use-cases h2{text-align:center;font-size:36px;margin-bottom:48px}.use-case-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:32px;max-width:1000px;margin:0 auto}.use-case{text-align:center;padding:32px 24px;background:var(--bg-alt);border-radius:16px;border:1px solid var(--border);transition:transform .2s,box-shadow .2s}.use-case:hover{transform:translateY(-4px);box-shadow:0 12px 40px #0000001a}.use-case-icon{font-size:48px;margin-bottom:16px}.use-case h3{font-size:20px;margin-bottom:12px}.use-case p{color:var(--text-muted);font-size:15px}.how-it-works{padding:100px 24px}.how-it-works h2{text-align:center;font-size:36px;margin-bottom:60px}.steps{display:grid;grid-template-columns:repeat(2,1fr);gap:40px;max-width:1000px;margin:0 auto}.step{text-align:center}.steps-row{grid-column:1 / -1;display:flex;justify-content:center;gap:60px}.steps-row .step{max-width:320px}.step-number{width:48px;height:48px;background:var(--primary);color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:20px;font-weight:700;margin:0 auto 20px}.step h3{font-size:20px;margin-bottom:12px}.step p{color:var(--text-muted)}.step-with-generator{grid-column:1 / -1;max-width:600px;margin:0 auto}.inline-snippet-generator{margin-top:20px;text-align:left}.snippet-controls{display:flex;gap:16px;margin-bottom:12px;justify-content:center}.snippet-controls label{display:flex;flex-direction:column;gap:6px;font-size:12px;font-weight:600;text-transform:uppercase;color:var(--text-muted)}.snippet-controls select{padding:10px 14px;border:1px solid var(--border);border-radius:8px;font-size:14px;background:#fff;cursor:pointer;min-width:160px}.snippet-code-box{display:flex;align-items:stretch;background:#1e293b;border-radius:10px;overflow:hidden}.snippet-code-box code{flex:1;padding:14px 16px;color:#e2e8f0;font-size:12px;font-family:Fira Code,Consolas,monospace;overflow-x:auto;white-space:nowrap}.snippet-copy-btn{padding:14px 20px;background:var(--primary);color:#fff;border:none;font-size:14px;font-weight:500;cursor:pointer;transition:background .2s;white-space:nowrap}.snippet-copy-btn:hover{background:var(--primary-dark)}.snippet-hint{margin-top:12px;text-align:center;font-size:13px;color:var(--text-muted)}.snippet-hint a{color:var(--primary);font-weight:500}.trust-section{padding:40px 24px;background:var(--bg-alt);border-top:1px solid var(--border);border-bottom:1px solid var(--border)}.trust-badges{display:flex;justify-content:center;gap:40px;flex-wrap:wrap;max-width:900px;margin:0 auto}.trust-badge{display:flex;align-items:center;gap:8px;color:var(--text-muted);font-size:14px}.trust-badge svg{color:var(--primary);flex-shrink:0}.pricing-section{padding:100px 24px;background:#fff;text-align:center}.pricing-section h2{font-size:36px;margin-bottom:12px}.pricing-subtitle{color:var(--text-muted);font-size:18px;margin-bottom:48px}.pricing-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:24px;max-width:1000px;margin:0 auto}.pricing-card{background:#fff;border:1px solid var(--border);border-radius:16px;padding:32px;text-align:left;position:relative;transition:transform .2s,box-shadow .2s}.pricing-card:hover{transform:translateY(-4px);box-shadow:0 12px 40px #0000001a}.pricing-card.featured{border-color:var(--primary);border-width:2px}.pricing-badge{position:absolute;top:-12px;left:50%;transform:translate(-50%);background:var(--primary);color:#fff;padding:4px 16px;border-radius:12px;font-size:12px;font-weight:600}.pricing-header h3{font-size:24px;margin-bottom:8px}.pricing-price{font-size:48px;font-weight:700;color:var(--text);margin-bottom:24px}.pricing-price span{font-size:16px;font-weight:400;color:var(--text-muted)}.pricing-features{list-style:none;padding:0;margin:0 0 24px}.pricing-features li{padding:8px 0;color:var(--text);border-bottom:1px solid var(--border)}.pricing-features li:last-child{border-bottom:none}.pricing-card .btn{width:100%}@media(max-width:768px){.pricing-section{padding:60px 16px}.pricing-section h2{font-size:28px}.pricing-grid{grid-template-columns:1fr;max-width:400px}}.login-section{padding:100px 24px;background:var(--bg-alt)}.login-box{max-width:420px;margin:0 auto;background:#fff;border-radius:16px;padding:40px;box-shadow:0 4px 24px #0000000f;border:1px solid var(--border)}.login-box h2{font-size:24px;margin-bottom:8px;text-align:center}.login-box p{color:var(--text-muted);text-align:center;margin-bottom:24px}.auth-embed{display:flex;flex-direction:column;align-items:center;gap:16px}.auth-buttons{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}.auth-signed-in{text-align:center}.auth-signed-in p{margin-bottom:16px;color:var(--text);font-weight:500}nav{display:flex;align-items:center;gap:8px}nav button{margin-left:8px}footer{padding:40px 24px;text-align:center;color:var(--text-muted);border-top:1px solid var(--border)}footer .footer-credit{font-size:15px;margin-bottom:12px}footer .footer-credit a{color:var(--primary);text-decoration:none;font-weight:600}footer .footer-credit a:hover{text-decoration:underline}footer .footer-tagline{display:block;font-size:13px;margin-top:4px;opacity:.8;font-style:italic}footer .footer-links{margin:16px 0}footer .footer-links a{color:var(--text-muted);text-decoration:none;margin:0 12px;font-size:14px}footer .footer-links a:hover{color:var(--primary);text-decoration:underline}footer .footer-copyright{font-size:12px;opacity:.6;margin-top:8px}footer .dev-version{font-size:11px;margin-top:12px;padding:6px 12px;background:#fef3c7;color:#92400e;border-radius:4px;display:inline-block;font-family:monospace}@media(max-width:600px){footer .footer-tagline{display:none}}.back-to-top{position:fixed;bottom:100px;right:24px;width:48px;height:48px;border-radius:24px;background:#fff;border:1px solid var(--border);box-shadow:0 4px 12px #0000001a;cursor:pointer;display:flex;align-items:center;justify-content:center;opacity:0;visibility:hidden;transform:translateY(10px);transition:all .3s;z-index:999}.back-to-top.visible{opacity:1;visibility:visible;transform:translateY(0)}.back-to-top:hover{background:var(--primary);border-color:var(--primary);color:#fff}.back-to-top svg{width:20px;height:20px}.dashboard-layout{min-height:100vh;background:var(--bg-alt)}.dashboard-header{position:sticky;top:0;z-index:100;background:#fffffff2;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid var(--border);padding:0 24px;height:64px;display:flex;align-items:center;justify-content:space-between}.user-info{display:flex;align-items:center;gap:16px}.plan-chip{background:#e0f2fe;color:#0369a1;font-weight:600;font-size:12px;padding:6px 10px;border-radius:999px;text-transform:uppercase;letter-spacing:.6px}.dashboard-main{max-width:1200px;margin:0 auto;padding:40px 24px}.dashboard-main h1{font-size:28px;margin-bottom:24px}.usage-section{background:#fff;border:1px solid var(--border);border-radius:16px;padding:24px;margin-bottom:32px}.usage-section h3{font-size:16px;color:var(--text-muted);margin-bottom:20px;font-weight:600}.usage-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:20px}.usage-card{display:flex;flex-direction:column;gap:8px}.usage-label{font-size:13px;font-weight:600;color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px}.usage-bar{height:8px;background:var(--bg-alt);border-radius:4px;overflow:hidden}.usage-fill{height:100%;background:linear-gradient(90deg,var(--primary) 0%,#38bdf8 100%);border-radius:4px;transition:width .4s ease}.usage-text{font-size:14px;color:var(--text);font-weight:500}.usage-value{font-size:20px;font-weight:700;color:var(--text)}.usage-upgrade-hint{margin-top:20px;padding-top:20px;border-top:1px solid var(--border);font-size:14px;color:var(--text-muted)}.link-btn{background:none;border:none;color:var(--primary);font-weight:600;cursor:pointer;padding:0;font-size:inherit}.link-btn:hover{text-decoration:underline}.sites-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:20px}.site-card{background:#fff;border-radius:12px;padding:20px;border:1px solid var(--border)}.site-card h3{font-size:18px;margin-bottom:4px}.site-domain{color:var(--text-muted);font-size:14px;margin-bottom:16px}.site-actions{display:flex;gap:8px;flex-wrap:wrap}.new-site-card{background:#fff;border:2px dashed var(--border);border-radius:12px;padding:40px 20px;display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;transition:border-color .2s}.new-site-card:hover{border-color:var(--primary)}.new-site-card span{font-size:32px;margin-bottom:8px}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:10000}.modal{background:#fff;border-radius:16px;padding:32px;width:90%;max-width:500px;max-height:90vh;overflow-y:auto}.modal h2{font-size:24px;margin-bottom:24px}.form-group{margin-bottom:20px}.form-group label{display:block;font-weight:500;margin-bottom:8px}.form-group input,.form-group select,.form-group textarea{width:100%;padding:12px;border:1px solid var(--border);border-radius:8px;font-size:14px;font-family:inherit}.form-group input:focus,.form-group select:focus,.form-group textarea:focus{outline:none;border-color:var(--primary)}.modal-actions{display:flex;gap:12px;justify-content:flex-end;margin-top:24px}.embed-code{background:var(--bg-alt);border:1px solid var(--border);border-radius:8px;padding:16px;font-family:Monaco,Menlo,monospace;font-size:13px;word-break:break-all;margin:16px 0}.loading{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:200px;color:var(--text-muted);text-align:center;padding:60px}.spinner{width:32px;height:32px;border:3px solid var(--border);border-top-color:var(--primary);border-radius:50%;animation:spin .6s linear infinite;margin:0 auto 16px}.error{color:var(--danger);padding:20px;text-align:center}.site-detail{background:#fff;border-radius:12px;padding:32px;border:1px solid var(--border)}.site-detail h2{font-size:24px;margin-bottom:8px}.site-detail .domain{color:var(--text-muted);margin-bottom:24px}.section-title{font-size:16px;font-weight:600;margin-bottom:12px;color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px}.back-link{display:inline-flex;align-items:center;gap:6px;color:var(--text-muted);text-decoration:none;font-size:14px;margin-bottom:24px}.back-link:hover{color:var(--primary)}.code-block{background:#1e293b;color:#e2e8f0;border-radius:8px;padding:16px;font-family:SF Mono,Monaco,Consolas,monospace;font-size:13px;overflow-x:auto;margin:16px 0}.code-block .tag{color:#7dd3fc}.code-block .attr{color:#fde68a}.code-block .value{color:#86efac}.page-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:32px}.page-header h1{font-size:28px}.empty-state{text-align:center;padding:80px 24px;background:#fff;border-radius:12px;border:1px solid var(--border)}.empty-state svg{width:64px;height:64px;color:var(--text-muted);margin-bottom:16px}.empty-state h2{font-size:20px;margin-bottom:8px}.empty-state p{color:var(--text-muted);margin-bottom:24px}.onboarding-guide{text-align:center;padding:48px 24px;background:linear-gradient(135deg,#f8f9ff,#fff,#f0f4ff);border-radius:16px;border:1px solid var(--border);max-width:700px;margin:0 auto}.onboarding-guide h2{font-size:20px;margin-bottom:32px;color:var(--text)}.onboarding-steps{display:flex;flex-direction:column;gap:16px;margin-bottom:32px;text-align:left}.onboarding-step{display:flex;align-items:flex-start;gap:16px;padding:16px;background:#fff;border-radius:12px;border:1px solid var(--border);transition:all .2s ease}.onboarding-step.active{border-color:var(--primary);box-shadow:0 0 0 3px #4b7bec1a}.step-number{width:36px;height:36px;border-radius:50%;background:var(--bg-alt);color:var(--text-muted);font-weight:600;font-size:16px;display:flex;align-items:center;justify-content:center;flex-shrink:0}.onboarding-step.active .step-number{background:var(--primary);color:#fff}.step-content h3{font-size:16px;margin-bottom:4px}.step-content p{color:var(--text-muted);font-size:14px;margin:0}.btn-lg{padding:14px 28px;font-size:16px}.onboarding-tip{margin-top:24px;color:var(--text-muted);font-size:14px}.onboarding-tip a{color:var(--primary);text-decoration:underline}.billing-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:16px;margin-top:16px}.billing-card{border:1px solid var(--border);border-radius:12px;padding:16px;background:var(--bg-alt);display:flex;flex-direction:column;gap:10px}.billing-card h3{font-size:16px;margin-bottom:4px}.billing-card p{color:var(--text-muted);font-size:13px}.text-muted{color:var(--text-muted)}.site-card{background:#fff;border-radius:12px;padding:24px;border:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;transition:box-shadow .15s}.site-card:hover{box-shadow:0 4px 12px #0000000d}.site-info h3{font-size:18px;margin-bottom:4px}.legal-page{min-height:100vh;display:flex;flex-direction:column}.legal-header{position:static;height:64px;background:var(--bg);border-bottom:1px solid var(--border);display:flex;align-items:center;padding:0 24px}.legal-content{flex:1;max-width:800px;margin:0 auto;padding:48px 24px}.legal-content h1{font-size:36px;margin-bottom:8px;color:var(--text)}.legal-content .last-updated{color:var(--text-muted);font-size:14px;margin-bottom:32px}.legal-content section{margin-bottom:32px}.legal-content h2{font-size:22px;margin-bottom:12px;color:var(--text)}.legal-content h3{font-size:16px;font-weight:600;margin:16px 0 8px;color:var(--text)}.legal-content p{color:var(--text-muted);margin-bottom:12px;line-height:1.7}.legal-content ul{margin:0 0 16px 24px;color:var(--text-muted)}.legal-content li{margin-bottom:8px;line-height:1.6}.legal-content strong{color:var(--text)}.legal-footer{border-top:1px solid var(--border);padding:24px;text-align:center;color:var(--text-muted);font-size:14px}.legal-footer nav{margin-top:12px}.legal-footer nav a{color:var(--primary);text-decoration:none;margin:0 12px}.legal-footer nav a:hover{text-decoration:underline}.faq-content{padding-bottom:60px}.faq-list{margin-top:32px}.faq-item{border:1px solid var(--border);border-radius:8px;margin-bottom:12px;overflow:hidden;background:#fff}.faq-question{width:100%;padding:18px 20px;background:none;border:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;text-align:left;font-size:16px;font-weight:500;color:var(--text);gap:16px}.faq-question:hover{background:var(--bg-alt)}.faq-chevron{transition:transform .2s ease;flex-shrink:0;color:var(--text-muted)}.faq-item.open .faq-chevron{transform:rotate(180deg)}.faq-answer{max-height:0;overflow:hidden;transition:max-height .3s ease}.faq-item.open .faq-answer{max-height:500px}.faq-answer-inner{padding:0 20px 18px;color:var(--text-muted)}.faq-answer-inner p{margin:0 0 12px;line-height:1.6}.faq-answer-inner p:last-child{margin-bottom:0}.faq-answer-inner ul{margin:8px 0;padding-left:20px}.faq-answer-inner li{margin-bottom:6px;line-height:1.5}.faq-answer-inner code{background:var(--bg-alt);padding:2px 6px;border-radius:4px;font-size:14px}.faq-answer-inner pre{background:var(--bg-alt);padding:12px 16px;border-radius:6px;overflow-x:auto;margin:12px 0}.faq-answer-inner pre code{background:none;padding:0}.faq-answer-inner a{color:var(--primary)}.faq-cta{margin-top:48px;text-align:center;padding:40px 24px;background:linear-gradient(135deg,#f0f4ff,#e8f0ff);border-radius:12px}.faq-cta h2{font-size:24px;margin-bottom:8px}.faq-cta p{color:var(--text-muted);margin-bottom:20px}.upload-page{min-height:100vh;background:var(--bg-alt)}.upload-header{position:static;background:#fff;border-bottom:1px solid var(--border);height:64px;display:flex;align-items:center;justify-content:space-between;padding:0 24px}.upload-main{max-width:800px;margin:0 auto;padding:60px 24px}.upload-title{text-align:center;margin-bottom:48px}.upload-title h1{font-size:32px;margin-bottom:12px}.upload-title p{color:var(--text-muted);font-size:18px}.drop-zone{background:#fff;border:2px dashed var(--border);border-radius:16px;padding:80px 40px;text-align:center;transition:all .2s;cursor:pointer}.drop-zone:hover,.drop-zone.dragover{border-color:var(--primary);background:#0ea5e905}.drop-zone.dragover{transform:scale(1.01)}.drop-zone svg{width:64px;height:64px;color:var(--text-muted);margin-bottom:20px}.drop-zone h2{font-size:20px;margin-bottom:8px}.drop-zone p{color:var(--text-muted);margin-bottom:24px}.drop-zone .or{color:var(--text-muted);margin:20px 0}.file-input{display:none}.preview-container{background:#fff;border-radius:16px;overflow:hidden;border:1px solid var(--border)}.preview-header-bar{padding:16px 24px;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between}.preview-filename{font-weight:600;display:flex;align-items:center;gap:8px}.preview-filename svg{width:20px;height:20px;color:var(--primary)}.preview-image-wrapper{position:relative;background:#f1f5f9;min-height:300px;max-height:500px;display:flex;align-items:center;justify-content:center;overflow:hidden}.preview-image{max-width:100%;max-height:500px;display:block}.pdf-placeholder{display:flex;flex-direction:column;align-items:center;gap:12px;padding:60px}.pdf-icon{font-size:48px;font-weight:700;color:var(--text-muted)}.pdf-name{color:var(--text-muted);font-size:14px}.preview-actions{padding:20px 24px;border-top:1px solid var(--border);display:flex;gap:12px;justify-content:flex-end}.share-section{background:#fff;border-radius:16px;padding:48px 32px;border:1px solid var(--border);text-align:center}.success-icon{width:64px;height:64px;background:#dcfce7;border-radius:32px;display:flex;align-items:center;justify-content:center;margin:0 auto 20px}.success-icon.local{background:#fef3c7}.success-icon.local svg{color:#d97706}.success-icon svg{width:32px;height:32px;color:var(--success)}.sync-status{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:20px;font-size:13px;font-weight:500;margin-bottom:16px}.sync-status.local{background:#fef3c7;color:#92400e}.sync-status.synced{background:#dcfce7;color:#166534}.share-section h2{margin-bottom:8px}.share-section p{color:var(--text-muted);margin-bottom:24px}.local-warning{display:flex;gap:12px;text-align:left;background:#fffbeb;border:1px solid #fcd34d;border-radius:8px;padding:16px;margin:20px auto;max-width:460px}.local-warning svg{color:#d97706;flex-shrink:0;margin-top:2px}.local-warning strong{display:block;color:#92400e;margin-bottom:8px}.local-warning ul{margin:0;padding-left:20px;font-size:13px;color:#78350f}.share-link-box{display:flex;gap:8px;max-width:500px;margin:0 auto}.share-link-input{flex:1;padding:12px 16px;border:1px solid var(--border);border-radius:8px;font-size:14px;background:var(--bg-alt)}.share-link-input:focus{outline:none;border-color:var(--primary)}.share-note{font-size:13px;color:var(--text-muted);margin-top:12px;text-align:center}.share-note a{color:var(--primary);text-decoration:none}.share-note a:hover{text-decoration:underline}.share-actions{margin-top:24px;display:flex;gap:12px;justify-content:center}.signup-prompt{margin-top:32px;padding:24px;background:linear-gradient(135deg,#f0f4ff,#e8f0ff);border-radius:12px;text-align:left;max-width:400px;margin-left:auto;margin-right:auto}.signup-prompt-header{display:flex;align-items:center;gap:8px;margin-bottom:12px}.signup-prompt-header svg{color:var(--primary)}.signup-prompt-header strong{font-size:16px;color:var(--text)}.signup-prompt p{margin-bottom:8px;color:var(--text-muted);font-size:14px}.signup-prompt ul{margin:0 0 16px;padding-left:0;list-style:none;font-size:14px}.signup-prompt li{color:var(--text);margin-bottom:4px}.signup-prompt .btn{width:100%}.loading-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#ffffffe6;display:flex;align-items:center;justify-content:center;flex-direction:column;z-index:1000}.spinner{width:40px;height:40px;border:3px solid var(--border);border-top-color:var(--primary);border-radius:50%;animation:spin .6s linear infinite;margin-bottom:16px}@keyframes spin{to{transform:rotate(360deg)}}.review-page{min-height:100vh;background:#1e293b;color:#f8fafc}.review-header{position:fixed;top:0;left:0;right:0;background:#1e293bf2;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid #334155;padding:0 24px;height:56px;display:flex;align-items:center;justify-content:space-between;z-index:100}.review-header .logo{color:var(--primary)}.review-header .header-right{display:flex;align-items:center;gap:16px}.review-header .filename{color:#94a3b8;font-size:14px}.review-header .btn-outline{border-color:#334155;color:#f8fafc}.review-header .btn-outline:hover{border-color:var(--primary);color:var(--primary)}.review-main{padding-top:56px;min-height:100vh;display:flex;align-items:center;justify-content:center}.review-container{padding:40px;display:flex;align-items:center;justify-content:center;max-width:100%;max-height:calc(100vh - 56px);overflow:auto}.review-container.zoomed{cursor:grab;align-items:flex-start;justify-content:flex-start}.review-container.zoomed.dragging{cursor:grabbing;-webkit-user-select:none;user-select:none}.review-image{max-width:90vw;max-height:85vh;box-shadow:0 25px 80px #00000080;border-radius:8px}.review-container.zoomed .review-image{max-width:none;max-height:none}.pdf-viewer{width:90vw;height:85vh}.pdf-frame{width:100%;height:100%;border:none;border-radius:8px}.pdf-pages{display:flex;flex-direction:column;align-items:center;padding:20px 0;gap:0}.pdf-page{position:relative;background:#fff;box-shadow:0 4px 24px #0000004d;border-radius:4px;overflow:visible}.pdf-page-canvas{display:block;border-radius:4px}.pdf-page-label{position:absolute;top:-24px;left:0;font-size:11px;color:#94a3b8;font-weight:500;letter-spacing:.02em}.pdf-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:400px;gap:16px;color:#64748b}.pdf-loading-spinner{width:40px;height:40px;border:3px solid #e2e8f0;border-top-color:#0ea5e9;border-radius:50%;animation:pdf-spin .8s linear infinite}@keyframes pdf-spin{to{transform:rotate(360deg)}}.pdf-fallback{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;min-height:400px;padding:40px;background:#f8fafc;border-radius:8px;text-align:center}.pdf-fallback svg{width:64px;height:64px;color:#64748b;margin-bottom:16px}.pdf-fallback h3{font-size:20px;color:#1e293b;margin-bottom:8px}.pdf-fallback p{color:#64748b;margin-bottom:20px}.error-state{text-align:center;padding:60px}.error-state svg{width:64px;height:64px;color:#94a3b8;margin-bottom:20px}.error-state h2{font-size:24px;margin-bottom:12px}.error-state p{color:#94a3b8;margin-bottom:24px}.zoom-controls{position:fixed;bottom:24px;left:50%;transform:translate(-50%);background:#1e293bf2;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid #334155;border-radius:8px;padding:8px;display:flex;gap:4px}.zoom-btn{width:36px;height:36px;border:none;background:transparent;color:#f8fafc;border-radius:6px;cursor:pointer;display:flex;align-items:center;justify-content:center}.zoom-btn:hover{background:#334155}.zoom-level{padding:0 12px;color:#94a3b8;font-size:14px;display:flex;align-items:center}.btn-sm{padding:6px 12px;font-size:13px}.press-content{padding-bottom:60px}.press-box{background:#fff;border:1px solid var(--border);border-radius:12px;padding:20px 24px;margin-bottom:16px;transition:all .15s ease}.press-box.copyable{cursor:pointer}.press-box.copyable:hover{border-color:var(--primary);box-shadow:0 2px 8px #4b7bec1a}.press-box-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.press-box-header h3{margin:0}.copy-hint{font-size:12px;color:var(--text-muted);transition:color .15s}.press-box.copyable:hover .copy-hint{color:var(--primary)}.press-box h3{font-size:14px;text-transform:uppercase;letter-spacing:.05em;color:var(--text-muted);margin-bottom:12px}.press-box p{margin:0;line-height:1.7}.press-box p+p{margin-top:12px}.press-quote{font-size:20px;font-weight:500;color:var(--text);font-style:italic}.press-features{list-style:none;padding:0;margin:0}.press-features li{padding:12px 0;border-bottom:1px solid var(--border)}.press-features li:last-child{border-bottom:none}.brand-asset.copyable{cursor:pointer}.brand-asset.copyable:hover .brand-preview{border-color:var(--primary)}.press-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:20px;margin-top:20px}.stat{background:linear-gradient(135deg,#f0f4ff,#e8f0ff);border-radius:12px;padding:24px;text-align:center}.stat-number{display:block;font-size:32px;font-weight:700;color:var(--primary);margin-bottom:4px}.stat-label{font-size:14px;color:var(--text-muted)}.brand-assets{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:20px;margin-top:20px}.brand-asset{text-align:center}.brand-preview{background:#fff;border:1px solid var(--border);border-radius:12px;padding:24px;margin-bottom:12px;display:flex;align-items:center;justify-content:center;min-height:120px}.logo-preview svg{color:var(--primary)}.color-preview{flex-direction:column;gap:12px}.color-swatch{width:60px;height:60px;border-radius:8px}.brand-asset h4{font-size:16px;margin-bottom:4px}.brand-asset p{font-size:14px;color:var(--text-muted);margin:0}