Switch to Qwen brand colors (blue theme)

assets/index-DRl0_D0u.css

@@ -0,0 +1 @@
+*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--bg: #07080A;--surface: #0D0F12;--border: #1C1F26;--border-hi: #2E3340;--amber: #3B82F6;--amber-dim: #1E3A5F;--amber-glow: rgba(59,130,246,.12);--green: #22C55E;--red: #EF4444;--text: #E2E8F0;--text-dim: #4A5568;--text-mid: #94A3B8;--mono: "JetBrains Mono", monospace;--display: "Syne", sans-serif}html{background:var(--bg);color:var(--text);font-family:var(--mono)}body{min-height:100vh;display:grid;grid-template-rows:auto 1fr auto;background:radial-gradient(ellipse 80% 40% at 50% -10%,rgba(59,130,246,.08) 0%,transparent 60%),var(--bg)}header{padding:2rem 2rem 0;max-width:860px;margin:0 auto;width:100%}.header-tag{font-size:.65rem;letter-spacing:.25em;text-transform:uppercase;color:var(--amber);font-weight:600;display:flex;align-items:center;gap:.5rem;margin-bottom:.75rem}.header-tag:before{content:"";width:6px;height:6px;border-radius:50%;background:var(--amber);box-shadow:0 0 8px var(--amber);animation:pulse-dot 2s ease-in-out infinite}@keyframes pulse-dot{0%,to{opacity:1;box-shadow:0 0 8px var(--amber)}50%{opacity:.4;box-shadow:0 0 3px var(--amber)}}.header-title{font-family:var(--display);font-size:clamp(1.8rem,4vw,2.6rem);font-weight:800;letter-spacing:-.02em;line-height:1.1;color:var(--text)}.header-title span{color:var(--amber)}.header-sub{margin-top:.6rem;font-size:.75rem;color:var(--text-dim);font-weight:300;letter-spacing:.02em}.header-sub a{color:var(--text-mid);text-decoration:none;border-bottom:1px solid var(--border-hi)}.header-sub a:hover{color:var(--amber);border-color:var(--amber)}main{max-width:860px;margin:0 auto;width:100%;padding:2rem 2rem 3rem}#status-bar{background:var(--surface);border:1px solid var(--border);border-radius:6px;padding:.75rem 1rem;margin-bottom:1.5rem;display:flex;align-items:center;gap:.75rem;font-size:.72rem;transition:border-color .3s}#status-bar.loading{border-color:var(--amber-dim)}#status-bar.ready{border-color:#1e3a5f}#status-bar.error{border-color:#7f1d1d}.status-icon{width:8px;height:8px;border-radius:50%;background:var(--text-dim);flex-shrink:0}#status-bar.loading .status-icon{background:var(--amber);animation:pulse-dot 1s infinite}#status-bar.ready .status-icon{background:var(--green)}#status-bar.error .status-icon{background:var(--red)}#status-text{color:var(--text-mid);flex:1}#progress-bar-wrap{height:2px;flex:1;max-width:120px;background:var(--border);border-radius:1px;overflow:hidden;display:none}#progress-bar-wrap.visible{display:block}#progress-bar{height:100%;background:var(--amber);width:0%;transition:width .3s ease;border-radius:1px}.panel{background:var(--surface);border:1px solid var(--border);border-radius:8px;padding:1.25rem;margin-bottom:1rem}.panel-label{font-size:.6rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--amber);margin-bottom:.6rem}#query-panel{border-color:var(--amber-dim)}#query-input{width:100%;background:transparent;border:none;outline:none;color:var(--text);font-family:var(--mono);font-size:.9rem;font-weight:400;resize:none;line-height:1.6;min-height:2.5rem;max-height:8rem;overflow-y:auto}#query-input::placeholder{color:var(--text-dim)}.instruction-row{display:flex;align-items:center;gap:.5rem;margin-top:.75rem;padding-top:.75rem;border-top:1px solid var(--border)}.instruction-label{font-size:.6rem;letter-spacing:.15em;text-transform:uppercase;color:var(--text-dim);white-space:nowrap;font-weight:600}#instruction-input{flex:1;background:transparent;border:none;outline:none;color:var(--text-mid);font-family:var(--mono);font-size:.72rem;font-style:italic}#docs-list{display:flex;flex-direction:column;gap:.5rem}.doc-card{background:var(--surface);border:1px solid var(--border);border-radius:8px;padding:.85rem 1rem;display:grid;grid-template-columns:1.6rem 1fr auto;gap:.6rem;align-items:start;transition:border-color .2s,box-shadow .2s;will-change:transform;animation:card-in .25s ease both}@keyframes card-in{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}.doc-card:focus-within{border-color:var(--border-hi)}.doc-index{font-size:.65rem;color:var(--text-dim);font-weight:600;padding-top:.15rem;user-select:none}.doc-text{width:100%;background:transparent;border:none;outline:none;color:var(--text);font-family:var(--mono);font-size:.8rem;font-weight:300;resize:none;line-height:1.65;min-height:2.4rem;max-height:6rem;overflow-y:auto}.doc-text::placeholder{color:var(--text-dim)}.doc-score-wrap{display:flex;flex-direction:column;align-items:flex-end;gap:.25rem;min-width:3.5rem}.doc-score-num{font-size:1.1rem;font-weight:700;color:var(--text-dim);font-variant-numeric:tabular-nums;transition:color .4s;line-height:1}.doc-score-bar-wrap{width:3rem;height:3px;background:var(--border);border-radius:1.5px;overflow:hidden}.doc-score-bar{height:100%;width:0%;background:var(--text-dim);border-radius:1.5px;transition:width .6s cubic-bezier(.16,1,.3,1),background .4s}.doc-card.ranked-1{border-color:#3b82f666;background:#3b82f60a}.doc-card.ranked-1 .doc-score-num{color:var(--amber)}.doc-card.ranked-1 .doc-score-bar{background:var(--amber)}.doc-card.ranked-2 .doc-score-num{color:#818cf8}.doc-card.ranked-2 .doc-score-bar{background:#818cf8}.doc-card.ranked-3 .doc-score-num{color:#67e8f9}.doc-card.ranked-3 .doc-score-bar{background:#67e8f9}.doc-card.computing{border-color:var(--amber-dim);box-shadow:inset 3px 0 0 var(--amber),0 0 12px #3b82f614;animation:card-compute-pulse 1.4s ease-in-out infinite}@keyframes card-compute-pulse{0%,to{box-shadow:inset 3px 0 0 var(--amber),0 0 8px #3b82f60f}50%{box-shadow:inset 3px 0 0 var(--amber),0 0 18px #3b82f62e}}.doc-card.computing .doc-score-num{display:inline-block;color:var(--amber);font-size:1.2rem;animation:spin .7s linear infinite;transform-origin:center}@keyframes spin{to{transform:rotate(360deg)}}.doc-card.computing .doc-score-bar{background:var(--amber);width:100%!important;animation:bar-indeterminate 1.2s ease-in-out infinite;transform-origin:left}@keyframes bar-indeterminate{0%{transform:scaleX(0);opacity:.6}50%{transform:scaleX(1);opacity:1}to{transform:scaleX(0);opacity:.6}}.doc-card.needs-rank{border-color:var(--amber-dim);border-style:dashed}.doc-card.needs-rank .doc-score-num:after{content:" ↺";font-size:.65rem;color:var(--amber-dim)}.doc-card.flipping{transition:transform .45s cubic-bezier(.16,1,.3,1)}.actions-row{display:flex;gap:.6rem;margin-top:.75rem;align-items:center;flex-wrap:wrap}button{font-family:var(--mono);cursor:pointer;border:1px solid transparent;border-radius:5px;font-size:.72rem;font-weight:600;letter-spacing:.04em;padding:.5rem 1rem;transition:all .15s;display:inline-flex;align-items:center;gap:.4rem}#rank-btn{background:var(--amber);color:#fff;border-color:var(--amber);padding:.55rem 1.4rem;font-size:.78rem}#rank-btn:hover:not(:disabled){background:#60a5fa;box-shadow:0 0 16px #3b82f659}#rank-btn:disabled{opacity:.45;cursor:not-allowed}#rank-btn.running{animation:btn-pulse 1.2s ease-in-out infinite}@keyframes btn-pulse{0%,to{box-shadow:0 0 #3b82f600}50%{box-shadow:0 0 20px #3b82f680}}#add-doc-btn{background:transparent;color:var(--text-mid);border-color:var(--border-hi)}#add-doc-btn:hover{border-color:var(--amber-dim);color:var(--amber)}#clear-btn{background:transparent;color:var(--text-dim);border-color:transparent;margin-left:auto;font-size:.68rem}#clear-btn:hover{color:var(--red)}#results-header{display:none;align-items:center;gap:.75rem;margin:1.5rem 0 .75rem;font-size:.6rem;letter-spacing:.2em;text-transform:uppercase;color:var(--text-dim);font-weight:600}#results-header.visible{display:flex}#results-header:after{content:"";flex:1;height:1px;background:var(--border)}footer{padding:1rem 2rem;max-width:860px;margin:0 auto;width:100%;display:flex;align-items:center;gap:1rem;font-size:.62rem;color:var(--text-dim);border-top:1px solid var(--border)}footer a{color:var(--text-dim);text-decoration:none}footer a:hover{color:var(--amber)}.sep{color:var(--border-hi)}#runtime-info{margin-left:auto}::-webkit-scrollbar{width:4px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--border-hi);border-radius:2px}.dtype-select{background:var(--surface);border:1px solid var(--border-hi);border-radius:4px;color:var(--text-mid);font-family:var(--mono);font-size:.65rem;padding:.2rem .4rem;cursor:pointer;outline:none}.dtype-select:hover{border-color:var(--amber-dim)}

assets/index-K3DCGs5P.js

@@ -0,0 +1 @@
+(function(){const c=document.createElement("link").relList;if(c&&c.supports&&c.supports("modulepreload"))return;for(const t of document.querySelectorAll('link[rel="modulepreload"]'))o(t);new MutationObserver(t=>{for(const s of t)if(s.type==="childList")for(const a of s.addedNodes)a.tagName==="LINK"&&a.rel==="modulepreload"&&o(a)}).observe(document,{childList:!0,subtree:!0});function r(t){const s={};return t.integrity&&(s.integrity=t.integrity),t.referrerPolicy&&(s.referrerPolicy=t.referrerPolicy),t.crossOrigin==="use-credentials"?s.credentials="include":t.crossOrigin==="anonymous"?s.credentials="omit":s.credentials="same-origin",s}function o(t){if(t.ep)return;t.ep=!0;const s=r(t);fetch(t.href,s)}})();const I="onnx-community/Qwen3-Reranker-0.6B-ONNX",$="Given a web search query, retrieve relevant passages that answer the query",N=["Paris is the capital and largest city of France, located in northern France.","Berlin is the capital city of Germany.","France is a country in Western Europe known for its wine, cuisine, and art.","The Eiffel Tower is a famous landmark located in Paris, France."];let b=0;const M=document.getElementById("status-bar"),R=document.getElementById("status-text"),x=document.getElementById("progress-bar-wrap"),F=document.getElementById("progress-bar"),i=document.getElementById("rank-btn"),v=document.getElementById("docs-list"),S=document.getElementById("results-header"),g=document.getElementById("dtype-select"),y=document.getElementById("query-input");let h=w();function w(){const e=new Worker(new URL(""+new URL("worker-Cv6xZSLB.js",import.meta.url).href,import.meta.url),{type:"module"});return e.addEventListener("message",O),e}const f=new Map;function O({data:e}){const{type:c}=e;if(c==="progress"){const r=e.progress!=null?Math.round(e.progress):null;u("loading",`${e.file??"model"} — ${r!=null?r+"%":"…"}`,r);return}if(c==="ready"){document.getElementById("runtime-info").textContent=`dtype: ${e.dtype}`,u("ready",`Model ready · ${I}`),i.disabled=!1,g.disabled=!1;return}if(c==="load_error"){u("error",`Failed to load: ${e.message}`),g.disabled=!1;return}if(c==="scored"){const r=f.get(e.id);r&&(r.resolve(e.score),f.delete(e.id));return}if(c==="score_error"){const r=f.get(e.id);r&&(r.reject(new Error(e.message)),f.delete(e.id));return}}function A(e,c,r,o){return new Promise((t,s)=>{f.set(e,{resolve:t,reject:s}),h.postMessage({type:"score",id:e,query:c,doc:r,instruction:o})})}function u(e,c,r=null){M.className=e,R.textContent=c,r!=null?(x.classList.add("visible"),F.style.width=`${r}%`):x.classList.remove("visible")}function C(e){e.style.height="auto",e.style.height=Math.min(e.scrollHeight,128)+"px"}y.addEventListener("input",()=>C(y));function B(e=""){const c=String(++b),r=document.createElement("div");r.className="doc-card",r.dataset.id=c,r.style.animationDelay=`${Math.min((b-1)*30,100)}ms`;const o=document.createElement("span");o.className="doc-index",o.textContent=c.padStart(2,"0");const t=document.createElement("textarea");t.className="doc-text",t.rows=2,t.placeholder="Paste a document or passage…",t.value=e,t.addEventListener("input",()=>C(t));const s=document.createElement("div");s.className="doc-score-wrap";const a=document.createElement("span");a.className="doc-score-num",a.textContent="—";const d=document.createElement("div");d.className="doc-score-bar-wrap";const n=document.createElement("div");n.className="doc-score-bar",d.appendChild(n),s.appendChild(a),s.appendChild(d),r.appendChild(o),r.appendChild(t),r.appendChild(s),v.appendChild(r)}let k=!1;function D(){k&&(i.textContent="↺ Re-rank")}N.forEach(e=>B(e));document.getElementById("add-doc-btn").addEventListener("click",()=>{B(),D()});document.getElementById("clear-btn").addEventListener("click",()=>{document.querySelectorAll(".doc-card").forEach(e=>{e.className="doc-card",e.querySelector(".doc-score-num").textContent="—",e.querySelector(".doc-score-bar").style.width="0%"}),S.classList.remove("visible")});function P(e,c,r){const o=performance.now(),t=a=>(a*100).toFixed(1)+"%";function s(a){const d=Math.min((a-o)/600,1),n=1-Math.pow(1-d,3);e.textContent=t(n*r),c.style.width=`${n*r*100}%`,d<1?requestAnimationFrame(s):e.textContent=t(r)}requestAnimationFrame(s)}function T(e,c){const r=new Map(e.map(o=>[o.dataset.id,o.getBoundingClientRect().top]));c.forEach(o=>{const t=v.querySelector(`[data-id="${CSS.escape(o)}"]`);t&&v.appendChild(t)}),e.forEach(o=>{const t=r.get(o.dataset.id)-o.getBoundingClientRect().top;Math.abs(t)>1&&(o.style.transform=`translateY(${t}px)`,o.style.transition="none",requestAnimationFrame(()=>{o.classList.add("flipping"),o.style.transform="translateY(0)",setTimeout(()=>{o.classList.remove("flipping"),o.style.transition=""},500)}))})}async function L(){const e=y.value.trim(),c=document.getElementById("instruction-input").value.trim()||$;if(!e){y.focus();return}document.querySelectorAll(".doc-card.needs-rank").forEach(n=>n.classList.remove("needs-rank"));const r=[...document.querySelectorAll(".doc-card")],o=r.map(n=>({id:n.dataset.id,text:n.querySelector(".doc-text").value.trim(),card:n})),t=o.filter(n=>n.text);if(!t.length)return;i.disabled=!0,i.classList.add("running"),i.textContent="⟳ Ranking…",t.forEach(({card:n})=>{n.classList.add("computing"),n.querySelector(".doc-score-num").textContent="⟳"});const s=[];for(let n=0;n<t.length;n++){const{id:l,text:E,card:m}=t[n];u("loading",`Scoring document ${n+1} / ${t.length}…`,n/t.length*100);try{const p=await A(l,e,E,c);m.classList.remove("computing"),P(m.querySelector(".doc-score-num"),m.querySelector(".doc-score-bar"),p),s.push({id:l,score:p,card:m})}catch(p){console.error("Scoring failed for doc",l,p),m.classList.remove("computing"),m.querySelector(".doc-score-num").textContent="err",u("error",`Error: ${p.message}`),s.push({id:l,score:-1,card:m})}}s.sort((n,l)=>l.score-n.score),s.forEach(({card:n},l)=>{n.className="doc-card",l<3&&n.classList.add(`ranked-${l+1}`)});const a=o.filter(n=>!n.text).map(n=>n.id);T(r,[...s.map(n=>n.id),...a]);const d=o.filter(n=>n.card.querySelector(".doc-text").value.trim()&&!t.some(E=>E.id===n.id));d.forEach(({card:n})=>n.classList.add("needs-rank")),d.length>0?u("ready",`Scored ${t.length} · ${d.length} unscored — hit Rank again ↺`):u("ready",`Scored ${t.length} document${t.length!==1?"s":""} · model ready`),S.classList.add("visible"),k=!0,i.disabled=!1,i.classList.remove("running"),i.textContent="↺ Re-rank"}i.addEventListener("click",L);function q(){const e=g.value;g.disabled=!0,i.disabled=!0,u("loading",`Downloading model (${e})…`,0),h.postMessage({type:"load",dtype:e})}g.addEventListener("change",()=>{i.removeEventListener("click",L),h.terminate(),h=w(),i.addEventListener("click",L),q()});q();

index.html

@@ -7,8 +7,8 @@
   <link rel="preconnect" href="https://fonts.googleapis.com">
   <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
   <link href="https://fonts.googleapis.com/css2?family=JetBrains+Mono:ital,wght@0,300;0,400;0,600;0,700;1,300&family=Syne:wght@700;800;900&display=swap" rel="stylesheet">
-  <script type="module" crossorigin src="./assets/index-CaEweXpE.js"></script>
-  <link rel="stylesheet" crossorigin href="./assets/index-C0wdVFKl.css">
+  <script type="module" crossorigin src="./assets/index-K3DCGs5P.js"></script>
+  <link rel="stylesheet" crossorigin href="./assets/index-DRl0_D0u.css">
 </head>
 <body>