# style.melon.tips

> The melon.tips design system. One source of truth for tokens, type, and
> components, imported by every host (production, test, style).

melon.tips is a single-operator watermelon site: half produce-aisle advice,
half hobbyist research lab. Icebox watermelons, Northeast growing, smart
picking, and a logged "DB" of melons (photos, audio, acoustic metrics, Brix).

## Voice for agents writing copy here
- Lowercase brand always: "melon.tips", even sentence-initial.
- Sentence case for titles/headings/buttons. Never Title Case.
- Second person ("you"). Numeric and specific ("around $100", "0-20 Brix").
- Hedge confidently; refuse false certainty.
- 🍉 is the only emoji, used as punctuation. No other emoji, no icon fonts.

## Resources
- /tokens.json: machine-readable design tokens (color, type, shape, rules)
- /version.json: deployed version (git tag + commit + build time)
- /css/tokens.css: the canonical token definitions
- /css/base.css: components built on those tokens
- /: the rendered style guide (canary; if it errors, the system is broken)

## Hard rules (do not violate)
1. Lowercase brand always.
2. System Arial only; no webfonts. Flag any font swap.
3. No invented CTA color. Pills only; white-on-dark / green-on-light.
   Red (#d94c4c) is a garnish, never a button.
4. Do not replace 🍉 with generic icons (no Lucide/Heroicons/Feather).
5. Do not draw new SVG illustrations; use the mark, photos, or placeholders.
6. Hedge confidently.

## Known gaps
- DB pages depend on a live PocketBase API (https://pb.bbbuds.com).