/* UI only. Colors and proportions follow the active iOS LoginView. */
:is(#authModal,#loginPanel).auth-parity {
  position:fixed;inset:0;z-index:1000;width:100%;max-width:none;margin:0;border:0;border-radius:0;box-sizing:border-box;
  --auth-ink:#172744; --auth-muted:#526174; --auth-action:#1A5276;
  background:linear-gradient(135deg,#0D1B5E 0%,#1B3BA3 50%,#2E5FD9 100%);
  min-height:100vh; min-height:100dvh; max-height:100dvh;
  overflow-y:auto; overscroll-behavior:contain;
  flex-direction:column; justify-content:flex-start; align-items:center;
  padding:max(24px,env(safe-area-inset-top)) max(24px,env(safe-area-inset-right)) max(24px,env(safe-area-inset-bottom)) max(24px,env(safe-area-inset-left));
  backdrop-filter:none; -webkit-backdrop-filter:none;
  font:16px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  color:var(--auth-ink); color-scheme:light;
}

/* Mobile registration information uses the existing auth panel and theme. */
:is(#authModal,#loginPanel).auth-parity :is([data-auth-panel="register"],#registerForm) > p:not(.status) {
  margin:0 0 16px; color:var(--auth-ink); font-size:17px; line-height:1.6;
}
:is(#authModal,#loginPanel).auth-parity * { box-sizing:border-box; }
:is(#authModal,#loginPanel).auth-parity .auth-modal {
  position:relative; flex-shrink:0; width:min(420px,100%); margin:auto;
  overflow:visible; background:transparent; border:0; border-radius:0; box-shadow:none;
  transform:none; opacity:1; transition:none;
}
:is(#authModal,#loginPanel).auth-parity .auth-modal-top { display:flex;align-items:center;flex-direction:column; gap:12px; padding:0 44px 24px; margin:0;border:0; text-align:center; }
:is(#authModal,#loginPanel).auth-parity .auth-modal-icon { width:112px; height:112px; padding:0; object-fit:contain; border-radius:28px; border:1px solid #ffffff2e; box-shadow:0 0 28px #ffffff38; }
:is(#authModal,#loginPanel).auth-parity .auth-modal-brand { flex:none; }
:is(#authModal,#loginPanel).auth-parity .auth-modal-title { margin:0; color:#ffffffcc!important; font-size:17px; font-weight:400; line-height:1.4; }
:is(#authModal,#loginPanel).auth-parity .auth-modal-subtitle { display:none; }
:is(#authModal,#loginPanel).auth-parity .auth-modal-close { display:grid;place-items:center;position:absolute; top:0; right:0; width:44px; height:44px;padding:0;border-radius:12px;text-decoration:none; border:1px solid #ffffff80; background:transparent; color:#fff; font-size:28px; }
:is(#authModal,#loginPanel).auth-parity .auth-modal-close:hover { background:#ffffff20; }
:is(#authModal,#loginPanel).auth-parity .auth-panel { margin:0; padding:24px; border-radius:24px; background:#fff; box-shadow:0 14px 40px #00000033; }
:is(#authModal,#loginPanel).auth-parity .auth-field { display:grid;gap:0; margin:0 0 16px; }
:is(#authModal,#loginPanel).auth-parity .auth-field label { position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap; }
:is(#authModal,#loginPanel).auth-parity .auth-input-shell { display:flex; align-items:center; gap:12px; min-height:50px; padding:0 14px; background:#F7F9FB; border:1px solid #c8d1dc; border-radius:12px; }
:is(#authModal,#loginPanel).auth-parity .auth-input-icon { width:24px; height:24px; flex-shrink:0; color:var(--auth-muted); }
:is(#authModal,#loginPanel).auth-parity .auth-input-icon svg { display:block; width:100%; height:100%; }
:is(#authModal,#loginPanel).auth-parity .auth-field input { min-width:0; flex:1; height:48px; width:100%; padding:0; background:transparent; border:0; border-radius:0; color:var(--auth-ink); font:inherit; font-size:17px; outline:none; box-shadow:none; }
:is(#authModal,#loginPanel).auth-parity .auth-field input::placeholder { color:var(--auth-muted); opacity:1; }
:is(#authModal,#loginPanel).auth-parity .auth-input-shell:focus-within { outline:3px solid #1B3BA3; outline-offset:3px; }
:is(#authModal,#loginPanel).auth-parity .auth-password-toggle { display:grid; place-items:center; width:44px; height:44px; flex-shrink:0; margin-right:-10px; border:0; border-radius:9px; background:transparent; color:var(--auth-action); cursor:pointer; }
:is(#authModal,#loginPanel).auth-parity .auth-password-toggle svg { width:24px; height:24px; }
:is(#authModal,#loginPanel).auth-parity .auth-submit { width:100%;border:0;cursor:pointer;height:auto; min-height:54px; margin:0; padding:12px 16px; border-radius:14px; background:var(--auth-action); color:#fff; font:inherit; font-weight:700; box-shadow:0 4px 8px #00000026; }
:is(#authModal,#loginPanel).auth-parity .auth-submit:hover:not(:disabled) { background:#0D1B5E; }
:is(#authModal,#loginPanel).auth-parity .auth-submit:disabled { background:#657a8a; color:#fff; cursor:wait; box-shadow:none; }
:is(#authModal,#loginPanel).auth-parity .auth-submit[data-empty-fields="true"]:disabled { background:#718292;cursor:not-allowed;box-shadow:none; }
:is(#authModal,#loginPanel).auth-parity .auth-mode-switch { display:flex; justify-content:center; align-items:center; flex-wrap:wrap; gap:0 5px; margin-top:16px; color:var(--auth-ink); font-size:16px; }
:is(#authModal,#loginPanel).auth-parity .auth-tab { height:auto; min-height:44px; padding:8px 4px; border:0; border-radius:6px; background:transparent; color:var(--auth-action); font:inherit; font-weight:700; text-decoration:underline; text-underline-offset:3px; }
:is(#authModal,#loginPanel).auth-parity .auth-reset-link { display:flex; align-items:center; justify-content:center; min-height:44px; margin-top:8px; color:var(--auth-action); font-size:16px; font-weight:600; text-decoration:underline; text-underline-offset:3px; }
:is(#authModal,#loginPanel).auth-parity .auth-status { min-height:0; margin:16px 0 0; padding:12px; border-radius:10px; background:#F7F9FB; color:var(--auth-ink); font-size:16px; line-height:1.5; overflow-wrap:anywhere; }
:is(#authModal,#loginPanel).auth-parity .auth-status:empty { display:none; }
:is(#authModal,#loginPanel).auth-parity .auth-note { margin:20px 8px 0; color:#fff; font-size:14px; line-height:1.6; text-align:center; }
:is(#authModal,#loginPanel).auth-parity [hidden] { display:none!important; }
:is(#authModal,#loginPanel).auth-parity button:focus-visible,:is(#authModal,#loginPanel).auth-parity a:focus-visible { outline:3px solid #1B3BA3; outline-offset:3px; }
:is(#authModal,#loginPanel).auth-parity .auth-modal-close:focus-visible { outline-color:#fff; }
#loginPanel.auth-parity:not(.hidden){display:flex}
body:has(#loginPanel.auth-parity:not(.hidden)){overflow:hidden}
#loginPanel.auth-parity .form-row{display:block}
/* Global app desktop: keep both auth cards at the iOS-style 420 px width.
   Mobile sizing remains governed by the existing responsive modal. */
@media(min-width:651px) {
  #loginPanel.auth-parity .auth-panel {
    width:100%; max-width:420px; margin-inline:auto;
  }
}
:is(#authModal,#loginPanel).auth-parity .auth-panel{display:none}
:is(#authModal,#loginPanel).auth-parity .auth-panel.is-active{display:block}
@media(max-width:360px) { :is(#authModal,#loginPanel).auth-parity .auth-input-shell { gap:8px; padding-left:10px; } }

/* Homepage only: preserve the page behind the existing iOS-styled sign-in form.
   Other public entry points and /app/ retain their current presentation. */
#authModal[data-auth-presentation="popup"].auth-parity {
  --auth-ink:#1B2631; --auth-muted:#5D6D7E;
  --auth-surface:#FFFFFF; --auth-field:#F7F9FB; --auth-border:#c8d1dc;
  background:rgba(3,7,18,.42); z-index:3000;
  padding:16px; padding:max(16px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) max(16px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left));
  justify-content:center;
}
#authModal[data-auth-presentation="popup"].auth-parity .auth-modal {
  width:min(390px,100%); max-height:calc(100dvh - 32px); overflow-y:auto;
  padding:28px 24px 24px; border-radius:28px;
  background:linear-gradient(135deg,#0D1B5E 0%,#1B3BA3 50%,#2E5FD9 100%);
  border:1px solid #ffffff40; box-shadow:0 24px 80px #00000066;
}
#authModal[data-auth-presentation="popup"].auth-parity .auth-modal-close {
  top:12px; right:12px; width:48px; height:48px; font-size:34px;
  background:#0D1B5E; border:2px solid #ffffffb3; z-index:1;
}
#authModal[data-auth-presentation="popup"].auth-parity .auth-modal-close:hover { background:#1A5276; }
#authModal[data-auth-presentation="popup"].auth-parity .auth-panel { background:var(--auth-surface); }
#authModal[data-auth-presentation="popup"].auth-parity .auth-input-shell,
#authModal[data-auth-presentation="popup"].auth-parity .auth-status {
  background:var(--auth-field); border-color:var(--auth-border);
}
#authModal[data-auth-presentation="popup"].auth-parity .auth-password-toggle,
#authModal[data-auth-presentation="popup"].auth-parity .auth-tab,
#authModal[data-auth-presentation="popup"].auth-parity .auth-reset-link { color:var(--auth-ink); }
:root[data-web-theme="dark"] #authModal[data-auth-presentation="popup"].auth-parity {
  --auth-ink:#F2F4F7; --auth-muted:#9AA5B1;
  --auth-surface:#1C232E; --auth-field:#141A24; --auth-border:#526174;
  color-scheme:dark;
}
:root[data-web-theme="dark"] #authModal[data-auth-presentation="popup"].auth-parity .auth-input-shell:focus-within,
:root[data-web-theme="dark"] #authModal[data-auth-presentation="popup"].auth-parity :is(button,a):focus-visible { outline-color:#AED6F1; }
@media(max-width:480px) {
  #authModal[data-auth-presentation="popup"].auth-parity .auth-modal { padding:28px 16px 16px; }
  #authModal[data-auth-presentation="popup"].auth-parity .auth-panel { padding:20px; }
}
/* All viewport widths use the existing centered popup layout above. */
