:root{
  /* Warm grey-green ramp — the ground of the brand */
  --green-950:#141810;
  --green-900:#1D2318;
  --green-800:#2B3325;
  --green-700:#3D4736;
  --green-600:#556150;
  --green-500:#6E7B68;
  --green-400:#8C9885;
  --green-300:#ABB6A3;
  --green-200:#C8D1C1;
  --green-100:#DFE6D8;
  --green-050:#EEF1E9;

  /* Dark grounds — deliberately greyer than the green ramp, so panels read
     as warm grey-green rather than leaf green. */
  --graygreen-900:#1E231A;
  --graygreen-800:#2C3227;
  --graygreen-700:#3E463A;
  --graygreen-300:#ACB3A4;

  /* Paper (warm white) + ink */
  --paper:#F7F5EF;
  --paper-deep:#EDEBE3;
  --paper-card:#FCFBF6;
  --black:#0B0B09;

  /* Accent: neon green-yellow. The only loud colour. */
  --neon-300:#E8FE8E;
  --neon-400:#DCFB55;
  --neon-500:#C8F52F;
  --neon-600:#A8D414;
  --neon-ink:#5E7A08;

  --accent:var(--neon-500);
  --accent-bright:var(--neon-400);
  --accent-deep:var(--neon-ink);
  --accent-veil:rgba(200,245,47,.16);
  --accent-glass:rgba(200,245,47,.34);
  --accent-glass-strong:rgba(200,245,47,.55);
  --accent-glass-dark:rgba(220,251,85,.26);

  /* Semantic text */
  --text-primary:var(--black);
  --text-body:var(--green-800);
  --text-muted:var(--green-600);
  --text-quiet:var(--green-500);
  --text-inverse:var(--paper);
  --text-inverse-muted:var(--graygreen-300);
  --text-accent:var(--neon-ink);
  --text-accent-inverse:var(--neon-400);

  /* Semantic surfaces */
  --surface-page:var(--paper);
  --surface-sunk:var(--paper-deep);
  --surface-card:var(--paper-card);
  --surface-dark:var(--graygreen-900);
  --surface-dark-soft:var(--graygreen-800);
  --surface-hover:rgba(20,23,15,.04);
  --surface-active:var(--accent-veil);

  /* Semantic lines */
  --line-hair:rgba(20,23,15,.14);
  --line:rgba(20,23,15,.22);
  --line-strong:var(--graygreen-900);
  --line-inverse:rgba(247,245,239,.22);
  --line-accent:var(--neon-600);

  --focus-ring:var(--neon-ink);
}

/* ── Bereichsfarben ────────────────────────────────────────────────────────
   Every area carries its own accent. The accents are NEON — luminous, high
   chroma — and the ramps are kept light and airy; only 800/900 go dark enough
   for a header or footer band.

   Apply with data-area="<area>" on any wrapper — every accent token
   re-points and no component needs changing.

     /create   neon green-yellow  the brand default — digital tools
     /make     neon rust orange   oxidised iron, fired clay, hot metal
     /care     neon moss green    growth, repair, responsibility
     /show     neon magenta       stage light, print ink, exhibition
     /sell     neon light blue    paper, contracts, clear numbers
     /explore  neon turquoise     depth, research, the unknown

   Neon has no contrast against warm white, so accent TEXT and focus rings use
   the family's 700 ink tone while the neon itself carries slashes, rules,
   fills and everything on dark grounds.
   ──────────────────────────────────────────────────────────────────────── */
:root{
  /* /make — Neon Rostorange */
  --rust-200:#FFD9C4;
  --rust-300:#FFB48C;
  --rust-400:#FF8A4D;
  --rust-500:#FF6A24;
  --rust-600:#E0521A;
  --rust-700:#8F3714;
  --rust-800:#5E2410;
  --rust-900:#3E180B;

  /* /care — Neon Moosgrün */
  --moss-200:#DCF7C6;
  --moss-300:#BFEF96;
  --moss-400:#9AE566;
  --moss-500:#78D93E;
  --moss-600:#5FB82C;
  --moss-700:#3D7A1E;
  --moss-800:#2A5415;
  --moss-900:#1C390F;

  /* /show — Neon Magenta */
  --plum-200:#FBD2E8;
  --plum-300:#F7A6D1;
  --plum-400:#F277B8;
  --plum-500:#E84FA0;
  --plum-600:#C93B85;
  --plum-700:#8C2459;
  --plum-800:#5F183C;
  --plum-900:#3F0F27;

  /* /sell — Neon Hellblau */
  --sky-200:#CDEEFB;
  --sky-300:#9DDDF7;
  --sky-400:#6BC9F2;
  --sky-500:#3CB4EC;
  --sky-600:#2694C8;
  --sky-700:#186286;
  --sky-800:#10445D;
  --sky-900:#0B2E3F;

  /* /explore — Neon Türkis */
  --petrol-200:#C6F7EE;
  --petrol-300:#93EFDF;
  --petrol-400:#5DE3CB;
  --petrol-500:#2CD6B7;
  --petrol-600:#1CB397;
  --petrol-700:#127464;
  --petrol-800:#0C5046;
  --petrol-900:#08362F;
}

[data-area="make"]{
  --accent:var(--rust-500);
  --accent-bright:var(--rust-400);
  --accent-deep:var(--rust-700);
  --accent-veil:rgba(255,106,36,.14);
  --accent-glass:rgba(255,106,36,.28);
  --accent-glass-strong:rgba(255,106,36,.48);
  --accent-glass-dark:rgba(255,138,77,.30);
  --text-accent:var(--rust-700);
  --text-accent-inverse:var(--rust-300);
  --line-accent:var(--rust-600);
  --focus-ring:var(--rust-700);
  --surface-dark:var(--rust-900);
  --surface-dark-soft:var(--rust-800);
}
[data-area="care"]{
  --accent:var(--moss-500);
  --accent-bright:var(--moss-400);
  --accent-deep:var(--moss-700);
  --accent-veil:rgba(120,217,62,.14);
  --accent-glass:rgba(120,217,62,.28);
  --accent-glass-strong:rgba(120,217,62,.48);
  --accent-glass-dark:rgba(154,229,102,.30);
  --text-accent:var(--moss-700);
  --text-accent-inverse:var(--moss-300);
  --line-accent:var(--moss-600);
  --focus-ring:var(--moss-700);
  --surface-dark:var(--moss-900);
  --surface-dark-soft:var(--moss-800);
}
[data-area="show"]{
  --accent:var(--plum-500);
  --accent-bright:var(--plum-400);
  --accent-deep:var(--plum-700);
  --accent-veil:rgba(232,79,160,.14);
  --accent-glass:rgba(232,79,160,.28);
  --accent-glass-strong:rgba(232,79,160,.48);
  --accent-glass-dark:rgba(242,119,184,.30);
  --text-accent:var(--plum-700);
  --text-accent-inverse:var(--plum-300);
  --line-accent:var(--plum-600);
  --focus-ring:var(--plum-700);
  --surface-dark:var(--plum-900);
  --surface-dark-soft:var(--plum-800);
}
[data-area="sell"]{
  --accent:var(--sky-500);
  --accent-bright:var(--sky-400);
  --accent-deep:var(--sky-700);
  --accent-veil:rgba(60,180,236,.14);
  --accent-glass:rgba(60,180,236,.28);
  --accent-glass-strong:rgba(60,180,236,.48);
  --accent-glass-dark:rgba(107,201,242,.30);
  --text-accent:var(--sky-700);
  --text-accent-inverse:var(--sky-300);
  --line-accent:var(--sky-600);
  --focus-ring:var(--sky-700);
  --surface-dark:var(--sky-900);
  --surface-dark-soft:var(--sky-800);
}
[data-area="explore"]{
  --accent:var(--petrol-500);
  --accent-bright:var(--petrol-400);
  --accent-deep:var(--petrol-700);
  --accent-veil:rgba(44,214,183,.14);
  --accent-glass:rgba(44,214,183,.28);
  --accent-glass-strong:rgba(44,214,183,.48);
  --accent-glass-dark:rgba(93,227,203,.30);
  --text-accent:var(--petrol-700);
  --text-accent-inverse:var(--petrol-300);
  --line-accent:var(--petrol-600);
  --focus-ring:var(--petrol-700);
  --surface-dark:var(--petrol-900);
  --surface-dark-soft:var(--petrol-800);
}