/* Page tweaks + AA!RM footer.
   Footer echoes aarm.games' noir identity: black field, blood-red + gold
   accents, big condensed uppercase wordmark. */
@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@400;500;600;700&display=swap');

/* --- page tweaks --- */
.agendaTitle { zoom: 0.8; margin-top: 40px !important; }  /* compress only the hero; trim top gap */

/* --- footer --- */
.siteFooter {
  --red: #8e0808;
  --gold: #ffa100;
  --muted: #8b8b8b;
  background: #000;
  color: #fff;
  font-family: "Oswald", "Noto Sans", sans-serif;
}
.siteFooter__inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 80px 32px 40px;
  display: flex;
  gap: 56px;
  justify-content: space-between;
  flex-wrap: wrap;
}
.siteFooter__word {
  display: inline-block;
  font-size: clamp(56px, 8vw, 110px);
  font-weight: 700;
  letter-spacing: 4px;
  line-height: 0.9;
  color: #fff;
  text-decoration: none;
}
.siteFooter__bang { color: var(--red); transition: color 0.15s; }
.siteFooter__word:hover .siteFooter__bang { color: var(--gold); }
.siteFooter__tag {
  margin-top: 20px;
  max-width: 440px;
  color: var(--muted);
  font-family: "Noto Sans", sans-serif;
  font-size: 15px;
  line-height: 1.6;
}
.siteFooter__meta {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
}
.siteFooter__cta {
  font-size: 18px;
  font-weight: 600;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: #000;
  background: var(--gold);
  text-decoration: none;
  padding: 14px 28px;
  border-radius: 2px;
  transition: background 0.15s;
}
.siteFooter__cta span { display: inline-block; transition: transform 0.15s; }
.siteFooter__cta:hover { background: #fff; }
.siteFooter__cta:hover span { transform: translateX(5px); }
.siteFooter__addr {
  color: var(--muted);
  font-family: "Noto Sans", sans-serif;
  font-size: 13px;
  letter-spacing: 0.5px;
}
.siteFooter__base {
  max-width: 1200px;
  margin: 0 auto;
  padding: 20px 32px 44px;
  display: flex;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
  color: var(--muted);
  font-family: "Noto Sans", sans-serif;
  font-size: 12px;
  letter-spacing: 0.5px;
  border-top: 1px solid rgba(255, 255, 255, 0.12);
}
@media (max-width: 1280px) {
  .siteFooter__inner { padding: 48px 20px 28px; gap: 32px; }
  .siteFooter__word { letter-spacing: 2px; }
}

/* --- inline game host: 90vh tall (not full-bleed), centred --- */
.agenda .canvasBlock { height: 90dvh; max-width: none; aspect-ratio: auto; padding: 0; }
/* transparent host: the game's own tabs + bordered card define the silhouette
   (the scoped .ada styles would otherwise paint a white box behind it) */
#adaHost { width: 100%; height: 100%; display: block; background: transparent; }

/* takeover while playing: lock outer scroll; frosted curtain + rounded game card */
html.gamePlaying, html.gamePlaying body { overflow: hidden !important; height: 100%; }
/* curtain: light blur + a fine stipple screen (halftone), fades in.
   (technique adapted from spotter's .curtain) */
html.gamePlaying::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 99998;
  opacity: 0;
  transition: opacity 0.28s ease;
  -webkit-backdrop-filter: blur(3px) saturate(0.95);
  backdrop-filter: blur(3px) saturate(0.95);
  background-color: rgba(20, 20, 24, 0.12);
  background-image: conic-gradient(
    rgba(0, 0, 0, 0.5) 0deg 90deg,
    transparent 90deg 180deg,
    rgba(0, 0, 0, 0.5) 180deg 270deg,
    transparent 270deg 360deg
  );
  background-size: 2px 2px;
}
html.gamePlaying--in::before { opacity: 1; }
/* the game floats on the curtain; its own tab pills + bordered card show
   their real silhouette (no host clipping / rounding / background) */
/* Centre with auto margins, NOT translateX: a transform on #adaHost would
   make its descendants' `position: fixed` resolve against this box instead of
   the viewport, boxing the win/confirm overlay to the game rect (a second dim
   inside the takeover curtain — the "double curtain"). */
html.gamePlaying #adaHost {
  position: fixed;
  top: 5dvh;
  /* End the card 64px above the viewport's foot: the floating EN/RU and
     Feedback buttons live in that band (5dvh alone is too thin on a phone). */
  height: calc(95dvh - 64px);
  /* Size the box via left/right insets rather than width: on this fixed element
     insets animate but width does not (it snaps). Normal play centres a 1060 box;
     the game (width:100% of the host) fills it. Insets — not a transform — keep
     the win/confirm overlay resolving against the viewport (no double curtain). */
  left: max(8px, calc((100vw - 1060px) / 2));
  right: max(8px, calc((100vw - 1060px) / 2));
  /* width:auto so left+right define the box (override the base #adaHost width:100%,
     which would otherwise win over `right` and pin the box to full width). */
  width: auto;
  margin-inline: 0;
  z-index: 99999;
  background: transparent;
  overflow: visible;
}
/* Let the host control the game's width during play (lift its 1060 cap); the
   map/interrogation screens still render at 1060 because the host is 1060. */
html.gamePlaying .game {
  max-width: none;
}
/* Hide the landing's decorative hero while the game takes over — it would
   otherwise show through the translucent curtain behind the widened game. */
html.gamePlaying .agendaTitle,
html.gamePlaying .agendaInfo {
  visibility: hidden;
}
