scripts.js

    // ===== Helpers =====
    const $ = (sel, el=document) => el.querySelector(sel);
    const $$ = (sel, el=document) => Array.from(el.querySelectorAll(sel));
    const save = (k,v) => localStorage.setItem(k, JSON.stringify(v));
    const load = (k, d=null) => JSON.parse(localStorage.getItem(k) || JSON.stringify(d));
    const fmt = s => s.trim().replace(/\s+/g,' ');
    const esc = s => s.replace(/[&<>]/g, c=>({'&':'&amp;','<':'&lt;','>':'&gt;'}[c]));

    // ===== Theme Toggle =====
    const themeBtn = $('#themeToggle');
    themeBtn.addEventListener('click', () => {
      const cur = document.documentElement.getAttribute('data-theme') || 'light';
      const next = cur === 'light' ? 'dark' : 'light';
      document.documentElement.setAttribute('data-theme', next);
      themeBtn.setAttribute('aria-pressed', String(next==='dark'));
      save('ik-theme', next);
    });
    const savedTheme = load('ik-theme');
    if(savedTheme){ document.documentElement.setAttribute('data-theme', savedTheme); themeBtn.setAttribute('aria-pressed', String(savedTheme==='dark')); }

    // ===== Smooth scroll =====
    $$('a[href^="#"]').forEach(a=>a.addEventListener('click', e=>{ e.preventDefault(); document.querySelector(a.getAttribute('href')).scrollIntoView({behavior:'smooth'}); }));

    // ===== Hero sparkle effect =====
    const heroCard = $('#hero .hero-card');
    const sparkle = $('.sparkle', heroCard);
    heroCard.addEventListener('pointermove', e => {
      const r = heroCard.getBoundingClientRect();
      sparkle.style.setProperty('--x', ((e.clientX - r.left)/r.width*100).toFixed(1)+'%');
      sparkle.style.setProperty('--y', ((e.clientY - r.top)/r.height*100).toFixed(1)+'%');
    });

    // ===== Decorative Orb Canvas =====
    (function orbScene(){
      const c = $('#orb'); const ctx = c.getContext('2d');
      let w = c.width = c.clientWidth*2, h = c.height = c.clientHeight*2;
      const dpr = window.devicePixelRatio || 1; c.width = c.clientWidth*dpr; c.height = c.clientHeight*dpr; ctx.scale(dpr,dpr); w=c.clientWidth; h=c.clientHeight;
      const dots = Array.from({length: 90}, (_,i)=>({
        x: Math.random()*w, y: Math.random()*h, r: Math.random()*2+0.6,
        vx: (Math.random()-.5)*.6, vy:(Math.random()-.5)*.6,
        hue: 240 + Math.sin(i)*60
      }));
      function step(){
        ctx.clearRect(0,0,w,h);
        const grad = ctx.createLinearGradient(0,0,w,h);
        grad.addColorStop(0,'rgba(124,92,255,.18)'); grad.addColorStop(1,'rgba(16,212,210,.18)');
        ctx.fillStyle = grad; ctx.fillRect(0,0,w,h);
        dots.forEach((p,i)=>{
          p.x+=p.vx; p.y+=p.vy; if(p.x<0||p.x>w) p.vx*=-1; if(p.y<0||p.y>h) p.vy*=-1;
          ctx.beginPath(); ctx.arc(p.x,p.y,p.r,0,Math.PI*2);
          ctx.fillStyle = `hsla(${p.hue}, 80%, 60%, .9)`; ctx.fill();
          dots.forEach((q,j)=>{ if(i<j){ const dx=p.x-q.x, dy=p.y-q.y; const d=Math.hypot(dx,dy); if(d<120){ ctx.beginPath(); ctx.moveTo(p.x,p.y); ctx.lineTo(q.x,q.y); ctx.strokeStyle=`rgba(255,255,255,${(120-d)/900})`; ctx.lineWidth=1; ctx.stroke(); } } });
        });
        requestAnimationFrame(step);
      }
      step();
      addEventListener('resize', ()=>{ w=c.clientWidth; h=c.clientHeight; });
    })();

    // ===== Recherchepfad Steps =====
    const steps = [
      {t:'Thema skizzieren', k:'step1', info:`<p><strong>Beispiel:</strong> Klimawandel in Städten – Hitzeinseln und Gesundheit.</p><p>Notiere freie Stichworte ohne Struktur.</p>`, render:() => `
        <p>Worum geht es grob? Schreibe ein paar Stichworte.</p>
        <textarea id="s1text" placeholder="z.B. Auswirkungen des Klimawandels auf urbane Hitzeinseln"></textarea>
        <div class="controls"><button class="btn btn-primary" data-next>Weiter</button></div>`},
      {t:'Forschungsfrage schärfen', k:'step2', info:`<p><strong>Beispiel:</strong> Wie beeinflusst grüne Infrastruktur die Intensität urbaner Hitzeinseln?</p><p>Tipp: Nutze W‑Fragen oder PICO, um den Fokus zu schärfen.</p>`, render:() => `
        <p>Formuliere eine klare, beantwortbare Frage.</p>
        <input id="s2text" class="input" placeholder="Wie beeinflusst …? Unter welchen Bedingungen …?">
        <div class="controls"><div class="hint">Tipp: Nutze Rahmen wie <strong>PICO</strong> (Medizin) oder <strong>5W</strong> (wer/was/wo/wann/warum).</div><button class="btn btn-primary" data-next>Weiter</button></div>`},
      {t:'Suchbegriffe & Synonyme', k:'step3', info:`<p>Kernbegriff: "urban heat island".</p><p>Synonyme: Stadtklima, UHI, city warming.</p>`, render:() => `
        <p>Notiere 2–3 Kernbegriffe und je 2 Synonyme.</p>
        <div class="chips"><span class="chip">Beispiel: "urban heat island" · UHI</span><span class="chip">Hitzeinsel</span><span class="chip">Stadtklima</span></div>
        <textarea id="s3text" placeholder="Kernbegriffe; Synonyme"></textarea>
        <div class="controls"><button class="btn btn-primary" data-next>Weiter</button></div>`},
      {t:'Operatoren & Felder', k:'step4', info:`<p><code>("urban heat island" OR UHI) AND climat* NOT vegetation</code></p><p>AND verbindet Konzepte, OR fügt Synonyme hinzu, NOT schließt Begriffe aus.</p>`, render:() => `
        <p>Lege Operatoren fest (AND/OR/NOT), nutze Anführungszeichen für Phrasen und Trunkierungen (z. B. climat*).</p>
        <div class="row"><label><input type="checkbox" id="s4phrase"> Phrasen nutzen</label><label><input type="checkbox" id="s4trunc"> Trunkierung</label></div>
        <div class="controls"><button class="btn btn-primary" data-next>Weiter</button></div>`},
      {t:'Datenbanken wählen', k:'step5', info:`<p><strong>Interdisziplinär:</strong> Web of Science, Scopus.</p><p><strong>Medizin:</strong> PubMed.</p><p><strong>Geisteswiss.:</strong> JSTOR.</p>`, render:() => `
        <p>Welche Quellen passen zum Fach?</p>
        <div class="row"><label><input type="checkbox" id="db1"> Web of Science</label><label><input type="checkbox" id="db2"> Scopus</label><label><input type="checkbox" id="db3"> PubMed</label><label><input type="checkbox" id="db4"> JSTOR</label></div>
        <div class="controls"><button class="btn btn-primary" data-next>Weiter</button></div>`},
      {t:'Suche durchführen', k:'step6', info:`<p>Nutze Filter wie Erscheinungsjahr, Sprache oder Dokumenttyp, um Ergebnisse einzugrenzen.</p>`, render:() => `
        <p>Springe ins <a href="#labor">Suchlabor</a> und erstelle deine Abfrage. Notiere hier Eckdaten.</p>
        <textarea id="s6text" placeholder="Genutzte Begriffe, Filter, Zeitraum …"></textarea>
        <div class="controls"><button class="btn btn-primary" data-next>Weiter</button></div>`},
      {t:'Treffer bewerten', k:'step7', info:`<p>Frage dich: Ist die Quelle peer‑reviewt? Sind Methoden nachvollziehbar?</p>`, render:() => `
        <p>Nutze den <a href="#quellen">Quellen‑Check</a>. Notiere 1–2 Qualitätskriterien.</p>
        <textarea id="s7text" placeholder="z.B. Peer‑Review, Impact, Methodenqualität"></textarea>
        <div class="controls"><button class="btn btn-primary" data-next>Weiter</button></div>`},
      {t:'Literatur verwalten', k:'step8', info:`<p>Beispiel: Zotero‑Ordner "Klimawandel" &gt; "Hitzeinseln". Tags: UHI, Stadtplanung.</p>`, render:() => `
        <p>Wie organisierst du Nachweise? (z. B. Zotero, EndNote). Notiere Ordner/Tags.</p>
        <textarea id="s8text" placeholder="Ordnerstruktur, Tagging‑Schema …"></textarea>
        <div class="controls"><button class="btn btn-primary" data-next>Weiter</button></div>`},
      {t:'Korrekt zitieren', k:'step9', info:`<p><strong>APA-Beispiel:</strong> Müller, T. (2023). Stadtklima im Wandel. <em>Journal für Umweltforschung, 12</em>(3), 45-60.</p>`, render:() => `
        <p>Erstelle im <a href="#zitieren">Zitiertrainer</a> mindestens einen Eintrag.</p>
        <div class="controls"><button class="btn btn-primary" data-next>Fertig</button></div>`},
    ];

    const stepsEl = $('.steps'); const panelEl = $('#panel');
    const modal = $('#infoModal'); const modalTitle = $('#modalTitle'); const modalBody = $('#modalBody'); const modalClose = $('#modalClose');
    let lastFocus;

    function openModal(title, html){
      lastFocus = document.activeElement;
      modalTitle.textContent = title;
      modalBody.innerHTML = html;
      modal.classList.remove('hidden');
      modal.removeAttribute('aria-hidden');
      const focusables = Array.from(modal.querySelectorAll('button, [href], input, textarea, select, [tabindex]:not([tabindex="-1"])'));
      const first = focusables[0], last = focusables[focusables.length-1];
      function trap(e){
        if(e.key==='Tab'){ if(!focusables.length){ e.preventDefault(); return; } if(e.shiftKey && document.activeElement===first){ e.preventDefault(); last.focus(); } if(!e.shiftKey && document.activeElement===last){ e.preventDefault(); first.focus(); } }
        else if(e.key==='Escape'){ closeModal(); }
      }
      modal._trap = trap; modal.addEventListener('keydown', trap);
      first?.focus();
    }
    function closeModal(){
      modal.classList.add('hidden');
      modal.setAttribute('aria-hidden','true');
      modal.removeEventListener('keydown', modal._trap);
      lastFocus?.focus();
    }
    modalClose.addEventListener('click', closeModal);
    modal.addEventListener('click', e=>{ if(e.target===modal) closeModal(); });

    function renderSteps(){
      stepsEl.innerHTML = steps.map((s,i)=>`<button role="tab" data-i="${i}" ${i===0?'aria-current="step"':''}><span class="index">${i+1}</span><span>${s.t}</span></button>`).join('');
      panelEl.innerHTML = steps[0].render();
      attachPanelHandlers();
      stepsEl.addEventListener('click', e=>{
        const btn = e.target.closest('button[data-i]'); if(!btn) return; const i = +btn.dataset.i; selectStep(i);
      });
    }

    function selectStep(i){
      $$('button[aria-current]', stepsEl).forEach(b=>b.removeAttribute('aria-current'));
      const btn = $(`button[data-i="${i}"]`, stepsEl); if(btn) btn.setAttribute('aria-current','step');
      panelEl.innerHTML = steps[i].render();
      const infoBtn = document.createElement('button');
      infoBtn.className='info-btn'; infoBtn.type='button'; infoBtn.setAttribute('aria-label','Beispiel anzeigen'); infoBtn.setAttribute('aria-haspopup','dialog'); infoBtn.innerHTML='ℹ️';
      infoBtn.addEventListener('click',()=>openModal(steps[i].t, steps[i].info));
      panelEl.appendChild(infoBtn);
      panelEl.classList.remove('fade-in'); void panelEl.offsetWidth; panelEl.classList.add('fade-in');
      attachPanelHandlers();
      save('ik-active-step', i);
    }

    function attachPanelHandlers(){
      $('[data-next]', panelEl)?.addEventListener('click', ()=>{
        const i = +$('button[aria-current]', stepsEl).dataset.i; if(i < steps.length-1) selectStep(i+1);
        updateProgress();
      });
      // Persist textareas & inputs on input
      $$('textarea, input[type="text"], input[type="checkbox"]', panelEl).forEach(el=>{
        const key = 'ik-'+(steps.find(s=>s.render().includes(el.id))?.k || el.id)+'-'+el.id;
        const val = load(key);
        if(val!==null){ if(el.type==='checkbox') el.checked = val; else el.value = val; }
        el.addEventListener('input', ()=>{ save(key, el.type==='checkbox' ? el.checked : el.value); updateProgress(); });
        el.addEventListener('change', ()=>{ save(key, el.type==='checkbox' ? el.checked : el.value); updateProgress(); });
      });
    }

    // Restore active step
    renderSteps(); const active = load('ik-active-step', 0); selectStep(Math.min(active, steps.length-1));

    // ===== Progress =====
    function updateProgress(){
      // Count filled items across steps
      let done = 0; const needed = 9;
      if(load('ik-step1-s1text','').length>3) done++;
      if(load('ik-step2-s2text','').length>3) done++;
      if(load('ik-step3-s3text','').length>3) done++;
      if(load('ik-step4-s4phrase',false) || load('ik-step4-s4trunc',false)) done++;
      const dbs = ['db1','db2','db3','db4'].some(id=>load('ik-step5-'+id,false)); if(dbs) done++;
      if(load('ik-step6-s6text','').length>3) done++;
      if(load('ik-step7-s7text','').length>3) done++;
      if(load('ik-step8-s8text','').length>3) done++;
      if(load('ik-citations',[]).length>0) done++;
      const pct = Math.round(done/needed*100);
      $('#progress').textContent = pct+'%';
      $('#stat-steps').textContent = done+'/'+needed;
      // Draw arc roughly proportional
      const arc = $('#progress-arc');
      const a = Math.PI*2 * (pct/100); const x = 12 + 10*Math.sin(a); const y = 12 - 10*Math.cos(a);
      arc.setAttribute('d', `M12 2 A 10 10 0 ${pct>50?1:0} 1 ${x} ${y}`);
    }
    updateProgress();

    // ===== Suchlabor =====
    const groups = {1: load('ik-g1',[]), 2: load('ik-g2',[]), 3: load('ik-g3',[])};
    function renderTags(){ [1,2,3].forEach(g=>{ const box = $('#g'+g); box.innerHTML = (groups[g]||[]).map((t,i)=>`<span class="tag">${t}<button aria-label="Entfernen" data-del="${g}" data-i="${i}">×</button></span>`).join(''); }); buildQuery(); }
    function addTag(g, val){ if(!val) return; groups[g] = groups[g]||[]; groups[g].push(fmt(val)); save('ik-g'+g, groups[g]); renderTags(); updateProgress(); }
    function delTag(g,i){ groups[g].splice(i,1); save('ik-g'+g, groups[g]); renderTags(); updateProgress(); }
    renderTags();
    $$('[data-add]').forEach(btn=>btn.addEventListener('click', ()=>{ const g=+btn.dataset.add; const inp = $('#g'+g+'input'); addTag(g, inp.value); inp.value=''; inp.focus(); }));
    ['g1input','g2input','g3input'].forEach(id=>{ const el=$('#'+id); el.addEventListener('keydown', e=>{ if(e.key==='Enter'){ e.preventDefault(); el.nextElementSibling.click(); } }); });

    // Synonym-Suche via Datamuse API
    async function fetchSynonyms(term){
      try{
        const res = await fetch(`https://api.datamuse.com/words?ml=${encodeURIComponent(term)}&max=5`);
        const data = await res.json();
        return data.map(d=>d.word);
      }catch(e){ return []; }
    }
    function attachSynonyms(id,g){
      const inp = $('#'+id);
      const box = document.createElement('div');
      box.className = 'suggestions hidden';
      inp.parentNode.appendChild(box);
      let timer;
      inp.addEventListener('input', ()=>{
        const term = inp.value.trim();
        clearTimeout(timer);
        if(term.length<3){ box.innerHTML=''; box.classList.add('hidden'); return; }
        timer = setTimeout(async ()=>{
          const syns = await fetchSynonyms(term);
          if(syns.length){
            box.innerHTML = syns.map(s=>`<div>${s}</div>`).join('');
            box.style.left = inp.offsetLeft+'px';
            box.style.width = inp.offsetWidth+'px';
            box.classList.remove('hidden');
          } else {
            box.innerHTML=''; box.classList.add('hidden');
          }
        }, 350);
      });
      box.addEventListener('click', e=>{
        const item = e.target.closest('div');
        if(!item) return;
        addTag(g, item.textContent);
        box.innerHTML=''; box.classList.add('hidden'); inp.focus();
      });
      document.addEventListener('click', e=>{ if(!box.contains(e.target) && e.target!==inp){ box.classList.add('hidden'); }});
    }
    attachSynonyms('g1input',1);
    attachSynonyms('g2input',2);
    attachSynonyms('g3input',3);
    $('#usePhrase').checked = load('ik-usePhrase', false); $('#useTrunc').checked = load('ik-useTrunc', true);
    $('#usePhrase').addEventListener('change', e=>{ save('ik-usePhrase', e.target.checked); buildQuery(); updateProgress(); });
    $('#useTrunc').addEventListener('change', e=>{ save('ik-useTrunc', e.target.checked); buildQuery(); updateProgress(); });

    function maybeTrunc(w){ if(!$('#useTrunc').checked) return w; return w.length>=4 ? (w.replace(/\*+$/,'')+'*') : w; }
    function maybeQuote(w){ if(!$('#usePhrase').checked) return w; return /\s/.test(w) ? `"${w}"` : w; }

    function buildQuery(){
      const or = g => (groups[g]||[]).map(w=> maybeQuote(maybeTrunc(w))).filter(Boolean).join(' OR ');
      const a = or(1), b = or(2), c = or(3);
      let q = '';
      if(a) q += '('+a+')';
      if(b) q += (q?' AND ':'')+'(' + b + ')';
      if(c) q += (q?' NOT ':'NOT ') + '(' + c + ')';
      $('#query').textContent = q || '(Begriffe erscheinen hier …)';
      save('ik-query', q);
    }
    $('#copyQuery').addEventListener('click', ()=>{ navigator.clipboard.writeText($('#query').textContent); $('#copyQuery').textContent='✔️ Kopiert'; setTimeout(()=>$('#copyQuery').textContent='📋 Abfrage kopieren',1200); });
    $('#saveQuery').addEventListener('click', ()=>{ const journal = load('ik-journal', []); journal.push({ts:Date.now(), type:'query', q: load('ik-query','')}); save('ik-journal', journal); $('#stat-journal').textContent = journal.length; renderJournal(); });

    // ===== Quellen-Check =====
    const deck = [
      {t:'Artikel in "Nature" (peer‑reviewt)', cat:'high'},
      {t:'ArXiv‑Preprint (unbegutachtet)', cat:'medium'},
      {t:'Wikipedia‑Artikel mit Quellen', cat:'medium'},
      {t:'Unternehmens‑Blog (Marketing)', cat:'low'},
      {t:'Lehrbuchkapitel (anerkannter Verlag)', cat:'high'},
      {t:'X/Twitter‑Thread ohne Belege', cat:'low'},
      {t:'Konferenz‑Proceedings (IEEE)', cat:'high'},
      {t:'Journal ohne Impact‑Nachweis', cat:'low'}
    ];

    const cols = $$('.col');
    function createCard(item){ const el = document.createElement('div'); el.className='card'; el.draggable=true; el.textContent=item.t; el.dataset.cat=item.cat; el.setAttribute('role','listitem'); return el; }
    function initBoard(){ $('#deck').innerHTML=''; cols.forEach(c=>{ c.innerHTML = `<h4>${c.querySelector('h4').textContent}</h4><p class="hint">${c.querySelector('.hint').textContent}</p>`; c.dataset.col = c.getAttribute('data-col'); c.addEventListener('dragover', e=>{ e.preventDefault();}); c.addEventListener('drop', e=>{ const id = e.dataTransfer.getData('text/plain'); const card = document.getElementById(id); c.appendChild(card); updateProgress();}); });
      // Place shuffled cards under the board
      const wrap = document.createElement('div'); wrap.className='row'; wrap.style.marginTop='.8rem';
      deck.sort(()=>Math.random()-.5).forEach((item,i)=>{ const card = createCard(item); card.id='card'+i; card.addEventListener('dragstart', e=>{ e.dataTransfer.setData('text/plain', card.id);}); wrap.appendChild(card); });
      $('#quellen').appendChild(wrap);
    }
    initBoard();
    $('#resetBoard').addEventListener('click', ()=>{ $$('#quellen .row').at(-1)?.remove(); initBoard(); $('#boardResult').textContent=''; });
    $('#checkBoard').addEventListener('click', ()=>{
      let good=0, total=deck.length; cols.forEach(col=>{ $$('.card', col).forEach(card=>{ if(card.dataset.cat===col.dataset.col) good++; }); });
      const msg = good===total ? `Perfekt! ${good}/${total} richtig ✅` : `${good}/${total} korrekt – prüfe Begründungen und Evidenzarten.`;
      $('#boardResult').textContent = msg;
      updateProgress();
    });

    // ===== Zitiertrainer =====
    function parseAuthors(str){
      return fmt(str).split(';').map(s=>s.trim()).filter(Boolean);
    }
    function citeAPA(a,title,container,year,vol,iss,pages,pub,doi){
      const authors = a.map(n=>{ const [last, first=''] = n.split(',').map(s=>s.trim()); return first? `${last}, ${first[0]}.` : last; }).join(', ');
      const part = container? ` <em>${container}</em>${vol?`, ${vol}`:''}${iss?`(${iss})`:''}${pages?`, ${pages}`:''}.` : '';
      const tail = doi? ` https://doi.org/${doi.replace(/^https?:\/\/doi\.org\//,'')}` : '';
      return `${authors} (${year}). ${title}.${part}${pub?` ${pub}.`:''}${tail}`.trim();
    }
    function citeChicago(a,title,container,year,vol,iss,pages,pub,doi){
      const authors = a.join(', ');
      const part = container? ` <em>${container}</em> ${vol?vol:''}${iss?`(${iss})`:''}${pages?`: ${pages}`:''}.` : '';
      const tail = doi? ` https://doi.org/${doi.replace(/^https?:\/\/doi\.org\//,'')}` : '';
      return `${authors}. ${year}. "${title}."${part}${pub?` ${pub}.`:''}${tail}`.trim();
    }
    function citeMLA(a,title,container,year,vol,iss,pages,pub,doi){
      const [first,...rest]=a; const auth = first? first.split(',')[0] + (rest.length? ', et al.': '') : '';
      const part = container? ` <em>${container}</em>${vol?`, vol. ${vol}`:''}${iss?`, no. ${iss}`:''}${pages?`, pp. ${pages}`:''}, ${year}.` : `, ${year}.`;
      const tail = doi? ` https://doi.org/${doi.replace(/^https?:\/\/doi\.org\//,'')}` : '';
      return `${auth}. "${title}."${part}${pub?` ${pub}.`:''}${tail}`.trim();
    }

    function makeCitation(){
      const style = $('#style').value; const a=parseAuthors($('#authors').value);
      const t=$('#title').value, c=$('#container').value, y=$('#year').value, v=$('#volume').value, i=$('#issue').value, p=$('#pages').value, pub=$('#publisher').value, doi=$('#doi').value;
      let out='';
      if(style==='apa') out=citeAPA(a,t,c,y,v,i,p,pub,doi);
      if(style==='chicago') out=citeChicago(a,t,c,y,v,i,p,pub,doi);
      if(style==='mla') out=citeMLA(a,t,c,y,v,i,p,pub,doi);
      $('#citeOut').textContent = out || '—';
      return out;
    }
    $('#makeCite').addEventListener('click', makeCitation);
    $('#copyCite').addEventListener('click', ()=>{ navigator.clipboard.writeText($('#citeOut').textContent); $('#copyCite').textContent='✔️ Kopiert'; setTimeout(()=>$('#copyCite').textContent='📋 Zitat kopieren',1200);});
    $('#saveCite').addEventListener('click', ()=>{ const list = load('ik-citations', []); const c = makeCitation(); if(c && c!=='—'){ list.push({ts:Date.now(), c}); save('ik-citations', list); const journal = load('ik-journal', []); journal.push({ts:Date.now(), type:'citation', c}); save('ik-journal', journal); $('#stat-journal').textContent = journal.length; updateProgress(); renderJournal(); }});

    // ===== Quiz =====
    const questions = [
      {q:'Welche Abfrage findet die meisten Synonyme?', a:['climate change AND global warming','"climate change" OR global warming','climate change NOT global warming'], c:1, e:'OR verknüpft Synonyme und erweitert die Suche.'},
      {q:'Wozu dienen Anführungszeichen in der Suche?', a:['Großschreibung erzwingen','Phrasen exakt suchen','Stoppwörter entfernen'], c:1, e:'Phrasen wie "urban heat island" werden als Einheit gesucht.'},
      {q:'Welche Quelle ist typischerweise peer‑reviewt?', a:['Lehrbuch','Fachartikel in Journal','Blogbeitrag'], c:1, e:'Fachartikel in wissenschaftlichen Journals durchlaufen Peer‑Review.'},
      {q:'Was bewirkt NOT?', a:['Schließt Begriffe aus','Ersetzt Synonyme','Sortiert Ergebnisse'], c:0, e:'NOT entfernt Treffer, die unerwünschte Begriffe enthalten.'},
      {q:'Was bedeutet Trunkierung (z. B. climat*)?', a:['Suche nach Rechtschreibung','Suche nach Wortstämmen','Nur in Titeln suchen'], c:1, e:'Trunkierung erfasst Wortvarianten (climate, climatic …).'},
      {q:'Was ist ein gutes Kriterium für Quellenqualität?', a:['Anzahl der Likes','Nachvollziehbare Methode','Werbliche Sprache'], c:1, e:'Transparente Methode und Daten sind Qualitätsmerkmale.'}
    ];
    $('#totalQ').textContent = questions.length;
    function renderQuiz(){
      const box = $('#quizBox'); box.innerHTML=''; const answersState = load('ik-quiz-answers', {}); let score=0;
      questions.forEach((it, idx)=>{
        const q = document.createElement('div'); q.className='q';
        q.innerHTML = `<div><strong>${idx+1}. ${it.q}</strong></div><div class="answers">${it.a.map((opt,i)=>`<button data-q="${idx}" data-i="${i}">${opt}</button>`).join('')}</div><div class="hint" id="exp${idx}"></div>`;
        box.appendChild(q);
      });
      box.addEventListener('click', e=>{
        const btn = e.target.closest('button[data-q]'); if(!btn) return;
        const qi = +btn.dataset.q, ai = +btn.dataset.i; const corr = questions[qi].c;
        const exp = $('#exp'+qi);
        $$("button[data-q='"+qi+"']", box).forEach(b=>b.disabled=true);
        if(ai===corr){ btn.classList.add('correct'); exp.innerHTML = `<span class="ok">Richtig.</span> ${questions[qi].e}`; } else { btn.classList.add('wrong'); exp.innerHTML = `<span class="danger">Leider falsch.</span> ${questions[qi].e}`; }
        const st = load('ik-quiz-answers', {}); st[qi]=ai; save('ik-quiz-answers', st);
        updateScore();
      }, {once:false});
      updateScore();
    }
    function updateScore(){
      const st = load('ik-quiz-answers', {}); let s=0; Object.entries(st).forEach(([qi,ai])=>{ if(+ai===questions[+qi].c) s++;}); $('#score').textContent = s; $('#stat-score').textContent = s+'/'+questions.length; }
    renderQuiz();
    $('#restartQuiz').addEventListener('click', ()=>{ localStorage.removeItem('ik-quiz-answers'); renderQuiz(); });

    // ===== Journal / Notes / Export =====
    const notes = $('#notes'); notes.value = load('ik-notes','');
    function saveNotes(){ save('ik-notes', notes.value); const journal = load('ik-journal', []); journal.push({ts:Date.now(), type:'note', text: notes.value.slice(0,160)+'…'}); save('ik-journal', journal); $('#stat-journal').textContent = journal.length; renderJournal(); }
    $('#saveNotes').addEventListener('click', saveNotes);

    function renderJournal(){
      const box = $('#journalList'); if(!box) return;
      const list = load('ik-journal', []).sort((a,b)=>b.ts-a.ts);
      if(!list.length){ box.innerHTML = '<p class="hint">Noch keine Einträge gespeichert.</p>'; return; }
      box.innerHTML = list.map(it=>{
        if(it.type==='query') return `<div class="journal-entry">🔎 <code>${esc(it.q||'')}</code></div>`;
        if(it.type==='citation') return `<div class="journal-entry">📄 ${esc(it.c||'')}</div>`;
        if(it.type==='note') return `<div class="journal-entry">📝 ${esc(it.text||'')}</div>`;
        return '';
      }).join('');
    }

    function exportMarkdown(){
      const md = [];
      md.push('# Lernjournal – Informationskompetenz');
      md.push('');
      md.push('## Recherchepfad');
      md.push(`1. Thema: ${load('ik-step1-s1text','—')}`);
      md.push(`2. Forschungsfrage: ${load('ik-step2-s2text','—')}`);
      md.push(`3. Begriffe/Synonyme: ${load('ik-step3-s3text','—')}`);
      md.push(`4. Operatoren: Phrase=${load('ik-step4-s4phrase',false)}, Trunk=${load('ik-step4-s4trunc',false)}`);
      const dbs = ['db1','db2','db3','db4'].filter(id=>load('ik-step5-'+id,false)).join(', ');
      md.push(`5. Datenbanken: ${dbs || '—'}`);
      md.push(`6. Suchnotizen: ${load('ik-step6-s6text','—')}`);
      md.push(`7. Bewertung: ${load('ik-step7-s7text','—')}`);
      md.push(`8. Verwaltung: ${load('ik-step8-s8text','—')}`);
      md.push('');
      md.push('## Suchlabor');
      md.push(`Abfrage: \n\n> ${load('ik-query','—')}`);
      md.push('');
      md.push('## Zitate');
      const cites = load('ik-citations', []); cites.forEach((c,i)=> md.push(`${i+1}. ${c.c}`)); if(!cites.length) md.push('—');
      md.push('');
      md.push('## Eigene Notizen');
      md.push(load('ik-notes','—'));
      const blob = new Blob([md.join('\n')], {type:'text/markdown'});
      const url = URL.createObjectURL(blob);
      const a = document.createElement('a'); a.href = url; a.download = 'Lernjournal_Informationskompetenz.md'; a.click(); URL.revokeObjectURL(url);
    }
    $('#exportMD').addEventListener('click', exportMarkdown);

    // Update journal counter
    $('#stat-journal').textContent = load('ik-journal', []).length;
    renderJournal();

    // Initial progress update on load
    updateProgress();