Operator feedback after PR #111: with only the radial spotlight on
hover, the exact bounds of the interactive surface were unclear —
especially near the edges. Added a subtle 1px ember box-shadow
inset on hover and focus-within (covers .nav-item, .nav-item-bottom,
.nav-item-hover).
Implementation:
- Light: rgba(216, 67, 21, 0.28) — visible but lighter than the
active state's full-saturation ember border (so hover < active
remains readable side-by-side).
- Dark: rgba(255, 138, 80, 0.34) — slightly hotter ember +
bumped alpha for eye-perception correction against deep navy.
- box-shadow inset rather than `border: 1px solid` to avoid the
1px layout shift a real border would cause on toggle.
Tests:
- npm run test:run: 113/113
- npm run lint: clean
- npm run build: green
Co-authored-by: Cursor <cursoragent@cursor.com>
cdb3d6da34