/* theROM.com — small supplementary styles that go beyond Tailwind utilities */

::selection {
  background: #B5472E;
  color: #FAF4EA;
}

body {
  background-image:
    radial-gradient(circle at 1px 1px, rgba(34,28,22,0.06) 1px, transparent 0);
  background-size: 22px 22px;
}

.text-balance { text-wrap: balance; }

.star-rating {
  color: #D6A13C;
  letter-spacing: 1px;
}

.card-lift {
  transition: transform .25s ease, box-shadow .25s ease;
}
.card-lift:hover {
  transform: translateY(-4px);
  box-shadow: 0 18px 30px -12px rgba(34,28,22,0.25);
}

.clip-ticket {
  clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);
}

.underline-brick {
  background-image: linear-gradient(#B5472E, #B5472E);
  background-repeat: no-repeat;
  background-position: 0 88%;
  background-size: 100% 3px;
}

@keyframes fadeUp {
  from { opacity: 0; transform: translateY(14px); }
  to { opacity: 1; transform: translateY(0); }
}
.animate-fade-up {
  animation: fadeUp .6s ease both;
}

/* Category icon chips reuse a single sprite of inline SVG paths defined per-page,
   this just gives them a consistent frame */
.icon-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

@media (max-width: 640px) {
  .marquee-track { animation-duration: 18s !important; }
}