/* =====================================================================
   SEASONAL PRINTABLES — chrome for /seasonal/ and /seasonal/<slug>/
   (functions/_seasonal.js renders it; feed/seasonal-feed.js wires it.)

   SCOPE. Everything here is prefixed .sxn-. This sheet deliberately styles
   NOTHING that already has a home:
     - the print SHEETS themselves are feed/paper.css (.pk-*), untouched;
     - the playable cards are feed/word-find.css + feed/feed.css (.dw-card,
       .wf-*), untouched;
     - the page shell, header, footer and .prose are the base CSS in
       functions/_render.js.
   So this file is only the seasonal furniture between those, which is why it
   is short. If something here starts redefining a .pk- or .wf- rule, that is
   a sign the markup drifted and should be fixed there instead.

   Uses the site's theme tokens (--paper, --ink, --ink-soft, --line, --crimson,
   --gold), all of which are defined in the base CSS for light AND dark, so
   this sheet needs no theme block of its own.
   ===================================================================== */

/* ---- hero ---- */
.sxn-page { max-width: none; }
.sxn-hero { margin: 0 0 8px; }
.sxn-hero h1 { display: flex; align-items: center; gap: .4ch; flex-wrap: wrap; }
.sxn-hero .hub-icon { font-style: normal; }
.sxn-status {
  margin: 10px 0 0; font-size: 13px; letter-spacing: .03em;
  color: var(--ink-soft);
}

/* ---- section blocks ---- */
.sxn-block { margin: 34px 0 0; }
.sxn-h2 {
  font-family: var(--display, Georgia, serif);
  font-size: clamp(20px, 3vw, 26px); margin: 0 0 10px; line-height: 1.2;
}
.sxn-lede { color: var(--ink-soft); margin: 0 0 16px; max-width: 60ch; }

/* ---- 1. the print block (top of the page, per the owner's spec) ---- */
.sxn-print-block {
  border: 1px solid var(--line); border-radius: 14px;
  padding: 20px 20px 22px; background: var(--tile, transparent);
}
.sxn-print-block .pk-actions { margin: 0 0 14px; }

.sxn-sheet-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.sxn-sheet-list li {
  display: flex; align-items: center; gap: 12px;
  padding: 10px 12px; border: 1px solid var(--line-2, var(--line)); border-radius: 10px;
}
.sxn-n {
  flex: 0 0 auto; width: 26px; height: 26px; border-radius: 50%;
  display: grid; place-items: center;
  border: 1px solid var(--line); color: var(--ink-soft);
  font-size: 12px; font-weight: 700;
}
.sxn-li-text { flex: 1 1 auto; min-width: 0; display: grid; gap: 2px; }
.sxn-li-text b { font-weight: 600; }
.sxn-li-meta { font-size: 12px; color: var(--ink-soft); }
.sxn-sheet-list .pk-btn { flex: 0 0 auto; padding: .4em 1em; font-size: 13px; }

/* ---- 2. the playable cards ---- */
.sxn-cards { display: grid; gap: 18px; }

/* ---- prose + siblings ---- */
.sxn-prose { margin: 34px 0 0; }
.sxn-siblings { list-style: none; padding: 0; margin: 0 0 18px; display: grid; gap: 6px; }
.sxn-siblings a { text-decoration: none; }
.sxn-siblings a:hover { text-decoration: underline; }

/* ---- 3. the feed tail ---- */
.sxn-rule {
  display: flex; align-items: center; gap: 14px;
  color: var(--gold); margin: 8px 0 18px;
}
.sxn-rule::before, .sxn-rule::after {
  content: ""; height: 1px; background: var(--line); flex: 1;
}
.sxn-feed-head {
  display: flex; align-items: baseline; justify-content: space-between;
  gap: 16px; flex-wrap: wrap; margin: 0 0 14px;
}
.sxn-feed-head .sxn-h2 { margin: 0; }
.sxn-feed-status { color: var(--ink-soft); font-size: 13px; text-align: center; margin: 14px 0 0; }

/* ---- the section index (/seasonal/) ---- */
.sxn-tiles {
  list-style: none; padding: 0; margin: 24px 0 0;
  display: grid; gap: 12px;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
}
.sxn-tile a {
  display: flex; align-items: flex-start; gap: 14px; height: 100%;
  padding: 16px; border: 1px solid var(--line); border-radius: 14px;
  text-decoration: none; color: inherit; background: var(--tile, transparent);
  transition: border-color .18s ease, transform .18s ease;
}
.sxn-tile a:hover { border-color: var(--crimson); transform: translateY(-1px); }
.sxn-tile-icon { font-size: 26px; line-height: 1; flex: 0 0 auto; }
.sxn-tile-text { display: grid; gap: 4px; min-width: 0; }
.sxn-tile-text b { font-weight: 600; }
.sxn-tile-meta { font-size: 12px; color: var(--ink-soft); }
.sxn-tile-blurb { font-size: 13.5px; color: var(--ink-soft); }
/* the season that is actually running gets a quiet marker, not a shout */
.sxn-tile-live a { border-color: var(--gold); }

/* =====================================================================
   PRINT

   feed/paper.css does most of the work: it drops each sheet onto its own
   page and forces the folded answer key open. Two things are left to this
   sheet, and the FIRST one is load-bearing:

     1. UN-HIDING THE PAGE WRAPPER, so the sheets print at all. paper.css's
        top-level hide rule assumes .pk-sheets sits directly in <body>, which
        is true of the capture document and false of every SSR page. Full
        explanation, and the measurement, at the rule itself below.
     2. The per-sheet "print just this one" case.

   feed/seasonal-feed.js marks every sheet the reader did NOT ask for with
   .sxn-print-hide, prints, then takes the marks off. A class is used rather
   than an attribute selector because CSS cannot compare one attribute value
   against another, so "hide every sheet whose number is not N" can only be
   expressed by marking the losers.
   ===================================================================== */
@media print {
  /* ------------------------------------------------------------------
     🚨 THE PAGE-WRAPPER RULES USED TO LIVE HERE, AND THEY BLANKED THE HUB.

     doc() wraps every SSR page in `<div class="wrap">`, and paper.css's print
     block used to hide it — so the sheets never printed. This file answered
     that with three rules of its own: un-hide `html body > .wrap`, hide
     `.wrap > *:not(.pk-page)`, and let `.pk-page` have the whole sheet.

     paper.css fixed the same thing at source on 2026-08-21 (commit 7888530),
     which left this copy redundant AND more dangerous than the original:
       • `.wrap > *:not(.pk-page)` had no `:not(.pk-sheets)`, so the day
         anyone put .pk-sheets straight under .wrap it would print blank
         again — paper.css's version exempts both;
       • and it applied to EVERY page loading this stylesheet, including
         /seasonal/ itself, which is a prose index with no .pk-page on it at
         all. Every child of .wrap matched, so the section hub printed ONE
         BLANK PAGE. Measured 2026-08-22: body laid out at 0px, 12 visible
         elements, 1 empty page of paper.

     So they are gone rather than patched. functions/_seasonal.js loads
     paper.css on exactly the pages that have sheets (seasonalDoc) and NOT on
     the hub (seasonalHubDoc), which is precisely the split those rules
     wanted. Re-measured after removing them: the hub prints as an ordinary
     article and the landing pages are unchanged, sheet for sheet.
     ------------------------------------------------------------------ */

  /* the per-sheet "print just this one" marks (see feed/seasonal-feed.js) */
  .sxn-print-hide { display: none !important; }

  /* ------------------------------------------------------------------
     THE ANSWER KEY IS N IDENTICAL BLOCKS, NOT THE PACK'S FIVE DIFFERENT ONES.

     paper.css's `.pk-answers:not(.pk-lg)` pairing (added 2026-08-22 to stop
     the Daily Pack's key spilling) reaches this sheet too — it is `.pk-answers`
     and it is not `.pk-lg`. That layout is built around the pack's specific
     run of blocks: one full-width, then two rows of two. Handed four
     interchangeable puzzle blocks it floats 2 and 3 into a row, then leaves 4
     hanging with `clear: none` and a 2.5rem indent beside empty paper.

     MEASURED on the fall and christmas pages, both engines' page counts from
     PDFDocument.getPageCount(), against 935px of printable US Letter:

                                       fall     christmas
       inheriting the pack's pairing   1065.8px   1041.9px   2 pages
       the 2-up grid below              822.3px    775.5px   1 page

     …which takes the whole page from 6 sheets of paper to 5, for 5 sheets.

     So the sheet has been printing a sixth page — four puzzles' worth of
     answers plus one near-empty sheet — since the section shipped. A grid
     rather than floats because these blocks ARE a grid: same shape, same
     content, no reason for one to be special.

     Scoped `@media print` on purpose. `.pk-gated` is display:none on screen
     while the sheet is gated, and that rule scores lower than this one would
     — setting a display here outside the print block would un-hide the
     answers behind the reveal button. Printing already forces them visible
     (paper.css), so this is the one place the override is safe.
     ------------------------------------------------------------------ */
  .sxn-sheet.pk-answers .pk-gated {
    display: grid !important;
    grid-template-columns: 1fr 1fr;
    gap: 0 1.6rem;
    align-items: start;
  }
  /* !important because the rules being undone score (0,6,0) and (0,8,0) —
     out-specifying them by hand would need a selector nobody could read. */
  .sxn-sheet.pk-answers .pk-ak {
    float: none !important; clear: none !important;
    width: auto !important; margin-left: 0 !important;
  }
}

/* The mark must be inert on SCREEN. If a browser never fires `afterprint`
   (some do not, and none do when the user cancels from certain previews) the
   marks can outlive the print job, and a rule that hid them on screen would
   make half the page vanish for no visible reason. Hiding only inside @media
   print means a stale mark costs nothing until the next print, which
   seasonal-feed.js clears at the start of anyway. This comment exists because
   "why is this only in the print block" is exactly the kind of thing someone
   later tidies into a bug. */
