diff --git a/README.md b/README.md
index 4ca282b..942ea45 100644
--- a/README.md
+++ b/README.md
@@ -1,5 +1,7 @@
 # Bible Plan
 
+https://emeraldwalk.github.io/bible-plan/
+
 ## Project Setup
 
 - npx degit solidjs/templates/ts bible-plan
diff --git a/package-lock.json b/package-lock.json
index 32758f5..81940cf 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -9,10 +9,10 @@
       "version": "0.0.0",
       "license": "MIT",
       "dependencies": {
-        "@kobalte/core": "^0.12.1",
         "solid-js": "^1.8.11"
       },
       "devDependencies": {
+        "sass": "^1.70.0",
         "solid-devtools": "^0.29.2",
         "typescript": "^5.3.3",
         "vite": "^5.0.12",
@@ -869,44 +869,6 @@
         "node": ">=12"
       }
     },
-    "node_modules/@floating-ui/core": {
-      "version": "1.5.3",
-      "resolved": "https://registry.npmjs.org/@floating-ui/core/-/core-1.5.3.tgz",
-      "integrity": "sha512-O0WKDOo0yhJuugCx6trZQj5jVJ9yR0ystG2JaNAemYUWce+pmM6WUEFIibnWyEJKdrDxhm75NoSRME35FNaM/Q==",
-      "dependencies": {
-        "@floating-ui/utils": "^0.2.0"
-      }
-    },
-    "node_modules/@floating-ui/dom": {
-      "version": "1.5.4",
-      "resolved": "https://registry.npmjs.org/@floating-ui/dom/-/dom-1.5.4.tgz",
-      "integrity": "sha512-jByEsHIY+eEdCjnTVu+E3ephzTOzkQ8hgUfGwos+bg7NlH33Zc5uO+QHz1mrQUOgIKKDD1RtS201P9NvAfq3XQ==",
-      "dependencies": {
-        "@floating-ui/core": "^1.5.3",
-        "@floating-ui/utils": "^0.2.0"
-      }
-    },
-    "node_modules/@floating-ui/utils": {
-      "version": "0.2.1",
-      "resolved": "https://registry.npmjs.org/@floating-ui/utils/-/utils-0.2.1.tgz",
-      "integrity": "sha512-9TANp6GPoMtYzQdt54kfAyMmz1+osLlXdg2ENroU7zzrtflTLrrC/lgrIfaSe+Wu0b89GKccT7vxXA0MoAIO+Q=="
-    },
-    "node_modules/@internationalized/date": {
-      "version": "3.5.1",
-      "resolved": "https://registry.npmjs.org/@internationalized/date/-/date-3.5.1.tgz",
-      "integrity": "sha512-LUQIfwU9e+Fmutc/DpRTGXSdgYZLBegi4wygCWDSVmUdLTaMHsQyASDiJtREwanwKuQLq0hY76fCJ9J/9I2xOQ==",
-      "dependencies": {
-        "@swc/helpers": "^0.5.0"
-      }
-    },
-    "node_modules/@internationalized/number": {
-      "version": "3.5.0",
-      "resolved": "https://registry.npmjs.org/@internationalized/number/-/number-3.5.0.tgz",
-      "integrity": "sha512-ZY1BW8HT9WKYvaubbuqXbbDdHhOUMfE2zHHFJeTppid0S+pc8HtdIxFxaYMsGjCb4UsF+MEJ4n2TfU7iHnUK8w==",
-      "dependencies": {
-        "@swc/helpers": "^0.5.0"
-      }
-    },
     "node_modules/@jridgewell/gen-mapping": {
       "version": "0.3.3",
       "resolved": "https://registry.npmjs.org/@jridgewell/gen-mapping/-/gen-mapping-0.3.3.tgz",
@@ -955,37 +917,6 @@
         "@jridgewell/sourcemap-codec": "^1.4.14"
       }
     },
-    "node_modules/@kobalte/core": {
-      "version": "0.12.1",
-      "resolved": "https://registry.npmjs.org/@kobalte/core/-/core-0.12.1.tgz",
-      "integrity": "sha512-/GvgH/jknZ/jr3qnc8PwnPnwNfp8pQHj9Ja0TjFUcTsnGKS/XoDXSWqCjiKOL3M6uBfZmmdn1A/3i3Na4w9Ujg==",
-      "dependencies": {
-        "@floating-ui/dom": "^1.5.1",
-        "@internationalized/date": "^3.4.0",
-        "@internationalized/number": "^3.2.1",
-        "@kobalte/utils": "^0.9.0"
-      },
-      "peerDependencies": {
-        "solid-js": "^1.7.11"
-      }
-    },
-    "node_modules/@kobalte/utils": {
-      "version": "0.9.0",
-      "resolved": "https://registry.npmjs.org/@kobalte/utils/-/utils-0.9.0.tgz",
-      "integrity": "sha512-TYVCpQcpqo1+0HBn3NXoGEBzxd4tH6Um1oc07nrYw1V7Qq0qbMaYAOnfBc1qhlh7sGV4XZldmb0j13Of0FrZQg==",
-      "dependencies": {
-        "@solid-primitives/event-listener": "^2.2.14",
-        "@solid-primitives/keyed": "^1.2.0",
-        "@solid-primitives/map": "^0.4.7",
-        "@solid-primitives/media": "^2.2.4",
-        "@solid-primitives/props": "^3.1.8",
-        "@solid-primitives/refs": "^1.0.5",
-        "@solid-primitives/utils": "^6.2.1"
-      },
-      "peerDependencies": {
-        "solid-js": "^1.7.11"
-      }
-    },
     "node_modules/@nothing-but/utils": {
       "version": "0.12.1",
       "resolved": "https://registry.npmjs.org/@nothing-but/utils/-/utils-0.12.1.tgz",
@@ -1247,6 +1178,7 @@
       "version": "2.3.1",
       "resolved": "https://registry.npmjs.org/@solid-primitives/event-listener/-/event-listener-2.3.1.tgz",
       "integrity": "sha512-S1AfFYatOJ3g/ZUbGDoKplSGLTTfarQ3Mfd3F/fXb9SnzGtROtd+Y6yLkPVzK4AVw83r2wUSaS0GS6dg8izTEQ==",
+      "dev": true,
       "dependencies": {
         "@solid-primitives/utils": "^6.2.2"
       },
@@ -1268,29 +1200,11 @@
         "solid-js": "^1.6.12"
       }
     },
-    "node_modules/@solid-primitives/keyed": {
-      "version": "1.2.1",
-      "resolved": "https://registry.npmjs.org/@solid-primitives/keyed/-/keyed-1.2.1.tgz",
-      "integrity": "sha512-fLZ3CX41IiG2kshCWFMDBq4LeSuuHpZ91UrWqcr6EFq3lGWE5iPswHyHilSiaeLWZLpbhZ/HAwrM/wlh2S1mYQ==",
-      "peerDependencies": {
-        "solid-js": "^1.6.12"
-      }
-    },
-    "node_modules/@solid-primitives/map": {
-      "version": "0.4.9",
-      "resolved": "https://registry.npmjs.org/@solid-primitives/map/-/map-0.4.9.tgz",
-      "integrity": "sha512-wMbIhfn24QDnNqJHRskFjKJ2bwvcx28/S0xBKoZdRdUaqIPZYWOVT8SM++dfWS44YdC2kJPF4RSTY1022aujLA==",
-      "dependencies": {
-        "@solid-primitives/trigger": "^1.0.9"
-      },
-      "peerDependencies": {
-        "solid-js": "^1.6.12"
-      }
-    },
     "node_modules/@solid-primitives/media": {
       "version": "2.2.6",
       "resolved": "https://registry.npmjs.org/@solid-primitives/media/-/media-2.2.6.tgz",
       "integrity": "sha512-VopOSqoUZgmSFY4SNnwBzHYaoGG+7gQYcwX+RJ/qQtuZJgzOiC+PejZEwNJh+aBZ383HPwrypyd3zrYVm7EnpQ==",
+      "dev": true,
       "dependencies": {
         "@solid-primitives/event-listener": "^2.3.1",
         "@solid-primitives/rootless": "^1.4.3",
@@ -1305,6 +1219,7 @@
       "version": "0.0.6",
       "resolved": "https://registry.npmjs.org/@solid-primitives/static-store/-/static-store-0.0.6.tgz",
       "integrity": "sha512-PtvkbbucbjT+9p95pksOciG9gOnCtJz4IUyAKX1Ld7YwI+QgtPTo0Wuxs8gNbNtLtoDv5PNv5t4YRzUyl0fwdg==",
+      "dev": true,
       "dependencies": {
         "@solid-primitives/utils": "^6.2.2"
       },
@@ -1321,21 +1236,11 @@
         "solid-js": "^1.6.12"
       }
     },
-    "node_modules/@solid-primitives/props": {
-      "version": "3.1.9",
-      "resolved": "https://registry.npmjs.org/@solid-primitives/props/-/props-3.1.9.tgz",
-      "integrity": "sha512-2MvjgxF0rwMR8BGq2onN9KhxF66bQhtFWdrEkO/qjy8I4wr/OQrhwgM9RP89/gtzOVPXUYKSxt2lkCk+JQpNJA==",
-      "dependencies": {
-        "@solid-primitives/utils": "^6.2.2"
-      },
-      "peerDependencies": {
-        "solid-js": "^1.6.12"
-      }
-    },
     "node_modules/@solid-primitives/refs": {
       "version": "1.0.6",
       "resolved": "https://registry.npmjs.org/@solid-primitives/refs/-/refs-1.0.6.tgz",
       "integrity": "sha512-ruh4YdVMxThEVnvqbpeLXKojW442vpFU8q7dSKtElGOTa31aKOAkRb9BTbdaTwVjN4BEq79fiiYIXozJNl4dSw==",
+      "dev": true,
       "dependencies": {
         "@solid-primitives/utils": "^6.2.2"
       },
@@ -1374,6 +1279,7 @@
       "version": "1.4.3",
       "resolved": "https://registry.npmjs.org/@solid-primitives/rootless/-/rootless-1.4.3.tgz",
       "integrity": "sha512-IPsfUhKsqQOxLtRMQWK2EZAYbL9RKJMLBelLwpaXl9+oa1tl5aNvA6GHgrNrK+85oUhiYh7/OuogO18AuHepqQ==",
+      "dev": true,
       "dependencies": {
         "@solid-primitives/utils": "^6.2.2"
       },
@@ -1415,33 +1321,15 @@
         "solid-js": "^1.6.12"
       }
     },
-    "node_modules/@solid-primitives/trigger": {
-      "version": "1.0.9",
-      "resolved": "https://registry.npmjs.org/@solid-primitives/trigger/-/trigger-1.0.9.tgz",
-      "integrity": "sha512-hW9r8LkFQ0KSAtesSVUfZ9uIAuttslndgfJs+hD+SD1C5JwHyDm4sFoJKzahexh04iKX29JXmuDEjdjudIWqFQ==",
-      "dependencies": {
-        "@solid-primitives/utils": "^6.2.2"
-      },
-      "peerDependencies": {
-        "solid-js": "^1.6.12"
-      }
-    },
     "node_modules/@solid-primitives/utils": {
       "version": "6.2.2",
       "resolved": "https://registry.npmjs.org/@solid-primitives/utils/-/utils-6.2.2.tgz",
       "integrity": "sha512-11ypVbp987XxETeRqY5Y3OmmTpm8/jZqJXRvo6AyqBthzkvvjEdReuUMU2yVb+pwWGxfZpWHZ6EUCcGXUMhfwg==",
+      "dev": true,
       "peerDependencies": {
         "solid-js": "^1.6.12"
       }
     },
-    "node_modules/@swc/helpers": {
-      "version": "0.5.3",
-      "resolved": "https://registry.npmjs.org/@swc/helpers/-/helpers-0.5.3.tgz",
-      "integrity": "sha512-FaruWX6KdudYloq1AHD/4nU+UsMTdNE8CKyrseXWEcgjDAbvkwJg2QGPAnfIJLIWsjZOSPLOAykK6fuYp4vp4A==",
-      "dependencies": {
-        "tslib": "^2.4.0"
-      }
-    },
     "node_modules/@types/babel__core": {
       "version": "7.20.5",
       "resolved": "https://registry.npmjs.org/@types/babel__core/-/babel__core-7.20.5.tgz",
@@ -1501,6 +1389,19 @@
         "node": ">=4"
       }
     },
+    "node_modules/anymatch": {
+      "version": "3.1.3",
+      "resolved": "https://registry.npmjs.org/anymatch/-/anymatch-3.1.3.tgz",
+      "integrity": "sha512-KMReFUr0B4t+D+OBkjR3KYqvocp2XaSzO55UcB6mgQMd3KbcE+mWTyvVV7D/zsdEbNnV6acZUutkiHQXvTr1Rw==",
+      "dev": true,
+      "dependencies": {
+        "normalize-path": "^3.0.0",
+        "picomatch": "^2.0.4"
+      },
+      "engines": {
+        "node": ">= 8"
+      }
+    },
     "node_modules/babel-plugin-jsx-dom-expressions": {
       "version": "0.37.13",
       "resolved": "https://registry.npmjs.org/babel-plugin-jsx-dom-expressions/-/babel-plugin-jsx-dom-expressions-0.37.13.tgz",
@@ -1541,6 +1442,27 @@
         "@babel/core": "^7.0.0"
       }
     },
+    "node_modules/binary-extensions": {
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/binary-extensions/-/binary-extensions-2.2.0.tgz",
+      "integrity": "sha512-jDctJ/IVQbZoJykoeHbhXpOlNBqGNcwXJKJog42E5HDPUwQTSdjCHdihjj0DlnheQ7blbT6dHOafNAiS8ooQKA==",
+      "dev": true,
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/braces": {
+      "version": "3.0.2",
+      "resolved": "https://registry.npmjs.org/braces/-/braces-3.0.2.tgz",
+      "integrity": "sha512-b8um+L1RzM3WDSzvhm6gIz1yfTbBt6YTlcEKAvsmqCZZFw46z626lVj9j1yEPW33H5H+lBQpZMP1k8l+78Ha0A==",
+      "dev": true,
+      "dependencies": {
+        "fill-range": "^7.0.1"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
     "node_modules/browserslist": {
       "version": "4.22.2",
       "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.22.2.tgz",
@@ -1607,6 +1529,33 @@
         "node": ">=4"
       }
     },
+    "node_modules/chokidar": {
+      "version": "3.5.3",
+      "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-3.5.3.tgz",
+      "integrity": "sha512-Dr3sfKRP6oTcjf2JmUmFJfeVMvXBdegxB0iVQ5eb2V10uFJUCAS8OByZdVAyVb8xXNz3GjjTgj9kLWsZTqE6kw==",
+      "dev": true,
+      "funding": [
+        {
+          "type": "individual",
+          "url": "https://paulmillr.com/funding/"
+        }
+      ],
+      "dependencies": {
+        "anymatch": "~3.1.2",
+        "braces": "~3.0.2",
+        "glob-parent": "~5.1.2",
+        "is-binary-path": "~2.1.0",
+        "is-glob": "~4.0.1",
+        "normalize-path": "~3.0.0",
+        "readdirp": "~3.6.0"
+      },
+      "engines": {
+        "node": ">= 8.10.0"
+      },
+      "optionalDependencies": {
+        "fsevents": "~2.3.2"
+      }
+    },
     "node_modules/color-convert": {
       "version": "1.9.3",
       "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-1.9.3.tgz",
@@ -1712,6 +1661,18 @@
         "node": ">=0.8.0"
       }
     },
+    "node_modules/fill-range": {
+      "version": "7.0.1",
+      "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-7.0.1.tgz",
+      "integrity": "sha512-qOo9F+dMUmC2Lcb4BbVvnKJxTPjCm+RRpe4gDuGrzkL7mEVl/djYSu2OdQ2Pa302N4oqkSg9ir6jaLWJ2USVpQ==",
+      "dev": true,
+      "dependencies": {
+        "to-regex-range": "^5.0.1"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
     "node_modules/fsevents": {
       "version": "2.3.3",
       "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.3.tgz",
@@ -1735,6 +1696,18 @@
         "node": ">=6.9.0"
       }
     },
+    "node_modules/glob-parent": {
+      "version": "5.1.2",
+      "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.2.tgz",
+      "integrity": "sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==",
+      "dev": true,
+      "dependencies": {
+        "is-glob": "^4.0.1"
+      },
+      "engines": {
+        "node": ">= 6"
+      }
+    },
     "node_modules/globals": {
       "version": "11.12.0",
       "resolved": "https://registry.npmjs.org/globals/-/globals-11.12.0.tgz",
@@ -1759,6 +1732,54 @@
       "integrity": "sha512-DV5Ln36z34NNTDgnz0EWGBLZENelNAtkiFA4kyNOG2tDI6Mz1uSWiq1wAKdyjnJwyDiDO7Fa2SO1CTxPXL8VxA==",
       "dev": true
     },
+    "node_modules/immutable": {
+      "version": "4.3.4",
+      "resolved": "https://registry.npmjs.org/immutable/-/immutable-4.3.4.tgz",
+      "integrity": "sha512-fsXeu4J4i6WNWSikpI88v/PcVflZz+6kMhUfIwc5SY+poQRPnaf5V7qds6SUyUN3cVxEzuCab7QIoLOQ+DQ1wA==",
+      "dev": true
+    },
+    "node_modules/is-binary-path": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/is-binary-path/-/is-binary-path-2.1.0.tgz",
+      "integrity": "sha512-ZMERYes6pDydyuGidse7OsHxtbI7WVeUEozgR/g7rd0xUimYNlvZRE/K2MgZTjWy725IfelLeVcEM97mmtRGXw==",
+      "dev": true,
+      "dependencies": {
+        "binary-extensions": "^2.0.0"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/is-extglob": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-2.1.1.tgz",
+      "integrity": "sha512-SbKbANkN603Vi4jEZv49LeVJMn4yGwsbzZworEoyEiutsN3nJYdbO36zfhGJ6QEDpOZIFkDtnq5JRxmvl3jsoQ==",
+      "dev": true,
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
+    "node_modules/is-glob": {
+      "version": "4.0.3",
+      "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-4.0.3.tgz",
+      "integrity": "sha512-xelSayHH36ZgE7ZWhli7pW34hNbNl8Ojv5KVmkJD4hBdD3th8Tfk9vYasLM+mXWOZhFkgZfxhLSnrwRr4elSSg==",
+      "dev": true,
+      "dependencies": {
+        "is-extglob": "^2.1.1"
+      },
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
+    "node_modules/is-number": {
+      "version": "7.0.0",
+      "resolved": "https://registry.npmjs.org/is-number/-/is-number-7.0.0.tgz",
+      "integrity": "sha512-41Cifkg6e8TylSpdtTpeLVMqvSBEVzTttHvERD741+pnZ8ANv0004MRL43QKPDlK9cGvNp6NZWZUBlbGXYxxng==",
+      "dev": true,
+      "engines": {
+        "node": ">=0.12.0"
+      }
+    },
     "node_modules/is-what": {
       "version": "4.1.16",
       "resolved": "https://registry.npmjs.org/is-what/-/is-what-4.1.16.tgz",
@@ -1855,12 +1876,33 @@
       "integrity": "sha512-y10wOWt8yZpqXmOgRo77WaHEmhYQYGNA6y421PKsKYWEK8aW+cqAphborZDhqfyKrbZEN92CN1X2KbafY2s7Yw==",
       "dev": true
     },
+    "node_modules/normalize-path": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/normalize-path/-/normalize-path-3.0.0.tgz",
+      "integrity": "sha512-6eZs5Ls3WtCisHWp9S2GUy8dqkpGi4BVSz3GaqiE6ezub0512ESztXUwUB6C6IKbQkY2Pnb/mD4WYojCRwcwLA==",
+      "dev": true,
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
     "node_modules/picocolors": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.0.0.tgz",
       "integrity": "sha512-1fygroTLlHu66zi26VoTDv8yRgm0Fccecssto+MhsZ0D/DGW2sm8E8AjW7NU5VVTRt5GxbeZ5qBuJr+HyLYkjQ==",
       "dev": true
     },
+    "node_modules/picomatch": {
+      "version": "2.3.1",
+      "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.3.1.tgz",
+      "integrity": "sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==",
+      "dev": true,
+      "engines": {
+        "node": ">=8.6"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/jonschlinkert"
+      }
+    },
     "node_modules/postcss": {
       "version": "8.4.33",
       "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.33.tgz",
@@ -1889,6 +1931,18 @@
         "node": "^10 || ^12 || >=14"
       }
     },
+    "node_modules/readdirp": {
+      "version": "3.6.0",
+      "resolved": "https://registry.npmjs.org/readdirp/-/readdirp-3.6.0.tgz",
+      "integrity": "sha512-hOS089on8RduqdbhvQ5Z37A0ESjsqz6qnRcffsMU3495FuTdqSm+7bhJ29JvIOsBDEEnan5DPu9t3To9VRlMzA==",
+      "dev": true,
+      "dependencies": {
+        "picomatch": "^2.2.1"
+      },
+      "engines": {
+        "node": ">=8.10.0"
+      }
+    },
     "node_modules/rollup": {
       "version": "4.9.5",
       "resolved": "https://registry.npmjs.org/rollup/-/rollup-4.9.5.tgz",
@@ -1921,6 +1975,23 @@
         "fsevents": "~2.3.2"
       }
     },
+    "node_modules/sass": {
+      "version": "1.70.0",
+      "resolved": "https://registry.npmjs.org/sass/-/sass-1.70.0.tgz",
+      "integrity": "sha512-uUxNQ3zAHeAx5nRFskBnrWzDUJrrvpCPD5FNAoRvTi0WwremlheES3tg+56PaVtCs5QDRX5CBLxxKMDJMEa1WQ==",
+      "dev": true,
+      "dependencies": {
+        "chokidar": ">=3.0.0 <4.0.0",
+        "immutable": "^4.0.0",
+        "source-map-js": ">=0.6.2 <2.0.0"
+      },
+      "bin": {
+        "sass": "sass.js"
+      },
+      "engines": {
+        "node": ">=14.0.0"
+      }
+    },
     "node_modules/semver": {
       "version": "6.3.1",
       "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.1.tgz",
@@ -2029,10 +2100,17 @@
         "node": ">=4"
       }
     },
-    "node_modules/tslib": {
-      "version": "2.6.2",
-      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz",
-      "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q=="
+    "node_modules/to-regex-range": {
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/to-regex-range/-/to-regex-range-5.0.1.tgz",
+      "integrity": "sha512-65P7iz6X5yEr1cwcgvQxbbIw7Uk3gOy5dIdtZ4rDveLqhrdJP+Li/Hx6tyK0NEb+2GCyneCMJiGqrADCSNk8sQ==",
+      "dev": true,
+      "dependencies": {
+        "is-number": "^7.0.0"
+      },
+      "engines": {
+        "node": ">=8.0"
+      }
     },
     "node_modules/typescript": {
       "version": "5.3.3",
diff --git a/package.json b/package.json
index 15bd28d..de6efdb 100644
--- a/package.json
+++ b/package.json
@@ -11,13 +11,13 @@
   },
   "license": "MIT",
   "devDependencies": {
+    "sass": "^1.70.0",
     "solid-devtools": "^0.29.2",
     "typescript": "^5.3.3",
     "vite": "^5.0.12",
     "vite-plugin-solid": "^2.8.2"
   },
   "dependencies": {
-    "@kobalte/core": "^0.12.1",
     "solid-js": "^1.8.11"
   },
   "overrides": {
diff --git a/src/components/CheckList.module.css b/src/components/CheckList.module.scss
similarity index 95%
rename from src/components/CheckList.module.css
rename to src/components/CheckList.module.scss
index a637026..048cb7b 100644
--- a/src/components/CheckList.module.css
+++ b/src/components/CheckList.module.scss
@@ -8,6 +8,7 @@
 
   ul {
     display: flex;
+    list-style: none;
     flex-direction: column;
     overflow-y: scroll;
   }
diff --git a/src/components/CheckList.tsx b/src/components/CheckList.tsx
index 1e6e251..88062ff 100644
--- a/src/components/CheckList.tsx
+++ b/src/components/CheckList.tsx
@@ -1,5 +1,5 @@
 import { For, createEffect, createSignal } from 'solid-js'
-import styles from './CheckList.module.css'
+import styles from './CheckList.module.scss'
 import planText from '../data/five-day.txt?raw'
 import { CheckListItem, isRangeComplete } from '../model'
 import { loadCheckListState, saveCheckListState } from '../data'
diff --git a/src/index.css b/src/index.css
index 6120f73..99f6669 100644
--- a/src/index.css
+++ b/src/index.css
@@ -15,3 +15,33 @@ li {
   padding: 0;
   box-sizing: border-box;
 }
+
+input[type='checkbox'] {
+  --cb-color-border: #888;
+  --cb-color-checked: #008;
+  --cb-color-unchecked: #fff;
+  --cb-padding: 0.2rem;
+  --cb-size: 1rem;
+
+  background-color: var(--cb-color-unchecked);
+  appearance: none;
+  -webkit-appearance: none;
+  display: flex;
+  padding: var(--cb-padding);
+  border: 0.2rem solid var(--cb-color-border);
+  border-radius: 0.5rem;
+  &::before {
+    content: '';
+    clip-path: polygon(9% 37%, 46% 68%, 88% 1%, 100% 8%, 50% 91%, 0 48%);
+    width: var(--cb-size);
+    height: var(--cb-size);
+    transform: scale(0);
+  }
+  &:checked {
+    background-color: var(--cb-color-checked);
+  }
+  &:checked::before {
+    transform: scale(1);
+    background-color: var(--cb-color-unchecked);
+  }
+}