/* ═══════════════════════════════════════════
   terminal.css — scrolling terminal lines (top-right)
═══════════════════════════════════════════ */

.terminal-log {
  position: fixed;
  top: 16px;
  right: 16px;
  z-index: var(--z-terminal);
  display: flex;
  flex-direction: column;
  gap: 3px;
  align-items: flex-end;
  max-width: 420px;
  pointer-events: none;
}

/* ── Single line ── */
.term-line {
  font-family: var(--font-mono);
  font-size: 10.5px;
  padding: 2px 9px;
  border-radius: 2px;
  white-space: nowrap;
  letter-spacing: 0.03em;

  /* Start hidden, JS triggers the class */
  opacity: 0;
  animation: termSlide 0.35s var(--ease-out) forwards;
}

/* Color variants — red / green / blue */
.term-line--a {
  background:  rgba(180, 50,  0, 0.72);
  color:       #ffcc88;
  border-left: 2px solid var(--clr-pink);
}
.term-line--b {
  background:  rgba(0,  90, 40, 0.72);
  color:       #88ffbb;
  border-left: 2px solid var(--clr-green);
}
.term-line--c {
  background:  rgba(20, 20, 90, 0.72);
  color:       #aaccff;
  border-left: 2px solid var(--clr-blue);
}

@keyframes termSlide {
  from { opacity: 0; transform: translateX(20px); }
  to   { opacity: 1; transform: translateX(0);    }
}