/* Account security: a calm, readable settings surface. */
.account-brand{display:flex;align-items:center;gap:10px;color:var(--ink)!important;font-family:Georgia,"Times New Roman",serif;font-size:1.35rem!important;letter-spacing:0!important;line-height:1}
.account-brand .brand-mark{width:28px;height:28px;flex:none}
/* The login card centers when space permits and scrolls on short screens. */
body:has(.login-form){min-height:100vh;min-height:100svh;display:flex;padding:24px}
body:not(.app):has(.login-form) main{width:100%;max-width:460px;min-height:0;margin:auto;padding:clamp(24px,4vw,40px);border:1px solid var(--line);border-radius:16px}
body:has(.login-form) .form,body:has(.login-form) .social{max-width:none}
body:has(.security-page) main{max-width:900px}
.security-header{padding:0 0 26px;border-bottom:1px solid var(--line)}
.security-header .security-back{display:inline-block;margin-bottom:24px;font-size:.9rem;font-weight:600}
body:not(.app) .security-header h1{margin:0 0 10px}
.security-header p{margin:0;color:var(--muted);max-width:60ch}
.security-section{padding:28px 0;border-bottom:1px solid var(--line)}
.security-section:last-child{border-bottom:0;padding-bottom:0}
.security-section h2{font-family:inherit;font-size:1.2rem;margin:0 0 8px}
.security-section h3{font-size:1rem;margin:28px 0 6px}
.security-section p{margin:0 0 18px;max-width:65ch;color:var(--muted)}
.security-section .form{max-width:440px;gap:14px}
.security-section .form button{align-self:flex-start;padding-inline:18px}
.security-section button{border-radius:8px}
.security-section h3~.form button,.security-section .identities button,.security-section > button{background:transparent;color:var(--ink);border-color:#b7a99b}
.security-section h3~.form button:hover:not(:disabled),.security-section .identities button:hover:not(:disabled),.security-section > button:hover:not(:disabled){border-color:var(--accent);color:var(--accent);filter:none}
.security-section .msg{margin:0;color:var(--ink)}
.security-section .msg.error{color:var(--bad)}
.security-section .identities{list-style:none;padding:0;margin:0 0 16px;max-width:560px}
.security-section .identities li{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 0;border-bottom:1px solid var(--line);overflow-wrap:anywhere}
.security-section .identities button{flex:none}
.security-section > button{margin:0 8px 8px 0}
.security-section code{overflow-wrap:anywhere}
.security-section .recovery-codes{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:8px;max-width:440px;padding:16px 16px 16px 36px;background:var(--sunk);border-radius:8px}
@media(max-width:600px){.security-header{padding-bottom:22px}.security-section{padding:24px 0}.security-section .form{max-width:none}.security-section .form button{width:100%}.security-section .identities li{align-items:flex-start;flex-direction:column}}