html.ch12-customer-overlay-active,
html.ch12-customer-overlay-active body {
  min-height: 100%;
  overflow: hidden;
  color-scheme: dark;
}

.ch12-customer-overlay {
  position: fixed;
  inset: 0;
  z-index: 2147482000;
  overflow: auto;
  background: rgba(5,3,8,.48);
  backdrop-filter:
    blur(14px)
    brightness(.56)
    saturate(.84);
  -webkit-backdrop-filter:
    blur(14px)
    brightness(.56)
    saturate(.84);
}

.ch12-old-login-origin {
  display: none !important;
}

.ch12-login-overlay {
  display: grid;
  padding: 24px;
  place-items: center;
}

.ch12-own-account-card {
  width: min(590px,100%) !important;
  max-width: 590px !important;
  min-height: auto !important;
  margin: auto !important;
  padding:
    clamp(30px,5vw,52px) !important;
  border:
    1px solid
    rgba(255,255,255,.13) !important;
  border-radius: 26px !important;
  background:
    linear-gradient(
      145deg,
      rgba(24,13,31,.94),
      rgba(9,5,14,.97)
    ) !important;
  box-shadow:
    0 35px 110px rgba(0,0,0,.65),
    inset 0 1px rgba(255,255,255,.08)
    !important;
}

.ch12-account-notice {
  display: grid;
  gap: 5px;
  margin: 14px 0 20px;
  padding: 13px 15px;
  border:
    1px solid rgba(219,170,99,.2);
  border-radius: 13px;
  background: rgba(255,255,255,.035);
}

.ch12-account-notice strong {
  color: #f2cc88;
  font-size: 12px;
}

.ch12-account-notice span {
  color: rgba(255,255,255,.6);
  font-size: 11px;
  line-height: 1.5;
}

.ch12-provider-login {
  min-height: 52px !important;
  border:
    1px solid
    rgba(255,255,255,.11) !important;
  border-radius: 13px !important;
  background:
    rgba(255,255,255,.055) !important;
}

.ch12-provider-logo {
  width: 23px;
  height: 23px;
  margin-right: 9px;
  object-fit: contain;
}

.ch12-search-overlay {
  padding: 24px;
}

.ch12-search-panel {
  width: min(1120px,100%);
  min-height: calc(100vh - 48px);
  margin: auto;
  padding:
    clamp(24px,5vw,58px);
  border:
    1px solid rgba(255,255,255,.12);
  border-radius: 30px;
  background:
    linear-gradient(
      145deg,
      rgba(20,10,28,.94),
      rgba(7,4,11,.97)
    );
  box-shadow:
    0 38px 120px rgba(0,0,0,.6);
}

.ch12-search-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.ch12-nana-brand {
  display: flex;
  gap: 10px;
  align-items: center;
  color: #f0cd8c;
  text-decoration: none;
  letter-spacing: .16em;
}

.ch12-nana-brand span {
  display: grid;
  width: 34px;
  height: 34px;
  place-items: center;
  border:
    1px solid rgba(240,205,140,.38);
  border-radius: 10px;
  font-family: Georgia,serif;
  font-size: 22px;
}

.ch12-login-link {
  padding: 10px 16px;
  border:
    1px solid rgba(255,255,255,.13);
  border-radius: 999px;
  color: #fff;
  text-decoration: none;
}

.ch12-search-hero {
  max-width: 780px;
  margin: 11vh auto 54px;
  text-align: center;
}

.ch12-search-hero > p {
  color: #e1b873;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .22em;
}

.ch12-search-hero h1 {
  margin: 15px 0 30px;
  color: #fffaf4;
  font-family:
    Georgia,
    "Times New Roman",
    serif;
  font-size: clamp(44px,7vw,80px);
  font-weight: 500;
  line-height: 1;
  letter-spacing: -.045em;
}

.ch12-search-form {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 10px;
  padding: 8px;
  border:
    1px solid rgba(255,255,255,.13);
  border-radius: 18px;
  background: rgba(255,255,255,.055);
}

.ch12-search-form input {
  min-width: 0;
  min-height: 52px;
  padding: 0 16px;
  border: 0;
  outline: 0;
  color: #fff;
  background: transparent;
  font-size: 15px;
}

.ch12-search-form button {
  padding: 0 24px;
  border: 0;
  border-radius: 13px;
  color: #100917;
  background:
    linear-gradient(
      135deg,
      #f0cf91,
      #c99552
    );
  font-weight: 700;
}

.ch12-search-hero small {
  display: block;
  margin-top: 13px;
  color: rgba(255,255,255,.45);
}

.ch12-search-results {
  display: grid;
  grid-template-columns:
    repeat(3,minmax(0,1fr));
  gap: 14px;
}

.ch12-search-result {
  display: grid;
  gap: 8px;
  min-height: 150px;
  padding: 20px;
  border:
    1px solid rgba(255,255,255,.1);
  border-radius: 17px;
  color: #fff;
  text-decoration: none;
  background: rgba(255,255,255,.04);
  transition:
    transform .18s ease,
    border-color .18s ease;
}

.ch12-search-result:hover {
  transform: translateY(-3px);
  border-color: rgba(231,184,112,.45);
}

.ch12-search-result span {
  color: #ddb570;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.ch12-search-result strong {
  font-size: 17px;
}

.ch12-search-result p {
  margin: 0;
  color: rgba(255,255,255,.55);
  font-size: 12px;
  line-height: 1.55;
}

.ch12-empty-result {
  grid-column: 1 / -1;
  padding: 40px;
  border:
    1px dashed rgba(255,255,255,.15);
  border-radius: 17px;
  color: rgba(255,255,255,.55);
  text-align: center;
}

@media (max-width: 800px) {
  .ch12-search-results {
    grid-template-columns: 1fr 1fr;
  }
}

@media (max-width: 560px) {
  .ch12-login-overlay,
  .ch12-search-overlay {
    padding: 10px;
  }

  .ch12-own-account-card {
    padding: 28px 20px !important;
  }

  .ch12-search-panel {
    min-height: calc(100vh - 20px);
    padding: 22px 16px;
    border-radius: 22px;
  }

  .ch12-search-form {
    grid-template-columns: 1fr;
  }

  .ch12-search-form button {
    min-height: 48px;
  }

  .ch12-search-results {
    grid-template-columns: 1fr;
  }
}