/* BostonIvy design tokens — generated from bostonivy-tokens.json by build-tokens.mjs. Do not edit by hand. */
/* Usage: <html data-theme="clean-light"> — style: clean | sticker | pixel; mode: light | dark. No attribute = clean, following the system light/dark setting. */
:root {
  --space-0: 0px;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;
  --radius-pill: 9999px;
  --duration-instant: 80ms;
  --duration-fast: 120ms;
  --duration-base: 200ms;
  --duration-slow: 320ms;
  --easing-standard: cubic-bezier(0.2, 0, 0, 1);
  --easing-enter: cubic-bezier(0, 0, 0, 1);
  --easing-exit: cubic-bezier(0.3, 0, 1, 1);
  --easing-pop: cubic-bezier(0.34, 1.56, 0.64, 1);
  --easing-linear: cubic-bezier(0, 0, 1, 1);
  --z-sticky: 10;
  --z-drawer: 20;
  --z-popover: 30;
  --z-modal: 40;
  --z-toast: 50;
  /* clean raw values */
  --radius-clean-sm: 6px;
  --radius-clean-md: 8px;
  --radius-clean-lg: 12px;
  --border-clean: 1px;
  --focus-clean: 2px;
  --row-clean: 46px;
  --control-clean: 32px;
  --sidebar-clean: 248px;
  /* sticker raw values */
  --radius-sticker-sm: 10px;
  --radius-sticker-md: 16px;
  --radius-sticker-lg: 24px;
  --border-sticker: 2.5px;
  --focus-sticker: 3px;
  --row-sticker: 58px;
  --control-sticker: 40px;
  --sidebar-sticker: 264px;
  /* pixel raw values */
  --radius-pixel-sm: 0px;
  --radius-pixel-md: 0px;
  --radius-pixel-lg: 0px;
  --border-pixel: 1px;
  --focus-pixel: 2px;
  --row-pixel: 32px;
  --control-pixel: 26px;
  --sidebar-pixel: 260px;
}

/* writing systems (core.script): the UI language's fonts first, then every other script, then emoji */
:root { --font-scripts: "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei UI", "Microsoft YaHei", "Noto Sans CJK SC", "Noto Sans SC", "Source Han Sans SC", "PingFang TC", "Microsoft JhengHei UI", "Microsoft JhengHei", "Noto Sans CJK TC", "Noto Sans TC", "Source Han Sans TC", "PingFang HK", "Noto Sans CJK HK", "Noto Sans HK", "Source Han Sans HC", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Yu Gothic UI", "Meiryo UI", "Noto Sans CJK JP", "Noto Sans JP", "Source Han Sans JP", "Apple SD Gothic Neo", "Malgun Gothic", "Noto Sans CJK KR", "Noto Sans KR", "Source Han Sans KR", "Kohinoor Devanagari", "Devanagari Sangam MN", "Nirmala UI", "Noto Sans Devanagari", "Kohinoor Bangla", "Bangla Sangam MN", "Noto Sans Bengali", Thonburi, "Leelawadee UI", "Noto Sans Thai", "Segoe UI", "Noto Sans Arabic UI", "Noto Naskh Arabic UI", "Noto Sans Arabic", "Geeza Pro", "Apple Color Emoji", "Segoe UI Emoji", "Noto Color Emoji"; }
:root, [lang]:not(:lang(zh), :lang(zh-Hans), :lang(zh-CN), :lang(zh-SG), :lang(zh-MY), :lang(zh-Hant), :lang(zh-TW), :lang(zh-MO), :lang(zh-HK), :lang(zh-Hant-HK), :lang(ja), :lang(ko), :lang(hi), :lang(mr), :lang(ne), :lang(bn), :lang(as), :lang(th), :lang(ar), :lang(fa), :lang(ur), :lang(ps), :lang(vi)) { --font-script: var(--font-scripts); --font-script-rounded: "Yuanti SC", var(--font-script); --leading-min: 0; --tracking-scale: 1; }
/* 简体中文 */
:lang(zh), :lang(zh-Hans), :lang(zh-CN), :lang(zh-SG), :lang(zh-MY) { --font-script: "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei UI", "Microsoft YaHei", "Noto Sans CJK SC", "Noto Sans SC", "Source Han Sans SC", var(--font-scripts); --font-script-rounded: "Yuanti SC", var(--font-script); --leading-min: 0; --tracking-scale: 0; }
/* 繁体中文（台湾） */
:lang(zh-Hant), :lang(zh-TW), :lang(zh-MO) { --font-script: "PingFang TC", "Microsoft JhengHei UI", "Microsoft JhengHei", "Noto Sans CJK TC", "Noto Sans TC", "Source Han Sans TC", var(--font-scripts); --font-script-rounded: "Yuanti TC", var(--font-script); --leading-min: 0; --tracking-scale: 0; }
/* 繁体中文（香港） */
:lang(zh-HK), :lang(zh-Hant-HK) { --font-script: "PingFang HK", "Microsoft JhengHei UI", "Microsoft JhengHei", "Noto Sans CJK HK", "Noto Sans HK", "Source Han Sans HC", var(--font-scripts); --font-script-rounded: "Yuanti TC", var(--font-script); --leading-min: 0; --tracking-scale: 0; }
/* 日文 */
:lang(ja) { --font-script: "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Yu Gothic UI", "Meiryo UI", "Noto Sans CJK JP", "Noto Sans JP", "Source Han Sans JP", var(--font-scripts); --font-script-rounded: "Hiragino Maru Gothic ProN", var(--font-script); --leading-min: 0; --tracking-scale: 0; }
/* 韩文 */
:lang(ko) { --font-script: "Apple SD Gothic Neo", "Malgun Gothic", "Noto Sans CJK KR", "Noto Sans KR", "Source Han Sans KR", var(--font-scripts); --font-script-rounded: var(--font-script); --leading-min: 0; --tracking-scale: 0; }
/* 天城文：印地语、马拉地语、尼泊尔语 */
:lang(hi), :lang(mr), :lang(ne) { --font-script: "Kohinoor Devanagari", "Devanagari Sangam MN", "Nirmala UI", "Noto Sans Devanagari", var(--font-scripts); --font-script-rounded: var(--font-script); --leading-min: 1.45; --tracking-scale: 0; }
/* 孟加拉文：孟加拉语、阿萨姆语 */
:lang(bn), :lang(as) { --font-script: "Kohinoor Bangla", "Bangla Sangam MN", "Nirmala UI", "Noto Sans Bengali", var(--font-scripts); --font-script-rounded: var(--font-script); --leading-min: 1.45; --tracking-scale: 0; }
/* 泰文 */
:lang(th) { --font-script: Thonburi, "Leelawadee UI", "Noto Sans Thai", var(--font-scripts); --font-script-rounded: var(--font-script); --leading-min: 1.6; --tracking-scale: 0; }
/* 阿拉伯文：阿拉伯语、波斯语、乌尔都语、普什图语 */
:lang(ar), :lang(fa), :lang(ur), :lang(ps) { --font-script: "Segoe UI", "Noto Sans Arabic UI", "Noto Naskh Arabic UI", "Noto Sans Arabic", "Geeza Pro", var(--font-scripts); --font-script-rounded: var(--font-script); --leading-min: 1.75; --tracking-scale: 0; }
/* 越南文（拉丁字母） */
:lang(vi) { --font-script: var(--font-scripts); --font-script-rounded: var(--font-script); --leading-min: 1.45; --tracking-scale: 1; }
/* brand faces that lack these languages' letters are swapped whole, never mixed inside a word */
:root, [lang]:not(:lang(tr), :lang(vi), :lang(ru), :lang(uk), :lang(pl), :lang(cs), :lang(ro), :lang(hu), :lang(el)) { --font-sticker-face: Fredoka; --font-pixel-display-face: Silkscreen; }
:lang(tr), :lang(vi), :lang(ru), :lang(uk), :lang(pl), :lang(cs), :lang(ro), :lang(hu), :lang(el) { --font-sticker-face: Inter; --font-pixel-display-face: "JetBrains Mono"; }

:root, [lang] {
  --font-mono: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, var(--font-script), system-ui, monospace;
  --font-clean: Inter, var(--font-script), system-ui, sans-serif;
  --font-sticker: var(--font-sticker-face), var(--font-script-rounded), system-ui, sans-serif;
  --font-pixel: "JetBrains Mono", var(--font-script), system-ui, monospace;
  --font-pixel-display: var(--font-pixel-display-face), "JetBrains Mono", var(--font-script), system-ui, monospace;
}

/* style: 青藤 Clean */
:where(:root, :root [lang]), [data-theme^="clean-"], [data-theme^="clean-"] [lang] {
  --font-ui: var(--font-clean);
  --font-display: var(--font-clean);
  --font-data: var(--font-clean);
  --radius-sm: var(--radius-clean-sm);
  --radius-md: var(--radius-clean-md);
  --radius-lg: var(--radius-clean-lg);
  --border-width: var(--border-clean);
  --focus-width: var(--focus-clean);
  --row-height: var(--row-clean);
  --control-height: var(--control-clean);
  --sidebar-width: var(--sidebar-clean);
  --motion-duration: var(--duration-fast);
  --motion-easing: var(--easing-standard);
  --icon-stroke: 1.8;
  --icon-cap: round;
  --icon-join: round;
  --type-title: 700 22px/max(28px, 22px * var(--leading-min)) var(--font-clean);
  --type-title-tracking: calc(-0.01rem * var(--tracking-scale));
  --type-heading: 600 15px/max(22px, 15px * var(--leading-min)) var(--font-clean);
  --type-heading-tracking: 0;
  --type-task: 500 14px/max(20px, 14px * var(--leading-min)) var(--font-clean);
  --type-task-tracking: 0;
  --type-body: 400 14px/max(22px, 14px * var(--leading-min)) var(--font-clean);
  --type-body-tracking: 0;
  --type-caption: 500 12px/max(16px, 12px * var(--leading-min)) var(--font-clean);
  --type-caption-tracking: 0;
  --type-timer: 700 26px/max(30px, 26px * var(--leading-min)) var(--font-clean);
  --type-timer-tracking: calc(-0.01rem * var(--tracking-scale));
}

/* style: 萌虎 Sticker */
[data-theme^="sticker-"], [data-theme^="sticker-"] [lang] {
  --font-ui: var(--font-sticker);
  --font-display: var(--font-sticker);
  --font-data: var(--font-sticker);
  --radius-sm: var(--radius-sticker-sm);
  --radius-md: var(--radius-sticker-md);
  --radius-lg: var(--radius-sticker-lg);
  --border-width: var(--border-sticker);
  --focus-width: var(--focus-sticker);
  --row-height: var(--row-sticker);
  --control-height: var(--control-sticker);
  --sidebar-width: var(--sidebar-sticker);
  --motion-duration: var(--duration-fast);
  --motion-easing: var(--easing-pop);
  --icon-stroke: 2.2;
  --icon-cap: round;
  --icon-join: round;
  --type-title: 700 32px/max(38px, 32px * var(--leading-min)) var(--font-sticker);
  --type-title-tracking: 0;
  --type-heading: 700 17px/max(24px, 17px * var(--leading-min)) var(--font-sticker);
  --type-heading-tracking: 0;
  --type-task: 600 16px/max(22px, 16px * var(--leading-min)) var(--font-sticker);
  --type-task-tracking: 0;
  --type-body: 500 15px/max(22px, 15px * var(--leading-min)) var(--font-sticker);
  --type-body-tracking: 0;
  --type-caption: 600 13px/max(18px, 13px * var(--leading-min)) var(--font-sticker);
  --type-caption-tracking: 0;
  --type-timer: 700 40px/max(44px, 40px * var(--leading-min)) var(--font-sticker);
  --type-timer-tracking: 0;
}

/* style: 像素 Pixel */
[data-theme^="pixel-"], [data-theme^="pixel-"] [lang] {
  --font-ui: var(--font-pixel);
  --font-display: var(--font-pixel-display);
  --font-data: var(--font-mono);
  --radius-sm: var(--radius-pixel-sm);
  --radius-md: var(--radius-pixel-md);
  --radius-lg: var(--radius-pixel-lg);
  --border-width: var(--border-pixel);
  --focus-width: var(--focus-pixel);
  --row-height: var(--row-pixel);
  --control-height: var(--control-pixel);
  --sidebar-width: var(--sidebar-pixel);
  --motion-duration: var(--duration-instant);
  --motion-easing: var(--easing-linear);
  --icon-stroke: 2;
  --icon-cap: square;
  --icon-join: miter;
  --type-title: 700 22px/max(30px, 22px * var(--leading-min)) var(--font-pixel);
  --type-title-tracking: 0;
  --type-heading: 400 11px/max(16px, 11px * var(--leading-min)) var(--font-pixel-display);
  --type-heading-tracking: calc(0.06rem * var(--tracking-scale));
  --type-task: 500 13px/max(20px, 13px * var(--leading-min)) var(--font-pixel);
  --type-task-tracking: 0;
  --type-body: 400 13px/max(20px, 13px * var(--leading-min)) var(--font-pixel);
  --type-body-tracking: 0;
  --type-caption: 400 12px/max(16px, 12px * var(--leading-min)) var(--font-pixel);
  --type-caption-tracking: 0;
  --type-timer: 400 24px/max(28px, 24px * var(--leading-min)) var(--font-pixel-display);
  --type-timer-tracking: 0;
}

/* reading direction: --inline-sign flips offsets that point along the line; .bi-mirror-rtl flips direction-bearing icons */
:root, [dir="ltr"] { --inline-sign: 1; }
[dir="rtl"] { --inline-sign: -1; }
.bi-mirror-rtl { transform: scaleX(var(--inline-sign)); }

:root, [data-theme="clean-light"] {
  color-scheme: light;
  --bg-canvas: #ffffff;
  --bg-sidebar: #f6f8f6;
  --bg-surface: #ffffff;
  --bg-sunken: #f2f5f3;
  --bg-selected: #e6f2ea;
  --bg-hover: #eef2ef;
  --scrim: #10181466;
  --border-default: #e3e8e4;
  --border-subtle: #eef1ef;
  --border-strong: #86928a;
  --text-primary: #17201a;
  --text-secondary: #3e4a42;
  --text-muted: #5f6b64;
  --accent: #1e7f46;
  --on-accent: #ffffff;
  --accent-text: #1b7540;
  --accent-soft: #e3f2e8;
  --on-accent-soft: #145c32;
  --danger: #b93f25;
  --danger-soft: #fbe9e4;
  --on-danger-soft: #9a3119;
  --warning: #9a5b0e;
  --warning-soft: #fbf0dd;
  --on-warning-soft: #7a4709;
  --info: #2753b3;
  --timer: #1b7540;
  --timer-soft: #e3f2e8;
  --on-timer-soft: #145c32;
  --focus-ring: #2753b3;
  --priority-low: #7a8680;
  --priority-medium: #3e6fb8;
  --priority-high: #b86a12;
  --priority-urgent: #c4462b;
  --label-blue: #e6eefb;
  --on-label-blue: #2753b3;
  --label-green: #e3f2e8;
  --on-label-green: #1e6b3e;
  --label-orange: #fcebdd;
  --on-label-orange: #a4480c;
  --label-violet: #f0e8fb;
  --on-label-violet: #6a3ba8;
  --label-gray: #edefee;
  --on-label-gray: #4d5852;
  --label-pink: #fbe6ef;
  --on-label-pink: #a42a5e;
  --label-teal: #dff3f1;
  --on-label-teal: #14665e;
  --avatar-1: #24774a;
  --avatar-2: #3563c9;
  --avatar-3: #a84f0c;
  --avatar-4: #7a45b8;
  --avatar-5: #b3334f;
  --on-avatar: #ffffff;
  --shadow-card: 0 1px 2px 0 #1018140f;
  --shadow-raised: 0 1px 2px 0 #1018140f, 0 4px 16px 0 #1018140f;
  --shadow-overlay: 0 12px 40px 0 #10181429;
}

[data-theme="clean-dark"] {
  color-scheme: dark;
  --bg-canvas: #0f1311;
  --bg-sidebar: #0b0e0c;
  --bg-surface: #151a17;
  --bg-sunken: #121714;
  --bg-selected: #1a2c21;
  --bg-hover: #18201b;
  --scrim: #000000a6;
  --border-default: #232b26;
  --border-subtle: #1b221e;
  --border-strong: #5c6a62;
  --text-primary: #e7ede9;
  --text-secondary: #c2ccc6;
  --text-muted: #8c9891;
  --accent: #45c27a;
  --on-accent: #07140c;
  --accent-text: #45c27a;
  --accent-soft: #173323;
  --on-accent-soft: #8fddb0;
  --danger: #f07a57;
  --danger-soft: #3a1d16;
  --on-danger-soft: #f5a288;
  --warning: #e3a64a;
  --warning-soft: #33270f;
  --on-warning-soft: #edc17e;
  --info: #8fb0f2;
  --timer: #45c27a;
  --timer-soft: #173323;
  --on-timer-soft: #8fddb0;
  --focus-ring: #8fb0f2;
  --priority-low: #76837c;
  --priority-medium: #7fa2ea;
  --priority-high: #e3a64a;
  --priority-urgent: #f07a57;
  --label-blue: #18243a;
  --on-label-blue: #8fb0f2;
  --label-green: #153122;
  --on-label-green: #7fd3a0;
  --label-orange: #3a2414;
  --on-label-orange: #f2a86e;
  --label-violet: #2a1e3d;
  --on-label-violet: #c3a2f2;
  --label-gray: #232a26;
  --on-label-gray: #b2bdb6;
  --label-pink: #3a1a29;
  --on-label-pink: #f29bc2;
  --label-teal: #123331;
  --on-label-teal: #7fd6cc;
  --avatar-1: #24774a;
  --avatar-2: #3563c9;
  --avatar-3: #a84f0c;
  --avatar-4: #7a45b8;
  --avatar-5: #b3334f;
  --on-avatar: #ffffff;
  --shadow-card: 0 1px 2px 0 #00000073;
  --shadow-raised: 0 8px 24px 0 #00000059;
  --shadow-overlay: 0 16px 48px 0 #00000080;
}

[data-theme="sticker-light"] {
  color-scheme: light;
  --bg-canvas: #f2edff;
  --bg-sidebar: #ffe16a;
  --bg-surface: #ffffff;
  --bg-sunken: #e9e2ff;
  --bg-selected: #d9f6e2;
  --bg-hover: #faf8ff;
  --scrim: #1e1b1873;
  --border-default: #1e1b18;
  --border-subtle: #d9d0f5;
  --border-strong: #1e1b18;
  --text-primary: #1e1b18;
  --text-secondary: #3b3640;
  --text-muted: #5e5866;
  --accent: #7edc9c;
  --on-accent: #1e1b18;
  --accent-text: #14703f;
  --accent-soft: #d9f6e2;
  --on-accent-soft: #1e1b18;
  --danger: #b32a12;
  --danger-soft: #ff7a5c;
  --on-danger-soft: #1e1b18;
  --warning: #8a5200;
  --warning-soft: #ffb45e;
  --on-warning-soft: #1e1b18;
  --info: #2f5fb3;
  --timer: #9e2559;
  --timer-soft: #ff9dbb;
  --on-timer-soft: #1e1b18;
  --focus-ring: #5b3fd9;
  --priority-low: #7a7383;
  --priority-medium: #2f5fb3;
  --priority-high: #b86200;
  --priority-urgent: #d3401f;
  --label-blue: #8fd3ff;
  --on-label-blue: #1e1b18;
  --label-green: #7edc9c;
  --on-label-green: #1e1b18;
  --label-orange: #ffb45e;
  --on-label-orange: #1e1b18;
  --label-violet: #c5b5ff;
  --on-label-violet: #1e1b18;
  --label-gray: #e5e0ec;
  --on-label-gray: #1e1b18;
  --label-pink: #ff9dbb;
  --on-label-pink: #1e1b18;
  --label-teal: #c6f36b;
  --on-label-teal: #1e1b18;
  --avatar-1: #7edc9c;
  --avatar-2: #8fd3ff;
  --avatar-3: #ffb45e;
  --avatar-4: #c5b5ff;
  --avatar-5: #ff9dbb;
  --on-avatar: #1e1b18;
  --shadow-card: 3px 3px 0 0 #1e1b18;
  --shadow-raised: 5px 5px 0 0 #1e1b18;
  --shadow-overlay: 8px 8px 0 0 #1e1b18;
}

[data-theme="sticker-dark"] {
  color-scheme: dark;
  --bg-canvas: #1a1722;
  --bg-sidebar: #2a2338;
  --bg-surface: #26222f;
  --bg-sunken: #201c29;
  --bg-selected: #24402f;
  --bg-hover: #2e2939;
  --scrim: #000000b3;
  --border-default: #ece6ff;
  --border-subtle: #3a3348;
  --border-strong: #ece6ff;
  --text-primary: #fbf7ee;
  --text-secondary: #e2dbea;
  --text-muted: #b3aabf;
  --accent: #7edc9c;
  --on-accent: #1e1b18;
  --accent-text: #7edc9c;
  --accent-soft: #24402f;
  --on-accent-soft: #bdf0cd;
  --danger: #ff8a70;
  --danger-soft: #ff7a5c;
  --on-danger-soft: #1e1b18;
  --warning: #ffc27a;
  --warning-soft: #ffb45e;
  --on-warning-soft: #1e1b18;
  --info: #8fd3ff;
  --timer: #ff9dbb;
  --timer-soft: #ff9dbb;
  --on-timer-soft: #1e1b18;
  --focus-ring: #ffe16a;
  --priority-low: #8e8599;
  --priority-medium: #8fd3ff;
  --priority-high: #ffb45e;
  --priority-urgent: #ff7a5c;
  --label-blue: #8fd3ff;
  --on-label-blue: #1e1b18;
  --label-green: #7edc9c;
  --on-label-green: #1e1b18;
  --label-orange: #ffb45e;
  --on-label-orange: #1e1b18;
  --label-violet: #c5b5ff;
  --on-label-violet: #1e1b18;
  --label-gray: #e5e0ec;
  --on-label-gray: #1e1b18;
  --label-pink: #ff9dbb;
  --on-label-pink: #1e1b18;
  --label-teal: #c6f36b;
  --on-label-teal: #1e1b18;
  --avatar-1: #7edc9c;
  --avatar-2: #8fd3ff;
  --avatar-3: #ffb45e;
  --avatar-4: #c5b5ff;
  --avatar-5: #ff9dbb;
  --on-avatar: #1e1b18;
  --shadow-card: 3px 3px 0 0 #7edc9c;
  --shadow-raised: 5px 5px 0 0 #7edc9c;
  --shadow-overlay: 8px 8px 0 0 #7edc9c;
}

[data-theme="pixel-light"] {
  color-scheme: light;
  --bg-canvas: #f3f5f1;
  --bg-sidebar: #ffffff;
  --bg-surface: #ffffff;
  --bg-sunken: #e8ece6;
  --bg-selected: #d6f0df;
  --bg-hover: #edf1ec;
  --scrim: #0d1a1166;
  --border-default: #cbd3cb;
  --border-subtle: #e1e6e0;
  --border-strong: #7d8b80;
  --text-primary: #0d1a11;
  --text-secondary: #2c3b30;
  --text-muted: #526356;
  --accent: #0f7a3c;
  --on-accent: #ffffff;
  --accent-text: #0f7a3c;
  --accent-soft: #d6f0df;
  --on-accent-soft: #0b5a2c;
  --danger: #c22f1c;
  --danger-soft: #fbe3de;
  --on-danger-soft: #9a2415;
  --warning: #855d00;
  --warning-soft: #fbefcf;
  --on-warning-soft: #6b4b00;
  --info: #0b6e8a;
  --timer: #0f7a3c;
  --timer-soft: #d6f0df;
  --on-timer-soft: #0b5a2c;
  --focus-ring: #0b6e8a;
  --priority-low: #7d8b80;
  --priority-medium: #2c3b30;
  --priority-high: #8a6100;
  --priority-urgent: #c22f1c;
  --label-blue: #ddf0f6;
  --on-label-blue: #0b6e8a;
  --label-green: #d6f0df;
  --on-label-green: #0b5a2c;
  --label-orange: #f8eccc;
  --on-label-orange: #7a5600;
  --label-violet: #e9e3fa;
  --on-label-violet: #6745c7;
  --label-gray: #e8ece6;
  --on-label-gray: #3e4d42;
  --label-pink: #f9e1ec;
  --on-label-pink: #a32b66;
  --label-teal: #d8f1ee;
  --on-label-teal: #1b6b60;
  --avatar-1: #0f7a3c;
  --avatar-2: #0b6e8a;
  --avatar-3: #8a6100;
  --avatar-4: #6745c7;
  --avatar-5: #b0306e;
  --on-avatar: #ffffff;
  --shadow-card: none;
  --shadow-raised: 0 0 0 1px #0f7a3c;
  --shadow-overlay: 4px 4px 0 0 #0d1a1133;
}

[data-theme="pixel-dark"] {
  color-scheme: dark;
  --bg-canvas: #0a0e0b;
  --bg-sidebar: #0f1511;
  --bg-surface: #0f1511;
  --bg-sunken: #131b16;
  --bg-selected: #15301f;
  --bg-hover: #121a15;
  --scrim: #000000b3;
  --border-default: #1e2a22;
  --border-subtle: #141d17;
  --border-strong: #56695b;
  --text-primary: #d5e6d9;
  --text-secondary: #a9bdae;
  --text-muted: #889c8d;
  --accent: #6ee7a0;
  --on-accent: #06210f;
  --accent-text: #6ee7a0;
  --accent-soft: #15301f;
  --on-accent-soft: #6ee7a0;
  --danger: #ff6b57;
  --danger-soft: #3a1712;
  --on-danger-soft: #ff8a7a;
  --warning: #ffc857;
  --warning-soft: #332808;
  --on-warning-soft: #ffc857;
  --info: #67d4f5;
  --timer: #6ee7a0;
  --timer-soft: #15301f;
  --on-timer-soft: #6ee7a0;
  --focus-ring: #ffc857;
  --priority-low: #6f8475;
  --priority-medium: #a9bdae;
  --priority-high: #ffc857;
  --priority-urgent: #ff6b57;
  --label-blue: #0f2a33;
  --on-label-blue: #67d4f5;
  --label-green: #15301f;
  --on-label-green: #6ee7a0;
  --label-orange: #2e240a;
  --on-label-orange: #ffc857;
  --label-violet: #231c3a;
  --on-label-violet: #b69cff;
  --label-gray: #18211b;
  --on-label-gray: #a9bdae;
  --label-pink: #33142a;
  --on-label-pink: #ff8ac2;
  --label-teal: #0f2e2a;
  --on-label-teal: #6fe0cf;
  --avatar-1: #6ee7a0;
  --avatar-2: #67d4f5;
  --avatar-3: #ffc857;
  --avatar-4: #b69cff;
  --avatar-5: #ff8ac2;
  --on-avatar: #06210f;
  --shadow-card: none;
  --shadow-raised: 0 0 0 1px #6ee7a0;
  --shadow-overlay: 4px 4px 0 0 #00000099;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme]) {
    color-scheme: dark;
    --bg-canvas: #0f1311;
    --bg-sidebar: #0b0e0c;
    --bg-surface: #151a17;
    --bg-sunken: #121714;
    --bg-selected: #1a2c21;
    --bg-hover: #18201b;
    --scrim: #000000a6;
    --border-default: #232b26;
    --border-subtle: #1b221e;
    --border-strong: #5c6a62;
    --text-primary: #e7ede9;
    --text-secondary: #c2ccc6;
    --text-muted: #8c9891;
    --accent: #45c27a;
    --on-accent: #07140c;
    --accent-text: #45c27a;
    --accent-soft: #173323;
    --on-accent-soft: #8fddb0;
    --danger: #f07a57;
    --danger-soft: #3a1d16;
    --on-danger-soft: #f5a288;
    --warning: #e3a64a;
    --warning-soft: #33270f;
    --on-warning-soft: #edc17e;
    --info: #8fb0f2;
    --timer: #45c27a;
    --timer-soft: #173323;
    --on-timer-soft: #8fddb0;
    --focus-ring: #8fb0f2;
    --priority-low: #76837c;
    --priority-medium: #7fa2ea;
    --priority-high: #e3a64a;
    --priority-urgent: #f07a57;
    --label-blue: #18243a;
    --on-label-blue: #8fb0f2;
    --label-green: #153122;
    --on-label-green: #7fd3a0;
    --label-orange: #3a2414;
    --on-label-orange: #f2a86e;
    --label-violet: #2a1e3d;
    --on-label-violet: #c3a2f2;
    --label-gray: #232a26;
    --on-label-gray: #b2bdb6;
    --label-pink: #3a1a29;
    --on-label-pink: #f29bc2;
    --label-teal: #123331;
    --on-label-teal: #7fd6cc;
    --avatar-1: #24774a;
    --avatar-2: #3563c9;
    --avatar-3: #a84f0c;
    --avatar-4: #7a45b8;
    --avatar-5: #b3334f;
    --on-avatar: #ffffff;
    --shadow-card: 0 1px 2px 0 #00000073;
    --shadow-raised: 0 8px 24px 0 #00000059;
    --shadow-overlay: 0 16px 48px 0 #00000080;
  }
}

/* type utility classes */
.bi-title { font: var(--type-title); letter-spacing: var(--type-title-tracking); }
.bi-heading { font: var(--type-heading); letter-spacing: var(--type-heading-tracking); }
.bi-task { font: var(--type-task); letter-spacing: var(--type-task-tracking); }
.bi-body { font: var(--type-body); letter-spacing: var(--type-body-tracking); }
.bi-caption { font: var(--type-caption); letter-spacing: var(--type-caption-tracking); }
.bi-timer { font: var(--type-timer); letter-spacing: var(--type-timer-tracking); }

@media (prefers-reduced-motion: reduce) { :root { --motion-duration: 0ms; } }