@hoardodile/ui 0.0.0

package/dist/styles/theme.css

@@ -0,0 +1,480 @@
+@import "tailwindcss";
+@import "tw-animate-css";
+@import "shadcn/tailwind.css";
+
+/* src/styles/theme.css */
+@custom-variant dark (&:is(.dark *));
+@custom-variant desktop-shell (&:is(html.desktop-shell *));
+@theme inline { --text-tiny: 0.6875rem; --text-tiny--line-height: 1rem; --text-ui: 0.8125rem; --text-ui--line-height: 1.25rem; --text-doc: 1.1875rem; --text-doc--line-height: 1.9; --text-doc-title: 3rem; --text-doc-title--line-height: 1.15; --text-doc-heading: 1.75rem; --text-doc-heading--line-height: 1.3; --text-quote: 1.125rem; --text-quote--line-height: 1.65; --tracking-label: 0.1em; --font-heading: var(--font-sans); --font-doc: Georgia, "Times New Roman", serif; --font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Hiragino Sans", "Yu Gothic UI", "Meiryo", sans-serif; --color-sidebar-ring: var(--sidebar-ring); --color-sidebar-border: var(--sidebar-border); --color-sidebar-accent-foreground: var(--sidebar-accent-foreground); --color-sidebar-accent: var(--sidebar-accent); --color-sidebar-primary-foreground: var(--sidebar-primary-foreground); --color-sidebar-primary: var(--sidebar-primary); --color-sidebar-foreground: var(--sidebar-foreground); --color-sidebar: var(--sidebar); --color-ring: var(--ring); --color-input: var(--input); --color-border: var(--border); --color-border-strong: var(--border-strong); --color-destructive: var(--destructive); --color-accent-foreground: var(--accent-foreground); --color-accent: var(--accent); --color-muted-foreground: var(--muted-foreground); --color-muted: var(--muted); --color-secondary-foreground: var(--secondary-foreground); --color-secondary: var(--secondary); --color-primary-foreground: var(--primary-foreground); --color-primary: var(--primary); --color-popover-foreground: var(--popover-foreground); --color-popover: var(--popover); --color-card-foreground: var(--card-foreground); --color-card: var(--card); --color-foreground: var(--foreground); --color-background: var(--background); --color-chart: var(--icon-tone, var(--foreground)); --color-icon-tone: var(--icon-tone, var(--foreground)); --radius: 0.625rem; --radius-sm: calc(var(--radius) * 0.6); --radius-md: calc(var(--radius) * 0.8); --radius-lg: var(--radius); --radius-xl: calc(var(--radius) * 1.2); --radius-2xl: calc(var(--radius) * 1.8); --radius-3xl: calc(var(--radius) * 2.2); --radius-4xl: calc(var(--radius) * 2.6); --shadow-card: 0 1px 3px rgb(0 0 0 / 0.04); --shadow-dialog: 0 1px 2px rgb(0 0 0 / 0.04), 0 24px 48px -16px rgb(0 0 0 / 0.16); --container-reading: 680px; --container-medium: 800px; --container-content: 1200px; --spacing-chip: 1.75rem; --spacing-control: 2rem; --spacing-nav: 2.375rem; --spacing-sidebar: 16.5rem; --spacing-panel: 20rem; --duration-1: 100ms; --duration-2: 160ms; --duration-3: 240ms; --duration-4: 320ms; --ease-out: cubic-bezier(0.16, 1, 0.3, 1); --ease-in: cubic-bezier(0.7, 0, 0.84, 0); --ease-standard: cubic-bezier(0.2, 0, 0, 1); --animate-skel: skel 1.6s ease-in-out infinite; @keyframes skel { 0%, 100% { opacity: 1; } 50% { opacity: 0.55; } } --animate-pop: pop 240ms cubic-bezier(0.16, 1, 0.3, 1); @keyframes pop { from { opacity: 0; transform: scale(0.8); } } --breakpoint-sm: 40rem; --breakpoint-md: 48rem; --breakpoint-lg: 64rem; --breakpoint-xl: 80rem; --breakpoint-2xl: 96rem; --breakpoint-sidebar: 1150px; --breakpoint-panel: 1440px; }
+:root {
+  --background: #fbfbfb;
+  --foreground: #101010;
+  --card: #ffffff;
+  --card-foreground: #101010;
+  --popover: #ffffff;
+  --popover-foreground: #101010;
+  --primary: #101010;
+  --primary-foreground: #ffffff;
+  --secondary: #f1f0f1;
+  --secondary-foreground: #4a4a48;
+  --muted: #f1f0f1;
+  --muted-foreground: #9a9a96;
+  --accent: #e7e7e9;
+  --accent-foreground: #101010;
+  --destructive: oklch(0.577 0.245 27.325);
+  --destructive-foreground: oklch(1 0 0);
+  --border: #eaeaeb;
+  --border-strong: #d6d6d8;
+  --input: #eaeaeb;
+  --ring: oklch(0.4 0 0);
+  --sidebar: #fbfbfb;
+  --sidebar-foreground: #101010;
+  --sidebar-primary: #101010;
+  --sidebar-primary-foreground: #ffffff;
+  --sidebar-accent: #f1f0f1;
+  --sidebar-accent-foreground: #101010;
+  --sidebar-border: #eaeaeb;
+  --sidebar-ring: oklch(0.4 0 0);
+  --shadow-color: oklch(0 0 0);
+}
+.dark {
+  --background: oklch(0.12 0 0);
+  --foreground: oklch(0.96 0 0);
+  --card: oklch(0.16 0 0);
+  --card-foreground: oklch(0.96 0 0);
+  --popover: oklch(0.18 0 0);
+  --popover-foreground: oklch(0.96 0 0);
+  --primary: oklch(0.95 0 0);
+  --primary-foreground: oklch(0.13 0 0);
+  --secondary: oklch(0.18 0 0);
+  --secondary-foreground: oklch(0.95 0 0);
+  --muted: oklch(0.18 0 0);
+  --muted-foreground: oklch(0.65 0 0);
+  --accent: oklch(0.22 0 0);
+  --accent-foreground: oklch(0.96 0 0);
+  --destructive: oklch(0.704 0.191 22.216);
+  --destructive-foreground: oklch(0.96 0 0);
+  --border: oklch(0.24 0 0);
+  --border-strong: oklch(0.28 0 0);
+  --input: oklch(0.28 0 0);
+  --ring: oklch(0.7 0 0);
+  --sidebar: oklch(0.08 0 0);
+  --sidebar-foreground: oklch(0.96 0 0);
+  --sidebar-primary: oklch(0.95 0 0);
+  --sidebar-primary-foreground: oklch(0.13 0 0);
+  --sidebar-accent: oklch(0.18 0 0);
+  --sidebar-accent-foreground: oklch(0.96 0 0);
+  --sidebar-border: oklch(0.24 0 0);
+  --sidebar-ring: oklch(0.7 0 0);
+  --shadow-color: oklch(0 0 0);
+}
+.theme-sage {
+  --background: #f5f6f0;
+  --foreground: #212920;
+  --card: #eef0ea;
+  --card-foreground: #212920;
+  --popover: #eef0ea;
+  --popover-foreground: #212920;
+  --primary: #525f4c;
+  --primary-foreground: #f2f4ec;
+  --secondary: #e7eae1;
+  --secondary-foreground: #55604f;
+  --muted: #e7eae1;
+  --muted-foreground: #8a9083;
+  --accent: #dee2d6;
+  --accent-foreground: #212920;
+  --destructive: oklch(0.55 0.18 28);
+  --destructive-foreground: #fbfbf8;
+  --border: #e0e4d9;
+  --border-strong: #cdd3c1;
+  --input: #e0e4d9;
+  --ring: #525f4c;
+  --sidebar: #e7eae1;
+  --sidebar-foreground: #212920;
+  --sidebar-primary: #525f4c;
+  --sidebar-primary-foreground: #f2f4ec;
+  --sidebar-accent: #dee2d6;
+  --sidebar-accent-foreground: #212920;
+  --sidebar-border: #e0e4d9;
+  --sidebar-ring: #525f4c;
+  --icon-tone: #5f6d5b;
+}
+html.dark.theme-sage,
+.dark .theme-sage {
+  --background: #0a100e;
+  --foreground: #d8cfbf;
+  --card: #101a15;
+  --card-foreground: #d8cfbf;
+  --popover: #152019;
+  --popover-foreground: #d8cfbf;
+  --primary: #a8bd96;
+  --primary-foreground: #101a15;
+  --secondary: #152019;
+  --secondary-foreground: #a9a79b;
+  --muted: #152019;
+  --muted-foreground: #7d7e74;
+  --accent: #1b2a20;
+  --accent-foreground: #ddd7c8;
+  --destructive: oklch(0.63 0.155 25);
+  --destructive-foreground: #e4e9e0;
+  --border: #1d2a22;
+  --border-strong: #28392d;
+  --input: #1d2a22;
+  --ring: #a8bd96;
+  --sidebar: #070d0b;
+  --sidebar-foreground: #d8cfbf;
+  --sidebar-primary: #a8bd96;
+  --sidebar-primary-foreground: #101a15;
+  --sidebar-accent: #1b2a20;
+  --sidebar-accent-foreground: #ddd7c8;
+  --sidebar-border: #1d2a22;
+  --sidebar-ring: #a8bd96;
+  --icon-tone: #75855a;
+}
+.theme-parchment {
+  --background: #d9c7a3;
+  --foreground: #302202;
+  --card: #ccb991;
+  --card-foreground: #302202;
+  --popover: #ccb991;
+  --popover-foreground: #302202;
+  --primary: #7d5600;
+  --primary-foreground: #f3e8ce;
+  --secondary: #c0ac87;
+  --secondary-foreground: #6a5a39;
+  --muted: #c0ac87;
+  --muted-foreground: #9e8c63;
+  --accent: #bfa87a;
+  --accent-foreground: #302202;
+  --destructive: oklch(0.577 0.245 27.325);
+  --destructive-foreground: oklch(1 0 0);
+  --border: #b7a175;
+  --border-strong: #a38c5c;
+  --input: #b7a175;
+  --ring: #7d5600;
+  --sidebar: #c0ac87;
+  --sidebar-foreground: #302202;
+  --sidebar-primary: #7d5600;
+  --sidebar-primary-foreground: #f3e8ce;
+  --sidebar-accent: #bfa87a;
+  --sidebar-accent-foreground: #302202;
+  --sidebar-border: #b7a175;
+  --sidebar-ring: #7d5600;
+  --icon-tone: #966500;
+}
+html.dark.theme-parchment,
+.dark .theme-parchment {
+  --background: #181818;
+  --foreground: #b8b8b8;
+  --card: #262626;
+  --card-foreground: #b8b8b8;
+  --popover: #2e2e2e;
+  --popover-foreground: #b8b8b8;
+  --primary: #d9a856;
+  --primary-foreground: #302202;
+  --secondary: #2e2e2e;
+  --secondary-foreground: #969696;
+  --muted: #2e2e2e;
+  --muted-foreground: #717171;
+  --accent: #3d2a2b;
+  --accent-foreground: #b8b8b8;
+  --destructive: oklch(0.704 0.191 22.216);
+  --destructive-foreground: oklch(0.96 0 0);
+  --border: #333333;
+  --border-strong: #454545;
+  --input: #333333;
+  --ring: #d9a856;
+  --sidebar: #101010;
+  --sidebar-foreground: #b8b8b8;
+  --sidebar-primary: #d9a856;
+  --sidebar-primary-foreground: #302202;
+  --sidebar-accent: #3d2a2b;
+  --sidebar-accent-foreground: #b8b8b8;
+  --sidebar-border: #333333;
+  --sidebar-ring: #d9a856;
+  --icon-tone: #966500;
+}
+.theme-azure {
+  --background: #fbfbfc;
+  --foreground: #161718;
+  --card: #ffffff;
+  --card-foreground: #161718;
+  --popover: #ffffff;
+  --popover-foreground: #161718;
+  --primary: #0277bd;
+  --primary-foreground: #ffffff;
+  --secondary: #f0f1f6;
+  --secondary-foreground: #5e6267;
+  --muted: #f0f1f6;
+  --muted-foreground: #95979a;
+  --accent: #e3f4fb;
+  --accent-foreground: #161718;
+  --destructive: oklch(0.577 0.245 27.325);
+  --destructive-foreground: oklch(1 0 0);
+  --border: #e4e5e7;
+  --border-strong: #d0d2d8;
+  --input: #e4e5e7;
+  --ring: #0277bd;
+  --sidebar: #f0f1f6;
+  --sidebar-foreground: #161718;
+  --sidebar-primary: #0277bd;
+  --sidebar-primary-foreground: #ffffff;
+  --sidebar-accent: #e3f4fb;
+  --sidebar-accent-foreground: #161718;
+  --sidebar-border: #e4e5e7;
+  --sidebar-ring: #0277bd;
+  --icon-tone: #02aeee;
+}
+html.dark.theme-azure,
+.dark .theme-azure {
+  --background: #191a1c;
+  --foreground: #d7d4d0;
+  --card: #202224;
+  --card-foreground: #d7d4d0;
+  --popover: #292b2d;
+  --popover-foreground: #d7d4d0;
+  --primary: #02aeee;
+  --primary-foreground: #0d1f26;
+  --secondary: #292b2d;
+  --secondary-foreground: #a7a097;
+  --muted: #292b2d;
+  --muted-foreground: #8a857d;
+  --accent: #1d2c38;
+  --accent-foreground: #d7d4d0;
+  --destructive: oklch(0.704 0.191 22.216);
+  --destructive-foreground: oklch(0.96 0 0);
+  --border: #2c2f32;
+  --border-strong: #3a3e42;
+  --input: #2c2f32;
+  --ring: #02aeee;
+  --sidebar: #121316;
+  --sidebar-foreground: #d7d4d0;
+  --sidebar-primary: #02aeee;
+  --sidebar-primary-foreground: #0d1f26;
+  --sidebar-accent: #1d2c38;
+  --sidebar-accent-foreground: #d7d4d0;
+  --sidebar-border: #2c2f32;
+  --sidebar-ring: #02aeee;
+  --icon-tone: #008dc0;
+}
+.theme-hoardodile {
+  --background: #fbfbfb;
+  --foreground: #272822;
+  --card: #ffffff;
+  --card-foreground: #272822;
+  --popover: #ffffff;
+  --popover-foreground: #272822;
+  --primary: #5f721f;
+  --primary-foreground: #f8f8f2;
+  --secondary: #edede3;
+  --secondary-foreground: #5c5d50;
+  --muted: #edede3;
+  --muted-foreground: #93917e;
+  --accent: #e9f4ce;
+  --accent-foreground: #272822;
+  --destructive: oklch(0.577 0.245 27.325);
+  --destructive-foreground: oklch(1 0 0);
+  --border: #e3e3d4;
+  --border-strong: #cfcfba;
+  --input: #e3e3d4;
+  --ring: #5f721f;
+  --sidebar: #edede3;
+  --sidebar-foreground: #272822;
+  --sidebar-primary: #5f721f;
+  --sidebar-primary-foreground: #f8f8f2;
+  --sidebar-accent: #e9f4ce;
+  --sidebar-accent-foreground: #272822;
+  --sidebar-border: #e3e3d4;
+  --sidebar-ring: #5f721f;
+  --icon-tone: #758a23;
+}
+html.dark.theme-hoardodile,
+.dark .theme-hoardodile {
+  --background: #272822;
+  --foreground: #f8f8f2;
+  --card: #2f3028;
+  --card-foreground: #f8f8f2;
+  --popover: #34352c;
+  --popover-foreground: #f8f8f2;
+  --primary: #bcd03b;
+  --primary-foreground: #272822;
+  --secondary: #34352c;
+  --secondary-foreground: #bcbfb0;
+  --muted: #34352c;
+  --muted-foreground: #75715e;
+  --accent: #49483e;
+  --accent-foreground: #f8f8f2;
+  --destructive: oklch(0.704 0.191 22.216);
+  --destructive-foreground: oklch(0.96 0 0);
+  --border: #3a3b32;
+  --border-strong: #4c4d41;
+  --input: #3a3b32;
+  --ring: #bcd03b;
+  --sidebar: #1f201b;
+  --sidebar-foreground: #f8f8f2;
+  --sidebar-primary: #bcd03b;
+  --sidebar-primary-foreground: #272822;
+  --sidebar-accent: #49483e;
+  --sidebar-accent-foreground: #f8f8f2;
+  --sidebar-border: #3a3b32;
+  --sidebar-ring: #bcd03b;
+  --icon-tone: #bcd03b;
+}
+.theme-mono {
+  --background: #fbfbfb;
+  --foreground: #101010;
+  --card: #ffffff;
+  --card-foreground: #101010;
+  --popover: #ffffff;
+  --popover-foreground: #101010;
+  --primary: #101010;
+  --primary-foreground: #ffffff;
+  --secondary: #f1f0f1;
+  --secondary-foreground: #4a4a48;
+  --muted: #f1f0f1;
+  --muted-foreground: #9a9a96;
+  --accent: #e7e7e9;
+  --accent-foreground: #101010;
+  --destructive: oklch(0.577 0.245 27.325);
+  --destructive-foreground: oklch(1 0 0);
+  --border: #eaeaeb;
+  --border-strong: #d6d6d8;
+  --input: #eaeaeb;
+  --ring: oklch(0.4 0 0);
+  --sidebar: #fbfbfb;
+  --sidebar-foreground: #101010;
+  --sidebar-primary: #101010;
+  --sidebar-primary-foreground: #ffffff;
+  --sidebar-accent: #f1f0f1;
+  --sidebar-accent-foreground: #101010;
+  --sidebar-border: #eaeaeb;
+  --sidebar-ring: oklch(0.4 0 0);
+  --shadow-color: oklch(0 0 0);
+}
+html.dark.theme-mono,
+.dark .theme-mono {
+  --background: oklch(0.12 0 0);
+  --foreground: oklch(0.96 0 0);
+  --card: oklch(0.16 0 0);
+  --card-foreground: oklch(0.96 0 0);
+  --popover: oklch(0.18 0 0);
+  --popover-foreground: oklch(0.96 0 0);
+  --primary: oklch(0.95 0 0);
+  --primary-foreground: oklch(0.13 0 0);
+  --secondary: oklch(0.18 0 0);
+  --secondary-foreground: oklch(0.95 0 0);
+  --muted: oklch(0.18 0 0);
+  --muted-foreground: oklch(0.65 0 0);
+  --accent: oklch(0.22 0 0);
+  --accent-foreground: oklch(0.96 0 0);
+  --destructive: oklch(0.704 0.191 22.216);
+  --destructive-foreground: oklch(0.96 0 0);
+  --border: oklch(0.24 0 0);
+  --border-strong: oklch(0.28 0 0);
+  --input: oklch(0.28 0 0);
+  --ring: oklch(0.7 0 0);
+  --sidebar: oklch(0.08 0 0);
+  --sidebar-foreground: oklch(0.96 0 0);
+  --sidebar-primary: oklch(0.95 0 0);
+  --sidebar-primary-foreground: oklch(0.13 0 0);
+  --sidebar-accent: oklch(0.18 0 0);
+  --sidebar-accent-foreground: oklch(0.96 0 0);
+  --sidebar-border: oklch(0.24 0 0);
+  --sidebar-ring: oklch(0.7 0 0);
+}
+@layer base {
+  * {
+    @apply border-border;
+    &::-webkit-scrollbar {
+      width: 10px;
+      height: 10px;
+    }
+    &::-webkit-scrollbar-track {
+      background: transparent;
+    }
+    &::-webkit-scrollbar-thumb {
+      background: color-mix(in oklab, var(--muted-foreground) 28%, transparent);
+      border-radius: 8px;
+      border: 3px solid transparent;
+      background-clip: padding-box;
+    }
+    &::-webkit-scrollbar-thumb:hover {
+      background: color-mix(in oklab, var(--muted-foreground) 45%, transparent);
+      background-clip: padding-box;
+    }
+  }
+  ::-webkit-scrollbar {
+    width: 10px;
+    height: 10px;
+  }
+  ::-webkit-scrollbar-track {
+    background: transparent;
+  }
+  ::-webkit-scrollbar-thumb {
+    background: color-mix(in oklab, var(--muted-foreground) 28%, transparent);
+    border-radius: 8px;
+    border: 3px solid transparent;
+    background-clip: padding-box;
+  }
+  ::-webkit-scrollbar-thumb:hover {
+    background: color-mix(in oklab, var(--muted-foreground) 45%, transparent);
+    background-clip: padding-box;
+  }
+  ::-webkit-scrollbar-button {
+    display: none;
+  }
+  @supports not selector(::-webkit-scrollbar) {
+    * {
+      scrollbar-width: thin;
+      scrollbar-color: color-mix(in oklab, var(--muted-foreground) 28%, transparent) transparent;
+    }
+  }
+  body {
+    @apply text-foreground;
+  }
+  html {
+    @apply font-sans;
+  }
+  html:lang(zh) .text-tiny {
+    font-size: 0.75rem;
+  }
+  button {
+    appearance: none;
+    border: 0;
+    background: transparent;
+    padding: 0;
+    color: inherit;
+    font: inherit;
+    text-align: inherit;
+    border-radius: 0;
+    cursor: pointer;
+  }
+  button:disabled {
+    cursor: default;
+  }
+}
+@utility no-scrollbar { scrollbar-width: none; &::-webkit-scrollbar { display: none; } }
+@utility strip-scroll { &::-webkit-scrollbar { width: 4px; height: 4px; } &::-webkit-scrollbar-track { background: transparent; } &::-webkit-scrollbar-thumb { background: var(--border-strong); border-radius: 2px; } &::-webkit-scrollbar-button { display: none; } @supports not selector(::-webkit-scrollbar) { scrollbar-width: thin; scrollbar-color: var(--border-strong) transparent; } }
+:root {
+  --solar-size: 1em;
+}
+.hd-icon {
+  --solar-secondary-color: var(--icon-tone);
+}
+[data-icon-style=grayscale] .hd-icon {
+  --solar-secondary-color: currentColor;
+}
+@source "../**/*.{js,ts,tsx}";
+@keyframes enter {
+  from {
+    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 {
+  to {
+    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));
+  }
+}
+/*# sourceMappingURL=theme.css.map */

package/dist/styles/theme.css.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/styles/theme.css"],"sourcesContent":["@import \"tailwindcss\";\n@import \"tw-animate-css\";\n@import \"shadcn/tailwind.css\";\n\n@custom-variant dark (&:is(.dark *));\n/* Same shape as `dark`, so it stacks (`desktop-shell:sidebar:`,\n   `desktop-shell:md:`). Electron app minWidth is 800px, so `max-md:`\n   never matches in the shell. */\n@custom-variant desktop-shell (&:is(html.desktop-shell *));\n\n@theme inline {\n\t/* Type scale (DESIGN.md — Typography) — layout constants. */\n\t--text-tiny: 0.6875rem;\n\t--text-tiny--line-height: 1rem;\n\t--text-ui: 0.8125rem;\n\t--text-ui--line-height: 1.25rem;\n\t--text-doc: 1.1875rem;\n\t--text-doc--line-height: 1.9;\n\t--text-doc-title: 3rem;\n\t--text-doc-title--line-height: 1.15;\n\t--text-doc-heading: 1.75rem;\n\t--text-doc-heading--line-height: 1.3;\n\t--text-quote: 1.125rem;\n\t--text-quote--line-height: 1.65;\n\t--tracking-label: 0.1em;\n\t--font-heading: var(--font-sans);\n\t/* Doc serif — the documents feature's reading serif; per-slot overrides\n\t   (user font prefs) live in the app's CSS variables. */\n\t--font-doc: Georgia, \"Times New Roman\", serif;\n\t/* UI stack (-apple-system … Arial) plus CJK fallbacks. Keep in sync\n\t   with SYSTEM_FONT_TAGS in apps/web/src/lib/fonts.ts. */\n\t--font-sans:\n\t\t-apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\",\n\t\tArial, \"PingFang SC\", \"Hiragino Sans GB\", \"Microsoft YaHei\",\n\t\t\"Hiragino Sans\", \"Yu Gothic UI\", \"Meiryo\", sans-serif;\n\t--color-sidebar-ring: var(--sidebar-ring);\n\t--color-sidebar-border: var(--sidebar-border);\n\t--color-sidebar-accent-foreground: var(--sidebar-accent-foreground);\n\t--color-sidebar-accent: var(--sidebar-accent);\n\t--color-sidebar-primary-foreground: var(--sidebar-primary-foreground);\n\t--color-sidebar-primary: var(--sidebar-primary);\n\t--color-sidebar-foreground: var(--sidebar-foreground);\n\t--color-sidebar: var(--sidebar);\n\t--color-ring: var(--ring);\n\t--color-input: var(--input);\n\t--color-border: var(--border);\n\t--color-border-strong: var(--border-strong);\n\t--color-destructive: var(--destructive);\n\t--color-accent-foreground: var(--accent-foreground);\n\t--color-accent: var(--accent);\n\t--color-muted-foreground: var(--muted-foreground);\n\t--color-muted: var(--muted);\n\t--color-secondary-foreground: var(--secondary-foreground);\n\t--color-secondary: var(--secondary);\n\t--color-primary-foreground: var(--primary-foreground);\n\t--color-primary: var(--primary);\n\t--color-popover-foreground: var(--popover-foreground);\n\t--color-popover: var(--popover);\n\t--color-card-foreground: var(--card-foreground);\n\t--color-card: var(--card);\n\t--color-foreground: var(--foreground);\n\t--color-background: var(--background);\n\t/* Chart ink — data ink follows the palette hue (--icon-tone), falling\n\t   back to plain foreground ink in mono, which defines no hue. Same\n\t   fallback chain as the duotone icon second tone (`--color-icon-tone`). */\n\t--color-chart: var(--icon-tone, var(--foreground));\n\t--color-icon-tone: var(--icon-tone, var(--foreground));\n\t--radius: 0.625rem;\n\t--radius-sm: calc(var(--radius) * 0.6);\n\t--radius-md: calc(var(--radius) * 0.8);\n\t--radius-lg: var(--radius);\n\t--radius-xl: calc(var(--radius) * 1.2);\n\t--radius-2xl: calc(var(--radius) * 1.8);\n\t--radius-3xl: calc(var(--radius) * 2.2);\n\t--radius-4xl: calc(var(--radius) * 2.6);\n\t--shadow-card: 0 1px 3px rgb(0 0 0 / 0.04);\n\t/* Dialog float — the one shadow deeper than `card`: dialogs hover on a\n\t   taller surface (scrim + blur below), so the drop has two steps. */\n\t--shadow-dialog:\n\t\t0 1px 2px rgb(0 0 0 / 0.04), 0 24px 48px -16px rgb(0 0 0 / 0.16);\n\n\t/* Content widths (DESIGN.md — Layout) — `--container-*` powers\n\t   max-w-reading / max-w-medium / max-w-content. */\n\t--container-reading: 680px;\n\t--container-medium: 800px;\n\t--container-content: 1200px;\n\n\t/* Control heights (DESIGN.md — Layout) — the three interactive\n\t   families; spacing theme keys also power the height and size\n\t   utilities. */\n\t--spacing-chip: 1.75rem;\n\t--spacing-control: 2rem;\n\t--spacing-nav: 2.375rem;\n\n\t/* Chrome widths (DESIGN.md — Layout) — `--spacing-*` keys power\n\t   the width utilities: sidebar 264 fixed left rail, panel 320\n\t   contextual right panel (also the 1fr+panel grid columns). */\n\t--spacing-sidebar: 16.5rem;\n\t--spacing-panel: 20rem;\n\n\t/* Motion (DESIGN.md) — four durations, three easings. Faster than\n\t   the mainstream OS defaults; chrome lives in 1–3, media gets 4.\n\t   `--ease-*` keys also (re)define the matching ease utilities. */\n\t--duration-1: 100ms;\n\t--duration-2: 160ms;\n\t--duration-3: 240ms;\n\t--duration-4: 320ms;\n\t--ease-out: cubic-bezier(0.16, 1, 0.3, 1);\n\t--ease-in: cubic-bezier(0.7, 0, 0.84, 0);\n\t--ease-standard: cubic-bezier(0.2, 0, 0, 1);\n\n\t/* Loading shimmer (skeletons) — a quiet opacity pulse. */\n\t--animate-skel: skel 1.6s ease-in-out infinite;\n\t@keyframes skel {\n\t\t0%,\n\t\t100% {\n\t\t\topacity: 1;\n\t\t}\n\t\t50% {\n\t\t\topacity: 0.55;\n\t\t}\n\t}\n\n\t/* Completion confirmation (DESIGN.md — upload ritual): a quiet\n\t   pop, opacity + scale only, no bounce. */\n\t--animate-pop: pop 240ms cubic-bezier(0.16, 1, 0.3, 1);\n\t@keyframes pop {\n\t\tfrom {\n\t\t\topacity: 0;\n\t\t\ttransform: scale(0.8);\n\t\t}\n\t}\n\n\t/* Breakpoints are declared explicitly so the JS mobile detection and\n\t   Tailwind responsive prefixes stay in sync. viewport.ts must match:\n\t   `MOBILE_BREAKPOINT_PX` ↔ `--breakpoint-md`, `SIDEBAR_BREAKPOINT_PX`\n\t   ↔ `--breakpoint-sidebar`, `PANEL_BREAKPOINT_PX` ↔ `--breakpoint-panel`. */\n\t--breakpoint-sm: 40rem;\n\t--breakpoint-md: 48rem;\n\t--breakpoint-lg: 64rem;\n\t--breakpoint-xl: 80rem;\n\t--breakpoint-2xl: 96rem;\n\t--breakpoint-sidebar: 1150px;\n\t--breakpoint-panel: 1440px;\n}\n\n/* ── Mono (default palette) ─────────────────────────────\n   Pure black-and-white typography palette: no hue anywhere,\n   surfaces stepped only in lightness. Primary is ink black in\n   light mode and paper white in dark mode. This is the default\n   palette: it lives in `:root` / `.dark` with no class, and the\n   `.theme-mono` block further down mirrors it so a local scope\n   can explicitly opt back in. */\n\n:root {\n\t--background: #fbfbfb;\n\t--foreground: #101010;\n\t--card: #ffffff;\n\t--card-foreground: #101010;\n\t--popover: #ffffff;\n\t--popover-foreground: #101010;\n\t--primary: #101010;\n\t--primary-foreground: #ffffff;\n\t--secondary: #f1f0f1;\n\t--secondary-foreground: #4a4a48;\n\t--muted: #f1f0f1;\n\t--muted-foreground: #9a9a96;\n\t--accent: #e7e7e9;\n\t--accent-foreground: #101010;\n\t--destructive: oklch(0.577 0.245 27.325);\n\t--destructive-foreground: oklch(1 0 0);\n\t--border: #eaeaeb;\n\t--border-strong: #d6d6d8;\n\t--input: #eaeaeb;\n\t--ring: oklch(0.4 0 0);\n\t--sidebar: #fbfbfb;\n\t--sidebar-foreground: #101010;\n\t--sidebar-primary: #101010;\n\t--sidebar-primary-foreground: #ffffff;\n\t--sidebar-accent: #f1f0f1;\n\t--sidebar-accent-foreground: #101010;\n\t--sidebar-border: #eaeaeb;\n\t--sidebar-ring: oklch(0.4 0 0);\n\t--shadow-color: oklch(0 0 0);\n}\n\n.dark {\n\t--background: oklch(0.12 0 0);\n\t--foreground: oklch(0.96 0 0);\n\t--card: oklch(0.16 0 0);\n\t--card-foreground: oklch(0.96 0 0);\n\t--popover: oklch(0.18 0 0);\n\t--popover-foreground: oklch(0.96 0 0);\n\t--primary: oklch(0.95 0 0);\n\t--primary-foreground: oklch(0.13 0 0);\n\t--secondary: oklch(0.18 0 0);\n\t--secondary-foreground: oklch(0.95 0 0);\n\t--muted: oklch(0.18 0 0);\n\t--muted-foreground: oklch(0.65 0 0);\n\t--accent: oklch(0.22 0 0);\n\t--accent-foreground: oklch(0.96 0 0);\n\t--destructive: oklch(0.704 0.191 22.216);\n\t--destructive-foreground: oklch(0.96 0 0);\n\t--border: oklch(0.24 0 0);\n\t--border-strong: oklch(0.28 0 0);\n\t--input: oklch(0.28 0 0);\n\t--ring: oklch(0.7 0 0);\n\t--sidebar: oklch(0.08 0 0);\n\t--sidebar-foreground: oklch(0.96 0 0);\n\t--sidebar-primary: oklch(0.95 0 0);\n\t--sidebar-primary-foreground: oklch(0.13 0 0);\n\t--sidebar-accent: oklch(0.18 0 0);\n\t--sidebar-accent-foreground: oklch(0.96 0 0);\n\t--sidebar-border: oklch(0.24 0 0);\n\t--sidebar-ring: oklch(0.7 0 0);\n\t--shadow-color: oklch(0 0 0);\n}\n\n/* ── Sage ─────────────────────────────────────────────────\n   Quiet sage-green journal palette. Light values anchor on the settings swatches (canvas #f5f6f0,\n   ink #212920, accent #5f6d5b); fills are tonal steps of the canvas —\n   cards and the sidebar sit slightly deeper than the content area.\n   Primary is the accent hue one step deeper, so actions read sage\n   instead of ink. Dark flips to warm cream ink on green-black, with a\n   light-sage primary.\n   ─────────────────────────────────────────────────────────────────── */\n\n.theme-sage {\n\t--background: #f5f6f0;\n\t--foreground: #212920;\n\t--card: #eef0ea;\n\t--card-foreground: #212920;\n\t--popover: #eef0ea;\n\t--popover-foreground: #212920;\n\t--primary: #525f4c;\n\t--primary-foreground: #f2f4ec;\n\t--secondary: #e7eae1;\n\t--secondary-foreground: #55604f;\n\t--muted: #e7eae1;\n\t--muted-foreground: #8a9083;\n\t--accent: #dee2d6;\n\t--accent-foreground: #212920;\n\t--destructive: oklch(0.55 0.18 28);\n\t--destructive-foreground: #fbfbf8;\n\t--border: #e0e4d9;\n\t--border-strong: #cdd3c1;\n\t--input: #e0e4d9;\n\t--ring: #525f4c;\n\t--sidebar: #e7eae1;\n\t--sidebar-foreground: #212920;\n\t--sidebar-primary: #525f4c;\n\t--sidebar-primary-foreground: #f2f4ec;\n\t--sidebar-accent: #dee2d6;\n\t--sidebar-accent-foreground: #212920;\n\t--sidebar-border: #e0e4d9;\n\t--sidebar-ring: #525f4c;\n\t--icon-tone: #5f6d5b;\n}\n\nhtml.dark.theme-sage,\n.dark .theme-sage {\n\t--background: #0a100e;\n\t--foreground: #d8cfbf;\n\t--card: #101a15;\n\t--card-foreground: #d8cfbf;\n\t--popover: #152019;\n\t--popover-foreground: #d8cfbf;\n\t--primary: #a8bd96;\n\t--primary-foreground: #101a15;\n\t--secondary: #152019;\n\t--secondary-foreground: #a9a79b;\n\t--muted: #152019;\n\t--muted-foreground: #7d7e74;\n\t--accent: #1b2a20;\n\t--accent-foreground: #ddd7c8;\n\t--destructive: oklch(0.63 0.155 25);\n\t--destructive-foreground: #e4e9e0;\n\t--border: #1d2a22;\n\t--border-strong: #28392d;\n\t--input: #1d2a22;\n\t--ring: #a8bd96;\n\t--sidebar: #070d0b;\n\t--sidebar-foreground: #d8cfbf;\n\t--sidebar-primary: #a8bd96;\n\t--sidebar-primary-foreground: #101a15;\n\t--sidebar-accent: #1b2a20;\n\t--sidebar-accent-foreground: #ddd7c8;\n\t--sidebar-border: #1d2a22;\n\t--sidebar-ring: #a8bd96;\n\t--icon-tone: #75855a;\n}\n\n/* ── Parchment ───────────────────────────────────────────────\n   Straw-paper reader palette — the documents area's default. Light values anchor on the settings\n   swatches (canvas #d9c7a3, ink #302202, accent #966500); cards sit\n   deeper than the canvas, like panels on paper. Primary is the bronze\n   accent deepened for contrast. Dark is the reader's night mode —\n   gray surfaces, a light-bronze primary, the accent shifts to red.\n   ─────────────────────────────────────────────────────────────────── */\n\n.theme-parchment {\n\t--background: #d9c7a3;\n\t--foreground: #302202;\n\t--card: #ccb991;\n\t--card-foreground: #302202;\n\t--popover: #ccb991;\n\t--popover-foreground: #302202;\n\t--primary: #7d5600;\n\t--primary-foreground: #f3e8ce;\n\t--secondary: #c0ac87;\n\t--secondary-foreground: #6a5a39;\n\t--muted: #c0ac87;\n\t--muted-foreground: #9e8c63;\n\t--accent: #bfa87a;\n\t--accent-foreground: #302202;\n\t--destructive: oklch(0.577 0.245 27.325);\n\t--destructive-foreground: oklch(1 0 0);\n\t--border: #b7a175;\n\t--border-strong: #a38c5c;\n\t--input: #b7a175;\n\t--ring: #7d5600;\n\t--sidebar: #c0ac87;\n\t--sidebar-foreground: #302202;\n\t--sidebar-primary: #7d5600;\n\t--sidebar-primary-foreground: #f3e8ce;\n\t--sidebar-accent: #bfa87a;\n\t--sidebar-accent-foreground: #302202;\n\t--sidebar-border: #b7a175;\n\t--sidebar-ring: #7d5600;\n\t--icon-tone: #966500;\n}\n\nhtml.dark.theme-parchment,\n.dark .theme-parchment {\n\t--background: #181818;\n\t--foreground: #b8b8b8;\n\t--card: #262626;\n\t--card-foreground: #b8b8b8;\n\t--popover: #2e2e2e;\n\t--popover-foreground: #b8b8b8;\n\t--primary: #d9a856;\n\t--primary-foreground: #302202;\n\t--secondary: #2e2e2e;\n\t--secondary-foreground: #969696;\n\t--muted: #2e2e2e;\n\t--muted-foreground: #717171;\n\t--accent: #3d2a2b;\n\t--accent-foreground: #b8b8b8;\n\t--destructive: oklch(0.704 0.191 22.216);\n\t--destructive-foreground: oklch(0.96 0 0);\n\t--border: #333333;\n\t--border-strong: #454545;\n\t--input: #333333;\n\t--ring: #d9a856;\n\t--sidebar: #101010;\n\t--sidebar-foreground: #b8b8b8;\n\t--sidebar-primary: #d9a856;\n\t--sidebar-primary-foreground: #302202;\n\t--sidebar-accent: #3d2a2b;\n\t--sidebar-accent-foreground: #b8b8b8;\n\t--sidebar-border: #333333;\n\t--sidebar-ring: #d9a856;\n\t--icon-tone: #966500;\n}\n\n/* ── Azure ──────────────────────────────────────────────────\n   Cool paper-white surfaces with a sky-blue accent. Light values anchor\n   on the settings swatches\n   (canvas #fbfbfc, ink #161718, accent #02aeee); fills lean cool.\n   Primary is the sky blue deepened enough to carry white text; dark\n   mode runs the accent blue itself with dark ink.\n   ─────────────────────────────────────────────────────────────────── */\n\n.theme-azure {\n\t--background: #fbfbfc;\n\t--foreground: #161718;\n\t--card: #ffffff;\n\t--card-foreground: #161718;\n\t--popover: #ffffff;\n\t--popover-foreground: #161718;\n\t--primary: #0277bd;\n\t--primary-foreground: #ffffff;\n\t--secondary: #f0f1f6;\n\t--secondary-foreground: #5e6267;\n\t--muted: #f0f1f6;\n\t--muted-foreground: #95979a;\n\t--accent: #e3f4fb;\n\t--accent-foreground: #161718;\n\t--destructive: oklch(0.577 0.245 27.325);\n\t--destructive-foreground: oklch(1 0 0);\n\t--border: #e4e5e7;\n\t--border-strong: #d0d2d8;\n\t--input: #e4e5e7;\n\t--ring: #0277bd;\n\t--sidebar: #f0f1f6;\n\t--sidebar-foreground: #161718;\n\t--sidebar-primary: #0277bd;\n\t--sidebar-primary-foreground: #ffffff;\n\t--sidebar-accent: #e3f4fb;\n\t--sidebar-accent-foreground: #161718;\n\t--sidebar-border: #e4e5e7;\n\t--sidebar-ring: #0277bd;\n\t--icon-tone: #02aeee;\n}\n\nhtml.dark.theme-azure,\n.dark .theme-azure {\n\t--background: #191a1c;\n\t--foreground: #d7d4d0;\n\t--card: #202224;\n\t--card-foreground: #d7d4d0;\n\t--popover: #292b2d;\n\t--popover-foreground: #d7d4d0;\n\t--primary: #02aeee;\n\t--primary-foreground: #0d1f26;\n\t--secondary: #292b2d;\n\t--secondary-foreground: #a7a097;\n\t--muted: #292b2d;\n\t--muted-foreground: #8a857d;\n\t--accent: #1d2c38;\n\t--accent-foreground: #d7d4d0;\n\t--destructive: oklch(0.704 0.191 22.216);\n\t--destructive-foreground: oklch(0.96 0 0);\n\t--border: #2c2f32;\n\t--border-strong: #3a3e42;\n\t--input: #2c2f32;\n\t--ring: #02aeee;\n\t--sidebar: #121316;\n\t--sidebar-foreground: #d7d4d0;\n\t--sidebar-primary: #02aeee;\n\t--sidebar-primary-foreground: #0d1f26;\n\t--sidebar-accent: #1d2c38;\n\t--sidebar-accent-foreground: #d7d4d0;\n\t--sidebar-border: #2c2f32;\n\t--sidebar-ring: #02aeee;\n\t--icon-tone: #008dc0;\n}\n\n/* ── Hoardodile ─────────────────────────────────────────────\n   The logo palette on mono's bones: the light canvas is mono's neutral #fbfbfb (matching the settings\n   swatch; the croc-belly tint survives only as the ink on primary),\n   with identity carried by the outline-olive icon tone #758a23 and a\n   soft croc-lime selection tint (body #bcd03b; the hat-band gold\n   #dcc06f stays in the artwork). Primary is the olive deepened for text\n   contrast. Dark mode is olive-black, flipping primary to the raw logo\n   lime and the icon tone with it.\n   ─────────────────────────────────────────────────────────────────── */\n\n.theme-hoardodile {\n\t--background: #fbfbfb;\n\t--foreground: #272822;\n\t--card: #ffffff;\n\t--card-foreground: #272822;\n\t--popover: #ffffff;\n\t--popover-foreground: #272822;\n\t--primary: #5f721f;\n\t--primary-foreground: #f8f8f2;\n\t--secondary: #edede3;\n\t--secondary-foreground: #5c5d50;\n\t--muted: #edede3;\n\t--muted-foreground: #93917e;\n\t--accent: #e9f4ce;\n\t--accent-foreground: #272822;\n\t--destructive: oklch(0.577 0.245 27.325);\n\t--destructive-foreground: oklch(1 0 0);\n\t--border: #e3e3d4;\n\t--border-strong: #cfcfba;\n\t--input: #e3e3d4;\n\t--ring: #5f721f;\n\t--sidebar: #edede3;\n\t--sidebar-foreground: #272822;\n\t--sidebar-primary: #5f721f;\n\t--sidebar-primary-foreground: #f8f8f2;\n\t--sidebar-accent: #e9f4ce;\n\t--sidebar-accent-foreground: #272822;\n\t--sidebar-border: #e3e3d4;\n\t--sidebar-ring: #5f721f;\n\t--icon-tone: #758a23;\n}\n\nhtml.dark.theme-hoardodile,\n.dark .theme-hoardodile {\n\t--background: #272822;\n\t--foreground: #f8f8f2;\n\t--card: #2f3028;\n\t--card-foreground: #f8f8f2;\n\t--popover: #34352c;\n\t--popover-foreground: #f8f8f2;\n\t--primary: #bcd03b;\n\t--primary-foreground: #272822;\n\t--secondary: #34352c;\n\t--secondary-foreground: #bcbfb0;\n\t--muted: #34352c;\n\t--muted-foreground: #75715e;\n\t--accent: #49483e;\n\t--accent-foreground: #f8f8f2;\n\t--destructive: oklch(0.704 0.191 22.216);\n\t--destructive-foreground: oklch(0.96 0 0);\n\t--border: #3a3b32;\n\t--border-strong: #4c4d41;\n\t--input: #3a3b32;\n\t--ring: #bcd03b;\n\t--sidebar: #1f201b;\n\t--sidebar-foreground: #f8f8f2;\n\t--sidebar-primary: #bcd03b;\n\t--sidebar-primary-foreground: #272822;\n\t--sidebar-accent: #49483e;\n\t--sidebar-accent-foreground: #f8f8f2;\n\t--sidebar-border: #3a3b32;\n\t--sidebar-ring: #bcd03b;\n\t--icon-tone: #bcd03b;\n}\n\n/* ── Mono palette class ───────────────────────────────────────\n   Mirrors :root / .dark so a local scope can explicitly opt back\n   into the mono palette even when the global theme uses another\n   palette.\n   ─────────────────────────────────────────────────────────────── */\n\n.theme-mono {\n\t--background: #fbfbfb;\n\t--foreground: #101010;\n\t--card: #ffffff;\n\t--card-foreground: #101010;\n\t--popover: #ffffff;\n\t--popover-foreground: #101010;\n\t--primary: #101010;\n\t--primary-foreground: #ffffff;\n\t--secondary: #f1f0f1;\n\t--secondary-foreground: #4a4a48;\n\t--muted: #f1f0f1;\n\t--muted-foreground: #9a9a96;\n\t--accent: #e7e7e9;\n\t--accent-foreground: #101010;\n\t--destructive: oklch(0.577 0.245 27.325);\n\t--destructive-foreground: oklch(1 0 0);\n\t--border: #eaeaeb;\n\t--border-strong: #d6d6d8;\n\t--input: #eaeaeb;\n\t--ring: oklch(0.4 0 0);\n\t--sidebar: #fbfbfb;\n\t--sidebar-foreground: #101010;\n\t--sidebar-primary: #101010;\n\t--sidebar-primary-foreground: #ffffff;\n\t--sidebar-accent: #f1f0f1;\n\t--sidebar-accent-foreground: #101010;\n\t--sidebar-border: #eaeaeb;\n\t--sidebar-ring: oklch(0.4 0 0);\n\t--shadow-color: oklch(0 0 0);\n}\n\nhtml.dark.theme-mono,\n.dark .theme-mono {\n\t--background: oklch(0.12 0 0);\n\t--foreground: oklch(0.96 0 0);\n\t--card: oklch(0.16 0 0);\n\t--card-foreground: oklch(0.96 0 0);\n\t--popover: oklch(0.18 0 0);\n\t--popover-foreground: oklch(0.96 0 0);\n\t--primary: oklch(0.95 0 0);\n\t--primary-foreground: oklch(0.13 0 0);\n\t--secondary: oklch(0.18 0 0);\n\t--secondary-foreground: oklch(0.95 0 0);\n\t--muted: oklch(0.18 0 0);\n\t--muted-foreground: oklch(0.65 0 0);\n\t--accent: oklch(0.22 0 0);\n\t--accent-foreground: oklch(0.96 0 0);\n\t--destructive: oklch(0.704 0.191 22.216);\n\t--destructive-foreground: oklch(0.96 0 0);\n\t--border: oklch(0.24 0 0);\n\t--border-strong: oklch(0.28 0 0);\n\t--input: oklch(0.28 0 0);\n\t--ring: oklch(0.7 0 0);\n\t--sidebar: oklch(0.08 0 0);\n\t--sidebar-foreground: oklch(0.96 0 0);\n\t--sidebar-primary: oklch(0.95 0 0);\n\t--sidebar-primary-foreground: oklch(0.13 0 0);\n\t--sidebar-accent: oklch(0.18 0 0);\n\t--sidebar-accent-foreground: oklch(0.96 0 0);\n\t--sidebar-border: oklch(0.24 0 0);\n\t--sidebar-ring: oklch(0.7 0 0);\n}\n\n@layer base {\n\t* {\n\t\t@apply border-border;\n\n\t\t/* Thin, quiet scrollbar everywhere (previously doc.css scoped).\n\t\t   Chromium styling goes through the ::-webkit-scrollbar pseudos\n\t\t   below; the standard `scrollbar-width`/`scrollbar-color` props\n\t\t   must NOT be set here — since Chrome 121 they disable all\n\t\t   ::-webkit-scrollbar styling on the element, which resurrects\n\t\t   the classic Windows scrollbar with arrow buttons. They are\n\t\t   applied to Firefox only via the @supports block further down. */\n\t\t&::-webkit-scrollbar {\n\t\t\twidth: 10px;\n\t\t\theight: 10px;\n\t\t}\n\n\t\t&::-webkit-scrollbar-track {\n\t\t\tbackground: transparent;\n\t\t}\n\n\t\t&::-webkit-scrollbar-thumb {\n\t\t\tbackground: color-mix(in oklab, var(--muted-foreground) 28%, transparent);\n\t\t\tborder-radius: 8px;\n\t\t\tborder: 3px solid transparent;\n\t\t\tbackground-clip: padding-box;\n\t\t}\n\n\t\t&::-webkit-scrollbar-thumb:hover {\n\t\t\tbackground: color-mix(in oklab, var(--muted-foreground) 45%, transparent);\n\t\t\tbackground-clip: padding-box;\n\t\t}\n\t}\n\n\t/* Element-scoped selectors above never match the Chromium viewport\n\t   scrollbar (it lives outside any element's scope), so the same styling\n\t   is repeated on bare pseudo-element selectors — without them the\n\t   viewport bar keeps the classic look with arrow buttons. */\n\t::-webkit-scrollbar {\n\t\twidth: 10px;\n\t\theight: 10px;\n\t}\n\n\t::-webkit-scrollbar-track {\n\t\tbackground: transparent;\n\t}\n\n\t::-webkit-scrollbar-thumb {\n\t\tbackground: color-mix(in oklab, var(--muted-foreground) 28%, transparent);\n\t\tborder-radius: 8px;\n\t\tborder: 3px solid transparent;\n\t\tbackground-clip: padding-box;\n\t}\n\n\t::-webkit-scrollbar-thumb:hover {\n\t\tbackground: color-mix(in oklab, var(--muted-foreground) 45%, transparent);\n\t\tbackground-clip: padding-box;\n\t}\n\n\t::-webkit-scrollbar-button {\n\t\tdisplay: none;\n\t}\n\n\t/* Firefox-only: the standard props are the only styling Firefox\n\t   understands, and on `*` they inherit to the root viewport bar.\n\t   Chromium must not receive them (see the note on `*` above). */\n\t@supports not selector(::-webkit-scrollbar) {\n\t\t* {\n\t\t\tscrollbar-width: thin;\n\t\t\tscrollbar-color: color-mix(\n\t\t\t\t\tin oklab,\n\t\t\t\t\tvar(--muted-foreground) 28%,\n\t\t\t\t\ttransparent\n\t\t\t\t)\n\t\t\t\ttransparent;\n\t\t}\n\t}\n\n\tbody {\n\t\t@apply text-foreground;\n\t}\n\n\thtml {\n\t\t@apply font-sans;\n\t}\n\n\t/* CJK glyphs are denser than Latin — tiny text reads at 12px instead\n\t   of the 11px base so stroke detail survives (DESIGN.md —\n\t   Typography). The 12px rule out-ranks the `.text-tiny` utility. */\n\thtml:lang(zh) .text-tiny {\n\t\tfont-size: 0.75rem;\n\t}\n\n\t/* Buttons start clean: UA chrome (appearance, border, background,\n\t   padding, centered text) is fully reset so component classes own the\n\t   look. The pointer cursor is the base behavior; disabled flips to\n\t   the default arrow. */\n\tbutton {\n\t\tappearance: none;\n\t\tborder: 0;\n\t\tbackground: transparent;\n\t\tpadding: 0;\n\t\tcolor: inherit;\n\t\tfont: inherit;\n\t\ttext-align: inherit;\n\t\tborder-radius: 0;\n\t\tcursor: pointer;\n\t}\n\n\tbutton:disabled {\n\t\tcursor: default;\n\t}\n}\n\n/* Hide scrollbars while keeping overflow scrollable — carousel strips,\n   tab bars, and command palettes rely on it (tabs.tsx, combobox.tsx,\n   command.tsx, sidebar.tsx, the overview marquee). */\n@utility no-scrollbar {\n\tscrollbar-width: none;\n\t&::-webkit-scrollbar {\n\t\tdisplay: none;\n\t}\n}\n\n/* Strip scrollbar — the rail's chip clouds and settings lists: a 4px\n   quiet thumb instead of the 10px base bar (DESIGN.md —\n   Scrollbars). Chromium goes through the pseudos; Firefox gets the\n   standard props via the @supports block (see the `*` note above). */\n@utility strip-scroll {\n\t&::-webkit-scrollbar {\n\t\twidth: 4px;\n\t\theight: 4px;\n\t}\n\t&::-webkit-scrollbar-track {\n\t\tbackground: transparent;\n\t}\n\t&::-webkit-scrollbar-thumb {\n\t\tbackground: var(--border-strong);\n\t\tborder-radius: 2px;\n\t}\n\t&::-webkit-scrollbar-button {\n\t\tdisplay: none;\n\t}\n\t@supports not selector(::-webkit-scrollbar) {\n\t\tscrollbar-width: thin;\n\t\tscrollbar-color: var(--border-strong) transparent;\n\t}\n}\n\n/* Duotone icons pick up the palette hue (DESIGN.md — Iconography):\n   solar v2 BoldDuotone renders its second tone via the\n   `--solar-secondary-color` CSS variable (falling back to currentColor) —\n   recolor just that tone per theme by pinning the variable to the palette\n   hue on the wrapper's `hd-icon` hook. Mono themes define no --icon-tone,\n   so the variable is invalid and the accent falls back to plain ink; the\n   Bold (selected) and Linear (monochrome) weights are untouched. */\n:root {\n\t/* solar v2 sizes icons as `1em` × `var(--solar-size, 24px)` — pin the\n\t   default to 1em so icon-less sizing matches v1 (class-based tiers rule\n\t   everywhere the design system has an opinion). */\n\t--solar-size: 1em;\n}\n\n.hd-icon {\n\t--solar-secondary-color: var(--icon-tone);\n}\n\n/* Grayscale icon mode (Settings → Icons): BoldDuotone keeps its two-tone\n   structure, but the second tone never takes the palette hue — it falls\n   back to plain ink, whose built-in half opacity reads as gray. Black and\n   gray in both light and dark, no extra tokens needed. */\n[data-icon-style=\"grayscale\"] .hd-icon {\n\t--solar-secondary-color: currentColor;\n}\n\n/* Consumers resolve this file from dist/styles/, so the glob must cover the\n   tsup ESM outputs in dist/ (plain string literals — class names survive).\n   `.tsx` is kept for setups that compile the source tree directly. The\n   scan-contract test pins this against the built artifacts. */\n@source \"../**/*.{js,ts,tsx}\";\n\n/* ── Override tw-animate-css keyframes to remove filter:blur which forces\n     extra compositor work on mobile WebKit even when blur(0) ── */\n@keyframes enter {\n\tfrom {\n\t\topacity: var(--tw-enter-opacity, 1);\n\t\ttransform: translate3d(\n\t\t\t\tvar(--tw-enter-translate-x, 0),\n\t\t\t\tvar(--tw-enter-translate-y, 0),\n\t\t\t\t0\n\t\t\t)\n\t\t\tscale3d(\n\t\t\t\tvar(--tw-enter-scale, 1),\n\t\t\t\tvar(--tw-enter-scale, 1),\n\t\t\t\tvar(--tw-enter-scale, 1)\n\t\t\t)\n\t\t\trotate(var(--tw-enter-rotate, 0));\n\t}\n}\n\n@keyframes exit {\n\tto {\n\t\topacity: var(--tw-exit-opacity, 1);\n\t\ttransform: translate3d(\n\t\t\t\tvar(--tw-exit-translate-x, 0),\n\t\t\t\tvar(--tw-exit-translate-y, 0),\n\t\t\t\t0\n\t\t\t)\n\t\t\tscale3d(\n\t\t\t\tvar(--tw-exit-scale, 1),\n\t\t\t\tvar(--tw-exit-scale, 1),\n\t\t\t\tvar(--tw-exit-scale, 1)\n\t\t\t)\n\t\t\trotate(var(--tw-exit-rotate, 0));\n\t}\n}\n"],"mappings":"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","names":[]}

package/dist/styles/theme.d.ts

@@ -0,0 +1,2 @@
+
+export {  }

package/dist/viewport.d.ts

@@ -0,0 +1,64 @@
+/**
+ * Mobile viewport initial-scale factor used across the app shell and
+ * plugin iframe previews. Kept in one place so it can be changed
+ * without hunting through HTML templates and CSS rules.
+ */
+declare const MOBILE_INITIAL_SCALE = 0.8;
+/**
+ * Width in pixels at which the app switches from below-md to md+ layouts.
+ *
+ * This value is intentionally aligned with Tailwind's `md` breakpoint
+ * (768 px) so that JS detection and CSS responsive prefixes stay in sync.
+ * Components that need to know whether they are in the "below md" viewport
+ * should use {@link isBelowMd} or {@link useBelowMd} from @hoardodile/ui/hooks/use-mobile.
+ */
+declare const MOBILE_BREAKPOINT_PX = 768;
+/**
+ * Same breakpoint expressed in rems, matching Tailwind's default theme
+ * (`--breakpoint-md: 48rem`). Useful for CSS media queries and comments.
+ */
+declare const MOBILE_BREAKPOINT_REM: number;
+/**
+ * Media query string that matches viewports below the `md` breakpoint
+ * (< 768 px). Shared between JS hooks and anywhere else that needs to detect
+ * a below-md viewport.
+ *
+ * Keep this in sync with the CSS/Tailwind breakpoint so JS and CSS never
+ * disagree about the viewport size.
+ */
+declare const MOBILE_QUERY = "(max-width: 767px)";
+/**
+ * Width in pixels at which the app switches from a drawer to a fixed left
+ * sidebar (the "app shell"). Raised above `md` so mid-size viewports keep
+ * the whole width for their content column — below this the sidebar hides
+ * behind the hamburger drawer.
+ *
+ * Use the CSS `sidebar:` / `max-sidebar:` variants (`--breakpoint-sidebar`)
+ * at call sites — this value is the single source of truth for both.
+ */
+declare const SIDEBAR_BREAKPOINT_PX = 1150;
+/**
+ * Media query string that matches viewports below the sidebar breakpoint
+ * (`max-sidebar`), i.e. where the shell shows the drawer instead of the fixed
+ * sidebar. Shared between JS hooks and anywhere else that needs the
+ * below-sidebar viewport.
+ */
+declare const SIDEBAR_QUERY = "(max-width: 1149px)";
+/**
+ * Width in pixels at which the right filter rail switches from a fixed
+ * column to a drawer (DESIGN.md — Layout: "the panel becomes an
+ * overlay below 1440px"). Below this the sidebar + panel + content no
+ * longer fit comfortably, so the rail hides behind a Filters button.
+ *
+ * Use the CSS `panel:` / `max-panel:` variants (`--breakpoint-panel`)
+ * at call sites — this value is the single source of truth for both.
+ */
+declare const PANEL_BREAKPOINT_PX = 1440;
+/**
+ * Media query string that matches viewports below the panel breakpoint
+ * (< 1440 px), i.e. where the filter rail lives in a drawer. Shared
+ * between JS hooks and anywhere else that needs the below-panel viewport.
+ */
+declare const PANEL_QUERY = "(max-width: 1439px)";
+
+export { MOBILE_BREAKPOINT_PX, MOBILE_BREAKPOINT_REM, MOBILE_INITIAL_SCALE, MOBILE_QUERY, PANEL_BREAKPOINT_PX, PANEL_QUERY, SIDEBAR_BREAKPOINT_PX, SIDEBAR_QUERY };

package/dist/viewport.js

@@ -0,0 +1,13 @@
+// src/viewport.ts
+var MOBILE_INITIAL_SCALE = 0.8;
+var MOBILE_BREAKPOINT_PX = 768;
+var MOBILE_BREAKPOINT_REM = MOBILE_BREAKPOINT_PX / 16;
+var MOBILE_QUERY = `(max-width: ${MOBILE_BREAKPOINT_PX - 1}px)`;
+var SIDEBAR_BREAKPOINT_PX = 1150;
+var SIDEBAR_QUERY = `(max-width: ${SIDEBAR_BREAKPOINT_PX - 1}px)`;
+var PANEL_BREAKPOINT_PX = 1440;
+var PANEL_QUERY = `(max-width: ${PANEL_BREAKPOINT_PX - 1}px)`;
+
+export { MOBILE_BREAKPOINT_PX, MOBILE_BREAKPOINT_REM, MOBILE_INITIAL_SCALE, MOBILE_QUERY, PANEL_BREAKPOINT_PX, PANEL_QUERY, SIDEBAR_BREAKPOINT_PX, SIDEBAR_QUERY };
+//# sourceMappingURL=viewport.js.map
+//# sourceMappingURL=viewport.js.map

package/dist/viewport.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/viewport.ts"],"names":[],"mappings":";AAKO,IAAM,oBAAA,GAAuB;AAU7B,IAAM,oBAAA,GAAuB;AAM7B,IAAM,wBAAwB,oBAAA,GAAuB;AAUrD,IAAM,YAAA,GAAe,CAAA,YAAA,EAAe,oBAAA,GAAuB,CAAC,CAAA,GAAA;AAW5D,IAAM,qBAAA,GAAwB;AAQ9B,IAAM,aAAA,GAAgB,CAAA,YAAA,EAAe,qBAAA,GAAwB,CAAC,CAAA,GAAA;AAW9D,IAAM,mBAAA,GAAsB;AAO5B,IAAM,WAAA,GAAc,CAAA,YAAA,EAAe,mBAAA,GAAsB,CAAC,CAAA,GAAA","file":"viewport.js","sourcesContent":["/**\n * Mobile viewport initial-scale factor used across the app shell and\n * plugin iframe previews. Kept in one place so it can be changed\n * without hunting through HTML templates and CSS rules.\n */\nexport const MOBILE_INITIAL_SCALE = 0.8\n\n/**\n * Width in pixels at which the app switches from below-md to md+ layouts.\n *\n * This value is intentionally aligned with Tailwind's `md` breakpoint\n * (768 px) so that JS detection and CSS responsive prefixes stay in sync.\n * Components that need to know whether they are in the \"below md\" viewport\n * should use {@link isBelowMd} or {@link useBelowMd} from @hoardodile/ui/hooks/use-mobile.\n */\nexport const MOBILE_BREAKPOINT_PX = 768\n\n/**\n * Same breakpoint expressed in rems, matching Tailwind's default theme\n * (`--breakpoint-md: 48rem`). Useful for CSS media queries and comments.\n */\nexport const MOBILE_BREAKPOINT_REM = MOBILE_BREAKPOINT_PX / 16\n\n/**\n * Media query string that matches viewports below the `md` breakpoint\n * (< 768 px). Shared between JS hooks and anywhere else that needs to detect\n * a below-md viewport.\n *\n * Keep this in sync with the CSS/Tailwind breakpoint so JS and CSS never\n * disagree about the viewport size.\n */\nexport const MOBILE_QUERY = `(max-width: ${MOBILE_BREAKPOINT_PX - 1}px)`\n\n/**\n * Width in pixels at which the app switches from a drawer to a fixed left\n * sidebar (the \"app shell\"). Raised above `md` so mid-size viewports keep\n * the whole width for their content column — below this the sidebar hides\n * behind the hamburger drawer.\n *\n * Use the CSS `sidebar:` / `max-sidebar:` variants (`--breakpoint-sidebar`)\n * at call sites — this value is the single source of truth for both.\n */\nexport const SIDEBAR_BREAKPOINT_PX = 1150\n\n/**\n * Media query string that matches viewports below the sidebar breakpoint\n * (`max-sidebar`), i.e. where the shell shows the drawer instead of the fixed\n * sidebar. Shared between JS hooks and anywhere else that needs the\n * below-sidebar viewport.\n */\nexport const SIDEBAR_QUERY = `(max-width: ${SIDEBAR_BREAKPOINT_PX - 1}px)`\n\n/**\n * Width in pixels at which the right filter rail switches from a fixed\n * column to a drawer (DESIGN.md — Layout: \"the panel becomes an\n * overlay below 1440px\"). Below this the sidebar + panel + content no\n * longer fit comfortably, so the rail hides behind a Filters button.\n *\n * Use the CSS `panel:` / `max-panel:` variants (`--breakpoint-panel`)\n * at call sites — this value is the single source of truth for both.\n */\nexport const PANEL_BREAKPOINT_PX = 1440\n\n/**\n * Media query string that matches viewports below the panel breakpoint\n * (< 1440 px), i.e. where the filter rail lives in a drawer. Shared\n * between JS hooks and anywhere else that needs the below-panel viewport.\n */\nexport const PANEL_QUERY = `(max-width: ${PANEL_BREAKPOINT_PX - 1}px)`\n"]}