PageSourceSearch

https://taldatech.github.io/lpwm-web/

html taldatech.github.io collected 2026-10-03 10:03:17 UTC 77,648 bytes, 2,057 lines download raw bytes

1<!DOCTYPE html>
2<html lang="en">
3<head>
4	<!-- Google tag (gtag.js) -->
vendor: 65 bytes, lines 4-5
4
5	<script async src="https://www.googletagmanager.com/gtag/js?id=
5G-WMPS4W4D9N
vendor: 13 bytes, lines 5-6
5"></script>
6	
6<script>
7	  
vendor: 137 bytes, lines 7-11
7window.dataLayer = window.dataLayer || [];
8	  function gtag(){dataLayer.push(arguments);}
9	  gtag('js', new Date());
10
11	  gtag('config', '
11G-WMPS4W4D9N
vendor: 5 bytes, lines 11-12
11');
12	
12</script>
12
13    <meta charset="UTF-8">
14    <meta name="viewport" content="width=device-width, initial-scale=1.0">
15    <title>Latent Particle World Models</title>
16    <link rel="icon" type="image/svg+xml" href="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cdefs%3E%3CradialGradient id='grad1' cx='50%25' cy='50%25' r='50%25'%3E%3Cstop offset='0%25' style='stop-color:%2360a5fa;stop-opacity:1' /%3E%3Cstop offset='100%25' style='stop-color:%23a78bfa;stop-opacity:1' /%3E%3C/radialGradient%3E%3C/defs%3E%3Ccircle cx='25' cy='25' r='8' fill='%2360a5fa' opacity='0.9'/%3E%3Ccircle cx='75' cy='25' r='7' fill='%23a78bfa' opacity='0.9'/%3E%3Ccircle cx='50' cy='50' r='10' fill='url(%23grad1)' opacity='1'/%3E%3Ccircle cx='25' cy='75' r='6' fill='%23f472b6' opacity='0.9'/%3E%3Ccircle cx='75' cy='75' r='7' fill='%2360a5fa' opacity='0.9'/%3E%3Cline x1='25' y1='25' x2='50' y2='50' stroke='%2360a5fa' stroke-width='2' opacity='0.4'/%3E%3Cline x1='75' y1='25' x2='50' y2='50' stroke='%23a78bfa' stroke-width='2' opacity='0.4'/%3E%3Cline x1='25' y1='75' x2='50' y2='50' stroke='%23f472b6' stroke-width='2' opacity='0.4'/%3E%3Cline x1='75' y1='75' x2='50' y2='50' stroke='%2360a5fa' stroke-width='2' opacity='0.4'/%3E%3C/svg%3E">
17    <style>
18        * {
19            margin: 0;
20            padding: 0;
21            box-sizing: border-box;
22        }
23
24        body {
25            font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
26            background: #000;
27            color: #e0e0e0;
28            overflow-x: hidden;
29        }
30
31        #particles-canvas {
32            position: fixed;
33            top: 0;
34            left: 0;
35            width: 100%;
36            height: 100%;
37            z-index: 0;
38            pointer-events: none;
39        }
40
41        .content {
42            position: relative;
43            z-index: 1;
44        }
45
46        header {
47            position: fixed;
48            top: 0;
49            width: 100%;
50            background: rgba(0, 0, 0, 0.8);
51            backdrop-filter: blur(10px);
52            padding: 1rem 2rem;
53            z-index: 100;
54            transform: translateY(-100%);
55            transition: transform 0.3s ease;
56        }
57
58        header.visible {
59            transform: translateY(0);
60        }
61
62        nav {
63            max-width: 1200px;
64            margin: 0 auto;
65            display: flex;
66            gap: 2rem;
67            justify-content: center;
68        }
69
70        nav a {
71            color: #e0e0e0;
72            text-decoration: none;
73            font-size: 0.9rem;
74            transition: color 0.3s;
75        }
76
77        nav a:hover {
78            color: #60a5fa;
79        }
80
81        /* Side Navigation */
82        .side-nav {
83            position: fixed;
84            left: 2rem;
85            top: 50%;
86            transform: translateY(-50%);
87            z-index: 90;
88            opacity: 0;
89            transition: opacity 0.3s ease;
90        }
91
92        .side-nav.visible {
93            opacity: 1;
94        }
95
96        .side-nav-item {
97            display: block;
98            width: 8px;
99            height: 8px;
100            background: rgba(96, 165, 250, 0.3);
101            border-radius: 50%;
102            margin: 1rem 0;
103            cursor: pointer;
104            transition: all 0.3s ease;
105            position: relative;
106        }
107
108        .side-nav-item:hover,
109        .side-nav-item.active {
110            background: rgba(96, 165, 250, 0.8);
111            transform: scale(1.5);
112        }
113
114        .side-nav-item::before {
115            content: attr(data-label);
116            position: absolute;
117            left: 20px;
118            top: 50%;
119            transform: translateY(-50%);
120            background: rgba(0, 0, 0, 0.9);
121            color: #60a5fa;
122            padding: 0.3rem 0.8rem;
123            border-radius: 4px;
124            font-size: 0.75rem;
125            white-space: nowrap;
126            opacity: 0;
127            pointer-events: none;
128            transition: opacity 0.3s ease;
129        }
130
131        .side-nav-item:hover::before {
132            opacity: 1;
133        }
134
135        .hero {
136            min-height: 100vh;
137            display: flex;
138            flex-direction: column;
139            justify-content: center;
140            align-items: center;
141            text-align: center;
142            padding: 2rem;
143        }
144
145        h1 {
146            font-size: 3.5rem;
147            font-weight: 700;
148            margin-bottom: 1rem;
149            background: linear-gradient(135deg, #60a5fa 0%, #a78bfa 100%);
150            -webkit-background-clip: text;
151            -webkit-text-fill-color: transparent;
152            background-clip: text;
153            line-height: 1.3;
154        }
155
156        .subtitle {
157            font-size: 1.5rem;
158            color: #b0b0b0;
159            font-weight: 400;
160            margin-bottom: 2rem;
161            line-height: 1.5;
162        }
163
164        .venue {
165            font-size: 1.2rem;
166            color: #a78bfa;
167            font-weight: 600;
168            margin-bottom: 2rem;
169        }
170
171        .authors {
172            display: flex;
173            gap: 2rem;
174            justify-content: center;
175            flex-wrap: wrap;
176            margin-bottom: 2rem;
177            font-size: 1.1rem;
178        }
179
180        .author {
181            color: #e0e0e0;
182            text-decoration: none;
183            transition: all 0.3s ease;
184            position: relative;
185            display: inline-block;
186        }
187
188        .author:hover {
189            color: #60a5fa;
190        }
191
192        .author::after {
193            content: '';
194            position: absolute;
195            bottom: -2px;
196            left: 0;
197            width: 0;
198            height: 2px;
199            background: #60a5fa;
200            transition: width 0.3s ease;
201        }
202
203        .author:hover::after {
204            width: 100%;
205        }
206
207        .author sup {
208            font-size: 0.7em;
209            color: #a78bfa;
210            font-weight: 600;
211            margin-left: 2px;
212        }
213
214        /* Affiliations */
215        .affiliations {
216            display: flex;
217            flex-wrap: wrap;
218            justify-content: center;
219            gap: 1.5rem;
220            margin-top: 1.5rem;
221            font-size: 0.95rem;
222            max-width: 900px;
223            margin-left: auto;
224            margin-right: auto;
225        }
226
227        .affiliation {
228            color: #909090;
229            display: flex;
230            align-items: center;
231            gap: 0.4rem;
232        }
233
234        .affiliation sup {
235            color: #a78bfa;
236            font-weight: 700;
237            font-size: 0.85em;
238        }
239
240        /* BibTeX Citation Section */
241        .citation-section {
242            margin-top: 2rem;
243            max-width: 800px;
244            margin-left: auto;
245            margin-right: auto;
246        }
247
248        .citation-toggle {
249            display: inline-flex;
250            align-items: center;
251            gap: 0.5rem;
252            padding: 0.7rem 1.5rem;
253            background: rgba(96, 165, 250, 0.1);
254            border: 2px solid rgba(96, 165, 250, 0.3);
255            color: #60a5fa;
256            border-radius: 8px;
257            cursor: pointer;
258            font-size: 0.95rem;
259            font-weight: 600;
260            transition: all 0.3s ease;
261        }
262
263        .citation-toggle:hover {
264            background: rgba(96, 165, 250, 0.2);
265            border-color: rgba(96, 165, 250, 0.5);
266            transform: translateY(-2px);
267        }
268
269        .citation-toggle svg {
270            width: 18px;
271            height: 18px;
272            fill: #60a5fa;
273            transition: transform 0.3s ease;
274        }
275
276        .citation-toggle.active svg {
277            transform: rotate(180deg);
278        }
279
280        .citation-content {
281            max-height: 0;
282            overflow: hidden;
283            transition: max-height 0.4s ease;
284            margin-top: 0;
285        }
286
287        .citation-content.expanded {
288            max-height: 500px;
289            margin-top: 1rem;
290        }
291
292        .citation-box {
293            background: rgba(0, 0, 0, 0.6);
294            border: 1px solid rgba(96, 165, 250, 0.3);
295            border-radius: 8px;
296            padding: 1.5rem;
297            position: relative;
298        }
299
300        .citation-box pre {
301            margin: 0;
302            color: #d0d0d0;
303            font-family: 'Courier New', Courier, monospace;
304            font-size: 0.85rem;
305            line-height: 1.6;
306            overflow-x: auto;
307            white-space: pre-wrap;
308            word-wrap: break-word;
309            text-align: left;
310        }
311
312        .copy-bibtex-btn {
313            position: absolute;
314            top: 1rem;
315            right: 1rem;
316            padding: 0.5rem 1rem;
317            background: rgba(96, 165, 250, 0.2);
318            border: 1px solid rgba(96, 165, 250, 0.4);
319            color: #60a5fa;
320            border-radius: 6px;
321            cursor: pointer;
322            font-size: 0.8rem;
323            font-weight: 600;
324            transition: all 0.3s ease;
325            display: flex;
326            align-items: center;
327            gap: 0.4rem;
328        }
329
330        .copy-bibtex-btn:hover {
331            background: rgba(96, 165, 250, 0.3);
332            border-color: rgba(96, 165, 250, 0.6);
333        }
334
335        .copy-bibtex-btn svg {
336            width: 14px;
337            height: 14px;
338            fill: #60a5fa;
339        }
340
341        .copy-bibtex-btn.copied {
342            background: rgba(34, 197, 94, 0.2);
343            border-color: rgba(34, 197, 94, 0.4);
344            color: #22c55e;
345        }
346
347        .copy-bibtex-btn.copied svg {
348            fill: #22c55e;
349        }
350
351        /* Circular Icon Buttons */
352        .links {
353            display: flex;
354            gap: 2rem;
355            margin-top: 2rem;
356            flex-wrap: wrap;
357            justify-content: center;
358        }
359
360        .icon-btn {
361            display: flex;
362            flex-direction: column;
363            align-items: center;
364            gap: 0.6rem;
365            text-decoration: none;
366            transition: all 0.3s ease;
367        }
368
369        .icon-btn-circle {
370            width: 60px;
371            height: 60px;
372            border-radius: 50%;
373            background: rgba(96, 165, 250, 0.1);
374            border: 2px solid #60a5fa;
375            display: flex;
376            align-items: center;
377            justify-content: center;
378            transition: all 0.3s ease;
379            position: relative;
380            overflow: hidden;
381        }
382
383        .icon-btn-circle::before {
384            content: '';
385            position: absolute;
386            top: 50%;
387            left: 50%;
388            width: 0;
389            height: 0;
390            border-radius: 50%;
391            background: rgba(96, 165, 250, 0.2);
392            transform: translate(-50%, -50%);
393            transition: all 0.3s ease;
394        }
395
396        .icon-btn:hover .icon-btn-circle::before {
397            width: 100%;
398            height: 100%;
399        }
400
401        .icon-btn:hover .icon-btn-circle {
402            transform: translateY(-4px);
403            box-shadow: 0 6px 25px rgba(96, 165, 250, 0.4);
404            background: rgba(96, 165, 250, 0.15);
405        }
406
407        .icon-btn-circle svg {
408            width: 28px;
409            height: 28px;
410            fill: #60a5fa;
411            position: relative;
412            z-index: 1;
413            transition: all 0.3s ease;
414        }
415
416        .icon-btn:hover .icon-btn-circle svg {
417            transform: scale(1.1);
418        }
419
420        .icon-btn-label {
421            color: #60a5fa;
422            font-size: 0.85rem;
423            font-weight: 600;
424            transition: color 0.3s ease;
425        }
426
427        .icon-btn:hover .icon-btn-label {
428            color: #93c5fd;
429        }
430
431        /* Different colors for different button types */
432        .icon-btn.arxiv .icon-btn-circle {
433            border-color: #f472b6;
434            background: rgba(244, 114, 182, 0.1);
435        }
436
437        .icon-btn.arxiv .icon-btn-circle svg {
438            fill: #f472b6;
439        }
440
441        .icon-btn.arxiv .icon-btn-label {
442            color: #f472b6;
443        }
444
445        .icon-btn.arxiv:hover .icon-btn-circle {
446            background: rgba(244, 114, 182, 0.15);
447            box-shadow: 0 6px 25px rgba(244, 114, 182, 0.4);
448        }
449
450        .icon-btn.arxiv:hover .icon-btn-label {
451            color: #f9a8d4;
452        }
453
454        .icon-btn.github .icon-btn-circle {
455            border-color: #a78bfa;
456            background: rgba(167, 139, 250, 0.1);
457        }
458
459        .icon-btn.github .icon-btn-circle svg {
460            fill: #a78bfa;
461        }
462
463        .icon-btn.github .icon-btn-label {
464            color: #a78bfa;
465        }
466
467        .icon-btn.github:hover .icon-btn-circle {
468            background: rgba(167, 139, 250, 0.15);
469            box-shadow: 0 6px 25px rgba(167, 139, 250, 0.4);
470        }
471
472        .icon-btn.github:hover .icon-btn-label {
473            color: #c4b5fd;
474        }
475
476        .icon-btn.video .icon-btn-circle {
477            border-color: #ef4444;
478            background: rgba(239, 68, 68, 0.1);
479        }
480
481        .icon-btn.video .icon-btn-circle svg {
482            fill: #ef4444;
483        }
484
485        .icon-btn.video .icon-btn-label {
486            color: #ef4444;
487        }
488
489        .icon-btn.video:hover .icon-btn-circle {
490            background: rgba(239, 68, 68, 0.15);
491            box-shadow: 0 6px 25px rgba(239, 68, 68, 0.4);
492        }
493
494        .icon-btn.video:hover .icon-btn-label {
495            color: #f87171;
496        }
497
498        section {
499            max-width: 1000px;
500            margin: 0 auto;
501            padding: 6rem 2rem;
502            min-height: 60vh;
503        }
504
505        h2 {
506            font-size: 2.5rem;
507            margin-bottom: 2rem;
508            color: #60a5fa;
509            text-align: center;
510        }
511
512        .abstract-text {
513            font-size: 1.1rem;
514            line-height: 1.8;
515            color: #b0b0b0;
516            text-align: center;
517        }
518
519        .architecture-content, .results-content {
520            display: grid;
521            gap: 2rem;
522        }
523
524        .placeholder {
525            background: rgba(96, 165, 250, 0.05);
526            border: 2px dashed rgba(96, 165, 250, 0.3);
527            border-radius: 12px;
528            padding: 3rem;
529            text-align: center;
530            color: #808080;
531        }
532
533        .placeholder img {
534            max-width: 100%;
535            height: auto;
536            display: block;
537            margin: 2rem auto;
538        }
539
540        .placeholder h3 {
541            margin-bottom: 1rem;
542        }
543
544        .placeholder p {
545            margin-top: 1rem;
546            text-align: left;
547            color: #909090;
548            line-height: 1.6;
549        }
550
551        .placeholder p {
552            color: #d0d0d0;
553            font-size: 1.05rem;
554            line-height: 1.6;
555            font-weight: 400;
556            margin-top: 1rem;
557        }
558
559        .dataset-section {
560            background: rgba(96, 165, 250, 0.03);
561            border: 1px solid rgba(96, 165, 250, 0.2);
562            border-radius: 16px;
563            padding: 2rem;
564            margin-bottom: 2rem;
565            transition: all 0.3s ease;
566            scroll-margin-top: 100px;
567        }
568
569        .dataset-section:hover {
570            border-color: rgba(96, 165, 250, 0.4);
571            background: rgba(96, 165, 250, 0.05);
572        }
573
574        .dataset-header {
575            margin-bottom: 1.5rem;
576            display: flex;
577            justify-content: space-between;
578            align-items: center;
579            flex-wrap: wrap;
580            gap: 1rem;
581        }
582
583        .dataset-title-group {
584            flex: 1;
585        }
586
587        .dataset-title {
588            font-size: 1.8rem;
589            color: #a78bfa;
590            margin-bottom: 0.5rem;
591        }
592
593        .dataset-description {
594            color: #909090;
595            font-size: 1rem;
596            line-height: 1.6;
597        }
598
599        /* Video Grid Layouts */
600        .video-grid {
601            display: grid;
602            gap: 1.5rem;
603            margin-top: 1.5rem;
604        }
605
606        /* Standard 2-column layout */
607        .video-grid.layout-2col {
608            grid-template-columns: repeat(2, 1fr);
609        }
610
611        /* Asymmetric layout: 1 wide on top, 2 below */
612        .video-grid.layout-asymmetric {
613            grid-template-columns: repeat(2, 1fr);
614        }
615
616        .video-grid.layout-asymmetric .video-item:first-child {
617            grid-column: 1 / -1;
618        }
619
620        .video-grid.layout-asymmetric .video-item:first-child .video-placeholder {
621            aspect-ratio: 21 / 9;
622        }
623
624        .video-item {
625            background: rgba(0, 0, 0, 0.4);
626            border-radius: 12px;
627            overflow: hidden;
628            border: 1px solid rgba(96, 165, 250, 0.2);
629            transition: all 0.3s ease;
630        }
631
632        .video-item:hover {
633            border-color: rgba(96, 165, 250, 0.5);
634            transform: translateY(-2px);
635            box-shadow: 0 8px 30px rgba(96, 165, 250, 0.2);
636        }
637
638        .video-placeholder {
639            aspect-ratio: 16 / 9;
640            background: linear-gradient(135deg, rgba(96, 165, 250, 0.1) 0%, rgba(167, 139, 250, 0.1) 100%);
641            display: flex;
642            align-items: center;
643            justify-content: center;
644            color: #808080;
645            font-size: 1.2rem;
646            cursor: pointer;
647            transition: transform 0.3s ease;
648        }
649
650        .video-item:hover .video-placeholder {
651            transform: scale(1.02);
652        }
653
654        .video-placeholder img {
655            display: block;
656            width: 100%;
657            max-width: 100%;
658            height: auto;
659            transition: opacity 0.3s ease;
660        }
661
662        .video-item:hover .video-placeholder img {
663            opacity: 0.9;
664        }
665
666        .video-caption {
667            padding: 1rem;
668            color: #d0d0d0;
669            font-size: 1.05rem;
670            line-height: 1.6;
671            font-weight: 400;
672        }
673
674        .expandable-videos {
675            max-height: 0;
676            overflow: hidden;
677            transition: max-height 0.5s ease;
678        }
679
680        .expandable-videos.expanded {
681            max-height: 2000px;
682        }
683
684        .expand-btn {
685            margin-top: 1.5rem;
686            width: 100%;
687            padding: 0.8rem;
688            background: rgba(96, 165, 250, 0.1);
689            border: 1px solid rgba(96, 165, 250, 0.3);
690            color: #60a5fa;
691            border-radius: 8px;
692            cursor: pointer;
693            font-size: 1rem;
694            font-weight: 600;
695            transition: all 0.3s ease;
696            display: flex;
697            align-items: center;
698            justify-content: center;
699            gap: 0.5rem;
700        }
701
702        .expand-btn:hover {
703            background: rgba(96, 165, 250, 0.2);
704            border-color: rgba(96, 165, 250, 0.5);
705        }
706
707        .expand-btn .arrow {
708            transition: transform 0.3s ease;
709        }
710
711        .expand-btn.expanded .arrow {
712            transform: rotate(180deg);
713        }
714
715        /* External link button for datasets */
716        .dataset-link {
717            display: inline-flex;
718            align-items: center;
719            gap: 0.5rem;
720            padding: 0.6rem 1.2rem;
721            background: rgba(96, 165, 250, 0.1);
722            border: 1px solid rgba(96, 165, 250, 0.3);
723            color: #60a5fa;
724            text-decoration: none;
725            border-radius: 8px;
726            font-size: 0.9rem;
727            font-weight: 600;
728            transition: all 0.3s ease;
729            margin-top: 1rem;
730        }
731
732        .dataset-link:hover {
733            background: rgba(96, 165, 250, 0.2);
734            border-color: rgba(96, 165, 250, 0.5);
735            transform: translateX(4px);
736        }
737
738        .dataset-link svg {
739            width: 16px;
740            height: 16px;
741            fill: #60a5fa;
742            transition: transform 0.3s ease;
743        }
744
745        .dataset-link:hover svg {
746            transform: translateX(2px);
747        }
748
749        /* Related Work Section */
750        .related-work-section {
751            background: rgba(167, 139, 250, 0.03);
752            border: 1px solid rgba(167, 139, 250, 0.2);
753            border-radius: 16px;
754            padding: 3rem 2rem;
755            margin-top: 4rem;
756        }
757
758        .related-work-title {
759            font-size: 2rem;
760            color: #a78bfa;
761            text-align: center;
762            margin-bottom: 0.5rem;
763        }
764
765        .related-work-subtitle {
766            text-align: center;
767            color: #909090;
768            margin-bottom: 2rem;
769            font-size: 1rem;
770        }
771
772        .carousel-container {
773            position: relative;
774            overflow: visible;
775            padding: 1rem 0;
776            margin: 0 60px;
777        }
778
779        .carousel-nav-btn {
780            position: absolute;
781            top: 50%;
782            transform: translateY(-50%);
783            width: 50px;
784            height: 50px;
785            background: rgba(167, 139, 250, 0.3);
786            border: 2px solid rgba(167, 139, 250, 0.6);
787            border-radius: 50%;
788            display: flex;
789            align-items: center;
790            justify-content: center;
791            cursor: pointer;
792            z-index: 10;
793            transition: all 0.3s ease;
794            box-shadow: 0 4px 12px rgba(167, 139, 250, 0.3);
795        }
796
797        .carousel-nav-btn:hover {
798            background: rgba(167, 139, 250, 0.5);
799            border-color: rgba(167, 139, 250, 0.8);
800            transform: translateY(-50%) scale(1.15);
801            box-shadow: 0 6px 20px rgba(167, 139, 250, 0.5);
802        }
803
804        .carousel-nav-btn.left {
805            left: -60px;
806        }
807
808        .carousel-nav-btn.right {
809            right: -60px;
810        }
811
812        .carousel-nav-btn svg {
813            width: 24px;
814            height: 24px;
815            fill: #a78bfa;
816        }
817
818        .carousel-track {
819            display: flex;
820            gap: 1.5rem;
821            overflow-x: auto;
822            overflow-y: visible;
823            scroll-behavior: smooth;
824            scrollbar-width: thin;
825            scrollbar-color: rgba(167, 139, 250, 0.3) rgba(167, 139, 250, 0.05);
826            padding: 0.5rem;
827            scroll-snap-type: x mandatory;
828        }
829
830        .carousel-track::-webkit-scrollbar {
831            height: 8px;
832        }
833
834        .carousel-track::-webkit-scrollbar-track {
835            background: rgba(167, 139, 250, 0.05);
836            border-radius: 4px;
837        }
838
839        .carousel-track::-webkit-scrollbar-thumb {
840            background: rgba(167, 139, 250, 0.3);
841            border-radius: 4px;
842        }
843
844        .carousel-track::-webkit-scrollbar-thumb:hover {
845            background: rgba(167, 139, 250, 0.5);
846        }
847
848        .work-card {
849            min-width: 280px;
850            max-width: 280px;
851            background: rgba(0, 0, 0, 0.4);
852            border: 1px solid rgba(167, 139, 250, 0.3);
853            border-radius: 12px;
854            overflow: hidden;
855            transition: all 0.3s ease;
856            cursor: pointer;
857            text-decoration: none;
858            color: inherit;
859            display: flex;
860            flex-direction: column;
861            scroll-snap-align: start;
862        }
863
864        .work-card:hover {
865            transform: translateY(-4px);
866            border-color: rgba(167, 139, 250, 0.6);
867            box-shadow: 0 8px 30px rgba(167, 139, 250, 0.3);
868        }
869
870        .work-card-image {
871            aspect-ratio: 16 / 10;
872            background: linear-gradient(135deg, rgba(167, 139, 250, 0.15) 0%, rgba(96, 165, 250, 0.15) 100%);
873            display: flex;
874            align-items: center;
875            justify-content: center;
876            color: #808080;
877            font-size: 0.9rem;
878            overflow: hidden;
879        }
880
881        .work-card-image img {
882            width: 100%;
883            height: 100%;
884            object-fit: contain;
885        }
886
887        .work-card-content {
888            padding: 1.2rem;
889            flex: 1;
890            display: flex;
891            flex-direction: column;
892        }
893
894        .work-card-title {
895            color: #a78bfa;
896            font-size: 1rem;
897            font-weight: 600;
898            margin-bottom: 0.5rem;
899            line-height: 1.4;
900        }
901
902        .work-card-authors {
903            color: #808080;
904            font-size: 0.8rem;
905            margin-bottom: 0.5rem;
906        }
907
908        .work-card-venue {
909            color: #60a5fa;
910            font-size: 0.75rem;
911            font-weight: 600;
912            margin-top: auto;
913        }
914
915        /* Video Modal/Lightbox */
916        .video-modal {
917            display: none;
918            position: fixed;
919            top: 0;
920            left: 0;
921            width: 100%;
922            height: 100%;
923            background: rgba(0, 0, 0, 0.95);
924            z-index: 1000;
925            align-items: center;
926            justify-content: center;
927            opacity: 0;
928            transition: opacity 0.3s ease;
929        }
930
931        .video-modal.active {
932            display: flex;
933            opacity: 1;
934        }
935
936        .video-modal-content {
937            max-width: 90vw;
938            max-height: 90vh;
939            position: relative;
940            animation: zoomIn 0.3s ease;
941        }
942
943        @keyframes zoomIn {
944            from {
945                transform: scale(0.8);
946                opacity: 0;
947            }
948            to {
949                transform: scale(1);
950                opacity: 1;
951            }
952        }
953
954        .video-modal-content img {
955            max-width: 100%;
956            max-height: 90vh;
957            border-radius: 12px;
958            box-shadow: 0 20px 60px rgba(96, 165, 250, 0.3);
959            border: 2px solid rgba(96, 165, 250, 0.3);
960        }
961
962        .video-modal-close {
963            position: absolute;
964            top: -40px;
965            right: 0;
966            background: rgba(96, 165, 250, 0.2);
967            border: 2px solid rgba(96, 165, 250, 0.4);
968            color: #60a5fa;
969            width: 36px;
970            height: 36px;
971            border-radius: 50%;
972            display: flex;
973            align-items: center;
974            justify-content: center;
975            cursor: pointer;
976            font-size: 1.5rem;
977            font-weight: 300;
978            transition: all 0.3s ease;
979        }
980
981        .video-modal-close:hover {
982            background: rgba(96, 165, 250, 0.3);
983            border-color: rgba(96, 165, 250, 0.6);
984            transform: rotate(90deg);
985        }
986
987        .video-modal-caption {
988            text-align: center;
989            color: #b0b0b0;
990            margin-top: 1rem;
991            font-size: 1rem;
992        }
993
994        footer {
995            text-align: center;
996            padding: 3rem 2rem;
997            color: #606060;
998            border-top: 1px solid rgba(96, 165, 250, 0.1);
999        }
1000
1001        @media (max-width: 768px) {
1002            h1 {
1003                font-size: 2rem;
1004                line-height: 1.2;
1005            }
1006
1007            .subtitle {
1008                font-size: 1rem;
1009            }
1010
1011            .venue {
1012                font-size: 1rem;
1013            }
1014
1015            .authors {
1016                font-size: 1rem;
1017                gap: 1rem;
1018            }
1019
1020            .affiliations {
1021                font-size: 0.85rem;
1022                gap: 1rem;
1023            }
1024
1025            section {
1026                padding: 4rem 1rem;
1027            }
1028
1029            h2 {
1030                font-size: 2rem;
1031            }
1032
1033            .video-grid.layout-2col,
1034            .video-grid.layout-asymmetric {
1035                grid-template-columns: 1fr;
1036                gap: 1rem;
1037            }
1038
1039            .video-grid.layout-asymmetric .video-item:first-child {
1040                grid-column: 1;
1041            }
1042
1043            .video-grid.layout-asymmetric .video-item:first-child .video-placeholder {
1044                aspect-ratio: 16 / 9;
1045            }
1046
1047            .video-caption {
1048                font-size: 0.95rem;
1049                padding: 0.8rem;
1050            }
1051
1052            .side-nav {
1053                display: none;
1054            }
1055
1056            .work-card {
1057                min-width: 240px;
1058                max-width: 240px;
1059            }
1060
1061            .icon-btn-circle {
1062                width: 50px;
1063                height: 50px;
1064            }
1065
1066            .icon-btn-circle svg {
1067                width: 24px;
1068                height: 24px;
1069            }
1070
1071            .carousel-nav-btn {
1072                display: none;
1073            }
1074
1075            .carousel-container {
1076                margin: 0;
1077            }
1078
1079            .dataset-section {
1080                padding: 1.5rem;
1081            }
1082
1083            .video-modal-content {
1084                max-width: 95vw;
1085            }
1086
1087            .video-modal-close {
1088                top: -50px;
1089                width: 40px;
1090                height: 40px;
1091            }
1092
1093            .citation-section {
1094                margin-top: 1.5rem;
1095                padding: 0 1rem;
1096            }
1097
1098            .citation-box {
1099                padding: 1rem;
1100            }
1101
1102            .citation-box pre {
1103                font-size: 0.75rem;
1104            }
1105
1106            .copy-bibtex-btn {
1107                position: static;
1108                width: 100%;
1109                margin-top: 1rem;
1110                justify-content: center;
1111            }
1112        }
1113    </style>
1114</head>
1115<body>
1116    <canvas id="particles-canvas"></canvas>
1117
1118    <div class="content">
1119        <header id="sticky-header">
1120            <nav>
1121                <a href="#abstract">Abstract</a>
1122                <a href="#architecture">Architecture</a>
1123                <a href="#results">Results</a>
1124                <a href="#related">Related Work</a>
1125            </nav>
1126        </header>
1127
1128        <!-- Side Navigation -->
1129        <div class="side-nav" id="side-nav">
1130            <div class="side-nav-item" data-label="Sketchy" onclick="scrollToDataset('dataset1')"></div>
1131            <div class="side-nav-item" data-label="Bridge" onclick="scrollToDataset('dataset2')"></div>
1132            <div class="side-nav-item" data-label="Mario" onclick="scrollToDataset('dataset3')"></div>
1133            <div class="side-nav-item" data-label="LanguageTable" onclick="scrollToDataset('dataset4')"></div>
1134            <div class="side-nav-item" data-label="BAIR" onclick="scrollToDataset('dataset5')"></div>
1135            <div class="side-nav-item" data-label="PandaPush" onclick="scrollToDataset('dataset6')"></div>
1136            <div class="side-nav-item" data-label="OGBench" onclick="scrollToDataset('dataset7')"></div>
1137        </div>
1138
1139        <div class="hero">
1140            <h1>Latent Particle World Models</h1>
1141            <p class="subtitle">Self-supervised Object-centric Stochastic Dynamics Modeling</p>
1142            <p class="venue">International Conference on Learning Representations (ICLR) 2026 Oral (Top 1.18%)</p>
1143            
1144            <div class="authors">
1145                <a href="https://taldatech.github.io" class="author">Tal Daniel<sup>1</sup></a>
1146                <a href="https://carl-qi.github.io" class="author">Carl Qi<sup>2</sup></a>
1147                <a href="https://danhrmti.github.io" class="author">Dan Haramati<sup>3</sup></a>
1148                <a href="https://lambda.ai/research" class="author">Amir Zadeh<sup>5</sup></a>
1149                <a href="https://lambda.ai/research" class="author">Chuan Li<sup>5</sup></a>
1150                <a href="https://avivt.github.io/avivt" class="author">Aviv Tamar<sup>4</sup></a>
1151                <a href="https://www.cs.cmu.edu/~dpathak/" class="author">Deepak Pathak<sup>1</sup></a>
1152                <a href="https://r-pad.github.io/" class="author">David Held<sup>1</sup></a>
1153            </div>
1154            
1155            <div class="affiliations">
1156                <div class="affiliation"><sup>1</sup>Carnegie Mellon University</div>
1157				<div class="affiliation"><sup>2</sup>UT Austin</div>
1158                <div class="affiliation"><sup>3</sup>Brown University</div>
1159                <div class="affiliation"><sup>4</sup>Technion</div>
1160                <div class="affiliation"><sup>5</sup>Lambda</div>
1161            </div>
1162            
1163            <!-- BibTeX Citation Section -->
1164            <div class="citation-section">
1165                <button class="citation-toggle" onclick="toggleCitation()" id="citationToggle">
1166                    <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
1167                        <path d="M7 10l5 5 5-5z"/>
1168                    </svg>
1169                    Cite this work
1170                </button>
1171                <div class="citation-content" id="citationContent">
1172                    <div class="citation-box">
1173                        <button class="copy-bibtex-btn" onclick="copyBibtex()" id="copyBtn">
1174                            <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
1175                                <rect x="9" y="9" width="13" height="13" rx="2" ry="2"></rect>
1176                                <path d="M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1"></path>
1177                            </svg>
1178                            Copy
1179                        </button>
1180                        <pre id="bibtexCode">@inproceedings{
1181daniel2026latent,
1182title={Latent Particle World Models: Self-supervised Object-centric Stochastic Dynamics Modeling},
1183author={Tal Daniel and Carl Qi and Dan Haramati and Amir Zadeh and Chuan Li and Aviv Tamar and Deepak Pathak and David Held},
1184booktitle={The Fourteenth International Conference on Learning Representations},
1185year={2026},
1186url={https://openreview.net/forum?id=lTaPtGiUUc}
1187}</pre>
1188                    </div>
1189                </div>
1190            </div>
1191            
1192            <div class="links">
1193                <a href="https://openreview.net/forum?id=lTaPtGiUUc" class="icon-btn">
1194                    <div class="icon-btn-circle">
1195                        <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
1196                            <path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8l-6-6z"/>
1197                            <path d="M14 2v6h6"/>
1198                            <path d="M16 13H8"/>
1199                            <path d="M16 17H8"/>
1200                            <path d="M10 9H8"/>
1201                        </svg>
1202                    </div>
1203                    <span class="icon-btn-label">OpenReview</span>
1204                </a>
1205                
1206                <a href="https://arxiv.org/abs/2603.04553" class="icon-btn arxiv">
1207                    <div class="icon-btn-circle">
1208                        <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
1209                            <path d="M9 2v2H7c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h10c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2h-2V2H9zm0 4h6v2H9V6zm0 4h6v2H9v-2zm0 4h4v2H9v-2z"/>
1210                            <path d="M7 22h10v2H7z"/>
1211                        </svg>
1212                    </div>
1213                    <span class="icon-btn-label">arXiv</span>
1214                </a>
1215                
1216                <a href="https://github.com/taldatech/lpwm" class="icon-btn github">
1217                    <div class="icon-btn-circle">
1218                        <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
1219                            <path d="M12 2C6.477 2 2 6.477 2 12c0 4.42 2.865 8.17 6.839 9.49.5.092.682-.217.682-.482 0-.237-.008-.866-.013-1.7-2.782.603-3.369-1.34-3.369-1.34-.454-1.156-1.11-1.463-1.11-1.463-.908-.62.069-.608.069-.608 1.003.07 1.531 1.03 1.531 1.03.892 1.529 2.341 1.087 2.91.831.092-.646.35-1.086.636-1.336-2.22-.253-4.555-1.11-4.555-4.943 0-1.091.39-1.984 1.029-2.683-.103-.253-.446-1.27.098-2.647 0 0 .84-.269 2.75 1.025A9.578 9.578 0 0112 6.836c.85.004 1.705.114 2.504.336 1.909-1.294 2.747-1.025 2.747-1.025.546 1.377.203 2.394.1 2.647.64.699 1.028 1.592 1.028 2.683 0 3.842-2.339 4.687-4.566 4.935.359.309.678.919.678 1.852 0 1.336-.012 2.415-.012 2.743 0 .267.18.578.688.48C19.138 20.167 22 16.418 22 12c0-5.523-4.477-10-10-10z"/>
1220                        </svg>
1221                    </div>
1222                    <span class="icon-btn-label">Code</span>
1223                </a>
1224                
1225                <a href="https://youtu.be/aZeaCyXJjYI" class="icon-btn video">
1226                    <div class="icon-btn-circle">
1227                        <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
1228                            <path d="M8 5v14l11-7z"/>
1229                        </svg>
1230                    </div>
1231                    <span class="icon-btn-label">Video</span>
1232                </a>
1233            </div>
1234        </div>
1235
1236        <section id="abstract">
1237            <h2>Abstract</h2>
1238            <p class="abstract-text">
1239				We introduce Latent Particle World Model (LPWM), a self-supervised object-centric world model scaled to real-world multi-object datasets and applicable in decision-making.
1240				LPWM autonomously discovers keypoints, bounding boxes, and object masks directly from video data,
1241				enabling it to learn rich scene decompositions without supervision.
1242				Our architecture is trained end-to-end purely from videos and supports
1243				flexible conditioning on actions, language, and image goals. LPWM models stochastic particle dynamics via
1244				a novel latent action module and achieves state-of-the-art results on diverse real-world and synthetic datasets.
1245				Beyond stochastic video modeling, LPWM is readily applicable to decision-making,
1246				including goal-conditioned imitation learning, as we demonstrate in the paper.
1247            </p>
1248        </section>
1249
1250        <section id="architecture">
1251            <h2>Architecture</h2>
1252            <div class="architecture-content">
1253                <div class="placeholder">
1254                    <h3>Latent Particle World Model (LPWM)</h3>
1255					<img src="./assets/arch_main_ltr.png"></img>
1256                    <p>Left: Input frames are encoded into particle sets by the `Encoder` and decoded back to images by the `Decoder`. 
1257					The `Context` module then processes the particles to sample latent actions, which are combined with the particles in the `Dynamics` module to predict
1258					next-step particle states. 
1259					Right: The `Context` module models the per-particle latent action distribution. 
1260					During training, we use the latent inverse dynamics head, while at inference, the latent policy is employed for sampling.</p>
1261                </div>
1262            </div>
1263        </section>
1264
1265        <section id="results">
1266            <h2>Results</h2>
1267            
1268            <div class="dataset-section" id="dataset1">
1269                <div class="dataset-header">
1270                    <div class="dataset-title-group">
1271                        <h3 class="dataset-title">Sketchy</h3>
1272                        <p class="dataset-description">Real-world robotic manipulation</p>
1273                    </div>
1274                </div>
1275                
1276                <div class="video-grid layout-asymmetric" id="dataset1-grid">
1277                    <div class="video-item">
1278                        <div class="video-placeholder"><img src="./assets/sketchy_particlegrid.gif"></img></div>
1279                        <div class="video-caption">Particle grid: self-supervised object-centric decomposition</div>
1280                    </div>
1281                    <div class="video-item">
1282                        <div class="video-placeholder"><img src="./assets/sketchy_0_comp_la.gif"></div>
1283                        <div class="video-caption">Latent action-conditioned video prediction comparison</div>
1284                    </div>
1285                    <div class="video-item">
1286                        <div class="video-placeholder"><img src="./assets/sketchy_2469_lpwm_gen_comp.gif"></div>
1287                        <div class="video-caption">Stochastic video generation</div>
1288                    </div>
1289                </div>
1290                
1291                <div class="expandable-videos" id="dataset1-expand">
1292                    <div class="video-grid layout-2col">
1293                        <div class="video-item">
1294                            <div class="video-placeholder"><img src="./assets/sketchy_65_action_comp.gif"></div>
1295                            <div class="video-caption">Action-conditioned video prediction comparison</div>
1296                        </div>
1297                        <div class="video-item">
1298                            <div class="video-placeholder"><img src="./assets/sketchy_2034_lpwm_gen_comp.gif"></div>
1299                            <div class="video-caption">Stochastic video generation</div>
1300                        </div>
1301                    </div>
1302                </div>
1303                
1304                <button class="expand-btn" onclick="toggleExpand('dataset1-expand', this)">
1305                    Show More <span class="arrow">▼</span>
1306                </button>
1307                
1308                <a href="https://sites.google.com/view/lpwm/sketchy" class="dataset-link">
1309                    View All Videos
1310                    <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
1311                        <path d="M5 12h14M12 5l7 7-7 7"/>
1312                    </svg>
1313                </a>
1314            </div>
1315
1316            <div class="dataset-section" id="dataset2">
1317                <div class="dataset-header">
1318                    <div class="dataset-title-group">
1319                        <h3 class="dataset-title">Bridge</h3>
1320                        <p class="dataset-description">Language-conditioned real-world robotic manipulation</p>
1321                    </div>
1322                </div>
1323                
1324                <div class="video-grid layout-asymmetric" id="dataset2-grid">
1325                    <div class="video-item">
1326                        <div class="video-placeholder"><img src="./assets/bridge_1871_particlegrid.gif"></div>
1327                        <div class="video-caption">Particle grid: self-supervised object-centric decomposition</div>
1328                    </div>
1329                    <div class="video-item">
1330                        <div class="video-placeholder"><img src="./assets/bridge_313_lang_comp.gif"></div>
1331                        <div class="video-caption">Language-conditioned video generation comparison with patch-based VAE (DVAE)</div>
1332                    </div>
1333                    <div class="video-item">
1334                        <div class="video-placeholder"><img src="./assets/bridge_15_lpwm_gen_comp.gif"></div>
1335                        <div class="video-caption">Stochastic language-conditioned video generation</div>
1336                    </div>
1337                </div>
1338                
1339                <div class="expandable-videos" id="dataset2-expand">
1340                    <div class="video-grid layout-2col">
1341                        <div class="video-item">
1342                            <div class="video-placeholder"><img src="./assets/bridge_1871_lang_comp.gif"></div>
1343                            <div class="video-caption">Language-conditioned video generation comparison with patch-based VAE (DVAE)</div>
1344                        </div>
1345                        <div class="video-item">
1346                            <div class="video-placeholder"><img src="./assets/bridge_2069_lpwm_gen_comp.gif"></div>
1347                            <div class="video-caption">Stochastic language-conditioned video generation</div>
1348                        </div>
1349                    </div>
1350                </div>
1351                
1352                <button class="expand-btn" onclick="toggleExpand('dataset2-expand', this)">
1353                    Show More <span class="arrow">▼</span>
1354                </button>
1355                
1356                <a href="https://sites.google.com/view/lpwm/bridge" class="dataset-link">
1357                    View All Videos
1358                    <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
1359                        <path d="M5 12h14M12 5l7 7-7 7"/>
1360                    </svg>
1361                </a>
1362            </div>
1363
1364            <div class="dataset-section" id="dataset3">
1365                <div class="dataset-header">
1366                    <div class="dataset-title-group">
1367                        <h3 class="dataset-title">Mario</h3>
1368                        <p class="dataset-description">Offline expert gameplay video of Mario</p>
1369                    </div>
1370                </div>
1371                
1372                <div class="video-grid layout-asymmetric" id="dataset3-grid">
1373                    <div class="video-item">
1374                        <div class="video-placeholder"><img src="./assets/mario_35_particlegrid.gif"></div>
1375                        <div class="video-caption">Particle grid: self-supervised object-centric decomposition</div>
1376                    </div>
1377                    <div class="video-item">
1378                        <div class="video-placeholder"><img src="./assets/mario_71_latentaction_comp.gif"></div>
1379                        <div class="video-caption">Latent action-conditioned video prediction comparison</div>
1380                    </div>
1381                    <div class="video-item">
1382                        <div class="video-placeholder"><img src="./assets/mario_86_lpwm_gen_comp.gif"></div>
1383                        <div class="video-caption">Stochastic video generation</div>
1384                    </div>
1385                </div>
1386                
1387                <div class="expandable-videos" id="dataset3-expand">
1388                    <div class="video-grid layout-2col">
1389                        <div class="video-item">
1390                            <div class="video-placeholder"><img src="./assets/mario_89_latentaction_comp.gif"></div>
1391                            <div class="video-caption">Latent action-conditioned video prediction comparison</div>
1392                        </div>
1393                        <div class="video-item">
1394                            <div class="video-placeholder"><img src="./assets/mario_35_lpwm_gen_comp.gif"></div>
1395                            <div class="video-caption">Stochastic video generation</div>
1396                        </div>
1397                    </div>
1398                </div>
1399                
1400                <button class="expand-btn" onclick="toggleExpand('dataset3-expand', this)">
1401                    Show More <span class="arrow">▼</span>
1402                </button>
1403                
1404                <a href="https://sites.google.com/view/lpwm/mario" class="dataset-link">
1405                    View All Videos
1406                    <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
1407                        <path d="M5 12h14M12 5l7 7-7 7"/>
1408                    </svg>
1409                </a>
1410            </div>
1411			
1412			<div class="dataset-section" id="dataset4">
1413                <div class="dataset-header">
1414                    <div class="dataset-title-group">
1415                        <h3 class="dataset-title">LanguageTable</h3>
1416                        <p class="dataset-description">Language-conditioned real-world robotic manipulation</p>
1417                    </div>
1418                </div>
1419                
1420                <div class="video-grid layout-asymmetric" id="dataset4-grid">
1421                    <div class="video-item">
1422                        <div class="video-placeholder"><img src="./assets/langtable_476_particlegrid.gif"></div>
1423                        <div class="video-caption">Particle grid: self-supervised object-centric decomposition</div>
1424                    </div>
1425                    <div class="video-item">
1426                        <div class="video-placeholder"><img src="./assets/langtable_12_lang_comp.gif"></div>
1427                        <div class="video-caption">Language-conditioned video generation comparison with patch-based VAE (DVAE)</div>
1428                    </div>
1429                    <div class="video-item">
1430                        <div class="video-placeholder"><img src="./assets/langtable_476_lpwm_gen_comp.gif"></div>
1431                        <div class="video-caption">Stochastic language-conditioned video generation</div>
1432                    </div>
1433                </div>
1434                
1435                <div class="expandable-videos" id="dataset4-expand">
1436                    <div class="video-grid layout-2col">
1437                        <div class="video-item">
1438                            <div class="video-placeholder"><img src="./assets/langtable_6911_lang_comp.gif"></div>
1439                            <div class="video-caption">Language-conditioned video generation comparison with patch-based VAE (DVAE)</div>
1440                        </div>
1441                        <div class="video-item">
1442                            <div class="video-placeholder"><img src="./assets/langtable_218_lpwm_gen_comp.gif"></div>
1443                            <div class="video-caption">Stochastic language-conditioned video generation</div>
1444                        </div>
1445                    </div>
1446                </div>
1447                
1448                <button class="expand-btn" onclick="toggleExpand('dataset4-expand', this)">
1449                    Show More <span class="arrow">▼</span>
1450                </button>
1451                
1452                <a href="https://sites.google.com/view/lpwm/languagetable" class="dataset-link">
1453                    View All Videos
1454                    <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
1455                        <path d="M5 12h14M12 5l7 7-7 7"/>
1456                    </svg>
1457                </a>
1458            </div>
1459			
1460			<div class="dataset-section" id="dataset5">
1461                <div class="dataset-header">
1462                    <div class="dataset-title-group">
1463                        <h3 class="dataset-title">BAIR</h3>
1464                        <p class="dataset-description">Real-world robotic manipulation</p>
1465                    </div>
1466                </div>
1467                
1468                <div class="video-grid layout-asymmetric" id="dataset5-grid">
1469                    <div class="video-item">
1470                        <div class="video-placeholder"><img src="./assets/bair_482_particlegrid.gif"></div>
1471                        <div class="video-caption">Particle grid: self-supervised object-centric decomposition</div>
1472                    </div>
1473                    <div class="video-item">
1474                        <div class="video-placeholder"><img src="./assets/bair_110_latentaction_comp.gif"></div>
1475                        <div class="video-caption">Latent action-conditioned video prediction comparison</div>
1476                    </div>
1477                    <div class="video-item">
1478                        <div class="video-placeholder"><img src="./assets/bair_570_lpwm_gen_comp.gif"></div>
1479                        <div class="video-caption">Stochastic video generation</div>
1480                    </div>
1481                </div>
1482                
1483                <div class="expandable-videos" id="dataset5-expand">
1484                    <div class="video-grid layout-2col">
1485                        <div class="video-item">
1486                            <div class="video-placeholder"><img src="./assets/bair_966_latentaction_comp.gif"></div>
1487                            <div class="video-caption">Latent action-conditioned video prediction comparison</div>
1488                        </div>
1489                        <div class="video-item">
1490                            <div class="video-placeholder"><img src="./assets/bair_719_lpwm_gen_comp.gif"></div>
1491                            <div class="video-caption">Stochastic video generation</div>
1492                        </div>
1493                    </div>
1494                </div>
1495                
1496                <button class="expand-btn" onclick="toggleExpand('dataset5-expand', this)">
1497                    Show More <span class="arrow">▼</span>
1498                </button>
1499                
1500                <a href="https://sites.google.com/view/lpwm/bair" class="dataset-link">
1501                    View All Videos
1502                    <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
1503                        <path d="M5 12h14M12 5l7 7-7 7"/>
1504                    </svg>
1505                </a>
1506            </div>
1507			
1508			<div class="dataset-section" id="dataset6">
1509                <div class="dataset-header">
1510                    <div class="dataset-title-group">
1511                        <h3 class="dataset-title">PandaPush - Imitation Learning</h3>
1512                        <p class="dataset-description">Multi-view simulated image goal-conditioned manipulation</p>
1513                    </div>
1514                </div>
1515                
1516                <div class="video-grid layout-asymmetric" id="dataset6-grid">
1517                    <div class="video-item">
1518                        <div class="video-placeholder"><img src="./assets/panda_49_imagiexe_comp.gif"></div>
1519                        <div class="video-caption">Close-loop imagination-execution (imagined latent actions are mapped to GT actions)</div>
1520                    </div>
1521                    <div class="video-item">
1522                        <div class="video-placeholder"><img src="./assets/panda_65_goalcondmv_comp.gif"></div>
1523                        <div class="video-caption">Image goal-conditioned stochastic generation</div>
1524                    </div>
1525                    <div class="video-item">
1526                        <div class="video-placeholder"><img src="./assets/panda_86_goalcondmv_comp.gif"></div>
1527                        <div class="video-caption">Image goal-conditioned stochastic generation</div>
1528                    </div>
1529                </div>
1530                
1531                <div class="expandable-videos" id="dataset6-expand">
1532                    <div class="video-grid layout-2col">
1533                        <div class="video-item">
1534                            <div class="video-placeholder"><img src="./assets/panda_40_goalcondmv_comp.gif"></div>
1535                            <div class="video-caption">Image goal-conditioned stochastic generation</div>
1536                        </div>
1537                        <div class="video-item">
1538                            <div class="video-placeholder"><img src="./assets/panda_43_goalcondmv_comp.gif"></div>
1539                            <div class="video-caption">Image goal-conditioned stochastic generation</div>
1540                        </div>
1541                    </div>
1542                </div>
1543                
1544                <button class="expand-btn" onclick="toggleExpand('dataset6-expand', this)">
1545                    Show More <span class="arrow">▼</span>
1546                </button>
1547                
1548                <a href="https://sites.google.com/view/lpwm/pandapush" class="dataset-link">
1549                    View All Videos
1550                    <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
1551                        <path d="M5 12h14M12 5l7 7-7 7"/>
1552                    </svg>
1553                </a>
1554            </div>
1555			
1556			<div class="dataset-section" id="dataset7">
1557                <div class="dataset-header">
1558                    <div class="dataset-title-group">
1559                        <h3 class="dataset-title">OGBench - Imitation Learning</h3>
1560                        <p class="dataset-description">Simulated image goal-conditioned manipulation</p>
1561                    </div>
1562                </div>
1563                
1564                <div class="video-grid layout-asymmetric" id="dataset7-grid">
1565                    <div class="video-item">
1566                        <div class="video-placeholder"><img src="./assets/ogbench_44_imagiexe_comp.gif"></div>
1567                        <div class="video-caption">Close-loop imagination-execution (imagined latent actions are mapped to GT actions)</div>
1568                    </div>
1569                    <div class="video-item">
1570                        <div class="video-placeholder"><img src="./assets/ogbench_78_imgcondgen_comp.gif"></div>
1571                        <div class="video-caption">
1571Image goal-conditioned stochastic generation</div>
1572                    </div>
1573                    <div class="video-item">
1574                        <div class="video-placeholder"><img src="./assets/ogbench_23_imgcondgen_comp.gif"></div>
1575                        <div class="video-caption">Image goal-conditioned stochastic generation</div>
1576                    </div>
1577                </div>
1578                
1579                <div class="expandable-videos" id="dataset7-expand">
1580                    <div class="video-grid layout-2col">
1581                        <div class="video-item">
1582                            <div class="video-placeholder"><img src="./assets/ogbench_24_imgcondgen_comp.gif"></div>
1583                            <div class="video-caption">Image goal-conditioned stochastic generation</div>
1584                        </div>
1585                        <div class="video-item">
1586                            <div class="video-placeholder"><img src="./assets/ogbench_44_imgcondgen_comp.gif"></div>
1587                            <div class="video-caption">Image goal-conditioned stochastic generation</div>
1588                        </div>
1589                    </div>
1590                </div>
1591                
1592                <button class="expand-btn" onclick="toggleExpand('dataset7-expand', this)">
1593                    Show More <span class="arrow">▼</span>
1594                </button>
1595                
1596                <a href="https://sites.google.com/view/lpwm/ogbench-scene" class="dataset-link">
1597                    View All Videos
1598                    <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
1599                        <path d="M5 12h14M12 5l7 7-7 7"/>
1600                    </svg>
1601                </a>
1602            </div>
1603			
1604
1605            <!-- Related Work Section -->
1606            <div class="related-work-section" id="related">
1607                <h2 class="related-work-title">Enter the Particleverse</h2>
1608                <p class="related-work-subtitle">Explore other works using deep latent particles (DLP) representation</p>
1609                
1610                <div class="carousel-container">
1611                    <button class="carousel-nav-btn left" onclick="scrollCarousel('left')">
1612                        <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
1613                            <path d="M15 18l-6-6 6-6"/>
1614                        </svg>
1615                    </button>
1616                    <button class="carousel-nav-btn right" onclick="scrollCarousel('right')">
1617                        <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
1618                            <path d="M9 18l6-6-6-6"/>
1619                        </svg>
1620                    </button>
1621                    <div class="carousel-track" id="carouselTrack">
1622                        <a href="https://taldatech.github.io/deep-latent-particles-web/" class="work-card">
1623                            <div class="work-card-image"><img src="https://raw.githubusercontent.com/taldatech/deep-latent-particles-web/main/assets/clevrer_manip_1.gif"></div>
1624                            <div class="work-card-content">
1625                                <div class="work-card-title">Unsupervised Image Representation Learning with Deep Latent Particles</div>
1626                                <div class="work-card-authors">Daniel et al.</div>
1627                                <div class="work-card-venue">ICML 2022</div>
1628                            </div>
1629                        </a>
1630                        
1631                        <a href="https://taldatech.github.io/ddlp-web/" class="work-card">
1632                            <div class="work-card-image"><img src="https://taldatech.github.io/ddlp-web/assets/images/obj3d3.gif"></div>
1633                            <div class="work-card-content">
1634                                <div class="work-card-title">DDLP: Unsupervised Object-Centric Video Prediction with Deep Dynamic Latent Particles</div>
1635                                <div class="work-card-authors">Daniel et al.</div>
1636                                <div class="work-card-venue">TMLR 2024</div>
1637                            </div>
1638                        </a>
1639                        
1640                        <a href="https://sites.google.com/view/entity-centric-rl" class="work-card">
1641                            <div class="work-card-image"><img src="https://danhrmti.github.io/files/publications/ecrl_clip.gif"></div>
1642                            <div class="work-card-content">
1643                                <div class="work-card-title">Entity-Centric Reinforcement Learning for Object Manipulation from Pixels</div>
1644                                <div class="work-card-authors">Haramati et al.</div>
1645                                <div class="work-card-venue">ICLR 2024</div>
1646                            </div>
1647                        </a>
1648                        
1649                        <a href="https://sites.google.com/view/ec-diffuser/" class="work-card">
1650                            <div class="work-card-image"><img src="https://danhrmti.github.io/files/publications/ecdiffuser_clip.gif"></div>
1651                            <div class="work-card-content">
1652                                <div class="work-card-title">EC-Diffuser: Multi-object Manipulation via Entity-centric Behavior Generation</div>
1653                                <div class="work-card-authors">Qi et al.</div>
1654                                <div class="work-card-venue">ICLR 2025</div>
1655                            </div>
1656                        </a>
1657                        
1658                        <a href="https://sites.google.com/view/hecrl" class="work-card">
1659                            <div class="work-card-image"><img src="https://danhrmti.github.io/files/publications/hecrl_clip.gif"></div>
1660                            <div class="work-card-content">
1661                                <div class="work-card-title">Hierarchical Entity-centric Reinforcement Learning with Factored Subgoal Diffusion</div>
1662                                <div class="work-card-authors">Haramati et al.</div>
1663                                <div class="work-card-venue">ICLR 2026</div>
1664                            </div>
1665                        </a>
1666						
1667						<a href="https://eubooks3003.github.io/3d-dlp/" class="work-card">
1668                            <div class="work-card-image"><img src="https://github.com/taldatech/taldatech.github.io/raw/main/img/3DDLP_teaser.gif"></div>
1669                            <div class="work-card-content">
1670                                <div class="work-card-title">3D-DLP: Self-Supervised 3D Object-Centric Scene Representation Learning</div>
1671                                <div class="work-card-authors">Zhang et al.</div>
1672                                <div class="work-card-venue">ICML 2026</div>
1673                            </div>
1674                        </a>
1675						
1676                        <!---
1677                        <a href="#" class="work-card">
1678                            <div class="work-card-image">Thumbnail</div>
1679                            <div class="work-card-content">
1680                                <div class="work-card-title">Contrastive Learning of Structured World Models</div>
1681                                <div class="work-card-authors">Kipf et al.</div>
1682                                <div class="work-card-venue">ICLR 2020</div>
1683                            </div>
1684                        </a>
1685						---!>
1686                    </div>
1687                </div>
1688            </div>
1689
1690        </section>
1691
1692        <footer>
1693            <p>© 2026 Tal Daniel</p>
1694        </footer>
1695    </div>
1696
1697    <!-- Video Modal/Lightbox -->
1698    <div class="video-modal" id="videoModal">
1699        <div class="video-modal-content">
1700            <div class="video-modal-close" onclick="closeVideoModal()">×</div>
1701            <img id="modalImage" src="" alt="">
1702            <div class="video-modal-caption" id="modalCaption"></div>
1703        </div>
1704    </div>
1705
1706    
1706<script>
1707        const canvas = document.getElementById('particles-canvas');
1708        const ctx = canvas.getContext('2d');
1709
1710        canvas.width = window.innerWidth;
1711        canvas.height = window.innerHeight;
1712
1713        const particles = [];
1714        const particleCount = 100;
1715        const mouse = { x: canvas.width / 2, y: canvas.height / 2, radius: 180 };
1716        let time = 0;
1717
1718        function getColor(particle, mouseDistance) {
1719            const normalizedDist = Math.min(mouseDistance / 300, 1);
1720            
1721            if (normalizedDist < 0.4) {
1722                const t = normalizedDist / 0.4;
1723                const r = Math.floor(236 - (236 - 167) * t);
1724                const g = Math.floor(72 + (139 - 72) * t);
1725                const b = Math.floor(153 + (250 - 153) * t);
1726                return `rgba(${r}, ${g}, ${b}, 0.7)`;
1727            } else {
1728                const t = (normalizedDist - 0.4) / 0.6;
1729                const r = Math.floor(167 - (167 - 96) * t);
1730                const g = Math.floor(139 + (165 - 139) * t);
1731                const b = 250;
1732                return `rgba(${r}, ${g}, ${b}, 0.6)`;
1733            }
1734        }
1735
1736        class Particle {
1737            constructor() {
1738                this.x = Math.random() * canvas.width;
1739                this.y = Math.random() * canvas.height;
1740                this.baseX = this.x;
1741                this.baseY = this.y;
1742                this.vx = 0;
1743                this.vy = 0;
1744                this.radius = Math.random() * 2.5 + 1;
1745                this.angle = Math.random() * Math.PI * 2;
1746                this.angleVel = (Math.random() - 0.5) * 0.02;
1747                this.orbitRadius = Math.random() * 40 + 20;
1748            }
1749
1750            update() {
1751                this.angle += this.angleVel;
1752                const targetX = this.baseX + Math.cos(this.angle) * this.orbitRadius;
1753                const targetY = this.baseY + Math.sin(this.angle) * this.orbitRadius;
1754
1755                if (mouse.x != null && mouse.y != null) {
1756                    const dx = mouse.x - this.x;
1757                    const dy = mouse.y - this.y;
1758                    const distance = Math.sqrt(dx * dx + dy * dy);
1759
1760                    if (distance < mouse.radius) {
1761                        const force = (1 - distance / mouse.radius) * 0.5;
1762                        this.vx += (dx / distance) * force;
1763                        this.vy += (dy / distance) * force;
1764                    }
1765                }
1766
1767                this.vx += (targetX - this.x) * 0.01;
1768                this.vy += (targetY - this.y) * 0.01;
1769
1770                this.x += this.vx;
1771                this.y += this.vy;
1772
1773                this.vx *= 0.92;
1774                this.vy *= 0.92;
1775
1776                this.baseX += Math.sin(time * 0.001 + this.angle) * 0.1;
1777                this.baseY += Math.cos(time * 0.001 + this.angle) * 0.1;
1778
1779                if (this.baseX < -50) this.baseX = canvas.width + 50;
1780                if (this.baseX > canvas.width + 50) this.baseX = -50;
1781                if (this.baseY < -50) this.baseY = canvas.height + 50;
1782                if (this.baseY > canvas.height + 50) this.baseY = -50;
1783            }
1784
1785            draw() {
1786                const dx = this.x - mouse.x;
1787                const dy = this.y - mouse.y;
1788                const distance = Math.sqrt(dx * dx + dy * dy);
1789
1790                ctx.beginPath();
1791                ctx.arc(this.x, this.y, this.radius, 0, Math.PI * 2);
1792                ctx.fillStyle = getColor(this, distance);
1793                ctx.fill();
1794                
1795                if (distance < mouse.radius) {
1796                    const glowStrength = 1 - (distance / mouse.radius);
1797                    ctx.shadowBlur = 10 * glowStrength;
1798                    ctx.shadowColor = getColor(this, distance);
1799                    ctx.fill();
1800                    ctx.shadowBlur = 0;
1801                }
1802            }
1803        }
1804
1805        for (let i = 0; i < particleCount; i++) {
1806            particles.push(new Particle());
1807        }
1808
1809        function connectParticles() {
1810            for (let i = 0; i < particles.length; i++) {
1811                for (let j = i + 1; j < particles.length; j++) {
1812                    const dx = particles[i].x - particles[j].x;
1813                    const dy = particles[i].y - particles[j].y;
1814                    const distance = Math.sqrt(dx * dx + dy * dy);
1815
1816                    if (distance < 120) {
1817                        const mdx1 = particles[i].x - mouse.x;
1818                        const mdy1 = particles[i].y - mouse.y;
1819                        const mdist1 = Math.sqrt(mdx1 * mdx1 + mdy1 * mdy1);
1820                        
1821                        const mdx2 = particles[j].x - mouse.x;
1822                        const mdy2 = particles[j].y - mouse.y;
1823                        const mdist2 = Math.sqrt(mdx2 * mdx2 + mdy2 * mdy2);
1824                        
1825                        const avgMouseDist = (mdist1 + mdist2) / 2;
1826                        const normalizedDist = Math.min(avgMouseDist / 300, 1);
1827                        
1828                        let r, g, b;
1829                        if (normalizedDist < 0.4) {
1830                            const t = normalizedDist / 0.4;
1831                            r = Math.floor(236 - (236 - 167) * t);
1832                            g = Math.floor(72 + (139 - 72) * t);
1833                            b = Math.floor(153 + (250 - 153) * t);
1834                        } else {
1835                            const t = (normalizedDist - 0.4) / 0.6;
1836                            r = Math.floor(167 - (167 - 96) * t);
1837                            g = Math.floor(139 + (165 - 139) * t);
1838                            b = 250;
1839                        }
1840                        
1841                        ctx.beginPath();
1842                        ctx.strokeStyle = `rgba(${r}, ${g}, ${b}, ${0.2 * (1 - distance / 120)})`;
1843                        ctx.lineWidth = 1;
1844                        ctx.moveTo(particles[i].x, particles[i].y);
1845                        ctx.lineTo(particles[j].x, particles[j].y);
1846                        ctx.stroke();
1847                    }
1848                }
1849            }
1850        }
1851
1852        function animate() {
1853            ctx.clearRect(0, 0, canvas.width, canvas.height);
1854            time++;
1855
1856            particles.forEach(particle => {
1857                particle.update();
1858                particle.draw();
1859            });
1860
1861            connectParticles();
1862
1863            requestAnimationFrame(animate);
1864        }
1865
1866        animate();
1867
1868        window.addEventListener('mousemove', (e) => {
1869            mouse.x = e.x;
1870            mouse.y = e.y;
1871        });
1872
1873        window.addEventListener('resize', () => {
1874            canvas.width = window.innerWidth;
1875            canvas.height = window.innerHeight;
1876        });
1877
1878        // Sticky header on scroll
1879        window.addEventListener('scroll', () => {
1880            const header = document.getElementById('sticky-header');
1881            const sideNav = document.getElementById('side-nav');
1882            
1883            if (window.scrollY > window.innerHeight * 0.8) {
1884                header.classList.add('visible');
1885                sideNav.classList.add('visible');
1886            } else {
1887                header.classList.remove('visible');
1888                sideNav.classList.remove('visible');
1889            }
1890            
1891            // Update active side nav item
1892            updateActiveSideNav();
1893        });
1894
1895        // Smooth scrolling
1896        document.querySelectorAll('a[href^="#"]').forEach(anchor => {
1897            anchor.addEventListener('click', function (e) {
1898                e.preventDefault();
1899                const target = document.querySelector(this.getAttribute('href'));
1900                if (target) {
1901                    target.scrollIntoView({ behavior: 'smooth', block: 'start' });
1902                }
1903            });
1904        });
1905
1906        // Toggle expand/collapse for video sections
1907        function toggleExpand(sectionId, button) {
1908            const section = document.getElementById(sectionId);
1909            section.classList.toggle('expanded');
1910            button.classList.toggle('expanded');
1911            
1912            if (button.classList.contains('expanded')) {
1913                button.innerHTML = 'Show Less <span class="arrow">▼</span>';
1914            } else {
1915                button.innerHTML = 'Show More <span class="arrow">▼</span>';
1916            }
1917        }
1918
1919        // Scroll to dataset
1920        function scrollToDataset(datasetId) {
1921            const element = document.getElementById(datasetId);
1922            if (element) {
1923                element.scrollIntoView({ behavior: 'smooth', block: 'start' });
1924            }
1925        }
1926
1927        // Update active side nav item based on scroll position
1928        function updateActiveSideNav() {
1929            const datasets = ['dataset1', 'dataset2', 'dataset3', 'dataset4', 'dataset5', 'dataset6', 'dataset7'];
1930            const navItems = document.querySelectorAll('.side-nav-item');
1931            
1932            let activeIndex = 0;
1933            datasets.forEach((id, index) => {
1934                const element = document.getElementById(id);
1935                if (element) {
1936                    const rect = element.getBoundingClientRect();
1937                    if (rect.top <= window.innerHeight / 2) {
1938                        activeIndex = index;
1939                    }
1940                }
1941            });
1942            
1943            navItems.forEach((item, index) => {
1944                if (index === activeIndex) {
1945                    item.classList.add('active');
1946                } else {
1947                    item.classList.remove('active');
1948                }
1949            });
1950        }
1951
1952        // Video Modal Functions
1953        function openVideoModal(imageSrc, caption) {
1954            const modal = document.getElementById('videoModal');
1955            const modalImage = document.getElementById('modalImage');
1956            const modalCaption = document.getElementById('modalCaption');
1957            
1958            modalImage.src = imageSrc;
1959            modalCaption.textContent = caption;
1960            modal.classList.add('active');
1961            
1962            // Prevent body scroll when modal is open
1963            document.body.style.overflow = 'hidden';
1964        }
1965
1966        function closeVideoModal() {
1967            const modal = document.getElementById('videoModal');
1968            modal.classList.remove('active');
1969            
1970            // Restore body scroll
1971            document.body.style.overflow = 'auto';
1972        }
1973
1974        // Close modal when clicking outside the image
1975        document.getElementById('videoModal').addEventListener('click', function(e) {
1976            if (e.target === this) {
1977                closeVideoModal();
1978            }
1979        });
1980
1981        // Close modal with Escape key
1982        document.addEventListener('keydown', function(e) {
1983            if (e.key === 'Escape') {
1984                closeVideoModal();
1985            }
1986        });
1987
1988        // Make all video placeholders clickable
1989        document.addEventListener('DOMContentLoaded', function() {
1990            const videoPlaceholders = document.querySelectorAll('.video-placeholder');
1991            
1992            videoPlaceholders.forEach(placeholder => {
1993                placeholder.addEventListener('click', function() {
1994                    const img = this.querySelector('img');
1995                    const caption = this.nextElementSibling?.textContent || '';
1996                    
1997                    if (img) {
1998                        openVideoModal(img.src, caption);
1999                    }
2000                });
2001            });
2002        });
2003
2004        // Carousel scroll function
2005        function scrollCarousel(direction) {
2006            const track = document.getElementById('carouselTrack');
2007            const scrollAmount = 300; // Amount to scroll in pixels
2008            
2009            if (direction === 'left') {
2010                track.scrollBy({ left: -scrollAmount, behavior: 'smooth' });
2011            } else {
2012                track.scrollBy({ left: scrollAmount, behavior: 'smooth' });
2013            }
2014        }
2015
2016        // BibTeX citation toggle
2017        function toggleCitation() {
2018            const content = document.getElementById('citationContent');
2019            const toggle = document.getElementById('citationToggle');
2020            
2021            content.classList.toggle('expanded');
2022            toggle.classList.toggle('active');
2023        }
2024
2025        // Copy BibTeX to clipboard
2026        function copyBibtex() {
2027            const bibtexCode = document.getElementById('bibtexCode').textContent;
2028            const copyBtn = document.getElementById('copyBtn');
2029            
2030            navigator.clipboard.writeText(bibtexCode).then(function() {
2031                // Change button text and style to show success
2032                copyBtn.innerHTML = `
2033                    <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
2034                        <path d="M20 6L9 17l-5-5"/>
2035                    </svg>
2036                    Copied!
2037                `;
2038                copyBtn.classList.add('copied');
2039                
2040                // Reset after 2 seconds
2041                setTimeout(function() {
2042                    copyBtn.innerHTML = `
2043                        <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
2044                            <rect x="9" y="9" width="13" height="13" rx="2" ry="2"></rect>
2045                            <path d="M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1"></path>
2046                        </svg>
2047                        Copy
2048                    `;
2049                    copyBtn.classList.remove('copied');
2050                }, 2000);
2051            }, function(err) {
2052                console.error('Failed to copy text: ', err);
2053            });
2054        }
2055    </script>
2055
2056</body>
2057</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.