got working toggle tabs! I don't like HeadlessUI's Tabs, they don't appear to support programmatic opening

app/web/src/index.css

@@ -17,6 +17,29 @@
   body {
     font-family: 'Fira Sans', ui-sans-serif, system-ui, -apple-system, system-ui, "Segoe UI", "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
   }
+
+  /* https://www.a11yproject.com/posts/2013-01-11-how-to-hide-content/ */
+  .visually-hidden {
+    clip: rect(0 0 0 0);
+    clip-path: inset(50%);
+    height: 1px;
+    overflow: hidden;
+    position: absolute;
+    white-space: nowrap;
+    width: 1px;
+  }
+}
+
+@layer components {
+  .tabToggle {
+    @apply text-ch-gray-300 p-3 mb-3 flex justify-center;
+  }
+  .tabToggle.active {
+    @apply bg-ch-pink-800 text-ch-pink-300 bg-opacity-30;
+  }
+  .tabToggle.disabled {
+    @apply text-ch-gray-550 cursor-not-allowed;
+  }
 }