fix: stabilize kumo ui components

.trellis/spec/frontend/components.md

@@ -117,6 +117,47 @@ import { Table } from "@/components/ui/table";
 Visible form controls and data tables should use the Kumo-backed adapters. Native hidden
 inputs are acceptable only inside adapters when needed to preserve FormData semantics.
 
+### Select Adapter Positioning Contract
+
+`components/ui/select.tsx` is intentionally project-owned instead of directly wrapping
+`@cloudflare/kumo/components/select`. Kumo Select 2.6 can inherit Base UI
+`alignItemWithTrigger=true`, which may render `data-side="none"` and overlap the trigger in
+production.
+
+The project Select adapter must:
+
+- Preserve the local API: `options`, `value`, `defaultValue`, `name`, `placeholder`,
+  `disabled`, `required`, `aria-*`, and `onValueChange`.
+- Render a hidden form value only inside the adapter when `name` is provided.
+- Use portal/fixed positioning for the popup and keep a positive gap between trigger and
+  panel. Browser validation should assert `verticalOverlap === 0` on desktop and mobile.
+- Keep keyboard behavior for ArrowUp/ArrowDown, Home/End, Enter/Space, Escape, and Tab.
+
+```typescript
+// Good: feature code stays on the project adapter.
+<Select name="organizationId" options={organizationOptions} />
+
+// Avoid: this can reintroduce production overlay regressions.
+import { Select } from "@cloudflare/kumo/components/select";
+```
+
+### Dialog Adapter Centering Contract
+
+`components/ui/dialog.tsx` may use Kumo Dialog primitives for accessibility, but the
+project adapter owns panel geometry. Kumo Dialog includes fixed `left-1/2 top-1/2`
+and translate classes, and those transforms can interact with project animations or
+production CSS ordering.
+
+The project Dialog adapter must:
+
+- Center the panel without relying on translate transforms. Use `fixed inset-0 m-auto`
+  plus explicit width, max-height, and `h-fit`.
+- Override Kumo minimum width so mobile dialogs stay inside `100vw`.
+- Keep `transform: none` and `translate: 0 0` on `.teatea-dialog`; use
+  opacity/scale-only motion if animation is needed.
+- Browser validation should assert the panel center is within 2px of the viewport center
+  on desktop and mobile.
+
 ### Use Proper Elements
 
 ```typescript