/* Age verification / adult-content warning overlay */ #ageVerificationModal { position: fixed; inset: 0; /* top/right/bottom/left: 0 */ width: 100%; height: 100%; display: flex; /* visible on load; JS hides it after confirm */ align-items: center; justify-content: center; background: linear-gradient(135deg, #2b2b3a, #14141c); z-index: 2147483647; } /* JS adds this class after the user confirms 18+ */ #ageVerificationModal.verified { display: none; } /* Stop the page behind from scrolling while the gate is up (JS adds/removes .age-gate-open on ) */ body.age-gate-open { overflow: hidden; } #ageVerificationModal > div { background-color: white; padding: 24px 28px; border-radius: 10px; box-shadow: 0 4px 6px rgba(0,0,0,0.1); text-align: center; max-width: 90%; } .ageConfirmButton, .ageDenyButton { padding: 10px 20px; margin: 10px; cursor: pointer; font-size: 16px; border: none; border-radius: 4px; } .ageConfirmButton { background-color: #4CAF50; color: white; } .ageDenyButton { background-color: red; color: white; opacity: 0.5; } .ageDenyButton:hover, .ageConfirmButton:hover { opacity: 1; }