@layer{[data-react-aria-pressable] { touch-action: pan-x pan-y pinch-zoom; }
}
@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){:root, :host { --comma-chat-task-item-tint: transparent; }
*, ::before, ::after, ::backdrop { --tw-translate-x: 0; --tw-translate-y: 0; --tw-translate-z: 0; --tw-scale-x: 1; --tw-scale-y: 1; --tw-scale-z: 1; --tw-rotate-x: initial; --tw-rotate-y: initial; --tw-rotate-z: initial; --tw-skew-x: initial; --tw-skew-y: initial; --tw-space-y-reverse: 0; --tw-border-style: solid; --tw-leading: initial; --tw-font-weight: initial; --tw-tracking: initial; --tw-ordinal: initial; --tw-slashed-zero: initial; --tw-numeric-figure: initial; --tw-numeric-spacing: initial; --tw-numeric-fraction: initial; --tw-shadow: 0 0 #0000; --tw-shadow-color: initial; --tw-shadow-alpha: 100%; --tw-inset-shadow: 0 0 #0000; --tw-inset-shadow-color: initial; --tw-inset-shadow-alpha: 100%; --tw-ring-color: initial; --tw-ring-shadow: 0 0 #0000; --tw-inset-ring-color: initial; --tw-inset-ring-shadow: 0 0 #0000; --tw-ring-inset: initial; --tw-ring-offset-width: 0px; --tw-ring-offset-color: #fff; --tw-ring-offset-shadow: 0 0 #0000; --tw-outline-style: solid; --tw-blur: initial; --tw-brightness: initial; --tw-contrast: initial; --tw-grayscale: initial; --tw-hue-rotate: initial; --tw-invert: initial; --tw-opacity: initial; --tw-saturate: initial; --tw-sepia: initial; --tw-drop-shadow: initial; --tw-drop-shadow-color: initial; --tw-drop-shadow-alpha: 100%; --tw-drop-shadow-size: initial; --tw-backdrop-blur: initial; --tw-backdrop-brightness: initial; --tw-backdrop-contrast: initial; --tw-backdrop-grayscale: initial; --tw-backdrop-hue-rotate: initial; --tw-backdrop-invert: initial; --tw-backdrop-opacity: initial; --tw-backdrop-saturate: initial; --tw-backdrop-sepia: initial; --tw-duration: initial; --tw-ease: initial; --tw-content: ""; --radix-collapsible-content-height: 0px; --radix-collapsible-content-width: 0px; --scroll-area-edge-mask-start: 0px; --scroll-area-edge-mask-end: 0px; --scroll-area-edge-blur-layer-radius: 0px; --scroll-area-edge-mask-image: initial; --comma-home-greet-preferred: 300px; --comma-home-greet-width: 300px; --comma-home-tasks-preferred: 300px; --comma-home-greet-fold: 0; --comma-home-tasks-fold: 0; --comma-home-rail-fold-progress: 0; --comma-sidebar-fold-progress: 0; }
}
}
@layer theme{:root, :host { --font-sans: "Inter Variable", "SF Pro Display", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif; --font-mono: "Geist Mono", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace; --color-red-500: oklch(63.7% .237 25.331); --color-red-700: oklch(50.5% .213 27.518); --color-red-800: oklch(44.4% .177 26.899); --color-orange-50: #fef6ee; --color-orange-100: #fdead7; --color-orange-200: #f9dbaf; --color-orange-300: #f7b27a; --color-orange-400: #f38744; --color-orange-500: #ef6820; --color-orange-600: #e04f16; --color-orange-700: #b93815; --color-orange-800: #932f19; --color-orange-900: #772917; --color-orange-950: #511c10; --color-yellow-50: #fefbe8; --color-yellow-100: #fef7c3; --color-yellow-200: #feee95; --color-yellow-300: #fde272; --color-yellow-400: #fac515; --color-yellow-500: #eaaa08; --color-yellow-600: #ca8504; --color-yellow-700: #a15c07; --color-yellow-800: #854a0e; --color-yellow-900: #713b12; --color-yellow-950: #542c0d; --color-green-50: #edfcf2; --color-green-100: #d3f8df; --color-green-200: #aaf0c4; --color-green-300: #73e2a3; --color-green-400: #3ccb7f; --color-green-500: #16b364; --color-green-600: #099250; --color-green-700: #087443; --color-green-800: #095c37; --color-green-900: #084c2e; --color-green-950: #052e1c; --color-teal-50: #f0fdf9; --color-teal-100: #ccfbef; --color-teal-200: #99f6e0; --color-teal-300: #5fe9d0; --color-teal-400: #2ed3b7; --color-teal-500: #15b79e; --color-teal-600: #0e9384; --color-teal-700: #107569; --color-teal-800: #125d56; --color-teal-900: #134e48; --color-teal-950: #0a2926; --color-cyan-50: #ecfdff; --color-cyan-100: #cff9fe; --color-cyan-200: #a5f0fc; --color-cyan-300: #67e3f9; --color-cyan-400: #2ce; --color-cyan-500: #06aed4; --color-cyan-600: #088ab2; --color-cyan-700: #0e7090; --color-cyan-800: #155b75; --color-cyan-900: #164c63; --color-cyan-950: #0d2d3a; --color-blue-50: #eff8ff; --color-blue-100: #d1e9ff; --color-blue-200: #b2ddff; --color-blue-300: #84caff; --color-blue-400: #53b1fd; --color-blue-500: #2e90fa; --color-blue-600: #1570ef; --color-blue-700: #175cd3; --color-blue-800: #1849a9; --color-blue-900: #194185; --color-blue-950: #102a56; --color-indigo-50: #eef4ff; --color-indigo-100: #e0eaff; --color-indigo-200: #c7d7fe; --color-indigo-300: #a4bcfd; --color-indigo-400: #8098f9; --color-indigo-500: #6172f3; --color-indigo-600: #444ce7; --color-indigo-700: #3538cd; --color-indigo-800: #2d31a6; --color-indigo-900: #2d3282; --color-indigo-950: #1f235b; --color-violet-50: #f5f3ff; --color-violet-100: #ece9fe; --color-violet-200: #ddd6fe; --color-violet-300: #c3b5fd; --color-violet-400: #a48afb; --color-violet-500: #875bf7; --color-violet-600: #7839ee; --color-violet-700: #6927da; --color-violet-800: #5720b7; --color-violet-900: #491c96; --color-violet-950: #2e125e; --color-purple-50: #f4f3ff; --color-purple-100: #ebe9fe; --color-purple-200: #d9d6fe; --color-purple-300: #bdb4fe; --color-purple-400: #9b8afb; --color-purple-500: #7a5af8; --color-purple-600: #6938ef; --color-purple-700: #5925dc; --color-purple-800: #4a1fb8; --color-purple-900: #3e1c96; --color-purple-950: #27115f; --color-fuchsia-50: #fdf4ff; --color-fuchsia-100: #fbe8ff; --color-fuchsia-200: #f6d0fe; --color-fuchsia-300: #eeaafd; --color-fuchsia-400: #e478fa; --color-fuchsia-500: #d444f1; --color-fuchsia-600: #ba24d5; --color-fuchsia-700: #9f1ab1; --color-fuchsia-800: #821890; --color-fuchsia-900: #6f1877; --color-fuchsia-950: #47104c; --color-pink-50: #fdf2fa; --color-pink-100: #fce7f6; --color-pink-200: #fcceee; --color-pink-300: #faa7e0; --color-pink-400: #f670c7; --color-pink-500: #ee46bc; --color-pink-600: #dd2590; --color-pink-700: #c11574; --color-pink-800: #9e165f; --color-pink-900: #851651; --color-pink-950: #4e0d30; --color-rose-50: #fff1f3; --color-rose-100: #ffe4e8; --color-rose-200: #fecdd6; --color-rose-300: #fea3b4; --color-rose-400: #fd6f8e; --color-rose-500: #f63d68; --color-rose-600: #e31b54; --color-rose-700: #c01048; --color-rose-800: #a11043; --color-rose-900: #89123e; --color-rose-950: #510b24; --color-black: #000; --color-white: #fff; --spacing: .25rem; --container-xs: 384px; --container-sm: 480px; --container-md: 560px; --container-lg: 640px; --container-xl: 768px; --container-2xl: 1024px; --container-3xl: 1280px; --container-4xl: 1440px; --container-5xl: 1600px; --container-6xl: 1920px; --text-xs: .75rem; --text-xs--line-height: 1.125rem; --text-sm: .8125rem; --text-sm--line-height: 1.25rem; --text-base: 1rem; --text-base--line-height: calc(1.5 / 1); --text-lg: 1.125rem; --text-lg--line-height: 1.75rem; --text-xl: 1.25rem; --text-xl--line-height: 1.875rem; --text-2xl: 1.5rem; --text-2xl--line-height: calc(2 / 1.5); --font-weight-normal: 450; --font-weight-medium: 500; --font-weight-semibold: 600; --font-weight-bold: 700; --tracking-normal: 0em; --tracking-wide: .025em; --radius-xs: 4px; --radius-sm: 6px; --radius-md: 8px; --radius-lg: 10px; --radius-xl: 12px; --radius-2xl: 16px; --radius-3xl: 20px; --radius-4xl: 24px; --shadow-xs: 0 1px 2px 0 #1018280d; --shadow-sm: 0 1px 2px 0 #1018280f, 0 1px 3px 0 #1018281a; --shadow-md: 0 2px 4px -2px #1018280f, 0 4px 8px -2px #1018281a; --shadow-lg: 0 4px 6px -2px #10182808, 0 12px 16px -4px #10182814; --shadow-xl: 0 8px 8px -4px #10182808, 0 20px 24px -4px #10182814; --shadow-2xl: 0 24px 48px -12px #1018282e; --ease-in: cubic-bezier(.4, 0, 1, 1); --ease-out: cubic-bezier(0, 0, .2, 1); --ease-in-out: cubic-bezier(.4, 0, .2, 1); --animate-spin: spin 1s linear infinite; --animate-ping: ping 1s cubic-bezier(0, 0, .2, 1) infinite; --animate-pulse: pulse 2s cubic-bezier(.4, 0, .6, 1) infinite; --blur-sm: 8px; --blur-md: 16px; --blur-lg: 24px; --blur-xl: 40px; --aspect-video: 16 / 9; --default-transition-duration: .15s; --default-transition-timing-function: cubic-bezier(.4, 0, .2, 1); --default-font-family: var(--font-sans); --default-mono-font-family: var(--font-mono); --color-alpha-black-10: #0000001a; --color-alpha-black-20: #0003; --color-alpha-black-30: #0000004d; --color-alpha-black-40: #0006; --color-alpha-black-50: #00000080; --color-alpha-black-60: #0009; --color-alpha-black-70: #000000b2; --color-alpha-black-80: #000c; --color-alpha-black-90: #000000e5; --color-alpha-black-100: #000; --color-alpha-white-10: #ffffff1a; --color-alpha-white-20: #fff3; --color-alpha-white-30: #ffffff4d; --color-alpha-white-40: #fff6; --color-alpha-white-50: #ffffff80; --color-alpha-white-60: #fff9; --color-alpha-white-70: #ffffffb2; --color-alpha-white-80: #fffc; --color-alpha-white-90: #ffffffe5; --color-alpha-white-100: #fff; --color-alpha-dark-black-10: #ffffff1a; --color-alpha-dark-black-20: #fff3; --color-alpha-dark-black-30: #ffffff4d; --color-alpha-dark-black-40: #fff6; --color-alpha-dark-black-50: #ffffff80; --color-alpha-dark-black-60: #fff9; --color-alpha-dark-black-70: #ffffffb2; --color-alpha-dark-black-80: #fffc; --color-alpha-dark-black-90: #ffffffe5; --color-alpha-dark-black-100: #fff; --color-alpha-dark-white-10: #0c111d1a; --color-alpha-dark-white-20: #0c111d33; --color-alpha-dark-white-30: #0c111d4d; --color-alpha-dark-white-40: #0c111d66; --color-alpha-dark-white-50: #0c111d80; --color-alpha-dark-white-60: #0c111d99; --color-alpha-dark-white-70: #0c111db2; --color-alpha-dark-white-80: #0c111dcc; --color-alpha-dark-white-90: #0c111de5; --color-alpha-dark-white-100: oklch(from #0f0f10 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-base-white: #fff; --color-base-black: #000; --color-base-transparent: #fff0; --color-brand-25: #e1f9ff; --color-brand-50: #b8ddff; --color-brand-100: #8cbfff; --color-brand-200: #619eff; --color-brand-300: #3b7cff; --color-brand-400: #205bff; --color-brand-500: #1040f2; --color-brand-600: #092fc0; --color-brand-700: #062389; --color-brand-800: #041756; --color-brand-900: #02092b; --color-brand-950: #00010b; --color-error-25: #fffbfa; --color-error-50: #fef3f2; --color-error-100: #fee4e2; --color-error-200: #fecdca; --color-error-300: #fda29b; --color-error-400: #f97066; --color-error-500: #f04438; --color-error-600: #d92d20; --color-error-700: #b42318; --color-error-800: #912018; --color-error-900: #7a271a; --color-error-950: #55160c; --color-success-25: #f6fef9; --color-success-50: #ecfdf3; --color-success-100: #dcfae6; --color-success-200: #abefc6; --color-success-300: #75e0a7; --color-success-400: #47cd89; --color-success-500: #17b26a; --color-success-600: #079455; --color-success-700: #067647; --color-success-800: #085d3a; --color-success-900: #074d31; --color-success-950: #053321; --color-warning-25: #fffcf5; --color-warning-50: #fffaeb; --color-warning-100: #fef0c7; --color-warning-200: #fedf89; --color-warning-300: #fec84b; --color-warning-400: #fdb022; --color-warning-500: #f79009; --color-warning-600: #dc6803; --color-warning-700: #b54708; --color-warning-800: #93370d; --color-warning-900: #7a2e0e; --color-warning-950: #4e1d09; --color-gray-blue-25: #fcfcfd; --color-gray-blue-50: #f8f9fc; --color-gray-blue-100: #eaecf5; --color-gray-blue-200: #d5d9eb; --color-gray-blue-300: #b3b8db; --color-gray-blue-400: #717bbc; --color-gray-blue-500: #4e5ba6; --color-gray-blue-600: #3e4784; --color-gray-blue-700: #363f72; --color-gray-blue-800: #293056; --color-gray-blue-900: #101323; --color-gray-blue-950: #0d0f1c; --color-gray-cool-25: #fcfcfd; --color-gray-cool-50: #f9f9fb; --color-gray-cool-100: #eff1f5; --color-gray-cool-200: #dcdfea; --color-gray-cool-300: #b9c0d4; --color-gray-cool-400: #7d89b0; --color-gray-cool-500: #5d6b98; --color-gray-cool-600: #4a5578; --color-gray-cool-700: #404968; --color-gray-cool-800: #30374f; --color-gray-cool-900: #111322; --color-gray-cool-950: #0e101b; --color-gray-dark-mode-25: oklch(from #fafafa calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-gray-dark-mode-50: oklch(from #f6f6f6 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-gray-dark-mode-100: oklch(from #f1f1f1 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-gray-dark-mode-200: oklch(from #ededed calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-gray-dark-mode-300: oklch(from #d1d1d1 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-gray-dark-mode-400: oklch(from #a4a5a9 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-gray-dark-mode-500: oklch(from #7e8187 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-gray-dark-mode-600: oklch(from #54565a calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-gray-dark-mode-700: oklch(from #343538 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-gray-dark-mode-800: oklch(from #27282b calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-gray-dark-mode-900: oklch(from #18191b calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-gray-dark-mode-950: oklch(from #0f0f10 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-gray-iron-25: #fcfcfc; --color-gray-iron-50: oklch(from #fafafa calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-gray-iron-100: #f4f4f5; --color-gray-iron-200: #e4e4e7; --color-gray-iron-300: #d1d1d6; --color-gray-iron-400: #a0a0ab; --color-gray-iron-500: #70707b; --color-gray-iron-600: #51525c; --color-gray-iron-700: #3f3f46; --color-gray-iron-800: #26272b; --color-gray-iron-900: #1a1a1e; --color-gray-iron-950: #131316; --color-gray-light-mode-25: oklch(from #fdfdfd calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-gray-light-mode-50: oklch(from #fafafa calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-gray-light-mode-100: oklch(from #f5f5f5 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-gray-light-mode-200: oklch(from #f1f1f1 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-gray-light-mode-300: oklch(from #dfe0e2 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-gray-light-mode-400: oklch(from #b6b8bb calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-gray-light-mode-500: oklch(from #7f8286 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-gray-light-mode-600: oklch(from #5b5e63 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-gray-light-mode-700: oklch(from #4a4c50 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-gray-light-mode-800: oklch(from #222326 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-gray-light-mode-900: oklch(from #1a1b1e calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-gray-light-mode-950: oklch(from #111213 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-gray-modern-25: #fcfcfd; --color-gray-modern-50: #f8fafc; --color-gray-modern-100: #eef2f6; --color-gray-modern-200: #e3e8ef; --color-gray-modern-300: #cdd5df; --color-gray-modern-400: #9aa4b2; --color-gray-modern-500: #697586; --color-gray-modern-600: #4b5565; --color-gray-modern-700: #364152; --color-gray-modern-800: #202939; --color-gray-modern-900: #121926; --color-gray-modern-950: #0d121c; --color-gray-neutral-25: #fcfcfd; --color-gray-neutral-50: #f9fafb; --color-gray-neutral-100: #f3f4f6; --color-gray-neutral-200: #e5e7eb; --color-gray-neutral-300: #d2d6db; --color-gray-neutral-400: #9da4ae; --color-gray-neutral-500: #6c737f; --color-gray-neutral-600: #4d5761; --color-gray-neutral-700: #384250; --color-gray-neutral-800: #1f2a37; --color-gray-neutral-900: #111927; --color-gray-neutral-950: #0d121c; --color-gray-true-25: #fcfcfc; --color-gray-true-50: oklch(from #fafafa calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-gray-true-100: oklch(from #f5f5f5 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-gray-true-200: #e5e5e5; --color-gray-true-300: #d6d6d6; --color-gray-true-400: #a3a3a3; --color-gray-true-500: #737373; --color-gray-true-600: #525252; --color-gray-true-700: #424242; --color-gray-true-800: #292929; --color-gray-true-900: #141414; --color-gray-true-950: #0f0f0f; --color-gray-warm-25: #fdfdfc; --color-gray-warm-50: #fafaf9; --color-gray-warm-100: #f5f5f4; --color-gray-warm-200: #e7e5e4; --color-gray-warm-300: #d7d3d0; --color-gray-warm-400: #a9a29d; --color-gray-warm-500: #79716b; --color-gray-warm-600: #57534e; --color-gray-warm-700: #44403c; --color-gray-warm-800: #292524; --color-gray-warm-900: #1c1917; --color-gray-warm-950: #171412; --color-blue-25: #f5faff; --color-blue-dark-25: #f5f8ff; --color-blue-dark-50: #eff4ff; --color-blue-dark-100: #d1e0ff; --color-blue-dark-200: #b2ccff; --color-blue-dark-300: #84adff; --color-blue-dark-400: #528bff; --color-blue-dark-500: #4080ff; --color-blue-dark-600: #155eef; --color-blue-dark-700: #004eeb; --color-blue-dark-800: #0040c1; --color-blue-dark-900: #00359e; --color-blue-dark-950: #026; --color-blue-light-25: #f5fbff; --color-blue-light-50: #f0f9ff; --color-blue-light-100: #e0f2fe; --color-blue-light-200: #b9e6fe; --color-blue-light-300: #7cd4fd; --color-blue-light-400: #36bffa; --color-blue-light-500: #0ba5ec; --color-blue-light-600: #0086c9; --color-blue-light-700: #026aa2; --color-blue-light-800: #065986; --color-blue-light-900: #0b4a6f; --color-blue-light-950: #062c41; --color-cyan-25: #f5feff; --color-green-25: #f6fef9; --color-green-light-25: #fafef5; --color-green-light-50: #f3fee7; --color-green-light-100: #e3fbcc; --color-green-light-200: #d0f8ab; --color-green-light-300: #a6ef67; --color-green-light-400: #85e13a; --color-green-light-500: #66c61c; --color-green-light-600: #4ca30d; --color-green-light-700: #3b7c0f; --color-green-light-800: #326212; --color-green-light-900: #2b5314; --color-green-light-950: #15290a; --color-moss-25: #fafdf7; --color-moss-50: #f5fbee; --color-moss-100: #e6f4d7; --color-moss-200: #ceeab0; --color-moss-300: #acdc79; --color-moss-400: #86cb3c; --color-moss-500: #669f2a; --color-moss-600: #4f7a21; --color-moss-700: #3f621a; --color-moss-800: #335015; --color-moss-900: #2b4212; --color-moss-950: #1a280b; --color-teal-25: #f6fefc; --color-fuchsia-25: #fefaff; --color-indigo-25: #f5f8ff; --color-orange-25: #fefaf5; --color-orange-dark-25: #fff9f5; --color-orange-dark-50: #fff4ed; --color-orange-dark-100: #ffe6d5; --color-orange-dark-200: #ffd6ae; --color-orange-dark-300: #ff9c66; --color-orange-dark-400: #ff692e; --color-orange-dark-500: #ff4405; --color-orange-dark-600: #e62e05; --color-orange-dark-700: #bc1b06; --color-orange-dark-800: #97180c; --color-orange-dark-900: #771a0d; --color-orange-dark-950: #57130a; --color-pink-25: #fef6fb; --color-purple-25: #fafaff; --color-rose-25: #fff5f6; --color-violet-25: #fbfaff; --color-yellow-25: #fefdf0; --color-text-primary: oklch(from #1a1b1e calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-text-secondary: oklch(from #4a4c50 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-text-tertiary: oklch(from #5b5e63 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-text-quaternary: oklch(from #7f8286 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-text-white: #fff; --color-text-disabled: oklch(from #b6b8bb calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-text-placeholder: oklch(from #b6b8bb calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-text-claude: #d97757; --color-text-codex: #706ffc; --color-text-brand-primary: #02092b; --color-text-brand-secondary: #062389; --color-text-brand-tertiary: #092fc0; --color-text-error-primary: #d92d20; --color-text-warning-primary: #f79009; --color-text-success-primary: #079455; --color-border-primary: oklch(from #dfe0e2 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-border-menu-primary: oklch(from #b6b8bb calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-border-secondary: oklch(from #f1f1f1 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-border-tertiary: oklch(from #f5f5f5 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-border-disabled: oklch(from #dfe0e2 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-border-brand: #3b7cff; --color-border-brand-solid: #092fc0; --color-border-error: #fda29b; --color-border-error-solid: #d92d20; --color-fg-primary: oklch(from #1a1b1e calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-fg-secondary: oklch(from #4a4c50 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-fg-tertiary: oklch(from #5b5e63 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-fg-quaternary: oklch(from #7f8286 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-fg-quinary: oklch(from #b6b8bb calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-fg-quinary-hover: oklch(from #7f8286 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-fg-senary: oklch(from #dfe0e2 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-fg-button: #fff; --color-fg-button-active: oklch(from #dfe0e2 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-fg-button-secondary: #fff; --color-fg-white: #fff; --color-fg-disabled: oklch(from #b6b8bb calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-fg-brand-primary: #092fc0; --color-fg-error-primary: #d92d20; --color-fg-warning-primary: #dc6803; --color-fg-warning-secondary: #f79009; --color-fg-success-primary: #079455; --color-bg-primary: oklch(from #fff calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-bg-popup-primary: oklch(from #fff calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-bg-popup-secondary: oklch(from #fff calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-bg-secondary: oklch(from #fafafa calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-bg-secondary-hover: oklch(from #f5f5f5 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-bg-tertiary: oklch(from #f5f5f5 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-bg-quaternary: oklch(from #f1f1f1 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-bg-quaternary-hover: oklch(from #f1f1f1 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-bg-active: oklch(from #fafafa calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-bg-disabled: oklch(from #f5f5f5 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-bg-overlay: oklch(from #111213 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-bg-brand-primary: #b8ddff; --color-bg-brand-secondary: #8cbfff; --color-bg-brand-solid: #205bff; --color-bg-brand-solid-hover: #1040f2; --color-bg-error-primary: #fef3f2; --color-bg-error-solid: #d92d20; --color-bg-warning-primary: #fffaeb; --color-bg-warning-solid: #dc6803; --color-bg-success-primary: #ecfdf3; --color-bg-success-solid: #079455; --color-bg-toggle: oklch(from #dfe0e2 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-bg-toggle-hover: oklch(from #f1f1f1 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-bg-window: oklch(from #f5f5f5 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-bg-claude: #f1cdc1; --color-bg-codex: #cdccff; --color-bg-gpt: #e2e9ed; --color-toast-text-primary: oklch(from #222326 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-toast-text-secondary: oklch(from #7f8286 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-toast-icon-primary: oklch(from #5b5e63 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-button-primary-bg: #205bff; --color-button-primary-bg-hover: #1040f2; --color-button-primary-border: #1040f2; --color-button-primary-border-hover: #092fc0; --color-button-primary-fg: #fff; --color-button-primary-fg-hover: #fff; --color-button-secondary-bg: #fff; --color-button-secondary-border: oklch(from #dfe0e2 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-button-secondary-fg: oklch(from #222326 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-button-secondary-color-bg: #fff; --color-button-secondary-color-bg-hover: #b8ddff; --color-button-secondary-color-border: #3b7cff; --color-button-secondary-color-border-hover: #3b7cff; --color-button-secondary-color-fg: #1040f2; --color-button-secondary-color-fg-hover: #062389; --color-button-tertiary-fg: oklch(from #5b5e63 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-button-tertiary-fg-hover: oklch(from #4a4c50 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-button-tertiary-bg-hover: oklch(from #fafafa calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-button-tertiary-color-fg: #062389; --color-button-tertiary-color-fg-hover: #041756; --color-button-tertiary-color-bg-hover: #b8ddff; --color-button-primary-error-bg: #d92d20; --color-button-primary-error-bg-hover: #b42318; --color-button-primary-error-border: #d92d20; --color-button-primary-error-border-hover: #b42318; --color-button-primary-error-fg: #fff; --color-button-primary-error-fg-hover: #fff; --color-dialog-bg: #fff; --color-dialog-shortcut-on-primary-bg: #ffffff29; --color-dialog-shortcut-on-primary-text: #ffffffeb; --color-menu-hover-error: #fef3f2; --color-toggle-button-fg-disabled: oklch(from #fafafa calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-slider-handle-bg: #fff; --color-slider-handle-border: #092fc0; --color-avatar-bg: oklch(from #f5f5f5 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-avatar-profile-photo-border: #fff; --color-tooltip-bg: oklch(from #27282b calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-tooltip-border: oklch(from #343538 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-tooltip-text: oklch(from #f6f6f6 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-tooltip-supporting-text: oklch(from #d1d1d1 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-tooltip-shortcut-bg: oklch(from #54565a calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-tooltip-shortcut-text: oklch(from #d1d1d1 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-ai-input-header-icon-primary: oklch(from #5b5e63 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-ai-input-header-text-primary: #000; --color-ai-input-header-text-secondary: oklch(from #7f8286 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-ai-input-panel-icon-primary: oklch(from #7f8286 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-ai-input-panel-icon-disabled: oklch(from #dfe0e2 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-ai-input-panel-icon-fg: #fff; --color-ai-input-panel-icon-warning: #f79009; --color-ai-input-panel-text-primary: #000; --color-ai-input-panel-text-placeholder: oklch(from #b6b8bb calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-ai-input-panel-text-warning: #f79009; --color-ai-input-panel-bg-input: #fff; --color-ai-input-panel-bg-tag: #000; --color-ai-input-panel-text-attachment-primary: oklch(from #1a1b1e calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-ai-input-panel-text-attachment-secondary: oklch(from #7f8286 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-ai-input-panel-bg-disabled: oklch(from #f5f5f5 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-ai-input-panel-bg-attachment: #fff; --color-panel-bg-file: oklch(from #f1f1f1 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-markdown-text-primary: oklch(from #1a1b1e calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-markdown-text-secondary: oklch(from #7f8286 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-markdown-text-tool-primary: oklch(from #7f8286 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-markdown-audio-control-primary: oklch(from #5b5e63 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-markdown-text-inline-primary: oklch(from #1a1b1e calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-markdown-text-inline-code: #912018; --color-markdown-bg-inline-code: oklch(from #f1f1f1 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-markdown-text-link: #3b7cff; --color-markdown-bg-message: oklch(from #f1f1f1 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-markdown-bg-table: oklch(from #f5f5f5 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-markdown-border-table: oklch(from #dfe0e2 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-markdown-bg-tool: #fff; --color-markdown-icon-primary: oklch(from #7f8286 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-markdown-bg-icon-hover: oklch(from #f1f1f1 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-markdown-image-bg-primary: #ffffffb2; --color-markdown-image-hover: #0000001a; --color-markdown-image-icon-primary: oklch(from #4a4c50 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-markdown-image-bar-border: oklch(from #dfe0e2 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-markdown-sound-video-icon-primary: oklch(from #dfe0e2 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-markdown-sound-video-text-primary: oklch(from #dfe0e2 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-markdown-sound-video-bg-hover: #fff3; --color-markdown-sound-video-bg-player-bar: #000000b2; --color-markdown-sound-video-bg-progress: oklch(from #b6b8bb calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-markdown-sound-video-bg-tracker: oklch(from #fdfdfd calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-markdown-sound-video-bar-border: oklch(from #5b5e63 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-markdown-sound-video-bg-preview: #000; --color-main-panel-bg: oklch(from #fdfdfd calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-main-panel-item-bg: #fff; --color-plugin-bg-button: #fff; --color-plugin-border: #fff; --color-plugin-row-bg-hover: oklch(from #f1f1f1 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-todo-kanban-bg-card-primary: #fff; --color-todo-kanban-bg-column-primary: oklch(from #fafafa calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-todo-list-bg-needs-review-main: #f0ede6; --color-todo-list-bg-done: #e2ede8; --color-todo-list-bg-cancel: #f2eceb; --color-todo-list-bg-group-fade: oklch(from #fafafa calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-sidebar-text-primary: oklch(from #222326 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-sidebar-text-secondary: oklch(from #4a4c50 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-sidebar-text-tertiary: oklch(from #7f8286 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-sidebar-bg-selection: oklch(from #f5f5f5 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-sidebar-text-highlight: oklch(from #111213 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-sidebar-icon-primary: oklch(from #7f8286 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-sidebar-icon-secondary: oklch(from #7f8286 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-sidebar-icon-disabled: oklch(from #b6b8bb calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-sidebar-bg-item: oklch(from #dfe0e2 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-scrollbar-bg: oklch(from #dfe0e2 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-utility-gray-50: oklch(from #fafafa calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-utility-gray-200: oklch(from #f1f1f1 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-utility-gray-300: oklch(from #dfe0e2 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-utility-gray-700: oklch(from #4a4c50 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-utility-brand-50: #b8ddff; --color-utility-brand-100: #8cbfff; --color-utility-brand-200: #619eff; --color-utility-brand-300: #3b7cff; --color-utility-brand-400: #205bff; --color-utility-brand-700: #062389; --color-utility-error-50: #fef3f2; --color-utility-error-200: #fecdca; --color-utility-error-300: #fda29b; --color-utility-error-700: #b42318; --color-utility-warning-50: #fffaeb; --color-utility-warning-200: #fedf89; --color-utility-warning-300: #fec84b; --color-utility-warning-700: #b54708; --color-utility-success-50: #ecfdf3; --color-utility-success-200: #abefc6; --color-utility-success-300: #75e0a7; --color-utility-success-700: #067647; --color-utility-blue-50: #eff8ff; --color-utility-blue-200: #b2ddff; --color-utility-blue-300: #84caff; --color-utility-blue-700: #175cd3; --color-utility-indigo-50: #eef4ff; --color-utility-indigo-200: #c7d7fe; --color-utility-indigo-300: #a4bcfd; --color-utility-indigo-700: #3538cd; --color-utility-purple-50: #f4f3ff; --color-utility-purple-200: #d9d6fe; --color-utility-purple-300: #bdb4fe; --color-utility-purple-700: #5925dc; --color-utility-pink-50: #fdf2fa; --color-utility-pink-200: #fcceee; --color-utility-pink-300: #faa7e0; --color-utility-pink-700: #c11574; --color-utility-orange-50: #fef6ee; --color-utility-orange-200: #f9dbaf; --color-utility-orange-300: #f7b27a; --color-utility-orange-700: #b93815; --spacing-none: 0px; --spacing-xxs: 2px; --spacing-xs: 4px; --spacing-sm: 6px; --spacing-md: 8px; --spacing-lg: 12px; --spacing-xl: 16px; --spacing-2xl: 20px; --spacing-3xl: 24px; --spacing-4xl: 32px; --spacing-5xl: 40px; --spacing-6xl: 48px; --spacing-7xl: 64px; --spacing-8xl: 80px; --spacing-9xl: 96px; --spacing-10xl: 128px; --spacing-11xl: 160px; --container-xxs: 320px; --container-layout-padding-mobile: 16px; --container-layout-padding-desktop: 32px; --container-layout-max-width-desktop: 1280px; --container-layout-paragraph-max-width: 720px; --radius-none: 0px; --radius-xxs: 2px; --radius-full: 9999px; --shadow-3xl: 0 32px 64px -12px #10182824; --shadow-focus-brand: 0 0 0 4px #1040f23d; --shadow-focus-gray: 0 0 0 4px #98a2b324; --shadow-focus-gray-secondary: 0 0 0 4px #98a2b333; --shadow-focus-error: 0 0 0 4px #f044383d; --shadow-focus-brand-shadow-xs: 0 0 0 4px #1040f23d, 0 1px 2px 0 #1018280d; --shadow-focus-brand-shadow-sm: 0 0 0 4px #1040f23d, 0 1px 2px 0 #1018280f, 0 1px 3px 0 #1018281a; --shadow-focus-gray-shadow-xs: 0 0 0 4px #98a2b324, 0 1px 2px 0 #1018280d; --shadow-focus-gray-shadow-sm: 0 0 0 4px #98a2b324, 0 1px 2px 0 #1018280f, 0 1px 3px 0 #1018281a; --shadow-focus-error-shadow-xs: 0 0 0 4px #f044383d, 0 1px 2px 0 #1018280d; --opacity-disabled: .5; --z-index-picture-in-picture: 40; --z-index-modal-overlay: 50; --font-weight-regular: 450; --text-display-2xl: 4.5rem; --text-display-2xl--line-height: 5.625rem; --text-display-2xl--letter-spacing: -.02em; --text-display-xl: 3.75rem; --text-display-xl--line-height: 4.5rem; --text-display-xl--letter-spacing: -.02em; --text-display-lg: 3rem; --text-display-lg--line-height: 3.75rem; --text-display-lg--letter-spacing: -.02em; --text-display-md: 2.25rem; --text-display-md--line-height: 2.75rem; --text-display-md--letter-spacing: -.02em; --text-display-sm: 1.875rem; --text-display-sm--line-height: 2.375rem; --text-display-sm--letter-spacing: 0em; --text-display-xs: 1.5rem; --text-display-xs--line-height: 2rem; --text-display-xs--letter-spacing: -.02em; --text-xl--letter-spacing: -.01em; --text-lg--letter-spacing: -.01em; --text-md: .9375rem; --text-md--line-height: 1.5rem; --text-md--letter-spacing: 0em; --text-sm--letter-spacing: 0em; --text-xs--letter-spacing: 0em; --text-micro: .6875rem; --text-micro--line-height: 1rem; --text-micro--letter-spacing: 0em; --text-mini: .75rem; --text-mini--line-height: 1.125rem; --text-mini--letter-spacing: 0em; --text-small: .8125rem; --text-small--line-height: 1.25rem; --text-small--letter-spacing: 0em; --text-regular: .9375rem; --text-regular--line-height: 1.5rem; --text-regular--letter-spacing: 0em; --text-large: 1.125rem; --text-large--line-height: 1.75rem; --text-large--letter-spacing: -.01em; --text-title-3: 1.25rem; --text-title-3--line-height: 1.875rem; --text-title-3--letter-spacing: -.01em; --text-title-2: 1.5rem; --text-title-2--line-height: 2rem; --text-title-2--letter-spacing: -.02em; --text-title-1: 2.25rem; --text-title-1--line-height: 2.75rem; --text-title-1--letter-spacing: -.02em; }
}
@layer base{*, ::after, ::before, ::backdrop { box-sizing: border-box; border: 0px solid; margin: 0px; padding: 0px; }
::file-selector-button { box-sizing: border-box; border: 0px solid; margin: 0px; padding: 0px; }
html, :host { text-size-adjust: 100%; tab-size: 4; line-height: 1.5; font-family: var(--default-font-family,ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"); font-feature-settings: var(--default-font-feature-settings,normal); font-variation-settings: var(--default-font-variation-settings,normal); -webkit-tap-highlight-color: transparent; }
h1, h2, h3, h4, h5, h6 { font-size: inherit; font-weight: inherit; }
code, kbd, samp, pre { font-family: var(--default-mono-font-family,ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace); font-feature-settings: var(--default-mono-font-feature-settings,normal); font-variation-settings: var(--default-mono-font-variation-settings,normal); font-size: 1em; }
ol, ul, menu { list-style: none; }
img, svg, video, canvas, audio, iframe, embed, object { vertical-align: middle; display: block; }
button, input, select, optgroup, textarea { font: inherit; letter-spacing: inherit; color: inherit; opacity: 1; background-color: rgba(0, 0, 0, 0); border-radius: 0px; }
::file-selector-button { font: inherit; letter-spacing: inherit; color: inherit; opacity: 1; background-color: rgba(0, 0, 0, 0); border-radius: 0px; }
::file-selector-button { margin-inline-end: 4px; }
::placeholder { opacity: 1; }
@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder { color: currentcolor; }
@supports (color:color-mix(in lab, red, red)){::placeholder { color: color-mix(currentcolor, transparent); }
}
}
::-webkit-search-decoration { appearance: none; }
::-webkit-date-and-time-value { min-height: 1lh; text-align: inherit; }
::-webkit-datetime-edit { display: inline-flex; }
::-webkit-datetime-edit-fields-wrapper { padding: 0px; }
::-webkit-datetime-edit { padding-block: 0px; }
::-webkit-datetime-edit-year-field { padding-block: 0px; }
::-webkit-datetime-edit-month-field { padding-block: 0px; }
::-webkit-datetime-edit-day-field { padding-block: 0px; }
::-webkit-datetime-edit-hour-field { padding-block: 0px; }
::-webkit-datetime-edit-minute-field { padding-block: 0px; }
::-webkit-datetime-edit-second-field { padding-block: 0px; }
::-webkit-datetime-edit-millisecond-field { padding-block: 0px; }
::-webkit-datetime-edit-meridiem-field { padding-block: 0px; }
::-webkit-calendar-picker-indicator { line-height: 1; }
button, input:where([type="button"], [type="reset"], [type="submit"]) { appearance: button; }
::file-selector-button { appearance: button; }
::-webkit-inner-spin-button { height: auto; }
::-webkit-outer-spin-button { height: auto; }
:root { color: var(--color-text-primary); background: var(--color-bg-primary); font-family: var(--font-sans); font-weight: var(--font-weight-regular); font-synthesis: none; text-rendering: optimizelegibility; -webkit-font-smoothing: antialiased; }
* { box-sizing: border-box; }
.comma-icon-slot, [data-comma-icon] { --spacing: 4px; }
[data-comma-icon] { transform-origin: 50% center; font-size: 16px; scale: 1 !important; }
[data-comma-icon] :where([stroke-width="2"]) { stroke-width: var(--comma-icon-stroke-width,2); }
body { min-width: 320px; min-height: 100vh; margin: 0px; }
button, input, textarea, select { font: inherit; }
}
@layer components{.chat-panel-image-group-cards:has(:focus-visible) .chat-panel-image-group-advance { opacity: 1; pointer-events: auto; scale: 1; transition: none !important; }
:root { --button-state-duration: var(--motion-duration-state-change); --button-state-easing: var(--motion-easing-smooth-out); --button-press-in-duration: var(--motion-duration-feedback-in); --button-press-out-duration: var(--motion-duration-feedback-out); --button-press-easing: var(--motion-easing-smooth-out); --button-press-scale: var(--motion-scale-pressed); --icon-swap-dur: var(--motion-duration-icon-swap); --icon-swap-blur: var(--spacing-xxs); --icon-swap-start-scale: var(--motion-scale-action-pressed); --icon-swap-ease: var(--motion-easing-icon-swap); --collapse-container-duration: .18s; --collapse-container-bezier-x1: .006; --collapse-container-bezier-y1: .522; --collapse-container-bezier-x2: .252; --collapse-container-bezier-y2: .968; --collapse-content-duration: .2s; --collapse-content-bezier-x1: .004; --collapse-content-bezier-y1: .505; --collapse-content-bezier-x2: .202; --collapse-content-bezier-y2: .918; --collapse-content-opacity-hidden: 0; --collapse-content-scale-hidden: .98; --collapse-content-translate-x-hidden: 0px; --collapse-content-translate-y-hidden: -10px; --task-list-item-icon-duration: .22s; --task-list-item-icon-blur: 5px; --task-list-item-icon-travel: 14px; --task-list-item-icon-easing: cubic-bezier(.16, 1, .3, 1); --task-list-item-dot-duration: .18s; --task-list-item-dot-width: 16px; --task-list-item-dot-easing: cubic-bezier(.16, 1, .3, 1); --scroll-area-scrollbar-size: 8px; --scroll-area-scrollbar-inset: 2px; --scroll-area-v-thumb-size: 0px; --scroll-area-v-thumb-offset: 0px; --scroll-area-h-thumb-size: 0px; --scroll-area-h-thumb-offset: 0px; --scroll-area-edge-mask-start: 0px; --scroll-area-edge-mask-end: 0px; --scroll-area-edge-blur-start-size: 0px; --scroll-area-edge-blur-end-size: 0px; --scroll-area-edge-blur-target-start-size: 0px; --scroll-area-edge-blur-target-end-size: 0px; --scroll-area-edge-transition-duration: .45s; --scroll-area-edge-transition-easing: cubic-bezier(.16, 1, .3, 1); }
.comma-scroll-area { isolation: isolate; position: relative; overflow: hidden; }
.comma-plugin-list-item:has(:focus-visible) { background-color: var(--color-plugin-row-bg-hover); }
.comma-scroll-area__viewport { scrollbar-width: none; overscroll-behavior: contain; width: 100%; height: 100%; }
.comma-scroll-area__viewport[data-edge-transition="true"] { transition: --scroll-area-edge-mask-start var(--scroll-area-edge-transition-duration) var(--scroll-area-edge-transition-easing), --scroll-area-edge-mask-end var(--scroll-area-edge-transition-duration) var(--scroll-area-edge-transition-easing); }
.comma-scroll-area__viewport::-webkit-scrollbar { width: 0px; height: 0px; display: none; }
.comma-scroll-area__content .comma-scroll-area__viewport { overscroll-behavior: auto; }
.comma-scroll-area[data-orientation="vertical"] > .comma-scroll-area__viewport { overflow: hidden auto; }
.comma-scroll-area[data-orientation="horizontal"] > .comma-scroll-area__viewport { overflow: auto hidden; }
.comma-scroll-area[data-orientation="horizontal"] .comma-scroll-area__content, .comma-scroll-area[data-orientation="both"] .comma-scroll-area__content { min-width: max-content; }
.comma-scroll-area[data-edge-axis="vertical"] { --scroll-area-edge-mask-direction: to bottom; }
.comma-scroll-area[data-edge-axis="horizontal"] { --scroll-area-edge-mask-direction: to right; }
.comma-scroll-area[data-edge-mask="true"]:not([data-window-resizing="true"]) > .comma-scroll-area__viewport { --scroll-area-edge-mask-image: linear-gradient(var(--scroll-area-edge-mask-direction), #0000 0, #00000002 calc(var(--scroll-area-edge-mask-start) * .125), #00000010 calc(var(--scroll-area-edge-mask-start) * .25), #00000036 calc(var(--scroll-area-edge-mask-start) * .375), #00000080 calc(var(--scroll-area-edge-mask-start) * .5), #000000c9 calc(var(--scroll-area-edge-mask-start) * .625), #000000ef calc(var(--scroll-area-edge-mask-start) * .75), #000000fd calc(var(--scroll-area-edge-mask-start) * .875), black var(--scroll-area-edge-mask-start), black calc(100% - var(--scroll-area-edge-mask-end)), #000000fd calc(100% - var(--scroll-area-edge-mask-end) * .875), #000000ef calc(100% - var(--scroll-area-edge-mask-end) * .75), #000000c9 calc(100% - var(--scroll-area-edge-mask-end) * .625), #00000080 calc(100% - var(--scroll-area-edge-mask-end) * .5), #00000036 calc(100% - var(--scroll-area-edge-mask-end) * .375), #00000010 calc(100% - var(--scroll-area-edge-mask-end) * .25), #00000002 calc(100% - var(--scroll-area-edge-mask-end) * .125), #0000 100%); mask-image: var(--scroll-area-edge-mask-image); }
.comma-scroll-area__scrollbar { z-index: 3; opacity: 0; pointer-events: none; contain: strict; border-radius: 999px; transition: opacity 0.14s; display: none; position: absolute; }
.comma-scroll-area[data-has-overflow-y="true"] > .comma-scroll-area__scrollbar--vertical, .comma-scroll-area[data-has-overflow-x="true"] > .comma-scroll-area__scrollbar--horizontal { display: block; }
.comma-scroll-area[data-scrollbar-visibility="scrollbar-hover"] > .comma-scroll-area__scrollbar, .comma-scroll-area[data-scrollbar-visibility="scroll"][data-scrollbar-hover-reveal="true"] > .comma-scroll-area__scrollbar { pointer-events: auto; }
.comma-scroll-area[data-scrollbar-visibility="always"] > .comma-scroll-area__scrollbar, .comma-scroll-area[data-scrollbar-visibility="hover"]:hover > .comma-scroll-area__scrollbar, .comma-scroll-area[data-scrollbar-visibility="hover"]:focus-within > .comma-scroll-area__scrollbar, .comma-scroll-area__scrollbar[data-scrolling="true"], .comma-scroll-area[data-scrollbar-visibility="scroll"][data-scrollbar-hover-reveal="true"] > .comma-scroll-area__scrollbar:hover, .comma-scroll-area[data-scrollbar-visibility="scrollbar-hover"] > .comma-scroll-area__scrollbar:hover, .comma-scroll-area[data-dragging="true"] > .comma-scroll-area__scrollbar { opacity: 1; pointer-events: auto; }
.comma-scroll-area__scrollbar--vertical { top: var(--scroll-area-scrollbar-inset); right: var(--scroll-area-scrollbar-inset); bottom: var(--scroll-area-scrollbar-inset); width: var(--scroll-area-scrollbar-size); }
.comma-scroll-area__scrollbar--horizontal { right: var(--scroll-area-scrollbar-inset); bottom: var(--scroll-area-scrollbar-inset); left: var(--scroll-area-scrollbar-inset); height: var(--scroll-area-scrollbar-size); }
.comma-scroll-area__thumb { border-radius: inherit; background: var(--color-scrollbar-bg); position: absolute; }
.comma-scroll-area__thumb--vertical { width: var(--scroll-area-scrollbar-size); height: var(--scroll-area-v-thumb-size); transform: translate3d(0, var(--scroll-area-v-thumb-offset), 0); right: 0px; }
.comma-scroll-area__thumb--horizontal { width: var(--scroll-area-h-thumb-size); height: var(--scroll-area-scrollbar-size); transform: translate3d(var(--scroll-area-h-thumb-offset), 0, 0); bottom: 0px; }
.comma-scroll-area__edge-blur { z-index: 2; pointer-events: none; contain: strict; position: absolute; overflow: hidden; }
.comma-scroll-area__edge-blur[data-edge-transition="true"] { transition: height var(--scroll-area-edge-transition-duration) var(--scroll-area-edge-transition-easing), width var(--scroll-area-edge-transition-duration) var(--scroll-area-edge-transition-easing); }
.comma-scroll-area__edge-blur[data-axis="vertical"][data-edge="start"] { height: var(--scroll-area-edge-blur-start-size); top: 0px; left: 0px; right: 0px; }
.comma-scroll-area__edge-blur[data-axis="vertical"][data-edge="end"] { height: var(--scroll-area-edge-blur-end-size); bottom: 0px; left: 0px; right: 0px; }
.comma-scroll-area__edge-blur[data-axis="horizontal"][data-edge="start"] { width: var(--scroll-area-edge-blur-start-size); top: 0px; bottom: 0px; left: 0px; }
.comma-scroll-area__edge-blur[data-axis="horizontal"][data-edge="end"] { width: var(--scroll-area-edge-blur-end-size); top: 0px; bottom: 0px; right: 0px; }
.comma-scroll-area__edge-blur-layer { --scroll-area-edge-blur-layer-radius: 0px; position: absolute; inset: 0px; }
.comma-scroll-area__edge-blur[data-edge-transition="true"] > .comma-scroll-area__edge-blur-layer { transition: --scroll-area-edge-blur-layer-radius var(--scroll-area-edge-transition-duration) var(--scroll-area-edge-transition-easing); }
.markdown-stream { --ms-font-mono: var(--font-mono); font-size: var(--text-sm); line-height: calc(var(--text-sm) + var(--spacing-md)); letter-spacing: var(--text-sm--letter-spacing); font-optical-sizing: auto; font-synthesis: none; font-feature-settings: "calt", "kern"; font-variant-ligatures: common-ligatures contextual; overflow-wrap: anywhere; -webkit-font-smoothing: antialiased; }
.markdown-stream > .markdown-renderer { min-width: 0px; position: relative; }
.markdown-stream .node-slot, .markdown-stream .node-content { width: 100%; min-width: 0px; }
.markdown-stream > .markdown-renderer > .node-slot + .node-slot, .markdown-stream > .markdown-renderer + .markdown-renderer > .node-slot:first-child { margin-top: var(--spacing-lg); }
.markdown-stream :is(.markdown-stream-copy, .markdown-stream-heading) { margin: 0px; }
.markdown-stream :where(p, li, dd, h1, h2, h3, h4, h5, h6) { text-wrap: wrap; }
.markdown-stream ::selection { background: color-mix(in srgb, oklch(from #1a1b1e calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)) 24%, oklch(from #f5f5f5 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h))); }
@supports (color:color-mix(in lab, red, red)){.markdown-stream ::selection { background: color-mix(in srgb, var(--color-markdown-text-primary) 24%, var(--color-markdown-bg-table)); }
}
.markdown-stream ::selection { color: var(--color-markdown-text-primary); }
.markdown-stream .markdown-stream-surface { border-radius: var(--radius-xl); }
.markdown-stream :where(table, code, pre) { font-variant-numeric: tabular-nums slashed-zero; }
.markdown-stream :where(code, pre) { font-variant-ligatures: none; }
.markdown-stream .math-block-node, .markdown-stream .code-block-content .shiki { max-height: none; overflow: visible; }
.markdown-stream .markdown-stream-code-block { border-radius: var(--radius-lg); background: var(--color-markdown-bg-table); border: 0px; position: relative; }
@media (hover: hover) and (pointer: fine){.markdown-stream .markdown-stream-control:not(.markdown-stream-control-active):hover { background: var(--color-markdown-bg-inline-code) !important; color: var(--color-markdown-text-primary) !important; }
}
.t-icon-swap { display: inline-grid; position: relative; }
.t-icon-swap .t-icon { transition: opacity var(--icon-swap-dur) var(--icon-swap-ease), filter var(--icon-swap-dur) var(--icon-swap-ease), transform var(--icon-swap-dur) var(--icon-swap-ease); will-change: opacity, filter, transform; grid-area: 1 / 1; }
.t-icon-swap[data-state="a"] .t-icon[data-icon="a"], .t-icon-swap[data-state="b"] .t-icon[data-icon="b"] { opacity: 1; filter: blur(); transform: scale(1); }
.t-icon-swap[data-state="a"] .t-icon[data-icon="b"], .t-icon-swap[data-state="b"] .t-icon[data-icon="a"] { opacity: 0; filter: blur(var(--icon-swap-blur)); transform: scale(var(--icon-swap-start-scale)); }
.t-icon-swap[data-swap-blur="none"] { --icon-swap-blur: 0px; }
.t-icon-swap[data-swap-blur="none"] .t-icon { filter: none; transition: opacity var(--icon-swap-dur) var(--icon-swap-ease), transform var(--icon-swap-dur) var(--icon-swap-ease); will-change: opacity, transform; }
.t-icon-swap[data-swap-blur="none"][data-state="a"] .t-icon[data-icon="a"], .t-icon-swap[data-swap-blur="none"][data-state="b"] .t-icon[data-icon="b"], .t-icon-swap[data-swap-blur="none"][data-state="a"] .t-icon[data-icon="b"], .t-icon-swap[data-swap-blur="none"][data-state="b"] .t-icon[data-icon="a"] { filter: none; }
.markdown-stream .markdown-stream-code-body pre, .markdown-stream .markdown-stream-code-body .shiki, .markdown-stream .markdown-stream-code-body .shiki-fallback, .markdown-stream .markdown-stream-code-source { border-radius: 0px; margin: 0px; padding: var(--spacing-md) var(--spacing-lg) !important; font-size: calc(var(--text-xs) + 1px) !important; line-height: var(--text-sm--line-height) !important; background: 0px 0px !important; }
@media (prefers-reduced-motion: reduce){.t-icon-swap .t-icon { transition: none !important; }
}
}
@layer utilities{.pointer-events-auto { pointer-events: auto; }
.absolute { position: absolute; }
.relative { position: relative; }
.inset-x-0 { inset-inline: 0px; }
.bottom-0 { bottom: 0px; }
.m-0 { margin: 0px; }
.mb-lg { margin-bottom: var(--spacing-lg); }
.box-border { box-sizing: border-box; }
.line-clamp-2 { -webkit-line-clamp: 2; -webkit-box-orient: vertical; display: -webkit-box; overflow: hidden; }
.contents { display: contents; }
.flex { display: flex; }
.grid { display: grid; }
.inline-flex { display: inline-flex; }
.size-2xl { width: var(--spacing-2xl); height: var(--spacing-2xl); }
.size-3xl { width: var(--spacing-3xl); height: var(--spacing-3xl); }
.size-4 { width: calc(var(--spacing) * 4); height: calc(var(--spacing) * 4); }
.size-5 { width: calc(var(--spacing) * 5); height: calc(var(--spacing) * 5); }
.size-7 { width: calc(var(--spacing) * 7); height: calc(var(--spacing) * 7); }
.size-\[18px\] { width: 18px; height: 18px; }
.size-\[30px\] { width: 30px; height: 30px; }
.h-8 { height: calc(var(--spacing) * 8); }
.h-\[36px\] { height: 36px; }
.h-full { height: 100%; }
.min-h-0 { min-height: 0px; }
.min-h-5xl { min-height: var(--spacing-5xl); }
.min-h-7 { min-height: calc(var(--spacing) * 7); }
.min-h-\[36px\] { min-height: 36px; }
.min-h-full { min-height: 100%; }
.w-full { width: 100%; }
.max-w-\[744px\] { max-width: 744px; }
.max-w-\[var\(--comma-window-bar-search-max-width\)\] { max-width: var(--comma-window-bar-search-max-width); }
.max-w-full { max-width: 100%; }
.min-w-0 { min-width: 0px; }
.flex-1 { flex: 1 1 0%; }
.shrink-0 { flex-shrink: 0; }
.cursor-pointer { cursor: pointer; }
.list-none { list-style-type: none; }
.flex-col { flex-direction: column; }
.flex-wrap { flex-wrap: wrap; }
.items-center { align-items: center; }
.items-start { align-items: flex-start; }
.justify-between { justify-content: space-between; }
.justify-center { justify-content: center; }
.justify-end { justify-content: flex-end; }
.gap-0 { gap: 0px; }
.gap-lg { gap: var(--spacing-lg); }
.gap-md { gap: var(--spacing-md); }
.gap-xl { gap: var(--spacing-xl); }
.gap-xs { gap: var(--spacing-xs); }
.gap-xxs { gap: var(--spacing-xxs); }
.truncate { text-overflow: ellipsis; white-space: nowrap; overflow: hidden; }
.overflow-clip { overflow: clip; }
.overflow-hidden { overflow: hidden; }
.overflow-y-auto { overflow-y: auto; }
.rounded-\[19px\] { border-radius: 19px; }
.rounded-full { border-radius: var(--radius-full); }
.rounded-sm { border-radius: var(--radius-sm); }
.rounded-xl { border-radius: var(--radius-xl); }
.border { border-style: var(--tw-border-style); border-width: 1px; }
.border-0 { border-style: var(--tw-border-style); border-width: 0px; }
.border-\[0\.5px\] { border-style: var(--tw-border-style); border-width: 0.5px; }
.border-primary { border-color: var(--color-border-primary); }
.border-transparent { border-color: rgba(0, 0, 0, 0); }
.bg-ai-input-panel-bg-disabled { background-color: var(--color-ai-input-panel-bg-disabled); }
.bg-ai-input-panel-bg-input { background-color: var(--color-ai-input-panel-bg-input); }
.bg-main-panel-bg { background-color: var(--color-main-panel-bg); }
.bg-markdown-bg-table { background-color: var(--color-markdown-bg-table); }
.bg-quaternary { background-color: var(--color-bg-quaternary); }
.bg-todo-kanban-bg-card-primary { background-color: var(--color-todo-kanban-bg-card-primary); }
.bg-transparent { background-color: rgba(0, 0, 0, 0); }
.bg-window { background-color: var(--color-bg-window); }
.p-0 { padding: 0px; }
.p-2 { padding: calc(var(--spacing) * 2); }
.p-sm { padding: var(--spacing-sm); }
.p-xs { padding: var(--spacing-xs); }
.px-2\.5 { padding-inline: calc(var(--spacing) * 2.5); }
.px-lg { padding-inline: var(--spacing-lg); }
.px-md { padding-inline: var(--spacing-md); }
.px-xs { padding-inline: var(--spacing-xs); }
.py-\[calc\(\(36px-1lh\)\/2\)\] { padding-block: calc(-0.5lh + 18px); }
.py-md { padding-block: var(--spacing-md); }
.py-xs { padding-block: var(--spacing-xs); }
.py-xxs { padding-block: var(--spacing-xxs); }
.pt-0 { padding-top: 0px; }
.pt-lg { padding-top: var(--spacing-lg); }
.pt-sm { padding-top: var(--spacing-sm); }
.pt-xxs { padding-top: var(--spacing-xxs); }
.pr-\[calc\(60px\+var\(--spacing-md\)\+var\(--spacing-xs\)\)\] { padding-right: calc(60px + var(--spacing-md) + var(--spacing-xs)); }
.pr-lg { padding-right: var(--spacing-lg); }
.pb-0 { padding-bottom: 0px; }
.pb-xs { padding-bottom: var(--spacing-xs); }
.pl-7 { padding-left: calc(var(--spacing) * 7); }
.pl-sm { padding-left: var(--spacing-sm); }
.text-left { text-align: left; }
.font-mono { font-family: var(--font-mono); }
.text-sm { font-size: var(--text-sm); line-height: var(--tw-leading,var(--text-sm--line-height)); letter-spacing: var(--tw-tracking,var(--text-sm--letter-spacing)); }
.text-xs { font-size: var(--text-xs); line-height: var(--tw-leading,var(--text-xs--line-height)); letter-spacing: var(--tw-tracking,var(--text-xs--letter-spacing)); }
.leading-5 { --tw-leading: calc(var(--spacing) * 5); line-height: calc(var(--spacing) * 5); }
.leading-none { --tw-leading: var(--spacing-none); line-height: var(--spacing-none); }
.font-medium { --tw-font-weight: var(--font-weight-medium); font-weight: var(--font-weight-medium); }
.font-normal { --tw-font-weight: var(--font-weight-normal); font-weight: var(--font-weight-normal); }
.tracking-\[-0\.14px\] { --tw-tracking: -.14px; letter-spacing: -0.14px; }
.\[overflow-wrap\:anywhere\] { overflow-wrap: anywhere; }
.break-words { overflow-wrap: break-word; }
.\[word-break\:break-word\] { word-break: break-word; }
.whitespace-nowrap { white-space: nowrap; }
.whitespace-pre-wrap { white-space: pre-wrap; }
.text-ai-input-panel-icon-disabled { color: var(--color-ai-input-panel-icon-disabled); }
.text-ai-input-panel-icon-primary { color: var(--color-ai-input-panel-icon-primary); }
.text-ai-input-panel-text-primary { color: var(--color-ai-input-panel-text-primary); }
.text-fg-success-primary { color: var(--color-fg-success-primary); }
.text-markdown-text-primary { color: var(--color-markdown-text-primary); }
.text-markdown-text-tool-primary { color: var(--color-markdown-text-tool-primary); }
.text-placeholder { color: var(--color-text-placeholder); }
.text-primary { color: var(--color-text-primary); }
.text-quaternary { color: var(--color-text-quaternary); }
.text-secondary { color: var(--color-text-secondary); }
.text-sidebar-icon-primary { color: var(--color-sidebar-icon-primary); }
.text-sidebar-icon-secondary { color: var(--color-sidebar-icon-secondary); }
.text-yellow-500 { color: var(--color-yellow-500); }
.shadow-xs { --tw-shadow: 0 1px 2px 0 var(--tw-shadow-color,#1018280d); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); }
.inset-shadow-\[0_0_0_var\(--border-width-0-5\)_var\(--color-border-primary\)\] { --tw-inset-shadow: inset 0 0 0 var(--border-width-0-5) var(--color-border-primary); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); }
.transition-\[box-shadow\,background-color\] { transition-property: box-shadow, background-color; transition-timing-function: var(--tw-ease,var(--default-transition-timing-function)); transition-duration: var(--tw-duration,var(--default-transition-duration)); }
.transition-\[opacity\] { transition-property: opacity; transition-timing-function: var(--tw-ease,var(--default-transition-timing-function)); transition-duration: var(--tw-duration,var(--default-transition-duration)); }
.transition-colors { transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to; transition-timing-function: var(--tw-ease,var(--default-transition-timing-function)); transition-duration: var(--tw-duration,var(--default-transition-duration)); }
.duration-\[50ms\] { --tw-duration: 50ms; transition-duration: 50ms; }
.duration-\[var\(--motion-duration-state-change\)\] { --tw-duration: var(--motion-duration-state-change); transition-duration: var(--motion-duration-state-change); }
.ease-\[var\(--motion-easing-smooth-out\)\] { --tw-ease: var(--motion-easing-smooth-out); transition-timing-function: var(--motion-easing-smooth-out); }
.outline-none { --tw-outline-style: none; outline-style: none; }
.\[--comma-button-hover-bg\:var\(--color-button-tertiary-bg-hover\)\] { --comma-button-hover-bg: var(--color-button-tertiary-bg-hover); }
.\[--comma-button-hover-fg\:var\(--color-button-tertiary-fg-hover\)\] { --comma-button-hover-fg: var(--color-button-tertiary-fg-hover); }
.duration-\[50ms\] { animation-duration: 50ms; }
.duration-\[var\(--motion-duration-state-change\)\] { animation-duration: var(--motion-duration-state-change); }
.ease-\[var\(--motion-easing-smooth-out\)\] { animation-timing-function: var(--motion-easing-smooth-out); }
:where(.group\/task-card):active .group-active\/task-card\:bg-quaternary-hover { background-color: var(--color-bg-quaternary-hover); }
:where(.group\/task-card):active .group-active\/task-card\:after\:bg-utility-brand-50\/45::after { content: var(--tw-content); background-color: rgba(184, 221, 255, 0.45); }
@supports (color:color-mix(in lab, red, red)){:where(.group\/task-card):active .group-active\/task-card\:after\:bg-utility-brand-50\/45::after { background-color: color-mix(in oklab, var(--color-utility-brand-50) 45%, transparent); }
}
.empty\:before\:pointer-events-none:empty::before { content: var(--tw-content); pointer-events: none; }
.empty\:before\:text-ai-input-panel-text-placeholder:empty::before { content: var(--tw-content); color: var(--color-ai-input-panel-text-placeholder); }
.empty\:before\:content-\[attr\(data-placeholder\)\]:empty::before { --tw-content: attr(data-placeholder); content: var(--tw-content); }
@media (hover: hover){.hover\:bg-\[var\(--comma-button-hover-bg\)\]:hover { background-color: var(--comma-button-hover-bg); }
.hover\:bg-fg-senary:hover { background-color: var(--color-fg-senary); }
.hover\:bg-quaternary-hover:hover { background-color: var(--color-bg-quaternary-hover); }
.hover\:text-\[var\(--comma-button-hover-fg\)\]:hover { color: var(--comma-button-hover-fg); }
.hover\:after\:bg-utility-brand-50\/45:hover::after { content: var(--tw-content); background-color: rgba(184, 221, 255, 0.45); }
@supports (color:color-mix(in lab, red, red)){.hover\:after\:bg-utility-brand-50\/45:hover::after { background-color: color-mix(in oklab, var(--color-utility-brand-50) 45%, transparent); }
}
}
.focus\:outline-none:focus { --tw-outline-style: none; outline-style: none; }
.focus-visible\:shadow-focus-brand-shadow-xs:focus-visible { --tw-shadow: 0 0 0 4px var(--tw-shadow-color,#1040f23d), 0 1px 2px 0 var(--tw-shadow-color,#1018280d); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); }
.focus-visible\:shadow-focus-gray:focus-visible { --tw-shadow: 0 0 0 4px var(--tw-shadow-color,#98a2b324); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); }
.focus-visible\:shadow-focus-gray-shadow-xs:focus-visible { --tw-shadow: 0 0 0 4px var(--tw-shadow-color,#98a2b324), 0 1px 2px 0 var(--tw-shadow-color,#1018280d); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); }
.active\:bg-quaternary-hover:active { background-color: var(--color-bg-quaternary-hover); }
.active\:after\:bg-utility-brand-50\/45:active::after { content: var(--tw-content); background-color: rgba(184, 221, 255, 0.45); }
@supports (color:color-mix(in lab, red, red)){.active\:after\:bg-utility-brand-50\/45:active::after { background-color: color-mix(in oklab, var(--color-utility-brand-50) 45%, transparent); }
}
.disabled\:cursor-default:disabled { cursor: default; }
.disabled\:cursor-not-allowed:disabled { cursor: not-allowed; }
.disabled\:text-sidebar-icon-disabled:disabled { color: var(--color-sidebar-icon-disabled); }
.disabled\:opacity-80:disabled { opacity: 0.8; }
@media (prefers-reduced-motion: reduce){.motion-reduce\:active\:scale-100:active, .motion-reduce\:data-\[pressed\]\:scale-100[data-pressed] { --tw-scale-x: 100%; --tw-scale-y: 100%; --tw-scale-z: 100%; scale: var(--tw-scale-x) var(--tw-scale-y); }
}
@container not (width >= 384px){.\@max-xs\:focus\:inline-flex:focus { display: inline-flex; }
}
.\[\&_svg\]\:size-full svg { width: 100%; height: 100%; }
.\[\&\:\:-webkit-progress-bar\]\:rounded-full::-webkit-progress-bar { border-radius: var(--radius-full); }
.\[\&\:\:-webkit-progress-bar\]\:bg-tertiary::-webkit-progress-bar { background-color: var(--color-bg-tertiary); }
.\[\&\:\:-webkit-progress-value\]\:rounded-full::-webkit-progress-value { border-radius: var(--radius-full); }
.\[\&\:\:-webkit-progress-value\]\:bg-brand-solid::-webkit-progress-value { background-color: var(--color-bg-brand-solid); }
.\[\&\:\:-webkit-progress-value\]\:bg-quaternary::-webkit-progress-value { background-color: var(--color-bg-quaternary); }
.\[\&\:\:-webkit-progress-value\]\:transition-\[width\]::-webkit-progress-value { transition-property: width; transition-timing-function: var(--tw-ease,var(--default-transition-timing-function)); transition-duration: var(--tw-duration,var(--default-transition-duration)); }
.\[\&\:\:-webkit-progress-value\]\:duration-\[var\(--motion-duration-progress-fill\)\]::-webkit-progress-value { --tw-duration: var(--motion-duration-progress-fill); transition-duration: var(--motion-duration-progress-fill); }
.\[\&\:\:-webkit-progress-value\]\:ease-linear::-webkit-progress-value { --tw-ease: linear; transition-timing-function: linear; }
.\[\&\:\:-webkit-progress-value\]\:duration-\[var\(--motion-duration-progress-fill\)\]::-webkit-progress-value { animation-duration: var(--motion-duration-progress-fill); }
.\[\&\:\:-webkit-progress-value\]\:ease-linear::-webkit-progress-value { animation-timing-function: linear; }
@media (prefers-reduced-motion: reduce){.motion-reduce\:\[\&\:\:-webkit-progress-value\]\:transition-none::-webkit-progress-value { transition-property: none; }
}
}
:where(.markstream-react) button { appearance: none; font: inherit; color: inherit; background: 0px 0px; border: 0px; }
.markstream-react .relative { position: relative; }
.markstream-react .m-0 { margin: 0px; }
.markstream-react .flex { display: flex; }
.markstream-react .inline-flex { display: inline-flex; }
.markstream-react .items-center { align-items: center; }
.markstream-react .justify-center { justify-content: center; }
.markstream-react .justify-between { justify-content: space-between; }
.markstream-react .overflow-hidden { overflow: hidden; }
.markstream-react .truncate { text-overflow: ellipsis; white-space: nowrap; overflow: hidden; }
.markstream-react .whitespace-pre-wrap { white-space: pre-wrap; }
.markstream-react .break-words { overflow-wrap: break-word; }
.markstream-react .font-mono { font-family: var(--ms-font-mono); }
.markstream-react .text-sm { font-size: 0.875rem; line-height: 1.25rem; }
.markstream-react .font-medium { font-weight: 500; }
.markstream-react { --border: 214.3 31.8% 91.4%; --background: 0 0% 100%; --foreground: 222.2 84% 4.9%; --secondary: 210 40% 96%; --muted: 210 40% 96%; --muted-foreground: 215.4 16.3% 46.9%; }
.markdown-renderer { contain: layout; content-visibility: auto; contain-intrinsic-size: 800px 600px; position: relative; }
.node-slot, .node-content { width: 100%; }
.code-block-content { max-height: min(70vh, 500px); font-family: var(--vscode-editor-font-family,ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace); line-height: var(--vscode-editor-line-height,1.5); transition: max-height 0.3s; display: grid; overflow: auto; }
.code-block-render, .code-fallback-plain { grid-area: 1 / 1; min-width: 0px; }
.code-block-render { min-height: 1px; }
.code-block-render pre, .code-block-content .shiki { font-family: inherit; font-size: inherit; line-height: inherit; margin: 0px; }
body { counter-reset: katexEqnNo 0 mmlEqnNo 0; }
:root { --comma-icon-stroke-width: 1.5; --comma-theme-h: 255.499deg; --comma-theme-c: .00734617; --comma-theme-l: .5; --motion-duration-feedback-in: .12s; --motion-duration-state-change: .15s; --motion-duration-feedback-out: .18s; --motion-duration-press-travel: 50ms; --motion-duration-press-recoil: .15s; --motion-duration-tooltip-enter: .15s; --motion-duration-tooltip-exit: .125s; --motion-duration-tooltip-handoff: 80ms; --motion-duration-hover-card-enter: .19s; --motion-duration-hover-card-exit: .14s; --motion-duration-icon-swap: .25s; --motion-duration-dialog-enter: .25s; --motion-duration-dialog-exit: .2s; --motion-duration-image-filmstrip: .4s; --motion-duration-reveal-item: .1s; --motion-duration-reveal-stagger: 30ms; --motion-duration-spatial-move: .2s; --motion-duration-reply-draw: .6s; --motion-duration-menu-enter: .12s; --motion-duration-menu-exit: 80ms; --motion-duration-pointer-intent: .1s; --motion-duration-submenu-open-delay: 80ms; --motion-duration-submenu-close-delay: 80ms; --motion-duration-login-stage-enter: .75s; --motion-duration-login-stage-exit: .38s; --motion-duration-caret-blink: 1.1s; --motion-duration-loading-shine: 1.6s; --motion-duration-toast-enter: .25s; --motion-duration-toast-exit: .2s; --motion-duration-progress-fill: .9s; --motion-duration-panel-enter: .15s; --motion-duration-panel-exit: .1s; --motion-duration-state-swap-exit: .1s; --motion-duration-state-swap-enter: .15s; --motion-duration-disclosure-turn: .1s; --motion-duration-picture-in-picture-enter: .25s; --motion-duration-picture-in-picture-exit: .15s; --motion-easing-icon-swap: ease-in-out; --motion-easing-generated-media-swap: cubic-bezier(.77, 0, .175, 1); --motion-easing-spatial-move: cubic-bezier(.77, 0, .175, 1); --motion-easing-smooth-out: cubic-bezier(.16, 1, .3, 1); --motion-easing-surface-smooth-out: cubic-bezier(.22, 1, .36, 1); --motion-easing-drawer: cubic-bezier(.32, .72, 0, 1); --motion-easing-soft-in-out: cubic-bezier(.4, 0, .2, 1); --motion-easing-press-travel: cubic-bezier(.05, 0, .55, .85); --motion-easing-press-recoil: cubic-bezier(.25, .3, .25, 1.32); --motion-easing-sharp-in: cubic-bezier(.4, 0, 1, 1); --motion-scale-pressed: .98; --motion-scale-tactile-pressed: .96; --motion-scale-action-pressed: .94; --motion-scale-tooltip-enter: .97; --motion-scale-menu-enter: .98; --motion-scale-menu-exit: .99; --motion-scale-command-palette-exit: .96; --motion-scale-reveal-item: .97; --motion-scale-login-stage: .9; --motion-scale-login-code-active: 1.106; --motion-scale-login-code-press: .97; --motion-scale-picture-in-picture: .96; --motion-distance-menu-enter: 2px; --motion-distance-login-stage-shift: 8px; --motion-distance-reveal-item: 8px; --motion-distance-nav-press-shift: 2px; --motion-blur-menu-enter: 2px; --motion-blur-login-stage: 8px; --motion-rotate-refresh-press: 75deg; --motion-login-code-error-amplitude: 12px; }
:root, [data-theme="Light mode"] { --border-width-0-5: .5px; --border-width-default: 1px; --toast-width-single: 380px; --toast-width-action: 380px; --toast-width-actions-row: 348px; --toast-stack-gap: 14px; --toast-viewport-inset: 24px; --toast-close-icon-inset: 32.29%; --dialog-width-default: 444px; --dialog-width-wide: 960px; --dialog-width-preview: 560px; --dialog-close-icon-inset: 32.29%; --task-workspace-filter-menu-width: 200px; --meeting-recorder-width: 370px; --meeting-recorder-compact-width: 227px; --meeting-recorder-compact-height: 42px; --meeting-recorder-start-button-height: 26px; --meeting-recorder-viewport-inset-top: 56px; }
[data-theme="Light mode"] { --color-text-primary: oklch(from #1a1b1e calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-text-secondary: oklch(from #4a4c50 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-text-tertiary: oklch(from #5b5e63 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-text-quaternary: oklch(from #7f8286 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-text-white: #fff; --color-text-disabled: oklch(from #b6b8bb calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-text-placeholder: oklch(from #b6b8bb calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-text-claude: #d97757; --color-text-codex: #706ffc; --color-text-brand-primary: #02092b; --color-text-brand-secondary: #062389; --color-text-brand-tertiary: #092fc0; --color-text-error-primary: #d92d20; --color-text-warning-primary: #f79009; --color-text-success-primary: #079455; --color-border-primary: oklch(from #dfe0e2 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-border-menu-primary: oklch(from #b6b8bb calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-border-secondary: oklch(from #f1f1f1 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-border-tertiary: oklch(from #f5f5f5 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-border-disabled: oklch(from #dfe0e2 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-border-brand: #3b7cff; --color-border-brand-solid: #092fc0; --color-border-error: #fda29b; --color-border-error-solid: #d92d20; --color-fg-primary: oklch(from #1a1b1e calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-fg-secondary: oklch(from #4a4c50 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-fg-tertiary: oklch(from #5b5e63 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-fg-quaternary: oklch(from #7f8286 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-fg-quinary: oklch(from #b6b8bb calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-fg-quinary-hover: oklch(from #7f8286 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-fg-senary: oklch(from #dfe0e2 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-fg-button: #fff; --color-fg-button-active: oklch(from #dfe0e2 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-fg-button-secondary: #fff; --color-fg-white: #fff; --color-fg-disabled: oklch(from #b6b8bb calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-fg-brand-primary: #092fc0; --color-fg-error-primary: #d92d20; --color-fg-warning-primary: #dc6803; --color-fg-warning-secondary: #f79009; --color-fg-success-primary: #079455; --color-bg-primary: oklch(from #fff calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-bg-popup-primary: oklch(from #fff calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-bg-popup-secondary: oklch(from #fff calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-bg-secondary: oklch(from #fafafa calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-bg-secondary-hover: oklch(from #f5f5f5 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-bg-tertiary: oklch(from #f5f5f5 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-bg-quaternary: oklch(from #f1f1f1 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-bg-quaternary-hover: oklch(from #f1f1f1 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-bg-active: oklch(from #fafafa calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-bg-disabled: oklch(from #f5f5f5 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-bg-overlay: oklch(from #111213 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-bg-brand-primary: #b8ddff; --color-bg-brand-secondary: #8cbfff; --color-bg-brand-solid: #205bff; --color-bg-brand-solid-hover: #1040f2; --color-bg-error-primary: #fef3f2; --color-bg-error-solid: #d92d20; --color-bg-warning-primary: #fffaeb; --color-bg-warning-solid: #dc6803; --color-bg-success-primary: #ecfdf3; --color-bg-success-solid: #079455; --color-bg-toggle: oklch(from #dfe0e2 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-bg-toggle-hover: oklch(from #f1f1f1 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-bg-window: oklch(from #f5f5f5 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-bg-claude: #f1cdc1; --color-bg-codex: #cdccff; --color-bg-gpt: #e2e9ed; --color-toast-text-primary: oklch(from #222326 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-toast-text-secondary: oklch(from #7f8286 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-toast-icon-primary: oklch(from #5b5e63 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-button-primary-bg: #205bff; --color-button-primary-bg-hover: #1040f2; --color-button-primary-border: #1040f2; --color-button-primary-border-hover: #092fc0; --color-button-primary-fg: #fff; --color-button-primary-fg-hover: #fff; --color-button-secondary-bg: #fff; --color-button-secondary-border: oklch(from #dfe0e2 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-button-secondary-fg: oklch(from #222326 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-button-secondary-color-bg: #fff; --color-button-secondary-color-bg-hover: #b8ddff; --color-button-secondary-color-border: #3b7cff; --color-button-secondary-color-border-hover: #3b7cff; --color-button-secondary-color-fg: #1040f2; --color-button-secondary-color-fg-hover: #062389; --color-button-tertiary-fg: oklch(from #5b5e63 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-button-tertiary-fg-hover: oklch(from #4a4c50 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-button-tertiary-bg-hover: oklch(from #fafafa calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-button-tertiary-color-fg: #062389; --color-button-tertiary-color-fg-hover: #041756; --color-button-tertiary-color-bg-hover: #b8ddff; --color-button-primary-error-bg: #d92d20; --color-button-primary-error-bg-hover: #b42318; --color-button-primary-error-border: #d92d20; --color-button-primary-error-border-hover: #b42318; --color-button-primary-error-fg: #fff; --color-button-primary-error-fg-hover: #fff; --color-dialog-bg: #fff; --color-dialog-shortcut-on-primary-bg: #ffffff29; --color-dialog-shortcut-on-primary-text: #ffffffeb; --color-menu-hover-error: #fef3f2; --color-toggle-button-fg-disabled: oklch(from #fafafa calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-slider-handle-bg: #fff; --color-slider-handle-border: #092fc0; --color-avatar-bg: oklch(from #f5f5f5 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-avatar-profile-photo-border: #fff; --color-tooltip-bg: oklch(from #27282b calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-tooltip-border: oklch(from #343538 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-tooltip-text: oklch(from #f6f6f6 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-tooltip-supporting-text: oklch(from #d1d1d1 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-tooltip-shortcut-bg: oklch(from #54565a calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-tooltip-shortcut-text: oklch(from #d1d1d1 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-ai-input-header-icon-primary: oklch(from #5b5e63 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-ai-input-header-text-primary: #000; --color-ai-input-header-text-secondary: oklch(from #7f8286 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-ai-input-panel-icon-primary: oklch(from #7f8286 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-ai-input-panel-icon-disabled: oklch(from #dfe0e2 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-ai-input-panel-icon-fg: #fff; --color-ai-input-panel-icon-warning: #f79009; --color-ai-input-panel-text-primary: #000; --color-ai-input-panel-text-placeholder: oklch(from #b6b8bb calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-ai-input-panel-text-warning: #f79009; --color-ai-input-panel-bg-input: #fff; --color-ai-input-panel-bg-tag: #000; --color-ai-input-panel-text-attachment-primary: oklch(from #1a1b1e calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-ai-input-panel-text-attachment-secondary: oklch(from #7f8286 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-ai-input-panel-bg-disabled: oklch(from #f5f5f5 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-ai-input-panel-bg-attachment: #fff; --color-panel-bg-file: oklch(from #f1f1f1 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-markdown-text-primary: oklch(from #1a1b1e calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-markdown-text-secondary: oklch(from #7f8286 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-markdown-text-tool-primary: oklch(from #7f8286 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-markdown-audio-control-primary: oklch(from #5b5e63 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-markdown-text-inline-primary: oklch(from #1a1b1e calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-markdown-text-inline-code: #912018; --color-markdown-bg-inline-code: oklch(from #f1f1f1 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-markdown-text-link: #3b7cff; --color-markdown-bg-message: oklch(from #f1f1f1 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-markdown-bg-table: oklch(from #f5f5f5 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-markdown-border-table: oklch(from #dfe0e2 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-markdown-bg-tool: #fff; --color-markdown-icon-primary: oklch(from #7f8286 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-markdown-bg-icon-hover: oklch(from #f1f1f1 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-markdown-image-bg-primary: #ffffffb2; --color-markdown-image-hover: #0000001a; --color-markdown-image-icon-primary: oklch(from #4a4c50 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-markdown-image-bar-border: oklch(from #dfe0e2 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-markdown-sound-video-icon-primary: oklch(from #dfe0e2 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-markdown-sound-video-text-primary: oklch(from #dfe0e2 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-markdown-sound-video-bg-hover: #fff3; --color-markdown-sound-video-bg-player-bar: #000000b2; --color-markdown-sound-video-bg-progress: oklch(from #b6b8bb calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-markdown-sound-video-bg-tracker: oklch(from #fdfdfd calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-markdown-sound-video-bar-border: oklch(from #5b5e63 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-markdown-sound-video-bg-preview: #000; --color-main-panel-bg: oklch(from #fdfdfd calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-main-panel-item-bg: #fff; --color-plugin-bg-button: #fff; --color-plugin-border: #fff; --color-plugin-row-bg-hover: oklch(from #f1f1f1 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-todo-kanban-bg-card-primary: #fff; --color-todo-kanban-bg-column-primary: oklch(from #fafafa calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-todo-list-bg-needs-review-main: #f0ede6; --color-todo-list-bg-done: #e2ede8; --color-todo-list-bg-cancel: #f2eceb; --color-todo-list-bg-group-fade: oklch(from #fafafa calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-sidebar-text-primary: oklch(from #222326 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-sidebar-text-secondary: oklch(from #4a4c50 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-sidebar-text-tertiary: oklch(from #7f8286 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-sidebar-bg-selection: oklch(from #f5f5f5 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-sidebar-text-highlight: oklch(from #111213 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-sidebar-icon-primary: oklch(from #7f8286 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-sidebar-icon-secondary: oklch(from #7f8286 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-sidebar-icon-disabled: oklch(from #b6b8bb calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-sidebar-bg-item: oklch(from #dfe0e2 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-scrollbar-bg: oklch(from #dfe0e2 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-utility-gray-50: oklch(from #fafafa calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-utility-gray-200: oklch(from #f1f1f1 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-utility-gray-300: oklch(from #dfe0e2 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-utility-gray-700: oklch(from #4a4c50 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-utility-brand-50: #b8ddff; --color-utility-brand-100: #8cbfff; --color-utility-brand-200: #619eff; --color-utility-brand-300: #3b7cff; --color-utility-brand-400: #205bff; --color-utility-brand-700: #062389; --color-utility-error-50: #fef3f2; --color-utility-error-200: #fecdca; --color-utility-error-300: #fda29b; --color-utility-error-700: #b42318; --color-utility-warning-50: #fffaeb; --color-utility-warning-200: #fedf89; --color-utility-warning-300: #fec84b; --color-utility-warning-700: #b54708; --color-utility-success-50: #ecfdf3; --color-utility-success-200: #abefc6; --color-utility-success-300: #75e0a7; --color-utility-success-700: #067647; --color-utility-blue-50: #eff8ff; --color-utility-blue-200: #b2ddff; --color-utility-blue-300: #84caff; --color-utility-blue-700: #175cd3; --color-utility-indigo-50: #eef4ff; --color-utility-indigo-200: #c7d7fe; --color-utility-indigo-300: #a4bcfd; --color-utility-indigo-700: #3538cd; --color-utility-purple-50: #f4f3ff; --color-utility-purple-200: #d9d6fe; --color-utility-purple-300: #bdb4fe; --color-utility-purple-700: #5925dc; --color-utility-pink-50: #fdf2fa; --color-utility-pink-200: #fcceee; --color-utility-pink-300: #faa7e0; --color-utility-pink-700: #c11574; --color-utility-orange-50: #fef6ee; --color-utility-orange-200: #f9dbaf; --color-utility-orange-300: #f7b27a; --color-utility-orange-700: #b93815; --shadow-xs: 0 1px 2px 0 #1018280d; --shadow-sm: 0 1px 2px 0 #1018280f, 0 1px 3px 0 #1018281a; --shadow-md: 0 2px 4px -2px #1018280f, 0 4px 8px -2px #1018281a; --shadow-lg: 0 4px 6px -2px #10182808, 0 12px 16px -4px #10182814; --shadow-xl: 0 8px 8px -4px #10182808, 0 20px 24px -4px #10182814; --shadow-2xl: 0 24px 48px -12px #1018282e; --shadow-3xl: 0 32px 64px -12px #10182824; --shadow-focus-brand: 0 0 0 4px #1040f23d; --shadow-focus-gray: 0 0 0 4px #98a2b324; --shadow-focus-gray-secondary: 0 0 0 4px #98a2b333; --shadow-focus-error: 0 0 0 4px #f044383d; --shadow-focus-brand-shadow-xs: 0 0 0 4px #1040f23d, 0 1px 2px 0 #1018280d; --shadow-focus-brand-shadow-sm: 0 0 0 4px #1040f23d, 0 1px 2px 0 #1018280f, 0 1px 3px 0 #1018281a; --shadow-focus-gray-shadow-xs: 0 0 0 4px #98a2b324, 0 1px 2px 0 #1018280d; --shadow-focus-gray-shadow-sm: 0 0 0 4px #98a2b324, 0 1px 2px 0 #1018280f, 0 1px 3px 0 #1018281a; --shadow-focus-error-shadow-xs: 0 0 0 4px #f044383d, 0 1px 2px 0 #1018280d; }
.dark, [data-theme="Dark mode"] { --color-text-primary: oklch(from #f6f6f6 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-text-secondary: oklch(from #d1d1d1 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-text-tertiary: oklch(from #a4a5a9 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-text-quaternary: oklch(from #a4a5a9 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-text-white: #fff; --color-text-disabled: oklch(from #7e8187 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-text-placeholder: oklch(from #7e8187 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-text-claude: #d97757; --color-text-codex: #9594fc; --color-text-brand-primary: oklch(from #f6f6f6 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-text-brand-secondary: oklch(from #d1d1d1 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-text-brand-tertiary: oklch(from #a4a5a9 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-text-error-primary: #f97066; --color-text-warning-primary: #fdb022; --color-text-success-primary: #47cd89; --color-border-primary: oklch(from #343538 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-border-menu-primary: oklch(from #54565a calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-border-secondary: oklch(from #27282b calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-border-tertiary: oklch(from #27282b calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-border-disabled: oklch(from #343538 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-border-brand: #205bff; --color-border-brand-solid: #1040f2; --color-border-error: #f97066; --color-border-error-solid: #f04438; --color-fg-primary: #fff; --color-fg-secondary: oklch(from #d1d1d1 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-fg-tertiary: oklch(from #a4a5a9 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-fg-quaternary: oklch(from #a4a5a9 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-fg-quinary: oklch(from #7e8187 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-fg-quinary-hover: oklch(from #a4a5a9 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-fg-senary: oklch(from #54565a calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-fg-button: oklch(from #343538 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-fg-button-active: oklch(from #54565a calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-fg-button-secondary: oklch(from #27282b calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-fg-white: #fff; --color-fg-disabled: oklch(from #7e8187 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-fg-brand-primary: #1040f2; --color-fg-error-primary: #f04438; --color-fg-warning-primary: #f79009; --color-fg-warning-secondary: #fdb022; --color-fg-success-primary: #17b26a; --color-bg-primary: oklch(from #0f0f10 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-bg-popup-primary: oklch(from #18191b calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-bg-popup-secondary: oklch(from #27282b calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-bg-secondary: oklch(from #18191b calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-bg-secondary-hover: oklch(from #27282b calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-bg-tertiary: oklch(from #27282b calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-bg-quaternary: oklch(from #343538 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-bg-quaternary-hover: oklch(from #343538 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-bg-active: oklch(from #27282b calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-bg-disabled: oklch(from #27282b calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-bg-overlay: oklch(from #27282b calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-bg-brand-primary: #1040f2; --color-bg-brand-secondary: #3b7cff; --color-bg-brand-solid: #3b7cff; --color-bg-brand-solid-hover: #1040f2; --color-bg-error-primary: #f04438; --color-bg-error-solid: #d92d20; --color-bg-warning-primary: #f79009; --color-bg-warning-solid: #dc6803; --color-bg-success-primary: #17b26a; --color-bg-success-solid: #079455; --color-bg-toggle: oklch(from #7f8286 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-bg-toggle-hover: oklch(from #b6b8bb calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-bg-window: oklch(from #0f0f10 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-bg-claude: #6a2e1b; --color-bg-codex: #4746aa; --color-bg-gpt: #353a3d; --color-toast-text-primary: oklch(from #fafafa calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-toast-text-secondary: oklch(from #d1d1d1 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-toast-icon-primary: oklch(from #dfe0e2 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-button-primary-bg: #205bff; --color-button-primary-bg-hover: #1040f2; --color-button-primary-border: #1040f2; --color-button-primary-border-hover: #092fc0; --color-button-primary-fg: #fff; --color-button-primary-fg-hover: #fff; --color-button-secondary-bg: oklch(from #18191b calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-button-secondary-border: oklch(from #343538 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-button-secondary-fg: oklch(from #d1d1d1 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-button-secondary-color-bg: oklch(from #18191b calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-button-secondary-color-bg-hover: oklch(from #27282b calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-button-secondary-color-border: oklch(from #343538 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-button-secondary-color-border-hover: oklch(from #343538 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-button-secondary-color-fg: oklch(from #d1d1d1 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-button-secondary-color-fg-hover: oklch(from #f1f1f1 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-button-tertiary-fg: oklch(from #a4a5a9 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-button-tertiary-fg-hover: oklch(from #ededed calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-button-tertiary-bg-hover: oklch(from #27282b calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-button-tertiary-color-fg: oklch(from #d1d1d1 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-button-tertiary-color-fg-hover: oklch(from #f1f1f1 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-button-tertiary-color-bg-hover: oklch(from #27282b calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-button-primary-error-bg: #d92d20; --color-button-primary-error-bg-hover: #b42318; --color-button-primary-error-border: #d92d20; --color-button-primary-error-border-hover: #b42318; --color-button-primary-error-fg: #fff; --color-button-primary-error-fg-hover: #fff; --color-dialog-bg: oklch(from #1a1b1e calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-dialog-shortcut-on-primary-bg: #ffffff29; --color-dialog-shortcut-on-primary-text: #ffffffeb; --color-menu-hover-error: #55160c; --color-toggle-button-fg-disabled: oklch(from #54565a calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-slider-handle-bg: #1040f2; --color-slider-handle-border: oklch(from #0f0f10 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-avatar-bg: oklch(from #27282b calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-avatar-profile-photo-border: oklch(from #0f0f10 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-tooltip-bg: oklch(from #27282b calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-tooltip-border: oklch(from #343538 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-tooltip-text: oklch(from #f6f6f6 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-tooltip-supporting-text: oklch(from #d1d1d1 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-tooltip-shortcut-bg: oklch(from #54565a calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-tooltip-shortcut-text: oklch(from #d1d1d1 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-ai-input-header-icon-primary: oklch(from #b6b8bb calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-ai-input-header-text-primary: oklch(from #f5f5f5 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-ai-input-header-text-secondary: oklch(from #a4a5a9 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-ai-input-panel-icon-primary: oklch(from #b6b8bb calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-ai-input-panel-icon-disabled: oklch(from #4a4c50 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-ai-input-panel-icon-fg: #fff; --color-ai-input-panel-icon-warning: #f79009; --color-ai-input-panel-text-primary: oklch(from #f5f5f5 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-ai-input-panel-text-placeholder: oklch(from #7f8286 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-ai-input-panel-text-warning: #f79009; --color-ai-input-panel-bg-input: oklch(from #27282b calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-ai-input-panel-bg-tag: oklch(from #54565a calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-ai-input-panel-text-attachment-primary: oklch(from #f6f6f6 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-ai-input-panel-text-attachment-secondary: oklch(from #7e8187 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-ai-input-panel-bg-disabled: oklch(from #343538 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-ai-input-panel-bg-attachment: oklch(from #343538 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-panel-bg-file: oklch(from #343538 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-markdown-text-primary: oklch(from #f6f6f6 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-markdown-text-secondary: oklch(from #a4a5a9 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-markdown-text-tool-primary: oklch(from #7e8187 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-markdown-audio-control-primary: oklch(from #b6b8bb calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-markdown-text-inline-primary: oklch(from #dfe0e2 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-markdown-text-inline-code: #f97066; --color-markdown-bg-inline-code: oklch(from #222326 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-markdown-text-link: #619eff; --color-markdown-bg-message: oklch(from #343538 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-markdown-bg-table: oklch(from #343538 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-markdown-border-table: oklch(from #4a4c50 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-markdown-bg-tool: oklch(from #18191b calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-markdown-icon-primary: oklch(from #b6b8bb calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-markdown-bg-icon-hover: oklch(from #343538 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-markdown-image-bg-primary: #0c111db2; --color-markdown-image-hover: #ffffff1a; --color-markdown-image-icon-primary: oklch(from #dfe0e2 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-markdown-image-bar-border: oklch(from #343538 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-markdown-sound-video-icon-primary: oklch(from #dfe0e2 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-markdown-sound-video-text-primary: oklch(from #dfe0e2 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-markdown-sound-video-bg-hover: #fff3; --color-markdown-sound-video-bg-player-bar: #0c111db2; --color-markdown-sound-video-bg-progress: oklch(from #5b5e63 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-markdown-sound-video-bg-tracker: oklch(from #fafafa calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-markdown-sound-video-bar-border: oklch(from #54565a calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-markdown-sound-video-bg-preview: #000; --color-main-panel-bg: oklch(from #18191b calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-main-panel-item-bg: oklch(from #27282b calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-plugin-bg-button: oklch(from #54565a calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-plugin-border: oklch(from #27282b calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-plugin-row-bg-hover: oklch(from #343538 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-todo-kanban-bg-card-primary: oklch(from #18191b calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-todo-kanban-bg-column-primary: oklch(from #0f0f10 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-todo-list-bg-needs-review-main: #3b3423; --color-todo-list-bg-done: #233e31; --color-todo-list-bg-cancel: #4c2f2d; --color-todo-list-bg-group-fade: oklch(from #27282b calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-sidebar-text-primary: oklch(from #b6b8bb calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-sidebar-text-secondary: oklch(from #d1d1d1 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-sidebar-text-tertiary: oklch(from #7f8286 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-sidebar-bg-selection: #494c50; --color-sidebar-text-highlight: #fff; --color-sidebar-icon-primary: oklch(from #b6b8bb calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-sidebar-icon-secondary: oklch(from #b6b8bb calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-sidebar-icon-disabled: #494c50; --color-sidebar-bg-item: oklch(from #222326 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-scrollbar-bg: oklch(from #7e8187 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-utility-gray-50: oklch(from #18191b calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-utility-gray-200: oklch(from #343538 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-utility-gray-300: oklch(from #54565a calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-utility-gray-700: oklch(from #d1d1d1 calc(clamp(0, l + (clamp(.36, var(--comma-theme-l), .64) - .5) * 4 * l * (1 - l), 1)) calc(var(--comma-theme-c) * 4 * l * (1 - l)) var(--comma-theme-h)); --color-utility-brand-50: #00010b; --color-utility-brand-100: #02092b; --color-utility-brand-200: #041756; --color-utility-brand-300: #062389; --color-utility-brand-400: #092fc0; --color-utility-brand-700: #3b7cff; --color-utility-error-50: #55160c; --color-utility-error-200: #912018; --color-utility-error-300: #fda29b; --color-utility-error-700: #fda29b; --color-utility-warning-50: #4e1d09; --color-utility-warning-200: #93370d; --color-utility-warning-300: #fec84b; --color-utility-warning-700: #fec84b; --color-utility-success-50: #053321; --color-utility-success-200: #085d3a; --color-utility-success-300: #75e0a7; --color-utility-success-700: #75e0a7; --color-utility-blue-50: #102a56; --color-utility-blue-200: #1849a9; --color-utility-blue-300: #84caff; --color-utility-blue-700: #84caff; --color-utility-indigo-50: #1f235b; --color-utility-indigo-200: #2d31a6; --color-utility-indigo-300: #a4bcfd; --color-utility-indigo-700: #a4bcfd; --color-utility-purple-50: #27115f; --color-utility-purple-200: #4a1fb8; --color-utility-purple-300: #bdb4fe; --color-utility-purple-700: #bdb4fe; --color-utility-pink-50: #4e0d30; --color-utility-pink-200: #9e165f; --color-utility-pink-300: #faa7e0; --color-utility-pink-700: #faa7e0; --color-utility-orange-50: #511c10; --color-utility-orange-200: #932f19; --color-utility-orange-300: #f7b27a; --color-utility-orange-700: #f7b27a; --shadow-xs: 0 1px 2px 0 #00000052; --shadow-sm: 0 1px 2px 0 #0000005c, 0 1px 3px 0 #0000007a; --shadow-md: 0 2px 4px -2px #0000005c, 0 4px 8px -2px #0000007a; --shadow-lg: 0 4px 6px -2px #0000003d, 0 12px 16px -4px #0006; --shadow-xl: 0 8px 8px -4px #0000003d, 0 20px 24px -4px #0006; --shadow-2xl: 0 24px 48px -12px #0000008f; --shadow-3xl: 0 32px 64px -12px #00000085; --shadow-focus-brand: 0 0 0 4px #1040f23d; --shadow-focus-gray: 0 0 0 4px #98a2b324; --shadow-focus-gray-secondary: 0 0 0 4px #98a2b333; --shadow-focus-error: 0 0 0 4px #f044383d; --shadow-focus-brand-shadow-xs: 0 0 0 4px #1040f23d, 0 1px 2px 0 #00000052; --shadow-focus-brand-shadow-sm: 0 0 0 4px #1040f23d, 0 1px 2px 0 #0000005c, 0 1px 3px 0 #0000007a; --shadow-focus-gray-shadow-xs: 0 0 0 4px #98a2b324, 0 1px 2px 0 #00000052; --shadow-focus-gray-shadow-sm: 0 0 0 4px #98a2b324, 0 1px 2px 0 #0000005c, 0 1px 3px 0 #0000007a; --shadow-focus-error-shadow-xs: 0 0 0 4px #f044383d, 0 1px 2px 0 #00000052; }
.comma-ai-activity { --ai-activity-text-duration: var(--motion-duration-state-change); --ai-activity-text-duration-exit: var(--motion-duration-reveal-item); --ai-activity-text-easing: var(--motion-easing-smooth-out); --ai-activity-text-distance: var(--spacing-md); --ai-activity-text-blur: var(--spacing-xxs); --ai-activity-chevron-hidden-scale: var(--motion-scale-action-pressed); --ai-activity-panel-duration-enter: var(--motion-duration-icon-swap); --ai-activity-panel-duration-exit: var(--motion-duration-icon-swap); --ai-activity-panel-easing: var(--motion-easing-surface-smooth-out); --ai-activity-edge-surface: var(--color-bg-primary); --ai-activity-events-max-block-size: calc(var(--text-sm--line-height) + var(--text-sm--line-height) + var(--text-sm--line-height) + var(--text-sm--line-height) + var(--text-sm--line-height) + var(--text-sm--line-height) + var(--text-sm--line-height) + var(--text-sm--line-height) + var(--spacing-sm) + var(--spacing-sm) + var(--spacing-sm) + var(--spacing-sm) + var(--spacing-sm) + var(--spacing-sm) + var(--spacing-sm)); gap: var(--spacing-xs); min-width: 0px; color: var(--color-text-tertiary); font-family: var(--font-sans); font-size: var(--text-sm); font-weight: var(--font-weight-regular); letter-spacing: var(--text-sm--letter-spacing); line-height: var(--text-sm--line-height); display: grid; }
.comma-ai-activity-body { gap: var(--spacing-md); min-width: 0px; display: grid; }
.comma-ai-activity-disclosure { min-width: 0px; }
.comma-ai-activity-summary-shell { --ai-activity-chevron-shift: 0px; align-items: center; gap: var(--spacing-xs); width: fit-content; min-width: 0px; max-width: 100%; color: inherit; border-radius: var(--radius-xs); display: flex; position: relative; }
.comma-ai-activity-summary-static { width: 100%; flex-wrap: nowrap; min-inline-size: 0px; }
.comma-ai-activity-summary-static > span, .comma-ai-activity-summary-static .comma-ai-activity-text { min-inline-size: 0px; }
.comma-ai-activity-text { vertical-align: top; min-width: 0px; display: inline-grid; position: relative; overflow: clip; }
.comma-ai-activity-text-layer { align-items: center; column-gap: var(--spacing-md); opacity: 1; filter: none; overflow-wrap: anywhere; min-width: 0px; transition: transform var(--ai-activity-text-duration) var(--ai-activity-text-easing), opacity var(--ai-activity-text-duration-exit) var(--ai-activity-text-easing); flex-wrap: wrap; grid-area: 1 / 1; display: inline-flex; transform: translateY(0px); }
.comma-ai-activity-summary-static .comma-ai-activity-text .comma-ai-activity-text-layer { white-space: normal; text-wrap-style: pretty; flex-wrap: wrap; }
@media (prefers-reduced-motion: reduce){.comma-ai-activity-text-layer { filter: none; transform: none; transition: none !important; }
}
.comma-inline-task { align-items: baseline; gap: var(--spacing-xxs); max-width: min(28rem, 100%); margin: -1px var(--spacing-xxs); padding: 1px var(--spacing-md) 1px var(--spacing-xs); border-radius: var(--radius-sm); background-color: var(--color-bg-tertiary); color: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; font-stretch: inherit; font-size: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-language-override: inherit; line-height: var(--text-sm--line-height); vertical-align: baseline; transition: background-color var(--motion-duration-state-change) ease, transform var(--motion-duration-feedback-in) var(--motion-easing-smooth-out); text-decoration: none; display: inline-flex; }
@media (hover: hover) and (pointer: fine){.comma-inline-task:not(.comma-inline-task--unavailable):not(.comma-inline-task--archived):not(.comma-inline-task--passive):hover { background-color: var(--color-bg-quaternary); }
}
.comma-inline-task:not(.comma-inline-task--unavailable):not(.comma-inline-task--archived):not(.comma-inline-task--passive):active { background-color: var(--color-bg-quaternary); transform: scale(var(--motion-scale-pressed)); }
.comma-inline-task:focus-visible { outline: 2px solid var(--color-border-brand); outline-offset: 2px; }
.comma-inline-task-icon { flex: 0 0 auto; justify-content: center; align-self: center; align-items: center; width: 20px; height: 20px; display: inline-flex; }
.comma-inline-task-icon svg { width: 100%; height: 100%; }
.comma-inline-task-title { text-overflow: ellipsis; white-space: nowrap; max-width: 24rem; overflow: hidden; }
@media (prefers-reduced-motion: reduce){.comma-inline-task { transition-property: background-color; }
.comma-inline-task:not(.comma-inline-task--unavailable):not(.comma-inline-task--archived):not(.comma-inline-task--passive):active { transform: none; }
}
.comma-logo-animation { --comma-logo-cycle: 3.6s; block-size: auto; color: var(--color-text-primary); max-inline-size: min(80vw, 35rem); display: block; overflow: hidden; }
.comma-logo-animation__outer, .comma-logo-animation__comma, .comma-logo-animation__nested-comma-path { fill: currentcolor; }
.comma-logo-animation__nested-aperture { fill: var(--color-bg-primary); }
.comma-logo-animation__scene, .comma-logo-animation__nested-comma { transform-box: view-box; }
.comma-logo-animation__scene { animation: var(--comma-logo-zoom-animation) var(--comma-logo-cycle) linear infinite; transform-origin: 0px 0px; transform: matrix(1, 0, 0, 1, 0, 0); }
[data-island][data-offscreen] .comma-logo-animation__scene { animation-play-state: paused !important; }
.comma-logo-animation__nested-comma { animation: var(--comma-logo-nested-animation) var(--comma-logo-cycle) linear infinite; transform-origin: 606.449px 595.566px; transform: scale(0); }
[data-island][data-offscreen] .comma-logo-animation__nested-comma { animation-play-state: paused !important; }
.comma-logo-animation__scene, .comma-logo-animation__nested-comma { animation-delay: var(--comma-logo-delay,0s); }
.comma-logo-animation[data-paused="true"] .comma-logo-animation__scene, .comma-logo-animation[data-paused="true"] .comma-logo-animation__nested-comma { animation-play-state: paused; }
@media (prefers-reduced-motion: reduce){.comma-logo-animation__scene, .comma-logo-animation__nested-comma { animation: auto ease 0s 1 normal none running none; }
.comma-logo-animation__nested-comma { transform: scale(0); }
}
.comma-home-tasks-viewport { --comma-home-tasks-dir: 1; --comma-home-tasks-travel: calc(var(--comma-home-tasks-dir) * 3 * var(--motion-distance-reveal-item)); }
.comma-home-tasks-item[data-motion-visible="false"] .comma-shiny-text { animation-play-state: paused; }
.comma-home-tasks-panel[data-role="current"] { transition: transform var(--motion-duration-icon-swap) var(--motion-easing-smooth-out), opacity var(--motion-duration-icon-swap) var(--motion-easing-smooth-out); }
:root { scrollbar-color: var(--color-scrollbar-bg) transparent; }
:where([data-rac]:focus-visible:not([data-focus-visible])) { outline: none; }
@media (prefers-reduced-motion: reduce){:root { scroll-behavior: auto !important; }
:root *, :root ::before, :root ::after { scroll-behavior: auto !important; transition-duration: 0s !important; transition-delay: 0s !important; animation-duration: 0s !important; animation-iteration-count: 1 !important; animation-delay: 0s !important; }
}
@property --radix-collapsible-content-height { syntax: "<length>"; inherits: false; initial-value: 0; }
@property --radix-collapsible-content-width { syntax: "<length>"; inherits: false; initial-value: 0; }
@property --scroll-area-edge-mask-start { syntax: "<length>"; inherits: false; initial-value: 0; }
@property --scroll-area-edge-mask-end { syntax: "<length>"; inherits: false; initial-value: 0; }
@property --scroll-area-edge-blur-layer-radius { syntax: "<length>"; inherits: false; initial-value: 0; }
@property --scroll-area-edge-mask-image { syntax: "*"; inherits: false; }
.comma-shiny-text { --comma-shiny-text-base: var(--color-text-quaternary); --comma-shiny-text-highlight: var(--color-text-primary); }
@supports ((-webkit-background-clip:text) or (background-clip:text)){.comma-shiny-text.comma-shiny-text { background-image: linear-gradient(90deg, var(--comma-shiny-text-base) 0%, var(--comma-shiny-text-base) 40%, var(--comma-shiny-text-highlight) 50%, var(--comma-shiny-text-base) 60%, var(--comma-shiny-text-base) 100%); color: rgba(0, 0, 0, 0); -webkit-text-fill-color: transparent; animation: comma-shiny-text-shine var(--motion-duration-loading-shine) linear infinite; background-repeat: no-repeat; background-size: 400% 100%; background-clip: text; display: inline-block; }
}
[data-island][data-offscreen] .comma-shiny-text.comma-shiny-text { animation-play-state: paused !important; }
@media (prefers-reduced-motion: reduce){.comma-shiny-text.comma-shiny-text { color: var(--comma-shiny-text-base); -webkit-text-fill-color: currentcolor; background-image: none; animation: auto ease 0s 1 normal none running none !important; }
}
@media (forced-colors: active){.comma-shiny-text.comma-shiny-text { color: canvastext; -webkit-text-fill-color: currentcolor; background-image: none; animation: auto ease 0s 1 normal none running none; }
}
:root { --resize-dur: .15s; --resize-ease: cubic-bezier(.22, 1, .36, 1); }
.t-resize { transition: width var(--resize-dur) var(--resize-ease), height var(--resize-dur) var(--resize-ease); will-change: width, height; }
.ai-input-small-shell-motion { transition: border-radius var(--resize-dur) var(--resize-ease), padding var(--resize-dur) var(--resize-ease); }
.ai-input-small-shell-motion[data-compact="true"] { --resize-dur: 80ms; }
.ai-input-small-prompt-motion { transition: transform var(--resize-dur) var(--resize-ease); will-change: transform; }
.ai-input-rich-editor[data-empty="true"]::before { pointer-events: none; color: var(--color-ai-input-panel-text-placeholder); content: attr(data-placeholder); }
.ai-input-small-toolbar-hit-area, .ai-input-small-toolbar-hit-area > * { pointer-events: none; }
.ai-input-small-toolbar-hit-area > * > * { pointer-events: auto; }
@media (prefers-reduced-motion: reduce){.t-resize, .ai-input-small-shell-motion, .ai-input-small-prompt-motion, .comma-content-header, .ai-input-rich-token-tooltip { transition: none !important; }
}
:where(:is(button, [data-slot="settings-sidebar-item"]):not(:disabled):not([aria-disabled="true"]):not([role="slider"]):not([data-no-press-feedback])) { --button-press-current-duration: var(--button-press-out-duration); transition: color var(--button-state-duration) var(--button-state-easing), background-color var(--button-state-duration) var(--button-state-easing), border-color var(--button-state-duration) var(--button-state-easing), text-decoration-color var(--button-state-duration) var(--button-state-easing), fill var(--button-state-duration) var(--button-state-easing), stroke var(--button-state-duration) var(--button-state-easing), scale var(--button-press-current-duration) var(--button-press-easing); scale: 1; }
:where(:is(button, [data-slot="settings-sidebar-item"]):not(:disabled):not([aria-disabled="true"]):not([role="slider"]):not([data-no-press-feedback]):active) { --button-press-current-duration: var(--button-press-in-duration); scale: var(--button-press-scale); }
@media (prefers-reduced-motion: reduce){:where(:is(button, [data-slot="settings-sidebar-item"]):not(:disabled):not([aria-disabled="true"]):not([role="slider"])) { --button-press-scale: 1; transition: none !important; scale: 1 !important; }
}
.comma-chat-thread .markdown-stream .markdown-renderer { content-visibility: visible; contain-intrinsic-size: none; }
.markdown-stream .markdown-stream-code-body .code-block-content { max-height: none; }
.markdown-stream .markdown-stream-code-body pre { font-weight: var(--vscode-editor-font-weight,400); }
.markdown-stream .markdown-stream-code-body pre > code { font-family: inherit; }
:root, :root[data-comma-font-size="default"] { font-size: 100%; }
:root { --comma-icon-button-size: calc(var(--spacing-3xl) + var(--spacing-xs)); --panel-open-dur: .4s; --panel-close-dur: .35s; --panel-translate-y: 100px; --panel-blur: 2px; --panel-ease: cubic-bezier(.22, 1, .36, 1); }
html, body, #root { min-width: 320px; min-height: 100%; }
body { overflow: hidden; }
.comma-content { z-index: 1; border-radius: var(--comma-window-inner-corner-radius); app-region: no-drag; box-shadow: rgba(16, 24, 40, 0.06) 0px 1px 2px, rgba(16, 24, 40, 0.1) 0px 1px 3px; container: comma-content / inline-size; }
.comma-content::after { z-index: 10; border-radius: inherit; box-shadow: inset 0 0 0 var(--border-width-0-5) var(--color-border-primary); content: ""; pointer-events: none; position: absolute; inset: 0px; }
.comma-chat-route { app-region: no-drag; }
.comma-chat-route[data-variant="home"] { container: comma-home / inline-size; }
@property --comma-home-greet-preferred { syntax: "<length>"; inherits: false; initial-value: 300px; }
@property --comma-home-greet-width { syntax: "<length>"; inherits: false; initial-value: 300px; }
@property --comma-home-tasks-preferred { syntax: "<length>"; inherits: false; initial-value: 300px; }
.comma-home-layout { --comma-home-chat-min: 393px; --comma-home-rail-min: 240px; --comma-home-greet-width: clamp(var(--comma-home-rail-min), calc(100cqw - 441px), var(--comma-home-greet-preferred,300px)); --comma-home-rail-fold-shift: var(--comma-rail-fold-shift); --comma-home-rail-fold-scale: var(--comma-rail-fold-scale); --comma-home-rail-handle-length: var(--spacing-3xl); --comma-home-rail-handle-hover-length: var(--spacing-6xl); --comma-home-greet-shell-clearance: 0px; --comma-home-tasks-shell-clearance: 0px; grid-template-columns: calc((var(--comma-home-greet-width) + var(--spacing-xl)) * (1 - var(--comma-home-greet-fold))) minmax(0, 1fr) min(calc((var(--comma-home-tasks-preferred,300px) + var(--spacing-xl)) * (1 - var(--comma-home-tasks-fold))), max(0px, calc(100cqw - 425px - (var(--comma-home-greet-width) + var(--spacing-xl)) * (1 - var(--comma-home-greet-fold)) - var(--comma-home-greet-shell-clearance) * var(--comma-home-greet-fold) - var(--comma-home-tasks-shell-clearance) * var(--comma-home-tasks-fold)))); min-width: 0px; min-height: 0px; padding-block: 0px; padding-left: calc(var(--spacing-xl) + var(--comma-home-greet-shell-clearance) * var(--comma-home-greet-fold)); padding-right: calc(var(--spacing-xl) + var(--comma-home-tasks-shell-clearance) * var(--comma-home-tasks-fold)); flex: 1 1 0%; justify-content: stretch; display: grid; position: relative; overflow: hidden; }
@property --comma-home-greet-fold { syntax: "<number>"; inherits: false; initial-value: 0; }
@property --comma-home-tasks-fold { syntax: "<number>"; inherits: false; initial-value: 0; }
@property --comma-home-rail-fold-progress { syntax: "<number>"; inherits: false; initial-value: 0; }
.comma-home-rail { position: relative; }
.comma-home-chat { flex-direction: column; grid-column: 2; width: auto; min-width: 0px; min-height: 0px; display: flex; }
@container comma-home not (width >= 560px){.comma-home-layout { padding-inline: var(--spacing-none); }
.comma-home-chat .comma-chat-thread, .comma-home-chat .comma-chat-composer-zone { padding-inline: var(--spacing-xl); }
.comma-home-chat .comma-chat-column, .comma-home-chat .comma-chat-composer-frame { --comma-chat-avatar-gutter: var(--spacing-none); }
}
.comma-home-rail { width: max(0px, calc(100% - var(--spacing-xl))); justify-self: start; min-width: 0px; min-height: 0px; overflow: clip; }
.comma-home-greet-rail { grid-column: 1; }
.comma-home-rail, .comma-home-rail-surface { --comma-home-greet-width: inherit; }
.comma-home-tasks-rail { --comma-home-tasks-preferred: inherit; grid-column: 3; margin-inline-start: var(--spacing-xl); }
.comma-home-greet-rail .comma-home-rail-surface { width: var(--comma-home-greet-width); --comma-home-rail-fold-direction: -1; }
.comma-home-tasks-rail .comma-home-rail-surface { --comma-home-tasks-preferred: inherit; width: clamp(var(--comma-home-rail-min), calc(100cqw - 425px - var(--comma-home-greet-width) - 2 * var(--spacing-xl)), var(--comma-home-tasks-preferred,300px)); --comma-home-rail-fold-direction: 1; }
.comma-home-rail-surface { min-width: var(--comma-home-rail-min,240px); height: 100%; min-height: 0px; padding: var(--spacing-xl) 0; opacity: calc(1 - min(1, var(--comma-home-rail-fold-progress) / .4)); transform: translateX(calc(var(--comma-home-rail-fold-direction) * var(--comma-home-rail-fold-shift) * var(--comma-home-rail-fold-progress))) scale(calc(1 - (1 - var(--comma-home-rail-fold-scale)) * var(--comma-home-rail-fold-progress))); transform-origin: 0px center; flex-direction: column; display: flex; }
.comma-chat-route[data-variant="home"] .comma-home-tasks-footer { height: calc(36px + var(--border-width-default) + var(--border-width-default)); padding-top: 0px; }
.comma-recommendations { flex-direction: column; flex: 1 1 0%; min-height: 0px; display: flex; }
.comma-recommendations-heading { min-height: var(--comma-icon-button-size); padding: var(--spacing-none) var(--spacing-xs); justify-content: space-between; align-items: center; display: flex; }
.comma-recommendations-summary + .comma-recommendations-heading { margin-top: var(--spacing-md); }
.comma-recommendations-heading h2 { color: var(--color-text-tertiary); font-size: var(--text-sm); font-weight: var(--font-weight-medium); letter-spacing: var(--text-sm--letter-spacing); line-height: var(--text-sm--line-height); margin: 0px; }
.comma-recommendations-scroll { flex: 1 1 0%; min-height: 0px; }
.comma-recommendations-content { gap: var(--spacing-lg); padding: 0 var(--spacing-xs) var(--spacing-xl); flex-direction: column; display: flex; }
.comma-recommendations-summary { padding: var(--spacing-sm) 0 var(--spacing-md); color: var(--color-text-tertiary); font-size: 0.875rem; line-height: 1.25rem; }
.comma-recommendations-summary h1 { margin: 0 0 var(--spacing-md); color: var(--color-text-primary); font-size: 1.125rem; font-weight: 600; line-height: 1.75rem; }
.comma-recommendations-summary-body { text-wrap: pretty; }
.comma-recommendations-summary-body .markdown-renderer { content-visibility: visible; }
.comma-recommendations-summary-body .markdown-stream p { color: var(--color-text-tertiary); font-size: var(--text-sm); font-weight: 400; line-height: var(--text-sm--line-height); }
.comma-recommendations-summary-body .markdown-stream .node-slot + .node-slot { margin-top: var(--spacing-md); }
.comma-recommendation-card { border: var(--border-width-0-5) solid var(--color-border-primary); border-radius: var(--radius-xl); background: var(--color-bg-popup-secondary); box-shadow: var(--shadow-xs); padding: var(--spacing-lg) var(--spacing-xs) var(--spacing-xs); overflow: hidden; }
.comma-recommendation-card-heading { align-items: center; gap: var(--spacing-md); min-width: 0px; margin: 0 var(--spacing-md) var(--spacing-md); display: flex; }
.comma-recommendation-card-logo { width: var(--spacing-xl); height: var(--spacing-xl); color: var(--color-sidebar-icon-primary); flex: 0 0 auto; justify-content: center; align-items: center; display: inline-flex; }
.comma-recommendation-card-logo img, .comma-recommendation-card-logo svg { object-fit: contain; width: 100%; height: 100%; }
.comma-recommendation-card h3 { min-width: 0px; color: var(--color-text-quaternary); font-size: var(--text-sm); font-weight: var(--font-weight-medium); letter-spacing: var(--text-sm--letter-spacing); line-height: var(--text-sm--line-height); text-overflow: ellipsis; white-space: nowrap; margin: 0px; overflow: hidden; }
.comma-recommendation-items { flex-direction: column; gap: 1px; display: flex; }
.comma-recommendation-text-item { min-height: var(--spacing-4xl); align-items: center; gap: var(--spacing-md); border-radius: var(--radius-md); min-width: 0px; color: var(--color-text-primary); padding: var(--spacing-sm) var(--spacing-md); font-size: var(--text-sm); line-height: var(--text-sm--line-height); transition: background-color var(--motion-duration-feedback-out) var(--motion-easing-smooth-out); background: 0px 0px; display: flex; position: relative; }
.comma-recommendation-text-item:hover, .comma-recommendation-text-item:focus-within { background: var(--color-bg-quaternary); }
.comma-recommendation-text-item-action { z-index: 0; border-radius: inherit; cursor: pointer; background: 0px 0px; border: 0px; position: absolute; inset: 0px; }
.comma-recommendation-text-item-content { z-index: 1; height: var(--spacing-2xl); align-items: center; column-gap: var(--spacing-xs); white-space: nowrap; pointer-events: none; flex: 1 1 auto; min-width: 0px; display: flex; position: relative; overflow: hidden; }
.comma-recommendation-text-item-content * { white-space: nowrap !important; }
.comma-recommendation-text-item-content .markdown-stream, .comma-recommendation-text-item-content .markdown-renderer, .comma-recommendation-text-item-content .node-slot, .comma-recommendation-text-item-content .node-content, .comma-recommendation-text-item-content p { display: contents; }
.comma-recommendation-text-item-content .markdown-stream { line-height: var(--text-sm--line-height); }
.comma-recommendation-text-item-content p > span:not([data-slot="task-archive-menu"]) { text-overflow: ellipsis; flex-shrink: 1000; min-width: 0px; overflow: hidden; }
.comma-recommendation-text-item-content p > span:not([data-slot="task-archive-menu"]):first-child { flex-shrink: 1; }
.comma-recommendation-text-item-content .comma-recommendation-inline { pointer-events: auto; flex: 0 0.01 auto; min-width: 0px; max-width: 100%; }
.comma-recommendation-text-item p { margin: 0px; }
.comma-recommendation-inline { color: var(--color-markdown-text-link); font: inherit; cursor: pointer; border: 0px; padding: 0px; display: inline; }
.comma-recommendation-inline[data-variant="summary"] { border-radius: var(--radius-xs); background: var(--color-bg-quaternary); max-width: 100%; color: var(--color-text-tertiary); padding: 0 var(--spacing-xxs); align-items: center; display: inline-flex; }
.comma-recommendation-inline-source, .comma-recommendation-inline-source[data-variant="summary"] { align-items: baseline; gap: calc(var(--spacing-sm) / 2); border-radius: var(--radius-xs); background: var(--color-bg-quaternary); max-width: 100%; color: var(--color-text-tertiary); padding: 0 var(--spacing-xxs); font-size: var(--text-sm); line-height: var(--text-sm--line-height); letter-spacing: var(--text-sm--letter-spacing); white-space: nowrap; display: inline-flex; }
.comma-recommendation-inline-source[data-variant="summary"] { font: inherit; letter-spacing: inherit; }
.comma-recommendation-inline[data-variant="summary"], .comma-recommendation-inline-source[data-variant="summary"] { line-height: var(--text-xs--line-height); max-width: min(240px, 100%); }
.comma-recommendation-inline[data-variant="summary"] > span, .comma-recommendation-inline-source > span { text-overflow: ellipsis; white-space: nowrap; overflow: hidden; }
.comma-recommendation-inline-source:hover { background: var(--color-bg-tertiary); }
.comma-recommendation-inline-source img, .comma-recommendation-inline-source svg { width: var(--spacing-xl); height: var(--spacing-xl); object-fit: contain; flex: 0 0 auto; align-self: center; }
.comma-recommendation-inline-source svg[data-provider-logo="github"], .comma-recommendation-inline-source svg[data-provider-logo="linear"], .comma-recommendation-inline-source svg[data-provider-logo="notion"], .comma-recommendation-inline-source svg[data-provider-logo="slack"] { box-sizing: border-box; border-radius: var(--radius-xs); background: var(--color-base-white); padding: calc(var(--spacing-xxs) / 2); }
.comma-recommendation-inline-source svg[data-provider-logo="github"], .comma-recommendation-inline-source svg[data-provider-logo="notion"] { color: var(--color-alpha-black-90); }
.comma-recommendation-inline-source svg[data-provider-logo="google-calendar"] { border-radius: var(--radius-xxs); background: var(--color-base-white); }
.comma-recommendation-inline-source svg[data-provider-logo="google-drive"] { box-sizing: border-box; border-radius: var(--radius-xxs); background: var(--color-base-white); padding: var(--spacing-xxs); }
.comma-recommendation-row-icon { width: var(--spacing-2xl); height: var(--spacing-2xl); color: var(--color-sidebar-icon-primary); filter: blur(var(--motion-blur-menu-enter)); opacity: 0; pointer-events: none; transform: scale(var(--motion-scale-menu-enter)); transition: opacity var(--motion-duration-icon-swap) var(--motion-easing-smooth-out), filter var(--motion-duration-icon-swap) var(--motion-easing-smooth-out), transform var(--motion-duration-icon-swap) var(--motion-easing-smooth-out); flex: 0 0 auto; }
.comma-recommendation-text-item:hover .comma-recommendation-row-icon, .comma-recommendation-text-item:focus-within .comma-recommendation-row-icon, .comma-recommendation-media-item:hover .comma-recommendation-row-icon, .comma-recommendation-media-item:focus-visible .comma-recommendation-row-icon, .comma-recommendation-footer-action:hover .comma-recommendation-row-icon, .comma-recommendation-footer-action:focus-visible .comma-recommendation-row-icon { filter: blur(); opacity: 1; transform: scale(1); }
@media (prefers-reduced-motion: reduce){.comma-routines-card-row, .comma-routines-card-row::after, .comma-routines-card-row[data-dragging], .comma-routines-card-row[data-pointer-dragging="true"], .comma-routines-card-row[data-dragging]::after, .comma-routines-card-row[data-pointer-dragging="true"]::after, .comma-routines-card-row[data-routine-drag-shift], .comma-routines-card-list .react-aria-DropIndicator::after, .comma-recommendation-row-icon { transition: none; }
.comma-recommendation-row-icon { filter: none; transform: none; }
}
@media (prefers-reduced-motion: reduce){.comma-home-rail .comma-home-rail-surface { transform: none; }
}
.comma-task-label-chip { align-items: center; gap: var(--spacing-xs); max-width: 100%; padding: var(--spacing-xxs) var(--spacing-lg) var(--spacing-xxs) var(--spacing-md); border: var(--border-width-default) solid var(--color-border-primary); border-radius: var(--radius-full); color: var(--color-text-primary); font-size: var(--text-sm); font-weight: var(--font-weight-medium); line-height: var(--text-sm--line-height); white-space: nowrap; display: inline-flex; }
.comma-task-label-chip .comma-label-dot { width: var(--spacing-md); height: var(--spacing-md); }
.comma-task-label-chip-text { white-space: nowrap; min-width: 0px; }
.comma-task-platform-chip { padding: var(--spacing-xxs) var(--spacing-md) var(--spacing-xxs) var(--spacing-xxs); }
.comma-task-platform-chip svg { width: var(--spacing-xl); height: var(--spacing-xl); }
.comma-task-label-chip { opacity: 1; transition: opacity var(--motion-duration-menu-enter) var(--motion-easing-smooth-out), transform var(--motion-duration-menu-enter) var(--motion-easing-smooth-out), background-color var(--motion-duration-feedback-in) var(--motion-easing-smooth-out); transform: none; }
@starting-style{.comma-task-label-chip { opacity: 0; transform: scale(var(--motion-scale-menu-enter)); }
}
@media (prefers-reduced-motion: reduce){.comma-task-label-chip { transition: opacity var(--motion-duration-menu-enter) linear; transform: none; }
@starting-style{.comma-task-label-chip { transform: none; }
}
}
.comma-chat-thread-zone { flex-direction: column; flex: 1 1 0%; min-height: 0px; display: flex; position: relative; overflow: hidden; }
.comma-chat-thread { --comma-chat-thread-top-inset: 24px; justify-content: center; min-height: 100%; padding: 24px 24px 0px; display: flex; }
.comma-chat-column, .comma-chat-composer-frame { --comma-chat-avatar-gutter: calc(24px + var(--spacing-md)); width: 100%; max-width: 744px; padding-inline-start: var(--comma-chat-avatar-gutter); }
.comma-chat-column { --comma-chat-message-gap: var(--spacing-2xl); --comma-chat-consecutive-message-gap: var(--spacing-sm); gap: var(--comma-chat-message-gap); flex-direction: column; display: flex; position: relative; container-type: inline-size; }
.comma-chat-scroll-viewport { container-type: size; }
.comma-chat-turn-shell { flex: 0 0 auto; min-width: 0px; min-height: 0px; }
.comma-chat-turn-shell[data-chat-latest-turn="true"] { gap: var(--comma-chat-message-gap); flex-direction: column; min-width: 0px; padding-bottom: 48px; display: flex; }
.comma-chat-latest-turn { min-height: 200px; }
.comma-chat-turn { --comma-chat-turn-row-gap: var(--spacing-md); column-gap: var(--spacing-2xl); row-gap: var(--comma-chat-turn-row-gap); flex-direction: column; flex: 0 0 auto; display: flex; }
.comma-chat-turn > .comma-chat-message-assistant + .comma-chat-message-assistant, .comma-chat-turn > .comma-chat-message-user + .comma-chat-message-user { margin-block-start: calc(var(--comma-chat-consecutive-message-gap) - var(--comma-chat-turn-row-gap)); }
.comma-chat-message-user { user-select: text; flex-direction: column; align-items: flex-end; display: flex; }
.comma-chat-user-bubble-slot { max-width: min(500px, calc(100cqi - var(--comma-chat-user-bubble-actions-width,42px))); flex: 0 0 auto; justify-content: flex-end; display: flex; }
.comma-chat-user-bubble { --comma-chat-user-bubble-background: var(--color-bg-brand-solid); --comma-chat-user-bubble-foreground: var(--color-text-white); --comma-chat-user-bubble-collapsed-block-size: 480px; --comma-chat-user-bubble-padding-block: 10px; background: var(--comma-chat-user-bubble-background); min-inline-size: 50px; max-width: 100%; padding-block: var(--comma-chat-user-bubble-padding-block); color: var(--comma-chat-user-bubble-foreground); font-size: var(--text-sm); line-height: var(--text-sm--line-height); overflow-wrap: anywhere; white-space: pre-wrap; border-radius: 20px; padding-inline: 13px; position: relative; overflow: clip; }
.comma-chat-user-bubble-content { width: fit-content; max-width: 100%; max-block-size: calc(var(--comma-chat-user-bubble-collapsed-block-size) - 2 * var(--comma-chat-user-bubble-padding-block)); transition: max-block-size var(--motion-duration-spatial-move) var(--motion-easing-surface-smooth-out); margin-inline: auto; overflow: clip; }
.comma-chat-user-bubble-rem-probe { visibility: hidden; pointer-events: none; block-size: 1rem; inline-size: 1rem; position: absolute; inset-block-start: 0px; inset-inline-start: 0px; }
.comma-chat-message-assistant { width: fit-content; max-width: min(calc(500px + 28px + var(--spacing-md)), 100%); align-items: start; column-gap: var(--spacing-md); color: var(--color-text-primary); font-size: var(--text-sm); line-height: var(--text-sm--line-height); user-select: text; grid-template-columns: minmax(0px, 1fr) 28px; display: grid; position: relative; }
.comma-chat-assistant-response-body { width: fit-content; min-width: 0px; max-width: min(500px, 100%); position: relative; }
.comma-chat-thread .markdown-stream-bubble { background: var(--color-markdown-bg-message); width: fit-content; min-width: 50px; max-width: 100%; color: var(--color-text-primary); overflow-wrap: anywhere; border-radius: 20px; padding: 10px 13px; }
.comma-chat-thread [data-bubble-tail="right"] .comma-chat-user-bubble:not([data-outgoing-presentation="flying"]) { isolation: isolate; backdrop-filter: none; background: 0px 0px; position: relative; overflow: visible; }
.comma-chat-thread [data-bubble-tail="left"] .node-slot:not(:has(~ .node-slot)) > .node-content > .markdown-stream-bubble { isolation: isolate; backdrop-filter: none; background: 0px 0px; position: relative; overflow: visible; }
.comma-chat-thread [data-bubble-tail="right"] .comma-chat-user-bubble:not([data-outgoing-presentation="flying"])::before, .comma-chat-thinking-bubble::before { z-index: -1; background: var(--comma-chat-tail-background,var(--comma-chat-user-bubble-background,var(--comma-side-chat-assistant-bg,var(--color-markdown-bg-message)))); backdrop-filter: var(--comma-chat-tail-filter,none); pointer-events: none; content: ""; position: absolute; inset: 0px 0px -7px; mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg'%3E%3Crect width='100%25' height='100%25' rx='20' fill='black'/%3E%3C/svg%3E"), url("data:image/svg+xml,%3csvg%20width='24'%20height='14'%20viewBox='0%200%2024%2014'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20d='M21.8078%200C20.0078%201%2019.7594%206.40089%2023.4997%2012.4998C24.2565%2013.7338%2023.6023%2013.9471%2021.4402%2013.7338C13.9997%2012.9998%209.00268%203.99981%200%203.99981C0.00810194%203.99979%2013.0078%200.499757%2013.0078%200.499757C15.5075%201.01693%2021.8078%200%2021.8078%200Z'%20fill='%23205BFF'/%3e%3c/svg%3e"); mask-position: 0px 0px, calc(100% - 8px) 100%; mask-size: 100% calc(100% - 7px), 16px 10px; mask-repeat: no-repeat; mask-composite: add; }
.comma-chat-thread [data-bubble-tail="left"] .node-slot:not(:has(~ .node-slot)) > .node-content > .markdown-stream-bubble::before { z-index: -1; background: var(--comma-chat-tail-background,var(--comma-chat-user-bubble-background,var(--comma-side-chat-assistant-bg,var(--color-markdown-bg-message)))); backdrop-filter: var(--comma-chat-tail-filter,none); pointer-events: none; content: ""; position: absolute; inset: 0px 0px -7px; mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg'%3E%3Crect width='100%25' height='100%25' rx='20' fill='black'/%3E%3C/svg%3E"), url("data:image/svg+xml,%3csvg%20width='24'%20height='14'%20viewBox='0%200%2024%2014'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20d='M21.8078%200C20.0078%201%2019.7594%206.40089%2023.4997%2012.4998C24.2565%2013.7338%2023.6023%2013.9471%2021.4402%2013.7338C13.9997%2012.9998%209.00268%203.99981%200%203.99981C0.00810194%203.99979%2013.0078%200.499757%2013.0078%200.499757C15.5075%201.01693%2021.8078%200%2021.8078%200Z'%20fill='%23205BFF'/%3e%3c/svg%3e"); mask-position: 0px 0px, calc(100% - 8px) 100%; mask-size: 100% calc(100% - 7px), 16px 10px; mask-repeat: no-repeat; mask-composite: add; }
.comma-chat-thread [data-bubble-tail="left"] .node-slot:not(:has(~ .node-slot)) > .node-content > .markdown-stream-bubble::before { transform: scaleX(-1); }
.comma-chat-thread .markdown-stream-bubble:is([data-kind="code_block"], [data-kind="table"]) { width: 100%; padding: 0px; }
.comma-chat-thread .markdown-stream-bubble > .markdown-stream-bubble-block:only-child[data-node-type="paragraph"]:not(:has(.markdown-stream-image-preview)) { width: fit-content; max-width: 100%; margin-inline: auto; }
.comma-chat-thread .markdown-stream-bubble .comma-inline-task { background-color: var(--color-fg-senary); }
@media (hover: hover) and (pointer: fine){.comma-chat-thread .markdown-stream-bubble .comma-inline-task:not(.comma-inline-task--unavailable):not(.comma-inline-task--archived):not(.comma-inline-task--passive):hover { background-color: var(--color-fg-quinary); }
}
.comma-chat-thread .markdown-stream-bubble .comma-inline-task:not(.comma-inline-task--unavailable):not(.comma-inline-task--archived):not(.comma-inline-task--passive):active { background-color: var(--color-fg-quinary); }
.comma-chat-thread .markdown-stream-bubble-block + .markdown-stream-bubble-block { margin-top: var(--spacing-lg); }
.comma-chat-thread .markdown-stream-bubble > .markdown-stream-bubble-block > .markdown-stream-surface { border-radius: 20px; }
.comma-chat-composer-shell { position: relative; }
.comma-chat-user-bubble-row { align-items: flex-start; gap: var(--spacing-sm); flex-direction: row-reverse; max-width: 100%; display: flex; }
.comma-chat-message-actions { justify-content: center; align-items: center; gap: var(--spacing-xxs); min-width: 28px; min-height: 28px; color: var(--color-text-tertiary); opacity: 0; flex: 0 0 auto; margin-top: 6px; transition: opacity 0.14s cubic-bezier(0.23, 1, 0.32, 1); display: flex; }
.comma-chat-assistant-response-body > .comma-chat-message-actions { margin-top: 24px; position: absolute; inset-block-start: 0px; inset-inline-start: calc(100% + var(--spacing-md)); }
.comma-chat-assistant-response-body:not(:has(.comma-chat-assistant-source-label)) > .comma-chat-message-actions { margin-top: 6px; }
.comma-chat-reply-lines { pointer-events: none; fill: none; width: 100%; height: 100%; stroke: var(--color-border-secondary); stroke-width: 2.5px; stroke-linecap: round; position: absolute; inset: 0px; overflow: visible; }
.comma-chat-column :is(.comma-chat-message-user, .comma-chat-message-assistant), .comma-chat-reply-lines > path, .comma-chat-reply-preview-bubble, .comma-chat-reply-preview > .comma-chat-reply-preview-avatar { transition: opacity var(--motion-duration-state-change) ease; }
.comma-chat-message-assistant:hover .comma-chat-message-actions, .comma-chat-message-assistant:focus-within .comma-chat-message-actions, .comma-chat-message-user:hover .comma-chat-message-actions, .comma-chat-message-user:focus-within .comma-chat-message-actions { opacity: 1; }
.comma-chat-message-action-button { --icon-swap-dur: var(--motion-duration-feedback-in); inline-size: var(--spacing-2xl); block-size: var(--spacing-2xl); border-radius: var(--radius-sm); color: inherit; background: 0px 0px; border: 0px; justify-content: center; align-items: center; padding: 0px; transition: background-color 0.12s, color 0.12s, scale 0.12s cubic-bezier(0.23, 1, 0.32, 1); display: inline-flex; position: relative; }
.comma-chat-message-action-button::before { inset: calc(0px - var(--spacing-xs)); content: ""; position: absolute; }
.comma-chat-message-copy-success-icon { scale: 1.15; }
.comma-chat-message-action-button:hover { background: var(--color-sidebar-bg-item); color: var(--color-text-primary); }
.comma-chat-message-action-button:active { scale: 0.97; }
@property --comma-chat-task-item-tint { syntax: "<color>"; inherits: true; initial-value: #0000; }
.comma-chat-activity-slot { flex: 0 0 auto; min-width: 0px; height: 40px; min-height: 40px; padding: 0px; }
.comma-chat-activity-slot[data-active="false"] { visibility: hidden; }
.comma-chat-activity-row { align-items: center; gap: var(--spacing-md); opacity: 1; min-width: 0px; min-height: 32px; display: flex; }
.comma-chat-activity-slot[data-active="false"] .comma-chat-activity-row { opacity: 0; pointer-events: none; }
.comma-chat-thinking-bubble { isolation: isolate; align-items: center; gap: var(--spacing-sm); --comma-chat-tail-background: var(--comma-side-chat-assistant-bg,var(--color-markdown-bg-message)); width: fit-content; min-width: 0px; max-width: 100%; height: 40px; padding: 10px 13px; display: flex; position: relative; }
.comma-chat-thinking-bubble::before { animation: comma-chat-thinking-breathe 3.6s var(--motion-easing-spatial-move) infinite; transform: scaleX(-1); }
[data-island][data-offscreen] .comma-chat-thinking-bubble::before { animation-play-state: paused !important; }
.comma-chat-thinking-logo { flex: 0 0 auto; width: 16px; height: 16px; display: block; }
.comma-chat-thinking-logo .comma-logo-animation { width: 100%; height: 100%; }
.comma-chat-activity-slot:not([data-state="active"]) .comma-chat-thinking-bubble::before, :root[data-comma-reduced-motion="true"] .comma-chat-thinking-bubble::before { animation: auto ease 0s 1 normal none running none; }
@media (prefers-reduced-motion: reduce){.comma-chat-thinking-bubble::before { animation: auto ease 0s 1 normal none running none; }
}
.comma-chat-activity-line { flex: 1 1 0%; min-width: 0px; max-width: 744px; }
.comma-chat-activity-line .comma-ai-activity-summary-shell, .comma-chat-activity-line .comma-ai-activity-summary-shell > [aria-live], .comma-chat-activity-line .comma-ai-activity-text, .comma-chat-activity-line .comma-ai-activity-text-layer { min-width: 0px; max-width: 100%; }
.comma-chat-activity-line .comma-ai-activity-text-summary { text-overflow: ellipsis; white-space: nowrap; display: block; overflow: hidden; }
@media (prefers-reduced-motion: reduce){.comma-chat-activity-slot, .comma-chat-activity-row, .comma-chat-activity-avatars, .comma-chat-activity-avatar { transition: none; }
}
.comma-chat-composer-zone { padding: var(--spacing-none) 24px 16px; flex: 0 0 auto; justify-content: center; display: flex; }
@media (hover: none){.comma-chat-message-actions { opacity: 1; transform: none; }
}
.app-login-shell, .comma-app-shell, .comma-window-frame { app-region: drag; }
.comma-app-shell { --comma-shell-transition-duration: .15s; --comma-rail-fold-shift: var(--spacing-md); --comma-rail-fold-scale: .98; --comma-rail-fold-ease: cubic-bezier(.22, 1, .36, 1); --comma-window-corner-radius: var(--radius-xl); --comma-window-inset: var(--spacing-none); --comma-window-inner-corner-radius: calc(var(--comma-window-corner-radius) - var(--comma-window-inset)); --comma-window-bar-search-max-width: 400px; }
.comma-window-bar { grid-template-columns: 1fr minmax(0, calc(var(--comma-window-bar-search-max-width) + var(--spacing-md) * 2)) 1fr; }
.app-sr-only { clip: rect(0px, 0px, 0px, 0px); white-space: nowrap; border: 0px; width: 1px; height: 1px; margin: -1px; padding: 0px; position: absolute; overflow: hidden; }
@property --comma-sidebar-fold-progress { syntax: "<number>"; inherits: false; initial-value: 0; }
@media (prefers-reduced-motion: reduce){.comma-chat-user-bubble-content, .comma-chat-user-bubble-fade, .comma-chat-user-bubble-toggle > svg, .comma-sidebar-nav-row[data-sidebar-drag-shift] { transition: none; }
}
.comma-icon-button, .comma-access-button, .app-login-panel, .app-login-stage, .comma-sidebar-link { pointer-events: auto; app-region: no-drag; }
.comma-icon-button { border-radius: var(--radius-sm); }
.comma-icon-button:disabled:hover, .comma-icon-button[data-disabled]:hover { background: 0px 0px; }
.comma-input-icon, .comma-empty-route-icon { flex: 0 0 auto; width: 20px; height: 20px; display: block; }
.comma-label-dot { border-radius: var(--radius-full); background: var(--color-gray-light-mode-400); flex-shrink: 0; }
.comma-label-dot[data-color="blue"], .comma-label-swatch[data-color="blue"] { background: var(--color-blue-light-500); }
.comma-label-dot[data-color="purple"], .comma-label-swatch[data-color="purple"] { background: var(--color-purple-500); }
:is(.comma-chat-message-assistant:has(.comma-chat-widget), .comma-chat-assistant-response-body:has(.comma-chat-widget)) { width: 100%; max-width: 100%; }
.comma-chat-widget { width: 100%; min-width: 0px; margin-block: var(--spacing-md); }
.comma-chat-assistant-response-body:has(.comma-chat-widget) .markdown-stream-bubble { max-width: min(500px, 100%); }
@property --tw-translate-x { syntax: "*"; inherits: false; initial-value: 0; }
@property --tw-translate-y { syntax: "*"; inherits: false; initial-value: 0; }
@property --tw-translate-z { syntax: "*"; inherits: false; initial-value: 0; }
@property --tw-scale-x { syntax: "*"; inherits: false; initial-value: 1; }
@property --tw-scale-y { syntax: "*"; inherits: false; initial-value: 1; }
@property --tw-scale-z { syntax: "*"; inherits: false; initial-value: 1; }
@property --tw-rotate-x { syntax: "*"; inherits: false; }
@property --tw-rotate-y { syntax: "*"; inherits: false; }
@property --tw-rotate-z { syntax: "*"; inherits: false; }
@property --tw-skew-x { syntax: "*"; inherits: false; }
@property --tw-skew-y { syntax: "*"; inherits: false; }
@property --tw-space-y-reverse { syntax: "*"; inherits: false; initial-value: 0; }
@property --tw-border-style { syntax: "*"; inherits: false; initial-value: solid; }
@property --tw-leading { syntax: "*"; inherits: false; }
@property --tw-font-weight { syntax: "*"; inherits: false; }
@property --tw-tracking { syntax: "*"; inherits: false; }
@property --tw-ordinal { syntax: "*"; inherits: false; }
@property --tw-slashed-zero { syntax: "*"; inherits: false; }
@property --tw-numeric-figure { syntax: "*"; inherits: false; }
@property --tw-numeric-spacing { syntax: "*"; inherits: false; }
@property --tw-numeric-fraction { syntax: "*"; inherits: false; }
@property --tw-shadow { syntax: "*"; inherits: false; initial-value: 0 0 #0000; }
@property --tw-shadow-color { syntax: "*"; inherits: false; }
@property --tw-shadow-alpha { syntax: "<percentage>"; inherits: false; initial-value: 100%; }
@property --tw-inset-shadow { syntax: "*"; inherits: false; initial-value: 0 0 #0000; }
@property --tw-inset-shadow-color { syntax: "*"; inherits: false; }
@property --tw-inset-shadow-alpha { syntax: "<percentage>"; inherits: false; initial-value: 100%; }
@property --tw-ring-color { syntax: "*"; inherits: false; }
@property --tw-ring-shadow { syntax: "*"; inherits: false; initial-value: 0 0 #0000; }
@property --tw-inset-ring-color { syntax: "*"; inherits: false; }
@property --tw-inset-ring-shadow { syntax: "*"; inherits: false; initial-value: 0 0 #0000; }
@property --tw-ring-inset { syntax: "*"; inherits: false; }
@property --tw-ring-offset-width { syntax: "<length>"; inherits: false; initial-value: 0; }
@property --tw-ring-offset-color { syntax: "*"; inherits: false; initial-value: #fff; }
@property --tw-ring-offset-shadow { syntax: "*"; inherits: false; initial-value: 0 0 #0000; }
@property --tw-outline-style { syntax: "*"; inherits: false; initial-value: solid; }
@property --tw-blur { syntax: "*"; inherits: false; }
@property --tw-brightness { syntax: "*"; inherits: false; }
@property --tw-contrast { syntax: "*"; inherits: false; }
@property --tw-grayscale { syntax: "*"; inherits: false; }
@property --tw-hue-rotate { syntax: "*"; inherits: false; }
@property --tw-invert { syntax: "*"; inherits: false; }
@property --tw-opacity { syntax: "*"; inherits: false; }
@property --tw-saturate { syntax: "*"; inherits: false; }
@property --tw-sepia { syntax: "*"; inherits: false; }
@property --tw-drop-shadow { syntax: "*"; inherits: false; }
@property --tw-drop-shadow-color { syntax: "*"; inherits: false; }
@property --tw-drop-shadow-alpha { syntax: "<percentage>"; inherits: false; initial-value: 100%; }
@property --tw-drop-shadow-size { syntax: "*"; inherits: false; }
@property --tw-backdrop-blur { syntax: "*"; inherits: false; }
@property --tw-backdrop-brightness { syntax: "*"; inherits: false; }
@property --tw-backdrop-contrast { syntax: "*"; inherits: false; }
@property --tw-backdrop-grayscale { syntax: "*"; inherits: false; }
@property --tw-backdrop-hue-rotate { syntax: "*"; inherits: false; }
@property --tw-backdrop-invert { syntax: "*"; inherits: false; }
@property --tw-backdrop-opacity { syntax: "*"; inherits: false; }
@property --tw-backdrop-saturate { syntax: "*"; inherits: false; }
@property --tw-backdrop-sepia { syntax: "*"; inherits: false; }
@property --tw-duration { syntax: "*"; inherits: false; }
@property --tw-ease { syntax: "*"; inherits: false; }
@property --tw-content { syntax: "*"; inherits: false; initial-value: ""; }
status-indicator, status-indicator-frame { font-family: var(--font-sans); }
[data-hero-frame] *, [data-taking-over] * { transition: none !important; }
.scene-pointer { z-index: 20; opacity: 0; pointer-events: none; transform-origin: 20% 15%; filter: drop-shadow(rgba(0, 0, 0, 0.25) 0px 1px 1.5px); width: 22px; height: 22px; position: absolute; top: 0px; left: 0px; }
[data-island] .comma-scroll-area__viewport { overscroll-behavior-y: auto; }
.client { width: 100%; }
.client-shell { width: 100%; height: 100%; padding: 0 var(--spacing-md) var(--spacing-md); border-radius: var(--radius-3xl); box-shadow: inset 0 0 0 .5px var(--hairline-strong); flex-direction: column; display: flex; position: relative; overflow: clip; }
.client-traffic { flex: 0 0 auto; gap: 8px; width: 56px; display: inline-flex; }
.client-traffic span { border-radius: var(--radius-full); background: var(--window-dot); width: 12px; height: 12px; box-shadow: inset 0 0 0 .5px var(--hairline-strong); }
.client-body { flex: 1 1 0%; min-height: 0px; display: flex; }
.client-route { min-width: 0px; min-height: 0px; display: flex; position: absolute; inset: 0px; }
[data-island] .comma-recommendations-summary-body .markdown-stream p { font-weight: var(--font-weight-regular); }
.comma-chat-thread .markdown-stream-bubble-block + .markdown-stream-bubble-block:has(> p > .comma-inline-task:only-child) { margin-top: var(--spacing-sm); }
.client-shell:not([data-interactive]) .comma-scroll-area__viewport, .wr-stage:not([data-interactive]) .comma-scroll-area__viewport { overflow: hidden !important; }
.comma-logo-animation { --comma-logo-cycle: 3.6s; block-size: auto; color: var(--color-text-primary); max-inline-size: min(80vw, 35rem); display: block; overflow: hidden; }
.comma-logo-animation__outer, .comma-logo-animation__comma, .comma-logo-animation__nested-comma-path { fill: currentcolor; }
.comma-logo-animation__nested-aperture { fill: var(--color-bg-primary); }
.comma-logo-animation__scene, .comma-logo-animation__nested-comma { transform-box: view-box; }
.comma-logo-animation__scene { animation: var(--comma-logo-zoom-animation) var(--comma-logo-cycle) linear infinite; transform-origin: 0px 0px; transform: matrix(1, 0, 0, 1, 0, 0); }
[data-island][data-offscreen] .comma-logo-animation__scene { animation-play-state: paused !important; }
.comma-logo-animation__nested-comma { animation: var(--comma-logo-nested-animation) var(--comma-logo-cycle) linear infinite; transform-origin: 606.449px 595.566px; transform: scale(0); }
[data-island][data-offscreen] .comma-logo-animation__nested-comma { animation-play-state: paused !important; }
.comma-logo-animation__scene, .comma-logo-animation__nested-comma { animation-delay: var(--comma-logo-delay,0s); }
.comma-logo-animation[data-paused="true"] .comma-logo-animation__scene, .comma-logo-animation[data-paused="true"] .comma-logo-animation__nested-comma { animation-play-state: paused; }
@media (prefers-reduced-motion: reduce){.comma-logo-animation__scene, .comma-logo-animation__nested-comma { animation: auto ease 0s 1 normal none running none; }
.comma-logo-animation__nested-comma { transform: scale(0); }
}
.wc-card { gap: var(--spacing-lg); width: 100%; max-width: var(--container-md); padding: var(--spacing-xl); border-radius: var(--radius-xl); background: var(--color-bg-popup-secondary); box-shadow: inset 0 0 0 var(--border-width-0-5) var(--color-border-primary),var(--shadow-xs); color: var(--color-text-secondary); font-size: var(--text-sm); line-height: var(--text-sm--line-height); font-weight: var(--font-weight-regular); flex-direction: column; display: flex; container-type: inline-size; }
.wc-card p, .wc-card h3, .wc-card h4, .wc-card figure { margin: 0px; }
.wc-head { align-items: center; gap: var(--spacing-sm); min-width: 0px; display: flex; }
.wc-title { text-overflow: ellipsis; white-space: nowrap; min-width: 0px; font-size: var(--text-sm); line-height: var(--text-sm--line-height); font-weight: var(--font-weight-medium); color: var(--color-text-secondary); overflow: hidden; }
.wc-meta { font-size: var(--text-xs); line-height: var(--text-xs--line-height); color: var(--color-text-tertiary); font-variant-numeric: tabular-nums; flex: 0 0 auto; margin-inline-start: auto; }
.wc-sr { clip-path: inset(50%); white-space: nowrap; width: 1px; height: 1px; position: absolute; overflow: hidden; }
.wc-icon { flex: 0 0 auto; justify-content: center; align-items: center; display: inline-flex; }
.wc-icon svg { width: 100%; height: 100%; }
.wc-card [data-comma-icon] :where([stroke-width="2"]) { stroke-width: var(--comma-icon-stroke-width,2); }
.wc-col { flex-direction: column; min-width: 0px; display: flex; }
.wc-row-center, .wc-row-start, .wc-row-end { min-width: 0px; display: flex; }
.wc-row-center { align-items: center; }
.wc-gap-xxs { gap: var(--spacing-xxs); }
.wc-gap-md { gap: var(--spacing-md); }
.wc-title-2 { font-size: var(--text-title-2); line-height: var(--text-title-2--line-height); letter-spacing: var(--text-title-2--letter-spacing); }
.wc-w6 { font-weight: var(--font-weight-semibold); }
.wc-c1 { color: var(--color-text-primary); }
.wc-text-success { color: var(--color-text-success-primary); }
.wc-delta { align-items: center; gap: var(--spacing-xxs); font-size: var(--text-xs); line-height: var(--text-xs--line-height); font-weight: var(--font-weight-medium); font-variant-numeric: tabular-nums; display: inline-flex; }
.wc-delta .wc-icon { width: var(--spacing-lg); height: var(--spacing-lg); }
.wc-area-axis, .wc-bars-axis { color: var(--color-text-tertiary); font-size: var(--text-micro); line-height: var(--text-micro--line-height); font-variant-numeric: tabular-nums; justify-content: space-between; display: flex; }
.wc-bars { gap: var(--spacing-sm); flex-direction: column; display: flex; }
.wc-bars-legend { align-items: center; gap: var(--spacing-xs); color: var(--color-text-tertiary); font-size: var(--text-micro); line-height: var(--text-micro--line-height); display: flex; }
.wc-bars-swatch { width: var(--spacing-lg); border-top: var(--border-width-default) dashed var(--color-fg-quaternary); }
.wc-bars-plot { align-items: flex-end; gap: var(--spacing-xs); height: var(--spacing-9xl); display: flex; position: relative; }
.wc-bar-slot { flex: 1 1 0%; align-items: flex-end; height: 100%; display: flex; position: relative; }
.wc-bar-col { border-radius: var(--radius-xs) var(--radius-xs) 0 0; background: var(--color-utility-gray-300); width: 100%; }
.wc-bar-latest { background: var(--color-bg-brand-solid); }
.wc-bars-value { padding-bottom: var(--spacing-xxs); color: var(--color-text-primary); font-size: var(--text-micro); line-height: var(--text-micro--line-height); font-weight: var(--font-weight-medium); white-space: nowrap; font-variant-numeric: tabular-nums; position: absolute; left: 50%; translate: -50% -100%; }
.wc-bars-average { border-top: var(--border-width-default) dashed var(--color-fg-quaternary); pointer-events: none; position: absolute; inset-inline: 0px; }
.wc-bars-axis { gap: var(--spacing-xs); }
.wc-bars-axis > span { text-align: center; flex: 1 1 0%; }
@media (prefers-contrast: more){.wc-card { border-width: var(--border-width-default); --color-border-primary: var(--color-fg-quaternary); --color-border-secondary: var(--color-fg-quinary); }
}

@keyframes spin { 
  100% { transform: rotate(360deg); }
}
@keyframes comma-shiny-text-shine { 
  0% { background-position: 100% 0px; }
  100% { background-position: 0px 0px; }
}
@keyframes login-stage-enter { 
  0% { opacity: 0; transform: translateY(var(--motion-distance-login-stage-shift)) scale(var(--motion-scale-login-stage)); filter: blur(var(--motion-blur-login-stage)); }
  100% { opacity: 1; filter: blur(); transform: translateY(0px) scale(1); }
}
@keyframes login-stage-exit { 
  0% { opacity: 1; filter: blur(); transform: translateY(0px) scale(1); }
  100% { opacity: 0; transform: translateY(var(--motion-distance-login-stage-shift)) scale(var(--motion-scale-login-stage)); filter: blur(var(--motion-blur-login-stage)); }
}
@keyframes comma-chat-thinking-breathe { 
  0%, 100% { transform: scaleX(-1); }
  50% { transform: scale(-1.025, 1.025); }
}
@keyframes enter { 
  0% { opacity: var(--tw-enter-opacity,1); transform: translate3d(var(--tw-enter-translate-x,0), var(--tw-enter-translate-y,0), 0) scale3d(var(--tw-enter-scale,1), var(--tw-enter-scale,1), var(--tw-enter-scale,1)) rotate(var(--tw-enter-rotate,0)); }
}
@keyframes exit { 
  100% { opacity: var(--tw-exit-opacity,1); transform: translate3d(var(--tw-exit-translate-x,0), var(--tw-exit-translate-y,0), 0) scale3d(var(--tw-exit-scale,1), var(--tw-exit-scale,1), var(--tw-exit-scale,1)) rotate(var(--tw-exit-rotate,0)); }
}
@keyframes ping { 
  75%, 100% { opacity: 0; transform: scale(2); }
}
@keyframes pulse { 
  50% { opacity: 0.5; }
}