/* Display the approved artwork without its presentation margins. The source
   remains untouched: this viewport frames x=340, y=182, w=1498, h=361. */
.route-brand {
  position: relative;
  display: inline-block;
  flex: 0 0 auto;
  width: 180px;
  aspect-ratio: 1498 / 361;
  overflow: hidden;
  vertical-align: middle;
  isolation: isolate;
  background: var(--paper, #f4f2e9);
}
.route-brand > .route-wordmark {
  position: absolute;
  display: block;
  width: 144.9933244326%;
  max-width: none;
  height: auto;
  left: -22.696929239%;
  top: -50.4155124654%;
  pointer-events: none;
  clip-path: inset(0 0 0 34.07%);
  /* Knock the source paper up to white, then multiply onto the actual page.
     This removes its cream rectangle without replacing the approved artwork. */
  filter: brightness(1.1);
  mix-blend-mode: multiply;
}
.record-brand .route-brand { width: 168px; }
@media (max-width: 360px) {
  .wordmark .route-brand { width: 156px; }
}

/* Compass mark is independent of the unchanged wordmark artwork. */
.route-brand > .route-mark {position:absolute;display:block;left:0;top:0;height:100%;width:auto;max-width:none;pointer-events:none;filter:none;mix-blend-mode:normal}

.route-brand > .route-mark-dark {display:none}
[data-theme=dark] .route-brand > .route-mark {display:none}
[data-theme=dark] .route-brand > .route-mark-dark {display:block}