# Immersive

> Category: Bold & Expressive

An exhibit-style interface that blends storytelling and game-like
interaction: a continuous deep-green canvas throughout (not a white system
with green accents), chunky comic-panel outlines on every card, and a
bright magenta pop reserved for badges and highlights.

## Style Foundations

- **Visual style:** bold, high-contrast, exhibit/game-like
- **Canvas:** a deep forest green (`--bg`) runs the whole page. Card
  surfaces (`--surface`) stay in the same dark-green family, just a touch
  lighter — this is a unified dark system, not a light-panel-on-dark-canvas
  mashup, so text stays legible everywhere without a separate "on-card"
  color.
- **Ink:** near-white (`--fg`) for headlines and body text throughout, on
  both the canvas and card surfaces.
- **Accent:** a bright magenta/pink (`--accent`) reserved for badges and key
  highlights — the single "pop" color against the green base.
- **Borders / outline:** a light, near-white outline (`--border`) traces
  every card, button, and badge at a visible 2px weight — the system's
  comic-panel signature, translated to read on a dark surface (a black
  outline, as a print reference might use, would vanish against this
  canvas — the outline has to be light here).
- **Typography:** a bold condensed display face (`--font-display`) for
  oversized headlines; body copy in a clean, readable sans (`--font-body`).

## Colors

- **Background (deep green canvas):** `#0B5C34`
- **Surface (card, same family, lighter):** `#14713F`
- **Foreground / ink:** `#F5FAF6`
- **Muted:** `#B9D6C2`
- **Border (light outline, 2px):** `#F5FAF6`
- **Accent (magenta pop):** `#F062B0`

## Typography

- Display (headlines): Oswald
- Body & UI: a clean sans (e.g. Inter)
- Mono / labels: JetBrains Mono

## Craft notes

- Keep the magenta accent rare (badges, a single key highlight) so it reads
  as a pop, not a second base color.
- The signature outline is always light-on-dark here, at a visible 2px+
  weight, never a soft 1px hairline.