/* Design tokens — extracted from the old Total Test Prep screencaps (pixel-sampled, not eyeballed).
   Meant to be imported into Claude Design as this project's design system, once,
   at the start of the first session — not re-pasted per page. See design-brief.md
   for the layout/component patterns these values feed into. */

:root {
  /* Color */
  --color-background: #354362;      /* page background, dark slate navy */
  --color-accent: #ff8058;          /* CTA buttons, active nav link, active carousel dot */
  --color-accent-text: #2b2931;     /* text on accent-colored buttons */
  --color-text: #f1e7db;            /* headings AND body copy — same cream, not two colors */
  --color-modal-background: #232830;/* login/signup modal, sits above page background */
  --color-icon-blue-light: #5d9fd1; /* isometric icon illustration gradient, light end */
  --color-icon-blue-dark: #7c8190;  /* isometric icon illustration gradient, dark end */

  /* Course-content category colors — introduced on the schedule page to tell the three parts
     of the curriculum apart at a glance (Language and Logic / Reading Comprehension / Logical
     Reasoning — the same three-way split the dashboard's progress groups use). Not part of the
     original old-PDF palette; a deliberate small addition, muted and cool-toned to sit alongside
     navy/coral/cream without competing with coral's "action" meaning. */
  --color-category-langlogic: #5d9fd1; /* reuses the icon-blue — units 1–2 */
  --color-category-rc: #5fae9e;        /* muted teal — units 3–4, and RC-flagged content in 5–8 */
  --color-category-lr: #9b85c4;        /* muted violet — units 5–8's LR content */

  /* Exercise-type item blocks (a chapter's own exercise, an RC passage, a unit-end part) on the
     schedule page were originally styled with the accent coral, dashed-border. That color is also
     what marks "selected" and "active" state elsewhere on this page (the selected day's outline,
     the active tab), so an exercise block read as already-done/selected at a glance. Swapped for a
     muted, darker amber-brown that still signals "action item" without borrowing the accent's
     selected/active meaning. */
  --color-exercise-accent: #9c7a4a;

  /* Typography — confirmed via the live site's loaded CSS (totaltestprep.com), not guessed.
     Komet is a commercial, self-hosted font (Blaze Type), not on Google Fonts — the actual
     font files live wherever Milan's WordPress site hosts them; Claude Design/Code will need
     those files directly rather than a font-name lookup. */
  --font-heading: "komet-sc", "komet", sans-serif; /* small-caps cut, used for headings/nav/logo */
  --font-body: "komet", sans-serif; /* regular cut, used for body copy */
}