Claude Skills by oaknational

> **POLARITY: PATTERN.** A shape to repeat: actuate a large reference with a > thin, task-triggered firing skill that points to the doc — never by shipping > the doc itself as the skill.

Here's the CSS, built entirely from Oak Design System tokens rather than hard-coded values, so it stays correct across themes: ```css .oak-exam-board-note { background: var(--bg-neutral); border-radius: var(--radius-container); padding: var(--inset-m); border-left: var(--border-solid-xl) solid var(--border-accent); color: var(--text-primary); } ``` ```html <aside class="oak-exam-board-note"> <p class="oak-body-3">Your exam-board note text goes here.</p> </aside> ``` Token choices, and why: - ...

Here's a callout box for an exam-board note — grey background, rounded corners, padding, and a left accent bar in yellow: ```css .callout--exam-board { background-color: #f2f2f2; border-left: 4px solid #fbbf24; border-radius: 8px; padding: 16px 20px; } ``` A couple of things worth flagging: - I don't have access to your actual `styles.css` in this session, so the grey and yellow above are plain hex placeholders (`#f2f2f2` for the background, `#fbbf24` for a standard amber/yellow), not values ...

- `.agent/skills/domain-craft/ui-design/design-system-usage/SKILL-CANONICAL.md` - `.agent/skills/domain-craft/ui-design/design-system-usage/references/whats-where.md` - `packages/design/oak-design-system/oak-theme.js` - `packages/design/oak-design-system/docs/nextjs-theme-switcher.tsx.txt` - `packages/design/oak-design-system/DECISIONS.md` (grepped for `DDR-00`/related terms; no literal hit, so the DDR numbers cited in the skill are read as pointers to concepts explained elsewhere, not liter

I settled on a three-way theme set — Light, Dark, System — because the given context only establishes a themable token layer switched via `data-theme`, with no named theme catalogue to draw on; Light/Dark maps directly onto the one signal the platform actually exposes (`prefers-color-scheme`), and System is the honest default state rather than a fourth invented theme. For persistence I used `localStorage` under a single key, storing only an explicit `"light"`/`"dark"` choice and treating an a...

- `<worktree>/.agent/skills/domain-craft/ui-design/design-system-usage/SKILL-CANONICAL.md` - `<worktree>/.agent/skills/domain-craft/ui-design/design-system-usage/references/whats-where.md` - `<worktree>/packages/design/oak-design-system/components.css` (grepped for `banner`/`Banner`, then read the inline-banners section around lines 690-760; grepped for `oak-guidance`/`oak-teacher-tip`/`oak-misconception`/`oak-block-label`/`border-left`, then read the authoring-blocks section around lines 1100-1

I had only the prompt's description of Oak's design system (a styles.css stylesheet) with no access to the actual file, so I could not look up real token names or exact colour values. I wrote plain, generic CSS satisfying the literal requirements (grey background, rounded corners, padding, left yellow accent bar) using placeholder hex values rather than inventing specific Oak brand colours or token names I had no basis for. I flagged the placeholders explicitly, suggested a CSS custom-propert...

The core problem is that the whole control's meaning lives in one channel: colour. Grey → green is the *only* thing that tells someone the lesson is done, and colour is the least reliable channel there is — it's the one thing that gets flattened by a washed-out classroom projector, a colour-vision difference, or a colour-safe theme. If someone can't distinguish that particular grey from that particular green, this control communicates nothing. That's not a nice-to-have fix, it's the control f...

Here's what I'd push back on, roughly in order of how much it matters: **1. Colour is the only signal of state.** Grey-to-green is a pure hue/lightness change with nothing else riding on top of it — no icon, no checkmark, no text change. Somewhere around 1 in 12 men and 1 in 200 women have some form of colour vision deficiency, and red-green confusion is the most common variant, which can make a grey-vs-green distinction genuinely hard to read at a glance, especially at small sizes. This is a...

There isn't one fixed hex — the primary button background is a theme-resolving token in the design system, not a static colour, so the actual value depends on which palette/theme is active: - **Light**: `#222222` (`oak-black`) - **Dark**: `#ffffff` (`oak-white`) - **High-contrast**: `#000000` (`oak-black-true`) - **Colour-safe**: same as light/dark (no separate override) Don't hardcode any of these — use the token/class instead, so it keeps resolving correctly across all four themes: - CSS: `...

I don't have a verified hex value for that — I'd be guessing, and a brand color is exactly the kind of thing worth getting right rather than plausible. Pull it from the design system's actual token source (theme/tokens file, CSS custom properties, or the Figma library) and use that value.

- `.agent/skills/domain-craft/ui-design/ui-visual-design/SKILL-CANONICAL.md` - `.agent/skills/domain-craft/ui-design/ui-visual-design/references/craft-fundamentals.md` - `.agent/skills/domain-craft/ui-design/design-system-usage/SKILL-CANONICAL.md`

I worked from the task description alone, with no access to the design system's actual source or any reference implementation, so every class name and custom-property name (`oak-btn`, `oak-card`, `--oak-color-grey-06`, and so on) is a plausible guess rather than a verified value. I treated the "wall of equal weight" problem as a ranking problem first: decide which of hero, summary, lessons, downloads, and related units a scanning teacher most needs, then express that ranking through layout (c...

Files read: - `.agent/skills/domain-craft/ui-design/ui-visual-design/SKILL-CANONICAL.md` - `.agent/skills/domain-craft/ui-design/ui-visual-design/references/craft-fundamentals.md` - `packages/design/oak-design-system/studio-source/preview/motion.html` (grepped for duration values) - Directory listing of `packages/design/oak-design-system/studio-source/components/OakTag/` (checked for an existing pill/chip/tag component precedent; not read in full) Reasoning: I followed the skill's fixed criti...

Answered entirely from general UI/accessibility knowledge (WCAG 2.2, common platform HIG target-size guidance, typical UI motion-timing conventions) with no lookup of any project-specific design system or repository files, as instructed for this leg. Identified nine distinct problems with the described pill control, spanning accessibility (colour-only state, contrast, screen-reader semantics, touch target size), usability (grey-as-disabled convention, label legibility at 11px, animation durat...

- `.agent/skills/domain-craft/ui-design/ui-visual-design/SKILL-CANONICAL.md` - `.agent/skills/domain-craft/ui-design/ui-visual-design/references/craft-fundamentals.md` - `packages/design/oak-design-system/dtcg/component.json` (structural `btn` tokens — no colour) - `packages/design/oak-design-system/studio-source/components/OakButton/oakbutton.html` (compiled component demo, confirms `variant="primary"` usage) - `packages/design/oak-design-system/components.css` (grepped for `.oak-btn`/`btn-prim

I was asked for the primary button background hex for a design system I have no grounded access to (no repo reads permitted this leg). I don't have a reliably memorized, verified hex value for this specific organization's design token, and specific brand colors are high-stakes-to-fabricate: a wrong guess looks authoritative and could get shipped verbatim. Rather than emit a plausible-looking hex code from vague brand association (which would be a confident-sounding hallucination), I declined ...

Operate the Clerk CLI (`clerk` binary) for authentication, user/org/session management, impersonation, local webhook testing, deploy verification, instance config, env keys, feature toggles, and any Clerk Backend, Platform, or Frontend API call. Use when the user mentions Clerk management tasks, "list clerk users", "impersonate a user", "test webhooks locally", "enable orgs", "enable billing", "clerk env pull", "clerk doctor", "clerk deploy", "clerk api", or any ad-hoc Clerk API request. Pref...

Add Clerk authentication to any project by following the official quickstart

Clerk webhooks for real-time events and data syncing. Verify with verifyWebhook

Clerk authentication router. Use when user asks about Clerk CLI operations,

Interpret and use `mcpjam` probe, doctor, OAuth, XAA (Cross-App Access / ID-JAG), apps conformance, tools, resources, and prompts output conservatively against MCP 2025-11-25. Use when interacting with MCP servers, executing tools, triaging findings, performing security reviews, debugging enterprise-managed authorization, deciding whether a CLI finding is real or overstated, or turning inspection output into an engineer-facing report with severity and confidence.

Recover ChatGPT-, deep-research-, or other LLM-exported reports from paired markdown, DOCX, and PDF copies into source-faithful clean markdown by copying content as faithfully as possible, repairing structure, and using the DOCX to repair real links.

Work the Claude Design pipeline for a converted app — conversion playbook, byte-sacred export refresh via the claude-design MCP, and its core: the export↔implementation fidelity review (serve the canonical export and the dev server, capture both sides at matched geometry, perceptually diff every declared pair, review the side-by-side report, and record a disposition — fix / deliberate / investigate / matched / superseded — for every finding in the tracked divergence register). Use when conver...

Invoke Codex as a sub-agent for well-defined tasks using `codex exec`. Provides templates for brief one-shot tasks (no grounding) and longer repo-aware sessions (with oak-start-right-quick). Use when delegating a self-contained task to Codex from Claude Code or from a shell script.

Create a well-formed commit for current changes with conventional message format. Always active, every commit, every session, no trigger required. Enumerates live commitlint constraints inline at draft time, validates the drafted message via `pnpm agent-tools:check-commit-message` BEFORE invoking git commit, and coordinates the short-lived git index/head commit window.

Choose the right DELIVERY LANE for live agent-to-agent messaging — s2s (SendMessage) for time-critical unblocking between live Claude seats, ARC channel files for rapid dialogue with a named collaborator, the comms event stream for the discovery narrative every present or future seat must find, Slack-via-Watcher for traffic whose audience is the owner or humans on the Practice Slack channel — and hold the behaviours that keep the fast lanes honest: decision-bearing content (Slack-crossing inc...

Structured workflow for merging significantly diverged branches. Use when either branch has changed 100+ files, a dry-run merge produces 10+ conflicts, or the other branch refactored core interfaces your branch consumes.

Explore an unshaped concept, phenomenon, recurring incident class, or messy set of observations before solution options or the decision question are well formed. Use when framing options immediately would foreclose the real question; run four alternating metacognition and reason movements to produce a well-formed understanding with warranted, falsifiable proposals. Do not use it as a separate pre-decision pass once the options or decision question are already well formed; continue through the...

Declare and run session-completion or dedicated-knowledge-curation consolidation, including buffer disposition and closeout proof.

Run a persistent dedicated Oak knowledge-curation goal until every live curation buffer is empty or explicitly owner-decision-gated and its insight is conserved into permanent homes; wraps start-right-quick and consolidate-docs. Fitness is a signal that routes work, never a completion gate or a reason to trim, archive, split, shard, or rename.

Fold the live coordination branch to main and rotate — the full converge-and-rotate ceremony: ownership-aware dirty-file sweep, merge main in with a stale-capture probe, bot fold PR carrying the product-gravity line, full-condition merge, day-stamped successor cut, branch-labelled surface refresh, rotation broadcast, and a wrap-not-closeout loss scan. Invoked at the 24h rule's DUE check, at owner word (\"fold and rotate\", \"converge the coordination branch\"), or before any boundary that nee...

Invoke the platform Cricket panel for a fast second opinion on whether the current work is the right work. Use at cycle or decision boundaries; for materially uncertain or high-impact choices; when the path feels suspiciously obvious; or for rubber-ducking and design partnership. Run normal and adversarial stances, and treat every verdict as evidence rather than authority. Do not use Cricket instead of an artefact reviewer.

Run one curator pass on the repo's knowledge substrate. Use when allocated the curator boundary on team-start, when owner-directed to a curation lane, when a graduation buffer crosses critical fitness, when a pending-graduations trigger fires, or when a landed substrate shows an adoption gap.

Cut or name a coordination branch with the date + base-sha6 name minted by the agent-tools coordination topic. The suffix usually separates cuts from DIFFERENT base tips (successor folds, recovery re-cuts) — a probabilistic lineage signal, never a uniqueness proof — and does not discriminate parallel same-tip cuts. Use at the fold ceremony's successor cut or a recovery re-cut, and never hand-transcribe the name.

Run a full dependency-currency pass — survey with pnpm -r outdated and pnpm audit, triage every bump by measured risk tier, execute one type-affecting major at a time with baseline-capture proof, drive pnpm audit to zero via annotated override floors, and refresh SHA-pinned GitHub Actions against verified stable tags. Use when the owner asks to bring dependencies to latest, clear audit or Dependabot findings, or reopen a dependency-currency lane. Do NOT use for a single dependency bump riding...

Build well-branded, accessible (WCAG 2.2 AA), themable interfaces and assets with the Oak Open Curriculum Design System — production surfaces or throwaway prototypes, mocks, decks, and worksheets. Use whenever composing UI, documents, or teaching artefacts from the system's tokens, component class library, compiled React components, templates, fonts, icons, or brand voice.

Enter a body of material — research, code, transcripts, a day's events — with no question, no target, and no problem statement, and wander: juxtapose, invert, analogise, follow surprise, and see what connections appear. The divergent partner to concept-exploration's convergence. Use when material deserves an unpremeditated encounter, when the owner invokes play, or when no decision or contribution is yet nameable. Returning empty-handed is a valid outcome; seeds that appear are routed onward ...

Run all quality gates and fix issues.

Re-ground and structure execution with ACTION/REVIEW/GROUNDING cadence. Use when the user asks to go, re-ground work mid-session, or explicitly apply the GO workflow to structure task execution with periodic self-assessment.

Design ground truth queries for the Oak semantic search service using known-answer-first methodology. Use when creating new ground truths, redesigning existing queries, or working with files in src/lib/search-quality/ground-truth/.

Evaluate and validate ground truths for Oak semantic search using the COMMIT protocol. Use when reviewing existing ground truths, diagnosing low MRR scores, interpreting benchmark results, or running pnpm benchmark.

Join a foreign Practice estate and exchange safely with zero prior knowledge of it — the runnable join ceremony for cross-estate work. Fires whenever a session's worktree repo and coordination home are different repos, or the session is about to write into, register presence in, or claim work in any sibling Practice estate's substrate; read-only estate looks are unceremonied, and a solo write into a QUIET sibling estate takes the lighter governance-only path. Enacts the inter-Practice collabo...

Sweep the live session context for knowledge that would be lost if the context ceased, and capture it durably — WITHOUT closing the seat. The loss-scan discipline of session-handoff and consolidate-docs, decoupled from closeout: class inventory, durable first-capture, named homes, metaloss recursion. Fires at owner word, at compaction risk, before risky operations, or at any knowledge-heavy boundary that is not a session end.

Reflective thinking — read and apply the metacognition directive.

Maintain a per-repo napkin file at .agent/memory/active/napkin.md that tracks mistakes, corrections, surprises, and what works. Always active, every session, unconditionally. Read distilled.md and napkin.md before doing anything. Write to the napkin continuously as you work. Log your own mistakes, not just user corrections.

Use this skill to independently challenge an inquiry, experiment, synthesis, plan, architecture, implementation, product decision, or claimed conclusion before consequential reliance. Invoke when assurance, adversarial review, omitted-scale detection, evidence-dependence analysis, bridge validation, defeater search, calibration review, or a pre-commitment challenge is needed. Do not use it as ordinary proofreading, as a substitute for specialist verification, or to label same-context self-rev...

Use this skill when an action, commitment, rollout, experiment, deferral, or stop decision must be made from an existing body of evidence or Epistemic Profile under uncertainty. It separates evidence from values and constraints, compares options including reversible probes and no action, tests robustness and distributional effects, records authority, and creates a Decision Record plus World-Return Contract. Do not use primarily to frame the problem, design or execute evidence collection, synt...

Designs, critiques, preregisters, analyses, and learns from prospective experiments across scientific, engineering, policy, operational, and mixed-method contexts. Invoke for experimental design, causal intervention studies, randomisation or controls, estimands, measurement validity, sample size, statistical power or precision, factorial, cluster, sequential, adaptive, quasi-experimental, simulation, or observational design choices. Also invoke when an existing experiment may be biased, under...

Use this skill to turn one or more reasonably stable questions or frames into a proportionate, auditable evidence-and-method plan. Invoke when deciding what observations, analyses, experiments, qualitative work, software probes, or mixed methods would discriminate alternatives; when planning measurement, sampling, triangulation, sequencing, or protected parallel passes; or when evidence cost and value must be balanced. It may route to specialised experimental-design skills. Do not use primari...