/* One continuous document; the surfaces turn as they enter the viewport. */
html { scroll-behavior: smooth; }
body { overflow-x: hidden; }
.site-shell { position: relative; z-index: 1; }
.gameplay-background {
  position: fixed;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
  background: #000;
  image-rendering: pixelated;
  z-index: 0;
  pointer-events: none;
}
html[lang="en"] .gameplay-background { transform: scaleX(-1); }
.activate-motion {
  position: fixed;
  z-index: 20;
  right: 1rem;
  bottom: 1rem;
  padding: .75rem 1rem;
  border: 1px solid #e0bb6e;
  border-radius: .3rem;
  color: #fff;
  background: #17130e;
  font: inherit;
  cursor: pointer;
}
.activate-motion[hidden] { display: none; }
body.gameplay-ready .screen.story .scene { background: transparent; }
body.gameplay-ready .screen.hero .scene-entrance { background: transparent; }
#navigation { position: absolute; top: 0; left: 0; right: 0; z-index: 5; }
main { height: auto; min-height: 0; }
.screen.hero, .screen.story {
  position: relative;
  height: auto;
  min-height: 0;
  overflow: visible;
  border: 0;
  background: transparent;
}
.turn-surface {
  position: relative;
  isolation: isolate;
  transform-origin: right center;
  transform: perspective(1600px) rotateY(var(--turn, 0deg));
  backface-visibility: hidden;
}
.hero .turn-surface { height: 100vh; height: 100svh; min-height: 0; }
.story .turn-surface { min-height: 100vh; display: flex; align-items: center; }
.story .turn-surface { opacity: var(--reveal, 1); }
.screen.hero .scene-entrance, .screen.story .scene {
  position: absolute;
  top: 0;
  bottom: 0;
  right: auto;
  left: 50%;
  width: 100vw;
  height: 100%;
  transform: translateX(-50%);
  background-position: center;
  background-size: cover;
  pointer-events: none;
}
html[lang="en"] .screen.hero .scene-entrance,
html[lang="en"] .screen.story .scene { transform: translateX(-50%) scaleX(-1); }
.story .scroll { width: 100%; }
.screen.hero .scene-entrance, .screen.story .scene {
  background-image: url('/assets/pc-ega-inicio.png');
  background-size: contain;
  background-color: #000;
}
.screen.story .scroll, .hero-copy, nav.floor-menu a, .screen-caption {
  text-shadow:
    -1.5px -1.5px 0 #000, 0 -1.5px 0 #000, 1.5px -1.5px 0 #000,
    -1.5px 0 0 #000, 1.5px 0 0 #000,
    -1.5px 1.5px 0 #000, 0 1.5px 0 #000, 1.5px 1.5px 0 #000,
    0 0 5px #000;
}
.screen.story .scroll .button { text-shadow: none; }
.screen.story .scroll {
  border-radius: 1rem;
  font-weight: 700;
  background-color: rgba(224, 224, 224, .94);
  color: #000;
  text-shadow: none;
}
.screen.story .scroll :is(h2, h3, p, em, strong, b, small, span, a) {
  color: #000 !important;
  text-shadow: none;
}
.screen.story .scroll a:not(.button):hover,
.screen.story .scroll a:not(.button):focus-visible { text-decoration: underline; }
.screen.story .scroll h2,
.screen.story .scroll h3 { font-weight: 700; }
.screen.story .scroll p:not(.eyebrow) { font-size: 16px; font-weight: 700; }
.screen.story .scroll .edition span,
.screen.story .scroll .note { font-size: 11px !important; }
.screen.story .scroll .downloads small { font-size: 10px; }
.screen.story .scroll .downloads .checksum { overflow-wrap: anywhere; letter-spacing: 0; font-family: monospace; }
.downloads .download-pending { padding: 15px 3px; border-top: 1px solid #76684c; border-bottom: 1px solid #76684c; }
.hero-copy { font-weight: 700; }
.hero-copy .eyebrow { font-size: 10px; }
.hero-copy h1 { font-size: calc(clamp(28px, 3.4vw, 45px) + 1px); font-weight: 700; }
.hero-copy > p:not(.eyebrow) { font-size: 13px; }
nav.floor-menu {
  bottom: max(56px, 9%);
  border-radius: 1rem;
  background: rgba(224, 224, 224, .94);
}
nav.floor-menu a,
nav.floor-menu a span {
  color: #000;
  text-shadow: none;
}
nav.floor-menu a { font-size: 12px; }
nav.floor-menu a:hover,
nav.floor-menu a:focus-visible,
nav.floor-menu a:hover span,
nav.floor-menu a:focus-visible span { color: #000; text-decoration: underline; }
nav.hero-languages {
  position: absolute;
  z-index: 4;
  top: 12px;
  left: 12px;
  display: flex;
  gap: 2px;
  padding: 0 3px;
  align-items: center;
  color: #000;
  background: rgba(224, 224, 224, .94);
  border-radius: .5rem;
  text-shadow: none;
}
nav.hero-languages a {
  color: #000;
  padding: 9px 7px;
  font-size: 13px;
  font-weight: 700;
  text-shadow: inherit;
}
nav.hero-languages a[aria-current="true"] { color: #000; text-decoration: underline; }
nav.hero-languages a:hover, nav.hero-languages a:focus-visible { color: #000; text-decoration: underline; }
@media (max-width: 900px) {
  .menu-toggle { position: absolute; right: 4%; top: 12px; z-index: 5; }
  .hero .turn-surface { height: 100vh; height: 100svh; min-height: 0; }
  .story .turn-surface { display: block; padding-bottom: 1px; }
}
@media (max-width: 600px) {
  .screen.story .scroll p:not(.eyebrow) { font-size: 15px; }
  .hero-copy h1 { font-size: 30px; }
  nav.floor-menu a { font-size: 11px; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .turn-surface { transform: none !important; }
  .story .turn-surface { opacity: 1 !important; }
}