I read the approved Figma file closely — spacing, type, tokens, states, motion — and build it as a frontend engineer: markup, SCSS, TypeScript behaviour, rendered inside server-side views. Game Center, live standings with home/away toggles, team calendars and playoff views, the club finder, player and team statistics. When a layout would break with real data — long club names, missing logos, deferred games — I resolve it in the spirit of the design, as part of the build.

Umbraco v17 on .NET 10; editors compose pages from Block Grid modules, each a strongly typed Razor view. The frontend is vanilla TypeScript and SCSS — no SPA framework — with BEMIT naming over design tokens as CSS custom properties. Interactivity is progressive enhancement with HTMX: filters, search and pagination swap rendered partials in place, so pages keep working and stay shareable. Live game data flows over SignalR.

Focus states, tab order, ARIA and real contrast aren’t in the Figma file — they’re engineering decisions I make while building, checked against WCAG.

Modules like the sponsor slider ship with a harness: the component mounted in isolation and exercised across its real-world states — sponsor counts, container widths, breakpoints — so behaviour is verified before it ever reaches a page.

Every change runs through plan → work → review. A pre-push hook builds the solution and runs the unit tests; a Playwright end-to-end suite exercises the Game Center flows against the PR’s preview deployment before anything merges.