D3 Part 4: docs — .tag/.badge addendum, website CHANGELOG, REPORT

- design-system.md: the .tag (outline+dot, state) vs .badge (filled
  chip, static informational label) distinction the D1 unified view
  left implicit, + a Website (TASK-D3) section (shared site.css,
  self-hosted fonts, external sprite, mask-based CSS marks, ?v=
  cache-busting, site_gates.py enforcement).
- website/CHANGELOG.md created (newest-on-top) with the D3 entry.
- REPORT.md overwritten per §15 (baselines, commits, gate outputs +
  all three red-proofs, 84-problem/182-emoji baseline → 0, contact-form
  freeze proof + live TESZT submission resend id, live checks, the
  narrow-viewport limitation, observations).

documentation/design/design-system.md

@@ -133,6 +133,33 @@ Categorical series (data, not status): cpu `#2EA8F5`, memory `#8E7CE8`, temp `#E
 load `#5EC4B6`. Chrome: tooltip bg `#0F1B2E`, title `#EDF2F9`, body `#94A6BF`, border `#22344F`,
 ticks `#94A6BF`, axis titles `#5E7392`, grid `rgba(34,52,79,.5)`.
 
+## `.tag` vs `.badge` (D3 addendum — resolves the D1 parallel-component drift)
+
+Both exist in the controller; they are distinct components, not variants:
+
+- **`.tag`** — outline + dot; expresses **state** (run/progress/warn/crit/neutral/off). Use it
+  whenever the thing shown can change at runtime: container state, drive activity, health.
+  The dot is part of the semantics (pulsing = in progress, hollow = inert).
+- **`.badge`** — filled chip (dim background, no dot); expresses a **static informational label**:
+  tier names, protocol/type markers (USB, NFS), feature keywords on catalog cards. Nothing about
+  it changes at runtime.
+- If the label has an icon-and-text metadata character ("~512M", "Pi kompatibilis"), prefer
+  **`.metarow`** (no container at all) over either chip.
+- On the website, catalog feature keywords are `.badge`-class chips (filled, 2px, blue-dim) —
+  informational labels, not states.
+
+## Website (TASK-D3)
+
+The seven felhom.eu pages share ONE stylesheet (`website/assets/site.css?v=N`) built on this
+document's tokens: self-hosted fonts (`/assets/fonts/`, no CDN — GDPR), a 70-symbol external
+Lucide sprite (`/assets/icons.svg?v=N#i-name`; feature tiles = `.ico-tile` 48px bg-2 squares),
+the two-tone heading as the brand signature (accent span = solid `--blue-bright`), and
+mask-based ✓/✗ marks for CSS-generated content (sprites can't reach `::before`). Marketing-only
+scale addition: hero H1 up to ~3.5rem/800. Assets are cache-busted with `?v=N` (nginx `expires
+7d`) — bump every reference together. Enforcement: `scripts/site_gates.py` (BOM, emoji=0,
+nav/footer consistency, analytics presence, no-CDN, banned tokens, zero `<style>` blocks,
+cache-busting).
+
 ## Enforcement
 
 The D0 grep gate (all counts must be 0 in `controller/internal/{web,setup}`):