/* Map navigation, intro and guided tour (assets/world/nav.js, mapview.js). Every
   visible rule is scoped to html.mode-3d; the classic page and print never show
   any of it. */

.nav-chip,
.mono-intro,
.tour-bar { display: none; }
.nav-live,
.mi-sr {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}
.world-hud .wh-key-map { display: none; }

@media screen {
  /* ---------------- Map button in the top bar ---------------- */
  html.mode-3d #map-toggle .map-ico {
    width: 17px;
    height: 17px;
    flex: none;
    fill: none;
    stroke: #e0a94a;
    stroke-width: 1.5;
    stroke-linejoin: round;
    stroke-linecap: round;
  }
  html.mode-3d #map-toggle[aria-expanded="true"] { background: #16362a; border-color: #ffd482; }
  html.mode-3d #map-toggle:focus-visible { outline: 2px solid #ffd482; outline-offset: 2px; }

  /* ---------------- Mini map caption and key hint ---------------- */
  html.mode-3d .world-hud.has-bigmap .wh-key-map { display: inline; }
  html.mode-3d .wh-map-cap { display: flex; justify-content: space-between; gap: 8px; }
  html.mode-3d .wh-map-more { display: none; color: #e0a94a; }
  html.mode-3d .world-hud.has-bigmap .wh-map-more { display: inline; }
  html.mode-3d .world-hud.has-bigmap .wh-map canvas { box-shadow: inset 0 0 0 1px rgba(224, 169, 74, .35); }
  html.mode-3d .world-hud.has-bigmap .wh-map:hover { border-color: rgba(224, 169, 74, .6); }

  /* ---------------- Map dialog ---------------- */
  html.mode-3d .nav-map {
    position: fixed;
    inset: 0;
    width: 100%;
    height: 100%;
    max-width: none;
    max-height: none;
    margin: 0;
    padding: 16px;
    box-sizing: border-box;
    color: #c6d0c8;
    background: transparent;
    border: 0;
    overflow: hidden;
  }
  html.mode-3d .nav-map:not([open]) { display: none; }
  html.mode-3d .nav-map::backdrop { background: rgba(3, 10, 7, .66); }
  html.mode-3d .nav-map[open] .nm-frame { animation: nm-in .28s cubic-bezier(.2, .8, .2, 1) both; }

  .nm-frame {
    --nm-stacked: 0;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    height: 100%;
    overflow: hidden;
    background: rgba(10, 28, 21, .98);
    border: 1px solid rgba(224, 169, 74, .6);
    border-radius: 16px;
    box-shadow: 0 30px 80px rgba(0, 0, 0, .55), inset 0 1px 0 rgba(255, 212, 130, .1);
  }
  .nm-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    padding: 16px 18px 14px 22px;
    border-bottom: 1px solid rgba(244, 242, 233, .12);
  }
  .nm-titles { min-width: 0; }
  .nm-kicker {
    margin: 0 0 5px;
    font: 500 11px/1 "IBM Plex Mono", ui-monospace, Consolas, monospace;
    letter-spacing: .16em;
    color: #93a69b;
  }
  .nm-kicker span { margin-left: .8em; color: #e0a94a; }
  .nm-title {
    margin: 0;
    font: 800 26px/1.05 "Archivo", "Arial Narrow", Arial, sans-serif;
    font-stretch: 112%;
    color: #f4f2e9;
  }
  .nm-desc { margin: 6px 0 0; font: 400 14px/1.45 "IBM Plex Sans", system-ui, Arial, sans-serif; color: #c6d0c8; }
  .nm-close {
    flex: none;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 40px;
    padding: 0 14px 0 8px;
    font: 600 14px/1 "IBM Plex Sans", system-ui, Arial, sans-serif;
    color: #f4f2e9;
    background: #16362a;
    border: 1px solid rgba(244, 242, 233, .3);
    border-radius: 999px;
    cursor: pointer;
    transition: background-color .18s, border-color .18s;
  }
  .nm-close:hover { background: #1d4a38; border-color: #e0a94a; }
  .nm-close:focus-visible { outline: 2px solid #ffd482; outline-offset: 2px; }
  .nm-key {
    padding: 5px 7px;
    font: 500 11px/1 "IBM Plex Mono", ui-monospace, Consolas, monospace;
    letter-spacing: .06em;
    color: #ffd482;
    border: 1px solid rgba(224, 169, 74, .6);
    border-radius: 999px;
  }

  .nm-body { display: grid; grid-template-columns: 284px minmax(0, 1fr); min-height: 0; }

  /* destination list: the keyboard and screen reader path */
  .nm-list {
    min-height: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: 6px 10px 16px;
    border-right: 1px solid rgba(244, 242, 233, .1);
    scrollbar-width: thin;
    scrollbar-color: #8f6c2c transparent;
  }
  .nm-group h3 {
    margin: 12px 10px 6px;
    font: 600 11px/1.2 "IBM Plex Mono", ui-monospace, Consolas, monospace;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: #93a69b;
  }
  .nm-group ul { display: grid; gap: 2px; margin: 0; padding: 0; list-style: none; }
  .nm-dest {
    display: grid;
    grid-template-columns: 4.9em minmax(0, 1fr) auto;
    align-items: center;
    gap: 8px;
    width: 100%;
    min-height: 44px;
    padding: 6px 10px;
    font: 500 15px/1.25 "IBM Plex Sans", system-ui, Arial, sans-serif;
    text-align: left;
    color: #f4f2e9;
    background: transparent;
    border: 1px solid transparent;
    border-radius: 10px;
    cursor: pointer;
    transition: background-color .15s, border-color .15s;
  }
  .nm-dest.is-sub { padding-left: 24px; font-size: 14px; }
  .nm-dest:hover,
  .nm-dest.is-preview { background: #16362a; border-color: rgba(224, 169, 74, .55); }
  .nm-dest:focus-visible { outline: 2px solid #ffd482; outline-offset: 1px; }
  .nm-ref { font: 600 12px/1 "IBM Plex Mono", ui-monospace, Consolas, monospace; letter-spacing: .04em; color: #ffd482; }
  .nm-name { min-width: 0; overflow-wrap: anywhere; }
  .nm-dist { font: 500 12px/1 "IBM Plex Mono", ui-monospace, Consolas, monospace; color: #93a69b; white-space: nowrap; }
  .nm-dest[aria-current] .nm-dist { color: #62e6a4; }
  .nm-dest.is-target { border-color: rgba(98, 230, 164, .55); }
  .nm-dest.is-target .nm-ref::before {
    content: "";
    display: inline-block;
    width: 7px;
    height: 7px;
    margin-right: 6px;
    vertical-align: 1px;
    background: #62e6a4;
    border-radius: 50%;
    box-shadow: 0 0 8px rgba(98, 230, 164, .9);
  }

  /* the drawing */
  .nm-view { position: relative; min-width: 0; min-height: 0; overflow: hidden; background: #06130e; }
  .nm-scroll {
    position: absolute;
    inset: 0;
    display: flex;
    overflow: auto;
    overscroll-behavior: contain;
    scrollbar-width: thin;
    scrollbar-color: #8f6c2c transparent;
    touch-action: pan-x pan-y;
  }
  .nm-paper { position: relative; flex: none; margin: auto; }
  .nm-paper canvas { position: absolute; left: 0; top: 0; display: block; }
  .nm-compass {
    position: absolute;
    right: 14px;
    top: 12px;
    width: 46px;
    height: 54px;
    pointer-events: none;
  }
  .nm-compass svg { width: 100%; height: 100%; overflow: visible; }
  .nm-compass circle { fill: rgba(6, 19, 14, .82); stroke: rgba(244, 242, 233, .35); stroke-width: 1; }
  .nm-compass path { fill: rgba(244, 242, 233, .35); }
  .nm-compass path.nm-n { fill: #e0a94a; }
  .nm-compass text { font: 600 10px "IBM Plex Mono", ui-monospace, Consolas, monospace; fill: #f4f2e9; text-anchor: middle; }
  .nm-scale {
    position: absolute;
    left: 14px;
    bottom: 12px;
    display: grid;
    gap: 4px;
    padding: 7px 9px 6px;
    font: 500 11px/1 "IBM Plex Mono", ui-monospace, Consolas, monospace;
    color: #c6d0c8;
    background: rgba(6, 19, 14, .8);
    border-radius: 8px;
    pointer-events: none;
  }
  .nm-scale-bar { display: flex; height: 6px; border: 1px solid #f4f2e9; }
  .nm-scale-bar i { flex: 1; }
  .nm-scale-bar i:first-child { background: #f4f2e9; }
  .nm-legend {
    position: absolute;
    right: 14px;
    bottom: 12px;
    display: flex;
    gap: 14px;
    margin: 0;
    padding: 8px 12px;
    list-style: none;
    font: 500 11px/1 "IBM Plex Mono", ui-monospace, Consolas, monospace;
    color: #c6d0c8;
    background: rgba(6, 19, 14, .82);
    border: 1px solid rgba(244, 242, 233, .14);
    border-radius: 10px;
    pointer-events: none;
  }
  .nm-legend li { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }
  .nm-legend i { display: inline-block; flex: none; }
  .nm-lg-rover { width: 0; height: 0; border: 5px solid transparent; border-bottom: 10px solid #62e6a4; border-top: 0; filter: drop-shadow(0 0 3px #62e6a4); }
  .nm-lg-pad { width: 12px; height: 9px; background: #e0a94a; border-radius: 2px; }
  .nm-lg-route { width: 18px; height: 3px; background: #ffd482; border-radius: 2px; box-shadow: 0 0 6px rgba(224, 169, 74, .9); }

  /* narrow screens: full screen sheet, the drawing on top (it scrolls sideways),
     the list below */
  @media (max-width: 759px) {
    html.mode-3d .nav-map { padding: 0; }
    .nm-frame { --nm-stacked: 1; border: 0; border-radius: 0; }
    .nm-head { padding: 12px 12px 10px 16px; }
    .nm-title { font-size: 22px; }
    .nm-desc { font-size: 13px; }
    .nm-body { grid-template-columns: minmax(0, 1fr); grid-template-rows: clamp(200px, 42vh, 400px) minmax(0, 1fr); }
    .nm-view { order: -1; }
    .nm-list { border-right: 0; border-top: 1px solid rgba(244, 242, 233, .12); padding: 2px 8px 18px; }
    .nm-legend { display: none; }
    .nm-compass { width: 38px; height: 46px; right: 10px; top: 8px; }
  }
  /* short landscape screens: compact heading */
  @media (max-height: 520px) {
    .nm-head { padding-top: 10px; padding-bottom: 8px; }
    .nm-kicker, .nm-desc { display: none; }
    .nm-title { font-size: 20px; }
    .nm-legend { display: none; }
  }

  /* ---------------- Autopilot chip ---------------- */
  html.mode-3d .nav-chip:not([hidden]) {
    position: fixed;
    z-index: 36;
    left: 50%;
    top: calc(var(--topbar-h, 62px) + 14px);
    display: inline-flex;
    align-items: center;
    gap: 10px;
    max-width: calc(100vw - 24px);
    padding: 5px 5px 5px 14px;
    transform: translateX(-50%);
    font: 500 13px/1.2 "IBM Plex Mono", ui-monospace, Consolas, monospace;
    color: #f4f2e9;
    background: rgba(6, 19, 14, .92);
    border: 1px solid rgba(98, 230, 164, .55);
    border-radius: 999px;
    box-shadow: 0 12px 30px rgba(0, 0, 0, .4);
    animation: nm-chip-in .3s ease both;
  }
  html.mode-3d.card-open .nav-chip { display: none; }
  /* under the open map (a modal) the chip and the tour bar step aside */
  html.mode-3d.map-open .nav-chip:not([hidden]),
  html.mode-3d.map-open .tour-bar:not([hidden]) { visibility: hidden; }
  .nav-chip-led {
    flex: none;
    width: 8px;
    height: 8px;
    background: #62e6a4;
    border-radius: 50%;
    box-shadow: 0 0 8px rgba(98, 230, 164, .9);
    animation: nm-blink 1s steps(2, jump-none) infinite;
  }
  .nav-chip-text { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .nav-chip-k { color: #62e6a4; letter-spacing: .08em; text-transform: uppercase; }
  .nav-chip-hint { color: #93a69b; font-size: 12px; white-space: nowrap; }
  .nav-chip-stop {
    flex: none;
    min-height: 34px;
    padding: 0 14px;
    font: 600 13px/1 "IBM Plex Sans", system-ui, Arial, sans-serif;
    color: #1a1204;
    background: #e0a94a;
    border: 0;
    border-radius: 999px;
    cursor: pointer;
  }
  .nav-chip-stop:hover { background: #ffd482; }
  .nav-chip-stop:focus-visible { outline: 2px solid #f4f2e9; outline-offset: 2px; }
  /* phones: the chip spans the top row; the corner map and the race panel move
     below it while a trip runs (html.nav-trip) */
  @media (max-width: 759px) {
    .nav-chip-hint { display: none; }
    html.mode-3d .nav-chip:not([hidden]) {
      left: 10px;
      right: 10px;
      top: calc(var(--topbar-h, 56px) + 10px);
      transform: none;
      font-size: 12px;
    }
    .nav-chip-text { flex: 1 1 auto; }
    html.mode-3d.nav-trip .world-hud.is-touch .wh-map,
    html.mode-3d.nav-trip .race-hud:not([hidden]) { top: calc(var(--topbar-h, 56px) + 66px); }
  }
  /* mid widths: the centred chip would cover the race panel */
  @media (min-width: 760px) and (max-width: 1060px) {
    html.mode-3d.nav-trip .race-hud:not([hidden]) { top: calc(var(--topbar-h, 62px) + 70px); }
  }

  /* ---------------- Intro: black screen, typed line, two choices ---------------- */
  html.mode-3d .mono-intro:not([hidden]) {
    position: fixed;
    inset: 0;
    z-index: 200;
    display: grid;
    place-items: center;
    padding: 24px 20px 84px;
    color: #f4f2e9;
    background: #010403;
    outline: none;
    animation: mi-in .5s ease both;
    transition: opacity .9s ease;
  }
  html.mode-3d .mono-intro.is-cut { animation: none; }
  html.mode-3d .mono-intro.is-out { opacity: 0; pointer-events: none; }
  .mi-body { display: grid; justify-items: center; gap: 34px; width: min(820px, 100%); text-align: center; }
  .mi-line {
    min-height: 1.4em;
    margin: 0;
    font: 500 clamp(19px, 3.2vw, 34px)/1.4 "IBM Plex Mono", ui-monospace, Consolas, monospace;
    letter-spacing: .01em;
    color: #f4f2e9;
  }
  .mi-cursor {
    display: inline-block;
    width: .58em;
    height: 1.08em;
    margin-left: .1em;
    vertical-align: -.18em;
    background: #62e6a4;
    box-shadow: 0 0 14px rgba(98, 230, 164, .55);
  }
  .mono-intro.is-typed .mi-cursor { animation: nm-blink 1.05s steps(2, jump-none) infinite; }
  html.mode-3d .mi-choices:not([hidden]) {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 12px;
    animation: mi-rise .45s cubic-bezier(.2, .8, .2, 1) both;
  }
  .mi-choices button {
    min-height: 50px;
    padding: 0 26px;
    font: 600 16px/1 "IBM Plex Sans", system-ui, Arial, sans-serif;
    border-radius: 999px;
    cursor: pointer;
    transition: background-color .18s, border-color .18s, color .18s;
  }
  .mi-tour { color: #1a1204; background: #e0a94a; border: 1px solid #e0a94a; box-shadow: 0 0 0 6px rgba(224, 169, 74, .14); }
  .mi-tour:hover { background: #ffd482; border-color: #ffd482; }
  .mi-self { color: #f4f2e9; background: transparent; border: 1px solid rgba(244, 242, 233, .42); }
  .mi-self:hover { border-color: #e0a94a; color: #ffd482; }
  .mi-skip {
    position: absolute;
    right: 18px;
    bottom: 18px;
    display: inline-flex;
    align-items: center;
    gap: 9px;
    min-height: 40px;
    padding: 0 8px 0 15px;
    font: 500 13px/1 "IBM Plex Mono", ui-monospace, Consolas, monospace;
    letter-spacing: .06em;
    color: #c6d0c8;
    background: transparent;
    border: 1px solid rgba(244, 242, 233, .22);
    border-radius: 999px;
    cursor: pointer;
  }
  .mi-skip:hover { color: #f4f2e9; border-color: rgba(224, 169, 74, .7); }
  .mi-key {
    padding: 5px 7px;
    font-size: 11px;
    color: #ffd482;
    border: 1px solid rgba(224, 169, 74, .55);
    border-radius: 999px;
  }
  .mi-choices button:focus-visible,
  .mi-skip:focus-visible { outline: 2px solid #ffd482; outline-offset: 3px; }
  @media (hover: none) and (pointer: coarse) {
    .mi-key { display: none; }
    .mi-skip { padding-right: 15px; }
  }

  /* ---------------- Guided tour bar ----------------
     Under the top bar on the right, in line with the card column; while the tour
     runs the open card moves down below it. Phones: full width under the top bar,
     the card stays a bottom sheet. */
  html.mode-3d.tour-on { --tour-h: 62px; }
  html.mode-3d .tour-bar:not([hidden]) {
    position: fixed;
    z-index: 36;
    top: calc(var(--topbar-h, 62px) + 14px);
    right: 18px;
    display: flex;
    align-items: center;
    gap: 16px;
    box-sizing: border-box;
    height: var(--tour-h, 62px);
    max-width: min(660px, calc(100vw - 36px));
    padding: 0 9px 0 16px;
    color: #c6d0c8;
    background: rgba(6, 19, 14, .95);
    border: 1px solid rgba(224, 169, 74, .6);
    border-radius: 14px;
    box-shadow: 0 18px 44px rgba(0, 0, 0, .45), inset 0 1px 0 rgba(255, 212, 130, .1);
    outline: none;
    animation: tb-in .35s cubic-bezier(.2, .8, .2, 1) both;
  }
  html.mode-3d.card-open .tour-bar:not([hidden]) { width: min(660px, calc(100vw - 36px)); }
  .tb-info { display: grid; gap: 7px; flex: 1 1 auto; min-width: 0; }
  .tb-slots { display: flex; gap: 3px; }
  .tb-slots i { width: 18px; height: 5px; background: rgba(244, 242, 233, .14); border-radius: 2px; }
  .tb-slots i.is-done { background: #8f6c2c; }
  .tb-slots i.is-here { background: #e0a94a; box-shadow: 0 0 8px rgba(224, 169, 74, .7); }
  .tb-slots i.is-next { background: #62e6a4; box-shadow: 0 0 8px rgba(98, 230, 164, .7); animation: nm-blink 1s steps(2, jump-none) infinite; }
  .tb-status { display: flex; align-items: baseline; gap: 10px; min-width: 0; margin: 0; white-space: nowrap; }
  .tb-count {
    flex: none;
    font: 600 11px/1.2 "IBM Plex Mono", ui-monospace, Consolas, monospace;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: #93a69b;
  }
  .tb-what {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    font: 600 15px/1.25 "IBM Plex Sans", system-ui, Arial, sans-serif;
    color: #f4f2e9;
  }
  .tour-bar[data-phase="drive"] .tb-what,
  .tour-bar[data-phase="home"] .tb-what { color: #62e6a4; }
  .tb-btns { display: flex; flex: none; gap: 6px; }
  .tb-btns button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-width: 44px;
    min-height: 44px;
    padding: 0 14px;
    font: 600 14px/1 "IBM Plex Sans", system-ui, Arial, sans-serif;
    white-space: nowrap;
    color: #f4f2e9;
    background: #0f271e;
    border: 1px solid rgba(244, 242, 233, .26);
    border-radius: 999px;
    cursor: pointer;
    transition: background-color .15s, border-color .15s;
  }
  .tb-btns button[hidden] { display: none; }
  .tb-btns button:hover { background: #16362a; border-color: #e0a94a; }
  .tb-btns .tb-next { color: #1a1204; background: #e0a94a; border-color: #e0a94a; }
  .tb-btns .tb-next:hover { background: #ffd482; border-color: #ffd482; }
  .tb-btns button[aria-disabled="true"] { opacity: .42; cursor: default; }
  .tb-btns button[aria-disabled="true"]:hover { background: #0f271e; border-color: rgba(244, 242, 233, .26); }
  .tb-btns .tb-next[aria-disabled="true"]:hover { background: #e0a94a; border-color: #e0a94a; }
  .tb-btns svg { width: 14px; height: 14px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
  .tb-btns button:focus-visible { outline: 2px solid #ffd482; outline-offset: 2px; }

  html.mode-3d.tour-on #content .is-open {
    top: calc(var(--topbar-h, 62px) + 24px + var(--tour-h, 62px));
    max-height: calc(100vh - var(--topbar-h, 62px) - 42px - var(--tour-h, 62px));
    max-height: calc(100dvh - var(--topbar-h, 62px) - 42px - var(--tour-h, 62px));
  }
  html.mode-3d.tour-on .wh-toast { top: calc(var(--topbar-h, 62px) + 26px + var(--tour-h, 62px)); }

  /* mid widths: the short labels of Previous and End tour hide, the icons stay */
  @media (max-width: 1020px) {
    .tb-btns .tb-txt { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
    .tb-btns .tb-prev, .tb-btns .tb-end { padding: 0; width: 44px; }
  }
  @media (max-width: 759px) {
    html.mode-3d.tour-on { --tour-h: 58px; }
    html.mode-3d .tour-bar:not([hidden]),
    html.mode-3d.card-open .tour-bar:not([hidden]) {
      top: calc(var(--topbar-h, 56px) + 8px);
      left: 8px;
      right: 8px;
      width: auto;
      max-width: none;
      gap: 8px;
      padding: 0 6px 0 12px;
      border-radius: 12px;
    }
    .tb-info { gap: 6px; }
    .tb-slots i { width: 11px; height: 4px; }
    .tb-status { gap: 7px; }
    .tb-count { font-size: 10px; letter-spacing: .08em; }
    .tb-what { font-size: 14px; }
    .tb-btns { gap: 4px; }
    .tb-btns .tb-next { padding: 0 13px; }
    html.mode-3d.tour-on #content .is-open {
      top: auto;
      max-height: min(70vh, calc(100vh - var(--topbar-h, 56px) - 26px - var(--tour-h, 58px)));
      max-height: min(70dvh, calc(100dvh - var(--topbar-h, 56px) - 26px - var(--tour-h, 58px)));
    }
    html.mode-3d.tour-on .world-hud.is-touch .wh-map { top: calc(var(--topbar-h, 56px) + 18px + var(--tour-h, 58px)); }
    html.mode-3d.tour-on .wh-toast { top: calc(var(--topbar-h, 56px) + 18px + var(--tour-h, 58px)); }
  }
  @media (max-width: 400px) {
    .tb-slots { display: none; }
    .tb-status { display: grid; gap: 3px; }
    .tb-what { font-size: 13px; }
  }

  @keyframes nm-in { from { opacity: 0; transform: scale(.985) translateY(8px); } }
  @keyframes nm-chip-in { from { opacity: 0; transform: translateX(-50%) translateY(-8px); } }
  @keyframes nm-blink { 50% { opacity: .25; } }
  @keyframes mi-in { from { opacity: 0; } }
  @keyframes mi-rise { from { opacity: 0; transform: translateY(10px); } }
  @keyframes tb-in { from { opacity: 0; transform: translateY(-8px); } }

  @media (prefers-reduced-motion: reduce) {
    html.mode-3d .nav-map[open] .nm-frame,
    html.mode-3d .nav-chip:not([hidden]),
    .nav-chip-led,
    html.mode-3d .mono-intro:not([hidden]),
    .mono-intro.is-typed .mi-cursor,
    html.mode-3d .mi-choices:not([hidden]),
    html.mode-3d .tour-bar:not([hidden]),
    .tb-slots i.is-next { animation: none; }
    html.mode-3d .mono-intro:not([hidden]) { transition: none; }
    .nm-dest, .nm-close, .mi-choices button, .tb-btns button { transition: none; }
  }
}

@media print {
  .nav-map, .nav-chip, .mono-intro, .tour-bar { display: none !important; }
}