Repository navigation
Expand file tree
/
Copy pathgallery.html
More file actions
202 lines (194 loc) · 43.6 KB
/
Copy pathgallery.html
File metadata and controls
202 lines (194 loc) · 43.6 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
<!DOCTYPE html>
<html lang="en"><head>
<meta charset="utf-8"/>
<meta content="width=device-width, initial-scale=1" name="viewport"/>
<title>Gallery | Code Video Model</title>
<meta content="Explore interactive Code Video Model worlds." name="description"/>
<meta content="Gallery | Code Video Model" property="og:title"/>
<meta content="Explore interactive Code Video Model worlds." property="og:description"/>
<meta content="website" property="og:type"/>
<link href="static/css/style.css?v=separate-gallery-4" rel="stylesheet"/>
<link href="static/css/first-person-bubbles.css?v=group23-pairs-27" rel="stylesheet"/>
<link href="static/css/preview-edit-diff.css?v=2" rel="stylesheet"/>
<link href="static/css/section-atmospheres.css?v=anime-10" rel="stylesheet"/>
<link href="static/css/gallery-scroll.css?v=5" rel="stylesheet"/>
<link href="static/css/custom-layout.css?v=1" rel="stylesheet"/>
<link href="static/css/gallery-navigation.css?v=1" rel="stylesheet"/>
<link href="static/css/local-fonts.css" rel="stylesheet"/><script defer="" src="static/compat/runtime.js?v=517f3351595fe6e0b3e6"></script><script defer="" src="static/compat/start-70ec8257ea07c25e0d6e.js"></script></head>
<body>
<main>
<div class="opening-atmosphere">
<header class="gallery-page-header container">
<a class="gallery-back" href="./">Back to Project Page</a>
</header>
</div>
<!-- anime:start -->
<section class="gallery-section control-world-section" id="anime"><div class="container fps-bubbles-host"><h2>Anime</h2><div aria-label="Anime cases" class="fps-bubble-grid"><div class="fps-bubble-float"><a aria-controls="anime-expanded" aria-expanded="false" aria-label="Open Anime_01" class="case-explore fps-case-bubble" data-case="anime-hotel" data-color="177, 157, 178" data-palette="[[177,157,178],[226,203,185],[176,208,215],[231,218,228]]" data-title="Anime_01" href="?case=anime-hotel"><img alt="" height="216" loading="lazy" src="static/images/first-person-bubbles/Anime_01.webp" width="381"/></a></div><div class="fps-bubble-float"><a aria-controls="anime-expanded" aria-expanded="false" aria-label="Open Anime_02" class="case-explore fps-case-bubble" data-case="anime-kumiko" data-color="177, 157, 178" data-palette="[[177,157,178],[226,203,185],[176,208,215],[231,218,228]]" data-title="Anime_02" href="?case=anime-kumiko"><img alt="" height="192" loading="lazy" src="static/images/first-person-bubbles/Anime_02.webp" width="384"/></a></div><div class="fps-bubble-float"><a aria-controls="anime-expanded" aria-expanded="false" aria-label="Open Anime_03" class="case-explore fps-case-bubble" data-case="anime-nichijou" data-color="177, 157, 178" data-palette="[[177,157,178],[226,203,185],[176,208,215],[231,218,228]]" data-title="Anime_03" href="?case=anime-nichijou"><img alt="" height="216" loading="lazy" src="static/images/first-person-bubbles/Anime_03.webp" width="381"/></a></div><div class="fps-bubble-float"><a aria-controls="anime-expanded" aria-expanded="false" aria-label="Open Anime_04" class="case-explore fps-case-bubble" data-case="three-colossal" data-color="177, 157, 178" data-palette="[[177,157,178],[226,203,185],[176,208,215],[231,218,228]]" data-title="Anime_04" href="?case=three-colossal"><img alt="" height="216" loading="lazy" src="static/images/first-person-bubbles/Anime_04.webp" width="384"/></a></div></div><div class="fps-expanded" hidden="" id="anime-expanded"><div class="fps-expanded-heading"><button class="fps-back" type="button">← Return</button></div><p aria-live="polite" class="fps-load-status" role="status"></p><div class="fps-frame-slot"></div></div></div></section>
<!-- anime:end -->
<section class="gallery-section long-horizon-section" id="long-horizon-style">
<div class="container fps-bubbles-host">
<h2>Bullet Time</h2>
<div aria-label="Bullet Time cases" class="fps-bubble-grid">
<div class="fps-bubble-float"><a aria-controls="long-horizon-style-expanded" aria-expanded="false" aria-label="Open Bullet_Time_01" class="case-explore fps-case-bubble" data-case="505" data-color="20, 22, 28" data-palette="[[18, 22, 27], [3, 4, 9], [14, 9, 10], [41, 49, 61]]" data-title="Bullet_Time_01" href="?case=505" style="--case-rgb: 20, 22, 28; --case-color-1: 18, 22, 27; --case-color-2: 3, 4, 9; --case-color-3: 14, 9, 10; --case-color-4: 41, 49, 61"><img alt="" height="216" loading="lazy" src="static/images/first-person-bubbles/Bullet_Time_01.webp?v=code-model-frame-1" width="384"/></a></div>
<div class="fps-bubble-float"><a aria-controls="long-horizon-style-expanded" aria-expanded="false" aria-label="Open Bullet_Time_02" class="case-explore fps-case-bubble" data-case="508" data-color="76, 81, 88" data-palette="[[39, 43, 49], [16, 18, 24], [77, 83, 92], [170, 179, 188]]" data-title="Bullet_Time_02" href="?case=508" style="--case-rgb: 76, 81, 88; --case-color-1: 39, 43, 49; --case-color-2: 16, 18, 24; --case-color-3: 77, 83, 92; --case-color-4: 170, 179, 188"><img alt="" height="216" loading="lazy" src="static/images/first-person-bubbles/Bullet_Time_02.webp?v=code-model-frame-1" width="384"/></a></div>
<div class="fps-bubble-float"><a aria-controls="long-horizon-style-expanded" aria-expanded="false" aria-label="Open Bullet_Time_03" class="case-explore fps-case-bubble" data-case="518" data-color="98, 121, 91" data-palette="[[91, 102, 26], [138, 175, 206], [50, 66, 17], [109, 135, 105]]" data-title="Bullet_Time_03" href="?case=518" style="--case-rgb: 98, 121, 91; --case-color-1: 91, 102, 26; --case-color-2: 138, 175, 206; --case-color-3: 50, 66, 17; --case-color-4: 109, 135, 105"><img alt="" height="216" loading="lazy" src="static/images/first-person-bubbles/Bullet_Time_03.webp?v=code-model-frame-1" width="384"/></a></div>
<!-- seedance:start -->
<div class="fps-bubble-float"><a aria-controls="long-horizon-style-expanded" aria-expanded="false" aria-label="Open Bullet_Time_04" class="case-explore fps-case-bubble" data-case="rally-hairpin" data-color="93, 85, 79" data-palette="[[102, 92, 81], [71, 68, 64], [46, 47, 48], [142, 127, 116]]" data-title="Bullet_Time_04" href="?case=rally-hairpin" style="--case-rgb: 93, 85, 79"><img alt="" height="216" loading="lazy" src="static/images/first-person-bubbles/Bullet_Time_04.webp" width="384"/></a></div>
<!-- seedance:end -->
</div>
<div class="fps-expanded" hidden="" id="long-horizon-style-expanded">
<div class="fps-expanded-heading">
<button class="fps-back" type="button">← Return</button>
</div>
<p aria-live="polite" class="fps-load-status" role="status"></p>
<div class="fps-frame-slot" id="long-horizon-style-frame-slot"></div>
</div>
</div>
</section><section class="gallery-section control-world-section" id="control-world-states">
<div class="container fps-bubbles-host">
<h2>Gaming</h2>
<div aria-label="Gaming cases" class="fps-bubble-grid">
<div class="fps-bubble-float"><a aria-controls="fps-expanded" aria-expanded="false" aria-label="Open Gaming_01" class="case-explore fps-case-bubble" data-case="first-person-009" data-color="147, 119, 101" data-palette="[[222, 204, 188], [55, 38, 22], [189, 144, 132], [120, 87, 57]]" data-title="Gaming_01" href="?case=first-person-009" style="--case-rgb: 147, 119, 101; --case-color-1: 222, 204, 188; --case-color-2: 55, 38, 22; --case-color-3: 189, 144, 132; --case-color-4: 120, 87, 57"><img alt="" height="216" loading="lazy" src="static/images/first-person-bubbles/Gaming_01.webp?v=code-model-frame-1" width="384"/></a></div>
<div class="fps-bubble-float"><a aria-controls="fps-expanded" aria-expanded="false" aria-label="Open Gaming_02" class="case-explore fps-case-bubble" data-case="first-person-007" data-color="121, 143, 152" data-palette="[[133, 166, 179], [114, 138, 150], [58, 61, 61], [177, 204, 218]]" data-title="Gaming_02" href="?case=first-person-007" style="--case-rgb: 121, 143, 152; --case-color-1: 133, 166, 179; --case-color-2: 114, 138, 150; --case-color-3: 58, 61, 61; --case-color-4: 177, 204, 218"><img alt="" height="216" loading="lazy" src="static/images/first-person-bubbles/Gaming_02.webp?v=code-model-frame-1" width="384"/></a></div>
<div class="fps-bubble-float"><a aria-controls="fps-expanded" aria-expanded="false" aria-label="Open Gaming_03" class="case-explore fps-case-bubble" data-case="first-person-014" data-color="50, 30, 17" data-palette="[[52, 30, 17], [3, 3, 1], [18, 10, 4], [123, 75, 43]]" data-title="Gaming_03" href="?case=first-person-014" style="--case-rgb: 50, 30, 17; --case-color-1: 52, 30, 17; --case-color-2: 3, 3, 1; --case-color-3: 18, 10, 4; --case-color-4: 123, 75, 43"><img alt="" height="216" loading="lazy" src="static/images/first-person-bubbles/Gaming_03.webp?v=code-model-frame-1" width="384"/></a></div>
<div class="fps-bubble-float"><a aria-controls="fps-expanded" aria-expanded="false" aria-label="Open Gaming_04" class="case-explore fps-case-bubble" data-case="first-person-030" data-color="84, 73, 55" data-palette="[[45, 40, 26], [26, 19, 10], [85, 72, 52], [178, 157, 130]]" data-title="Gaming_04" href="?case=first-person-030" style="--case-rgb: 84, 73, 55; --case-color-1: 45, 40, 26; --case-color-2: 26, 19, 10; --case-color-3: 85, 72, 52; --case-color-4: 178, 157, 130"><img alt="" height="216" loading="lazy" src="static/images/first-person-bubbles/Gaming_04.webp?v=code-model-frame-1" width="384"/></a></div>
<div class="fps-bubble-float"><a aria-controls="fps-expanded" aria-expanded="false" aria-label="Open Gaming_05" class="case-explore fps-case-bubble" data-case="121" data-color="27, 37, 52" data-palette="[[20, 32, 48], [1, 1, 9], [6, 13, 25], [78, 99, 119]]" data-title="Gaming_05" href="?case=121" style="--case-rgb: 27, 37, 52; --case-color-1: 20, 32, 48; --case-color-2: 1, 1, 9; --case-color-3: 6, 13, 25; --case-color-4: 78, 99, 119"><img alt="" height="216" loading="lazy" src="static/images/first-person-bubbles/Gaming_05.webp?v=code-model-frame-1" width="384"/></a></div>
<div class="fps-bubble-float"><a aria-controls="fps-expanded" aria-expanded="false" aria-label="Open Gaming_06" class="case-explore fps-case-bubble" data-case="132" data-color="27, 36, 41" data-palette="[[0, 3, 4], [30, 40, 43], [7, 14, 15], [65, 83, 97]]" data-title="Gaming_06" href="?case=132" style="--case-rgb: 27, 36, 41; --case-color-1: 0, 3, 4; --case-color-2: 30, 40, 43; --case-color-3: 7, 14, 15; --case-color-4: 65, 83, 97"><img alt="" height="216" loading="lazy" src="static/images/first-person-bubbles/Gaming_06.webp?v=code-model-frame-1" width="384"/></a></div>
<div class="fps-bubble-float"><a aria-controls="fps-expanded" aria-expanded="false" aria-label="Open Gaming_07" class="case-explore fps-case-bubble" data-case="cs2-active-duel" data-color="127, 116, 104" data-palette="[[151, 137, 123], [142, 120, 98], [52, 48, 43], [157, 152, 146]]" data-title="Gaming_07" href="?case=cs2-active-duel" style="--case-rgb: 127, 116, 104; --case-color-1: 151, 137, 123; --case-color-2: 142, 120, 98; --case-color-3: 52, 48, 43; --case-color-4: 157, 152, 146"><img alt="" height="216" loading="lazy" src="static/images/first-person-bubbles/Gaming_07.webp?v=code-model-frame-1" width="384"/></a></div>
<div class="fps-bubble-float"><a aria-controls="fps-expanded" aria-expanded="false" aria-label="Open Gaming_08" class="case-explore fps-case-bubble" data-case="wyvern-siege-fpv" data-color="51, 51, 51" data-palette="[[52, 52, 49], [16, 15, 16], [33, 31, 30], [98, 103, 104]]" data-title="Gaming_08" href="?case=wyvern-siege-fpv" style="--case-rgb: 51, 51, 51; --case-color-1: 52, 52, 49; --case-color-2: 16, 15, 16; --case-color-3: 33, 31, 30; --case-color-4: 98, 103, 104"><img alt="" height="216" loading="lazy" src="static/images/first-person-bubbles/Gaming_08.webp?v=code-model-frame-1" width="384"/></a></div>
<!-- seedance:start -->
<!-- seedance:end -->
</div>
<div class="fps-expanded" hidden="" id="fps-expanded">
<div class="fps-expanded-heading">
<button class="fps-back" type="button">← Return</button>
</div>
<p aria-live="polite" class="fps-load-status" role="status"></p>
<div class="fps-frame-slot" id="control-world-states-frame-slot"></div>
</div>
</div>
</section>
<section class="gallery-section" id="gallery">
<div class="container fps-bubbles-host">
<h2>Scene / World Editing</h2>
<div aria-label="Scene / World Editing cases" class="fps-bubble-grid">
<div class="fps-bubble-float"><a aria-controls="gallery-expanded" aria-expanded="false" aria-label="Open Scene_World_Editing_01" class="case-explore fps-case-bubble" data-case="583" data-case-b="663" data-color="122, 97, 70" data-edit-label="Move Chair to Desk" data-palette="[[112, 79, 43], [153, 118, 80], [35, 19, 7], [185, 173, 150]]" data-title="Scene_World_Editing_01" href="?case=583" style="--case-rgb: 122, 97, 70; --case-color-1: 112, 79, 43; --case-color-2: 153, 118, 80; --case-color-3: 35, 19, 7; --case-color-4: 185, 173, 150"><img alt="" height="216" loading="lazy" src="static/images/first-person-bubbles/Scene_World_Editing_01.webp?v=code-model-frame-1" width="384"/></a></div>
<div class="fps-bubble-float"><a aria-controls="gallery-expanded" aria-expanded="false" aria-label="Open Scene_World_Editing_02" class="case-explore fps-case-bubble" data-case="586" data-case-b="666" data-color="78, 63, 50" data-edit-label="Add Left Table" data-palette="[[83, 67, 52], [57, 37, 24], [24, 14, 8], [144, 130, 115]]" data-title="Scene_World_Editing_02" href="?case=586" style="--case-rgb: 78, 63, 50; --case-color-1: 83, 67, 52; --case-color-2: 57, 37, 24; --case-color-3: 24, 14, 8; --case-color-4: 144, 130, 115"><img alt="" height="216" loading="lazy" src="static/images/first-person-bubbles/Scene_World_Editing_02.webp?v=code-model-frame-1" width="384"/></a></div>
<div class="fps-bubble-float"><a aria-controls="gallery-expanded" aria-expanded="false" aria-label="Open Scene_World_Editing_03" class="case-explore fps-case-bubble" data-case="601" data-case-b="681" data-color="117, 103, 88" data-edit-label="Replace Arch with Doorway" data-palette="[[127, 112, 97], [61, 50, 38], [160, 141, 124], [107, 94, 80]]" data-title="Scene_World_Editing_03" href="?case=601" style="--case-rgb: 117, 103, 88; --case-color-1: 127, 112, 97; --case-color-2: 61, 50, 38; --case-color-3: 160, 141, 124; --case-color-4: 107, 94, 80"><img alt="" height="216" loading="lazy" src="static/images/first-person-bubbles/Scene_World_Editing_03.webp?v=code-model-frame-1" width="384"/></a></div>
<div class="fps-bubble-float"><a aria-controls="gallery-expanded" aria-expanded="false" aria-label="Open Scene_World_Editing_04" class="case-explore fps-case-bubble" data-case="590" data-case-b="670" data-color="74, 76, 71" data-edit-label="Close Loading Door" data-palette="[[83, 84, 79], [51, 52, 47], [20, 20, 16], [141, 143, 138]]" data-title="Scene_World_Editing_04" href="?case=590" style="--case-rgb: 74, 76, 71; --case-color-1: 83, 84, 79; --case-color-2: 51, 52, 47; --case-color-3: 20, 20, 16; --case-color-4: 141, 143, 138"><img alt="" height="216" loading="lazy" src="static/images/first-person-bubbles/Scene_World_Editing_04.webp?v=code-model-frame-1" width="384"/></a></div>
<div class="fps-bubble-float"><a aria-controls="gallery-expanded" aria-expanded="false" aria-label="Open Scene_World_Editing_05" class="case-explore fps-case-bubble" data-case="601" data-case-b="681" data-color="94, 84, 74" data-edit-label="Replace Arch with Doorway" data-palette="[[106, 89, 74], [77, 65, 54], [32, 28, 23], [159, 149, 141]]" data-selection="gallery-v13-601-681-take2-seed44" data-title="Scene_World_Editing_05" href="?case=601&selection=gallery-v13-601-681-take2-seed44" style="--case-rgb: 94, 84, 74; --case-color-1: 106, 89, 74; --case-color-2: 77, 65, 54; --case-color-3: 32, 28, 23; --case-color-4: 159, 149, 141"><img alt="" height="216" loading="lazy" src="static/images/first-person-bubbles/Scene_World_Editing_05.png" width="384"/></a></div>
<div class="fps-bubble-float"><a aria-controls="gallery-expanded" aria-expanded="false" aria-label="Open Scene_World_Editing_06" class="case-explore fps-case-bubble" data-case="591" data-case-b="671" data-color="67, 76, 79" data-edit-label="Close Double Doors" data-palette="[[69, 80, 83], [47, 58, 61], [20, 28, 31], [128, 138, 141]]" data-title="Scene_World_Editing_06" href="?case=591" style="--case-rgb: 67, 76, 79; --case-color-1: 69, 80, 83; --case-color-2: 47, 58, 61; --case-color-3: 20, 28, 31; --case-color-4: 128, 138, 141"><img alt="" height="216" loading="lazy" src="static/images/first-person-bubbles/Scene_World_Editing_06.webp?v=code-model-frame-1" width="384"/></a></div>
</div>
<div class="fps-expanded" hidden="" id="gallery-expanded">
<div class="fps-expanded-heading">
<button class="fps-back" type="button">← Return</button>
<div aria-label="World variant" class="fps-variant-controls" hidden="" role="group">
<button aria-controls="gallery-frame-slot" aria-pressed="true" class="fps-variant" data-variant="a" type="button">Restore Original</button>
<button aria-controls="gallery-frame-slot" aria-pressed="false" class="fps-variant" data-variant="b" type="button">Change World</button>
</div>
</div>
<p aria-live="polite" class="fps-load-status" role="status"></p>
<div class="fps-frame-slot" id="gallery-frame-slot"></div>
</div>
</div>
</section>
<section class="gallery-section control-world-section" id="robotics-simulation">
<div class="container fps-bubbles-host">
<h2>Robotics & Trajectory Control</h2>
<div aria-label="Robotics & Trajectory Control cases" class="fps-bubble-grid">
<div class="fps-bubble-float"><a aria-controls="robotics-simulation-expanded" aria-expanded="false" aria-label="Open Robotics_Trajectory_Control_01" class="case-explore fps-case-bubble" data-case="563" data-case-b="564" data-color="132, 127, 121" data-edit-label="Use Humanoid Robot" data-palette="[[150, 145, 138], [134, 128, 121], [173, 167, 159], [66, 64, 61]]" data-title="Robotics_Trajectory_Control_01" href="?case=563" style="--case-rgb: 132, 127, 121; --case-color-1: 150, 145, 138; --case-color-2: 134, 128, 121; --case-color-3: 173, 167, 159; --case-color-4: 66, 64, 61"><img alt="" height="216" loading="lazy" src="static/images/first-person-bubbles/Robotics_Trajectory_Control_01.webp?v=code-model-frame-1" width="384"/></a></div>
<div class="fps-bubble-float"><a aria-controls="robotics-simulation-expanded" aria-expanded="false" aria-label="Open Robotics_Trajectory_Control_02" class="case-explore fps-case-bubble" data-case="581" data-case-b="582" data-color="128, 126, 122" data-edit-label="Follow Perimeter Path" data-palette="[[144, 143, 140], [110, 104, 96], [191, 195, 197], [63, 59, 54]]" data-selection="trajectory-group23-581-582-image-group23-4-v12" data-title="Robotics_Trajectory_Control_02" href="?case=581&selection=trajectory-group23-581-582-image-group23-4-v12" style="--case-rgb: 128, 126, 122; --case-color-1: 144, 143, 140; --case-color-2: 110, 104, 96; --case-color-3: 191, 195, 197; --case-color-4: 63, 59, 54"><img alt="" height="216" loading="lazy" src="static/images/first-person-bubbles/Robotics_Trajectory_Control_02.webp" width="384"/></a></div>
<div class="fps-bubble-float"><a aria-controls="robotics-simulation-expanded" aria-expanded="false" aria-label="Open Robotics_Trajectory_Control_03" class="case-explore fps-case-bubble" data-case="564" data-case-b="563" data-color="113, 113, 105" data-edit-label="Use Quadruped Robot" data-palette="[[90, 90, 81], [141, 139, 128], [198, 195, 186], [24, 28, 25]]" data-selection="robotics-group23-564-563-image-group23-2-v13" data-title="Robotics_Trajectory_Control_03" href="?case=564&selection=robotics-group23-564-563-image-group23-2-v13" style="--case-rgb: 113, 113, 105; --case-color-1: 90, 90, 81; --case-color-2: 141, 139, 128; --case-color-3: 198, 195, 186; --case-color-4: 24, 28, 25"><img alt="" height="216" loading="lazy" src="static/images/first-person-bubbles/Robotics_Trajectory_Control_03.webp" width="384"/></a></div>
<div class="fps-bubble-float"><a aria-controls="robotics-simulation-expanded" aria-expanded="false" aria-label="Open Robotics_Trajectory_Control_04" class="case-explore fps-case-bubble" data-case="564" data-case-b="563" data-color="78, 78, 76" data-edit-label="Use Quadruped Robot" data-palette="[[95, 91, 84], [69, 64, 58], [14, 14, 14], [132, 140, 144]]" data-selection="robotics-group23-564-563-image-group23-4-v15" data-title="Robotics_Trajectory_Control_04" href="?case=564&selection=robotics-group23-564-563-image-group23-4-v15" style="--case-rgb: 78, 78, 76; --case-color-1: 95, 91, 84; --case-color-2: 69, 64, 58; --case-color-3: 14, 14, 14; --case-color-4: 132, 140, 144"><img alt="" height="216" loading="lazy" src="static/images/first-person-bubbles/Robotics_Trajectory_Control_04.webp" width="384"/></a></div>
<div class="fps-bubble-float"><a aria-controls="robotics-simulation-expanded" aria-expanded="false" aria-label="Open Robotics_Trajectory_Control_05" class="case-explore fps-case-bubble" data-case="571" data-case-b="572" data-color="132, 120, 108" data-edit-label="Use Humanoid Robot" data-palette="[[180, 166, 152], [37, 31, 25], [195, 182, 167], [114, 102, 88]]" data-title="Robotics_Trajectory_Control_05" href="?case=571" style="--case-rgb: 132, 120, 108; --case-color-1: 180, 166, 152; --case-color-2: 37, 31, 25; --case-color-3: 195, 182, 167; --case-color-4: 114, 102, 88"><img alt="" height="216" loading="lazy" src="static/images/first-person-bubbles/Robotics_Trajectory_Control_05.webp?v=code-model-frame-1" width="384"/></a></div>
<div class="fps-bubble-float"><a aria-controls="robotics-simulation-expanded" aria-expanded="false" aria-label="Open Robotics_Trajectory_Control_06" class="case-explore fps-case-bubble" data-case="577" data-case-b="578" data-color="107, 106, 96" data-edit-label="Take Right Route" data-palette="[[89, 89, 81], [118, 117, 107], [170, 167, 154], [49, 49, 39]]" data-selection="trajectory-group23-577-578-image-group23-2-v16" data-title="Robotics_Trajectory_Control_06" href="?case=577&selection=trajectory-group23-577-578-image-group23-2-v16" style="--case-rgb: 107, 106, 96; --case-color-1: 89, 89, 81; --case-color-2: 118, 117, 107; --case-color-3: 170, 167, 154; --case-color-4: 49, 49, 39"><img alt="" height="216" loading="lazy" src="static/images/first-person-bubbles/Robotics_Trajectory_Control_06.webp" width="384"/></a></div>
</div>
<div class="fps-expanded" hidden="" id="robotics-simulation-expanded">
<div class="fps-expanded-heading">
<button class="fps-back" type="button">← Return</button>
<div aria-label="World variant" class="fps-variant-controls" hidden="" role="group">
<button aria-controls="robotics-simulation-frame-slot" aria-pressed="true" class="fps-variant" data-variant="a" type="button">Restore Original</button>
<button aria-controls="robotics-simulation-frame-slot" aria-pressed="false" class="fps-variant" data-variant="b" type="button">Change World</button>
</div>
</div>
<p aria-live="polite" class="fps-load-status" role="status"></p>
<div class="fps-frame-slot" id="robotics-simulation-frame-slot"></div>
</div>
</div>
</section>
<!-- physical-grounding:start -->
<section class="gallery-section control-world-section" id="physical-grounding"><div class="container fps-bubbles-host"><h2>Physical Grounding</h2><div aria-label="Physical Grounding cases" class="fps-bubble-grid"><div class="fps-bubble-float"><a aria-controls="physical-grounding-expanded" aria-expanded="false" aria-label="Open Physical_Grounding_01" class="case-explore fps-case-bubble" data-case="physical-isochronous" data-color="161, 182, 187" data-palette="[[206, 216, 224], [161, 182, 187], [222, 211, 187], [139, 166, 169]]" data-title="Physical_Grounding_01" href="?case=physical-isochronous"><img alt="" height="720" loading="lazy" src="static/images/first-frames-native/Physical_Grounding_01.webp" width="1280"/></a></div>
<div class="fps-bubble-float"><a aria-controls="physical-grounding-expanded" aria-expanded="false" aria-label="Open Physical_Grounding_02" class="case-explore fps-case-bubble" data-case="physical-pendulum" data-color="161, 182, 187" data-palette="[[206, 216, 224], [161, 182, 187], [222, 211, 187], [139, 166, 169]]" data-title="Physical_Grounding_02" href="?case=physical-pendulum"><img alt="" height="720" loading="lazy" src="static/images/first-frames-native/Physical_Grounding_02.webp" width="1280"/></a></div>
<div class="fps-bubble-float"><a aria-controls="physical-grounding-expanded" aria-expanded="false" aria-label="Open Physical_Grounding_03" class="case-explore fps-case-bubble" data-case="physical-induction" data-color="161, 182, 187" data-palette="[[206, 216, 224], [161, 182, 187], [222, 211, 187], [139, 166, 169]]" data-title="Physical_Grounding_03" href="?case=physical-induction"><img alt="" height="1080" loading="lazy" src="static/images/first-frames-native/Physical_Grounding_03.webp" width="1920"/></a></div>
<div class="fps-bubble-float"><a aria-controls="physical-grounding-expanded" aria-expanded="false" aria-label="Open Physical_Grounding_04" class="case-explore fps-case-bubble" data-case="physical-prism" data-color="161, 182, 187" data-palette="[[206, 216, 224], [161, 182, 187], [222, 211, 187], [139, 166, 169]]" data-title="Physical_Grounding_04" href="?case=physical-prism"><img alt="" height="720" loading="lazy" src="static/images/first-frames-native/Physical_Grounding_04.webp" width="1280"/></a></div>
<div class="fps-bubble-float"><a aria-controls="physical-grounding-expanded" aria-expanded="false" aria-label="Open Physical_Grounding_05" class="case-explore fps-case-bubble" data-case="black-hole-background-grade" data-color="31, 23, 19" data-palette="[[3, 3, 7], [14, 10, 9], [1, 2, 4], [104, 74, 54]]" data-title="Physical_Grounding_05" href="?case=black-hole-background-grade" style="--case-rgb: 31, 23, 19; --case-color-1: 3, 3, 7; --case-color-2: 14, 10, 9; --case-color-3: 1, 2, 4; --case-color-4: 104, 74, 54"><img alt="" height="216" loading="lazy" src="static/images/first-person-bubbles/Physical_Grounding_05.webp?v=code-model-frame-1" width="384"/></a></div>
<div class="fps-bubble-float"><a aria-controls="physical-grounding-expanded" aria-expanded="false" aria-label="Open Physical_Grounding_06" class="case-explore fps-case-bubble" data-case="stable-mass-transfer-binary" data-color="50, 26, 21" data-palette="[[0, 0, 1], [29, 10, 23], [11, 1, 6], [152, 87, 50]]" data-title="Physical_Grounding_06" href="?case=stable-mass-transfer-binary" style="--case-rgb: 50, 26, 21; --case-color-1: 0, 0, 1; --case-color-2: 29, 10, 23; --case-color-3: 11, 1, 6; --case-color-4: 152, 87, 50"><img alt="" height="216" loading="lazy" src="static/images/first-person-bubbles/Physical_Grounding_06.webp?v=code-model-frame-1" width="384"/></a></div>
<div class="fps-bubble-float"><a aria-controls="physical-grounding-expanded" aria-expanded="false" aria-label="Open Physical_Grounding_07" class="case-explore fps-case-bubble" data-case="rolling-inertia" data-color="196, 196, 198" data-palette="[[214, 214, 216], [221, 221, 223], [229, 229, 231], [115, 116, 119]]" data-title="Physical_Grounding_07" href="?case=rolling-inertia" style="--case-rgb: 196, 196, 198; --case-color-1: 214, 214, 216; --case-color-2: 221, 221, 223; --case-color-3: 229, 229, 231; --case-color-4: 115, 116, 119"><img alt="" height="216" loading="lazy" src="static/images/first-person-bubbles/Physical_Grounding_07.png?v=code-model-frame-1" width="384"/></a></div>
<div class="fps-bubble-float"><a aria-controls="physical-grounding-expanded" aria-expanded="false" aria-label="Open Physical_Grounding_08" class="case-explore fps-case-bubble" data-case="newtons-cradle" data-color="197, 196, 195" data-palette="[[202, 199, 198], [209, 208, 209], [216, 216, 216], [157, 154, 154]]" data-title="Physical_Grounding_08" href="?case=newtons-cradle" style="--case-rgb: 197, 196, 195; --case-color-1: 202, 199, 198; --case-color-2: 209, 208, 209; --case-color-3: 216, 216, 216; --case-color-4: 157, 154, 154"><img alt="" height="216" loading="lazy" src="static/images/first-person-bubbles/Physical_Grounding_08.png?v=code-model-frame-1" width="384"/></a></div></div><div class="fps-expanded" hidden="" id="physical-grounding-expanded"><div class="fps-expanded-heading"><button class="fps-back" type="button">← Return</button></div><p aria-live="polite" class="fps-load-status" role="status"></p><div class="fps-frame-slot"></div></div></div></section>
<!-- physical-grounding:end -->
<section class="gallery-section control-world-section" id="product-cinematography">
<div class="container fps-bubbles-host">
<h2>Product Cinematography</h2>
<div aria-label="Product Cinematography cases" class="fps-bubble-grid">
<div class="fps-bubble-float"><a aria-controls="product-cinematography-expanded" aria-expanded="false" aria-label="Open Product_Cinematography_01" class="case-explore fps-case-bubble" data-case="624" data-color="36, 37, 39" data-palette="[[10, 11, 14], [2, 3, 5], [31, 33, 35], [99, 100, 101]]" data-title="Product_Cinematography_01" href="?case=624" style="--case-rgb: 36, 37, 39; --case-color-1: 10, 11, 14; --case-color-2: 2, 3, 5; --case-color-3: 31, 33, 35; --case-color-4: 99, 100, 101"><img alt="" height="216" loading="lazy" src="static/images/first-person-bubbles/Product_Cinematography_01.webp?v=code-model-frame-1" width="384"/></a></div>
<div class="fps-bubble-float"><a aria-controls="product-cinematography-expanded" aria-expanded="false" aria-label="Open Product_Cinematography_02" class="case-explore fps-case-bubble" data-case="625" data-color="171, 177, 181" data-palette="[[158, 168, 173], [207, 207, 208], [178, 183, 187], [138, 147, 153]]" data-title="Product_Cinematography_02" href="?case=625" style="--case-rgb: 171, 177, 181; --case-color-1: 158, 168, 173; --case-color-2: 207, 207, 208; --case-color-3: 178, 183, 187; --case-color-4: 138, 147, 153"><img alt="" height="216" loading="lazy" src="static/images/first-person-bubbles/Product_Cinematography_02.webp?v=code-model-frame-1" width="384"/></a></div>
<div class="fps-bubble-float"><a aria-controls="product-cinematography-expanded" aria-expanded="false" aria-label="Open Product_Cinematography_03" class="case-explore fps-case-bubble" data-case="636" data-color="24, 26, 31" data-palette="[[12, 14, 19], [4, 7, 12], [0, 0, 2], [71, 74, 83]]" data-title="Product_Cinematography_03" href="?case=636" style="--case-rgb: 24, 26, 31; --case-color-1: 12, 14, 19; --case-color-2: 4, 7, 12; --case-color-3: 0, 0, 2; --case-color-4: 71, 74, 83"><img alt="" height="216" loading="lazy" src="static/images/first-person-bubbles/Product_Cinematography_03.webp?v=code-model-frame-1" width="384"/></a></div>
<div class="fps-bubble-float"><a aria-controls="product-cinematography-expanded" aria-expanded="false" aria-label="Open Product_Cinematography_04" class="case-explore fps-case-bubble" data-case="640" data-color="20, 29, 36" data-palette="[[15, 27, 37], [5, 13, 21], [1, 2, 6], [56, 72, 76]]" data-title="Product_Cinematography_04" href="?case=640" style="--case-rgb: 20, 29, 36; --case-color-1: 15, 27, 37; --case-color-2: 5, 13, 21; --case-color-3: 1, 2, 6; --case-color-4: 56, 72, 76"><img alt="" height="216" loading="lazy" src="static/images/first-person-bubbles/Product_Cinematography_04.webp?v=code-model-frame-1" width="384"/></a></div>
<div class="fps-bubble-float"><a aria-controls="product-cinematography-expanded" aria-expanded="false" aria-label="Open Product_Cinematography_05" class="case-explore fps-case-bubble" data-case="product-new15-07" data-color="137, 133, 130" data-palette="[[183, 177, 171], [197, 191, 186], [45, 44, 46], [151, 146, 142]]" data-title="Product_Cinematography_05" href="?case=product-new15-07" style="--case-rgb: 137, 133, 130; --case-color-1: 183, 177, 171; --case-color-2: 197, 191, 186; --case-color-3: 45, 44, 46; --case-color-4: 151, 146, 142"><img alt="" height="216" loading="lazy" src="static/images/first-person-bubbles/Product_Cinematography_05.webp" width="384"/></a></div>
<div class="fps-bubble-float"><a aria-controls="product-cinematography-expanded" aria-expanded="false" aria-label="Open Product_Cinematography_06" class="case-explore fps-case-bubble" data-case="product-new15-09" data-color="64, 63, 68" data-palette="[[51, 50, 54], [55, 54, 58], [114, 114, 119], [38, 38, 44]]" data-title="Product_Cinematography_06" href="?case=product-new15-09" style="--case-rgb: 64, 63, 68; --case-color-1: 51, 50, 54; --case-color-2: 55, 54, 58; --case-color-3: 114, 114, 119; --case-color-4: 38, 38, 44"><img alt="" height="216" loading="lazy" src="static/images/first-person-bubbles/Product_Cinematography_06.webp" width="384"/></a></div>
<div class="fps-bubble-float"><a aria-controls="product-cinematography-expanded" aria-expanded="false" aria-label="Open Product_Cinematography_07" class="case-explore fps-case-bubble" data-case="product-new15-06" data-color="62, 62, 53" data-palette="[[45, 51, 40], [66, 64, 54], [108, 103, 92], [30, 30, 26]]" data-title="Product_Cinematography_07" href="?case=product-new15-06" style="--case-rgb: 62, 62, 53; --case-color-1: 45, 51, 40; --case-color-2: 66, 64, 54; --case-color-3: 108, 103, 92; --case-color-4: 30, 30, 26"><img alt="" height="216" loading="lazy" src="static/images/first-person-bubbles/Product_Cinematography_07.webp" width="384"/></a></div>
<div class="fps-bubble-float"><a aria-controls="product-cinematography-expanded" aria-expanded="false" aria-label="Open Product_Cinematography_08" class="case-explore fps-case-bubble" data-case="product-new15-04" data-color="191, 183, 175" data-palette="[[214, 206, 198], [203, 194, 186], [188, 180, 172], [146, 140, 131]]" data-title="Product_Cinematography_08" href="?case=product-new15-04" style="--case-rgb: 191, 183, 175; --case-color-1: 214, 206, 198; --case-color-2: 203, 194, 186; --case-color-3: 188, 180, 172; --case-color-4: 146, 140, 131"><img alt="" height="216" loading="lazy" src="static/images/first-person-bubbles/Product_Cinematography_08.webp" width="384"/></a></div>
</div>
<div class="fps-expanded" hidden="" id="product-cinematography-expanded">
<div class="fps-expanded-heading">
<button class="fps-back" type="button">← Return</button>
</div>
<p aria-live="polite" class="fps-load-status" role="status"></p>
<div class="fps-frame-slot" id="product-cinematography-frame-slot"></div>
</div>
</div>
</section>
<section class="gallery-section control-world-section" id="architectural-cinematics">
<div class="container fps-bubbles-host">
<h2>Architectural Cinematics</h2>
<div aria-label="Architectural Cinematics cases" class="fps-bubble-grid">
<div class="fps-bubble-float"><a aria-controls="architectural-cinematics-expanded" aria-expanded="false" aria-label="Open Architectural_Cinematics_01" class="case-explore fps-case-bubble" data-case="643" data-color="126, 111, 98" data-palette="[[156, 138, 121], [31, 17, 10], [113, 93, 76], [202, 193, 183]]" data-title="Architectural_Cinematics_01" href="?case=643" style="--case-rgb: 126, 111, 98; --case-color-1: 156, 138, 121; --case-color-2: 31, 17, 10; --case-color-3: 113, 93, 76; --case-color-4: 202, 193, 183"><img alt="" height="216" loading="lazy" src="static/images/first-person-bubbles/Architectural_Cinematics_01.webp?v=code-model-frame-1" width="384"/></a></div>
<div class="fps-bubble-float"><a aria-controls="architectural-cinematics-expanded" aria-expanded="false" aria-label="Open Architectural_Cinematics_02" class="case-explore fps-case-bubble" data-case="656" data-color="89, 81, 71" data-palette="[[104, 97, 82], [20, 16, 12], [64, 50, 39], [167, 159, 150]]" data-title="Architectural_Cinematics_02" href="?case=656" style="--case-rgb: 89, 81, 71; --case-color-1: 104, 97, 82; --case-color-2: 20, 16, 12; --case-color-3: 64, 50, 39; --case-color-4: 167, 159, 150"><img alt="" height="216" loading="lazy" src="static/images/first-person-bubbles/Architectural_Cinematics_02.webp?v=code-model-frame-1" width="384"/></a></div>
<div class="fps-bubble-float"><a aria-controls="architectural-cinematics-expanded" aria-expanded="false" aria-label="Open Architectural_Cinematics_03" class="case-explore fps-case-bubble" data-case="657" data-color="58, 57, 61" data-palette="[[40, 34, 32], [104, 108, 119], [70, 69, 74], [14, 13, 15]]" data-title="Architectural_Cinematics_03" href="?case=657" style="--case-rgb: 58, 57, 61; --case-color-1: 40, 34, 32; --case-color-2: 104, 108, 119; --case-color-3: 70, 69, 74; --case-color-4: 14, 13, 15"><img alt="" height="216" loading="lazy" src="static/images/first-person-bubbles/Architectural_Cinematics_03.webp?v=code-model-frame-1" width="384"/></a></div>
<div class="fps-bubble-float"><a aria-controls="architectural-cinematics-expanded" aria-expanded="false" aria-label="Open Architectural_Cinematics_04" class="case-explore fps-case-bubble" data-case="649" data-color="135, 123, 113" data-palette="[[152, 143, 135], [129, 114, 100], [184, 173, 165], [70, 61, 50]]" data-title="Architectural_Cinematics_04" href="?case=649" style="--case-rgb: 135, 123, 113; --case-color-1: 152, 143, 135; --case-color-2: 129, 114, 100; --case-color-3: 184, 173, 165; --case-color-4: 70, 61, 50"><img alt="" height="216" loading="lazy" src="static/images/first-person-bubbles/Architectural_Cinematics_04.webp?v=code-model-frame-1" width="384"/></a></div>
<div class="fps-bubble-float"><a aria-controls="architectural-cinematics-expanded" aria-expanded="false" aria-label="Open Architectural_Cinematics_05" class="case-explore fps-case-bubble" data-case="646" data-color="151, 128, 106" data-palette="[[151, 121, 94], [170, 142, 115], [189, 177, 164], [90, 69, 45]]" data-title="Architectural_Cinematics_05" href="?case=646" style="--case-rgb: 151, 128, 106; --case-color-1: 151, 121, 94; --case-color-2: 170, 142, 115; --case-color-3: 189, 177, 164; --case-color-4: 90, 69, 45"><img alt="" height="216" loading="lazy" src="static/images/first-person-bubbles/Architectural_Cinematics_05.webp?v=code-model-frame-1" width="384"/></a></div>
<div class="fps-bubble-float"><a aria-controls="architectural-cinematics-expanded" aria-expanded="false" aria-label="Open Architectural_Cinematics_06" class="case-explore fps-case-bubble" data-case="481" data-color="122, 117, 112" data-palette="[[163, 156, 147], [108, 102, 93], [182, 180, 175], [31, 29, 30]]" data-title="Architectural_Cinematics_06" href="?case=481" style="--case-rgb: 122, 117, 112; --case-color-1: 163, 156, 147; --case-color-2: 108, 102, 93; --case-color-3: 182, 180, 175; --case-color-4: 31, 29, 30"><img alt="" height="216" loading="lazy" src="static/images/first-person-bubbles/Architectural_Cinematics_06.webp?v=code-model-frame-1" width="384"/></a></div>
</div>
<div class="fps-expanded" hidden="" id="architectural-cinematics-expanded">
<div class="fps-expanded-heading">
<button class="fps-back" type="button">← Return</button>
</div>
<p aria-live="polite" class="fps-load-status" role="status"></p>
<div class="fps-frame-slot" id="architectural-cinematics-frame-slot"></div>
</div>
</div>
</section>
<section class="gallery-section control-world-section" id="reconstruction-3d-4d">
<div class="container fps-bubbles-host">
<h2>3D / 4D Reconstruction</h2>
<div aria-label="3D / 4D Reconstruction cases" class="fps-bubble-grid">
<div class="fps-bubble-float"><a aria-controls="reconstruction-3d-4d-expanded" aria-expanded="false" aria-label="Open 3D_4D_Reconstruction_01" class="case-explore fps-case-bubble" data-case="astra-bicycle" data-color="89, 90, 67" data-palette="[[109, 110, 79], [25, 27, 19], [68, 70, 51], [151, 152, 120]]" data-title="3D_4D_Reconstruction_01" href="?case=astra-bicycle" style="--case-rgb: 89, 90, 67; --case-color-1: 109, 110, 79; --case-color-2: 25, 27, 19; --case-color-3: 68, 70, 51; --case-color-4: 151, 152, 120"><img alt="" height="216" loading="lazy" src="static/images/first-person-bubbles/3D_4D_Reconstruction_01.webp?v=code-model-frame-1" width="384"/></a></div>
<div class="fps-bubble-float"><a aria-controls="reconstruction-3d-4d-expanded" aria-expanded="false" aria-label="Open 3D_4D_Reconstruction_02" class="case-explore fps-case-bubble" data-case="astra-garden-gray" data-color="104, 101, 67" data-palette="[[84, 80, 48], [172, 168, 125], [122, 119, 75], [34, 35, 16]]" data-title="3D_4D_Reconstruction_02" href="?case=astra-garden-gray" style="--case-rgb: 104, 101, 67; --case-color-1: 84, 80, 48; --case-color-2: 172, 168, 125; --case-color-3: 122, 119, 75; --case-color-4: 34, 35, 16"><img alt="" height="216" loading="lazy" src="static/images/first-person-bubbles/3D_4D_Reconstruction_02.webp?v=code-model-frame-1" width="384"/></a></div>
<div class="fps-bubble-float"><a aria-controls="reconstruction-3d-4d-expanded" aria-expanded="false" aria-label="Open 3D_4D_Reconstruction_03" class="case-explore fps-case-bubble" data-case="442" data-color="118, 87, 62" data-palette="[[132, 101, 76], [46, 38, 35], [181, 141, 101], [111, 63, 33]]" data-title="3D_4D_Reconstruction_03" href="?case=442" style="--case-rgb: 118, 87, 62; --case-color-1: 132, 101, 76; --case-color-2: 46, 38, 35; --case-color-3: 181, 141, 101; --case-color-4: 111, 63, 33"><img alt="" height="216" loading="lazy" src="static/images/first-person-bubbles/3D_4D_Reconstruction_03.webp?v=code-model-frame-1" width="384"/></a></div>
<div class="fps-bubble-float"><a aria-controls="reconstruction-3d-4d-expanded" aria-expanded="false" aria-label="Open 3D_4D_Reconstruction_04" class="case-explore fps-case-bubble" data-case="astra-room-gray" data-color="61, 56, 37" data-palette="[[3, 4, 2], [70, 63, 41], [32, 30, 18], [138, 125, 87]]" data-title="3D_4D_Reconstruction_04" href="?case=astra-room-gray" style="--case-rgb: 61, 56, 37; --case-color-1: 3, 4, 2; --case-color-2: 70, 63, 41; --case-color-3: 32, 30, 18; --case-color-4: 138, 125, 87"><img alt="" height="216" loading="lazy" src="static/images/first-person-bubbles/3D_4D_Reconstruction_04.webp?v=code-model-frame-1" width="384"/></a></div>
<div class="fps-bubble-float"><a aria-controls="reconstruction-3d-4d-expanded" aria-expanded="false" aria-label="Open 3D_4D_Reconstruction_05" class="case-explore fps-case-bubble" data-case="astra-bonsai" data-color="71, 69, 77" data-palette="[[150, 161, 169], [40, 29, 38], [5, 8, 8], [88, 77, 92]]" data-title="3D_4D_Reconstruction_05" href="?case=astra-bonsai" style="--case-rgb: 71, 69, 77; --case-color-1: 150, 161, 169; --case-color-2: 40, 29, 38; --case-color-3: 5, 8, 8; --case-color-4: 88, 77, 92"><img alt="" height="216" loading="lazy" src="static/images/first-person-bubbles/3D_4D_Reconstruction_05.webp?v=code-model-frame-1" width="384"/></a></div>
<div class="fps-bubble-float"><a aria-controls="reconstruction-3d-4d-expanded" aria-expanded="false" aria-label="Open 3D_4D_Reconstruction_06" class="case-explore fps-case-bubble" data-case="astra-cook-spinach" data-color="112, 85, 67" data-palette="[[40, 25, 14], [192, 156, 134], [87, 60, 41], [138, 106, 82]]" data-title="3D_4D_Reconstruction_06" href="?case=astra-cook-spinach" style="--case-rgb: 112, 85, 67"><img alt="" height="216" loading="lazy" src="static/images/first-person-bubbles/3D_4D_Reconstruction_06.webp" width="384"/></a></div>
<div class="fps-bubble-float"><a aria-controls="reconstruction-3d-4d-expanded" aria-expanded="false" aria-label="Open 3D_4D_Reconstruction_07" class="case-explore fps-case-bubble" data-case="astra-kitchen" data-color="139, 116, 97" data-palette="[[171, 139, 126], [59, 43, 25], [182, 163, 152], [138, 114, 81]]" data-title="3D_4D_Reconstruction_07" href="?case=astra-kitchen" style="--case-rgb: 139, 116, 97; --case-color-1: 171, 139, 126; --case-color-2: 59, 43, 25; --case-color-3: 182, 163, 152; --case-color-4: 138, 114, 81"><img alt="" height="216" loading="lazy" src="static/images/first-person-bubbles/3D_4D_Reconstruction_07.webp?v=code-model-frame-1" width="384"/></a></div>
<div class="fps-bubble-float"><a aria-controls="reconstruction-3d-4d-expanded" aria-expanded="false" aria-label="Open 3D_4D_Reconstruction_08" class="case-explore fps-case-bubble" data-case="astra-train" data-color="84, 95, 112" data-palette="[[11, 13, 15], [110, 131, 168], [142, 161, 185], [70, 72, 77]]" data-title="3D_4D_Reconstruction_08" href="?case=astra-train" style="--case-rgb: 84, 95, 112; --case-color-1: 11, 13, 15; --case-color-2: 110, 131, 168; --case-color-3: 142, 161, 185; --case-color-4: 70, 72, 77"><img alt="" height="216" loading="lazy" src="static/images/first-person-bubbles/3D_4D_Reconstruction_08.webp?v=code-model-frame-1" width="384"/></a></div>
</div>
<div class="fps-expanded" hidden="" id="reconstruction-3d-4d-expanded">
<div class="fps-expanded-heading">
<button class="fps-back" type="button">← Return</button>
</div>
<p aria-live="polite" class="fps-load-status" role="status"></p>
<div class="fps-frame-slot" id="reconstruction-3d-4d-frame-slot"></div>
</div>
</div>
</section>
</main>
</body></html>