/* ============================================================
   DAS TERMINAL — kernel.terminaltribune.info
   DESIGN: portiert aus Phils maske-dummy-v3.html (TIE-Terminal
   Blueprint, abgenommen 2026-07-05) — Werkstatt-Schrankwand.
   ENGINE dahinter: unsere modularen kernel-*.js.
   Unten „FUNKTIONS-ERGÄNZUNGEN" = das, was die Engine zum Leben
   braucht (Terminal-Ausgabe, Kim-Bubbles, CCTV-Bild, Graph, Relais).
   ============================================================ */

@font-face { font-family: 'VT323'; src: url('fonts/vt323.woff2') format('woff2'); font-display: swap; }

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

:root {
  --green:       #33ff66;
  --green-dim:   rgba(51,255,102,.5);
  --amber:       #ffb63d;
  --amber-hell:  #ffd28a;
  --amber-dim:   rgba(255,182,61,.5);
  --tube-green:  #04120a;
  --tube-amber:  #140c03;
  --holz:        #100d09;
  --fach:        #0b0906;
  --blech:       #201c15;
  --blech-hell:  #2e2920;
  --bezel:       #4a443a;
  --bezel-dkl:   #35302a;
}

html, body { height: 100%; background: #000; overflow: hidden; }
body { font-family: 'VT323', ui-monospace, Menlo, 'Courier New', monospace; }

#stage {
  position: absolute; top: 50%; left: 50%;
  width: 1920px; height: 1080px;
  transform-origin: center center;
  background: var(--holz);
}
#stage::after {
  content: ''; position: absolute; inset: 0; pointer-events: none; z-index: 45;
  background: radial-gradient(ellipse 900px 640px at 50% 40%,
    rgba(255,182,61,.10) 0%, rgba(255,182,61,.04) 45%, transparent 70%);
}

/* ── Schrankwand ─────────────────────────────────────────────── */
.fach {
  position: absolute; background: var(--fach);
  box-shadow: inset 0 0 26px rgba(0,0,0,.9), inset 0 2px 0 rgba(255,255,255,.03);
  border: 1px solid #060504;
}
.brett {
  position: absolute; height: 10px; background:
    linear-gradient(180deg, #221d15 0%, #0d0b07 60%, #050403 100%);
  box-shadow: 0 4px 10px rgba(0,0,0,.8); z-index: 8;
}
.steher {
  position: absolute; width: 12px; background:
    linear-gradient(90deg, #050403, #1c1811 45%, #050403);
  z-index: 8;
}

/* ── CRT-Module ──────────────────────────────────────────────── */
.mon {
  position: absolute; z-index: 10;
  background: linear-gradient(165deg, var(--blech-hell), var(--blech) 55%, #15120c);
  border-radius: 8px; padding: 10px;
  box-shadow: 0 6px 18px rgba(0,0,0,.7), inset 0 1px 0 rgba(255,255,255,.05);
  cursor: pointer; transition: box-shadow .25s ease;
}
.mon .tube {
  position: relative; height: 100%; overflow: hidden;
  border-radius: 10px / 13px;
  box-shadow: inset 0 0 30px rgba(0,0,0,.92);
}
.mon.green .tube { background: radial-gradient(ellipse at 50% 44%, #07240f 0%, var(--tube-green) 78%); color: var(--green); text-shadow: 0 0 6px var(--green-dim); }
.mon.amber .tube { background: radial-gradient(ellipse at 50% 44%, #241503 0%, var(--tube-amber) 78%); color: var(--amber); text-shadow: 0 0 6px var(--amber-dim); }

.tube::before {
  content: ''; position: absolute; inset: 0; pointer-events: none; z-index: 4;
  background: repeating-linear-gradient(0deg,
    rgba(0,0,0,.3) 0px, rgba(0,0,0,.3) 1px, transparent 2px, transparent 4px);
}
.tube::after {
  content: ''; position: absolute; inset: 0; pointer-events: none; z-index: 5;
  background: radial-gradient(ellipse at 50% 46%, transparent 52%, rgba(0,0,0,.6) 100%);
  animation: flicker 5s infinite;
}
body.calm .tube::after { animation: none; }
@keyframes flicker {
  0%,100% { opacity: 1; } 91% { opacity: 1; }
  92% { opacity: .87; } 93% { opacity: 1; } 96.5% { opacity: .94; } 97.5% { opacity: 1; }
}

.screen { position: relative; z-index: 2; height: 100%; padding: 10px 12px; overflow: hidden; }
.mon-head {
  display: flex; justify-content: space-between; align-items: baseline;
  font-size: 12px; letter-spacing: .2em; text-transform: uppercase;
  opacity: .8; border-bottom: 1px solid currentColor; padding-bottom: 3px; margin-bottom: 7px;
}
.mon-head .kenn { font-size: 14px; font-weight: bold; }

.mon.fokus, #haupt.fokus, #radio.fokus {
  box-shadow: 0 6px 22px rgba(0,0,0,.8), 0 0 38px -4px currentColor; z-index: 50;
}

/* ══ HAUPT-CRT: TERMINAL ═════════════════════════════════════ */
#haupt {
  position: absolute; left: 556px; top: 96px; width: 808px; height: 640px; z-index: 20;
  background:
    linear-gradient(150deg, #5a5348 0%, var(--bezel) 30%, var(--bezel-dkl) 75%, #211d17 100%);
  border-radius: 26px;
  padding: 34px 38px 46px;
  box-shadow: 0 26px 60px rgba(0,0,0,.85), inset 0 2px 0 rgba(255,255,255,.1),
    inset 0 -6px 14px rgba(0,0,0,.5);
  cursor: pointer; color: var(--amber);
}
#haupt .tube {
  position: relative; height: 100%; overflow: hidden;
  border-radius: 26px / 34px;
  background: radial-gradient(ellipse at 50% 42%, #2a1a05 0%, var(--tube-amber) 80%);
  color: var(--amber-hell); text-shadow: 0 0 8px var(--amber-dim), 0 0 2px var(--amber);
  box-shadow: inset 0 0 60px rgba(0,0,0,.95), inset 0 0 10px rgba(0,0,0,.8);
}
/* #607: KEINE Scanlines auf der Hauptkonsole (Lesbarkeit, Phil-Abnahme
   Blueprint v4 2026-07-07) — kleine Monitore behalten sie als Deko. */
#haupt .tube::before { content: none; }
#haupt .tube::after {
  content: ''; position: absolute; inset: 0; pointer-events: none; z-index: 5;
  background:
    radial-gradient(ellipse 260px 130px at 32% 12%, rgba(255,255,255,.07), transparent 65%),
    radial-gradient(ellipse at 50% 46%, transparent 50%, rgba(0,0,0,.62) 100%);
  animation: flicker 4.3s infinite;
}
body.calm #haupt .tube::after { animation: none; }
#haupt .tube.degauss { animation: degauss .6s ease-out; }
@keyframes degauss {
  0%{transform:scale(1) skewX(0);filter:brightness(1)}
  14%{transform:scale(1.012,.988) skewX(.6deg);filter:brightness(1.5)}
  40%{transform:scale(.994,1.006) skewX(-.45deg);filter:brightness(.92)}
  100%{transform:scale(1) skewX(0);filter:brightness(1)}
}
#haupt .tube.poweron { animation: poweron .85s cubic-bezier(.2,.8,.3,1); }
@keyframes poweron {
  0%{transform:scale(.7,.006);filter:brightness(6)}
  60%{transform:scale(1,1.03);filter:brightness(2)}
  100%{transform:scale(1);filter:brightness(1)}
}
#haupt .screen { padding: 16px 24px; font-size: 17px; display: flex; flex-direction: column; }
#haupt .mon-head { font-size: 14px; flex: none; }
#haupt .plakette {
  position: absolute; bottom: 14px; left: 50%; transform: translateX(-50%);
  font-size: 12px; letter-spacing: .34em; color: #8d8271; text-transform: uppercase; z-index: 3;
}
#haupt .schraube { position: absolute; width: 10px; height: 10px; border-radius: 50%;
  background: radial-gradient(circle at 35% 30%, #6e675a, #26221b 70%);
  box-shadow: inset 0 -1px 2px rgba(0,0,0,.8); z-index: 3; }
#haupt .s1 { top: 12px; left: 14px; } #haupt .s2 { top: 12px; right: 14px; }
#haupt .s3 { bottom: 12px; left: 14px; } #haupt .s4 { bottom: 12px; right: 14px; }
#haupt canvas#fx { position: absolute; inset: 0; z-index: 6; pointer-events: none; }

/* ── KONTEXT: breiter CRT am Pult ─────────── */
/* Kontext-Pult exakt unter der Hauptkonsole (#haupt 556/808) — gleiche Achse (Mitte 960)
   + gleiche Abstände zu den Seitenmonitoren; vorher 520/880 → berührte links die DETEKTEI. */
#mon-kontext { left: 556px; top: 756px; width: 808px; height: 276px; z-index: 22; }
#mon-kontext .screen { display: flex; flex-direction: column; }

/* ── RADIO-Gerät (Phil, bleibt Gerät) ── */
#radio {
  position: absolute; left: 1420px; top: 574px; width: 482px; height: 204px; z-index: 10;
  background: linear-gradient(170deg, var(--blech-hell), var(--blech) 60%, #14110b);
  border-radius: 6px; cursor: pointer;
  box-shadow: 0 6px 16px rgba(0,0,0,.7), inset 0 1px 0 rgba(255,255,255,.06);
  color: var(--amber);
}
#radio .grill {
  position: absolute; left: 14px; top: 14px; width: 130px; height: 176px; border-radius: 4px;
  background:
    radial-gradient(circle, rgba(0,0,0,.6) 1.6px, transparent 2px) 0 0 / 9px 9px,
    linear-gradient(170deg, #2b261e, #1c1812);
  box-shadow: inset 0 0 12px rgba(0,0,0,.7);
}
#radio .anzeige {
  position: absolute; left: 158px; top: 14px; right: 88px; height: 64px;
  background: radial-gradient(ellipse at 50% 40%, #241503 0%, var(--tube-amber) 85%);
  border-radius: 4px; padding: 8px 12px;
  color: var(--amber); text-shadow: 0 0 6px var(--amber-dim);
  font-size: 14px; line-height: 1.4; box-shadow: inset 0 0 16px rgba(0,0,0,.9); overflow: hidden;
}
#radio .anzeige .sender { white-space: nowrap; }
#radio .skala {
  position: absolute; left: 158px; top: 88px; right: 88px; height: 24px;
  background: linear-gradient(180deg, #17130c, #0d0a06);
  border-radius: 3px; box-shadow: inset 0 0 8px rgba(0,0,0,.8); overflow: hidden;
}
#radio .skala i { position: absolute; top: 0; bottom: 0; width: 1px; background: rgba(255,182,61,.35); }
#radio .skala .nadel { width: 2px; background: var(--amber); left: 62%; box-shadow: 0 0 8px var(--amber-dim); }
/* Play/Stop-Tasten (#609) — Geräte-Metapher: gefräste Drucktasten */
#radio .tasten { position: absolute; left: 158px; bottom: 14px; width: 116px; height: 40px; display: flex; gap: 8px; }
#radio .taste {
  flex: 1; border-radius: 4px; border: 1px solid #14110b; cursor: pointer;
  background: linear-gradient(180deg, #57503f, #2c2820 70%);
  box-shadow: 0 3px 6px rgba(0,0,0,.7), inset 0 1px 0 rgba(255,255,255,.15);
  font-family: inherit; font-size: 15px; color: var(--amber);
  text-shadow: 0 0 5px var(--amber-dim);
}
#radio .taste.an { box-shadow: inset 0 2px 6px rgba(0,0,0,.8);
  background: linear-gradient(180deg, #3a352a, #241f18 70%); }
#radio .vu { position: absolute; left: 288px; bottom: 14px; right: 88px; height: 40px; display: flex; gap: 3px; align-items: flex-end; }
#radio .vu i { flex: 1; background: var(--amber); opacity: .75; transform-origin: bottom; animation: vu .9s ease-in-out infinite; box-shadow: 0 0 5px var(--amber-dim); }
#radio.aus .vu i { animation-play-state: paused; transform: scaleY(.16); }
body.calm #radio .vu i { animation: none; transform: scaleY(.5); }
@keyframes vu { 0%,100% { transform: scaleY(.3); } 50% { transform: scaleY(1); } }
#radio .regler { position: absolute; right: 16px; top: 14px; width: 56px; text-align: center; }
#radio .knopf {
  width: 44px; height: 44px; border-radius: 50%; margin: 0 auto 2px; cursor: pointer;
  background: radial-gradient(circle at 36% 30%, #6e675a, #2b2721 65%, #1a1712);
  box-shadow: 0 3px 8px rgba(0,0,0,.7), inset 0 1px 0 rgba(255,255,255,.15); position: relative;
  transition: transform .2s ease;
}
#radio .knopf-label { font-size: 10px; letter-spacing: .2em; color: #8d8271;
  text-transform: uppercase; margin-bottom: 9px; }
#radio .knopf::after { content: ''; position: absolute; top: 4px; left: 50%; width: 3px; height: 12px;
  background: var(--amber); transform: translateX(-50%); box-shadow: 0 0 5px var(--amber-dim); }
#radio .knopf.k2::after { transform: translateX(-50%) rotate(0deg); transform-origin: 50% 18px; }
#radio .knopf.k2 { transform: rotate(64deg); }
#radio .plate { position: absolute; bottom: 4px; left: 16px; font-size: 10px; letter-spacing: .18em; color: #55503f; text-transform: uppercase; }

/* ── Modul-Positionen ──────────────────────────── */
#fach-links   { left: 0;      top: 0;     width: 540px;  height: 1042px; }
#fach-mitte   { left: 540px;  top: 0;     width: 860px;  height: 1042px; background: #090705; }
#fach-rechts  { left: 1400px; top: 0;     width: 520px;  height: 1042px; }
#brett-l1 { left: 0; top: 470px; width: 540px; }
#brett-l2 { left: 0; top: 762px; width: 540px; }
/* Blueprint v4 (#610): rechte Spalte = Spiegel / Börse klein / Radio / Kim */
#brett-r1 { left: 1400px; top: 370px; width: 520px; }
#brett-r2 { left: 1400px; top: 556px; width: 520px; }
#brett-r3 { left: 1400px; top: 786px; width: 520px; }
#brett-m1 { left: 540px; top: 78px; width: 860px; }
#steher-1 { left: 534px; top: 0; height: 1042px; }
#steher-2 { left: 1394px; top: 0; height: 1042px; }

/* Tausch (Phil 2026-07-07): Globus-Spiegel groß links oben, Netz-Graph rechts oben */
#mon-spiegel  { left: 20px;  top: 22px;  width: 500px; height: 428px; }
#mon-sacra    { left: 20px;  top: 496px; width: 244px; height: 246px; }
#mon-cctv     { left: 288px; top: 496px; width: 232px; height: 246px; }
#mon-kosmos   { left: 20px;  top: 788px; width: 244px; height: 242px; }
#mon-detektei { left: 288px; top: 788px; width: 232px; height: 242px; }
#mon-globus   { left: 1420px; top: 22px;  width: 482px; height: 336px; }
#mon-boerse   { left: 1420px; top: 388px; width: 482px; height: 156px; }
#mon-kim      { left: 1420px; top: 804px; width: 482px; height: 220px; }
#mon-wire { left: 556px; top: 8px; width: 808px; height: 64px; }
#mon-wire .tube { border-radius: 6px; }
#mon-wire .screen { padding: 6px 12px; }
#mon-wire .mon-head { display: none; }

/* ── Hauptkonsole ⇄ Kim: Umschaltknopf + Positions-Tausch (#622) ───────
   Der große Mittel-CRT (#haupt, amber) und Kims Fenster (#mon-kim, grün)
   tauschen per .kim-gross auf #stage ihre Geometrie. Beide bleiben voll
   bespielt — Terminal-out/cmdrow bzw. Kim-Chat laufen unverändert weiter,
   nur die Position/Größe wechselt (amber↔grün, groß↔klein). */
/* Physischer Umschaltknopf am Gehäuse-Bezel (unten rechts, nicht in der
   Röhre) — gleiche Machart wie die Radio-Tasten. Sitzt am #haupt und
   wandert mit dem Terminal, bleibt also auch im Kim-Groß-Modus greifbar. */
#haupt .mon-switch {
  position: absolute; bottom: 12px; right: 34px; z-index: 4;
  display: flex; align-items: center; gap: 7px;
  padding: 6px 14px; cursor: pointer;
  font-family: inherit; font-size: 12px; letter-spacing: .18em; text-transform: uppercase;
  color: var(--amber); text-shadow: 0 0 5px var(--amber-dim);
  border: 1px solid #14110b; border-radius: 5px;
  background: linear-gradient(180deg, #57503f, #2c2820 70%);
  box-shadow: 0 3px 6px rgba(0,0,0,.7), inset 0 1px 0 rgba(255,255,255,.15);
  transition: transform .12s ease, box-shadow .12s ease;
}
#haupt .mon-switch:hover {
  box-shadow: 0 3px 10px rgba(0,0,0,.7), inset 0 1px 0 rgba(255,255,255,.22), 0 0 10px var(--amber-dim);
}
#haupt .mon-switch:active { transform: translateY(1px); box-shadow: inset 0 2px 6px rgba(0,0,0,.8); }
#haupt .mon-switch .sw-led {
  width: 8px; height: 8px; border-radius: 50%; flex: none;
  background: radial-gradient(circle at 35% 30%, #ffd27a, var(--amber) 60%, #7a4a08);
  box-shadow: 0 0 6px var(--amber);
}
#haupt .mon-switch .sw-txt::before { content: '⇄ '; opacity: .8; }

/* Getauschte Geometrie: Kim wird groß, Terminal schrumpft in Kims Ecke */
#stage.kim-gross #mon-kim {
  left: 556px; top: 96px; width: 808px; height: 640px; z-index: 21;
}
#stage.kim-gross #haupt {
  left: 1420px; top: 804px; width: 482px; height: 220px; z-index: 20;
  padding: 14px 16px 18px; border-radius: 14px;
}
/* Kim groß: Chat + Kopf lesbar hochskalieren */
#stage.kim-gross #mon-kim .kim-log { font-size: 16px; gap: 8px; }
#stage.kim-gross #mon-kim .kim-input-row input { font-size: 15px; }
/* Terminal klein: Schrauben/Plakette weg (kein Platz), Text kompakter */
#stage.kim-gross #haupt .schraube,
#stage.kim-gross #haupt .plakette { display: none; }
#stage.kim-gross #haupt .screen { padding: 8px 12px; font-size: 13px; }
#stage.kim-gross #haupt .mon-switch { bottom: 5px; right: 12px; padding: 4px 10px; font-size: 10px; letter-spacing: .1em; }
#stage.kim-gross #haupt .term-prompt-row { font-size: 14px; padding-top: 5px; }

/* ── Statusleiste ────────────────────────── */
#statusleiste {
  position: absolute; left: 0; right: 0; bottom: 0; height: 38px;
  background: linear-gradient(180deg, #131009, #080604);
  border-top: 1px solid #2c261c;
  display: flex; align-items: center; gap: 26px; padding: 0 22px;
  font-size: 14px; color: var(--amber); text-shadow: 0 0 5px var(--amber-dim);
  z-index: 60; overflow: hidden;
}
#statusleiste .gruen { color: var(--green); text-shadow: 0 0 5px var(--green-dim); }
#statusleiste .led-row { display: flex; gap: 9px; align-items: center; }
#statusleiste .led-row i { width: 9px; height: 9px; border-radius: 50%; background: #4a3a10; box-shadow: inset 0 1px 2px rgba(0,0,0,.6); display: inline-block; }
#statusleiste .led-row i.on  { background: #2fbf5a; box-shadow: 0 0 7px #2fbf5a; }
#statusleiste .led-row i.off { background: #b03030; box-shadow: 0 0 7px #b03030; }
#statusleiste .led-row i.warn{ background: #d99a2a; box-shadow: 0 0 7px #d99a2a; }
/* Werte des eigenen Rechners — nur in der Desktop-Hülle belegt (§6.2). Leer
   nimmt der Span dank flex keinen Platz, im Browser fehlt also nichts. */
#st-maschine { white-space: nowrap; font-variant-numeric: tabular-nums; opacity: .85; }

#patron-ticker { flex: 1; overflow: hidden; white-space: nowrap; opacity: .75; }
#patron-ticker span { display: inline-block; padding-left: 100%; animation: ticker 28s linear infinite; }
body.calm #patron-ticker span { animation: none; }
@keyframes ticker { to { transform: translateX(-100%); } }

/* ============================================================
   FUNKTIONS-ERGÄNZUNGEN (Engine-Bedarf) — unaufdringlich
   ============================================================ */

/* Monitor-Inhalt füllt die Röhre. KEIN Scrollen in den Fächern (Phil
   2026-07-07): echte Geräte scrollen nicht — die Anzeigen ROTIEREN
   (Rotations-Ticker in kernel-monitors.js). Nur Haupt-CRT-.out und
   Kim-Log behalten Scroll (eigene Regeln). */
.mon .screen { display: flex; flex-direction: column; }
.mon-body { flex: 1; min-height: 0; overflow: hidden; }
/* Fach-Monitore zeigen feste Tabellen/Charts (Börse, Detektei, Braille) —
   NIE umbrechen, sonst zerreißt die Spaltenausrichtung. */
.mon-body pre { font-family: inherit; white-space: pre; font-size: 13px; line-height: 1.5; }
/* Seitenwechsel der rotierenden Anzeigen: kurzes Aufblenden wie ein
   Röhren-Refresh — dezent, lesbar bleibt alles. */
.rot-page { animation: rotfade .35s ease; }
body.calm .rot-page { animation: none; }
@keyframes rotfade { from { opacity: .15; } to { opacity: 1; } }
.dim { opacity: .55; }
.bright { color: #fff; }
.ok { color: #8dffb0; }
.err { color: #ff7a7a; }
.rv { background: currentColor; color: #0a0a0a; text-shadow: none; }

/* Terminal-Ausgabe im Haupt-CRT — scrollt (REPL), aber ohne sichtbaren
   Balken: eine Röhre hat keine Scrollbar (Phil 2026-07-07) */
#haupt .out { flex: 1; min-height: 0; overflow: auto; padding-top: 8px; scrollbar-width: none; }
#haupt .out::-webkit-scrollbar { display: none; }
#haupt .out pre { font-family: inherit; white-space: pre-wrap; word-break: break-word; margin-bottom: 1px; }
#haupt .out .block { }
#haupt .out .row { padding: 0 4px; cursor: pointer; }
#haupt .out .row:hover { background: rgba(255,182,61,.14); }
#haupt .out .row.sel { background: var(--amber); color: #0a0a0a; text-shadow: none; }
#haupt .out .art-body { max-width: 72ch; }
#haupt .out .art-body p { margin: 0 0 .6em; text-align: justify; }
#haupt .out .ascii-img { font-size: .55em; line-height: .62em; opacity: .9; }
#haupt .term-prompt-row { flex: none; margin-top: 6px; border-top: 1px solid currentColor; padding-top: 8px; font-size: 19px; }
#haupt .prompt { opacity: .9; }
#cmdtext { white-space: pre; }
#cursor { display: inline-block; width: 10px; height: 18px; background: currentColor; vertical-align: text-bottom; animation: blink 1.1s steps(1) infinite; }
body.calm #cursor { animation: none; }
@keyframes blink { 50% { opacity: 0; } }
#term-log-fokus { opacity: .5; }

/* DIE SPUR: Brotkrumen-Zeile über dem Prompt (klickbar → FÄHRTE) */
#spur-zeile { flex: none; font-size: 12.5px; letter-spacing: .06em; opacity: .55;
  border-top: 1px dashed currentColor; padding: 3px 4px 0; margin-top: 4px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; cursor: pointer; }
#spur-zeile:hover { opacity: .85; }
/* bereits besuchte Station in der VERWANDTE-Liste */
.row.spur-kalt { opacity: .45; }

/* N · NETZ = Beziehungsnetz-Graph (links oben, v4) */
#mon-globus .screen { display: flex; flex-direction: column; }
.graph-host { flex: 1; min-height: 0; position: relative; }

/* G · GLOBUS-SPIEGEL (rechts oben, v4) — Relais-Fach, solange der
   iframe-Spiegel nicht entschieden ist (#588); Kopplung + Fokus-Anzeige */
#mon-spiegel .screen { display: flex; flex-direction: column; }
/* G · N·S·A — native Dot-Matrix-Weltkarte (kernel-nsa.js) */
.nsa-host { flex: 1; min-height: 0; position: relative; }
.nsa-host canvas { position: absolute; inset: 0; width: 100%; height: 100%; display: block; cursor: crosshair; }
/* Planetar-Button (oben rechts im Kartenbild) — zurück auf den ganzen Globus.
   Mausrad über der Karte zoomt rein/raus. */
.nsa-welt { position: absolute; top: 6px; right: 6px; z-index: 2; font-family: inherit; font-size: 11px;
  letter-spacing: .08em; color: var(--green); background: rgba(8,22,13,.72); border: 1px solid #2f6a42;
  border-radius: 4px; padding: 2px 7px; cursor: pointer; }
.nsa-welt:hover { color: #fff; border-color: #4f9a68; }
.nsa-fuss { flex: none; display: flex; align-items: center; gap: 8px; padding-top: 4px; }
.nsa-fuss #nsa-fuss-txt { flex: 1; min-width: 0; font-size: 11px; letter-spacing: .03em; color: var(--green);
  opacity: .82; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-shadow: 0 0 5px var(--green-dim); }
.mon-head .g-status { font-size: 11px; opacity: .7; letter-spacing: .12em; }
/* ATLAS-KOPPELN-Button (bewusst erhalten: einziger Klick-Weg zum Zweitfenster,
   pulst wenn Kim die Kopplung anfordert) */
.koppel-btn { flex: none; font-family: inherit; font-size: 11px; letter-spacing: .08em;
  background: linear-gradient(160deg,#123a20,#08160d); color: var(--green); border: 1px solid #2f6a42;
  border-radius: 4px; padding: 2px 8px; cursor: pointer; white-space: nowrap; }
.koppel-btn:hover { color: #fff; border-color: #4f9a68; }
.koppel-btn.pulse { animation: koppel 1.3s ease-in-out infinite; }
body.calm .koppel-btn.pulse { animation: none; }
@keyframes koppel { 50% { box-shadow: 0 0 12px var(--green-dim); } }
/* NSA VOLL — Lagetisch im Haupt-CRT */
.nsa-voll { display: flex; gap: 14px; height: 100%; min-height: 520px; }
.nsa-voll-karte { flex: 1; position: relative; min-height: 520px; }
.nsa-voll-karte canvas { position: absolute; inset: 0; width: 100%; height: 100%; cursor: crosshair; }
.nsa-voll-liste { width: 232px; flex: none; overflow-y: auto; font-size: 12px; line-height: 1.55; }
.nsa-voll-liste .row { cursor: pointer; padding: 1px 0; }
.nsa-voll-liste .row:hover { color: #fff; }

/* SACRA / KOSMOS */
.sacra-gauge { font-size: 22px; margin: 2px 0 5px; }
.sacra-line { font-size: 12.5px; line-height: 1.45; }

/* Fach-Monitore im v4-Dummy-Stil (Phil 2026-07-07): luftige Zeilen statt
   pre-Tabellen — Werte rechtsbündig, Zeitstempel gedimmt, Akzente bright */
.mon-zeilen { font-size: 13px; line-height: 1.7; }
.mon-zeilen .t { opacity: .6; margin-right: 5px; }
.mon-zeilen b { float: right; font-weight: normal; }
.mon-zeilen .minus { opacity: .5; }
.mon-zeilen .warn { animation: led 2.2s steps(1) infinite; }
.mon-spark { font-size: 11px; opacity: .6; letter-spacing: 1px; margin-top: 4px; white-space: nowrap; overflow: hidden; }
/* B · Börse: v4-Dummy zeigt 3 kompaktere Zeilen (156px-Fach) */
#mon-boerse .mon-zeilen { line-height: 1.55; }
.mon-fuss { font-size: 11.5px; opacity: .55; margin-top: 4px; }

/* CCTV-Bild */
#mon-cctv .mon-head .rec { color: #ff5050; display: none; }
#mon-cctv .mon-head .rec.on { display: inline; animation: led 1.6s steps(1) infinite; }
@keyframes led { 50% { opacity: .25; } }
.cctv-shot { width: 100%; border-radius: 3px; display: block; background: #000; }
.cctv-quelle { font-size: 11.5px; opacity: .7; margin-top: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
/* Ohne Signal: Röhren-Rauschen wie im v4-Dummy — der Monitor lebt,
   auch wenn keine Kamera gewählt ist */
.cctv-leer { position: relative; height: calc(100% - 20px); border: 1px solid currentColor; overflow: hidden; opacity: .9; }
.cctv-leer .rauschen { position: absolute; inset: 0;
  background:
    repeating-linear-gradient(0deg, rgba(51,255,102,.06) 0 2px, transparent 2px 4px),
    repeating-linear-gradient(90deg, rgba(0,0,0,.25) 0 1px, transparent 1px 3px);
  animation: rauschjitter .35s steps(2) infinite; }
body.calm .cctv-leer .rauschen { animation: none; }
@keyframes rauschjitter { 50% { transform: translateY(1px); opacity: .85; } }
.cctv-leer .kein-signal { position: absolute; left: 0; right: 0; top: 42%; text-align: center;
  font-size: 12px; letter-spacing: .3em; opacity: .75; animation: led 2.4s steps(1) infinite; }
.cctv-leer .cam-ts { position: absolute; bottom: 4px; right: 8px; font-size: 11px; opacity: .8; }

/* Kim-Bubbles */
#mon-kim .screen { display: flex; flex-direction: column; }
.kim-log { flex: 1; min-height: 0; overflow: auto; scrollbar-width: none; display: flex; flex-direction: column; gap: 5px; font-size: 13.5px; }
.kim-log::-webkit-scrollbar { display: none; }
.kim-msg { padding: 3px 7px; border-radius: 7px; max-width: 94%; white-space: pre-wrap; word-break: break-word; }
.kim-msg.user { align-self: flex-end; background: rgba(51,255,102,.16); }
.kim-msg.kim { align-self: flex-start; background: rgba(51,255,102,.07); }
.kim-msg a { color: var(--green); }
.kim-quellen { margin-top: 2px; font-size: 11px; opacity: .7; }
.kim-tippt { font-style: italic; opacity: .6; }
.kim-input-row { flex: none; display: flex; padding-top: 6px; border-top: 1px dashed currentColor; }
.kim-input-row input { flex: 1; background: rgba(0,0,0,.4); border: 1px solid rgba(51,255,102,.3); color: var(--green); font-family: inherit; font-size: 13px; padding: 3px 7px; border-radius: 3px; }
.kim-input-row input:focus { outline: none; border-color: rgba(51,255,102,.6); }

/* W · WIRE als Autoscroll-Laufband (#616) — Hover pausiert */
#mon-W { overflow: hidden; }
.wire-band { display: inline-block; white-space: nowrap; height: 100%;
  will-change: transform; animation: wirelauf var(--wire-dauer, 60s) linear infinite; }
#mon-wire:hover .wire-band { animation-play-state: paused; }
body.calm .wire-band { animation-play-state: paused; }
@keyframes wirelauf { from { transform: translateX(0); } to { transform: translateX(-50%); } }
.wire-band .wz { display: inline-block; margin-right: 34px; font-size: 14px; line-height: 3; }

/* Kontext-Pult: Akte klickbar → Modal (#617) */
#mon-K .akte-klick { cursor: pointer; }
#mon-K .akte-klick:hover { background: rgba(255,182,61,.12); }
/* KIM-KONTEXT: Kims gefundene Akten als klickbare Zeilen (Phil 2026-07-08) */
#mon-K .kk-kopf { font-size: 13px; letter-spacing: .12em; margin: 0 0 4px; }
#mon-K .kk-zeile { font-size: 13px; line-height: 1.6; padding: 0 3px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#mon-K .kk-zeile.akte-klick:hover { text-decoration: underline; }

/* Kontext-Pult im v4-Dummy-Layout (Phil 2026-07-07): Kicker + große
   Schlagzeile + Auszug links, gestrichelte Seitenspalte rechts */
.k-grid { display: grid; grid-template-columns: 1fr 300px; gap: 0 18px; height: 100%; overflow: hidden; }
.k-kicker { font-size: 11px; letter-spacing: .26em; opacity: .75; text-transform: uppercase; }
.k-titel { font-size: 22px; line-height: 1.12; margin: 5px 0 7px; font-weight: normal; }
.k-titel.akte-klick:hover { text-decoration: underline; }
.k-auszug { font-size: 13.5px; line-height: 1.42; opacity: .85; overflow: hidden; }
.k-hinweis { font-size: 11px; opacity: .55; margin-top: 5px; }
.k-seite { border-left: 1px dashed currentColor; padding-left: 16px;
  font-size: 12px; line-height: 1.5; overflow: hidden; }
.k-seite .kasten { opacity: .7; border: 1px dashed currentColor; padding: 5px 7px; margin-bottom: 8px; }

/* Facettensuche im Archiv — die Navigationslogik der Archivseite im Terminal.
   ⚠ white-space: pre ist hier Pflicht: die Knopfbreiten kommen aus K.pad, und
   in einem <div> (statt dem <pre> von K.print) fielen die Füll-Leerzeichen
   zusammen — die Spalten stünden krumm. */
.fac-zeile { white-space: pre; padding: 0 4px; margin-bottom: 1px; }
.fac-kopf { opacity: .55; letter-spacing: .1em; }
.fac { cursor: pointer; padding: 0 3px; border-radius: 2px; }
.fac:hover { background: rgba(255,182,61,.16); }
.fac.an { background: var(--amber); color: #0a0a0a; text-shadow: none; }
.fac.tot { opacity: .28; cursor: default; }
.fac.tot:hover { background: none; }
.fac-n { opacity: .6; }
.fac.an .fac-n { opacity: .75; }

/* Der Reader im Modal: der echte Renderer von tribune-3 (/dossier/), nicht
   nachgebaut. Heller Grund, weil die Papieroptik ihn mitbringt — ohne ihn
   blitzt beim Laden die Amber-Röhre durch das noch leere Dokument. */
.reader-rahmen { width: 100%; height: calc(100% - 26px); margin-top: 6px;
  border: 0; border-radius: 4px; background: #f4efe4; }

/* Modal (#617) — Volltext über der Maske, ESC schließt (#608) */
#modal { position: absolute; inset: 0; z-index: 70; display: none; background: rgba(0,0,0,.55); }
#modal.offen { display: block; }
#modal-crt {
  position: absolute; left: 480px; top: 120px; width: 960px; height: 790px;
  background: linear-gradient(150deg, #5a5348 0%, var(--bezel) 30%, var(--bezel-dkl) 75%, #211d17 100%);
  border-radius: 22px; padding: 26px 30px 38px;
  box-shadow: 0 30px 80px rgba(0,0,0,.95), inset 0 2px 0 rgba(255,255,255,.1);
}
#modal-crt .tube { position: relative; height: 100%; overflow: hidden;
  border-radius: 20px / 26px;
  background: radial-gradient(ellipse at 50% 42%, #2a1a05 0%, var(--tube-amber) 80%);
  color: var(--amber-hell); text-shadow: 0 0 8px var(--amber-dim);
  box-shadow: inset 0 0 60px rgba(0,0,0,.95); }
#modal-crt .tube::before { content: none; }   /* wie Hauptkonsole: keine Scanlines (#607) */
#modal-body { position: relative; z-index: 2; height: 100%; padding: 18px 26px;
  font-size: 15px; line-height: 1.5; overflow: auto;
  scrollbar-width: thin; scrollbar-color: currentColor transparent; }
#modal-body h2 { font-size: 24px; font-weight: normal; line-height: 1.15; margin: 8px 0 12px; }
#modal-body .kicker { font-size: 11px; letter-spacing: .26em; opacity: .75; }
#modal-body p { margin: 0 0 .6em; max-width: 76ch; text-align: justify; }
#modal-crt .esc { position: absolute; bottom: 10px; left: 50%; transform: translateX(-50%);
  font-size: 12px; letter-spacing: .3em; color: #8d8271; text-transform: uppercase; }

/* Störbild bei API-Ausfall */
.mon.stoerung .mon-body, .mon.stoerung .graph-host { opacity: .4; }

/* Siegel-Popup (Sichtmodus, kernel-autark.js): Einladung zum Patreon-Login,
   Optik wie das Akten-Modal (#617) — Bezel + Amber-Röhre, ohne Scanlines */
#siegel-popup { position: absolute; inset: 0; z-index: 80; display: none; background: rgba(0,0,0,.55); }
#siegel-popup.offen { display: block; }
#siegel-crt {
  position: absolute; left: 600px; top: 300px; width: 720px; height: 460px;
  background: linear-gradient(150deg, #5a5348 0%, var(--bezel) 30%, var(--bezel-dkl) 75%, #211d17 100%);
  border-radius: 22px; padding: 24px 28px 36px;
  box-shadow: 0 30px 80px rgba(0,0,0,.95), inset 0 2px 0 rgba(255,255,255,.1);
}
#siegel-crt .tube { position: relative; height: 100%; overflow: hidden;
  border-radius: 20px / 26px;
  background: radial-gradient(ellipse at 50% 42%, #2a1a05 0%, var(--tube-amber) 80%);
  color: var(--amber-hell); text-shadow: 0 0 8px var(--amber-dim);
  box-shadow: inset 0 0 60px rgba(0,0,0,.95); }
#siegel-crt .tube::before { content: none; }
#siegel-body { position: relative; z-index: 2; height: 100%; padding: 26px 32px;
  display: flex; flex-direction: column; font-size: 16px; line-height: 1.5; }
#siegel-body .kicker { font-size: 11px; letter-spacing: .26em; opacity: .75; }
#siegel-body h2 { font-size: 26px; font-weight: normal; line-height: 1.15; margin: 10px 0 12px; }
#siegel-body p { margin: 0 0 auto; max-width: 60ch; }
.siegel-tasten { display: flex; flex-direction: column; gap: 12px; margin: 18px 0 14px; }
.siegel-taste { font-family: 'VT323', monospace; font-size: 18px; letter-spacing: .12em;
  padding: 10px 18px; cursor: pointer; text-align: center;
  background: transparent; color: var(--amber-hell); text-shadow: 0 0 8px var(--amber-dim);
  border: 1px solid var(--amber-dim); border-radius: 4px; }
.siegel-taste:hover { background: rgba(255,180,60,.12); }
.siegel-taste.haupt { border-width: 2px; font-size: 20px;
  box-shadow: 0 0 14px rgba(255,180,60,.25), inset 0 0 10px rgba(255,180,60,.08); }
.siegel-fuss { font-size: 13px; opacity: .7; text-align: center; }
.siegel-fuss a { color: inherit; }
#siegel-crt .esc { position: absolute; bottom: 10px; left: 50%; transform: translateX(-50%);
  font-size: 12px; letter-spacing: .3em; color: #8d8271; text-transform: uppercase; }

/* Kleiner-Bildschirm-Hinweis */
#zu-klein { position: fixed; inset: 0; z-index: 99; display: none; align-items: center; justify-content: center; flex-direction: column; gap: 10px; background: #000; color: var(--amber); font-family: 'VT323', monospace; font-size: 26px; letter-spacing: 3px; text-align: center; }
@media (max-width: 1099px) { #zu-klein { display: flex; } #stage { display: none; } }
@media (prefers-reduced-motion: reduce) { .tube::after, #cursor, .koppel-btn.pulse, #radio .vu i { animation: none !important; } }