# CSS Reduction — Candidate Queue

Atomic removals to try, in priority order. Each is one revertable unit
(edit one file, revert if pixel-identical or project checks regress).

Priority legend: **H** (high confidence, no visible effect expected),
**M** (medium, may affect pixels in edge cases), **L** (low, will likely
revert because it changes visible output).

| # | priority | id | what | where | expected | notes |
|---|----------|----|------|-------|----------|-------|
| 1 | H | `var-surface-line-soft` | drop the `--surface-line-soft` declaration | `src/index.css` line 77 | ~30 B | Only mentioned in a comment in `BarChart.tsx`; no `var(--surface-line-soft)` ref anywhere |
| 2 | H | `var-m-error-bg` | drop the `--m-error-bg` declaration | `src/index.css` line 102 | ~30 B | No `var(--m-error-bg)` ref anywhere in src |
| 3 | H | `kf-fade-in-soft` | drop `fade-in-soft` keyframe + `animate-fade-in-soft` util | `tailwind.config.js` | ~150 B | `animate-fade-in-soft` is not used in any source file |
| 4 | H | `kf-slide-in-right` | drop `slide-in-right` keyframe + animation | `tailwind.config.js` | ~180 B | `animate-slide-in-right` not used |
| 5 | H | `kf-ticker-blink` | drop `ticker-blink` keyframe + animation | `tailwind.config.js` | ~200 B | `animate-ticker-blink` not used |
| 6 | H | `kf-accordion-down` | drop `accordion-down` keyframe + animation | `tailwind.config.js` | ~150 B | `animate-accordion-down` not used; no accordion in app |
| 7 | H | `kf-accordion-up` | drop `accordion-up` keyframe + animation | `tailwind.config.js` | ~150 B | same as above |
| 8 | H | `media-print` | drop the entire `@media print { ... }` block | `src/index.css` lines 402–446 | ~1 KB | Print not in test matrix; the `display: none` rules apply to aside/header — they don't appear in screenshots anyway. **Risk**: a printed detail drawer would no longer be styled for paper, but no print preview is captured. |
| 9 | M | `body-before` | drop the `body::before` radial gradients (the upper-right accent + top-center softbox) | `src/index.css` lines 147–156 | ~400 B | Subtle background. Likely visible on all screenshots. **Will likely revert.** |
| 10 | M | `body-after` | drop the `body::after` hairline grid | `src/index.css` lines 163–176 | ~450 B | Subtle background grid. Likely visible. **Will likely revert.** |
| 11 | M | `scrollbar` | drop `::-webkit-scrollbar*` rules | `src/index.css` lines 179–195 | ~330 B | Scrollbars only visible when content overflows. Most screenshots are above-the-fold; may not trigger. |
| 12 | M | `nav-active-before` | drop the `::before` accent strip on `.nav-active` | `src/index.css` lines 290–300 | ~180 B | Visible on the active sidebar item. |
| 13 | M | `surface-2` | drop the `.surface-2` class entirely | `src/index.css` lines 266–277 | ~250 B | Used in some components — likely a revert. |
| 14 | M | `focus-visible` | drop the global `:focus-visible` ring | `src/index.css` lines 200–204 | ~90 B | All focusable elements would lose the global ring (but Tailwind focus-visible: utilities still apply). May or may not change pixels. |
| 15 | L | `body-bg-image` | drop the body background-image gradients | `src/index.css` lines 136–139 | ~250 B | **Will revert** — visible. |
| 16 | L | `skip-link` | drop the `.skip-link` class | `src/index.css` lines 303–338 | ~700 B | Component exists (`ui/skip-link.tsx`). Removing the class breaks it visually. **Will revert.** |
| 17 | L | `drillable` | drop `.drillable` and its hover | `src/index.css` lines 449–461 | ~220 B | Used in `DrillableCell.tsx`. **Will revert.** |
| 18 | L | `row-hover` | drop the `.row-hover` hover state | `src/index.css` lines 379–384 | ~100 B | Used in tables. Hover state not captured (no mouse). Could be safe. |

## Out of scope (intentionally not tried)
- Tailwind preflight (`*, ::before, ::after`, `::backdrop` with `--tw-*` vars). These power the utility system; removing would break all utilities.
- `@media (prefers-reduced-motion)`. Safety block, removing would change behavior in non-default OS settings.
- Specific custom class definitions that are heavily used (`.num`, `.display`, `.mono`, `.surface`, `.eyebrow`, `.editorial`).
- Any Tailwind utility removal in component `className` props (small wins, lots of churn — would be done in a follow-up pass).
- The `index.html` Google Fonts `<link>` (it's HTML, not CSS, and removing it would change the rendered output).

## Stopping conditions
- Queue exhausted.
- 5 consecutive candidates fail the **size** check (CSS not smaller after the change).
- 2 hours elapsed in Phase 3.
- User requests a stop.