:root {
  --radius: 0.5rem;
  --app-safe-area-top: env(safe-area-inset-top, 0px);
  --app-safe-area-right: env(safe-area-inset-right, 0px);
  --app-safe-area-bottom: env(safe-area-inset-bottom, 0px);
  --app-safe-area-left: env(safe-area-inset-left, 0px);
  --background: #000000;
  --foreground: oklch(0.95 0.01 250);
  --card: oklch(0.18 0.04 250);
  --card-foreground: oklch(0.95 0.01 250);
  --popover: oklch(0.18 0.04 250);
  --popover-foreground: oklch(0.95 0.01 250);
  --primary: oklch(0.78 0.15 75);
  --primary-foreground: oklch(0.13 0.03 250);
  --secondary: oklch(0.22 0.04 250);
  --secondary-foreground: oklch(0.95 0.01 250);
  --muted: oklch(0.22 0.04 250);
  --muted-foreground: oklch(0.65 0.04 250);
  --accent: oklch(0.78 0.15 75);
  --accent-foreground: oklch(0.13 0.03 250);
  --destructive: oklch(0.577 0.245 27.325);
  --border: oklch(1 0 0 / 12%);
  --input: oklch(1 0 0 / 10%);
  --ring: oklch(0.78 0.15 75);
  --chart-1: oklch(0.646 0.222 41.116);
  --chart-2: oklch(0.6 0.118 184.704);
  --chart-3: oklch(0.398 0.07 227.392);
  --chart-4: oklch(0.828 0.189 84.429);
  --chart-5: oklch(0.769 0.188 70.08);
  --sidebar: oklch(0.16 0.04 250);
  --sidebar-foreground: oklch(0.95 0.01 250);
  --sidebar-primary: oklch(0.78 0.15 75);
  --sidebar-primary-foreground: oklch(0.13 0.03 250);
  --sidebar-accent: oklch(0.22 0.04 250);
  --sidebar-accent-foreground: oklch(0.95 0.01 250);
  --sidebar-border: oklch(1 0 0 / 12%);
  --sidebar-ring: oklch(0.78 0.15 75);
}

.dark {
  --background: #000000;
  --foreground: oklch(0.95 0.01 250);
  --card: oklch(0.18 0.04 250);
  --card-foreground: oklch(0.95 0.01 250);
  --popover: oklch(0.18 0.04 250);
  --popover-foreground: oklch(0.95 0.01 250);
  --primary: oklch(0.78 0.15 75);
  --primary-foreground: oklch(0.13 0.03 250);
  --secondary: oklch(0.22 0.04 250);
  --secondary-foreground: oklch(0.95 0.01 250);
  --muted: oklch(0.22 0.04 250);
  --muted-foreground: oklch(0.65 0.04 250);
  --accent: oklch(0.78 0.15 75);
  --accent-foreground: oklch(0.13 0.03 250);
  --destructive: oklch(0.704 0.191 22.216);
  --border: oklch(1 0 0 / 12%);
  --input: oklch(1 0 0 / 10%);
  --ring: oklch(0.78 0.15 75);
  --chart-1: oklch(0.488 0.243 264.376);
  --chart-2: oklch(0.696 0.17 162.48);
  --chart-3: oklch(0.769 0.188 70.08);
  --chart-4: oklch(0.627 0.265 303.9);
  --chart-5: oklch(0.645 0.246 16.439);
  --sidebar: oklch(0.16 0.04 250);
  --sidebar-foreground: oklch(0.95 0.01 250);
  --sidebar-primary: oklch(0.78 0.15 75);
  --sidebar-primary-foreground: oklch(0.13 0.03 250);
  --sidebar-accent: oklch(0.22 0.04 250);
  --sidebar-accent-foreground: oklch(0.95 0.01 250);
  --sidebar-border: oklch(1 0 0 / 12%);
  --sidebar-ring: oklch(0.78 0.15 75);
}

* {
  border-color: var(--border);
  outline-color: color-mix(in oklab, var(--ring) 50%, transparent);
}

body {
  background: var(--background);
  color: var(--foreground);
  margin: 0;
  min-width: 320px;
  min-height: 100dvh;
  overscroll-behavior: none;
}

html,
#root {
  min-height: 100%;
  background: #000000;
}

.min-h-screen {
  min-height: 100dvh;
  background-color: #000000 !important;
  background-image: none !important;
}

button:not(:disabled),
[role="button"]:not(:disabled) {
  cursor: pointer;
}

@media (max-width: 640px) {
  button,
  input,
  textarea,
  select {
    font-size: 16px;
  }
  header,
  [data-app-header] {
    padding-top: max(0.75rem, var(--app-safe-area-top));
  }
  [data-mobile-input] {
    padding-bottom: max(0.75rem, var(--app-safe-area-bottom));
  }
}

/* iOS Safari renders its bottom address bar over the page. Keep the chat
   composer above that browser chrome; installed PWAs do not need the reserve. */
@media (max-width: 640px) and (-webkit-touch-callout: none) {
  [data-chat-composer] {
    padding-bottom: max(5.25rem, calc(var(--app-safe-area-bottom) + 4.25rem));
  }
  [data-call-controls] {
    padding-bottom: max(5.25rem, calc(var(--app-safe-area-bottom) + 4.25rem));
  }
}

@media (display-mode: standalone), (display-mode: fullscreen) {
  [data-chat-composer] {
    padding-bottom: max(0.75rem, var(--app-safe-area-bottom));
  }
  [data-call-controls] {
    padding-bottom: max(1.5rem, var(--app-safe-area-bottom));
  }
}

.english-portal {
  min-height: 100dvh;
  background: radial-gradient(
    circle at 50% 12%,
    #123d68 0,
    #07192d 35%,
    #030b15 78%
  );
  color: #f4f7fb;
  padding: 0 1rem;
  font-family: Inter, ui-sans-serif, system-ui, sans-serif;
}
.portal-shell {
  width: min(100%, 36rem);
  min-height: 100dvh;
  margin: auto;
  padding: max(2.2rem, var(--app-safe-area-top)) 0
    max(1.5rem, var(--app-safe-area-bottom));
  display: flex;
  flex-direction: column;
}
.english-portal header {
  text-align: center;
}
.portal-kicker {
  color: #d7ad5b;
  font-size: 0.72rem;
  letter-spacing: 0.28em;
}
.english-portal h1 {
  margin: 0.65rem 0 0.35rem;
  font-size: clamp(1.75rem, 7vw, 2.65rem);
  letter-spacing: 0.04em;
}
.english-portal header > p:last-child {
  font-size: 0.76rem;
  letter-spacing: 0.16em;
  color: #b8c6d6;
}
.portal-emblem {
  width: 15rem;
  height: 15rem;
  margin: 1.5rem auto;
  display: grid;
  place-items: center;
  position: relative;
  border: 2px solid #cda657;
  border-radius: 50%;
  color: #d7ad5b;
  background: radial-gradient(circle, #153a5c, #071522 70%);
  box-shadow:
    0 0 3rem #0d6bc455,
    inset 0 0 2rem #000;
}
.portal-emblem strong {
  position: absolute;
  font-size: 2rem;
}
.portal-emblem span {
  position: absolute;
  bottom: 2.4rem;
  font-size: 0.53rem;
  letter-spacing: 0.13em;
}
.portal-card {
  border-top: 1px solid #b28b45;
  padding-top: 1.15rem;
}
.portal-card h2 {
  margin: 0 0 1.35rem;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0.5rem;
  color: #d7ad5b;
  font-size: 0.78rem;
  letter-spacing: 0.14em;
}
.portal-card label {
  display: block;
  margin-top: 1rem;
  font-size: 0.76rem;
  font-weight: 700;
  letter-spacing: 0.05em;
}
.portal-input {
  display: flex;
  align-items: center;
  gap: 0.7rem;
  margin-top: 0.45rem;
  border: 1px solid #385471;
  border-radius: 0.55rem;
  background: #061525;
  padding: 0 0.85rem;
  color: #8798aa;
}
.portal-card input {
  width: 100%;
  border: 0;
  background: transparent;
  color: #fff;
  padding: 1rem 0;
  font-size: 1rem;
  outline: none;
}
.portal-note {
  margin: 0.55rem 0 0;
  color: #99a6b4;
  font-size: 0.68rem;
  line-height: 1.45;
  letter-spacing: 0.04em;
}
.portal-card button {
  width: 100%;
  margin-top: 1.3rem;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 1rem;
  border: 1px solid #2581db;
  border-radius: 0.55rem;
  background: linear-gradient(180deg, #1470c8, #07427d);
  color: #fff;
  padding: 1rem;
  font-size: 1.05rem;
  letter-spacing: 0.12em;
}
.portal-card button:disabled {
  opacity: 0.45;
}
.portal-security {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.8rem;
  margin-top: 1.5rem;
  border: 1px solid #8d6b34;
  border-radius: 0.7rem;
  padding: 1rem;
  color: #d7ad5b;
}
.portal-security div {
  display: flex;
  flex-direction: column;
}
.portal-security span {
  margin-top: 0.2rem;
  color: #8999aa;
  font-size: 0.7rem;
}
.english-portal footer {
  margin-top: auto;
  padding-top: 1.6rem;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0.45rem;
  color: #7f8d9b;
  font-size: 0.62rem;
  letter-spacing: 0.06em;
  text-align: center;
}

.english-portal {
  background:
    linear-gradient(180deg, #03132655, #020913 58%, #02060c),
    url("/sandiego-portal-night-v2.png") center top/cover fixed;
}
.portal-shell {
  width: min(100%, 32rem);
  padding: max(1.1rem, env(safe-area-inset-top)) 0
    max(0.8rem, env(safe-area-inset-bottom));
}
.portal-brand {
  margin: 0 auto 0.35rem;
  width: 2.8rem;
  height: 2.8rem;
  display: grid;
  place-items: center;
  position: relative;
  color: #e0b660;
}
.portal-brand span {
  position: absolute;
  font-size: 0.68rem;
  font-weight: 900;
}
.portal-kicker {
  font-size: 0.58rem;
}
.english-portal h1 {
  margin: 0.3rem 0 0.2rem;
  font-size: clamp(1.45rem, 5.7vw, 2rem);
  line-height: 1.04;
}
.english-portal header > p:last-child {
  font-size: 0.58rem;
}
.portal-emblem {
  display: none;
}
.portal-card {
  margin-top: 1.1rem;
  border: 1px solid #cba04b66;
  border-radius: 1rem;
  padding: 1rem;
  background: #03101de8;
  box-shadow: 0 1rem 2.5rem #000d;
  backdrop-filter: blur(10px);
}
.portal-card h2 {
  margin-bottom: 0.75rem;
}
.portal-card label {
  margin-top: 0.7rem;
}
.portal-card input {
  padding: 0.78rem 0;
}
.portal-card button {
  margin-top: 1rem;
  padding: 0.82rem;
}
.portal-security {
  margin-top: 0.7rem;
  padding: 0.65rem;
  background: #03101dcc;
}
.english-portal footer {
  padding-top: 0.7rem;
}
.portal-assurance {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.65rem;
  margin-top: 0.75rem;
  border: 1px solid #b78b4266;
  border-radius: 0.7rem;
  padding: 0.65rem;
  color: #dfb867;
  background: #03101de8;
}
.portal-assurance div {
  display: flex;
  flex-direction: column;
}
.portal-assurance strong {
  font-size: 0.7rem;
  letter-spacing: 0.08em;
}
.portal-assurance span {
  font-size: 0.62rem;
  color: #9eabb8;
}
.portal-security-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  margin-top: 0.7rem;
  border-top: 1px solid #ffffff1a;
  border-bottom: 1px solid #ffffff1a;
  padding: 0.75rem 0;
  background: #020b14dd;
}
.portal-security-grid > div {
  display: flex;
  align-items: center;
  flex-direction: column;
  gap: 0.35rem;
  padding: 0 0.45rem;
  text-align: center;
  border-right: 1px solid #ffffff1a;
}
.portal-security-grid > div:last-child {
  border: 0;
}
.portal-security-grid svg {
  width: 20px;
  color: #d9aa54;
}
.portal-security-grid strong {
  font-size: 0.6rem;
  line-height: 1.25;
  white-space: pre-line;
}
.portal-security-grid span {
  font-size: 0.52rem;
  line-height: 1.35;
  color: #8997a5;
}
.portal-locale-ja {
  font-family:
    "Noto Sans JP", "Hiragino Sans", "Yu Gothic", "Meiryo", Inter,
    ui-sans-serif, system-ui, sans-serif;
}
.portal-locale-ja .portal-kicker,
.portal-locale-ja .portal-card h2,
.portal-locale-ja footer {
  letter-spacing: 0.1em;
}
.portal-locale-ja h1 {
  letter-spacing: 0.06em;
}
.portal-locale-ja .portal-card label {
  letter-spacing: 0.03em;
}

/* aichijp.com-only private entry. It deliberately uses a neutral Japanese
   service identity and contains no government seal or agency claim. */
.aichijp-login {
  --aichijp-navy: #10243d;
  --aichijp-muted: #536276;
  --aichijp-red: #bc002d;
  --aichijp-red-dark: #960025;
  --aichijp-paper: #f7f6f2;
  position: relative;
  isolation: isolate;
  min-height: 100dvh;
  display: grid;
  grid-template-rows: auto 1fr auto;
  overflow-x: hidden;
  color: var(--aichijp-navy);
  background: var(--aichijp-paper);
  font-family:
    "Hiragino Kaku Gothic ProN", "Yu Gothic", Meiryo, ui-sans-serif, system-ui,
    sans-serif;
}

.aichijp-login__background {
  position: fixed;
  z-index: -1;
  inset: 0;
  background:
    linear-gradient(115deg, rgb(255 255 255 / 96%), rgb(247 246 242 / 90%)),
    #fff;
}

.aichijp-login__background::before {
  content: "";
  position: absolute;
  width: clamp(330px, 42vw, 650px);
  aspect-ratio: 1;
  left: clamp(-180px, 6vw, 90px);
  top: 50%;
  translate: 0 -48%;
  border-radius: 50%;
  background: var(--aichijp-red);
  box-shadow: 0 0 90px rgb(188 0 45 / 8%);
}

.aichijp-login__background::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    repeating-linear-gradient(
      115deg,
      transparent 0 31px,
      rgb(16 36 61 / 1.8%) 31px 32px
    ),
    linear-gradient(
      90deg,
      rgb(255 255 255 / 12%),
      rgb(255 255 255 / 80%) 56%,
      rgb(247 246 242 / 96%)
    );
}

.aichijp-login__site-header,
.aichijp-login__footer,
.aichijp-login__main-inner {
  width: min(1180px, calc(100% - 48px));
  margin-inline: auto;
}

.aichijp-login__site-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.5rem;
  padding-top: max(1.55rem, calc(var(--app-safe-area-top) + 0.8rem));
  padding-bottom: 1.35rem;
  border-bottom: 1px solid rgb(16 36 61 / 20%);
}

.aichijp-login__brand {
  display: flex;
  align-items: center;
  gap: 0.875rem;
}

.aichijp-login__brand-mark {
  display: grid;
  flex: 0 0 auto;
  place-items: center;
  width: 42px;
  height: 42px;
  border: 1px solid rgb(16 36 61 / 19%);
  border-radius: 50%;
  background: rgb(255 255 255 / 92%);
  box-shadow: 0 7px 20px rgb(16 36 61 / 9%);
}

.aichijp-login__brand-mark::before {
  content: "";
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: var(--aichijp-red);
}

.aichijp-login__brand-copy {
  display: grid;
  gap: 3px;
}

.aichijp-login__brand-copy strong {
  font-family: "Yu Mincho", "Hiragino Mincho ProN", serif;
  font-size: 1rem;
  letter-spacing: 0.055em;
}

.aichijp-login__brand-copy small {
  color: #718092;
  font-size: 0.625rem;
  font-weight: 600;
  letter-spacing: 0.18em;
}

.aichijp-login__domain {
  color: #617084;
  font-family: Georgia, serif;
  font-size: 0.875rem;
  letter-spacing: 0.12em;
}

.aichijp-login__main {
  display: grid;
  align-items: center;
  padding-block: 3.4rem 3.9rem;
}

.aichijp-login__main-inner {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(410px, 468px);
  align-items: center;
  gap: clamp(3.5rem, 9vw, 8.1rem);
}

.aichijp-login__hero-copy {
  position: relative;
  min-height: 370px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding-left: clamp(1.75rem, 5vw, 4.5rem);
  color: #fff;
  text-shadow: 0 2px 20px rgb(95 0 23 / 16%);
}

.aichijp-login__hero-kicker {
  display: flex;
  align-items: center;
  gap: 0.7rem;
  margin: 0 0 1.1rem;
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.24em;
}

.aichijp-login__hero-kicker::before {
  content: "";
  width: 30px;
  height: 1px;
  background: currentColor;
}

.aichijp-login__hero-copy h1 {
  max-width: 520px;
  margin: 0;
  font-family: "Yu Mincho", "Hiragino Mincho ProN", serif;
  font-size: clamp(2.2rem, 4.1vw, 3.6rem);
  font-weight: 600;
  line-height: 1.42;
  letter-spacing: 0.065em;
}

.aichijp-login__hero-description {
  max-width: 445px;
  margin: 1.55rem 0 0;
  font-size: 0.875rem;
  line-height: 2;
  letter-spacing: 0.055em;
}

.aichijp-login__card {
  position: relative;
  padding: 2.7rem 2.7rem 2.45rem;
  overflow: hidden;
  border: 1px solid rgb(255 255 255 / 88%);
  border-radius: 1rem;
  background: rgb(255 255 255 / 94%);
  box-shadow:
    0 32px 70px rgb(16 36 61 / 16%),
    0 8px 22px rgb(16 36 61 / 8%);
  backdrop-filter: blur(12px);
}

.aichijp-login__card::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: 4px;
  background: linear-gradient(
    90deg,
    var(--aichijp-red-dark),
    #d2264e 68%,
    var(--aichijp-red)
  );
}

.aichijp-login__card-kicker {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  margin: 0 0 0.9rem;
  color: var(--aichijp-red-dark);
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.18em;
}

.aichijp-login__card-kicker::before {
  content: "";
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--aichijp-red);
  box-shadow: 0 0 0 4px rgb(188 0 45 / 10%);
}

.aichijp-login__card h2 {
  margin: 0 0 0.65rem;
  font-family: "Yu Mincho", "Hiragino Mincho ProN", serif;
  font-size: clamp(1.65rem, 3vw, 2rem);
  font-weight: 600;
  line-height: 1.45;
  letter-spacing: 0.035em;
}

.aichijp-login__intro {
  margin: 0 0 1.9rem;
  color: var(--aichijp-muted);
  font-size: 0.82rem;
  line-height: 1.8;
}

.aichijp-login__field {
  margin-bottom: 1.25rem;
}

.aichijp-login__field label {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 0.55rem;
  color: var(--aichijp-navy);
  font-size: 0.82rem;
  font-weight: 700;
  letter-spacing: 0.04em;
}

.aichijp-login__required {
  color: #8b96a4;
  font-size: 0.65rem;
  font-weight: 500;
  letter-spacing: 0.08em;
}

.aichijp-login__field input {
  display: block;
  width: 100%;
  height: 55px;
  padding: 0 1rem;
  border: 1px solid #cdd3db;
  border-radius: 0.5rem;
  outline: none;
  color: var(--aichijp-navy);
  background: rgb(250 250 248 / 94%);
  font-size: 0.95rem;
  transition:
    border-color 180ms ease,
    box-shadow 180ms ease,
    background 180ms ease;
}

.aichijp-login__field input::placeholder {
  color: #9aa4b0;
}

.aichijp-login__field input:focus {
  border-color: var(--aichijp-red);
  background: #fff;
  box-shadow: 0 0 0 4px rgb(188 0 45 / 10%);
}

.aichijp-login__primary {
  width: 100%;
  height: 56px;
  margin-top: 0.55rem;
  border: 0;
  border-radius: 0.5rem;
  color: #fff;
  background: linear-gradient(115deg, #a90029, #c20a36 58%, #a60028);
  box-shadow: 0 11px 24px rgb(188 0 45 / 20%);
  font-size: 0.95rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  cursor: pointer;
  transition:
    translate 180ms ease,
    box-shadow 180ms ease,
    filter 180ms ease;
}

.aichijp-login__primary:hover:not(:disabled) {
  translate: 0 -1px;
  filter: brightness(0.96);
  box-shadow: 0 15px 28px rgb(188 0 45 / 24%);
}

.aichijp-login__primary:disabled {
  cursor: not-allowed;
}

.aichijp-login__footer {
  display: flex;
  justify-content: space-between;
  gap: 1.25rem;
  padding-top: 1.2rem;
  padding-bottom: max(1.45rem, var(--app-safe-area-bottom));
  border-top: 1px solid rgb(16 36 61 / 16%);
  color: #6d7987;
  font-size: 0.7rem;
  letter-spacing: 0.055em;
}

.aichijp-login--restore {
  place-items: center;
  padding: 2rem;
}

.aichijp-login__loader {
  display: flex;
  align-items: center;
  gap: 0.8rem;
  color: var(--aichijp-navy);
  font-size: 0.95rem;
}

@media (max-width: 850px) {
  .aichijp-login__site-header,
  .aichijp-login__footer,
  .aichijp-login__main-inner {
    width: min(calc(100% - 36px), 560px);
  }

  .aichijp-login__site-header {
    padding-top: max(1.1rem, calc(var(--app-safe-area-top) + 0.65rem));
    padding-bottom: 1rem;
  }

  .aichijp-login__main {
    align-items: start;
    padding-block: 1.9rem 2.5rem;
  }

  .aichijp-login__main-inner {
    display: block;
  }

  .aichijp-login__background::before {
    width: 385px;
    left: 50%;
    top: calc(var(--app-safe-area-top) + 148px);
    translate: -50% 0;
  }

  .aichijp-login__background::after {
    background: linear-gradient(
      180deg,
      rgb(255 255 255 / 6%),
      rgb(247 246 242 / 94%) 54%,
      var(--aichijp-paper) 100%
    );
  }

  .aichijp-login__hero-copy {
    min-height: 218px;
    align-items: center;
    justify-content: center;
    padding-left: 0;
    text-align: center;
  }

  .aichijp-login__hero-kicker {
    margin-bottom: 0.65rem;
  }

  .aichijp-login__hero-copy h1 {
    font-size: clamp(1.8rem, 8vw, 2.5rem);
    line-height: 1.35;
  }

  .aichijp-login__hero-description {
    display: none;
  }

  .aichijp-login__card {
    margin-top: 0.5rem;
  }
}

@media (max-width: 560px) {
  .aichijp-login__site-header,
  .aichijp-login__footer,
  .aichijp-login__main-inner {
    width: min(calc(100% - 30px), 440px);
  }

  .aichijp-login__brand {
    gap: 0.65rem;
  }

  .aichijp-login__brand-mark {
    width: 36px;
    height: 36px;
  }

  .aichijp-login__brand-mark::before {
    width: 15px;
    height: 15px;
  }

  .aichijp-login__brand-copy strong {
    font-size: 0.82rem;
  }

  .aichijp-login__brand-copy small {
    font-size: 0.52rem;
    letter-spacing: 0.12em;
  }

  .aichijp-login__domain {
    display: none;
  }

  .aichijp-login__main {
    padding-block: 0.95rem 1.9rem;
  }

  .aichijp-login__background::before {
    width: 310px;
    top: calc(var(--app-safe-area-top) + 112px);
  }

  .aichijp-login__hero-copy {
    min-height: 185px;
  }

  .aichijp-login__hero-kicker {
    font-size: 0.625rem;
  }

  .aichijp-login__hero-copy h1 {
    font-size: 1.8rem;
    letter-spacing: 0.045em;
  }

  .aichijp-login__card {
    margin-top: 0;
    padding: 2.05rem 1.5rem 1.75rem;
    border-radius: 0.9rem;
  }

  .aichijp-login__card h2 {
    font-size: 1.55rem;
  }

  .aichijp-login__intro {
    margin-bottom: 1.55rem;
  }

  .aichijp-login__field {
    margin-bottom: 1.05rem;
  }

  .aichijp-login__field input {
    height: 53px;
  }

  .aichijp-login__primary {
    height: 54px;
  }

  .aichijp-login__footer {
    padding-top: 0.95rem;
    padding-bottom: max(1.1rem, var(--app-safe-area-bottom));
  }

  .aichijp-login__footer span:last-child {
    display: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .aichijp-login__field input,
  .aichijp-login__primary {
    transition: none;
  }
}

.japan-portal {
  position: relative;
  height: 100dvh;
  overflow: hidden;
  background:
    radial-gradient(circle at 50% 8%, #231305 0, #100906 18%, #040404 55%),
    linear-gradient(180deg, #050403 0%, #060505 100%);
  color: #f5ecd8;
  font-family:
    "Noto Sans JP", "Hiragino Sans", "Yu Gothic", "Meiryo", Inter,
    ui-sans-serif, system-ui, sans-serif;
}

.japan-portal--restore {
  display: grid;
  place-items: center;
  padding: 2rem;
}

.japan-loader {
  display: flex;
  align-items: center;
  gap: 0.8rem;
  color: #f3d8a0;
  font-size: 0.95rem;
  letter-spacing: 0.08em;
}

.japan-shell {
  position: relative;
  z-index: 1;
  width: min(100%, 24rem);
  height: 100dvh;
  margin: 0 auto;
  padding: max(0.95rem, calc(var(--app-safe-area-top) + 0.7rem)) 0.85rem
    max(0.85rem, var(--app-safe-area-bottom));
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.japan-hero {
  position: relative;
  min-height: 26rem;
  flex: 0 0 auto;
}

.japan-hero__art {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, transparent 0%, transparent 72%, #050403 100%),
    url("/japan-hero-reference.png") center top / cover no-repeat;
  border-bottom-left-radius: 2rem;
  border-bottom-right-radius: 2rem;
  box-shadow: inset 0 -4rem 5rem #050403b3;
}

.japan-card {
  margin-top: -2.9rem;
  border: 1px solid #d3a55799;
  border-radius: 1.45rem;
  padding: 1rem;
  background:
    radial-gradient(circle at 50% 0, #25170b40 0, transparent 26%),
    linear-gradient(180deg, #14100df0 0%, #080706f7 100%);
  box-shadow:
    0 1.8rem 4rem #000e,
    inset 0 1px 0 #f0d49f20;
  backdrop-filter: blur(14px);
}

.japan-card__header {
  text-align: center;
}

.japan-card__header h1 {
  margin: 0;
  font-family: "Shippori Mincho", "Noto Serif JP", "Yu Mincho", serif;
  font-size: clamp(1.45rem, 6vw, 1.9rem);
  letter-spacing: 0.04em;
  color: #fff4dd;
  font-weight: 700;
}

.japan-card__header p {
  margin: 0.42rem 0 0.9rem;
  font-size: 0.8rem;
  color: #d0c1a8;
  letter-spacing: 0.08em;
}

.japan-input {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  margin-top: 0.65rem;
  border: 1px solid #c39a57bb;
  border-radius: 0.95rem;
  padding: 0 0.9rem;
  background: #090808e6;
  color: #cfa66c;
  box-shadow: inset 0 1px 0 #ffffff0d;
}

.japan-input input {
  width: 100%;
  border: 0;
  background: transparent;
  color: #f9ecd1;
  padding: 0.9rem 0;
  font-size: 0.98rem;
  outline: none;
}

.japan-input input::placeholder {
  color: #a79176;
}

.japan-card__primary,
.japan-card__secondary,
.japan-help-toggle {
  width: 100%;
  border-radius: 1rem;
  transition:
    transform 180ms ease,
    border-color 180ms ease,
    background-color 180ms ease;
}

.japan-card__primary:hover,
.japan-card__secondary:hover,
.japan-help-toggle:hover {
  transform: translateY(-1px);
}

.japan-card__primary {
  margin-top: 0.95rem;
  border: 0;
  background: linear-gradient(180deg, #f4d79e 0%, #d19c43 100%);
  color: #160f07;
  padding: 0.85rem;
  font-size: 1.3rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  box-shadow: 0 1rem 1.5rem #8d5d132b;
  font-family: "Shippori Mincho", "Noto Serif JP", serif;
}

.japan-card__primary:disabled {
  opacity: 0.5;
  transform: none;
}

.japan-divider {
  margin: 0.78rem 0 0.65rem;
  display: flex;
  align-items: center;
  gap: 0.8rem;
  color: #b59a71;
}

.japan-divider span {
  height: 1px;
  flex: 1;
  background: linear-gradient(90deg, transparent, #8e6b37, transparent);
}

.japan-divider small {
  font-size: 0.8rem;
  letter-spacing: 0.18em;
}

.japan-card__secondary,
.japan-help-toggle {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.8rem;
  border: 1px solid #876231;
  background: #0b0908;
  color: #f4e0bc;
  padding: 0.85rem;
  font-size: 0.92rem;
}

.japan-help-toggle {
  justify-content: space-between;
  margin-top: 0.65rem;
  padding-inline: 0.9rem;
  color: #ebd6ae;
}

.japan-help-toggle span {
  display: inline-flex;
  align-items: center;
  gap: 0.7rem;
}

.japan-help-toggle .rotate-90 {
  transform: rotate(90deg);
}

.japan-help-panel {
  margin-top: 0.65rem;
  border: 1px solid #5f4724;
  border-radius: 0.95rem;
  background: #100c0ae8;
  padding: 0.8rem 0.9rem;
}

.japan-help-panel strong {
  display: block;
  margin-bottom: 0.35rem;
  color: #f6dfb0;
  font-size: 0.84rem;
}

.japan-help-panel p,
.japan-inline-message {
  margin: 0;
  color: #cdb899;
  font-size: 0.74rem;
  line-height: 1.5;
}

.japan-help-panel p + p {
  margin-top: 0.45rem;
}

.japan-inline-message {
  margin-top: 0.55rem;
  text-align: center;
}

.japan-footer {
  margin-top: 0.75rem;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.45rem;
  color: #efd9ad;
  font-size: 0.82rem;
}

@media (min-width: 768px) {
  .japan-shell {
    width: min(100%, 25rem);
    padding-top: max(1rem, calc(var(--app-safe-area-top) + 0.7rem));
  }

  .japan-hero {
    min-height: 28rem;
  }

  .japan-card {
    margin-top: -3.2rem;
  }
}

/* Private login surface: used by nyfbi.org and the Capacitor app only. The
   styling intentionally avoids government-agency names, seals, or approval claims. */
.nyfbi-login {
  min-height: 100dvh;
  color: #f8fbff;
  background:
    linear-gradient(180deg, #061427 0%, #061427aa 42%, #020913 100%),
    radial-gradient(circle at 22% 10%, #1b5da388 0 18%, transparent 42%),
    radial-gradient(circle at 78% 20%, #c19b4a3b 0 10%, transparent 30%),
    repeating-linear-gradient(
      115deg,
      #7d1322 0 22px,
      #f2f5f6 22px 38px,
      #0b2446 38px 66px
    );
  font-family:
    Inter,
    ui-sans-serif,
    system-ui,
    -apple-system,
    BlinkMacSystemFont,
    "Segoe UI",
    sans-serif;
}

.nyfbi-login--restore {
  display: grid;
  place-items: center;
  padding: max(1.5rem, var(--app-safe-area-top))
    max(1.25rem, var(--app-safe-area-right))
    max(1.5rem, var(--app-safe-area-bottom))
    max(1.25rem, var(--app-safe-area-left));
}

.nyfbi-login__loader {
  display: flex;
  align-items: center;
  gap: 0.8rem;
  padding: 1rem 1.2rem;
  border: 1px solid #ffffff38;
  border-radius: 0.9rem;
  background: #07152ae6;
  color: #fff;
}

.nyfbi-login__shell {
  min-height: 100dvh;
  position: relative;
  display: grid;
  place-items: center;
  padding: max(0.7rem, var(--app-safe-area-top))
    max(0.7rem, var(--app-safe-area-right))
    max(0.8rem, var(--app-safe-area-bottom))
    max(0.7rem, var(--app-safe-area-left));
  background:
    linear-gradient(180deg, #03091420 0%, #020913ee 76%, #020913 100%),
    radial-gradient(circle at 50% 17%, #ffffff18 0 9%, transparent 27%),
    linear-gradient(110deg, #0a1a31bb 0 24%, transparent 48%),
    url("/sandiego-portal-night-v2.png") center top / cover no-repeat;
}

.nyfbi-login__shell::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(90deg, #061a38d8 0 16%, transparent 38%),
    repeating-linear-gradient(
      128deg,
      #ad1d34d5 0 16px,
      #ffffffd8 16px 27px,
      #153967d8 27px 48px
    );
  clip-path: polygon(0 0, 36% 0, 12% 42%, 0 56%);
  opacity: 0.58;
}

.nyfbi-login__form-column {
  position: relative;
  z-index: 1;
  width: min(100%, 35.4rem);
  margin: 0 auto;
}

.nyfbi-login__card {
  border: 1px solid #bd9550;
  border-radius: 0.2rem;
  padding: clamp(1rem, 3.4vw, 1.45rem);
  background:
    linear-gradient(180deg, #07162bea 0%, #03101ff5 100%),
    radial-gradient(circle at 50% 12%, #b68a4536 0 16%, transparent 34%);
  box-shadow:
    0 1.4rem 4rem #000c,
    inset 0 1px 0 #ffffff2b,
    inset 0 0 0 1px #ffffff12;
  backdrop-filter: blur(10px);
}

.nyfbi-login__utility {
  min-height: 1.2rem;
  display: flex;
  justify-content: flex-end;
}

.nyfbi-login__header,
.nyfbi-login__form-heading {
  text-align: center;
}

.nyfbi-login__supra {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.55rem;
  margin: 0.15rem 0 0.35rem;
  color: #f4d389;
  font-size: clamp(0.72rem, 2.4vw, 0.86rem);
  font-weight: 800;
  letter-spacing: 0.24em;
}

.nyfbi-login__supra span {
  width: clamp(2rem, 12vw, 4.2rem);
  height: 1px;
  background: linear-gradient(90deg, transparent, #d7ad5d);
}

.nyfbi-login__supra span:last-child {
  background: linear-gradient(90deg, #d7ad5d, transparent);
}

.nyfbi-login__shield {
  width: clamp(8.25rem, 34vw, 12rem);
  height: clamp(8.25rem, 34vw, 12rem);
  margin: 1rem auto 1.15rem;
  display: grid;
  place-items: center;
  border: 0.45rem solid #cda95b;
  border-radius: 50%;
  color: #f3d58b;
  background:
    radial-gradient(circle at 50% 44%, #0e2b54 0 38%, transparent 39%),
    repeating-conic-gradient(from 0deg, #cda95b 0 6deg, transparent 6deg 15deg),
    radial-gradient(circle, #071d38 0 58%, #d7b568 59% 70%, #06182f 71%);
  box-shadow:
    0 1rem 2.4rem #000a,
    inset 0 0 0 2px #0a213f,
    inset 0 0 0 8px #dfbd72;
}

.nyfbi-login__eyebrow,
.nyfbi-login__form-heading p {
  margin: 0;
  color: #e9eef9;
  font-size: clamp(0.72rem, 2.6vw, 0.92rem);
  font-weight: 650;
  line-height: 1.45;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}

.nyfbi-login__header h1 {
  max-width: 19ch;
  margin: 0 auto;
  color: #fff;
  font-size: clamp(1.95rem, 8.2vw, 3.25rem);
  line-height: 0.96;
  letter-spacing: 0.035em;
  text-transform: uppercase;
  text-shadow: 0 0.18rem 0.8rem #000d;
}

.nyfbi-login__form-heading {
  margin: 0.95rem 0 1.15rem;
}

.nyfbi-login__form-heading h2 {
  margin: 0 0 0.4rem;
  color: #d6ad5d;
  font-size: clamp(0.84rem, 3vw, 1rem);
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.nyfbi-login__field-label {
  margin-top: 0.98rem;
  color: #fff;
  font-size: clamp(0.78rem, 2.8vw, 0.95rem);
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.nyfbi-login__input {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  margin-top: 0.45rem;
  border: 1px solid #7d92ab;
  border-radius: 0.38rem;
  padding: 0 0.95rem;
  background: #031326d9;
  color: #d7b568;
}

.nyfbi-login__input:focus-within {
  border-color: #d4ae62;
  box-shadow: 0 0 0 3px #d4ae6233;
}

.nyfbi-login__input input {
  width: 100%;
  border: 0;
  outline: 0;
  background: transparent;
  color: #fff;
  padding: 0.95rem 0;
  font-size: clamp(0.96rem, 3vw, 1.08rem);
}

.nyfbi-login__input input::placeholder {
  color: #aab7c8;
}

.nyfbi-login__primary,
.nyfbi-login__secondary,
.nyfbi-login__help-toggle {
  width: 100%;
  border-radius: 0.8rem;
  transition:
    transform 180ms ease,
    border-color 180ms ease,
    background-color 180ms ease;
}

.nyfbi-login__primary:hover:not(:disabled),
.nyfbi-login__secondary:hover,
.nyfbi-login__help-toggle:hover {
  transform: translateY(-1px);
}

.nyfbi-login__primary {
  margin-top: 1.25rem;
  border: 1px solid #36a6ff;
  background: linear-gradient(180deg, #097df0 0%, #054184 100%);
  color: #fff;
  padding: 0.92rem 1rem;
  font-size: clamp(1.05rem, 3.3vw, 1.25rem);
  font-weight: 800;
  letter-spacing: 0.18em;
  box-shadow:
    0 0.7rem 1.8rem #0077ff33,
    inset 0 1px 0 #ffffff5f;
}

.nyfbi-login__primary:disabled {
  opacity: 0.5;
  transform: none;
}

.nyfbi-login__divider {
  margin: 0.95rem 0 0.65rem;
  display: flex;
  align-items: center;
  gap: 0.7rem;
  color: #b9c8df;
}

.nyfbi-login__divider span {
  height: 1px;
  flex: 1;
  background: #b9d1f144;
}

.nyfbi-login__divider small {
  font-size: 0.75rem;
}

.nyfbi-login__secondary,
.nyfbi-login__help-toggle {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.65rem;
  border: 1px solid #7d92ab66;
  background: #041528d9;
  color: #e8f0ff;
  padding: 0.82rem;
  font-size: 0.92rem;
}

.nyfbi-login__approval {
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  gap: 0.9rem;
  margin-top: 1.25rem;
  border: 1px solid #c89a4f;
  border-radius: 0.55rem;
  padding: 0.8rem;
  background: linear-gradient(180deg, #07172ee8, #020a14f0);
  color: #f0d292;
}

.nyfbi-login__approval-seal {
  width: 4rem;
  height: 4rem;
  display: grid;
  place-items: center;
  border: 0.2rem solid #c89a4f;
  border-radius: 50%;
  background: #082244;
  color: #fff;
  font-weight: 900;
  letter-spacing: 0.05em;
}

.nyfbi-login__approval strong,
.nyfbi-login__approval span {
  display: block;
  text-align: center;
}

.nyfbi-login__approval strong {
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(1rem, 3.3vw, 1.35rem);
  letter-spacing: 0.06em;
}

.nyfbi-login__approval span {
  margin-top: 0.35rem;
  color: #f4f7ff;
  font-size: clamp(0.78rem, 2.7vw, 0.95rem);
  font-weight: 700;
  letter-spacing: 0.05em;
}

.nyfbi-login__feature-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.55rem;
  margin-top: 1.05rem;
  border-top: 1px solid #ffffff2e;
  border-bottom: 1px solid #ffffff2e;
  padding: 0.85rem 0;
}

.nyfbi-login__feature-grid div {
  display: grid;
  justify-items: center;
  gap: 0.32rem;
  padding: 0 0.35rem;
  text-align: center;
  color: #d7b568;
}

.nyfbi-login__feature-grid div + div {
  border-left: 1px solid #ffffff24;
}

.nyfbi-login__feature-grid strong {
  color: #fff;
  font-size: clamp(0.61rem, 2.2vw, 0.78rem);
  line-height: 1.15;
}

.nyfbi-login__feature-grid span {
  color: #c8d2df;
  font-size: clamp(0.56rem, 2vw, 0.7rem);
  line-height: 1.25;
}

.nyfbi-login__help-toggle {
  justify-content: space-between;
  margin-top: 0.65rem;
  padding-inline: 0.9rem;
}

.nyfbi-login__help-toggle span {
  display: inline-flex;
  align-items: center;
  gap: 0.65rem;
}

.nyfbi-login__help-toggle .rotate-90 {
  transform: rotate(90deg);
}

.nyfbi-login__help-panel {
  margin-top: 0.65rem;
  border: 1px solid #b9d1f144;
  border-radius: 0.8rem;
  padding: 0.8rem 0.9rem;
  background: #030b19b8;
}

.nyfbi-login__help-panel strong,
.nyfbi-login__help-panel p,
.nyfbi-login__inline-message {
  color: #d9e5f7;
  font-size: 0.78rem;
  line-height: 1.5;
}

.nyfbi-login__help-panel strong {
  display: block;
  margin-bottom: 0.35rem;
}

.nyfbi-login__help-panel p {
  margin: 0;
}

.nyfbi-login__help-panel p + p {
  margin-top: 0.45rem;
}

.nyfbi-login__inline-message {
  margin: 0.6rem 0 0;
  text-align: center;
}

.nyfbi-login__footer {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  gap: 0.45rem;
  margin: 0.7rem auto 0;
  padding: 0.55rem 0.75rem;
  border: 1px solid #ffffff24;
  border-radius: 0.4rem;
  background: #020913e8;
  color: #cfd9e7;
  font-size: 0.72rem;
  line-height: 1.4;
  text-align: center;
}

@media (min-width: 768px) {
  .nyfbi-login__shell {
    padding-block: max(1.2rem, var(--app-safe-area-top))
      max(1.2rem, var(--app-safe-area-bottom));
  }

  .nyfbi-login__form-column {
    width: min(42rem, calc(100% - 2rem));
  }

  .nyfbi-login__card {
    padding: 1.65rem;
  }
}