:root {
  color-scheme: light dark;
  font-family: system-ui, sans-serif;
  background: light-dark(#f5f6f8, #14171c);
  color: light-dark(#172033, #e5e9f0);
}
body { margin: 0; }
.account-page { max-width: 52rem; margin: 3rem auto; padding: 1.5rem; }
.foyer-account-nav { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 2rem; }
.foyer-account-nav button { border: 1px solid currentColor; border-radius: 0.65rem; background: transparent; color: inherit; }
a { color: light-dark(#254caa, #9ebcff); }
form { margin-block: 2rem; }
label { display: block; margin-block: 1rem 0.5rem; }
input[type="email"] { box-sizing: border-box; display: block; width: min(100%, 28rem); padding: 0.75rem; font: inherit; }
button { padding: 0.65rem 1rem; font: inherit; cursor: pointer; }
button:disabled { cursor: wait; }
#email-help { max-width: 38rem; font-size: 0.9rem; }
[data-clerk-identity] { overflow-wrap: anywhere; font-weight: 600; }
[role="status"] { min-height: 1.5rem; }
:focus-visible { outline: 3px solid light-dark(#254caa, #9ebcff); outline-offset: 3px; }