Design tokens + agent iteration hardening

- tokens.css: full token layer (type scale rem-based, palette, spacing, radii)
- App.css rebuilt token-driven; zero hardcoded colors/px font sizes
- readability preset: --root-font-size 112%; button matrix scrolls when narrow
- App.tsx split into real components (Hero, CodeSample, RightRail + reflow)
- light theme via [data-theme=light] overrides; topbar sun/moon toggle persisted
- scripts/check-tokens.mjs + npm run check (lint, token guard, tsc, build)
- AGENTS.md: token contract, check gate, preview workflow

src/components/Button.tsx

@@ -1,9 +1,17 @@
-import type { ReactNode, ButtonHTMLAttributes } from 'react'
+import type { ButtonHTMLAttributes, ReactNode } from 'react'
 
-type ButtonVariant = 'primary' | 'secondary' | 'danger' | 'ghost'
-type ButtonProps = ButtonHTMLAttributes<HTMLButtonElement> & { variant?: ButtonVariant; children: ReactNode }
+export type ButtonVariant = 'primary' | 'secondary' | 'danger' | 'ghost'
+
+type ButtonProps = ButtonHTMLAttributes<HTMLButtonElement> & {
+  variant?: ButtonVariant
+  children: ReactNode
+}
 
 /** Shared action primitive. Visual variants stay in App.css so themes can override them. */
 export function Button({ variant = 'secondary', className = '', children, ...props }: ButtonProps) {
-  return <button className={`button ${variant} ${className}`.trim()} {...props}>{children}</button>
+  return (
+    <button className={`button ${variant} ${className}`.trim()} {...props}>
+      {children}
+    </button>
+  )
 }