:root {
  --bg-primary: #ffffff;
  --bg-secondary: #f7f7f5;
  --bg-tertiary: #f1f1ef;
  --bg-hover: rgba(55, 53, 47, 0.04);
  --bg-active: rgba(55, 53, 47, 0.08);
  --bg-card: #ffffff;
  --bg-modal: #ffffff;
  --bg-input: #ffffff;
  --bg-sidebar: #f7f7f5;
  --bg-chat-mine: #f0f0ee;
  --bg-chat-other: #ffffff;
  --bg-skeleton: #e8e8e6;
  --bg-skeleton-shine: #f5f5f3;
  --bg-badge: #eb5757;
  --bg-tag-blue: #d3e5ef;
  --bg-tag-green: #dbeddb;
  --bg-tag-yellow: #fdecc8;
  --bg-tag-red: #ffe2dd;
  --bg-tag-purple: #e8deee;

  --text-primary: #37352f;
  --text-secondary: #6b6b6b;
  --text-tertiary: #9b9a97;
  --text-placeholder: #c4c4c4;
  --text-inverse: #ffffff;
  --text-link: #2383e2;
  --text-danger: #eb5757;
  --text-success: #4daa57;

  --accent: #ea4e43;
  --accent-hover: #d4443a;
  --accent-light: rgba(234, 78, 67, 0.08);
  --accent-lighter: rgba(234, 78, 67, 0.04);

  --border-default: #e8e8e6;
  --border-strong: #d4d4d2;
  --border-focus: #ea4e43;

  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.04);
  --shadow-md: 0 2px 8px rgba(0, 0, 0, 0.08);
  --shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.12);
  --shadow-modal: 0 12px 48px rgba(0, 0, 0, 0.15);

  --radius-sm: 4px;
  --radius-md: 6px;
  --radius-lg: 8px;
  --radius-xl: 12px;
  --radius-full: 9999px;

  --font-sans: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Helvetica Neue', sans-serif;
  --font-mono: 'SFMono-Regular', 'Consolas', 'Liberation Mono', 'Menlo', monospace;

  --fs-xs: 11px;
  --fs-sm: 12px;
  --fs-base: 14px;
  --fs-md: 16px;
  --fs-lg: 18px;
  --fs-xl: 24px;
  --fs-2xl: 30px;

  --fw-normal: 400;
  --fw-medium: 500;
  --fw-semibold: 600;
  --fw-bold: 700;

  --lh-tight: 1.2;
  --lh-normal: 1.5;
  --lh-relaxed: 1.7;

  --sidebar-width: 260px;
  --header-height: 44px;
  --transition-fast: 0.15s ease;
  --transition-normal: 0.2s ease;

  --z-sidebar: 100;
  --z-modal: 200;
  --z-dropdown: 150;
  --z-toast: 300;

  --online-green: #4daa57;
  --kanban-todo: var(--bg-secondary);
  --kanban-progress: var(--bg-tag-blue);
  --kanban-done: var(--bg-tag-green);

  --scrollbar-thumb: #d4d4d2;
  --scrollbar-track: transparent;
}

[data-theme="dark"] {
  --bg-primary: #191919;
  --bg-secondary: #202020;
  --bg-tertiary: #2a2a2a;
  --bg-hover: rgba(255, 255, 255, 0.05);
  --bg-active: rgba(255, 255, 255, 0.08);
  --bg-card: #202020;
  --bg-modal: #252525;
  --bg-input: #2a2a2a;
  --bg-sidebar: #202020;
  --bg-chat-mine: #2a2a2a;
  --bg-chat-other: #252525;
  --bg-skeleton: #2a2a2a;
  --bg-skeleton-shine: #333333;
  --bg-tag-blue: #1a3a4a;
  --bg-tag-green: #1a3a1a;
  --bg-tag-yellow: #3a2a1a;
  --bg-tag-red: #3a1a1a;
  --bg-tag-purple: #2a1a3a;

  --text-primary: #e0e0e0;
  --text-secondary: #9b9b9b;
  --text-tertiary: #6b6b6b;
  --text-placeholder: #4a4a4a;
  --text-link: #529cca;

  --border-default: #2f2f2f;
  --border-strong: #3a3a3a;

  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.2);
  --shadow-md: 0 2px 8px rgba(0, 0, 0, 0.3);
  --shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.4);
  --shadow-modal: 0 12px 48px rgba(0, 0, 0, 0.5);

  --scrollbar-thumb: #3a3a3a;

  --kanban-todo: var(--bg-tertiary);
  --kanban-progress: #1a3a4a;
  --kanban-done: #1a3a1a;
}