@keyframes story6-page-enter {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

#six {
  /* Page-scoped subset of the AtlasNG HRA palette and typography tokens */
  --hra-primary-30: #95001e;
  --hra-primary-35: #bb062c;
  --hra-primary-40: #e00d3a;
  --hra-primary-80: #ffb3b3;
  --hra-secondary-40: #201e3d;
  --hra-secondary-80: #c6c2ea;
  --hra-secondary: var(--hra-secondary-40);
  --hra-secondary-fixed-dim: var(--hra-secondary-80);
  --hra-tertiary-30: #3d3d50;
  --hra-tertiary-90: #e2e0f8;
  --hra-neutral-0: #000000;
  --hra-neutral-10: #1c1b1e;
  --hra-neutral-20: #26282b;
  --hra-neutral-87: #c7d2dd;
  --hra-neutral-95: #e9eef3;
  --hra-neutral-96: #eef2f6;
  --hra-neutral-98: #fafbfc;
  --hra-neutral-100: #ffffff;
  --hra-neutral-variant-30: #393f45;
  --hra-neutral-variant-50: #909bad;
  --hra-neutral-variant-90: #dee5f1;
  --hra-font-plain: 'Nunito Sans Variable', sans-serif;
  --hra-font-brand: 'Metropolis', sans-serif;
  --hra-type-body-large: 400 1rem / 1.5rem var(--hra-font-plain);
  --hra-type-body-large-emphasized-weight: 700;
  --hra-type-body-large-tracking: 0;
  --hra-type-display-small: 500 2.25rem / 2.75rem var(--hra-font-brand);
  --hra-type-display-small-tracking: -0.031rem;
  --hra-type-headline-small: 500 1.5rem / 2rem var(--hra-font-brand);
  --hra-type-headline-small-tracking: -0.013rem;
  --hra-type-title-large: 500 1.375rem / 1.75rem var(--hra-font-plain);
  --hra-type-title-large-tracking: 0;
  --hra-type-title-medium: 600 1rem / 1.5rem var(--hra-font-plain);
  --hra-type-title-medium-tracking: 0.009rem;
  --hra-type-label-large: 500 0.875rem / 1.25rem var(--hra-font-plain);
  --hra-type-label-large-tracking: 0.006rem;
  --story-section-inline-padding: clamp(1rem, 4vw, 1.5rem);
  --story-viewport-height: 100dvh;
  --story-cde-stage-aspect-ratio: 1320 / 760;
  --story-cde-stage-max-width: 82.5rem;

  box-sizing: border-box;
  animation: story6-page-enter 280ms cubic-bezier(0.2, 0, 0, 1) both;
  background: var(--hra-neutral-98);
  font: var(--hra-type-body-large);
  letter-spacing: var(--hra-type-body-large-tracking);
  overflow-x: clip;
  -webkit-user-select: text;
  user-select: text;

  :where(#main-content, .sceneEnd),
  :where(#main-content, .sceneEnd) *,
  :where(#main-content, .sceneEnd) *::before,
  :where(#main-content, .sceneEnd) *::after {
    box-sizing: inherit;
  }

  #main-content *,
  .sceneEnd * {
    -webkit-user-select: inherit;
    user-select: inherit;
  }

  #main-content ::selection,
  .sceneEnd ::selection {
    color: var(--hra-neutral-100);
    background: var(--hra-primary-30);
  }

  :where(#main-content p, #main-content button, .sceneEnd p, .sceneEnd button) {
    font: inherit;
    letter-spacing: inherit;
  }

  strong {
    font-weight: var(--hra-type-body-large-emphasized-weight);
  }

  :where(#main-content a, .sceneEnd a) {
    color: var(--hra-neutral-10);
    text-decoration: underline;
    text-decoration-thickness: 0.08em;
    text-underline-offset: 0.16em;
  }

  #main-content:focus {
    outline: none;
  }

  #main-content :is(a, button, [tabindex]):focus-visible,
  .sceneEnd :is(a, button, [tabindex]):focus-visible {
    outline: 3px solid var(--hra-neutral-10);
    outline-offset: 3px;
  }

  .visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
  }

  .story-scene {
    height: var(--story-viewport-height);
    max-width: 100vw;
    overflow: hidden;
    padding-inline: var(--story-section-inline-padding);
  }

  @media (prefers-reduced-motion: reduce) {
    .story-scene {
      height: auto;
      min-height: 0;
    }
  }
}

#six #main-content a:focus,
#six .sceneEnd a:focus {
  border-radius: 0.125rem;
}

#six #main-content button:focus,
#six .sceneEnd button:focus {
  border-radius: 0.5rem;
}

@media (prefers-reduced-motion: reduce) {
  html:has(body#six) {
    scroll-behavior: auto;
  }

  #six {
    animation: none;
  }
}
