.movie-trivia-container{max-width:800px;min-height:1100px;margin:2rem auto;padding:0 var(--side-gutter)}.trivia-header{text-align:center;margin-bottom:2rem}.trivia-header h1{font-size:2rem;color:#333;margin-bottom:.5rem}.dark .trivia-header h1{color:#fff}.trivia-header p{color:#666;font-size:1.1rem}.dark .trivia-header p{color:#999}.trivia-game{background:#fff;border-radius:12px;padding:2rem;box-shadow:0 2px 10px rgb(0 0 0 / .1)}.dark .trivia-game{background:#282828}.trivia-stats{display:flex;justify-content:space-between;margin-bottom:1.5rem;padding-bottom:1rem;border-bottom:2px solid #f2f6f9;font-size:1rem;font-weight:600}.dark .trivia-stats{border-bottom-color:#3a3a3a}.stat-correct{color:#28a745}.stat-wrong{color:#dc3545}.stat-current{color:#666}.dark .stat-current{color:#999}.synopsis-section{margin-bottom:2rem}.synopsis-label{font-size:.9rem;text-transform:uppercase;color:#666;margin-bottom:.5rem;font-weight:600}.dark .synopsis-label{color:#999}.synopsis-text{font-size:1.1rem;line-height:1.6;color:#333;padding:1.5rem;background:#f8f9fa;border-radius:8px;border-left:4px solid #a80065}.dark .synopsis-text{background:#1a1a1a;color:#fff}.movie-meta{font-size:.9rem;color:#666;margin-top:.5rem}.dark .movie-meta{color:#999}.options-section{margin-bottom:1.5rem}.options-label{font-size:1rem;font-weight:600;color:#333;margin-bottom:1rem}.dark .options-label{color:#fff}.option-button{display:block;width:100%;padding:1rem 1.5rem;margin-bottom:.75rem;font-size:1rem;text-align:left;background:#f8f9fa;border:2px solid #dee2e6;border-radius:8px;cursor:pointer;transition:all 0.2s;color:#333}.dark .option-button{background:#1a1a1a;border-color:#3a3a3a;color:#fff}.option-button:hover:not(:disabled){background:#e9ecef;border-color:#a80065;transform:translateX(4px)}.dark .option-button:hover:not(:disabled){background:#2a2a2a}.option-button:disabled{cursor:not-allowed;opacity:.6}.option-button.correct{background:#28a745;border-color:#28a745;color:#fff;opacity:1}.option-button.wrong{background:#dc3545;border-color:#dc3545;color:#fff;opacity:1}.option-button.revealed{background:#28a745;border-color:#28a745;color:#fff;opacity:1}.feedback-section{text-align:center;margin:1.5rem 0;min-height:40px}.movie-info-section{margin:1.5rem 0;padding:1rem;background:#f8f9fa;border-radius:8px;display:none;text-decoration:none;color:inherit;transition:all 0.2s}.dark .movie-info-section{background:#1a1a1a}.movie-info-section.show{display:flex;gap:1rem;align-items:flex-start}.movie-info-section:hover{background:#e9ecef;transform:translateY(-2px);box-shadow:0 4px 12px rgb(0 0 0 / .15)}.dark .movie-info-section:hover{background:#2a2a2a}.movie-poster{width:150px;height:84px;border-radius:8px;flex-shrink:0;box-shadow:0 4px 12px rgb(0 0 0 / .2);object-fit:cover;object-position:center}.movie-info-text{flex:1;display:flex;flex-direction:column;gap:.75rem}.movie-title-reveal{font-size:1.3rem;font-weight:600;color:#333;line-height:1.4}.dark .movie-title-reveal{color:#fff}.movie-genre{font-size:.9rem;color:#666}.dark .movie-genre{color:#999}.movie-rating{font-size:1rem;color:#f5c518;font-weight:600}.movie-airtime{font-size:.95rem;color:#666;line-height:1.5}.dark .movie-airtime{color:#999}@media (max-width:600px){.movie-info-section.show{flex-direction:column}.movie-poster{width:100%;max-width:200px;margin:0 auto}}.movie-title-reveal strong{color:#a80065;font-size:1.2rem}.dark .movie-title-reveal strong{color:#ff4da6}.feedback-message{font-size:1.2rem;font-weight:600;padding:1rem;border-radius:8px;display:none}.feedback-message.show{display:block}.feedback-correct{color:#28a745;background:#d4edda}.dark .feedback-correct{background:#1a3a1a}.feedback-wrong{color:#dc3545;background:#f8d7da}.dark .feedback-wrong{background:#3a1a1a}.next-button{display:block;width:100%;padding:1rem;font-size:1.1rem;font-weight:600;background:#a80065;color:#fff;border:none;border-radius:8px;cursor:pointer;transition:all 0.2s}.next-button:hover{background:#8a0052;transform:scale(1.02)}.next-button:disabled{background:#8a0052;cursor:not-allowed;transform:none;opacity:.25}.end-screen{text-align:center}.end-screen h2{font-size:2rem;margin-bottom:1rem;color:#333}.dark .end-screen h2{color:#fff}.end-screen .final-score{font-size:3rem;font-weight:700;margin:1.5rem 0;color:#a80065}.end-screen .score-message{font-size:1.3rem;margin-bottom:2rem;color:#666}.dark .end-screen .score-message{color:#999}.end-screen .score-breakdown{display:flex;justify-content:center;gap:3rem;margin:2rem 0;font-size:1.2rem}.score-breakdown .correct-stat{color:#28a745}.score-breakdown .wrong-stat{color:#dc3545}.share-section{margin:2rem 0;padding:1.5rem;background:#f8f9fa;border-radius:8px}.dark .share-section{background:#3a3a3a}.start-view{text-align:center;padding:2rem 0}.start-view h2{font-size:1.8rem;color:#333;margin-bottom:1.5rem}.dark .start-view h2{color:#fff}.start-view .intro-text{font-size:1.25rem;line-height:1.8;max-width:600px;color:#555;margin:0 auto 1rem;text-align:center}.dark .start-view .intro-text{color:#bbb}.trivia-stats.st__hidden{display:none}.start-view .intro-text strong{color:#a80065}.dark .start-view .intro-text strong{color:#ff4da6}.movie-collage{display:flex;justify-content:center;align-items:center;margin-bottom:2rem;height:140px;position:relative}.collage-image{width:180px;height:101px;overflow:hidden;border-radius:8px;box-shadow:0 4px 12px rgb(0 0 0 / .3);transition:transform 0.3s,z-index 0s;position:absolute;border:3px solid #fff}.dark .collage-image{border-color:#282828}.collage-image:nth-child(1){transform:rotate(-8deg) translateX(-140px);z-index:1}.collage-image:nth-child(2){transform:rotate(-4deg) translateX(-70px);z-index:2}.collage-image:nth-child(3){transform:rotate(0deg);z-index:3}.collage-image:nth-child(4){transform:rotate(4deg) translateX(70px);z-index:2}.collage-image:nth-child(5){transform:rotate(8deg) translateX(140px);z-index:1}.collage-image img{width:100%;height:100%;object-fit:cover;object-position:center}.loading-collage{text-align:center;color:#666;padding:2rem}.dark .loading-collage{color:#999}.start-button{display:inline-block;margin-top:2rem;padding:1.2rem 3rem;font-size:1.2rem;font-weight:600;background:#a80065;color:#fff;border:none;border-radius:12px;cursor:pointer;transition:all 0.3s;box-shadow:0 4px 15px rgb(168 0 101 / .3)}.start-button:hover{background:#8a0052;transform:translateY(-2px);box-shadow:0 6px 20px rgb(168 0 101 / .4)}.start-button:active{transform:translateY(0)}.restart-button{color:#fff!important}.loading-spinner{border:4px solid rgb(168 0 101 / .2);border-top:4px solid #a80065;border-radius:50%;width:40px;height:40px;animation:spin 1s linear infinite;margin:0 auto}@keyframes spin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}.share-button{display:inline-block;padding:1rem 2rem;margin:.5rem;font-size:1rem;font-weight:600;background:#a80065;color:#fff;border:none;border-radius:8px;cursor:pointer;transition:all 0.2s;text-decoration:none}.share-button:hover{background:#8a0052;transform:scale(1.05)}.restart-button{display:inline-block;padding:1rem 2rem;margin-top:1rem;font-size:1.1rem;font-weight:600;background:#28a745;color:#fff;border:none;border-radius:8px;cursor:pointer;transition:all 0.2s}.restart-button:hover{background:#218838;transform:scale(1.05)}.loading{text-align:center;padding:3rem;color:#666;font-size:1.2rem}.dark .loading{color:#999}.error{text-align:center;padding:2rem;color:#dc3545;background:#f8d7da;border-radius:8px}.dark .error{background:#3a1a1a}.st__hidden{display:none!important}.preroll{text-align:center;min-height:400px}.preroll-info{font-size:1.1rem;color:#666;margin-bottom:1rem;font-weight:600}.dark .preroll-info{color:#999}#trivia-mediaplayer{width:100%;max-width:640px;min-height:360px;margin:0 auto}@media (max-width:600px){.trivia-game{padding:1.5rem}.trivia-header h1{font-size:1.5rem}.start-view .intro-text{font-size:1rem}.synopsis-text{font-size:1rem;padding:1rem}.option-button{padding:.875rem 1rem;font-size:.95rem}.movie-collage{height:100px}.collage-image{width:120px;height:67px}.collage-image:nth-child(1){transform:rotate(-8deg) translateX(-90px)}.collage-image:nth-child(2){transform:rotate(-4deg) translateX(-45px)}.collage-image:nth-child(4){transform:rotate(4deg) translateX(45px)}.collage-image:nth-child(5){transform:rotate(8deg) translateX(90px)}}