/* Printable routine charts for pre-readers (/jadual-rutin-anak/, /en/toddler-routine-chart/). Loads
   after site.css, seasons.css, answers.css and printables.css and reuses their tiles (s-hero, s-weeks,
   s-feature, s-split, p-fan, p-cards). Adds three-up download cards, the sourced reasons list and the
   steps table. Tokens only. */

/* three charts, so the card row is three wide on desktop instead of four */
@media (min-width: 72rem) { .p-cards.r-cards { grid-template-columns: repeat(3, 1fr); } }
/* hero fan with three sheets: centre the front one */
.r-fan .f1 { left: 28%; }
.r-fan .f2 { left: 50%; top: 12%; }
.r-fan .f3 { left: 6%; }

/* why pictures help: each reason names its source */
.r-why { list-style: none; padding: 0; margin: var(--s6) 0 0; max-width: none; }
.r-why li { margin: 0; padding: var(--s4) 0; border-top: 1px solid var(--border); }
.r-why b { display: block; font-weight: var(--wt-strong); color: var(--text); }
.r-why span { display: block; margin-top: var(--s1); color: var(--muted); font-size: var(--t-small); }
.r-src { margin: var(--s6) 0 0; font-size: var(--t-meta); color: var(--muted); line-height: 1.5; }

/* steps table: the draw-it column sheds first on phones */
.r-table { max-width: none; }
.r-table td:last-child { color: var(--muted); }
@media (max-width: 39.99rem) {
  .r-table .r-shed { display: none; }
}