@botiverse/raft-ui 0.56.1 → 0.57.1

package/CHANGELOG.md

@@ -1,3 +1,62 @@
+## [0.57.1](https://github.com/botiverse/raft-design/compare/v0.57.0...v0.57.1) (2026-11-02)
+
+### Fixed
+
+- **SidebarSectionControls**: a section's controls are always shown, with a mouse as on a touch screen. ([#942](https://github.com/botiverse/raft-design/pull/942))
+  - Why: shown only on hover, they hid what the header can do, and a long title's room changed as the pointer passed (stdrc).
+  - Affects: the controls are no longer hidden at rest with a mouse; a collapsed section's attention mark sits before them in the row and hides only while the section is open.
+  - Docs: https://raft-design.botiverse.build/components/sidebar/
+- **Edge pull of a header's first and last control** (sidebar section controls, panel and dialog heads, Lightbox actions): it holds while that control's menu is open. ([#942](https://github.com/botiverse/raft-design/pull/942))
+  - Why: an open menu puts Base UI focus guards and a hidden portal span beside its trigger, so the trigger stopped being the last child, lost its 5px pull and moved left.
+  - Affects: the pull now skips `[data-base-ui-focus-guard]` and `[aria-owns]` siblings.
+  - Docs: https://raft-design.botiverse.build/foundations/alignment/
+
+## [0.57.0](https://github.com/botiverse/raft-design/compare/v0.56.1...v0.57.0) (2026-11-01)
+
+### Breaking Changes
+
+- **Deprecated tokens removed**: the 165 tokens of the `deprecated` group of `tokens.json` and their `foundation.css` declarations are gone. ([#930](https://github.com/botiverse/raft-design/pull/930))
+  - Why: the aliases doubled the token list and let old names keep spreading; nothing in Raft's apps used them any more.
+  - Affects: `primary-*`, `accent-*`, `secondary-*`, `color-brutal-*-{n}`, `theme-shadow-*`, `theme-focus-ring`, `layer-panel`, `layer-inset`, `layer-canvas-muted`, `layer-hud-foreground`, `foreground-strong`, `foreground-icon`, `foreground-placeholder`, `line`, `line-muted`, `fill-pressed`, `fill-frame-pressed`, `fill-row-hover`, `fill-row-open`, `fill-message-hover`, `sticker-pressed`.
+  - Migrate: run `node node_modules/@botiverse/raft-ui/codemods/token-names.mjs <dir>` before upgrading; it rewrites each former name to the token it pointed at.
+  - Docs: https://raft-design.botiverse.build/foundations/tokens/#former-names
+- **Deprecated utilities removed**: the color, shadow and overlay utilities built on those tokens. ([#930](https://github.com/botiverse/raft-design/pull/930))
+  - Why: same as above; they only existed as aliases.
+  - Affects: `bg-primary-*`, `bg-accent-*`, `bg-secondary-*`, `bg-brutal-*`, `bg-soft-signal` and the other color utilities of the removed names, `shadow-raft-*`, `press-overlay`, `press-overlay-sticker`, `row-hover-overlay`, `row-open-overlay`. `bg-fill-row-hover` stays for now.
+  - Migrate: run the codemod above; use `bg-fill-subtle` for `bg-fill-row-hover`.
+  - Docs: https://raft-design.botiverse.build/foundations/tokens/#former-names
+- **FloatButton, FloatButtonGroup** removed, with their types and `components/float-button/float-button.css`. ([#930](https://github.com/botiverse/raft-design/pull/930))
+  - Why: deprecated and unused; a floating control is only for moving through a list, and page actions belong in a header or toolbar.
+  - Migrate: put the action in the header or a toolbar.
+  - Docs: https://raft-design.botiverse.build/foundations/elevation/
+- **LiveAgentActivityBar** and its parts (`LiveAgentActivityBarAvatar`, `LiveAgentActivityBarContent`, `LiveAgentActivityBarRow`, `LiveAgentActivityBarStatus`, `LiveAgentActivityBarText`) removed, with **SidebarLiveActivity**, the sidebar part that held it. ([#930](https://github.com/botiverse/raft-design/pull/930))
+  - Why: a live strip at the bottom of the sidebar or above the tab bar showed changing content unrelated to the page; working agents show in the header summary and in their own rows.
+  - Migrate: show working agents in place.
+  - Docs: https://raft-design.botiverse.build/people-and-agents/working-agents/
+- **LegacyTaskPanel*** removed: the 17 parts and their types. ([#930](https://github.com/botiverse/raft-design/pull/930))
+  - Why: deprecated and unused.
+  - Migrate: use the Tasks components.
+  - Docs: https://raft-design.botiverse.build/components/tasks/
+- **MessageTextSelectionToolbar, MessageTextSelectionToolbarButton, MessageTextSelectionToolbarSeparator, createMessageTextSelectionAnchor** and their 4 types removed. ([#930](https://github.com/botiverse/raft-design/pull/930))
+  - Why: they were message-named aliases of the generic toolbar.
+  - Migrate: use `TextSelectionToolbar`, `TextSelectionToolbarButton`, `TextSelectionToolbarSeparator`, `createTextSelectionAnchor`.
+  - Docs: https://raft-design.botiverse.build/components/text-selection-toolbar/
+- **CreateTaskIcon** removed. ([#930](https://github.com/botiverse/raft-design/pull/930))
+  - Why: unused; Create Task uses Lucide's `plus`.
+  - Migrate: use Lucide's `plus`.
+  - Docs: https://raft-design.botiverse.build/components/icons/
+- **Meter `low`** removed. ([#930](https://github.com/botiverse/raft-design/pull/930))
+  - Why: `warnAt` replaced it.
+  - Migrate: `low={20}` of 100 is `warnAt={0.8}`, the default.
+  - Docs: https://raft-design.botiverse.build/components/meter/
+
+### Fixed
+
+- **SidebarSectionControl**: on a touch screen the section controls stay 4px apart, as with a mouse. ([#935](https://github.com/botiverse/raft-design/pull/935))
+  - Why: a 20px gap made the two controls read as separate buttons; their 44px-high hit areas now meet in the middle of the 4px gap instead, with no overlap and no dead strip.
+  - Affects: touch gap 20px → 4px (`gap-1`); each hit area reaches 2px into the gap.
+  - Docs: https://raft-design.botiverse.build/components/sidebar/
+
 ## [0.56.1](https://github.com/botiverse/raft-design/compare/v0.56.0...v0.56.1) (2026-10-31)
 
 ### Fixed

package/codemods/token-names.mjs

@@ -5,8 +5,8 @@
 //
 // Rewrites Tailwind utilities (`bg-layer-panel`, `hover:border-line-muted/50`)
 // and CSS custom properties (`var(--primary-soft)`) in .ts, .tsx, .js, .jsx,
-// .mjs, .css and .html files. The old names keep working as deprecated aliases
-// until raft-ui 1.0, so the rewrite can land at any time after upgrading.
+// .mjs, .css and .html files. The old names were deprecated aliases up to
+// raft-ui 0.56 and are removed after it: run this before upgrading past 0.56.
 //
 // Review by hand afterwards: a guard that forbids a former name (a lint rule,
 // a test's doesNotMatch, an allowlist) now forbids the current one, and a

package/dist/cn.mjs

@@ -25,16 +25,7 @@ const twMerge = extendTailwindMerge({ extend: {
 			"float",
 			"sticker",
 			"focus"
-		] }, { shadow: [{ raft: [
-			"xs",
-			"sm",
-			"md",
-			"lg",
-			"xl",
-			"float",
-			"sticker",
-			"focus"
-		] }] }],
+		] }],
 		rounded: [{ rounded: [
 			"sticker",
 			"chip",
@@ -68,18 +59,12 @@ const twMerge = extendTailwindMerge({ extend: {
 			"x"
 		] }],
 		opacity: [{ opacity: ["dimmed"] }],
-		"bg-image": [
-			{ overlay: [
-				"subtle",
-				"medium",
-				"sticker-medium",
-				"frame-medium"
-			] },
-			"press-overlay",
-			"press-overlay-sticker",
-			"row-hover-overlay",
-			"row-open-overlay"
-		]
+		"bg-image": [{ overlay: [
+			"subtle",
+			"medium",
+			"sticker-medium",
+			"frame-medium"
+		] }]
 	}
 } });
 function cn(...inputs) {

package/dist/components/icons/action-icons.d.mts

@@ -27,8 +27,6 @@ export declare function FollowArtifactIcon(props: ActionIconProps): import("reac
 export declare function UnfollowArtifactIcon(props: ActionIconProps): import("react").JSX.Element;
 /** Add a comment: CommentIcon at 24, its bubble cut short of a plus in the bottom-right corner. */
 export declare function AddCommentIcon(props: ActionIconProps): import("react").JSX.Element;
-/** Create a task: Lucide's list-todo, a plus in place of its last line. */
-export declare function CreateTaskIcon(props: ActionIconProps): import("react").JSX.Element;
 /** Reopen a task: a ticked box, broken open at the top by a counter-clockwise arrow (Lucide's rotate-ccw-square with a check). */
 export declare function ReopenTaskIcon(props: ActionIconProps): import("react").JSX.Element;
 //#endregion

package/dist/components/icons/action-icons.mjs

@@ -325,37 +325,6 @@ function AddCommentIcon(props) {
 		]
 	});
 }
-/** Create a task: Lucide's list-todo, a plus in place of its last line. */
-function CreateTaskIcon(props) {
-	return /* @__PURE__ */ jsxs("svg", {
-		xmlns: "http://www.w3.org/2000/svg",
-		width: 24,
-		height: 24,
-		viewBox: "0 0 24 24",
-		"aria-hidden": "true",
-		focusable: "false",
-		fill: "none",
-		stroke: "currentColor",
-		strokeLinecap: "round",
-		strokeLinejoin: "round",
-		strokeWidth: 2,
-		...props,
-		children: [
-			/* @__PURE__ */ jsx("rect", {
-				x: 3,
-				y: 4,
-				width: 6,
-				height: 6,
-				rx: 1
-			}),
-			/* @__PURE__ */ jsx("path", { d: "M13 5h8" }),
-			/* @__PURE__ */ jsx("path", { d: "M13 12h8" }),
-			/* @__PURE__ */ jsx("path", { d: "m3 17 2 2 4-4" }),
-			/* @__PURE__ */ jsx("path", { d: "M19 16v6" }),
-			/* @__PURE__ */ jsx("path", { d: "M16 19h6" })
-		]
-	});
-}
 /** Reopen a task: a ticked box, broken open at the top by a counter-clockwise arrow (Lucide's rotate-ccw-square with a check). */
 function ReopenTaskIcon(props) {
 	return /* @__PURE__ */ jsxs("svg", {
@@ -380,4 +349,4 @@ function ReopenTaskIcon(props) {
 	});
 }
 //#endregion
-export { AddCommentIcon, CreateTaskIcon, FollowArtifactIcon, FollowThreadIcon, JoinChannelIcon, JoinJointChannelIcon, JoinPrivateChannelIcon, LeaveChannelIcon, LeaveJointChannelIcon, LeavePrivateChannelIcon, ReopenTaskIcon, UnfollowArtifactIcon, UnfollowThreadIcon };
+export { AddCommentIcon, FollowArtifactIcon, FollowThreadIcon, JoinChannelIcon, JoinJointChannelIcon, JoinPrivateChannelIcon, LeaveChannelIcon, LeaveJointChannelIcon, LeavePrivateChannelIcon, ReopenTaskIcon, UnfollowArtifactIcon, UnfollowThreadIcon };

package/dist/components/icons/index.d.mts

@@ -1,4 +1,4 @@
-import { ActionIconProps, AddCommentIcon, CreateTaskIcon, FollowArtifactIcon, FollowThreadIcon, JoinChannelIcon, JoinJointChannelIcon, JoinPrivateChannelIcon, LeaveChannelIcon, LeaveJointChannelIcon, LeavePrivateChannelIcon, ReopenTaskIcon, UnfollowArtifactIcon, UnfollowThreadIcon } from "./action-icons.mjs";
+import { ActionIconProps, AddCommentIcon, FollowArtifactIcon, FollowThreadIcon, JoinChannelIcon, JoinJointChannelIcon, JoinPrivateChannelIcon, LeaveChannelIcon, LeaveJointChannelIcon, LeavePrivateChannelIcon, ReopenTaskIcon, UnfollowArtifactIcon, UnfollowThreadIcon } from "./action-icons.mjs";
 import { ChatIcon, CommentIcon, ConversationIconProps, DirectMessageIcon, FeedbackIcon, MessageIcon, ThreadIcon } from "./conversation-icons.mjs";
 import { ArtifactIcon, ObjectIconProps } from "./object-icons.mjs";
-export { type ActionIconProps, AddCommentIcon, ArtifactIcon, ChatIcon, CommentIcon, type ConversationIconProps, CreateTaskIcon, DirectMessageIcon, FeedbackIcon, FollowArtifactIcon, FollowThreadIcon, JoinChannelIcon, JoinJointChannelIcon, JoinPrivateChannelIcon, LeaveChannelIcon, LeaveJointChannelIcon, LeavePrivateChannelIcon, MessageIcon, type ObjectIconProps, ReopenTaskIcon, ThreadIcon, UnfollowArtifactIcon, UnfollowThreadIcon };
+export { type ActionIconProps, AddCommentIcon, ArtifactIcon, ChatIcon, CommentIcon, type ConversationIconProps, DirectMessageIcon, FeedbackIcon, FollowArtifactIcon, FollowThreadIcon, JoinChannelIcon, JoinJointChannelIcon, JoinPrivateChannelIcon, LeaveChannelIcon, LeaveJointChannelIcon, LeavePrivateChannelIcon, MessageIcon, type ObjectIconProps, ReopenTaskIcon, ThreadIcon, UnfollowArtifactIcon, UnfollowThreadIcon };

package/dist/components/lightbox/lightbox.mjs

@@ -45,7 +45,7 @@ const lightbox = tv({ slots: {
 	actions: [
 		"flex shrink-0 items-center",
 		"gap-1",
-		"[&>[data-icon-inset]:last-child]:-mr-icon-inset"
+		"[&>[data-icon-inset]:nth-last-child(1_of_:not([data-base-ui-focus-guard],[aria-owns]))]:-mr-icon-inset"
 	],
 	stage: ["pointer-events-none relative flex min-h-0 flex-1 items-center justify-center overflow-hidden"],
 	media: ["pointer-events-auto max-h-[80vh] max-w-[86vw] border-0 bg-transparent shadow-none"],

package/dist/components/message-item/index.d.mts

@@ -9,5 +9,4 @@ import { MessageReactionAddButton, MessageReactionAddButtonProps, MessageReactio
 import { MessageReferenceChipVariant, MessageReferenceTextVariant } from "./message-reference.recipe.mjs";
 import { MessageReferenceChip, MessageReferenceChipProps, MessageReferenceIcon, MessageReferenceIconProps, MessageReferenceIndicator, MessageReferenceIndicatorProps, MessageReferenceLabel, MessageReferenceLabelProps, MessageReferencePending, MessageReferencePendingProps, MessageReferenceReadMark, MessageReferenceReadMarkProps, MessageReferenceSuffix, MessageReferenceSuffixProps, MessageReferenceText, MessageReferenceTextProps, MessageReferenceUnavailable, MessageReferenceUnavailableProps } from "./message-reference.mjs";
 import { MessageMultiSelect, MessageMultiSelectCheckbox, MessageMultiSelectCheckboxProps, MessageMultiSelectProps, MessageMultiSelectToolbar, MessageMultiSelectToolbarActions, MessageMultiSelectToolbarActionsProps, MessageMultiSelectToolbarProps } from "./message-multi-select.mjs";
-import { MessageTextSelectionAnchor, MessageTextSelectionToolbar, MessageTextSelectionToolbarButton, MessageTextSelectionToolbarButtonProps, MessageTextSelectionToolbarProps, MessageTextSelectionToolbarSeparator, MessageTextSelectionToolbarSeparatorProps, createMessageTextSelectionAnchor } from "./message-text-selection-toolbar.mjs";
-export { MessageItem, MessageItemAttachments, type MessageItemAttachmentsProps, MessageItemAvatarSlot, type MessageItemAvatarSlotProps, MessageItemBadge, type MessageItemBadgeProps, MessageItemBadgeSeparator, type MessageItemBadgeSeparatorProps, type MessageItemBadgeStatus, MessageItemBody, type MessageItemBodyProps, MessageItemContent, type MessageItemContentProps, MessageItemContinuationTime, type MessageItemContinuationTimeProps, MessageItemDelegatedAvatar, type MessageItemDelegatedAvatarProps, MessageItemDelegatedBy, MessageItemDelegatedByButton, type MessageItemDelegatedByButtonProps, MessageItemDelegatedByName, type MessageItemDelegatedByNameProps, type MessageItemDelegatedByProps, MessageItemEdited, type MessageItemEditedProps, MessageItemEmbedded, type MessageItemEmbeddedProps, MessageItemFooter, type MessageItemFooterProps, MessageItemGutter, type MessageItemGutterProps, MessageItemHeader, type MessageItemHeaderProps, MessageItemInlineStatus, type MessageItemInlineStatusProps, MessageItemMeta, type MessageItemMetaProps, type MessageItemProps, MessageItemReadReceipt, type MessageItemReadReceiptProps, MessageItemSavedIndicator, type MessageItemSavedIndicatorProps, MessageItemSearchMatch, type MessageItemSearchMatchProps, MessageItemSender, MessageItemSenderBadges, type MessageItemSenderBadgesProps, MessageItemSenderButton, type MessageItemSenderButtonProps, MessageItemSenderGroup, type MessageItemSenderGroupProps, type MessageItemSenderProps, MessageItemTime, type MessageItemTimeProps, MessageItemToolbar, MessageItemToolbarButton, type MessageItemToolbarButtonProps, type MessageItemToolbarProps, MessageMultiSelect, MessageMultiSelectCheckbox, type MessageMultiSelectCheckboxProps, type MessageMultiSelectProps, MessageMultiSelectToolbar, MessageMultiSelectToolbarActions, type MessageMultiSelectToolbarActionsProps, type MessageMultiSelectToolbarProps, MessageReactionAddButton, type MessageReactionAddButtonProps, MessageReactionChip, type MessageReactionChipProps, MessageReactionCount, type MessageReactionCountProps, MessageReactionErrorIndicator, type MessageReactionErrorIndicatorProps, MessageReactionGlyph, type MessageReactionGlyphProps, MessageReactionPickerContent, type MessageReactionPickerContentProps, MessageReactionPickerStatic, type MessageReactionPickerStaticProps, MessageReactionQuickButton, type MessageReactionQuickButtonProps, MessageReactionQuickRow, type MessageReactionQuickRowProps, MessageReactionTooltipContent, type MessageReactionTooltipContentProps, MessageReactionTooltipMeta, type MessageReactionTooltipMetaProps, MessageReactionTooltipName, type MessageReactionTooltipNameProps, MessageReactionTooltipNameText, type MessageReactionTooltipNameTextProps, MessageReactionTooltipNames, type MessageReactionTooltipNamesProps, MessageReactionTooltipSeparator, type MessageReactionTooltipSeparatorProps, MessageReferenceChip, type MessageReferenceChipProps, type MessageReferenceChipVariant, MessageReferenceIcon, type MessageReferenceIconProps, MessageReferenceIndicator, type MessageReferenceIndicatorProps, MessageReferenceLabel, type MessageReferenceLabelProps, MessageReferencePending, type MessageReferencePendingProps, MessageReferenceReadMark, type MessageReferenceReadMarkProps, MessageReferenceSuffix, type MessageReferenceSuffixProps, MessageReferenceText, type MessageReferenceTextProps, type MessageReferenceTextVariant, MessageReferenceUnavailable, type MessageReferenceUnavailableProps, type MessageTextSelectionAnchor, MessageTextSelectionToolbar, MessageTextSelectionToolbarButton, type MessageTextSelectionToolbarButtonProps, type MessageTextSelectionToolbarProps, MessageTextSelectionToolbarSeparator, type MessageTextSelectionToolbarSeparatorProps, createMessageTextSelectionAnchor };
+export { MessageItem, MessageItemAttachments, type MessageItemAttachmentsProps, MessageItemAvatarSlot, type MessageItemAvatarSlotProps, MessageItemBadge, type MessageItemBadgeProps, MessageItemBadgeSeparator, type MessageItemBadgeSeparatorProps, type MessageItemBadgeStatus, MessageItemBody, type MessageItemBodyProps, MessageItemContent, type MessageItemContentProps, MessageItemContinuationTime, type MessageItemContinuationTimeProps, MessageItemDelegatedAvatar, type MessageItemDelegatedAvatarProps, MessageItemDelegatedBy, MessageItemDelegatedByButton, type MessageItemDelegatedByButtonProps, MessageItemDelegatedByName, type MessageItemDelegatedByNameProps, type MessageItemDelegatedByProps, MessageItemEdited, type MessageItemEditedProps, MessageItemEmbedded, type MessageItemEmbeddedProps, MessageItemFooter, type MessageItemFooterProps, MessageItemGutter, type MessageItemGutterProps, MessageItemHeader, type MessageItemHeaderProps, MessageItemInlineStatus, type MessageItemInlineStatusProps, MessageItemMeta, type MessageItemMetaProps, type MessageItemProps, MessageItemReadReceipt, type MessageItemReadReceiptProps, MessageItemSavedIndicator, type MessageItemSavedIndicatorProps, MessageItemSearchMatch, type MessageItemSearchMatchProps, MessageItemSender, MessageItemSenderBadges, type MessageItemSenderBadgesProps, MessageItemSenderButton, type MessageItemSenderButtonProps, MessageItemSenderGroup, type MessageItemSenderGroupProps, type MessageItemSenderProps, MessageItemTime, type MessageItemTimeProps, MessageItemToolbar, MessageItemToolbarButton, type MessageItemToolbarButtonProps, type MessageItemToolbarProps, MessageMultiSelect, MessageMultiSelectCheckbox, type MessageMultiSelectCheckboxProps, type MessageMultiSelectProps, MessageMultiSelectToolbar, MessageMultiSelectToolbarActions, type MessageMultiSelectToolbarActionsProps, type MessageMultiSelectToolbarProps, MessageReactionAddButton, type MessageReactionAddButtonProps, MessageReactionChip, type MessageReactionChipProps, MessageReactionCount, type MessageReactionCountProps, MessageReactionErrorIndicator, type MessageReactionErrorIndicatorProps, MessageReactionGlyph, type MessageReactionGlyphProps, MessageReactionPickerContent, type MessageReactionPickerContentProps, MessageReactionPickerStatic, type MessageReactionPickerStaticProps, MessageReactionQuickButton, type MessageReactionQuickButtonProps, MessageReactionQuickRow, type MessageReactionQuickRowProps, MessageReactionTooltipContent, type MessageReactionTooltipContentProps, MessageReactionTooltipMeta, type MessageReactionTooltipMetaProps, MessageReactionTooltipName, type MessageReactionTooltipNameProps, MessageReactionTooltipNameText, type MessageReactionTooltipNameTextProps, MessageReactionTooltipNames, type MessageReactionTooltipNamesProps, MessageReactionTooltipSeparator, type MessageReactionTooltipSeparatorProps, MessageReferenceChip, type MessageReferenceChipProps, type MessageReferenceChipVariant, MessageReferenceIcon, type MessageReferenceIconProps, MessageReferenceIndicator, type MessageReferenceIndicatorProps, MessageReferenceLabel, type MessageReferenceLabelProps, MessageReferencePending, type MessageReferencePendingProps, MessageReferenceReadMark, type MessageReferenceReadMarkProps, MessageReferenceSuffix, type MessageReferenceSuffixProps, MessageReferenceText, type MessageReferenceTextProps, type MessageReferenceTextVariant, MessageReferenceUnavailable, type MessageReferenceUnavailableProps };

package/dist/components/message-item/message-reaction.mjs

@@ -1,5 +1,5 @@
-import { TooltipContent } from "../tooltip/tooltip.mjs";
 import { DropdownMenuContent } from "../dropdown-menu/dropdown-menu.mjs";
+import { TooltipContent } from "../tooltip/tooltip.mjs";
 import { messageReaction, reactionCountKeyframes, reactionCountTiming } from "./message-reaction.recipe.mjs";
 import { useEffect, useRef } from "react";
 import { jsx } from "react/jsx-runtime";

package/dist/components/meter/meter.d.mts

@@ -72,12 +72,6 @@ export type MeterProps = Omit<StyledProps<Meter.Root.Props>, "value" | "min" | "
    * @default 0.8
    */
   warnAt?: number;
-  /**
-   * @deprecated Use `warnAt`, the share used: `low={20}` of 100 is
-   * `warnAt={0.8}`. The amount left, in the units of `max`, at or below
-   * which the meter warns. Ignored when `warnAt` is set.
-   */
-  low?: number;
   /**
    * What is used, in words, with the word: "62% used · resets in 3h".
    * `MeterValue` shows it, and it is the meter's `aria-valuetext`, so the
@@ -91,7 +85,7 @@ export type MeterProps = Omit<StyledProps<Meter.Root.Props>, "value" | "min" | "
  * is used (80% unless set), then the warning color, and a full warning bar
  * when used up; never danger, and no success color.
  */
-declare function Meter$1({ size, used, max, warnAt, low, valueText, className, ...props }: MeterProps): import("react").JSX.Element;
+declare function Meter$1({ size, used, max, warnAt, valueText, className, ...props }: MeterProps): import("react").JSX.Element;
 export type MeterHeaderProps = ComponentPropsWithRef<"div">;
 export declare function MeterHeader({ className, ...props }: MeterHeaderProps): import("react").JSX.Element;
 export type MeterLabelProps = StyledProps<Meter.Label.Props>;

package/dist/components/meter/meter.mjs

@@ -47,10 +47,10 @@ function clamp(value, min, max) {
 * is used (80% unless set), then the warning color, and a full warning bar
 * when used up; never danger, and no success color.
 */
-function Meter$1({ size = "md", used, max = 100, warnAt, low, valueText, className, ...props }) {
+function Meter$1({ size = "md", used, max = 100, warnAt, valueText, className, ...props }) {
 	const value = clamp(used, 0, max);
 	const share = max > 0 ? value / max : 1;
-	const warnFrom = warnAt !== void 0 ? clamp(warnAt, 0, 1) : low !== void 0 && max > 0 ? 1 - clamp(low, 0, max) / max : .8;
+	const warnFrom = warnAt !== void 0 ? clamp(warnAt, 0, 1) : .8;
 	const level = share >= 1 ? "full" : share >= warnFrom ? "high" : "normal";
 	const { root } = meter({
 		size,

package/dist/components/notification-center/notification-center.mjs

@@ -2,8 +2,8 @@ import { headEdgePull } from "../../lib/head-edges.mjs";
 import { tv } from "../../lib/tv.mjs";
 import { useThemeScopeProps } from "../../lib/theme/theme-scope.mjs";
 import { Button } from "../button/button.mjs";
-import { usePopupCollision } from "../../lib/frame-insets.mjs";
 import { Status } from "../status/status.mjs";
+import { usePopupCollision } from "../../lib/frame-insets.mjs";
 import { EmptyState } from "../empty-state/empty-state.mjs";
 import { AlertTriangle, Bell, CheckCircle2, Info } from "lucide-react";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";

package/dist/components/pull-to-refresh/pull-to-refresh-indicator.mjs

@@ -26,7 +26,7 @@ const pullStepStyle = /* @__PURE__ */ jsx("style", {
 const SNAP_BACK = ["duration-300 ease-slide motion-reduce:transition-none", "data-[state=pulling]:transition-none"];
 const pullToRefreshIndicator = tv({
 	slots: {
-		root: ["flex w-full shrink-0 justify-center", "text-foreground-icon"],
+		root: ["flex w-full shrink-0 justify-center", "text-foreground-muted"],
 		surface: ["flex items-center justify-center"],
 		spinner: [
 			"transition-opacity duration-300 ease-slide motion-reduce:transition-none",

package/dist/components/sidebar/index.d.mts

@@ -1,5 +1,5 @@
-import { SidebarBody, SidebarBodyProps, SidebarContent, SidebarContentProps, SidebarGroupLabel, SidebarGroupLabelProps, SidebarHeader, SidebarHeaderProps, SidebarHeaderTitle, SidebarHeaderTitleProps, SidebarLiveActivity, SidebarLiveActivityProps, SidebarRoot, SidebarRootProps } from "./sidebar.mjs";
+import { SidebarBody, SidebarBodyProps, SidebarContent, SidebarContentProps, SidebarGroupLabel, SidebarGroupLabelProps, SidebarHeader, SidebarHeaderProps, SidebarHeaderTitle, SidebarHeaderTitleProps, SidebarRoot, SidebarRootProps } from "./sidebar.mjs";
 import { SidebarMenu, SidebarMenuAside, SidebarMenuAsideProps, SidebarMenuCount, SidebarMenuCountProps, SidebarMenuIcon, SidebarMenuIconProps, SidebarMenuProps, SidebarMenuTitle, SidebarMenuTitleProps } from "./sidebar-menu.mjs";
 import { SidebarItem, SidebarItemAside, SidebarItemAsideProps, SidebarItemChannelIcon, SidebarItemChannelIconProps, SidebarItemContent, SidebarItemContentProps, SidebarItemCount, SidebarItemCountProps, SidebarItemCountSeparator, SidebarItemCountSeparatorProps, SidebarItemIcon, SidebarItemIconProps, SidebarItemIndicator, SidebarItemIndicatorProps, SidebarItemMeta, SidebarItemMetaIcon, SidebarItemMetaIconProps, SidebarItemMetaProps, SidebarItemProps, SidebarItemStatus, SidebarItemStatusProps, SidebarItemSubtitle, SidebarItemSubtitleProps, SidebarItemThreadCount, SidebarItemThreadCountProps, SidebarItemTitle, SidebarItemTitleProps } from "./sidebar-item.mjs";
 import { SidebarControl, SidebarControlProps, SidebarList, SidebarListProps, SidebarSection, SidebarSectionAttention, SidebarSectionAttentionProps, SidebarSectionChevron, SidebarSectionChevronProps, SidebarSectionControl, SidebarSectionControlProps, SidebarSectionControls, SidebarSectionControlsProps, SidebarSectionCount, SidebarSectionCountProps, SidebarSectionDisclosure, SidebarSectionDisclosureProps, SidebarSectionEmpty, SidebarSectionEmptyProps, SidebarSectionHeader, SidebarSectionHeaderProps, SidebarSectionProps, SidebarSectionTitle, SidebarSectionTitleProps, SidebarSectionTrailing, SidebarSectionTrailingProps } from "./sidebar-section.mjs";
-export { SidebarBody, type SidebarBodyProps, SidebarContent, type SidebarContentProps, SidebarControl, type SidebarControlProps, SidebarGroupLabel, type SidebarGroupLabelProps, SidebarHeader, type SidebarHeaderProps, SidebarHeaderTitle, type SidebarHeaderTitleProps, SidebarItem, SidebarItemAside, type SidebarItemAsideProps, SidebarItemChannelIcon, type SidebarItemChannelIconProps, SidebarItemContent, type SidebarItemContentProps, SidebarItemCount, type SidebarItemCountProps, SidebarItemCountSeparator, type SidebarItemCountSeparatorProps, SidebarItemIcon, type SidebarItemIconProps, SidebarItemIndicator, type SidebarItemIndicatorProps, SidebarItemMeta, SidebarItemMetaIcon, type SidebarItemMetaIconProps, type SidebarItemMetaProps, type SidebarItemProps, SidebarItemStatus, type SidebarItemStatusProps, SidebarItemSubtitle, type SidebarItemSubtitleProps, SidebarItemThreadCount, type SidebarItemThreadCountProps, SidebarItemTitle, type SidebarItemTitleProps, SidebarList, type SidebarListProps, SidebarLiveActivity, type SidebarLiveActivityProps, SidebarMenu, SidebarMenuAside, type SidebarMenuAsideProps, SidebarMenuCount, type SidebarMenuCountProps, SidebarMenuIcon, type SidebarMenuIconProps, type SidebarMenuProps, SidebarMenuTitle, type SidebarMenuTitleProps, SidebarRoot, type SidebarRootProps, SidebarSection, SidebarSectionAttention, type SidebarSectionAttentionProps, SidebarSectionChevron, type SidebarSectionChevronProps, SidebarSectionControl, type SidebarSectionControlProps, SidebarSectionControls, type SidebarSectionControlsProps, SidebarSectionCount, type SidebarSectionCountProps, SidebarSectionDisclosure, type SidebarSectionDisclosureProps, SidebarSectionEmpty, type SidebarSectionEmptyProps, SidebarSectionHeader, type SidebarSectionHeaderProps, type SidebarSectionProps, SidebarSectionTitle, type SidebarSectionTitleProps, SidebarSectionTrailing, type SidebarSectionTrailingProps };
+export { SidebarBody, type SidebarBodyProps, SidebarContent, type SidebarContentProps, SidebarControl, type SidebarControlProps, SidebarGroupLabel, type SidebarGroupLabelProps, SidebarHeader, type SidebarHeaderProps, SidebarHeaderTitle, type SidebarHeaderTitleProps, SidebarItem, SidebarItemAside, type SidebarItemAsideProps, SidebarItemChannelIcon, type SidebarItemChannelIconProps, SidebarItemContent, type SidebarItemContentProps, SidebarItemCount, type SidebarItemCountProps, SidebarItemCountSeparator, type SidebarItemCountSeparatorProps, SidebarItemIcon, type SidebarItemIconProps, SidebarItemIndicator, type SidebarItemIndicatorProps, SidebarItemMeta, SidebarItemMetaIcon, type SidebarItemMetaIconProps, type SidebarItemMetaProps, type SidebarItemProps, SidebarItemStatus, type SidebarItemStatusProps, SidebarItemSubtitle, type SidebarItemSubtitleProps, SidebarItemThreadCount, type SidebarItemThreadCountProps, SidebarItemTitle, type SidebarItemTitleProps, SidebarList, type SidebarListProps, SidebarMenu, SidebarMenuAside, type SidebarMenuAsideProps, SidebarMenuCount, type SidebarMenuCountProps, SidebarMenuIcon, type SidebarMenuIconProps, type SidebarMenuProps, SidebarMenuTitle, type SidebarMenuTitleProps, SidebarRoot, type SidebarRootProps, SidebarSection, SidebarSectionAttention, type SidebarSectionAttentionProps, SidebarSectionChevron, type SidebarSectionChevronProps, SidebarSectionControl, type SidebarSectionControlProps, SidebarSectionControls, type SidebarSectionControlsProps, SidebarSectionCount, type SidebarSectionCountProps, SidebarSectionDisclosure, type SidebarSectionDisclosureProps, SidebarSectionEmpty, type SidebarSectionEmptyProps, SidebarSectionHeader, type SidebarSectionHeaderProps, type SidebarSectionProps, SidebarSectionTitle, type SidebarSectionTitleProps, SidebarSectionTrailing, type SidebarSectionTrailingProps };

package/dist/components/sidebar/sidebar-section.recipe.mjs

@@ -26,23 +26,9 @@ const sidebarSectionRecipe = tv({ slots: {
 	],
 	sidebarSectionTitle: ["min-w-0 truncate"],
 	sidebarSectionCount: ["font-mono text-mono-meta font-normal tabular-nums text-foreground-hint"],
-	sidebarSectionAttention: [
-		"inline-flex min-w-4.5 shrink-0 items-center justify-center",
-		"pointer-fine:absolute pointer-fine:top-1/2 pointer-fine:right-0 pointer-fine:-translate-y-1/2",
-		"group-data-open/section:hidden",
-		"group-data-popup-open/section-header:hidden",
-		"group-hover/section-header:hidden"
-	],
+	sidebarSectionAttention: ["inline-flex min-w-4.5 shrink-0 items-center justify-center", "group-data-open/section:hidden"],
 	sidebarSectionTrailing: ["relative flex min-w-4.5 shrink-0 items-center justify-end"],
-	sidebarSectionControls: [
-		"flex shrink-0 items-center gap-1 not-pointer-fine:gap-5",
-		"pointer-events-none opacity-0",
-		"not-pointer-fine:pointer-events-auto not-pointer-fine:opacity-100",
-		"pointer-fine:group-hover/section-header:pointer-events-auto pointer-fine:group-hover/section-header:opacity-100",
-		"pointer-fine:focus-within:pointer-events-auto pointer-fine:focus-within:opacity-100",
-		"pointer-fine:has-data-popup-open:pointer-events-auto pointer-fine:has-data-popup-open:opacity-100",
-		"[&>[data-icon-inset]:last-child]:-mr-icon-inset"
-	],
+	sidebarSectionControls: ["flex shrink-0 items-center gap-1", "[&>[data-icon-inset]:nth-last-child(1_of_:not([data-base-ui-focus-guard],[aria-owns]))]:-mr-icon-inset"],
 	sidebarSectionControl: [
 		"relative flex h-6 w-auto min-w-6 shrink-0 items-center justify-center p-0 -my-1",
 		"[&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-3.5",
@@ -50,7 +36,8 @@ const sidebarSectionRecipe = tv({ slots: {
 		"text-foreground-hint",
 		"hover:text-foreground active:text-foreground focus-visible:text-foreground",
 		"data-popup-open:bg-fill-medium data-popup-open:text-foreground",
-		"not-pointer-fine:after:absolute not-pointer-fine:after:inset-[-11px] not-pointer-fine:after:content-['']"
+		"not-pointer-fine:after:absolute not-pointer-fine:after:inset-[-11px] not-pointer-fine:after:content-['']",
+		"not-pointer-fine:not-first:after:left-[-3px] not-pointer-fine:not-last:after:right-[-3px]"
 	]
 } });
 //#endregion

package/dist/components/sidebar/sidebar.d.mts

@@ -12,6 +12,4 @@ export type SidebarBodyProps = useRender.ComponentProps<"div">;
 export declare function SidebarBody({ className, render, ...props }: SidebarBodyProps): import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>>;
 export type SidebarContentProps = useRender.ComponentProps<"div">;
 export declare function SidebarContent({ children, className, render, ...props }: SidebarContentProps): import("react").JSX.Element;
-export type SidebarLiveActivityProps = useRender.ComponentProps<"div">;
-export declare function SidebarLiveActivity({ children, className, render, ...props }: SidebarLiveActivityProps): import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>>;
 //#endregion

package/dist/components/sidebar/sidebar.mjs

@@ -132,18 +132,5 @@ function SidebarContent({ children, className, render, ...props }) {
 		})]
 	});
 }
-function SidebarLiveActivity({ children, className, render, ...props }) {
-	const { sidebarLiveActivity } = sidebarRecipe();
-	const defaultProps = {
-		"data-slot": "sidebar-live-activity",
-		className: sidebarLiveActivity({ className }),
-		children
-	};
-	return useRender({
-		defaultTagName: "div",
-		render,
-		props: mergeProps(defaultProps, props)
-	});
-}
 //#endregion
-export { SidebarBody, SidebarContent, SidebarGroupLabel, SidebarHeader, SidebarHeaderTitle, SidebarLiveActivity, SidebarRoot };
+export { SidebarBody, SidebarContent, SidebarGroupLabel, SidebarHeader, SidebarHeaderTitle, SidebarRoot };

package/dist/components/sidebar/sidebar.recipe.mjs

@@ -5,10 +5,8 @@ const sidebarRecipe = tv({ slots: {
 	sidebarRoot: [
 		"relative flex size-full min-h-0  select-none flex-col",
 		listColumnMargin,
-		"has-[>[data-slot=sidebar-live-activity]_[data-slot=live-agent-activity-bar]]:overflow-clip",
 		"bg-layer-sidebar text-foreground max-md:bg-layer-canvas",
-		"border-line-seam md:border-r",
-		"md:has-[>[data-slot=sidebar-live-activity]_[data-slot=live-agent-activity-bar]]:[--sidebar-content-bottom:52px]"
+		"border-line-seam md:border-r"
 	],
 	sidebarHeader: [
 		"flex items-center",
@@ -30,8 +28,7 @@ const sidebarRecipe = tv({ slots: {
 		"z-30 flex w-3 justify-center py-1 opacity-0 transition-opacity duration-150",
 		"pointer-events-none",
 		"data-scrolling:pointer-events-auto data-scrolling:opacity-100 data-scrolling:duration-0"
-	],
-	sidebarLiveActivity: ["pointer-events-none absolute inset-x-0 max-md:hidden", "bottom-0 z-40"]
+	]
 } });
 //#endregion
 export { sidebarRecipe };

package/dist/components/status/status.mjs

@@ -15,7 +15,7 @@ const status = tv({
 			default: { root: "[--status-color:var(--presence-offline)]" },
 			primary: { root: "[--status-color:var(--presence-busy)]" },
 			information: { root: "[--status-color:var(--info)]" },
-			muted: { root: "[--status-color:var(--secondary-400)]" },
+			muted: { root: "[--status-color:var(--palette-stone-400)]" },
 			accent: { root: "[--status-color:var(--attention-400)]" },
 			success: { root: "[--status-color:var(--success)]" },
 			warning: { root: "[--status-color:var(--warning)]" },

package/dist/foundation.css

@@ -592,180 +592,6 @@
   --foreground-hover: var(--foreground);
   --line-field: var(--line-strong);
   --line-field-hover: var(--line-strong);
-
-  /* Deprecated names, kept until raft-ui 1.0. Run
-     `node node_modules/@botiverse/raft-ui/codemods/token-names.mjs <src>` to move to the
-     current names. */
-  --fill-pressed: var(--fill-medium);
-  --fill-frame-pressed: var(--fill-frame-medium);
-  --fill-row-hover: var(--fill-subtle);
-  --fill-row-open: var(--fill-subtle);
-  --fill-message-hover: var(--fill-subtle);
-  --sticker-pressed: var(--sticker-medium);
-  --layer-panel: var(--layer-canvas);
-  --layer-inset: var(--fill-muted);
-  --layer-canvas-muted: var(--layer-sidebar);
-  --layer-hud-foreground: var(--foreground-on-hud);
-  --foreground-strong: var(--foreground);
-  --foreground-icon: var(--foreground-muted);
-  --foreground-placeholder: var(--foreground-hint);
-  --line: var(--line-seam);
-  --line-muted: var(--line-hairline);
-  --primary-50: var(--brand-50);
-  --primary-100: var(--brand-100);
-  --primary-200: var(--brand-200);
-  --primary-300: var(--brand-300);
-  --primary-400: var(--brand-400);
-  --primary-500: var(--brand-500);
-  --primary-600: var(--brand-600);
-  --primary-700: var(--brand-700);
-  --primary-800: var(--brand-800);
-  --primary-900: var(--brand-900);
-  --primary-950: var(--brand-950);
-  --primary-strong: var(--brand-strong);
-  --primary-soft: var(--brand-soft);
-  --primary-edge: var(--brand-edge);
-  --primary-glow: var(--brand-glow);
-  --primary-hover: var(--brand-hover);
-  --primary-active: var(--brand-active);
-  --accent-50: var(--attention-50);
-  --accent-100: var(--attention-100);
-  --accent-200: var(--attention-200);
-  --accent-300: var(--attention-300);
-  --accent-400: var(--attention-400);
-  --accent-500: var(--attention-500);
-  --accent-600: var(--attention-600);
-  --accent-700: var(--attention-700);
-  --accent-800: var(--attention-800);
-  --accent-900: var(--attention-900);
-  --accent-950: var(--attention-950);
-  --accent-strong: var(--attention-strong);
-  --accent-soft: var(--attention-soft);
-  --accent-hover: var(--attention-hover);
-  --accent-active: var(--attention-active);
-  --theme-shadow-xs: 0 0 #0000;
-  --theme-shadow-sm: 0 0 #0000;
-  --theme-shadow-md: 0 0 #0000;
-  --theme-shadow-lg: var(--elevation-float);
-  --theme-shadow-xl: var(--elevation-float);
-  --theme-shadow-float: var(--elevation-float);
-  --theme-shadow-sticker: var(--elevation-sticker);
-  --theme-focus-ring: var(--focus-ring);
-}
-
-/* Deprecated palette names (the `brutal` theme family no longer exists) and the
-   `secondary` ramp, kept until raft-ui 1.0. */
-:where(:root) {
-  --color-brutal-yellow-50: var(--palette-yellow-50);
-  --color-brutal-yellow-100: var(--palette-yellow-100);
-  --color-brutal-yellow-200: var(--palette-yellow-200);
-  --color-brutal-yellow-300: var(--palette-yellow-300);
-  --color-brutal-yellow-400: var(--palette-yellow-400);
-  --color-brutal-yellow-500: var(--palette-yellow-500);
-  --color-brutal-yellow-600: var(--palette-yellow-600);
-  --color-brutal-yellow-700: var(--palette-yellow-700);
-  --color-brutal-yellow-800: var(--palette-yellow-800);
-  --color-brutal-yellow-900: var(--palette-yellow-900);
-  --color-brutal-yellow-950: var(--palette-yellow-950);
-  --color-brutal-purple-50: var(--palette-lavender-50);
-  --color-brutal-purple-100: var(--palette-lavender-100);
-  --color-brutal-purple-200: var(--palette-lavender-200);
-  --color-brutal-purple-300: var(--palette-lavender-300);
-  --color-brutal-purple-400: var(--palette-lavender-400);
-  --color-brutal-purple-500: var(--palette-lavender-500);
-  --color-brutal-purple-600: var(--palette-lavender-600);
-  --color-brutal-purple-700: var(--palette-lavender-700);
-  --color-brutal-purple-800: var(--palette-lavender-800);
-  --color-brutal-purple-900: var(--palette-lavender-900);
-  --color-brutal-purple-950: var(--palette-lavender-950);
-  --color-brutal-pink-50: var(--palette-pink-50);
-  --color-brutal-pink-100: var(--palette-pink-100);
-  --color-brutal-pink-200: var(--palette-pink-200);
-  --color-brutal-pink-300: var(--palette-pink-300);
-  --color-brutal-pink-400: var(--palette-pink-400);
-  --color-brutal-pink-500: var(--palette-pink-500);
-  --color-brutal-pink-600: var(--palette-pink-600);
-  --color-brutal-pink-700: var(--palette-pink-700);
-  --color-brutal-pink-800: var(--palette-pink-800);
-  --color-brutal-pink-900: var(--palette-pink-900);
-  --color-brutal-pink-950: var(--palette-pink-950);
-  --color-brutal-cyan-50: var(--palette-cyan-50);
-  --color-brutal-cyan-100: var(--palette-cyan-100);
-  --color-brutal-cyan-200: var(--palette-cyan-200);
-  --color-brutal-cyan-300: var(--palette-cyan-300);
-  --color-brutal-cyan-400: var(--palette-cyan-400);
-  --color-brutal-cyan-500: var(--palette-cyan-500);
-  --color-brutal-cyan-600: var(--palette-cyan-600);
-  --color-brutal-cyan-700: var(--palette-cyan-700);
-  --color-brutal-cyan-800: var(--palette-cyan-800);
-  --color-brutal-cyan-900: var(--palette-cyan-900);
-  --color-brutal-cyan-950: var(--palette-cyan-950);
-  --color-brutal-orange-50: var(--palette-orange-50);
-  --color-brutal-orange-100: var(--palette-orange-100);
-  --color-brutal-orange-200: var(--palette-orange-200);
-  --color-brutal-orange-300: var(--palette-orange-300);
-  --color-brutal-orange-400: var(--palette-orange-400);
-  --color-brutal-orange-500: var(--palette-orange-500);
-  --color-brutal-orange-600: var(--palette-orange-600);
-  --color-brutal-orange-700: var(--palette-orange-700);
-  --color-brutal-orange-800: var(--palette-orange-800);
-  --color-brutal-orange-900: var(--palette-orange-900);
-  --color-brutal-orange-950: var(--palette-orange-950);
-  --color-brutal-lime-50: var(--palette-lime-50);
-  --color-brutal-lime-100: var(--palette-lime-100);
-  --color-brutal-lime-200: var(--palette-lime-200);
-  --color-brutal-lime-300: var(--palette-lime-300);
-  --color-brutal-lime-400: var(--palette-lime-400);
-  --color-brutal-lime-500: var(--palette-lime-500);
-  --color-brutal-lime-600: var(--palette-lime-600);
-  --color-brutal-lime-700: var(--palette-lime-700);
-  --color-brutal-lime-800: var(--palette-lime-800);
-  --color-brutal-lime-900: var(--palette-lime-900);
-  --color-brutal-lime-950: var(--palette-lime-950);
-  --color-brutal-red-50: var(--palette-red-50);
-  --color-brutal-red-100: var(--palette-red-100);
-  --color-brutal-red-200: var(--palette-red-200);
-  --color-brutal-red-300: var(--palette-red-300);
-  --color-brutal-red-400: var(--palette-red-400);
-  --color-brutal-red-500: var(--palette-red-500);
-  --color-brutal-red-600: var(--palette-red-600);
-  --color-brutal-red-700: var(--palette-red-700);
-  --color-brutal-red-800: var(--palette-red-800);
-  --color-brutal-red-900: var(--palette-red-900);
-  --color-brutal-red-950: var(--palette-red-950);
-  --color-brutal-stone-50: var(--palette-stone-50);
-  --color-brutal-stone-100: var(--palette-stone-100);
-  --color-brutal-stone-200: var(--palette-stone-200);
-  --color-brutal-stone-300: var(--palette-stone-300);
-  --color-brutal-stone-400: var(--palette-stone-400);
-  --color-brutal-stone-500: var(--palette-stone-500);
-  --color-brutal-stone-600: var(--palette-stone-600);
-  --color-brutal-stone-700: var(--palette-stone-700);
-  --color-brutal-stone-800: var(--palette-stone-800);
-  --color-brutal-stone-900: var(--palette-stone-900);
-  --color-brutal-stone-950: var(--palette-stone-950);
-  --color-brutal-cream-50: var(--palette-cream-50);
-  --color-brutal-cream-100: var(--palette-cream-100);
-  --color-brutal-cream-200: var(--palette-cream-200);
-  --color-brutal-cream-300: var(--palette-cream-300);
-  --color-brutal-cream-400: var(--palette-cream-400);
-  --color-brutal-cream-500: var(--palette-cream-500);
-  --color-brutal-cream-600: var(--palette-cream-600);
-  --color-brutal-cream-700: var(--palette-cream-700);
-  --color-brutal-cream-800: var(--palette-cream-800);
-  --color-brutal-cream-900: var(--palette-cream-900);
-  --color-brutal-cream-950: var(--palette-cream-950);
-  --secondary-50: var(--palette-stone-50);
-  --secondary-100: var(--palette-stone-100);
-  --secondary-200: var(--palette-stone-200);
-  --secondary-300: var(--palette-stone-300);
-  --secondary-400: var(--palette-stone-400);
-  --secondary-500: var(--palette-stone-500);
-  --secondary-600: var(--palette-stone-600);
-  --secondary-700: var(--palette-stone-700);
-  --secondary-800: var(--palette-stone-800);
-  --secondary-900: var(--palette-stone-900);
-  --secondary-950: var(--palette-stone-950);
 }
 
 /* Desktop: from 768px (Tailwind's `md`, where the desktop layout begins)