cursedbelt 5.40.0 → 5.45.0

package/src/styles-areas/core.css

@@ -15,18 +15,19 @@
  * 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.
- * 787 candidate(s).
+ * 818 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("-bottom-1.5 -bottom-px -left-1.5 -left-px -mb-px -ml-2 -right-1.5 -right-px -rotate-90 -top-1.5");
-@source inline("-top-px -translate-x-1/2 -translate-y-1/2 @container @xl:grid-cols-2 [&>:first-child]:min-w-0");
-@source inline("[&>:first-child]:shrink-0 [&>:first-child]:w-[var(--cb-sidebar-side)] [&>:last-child]:flex-1");
-@source inline("[&>:last-child]:min-w-0 [&>button:first-child]:rounded-l-md [&>button:focus-visible]:relative");
-@source inline("[&>button:focus-visible]:z-10 [&>button:hover]:relative [&>button:hover]:z-10");
-@source inline("[&>button:last-child]:rounded-r-md [&>button:not(:first-child)]:-ml-px");
+@source inline("*:border-l *:border-rule *:px-[calc(var(--col-gap)/2)] -bottom-1.5 -bottom-px -left-1.5 -left-px");
+@source inline("-mb-px -ml-2 -ml-[calc(var(--col-gap)/2+1px)] -mr-[calc(var(--col-gap)/2)] -right-1.5 -right-px");
+@source inline("-rotate-90 -top-1.5 -top-px -translate-x-1/2 -translate-y-1/2 @container @xl:grid-cols-2");
+@source inline("[&>:first-child]:min-w-0 [&>:first-child]:shrink-0 [&>:first-child]:w-[var(--cb-sidebar-side)]");
+@source inline("[&>:last-child]:flex-1 [&>:last-child]:min-w-0 [&>button:first-child]:rounded-l-md");
+@source inline("[&>button:focus-visible]:relative [&>button:focus-visible]:z-10 [&>button:hover]:relative");
+@source inline("[&>button:hover]:z-10 [&>button:last-child]:rounded-r-md [&>button:not(:first-child)]:-ml-px");
 @source inline("[&>button:not(:first-child)]:border-border [&>button:not(:first-child)]:border-l");
 @source inline("[&>button]:rounded-none [&>button]:w-full [&>span:first-child>button]:rounded-l-md");
 @source inline("[&>span:focus-within]:relative [&>span:focus-within]:z-10 [&>span:hover]:relative");
@@ -35,12 +36,12 @@
 @source inline("[&_.alert-icon]:text-muted-foreground [&_.alert-icon]:text-success [&_.alert-icon]:text-warning");
 @source inline("[&_[data-icon]]:text-accent [&_[data-icon]]:text-destructive [&_[data-icon]]:text-success");
 @source inline("[&_[data-icon]]:text-warning [&_sup]:leading-none [&_svg]:shrink-0 [&_svg]:size-12");
-@source inline("[&_svg]:size-4 [&_svg]:size-5 [&_svg]:size-6 [--cbfk-sticky-top:-1rem] a absolute act active");
-@source inline("active:bg-accent alert alert-icon align align-middle an animate-in");
-@source inline("animate-progress-indeterminate animate-pulse animate-spin aria");
-@source inline("aria-[invalid=true]:border-field-error aria-[invalid=true]:ring-field-error/30 aria-disabled");
-@source inline("aria-disabled:cursor-not-allowed aria-disabled:hover:bg-transparent aria-disabled:opacity-30");
-@source inline("aria-disabled:opacity-50 aria-disabled:pointer-events-none aria-pressed");
+@source inline("[&_svg]:size-4 [&_svg]:size-5 [&_svg]:size-6 [--cbfk-sticky-top:-1rem]");
+@source inline("[overflow-clip-margin:calc(var(--spacing)*1)] a absolute act active active:bg-accent alert");
+@source inline("alert-icon align align-middle an animate-in animate-progress-indeterminate animate-pulse");
+@source inline("animate-spin aria aria-[invalid=true]:border-field-error aria-[invalid=true]:ring-field-error/30");
+@source inline("aria-disabled aria-disabled:cursor-not-allowed aria-disabled:hover:bg-transparent");
+@source inline("aria-disabled:opacity-30 aria-disabled:opacity-50 aria-disabled:pointer-events-none aria-pressed");
 @source inline("aria-pressed:bg-accent/10 aria-pressed:border aria-pressed:border-accent");
 @source inline("aria-pressed:text-accent auto auto-cols-fr b back backdrop backdrop-blur backdrop-blur-md");
 @source inline("backdrop-blur-sm bg bg-accent bg-accent-solid bg-accent/10 bg-accent/5 bg-background");
@@ -52,20 +53,21 @@
 @source inline("bg-tone-emerald-bg bg-tone-fuchsia-bg bg-tone-lime-bg bg-tone-orange-bg bg-tone-purple-bg");
 @source inline("bg-tone-rose-bg bg-tone-sky-bg bg-tone-slate-bg bg-tone-teal-bg bg-tone-violet-bg bg-transparent");
 @source inline("bg-warning bg-warning/15 bg-warning/5 bg-warning/8 bg-white block blur border border-0");
-@source inline("border-accent border-accent/40 border-accent/50 border-b border-b-2 border-b-[7px]");
-@source inline("border-b-current border-border border-border! border-border-strong border-border/60");
-@source inline("border-collapse border-current border-destructive/30 border-destructive/40 border-destructive/50");
-@source inline("border-field-border border-success/30 border-success/40 border-success/50 border-t");
-@source inline("border-tone-sky-fg/30 border-tone-slate-fg/30 border-transparent border-warning/30");
-@source inline("border-warning/40 border-warning/50 border-x-4 border-x-transparent bot bottom bottom-0 break");
-@source inline("break-all break-words c ca cap capitalize co com contain container content contents cursor");
-@source inline("cursor-col-resize cursor-default cursor-ew-resize cursor-not-allowed cursor-pointer");
-@source inline("cursor-row-resize d dark dark:bg-card-overlay dark:bg-card-raised dark:bg-gray-800 data");
-@source inline("data-[disabled]:hover:bg-border data-[disabled]:opacity-50 data-[disabled]:pointer-events-none");
+@source inline("border-accent border-accent/40 border-accent/50 border-b border-b-0 border-b-2");
+@source inline("border-b-[length:var(--status-glyph-h)] border-b-current border-border border-border!");
+@source inline("border-border-strong border-border/60 border-collapse border-current border-destructive/30");
+@source inline("border-destructive/40 border-destructive/50 border-field-border border-rule border-success/30");
+@source inline("border-success/40 border-success/50 border-t border-tone-sky-fg/30 border-tone-slate-fg/30");
+@source inline("border-transparent border-warning/30 border-warning/40 border-warning/50 border-x-4");
+@source inline("border-x-transparent bot bottom bottom-0 break break-all break-words c ca cap capitalize co com");
+@source inline("contain container content contents cursor cursor-col-resize cursor-default cursor-ew-resize");
+@source inline("cursor-not-allowed cursor-pointer cursor-row-resize d dark dark:bg-card-overlay");
+@source inline("dark:bg-card-raised dark:bg-gray-800 data data-[disabled]:hover:bg-border");
+@source inline("data-[disabled]:opacity-50 data-[disabled]:pointer-events-none");
 @source inline("data-[interactive=true]:duration-[var(--duration-base)]");
 @source inline("data-[interactive=true]:ease-[var(--ease-out)] data-[interactive=true]:hover:-translate-y-0.5");
-@source inline("data-[interactive=true]:hover:border-border-strong data-[interactive=true]:hover:shadow-overlay");
-@source inline("data-[interactive=true]:transition-all data-[placeholder]:text-muted-foreground");
+@source inline("data-[interactive=true]:hover:border-border-strong data-[interactive=true]:transition-all");
+@source inline("data-[interactive=true]:transition-colors data-[placeholder]:text-muted-foreground");
 @source inline("data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2");
 @source inline("data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2");
 @source inline("data-[state=active]:bg-background data-[state=active]:border-accent");
@@ -84,7 +86,7 @@
 @source inline("disabled:bg-muted disabled:border-transparent disabled:cursor-not-allowed");
 @source inline("disabled:hover:bg-transparent disabled:hover:border-border disabled:hover:text-muted-foreground");
 @source inline("disabled:opacity-50 disabled:pointer-events-none disabled:text-muted-foreground div");
-@source inline("divide-border divide-y duration-200 duration-300 duration-[var(--duration-fast)] e");
+@source inline("divide-border divide-y duration duration-200 duration-300 duration-[var(--duration-fast)] e");
 @source inline("ease-[var(--ease-out)] empty empty:hidden fade fade-out file file:bg-transparent file:border-0");
 @source inline("file:font-medium file:mr-3 file:text-foreground file:text-sm fill fill-[var(--color-popover)]");
 @source inline("fill-border fill-current filter fix fixed flex flex-1 flex-col flex-none flex-wrap focus");
@@ -95,83 +97,90 @@
 @source inline("focus-visible:ring-offset-2 focus-visible:ring-offset-background focus-visible:ring-ring");
 @source inline("focus-visible:ring-success focus-visible:text-destructive-foreground focus:bg-accent/10");
 @source inline("focus:bg-destructive/10 focus:outline-none focus:ring-2 focus:ring-accent focus:text-accent");
-@source inline("focus:text-destructive font-bold font-medium font-mono font-normal font-semibold gap gap-0");
-@source inline("gap-0.5 gap-1 gap-1.5 gap-12 gap-16 gap-2 gap-3 gap-4 gap-6 gap-8 gap-px gap-x-2.5 gap-x-3");
-@source inline("gap-y-1 gap-y-2 gap-y-4 grid grid-cols-2");
+@source inline("focus:text-destructive font font-bold font-medium font-mono font-normal font-sans font-semibold");
+@source inline("gap gap-0 gap-0.5 gap-1 gap-1.5 gap-12 gap-16 gap-2 gap-3 gap-4 gap-6 gap-8 gap-px gap-x-0");
+@source inline("gap-x-3 gap-y-1 gap-y-2 gap-y-4 gap-y-[var(--col-gap)] grid grid-cols-2");
 @source inline("grid-cols-[repeat(auto-fit,minmax(min(var(--cb-grid-min),100%),1fr))] grid-flow-col group");
 @source inline("group-active/sep:opacity-100 group-data-[state=open]:rotate-180");
 @source inline("group-focus-visible/sep:opacity-100 group-hover group-hover/path:opacity-100");
 @source inline("group-hover/sep:opacity-100 group-hover:opacity-100 group/path group/sep grow h h-1 h-1.5 h-10");
-@source inline("h-14 h-16 h-2 h-2.5 h-24 h-3 h-32 h-4 h-6 h-7 h-8 h-9 h-[3px] h-[calc(100dvh-…)]");
-@source inline("h-[var(--control-h-lg)] h-[var(--control-h-md)] h-[var(--control-h-sm)] h-auto h-full h-px hi");
-@source inline("hid hidden hover hover:bg-accent hover:bg-accent-solid-hover hover:bg-accent/10");
-@source inline("hover:bg-accent/20 hover:bg-destructive-solid hover:bg-destructive-solid-hover");
-@source inline("hover:bg-destructive/10 hover:bg-muted hover:bg-success-solid-hover hover:bg-transparent");
-@source inline("hover:border-accent hover:border-destructive-solid hover:opacity-70 hover:text-accent");
-@source inline("hover:text-destructive hover:text-destructive-foreground hover:text-foreground");
-@source inline("hover:text-foreground! hover:underline i in inline inline-block inline-flex inline-grid inset");
-@source inline("inset-0 inset-x-0 inset-y-0 invisible is iso isolate it item items items-baseline items-center");
-@source inline("items-end items-start just justify-between justify-center justify-end l leading leading-none");
-@source inline("leading-relaxed leading-snug leading-tight left left-1/2 left-2 lg lg:px-8 line line-clamp-2");
-@source inline("lower lowercase m m-0 max max-h max-h-[80vh]");
+@source inline("h-14 h-16 h-2 h-2.5 h-24 h-3 h-32 h-4 h-6 h-7 h-8 h-9 h-[calc(100dvh-…)]");
+@source inline("h-[min(var(--region-h-lg),var(--region-h-phone))]");
+@source inline("h-[min(var(--region-h-md),var(--region-h-phone))]");
+@source inline("h-[min(var(--region-h-sm),var(--region-h-phone))] h-[var(--control-h-lg)]");
+@source inline("h-[var(--control-h-md)] h-[var(--control-h-sm)] h-[var(--indicator-w)] h-auto h-full h-px hi hid");
+@source inline("hidden hover hover:bg-accent hover:bg-accent-solid-hover hover:bg-accent/10 hover:bg-accent/20");
+@source inline("hover:bg-destructive-solid hover:bg-destructive-solid-hover hover:bg-destructive/10");
+@source inline("hover:bg-muted hover:bg-success-solid-hover hover:bg-transparent hover:border-accent");
+@source inline("hover:border-destructive-solid hover:opacity-70 hover:text-accent hover:text-destructive");
+@source inline("hover:text-destructive-foreground hover:text-foreground hover:text-foreground! hover:underline i");
+@source inline("in inline inline-block inline-flex inline-grid inset inset-0 inset-x-0 inset-y-0 invisible is");
+@source inline("iso isolate it item items items-baseline items-center items-end items-start just justify-between");
+@source inline("justify-center justify-end l leading leading-none leading-relaxed leading-snug leading-tight");
+@source inline("left left-1/2 left-2 lg lg:px-8 line line-clamp-2 lower lowercase m m-0 max max-h max-h-[80vh]");
 @source inline("max-h-[calc(var(--radix-popper-available-height,100dvh)-1rem)]");
-@source inline("max-h-[var(--radix-select-content-available-height)] max-sm:border-b-0 max-sm:border-x-0");
-@source inline("max-sm:bottom-0 max-sm:data-[state=closed]:slide-out-to-bottom");
-@source inline("max-sm:data-[state=open]:slide-in-from-bottom max-sm:h-dvh max-sm:hidden max-sm:inset-x-0");
-@source inline("max-sm:max-h-[92dvh] max-sm:max-h-dvh max-sm:max-w-none max-sm:pt-6 max-sm:rounded-b-none");
-@source inline("max-sm:rounded-none max-sm:rounded-t-2xl max-sm:touch-none max-sm:w-full max-w-2xl max-w-40");
-@source inline("max-w-5xl max-w-[10rem] max-w-[var(--reading-width)] max-w-full max-w-lg max-w-md max-w-sm");
-@source inline("max-w-xl max-w-xs mb-0.5 mb-1 mb-3 md md:divide-border md:divide-x md:flex-none md:flex-row");
-@source inline("md:inline md:w-1/3 md:w-2/5 min min-h-0 min-h-11 min-h-[1lh] min-h-[var(--control-h-lg)]");
-@source inline("min-h-[var(--control-h-md)] min-h-[var(--control-h-sm)] min-w-0 min-w-11 min-w-[8rem]");
-@source inline("min-w-[var(--radix-select-trigger-width)] ml-1 ml-auto motion motion-reduce:animate-none mt-0.5");
-@source inline("mt-1 mt-2 mx-auto my my-1 object object-cover opacity opacity-0 opacity-30 opacity-40 opacity-50");
-@source inline("opacity-60 opacity-70 out outline outline-none over overflow overflow-auto overflow-hidden");
-@source inline("overflow-x-auto overflow-y-auto overscroll-contain p p-0 p-0.5 p-1 p-2 p-3 p-4 p-6 p-[7px]");
-@source inline("p-[var(--panel-pad)] pause paused pb-1 pb-3 pb-[8vh]");
-@source inline("pb-[max(env(safe-area-inset-bottom,0px),0.75rem)] pl-4 pl-8 place placeholder");
-@source inline("placeholder:text-field-placeholder point pointer pointer-coarse pointer-coarse:-m-2");
-@source inline("pointer-coarse:data-[state=checked]:translate-x-8 pointer-coarse:h-11 pointer-coarse:min-h-11");
-@source inline("pointer-coarse:min-w-11 pointer-coarse:opacity-100 pointer-coarse:size-5 pointer-coarse:size-9");
-@source inline("pointer-coarse:w-11 pointer-coarse:w-[4.5rem] pointer-events pointer-events-auto");
-@source inline("pointer-events-none pr-8 pt-2 pt-3 px px-0 px-1 px-1.5 px-2 px-2.5 px-3 px-4 px-5 px-6 py-0");
-@source inline("py-0.5 py-1 py-1.5 py-12 py-2 py-2.5 py-3 py-4 py-6 py-[var(--panel-pad)] py-px r re relative");
-@source inline("res resize right right-0 right-2 ring ring-2 ring-background ro rotate-180 round rounded");
-@source inline("rounded-[calc(var(--radius-md)-0.25rem)] rounded-field rounded-full rounded-l-full rounded-lg");
-@source inline("rounded-md rounded-none rounded-r-full rounded-sm rounded-xl ru run running s select select-all");
-@source inline("select-none shadow shadow-[var(--shadow-overlay)] shadow-[var(--shadow-popover)] shadow-none");
-@source inline("shadow-overlay shadow-raised shadow-sm shrink shrink-0 size size-0 size-1.5 size-10 size-12");
-@source inline("size-14 size-2.5 size-20 size-3 size-3.5 size-4 size-5 size-6 size-8 sm sm:-translate-x-1/2");
-@source inline("sm:-translate-y-1/2 sm:block sm:data-[state=closed]:zoom-out-95 sm:data-[state=open]:zoom-in-95");
-@source inline("sm:hidden sm:left-1/2 sm:max-h-[calc(100dvh-2rem)] sm:max-h-[min(90dvh,calc(100dvh-2rem))]");
-@source inline("sm:max-w-2xl sm:max-w-4xl sm:max-w-[calc(100vw-2rem)] sm:max-w-lg sm:max-w-sm sm:p-4 sm:p-5");
-@source inline("sm:p-8 sm:px-6 sm:rounded-xl sm:text-sm sm:top-1/2 sm:w-[calc(100vw-2rem)] space space-y-1");
-@source inline("space-y-3 sr-only static sticky stroke stroke-accent-solid stroke-destructive stroke-muted");
-@source inline("stroke-warning t ta tab table tabular-nums text text-2xl text-[0.6em] text-accent");
-@source inline("text-accent-strong text-base text-caption text-center text-current text-data text-destructive");
-@source inline("text-destructive-foreground text-destructive-strong text-emerald-700 text-field-error");
-@source inline("text-field-fg text-foreground text-h1 text-h3 text-left text-lg text-meta text-muted-foreground");
-@source inline("text-muted-foreground! text-popover-foreground text-sm text-success-strong text-tone-amber-fg");
+@source inline("max-h-[var(--guide-popover-max-h)] max-h-[var(--radix-select-content-available-height)]");
+@source inline("max-sm:border-b-0 max-sm:border-x-0 max-sm:bottom-0");
+@source inline("max-sm:data-[state=closed]:slide-out-to-bottom max-sm:data-[state=open]:slide-in-from-bottom");
+@source inline("max-sm:h-dvh max-sm:hidden max-sm:inset-x-0 max-sm:max-h-[var(--sheet-h-phone)] max-sm:max-h-dvh");
+@source inline("max-sm:max-w-none max-sm:pt-6 max-sm:rounded-b-none max-sm:rounded-none max-sm:rounded-t-2xl");
+@source inline("max-sm:touch-none max-sm:w-full max-w-2xl max-w-40 max-w-[var(--modal-w-sm)]");
+@source inline("max-w-[var(--page-w-dashboard)] max-w-[var(--page-w-form)] max-w-[var(--page-w-wide)]");
+@source inline("max-w-[var(--reading-width)] max-w-full max-w-lg max-w-md max-w-xl max-w-xs mb-0.5 mb-1 mb-3 md");
+@source inline("md:divide-border md:divide-x md:flex-none md:flex-row md:grid-cols-4 md:inline md:w-1/3 md:w-2/5");
+@source inline("min min-h-0 min-h-11 min-h-[1lh] min-h-[var(--control-h-lg)] min-h-[var(--control-h-md)]");
+@source inline("min-h-[var(--control-h-sm)] min-w-0 min-w-11 min-w-32 min-w-[var(--radix-select-trigger-width)]");
+@source inline("ml-1 ml-auto motion motion-reduce:animate-none mt-0.5 mt-1 mt-2 mx-auto my my-1 object");
+@source inline("object-cover opacity opacity-0 opacity-30 opacity-40 opacity-50 opacity-60 opacity-70 out");
+@source inline("outline outline-none over overflow overflow-auto overflow-hidden overflow-x-auto overflow-x-clip");
+@source inline("overflow-y-auto overscroll-contain p p-0 p-0.5 p-1 p-2 p-3 p-4 p-6 p-[7px] p-[var(--panel-pad)]");
+@source inline("pause paused pb-0 pb-1 pb-2 pb-3 pb-4 pb-[max(env(safe-area-inset-bottom,0px),0.75rem)]");
+@source inline("pb-[var(--empty-lift)] pl-4 pl-8 place placeholder placeholder:text-field-placeholder point");
+@source inline("pointer pointer-coarse pointer-coarse:-m-2 pointer-coarse:data-[state=checked]:translate-x-8");
+@source inline("pointer-coarse:h-11 pointer-coarse:min-h-11 pointer-coarse:min-w-11 pointer-coarse:opacity-100");
+@source inline("pointer-coarse:size-5 pointer-coarse:size-9 pointer-coarse:w-11 pointer-coarse:w-18");
+@source inline("pointer-events pointer-events-auto pointer-events-none pr-8 pt-2 pt-3 px px-0 px-1 px-1.5 px-2");
+@source inline("px-2.5 px-3 px-4 px-5 px-6 py-0 py-0.5 py-1 py-1.5 py-12 py-2 py-2.5 py-3 py-4 py-6");
+@source inline("py-[var(--panel-pad)] py-px r re relative res resize right right-0 right-2 ring ring-2");
+@source inline("ring-background ro rotate-180 round rounded rounded-[calc(var(--radius-md)-0.25rem)]");
+@source inline("rounded-field rounded-full rounded-l-full rounded-lg rounded-md rounded-none rounded-r-full");
+@source inline("rounded-sm rounded-xl ru run running s select select-all select-none shadow");
+@source inline("shadow-[var(--shadow-overlay)] shadow-[var(--shadow-popover)] shadow-none shadow-overlay");
+@source inline("shadow-raised shadow-sm shrink shrink-0 size size-0 size-1.5 size-10 size-12 size-14 size-2.5");
+@source inline("size-20 size-3 size-3.5 size-4 size-5 size-6 size-8 sm sm:-translate-x-1/2 sm:-translate-y-1/2");
+@source inline("sm:block sm:data-[state=closed]:zoom-out-95 sm:data-[state=open]:zoom-in-95");
+@source inline("sm:h-[var(--region-h-lg)] sm:h-[var(--region-h-md)] sm:h-[var(--region-h-sm)] sm:hidden");
+@source inline("sm:left-1/2 sm:max-h-[calc(100dvh-2rem)] sm:max-h-[min(90dvh,calc(100dvh-2rem))]");
+@source inline("sm:max-w-[calc(100vw-2rem)] sm:max-w-[var(--modal-w-lg)] sm:max-w-[var(--modal-w-md)]");
+@source inline("sm:max-w-[var(--modal-w-sm)] sm:p-4 sm:p-5 sm:p-8 sm:px-6 sm:rounded-xl sm:text-sm sm:top-1/2");
+@source inline("sm:w-[calc(100vw-2rem)] space space-y-1 space-y-3 sr-only stat static sticky stroke");
+@source inline("stroke-accent-solid stroke-destructive stroke-muted stroke-warning t ta tab table tabular-nums");
+@source inline("text text-2xl text-[length:var(--text-glyph-relative)] text-accent text-accent-strong text-base");
+@source inline("text-caption text-center text-current text-data text-destructive text-destructive-foreground");
+@source inline("text-destructive-strong text-emerald-700 text-field-error text-field-fg text-foreground text-h1");
+@source inline("text-h3 text-left text-lg text-meta text-muted-foreground text-muted-foreground!");
+@source inline("text-popover-foreground text-right text-sm text-success-strong text-tone-amber-fg");
 @source inline("text-tone-cyan-fg text-tone-emerald-fg text-tone-fuchsia-fg text-tone-lime-fg");
 @source inline("text-tone-orange-fg text-tone-purple-fg text-tone-rose-fg text-tone-sky-fg text-tone-slate-fg");
-@source inline("text-tone-teal-fg text-tone-violet-fg text-warning-strong text-white text-xs to top top-0");
-@source inline("top-1/2 top-2 touch touch-manipulation touch-none track tracking tracking-tight tracking-wide");
-@source inline("tracking-wider transform transition transition-[stroke-dashoffset] transition-[width]");
-@source inline("transition-all transition-colors transition-opacity transition-transform translate-x-1/2");
-@source inline("translate-y-1/2 truncate under underline underline-offset-4 up uppercase v visible w-1 w-1/3");
-@source inline("w-10 w-16 w-2.5 w-24 w-3/4 w-4 w-6 w-7 w-8 w-9 w-[3px] w-[calc(100vw-2rem)]");
-@source inline("w-[var(--control-h-lg)] w-[var(--control-h-md)] w-[var(--control-h-sm)] w-auto w-full w-px white");
-@source inline("whitespace-normal whitespace-nowrap whitespace-pre-wrap wrap wrap-anywhere wrap-break-word z");
-@source inline("z-10 z-20 z-30 z-40 z-50 z-[var(--z-popover)]");
+@source inline("text-tone-teal-fg text-tone-violet-fg text-warning text-warning-strong text-white text-xs to top");
+@source inline("top-0 top-1/2 top-2 touch touch-manipulation touch-none track tracking tracking-tight");
+@source inline("tracking-wide tracking-wider transform transition transition-[stroke-dashoffset]");
+@source inline("transition-[width] transition-all transition-colors transition-opacity transition-transform");
+@source inline("translate-x-1/2 translate-y-1/2 truncate under underline underline-offset-4 up uppercase v");
+@source inline("visible w w-1 w-1/2 w-1/3 w-10 w-16 w-2.5 w-2/3 w-24 w-3/4 w-4 w-6 w-7 w-8 w-9");
+@source inline("w-[calc(100vw-2rem)] w-[var(--control-h-lg)] w-[var(--control-h-md)] w-[var(--control-h-sm)]");
+@source inline("w-[var(--indicator-w)] w-auto w-full w-px white whitespace whitespace-normal whitespace-nowrap");
+@source inline("whitespace-pre-wrap wrap wrap-anywhere wrap-break-word z z-10 z-20 z-30 z-40 z-50");
+@source inline("z-[var(--z-popover)]");
 
 /*
  * Theme variables cursedbelt's components read BY NAME (`var(--color-card)` in a style prop).
  * Tailwind emits a theme variable only when the app's own pass sees it used, and a `var()` here is
- * that use — `@source inline` cannot mark one. 9 variable(s), derived by
+ * that use — `@source inline` cannot mark one. 10 variable(s), derived by
  * scripts/generateUtilityStyles.ts → themeVariablesReadByName(). Nothing reads this property.
  */
 @layer theme {
   :root, :host {
-    --cb-theme-read-by-name: var(--color-accent) var(--color-border) var(--color-card) var(--color-muted) var(--color-popover) var(--duration-base) var(--ease-out) var(--text-caption) var(--text-sm);
+    --cb-theme-read-by-name: var(--color-accent) var(--color-border) var(--color-card) var(--color-muted) var(--color-popover) var(--duration-base) var(--ease-out) var(--spacing) var(--text-caption) var(--text-sm);
   }
 }

package/src/styles-areas/dashboard-grid.css

@@ -18,12 +18,12 @@
  * 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.
- * 11 candidate(s).
+ * 10 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("active:cursor-grabbing bg-muted/40 cursor-grab focus-visible:outline focus-visible:outline-2");
-@source inline("focus-visible:outline-offset-[-2px] focus-visible:outline-ring min-h-[2.75rem] min-w-[5rem]");
-@source inline("shrink-[2] size-7");
+@source inline("active:cursor-grabbing bg-muted/40 cursor-grab focus-visible:-outline-offset-2");
+@source inline("focus-visible:outline focus-visible:outline-2 focus-visible:outline-ring min-w-20 shrink-[2]");
+@source inline("size-7");

package/src/styles-areas/data-table.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.
- * 145 candidate(s).
+ * 144 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
@@ -28,25 +28,25 @@
 @source inline("@max-2xl:border-0 @max-2xl:min-w-0! @max-2xl:p-0! @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 [&_svg]:size-3 [overflow-wrap:anywhere] active:cursor-grabbing appearance");
-@source inline("appearance-none bg-[var(--cb-frozen-bg)] bg-card/95 bg-gradient-to-t bg-muted/30 bg-muted/50");
-@source inline("border-accent-solid border-accent/60 border-field-error border-l border-r col collapse");
-@source inline("cursor-grab data-[ending-style]:opacity-0 data-[ending-style]:scale-95");
+@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 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 font-sans from-card h-[420px]");
+@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-[22rem] max-h-[40dvh] max-h-[65dvh]");
-@source inline("max-h-[85dvh] max-w-32 max-w-36 max-w-48 max-w-[180px] max-w-[240px] min-h-20 min-h-dvh min-w-0!");
-@source inline("min-w-24 min-w-52 min-w-[var(--anchor-width)] ml-1.5 mr-2 mt-1.5 mt-3 mt-4 not-italic ordinal");
-@source inline("p-0! 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-right");
-@source inline("text-success text-warning text-xl to-transparent top-3 transition-[transform,opacity] w-0! w-11");
-@source inline("w-20 w-28 w-36 w-40 w-[352px]");
+@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");

package/src/styles-areas/disk-usage.css

@@ -18,15 +18,15 @@
  * 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.
- * 34 candidate(s).
+ * 31 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("[&_svg]:size-3 bg-accent/60 bg-border-strong collapse cursor-help duration-150");
-@source inline("focus-within:border-field-ring focus-within:ring-2 focus-within:ring-field-ring/30 gap-2.5");
+@source inline("focus-within:border-field-ring focus-within:ring-2 focus-within:ring-field-ring/30");
 @source inline("group-focus-visible/tile:opacity-100 group-hover/tile:opacity-100 group/tile hover:bg-border");
-@source inline("hover:bg-muted-foreground/10 italic max-w-56 max-w-96 mb-2 min-w-24 min-w-56 mr-0.5 pb-2 pl-2");
-@source inline("pr-1 ring-inset ring-ring rotate-90 self-stretch text-3xl text-[0.6rem] text-muted-foreground/60");
-@source inline("text-success text-warning");
+@source inline("hover:bg-muted-foreground/10 italic max-w-56 max-w-96 mb-2 min-w-24 min-w-56 mr-0.5 pl-2 pr-1");
+@source inline("ring-inset ring-ring rotate-90 self-stretch text-3xl text-[length:var(--text-glyph)]");
+@source inline("text-muted-foreground/60 text-success");

package/src/styles-areas/emoji.css

@@ -24,5 +24,5 @@
  * `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("h-[420px] hover:border-border-strong hover:border-field-ring max-h-64 min-w-48 shadow-popover");
-@source inline("text-field-placeholder text-xl w-[352px]");
+@source inline("h-105 hover:border-border-strong hover:border-field-ring max-h-64 min-w-48 shadow-popover");
+@source inline("text-field-placeholder text-xl w-88");

package/src/styles-areas/fields.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.
- * 114 candidate(s).
+ * 111 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
@@ -36,17 +36,16 @@
 @source inline("data-[state=open]:slide-in-from-right disabled:hover:scale-100 disabled:opacity-40 duration-100");
 @source inline("focus-visible:border-border-strong focus-visible:ring-0 focus-visible:ring-field-ring/40");
 @source inline("focus-within:border-field-ring focus-within:ring-2 focus-within:ring-field-ring/30");
-@source inline("group-focus-within:opacity-100 h-12 h-3.5 h-5 h-[420px]");
-@source inline("has-[[aria-invalid=true]]:border-field-error hover:bg-border hover:bg-muted/50");
-@source inline("hover:border-field-ring hover:scale-110 hover:text-warning italic leading-5 left-0 left-2.5 li");
-@source inline("list-none max-h-64 max-h-[40dvh] max-h-[65dvh] max-h-[85dvh] min-h-20 min-w-24 min-w-64");
-@source inline("min-w-[var(--anchor-width)] min-w-max mix-blend-difference mr-2 pb-4 pl-1.5 pl-2 pl-2.5");
-@source inline("pointer-coarse:before:absolute pointer-coarse:before:bottom-[-10px]");
-@source inline("pointer-coarse:before:left-[-4px] pointer-coarse:before:right-[-4px]");
-@source inline("pointer-coarse:before:top-[-10px] pointer-coarse:items-center pr-1 pr-16 pr-2 pr-3 pr-9 pt-1");
-@source inline("resize-none resize-y right-1.5 right-3 ring-accent/30 ring-field-error/30 rounded-l-xl");
-@source inline("rounded-r-xl rounded-t-xl self-stretch size-2 size-7 size-9 sm:w-11 sm:w-56");
-@source inline("text-field-placeholder text-right text-success text-warning text-xl top-1.5");
-@source inline("transition-[transform,opacity] w-20 w-28 w-32 w-40 w-[352px] w-fit w-max whitespace");
-@source inline("whitespace-pre");
+@source inline("group-focus-within:opacity-100 h-105 h-12 h-3.5 h-5 has-[[aria-invalid=true]]:border-field-error");
+@source inline("hover:bg-border hover:bg-muted/50 hover:border-field-ring hover:scale-110 hover:text-warning");
+@source inline("italic leading-5 left-0 left-2.5 li list-none max-h-64 max-h-[var(--sheet-h-lg)]");
+@source inline("max-h-[var(--sheet-h-md)] max-h-[var(--sheet-h-sm)] max-w-sm min-h-20 min-w-24 min-w-64");
+@source inline("min-w-[var(--anchor-width)] min-w-max mix-blend-difference mr-2 pl-1.5 pl-2 pl-2.5");
+@source inline("pointer-coarse:before:-left-1 pointer-coarse:before:-right-1 pointer-coarse:before:absolute");
+@source inline("pointer-coarse:before:bottom-[calc(var(--hit-slop-y)*-1)]");
+@source inline("pointer-coarse:before:top-[calc(var(--hit-slop-y)*-1)] pointer-coarse:items-center pr-1 pr-16");
+@source inline("pr-2 pr-3 pr-9 pt-1 resize-none resize-y right-1.5 right-3 ring-accent/30 ring-field-error/30");
+@source inline("rounded-l-xl rounded-r-xl rounded-t-xl self-stretch size-2 size-7 size-9 sm:w-11 sm:w-56");
+@source inline("text-field-placeholder text-success text-xl top-1.5 transition-[transform,opacity] w-20 w-32");
+@source inline("w-36 w-40 w-88 w-fit w-max whitespace-pre");
 @source inline('pointer-coarse:before:content-[""]');

package/src/styles-areas/filter-rail.css

@@ -18,16 +18,16 @@
  * 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.
- * 32 candidate(s).
+ * 31 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("-mx-2 [&_button]:min-h-0 [&_button]:min-w-0 [&_button]:p-0 [&_button]:size-7 bg-card-overlay");
-@source inline("border-r border-rule duration-150 group-data-[state=open]/rail-section:rotate-90");
+@source inline("-mx-2 -outline-offset-2 [&_button]:min-h-0 [&_button]:min-w-0 [&_button]:p-0 [&_button]:size-7");
+@source inline("bg-card-overlay border-r duration-150 group-data-[state=open]/rail-section:rotate-90");
 @source inline("group-focus-within/rail-row:opacity-100 group-hover/rail-row:opacity-100 group/rail-row");
 @source inline("group/rail-section hover:bg-card-raised last:mb-0 mx-2 opacity-100 outline-2 outline-accent");
-@source inline("outline-dashed outline-offset-[-2px] place-items-center pointer-coarse:[&_button]:min-h-11");
+@source inline("outline-dashed place-items-center pointer-coarse:[&_button]:min-h-11");
 @source inline("pointer-coarse:[&_button]:min-w-11 pointer-coarse:[&_button]:size-11 pt-1 self-stretch");
 @source inline("shadow-[inset_3px_0_0_0_var(--accent)] w-14 w-3 w-56");

package/src/styles-areas/folder-tree.css

@@ -26,6 +26,6 @@
  */
 @source inline("[&>*]:min-w-0 bg-[var(--background)] bg-[var(--card)] bg-[var(--muted)]/10 bg-[var(--muted)]/20");
 @source inline("bg-[var(--muted)]/30 bg-accent/15 border-[var(--border)] collapse hover:bg-[var(--muted)]/15");
-@source inline("hover:decoration-border hover:underline-offset-4 justify-start max-w max-w-[12rem] max-w-[20rem]");
-@source inline("min-w-8 mx-0.5 p-1.5 place-items-center px-0.5 ring-1 ring-[var(--accent)] self-start");
-@source inline("self-stretch text-[var(--danger)] text-[var(--muted-foreground)] w-36");
+@source inline("hover:decoration-border hover:underline-offset-4 justify-start max-w max-w-48 max-w-80 min-w-8");
+@source inline("mx-0.5 p-1.5 place-items-center px-0.5 ring-1 ring-[var(--accent)] self-start self-stretch");
+@source inline("text-[var(--danger)] text-[var(--muted-foreground)] w-36");

package/src/styles-areas/markdown.css

@@ -25,4 +25,5 @@
  * import closures rather than a hand-written list, is scripts/styleAreas.ts.
  */
 @source inline("bg-black/10 dark:bg-white/10 first:mt-0 hover:opacity-80 italic list-decimal list-disc pl-5 pr-9");
-@source inline("right-1 text-[0.85em] text-[0.9em] top-1 underline-offset-2");
+@source inline("right-1 text-[length:var(--text-code-block)] text-[length:var(--text-code-inline)] top-1");
+@source inline("underline-offset-2");

package/src/styles-areas/master-detail.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.
- * 30 candidate(s).
+ * 29 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
@@ -28,5 +28,5 @@
 @source inline("bg-accent/15 border-[var(--border)] flex-row focus-within:border-field-ring focus-within:ring-2");
 @source inline("focus-within:ring-field-ring/30 gap-x-4 gap-y-1.5 grid-cols-[minmax(5rem,9rem)_1fr]");
 @source inline("has-[[aria-invalid=true]]:border-field-error hover:bg-[var(--muted)] hover:bg-muted/80 mb-1.5");
-@source inline("mb-4 min-h min-h-[44px] min-h-full pb-0.5 pr-1 ring-1 ring-[var(--accent)]/40 ring-accent/30");
-@source inline("ring-inset self-stretch text-[var(--foreground)] text-[var(--muted-foreground)]");
+@source inline("mb-4 min-h min-h-full pb-0.5 pr-1 ring-1 ring-[var(--accent)]/40 ring-accent/30 ring-inset");
+@source inline("self-stretch text-[var(--foreground)] text-[var(--muted-foreground)]");

package/src/styles-areas/media-gallery.css

@@ -18,17 +18,17 @@
  * 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.
- * 46 candidate(s).
+ * 45 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("[&_svg]:size-3 appearance appearance-none aspect aspect-video backdrop-blur-[2px] bg-black/55");
-@source inline("bg-black/80 bg-black/85 bg-black/95 bg-white/10 border-none bottom-1");
-@source inline("focus-visible:ring-offset-black focus-within:border-field-ring focus-within:ring-2");
-@source inline("focus-within:ring-field-ring/30 hover:bg-border hover:bg-white/20 hover:border-accent-solid");
-@source inline("hover:text-white inset-4 left-1 min-h-20 min-h-dvh min-w-24 p-1.5 pl-2 pr-1 resize-none right-1");
-@source inline("right-4 size-9 text-tone-amber-ink text-tone-cyan-ink text-tone-emerald-ink text-tone-orange-ink");
+@source inline("[&_svg]:size-3 appearance appearance-none aspect-video backdrop-blur-xs bg-black/55 bg-black/80");
+@source inline("bg-black/85 bg-black/95 bg-white/10 border-none bottom-1 focus-visible:ring-offset-black");
+@source inline("focus-within:border-field-ring focus-within:ring-2 focus-within:ring-field-ring/30");
+@source inline("hover:bg-border hover:bg-white/20 hover:border-accent-solid hover:text-white inset-4 left-1");
+@source inline("min-h-20 min-h-dvh min-w-24 p-1.5 pl-2 pr-1 resize-none right-1 right-4 size-9");
+@source inline("text-tone-amber-ink text-tone-cyan-ink text-tone-emerald-ink text-tone-orange-ink");
 @source inline("text-tone-purple-ink text-tone-rose-ink text-tone-sky-ink text-tone-slate-ink text-white/70");
-@source inline("top-1 top-4 translate translate-x-[1px]");
+@source inline("top-1 top-4 translate translate-x-px");

package/src/styles-areas/media.css

@@ -18,22 +18,21 @@
  * 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.
- * 92 candidate(s).
+ * 86 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("[&_svg]:max-h-10 [&_svg]:min-h-5 [&_svg]:size-1/3 accent-white active:cursor-grabbing appearance");
-@source inline("appearance-none aspect aspect-square aspect-video backdrop-blur-[2px] bg-accent/15");
-@source inline("bg-background/65 bg-background/85 bg-black bg-black/55 bg-black/60 bg-black/85 bg-black/90");
-@source inline("bg-card-raised bg-center bg-cover bg-linear-to-t bg-muted/40 bg-white/90 border-2");
-@source inline("border-accent-solid border-white/90 border-y-2 bottom-1 bottom-1.5 bottom-2 cursor-crosshair");
-@source inline("cursor-grab cursor-zoom-in ease-in-out focus-within:opacity-100 from-black/80 g gap-x-4");
-@source inline("grayscale group-focus-within:opacity-100 h-11 hover:bg-black/75 hover:bg-destructive");
-@source inline("hover:bg-white/20 hover:border-accent-solid invert left-0 left-1 max-h-[40vh] max-h-[48vh]");
-@source inline("max-h-full max-w-[200px] md:grid-cols-4 min-h-64 min-h-dvh min-w-10 min-w-28 min-w-40 min-w-48 o");
-@source inline("op opacity-100 opacity-80 pb-2 pr-9 pt-8 right-1 right-1.5 right-3 sh");
-@source inline("shadow-[0_0_0_1px_rgba(0,0,0,0.55)] size-7 size-9 sm:gap-3 sm:grid-cols-3");
-@source inline("text-[color:var(--accent)] text-right text-xl to-transparent top-1 top-1.5 translate");
-@source inline("translate-x-[1px] translate-x-px w w-0.5 w-12 w-3 zoom zoom-in");
+@source inline("appearance-none aspect-square aspect-video backdrop-blur-xs bg-accent/15 bg-background/65");
+@source inline("bg-background/85 bg-black bg-black/55 bg-black/60 bg-black/85 bg-black/90 bg-card-raised");
+@source inline("bg-center bg-cover bg-linear-to-t bg-muted/40 bg-white/90 border-2 border-accent-solid");
+@source inline("border-white/90 border-y-2 bottom-1 bottom-1.5 bottom-2 cursor-crosshair cursor-grab");
+@source inline("cursor-zoom-in ease-in-out focus-within:opacity-100 from-black/80 g gap-x-4 grayscale");
+@source inline("group-focus-within:opacity-100 h-11 hover:bg-black/75 hover:bg-destructive hover:bg-white/20");
+@source inline("hover:border-accent-solid invert left-0 left-1 max-h-[40vh] max-h-[var(--media-max-h)]");
+@source inline("max-h-full max-w-50 min-h-64 min-h-dvh min-w-10 min-w-28 min-w-40 min-w-48 o op opacity-100");
+@source inline("opacity-80 pr-9 pt-8 right-1 right-1.5 right-3 sh shadow-[0_0_0_1px_rgba(0,0,0,0.55)] size-7");
+@source inline("size-9 sm:gap-3 sm:grid-cols-3 text-[color:var(--accent)] text-xl to-transparent top-1 top-1.5");
+@source inline("translate translate-x-px w-0.5 w-12 w-3 zoom zoom-in");