/* vox-administratus terminal base: shared phosphor hardware look.
   Meant to be lifted into a shared library for Logios, Taktikon and later projects. */

:root {
  --bg: #020904;
  --bg-2: #04120a;
  --phosphor: #3dff83;
  --phosphor-2: #2bd168;
  --dim: #1b7a3f;
  --faint: #0c3a1f;
  --ghost: #082714;
  --hostile: #ffb347;
  --hostile-dim: #8a5c22;
  --alarm: #ff6a4d;
  --glow: 0 0 6px rgba(61, 255, 131, 0.45);
  --font: 'VT323', 'Lucida Console', 'Courier New', monospace;
}

* { box-sizing: border-box; }
[hidden] { display: none !important; }

html, body {
  margin: 0;
  height: 100%;
  background: var(--bg);
  color: var(--phosphor);
  font-family: var(--font);
  font-size: 19px;
  line-height: 1.15;
  text-shadow: var(--glow);
}

body.vox {
  background:
    radial-gradient(ellipse at center, rgba(20, 70, 40, 0.18) 0%, rgba(0, 0, 0, 0) 70%),
    var(--bg);
}

/* Scanlines and a faint flicker over everything. */
body.vox::after {
  content: '';
  position: fixed;
  inset: 0;
  pointer-events: none;
  background: repeating-linear-gradient(to bottom, rgba(0, 0, 0, 0.22) 0, rgba(0, 0, 0, 0.22) 1px, transparent 2px, transparent 3px);
  animation: vox-flicker 6s infinite steps(1);
  z-index: 50;
}

@keyframes vox-flicker {
  0%, 100% { opacity: 1; }
  47% { opacity: 0.92; }
  48% { opacity: 1; }
  83% { opacity: 0.95; }
}

.btn {
  font-family: var(--font);
  font-size: 18px;
  color: var(--phosphor);
  background: transparent;
  border: 1px solid var(--dim);
  padding: 2px 10px;
  cursor: pointer;
  text-shadow: var(--glow);
}
.btn:hover, .btn:focus-visible { border-color: var(--phosphor); background: var(--ghost); outline: none; }
.btn:active { background: var(--faint); }

.panel-title {
  color: var(--dim);
  letter-spacing: 0.08em;
  font-size: 17px;
  border-bottom: 1px solid var(--faint);
  padding: 2px 0;
  margin-bottom: 4px;
}

/* Boot sequence */
.boot {
  position: fixed;
  inset: 0;
  padding: 32px clamp(16px, 6vw, 80px);
  white-space: pre-wrap;
  font-size: 21px;
  z-index: 40;
  background: var(--bg);
  cursor: pointer;
}
.boot .cursor { animation: vox-blink 0.9s infinite steps(1); }
.boot .skip { color: var(--dim); position: fixed; right: 20px; bottom: 16px; font-size: 17px; }

@keyframes vox-blink { 50% { opacity: 0; } }

@media (prefers-reduced-motion: reduce) {
  body.vox::after { animation: none; }
}