/* ==========================================================================
   PIT — design tokens.

   The ONLY place where a colour, font stack or spacing value is defined.
   No colour literal belongs in a template or in another stylesheet.

   Source: the PENSADOR corporate identity (pensador-brand skill), summarised in
   CLAUDE.md. Do not invent values.
   ========================================================================== */

:root {
  /* ---- Colours -------------------------------------------------------- */
  --p-gold: #8e774d;        /* primary accent: logo circle, table headers, buttons */
  --p-gold-light: #e4c385;  /* light accent surfaces */
  --p-gold-warm: #e1b285;   /* chart colour */
  --p-black: #000000;       /* body text, headings */
  --p-gray: #898989;        /* secondary text, metadata */
  --p-gray-light: #e7e6e6;  /* alternating table rows, rules */
  --p-white: #ffffff;       /* background — always white, never tinted */
  --p-blue-gray: #8189a4;   /* chart colour */
  --p-teal: #7ea5a5;        /* chart colour */
  --p-steel-blue: #7993a5;  /* chart colour */

  /* Derived surfaces. Kept as tokens so no template mixes its own shade.
     Both are barely-there golds used for hover and highlight only. */
  --p-gold-tint: #faf8f5;
  --p-gold-tint-strong: #faf3e8;

  /* Chart palette, in the order it must be used. */
  --p-chart-1: var(--p-gold);
  --p-chart-2: var(--p-blue-gray);
  --p-chart-3: var(--p-teal);
  --p-chart-4: var(--p-gold-light);
  --p-chart-5: var(--p-gold-warm);
  --p-chart-6: var(--p-steel-blue);

  /* ---- Typography ----------------------------------------------------- */
  /* Both families are system fonts. No webfont is loaded — that would mean a
     runtime CDN request, which is forbidden, and it is unnecessary. */
  --p-font-serif: "Palatino Linotype", "Palatino", Georgia, serif;
  --p-font-sans: Arial, "Helvetica Neue", Helvetica, sans-serif;

  --p-size-h1: 26px;
  --p-size-h2: 19px;
  --p-size-h3: 15px;
  --p-size-body: 13px;
  --p-size-table: 12px;
  --p-size-small: 11px;
  --p-size-tiny: 10px;

  --p-line-body: 1.45;

  /* ---- Spacing -------------------------------------------------------- */
  --p-space-1: 4px;
  --p-space-2: 8px;
  --p-space-3: 12px;
  --p-space-4: 16px;
  --p-space-5: 22px;
  --p-space-6: 30px;

  /* ---- Shape and layout ----------------------------------------------- */
  --p-radius: 3px;
  --p-radius-card: 4px;
  --p-border: 1px solid var(--p-gray-light);
  --p-sidebar-width: 216px;

  /* Logo protection zone: at least the height of the gold circle around the
     logo on every side (pensador-brand skill). */
  --p-logo-width: 150px;
  --p-logo-guard: 18px;
}
