/* =====================================================================
   Die Liga der Nerds – gemeinsame Terminal-/CRT-Veredelung
   Wird zusätzlich zu den seiteneigenen <style>-Blöcken geladen und
   ergänzt diese (Glow, Scanlines, Hover-Effekte, Mobil-Fixes).
   ===================================================================== */

:root {
  --crt-green: #00ff00;
}

/* Phosphor-Glow auf dem gesamten Bildschirm-Text (klassischer CRT-Look) */
body {
  text-shadow:
    0 0 2px rgba(0, 255, 0, 0.45),
    0 0 6px rgba(0, 255, 0, 0.22);
}

/* Sanfter Scanline-Layer + Vignette über dem gesamten Viewport */
body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 9998;
  pointer-events: none;
  background:
    repeating-linear-gradient(
      rgba(0, 0, 0, 0) 0px,
      rgba(0, 0, 0, 0) 2px,
      rgba(0, 0, 0, 0.16) 3px,
      rgba(0, 0, 0, 0) 4px
    ),
    radial-gradient(ellipse at center, rgba(0, 0, 0, 0) 60%, rgba(0, 0, 0, 0.5) 100%);
}

/* Sehr dezentes Bildschirm-Flackern (für Reduzierte-Bewegung deaktiviert) */
@keyframes crt-flicker {
  0%, 100% { opacity: 1; }
  50%      { opacity: 0.97; }
}
body {
  animation: crt-flicker 4s infinite steps(60);
}

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

/* Links leuchten beim Überfahren stärker */
a {
  transition: text-shadow 0.15s ease;
}
a:hover {
  text-shadow:
    0 0 6px rgba(0, 255, 0, 0.9),
    0 0 14px rgba(0, 255, 0, 0.6);
}

/* Markierter Text im Terminal-Stil */
::selection {
  background: #00ff00;
  color: #000;
  text-shadow: none;
}

/* Themen-passende Scrollbalken (WebKit/Blink) */
::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}
::-webkit-scrollbar-track {
  background: #001100;
}
::-webkit-scrollbar-thumb {
  background: #006600;
  border: 1px solid #00ff00;
}
::-webkit-scrollbar-thumb:hover {
  background: #00aa00;
}
/* Firefox */
html {
  scrollbar-color: #006600 #001100;
}

/* ASCII-Art darf auf schmalen Displays horizontal scrollen statt
   das Layout zu sprengen */
.ascii-art {
  max-width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

@media (max-width: 600px) {
  .ascii-art {
    font-size: 8px;
  }
}

/* Cover-Bilder mit leichtem Glow-Rahmen aufwerten */
img[src^="cover_"] {
  max-width: 100%;
  height: auto;
  box-shadow:
    0 0 10px rgba(0, 255, 0, 0.35),
    0 0 24px rgba(0, 255, 0, 0.15);
}

/* Für Screenreader & Suchmaschinen sichtbar, optisch versteckt */
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
