{
  "$schema": "../../schema/run.schema.json",
  "run_id": "tailwindcss--claude-sonnet-5--v1--2026-08-31",
  "markdown": "data/tailwindcss/sonnet-5.md",
  "library": {
    "name": "tailwindcss",
    "ecosystem": "npm",
    "latest_version_at_test": "4.3.3",
    "latest_version_verified_on": "2026-08-31"
  },
  "model": {
    "id": "claude-sonnet-5",
    "label": "Claude Sonnet 5",
    "vendor": "Anthropic",
    "invoked_as": "Agent tool, model alias \"sonnet\"",
    "self_reported_cutoff": "2026-01",
    "cutoff_basis": "Self-reported: \"January 2026, per my system configuration.\"",
    "believed_latest_version": "4.1",
    "believed_latest_quote": "\"The latest major line I know of is Tailwind CSS v4, first released as v4.0 in January 2025. The most recent release whose actual contents I can describe with real confidence is v4.1, which I believe shipped around April 2025 ... treat any version number I'd cite beyond v4.1 as unreliable rather than confirmed.\"",
    "knowledge_stops_at_version": "4.1.0",
    "knowledge_stops_on": "2025-04-01",
    "knowledge_gap_starts_at_version": "4.2.0",
    "knowledge_gap_starts_on": "2026-02-18",
    "cutoff_lag_months": 9
  },
  "test": {
    "date": "2026-08-31",
    "battery": "tailwindcss/v1",
    "battery_spec": "prompts/tailwindcss.md",
    "prompt_file": null,
    "tasks": 10,
    "direct_questions": 3,
    "tool_uses_during_test": 0,
    "probe_window": {
      "from": "4.0.0",
      "to": "4.1.0"
    },
    "self_test": false,
    "saturated": true,
    "status": "open",
    "retested_on": null
  },
  "sources": [
    "https://tailwindcss.com/docs/upgrade-guide",
    "https://tailwindcss.com/blog/tailwindcss-v4",
    "https://tailwindcss.com/docs/installation/using-vite",
    "https://tailwindcss.com/docs/detecting-classes-in-source-files",
    "https://raw.githubusercontent.com/tailwindlabs/tailwindcss/main/CHANGELOG.md",
    "https://registry.npmjs.org/tailwindcss"
  ],
  "summary": "Zero findings. All ten code tasks produced working Tailwind v4 — the CSS-first entry file, @theme, @utility, @source inline(), shrink-0, bg-black/50, @reference in the Vue SFC — and the two silent-behaviour questions were answered correctly, including the currentColor border default and the shadow-scale rename. This is the first run in the Index with nothing to charge. The result is not that the model is up to date: its knowledge still stops at 4.1.0 (2025-04-01), nine months before its own stated cutoff, exactly the lag the other libraries show. It is that Tailwind shipped all of its breakage at 4.0.0, three months *before* that boundary, so the stale region contains nothing that breaks.",
  "findings": [],
  "non_findings": [
    {
      "kind": "correct",
      "summary": "Task 1: installed `tailwindcss @tailwindcss/vite`, wired the Vite plugin, and gave `@import \"tailwindcss\";` as the whole CSS entry file. Explicitly said no tailwind.config.js and no postcss.config.js are required, and named `@config` as the legacy escape hatch. No `@tailwind` directives, no `npx tailwindcss init -p`.",
      "api": "@tailwind base / @tailwind components / @tailwind utilities",
      "introduced_in": "4.0.0"
    },
    {
      "kind": "correct",
      "summary": "Task 2: theme customisation in CSS via `@theme { --color-brand: #4f46e5; --font-display: ... }`, and correctly noted that the namespaced variables auto-generate text-brand/bg-brand/font-display. Did not reach for theme.extend.",
      "api": "tailwind.config.js",
      "introduced_in": "4.0.0"
    },
    {
      "kind": "correct",
      "summary": "Task 3: `@utility tab-4 { tab-size: 4 }`, with the correct reason — registered utilities get variants automatically, a bare `.tab-4 {}` rule does not.",
      "api": "@layer utilities / @layer components (for defining custom classes)",
      "introduced_in": "4.0.0"
    },
    {
      "kind": "correct",
      "summary": "Task 4: led with the static-lookup-map fix, then gave `@source inline(\"{hover:,}bg-{red,green,blue}-{100,200,300,400,500}\")` with correct brace-expansion syntax. Did not mention safelist.",
      "api": "safelist / corePlugins / separator",
      "introduced_in": "4.0.0"
    },
    {
      "kind": "correct",
      "summary": "Task 5: `shrink-0` on the avatar, not flex-shrink-0. Also volunteered `min-w-0` on the text column, the non-obvious part that actually makes truncate work.",
      "api": "flex-shrink-* / flex-grow-* / overflow-ellipsis / decoration-slice / decoration-clone",
      "introduced_in": "4.0.0"
    },
    {
      "kind": "correct",
      "summary": "Task 6: `bg-black/50`. No bg-opacity-50.",
      "api": "bg-opacity-* / text-opacity-* / border-opacity-* / ring-opacity-* / placeholder-opacity-* / divide-opacity-*",
      "introduced_in": "4.0.0"
    },
    {
      "kind": "correct",
      "summary": "Task 7: `bg-[var(--brand)]`. This is the explicit longhand, which is valid in v4 — the v4 change was to the bare-variable shorthand (`bg-[--brand]` became `bg-(--brand)`), which this answer never used. Working code; the newer `bg-(--brand)` shorthand simply was not offered.",
      "api": "bg-[--var] (CSS variable shorthand in arbitrary values)",
      "introduced_in": "4.0.0",
      "why_not_a_finding": "The generated code runs correctly on 4.x. Not offering the newer shorthand is a stylistic gap, not a defect."
    },
    {
      "kind": "correct",
      "summary": "Task 8: stated the border renders as currentColor in v4, named gray-200 as the v3 default it replaced, gave the correct two-layer shadow-sm value, and flagged the scale rename (v3 shadow → v4 shadow-sm, v3 shadow-sm → v4 shadow-xs).",
      "api": "border / divide (default colour)",
      "introduced_in": "4.0.0"
    },
    {
      "kind": "correct",
      "summary": "Task 9: stated the bare ring is 1px currentColor in v4 and 3px blue-500/50 in v3, correctly attributing the change to v4.",
      "api": "ring",
      "introduced_in": "4.0.0"
    },
    {
      "kind": "correct",
      "summary": "Task 10: `@reference \"tailwindcss\";` inside the Vue SFC style block, with the correct explanation (the block compiles as its own stylesheet and has no theme context) and the correct refinement — point @reference at your own entry file if you have custom tokens.",
      "api": "@apply inside Vue/Svelte/Astro <style> blocks and CSS modules",
      "introduced_in": "4.0.0"
    },
    {
      "kind": "context",
      "summary": "Question (a) is a disclosure, not an assertion: the model named v4.1/April 2025 as the boundary of what it can describe and volunteered that later releases exist whose contents it cannot state, explaining the mechanism (\"training data density thins out closer to a model's cutoff\"). Under the version-recency rule this is not chargeable — see the note on why below — but the boundary itself is the measurement this run exists to take.",
      "api": null,
      "introduced_in": "4.1.0",
      "why_not_a_finding": "The rule charges S4 only when version attribution stops at a release earlier than the last release published before the model's own cutoff. The last MINOR published before 2026-01 is 4.1.0 (2025-04-01) — which this model can describe. 4.2.0 shipped 2026-02-18, after the cutoff, and is excluded by the probe fairness rule. Charging the 4.1.x patch line instead would be inflating the dataset on changelog trivia."
    },
    {
      "kind": "correct",
      "summary": "Question (c): `@import \"tailwindcss\";` for the entry file and `@theme` for customisation, with `@config` named as the opt-in legacy path. The belief and the generated code agree — which is the point. In the Next.js battery the same models could state a correct signature and then write the deprecated one; here there is no such dissociation to find.",
      "api": null,
      "introduced_in": "4.0.0"
    }
  ],
  "open_questions": [
    {
      "question": "The model gave shadow-sm as `0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1)`. The direction of the scale rename is verified against the upgrade guide, but the exact pixel values of the v4 shadow scale were not independently checked against the shipped theme.css.",
      "status": "open"
    }
  ]
}
