add ul.grid, improve /create and SLayout

src/lib/PrivacySelect.svelte

@@ -0,0 +1,59 @@
+<script lang="ts">
+    import { RiLink, RiLock2Line, RiPlaneLine, RiStackLine } from "svelte-remixicon";
+
+    let { value = $bindable(0) } = $props();
+</script>
+
+<ul class="grid">
+  <li>
+    <label>
+    <input type="radio" name="privacy" value={0} bind:group={value} />
+    <RiPlaneLine />
+    Public
+    <small class="faint">your followers and public timeline</small>
+  </label>
+</li>
+  <li>
+    <label>
+    <input type="radio" name="privacy" value=1 bind:group={value} />
+    <RiLink />
+    Unlisted
+    <small class="faint">your followers, hide from public timeline</small>
+  </label>
+</li>
+  <li>
+    <label>
+    <input type="radio" name="privacy" value=2 bind:group={value} />
+    <RiStackLine />
+    Friends
+    <small class="faint">mutual followers only</small>
+  </label>
+</li>
+  <li>
+    <label>
+    <input type="radio" name="privacy" value=3 bind:group={value} />
+    <RiLock2Line />
+    Only you
+    <small class="faint">nobody else</small>
+  </label>
+</li>
+</ul>
+
+<style>
+
+@media (max-width: 1099px) {
+  ul.grid {
+    grid-template-columns: 1fr 1fr 1fr;
+  }
+}
+
+@media (max-width: 699px) {
+  ul.grid {
+    grid-template-columns: 1fr 1fr;
+  } 
+}
+
+li:has(:checked) {
+  border-color: var(--accent);
+}
+</style>