.fre-departure-signal {
  position: fixed;
  z-index: 99950;

  /* Absolutely no button/card treatment. */
  appearance: none;
  -webkit-appearance: none;
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  padding: 0 !important;
  margin: 0 !important;
  border-radius: 0 !important;

  /* White + difference gives automatic inverse contrast:
     dark backdrop -> light text, light backdrop -> dark text. */
  color: #fff;
  mix-blend-mode: difference;

  text-align: left;
  font: inherit;
  cursor: pointer;
  white-space: nowrap;
  max-width: calc(100vw - 36px);
  overflow: visible;

  opacity: 0;
  pointer-events: none;
  transform:
    perspective(700px)
    translate3d(-18px, 4px, -30px)
    rotateY(6deg);
  filter: blur(1.5px);

  transition:
    opacity .28s ease,
    transform .52s cubic-bezier(.2,.8,.2,1),
    filter .4s ease;

  -webkit-tap-highlight-color: transparent;
}

.fre-departure-signal:focus,
.fre-departure-signal:focus-visible,
.fre-departure-signal:active {
  outline: none !important;
  border: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
}

.fre-departure-signal.is-visible {
  opacity: .98;
  pointer-events: auto;
  transform:
    perspective(700px)
    translate3d(0, 0, 0)
    rotateY(0deg);
  filter: blur(0);
}

.fre-departure-signal.is-leaving {
  opacity: 0;
  transform:
    perspective(700px)
    translate3d(14px, -2px, -24px)
    rotateY(-5deg);
  filter: blur(1px);
}

.fre-signal-line {
  display: inline-flex;
  align-items: baseline;
  white-space: nowrap;
  min-height: 1.25em;
}

.fre-signal-text {
  display: inline;
  font-size: clamp(15px, 1.05vw, 18px);
  line-height: 1.2;
  font-weight: 430;
  letter-spacing: -.018em;
  white-space: nowrap;
}

.fre-signal-caret {
  width: 1px;
  height: .95em;
  display: inline-block;
  margin-left: 3px;
  background: currentColor;
  opacity: .8;
  animation: freSignalBlink .78s steps(1) infinite;
}

.fre-departure-signal:hover {
  opacity: 1;
  transform:
    perspective(700px)
    translate3d(0, -1px, 0)
    rotateX(-1deg)
    scale(1.035);
}

@keyframes freSignalBlink {
  0%, 48% { opacity: .78; }
  49%, 100% { opacity: 0; }
}

/* Position variants. All deliberately avoid the center reading column. */
.fre-departure-signal.pos-left-mid {
  left: 6vw;
  right: auto;
  top: 55vh;
}

.fre-departure-signal.pos-right-mid {
  left: auto;
  right: 6vw;
  top: 48vh;
  text-align: right;
}

.fre-departure-signal.pos-left-low {
  left: 9vw;
  right: auto;
  top: 72vh;
}

.fre-departure-signal.pos-right-low {
  left: auto;
  right: 8vw;
  top: 68vh;
  text-align: right;
}

.fre-departure-signal.pos-right-high {
  left: auto;
  right: 7vw;
  top: 29vh;
  text-align: right;
}


@media (max-width: 760px) {
  .fre-departure-signal {
    max-width: 72vw;
  }

  .fre-signal-text {
    font-size: 14px;
  }

  .fre-departure-signal.pos-left-mid,
  .fre-departure-signal.pos-left-low {
    left: 18px;
  }

  .fre-departure-signal.pos-right-mid,
  .fre-departure-signal.pos-right-low,
  .fre-departure-signal.pos-right-high {
    right: 18px;
  }

  .fre-departure-signal:hover {
    transform: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .fre-departure-signal,
  

  .fre-signal-caret {
    animation: none !important;
  }
}


/* v1.1: when the FRE compact dock is present at the top-right,
   keep the signal comfortably below it instead of hiding it. */
body:has(#fre-float-nav.is-compact) .fre-departure-signal.pos-right-high {
  top: 38vh;
}

body:has(#fre-float-nav.is-compact) .fre-departure-signal.pos-right-mid {
  top: 51vh;
}


@media (max-width: 760px) {
  .fre-departure-signal {
    max-width: calc(100vw - 36px);
    white-space: nowrap;
  }

  .fre-signal-text {
    font-size: 14px;
    white-space: nowrap;
  }
}