@import url('https://fonts.googleapis.com/css2?family=DM+Serif+Display&display=swap');
/* ============================================================================
   Helios — Meridian v3, FINAL look-and-feel lock.
   This file is the single source of truth for color, type, radius, shadow,
   and spacing. Future build prompts carry data, logic, state, and content
   only. They reference these tokens. They never redefine them.

   Fonts are self-hosted (OFL) under assets/fonts. No CDN: the app runs
   offline. Inter variable for UI, Source Serif 4 variable for the one
   display heading per page.
   ============================================================================ */

/* ----------------------------------------------------------------------------
   Self-hosted variable fonts. Two registers, never more.
   ---------------------------------------------------------------------------- */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url('assets/fonts/inter-latin-variable.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url('assets/fonts/inter-latin-ext-variable.woff2') format('woff2');
  unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Source Serif 4';
  font-style: normal;
  font-display: swap;
  font-weight: 200 900;
  src: url('assets/fonts/source-serif-4-latin-variable.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Source Serif 4';
  font-style: normal;
  font-display: swap;
  font-weight: 200 900;
  src: url('assets/fonts/source-serif-4-latin-ext-variable.woff2') format('woff2');
  unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* Comfortaa: the iQuantile wordmark ONLY. Not for UI, body, or headings. */
@font-face {
  font-family: 'Comfortaa';
  font-style: normal;
  font-display: swap;
  font-weight: 300 700;
  src: url('assets/fonts/comfortaa-latin-variable.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Comfortaa';
  font-style: normal;
  font-display: swap;
  font-weight: 300 700;
  src: url('assets/fonts/comfortaa-latin-ext-variable.woff2') format('woff2');
  unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* IBM Plex Sans: the system font for management surfaces (UI + headings).
   Self-hosted (OFL), weights 400/500/600/700, latin + latin-ext. */
@font-face { font-family: 'IBM Plex Sans'; font-style: normal; font-display: swap; font-weight: 400; src: url('assets/fonts/ibm-plex-sans-400.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'IBM Plex Sans'; font-style: normal; font-display: swap; font-weight: 400; src: url('assets/fonts/ibm-plex-sans-ext-400.woff2') format('woff2'); unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'IBM Plex Sans'; font-style: normal; font-display: swap; font-weight: 500; src: url('assets/fonts/ibm-plex-sans-500.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'IBM Plex Sans'; font-style: normal; font-display: swap; font-weight: 500; src: url('assets/fonts/ibm-plex-sans-ext-500.woff2') format('woff2'); unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'IBM Plex Sans'; font-style: normal; font-display: swap; font-weight: 600; src: url('assets/fonts/ibm-plex-sans-600.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'IBM Plex Sans'; font-style: normal; font-display: swap; font-weight: 600; src: url('assets/fonts/ibm-plex-sans-ext-600.woff2') format('woff2'); unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'IBM Plex Sans'; font-style: normal; font-display: swap; font-weight: 700; src: url('assets/fonts/ibm-plex-sans-700.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'IBM Plex Sans'; font-style: normal; font-display: swap; font-weight: 700; src: url('assets/fonts/ibm-plex-sans-ext-700.woff2') format('woff2'); unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }

/* Bengali face for the platform-wide bn toggle. Self-hosted OFL (no CDN), one
   variable file covering 400-600. The unicode-range is the Bengali block only,
   so Latin glyphs (codes, IDs, figures) keep falling through to IBM Plex even
   when Noto Sans Bengali leads the stack in bn mode. */
@font-face { font-family: 'Noto Sans Bengali'; font-style: normal; font-display: swap; font-weight: 400 600; src: url('assets/fonts/noto-sans-bengali-variable.woff2') format('woff2'); unicode-range: U+0951-0952, U+0964-0965, U+0980-09FE, U+1CD0, U+1CD2, U+1CD5-1CD6, U+1CD8, U+1CE1, U+1CEA, U+1CED, U+1CF2, U+1CF5-1CF7, U+200C-200D, U+20B9, U+25CC, U+A8F1; }

/* ----------------------------------------------------------------------------
   Type families. Two registers for the product (never mix serif into body).
   --font-wordmark is a brand exception, used only for the iQuantile wordmark.
   ---------------------------------------------------------------------------- */
:root {
  --font-ui:       'IBM Plex Sans', system-ui, sans-serif; /* system font, management surfaces */
  --font-display:  'DM Serif Display', serif; /* headings/titles */
  --font-helios:   'Source Serif 4', Georgia, serif;       /* the "Helios" wordmark ONLY */
  --font-wordmark: 'Comfortaa', sans-serif;                /* iQuantile wordmark ONLY */
}

/* bn mode: lead the UI/display stacks with the Bengali face. Bengali glyphs
   bind to Noto Sans Bengali (by unicode-range); Latin stays IBM Plex. Mono and
   the wordmarks are intentionally untouched — codes and brand stay Latin. */
html[data-lang="bn"] {
  --font-ui:      'Noto Sans Bengali', 'IBM Plex Sans', system-ui, sans-serif;
  --font-display: 'Noto Sans Bengali', 'IBM Plex Sans', system-ui, sans-serif;
}

:root{
  /* text */
  --ink:#1A1512; --mid:#6B6560; --faint:#A8A29C;
  /* brand */
  --brass:#D4870A; --alarm:#BD252E;
  /* surfaces */
  --page:#FDFDFC; --surface:#FFFFFF; --hairline:#EDEBE7;
  /* previously-undefined tokens referenced across components: declared so any
     var(--surface-alt)/var(--border)/var(--apollo-mark) reference resolves
     instead of falling back. --apollo-mark is the brass A disc (#C9A84C). */
  --surface-alt:#F7F5F0; --border:#E8E5DD; --apollo-mark:#C9A84C;
  --chrome:#1A1512; --chrome-field:#302A26;
  --brass-tint:#FAF2E4; --alarm-tint:#FCEEEE;
  --row-hover:#FBF8F2; --row-selected:#FCF4E6;
  /* state layers */
  --state-hover:rgba(26,21,18,0.06);
  --state-pressed:rgba(26,21,18,0.10);
  --focus-ring:2px solid #D4870A;
  /* radius */
  --r-card:18px; --r-button:16px; --r-input:14px;
  --r-pill:999px; --r-chip:12px; --r-row:10px;
  /* elevation, the only shadow */
  --shadow-card:0 5px 18px rgba(22,17,14,0.10);
  /* spacing, 8pt grid */
  --s1:4px; --s2:8px; --s3:16px; --s4:24px; --s5:32px;
  /* data viz categorical, v1 */
  --cat-1:#D4870A; --cat-2:#28221E; --cat-3:#A87654;
  --cat-4:#6C787E; --cat-5:#CEBEA2;

  /* --------------------------------------------------------------------------
     RECOVERED TOKEN VOCABULARY (additive — does not redefine any token above).
     The product surfaces were authored against a second token namespace that
     was never declared globally (only partially, inside operations.html). With
     it undeclared, every var(--s-N) / var(--alarm-red) / var(--font-head)…
     reference silently dropped, collapsing spacing, status colour, fonts,
     radii, shadows and motion across the management surfaces. These declare
     that vocabulary once, mapped to Meridian intent, so the surfaces resolve.
     -------------------------------------------------------------------------- */

  /* Fine 4px spacing scale (--s-N = N×4px). Distinct from the canonical
     --s1..--s5 above; used ~1700× across the pages (--s-4 alone 460×). */
  --s-1:4px;  --s-2:8px;  --s-3:12px; --s-4:16px;
  --s-5:20px; --s-6:24px; --s-7:28px; --s-8:32px;
  --s-9:36px; --s-10:40px; --s-12:48px; --s-14:56px; --s-16:64px;

  /* Semantic status colour. House rule holds: warning = brass, positive/
     success = neutral grey (never green), red = severity only. */
  --alarm-red:#BD252E;        --alarm-red-tint:rgba(189,37,46,0.08);
  --alarm-oos:#BD252E;
  --warning:#D4870A;          --warning-tint:rgba(212,135,10,0.10);
  --success:#6B6560;          --success-tint:rgba(107,101,96,0.10);
  --positive-tint:rgba(107,101,96,0.10);
  --muted:#6B6560;
  --brass-light:#E6A94B;
  /* Legacy primary data colour. "Petrol" was the pre-Meridian primary hue;
     the chart engine already maps petrol -> brass (the house "one measure"
     colour), but the data layer still emits var(--petrol)/var(--petrol-dark)
     for series fills. Undeclared, those series rendered INVISIBLE (e.g. the
     donut's dominant Pass arc). Map them to brass so they paint. */
  --petrol:var(--brass); --petrol-dark:#A8690A;
  /* Ink at reduced emphasis (secondary text / overlays). */
  --ink-40:rgba(26,21,18,0.42); --ink-50:rgba(26,21,18,0.55);

  /* Fonts. Headings use the display (IBM Plex Sans) register; mono for codes. */
  --font-head:var(--font-display);
  --font-mono:'IBM Plex Mono', ui-monospace, 'SF Mono', 'Cascadia Code', Menlo, Consolas, monospace;

  /* Radius (tight corner below --r-input). */
  --r-tight:8px;

  /* Elevation companions to --shadow-card: a subtle control lift and a
     stronger float for popovers/tooltips/slide-ins. */
  --shadow-control:0 1px 2px rgba(22,17,14,0.08);
  --shadow-float:0 8px 28px rgba(22,17,14,0.14);

  /* Motion — one timing/easing system (Carbon-style productive easing). */
  --t-fast:120ms; --t-normal:200ms; --t-slow:320ms;
  --ease-out:cubic-bezier(0.2,0,0,1);
  --ease-both:cubic-bezier(0.4,0,0.2,1);

  /* Layering scale (replaces ad-hoc z-index values). */
  --z-base:1; --z-sticky:100; --z-nav:200; --z-overlay:1000;
  --z-modal:1100; --z-toast:1200; --z-tooltip:1300;

  /* Letter-spacing scale (eyebrow tracking was freelanced per page). */
  --track-tight:-0.01em; --track-normal:0; --track-eyebrow:0.06em; --track-caps:0.08em;

  /* Type scale (a defined ramp; sizes were hardcoded ad-hoc per page). */
  --text-xs:11px; --text-sm:12px; --text-base:14px; --text-md:15px;
  --text-lg:18px; --text-xl:22px; --text-2xl:28px; --text-3xl:34px;
  --lh-tight:1.2; --lh-snug:1.35; --lh-normal:1.55;
}

/* ----------------------------------------------------------------------------
   Base. Page field, default ink, UI register.
   ---------------------------------------------------------------------------- */
html, body { margin: 0; padding: 0; }

body {
  font-family: var(--font-ui);
  font-size: 14px;
  line-height: 1.55;
  color: var(--ink);
  background: var(--page);
  font-variant-numeric: tabular-nums;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

/* The one display register. Page title only, one per page. */
.t-display { font-family: var(--font-display); font-weight: 600; }

:focus-visible { outline: var(--focus-ring); outline-offset: 2px; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    transition-duration: 0ms !important;
    animation-duration: 0ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
  }
}
