/* Grafe brand tokens, served from hub.grafeauction.com/brand.css to every Grafe tool (tasks, seo, marketing,
   forecast, hub). One source: change a value here and every site that links this file follows.
   Values are the seo.grafeauction.com set (itself from careers.grafeauction.com). Every text color is WCAG AAA
   (7:1 or better) on the backgrounds it is paired with (test/contrast.test.mjs). #378cc9 (--blue) is for rules,
   borders and fills only: it is under 4.5:1 on white, so never text.
   Theme: follows the system setting. A light-only page (printable reports) sets <html data-theme="light">;
   data-theme="dark" forces dark. */
@font-face {
  font-family: "Inter";
  src: url("/fonts/InterVariable.woff2") format("woff2");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

:root {
  --blue: #378cc9;
  --ink: #242b32;
  --muted: #3f4a53;
  --deep: #164f76;
  --deep-hover: #103d5c;
  --pale: #edf4f8;
  --line: #d9e1e7;
  --paper: #fafbf9;
  --card: #ffffff;
  --header: #ffffff;
  --focus: #c25913;
  --orange: #c25913;
  --btn-bg: #164f76;
  --btn-fg: #ffffff;
  --btn2-bg: #ffffff;
  --danger: #8a1414;
  --danger-bg: #fbeceb;
  --warn-fg: #5c3a00;
  --warn-bg: #fdf3e1;
  --ok-fg: #1d4d23;
  --ok-bg: #e9f4ea;
  --hl: #fff6d6;
  --zebra: #f3f7fa;
  --logo-text: #3b3b3c;
  --logo-accent: #378cc9;
  --font: Inter, Arial, "Helvetica Neue", "Noto Sans", sans-serif;
  color-scheme: light;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --ink: #eef2f5;
    --muted: #c5cfd7;
    --deep: #a9d4f3;
    --deep-hover: #cbe5f8;
    --pale: #172734;
    --line: #34495a;
    --paper: #0d151c;
    --card: #14202a;
    --header: #14202a;
    --btn-bg: #a9d4f3;
    --btn-fg: #0b1a26;
    --btn2-bg: #14202a;
    --danger: #ffbdbd;
    --danger-bg: #3a1717;
    --warn-fg: #ffdca0;
    --warn-bg: #33270f;
    --ok-fg: #b9e8bf;
    --ok-bg: #15301a;
    --hl: #2b2a12;
    --zebra: #1a2833;
    --focus: #ff9d5c;
    --orange: #ff9d5c;
    --logo-text: #f2f4f6;
    color-scheme: dark;
  }
}

:root[data-theme="dark"] {
  --ink: #eef2f5;
  --muted: #c5cfd7;
  --deep: #a9d4f3;
  --deep-hover: #cbe5f8;
  --pale: #172734;
  --line: #34495a;
  --paper: #0d151c;
  --card: #14202a;
  --header: #14202a;
  --btn-bg: #a9d4f3;
  --btn-fg: #0b1a26;
  --btn2-bg: #14202a;
  --danger: #ffbdbd;
  --danger-bg: #3a1717;
  --warn-fg: #ffdca0;
  --warn-bg: #33270f;
  --ok-fg: #b9e8bf;
  --ok-bg: #15301a;
  --hl: #2b2a12;
  --zebra: #1a2833;
  --focus: #ff9d5c;
  --orange: #ff9d5c;
  --logo-text: #f2f4f6;
  color-scheme: dark;
}

/* Until header.js loads (or if hub is unreachable) the page's own links inside <grafe-header> still show. */
grafe-header:not(:defined) {
  display: flex; flex-wrap: wrap; gap: 8px 18px; align-items: center;
  padding: 12px 16px; border-top: 4px solid var(--blue); border-bottom: 1px solid var(--line);
  background: var(--header); font: 15px/1.4 var(--font);
}