@font-face {
  font-family: "Age Blackletter";
  src: url("../fonts/FontBlackletter-Regular-caps-v3-e.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

.ui-standardized .age-gate {
  --age-surface: #0c090c;
  --age-silver: #aaa6b2;
  --age-text: #dedbe3;
  --age-corner: clamp(36px, 7vw, 64px);
  --ui-focus: #eeeaf4;
}
.ui-standardized .age-gate .overlay {
  width: min(100%, 48rem);
  padding: clamp(40px, 6vw, 64px) clamp(24px, 6vw, 64px);
  gap: var(--ui-space-8);
  background: var(--age-surface);
  color: var(--age-text);
  border: 0;
  border-image: none;
  box-shadow: none;
  clip-path: none;
  animation: none;
  opacity: 1;
  transform: none;
  isolation: isolate;
}
.age-silver__frame {
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: -1;
  background:
    url("../assets/images/age-verification/silver/corner-tl.png") left top / var(--age-corner) auto no-repeat,
    url("../assets/images/age-verification/silver/corner-tr.png") right top / var(--age-corner) auto no-repeat,
    url("../assets/images/age-verification/silver/corner-bl.png") left bottom / var(--age-corner) auto no-repeat,
    url("../assets/images/age-verification/silver/corner-br.png") right bottom / var(--age-corner) auto no-repeat;
}
.age-silver__frame::before {
  content: "";
  position: absolute;
  inset: 6px calc(var(--age-corner) - 8px);
  border-block: 3px double var(--age-silver);
}
.age-silver__frame::after {
  content: "";
  position: absolute;
  inset: calc(var(--age-corner) - 8px) 6px;
  border-inline: 3px double var(--age-silver);
}
.age-silver__crest {
  position: absolute;
  left: 50%;
  width: 32px;
  transform: translateX(-50%);
  background: var(--age-surface);
}
.age-silver__crest--top { top: -5px; }
.age-silver__crest--bottom { bottom: -5px; }
.ui-standardized .age-gate .overlay h1 {
  color: var(--age-text);
  letter-spacing: 0.12em;
}
.ui-standardized .age-gate .overlay .lead {
  color: var(--age-text);
  line-height: 1.9;
  text-align: left;
}
.ui-standardized .age-gate .controls {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: var(--ui-space-4);
}
.ui-standardized .age-gate .btn {
  width: min(100%, 14rem);
  min-height: 72px;
  aspect-ratio: 3 / 1;
  padding: var(--ui-space-4) var(--ui-space-6);
  border: 0;
  border-radius: 0;
  background: url("../assets/images/age-verification/silver/button-frame.png") center / 100% 100% no-repeat;
  color: #eeeaf4;
  box-shadow: none;
  font-family: "Kaisei Opti Japanese", "Age Blackletter", serif;
  font-size: 1.5rem;
  font-weight: 400;
  line-height: 1.2;
  letter-spacing: 0.08em;
  transform: none;
  transition: filter 160ms ease;
}
.ui-standardized .age-gate .btn:hover { filter: brightness(1.25); }
.ui-standardized .age-gate .btn:focus-visible {
  outline: 2px solid var(--ui-focus);
  outline-offset: 4px;
}
@media (forced-colors: active) {
  .ui-standardized .age-gate .overlay { border: 1px solid CanvasText; }
  .ui-standardized .age-gate .btn { border: 1px solid ButtonText; color: ButtonText; }
}