/*
 * 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;
}

/* ---------------------------------------------------------------------------
 * Surfaces, text and the visited-link colour.
 *
 * Web Awesome derives its fill/border/on tokens from the tint ramps above and
 * remaps them between light and dark itself, so the ramps are the whole job.
 * What it cannot infer is which neutral step this particular site wants as its
 * page ground -- Cloud Dancer, the lightest colour supplied -- and that Quiet
 * Violet is reserved for 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);
	--wa-color-visited: #A693AC;                              /* Quiet Violet */
}

/* /why the dark mapping is this short: the ramps already span dark to light, so
 * dark mode is a matter of reading them from the other end. Quiet Violet is
 * lightened for the dark ground -- at #A693AC it clears AA against the dark
 * surface (6.1:1), but sits too close to the body text to read as a distinct
 * state, so the visited colour moves one step up its own ramp. */
.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);       /* Cloud Dancer */
	--wa-color-text-quiet: var(--wa-color-neutral-70);
	--wa-color-visited: #C3B4C8;
}
