/* CRT phosphor + scanlines for lindner.earth */

html, body {
  height: 100%;
  margin: 0;
  padding: 0;
  overflow: hidden;
}

body {
  background-color: var(--crt-bg, #000800);
  position: relative;
}

/* ---- themes (default = dharma green) ---- */
body.theme-dharma {
  --crt-fg: #33ff66;
  --crt-bg: #000800;
  --crt-glow: rgba(51, 255, 102, 0.35);
}
body.theme-matrix {
  --crt-fg: #00ff41;
  --crt-bg: #000000;
  --crt-glow: rgba(0, 255, 65, 0.5);
}
body.theme-amber {
  --crt-fg: #ffb000;
  --crt-bg: #1a0f00;
  --crt-glow: rgba(255, 176, 0, 0.4);
}
body.theme-c64 {
  --crt-fg: #a4a3ff;
  --crt-bg: #3923a3;
  --crt-glow: rgba(164, 163, 255, 0.4);
}

/* ---- terminal styling overrides ---- */
.terminal,
.cmd,
.terminal .terminal-output > div,
.terminal .terminal-output > div div {
  color: var(--crt-fg) !important;
  background-color: var(--crt-bg) !important;
  text-shadow: 0 0 4px var(--crt-glow), 0 0 8px var(--crt-glow);
  font-family: 'Menlo', 'Monaco', 'Courier New', monospace;
}

.cmd .prompt,
.cmd .clipboard {
  color: var(--crt-fg) !important;
}

.cmd .cursor.blink {
  background-color: var(--crt-fg) !important;
  color: var(--crt-bg) !important;
  animation: cursor-blink 1s steps(2) infinite;
}

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

/* ---- scanlines ---- */
body::before {
  content: "";
  position: fixed;
  inset: 0;
  background: linear-gradient(
    transparent 50%,
    rgba(0, 0, 0, 0.28) 50%
  );
  background-size: 100% 4px;
  z-index: 9998;
  pointer-events: none;
}

/* ---- subtle screen flicker ---- */
body::after {
  content: "";
  position: fixed;
  inset: 0;
  background: rgba(255, 255, 255, 0.015);
  z-index: 9999;
  pointer-events: none;
  animation: flicker 0.18s infinite;
}

@keyframes flicker {
  0%   { opacity: 0.27; }
  10%  { opacity: 0.34; }
  20%  { opacity: 0.18; }
  30%  { opacity: 0.40; }
  40%  { opacity: 0.25; }
  50%  { opacity: 0.32; }
  60%  { opacity: 0.43; }
  70%  { opacity: 0.27; }
  80%  { opacity: 0.42; }
  90%  { opacity: 0.21; }
  100% { opacity: 0.32; }
}

/* ---- 108 countdown timer ---- */
#countdown {
  position: fixed;
  top: 24px;
  right: 24px;
  font-family: 'Menlo', 'Monaco', 'Courier New', monospace;
  font-size: 14px;
  letter-spacing: 1px;
  color: var(--crt-fg);
  text-shadow: 0 0 4px var(--crt-glow), 0 0 8px var(--crt-glow);
  z-index: 100;
  user-select: none;
}

#countdown.warning {
  color: #ffaa00;
  text-shadow: 0 0 6px rgba(255, 170, 0, 0.7), 0 0 12px rgba(255, 170, 0, 0.7);
  animation: countdown-pulse 1s infinite;
}

@keyframes countdown-pulse {
  0%, 100% { opacity: 1; }
  50%      { opacity: 0.55; }
}

/* ---- system failure state ---- */
body.system-failure {
  --crt-fg: #ff2233;
  --crt-bg: #1a0000;
  --crt-glow: rgba(255, 34, 51, 0.6);
}

body.system-failure #term {
  animation: glitch 0.12s infinite;
}

body.system-failure #countdown {
  color: #ff2233;
  text-shadow: 0 0 8px rgba(255, 34, 51, 0.85);
  animation: glitch 0.08s infinite;
}

@keyframes glitch {
  0%   { transform: translate(0, 0); }
  20%  { transform: translate(-1px, 1px); }
  40%  { transform: translate(-1px, -1px); }
  60%  { transform: translate(1px, 1px); }
  80%  { transform: translate(1px, -1px); }
  100% { transform: translate(0, 0); }
}

/* ---- terminal sizing ---- */
#term {
  height: 100vh;
  width: 100vw;
  padding: 24px;
  box-sizing: border-box;
}