/* Isolated, transparent inset-tab CTA. The bounded wave envelope belongs to
   this stage, never the fields above or availability/status copy below it. */
body.coming-soon-route .coming-soon-submit-stage {
  position: relative;
  isolation: isolate;
  margin-top: 20px;
  padding: 32px 6px;
  overflow: hidden;
  background: transparent;
}
html body.coming-soon-route .coming-soon-echo-button {
  --echo-button-ocean: #167D9A;
  --echo-button-hover: #11657D;
  --echo-button-ripple: #5BAEC5;
  --echo-button-mist: #E5F3F7;
  --echo-button-height: 104px;
  --echo-button-tab-width: 120px;
  --echo-button-inset-left: 97px;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  width: 100%;
  height: var(--echo-button-height);
  min-height: var(--echo-button-height);
  margin: 0;
  padding: 15px 28px 15px 116px;
  border-radius: 24px;
  font-size: 22px;
  line-height: 1.15;
  text-align: center;
  transform: none;
  transition: none;
}
body.coming-soon-route .coming-soon-echo-button > svg {
  position: absolute;
  display: block;
  pointer-events: none;
  user-select: none;
}
body.coming-soon-route .coming-soon-button-icon {
  z-index: 1;
  left: 0;
  top: 0;
  width: var(--echo-button-tab-width);
  height: var(--echo-button-height);
  filter: drop-shadow(0 5px 4px rgb(18 18 18 / .13));
}
body.coming-soon-route .coming-soon-button-bar {
  z-index: 2;
  left: var(--echo-button-inset-left);
  top: 12%;
  width: calc(100% - var(--echo-button-inset-left));
  height: 76%;
  filter: drop-shadow(0 5px 4px rgb(18 18 18 / .13));
}
body.coming-soon-route .coming-soon-button-ripples {
  z-index: 0;
  left: 0;
  top: 50%;
  width: 280px;
  height: 168px;
  margin-top: -84px;
  opacity: .4;
}
body.coming-soon-route .coming-soon-button-ripples stop { stop-color: var(--echo-button-ripple); }
body.coming-soon-route .coming-soon-button-gradient-start { stop-color: var(--echo-button-ocean); }
body.coming-soon-route .coming-soon-button-gradient-end { stop-color: var(--echo-button-hover); }
body.coming-soon-route .coming-soon-button-bar > path { stroke: var(--echo-button-mist); }
@media (hover: hover) and (pointer: fine) {
  body.coming-soon-route .coming-soon-echo-button:not(:disabled):hover .coming-soon-button-gradient-start { stop-color: var(--echo-button-hover); }
}
body.coming-soon-route .coming-soon-echo-button:not(:disabled):focus-visible .coming-soon-button-gradient-start { stop-color: var(--echo-button-hover); }
body.coming-soon-route .coming-soon-button-label {
  position: relative;
  z-index: 3;
  max-width: 100%;
  pointer-events: none;
  font-family: var(--brand-font);
  font-weight: 700;
  letter-spacing: -.025em;
  text-wrap: balance;
  overflow-wrap: anywhere;
}
@media (forced-colors: none) {
  /* Override primary and disabled paint on this one control, not its siblings. */
  html body.coming-soon-route button.coming-soon-echo-button,
  html body.coming-soon-route button.coming-soon-echo-button:not(:disabled):not([aria-disabled="true"]) {
    background: transparent !important;
    border: 1px solid transparent !important;
    color: #121212 !important;
    box-shadow: none;
  }
  html body.coming-soon-route button.coming-soon-echo-button:disabled { cursor: not-allowed; }
  body.coming-soon-route .coming-soon-echo-button:disabled .coming-soon-button-ripples { opacity: .22; }
}
body.coming-soon-route .coming-soon-echo-button:focus-visible { outline: 3px solid var(--brand-ink); outline-offset: 3px; }
@media (max-width: 600px) {
  body.coming-soon-route .coming-soon-submit-stage { padding-block: 28px; }
  html body.coming-soon-route .coming-soon-echo-button {
    --echo-button-height: 76px;
    --echo-button-tab-width: 88px;
    --echo-button-inset-left: 71px;
    padding: 12px 20px 12px 84px;
    font-size: 16px;
  }
  body.coming-soon-route .coming-soon-button-ripples { width: 220px; height: 132px; margin-top: -66px; }
}
@media (max-width: 360px) {
  html body.coming-soon-route .coming-soon-echo-button {
    --echo-button-height: 68px;
    --echo-button-tab-width: 78px;
    --echo-button-inset-left: 63px;
    padding-left: 73px;
    padding-right: 16px;
    font-size: 13px;
  }
  body.coming-soon-route .coming-soon-button-ripples { width: 200px; height: 120px; margin-top: -60px; }
}
@media (prefers-reduced-motion: reduce) {
  body.coming-soon-route .coming-soon-button-ripples { transform: none !important; }
}
@media (forced-colors: active) {
  body.coming-soon-route .coming-soon-echo-button > svg { display: none; }
  html body.coming-soon-route button.coming-soon-echo-button { padding: 12px; background: ButtonFace; color: ButtonText; border: 2px solid ButtonText; box-shadow: none; }
  html body.coming-soon-route button.coming-soon-echo-button:disabled { color: GrayText; border-color: GrayText; }
  body.coming-soon-route .coming-soon-echo-button:focus-visible { outline-color: Highlight; }
}
