body { font-family: 'Outfit', sans-serif; margin: 0; padding: 0; }
body.loading { overflow: hidden; }

.gradient-text { 
    background: linear-gradient(90deg, #8a1c1c, #f59e0b); 
    -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; 
}

@keyframes marquee { 0% { transform: translateX(0); } 100% { transform: translateX(-50%); } }
.animate-marquee { display: inline-flex; animation: marquee 25s linear infinite; }
.hover\:pause:hover { animation-play-state: paused; }

.nav-spacer { height: 100px; } 
@media (min-width: 768px) { .nav-spacer { height: 120px; } }

@keyframes float { 0% { transform: translateY(0px); } 50% { transform: translateY(-10px); } 100% { transform: translateY(0px); } }
.animate-float { animation: float 4s ease-in-out infinite; }

.hero-pattern { background-image: radial-gradient(#8a1c1c 0.5px, transparent 0.5px); background-size: 24px 24px; }

#live-video-player { filter: contrast(1.06) saturate(1.1) brightness(1.02); transition: filter 0.3s ease; }
button:disabled { opacity: 0.5; cursor: not-allowed; filter: grayscale(1); }

/* --- DOMINO BOOK LOADER --- */
.book-loader-container { display: flex; flex-direction: column; align-items: center; }
.bookshelf { width: 120px; height: 45px; position: relative; border-bottom: 3px solid #8a1c1c; margin-bottom: 15px; }
.book { position: absolute; bottom: 0; width: 16px; height: 40px; border: 2px solid #ffffff; border-radius: 2px; background-color: transparent; transform-origin: bottom right; }
.book:nth-child(1) { left: 0px; animation: book-fall-1 2s infinite ease-in; }
.book:nth-child(2) { left: 24px; animation: book-fall-2 2s infinite ease-in; }
.book:nth-child(3) { left: 48px; animation: book-fall-3 2s infinite ease-in; }
.book:nth-child(4) { left: 72px; animation: book-fall-4 2s infinite ease-in; }
.book:nth-child(5) { left: 96px; animation: book-fall-5 2s infinite ease-in; }
@keyframes book-fall-1 { 0%, 100% { transform: rotate(0deg); } 15%, 85% { transform: rotate(-45deg); } }
@keyframes book-fall-2 { 5%, 100% { transform: rotate(0deg); } 20%, 85% { transform: rotate(-45deg); } }
@keyframes book-fall-3 { 10%, 100% { transform: rotate(0deg); } 25%, 85% { transform: rotate(-45deg); } }
@keyframes book-fall-4 { 15%, 100% { transform: rotate(0deg); } 30%, 85% { transform: rotate(-45deg); } }
@keyframes book-fall-5 { 20%, 100% { transform: rotate(0deg); } 35%, 85% { transform: rotate(-45deg); } }