Act as a senior front-end engineer. Extract design tokens from this {{tech_stack}} project and replace hard-coded values with them. Change how styles are written, not how the site looks, unless I approve a change. 1. Inventory: scan every stylesheet, component and utility class. List each unique color, font size, weight, line height, spacing, radius, shadow, z-index, breakpoint and duration, with how often it appears and in which files. 2. Cluster: group near-duplicates (#1a1a1a and #1b1b1b, 15 and 16px, seven slightly different grays) and propose one value per cluster, noting where a merge will visibly change something. 3. Name, in two layers. Primitives: gray-100 to gray-900, space-1 to space-12 on a 4px base, radius-sm, md, lg and full. Semantic tokens by role: color-text, color-text-muted, color-surface, color-border, color-accent, color-accent-hover, space-section, radius-card, shadow-raised, duration-fast at 150ms, duration-base at 250ms. Our brand colors are {{brand_colors}}; check they map cleanly. 4. Implement in the project's own system: CSS custom properties, or the Tailwind theme if Tailwind is in use, so utilities read from tokens. Give every color token a dark theme slot, even if it's empty for now. 5. Replace values file by file, starting with shared components. List any value you couldn't map instead of forcing it. 6. Guard: add a lint rule or simple check that flags new raw hex values and pixel sizes outside the token files. Verify with screenshots of key pages before and after at 360 and 1280px; anything that shifted must be on the approved list. Finish with the token table and how many hard-coded values were removed.