refactor: use tailwind custom colors for themes

Use tailwind v4 @theme block so we can use bg-layer-0 instead of
bg-[--layer-0] for theme colors.

packages/ui/src/lib/inputs/InputSelect.svelte

@@ -0,0 +1,25 @@
+<script lang="ts">
+  interface Props {
+    options?: string[];
+    value?: number;
+    id?: string;
+  }
+
+  let { options = [], value = $bindable(0), id = '' }: Props = $props();
+</script>
+
+<select {id} bind:value class="bg-layer-2 text-text">
+  {#each options as label, i (label)}
+    <option value={i}>{label}</option>
+  {/each}
+</select>
+
+<style>
+  select {
+    font-family: var(--font-family);
+    outline: solid 1px var(--color-outline);
+    padding: 0.8em 1em;
+    border-radius: 5px;
+    border: none;
+  }
+</style>