/* Working server forms extend, rather than replace, the approved login palette. */
a { color: inherit; text-underline-offset: 4px; }
h1, h2 { overflow-wrap: anywhere; }
input::placeholder { color: #bbb; opacity: 1; }
.auth-form { margin-top: 28px; }
.local-note, .help-text { color: var(--muted); font-size: .8125rem; line-height: 1.75; overflow-wrap: anywhere; }
.local-note { margin: 20px 0 26px; }
.auth-form .text-button { margin-top: -12px; text-decoration: none; width: fit-content; }
.auth-form .text-button:hover { text-decoration: underline; }
.back-link { display: block; width: fit-content; min-height: 44px; padding-block: 12px; margin-top: 16px; font-size: .875rem; line-height: 1.6; }
.button-link { text-align: center; text-decoration: none; }
.spaced { margin-top: 28px; }
.standard-field .input-wrap { display: flex; flex-direction: column; background: transparent; }
.standard-field .input-wrap label { position: static; order: -1; max-width: 100%; margin-bottom: 8px; font-size: .875rem; line-height: 1.6; color: var(--ink); }
.standard-field input { padding: 14px 16px; background: var(--field); }
.standard-field .password-input input { padding-right: 58px; }
.standard-field .password-toggle { top: auto; bottom: .4375rem; }
.help-text { margin-top: 8px; }
.help-text ul, .errorlist { padding-left: 20px; }
.errorlist { margin-block: 8px; color: var(--error); font-size: .8125rem; line-height: 1.7; }
.error-summary, .messages { border: 1px solid #676767; border-radius: 8px; padding: 14px 18px; margin: 0 0 24px; font-size: .875rem; line-height: 1.7; }
.error-summary { border-color: #a06761; color: var(--error); }
.error-summary .errorlist { list-style: none; margin: 0; padding: 0; }
.messages { list-style: none; color: #e0e0e0; background: #292929; }
.check-field { display: grid; grid-template-columns: 24px minmax(0, 1fr); align-items: start; gap: 12px; margin: 22px 0; font-size: .9375rem; line-height: 1.7; }
.check-field input { height: 24px; width: 24px; margin: 3px 0; padding: 0; accent-color: #fff; }
.check-field label { min-height: 44px; cursor: pointer; }
.check-field .errorlist { grid-column: 2; }
.eyebrow { display: block; color: var(--muted); text-transform: uppercase; font-size: .6875rem; letter-spacing: .14em; line-height: 1.6; margin-bottom: 14px; }
.qr-box { width: fit-content; max-width: 100%; margin: 26px auto; padding: 12px; border-radius: 12px; background: #fff; }
.qr-box img { display: block; width: 240px; max-width: 100%; height: auto; }
.setup-details { font-size: .875rem; line-height: 1.7; color: #ddd; }
.setup-details summary { cursor: pointer; min-height: 44px; padding-block: 12px; }
.setup-key { display: block; overflow-wrap: anywhere; padding: 12px; border: 1px solid #777; border-radius: 8px; background: #303030; user-select: all; }
.recovery-codes { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 11rem), 1fr)); gap: 12px; list-style-position: inside; padding: 0; margin-block: 26px; font-size: .75rem; color: var(--muted); }
.recovery-codes li { padding: 12px 8px; border: 1px solid #777; border-radius: 6px; }
.recovery-codes code { font-size: .875rem; color: #fff; }
@media (max-width: 430px) { .recovery-codes { grid-template-columns: 1fr; } }
@media print { .qr-box, .setup-details, .sidebar, .skip-link { display: none; } .recovery-codes code { color: #000; } }