/* ---------------------------------------------------------------------------
   tokens.css — the ONLY file in this project allowed to contain a color value.
   Components reference the custom properties; if the brand changes, this file
   changes and nothing else moves.

   Brand values are quoted from flop.finance's own inline stylesheet, which
   annotates them as Logo & Usage Standards V1.0. The usage rule ships with the
   value: the accent is spent on interactive things — links, the one primary
   button per screen, your own rows in the feed — and nowhere else.
--------------------------------------------------------------------------- */

:root {
  color-scheme: dark;

  /* ---- brand · locked (flop.finance V1.0) ---- */
  --base:   #0A1128;   /* the ground */
  --ice:    #F5F7FA;   /* the word mark, and primary text */
  --accent: #00B4D8;   /* links + the primary action — nothing else */
  --ink:    #041018;   /* text ON the accent (7.8:1) */

  /* ---- surfaces · derived by tinting toward the navy, never neutral grey ---- */
  --card:   #0F1733;                       /* panel surface */
  --card-2: #141D3D;                       /* hover / elevated / header behind blur */
  --well:   rgba(148, 170, 214, 0.055);    /* sub-surface inside a panel */
  --edge:   rgba(148, 170, 214, 0.14);     /* every hairline border */
  --edge-2: rgba(148, 170, 214, 0.26);     /* hover / focus border */

  /* ---- text ramp (measured on both --base and --card) ---- */
  --t1: #F5F7FA;   /* 17.4:1 AAA — headings, values, must-read */
  --t2: #9AA9C4;   /*  7.9:1 AAA — body copy, the guidance layer */
  --t3: #7285A6;   /*  5.0:1 AA  — micro-labels, captions, seq numbers */

  /* ---- semantic states · additions FLOP's palette does not carry ---- */
  --ok:        #4ADE80;                      /* 10.7:1 AAA */
  --ok-bg:     rgba(74, 222, 128, 0.09);
  --ok-line:   rgba(74, 222, 128, 0.30);
  --warn:      #FBBF24;                      /* 11.2:1 AAA */
  --warn-bg:   rgba(251, 191, 36, 0.09);
  --warn-line: rgba(251, 191, 36, 0.30);
  --bad:       #FF6B6B;                      /*  6.7:1 AA */
  --bad-bg:    rgba(255, 107, 107, 0.09);
  --bad-line:  rgba(255, 107, 107, 0.30);
  --acc-bg:    rgba(0, 180, 216, 0.09);
  --acc-line:  rgba(0, 180, 216, 0.30);

  /* ---- effects ---- */
  --glow:        rgba(0, 180, 216, 0.055);
  --shadow-card: inset 0 1px 0 rgba(255, 255, 255, 0.03),
                 0 20px 44px -30px rgba(0, 0, 0, 0.7);
  --focus-ring:  rgba(0, 180, 216, 0.35);
  --overlay:     rgba(10, 17, 40, 0.82);

  /* ---- type ---- */
  --mono: "Space Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  --sans: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
}