Layout Gallery: Overview of layout types and their use cases.

Sunstone provides 15 specialized layout renderers:

1. intro: Hero title slide with large badges, subtitle, author credentials, and strategic pillar pills.
2. chapter: Section divider featuring a chapter number and topic pillars.
3. two-column: Flexible split layout supporting code, cards, and text in ratios 1:1, 3:2, 2:3, 1:2, and 2:1.
4. code-comparison: Side-by-side or two-step critique revealing bad patterns followed by improved solutions.
5. three-column: Three equal or weighted informational cards.
6. four-column: Four-card grid for quadrants or comparisons.
7. matrix: 2x2 quadrant analysis with custom labels and colors.
8. timeline: Horizontal milestone rail with status indicators and dates.
9. architecture: Multi-tier technology stack with CSS flow indicators.
10. media: Images, video, or embedded Asciinema terminal recordings.
11. profile: Speaker or team bio with avatar, social links, and credentials.
12. dual-mode: Interactive tabbed comparison.
13. demo-roadmap: Interactive live-demo checklist.
14. closing: Outro slide with takeaways, key quote, and contact links.
15. quote: High-impact typographic quote or testimonial slide.

Two-Column Slide Syntax: Example YAML syntax for a two-column code and notes slide.

id: "channels_example"
layout: "two-column"
badge: "CONCURRENCY"
badge_color: "accent"
palette: "emerald_matrix"
ratio: "3:2"
title: "Buffered Channels"
subtitle: "Non-blocking message passing between fibers"
code_title: "channel.cr"
code_lang: "crystal"
code: |
  ch = Channel(Int32).new(capacity: 10)
  spawn do
    10.times { |i| ch.send(i) }
    ch.close
  end
  while val = ch.receive?
    puts val
  end
cards:
  - title: "Key Principles"
    color: "emerald"
    items:
      - "Channel buffers prevent producer backpressure"
      - "Fibers yield cooperatively upon buffer saturation"
notes: |
  Explain how Crystal channels compare with Go channels.