/* tokens.css - Design tokens: colours for the light and dark themes (CSS custom properties). */

:root {
  --bg: #f2f8f5;
  --ink: #0d1f18;
  --mute: #41584d;
  --line: rgba(13,31,24,.18);
  --bd: #5f7a6d;
  --glass: rgba(255,255,255,.75);
  --at: #1f6b50;
  --focus: #0b5cd5;
  --ok: #15803d;
  --or: #1f6b50;
  --h1a: #0d1f18;
  --h1b: #2f7a62;
  --g1: rgba(92,196,155,.28);
  --g2: rgba(76,184,166,.16);
  --p1: rgba(92,196,155,.2);
  --p2: rgba(76,184,166,.09);
  --mini: rgba(255,255,255,.88);
  --navon: rgba(31,107,80,.12);
  --pill: rgba(31,107,80,.08);
  --badge: #ffffff;
  --strap: #419075;
  color-scheme: light;
}

@media (prefers-color-scheme:dark) {
  :root:not([data-theme="light"]) {
    --bg: #07120e;
    --ink: #eaf5ef;
    --mute: #a6bfb4;
    --line: rgba(170,230,205,.16);
    --bd: #628f7d;
    --glass: rgba(255,255,255,.05);
    --at: #8fdcbc;
    --focus: #9ad7ff;
    --ok: #6fd49a;
    --or: #5cc49b;
    --h1a: #f4fbf7;
    --h1b: #a7d7c3;
    --g1: rgba(92,196,155,.26);
    --g2: rgba(76,184,166,.15);
    --p1: rgba(92,196,155,.16);
    --p2: rgba(76,184,166,.07);
    --mini: rgba(8,24,18,.72);
    --navon: rgba(92,196,155,.15);
    --pill: rgba(92,196,155,.09);
    --badge: #10231b;
    --strap: #419075;
    color-scheme: dark;
  }
}

:root[data-theme="dark"] {
  --bg: #07120e;
  --ink: #eaf5ef;
  --mute: #a6bfb4;
  --line: rgba(170,230,205,.16);
  --bd: #628f7d;
  --glass: rgba(255,255,255,.05);
  --at: #8fdcbc;
  --focus: #9ad7ff;
  --ok: #6fd49a;
  --or: #5cc49b;
  --h1a: #f4fbf7;
  --h1b: #a7d7c3;
  --g1: rgba(92,196,155,.26);
  --g2: rgba(76,184,166,.15);
  --p1: rgba(92,196,155,.16);
  --p2: rgba(76,184,166,.07);
  --mini: rgba(8,24,18,.72);
  --navon: rgba(92,196,155,.15);
  --pill: rgba(92,196,155,.09);
  --badge: #10231b;
  --strap: #419075;
  color-scheme: dark;
}
