feat(nds): add 2d css NDS and move 3d nds to NDS3D component

app/pages/index.vue

@@ -27,19 +27,19 @@ const bottomScreenCanvas = computed(() => bottomScreen.value?.canvas ?? null);
       <TresAmbientLight />
       <TresDirectionalLight />
 
-      <NDS
+      <NDS3D
         v-if="topScreenCanvas && bottomScreenCanvas"
         :top-screen-canvas="topScreenCanvas"
         :bottom-screen-canvas="bottomScreenCanvas"
       />
     </TresCanvas>
 
-    <div
+    <NDS2D
       :style="{
         visibility: app.settings.renderingMode === '3d' ? 'hidden' : 'visible',
       }"
     >
-      <div>
+      <template #topScreen>
         <Screen ref="topScreen">
           <IntroTopScreen v-if="!app.booted" />
           <HomeTopScreen v-else-if="app.screen === 'home'" />
@@ -52,8 +52,8 @@ const bottomScreenCanvas = computed(() => bottomScreen.value?.canvas ?? null);
           <AchievementsNotification />
           <CommonConfetti screen="top" />
         </Screen>
-      </div>
-      <div>
+      </template>
+      <template #bottomScreen>
         <Screen ref="bottomScreen">
           <IntroBottomScreen v-if="!app.booted" />
           <HomeBottomScreen v-else-if="app.screen === 'home'" />
@@ -65,7 +65,7 @@ const bottomScreenCanvas = computed(() => bottomScreen.value?.canvas ?? null);
 
           <CommonConfetti screen="bottom" />
         </Screen>
-      </div>
-    </div>
+      </template>
+    </NDS2D>
   </div>
 </template>