diff --git a/app/assets/stylesheets/outfits/new_v2.css b/app/assets/stylesheets/outfits/new_v2.css
new file mode 100644
index 00000000..1331b0e0
--- /dev/null
+++ b/app/assets/stylesheets/outfits/new_v2.css
@@ -0,0 +1,131 @@
+body.wardrobe-v2 {
+  margin: 0;
+  padding: 0;
+  height: 100vh;
+  overflow: hidden;
+  font-family: sans-serif;
+}
+
+.wardrobe-container {
+  display: flex;
+  height: 100vh;
+  background: #000;
+
+  @media (max-width: 800px) {
+    flex-direction: column;
+  }
+}
+
+.outfit-preview-section {
+  flex: 1;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  background: #000;
+  position: relative;
+  min-height: 400px;
+
+  outfit-viewer {
+    width: 600px;
+    height: 600px;
+    max-width: min(100%, 100cqh);
+    max-height: min(100%, 100cqw);
+    aspect-ratio: 1;
+    container-type: size;
+  }
+
+  .no-preview-message {
+    color: white;
+    text-align: center;
+    padding: 2rem;
+    font-size: 1.2rem;
+  }
+}
+
+.outfit-controls-section {
+  width: 400px;
+  background: #fff;
+  padding: 2rem;
+  overflow-y: auto;
+  box-shadow: -2px 0 10px rgba(0, 0, 0, 0.3);
+
+  @media (max-width: 800px) {
+    width: 100%;
+    max-height: 40vh;
+  }
+
+  h1 {
+    margin-top: 0;
+    font-size: 1.75rem;
+    color: #448844;
+  }
+
+  h2 {
+    font-size: 1.25rem;
+    color: #448844;
+    margin-top: 2rem;
+  }
+}
+
+.species-color-picker {
+  margin: 1.5rem 0;
+
+  .form-group {
+    margin-bottom: 1rem;
+
+    label {
+      display: block;
+      font-weight: bold;
+      margin-bottom: 0.5rem;
+      color: #333;
+    }
+
+    select {
+      width: 100%;
+      padding: 0.5rem;
+      font-size: 1rem;
+      border: 1px solid #ccc;
+      border-radius: 4px;
+      font-family: inherit;
+
+      &:focus {
+        outline: none;
+        border-color: #448844;
+      }
+    }
+  }
+}
+
+.current-selection {
+  padding: 1rem;
+  background: #f0f0f0;
+  border-radius: 4px;
+  margin: 1rem 0;
+
+  p {
+    margin: 0;
+    color: #666;
+  }
+
+  strong {
+    color: #000;
+  }
+}
+
+.worn-items {
+  margin-top: 2rem;
+
+  ul {
+    list-style: none;
+    padding: 0;
+    margin: 0.5rem 0;
+  }
+
+  li {
+    padding: 0.5rem;
+    background: #f9f9f9;
+    margin-bottom: 0.5rem;
+    border-radius: 4px;
+    color: #333;
+  }
+}
\ No newline at end of file
diff --git a/app/assets/stylesheets/outfits/new_v2.sass b/app/assets/stylesheets/outfits/new_v2.sass
deleted file mode 100644
index 6fd17975..00000000
--- a/app/assets/stylesheets/outfits/new_v2.sass
+++ /dev/null
@@ -1,106 +0,0 @@
-body.wardrobe-v2
-  margin: 0
-  padding: 0
-  height: 100vh
-  overflow: hidden
-  font-family: sans-serif
-
-.wardrobe-container
-  display: flex
-  height: 100vh
-  background: #000
-
-  @media (max-width: 800px)
-    flex-direction: column
-
-.outfit-preview-section
-  flex: 1
-  display: flex
-  align-items: center
-  justify-content: center
-  background: #000
-  position: relative
-  min-height: 400px
-
-  outfit-viewer
-    width: 100%
-    height: 100%
-
-  .no-preview-message
-    color: white
-    text-align: center
-    padding: 2rem
-    font-size: 1.2rem
-
-.outfit-controls-section
-  width: 400px
-  background: #fff
-  padding: 2rem
-  overflow-y: auto
-  box-shadow: -2px 0 10px rgba(0, 0, 0, 0.3)
-
-  @media (max-width: 800px)
-    width: 100%
-    max-height: 40vh
-
-  h1
-    margin-top: 0
-    font-size: 1.75rem
-    color: #448844
-
-  h2
-    font-size: 1.25rem
-    color: #448844
-    margin-top: 2rem
-
-.species-color-picker
-  margin: 1.5rem 0
-
-  .form-group
-    margin-bottom: 1rem
-
-    label
-      display: block
-      font-weight: bold
-      margin-bottom: 0.5rem
-      color: #333
-
-    select
-      width: 100%
-      padding: 0.5rem
-      font-size: 1rem
-      border: 1px solid #ccc
-      border-radius: 4px
-      font-family: inherit
-
-      &:focus
-        outline: none
-        border-color: #448844
-
-.current-selection
-  padding: 1rem
-  background: #f0f0f0
-  border-radius: 4px
-  margin: 1rem 0
-
-  p
-    margin: 0
-    color: #666
-
-  strong
-    color: #000
-
-.worn-items
-  margin-top: 2rem
-
-  ul
-    list-style: none
-    padding: 0
-    margin: 0.5rem 0
-
-  li
-    padding: 0.5rem
-    background: #f9f9f9
-    margin-bottom: 0.5rem
-    border-radius: 4px
-    color: #333