/* ═══════════════════════════════════════════
   MODULE 2 — Analytical Chemistry · palette
   ═══════════════════════════════════════════

   Loaded AFTER tokens.css and overrides colour only. Structure, the type
   scale, layout and motion all stay shared — a module is its own world in
   how it looks, not in how it is built.

   Module 1 is warm: cream paper, gold accent, a room with a lamp on. This one
   is cool — the light of a laboratory rather than a library, which is what
   analytical chemistry actually looks like. The accent is the same teal the
   platform already gives Module 2 on the home page, so walking from the card
   into the module keeps its colour.

   A NOTE ON THE TOKEN NAMES

   `--gold*` holds teal here, and that reads wrong. The names date from when
   there was one module and the accent really was gold. Renaming them to
   `--accent*` is 150 sites across four stylesheets and is the right fix; it
   was left as a separate decision rather than folded into this file. Until
   then: `--gold` is "the accent that is safe as text", `--gold-ui` is "the
   decorative accent", regardless of hue.  */

[data-module="2"] {
  /* ── Ink / surface (light) ── */
  --ink:       #101a1a;
  --ink2:      #2f3d3c;
  --ink3:      #566564;   /* AA on --paper — measured, not guessed */
  --cream:     #edf2f1;
  --cream2:    #e2e9e8;
  --cream3:    #d0dad9;

  /* ── Accents ──
     --gold is text-safe on light; --gold-ui is decorative only. The split is
     the same one Module 1 makes, and for the same reason: one teal cannot be
     both readable as body text and bright enough for a rule. */
  /* The sidebar is a fixed dark surface in BOTH themes, so these two hold one
     value each and are themed here like everything else. Without the override
     Module 2's sidebar wore Module 1's gold, which is how a teal module ended
     up with a gold wordmark. Measured on the sidebar: 5.50:1 light, 8.79:1
     dark, 4.97:1 on an active nav pill. */

  --accent-rgb: 116,184,182;
  --gold-on-dark: #74b8b6;
  --ink-on-dark:  #9fb0ad;

  /* ── the mind map's four branch hues ──
     The mind map is a DARK panel in both themes, like the sidebar and the
     formula box, so the categorical colours cannot be used on it: --rust,
     --teal and --emerald are calibrated for the cream page and measure
     1.53-2.02:1 there, which is invisible. These four are the dark-theme
     values, held constant in BOTH themes because the surface is. Measured on
     the panel: 4.6:1 at worst, 9.97:1 at best, across all three modules. */
  --mm-1: #74b8b6;  --mm-2: #e09272;  --mm-3: #6cb3d6;  --mm-4: #6fc79a;

  --gold:      #245e5e;   /* text-safe teal */
  --gold-ui:   #4C7A7B;   /* the platform's Module 2 accent, exactly */
  --gold2:     #2d7170;
  --gold3:     #7bb0af;

  /* Categorical, for the dashboard cards. Shifted off Module 1's set so they
     stay distinguishable beside a teal brand accent — a card-teal identical
     to the accent would flatten the grid. */
  --rust:      #9c4b2c;
  --teal:      #2c6785;   /* blue-teal, not the brand's green-teal */
  --emerald:   #226047;

  /* ── Surfaces ── */
  --paper:     #f6faf9;
  --card-bg:   #ffffff;
  --hero-bg:   #eaf1f0;
  --main-bg:   #f6faf9;
  --section-bg:#ffffff;
  --quiz-bg:   #13201f;

  /* ── Lines / shadow ── cool-tinted to match the ground ── */
  --line:      rgba(16,26,26,0.14);
  --line2:     rgba(16,26,26,0.07);
  --shadow:    0 1px 2px rgba(16,26,26,0.05), 0 4px 14px rgba(16,26,26,0.06);
  --shadow2:   0 4px 12px rgba(16,26,26,0.09), 0 18px 48px rgba(16,26,26,0.13);
}

/* Dark is art-directed, never an inversion: light-on-dark accents need
   RAISING or they sink into the ground. Same rule Module 1 follows. */
[data-theme="dark"][data-module="2"] {
  --ink:       #e9f0ee;
  --ink2:      #c2cecb;
  --ink3:      #91a29f;   /* AA on dark --paper */
  --cream:     #0f1615;
  --cream2:    #17211f;
  --cream3:    #232f2d;

  --gold:      #74b8b6;   /* raised for light-on-dark */
  --gold-ui:   #58989a;
  --gold2:     #67a9a8;
  --gold3:     #a2d3d1;

  --rust:      #e09272;
  --teal:      #6cb3d6;
  --emerald:   #6fc79a;

  --paper:     #0b1211;
  --card-bg:   #141d1c;
  --hero-bg:   #101817;
  --main-bg:   #0b1211;
  --section-bg:#131c1b;
  --quiz-bg:   #070d0c;

  --line:      rgba(233,240,238,0.13);
  --line2:     rgba(233,240,238,0.07);
  --shadow:    0 1px 2px rgba(0,0,0,0.4), 0 4px 14px rgba(0,0,0,0.3);
  --shadow2:   0 4px 12px rgba(0,0,0,0.45), 0 18px 48px rgba(0,0,0,0.55);
}