/* Anime.js owns these transforms; keep cards visible if the library fails. */
#tour-grid .card {
  cursor: pointer;
  border: 2px solid #3a5a5c30;
  border-radius: 24px;
  overflow: hidden;
  transition: border-color 220ms ease, box-shadow 220ms ease;
}
#tour-grid .card-art { border-radius: 22px 22px 0 0; }
#tour-dialog {
  position: fixed;
  inset: 0;
  width: 100%;
  height: 100dvh;
  max-width: none;
  max-height: none;
  margin: 0;
  border: 0;
  border-radius: 0;
  padding: clamp(76px, 8vw, 110px) 24px 64px;
  overflow-y: auto;
  overscroll-behavior: contain;
}
#tour-dialog #dialog-content { max-width: 880px; margin-inline: auto; }
#tour-dialog #close-dialog {
  position: fixed;
  top: 18px;
  right: 24px;
  z-index: 2;
  width: 44px;
  height: 44px;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 50%;
}
#tour-dialog .tour-detail-art { height: clamp(160px, 28vh, 300px); overflow: hidden; margin-bottom: 30px; }
#tour-dialog .tour-detail-art svg { width: 100%; height: 100%; }
#tour-grid.has-card-motion .card-art svg {
  transition: none;
  transform: none;
  transform-origin: center;
}
#tour-grid .card:hover,
#tour-grid .card:focus-within {
  border-color: #3A5A5C;
  box-shadow: 0 18px 36px #2d2a2938, 0 4px 10px #2d2a2920;
}
#tour-grid .card[data-category="premium"]:hover,
#tour-grid .card[data-category="premium"]:focus-within {
  border-color: #DC917C;
}
@media (prefers-reduced-motion: reduce) {
  #tour-grid .card, #tour-grid .card-art svg { transition: none; }
  #tour-grid .card:hover .card-art svg { transform: none; }
}
