#garrul {
  --garrul-font: var(--font-ui);
  --garrul-font-size: 15px;
  --garrul-radius: 1rem;
  --garrul-motion: 120ms;
  min-height: 220px;
}

#garrul[data-theme="light"] {
  --garrul-fg: #2a1d12;
  --garrul-bg: #ebddb8;
  --garrul-muted: #6e5c47;
  --garrul-border: #cbb079;
  --garrul-input-bg: #ebddb8;
  --garrul-accent: #1e4a73;
  --garrul-accent-fg: #ebddb8;
  --garrul-link: #1e4a73;
  --garrul-error: #6e2a2a;
  --garrul-badge-bg: #cfe0ee;
  --garrul-badge-fg: #1e4a73;
  --garrul-skel: #d9c496;
  --garrul-surface: #f4ecd8;
  --garrul-hover: #d9c496;
  --garrul-accent-hover: #26588a;
  --garrul-vote-active: #cfe0ee;
  --garrul-shadow: 0 1px 2px rgb(42 29 18 / 6%);
}

#garrul[data-theme="dark"] {
  --garrul-fg: #e9dab3;
  --garrul-bg: #211a11;
  --garrul-muted: #b8a080;
  --garrul-border: #4a3a22;
  --garrul-input-bg: #211a11;
  --garrul-accent: #6fa0ce;
  --garrul-accent-fg: #17120c;
  --garrul-link: #6fa0ce;
  --garrul-error: #d08a87;
  --garrul-badge-bg: #1e4a73;
  --garrul-badge-fg: #e9dab3;
  --garrul-skel: #3a2c18;
  --garrul-surface: #2a2015;
  --garrul-hover: #342819;
  --garrul-accent-hover: #82aecd;
  --garrul-vote-active: #1e4a73;
  --garrul-shadow: 0 1px 2px rgb(233 218 179 / 6%);
}