/* Mirrors EPI /regions exactly; standalone account-choice layout only. */
@font-face {
  font-family: 'Plus Jakarta Sans';
  src: url("/assets/account_access/ps-display-v1-d2ff26bc.woff2") format('woff2');
  font-weight: 400 800;
  font-style: normal;
  font-display: swap;
}
:root {
  --ps-bg-2: #F4F7FB;
  --ps-fg-1: #0B1220;
  --ps-fg-2: #3A4558;
  --ps-border: #E6E7E9;
  --ps-border-interactive: #7A8598;
  --ps-code: #1E3A8A;
  --ps-focus: #1E3A8A;
  --ps-navy: #1E3A8A;
  --ps-navy-300: #9CB6F2;
  --ps-hover: #EAF0FB;
  --ps-font-display: 'Plus Jakarta Sans', 'Manrope', ui-sans-serif, system-ui, sans-serif;
  --ps-font-sans: 'Manrope', 'Plus Jakarta Sans', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', sans-serif;
}
@media (prefers-color-scheme: dark) {
  :root {
    --ps-bg-2: #0B1220;
    --ps-fg-1: #ffffff;
    --ps-fg-2: #d1d5db;
    --ps-border: #2E4F7A;
    --ps-border-interactive: #4A6B9A;
    --ps-code: #9CB6F2;
    --ps-focus: #9CB6F2;
    --ps-hover: #13213B;
  }
}
@media (prefers-contrast: more) {
  :root { --ps-border: #64748b; --ps-border-interactive: #64748b; }
}
@media (prefers-contrast: more) and (prefers-color-scheme: dark) {
  :root { --ps-border: #94a3b8; --ps-border-interactive: #94a3b8; }
}
* { box-sizing: border-box; margin: 0; padding: 0; }
body {
  font-family: var(--ps-font-sans);
  background: var(--ps-bg-2);
  color: var(--ps-fg-1);
  -webkit-font-smoothing: antialiased;
  line-height: 1.5;
  min-height: 100vh;
  display: flex;
  flex-direction: row;
}
.half {
  flex: 1 1 50%;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 48px 24px;
  text-align: center;
  text-decoration: none;
  color: var(--ps-fg-1);
  background: var(--ps-bg-2);
  transition: background .14s ease;
}
.half + .half { border-left: 1px solid var(--ps-border); }
.half:hover, .half:focus-visible { background: var(--ps-hover); }
.half:focus-visible { outline: 2px solid var(--ps-focus); outline-offset: -6px; }
.half img { width: 40px; height: 40px; border-radius: 9px; margin-bottom: 18px; }
.half .region {
  font-family: var(--ps-font-display); font-weight: 800;
  font-size: clamp(28px, 5vw, 44px); line-height: 1.05; letter-spacing: -.03em;
  color: var(--ps-code);
}
.half .enter {
  display: inline-flex; align-items: center; gap: 7px; margin-top: 22px;
  padding: 10px 20px; border-radius: 999px;
  border: 1px solid var(--ps-border-interactive);
  font-size: 13px; font-weight: 700; color: var(--ps-fg-2);
  transition: border-color .14s ease, color .14s ease, background-color .14s ease;
}
.half:hover .enter, .half:focus-visible .enter { border-color: var(--ps-focus); color: var(--ps-fg-1); }

.half.suite { background: #232323; color: #EEF0F5; }
.half.suite:hover, .half.suite:focus-visible { background: #2D2D2D; }
.half.suite:focus-visible { outline-color: #7FA0F5; }
.half.suite .region { color: #ffffff; }
.half.suite .wordmark {
  width: auto; height: 46px; max-width: 78%; border-radius: 0; margin-bottom: 20px;
}
.half.suite .enter {
  background: #2F5DDD; border-color: #2F5DDD; color: #ffffff;
}
.half.suite:hover .enter, .half.suite:focus-visible .enter {
  background: #406BE9; border-color: #406BE9; color: #ffffff;
}

@media (max-width: 640px) {
  body { flex-direction: column; }
  .half { min-height: 50vh; padding: 40px 24px; }
  .half + .half { border-left: 0; border-top: 1px solid var(--ps-border); }
}
@media (prefers-reduced-motion: reduce) { .half, .half .enter { transition: none; } }
.visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
main { display: contents; }
