/* === Green Terminal Style - monitor.css === */
:root {
  --accent: #39ff14;  /* Terminal green */
  --accent2: #00ff41; /* Alternative green */
  --scan: 6s;
  --glitch: 2.2s;
}

/* Scanline overlay applied from page if not present */
.crt-monitor, .crt-container, .crt-title { position: relative; }
.crt-monitor::after {
  content: ""; position: absolute; inset: 0; pointer-events: none; opacity: .2;
  background: repeating-linear-gradient(0deg, rgba(57,255,20,.05), rgba(57,255,20,.05) 1px, transparent 2px, transparent 4px);
}

/* Glitch layers for headings and panels */
.crt-title.glitch::before, .crt-title.glitch::after { content: attr(data-glitch); position: absolute; inset: 0; pointer-events: none }
.crt-title.glitch::before { color: var(--accent); transform: translate(-1px, 0) }
.crt-title.glitch::after { color: #00ff41; transform: translate(1px, 0) }
.glitch-jitter { animation: jitter var(--glitch) steps(12) infinite }
@keyframes jitter {
  0%, 100% { transform: none }
  10% { transform: skewX(4deg) translateX(1px) }
  20% { transform: skewX(-3deg) translateX(-1px) }
  35% { transform: translateY(1px) }
  55% { transform: skewY(2deg) }
  75% { transform: translateX(2px) }
  90% { transform: skewX(-2deg) }
}

/* Trace and output boxes */
.trace, .core-output, .crt-monitor {
  background: #111 !important;
  border: 1px solid #39ff14;
  border-radius: 10px; position: relative; overflow: hidden;
  box-shadow: 0 6px 24px rgba(0,0,0,.5), inset 0 0 0 1px rgba(57,255,20,.1), 0 0 20px rgba(57,255,20,.3);
}

.trace .line { display: block; white-space: pre-wrap }
.trace .timestamp { color: #39ff14 }
.trace .opcode { color: #00ff41 }
.trace .err { color: #39ff14; text-shadow: 0 0 6px rgba(57,255,20,.6) }

/* AI/system/trace text enforcement */
.trace, .trace *, .ai-text, .system-text, .core-output, .core-output * {
  color: #39ff14 !important;
  font-family: 'IBM Plex Mono', 'Courier New', monospace !important;
}

body, .panel, .chat-panel, .main-panel {
  background: #111 !important;
  color: #39ff14 !important;
  font-family: 'IBM Plex Mono', 'Courier New', monospace !important;
}

/* Word flicker utility */
.flicker { animation: flicker 4s steps(50) infinite alternate }
@keyframes flicker {
  0% { opacity: 1 }
  10% { opacity: .85 }
  20% { opacity: .2 }
  22% { opacity: 1 }
  40% { opacity: .1 }
  45% { opacity: 1 }
  70% { opacity: .2 }
  72% { opacity: 1 }
  100% { opacity: .6 }
}

/* Prompt cursor */
.cursor::after { content: "▊"; margin-left: 2px; animation: blink 1s steps(2) infinite; color: #39ff14 }
@keyframes blink {
  0%, 60% { opacity: 1 }
  60.01%, 100% { opacity: 0 }
}

/* Random hide class (toggled by JS) */
.vanish { opacity: 0; filter: blur(2px) }

/* Minor noise overlay */
.noise { position: absolute; inset: 0; pointer-events: none; opacity: .06; mix-blend-mode: overlay }

/* Additional green terminal styling */
h1, h2, h3, h4, h5, h6 {
  color: #39ff14 !important;
  font-family: 'IBM Plex Mono', 'Courier New', monospace !important;
  text-shadow: 0 0 10px rgba(57,255,20,.5);
}

input, textarea, select, button {
  background: #000 !important;
  border: 1px solid #39ff14 !important;
  color: #39ff14 !important;
  font-family: 'IBM Plex Mono', 'Courier New', monospace !important;
  box-shadow: 0 0 10px rgba(57,255,20,.2);
}

input:focus, textarea:focus, select:focus, button:focus {
  outline: none;
  box-shadow: 0 0 15px rgba(57,255,20,.5);
}

.progress, .progress-bar {
  background: #000 !important;
  border: 1px solid #39ff14 !important;
  color: #39ff14 !important;
}

.inventory, .clue-board {
  background: #111 !important;
  border: 1px solid #39ff14 !important;
  box-shadow: 0 0 15px rgba(57,255,20,.3);
}

.inventory h3, .clue-board h3 {
  color: #39ff14 !important;
  font-weight: bold;
  text-shadow: 0 0 10px rgba(57,255,20,.6);
}

.system-message, .error-message {
  color: #00ff41 !important;
  text-shadow: 0 0 8px rgba(0,255,65,.5);
}

/* End green terminal style */