/* Subtle motion only — keep interactions feeling native. */

@keyframes fadeUp {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: translateY(0); }
}

@keyframes pulseGlow {
  0%, 100% { transform: scale(1); opacity: 1; }
  50% { transform: scale(1.04); opacity: 0.85; }
}

@keyframes onlinePulse {
  0% { box-shadow: 0 0 0 0 rgba(0, 200, 83, 0.5); }
  70% { box-shadow: 0 0 0 8px rgba(0, 200, 83, 0); }
  100% { box-shadow: 0 0 0 0 rgba(0, 200, 83, 0); }
}

@keyframes press {
  from { transform: scale(1); }
  to { transform: scale(0.97); }
}

@keyframes sheetIn {
  from { transform: translateY(24px); opacity: 0; }
  to { transform: translateY(0); opacity: 1; }
}

@keyframes bubbleIn {
  from { opacity: 0; transform: translateY(8px) scale(0.98); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes storyFade {
  from { opacity: 0.4; }
  to { opacity: 1; }
}

.room-card { animation: fadeUp 0.35s ease both; }
.room-card:nth-child(2) { animation-delay: 0.04s; }
.room-card:nth-child(3) { animation-delay: 0.08s; }
.room-card:nth-child(4) { animation-delay: 0.12s; }
.room-card:nth-child(5) { animation-delay: 0.16s; }

.btn:hover { filter: brightness(1.04); }
.btn:active { animation: press 0.12s ease; }

.expire-badge:not(.is-expired) { animation: pulseGlow 1.6s ease-in-out infinite; }
.online-dot { animation: onlinePulse 1.8s ease-out infinite; }

.sheet__panel, .drawer__panel { animation: sheetIn 0.22s ease; }
.bubble { animation: bubbleIn 0.2s ease; }
.story-frame img { animation: storyFade 0.25s ease; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation: none !important;
    transition: none !important;
  }
}