:root {
  color-scheme: light;

  --color-canvas: #fbf8f2;
  --color-surface: #ffffff;
  --color-sidebar: #fdfbf7;
  --color-sidebar-deep: #f5efe7;
  --color-active: #fce2ef;
  --color-accent: #d77dab;
  --color-accent-bright: #df8db7;
  --color-accent-soft: #e8a9c7;
  --color-accent-pale: #fceaf3;
  --color-highlight: #e6a45f;
  --color-highlight-pale: #fcf0e3;
  --color-on-accent: #292524;
  --color-on-secondary: #ffffff;
  --color-on-highlight: #292524;
  --color-title: #9b456f;
  --color-text: #342c26;
  --color-text-muted: #756c64;
  --color-text-faint: #8b827a;
  --color-border: #e9e0d6;
  --color-soft: #f7f2eb;
  --color-white: #ffffff;
  --color-danger-soft: #b94e57;
  --color-focus: var(--color-accent);
  --color-overlay: rgb(48 41 35 / 0.24);

  --category-work-background: #e7f2ff;
  --category-work-text: #246ba3;
  --category-study-background: #f0e9ff;
  --category-study-text: #7250a8;
  --category-home-background: #fff0e5;
  --category-home-text: #a65a24;
  --category-event-background: #ffe8f4;
  --category-event-text: #ad3577;

  --font-ui: "Inter", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-editorial: var(--font-ui);

  --radius-small: 12px;
  --radius-medium: 16px;
  --radius-large: 20px;
  --radius-pill: 999px;
  --shadow-overlay: 0 18px 48px rgb(70 54 42 / 0.1);
  --shadow-card: 0 10px 28px rgb(70 54 42 / 0.025);

  --sidebar-width: 278px;
  --sidebar-width-collapsed: 78px;
  --topbar-height: 88px;
  --content-width: 1280px;
}

:root[data-theme="dark"] {
  color-scheme: dark;
  --color-canvas: #171411 !important;
  --color-surface: #211d19;
  --color-sidebar: #1d1916;
  --color-sidebar-deep: #171411;
  --color-active: #4b293b !important;
  --color-accent-pale: #402636 !important;
  --color-text: #f4ede7 !important;
  --color-title: #f4ede7 !important;
  --color-text-muted: #d7cec7 !important;
  --color-text-faint: #bdb2aa !important;
  --color-border: #4c443d;
  --color-soft: #2b2621 !important;
  --color-white: #f4ede7;
  --color-overlay: rgb(0 0 0 / .55);
  --shadow-overlay: 0 18px 48px rgb(0 0 0 / .35);
  --shadow-card: 0 10px 28px rgb(0 0 0 / .14);
}