/* Deel 8 (Aanleer 2): poetry and more. The night title, Psalm 8's sky and crown, Psalm 23, Isaiah 35's desert,
   Genesis' lines and Zechariah's square, and the colours of its drawings. Loaded after story.css. */

/* ---------- drawings ---------- */
.w-night8 { fill: #1B2840; } .w-moon8 { fill: #F4EED8; } .w-mare8 { fill: #D8CFB2; } .w-star8 { fill: #F6D46B; }
.w-hill8 { fill: #2D4034; } .w-hill8d { fill: #142019; } .w-sand8n { fill: #6E6248; }
.w-robe8a { fill: #6E8FAE; } .w-robe8b { fill: #B8875A; } .w-robe8c { fill: #7F9A62; } .w-robe8d { fill: #A8665A; } .w-robe8e { fill: #C9973E; } .w-robe8j { fill: #F1EBDD; }
.w-skin8 { fill: #E9B98E; } .w-skin8d { fill: #8A5A3C; } .w-skin8m { fill: #B98058; } .w-hair8 { fill: #5A3E2B; } .w-beard8 { fill: #8C8C8C; } .w-grey8 { fill: #D6D2CA; }
.w-gold8 { fill: #E8C766; } .w-daff8 { fill: #F2CF4A; } .w-trumpet8 { fill: #EE8A3A; }
.w-story8 { fill: #4F7FA8; } .w-poem8 { fill: #B2382C; } .w-wood8 { fill: #B98B5A; } .w-page8 { fill: #F5ECD6; } .w-card8 { fill: #FBF7EC; } .w-card8g { fill: #FBF1D2; }
.w-sp8a { fill: #3F6C9E; } .w-sp8b { fill: #8E3A2E; } .w-sp8c { fill: #5E7F4A; } .w-sp8d { fill: #2E6A7A; } .w-sp8e { fill: #C9973E; }
.w-sun8 { fill: #F6C453; } .w-heart8 { fill: #D2453A; } .w-pool8 { fill: #8CC0DC; } .w-frame8 { fill: #8C6440; }
.w-wool8 { fill: #F4F0E6; } .w-face8 { fill: #3A3A40; } .w-ox8 { fill: #A57A52; } .w-fish8 { fill: #8DB9A4; } .w-pan8a { fill: #CFE0EC; } .w-pan8b { fill: #F6E2A0; }
.w-stone8 { fill: #CFC4B0; } .w-sky8 { fill: #CFE0EC; } .w-grass8 { fill: #A9C27A; } .w-hall8 { fill: #F2E3C6; } .w-cloth8 { fill: #FBF6EA; }
.w-wine8 { fill: #8E2E3A; } .w-bread8 { fill: #D9A860; } .w-door8 { fill: #5A4636; }
.w-gravel8 { fill: #C9A57A; } .w-heat8 { fill: #F7E2AE; } .w-sand8 { fill: #E8D3A0; } .w-buck8 { fill: #C98A4E; } .w-water8 { fill: #6FA9D2; }
.w-road8 { fill: #D8C3A0; } .w-city8 { fill: #E3D2B0; } .w-soil8 { fill: #B39A74; } .w-leaf8 { fill: #7FA855; }
.w-sym8 { fill: #6B4E7A; } .w-histv8 { fill: #E3C99A; } .w-nov8 { fill: #4E7A5A; } .w-tent8 { fill: #D9B98A; } .w-paper8 { fill: #F4E8CC; } .w-woman8 { fill: #D2453A; }
.w-spirit8 { fill: #CFE0EC; } .w-world8 { fill: #DDE8C6; } .w-hay8 { fill: #E8C766; } .w-tag8 { fill: #FBF6EA; } .w-mck8 { fill: #2E4A6A; } .w-ball8 { fill: #DCEAF2; }
.w-assyr8 { fill: #C97A3A; } .w-babyl8 { fill: #7A4E9A; } .w-pers8 { fill: #4E8A5A; } .w-paving8 { fill: #E6DCC6; } .w-house8 { fill: #EADBBE; } .w-bru8 { fill: #7A2E26; }
.st.moonline8 { stroke: #EFE6C8; } .st.leaf8 { stroke: #4F7A3E; } .st.iron8 { stroke: #4A4F58; }
svg .cream8, svg .fell.cream8, svg .hand.cream8 { fill: #FBF3DC; } svg .gold-t8, svg .fell.gold-t8 { fill: #E8C766; }
svg .chalk-y8, svg .fell.chalk-y8 { fill: #F6D46B; } svg .spaced8 { letter-spacing: .12em; }
svg .red-t, svg .fell.red-t { fill: var(--red); } svg .sky-t, svg .fell.sky-t { fill: #2F5E86; } svg .leaf-t { fill: #4F7A3E; } svg .fell.brass-t { fill: var(--brass); } svg .fell.muted { fill: var(--muted); }
svg .latin8 { font-style: italic; fill: #5A5448; }
svg .lab8 { paint-order: stroke; stroke: var(--paper); stroke-width: 6px; stroke-linejoin: round; }

/* ---------- text pieces ---------- */
ul.pair8, ul.trio8 { list-style: none; margin: 0 0 1em; padding: 0; display: grid; gap: 8px; }
ul.pair8 { grid-template-columns: 1fr 1fr; }
ul.pair8 li, ul.trio8 li { padding: 10px 14px; border-radius: 10px; background: var(--card); border: 1px solid rgba(29, 36, 48, .1); color: var(--ink-2); line-height: 1.4; }
ul.pair8 b { display: block; font-family: var(--display); font-weight: 500; font-size: 1.3em; letter-spacing: .06em; color: var(--ink); }
ul.trio8 b { font-family: var(--display); font-weight: 500; font-size: 1.1em; color: var(--ink); }
blockquote.verse.en p { font-size: 1.08em; line-height: 1.45; }
.step p.gloss { font-family: var(--hand); font-size: 1.02em; line-height: 1.45; color: var(--muted); padding-left: 20px; margin-top: -4px; }
.step p.gloss::before { content: "Afrikaans: "; font-weight: 700; color: var(--brass); }
@media screen and (max-width: 520px) { ul.pair8 { grid-template-columns: 1fr; } }

/* ---------- the booklet ---------- */
@media print {
  ul.pair8, ul.trio8 { gap: 1.5mm; break-inside: avoid; } ul.pair8 li, ul.trio8 li { padding: 1.6mm 3mm; font-size: 9.5pt; break-inside: avoid; }
  blockquote.verse.en p { font-size: 10pt; }
  .step p.gloss { font-size: 9.5pt; }
}