/* Shared layout spacing: use for margins, padding and gaps.
   Keep type, borders and control minimum sizes on their own scales. */
:root {
  --td-space-10: 10px;
  --td-space-20: 20px;
  --td-space-30: 30px;
  --td-space-40: 40px;
}

/* ThreeDee coral/ivory v1. Usage: reference/color-system.md.
   Opt in per page; loading this file does not retheme unrelated pages. */
[data-palette="coral-ivory"] {
  --td-ink: #20221f;
  --td-paper: #f8f8f2;
  --td-coral: #f45b69;
  --td-ivory: #f1ebdd;
  --td-deep-coral: #a82b3f;

  --td-color-text: var(--td-ink);
  --td-color-page: var(--td-paper);
  --td-color-muted: #575247;
  --td-color-border: #ded6c7;
  --td-color-surface: var(--td-ivory);
  --td-color-signature: var(--td-coral);
  --td-color-link: var(--td-deep-coral);
  --td-color-action: var(--td-coral);
  --td-color-on-action: var(--td-ink);
  --td-color-action-hover: #fa7280;
  --td-color-action-divider: #20221f35;
  --td-color-on-dark: var(--td-paper);
  --td-color-on-dark-accent: #f8bac1;
  --td-color-focus: var(--td-deep-coral);
  --td-color-selected-text: var(--td-deep-coral);
  --td-color-selected-surface: var(--td-ivory);
  --td-color-selected-border: #ded0b6;
  --td-color-hover-border: #d8b99c;
  --td-color-review-surface: #f8f5ef;
  --td-color-review-border: #e8e1d5;
  --td-color-caption: #777064;
  --td-color-control-text: #71695c;
  --td-color-control-border: #ddd4c4;
  --td-color-toolbar-surface: #ebe4d6;
  --td-color-loading-border: #ded3be;
  --td-color-preview-label: #71695c;
  --td-color-closing-surface: #fff;
}