/* Shared tokens for every design option, round 2.

   Everything here is an ALIAS of the site's own brand tokens (assets/css/style.css
   :root, from the official Mirai Minds guidelines), so a section built with these
   cannot drift off-brand. Use the site's tokens directly where you prefer
   (var(--brand), var(--sage-deep), var(--canvas-2) …). Do not introduce new hues.

   Brand roles, from the guidelines:
     terracotta  --brand        primary: every primary CTA, hero/closing bands
     marigold    --accent-sun   stars, badges, small highlights ONLY (never a surface)
     sage        --accent-sage / --sage-deep (text-safe) / --sage-tint (calm surfaces)
     soft gold   --accent-yellow / --gold-tint (warm section tint)
     cream       --canvas-2     the page ground
*/
html[data-o-calm] {
  --o-paper:      var(--canvas-2);
  --o-surface:    var(--surface);
  --o-clay:       var(--brand-tint);
  --o-clay-2:     var(--brand-tint-2);
  --o-honey:      var(--gold-tint);
  --o-gold:       var(--accent-yellow);
  --o-sage:       var(--sage-tint);
  --o-sage-mid:   var(--accent-sage);
  --o-sage-deep:  var(--sage-deep);

  --o-ink:        var(--ink);
  --o-ink-soft:   var(--ink-soft);
  --o-muted:      var(--muted);
  --o-line:       var(--line);

  --o-terra:      var(--brand);
  --o-terra-dark: var(--brand-dark);
  --o-terra-deep: var(--brand-darker);
  --o-marigold:   var(--accent-sun);

  /* Shape, depth, motion: the site's own system. */
  --o-r-s: var(--r-sm);
  --o-r:   var(--r-md);
  --o-r-l: var(--r-lg);
  --o-r-xl: var(--r-xl);
  --o-shadow-s: var(--shadow-sm);
  --o-shadow:   var(--shadow-md);
  --o-ease: var(--ease);

  /* Type steps (the calm scale in 01-calm.css sets page titles). */
  --o-fs-h2: clamp(1.45rem, 2.2vw, 1.85rem);
  --o-fs-h3: clamp(1.05rem, 1.4vw, 1.2rem);
  --o-fs-lead: 1.02rem;
  --o-fs-body: .97rem;
  --o-fs-small: .86rem;
  --o-measure: 62ch;
}