*,:before,:after{box-sizing:border-box;margin:0;padding:0}:root{--bg:#fff;--bg-secondary:#f8f9fa;--bg-tertiary:#f0f1f3;--text:#1a1a2e;--text-secondary:#6b7280;--border:#e5e7eb;--primary:#7c3aed;--primary-hover:#6d28d9;--primary-light:#7c3aed1a;--success:#10b981;--shadow-sm:0 1px 3px #00000014;--shadow-md:0 4px 12px #0000001a;--shadow-lg:0 8px 30px #0000001f;--radius:12px;--radius-sm:8px;color:var(--text);background:var(--bg-secondary);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;font-size:16px;line-height:1.6}body{flex-direction:column;min-height:100svh;display:flex}#app{flex-direction:column;width:100%;max-width:720px;min-height:100svh;margin:0 auto;padding:40px 24px;display:flex}header{text-align:center;margin-bottom:32px}header h1{letter-spacing:-.5px;background:linear-gradient(135deg, var(--primary), #ec4899);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;margin-bottom:8px;font-size:2.25rem;font-weight:700}.subtitle{color:var(--text-secondary);font-size:1.05rem}.user-area{justify-content:center;align-items:center;min-height:36px;margin-top:16px;display:flex}.btn-google:not([hidden]){border:1px solid var(--border);background:var(--bg);color:var(--text);cursor:pointer;border-radius:20px;align-items:center;gap:8px;padding:8px 18px;font-size:.9rem;font-weight:500;transition:all .2s;display:inline-flex}.btn-google:hover{background:var(--bg-tertiary);box-shadow:var(--shadow-sm)}.user-info:not([hidden]){align-items:center;gap:10px;display:flex}.user-avatar{object-fit:cover;border-radius:50%;width:32px;height:32px}.btn-logout{border:1px solid var(--border);color:var(--text-secondary);cursor:pointer;background:0 0;border-radius:14px;padding:4px 12px;font-size:.8rem;transition:all .2s}.btn-logout:hover{background:var(--bg-tertiary);color:var(--text)}main{flex-direction:column;flex:1;display:flex}.upload-zone{border:2px dashed var(--border);border-radius:var(--radius);text-align:center;cursor:pointer;background:var(--bg);padding:48px 24px;transition:all .25s}.upload-zone:hover{border-color:var(--primary);background:var(--primary-light)}.upload-zone.dragover{border-color:var(--primary);background:var(--primary-light);transform:scale(1.01)}.upload-content{flex-direction:column;align-items:center;gap:12px;display:flex}.upload-icon{color:var(--text-secondary);transition:color .25s}.upload-zone:hover .upload-icon{color:var(--primary)}.upload-text{color:var(--text-secondary);font-size:1.1rem}.upload-link{color:var(--primary);text-underline-offset:2px;font-weight:600;text-decoration:underline}.upload-hint{color:var(--text-secondary);opacity:.7;font-size:.85rem}.processing{background:var(--bg);border-radius:var(--radius);text-align:center;flex-direction:column;align-items:center;gap:16px;padding:48px 24px}.processing:not([hidden]){display:flex}.spinner{border:3px solid var(--border);border-top-color:var(--primary);border-radius:50%;width:40px;height:40px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.progress-text{color:var(--text-secondary);font-size:.95rem}.progress-bar-track{background:var(--bg-tertiary);border-radius:3px;width:100%;max-width:320px;height:6px;overflow:hidden}.progress-bar-fill{background:linear-gradient(90deg, var(--primary), #ec4899);border-radius:3px;width:0%;height:100%;transition:width .3s}.result{background:var(--bg);border-radius:var(--radius);box-shadow:var(--shadow-sm);overflow:hidden}.result-tabs{border-bottom:1px solid var(--border);display:flex}.tab{color:var(--text-secondary);cursor:pointer;background:0 0;border:none;flex:1;padding:12px;font-size:.9rem;font-weight:500;transition:all .2s;position:relative}.tab:hover{color:var(--text);background:var(--bg-secondary)}.tab.active{color:var(--primary)}.tab.active:after{content:"";background:var(--primary);border-radius:1px;height:2px;position:absolute;bottom:0;left:20%;right:20%}.result-viewport{background:repeating-conic-gradient(var(--bg-tertiary) 0% 25%, var(--bg) 0% 50%) 0 0 / 20px 20px;justify-content:center;align-items:center;min-height:300px;display:flex;position:relative}.panel{width:100%;display:none}.panel.active{justify-content:center;align-items:center;display:flex}.panel img{object-fit:contain;max-width:100%;max-height:500px;display:block}.result-actions{border-top:1px solid var(--border);flex-wrap:wrap;align-items:center;gap:12px;padding:16px 20px;display:flex}.image-info{color:var(--text-secondary);margin-right:auto;font-size:.85rem}.btn{border-radius:var(--radius-sm);cursor:pointer;border:none;align-items:center;gap:8px;padding:10px 20px;font-size:.9rem;font-weight:600;text-decoration:none;transition:all .2s;display:inline-flex}.btn-primary{background:var(--primary);color:#fff}.btn-primary:hover{background:var(--primary-hover);box-shadow:var(--shadow-md);transform:translateY(-1px)}.btn-secondary{background:var(--bg-tertiary);color:var(--text)}.btn-secondary:hover{background:var(--border)}.btn:disabled{opacity:.5;cursor:not-allowed;transform:none}footer{text-align:center;margin-top:32px;padding:16px 0}footer p{color:var(--text-secondary);opacity:.7;font-size:.85rem}@media (max-width:600px){#app{padding:24px 16px}header h1{font-size:1.75rem}.upload-zone{padding:32px 16px}.result-actions{flex-direction:column;align-items:stretch}.image-info{text-align:center;margin-right:0}.btn{justify-content:center}}.hidden{display:none!important}.btn-pricing-header{border:1px solid var(--primary);color:var(--primary);cursor:pointer;white-space:nowrap;background:0 0;border-radius:20px;margin-left:8px;padding:6px 14px;font-size:.85rem;font-weight:600;transition:all .2s}.btn-pricing-header:hover{background:var(--primary-light);box-shadow:var(--shadow-sm)}.plan-badge-header{border:1px solid var(--border);background:var(--bg-tertiary);color:var(--text-secondary);cursor:pointer;white-space:nowrap;border-radius:12px;padding:3px 10px;font-size:.78rem;font-weight:500;transition:all .2s}.plan-badge-header:hover,.plan-badge-header.badge-plus{border-color:var(--primary);color:var(--primary);background:var(--primary-light)}.plan-badge-header.badge-business{border-color:var(--success);color:var(--success);background:#10b98114}.pricing-overlay{z-index:1000;background:#00000080;padding:20px;position:fixed;top:0;bottom:0;left:0;right:0}.pricing-overlay:not([hidden]){justify-content:center;align-items:center;display:flex}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.pricing-modal{background:var(--bg);width:100%;max-width:820px;max-height:90vh;box-shadow:var(--shadow-lg);border-radius:16px;padding:32px;animation:.25s slideUp;position:relative;overflow-y:auto}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.pricing-close{color:var(--text-secondary);cursor:pointer;background:0 0;border:none;border-radius:6px;padding:4px 8px;font-size:1.6rem;line-height:1;transition:all .15s;position:absolute;top:12px;right:16px}.pricing-close:hover{background:var(--bg-tertiary);color:var(--text)}.pricing-header{text-align:center;margin-bottom:28px}.pricing-title{color:var(--text);margin-bottom:6px;font-size:1.6rem;font-weight:700}.pricing-subtitle{color:var(--text-secondary);font-size:.95rem}.plan-cards{grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:28px;display:grid}.plan-cards.plan-cards-single{grid-template-columns:minmax(280px,380px);justify-content:center}.plan-card{border:1px solid var(--border);background:var(--bg);border-radius:12px;flex-direction:column;padding:24px 20px;transition:all .2s;display:flex;position:relative}.plan-card:hover{box-shadow:var(--shadow-md)}.plan-card.highlighted{border:2px solid var(--primary);z-index:1;transform:scale(1.03);box-shadow:0 4px 20px #7c3aed26}.plan-badge{background:linear-gradient(135deg, var(--primary), #ec4899);color:#fff;white-space:nowrap;letter-spacing:.3px;border-radius:12px;padding:3px 14px;font-size:.75rem;font-weight:600;position:absolute;top:-12px;left:50%;transform:translate(-50%)}.plan-card-header{text-align:center;margin-bottom:16px;padding-top:4px}.plan-name{color:var(--text);margin-bottom:8px;font-size:1rem;font-weight:600}.plan-price-row{justify-content:center;align-items:baseline;gap:2px;margin-bottom:4px;display:flex}.plan-amount{color:var(--text);font-size:1.8rem;font-weight:700}.plan-period,.plan-attempts{color:var(--text-secondary);font-size:.85rem}.plan-features{flex:1;margin:0 0 20px;padding:0;list-style:none}.plan-features li{color:var(--text);align-items:center;gap:6px;padding:5px 0;font-size:.88rem;display:flex}.plan-features .feature-exclusive{color:var(--primary);font-weight:500}.plan-cta{cursor:pointer;text-align:center;border:none;border-radius:8px;width:100%;padding:10px 16px;font-size:.9rem;font-weight:600;transition:all .2s}.plan-cta.btn-primary{background:var(--primary);color:#fff}.plan-cta.btn-primary:hover{background:var(--primary-hover);box-shadow:var(--shadow-md);transform:translateY(-1px)}.plan-cta.btn-secondary{background:var(--bg-tertiary);color:var(--text);border:1px solid var(--border)}.plan-cta.btn-secondary:hover{background:var(--border)}.plan-cta.btn-free{color:var(--text-secondary);border:1px solid var(--border);background:0 0}.plan-cta.btn-free:hover{background:var(--bg-tertiary);color:var(--text)}.feature-table-scroll{-webkit-overflow-scrolling:touch;margin-bottom:20px;overflow-x:auto}.feature-table{border-collapse:collapse;width:100%;font-size:.88rem}.feature-table th,.feature-table td{text-align:center;border-bottom:1px solid var(--border);padding:10px 14px}.feature-table th{color:var(--text);padding-top:0;font-size:.85rem;font-weight:600}.feature-label-th{text-align:left!important}.feature-label{text-align:left;color:var(--text-secondary);font-size:.85rem}.col-plus{background:var(--primary-light);border-radius:4px}.feature-table .unit{color:var(--text-secondary);font-size:.78rem;font-weight:400}.check{color:var(--success);font-weight:600}.cross{color:var(--text-secondary);opacity:.5}.pricing-footer{text-align:center}.pricing-note{color:var(--text-secondary);opacity:.7;font-size:.82rem}.exhausted-zone{background:var(--bg);border-radius:var(--radius);text-align:center;border:2px dashed var(--border);padding:40px 24px}.exhausted-title{color:var(--text);margin-bottom:6px;font-size:1.4rem;font-weight:700}.exhausted-sub{color:var(--text-secondary);margin-bottom:24px;font-size:.95rem}.exhausted-cards{grid-template-columns:repeat(2,1fr);max-width:600px;margin:0 auto}.plan-card-lg .plan-amount{font-size:2rem}.login-prompt{border-top:1px solid var(--border);text-align:center;background:var(--bg-secondary);padding:20px}.login-prompt-body{flex-direction:column;align-items:center;gap:8px;display:flex}.login-prompt-title{color:var(--text);font-size:1rem;font-weight:600}.login-prompt-sub{color:var(--text-secondary);margin-bottom:4px;font-size:.85rem}.login-prompt-btn{margin-top:4px}.callout{border-radius:8px;align-items:center;gap:12px;margin-bottom:12px;padding:12px 16px;font-size:.88rem;animation:.25s slideUp;display:flex}.callout-warning{color:#92400e;background:#f59e0b1a;border:1px solid #f59e0b40}.callout-info{color:var(--text);background:#7c3aed14;border:1px solid #7c3aed33}.callout-text{flex:1}.callout-btn{cursor:pointer;white-space:nowrap;background:var(--primary);color:#fff;border:none;border-radius:6px;padding:6px 14px;font-size:.82rem;font-weight:600;transition:all .2s}.callout-btn:hover{background:var(--primary-hover)}.callout-close{cursor:pointer;color:inherit;opacity:.5;background:0 0;border:none;padding:0 4px;font-size:1.2rem;line-height:1}.callout-close:hover{opacity:1}@media (max-width:700px){.plan-cards{grid-template-columns:repeat(3,1fr);gap:10px}.plan-card{padding:16px 12px}.plan-amount{font-size:1.4rem}.pricing-modal{padding:24px 16px}.exhausted-cards{grid-template-columns:1fr;max-width:360px}}@media (max-width:540px){.plan-cards{grid-template-columns:1fr;max-width:340px;margin-left:auto;margin-right:auto}.plan-card.highlighted{order:-1;transform:none}.pricing-title{font-size:1.3rem}.pricing-overlay{padding:12px}.pricing-modal{padding:20px 14px}}.paypal-checkout-overlay{z-index:1000;background:#00000080;padding:20px;position:fixed;top:0;bottom:0;left:0;right:0}.paypal-checkout-overlay:not([hidden]){justify-content:center;align-items:center;display:flex}.paypal-checkout-modal{background:var(--bg);width:100%;max-width:440px;box-shadow:var(--shadow-lg);text-align:center;border-radius:16px;padding:32px;animation:.25s slideUp;position:relative}.paypal-checkout-close{color:var(--text-secondary);cursor:pointer;background:0 0;border:none;border-radius:6px;padding:4px 8px;font-size:1.6rem;line-height:1;transition:all .15s;position:absolute;top:12px;right:16px}.paypal-checkout-close:hover{background:var(--bg-tertiary);color:var(--text)}.paypal-checkout-title{color:var(--text);margin-bottom:8px;font-size:1.3rem;font-weight:700}.paypal-checkout-plan{color:var(--text);margin-bottom:4px;font-size:1rem;font-weight:600}.paypal-checkout-price{color:var(--primary);margin-bottom:24px;font-size:1.1rem;font-weight:700}.paypal-button-container{min-height:45px;margin-bottom:16px}.paypal-checkout-note{color:var(--text-secondary);opacity:.6;font-size:.8rem}.paypal-success-overlay{z-index:1001;background:#00000080;justify-content:center;align-items:center;padding:20px;display:flex;position:fixed;top:0;bottom:0;left:0;right:0}.paypal-success-modal{background:var(--bg);width:100%;max-width:400px;box-shadow:var(--shadow-lg);text-align:center;border-radius:16px;padding:40px 32px;animation:.25s slideUp}.paypal-success-icon{margin-bottom:16px;font-size:3rem}.paypal-success-modal h3{color:var(--text);margin-bottom:8px;font-size:1.3rem;font-weight:700}.paypal-success-modal p{color:var(--text-secondary);margin-bottom:4px;font-size:.95rem}.paypal-success-sub{margin-bottom:20px!important}.paypal-success-modal .btn{justify-content:center;min-width:160px;margin-top:8px}
