/* =====================================================================
   GVD v24 - stable touch signs, viewport-centred cue, transparent media
   ===================================================================== */

@media (max-width: 1100px) {
  html body #global-scroll-cue,
  html body #global-scroll-cue[data-input="touch"],
  html body #global-scroll-cue[data-input="wheel"] {
    position: fixed !important;
    inset: auto auto calc(14px + env(safe-area-inset-bottom)) calc(50vw - 23px) !important;
    width: 46px !important;
    min-width: 46px !important;
    max-width: 46px !important;
    margin: 0 !important;
    padding: 0 !important;
    translate: none !important;
    transform: none !important;
    animation: none !important;
    z-index: 1600 !important;
  }

  #global-scroll-cue .gesture-device,
  #global-scroll-cue .gesture-device-touch,
  #global-scroll-cue .gesture-device-mouse {
    position: static !important;
    inset: auto !important;
    width: 46px !important;
    min-width: 46px !important;
    max-width: 46px !important;
    margin: 0 !important;
    padding: 0 !important;
    display: grid !important;
    place-items: center !important;
    translate: none !important;
    transform: none !important;
  }

  #global-scroll-cue svg {
    display: block !important;
    width: 44px !important;
    height: 64px !important;
    margin: 0 auto !important;
  }

  .capability-list li {
    display: grid !important;
    grid-template-columns: 1.15em minmax(0, 1fr) 1.15em !important;
    column-gap: .38em !important;
    align-items: center !important;
    background: transparent !important;
    box-shadow: none !important;
    transform: none !important;
  }

  .capability-list li > .cap-symbol,
  .capability-list li.is-symbol-active > .cap-symbol,
  .capability-list li:hover > .cap-symbol,
  .capability-list li:focus-within > .cap-symbol {
    position: static !important;
    inset: auto !important;
    display: inline-grid !important;
    visibility: visible !important;
    place-items: center !important;
    width: 1.15em !important;
    min-width: 1.15em !important;
    height: 1.15em !important;
    margin: 0 !important;
    padding: 0 !important;
    color: currentColor !important;
    background: transparent !important;
    opacity: .88 !important;
    font: inherit !important;
    font-size: 1em !important;
    line-height: 1 !important;
    translate: none !important;
    transform: none !important;
    transition: none !important;
    animation: none !important;
    pointer-events: none !important;
  }

  .capability-list li > .cap-symbol-left { grid-column: 1 !important; }
  .capability-list li > .cap-label { grid-column: 2 !important; }
  .capability-list li > .cap-symbol-right { grid-column: 3 !important; }

  .capability-list li > .cap-label,
  .capability-list li:hover > .cap-label,
  .capability-list li:focus-within > .cap-label,
  .capability-list li.is-symbol-active > .cap-label {
    color: inherit !important;
    background: transparent !important;
    opacity: 1 !important;
    translate: none !important;
    transform: none !important;
    transition: none !important;
    animation: none !important;
  }

  .capability-list li > .cap-label::before,
  .capability-list li > .cap-label::after,
  .capability-list li > i:not(.cap-symbol) {
    content: none !important;
    display: none !important;
    background: transparent !important;
  }
}

.station-work .work-inline-media,
.station-work .work-inline-canvas {
  background: transparent !important;
  box-shadow: none !important;
}
