PageSourceSearch

https://icml2026-icml2026.hf.space/

html icml2026-icml2026.hf.space collected 2026-10-03 10:18:49 UTC 31,617 bytes, 525 lines download raw bytes

1<!DOCTYPE html>
2<html lang="en">
3<head>
4    <meta charset="UTF-8">
5    <meta name="viewport" content="width=device-width, initial-scale=1.0">
6    <title>ICML 2026 Paper Explorer</title>
7    <meta name="description" content="Explore accepted papers and events for ICML 2026. Browse by type, search by title or author, and read abstracts.">
8    <link rel="preconnect" href="https://fonts.googleapis.com">
9    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
10    <link href="https://fonts.googleapis.com/css2?family=Clash+Display:wght@400;500;600;700&family=Inter:wght@300;400;500;600&display=swap" rel="stylesheet">
11    
12    <!-- KaTeX for LaTeX Math Rendering -->
13    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/katex.min.css">
14    
14<script defer src="https://cdn.jsdelivr.net/npm/[email protected]/dist/katex.min.js"></script>
14
15    
15<script defer src="https://cdn.jsdelivr.net/npm/[email protected]/dist/contrib/auto-render.min.js"></script>
15
16    <style>
17        :root {
18            --bg-color: #0b0c10;
19            --surface-color: #1f2833;
20            --surface-color-light: #2c3a4a;
21            --text-main: #e2e8f0;
22            --text-muted: #94a3b8;
23            --accent-primary: #66fcf1;
24            --accent-secondary: #45a29e;
25            --status-oral: #fbbf24;
26            --status-spotlight: #c084fc;
27            --status-poster: #60a5fa;
28            --status-workshop: #f472b6;
29            --status-tutorial: #34d399;
30            --border-radius: 12px;
31            --transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
32        }
33        * { box-sizing: border-box; margin: 0; padding: 0; }
34        body {
35            font-family: 'Inter', sans-serif;
36            background-color: var(--bg-color);
37            color: var(--text-main);
38            min-height: 100vh;
39            line-height: 1.6;
40            overflow-x: hidden;
41            background-image:
42                radial-gradient(circle at 15% 50%, rgba(102,252,241,0.05) 0%, transparent 50%),
43                radial-gradient(circle at 85% 30%, rgba(192,132,252,0.05) 0%, transparent 50%);
44        }
45        h1, h2, h3 { font-family: 'Clash Display', sans-serif; }
46
47        header {
48            position: sticky; top: 0; z-index: 100;
49            background: rgba(11,12,16,0.75);
50            backdrop-filter: blur(12px);
51            -webkit-backdrop-filter: blur(12px);
52            border-bottom: 1px solid rgba(255,255,255,0.05);
53            padding: 1.5rem 2rem;
54            display: flex; align-items: center; justify-content: space-between;
55        }
56        .logo-container { display: flex; align-items: center; gap: 1rem; }
57        .logo-img { height: 40px; object-fit: contain; }
58        .logo-text h1 { font-size: 1.5rem; font-weight: 600; letter-spacing: 0.5px; color: white; }
59        .logo-text p { font-size: 0.85rem; color: var(--accent-primary); text-transform: uppercase; letter-spacing: 1px; font-weight: 500; }
60
61        main { max-width: 1400px; margin: 0 auto; padding: 2rem; }
62
63        .controls-section {
64            background: var(--surface-color);
65            border-radius: var(--border-radius);
66            padding: 1.5rem 2rem;
67            margin-bottom: 2rem;
68            display: flex; gap: 1.5rem; flex-wrap: wrap;
69            box-shadow: 0 10px 30px rgba(0,0,0,0.3);
70            border: 1px solid rgba(255,255,255,0.03);
71            animation: slideDown 0.6s cubic-bezier(0.16,1,0.3,1) forwards;
72            opacity: 0; transform: translateY(-20px);
73        }
74        .control-group { flex: 1; min-width: 200px; }
75        .control-group label { display: block; font-size: 0.85rem; color: var(--text-muted); margin-bottom: 0.5rem; font-weight: 500; }
76        input, select {
77            width: 100%; background: rgba(0,0,0,0.2);
78            border: 1px solid rgba(255,255,255,0.1);
79            color: white; padding: 0.75rem 1rem;
80            border-radius: 8px; font-family: inherit; font-size: 0.95rem;
81            transition: var(--transition);
82        }
83        input:focus, select:focus { outline: none; border-color: var(--accent-primary); box-shadow: 0 0 0 2px rgba(102,252,241,0.2); }
84        input[type="checkbox"] { width: auto; padding: 0; margin: 0; border: none; background: transparent; accent-color: var(--accent-primary); cursor: pointer; }
85        .artifact-filters { display: flex; gap: 1rem; flex-wrap: wrap; padding-top: 0.35rem; }
86        .artifact-check { display: flex; align-items: center; gap: 0.4rem; font-size: 0.9rem; color: var(--text-main); cursor: pointer; white-space: nowrap; }
87
88        .table-container {
89            width: 100%; overflow-x: auto;
90            background: rgba(31,40,51,0.4);
91            border-radius: var(--border-radius);
92            border: 1px solid rgba(255,255,255,0.05);
93            box-shadow: 0 15px 35px rgba(0,0,0,0.4);
94            backdrop-filter: blur(10px);
95            opacity: 0; animation: fadeIn 0.8s 0.2s forwards;
96        }
97        table { width: 100%; border-collapse: separate; border-spacing: 0; text-align: left; }
98        th {
99            background: rgba(255,255,255,0.02);
100            padding: 1.25rem 1.5rem; font-weight: 600; font-size: 0.85rem;
101            text-transform: uppercase; letter-spacing: 1px;
102            color: var(--text-muted); border-bottom: 1px solid rgba(255,255,255,0.05);
103            white-space: nowrap;
104        }
105        td {
106            padding: 1.25rem 1.5rem;
107            border-bottom: 1px solid rgba(255,255,255,0.03);
108            vertical-align: top; transition: var(--transition);
109        }
110        tbody tr { transition: var(--transition); cursor: pointer; position: relative; }
111        tbody tr:hover { background: rgba(255,255,255,0.03); transform: scale(1.002); }
112        tbody tr:hover td { border-bottom-color: transparent; }
113
114        .paper-title { font-size: 1.05rem; font-weight: 600; color: white; margin-bottom: 0.4rem; display: inline-block; }
115        .paper-authors { font-size: 0.85rem; color: var(--text-muted); }
116        .paper-abstract-preview {
117            font-size: 0.85rem; color: var(--text-muted); margin-top: 0.5rem;
118            display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
119            overflow: hidden; display: none;
120        }
121        tr.expanded { background: rgba(102,252,241,0.03); border-left: 2px solid var(--accent-primary); }
122        tr.expanded .paper-abstract-preview {
123            display: block; -webkit-line-clamp: unset; color: #cbd5e1;
124            padding: 1rem; background: rgba(0,0,0,0.2); border-radius: 8px; margin-top: 0.75rem;
125        }
126        tr.expanded .lay-summary {
127            display: block; color: #a5b4c8;
128            padding: 0.75rem 1rem; background: rgba(69,162,158,0.08);
129            border-radius: 8px; margin-top: 0.5rem; border-left: 3px solid var(--accent-secondary);
130        }
131        .lay-summary { display: none; font-size: 0.85rem; }
132        .lay-summary-label { font-weight: 600; color: var(--accent-secondary); margin-bottom: 0.25rem; display: block; font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.5px; }
133
134        .badge {
135            display: inline-flex; align-items: center;
136            padding: 0.35rem 0.75rem; border-radius: 20px;
137            font-size: 0.75rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.5px;
138        }
139        .badge-poster { background: rgba(96,165,250,0.15); color: var(--status-poster); border: 1px solid rgba(96,165,250,0.3); }
140        .badge-workshop { background: rgba(244,114,182,0.15); color: var(--status-workshop); border: 1px solid rgba(244,114,182,0.3); }
141        .badge-tutorial { background: rgba(52,211,153,0.15); color: var(--status-tutorial); border: 1px solid rgba(52,211,153,0.3); }
142        .badge-oral { background: rgba(251,191,36,0.15); color: var(--status-oral); border: 1px solid rgba(251,191,36,0.3); }
143        .badge-spotlight { background: rgba(192,132,252,0.15); color: var(--status-spotlight); border: 1px solid rgba(192,132,252,0.3); }
144        .badge-default { background: rgba(148,163,184,0.15); color: var(--text-muted); border: 1px solid rgba(148,163,184,0.3); }
145
146        .icon-link {
147            display: inline-flex; align-items: center; justify-content: center;
148            padding: 0.3rem 0.6rem;
149            background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.08);
150            border-radius: 6px; color: var(--accent-primary);
151            text-decoration: none; font-size: 0.75rem; font-weight: 500;
152            white-space: nowrap; transition: var(--transition);
153        }
154        .icon-link:hover { background: rgba(102,252,241,0.1); border-color: rgba(102,252,241,0.3); transform: translateY(-1px); }
155
156        .loader-container { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 5rem 0; }
157        .loader { width: 48px; height: 48px; border: 3px solid rgba(102,252,241,0.2); border-radius: 50%; border-top-color: var(--accent-primary); animation: spin 1s ease-in-out infinite; margin-bottom: 1rem; }
158        .empty-state { padding: 4rem 2rem; text-align: center; color: var(--text-muted); display: none; }
159
160        /* Pagination */
161        .pagination {
162            display: flex; align-items: center; justify-content: center; gap: 0.5rem;
163            padding: 1.5rem 2rem; flex-wrap: wrap;
164        }
165        .pagination button {
166            background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.1);
167            color: var(--text-main); padding: 0.5rem 1rem; border-radius: 8px;
168            cursor: pointer; font-family: inherit; font-size: 0.9rem; transition: var(--transition);
169        }
170        .pagination button:hover:not(:disabled) { background: rgba(102,252,241,0.1); border-color: var(--accent-primary); color: white; }
171        .pagination button:disabled { opacity: 0.3;
171 cursor: not-allowed; }
172        .pagination button.active { background: var(--accent-primary); color: #0b0c10; font-weight: 600; border-color: var(--accent-primary); }
173        .pagination .page-info { color: var(--text-muted); font-size: 0.85rem; margin: 0 0.5rem; }
174
175        @keyframes spin { to { transform: rotate(360deg); } }
176        @keyframes slideDown { from { opacity: 0; transform: translateY(-20px); } to { opacity: 1; transform: translateY(0); } }
177        @keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }
178        @keyframes fadeUpIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }
179        .row-anim { animation: fadeUpIn 0.4s ease forwards; opacity: 0; }
180        #total-count { color: var(--accent-primary); font-weight: bold; }
181
182        details.tutorial-card {
183            background: rgba(31,40,51,0.4); border: 1px solid rgba(255,255,255,0.05);
184            border-radius: var(--border-radius); margin-bottom: 2rem;
185            animation: slideDown 0.4s ease forwards; box-shadow: 0 10px 30px rgba(0,0,0,0.3);
186        }
187        details.tutorial-card summary {
188            padding: 1.25rem 2rem; font-family: 'Clash Display', sans-serif;
189            font-weight: 600; color: white; cursor: pointer; list-style: none;
190            display: flex; align-items: center; justify-content: space-between;
191            font-size: 1.1rem; user-select: none;
192        }
193        details.tutorial-card summary::-webkit-details-marker { display: none; }
194        details.tutorial-card summary::after { content: "+"; font-size: 1.5rem; color: var(--accent-primary); transition: transform 0.3s ease; }
195        details[open].tutorial-card summary::after { content: "−"; transform: rotate(180deg); }
196        .tutorial-content {
197            padding: 0 2rem 2rem 2rem; border-top: 1px solid rgba(255,255,255,0.05);
198            margin-top: 0.5rem; padding-top: 1.5rem; animation: fadeIn 0.4s ease;
199        }
200        .tutorial-content h2 { margin-bottom: 0.5rem; color: var(--accent-primary); font-size: 1.2rem; }
201        .tutorial-content h3 { margin-top: 1.5rem; margin-bottom: 0.5rem; color: white; font-size: 1rem; }
202        .tutorial-content p { font-size: 0.9rem; color: #cbd5e1; margin-bottom: 0.75rem; line-height: 1.6; }
203        .tutorial-content a { color: var(--accent-primary); text-decoration: none; }
204        .tutorial-content a:hover { text-decoration: underline; color: white; }
205        .tutorial-links { display: flex; flex-direction: column; gap: 0.5rem; margin-top: 1.5rem; padding-top: 1.5rem; border-top: 1px solid rgba(255,255,255,0.05); font-size: 0.9rem; }
206
207        .mobile-label { display: none; font-size: 0.75rem; color: var(--text-muted); text-transform: uppercase; letter-spacing: 1px; font-weight: 600; margin-bottom: 0.25rem; }
208
209        /* KaTeX Tweak */
210        .katex-display { margin: 0.5em 0; overflow-x: auto; overflow-y: hidden; }
211        .katex { font-size: 1.05em !important; }
212        .paper-title .katex { color: var(--accent-primary); }
213
214        @media (max-width: 768px) {
215            header { padding: 1rem; flex-direction: column; gap: 1rem; align-items: flex-start; }
216            .controls-section { padding: 1rem; flex-direction: column; }
217            .control-group { min-width: 100%; }
218            thead { display: none; }
219            tbody tr {
220                display: flex; flex-direction: column;
221                background: rgba(31,40,51,0.6); border: 1px solid rgba(255,255,255,0.05);
222                border-radius: var(--border-radius); padding: 1rem; margin-bottom: 1rem; gap: 0.75rem;
223            }
224            tbody tr:hover { transform: none; }
225            td { display: flex; flex-direction: column; align-items: flex-start; padding: 0; border: none; }
226            td:first-child { border-bottom: 1px solid rgba(255,255,255,0.05); padding-bottom: 1rem; margin-bottom: 0.25rem; }
227            .mobile-label { display: block; }
228        }
229    </style>
230</head>
231<body>
232    <header>
233        <div class="logo-container">
234            <img src="https://icml.cc/static/core/img/icml-navbar-logo.svg" alt="ICML" class="logo-img">
235            <div class="logo-text">
236                <h1>Conference Navigator</h1>
237                <p>2026 Accepted Works</p>
238            </div>
239        </div>
240        <div style="font-size: 0.9rem; color: var(--text-muted)">
241            Showing <span id="total-count">0</span> events
242        </div>
243    </header>
244
245    <main>
246        <details class="tutorial-card">
247            <summary>Instructions & Tutorial for Authors</summary>
248            <div class="tutorial-content">
249                <h2>Hugging Face ICML 2026 event</h2>
250                <p><strong><a href="https://huggingface.co/organizations/ICML2026/share/vIMSRtFGvfrJTrRhaqihavkhijjxRxGvfY" target="_blank" rel="noopener">Join the org using this link</a></strong></p>
251                <p>The ICML 2026 organization is accepting paper claims from authors attending ICML 2026. This organization invites participants to claim their ICML 2026 papers, upload models and datasets, and build their Gradio demos for conference papers on Hugging Face.</p>
252                <h3>Hugging Face Paper Pages ICML 2026</h3>
253                <p>ICML 2026 Paper Pages will allow authors to claim their papers on Hugging Face. Claiming papers on the ICML 2026 organization will allow people to find artifacts related to a paper such as models, datasets and Gradio demos (in the form of Spaces). This also enables the community to discuss the paper.</p>
254                <h3>Tutorial for claiming ICML 2026 papers</h3>
255                <p>Visit the demo and find your paper. To claim your paper, click on the paper page link in the table and then click on your name in the corresponding Paper page and click "claim authorship". This will automatically redirect to your paper settings where you can confirm the request. The admin team will validate your request soon. Once confirmed, the Paper page will show as verified.</p>
256                <h2>Let's reproduce ICML 2026, together</h2>
257                <p>How well can you and your agents do cutting-edge AI research? Join the challenge to reproduce papers from ICML 2026. Every agent produces a logbook — a full, shareable attempt to reproduce its claims. Published logbooks are judged and appear on the leaderboard. <a href="https://huggingface.co/spaces/ICML-2026-agent-repro/challenge" target="_blank" rel="noopener">Grab a paper and go!</a></p>
258                <div class="tutorial-links">
259                    <p><a href="https://huggingface.co/docs/hub/paper-pages#claiming-authorship-to-a-paper" target="_blank" rel="noopener">If you need further assistance, see the guide here</a></p>
260                    <p>If your paper is not yet indexed on Hugging Face, you can index it by following this <a href="https://huggingface.co/docs/hub/paper-pages#can-i-have-a-paper-page-even-if-i-have-no-modeldatasetspace" target="_blank" rel="noopener">guide</a>, then <a href="https://huggingface.co/spaces/ICML2026/ICML2026/discussions" target="_blank" rel="noopener">open a discussion</a> to add your paper to the Hugging Face demo.</p>
261                </div>
262            </div>
263        </details>
264
265        <section class="controls-section">
266            <div class="control-group" style="flex:2;">
267                <label for="searchInput">Search Events</label>
268                <input type="text" id="searchInput" placeholder="Search by title, authors, or keyword...">
269            </div>
270            <div class="control-group">
271                <label for="typeFilter">Event Type</label>
272                <select id="typeFilter">
273                    <option value="">All Types</option>
274                </select>
275            </div>
276            <div class="control-group" style="flex:3;">
277                <label>Has Artifact</label>
278                <div class="artifact-filters">
279                    <label class="artifact-check"><input type="checkbox" class="artifact-filter" data-field="code_url"> Code</label>
280                    <label class="artifact-check"><input type="checkbox" class="artifact-filter" data-field="hf_paper_url"> Paper pages</label>
281                    <label class="artifact-check"><input type="checkbox" class="artifact-filter" data-field="model_url"> Model</label>
282                    <label class="artifact-check"><input type="checkbox" class="artifact-filter" data-field="dataset_url"> Dataset</label>
283                    <label class="artifact-check"><input type="checkbox" class="artifact-filter" data-field="space_url"> App</label>
284                </div>
285            </div>
286        </section>
287
288        <div class="table-container">
289            <table>
290                <thead>
291                    <tr>
292                        <th style="min-width:300px">Title</th>
293                        <th style="min-width:180px">Authors / Speakers</th>
294                        <th>Type</th>
295                        <th>ICML</th>
296                        <th>Paper pages</th>
297                        <th>Code</th>
298                        <th>Model</th>
299                        <th>Data</th>
300                        <th>App</th>
301                    </tr>
302                </thead>
303                <tbody id="papers-table-body">
304                    <tr>
305                        <td colspan="9">
306                            <div class="loader-container" id="loader">
307                                <div class="loader"></div>
308                                <p>Loading ICML 2026 Events...</p>
309                            </div>
310                        </td>
311                    </tr>
312                </tbody>
313            </table>
314            <div id="no-results" class="empty-state">
315                <svg width="64" height="64" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" style="margin-bottom:1rem;opacity:0.5;">
316                    <circle cx="11" cy="11" r="8"></circle>
317                    <line x1="21" y1="21" x2="16.65" y2="16.65"></line>
318                </svg>
319                <h3>No events found</h3>
320                <p style="margin-top:0.5rem">Try adjusting your filters or search terms.</p>
321            </div>
322            <div class="pagination" id="pagination"></div>
323        </div>
324    </main>
325
326    
326<script type="module">
327        import { Client } from "https://cdn.jsdelivr.net/npm/@gradio/client/dist/index.min.js";
328
329        let allEvents = [];
330        let filteredEvents = [];
331        let currentPage = 1;
332        const PAGE_SIZE = 50;
333
334        const tableBody = document.getElementById('papers-table-body');
335        const searchInput = document.getElementById('searchInput');
336        const typeFilter = document.getElementById('typeFilter');
337        const totalCount = document.getElementById('total-count');
338        const noResults = document.getElementById('no-results');
339        const paginationEl = document.getElementById('pagination');
340        const artifactFilters = document.querySelectorAll('.artifact-filter');
341
342        async function init() {
343            try {
344                const client = await Client.connect(window.location.origin);
345
346                // Load event types for the filter dropdown
347                const typesResult = await client.predict("/get_event_types");
348                if (typesResult.data && typesResult.data[0]) {
349                    const types = JSON.parse(typesResult.data[0]);
350                    types.forEach(t => {
351                        const opt = document.createElement('option');
352                        opt.value = t;
353                        opt.textContent = t;
354                        typeFilter.appendChild(opt);
355                    });
356                }
357
358                // Load events
359                const result = await client.predict("/get_events");
360                if (result.data && result.data[0]) {
361                    allEvents = JSON.parse(result.data[0]);
362                    applyFilters();
363                } else {
364                    throw new Error("No data received from backend");
365                }
366            } catch (error) {
367                console.error("Error:", error);
368                tableBody.innerHTML = `<tr><td colspan="9" style="text-align:center;padding:3rem;color:#ef4444;">
369                    <p>Failed to load events. Please ensure the backend is running.</p>
370                    <p style="font-size:0.85rem;margin-top:0.5rem;opacity:0.7;">${error.message}</p>
371                </td></tr>`;
372            }
373        }
374
375        function getBadgeClass(type) {
376            const t = (type || '').toLowerCase();
377            if (t === 'poster') return 'badge-poster';
378            if (t === 'workshop') return 'badge-workshop';
379            if (t === 'tutorial') return 'badge-tutorial';
380            if (t === 'oral') return 'badge-oral';
381            if (t === 'spotlight') return 'badge-spotlight';
382            return 'badge-default';
383        }
384
385        function escapeHtml(str) {
386            const div = document.createElement('div');
387            div.textContent = str;
388            return div.innerHTML;
389        }
390
391        function applyFilters() {
392            const searchTerm = searchInput.value.toLowerCase();
393            const typeVal = typeFilter.value;
394            const requiredArtifacts = Array.from(artifactFilters)
395                .filter(cb => cb.checked)
396                .map(cb => cb.dataset.field);
397
398            filteredEvents = allEvents.filter(ev => {
399                const searchStr = `${ev.title} ${ev.authors} ${ev.abstract || ''} ${ev.lay_summary || ''} ${ev.code_url || ''} ${ev.hf_paper_url || ''} ${ev.model_url || ''} ${ev.dataset_url || ''} ${ev.space_url || ''}`.toLowerCase();
400                const matchesSearch = searchStr.includes(searchTerm);
401                const matchesType = typeVal === "" || ev.type === typeVal;
402                const matchesArtifacts = requiredArtifacts.every(field => ev[field]);
403                return matchesSearch && matchesType && matchesArtifacts;
404            });
405
406            currentPage = 1;
407            renderPage();
408        }
409
410        function renderPage() {
411            const totalPages = Math.max(1, Math.ceil(filteredEvents.length / PAGE_SIZE));
412            if (currentPage > totalPages) currentPage = totalPages;
413
414            const start = (currentPage - 1) * PAGE_SIZE;
415            const pageItems = filteredEvents.slice(start, start + PAGE_SIZE);
416
417            totalCount.textContent = filteredEvents.length;
418            tableBody.innerHTML = '';
419
420            if (filteredEvents.length === 0) {
421                noResults.style.display = 'block';
422                paginationEl.innerHTML = '';
423                return;
424            }
425            noResults.style.display = 'none';
426
427            pageItems.forEach((ev, index) => {
428                const tr = document.createElement('tr');
429                tr.style.animationDelay = `${Math.min(index * 0.02, 0.5)}s`;
430                tr.className = 'row-anim';
431
432                const abstractHtml = ev.abstract ? `<div class="paper-abstract-preview">${escapeHtml(ev.abstract)}</div>` : '';
433                const laySummaryHtml = ev.lay_summary ? `<div class="lay-summary"><span class="lay-summary-label">Lay Summary</span>${escapeHtml(ev.lay_summary)}</div>` : '';
434                               const paperLink = ev.url ? `<a href="${escapeHtml(ev.url)}" class="icon-link" target="_blank" rel="noopener">View ↗</a>` : '<span style="color:rgba(255,255,255,0.1);font-style:italic;font-size:0.8rem">—</span>';
435                const hfPaperLink = ev.hf_paper_url ? `<a href="${escapeHtml(ev.hf_paper_url)}" class="icon-link" style="color:var(--status-spotlight);border-color:rgba(192,132,252,0.3);background:rgba(192,132,252,0.05);" target="_blank" rel="noopener">Paper ↗</a>` : '<span style="color:rgba(255,255,255,0.1);font-style:italic;font-size:0.8rem">—</span>';
436                const codeLink = ev.code_url ? `<a href="${escapeHtml(ev.code_url)}" class="icon-link" style="color:var(--status-oral);border-color:rgba(251,191,36,0.3);background:rgba(251,191,36,0.05);" target="_blank" rel="noopener">Code ↗</a>` : '<span style="color:rgba(255,255,255,0.1);font-style:italic;font-size:0.8rem">—</span>';
437                const modelLink = ev.model_url ? `<a href="${escapeHtml(ev.model_url)}" class="icon-link" style="color:var(--status-poster);border-color:rgba(96,165,250,0.3);background:rgba(96,165,250,0.05);" target="_blank" rel="noopener">Model ↗</a>` : '<span style="color:rgba(255,255,255,0.1);font-style:italic;font-size:0.8rem">—</span>';
438                const dataLink = ev.dataset_url ? `<a href="${escapeHtml(ev.dataset_url)}" class="icon-link" style="color:var(--status-workshop);border-color:rgba(244,114,182,0.3);background:rgba(244,114,182,0.05);" target="_blank" rel="noopener">Data ↗</a>` : '<span style="color:rgba(255,255,255,0.1);font-style:italic;font-size:0.8rem">—</span>';
439                const appLink = ev.space_url ? `<a href="${escapeHtml(ev.space_url)}" class="icon-link" style="color:var(--status-tutorial);border-color:rgba(52,211,153,0.3);background:rgba(52,211,153,0.05);" target="_blank" rel="noopener">App ↗</a>` : '<span style="color:rgba(255,255,255,0.1);font-style:italic;font-size:0.8rem">—</span>';
440                
441                const claimedHtml = `<div style="font-size:0.9rem;font-weight:500;white-space:nowrap;">${ev.claimed_count}/${ev.total_authors}${ev.claimed_count > 0 ? ' <span style="color:#34d399;">✅</span>' : ''}</div>`;
442
443                tr.innerHTML = `
444                    <td>
445                        <div class="paper-title">${escapeHtml(ev.title)}</div>
446                        ${abstractHtml}
447                        ${laySummaryHtml}
448                    </td>
449                    <td><span class="mobile-label">Authors</span><div class="paper-authors">${escapeHtml(ev.authors)}</div></td>
450                    <td><span class="mobile-label">Type</span><span class="badge ${getBadgeClass(ev.type)}">${escapeHtml(ev.type)}</span></td>
451                    <td><span class="mobile-label">ICML</span>${paperLink}</td>
452                    <td><span class="mobile-label">Paper pages</span>${hfPaperLink}</td>
453                    <td><span class="mobile-label">Code</span>${codeLink}</td>
454                    <td><span class="mobile-label">Model</span>${modelLink}</td>
455                    <td><span class="mobile-label">Data</span>${dataLink}</td>
456                    <td><span class="mobile-label">App</span>${appLink}</td>
457                `;
458
459                tr.addEventListener('click', (e) => {
460                    if (e.target.tagName !== 'A') tr.classList.toggle('expanded');
461                });
462                tableBody.appendChild(tr);
463            });
464
465            // Render pagination
466            renderPagination(totalPages);
467            
468            // Render LaTeX math
469            renderMath();
470        }
471
472        function renderMath() {
473            if (typeof renderMathInElement === 'function') {
474                renderMathInElement(tableBody, {
475                    delimiters: [
476                        {left: '$$', right: '$$', display: true},
477                        {left: '$', right: '$', display: false},
478                        {left: '\\(', right: '\\)', display: false},
479                        {left: '\\[', right: '\\]', display: true}
480                    ],
481                    throwOnError: false
482                });
483            } else {
484                // If script not loaded yet, try again in a bit
485                setTimeout(renderMath, 100);
486            }
487        }
488
489        function renderPagination(totalPages) {
490            if (totalPages <= 1) { paginationEl.innerHTML = ''; return; }
491
492            let html = `<button id="prev-btn" ${currentPage===1?'disabled':''}>← Prev</button>`;
493
494            const maxButtons = 7;
495            let startP = Math.max(1, currentPage - Math.floor(maxButtons/2));
496            let endP = Math.min(totalPages, startP + maxButtons - 1);
497            if (endP - startP < maxButtons - 1) startP = Math.max(1, endP - maxButtons + 1);
498
499            if (startP > 1) { html += `<button data-page="1">1</button>`; if (startP > 2) html += `<span class="page-info">…</span>`; }
500            for (let i = startP; i <= endP; i++) {
501                html += `<button data-page="${i}" class="${i===currentPage?'active':''}">${i}</button>`;
502            }
503            if (endP < totalPages) { if (endP < totalPages-1) html += `<span class="page-info">…</span>`; html += `<button data-page="${totalPages}">${totalPages}</button>`; }
504
505            html += `<span class="page-info">Page ${currentPage} of ${totalPages}</span>`;
506            html += `<button id="next-btn" ${currentPage===totalPages?'disabled':''}>Next →</button>`;
507
508            paginationEl.innerHTML = html;
509
510            document.getElementById('prev-btn').addEventListener('click', () => { currentPage--; renderPage(); window.scrollTo({top:300,behavior:'smooth'}); });
511            document.getElementById('next-btn').addEventListener('click', () => { currentPage++; renderPage(); window.scrollTo({top:300,behavior:'smooth'}); });
512            paginationEl.querySelectorAll('[data-page]').forEach(btn => {
513                btn.addEventListener('click', () => { currentPage = parseInt(btn.dataset.page); renderPage(); window.scrollTo({top:300,behavior:'smooth'}); });
514            });
515        }
516
517        let debounceTimer;
518        searchInput.addEventListener('input', () => { clearTimeout(debounceTimer); debounceTimer = setTimeout(applyFilters, 200); });
519        typeFilter.addEventListener('change', applyFilters);
520        artifactFilters.forEach(cb => cb.addEventListener('change', applyFilters));
521
522        document.addEventListener('DOMContentLoaded', init);
523    </script>
523
524</body>
525</html>

Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.