///|
pub fn BrandBook::render_css_layers(self : BrandBook) -> String {
  join_lines([
    "@layer reset, tokens, components;",
    "",
    "@layer tokens {",
    self.palette.render_css_layer(),
    self.typography.to_css(),
    "}",
    "",
    "@layer components {",
    "  .brand-guide { color: var(--brand-ink); background: var(--brand-paper); }",
    "  .brand-action { color: var(--brand-paper); background: var(--brand-rabbit-blue); }",
    "}",
  ])
}

///|
pub fn Palette::render_css_layer(self : Palette) -> String {
  let lines : Array[String] = ["  :root {"]
  for color in self.colors {
    lines.push("    " + color.css_var())
  }
  for gradient in self.gradients {
    lines.push(
      "    --brand-gradient-" +
      gradient.name +
      ": " +
      gradient.to_css_value() +
      ";",
    )
  }
  lines.push("  }")
  lines.join("\n")
}

///|
pub fn BrandBook::render_css_reset() -> String {
  "@layer reset { *, *::before, *::after { box-sizing: border-box; } body { margin: 0; } }"
}