Risograph Green

---
# Machine-readable tokens (the WHAT). The prose body gives the WHY + the rules.
colors:
  roles_light:
    background: "#FEF7FE"
    foreground: "#165C38"
    card: "#FDFBFD"
    card-foreground: "#165C38"
    popover: "#FEFCFE"
    popover-foreground: "#165C38"
    primary: "#389D65"
    primary-foreground: "#0A1A0F"
    secondary: "#D5ECDF"
    secondary-foreground: "#165C38"
    muted: "#F0F7F3"
    muted-foreground: "#2A6E46"
    accent: "#E0F0E8"
    accent-foreground: "#165C38"
    destructive: "#B91C1C"
    destructive-foreground: "#FFFFFF"
    border: "#C5DDD0"
    input: "#D0E8DA"
    ring: "#389D65"
    success: "#2A9D5C"
    success-foreground: "#000000"
    warning: "#B45309"
    warning-foreground: "#FFFFFF"
    chart-1: "#389D65"
    chart-2: "#2C995E"
    chart-3: "#54AC7C"
    chart-4: "#BAE4CB"
    chart-5: "#165C38"
  palette:
    - { name: "paper-white", hex: "#fef7fe", role: "background" }
    - { name: "paper-white-alt", hex: "#fefafe", role: "background" }
    - { name: "paper-rose", hex: "#fdf3f5", role: "background" }
    - { name: "paper-warm", hex: "#fdfcfb", role: "background" }
    - { name: "brand-green", hex: "#389d65", role: "primary" }
    - { name: "brand-green-alt", hex: "#369c63", role: "primary" }
    - { name: "dark-vibrant-green", hex: "#2c995e", role: "dark-accent" }
    - { name: "ink-green", hex: "#165c38", role: "foreground" }
    - { name: "near-black-green", hex: "#0a1a0f", role: "inverse-foreground" }
    - { name: "light-vibrant-green", hex: "#bae4cb", role: "surface-tint" }
    - { name: "muted-green", hex: "#54ac7c", role: "secondary" }
    - { name: "dark-muted-green", hex: "#227649", role: "dark-secondary" }
    - { name: "light-muted-green", hex: "#a4cfb6", role: "surface-tint" }
    - { name: "warm-grey-green", hex: "#dde5e0", role: "border" }
    - { name: "deep-forest", hex: "#0c1e13", role: "dark-background" }
    - { name: "vivid-green-light", hex: "#5cc48a", role: "dark-primary" }
    - { name: "readable-muted-fg", hex: "#2a6e46", role: "muted-text" }
    - { name: "dark-muted-surface", hex: "#152a1d", role: "dark-muted" }
    - { name: "dark-accent-surface", hex: "#1a3323", role: "dark-accent" }

/* Generated by Identity Forge design kits */
@import url("https://fonts.googleapis.com/css2?family=Barlow%20Condensed:wght@400;500;600;700&family=Space%20Grotesk:wght@400;500;700&family=Space%20Mono:wght@400;700&display=swap");

:root {
  --radius: 0.5rem;
  --font-heading: 'Barlow Condensed', sans-serif;
  --font-sans: 'Space Grotesk', sans-serif;
  --font-mono: 'Space Mono', monospace;
  --background: 300 78% 98%;
  --foreground: 149 61% 22%;
  --card: 300 33% 99%;
  --card-foreground: 149 61% 22%;
  --popover: 300 50% 99%;
  --popover-foreground: 149 61% 22%;
  --primary: 147 47% 42%;
  --primary-foreground: 139 44% 7%;
  --secondary: 146 38% 88%;
  --secondary-foreground: 149 61% 22%;
  --muted: 146 30% 95%;
  --muted-foreground: 145 45% 30%;
  --accent: 150 35% 91%;
  --accent-foreground: 149 61% 22%;
  --destructive: 0 74% 42%;
  --destructive-foreground: 0 0% 100%;
  --border: 147 26% 82%;
  --input: 145 34% 86%;
  --ring: 147 47% 42%;
  --success: 146 58% 39%;
  --success-foreground: 0 0% 0%;
  --warning: 26 90% 37%;
  --warning-foreground: 0 0% 100%;
  --chart-1: 147 47% 42%;
  --chart-2: 148 55% 39%;
  --chart-3: 147 35% 50%;
  --chart-4: 144 44% 81%;
  --chart-5: 149 61% 22%;
  --shadow-sm: 0 1px 2px rgba(22,92,56,0.06);
  --shadow-md: 0 2px 6px rgba(22,92,56,0.08);
  --shadow-lg: 0 4px 12px rgba(22,92,56,0.10);
  --shadow-xl: 0 8px 24px rgba(22,92,56,0.12);
  --gradient-hero: linear-gradient(180deg,#fef7fe 0%,#f5faf7 100%);
  --gradient-brand: linear-gradient(135deg,#389d65 0%,#2c995e 100%);
  --gradient-subtle: linear-gradient(180deg,#fef7fe 0%,#fdfcfd 100%);
  --duration: 150ms;
  --duration-slow: 300ms;
  --ease: cubic-bezier(0.4,0,0.2,1);
  --tracking-tight: 0.02em;
  --tracking-normal: 0.06em;
  --font-weight-heading: 700;
  --font-weight-body: 400;
  --button-radius: 9999px;
  --card-radius: 0rem;
  --input-radius: 0rem;
  --badge-radius: 9999px;
  --border-width: 1px;
  --card-border-width: 1px;
  --input-border-width: 1px;
  --button-border-width: 1px;
  --badge-border-width: 1px;
  --heading-transform: uppercase;