unbenannt

Pasted Oct 14, 2026, 1:19 PM1 file1,172 lines

Scan to open on your phone

Point a camera at the QR code - it opens this exact paste, no app needed.

https://codepastes.com/zzgswjz2nkge7g2a
unbenannt
<!DOCTYPE html>
<html lang="de">
<head>
  <meta charset="UTF-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  <title>NeuroQuest: Biologische Psychologie II – Emotionen</title>
  <style>
    :root {
      --bg-dark: #0b1021;
      --bg-card: #151c36;
      --bg-card-hover: #1e284a;
      --primary: #6366f1;
      --primary-glow: rgba(99, 102, 241, 0.45);
      --accent: #06b6d4;
      --success: #10b981;
      --warning: #f59e0b;
      --danger: #ef4444;
      --text: #f1f5f9;
      --text-muted: #94a3b8;
      --border: #2e3a63;
    }

    * {
      box-sizing: border-box;
      margin: 0;
      padding: 0;
      font-family: 'Segoe UI', system-ui, -apple-system, sans-serif;
    }

    body {
      background: radial-gradient(circle at top right, #1e1b4b, var(--bg-dark) 60%);
      color: var(--text);
      min-height: 100vh;
      overflow-x: hidden;
      padding-bottom: 60px;
    }

    /* Confetti Canvas */
    #confetti-canvas {
      position: fixed;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      pointer-events: none;
      z-index: 999;
    }

    /* Top HUD (Game Bar) */
    .hud {
      position: sticky;
      top: 0;
      z-index: 100;
      background: rgba(15, 23, 42, 0.9);
      backdrop-filter: blur(12px);
      border-bottom: 1px solid var(--border);
      padding: 12px 24px;
      display: flex;
      flex-wrap: wrap;
      justify-content: space-between;
      align-items: center;
      gap: 16px;
    }

    .brand {
      display: flex;
      align-items: center;
      gap: 12px;
      font-weight: 800;
      font-size: 1.25rem;
      letter-spacing: 0.5px;
      background: linear-gradient(90deg, #818cf8, #22d3ee);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
    }

    .hud-stats {
      display: flex;
      align-items: center;
      gap: 20px;
      flex-wrap: wrap;
    }

    .stat-pill {
      background: var(--bg-card);
      border: 1px solid var(--border);
      padding: 6px 14px;
      border-radius: 999px;
      font-size: 0.9rem;
      font-weight: 600;
      display: flex;
      align-items: center;
      gap: 8px;
      box-shadow: 0 4px 12px rgba(0,0,0,0.25);
      transition: transform 0.2s ease;
    }

    .stat-pill.pulse {
      animation: popScale 0.4s ease;
    }

    .xp-bar-wrap {
      width: 140px;
      height: 8px;
      background: #0f172a;
      border-radius: 99px;
      overflow: hidden;
      border: 1px solid var(--border);
    }

    .xp-bar-fill {
      height: 100%;
      width: 0%;
      background: linear-gradient(90deg, var(--primary), var(--accent));
      transition: width 0.5s cubic-bezier(0.34, 1.56, 0.64, 1);
    }

    /* Navigation Tabs */
    .mode-switcher {
      max-width: 1100px;
      margin: 24px auto 0;
      padding: 0 20px;
      display: flex;
      gap: 12px;
      flex-wrap: wrap;
    }

    .mode-btn {
      flex: 1;
      min-width: 240px;
      padding: 16px 24px;
      border-radius: 14px;
      border: 2px solid var(--border);
      background: var(--bg-card);
      color: var(--text);
      font-size: 1.05rem;
      font-weight: 700;
      cursor: pointer;
      transition: all 0.25s ease;
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 10px;
    }

    .mode-btn:hover {
      border-color: var(--accent);
      transform: translateY(-2px);
    }

    .mode-btn.active {
      background: linear-gradient(135deg, rgba(99, 102, 241, 0.25), rgba(6, 182, 212, 0.2));
      border-color: var(--accent);
      box-shadow: 0 0 20px var(--primary-glow);
    }

    /* Main Container */
    .container {
      max-width: 1100px;
      margin: 24px auto;
      padding: 0 20px;
    }

    /* Level Map (Virtual Lecture) */
    .level-nav {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(135px, 1fr));
      gap: 10px;
      margin-bottom: 24px;
    }

    .level-tab {
      background: var(--bg-card);
      border: 1px solid var(--border);
      border-radius: 12px;
      padding: 12px;
      text-align: center;
      cursor: pointer;
      transition: all 0.2s ease;
      position: relative;
      overflow: hidden;
    }

    .level-tab:hover {
      background: var(--bg-card-hover);
      transform: translateY(-2px);
    }

    .level-tab.active {
      border-color: var(--accent);
      box-shadow: 0 0 15px rgba(6, 182, 212, 0.3);
      background: rgba(6, 182, 212, 0.12);
    }

    .level-tab.completed::after {
      content: "✓";
      position: absolute;
      top: 6px;
      right: 8px;
      background: var(--success);
      color: #fff;
      font-size: 0.7rem;
      width: 18px;
      height: 18px;
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      font-weight: bold;
    }

    .level-num {
      font-size: 0.75rem;
      text-transform: uppercase;
      color: var(--accent);
      font-weight: 700;
      display: block;
      margin-bottom: 4px;
    }

    .level-title {
      font-size: 0.88rem;
      font-weight: 600;
    }

    /* Lecture Stage Card */
    .stage-card {
      background: var(--bg-card);
      border: 1px solid var(--border);
      border-radius: 18px;
      padding: 28px;
      box-shadow: 0 12px 32px rgba(0, 0, 0, 0.35);
      animation: fadeIn 0.35s ease;
    }

    .stage-header {
      display: flex;
      justify-content: space-between;
      align-items: flex-start;
      gap: 16px;
      border-bottom: 1px solid var(--border);
      padding-bottom: 18px;
      margin-bottom: 22px;
      flex-wrap: wrap;
    }

    .stage-badge {
      background: rgba(99, 102, 241, 0.2);
      color: #a5b4fc;
      border: 1px solid #6366f1;
      padding: 4px 12px;
      border-radius: 99px;
      font-size: 0.8rem;
      font-weight: 700;
      margin-bottom: 8px;
      display: inline-block;
    }

    .grid-2 {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
      gap: 18px;
      margin: 18px 0;
    }

    .info-box {
      background: rgba(15, 23, 42, 0.65);
      border: 1px solid var(--border);
      border-left: 4px solid var(--primary);
      border-radius: 12px;
      padding: 16px;
      transition: transform 0.2s ease, border-color 0.2s ease;
    }

    .info-box:hover {
      transform: translateY(-2px);
      border-left-color: var(--accent);
    }

    .info-box h4 {
      color: #38bdf8;
      margin-bottom: 8px;
      font-size: 1rem;
    }

    .info-box p, .info-box li {
      color: #cbd5e1;
      font-size: 0.94rem;
      line-height: 1.55;
    }

    .info-box ul {
      padding-left: 18px;
      margin-top: 6px;
    }

    .info-box li {
      margin-bottom: 5px;
    }

    /* Interactive Mini-Lab Styling */
    .interactive-lab {
      background: linear-gradient(145deg, #0f172a, #1e1b4b);
      border: 1px solid #4f46e5;
      border-radius: 14px;
      padding: 20px;
      margin-top: 22px;
    }

    .lab-title {
      font-weight: 700;
      color: #fde047;
      margin-bottom: 12px;
      display: flex;
      align-items: center;
      gap: 8px;
      font-size: 1.05rem;
    }

    .lab-controls {
      display: flex;
      gap: 10px;
      flex-wrap: wrap;
      margin-bottom: 14px;
    }

    .lab-btn {
      padding: 10px 16px;
      border-radius: 10px;
      border: 1px solid var(--border);
      background: var(--bg-card);
      color: var(--text);
      cursor: pointer;
      font-weight: 600;
      transition: all 0.2s ease;
    }

    .lab-btn:hover, .lab-btn.active {
      background: var(--primary);
      border-color: #818cf8;
    }

    .lab-output {
      background: rgba(15, 23, 42, 0.85);
      border: 1px dashed var(--accent);
      border-radius: 10px;
      padding: 14px;
      min-height: 64px;
      color: #e2e8f0;
      font-size: 0.95rem;
      line-height: 1.5;
    }

    /* Quiz Styling */
    .quiz-header-bar {
      display: flex;
      justify-content: space-between;
      align-items: center;
      margin-bottom: 16px;
      flex-wrap: wrap;
      gap: 12px;
    }

    .multi-hint {
      background: rgba(245, 158, 11, 0.15);
      border: 1px solid var(--warning);
      color: #fcd34d;
      padding: 8px 14px;
      border-radius: 10px;
      font-size: 0.9rem;
      font-weight: 600;
    }

    .question-text {
      font-size: 1.25rem;
      font-weight: 700;
      line-height: 1.45;
      margin-bottom: 20px;
    }

    .options-list {
      display: flex;
      flex-direction: column;
      gap: 12px;
      margin-bottom: 24px;
    }

    .option-card {
      background: rgba(15, 23, 42, 0.7);
      border: 2px solid var(--border);
      border-radius: 12px;
      padding: 16px 18px;
      cursor: pointer;
      display: flex;
      align-items: flex-start;
      gap: 14px;
      transition: all 0.2s ease;
      user-select: none;
    }

    .option-card:hover:not(.locked) {
      border-color: #818cf8;
      background: rgba(99, 102, 241, 0.1);
      transform: translateX(4px);
    }

    .option-card.selected {
      border-color: var(--accent);
      background: rgba(6, 182, 212, 0.15);
      box-shadow: 0 0 15px rgba(6, 182, 212, 0.2);
    }

    .option-card.correct-hit {
      border-color: var(--success) !important;
      background: rgba(16, 185, 129, 0.18) !important;
    }

    .option-card.missed-correct {
      border-color: var(--warning) !important;
      background: rgba(245, 158, 11, 0.15) !important;
    }

    .option-card.wrong-pick {
      border-color: var(--danger) !important;
      background: rgba(239, 68, 68, 0.18) !important;
    }

    .checkbox-ui {
      width: 24px;
      height: 24px;
      border-radius: 6px;
      border: 2px solid var(--text-muted);
      display: flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
      margin-top: 2px;
      font-weight: bold;
      transition: all 0.2s ease;
    }

    .option-card.selected .checkbox-ui {
      background: var(--accent);
      border-color: var(--accent);
      color: #0f172a;
    }

    .option-content {
      flex: 1;
    }

    .option-rationale {
      margin-top: 8px;
      font-size: 0.88rem;
      padding-top: 8px;
      border-top: 1px solid rgba(255,255,255,0.1);
      color: #cbd5e1;
      display: none;
    }

    .action-btn {
      padding: 14px 28px;
      border-radius: 12px;
      border: none;
      font-size: 1rem;
      font-weight: 700;
      cursor: pointer;
      transition: all 0.2s ease;
      background: linear-gradient(135deg, var(--primary), var(--accent));
      color: #fff;
      box-shadow: 0 6px 20px var(--primary-glow);
    }

    .action-btn:hover {
      transform: translateY(-2px);
      filter: brightness(1.1);
    }

    .action-btn:disabled {
      opacity: 0.5;
      cursor: not-allowed;
      transform: none;
    }

    .feedback-banner {
      padding: 16px 20px;
      border-radius: 12px;
      margin-bottom: 20px;
      font-weight: 600;
      display: none;
      animation: fadeIn 0.3s ease;
    }

    @keyframes fadeIn {
      from { opacity: 0; transform: translateY(8px); }
      to { opacity: 1; transform: translateY(0); }
    }

    @keyframes popScale {
      0% { transform: scale(1); }
      50% { transform: scale(1.18); }
      100% { transform: scale(1); }
    }
  </style>
</head>
<body>

  <canvas id="confetti-canvas"></canvas>

  <!-- Game HUD -->
  <header class="hud">
    <div class="brand">🧠 NeuroQuest: Emotionen</div>
    <div class="hud-stats">
      <div class="stat-pill" id="level-pill">🎓 Rang: <span id="rank-name">Neuro-Novize</span></div>
      <div class="stat-pill" id="xp-pill">
        ⚡ <span id="xp-val">0</span> XP
        <div class="xp-bar-wrap"><div class="xp-bar-fill" id="xp-bar"></div></div>
      </div>
      <div class="stat-pill" id="streak-pill">🔥 Serie: <span id="streak-val">0</span></div>
    </div>
  </header>

  <!-- Mode Switcher -->
  <div class="mode-switcher">
    <button class="mode-btn active" id="btn-mode-learn" onclick="switchMode('learn')">
      🔬 1. Virtueller Hörsaal & Interaktive Labore
    </button>
    <button class="mode-btn" id="btn-mode-quiz" onclick="switchMode('quiz')">
      🎯 2. Multiple-Choice-Arena (1–4 richtige Antworten)
    </button>
  </div>

  <!-- MODE 1: VIRTUAL LECTURE -->
  <main class="container" id="view-learn">
    <div class="level-nav" id="level-nav"></div>
    <div class="stage-card" id="lecture-stage"></div>
  </main>

  <!-- MODE 2: MULTIPLE SELECT QUIZ -->
  <main class="container" id="view-quiz" style="display:none;">
    <div class="stage-card" id="quiz-stage"></div>
  </main>

  <script>
    // --- GAME STATE ---
    let xp = 0;
    let streak = 0;
    let currentLevelIdx = 0;
    let completedLevels = new Set();

    function addXP(amount) {
      xp += amount;
      document.getElementById('xp-val').textContent = xp;
      const pct = Math.min(100, (xp % 300) / 3);
      document.getElementById('xp-bar').style.width = pct + '%';
      const ranks = ['Neuro-Novize', 'Limbus-Scout', 'Amygdala-Experte', 'Kortex-Kommandant', 'Biopsych-Meister'];
      const rankIdx = Math.min(ranks.length - 1, Math.floor(xp / 300));
      document.getElementById('rank-name').textContent = ranks[rankIdx];
      const pill = document.getElementById('xp-pill');
      pill.classList.remove('pulse');
      void pill.offsetWidth;
      pill.classList.add('pulse');
    }

    // --- CONFETTI ENGINE ---
    const canvas = document.getElementById('confetti-canvas');
    const ctx = canvas.getContext('2d');
    let particles = [];
    function resizeCanvas() {
      canvas.width = window.innerWidth;
      canvas.height = window.innerHeight;
    }
    window.addEventListener('resize', resizeCanvas);
    resizeCanvas();

    function fireConfetti() {
      for (let i = 0; i < 65; i++) {
        particles.push({
          x: window.innerWidth / 2,
          y: window.innerHeight / 2,
          vx: (Math.random() - 0.5) * 16,
          vy: (Math.random() - 0.8) * 16,
          size: Math.random() * 8 + 4,
          color: ['#6366f1', '#06b6d4', '#10b981', '#f59e0b', '#ec4899'][Math.floor(Math.random() * 5)],
          life: 90
        });
      }
      requestAnimationFrame(updateConfetti);
    }

    function updateConfetti() {
      ctx.clearRect(0, 0, canvas.width, canvas.height);
      particles.forEach(p => {
        p.x += p.vx;
        p.y += p.vy;
        p.vy += 0.35;
        p.life--;
        ctx.fillStyle = p.color;
        ctx.fillRect(p.x, p.y, p.size, p.size);
      });
      particles = particles.filter(p => p.life > 0);
      if (particles.length > 0) requestAnimationFrame(updateConfetti);
    }

    // --- VIRTUAL LECTURE DATA (7 LEVELS) ---
    const levels = [
      {
        num: "Level 1",
        title: "Grundlagen & Körperkarten",
        badge: "Folien 1–5",
        headline: "Was sind Emotionen & wo spüren wir sie?",
        cards: [
          {
            title: "Definition & 4 Komponenten",
            items: [
              "<strong>Hypothetisches Konstrukt:</strong> Bezeichnet Reaktionsvorgänge eines Organismus auf bedeutsame Ereignisse (oft synonym mit Gefühl oder Affekt)[cite: 2].",
              "<strong>Die 4 Ebenen:</strong> Subjektive Ebene (Erlebnisaspekt), kognitive Ebene, physiologische Ebene und Verhaltensebene[cite: 2].",
              "<strong>Ursprung:</strong> Grundlagen sind angeboren und differenzieren sich im Lauf des Lebens aus; treten z.T. auch ohne offensichtlichen situativen Grund auf[cite: 2].",
              "<strong>6 Basisemotionen:</strong> Angst, Wut, Ekel, Freude, Überraschung und Traurigkeit[cite: 2]."
            ]
          },
          {
            title: "Bodily Maps of Emotions (Nummenmaa et al., 2014)",
            items: [
              "<strong>Methode:</strong> Probanden färbten auf zwei blanken Körperumrissen ein, wo die Körperaktivität bei einer Emotion stärker/schneller (Activation = rot/gelb) oder schwächer/langsamer (Deactivation = blau) wird[cite: 4, 5].",
              "<strong>Muster:</strong> Freude (Happiness) und Liebe (Love) zeigen Aktivierung im fast gesamten Körper; Depression und Traurigkeit (Sadness) zeigen starke Deaktivierung (blau) in den Gliedmaßen; Wut (Anger) aktiviert besonders Kopf, Brust und Hände[cite: 5]."
            ]
          }
        ],
        lab: {
          title: "🧪 Interaktiver Bodily-Map-Scanner (Nummenmaa et al., 2014)",
          prompt: "Klicke auf eine Emotion, um das typische Aktivierungsmuster im Körper zu scannen:",
          buttons: [
            { label: "😡 Wut (Anger)", result: "🔥 <strong>Wut (Anger):</strong> Starke Aktivierung im oberen Brustbereich, Kopf („Hitzkopf!“) sowie in Armen und Händen (Kampfbereitschaft)[cite: 3, 5]." },
            { label: "😊 Freude (Happiness)", result: "☀️ <strong>Freude (Happiness):</strong> Einzige Basisemotion mit intensiver Aktivierung (rot/gelb) über den gesamten Körper von Kopf bis Fuß[cite: 5]." },
            { label: "😢 Traurigkeit (Sadness)", result: "💧 <strong>Traurigkeit (Sadness):</strong> Moderate Aktivierung im Brust-/Kopfbereich, aber deutliche Deaktivierung (blau) in Armen und Beinen[cite: 4, 5]." },
            { label: "🥶 Depression", result: "❄️ <strong>Depression:</strong> Fast ausschließlich Deaktivierung (blau) in Armen, Beinen und Rumpf – keinerlei warme Aktivierungsherde[cite: 5]." }
          ]
        }
      },
      {
        num: "Level 2",
        title: "Meilensteine & Frühe Theorien",
        badge: "Folien 6–13",
        headline: "Von Phineas Gage bis zum Klüver-Bucy-Syndrom",
        cards: [
          {
            title: "Chronologie & Frühe Emotionstheorien",
            items: [
              "<strong>Meilensteine:</strong> 1848 Phineas Gage | 1872 Darwins Evolutionstheorie der Emotionen | um 1900 James-Lange & Cannon-Bard | 1929 Scheinwut | 1939 Klüver-Bucy-Syndrom | 1952 Limbisches System[cite: 6].",
              "<strong>James-Lange-Theorie (1884):</strong> Reizwahrnehmung → somatische/viszerale Körperreaktion (Ausdruck) → emotionales Erleben („Wir haben Angst, weil wir zittern“)[cite: 9].",
              "<strong>Cannon-Bard-Theorie (1915):</strong> Emotionales Erleben ist auch unabhängig vom Ausdruck möglich; der Reiz löst nach der Wahrnehmung zuerst ein Angstgefühl bzw. parallele Prozesse aus[cite: 9]."
            ]
          },
          {
            title: "Scheinwut, Hypothalamus & Klüver-Bucy-Syndrom",
            items: [
              "<strong>Hypothalamus-Stimulation (Flynn, 1967):</strong> Medialer Hypothalamus = affektive Aggression (Drohangriff); lateraler Hypothalamus = Beuteaggression (lautloser Beißangriff)[cite: 11].",
              "<strong>Klüver-Bucy-Syndrom (bitemporale Lobektomie):</strong> Rückgang von Angst & Aggression, Hyperoralität (Objekte mit Mund untersuchen, alles Essbare verzehren), Hypersexualität, visuelle Agnosie (beim Menschen zudem oft Krampfanfälle und Nachahmungsverhalten)[cite: 12, 13]."
            ]
          }
        ],
        lab: {
          title: "🔬 Virtuelles Läsions-Labor: Die Entdeckung der Scheinwut",
          prompt: "Simuliere die klassischen Läsionsexperimente (Folie 10 & 45): Welche Struktur wird entfernt?",
          buttons: [
            { label: "Schnitt 1: Nur Großhirnrinde entfernen", result: "⚡ <strong>Ergebnis: SCHEINWUT tritt auf!</strong> Solange der Hypothalamus intakt bleibt, zeigen die Tiere bei kleinster Provokation rasende Wut[cite: 10, 45]." },
            { label: "Schnitt 2: Großhirnrinde + anterioren Hypothalamus entfernen", result: "⚡ <strong>Ergebnis: SCHEINWUT tritt weiterhin auf!</strong> Da der posteriore Hypothalamus noch intakt ist, bleibt die Scheinwut erhalten[cite: 10, 45]." },
            { label: "Schnitt 3: Zusätzlich posterioren Hypothalamus entfernen", result: "🛑 <strong>Ergebnis: KEINE Scheinwut mehr!</strong> Erst wenn der posteriore Hypothalamus mit entfernt wird, verschwindet die Scheinwut[cite: 10, 45]." }
          ]
        }
      },
      {
        num: "Level 3",
        title: "Limbisches System & Papez",
        badge: "Folien 14–18",
        headline: "Vom Geruchssinn zum Papez-Kreis",
        cards: [
          {
            title: "Brocas Lobus limbicus & McLeans Konzept",
            items: [
              "<strong>Paul Broca (1878):</strong> Beschrieb den saumartigen Ring um Hirnstamm und Balken (Corpus callosum) aus Gyrus cinguli und medialem Temporallappen inkl. Hippocampus als <em>Lobus limbicus</em> (ursprünglich mit dem Geruchssinn assoziiert, nicht mit Emotionen!)[cite: 14, 15].",
              "<strong>Paul McLean (1952):</strong> Verbreitete den Begriff <em>limbisches System</em>; sah darin einen evolutionären Befreiungsschlag vom stereotypen Verhalten des Hirnstamms[cite: 17]."
            ]
          },
          {
            title: "Der Papez-Kreis & Moderne Kritik",
            items: [
              "<strong>Papez-Schaltkreis:</strong> Cingulärer Cortex (emotionales Erleben, verbunden mit Neocortex für emotionale Färbung) → Hippocampus → Fornix → Hypothalamus (emotionaler Ausdruck) → anteriore Thalamuskerne → zurück zum cingulären Cortex[cite: 16].",
              "<strong>Kritik am Konzept:</strong> Hippocampus ist kaum am Emotionsausdruck beteiligt; keine 1-zu-1-Beziehung zwischen Struktur und Funktion; ein einzelnes System für alle Emotionen ist unplausibel[cite: 18]."
            ]
          }
        ],
        lab: {
          title: "🔄 Interaktiver Papez-Kreis-Simulator",
          prompt: "Klicke auf eine Station im Papez-Kreis, um ihre exakte Funktion und Verbindung zu prüfen:",
          buttons: [
            { label: "1. Cingulärer Cortex", result: "🧠 <strong>Cingulärer Cortex:</strong> Bestimmt das <em>emotionale Erleben</em>. Projiziert weiter in den Hippocampus und tauscht Signale mit dem Neocortex (emotionale Färbung) aus[cite: 16]." },
            { label: "2. Hippocampus & Fornix", result: "🌉 <strong>Hippocampus & Fornix:</strong> Empfängt Signale vom cingulären Cortex und leitet sie über das Faserbündel des <em>Fornix</em> an den Hypothalamus weiter[cite: 16]." },
            { label: "3. Hypothalamus", result: "🎭 <strong>Hypothalamus:</strong> Steuert den <em>emotionalen Ausdruck</em> und sendet Signale an die anterioren Thalamuskerne[cite: 16]." },
            { label: "4. Anteriore Thalamuskerne", result: "📡 <strong>Anteriore Thalamuskerne:</strong> Dienen als Umschaltstation vom Hypothalamus zurück zum cingulären Cortex[cite: 16]." }
          ]
        }
      },
      {
        num: "Level 4",
        title: "Mimik & Facial Feedback",
        badge: "Folien 19–26",
        headline: "Gesichtsmuskeln, Duchenne-Lächeln & Mimikry",
        cards: [
          {
            title: "Facial-Feedback & Gesichtsmuskeln",
            items: [
              "<strong>Facial-Feedback-Hypothese (Rutledge & Hupka, 1985):</strong> Unser Gesichtsausdruck beeinflusst unser emotionales Erleben (fröhliches Gesicht verstärkt Freude bei Diabetrachtung)[cite: 20].",
              "<strong>Emotionskongruenz:</strong> Angenehme Reize aktivieren besonders schnell den <em>M. zygomaticus major</em> („Lachmuskel“); unangenehme Reize den <em>M. corrugator supercilii</em> („Stirnrunzelmuskel“)[cite: 21].",
              "<strong>Faziale Mimikry (Weyers et al., 2006):</strong> Dynamische Gesichtsausdrücke lösen etwas später einsetzende, aber im Verlauf stärkere EMG-Reaktionen aus als statische[cite: 25]."
            ]
          },
          {
            title: "Duchenne-Lächeln & Kritik an Ekman",
            items: [
              "<strong>Täuschung entlarven (Ekman, 1985):</strong> Durch <em>Mikroexpressionen</em> (~0,05 Sekunden Dauer) und subtile Muskelunterschiede[cite: 22].",
              "<strong>Duchenne-Lächeln (1862):</strong> Echtes Lächeln = <em>M. zygomaticus major</em> (Mundwinkel) + <em>M. orbicularis oculi</em> (Augenringmuskel, lateral kaum willkürlich steuerbar)[cite: 24].",
              "<strong>4 Einschränkungen von Ekmans Theorie:</strong> Reine Ausdrücke selten (Ideale); weitere Primäremotionen existieren; Körperhaltung wichtig (z.B. Stolz); kulturelle Unterschiede (westlich-kaukasisch vs. östlich-asiatisch)[cite: 26]."
            ]
          }
        ],
        lab: {
          title: "📈 EMG-Mimikry-Labor (nach Weyers et al., 2006)",
          prompt: "Welchen Reiz zeigst du der Versuchsperson auf dem Bildschirm?",
          buttons: [
            { label: "😊 Freudiges Gesicht (dynamisch)", result: "📊 <strong>EMG-Ausschlag:</strong> Starke Aktivierung des <em>M. zygomaticus major</em> (Wange) und gleichzeitige Deaktivierung (-0,75 µV) des <em>M. corrugator supercilii</em>[cite: 25]." },
            { label: "😠 Ärgerliches Gesicht (dynamisch)", result: "📊 <strong>EMG-Ausschlag:</strong> Automatische Aktivierung des <em>M. corrugator supercilii</em> („Stirnrunzeln“), während der <em>M. zygomaticus major</em> auf der Nulllinie bleibt[cite: 25]." },
            { label: "🕵️ Falsches Lächeln prüfen", result: "🔍 <strong>Detektor:</strong> Nur der <em>M. zygomaticus major</em> zieht die Mundwinkel hoch – der laterale Anteil des <em>M. orbicularis oculi</em> an den Augen bleibt inaktiv[cite: 24]!" }
          ]
        }
      },
      {
        num: "Level 5",
        title: "Furcht & Die Amygdala",
        badge: "Folien 27–39",
        headline: "Hotspots, Dimensionen & Angstkonditionierung",
        cards: [
          {
            title: "Repräsentationen, Dimensionen & Anatomie",
            items: [
              "<strong>fMRT-Hotspots (Hamann, 2012):</strong> Furcht = stärkere Aktivität in der Amygdala; Traurigkeit = stärkere Aktivität im medialen frontalen Cortex[cite: 28, 29].",
              "<strong>Dimensionale Theorien:</strong> Zerlegung von Emotionen in <em>Valenz</em> (angenehm – unangenehm) und <em>Arousal</em> (schwach – stark)[cite: 30].",
              "<strong>Amygdala-Kerne:</strong> Basolaterale Kerne (visuelle, auditive, gustatorische, taktile Afferenzen), corticomediale Kerne (olfaktorische Eingänge), zentraler Kern[cite: 32, 33]. Verbunden mit Hypothalamus über <em>ventrale amygdalofugale Bahn</em> und <em>Stria terminalis</em>[cite: 33]."
            ]
          },
          {
            title: "Patientin SM, Konditionierung & Gedächtnis",
            items: [
              "<strong>Patientin SM (Adolphs et al., 2005):</strong> Bilaterale Amygdalaläsion → erkennt Furcht nicht, da sie spontan nicht auf die Augenpartie schaut. Mit expliziter Instruktion („Schau auf die Augen!“) gelingt die Erkennung wieder normal[cite: 36]!",
              "<strong>Schaltkreis gelernter Angst:</strong> Ton (Hörrinde) + Schock (somatosensorischer Cortex) → basolaterale Kerne → zentraler Kern → Hypothalamus (vegetative Reaktion) & PAG (Verhaltensreaktion); Großhirnrinde (emotionales Erleben)[cite: 38].",
              "<strong>Emotionales Gedächtnis (Hamann et al., 1999):</strong> Amygdalaaktivität korreliert positiv mit der besseren Erinnerung an emotionale (angenehme wie unangenehme) Bilder im Vergleich zu neutralen[cite: 39]."
            ]
          }
        ],
        lab: {
          title: "👁️ Eye-Tracking-Simulator: Patientin SM (Adolphs et al., 2005)",
          prompt: "Teste die Furchterkennung bei bilateraler Amygdalaläsion:",
          buttons: [
            { label: "Ohne Instruktion testen", result: "❌ <strong>Furchterkennung stark beeinträchtigt (~45%):</strong> Patientin SM fixiert nur Nase und Mund, lässt aber die entscheidende Augenpartie komplett aus[cite: 36]." },
            { label: "Mit Instruktion („Auf die Augen blicken!“)", result: "✅ <strong>Furchterkennung normalisiert (>80%):</strong> Sobald SM instruiert wird, die Augenpartie zu betrachten, erkennt sie Furcht genauso sicher wie gesunde Kontrollpersonen[cite: 36]!" }
          ]
        }
      },
      {
        num: "Level 6",
        title: "Wut, Aggression & Serotonin",
        badge: "Folien 40–47",
        headline: "Hierarchien, Psychochirurgie & Neurotransmitter",
        cards: [
          {
            title: "Androgene, Hierarchie & Psychochirurgie",
            items: [
              "<strong>Wut vs. Aggression:</strong> Wut ist eine Basisemotion, Aggression ein mögliches Verhalten. Bei Tieren fördern Androgene/Testosteron die Aggression deutlich[cite: 40].",
              "<strong>Rhesusaffen-Hierarchie (Pribram et al., 1954):</strong> Nach bilateraler Amygdalaläsion fiel der dominanteste Affe auf den untersten Rang; der neue Alpha-Affe fiel nach dem gleichen Eingriff ebenfalls ganz nach unten[cite: 41].",
              "<strong>Frontale Lobotomie:</strong> Entwickelt von Egas Moniz (Nobelpreis 1949); als transorbitale „Eispickel-Psychochirurgie“ mit einem 12 cm langen Leukotom über die Augenhöhle verbreitet. Folgen: kaum Effekt auf IQ/Gedächtnis, aber emotionale Abstumpfung, Verlust moralischer Maßstäbe und Planungsdefizite[cite: 42, 43]."
            ]
          },
          {
            title: "Mittelhirn-Bahnen & Serotoninmangelhypothese",
            items: [
              "<strong>Schaltkreis für Aggression:</strong> Hypothalamus sendet Signale über das <em>mediale Vorderhirnbündel</em> und das <em>dorsale Längsbündel</em> an das <em>periaquäduktale Grau (PAG)</em> und die <em>ventrale tegmentale Area (VTA)</em>[cite: 46].",
              "<strong>Serotonin (5-HT):</strong> Stammt aus den <em>Raphekernen</em> im Hirnstamm. <em>Serotoninmangelhypothese:</em> Serotoninaktivität (gemessen über den Metaboliten 5-HIES im Liquor) korreliert invers (negativ) mit Aggression[cite: 47]."
            ]
          }
        ],
        lab: {
          title: "🧪 Neurochemie-Check: Serotonin & Aggression",
          prompt: "Wähle einen Zustand im Liquor (Cerebrospinalflüssigkeit) oder Hirnstamm:",
          buttons: [
            { label: "📉 Niedriger 5-HIES-Spiegel im Liquor", result: "⚠️ <strong>Serotoninmangelhypothese bestätigt:</strong> Niedrige Werte des Serotoninmetaboliten 5-Hydroxyindolylessigsäure (5-HIES) korrelieren invers mit erhöhter Aggressivität[cite: 47]." },
            { label: "🧬 Raphekerne stimulieren", result: "🛡️ <strong>Serotonerge Projektion:</strong> Die Raphekerne im Hirnstamm senden Axone über das mediale Vorderhirnbündel in den Hypothalamus und limbische Strukturen zur Regulierung von Wut und Aggression[cite: 47]." }
          ]
        }
      },
      {
        num: "Level 7",
        title: "PFC & Emotionsregulation",
        badge: "Folien 48–50",
        headline: "Präfrontale Netzwerke & Moderne Sichtweisen",
        cards: [
          {
            title: "Emotionsregulation (Etkin, Büchel & Gross, 2015)",
            items: [
              "<strong>Emotionale Reaktivität:</strong> Dorsaler anteriorer cingulärer Cortex (dACC), Insula, Amygdala und periaquäduktales Grau (PAG)[cite: 49].",
              "<strong>Explizite Emotionsregulation (z.B. Cognitive Reappraisal):</strong> Dorsolateraler PFC (dlPFC), ventrolateraler PFC (vlPFC), SMA / pre-SMA und Parietalkortex[cite: 49].",
              "<strong>Implizite Emotionsregulation (z.B. Unterdrückung von Furcht):</strong> Ventraler ACC (vACC) und ventromedialer PFC (vmPFC)[cite: 49]."
            ]
          },
          {
            title: "4 Grundsätze moderner Emotionsforschung (Folie 50)",
            items: [
              "1. Emotionale Situationen bewirken eine weit verbreitete Zunahme cerebraler Aktivität (nicht nur in Amygdala & PFC)[cite: 50].",
              "2. Alle durch emotionale Reize aktivierten Regionen sind auch bei anderen psychologischen Prozessen aktiv[cite: 50].",
              "3. Keine Gehirnregion kann zweifelsfrei einer einzelnen Emotion zugeordnet werden[cite: 50].",
              "4. Gleiche emotionale Reize aktivieren bei unterschiedlichen Personen oft unterschiedliche Gehirnregionen[cite: 50]."
            ]
          }
        ],
        lab: {
          title: "🧠 PFC-Netzwerk-Navigator (Etkin et al., 2015)",
          prompt: "Welches System möchtest du im Gehirn aktivieren?",
          buttons: [
            { label: "🔴 Emotionale Reaktivität", result: "🚨 <strong>Aktivierte Regionen:</strong> Amygdala, Insula, dorsaler ACC (dACC) und periaquäduktales Grau (PAG)[cite: 49]." },
            { label: "🔵 Explizite Regulation (Cognitive Reappraisal)", result: "🧩 <strong>Aktivierte Regionen:</strong> dlPFC, vlPFC, pre-SMA / SMA und Parietalkortex steuern die bewusste kognitive Neubewertung[cite: 49]." },
            { label: "🔷 Implizite Regulation (Furcht-Unterdrückung)", result: "🛡️ <strong>Aktivierte Regionen:</strong> Ventraler ACC (vACC) und ventromedialer präfrontaler Cortex (vmPFC)[cite: 49]." }
          ]
        }
      }
    ];

    function renderLectureNav() {
      const nav = document.getElementById('level-nav');
      nav.innerHTML = levels.map((lvl, idx) => `
        <div class="level-tab ${idx === currentLevelIdx ? 'active' : ''} ${completedLevels.has(idx) ? 'completed' : ''}" onclick="selectLevel(${idx})">
          <span class="level-num">${lvl.num}</span>
          <span class="level-title">${lvl.title}</span>
        </div>
      `).join('');
    }

    function selectLevel(idx) {
      currentLevelIdx = idx;
      renderLectureNav();
      const lvl = levels[idx];
      const stage = document.getElementById('lecture-stage');
      stage.innerHTML = `
        <div class="stage-header">
          <div>
            <span class="stage-badge">${lvl.num} • ${lvl.badge}</span>
            <h2>${lvl.headline}</h2>
          </div>
          <button class="action-btn" onclick="completeLevel(${idx})">
            ${completedLevels.has(idx) ? '✓ Level abgeschlossen (+XP erhalten)' : '✨ Level abschließen (+50 XP)'}
          </button>
        </div>
        <div class="grid-2">
          ${lvl.cards.map(c => `
            <div class="info-box">
              <h4>${c.title}</h4>
              <ul>${c.items.map(i => `<li>${i}</li>`).join('')}</ul>
            </div>
          `).join('')}
        </div>
        <div class="interactive-lab">
          <div class="lab-title">${lvl.lab.title}</div>
          <p style="color:#cbd5e1; font-size:0.9rem; margin-bottom:12px;">${lvl.lab.prompt}</p>
          <div class="lab-controls">
            ${lvl.lab.buttons.map((b, bIdx) => `
              <button class="lab-btn" onclick="runLab(${idx}, ${bIdx}, this)">${b.label}</button>
            `).join('')}
          </div>
          <div class="lab-output" id="lab-output">👆 Wähle oben ein Experiment aus, um die Simulation zu starten.</div>
        </div>
      `;
    }

    function runLab(lvlIdx, btnIdx, btnEl) {
      document.querySelectorAll('.lab-btn').forEach(b => b.classList.remove('active'));
      btnEl.classList.add('active');
      document.getElementById('lab-output').innerHTML = levels[lvlIdx].lab.buttons[btnIdx].result;
      addXP(10);
    }

    function completeLevel(idx) {
      if (!completedLevels.has(idx)) {
        completedLevels.add(idx);
        addXP(50);
        fireConfetti();
      }
      if (idx < levels.length - 1) {
        selectLevel(idx + 1);
      } else {
        renderLectureNav();
      }
    }

    // --- MULTIPLE-SELECT QUIZ DATA (1, 2, 3, or 4 correct answers!) ---
    const quizQuestions = [
      {
        q: "1. Welche Aussagen zum Begriff der Emotion und den Basisemotionen (Folie 2) treffen zu?",
        options: [
          { text: "Emotionen umfassen eine subjektive, eine kognitive, eine physiologische und eine Verhaltensebene.", correct: true, why: "Richtig! Diese vier Komponenten bilden laut Folie 2 das Konstrukt Emotion." },
          { text: "Die Grundlagen für Emotionen sind angeboren und werden im Verlauf des Lebens ausdifferenziert.", correct: true, why: "Richtig! Die Basis ist genetisch/angeboren angelegt." },
          { text: "Emotionen entstehen ausschließlich dann, wenn situativ ein offensichtlicher äußerer Grund vorliegt.", correct: false, why: "Falsch! Laut Folie 2 entstehen sie z.T. auch ohne offensichtlichen situativen Grund, was kausale Forschung erschwert." },
          { text: "Zu den 6 häufig genannten Basisemotionen zählen Angst, Wut, Ekel, Freude, Überraschung und Traurigkeit.", correct: true, why: "Richtig! Das sind die 6 klassischen Basisemotionen." }
        ]
      },
      {
        q: "2. Was zeigten Nummenmaa et al. (2014) in ihrer Studie zu den 'Bodily maps of emotions' (Folien 4–5)?",
        options: [
          { text: "Versuchspersonen färbten Körperregionen ein, deren Aktivität bei einer Emotion stärker/schneller oder schwächer/langsamer empfunden wird.", correct: true, why: "Richtig! So entstanden kombinierte Aktivierungs- und Deaktivierungskarten." },
          { text: "Bei Depression und Traurigkeit (Sadness) zeigt sich in den Gliedmaßen vorwiegend eine Deaktivierung (blau).", correct: true, why: "Richtig! Arme und Beine sind bei Sadness und Depression deutlich blau (deaktiviert) markiert." },
          { text: "Freude (Happiness) löst als einzige Emotion ausschließlich eine Deaktivierung im gesamten Körper aus.", correct: false, why: "Falsch! Happiness zeigt im Gegenteil eine starke Aktivierung (rot/gelb) im gesamten Körper." },
          { text: "Es wurden ausschließlich die 6 Basisemotionen untersucht, keine komplexen Emotionen wie Stolz oder Neid.", correct: false, why: "Falsch! Auch Anxiety, Love, Depression, Contempt, Pride, Shame und Envy wurden kartiert." }
        ]
      },
      {
        q: "3. Welche Aussagen zu den frühen Meilensteinen und Theorien der Emotionsforschung (Folien 6–9) sind korrekt?",
        options: [
          { text: "Nach der James-Lange-Theorie (1884) nehmen wir einen Reiz wahr, unser Körper reagiert physiologisch und erst als Reaktion darauf erleben wir die Emotion (z.B. Angst).", correct: true, why: "Richtig! Emotionen sind laut James-Lange die Wahrnehmung der physiologischen Veränderungen." },
          { text: "Der Unfall von Phineas Gage ereignete sich im Jahr 1952 gleichzeitig mit McLeans Theorie des limbischen Systems.", correct: false, why: "Falsch! Phineas Gage war 1848; die Theorie des limbischen Systems folgte erst 1952." },
          { text: "Die Cannon-Bard-Theorie postuliert, dass emotionales Erleben auch unabhängig vom emotionalen Ausdruck stattfinden kann.", correct: true, why: "Richtig! Das ist ein zentraler Kritikpunkt von Cannon und Bard an der James-Lange-Theorie." },
          { text: "Charles Darwin veröffentlichte 1872 'The Expression of the Emotions in Man and Animals', um universelle Gefühle bei Mensch und Tier zu belegen.", correct: true, why: "Richtig! Darwins Werk von 1872 ist ein Meilenstein der vergleichenden Ausdrucksforschung." }
        ]
      },
      {
        q: "4. Welche Aussagen zu Scheinwut (Sham Rage) und der Hypothalamus-Stimulation bei Katzen (Folien 10–11, 45) stimmen?",
        options: [
          { text: "Werden beide Großhirnhemisphären entfernt und bleibt der Hypothalamus intakt, tritt Scheinwut auf.", correct: true, why: "Richtig! Der Wegfall der kortikalen Hemmung führt zu Scheinwut." },
          { text: "Wird zusätzlich zur Großhirnrinde auch der posteriore Hypothalamus entfernt, tritt KEINE Scheinwut mehr auf.", correct: true, why: "Richtig! Der posteriore Hypothalamus ist für das Auftreten der Scheinwut unerlässlich." },
          { text: "Die elektrische Stimulation des medialen Hypothalamus löst bei der Katze affektive Aggression (Drohangriff) aus.", correct: true, why: "Richtig! Flynn (1967) zeigte Drohangriffe bei Stimulation des medialen Hypothalamus." },
          { text: "Die elektrische Stimulation des lateralen Hypothalamus löst Beuteaggression (lautloser Beißangriff) aus.", correct: true, why: "Richtig! Alle vier Aussagen in dieser Frage sind vollkommen korrekt!" }
        ]
      },
      {
        q: "5. Welche Symptome charakterisieren das Klüver-Bucy-Syndrom bei Primaten bzw. beim Menschen (Folien 12–13)?",
        options: [
          { text: "Massiv gesteigerte Furcht- und Panikreaktionen gegenüber vertrauten Artgenossen.", correct: false, why: "Falsch! Es kommt im Gegenteil zu einem starken Rückgang von Angst und Aggression." },
          { text: "Hyperoralität (Neigung, Gegenstände mit dem Mund zu untersuchen, daran zu saugen, zu lecken oder zu kauen).", correct: true, why: "Richtig! Orale Exploration und der Verzehr von fast allem Essbaren sind Kernsymptome." },
          { text: "Hypersexualität (gesteigerte sexuelle Aktivität, teils auf unpassende Objekte oder ungewohnte Partner gerichtet).", correct: true, why: "Richtig! Sowohl bei Rhesusaffen als auch in klinischen Humanfällen beschrieben." },
          { text: "Visuelle Agnosie sowie beim Menschen gehäuft auftretende Krampfanfälle.", correct: true, why: "Richtig! Laut Gaul et al. (2007) gehören Hyperoralität, Hypersexualität, visuelle Agnosie und Krampfanfälle zu den typischen menschlichen Manifestationen." }
        ]
      },
      {
        q: "6. Welche Aussagen zum Lobus limbicus und zum Papez-Kreis (Folien 14–18) sind richtig?",
        options: [
          { text: "Paul Broca (1878) führte den Lobus limbicus bereits explizit als das zentrale Emotionszentrum des Säugetiergehirns ein.", correct: false, why: "Falsch! Broca erwähnte nichts über Emotionen; man vermutete damals vor allem eine Rolle beim Geruchssinn." },
          { text: "Im Papez-Kreis projiziert der Hippocampus über das Faserbündel des Fornix in den Hypothalamus.", correct: true, why: "Richtig! Der Fornix ist die Leitungsbahn vom Hippocampus zum Hypothalamus." },
          { text: "Nach Papez steuert der Hypothalamus den emotionalen Ausdruck, während die Aktivität im cingulären Cortex das emotionale Erleben bestimmt.", correct: true, why: "Richtig! Und der Neocortex trägt die emotionale Färbung bei." },
          { text: "Vom Hypothalamus gelangen die Signale im Papez-Kreis über die anterioren Thalamuskerne zurück zum cingulären Cortex.", correct: true, why: "Richtig! Die anterioren Thalamuskerne bilden die Umschaltstation zum Gyrus cinguli." }
        ]
      },
      {
        q: "7. Was trifft auf das Duchenne-Lächeln und die willkürliche Gesichtskontrolle (Folien 22–24) zu?",
        options: [
          { text: "Mikroexpressionen der wahren Emotion dauern etwa 0,05 Sekunden.", correct: true, why: "Richtig! Sie durchbrechen vorgetäuschte Ausdrücke für rund 0,05 Sekunden." },
          { text: "Beim echten Lächeln (Duchenne-Lächeln) kontrahieren sowohl der M. zygomaticus major als auch der M. orbicularis oculi.", correct: true, why: "Richtig! Beide Muskeln zusammen kennzeichnen echte Freude." },
          { text: "Der laterale Anteil des M. orbicularis oculi lässt sich von fast jedem Menschen mühelos willkürlich kontrahieren, während der M. zygomaticus major unwillkürlich arbeitet.", correct: false, why: "Falsch! Es ist genau umgekehrt: Der M. zygomaticus major ist willkürlich steuerbar, der M. orbicularis oculi dagegen nur bei echter Freude aktiv." },
          { text: "Der M. corrugator supercilii zieht die Mundwinkel beim Lachen nach oben.", correct: false, why: "Falsch! Der M. corrugator supercilii ist der Stirnrunzelmuskel; die Mundwinkel zieht der M. zygomaticus major nach oben." }
        ]
      },
      {
        q: "8. Welche Ergebnisse lieferte die EMG-Studie zur fazialen Mimikry von Weyers et al. (2006) (Folie 25)?",
        options: [
          { text: "Das Betrachten ärgerlicher Gesichter führt automatisch zu einer Aktivierung des M. corrugator supercilii.", correct: true, why: "Richtig! Ärgerliche Gesichter lösen automatisches Stirnrunzeln aus." },
          { text: "Das Betrachten freudiger Gesichter führt zu einer Aktivierung des M. zygomaticus major und einer Deaktivierung des M. corrugator supercilii.", correct: true, why: "Richtig! Beide gegenläufigen Effekte sind in den EMG-Kurven deutlich sichtbar." },
          { text: "Die EMG-Reaktionen auf dynamische Gesichtsausdrücke setzen etwas später ein als auf statische, sind im weiteren Verlauf aber stärker ausgeprägt.", correct: true, why: "Richtig! Dynamische Avatare bewirken ab ca. 1000 ms den stärksten Ausschlag." },
          { text: "Neutrale Gesichter führten zur stärksten Aktivierung beider Gesichtsmuskeln.", correct: false, why: "Falsch! Neutrale Gesichter blieben nahe der Nulllinie." }
        ]
      },
      {
        q: "9. Welche anatomischen Fakten über die Amygdala (Folien 32–33) sind korrekt?",
        options: [
          { text: "Die basolateralen Kerne der Amygdala empfangen visuelle, auditive, gustatorische und taktile Afferenzen.", correct: true, why: "Richtig! Sensorische Eingänge fast aller Modalitäten laufen in den basolateralen Kernen zusammen." },
          { text: "Die corticomedialen Kerne erhalten olfaktorische Eingänge.", correct: true, why: "Richtig! Geruchsinformationen projizieren in die corticomedialen Kerne." },
          { text: "Die Amygdala ist über zwei Bahnen mit dem Hypothalamus verbunden: die ventrale amygdalofugale Bahn und die Stria terminalis.", correct: true, why: "Richtig! Das sind die zwei Hauptverbindungswege zum Hypothalamus." },
          { text: "Die Amygdala liegt im hinteren Okzipitallappen unmittelbar oberhalb des Kleinhirns.", correct: false, why: "Falsch! Sie liegt am vorderen Pol des Temporallappens auf der medialen Seite." }
        ]
      },
      {
        q: "10. Was zeigt der berühmte Fall der Patientin SM (Adolphs et al., 2005) mit bilateraler Amygdalaläsion (Folie 36)?",
        options: [
          { text: "Ohne spezielle Instruktion gelingt es SM nicht, spontan die Augenpartie von Gesichtern zu fixieren, weshalb sie Furcht schlecht erkennt.", correct: true, why: "Richtig! Ihr spontanes Blickmuster klammert die Augenpartie aus." },
          { text: "Wird SM ausdrücklich instruiert, auf die Augenpartie zu blicken, nimmt sie den mimischen Ausdruck von Furcht mit ähnlich hoher Sicherheit wahr wie gesunde Kontrollpersonen.", correct: true, why: "Richtig! Das zeigt, dass das Defizit auf der fehlenden spontanen Aufmerksamkeitslenkung auf die Augen beruht." },
          { text: "SM ist durch die Amygdalaläsion vollständig erblindet und kann überhaupt keine Gesichter mehr sehen.", correct: false, why: "Falsch! Ihre Sehschärfe ist intakt; es handelt sich um ein spezifisches Defizit der Extraktion emotionsbezogener Informationen aus der Augenpartie." },
          { text: "Eine einseitige Läsion im Kleinhirn war die Ursache für ihre Symptome.", correct: false, why: "Falsch! Das Schädel-MRT zeigt symmetrische bilaterale Läsionen der Amygdala." }
        ]
      },
      {
        q: "11. Wie funktioniert der neuronale Schaltkreis für gelernte Angst (Angstkonditionierung, Folie 38)?",
        options: [
          { text: "Die Reize (Ton über Hörrinde, Schock über somatosensorischen Cortex) treffen in den basolateralen Kernen der Amygdala ein und werden zum zentralen Kern weitergeleitet.", correct: true, why: "Richtig! Die Konvergenz findet in den basolateralen Kernen statt, der Ausgang erfolgt über den zentralen Kern." },
          { text: "Vom zentralen Kern projizieren Efferenzen in das periaquäduktale Grau (PAG) im Hirnstamm, um die Verhaltensreaktion auszulösen.", correct: true, why: "Richtig! Das PAG vermittelt die konditionierte Verhaltensreaktion." },
          { text: "Efferenzen zum Hypothalamus rufen die vegetative (autonome) Angstreaktion hervor.", correct: true, why: "Richtig! Der Hypothalamus steuert die autonome Reaktion." },
          { text: "Am bewussten emotionalen Erleben sind Projektionen zur Großhirnrinde beteiligt.", correct: true, why: "Richtig! Wieder sind alle 4 Aussagen zutreffend!" }
        ]
      },
      {
        q: "12. Welche Aussagen zu Wut, Aggression, Lobotomie und Serotonin (Folien 40–47) sind richtig?",
        options: [
          { text: "Bei der transorbitalen Lobotomie wurde vor allem ein starker Abfall des Intelligenzquotienten (IQ) und ein völliger Gedächtnisverlust beobachtet, während die Emotionen völlig unverändert blieben.", correct: false, why: "Falsch! IQ und Gedächtnis blieben weitgehend erhalten, aber es kam zu emotionaler Abstumpfung, Verlust moralischer Maßstäbe und Planungsproblemen." },
          { text: "Nach der Serotoninmangelhypothese sind Serotoninaktivität (z.B. gemessen über den Metaboliten 5-HIES im Liquor) und Aggression invers (negativ) miteinander verknüpft.", correct: true, why: "Richtig! Weniger Serotoninaktivität/5-HIES korreliert mit höherer Aggression." },
          { text: "Serotonerge Neuronen sitzen in den Raphekernen im Hirnstamm und senden Axone über das mediale Vorderhirnbündel u.a. in den Hypothalamus.", correct: true, why: "Richtig! Das ist die neuroanatomische Basis der serotonergen Aggressionsregulation." },
          { text: "Im Experiment von Pribram et al. (1954) stieg ein rangniedriger Rhesusaffe nach einer bilateralen Amygdalaläsion sofort zum dominantesten Alpha-Tier auf.", correct: false, why: "Falsch! Umgekehrt: Der dominanteste Affe fiel nach bilateraler Amygdalaläsion auf den untersten Platz der Rangordnung." }
        ]
      },
      {
        q: "13. Welche Zuordnungen zur Emotionsregulation (Etkin et al., 2015) und den aktuellen Ansichten (Folien 49–50) stimmen?",
        options: [
          { text: "Dorsolateraler PFC (dlPFC), ventrolateraler PFC (vlPFC), SMA/pre-SMA und Parietalkortex sind an der expliziten Emotionsregulation (z.B. cognitive reappraisal) beteiligt.", correct: true, why: "Richtig! Diese blau markierten Regionen steuern die bewusste, explizite Neubewertung." },
          { text: "Ventraler ACC (vACC) und ventromedialer PFC (vmPFC) sind an der impliziten Emotionsregulation beteiligt.", correct: true, why: "Richtig! vACC und vmPFC vermitteln die implizite Regulation (z.B. Unterdrückung von Furcht)." },
          { text: "Dorsaler ACC (dACC), Insula, Amygdala und PAG werden der emotionalen Reaktivität zugeordnet.", correct: true, why: "Richtig! Diese vier Strukturen (rot markiert) bilden das Netzwerk für emotionale Reaktivität." },
          { text: "Moderne bildgebende Studien belegen eindeutig, dass jede Emotion exklusiv in einer einzigen Gehirnregion entsteht, die bei keinen anderen psychologischen Prozessen aktiv ist.", correct: false, why: "Falsch! Laut Folie 50 ist keine Hirnregion exklusiv für eine Emotion zuständig und alle emotional aktivierten Areale sind auch an anderen Prozessen beteiligt." }
        ]
      }
    ];

    let currentQ = 0;
    let selectedOpts = new Set();
    let isResolved = false;
    let totalScore = 0;

    function renderQuiz() {
      const stage = document.getElementById('quiz-stage');
      if (currentQ >= quizQuestions.length) {
        stage.innerHTML = `
          <div style="text-align:center; padding: 30px 10px;">
            <h2 style="font-size:2rem; margin-bottom:12px;">🏆 Boss-Quiz gemeistert!</h2>
            <p style="font-size:1.15rem; color:#cbd5e1; margin-bottom:24px;">
              Du hast <strong>${totalScore} von ${quizQuestions.length}</strong> Multiple-Select-Fragen komplett fehlerfrei geknackt und insgesamt <strong>${xp} XP</strong> gesammelt!
            </p>
            <button class="action-btn" onclick="restartQuiz()">🔄 Quiz-Arena neu starten</button>
          </div>
        `;
        fireConfetti();
        return;
      }

      const item = quizQuestions[currentQ];
      selectedOpts.clear();
      isResolved = false;

      stage.innerHTML = `
        <div class="quiz-header-bar">
          <span class="stage-badge">Frage ${currentQ + 1} von ${quizQuestions.length}</span>
          <div class="multi-hint">🎲 Geheim-Modus: 1, 2, 3 oder 4 Antworten können richtig sein!</div>
        </div>
        <div class="question-text">${item.q}</div>
        <div class="feedback-banner" id="quiz-feedback"></div>
        <div class="options-list">
          ${item.options.map((opt, idx) => `
            <div class="option-card" id="opt-${idx}" onclick="toggleOption(${idx})">
              <div class="checkbox-ui" id="chk-${idx}"></div>
              <div class="option-content">
                <div>${opt.text}</div>
                <div class="option-rationale" id="rat-${idx}">${opt.why}</div>
              </div>
            </div>
          `).join('')}
        </div>
        <div style="display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:12px;">
          <button class="action-btn" id="btn-resolve" onclick="resolveQuestion()">🔍 Auflösen & Prüfen</button>
          <button class="action-btn" id="btn-next" onclick="nextQuestion()" style="display:none; background:linear-gradient(135deg, #10b981, #059669);">➡️ Nächste Frage</button>
        </div>
      `;
    }

    function toggleOption(idx) {
      if (isResolved) return;
      const card = document.getElementById('opt-' + idx);
      const chk = document.getElementById('chk-' + idx);
      if (selectedOpts.has(idx)) {
        selectedOpts.delete(idx);
        card.classList.remove('selected');
        chk.textContent = '';
      } else {
        selectedOpts.add(idx);
        card.classList.add('selected');
        chk.textContent = '✓';
      }
    }

    function resolveQuestion() {
      if (isResolved) return;
      if (selectedOpts.size === 0) {
        alert("Bitte wähle mindestens eine Antwort aus, bevor du auf Auflösen klickst!");
        return;
      }
      isResolved = true;
      const item = quizQuestions[currentQ];
      let allPerfect = true;
      let correctCount = 0;

      item.options.forEach((opt, idx) => {
        const card = document.getElementById('opt-' + idx);
        const rat = document.getElementById('rat-' + idx);
        const chk = document.getElementById('chk-' + idx);
        card.classList.add('locked');
        rat.style.display = 'block';

        if (opt.correct) correctCount++;

        if (opt.correct && selectedOpts.has(idx)) {
          card.classList.add('correct-hit');
          chk.textContent = '✓';
        } else if (opt.correct && !selectedOpts.has(idx)) {
          card.classList.add('missed-correct');
          chk.textContent = '!';
          allPerfect = false;
        } else if (!opt.correct && selectedOpts.has(idx)) {
          card.classList.add('wrong-pick');
          chk.textContent = '✗';
          allPerfect = false;
        }
      });

      const fb = document.getElementById('quiz-feedback');
      fb.style.display = 'block';
      if (allPerfect) {
        streak++;
        totalScore++;
        const gained = 40 + streak * 10;
        addXP(gained);
        fb.style.background = 'rgba(16, 185, 129, 0.2)';
        fb.style.border = '1px solid #10b981';
        fb.style.color = '#6ee7b7';
        fb.innerHTML = `🎉 <strong>Volltreffer!</strong> Bei dieser Frage waren genau <strong>${correctCount}</strong> Antworten richtig – du hast alle exakt erkannt! (+${gained} XP)`;
        fireConfetti();
      } else {
        streak = 0;
        addXP(10);
        fb.style.background = 'rgba(245, 158, 11, 0.2)';
        fb.style.border = '1px solid #f59e0b';
        fb.style.color = '#fde047';
        fb.innerHTML = `💡 <strong>Aufgelöst:</strong> Bei dieser Frage waren <strong>${correctCount}</strong> Antworten richtig. Grün = richtig gewählt, Gelb = richtige Antwort übersehen, Rot = falsche Option gewählt. (+10 Lern-XP)`;
      }

      document.getElementById('streak-val').textContent = streak;
      document.getElementById('btn-resolve').style.display = 'none';
      document.getElementById('btn-next').style.display = 'inline-block';
    }

    function nextQuestion() {
      currentQ++;
      renderQuiz();
    }

    function restartQuiz() {
      currentQ = 0;
      totalScore = 0;
      renderQuiz();
    }

    function switchMode(mode) {
      document.getElementById('btn-mode-learn').classList.toggle('active', mode === 'learn');
      document.getElementById('btn-mode-quiz').classList.toggle('active', mode === 'quiz');
      document.getElementById('view-learn').style.display = mode === 'learn' ? 'block' : 'none';
      document.getElementById('view-quiz').style.display = mode === 'quiz' ? 'block' : 'none';
      if (mode === 'quiz') renderQuiz();
    }

    // Init App
    selectLevel(0);
  </script>
</body>
</html>

56,257 chars · codepastes.com