app.js

'use strict';
const $=s=>document.querySelector(s), esc=s=>String(s??'').replace(/[&<>"']/g,c=>({'&':'&amp;','<':'&lt;','>':'&gt;','"':'&quot;',"'":'&#39;'}[c]));
const fmt=n=>Number(n).toLocaleString('en-US'), pct=(a,b)=>b?`${(100*a/b).toFixed(1)}%`:'—';
const kindNames={chat:'Slack',tracker:'Notion · Tracker',claim:'Notion · Claim',decision:'Notion · Decision',meeting:'회의 기록',email:'Email',doc:'문서',image:'그림'};
const modNames={text:'Text',image:'Image',multi:'Multi-image'};
const taskOrder=['Fact','Attribution','Computation','Selection','Interpretation','Discrepancy','Resolution','State','Change','Abstention'];
const taskNames={Fact:'Fact · 사실 조회',Attribution:'Attribution · 출처 추적',Computation:'Computation · 수량 계산',Selection:'Selection · 비교·선택',Interpretation:'Interpretation · 해석',Discrepancy:'Discrepancy · 불일치 식별',Resolution:'Resolution · 유효값 결정',State:'State · 상태',Change:'Change · 변경'};
let INDEX,UNITS,unitMap,projectMap,recordUnits,questionMap,RANKS=null,rankError=false,renderGeneration=0;
taskNames.Abstention='Abstention · 답변 유보';
const qaCache=new Map();
let S={view:'qa',project:'',task:'',result:'',text:'',kind:'',id:'',page:1,tab:'retrieval',hitkind:'all',unit:''};
async function getJSON(path){const r=await fetch(path+'.gz');if(!r.ok)throw new Error(`${path} (${r.status})`);const b=new Uint8Array(await r.arrayBuffer());if(b[0]!==31||b[1]!==139)return JSON.parse(new TextDecoder().decode(b));if(typeof DecompressionStream==='undefined')throw new Error('최신 브라우저에서 열어 주세요. 무손실 압축 데이터 지원이 필요합니다.');return new Response(new Blob([b]).stream().pipeThrough(new DecompressionStream('gzip'))).json();}
function url(view,params={}){const q=new URLSearchParams();for(const[k,v]of Object.entries(params))if(v!==''&&v!==null&&v!==undefined&&v!==false)q.set(k,v);return '#'+view+(q.size?'?'+q:'');}
function readState(){const raw=location.hash.slice(1),parts=raw.includes('?')?raw.split('?'):(raw.includes('=')?['clean',raw]:[raw,'']);const p=new URLSearchParams(parts[1]||''),aliases={capability:'group',family:'task',world:'project',evidence:'evidence_bucket'};let head=p.get('head')||'group';head=aliases[head]||head;let result=p.get('result')||p.get('verdict')||'';if(result==='wrong')result='incorrect';let project=p.get('project')||p.get('world')||p.get('f_world')||'';project=INDEX?.projects.find(x=>x.id===project||x.run===project)?.id||project;const requestedTask=p.get('task')||p.get('f_family')||'',requestedFacet=p.get('facet')||'';return {view:['clean','qa','world','results','stats'].includes(parts[0])?parts[0]:'clean',project,task:taskOrder.includes(requestedTask)?requestedTask:'',group:p.get('group')||p.get('f_capability')||'',result,model:p.get('model')||'luna',condition:p.get('condition')||'rag100',text:p.get('text')||'',kind:p.get('kind')||'',id:p.get('id')||'',page:Math.max(1,parseInt(p.get('page')||'1',10)||1),tab:p.get('tab')||'gold',hitkind:p.get('hitkind')||'all',unit:p.get('unit')||'',document:p.get('document')||'',head,facet:head==='task'&&!taskOrder.includes(requestedFacet)?'':requestedFacet,inclusion:p.get('inclusion')||'',interesting:p.get('interesting')||'',app:p.get('app')||'slack',room:p.get('room')||''};}
function go(patch,replace=false){const next={...S,...patch};const h=url(next.view,Object.fromEntries(Object.entries(next).filter(([k])=>k!=='view')));if(replace){history.replaceState(null,'',h);S=next;render();}else if(location.hash===h){S=next;render();}else location.hash=h;}
function projectLabel(id){return projectMap.get(id)?.label||id;}
function shortSource(u){const lines=u.text.split('\n').filter(Boolean);return lines[1]||lines[0]||u.record_id;}
function time(t){return (t||'').replace('T',' ');}
function imageSrc(path){if(!/^media\/[a-f0-9]{64}\.(?:png|jpe?g|webp|gif)$/i.test(path||''))return '';return typeof LAYOUT_IMAGE_PATHS!=='undefined'&&LAYOUT_IMAGE_PATHS.has(path)?'https://huggingface.co/datasets/MMOrgBench/MMOrgBench/resolve/'+LAYOUT_REFRESH.hf_commit+'/'+path:path;}
function badge(ok){return `<span class="chip ${ok?'good':'bad'}">${ok?'✓ 정답':'× 오답'}</span>`;}
function overview(){const d=INDEX.summary;$('#overview').innerHTML=`<div class="stat"><span class="stat-label">Luna · 전역 RAG top100</span><strong>${pct(d.correct,d.questions)}</strong><small>${fmt(d.correct)} / ${fmt(d.questions)} 정답 · 채점 완료</small></div><div class="stat"><span class="stat-label">통합 프로젝트</span><strong>${d.projects}<small> 프로젝트</small></strong><small>${fmt(d.records)}개 원문 기록</small></div><div class="stat"><span class="stat-label">검색 단위</span><strong>${fmt(d.units)}</strong><small>텍스트 ${fmt(d.text_units)} · 이미지 ${fmt(d.images)}</small></div><div class="stat"><span class="stat-label">질문 관점</span><strong>Omni</strong><small>프로젝트 사전 필터 없음</small></div>`;}
function projectOptions(){return '<option value="">전체 32개 프로젝트</option>'+INDEX.projects.map(p=>`<option value="${p.id}" ${S.project===p.id?'selected':''}>${esc(p.id.toUpperCase())} · ${esc(p.label)}</option>`).join('');}
function taskOptions(){return '<option value="">전체 Task</option>'+taskOrder.map(t=>`<option value="${t}" ${S.task===t?'selected':''}>${esc(taskNames[t])}</option>`).join('');}
function filterControls(world=false){return `<div class="filters"><label>${world?'원문 검색':'질문 검색'}<input type="search" id="search" placeholder="${world?'본문, 인물, 채널, 파일명…':'질문 내용 또는 Q / N / MU 문항 ID…'}" value="${esc(S.text)}"></label><label>프로젝트<select id="project-filter">${projectOptions()}</select></label>${world?`<label>기록 종류<select id="kind-filter"><option value="">전체 기록</option>${Object.entries(kindNames).map(([k,v])=>`<option value="${k}" ${S.kind===k?'selected':''}>${v}</option>`).join('')}<option value="pixels" ${S.kind==='pixels'?'selected':''}>이미지 있는 기록만</option></select></label>`:`<label>Task<select id="task-filter">${taskOptions()}</select></label>`}<label>${world?'표시':'Luna 판정'}<select id="result-filter">${world?'<option value="">시간순 · 오래된 순</option>':`<option value="">전체 문항</option><option value="correct" ${S.result==='correct'?'selected':''}>정답만</option><option value="incorrect" ${S.result==='incorrect'?'selected':''}>오답만</option><option value="no-image" ${S.result==='no-image'?'selected':''}>이미지 문항 · 검색 이미지 0</option>`}</select></label></div>`;}
function bindFilters(world=false){let timer;$('#search')?.addEventListener('input',e=>{const pos=e.target.selectionStart,value=e.target.value;clearTimeout(timer);timer=setTimeout(()=>{go({text:value,page:1,id:'',unit:''},true);setTimeout(()=>{const el=$('#search');el?.focus();if(el&&pos!==null)el.setSelectionRange(pos,pos);},0);},250);});$('#project-filter')?.addEventListener('change',e=>go({project:e.target.value,page:1,id:'',unit:''}));$('#task-filter')?.addEventListener('change',e=>go({task:e.target.value,page:1,id:''}));$('#kind-filter')?.addEventListener('change',e=>go({kind:e.target.value,page:1,unit:''}));if(!world)$('#result-filter')?.addEventListener('change',e=>go({result:e.target.value,page:1,id:''}));}
function pageControls(page,pages,extra=''){return `<div class="page-controls ${extra}"><button data-page="${page-1}" ${page<=1?'disabled':''}>← 이전</button><span>${page} / ${pages}</span><button data-page="${page+1}" ${page>=pages?'disabled':''}>다음 →</button></div>`;}
function bindPages(){$$('[data-page]').forEach(b=>b.addEventListener('click',()=>go({page:Number(b.dataset.page),id:'',unit:''})));}
function $$(s,base=document){return [...base.querySelectorAll(s)];}
function filteredQuestions(){const needle=S.text.trim().toLowerCase();return INDEX.questions.filter(q=>(!S.project||q.project===S.project)&&(!S.task||q.task===S.task)&&(!needle||[q.q,q.id,projectLabel(q.project)].join(' ').toLowerCase().includes(needle))&&(!S.result||S.result==='correct'&&q.correct||S.result==='incorrect'&&!q.correct||S.result==='no-image'&&q.modality!=='text'&&q.images===0));}
async function loadQuestion(id){const p=id.split('::')[0];if(!qaCache.has(p))qaCache.set(p,getJSON('data/qa/'+encodeURIComponent(p)+'.json').catch(e=>{qaCache.delete(p);throw e;}));const data=await qaCache.get(p);return data.items.find(q=>q.id===id);}
async function renderQA(generation){const all=filteredQuestions(),pageSize=25,pages=Math.max(1,Math.ceil(all.length/pageSize));let page=Math.min(S.page,pages);let active=all.find(q=>q.id===S.id);if(active){page=Math.floor(all.indexOf(active)/pageSize)+1;}else active=all[(page-1)*pageSize];const start=(page-1)*pageSize;const shown=all.slice(start,start+pageSize);const good=all.filter(q=>q.correct).length;
 $('#workspace').innerHTML=filterControls()+`<div class="filter-foot"><span>표시 ${fmt(all.length)}문항 · 정답 ${fmt(good)} · ${pct(good,all.length)}</span><span>저장된 Luna 판정 · 질문 단위</span><button id="reset-filters">필터 초기화</button></div><div class="qa-layout"><aside class="qa-list" aria-label="문항 목록"><div class="list-heading"><strong>문항</strong><span>${all.length?start+1:0}–${Math.min(start+pageSize,all.length)}</span></div><div class="list-items">${shown.length?shown.map(q=>`<a class="question-link ${q.id===active?.id?'selected':''}" href="${esc(url('qa',{...S,view:undefined,id:q.id,page,unit:''}))}" ${q.id===active?.id?'aria-current="true"':''}><span class="q-id">${esc(q.project.toUpperCase())} · ${esc(q.item)}<span class="${q.correct?'good':'bad'}">${q.correct?'✓':'×'}</span></span><span class="q-title">${esc(q.q)}</span><span class="q-meta">${esc(projectLabel(q.project))} · ${esc(q.task)}</span></a>`).join(''):'<div class="empty">조건에 맞는 문항이 없습니다.</div>'}</div>${pageControls(page,pages)}</aside><section id="question-detail" class="question-detail" aria-label="문항 상세">${active?'<div class="panel loading">답변과 검색 기록을 불러오는 중입니다…</div>':'<div class="panel empty">필터를 변경해 주세요.</div>'}</section></div>`;
 bindFilters();bindPages();const imageCounts=OrgBenchImageStats.summarize(all);$('.filter-foot').insertAdjacentHTML('beforeend',`<span>현재 문항들의 검색 이미지: 평균 ${imageCounts.mean===null?'—':imageCounts.mean.toFixed(2)}장 / 100개 · <a href="#results">전체 분포 보기</a></span>`);$$('.question-link .q-meta').forEach((el,i)=>el.insertAdjacentHTML('afterend',`<span class="q-image-count">검색 이미지 ${shown[i].images} / 100</span>`));if(!active)return;try{const q=await loadQuestion(active.id);if(generation!==renderGeneration)return;if(!q)throw new Error('문항 데이터를 찾을 수 없습니다.');S.id=q.id;S.page=page;renderQuestion(q);}catch(e){if(generation===renderGeneration)$('#question-detail').innerHTML=`<div class="notice error">문항을 불러오지 못했습니다. ${esc(e.message)} <button onclick="location.reload()">다시 불러오기</button></div>`;}}
function renderQuestion(q){const projects=new Set(q.hits.map(h=>unitMap.get(h.id)?.project));$('#question-detail').innerHTML=`<article class="panel"><div class="question-top"><div class="eyebrow">${esc(q.project.toUpperCase())} · ${esc(projectLabel(q.project))} · ${esc(q.item)}</div><a class="subtle-link" href="${url('world',{project:q.project})}">이 프로젝트 원문 보기 ↗</a></div><h1 class="question-text">${esc(q.q)}</h1><div class="chips"><span class="chip blue">${esc(q.group)} / ${esc(q.task)}</span><span class="chip">${esc(modNames[q.modality]||q.modality)} 문항</span><span class="chip">검색된 이미지 ${q.images}장</span><span class="chip">${projects.size}개 프로젝트의 기록</span>${badge(q.grade.answer_ok)}</div><div class="answers"><section class="answer-card"><div class="answer-label">Gold · Omni<span class="muted">검수용</span></div><div class="answer-body">${esc(q.gold)}</div></section><section class="answer-card"><div class="answer-label">Luna 답변${badge(q.grade.answer_ok)}</div><div class="answer-body">${esc(q.answer)}</div></section></div><details class="judge"><summary>Luna 판정 이유</summary><p>${esc(q.grade.grader_reason||'저장된 판정 이유가 없습니다.')}</p></details><details class="plain-details"><summary>모델 원문 출력 · 사용량</summary><pre>${esc(q.raw)}</pre><p class="caption">입력 토큰 ${fmt(q.usage?.reader?.prompt_tokens||0)} · 출력 토큰 ${fmt(q.usage?.reader?.completion_tokens||0)} · 별도의 비공개 추론 내용은 제공하지 않습니다.</p></details></article><section class="panel evidence-panel"><div class="tabs" role="tablist" aria-label="근거 및 모델 입력"><button role="tab" data-tab="retrieval" aria-selected="${S.tab==='retrieval'}" class="${S.tab==='retrieval'?'active':''}">검색 top100</button><button role="tab" data-tab="input" aria-selected="${S.tab==='input'}" class="${S.tab==='input'?'active':''}">Luna 전달 순서</button><button role="tab" data-tab="gold" aria-selected="${S.tab==='gold'}" class="${S.tab==='gold'?'active':''}">Gold 풀이 · 근거</button></div><div id="tab-body" class="tab-body"></div></section>`;$$('[data-tab]').forEach(b=>b.addEventListener('click',()=>go({tab:b.dataset.tab})));renderEvidence(q);}
function recordHTML(u,opts={}){const rank=opts.rank,selected=opts.selected,annotated=opts.annotated,originalRank=opts.originalRank,seq=opts.seq;const title=shortSource(u);const sourceTitle=title.length>165?title.slice(0,165)+'…':title;let marks=`<span class="chip">${esc(kindNames[u.kind]||u.kind)}</span>${u.image?'<span class="chip blue">이미지</span>':''}`;if(annotated)marks+='<span class="chip warn">Gold 근거</span>';if(selected===false)marks+='<span class="chip warn">Luna에 미전달</span>';if(selected===true)marks+='<span class="chip good">top100 포함</span>';const score=Number.isFinite(opts.score)?opts.score.toFixed(4):'';return `<details class="record" data-unit="${esc(u.id)}" ${opts.open?'open':''}><summary><span class="rank">${seq?'순서 '+seq:rank?'#'+rank:'원문'}</span><div><div class="record-topline">${marks}</div><div class="record-title">${esc(sourceTitle)}</div><div class="record-snippet">${esc(u.text.split('\n').slice(2).join('\n').slice(0,220))}</div><div class="record-meta">${esc(projectLabel(u.project))} · ${esc(time(u.timestamp))}<br>${esc(u.record_id)}${opts.imageRank?' · 이미지 중 '+fmt(opts.imageRank)+'위':''}${seq&&originalRank?' · 검색 #'+originalRank:''}</div></div><div class="score">${score?'유사도<br>'+score:''}<span class="expand">펼치기</span></div></summary><div class="record-body"><div class="native-text">${esc(u.text)}</div>${u.image?`<img class="record-image" src="${esc(imageSrc(u.image))}" alt="${esc(u.record_id)} 원문 이미지" loading="lazy" decoding="async">`:''}<div class="image-tools"><button type="button" data-open-unit="${esc(u.id)}">${u.image?'이미지 크게 보기':'원문 크게 보기'}</button><a href="${esc(url('world',{project:u.project,unit:u.id}))}">통합 월드에서 열기 ↗</a></div></div></details>`;}
function bindRecords(base=document){$$('[data-open-unit]',base).forEach(b=>b.addEventListener('click',()=>openUnit(b.dataset.openUnit)));$$('[data-record-ref]',base).forEach(b=>b.addEventListener('click',()=>{const units=recordUnits.get(b.dataset.recordRef)||[];if(units.length)openUnit(units[0].id);}));}
function renderEvidence(q,body=$('#tab-body'),local=null){const tab=local?.tab||S.tab,hitkind=local?.hitkind||S.hitkind;if(tab==='gold'){const known=RANKS?.[q.id]||[];const rankMap=new Map(known.map(r=>[r.id,r]));const ids=[...new Set(q.evidence.flatMap(r=>(recordUnits.get(r)||[]).map(u=>u.id)))];const hits=new Map(q.hits.map(h=>[h.id,h]));body.innerHTML=`<div class="gold-warning">아래 풀이·근거는 검수용입니다. 검색되지 않은 원문도 여기서는 열 수 있지만, 해당 문항의 Luna 입력에는 들어가지 않았습니다.</div>${q.solution?.length?`<details class="plain-details" open><summary>저장된 Gold solution</summary><ol class="solution">${q.solution.map(s=>`<li>${esc(s.step)}<div>${(s.record_ids||[]).map(id=>`<button class="record-ref" data-record-ref="${esc(id)}">${esc(id)}</button>`).join('')}</div></li>`).join('')}</ol></details>`:''}<p class="caption">주석에 연결된 ${q.evidence.length}개 근거 기록입니다. 유일하거나 최소인 근거 집합이라는 뜻은 아닙니다.${rankError?' 전체 순위 진단을 불러오지 못했습니다.':''}</p><div class="hit-list">${ids.map(id=>{const u=unitMap.get(id),r=rankMap.get(id),h=hits.get(id);return recordHTML(u,{rank:r?.rank||h?.rank,score:r?.score??h?.score,imageRank:r?.image_rank,selected:hits.has(id),annotated:true});}).join('')||'<div class="empty">연결된 근거 기록이 없습니다.</div>'}</div>`;bindRecords(body);return;}
 const chronological=tab==='input';const hm=new Map(q.hits.map(h=>[h.id,h]));const ids=chronological?q.reader_order:q.hits.map(h=>h.id);const hitImages=ids.filter(id=>unitMap.get(id).image).length;const filtered=ids.filter(id=>hitkind==='image'?!!unitMap.get(id).image:hitkind==='text'?!unitMap.get(id).image:true);const projectCount=new Set(ids.map(id=>unitMap.get(id).project)).size;
 body.innerHTML=`<p class="context-note">${chronological?'유사도 상위 100개를 먼저 선택한 뒤 시간순으로 배열한 실제 기록 순서입니다. 마지막에 질문을 붙여 Luna에 전달했습니다.':'32개 프로젝트 전체에서 질문과의 유사도가 높은 순서로 선택한 100개입니다. 텍스트와 이미지가 같은 순위에서 경쟁하며, 첨부 파일은 자동으로 추가하지 않습니다.'}</p><div class="chips"><span class="chip">100개 검색 단위</span><span class="chip blue">이미지 ${hitImages}장</span><span class="chip">텍스트 전용 ${100-hitImages}개</span><span class="chip">${projectCount}개 프로젝트</span></div>${q.modality!=='text'&&!hitImages?'<p class="caption warn">이미지 관련 문항이지만 이 요청에는 이미지가 한 장도 전달되지 않았습니다. Gold 근거 탭에서 제외된 이미지의 순위를 확인할 수 있습니다.</p>':''}<div class="context-meter" aria-label="검색 단위 100개 중 이미지 ${hitImages}개">${ids.map(id=>`<span class="${unitMap.get(id).image?'visual':''}" title="${esc(id)}"></span>`).join('')}</div><div class="hit-toolbar"><strong>${chronological?'Luna 입력순':'검색 유사도순'}</strong><label>표시<select data-hit-kind><option value="all" ${hitkind==='all'?'selected':''}>전체 100개</option><option value="image" ${hitkind==='image'?'selected':''}>이미지 있는 기록만</option><option value="text" ${hitkind==='text'?'selected':''}>텍스트 기록만</option></select></label></div><div class="hit-list">${filtered.map(id=>{const h=hm.get(id);return recordHTML(unitMap.get(id),{rank:h.rank,score:h.score,seq:chronological?ids.indexOf(id)+1:null,originalRank:h.rank,annotated:q.evidence.includes(unitMap.get(id).record_id)});}).join('')||'<div class="evidence-empty">이 요청에는 검색된 이미지가 없습니다. 표시를 바꿔 텍스트 기록을 확인해 주세요.</div>'}</div><p class="caption">코사인 유사도는 검색 순위 점수이며 정답 확률이 아닙니다. ${chronological?'화면의 Gold 표시는 검수용으로 덧붙인 것이며 실제 입력에 포함되지 않았습니다.':''}</p>`;body.querySelector('[data-hit-kind]').addEventListener('change',e=>{if(local){local.hitkind=e.target.value;renderEvidence(q,body,local);}else go({hitkind:e.target.value});});bindRecords(body);}
function openUnit(id){if(S.view==='world'||String(id).startsWith('layout23_')){const current=worldUnit(id);if(current)return openCleanRecord(current.record_id);return;}const u=unitMap.get(id);if(!u)return;const d=$('#record-dialog');$('#dialog-title').textContent=`${u.record_id} · ${kindNames[u.kind]||u.kind}`;$('#dialog-body').innerHTML=`<p class="eyebrow">${esc(projectLabel(u.project))} · ${esc(time(u.timestamp))}</p><div class="native-text">${esc(u.text)}</div>${u.image?`<img class="record-image" src="${esc(imageSrc(u.image))}" alt="${esc(u.record_id)} 원문 이미지"><a href="${esc(imageSrc(u.image))}" target="_blank" rel="noopener">이미지 원본 크기로 열기 ↗</a>`:''}<p class="caption">원문에 적힌 시각을 그대로 표시합니다. 시간대는 별도로 정의되어 있지 않습니다.</p>`;if(!d.open)d.showModal();}
function projectIntro(){if(!S.project)return `<details class="panel world-intro"><summary>32개 프로젝트 구성 · 인물·채널 보기</summary><div class="project-grid">${INDEX.projects.map(p=>`<a class="project-tile" href="${url('world',{project:p.id})}">${esc(p.id.toUpperCase())} · ${esc(p.label)}<small>${esc(p.run)}</small><small>${p.questions}문항 · 인물 ${p.people.length}명</small></a>`).join('')}</div></details>`;const p=projectMap.get(S.project);if(!p)return '';return `<details class="panel world-intro"><summary>${esc(p.label)} · 인물 ${p.people.length}명 / 채널 ${p.channels.length}개</summary><p class="caption">${esc(p.run)} · Project CEO의 권한은 해당 프로젝트 안에서 유지됩니다.</p><div class="people">${p.people.map(n=>`<div class="person">${esc(n.new_name)}<small>${esc(n.new_role)}</small></div>`).join('')}</div><div class="channels">${p.channels.map(c=>`<span class="chip">${esc(c.new_name)}</span>`).join('')}</div>${p.clients?.length?`<p class="caption">고객 담당자: ${p.clients.map(c=>esc(c.new_name)+' · '+esc(c.company_name)).join(' / ')}</p>`:''}</details>`;}
function renderWorld(){const needle=S.text.trim().toLowerCase();const all=UNITS.filter(u=>(!S.project||u.project===S.project)&&(!S.kind||(S.kind==='pixels'?!!u.image:u.kind===S.kind))&&(!needle||[u.text,u.record_id,projectLabel(u.project)].join(' ').toLowerCase().includes(needle)));const size=24,pages=Math.max(1,Math.ceil(all.length/size)),page=Math.min(S.page,pages),shown=all.slice((page-1)*size,page*size);$('#workspace').innerHTML=`<div class="section-head"><h1>통합 월드 원문</h1><span class="muted">32개 프로젝트 · 검색에 사용한 원문과 페이지 이미지</span></div>${filterControls(true)}<div class="filter-foot"><span>${fmt(all.length)}개 검색 단위 · ${fmt(new Set(all.map(u=>u.record_id)).size)}개 논리 기록</span><button id="reset-filters">필터 초기화</button></div>${projectIntro()}<div class="world-records">${shown.map(u=>recordHTML(u)).join('')||'<div class="panel empty">조건에 맞는 기록이 없습니다.</div>'}</div>${pageControls(page,pages,'bottom-pages')}`;bindFilters(true);bindPages();bindRecords();if(S.unit&&unitMap.has(S.unit))openUnit(S.unit);}
function groupStats(field,order){return order.map(k=>{const qs=INDEX.questions.filter(q=>q[field]===k);return {key:k,n:qs.length,ok:qs.filter(q=>q.correct).length};});}
function statsTable(rows,label,href){return `<div class="table-wrap"><table><thead><tr><th>${label}</th><th>문항</th><th>정답</th><th>정확도</th></tr></thead><tbody>${rows.map(r=>`<tr><td>${href?`<a href="${esc(href(r.key))}">${esc(r.label||r.key)}</a>`:esc(r.label||r.key)}</td><td>${fmt(r.n)}</td><td>${fmt(r.ok)}</td><td>${pct(r.ok,r.n)}</td></tr>`).join('')}</tbody></table></div>`;}
function renderResults(){const s=INDEX.summary;const mod=groupStats('modality',['text','image','multi']).map(r=>({...r,label:modNames[r.key]}));const groups=groupStats('group',['Retrieval','Synthesis','Alignment']);const tasks=groupStats('task',taskOrder).map(r=>({...r,label:taskNames[r.key]}));const im=INDEX.questions.filter(q=>q.modality!=='text');const buckets=[{key:'with',label:'이미지가 1장 이상 검색됨',rows:im.filter(q=>q.images>0)},{key:'without',label:'검색된 이미지 0장',rows:im.filter(q=>!q.images)}].map(r=>({...r,n:r.rows.length,ok:r.rows.filter(q=>q.correct).length}));$('#workspace').innerHTML=`<div class="section-head"><h1>최종 평가 결과</h1><span class="chip good">${fmt(s.questions)} / ${fmt(s.questions)} 채점 완료</span></div><div class="result-banner">GPT-5.6 Luna · Qwen3-VL-Embedding-2B 전역 top100 · <strong>${pct(s.correct,s.questions)}</strong> (${fmt(s.correct)} / ${fmt(s.questions)})</div><div class="results-grid"><section class="panel"><h2>Task 상위 그룹</h2>${statsTable(groups,'그룹')}<p class="caption">모두 Luna 답변 정확도입니다. 검색기의 Recall@100 지표가 아닙니다.</p></section><section class="panel"><h2>근거 모달리티</h2>${statsTable(mod,'문항 라벨')}<p class="caption">문항에 부여된 라벨 기준입니다. 실제 검색된 이미지 수와는 다릅니다.</p></section><section class="panel"><h2>세부 Task</h2>${statsTable(tasks,'Task',k=>url('qa',{task:k}))}</section><section class="panel"><h2>이미지 관련 문항 · 검색 결과</h2>${statsTable(buckets,'검색된 이미지')}<p class="caption">서로 다른 문항 집단의 비교입니다. 이미지 제공 여부만 바꾼 대조 실험이 아니므로 인과적 효과로 해석하지 않습니다.</p><details class="plain-details" open><summary>그림이 있어도 Luna가 못 본 사례</summary><p>‘child-in-red’ 그림은 이미지끼리 비교하면 1위지만, 텍스트까지 합친 전체 순위는 191위입니다. 따라서 top100에 포함되지 않았습니다.</p><a href="${url('qa',{id:'p01::N260917_23',tab:'gold'})}">해당 문항 · 전체 191위 그림 확인 →</a></details></section></div><section class="panel"><h2>프로젝트별 성능</h2>${statsTable(INDEX.projects.map(p=>({key:p.id,label:p.id.toUpperCase()+' · '+p.label,n:p.questions,ok:p.correct})),'프로젝트',k=>url('qa',{project:k}))}</section><section class="panel"><h2>실험 설정과 해석 범위</h2><div class="settings-grid"><div class="setting"><span>검색 대상</span>32개 프로젝트 · ${fmt(s.units)}개 레코드 / 페이지 단위</div><div class="setting"><span>검색 모델</span>Qwen3-VL-Embedding-2B · 2,048차원 · 코사인 유사도</div><div class="setting"><span>질문 입력</span>질문 텍스트만 · 타깃 프로젝트 사전 필터 없음</div><div class="setting"><span>이미지 입력</span>PDF·PPT 페이지와 별도 그림의 실제 픽셀 · OCR / 생성 설명 추가 없음</div><div class="setting"><span>Luna 컨텍스트</span>전역 top100 선택 후 시간순 배열 · 첨부 / 문서 전체 자동 확장 없음</div><div class="setting"><span>채점</span>짧은 Luna 의미 판정 · 질문 / 관점 / Gold / 모델 답 비교</div></div><p class="caption">응답 모델과 채점 모델은 모두 Luna입니다. 판정은 사람의 확정 검수가 아니며 이견이 생길 수 있습니다. 이 사이트는 저장된 결과를 읽기만 하고 모델을 새로 실행하지 않습니다.</p></section>`;}
function imageStatisticsHTML(){
 const summarize=OrgBenchImageStats.summarize,s=summarize(INDEX.questions),visual=summarize(INDEX.questions.filter(q=>q.modality!=='text'));
 const rows=[{label:'전체 문항',s},...['text','image','multi'].map(m=>({label:modNames[m],s:summarize(INDEX.questions.filter(q=>q.modality===m))}))];
 return `<section class="panel" id="image-count-statistics"><h2>Top100에 포함된 이미지 수</h2><p class="caption">각 문항의 실제 검색 결과 100개 중 이미지로 전달된 항목 수입니다. 문서의 페이지 이미지와 별도 그림을 모두 셉니다.</p><div class="image-count-summary"><div class="image-count-stat"><span>문항당 평균</span><strong>${s.mean.toFixed(2)}장 / 100개</strong></div><div class="image-count-stat"><span>중앙값</span><strong>${s.median}장</strong></div><div class="image-count-stat"><span>최소–최대</span><strong>${s.min}–${s.max}장</strong></div><div class="image-count-stat"><span>90백분위수</span><strong>${s.p90.toFixed(1)}장</strong></div><div class="image-count-stat"><span>이미지 0장인 문항</span><strong>${fmt(s.zero)}개 · ${pct(s.zero,s.n)}</strong></div></div><div class="image-count-tables"><div><h3>이미지 수별 문항 분포</h3><div class="table-wrap"><table><thead><tr><th>Top100의 이미지 수</th><th>문항</th><th>비율</th></tr></thead><tbody>${s.bins.map(b=>`<tr><td>${b.label}</td><td>${fmt(b.n)}</td><td>${pct(b.n,s.n)}</td></tr>`).join('')}</tbody></table></div></div><div><h3>문항 모달리티별</h3><div class="table-wrap"><table><thead><tr><th>문항 라벨</th><th>문항</th><th>평균 이미지 수</th><th>중앙값</th><th>이미지 0장 문항</th></tr></thead><tbody>${rows.map(r=>`<tr><td>${r.label}</td><td>${fmt(r.s.n)}</td><td>${r.s.mean===null?'—':r.s.mean.toFixed(2)}</td><td>${r.s.median??'—'}</td><td>${fmt(r.s.zero)} · ${pct(r.s.zero,r.s.n)}</td></tr>`).join('')}</tbody></table></div></div></div><p class="caption">이미지 관련 문항(Image + Multi-image) ${fmt(visual.n)}개: 평균 ${visual.mean.toFixed(2)}장, 중앙값 ${visual.median}장. 이 중 ${fmt(visual.zero)}개(${pct(visual.zero,visual.n)})에는 이미지가 전달되지 않았습니다.</p><p class="caption">전체 ${fmt(s.slots)}개 검색 슬롯 중 이미지 ${fmt(s.total)}개(${pct(s.total,s.slots)}). 동일 이미지가 여러 문항에 검색되면 각각 집계하므로, 고유 이미지 수와 다릅니다. 이미지가 검색됐다는 것만으로 정답에 필요한 그림이 포함됐다는 뜻은 아닙니다.</p></section>`;
}
function render(){
 if(['qa','results'].includes(S.view))S.view='clean';
 const generation=++renderGeneration;document.body.classList.toggle('corpus-view',S.view==='stats');$('#notice').textContent='';$('#overview').innerHTML='';
 $$('[data-nav]').forEach(a=>{a.classList.toggle('active',a.dataset.nav===S.view);if(a.dataset.nav===S.view)a.setAttribute('aria-current','page');else a.removeAttribute('aria-current');});
 if(S.view==='stats'){BenchmarkStats.show(generation);return;}
 if(S.view==='world'){renderWorldBrowser(generation);return;}
 renderClean(generation);
}
async function init(){try{[INDEX,UNITS]=await Promise.all([getJSON('data/index.json'),getJSON('data/units.json')]);unitMap=new Map(UNITS.map(u=>[u.id,u]));projectMap=new Map(INDEX.projects.map(p=>[p.id,p]));questionMap=new Map(INDEX.questions.map(q=>[q.id,q]));recordUnits=new Map();for(const u of UNITS){if(!recordUnits.has(u.record_id))recordUnits.set(u.record_id,[]);recordUnits.get(u.record_id).push(u);}S=readState();overview();render();getJSON('data/rank_checks.json').then(r=>{RANKS=r;refreshOpenReviewEvidence();if(S.view==='qa'&&S.tab==='gold'&&S.id){const id=S.id;loadQuestion(id).then(q=>{if(q&&S.id===id&&S.view==='qa'&&S.tab==='gold'&&$('#tab-body'))renderEvidence(q);});}}).catch(()=>{rankError=true;});}catch(e){$('#notice').className='notice error';$('#notice').innerHTML=`데이터를 불러오지 못했습니다. ${esc(e.message)} <button onclick="location.reload()">다시 불러오기</button>`;}}
window.addEventListener('hashchange',()=>{if(!INDEX)return;S=readState();if($('#record-dialog').open)$('#record-dialog').close();render();});$('.skip').addEventListener('click',e=>{e.preventDefault();$('#main').focus();$('#main').scrollIntoView({block:'start'});});$('#close-dialog').addEventListener('click',()=>$('#record-dialog').close());$('#record-dialog').addEventListener('click',e=>{if(e.target===$('#record-dialog'))$('#record-dialog').close();});init();