/*
 * OFFICIAL LAUNCH mirrors TODAY's date/note typography and colour pairing.
 * Their reading order remains intentionally reversed.
 */
html[data-crossroad-phase="prelaunch"] .surface-launch {
  opacity: 1;
  filter: none;
  color: rgba(255, 255, 255, .98);
  text-shadow:
    0 -1px 0 rgba(255, 255, 255, .18),
    0 0 5px rgba(255, 255, 255, .16);
}

html[data-crossroad-phase="prelaunch"] .surface-launch strong {
  font-family: var(--numeral);
  font-weight: 650;
}

html[data-crossroad-phase="prelaunch"] .surface-launch strong span:not(.official-launch-tbd-ghost) {
  color: inherit;
  text-shadow: inherit;
}

html[data-crossroad-phase="prelaunch"] .surface-launch > span {
  color: rgba(231, 241, 247, .68);
  font-family: "Crossroad Latin", "Bahnschrift Condensed", "Arial Narrow", var(--mono);
  font-size: 12px;
  font-weight: 560;
  line-height: 1;
  letter-spacing: .22em;
  text-shadow: 0 0 10px rgba(255, 255, 255, .12);
}

@media (min-width: 761px) and (max-width: 1400px) {
  html[data-crossroad-phase="prelaunch"] .surface-launch strong {
    font-size: 21px;
  }
}

@media (max-width: 760px) {
  html[data-crossroad-phase="prelaunch"] .surface-launch > span {
    font-size: 10px;
    letter-spacing: .08em;
  }
}

/* Keep the condensed labels fully visible on the narrowest supported phones. */
@media (max-width: 360px) {
  html[data-crossroad-phase="prelaunch"] .surface-launch strong {
    font-size: 16px;
    letter-spacing: .045em;
  }

  html[data-crossroad-phase="prelaunch"] .origin-today {
    font-size: 16px !important;
    letter-spacing: .055em !important;
  }

  html[data-crossroad-phase="prelaunch"] .latest-head .official-date,
  html[data-crossroad-phase="prelaunch"] .official-event > .official-date {
    width: 68px;
    font-size: 15px;
    letter-spacing: .04em;
  }
}