.portal-account-card { max-width: 42rem; margin: 2rem auto; padding: 2rem; background: var(--portal-card, #fff); border: 1px solid var(--portal-line, #d8dce3); border-radius: .75rem; color: var(--portal-text, #18202b); }
.portal-account-card h1 { margin-top: 0; }
.portal-account-card h2 { margin: 1.5rem 0 .5rem; font-size: 1.1rem; }
.portal-account-intro { color: var(--portal-muted, #52606d); line-height: 1.5; }
.portal-account-status { padding: .75rem; border-radius: .45rem; background: #eef3f7; }
.portal-account-status.is-error { color: #8b1e1e; background: #fff0f0; }
.portal-account-status.is-success { color: #175b35; background: #edf9f0; }
.portal-account-form { display: grid; gap: 1rem; margin-top: 1rem; }
.portal-field { display: grid; gap: .35rem; font-weight: 600; }
.portal-field input { min-height: 2.75rem; padding: .55rem .7rem; border: 1px solid var(--portal-line, #b8c0ca); border-radius: .4rem; font: inherit; color: inherit; background: var(--portal-input, #fff); }
.portal-field input:focus-visible, .portal-button:focus-visible { outline: 3px solid #2b6cb0; outline-offset: 2px; }
.portal-button { justify-self: start; min-height: 2.75rem; padding: .6rem 1rem; border: 0; border-radius: .4rem; background: #245a8d; color: #fff; font: inherit; font-weight: 700; cursor: pointer; }
.portal-button:disabled { cursor: wait; opacity: .6; }
.portal-session-list { display: grid; gap: .8rem; padding: 0; list-style: none; }
.portal-session-list li { display: grid; gap: .35rem; padding: 1rem; border: 1px solid var(--portal-line, #d8dce3); border-radius: .5rem; }
.portal-session-detail { color: var(--portal-muted, #52606d); overflow-wrap: anywhere; }
.portal-mfa-secret { margin-top: 1rem; padding: 1rem; background: #f4f7fa; border-radius: .5rem; overflow-wrap: anywhere; }
.portal-recovery-codes { font-family: ui-monospace, monospace; line-height: 1.6; }
@media (max-width: 520px) { .portal-account-card { margin: 1rem; padding: 1.25rem; } }