/* CitePack Decision Map palette — the one home of every colour.
 * Five meanings, one hue family each:
 *   you        → blue   (deep = first, mid = in the top places, pale = read / cited)
 *   another    → gold   (another product came first)
 *   exception  → coral  (something about you is unclear or not offered)
 *   lower      → stone  (you or a kind of tool, lower down)
 *   nothing    → stone stripes (read, no product named) or stone dots (not read)
 * Neutrals are a warm paper stone; the blue is an ink ultramarine, the gold an ochre, the coral a terracotta. */
:root {
  /* stone neutrals */
  --n-0: #ffffff; --n-25: #fbfaf7; --n-50: #f5f3ee; --n-100: #eeebe4; --n-150: #e6e2da; --n-200: #dcd8cf; --n-300: #c7c2b7;
  --n-400: #8d8981; --n-500: #78746c; --n-600: #56534c; --n-650: #45423c; --n-700: #36342f; --n-800: #26241f; --n-900: #16150f;
  /* you: one blue */
  --b-50: #f3f5fe; --b-100: #e6eafc; --b-200: #cdd5f8; --b-300: #a8b5f1; --b-500: #5568df; --b-600: #3c4dc9; --b-700: #2f3eab;
  --b-800: #27328b; --b-900: #1f286a; --b-950: #141a44;
  /* another product: gold */
  --g-50: #fbf7ee; --g-100: #f6edd6; --g-200: #eedfb8; --g-300: #e0c68c; --g-400: #c9a457; --g-500: #9d7419; --g-800: #563d0b; --g-900: #3a2906;
  /* exception: coral */
  --o-50: #fdf4f0; --o-75: #fbe9e1; --o-100: #f7dbcf; --o-200: #eeb9a4; --o-500: #c4532f; --o-800: #792b13;
  --gr-100: #e2f3ea; --gr-600: #17865a; --gr-800: #0f5b3d;
  --r-100: #fce4e4; --r-600: #c83030; --r-800: #851b1b;
  --eng-chatgpt: #0d0d0d; --eng-claude: #d97757; --eng-gemini: #3b82f6; --eng-perplexity: #1f8f9e;
  --brand: #0b8fb0; --brand-soft: #e3f6fa;

  /* surfaces and text */
  --paper: var(--n-50); --card: var(--n-0); --raised: var(--n-25); --sunk: var(--n-100); --hover: var(--n-100); --track: var(--n-150);
  --line: #e6e2da; --line2: var(--n-300);
  --ink: var(--n-900); --ink2: var(--n-800); --muted: var(--n-650); /* text one step darker, Sheen 2026-10-16: "very light" */ --faint: var(--n-400); --on-accent: #ffffff;
  --link: var(--b-700); --link-line: var(--b-300); --navy: var(--b-950);
  --banner-bg: var(--g-50); --banner-ink: var(--g-800); --banner-line: var(--g-200);
  --tint-you: var(--b-50); --tint-info: var(--b-100); --tint-rival: var(--g-50); --tint-exc: var(--o-50);
  --first: var(--b-600); --cited: var(--b-600); --you-mark: var(--b-200);
  --shadow: 0 1px 2px rgba(17, 19, 24, .04), 0 2px 10px rgba(17, 19, 24, .04);

  /* tiles and chips: one step per meaning */
  --first-bg: var(--b-100); --first-ink: var(--b-900); --first-solid: var(--b-700);
  --off: var(--b-200); --off-ink: var(--b-900); --read: var(--b-100); --read-ink: var(--b-900);
  --low: var(--n-150); --low-ink: var(--n-700); --grey: var(--n-150);
  --not: var(--o-100); --not-ink: var(--o-800);
  --none: var(--n-50); --none-ink: var(--n-600); --none-line: var(--n-200);
  /* nothing to show: stripes when the answer was read and named no product, dots when it was not read */
  --hatch: repeating-linear-gradient(135deg, var(--n-150) 0 1.5px, transparent 1.5px 6px);
  --hatch-mk: repeating-linear-gradient(135deg, var(--n-400) 0 1.5px, transparent 1.5px 4px);
  --dots: radial-gradient(circle, var(--n-300) 1px, transparent 1.4px) 0 0 / 6px 6px;
  --dots-mk: radial-gradient(circle, var(--n-500) .9px, transparent 1.2px) 0 0 / 3.5px 3.5px;
  --another: var(--g-200); --another-ink: var(--g-900); --words: var(--g-300);
  --kind: var(--n-150); --kind-ink: var(--n-700);
  --comp: var(--g-500); --comp-soft: var(--g-50); --comp-ink: var(--g-900);
  --ok-bg: var(--gr-100); --ok-ink: var(--gr-800); --ok: var(--gr-600);
  --bad-bg: var(--r-100); --bad-ink: var(--r-800); --bad: var(--r-600);

  /* marks: colour alone carries the meaning, so each holds >= 3:1 on white */
  --mk-first: var(--b-800);   /* 11.0:1 */
  --mk-top: var(--b-500);     /* 4.7:1 */
  --mk-low: var(--n-500);     /* 4.7:1 */
  --mk-exc: var(--o-500);     /* 4.5:1 */
  --mk-none: var(--n-500);    /* hollow mark, outline 4.7:1 */
  --mk-rival: var(--g-500);   /* 4.3:1 */
  --mk-you: var(--b-600);     /* 6.8:1 */
}
