cursedbelt 5.46.2 → 5.47.0

package/src/react/file-tree/useFolderView.ts

@@ -17,6 +17,13 @@
  *     announced — *"Hiding or showing by tag can be stored per machine, so viewing the 'home'
  *     tag at home doesn't change my work computer."*
  *
+ * An app that already keeps its own settings record hands the marks over instead — `store` — and
+ * then nothing goes to `localStorage` or the bus: desk carries them in its global settings blob
+ * beside the rest of its synced state, and vault seals them inside the vault, because its folder
+ * ids are folder NAMES and must never reach a disk in plaintext. `device: 'memory'` keeps the
+ * device half in page memory for the same reason; with it, "Hide on this device" is not offered,
+ * since a device list forgotten on reload would be a hide that silently undoes itself.
+ *
  * And because the tree's header belongs to the APP (collections' `FilterRail` section, desk's
  * explorer bar), the view menu has to be openable from outside the tree: the hook holds which
  * menu is open, and the tree draws it. `onContextMenu` is the one handler an app puts on its
@@ -27,6 +34,8 @@ import { useRememberedPreference } from '../media-gallery/rememberedPreference.j
 import {
   type FolderMarks,
   type FolderViewLocal,
+  type HiddenScope,
+  hiddenScope,
   normalizeTag,
   parseFolderMarks,
   parseFolderViewLocal,
@@ -50,14 +59,23 @@ export type FolderViewPanel =
   | { kind: 'view'; at: FolderViewPoint }
   | { kind: 'tags'; at: FolderViewPoint | null; ids: readonly string[] };
 
+/** Which list a hide writes to, or an unhide takes from. */
+export type HideScope = 'everywhere' | 'device';
+
 export interface FolderView {
   marks: FolderMarks;
   local: FolderViewLocal;
   /** Every tag in use, most-used first. */
   tags: readonly TagCount[];
+  /** Whether "Hide on this device" is offered — false when the device half is not kept. */
+  deviceHiding: boolean;
+  /** Which of the two lists hide this folder, if any. */
+  hiddenIn: (id: string) => HiddenScope | null;
 
-  hide: (ids: readonly string[]) => void;
-  unhide: (ids: readonly string[]) => void;
+  /** Hide these folders — everywhere unless `scope: 'device'`. */
+  hide: (ids: readonly string[], options?: { scope?: HideScope }) => void;
+  /** Unhide these folders from the one list named, or from both when none is. */
+  unhide: (ids: readonly string[], options?: { scope?: HideScope }) => void;
   /** Add or take away one tag on each folder named. */
   toggleTag: (ids: readonly string[], tag: string) => void;
   /** Replace one folder's tags. */
@@ -88,11 +106,39 @@ export interface UseFolderViewOptions {
    * origin must not hide each other's folders.
    */
   key: string;
+  /**
+   * The app keeps the marks itself — its own synced settings, or a sealed record. `marks` is
+   * what it holds now (`null` for none) and `write` is called with the next value to keep.
+   * Given a store, the marks never touch `localStorage` or the preference bus.
+   */
+  store?: FolderMarksStore;
+  /**
+   * Where this device's view (show hidden, the tag filter, the device-only hidden list) lives:
+   * `'local'` (the default) is `localStorage` under `${key}:device`, never announced;
+   * `'memory'` is this page only, for an app whose folder ids may not be written to disk.
+   */
+  device?: 'local' | 'memory';
 }
 
-export function useFolderView({ key }: UseFolderViewOptions): FolderView {
-  const [rawMarks, writeMarks] = useRememberedPreference(key);
-  const [rawLocal, writeLocal] = useRememberedPreference(`${key}:device`, { announce: false });
+/** The marks, kept by the app — see {@link UseFolderViewOptions.store}. */
+export interface FolderMarksStore {
+  /** The stored form (`serializeFolderMarks`), or `null` for no marks. */
+  marks: string | null;
+  write: (next: string | null) => void;
+}
+
+export function useFolderView({ key, store, device = 'local' }: UseFolderViewOptions): FolderView {
+  // Hooks run unconditionally; an undefined key is the remembered preference that keeps nothing.
+  const [rememberedMarks, rememberMarks] = useRememberedPreference(store ? undefined : key);
+  const [rememberedLocal, rememberLocal] = useRememberedPreference(
+    device === 'local' ? `${key}:device` : undefined,
+    { announce: false },
+  );
+  const [memoryLocal, setMemoryLocal] = useState<string | null>(null);
+  const rawMarks = store ? store.marks : rememberedMarks;
+  const writeMarks = store ? store.write : rememberMarks;
+  const rawLocal = device === 'local' ? rememberedLocal : memoryLocal;
+  const writeLocal = device === 'local' ? rememberLocal : setMemoryLocal;
   const marks = useMemo(() => parseFolderMarks(rawMarks), [rawMarks]);
   const local = useMemo(() => parseFolderViewLocal(rawLocal), [rawLocal]);
   const tags = useMemo(() => tagCounts(marks), [marks]);
@@ -114,13 +160,20 @@ export function useFolderView({ key }: UseFolderViewOptions): FolderView {
     },
     [writeMarks],
   );
+  // The same rule for this device's view: an Undo of "Hide on this device" must see the hide.
+  const latestLocal = useRef(local);
+  latestLocal.current = local;
   const saveLocal = useCallback(
     (next: FolderViewLocal) => {
-      const empty = !next.showHidden && next.only.length === 0 && next.hide.length === 0;
+      if (next === latestLocal.current) return;
+      latestLocal.current = next;
+      const empty =
+        !next.showHidden && next.only.length === 0 && next.hide.length === 0 && next.hidden.length === 0;
       writeLocal(empty ? null : JSON.stringify(next));
     },
     [writeLocal],
   );
+  const deviceHiding = device === 'local';
 
   const onContextMenu = useCallback((event: { clientX: number; clientY: number; preventDefault: () => void }) => {
     event.preventDefault();
@@ -132,8 +185,16 @@ export function useFolderView({ key }: UseFolderViewOptions): FolderView {
       marks,
       local,
       tags,
-      hide: (ids) => saveMarks(setHidden(latest.current, ids, true)),
-      unhide: (ids) => saveMarks(setHidden(latest.current, ids, false)),
+      deviceHiding,
+      hiddenIn: (id) => hiddenScope(marks, local, id),
+      hide: (ids, options) => {
+        if (options?.scope === 'device' && deviceHiding) saveLocal(setHidden(latestLocal.current, ids, true));
+        else saveMarks(setHidden(latest.current, ids, true));
+      },
+      unhide: (ids, options) => {
+        if (options?.scope !== 'device') saveMarks(setHidden(latest.current, ids, false));
+        if (options?.scope !== 'everywhere') saveLocal(setHidden(latestLocal.current, ids, false));
+      },
       toggleTag: (ids, raw) => {
         const tag = normalizeTag(raw);
         if (!tag || ids.length === 0) return;
@@ -148,15 +209,15 @@ export function useFolderView({ key }: UseFolderViewOptions): FolderView {
         saveMarks(next);
       },
       setTags: (id, list) => saveMarks(setFolderTags(latest.current, id, list)),
-      setShowHidden: (show) => saveLocal({ ...local, showHidden: show }),
-      filterTag: (tag, mode) => saveLocal(setTagFilter(local, tag, mode)),
-      clearTagFilter: () => saveLocal({ ...local, only: [], hide: [] }),
+      setShowHidden: (show) => saveLocal({ ...latestLocal.current, showHidden: show }),
+      filterTag: (tag, mode) => saveLocal(setTagFilter(latestLocal.current, tag, mode)),
+      clearTagFilter: () => saveLocal({ ...latestLocal.current, only: [], hide: [] }),
       panel,
       openViewMenu: (at) => setPanel({ kind: 'view', at }),
       openTagEditor: (ids, at) => setPanel({ kind: 'tags', at: at ?? null, ids }),
       closePanel: () => setPanel(null),
       onContextMenu,
     }),
-    [marks, local, tags, panel, saveMarks, saveLocal, onContextMenu],
+    [marks, local, tags, deviceHiding, panel, saveMarks, saveLocal, onContextMenu],
   );
 }

package/src/styles-areas/analytics.css

@@ -18,35 +18,36 @@
  * after an app's responsive variant (task 2124). An app that imports every area gets exactly
  * what `cursedbelt/styles-utilities.css` emits — proved rule by rule in
  * src/stylesAreas.spec.ts, which is also what fails when this file is stale.
- * 148 candidate(s).
+ * 154 candidate(s).
  *
  * Written by scripts/generateAreaStyles.ts (`bun run styles:areas`), which
  * `bun run build` runs. The map of what is in which area, and why the areas are
  * import closures rather than a hand-written list, is scripts/styleAreas.ts.
  */
-@source inline("-m-1 -mt-2 -mt-6 -mx-1 -my-2.5 -my-3 @3xl:block @3xl:hidden @max-2xl:[&>*]:hidden");
-@source inline("@max-2xl:border-0 @max-2xl:min-w-0! @max-2xl:p-0! @max-2xl:w-0! @max-4xl:[&>*]:hidden");
+@source inline("-m-1 -mt-2 -mt-6 -mx-1 -my-2.5 -my-3 @3xl:block @3xl:hidden @max-2xl @max-2xl:[&>*]:hidden");
+@source inline("@max-2xl:border-0 @max-2xl:inline-flex @max-2xl:justify-center @max-2xl:min-w-0!");
+@source inline("@max-2xl:min-w-11 @max-2xl:p-0! @max-2xl:sr-only @max-2xl:w-0! @max-4xl:[&>*]:hidden");
 @source inline("@max-4xl:border-0 @max-4xl:min-w-0! @max-4xl:p-0! @max-4xl:w-0! @max-6xl:[&>*]:hidden");
 @source inline("@max-6xl:border-0 @max-6xl:min-w-0! @max-6xl:p-0! @max-6xl:w-0! @xl:block @xl:hidden");
-@source inline("[&>*]:hidden [&>*]:max-w-none [&_svg]:size-3 [overflow-wrap:anywhere] active:cursor-grabbing");
-@source inline("appearance appearance-none bg-[var(--cb-frozen-bg)] bg-card/95 bg-gradient-to-t bg-muted/30");
-@source inline("bg-muted/40 bg-muted/50 border-accent-solid border-accent/60 border-field-error border-l");
-@source inline("border-r col collapse cursor-grab data-[ending-style]:opacity-0 data-[ending-style]:scale-95");
-@source inline("data-[highlighted]:bg-accent/10 data-[highlighted]:text-accent-strong");
-@source inline("data-[starting-style]:opacity-0 data-[starting-style]:scale-95");
-@source inline("data-[state=closed]:slide-out-to-bottom data-[state=closed]:slide-out-to-left");
-@source inline("data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-bottom");
-@source inline("data-[state=open]:slide-in-from-left data-[state=open]:slide-in-from-right disabled:opacity-40");
-@source inline("duration-100 fade-in focus-visible:ring-field-ring/40 focus-within:border-field-ring");
-@source inline("focus-within:ring-2 focus-within:ring-field-ring/30 from-card h-105");
-@source inline("has-[[aria-invalid=true]]:border-field-error hover:bg-background hover:bg-border");
-@source inline("hover:bg-muted/40 hover:border-field-ring hover:text-warning italic justify-self-end");
-@source inline("last:border-0 left-0 left-11 left-2.5 list-none max-h-64 max-h-88 max-h-[var(--sheet-h-lg)]");
-@source inline("max-h-[var(--sheet-h-md)] max-h-[var(--sheet-h-sm)] max-w-32 max-w-36 max-w-45 max-w-48 max-w-60");
-@source inline("max-w-sm min-h-20 min-h-dvh min-w-0! min-w-20 min-w-24 min-w-52 min-w-[var(--anchor-width)]");
-@source inline("min-w-max ml-1.5 mr-2 mt-1.5 mt-3 mt-4 not-italic ordinal p-0! pb-1.5 pl-1.5 pl-2 pr-0.5 pr-1");
-@source inline("pr-10 pr-16 pr-3 pr-9 pt-1 resize-none resize-y right-3 ring-field-error/30 rounded-l-xl");
-@source inline("rounded-r-xl rounded-t-xl self self-center self-stretch shadow-[1px_0_0_0_var(--color-border)]");
-@source inline("shrink-[2] size-2 size-7 slide-in-from-top-1 table-fixed text-accent-solid-foreground");
-@source inline("text-field-placeholder text-muted-foreground/60 text-success text-xl to-transparent top-3");
-@source inline("transition-[transform,opacity] w-0! w-11 w-20 w-32 w-36 w-40 w-88");
+@source inline("[&>*]:hidden [&>*]:max-w-none [&>svg]:size-3.5 [&_svg]:size-3 [overflow-wrap:anywhere]");
+@source inline("active:cursor-grabbing appearance appearance-none bg-[var(--cb-frozen-bg)] bg-card/95");
+@source inline("bg-gradient-to-t bg-muted/30 bg-muted/40 bg-muted/50 border-accent-solid border-accent/60");
+@source inline("border-field-error border-l border-r col collapse cursor-grab data-[ending-style]:opacity-0");
+@source inline("data-[ending-style]:scale-95 data-[highlighted]:bg-accent/10");
+@source inline("data-[highlighted]:text-accent-strong data-[starting-style]:opacity-0");
+@source inline("data-[starting-style]:scale-95 data-[state=closed]:slide-out-to-bottom");
+@source inline("data-[state=closed]:slide-out-to-left data-[state=closed]:slide-out-to-right");
+@source inline("data-[state=open]:slide-in-from-bottom data-[state=open]:slide-in-from-left");
+@source inline("data-[state=open]:slide-in-from-right disabled:opacity-40 duration-100 fade-in");
+@source inline("focus-visible:ring-field-ring/40 focus-within:border-field-ring focus-within:ring-2");
+@source inline("focus-within:ring-field-ring/30 from-card h-105 has-[[aria-invalid=true]]:border-field-error");
+@source inline("hover:bg-background hover:bg-border hover:bg-muted/40 hover:border-field-ring hover:text-warning");
+@source inline("italic justify-self-end last:border-0 left-0 left-11 left-2.5 list-none max-h-64 max-h-88");
+@source inline("max-h-[var(--sheet-h-lg)] max-h-[var(--sheet-h-md)] max-h-[var(--sheet-h-sm)] max-w-32 max-w-36");
+@source inline("max-w-45 max-w-48 max-w-60 max-w-sm min-h-20 min-h-dvh min-w-0! min-w-20 min-w-24 min-w-52");
+@source inline("min-w-[var(--anchor-width)] min-w-max ml-1.5 mr-2 mt-1.5 mt-3 mt-4 not-italic ordinal p-0!");
+@source inline("pb-1.5 pl-1.5 pl-2 pr-0.5 pr-1 pr-10 pr-16 pr-3 pr-9 pt-1 resize-none resize-y right-3");
+@source inline("ring-field-error/30 rounded-l-xl rounded-r-xl rounded-t-xl self self-center self-stretch");
+@source inline("shadow-[1px_0_0_0_var(--color-border)] shrink-[2] size-2 size-7 slide-in-from-top-1 table-fixed");
+@source inline("text-accent-solid-foreground text-field-placeholder text-muted-foreground/60 text-success");
+@source inline("text-xl to-transparent top-3 transition-[transform,opacity] w-0! w-11 w-20 w-32 w-36 w-40 w-88");

package/src/styles-areas/calendar.css

@@ -18,7 +18,7 @@
  * after an app's responsive variant (task 2124). An app that imports every area gets exactly
  * what `cursedbelt/styles-utilities.css` emits — proved rule by rule in
  * src/stylesAreas.spec.ts, which is also what fails when this file is stale.
- * 79 candidate(s).
+ * 78 candidate(s).
  *
  * Written by scripts/generateAreaStyles.ts (`bun run styles:areas`), which
  * `bun run build` runs. The map of what is in which area, and why the areas are
@@ -32,9 +32,9 @@
 @source inline("dark:bg-sky-900/40 dark:bg-slate-800 dark:bg-teal-900/40 dark:bg-violet-900/40");
 @source inline("dark:text-amber-200 dark:text-blue-200 dark:text-emerald-200 dark:text-green-200");
 @source inline("dark:text-purple-200 dark:text-rose-200 dark:text-sky-200 dark:text-slate-200 dark:text-teal-200");
-@source inline("dark:text-violet-200 focus:opacity-100 g grid-cols-[repeat(7,minmax(0,1fr))]");
+@source inline("dark:text-violet-200 focus:opacity-100 grid-cols-[repeat(7,minmax(0,1fr))]");
 @source inline("group-focus-within:opacity-100 h-3.5 hover:bg-muted/30 hover:bg-muted/40 hover:border-border/80");
 @source inline("last:border-r-0 line-through min-h-28 min-h-40 outline-1 outline-dashed outline-tone-amber-ink");
-@source inline("p-1.5 sm:flex-row sm:gap-1 sm:items-center sm:min-h-0 sm:min-h-24 sm:px-1.5 sm:text-xs");
+@source inline("p-1.5 sm:inline sm:min-h-0 sm:min-h-24 sm:px-1.5 sm:text-xs text-accent-solid-foreground");
 @source inline("text-amber-900 text-blue-800 text-emerald-800 text-green-800 text-purple-800 text-rose-800");
-@source inline("text-sky-800 text-slate-800 text-teal-800 text-tone-amber-ink text-violet-800 w-3.5");
+@source inline("text-sky-800 text-slate-800 text-teal-800 text-tone-amber-ink text-violet-800 w-20 w-3.5");

package/src/styles-areas/data-table.css

@@ -18,35 +18,36 @@
  * after an app's responsive variant (task 2124). An app that imports every area gets exactly
  * what `cursedbelt/styles-utilities.css` emits — proved rule by rule in
  * src/stylesAreas.spec.ts, which is also what fails when this file is stale.
- * 144 candidate(s).
+ * 150 candidate(s).
  *
  * Written by scripts/generateAreaStyles.ts (`bun run styles:areas`), which
  * `bun run build` runs. The map of what is in which area, and why the areas are
  * import closures rather than a hand-written list, is scripts/styleAreas.ts.
  */
-@source inline("-m-1 -mt-2 -mt-6 -mx-1 -my-2.5 -my-3 @3xl:block @3xl:hidden @max-2xl:[&>*]:hidden");
-@source inline("@max-2xl:border-0 @max-2xl:min-w-0! @max-2xl:p-0! @max-2xl:w-0! @max-4xl:[&>*]:hidden");
+@source inline("-m-1 -mt-2 -mt-6 -mx-1 -my-2.5 -my-3 @3xl:block @3xl:hidden @max-2xl @max-2xl:[&>*]:hidden");
+@source inline("@max-2xl:border-0 @max-2xl:inline-flex @max-2xl:justify-center @max-2xl:min-w-0!");
+@source inline("@max-2xl:min-w-11 @max-2xl:p-0! @max-2xl:sr-only @max-2xl:w-0! @max-4xl:[&>*]:hidden");
 @source inline("@max-4xl:border-0 @max-4xl:min-w-0! @max-4xl:p-0! @max-4xl:w-0! @max-6xl:[&>*]:hidden");
 @source inline("@max-6xl:border-0 @max-6xl:min-w-0! @max-6xl:p-0! @max-6xl:w-0! @xl:block @xl:hidden");
-@source inline("[&>*]:hidden [&>*]:max-w-none [&_svg]:size-3 [overflow-wrap:anywhere] active:cursor-grabbing");
-@source inline("appearance appearance-none bg-[var(--cb-frozen-bg)] bg-card/95 bg-gradient-to-t bg-muted/30");
-@source inline("bg-muted/50 border-accent-solid border-accent/60 border-field-error border-l border-r col");
-@source inline("collapse cursor-grab data-[ending-style]:opacity-0 data-[ending-style]:scale-95");
-@source inline("data-[highlighted]:bg-accent/10 data-[highlighted]:text-accent-strong");
-@source inline("data-[starting-style]:opacity-0 data-[starting-style]:scale-95");
-@source inline("data-[state=closed]:slide-out-to-bottom data-[state=closed]:slide-out-to-left");
-@source inline("data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-bottom");
-@source inline("data-[state=open]:slide-in-from-left data-[state=open]:slide-in-from-right disabled:opacity-40");
-@source inline("duration-100 fade-in focus-visible:ring-field-ring/40 focus-within:border-field-ring");
-@source inline("focus-within:ring-2 focus-within:ring-field-ring/30 from-card h-105");
-@source inline("has-[[aria-invalid=true]]:border-field-error hover:bg-background hover:bg-border");
-@source inline("hover:bg-muted/40 hover:border-field-ring hover:text-warning justify-self-end last:border-0");
-@source inline("left-0 left-11 left-2.5 list-none max-h-64 max-h-88 max-h-[var(--sheet-h-lg)]");
-@source inline("max-h-[var(--sheet-h-md)] max-h-[var(--sheet-h-sm)] max-w-32 max-w-36 max-w-45 max-w-48 max-w-60");
-@source inline("max-w-sm min-h-20 min-h-dvh min-w-0! min-w-24 min-w-52 min-w-[var(--anchor-width)] min-w-max");
-@source inline("ml-1.5 mr-2 mt-1.5 mt-3 mt-4 not-italic ordinal p-0! pb-1.5 pl-1.5 pl-2 pr-0.5 pr-1 pr-10 pr-16");
-@source inline("pr-3 pr-9 pt-1 resize-none resize-y right-3 ring-field-error/30 rounded-l-xl rounded-r-xl");
-@source inline("rounded-t-xl self self-center self-stretch shadow-[1px_0_0_0_var(--color-border)] size-2 size-7");
-@source inline("slide-in-from-top-1 table-fixed text-accent-solid-foreground text-field-placeholder");
-@source inline("text-muted-foreground/60 text-success text-xl to-transparent top-3");
-@source inline("transition-[transform,opacity] w-0! w-11 w-20 w-32 w-36 w-40 w-88");
+@source inline("[&>*]:hidden [&>*]:max-w-none [&>svg]:size-3.5 [&_svg]:size-3 [overflow-wrap:anywhere]");
+@source inline("active:cursor-grabbing appearance appearance-none bg-[var(--cb-frozen-bg)] bg-card/95");
+@source inline("bg-gradient-to-t bg-muted/30 bg-muted/50 border-accent-solid border-accent/60 border-field-error");
+@source inline("border-l border-r col collapse cursor-grab data-[ending-style]:opacity-0");
+@source inline("data-[ending-style]:scale-95 data-[highlighted]:bg-accent/10");
+@source inline("data-[highlighted]:text-accent-strong data-[starting-style]:opacity-0");
+@source inline("data-[starting-style]:scale-95 data-[state=closed]:slide-out-to-bottom");
+@source inline("data-[state=closed]:slide-out-to-left data-[state=closed]:slide-out-to-right");
+@source inline("data-[state=open]:slide-in-from-bottom data-[state=open]:slide-in-from-left");
+@source inline("data-[state=open]:slide-in-from-right disabled:opacity-40 duration-100 fade-in");
+@source inline("focus-visible:ring-field-ring/40 focus-within:border-field-ring focus-within:ring-2");
+@source inline("focus-within:ring-field-ring/30 from-card h-105 has-[[aria-invalid=true]]:border-field-error");
+@source inline("hover:bg-background hover:bg-border hover:bg-muted/40 hover:border-field-ring hover:text-warning");
+@source inline("justify-self-end last:border-0 left-0 left-11 left-2.5 list-none max-h-64 max-h-88");
+@source inline("max-h-[var(--sheet-h-lg)] max-h-[var(--sheet-h-md)] max-h-[var(--sheet-h-sm)] max-w-32 max-w-36");
+@source inline("max-w-45 max-w-48 max-w-60 max-w-sm min-h-20 min-h-dvh min-w-0! min-w-24 min-w-52");
+@source inline("min-w-[var(--anchor-width)] min-w-max ml-1.5 mr-2 mt-1.5 mt-3 mt-4 not-italic ordinal p-0!");
+@source inline("pb-1.5 pl-1.5 pl-2 pr-0.5 pr-1 pr-10 pr-16 pr-3 pr-9 pt-1 resize-none resize-y right-3");
+@source inline("ring-field-error/30 rounded-l-xl rounded-r-xl rounded-t-xl self self-center self-stretch");
+@source inline("shadow-[1px_0_0_0_var(--color-border)] size-2 size-7 slide-in-from-top-1 table-fixed");
+@source inline("text-accent-solid-foreground text-field-placeholder text-muted-foreground/60 text-success");
+@source inline("text-xl to-transparent top-3 transition-[transform,opacity] w-0! w-11 w-20 w-32 w-36 w-40 w-88");

package/src/styles-utilities.css

@@ -4337,18 +4337,9 @@
     .sm\:grid-cols-\[minmax\(7rem\,34rem\)_minmax\(4rem\,1fr\)_auto\] {
       grid-template-columns: minmax(7rem,34rem) minmax(4rem,1fr) auto;
     }
-    .sm\:flex-row {
-      flex-direction: row;
-    }
     .sm\:flex-nowrap {
       flex-wrap: nowrap;
     }
-    .sm\:items-center {
-      align-items: center;
-    }
-    .sm\:gap-1 {
-      gap: var(--spacing);
-    }
     .sm\:gap-3 {
       gap: calc(var(--spacing) * 3);
     }
@@ -4504,12 +4495,32 @@
     }
   }
   @container (width < 42rem) {
+    .\@max-2xl\:sr-only {
+      position: absolute;
+      width: 1px;
+      height: 1px;
+      padding: 0;
+      margin: -1px;
+      overflow: hidden;
+      clip-path: inset(50%);
+      white-space: nowrap;
+      border-width: 0;
+    }
+    .\@max-2xl\:inline-flex {
+      display: inline-flex;
+    }
     .\@max-2xl\:w-0\! {
       width: 0px !important;
     }
     .\@max-2xl\:min-w-0\! {
       min-width: 0px !important;
     }
+    .\@max-2xl\:min-w-11 {
+      min-width: calc(var(--spacing) * 11);
+    }
+    .\@max-2xl\:justify-center {
+      justify-content: center;
+    }
     .\@max-2xl\:border-0 {
       border-style: var(--tw-border-style);
       border-width: 0px;
@@ -4957,6 +4968,10 @@
   .\[\&\>span\>button\]\:rounded-none > span > button {
     border-radius: 0;
   }
+  .\[\&\>svg\]\:size-3\.5 > svg {
+    width: calc(var(--spacing) * 3.5);
+    height: calc(var(--spacing) * 3.5);
+  }
 }
 @property --tw-translate-x {
   syntax: "*";