.account-security-page { max-width: 960px; padding-block: 40px 64px; }
.account-security-page.narrow { max-width: 640px; }
.security-heading { margin-bottom: 24px; }
.security-heading h1 { font-size: clamp(26px, 3vw, 36px); margin: 8px 0; }
.security-stack { display: grid; gap: 24px; }
.security-card { background: #fff; border: 1px solid var(--line); border-radius: 20px; padding: clamp(18px, 3vw, 32px); min-width: 0; overflow-wrap: anywhere; }
.security-card h2 { font-size: 22px; margin: 0 0 12px; }
.security-card form { display: grid; gap: 16px; margin-top: 20px; }
.security-card label { display: grid; gap: 8px; font-weight: 600; }
.security-card input { width: 100%; min-width: 0; min-height: 46px; padding: 10px 12px; border: 1px solid #cfc3df; border-radius: 10px; background: #fff; color: #35264c; font: inherit; }
.security-card input:focus-visible { outline: 2px solid #7651aa; outline-offset: 2px; }
.security-card summary { cursor: pointer; color: #604187; font-weight: 700; padding-block: 12px; }
.security-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.security-actions .button { min-height: 44px; }
.security-help { color: #695c76; font-size: 14px; margin: 0; }
.security-status, .security-notice { padding: 14px 16px; border-radius: 12px; background: #f3edf9; margin-block: 16px; }
.security-notice { border-left: 4px solid #ac3753; }
.security-status strong { display: block; }
.security-card button:disabled { opacity: .65; cursor: wait; }
.security-card [hidden] { display: none !important; }
@media (max-width: 600px) { .account-security-page { padding-block: 24px 40px; } .security-actions > .button { flex: 1 1 auto; } }
.account-security-page .button:hover,.account-security-page .button:focus-visible{background:#eee5f8;color:#4e326f;border-color:#d4c2e9}