/* WorkGlory.com · the printable sheet: one lesson per Letter page, in the original "Evening blue" type.
   Used by the build's print document (PDFs), the share image, and day pages when printed from the browser
   (linked there with media="print"). Kept apart from site.css so the PDFs never change with the look of the site. */

@font-face { font-family: "Bricolage Grotesque"; src: url(/assets/fonts/bricolage-grotesque-normal.woff2) format("woff2"); font-weight: 500 800; font-style: normal; font-display: swap; }
@font-face { font-family: "Nunito Sans"; src: url(/assets/fonts/nunito-sans-normal.woff2) format("woff2"); font-weight: 400 800; font-style: normal; font-display: swap; }
@font-face { font-family: "Nunito Sans"; src: url(/assets/fonts/nunito-sans-italic.woff2) format("woff2"); font-weight: 400 800; font-style: italic; font-display: swap; }

/* Static instances for PDF output only. Chrome embeds variable fonts as Type 3; static TrueType prints smaller and sharper. */
@font-face { font-family: "WG Print Display"; src: url(/assets/fonts/print/bricolage-grotesque-800.ttf) format("truetype"); font-weight: 800; font-style: normal; }
@font-face { font-family: "WG Print Sans"; src: url(/assets/fonts/print/figtree-400.ttf) format("truetype"); font-weight: 400; font-style: normal; }
@font-face { font-family: "WG Print Sans"; src: url(/assets/fonts/print/figtree-400-italic.ttf) format("truetype"); font-weight: 400; font-style: italic; }
@font-face { font-family: "WG Print Sans"; src: url(/assets/fonts/print/figtree-500.ttf) format("truetype"); font-weight: 500; font-style: normal; }
@font-face { font-family: "WG Print Sans"; src: url(/assets/fonts/print/figtree-600.ttf) format("truetype"); font-weight: 600; font-style: normal; }
@font-face { font-family: "WG Print Sans"; src: url(/assets/fonts/print/figtree-700.ttf) format("truetype"); font-weight: 700; font-style: normal; }
@font-face { font-family: "WG Print Sans"; src: url(/assets/fonts/print/figtree-800.ttf) format("truetype"); font-weight: 800; font-style: normal; }

:root {
  --bg: #f7f3ea; --surface: #fffdf8; --surface-2: #f1ead9; --ink: #1f2b38; --ink-2: #46505c; --muted: #5b6470; --line: #e1d9c6;
  --heading: #163b63; --band: #163b63; --band-deep: #0f2d4f; --on-band: #f7f3ea; --on-band-2: #d5dde8; --on-band-muted: #b7c3d2;
  --amber: #e4b04a; --amber-ink: #1b2430; --amber-text: #8a5e14; --glow: rgba(228, 176, 74, .26);
  --focus: #163b63; --solid: #163b63; --on-solid: #f7f3ea; --desk: #e4ddce; --shadow: 0 22px 50px rgba(22, 59, 99, .16);
  --display: "Bricolage Grotesque", "Trebuchet MS", Arial, sans-serif;
  --body: "Nunito Sans", "Helvetica Neue", Arial, sans-serif;
  color-scheme: light;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; scroll-padding-top: 16px; }
body { margin: 0; background: var(--bg); color: var(--ink); font-family: var(--body); font-size: 1.0625rem; line-height: 1.6; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
img, svg { display: block; max-width: 100%; }
a { color: inherit; text-underline-offset: .2em; text-decoration-thickness: 1px; }
a:hover { text-decoration-thickness: 2px; }
p { margin: 0 0 1em; }
h1, h2, h3 { text-wrap: balance; }
[hidden] { display: none !important; }
.sheet { display: none; }
.frame { container: frame / inline-size; min-height: 100vh; min-height: 100dvh; background: var(--bg); display: flex; flex-direction: column; }
.sref { color: inherit; text-decoration: underline; text-decoration-color: color-mix(in srgb, var(--amber-text) 60%, transparent); text-decoration-thickness: 1.5px; text-underline-offset: .22em; }
.sheet a { color: inherit; text-decoration: none; }
.vn { font: 800 .6em/0 var(--body); color: var(--amber-text); vertical-align: .5em; margin: 0 .22em 0 .1em; }
.lord { font-variant-caps: small-caps; letter-spacing: .03em; }

/* ---------- the printable sheet: one lesson per Letter page ----------
   Sizes are in em so build/fit can scale each sheet's type to fill exactly one page. */
.sheet { --display: "WG Print Display", "Bricolage Grotesque", Arial, sans-serif; --body: "WG Print Sans", "Figtree", Arial, sans-serif;
  display: none; flex-direction: column; width: 7.5in; height: 9.96in; overflow: hidden; background: #fff; color: #1f2b38; font-family: var(--body); font-size: var(--fs, 10.6pt); line-height: 1.42; }
.page-print .sheet { display: flex; margin: 0 auto 24px; }
.sh-head { display: flex; justify-content: space-between; font-size: 7.6pt; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: #5b6470; border-bottom: 1.2pt solid #e4b04a; padding-bottom: 5pt; }
.sh-brand { font-family: var(--display); font-weight: 800; color: #163b63; letter-spacing: 0; text-transform: none; font-size: 9.6pt; }
.sh-title { display: flex; justify-content: space-between; align-items: flex-start; gap: 16pt; margin: 1.1em 0 .75em; }
.sh-title .sh-h1 { font-family: var(--display); font-weight: 800; font-size: 2.64em; line-height: 1; letter-spacing: -.03em; color: #163b63; margin: 0 0 .2em; }
.sh-meta { font-size: .85em; font-weight: 700; color: #5b6470; margin: 0; }
.sh-manual { font-size: .78em; color: #5b6470; margin: .35em 0 0; }
.sh-manual a { color: #8a5e14 !important; font-weight: 800; }
.sh-motif { width: .72in; height: .72in; color: #c9921f; flex: none; }
.sh-note { font-size: .9em; font-weight: 700; border: 1pt solid #e4b04a; border-radius: 6pt; padding: .45em .8em; margin: 0 0 .8em; }
.sheet h2 { font-family: var(--body); font-weight: 800; font-size: .72em; letter-spacing: .16em; text-transform: uppercase; color: #8a5e14; margin: 0 0 .5em; break-after: avoid; }
.sh-start { margin-bottom: 1em; }
.sh-start p { font-family: var(--body); font-weight: 500; font-size: 1.22em; line-height: 1.35; color: #163b63; margin: 0; }
.sh-cols { column-count: 2; column-gap: .32in; column-fill: balance; flex: 1 1 auto; min-height: 0; }
.sh-cols section { margin: 0 0 1.05em; }
.sh-cols p { margin: 0 0 .6em; }
.sh-verses { margin: .6em 0 .8em; padding: .7em .85em; background: #f6f1e5; border-radius: 6pt; }
.sh-verses .sh-ref { font-weight: 800; font-size: .7em; letter-spacing: .14em; text-transform: uppercase; color: #8a5e14; margin: 0 0 .2em; }
.sh-verses p:not(.sh-ref) { font-family: var(--body); font-size: 1.06em; line-height: 1.45; margin: 0; }
.sheet .vn { font-size: .58em; color: #8a5e14; }
.sh-quote { break-inside: avoid; border-top: 1pt solid #d8cfbb; border-bottom: 1pt solid #d8cfbb; padding: .55em 0; margin: .55em 0 .8em; }
.sh-quote p { font-family: var(--body); font-size: 1.04em; line-height: 1.4; margin: 0 0 .25em; }
.sh-quote .sh-cite { font-family: var(--body); font-size: .74em; color: #5b6470; margin: 0; }
.sh-talk, .sh-share { break-inside: avoid; border-radius: 7pt; padding: .75em .95em .85em; }
.sh-talk { border: 1.2pt solid #163b63; }
.sh-talk p { font-family: var(--body); font-weight: 600; font-size: 1.1em; line-height: 1.38; color: #163b63; margin: 0; }
.sh-share { background: #fbf1da; border: 1.2pt solid #e4b04a; }
.sh-share p { font-family: var(--body); font-weight: 400; font-size: 1.06em; line-height: 1.45; margin: 0; }
.sh-foot { display: flex; justify-content: space-between; gap: 16pt; font-size: 7pt; color: #5b6470; border-top: .8pt solid #d8cfbb; padding-top: 5pt; margin-top: 8pt; }
.sh-url { font-weight: 800; color: #163b63; white-space: nowrap; }

/* ---------- print ---------- */
@media print {
  @page { size: letter; margin: .5in; }
  html, body { background: #fff !important; }
  .frame { display: block; min-height: 0; width: auto !important; margin: 0 !important; box-shadow: none !important; border-radius: 0 !important; background: #fff; }
  .frame > :not(.sheet) { display: none !important; }
  .sheet, .page-print .sheet { display: flex !important; margin: 0; break-after: page; }
  .sheet:last-child { break-after: auto; }
  a { text-decoration: none; }
  /* a day page printed from the browser: only its sheet */
  body:not(.page-print) { display: block !important; min-height: 0 !important; }
  body:not(.page-print) > :not(.sheet) { display: none !important; }
}
