/* ZO-GO map — time-of-day sky theme, in the ZO-GO palette: near-white by day, deep teal-ink
   after dark. Shared across pages. A tiny inline <script> sets html[data-sky]. */
/* --ground is the page BEHIND a card, and it belongs here with the other surfaces rather
   than in a per-page :root. It was defined only in index.html and dark.css, so on the
   twelve pages that load pages.css it was UNDEFINED — measured 2026-08-02 on /for-agents:
   `#menu a:hover{background:var(--ground)}` resolved to nothing and the menu hover did
   nothing at all. One definition per sky fixes every one of them at once. */
/* D-193, 2026-09-14: day is road-atlas PAPER, not a blue sky. The blue field was the thing that
   read as thios.co's hero. Contours are a separate layer on body (below), so this gradient stays
   the plain token value that structured-test compares. */
html[data-sky="day"]  {--sky:linear-gradient(172deg,#FAFAFB 0%,#F3FBF9 60%,#EDFFFB 100%);
  --card:#fff;--ink:#15201D;--soft:#586863;--line:#E3EAE8;--ground:#FAFAFB}
html[data-sky="dawn"] {--sky:linear-gradient(172deg,#0E1614 0%,#123B34 55%,#2E7A6E 100%);
  --card:rgba(14,22,20,.82);--ink:#F2F3EF;--soft:#C7CDD3;--line:rgba(255,255,255,.16);--pine:#31DDC6;--ground:#0E1614}
html[data-sky="dusk"] {--sky:linear-gradient(172deg,#0E1614 0%,#07322B 45%,#0B5C51 80%,#0B8373 100%);
  --card:rgba(14,22,20,.80);--ink:#FBF6EF;--soft:#E7D8CB;--line:rgba(255,255,255,.18);--pine:#31DDC6;--ground:#0E1614}
/* Peter, 2026-08-05: night wants "darker purples and blues". The old ramp
   (#14121E/#1A1730/#26203A) was a desaturated purple-grey that read as flat charcoal — three
   stops that were nearly the same colour, so it barely resolved as a gradient at all.
   This one is a night drive: deep NAVY overhead easing to VIOLET at the horizon, which is
   where the light-pollution glow actually sits. Four stops, because three could not carry blue
   and purple both.
   The first attempt went near-black at the top (#070B1A) and measured beautifully — 16:1 ink —
   but LOOKED like flat black on screen. The gradient spans the whole PAGE, not the viewport, so
   on a long page the only thing above the fold is its darkest slice. A sky nobody scrolls far
   enough to see is not a sky. These stops are chromatic from 0%: dark, but recognisably blue at
   the top of the very first screen. */
html[data-sky="night"]{--sky:linear-gradient(172deg,#0E1614 0%,#0B2621 38%,#07322B 70%,#0A4A40 100%);
  --card:rgba(14,22,20,.85);--ink:#EAEBE7;--soft:#AAB0B7;--line:rgba(255,255,255,.14);--pine:#31DDC6;--ground:#0E1614}

/* `color-scheme` is what the BROWSER reads, and it is not the same thing as the
   prefers-color-scheme queries elsewhere in this project: those ask what the OS wants, this
   TELLS the browser what the page is. Native chrome takes it from here — scrollbars, date and
   time pickers, autofill backgrounds, spellcheck underlines, the default form control skin.
   Undeclared, all of that renders light against three of these four skies, which is visible the
   moment a date field or a scrollbar appears on a night page. Declared per sky because the sky
   is what decides; `day` is spelled out rather than left to default so an OS in dark mode
   cannot force-darken a page that is deliberately light. */
html[data-sky="day"]{color-scheme:light}
html[data-sky="dawn"],html[data-sky="dusk"],html[data-sky="night"]{color-scheme:dark}
/* The gradient spans the WHOLE page, however tall — that's the point of a gradient
   (Peter, 2026-07-24). It was background-attachment:fixed, which maps it to the
   viewport instead: the full sky compressed into every screenful, so a block of
   text met a different stop depending on scroll position and the palette could
   never be tuned against it (audit F13). */
html{min-height:100%}
/* `100%` measures the LAYOUT viewport, which on mobile browsers is the tall one that assumes
   the toolbars are hidden. Firefox and Safari on iOS keep a toolbar over the bottom of the
   screen, so the last ~80px of a `100%`-tall page sits UNDERNEATH it — which is exactly where
   the footer lives. Reported as "slammed to the bottom and lost"; it was not slammed, it was
   covered.
   `100dvh` is the dynamic viewport height: it tracks the toolbar as it shows and hides. The
   `100%` line stays first as the fallback for anything that does not know dvh — a browser that
   ignores the second declaration is no worse off than it is today. */
body{background:var(--sky, var(--ground)) no-repeat;background-size:100% 100%;min-height:100%;
     min-height:100dvh}
/* D-193: the paper carries contour lines — a 900px tile, generated from a periodic height field
   so its edges meet. Day only; the dark skies stay clean gradients. */
html[data-sky="day"] body{background:var(--sky) 0 0/100% 100% no-repeat;background-color:#FAFAFB}
.card,.priv,.pagefoot{backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}
/* text sitting on the sky gets a subtle shadow on the darker skies */
html:not([data-sky="day"]) body{text-shadow:0 1px 2px rgba(0,0,0,.32)}

/* lede: balance the lines, avoid a one-word orphan */
.lede{text-wrap:balance}