/* efelle color. A near-black and gray neutral base with one accent.
   Deliberately narrow. Restraint is the point. */
:root{
  /* Neutrals */
  --black:#1D1D1F;      /* primary text, dark surfaces, headings */
  --gray-1:#3A3A3C;     /* body text on light backgrounds */
  --gray-2:#6E6E73;     /* secondary text, ledes, captions */
  --gray-3:#AEAEB2;     /* muted, disabled, placeholder. NOT for body copy */
  --gray-4:#D2D2D7;     /* borders, dividers, rules */
  --gray-5:#F5F5F7;     /* card fills, section bands, background tints */
  --white:#FFFFFF;

  /* Accent. Emphasis only, under 5% of pixels in any view.
     Never body text. Never a large background fill. */
  --orange:#F56300;
  --orange-hover:#D65600;
  --orange-dim:rgba(245,99,0,0.08);
  --orange-ring:rgba(245,99,0,0.12);

  /* Status */
  --green:#32D74B;      /* success only */
  --red:#D93025;        /* error text only */

  /* Data visualization ONLY. Never UI chrome, buttons, links, text.
     In charts: orange = the reader's own data. Teal = everything else. */
  --teal-deep:#2E5665;
  --teal-mid:#328A92;
  --teal-light:#6FE0D6;

  /* On dark surfaces */
  --on-dark-1:#FFFFFF;
  --on-dark-2:#D2D2D7;
  --on-dark-3:rgba(255,255,255,0.60);
  --on-dark-4:#B0B0B5;               /* body copy inside dark cards */
  --hairline-dark:rgba(255,255,255,0.10);

  /* The signature dark gradient. Dark blocks are never flat black:
     near-black through a warm ember. */
  --grad-dark:linear-gradient(160deg,#0a0a0a 0%,#1D1D1F 55%,#2a1500 100%); /* @kind color */

  /* The signature orange bloom. Radial glow offset top right of a dark hero.
     Atmosphere, not a shape. */
  --bloom:radial-gradient(circle,rgba(245,99,0,0.15) 0%,transparent 70%); /* @kind color */
}