@xenide-io/the-old-ui-theme 0.2.3

package/src/styles/themes.css

@@ -0,0 +1,1334 @@
+/**
+ * Colour-only themes — override semantic tokens via html[data-theme].
+ * Structural tokens (--ph-radius-app, --ph-chrome-depth) live in globals.css.
+ */
+
+:root,
+[data-theme="hedgehog-light"] {
+  color-scheme: light;
+
+  --ph-canvas: hsl(75 14% 95%);
+  --ph-surface: #ffffff;
+  --ph-muted: hsl(70 16% 93%);
+  --ph-toolbar: hsl(77 13% 89%);
+  --ph-border: hsl(78 13% 85%);
+  --ph-border-strong: hsl(69 8% 65%);
+
+  --ph-text-primary: hsl(0 0% 5%);
+  --ph-text-secondary: hsl(0 0% 25%);
+  --ph-text-tertiary: hsl(0 0% 42%);
+
+  --ph-accent: hsl(19deg 100% 48%);
+  --ph-accent-hover: hsl(19deg 100% 42%);
+  --ph-blue: hsl(228deg 100% 56%);
+  --ph-violet: hsl(277deg 70% 48%);
+  --ph-purple: #8e7aee;
+
+  --ph-success: hsl(149deg 60% 40%);
+  --ph-warning: hsl(43deg 90% 40%);
+  --ph-danger: hsl(9deg 70% 48%);
+  --ph-info: hsl(217deg 90% 52%);
+
+  --ph-text-3000: #111111;
+  --ph-primary-button-face: #ffffff;
+  --ph-primary-button-border: #b17816;
+  --ph-primary-button-border-hover: #8e5b03;
+  --ph-primary-frame-bg: #eb9d2a;
+  --ph-secondary-button-bg: #f3f4ef;
+  --ph-secondary-frame-bg: #e1dddd;
+  --ph-secondary-button-border: #cccccc;
+  --ph-secondary-button-border-hover: #aaaaaa;
+
+  --ph-border-3000: #dadbd2;
+  --ph-chrome-inset-face-top: inset 0 1px 0 hsl(0deg 0% 100% / 0.84);
+  --ph-chrome-inset-face-bottom: inset 0 -1px 0 hsl(0deg 0% 0% / 0.05);
+  --ph-accent-highlight-secondary: hsla(19deg 100% 48% / 10%);
+
+  --ph-data-1: #1d4aff;
+  --ph-data-2: #621da6;
+  --ph-data-3: #42827e;
+  --ph-data-4: #ce0e74;
+  --ph-data-5: #f14f58;
+  --ph-data-6: #529a0a;
+  --ph-data-7: #fe729e;
+
+  --ph-product-session-replay: rgb(235 162 18);
+  --ph-product-product-analytics: rgb(47 128 250);
+  --ph-product-data-pipeline: rgb(46 162 211);
+  --ph-product-feature-flags: rgb(48 171 198);
+  --ph-product-experiments: rgb(182 42 217);
+  --ph-product-data-warehouse: rgb(133 103 255);
+  --ph-product-surveys: rgb(243 84 84);
+
+  --ph-select-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none' stroke='%236b6b6b' stroke-width='2.25' stroke-linecap='round' stroke-linejoin='round' viewBox='0 0 24 24'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
+}
+
+[data-theme="hedgehog-dark"] {
+  color-scheme: dark;
+
+  --ph-canvas: hsl(220 12% 9%);
+  --ph-surface: hsl(220 10% 13%);
+  --ph-muted: hsl(220 9% 16%);
+  --ph-toolbar: hsl(220 8% 19%);
+  --ph-border: hsl(220 7% 24%);
+  --ph-border-strong: hsl(220 6% 38%);
+
+  --ph-text-primary: hsl(0 0% 96%);
+  --ph-text-secondary: hsl(0 0% 78%);
+  --ph-text-tertiary: hsl(0 0% 58%);
+
+  --ph-accent: hsl(19deg 100% 52%);
+  --ph-accent-hover: hsl(19deg 100% 58%);
+  --ph-blue: hsl(228deg 100% 68%);
+  --ph-violet: hsl(277deg 65% 62%);
+  --ph-purple: #a89af0;
+
+  --ph-success: hsl(149deg 55% 48%);
+  --ph-warning: hsl(43deg 85% 52%);
+  --ph-danger: hsl(9deg 65% 55%);
+  --ph-info: hsl(217deg 85% 58%);
+
+  --ph-text-3000: hsl(0 0% 96%);
+  --ph-primary-button-face: hsl(220 10% 15%);
+  --ph-primary-button-border: #c4861f;
+  --ph-primary-button-border-hover: #eb9d2a;
+  --ph-primary-frame-bg: #eb9d2a;
+  --ph-secondary-button-bg: hsl(220 8% 20%);
+  --ph-secondary-frame-bg: hsl(220 7% 26%);
+  --ph-secondary-button-border: hsl(220 6% 32%);
+  --ph-secondary-button-border-hover: hsl(220 5% 42%);
+
+  --ph-border-3000: hsl(220 7% 20%);
+  --ph-chrome-inset-face-top: inset 0 1px 0 hsl(0deg 0% 100% / 0.08);
+  --ph-chrome-inset-face-bottom: inset 0 -1px 0 hsl(0deg 0% 0% / 0.35);
+  --ph-accent-highlight-secondary: hsla(19deg 100% 52% / 14%);
+
+  --ph-select-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none' stroke='%23a3a3a3' stroke-width='2.25' stroke-linecap='round' stroke-linejoin='round' viewBox='0 0 24 24'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
+}
+
+[data-theme="catppuccin-light"] {
+  color-scheme: light;
+
+  --ph-canvas: #eff1f5;
+  --ph-surface: #ffffff;
+  --ph-muted: #e6e9ef;
+  --ph-toolbar: #dce0e8;
+  --ph-border: #ccd0da;
+  --ph-border-strong: #9ca0b0;
+
+  --ph-text-primary: #4c4f69;
+  --ph-text-secondary: #6c6f85;
+  --ph-text-tertiary: #9ca0b0;
+
+  --ph-accent: #8839ef;
+  --ph-accent-hover: #7c32d9;
+  --ph-blue: #1e66f5;
+  --ph-violet: #8839ef;
+  --ph-purple: #8839ef;
+
+  --ph-success: #40a02b;
+  --ph-warning: #df8e1d;
+  --ph-danger: #d20f39;
+  --ph-info: #1e66f5;
+
+  --ph-text-3000: #4c4f69;
+  --ph-primary-button-face: #ffffff;
+  --ph-primary-button-border: #7c32d9;
+  --ph-primary-button-border-hover: #6b28c4;
+  --ph-primary-frame-bg: #cba6f7;
+  --ph-secondary-button-bg: #e6e9ef;
+  --ph-secondary-frame-bg: #dce0e8;
+  --ph-secondary-button-border: #ccd0da;
+  --ph-secondary-button-border-hover: #9ca0b0;
+
+  --ph-border-3000: #ccd0da;
+  --ph-chrome-inset-face-top: inset 0 1px 0 hsl(0deg 0% 100% / 0.9);
+  --ph-chrome-inset-face-bottom: inset 0 -1px 0 hsl(0deg 0% 0% / 0.04);
+  --ph-accent-highlight-secondary: hsla(266deg 85% 58% / 12%);
+
+  --ph-data-1: #1e66f5;
+  --ph-data-2: #8839ef;
+  --ph-data-3: #179299;
+  --ph-data-4: #d20f39;
+  --ph-data-5: #fe640b;
+  --ph-data-6: #40a02b;
+  --ph-data-7: #ea76cb;
+
+  --ph-select-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none' stroke='%239ca0b0' stroke-width='2.25' stroke-linecap='round' stroke-linejoin='round' viewBox='0 0 24 24'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
+}
+
+[data-theme="catppuccin-dark"] {
+  color-scheme: dark;
+
+  --ph-canvas: #1e1e2e;
+  --ph-surface: #181825;
+  --ph-muted: #181825;
+  --ph-toolbar: #11111b;
+  --ph-border: #45475a;
+  --ph-border-strong: #585b70;
+
+  --ph-text-primary: #cdd6f4;
+  --ph-text-secondary: #a6adc8;
+  --ph-text-tertiary: #7f849c;
+
+  --ph-accent: #cba6f7;
+  --ph-accent-hover: #d9b8ff;
+  --ph-blue: #89b4fa;
+  --ph-violet: #cba6f7;
+  --ph-purple: #cba6f7;
+
+  --ph-success: #a6e3a1;
+  --ph-warning: #f9e2af;
+  --ph-danger: #f38ba8;
+  --ph-info: #89b4fa;
+
+  --ph-text-3000: #cdd6f4;
+  --ph-primary-button-face: #181825;
+  --ph-primary-button-border: #b4befe;
+  --ph-primary-button-border-hover: #cba6f7;
+  --ph-primary-frame-bg: #fab387;
+  --ph-secondary-button-bg: #313244;
+  --ph-secondary-frame-bg: #45475a;
+  --ph-secondary-button-border: #585b70;
+  --ph-secondary-button-border-hover: #6c7086;
+
+  --ph-border-3000: #313244;
+  --ph-chrome-inset-face-top: inset 0 1px 0 hsl(0deg 0% 100% / 0.07);
+  --ph-chrome-inset-face-bottom: inset 0 -1px 0 hsl(0deg 0% 0% / 0.3);
+  --ph-accent-highlight-secondary: hsla(267deg 84% 81% / 14%);
+
+  --ph-data-1: #89b4fa;
+  --ph-data-2: #cba6f7;
+  --ph-data-3: #94e2d5;
+  --ph-data-4: #f38ba8;
+  --ph-data-5: #fab387;
+  --ph-data-6: #a6e3a1;
+  --ph-data-7: #f5c2e7;
+
+  --ph-select-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none' stroke='%237f849c' stroke-width='2.25' stroke-linecap='round' stroke-linejoin='round' viewBox='0 0 24 24'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
+}
+
+[data-theme="sheets"] {
+  color-scheme: light;
+
+  --ph-canvas: #f3f2f1;
+  --ph-surface: #ffffff;
+  --ph-muted: #edebe9;
+  --ph-toolbar: #e1dfdd;
+  --ph-border: #d2d0ce;
+  --ph-border-strong: #a19f9d;
+
+  --ph-text-primary: #323130;
+  --ph-text-secondary: #605e5c;
+  --ph-text-tertiary: #8a8886;
+
+  --ph-accent: #217346;
+  --ph-accent-hover: #185c37;
+  --ph-blue: #185abd;
+  --ph-violet: #5c2d91;
+  --ph-purple: #8764b8;
+
+  --ph-success: #217346;
+  --ph-warning: #ca5010;
+  --ph-danger: #a4262c;
+  --ph-info: #185abd;
+
+  --ph-text-3000: #323130;
+  --ph-primary-button-face: #ffffff;
+  --ph-primary-button-border: #185c37;
+  --ph-primary-button-border-hover: #134a2c;
+  --ph-primary-frame-bg: #2d9660;
+  --ph-secondary-button-bg: #f3f2f1;
+  --ph-secondary-frame-bg: #e1dfdd;
+  --ph-secondary-button-border: #c8c6c4;
+  --ph-secondary-button-border-hover: #a19f9d;
+
+  --ph-border-3000: #d2d0ce;
+  --ph-chrome-inset-face-top: inset 0 1px 0 hsl(0deg 0% 100% / 0.88);
+  --ph-chrome-inset-face-bottom: inset 0 -1px 0 hsl(0deg 0% 0% / 0.05);
+  --ph-accent-highlight-secondary: hsla(152deg 61% 29% / 10%);
+
+  --ph-data-1: #185abd;
+  --ph-data-2: #217346;
+  --ph-data-3: #498205;
+  --ph-data-4: #a4262c;
+  --ph-data-5: #ca5010;
+  --ph-data-6: #0078d4;
+  --ph-data-7: #8764b8;
+
+  --ph-product-session-replay: #217346;
+  --ph-product-product-analytics: #185abd;
+  --ph-product-data-pipeline: #0078d4;
+  --ph-product-feature-flags: #498205;
+  --ph-product-experiments: #8764b8;
+  --ph-product-data-warehouse: #5c2d91;
+  --ph-product-surveys: #a4262c;
+
+  --ph-select-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none' stroke='%238a8886' stroke-width='2.25' stroke-linecap='round' stroke-linejoin='round' viewBox='0 0 24 24'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
+}
+
+[data-theme="socials"] {
+  color-scheme: light;
+
+  --ph-canvas: #f0f2f5;
+  --ph-surface: #ffffff;
+  --ph-muted: #e4e6eb;
+  --ph-toolbar: #d8dadf;
+  --ph-border: #ced0d4;
+  --ph-border-strong: #8a8d91;
+
+  --ph-text-primary: #050505;
+  --ph-text-secondary: #65676b;
+  --ph-text-tertiary: #8a8d91;
+
+  --ph-accent: #1877f2;
+  --ph-accent-hover: #166fe5;
+  --ph-blue: #1877f2;
+  --ph-violet: #7b64ff;
+  --ph-purple: #7b64ff;
+
+  --ph-success: #31a24c;
+  --ph-warning: #f7b928;
+  --ph-danger: #e41e3f;
+  --ph-info: #1877f2;
+
+  --ph-text-3000: #050505;
+  --ph-primary-button-face: #ffffff;
+  --ph-primary-button-border: #145dbf;
+  --ph-primary-button-border-hover: #0f4da8;
+  --ph-primary-frame-bg: #4599ff;
+  --ph-secondary-button-bg: #e4e6eb;
+  --ph-secondary-frame-bg: #d8dadf;
+  --ph-secondary-button-border: #bcc0c4;
+  --ph-secondary-button-border-hover: #8a8d91;
+
+  --ph-border-3000: #ced0d4;
+  --ph-chrome-inset-face-top: inset 0 1px 0 hsl(0deg 0% 100% / 0.9);
+  --ph-chrome-inset-face-bottom: inset 0 -1px 0 hsl(0deg 0% 0% / 0.04);
+  --ph-accent-highlight-secondary: hsla(214deg 89% 52% / 10%);
+
+  --ph-data-1: #1877f2;
+  --ph-data-2: #7b64ff;
+  --ph-data-3: #31a24c;
+  --ph-data-4: #e41e3f;
+  --ph-data-5: #f7b928;
+  --ph-data-6: #00a400;
+  --ph-data-7: #f5533d;
+
+  --ph-select-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none' stroke='%238a8d91' stroke-width='2.25' stroke-linecap='round' stroke-linejoin='round' viewBox='0 0 24 24'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
+}
+
+/* xenide.io — from ../website/app/globals.css html:not(.dark) */
+[data-theme="xenide-light"] {
+  color-scheme: light;
+
+  --ph-canvas: #fafafa;
+  --ph-surface: #ffffff;
+  --ph-muted: #f5f5f5;
+  --ph-toolbar: #efefef;
+  --ph-border: #e5e5e5;
+  --ph-border-strong: #737373;
+
+  --ph-text-primary: #171717;
+  --ph-text-secondary: #525252;
+  --ph-text-tertiary: #737373;
+
+  --ph-accent: #217346;
+  --ph-accent-hover: #185c37;
+  --ph-blue: #10b981;
+  --ph-violet: #7c3aed;
+  --ph-purple: #7c3aed;
+
+  --ph-success: #10b981;
+  --ph-warning: #d97706;
+  --ph-danger: #ef4444;
+  --ph-info: #7c3aed;
+
+  --ph-text-3000: #171717;
+  --ph-primary-button-face: #ffffff;
+  --ph-primary-button-border: #185c37;
+  --ph-primary-button-border-hover: #134a2c;
+  --ph-primary-frame-bg: #2ead5f;
+  --ph-secondary-button-bg: #f5f5f5;
+  --ph-secondary-frame-bg: #ebebeb;
+  --ph-secondary-button-border: #e5e5e5;
+  --ph-secondary-button-border-hover: #7c3aed;
+
+  --ph-border-3000: #e5e5e5;
+  --ph-chrome-inset-face-top: inset 0 1px 0 hsl(0deg 0% 100% / 0.9);
+  --ph-chrome-inset-face-bottom: inset 0 -1px 0 hsl(0deg 0% 0% / 0.04);
+  --ph-accent-highlight-secondary: rgba(124, 58, 237, 0.14);
+
+  --ph-data-1: #217346;
+  --ph-data-2: #7c3aed;
+  --ph-data-3: #10b981;
+  --ph-data-4: #ef4444;
+  --ph-data-5: #9f7aea;
+  --ph-data-6: #2ead5f;
+  --ph-data-7: #5b21b6;
+
+  --ph-product-session-replay: #217346;
+  --ph-product-product-analytics: #7c3aed;
+  --ph-product-data-pipeline: #10b981;
+  --ph-product-feature-flags: #2ead5f;
+  --ph-product-experiments: #9f7aea;
+  --ph-product-data-warehouse: #5b21b6;
+  --ph-product-surveys: #ef4444;
+
+  --ph-select-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none' stroke='%23737373' stroke-width='2.25' stroke-linecap='round' stroke-linejoin='round' viewBox='0 0 24 24'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
+}
+
+/* xenide.io — from ../website/app/globals.css html.dark */
+[data-theme="xenide-dark"] {
+  color-scheme: dark;
+
+  --ph-canvas: #0a0a0f;
+  --ph-surface: #111118;
+  --ph-muted: #16161f;
+  --ph-toolbar: #1c1c26;
+  --ph-border: #2e2e3a;
+  --ph-border-strong: #71717a;
+
+  --ph-text-primary: #f4f4f5;
+  --ph-text-secondary: #a1a1aa;
+  --ph-text-tertiary: #71717a;
+
+  --ph-accent: #34d399;
+  --ph-accent-hover: #6ee7b7;
+  --ph-blue: #22d3ee;
+  --ph-violet: #a78bfa;
+  --ph-purple: #a78bfa;
+
+  --ph-success: #34d399;
+  --ph-warning: #fbbf24;
+  --ph-danger: #dc2626;
+  --ph-info: #a78bfa;
+
+  --ph-text-3000: #f4f4f5;
+  --ph-primary-button-face: #111118;
+  --ph-primary-button-border: #217346;
+  --ph-primary-button-border-hover: #34d399;
+  --ph-primary-frame-bg: #34d399;
+  --ph-secondary-button-bg: #16161f;
+  --ph-secondary-frame-bg: #2e2e3a;
+  --ph-secondary-button-border: #2e2e3a;
+  --ph-secondary-button-border-hover: #7c3aed;
+
+  --ph-border-3000: #25252f;
+  --ph-chrome-inset-face-top: inset 0 1px 0 hsl(0deg 0% 100% / 0.06);
+  --ph-chrome-inset-face-bottom: inset 0 -1px 0 hsl(0deg 0% 0% / 0.4);
+  --ph-accent-highlight-secondary: rgba(167, 139, 250, 0.14);
+
+  --ph-data-1: #34d399;
+  --ph-data-2: #a78bfa;
+  --ph-data-3: #22d3ee;
+  --ph-data-4: #f87171;
+  --ph-data-5: #c4b5fd;
+  --ph-data-6: #6ee7b7;
+  --ph-data-7: #7c3aed;
+
+  --ph-product-session-replay: #34d399;
+  --ph-product-product-analytics: #a78bfa;
+  --ph-product-data-pipeline: #22d3ee;
+  --ph-product-feature-flags: #6ee7b7;
+  --ph-product-experiments: #c4b5fd;
+  --ph-product-data-warehouse: #7c3aed;
+  --ph-product-surveys: #f87171;
+
+  --ph-select-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none' stroke='%2371717a' stroke-width='2.25' stroke-linecap='round' stroke-linejoin='round' viewBox='0 0 24 24'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
+}
+
+[data-theme="bikini-bottom"] {
+  color-scheme: light;
+
+  /* Ocean canvas — character colours stay on accents, not surfaces */
+  --ph-canvas: #dceefb;
+  --ph-surface: #ffffff;
+  --ph-muted: #eef6fc;
+  --ph-toolbar: #e3f2fd;
+  --ph-border: #90caf9;
+  --ph-border-strong: #1565c0;
+
+  --ph-text-primary: #0d2137;
+  --ph-text-secondary: #1e4976;
+  --ph-text-tertiary: #4a6fa5;
+
+  /* SpongeBob yellow */
+  --ph-accent: #f5b800;
+  --ph-accent-hover: #e6a800;
+  --ph-blue: #29b6f6;
+  /* Patrick pink */
+  --ph-violet: #e91e8c;
+  --ph-purple: #e91e8c;
+
+  /* Plankton green */
+  --ph-success: #43a047;
+  /* Sandy tan */
+  --ph-warning: #d4a574;
+  --ph-danger: #e91e8c;
+  --ph-info: #29b6f6;
+
+  --ph-text-3000: #0d2137;
+  --ph-primary-button-face: #ffffff;
+  --ph-primary-button-border: #c68400;
+  --ph-primary-button-border-hover: #a36f00;
+  --ph-primary-frame-bg: #ffc107;
+  --ph-secondary-button-bg: #ffffff;
+  --ph-secondary-frame-bg: #ffcdd2;
+  --ph-secondary-button-border: #e91e8c;
+  --ph-secondary-button-border-hover: #c2185b;
+
+  --ph-border-3000: #90caf9;
+  --ph-chrome-inset-face-top: inset 0 1px 0 hsl(0deg 0% 100% / 0.95);
+  --ph-chrome-inset-face-bottom: inset 0 -1px 0 hsl(0deg 0% 0% / 0.06);
+  --ph-accent-highlight-secondary: hsla(45deg 100% 48% / 14%);
+
+  --ph-data-1: #ffc107;
+  --ph-data-2: #e91e8c;
+  --ph-data-3: #d4a574;
+  --ph-data-4: #43a047;
+  --ph-data-5: #29b6f6;
+  --ph-data-6: #ff9800;
+  --ph-data-7: #7b1fa2;
+
+  --ph-product-session-replay: #ffc107;
+  --ph-product-product-analytics: #29b6f6;
+  --ph-product-data-pipeline: #0288d1;
+  --ph-product-feature-flags: #43a047;
+  --ph-product-experiments: #e91e8c;
+  --ph-product-data-warehouse: #d4a574;
+  --ph-product-surveys: #7b1fa2;
+
+  --ph-select-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none' stroke='%234a6fa5' stroke-width='2.25' stroke-linecap='round' stroke-linejoin='round' viewBox='0 0 24 24'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
+}
+
+[data-theme="turtletime"] {
+  color-scheme: light;
+
+  --ph-canvas: hsl(75 14% 95%);
+  --ph-surface: #ffffff;
+  --ph-muted: hsl(70 16% 93%);
+  --ph-toolbar: hsl(77 13% 89%);
+  --ph-border: hsl(78 13% 85%);
+  --ph-border-strong: hsl(69 8% 65%);
+
+  --ph-text-primary: hsl(0 0% 5%);
+  --ph-text-secondary: hsl(0 0% 25%);
+  --ph-text-tertiary: hsl(0 0% 42%);
+
+  --ph-accent: #1f6f43;
+  --ph-accent-hover: #185c37;
+  --ph-blue: #2f7f73;
+  --ph-violet: #9a6a12;
+  --ph-purple: #6f8a2c;
+
+  --ph-success: #1f6f43;
+  --ph-warning: #d97800;
+  --ph-danger: #b24b2c;
+  --ph-info: #2f7f73;
+
+  --ph-text-3000: hsl(0 0% 5%);
+  --ph-primary-button-face: #ffffff;
+  --ph-primary-button-border: #185c37;
+  --ph-primary-button-border-hover: #12462b;
+  --ph-primary-frame-bg: #e58a12;
+  --ph-secondary-button-bg: #f3f4ef;
+  --ph-secondary-frame-bg: #e1dddd;
+  --ph-secondary-button-border: #cccccc;
+  --ph-secondary-button-border-hover: #1f6f43;
+
+  --ph-border-3000: #dadbd2;
+  --ph-chrome-inset-face-top: inset 0 1px 0 hsl(0deg 0% 100% / 0.84);
+  --ph-chrome-inset-face-bottom: inset 0 -1px 0 hsl(0deg 0% 0% / 0.05);
+  --ph-accent-highlight-secondary: hsla(148deg 56% 28% / 12%);
+
+  --ph-data-1: #1f6f43;
+  --ph-data-2: #d97800;
+  --ph-data-3: #2f7f73;
+  --ph-data-4: #b24b2c;
+  --ph-data-5: #e58a12;
+  --ph-data-6: #6f8a2c;
+  --ph-data-7: #9a6a12;
+
+  --ph-product-session-replay: #d97800;
+  --ph-product-product-analytics: #1f6f43;
+  --ph-product-data-pipeline: #2f7f73;
+  --ph-product-feature-flags: #6f8a2c;
+  --ph-product-experiments: #e58a12;
+  --ph-product-data-warehouse: #9a6a12;
+  --ph-product-surveys: #b24b2c;
+
+  --ph-select-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none' stroke='%236b6b6b' stroke-width='2.25' stroke-linecap='round' stroke-linejoin='round' viewBox='0 0 24 24'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
+}
+
+/* Microsoft OneNote — notebook purple (#7719AA family) */
+[data-theme="note"] {
+  color-scheme: light;
+
+  --ph-canvas: #f8f6fc;
+  --ph-surface: #ffffff;
+  --ph-muted: #f3eff9;
+  --ph-toolbar: #ebe4f5;
+  --ph-border: #ddd0ee;
+  --ph-border-strong: #9b7bb8;
+
+  --ph-text-primary: #2d1b3d;
+  --ph-text-secondary: #5c4a6e;
+  --ph-text-tertiary: #857396;
+
+  --ph-accent: #7719aa;
+  --ph-accent-hover: #5f1488;
+  --ph-blue: #185abd;
+  --ph-violet: #7719aa;
+  --ph-purple: #93278f;
+
+  --ph-success: #107c41;
+  --ph-warning: #ca5010;
+  --ph-danger: #a4262c;
+  --ph-info: #185abd;
+
+  --ph-text-3000: #2d1b3d;
+  --ph-primary-button-face: #ffffff;
+  --ph-primary-button-border: #5f1488;
+  --ph-primary-button-border-hover: #4a1070;
+  --ph-primary-frame-bg: #b146c2;
+  --ph-secondary-button-bg: #f3eff9;
+  --ph-secondary-frame-bg: #ebe4f5;
+  --ph-secondary-button-border: #ddd0ee;
+  --ph-secondary-button-border-hover: #93278f;
+
+  --ph-border-3000: #ddd0ee;
+  --ph-chrome-inset-face-top: inset 0 1px 0 hsl(0deg 0% 100% / 0.92);
+  --ph-chrome-inset-face-bottom: inset 0 -1px 0 hsl(0deg 0% 0% / 0.05);
+  --ph-accent-highlight-secondary: hsla(279deg 74% 38% / 10%);
+
+  --ph-data-1: #7719aa;
+  --ph-data-2: #93278f;
+  --ph-data-3: #185abd;
+  --ph-data-4: #a4262c;
+  --ph-data-5: #ca5010;
+  --ph-data-6: #107c41;
+  --ph-data-7: #b146c2;
+
+  --ph-product-session-replay: #7719aa;
+  --ph-product-product-analytics: #185abd;
+  --ph-product-data-pipeline: #107c41;
+  --ph-product-feature-flags: #93278f;
+  --ph-product-experiments: #b146c2;
+  --ph-product-data-warehouse: #5f1488;
+  --ph-product-surveys: #a4262c;
+
+  --ph-select-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none' stroke='%23857396' stroke-width='2.25' stroke-linecap='round' stroke-linejoin='round' viewBox='0 0 24 24'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
+}
+
+/* Microsoft PowerPoint — ribbon orange-red (#D24726) */
+[data-theme="presentation"] {
+  color-scheme: light;
+
+  --ph-canvas: #f3f2f1;
+  --ph-surface: #ffffff;
+  --ph-muted: #edebe9;
+  --ph-toolbar: #e1dfdd;
+  --ph-border: #d2d0ce;
+  --ph-border-strong: #a19f9d;
+
+  --ph-text-primary: #323130;
+  --ph-text-secondary: #605e5c;
+  --ph-text-tertiary: #8a8886;
+
+  --ph-accent: #d24726;
+  --ph-accent-hover: #b93d20;
+  --ph-blue: #185abd;
+  --ph-violet: #5c2d91;
+  --ph-purple: #8764b8;
+
+  --ph-success: #107c41;
+  --ph-warning: #ca5010;
+  --ph-danger: #a4262c;
+  --ph-info: #185abd;
+
+  --ph-text-3000: #323130;
+  --ph-primary-button-face: #ffffff;
+  --ph-primary-button-border: #a53b1f;
+  --ph-primary-button-border-hover: #8f3219;
+  --ph-primary-frame-bg: #e8654a;
+  --ph-secondary-button-bg: #f3f2f1;
+  --ph-secondary-frame-bg: #e1dfdd;
+  --ph-secondary-button-border: #c8c6c4;
+  --ph-secondary-button-border-hover: #a19f9d;
+
+  --ph-border-3000: #d2d0ce;
+  --ph-chrome-inset-face-top: inset 0 1px 0 hsl(0deg 0% 100% / 0.88);
+  --ph-chrome-inset-face-bottom: inset 0 -1px 0 hsl(0deg 0% 0% / 0.05);
+  --ph-accent-highlight-secondary: hsla(11deg 70% 49% / 10%);
+
+  --ph-data-1: #d24726;
+  --ph-data-2: #185abd;
+  --ph-data-3: #107c41;
+  --ph-data-4: #a4262c;
+  --ph-data-5: #ca5010;
+  --ph-data-6: #8764b8;
+  --ph-data-7: #0078d4;
+
+  --ph-product-session-replay: #d24726;
+  --ph-product-product-analytics: #185abd;
+  --ph-product-data-pipeline: #0078d4;
+  --ph-product-feature-flags: #107c41;
+  --ph-product-experiments: #8764b8;
+  --ph-product-data-warehouse: #5c2d91;
+  --ph-product-surveys: #a4262c;
+
+  --ph-select-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none' stroke='%238a8886' stroke-width='2.25' stroke-linecap='round' stroke-linejoin='round' viewBox='0 0 24 24'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
+}
+
+[data-theme="sheets-dark"] {
+  color-scheme: dark;
+
+  --ph-canvas: #1b1a19;
+  --ph-surface: #252423;
+  --ph-muted: #2d2c2b;
+  --ph-toolbar: #323130;
+  --ph-border: #484644;
+  --ph-border-strong: #797775;
+
+  --ph-text-primary: #f3f2f1;
+  --ph-text-secondary: #c8c6c4;
+  --ph-text-tertiary: #a19f9d;
+
+  --ph-accent: #33a867;
+  --ph-accent-hover: #4abe7a;
+  --ph-blue: #4f9ff5;
+  --ph-violet: #a78bfa;
+  --ph-purple: #8764b8;
+
+  --ph-success: #33a867;
+  --ph-warning: #e67e22;
+  --ph-danger: #f87171;
+  --ph-info: #4f9ff5;
+
+  --ph-text-3000: #f3f2f1;
+  --ph-primary-button-face: #252423;
+  --ph-primary-button-border: #217346;
+  --ph-primary-button-border-hover: #33a867;
+  --ph-primary-frame-bg: #33a867;
+  --ph-secondary-button-bg: #2d2c2b;
+  --ph-secondary-frame-bg: #484644;
+  --ph-secondary-button-border: #605e5c;
+  --ph-secondary-button-border-hover: #797775;
+
+  --ph-border-3000: #323130;
+  --ph-chrome-inset-face-top: inset 0 1px 0 hsl(0deg 0% 100% / 0.07);
+  --ph-chrome-inset-face-bottom: inset 0 -1px 0 hsl(0deg 0% 0% / 0.35);
+  --ph-accent-highlight-secondary: hsla(146deg 55% 45% / 14%);
+
+  --ph-select-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none' stroke='%23a19f9d' stroke-width='2.25' stroke-linecap='round' stroke-linejoin='round' viewBox='0 0 24 24'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
+}
+
+[data-theme="socials-dark"] {
+  color-scheme: dark;
+
+  --ph-canvas: #18191a;
+  --ph-surface: #242526;
+  --ph-muted: #2f3031;
+  --ph-toolbar: #3a3b3c;
+  --ph-border: #3e4042;
+  --ph-border-strong: #b0b3b8;
+
+  --ph-text-primary: #e4e6eb;
+  --ph-text-secondary: #b0b3b8;
+  --ph-text-tertiary: #8a8d91;
+
+  --ph-accent: #2d88ff;
+  --ph-accent-hover: #4599ff;
+  --ph-blue: #2d88ff;
+  --ph-violet: #9d84ff;
+  --ph-purple: #9d84ff;
+
+  --ph-success: #42b72a;
+  --ph-warning: #f7b928;
+  --ph-danger: #f02849;
+  --ph-info: #2d88ff;
+
+  --ph-text-3000: #e4e6eb;
+  --ph-primary-button-face: #242526;
+  --ph-primary-button-border: #1877f2;
+  --ph-primary-button-border-hover: #2d88ff;
+  --ph-primary-frame-bg: #4599ff;
+  --ph-secondary-button-bg: #3a3b3c;
+  --ph-secondary-frame-bg: #4e4f50;
+  --ph-secondary-button-border: #3e4042;
+  --ph-secondary-button-border-hover: #b0b3b8;
+
+  --ph-border-3000: #3e4042;
+  --ph-chrome-inset-face-top: inset 0 1px 0 hsl(0deg 0% 100% / 0.06);
+  --ph-chrome-inset-face-bottom: inset 0 -1px 0 hsl(0deg 0% 0% / 0.35);
+  --ph-accent-highlight-secondary: hsla(214deg 89% 58% / 14%);
+
+  --ph-select-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none' stroke='%23b0b3b8' stroke-width='2.25' stroke-linecap='round' stroke-linejoin='round' viewBox='0 0 24 24'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
+}
+
+[data-theme="chats-light"] {
+  color-scheme: light;
+
+  --ph-canvas: #f8f8f8;
+  --ph-surface: #ffffff;
+  --ph-muted: #f4f4f4;
+  --ph-toolbar: #ececec;
+  --ph-border: #dddddd;
+  --ph-border-strong: #868686;
+
+  --ph-text-primary: #1d1c1d;
+  --ph-text-secondary: #616061;
+  --ph-text-tertiary: #868686;
+
+  --ph-accent: #611f69;
+  --ph-accent-hover: #4a154b;
+  --ph-blue: #36c5f0;
+  --ph-violet: #611f69;
+  --ph-purple: #611f69;
+
+  --ph-success: #2eb67d;
+  --ph-warning: #ecb22e;
+  --ph-danger: #e01e5a;
+  --ph-info: #36c5f0;
+
+  --ph-text-3000: #1d1c1d;
+  --ph-primary-button-face: #ffffff;
+  --ph-primary-button-border: #4a154b;
+  --ph-primary-button-border-hover: #350d36;
+  --ph-primary-frame-bg: #611f69;
+  --ph-secondary-button-bg: #f4f4f4;
+  --ph-secondary-frame-bg: #ececec;
+  --ph-secondary-button-border: #dddddd;
+  --ph-secondary-button-border-hover: #611f69;
+
+  --ph-border-3000: #dddddd;
+  --ph-chrome-inset-face-top: inset 0 1px 0 hsl(0deg 0% 100% / 0.92);
+  --ph-chrome-inset-face-bottom: inset 0 -1px 0 hsl(0deg 0% 0% / 0.05);
+  --ph-accent-highlight-secondary: hsla(295deg 52% 33% / 10%);
+
+  --ph-data-1: #611f69;
+  --ph-data-2: #2eb67d;
+  --ph-data-3: #36c5f0;
+  --ph-data-4: #e01e5a;
+  --ph-data-5: #ecb22e;
+  --ph-data-6: #4a154b;
+  --ph-data-7: #1264a3;
+
+  --ph-product-session-replay: #611f69;
+  --ph-product-product-analytics: #36c5f0;
+  --ph-product-data-pipeline: #2eb67d;
+  --ph-product-feature-flags: #ecb22e;
+  --ph-product-experiments: #e01e5a;
+  --ph-product-data-warehouse: #4a154b;
+  --ph-product-surveys: #1264a3;
+
+  --ph-select-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none' stroke='%23868686' stroke-width='2.25' stroke-linecap='round' stroke-linejoin='round' viewBox='0 0 24 24'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
+}
+
+[data-theme="chats-dark"] {
+  color-scheme: dark;
+
+  --ph-canvas: #1a1d21;
+  --ph-surface: #222529;
+  --ph-muted: #2c2d30;
+  --ph-toolbar: #35373b;
+  --ph-border: #565856;
+  --ph-border-strong: #868686;
+
+  --ph-text-primary: #d1d2d3;
+  --ph-text-secondary: #ababad;
+  --ph-text-tertiary: #868686;
+
+  --ph-accent: #2eb67d;
+  --ph-accent-hover: #3ecf8e;
+  --ph-blue: #36c5f0;
+  --ph-violet: #ab7aad;
+  --ph-purple: #611f69;
+
+  --ph-success: #2eb67d;
+  --ph-warning: #ecb22e;
+  --ph-danger: #e01e5a;
+  --ph-info: #1d9bd1;
+
+  --ph-text-3000: #d1d2d3;
+  --ph-primary-button-face: #222529;
+  --ph-primary-button-border: #217a53;
+  --ph-primary-button-border-hover: #2eb67d;
+  --ph-primary-frame-bg: #2eb67d;
+  --ph-secondary-button-bg: #2c2d30;
+  --ph-secondary-frame-bg: #565856;
+  --ph-secondary-button-border: #565856;
+  --ph-secondary-button-border-hover: #ab7aad;
+
+  --ph-border-3000: #35373b;
+  --ph-chrome-inset-face-top: inset 0 1px 0 hsl(0deg 0% 100% / 0.06);
+  --ph-chrome-inset-face-bottom: inset 0 -1px 0 hsl(0deg 0% 0% / 0.35);
+  --ph-accent-highlight-secondary: hsla(156deg 61% 45% / 14%);
+
+  --ph-data-1: #2eb67d;
+  --ph-data-2: #36c5f0;
+  --ph-data-3: #ecb22e;
+  --ph-data-4: #e01e5a;
+  --ph-data-5: #ab7aad;
+  --ph-data-6: #1d9bd1;
+  --ph-data-7: #611f69;
+
+  --ph-product-session-replay: #2eb67d;
+  --ph-product-product-analytics: #36c5f0;
+  --ph-product-data-pipeline: #1d9bd1;
+  --ph-product-feature-flags: #ecb22e;
+  --ph-product-experiments: #e01e5a;
+  --ph-product-data-warehouse: #611f69;
+  --ph-product-surveys: #ab7aad;
+
+  --ph-select-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none' stroke='%23ababad' stroke-width='2.25' stroke-linecap='round' stroke-linejoin='round' viewBox='0 0 24 24'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
+}
+
+[data-theme="bikini-bottom-dark"] {
+  color-scheme: dark;
+
+  --ph-canvas: #0a1628;
+  --ph-surface: #122338;
+  --ph-muted: #1a3050;
+  --ph-toolbar: #1e3a5f;
+  --ph-border: #2a5080;
+  --ph-border-strong: #5c8fd4;
+
+  --ph-text-primary: #e8f4fc;
+  --ph-text-secondary: #a8cce8;
+  --ph-text-tertiary: #6a9fc9;
+
+  --ph-accent: #ffc107;
+  --ph-accent-hover: #ffd54f;
+  --ph-blue: #4fc3f7;
+  --ph-violet: #ff6b9d;
+  --ph-purple: #ff6b9d;
+
+  --ph-success: #66bb6a;
+  --ph-warning: #d4a574;
+  --ph-danger: #ff6b9d;
+  --ph-info: #29b6f6;
+
+  --ph-text-3000: #e8f4fc;
+  --ph-primary-button-face: #122338;
+  --ph-primary-button-border: #c68400;
+  --ph-primary-button-border-hover: #ffc107;
+  --ph-primary-frame-bg: #ffc107;
+  --ph-secondary-button-bg: #1a3050;
+  --ph-secondary-frame-bg: #2a5080;
+  --ph-secondary-button-border: #ff6b9d;
+  --ph-secondary-button-border-hover: #ff8fab;
+
+  --ph-border-3000: #1e3a5f;
+  --ph-chrome-inset-face-top: inset 0 1px 0 hsl(0deg 0% 100% / 0.08);
+  --ph-chrome-inset-face-bottom: inset 0 -1px 0 hsl(0deg 0% 0% / 0.35);
+  --ph-accent-highlight-secondary: hsla(45deg 100% 51% / 14%);
+
+  --ph-data-1: #ffc107;
+  --ph-data-2: #ff6b9d;
+  --ph-data-3: #d4a574;
+  --ph-data-4: #66bb6a;
+  --ph-data-5: #4fc3f7;
+  --ph-data-6: #ff9800;
+  --ph-data-7: #ab47bc;
+
+  --ph-select-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none' stroke='%236a9fc9' stroke-width='2.25' stroke-linecap='round' stroke-linejoin='round' viewBox='0 0 24 24'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
+}
+
+[data-theme="turtletime-dark"] {
+  color-scheme: dark;
+
+  --ph-canvas: #0d120f;
+  --ph-surface: #151b17;
+  --ph-muted: #1c241f;
+  --ph-toolbar: #243027;
+  --ph-border: #334538;
+  --ph-border-strong: #66806b;
+
+  --ph-text-primary: #eef4e9;
+  --ph-text-secondary: #c7d5c0;
+  --ph-text-tertiary: #91a28a;
+
+  --ph-accent: #3f8f57;
+  --ph-accent-hover: #55a96b;
+  --ph-blue: #57b3a3;
+  --ph-violet: #d4861a;
+  --ph-purple: #8fa64a;
+
+  --ph-success: #55a96b;
+  --ph-warning: #e58a12;
+  --ph-danger: #e06a49;
+  --ph-info: #57b3a3;
+
+  --ph-text-3000: #eef4e9;
+  --ph-primary-button-face: #151b17;
+  --ph-primary-button-border: #2d6f43;
+  --ph-primary-button-border-hover: #55a96b;
+  --ph-primary-frame-bg: #d4861a;
+  --ph-secondary-button-bg: #1c241f;
+  --ph-secondary-frame-bg: #334538;
+  --ph-secondary-button-border: #405745;
+  --ph-secondary-button-border-hover: #55a96b;
+
+  --ph-border-3000: #243027;
+  --ph-chrome-inset-face-top: inset 0 1px 0 hsl(0deg 0% 100% / 0.08);
+  --ph-chrome-inset-face-bottom: inset 0 -1px 0 hsl(0deg 0% 0% / 0.38);
+  --ph-accent-highlight-secondary: hsla(139deg 39% 40% / 18%);
+
+  --ph-data-1: #55a96b;
+  --ph-data-2: #e58a12;
+  --ph-data-3: #57b3a3;
+  --ph-data-4: #e06a49;
+  --ph-data-5: #f3b14c;
+  --ph-data-6: #8fa64a;
+  --ph-data-7: #b8791b;
+
+  --ph-product-session-replay: #e58a12;
+  --ph-product-product-analytics: #55a96b;
+  --ph-product-data-pipeline: #57b3a3;
+  --ph-product-feature-flags: #8fa64a;
+  --ph-product-experiments: #f3b14c;
+  --ph-product-data-warehouse: #b8791b;
+  --ph-product-surveys: #e06a49;
+
+  --ph-select-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none' stroke='%2391a28a' stroke-width='2.25' stroke-linecap='round' stroke-linejoin='round' viewBox='0 0 24 24'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
+}
+
+[data-theme="note-dark"] {
+  color-scheme: dark;
+
+  --ph-canvas: #1a1224;
+  --ph-surface: #221830;
+  --ph-muted: #2a1f3d;
+  --ph-toolbar: #322648;
+  --ph-border: #4a3860;
+  --ph-border-strong: #9b7bb8;
+
+  --ph-text-primary: #f0e8f8;
+  --ph-text-secondary: #c4b5d8;
+  --ph-text-tertiary: #9b7bb8;
+
+  --ph-accent: #b146c2;
+  --ph-accent-hover: #c96bd4;
+  --ph-blue: #4f9ff5;
+  --ph-violet: #b146c2;
+  --ph-purple: #93278f;
+
+  --ph-success: #33a867;
+  --ph-warning: #e67e22;
+  --ph-danger: #f87171;
+  --ph-info: #4f9ff5;
+
+  --ph-text-3000: #f0e8f8;
+  --ph-primary-button-face: #221830;
+  --ph-primary-button-border: #7719aa;
+  --ph-primary-button-border-hover: #b146c2;
+  --ph-primary-frame-bg: #b146c2;
+  --ph-secondary-button-bg: #2a1f3d;
+  --ph-secondary-frame-bg: #4a3860;
+  --ph-secondary-button-border: #4a3860;
+  --ph-secondary-button-border-hover: #93278f;
+
+  --ph-border-3000: #322648;
+  --ph-chrome-inset-face-top: inset 0 1px 0 hsl(0deg 0% 100% / 0.07);
+  --ph-chrome-inset-face-bottom: inset 0 -1px 0 hsl(0deg 0% 0% / 0.35);
+  --ph-accent-highlight-secondary: hsla(291deg 48% 54% / 14%);
+
+  --ph-data-1: #b146c2;
+  --ph-data-2: #93278f;
+  --ph-data-3: #4f9ff5;
+  --ph-data-4: #f87171;
+  --ph-data-5: #e67e22;
+  --ph-data-6: #33a867;
+  --ph-data-7: #7719aa;
+
+  --ph-select-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none' stroke='%239b7bb8' stroke-width='2.25' stroke-linecap='round' stroke-linejoin='round' viewBox='0 0 24 24'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
+}
+
+[data-theme="presentation-dark"] {
+  color-scheme: dark;
+
+  --ph-canvas: #1b1a19;
+  --ph-surface: #252423;
+  --ph-muted: #2d2c2b;
+  --ph-toolbar: #323130;
+  --ph-border: #484644;
+  --ph-border-strong: #797775;
+
+  --ph-text-primary: #f3f2f1;
+  --ph-text-secondary: #c8c6c4;
+  --ph-text-tertiary: #a19f9d;
+
+  --ph-accent: #e8654a;
+  --ph-accent-hover: #f07d62;
+  --ph-blue: #4f9ff5;
+  --ph-violet: #a78bfa;
+  --ph-purple: #8764b8;
+
+  --ph-success: #33a867;
+  --ph-warning: #e67e22;
+  --ph-danger: #f87171;
+  --ph-info: #4f9ff5;
+
+  --ph-text-3000: #f3f2f1;
+  --ph-primary-button-face: #252423;
+  --ph-primary-button-border: #b93d20;
+  --ph-primary-button-border-hover: #e8654a;
+  --ph-primary-frame-bg: #e8654a;
+  --ph-secondary-button-bg: #2d2c2b;
+  --ph-secondary-frame-bg: #484644;
+  --ph-secondary-button-border: #605e5c;
+  --ph-secondary-button-border-hover: #797775;
+
+  --ph-border-3000: #323130;
+  --ph-chrome-inset-face-top: inset 0 1px 0 hsl(0deg 0% 100% / 0.07);
+  --ph-chrome-inset-face-bottom: inset 0 -1px 0 hsl(0deg 0% 0% / 0.35);
+  --ph-accent-highlight-secondary: hsla(11deg 70% 55% / 14%);
+
+  --ph-data-1: #e8654a;
+  --ph-data-2: #4f9ff5;
+  --ph-data-3: #33a867;
+  --ph-data-4: #f87171;
+  --ph-data-5: #e67e22;
+  --ph-data-6: #8764b8;
+  --ph-data-7: #0078d4;
+
+  --ph-select-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none' stroke='%23a19f9d' stroke-width='2.25' stroke-linecap='round' stroke-linejoin='round' viewBox='0 0 24 24'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
+}
+
+[data-theme="github-light"] {
+  color-scheme: light;
+
+  --ph-canvas: #f6f8fa;
+  --ph-surface: #ffffff;
+  --ph-muted: #f6f8fa;
+  --ph-toolbar: #eaeef2;
+  --ph-border: #d0d7de;
+  --ph-border-strong: #8c959f;
+
+  --ph-text-primary: #1f2328;
+  --ph-text-secondary: #656d76;
+  --ph-text-tertiary: #6e7781;
+
+  --ph-accent: #0969da;
+  --ph-accent-hover: #0550ae;
+  --ph-blue: #0969da;
+  --ph-violet: #8250df;
+  --ph-purple: #8250df;
+
+  --ph-success: #1a7f37;
+  --ph-warning: #9a6700;
+  --ph-danger: #cf222e;
+  --ph-info: #0969da;
+
+  --ph-text-3000: #1f2328;
+  --ph-primary-button-face: #ffffff;
+  --ph-primary-button-border: #0550ae;
+  --ph-primary-button-border-hover: #033d8b;
+  --ph-primary-frame-bg: #0969da;
+  --ph-secondary-button-bg: #f6f8fa;
+  --ph-secondary-frame-bg: #eaeef2;
+  --ph-secondary-button-border: #d0d7de;
+  --ph-secondary-button-border-hover: #8c959f;
+
+  --ph-border-3000: #d0d7de;
+  --ph-chrome-inset-face-top: inset 0 1px 0 hsl(0deg 0% 100% / 0.92);
+  --ph-chrome-inset-face-bottom: inset 0 -1px 0 hsl(0deg 0% 0% / 0.04);
+  --ph-accent-highlight-secondary: hsla(212deg 92% 45% / 10%);
+
+  --ph-data-1: #0969da;
+  --ph-data-2: #8250df;
+  --ph-data-3: #1a7f37;
+  --ph-data-4: #cf222e;
+  --ph-data-5: #9a6700;
+  --ph-data-6: #0550ae;
+  --ph-data-7: #bf3989;
+
+  --ph-product-session-replay: #9a6700;
+  --ph-product-product-analytics: #0969da;
+  --ph-product-data-pipeline: #1a7f37;
+  --ph-product-feature-flags: #0550ae;
+  --ph-product-experiments: #8250df;
+  --ph-product-data-warehouse: #6639ba;
+  --ph-product-surveys: #cf222e;
+
+  --ph-select-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none' stroke='%23656d76' stroke-width='2.25' stroke-linecap='round' stroke-linejoin='round' viewBox='0 0 24 24'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
+}
+
+[data-theme="github-dark"] {
+  color-scheme: dark;
+
+  --ph-canvas: #0d1117;
+  --ph-surface: #161b22;
+  --ph-muted: #21262d;
+  --ph-toolbar: #21262d;
+  --ph-border: #30363d;
+  --ph-border-strong: #484f58;
+
+  --ph-text-primary: #e6edf3;
+  --ph-text-secondary: #9198a1;
+  --ph-text-tertiary: #7d8590;
+
+  --ph-accent: #4493f8;
+  --ph-accent-hover: #58a6ff;
+  --ph-blue: #4493f8;
+  --ph-violet: #a371f7;
+  --ph-purple: #a371f7;
+
+  --ph-success: #3fb950;
+  --ph-warning: #d29922;
+  --ph-danger: #f85149;
+  --ph-info: #4493f8;
+
+  --ph-text-3000: #e6edf3;
+  --ph-primary-button-face: #161b22;
+  --ph-primary-button-border: #1f6feb;
+  --ph-primary-button-border-hover: #388bfd;
+  --ph-primary-frame-bg: #1f6feb;
+  --ph-secondary-button-bg: #21262d;
+  --ph-secondary-frame-bg: #30363d;
+  --ph-secondary-button-border: #484f58;
+  --ph-secondary-button-border-hover: #6e7681;
+
+  --ph-border-3000: #30363d;
+  --ph-chrome-inset-face-top: inset 0 1px 0 hsl(0deg 0% 100% / 0.06);
+  --ph-chrome-inset-face-bottom: inset 0 -1px 0 hsl(0deg 0% 0% / 0.35);
+  --ph-accent-highlight-secondary: hsla(213deg 94% 68% / 12%);
+
+  --ph-data-1: #4493f8;
+  --ph-data-2: #a371f7;
+  --ph-data-3: #3fb950;
+  --ph-data-4: #f85149;
+  --ph-data-5: #d29922;
+  --ph-data-6: #58a6ff;
+  --ph-data-7: #db61a2;
+
+  --ph-product-session-replay: #d29922;
+  --ph-product-product-analytics: #4493f8;
+  --ph-product-data-pipeline: #3fb950;
+  --ph-product-feature-flags: #58a6ff;
+  --ph-product-experiments: #a371f7;
+  --ph-product-data-warehouse: #8957e5;
+  --ph-product-surveys: #f85149;
+
+  --ph-select-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none' stroke='%237d8590' stroke-width='2.25' stroke-linecap='round' stroke-linejoin='round' viewBox='0 0 24 24'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
+}
+
+[data-theme="rosepine-light"] {
+  color-scheme: light;
+
+  --ph-canvas: #faf4ed;
+  --ph-surface: #fffaf3;
+  --ph-muted: #f2e9e1;
+  --ph-toolbar: #f4ede8;
+  --ph-border: #dfdad9;
+  --ph-border-strong: #9893a5;
+
+  --ph-text-primary: #575279;
+  --ph-text-secondary: #797593;
+  --ph-text-tertiary: #9893a5;
+
+  --ph-accent: #907aa9;
+  --ph-accent-hover: #7c6594;
+  --ph-blue: #56949f;
+  --ph-violet: #907aa9;
+  --ph-purple: #907aa9;
+
+  --ph-success: #286983;
+  --ph-warning: #ea9d34;
+  --ph-danger: #b4637a;
+  --ph-info: #56949f;
+
+  --ph-text-3000: #575279;
+  --ph-primary-button-face: #fffaf3;
+  --ph-primary-button-border: #7c6594;
+  --ph-primary-button-border-hover: #6b567f;
+  --ph-primary-frame-bg: #907aa9;
+  --ph-secondary-button-bg: #f2e9e1;
+  --ph-secondary-frame-bg: #f4ede8;
+  --ph-secondary-button-border: #dfdad9;
+  --ph-secondary-button-border-hover: #9893a5;
+
+  --ph-border-3000: #dfdad9;
+  --ph-chrome-inset-face-top: inset 0 1px 0 hsl(0deg 0% 100% / 0.88);
+  --ph-chrome-inset-face-bottom: inset 0 -1px 0 hsl(0deg 0% 0% / 0.04);
+  --ph-accent-highlight-secondary: hsla(268deg 21% 57% / 12%);
+
+  --ph-data-1: #56949f;
+  --ph-data-2: #907aa9;
+  --ph-data-3: #286983;
+  --ph-data-4: #b4637a;
+  --ph-data-5: #ea9d34;
+  --ph-data-6: #d7827e;
+  --ph-data-7: #797593;
+
+  --ph-product-session-replay: #ea9d34;
+  --ph-product-product-analytics: #56949f;
+  --ph-product-data-pipeline: #286983;
+  --ph-product-feature-flags: #907aa9;
+  --ph-product-experiments: #b4637a;
+  --ph-product-data-warehouse: #797593;
+  --ph-product-surveys: #d7827e;
+
+  --ph-select-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none' stroke='%239893a5' stroke-width='2.25' stroke-linecap='round' stroke-linejoin='round' viewBox='0 0 24 24'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
+}
+
+[data-theme="rosepine-dark"] {
+  color-scheme: dark;
+
+  --ph-canvas: #191724;
+  --ph-surface: #1f1d2e;
+  --ph-muted: #26233a;
+  --ph-toolbar: #21202e;
+  --ph-border: #403d52;
+  --ph-border-strong: #524f67;
+
+  --ph-text-primary: #e0def4;
+  --ph-text-secondary: #908caa;
+  --ph-text-tertiary: #6e6a86;
+
+  --ph-accent: #c4a7e7;
+  --ph-accent-hover: #d4bcf0;
+  --ph-blue: #9ccfd8;
+  --ph-violet: #c4a7e7;
+  --ph-purple: #c4a7e7;
+
+  --ph-success: #31748f;
+  --ph-warning: #f6c177;
+  --ph-danger: #eb6f92;
+  --ph-info: #9ccfd8;
+
+  --ph-text-3000: #e0def4;
+  --ph-primary-button-face: #1f1d2e;
+  --ph-primary-button-border: #9b7fd4;
+  --ph-primary-button-border-hover: #c4a7e7;
+  --ph-primary-frame-bg: #c4a7e7;
+  --ph-secondary-button-bg: #26233a;
+  --ph-secondary-frame-bg: #403d52;
+  --ph-secondary-button-border: #524f67;
+  --ph-secondary-button-border-hover: #6e6a86;
+
+  --ph-border-3000: #26233a;
+  --ph-chrome-inset-face-top: inset 0 1px 0 hsl(0deg 0% 100% / 0.07);
+  --ph-chrome-inset-face-bottom: inset 0 -1px 0 hsl(0deg 0% 0% / 0.32);
+  --ph-accent-highlight-secondary: hsla(267deg 57% 78% / 14%);
+
+  --ph-data-1: #9ccfd8;
+  --ph-data-2: #c4a7e7;
+  --ph-data-3: #31748f;
+  --ph-data-4: #eb6f92;
+  --ph-data-5: #f6c177;
+  --ph-data-6: #ebbcba;
+  --ph-data-7: #908caa;
+
+  --ph-product-session-replay: #f6c177;
+  --ph-product-product-analytics: #9ccfd8;
+  --ph-product-data-pipeline: #31748f;
+  --ph-product-feature-flags: #c4a7e7;
+  --ph-product-experiments: #eb6f92;
+  --ph-product-data-warehouse: #ebbcba;
+  --ph-product-surveys: #908caa;
+
+  --ph-select-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none' stroke='%23908caa' stroke-width='2.25' stroke-linecap='round' stroke-linejoin='round' viewBox='0 0 24 24'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
+}