/*
 * palette.css — wissel.net colour palette as Web Awesome tint ramps.
 *
 * Eight colours were supplied by the site owner, plus #FF0000 as the base for
 * the danger variant. Web Awesome derives roughly forty semantic tokens
 * (--wa-color-{variant}-{fill|border|on}-{quiet|normal|loud}) from eleven tint
 * steps per variant, and remaps those roles between light and dark mode by
 * itself -- light mode points fill-quiet at tint 95, dark mode at tint 10. So
 * defining the eleven steps is the whole job; dark mode needs no second table.
 *
 * Steps run 05 (darkest) to 95 (lightest). Values marked ANCHOR are the owner's
 * colours, placed at the step whose target lightness they already match. Every
 * other value is derived in OKLCH: hue held exactly, lightness set by the step,
 * chroma scaled by a bell curve so the extremes desaturate the way pigments do.
 * A derived step is therefore the same colour as its anchor, lighter or darker
 * -- never a new colour.
 *
 * Verified: every ramp is strictly increasing in OKLCH lightness, and each
 * variant clears WCAG AA (4.5:1) against the light ground at steps 05-30 and
 * against the dark ground at steps 60-95.
 */
:root {

  /* brand — hue 238°, anchored on Blue Fusion + Baltic Sea */
  --wa-color-brand-05: #01111D;
  --wa-color-brand-10: #052233;
  --wa-color-brand-20: #0E3C56;
  --wa-color-brand-30: #1D5576;
  --wa-color-brand-40: #496275;  /* ANCHOR */
  --wa-color-brand-50: #4888B0;
  --wa-color-brand-60: #62A0C8;
  --wa-color-brand-70: #7AB6D9;  /* ANCHOR */
  --wa-color-brand-80: #A0CEEE;
  --wa-color-brand-90: #C2E3FA;
  --wa-color-brand-95: #D9F3FF;

  /* neutral — hue 54°, anchored on Hematite + Cloud Cover + Cloud Dancer */
  --wa-color-neutral-05: #110F0E;
  --wa-color-neutral-10: #211F1D;
  --wa-color-neutral-20: #3B3734;
  --wa-color-neutral-30: #544F4B;
  --wa-color-neutral-40: #756F6B;  /* ANCHOR */
  --wa-color-neutral-50: #857F7B;
  --wa-color-neutral-60: #999393;  /* ANCHOR */
  --wa-color-neutral-70: #B4AEAA;
  --wa-color-neutral-80: #CBC6C3;
  --wa-color-neutral-90: #E1DDDB;
  --wa-color-neutral-95: #F0EEE9;  /* ANCHOR */

  /* success — hue 146°, anchored on Veiled Vista */
  --wa-color-success-05: #061307;
  --wa-color-success-10: #112513;
  --wa-color-success-20: #224025;
  --wa-color-success-30: #345A37;
  --wa-color-success-40: #4A754D;
  --wa-color-success-50: #5F8E63;
  --wa-color-success-60: #78A67B;
  --wa-color-success-70: #92BC95;
  --wa-color-success-80: #AFD2B1;
  --wa-color-success-90: #C7E2C8;  /* ANCHOR */
  --wa-color-success-95: #E1F5E2;

  /* warning — hue 101°, anchored on Golden Mist */
  --wa-color-warning-05: #131000;
  --wa-color-warning-10: #252000;
  --wa-color-warning-20: #403800;
  --wa-color-warning-30: #5A5103;
  --wa-color-warning-40: #756A1B;
  --wa-color-warning-50: #8D8233;
  --wa-color-warning-60: #A59A4F;
  --wa-color-warning-70: #BBB26F;
  --wa-color-warning-80: #D5CD94;  /* ANCHOR */
  --wa-color-warning-90: #E5E0B8;
  --wa-color-warning-95: #F4F0D2;

  /* danger — hue 29°, anchored on Pure red */
  --wa-color-danger-05: #2F0000;
  --wa-color-danger-10: #4D0000;
  --wa-color-danger-20: #7E0000;
  --wa-color-danger-30: #AB0000;
  --wa-color-danger-40: #D40000;
  --wa-color-danger-50: #FF0000;  /* ANCHOR */
  --wa-color-danger-60: #FF3729;
  --wa-color-danger-70: #FF6652;
  --wa-color-danger-80: #FF917D;
  --wa-color-danger-90: #FFBBAA;
  --wa-color-danger-95: #FFD5C7;
}

/* ---------------------------------------------------------------------------
 * Surface, text and role assignments.
 *
 * Web Awesome derives its fill/border/on tokens from the ramps above and remaps
 * them between light and dark itself, so the ramps are most of the job. What it
 * cannot infer is which step this site wants as its page ground, and the two
 * roles Stephan assigned by name: the menu bar is Blue Fusion, the footer is
 * Hematite, and Quiet Violet marks visited links.
 * ------------------------------------------------------------------------- */
:root,
.wa-light {
	--wa-color-surface-default: var(--wa-color-neutral-95);   /* Cloud Dancer  */
	--wa-color-surface-raised: #FFFFFF;
	--wa-color-surface-lowered: var(--wa-color-neutral-90);
	--wa-color-surface-border: var(--wa-color-neutral-80);
	--wa-color-text-normal: var(--wa-color-neutral-10);
	--wa-color-text-quiet: var(--wa-color-neutral-30);

	--site-menu-fill: var(--wa-color-brand-40);               /* Blue Fusion   */
	--site-menu-on: var(--wa-color-neutral-95);
	--site-footer-fill: var(--wa-color-brand-40);             /* Blue Fusion   */
	--site-footer-on: var(--wa-color-neutral-95);
	--site-visited: var(--wa-color-accent-60);                /* Quiet Violet  */
}

/* /why so short: the ramps already run dark to light, so dark mode reads them
 * from the other end. The menu and footer keep their identity by moving one
 * step each, not by changing hue. */
.wa-dark {
	--wa-color-surface-default: var(--wa-color-neutral-05);
	--wa-color-surface-raised: var(--wa-color-neutral-10);
	--wa-color-surface-lowered: #000000;
	--wa-color-surface-border: var(--wa-color-neutral-20);
	--wa-color-text-normal: var(--wa-color-neutral-95);
	--wa-color-text-quiet: var(--wa-color-neutral-70);

	--site-menu-fill: var(--wa-color-brand-10);
	--site-menu-on: var(--wa-color-neutral-95);
	--site-footer-fill: var(--wa-color-brand-10);
	--site-footer-on: var(--wa-color-neutral-90);
	--site-visited: var(--wa-color-accent-80);
}

/* /why the sidebar needs its own dark value: brand-95 is a pale blue that
   belongs on a light page and glares on a dark one. Read from the other end of
   the same ramp it stays the same colour, one step off the dark ground. */
.wa-dark .sidebar-module {
	--wa-color-neutral-fill-quiet: var(--wa-color-brand-10);
	--wa-color-surface-border: var(--wa-color-brand-20);
}

/* ---------------------------------------------------------------------------
 * Quiet Violet, the one supplied colour with no semantic home among Web
 * Awesome's five variants. It marks visited links: on an archive of 1,430 posts
 * that is real navigation, and the site already did it with #8d32a4.
 * ------------------------------------------------------------------------- */
:root {
	--wa-color-accent-05: #141016;
	--wa-color-accent-10: #221C25;
	--wa-color-accent-20: #3C3341;
	--wa-color-accent-30: #564A5C;
	--wa-color-accent-40: #716279;
	--wa-color-accent-50: #8B7B94;
	--wa-color-accent-60: #A693AC;  /* ANCHOR — Quiet Violet */
	--wa-color-accent-70: #BCACC1;
	--wa-color-accent-80: #D2C6D6;
	--wa-color-accent-90: #E6DEE8;
	--wa-color-accent-95: #F3EEF4;
}