:root {
  --bg: #000000;
  --text: #1fb83a;        /* phosphor green, base */
  --bright: #2bff52;      /* bright green */
  --dim: #0c5a1d;         /* dark green */
  --font: ui-monospace, "DejaVu Sans Mono", "Liberation Mono", Menlo, Consolas, monospace;
}

* { box-sizing: border-box; margin: 0; padding: 0; }

html, body {
  height: 100%;
  background: var(--bg);
  color: var(--text);
  font-family: var(--font);
  font-size: 14px;
  line-height: 1.4;
  overflow: hidden;
}

/* faint scanlines only — no bloom, no vignette */
body::after {
  content: '';
  position: fixed; inset: 0; pointer-events: none; z-index: 3;
  background: repeating-linear-gradient(to bottom,
    rgba(0,0,0,0) 0, rgba(0,0,0,0) 3px, rgba(0,0,0,0.25) 3px, rgba(0,0,0,0.25) 4px);
  opacity: .35;
}

#term {
  height: 100vh; width: 100%;
  display: flex; flex-direction: column;
  padding: 10px 14px;
}

.bar {
  display: flex; gap: 14px;
  padding-bottom: 8px; border-bottom: 1px solid var(--dim);
  font-size: 12px; color: var(--dim);
}
.bar b { color: var(--text); font-weight: 400; }
.bar .spacer { flex: 1; }

#screen {
  flex: 1; overflow-y: auto; padding: 12px 0 4px;
  scrollbar-width: thin; scrollbar-color: var(--dim) transparent;
}
#screen::-webkit-scrollbar { width: 5px; }
#screen::-webkit-scrollbar-thumb { background: var(--dim); }

.line { white-space: pre-wrap; word-break: break-word; }
.banner { color: var(--bright); font-size: 11px; line-height: 1.15; }

/* everything stays in the green; only brightness differs */
.acc, .ok, .warn { color: var(--bright); }
.dim { color: var(--dim); }
.ghost { color: var(--text); }
.ghost::before { content: ''; }
.cursor-dim { color: var(--dim); animation: blink 1s steps(2) infinite; }

#inputline { display: flex; align-items: center; gap: 8px; padding: 6px 0 14px; }
#prompt { color: var(--text); white-space: nowrap; }
#prompt .p { color: var(--dim); }
#cmd {
  flex: 1; background: transparent; border: none; outline: none;
  color: var(--bright); font-family: var(--font); font-size: 14px; caret-color: var(--bright);
}
#cmd:disabled { opacity: .5; }
.cursor {
  display: inline-block; width: 8px; height: 15px; background: var(--bright);
  animation: blink 1s steps(2) infinite; vertical-align: -2px;
}
@keyframes blink { 50% { opacity: 0; } }

@media (max-width: 560px) { .banner { font-size: 7px; } }
