/* Page-scoped styles: .page-account-settings. Shared tokens live in globals.css. */
    .page-account-settings *,.page-account-settings *::before,.page-account-settings *::after{box-sizing:border-box} .page-account-settings{scroll-behavior:smooth;-webkit-text-size-adjust:100%} .page-account-settings{margin:0;background:var(--bg);color:var(--fg);font:16px/1.75 var(--font-body);text-rendering:optimizeLegibility} .page-account-settings.locked{overflow:hidden}
    .page-account-settings a{color:inherit;text-decoration:none} .page-account-settings button,.page-account-settings input{font:inherit} .page-account-settings button{cursor:pointer} .page-account-settings h1,.page-account-settings h2,.page-account-settings h3{font-family:var(--font-display);text-wrap:balance} .page-account-settings p{text-wrap:pretty} .page-account-settings :focus-visible{outline:3px solid color-mix(in oklch,var(--accent) 55%,transparent);outline-offset:3px}
    .page-account-settings .container{max-width:var(--container);margin-inline:auto;padding-inline:var(--gutter)}
    .page-account-settings .topnav{position:sticky;top:0;z-index:20;background:color-mix(in oklch,var(--bg) 92%,transparent);backdrop-filter:blur(14px);border-bottom:1px solid var(--border)} .page-account-settings .nav-inner{min-height:70px;display:flex;align-items:center;justify-content:space-between;gap:24px}
    .page-account-settings .logo{display:inline-flex;align-items:center;gap:10px;font-family:var(--font-display);font-size:23px;font-weight:700}.page-account-settings .logo-mark{width:12px;height:12px;background:var(--fg);transform:rotate(45deg)} .page-account-settings .nav-links{display:flex;align-items:center;gap:28px}.page-account-settings .nav-links a{min-height:44px;display:inline-flex;align-items:center;color:var(--muted)}.page-account-settings .nav-links a:hover{color:var(--fg)}
    .page-account-settings .nav-tools{display:flex;align-items:center;gap:8px}
    .page-account-settings .nav-account{min-height:44px;display:inline-flex;align-items:center;gap:10px;padding-inline:16px;border:1px solid var(--fg);background:var(--fg);color:var(--surface);font-weight:700}.page-account-settings .nav-account:hover{background:var(--accent);border-color:var(--accent)}
    .page-account-settings .nav-account .avatar{width:22px;height:22px;background:var(--surface);color:var(--fg);display:grid;place-items:center;font:12px/1 var(--font-mono);font-weight:700}
    .page-account-settings .icon-btn{min-height:44px;width:46px;border:1px solid var(--border);background:transparent;color:var(--fg);display:inline-grid;place-items:center}.page-account-settings .icon-btn:hover{border-color:var(--fg);background:var(--fg-soft)}
    .page-account-settings .demo-strip{background:var(--fg);color:var(--surface);font:11px/1.6 var(--font-mono);padding:8px 0;text-align:center}
    .page-account-settings .demo-strip b{color:var(--surface);font-weight:700}
    .page-account-settings .page-head{padding-block:clamp(48px,7vw,84px) 0}
    .page-account-settings .crumb{font:12px/1.5 var(--font-mono);color:var(--accent);margin:0 0 18px}
    .page-account-settings .page-head h1{font-size:clamp(42px,6vw,72px);line-height:1.1;margin:0}
    .page-account-settings .page-head .sub{color:var(--muted);margin:16px 0 0;max-width:52ch}
    .page-account-settings .settings-layout{display:grid;grid-template-columns:230px minmax(0,1fr);gap:clamp(40px,7vw,90px);align-items:start;padding-block:56px 90px}
    .page-account-settings .settings-nav{position:sticky;top:100px;border-top:1px solid var(--fg)}
    .page-account-settings .settings-nav button{width:100%;min-height:52px;display:flex;justify-content:space-between;align-items:center;gap:12px;background:transparent;border:0;border-bottom:1px solid var(--border);color:var(--muted);font-size:16px;text-align:right;padding:0 4px}
    .page-account-settings .settings-nav button:hover{color:var(--fg)}
    .page-account-settings .settings-nav button[aria-selected="true"]{color:var(--fg);font-weight:700}
    .page-account-settings .settings-nav button[aria-selected="true"]::after{content:"";width:8px;height:8px;background:var(--accent);transform:rotate(45deg)}
    .page-account-settings .panel{display:none}
    .page-account-settings .panel.active{display:block}
    .page-account-settings .panel h2{font-size:clamp(30px,3.4vw,42px);line-height:1.2;margin:0 0 10px}
    .page-account-settings .panel .panel-sub{color:var(--muted);max-width:56ch;margin:0 0 34px}
    .page-account-settings .form-grid{display:grid;gap:24px;max-width:560px}
    .page-account-settings .field{display:grid;gap:7px}
    .page-account-settings .field label{font-size:13px;color:var(--muted)}
    .page-account-settings .field .hint{font-size:12px;color:var(--muted)}
    .page-account-settings .input{width:100%;border:1px solid var(--border);background:var(--surface);color:var(--fg);padding:13px 14px;min-height:48px}
    .page-account-settings .input:hover{border-color:var(--muted)}
    .page-account-settings .input:focus{outline:2px solid var(--accent);outline-offset:1px}
    .page-account-settings .input[disabled]{background:var(--fg-soft);color:var(--muted);cursor:not-allowed}
    .page-account-settings .input.invalid{border-color:var(--accent)}
    .page-account-settings .btn{min-height:46px;display:inline-flex;align-items:center;justify-content:center;padding:11px 22px;border:1px solid transparent;font-weight:700}
    .page-account-settings .btn-primary{background:var(--accent);color:var(--surface);border-color:var(--accent)}.page-account-settings .btn-primary:hover{background:color-mix(in oklch,var(--accent) 86%,black)}
    .page-account-settings .btn-secondary{border-color:var(--border);background:transparent;color:var(--fg)}.page-account-settings .btn-secondary:hover{border-color:var(--fg);background:var(--fg-soft)}
    .page-account-settings .status{font-size:14px;min-height:24px;display:flex;align-items:center;gap:8px}
    .page-account-settings .status.ok{color:var(--accent);font-weight:700}
    .page-account-settings .status.err{color:var(--accent)}
    .page-account-settings .pw-rules{list-style:none;padding:0;margin:4px 0 0;display:grid;gap:4px}
    .page-account-settings .pw-rules li{font-size:12px;color:var(--muted);display:flex;align-items:center;gap:8px}
    .page-account-settings .pw-rules li::before{content:"";width:7px;height:7px;border:1px solid var(--muted);transform:rotate(45deg);flex:none}
    .page-account-settings .pw-rules li.ok{color:var(--fg)}
    .page-account-settings .pw-rules li.ok::before{background:var(--accent);border-color:var(--accent)}
    .page-account-settings .prefs{border-top:1px solid var(--fg);max-width:640px}
    .page-account-settings .pref-row{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:22px 0;border-bottom:1px solid var(--border)}
    .page-account-settings .pref-row strong{display:block;font-size:17px}
    .page-account-settings .pref-row p{margin:4px 0 0;color:var(--muted);font-size:14px;max-width:44ch}
    .page-account-settings .switch{position:relative;width:52px;min-height:32px;flex:none}
    .page-account-settings .switch input{position:absolute;inset:0;opacity:0;margin:0;cursor:pointer}
    .page-account-settings .switch .track{position:absolute;inset:0;border:1px solid var(--muted);background:var(--surface);pointer-events:none;transition:background .15s,border-color .15s}
    .page-account-settings .switch input:checked + .track{background:var(--accent);border-color:var(--accent)}
    .page-account-settings .switch .track::after{content:"";position:absolute;top:4px;inset-inline-start:4px;width:22px;height:22px;background:var(--fg);transition:transform .15s}
    .page-account-settings .switch input:checked + .track::after{transform:translateX(-20px);background:var(--surface)}
    .page-account-settings .switch input:focus-visible + .track{outline:3px solid color-mix(in oklch,var(--accent) 55%,transparent);outline-offset:3px}
    .page-account-settings .membership-card{border:1px solid var(--fg);padding:clamp(24px,4vw,38px);max-width:640px}
    .page-account-settings .membership-head{display:flex;justify-content:space-between;align-items:start;gap:18px;padding-bottom:22px;border-bottom:1px solid var(--border)}
    .page-account-settings .membership-head h3{font-size:28px;margin:0}
    .page-account-settings .state-chip{font:11px/1.5 var(--font-mono);padding:6px 12px;border:1px solid var(--accent);color:var(--accent);white-space:nowrap}
    .page-account-settings .state-chip.cancelled{border-color:var(--muted);color:var(--muted)}
    .page-account-settings .plan-details{display:grid;grid-template-columns:repeat(2,1fr);gap:20px 32px;padding-block:24px}
    .page-account-settings .plan-details dt{font:12px/1.6 var(--font-mono);color:var(--muted)}
    .page-account-settings .plan-details dd{margin:4px 0 0;font-size:16px}
    .page-account-settings .price-tag{font-family:var(--font-display);font-size:44px;line-height:1}
    .page-account-settings .price-tag small{display:block;font:11px/1.5 var(--font-mono);color:var(--muted);margin-top:6px}
    .page-account-settings .membership-actions{display:flex;gap:14px;flex-wrap:wrap;padding-top:22px;border-top:1px solid var(--border)}
    .page-account-settings .cancel-zone{margin-top:34px;max-width:640px;border-top:1px solid var(--border);padding-top:24px}
    .page-account-settings .cancel-zone h3{font-size:22px;margin:0 0 6px}
    .page-account-settings .cancel-zone p{color:var(--muted);font-size:14px;margin:0 0 16px;max-width:52ch}
    .page-account-settings .billing{margin-top:34px;max-width:640px;border-top:1px solid var(--border);padding-top:24px}
    .page-account-settings .billing h3{font-size:22px;margin:0 0 6px}
    .page-account-settings .billing-sub{color:var(--muted);font-size:14px;margin:0 0 18px;max-width:52ch}
    .page-account-settings .billing-table{border:1px solid var(--border)}
    .page-account-settings .billing-row{display:grid;grid-template-columns:1.1fr 1.5fr .7fr .8fr auto;gap:12px;align-items:center;padding:13px 18px;border-bottom:1px solid var(--border);font-size:14px}
    .page-account-settings .billing-row:last-child{border-bottom:0}
    .page-account-settings .billing-row.head{font:11px/1.6 var(--font-mono);color:var(--muted);padding:10px 18px}
    .page-account-settings .billing-row .amt,.page-account-settings .billing-row .bdate{font-family:var(--font-mono);white-space:nowrap}
    .page-account-settings .billing-row .desc{color:var(--fg)}
    .page-account-settings .chip{display:inline-block;padding:2px 10px;border:1px solid var(--border);font:11px/1.9 var(--font-mono);color:var(--muted);white-space:nowrap}
    .page-account-settings .chip.paid{color:var(--fg);border-color:var(--fg)}
    .page-account-settings .chip.upcoming{color:var(--accent);border-color:var(--accent)}
    .page-account-settings .chip.voided{color:var(--muted);border-color:var(--border);text-decoration:line-through}
    .page-account-settings .inv-link{font:12px/1.6 var(--font-mono);color:var(--fg);text-decoration:underline;text-underline-offset:3px}
    .page-account-settings .inv-link:hover{color:var(--accent)}
    .page-account-settings .inv-link:disabled{color:var(--muted);text-decoration:none;cursor:default}
    .page-account-settings .inv-link:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
    .page-account-settings .text-danger{background:transparent;border:0;color:var(--accent);font-weight:700;text-decoration:underline;text-underline-offset:4px;min-height:44px;padding:0 4px}
    .page-account-settings .text-danger:hover{color:color-mix(in oklch,var(--accent) 80%,black)}
    .page-account-settings .dialog{position:fixed;inset:0;z-index:60;visibility:hidden;pointer-events:none}.page-account-settings .dialog.open{visibility:visible;pointer-events:auto}
    .page-account-settings .dialog-scrim{position:absolute;inset:0;border:0;background:color-mix(in oklch,var(--fg) 58%,transparent);opacity:0;transition:opacity .2s}
    .page-account-settings .dialog.open .dialog-scrim{opacity:1}
    .page-account-settings .dialog-panel{position:absolute;inset-inline:0;top:50%;transform:translateY(calc(-50% + 12px));margin-inline:auto;width:min(560px,92vw);background:var(--bg);border:1px solid var(--fg);padding:clamp(26px,4vw,40px);opacity:0;transition:opacity .2s,transform .2s}
    .page-account-settings .dialog.open .dialog-panel{opacity:1;transform:translateY(-50%)}
    .page-account-settings .dialog-panel h2{font-size:30px;margin:0 0 12px}
    .page-account-settings .dialog-panel p{color:var(--muted);margin:0 0 14px}
    .page-account-settings .dialog-panel .keep-note{border-inline-start:2px solid var(--border);padding-inline-start:14px}
    .page-account-settings .dialog-actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:26px}
    .page-account-settings .pagefoot{padding-block:54px;border-top:1px solid var(--border);color:var(--muted)}
    .page-account-settings .footer-grid{display:grid;grid-template-columns:1.4fr repeat(3,1fr);gap:44px}
    .page-account-settings .footer-col strong{display:block;color:var(--fg);margin-bottom:12px}
    .page-account-settings .footer-col a{display:block;min-height:36px}.page-account-settings .footer-col a:hover{color:var(--fg);text-decoration:underline}
    .page-account-settings .footer-bottom{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;padding-top:28px;margin-top:38px;border-top:1px solid var(--border);font-size:13px}
    .page-account-settings .menu-panel{position:fixed;inset:0;z-index:60;visibility:hidden;pointer-events:none}.page-account-settings .menu-panel.open{visibility:visible;pointer-events:auto}.page-account-settings .menu-scrim{position:absolute;inset:0;border:0;background:color-mix(in oklch,var(--fg) 55%,transparent);opacity:0}.page-account-settings .menu-panel.open .menu-scrim{opacity:1}.page-account-settings .menu-drawer{position:absolute;inset-block:0;inset-inline-start:0;width:min(520px,92vw);padding:28px clamp(24px,5vw,54px);background:var(--bg);border-inline-end:1px solid var(--fg);transform:translateX(105%);transition:transform .25s ease;display:flex;flex-direction:column}.page-account-settings .menu-panel.open .menu-drawer{transform:translateX(0)}.page-account-settings .menu-head{display:flex;justify-content:space-between;align-items:center;padding-bottom:24px;border-bottom:1px solid var(--border)}.page-account-settings .menu-links{display:flex;flex-direction:column}.page-account-settings .menu-links a{display:flex;justify-content:space-between;align-items:center;min-height:58px;border-bottom:1px solid var(--border);font-size:18px}
    @media(max-width:920px){.page-account-settings .nav-links{display:none}.page-account-settings .settings-layout{grid-template-columns:1fr}.page-account-settings .settings-nav{position:static;display:grid;grid-template-columns:1fr 1fr;border-top:0;margin-bottom:10px}.page-account-settings .settings-nav button{border:1px solid var(--border)}.page-account-settings .footer-grid{grid-template-columns:1fr 1fr}}
    @media(max-width:620px){.page-account-settings .nav-account .name-label{display:none}.page-account-settings .page-head h1{font-size:44px}.page-account-settings .settings-layout{padding-block:40px 60px}.page-account-settings .footer-grid{grid-template-columns:1fr;gap:28px}.page-account-settings .plan-details{grid-template-columns:1fr}.page-account-settings .dialog-actions{flex-direction:column}.page-account-settings .dialog-actions .btn{width:100%}.page-account-settings .billing-row{grid-template-columns:1fr 1fr;row-gap:2px}.page-account-settings .billing-row.head{display:none}.page-account-settings .billing-row .bdate{grid-column:1}.page-account-settings .billing-row .desc{grid-column:1 / -1;color:var(--muted)}}
    @media(prefers-reduced-motion:reduce){.page-account-settings *{scroll-behavior:auto!important;transition-duration:.01ms!important}}