/* Sign in with Apple (Apple HIG: black, white logo) and Sign in with Google (branding: white, #747775 border, #1F1F1F text). Same size, Apple first. */
.federated-divider{display:flex;align-items:center;gap:12px;margin:18px 0 12px;color:#7a6772;font-size:13px}
.federated-divider::before,.federated-divider::after{content:"";flex:1;height:1px;background:#eedce3}
.federated-auth{display:grid;gap:10px}
.federated-button{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;min-height:48px;padding:0 18px;border-radius:24px;font:500 16px/1 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;letter-spacing:.01em;cursor:pointer;white-space:nowrap}
.federated-button:focus-visible{outline:3px solid #d02c51;outline-offset:2px}
.federated-apple{background:#000;color:#fff;border:1px solid #000}
.federated-google{background:#fff;color:#1f1f1f;border:1px solid #747775}
.federated-logo{width:18px;height:18px;flex:none}
.federated-apple .federated-logo{width:16px;height:19px;margin-top:-2px}
.federated-auth small{color:#716572;line-height:1.5}
.federated-auth small a{color:inherit}
.federated-birthdate .field{margin-top:12px}
/* v437: every auth action is a full-width row in one consistent stack (phone, iPad, desktop):
   primary (Code anfordern / Passkey / Passwort / Konto erstellen / Bestätigen), then the secondary switch,
   then Apple and Google below the divider. Specificity beats the generic .page-actions row layout. */
#app #login-form .auth-actions{display:flex;flex-direction:column;align-items:stretch;gap:10px}
#app #login-form .auth-actions>:is(button,a){flex:0 0 auto;width:100%;max-width:none;min-height:48px;margin:0;order:1}
#app #login-form .auth-actions>#auth-submit{order:0}
#app #login-form .auth-actions>p{order:2;flex-basis:auto;margin:4px 0 0}
#app #login-form .auth-code-help>button{width:100%;min-height:44px}
#app #login-form .federated-button{min-height:48px}
#login-form:has(#auth-age-help) .federated-age{display:none}
.federated-birthdate{width:min(480px,calc(100vw - 24px));box-sizing:border-box}.federated-birthdate::backdrop{background:#fbf6f8;backdrop-filter:none}.federated-birthdate .welcome-tour-copy{box-sizing:border-box;max-width:100%}.federated-birthdate .field{width:100%;min-width:0}.federated-birthdate input[type=date]{display:block;box-sizing:border-box;width:100%;max-width:100%;min-width:0;min-height:52px;appearance:none;-webkit-appearance:none}.federated-birthdate input[type=date]::-webkit-date-and-time-value{text-align:left}.federated-birthdate input[type=date]::-webkit-datetime-edit{max-width:100%}.federated-age-note{font-size:13px;margin:8px 0 0}
.auth-shell input[type=date]::-webkit-datetime-edit{max-width:100%}
.account-delete-dialog .button.danger{background:#b3261e;border-color:#b3261e;color:#fff}.account-delete-dialog .button.danger:disabled{opacity:.55;cursor:not-allowed}.account-delete-error{color:#b3261e;margin:8px 0 0}.account-delete-error:empty{display:none}.account-delete-dialog .page-actions{display:flex;gap:10px;flex-wrap:wrap}.account-delete-dialog .page-actions>*{flex:1 1 160px}
dialog.welcome-tour.federated-birthdate::backdrop{background:#fbf6f8;backdrop-filter:none;-webkit-backdrop-filter:none}.welcome-tour .welcome-tour-copy>p.account-delete-error{color:#b3261e}
/* v448: fixed, stacked full-width actions; the counter never changes the layout (no reflow at 0). */
.account-delete-dialog .page-actions{display:grid!important;grid-template-columns:minmax(0,1fr);gap:10px}.account-delete-dialog .page-actions>*{width:100%;min-width:0;flex:none;margin:0}.account-delete-dialog [data-delete]{font-variant-numeric:tabular-nums;white-space:nowrap}
/* v459: double the gap above the 18+ hint (10px grid gap + 10px) in every login state */
.federated-auth .federated-age{margin-top:10px}
