/* ─── intro.css ────────────────────────────────────────────────────────────────
   Boot gate (click-to-enter overlay) and intro sequence (State C commands).
──────────────────────────────────────────────────────────────────────────── */

/* ─── Boot Gate ───────────────────────────────────────────────────────────── */
#boot-gate {
  position: fixed;
  inset: 0;
  z-index: 100;
  background: #000;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  font-family: var(--font);
  transition: opacity 0.5s ease;
}

#boot-gate.boot-gate--out {
  opacity: 0;
  pointer-events: none;
}

#boot-gate-inner { line-height: 2; }

.bg-cmd      { font-size: 13px; color: var(--text-primary); }
.bg-caret    { color: var(--text-dim); }
.bg-cmd-text { color: var(--text-bright); }

.bg-cursor {
  color: var(--text-bright);
  animation: tx-blink 0.9s step-end infinite;
}

.bg-init {
  font-size: 13px;
  color: var(--text-dim);
}

/* ─── Centered Command Sequence (State C — black cutaway) ─────────────────
   z-index 25 — floats above fx-canvas (z=11) and terminal (z=10)
──────────────────────────────────────────────────────────────────────────── */
#intro-seq {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 25;
  font-family: var(--font);
  font-size: 13px;
  line-height: 1.62;
  min-width: 320px;
  max-width: clamp(320px, 42vw, 560px);
  pointer-events: none;
  opacity: 1;
  transition: opacity 0.5s ease;
}

#intro-seq.intro-seq--out { opacity: 0; }

.intro-seq-prompt-line { white-space: pre; }

.intro-seq-prompt { color: var(--text-dim); }
.intro-seq-cmd    { color: var(--text-bright); }

.intro-seq-response {
  color: var(--text-primary);
  white-space: pre;
}

.intro-seq-blank {
  opacity: 0;
  pointer-events: none;
  user-select: none;
}

/* ─── Reduced Motion ─────────────────────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  #boot-gate { transition: none !important; }
  #intro-seq { transition: none !important; }
  .bg-cursor { animation: none !important; }
}