/* $BELIEVE — Task 12: the easter egg pack (Transmission Log Zero + the six
   others). Same HUD-terminal visual language as the rest of the site:
   Space Mono, letter-spaced caps, thin green hairline borders, the
   --believe-* custom properties gate.js bridges off CFG.colors. DOM for all
   three elements below is built/toggled entirely by js/egg.js (#egg-log)
   and js/eggs.js (#egg-flash, #egg-fragment); this file only styles them. */

/* ---- egg 1 (js/egg.js): Transmission Log Zero terminal overlay ----
   Screen-centered by THIS file (owner rider: "the text box should be in
   the middle of the screen instead of up") -- js/egg.js no longer writes
   any inline transform; the old per-frame projection onto the (deleted)
   egg_terminal backing box is gone with the box itself. */

#egg-log {
  position: fixed;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  max-width: min(90vw, 620px);
  padding: 1.4rem 1.6rem;
  border: 1px solid var(--believe-green, #b8d62e);
  background: var(--believe-bg, #050603);
  background: color-mix(in srgb, var(--believe-bg, #050603) 85%, var(--believe-green, #b8d62e));
  /* Recovered-terminal dressing: faint CRT scanlines over the card mix and
     a phosphor halo bleeding into the sub-void. Static (no animation), so
     reduced-motion needs no carve-out. */
  background-image: repeating-linear-gradient(
    0deg,
    rgba(255, 255, 255, 0.025) 0 1px,
    transparent 1px 4px
  );
  box-shadow:
    0 0 36px rgba(184, 214, 46, 0.14),
    inset 0 0 26px rgba(184, 214, 46, 0.05);
  pointer-events: none;
  z-index: 60;
}

#egg-log[hidden] {
  display: none;
}

.egg-log__text {
  margin: 0;
  color: var(--believe-green, #b8d62e);
  font: 0.8rem/1.6 "Space Mono", "Courier New", monospace;
  letter-spacing: 0.02em;
  white-space: pre-wrap;
  /* Phosphor bleed on the recovered transmission -- static glow, no motion. */
  text-shadow: 0 0 9px rgba(184, 214, 46, 0.28);
}

@media (max-width: 480px) {
  #egg-log {
    padding: 1.1rem 1.2rem;
  }
  .egg-log__text {
    font-size: 0.7rem;
  }
}

/* ---- eggs 2/3 (js/eggs.js): flash + fragment overlays ---- */

/* Visually the same radial-gradient recipe as gate.css's own .gate__flash --
   #gate is torn down for good once the gate passes, so egg 2 cannot reuse
   that exact (now-hidden) DOM node; this is a standalone copy of the same
   language on its own element instead. */
#egg-flash {
  position: fixed;
  inset: 0;
  z-index: 90;
  background: radial-gradient(circle at center, #fff, var(--believe-bright, #d4f24b) 55%, transparent 75%);
  opacity: 0;
  pointer-events: none;
}

#egg-flash.is-flashing {
  animation: eggFlash 400ms ease-out;
}

@keyframes eggFlash {
  0% { opacity: 0; }
  35% { opacity: 1; }
  100% { opacity: 0; }
}

#egg-fragment {
  position: fixed;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  max-width: min(80vw, 640px);
  text-align: center;
  font: 700 clamp(1rem, 2.6vw, 1.5rem) / 1.5 "Space Mono", "Courier New", monospace;
  letter-spacing: 0.03em;
  color: var(--believe-bright, #d4f24b);
  text-shadow: 0 0 18px rgba(212, 242, 75, 0.55);
  opacity: 0;
  pointer-events: none;
  z-index: 95;
  transition: opacity 500ms ease;
}

#egg-fragment.is-visible {
  opacity: 1;
}

@media (prefers-reduced-motion: reduce) {
  #egg-flash.is-flashing {
    animation: none !important;
  }
  #egg-fragment {
    transition: none !important;
  }
}