@godxjp/ui 19.1.0 → 19.3.1

package/dist/tokens/components/table.css

@@ -1,4 +1,4 @@
-/* Table component tokens: row height, cell padding. */
+
 
 :root {
   --table-row-height-compact: var(--band-height-sm);
@@ -7,140 +7,48 @@
   --table-row-height: calc(var(--table-row-height-default) * var(--scaling));
   --table-cell-padding-y: var(--space-2);
   --table-cell-space-x: var(--control-padding-x);
-  /* Pagination footer inset (gh#236). The footer ships as a SELF-CONTAINED slot and is commonly
-   * placed in a flush container (`<Card><CardContent flush><DataTable/>`), where no ancestor
-   * supplies padding — so it owns its own on BOTH axes instead of declaring block-start only.
-   * Block default = the previous single `padding-top` value, now on both block edges (breathing
-   * room above the footer and before the container's closing border). Inline default = the cell
-   * inline padding, so the "rows per page" label sits on the same optical axis as the first
-   * column's text. A service retunes either axis to its own grid (#45).
-   * Both are declared `initial` so the defaults re-resolve at the CALL SITE: --space-stack-sm and
-   * --table-cell-space-x are density-scaled and re-declared inside a `.ui-density-*` subtree, and a
-   * :root binding would freeze the footer at the :root density (docs/TOKENS.md — the :root freeze
-   * rule). Defaults = var(--space-stack-sm) block · var(--table-cell-space-x) inline. */
-  /* Cell-grid rule colour for `<Table bordered>` (gh#274) — the outer frame and the vertical
-   * rules between columns. Declared `initial` so the default re-resolves to the LIVE --border
-   * role at the call site (a :root binding to hsl(var(--border)) freezes at the :root value and
-   * a scoped [data-tenant] override of --border would never reach it — docs/TOKENS.md).
-   * Default = hsl(var(--border)). */
+
   --table-border-color: initial;
   --table-pagination-padding-y: initial;
   --table-pagination-padding-x: initial;
-  /* DataTable surface — narrow-viewport legibility FLOOR (gh#253). Below the `sm` viewport step a
-   * multi-column admin grid whose columns are `white-space: nowrap` would otherwise be crushed, so
-   * the bordered surface keeps a minimum inline size and `.ui-data-table-scroll` scrolls instead.
-   * This shipped as a hard-coded `min-w-[640px]` utility on the surface element, which left a
-   * service that wants a narrower (or no) floor with no route but forking the component (#45).
-   * Default = the previous literal, in px so the floor releases at EXACTLY the same width as the
-   * px-based `sm` media query that clears it (a rem value would drift under a non-16px root and
-   * re-introduce the scroll between the two thresholds). Set `0` to opt out entirely — which is
-   * what `preset="action-collection"` does, because there the priority measures own the width. */
+
   --table-surface-min-inline-size: 640px;
   --table-head-font-size: var(--font-size-xs);
-  /* Header band — its OWN bg + fg knobs (decoupled from --secondary). Declared `initial` so the
-   * default re-resolves to the LIVE --muted / --muted-foreground roles at the call site: a :root
-   * binding to a role var freezes at the :root value and a scoped [data-tenant] role override never
-   * reaches it. A brand sets both header tokens together to keep band/text contrast.
-   * Defaults = hsl(var(--muted)) band · hsl(var(--muted-foreground)) text. */
+
   --table-header-background: initial;
   --table-header-foreground: initial;
-  /* Inline-end shadow that lifts a pinned (sticky) action column off the body it scrolls over. */
+
   --table-pin-shadow: -6px 0 6px -5px hsl(var(--foreground) / 0.12);
-  /* Row-state tint washes — translucent muted over the opaque base. `initial` so the --muted
-   * default re-resolves under a scoped theme; a service retints by reading another role (e.g.
-   * --primary). Defaults = hsl(var(--muted) / 0.4 striped · 0.5 hover · 0.3 selected). */
+
   --table-row-striped-background: initial;
   --table-row-hover-background: initial;
   --table-row-selected-background: initial;
 }
 
-/* Table · action-collection preset (gh#253) — the canonical dense approval / action queue.
- * Column PRIORITY measures replace the desktop intrinsic widths (a nowrap free-text column is
- * what makes a five-column queue wider than its card and forces a horizontal scroll). Nothing
- * here is read unless `preset="action-collection"` is set, so every existing table is untouched.
- * Percentages so the ratio holds at any card width; the action affordance is an absolute measure
- * because it must never be squeezed below its touch target. */
 :root {
-  --table-action-collection-primary-width: 18%; /* requester / subject */
-  --table-action-collection-secondary-width: 22%; /* target / resource */
-  --table-action-collection-meta-width: 12%; /* timestamps, ids — lowest priority */
-  --table-action-collection-actions-width: 3.5rem; /* row-action affordance, never clipped */
-  /* Compact tier, applied below the collapse step (the 390px acceptance frame). Percentages,
-   * like the desktop tier: while the priority ratios FIT (the canonical queues up to the
-   * six-column budget below), they keep the table filling its container edge-to-edge with no
-   * horizontal scroll — the gh#253 acceptance. */
+  --table-action-collection-primary-width: 18%;
+  --table-action-collection-secondary-width: 22%;
+  --table-action-collection-meta-width: 12%;
+  --table-action-collection-actions-width: 3.5rem;
+
   --table-action-collection-primary-width-compact: 24%;
   --table-action-collection-secondary-width-compact: 22%;
   --table-action-collection-meta-width-compact: 20%;
   --table-action-collection-actions-width-compact: 2.75rem;
-  /* Wide-collection FLOORS — the compact measures from SEVEN columns up (gh#262).
-   *
-   * Percentage measures stop working once a queue carries enough columns for the shares to sum
-   * past 100%: `table-layout: fixed` NORMALIZES them back into the table's specified width, so at
-   * ~10 columns on a 390px frame a "24%" column really renders at a tenth of the frame, every
-   * column drops below one CJK glyph, and JA headers shred into a vertical one-character-per-line
-   * column (the failure mode WCAG 2.2 SC 1.4.10 Reflow exists to prevent). Cell `min-inline-size`
-   * and `max(%, length)` widths are equally inert in the fixed algorithm, and the intrinsic
-   * (max-content) size of a fixed-layout table is degenerate — all verified in Chromium — so a
-   * LENGTH is the only floor an engine respects: length columns are never squeezed, and when
-   * their sum outgrows the container the table's used width grows past its specified 100%
-   * (CSS 2.1 §17.5.2.1) into the keyboard-reachable overflow-x wrapper, which scrolls.
-   * ONE-dimensional scrolling of a data table is explicitly permitted by SC 1.4.10;
-   * one-character-per-line is not readable at all.
-   *
-   * The stylesheet switches tiers on a COLUMN BUDGET, not on width: up to six columns the
-   * percentage ratios above still resolve to readable measures at every acceptance artboard
-   * (320 · 375 · 390), so the canonical five-column approval queue keeps its documented
-   * scroll-free 390 frame byte-for-byte; from seven columns the shares are guaranteed to
-   * over-sum and the floors + intentional scroll take over. That budget is the preset's
-   * documented column-count ceiling (gh#262 expectation 3): past six columns the preset stops
-   * compressing and starts scrolling.
-   *
-   * Units are rem, not ch: `ch` tracks the "0" glyph (~half a CJK em), so a ch-denominated floor
-   * would silently halve for the JA copy these floors exist to protect. At the compact type tier
-   * (font-size-xs = 0.75rem, space-2 inline padding each side) the 5rem meta floor keeps a ~4rem
-   * text measure = 5 full-width glyphs per line — a JA header wraps to two readable lines, never
-   * a character column. */
+
   --table-action-collection-primary-width-floor: 6rem;
   --table-action-collection-secondary-width-floor: 5.5rem;
   --table-action-collection-meta-width-floor: 5rem;
-  /* Floor for a column with NO `priority` (the free-text column, `auto` up to the budget). It
-   * cannot stay `auto` past the budget: once the marked columns over-constrain the table, the
-   * fixed algorithm hands an auto column exactly 0px (verified in Chromium) — the same
-   * shredding, moved to the free-text column. The actions floor is simply
-   * `--table-action-collection-actions-width-compact`, already an absolute measure. */
+
   --table-action-collection-flex-width-floor: 5rem;
   --table-action-collection-font-size-compact: var(--font-size-xs);
   --table-action-collection-cell-space-x-compact: var(--space-2);
   --table-action-collection-cell-padding-y-compact: var(--space-2);
   --table-action-collection-row-height-compact: var(--table-row-height-compact);
-  /* Compact-tier LEGIBILITY FLOOR — the measure below which the preset stops fitting the table
-   * to its container and lets the scroll region it already owns take over.
-   *
-   * The percentage budget above is sized for ONE column per priority tier plus one free-text
-   * column. A queue that repeats a tier — two `secondary` columns, three `meta` columns, or an
-   * unmarked column beside them — asks for more than 100%, and under `table-layout: fixed` the
-   * surplus is taken out of the columns rather than out of the table: measured on a seven-column
-   * Japanese admin queue at 390, every column landed at 44–59px and CJK labels wrapped at ONE to
-   * TWO characters per line (dxs-platform/platform#680). That is a WCAG 2.2 SC 1.4.10 Reflow (AA)
-   * failure, and it is the failure mode this floor removes.
-   *
-   * Scrolling is the correct escape, not a concession: SC 1.4.10 exempts "parts of the content
-   * which require two-dimensional layout for usage or meaning", and its own note names data
-   * tables as the example. A table that scrolls horizontally inside its card conforms; a table
-   * whose cells are one character wide does not.
-   *
-   * Default `0` so nothing changes for any existing consumer: a queue that fits its priority
-   * budget keeps fitting. A consumer whose queue carries more columns than the budget sets this
-   * to the measure at which its narrowest column is still readable (roughly 5rem per column for
-   * Japanese at the compact type tier) and the table scrolls instead of crushing. */
+
   --table-action-collection-min-inline-size-compact: 0;
 }
 
-/* Table · stacked-record-collection preset (gh#293 restore — SCR-215) — the canonical WIDE,
- * heterogeneous record collection. Below the collapse step every `<tr>` becomes a bordered
- * key-value card; these tokens own the card's own geometry (unlike action-collection, there is no
- * column-priority measure to retune — the whole row becomes one block). */
 :root {
   --table-stacked-collection-card-padding-y: var(--space-stack-sm);
   --table-stacked-collection-card-padding-x: var(--space-inline-md);
@@ -148,52 +56,23 @@
   --table-stacked-collection-cell-padding-y: var(--space-stack-xs);
   --table-stacked-collection-label-font-size: var(--font-size-xs);
 
-  /* DATA TABLE odds and ends that were still literal on the component (#319). The table's cell
-   * rhythm, widths and action-collection tiers were already tokenized; these are the pieces
-   * around them — the select column, sort glyphs, sticky header layer and skeleton shapes. */
   --table-select-column-width: 2.5rem;
   --table-sort-icon-size: var(--icon-size-xs);
   --table-toolbar-icon-size: var(--icon-size-md);
   --table-pagination-icon-size: var(--icon-size-md);
   --table-pagination-font-size: var(--font-size-sm);
-  /* Skeleton placeholders mimic the real content they stand in for: a checkbox square and a
-   * text line at the row's cap height. Retune with --table-cell-padding-y to keep the loading
-   * state the same height as the loaded one. */
+
   --table-skeleton-check-size: 1rem;
-  /* The skeleton bar's BLOCK SIZE. `--table-skeleton-line-height` was a length on the
-   * line-height axis, whose scale is unitless ratios (gh#324) — a mis-named height, and the
-   * only raw value on that axis, which is what kept the axis ungated. Renamed rather than
-   * left, with the old name kept as a DEPRECATED ALIAS: it is a published token a consumer
-   * theme may already override, and styles/table-layout.css still reads the old name, so an
-   * override of either spelling keeps working. Prefer the new name; the alias may be removed
-   * in a future major. */
+
   --table-skeleton-line-block-size: 1rem;
   --table-skeleton-line-height: var(--table-skeleton-line-block-size);
   --table-skeleton-radius: var(--radius-sm);
 
-  /* The table's own base type step (gh#319). Was a `text-sm` utility on the <table>; the theme
-   * remaps `--text-sm` to `--font-size-sm`, so this default is byte-identical. */
   --table-font-size: var(--font-size-sm);
-  /* MANDATORY companion to --table-font-size — the gh#260 trap, again. `text-sm` also set
-   * line-height from Tailwind's `--text-sm--line-height`, and styles/base.css remaps `--text-sm`
-   * but NOT that companion. Without this the table would silently inherit ambient page leading
-   * the moment the font-size moved into CSS. Same unitless ratio Tailwind ships. */
+
   --table-line-height: calc(1.25 / 0.875);
-  /* Horizontal row rule (chrome, #44) — the divider between body rows AND under the header row.
-   * Owned here rather than as TableRow's `border-b` utility so the "last row draws no rule"
-   * rule in `@layer components` can actually zero it; a utility would outrank it by layer.
-   * Colour is deliberately NOT set: it inherits the global `* { border-color: hsl(var(--border)) }`
-   * so a scoped [data-tenant]/.dark override of --border still reaches every row. */
+
   --table-row-border-width: var(--stroke-hairline);
-  /* Flush divider (chrome, #44/#45) — the ONE edge a full-bleed table keeps when it sits inside
-   * `<CardContent flush>`: the line between a plain CardHeader and the first row. The other three
-   * edges coincide with the card's own frame and are erased (gh#305); this one has nothing behind
-   * it, so without it the header band floats (gh#306). Scoped by construction to the case that
-   * needs it — a BANDED header, a CardBar or a headerless card already draw their own line there
-   * and never reach this token — so a service tunes only the plain-header divider: `0` for a
-   * borderless full-bleed table, heavier for a stronger band. Colour and style are NOT set here:
-   * only the width is restored, so the surface's own border declaration still owns them and a
-   * scoped [data-tenant]/.dark override of --border reaches it.
-   * Default = the same hairline the table's other rules draw. */
+
   --table-flush-divider-width: var(--table-row-border-width);
 }

package/dist/tokens/components/toggle.css

@@ -1,82 +1,20 @@
-/* TOGGLE — counter-pill + pressed-state knobs (gh#312).
- *
- * Toggle owns the pressed state; Button owns the counter-pill vocabulary (`count` /
- * `overflowCount` / `showZero`). A counted pressed chip (a faceted filter chip "Unread 12", a
- * reaction chip) needs both, so Toggle grew the same vocabulary — and these knobs exist so it
- * grows it WITHOUT growing a second, drifting set of constants (cardinal rule #45).
- *
- * SHARE vs SPLIT — the rule this file follows, and why each half falls where it does:
- *
- *   • GEOMETRY is genuinely the same pill — min-width, inline padding, type step, corner. Toggle
- *     keeps its OWN knob for each (rule #45) but sets it to Button's exact value off the same
- *     primitive scale token, and a test asserts the two stay equal — so a Toggle count set beside
- *     a Button count is indistinguishable and cannot drift unnoticed, while a service can still
- *     move one without the other.
- *
- *   • COLOUR is genuinely different, and MEASURED so. Button's pill sits on a static variant
- *     surface and tints itself with a translucent foreground (`bg-primary-foreground/15`,
- *     `bg-foreground/8`). Toggle's pill sits on a surface that INVERTS when pressed, and a
- *     translucent tint over it cannot clear WCAG 1.4.3 AA at the xs step: with the shipped roles,
- *     `--primary-foreground` over `--primary-foreground/0.16` over `--primary` measures 3.82:1 in
- *     light (4.39:1 even at 0.08 — the ceiling is the chip label's own 5.04:1, and any tint can
- *     only lower it), and `--muted-foreground` over `--foreground/0.08` measures 4.32:1, dropping
- *     to 3.64:1 once the chip hovers to `--accent`. Forcing a shared colour token here would ship
- *     a known #299-class failure.
- *
- *     So Toggle's pill uses OPAQUE role fills, which makes its contrast independent of the chip's
- *     variant and hover surface, and inverts them with the state:
- *       unpressed  --foreground on --muted              → 14.25:1 light · 12.40:1 dark
- *       pressed    --primary   on --primary-foreground  →  5.04:1 light ·  7.07:1 dark
- *     The pressed pair is the chip label's own pair, swapped — the pill is exactly as legible as
- *     the label it sits next to, never worse, under any theme that keeps that pair legible.
- *
- * Every colour knob is a ROLE-MIRROR knob: `initial` at :root with the role default at the call
- * site (docs/TOKENS.md · "Role-mirror knobs MUST be `initial`"). A `:root` binding to
- * `var(--primary)` would freeze at the :root value and a scoped `[data-tenant]`/`.dark` override
- * of the role would never reach it.
- */
+
 :root {
-  /* ── Counter pill · geometry. One knob per component (rule #45, and the repo's existing shape:
-   * --button-count-*, --tag-input-chip-font-size, --toggle-sm-font-size are all independent knobs
-   * off the same primitive scale). The VALUES are byte-identical to Button's counter pill and read
-   * the same primitive tokens, so the two pills render the same size and a Toggle count set beside
-   * a Button count is indistinguishable — asserted by
-   * src/styles/__tests__/toggle-count-token-parity.test.ts so it cannot drift silently.
-   *
-   * (They are concrete here rather than `initial` + a call-site `var(--toggle-…, var(--button-…))`
-   * fallback because check:typography requires a bare `var(--token)` for every font-size, and a
-   * split shape across the five geometry knobs would be worse than a consistent one.) */
+
   --toggle-count-min-width: var(--space-4);
   --toggle-count-space-inline: var(--space-1);
   --toggle-count-font-size: var(--font-size-xs);
   --toggle-count-radius: var(--radius-pill);
-  /* Quiet default (#44) — the toggle's own flex gap already separates label from pill; this knob
-   * ADDS to it for a service whose design grid wants the counter pushed further out. */
+
   --toggle-count-gap: 0;
 
-  /* ── Counter pill · unpressed colours. Defaults = hsl(var(--muted)) fill (quiet: 1.09:1 against
-   * the chip's own surface, so at rest the count reads as text, #44) and hsl(var(--foreground))
-   * text (14.25:1 on that fill). Opaque on purpose — a translucent fill would take its contrast
-   * from whatever surface the chip currently has, and lose ~0.7 on hover. */
   --toggle-count-background: initial;
   --toggle-count-color: initial;
 
-  /* ── Counter pill · PRESSED colours. Defaults = hsl(var(--primary-foreground)) fill,
-   * hsl(var(--primary)) text — the pressed chip's OWN pair, swapped. Not `--primary` on
-   * `--primary`: the pressed chip is already filled with --primary, so a --primary pill would be
-   * invisible on it. The swap also flips the pill from near-invisible to solid, which is one of
-   * the encodings that keeps the pressed state off colour alone (WCAG 1.4.1). */
   --toggle-pressed-count-background: initial;
   --toggle-pressed-count-color: initial;
 
-  /* ── Pressed chrome. Default = hsl(var(--primary)), i.e. the pressed fill itself, so out of the
-   * box this border is quiet (#44) and the pressed state is carried by the fill inversion + the
-   * pill inversion + the forced-colors rule below. A service whose pressed fill is a PALE tint
-   * (where those inversions get weak) opts into a visible outline by overriding this. */
   --toggle-pressed-border-color: initial;
 
-  /* Under forced-colors every fill is flattened to a system colour, so neither inversion encodes
-   * anything any more. This outline is the state's structural fallback there — drawn on the
-   * PRESSED pill only, and as `outline` (not `border`) so it costs no layout. */
   --toggle-count-forced-outline-width: var(--stroke-hairline);
 }

package/dist/tokens/components/upload.css

@@ -1,20 +1,7 @@
-/* Upload primitive tokens — dropzone, picture tile, avatar, draft bar, file row.
- *
- * Upload carried 66 hard-coded geometry/chrome literals, the single worst file in the library
- * (#319). It renders five variants (dropzone · button · picture · picture-card · avatar), and
- * EVERY one of them baked its box straight onto the component: a service could not resize the
- * avatar, retune the dropzone's generous 40px inset, or align the file row to its own grid
- * without forking. That is precisely the gap cardinal rule #45 exists to close.
- *
- * Radius defaults mirror the utilities they replace, verified against the built CSS:
- *   rounded-lg   = var(--radius)                            → --radius-lg
- *   rounded-md   = calc(var(--radius) / var(--radius-ratio)) → --radius-md
- *   rounded-full                                             → --radius-pill
- */
+
 
 :root {
-  /* DROPZONE — the large drag target. Its inset is deliberately generous; a dense service
-   * dials it back with one override instead of forking the variant. */
+
   --upload-dropzone-space-inset: var(--space-10);
   --upload-dropzone-radius: var(--radius-lg);
   --upload-dropzone-border-width: var(--stroke-md);
@@ -24,9 +11,6 @@
   --upload-dropzone-meta-space-block-start: var(--space-1);
   --upload-dropzone-meta-font-size: var(--font-size-xs);
 
-  /* TILE — the 96px square shared by picture-card thumbnails and the "add image" button.
-   * One knob resizes the whole gallery; picture-card grids are the most common thing a service
-   * re-grids to match its own column rhythm. */
   --upload-tile-size: 6rem;
   --upload-tile-radius: var(--radius-md);
   --upload-tile-space-gap: var(--space-3);
@@ -34,17 +18,14 @@
   --upload-tile-label-space-block-start: var(--space-1);
   --upload-tile-label-font-size: var(--font-size-xs);
   --upload-tile-overlay-font-size: var(--font-size-xs);
-  /* Busy scrim over a tile/frame — role-mirror knob, `initial` so --background re-resolves at the
-   * CALL SITE under a scoped [data-tenant]/.dark theme. Default = hsl(var(--background) / 0.7). */
+
   --upload-overlay-background: initial;
   --upload-overlay-alpha: 70%;
 
-  /* REMOVE affordance — the ✕ / trash chip pinned to a tile or avatar. */
   --upload-remove-space-inset: var(--space-1);
   --upload-remove-offset: var(--space-1);
   --upload-remove-icon-size: var(--icon-size-sm);
 
-  /* PICTURE — the single wide preview variant. */
   --upload-picture-max-width: 20rem;
   --upload-picture-radius: var(--radius-md);
   --upload-picture-preview-max-height: 12rem;
@@ -52,27 +33,22 @@
   --upload-picture-empty-label-space-block-start: var(--space-2);
   --upload-picture-empty-label-font-size: var(--font-size-sm);
   --upload-picture-overlay-font-size: var(--font-size-sm);
-  /* "Pending replace" chip. The radius previously came from a bare `rounded`, which resolves to a
-   * flat .25rem and so ignored the radius scale entirely — the exact shape of a rule #44 miss.
-   * It now follows the tile radius like every other chip in the component. */
+
   --upload-picture-badge-radius: var(--radius-md);
   --upload-picture-badge-offset: var(--space-2);
   --upload-picture-badge-space-inline: var(--space-2);
   --upload-picture-badge-space-block: 0.125rem;
   --upload-picture-badge-font-size: var(--font-size-xs);
 
-  /* AVATAR — the round single-image variant. */
   --upload-avatar-size: 6rem;
   --upload-avatar-border-width: var(--stroke-md);
   --upload-avatar-change-space-block: var(--space-1);
-  /* The "change" strip sits ON the photo, so its scrim is intentionally a fixed dark wash rather
-   * than a surface role — it must stay legible over an arbitrary user image in either theme. */
+
   --upload-avatar-change-background: rgb(0 0 0 / 0.7);
   --upload-avatar-change-foreground: #fff;
-  /* Alpha of an image the user has marked for deletion but not yet committed. */
+
   --upload-avatar-pending-delete-alpha: 0.4;
 
-  /* DRAFT BAR — the undo strip shown after a pending remove/replace. */
   --upload-draft-space-inline: var(--space-3);
   --upload-draft-space-block: var(--space-2);
   --upload-draft-space-gap: var(--space-2);
@@ -80,7 +56,6 @@
   --upload-draft-font-size: var(--font-size-sm);
   --upload-draft-icon-size: var(--icon-size-sm);
 
-  /* FILE ROW — the list rendered under the dropzone/button variants. */
   --upload-row-space-inline: var(--space-3);
   --upload-row-space-block: var(--space-2);
   --upload-row-space-gap: var(--space-3);
@@ -88,20 +63,9 @@
   --upload-row-font-size: var(--font-size-sm);
   --upload-row-icon-size: var(--icon-size-md);
 
-  /* CROP DIALOG — the 1:1 avatar cropper (`UploadCropDialog`). The 66-literal upload pass above
-   * never reached this file, so the whole cropper was still baked on the component: the dialog was
-   * pinned to `max-w-sm`, the round preview to `size-48`, the zoom row to `px-2`. An avatar is one
-   * of the most service-specific sizes there is (a 96px tile service wants a smaller crop stage
-   * than a 200px one), and the crop stage must stay in proportion with --upload-avatar-size —
-   * which is exactly the pair rule #45 exists to keep tunable together.
-   *
-   * The dialog width intentionally stays a knob of its own rather than reading
-   * --dialog-width-default: the cropper is deliberately NARROWER than a normal dialog so the round
-   * stage reads as the subject, not as a small element in a wide box. */
   --upload-crop-dialog-max-width: 24rem;
   --upload-crop-preview-size: 12rem;
   --upload-crop-preview-radius: var(--radius-pill);
-  /* Zoom row inset — the slider is inset from the dialog edge so its thumb's focus ring is never
-   * flush against the dialog padding. */
+
   --upload-crop-zoom-space-inline: var(--space-2);
 }