.atlas-finale.cinema-credits {
  width: 100vw; max-width: none; height: 100dvh; max-height: none;
  margin: 0; padding: 0; border: 0; overflow: hidden;
  background: #261c17; color: #e8decd; color-scheme: dark;
  text-align: center; font-family: var(--cn);
}
.cinema-credits::backdrop { background: #261c17; }
body[data-language="en"] .cinema-credits { font-family: var(--en); }
.credits-controls { position: absolute; inset: 0 0 auto; z-index: 2; display: flex; justify-content: space-between; gap: 16px; padding: 18px 5vw; background: #261c17; border-bottom: 1px solid #b69b6a33; }
.credits-controls button, .credits-end { color: #e8decd; background: transparent; font: 16px var(--label); border: 0; border-bottom: 1px solid #ad8c59; padding: 8px 0; cursor: pointer; margin: 0; }
.cinema-credits :focus-visible { outline: 2px solid #dabb82; outline-offset: 6px; }
.credits-viewport { height: 100%; overflow-y: auto; overscroll-behavior: contain; scrollbar-color: #a68a62 #261c17; scroll-padding: 100px 0; }
.credits-roll { max-width: 820px; margin: auto; padding: max(140px, 22vh) 28px 18vh; }
.credits-roll section { margin: 0 0 22vh; }
.cinema-credits h2 { font: 400 clamp(32px, 5vw, 64px)/1.5 var(--cn); letter-spacing: .05em; }
body[data-language="en"] .cinema-credits h2 { font-family: var(--en); }
.cinema-credits h3 { font-weight: 400; font-size: clamp(25px, 3.5vw, 40px); line-height: 1.6; margin: 0 0 32px; }
.cinema-credits .finale-message { max-width: 34em; margin: 28px auto 52px; color: #d0c2ae; line-height: 1.9; }
.cinema-credits .finale-seals { grid-template-columns: repeat(3, 1fr); gap: 28px 16px; max-width: 550px; }
.cinema-credits .finale-seals img, .credits-selected img { background: #dfd0b5; border-radius: 0; padding: 6px; }
.credits-scroll-hint, .credits-legend { color: #bfb09a; font-size: 15px; line-height: 1.9; max-width: 34em; margin: 48px auto; }
.credits-titles { list-style: none; padding: 0; margin: 60px 0 0; }
.credits-titles li { position: relative; margin: 0 auto; padding: 22px 44px; width: fit-content; max-width: 100%; font-size: clamp(20px, 2.6vw, 30px); line-height: 1.6; color: #c5b9a5; }
.credits-titles .credits-selected { color: #f0cd8d; }
.credits-untranslated { display: block; margin-top: 6px; color: #bfb09a; font: 14px/1.6 var(--label); }
.atlas-readings-complete .cta-callout { display: none; }
.credits-replay[hidden] { display: none; }
.credits-selected img { width: 32px; height: 32px; padding: 3px; position: absolute; left: 0; top: calc(50% - 16px); }
.credits-attribution dl { margin: 64px 0 0; }
.credits-attribution dt { font: 15px var(--label); color: #bfb09a; margin: 44px 0 12px; }
.credits-attribution dd { margin: 0; font-size: clamp(18px, 2.3vw, 25px); line-height: 1.7; overflow-wrap: anywhere; }
.credits-attribution a { color: inherit; text-decoration-color: #957b55; text-underline-offset: 5px; }
.credits-coda h3 { white-space: pre-line; color: #f0cd8d; }
.credits-coda p { line-height: 1.9; color: #d0c2ae; margin-bottom: 44px; }
.credits-replay { background: none; border: 0; color: inherit; font: inherit; text-decoration: underline; text-underline-offset: 4px; cursor: pointer; }
@media (max-width: 600px) {
  .credits-roll { padding-inline: 22px; }
  .credits-controls { padding: 12px 22px; }
  .cinema-credits .finale-seals img { width: 50px; height: 50px; }
  .cinema-credits .finale-seals figcaption { font-size: 12px; }
}