/* ══════════════════════════════════════════════════════════════════
   Global Realist — Theater Enhancements (shared)
   ──────────────────────────────────────────────────────────────────
   Companion to /assets/js/theater-enhancements.js.
   Covers:
     - Scan-line "arrival" accent for fresh signal/ticker items
     - Tier 3 video slot (iframe + pending state)
     - Tier 4 GR article note styling
     - prefers-reduced-motion global reset
   Tokens (--navy-*, --cyan*, --border*, --text-*) inherited from each
   page's brand system — no new colors introduced here.
   ══════════════════════════════════════════════════════════════════ */

/* ── Scan-line accent on fresh items (Motion Concept 1) ──
   1px cyan sweep across the top border when a [data-fresh="true"]
   element enters the viewport. One-shot, silent, non-interactive.
   Fires only when .gr-scan is added by the IntersectionObserver in
   theater-enhancements.js. Respects reduced-motion preference. */
@keyframes gr-scan-sweep {
  0%   { transform: translateX(-100%); opacity: 0; }
  18%  { opacity: 1; }
  100% { transform: translateX(100%); opacity: 0; }
}
.signal-item[data-fresh="true"],
.gr-signal-item[data-fresh="true"] { position: relative; }
.signal-item[data-fresh="true"]::before,
.gr-signal-item[data-fresh="true"]::before {
  content: "";
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent 0%, var(--cyan) 50%, transparent 100%);
  transform: translateX(-100%);
  opacity: 0;
  pointer-events: none;
}
.signal-item[data-fresh="true"].gr-scan::before,
.gr-signal-item[data-fresh="true"].gr-scan::before {
  animation: gr-scan-sweep 650ms ease-out 1;
}

/* ── Tier 3 video block — publisher panel embed ── */
.source-video-label {
  font-size: 9px;
  font-weight: 600;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--cyan-dim);
  margin-bottom: 8px;
}

/* Pending-state video slot — used while curator hasn't selected a
   specific dated panel. Keeps the 16:9 footprint and links to the
   publisher's official channel so the slot is never decorative-only. */
.source-video--pending {
  display: flex;
  align-items: center;
  justify-content: center;
  padding-bottom: 56.25%;
  position: relative;
  background: linear-gradient(180deg, rgba(74,176,204,0.04) 0%, rgba(10,22,40,0.2) 100%);
  border: 1px solid var(--border);
  text-decoration: none;
  transition: border-color 0.2s, background 0.2s;
}
.source-video--pending:hover {
  border-color: var(--cyan-dim);
  background: linear-gradient(180deg, rgba(74,176,204,0.08) 0%, rgba(10,22,40,0.3) 100%);
}
.source-video-pending-inner {
  position: absolute; inset: 0;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 8px; text-align: center; padding: 16px;
}
.source-video-pending-mark {
  font-size: 28px; color: var(--cyan-dim); line-height: 1;
}
.source-video-pending-label {
  font-family: var(--font-body);
  font-size: 11px; font-weight: 600; letter-spacing: 0.14em;
  text-transform: uppercase; color: var(--text-1);
}
.source-video-pending-sub {
  font-size: 10px; color: var(--text-3); max-width: 48ch; line-height: 1.5;
}

/* ── Tier 4 — GR article note rendered under the title ── */
.source-item-note {
  font-size: 10px;
  color: var(--text-3);
  line-height: 1.55;
  letter-spacing: 0.02em;
  margin-top: 6px;
  max-width: 48ch;
}
.source-item--thesis .source-item-pub { color: var(--cyan); }
.source-item--archive .source-item-pub { color: var(--text-3); letter-spacing: 0.18em; }

/* ── Global reduced-motion respect ──
   Kills decorative animation / transition for users who've opted out.
   Keeps content visible; does not collapse layout. */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
  .signal-track { animation: none !important; }
}
