diff --git a/src/app/features/create-room/CreateRoomModalRenderer.tsx b/src/app/features/create-room/CreateRoomModal.tsx
similarity index 78%
rename from src/app/features/create-room/CreateRoomModalRenderer.tsx
rename to src/app/features/create-room/CreateRoomModal.tsx
index e20ff7e1..c1c9ba3e 100644
--- a/src/app/features/create-room/CreateRoomModalRenderer.tsx
+++ b/src/app/features/create-room/CreateRoomModal.tsx
@@ -1,6 +1,7 @@
 import React from 'react';
 import {
   Box,
+  config,
   Header,
   Icon,
   IconButton,
@@ -21,7 +22,6 @@ import {
   useCreateRoomModalState,
 } from '../../state/hooks/createRoomModal';
 import { CreateRoomModalState } from '../../state/createRoomModal';
-import * as css from './styles.css';
 import { stopPropagation } from '../../utils/keyboard';
 
 type CreateRoomModalProps = {
@@ -47,9 +47,16 @@ function CreateRoomModal({ state }: CreateRoomModalProps) {
               escapeDeactivates: stopPropagation,
             }}
           >
-            <Modal className={css.CreateRoomModal} size="300" flexHeight>
+            <Modal size="300" flexHeight>
               <Box direction="Column">
-                <Header size="500" className={css.CreateRoomModalHeader}>
+                <Header
+                  size="500"
+                  style={{
+                    padding: config.space.S200,
+                    paddingLeft: config.space.S400,
+                    borderBottomWidth: config.borderWidth.B300,
+                  }}
+                >
                   <Box grow="Yes">
                     <Text size="H4">New Room</Text>
                   </Box>
@@ -60,7 +67,14 @@ function CreateRoomModal({ state }: CreateRoomModalProps) {
                   </Box>
                 </Header>
                 <Scroll size="300" hideTrack>
-                  <Box className={css.CreateRoomModalContent} direction="Column" gap="500">
+                  <Box
+                    style={{
+                      padding: config.space.S400,
+                      paddingRight: config.space.S200,
+                    }}
+                    direction="Column"
+                    gap="500"
+                  >
                     <CreateRoomForm space={space} onCreate={closeDialog} />
                   </Box>
                 </Scroll>
diff --git a/src/app/features/create-room/index.ts b/src/app/features/create-room/index.ts
index cb70756c..f60c94b3 100644
--- a/src/app/features/create-room/index.ts
+++ b/src/app/features/create-room/index.ts
@@ -1,2 +1,2 @@
 export * from './CreateRoom';
-export * from './CreateRoomModalRenderer';
+export * from './CreateRoomModal';
diff --git a/src/app/features/create-room/styles.css.ts b/src/app/features/create-room/styles.css.ts
deleted file mode 100644
index a03d17f3..00000000
--- a/src/app/features/create-room/styles.css.ts
+++ /dev/null
@@ -1,17 +0,0 @@
-import { style } from '@vanilla-extract/css';
-import { config } from 'folds';
-
-export const CreateRoomModal = style({
-  position: 'relative',
-});
-
-export const CreateRoomModalHeader = style({
-  padding: config.space.S200,
-  paddingLeft: config.space.S400,
-  borderBottomWidth: config.borderWidth.B300,
-});
-
-export const CreateRoomModalContent = style({
-  padding: config.space.S400,
-  paddingRight: config.space.S200,
-});