/* Small, additive motion; existing transforms and keyboard focus styles are preserved. */
.exp-scroll-progress {
  position: fixed;
  inset: 0 0 auto;
  z-index: 120;
  height: 3px;
  pointer-events: none;
  background: transparent;
  contain: strict;
}
.exp-scroll-progress[hidden] { display: none; }
.exp-scroll-progress > span {
  display: block;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, #294de8, #60def0 60%, #d8fcff);
  transform: scaleX(0);
  transform-origin: left center;
  will-change: transform;
}
.exp-surface-contained { position: relative; }
.exp-panel-light {
  position: absolute;
  inset: 0;
  z-index: 1;
  display: block;
  border-radius: inherit;
  opacity: 0;
  pointer-events: none;
  background: radial-gradient(ellipse 380px 260px at var(--exp-light-x, 50%) var(--exp-light-y, 50%), #e1faff29, #d8f4ff0b 38%, transparent 72%);
  transition: opacity .45s ease;
}
.exp-depth { translate: 0 var(--exp-depth-y, 0px); }
.exp-magnetic { translate: var(--exp-magnet-x, 0px) var(--exp-magnet-y, 0px); }
.exp-magnetic.exp-depth { translate: var(--exp-magnet-x, 0px) calc(var(--exp-magnet-y, 0px) + var(--exp-depth-y, 0px)); }
.exp-document-paused *,
.exp-document-paused *::before,
.exp-document-paused *::after,
.exp-scene-paused,
.exp-scene-paused *,
.exp-scene-paused *::before,
.exp-scene-paused *::after { animation-play-state: paused !important; }

@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
  .exp-ready .exp-surface {
    rotate: var(--exp-tilt-axis-x, 1) var(--exp-tilt-axis-y, 0) 0 var(--exp-tilt-angle, 0deg);
    transition-property: border-color, background-color, box-shadow, rotate, transform;
    transition-duration: .25s, .25s, .35s, .38s, .45s;
    transition-timing-function: ease, ease, ease, cubic-bezier(.2,.8,.2,1), cubic-bezier(.2,.75,.2,1);
  }
  .exp-ready .exp-surface.exp-pointer-active { will-change: rotate; }
  .exp-ready .exp-pointer-active > .exp-panel-light { opacity: var(--exp-light-opacity, .75); }
  .exp-ready .exp-magnetic {
    transition-property: background-color, border-color, color, box-shadow, translate, transform;
    transition-duration: .2s, .2s, .2s, .25s, .3s, .45s;
    transition-timing-function: ease, ease, ease, ease, cubic-bezier(.2,.8,.2,1), cubic-bezier(.2,.75,.2,1);
  }
  .exp-ready .exp-magnetic-active { will-change: translate; }
  .exp-ready .exp-depth { will-change: translate; }
  .exp-ready .exp-surface:focus-within,
  .exp-ready .exp-magnetic:focus-visible { rotate: none; translate: none; }
}

@media (prefers-reduced-motion: reduce), (hover: none), (pointer: coarse) {
  .exp-surface,
  .exp-depth,
  .exp-magnetic { rotate: none !important; translate: none !important; }
  .exp-panel-light { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  .exp-scroll-progress { display: none; }
  .exp-surface,
  .exp-magnetic { transition: none !important; }
}
@media print {
  .exp-scroll-progress,
  .exp-panel-light { display: none !important; }
  .exp-surface,
  .exp-depth,
  .exp-magnetic { rotate: none !important; translate: none !important; }
}