@codenhub/styles 0.2.0 → 0.4.0

package/dist/tw/components/feedback.css

@@ -94,8 +94,10 @@
   @apply box inline-flex min-h-6 w-fit items-center gap-1 px-2.5 text-xs font-bold;
 
   /* Pill by default, but an aesthetic that declares no radius has to mean it, so
-     the round corner is this component's fallback rather than a hardcoded value. */
-  border-radius: var(--ui-radius, calc(infinity * 1px));
+     the round corner is this component's fallback rather than a hardcoded value.
+     An aesthetic that keeps pills distinct from its control corner says so
+     through `--ui-radius-pill` first. */
+  border-radius: var(--ui-radius-pill, var(--ui-radius, calc(infinity * 1px)));
   clip-path: var(--ui-clip-tight, var(--ui-clip, none));
 }
 
@@ -115,38 +117,66 @@
   background: linear-gradient(90deg, var(--skeleton-base), var(--skeleton-sheen), var(--skeleton-base));
   background-size: 200% 100%;
   border-radius: var(--ui-radius, var(--radius-control));
+  /* Not a box, so it reads the corner shape itself, beside the radius. */
+  corner-shape: var(--ui-corner-shape, round);
 }
 
-/* The same: intent only. The track is 10px tall, which is most of a border under
-   any aesthetic thick enough to have an opinion, so the bar draws no edge and the
-   ceilings that used to keep one survivable are gone with it.
-
-   `--progress-surface` used to mix `--intent-subtle` at 60% -- a tint of the
-   same tone the track already sits on (a bare page, or a `.soft` card), which
-   measured under 1.2:1 against both in either theme, well under the 3:1 WCAG
-   1.4.11 floor `registry.json` already cites for the checkbox, radio, and
-   switch. `--color-border` was tried next and measured no better (1.05:1): it
-   is calibrated for a line against the page, and a `.soft` card already sits
-   close to that same lightness, so a border-strength token disappears against
-   it too. Mixing `--color-text-secondary` instead is what actually separates
-   the track from both -- it is a step read against text at rest everywhere
-   else in the package, and stepping toward it here clears 3:1 (3.63-4.26:1
-   measured) on a bare page and a `.soft` card, in both themes. */
+/* The track is a box, the fill is not: `box.css`'s formula composes the frame,
+   the value fill stays `--intent-color` at full strength with no presentation,
+   same contract as `.loader`/`.skeleton`. `.progress` cannot `@apply box`
+   (the fill is a `::after`, not the element's own background), so it hand-
+   reimplements the formula the way `.quote` does -- see
+   docs/internal/progress-presentation-axes.md for the decision and why the
+   other three indicators do not get the same treatment. */
 @utility progress {
-  --progress-color: var(--intent-color);
-  --progress-surface: color-mix(in srgb, var(--color-text-secondary) 70%, transparent);
-
-  @apply relative h-2.5 w-full overflow-hidden bg-(--progress-surface);
+  --_d-fill: 12%;
+  --_d-fg-on-fill: 0%;
+  --_d-border: 0%;
+  --_d-elevation: 0;
+  /* `--progress-color`/`--progress-surface`/`--progress-edge` are the Tier 1
+     override path an aesthetic or consumer reaches `.progress` through (see
+     model.md's pseudo-element budget section), so they stay undeclared here:
+     redeclaring one on `.progress` itself would win over a value set on an
+     ancestor regardless of specificity, the same reasoning `box.css` gives
+     for `--_fill-cap`. Each is read with this formula as its fallback, in
+     private `--_progress-*` slots, at the point it paints below. */
+  /* Presentation capped by the intent, the same `--_capped` `box` composes. */
+  --_progress-capped: min(var(--ui-fill, var(--_d-fill)), var(--intent-fill-max, 100%));
+  --_progress-fill: calc(var(--_progress-capped) * var(--ui-bg-alpha, 1));
+  /* Grounded on `transparent`, the same choice `.badge` and `.btn` make --
+     not `.pre`/`.code`/`.kbd`'s opaque `--intent-subtle` ground. */
+  --_progress-surface: color-mix(in oklab, var(--intent-color) var(--_progress-fill), transparent);
+  /* One `color-mix()`, not `box`/`.quote`'s two chained through a `--_line`
+     step: a WebKit build measurably destabilizes composing dozens of tracks
+     each carrying a three-level color-mix chain into the same page -- fine
+     at ten, a reproducible ~30-minute CI hang at forty, isolated by removing
+     one variable at a time (element count, then border at all, then chain
+     depth) until only chain depth reproduced it. `box`/`.quote`'s extra step
+     blends the line toward the fill first so a heavily filled box does not
+     draw a ring of a different colour around its own plate -- a real risk up
+     to `.solid`'s 100% fill. `.progress` never reaches that: `.solid` is
+     unsupported here (`registry.json`), so the fill this reads never exceeds
+     `.soft`'s 12%, and mixing straight from `--intent-border` at that fill
+     is indistinguishable from blending through the surface first. */
+  --_progress-edge: color-mix(in oklab, var(--intent-border) var(--ui-border, var(--_d-border)), transparent);
+
+  @apply relative h-2.5 w-full overflow-hidden;
+  background-color: var(--progress-surface, var(--_progress-surface));
+  border: var(--ui-border-width, var(--border-width)) solid var(--progress-edge, var(--_progress-edge));
   /* Round by default; an aesthetic that declares no radius squares the track and
-     its fill together. */
-  border-radius: var(--ui-radius, calc(infinity * 1px));
+     its fill together, and a pill corner reaches both first. */
+  border-radius: var(--ui-radius-pill, var(--ui-radius, calc(infinity * 1px)));
+  /* Not a box either, and the fill below restates it, so a bevelled track
+     carries a bevelled fill rather than a pill inside a cut frame. */
+  corner-shape: var(--ui-corner-shape, round);
 
   &::after {
     content: "";
     @apply absolute start-0 top-0 bottom-0 block h-full transition-[width] duration-(--motion-duration-slow) ease-(--motion-ease);
 
-    border-radius: var(--ui-radius, calc(infinity * 1px));
-    background-color: var(--progress-color);
+    border-radius: var(--ui-radius-pill, var(--ui-radius, calc(infinity * 1px)));
+    corner-shape: var(--ui-corner-shape, round);
+    background-color: var(--progress-color, var(--intent-color));
     width: var(--progress-value, 0%);
     z-index: 2;
   }
@@ -158,7 +188,7 @@
     background: linear-gradient(
       90deg,
       transparent,
-      color-mix(in srgb, var(--progress-color) 15%, transparent),
+      color-mix(in srgb, var(--progress-color, var(--intent-color)) 15%, transparent),
       transparent
     );
     background-size: 200% 100%;

package/dist/tw/components/form.css

@@ -487,8 +487,10 @@
 
   /* Capped at its own radius: a control radius is sized for a 40px control, and
      14px of it on a 16px box renders as a circle, which is the one shape a
-     checkbox must not be. A squaring aesthetic still reaches it. */
-  border-radius: min(var(--ui-radius, var(--radius-small)), var(--radius-small));
+     checkbox must not be. A squaring aesthetic still reaches it, through the
+     chip corner first -- `.cyber` squares chips outright, which is also what
+     tells its checkbox from its diamond radio. */
+  border-radius: min(var(--ui-radius-tight, var(--ui-radius, var(--radius-small))), var(--radius-small));
 
   /* Chip geometry: the tight silhouette, and an inset edge no thicker than the
      line the aesthetic draws elsewhere. A 16px box cannot spend four pixels a
@@ -554,6 +556,10 @@
   &::after {
     @apply block size-2 scale-0 rounded-full opacity-0 transition-[transform,opacity] duration-(--motion-duration-normal) ease-(--motion-ease);
 
+    /* The dot is the ring's shape at a smaller size: a diamond inside a diamond
+       under a bevelling aesthetic, a circle inside a circle otherwise. */
+    corner-shape: var(--ui-corner-shape, round);
+
     background-color: currentcolor;
     content: "";
   }
@@ -614,8 +620,10 @@
 
   height: var(--switch-height);
   width: var(--switch-width);
-  /* Pill by default; a squaring aesthetic reaches the track and the knob together. */
-  border-radius: var(--ui-radius, calc(infinity * 1px));
+  /* Pill by default; a squaring aesthetic reaches the track and the knob
+     together, and an aesthetic with a pill corner of its own reaches both
+     through that first. */
+  border-radius: var(--ui-radius-pill, var(--ui-radius, calc(infinity * 1px)));
 
   /* Chip geometry, for the reason given on `checkbox`: a 20px track has no more
      room for a thick inset edge than a 16px box does. */
@@ -636,7 +644,10 @@
        tone as the label beside it. Checked, it takes the mark colour like the
        other two toggles. */
     background-color: var(--color-text-secondary);
-    border-radius: var(--ui-radius, calc(infinity * 1px));
+    border-radius: var(--ui-radius-pill, var(--ui-radius, calc(infinity * 1px)));
+    /* A pseudo-element is not a box: the knob takes the track's corner shape
+       itself, so the two stay the same shape. */
+    corner-shape: var(--ui-corner-shape, round);
     content: "";
     height: var(--switch-knob);
     width: var(--switch-knob);

package/dist/tw/components/tooltip.css

@@ -138,6 +138,6 @@
   --_d-elevation: 0;
   --_d-ground: var(--intent-subtle);
 
-  border-radius: var(--ui-radius, calc(infinity * 1px));
+  border-radius: var(--ui-radius-pill, var(--ui-radius, calc(infinity * 1px)));
   clip-path: none;
 }

package/dist/tw/palette.css

@@ -0,0 +1,451 @@
+/* Generated by `pnpm generate` from `src/index.css`, through
+   `scripts/generate-palette.mjs`. Do not hand-edit -- see
+   `docs/internal/generated-palette.md` for what this is and why it exists. */
+
+:root {
+  --palette-neutral-solid-bg: oklab(0.145 0 0 / 0.2);
+  --palette-neutral-solid-fg: oklab(0.205 0 0);
+  --palette-neutral-solid-edge: oklab(0.145 0 0 / 0.2);
+  --palette-neutral-solid-bg-hover: oklab(0.371 0 0 / 0.34);
+  --palette-neutral-solid-edge-hover: oklab(0.371 0 0 / 0.34);
+  --palette-neutral-soft-fg: oklab(0.205 0 0);
+  --palette-neutral-soft-bg: oklab(0.145 0 0 / 0.12);
+  --palette-neutral-soft-edge: oklab(0.698936 0 0 / 0.8944);
+  --palette-neutral-soft-bg-hover: oklab(0.371 0 0 / 0.26);
+  --palette-neutral-soft-edge-hover: oklab(0.371 0 0 / 0.9112);
+  --palette-neutral-soft-page-bg: oklab(0.8842 0 0);
+  --palette-neutral-soft-page-edge: oklab(0.729144 0 0);
+  --palette-neutral-soft-page-bg-hover: oklab(0.82536 0 0);
+  --palette-neutral-soft-page-edge-hover: oklab(0.425523 0 0);
+  --palette-neutral-soft-subtle-bg: oklab(0.82876 0 0);
+  --palette-neutral-soft-subtle-edge: oklab(0.722491 0 0);
+  --palette-neutral-soft-subtle-bg-hover: oklab(0.77874 0 0);
+  --palette-neutral-soft-subtle-edge-hover: oklab(0.419929 0 0);
+  --palette-neutral-ghost-fg: oklab(0.205 0 0);
+  --palette-neutral-ghost-bg: oklab(0 0 0 / 0);
+  --palette-neutral-ghost-edge: oklab(0.708 0 0);
+  --palette-neutral-ghost-bg-hover: oklab(0.371 0 0 / 0.14);
+  --palette-neutral-ghost-edge-hover: oklab(0.371 0 0);
+  --palette-neutral-ghost-page-bg: oklab(0.985 0 0);
+  --palette-neutral-ghost-page-edge: oklab(0.708 0 0);
+  --palette-neutral-ghost-page-bg-hover: oklab(0.89904 0 0);
+  --palette-neutral-ghost-page-edge-hover: oklab(0.371 0 0);
+  --palette-neutral-ghost-subtle-bg: oklab(0.922 0 0);
+  --palette-neutral-ghost-subtle-edge: oklab(0.708 0 0);
+  --palette-neutral-ghost-subtle-bg-hover: oklab(0.84486 0 0);
+  --palette-neutral-ghost-subtle-edge-hover: oklab(0.371 0 0);
+  --palette-primary-solid-bg: oklab(0.145 0 0);
+  --palette-primary-solid-fg: oklab(0.985 0 0);
+  --palette-primary-solid-edge: oklab(0.145 0 0);
+  --palette-primary-solid-bg-hover: oklab(0.371 0 0);
+  --palette-primary-solid-edge-hover: oklab(0.371 0 0);
+  --palette-primary-soft-fg: oklab(0.205 0 0);
+  --palette-primary-soft-bg: oklab(0.145 0 0 / 0.12);
+  --palette-primary-soft-edge: oklab(0.145 0 0 / 0.8944);
+  --palette-primary-soft-bg-hover: oklab(0.371 0 0 / 0.26);
+  --palette-primary-soft-edge-hover: oklab(0.371 0 0 / 0.9112);
+  --palette-primary-soft-page-bg: oklab(0.8842 0 0);
+  --palette-primary-soft-page-edge: oklab(0.233704 0 0);
+  --palette-primary-soft-page-bg-hover: oklab(0.82536 0 0);
+  --palette-primary-soft-page-edge-hover: oklab(0.425523 0 0);
+  --palette-primary-soft-subtle-bg: oklab(0.82876 0 0);
+  --palette-primary-soft-subtle-edge: oklab(0.227051 0 0);
+  --palette-primary-soft-subtle-bg-hover: oklab(0.77874 0 0);
+  --palette-primary-soft-subtle-edge-hover: oklab(0.419929 0 0);
+  --palette-primary-ghost-fg: oklab(0.205 0 0);
+  --palette-primary-ghost-bg: oklab(0 0 0 / 0);
+  --palette-primary-ghost-edge: oklab(0.145 0 0);
+  --palette-primary-ghost-bg-hover: oklab(0.371 0 0 / 0.14);
+  --palette-primary-ghost-edge-hover: oklab(0.371 0 0);
+  --palette-primary-ghost-page-bg: oklab(0.985 0 0);
+  --palette-primary-ghost-page-edge: oklab(0.145 0 0);
+  --palette-primary-ghost-page-bg-hover: oklab(0.89904 0 0);
+  --palette-primary-ghost-page-edge-hover: oklab(0.371 0 0);
+  --palette-primary-ghost-subtle-bg: oklab(0.922 0 0);
+  --palette-primary-ghost-subtle-edge: oklab(0.145 0 0);
+  --palette-primary-ghost-subtle-bg-hover: oklab(0.84486 0 0);
+  --palette-primary-ghost-subtle-edge-hover: oklab(0.371 0 0);
+  --palette-secondary-solid-bg: oklab(0.439 0 0);
+  --palette-secondary-solid-fg: oklab(0.985 0 0);
+  --palette-secondary-solid-edge: oklab(0.439 0 0);
+  --palette-secondary-solid-bg-hover: oklab(0.371 0 0);
+  --palette-secondary-solid-edge-hover: oklab(0.371 0 0);
+  --palette-secondary-soft-fg: oklab(0.269 0 0);
+  --palette-secondary-soft-bg: oklab(0.439 0 0 / 0.12);
+  --palette-secondary-soft-edge: oklab(0.439 0 0 / 0.8944);
+  --palette-secondary-soft-bg-hover: oklab(0.371 0 0 / 0.26);
+  --palette-secondary-soft-edge-hover: oklab(0.371 0 0 / 0.9112);
+  --palette-secondary-soft-page-bg: oklab(0.91948 0 0);
+  --palette-secondary-soft-page-edge: oklab(0.496658 0 0);
+  --palette-secondary-soft-page-bg-hover: oklab(0.82536 0 0);
+  --palette-secondary-soft-page-edge-hover: oklab(0.425523 0 0);
+  --palette-secondary-soft-subtle-bg: oklab(0.90628 0 0);
+  --palette-secondary-soft-subtle-edge: oklab(0.495074 0 0);
+  --palette-secondary-soft-subtle-bg-hover: oklab(0.81426 0 0);
+  --palette-secondary-soft-subtle-edge-hover: oklab(0.424191 0 0);
+  --palette-secondary-ghost-fg: oklab(0.269 0 0);
+  --palette-secondary-ghost-bg: oklab(0 0 0 / 0);
+  --palette-secondary-ghost-edge: oklab(0.439 0 0);
+  --palette-secondary-ghost-bg-hover: oklab(0.371 0 0 / 0.14);
+  --palette-secondary-ghost-edge-hover: oklab(0.371 0 0);
+  --palette-secondary-ghost-page-bg: oklab(0.985 0 0);
+  --palette-secondary-ghost-page-edge: oklab(0.439 0 0);
+  --palette-secondary-ghost-page-bg-hover: oklab(0.89904 0 0);
+  --palette-secondary-ghost-page-edge-hover: oklab(0.371 0 0);
+  --palette-secondary-ghost-subtle-bg: oklab(0.97 0 0);
+  --palette-secondary-ghost-subtle-edge: oklab(0.439 0 0);
+  --palette-secondary-ghost-subtle-bg-hover: oklab(0.88614 0 0);
+  --palette-secondary-ghost-subtle-edge-hover: oklab(0.371 0 0);
+  --palette-success-solid-bg: oklab(0.508 -0.114299 0.0293215);
+  --palette-success-solid-fg: oklab(0.985 0 0);
+  --palette-success-solid-edge: oklab(0.508 -0.114299 0.0293215);
+  --palette-success-solid-bg-hover: oklab(0.497872 -0.101989 0.029308);
+  --palette-success-solid-edge-hover: oklab(0.497872 -0.101989 0.029308);
+  --palette-success-soft-fg: oklab(0.432 -0.0925326 0.0215109);
+  --palette-success-soft-bg: oklab(0.508 -0.114299 0.0293215 / 0.12);
+  --palette-success-soft-edge: oklab(0.508 -0.114299 0.0293215 / 0.8944);
+  --palette-success-soft-bg-hover: oklab(0.497872 -0.101989 0.029308 / 0.26);
+  --palette-success-soft-edge-hover: oklab(0.497872 -0.101989 0.029308 / 0.9112);
+  --palette-success-soft-page-bg: oklab(0.92776 -0.0137159 0.00351857);
+  --palette-success-soft-page-edge: oklab(0.558371 -0.102229 0.0262251);
+  --palette-success-soft-page-bg-hover: oklab(0.858347 -0.0265171 0.00762008);
+  --palette-success-soft-page-edge-hover: oklab(0.541129 -0.0929323 0.0267054);
+  --palette-success-soft-subtle-bg: oklab(0.89696 -0.0574883 0.0168585);
+  --palette-success-soft-subtle-edge: oklab(0.554675 -0.107482 0.0278259);
+  --palette-success-soft-subtle-bg-hover: oklab(0.832447 -0.0633257 0.0188378);
+  --palette-success-soft-subtle-edge-hover: oklab(0.538021 -0.0973493 0.0280516);
+  --palette-success-ghost-fg: oklab(0.432 -0.0925326 0.0215109);
+  --palette-success-ghost-bg: oklab(0 0 0 / 0);
+  --palette-success-ghost-edge: oklab(0.508 -0.114299 0.0293215);
+  --palette-success-ghost-bg-hover: oklab(0.497872 -0.101989 0.029308 / 0.14);
+  --palette-success-ghost-edge-hover: oklab(0.497872 -0.101989 0.029308);
+  --palette-success-ghost-page-bg: oklab(0.985 0 0);
+  --palette-success-ghost-page-edge: oklab(0.508 -0.114299 0.0293215);
+  --palette-success-ghost-page-bg-hover: oklab(0.916802 -0.0142784 0.00410312);
+  --palette-success-ghost-page-edge-hover: oklab(0.497872 -0.101989 0.029308);
+  --palette-success-ghost-subtle-bg: oklab(0.95 -0.0497414 0.0151591);
+  --palette-success-ghost-subtle-edge: oklab(0.508 -0.114299 0.0293215);
+  --palette-success-ghost-subtle-bg-hover: oklab(0.886702 -0.057056 0.0171399);
+  --palette-success-ghost-subtle-edge-hover: oklab(0.497872 -0.101989 0.029308);
+  --palette-warning-solid-bg: oklab(0.666 0.0940116 0.152325);
+  --palette-warning-solid-fg: oklab(0.145 0 0);
+  --palette-warning-solid-edge: oklab(0.666 0.0940116 0.152325);
+  --palette-warning-solid-bg-hover: oklab(0.633155 0.100794 0.128308);
+  --palette-warning-solid-edge-hover: oklab(0.633155 0.100794 0.128308);
+  --palette-warning-soft-fg: oklab(0.473 0.0948219 0.0988828);
+  --palette-warning-soft-bg: oklab(0.666 0.0940116 0.152325 / 0.12);
+  --palette-warning-soft-edge: oklab(0.666 0.0940116 0.152325 / 0.8944);
+  --palette-warning-soft-bg-hover: oklab(0.633155 0.100794 0.128308 / 0.26);
+  --palette-warning-soft-edge-hover: oklab(0.633155 0.100794 0.128308 / 0.9112);
+  --palette-warning-soft-page-bg: oklab(0.94672 0.0112814 0.018279);
+  --palette-warning-soft-page-edge: oklab(0.699686 0.0840839 0.136239);
+  --palette-warning-soft-page-bg-hover: oklab(0.89352 0.0262064 0.0333601);
+  --palette-warning-soft-page-edge-hover: oklab(0.664399 0.0918435 0.116914);
+  --palette-warning-soft-subtle-bg: oklab(0.92648 0.00619956 0.0699497);
+  --palette-warning-soft-subtle-edge: oklab(0.697258 0.0834741 0.14244);
+  --palette-warning-soft-subtle-bg-hover: oklab(0.8765 0.0219331 0.0768105);
+  --palette-warning-soft-subtle-edge-hover: oklab(0.662356 0.0913307 0.122128);
+  --palette-warning-ghost-fg: oklab(0.473 0.0948219 0.0988828);
+  --palette-warning-ghost-bg: oklab(0 0 0 / 0);
+  --palette-warning-ghost-edge: oklab(0.666 0.0940116 0.152325);
+  --palette-warning-ghost-bg-hover: oklab(0.633155 0.100794 0.128308 / 0.14);
+  --palette-warning-ghost-edge-hover: oklab(0.633155 0.100794 0.128308);
+  --palette-warning-ghost-page-bg: oklab(0.985 0 0);
+  --palette-warning-ghost-page-edge: oklab(0.666 0.0940116 0.152325);
+  --palette-warning-ghost-page-bg-hover: oklab(0.935742 0.0141112 0.0179631);
+  --palette-warning-ghost-page-edge-hover: oklab(0.633155 0.100794 0.128308);
+  --palette-warning-ghost-subtle-bg: oklab(0.962 -0.0057748 0.0587167);
+  --palette-warning-ghost-subtle-edge: oklab(0.666 0.0940116 0.152325);
+  --palette-warning-ghost-subtle-bg-hover: oklab(0.915962 0.00914482 0.0684595);
+  --palette-warning-ghost-subtle-edge-hover: oklab(0.633155 0.100794 0.128308);
+  --palette-destructive-solid-bg: oklab(0.514 0.212373 0.0646656);
+  --palette-destructive-solid-fg: oklab(0.985 0 0);
+  --palette-destructive-solid-edge: oklab(0.514 0.212373 0.0646656);
+  --palette-destructive-solid-bg-hover: oklab(0.51189 0.194868 0.0640785);
+  --palette-destructive-solid-edge-hover: oklab(0.51189 0.194868 0.0640785);
+  --palette-destructive-soft-fg: oklab(0.455 0.182654 0.044516);
+  --palette-destructive-soft-bg: oklab(0.514 0.212373 0.0646656 / 0.12);
+  --palette-destructive-soft-edge: oklab(0.514 0.212373 0.0646656 / 0.8944);
+  --palette-destructive-soft-bg-hover: oklab(0.51189 0.194868 0.0640785 / 0.26);
+  --palette-destructive-soft-edge-hover: oklab(0.51189 0.194868 0.0640785 / 0.9112);
+  --palette-destructive-soft-page-bg: oklab(0.92848 0.0254848 0.00775988);
+  --palette-destructive-soft-page-edge: oklab(0.563738 0.189947 0.0578369);
+  --palette-destructive-soft-page-bg-hover: oklab(0.861991 0.0506656 0.0166604);
+  --palette-destructive-soft-page-edge-hover: oklab(0.553902 0.177564 0.0583884);
+  --palette-destructive-soft-subtle-bg: oklab(0.88976 0.051251 0.0135099);
+  --palette-destructive-soft-subtle-edge: oklab(0.559091 0.193038 0.0585269);
+  --palette-destructive-soft-subtle-bg-hover: oklab(0.829431 0.0723327 0.0214956);
+  --palette-destructive-soft-subtle-edge-hover: oklab(0.549995 0.180164 0.0589686);
+  --palette-destructive-ghost-fg: oklab(0.455 0.182654 0.044516);
+  --palette-destructive-ghost-bg: oklab(0 0 0 / 0);
+  --palette-destructive-ghost-edge: oklab(0.514 0.212373 0.0646656);
+  --palette-destructive-ghost-bg-hover: oklab(0.51189 0.194868 0.0640785 / 0.14);
+  --palette-destructive-ghost-edge-hover: oklab(0.51189 0.194868 0.0640785);
+  --palette-destructive-ghost-page-bg: oklab(0.985 0 0);
+  --palette-destructive-ghost-page-edge: oklab(0.514 0.212373 0.0646656);
+  --palette-destructive-ghost-page-bg-hover: oklab(0.918765 0.0272815 0.00897099);
+  --palette-destructive-ghost-page-edge-hover: oklab(0.51189 0.194868 0.0640785);
+  --palette-destructive-ghost-subtle-bg: oklab(0.941 0.0292798 0.00653408);
+  --palette-destructive-ghost-subtle-edge: oklab(0.514 0.212373 0.0646656);
+  --palette-destructive-ghost-subtle-bg-hover: oklab(0.880925 0.0524621 0.0145903);
+  --palette-destructive-ghost-subtle-edge-hover: oklab(0.51189 0.194868 0.0640785);
+  --palette-info-solid-bg: oklab(0.511 0.0317755 -0.260066);
+  --palette-info-solid-fg: oklab(0.985 0 0);
+  --palette-info-solid-edge: oklab(0.511 0.0317755 -0.260066);
+  --palette-info-solid-bg-hover: oklab(0.490714 0.0309565 -0.24875);
+  --palette-info-solid-edge-hover: oklab(0.490714 0.0309565 -0.24875);
+  --palette-info-soft-fg: oklab(0.398 0.0250004 -0.193391);
+  --palette-info-soft-bg: oklab(0.511 0.0317755 -0.260066 / 0.12);
+  --palette-info-soft-edge: oklab(0.511 0.0317755 -0.260066 / 0.8944);
+  --palette-info-soft-bg-hover: oklab(0.490714 0.0309565 -0.24875 / 0.26);
+  --palette-info-soft-edge-hover: oklab(0.490714 0.0309565 -0.24875 / 0.9112);
+  --palette-info-soft-page-bg: oklab(0.92812 0.00381305 -0.0312079);
+  --palette-info-soft-page-edge: oklab(0.561054 0.02842 -0.232603);
+  --palette-info-soft-page-bg-hover: oklab(0.856486 0.0080487 -0.0646751);
+  --palette-info-soft-page-edge-hover: oklab(0.534607 0.0282076 -0.226661);
+  --palette-info-soft-subtle-bg: oklab(0.87972 0.00526838 -0.0610925);
+  --palette-info-soft-subtle-edge: oklab(0.555246 0.0285946 -0.236189);
+  --palette-info-soft-subtle-bg-hover: oklab(0.815786 0.0092725 -0.0898053);
+  --palette-info-soft-subtle-edge-hover: oklab(0.529723 0.0283545 -0.229677);
+  --palette-info-ghost-fg: oklab(0.398 0.0250004 -0.193391);
+  --palette-info-ghost-bg: oklab(0 0 0 / 0);
+  --palette-info-ghost-edge: oklab(0.511 0.0317755 -0.260066);
+  --palette-info-ghost-bg-hover: oklab(0.490714 0.0309565 -0.24875 / 0.14);
+  --palette-info-ghost-edge-hover: oklab(0.490714 0.0309565 -0.24875);
+  --palette-info-ghost-page-bg: oklab(0.985 0 0);
+  --palette-info-ghost-page-edge: oklab(0.511 0.0317755 -0.260066);
+  --palette-info-ghost-page-bg-hover: oklab(0.9158 0.00433391 -0.034825);
+  --palette-info-ghost-page-edge-hover: oklab(0.490714 0.0309565 -0.24875);
+  --palette-info-ghost-subtle-bg: oklab(0.93 0.00165378 -0.0339598);
+  --palette-info-ghost-subtle-edge: oklab(0.511 0.0317755 -0.260066);
+  --palette-info-ghost-subtle-bg-hover: oklab(0.8685 0.00575617 -0.0640304);
+  --palette-info-ghost-subtle-edge-hover: oklab(0.490714 0.0309565 -0.24875);
+  --palette-border: oklch(0.708 0 0);
+  --palette-surface: oklch(0.922 0 0);
+  --palette-text: oklch(0.145 0 0);
+}
+
+.dark,
+.theme-dark,
+[data-theme="dark"] {
+  --palette-neutral-solid-bg: oklab(0.985 0 0 / 0.2);
+  --palette-neutral-solid-fg: oklab(0.97 0 0);
+  --palette-neutral-solid-edge: oklab(0.985 0 0 / 0.2);
+  --palette-neutral-solid-bg-hover: oklab(0.922 0 0 / 0.34);
+  --palette-neutral-solid-edge-hover: oklab(0.922 0 0 / 0.34);
+  --palette-neutral-soft-fg: oklab(0.97 0 0);
+  --palette-neutral-soft-bg: oklab(0.985 0 0 / 0.12);
+  --palette-neutral-soft-edge: oklab(0.380886 0 0 / 0.8944);
+  --palette-neutral-soft-bg-hover: oklab(0.922 0 0 / 0.26);
+  --palette-neutral-soft-edge-hover: oklab(0.922 0 0 / 0.9112);
+  --palette-neutral-soft-page-bg: oklab(0.2458 0 0);
+  --palette-neutral-soft-page-edge: oklab(0.355976 0 0);
+  --palette-neutral-soft-page-bg-hover: oklab(0.34702 0 0);
+  --palette-neutral-soft-page-edge-hover: oklab(0.853002 0 0);
+  --palette-neutral-soft-subtle-bg: oklab(0.35492 0 0);
+  --palette-neutral-soft-subtle-edge: oklab(0.36907 0 0);
+  --palette-neutral-soft-subtle-bg-hover: oklab(0.43878 0 0);
+  --palette-neutral-soft-subtle-edge-hover: oklab(0.864014 0 0);
+  --palette-neutral-ghost-fg: oklab(0.97 0 0);
+  --palette-neutral-ghost-bg: oklab(0 0 0 / 0);
+  --palette-neutral-ghost-edge: oklab(0.371 0 0);
+  --palette-neutral-ghost-bg-hover: oklab(0.922 0 0 / 0.14);
+  --palette-neutral-ghost-edge-hover: oklab(0.922 0 0);
+  --palette-neutral-ghost-page-bg: oklab(0.145 0 0);
+  --palette-neutral-ghost-page-edge: oklab(0.371 0 0);
+  --palette-neutral-ghost-page-bg-hover: oklab(0.25378 0 0);
+  --palette-neutral-ghost-page-edge-hover: oklab(0.922 0 0);
+  --palette-neutral-ghost-subtle-bg: oklab(0.269 0 0);
+  --palette-neutral-ghost-subtle-edge: oklab(0.371 0 0);
+  --palette-neutral-ghost-subtle-bg-hover: oklab(0.36042 0 0);
+  --palette-neutral-ghost-subtle-edge-hover: oklab(0.922 0 0);
+  --palette-primary-solid-bg: oklab(0.985 0 0);
+  --palette-primary-solid-fg: oklab(0.145 0 0);
+  --palette-primary-solid-edge: oklab(0.985 0 0);
+  --palette-primary-solid-bg-hover: oklab(0.922 0 0);
+  --palette-primary-solid-edge-hover: oklab(0.922 0 0);
+  --palette-primary-soft-fg: oklab(0.97 0 0);
+  --palette-primary-soft-bg: oklab(0.985 0 0 / 0.12);
+  --palette-primary-soft-edge: oklab(0.985 0 0 / 0.8944);
+  --palette-primary-soft-bg-hover: oklab(0.922 0 0 / 0.26);
+  --palette-primary-soft-edge-hover: oklab(0.922 0 0 / 0.9112);
+  --palette-primary-soft-page-bg: oklab(0.2458 0 0);
+  --palette-primary-soft-page-edge: oklab(0.896296 0 0);
+  --palette-primary-soft-page-bg-hover: oklab(0.34702 0 0);
+  --palette-primary-soft-page-edge-hover: oklab(0.853002 0 0);
+  --palette-primary-soft-subtle-bg: oklab(0.2986 0 0);
+  --palette-primary-soft-subtle-edge: oklab(0.902632 0 0);
+  --palette-primary-soft-subtle-bg-hover: oklab(0.39142 0 0);
+  --palette-primary-soft-subtle-edge-hover: oklab(0.85833 0 0);
+  --palette-primary-ghost-fg: oklab(0.97 0 0);
+  --palette-primary-ghost-bg: oklab(0 0 0 / 0);
+  --palette-primary-ghost-edge: oklab(0.985 0 0);
+  --palette-primary-ghost-bg-hover: oklab(0.922 0 0 / 0.14);
+  --palette-primary-ghost-edge-hover: oklab(0.922 0 0);
+  --palette-primary-ghost-page-bg: oklab(0.145 0 0);
+  --palette-primary-ghost-page-edge: oklab(0.985 0 0);
+  --palette-primary-ghost-page-bg-hover: oklab(0.25378 0 0);
+  --palette-primary-ghost-page-edge-hover: oklab(0.922 0 0);
+  --palette-primary-ghost-subtle-bg: oklab(0.205 0 0);
+  --palette-primary-ghost-subtle-edge: oklab(0.985 0 0);
+  --palette-primary-ghost-subtle-bg-hover: oklab(0.30538 0 0);
+  --palette-primary-ghost-subtle-edge-hover: oklab(0.922 0 0);
+  --palette-secondary-solid-bg: oklab(0.708 0 0);
+  --palette-secondary-solid-fg: oklab(0.145 0 0);
+  --palette-secondary-solid-edge: oklab(0.708 0 0);
+  --palette-secondary-solid-bg-hover: oklab(0.87 0 0);
+  --palette-secondary-solid-edge-hover: oklab(0.87 0 0);
+  --palette-secondary-soft-fg: oklab(0.922 0 0);
+  --palette-secondary-soft-bg: oklab(0.708 0 0 / 0.12);
+  --palette-secondary-soft-edge: oklab(0.708 0 0 / 0.8944);
+  --palette-secondary-soft-bg-hover: oklab(0.87 0 0 / 0.26);
+  --palette-secondary-soft-edge-hover: oklab(0.87 0 0 / 0.9112);
+  --palette-secondary-soft-page-bg: oklab(0.21256 0 0);
+  --palette-secondary-soft-page-edge: oklab(0.648547 0 0);
+  --palette-secondary-soft-page-bg-hover: oklab(0.3335 0 0);
+  --palette-secondary-soft-page-edge-hover: oklab(0.80562 0 0);
+  --palette-secondary-soft-subtle-bg: oklab(0.32168 0 0);
+  --palette-secondary-soft-subtle-edge: oklab(0.661642 0 0);
+  --palette-secondary-soft-subtle-bg-hover: oklab(0.42526 0 0);
+  --palette-secondary-soft-subtle-edge-hover: oklab(0.816631 0 0);
+  --palette-secondary-ghost-fg: oklab(0.922 0 0);
+  --palette-secondary-ghost-bg: oklab(0 0 0 / 0);
+  --palette-secondary-ghost-edge: oklab(0.708 0 0);
+  --palette-secondary-ghost-bg-hover: oklab(0.87 0 0 / 0.14);
+  --palette-secondary-ghost-edge-hover: oklab(0.87 0 0);
+  --palette-secondary-ghost-page-bg: oklab(0.145 0 0);
+  --palette-secondary-ghost-page-edge: oklab(0.708 0 0);
+  --palette-secondary-ghost-page-bg-hover: oklab(0.2465 0 0);
+  --palette-secondary-ghost-page-edge-hover: oklab(0.87 0 0);
+  --palette-secondary-ghost-subtle-bg: oklab(0.269 0 0);
+  --palette-secondary-ghost-subtle-edge: oklab(0.708 0 0);
+  --palette-secondary-ghost-subtle-bg-hover: oklab(0.35314 0 0);
+  --palette-secondary-ghost-subtle-edge-hover: oklab(0.87 0 0);
+  --palette-success-solid-bg: oklab(0.508 -0.114299 0.0293215);
+  --palette-success-solid-fg: oklab(0.985 0 0);
+  --palette-success-solid-edge: oklab(0.508 -0.114299 0.0293215);
+  --palette-success-solid-bg-hover: oklab(0.572945 -0.116429 0.0314383);
+  --palette-success-solid-edge-hover: oklab(0.572945 -0.116429 0.0314383);
+  --palette-success-soft-fg: oklab(0.845 -0.138113 0.0370641);
+  --palette-success-soft-bg: oklab(0.508 -0.114299 0.0293215 / 0.12);
+  --palette-success-soft-edge: oklab(0.508 -0.114299 0.0293215 / 0.8944);
+  --palette-success-soft-bg-hover: oklab(0.572945 -0.116429 0.0314383 / 0.26);
+  --palette-success-soft-edge-hover: oklab(0.572945 -0.116429 0.0314383 / 0.9112);
+  --palette-success-soft-page-bg: oklab(0.18856 -0.0137159 0.00351857);
+  --palette-success-soft-page-edge: oklab(0.469667 -0.102229 0.0262251);
+  --palette-success-soft-page-bg-hover: oklab(0.256266 -0.0302715 0.00817395);
+  --palette-success-soft-page-edge-hover: oklab(0.534944 -0.10609 0.0286465);
+  --palette-success-soft-subtle-bg: oklab(0.3936 -0.0802174 0.0165174);
+  --palette-success-soft-subtle-edge: oklab(0.494272 -0.110209 0.027785);
+  --palette-success-soft-subtle-bg-hover: oklab(0.428686 -0.0861932 0.0191048);
+  --palette-success-soft-subtle-edge-hover: oklab(0.555634 -0.1128 0.0299582);
+  --palette-success-ghost-fg: oklab(0.845 -0.138113 0.0370641);
+  --palette-success-ghost-bg: oklab(0 0 0 / 0);
+  --palette-success-ghost-edge: oklab(0.508 -0.114299 0.0293215);
+  --palette-success-ghost-bg-hover: oklab(0.572945 -0.116429 0.0314383 / 0.14);
+  --palette-success-ghost-edge-hover: oklab(0.572945 -0.116429 0.0314383);
+  --palette-success-ghost-page-bg: oklab(0.145 0 0);
+  --palette-success-ghost-page-edge: oklab(0.508 -0.114299 0.0293215);
+  --palette-success-ghost-page-bg-hover: oklab(0.204912 -0.0163 0.00440136);
+  --palette-success-ghost-page-edge-hover: oklab(0.572945 -0.116429 0.0314383);
+  --palette-success-ghost-subtle-bg: oklab(0.378 -0.0755699 0.0147714);
+  --palette-success-ghost-subtle-edge: oklab(0.508 -0.114299 0.0293215);
+  --palette-success-ghost-subtle-bg-hover: oklab(0.405292 -0.0812901 0.0171048);
+  --palette-success-ghost-subtle-edge-hover: oklab(0.572945 -0.116429 0.0314383);
+  --palette-warning-solid-bg: oklab(0.666 0.0940116 0.152325);
+  --palette-warning-solid-fg: oklab(0.145 0 0);
+  --palette-warning-solid-edge: oklab(0.666 0.0940116 0.152325);
+  --palette-warning-solid-bg-hover: oklab(0.70431 0.0802 0.143076);
+  --palette-warning-solid-edge-hover: oklab(0.70431 0.0802 0.143076);
+  --palette-warning-soft-fg: oklab(0.879 -0.00473352 0.168934);
+  --palette-warning-soft-bg: oklab(0.666 0.0940116 0.152325 / 0.12);
+  --palette-warning-soft-edge: oklab(0.666 0.0940116 0.152325 / 0.8944);
+  --palette-warning-soft-bg-hover: oklab(0.70431 0.0802 0.143076 / 0.26);
+  --palette-warning-soft-edge-hover: oklab(0.70431 0.0802 0.143076 / 0.9112);
+  --palette-warning-soft-page-bg: oklab(0.20752 0.0112814 0.018279);
+  --palette-warning-soft-page-edge: oklab(0.610982 0.0840839 0.136239);
+  --palette-warning-soft-page-bg-hover: oklab(0.290421 0.020852 0.0371997);
+  --palette-warning-soft-page-edge-hover: oklab(0.654644 0.0730783 0.130371);
+  --palette-warning-soft-subtle-bg: oklab(0.44424 0.0798656 0.0890623);
+  --palette-warning-soft-subtle-edge: oklab(0.639389 0.092314 0.144733);
+  --palette-warning-soft-subtle-bg-hover: oklab(0.489481 0.0785251 0.0967221);
+  --palette-warning-soft-subtle-edge-hover: oklab(0.678531 0.079999 0.137513);
+  --palette-warning-ghost-fg: oklab(0.879 -0.00473352 0.168934);
+  --palette-warning-ghost-bg: oklab(0 0 0 / 0);
+  --palette-warning-ghost-edge: oklab(0.666 0.0940116 0.152325);
+  --palette-warning-ghost-bg-hover: oklab(0.70431 0.0802 0.143076 / 0.14);
+  --palette-warning-ghost-edge-hover: oklab(0.70431 0.0802 0.143076);
+  --palette-warning-ghost-page-bg: oklab(0.145 0 0);
+  --palette-warning-ghost-page-edge: oklab(0.666 0.0940116 0.152325);
+  --palette-warning-ghost-page-bg-hover: oklab(0.223303 0.011228 0.0200306);
+  --palette-warning-ghost-page-edge-hover: oklab(0.70431 0.0802 0.143076);
+  --palette-warning-ghost-subtle-bg: oklab(0.414 0.0779366 0.0804356);
+  --palette-warning-ghost-subtle-edge: oklab(0.666 0.0940116 0.152325);
+  --palette-warning-ghost-subtle-bg-hover: oklab(0.454643 0.0782535 0.0892052);
+  --palette-warning-ghost-subtle-edge-hover: oklab(0.70431 0.0802 0.143076);
+  --palette-destructive-solid-bg: oklab(0.514 0.212373 0.0646656);
+  --palette-destructive-solid-fg: oklab(0.985 0 0);
+  --palette-destructive-solid-edge: oklab(0.514 0.212373 0.0646656);
+  --palette-destructive-solid-bg-hover: oklab(0.549356 0.21195 0.0500346);
+  --palette-destructive-solid-edge-hover: oklab(0.549356 0.21195 0.0500346);
+  --palette-destructive-soft-fg: oklab(0.81 0.114595 0.0236021);
+  --palette-destructive-soft-bg: oklab(0.514 0.212373 0.0646656 / 0.12);
+  --palette-destructive-soft-edge: oklab(0.514 0.212373 0.0646656 / 0.8944);
+  --palette-destructive-soft-bg-hover: oklab(0.549356 0.21195 0.0500346 / 0.26);
+  --palette-destructive-soft-edge-hover: oklab(0.549356 0.21195 0.0500346 / 0.9112);
+  --palette-destructive-soft-page-bg: oklab(0.18928 0.0254848 0.00775988);
+  --palette-destructive-soft-page-edge: oklab(0.475034 0.189947 0.0578369);
+  --palette-destructive-soft-page-bg-hover: oklab(0.250132 0.0551069 0.013009);
+  --palette-destructive-soft-page-edge-hover: oklab(0.513449 0.193128 0.0455916);
+  --palette-destructive-soft-subtle-bg: oklab(0.42248 0.163162 0.0327106);
+  --palette-destructive-soft-subtle-edge: oklab(0.503018 0.206468 0.060831);
+  --palette-destructive-soft-subtle-bg-hover: oklab(0.446232 0.170881 0.0339903);
+  --palette-destructive-soft-subtle-edge-hover: oklab(0.536981 0.207021 0.0481093);
+  --palette-destructive-ghost-fg: oklab(0.81 0.114595 0.0236021);
+  --palette-destructive-ghost-bg: oklab(0 0 0 / 0);
+  --palette-destructive-ghost-edge: oklab(0.514 0.212373 0.0646656);
+  --palette-destructive-ghost-bg-hover: oklab(0.549356 0.21195 0.0500346 / 0.14);
+  --palette-destructive-ghost-edge-hover: oklab(0.549356 0.21195 0.0500346);
+  --palette-destructive-ghost-page-bg: oklab(0.145 0 0);
+  --palette-destructive-ghost-page-edge: oklab(0.514 0.212373 0.0646656);
+  --palette-destructive-ghost-page-bg-hover: oklab(0.20161 0.0296729 0.00700485);
+  --palette-destructive-ghost-page-edge-hover: oklab(0.549356 0.21195 0.0500346);
+  --palette-destructive-ghost-subtle-bg: oklab(0.41 0.156452 0.0283531);
+  --palette-destructive-ghost-subtle-edge: oklab(0.514 0.212373 0.0646656);
+  --palette-destructive-ghost-subtle-bg-hover: oklab(0.42951 0.164221 0.0313885);
+  --palette-destructive-ghost-subtle-edge-hover: oklab(0.549356 0.21195 0.0500346);
+  --palette-info-solid-bg: oklab(0.511 0.0317755 -0.260066);
+  --palette-info-solid-fg: oklab(0.985 0 0);
+  --palette-info-solid-edge: oklab(0.511 0.0317755 -0.260066);
+  --palette-info-solid-bg-hover: oklab(0.551929 0.0373722 -0.238521);
+  --palette-info-solid-edge-hover: oklab(0.551929 0.0373722 -0.238521);
+  --palette-info-soft-fg: oklab(0.785 0.00944898 -0.114611);
+  --palette-info-soft-bg: oklab(0.511 0.0317755 -0.260066 / 0.12);
+  --palette-info-soft-edge: oklab(0.511 0.0317755 -0.260066 / 0.8944);
+  --palette-info-soft-bg-hover: oklab(0.551929 0.0373722 -0.238521 / 0.26);
+  --palette-info-soft-edge-hover: oklab(0.551929 0.0373722 -0.238521 / 0.9112);
+  --palette-info-soft-page-bg: oklab(0.18892 0.00381305 -0.0312079);
+  --palette-info-soft-page-edge: oklab(0.47235 0.02842 -0.232603);
+  --palette-info-soft-page-bg-hover: oklab(0.250801 0.00971677 -0.0620155);
+  --palette-info-soft-page-edge-hover: oklab(0.515793 0.0340535 -0.217341);
+  --palette-info-soft-subtle-bg: oklab(0.37724 0.0229742 -0.156471);
+  --palette-info-soft-subtle-edge: oklab(0.494949 0.0307193 -0.247635);
+  --palette-info-soft-subtle-bg-hover: oklab(0.409161 0.0258296 -0.16735);
+  --palette-info-soft-subtle-edge-hover: oklab(0.534797 0.0359871 -0.229981);
+  --palette-info-ghost-fg: oklab(0.785 0.00944898 -0.114611);
+  --palette-info-ghost-bg: oklab(0 0 0 / 0);
+  --palette-info-ghost-edge: oklab(0.511 0.0317755 -0.260066);
+  --palette-info-ghost-bg-hover: oklab(0.551929 0.0373722 -0.238521 / 0.14);
+  --palette-info-ghost-edge-hover: oklab(0.551929 0.0373722 -0.238521);
+  --palette-info-ghost-page-bg: oklab(0.145 0 0);
+  --palette-info-ghost-page-edge: oklab(0.511 0.0317755 -0.260066);
+  --palette-info-ghost-page-bg-hover: oklab(0.20197 0.00523211 -0.033393);
+  --palette-info-ghost-page-edge-hover: oklab(0.551929 0.0373722 -0.238521);
+  --palette-info-ghost-subtle-bg: oklab(0.359 0.0217741 -0.142344);
+  --palette-info-ghost-subtle-edge: oklab(0.511 0.0317755 -0.260066);
+  --palette-info-ghost-subtle-bg-hover: oklab(0.38601 0.0239578 -0.155809);
+  --palette-info-ghost-subtle-edge-hover: oklab(0.551929 0.0373722 -0.238521);
+  --palette-border: oklch(0.371 0 0);
+  --palette-surface: oklch(0.269 0 0);
+  --palette-text: oklch(0.985 0 0);
+}

package/dist/tw/theme.css

@@ -35,7 +35,6 @@
      page and picked it for the same reason, "the heaviest grey that still
      leaves a field legible." Dark is unchanged. */
   --color-border: light-dark(var(--color-neutral-400), var(--color-neutral-700));
-  --color-border-hover: light-dark(var(--color-neutral-600), var(--color-neutral-500));
 
   /* A text control's line is the only thing identifying it: the box is
      transparent at rest, so nothing else marks where typing goes.
@@ -138,6 +137,20 @@
   --breakpoint-2xl: 90rem;
 }
 
+/* Tailwind only keeps a `@theme` variable in the compiled output when it
+   detects that variable being used somewhere in this package's own source --
+   everything above earns its keep that way, through `intent.css` or a
+   component reading it. `--color-border-hover` is different: `docs/usage/
+   theming.md` documents it as a public override point like every other row
+   in that table, but nothing in this package draws a border that darkens on
+   hover, so nothing here ever references it, and Tailwind quietly dropped it
+   from every compiled stylesheet. `static` forces it to compile regardless,
+   so the token a consumer's docs promise is the token their `var()` actually
+   resolves. */
+@theme static {
+  --color-border-hover: light-dark(var(--color-neutral-600), var(--color-neutral-500));
+}
+
 :root {
   /* Both keywords: the system preference decides, and the explicit theme
      selectors below override it at any depth because `color-scheme` inherits. */