:root, [data-theme="light"] {
  --bg: #ffffff;
  --surface: #ffffff;
  --surface-raised: #ffffff;
  --linen: #f6f4f0;
  --fill: #efece7;
  --fill-hover: #e5e1da;
  --fill-selected: #ffffff;
  --separator: #e7e4df;
  --material: rgba(255,255,255,0.86);
  --label: #1a1a1a;
  --label-secondary: #5e5a55;
  --label-tertiary: #736e67;
  --accent: #1a1a1a;
  --accent-hover: #333130;
  --on-accent: #ffffff;
  --blue: #1f3d6e;
  --blue-hover: #182f56;
  --on-blue: #ffffff;
  --deadline: #4a6380;
  --on-deadline: #ffffff;
  --accent-text: #24508c;
  --accent-tint: #e9eef5;
  --btn-primary: #e9eef5;
  --btn-primary-hover: #dce5f1;
  --on-btn-primary: #1f3d6e;
  --btn-strong: #d3deed;
  --btn-strong-hover: #c4d3e8;
  --on-btn-strong: #182f56;
  --focus: rgba(36,80,140,0.35);
  --red: #a8221b;
  --red-hover: #8f1c16;
  --on-red: #ffffff;
  --success: #2e6b3f;
  --success-tint: #e8f2ea;
  --warning: #8a5a00;
  --warning-tint: #fbf1dc;
  --progress: #b07a00;
  --danger: #a8221b;
  --danger-tint: #f8e9e7;
  --shadow-card: 0 0 0 1px #e7e4df;
  --shadow-pop: 0 12px 32px rgba(26,26,26,0.16);
}
[data-theme="dark"] {
  --bg: #161514;
  --surface: #1d1b19;
  --surface-raised: #2a2724;
  --linen: #1d1b19;
  --fill: #2a2724;
  --fill-hover: #34312d;
  --fill-selected: #4a4641;
  --separator: #34312d;
  --material: rgba(22,21,20,0.86);
  --label: #f2efea;
  --label-secondary: #a9a39b;
  --label-tertiary: #8d877f;
  --accent: #f2efea;
  --accent-hover: #ffffff;
  --on-accent: #1a1a1a;
  --blue: #7099d1;
  --blue-hover: #86abdc;
  --on-blue: #161514;
  --deadline: #33495f;
  --on-deadline: #f2efea;
  --accent-text: #93b4e2;
  --accent-tint: #18263a;
  --btn-primary: #18263a;
  --btn-primary-hover: #1f3048;
  --on-btn-primary: #93b4e2;
  --btn-strong: #253a58;
  --btn-strong-hover: #2d4566;
  --on-btn-strong: #b8cfee;
  --focus: rgba(147,180,226,0.45);
  --red: #b8322a;
  --red-hover: #a12a23;
  --on-red: #ffffff;
  --success: #6cc58a;
  --success-tint: #15291b;
  --warning: #e9b44c;
  --warning-tint: #352711;
  --progress: #e9b44c;
  --danger: #ef6b60;
  --danger-tint: #3a1715;
  --shadow-card: 0 0 0 1px #34312d;
  --shadow-pop: 0 12px 32px rgba(0,0,0,0.6);
}
:root {
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-12: 48px;
  --space-16: 64px;
  --radius-sm: 2px;
  --radius-md: 4px;
  --radius-lg: 4px;
  --radius-xl: 8px;
  --radius-pill: 999px;
  --font-sans: Commissioner, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-mono: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
}

/* ---- Теми під настрій. Стани (червоний / жовтий / зелений) у всіх темах ті самі — це значення, не прикраса. ---- */
/* Льон — спокійний день: тепле полотно, більше повітря, м'якші кути */
[data-theme="len"] {
  --bg: #f7f3ec; --surface: #fbf8f3; --surface-raised: #fffdf9; --linen: #efe8dc; --fill: #e9e1d3; --fill-hover: #e0d6c5;
  --fill-selected: #fffdf9; --separator: #e3d9c8; --material: rgba(247,243,236,0.88);
  --label: #2b2620; --label-secondary: #62584d; --label-tertiary: #7d7264;
  --blue: #4f5d46; --blue-hover: #424e3a; --deadline: #6b7a5c; --accent-text: #46563a; --accent-tint: #e6eadc;
  --btn-primary: #e6eadc; --btn-primary-hover: #dbe1cd; --on-btn-primary: #3c4a30; --btn-strong: #d6dec6; --btn-strong-hover: #cad4b6; --on-btn-strong: #34402a;
  --focus: rgba(79,93,70,0.35); --shadow-card: 0 0 0 1px #e3d9c8;
  --radius-md: 8px; --radius-lg: 10px; --radius-xl: 14px;
}
/* Бузок — легкий настрій */
[data-theme="buzok"] {
  --bg: #fdfcff; --surface: #ffffff; --linen: #f4f1fa; --fill: #ece7f6; --fill-hover: #e2dbf2; --separator: #e6e1f0; --material: rgba(253,252,255,0.88);
  --label-secondary: #5c5668; --label-tertiary: #746d82;
  --blue: #5b3f8f; --blue-hover: #4c3478; --deadline: #6f5a99; --accent-text: #5b3f8f; --accent-tint: #efe9fa;
  --btn-primary: #efe9fa; --btn-primary-hover: #e4dbf6; --on-btn-primary: #4c3478; --btn-strong: #ddd1f3; --btn-strong-hover: #d1c2ee; --on-btn-strong: #3f2b66;
  --focus: rgba(91,63,143,0.35); --shadow-card: 0 0 0 1px #e6e1f0;
  --radius-md: 10px; --radius-lg: 12px; --radius-xl: 16px;
}
/* Бриз — пастельна синьо-зелена */
[data-theme="briz"] {
  --bg: #f6fbfb; --surface: #fbfefe; --surface-raised: #ffffff; --linen: #eaf4f3; --fill: #e1efee; --fill-hover: #d4e8e6; --separator: #d7e8e6;
  --material: rgba(246,251,251,0.88);
  --label: #1d2b2e; --label-secondary: #4b5e62; --label-tertiary: #67797d;
  --blue: #2f6f78; --blue-hover: #275d65; --deadline: #4f8a91; --accent-text: #2a6a73; --accent-tint: #e0f0ef;
  --btn-primary: #dcefee; --btn-primary-hover: #cfe8e6; --on-btn-primary: #22585f; --btn-strong: #c8e5e3; --btn-strong-hover: #b9dddb; --on-btn-strong: #1d4c52;
  --focus: rgba(47,111,120,0.35); --shadow-card: 0 0 0 1px #d7e8e6;
  --radius-md: 8px; --radius-lg: 10px; --radius-xl: 14px;
}
/* Фокус — дні дедлайнів: контраст, щільно, нічого зайвого */
[data-theme="focus"] {
  --bg: #ffffff; --surface: #ffffff; --linen: #f4f4f4; --fill: #eeeeee; --fill-hover: #e2e2e2; --separator: #cfcfcf; --material: rgba(255,255,255,0.96);
  --label: #000000; --label-secondary: #333333; --label-tertiary: #555555;
  --blue: #0b2f66; --blue-hover: #082652; --deadline: #0b2f66; --accent-text: #0b3a80; --accent-tint: #e3ebf7;
  --btn-primary: #0b2f66; --btn-primary-hover: #082652; --on-btn-primary: #ffffff; --btn-strong: #0b3a80; --btn-strong-hover: #082f69; --on-btn-strong: #ffffff;
  --shadow-card: 0 0 0 1px #9a9a9a;
  --radius-sm: 2px; --radius-md: 2px; --radius-lg: 2px; --radius-xl: 2px;
}