/* Account forms extend the app's shared shell, cards, fields and colour tokens. */
.account-page .account-intro { margin: 0 0 1.5rem; }
.account-page .account-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1.25rem; align-items: start; }
.account-page .account-grid > section { min-width: 0; }
.account-page .wide { grid-column: 1 / -1; }
.account-page h2 { margin-bottom: .75rem; font-size: 1.125rem; }
.account-page h3 { margin: 1rem 0 .5rem; }
.account-page p { color: var(--ink-500); font-size: .9375rem; }
.account-page label { display: grid; gap: .4rem; font-size: .875rem; font-weight: 500; margin: 1rem 0 .5rem; }
.account-page input, .account-page select { width: 100%; min-width: 0; }
.account-page form > button { margin: 1rem 0 .5rem; }
.account-page form + form { margin-top: 1rem; padding-top: .25rem; border-top: 1px solid var(--line); }
.account-page ul { list-style: none; padding: 0; margin: 0 0 .75rem; }
.account-page li { display: flex; flex-wrap: wrap; gap: .75rem; justify-content: space-between; align-items: center; padding: .875rem 0; border-bottom: 1px solid var(--line); }
.account-page li > div { min-width: 0; overflow-wrap: anywhere; }
.account-page small { display: block; color: var(--ink-500); font-size: .8125rem; overflow-wrap: anywhere; }
.account-page details { margin-top: 1rem; }
.account-page summary { cursor: pointer; font-size: .875rem; }
.account-page pre, .account-page code { font-size: .875rem; overflow-wrap: anywhere; white-space: pre-wrap; }
.account-page pre { background: var(--panel-2); padding: 1rem; border-radius: .75rem; }
.account-page canvas { max-width: 100%; }
.account-page #message, .account-page .notice { padding: 1rem; border: 1px solid var(--line); border-radius: .75rem; background: var(--brand-50); color: var(--ink-900); margin-bottom: 1.25rem; }
.account-page #message.error { border-color: var(--signal-red); }
.account-page .user-row { display: flex; flex-wrap: wrap; gap: .75rem; align-items: end; padding: 1rem 0; border-bottom: 1px solid var(--line); }
.account-page .user-row > div { flex: 1 1 12rem; min-width: 0; overflow-wrap: anywhere; }
.account-page .user-row select { width: auto; }
.account-page .page-lede { overflow-wrap: anywhere; }
.account-page .account-users { margin: 1.5rem 0; }
.account-page #users { display: grid; gap: 1rem; margin-top: 1rem; }
.account-page .account-user h3 { margin: 0 0 .25rem; }
.account-page .account-user .btn-row { margin-top: .75rem; }
.account-page .account-user label { margin-top: 0; }
@media(max-width:767px) { .account-page .account-grid { grid-template-columns: minmax(0,1fr); } }

.auth-entry { padding-bottom: 0; }
.auth-entry-page { max-width: 32rem; padding-top: clamp(1.5rem,6vh,4rem); }
.auth-entry-page .ui-card { padding: clamp(1.25rem,4vw,2rem); }
.auth-entry-page .page-head { margin-bottom: 1.5rem; }
.auth-entry-page h1 { font-size: clamp(1.6rem,5vw,2rem); }
.auth-entry-page .btn { width: 100%; }
.auth-entry-page .auth-divider { display: flex; align-items: center; gap: .75rem; margin: .75rem 0 1.25rem; color: var(--ink-500); font-size: .875rem; }
.auth-entry-page .auth-divider::before, .auth-entry-page .auth-divider::after { content: ""; height: 1px; background: var(--line); flex: 1; }
.auth-entry-page .links { display: flex; flex-wrap: wrap; gap: .75rem 1rem; justify-content: space-between; margin-top: 1.5rem; font-size: .875rem; }
.auth-entry-page .auth-entry-back { margin-top: 1.5rem; }
.auth-entry-page > .ui-card > p { margin-bottom: 1rem; }