diff --git a/src/components/layout/Radio.tsx b/src/components/layout/Radio.tsx
index af44725..efa7eb8 100644
--- a/src/components/layout/Radio.tsx
+++ b/src/components/layout/Radio.tsx
@@ -6,6 +6,7 @@ type Choices = { value: string, label: string, caption: string }[]
 // TODO: how could would it be if we could just pass the estimated fees in here?
 export function StyledRadioGroup(props: { value: string, choices: Choices, onValueChange: (value: string) => void, small?: boolean, }) {
     return (
+        // TODO: rewrite this with CVA, props are bad for tailwind
         <RadioGroup.Root value={props.value} onValueChange={(e) => props.onValueChange(e)} class={`grid w-full gap-${props.small ? "2" : "4"} grid-cols-${props.choices.length.toString()}`}>
             <For each={props.choices}>
                 {choice =>
diff --git a/tailwind.config.cjs b/tailwind.config.cjs
index 9cd610e..7b03d9e 100644
--- a/tailwind.config.cjs
+++ b/tailwind.config.cjs
@@ -6,6 +6,12 @@ module.exports = {
     "./index.html",
     "./src/**/*.{js,ts,jsx,tsx}",
   ],
+  safelist: [
+    'grid-cols-1',
+    'grid-cols-2',
+    'gap-2',
+    'gap-4'
+  ],
   variants: {
     extend: {
       borderWidth: ['responsive', 'last', 'hover', 'focus'],