.settings-page{max-width:800px;margin:0 auto;padding:32px 0 80px}.settings-title{font-family:var(--font-heading,"Syne",sans-serif);color:var(--color-text-primary);margin:0 0 24px;font-size:26px;font-weight:700}.settings-tabs{border-bottom:1px solid var(--color-border-default);gap:4px;margin-bottom:32px;padding-bottom:0;display:flex}.settings-tab{color:var(--color-text-tertiary);cursor:pointer;background:0 0;border:none;border-bottom:2px solid #0000;align-items:center;gap:6px;margin-bottom:-1px;padding:10px 18px;font-size:13.5px;font-weight:500;transition:all .2s;display:flex}.settings-tab:hover{color:var(--color-text-secondary)}.settings-tab.active{color:var(--color-accent);border-bottom-color:var(--color-accent)}.settings-tab svg{opacity:.6}.settings-tab.active svg{opacity:1;stroke:var(--color-accent)}.subscription-page{max-width:720px;margin:0 auto;padding:20px 0 40px}.subscription-page[data-plan=pro]{--sub-color:#00e676;--sub-glow:#00e6761f;--sub-glow-strong:#00e67640;--sub-gradient:linear-gradient(135deg,#00e6760f 0%,transparent 60%);--sub-border:#00e6762e}.subscription-page[data-plan=premium]{--sub-color:#7c6efa;--sub-glow:#7c6efa1f;--sub-glow-strong:#7c6efa40;--sub-gradient:linear-gradient(135deg,#7c6efa0f 0%,transparent 60%);--sub-border:#7c6efa2e}.subscription-page[data-plan=free]{--sub-color:#7a7a8c;--sub-glow:#7a7a8c14;--sub-glow-strong:#7a7a8c26;--sub-gradient:linear-gradient(135deg,#7a7a8c0a 0%,transparent 60%);--sub-border:#7a7a8c1f}.sub-hero{text-align:center;border-radius:var(--radius-lg);border:1px solid var(--sub-border);background:var(--sub-gradient);margin-bottom:28px;padding:56px 28px 44px;position:relative;overflow:hidden}.sub-hero-glow{background:radial-gradient(ellipse,var(--sub-glow-strong),transparent 70%);pointer-events:none;width:300px;height:200px;position:absolute;top:-60px;left:50%;transform:translate(-50%)}.sub-hero-content{z-index:1;position:relative}.sub-hero-icon{color:var(--sub-color);filter:drop-shadow(0 0 20px var(--sub-glow-strong));margin-bottom:12px;font-size:38px}.sub-hero-plan{font-family:var(--font-display);letter-spacing:-.03em;color:var(--sub-color);text-shadow:0 0 40px var(--sub-glow-strong);margin:0 0 14px;font-size:42px;font-weight:800}.subscription-page[data-plan=pro] .sub-hero-plan{background:linear-gradient(135deg,#00e676,#00c853,#1aff85);-webkit-text-fill-color:transparent;text-shadow:none;filter:drop-shadow(0 0 30px #00e6764d);-webkit-background-clip:text;background-clip:text}.subscription-page[data-plan=premium] .sub-hero-plan{background:linear-gradient(135deg,#7c6efa,#aa6aff,#c084fc);-webkit-text-fill-color:transparent;text-shadow:none;filter:drop-shadow(0 0 30px #7c6efa4d);-webkit-background-clip:text;background-clip:text}.sub-hero-badge{text-transform:uppercase;letter-spacing:.06em;border-radius:20px;align-items:center;gap:7px;padding:5px 14px;font-size:12px;font-weight:600;display:inline-flex}.sub-hero-badge.active{background:var(--sub-glow);color:var(--sub-color);border:1px solid var(--sub-border)}.sub-hero-badge.cancelling{color:#f5a623;background:#f5a6231a;border:1px solid #f5a62340}.sub-hero-badge.inactive{color:var(--color-text-tertiary);border:1px solid var(--color-border-default);background:#7a7a8c14}.sub-hero-badge-dot{background:currentColor;border-radius:50%;width:7px;height:7px;animation:2s ease-in-out infinite sub-pulse}@keyframes sub-pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(.8)}}.sub-hero-since{color:var(--color-text-secondary);margin:16px 0 0;font-size:15px}.sub-hero-manage{border-radius:var(--radius-md);border:1px solid var(--sub-border);color:var(--sub-color);font-family:var(--font-display);cursor:pointer;background:0 0;align-items:center;gap:8px;margin-top:24px;padding:11px 24px;font-size:14px;font-weight:600;text-decoration:none;transition:all .25s;display:inline-flex}.sub-hero-manage:hover{background:var(--sub-glow);border-color:var(--sub-color)}.sub-hero-manage:disabled{opacity:.5;cursor:not-allowed}.sub-hero-cancel{color:#ff4d4d;border-color:#ff4d4d40}.sub-hero-cancel:hover{background:#ff4d4d14;border-color:#ff4d4d}.sub-hero-end-date{color:#f5a623;margin:12px 0 0;font-size:14px;font-weight:500}.sub-confirm-box{border-radius:var(--radius-md);background:#ff4d4d0a;border:1px solid #ff4d4d33;max-width:380px;margin-top:20px;margin-left:auto;margin-right:auto;padding:20px}.sub-confirm-text{color:var(--color-text-secondary);margin:0 0 16px;font-size:13px;line-height:1.5}.sub-confirm-actions{gap:10px;display:flex}.sub-confirm-yes{border-radius:var(--radius-md);color:#ff4d4d;cursor:pointer;background:#ff4d4d1a;border:1px solid #ff4d4d4d;flex:1;padding:10px 16px;font-size:13px;font-weight:600;transition:all .2s}.sub-confirm-yes:hover:not(:disabled){background:#ff4d4d2e;border-color:#ff4d4d}.sub-confirm-yes:disabled{opacity:.5;cursor:not-allowed}.sub-confirm-no{border-radius:var(--radius-md);border:1px solid var(--sub-border);color:var(--sub-color);cursor:pointer;background:0 0;flex:1;padding:10px 16px;font-size:13px;font-weight:600;transition:all .2s}.sub-confirm-no:hover:not(:disabled){background:var(--sub-glow);border-color:var(--sub-color)}.sub-quota-row{grid-template-columns:1fr 1fr;gap:16px;margin-bottom:28px;display:grid}.sub-quota-card{border-radius:var(--radius-lg);background:linear-gradient(145deg,#7c6efa14 0%,#5846dc0a 100%);border:1px solid #7c6efa33;flex-direction:column;justify-content:center;align-items:center;gap:16px;padding:28px 20px;display:flex;position:relative;overflow:hidden}.sub-quota-card:before{content:"";pointer-events:none;background:radial-gradient(#7c6efa14 0%,#0000 70%);width:140%;height:100%;position:absolute;top:-60%;left:-20%}.sub-quota-ring{width:130px;height:130px;position:relative}.sub-quota-svg{width:100%;height:100%}.sub-quota-progress{transition:stroke-dashoffset 1s cubic-bezier(.16,1,.3,1)}.sub-quota-center{flex-direction:column;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.sub-quota-value{font-family:var(--font-display);color:var(--color-text-primary);font-size:34px;font-weight:800;line-height:1}.sub-quota-max{color:var(--color-text-tertiary);font-size:13px;font-weight:500}.sub-quota-label{color:#a78bfae6;align-items:center;gap:6px;font-size:14px;font-weight:600;display:flex}.sub-quota-icon{font-size:15px}.sub-quota-bonus{color:#7c6efa;background:#7c6efa1a;border-radius:20px;padding:3px 10px;font-size:12px;font-weight:600}.sub-recharge-card{border-radius:var(--radius-lg);cursor:pointer;background:linear-gradient(145deg,#7c6efa14 0%,#5846dc0a 100%);border:1px solid #7c6efa33;flex-direction:column;align-items:center;gap:6px;padding:28px 20px;transition:border-color .3s,box-shadow .3s,transform .2s;display:flex;position:relative;overflow:hidden}.sub-recharge-card:before{content:"";pointer-events:none;background:radial-gradient(#7c6efa14 0%,#0000 70%);width:140%;height:100%;position:absolute;top:-60%;left:-20%}.sub-recharge-card:hover{border-color:#7c6efa73;transform:translateY(-2px);box-shadow:0 0 30px #7c6efa1f,0 0 60px #7c6efa0a}.sub-recharge-badge{letter-spacing:.12em;color:#fff;background:linear-gradient(135deg,#7c6efa,#6356e0);border-radius:20px;margin-bottom:4px;padding:3px 12px;font-size:10px;font-weight:700}.sub-recharge-amount{font-family:var(--font-display);background:linear-gradient(135deg,#b4a9ff,#7c6efa,#6356e0);-webkit-text-fill-color:transparent;filter:drop-shadow(0 0 16px #7c6efa59);-webkit-background-clip:text;font-size:42px;font-weight:800;line-height:1}.sub-recharge-label{color:#a78bfae6;letter-spacing:.02em;margin-bottom:4px;font-size:14px;font-weight:600}.sub-recharge-selling{color:var(--color-text-secondary);text-align:center;max-width:180px;font-size:12px;line-height:1.4}.sub-recharge-divider{background:#7c6efa33;width:40px;height:1px;margin:6px 0}.sub-recharge-price-row{align-items:baseline;gap:6px;display:flex}.sub-recharge-price{font-family:var(--font-display);color:var(--color-text-primary);font-size:20px;font-weight:800}.sub-recharge-unit{color:var(--color-text-tertiary);font-size:11px}.sub-recharge-btn{color:#fff;cursor:pointer;background:linear-gradient(135deg,#7c6efa,#5b4bd6);border:none;border-radius:10px;align-items:center;gap:7px;padding:10px 22px;font-size:13px;font-weight:700;transition:box-shadow .3s,transform .15s;display:flex;box-shadow:0 4px 16px #7c6efa4d}.sub-recharge-card:hover .sub-recharge-btn{transform:scale(1.04);box-shadow:0 6px 28px #7c6efa73}.sub-recharge-note{color:var(--color-text-tertiary);letter-spacing:.01em;margin-top:2px;font-size:10px}@media (max-width:600px){.sub-quota-row{grid-template-columns:1fr}}.sub-features{background:var(--color-elevated);border:1px solid var(--color-border-default);border-radius:var(--radius-lg);margin-bottom:28px;padding:28px}.sub-section-title{font-family:var(--font-display);color:var(--color-text-primary);margin:0 0 20px;font-size:17px;font-weight:700}.sub-features-grid{grid-template-columns:1fr 1fr;gap:14px;display:grid}.sub-feature-item{color:var(--color-text-secondary);align-items:center;gap:10px;font-size:14px;display:flex}.sub-feature-check{flex-shrink:0}.sub-billing{background:var(--color-elevated);border:1px solid var(--color-border-default);border-radius:var(--radius-lg);margin-bottom:28px;padding:28px}.sub-billing-grid{grid-template-columns:1fr 1fr;gap:20px;display:grid}.sub-billing-item{flex-direction:column;gap:4px;display:flex}.sub-billing-label{text-transform:uppercase;letter-spacing:.06em;color:var(--color-text-tertiary);font-size:11px;font-weight:600}.sub-billing-value{color:var(--color-text-primary);font-size:15px;font-weight:600}.sub-billing-promo{color:var(--sub-color);font-family:var(--font-mono);letter-spacing:.04em}.sub-invoices{background:var(--color-elevated);border:1px solid var(--color-border-default);border-radius:var(--radius-lg);margin-bottom:28px;padding:28px}.sub-invoices-table-wrap{overflow-x:auto}.sub-invoices-table{border-collapse:collapse;width:100%;font-size:13px}.sub-invoices-table th{text-align:left;text-transform:uppercase;letter-spacing:.06em;color:var(--color-text-tertiary);border-bottom:1px solid var(--color-border-subtle);padding:0 12px 12px 0;font-size:11px;font-weight:600}.sub-invoices-table td{color:var(--color-text-secondary);border-bottom:1px solid var(--color-border-subtle);padding:12px 12px 12px 0}.sub-invoices-table tr:last-child td{border-bottom:none}.sub-invoice-amount{font-family:var(--font-mono);color:var(--color-text-primary);font-weight:600}.sub-invoice-badge{border-radius:4px;padding:2px 8px;font-size:11px;font-weight:600;display:inline-block}.sub-invoice-badge.paid{color:#00e676;background:#00e6761a}.sub-invoice-badge.pending{color:#f5a623;background:#f5a6231a}.sub-invoice-badge.failed{color:#ff4d4d;background:#ff4d4d1a}.sub-invoice-pdf{color:var(--sub-color);align-items:center;gap:5px;font-size:12px;font-weight:500;text-decoration:none;transition:opacity .2s;display:inline-flex}.sub-invoice-pdf:hover{opacity:.7}.sub-free-cta{text-align:center;background:var(--color-elevated);border:1px solid var(--color-border-default);border-radius:var(--radius-lg);margin-top:28px;padding:48px 28px}.sub-free-cta p{color:var(--color-text-secondary);margin:0 0 20px;font-size:15px}.sub-free-btn{border-radius:var(--radius-md);background:var(--color-accent);color:#000;font-family:var(--font-display);padding:12px 28px;font-size:15px;font-weight:700;text-decoration:none;transition:opacity .2s,transform .2s;display:inline-block}.sub-free-btn:hover{opacity:.9;transform:translateY(-1px)}@media (max-width:640px){.subscription-page{padding:28px 0 60px}.sub-hero{padding:40px 20px 36px}.sub-hero-plan{font-size:34px}.sub-hero-icon{font-size:36px}.sub-quota-grid,.sub-features-grid,.sub-billing-grid{grid-template-columns:1fr}.sub-features,.sub-billing,.sub-invoices{padding:20px}}@media (max-width:480px){.subscription-page{padding:20px 0 48px}.sub-hero{padding:32px 16px 28px}.sub-hero-plan{font-size:28px}.sub-hero-icon{font-size:30px}.sub-hero-since{font-size:13px}.sub-hero-manage{padding:10px 18px;font-size:13px}.sub-hero-badge{padding:4px 12px;font-size:11px}.sub-section-title{font-size:15px}.sub-features,.sub-billing,.sub-invoices{padding:16px}.sub-quota-card{padding:20px 16px}.sub-quota-ring{width:90px;height:90px}.sub-quota-value{font-size:22px}.sub-confirm-box{padding:16px}.sub-confirm-actions{flex-direction:column}.sub-invoices-table{font-size:12px}.sub-invoices-table th{font-size:10px}.sub-free-cta{padding:32px 16px}}
