/* enkali · Color tokens
   Teal primary · Ink for text · Lime as pinpoint accent ("the lit block").
   Base palette is from the brand guidelines (v2). Semantic state colors for
   danger/warning are DERIVED to harmonize with the palette — see readme.md. */
:root {
  /* ---- Brand core ---- */
  --enkali-teal: #11A697;       /* Primary — buttons, links, brand, active */
  --enkali-teal-dark: #0C7E73;  /* Hover / pressed teal */
  --enkali-ink: #16273B;        /* Wordmark + headings + numbers */
  --enkali-lime: #8AC640;       /* Accent — the "lit unit", success */

  /* ---- Tints & surfaces ---- */
  --teal-tint: #E4F5F2;   /* soft teal wash */
  --lime-tint: #EFF7E1;   /* soft lime wash */
  --surface: #F4F6F7;     /* app/page background */
  --white: #FFFFFF;

  /* ---- Neutrals ---- */
  --slate: #3D4A57;   /* secondary text */
  --muted: #6B7785;   /* tertiary / captions */
  --line: #E6EAEC;    /* hairline borders */

  /* ---- Derived state colors (not in brand spec — harmonized) ---- */
  --danger: #E5535B;
  --danger-tint: #FCE9EA;
  --warning: #E0A52E;
  --warning-tint: #FBF1DC;
  --info: var(--enkali-teal);

  /* ---- Semantic aliases ---- */
  --color-primary: var(--enkali-teal);
  --color-primary-hover: var(--enkali-teal-dark);
  --color-primary-press: #0A6B62;
  --color-accent: var(--enkali-lime);

  --text-strong: var(--enkali-ink);
  --text-body: var(--slate);
  --text-muted: var(--muted);
  --text-on-primary: var(--white);
  --text-link: var(--enkali-teal);

  --surface-page: var(--surface);
  --surface-card: var(--white);
  --surface-subtle: var(--teal-tint);
  --surface-accent: var(--lime-tint);
  --surface-inverse: var(--enkali-ink);

  --border-subtle: var(--line);
  --border-strong: #CFD6DB;
  --border-focus: var(--enkali-teal);

  --success: var(--enkali-lime);
  --success-tint: var(--lime-tint);

  /* Focus ring */
  --ring: 0 0 0 3px rgba(17, 166, 151, 0.30);
}