/* The box is a query container so a line can be set against the width it actually got rather than
   against the viewport: a transcript sits in a split column, and how much of one a phone leaves is
   not what the window is. */
.c-terminal { container-type: inline-size; background: var(--surface-sunken); border: var(--bw) solid var(--line); padding: var(--space-sm) var(--space-md); font-size: var(--text-sm); line-height: var(--lh-code); }
/* A line is one run of inline text and not a row of flex items, so a command too long for the box
   wraps where a shell would wrap it — under itself, the prompt keeping its line — rather than
   breaking between the spans. pre-wrap breaks at the spaces; overflow-wrap breaks the one token
   that has none, a path or a URL or a sha. */
.c-terminal__line { white-space: pre-wrap; overflow-wrap: anywhere; }
.c-terminal__prompt { color: var(--accent); user-select: none; margin-inline-end: 1ch; }
.c-terminal__cmd { color: var(--text-bright); }
.c-terminal__out { color: var(--text-muted); }
.c-terminal__out--good { color: var(--good); }
.c-terminal__out--bad  { color: var(--bad); }
.c-terminal__cursor { display: inline-block; width: 1ch; background: var(--accent); color: var(--accent); animation: gantry-blink var(--blink) step-end infinite; }

/* A transcript whose comments are aligned by spaces written into the output string is aligned for
   one width only; narrower than that, the run of spaces strands a wrapped comment mid-line, so it
   collapses and the comment follows its command directly instead. The query is on the box's
   content width, and 42rem is where the longest line brev's /docs holds stops fitting in it. */
@container (max-width: 42rem) {
  .c-terminal__line { white-space: normal; }
}
