/* KiwiKode: shared theme for the project pages.
   Matches the home page: near-black ground, faint instrument graticule,
   cyan wordmark, amber accents, IBM Plex throughout. */

:root {
  /* Tells the browser which way round we are, so the surfaces it paints itself
     -- scrollbars, select popups, and the about:blank an iframe shows before it
     has a document -- match the page instead of defaulting to light. */
  color-scheme: dark;

  /* Dark is the default. Light overrides only these values, below. */
  --bg: #07090c;
  --grid: #151b21;
  --panel: #0d1117;
  --side-bg: #0a0e13;
  --line: #1b232b;
  --line-2: #2b353f;
  --ink: #dbe1e8;
  --prose: #aab4bd;
  --prose-dim: #97a3ac;
  --muted: #78868f;
  --dim: #4a555f;
  --dim-2: #3b444d;
  --mark: #86d9ea;
  --mark-hi: #a8e6f4;
  --mark-glow: rgba(134, 217, 234, 0.3);
  --accent: #e0a04a;
  --accent-dim: #6f5333;
  --panel-soft: rgba(13, 17, 23, 0.55);
  --scrim: rgba(0, 0, 0, 0.55);
  --shadow: rgba(0, 0, 0, 0.6);
}

html[data-theme="light"] {
  color-scheme: light;
  --bg: #f7f8fa;
  --grid: #e6eaf0;
  --panel: #ffffff;
  --side-bg: #eef1f5;
  --line: #d8dee6;
  --line-2: #b9c3ce;
  --ink: #10181c;
  --prose: #3d4a55;
  --prose-dim: #55636f;
  --muted: #5a6773;
  --dim: #8b98a4;
  --dim-2: #a6b1bc;
  /* Same hue as the icon cyan (#86d9ea), but a step darker so it holds
     on paper. The icon pigment itself washes out on --bg. */
  --mark: #0d9ec0;
  --mark-hi: #0b87a3;
  --mark-glow: rgba(13, 158, 192, 0.22);
  --accent: #a86a10;
  --accent-dim: #cfa877;
  --panel-soft: #ffffff;
  --scrim: rgba(0, 0, 0, 0.35);
  --shadow: rgba(0, 0, 0, 0.18);
}