/* Sylph sub-pages: the "Held Breath" chrome for the document pages.
   assets/held-pages.css v131, 2026-09-13. Always loaded AFTER assets/held.css?v=131.

   held.css owns everything that carries a colour: the tokens, the six sky tints, the fixed dusk
   sky, the nav band, the footer pane, the PANE scrim, the focus rings, ::selection and the skip
   link. This file adds only the document layout and declares no colour that is not a held.css
   var, so the tokens still live in one place.

   These pages are the home page held still: the same .sky markup with the mote canvas left out,
   and --depth never moves off 0 so .deep stays transparent. NO canvas, NO GSAP, NO motion and
   nothing to reveal. The only script on a sub-page is a one-line head snippet that mirrors the
   sky tint the visitor picked on the home page; with JS off every page is complete and readable.

   Every rule is scoped to body.subpage, so the file is inert if it is ever linked from the home
   page. The single exception is the reduced-motion rule at the foot, which turns off the smooth
   scrolling held.css sets on <html> (on the home page held.js does that by adding html.rm, and
   there is no script here to add it).

   CONTRAST PROOF: tools/contrast.py in the site repo, which carries the sub-page pairs in all SIX
   tints and must exit 0. The only new ground this file introduces is
     LOGCARD  .log-entry  rgba(14,21,35,.72) over the PANE scrim  (the home page's .way ground)
   Mirror any colour or surface change here into tools/contrast.py so it exits 0 again. */

/* a short page (404, the retired stub) still puts its footer on the bottom edge */
body.subpage{display:flex;flex-direction:column;min-height:100svh}
.subpage main{flex:1 0 auto}

/* the sheet: one PANE scrim, the same surface the home page's chapters and footer sit on.
   The top pad clears the fixed nav band, whose real height is 56.6px against --navh's 52. */
.subpage .pagewrap{position:relative;z-index:2;padding:calc(var(--navh) + 2.6rem) var(--pad) 0}
.subpage .page{max-width:37rem;margin:0 auto;background:var(--pane);border-radius:22px;
  padding:1.5rem 1.15rem 1.9rem;box-shadow:0 0 70px 42px var(--pane);overflow-wrap:break-word}

/* document scale for the display face. held.css already gives h1/h2 Newsreader, the ink colour
   and the balance; only the size, the leading and the rhythm change here. */
.subpage .page h1{font-size:clamp(1.95rem,6.2vw,2.6rem);line-height:1.13;margin:0 0 .5rem}
.subpage .page h2{font-weight:300;font-size:clamp(1.24rem,4.1vw,1.46rem);line-height:1.26;
  letter-spacing:0;margin:2rem 0 .45rem}
.subpage .page p{margin:0 0 .9rem}
.subpage .page p:last-child{margin-bottom:0}
.subpage .page .updated{color:var(--dim);font-size:.88rem;margin:0 0 1.75rem}
/* The prose link. Its underline is the ONE always-present non-colour cue that marks a link in
   running text, and it has to be: the accent sits only 1.13:1 (gold) to 2.06:1 (classic) away
   from the body text, so colour alone cannot carry it (WCAG 1.4.1). It is therefore GATED at
   3:1 in contrast.py rather than excused as a hairline the way held.css excuses the .quiet
   underline, and its alpha is .65 instead of the .4 the home page uses on its fine-print links,
   which measures 2.04:1 in classic. The colour is still the home page's accent token. */
.subpage .page a{color:var(--g2);border-bottom:1px solid rgba(var(--g2rgb),.65)}
.subpage .page a:hover{color:var(--ink);border-bottom-color:var(--ink)}

/* held.css zeroes every padding, so a list added to one of these pages later would hang its
   markers off the edge of the sheet. These two rules are the guard rail. */
.subpage .page ul,.subpage .page ol{margin:.2rem 0 1rem;padding-left:1.35rem}
.subpage .page li{margin:.35rem 0}

/* the changelog entries: the home page's card ground, with the .guide near-row rule as a spine */
.subpage .log-entry{position:relative;overflow:hidden;background:rgba(14,21,35,.72);
  border:1px solid var(--line);border-radius:18px;padding:1.1rem 1.05rem 1.15rem 1.4rem;
  margin:1.2rem 0}
.subpage .log-entry::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;
  background:linear-gradient(180deg,var(--g1),var(--g2))}
.subpage .log-entry h2{margin-top:0}
.subpage .log-entry .date{color:var(--dim);font-size:.8rem;margin:0 0 .55rem}
.subpage .log-entry p{font-size:.95rem}

/* the footer: the home page's pane, lined up with the sheet. No fixed chips live on these pages,
   so it drops the 56px bottom strip the home page reserves for them. */
.subpage .footwrap{padding:0 var(--pad)}
.subpage .foot{max-width:37rem;margin:2.4rem auto 0;padding:1.5rem 1.15rem 1.9rem}
/* The footer's 1.1rem link gap sits on .foot div:first-child a in held.css from v131, so it no
   longer lands on the "Zone7 Studios" link inside the studio sentence. The override that used
   to undo it here is gone: nothing gives those links a margin any more. */

/* A narrow phone pays for a gutter twice over: the sheet's padding, and then the card's inside
   it. Below 390px both are trimmed so the changelog entries keep a sensible measure (at 320px
   the card's body line goes from 208 to 224px of text). This block MUST sit below .page and
   .log-entry: its padding shorthand has the same specificity, so above them it would be dead. */
@media (max-width:390px){
  .subpage .page{padding-left:1rem;padding-right:1rem}
  .subpage .log-entry{padding:1rem .85rem 1.05rem 1.2rem}
}

@media (min-width:900px){
  .subpage .pagewrap{padding-top:calc(var(--navh) + 3.4rem)}
  .subpage .page{padding:1.9rem 1.6rem 2.2rem}
  .subpage .foot{padding:1.6rem 1.6rem 2rem}
}

/* Nothing here animates, but held.css sets scroll-behavior:smooth on <html> for the home page's
   anchors and clears it with html.rm, a class only held.js adds. No script runs here, so the
   media query does it directly. */
@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto}}
