/* priest.locker - the product's own stylesheet.
   The palette and type are the app's: the same purple ground, the same
   lit accent, a serif for headings, and one animated colour band. The
   band is used as a rule under a title or along the edge of a running
   thing - never as a fill behind text. */

/* THE SITE WEARS THE APP'S OWN PALETTE (2026-09-04; colours refreshed
   2026-09-14 to the app's purple). Until 2026-09-04 the site used an
   older, warmer palette while the chat panel, the sign-in page, the app
   window and the setup wizard had all moved to the app's tokens, so the
   page you download from did not look like the thing you installed. The
   values are copied from the app's stylesheet, not paraphrased; the
   contrast ratios are measured, and the site checks re-derive them
   from these tokens on every run. */
:root{
  color-scheme:dark;
  --surface-0:#0d0914; --surface-1:#15101f; --surface-2:#1d162b;
  --surface-3:#281e39; --surface-sunken:#08060e; --edge:#443258;
  --edge-lit:#634980;
  --text-1:#f3eefb; --text-2:#d8cce7; --text-3:#c4b5d5;
  --gold:#c4a2ff; --gold-lit:#dfccff; --gold-dim:#9b7cbe;
  --gold-text:#c4a2ff;
  --stop:#e66464;
  --violet:#a78bfa; --blue:#818cf8; --teal:#b49bfa;
  --green:#9470ce; --eye:#c4a2ff;
  --band-violet:#a78bfa; --band-blue:#818cf8; --band-teal:#b49bfa;
  --band-green:#9470ce; --band-gold:#c4a2ff;
  --band:linear-gradient(90deg,var(--band-gold) 0.0%,var(--band-gold) 4.7%,var(--band-violet) 4.7%,var(--band-violet) 6.2%,var(--band-teal) 6.2%,var(--band-teal) 7.8%,var(--band-gold) 7.8%,var(--band-gold) 9.4%,var(--band-teal) 9.4%,var(--band-teal) 10.9%,var(--band-violet) 10.9%,var(--band-violet) 12.5%,var(--edge) 12.5%,var(--edge) 14.1%,var(--band-teal) 14.1%,var(--band-teal) 15.6%,var(--band-violet) 15.6%,var(--band-violet) 17.2%,var(--band-teal) 17.2%,var(--band-teal) 18.8%,var(--band-violet) 18.8%,var(--band-violet) 20.3%,var(--band-teal) 20.3%,var(--band-teal) 21.9%,var(--band-violet) 21.9%,var(--band-violet) 23.4%,var(--band-gold) 23.4%,var(--band-gold) 25.0%,var(--band-violet) 25.0%,var(--band-violet) 29.7%,var(--band-gold) 29.7%,var(--band-gold) 31.2%,var(--band-violet) 31.2%,var(--band-violet) 34.4%,var(--edge) 34.4%,var(--edge) 35.9%,var(--band-violet) 35.9%,var(--band-violet) 37.5%,var(--band-gold) 37.5%,var(--band-gold) 40.6%,var(--band-violet) 40.6%,var(--band-violet) 43.8%,var(--band-gold) 43.8%,var(--band-gold) 46.9%,var(--band-violet) 46.9%,var(--band-violet) 48.4%,var(--band-gold) 48.4%,var(--band-gold) 50.0%,var(--edge) 50.0%,var(--edge) 51.6%,var(--band-gold) 51.6%,var(--band-gold) 53.1%,var(--band-teal) 53.1%,var(--band-teal) 56.2%,var(--band-violet) 56.2%,var(--band-violet) 57.8%,var(--band-teal) 57.8%,var(--band-teal) 62.5%,var(--band-gold) 62.5%,var(--band-gold) 64.1%,var(--band-teal) 64.1%,var(--band-teal) 65.6%,var(--band-violet) 65.6%,var(--band-violet) 67.2%,var(--band-teal) 67.2%,var(--band-teal) 68.8%,var(--edge) 68.8%,var(--edge) 100.0%);
  --display:Georgia,'Times New Roman',serif;
  --body:'Segoe UI',system-ui,-apple-system,sans-serif;
  --mono:Consolas,'Cascadia Mono',monospace;
}

/* DARK/LIGHT THEME SUPPORT (Enterprise Polish) */
[data-theme="light"]{
  color-scheme:light;
  --surface-0:#faf7fe; --surface-1:#f3edf9; --surface-2:#ece3f4;
  --surface-3:#e6dcef; --surface-sunken:#fdfbff; --edge:#c9b6dc;
  --edge-lit:#a28bb9;
  --text-1:#20172e; --text-2:#392b49; --text-3:#4c395c;
  --gold:#62408c; --gold-lit:#503074; --gold-dim:#76539a;
  --gold-text:#62408c;
  --stop:#b53c3c;
  --violet:#62408c; --blue:#5146a6; --teal:#76539a;
  --green:#694586; --eye:#62408c;
  --band-violet:#62408c; --band-blue:#5146a6; --band-teal:#76539a;
  --band-green:#694586; --band-gold:#62408c;
  --band:linear-gradient(90deg,var(--band-gold) 0.0%,var(--band-gold) 4.7%,var(--band-violet) 4.7%,var(--band-violet) 6.2%,var(--band-teal) 6.2%,var(--band-teal) 7.8%,var(--band-gold) 7.8%,var(--band-gold) 9.4%,var(--band-teal) 9.4%,var(--band-teal) 10.9%,var(--band-violet) 10.9%,var(--band-violet) 12.5%,var(--edge) 12.5%,var(--edge) 14.1%,var(--band-teal) 14.1%,var(--band-teal) 15.6%,var(--band-violet) 15.6%,var(--band-violet) 17.2%,var(--band-teal) 17.2%,var(--band-teal) 18.8%,var(--band-violet) 18.8%,var(--band-violet) 20.3%,var(--band-teal) 20.3%,var(--band-teal) 21.9%,var(--band-violet) 21.9%,var(--band-violet) 23.4%,var(--band-gold) 23.4%,var(--band-gold) 25.0%,var(--band-violet) 25.0%,var(--band-violet) 29.7%,var(--band-gold) 29.7%,var(--band-gold) 31.2%,var(--band-violet) 31.2%,var(--band-violet) 34.4%,var(--edge) 34.4%,var(--edge) 35.9%,var(--band-violet) 35.9%,var(--band-violet) 37.5%,var(--band-gold) 37.5%,var(--band-gold) 40.6%,var(--band-violet) 40.6%,var(--band-violet) 43.8%,var(--band-gold) 43.8%,var(--band-gold) 46.9%,var(--band-violet) 46.9%,var(--band-violet) 48.4%,var(--band-gold) 48.4%,var(--band-gold) 50.0%,var(--edge) 50.0%,var(--edge) 51.6%,var(--band-gold) 51.6%,var(--band-gold) 53.1%,var(--band-teal) 53.1%,var(--band-teal) 56.2%,var(--band-violet) 56.2%,var(--band-violet) 57.8%,var(--band-teal) 57.8%,var(--band-teal) 62.5%,var(--band-gold) 62.5%,var(--band-gold) 64.1%,var(--band-teal) 64.1%,var(--band-teal) 65.6%,var(--band-violet) 65.6%,var(--band-violet) 67.2%,var(--band-teal) 67.2%,var(--band-teal) 68.8%,var(--edge) 68.8%,var(--edge) 100.0%);
}

/* NAMED THEMES ON THE T KEY (2026-09-12). site/themes.js moves <html>
   through night (the tokens above), ember, moss and paper (the light set)
   on a keypress, and remembers the choice in this browser. Each set below
   is a complete replacement of the text and ground tokens; devad/
   test_site_pages.py measures every text token against every ground it can
   sit on in every theme, so a theme that fails AA fails the suite.
   THE WARDROBE GREW (2026-09-14): vigil and reliquary joined the list,
   and the test walks them under the same rule as the rest. */
[data-site-theme="ember"]{
  --surface-0:#1a0e09; --surface-1:#22130c; --surface-2:#2b1a11;
  --surface-3:#372217; --surface-sunken:#100705; --edge:#4d3221;
  --edge-lit:#6b4630;
  --text-1:#f5ece2; --text-2:#dfd0c2; --text-3:#c9b6a6;
  --gold:#f0a94e; --gold-lit:#f8c57e; --gold-dim:#a06f2e;
  --gold-text:#dea25a;
  --stop:#f07070;
  --violet:#8a4fbf; --blue:#2f7fc0; --teal:#22a8a0;
  --green:#2f8a66; --eye:#f0a94e;
  --band-violet:#9d4edd; --band-blue:#e85d04; --band-teal:#f48c06;
  --band-green:#dc2f02; --band-gold:#faa307;
  --band:linear-gradient(90deg,var(--band-gold) 0.0%,var(--band-gold) 4.7%,var(--band-violet) 4.7%,var(--band-violet) 6.2%,var(--band-teal) 6.2%,var(--band-teal) 7.8%,var(--band-gold) 7.8%,var(--band-gold) 9.4%,var(--band-teal) 9.4%,var(--band-teal) 10.9%,var(--band-violet) 10.9%,var(--band-violet) 12.5%,var(--edge) 12.5%,var(--edge) 14.1%,var(--band-teal) 14.1%,var(--band-teal) 15.6%,var(--band-violet) 15.6%,var(--band-violet) 17.2%,var(--band-teal) 17.2%,var(--band-teal) 18.8%,var(--band-violet) 18.8%,var(--band-violet) 20.3%,var(--band-teal) 20.3%,var(--band-teal) 21.9%,var(--band-violet) 21.9%,var(--band-violet) 23.4%,var(--band-gold) 23.4%,var(--band-gold) 25.0%,var(--band-violet) 25.0%,var(--band-violet) 29.7%,var(--band-gold) 29.7%,var(--band-gold) 31.2%,var(--band-violet) 31.2%,var(--band-violet) 34.4%,var(--edge) 34.4%,var(--edge) 35.9%,var(--band-violet) 35.9%,var(--band-violet) 37.5%,var(--band-gold) 37.5%,var(--band-gold) 40.6%,var(--band-violet) 40.6%,var(--band-violet) 43.8%,var(--band-gold) 43.8%,var(--band-gold) 46.9%,var(--band-violet) 46.9%,var(--band-violet) 48.4%,var(--band-gold) 48.4%,var(--band-gold) 50.0%,var(--edge) 50.0%,var(--edge) 51.6%,var(--band-gold) 51.6%,var(--band-gold) 53.1%,var(--band-teal) 53.1%,var(--band-teal) 56.2%,var(--band-violet) 56.2%,var(--band-violet) 57.8%,var(--band-teal) 57.8%,var(--band-teal) 62.5%,var(--band-gold) 62.5%,var(--band-gold) 64.1%,var(--band-teal) 64.1%,var(--band-teal) 65.6%,var(--band-violet) 65.6%,var(--band-violet) 67.2%,var(--band-teal) 67.2%,var(--band-teal) 68.8%,var(--edge) 68.8%,var(--edge) 100.0%);
}
[data-site-theme="moss"]{
  --surface-0:#0a1610; --surface-1:#0f1e16; --surface-2:#15271c;
  --surface-3:#1c3325; --surface-sunken:#050c08; --edge:#274a3a;
  --edge-lit:#336650;
  --text-1:#eaf1ec; --text-2:#d1ddd5; --text-3:#b9c9bf;
  --gold:#cfd95a; --gold-lit:#e3ea8a; --gold-dim:#8c9433;
  --gold-text:#c2cc4f;
  --stop:#f07a7a;
  --violet:#7a5ab8; --blue:#2c7ab0; --teal:#2fb3a0;
  --green:#3fa06f; --eye:#cfd95a;
  --band-violet:#5a189a; --band-blue:#1b998b; --band-teal:#2dc653;
  --band-green:#80b918; --band-gold:#d4d700;
  --band:linear-gradient(90deg,var(--band-gold) 0.0%,var(--band-gold) 4.7%,var(--band-violet) 4.7%,var(--band-violet) 6.2%,var(--band-teal) 6.2%,var(--band-teal) 7.8%,var(--band-gold) 7.8%,var(--band-gold) 9.4%,var(--band-teal) 9.4%,var(--band-teal) 10.9%,var(--band-violet) 10.9%,var(--band-violet) 12.5%,var(--edge) 12.5%,var(--edge) 14.1%,var(--band-teal) 14.1%,var(--band-teal) 15.6%,var(--band-violet) 15.6%,var(--band-violet) 17.2%,var(--band-teal) 17.2%,var(--band-teal) 18.8%,var(--band-violet) 18.8%,var(--band-violet) 20.3%,var(--band-teal) 20.3%,var(--band-teal) 21.9%,var(--band-violet) 21.9%,var(--band-violet) 23.4%,var(--band-gold) 23.4%,var(--band-gold) 25.0%,var(--band-violet) 25.0%,var(--band-violet) 29.7%,var(--band-gold) 29.7%,var(--band-gold) 31.2%,var(--band-violet) 31.2%,var(--band-violet) 34.4%,var(--edge) 34.4%,var(--edge) 35.9%,var(--band-violet) 35.9%,var(--band-violet) 37.5%,var(--band-gold) 37.5%,var(--band-gold) 40.6%,var(--band-violet) 40.6%,var(--band-violet) 43.8%,var(--band-gold) 43.8%,var(--band-gold) 46.9%,var(--band-violet) 46.9%,var(--band-violet) 48.4%,var(--band-gold) 48.4%,var(--band-gold) 50.0%,var(--edge) 50.0%,var(--edge) 51.6%,var(--band-gold) 51.6%,var(--band-gold) 53.1%,var(--band-teal) 53.1%,var(--band-teal) 56.2%,var(--band-violet) 56.2%,var(--band-violet) 57.8%,var(--band-teal) 57.8%,var(--band-teal) 62.5%,var(--band-gold) 62.5%,var(--band-gold) 64.1%,var(--band-teal) 64.1%,var(--band-teal) 65.6%,var(--band-violet) 65.6%,var(--band-violet) 67.2%,var(--band-teal) 67.2%,var(--band-teal) 68.8%,var(--edge) 68.8%,var(--edge) 100.0%);
}
/* VIGIL — THE BLUE HOUR (2026-09-14). The screen at 3 a.m.: steel-blue
   grounds, ice text, candle gold that never burns out. Every pair below
   clears 4.5:1 (tightest: --stop on --surface-2 at 6.38:1), measured by
   the same walk as every other theme in devad/test_site_pages.py. */
[data-site-theme="vigil"]{
  --surface-0:#0a0e16; --surface-1:#0f1521; --surface-2:#141b29;
  --surface-3:#1a2334; --surface-sunken:#060a10; --edge:#223046;
  --edge-lit:#2e4160;
  --text-1:#e9eef7; --text-2:#c6d0e0; --text-3:#a7b4c9;
  --gold:#d9b25f; --gold-lit:#ecc87e; --gold-dim:#a07a35;
  --gold-text:#d9b25f;
  --stop:#f07a7a;
  --violet:#8f7ad8; --blue:#5a9fd4; --teal:#54c7c7;
  --green:#58c090; --eye:#d9b25f;
  --band-violet:#7c6fd4; --band-blue:#3b82c4; --band-teal:#3fb5c9;
  --band-green:#4ea98f; --band-gold:#d9b25f;
  --band:linear-gradient(90deg,var(--band-gold) 0.0%,var(--band-gold) 4.7%,var(--band-violet) 4.7%,var(--band-violet) 6.2%,var(--band-teal) 6.2%,var(--band-teal) 7.8%,var(--band-gold) 7.8%,var(--band-gold) 9.4%,var(--band-teal) 9.4%,var(--band-teal) 10.9%,var(--band-violet) 10.9%,var(--band-violet) 12.5%,var(--edge) 12.5%,var(--edge) 14.1%,var(--band-teal) 14.1%,var(--band-teal) 15.6%,var(--band-violet) 15.6%,var(--band-violet) 17.2%,var(--band-teal) 17.2%,var(--band-teal) 18.8%,var(--band-violet) 18.8%,var(--band-violet) 20.3%,var(--band-teal) 20.3%,var(--band-teal) 21.9%,var(--band-violet) 21.9%,var(--band-violet) 23.4%,var(--band-gold) 23.4%,var(--band-gold) 25.0%,var(--band-violet) 25.0%,var(--band-violet) 29.7%,var(--band-gold) 29.7%,var(--band-gold) 31.2%,var(--band-violet) 31.2%,var(--band-violet) 34.4%,var(--edge) 34.4%,var(--edge) 35.9%,var(--band-violet) 35.9%,var(--band-violet) 37.5%,var(--band-gold) 37.5%,var(--band-gold) 40.6%,var(--band-violet) 40.6%,var(--band-violet) 43.8%,var(--band-gold) 43.8%,var(--band-gold) 46.9%,var(--band-violet) 46.9%,var(--band-violet) 48.4%,var(--band-gold) 48.4%,var(--band-gold) 50.0%,var(--edge) 50.0%,var(--edge) 51.6%,var(--band-gold) 51.6%,var(--band-gold) 53.1%,var(--band-teal) 53.1%,var(--band-teal) 56.2%,var(--band-violet) 56.2%,var(--band-violet) 57.8%,var(--band-teal) 57.8%,var(--band-teal) 62.5%,var(--band-gold) 62.5%,var(--band-gold) 64.1%,var(--band-teal) 64.1%,var(--band-teal) 65.6%,var(--band-violet) 65.6%,var(--band-violet) 67.2%,var(--band-teal) 67.2%,var(--band-teal) 68.8%,var(--edge) 68.8%,var(--edge) 100.0%);
}
/* RELIQUARY — PARCHMENT AND OLD INK (2026-09-14). A second light theme,
   warm where "paper" is cool: bone grounds, sepia text, the gold of an
   illuminated capital. Tightest pair: --stop on --surface-2 at 4.69:1,
   the same AA walk as every other theme. */
[data-site-theme="reliquary"]{
  color-scheme:light;
  --surface-0:#f7f1e2; --surface-1:#efe6d2; --surface-2:#e6dabd;
  --surface-3:#dbcfb2; --surface-sunken:#f3ecda; --edge:#c9ba9b;
  --edge-lit:#b3a17f;
  --text-1:#2a2013; --text-2:#46372a; --text-3:#5e4e3e;
  --gold:#75590f; --gold-lit:#8a6a1c; --gold-dim:#75590f;
  --gold-text:#75590f;
  --stop:#a33a3a;
  --violet:#5a3a8a; --blue:#2a5a8a; --teal:#1a6e66;
  --green:#2a6a4a; --eye:#75590f;
  --band-violet:#6b21a8; --band-blue:#1d4ed8; --band-teal:#0d9488;
  --band-green:#059669; --band-gold:#b8963a;
  --band:linear-gradient(90deg,var(--band-gold) 0.0%,var(--band-gold) 4.7%,var(--band-violet) 4.7%,var(--band-violet) 6.2%,var(--band-teal) 6.2%,var(--band-teal) 7.8%,var(--band-gold) 7.8%,var(--band-gold) 9.4%,var(--band-teal) 9.4%,var(--band-teal) 10.9%,var(--band-violet) 10.9%,var(--band-violet) 12.5%,var(--edge) 12.5%,var(--edge) 14.1%,var(--band-teal) 14.1%,var(--band-teal) 15.6%,var(--band-violet) 15.6%,var(--band-violet) 17.2%,var(--band-teal) 17.2%,var(--band-teal) 18.8%,var(--band-violet) 18.8%,var(--band-violet) 20.3%,var(--band-teal) 20.3%,var(--band-teal) 21.9%,var(--band-violet) 21.9%,var(--band-violet) 23.4%,var(--band-gold) 23.4%,var(--band-gold) 25.0%,var(--band-violet) 25.0%,var(--band-violet) 29.7%,var(--band-gold) 29.7%,var(--band-gold) 31.2%,var(--band-violet) 31.2%,var(--band-violet) 34.4%,var(--edge) 34.4%,var(--edge) 35.9%,var(--band-violet) 35.9%,var(--band-violet) 37.5%,var(--band-gold) 37.5%,var(--band-gold) 40.6%,var(--band-violet) 40.6%,var(--band-violet) 43.8%,var(--band-gold) 43.8%,var(--band-gold) 46.9%,var(--band-violet) 46.9%,var(--band-violet) 48.4%,var(--band-gold) 48.4%,var(--band-gold) 50.0%,var(--edge) 50.0%,var(--edge) 51.6%,var(--band-gold) 51.6%,var(--band-gold) 53.1%,var(--band-teal) 53.1%,var(--band-teal) 56.2%,var(--band-violet) 56.2%,var(--band-violet) 57.8%,var(--band-teal) 57.8%,var(--band-teal) 62.5%,var(--band-gold) 62.5%,var(--band-gold) 64.1%,var(--band-teal) 64.1%,var(--band-teal) 65.6%,var(--band-violet) 65.6%,var(--band-violet) 67.2%,var(--band-teal) 67.2%,var(--band-teal) 68.8%,var(--edge) 68.8%,var(--edge) 100.0%);
}
/* THE LIGHT TWINS (2026-09-19). Four of the dark themes gain a daylight
   sibling with the same character - the same hues and the same accent
   family, turned over so the ground is light and the ink is dark - so
   somebody who loves Moss can read it by daylight and it still feels
   like Moss.

     Night  -> Lauds     the dawn office; the light answer to Night
     Ember  -> Hearth    the same fire, seen by day
     Moss   -> Meadow    the same green, in sunlight
     Vigil  -> Daybreak  the blue hour, after it breaks

   NOTHING LANDS ANYWHERE NEW. Reliquary is still the light theme a light
   computer opens in and Night is still the dark default; these are four
   more dresses over the same bones.

   EACH DECLARES color-scheme:light, which is doing two jobs: it tells the
   browser to draw native controls (scrollbars, checkboxes, date pickers)
   on the light side, and it is the ONLY thing tools/themes/sync_themes.py
   and sync_mark.py read to decide a theme is light. Neither generator
   compares a name, so these four needed no new code in either.

   MEASURED, NOT ASSERTED. Every value clears the same walk as the rest of
   the wardrobe - text on all four grounds, the accent and the stop on the
   card grounds, the ground on the accent - and the app re-uses the same
   tokens over nine grounds at 7.0:1 for text, 4.5:1 for states and 3.0:1
   for the control edge. The text ramp's worst ratio over all nine is
   quoted per theme. */
/* LAUDS — THE DAWN OFFICE. Night's own lavender, read off a pale violet
   page: the same 262-degree accent, the same periwinkle blue. Text ramp
   11.23 / 8.88 / 7.02:1 at worst. */
[data-site-theme="lauds"]{
  color-scheme:light;
  --surface-0:#f8f4ff; --surface-1:#f1eafb; --surface-2:#e9dff6;
  --surface-3:#ded2ef; --surface-sunken:#fcfaff; --edge:#cbb8e4;
  --edge-lit:#a98fc9;
  --text-1:#271a3b; --text-2:#3a2b50; --text-3:#4b3a61;
  --gold:#5a2fa8; --gold-lit:#47207f; --gold-dim:#6c49b0;
  --gold-text:#5a2fa8;
  --stop:#ab2f2f;
  --violet:#6b46c1; --blue:#4338ca; --teal:#6d3fc4;
  --green:#5b3a96; --eye:#5a2fa8;
  --band-violet:#6b46c1; --band-blue:#4338ca; --band-teal:#6d3fc4;
  --band-green:#5b3a96; --band-gold:#5a2fa8;
  --band:linear-gradient(90deg,var(--band-gold) 0.0%,var(--band-gold) 4.7%,var(--band-violet) 4.7%,var(--band-violet) 6.2%,var(--band-teal) 6.2%,var(--band-teal) 7.8%,var(--band-gold) 7.8%,var(--band-gold) 9.4%,var(--band-teal) 9.4%,var(--band-teal) 10.9%,var(--band-violet) 10.9%,var(--band-violet) 12.5%,var(--edge) 12.5%,var(--edge) 14.1%,var(--band-teal) 14.1%,var(--band-teal) 15.6%,var(--band-violet) 15.6%,var(--band-violet) 17.2%,var(--band-teal) 17.2%,var(--band-teal) 18.8%,var(--band-violet) 18.8%,var(--band-violet) 20.3%,var(--band-teal) 20.3%,var(--band-teal) 21.9%,var(--band-violet) 21.9%,var(--band-violet) 23.4%,var(--band-gold) 23.4%,var(--band-gold) 25.0%,var(--band-violet) 25.0%,var(--band-violet) 29.7%,var(--band-gold) 29.7%,var(--band-gold) 31.2%,var(--band-violet) 31.2%,var(--band-violet) 34.4%,var(--edge) 34.4%,var(--edge) 35.9%,var(--band-violet) 35.9%,var(--band-violet) 37.5%,var(--band-gold) 37.5%,var(--band-gold) 40.6%,var(--band-violet) 40.6%,var(--band-violet) 43.8%,var(--band-gold) 43.8%,var(--band-gold) 46.9%,var(--band-violet) 46.9%,var(--band-violet) 48.4%,var(--band-gold) 48.4%,var(--band-gold) 50.0%,var(--edge) 50.0%,var(--edge) 51.6%,var(--band-gold) 51.6%,var(--band-gold) 53.1%,var(--band-teal) 53.1%,var(--band-teal) 56.2%,var(--band-violet) 56.2%,var(--band-violet) 57.8%,var(--band-teal) 57.8%,var(--band-teal) 62.5%,var(--band-gold) 62.5%,var(--band-gold) 64.1%,var(--band-teal) 64.1%,var(--band-teal) 65.6%,var(--band-violet) 65.6%,var(--band-violet) 67.2%,var(--band-teal) 67.2%,var(--band-teal) 68.8%,var(--edge) 68.8%,var(--edge) 100.0%);
}
/* HEARTH — THE SAME FIRE, SEEN BY DAY. Ember's orange at the same 33
   degrees, banked down until it reads on warm apricot paper; its violet,
   its steel blue, its teal and its pine all kept, darkened to match. Text
   ramp 11.85 / 9.26 / 7.14:1 at worst. */
[data-site-theme="hearth"]{
  color-scheme:light;
  --surface-0:#fdf6ee; --surface-1:#f9ece0; --surface-2:#f3e2d0;
  --surface-3:#ecd7c0; --surface-sunken:#fffaf4; --edge:#e0c3a5;
  --edge-lit:#c29f79;
  --text-1:#2e1a0d; --text-2:#472b17; --text-3:#5c3b26;
  --gold:#984808; --gold-lit:#7d3b06; --gold-dim:#8b4e19;
  --gold-text:#984808;
  --stop:#b02c2c;
  --violet:#6b2f9b; --blue:#1c5a8c; --teal:#0f6f6a;
  --green:#1c6247; --eye:#984808;
  --band-violet:#7b2fae; --band-blue:#9c3d03; --band-teal:#a35e04;
  --band-green:#941f01; --band-gold:#a46c05;
  --band:linear-gradient(90deg,var(--band-gold) 0.0%,var(--band-gold) 4.7%,var(--band-violet) 4.7%,var(--band-violet) 6.2%,var(--band-teal) 6.2%,var(--band-teal) 7.8%,var(--band-gold) 7.8%,var(--band-gold) 9.4%,var(--band-teal) 9.4%,var(--band-teal) 10.9%,var(--band-violet) 10.9%,var(--band-violet) 12.5%,var(--edge) 12.5%,var(--edge) 14.1%,var(--band-teal) 14.1%,var(--band-teal) 15.6%,var(--band-violet) 15.6%,var(--band-violet) 17.2%,var(--band-teal) 17.2%,var(--band-teal) 18.8%,var(--band-violet) 18.8%,var(--band-violet) 20.3%,var(--band-teal) 20.3%,var(--band-teal) 21.9%,var(--band-violet) 21.9%,var(--band-violet) 23.4%,var(--band-gold) 23.4%,var(--band-gold) 25.0%,var(--band-violet) 25.0%,var(--band-violet) 29.7%,var(--band-gold) 29.7%,var(--band-gold) 31.2%,var(--band-violet) 31.2%,var(--band-violet) 34.4%,var(--edge) 34.4%,var(--edge) 35.9%,var(--band-violet) 35.9%,var(--band-violet) 37.5%,var(--band-gold) 37.5%,var(--band-gold) 40.6%,var(--band-violet) 40.6%,var(--band-violet) 43.8%,var(--band-gold) 43.8%,var(--band-gold) 46.9%,var(--band-violet) 46.9%,var(--band-violet) 48.4%,var(--band-gold) 48.4%,var(--band-gold) 50.0%,var(--edge) 50.0%,var(--edge) 51.6%,var(--band-gold) 51.6%,var(--band-gold) 53.1%,var(--band-teal) 53.1%,var(--band-teal) 56.2%,var(--band-violet) 56.2%,var(--band-violet) 57.8%,var(--band-teal) 57.8%,var(--band-teal) 62.5%,var(--band-gold) 62.5%,var(--band-gold) 64.1%,var(--band-teal) 64.1%,var(--band-teal) 65.6%,var(--band-violet) 65.6%,var(--band-violet) 67.2%,var(--band-teal) 67.2%,var(--band-teal) 68.8%,var(--edge) 68.8%,var(--edge) 100.0%);
}
/* MEADOW — THE SAME GREEN, IN SUNLIGHT. Moss's yellow-green accent held
   at its own 66 degrees and taken down to olive, on a pale leaf ground;
   the violet, blue, teal and green of the band are Moss's, darkened. Text
   ramp 12.11 / 9.49 / 7.06:1 at worst. */
[data-site-theme="meadow"]{
  color-scheme:light;
  --surface-0:#f4faf2; --surface-1:#e9f4e6; --surface-2:#dceedb;
  --surface-3:#cfe6cd; --surface-sunken:#fbfdfa; --edge:#b5d3b2;
  --edge-lit:#8fb78c;
  --text-1:#14251a; --text-2:#23382a; --text-3:#344c3c;
  --gold:#5c6810; --gold-lit:#49520c; --gold-dim:#5d6816;
  --gold-text:#5c6810;
  --stop:#a83232;
  --violet:#5b3f94; --blue:#1d5a84; --teal:#14695e;
  --green:#1f6a45; --eye:#5c6810;
  --band-violet:#4a1480; --band-blue:#147469; --band-teal:#1d8a3a;
  --band-green:#5a8211; --band-gold:#6f7100;
  --band:linear-gradient(90deg,var(--band-gold) 0.0%,var(--band-gold) 4.7%,var(--band-violet) 4.7%,var(--band-violet) 6.2%,var(--band-teal) 6.2%,var(--band-teal) 7.8%,var(--band-gold) 7.8%,var(--band-gold) 9.4%,var(--band-teal) 9.4%,var(--band-teal) 10.9%,var(--band-violet) 10.9%,var(--band-violet) 12.5%,var(--edge) 12.5%,var(--edge) 14.1%,var(--band-teal) 14.1%,var(--band-teal) 15.6%,var(--band-violet) 15.6%,var(--band-violet) 17.2%,var(--band-teal) 17.2%,var(--band-teal) 18.8%,var(--band-violet) 18.8%,var(--band-violet) 20.3%,var(--band-teal) 20.3%,var(--band-teal) 21.9%,var(--band-violet) 21.9%,var(--band-violet) 23.4%,var(--band-gold) 23.4%,var(--band-gold) 25.0%,var(--band-violet) 25.0%,var(--band-violet) 29.7%,var(--band-gold) 29.7%,var(--band-gold) 31.2%,var(--band-violet) 31.2%,var(--band-violet) 34.4%,var(--edge) 34.4%,var(--edge) 35.9%,var(--band-violet) 35.9%,var(--band-violet) 37.5%,var(--band-gold) 37.5%,var(--band-gold) 40.6%,var(--band-violet) 40.6%,var(--band-violet) 43.8%,var(--band-gold) 43.8%,var(--band-gold) 46.9%,var(--band-violet) 46.9%,var(--band-violet) 48.4%,var(--band-gold) 48.4%,var(--band-gold) 50.0%,var(--edge) 50.0%,var(--edge) 51.6%,var(--band-gold) 51.6%,var(--band-gold) 53.1%,var(--band-teal) 53.1%,var(--band-teal) 56.2%,var(--band-violet) 56.2%,var(--band-violet) 57.8%,var(--band-teal) 57.8%,var(--band-teal) 62.5%,var(--band-gold) 62.5%,var(--band-gold) 64.1%,var(--band-teal) 64.1%,var(--band-teal) 65.6%,var(--band-violet) 65.6%,var(--band-violet) 67.2%,var(--band-teal) 67.2%,var(--band-teal) 68.8%,var(--edge) 68.8%,var(--edge) 100.0%);
}
/* DAYBREAK — THE BLUE HOUR, AFTER IT BREAKS. Vigil's steel turned to a
   cold-morning sky, its candle gold to the bronze that gold becomes in
   daylight; the same 41-degree accent, the same cool violet and teal.
   Text ramp 12.44 / 9.61 / 7.21:1 at worst. */
[data-site-theme="daybreak"]{
  color-scheme:light;
  --surface-0:#f4f8fd; --surface-1:#e9f0f9; --surface-2:#dde7f4;
  --surface-3:#cedcee; --surface-sunken:#fbfdff; --edge:#b7cae1;
  --edge-lit:#8fa9c6;
  --text-1:#101b2b; --text-2:#213044; --text-3:#33435b;
  --gold:#7d5a12; --gold-lit:#63470e; --gold-dim:#795a1a;
  --gold-text:#7d5a12;
  --stop:#a63434;
  --violet:#4f3a9c; --blue:#1b5c92; --teal:#10696a;
  --green:#1d6a4c; --eye:#7d5a12;
  --band-violet:#4a3f9e; --band-blue:#1f5c92; --band-teal:#16697a;
  --band-green:#2a6a58; --band-gold:#7d5a12;
  --band:linear-gradient(90deg,var(--band-gold) 0.0%,var(--band-gold) 4.7%,var(--band-violet) 4.7%,var(--band-violet) 6.2%,var(--band-teal) 6.2%,var(--band-teal) 7.8%,var(--band-gold) 7.8%,var(--band-gold) 9.4%,var(--band-teal) 9.4%,var(--band-teal) 10.9%,var(--band-violet) 10.9%,var(--band-violet) 12.5%,var(--edge) 12.5%,var(--edge) 14.1%,var(--band-teal) 14.1%,var(--band-teal) 15.6%,var(--band-violet) 15.6%,var(--band-violet) 17.2%,var(--band-teal) 17.2%,var(--band-teal) 18.8%,var(--band-violet) 18.8%,var(--band-violet) 20.3%,var(--band-teal) 20.3%,var(--band-teal) 21.9%,var(--band-violet) 21.9%,var(--band-violet) 23.4%,var(--band-gold) 23.4%,var(--band-gold) 25.0%,var(--band-violet) 25.0%,var(--band-violet) 29.7%,var(--band-gold) 29.7%,var(--band-gold) 31.2%,var(--band-violet) 31.2%,var(--band-violet) 34.4%,var(--edge) 34.4%,var(--edge) 35.9%,var(--band-violet) 35.9%,var(--band-violet) 37.5%,var(--band-gold) 37.5%,var(--band-gold) 40.6%,var(--band-violet) 40.6%,var(--band-violet) 43.8%,var(--band-gold) 43.8%,var(--band-gold) 46.9%,var(--band-violet) 46.9%,var(--band-violet) 48.4%,var(--band-gold) 48.4%,var(--band-gold) 50.0%,var(--edge) 50.0%,var(--edge) 51.6%,var(--band-gold) 51.6%,var(--band-gold) 53.1%,var(--band-teal) 53.1%,var(--band-teal) 56.2%,var(--band-violet) 56.2%,var(--band-violet) 57.8%,var(--band-teal) 57.8%,var(--band-teal) 62.5%,var(--band-gold) 62.5%,var(--band-gold) 64.1%,var(--band-teal) 64.1%,var(--band-teal) 65.6%,var(--band-violet) 65.6%,var(--band-violet) 67.2%,var(--band-teal) 67.2%,var(--band-teal) 68.8%,var(--edge) 68.8%,var(--edge) 100.0%);
}
/* NOON — SUNWARD, WHEN THE SUN ARRIVES (2026-09-20). The fifth twin, and
   the one the others were not: Sunward faces the sun, Noon is the hour it
   gets there. Sunward is a DARK theme despite its name - a near-black peak
   of petrol and sage, a scarlet burst radiating into a cream glow, deep
   indigo clusters either side, gold flecked through the lower field. Turn
   that over and the painting's own cream glow becomes the page, the peak's
   petrol and sage become the ink, and every named hue is the same hue,
   deepened until it reads on cream:

     the burst    #ef6a52 -> #a8301a    scarlet, at 9 degrees in both
     the clusters #7f8ddb -> #37429c    indigo, at 231 degrees in both
     the sea      #4fb5ae -> #0d6560    the same 177-degree teal
     the field    #6fa87b -> #2b6340    the sage of the lower field
     the flecks   #d8bc5a -> #7a5a0b    the amber accent, as daylight ochre

   WHY IT IS HERE AND NOT HAND-WRITTEN. Sunward's twin is a plain block in
   this file like the other eleven, so dashboard/site-themes.css, the marks,
   station/themes.json and the station configs are all GENERATED from it by
   tools/themes/sync_themes.py, sync_mark.py and station/build.py. Sunward
   itself is the one palette those generators skip - its dashboard block was
   hand-written first and is the Rosetta stone the token mapping was read
   off - and that skip is the reason dashboard/palette.py still carries a
   _STATION_EXTRA entry for it. Noon inherits none of that debt: it needs no
   entry, because --warn and --accent both come off --gold/--gold-text here,
   in one file, the way every generated palette's do.

   MEASURED, NOT ASSERTED. The same walk as the rest of the wardrobe - text
   on every ground, the accent, the stop and the hues on the card grounds,
   the ground on the accent. Text ramp 12.35 / 8.80 / 7.12:1 at worst over
   all nine app grounds; tightest state token --gold at 4.69:1. */
[data-site-theme="noon"]{
  color-scheme:light;
  --surface-0:#fdf7ec; --surface-1:#f8f1e1; --surface-2:#f2e8d2;
  --surface-3:#e9dcc0; --surface-sunken:#fffdf7; --edge:#d5c8a8;
  --edge-lit:#93a08a;
  --text-1:#12201f; --text-2:#243b38; --text-3:#324944;
  --gold:#7a5a0b; --gold-lit:#61480a; --gold-dim:#6f5512;
  --gold-text:#7a5a0b;
  --stop:#a8301a;
  --violet:#37429c; --blue:#33459e; --teal:#0d6560;
  --green:#2b6340; --eye:#7a5a0b;
  --band-violet:#313d93; --band-blue:#1a6660; --band-teal:#17766f;
  --band-green:#3a6d48; --band-gold:#7a5a0b;
  --band:linear-gradient(90deg,var(--band-gold) 0.0%,var(--band-gold) 4.7%,var(--band-violet) 4.7%,var(--band-violet) 6.2%,var(--band-teal) 6.2%,var(--band-teal) 7.8%,var(--band-gold) 7.8%,var(--band-gold) 9.4%,var(--band-teal) 9.4%,var(--band-teal) 10.9%,var(--band-violet) 10.9%,var(--band-violet) 12.5%,var(--edge) 12.5%,var(--edge) 14.1%,var(--band-teal) 14.1%,var(--band-teal) 15.6%,var(--band-violet) 15.6%,var(--band-violet) 17.2%,var(--band-teal) 17.2%,var(--band-teal) 18.8%,var(--band-violet) 18.8%,var(--band-violet) 20.3%,var(--band-teal) 20.3%,var(--band-teal) 21.9%,var(--band-violet) 21.9%,var(--band-violet) 23.4%,var(--band-gold) 23.4%,var(--band-gold) 25.0%,var(--band-violet) 25.0%,var(--band-violet) 29.7%,var(--band-gold) 29.7%,var(--band-gold) 31.2%,var(--band-violet) 31.2%,var(--band-violet) 34.4%,var(--edge) 34.4%,var(--edge) 35.9%,var(--band-violet) 35.9%,var(--band-violet) 37.5%,var(--band-gold) 37.5%,var(--band-gold) 40.6%,var(--band-violet) 40.6%,var(--band-violet) 43.8%,var(--band-gold) 43.8%,var(--band-gold) 46.9%,var(--band-violet) 46.9%,var(--band-violet) 48.4%,var(--band-gold) 48.4%,var(--band-gold) 50.0%,var(--edge) 50.0%,var(--edge) 51.6%,var(--band-gold) 51.6%,var(--band-gold) 53.1%,var(--band-teal) 53.1%,var(--band-teal) 56.2%,var(--band-violet) 56.2%,var(--band-violet) 57.8%,var(--band-teal) 57.8%,var(--band-teal) 62.5%,var(--band-gold) 62.5%,var(--band-gold) 64.1%,var(--band-teal) 64.1%,var(--band-teal) 65.6%,var(--band-violet) 65.6%,var(--band-violet) 67.2%,var(--band-teal) 67.2%,var(--band-teal) 68.8%,var(--edge) 68.8%,var(--edge) 100.0%);
}
#site-theme-toast{position:fixed;left:50%;bottom:22px;transform:translate(-50%,8px);
  background:var(--surface-2);color:var(--text-1);border:1px solid var(--edge-lit);
  padding:10px 16px;border-radius:8px;font:14px var(--body);opacity:0;
  pointer-events:none;transition:opacity .18s ease,transform .18s ease;z-index:60;
  max-width:calc(100vw - 32px)}
#site-theme-toast.on{opacity:1;transform:translate(-50%,0)}
html:not([data-site-themes]) [data-site-theme-next]{display:none}
.foot-theme{background:none;border:0;color:var(--gold-text);font:inherit;
  cursor:pointer;padding:0;text-decoration:underline;text-underline-offset:3px}
.foot-theme kbd{font:12px var(--mono);border:1px solid var(--edge-lit);
  border-radius:4px;padding:1px 5px;margin-left:4px;color:var(--text-2)}
.foot-theme:hover,.foot-theme:focus-visible{color:var(--gold-lit)}

*{box-sizing:border-box;margin:0;padding:0}
/* [hidden] BEATS ANY CLASS THAT SETS display (2026-09-05). The releases
   pager is `<nav class="pager" id="pager" hidden>` and `.pager` sets
   display:flex, which wins on specificity - so with JavaScript off, where
   nothing ever unhides it, the download page drew "Newer" and "Older"
   buttons over an empty table. Seen at 440x956 with script execution
   disabled. */
[hidden]{display:none!important}
html{scroll-behavior:smooth}
body{background:var(--surface-0);color:var(--text-2);
  font:16px/1.65 var(--body);-webkit-font-smoothing:antialiased}
a{color:var(--gold);text-decoration:none}
a:hover{text-decoration:underline}
:focus-visible{outline:2px solid var(--eye);outline-offset:2px}

/* ---- the band -------------------------------------------------------- */
/* EVERY ANIMATED BAND GETS ITS OWN COMPOSITOR LAYER (2026-09-03). The band
   sits inside composited parents - the sticky header's backdrop-filter,
   the hero panel's overflow:hidden - and on Chromium an animating child
   there was seen to drop out and reappear at random. transform plus
   will-change give each animated band its own layer, which ends that
   wherever the band is used. */
.band{height:3px;background:var(--band);background-size:200% 100%;
  animation:drift 11s linear infinite;
  transform:translateZ(0);will-change:background-position}
@keyframes drift{to{background-position:200% 0}}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;
    animation-iteration-count:1!important;transition-duration:.001ms!important}
}

/* ---- nav ------------------------------------------------------------- */
header{position:sticky;top:0;z-index:50;background:var(--surface-0);
  backdrop-filter:blur(8px)}
.nav{max-width:1080px;margin:0 auto;display:flex;align-items:center;
  gap:26px;padding:14px 22px}
.logo{font:600 19px var(--display);letter-spacing:.14em;color:var(--text-1);
  text-transform:uppercase}
.logo:hover{text-decoration:none}
.nav a.nlink{color:var(--text-2);font-size:14.5px}
.nav a.nlink:hover{color:var(--text-1);text-decoration:none}
.spacer{flex:1}
/* dropdown */
.drop{position:relative}
.drop>button{background:none;border:0;color:var(--text-2);cursor:pointer;
  font:14.5px var(--body);padding:6px 2px;display:flex;gap:6px;align-items:center}
.drop>button:hover{color:var(--text-1)}
.drop>button::after{content:'';width:7px;height:7px;margin-top:-3px;
  border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;
  transform:rotate(45deg);transition:transform .15s}
.drop[data-open]>button::after{transform:rotate(-135deg);margin-top:3px}
/* ABOVE THE BAND. The band under the nav has a transform (its own
   compositor layer), which stacks it like a positioned element at z 0 and
   later in the tree than the menu - so the animated stripe was painted
   straight across the top of the open menu, on every width (seen on the
   phone and at 1280px, 2026-09-04). A z-index above 0 inside the header's
   own stacking context puts the menu over it. */
/* 320px, not 250 (2026-09-05): with nine rows instead of four, a 250px
   column wrapped most explanations onto two lines.

   IT DOES NOT REMOVE THE MENU'S OWN SCROLLBAR, and the first version of
   this comment said it did (review, 2026-09-05). Measured with the menu
   open at 1280x800 at 250, 320, 340, 360, 380 and 400px: it overflows the
   `calc(100vh - 130px)` cap at every one of them, because ten rows with a
   44px floor are taller than 670px whatever their width. Docs, Support and
   Terms sit below the menu's own fold there - and all three are one click
   away on the bar at that width, which is why this is a wrapping fix and
   not a reachability one.

   RE-MEASURED after the /#updates row came back (review, 2026-09-05):
   eleven rows, scrollHeight 921 against a 668px box at 1280x800, and at
   440x956 the menu is 777px inside an 826px cap - so on the phone, where
   the bar carries nothing, every row is still drawn without scrolling. */
.menu{position:absolute;top:calc(100% + 10px);left:-14px;min-width:320px;
  z-index:5;
  background:var(--surface-1);border:1px solid var(--edge);border-radius:12px;
  padding:8px;display:none;box-shadow:0 18px 44px rgba(0,0,0,.5)}
.drop[data-open] .menu{display:block}
/* With scripts blocked the menu still opens on hover and on keyboard
   focus, so the one nav control that uses script keeps working for
   people who browse with JavaScript off. */
.drop:hover .menu,.drop:focus-within .menu{display:block}
/* THE SCRIPT OWNS THE MENU WHEN IT IS THERE (2026-09-09). Hover and bare
   focus must not hold the menu open against the script's close paths: a
   second click, Escape, a click outside or focus leaving the control all
   remove data-open, and this rule is what makes the menu actually
   contract then - a focused button used to keep it on screen after every
   one of those (the visitor's report: it expands but does not contract).
   Without JavaScript nothing sets data-js, so the rule above still
   carries the no-script menu. */
.drop[data-js]:not([data-open]) .menu{display:none}
.menu a{display:block;padding:10px 12px;border-radius:8px;color:var(--text-2);
  font-size:14.5px}
.menu a:hover{background:var(--surface-3);color:var(--text-1);
  text-decoration:none}
.menu a b{display:block;color:var(--text-1);font-weight:600}
.menu a span{font-size:13px;color:var(--text-3)}
/* THE MENU CARRIES EVERY DESTINATION (2026-09-05), so it is now nine rows
   rather than four and on a short phone it could run off the bottom of the
   screen. It scrolls inside itself instead: the header measures 67px at
   440x956 after this change, and the room below it is what the menu may
   use, with a margin for a browser's own bars. */
.menu{max-height:calc(100vh - 130px);overflow-y:auto}
.menu-rule{height:1px;background:var(--edge);margin:7px 10px}
.cta{background:linear-gradient(135deg,var(--gold-lit) 0%,var(--gold) 46%,var(--gold) 68%,var(--gold-lit) 100%);box-shadow:inset 0 1px 0 #ffffff40,inset 0 -1px 0 #00000026;color:var(--surface-0);font-weight:600;font-size:14.5px;
  padding:9px 18px;border-radius:9px;border:0;cursor:pointer}
.cta:hover{filter:brightness(1.08);text-decoration:none}
.ghost{border:1px solid var(--edge);color:var(--text-1);padding:9px 18px;
  border-radius:9px;font-size:14.5px}
.ghost:hover{border-color:var(--gold-dim);text-decoration:none}

/* ---- shared blocks ---------------------------------------------------- */
.wrap{max-width:1080px;margin:0 auto;padding:0 22px}
section{padding:72px 0}
.eyebrow{font:600 12px var(--body);letter-spacing:.22em;
  text-transform:uppercase;color:var(--gold-text)}
h1{font:600 clamp(34px,5.2vw,54px)/1.12 var(--display);color:var(--text-1);
  letter-spacing:.01em;margin:14px 0 18px}
h2{font:600 clamp(24px,3.2vw,32px)/1.2 var(--display);color:var(--text-1);
  margin:12px 0 10px;position:relative;display:inline-block;padding-bottom:12px}
h2::after{content:'';position:absolute;left:0;bottom:0;width:64px;height:3px;
  background:var(--band);background-size:200% 100%;
  animation:drift 11s linear infinite;
  transform:translateZ(0);will-change:background-position}
h3{font:600 17px var(--body);color:var(--text-1);margin-bottom:6px}
.lead{font-size:18px;max-width:56ch}
.grid{display:grid;gap:18px;margin-top:34px}
.g3{grid-template-columns:repeat(3,1fr)}
.g2{grid-template-columns:repeat(2,1fr)}
.card{background:var(--surface-1);border:1px solid var(--edge);
  border-radius:14px;padding:24px}
.card p{font-size:14.5px;color:var(--text-2)}
.feather{width:26px;height:8px;border-radius:4px;margin-bottom:14px}
.mono{font-family:var(--mono);font-size:13.5px}
footer{border-top:1px solid var(--edge);padding:34px 0 44px;margin-top:40px;
  color:var(--text-3);font-size:13.5px}
footer .wrap{display:flex;gap:22px;flex-wrap:wrap;align-items:center}
/* THE FOOTER SAYS WHAT IT COSTS (2026-09-05). It used to be one row of
   links and a slogan; the site had no price, no copyright line, no privacy
   statement and no contact on any of its seventeen pages. It is now a
   short column: the doors, then three sentences a buyer needs, then the
   fine print. Stacked rather than in a row because these are sentences,
   and a sentence in a flex row wraps into a ransom note. */
footer .wrap.foot{display:block}
.foot-links{display:flex;gap:20px;flex-wrap:wrap;margin-bottom:16px}
.foot-columns{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 48px}
.foot-say{max-width:56ch;color:var(--text-2);font-size:13px;line-height:1.7}
.foot-say a{text-decoration:underline;text-underline-offset:3px}
.foot-bottom{display:flex;justify-content:space-between;align-items:center;
  flex-wrap:wrap;gap:12px 24px;border-top:1px solid var(--edge);margin-top:24px;padding-top:14px}
.foot-fine{color:var(--text-3);font-size:12px}
.foot-contact{display:flex;gap:8px 20px;flex-wrap:wrap;font-size:12px}
.foot-contact a{display:inline-flex;align-items:center;min-height:44px;min-width:44px}
@media (max-width:560px){
  .foot-columns{grid-template-columns:minmax(0,1fr)}
  .foot-bottom{gap:4px}
}

/* ---- hero panel mock --------------------------------------------------- */
.hero{display:grid;grid-template-columns:1.05fr 1fr;gap:44px;
  align-items:center;padding:84px 0 72px}
.panel{background:var(--surface-1);border:1px solid var(--edge);
  border-radius:16px;overflow:hidden;box-shadow:0 30px 70px rgba(0,0,0,.45)}
.panel-top{display:flex;align-items:center;gap:10px;padding:12px 16px;
  position:relative;border-bottom:1px solid var(--edge)}
.panel-top::after{content:'';position:absolute;left:0;right:0;bottom:-1px;
  height:3px;background:var(--band);background-size:200% 100%;
  animation:drift 11s linear infinite;
  transform:translateZ(0);will-change:background-position}
.panel-title{font:600 13px var(--display);letter-spacing:.18em;
  color:var(--text-1)}
.pill{margin-left:auto;font-size:11.5px;color:var(--text-3);
  border:1px solid var(--edge);border-radius:99px;padding:3px 10px}
.chat{padding:18px 16px 16px;display:flex;flex-direction:column;gap:12px;
  min-height:240px}
.msg{max-width:88%;padding:10px 13px;border-radius:12px;font-size:14px;
  line-height:1.55}
.me{align-self:flex-end;background:var(--surface-3);color:var(--text-1)}
.ai{align-self:flex-start;background:var(--surface-2);border:1px solid var(--edge)}
.ai .who{font-size:11px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--gold-text);margin-bottom:5px}
.caret{display:inline-block;width:7px;height:15px;background:var(--gold);
  vertical-align:text-bottom;animation:blink 1.1s steps(1) infinite}
@keyframes blink{50%{opacity:0}}
.composer{margin:0 16px 16px;border:1px solid var(--edge);border-radius:11px;
  padding:11px 14px;color:var(--text-3);font-size:14px}

/* ---- terminal --------------------------------------------------------- */
.term{background:var(--surface-sunken);border:1px solid var(--edge);border-radius:12px;
  padding:18px 20px;font:13.5px/1.7 var(--mono);color:var(--text-2);
  overflow-x:auto}
.term .ok{color:var(--teal)}
.term .dim{color:var(--text-3)}

/* ---- releases table ---------------------------------------------------- */
.rel{width:100%;border-collapse:collapse;margin-top:26px;font-size:14.5px}
.rel th{text-align:left;font:600 12px var(--body);letter-spacing:.16em;
  text-transform:uppercase;color:var(--text-3);padding:10px 12px;
  border-bottom:1px solid var(--edge)}
.rel td{padding:12px;border-bottom:1px solid var(--edge);vertical-align:top}
.rel td:first-child{color:var(--text-1);font-weight:600}
.sha{color:var(--text-3);font-size:12px;word-break:break-all}

@media (max-width:880px){
  .hero{grid-template-columns:1fr;padding-top:52px}
  .g3,.g2{grid-template-columns:1fr}
  section{padding:52px 0}
  .nav{gap:16px}
}
/* A phone's nav is four items wide at most, and the button must never
   leave the screen: fixed chrome gets its own budget, and 375px is a
   real width, not an edge case. */
@media (max-width:520px){
  /* WRAP, NEVER CLIP. Measured at a 375px viewport: the one-row nav
     needed about 432px, so the button was cut off-screen on every iPhone
     short of a Max. A second row is layout; a clipped button is a defect. */
  .nav{gap:8px 13px;padding:10px 14px;flex-wrap:wrap}
  .logo{font-size:16px}
  .logo img{height:20px!important;width:20px!important}
  .cta{padding:8px 12px;font-size:13px;white-space:nowrap}
  .drop>button,.nav a.nlink{font-size:13.5px}
  /* On a phone the nav wraps to two rows, and a menu hung from the first
     row covered the second row and the band. Hang it from the header
     instead: the sticky header is the containing block once the trigger
     is static, so the menu opens below the whole nav, full width. */
  .drop{position:static}
  .menu{left:10px;right:10px;top:calc(100% + 6px);min-width:0}
}

/* ---- hero artwork (2026-09-04) ----------------------------------------
   The product's mark, large and faint, behind the words; a glow behind the
   panel; a note under the button; three steps under the hero. All of it in
   tokens. The watermark is decoration and is clipped to the hero. */
.hero{position:relative}
/* The glow is drawn 8% past the hero's right edge (below); without this
   the page scrolled sideways on a 440px phone. Measured at 440x956 after
   the change: scrollWidth 440, clientWidth 440. */
html,body{overflow-x:hidden}
.hero-mark{position:absolute;left:-40px;top:50%;width:min(520px,60vw);
  height:min(520px,60vw);transform:translateY(-52%);opacity:.075;
  pointer-events:none;z-index:0}
.hero-copy,.hero .panel{position:relative;z-index:1}
/* The glow sits on the HERO, not the panel: .panel clips its children
   (overflow:hidden for the band's edge), so a glow drawn inside it would
   be cut to the card. Placed over the panel's column. */
.hero::after{content:'';position:absolute;right:-8%;top:4%;width:60%;
  height:92%;z-index:0;pointer-events:none;
  background:radial-gradient(55% 55% at 55% 42%,rgba(23,163,152,.17),transparent 70%),
             radial-gradient(38% 38% at 28% 84%,rgba(227,187,79,.10),transparent 70%)}
.hero-note{margin-top:14px;font-size:14px;color:var(--text-3);max-width:44ch}
.steps{list-style:none;display:grid;grid-template-columns:repeat(3,1fr);
  gap:16px;margin:0 0 20px;padding:0}
.steps li{background:var(--surface-1);border:1px solid var(--edge);
  border-radius:14px;padding:18px 20px 20px;display:grid;
  grid-template-columns:auto 1fr;grid-template-rows:auto auto;
  column-gap:14px;row-gap:6px;align-items:start}
.steps .step-n{grid-row:1/3;width:34px;height:34px;border-radius:50%;
  background:var(--gold);color:var(--surface-0);font:700 15px var(--body);
  display:grid;place-items:center}
.steps b{font:600 16px var(--body);color:var(--text-1)}
.steps li>span:last-child{font-size:14px;color:var(--text-2);line-height:1.55}
.steps .mono{font-size:12.5px}
@media (max-width:880px){
  .hero-mark{left:-80px;opacity:.06}
  .steps{grid-template-columns:1fr}
}
/* 44px TARGETS WHEREVER A FINGER IS THE POINTER (2026-09-04). The pager
   had the rule; the nav links, both buttons and the footer links measured
   20-37px tall, the logo 20px, and "Docs" measured 29px wide. Keyed off
   the pointer, not the width: a touch laptop is a wide screen being poked
   at. Links inside sentences keep their line height (the inline exception
   in WCAG 2.5.8); everything that stands on its own gets 44px both ways.
   devad/test_site_pages.py measures every link and button at 440x956. */
/* ANY COARSE POINTER, NOT ONLY THE PRIMARY ONE (2026-09-05). Keyed on
   `pointer:coarse` alone, a Windows 2-in-1 or touchscreen laptop with a
   trackpad attached reports `pointer:fine` and got 24px nav links and 22px
   footer links for a finger - measured on the 1280x800 run. `any-pointer`
   asks whether a coarse pointer exists at all, which is the question.
   And the rule is scoped to the footer's row of DOORS: the footer now
   carries sentences with links inside them, and those keep their line
   height under WCAG 2.5.8's own inline exception. */
@media (pointer:coarse),(any-pointer:coarse){
  /* A MENU ROW IS TWO LINES, NOT ONE (2026-09-05). `.menu a` was in the
     inline-flex group below, which turned each row's name and its
     explanation into flex siblings on one line - "ChatTalk with a model
     that runs on your computer", read on a phone at 440x956. The row is a
     block with padding and is already past 44px tall; it only needed the
     floor, not a new layout. */
  .menu a{min-height:44px}
  .nav a.nlink,.drop>button,.foot-links a,.foot-theme{min-height:44px;
    display:inline-flex;align-items:center}
  .nav a.nlink,.foot-links a,.foot-theme{min-width:44px;justify-content:center}
  .logo{min-height:44px}
  .cta,.ghost{min-height:44px;display:inline-flex;align-items:center;
    justify-content:center}
}

/* COLLAPSED, NEVER DELETED (2026-09-05). This was
   `.nav .nlink.thin{display:none}` inside the 880px block, and it was a
   deletion: measured on a served copy of site/ at 440x956, the header on
   the home page, /docs/, /support/ and /terms/ reached three of the six
   public destinations, and the nearest link to the handbook sat 7,434 px
   down a 7,588 px page. A tablet in portrait was treated the same way,
   with room on the bar for every link.

   Two things changed. The Menu carries every destination at every width
   now (site_build.py), so folding a bar link away costs nothing - the door
   moves from no taps to one, instead of from one to none. And the width
   where the bar folds follows the controls it carries. The five links,
   mark, Menu, Search and Download need about 800 px with touch targets.
   Below that width the links remain one tap away in the Menu.

   IT SITS AT THE END OF THE FILE ON PURPOSE. The coarse-pointer block
   above sets `display:inline-flex` on `.nav a.nlink` at the same
   specificity, so with this rule written earlier the later one won and
   every "hidden" link came back on any touch device - which is every
   phone. Measured at 440x956 with touch emulation: four bar links drawn
   44px tall inside a 119px header that was supposed to have folded them
   away. devad/test_site_words.py counts what is actually reachable, at
   both sizes, in a browser. */
@media (max-width:800px){
  .nav a.nlink{display:none}
}

/* ---- measured (2026-09-12) ------------------------------------------ */
/* The comparison block on the home page and the /measured/ page. A table
   in the releases table's own dress; the leader column is words, never a
   colour alone; "no verified work" and "not measured" are printed as the
   harness printed them. */
.measured{width:100%;border-collapse:collapse;margin-top:26px;font-size:14.5px}
.measured th{text-align:left;font:600 12px var(--body);letter-spacing:.16em;
  text-transform:uppercase;color:var(--gold-text);padding:10px 12px;
  border-bottom:1px solid var(--edge-lit)}
.measured td{padding:12px;border-bottom:1px solid var(--edge);vertical-align:top;
  color:var(--text-2)}
.measured tbody th{font:600 15px var(--body);letter-spacing:0;text-transform:none;
  color:var(--text-1);padding:12px;border-bottom:1px solid var(--edge)}
.measured-note{margin-top:14px;font-size:14px;color:var(--text-3);max-width:70ch}
.measured-body h1{display:none}
/* THE REPORT'S OWN TITLE STAYS HIDDEN AS AN H2 TOO (2026-09-19, S11). The
   machine-generated report used to open with a second <h1> on a page that
   already has one above (line ~87); the rule above hid it so the two never
   competed for a screen reader's "jump to heading 1". Demoting the tag to
   h2 is the actual S11 fix - a real page can have one h1 - but this
   report's OWN copy of the title is still redundant with the visible one
   above it, so report-title keeps it exactly as invisible as it always
   was, by class rather than by tag. */
.measured-body h2.report-title{display:none}
.measured-body h2{margin-top:40px}
.measured-body ul{margin:14px 0 0 22px;color:var(--text-2)}
.measured-body li{margin:6px 0}
.measured-body p{margin-top:14px;max-width:72ch}
.measured-body code,.measured-note code{font-family:var(--mono);font-size:13px;
  background:var(--surface-sunken);border:1px solid var(--edge);border-radius:6px;padding:1px 6px}
.page{padding:48px 22px 72px}
.page h1{font:600 clamp(28px,3.6vw,38px)/1.15 var(--display);color:var(--text-1);margin:10px 0 14px}
@media (max-width:700px){
  .measured{display:block;overflow-x:auto;white-space:nowrap}
}

.skip-link{position:fixed;top:8px;left:8px;z-index:100;padding:10px 18px;
  background:var(--gold);color:var(--surface-0);transform:translateY(-160%)}
.skip-link:focus{transform:none}
.home-page .nav,.home-page .wrap{max-width:1240px}
.home-page .nav{padding-top:18px;padding-bottom:18px}
.home{--home-radius:22px}
.home section{scroll-margin-top:108px}
.home h2{font-weight:400;letter-spacing:-.02em;padding-bottom:0;display:block}
.home h2::after{display:none}
.home p{overflow-wrap:break-word}
.home-hero{display:grid;grid-template-columns:minmax(0,.86fr) minmax(0,1.14fr);
  gap:48px;align-items:center;padding:78px 0 64px}
.home-intro{min-width:0}
.home-intro>.eyebrow{display:flex;gap:10px;align-items:center;font-size:10px;
  letter-spacing:.17em}
.beta-dot{width:7px;height:7px;background:var(--gold);border-radius:50%;flex:none;
  box-shadow:0 0 0 4px var(--surface-2)}
.home h1{font-size:clamp(48px,5.6vw,76px);line-height:1.04;font-weight:400;
  letter-spacing:-.045em;margin:22px 0}
.home h1 em{font-weight:400;color:var(--gold);letter-spacing:-.055em}
.home-lead{max-width:38ch;font-size:17px;line-height:1.7;color:var(--text-2)}
.home-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:28px}
.home-actions .cta,.home-actions .ghost{display:inline-flex;align-items:center;
  justify-content:center;gap:14px;min-height:48px;padding:12px 19px;font-size:14px;
  white-space:normal;text-align:center}
.home-actions .cta span,.home-actions .ghost span{font-size:18px}
.home-note{font-size:12px;color:var(--text-3);margin-top:14px;line-height:1.7}
.home-note a{text-decoration:underline;text-underline-offset:3px}
.theme-cycle{display:inline-flex;align-items:center;gap:10px;background:none;
  border:0;color:var(--text-3);font:12px var(--body);padding:10px 0;
  margin-top:22px;min-height:44px;cursor:pointer;text-align:left}
.theme-cycle:hover{color:var(--text-1)}
.theme-cycle kbd{border:1px solid var(--edge-lit);border-radius:5px;
  padding:2px 6px;font:11px var(--mono)}
.theme-names{font-size:12px;color:var(--text-3);margin-top:2px;
  letter-spacing:.01em}
.theme-dots{display:flex;padding-left:2px;flex:none}
.theme-dots i{width:13px;height:13px;border-radius:50%;border:2px solid var(--surface-0);
  margin-left:-2px;background:#17a398}
.theme-dots i:nth-child(2){background:#e3bb4f}
.theme-dots i:nth-child(3){background:#6b3fa0}
.theme-dots i:nth-child(4){background:#eaeff0}
.workspace-preview{min-width:0;border:1px solid var(--edge-lit);
  border-radius:var(--home-radius);background:var(--surface-1);position:relative;
  box-shadow:0 28px 70px rgba(0,0,0,.2),0 0 65px rgba(23,163,152,.06)}
.workspace-preview::before{content:'';position:absolute;top:-1px;left:24px;right:24px;
  height:1px;background:var(--band)}
.workspace-top{display:flex;align-items:center;gap:10px;padding:16px 20px;
  border-bottom:1px solid var(--edge);min-width:0}
.workspace-wordmark{font:600 15px var(--display);color:var(--text-1);letter-spacing:.05em}
.preview-label{margin-left:auto;font:10px var(--mono);color:var(--text-3)}
.workspace-shell{display:grid;grid-template-columns:132px minmax(0,1fr)}
.preview-sidebar{background:var(--surface-sunken);border-right:1px solid var(--edge);
  display:flex;flex-direction:column;gap:7px;padding:20px 10px 16px;min-width:0}
.sidebar-label{font:9px var(--body);text-transform:uppercase;letter-spacing:.1em;
  color:var(--text-3);padding:0 8px 10px}
.sidebar-item{display:flex;align-items:center;gap:10px;padding:8px 10px;
  font-size:12px;border:1px solid transparent;border-radius:7px;color:var(--text-3)}
.sidebar-item>span{font-size:15px;color:var(--gold-text);width:15px;text-align:center}
.sidebar-item.selected{background:var(--surface-2);border-color:var(--edge);
  color:var(--text-1)}
.sidebar-foot{margin-top:auto;padding-top:32px;display:flex;align-items:center;
  flex-direction:column;gap:4px;font:10px var(--display);color:var(--text-3)}
.preview-conversation{padding:20px;min-width:0}
.preview-session{display:flex;justify-content:space-between;gap:8px;align-items:center;
  font-size:10px;color:var(--text-3);margin-bottom:24px}
.model-label{border:1px solid var(--edge-lit);border-radius:20px;padding:3px 7px;
  font:9px var(--mono);white-space:nowrap}
.preview-user{max-width:92%;width:fit-content;margin-left:auto;background:var(--surface-3);
  border:1px solid var(--edge-lit);padding:10px 13px;border-radius:12px 12px 2px 12px;
  color:var(--text-1);font-size:12px}
.preview-answer{margin:24px 0 22px}
.preview-author{display:flex;align-items:center;gap:7px;color:var(--gold-text);
  font-size:11px;font-weight:600}
.preview-author span{font-size:9px;font-weight:400;color:var(--text-3)}
.preview-answer .preview-title{font:400 clamp(24px,2.2vw,30px)/1.2 var(--display);
  letter-spacing:-.025em;color:var(--text-1);margin:14px 0 10px}
.preview-answer>p:not(.preview-title){font-size:12px;line-height:1.65;max-width:42ch}
.preview-ideas{margin-top:18px;display:grid;gap:8px}
.preview-ideas>div{display:flex;align-items:center;gap:11px;padding:10px 12px;
  background:var(--surface-2);border:1px solid var(--edge);border-radius:9px}
.idea-number{font:11px var(--mono);color:var(--gold-text)}
.preview-ideas b{display:block;font-size:11px;color:var(--text-1);font-weight:500}
.preview-ideas small{display:block;font-size:10px;color:var(--text-3)}
.preview-compose{display:flex;align-items:center;gap:12px;justify-content:space-between;
  padding:9px 10px 9px 13px;border:1px solid var(--edge-lit);border-radius:10px;
  background:var(--surface-sunken);font-size:11px;color:var(--text-3)}
.compose-arrow{display:grid;place-items:center;width:25px;height:25px;border-radius:6px;
  background:var(--gold);color:var(--surface-0);font-size:18px}
.workspace-preview figcaption{padding:10px 14px;border-top:1px solid var(--edge);
  font-size:10px;text-align:center;color:var(--text-3)}
.home-strip{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));
  border-top:1px solid var(--edge);border-bottom:1px solid var(--edge);padding:19px 0;gap:14px}
.home-strip p{font-size:12px;color:var(--text-2);text-align:center}
.home-strip span{font:11px var(--mono);color:var(--gold-text);margin-right:10px}
.home-heading{padding:72px 0 26px}
.home-heading h2{font-size:clamp(30px,3.5vw,44px);margin-top:16px}
.feature-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;align-items:start}
.home .feature-card{padding:32px;border:1px solid var(--edge);border-radius:var(--home-radius);
  background:var(--surface-1);min-width:0}
.home .feature-card>.eyebrow{font-size:10px;letter-spacing:.16em}
.home .feature-card h2{font-size:30px;margin:16px 0}
.feature-card>p:not(.eyebrow){font-size:14px;max-width:49ch;line-height:1.75}
.feature-chat,.feature-agents{min-height:350px}
.model-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:24px}
.model-tags span{font:11px var(--mono);border:1px solid var(--edge-lit);
  padding:7px 10px;border-radius:7px;color:var(--text-2);background:var(--surface-sunken)}
.agent-recipe{display:flex;align-items:center;flex-wrap:wrap;gap:9px;
  margin:24px 0;font:11px var(--mono);color:var(--text-2)}
.agent-recipe>span{display:flex;align-items:center;gap:8px;border:1px solid var(--edge-lit);
  background:var(--surface-sunken);padding:8px 10px;border-radius:7px}
.agent-recipe>b{font-weight:400;color:var(--text-3)}
.agent-recipe i{width:6px;height:6px;border-radius:50%;background:var(--violet)}
.agent-recipe>span:nth-of-type(2) i{background:var(--teal)}
.agent-recipe>span:nth-of-type(3) i{background:var(--gold)}
.home-details{margin-top:24px;border-top:1px solid var(--edge);min-width:0}
.home-details summary{padding:14px 26px 14px 0;color:var(--gold-text);font-size:13px;
  cursor:pointer;position:relative;min-height:48px;list-style:none}
.home-details summary::-webkit-details-marker{display:none}
.home-details summary::after{content:'+';position:absolute;right:2px;top:11px;
  font:20px var(--mono);color:var(--gold-text)}
.home-details[open]>summary::after{content:'−'}
.home-details summary:hover{color:var(--text-1)}
.home-details>div{font-size:14px;color:var(--text-2);padding-bottom:6px}
.home-details>div>p+p{margin-top:12px}
.home-details a{text-decoration:underline;text-underline-offset:3px}
.home .control-band{display:grid;grid-template-columns:220px minmax(0,1fr);gap:54px;
  align-items:center;margin-top:26px;padding:42px;border:1px solid var(--edge-lit);
  border-radius:var(--home-radius);background:var(--surface-sunken)}
/* NO PLATE UNDER THE MARK (2026-09-23). This sat the 220px mark on an opaque
   --surface-1 coin with its own border - the one place on the site where the
   mark was literally mounted on a disc. The mark is glass now and the band's
   own ground shows through it, so the coin is gone. */
.control-art{display:grid;place-items:center;aspect-ratio:1;max-width:100%}
.control-art img{width:85%;height:auto;display:block;max-width:100%}
.control-art .priest-mark-glass{width:85%;max-width:100%}
.control-art .priest-mark{width:100%;height:auto;display:block}
.control-band h2{font-size:38px;margin:14px 0}
.control-band p:not(.eyebrow){max-width:65ch;font-size:14px}
.home .home-section{padding:72px 0 52px}
.section-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;
  margin-bottom:28px}
.section-heading h2{font-size:38px;margin:14px 0 0}
.text-link{display:inline-flex;align-items:center;gap:14px;min-height:44px;
  font-size:13px;text-decoration:underline;text-underline-offset:4px}
.quick-specs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;
  border:1px solid var(--edge);border-radius:16px;padding:22px 24px;background:var(--surface-1)}
.quick-specs dt{font:10px var(--mono);text-transform:uppercase;letter-spacing:.06em;
  color:var(--text-3);margin-bottom:6px}
.quick-specs dd{font-size:15px;color:var(--text-1)}
.install-path{list-style:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));
  gap:24px;margin:30px 0 0}
.install-path li{display:flex;align-items:flex-start;gap:14px}
.path-number{flex:none;display:grid;place-items:center;width:32px;height:32px;
  border:1px solid var(--gold-dim);color:var(--gold-text);font:12px var(--mono);border-radius:50%}
.install-path h3{font-size:15px;font-weight:500;margin:3px 0 8px}
.install-path p{font-size:13px;line-height:1.75}
.home-duo{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;align-items:start}
.home-duo .text-link{margin-top:16px}
.home .evidence-scroll{max-width:100%;overflow-x:auto}
.home .evidence-scroll h2{font-size:24px}
.home .measured{display:table;white-space:normal;font-size:12px}
.home .measured th,.home .measured td{padding:10px 8px;min-width:90px}
.home .measured tbody th{font-size:13px}
.home .measured-note{font-size:12px}
.home .proof-band{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.8fr);gap:54px;
  align-items:center;padding:60px 0}
.proof-band h2{font-size:32px;margin:16px 0}
.proof-band p:not(.eyebrow){font-size:14px;max-width:54ch}
.proof-command{background:var(--surface-sunken);border:1px solid var(--edge);
  border-radius:16px;padding:24px;min-width:0}
.command-label{font:10px var(--mono);color:var(--text-3)}
.proof-command pre{font:15px var(--mono);color:var(--gold-text);padding:18px 0;
  max-width:100%;overflow-x:auto}
.proof-command code{font:inherit}
.proof-command p{font-size:12px!important;color:var(--text-3)}
.proof-command .text-link{font-size:12px;margin-top:10px}
.home .closing-card{text-align:center;border:1px solid var(--edge-lit);
  border-radius:var(--home-radius);padding:48px 24px;background:var(--surface-1);position:relative}
.closing-card::before{content:'';position:absolute;height:2px;left:30px;right:30px;top:0;
  background:var(--band)}
.closing-card>img,.closing-card>.priest-mark-glass{margin-bottom:12px}
.closing-card h2{font-size:56px;margin:12px 0}
.closing-card>p:not(.eyebrow){font-size:14px;line-height:1.9}
.closing-card .home-actions{justify-content:center}
.home-page footer{margin-top:56px}
@media (max-width:1080px){
  .home-hero{gap:28px;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr)}
  .workspace-shell{grid-template-columns:100px minmax(0,1fr)}
  .preview-sidebar{padding-left:6px;padding-right:6px}
  .sidebar-label{font-size:8px;padding-left:5px}
  .sidebar-item{padding:8px 5px;gap:7px;font-size:11px}
  .preview-conversation{padding:16px}
  .home-actions{gap:10px}
  .home-actions .cta,.home-actions .ghost{padding-left:14px;padding-right:14px;font-size:13px}
}
@media (max-width:800px){
  .home-hero{grid-template-columns:minmax(0,1fr);gap:38px;padding:48px 0 32px}
  .home-intro{max-width:620px}
  .home h1{font-size:clamp(48px,9vw,70px)}
  .home-lead{max-width:48ch}
  .home-intro .theme-cycle{margin-top:14px}
  .workspace-shell{grid-template-columns:140px minmax(0,1fr)}
  .preview-sidebar{padding:20px 12px}
  .sidebar-label{font-size:9px}
  .sidebar-item{font-size:12px}
  .preview-conversation{padding:22px}
  .home-strip{gap:10px;padding:16px 0}
  .home-strip p{font-size:11px}
  .home-strip span{display:block;margin:0 0 3px}
  .home-heading{padding-top:48px}
  .home .feature-card{padding:24px}
  .feature-chat,.feature-agents{min-height:0}
  .home .control-band{grid-template-columns:130px minmax(0,1fr);gap:26px;padding:28px}
  .control-band h2,.section-heading h2{font-size:32px}
  .home .proof-band{gap:28px}
  .quick-specs{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}
  .install-path{gap:16px}
  .install-path li{display:block}
  .path-number{margin-bottom:12px}
}
@media (max-width:560px){
  .home-page .nav{padding-top:10px;padding-bottom:10px}
  .home{padding:0 18px}
  .home h1{font-size:54px}
  .home-lead{font-size:16px;max-width:36ch}
  .home-intro>.eyebrow{font-size:9px}
  .home-actions{margin-top:24px}
  .workspace-top{padding:12px 14px}
  .workspace-wordmark{font-size:14px}
  .preview-label{font-size:9px}
  .workspace-shell{grid-template-columns:minmax(0,1fr)}
  .preview-sidebar{display:none}
  .preview-conversation{padding:18px}
  .preview-session{margin-bottom:18px}
  .preview-answer{margin:20px 0 18px}
  .preview-answer .preview-title{font-size:28px}
  .workspace-preview figcaption{font-size:9px}
  .home-strip p{font-size:10px;line-height:1.6}
  .feature-grid,.home-duo{grid-template-columns:minmax(0,1fr);gap:14px}
  .home .feature-card h2{font-size:28px}
  .home .control-band{grid-template-columns:minmax(0,1fr);padding:26px;margin-top:20px;gap:24px}
  .control-art{width:110px}
  .control-band h2{font-size:32px}
  .section-heading{display:block}
  .section-heading .text-link{margin-top:14px}
  .quick-specs{padding:20px;gap:22px 16px}
  .quick-specs dd{font-size:13px}
  .install-path{grid-template-columns:minmax(0,1fr);gap:22px}
  .install-path li{display:flex}
  .home .home-section{padding:48px 0 36px}
  .home .proof-band{grid-template-columns:minmax(0,1fr);padding:40px 0;gap:24px}
  .home .closing-card{padding:36px 22px}
  .closing-card h2{font-size:44px}
}
@media (max-width:360px){
  .home h1{font-size:48px}
  .home-actions{align-items:stretch}
  .home-actions .cta,.home-actions .ghost{flex:1 1 auto}
  .preview-author span{font-size:8px}
  .agent-recipe{gap:6px;font-size:10px}
  .agent-recipe>span{gap:5px;padding:7px}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
}

/* The product has three scales: a personal workspace, a development
   practice, and a company pilot. The layout gives each a clear address. */
.home-page .wrap,.home-page .nav{max-width:1240px}
.home{--home-radius:14px}
.home-hero{position:relative;isolation:isolate;grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  padding:90px 0 68px;gap:56px}
.home-intro{position:relative;z-index:1}
.home h1{font-size:clamp(58px,6.5vw,88px);line-height:1.02;letter-spacing:-.055em;
  margin:28px 0}
.home h1 em{letter-spacing:-.06em}
.home-intro>.eyebrow{font-size:10px;letter-spacing:.13em;line-height:1.65}
.home-lead{font-size:18px;max-width:42ch;line-height:1.75}
.start-planner{display:grid;grid-template-columns:1fr 1fr;gap:48px;margin-top:48px;
  padding:36px;border:1px solid var(--edge-lit);border-radius:14px;background:var(--surface-1);
  position:relative;overflow:hidden}
.start-planner::before{content:'';position:absolute;inset:0 0 auto;height:5px;
  background:var(--band);background-size:200% 100%;animation:drift 17s linear infinite;
  transform:translateZ(0);will-change:background-position}
.start-planner h2{font-size:34px;margin:14px 0}
.start-planner h3{font:28px/1.25 var(--display);margin:14px 0 24px}
.start-planner p{font-size:14px}
.start-planner label{display:block;font-size:12px;color:var(--text-2)}
.guide-search{margin-top:24px}
.start-planner input,.start-planner select{display:block;width:100%;min-width:0;min-height:46px;
  margin-top:8px;padding:10px 12px;border:1px solid var(--edge-lit);border-radius:6px;
  background:var(--surface-sunken);color:var(--text-1);font:14px var(--body)}
.start-planner input::placeholder{color:var(--text-3);opacity:1}
#guide-count{font-size:12px;color:var(--text-3);margin-top:6px;min-height:20px}
.guide-results{display:grid;grid-template-columns:1fr 1fr;gap:4px 16px;margin-top:12px}
.guide-results a{display:flex;justify-content:space-between;gap:8px;align-items:center;
  min-height:48px;font-size:13px;border-bottom:1px solid var(--edge)}
.fit-fields{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.fit-result{margin-top:24px;padding:20px;border-left:3px solid var(--gold);background:var(--surface-sunken)}
.fit-result h4{font-size:16px;color:var(--text-1);margin-bottom:8px}
.fit-note{font-size:12px!important;color:var(--text-3);margin-top:12px}
@media(max-width:800px){.start-planner{grid-template-columns:1fr;gap:32px;padding:26px}}
@media(max-width:400px){.start-planner{padding:20px}.fit-fields,.guide-results{grid-template-columns:1fr}}
.product-tour{display:grid;grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr);
  gap:64px;align-items:center;padding:78px 0 36px}
.product-tour-intro h2{font-size:clamp(32px,3.7vw,48px);line-height:1.14;margin:20px 0}
.product-tour-intro h2 em{color:var(--gold);font-weight:400}
.product-tour-intro>p:not(.eyebrow){max-width:34ch;font-size:16px;line-height:1.8}
.product-tour-intro .text-link{margin-top:20px}
.workspace-preview{border-radius:14px;
  box-shadow:10px 14px 0 var(--surface-sunken),10px 14px 0 1px var(--edge),0 32px 70px rgba(0,0,0,.18)}
.workspace-preview::before{left:0;right:0;height:2px}
.workspace-top{padding:18px 20px}
.preview-conversation{padding:23px 20px}
.preview-sidebar{border-radius:0 0 0 12px}
.home-actions .cta{border-radius:6px}
.home-actions .ghost{border-radius:6px;border-color:var(--edge-lit)}
.theme-palette{display:flex;flex-wrap:wrap;gap:4px;margin-top:28px;max-width:490px}
.theme-palette button{display:inline-flex;align-items:center;gap:6px;min-height:44px;
  padding:8px 9px;border:1px solid transparent;border-radius:6px;background:transparent;
  color:var(--text-3);font:11px var(--body);cursor:pointer}
.theme-palette button:hover{background:var(--surface-1);color:var(--text-1)}
.theme-palette button[aria-pressed="true"]{border-color:var(--edge-lit);
  color:var(--text-1);background:var(--surface-1)}
.theme-palette i{height:11px;width:11px;flex:none;border-radius:50%;background:#c4a2ff;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.25)}
.theme-palette [data-site-theme-select="ember"] i{background:#dea25a}
.theme-palette [data-site-theme-select="moss"] i{background:#719367}
.theme-palette [data-site-theme-select="paper"] i{background:#f3edf9}
.theme-palette [data-site-theme-select="vigil"] i{background:#5a78a3}
.theme-palette [data-site-theme-select="reliquary"] i{background:#d9c6a0}
/* THE TWINS' DOTS SAY BOTH THINGS (2026-09-19). Every dot above is a flat
   colour, and a new name with no rule of its own quietly inherits Night's
   lavender - which is how Lauds, Hearth, Meadow and Daybreak all came up
   wearing the same violet as Night and as each other. A twin has two facts
   to tell: WHICH dark theme it is the daylight of, and that it is light. So
   each is split like Sunward's - its own pale page against its own accent,
   the accent being the hue it keeps from its sibling. The pale half also
   keeps the dot visible on a dark card and the dark half on a light one,
   which a flat colour of either kind cannot do. */
.theme-palette [data-site-theme-select="lauds"] i{background:linear-gradient(135deg,#f8f4ff 0 48%,#5a2fa8 52% 100%)}
.theme-palette [data-site-theme-select="hearth"] i{background:linear-gradient(135deg,#fdf6ee 0 48%,#984808 52% 100%)}
.theme-palette [data-site-theme-select="meadow"] i{background:linear-gradient(135deg,#f4faf2 0 48%,#5c6810 52% 100%)}
.theme-palette [data-site-theme-select="daybreak"] i{background:linear-gradient(135deg,#f4f8fd 0 48%,#7d5a12 52% 100%)}
/* NOON'S DOT BORROWS THE BURST, NOT THE ACCENT (2026-09-20). Every twin
   above is its pale page against the accent it keeps from its sibling, and
   Noon's accent is an ochre within a hair of Daybreak's bronze - two dots
   nobody could tell apart. Sunward's own dot solves this the same way, by
   showing the painting's scarlet rather than its gold; Noon shows the same
   scarlet over its own cream page, so the dot says both which theme it is
   the daylight of and that it is light. */
.theme-palette [data-site-theme-select="noon"] i{background:linear-gradient(135deg,#fdf7ec 0 48%,#a8301a 52% 100%)}
.home-intro .theme-cycle{margin-top:1px;font-size:11px;padding-top:0;padding-bottom:0}
html:not([data-site-themes]) .theme-palette{display:none}
.home-strip{gap:28px;padding:23px 0}
.home-strip p{text-align:left;font-size:13px;line-height:1.6}
.home-strip span{display:block;font-size:10px;letter-spacing:.09em;margin:0 0 7px}
.starting-points{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;
  padding:26px 0 0}
.starting-points a{display:flex;gap:12px;align-items:center;min-width:0;
  min-height:90px;padding:17px 18px;color:var(--text-1);border-bottom:1px solid var(--edge)}
.starting-points a+a{border-left:1px solid var(--edge)}
.starting-points a:first-child{padding-left:0}
.starting-points a:hover{background:var(--surface-1);text-decoration:none}
.entry-number{font:11px var(--mono);color:var(--gold-text);align-self:flex-start;padding-top:3px}
.starting-points b{display:block;font-size:15px;font-weight:500}
.starting-points small{display:block;font-size:11px;line-height:1.6;margin-top:4px;color:var(--text-3)}
.starting-points a>span:last-child{margin-left:auto;color:var(--gold-text);font-size:20px}
.home-heading{padding-top:66px}
.home-heading h2{font-size:44px}
.feature-grid{gap:0;border-top:1px solid var(--edge)}
.home .feature-grid .feature-card{border:0;border-bottom:1px solid var(--edge);
  background:transparent;border-radius:0;padding:34px 36px 28px 0;min-height:0}
.home .feature-grid .feature-card:nth-child(even){border-left:1px solid var(--edge);
  padding-left:36px;padding-right:0}
.home .feature-grid .feature-card h2{font-size:32px}
.home .enterprise-section{padding:88px 0 60px}
.enterprise-heading{position:relative;padding-left:28px;border-left:2px solid var(--gold);
  max-width:830px;margin-bottom:40px}
.enterprise-heading h2{font-size:clamp(34px,4.4vw,54px);line-height:1.12;margin:18px 0 20px}
.enterprise-heading h2 em{font-weight:400;color:var(--gold)}
.enterprise-heading>p:not(.eyebrow){max-width:68ch;font-size:16px;line-height:1.8}
.enterprise-heading>p.enterprise-note{font-size:12px;max-width:75ch;margin-top:14px;color:var(--text-3)}
.enterprise-heading .home-actions{margin-top:23px}
.practice-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.practice-card{border:1px solid var(--edge);border-radius:14px;padding:28px 24px;
  background:var(--surface-1);min-width:0;display:flex;flex-direction:column}
.practice-symbol{display:grid;place-items:center;width:52px;height:52px;
  border:1px solid var(--edge-lit);border-radius:50%;margin-bottom:28px;color:var(--gold-text)}
.practice-symbol svg{width:26px;height:26px;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.practice-card>.eyebrow{font-size:10px;letter-spacing:.12em}
.practice-card h3{font:400 27px/1.22 var(--display);letter-spacing:-.015em;margin:14px 0 18px}
.practice-card>p:not(.eyebrow){font-size:13px;line-height:1.8}
.practice-card ul{list-style:none;border-top:1px solid var(--edge);margin:24px 0 18px;padding-top:16px}
.practice-card li{padding:5px 0 5px 17px;position:relative;font-size:12px;color:var(--text-3)}
.practice-card li::before{content:'+';position:absolute;left:0;color:var(--gold-text);font-family:var(--mono)}
.practice-card .text-link{margin-top:auto;align-self:flex-start;font-size:12px}
.practice-security{background:var(--surface-sunken)}
.pilot-path{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px;
  border-bottom:1px solid var(--edge);padding:32px 0}
.pilot-path span{font:10px var(--mono);letter-spacing:.09em;color:var(--gold-text)}
.pilot-path h3{font-size:16px;font-weight:500;margin:12px 0 8px}
.pilot-path p{font-size:13px;line-height:1.8;color:var(--text-3)}
.enterprise-section>.home-details{margin-top:0;border-top:0}
.home .control-band{border-radius:14px;margin-top:0}
.home .closing-card{padding:56px 24px}
.closing-card h2{font-size:64px}
@media (max-width:1100px){
  .home-hero{gap:34px;padding-top:68px}
  .home h1{font-size:clamp(52px,6.6vw,76px)}
  .home-lead{font-size:16px}
  .home-page .nav{gap:20px}
  .workspace-preview{transform:none;box-shadow:8px 12px 0 var(--surface-sunken),8px 12px 0 1px var(--edge)}
  .practice-card{padding:26px 20px}
  .practice-card h3{font-size:25px}
}
@media (max-width:800px){
  .home-hero{grid-template-columns:minmax(0,1fr);padding:48px 0 42px;gap:32px}
  .home h1{font-size:72px}
  .home-lead{font-size:18px}
  .product-tour{grid-template-columns:minmax(0,1fr);gap:28px;padding:48px 0 16px}
  .product-tour-intro>p:not(.eyebrow){max-width:48ch}
  .workspace-preview{max-width:620px;width:calc(100% - 9px);transform:none}
  .starting-points{grid-template-columns:minmax(0,1fr);padding-top:12px}
  .starting-points a,.starting-points a:first-child{padding:14px 4px;min-height:76px}
  .starting-points a+a{border-left:0}
  .starting-points small{font-size:12px}
  .practice-grid{grid-template-columns:minmax(0,1fr)}
  .practice-card{padding:28px}
  .practice-card h3{max-width:28ch;font-size:30px}
  .practice-card>p:not(.eyebrow){max-width:68ch;font-size:14px}
  .practice-symbol{margin-bottom:18px}
  .practice-card ul{display:flex;gap:10px 20px;flex-wrap:wrap;margin-top:20px}
  .practice-card .text-link{margin-top:0}
  .home .enterprise-section{padding:60px 0 36px}
  .enterprise-heading{padding-left:22px}
  .pilot-path{gap:20px}
  .home .feature-grid .feature-card{padding-right:24px}
  .home .feature-grid .feature-card:nth-child(even){padding-left:24px}
}
@media (max-width:560px){
  .home h1{font-size:clamp(46px,11.8vw,66px)}
  .home-intro>.eyebrow{font-size:9px;letter-spacing:.09em}
  .home-lead{font-size:16px}
  .home-strip{gap:14px;padding:20px 0}
  .home-strip p{font-size:11px}
  .home-strip span{font-size:9px;letter-spacing:0}
  .theme-palette{gap:3px;margin-top:24px}
  .theme-palette button{padding-left:7px;padding-right:7px}
  .home-intro .theme-cycle{font-size:10px}
  .home-heading h2{font-size:36px}
  .home .feature-grid .feature-card,.home .feature-grid .feature-card:nth-child(even){
    padding:28px 0;border-left:0}
  .home .feature-grid .feature-card h2{font-size:30px}
  .enterprise-heading{padding-left:18px}
  .enterprise-heading h2{font-size:34px}
  .enterprise-heading>p:not(.eyebrow){font-size:14px}
  .enterprise-heading .home-actions{gap:8px}
  .practice-card{padding:26px 22px}
  .practice-card h3{font-size:29px}
  .practice-card ul{display:block}
  .pilot-path{grid-template-columns:minmax(0,1fr);gap:24px}
  .pilot-path div+div{border-top:1px solid var(--edge);padding-top:22px}
  .closing-card h2{font-size:46px}
}


/* STAINED_GLASS_BEGIN
   Lead holds the colour; reading surfaces stay opaque. This shared block is
   mirrored in site/site.css because the site and app ship independently.
   Use .stained-window for a framed surface, .stained-heading for its divider,
   and <progress class="stained-progress"> with an accessible label for real
   progress. A missing value means indeterminate; value=100 means complete.
   Custom .stained-loader bars animate only while aria-busy="true". */
:where(:root, [data-surface], .stained-window, .stained-loader, .stained-progress) {
  --glass-lead: #17121f;
  --glass-lead-lit: #71617f;
  --glass-violet: var(--band-violet, var(--peacock-violet, #8151bc));
  --glass-blue: var(--band-blue, var(--peacock-blue, #326ca4));
  --glass-teal: var(--band-teal, var(--peacock-teal, #288d86));
  --glass-green: var(--band-green, var(--peacock-green, #438363));
  --glass-amber: var(--band-gold, var(--peacock-eye, #c39848));
  --glass-mosaic: repeating-linear-gradient(112deg,
    var(--glass-violet) 0 32px, var(--glass-lead) 32px 35px,
    var(--glass-blue) 35px 70px, var(--glass-lead) 70px 73px,
    var(--glass-teal) 73px 110px, var(--glass-lead) 110px 113px,
    var(--glass-green) 113px 139px, var(--glass-lead) 139px 142px,
    var(--glass-amber) 142px 173px, var(--glass-lead) 173px 176px);
  --glass-cut-lit: rgba(255,255,255,.17);
  --glass-cut-shade: rgba(0,0,0,.38);
  --glass-cut: repeating-linear-gradient(68deg,
    transparent 0 45px, var(--glass-cut-lit) 45px 47px,
    transparent 47px 80px, var(--glass-cut-shade) 80px 83px);
}
.stained-window {
  min-width: 0;
  border: 3px solid transparent;
  border-radius: var(--glass-radius, 16px);
  background: linear-gradient(var(--glass-surface, var(--surface-1, #15101f)),
      var(--glass-surface, var(--surface-1, #15101f))) padding-box,
    var(--glass-cut) border-box, var(--glass-mosaic) border-box;
  box-shadow: 0 0 0 1px var(--glass-lead), inset 0 0 0 1px var(--glass-lead),
    0 14px 34px rgba(0,0,0,.12);
}
.stained-heading {
  border-bottom: 4px solid transparent;
  border-image: var(--glass-mosaic) 1;
  padding-bottom: .8rem;
}
.stained-loader, .stained-progress {
  display: block;
  width: 100%;
  max-width: 100%;
  height: 16px;
  padding: 2px;
  border: 1px solid var(--glass-lead-lit);
  border-radius: 4px;
  background: var(--glass-lead);
  box-shadow: inset 0 0 0 1px #08060c;
  color: var(--accent, var(--gold, #c4a2ff));
}
.stained-loader { overflow: clip; }
.stained-loader__fill {
  display: block;
  width: var(--progress, 0%);
  max-width: 100%;
  height: 100%;
  border-radius: 1px;
  background: var(--glass-cut), var(--glass-mosaic);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.35);
}
.stained-loader[aria-busy="true"]:not([aria-valuenow]) > .stained-loader__fill {
  width: 38%;
  animation: glass-pass 2.6s ease-in-out infinite;
}
.stained-progress { appearance: none; accent-color: var(--accent, var(--gold, #c4a2ff)); }
.stained-progress::-webkit-progress-bar { background: transparent; border-radius: 1px; }
.stained-progress::-webkit-progress-value {
  background: var(--glass-cut), var(--glass-mosaic);
  border-radius: 1px;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.35);
}
.stained-progress::-moz-progress-bar {
  background: var(--glass-cut), var(--glass-mosaic);
  border-radius: 1px;
}
.stained-progress:not([value]) {
  background: var(--glass-cut), var(--glass-mosaic);
  background-size: auto, 352px 100%;
  animation: glass-read 3s linear infinite;
}
.stained-loader[aria-busy="false"] > .stained-loader__fill,
.stained-progress[value] { animation: none; }
@keyframes glass-pass {
  0% { transform: translateX(-110%); }
  100% { transform: translateX(365%); }
}
@keyframes glass-read { to { background-position: 0 0, 176px 0; } }
@media (max-width: 600px) {
  .stained-window { border-width: 2px; --glass-radius: 12px; }
  .stained-loader, .stained-progress { height: 14px; }
}
@media (prefers-reduced-motion: reduce) {
  .stained-loader > .stained-loader__fill,
  .stained-progress:not([value]) { animation: none !important; transform: none; }
}
@media (prefers-contrast: more) {
  .stained-window { border-color: var(--text-1, #f3eefb); box-shadow: none; }
  .stained-loader, .stained-progress { border-color: var(--text-1, #f3eefb); }
}
@media (forced-colors: active) {
  .stained-window { background: Canvas; border: 2px solid CanvasText; box-shadow: none; }
  .stained-heading { border-image: none; border-bottom-color: CanvasText; }
  .stained-loader, .stained-progress { background: Canvas; border-color: CanvasText; box-shadow: none; }
  .stained-loader__fill { background: Highlight; box-shadow: none; forced-color-adjust: none; }
  .stained-progress { appearance: auto; animation: none !important; }
  .stained-progress::-webkit-progress-value { background: Highlight; box-shadow: none; }
  .stained-progress::-moz-progress-bar { background: Highlight; }
}
/* STAINED_GLASS_END */

/* Frames on the public site use the same glass as the installed workspace. */
:root body :is(.workspace-preview, .practice-card, .closing-card, .control-band,
    .quick-specs, .menu, .card, .home-details) {
  border: 2px solid transparent;
  background: linear-gradient(var(--surface-1), var(--surface-1)) padding-box,
    var(--glass-cut) border-box, var(--glass-mosaic) border-box;
  box-shadow: 0 0 0 1px var(--glass-lead), inset 0 0 0 1px var(--glass-lead),
    0 14px 34px rgba(0,0,0,.12);
}
:root body > header, :root body > footer {
  border-radius: 0;
  border-block: 3px solid transparent;
  border-image: var(--glass-mosaic) 1;
  box-shadow: 0 1px 0 var(--glass-lead);
}
:root body .band {
  height: 5px;
  background: var(--glass-cut), var(--glass-mosaic);
  animation: none;
  will-change: auto;
}
:root body :is(.is-loading, [data-loading-indicator][aria-busy="true"])::after {
  content: '';
  display: block;
  width: min(220px, 100%);
  height: 12px;
  margin-block-start: 12px;
  border: 2px solid var(--glass-lead);
  border-radius: 3px;
  background: var(--glass-cut), var(--glass-mosaic);
  background-size: auto, 352px 100%;
  animation: glass-read 3s linear infinite;
}
:root body .is-loading[aria-busy="false"]::after { display: none; }
#site-navigation-progress {
  position: fixed;
  inset: 0 0 auto;
  z-index: 100;
  height: 6px;
  pointer-events: none;
}
#site-navigation-progress .stained-loader {
  height: 6px;
  padding: 0;
  border: 0;
  border-radius: 0;
}
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}

@media (prefers-reduced-motion: reduce) {
  :root body :is(.is-loading, [data-loading-indicator][aria-busy="true"])::after {
    animation: none !important;
  }
}
@media (prefers-contrast: more), (forced-colors: active) {
  :root body :is(.workspace-preview, .practice-card, .closing-card, .control-band,
      .quick-specs, .menu, .card, .home-details) {
    border-color: var(--text-1); box-shadow: none;
  }
}
@media (forced-colors: active) {
  :root body :is(.workspace-preview, .practice-card, .closing-card, .control-band,
      .quick-specs, .menu, .card, .home-details) {
    background: Canvas; border-color: CanvasText;
  }
  :root body > header, :root body > footer { border-image: none; border-color: CanvasText; }
  :root body .band { background: CanvasText; }
  :root body :is(.is-loading, [data-loading-indicator][aria-busy="true"])::after {
    background: Highlight; border-color: CanvasText; animation: none;
  }
}

/* Original faceted brand lettering; reading and control fonts stay unchanged. */
@font-face{font-family:"Priest Leadlight";src:url("/fonts/priest-leadlight.woff2") format("woff2");font-style:normal;font-weight:500;font-display:swap}
.workspace-wordmark{font-family:"Priest Leadlight",var(--display);font-weight:500}

/* Sunward: an original seventh theme. Reading surfaces remain opaque. */
[data-site-theme="sunward"]{
  color-scheme:dark;
  /* SUNWARD, TAKEN FROM THE PAINTING (2026-09-16). The reference: a
     near-black peak shot through with petrol and sage, a scarlet burst
     radiating into a cream glow, deep indigo clusters either side, gold
     flecked through the lower field. The previous Sunward was a violet
     sunset that shared none of it. Colours are read from the artwork, not
     sampled from it: no pixel of the reference ships here. */
  --surface-0:#0a0f14;
  --surface-1:#101820;
  --surface-2:#16232a;
  --surface-3:#1d2f38;
  --surface-sunken:#060a0d;
  --edge:#2a4650;
  --edge-lit:#4e8a8c;
  --text-1:#f4eee2;
  --text-2:#d3ccbe;
  --text-3:#a8b2a9;
  --gold:#d8bc5a;
  --gold-lit:#ebd68a;
  --gold-dim:#8f7f45;
  --gold-text:#e2c868;
  --stop:#ef6a52;
  --violet:#7f8ddb;
  --blue:#6e82d8;
  --teal:#4fb5ae;
  --green:#6fa87b;
  --eye:#ebd68a;
  --band-violet:#3f51a8;
  --band-blue:#2e7d79;
  --band-teal:#4fb5ae;
  --band-green:#6fa87b;
  --band-gold:#d8bc5a;
  --band:linear-gradient(90deg,var(--band-gold) 0.0%,var(--band-gold) 4.7%,var(--band-violet) 4.7%,var(--band-violet) 6.2%,var(--band-teal) 6.2%,var(--band-teal) 7.8%,var(--band-gold) 7.8%,var(--band-gold) 9.4%,var(--band-teal) 9.4%,var(--band-teal) 10.9%,var(--band-violet) 10.9%,var(--band-violet) 12.5%,var(--edge) 12.5%,var(--edge) 14.1%,var(--band-teal) 14.1%,var(--band-teal) 15.6%,var(--band-violet) 15.6%,var(--band-violet) 17.2%,var(--band-teal) 17.2%,var(--band-teal) 18.8%,var(--band-violet) 18.8%,var(--band-violet) 20.3%,var(--band-teal) 20.3%,var(--band-teal) 21.9%,var(--band-violet) 21.9%,var(--band-violet) 23.4%,var(--band-gold) 23.4%,var(--band-gold) 25.0%,var(--band-violet) 25.0%,var(--band-violet) 29.7%,var(--band-gold) 29.7%,var(--band-gold) 31.2%,var(--band-violet) 31.2%,var(--band-violet) 34.4%,var(--edge) 34.4%,var(--edge) 35.9%,var(--band-violet) 35.9%,var(--band-violet) 37.5%,var(--band-gold) 37.5%,var(--band-gold) 40.6%,var(--band-violet) 40.6%,var(--band-violet) 43.8%,var(--band-gold) 43.8%,var(--band-gold) 46.9%,var(--band-violet) 46.9%,var(--band-violet) 48.4%,var(--band-gold) 48.4%,var(--band-gold) 50.0%,var(--edge) 50.0%,var(--edge) 51.6%,var(--band-gold) 51.6%,var(--band-gold) 53.1%,var(--band-teal) 53.1%,var(--band-teal) 56.2%,var(--band-violet) 56.2%,var(--band-violet) 57.8%,var(--band-teal) 57.8%,var(--band-teal) 62.5%,var(--band-gold) 62.5%,var(--band-gold) 64.1%,var(--band-teal) 64.1%,var(--band-teal) 65.6%,var(--band-violet) 65.6%,var(--band-violet) 67.2%,var(--band-teal) 67.2%,var(--band-teal) 68.8%,var(--edge) 68.8%,var(--edge) 100.0%);
}
/* The hero's glass, in the painting's own three: the scarlet burst, the
   indigo clusters either side, and the gold flecked through the field. The
   shared mixes below are tuned for the violet themes and turn the scarlet to
   brick, so Sunward states its panes outright. */
[data-site-theme="sunward"] .home .home-hero{
  --hero-glass-violet:#3f51a8;
  --hero-glass-teal:#ef6a52;
  --hero-glass-gold:#d8bc5a;
}
/* Noon states its panes for the same reason Sunward does - the shared mixes
   would turn the scarlet to brick - in the painting's own three, deepened
   until they read against a cream hero rather than a near-black one. The
   .glass-scene artwork above is NOT repeated here: sunward-glass.svg is drawn
   to glow out of a dark ground, and putting it on cream would be a guess
   rather than a measurement. Noon uses the hero's own panes and nothing else. */
[data-site-theme="noon"] .home .home-hero{
  --hero-glass-violet:#313d93;
  --hero-glass-teal:#a8301a;
  --hero-glass-gold:#7a5a0b;
}
[data-site-theme="sunward"] .glass-scene::before{content:"";position:absolute;inset:0 0 9%;z-index:-1;pointer-events:none;border-radius:44% 44% 10px 10px;background:url("/images/sunward-glass.svg") center/cover no-repeat;opacity:calc(.28 + var(--daylight,.72) * .38);filter:saturate(1.1);}
.theme-palette [data-site-theme-select="sunward"] i{background:linear-gradient(135deg,#ef6a52 0 48%,#2e7d79 52% 100%);}
.theme-palette [data-site-theme-select="sunward"]{min-width:44px;min-height:44px;}
@media(prefers-reduced-motion:reduce){[data-site-theme="sunward"] .glass-scene::before{transition:none;animation:none;}}
@media(forced-colors:active),(prefers-contrast:more){[data-site-theme="sunward"] .glass-scene::before{display:none;}}

/* Leadlight: a clear reading surface, with glass at its edges.
   Sitewide monospace is a deliberate choice, not the leftover of an
   unfinished pass: --display and --body carry the site's own Priest Mono
   face, regular and bold, self-hosted below. Until those font files are
   in place the stack falls through to var(--mono), which is the look the
   site already shows today. Code blocks keep reading var(--mono) directly
   elsewhere in this file and are unaffected by this block. */
/* PRIEST MONO IS NOT SHIPPED YET (2026-09-19). Its review said do-not-merge, and two @font-face rules naming files
   that do not exist made every page log two 404s and fail the gate's "no failed load" check. The stack above still
   names "Priest Mono" first and falls through to today's look; add the two @font-face rules back in the SAME commit
   that adds /fonts/priest-mono.woff2 and /fonts/priest-mono-bold.woff2. */
:root{--display:"Priest Mono",var(--mono);--body:"Priest Mono",var(--mono)}
body{font-size:14px;line-height:1.8;letter-spacing:-.01em}
/* .home-page KEPT ON THESE TWO SELECTORS (found in review, 2026-09-19).
   This rule and .home-page .nav,.home-page .wrap{max-width:1240px} above
   (~line 491/752) target the same element with equal specificity, so
   whichever one is LATER in the file wins - this one. Dropping
   ".home-page" here, as an earlier pass in this lane did, does not just
   remove a "redundant duplicate": it silently hands the home page's nav
   and wrap back to the 1240px rule above, widening both by 60px, a visual
   change nobody asked for and nothing in this lane's scope calls for.
   Restored so the home page keeps rendering exactly as it does today. */
.nav,.home-page .nav{max-width:1180px;gap:18px;padding-top:16px;padding-bottom:16px}
.nav a.nlink{font-size:13px}
.nav .logo{font-family:"Priest Leadlight",var(--mono);font-weight:500;letter-spacing:.02em}
:root body>header.stained-window{border:0;border-image:none;background:var(--surface-0);box-shadow:none}
:root body .band{height:12px}
.wrap,.home-page .wrap{max-width:1180px}
h1,h2,h3{letter-spacing:-.045em}
.cta,.ghost,.drop>button{border-radius:6px}
.cta{font-family:var(--mono)}
.wrap:not(.home){padding-top:52px;padding-bottom:52px}
.wrap:not(.home)>h1{font-size:clamp(30px,4.8vw,48px);font-weight:500;max-width:24ch}
/* A PROMOTED TITLE KEEPS THE LOOK IT SHIPPED WITH (2026-09-19, S11). Twelve
   pages rendered their title as an <h2> with no <h1> anywhere on the page,
   so a screen reader's "jump to heading 1" found nothing there. The tag is
   now <h1> on those pages (site_build.py and the pages it does not
   generate), but the rule above was sized for a heading these pages did
   not have yet - applying it here would also make every one of those
   titles bigger, lighter and stripped of its gold underline, which is a
   visible change nobody asked for. page-title pins the exact h2 look
   (see h2/h2::after above) so promoting the tag for accessibility changes
   nothing a sighted visitor sees. Written as a descendant selector, not
   a direct-child one, because several of these titles sit inside a
   <section> (patch notes, releases, support) or <section class="terms">
   (the licence), not straight under .wrap. */
.wrap:not(.home) h1.page-title{font:600 clamp(24px,3.2vw,32px)/1.2 var(--display);
  color:var(--text-1);margin:12px 0 10px;max-width:none;position:relative;
  display:inline-block;padding-bottom:12px}
.wrap:not(.home) h1.page-title::after{content:'';position:absolute;left:0;bottom:0;
  width:64px;height:3px;background:var(--band);background-size:200% 100%;
  animation:drift 11s linear infinite;transform:translateZ(0);will-change:background-position}
.wrap:not(.home)>p{max-width:76ch}
.card,.panel{border-radius:8px}
.prose td code{white-space:normal;overflow-wrap:anywhere}
.home{--home-radius:8px}
/* THE MARK IS GLASS, NOT A STICKER (2026-09-23; the owner: it "needs to
   seamlessly blend with the background on the site and look less ai and more
   like the glass"). site_mark.py writes the mark into every page as inline
   SVG (site_build.py), its fills already the page's tokens - the hero's own
   glass inside the hero, the shared --glass-* family everywhere else - and
   every pane translucent, so the ground shows through it the way it shows
   through the hero window. What lives here: the sheen (--glass-cut-lit and
   --glass-cut-shade, the very white and black the shared --glass-cut streak
   is cut from, named once in the STAINED_GLASS block - no literal of its
   own), the lead (one weight at every size, in the hero's own --edge-lit),
   the sizes, and the host the living-glass engine claims (glass.js SURFACES:
   .priest-mark-glass). */
.priest-mark{display:inline-block;vertical-align:middle;flex:none;overflow:visible;
  --mark-lit:var(--glass-cut-lit);--mark-shade:var(--glass-cut-shade)}
.priest-mark .pm-lit{stop-color:var(--mark-lit);stop-opacity:1}
.priest-mark .pm-shade{stop-color:var(--mark-shade);stop-opacity:1}
.priest-mark .pm-clear{stop-color:var(--mark-lit);stop-opacity:0}
.priest-mark .pm-lead{stroke:var(--edge-lit,var(--edge));stroke-width:1;vector-effect:non-scaling-stroke}
.priest-mark-glass{display:inline-block;position:relative;line-height:0;vertical-align:middle;max-width:100%}
.logo .priest-mark{width:26px;height:26px}
/* THE HOST TAKES THE MARK'S SIZE, NEVER ITS OWN (2026-09-23). This host was 64x64 with its own 4px
   margin, while the mark inside it follows the phone rule below (52px, 9px at max-width:560px): the
   hero grew 7px on a phone and at 320px its last button walked under the support launcher
   (web/test_phone_reading.py). A content-sized block lets .hero-brand-mark's own size and margin -
   at every width - be the whole of what the host occupies, exactly as the <img> did.
   THE MARK'S SIZE IS SAID ONCE (2026-09-23): --hero-mark-size and --hero-mark-gap on .home-intro
   (64px/4px; 52px/9px at max-width:560px) size .hero-brand-mark, and the glass-window scrim under
   the hero's words (glass-effects.css, .home-intro::before) starts at the same two properties plus
   the intro's own padding - so it begins where the mark ends at every width, never at a number of
   its own. */
.home-intro>.priest-mark-glass{display:block;width:fit-content;margin:0 auto}
@media (max-width:520px){.logo .priest-mark{width:20px;height:20px}}
.home .home-hero{--hero-glass-violet:color-mix(in srgb,#a58ad3 80%,var(--band-violet));--hero-glass-teal:color-mix(in srgb,#6fc7c2 88%,var(--band-teal));--hero-glass-gold:color-mix(in srgb,#f0c978 84%,var(--band-gold));position:relative;display:block;isolation:isolate;padding:36px 90px 28px;text-align:center;border-bottom:1px solid var(--edge);min-height:0;overflow:hidden}
.home .home-hero.glass-reactive{outline:none}
.hero-glass-edge{position:absolute;inset:10px 0;width:100%;height:calc(100% - 20px);z-index:-1;pointer-events:none;opacity:.23}
.hero-glass-light{opacity:.18;mask-image:radial-gradient(ellipse 380px 300px at var(--glass-pane-x,50%) calc(var(--glass-pane-y,0px) - 10px),#000,transparent 80%)}
.hero-edge-panes{stroke:var(--edge);stroke-width:.8;stroke-linejoin:round;stroke-linecap:round}
.hero-edge-panes .edge-violet{fill:var(--hero-glass-violet)}
.hero-edge-panes .edge-teal{fill:var(--hero-glass-teal)}
.hero-edge-panes .edge-gold{fill:var(--hero-glass-gold)}
.hero-edge-lead{fill:none;stroke:var(--edge-lit);stroke-width:1}
.home .home-intro{--hero-mark-size:64px;--hero-mark-gap:4px;position:relative;max-width:830px;margin:0 auto;padding:0}
.hero-brand-mark{display:block;margin:0 auto var(--hero-mark-gap,4px);width:var(--hero-mark-size,64px);height:var(--hero-mark-size,64px)}
.home .brand-title{font:500 clamp(58px,8.6vw,104px)/1.08 "Priest Leadlight",var(--mono);letter-spacing:.005em;margin:0 0 12px;color:var(--text-1)}
.hero-tagline{font:500 clamp(18px,2.5vw,24px)/1.5 var(--mono);color:var(--text-1);margin:0}
.home .home-lead{max-width:65ch;margin:14px auto 0;font-size:14px;line-height:1.8;color:var(--text-2)}
.home .home-hero .home-actions{justify-content:center;margin-top:24px;gap:10px}
.home .home-hero .home-actions .cta,.home .home-hero .home-actions .ghost{font-size:13px;min-height:46px;padding:10px 16px;gap:10px}
.home .home-hero .home-note{font-size:11px;line-height:1.8;margin-top:14px}
.hero-themes{position:relative;margin:28px auto 0;max-width:780px}
.hero-theme-label{font-size:11px;color:var(--text-3);margin:0 0 10px}
.hero-themes .theme-palette{justify-content:center;max-width:none;gap:5px;margin:0}
.hero-themes .theme-palette button{min-height:44px;border-radius:5px;font-size:11px;padding:8px 11px;background:var(--surface-0)}
.hero-themes .theme-cycle{display:inline-flex;justify-content:center;margin:4px auto 0;font-size:10px;min-height:44px;padding:6px}
.home .starting-points{padding-top:18px}
.home .starting-points a{min-height:96px;padding:18px 20px}
.home .starting-points b{font-size:13px;font-weight:600;line-height:1.55}
.home .starting-points small{font-size:11px}
.home .start-planner{margin-top:40px;padding:30px;gap:40px;border-radius:8px;background:var(--surface-1)}
.home .start-planner h2{font-size:25px;line-height:1.35}
.home .product-tour{gap:40px;padding:70px 0}
.home .product-tour-intro h2{font-size:clamp(25px,3vw,36px);line-height:1.3}
.home .workspace-preview{transform:none;border-radius:8px;box-shadow:0 8px 0 var(--surface-sunken),0 9px 0 var(--edge)}
.home .home-heading{padding:54px 0 26px}
.home .home-heading h2{font-size:clamp(25px,3vw,36px)}
.home .feature-grid .feature-card{padding-top:32px;padding-bottom:32px}
.home .feature-grid .feature-card h2{font-size:25px;line-height:1.35}
.home .practice-grid{gap:14px}
.home .practice-card{padding:24px;border-radius:8px}
.home .practice-card h3{font-size:22px;line-height:1.35}
.home .practice-symbol{border-radius:6px;margin-bottom:20px}
.home .enterprise-heading h2{font-size:clamp(27px,3.5vw,42px);line-height:1.3}
.home .control-band,.home .closing-card{border-radius:8px}
.home .closing-card h2{font-size:clamp(32px,4.5vw,50px)}
.home p,.home li{line-height:1.8}
.home-details summary{font-size:12px}
.home .guide-results a{font-size:12px;line-height:1.7;min-height:44px}
.home .fit-fields label{font-size:12px}
.home .fit-fields select{font-family:var(--mono);font-size:12px}
.home .hero-themes button:focus-visible{outline:3px solid var(--gold-text);outline-offset:3px}
@media(min-width:1100px){.home .home-hero{padding-top:32px;padding-bottom:20px}}
@media(max-width:800px){
 .home .home-hero{padding:30px 24px 20px}
 .hero-glass-edge{opacity:.17}
 .home .home-lead{max-width:45ch;font-size:13px}
 .home .starting-points a{padding:16px 12px}
 .home .start-planner{gap:30px;padding:26px 22px}
 .home .product-tour{padding:52px 0;gap:28px}
 .home .practice-card{padding:22px}
 .home .home-hero .home-note{max-width:42ch;margin-left:auto;margin-right:auto}
}
@media(max-width:560px){
 .home .home-hero{padding:26px 0 18px;overflow:visible}
 .hero-glass-edge{inset:14px -12px;width:calc(100% + 24px);height:calc(100% - 28px);opacity:.11}
 .home .home-intro{--hero-mark-size:52px;--hero-mark-gap:9px}
 .home .brand-title{font-size:clamp(46px,13vw,70px);letter-spacing:-.025em;margin-bottom:14px}
 .hero-tagline{font-size:16px;letter-spacing:-.03em}
 .home .home-hero .home-actions{gap:8px;margin-top:22px}
 .home .home-hero .home-actions .cta{flex-basis:100%;max-width:290px}
 .home .home-hero .home-actions .ghost{font-size:11px;padding:10px 12px}
 /* THE PICKER MAY NOT REACH THE CORNER (2026-09-19). The support launcher is a
    fixed 48px button in the bottom-right, and a theme button whose edge runs
    under it is one a thumb cannot finish pressing. A centred row's right edge
    is half the row's width from the middle of the screen, whatever the
    container is, so the ROW is what has to be capped: at 375px the old 84px
    buttons made a three-wide row ending at 319px, four pixels inside the
    launcher's column, which only showed once the wardrobe grew to eleven and
    a full row of three landed at that height. 238px of row ends at 306px,
    clear at 375 and at 390. Nothing is hidden and every label still reads in
    full; web/test_phone_reading.py measures it. */
 .hero-themes{margin-top:26px;max-width:330px}
 .hero-themes .theme-palette{gap:5px;max-width:238px;margin-left:auto;margin-right:auto}
 .hero-themes .theme-palette button{font-size:10px;min-width:0;width:76px;padding:8px 5px;gap:5px;justify-content:center}
 .home .starting-points{padding-top:16px}
 .home .starting-points a{min-height:78px;padding:16px 0}
 .home .start-planner{padding:24px 18px;gap:32px;margin-top:30px}
 .home .start-planner h2{font-size:23px}
 .home .home-heading{padding-top:38px}
 .home .feature-grid .feature-card,.home .feature-grid .feature-card:nth-child(even){padding:28px 0}
 .wrap:not(.home){padding-top:32px;padding-bottom:32px}
}
@media(prefers-reduced-motion:reduce){.hero-glass-edge{transition:none;animation:none}.hero-glass-light{display:none}}
@media(pointer:coarse),(prefers-contrast:more){.hero-glass-light{display:none}}
@media(forced-colors:active){.hero-glass-edge{display:none}.home .home-hero{border-color:CanvasText}.hero-themes .theme-palette button{background:Canvas;color:CanvasText}.hero-themes button[aria-pressed=true]{outline:2px solid Highlight}}

/* 1.5.51: the landing page folds. Every long section is a native disclosure under the hero,
   so a phone shows a short page of doors instead of a wall; nothing was removed. */
.home-fold{margin:14px 0;border:1px solid var(--edge);border-radius:10px;background:var(--surface-1)}
.home-fold>summary{display:grid;grid-template-columns:auto 1fr auto;gap:4px 16px;align-items:center;min-height:64px;padding:14px 20px;cursor:pointer;list-style:none}
.home-fold>summary::-webkit-details-marker{display:none}
.home-fold>summary .fold-number{grid-row:1 / span 2;font-size:11px;letter-spacing:.14em;color:var(--gold-text)}
.home-fold>summary b{font-size:17px;font-weight:600;color:var(--text-1);letter-spacing:-.02em}
.home-fold>summary .fold-line{grid-column:2;font-size:12px;line-height:1.6;color:var(--text-3)}
.home-fold>summary::after{content:'';grid-row:1 / span 2;grid-column:3;width:9px;height:9px;border-right:2px solid var(--gold-text);border-bottom:2px solid var(--gold-text);transform:rotate(45deg);transition:transform .15s}
.home-fold[open]>summary::after{transform:rotate(-135deg)}
.home-fold>summary:focus-visible{outline:2px solid var(--gold-text);outline-offset:3px;border-radius:10px}
.home-fold>.fold-body{padding:0 20px 20px}
.home-fold>.fold-body>.start-planner,.home .home-fold .start-planner{margin-top:0}
.home .home-fold .product-tour{padding:24px 0}
.home .home-fold .home-heading{padding:24px 0 16px}
@media (prefers-reduced-motion:reduce){.home-fold>summary::after{transition:none}}
/* The grouped menu: three short lists and a row of destinations, not seventeen stacked rows. */
.menu .menu-groups{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:2px 14px}
.menu .menu-head{padding:8px 12px 2px;font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--text-3)}
.menu .menu-dest{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 14px}
@media (min-width:701px){.menu{min-width:min(600px,calc(100vw - 24px))}}
@media (max-width:700px){.menu .menu-groups,.menu .menu-dest{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* ==== 2026-09-19 · WHAT TWO PHONE RECORDINGS SHOWED ======================================
   1. WORDS ARE NEVER LAID ON THE GLASS. The window is the page's background on every page, but only the
      home page's sections brought a surface of their own: /docs/*, /measured/, /terms/ and the rest put
      body text straight onto moving stained glass. Every page that is not the home page reads from one
      leaded panel now, with the window framing it; the two bare home sections get the same panel. */
html.glass-window-on main.wrap:not(.home),
html.glass-window-on .home .proof-band,
html.glass-window-on .listening-line{
  background:var(--surface-0);
  background:color-mix(in srgb,var(--surface-0) 95%,transparent);
  border-radius:10px;
  box-shadow:0 0 0 1px var(--glass-lead,var(--edge)),0 0 0 3px color-mix(in srgb,var(--surface-0) 70%,transparent),0 18px 44px rgba(0,0,0,.22)}
html.glass-window-on main.wrap:not(.home){margin-top:22px;margin-bottom:22px}
html.glass-window-on .home .proof-band{padding-inline:26px}
html.glass-window-on .listening-line{padding:10px 18px;max-width:max-content}
@media(max-width:1240px){html.glass-window-on main.wrap:not(.home){margin-inline:10px}}
@media(max-width:640px){
  html.glass-window-on main.wrap:not(.home){padding:28px 16px 36px;margin-top:14px}
  html.glass-window-on .home .proof-band{padding-inline:16px}
}
/* The footer is a surface too: it had no ground of its own, so it took whatever lay behind it. */
html.glass-window-on body>footer.site-footer{background:var(--surface-0)}
footer .wrap.foot{padding-top:18px;padding-bottom:22px}
@media(max-width:640px){
  body>footer.site-footer{margin-top:22px;padding-top:12px}
  .foot-links{gap:4px 18px;margin-bottom:8px}
  .foot-columns{grid-template-columns:minmax(0,1fr)}
}
/* 2. A FOLD INSIDE A CARD HAS AN INSIDE. The inner folds were given a leaded border and kept the padding
      of the hairline rule they used to be, so their words touched the lead. */
:root body .home-details{padding:0 16px}
:root body .home-details>summary{padding-right:30px}
:root body .home-details>summary::after{right:4px}
:root body .home-details>div{padding-bottom:16px}
/* 3. A WIDE TABLE SCROLLS INSIDE ITS BOX ON A PHONE; it is never cut off at the box's edge. */
@media(max-width:760px){
  .home .measured{display:block;max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;white-space:normal}
  .home .measured th,.home .measured td{min-width:96px}
  .home .measured th:first-child,.home .measured td:first-child{position:sticky;left:0;background:var(--surface-1);min-width:112px}
}
/* 4. A PHONE DOES NOT ZOOM THE PAGE WHEN A FIELD IS TAPPED. iOS zooms any field whose text is under
      16px and does not zoom back; the support box did that to the whole site. */
@media(pointer:coarse),(max-width:640px){
  :root body :is(input:not([type="checkbox"],[type="radio"],[type="range"]),textarea,select){font-size:16px}
}
/* 5. NO KEYBOARD, NO KEY HINT. */
@media(hover:none),(pointer:coarse){.foot-theme kbd,.theme-cycle kbd{display:none}}
/* 6. The skip link is for a keyboard; a script or a finger moving focus does not unfold it. */
.skip-link:focus:not(:focus-visible){transform:translateY(-160%)}

/* 7. THE AD STILLS STAND ON THE SAME PANEL. They load the window like every page and had no ground of
      their own: a headline, three notes and a button on moving glass. */
.stage>.plaque{display:flex;flex-direction:column;align-items:center;max-width:860px;
  padding:clamp(22px,4.4vh,48px) clamp(18px,4vw,56px);border-radius:12px}
html.glass-window-on .stage>.plaque{
  background:var(--surface-0);
  background:color-mix(in srgb,var(--surface-0) 93%,transparent);
  box-shadow:0 0 0 1px var(--glass-lead,var(--edge)),0 0 0 3px color-mix(in srgb,var(--surface-0) 70%,transparent),0 22px 54px rgba(0,0,0,.28)}
.stage>.plaque>*{flex-shrink:0;max-width:100%}
main.page>.public-race{margin-top:40px}

/* THE MEASURED PAGE, DRAWN (2026-09-24) - devad/measured_visual.py. Tokens only. */
.mv{margin:6px 0 30px}
.mv-facts{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:0 0 22px;padding:0}
.mv-facts li{font:600 12.5px var(--body);color:var(--text-2);background:var(--surface-2);
  border:1px solid var(--edge);border-radius:999px;padding:5px 12px}
.mv-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px;margin:0 0 26px}
.mv-stat{background:var(--surface-1);border:1px solid var(--edge);border-radius:14px;padding:18px 20px;min-width:0}
.mv-stat.mv-win{border-color:var(--gold);box-shadow:inset 0 0 0 1px var(--gold)}
.mv-stat-num{font:600 clamp(34px,5vw,46px)/1 var(--display);color:var(--text-1);margin:0 0 8px}
.mv-win .mv-stat-num{color:var(--gold-text)}
.mv-stat-label{font:500 14px var(--body);color:var(--text-2);margin:0 0 10px}
.mv-badge{display:inline-block;font:700 11.5px var(--body);letter-spacing:.08em;text-transform:uppercase;
  color:var(--text-3);border:1px solid var(--edge);border-radius:999px;padding:3px 10px;margin:0}
.mv-win .mv-badge{color:var(--surface-0);background:var(--gold);border-color:var(--gold)}
.mv-charts{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:14px;margin:0 0 14px}
.mv-chart,.mv-grid-wrap{margin:0;background:var(--surface-1);border:1px solid var(--edge);min-width:0}
  border-radius:14px;padding:16px 18px;min-width:0}
.mv-chart figcaption,.mv-grid-wrap figcaption{display:flex;flex-wrap:wrap;justify-content:space-between;
  align-items:baseline;gap:4px 10px;margin:0 0 12px}
.mv-chart-title{font:600 16px var(--body);color:var(--text-1)}
.mv-hint{font:500 12px var(--body);color:var(--text-3)}
.mv-bars{list-style:none;margin:0;padding:0;display:grid;gap:9px}
.mv-bar{display:grid;grid-template-columns:7.4em minmax(0,1fr) 4.6em;align-items:center;gap:10px;
  font:500 14px var(--body);color:var(--text-2)}
.mv-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mv-track{display:block;width:100%;height:12px;border-radius:6px;background:var(--surface-3);overflow:hidden}
.mv-fill{fill:var(--edge-lit)}
.mv-ours{color:var(--text-1);font-weight:700}
.mv-ours .mv-fill{fill:var(--gold)}
.mv-val{text-align:right;font:600 13.5px var(--mono);color:var(--text-1);white-space:nowrap}
.mv-none .mv-val{font:500 12px var(--body);color:var(--text-3)}
.mv-gap{display:block;height:12px;border-radius:6px;border:1px dashed var(--edge)}
.mv-grid-wrap{margin:0 0 16px}
/* Keep the absolute screen-reader labels inside the table's scroll box. */
.mv-scroll{position:relative;overflow-x:auto}
.mv-grid{border-collapse:collapse;width:100%;font:500 13.5px var(--body);color:var(--text-2)}
.mv-grid th,.mv-grid td{padding:8px 6px;text-align:center;border-top:1px solid var(--edge);white-space:nowrap}
.mv-grid thead th{border-top:0;font:600 12px var(--body);color:var(--text-3);white-space:normal;vertical-align:bottom}
.mv-grid th[scope=row]{text-align:left;color:var(--text-1)}
.mv-grid tr.mv-ours th,.mv-grid tr.mv-ours td{background:var(--surface-2)}
.mv-grid tr.mv-ours th[scope=row]{color:var(--gold-text);font-weight:700}
.mv-dots{display:inline-flex;gap:4px;vertical-align:middle}
.mv-dot{width:10px;height:10px;border-radius:50%;border:1.5px solid var(--text-3);box-sizing:border-box}
.mv-dot.mv-pass{background:var(--gold);border-color:var(--gold)}
.mv-total{font:600 13px var(--mono);color:var(--text-1)}
.mv-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.mv-fine{font:500 13.5px var(--body);color:var(--text-3);max-width:70ch;margin:12px 0 0}
.mv-full{margin:24px 0 0;border:1px solid var(--edge);border-radius:14px;background:var(--surface-1)}
.mv-full>summary{cursor:pointer;padding:14px 18px;font:600 15px var(--body);color:var(--text-1)}
.mv-full>.measured-body{padding:0 18px 18px;overflow-x:auto}
@media (max-width:560px){
  .mv-bar{grid-template-columns:6.4em minmax(0,1fr) 4.3em;gap:8px;font-size:13px}
  .mv-chart,.mv-grid-wrap,.mv-stat{padding:14px}
  .mv-charts{grid-template-columns:1fr}
}
.mv-next{font:500 12.5px var(--body);color:var(--text-3);margin:10px 0 0}
.mv-charts{grid-template-columns:repeat(2,minmax(0,1fr))}
@media (max-width:760px){.mv-charts{grid-template-columns:1fr}}
.mv-tall th[scope=col]{font:600 11.5px var(--body);padding:6px 4px;min-width:3.6em}
.mv-tall th[scope=row]{font:500 13px var(--body);color:var(--text-2);white-space:normal;min-width:9em}
.mv-tall td{padding:6px 4px}
.mv-tall td.mv-ours,.mv-tall th.mv-ours{background:var(--surface-2)}
.mv-tall thead th.mv-ours{color:var(--gold-text)}
.mv-tall tfoot th,.mv-tall tfoot td{border-top:2px solid var(--edge-lit);padding-top:10px}
.mv-tall tfoot th[scope=row]{color:var(--text-1);font-weight:700}
@media (max-width:560px){.mv-charts{grid-template-columns:1fr}.mv-tall th[scope=row]{min-width:7em}}

/* The product preview leads; stained glass remains in the surrounding scene. */
.site-header .nav{gap:clamp(14px,2vw,28px)}
.site-header .logo{font:700 17px/1.1 var(--body);letter-spacing:.13em;white-space:nowrap}
.site-header .drop>button{font-weight:600}
:root body .site-header .menu{border:1px solid var(--edge);
  background:var(--surface-1);background-image:none;outline:none;
  box-shadow:0 16px 36px rgba(0,0,0,.22)}
@media (prefers-contrast:more){:root body .site-header .menu{border-color:var(--text-1);box-shadow:none}}
@media (forced-colors:active){:root body .site-header .menu{background:Canvas;border-color:CanvasText;box-shadow:none}}
.home .home-hero{display:grid;grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);
  align-items:center;gap:24px 5%;min-height:0;padding:52px clamp(20px,5vw,64px) 28px;
  text-align:left;background:color-mix(in srgb,var(--surface-0) 93%,transparent)}
.home .home-intro,html.glass-window-on .home .home-intro{
  --hero-mark-size:30px;--hero-mark-gap:14px;max-width:620px;margin:0;
  padding:24px clamp(20px,2.5vw,34px);border:0;border-radius:12px;
  background:var(--surface-0);box-shadow:0 14px 36px rgba(0,0,0,.10)}
html.glass-window-on .home .home-intro::before{display:none}
.home .hero-brand-mark{margin:0 0 var(--hero-mark-gap);width:var(--hero-mark-size);height:var(--hero-mark-size)}
.home .brand-title{font:600 clamp(42px,5vw,62px)/1.04 var(--display);
  letter-spacing:-.05em;margin:4px 0 10px}
.home .hero-tagline{font:600 clamp(21px,2.2vw,27px)/1.25 var(--body);
  letter-spacing:-.035em;color:var(--text-1)}
.home .home-lead{max-width:38ch;margin:18px 0 0;font:400 16px/1.65 var(--body);
  color:var(--text-2)}
.home .home-hero .home-actions{justify-content:flex-start;margin-top:24px;gap:10px}
.home .home-hero .home-actions .cta,.home .home-hero .home-actions .ghost{
  min-height:48px;font:600 13px var(--body);padding:12px 18px}
.home .home-hero .home-note{font:500 12px/1.6 var(--body);margin-top:14px;color:var(--text-3)}
.showcase-window{min-width:0;margin:0;border:1px solid var(--edge);border-radius:12px;
  overflow:hidden;background:var(--surface-1);box-shadow:0 18px 48px rgba(0,0,0,.2)}
.showcase-window>picture{display:block;background:#0d0914}
.showcase-window>picture img{display:block;width:100%;height:auto;aspect-ratio:8/5;
  object-fit:cover;background:#0d0914}
.showcase-window figcaption{display:flex;align-items:center;gap:11px;padding:12px 16px;
  background:var(--surface-1);color:var(--text-1);font:500 12px/1.4 var(--body)}
.showcase-window figcaption span:nth-child(2){display:flex;flex-direction:column;gap:3px;min-width:0}
.showcase-window figcaption small{font-size:11px;color:var(--text-3)}
.showcase-window figcaption a{display:inline-flex;align-items:center;min-height:44px;
  margin-left:auto;padding:0 6px;white-space:nowrap;color:var(--gold-text);
  text-underline-offset:3px}
.showcase-window__cross{display:block;flex:none;width:22px;aspect-ratio:1;
  background:var(--gold-text);
  -webkit-mask:url('/marks/leviathan-cross.svg') center/contain no-repeat;
  mask:url('/marks/leviathan-cross.svg') center/contain no-repeat}
.home .hero-themes{grid-column:1/-1;justify-self:start;width:min(100%,390px);
  max-width:none;margin:0;border:1px solid var(--edge);border-radius:8px;
  background:var(--surface-0)}
.home .hero-themes[open]{width:min(100%,720px)}
.hero-themes>summary{display:flex;align-items:center;justify-content:space-between;
  gap:18px;min-height:48px;padding:10px 16px;cursor:pointer;list-style:none;
  color:var(--text-1);font:600 13px var(--body)}
.hero-themes>summary::-webkit-details-marker{display:none}
.hero-themes>summary span{color:var(--text-3);font-weight:400}
.hero-themes>summary::after{content:'+';color:var(--gold-text);font-size:20px;line-height:1}
.hero-themes[open]>summary::after{content:'−'}
.hero-themes>summary:focus-visible{outline:3px solid var(--gold-text);outline-offset:3px}
.hero-themes .theme-palette{justify-content:flex-start;margin:0;padding:8px 12px 0;border-top:1px solid var(--edge)}
.hero-themes .theme-palette button{background:var(--surface-1)}
.hero-themes .theme-cycle{margin:2px 12px 8px}
.site-header .cta,.home .home-actions .cta{background:var(--gold);color:var(--surface-0);
  border-color:transparent;box-shadow:none;text-shadow:none}
.site-header .cta.glass-surface,.home .home-actions .cta.glass-surface{color:var(--surface-0)}
.home .home-actions .ghost{border-color:transparent;background:transparent;box-shadow:none}
.site-header .cta>.glass-pane-canvas,.home .home-actions .cta>.glass-pane-canvas,
.music-dock__head>.glass-pane-canvas,.devad-support__launcher>.glass-pane-canvas{display:none}
.site-header .cta.glass-surface::after,.home .home-actions .cta.glass-surface::after,
.music-dock__head.glass-surface::after{display:none}
.site-header .band>.glass-pane-canvas{opacity:.45}
.hero-glass-edge{opacity:.08}
@media(max-width:800px){
  .home .home-hero{grid-template-columns:1fr;min-height:0;padding:26px 18px;gap:18px;
    background:color-mix(in srgb,var(--surface-0) 93%,transparent)}
  .home .home-intro,html.glass-window-on .home .home-intro{max-width:none;padding:24px}
  .showcase-window{order:2}
  .showcase-window>picture{display:grid;place-items:center;padding:14px}
  .showcase-window>picture img{width:min(300px,100%);aspect-ratio:auto;object-fit:contain}
  .home .hero-themes{order:3;width:100%}
}
@media(max-width:560px){
  .home .home-hero{padding:14px 0 22px;gap:14px}
  .home .home-intro,html.glass-window-on .home .home-intro{--hero-mark-size:26px;padding:24px 20px}
  .home .brand-title{font-size:clamp(42px,12vw,56px);margin:5px 0 10px}
  .home .home-lead{font-size:15px}
  .home .home-hero .home-actions{align-items:flex-start;flex-direction:column}
  .home .home-hero .home-actions .cta,.home .home-hero .home-actions .ghost{
    flex-basis:auto;max-width:100%;font-size:13px}
  .home .hero-themes,.home .hero-themes[open]{width:100%}
  .hero-themes>summary span{display:none}
  .showcase-window figcaption{flex-wrap:wrap}
  .showcase-window figcaption a{margin-left:33px}
}
@media(forced-colors:active){
  .home .home-intro,.showcase-window,.home .hero-themes{background:Canvas;color:CanvasText;border-color:CanvasText}
  .showcase-window__cross{background:CanvasText}
  .site-header .cta,.home .home-actions .cta{background:ButtonFace;color:ButtonText;border-color:ButtonText}
}