/* Motion language: open a frame, settle into the space, keep transitions continuous. */
@view-transition {
  navigation: auto;
}
::view-transition-old(root) {
  animation: page-away 160ms ease-out both;
}
::view-transition-new(root) {
  animation: page-arrive 320ms cubic-bezier(0.16, 1, 0.3, 1) both;
}
@keyframes page-away {
  to {
    opacity: 0;
  }
}
@keyframes page-arrive {
  from {
    opacity: 0.7;
    transform: translateY(6px);
  }
  to {
    opacity: 1;
    transform: none;
  }
}
.space-view__picture {
  position: relative;
}
.space-view__picture .space-view__previous {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  animation: none;
  pointer-events: none;
}
.space-view.is-switching .space-view__picture img {
  animation: none;
}
.space-tab {
  position: relative;
  border-top-color: transparent !important;
}
.space-tab::before {
  content: "";
  position: absolute;
  inset: -2px 0 auto;
  height: 2px;
  background: var(--ink);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 450ms cubic-bezier(0.16, 1, 0.3, 1);
}
.space-tab.is-active::before {
  transform: scaleX(1);
}
.btn {
  transition:
    background-color 200ms ease,
    color 200ms ease,
    transform 240ms cubic-bezier(0.16, 1, 0.3, 1);
}
.btn:hover {
  transform: translateY(-2px);
}
.btn:active {
  transform: translateY(0);
}
.hotspot__trigger {
  transition:
    background-color 180ms ease,
    outline-width 240ms ease,
    transform 240ms cubic-bezier(0.16, 1, 0.3, 1);
}
.hotspot__trigger:hover {
  transform: scale(1.06);
}
.hotspot__detail:not([hidden]) {
  animation: detail-arrive 260ms cubic-bezier(0.16, 1, 0.3, 1) both;
}
@keyframes detail-arrive {
  from {
    opacity: 0.35;
    transform: translateY(6px);
  }
  to {
    opacity: 1;
    transform: none;
  }
}
.tailored details {
  interpolate-size: allow-keywords;
}
.tailored details::details-content {
  height: 0;
  overflow: clip;
  opacity: 0;
  transition:
    height 320ms cubic-bezier(0.16, 1, 0.3, 1),
    opacity 220ms ease,
    content-visibility 320ms allow-discrete;
}
.tailored details[open]::details-content {
  height: auto;
  opacity: 1;
}
.tailored details summary svg {
  transition: transform 240ms ease;
}
@media (prefers-reduced-motion: reduce) {
  @view-transition {
    navigation: none;
  }
  *,
  *::before,
  *::after {
    animation: none !important;
    transition: none !important;
  }
  .btn:hover,
  .hotspot__trigger:hover {
    transform: none;
  }
}

/* Word masks preserve the existing typography and line wrapping. */
.motion-word-shell {
  display: inline-block;
  vertical-align: bottom;
  overflow: clip;
  padding-block: 0.17em;
  margin-block: -0.17em;
}
.motion-word {
  display: inline-block;
  transform-origin: 0 100%;
}
.motion-rule-host {
  position: relative;
}
.motion-rule {
  position: absolute;
  left: 0;
  right: 0;
  top: -1px;
  height: 1px;
  max-width: none !important;
  background: currentColor;
  opacity: 0.55;
  transform-origin: left;
  pointer-events: none;
}
.motion-drift {
  overflow: hidden;
}
.motion-drift img {
  scale: 1.045;
}
@media (prefers-reduced-motion: reduce) {
  .motion-drift img {
    scale: none;
    translate: none !important;
  }
}