/* Terminal chrome refinements layered after the base/authenticity styles. */
.prompt-line {
  background: var(--blue);
  color: var(--yellow);
}

.prompt-prefix {
  background: var(--blue);
  color: var(--yellow);
}

.command-input,
.command-input:focus,
.command-input:focus-visible {
  --pair-foreground: var(--yellow);
  --pair-background: var(--blue);
  background: var(--blue) !important;
  color: var(--yellow) !important;
  caret-color: transparent !important;
}

.command-input::placeholder {
  color: var(--yellow);
  opacity: 1;
}

/*
 * Colophon is the persistent status utility and is never abbreviated. As lower
 * priority fields disappear, their character-grid tracks are reassigned so the
 * complete label remains right-aligned without clustering the surviving fields.
 */
.status-colophon {
  display: inline-block !important;
}

.status-line[data-status-tier="no-cell"] .status-data-grid {
  grid-column: 2;
}

.status-line[data-status-tier="no-cell"] .status-colophon {
  grid-column: 3 / 5;
}

.status-line[data-status-tier="no-grid"] .status-data-line {
  grid-column: 1 / 3;
}

.status-line[data-status-tier="no-grid"] .status-colophon {
  grid-column: 3 / 5;
}

.status-line[data-status-tier="colophon"] .status-colophon {
  grid-column: 1 / 5;
}

/*
 * EGA-cell command cursor. The row is yellow-on-blue; the active cursor cell
 * uses the exact inverse pair and occupies one complete 8x14 character cell.
 */
.command-cell-cursor {
  position: absolute;
  z-index: 5;
  width: var(--cell-w);
  height: var(--cell-h);
  padding: 0;
  border: 0;
  overflow: hidden;
  pointer-events: none;
  background: var(--yellow);
  color: var(--blue);
  font: inherit;
  line-height: var(--cell-h);
  text-align: left;
  white-space: pre;
  animation: command-cell-cursor-blink 1s steps(1, end) infinite;
}

.command-cell-cursor[hidden] {
  display: none;
}

@keyframes command-cell-cursor-blink {
  0%,
  49% {
    opacity: 1;
  }

  50%,
  100% {
    opacity: 0;
  }
}

@media (prefers-reduced-motion: reduce) {
  .command-cell-cursor {
    animation: none;
  }
}
