@sableui/react 0.12.0 → 0.13.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md CHANGED
@@ -1,5 +1,34 @@
1
1
  # What's new
2
2
 
3
+ ## 0.13.0
4
+
5
+ Tone scales that keep their steps apart, whatever the tone.
6
+
7
+ - **Breaking: tone scales are one ladder, and the tone sits on its nearest
8
+ step.** Every tone scale (`tone-1-*` … `tone-3-*`, `tone-info-*`,
9
+ `tone-warning-*`, `success-*`, `destructive-*`) now uses one shared
10
+ ladder of depths per mode, so `bg-tone-1-100` and `bg-success-100` are
11
+ the same depth. The tone lands exactly on the step nearest its own
12
+ lightness, not always on 500. Before, a tone near one end of the range
13
+ squeezed five steps into the little room left past it: in dark mode,
14
+ light status colours (Poppy, Prism) had 600–950 almost
15
+ indistinguishable, and deep tones in light mode crowded 800–950. Now the
16
+ steps either side stretch to keep the ladder's ends. Migration: where you
17
+ used `*-500` to mean the tone, use the tone token (`bg-success`,
18
+ `text-tone-1`). The other steps keep their roles (100 a wash, 700/800
19
+ text), but may be a little lighter or deeper than before.
20
+ - **Tone steps stay in sRGB for any hue.** A tone scale's chroma falls from
21
+ the tone toward each end of the ladder, under a bound fitted per step
22
+ over the whole hue circle, so a customised or app-defined tone can't push
23
+ a step out of gamut. This replaces the fixed caps on the light steps.
24
+ - **Yellow sits a little deeper in dark mode** (500 at L 0.78, was 0.82), so
25
+ its 800–950 no longer crowd against the ink.
26
+ - **The palette tests hold spacing.** Neighbouring steps of every scale, in
27
+ every theme and mode, are at least 3 apart in OKLab (the 50→100 washes
28
+ 1.4), and every tone sits exactly on its nearest step. Before, the only
29
+ check was that each step moved 0.005 in lightness, and 73 of 224 scales
30
+ had a pair of neighbouring steps under 3 apart.
31
+
3
32
  ## 0.12.0
4
33
 
5
34
  Getting to a working first component, finding the right example, moving over from shadcn, and the components that move called for: Menubar, NavigationMenu, InputGroup, ButtonGroup, CaretMenu and bottom-sheet snap points.
package/DESIGN.md CHANGED
@@ -85,9 +85,9 @@ Roles are the contract, and roles are not enough for a product: tags, avatars, l
85
85
  - **Nine families:** `neutral`, `red`, `orange`, `yellow`, `green`, `teal`, `blue`, `purple` and `pink`, each 50–950, as Tailwind utilities (`bg-blue-100`, `text-pink-700`) and variables (`--teal-500`). Tailwind's other families are switched off.
86
86
  - **The lean.** A family keeps its own hue and leans toward the brand by half the gap, at most 15°, and only as far as the brand has colour (an ink-black primary pulls nothing). It's Material 3's harmonize, and the same lean the customizer gives status colours. `--theme-palette-harmony` scales it: 0 keeps the families' own hues, 2 doubles the pull.
87
87
  - **Neutral** is the theme's own `--background` mixed toward its `--foreground`, so it carries the surfaces' tint.
88
- - **Tone scales.** Every tone (tone-1…3, info, warning, success, destructive) gets a scale anchored on itself: step 500 is the tone, so `bg-tone-1-100` is its wash.
88
+ - **Tone scales.** Every tone (tone-1…3, info, warning, success, destructive) gets a scale on one shared ladder of depths, so `bg-tone-1-100` and `bg-success-100` are the same depth. The tone sits exactly on the step nearest its own lightness: a mid tone is 500, a light status colour in dark mode is 800. The steps either side stretch to keep the ladder's ends, so a tone near one end does not crush five steps into the little room left past it. Use `--success` itself for the tone, and the steps for its washes and deeper inks. Chroma falls from the tone toward each end, under an sRGB bound fitted per step over the whole hue circle, since a tone can be any hue.
89
89
  - **Steps follow the mode.** A low step is always near the page and a high step always far from it, so a pair like `bg-blue-100 text-blue-800` reads in both modes with no `dark:`.
90
- - **Held, not hoped.** It's all relative-colour CSS computed where it is declared, so a preset, a customizer look or an app's `--primary` carries into it with no regeneration. Chroma is fitted under sRGB across the whole lean (piecewise, a knot every 5°), and `palette.test.ts` evaluates the shipped CSS for every built-in theme and mode: in gamut, steadily away from the page, `700` readable on the page, `800` readable on its own `100`, and neighbouring families apart.
90
+ - **Held, not hoped.** It's all relative-colour CSS computed where it is declared, so a preset, a customizer look or an app's `--primary` carries into it with no regeneration. Chroma is fitted under sRGB across the whole lean (piecewise, a knot every 5°), and `palette.test.ts` evaluates the shipped CSS for every built-in theme and mode: in gamut, steadily away from the page, `700` readable on the page, `800` readable on its own `100`, neighbouring steps at least 3 apart in OKLab (the 50→100 washes 1.4), every tone exactly on its nearest step, and neighbouring families apart.
91
91
 
92
92
  Components never name a step. They paint roles, which is what lets a theme restyle them. Where a component takes a family (Badge, Pill and StatusDot accept `tone="blue"`, a category with no meaning attached), it sets `data-palette` to the family and paints from the slots that fills: `palette-wash` (100), `palette-wash-strong` (200), `palette-edge` (300), `palette-dot` (500), `palette-solid` (700), `palette-text` (800) and `palette-solid-ink` (50). The classes are the same for every family, and each ink-on-fill pair is held to 4.5:1. An app can use `data-palette` the same way.
93
93
 
@@ -486,8 +486,8 @@
486
486
  "dist/icon-sets/brands.js": "9a37d8739f14f2a9",
487
487
  "dist/icon-sets/reicon.d.ts": "52f6e41dc8137b4e",
488
488
  "dist/icon-sets/reicon.js": "9ec7d3b714c57172",
489
- "dist/index.d.ts": "4590fe01256ba238",
490
- "dist/index.js": "4382ef49653a6298",
489
+ "dist/index.d.ts": "933e9604a361c5af",
490
+ "dist/index.js": "ff3e1234cfdff10a",
491
491
  "dist/ios/chrome.css": "a7ca9e3735d8658e",
492
492
  "dist/ios/chrome.js": "37091fef7b68bd28",
493
493
  "dist/ios/frame.css": "dd2703c944ce575a",
@@ -542,7 +542,7 @@
542
542
  "dist/lib/hit-target.js": "b2ad19bc6d3271e0",
543
543
  "dist/lib/is-promise.js": "cc36f1bd7d4d4461",
544
544
  "dist/lib/meta.js": "e3b0c44298fc1c14",
545
- "dist/lib/palette.js": "16ac07eaf2bec901",
545
+ "dist/lib/palette.js": "3665b25d31bae763",
546
546
  "dist/lib/portal-theme-scope.js": "2c0d22d961e51174",
547
547
  "dist/lib/presentation.js": "8e4f69cd7205bd55",
548
548
  "dist/lib/refs.js": "e6f9ac5875431c2f",
@@ -568,7 +568,7 @@
568
568
  "dist/motion/useInView.js": "6136ad61107db838",
569
569
  "dist/motion/useReducedMotion.js": "ae7c093aac26e254",
570
570
  "dist/motion/viewTransition.js": "8c0b37b9c412cdd2",
571
- "dist/palette.css": "ab718659648331d2",
571
+ "dist/palette.css": "9d7dc655c3d06ac0",
572
572
  "dist/patterns/auth-page.js": "c12f29a82f829a16",
573
573
  "dist/patterns/auth-page.meta.js": "3053eb95f025fd27",
574
574
  "dist/patterns/brand-landing-page.js": "97554ec5c5c36e73",
package/dist/index.d.ts CHANGED
@@ -8933,8 +8933,11 @@ declare function useSmoothWheel({ axis, mapVertical, smooth, }?: SmoothWheelOpti
8933
8933
  * - **neutral** is the theme's own page and ink mixed in steps, so it carries
8934
8934
  * whatever tint the theme's surfaces do.
8935
8935
  * - Every **tone** (tone-1…3, info, warning, success, destructive) gets a scale
8936
- * anchored on itself: step 500 IS the tone, the rest walk from it toward the
8937
- * page and toward the ink.
8936
+ * on one shared ladder of depths, and the tone lands exactly on the step
8937
+ * nearest its own lightness: a light status colour in dark mode is 800, a
8938
+ * mid one is 500. The steps either side stretch to keep the ladder's ends,
8939
+ * so a tone near one end does not crush five steps into the little room
8940
+ * left past it, and tone-1-100 and success-100 are the same depth.
8938
8941
  *
8939
8942
  * Steps follow the mode rather than literal lightness: a low step is always
8940
8943
  * near the page and a high step always far from it, so 800 text on a 100
@@ -8966,6 +8969,6 @@ declare const PALETTE_TONES: readonly ["tone-1", "tone-2", "tone-3", "tone-info"
8966
8969
  /** Everything the palette names: neutral, the families, then the tone scales. */
8967
8970
  declare const PALETTE_SCALES: readonly ["neutral", ...string[], "tone-1", "tone-2", "tone-3", "tone-info", "tone-warning", "success", "destructive"];
8968
8971
 
8969
- declare const SABLE_UI_VERSION: "0.12.0";
8972
+ declare const SABLE_UI_VERSION: "0.13.0";
8970
8973
 
8971
8974
  export { Accordion, AccordionItem, AccordionPanel, AccordionTrigger, AlertDialog, AlertDialogClose, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogOverlay, AlertDialogTitle, AlertDialogTrigger, AppHeader, type AppHeaderProps, AppShell, type AppShellProps, AreaChart, type AreaChartProps, type ArtTone, Attachment, type AttachmentProps, Avatar, AvatarFallback, AvatarGroup, AvatarGroupCount, type AvatarGroupCountProps, type AvatarGroupProps, AvatarImage, type AvatarProps, AvatarRoot, BADGE_APPEARANCES, BADGE_TONES, Badge, type BadgeAppearance, type BadgeProps, type BadgeTone, Banner, type BannerProps, BarChart, type BarChartProps, BottomNav, BottomNavItem, type BottomNavItemProps, BreadcrumbItem, type BreadcrumbItemProps, BreadcrumbLink, type BreadcrumbLinkProps, BreadcrumbPage, type BreadcrumbPageProps, BreadcrumbSeparator, type BreadcrumbSeparatorProps, Breadcrumbs, type BreadcrumbsProps, Browser, type BrowserProps, Bubble, type BubbleProps, BubbleReaction, type BubbleReactionProps, BubbleReactions, type BubbleReactionsProps, Button, type ButtonBleed, ButtonGroup, type ButtonGroupProps, type ButtonProps, CHART_SERIES_COUNT, COMPONENT_GROUPS, COMPONENT_TAXONOMY, Calendar, type CalendarProps, Card, CardAction, CardContent, type CardContentProps, CardDescription, CardFooter, type CardFooterProps, CardHeader, CardList, type CardProps, CardTitle, type CardTitleProps, CaretMenu, CaretMenuItem, type CaretMenuItemProps, type CaretMenuProps, type CaretTrigger, type CaretTriggerField, type CaretTriggerMatch, Carousel, type CarouselProps, type CarouselSlidesToShow, type ChartCategories, type ChartCenterLabel, type ChartCurve, type ChartDatum, type ChartSeries, type ChartTone, type ChartTooltipIndicator, type ChartTooltipOptions, type ChartValueFormatter, ChatComposer, type ChatComposerProps, Checkbox, CheckboxCard, type CheckboxCardProps, type CheckboxCardTone, CheckboxGroup, type CheckboxGroupProps, Code, CodeBlock, type CodeBlockProps, CodeHighlightProvider, type CodeHighlighter, type CodeProps, Collapsible, CollapsibleIndicator, CollapsiblePanel, CollapsibleTrigger, ColorField, type ColorFieldProps, Combobox, ComboboxChips, ComboboxClear, ComboboxContent, ComboboxEmpty, ComboboxGroup, ComboboxGroupLabel, ComboboxInput, ComboboxItem, type ComboboxItemGroup, ComboboxItemIndicator, ComboboxList, ComboboxPortal, type ComboboxProps, ComboboxValue, ComboboxVirtualList, type ComboboxVirtualListProps, type CommandFilter, type CommandItem, CommandMenu, CommandMenuGroup, type CommandMenuGroupProps, CommandMenuItem, type CommandMenuItemProps, CommandMenuPanel, type CommandMenuPanelProps, type CommandMenuProps, CommandMenuTrigger, type CommandMenuTriggerProps, type ComponentGroup, type ComponentGuidance, ComponentMeta, type ComponentRegister, type ConstraintFlag, ContextCard, ContextCardArrow, ContextCardContent, ContextCardPortal, ContextCardTrigger, ContextMenu, ContextMenuContent, ContextMenuGroup, ContextMenuGroupLabel, ContextMenuItem, ContextMenuPortal, ContextMenuSeparator, ContextMenuTrigger, type CopySource, DataTable, type DataTableColumn, type DataTableProps, type DataTableRowKey, DatePicker, type DatePickerProps, DateTile, type DateTileProps, Density, DensityProvider, Density as DensityValue, DestructiveActionModal, type DestructiveActionModalProps, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, type DialogSize, DialogTitle, DialogTrigger, DisclosurePicker, DisclosurePickerEmpty, DisclosurePickerList, type DisclosurePickerListProps, DisclosurePickerOption, type DisclosurePickerOptionProps, DisclosurePickerPanel, type DisclosurePickerPanelProps, type DisclosurePickerProps, type DisclosurePickerSearch, DisclosurePickerTrigger, type DisclosurePickerTriggerProps, EmptyState, type EmptyStateProps, Entity, type EntityProps, Feedback, type FeedbackData, type FeedbackProps, type FeedbackRating, Field, type FieldProps, Fieldset, FieldsetContent, FieldsetDescription, FieldsetFooter, FieldsetLegend, type FieldsetVariant, FileDropzone, type FileDropzoneProps, type FileRejection, type FileRejectionCode, FontPicker, type FontPickerFont, type FontPickerOption, type FontPickerProps, Form, type FormProps, GlidingHighlight, type GlidingHighlightProps, GradientArt, type GradientArtProps, type Hsv, InlineStatus, type InlineStatusProps, type StatusTone as InlineTone, Input, InputGroup, type InputGroupProps, type InputProps$1 as InputProps, Kbd, KbdGroup, type KbdGroupProps, type KbdProps, Label, type LabelProps$2 as LabelProps, LineChart, type LineChartProps, Marker, type MarkerProps, Marquee, type MarqueeProps, MediaImage, type MediaImageProps, MediaTile, type MediaTileProps, Menu, MenuCheckboxItem, MenuContent, MenuGroup, MenuGroupLabel, MenuItem, MenuLinkItem, MenuPortal, MenuRadioGroup, MenuRadioItem, MenuSeparator, MenuSubmenu, MenuSubmenuTrigger, MenuTrigger, Menubar, type MenubarProps, MenubarTrigger, type MenubarTriggerProps, Message, type MessageProps, MessageScroller, type MessageScrollerHandle, type MessageScrollerProps, Meter, MeterIndicator, MeterLabel, type MeterSize, type MeterTone, MeterTrack, MeterValue, MiddleTruncate, type MiddleTruncateProps, type MotionPolicy, MotionProvider, type MotionProviderProps, NavigationMenu, NavigationMenuContent, NavigationMenuItem, NavigationMenuLink, NavigationMenuList, NavigationMenuTrigger, Note, type NoteAction, type NoteProps, NotificationBadge, type NotificationBadgeProps, NumberField, type NumberFieldProps, type OrbMode, type OrbSize, OtpField, type OtpFieldProps, OverflowMenu, type OverflowMenuProps, PALETTE_COLORS, PALETTE_FAMILIES, PALETTE_SCALES, PALETTE_STEPS, PALETTE_TONES, PageHeader, type PageHeaderProps, PageLoader, type PageLoaderProps, Pagination, type PaginationProps, type PaletteColor, type PaletteFamily, type PaletteStep, Panel, PanelGroup, PanelResizer, type PanelResizerProps, PanelSection, type PanelWidthBounds, Phone, type PhoneProps, PieChart, type PieChartProps, Pill, type PillProps, Popover, PopoverArrow, PopoverClose, PopoverContent, PopoverDescription, PopoverPortal, PopoverTitle, PopoverTrigger, Presence, type PresenceProps, type Presentation, PresentationProvider, Progress, ProgressIndicator, ProgressLabel, type ProgressSize, ProgressTrack, ProgressValue, PropertyGroup, PropertyPair, PropertyRow, RadarChart, type RadarChartProps, RadialChart, type RadialChartProps, Radio, RadioCard, type RadioCardProps, type RadioCardTone, RadioGroup, RelativeTime, type RelativeTimeProps, Reveal, type RevealProps, type Rgb, SABLE_UI_VERSION, SEGMENTED_BAR_TONES, STATUS_TONES, STATUS_TONE_ICON, type ScrollCommandOptions, Scroller, type ScrollerProps, ScrubField, type ScrubFieldProps, SearchInput, type SearchInputProps, SectionHeader, type SectionHeaderProps, SegmentedBar, type SegmentedBarProps, type SegmentedBarSegment, type SegmentedBarTone, Select, SelectContent, SelectGroup, SelectGroupLabel, SelectItem, SelectPortal, SelectSeparator, SelectTrigger, SelectValue, Separator, type SeparatorProps$2 as SeparatorProps, SettingsMenu, type SettingsMenuProps, SettingsRow, type SettingsRowProps, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetList, SheetPortal, type SheetProps, type SheetSnapPoint, SheetTitle, SheetTrigger, ShowMore, type ShowMoreProps, SideNav, type SideNavActiveVariant, SideNavGroup, type SideNavGroupProps, SideNavItem, type SideNavItemProps, type SideNavProps, type SideNavSize, Sidebar, SidebarBrand, type SidebarBrandProps, SidebarFooter, SidebarHeader, SidebarItem, type SidebarItemProps, SidebarNav, type SidebarProps, SimpleTooltip, Skeleton, SkipLink, Slider, SliderControl, SliderIndicator, SliderRoot, SliderThumb, SliderTrack, SliderValue, type SmoothWheelOptions, Sparkline, type SparklineProps, Spinner, type SpinnerProps, StatusBar, StatusBarGroup, StatusBarSeparator, StatusDot, type StatusDotProps, type StatusTone, type StepStatus, Stepper, StepperItem, type StepperItemProps, type StepperOrientation, type StepperProps, StreamingText, type StreamingTextProps, Switch, TRANSPARENT, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsPanel as TabsContent, TabsList, TabsPanel, TabsTrigger, TextReveal, type TextRevealProps, Textarea, type TextareaProps, ThemeId, ThemeManifest, ThemeMode$1 as ThemeManifestMode, type ThemeMode, ThemePreview, type ThemePreviewProps, ThemeSelector, type ThemeSelectorProps, ThemeSwitcher, type ThemeSwitcherProps, ThinkingOrb, type ThinkingOrbProps, ToastAction, type ToastApi, ToastClose, ToastContent, ToastDescription, type ToastManagerApi, type ToastOptions, type ToastPosition, ToastProvider, type ToastProviderProps, ToastRoot, ToastTitle, type ToastType, ToastViewport, Toggle, ToggleGroup, type ToggleGroupAppearance, Toggle as ToggleGroupItem, Toolbar, ToolbarButton, type ToolbarButtonProps, ToolbarGroup, type ToolbarGroupProps, ToolbarInput, type ToolbarInputProps, ToolbarLink, type ToolbarLinkProps, type ToolbarProps, ToolbarSeparator, type ToolbarSeparatorProps, Tooltip, TooltipArrow, TooltipContent, TooltipPortal, TooltipProvider, TooltipTrigger, Tree, TreeAddRow, TreeEmpty, TreeRow, TreeSection, type UseCaretTriggerOptions, type UseCaretTriggerResult, type UseCopyOptions, type UseCopyResult, type UseInViewOptions, type UsePanelWidthOptions, Video, type VideoProps, ViewTransitionName, type ViewTransitionNameProps, Workspace, WorkspaceBar, WorkspaceCanvas, accordionMeta, appHeaderMeta, appShellMeta, areaChartMeta, attachmentMeta, avatarGroupVariants, avatarMeta, avatarVariants, badgeMeta, badgeVariants, bannerMeta, bannerVariants, barChartMeta, bottomNavMeta, breadcrumbsMeta, browserMeta, bubbleMeta, buttonGroupMeta, buttonMeta, buttonVariants, calendarMeta, cardMeta, caretMenuMeta, carouselMeta, chartColor, toneColor as chartToneColor, chatComposerMeta, checkboxCardMeta, checkboxMeta, cn, codeBlockMeta, codeMeta, collapsibleMeta, colorFieldMeta, comboboxMeta, commandMenuMeta, componentGuidance, componentLabel, componentSlug, componentsInGroup, contextCardMeta, contextMenuMeta, dataTableMeta, datePickerMeta, dateTileMeta, destructiveActionModalMeta, dialogMeta, disclosurePickerMeta, emptyStateMeta, entityMeta, feedbackMeta, fieldsetMeta, fileDropzoneMeta, fileDropzoneVariants, fontPickerMeta, formMeta, formatFileSize, formatHex, glidingHighlightMeta, gradientArtMeta, hsvToRgb, hueColor, inlineStatusMeta, inputGroupMeta, inputMeta, isPaletteColor, isTransparent, kbdMeta, labelMeta, lineChartMeta, markerMeta, marqueeMeta, mediaImageMeta, mediaTileMeta, menuMeta, menubarMeta, messageMeta, messageScrollerMeta, meterIndicatorVariants, meterMeta, meterTrackVariants, middleTruncateMeta, navigationMenuMeta, noteMeta, noteVariants, notificationBadgeMeta, notificationCountVariants, notificationDotVariants, numberFieldMeta, otpFieldMeta, overflowMenuMeta, pageHeaderMeta, pageLoaderMeta, paginationMeta, panelGroupMeta, panelSectionMeta, parseHex, phoneMeta, pieChartMeta, pillMeta, pillVariants, popoverMeta, progressMeta, progressTrackVariants, radarChartMeta, radialChartMeta, radioCardMeta, radioMeta, relativeTimeMeta, rgbToHsv, scrollerMeta, scrubFieldMeta, searchInputMeta, sectionHeaderMeta, segmentedBarMeta, segmentedBarSegmentVariants, segmentedBarVariants, selectMeta, separatorMeta, settingsMenuMeta, sheetMeta, sheetVariants, showMoreMeta, sideNavMeta, sidebarMeta, skeletonMeta, sliderMeta, sparklineMeta, spinnerMeta, startViewTransition, statusBarMeta, statusDotMeta, statusDotVariants, stepperConnectorVariants, stepperIndicatorVariants, stepperMeta, streamingTextMeta, supportsViewTransitions, switchMeta, tableMeta, tabsMeta, textareaMeta, themeSelectorMeta, themeSwitcherMeta, thinkingOrbMeta, toast, toastMeta, toggleMeta, toolbarGroupVariants, toolbarMeta, toolbarSeparatorVariants, toolbarVariants, tooltipMeta, treeIndent, treeMeta, useAnchoredDensity, useCaretTrigger, useComboboxFilteredItems, useCommandMenuShortcut, useCopy, useDensity, useDisclosurePicker, useInView, useMotion, usePanelWidth, usePresentation, useReducedMotion, useScrollActivity, useSidebar, useSmoothWheel, useToast, useToastManager, useTypeTier, videoMeta, workspaceMeta };
package/dist/index.js CHANGED
@@ -172,7 +172,7 @@ import {
172
172
  } from "./lib/use-caret-trigger.js";
173
173
  import { STATUS_TONES, STATUS_TONE_ICON } from "./lib/status-tone.js";
174
174
  import { PALETTE_COLORS, PALETTE_FAMILIES, PALETTE_SCALES, PALETTE_STEPS, PALETTE_TONES, isPaletteColor } from "./lib/palette.js";
175
- var SABLE_UI_VERSION = "0.12.0";
175
+ var SABLE_UI_VERSION = "0.13.0";
176
176
  export {
177
177
  ART_TOKENS,
178
178
  CHART_SERIES_COUNT,
@@ -4,7 +4,9 @@ var PALETTE_FAMILIES = [
4
4
  { name: "red", hue: 25, light: { l: 0.6, c: 0.21 }, dark: { l: 0.64, c: 0.2 } },
5
5
  { name: "orange", hue: 50, light: { l: 0.69, c: 0.18 }, dark: { l: 0.71, c: 0.17 } },
6
6
  // Yellow is only yellow when it is light; at 0.6 it is olive.
7
- { name: "yellow", hue: 92, light: { l: 0.83, c: 0.16 }, dark: { l: 0.82, c: 0.15 } },
7
+ // In dark mode it sits a little deeper, or 800–950 crowd into the room
8
+ // left between it and the ink.
9
+ { name: "yellow", hue: 92, light: { l: 0.83, c: 0.16 }, dark: { l: 0.78, c: 0.15 } },
8
10
  { name: "green", hue: 145, light: { l: 0.64, c: 0.17 }, dark: { l: 0.68, c: 0.16 } },
9
11
  { name: "teal", hue: 190, light: { l: 0.7, c: 0.12 }, dark: { l: 0.74, c: 0.12 } },
10
12
  { name: "blue", hue: 262, light: { l: 0.6, c: 0.19 }, dark: { l: 0.64, c: 0.17 } },
@@ -69,10 +71,15 @@ var NEUTRAL_MIX = {
69
71
  900: 90,
70
72
  950: 95
71
73
  };
72
- var TONE_CHROMA_CAP = {
73
- light: { 50: 0.02, 100: 0.04, 200: 0.07, 300: 0.11 },
74
- dark: { 50: 0.035, 100: 0.05, 200: 0.07, 300: 0.1 }
74
+ var TONE_LADDER = {
75
+ light: { 50: 0.975, 100: 0.945, 200: 0.895, 300: 0.82, 400: 0.725, 500: 0.63, 600: 0.55, 700: 0.47, 800: 0.4, 900: 0.33, 950: 0.27 },
76
+ dark: { 50: 0.215, 100: 0.25, 200: 0.31, 300: 0.39, 400: 0.5, 500: 0.6, 600: 0.69, 700: 0.77, 800: 0.84, 900: 0.895, 950: 0.94 }
75
77
  };
78
+ var TONE_CHROMA_ENDS = {
79
+ light: { page: 0.12, ink: 0.52 },
80
+ dark: { page: 0.25, ink: 0.3 }
81
+ };
82
+ var TONE_SNAP = 1e4;
76
83
  var LEAN = { amount: 0.5, cap: 15, fullAt: 0.06, maxHarmony: 2 };
77
84
  var LEAN_REACH = LEAN.cap * LEAN.maxHarmony;
78
85
  var clamp = (n, lo, hi) => Math.min(hi, Math.max(lo, n));
@@ -85,6 +92,34 @@ function stepFrom(anchor, step, mode) {
85
92
  const curve = STEP_CURVES[mode][step];
86
93
  return { l: anchor.l + (curve.target - anchor.l) * curve.pull, c: anchor.c * curve.chroma };
87
94
  }
95
+ function ladderDepth(l, mode) {
96
+ const top = TONE_LADDER[mode][50];
97
+ return mode === "light" ? top - l : l - top;
98
+ }
99
+ function toneAnchor(l, mode) {
100
+ const ladder = TONE_LADDER[mode];
101
+ let depth = 0;
102
+ for (let i = 1; i < PALETTE_STEPS.length; i++) {
103
+ const [before, at] = [ladder[PALETTE_STEPS[i - 1]], ladder[PALETTE_STEPS[i]]];
104
+ const mid = (before + at) / 2;
105
+ depth += Math.abs(at - before) * clamp((mode === "light" ? mid - l : l - mid) * TONE_SNAP, 0, 1);
106
+ }
107
+ return depth;
108
+ }
109
+ function toneStep(tone, step, mode) {
110
+ const end = ladderDepth(TONE_LADDER[mode][950], mode);
111
+ const at = ladderDepth(TONE_LADDER[mode][step], mode);
112
+ const anchor = toneAnchor(tone.l, mode);
113
+ const own = ladderDepth(tone.l, mode);
114
+ const pageSide = clamp((anchor - at) * TONE_SNAP, 0, 1);
115
+ const towardPage = at * own / Math.max(anchor, 1e-3);
116
+ const towardInk = own + (at - anchor) * (end - own) / Math.max(end - anchor, 1e-3);
117
+ const depth = pageSide * towardPage + (1 - pageSide) * towardInk;
118
+ const ends = TONE_CHROMA_ENDS[mode];
119
+ const share = pageSide * (1 - (1 - ends.page) * ((anchor - at) / Math.max(anchor, 1e-3))) + (1 - pageSide) * (1 - (1 - ends.ink) * ((at - anchor) / Math.max(end - anchor, 1e-3)));
120
+ const top = TONE_LADDER[mode][50];
121
+ return { l: mode === "light" ? top - depth : top + depth, c: tone.c * share, anchor: Math.abs(at - anchor) * TONE_SNAP < 1 };
122
+ }
88
123
  export {
89
124
  LEAN,
90
125
  LEAN_REACH,
@@ -96,8 +131,13 @@ export {
96
131
  PALETTE_STEPS,
97
132
  PALETTE_TONES,
98
133
  STEP_CURVES,
99
- TONE_CHROMA_CAP,
134
+ TONE_CHROMA_ENDS,
135
+ TONE_LADDER,
136
+ TONE_SNAP,
100
137
  familyHue,
101
138
  isPaletteColor,
102
- stepFrom
139
+ ladderDepth,
140
+ stepFrom,
141
+ toneAnchor,
142
+ toneStep
103
143
  };
package/dist/palette.css CHANGED
@@ -127,83 +127,122 @@
127
127
  --pink-800: oklch(from var(--_palette-pink) 0.38 min(0.16, calc(0.1516 + -0.00038 * clamp(0, (mod(h - 350 + 540, 360) - 180), 5) + -0.00027 * clamp(0, (mod(h - 350 + 540, 360) - 180) - 5, 5) + -0.00014 * clamp(0, (mod(h - 350 + 540, 360) - 180) - 10, 5))) h);
128
128
  --pink-900: oklch(from var(--_palette-pink) 0.3125 min(0.132, calc(0.1248 + -0.00032 * clamp(0, (mod(h - 350 + 540, 360) - 180), 5) + -0.00022 * clamp(0, (mod(h - 350 + 540, 360) - 180) - 5, 5) + -0.00012 * clamp(0, (mod(h - 350 + 540, 360) - 180) - 10, 5))) h);
129
129
  --pink-950: oklch(from var(--_palette-pink) 0.254 min(0.104, calc(0.1017 + -0.00026 * clamp(0, (mod(h - 350 + 540, 360) - 180), 5) + -0.00018 * clamp(0, (mod(h - 350 + 540, 360) - 180) - 5, 5) + -0.00002 * clamp(0, (mod(h - 350 + 540, 360) - 180) - 15, 5))) h);
130
- --tone-1-50: oklch(from var(--tone-1) calc(l + (0.985 - l) * 0.94) min(calc(c * 0.12), 0.02) h);
131
- --tone-1-100: oklch(from var(--tone-1) calc(l + (0.985 - l) * 0.86) min(calc(c * 0.22), 0.04) h);
132
- --tone-1-200: oklch(from var(--tone-1) calc(l + (0.985 - l) * 0.7) min(calc(c * 0.4), 0.07) h);
133
- --tone-1-300: oklch(from var(--tone-1) calc(l + (0.985 - l) * 0.5) min(calc(c * 0.62), 0.11) h);
134
- --tone-1-400: oklch(from var(--tone-1) calc(l + (0.985 - l) * 0.26) calc(c * 0.85) h);
135
- --tone-1-500: var(--tone-1);
136
- --tone-1-600: oklch(from var(--tone-1) calc(l + (0.2 - l) * 0.2) calc(c * 1) h);
137
- --tone-1-700: oklch(from var(--tone-1) calc(l + (0.2 - l) * 0.5) calc(c * 0.92) h);
138
- --tone-1-800: oklch(from var(--tone-1) calc(l + (0.2 - l) * 0.6) calc(c * 0.8) h);
139
- --tone-1-900: oklch(from var(--tone-1) calc(l + (0.2 - l) * 0.75) calc(c * 0.66) h);
140
- --tone-1-950: oklch(from var(--tone-1) calc(l + (0.2 - l) * 0.88) calc(c * 0.52) h);
141
- --tone-2-50: oklch(from var(--tone-2) calc(l + (0.985 - l) * 0.94) min(calc(c * 0.12), 0.02) h);
142
- --tone-2-100: oklch(from var(--tone-2) calc(l + (0.985 - l) * 0.86) min(calc(c * 0.22), 0.04) h);
143
- --tone-2-200: oklch(from var(--tone-2) calc(l + (0.985 - l) * 0.7) min(calc(c * 0.4), 0.07) h);
144
- --tone-2-300: oklch(from var(--tone-2) calc(l + (0.985 - l) * 0.5) min(calc(c * 0.62), 0.11) h);
145
- --tone-2-400: oklch(from var(--tone-2) calc(l + (0.985 - l) * 0.26) calc(c * 0.85) h);
146
- --tone-2-500: var(--tone-2);
147
- --tone-2-600: oklch(from var(--tone-2) calc(l + (0.2 - l) * 0.2) calc(c * 1) h);
148
- --tone-2-700: oklch(from var(--tone-2) calc(l + (0.2 - l) * 0.5) calc(c * 0.92) h);
149
- --tone-2-800: oklch(from var(--tone-2) calc(l + (0.2 - l) * 0.6) calc(c * 0.8) h);
150
- --tone-2-900: oklch(from var(--tone-2) calc(l + (0.2 - l) * 0.75) calc(c * 0.66) h);
151
- --tone-2-950: oklch(from var(--tone-2) calc(l + (0.2 - l) * 0.88) calc(c * 0.52) h);
152
- --tone-3-50: oklch(from var(--tone-3) calc(l + (0.985 - l) * 0.94) min(calc(c * 0.12), 0.02) h);
153
- --tone-3-100: oklch(from var(--tone-3) calc(l + (0.985 - l) * 0.86) min(calc(c * 0.22), 0.04) h);
154
- --tone-3-200: oklch(from var(--tone-3) calc(l + (0.985 - l) * 0.7) min(calc(c * 0.4), 0.07) h);
155
- --tone-3-300: oklch(from var(--tone-3) calc(l + (0.985 - l) * 0.5) min(calc(c * 0.62), 0.11) h);
156
- --tone-3-400: oklch(from var(--tone-3) calc(l + (0.985 - l) * 0.26) calc(c * 0.85) h);
157
- --tone-3-500: var(--tone-3);
158
- --tone-3-600: oklch(from var(--tone-3) calc(l + (0.2 - l) * 0.2) calc(c * 1) h);
159
- --tone-3-700: oklch(from var(--tone-3) calc(l + (0.2 - l) * 0.5) calc(c * 0.92) h);
160
- --tone-3-800: oklch(from var(--tone-3) calc(l + (0.2 - l) * 0.6) calc(c * 0.8) h);
161
- --tone-3-900: oklch(from var(--tone-3) calc(l + (0.2 - l) * 0.75) calc(c * 0.66) h);
162
- --tone-3-950: oklch(from var(--tone-3) calc(l + (0.2 - l) * 0.88) calc(c * 0.52) h);
163
- --tone-info-50: oklch(from var(--tone-info) calc(l + (0.985 - l) * 0.94) min(calc(c * 0.12), 0.02) h);
164
- --tone-info-100: oklch(from var(--tone-info) calc(l + (0.985 - l) * 0.86) min(calc(c * 0.22), 0.04) h);
165
- --tone-info-200: oklch(from var(--tone-info) calc(l + (0.985 - l) * 0.7) min(calc(c * 0.4), 0.07) h);
166
- --tone-info-300: oklch(from var(--tone-info) calc(l + (0.985 - l) * 0.5) min(calc(c * 0.62), 0.11) h);
167
- --tone-info-400: oklch(from var(--tone-info) calc(l + (0.985 - l) * 0.26) calc(c * 0.85) h);
168
- --tone-info-500: var(--tone-info);
169
- --tone-info-600: oklch(from var(--tone-info) calc(l + (0.2 - l) * 0.2) calc(c * 1) h);
170
- --tone-info-700: oklch(from var(--tone-info) calc(l + (0.2 - l) * 0.5) calc(c * 0.92) h);
171
- --tone-info-800: oklch(from var(--tone-info) calc(l + (0.2 - l) * 0.6) calc(c * 0.8) h);
172
- --tone-info-900: oklch(from var(--tone-info) calc(l + (0.2 - l) * 0.75) calc(c * 0.66) h);
173
- --tone-info-950: oklch(from var(--tone-info) calc(l + (0.2 - l) * 0.88) calc(c * 0.52) h);
174
- --tone-warning-50: oklch(from var(--tone-warning) calc(l + (0.985 - l) * 0.94) min(calc(c * 0.12), 0.02) h);
175
- --tone-warning-100: oklch(from var(--tone-warning) calc(l + (0.985 - l) * 0.86) min(calc(c * 0.22), 0.04) h);
176
- --tone-warning-200: oklch(from var(--tone-warning) calc(l + (0.985 - l) * 0.7) min(calc(c * 0.4), 0.07) h);
177
- --tone-warning-300: oklch(from var(--tone-warning) calc(l + (0.985 - l) * 0.5) min(calc(c * 0.62), 0.11) h);
178
- --tone-warning-400: oklch(from var(--tone-warning) calc(l + (0.985 - l) * 0.26) calc(c * 0.85) h);
179
- --tone-warning-500: var(--tone-warning);
180
- --tone-warning-600: oklch(from var(--tone-warning) calc(l + (0.2 - l) * 0.2) calc(c * 1) h);
181
- --tone-warning-700: oklch(from var(--tone-warning) calc(l + (0.2 - l) * 0.5) calc(c * 0.92) h);
182
- --tone-warning-800: oklch(from var(--tone-warning) calc(l + (0.2 - l) * 0.6) calc(c * 0.8) h);
183
- --tone-warning-900: oklch(from var(--tone-warning) calc(l + (0.2 - l) * 0.75) calc(c * 0.66) h);
184
- --tone-warning-950: oklch(from var(--tone-warning) calc(l + (0.2 - l) * 0.88) calc(c * 0.52) h);
185
- --success-50: oklch(from var(--success) calc(l + (0.985 - l) * 0.94) min(calc(c * 0.12), 0.02) h);
186
- --success-100: oklch(from var(--success) calc(l + (0.985 - l) * 0.86) min(calc(c * 0.22), 0.04) h);
187
- --success-200: oklch(from var(--success) calc(l + (0.985 - l) * 0.7) min(calc(c * 0.4), 0.07) h);
188
- --success-300: oklch(from var(--success) calc(l + (0.985 - l) * 0.5) min(calc(c * 0.62), 0.11) h);
189
- --success-400: oklch(from var(--success) calc(l + (0.985 - l) * 0.26) calc(c * 0.85) h);
190
- --success-500: var(--success);
191
- --success-600: oklch(from var(--success) calc(l + (0.2 - l) * 0.2) calc(c * 1) h);
192
- --success-700: oklch(from var(--success) calc(l + (0.2 - l) * 0.5) calc(c * 0.92) h);
193
- --success-800: oklch(from var(--success) calc(l + (0.2 - l) * 0.6) calc(c * 0.8) h);
194
- --success-900: oklch(from var(--success) calc(l + (0.2 - l) * 0.75) calc(c * 0.66) h);
195
- --success-950: oklch(from var(--success) calc(l + (0.2 - l) * 0.88) calc(c * 0.52) h);
196
- --destructive-50: oklch(from var(--destructive) calc(l + (0.985 - l) * 0.94) min(calc(c * 0.12), 0.02) h);
197
- --destructive-100: oklch(from var(--destructive) calc(l + (0.985 - l) * 0.86) min(calc(c * 0.22), 0.04) h);
198
- --destructive-200: oklch(from var(--destructive) calc(l + (0.985 - l) * 0.7) min(calc(c * 0.4), 0.07) h);
199
- --destructive-300: oklch(from var(--destructive) calc(l + (0.985 - l) * 0.5) min(calc(c * 0.62), 0.11) h);
200
- --destructive-400: oklch(from var(--destructive) calc(l + (0.985 - l) * 0.26) calc(c * 0.85) h);
201
- --destructive-500: var(--destructive);
202
- --destructive-600: oklch(from var(--destructive) calc(l + (0.2 - l) * 0.2) calc(c * 1) h);
203
- --destructive-700: oklch(from var(--destructive) calc(l + (0.2 - l) * 0.5) calc(c * 0.92) h);
204
- --destructive-800: oklch(from var(--destructive) calc(l + (0.2 - l) * 0.6) calc(c * 0.8) h);
205
- --destructive-900: oklch(from var(--destructive) calc(l + (0.2 - l) * 0.75) calc(c * 0.66) h);
206
- --destructive-950: oklch(from var(--destructive) calc(l + (0.2 - l) * 0.88) calc(c * 0.52) h);
130
+ /* Depths along the ladder, 0 at step 50: the step the tone snaps to, the
131
+ tone's own, and the room either side of it. */
132
+ --_tone-anchor: calc(0.03 * clamp(0, (0.96 - l) * 10000, 1) + 0.05 * clamp(0, (0.92 - l) * 10000, 1) + 0.075 * clamp(0, (0.8575 - l) * 10000, 1) + 0.095 * clamp(0, (0.7725 - l) * 10000, 1) + 0.095 * clamp(0, (0.6775 - l) * 10000, 1) + 0.08 * clamp(0, (0.59 - l) * 10000, 1) + 0.08 * clamp(0, (0.51 - l) * 10000, 1) + 0.07 * clamp(0, (0.435 - l) * 10000, 1) + 0.07 * clamp(0, (0.365 - l) * 10000, 1) + 0.06 * clamp(0, (0.3 - l) * 10000, 1));
133
+ --_tone-own: calc(0.975 - l);
134
+ --_tone-page: max(var(--_tone-anchor), 0.001);
135
+ --_tone-ink: max(0.705 - var(--_tone-anchor), 0.001);
136
+ --_tone-side-50: clamp(0, (var(--_tone-anchor) - 0) * 10000, 1);
137
+ --_tone-l-50: calc(0.975 - (var(--_tone-side-50) * 0 * var(--_tone-own) / var(--_tone-page) + (1 - var(--_tone-side-50)) * (var(--_tone-own) + (0 - var(--_tone-anchor)) * (0.705 - var(--_tone-own)) / var(--_tone-ink))));
138
+ --_tone-c-50: min(calc(c * (1 - var(--_tone-side-50) * 0.88 * (var(--_tone-anchor) - 0) / var(--_tone-page) - (1 - var(--_tone-side-50)) * 0.48 * (0 - var(--_tone-anchor)) / var(--_tone-ink))), calc(0.0113 + -0.000009 * clamp(0, mod(h, 360) - 0, 30) + 0.000542 * clamp(0, mod(h, 360) - 60, 30) + 0.000817 * clamp(0, mod(h, 360) - 90, 15) + -0.000074 * clamp(0, mod(h, 360) - 120, 30) + -0.000176 * clamp(0, mod(h, 360) - 150, 30) + 0.000122 * clamp(0, mod(h, 360) - 180, 15) + -0.000983 * clamp(0, mod(h, 360) - 195, 15) + -0.000249 * clamp(0, mod(h, 360) - 210, 30) + -0.000029 * clamp(0, mod(h, 360) - 240, 30) + 0.00007 * clamp(0, mod(h, 360) - 270, 30) + 0.000177 * clamp(0, mod(h, 360) - 300, 30) + -0.000231 * clamp(0, mod(h, 360) - 330, 30) + c * (1 - clamp(0, max(0 - var(--_tone-anchor), var(--_tone-anchor) - 0) * 10000, 1))));
139
+ --_tone-side-100: clamp(0, (var(--_tone-anchor) - 0.03) * 10000, 1);
140
+ --_tone-l-100: calc(0.975 - (var(--_tone-side-100) * 0.03 * var(--_tone-own) / var(--_tone-page) + (1 - var(--_tone-side-100)) * (var(--_tone-own) + (0.03 - var(--_tone-anchor)) * (0.705 - var(--_tone-own)) / var(--_tone-ink))));
141
+ --_tone-c-100: min(calc(c * (1 - var(--_tone-side-100) * 0.88 * (var(--_tone-anchor) - 0.03) / var(--_tone-page) - (1 - var(--_tone-side-100)) * 0.48 * (0.03 - var(--_tone-anchor)) / var(--_tone-ink))), calc(0.0219 + -0.000018 * clamp(0, mod(h, 360) - 0, 30) + 0.000201 * clamp(0, mod(h, 360) - 30, 30) + 0.000459 * clamp(0, mod(h, 360) - 60, 15) + 0.001352 * clamp(0, mod(h, 360) - 75, 15) + 0.002662 * clamp(0, mod(h, 360) - 90, 7.5) + 0.008793 * clamp(0, mod(h, 360) - 97.5, 7.5) + 0.024147 * clamp(0, mod(h, 360) - 105, 1.875) + 0.005307 * clamp(0, mod(h, 360) - 106.875, 1.875) + 0.001212 * clamp(0, mod(h, 360) - 108.75, 3.75) + 0.00169 * clamp(0, mod(h, 360) - 112.5, 1.875) + -0.008345 * clamp(0, mod(h, 360) - 114.375, 1.875) + -0.010247 * clamp(0, mod(h, 360) - 116.25, 3.75) + -0.004702 * clamp(0, mod(h, 360) - 120, 7.5) + -0.002666 * clamp(0, mod(h, 360) - 127.5, 7.5) + -0.001315 * clamp(0, mod(h, 360) - 135, 15) + -0.000474 * clamp(0, mod(h, 360) - 150, 15) + -0.000158 * clamp(0, mod(h, 360) - 165, 15) + 0.000062 * clamp(0, mod(h, 360) - 180, 15) + -0.001967 * clamp(0, mod(h, 360) - 195, 15) + -0.000455 * clamp(0, mod(h, 360) - 210, 30) + -0.000066 * clamp(0, mod(h, 360) - 240, 30) + 0.000138 * clamp(0, mod(h, 360) - 270, 30) + 0.000351 * clamp(0, mod(h, 360) - 300, 30) + -0.000447 * clamp(0, mod(h, 360) - 330, 30) + c * (1 - clamp(0, max(0.03 - var(--_tone-anchor), var(--_tone-anchor) - 0.03) * 10000, 1))));
142
+ --_tone-side-200: clamp(0, (var(--_tone-anchor) - 0.08) * 10000, 1);
143
+ --_tone-l-200: calc(0.975 - (var(--_tone-side-200) * 0.08 * var(--_tone-own) / var(--_tone-page) + (1 - var(--_tone-side-200)) * (var(--_tone-own) + (0.08 - var(--_tone-anchor)) * (0.705 - var(--_tone-own)) / var(--_tone-ink))));
144
+ --_tone-c-200: min(calc(c * (1 - var(--_tone-side-200) * 0.88 * (var(--_tone-anchor) - 0.08) / var(--_tone-page) - (1 - var(--_tone-side-200)) * 0.48 * (0.08 - var(--_tone-anchor)) / var(--_tone-ink))), calc(0.0419 + 0.000013 * clamp(0, mod(h, 360) - 0, 30) + 0.000266 * clamp(0, mod(h, 360) - 30, 15) + 0.000419 * clamp(0, mod(h, 360) - 45, 15) + 0.000819 * clamp(0, mod(h, 360) - 60, 15) + 0.002483 * clamp(0, mod(h, 360) - 75, 15) + 0.006513 * clamp(0, mod(h, 360) - 90, 7.5) + 0.00678 * clamp(0, mod(h, 360) - 97.5, 3.75) + 0.000126 * clamp(0, mod(h, 360) - 101.25, 3.75) + 0.001413 * clamp(0, mod(h, 360) - 105, 15) + 0.002753 * clamp(0, mod(h, 360) - 120, 7.5) + 0.003436 * clamp(0, mod(h, 360) - 127.5, 1.875) + -0.004894 * clamp(0, mod(h, 360) - 129.375, 1.875) + -0.006766 * clamp(0, mod(h, 360) - 131.25, 3.75) + -0.003293 * clamp(0, mod(h, 360) - 135, 15) + -0.000558 * clamp(0, mod(h, 360) - 150, 30) + 0.000568 * clamp(0, mod(h, 360) - 180, 15) + -0.005322 * clamp(0, mod(h, 360) - 195, 7.5) + -0.002574 * clamp(0, mod(h, 360) - 202.5, 7.5) + -0.001381 * clamp(0, mod(h, 360) - 210, 15) + -0.000589 * clamp(0, mod(h, 360) - 225, 15) + -0.00021 * clamp(0, mod(h, 360) - 240, 30) + 0.000279 * clamp(0, mod(h, 360) - 270, 30) + 0.000848 * clamp(0, mod(h, 360) - 300, 15) + 0.001498 * clamp(0, mod(h, 360) - 315, 7.5) + -0.000366 * clamp(0, mod(h, 360) - 322.5, 7.5) + -0.000852 * clamp(0, mod(h, 360) - 330, 30) + c * (1 - clamp(0, max(0.08 - var(--_tone-anchor), var(--_tone-anchor) - 0.08) * 10000, 1))));
145
+ --_tone-side-300: clamp(0, (var(--_tone-anchor) - 0.155) * 10000, 1);
146
+ --_tone-l-300: calc(0.975 - (var(--_tone-side-300) * 0.155 * var(--_tone-own) / var(--_tone-page) + (1 - var(--_tone-side-300)) * (var(--_tone-own) + (0.155 - var(--_tone-anchor)) * (0.705 - var(--_tone-own)) / var(--_tone-ink))));
147
+ --_tone-c-300: min(calc(c * (1 - var(--_tone-side-300) * 0.88 * (var(--_tone-anchor) - 0.155) / var(--_tone-page) - (1 - var(--_tone-side-300)) * 0.48 * (0.155 - var(--_tone-anchor)) / var(--_tone-ink))), calc(0.0784 + -0.000094 * clamp(0, mod(h, 360) - 0, 30) + 0.000669 * clamp(0, mod(h, 360) - 30, 30) + 0.001981 * clamp(0, mod(h, 360) - 60, 15) + 0.003511 * clamp(0, mod(h, 360) - 75, 7.5) + -0.000293 * clamp(0, mod(h, 360) - 82.5, 7.5) + 0.000794 * clamp(0, mod(h, 360) - 90, 30) + 0.003146 * clamp(0, mod(h, 360) - 120, 15) + 0.004732 * clamp(0, mod(h, 360) - 135, 7.5) + -0.006952 * clamp(0, mod(h, 360) - 142.5, 7.5) + -0.003178 * clamp(0, mod(h, 360) - 150, 15) + -0.001281 * clamp(0, mod(h, 360) - 165, 15) + -0.000558 * clamp(0, mod(h, 360) - 180, 15) + 0.000056 * clamp(0, mod(h, 360) - 195, 15) + -0.00223 * clamp(0, mod(h, 360) - 210, 15) + -0.001151 * clamp(0, mod(h, 360) - 225, 15) + -0.000358 * clamp(0, mod(h, 360) - 240, 30) + 0.000495 * clamp(0, mod(h, 360) - 270, 30) + 0.001534 * clamp(0, mod(h, 360) - 300, 15) + 0.002565 * clamp(0, mod(h, 360) - 315, 7.5) + 0.003848 * clamp(0, mod(h, 360) - 322.5, 3.75) + -0.003834 * clamp(0, mod(h, 360) - 326.25, 3.75) + -0.001558 * clamp(0, mod(h, 360) - 330, 30) + c * (1 - clamp(0, max(0.155 - var(--_tone-anchor), var(--_tone-anchor) - 0.155) * 10000, 1))));
148
+ --_tone-side-400: clamp(0, (var(--_tone-anchor) - 0.25) * 10000, 1);
149
+ --_tone-l-400: calc(0.975 - (var(--_tone-side-400) * 0.25 * var(--_tone-own) / var(--_tone-page) + (1 - var(--_tone-side-400)) * (var(--_tone-own) + (0.25 - var(--_tone-anchor)) * (0.705 - var(--_tone-own)) / var(--_tone-ink))));
150
+ --_tone-c-400: min(calc(c * (1 - var(--_tone-side-400) * 0.88 * (var(--_tone-anchor) - 0.25) / var(--_tone-page) - (1 - var(--_tone-side-400)) * 0.48 * (0.25 - var(--_tone-anchor)) / var(--_tone-ink))), calc(0.1522 + -0.000786 * clamp(0, mod(h, 360) - 0, 15) + -0.000054 * clamp(0, mod(h, 360) - 15, 15) + 0.000603 * clamp(0, mod(h, 360) - 30, 15) + 0.001305 * clamp(0, mod(h, 360) - 45, 7.5) + -0.001086 * clamp(0, mod(h, 360) - 52.5, 7.5) + -0.000785 * clamp(0, mod(h, 360) - 60, 30) + 0.000855 * clamp(0, mod(h, 360) - 90, 30) + 0.0026 * clamp(0, mod(h, 360) - 120, 15) + 0.004193 * clamp(0, mod(h, 360) - 135, 7.5) + -0.006075 * clamp(0, mod(h, 360) - 142.5, 7.5) + -0.002757 * clamp(0, mod(h, 360) - 150, 15) + -0.001117 * clamp(0, mod(h, 360) - 165, 15) + -0.000484 * clamp(0, mod(h, 360) - 180, 15) + 0.000091 * clamp(0, mod(h, 360) - 195, 15) + 0.000766 * clamp(0, mod(h, 360) - 210, 15) + 0.001546 * clamp(0, mod(h, 360) - 225, 7.5) + -0.00084 * clamp(0, mod(h, 360) - 232.5, 7.5) + -0.000497 * clamp(0, mod(h, 360) - 240, 30) + 0.000595 * clamp(0, mod(h, 360) - 270, 15) + 0.000931 * clamp(0, mod(h, 360) - 285, 15) + 0.00244 * clamp(0, mod(h, 360) - 300, 15) + 0.004381 * clamp(0, mod(h, 360) - 315, 7.5) + 0.006615 * clamp(0, mod(h, 360) - 322.5, 3.75) + 0.004613 * clamp(0, mod(h, 360) - 326.25, 1.875) + -0.007903 * clamp(0, mod(h, 360) - 328.125, 1.875) + -0.003442 * clamp(0, mod(h, 360) - 330, 15) + -0.001484 * clamp(0, mod(h, 360) - 345, 15) + c * (1 - clamp(0, max(0.25 - var(--_tone-anchor), var(--_tone-anchor) - 0.25) * 10000, 1))));
151
+ --_tone-side-500: clamp(0, (var(--_tone-anchor) - 0.345) * 10000, 1);
152
+ --_tone-l-500: calc(0.975 - (var(--_tone-side-500) * 0.345 * var(--_tone-own) / var(--_tone-page) + (1 - var(--_tone-side-500)) * (var(--_tone-own) + (0.345 - var(--_tone-anchor)) * (0.705 - var(--_tone-own)) / var(--_tone-ink))));
153
+ --_tone-c-500: min(calc(c * (1 - var(--_tone-side-500) * 0.88 * (var(--_tone-anchor) - 0.345) / var(--_tone-page) - (1 - var(--_tone-side-500)) * 0.48 * (0.345 - var(--_tone-anchor)) / var(--_tone-ink))), calc(0.2297 + -0.00087 * clamp(0, mod(h, 360) - 0, 15) + -0.000156 * clamp(0, mod(h, 360) - 15, 15) + -0.003371 * clamp(0, mod(h, 360) - 30, 7.5) + -0.003733 * clamp(0, mod(h, 360) - 37.5, 7.5) + -0.002139 * clamp(0, mod(h, 360) - 45, 15) + -0.000623 * clamp(0, mod(h, 360) - 60, 30) + 0.00071 * clamp(0, mod(h, 360) - 90, 30) + 0.002272 * clamp(0, mod(h, 360) - 120, 15) + 0.003612 * clamp(0, mod(h, 360) - 135, 7.5) + -0.005252 * clamp(0, mod(h, 360) - 142.5, 7.5) + -0.002386 * clamp(0, mod(h, 360) - 150, 15) + -0.000966 * clamp(0, mod(h, 360) - 165, 15) + -0.000419 * clamp(0, mod(h, 360) - 180, 15) + -0.00029 * clamp(0, mod(h, 360) - 195, 15) + 0.001094 * clamp(0, mod(h, 360) - 210, 30) + 0.003244 * clamp(0, mod(h, 360) - 240, 15) + -0.00072 * clamp(0, mod(h, 360) - 255, 15) + 0.001064 * clamp(0, mod(h, 360) - 270, 30) + 0.003883 * clamp(0, mod(h, 360) - 300, 15) + 0.006184 * clamp(0, mod(h, 360) - 315, 3.75) + -0.001182 * clamp(0, mod(h, 360) - 318.75, 3.75) + -0.0017 * clamp(0, mod(h, 360) - 322.5, 7.5) + -0.000986 * clamp(0, mod(h, 360) - 330, 30) + c * (1 - clamp(0, max(0.345 - var(--_tone-anchor), var(--_tone-anchor) - 0.345) * 10000, 1))));
154
+ --_tone-side-600: clamp(0, (var(--_tone-anchor) - 0.425) * 10000, 1);
155
+ --_tone-l-600: calc(0.975 - (var(--_tone-side-600) * 0.425 * var(--_tone-own) / var(--_tone-page) + (1 - var(--_tone-side-600)) * (var(--_tone-own) + (0.425 - var(--_tone-anchor)) * (0.705 - var(--_tone-own)) / var(--_tone-ink))));
156
+ --_tone-c-600: min(calc(c * (1 - var(--_tone-side-600) * 0.88 * (var(--_tone-anchor) - 0.425) / var(--_tone-page) - (1 - var(--_tone-side-600)) * 0.48 * (0.425 - var(--_tone-anchor)) / var(--_tone-ink))), calc(0.2015 + -0.000051 * clamp(0, mod(h, 360) - 0, 15) + 0.000362 * clamp(0, mod(h, 360) - 15, 7.5) + -0.000981 * clamp(0, mod(h, 360) - 22.5, 7.5) + -0.003888 * clamp(0, mod(h, 360) - 30, 15) + -0.001385 * clamp(0, mod(h, 360) - 45, 15) + -0.00081 * clamp(0, mod(h, 360) - 60, 15) + -0.000424 * clamp(0, mod(h, 360) - 75, 15) + 0.000537 * clamp(0, mod(h, 360) - 90, 30) + 0.002068 * clamp(0, mod(h, 360) - 120, 15) + 0.003372 * clamp(0, mod(h, 360) - 135, 7.5) + -0.005277 * clamp(0, mod(h, 360) - 142.5, 3.75) + -0.004283 * clamp(0, mod(h, 360) - 146.25, 3.75) + -0.00215 * clamp(0, mod(h, 360) - 150, 15) + -0.000981 * clamp(0, mod(h, 360) - 165, 15) + -0.000136 * clamp(0, mod(h, 360) - 180, 30) + 0.000635 * clamp(0, mod(h, 360) - 210, 15) + 0.001314 * clamp(0, mod(h, 360) - 225, 15) + 0.00245 * clamp(0, mod(h, 360) - 240, 7.5) + 0.003984 * clamp(0, mod(h, 360) - 247.5, 7.5) + 0.008466 * clamp(0, mod(h, 360) - 255, 3.75) + 0.00989 * clamp(0, mod(h, 360) - 258.75, 1.875) + 0.003961 * clamp(0, mod(h, 360) - 260.625, 1.875) + -0.000288 * clamp(0, mod(h, 360) - 262.5, 7.5) + 0.00062 * clamp(0, mod(h, 360) - 270, 15) + 0.002196 * clamp(0, mod(h, 360) - 285, 15) + -0.000732 * clamp(0, mod(h, 360) - 300, 15) + -0.001375 * clamp(0, mod(h, 360) - 315, 15) + -0.000872 * clamp(0, mod(h, 360) - 330, 30) + c * (1 - clamp(0, max(0.425 - var(--_tone-anchor), var(--_tone-anchor) - 0.425) * 10000, 1))));
157
+ --_tone-side-700: clamp(0, (var(--_tone-anchor) - 0.505) * 10000, 1);
158
+ --_tone-l-700: calc(0.975 - (var(--_tone-side-700) * 0.505 * var(--_tone-own) / var(--_tone-page) + (1 - var(--_tone-side-700)) * (var(--_tone-own) + (0.505 - var(--_tone-anchor)) * (0.705 - var(--_tone-own)) / var(--_tone-ink))));
159
+ --_tone-c-700: min(calc(c * (1 - var(--_tone-side-700) * 0.88 * (var(--_tone-anchor) - 0.505) / var(--_tone-page) - (1 - var(--_tone-side-700)) * 0.48 * (0.505 - var(--_tone-anchor)) / var(--_tone-ink))), calc(0.1708 + -0.000057 * clamp(0, mod(h, 360) - 0, 15) + -0.000259 * clamp(0, mod(h, 360) - 15, 15) + -0.003292 * clamp(0, mod(h, 360) - 30, 15) + -0.001173 * clamp(0, mod(h, 360) - 45, 15) + -0.000686 * clamp(0, mod(h, 360) - 60, 15) + -0.000359 * clamp(0, mod(h, 360) - 75, 15) + 0.000454 * clamp(0, mod(h, 360) - 90, 30) + 0.001751 * clamp(0, mod(h, 360) - 120, 15) + 0.002645 * clamp(0, mod(h, 360) - 135, 7.5) + -0.004547 * clamp(0, mod(h, 360) - 142.5, 7.5) + -0.001299 * clamp(0, mod(h, 360) - 150, 30) + 0.000091 * clamp(0, mod(h, 360) - 180, 30) + 0.000402 * clamp(0, mod(h, 360) - 210, 15) + 0.001151 * clamp(0, mod(h, 360) - 225, 15) + 0.002172 * clamp(0, mod(h, 360) - 240, 7.5) + 0.003401 * clamp(0, mod(h, 360) - 247.5, 3.75) + 0.003496 * clamp(0, mod(h, 360) - 251.25, 3.75) + 0.006659 * clamp(0, mod(h, 360) - 255, 3.75) + 0.007137 * clamp(0, mod(h, 360) - 258.75, 1.875) + 0.007468 * clamp(0, mod(h, 360) - 260.625, 1.875) + 0.037834 * clamp(0, mod(h, 360) - 262.5, 1.875) + 0.006533 * clamp(0, mod(h, 360) - 264.375, 1.875) + 0.000122 * clamp(0, mod(h, 360) - 266.25, 3.75) + -0.001517 * clamp(0, mod(h, 360) - 270, 7.5) + -0.0019 * clamp(0, mod(h, 360) - 277.5, 7.5) + -0.001459 * clamp(0, mod(h, 360) - 285, 15) + -0.001141 * clamp(0, mod(h, 360) - 300, 30) + -0.000724 * clamp(0, mod(h, 360) - 330, 30) + c * (1 - clamp(0, max(0.505 - var(--_tone-anchor), var(--_tone-anchor) - 0.505) * 10000, 1))));
160
+ --_tone-side-800: clamp(0, (var(--_tone-anchor) - 0.575) * 10000, 1);
161
+ --_tone-l-800: calc(0.975 - (var(--_tone-side-800) * 0.575 * var(--_tone-own) / var(--_tone-page) + (1 - var(--_tone-side-800)) * (var(--_tone-own) + (0.575 - var(--_tone-anchor)) * (0.705 - var(--_tone-own)) / var(--_tone-ink))));
162
+ --_tone-c-800: min(calc(c * (1 - var(--_tone-side-800) * 0.88 * (var(--_tone-anchor) - 0.575) / var(--_tone-page) - (1 - var(--_tone-side-800)) * 0.48 * (0.575 - var(--_tone-anchor)) / var(--_tone-ink))), calc(0.1448 + -0.000053 * clamp(0, mod(h, 360) - 0, 15) + -0.000215 * clamp(0, mod(h, 360) - 15, 15) + -0.002791 * clamp(0, mod(h, 360) - 30, 15) + -0.000994 * clamp(0, mod(h, 360) - 45, 15) + -0.000581 * clamp(0, mod(h, 360) - 60, 15) + -0.000305 * clamp(0, mod(h, 360) - 75, 15) + 0.000385 * clamp(0, mod(h, 360) - 90, 30) + 0.001485 * clamp(0, mod(h, 360) - 120, 15) + 0.002238 * clamp(0, mod(h, 360) - 135, 7.5) + -0.003855 * clamp(0, mod(h, 360) - 142.5, 7.5) + -0.0011 * clamp(0, mod(h, 360) - 150, 30) + 0.000077 * clamp(0, mod(h, 360) - 180, 30) + 0.00034 * clamp(0, mod(h, 360) - 210, 15) + 0.000975 * clamp(0, mod(h, 360) - 225, 15) + 0.00173 * clamp(0, mod(h, 360) - 240, 7.5) + 0.002868 * clamp(0, mod(h, 360) - 247.5, 7.5) + 0.006077 * clamp(0, mod(h, 360) - 255, 3.75) + 0.005865 * clamp(0, mod(h, 360) - 258.75, 1.875) + 0.000171 * clamp(0, mod(h, 360) - 260.625, 1.875) + 0.04116 * clamp(0, mod(h, 360) - 262.5, 1.875) + 0.009057 * clamp(0, mod(h, 360) - 264.375, 1.875) + -0.00232 * clamp(0, mod(h, 360) - 266.25, 3.75) + -0.001689 * clamp(0, mod(h, 360) - 270, 15) + -0.001194 * clamp(0, mod(h, 360) - 285, 15) + -0.000973 * clamp(0, mod(h, 360) - 300, 30) + -0.000609 * clamp(0, mod(h, 360) - 330, 30) + c * (1 - clamp(0, max(0.575 - var(--_tone-anchor), var(--_tone-anchor) - 0.575) * 10000, 1))));
163
+ --_tone-side-900: clamp(0, (var(--_tone-anchor) - 0.645) * 10000, 1);
164
+ --_tone-l-900: calc(0.975 - (var(--_tone-side-900) * 0.645 * var(--_tone-own) / var(--_tone-page) + (1 - var(--_tone-side-900)) * (var(--_tone-own) + (0.645 - var(--_tone-anchor)) * (0.705 - var(--_tone-own)) / var(--_tone-ink))));
165
+ --_tone-c-900: min(calc(c * (1 - var(--_tone-side-900) * 0.88 * (var(--_tone-anchor) - 0.645) / var(--_tone-page) - (1 - var(--_tone-side-900)) * 0.48 * (0.645 - var(--_tone-anchor)) / var(--_tone-ink))), calc(0.1226 + -0.000045 * clamp(0, mod(h, 360) - 0, 15) + -0.000176 * clamp(0, mod(h, 360) - 15, 15) + -0.002365 * clamp(0, mod(h, 360) - 30, 15) + -0.000964 * clamp(0, mod(h, 360) - 45, 15) + -0.00036 * clamp(0, mod(h, 360) - 60, 30) + 0.000393 * clamp(0, mod(h, 360) - 90, 30) + 0.001204 * clamp(0, mod(h, 360) - 120, 15) + 0.001921 * clamp(0, mod(h, 360) - 135, 7.5) + -0.003277 * clamp(0, mod(h, 360) - 142.5, 7.5) + -0.00093 * clamp(0, mod(h, 360) - 150, 30) + 0.000064 * clamp(0, mod(h, 360) - 180, 30) + 0.000289 * clamp(0, mod(h, 360) - 210, 15) + 0.000826 * clamp(0, mod(h, 360) - 225, 15) + 0.001466 * clamp(0, mod(h, 360) - 240, 7.5) + 0.00243 * clamp(0, mod(h, 360) - 247.5, 7.5) + 0.005156 * clamp(0, mod(h, 360) - 255, 3.75) + 0.004975 * clamp(0, mod(h, 360) - 258.75, 1.875) + 0.000853 * clamp(0, mod(h, 360) - 260.625, 1.875) + 0.034656 * clamp(0, mod(h, 360) - 262.5, 1.875) + 0.007026 * clamp(0, mod(h, 360) - 264.375, 1.875) + -0.001961 * clamp(0, mod(h, 360) - 266.25, 3.75) + -0.001428 * clamp(0, mod(h, 360) - 270, 15) + -0.001008 * clamp(0, mod(h, 360) - 285, 15) + -0.000822 * clamp(0, mod(h, 360) - 300, 30) + -0.000515 * clamp(0, mod(h, 360) - 330, 30) + c * (1 - clamp(0, max(0.645 - var(--_tone-anchor), var(--_tone-anchor) - 0.645) * 10000, 1))));
166
+ --_tone-side-950: clamp(0, (var(--_tone-anchor) - 0.705) * 10000, 1);
167
+ --_tone-l-950: calc(0.975 - (var(--_tone-side-950) * 0.705 * var(--_tone-own) / var(--_tone-page) + (1 - var(--_tone-side-950)) * (var(--_tone-own) + (0.705 - var(--_tone-anchor)) * (0.705 - var(--_tone-own)) / var(--_tone-ink))));
168
+ --_tone-c-950: min(calc(c * (1 - var(--_tone-side-950) * 0.88 * (var(--_tone-anchor) - 0.705) / var(--_tone-page) - (1 - var(--_tone-side-950)) * 0.48 * (0.705 - var(--_tone-anchor)) / var(--_tone-ink))), calc(0.1052 + -0.000039 * clamp(0, mod(h, 360) - 0, 15) + 0.000187 * clamp(0, mod(h, 360) - 15, 7.5) + -0.00118 * clamp(0, mod(h, 360) - 22.5, 7.5) + -0.001466 * clamp(0, mod(h, 360) - 30, 30) + -0.000054 * clamp(0, mod(h, 360) - 60, 30) + 0.000274 * clamp(0, mod(h, 360) - 90, 30) + 0.00109 * clamp(0, mod(h, 360) - 120, 15) + 0.001613 * clamp(0, mod(h, 360) - 135, 7.5) + -0.002807 * clamp(0, mod(h, 360) - 142.5, 7.5) + -0.0008 * clamp(0, mod(h, 360) - 150, 30) + 0.000056 * clamp(0, mod(h, 360) - 180, 30) + 0.000248 * clamp(0, mod(h, 360) - 210, 15) + 0.000513 * clamp(0, mod(h, 360) - 225, 15) + 0.001747 * clamp(0, mod(h, 360) - 240, 15) + 0.004981 * clamp(0, mod(h, 360) - 255, 3.75) + 0.004205 * clamp(0, mod(h, 360) - 258.75, 1.875) + 0.004499 * clamp(0, mod(h, 360) - 260.625, 1.875) + 0.024467 * clamp(0, mod(h, 360) - 262.5, 1.875) + 0.00439 * clamp(0, mod(h, 360) - 264.375, 1.875) + -0.000188 * clamp(0, mod(h, 360) - 266.25, 3.75) + -0.001219 * clamp(0, mod(h, 360) - 270, 15) + -0.000864 * clamp(0, mod(h, 360) - 285, 15) + -0.000704 * clamp(0, mod(h, 360) - 300, 30) + -0.000443 * clamp(0, mod(h, 360) - 330, 30) + c * (1 - clamp(0, max(0.705 - var(--_tone-anchor), var(--_tone-anchor) - 0.705) * 10000, 1))));
169
+ --tone-1-50: oklch(from var(--tone-1) var(--_tone-l-50) var(--_tone-c-50) h);
170
+ --tone-1-100: oklch(from var(--tone-1) var(--_tone-l-100) var(--_tone-c-100) h);
171
+ --tone-1-200: oklch(from var(--tone-1) var(--_tone-l-200) var(--_tone-c-200) h);
172
+ --tone-1-300: oklch(from var(--tone-1) var(--_tone-l-300) var(--_tone-c-300) h);
173
+ --tone-1-400: oklch(from var(--tone-1) var(--_tone-l-400) var(--_tone-c-400) h);
174
+ --tone-1-500: oklch(from var(--tone-1) var(--_tone-l-500) var(--_tone-c-500) h);
175
+ --tone-1-600: oklch(from var(--tone-1) var(--_tone-l-600) var(--_tone-c-600) h);
176
+ --tone-1-700: oklch(from var(--tone-1) var(--_tone-l-700) var(--_tone-c-700) h);
177
+ --tone-1-800: oklch(from var(--tone-1) var(--_tone-l-800) var(--_tone-c-800) h);
178
+ --tone-1-900: oklch(from var(--tone-1) var(--_tone-l-900) var(--_tone-c-900) h);
179
+ --tone-1-950: oklch(from var(--tone-1) var(--_tone-l-950) var(--_tone-c-950) h);
180
+ --tone-2-50: oklch(from var(--tone-2) var(--_tone-l-50) var(--_tone-c-50) h);
181
+ --tone-2-100: oklch(from var(--tone-2) var(--_tone-l-100) var(--_tone-c-100) h);
182
+ --tone-2-200: oklch(from var(--tone-2) var(--_tone-l-200) var(--_tone-c-200) h);
183
+ --tone-2-300: oklch(from var(--tone-2) var(--_tone-l-300) var(--_tone-c-300) h);
184
+ --tone-2-400: oklch(from var(--tone-2) var(--_tone-l-400) var(--_tone-c-400) h);
185
+ --tone-2-500: oklch(from var(--tone-2) var(--_tone-l-500) var(--_tone-c-500) h);
186
+ --tone-2-600: oklch(from var(--tone-2) var(--_tone-l-600) var(--_tone-c-600) h);
187
+ --tone-2-700: oklch(from var(--tone-2) var(--_tone-l-700) var(--_tone-c-700) h);
188
+ --tone-2-800: oklch(from var(--tone-2) var(--_tone-l-800) var(--_tone-c-800) h);
189
+ --tone-2-900: oklch(from var(--tone-2) var(--_tone-l-900) var(--_tone-c-900) h);
190
+ --tone-2-950: oklch(from var(--tone-2) var(--_tone-l-950) var(--_tone-c-950) h);
191
+ --tone-3-50: oklch(from var(--tone-3) var(--_tone-l-50) var(--_tone-c-50) h);
192
+ --tone-3-100: oklch(from var(--tone-3) var(--_tone-l-100) var(--_tone-c-100) h);
193
+ --tone-3-200: oklch(from var(--tone-3) var(--_tone-l-200) var(--_tone-c-200) h);
194
+ --tone-3-300: oklch(from var(--tone-3) var(--_tone-l-300) var(--_tone-c-300) h);
195
+ --tone-3-400: oklch(from var(--tone-3) var(--_tone-l-400) var(--_tone-c-400) h);
196
+ --tone-3-500: oklch(from var(--tone-3) var(--_tone-l-500) var(--_tone-c-500) h);
197
+ --tone-3-600: oklch(from var(--tone-3) var(--_tone-l-600) var(--_tone-c-600) h);
198
+ --tone-3-700: oklch(from var(--tone-3) var(--_tone-l-700) var(--_tone-c-700) h);
199
+ --tone-3-800: oklch(from var(--tone-3) var(--_tone-l-800) var(--_tone-c-800) h);
200
+ --tone-3-900: oklch(from var(--tone-3) var(--_tone-l-900) var(--_tone-c-900) h);
201
+ --tone-3-950: oklch(from var(--tone-3) var(--_tone-l-950) var(--_tone-c-950) h);
202
+ --tone-info-50: oklch(from var(--tone-info) var(--_tone-l-50) var(--_tone-c-50) h);
203
+ --tone-info-100: oklch(from var(--tone-info) var(--_tone-l-100) var(--_tone-c-100) h);
204
+ --tone-info-200: oklch(from var(--tone-info) var(--_tone-l-200) var(--_tone-c-200) h);
205
+ --tone-info-300: oklch(from var(--tone-info) var(--_tone-l-300) var(--_tone-c-300) h);
206
+ --tone-info-400: oklch(from var(--tone-info) var(--_tone-l-400) var(--_tone-c-400) h);
207
+ --tone-info-500: oklch(from var(--tone-info) var(--_tone-l-500) var(--_tone-c-500) h);
208
+ --tone-info-600: oklch(from var(--tone-info) var(--_tone-l-600) var(--_tone-c-600) h);
209
+ --tone-info-700: oklch(from var(--tone-info) var(--_tone-l-700) var(--_tone-c-700) h);
210
+ --tone-info-800: oklch(from var(--tone-info) var(--_tone-l-800) var(--_tone-c-800) h);
211
+ --tone-info-900: oklch(from var(--tone-info) var(--_tone-l-900) var(--_tone-c-900) h);
212
+ --tone-info-950: oklch(from var(--tone-info) var(--_tone-l-950) var(--_tone-c-950) h);
213
+ --tone-warning-50: oklch(from var(--tone-warning) var(--_tone-l-50) var(--_tone-c-50) h);
214
+ --tone-warning-100: oklch(from var(--tone-warning) var(--_tone-l-100) var(--_tone-c-100) h);
215
+ --tone-warning-200: oklch(from var(--tone-warning) var(--_tone-l-200) var(--_tone-c-200) h);
216
+ --tone-warning-300: oklch(from var(--tone-warning) var(--_tone-l-300) var(--_tone-c-300) h);
217
+ --tone-warning-400: oklch(from var(--tone-warning) var(--_tone-l-400) var(--_tone-c-400) h);
218
+ --tone-warning-500: oklch(from var(--tone-warning) var(--_tone-l-500) var(--_tone-c-500) h);
219
+ --tone-warning-600: oklch(from var(--tone-warning) var(--_tone-l-600) var(--_tone-c-600) h);
220
+ --tone-warning-700: oklch(from var(--tone-warning) var(--_tone-l-700) var(--_tone-c-700) h);
221
+ --tone-warning-800: oklch(from var(--tone-warning) var(--_tone-l-800) var(--_tone-c-800) h);
222
+ --tone-warning-900: oklch(from var(--tone-warning) var(--_tone-l-900) var(--_tone-c-900) h);
223
+ --tone-warning-950: oklch(from var(--tone-warning) var(--_tone-l-950) var(--_tone-c-950) h);
224
+ --success-50: oklch(from var(--success) var(--_tone-l-50) var(--_tone-c-50) h);
225
+ --success-100: oklch(from var(--success) var(--_tone-l-100) var(--_tone-c-100) h);
226
+ --success-200: oklch(from var(--success) var(--_tone-l-200) var(--_tone-c-200) h);
227
+ --success-300: oklch(from var(--success) var(--_tone-l-300) var(--_tone-c-300) h);
228
+ --success-400: oklch(from var(--success) var(--_tone-l-400) var(--_tone-c-400) h);
229
+ --success-500: oklch(from var(--success) var(--_tone-l-500) var(--_tone-c-500) h);
230
+ --success-600: oklch(from var(--success) var(--_tone-l-600) var(--_tone-c-600) h);
231
+ --success-700: oklch(from var(--success) var(--_tone-l-700) var(--_tone-c-700) h);
232
+ --success-800: oklch(from var(--success) var(--_tone-l-800) var(--_tone-c-800) h);
233
+ --success-900: oklch(from var(--success) var(--_tone-l-900) var(--_tone-c-900) h);
234
+ --success-950: oklch(from var(--success) var(--_tone-l-950) var(--_tone-c-950) h);
235
+ --destructive-50: oklch(from var(--destructive) var(--_tone-l-50) var(--_tone-c-50) h);
236
+ --destructive-100: oklch(from var(--destructive) var(--_tone-l-100) var(--_tone-c-100) h);
237
+ --destructive-200: oklch(from var(--destructive) var(--_tone-l-200) var(--_tone-c-200) h);
238
+ --destructive-300: oklch(from var(--destructive) var(--_tone-l-300) var(--_tone-c-300) h);
239
+ --destructive-400: oklch(from var(--destructive) var(--_tone-l-400) var(--_tone-c-400) h);
240
+ --destructive-500: oklch(from var(--destructive) var(--_tone-l-500) var(--_tone-c-500) h);
241
+ --destructive-600: oklch(from var(--destructive) var(--_tone-l-600) var(--_tone-c-600) h);
242
+ --destructive-700: oklch(from var(--destructive) var(--_tone-l-700) var(--_tone-c-700) h);
243
+ --destructive-800: oklch(from var(--destructive) var(--_tone-l-800) var(--_tone-c-800) h);
244
+ --destructive-900: oklch(from var(--destructive) var(--_tone-l-900) var(--_tone-c-900) h);
245
+ --destructive-950: oklch(from var(--destructive) var(--_tone-l-950) var(--_tone-c-950) h);
207
246
  }
208
247
 
209
248
  :where(.dark, .dark [data-sable-theme]:not(.light)) {
@@ -229,17 +268,17 @@
229
268
  --orange-800: oklch(from var(--_palette-orange) 0.866 min(0.102, calc(0.0749 + -0.00044 * clamp(0, -1 * (mod(h - 50 + 540, 360) - 180), 5) + -0.00031 * clamp(0, -1 * (mod(h - 50 + 540, 360) - 180) - 5, 5) + -0.0002 * clamp(0, -1 * (mod(h - 50 + 540, 360) - 180) - 10, 5))) h);
230
269
  --orange-900: oklch(from var(--_palette-orange) 0.905 min(0.0714, calc(0.0514 + -0.00031 * clamp(0, -1 * (mod(h - 50 + 540, 360) - 180), 5) + -0.00022 * clamp(0, -1 * (mod(h - 50 + 540, 360) - 180) - 5, 5) + -0.00014 * clamp(0, -1 * (mod(h - 50 + 540, 360) - 180) - 10, 5))) h);
231
270
  --orange-950: oklch(from var(--_palette-orange) 0.9388 min(0.0476, calc(0.0322 + -0.0002 * clamp(0, -1 * (mod(h - 50 + 540, 360) - 180), 5) + -0.00014 * clamp(0, -1 * (mod(h - 50 + 540, 360) - 180) - 5, 5) + -0.00009 * clamp(0, -1 * (mod(h - 50 + 540, 360) - 180) - 10, 5))) h);
232
- --yellow-50: oklch(from var(--_palette-yellow) 0.2155 0.0375 h);
233
- --yellow-100: oklch(from var(--_palette-yellow) 0.2675 0.048 h);
234
- --yellow-200: oklch(from var(--_palette-yellow) 0.365 0.0675 h);
235
- --yellow-300: oklch(from var(--_palette-yellow) 0.495 0.093 h);
236
- --yellow-400: oklch(from var(--_palette-yellow) 0.6445 0.123 h);
237
- --yellow-500: oklch(from var(--_palette-yellow) 0.82 min(0.15, calc(0.1626 + -0.00053 * clamp(0, -1 * (mod(h - 92 + 540, 360) - 180) - 5, 5) + -0.00306 * clamp(0, -1 * (mod(h - 92 + 540, 360) - 180) - 10, 5) + -0.00236 * clamp(0, -1 * (mod(h - 92 + 540, 360) - 180) - 15, 5) + -0.00184 * clamp(0, -1 * (mod(h - 92 + 540, 360) - 180) - 20, 5))) h);
238
- --yellow-600: oklch(from var(--_palette-yellow) 0.85 min(0.1425, calc(0.1685 + -0.00416 * clamp(0, -1 * (mod(h - 92 + 540, 360) - 180), 5) + -0.00338 * clamp(0, -1 * (mod(h - 92 + 540, 360) - 180) - 5, 5) + -0.00255 * clamp(0, -1 * (mod(h - 92 + 540, 360) - 180) - 10, 5) + -0.00196 * clamp(0, -1 * (mod(h - 92 + 540, 360) - 180) - 15, 5) + -0.00153 * clamp(0, -1 * (mod(h - 92 + 540, 360) - 180) - 20, 5))) h);
239
- --yellow-700: oklch(from var(--_palette-yellow) 0.883 min(0.12, calc(0.1316 + -0.00366 * clamp(0, -1 * (mod(h - 92 + 540, 360) - 180), 5) + -0.00266 * clamp(0, -1 * (mod(h - 92 + 540, 360) - 180) - 5, 5) + -0.00199 * clamp(0, -1 * (mod(h - 92 + 540, 360) - 180) - 10, 5) + -0.00153 * clamp(0, -1 * (mod(h - 92 + 540, 360) - 180) - 15, 5) + -0.00119 * clamp(0, -1 * (mod(h - 92 + 540, 360) - 180) - 20, 5))) h);
240
- --yellow-800: oklch(from var(--_palette-yellow) 0.91 min(0.09, calc(0.1003 + -0.00285 * clamp(0, -1 * (mod(h - 92 + 540, 360) - 180), 5) + -0.00206 * clamp(0, -1 * (mod(h - 92 + 540, 360) - 180) - 5, 5) + -0.00154 * clamp(0, -1 * (mod(h - 92 + 540, 360) - 180) - 10, 5) + -0.00117 * clamp(0, -1 * (mod(h - 92 + 540, 360) - 180) - 15, 5) + -0.00091 * clamp(0, -1 * (mod(h - 92 + 540, 360) - 180) - 20, 5))) h);
241
- --yellow-900: oklch(from var(--_palette-yellow) 0.9325 min(0.063, calc(0.0747 + -0.00217 * clamp(0, -1 * (mod(h - 92 + 540, 360) - 180), 5) + -0.00155 * clamp(0, -1 * (mod(h - 92 + 540, 360) - 180) - 5, 5) + -0.00115 * clamp(0, -1 * (mod(h - 92 + 540, 360) - 180) - 10, 5) + -0.00088 * clamp(0, -1 * (mod(h - 92 + 540, 360) - 180) - 15, 5) + -0.00068 * clamp(0, -1 * (mod(h - 92 + 540, 360) - 180) - 20, 5))) h);
242
- --yellow-950: oklch(from var(--_palette-yellow) 0.952 min(0.042, calc(0.0528 + -0.00888 * clamp(0, (mod(h - 92 + 540, 360) - 180) - 20, 5) + -0.00156 * clamp(0, -1 * (mod(h - 92 + 540, 360) - 180), 5) + -0.00111 * clamp(0, -1 * (mod(h - 92 + 540, 360) - 180) - 5, 5) + -0.00082 * clamp(0, -1 * (mod(h - 92 + 540, 360) - 180) - 10, 5) + -0.00062 * clamp(0, -1 * (mod(h - 92 + 540, 360) - 180) - 15, 5) + -0.00048 * clamp(0, -1 * (mod(h - 92 + 540, 360) - 180) - 20, 5))) h);
271
+ --yellow-50: oklch(from var(--_palette-yellow) 0.2127 0.0375 h);
272
+ --yellow-100: oklch(from var(--_palette-yellow) 0.2615 0.048 h);
273
+ --yellow-200: oklch(from var(--_palette-yellow) 0.353 0.0675 h);
274
+ --yellow-300: oklch(from var(--_palette-yellow) 0.475 0.093 h);
275
+ --yellow-400: oklch(from var(--_palette-yellow) 0.6153 min(0.123, calc(0.122)) h);
276
+ --yellow-500: oklch(from var(--_palette-yellow) 0.78 0.15 h);
277
+ --yellow-600: oklch(from var(--_palette-yellow) 0.818 min(0.1425, calc(0.1622 + -0.00309 * clamp(0, -1 * (mod(h - 92 + 540, 360) - 180) - 10, 5) + -0.00239 * clamp(0, -1 * (mod(h - 92 + 540, 360) - 180) - 15, 5) + -0.00187 * clamp(0, -1 * (mod(h - 92 + 540, 360) - 180) - 20, 5))) h);
278
+ --yellow-700: oklch(from var(--_palette-yellow) 0.8598 min(0.12, calc(0.1591 + -0.00434 * clamp(0, -1 * (mod(h - 92 + 540, 360) - 180), 5) + -0.00317 * clamp(0, -1 * (mod(h - 92 + 540, 360) - 180) - 5, 5) + -0.00238 * clamp(0, -1 * (mod(h - 92 + 540, 360) - 180) - 10, 5) + -0.00183 * clamp(0, -1 * (mod(h - 92 + 540, 360) - 180) - 15, 5) + -0.00143 * clamp(0, -1 * (mod(h - 92 + 540, 360) - 180) - 20, 5))) h);
279
+ --yellow-800: oklch(from var(--_palette-yellow) 0.894 min(0.09, calc(0.1188 + -0.00333 * clamp(0, -1 * (mod(h - 92 + 540, 360) - 180), 5) + -0.00241 * clamp(0, -1 * (mod(h - 92 + 540, 360) - 180) - 5, 5) + -0.00181 * clamp(0, -1 * (mod(h - 92 + 540, 360) - 180) - 10, 5) + -0.00138 * clamp(0, -1 * (mod(h - 92 + 540, 360) - 180) - 15, 5) + -0.00107 * clamp(0, -1 * (mod(h - 92 + 540, 360) - 180) - 20, 5))) h);
280
+ --yellow-900: oklch(from var(--_palette-yellow) 0.9225 min(0.063, calc(0.086 + -0.00247 * clamp(0, -1 * (mod(h - 92 + 540, 360) - 180), 5) + -0.00178 * clamp(0, -1 * (mod(h - 92 + 540, 360) - 180) - 5, 5) + -0.00132 * clamp(0, -1 * (mod(h - 92 + 540, 360) - 180) - 10, 5) + -0.00101 * clamp(0, -1 * (mod(h - 92 + 540, 360) - 180) - 15, 5) + -0.00078 * clamp(0, -1 * (mod(h - 92 + 540, 360) - 180) - 20, 5))) h);
281
+ --yellow-950: oklch(from var(--_palette-yellow) 0.9472 min(0.042, calc(0.0582 + -0.00701 * clamp(0, (mod(h - 92 + 540, 360) - 180) - 20, 5) + -0.00171 * clamp(0, -1 * (mod(h - 92 + 540, 360) - 180), 5) + -0.00122 * clamp(0, -1 * (mod(h - 92 + 540, 360) - 180) - 5, 5) + -0.0009 * clamp(0, -1 * (mod(h - 92 + 540, 360) - 180) - 10, 5) + -0.00069 * clamp(0, -1 * (mod(h - 92 + 540, 360) - 180) - 15, 5) + -0.00053 * clamp(0, -1 * (mod(h - 92 + 540, 360) - 180) - 20, 5))) h);
243
282
  --green-50: oklch(from var(--_palette-green) 0.2057 min(0.04, calc(0.0556 + -0.00114 * clamp(0, (mod(h - 145 + 540, 360) - 180), 5) + -0.00085 * clamp(0, (mod(h - 145 + 540, 360) - 180) - 5, 5) + -0.00065 * clamp(0, (mod(h - 145 + 540, 360) - 180) - 10, 5) + -0.0005 * clamp(0, (mod(h - 145 + 540, 360) - 180) - 15, 5) + -0.00038 * clamp(0, (mod(h - 145 + 540, 360) - 180) - 20, 5) + -0.00093 * clamp(0, -1 * (mod(h - 145 + 540, 360) - 180) - 5, 5) + -0.00072 * clamp(0, -1 * (mod(h - 145 + 540, 360) - 180) - 10, 5) + -0.00056 * clamp(0, -1 * (mod(h - 145 + 540, 360) - 180) - 15, 5) + -0.00044 * clamp(0, -1 * (mod(h - 145 + 540, 360) - 180) - 20, 5))) h);
244
283
  --green-100: oklch(from var(--_palette-green) 0.2465 min(0.0512, calc(0.0663 + -0.00136 * clamp(0, (mod(h - 145 + 540, 360) - 180), 5) + -0.00101 * clamp(0, (mod(h - 145 + 540, 360) - 180) - 5, 5) + -0.00077 * clamp(0, (mod(h - 145 + 540, 360) - 180) - 10, 5) + -0.00059 * clamp(0, (mod(h - 145 + 540, 360) - 180) - 15, 5) + -0.00045 * clamp(0, (mod(h - 145 + 540, 360) - 180) - 20, 5) + -0.00111 * clamp(0, -1 * (mod(h - 145 + 540, 360) - 180) - 5, 5) + -0.00086 * clamp(0, -1 * (mod(h - 145 + 540, 360) - 180) - 10, 5) + -0.00067 * clamp(0, -1 * (mod(h - 145 + 540, 360) - 180) - 15, 5) + -0.00052 * clamp(0, -1 * (mod(h - 145 + 540, 360) - 180) - 20, 5))) h);
245
284
  --green-200: oklch(from var(--_palette-green) 0.323 min(0.072, calc(0.0866 + -0.00177 * clamp(0, (mod(h - 145 + 540, 360) - 180), 5) + -0.00132 * clamp(0, (mod(h - 145 + 540, 360) - 180) - 5, 5) + -0.001 * clamp(0, (mod(h - 145 + 540, 360) - 180) - 10, 5) + -0.00077 * clamp(0, (mod(h - 145 + 540, 360) - 180) - 15, 5) + -0.00059 * clamp(0, (mod(h - 145 + 540, 360) - 180) - 20, 5) + -0.00144 * clamp(0, -1 * (mod(h - 145 + 540, 360) - 180) - 5, 5) + -0.00112 * clamp(0, -1 * (mod(h - 145 + 540, 360) - 180) - 10, 5) + -0.00087 * clamp(0, -1 * (mod(h - 145 + 540, 360) - 180) - 15, 5) + -0.00068 * clamp(0, -1 * (mod(h - 145 + 540, 360) - 180) - 20, 5))) h);
@@ -295,83 +334,122 @@
295
334
  --pink-800: oklch(from var(--_palette-pink) 0.858 min(0.108, calc(0.0841 + -0.00067 * clamp(0, (mod(h - 350 + 540, 360) - 180), 5) + -0.00051 * clamp(0, (mod(h - 350 + 540, 360) - 180) - 5, 5) + -0.00037 * clamp(0, (mod(h - 350 + 540, 360) - 180) - 10, 5) + -0.00025 * clamp(0, (mod(h - 350 + 540, 360) - 180) - 15, 5) + -0.00013 * clamp(0, (mod(h - 350 + 540, 360) - 180) - 20, 5))) h);
296
335
  --pink-900: oklch(from var(--_palette-pink) 0.9 min(0.0756, calc(0.0569 + -0.00045 * clamp(0, (mod(h - 350 + 540, 360) - 180), 5) + -0.00034 * clamp(0, (mod(h - 350 + 540, 360) - 180) - 5, 5) + -0.00025 * clamp(0, (mod(h - 350 + 540, 360) - 180) - 10, 5) + -0.00016 * clamp(0, (mod(h - 350 + 540, 360) - 180) - 15, 5))) h);
297
336
  --pink-950: oklch(from var(--_palette-pink) 0.9364 min(0.0504, calc(0.0349 + -0.00028 * clamp(0, (mod(h - 350 + 540, 360) - 180), 5) + -0.00021 * clamp(0, (mod(h - 350 + 540, 360) - 180) - 5, 5) + -0.00015 * clamp(0, (mod(h - 350 + 540, 360) - 180) - 10, 5) + -0.0001 * clamp(0, (mod(h - 350 + 540, 360) - 180) - 15, 5))) h);
298
- --tone-1-50: oklch(from var(--tone-1) calc(l + (0.17 - l) * 0.93) min(calc(c * 0.25), 0.035) h);
299
- --tone-1-100: oklch(from var(--tone-1) calc(l + (0.17 - l) * 0.85) min(calc(c * 0.32), 0.05) h);
300
- --tone-1-200: oklch(from var(--tone-1) calc(l + (0.17 - l) * 0.7) min(calc(c * 0.45), 0.07) h);
301
- --tone-1-300: oklch(from var(--tone-1) calc(l + (0.17 - l) * 0.5) min(calc(c * 0.62), 0.1) h);
302
- --tone-1-400: oklch(from var(--tone-1) calc(l + (0.17 - l) * 0.27) calc(c * 0.82) h);
303
- --tone-1-500: var(--tone-1);
304
- --tone-1-600: oklch(from var(--tone-1) calc(l + (0.97 - l) * 0.2) calc(c * 0.95) h);
305
- --tone-1-700: oklch(from var(--tone-1) calc(l + (0.97 - l) * 0.42) calc(c * 0.8) h);
306
- --tone-1-800: oklch(from var(--tone-1) calc(l + (0.97 - l) * 0.6) calc(c * 0.6) h);
307
- --tone-1-900: oklch(from var(--tone-1) calc(l + (0.97 - l) * 0.75) calc(c * 0.42) h);
308
- --tone-1-950: oklch(from var(--tone-1) calc(l + (0.97 - l) * 0.88) calc(c * 0.28) h);
309
- --tone-2-50: oklch(from var(--tone-2) calc(l + (0.17 - l) * 0.93) min(calc(c * 0.25), 0.035) h);
310
- --tone-2-100: oklch(from var(--tone-2) calc(l + (0.17 - l) * 0.85) min(calc(c * 0.32), 0.05) h);
311
- --tone-2-200: oklch(from var(--tone-2) calc(l + (0.17 - l) * 0.7) min(calc(c * 0.45), 0.07) h);
312
- --tone-2-300: oklch(from var(--tone-2) calc(l + (0.17 - l) * 0.5) min(calc(c * 0.62), 0.1) h);
313
- --tone-2-400: oklch(from var(--tone-2) calc(l + (0.17 - l) * 0.27) calc(c * 0.82) h);
314
- --tone-2-500: var(--tone-2);
315
- --tone-2-600: oklch(from var(--tone-2) calc(l + (0.97 - l) * 0.2) calc(c * 0.95) h);
316
- --tone-2-700: oklch(from var(--tone-2) calc(l + (0.97 - l) * 0.42) calc(c * 0.8) h);
317
- --tone-2-800: oklch(from var(--tone-2) calc(l + (0.97 - l) * 0.6) calc(c * 0.6) h);
318
- --tone-2-900: oklch(from var(--tone-2) calc(l + (0.97 - l) * 0.75) calc(c * 0.42) h);
319
- --tone-2-950: oklch(from var(--tone-2) calc(l + (0.97 - l) * 0.88) calc(c * 0.28) h);
320
- --tone-3-50: oklch(from var(--tone-3) calc(l + (0.17 - l) * 0.93) min(calc(c * 0.25), 0.035) h);
321
- --tone-3-100: oklch(from var(--tone-3) calc(l + (0.17 - l) * 0.85) min(calc(c * 0.32), 0.05) h);
322
- --tone-3-200: oklch(from var(--tone-3) calc(l + (0.17 - l) * 0.7) min(calc(c * 0.45), 0.07) h);
323
- --tone-3-300: oklch(from var(--tone-3) calc(l + (0.17 - l) * 0.5) min(calc(c * 0.62), 0.1) h);
324
- --tone-3-400: oklch(from var(--tone-3) calc(l + (0.17 - l) * 0.27) calc(c * 0.82) h);
325
- --tone-3-500: var(--tone-3);
326
- --tone-3-600: oklch(from var(--tone-3) calc(l + (0.97 - l) * 0.2) calc(c * 0.95) h);
327
- --tone-3-700: oklch(from var(--tone-3) calc(l + (0.97 - l) * 0.42) calc(c * 0.8) h);
328
- --tone-3-800: oklch(from var(--tone-3) calc(l + (0.97 - l) * 0.6) calc(c * 0.6) h);
329
- --tone-3-900: oklch(from var(--tone-3) calc(l + (0.97 - l) * 0.75) calc(c * 0.42) h);
330
- --tone-3-950: oklch(from var(--tone-3) calc(l + (0.97 - l) * 0.88) calc(c * 0.28) h);
331
- --tone-info-50: oklch(from var(--tone-info) calc(l + (0.17 - l) * 0.93) min(calc(c * 0.25), 0.035) h);
332
- --tone-info-100: oklch(from var(--tone-info) calc(l + (0.17 - l) * 0.85) min(calc(c * 0.32), 0.05) h);
333
- --tone-info-200: oklch(from var(--tone-info) calc(l + (0.17 - l) * 0.7) min(calc(c * 0.45), 0.07) h);
334
- --tone-info-300: oklch(from var(--tone-info) calc(l + (0.17 - l) * 0.5) min(calc(c * 0.62), 0.1) h);
335
- --tone-info-400: oklch(from var(--tone-info) calc(l + (0.17 - l) * 0.27) calc(c * 0.82) h);
336
- --tone-info-500: var(--tone-info);
337
- --tone-info-600: oklch(from var(--tone-info) calc(l + (0.97 - l) * 0.2) calc(c * 0.95) h);
338
- --tone-info-700: oklch(from var(--tone-info) calc(l + (0.97 - l) * 0.42) calc(c * 0.8) h);
339
- --tone-info-800: oklch(from var(--tone-info) calc(l + (0.97 - l) * 0.6) calc(c * 0.6) h);
340
- --tone-info-900: oklch(from var(--tone-info) calc(l + (0.97 - l) * 0.75) calc(c * 0.42) h);
341
- --tone-info-950: oklch(from var(--tone-info) calc(l + (0.97 - l) * 0.88) calc(c * 0.28) h);
342
- --tone-warning-50: oklch(from var(--tone-warning) calc(l + (0.17 - l) * 0.93) min(calc(c * 0.25), 0.035) h);
343
- --tone-warning-100: oklch(from var(--tone-warning) calc(l + (0.17 - l) * 0.85) min(calc(c * 0.32), 0.05) h);
344
- --tone-warning-200: oklch(from var(--tone-warning) calc(l + (0.17 - l) * 0.7) min(calc(c * 0.45), 0.07) h);
345
- --tone-warning-300: oklch(from var(--tone-warning) calc(l + (0.17 - l) * 0.5) min(calc(c * 0.62), 0.1) h);
346
- --tone-warning-400: oklch(from var(--tone-warning) calc(l + (0.17 - l) * 0.27) calc(c * 0.82) h);
347
- --tone-warning-500: var(--tone-warning);
348
- --tone-warning-600: oklch(from var(--tone-warning) calc(l + (0.97 - l) * 0.2) calc(c * 0.95) h);
349
- --tone-warning-700: oklch(from var(--tone-warning) calc(l + (0.97 - l) * 0.42) calc(c * 0.8) h);
350
- --tone-warning-800: oklch(from var(--tone-warning) calc(l + (0.97 - l) * 0.6) calc(c * 0.6) h);
351
- --tone-warning-900: oklch(from var(--tone-warning) calc(l + (0.97 - l) * 0.75) calc(c * 0.42) h);
352
- --tone-warning-950: oklch(from var(--tone-warning) calc(l + (0.97 - l) * 0.88) calc(c * 0.28) h);
353
- --success-50: oklch(from var(--success) calc(l + (0.17 - l) * 0.93) min(calc(c * 0.25), 0.035) h);
354
- --success-100: oklch(from var(--success) calc(l + (0.17 - l) * 0.85) min(calc(c * 0.32), 0.05) h);
355
- --success-200: oklch(from var(--success) calc(l + (0.17 - l) * 0.7) min(calc(c * 0.45), 0.07) h);
356
- --success-300: oklch(from var(--success) calc(l + (0.17 - l) * 0.5) min(calc(c * 0.62), 0.1) h);
357
- --success-400: oklch(from var(--success) calc(l + (0.17 - l) * 0.27) calc(c * 0.82) h);
358
- --success-500: var(--success);
359
- --success-600: oklch(from var(--success) calc(l + (0.97 - l) * 0.2) calc(c * 0.95) h);
360
- --success-700: oklch(from var(--success) calc(l + (0.97 - l) * 0.42) calc(c * 0.8) h);
361
- --success-800: oklch(from var(--success) calc(l + (0.97 - l) * 0.6) calc(c * 0.6) h);
362
- --success-900: oklch(from var(--success) calc(l + (0.97 - l) * 0.75) calc(c * 0.42) h);
363
- --success-950: oklch(from var(--success) calc(l + (0.97 - l) * 0.88) calc(c * 0.28) h);
364
- --destructive-50: oklch(from var(--destructive) calc(l + (0.17 - l) * 0.93) min(calc(c * 0.25), 0.035) h);
365
- --destructive-100: oklch(from var(--destructive) calc(l + (0.17 - l) * 0.85) min(calc(c * 0.32), 0.05) h);
366
- --destructive-200: oklch(from var(--destructive) calc(l + (0.17 - l) * 0.7) min(calc(c * 0.45), 0.07) h);
367
- --destructive-300: oklch(from var(--destructive) calc(l + (0.17 - l) * 0.5) min(calc(c * 0.62), 0.1) h);
368
- --destructive-400: oklch(from var(--destructive) calc(l + (0.17 - l) * 0.27) calc(c * 0.82) h);
369
- --destructive-500: var(--destructive);
370
- --destructive-600: oklch(from var(--destructive) calc(l + (0.97 - l) * 0.2) calc(c * 0.95) h);
371
- --destructive-700: oklch(from var(--destructive) calc(l + (0.97 - l) * 0.42) calc(c * 0.8) h);
372
- --destructive-800: oklch(from var(--destructive) calc(l + (0.97 - l) * 0.6) calc(c * 0.6) h);
373
- --destructive-900: oklch(from var(--destructive) calc(l + (0.97 - l) * 0.75) calc(c * 0.42) h);
374
- --destructive-950: oklch(from var(--destructive) calc(l + (0.97 - l) * 0.88) calc(c * 0.28) h);
337
+ /* Depths along the ladder, 0 at step 50: the step the tone snaps to, the
338
+ tone's own, and the room either side of it. */
339
+ --_tone-anchor: calc(0.035 * clamp(0, (l - 0.2325) * 10000, 1) + 0.06 * clamp(0, (l - 0.28) * 10000, 1) + 0.08 * clamp(0, (l - 0.35) * 10000, 1) + 0.11 * clamp(0, (l - 0.445) * 10000, 1) + 0.1 * clamp(0, (l - 0.55) * 10000, 1) + 0.09 * clamp(0, (l - 0.645) * 10000, 1) + 0.08 * clamp(0, (l - 0.73) * 10000, 1) + 0.07 * clamp(0, (l - 0.805) * 10000, 1) + 0.055 * clamp(0, (l - 0.8675) * 10000, 1) + 0.045 * clamp(0, (l - 0.9175) * 10000, 1));
340
+ --_tone-own: calc(l - 0.215);
341
+ --_tone-page: max(var(--_tone-anchor), 0.001);
342
+ --_tone-ink: max(0.725 - var(--_tone-anchor), 0.001);
343
+ --_tone-side-50: clamp(0, (var(--_tone-anchor) - 0) * 10000, 1);
344
+ --_tone-l-50: calc(0.215 + (var(--_tone-side-50) * 0 * var(--_tone-own) / var(--_tone-page) + (1 - var(--_tone-side-50)) * (var(--_tone-own) + (0 - var(--_tone-anchor)) * (0.725 - var(--_tone-own)) / var(--_tone-ink))));
345
+ --_tone-c-50: min(calc(c * (1 - var(--_tone-side-50) * 0.75 * (var(--_tone-anchor) - 0) / var(--_tone-page) - (1 - var(--_tone-side-50)) * 0.7 * (0 - var(--_tone-anchor)) / var(--_tone-ink))), calc(0.0825 + -0.000186 * clamp(0, mod(h, 360) - 0, 30) + -0.001097 * clamp(0, mod(h, 360) - 30, 30) + -0.000088 * clamp(0, mod(h, 360) - 60, 30) + 0.000221 * clamp(0, mod(h, 360) - 90, 30) + 0.000876 * clamp(0, mod(h, 360) - 120, 15) + 0.001277 * clamp(0, mod(h, 360) - 135, 7.5) + -0.002254 * clamp(0, mod(h, 360) - 142.5, 7.5) + -0.000639 * clamp(0, mod(h, 360) - 150, 30) + -0.000024 * clamp(0, mod(h, 360) - 180, 30) + 0.000337 * clamp(0, mod(h, 360) - 210, 30) + 0.001579 * clamp(0, mod(h, 360) - 240, 15) + 0.001977 * clamp(0, mod(h, 360) - 255, 7.5) + c * (1 - clamp(0, max(0 - var(--_tone-anchor), var(--_tone-anchor) - 0) * 10000, 1))));
346
+ --_tone-side-100: clamp(0, (var(--_tone-anchor) - 0.035) * 10000, 1);
347
+ --_tone-l-100: calc(0.215 + (var(--_tone-side-100) * 0.035 * var(--_tone-own) / var(--_tone-page) + (1 - var(--_tone-side-100)) * (var(--_tone-own) + (0.035 - var(--_tone-anchor)) * (0.725 - var(--_tone-own)) / var(--_tone-ink))));
348
+ --_tone-c-100: min(calc(c * (1 - var(--_tone-side-100) * 0.75 * (var(--_tone-anchor) - 0.035) / var(--_tone-page) - (1 - var(--_tone-side-100)) * 0.7 * (0.035 - var(--_tone-anchor)) / var(--_tone-ink))), calc(0.0934 + -0.00024 * clamp(0, mod(h, 360) - 0, 30) + -0.00127 * clamp(0, mod(h, 360) - 30, 30) + -0.00007 * clamp(0, mod(h, 360) - 60, 30) + 0.000244 * clamp(0, mod(h, 360) - 90, 30) + 0.000973 * clamp(0, mod(h, 360) - 120, 15) + 0.00143 * clamp(0, mod(h, 360) - 135, 7.5) + -0.002504 * clamp(0, mod(h, 360) - 142.5, 7.5) + -0.000712 * clamp(0, mod(h, 360) - 150, 30) + 0.000049 * clamp(0, mod(h, 360) - 180, 30) + 0.000221 * clamp(0, mod(h, 360) - 210, 15) + 0.000457 * clamp(0, mod(h, 360) - 225, 15) + 0.001559 * clamp(0, mod(h, 360) - 240, 15) + 0.004453 * clamp(0, mod(h, 360) - 255, 3.75) + 0.003756 * clamp(0, mod(h, 360) - 258.75, 1.875) + 0.002023 * clamp(0, mod(h, 360) - 260.625, 1.875) + 0.026032 * clamp(0, mod(h, 360) - 262.5, 1.875) + 0.004165 * clamp(0, mod(h, 360) - 264.375, 1.875) + -0.001493 * clamp(0, mod(h, 360) - 266.25, 3.75) + -0.001086 * clamp(0, mod(h, 360) - 270, 15) + -0.000765 * clamp(0, mod(h, 360) - 285, 15) + -0.000614 * clamp(0, mod(h, 360) - 300, 30) + -0.000416 * clamp(0, mod(h, 360) - 330, 30) + c * (1 - clamp(0, max(0.035 - var(--_tone-anchor), var(--_tone-anchor) - 0.035) * 10000, 1))));
349
+ --_tone-side-200: clamp(0, (var(--_tone-anchor) - 0.095) * 10000, 1);
350
+ --_tone-l-200: calc(0.215 + (var(--_tone-side-200) * 0.095 * var(--_tone-own) / var(--_tone-page) + (1 - var(--_tone-side-200)) * (var(--_tone-own) + (0.095 - var(--_tone-anchor)) * (0.725 - var(--_tone-own)) / var(--_tone-ink))));
351
+ --_tone-c-200: min(calc(c * (1 - var(--_tone-side-200) * 0.75 * (var(--_tone-anchor) - 0.095) / var(--_tone-page) - (1 - var(--_tone-side-200)) * 0.7 * (0.095 - var(--_tone-anchor)) / var(--_tone-ink))), calc(0.1129 + -0.000042 * clamp(0, mod(h, 360) - 0, 15) + 0.000189 * clamp(0, mod(h, 360) - 15, 7.5) + 0.000259 * clamp(0, mod(h, 360) - 22.5, 3.75) + -0.002796 * clamp(0, mod(h, 360) - 26.25, 3.75) + -0.001569 * clamp(0, mod(h, 360) - 30, 30) + -0.00006 * clamp(0, mod(h, 360) - 60, 30) + 0.000294 * clamp(0, mod(h, 360) - 90, 30) + 0.001168 * clamp(0, mod(h, 360) - 120, 15) + 0.001734 * clamp(0, mod(h, 360) - 135, 7.5) + -0.00301 * clamp(0, mod(h, 360) - 142.5, 7.5) + -0.000858 * clamp(0, mod(h, 360) - 150, 30) + 0.00006 * clamp(0, mod(h, 360) - 180, 30) + 0.000266 * clamp(0, mod(h, 360) - 210, 15) + 0.000551 * clamp(0, mod(h, 360) - 225, 15) + 0.001873 * clamp(0, mod(h, 360) - 240, 15) + 0.005335 * clamp(0, mod(h, 360) - 255, 3.75) + 0.004506 * clamp(0, mod(h, 360) - 258.75, 1.875) + 0.001722 * clamp(0, mod(h, 360) - 260.625, 1.875) + 0.031806 * clamp(0, mod(h, 360) - 262.5, 1.875) + 0.005581 * clamp(0, mod(h, 360) - 264.375, 1.875) + -0.001805 * clamp(0, mod(h, 360) - 266.25, 3.75) + -0.001314 * clamp(0, mod(h, 360) - 270, 15) + -0.000927 * clamp(0, mod(h, 360) - 285, 15) + -0.000757 * clamp(0, mod(h, 360) - 300, 30) + -0.000475 * clamp(0, mod(h, 360) - 330, 30) + c * (1 - clamp(0, max(0.095 - var(--_tone-anchor), var(--_tone-anchor) - 0.095) * 10000, 1))));
352
+ --_tone-side-300: clamp(0, (var(--_tone-anchor) - 0.175) * 10000, 1);
353
+ --_tone-l-300: calc(0.215 + (var(--_tone-side-300) * 0.175 * var(--_tone-own) / var(--_tone-page) + (1 - var(--_tone-side-300)) * (var(--_tone-own) + (0.175 - var(--_tone-anchor)) * (0.725 - var(--_tone-own)) / var(--_tone-ink))));
354
+ --_tone-c-300: min(calc(c * (1 - var(--_tone-side-300) * 0.75 * (var(--_tone-anchor) - 0.175) / var(--_tone-page) - (1 - var(--_tone-side-300)) * 0.7 * (0.175 - var(--_tone-anchor)) / var(--_tone-ink))), calc(0.139 + -0.000051 * clamp(0, mod(h, 360) - 0, 15) + -0.000205 * clamp(0, mod(h, 360) - 15, 15) + -0.002679 * clamp(0, mod(h, 360) - 30, 15) + -0.000954 * clamp(0, mod(h, 360) - 45, 15) + -0.000558 * clamp(0, mod(h, 360) - 60, 15) + -0.000292 * clamp(0, mod(h, 360) - 75, 15) + 0.00037 * clamp(0, mod(h, 360) - 90, 30) + 0.001426 * clamp(0, mod(h, 360) - 120, 15) + 0.002147 * clamp(0, mod(h, 360) - 135, 7.5) + -0.003701 * clamp(0, mod(h, 360) - 142.5, 7.5) + -0.001056 * clamp(0, mod(h, 360) - 150, 30) + 0.000074 * clamp(0, mod(h, 360) - 180, 30) + 0.000327 * clamp(0, mod(h, 360) - 210, 15) + 0.000936 * clamp(0, mod(h, 360) - 225, 15) + 0.001661 * clamp(0, mod(h, 360) - 240, 7.5) + 0.002753 * clamp(0, mod(h, 360) - 247.5, 7.5) + 0.005836 * clamp(0, mod(h, 360) - 255, 3.75) + 0.005632 * clamp(0, mod(h, 360) - 258.75, 1.875) + 0.00032 * clamp(0, mod(h, 360) - 260.625, 1.875) + 0.039469 * clamp(0, mod(h, 360) - 262.5, 1.875) + 0.008554 * clamp(0, mod(h, 360) - 264.375, 1.875) + -0.002226 * clamp(0, mod(h, 360) - 266.25, 3.75) + -0.001621 * clamp(0, mod(h, 360) - 270, 15) + -0.001145 * clamp(0, mod(h, 360) - 285, 15) + -0.000934 * clamp(0, mod(h, 360) - 300, 30) + -0.000584 * clamp(0, mod(h, 360) - 330, 30) + c * (1 - clamp(0, max(0.175 - var(--_tone-anchor), var(--_tone-anchor) - 0.175) * 10000, 1))));
355
+ --_tone-side-400: clamp(0, (var(--_tone-anchor) - 0.285) * 10000, 1);
356
+ --_tone-l-400: calc(0.215 + (var(--_tone-side-400) * 0.285 * var(--_tone-own) / var(--_tone-page) + (1 - var(--_tone-side-400)) * (var(--_tone-own) + (0.285 - var(--_tone-anchor)) * (0.725 - var(--_tone-own)) / var(--_tone-ink))));
357
+ --_tone-c-400: min(calc(c * (1 - var(--_tone-side-400) * 0.75 * (var(--_tone-anchor) - 0.285) / var(--_tone-page) - (1 - var(--_tone-side-400)) * 0.7 * (0.285 - var(--_tone-anchor)) / var(--_tone-ink))), calc(0.1806 + -0.000069 * clamp(0, mod(h, 360) - 0, 15) + -0.000275 * clamp(0, mod(h, 360) - 15, 15) + -0.003478 * clamp(0, mod(h, 360) - 30, 15) + -0.001239 * clamp(0, mod(h, 360) - 45, 15) + -0.000724 * clamp(0, mod(h, 360) - 60, 15) + -0.00038 * clamp(0, mod(h, 360) - 75, 15) + 0.00048 * clamp(0, mod(h, 360) - 90, 30) + 0.00185 * clamp(0, mod(h, 360) - 120, 15) + 0.002796 * clamp(0, mod(h, 360) - 135, 7.5) + -0.004804 * clamp(0, mod(h, 360) - 142.5, 7.5) + -0.001373 * clamp(0, mod(h, 360) - 150, 30) + 0.000096 * clamp(0, mod(h, 360) - 180, 30) + 0.000424 * clamp(0, mod(h, 360) - 210, 15) + 0.001216 * clamp(0, mod(h, 360) - 225, 15) + 0.002157 * clamp(0, mod(h, 360) - 240, 7.5) + 0.003574 * clamp(0, mod(h, 360) - 247.5, 7.5) + 0.007182 * clamp(0, mod(h, 360) - 255, 3.75) + 0.011907 * clamp(0, mod(h, 360) - 258.75, 3.75) + 0.014848 * clamp(0, mod(h, 360) - 262.5, 1.875) + -0.000147 * clamp(0, mod(h, 360) - 264.375, 1.875) + -0.000493 * clamp(0, mod(h, 360) - 266.25, 3.75) + 0.000837 * clamp(0, mod(h, 360) - 270, 15) + -0.000963 * clamp(0, mod(h, 360) - 285, 15) + -0.001222 * clamp(0, mod(h, 360) - 300, 30) + -0.000755 * clamp(0, mod(h, 360) - 330, 30) + c * (1 - clamp(0, max(0.285 - var(--_tone-anchor), var(--_tone-anchor) - 0.285) * 10000, 1))));
358
+ --_tone-side-500: clamp(0, (var(--_tone-anchor) - 0.385) * 10000, 1);
359
+ --_tone-l-500: calc(0.215 + (var(--_tone-side-500) * 0.385 * var(--_tone-own) / var(--_tone-page) + (1 - var(--_tone-side-500)) * (var(--_tone-own) + (0.385 - var(--_tone-anchor)) * (0.725 - var(--_tone-own)) / var(--_tone-ink))));
360
+ --_tone-c-500: min(calc(c * (1 - var(--_tone-side-500) * 0.75 * (var(--_tone-anchor) - 0.385) / var(--_tone-page) - (1 - var(--_tone-side-500)) * 0.7 * (0.385 - var(--_tone-anchor)) / var(--_tone-ink))), calc(0.217 + -0.000054 * clamp(0, mod(h, 360) - 0, 15) + 0.000367 * clamp(0, mod(h, 360) - 15, 7.5) + 0.000491 * clamp(0, mod(h, 360) - 22.5, 3.75) + -0.002588 * clamp(0, mod(h, 360) - 26.25, 3.75) + -0.004174 * clamp(0, mod(h, 360) - 30, 15) + -0.001498 * clamp(0, mod(h, 360) - 45, 15) + -0.000871 * clamp(0, mod(h, 360) - 60, 15) + -0.000457 * clamp(0, mod(h, 360) - 75, 15) + 0.000578 * clamp(0, mod(h, 360) - 90, 30) + 0.002226 * clamp(0, mod(h, 360) - 120, 15) + 0.003369 * clamp(0, mod(h, 360) - 135, 7.5) + -0.004949 * clamp(0, mod(h, 360) - 142.5, 7.5) + -0.00226 * clamp(0, mod(h, 360) - 150, 15) + -0.000911 * clamp(0, mod(h, 360) - 165, 15) + -0.000397 * clamp(0, mod(h, 360) - 180, 15) + 0.000075 * clamp(0, mod(h, 360) - 195, 15) + 0.000515 * clamp(0, mod(h, 360) - 210, 15) + 0.001462 * clamp(0, mod(h, 360) - 225, 15) + 0.002597 * clamp(0, mod(h, 360) - 240, 7.5) + 0.004654 * clamp(0, mod(h, 360) - 247.5, 7.5) + 0.003382 * clamp(0, mod(h, 360) - 255, 3.75) + -0.000428 * clamp(0, mod(h, 360) - 258.75, 3.75) + -0.001147 * clamp(0, mod(h, 360) - 262.5, 7.5) + 0.001206 * clamp(0, mod(h, 360) - 270, 30) + 0.003477 * clamp(0, mod(h, 360) - 300, 15) + -0.001481 * clamp(0, mod(h, 360) - 315, 15) + -0.000939 * clamp(0, mod(h, 360) - 330, 30) + c * (1 - clamp(0, max(0.385 - var(--_tone-anchor), var(--_tone-anchor) - 0.385) * 10000, 1))));
361
+ --_tone-side-600: clamp(0, (var(--_tone-anchor) - 0.475) * 10000, 1);
362
+ --_tone-l-600: calc(0.215 + (var(--_tone-side-600) * 0.475 * var(--_tone-own) / var(--_tone-page) + (1 - var(--_tone-side-600)) * (var(--_tone-own) + (0.475 - var(--_tone-anchor)) * (0.725 - var(--_tone-own)) / var(--_tone-ink))));
363
+ --_tone-c-600: min(calc(c * (1 - var(--_tone-side-600) * 0.75 * (var(--_tone-anchor) - 0.475) / var(--_tone-page) - (1 - var(--_tone-side-600)) * 0.7 * (0.475 - var(--_tone-anchor)) / var(--_tone-ink))), calc(0.1814 + -0.000953 * clamp(0, mod(h, 360) - 0, 15) + -0.000085 * clamp(0, mod(h, 360) - 15, 15) + 0.000643 * clamp(0, mod(h, 360) - 30, 15) + -0.002141 * clamp(0, mod(h, 360) - 45, 15) + -0.00073 * clamp(0, mod(h, 360) - 60, 30) + 0.000807 * clamp(0, mod(h, 360) - 90, 30) + 0.002494 * clamp(0, mod(h, 360) - 120, 15) + 0.004004 * clamp(0, mod(h, 360) - 135, 7.5) + -0.005808 * clamp(0, mod(h, 360) - 142.5, 7.5) + -0.002637 * clamp(0, mod(h, 360) - 150, 15) + -0.001068 * clamp(0, mod(h, 360) - 165, 15) + -0.000463 * clamp(0, mod(h, 360) - 180, 15) + -0.000321 * clamp(0, mod(h, 360) - 195, 15) + 0.00121 * clamp(0, mod(h, 360) - 210, 30) + 0.003332 * clamp(0, mod(h, 360) - 240, 3.75) + -0.001024 * clamp(0, mod(h, 360) - 243.75, 3.75) + -0.000839 * clamp(0, mod(h, 360) - 247.5, 7.5) + -0.000242 * clamp(0, mod(h, 360) - 255, 15) + 0.000423 * clamp(0, mod(h, 360) - 270, 15) + 0.00113 * clamp(0, mod(h, 360) - 285, 15) + 0.002822 * clamp(0, mod(h, 360) - 300, 15) + 0.005129 * clamp(0, mod(h, 360) - 315, 7.5) + 0.007712 * clamp(0, mod(h, 360) - 322.5, 3.75) + 0.007836 * clamp(0, mod(h, 360) - 326.25, 1.875) + -0.008331 * clamp(0, mod(h, 360) - 328.125, 1.875) + -0.004069 * clamp(0, mod(h, 360) - 330, 15) + -0.00179 * clamp(0, mod(h, 360) - 345, 15) + c * (1 - clamp(0, max(0.475 - var(--_tone-anchor), var(--_tone-anchor) - 0.475) * 10000, 1))));
364
+ --_tone-side-700: clamp(0, (var(--_tone-anchor) - 0.555) * 10000, 1);
365
+ --_tone-l-700: calc(0.215 + (var(--_tone-side-700) * 0.555 * var(--_tone-own) / var(--_tone-page) + (1 - var(--_tone-side-700)) * (var(--_tone-own) + (0.555 - var(--_tone-anchor)) * (0.725 - var(--_tone-own)) / var(--_tone-ink))));
366
+ --_tone-c-700: min(calc(c * (1 - var(--_tone-side-700) * 0.75 * (var(--_tone-anchor) - 0.555) / var(--_tone-page) - (1 - var(--_tone-side-700)) * 0.7 * (0.555 - var(--_tone-anchor)) / var(--_tone-ink))), calc(0.1216 + -0.000617 * clamp(0, mod(h, 360) - 0, 15) + -0.000313 * clamp(0, mod(h, 360) - 15, 15) + 0.000847 * clamp(0, mod(h, 360) - 30, 30) + 0.002699 * clamp(0, mod(h, 360) - 60, 7.5) + -0.00041 * clamp(0, mod(h, 360) - 67.5, 7.5) + -0.000695 * clamp(0, mod(h, 360) - 75, 15) + 0.000784 * clamp(0, mod(h, 360) - 90, 30) + 0.002921 * clamp(0, mod(h, 360) - 120, 15) + 0.004464 * clamp(0, mod(h, 360) - 135, 7.5) + -0.00654 * clamp(0, mod(h, 360) - 142.5, 7.5) + -0.002984 * clamp(0, mod(h, 360) - 150, 15) + -0.001204 * clamp(0, mod(h, 360) - 165, 15) + -0.000524 * clamp(0, mod(h, 360) - 180, 15) + 0.000177 * clamp(0, mod(h, 360) - 195, 15) + 0.000518 * clamp(0, mod(h, 360) - 210, 15) + -0.001691 * clamp(0, mod(h, 360) - 225, 15) + -0.000449 * clamp(0, mod(h, 360) - 240, 30) + 0.000658 * clamp(0, mod(h, 360) - 270, 30) + 0.002103 * clamp(0, mod(h, 360) - 300, 15) + 0.003491 * clamp(0, mod(h, 360) - 315, 7.5) + 0.005354 * clamp(0, mod(h, 360) - 322.5, 3.75) + -0.002511 * clamp(0, mod(h, 360) - 326.25, 3.75) + -0.002746 * clamp(0, mod(h, 360) - 330, 15) + -0.001185 * clamp(0, mod(h, 360) - 345, 15) + c * (1 - clamp(0, max(0.555 - var(--_tone-anchor), var(--_tone-anchor) - 0.555) * 10000, 1))));
367
+ --_tone-side-800: clamp(0, (var(--_tone-anchor) - 0.625) * 10000, 1);
368
+ --_tone-l-800: calc(0.215 + (var(--_tone-side-800) * 0.625 * var(--_tone-own) / var(--_tone-page) + (1 - var(--_tone-side-800)) * (var(--_tone-own) + (0.625 - var(--_tone-anchor)) * (0.725 - var(--_tone-own)) / var(--_tone-ink))));
369
+ --_tone-c-800: min(calc(c * (1 - var(--_tone-side-800) * 0.75 * (var(--_tone-anchor) - 0.625) / var(--_tone-page) - (1 - var(--_tone-side-800)) * 0.7 * (0.625 - var(--_tone-anchor)) / var(--_tone-ink))), calc(0.071 + 0.000433 * clamp(0, mod(h, 360) - 30, 15) + 0.000682 * clamp(0, mod(h, 360) - 45, 15) + 0.00177 * clamp(0, mod(h, 360) - 60, 15) + 0.003089 * clamp(0, mod(h, 360) - 75, 15) + 0.000317 * clamp(0, mod(h, 360) - 90, 15) + 0.001207 * clamp(0, mod(h, 360) - 105, 15) + 0.002942 * clamp(0, mod(h, 360) - 120, 15) + 0.005122 * clamp(0, mod(h, 360) - 135, 7.5) + -0.007282 * clamp(0, mod(h, 360) - 142.5, 7.5) + -0.003281 * clamp(0, mod(h, 360) - 150, 15) + -0.001338 * clamp(0, mod(h, 360) - 165, 15) + -0.000525 * clamp(0, mod(h, 360) - 180, 15) + 0.000083 * clamp(0, mod(h, 360) - 195, 7.5) + -0.005575 * clamp(0, mod(h, 360) - 206.25, 3.75) + -0.001605 * clamp(0, mod(h, 360) - 210, 30) + -0.000081 * clamp(0, mod(h, 360) - 240, 30) + 0.000384 * clamp(0, mod(h, 360) - 270, 30) + 0.001457 * clamp(0, mod(h, 360) - 300, 15) + 0.0023 * clamp(0, mod(h, 360) - 315, 7.5) + 0.003522 * clamp(0, mod(h, 360) - 322.5, 3.75) + -0.003698 * clamp(0, mod(h, 360) - 326.25, 3.75) + -0.001412 * clamp(0, mod(h, 360) - 330, 30) + c * (1 - clamp(0, max(0.625 - var(--_tone-anchor), var(--_tone-anchor) - 0.625) * 10000, 1))));
370
+ --_tone-side-900: clamp(0, (var(--_tone-anchor) - 0.68) * 10000, 1);
371
+ --_tone-l-900: calc(0.215 + (var(--_tone-side-900) * 0.68 * var(--_tone-own) / var(--_tone-page) + (1 - var(--_tone-side-900)) * (var(--_tone-own) + (0.68 - var(--_tone-anchor)) * (0.725 - var(--_tone-own)) / var(--_tone-ink))));
372
+ --_tone-c-900: min(calc(c * (1 - var(--_tone-side-900) * 0.75 * (var(--_tone-anchor) - 0.68) / var(--_tone-page) - (1 - var(--_tone-side-900)) * 0.7 * (0.68 - var(--_tone-anchor)) / var(--_tone-ink))), calc(0.0445 + 0.000014 * clamp(0, mod(h, 360) - 0, 30) + 0.000281 * clamp(0, mod(h, 360) - 30, 15) + 0.000443 * clamp(0, mod(h, 360) - 45, 15) + 0.000868 * clamp(0, mod(h, 360) - 60, 15) + 0.002622 * clamp(0, mod(h, 360) - 75, 15) + 0.006833 * clamp(0, mod(h, 360) - 90, 7.5) + 0.004798 * clamp(0, mod(h, 360) - 97.5, 3.75) + 0.000127 * clamp(0, mod(h, 360) - 101.25, 3.75) + 0.001421 * clamp(0, mod(h, 360) - 105, 15) + 0.002693 * clamp(0, mod(h, 360) - 120, 7.5) + 0.003204 * clamp(0, mod(h, 360) - 127.5, 3.75) + -0.006126 * clamp(0, mod(h, 360) - 131.25, 3.75) + -0.004083 * clamp(0, mod(h, 360) - 135, 7.5) + -0.002626 * clamp(0, mod(h, 360) - 142.5, 7.5) + -0.001286 * clamp(0, mod(h, 360) - 150, 15) + -0.000139 * clamp(0, mod(h, 360) - 165, 15) + 0.000437 * clamp(0, mod(h, 360) - 180, 7.5) + 0.0001 * clamp(0, mod(h, 360) - 187.5, 7.5) + -0.005631 * clamp(0, mod(h, 360) - 195, 7.5) + -0.002725 * clamp(0, mod(h, 360) - 202.5, 7.5) + -0.001462 * clamp(0, mod(h, 360) - 210, 15) + -0.000624 * clamp(0, mod(h, 360) - 225, 15) + -0.000222 * clamp(0, mod(h, 360) - 240, 30) + 0.000295 * clamp(0, mod(h, 360) - 270, 30) + 0.000899 * clamp(0, mod(h, 360) - 300, 15) + 0.001588 * clamp(0, mod(h, 360) - 315, 7.5) + -0.000365 * clamp(0, mod(h, 360) - 322.5, 7.5) + -0.000905 * clamp(0, mod(h, 360) - 330, 30) + c * (1 - clamp(0, max(0.68 - var(--_tone-anchor), var(--_tone-anchor) - 0.68) * 10000, 1))));
373
+ --_tone-side-950: clamp(0, (var(--_tone-anchor) - 0.725) * 10000, 1);
374
+ --_tone-l-950: calc(0.215 + (var(--_tone-side-950) * 0.725 * var(--_tone-own) / var(--_tone-page) + (1 - var(--_tone-side-950)) * (var(--_tone-own) + (0.725 - var(--_tone-anchor)) * (0.725 - var(--_tone-own)) / var(--_tone-ink))));
375
+ --_tone-c-950: min(calc(c * (1 - var(--_tone-side-950) * 0.75 * (var(--_tone-anchor) - 0.725) / var(--_tone-page) - (1 - var(--_tone-side-950)) * 0.7 * (0.725 - var(--_tone-anchor)) / var(--_tone-ink))), calc(0.028 + -0.000024 * clamp(0, mod(h, 360) - 0, 30) + 0.000017 * clamp(0, mod(h, 360) - 30, 30) + 0.001284 * clamp(0, mod(h, 360) - 60, 30) + 0.00436 * clamp(0, mod(h, 360) - 90, 7.5) + -0.000156 * clamp(0, mod(h, 360) - 120, 30) + -0.000459 * clamp(0, mod(h, 360) - 150, 30) + 0.000268 * clamp(0, mod(h, 360) - 180, 15) + -0.002609 * clamp(0, mod(h, 360) - 195, 15) + -0.000546 * clamp(0, mod(h, 360) - 210, 30) + -0.000098 * clamp(0, mod(h, 360) - 240, 30) + 0.00018 * clamp(0, mod(h, 360) - 270, 30) + 0.000453 * clamp(0, mod(h, 360) - 300, 30) + -0.000571 * clamp(0, mod(h, 360) - 330, 30) + c * (1 - clamp(0, max(0.725 - var(--_tone-anchor), var(--_tone-anchor) - 0.725) * 10000, 1))));
376
+ --tone-1-50: oklch(from var(--tone-1) var(--_tone-l-50) var(--_tone-c-50) h);
377
+ --tone-1-100: oklch(from var(--tone-1) var(--_tone-l-100) var(--_tone-c-100) h);
378
+ --tone-1-200: oklch(from var(--tone-1) var(--_tone-l-200) var(--_tone-c-200) h);
379
+ --tone-1-300: oklch(from var(--tone-1) var(--_tone-l-300) var(--_tone-c-300) h);
380
+ --tone-1-400: oklch(from var(--tone-1) var(--_tone-l-400) var(--_tone-c-400) h);
381
+ --tone-1-500: oklch(from var(--tone-1) var(--_tone-l-500) var(--_tone-c-500) h);
382
+ --tone-1-600: oklch(from var(--tone-1) var(--_tone-l-600) var(--_tone-c-600) h);
383
+ --tone-1-700: oklch(from var(--tone-1) var(--_tone-l-700) var(--_tone-c-700) h);
384
+ --tone-1-800: oklch(from var(--tone-1) var(--_tone-l-800) var(--_tone-c-800) h);
385
+ --tone-1-900: oklch(from var(--tone-1) var(--_tone-l-900) var(--_tone-c-900) h);
386
+ --tone-1-950: oklch(from var(--tone-1) var(--_tone-l-950) var(--_tone-c-950) h);
387
+ --tone-2-50: oklch(from var(--tone-2) var(--_tone-l-50) var(--_tone-c-50) h);
388
+ --tone-2-100: oklch(from var(--tone-2) var(--_tone-l-100) var(--_tone-c-100) h);
389
+ --tone-2-200: oklch(from var(--tone-2) var(--_tone-l-200) var(--_tone-c-200) h);
390
+ --tone-2-300: oklch(from var(--tone-2) var(--_tone-l-300) var(--_tone-c-300) h);
391
+ --tone-2-400: oklch(from var(--tone-2) var(--_tone-l-400) var(--_tone-c-400) h);
392
+ --tone-2-500: oklch(from var(--tone-2) var(--_tone-l-500) var(--_tone-c-500) h);
393
+ --tone-2-600: oklch(from var(--tone-2) var(--_tone-l-600) var(--_tone-c-600) h);
394
+ --tone-2-700: oklch(from var(--tone-2) var(--_tone-l-700) var(--_tone-c-700) h);
395
+ --tone-2-800: oklch(from var(--tone-2) var(--_tone-l-800) var(--_tone-c-800) h);
396
+ --tone-2-900: oklch(from var(--tone-2) var(--_tone-l-900) var(--_tone-c-900) h);
397
+ --tone-2-950: oklch(from var(--tone-2) var(--_tone-l-950) var(--_tone-c-950) h);
398
+ --tone-3-50: oklch(from var(--tone-3) var(--_tone-l-50) var(--_tone-c-50) h);
399
+ --tone-3-100: oklch(from var(--tone-3) var(--_tone-l-100) var(--_tone-c-100) h);
400
+ --tone-3-200: oklch(from var(--tone-3) var(--_tone-l-200) var(--_tone-c-200) h);
401
+ --tone-3-300: oklch(from var(--tone-3) var(--_tone-l-300) var(--_tone-c-300) h);
402
+ --tone-3-400: oklch(from var(--tone-3) var(--_tone-l-400) var(--_tone-c-400) h);
403
+ --tone-3-500: oklch(from var(--tone-3) var(--_tone-l-500) var(--_tone-c-500) h);
404
+ --tone-3-600: oklch(from var(--tone-3) var(--_tone-l-600) var(--_tone-c-600) h);
405
+ --tone-3-700: oklch(from var(--tone-3) var(--_tone-l-700) var(--_tone-c-700) h);
406
+ --tone-3-800: oklch(from var(--tone-3) var(--_tone-l-800) var(--_tone-c-800) h);
407
+ --tone-3-900: oklch(from var(--tone-3) var(--_tone-l-900) var(--_tone-c-900) h);
408
+ --tone-3-950: oklch(from var(--tone-3) var(--_tone-l-950) var(--_tone-c-950) h);
409
+ --tone-info-50: oklch(from var(--tone-info) var(--_tone-l-50) var(--_tone-c-50) h);
410
+ --tone-info-100: oklch(from var(--tone-info) var(--_tone-l-100) var(--_tone-c-100) h);
411
+ --tone-info-200: oklch(from var(--tone-info) var(--_tone-l-200) var(--_tone-c-200) h);
412
+ --tone-info-300: oklch(from var(--tone-info) var(--_tone-l-300) var(--_tone-c-300) h);
413
+ --tone-info-400: oklch(from var(--tone-info) var(--_tone-l-400) var(--_tone-c-400) h);
414
+ --tone-info-500: oklch(from var(--tone-info) var(--_tone-l-500) var(--_tone-c-500) h);
415
+ --tone-info-600: oklch(from var(--tone-info) var(--_tone-l-600) var(--_tone-c-600) h);
416
+ --tone-info-700: oklch(from var(--tone-info) var(--_tone-l-700) var(--_tone-c-700) h);
417
+ --tone-info-800: oklch(from var(--tone-info) var(--_tone-l-800) var(--_tone-c-800) h);
418
+ --tone-info-900: oklch(from var(--tone-info) var(--_tone-l-900) var(--_tone-c-900) h);
419
+ --tone-info-950: oklch(from var(--tone-info) var(--_tone-l-950) var(--_tone-c-950) h);
420
+ --tone-warning-50: oklch(from var(--tone-warning) var(--_tone-l-50) var(--_tone-c-50) h);
421
+ --tone-warning-100: oklch(from var(--tone-warning) var(--_tone-l-100) var(--_tone-c-100) h);
422
+ --tone-warning-200: oklch(from var(--tone-warning) var(--_tone-l-200) var(--_tone-c-200) h);
423
+ --tone-warning-300: oklch(from var(--tone-warning) var(--_tone-l-300) var(--_tone-c-300) h);
424
+ --tone-warning-400: oklch(from var(--tone-warning) var(--_tone-l-400) var(--_tone-c-400) h);
425
+ --tone-warning-500: oklch(from var(--tone-warning) var(--_tone-l-500) var(--_tone-c-500) h);
426
+ --tone-warning-600: oklch(from var(--tone-warning) var(--_tone-l-600) var(--_tone-c-600) h);
427
+ --tone-warning-700: oklch(from var(--tone-warning) var(--_tone-l-700) var(--_tone-c-700) h);
428
+ --tone-warning-800: oklch(from var(--tone-warning) var(--_tone-l-800) var(--_tone-c-800) h);
429
+ --tone-warning-900: oklch(from var(--tone-warning) var(--_tone-l-900) var(--_tone-c-900) h);
430
+ --tone-warning-950: oklch(from var(--tone-warning) var(--_tone-l-950) var(--_tone-c-950) h);
431
+ --success-50: oklch(from var(--success) var(--_tone-l-50) var(--_tone-c-50) h);
432
+ --success-100: oklch(from var(--success) var(--_tone-l-100) var(--_tone-c-100) h);
433
+ --success-200: oklch(from var(--success) var(--_tone-l-200) var(--_tone-c-200) h);
434
+ --success-300: oklch(from var(--success) var(--_tone-l-300) var(--_tone-c-300) h);
435
+ --success-400: oklch(from var(--success) var(--_tone-l-400) var(--_tone-c-400) h);
436
+ --success-500: oklch(from var(--success) var(--_tone-l-500) var(--_tone-c-500) h);
437
+ --success-600: oklch(from var(--success) var(--_tone-l-600) var(--_tone-c-600) h);
438
+ --success-700: oklch(from var(--success) var(--_tone-l-700) var(--_tone-c-700) h);
439
+ --success-800: oklch(from var(--success) var(--_tone-l-800) var(--_tone-c-800) h);
440
+ --success-900: oklch(from var(--success) var(--_tone-l-900) var(--_tone-c-900) h);
441
+ --success-950: oklch(from var(--success) var(--_tone-l-950) var(--_tone-c-950) h);
442
+ --destructive-50: oklch(from var(--destructive) var(--_tone-l-50) var(--_tone-c-50) h);
443
+ --destructive-100: oklch(from var(--destructive) var(--_tone-l-100) var(--_tone-c-100) h);
444
+ --destructive-200: oklch(from var(--destructive) var(--_tone-l-200) var(--_tone-c-200) h);
445
+ --destructive-300: oklch(from var(--destructive) var(--_tone-l-300) var(--_tone-c-300) h);
446
+ --destructive-400: oklch(from var(--destructive) var(--_tone-l-400) var(--_tone-c-400) h);
447
+ --destructive-500: oklch(from var(--destructive) var(--_tone-l-500) var(--_tone-c-500) h);
448
+ --destructive-600: oklch(from var(--destructive) var(--_tone-l-600) var(--_tone-c-600) h);
449
+ --destructive-700: oklch(from var(--destructive) var(--_tone-l-700) var(--_tone-c-700) h);
450
+ --destructive-800: oklch(from var(--destructive) var(--_tone-l-800) var(--_tone-c-800) h);
451
+ --destructive-900: oklch(from var(--destructive) var(--_tone-l-900) var(--_tone-c-900) h);
452
+ --destructive-950: oklch(from var(--destructive) var(--_tone-l-950) var(--_tone-c-950) h);
375
453
  }
376
454
 
377
455
  /* Slots: data-palette="blue" fills the palette-* roles from one family, so a
@@ -342,7 +342,7 @@ Which token to reach for, and what it is most often confused with. Generated fro
342
342
  More colour for apps, generated from the active theme: neutral and eight hue families, plus a 50–950 scale under every tone. Each family keeps its hue and leans toward the brand (half the gap, at most 15°; --theme-palette-harmony scales it, 0 = own hues). Neutral is the theme's --background mixed toward its --foreground. Steps follow the mode: low steps sit near the page and high ones far from it in light and dark alike, so a pair needs no dark: variant. For decorative and categorical colour (tags, avatars, labels, legends, illustration); surfaces, text and actions take roles. Components never name a step.
343
343
 
344
344
  - **Families:** `neutral`, `red`, `orange`, `yellow`, `green`, `teal`, `blue`, `purple`, `pink`, each 50–950.
345
- - **Tone scales:** `tone-1-*`, `tone-2-*`, `tone-3-*`, `tone-info-*`, `tone-warning-*`, `success-*`, `destructive-*`; step 500 is the tone itself.
345
+ - **Tone scales:** `tone-1-*`, `tone-2-*`, `tone-3-*`, `tone-info-*`, `tone-warning-*`, `success-*`, `destructive-*`; one ladder of depths shared by every tone, with the tone exactly on the step nearest its own lightness (500 for a mid tone, 800 for a light status colour in dark mode). Use the tone token itself for the tone.
346
346
  - **Use as:** bg-blue-100, text-blue-800, border-neutral-200, bg-tone-1-100 — or var(--teal-500). Tailwind's other families (slate, gray, zinc, stone, amber, lime, emerald, cyan, sky, indigo, violet, fuchsia, rose) are switched off.
347
347
  - **tag / label:** bg-<family>-100 text-<family>-800 (held to 4.5:1 in every theme and mode)
348
348
  - **text on the page:** text-<family>-700
package/llms-full.txt CHANGED
@@ -23100,7 +23100,7 @@ Which token to reach for, and what it is most often confused with. Generated fro
23100
23100
  More colour for apps, generated from the active theme: neutral and eight hue families, plus a 50–950 scale under every tone. Each family keeps its hue and leans toward the brand (half the gap, at most 15°; --theme-palette-harmony scales it, 0 = own hues). Neutral is the theme's --background mixed toward its --foreground. Steps follow the mode: low steps sit near the page and high ones far from it in light and dark alike, so a pair needs no dark: variant. For decorative and categorical colour (tags, avatars, labels, legends, illustration); surfaces, text and actions take roles. Components never name a step.
23101
23101
 
23102
23102
  - **Families:** `neutral`, `red`, `orange`, `yellow`, `green`, `teal`, `blue`, `purple`, `pink`, each 50–950.
23103
- - **Tone scales:** `tone-1-*`, `tone-2-*`, `tone-3-*`, `tone-info-*`, `tone-warning-*`, `success-*`, `destructive-*`; step 500 is the tone itself.
23103
+ - **Tone scales:** `tone-1-*`, `tone-2-*`, `tone-3-*`, `tone-info-*`, `tone-warning-*`, `success-*`, `destructive-*`; one ladder of depths shared by every tone, with the tone exactly on the step nearest its own lightness (500 for a mid tone, 800 for a light status colour in dark mode). Use the tone token itself for the tone.
23104
23104
  - **Use as:** bg-blue-100, text-blue-800, border-neutral-200, bg-tone-1-100 — or var(--teal-500). Tailwind's other families (slate, gray, zinc, stone, amber, lime, emerald, cyan, sky, indigo, violet, fuchsia, rose) are switched off.
23105
23105
  - **tag / label:** bg-<family>-100 text-<family>-800 (held to 4.5:1 in every theme and mode)
23106
23106
  - **text on the page:** text-<family>-700
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@sableui/react",
3
- "version": "0.12.0",
3
+ "version": "0.13.0",
4
4
  "description": "Sable: themeable React components, layout patterns, and tools for coding agents.",
5
5
  "type": "module",
6
6
  "sideEffects": [
package/registry.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "$schema": "https://sable.design/registry.schema.json",
3
3
  "name": "@sableui/react",
4
- "version": "0.12.0",
4
+ "version": "0.13.0",
5
5
  "description": "Themeable React components, semantic tokens, layout patterns, presets, and package-owned agent skills. Default theme: Sable.",
6
6
  "engine": {
7
7
  "behavior": "@base-ui/react",