/* jugami.com shared print stylesheet (v1). Link: <link rel="stylesheet" href="/print.css" media="print">
   Running header/footer are drawn by the PDF renderer (render.py) or the browser's print headers;
   @page margins below leave room for them. */
@page { size: letter; margin: 0.8in 0.75in 0.9in; }

@media print {
  :root { --print-serif: Georgia, "Iowan Old Style", "Palatino Linotype", Palatino, serif;
          --print-sans: system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
          /* site serif names first; if none is installed fall back to the site sans, never Times */
          --serif: Georgia, "Iowan Old Style", "Palatino Linotype", Palatino, "Book Antiqua", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
          --print-round: "Nunito", "Trebuchet MS", ui-rounded, system-ui, sans-serif; }

  /* 1. Hide site chrome and interaction-only UI */
  .skip, a[href="#main"], .site-head, header.site, .head-nav, .crumbs, .toc,
  nav[aria-label="On this page"], nav.section, .pager, .jugami-more, .site-foot, footer.site, .bar,
  [data-read-controls], .ra-btn, .ra-status, .hear, [data-hear-help],
  [class*="account"], [id*="account"], [class*="login"], [id*="login"], [class*="signin"], [class*="sign-in"],
  button[type="submit"], button[type="reset"], [data-next], .btns, a.btn, button.btn,
  .status, .here, .mission, .chips, .choices, #quizBox > :not(.q),
  #game, .game, section[aria-labelledby="explorer"], section[aria-labelledby="game"],
  button:not(.opt):not(.bug), .tally, .counter, .speak-tip, p[data-read-skip],
  body:has(.tenframe) .tag,
  section:has(.game, #journey-game, [data-choices], [data-seq]):not(:has(div.q, form)),
  canvas, iframe, video, audio, [role="dialog"], [hidden] { display: none !important; }

  /* 2. Static fallback for quizzes: print questions + options as a plain list */
  .q, .quiz, form, fieldset { display: block !important; border: 0; padding: 0; margin: 0 0 10pt; }
  .opts { display: block !important; margin: 3pt 0 0 1.2em; }
  .opt { display: block !important; all: unset; display: block !important; font: inherit;
         color: #000 !important; margin: 1pt 0; }
  .opt::before { content: "\25CB\00a0\00a0"; }   /* ○ answer bubble */
  input[type="radio"], input[type="checkbox"] { -webkit-appearance: auto; appearance: auto; }
  input[type="text"], input[type="number"], textarea { border: 0 !important;
         border-bottom: 0.75pt solid #000 !important; background: none !important; min-width: 1.5in; }
  details:not([open]) > :not(summary) { display: none; }   /* answers stay folded, as on screen */

  /* 3. Typography: site font stacks, black on white, 11pt / 1.4, ~65-char measure */
  html, body { background: #fff !important; color: #000 !important; }
  body { font-family: var(--body-font, var(--round, var(--sans, var(--print-sans)))); font-size: 11pt; line-height: 1.4;
         margin: 0 !important; padding: 0 !important; orphans: 3; widows: 3;
         hyphens: auto; -webkit-hyphens: auto; text-rendering: optimizeLegibility; }
  :where(body *):not(svg, svg *, .bug, .bug *, .cell, .tenframe) { color: #000 !important; background-color: transparent !important; }
  * {
         box-shadow: none !important; text-shadow: none !important; animation: none !important; }
  img, svg, figure, picture { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  main, .wrap, .prose, section, .hero, .block { max-width: none !important; width: auto !important;
         margin-left: 0 !important; margin-right: 0 !important; padding-left: 0 !important;
         padding-right: 0 !important; min-height: 0 !important; border-radius: 0 !important; }
  p, li, dd, figcaption, blockquote { max-width: 36em; }
  p { margin: 0 0 0.55em; }
  /* Elementary + storybook pages (rounded stack) print at 14pt */
  body:has([style*="--round"]), body.elem, body:has(.tenframe), body:has(.q .opts) { font-size: 14pt; }

  /* 4. Heading hierarchy (~1.25 scale), keep with next */
  h1, h2, h3, h4 { font-family: var(--head-font, inherit); line-height: 1.2; hyphens: none;
         break-after: avoid; page-break-after: avoid; break-inside: avoid; }
  h1 { font-size: 2em; margin: 0 0 0.35em; }
  h2 { font-size: 1.4em; margin: 1.3em 0 0.4em; border-bottom: 0.5pt solid #000; padding-bottom: 2pt; }
  h3 { font-size: 1.15em; margin: 1em 0 0.3em; }
  h4 { font-size: 1em; margin: 0.8em 0 0.25em; }
  h2 + *, h3 + *, h4 + * { break-before: avoid; }

  /* 5. Figures, tables, questions: never split; vector diagrams kept, labels unclipped */
  img, svg, figure, table, pre, blockquote, .callout, .note, .figure, .family, .work,
  .diagram-scroll, .tenframe, .q, fieldset, li, dt, dd { break-inside: avoid; page-break-inside: avoid; }
  img, svg { max-width: 100% !important; height: auto; max-height: 6in; object-fit: contain; }
  svg { overflow: visible !important; }
  .hero svg, .hero img { max-height: 3.4in; width: auto; }
  svg, figure, .tenframe, .cell, .bug { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  /* print-safe chart palette (site .cp SVG classes) */
  .cbg { fill: #fff !important; } .cg { stroke: #b8c2c6 !important; }
  svg text, .cv, .cvw, .clb { font-family: var(--serif) !important; }
  .ca { stroke: #222 !important; } .caf, .cv, .cvw { fill: #222 !important; }
  .bug { display: grid !important; } .bug svg { color: var(--c) !important; }
  .tenframe { border: 1pt solid #3d5a2a; }
  .diagram-scroll, figure, .figure { overflow: visible !important; }
  figure { margin: 8pt 0; }
  figcaption { font-size: 0.85em; font-style: italic; line-height: 1.3; }
  table { border-collapse: collapse; width: 100%; font-size: 0.9em; }
  th, td { border: 0.5pt solid #000; padding: 3pt 5pt; vertical-align: top; }
  thead { display: table-header-group; } tr { break-inside: avoid; }
  .callout, .note { border: 0.75pt solid #000 !important; padding: 6pt 8pt !important; }

  /* 6. Links: show URLs for external links in prose and ALWAYS in Sources/Credits */
  a { color: #000 !important; text-decoration: underline; }
  a[href^="http"]::after { content: " <" attr(href) ">"; font: 0.78em var(--mono, ui-monospace, monospace);
         word-break: break-all; hyphens: none; }
  a[href^="#"]::after, a[href^="/"]::after, a:has(img)::after { content: none; }
  .sources a[href]::after, [aria-labelledby="sources"] a[href]::after,
  [aria-labelledby="credits"] a[href]::after, .credits a[href]::after, figcaption a[href]::after {
         content: " <" attr(href) ">"; }
  .sources, [aria-labelledby="sources"], [aria-labelledby="credits"] { break-before: auto; font-size: 0.9em; }
}

/* Teacher utility classes */
.print-only { display: none !important; }
@media print {
  .no-print { display: none !important; }
  .print-only { display: block !important; font-style: italic; margin: 6pt 0 10pt; }
  /* Ink-friendly dark graphics: dark bg -> white, light lines -> dark, hues kept */
  .print-invert { filter: invert(1) hue-rotate(180deg) saturate(2) contrast(1.3);
         -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}