# Renderer Contract — Canvas/SVG

## Purpose
Render a grid of DayTiles with mood hue, glow intensity from net habit score, negative overlay static, and glyph counts.

## Inputs
- containerSize: { width: px, height: px, devicePixelRatio }
- days: DayTile[] (ordered by date)
- theme: palette + CSS variables
- options:
  - showLegend: boolean
  - pngScale: number (for export)

## Outputs
- On-screen render at 60 fps target
- Exported PNG at screen resolution (pngScale defaults to 1.0)

## Rules
- Base hue from mood.hue; luminance curve f(netScore) with easing and clamping
- Negative entries: apply subtle static texture overlay (non-hue-altering)
- Glyphs: ticks = count(positive), dots = count(negative)
- No hue change from overlays; only luminance/texture affected

## Performance
- Batch draw tiles; minimize layout/paint; avoid per-frame allocations
- Prefer Canvas for tiles; SVG for glyph overlays and interactive focus rings
- Ensure keyboard focus indicators meet WCAG AA contrast

## Accessibility
- Keyboard navigable tiles (tab/arrow); ARIA labels describing day, mood, counts
- High-contrast theme variant; color-blind palettes via CSS variables