slice 3.5c: seed 15 built-in skills across the 6 stacks

Hand-authored skill catalog anchored to real 2026-07 versions:
  - Rust 1.97.1 (stable), edition 2024
  - React 19.2.7, Server Components + Actions
  - TailwindCSS 4.3.3 (CSS-first config, Oxide engine)
  - three.js r185 (WebGPURenderer stable, BatchedMesh matured)
  - React Native 0.86 / Expo SDK 54+ (New Architecture default)
  - cargo-nextest 0.9.140, gitleaks 8.20+, cargo-audit 0.21+
  - Postgres 17 (18 in beta, don't rely on)
  - CUDA Blackwell, Metal Apple7+, ROCm CDNA3

Ships 15 skills across the categories:
  foundation/  workspace-repo-commit-protocol
               small-focused-commits
               tdd-red-green-refactor
               code-review-checklist
               int-xx-marker-protocol
               decompose-int-items
  rust/        write-rust-current-edition
               rust-error-handling
               cargo-test-driven-development
               rust-async-tokio-idioms
  backend/     postgres-migrations-forward-only
               postgres-index-selection
               api-pagination-day-1
  frontend/    react-19-server-components
               tailwind-v4-idioms
               component-4-state-model
  mobile/      expo-managed-vs-bare
               rn-flashlist-perf
  gpu/         gpu-coalescing-and-occupancy
               roofline-model
  threejs/     threejs-perf-and-teardown
  security/    cargo-audit-workflow
               secret-scanning-gitleaks

skills_loader.rs walks skills/**/*.md, parses YAML frontmatter
(name, description, when_to_use, tags), upserts via
skills_catalog::upsert_builtin. Idempotent per boot — bumps version
+ appends skill_versions row ONLY when body changes. Deterministic
sha256-derived ids so builtins are stable across boots.

Dockerfile copies skills/ to /etc/clawmates/skills. Server boot
task spawns loader alongside team_template_loader.

Follow-ups (Slice 3.5c continuation, future PRs):
  - 20-30 more skills (duckdb, shadcn composition, a11y, WebGPU
    migration, metal frame capture, rocprof, deep gitea forge
    integration, semgrep rulepacks)
  - Bind skills to team template roles (add [role.skills] refs to
    templates/teams/*.toml + wire template_role_skills population
    in team_template_loader)

Co-Authored-By: Claude Opus 4.7 <[email protected]>

skills/frontend/tailwind-v4-idioms.md

@@ -0,0 +1,74 @@
+---
+name: tailwind-v4-idioms
+description: TailwindCSS v4 (4.3.3 as of 2026-07) — CSS-first config, no tailwind.config.js by default, container queries, custom variants.
+when_to_use: You're authoring styles in a TailwindCSS v4 project. Frontend team pins this.
+tags: [frontend, css, tailwind, versioned]
+---
+
+# TailwindCSS v4 (4.3.3)
+
+## What changed vs v3
+
+- **CSS-first config**. No `tailwind.config.js` by default. Theme tokens live in your CSS via `@theme { ... }`.
+- **`@import "tailwindcss"`** replaces the three `@tailwind base/components/utilities` directives.
+- **Zero-config content detection** — scans automatically via the Vite/PostCSS plugin, no `content: [...]` glob.
+- **Native CSS variables everywhere** — every design token is a `--color-primary` style var, usable in raw CSS.
+- **Container queries built-in** — `@container/name` variant, no plugin.
+- **Faster** — Rust-powered engine (Oxide), ~100× faster incremental builds.
+
+## Minimal setup
+
+```css
+/* app.css */
+@import "tailwindcss";
+
+@theme {
+  --color-brand-500: oklch(0.7 0.15 250);
+  --font-display: "Inter", ui-sans-serif;
+}
+```
+
+Then in a component: `class="text-brand-500 font-display"`.
+
+## Class-order convention
+
+For each `class="..."` attribute, order tokens:
+
+```
+[layout] → [box] → [typography] → [color] → [state]
+flex items-center gap-2 → w-full p-4 rounded-lg → text-sm font-semibold → text-white bg-brand-500 → hover:bg-brand-600 focus:outline-none
+```
+
+Prettier's `prettier-plugin-tailwindcss` enforces this — run it in CI.
+
+## Design system integration (ShadCN)
+
+- ShadCN 2.x ships v4-native components. No compat layer needed.
+- Custom variants: define once in `@variant` and reuse:
+  ```css
+  @variant hocus (&:hover, &:focus-visible);
+  /* class="hocus:bg-brand-500" */
+  ```
+- Prefer `data-[state=open]:...` variants for stateful ShadCN primitives.
+
+## Container queries
+
+```html
+<div class="@container/card">
+  <p class="@md/card:text-lg text-sm">Adapts to card width, not viewport.</p>
+</div>
+```
+
+- Name the container (`/card`) so nested containers don't cross-reference.
+- Breakpoints: `@sm`, `@md`, `@lg`, `@xl` follow the same px values as viewport.
+
+## Dark mode
+
+`@media (prefers-color-scheme: dark)` is picked up automatically. For a manual toggle, use `dark:` variant + a class or attribute switch on `<html>` (`data-theme="dark"` + `@variant dark (&[data-theme="dark"] *)`).
+
+## Anti-patterns
+
+- **Bringing back `tailwind.config.js`** for one tweak. Use `@theme` in CSS instead.
+- **Inline styles alongside utility classes** — pick one per element.
+- **`@apply` in component CSS** — allowed but should be rare; utility class in JSX is usually clearer.
+- **Arbitrary values everywhere** — `class="mt-[13px]"` is a code smell if it repeats. Promote to a theme token.