personal-site/public
badbl0cks 0e6d352dca
Rework the CRT raster, glow and flicker effects
The three effects had drifted apart from each other and from the token
system. Consolidate them behind --crt-* tokens and fix what was broken.

- The animated text-shadow silently overrode the static one, so
  reduce-motion users saw a 5px white glow and everyone else a 3px
  currentColor glow. Both now come from one declaration, with the
  aberration offset factored out into --crt-shift.
- Step the aberration instead of tweening it. text-shadow is not
  compositable and this one inherits to every glyph, so the smooth
  version repainted the whole document at refresh rate.
- The flicker was invisible: a near-black tint at an effective alpha of
  0.008-0.096 over a black background, a peak lift of under 2/255.
  Retint with the accent at ~3%.
- Anchor the vignette to the viewport. It was sized to body's box, which
  is document-height, so on long pages the bloom sat off-screen.
- Pin the overlays with position: fixed rather than painting
  document-sized layers, and give the grille hard stops so it is three
  stripes rather than a smooth R->G->B ramp.
- Scale the raster pitch down at >=2dppx, where a 2px scanline is 4
  device px and resamples into moire at fractional DPR.
- Raise --color-mg to oklch(0.62): at 0.5 it was 3.5:1 on the
  background and 1.7:1 over the vignette centre. Halve the vignette
  alpha via its own token, keeping --color-accent-transparent at 50%
  for ProjectCard's glow.

Collapses the two keyframe blocks from 193 lines to 40.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
2026-08-07 17:39:05 -07:00
..
.well-known dev work 2026-07-11 00:11:02 -07:00
parallax new minimal retro theme, progress on parallax hero, refactor into semantic html, 2026-01-04 21:36:24 -08:00
crt.svg dev work 2026-07-11 00:11:02 -07:00
goat.js dev work 2026-07-11 00:11:02 -07:00
hi-res.svg dev work 2026-07-11 00:11:02 -07:00
htmz.dev.js Add GoatCounter count.js component (as goat.js), MIT license logo 2026-03-07 22:38:34 -08:00
htmz.js Add GoatCounter count.js component (as goat.js), MIT license logo 2026-03-07 22:38:34 -08:00
mit.svg Rename content slot to main, remove h1 from header for better 2026-03-22 13:56:24 -07:00
reset.css Modularize CSS; add reset, theme and fonts 2026-02-01 10:08:58 -08:00
rss.css Modularize CSS; add reset, theme and fonts 2026-02-01 10:08:58 -08:00
rss.xsl Modularize CSS; add reset, theme and fonts 2026-02-01 10:08:58 -08:00
style.css Rework the CRT raster, glow and flicker effects 2026-08-07 17:39:05 -07:00
theme.css Rework the CRT raster, glow and flicker effects 2026-08-07 17:39:05 -07:00
unscii-8.ttf Modularize CSS; add reset, theme and fonts 2026-02-01 10:08:58 -08:00
unscii-8.woff Modularize CSS; add reset, theme and fonts 2026-02-01 10:08:58 -08:00
unscii-16.ttf Modularize CSS; add reset, theme and fonts 2026-02-01 10:08:58 -08:00
unscii-16.woff Modularize CSS; add reset, theme and fonts 2026-02-01 10:08:58 -08:00