/* Site palette. Every colour on the site comes from these tokens.
   Switch palettes by changing PALETTE in src/lib/theme.ts ("d", "g" or "h").
   The light version of the old site is kept on the `white_site` branch. */

/* D · Blueprint (default) */
:root,
[data-palette="d"] {
  --c-bg: #16335F;
  --c-surface: #1B3C6E;
  --c-ink: #EEF3FA;
  --c-text: #C6D3E6;
  --c-muted: #A3B7D5;
  --c-line: #2E5189;
  --c-line-2: #3B609C;
  --c-accent: #FFB547;
  --c-accent-text: #FFB547;
  --c-accent-tint: rgba(255, 181, 71, 0.18);
  --c-on-accent: #10264A;
  --c-btn-bg: #FFB547;
  --c-btn-fg: #10264A;
  --c-btn-hover: #FFC66F;
  --c-panel: #0E2445;
  --c-panel-line: #24467A;
  --c-panel-text: #DCE5F2;
  --c-panel-muted: #9FB4D3;
  --c-term: #FFB547;
  --c-danger: #FFA196;
  --c-hover: #FFFFFF;
  --c-shadow: rgba(4, 12, 28, 0.55);
  --c-grid: rgba(255, 255, 255, 0.045);
  --c-accent-hover: #FFC66F;
  --c-warn: #F5A524;
  --c-warn-text: #FFD27A;
  --c-bad: #FF7A6B;
  --c-bad-text: #FFA196;
  --c-bad-line: rgba(255, 161, 150, 0.55);
  --c-bad-tint: rgba(255, 122, 107, 0.12);
  --c-tag-problem: #FFA585;
  --c-tag-diagnosis: #FFD27A;
  --c-tag-fix: #9CCBFF;
  color-scheme: dark;
}

/* G · Swiss red */
[data-palette="g"] {
  --c-bg: #FFFFFF;
  --c-surface: #F4F4F2;
  --c-ink: #111111;
  --c-text: #333333;
  --c-muted: #626262;
  --c-line: #E2E2DF;
  --c-line-2: #D3D3CF;
  --c-accent: #E4312B;
  --c-accent-text: #C8231D;
  --c-accent-tint: #FCE3E1;
  --c-on-accent: #FFFFFF;
  --c-btn-bg: #111111;
  --c-btn-fg: #FFFFFF;
  --c-btn-hover: #C8231D;
  --c-panel: #111111;
  --c-panel-line: #2A2A2A;
  --c-panel-text: #DADADA;
  --c-panel-muted: #9A9A9A;
  --c-term: #FF5A52;
  --c-danger: #B42318;
  --c-hover: #000000;
  --c-shadow: rgba(17, 17, 17, 0.3);
  --c-grid: transparent;
  --c-accent-hover: #C8231D;
  --c-warn: #F59E0B;
  --c-warn-text: #78350F;
  --c-bad: #DC2626;
  --c-bad-text: #7F1D1D;
  --c-bad-line: #F3B4AE;
  --c-bad-tint: #FEF2F2;
  --c-tag-problem: #C2410C;
  --c-tag-diagnosis: #A16207;
  --c-tag-fix: #0369A1;
  color-scheme: light;
}

/* H · Ocean and mint */
[data-palette="h"] {
  --c-bg: #0B1E2D;
  --c-surface: #10283B;
  --c-ink: #EAF3F4;
  --c-text: #B9CAD4;
  --c-muted: #93ABBD;
  --c-line: #1F3B52;
  --c-line-2: #2A4A64;
  --c-accent: #5FE3C0;
  --c-accent-text: #5FE3C0;
  --c-accent-tint: rgba(95, 227, 192, 0.16);
  --c-on-accent: #06241D;
  --c-btn-bg: #5FE3C0;
  --c-btn-fg: #06241D;
  --c-btn-hover: #84EBD0;
  --c-panel: #06131E;
  --c-panel-line: #18324A;
  --c-panel-text: #DCE8EC;
  --c-panel-muted: #8FA8BA;
  --c-term: #5FE3C0;
  --c-danger: #FFA196;
  --c-hover: #FFFFFF;
  --c-shadow: rgba(0, 6, 12, 0.6);
  --c-grid: transparent;
  --c-accent-hover: #84EBD0;
  --c-warn: #F5A524;
  --c-warn-text: #FFD27A;
  --c-bad: #FF7A6B;
  --c-bad-text: #FFA196;
  --c-bad-line: rgba(255, 161, 150, 0.55);
  --c-bad-tint: rgba(255, 122, 107, 0.12);
  --c-tag-problem: #FFA585;
  --c-tag-diagnosis: #FFD27A;
  --c-tag-fix: #9CCBFF;
  color-scheme: dark;
}

/* Blueprint grid behind the page (transparent in the other palettes) */
body {
  background-color: var(--c-bg) !important;
  background-image: linear-gradient(var(--c-grid) 1px, transparent 1px), linear-gradient(90deg, var(--c-grid) 1px, transparent 1px);
  background-size: 24px 24px;
}

/* Italic serif accent word in headlines */
.hl-accent {
  font-family: 'Instrument Serif', Georgia, 'Times New Roman', serif;
  font-style: italic;
  font-weight: 400;
  font-size: 1.12em;
  letter-spacing: 0;
  color: var(--c-accent-text);
}

/* Let the blueprint grid show behind inner pages */
.page { background: transparent !important; }