.settings-page{min-height:100vh;padding:clamp(7rem,11vw,9rem)var(--layout-gutter)var(--layout-section-space);color:var(--color-text);background:radial-gradient(circle at 10% 10%,var(--color-glow-primary),transparent 28rem),var(--color-bg-canvas);position:relative}.settings-container{width:min(100%,var(--layout-content-width));margin-left:auto;margin-right:auto}.settings-loading{justify-content:center;align-items:center;gap:var(--space-4);min-height:60vh;color:var(--color-text-muted);background:var(--color-bg-canvas);flex-direction:column;display:flex}.settings-loading .spinner{width:3rem;height:3rem;color:var(--color-info);animation:.9s linear infinite settings-spin}.settings-layout{gap:var(--space-6);grid-template-columns:17rem minmax(0,1fr);display:grid}.settings-sidebar{height:-moz-fit-content;height:fit-content;padding:var(--space-4);border:1px solid var(--color-border);border-radius:var(--radius-card);box-shadow:var(--shadow-card);background:rgba(14,23,43,.94);position:-webkit-sticky;position:sticky;top:7rem}@supports ((-webkit-backdrop-filter:blur(14px)) or (backdrop-filter:blur(14px))){.settings-sidebar{background:color-mix(in srgb,var(--color-surface)84%,transparent);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}}.settings-nav,.settings-nav-group{flex-direction:column;display:flex}.settings-nav{gap:var(--space-2)}.settings-nav-item{align-items:center;gap:var(--space-3);width:100%;min-height:2.8rem;color:var(--color-text-muted);text-align:left;border-radius:var(--radius-md);cursor:pointer;background:0 0;border:1px solid transparent;padding:.7rem .85rem;font-weight:650;transition:color .18s,background-color .18s,border-color .18s;display:flex;position:relative}.settings-nav-item:hover:not(.active){color:var(--color-text);background:var(--color-surface-raised)}.settings-nav-item.active{color:var(--color-info);background:var(--color-info-surface);border-color:var(--color-info-border)}.settings-nav-item.active:before{content:"";background:var(--brand-gradient);border-radius:0 var(--radius-pill)var(--radius-pill)0;width:3px;position:absolute;top:22%;bottom:22%;left:-1px}.settings-nav-item svg{flex:none}.settings-nav-heading .chevron-icon{margin-left:auto;transition:transform .18s}.settings-nav-heading .chevron-icon.expanded{color:var(--color-info);transform:rotate(180deg)}.settings-nav-subitems{gap:var(--space-1);padding:var(--space-2)0 0 var(--space-6);margin-top:var(--space-1);border-top:1px solid var(--color-border);display:grid}.settings-nav-subitem{min-height:2.5rem;font-size:.85rem}.settings-main{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-card);min-width:0;min-height:38rem;box-shadow:var(--shadow-card);padding:max(1.25rem,min(4vw,2.5rem))}.settings-content-section{gap:var(--space-6);flex-direction:column;display:flex}.settings-section-title{color:var(--color-text);font-family:var(--font-display);margin:0;font-size:max(1.65rem,min(3vw,2.2rem))}.settings-section-description{margin:calc(var(--space-4)*-1)0 0;color:var(--color-text-muted)}.settings-message{align-items:center;gap:var(--space-2);padding:var(--space-3)var(--space-4);color:var(--color-info);background:var(--color-info-surface);border:1px solid var(--color-info-border);border-radius:var(--radius-md);display:flex}.settings-message.success{color:var(--color-success);background:var(--color-success-surface);border-color:var(--color-success-border)}.settings-message.error{color:var(--color-error);background:var(--color-error-surface);border-color:var(--color-error-border)}.settings-message.warning{color:var(--color-warning);background:var(--color-warning-surface);border-color:var(--color-warning-border)}.settings-message.info{color:var(--color-info);background:var(--color-info-surface);border-color:var(--color-info-border)}.settings-message .spinner{animation:.9s linear infinite settings-spin}.settings-form-grid{gap:var(--space-6);grid-template-columns:repeat(2,minmax(0,1fr));display:grid}.settings-form-group{gap:var(--space-2);flex-direction:column;min-width:0;display:flex}.settings-label,.pro-form-label{color:var(--color-text);font-size:.875rem;font-weight:750}.settings-input,.pro-form-input,.pro-form-textarea{width:100%;min-height:3rem;color:var(--color-text);font:inherit;background:var(--color-bg-band);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:.75rem .9rem}.settings-input::placeholder,.pro-form-input::placeholder,.pro-form-textarea::placeholder{color:var(--color-text-faint)}.settings-input:disabled{cursor:not-allowed;opacity:.55;background:var(--color-surface-raised)}.settings-hint{color:var(--color-text-faint);margin:0;font-size:.8rem}.profile-picture-group{grid-column:1/-1}.profile-picture-container{align-items:center;gap:var(--space-6);display:flex}.profile-picture-preview{background:var(--color-bg-band);border:2px solid var(--color-border-strong);width:6.5rem;height:6.5rem;box-shadow:var(--shadow-card);border-radius:50%;place-items:center;display:grid;position:relative;overflow:hidden}.profile-picture-preview img,.profile-picture-wrapper,.profile-picture-image,.profile-picture-placeholder{width:100%;height:100%}.profile-picture-wrapper{border-radius:50%;overflow:hidden}.profile-picture-image{object-fit:cover}.profile-picture-placeholder{color:var(--color-text-muted);background:linear-gradient(145deg,var(--color-surface-raised),var(--color-bg-band));place-items:center;display:grid}.profile-picture-overlay{z-index:2;justify-content:center;align-items:center;gap:var(--space-2);color:#fff;opacity:0;pointer-events:none;background:rgba(2,6,18,.82);border-radius:50%;transition:opacity .18s;display:flex;position:absolute;top:0;bottom:0;left:0;right:0}.profile-picture-preview:hover .profile-picture-overlay,.profile-picture-preview:focus-within .profile-picture-overlay{opacity:1;pointer-events:auto}.profile-picture-overlay-btn{color:#fff;cursor:pointer;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.25);border-radius:50%;place-items:center;width:2.5rem;height:2.5rem;display:grid}.profile-picture-overlay-btn:has(input[type=file]){position:relative;overflow:hidden}.password-section-header{justify-content:space-between;align-items:center;gap:var(--space-3);display:flex}.settings-form-grid>.settings-form-group:last-child{grid-column:1/-1}.change-password-toggle{min-height:2.5rem;color:var(--color-info);background:var(--color-info-surface);border:1px solid var(--color-info-border);border-radius:var(--radius-sm);cursor:pointer;padding:.5rem .75rem;font-weight:700}.password-change-form{gap:var(--space-4);padding:var(--space-4);margin-top:var(--space-2);background:var(--color-bg-band);border:1px solid var(--color-border);border-radius:var(--radius-md);display:grid}.password-change-actions,.settings-actions{justify-content:flex-end;display:flex}.password-change-btn,.settings-save-btn,.view-plans-btn{justify-content:center;align-items:center;gap:var(--space-2);color:#fff;background:var(--brand-gradient);border-radius:var(--radius-md);cursor:pointer;border:0;min-height:2.75rem;padding:.65rem 1rem;font-weight:800;display:inline-flex;box-shadow:0 10px 24px rgba(0,86,255,.2)}:-webkit-any(.password-change-btn,.settings-save-btn,.view-plans-btn):disabled{cursor:not-allowed;opacity:.55}:-moz-any(.password-change-btn,.settings-save-btn,.view-plans-btn):disabled{cursor:not-allowed;opacity:.55}:is(.password-change-btn,.settings-save-btn,.view-plans-btn):disabled{cursor:not-allowed;opacity:.55}.settings-current-plan{padding:var(--space-6);background:var(--color-bg-band);border:1px solid var(--color-border);border-radius:var(--radius-card)}.current-plan-info h3{margin:0 0 var(--space-3);color:var(--color-text)}.current-plan-badge-settings{margin-bottom:var(--space-4)}.plan-badge-settings{color:var(--color-info);background:var(--color-info-surface);border:1px solid var(--color-info-border);border-radius:var(--radius-pill);padding:.35rem .75rem;font-size:.8rem;font-weight:800;display:inline-flex}.plan-badge-settings.premium{color:var(--color-warning);background:var(--color-warning-surface);border-color:var(--color-warning-border)}.plan-badge-settings.pro{color:var(--color-success);background:var(--color-success-surface);border-color:var(--color-success-border)}.current-plan-usage{gap:var(--space-3);grid-template-columns:repeat(4,minmax(0,1fr));display:grid}.usage-stat{gap:var(--space-1);padding:var(--space-3);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);display:grid}.usage-label{color:var(--color-text-muted);font-size:.78rem}.usage-value{color:var(--color-text);font-size:1.05rem;font-weight:800}.usage-value.remaining{color:var(--color-success)}.current-plan-actions{width:100%;margin-top:var(--space-4);display:flex}.current-plan-actions .view-plans-btn{width:100%}.settings-subscription-plans{gap:var(--space-6);grid-template-columns:repeat(2,minmax(0,1fr));display:grid}.settings-subscription-plan{padding:var(--space-6);background:var(--color-bg-band);border:1px solid var(--color-border);border-radius:var(--radius-card);flex-direction:column;align-items:center;transition:border-color .18s,transform .18s;display:flex;position:relative}.settings-subscription-plan:hover{border-color:var(--color-border-strong);transform:translateY(-3px)}.settings-subscription-plan.popular{border-color:var(--color-info-border);box-shadow:0 0 30px var(--color-glow-primary)}.settings-subscription-plan.current{border-color:var(--color-success-border)}.popular-badge,.current-badge{top:var(--space-3);right:var(--space-3);border-radius:var(--radius-pill);padding:.3rem .65rem;font-size:.72rem;font-weight:800;position:absolute}.popular-badge{color:var(--color-warning);background:var(--color-warning-surface);border:1px solid var(--color-warning-border)}.current-badge{color:var(--color-success);background:var(--color-success-surface);border:1px solid var(--color-success-border)}.plan-icon{width:3.25rem;height:3.25rem;margin:var(--space-4)0;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);place-items:center;display:grid}.plan-name{margin:0 0 var(--space-3);color:var(--color-text);font-size:1.4rem}.plan-price{margin-bottom:var(--space-4)}.price-amount{color:var(--color-text);font-family:var(--font-display);font-size:2.2rem;font-weight:800}.price-period{margin-left:var(--space-1);color:var(--color-text-muted)}.plan-features{width:100%;margin:0 0 var(--space-6);flex:1;padding:0;list-style:none}.plan-features li{align-items:center;gap:var(--space-3);color:var(--color-text-muted);padding:.45rem 0;display:flex}.plan-features li svg{color:var(--color-success);flex:none}.plan-button{color:#fff;border-radius:var(--radius-md);cursor:pointer;border:0;width:100%;min-height:2.8rem;padding:.65rem 1rem;font-weight:800}.plan-button:disabled{cursor:not-allowed;opacity:.55}.api-keys-wrapper,.api-usage-wrapper,.api-billing-wrapper{width:100%;min-width:0;overflow-x:auto}.settings-page :is(.api-keys-wrapper .api-keys-page,.api-usage-wrapper .api-usage-page,.api-billing-wrapper .api-billing-page){background:0 0;min-height:0;padding:0}.settings-page :is(.api-keys-wrapper .api-keys-container,.api-usage-wrapper .api-usage-container,.api-billing-wrapper .api-billing-container){width:100%;max-width:100%;padding:0}.settings-page :is(.api-keys-wrapper .api-keys-header,.api-usage-wrapper .usage-header,.api-billing-wrapper .billing-header){margin-bottom:var(--space-4);padding-bottom:var(--space-4)}.settings-page :is(.api-keys-wrapper .api-keys-header h1,.api-usage-wrapper .usage-header h1,.api-billing-wrapper .billing-header h1){font-size:1.35rem}.settings-page :-webkit-any(.api-keys-wrapper,.api-usage-wrapper) .header-subtitle{display:none}.settings-page :-moz-any(.api-keys-wrapper,.api-usage-wrapper) .header-subtitle{display:none}.settings-page :is(.api-keys-wrapper,.api-usage-wrapper) .header-subtitle{display:none}.settings-page .api-keys-wrapper .api-keys-table{min-width:50rem}.pro-dialog-overlay{z-index:2100;padding:var(--space-4);background:rgba(2,6,18,.88);place-items:center;display:grid;position:fixed;top:0;bottom:0;left:0;right:0}@supports ((-webkit-backdrop-filter:blur(10px)) or (backdrop-filter:blur(10px))){.pro-dialog-overlay{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:rgba(2,6,18,.72)}}.pro-dialog{width:min(100%,33rem);max-height:88vh;color:var(--color-text);background:var(--color-surface-raised);border:1px solid var(--color-border-strong);border-radius:var(--radius-card);flex-direction:column;display:flex;overflow:hidden;box-shadow:0 30px 80px rgba(0,0,0,.48)}.pro-dialog-header{padding:var(--space-6);border-bottom:1px solid var(--color-border);justify-content:space-between;align-items:center;display:flex}.pro-dialog-header h2{font-family:var(--font-display);margin:0}.pro-dialog-close{width:2.75rem;height:2.75rem;color:var(--color-text-muted);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);cursor:pointer;place-items:center;display:grid}.pro-dialog-form{gap:var(--space-4);padding:var(--space-6);flex:1;display:grid;overflow-y:auto}.pro-form-group{gap:var(--space-2);display:grid}.pro-form-textarea{resize:vertical;min-height:7rem}.pro-dialog-actions{justify-content:flex-end;gap:var(--space-3);padding:var(--space-6);border-top:1px solid var(--color-border);display:flex}.pro-dialog-cancel,.pro-dialog-submit{min-height:2.75rem;color:var(--color-text);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);cursor:pointer;padding:.65rem 1rem;font-weight:750}.pro-dialog-submit{color:#fff;background:var(--brand-gradient);border-color:transparent}.settings-page :-webkit-any(button,input,textarea,select,[tabindex]):focus-visible{outline:3px solid var(--color-info);outline-offset:3px}.settings-page :-moz-any(button,input,textarea,select,[tabindex]):focus-visible{outline:3px solid var(--color-info);outline-offset:3px}.settings-page :is(button,input,textarea,select,[tabindex]):focus-visible{outline:3px solid var(--color-info);outline-offset:3px}.pro-dialog :-webkit-any(button,input,textarea,select):focus-visible{outline:3px solid var(--color-info);outline-offset:3px}.pro-dialog :-moz-any(button,input,textarea,select):focus-visible{outline:3px solid var(--color-info);outline-offset:3px}.pro-dialog :is(button,input,textarea,select):focus-visible{outline:3px solid var(--color-info);outline-offset:3px}@keyframes settings-spin{to{transform:rotate(360deg)}}@media (max-width:1024px){.settings-layout{grid-template-columns:14rem minmax(0,1fr)}.settings-form-grid,.settings-subscription-plans{grid-template-columns:1fr}.current-plan-usage{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (max-width:760px){.settings-page{padding-inline:var(--space-4);background:var(--color-bg-canvas)}.settings-layout{grid-template-columns:1fr}.settings-sidebar{padding:var(--space-3);position:static}.settings-nav{flex-direction:row;overflow-x:auto}.settings-nav-group{flex:none}.settings-nav-item{white-space:nowrap;width:auto}.settings-nav-subitems{padding-left:var(--space-3)}.settings-main{padding:var(--space-4)}.profile-picture-container{flex-direction:column;align-items:flex-start}.current-plan-usage{grid-template-columns:1fr}}@media (max-width:520px){.settings-actions,.password-change-actions,.pro-dialog-actions{flex-direction:column;align-items:stretch}:-webkit-any(.settings-save-btn,.password-change-btn,.pro-dialog-cancel,.pro-dialog-submit){width:100%}:-moz-any(.settings-save-btn,.password-change-btn,.pro-dialog-cancel,.pro-dialog-submit){width:100%}:is(.settings-save-btn,.password-change-btn,.pro-dialog-cancel,.pro-dialog-submit){width:100%}.pro-dialog :-webkit-any(.pro-dialog-header,.pro-dialog-form,.pro-dialog-actions){padding:var(--space-4)}.pro-dialog :-moz-any(.pro-dialog-header,.pro-dialog-form,.pro-dialog-actions){padding:var(--space-4)}.pro-dialog :is(.pro-dialog-header,.pro-dialog-form,.pro-dialog-actions){padding:var(--space-4)}}@media (prefers-reduced-motion:reduce){.settings-page *,.settings-page :before,.settings-page :after,.pro-dialog-overlay *,.pro-dialog-overlay :before,.pro-dialog-overlay :after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}.settings-page [style*=transform],.pro-dialog-overlay [style*=transform]{transform:none!important}.settings-page [style*=opacity],.pro-dialog-overlay [style*=opacity]{opacity:1!important}.settings-subscription-plan:hover{transform:none}}
