/* Shared controls preserve each page's colors and typography. */
#ageGate[hidden] { display: none !important; }
#ageGate[data-age-state="pending"],
#ageGate[data-age-state="denied"] {
  display: flex;
  overflow-y: auto;
  overscroll-behavior: contain;
  align-items: safe center;
}
#ageGate .gateCard { max-height: calc(100dvh - 32px); overflow-y: auto; }
#ageGate .gateField { min-width: 0; }
#ageGate .gateField input { min-width: 0; }
#ageGate .gateActions button { min-height: 44px; }
#ageGate .gateCheck { min-height: 44px; align-items: center; }
body.gate-locked { overflow: hidden; }
[inert] { pointer-events: none; user-select: none; }
:focus-visible { outline: 2px solid currentColor; outline-offset: 5px; }
#ageGate :focus-visible { outline: 2px solid currentColor; outline-offset: 3px; }
#ageGate .gateField input:focus-visible { outline: 2px solid currentColor; }
.skip-link {
  position: fixed;
  top: 12px;
  left: 12px;
  z-index: 10001;
  padding: 12px 18px;
  background: #fff;
  color: #171717;
  border: 2px solid currentColor;
  transform: translateY(calc(-100% - 24px));
}
.skip-link:focus { transform: translateY(0); }
@media (max-width: 480px) {
  #ageGate { padding: 16px; }
  #ageGate .gateCard { max-height: calc(100dvh - 32px); }
  #ageGate .gateField input { font-size: 16px; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto !important; }
  #ageGate, #ageGate *, .skip-link { animation: none !important; transition: none !important; }
}

.no-script-notice { position: relative; padding: 16px 24px; margin: 0; border-bottom: 1px solid currentColor; font-size: 14px; line-height: 1.8; }