@kb.ui/css 0.11.0 → 0.12.0

package/README.md

@@ -40,20 +40,26 @@ Plain HTML works as well:
 
 ## Components
 
-The first line of each stylesheet describes the markup it expects. The table shows common entries; [styles.css](src/styles.css) lists every component import.
+The first line of each stylesheet describes the markup it expects. The table shows common entries; [`styles.css`](src/styles.css) lists every component import.
 
 | File | Expected markup |
 |---|---|
 | `tabs.css` | `.kb-tabs` with list, tab, indicator and panel parts; each part carries orientation, variant and size from its nearest root |
 | `image.css` | `.kb-image` with ratio, fit and request state; visual fallback and native decorative img; renderer owns request lifecycle |
-| `avatar.css` | `.kb-avatar` with `data-size` and `data-shape` (`circle`, `square`, `rounded`, `hexagon`, `diamond`); `.kb-avatar-media` inherits root radius and clips upright media for polygons; `.kb-avatar-initials` supplies fallback text; also load image.css |
-| `thumbnail.css` | Native figure with media and caption/title/description; also load image.css |
-| `collection.css` | `.kb-collection` with toolbar, filters, native table, page checkboxes, bulk actions and pagination; renderer owns state; partial imports need Button, Checkbox, Input and Select CSS |
+| `avatar.css` | `.kb-avatar` with `data-size` and `data-shape` (`circle`, `square`, `rounded`, `hexagon`, `diamond`); `.kb-avatar-media` inherits root radius and clips upright media for polygons; `.kb-avatar-initials` supplies fallback text; also load `image.css` |
+| `thumbnail.css` | Native figure with media and caption/title/description; also load `image.css` |
+| `collection.css` | `.kb-collection` with toolbar, filters, native table, page checkboxes, bulk actions and pagination; renderer owns state; partial imports need `Button`, `Checkbox`, `Input` and `Select` CSS |
 | `container.css` | `.kb-container` with `data-size` (`sm`, `md`, `lg`, `full`) and optional `data-gutter="none"` |
+| `dashboard.css` | `.kb-dashboard` page frame with `-header`, `-metrics` and `-panels` regions; `-primary` and `-secondary` sit two thirds and one third from 60rem of panels width and stack below it |
+| `pageheader.css` | `.kb-pageheader` with `data-size` (`sm`, `md`, `lg`) and optional `data-divider`, wrapping `-navigation`, `-main`, `-heading`, `-eyebrow`, `-headline`, `-title`, `-meta`, `-description`, `-actions` and `-body` parts; actions wrap below the heading without media queries |
+| `gallery.css` | `.kb-gallery` page frame (up to 80rem, gutters 1, 1.5 and 2rem from 48 and 64rem of viewport width) with `-header`, `-filters`, `-empty` and `-items` regions; `-items` is a `.kb-grid` list of `.kb-gallery-item` with optional `data-featured`. One to four columns from 30, 48 and 64rem of gallery width; item content stretches to the row height. Also load `grid.css` |
+| `statsrow.css` | `.kb-statsrow` list with `data-appearance` (`plain`, `outlined`) and `.kb-statsrow-item` children holding a `.kb-stat`, `-trend` (`-change` with `data-trend`, `data-tone` and `-glyph`, `-context`) and `-link`; equal columns fill the region and wrap below `--kb-statsrow-item-min-width`; subgrid aligns parts across a row; also load `stat.css` |
 | `grid.css` | `.kb-grid` with `data-layout` (`auto`, `stack`), `data-columns` (`auto`, `1`, `2`, `3`, `4`), `data-min-item-width` (`sm`, `md`, `lg`), `data-gap` (`none`, `sm`, `md`, `lg`) and `data-align`; resets native list markers and margins |
 | `inline.css` | `.kb-inline` with `data-gap`, `data-align` and `data-justify`; wraps in source order |
+| `stack.css` | `.kb-stack` with `data-gap`, `data-align` (`start`, `center`, `end`, `stretch`) and `data-justify`; flows top to bottom in source order; resets child block margins and native list markers |
 | `split.css` | `.kb-split` with `data-ratio`, `data-collapse`, `data-gap` and `data-align`; two `.kb-split-track` children containing the column content |
-| `separator.css` | Native hr with `.kb-separator` and `data-orientation`; decorative rules need aria-hidden and role none |
+| `supportingpane.css` | `.kb-supportingpane` page frame (up to 80rem, gutters stepping at 48rem and 64rem of viewport) with `-main` and `-aside` regions; the aside sits beside main from 48rem of the pane's content width and below it under that |
+| `separator.css` | Native hr with `.kb-separator` and `data-orientation`; decorative rules need `aria-hidden` and role none |
 | `heading.css` | Native heading with `.kb-heading` and `data-size` (`sm`, `md`, `lg`, `xl`, `display`); rank follows document outline |
 | `text.css` | `p`, `span` or `div` with `.kb-text`, `data-size` (`sm`, `md`, `lg`) and `data-tone` (`default`, `muted`) |
 | `link.css` | Native anchor with href and `.kb-link`; underline and visible keyboard focus |
@@ -62,7 +68,7 @@ The first line of each stylesheet describes the markup it expects. The table sho
 | `codeblock.css` | `.kb-codeblock` block toolbar; also import `code.css` for shared listing anatomy and tokens |
 | `button.css` | `.kb-button` with `data-variant` (`primary`, `secondary`, `ghost`, `danger`), `data-size` (`sm`, `md`, `lg`, `icon`) and `data-disabled` |
 | `numberfield.css` | `.kb-numberfield` with size/state attributes, label, grouped input/step controls and full-width help/error |
-| `fileinput.css` | `.kb-fileinput` with labeled picker, retained list and named removal controls; also load Button CSS when importing parts |
+| `fileinput.css` | `.kb-fileinput` with labeled picker, retained list and named removal controls; also load `Button` CSS when importing parts |
 | `combobox.css` | `.kb-combobox` with labeled search input, clear/trigger actions, portaled listbox popup and polite empty status |
 | `multiselect.css` | `.kb-multiselect` with labeled chip toolbar, removable selection chips, search input, clear/trigger actions and portaled listbox popup |
 | `input.css` | `.kb-input` with `data-size`, `data-invalid` and `data-disabled`, wrapping `-label`, `-shell`, `-start`, `-control`, `-end`, `-description` and `-error` parts |
@@ -70,6 +76,9 @@ The first line of each stylesheet describes the markup it expects. The table sho
 | `switch.css` | `.kb-switch` with `data-size`, `data-off-tone`, `data-on-tone`, `data-checked`, `data-disabled`, `data-readonly` and `data-invalid`, wrapping `-field`, `-target`, `-control`, `-track`, `-thumb`, `-off`, `-on`, `-label`, `-description` and `-error` parts |
 | `fieldset.css` | Native `fieldset` with `.kb-fieldset`, `data-disabled` and `data-invalid`, wrapping `-legend`, `-description`, `-fields` and `-error` parts |
 | `formactions.css` | `.kb-formactions` with `data-align` (`end`, `start`, `between`) and optional `data-divider` |
+| `formsection.css` | Native `fieldset` with `.kb-formsection`, optional `data-layout` (`stack`, `split`), `data-disabled` and `data-invalid`, wrapping `-header` (`-title`, `-description`) and `-body` (`-fields`, `-error`, `-actions`); sections inside `.kb-settings` split unless `data-layout` is set. Also load `formactions.css` and `heading.css` |
+| `form.css` | Native `form` with `.kb-form` and `data-width` (`sm`, `md`, `full`), wrapping `-header`, `-body` and `-actions` regions; actions fill the row below 30rem. Also load `formactions.css` |
+| `settings.css` | `.kb-settings` with `-header` and `-sections` regions and rules between sections |
 | `errorsummary.css` | `.kb-errorsummary` alert container with `-title`, `-description`, `-list`, `-item` and `-link` parts |
 | `emptystate.css` | `.kb-emptystate` with `data-size` (`sm`, `md`, `lg`), `data-variant` (`surface`, `subtle`, `plain`) and `data-tone` (`neutral`, `info`, `warning`, `danger`), wrapping `-icon`, `-header`, `-eyebrow`, `-title`, `-description`, `-body`, `-actions` and `-footer` parts |
 | `spinner.css` | `.kb-spinner` with `data-size` (`sm`, `md`, `lg`), `data-tone` (`current`, `accent`, `neutral`, `info`, `success`, `warning`, `danger`), `data-variant` (`ring`, `orbit`, `dots`, `bars`), `data-appearance` (`plain`, `pill`) and optional `data-show-label`, wrapping `-icon` (`-track`, `-arc`, `-core`, `-dot`, `-bar`) and `-label` |
@@ -78,8 +87,9 @@ The first line of each stylesheet describes the markup it expects. The table sho
 | `descriptionlist.css` | Native dl/dt/dd groups with responsive label/value columns, density and dividers |
 | `collectionlist.css` | Native unordered/ordered record lists with immediate-row density and separators |
 | `collectionrow.css` | Native li with aligned leading/content/aside slots, selected state, wrapping actions and responsive stacking |
-| `table.css` | Native table parts with density, sorting, selected rows, sticky headers/edges, a keyboard-scrollable container and independent row actions; see [Table API](../react/docs/components/Table.md) |
+| `table.css` | Native table parts with density, sorting, selected rows, sticky headers/edges, a keyboard-scrollable container and independent row actions; see [`Table` API](../react/docs/components/Table.md) |
 | `dialog.css` | `.kb-dialog-popup` with `-title`, `-description` and `-actions` parts, beside a `.kb-dialog-backdrop`. Both use Base UI's open, starting and ending attributes for animation |
+| `confirmaction.css` | `.kb-confirmaction` on a `.kb-dialog-popup`, with `data-pending` and `-details` and `-error` parts; the error reuses `.kb-callout` |
 
 ## Build and test
 

package/dist/components/callout.css

@@ -1 +1 @@
-@layer kbui.components{.kb-callout{--_callout-ink:var(--kb-color-muted);--_callout-title:var(--kb-color-fg);gap:var(--kb-space-3);padding:var(--kb-callout-padding-block) var(--kb-callout-padding-inline);border:1px solid color-mix(in oklab, var(--_callout-ink) 65%, transparent);border-radius:var(--kb-callout-radius);background:color-mix(in oklab, var(--_callout-ink) 18%, var(--kb-material-surface-bg));box-shadow:var(--kb-material-inlay-shadow);color:var(--kb-color-fg);font-size:var(--kb-text-control-size);display:flex}.kb-callout:is([data-tone=info],[data-tone=success],[data-tone=warning],[data-tone=danger]){--_callout-title:var(--_callout-ink)}.kb-callout[data-tone=info]{--_callout-ink:var(--kb-color-info)}.kb-callout[data-tone=success]{--_callout-ink:var(--kb-color-success)}.kb-callout[data-tone=warning]{--_callout-ink:var(--kb-color-warning)}.kb-callout[data-tone=danger]{--_callout-ink:var(--kb-color-danger)}.kb-callout-icon{width:1.25em;height:1.25em;color:var(--_callout-ink);flex:none;display:inline-flex}.kb-callout-icon>*{width:100%;height:100%}.kb-callout-content{gap:var(--kb-space-1);flex-direction:column;min-width:0;display:flex}.kb-callout-title{color:var(--_callout-title);font-weight:var(--kb-font-weight-strong)}.kb-callout-actions{gap:var(--kb-space-2);margin-top:var(--kb-space-2);flex-wrap:wrap;display:flex}.kb-callout-actions .kb-button[data-variant=ghost]{color:color-mix(in oklab, var(--kb-color-muted) 60%, var(--kb-color-fg))}@media (forced-colors:active){.kb-callout{color:canvastext;background:canvas;border-color:canvastext}.kb-callout-icon,.kb-callout-title{color:canvastext}.kb-callout-actions .kb-button[data-variant=ghost]{color:buttontext}}}
+@layer kbui.components{.kb-callout{--_callout-ink:var(--kb-color-muted);--_callout-title:var(--kb-color-fg);gap:var(--kb-space-3);padding:var(--kb-callout-padding-block) var(--kb-callout-padding-inline);border:1px solid color-mix(in oklab, var(--_callout-ink) 65%, transparent);border-radius:var(--kb-callout-radius);background:color-mix(in oklab, var(--_callout-ink) 18%, var(--kb-material-surface-bg));box-shadow:var(--kb-material-inlay-shadow);color:var(--kb-color-fg);font-size:var(--kb-text-control-size);display:flex}.kb-callout:is([data-tone=info],[data-tone=success],[data-tone=warning],[data-tone=danger]){--_callout-title:var(--_callout-ink)}.kb-callout[data-tone=info]{--_callout-ink:var(--kb-color-info)}.kb-callout[data-tone=success]{--_callout-ink:var(--kb-color-success)}.kb-callout[data-tone=warning]{--_callout-ink:var(--kb-color-warning)}.kb-callout[data-tone=danger]{--_callout-ink:var(--kb-color-danger)}.kb-callout-icon{width:1.25em;height:1.25em;color:var(--_callout-ink);flex:none;display:inline-flex}.kb-callout-icon>*{width:100%;height:100%}.kb-callout-content{gap:var(--kb-space-1);flex-direction:column;flex:auto;min-width:0;display:flex}.kb-callout-title{color:var(--_callout-title);font-weight:var(--kb-font-weight-strong)}.kb-callout-actions{justify-content:flex-end;gap:var(--kb-space-2);margin-top:var(--kb-space-2);flex-wrap:wrap;display:flex}.kb-callout-actions .kb-button[data-variant=ghost]{color:color-mix(in oklab, var(--kb-color-muted) 60%, var(--kb-color-fg))}@media (forced-colors:active){.kb-callout{color:canvastext;background:canvas;border-color:canvastext}.kb-callout-icon,.kb-callout-title{color:canvastext}.kb-callout-actions .kb-button[data-variant=ghost]{color:buttontext}}}

package/dist/components/card.css

@@ -1 +1 @@
-@layer kbui.components{.kb-card{min-inline-size:0;position:relative}.kb-card[data-appearance=outlined]{padding:var(--kb-card-padding);border:var(--kb-card-border-width) solid var(--kb-card-border);border-radius:var(--kb-card-radius);background-color:var(--kb-card-background);background-image:var(--kb-card-face);color:var(--kb-card-color);box-shadow:var(--kb-card-shadow);flex-direction:column;display:flex}.kb-card>:where(p){font-size:var(--kb-text-body-size);line-height:var(--kb-text-leading-body)}@media (width<=580px){.kb-card{--kb-card-padding:var(--kb-card-padding-compact)}}@media (forced-colors:active){.kb-card{box-shadow:none;background-image:none}}}
+@layer kbui.components{.kb-card{min-inline-size:0;position:relative}.kb-card[data-appearance=outlined]{padding:var(--kb-card-padding);border:var(--kb-card-border-width) solid var(--kb-card-border);border-radius:var(--kb-card-radius);background-color:var(--kb-card-background);background-image:var(--kb-card-face);color:var(--kb-card-color);box-shadow:var(--kb-card-shadow);flex-direction:column;display:flex}.kb-card>:where(p){font-size:var(--kb-text-body-size);line-height:var(--kb-text-leading-body)}@media (width<=580px){.kb-card{--kb-card-padding:var(--kb-card-padding-compact)}}@container (width<=36.25rem){.kb-card{--kb-card-padding:var(--kb-card-padding-compact)}}@media (forced-colors:active){.kb-card{box-shadow:none;background-image:none}}}

package/dist/components/collection.css

@@ -1 +1 @@
-@layer kbui.components{.kb-collection{gap:var(--kb-collection-gap);inline-size:100%;min-inline-size:0;color:var(--kb-color-fg);font-family:var(--kb-font-sans);font-size:var(--kb-text-small-size);display:grid}.kb-collection-toolbar,.kb-collection-filters,.kb-collection-bulk,.kb-collection-pagination{align-items:center;gap:var(--kb-collection-gap);flex-wrap:wrap;min-inline-size:0;display:flex}.kb-collection-toolbar{align-items:end;gap:var(--kb-space-4)}.kb-collection-toolbar>.kb-input{flex:2 1 var(--kb-grid-min-item-width-sm);min-inline-size:min(100%, var(--kb-grid-min-item-width-sm))}.kb-collection-filters{flex:1 1 var(--kb-select-popup-min-width);gap:var(--kb-space-4)}.kb-collection-filters>.kb-select{flex:1 1 var(--kb-select-popup-min-width);min-inline-size:min(100%, var(--kb-select-popup-min-width));max-inline-size:100%}.kb-collection-viewport{border:1px solid var(--kb-collection-border);border-radius:var(--kb-collection-radius);overflow:auto}.kb-collection-table{border-collapse:collapse;min-inline-size:var(--kb-collection-table-min-width);text-align:start;inline-size:100%}.kb-collection-caption{padding:var(--kb-collection-cell-padding);font-weight:var(--kb-font-weight-strong);text-align:start;background:var(--kb-collection-header-background)}.kb-collection-head,.kb-collection-cell{padding:var(--kb-collection-cell-padding);border-block-start:1px solid var(--kb-collection-border);text-align:start;overflow-wrap:anywhere}.kb-collection-head{font-weight:var(--kb-font-weight-strong)}.kb-collection-row[data-selected]{background:var(--kb-collection-selected-background)}.kb-collection-empty{padding:var(--kb-space-6);text-align:center}.kb-collection-status{color:var(--kb-color-muted);margin:0}.kb-collection-bulk{padding:var(--kb-space-2);border:1px solid var(--kb-collection-border);border-radius:var(--kb-collection-radius);margin:0}.kb-collection-pagination{justify-content:space-between;align-items:end;gap:var(--kb-space-4) var(--kb-space-6);font-variant-numeric:tabular-nums}.kb-collection-pagination>div{align-items:end;gap:var(--kb-space-4);flex-wrap:wrap;min-inline-size:0;display:flex}.kb-collection-pagination>div:last-child{align-items:center;gap:var(--kb-space-2);flex-wrap:nowrap;max-inline-size:100%}.kb-collection-pagination>div>span{overflow-wrap:anywhere;min-inline-size:0}.kb-collection-pagination>div:last-child>span{text-align:center}.kb-collection-pagination>div:last-child>.kb-button{flex-shrink:0}.kb-collection-pagination>div:first-child>span{padding-block:var(--kb-space-3)}.kb-collection-pagination .kb-select{min-inline-size:calc(var(--kb-input-height-md) * 2);max-inline-size:100%}.kb-collection-bulk [role=alert]{color:var(--kb-color-danger);flex-basis:100%}.kb-collection-viewport:focus-visible{outline:2px solid var(--kb-color-accent);outline-offset:2px}@media (forced-colors:active){.kb-collection-row[data-selected]{outline-offset:-1px;outline:1px solid highlight}.kb-collection-viewport:focus-visible{outline-color:highlight}}}
+@layer kbui.components{.kb-collection{gap:var(--kb-collection-gap);inline-size:100%;min-inline-size:0;color:var(--kb-color-fg);font-family:var(--kb-font-sans);font-size:var(--kb-text-small-size);display:grid}.kb-collection-toolbar,.kb-collection-filters,.kb-collection-bulk,.kb-collection-pagination{align-items:center;gap:var(--kb-collection-gap);flex-wrap:wrap;min-inline-size:0;display:flex}.kb-collection-toolbar{align-items:end;gap:var(--kb-space-4)}.kb-collection-toolbar>.kb-input{flex:2 1 var(--kb-grid-min-item-width-sm);min-inline-size:min(100%, var(--kb-grid-min-item-width-sm))}.kb-collection-filters{flex:1 1 var(--kb-select-popup-min-width);gap:var(--kb-space-4)}.kb-collection-filters>.kb-select{flex:1 1 var(--kb-select-popup-min-width);min-inline-size:min(100%, var(--kb-select-popup-min-width));max-inline-size:100%}.kb-collection-viewport{border:1px solid var(--kb-collection-border);border-radius:var(--kb-collection-radius);overflow:auto}.kb-collection-table{border-collapse:collapse;min-inline-size:var(--kb-collection-table-min-width);text-align:start;inline-size:100%}.kb-collection-caption{padding:var(--kb-collection-cell-padding);font-weight:var(--kb-font-weight-strong);text-align:start;background:var(--kb-collection-header-background)}.kb-collection-head,.kb-collection-cell{padding:var(--kb-collection-cell-padding);border-block-start:1px solid var(--kb-collection-border);text-align:start;overflow-wrap:break-word}.kb-collection-head{font-weight:var(--kb-font-weight-strong)}.kb-collection-row[data-selected]{background:var(--kb-collection-selected-background)}.kb-collection-empty{padding:var(--kb-space-6);text-align:center}.kb-collection-status{color:var(--kb-color-muted);margin:0}.kb-collection-bulk>[role=status]:first-of-type{margin-inline-end:auto}.kb-collection-bulk>[role=status]:last-of-type:empty{margin-inline-start:calc(var(--kb-collection-gap) * -1)}.kb-collection-bulk{padding:var(--kb-space-2);border:1px solid var(--kb-collection-border);border-radius:var(--kb-collection-radius);margin:0}.kb-collection-pagination{justify-content:space-between;align-items:end;gap:var(--kb-space-4) var(--kb-space-6);font-variant-numeric:tabular-nums}.kb-collection-pagination>div{align-items:end;gap:var(--kb-space-4);flex-wrap:wrap;min-inline-size:0;display:flex}.kb-collection-pagination>div:last-child{align-items:center;gap:var(--kb-space-2);flex-wrap:nowrap;max-inline-size:100%;margin-inline-start:auto}.kb-collection-pagination>div>span{overflow-wrap:anywhere;min-inline-size:0}.kb-collection-pagination>div:last-child>span{text-align:center}.kb-collection-pagination>div:last-child>.kb-button{flex-shrink:0}.kb-collection-pagination>div:first-child>span{padding-block:var(--kb-space-3)}.kb-collection-pagination .kb-select{min-inline-size:calc(var(--kb-input-height-md) * 2);max-inline-size:100%}.kb-collection-bulk [role=alert]{color:var(--kb-color-danger);flex-basis:100%}.kb-collection-viewport:focus-visible{outline:2px solid var(--kb-color-accent);outline-offset:2px}@media (forced-colors:active){.kb-collection-row[data-selected]{outline-offset:-1px;outline:1px solid highlight}.kb-collection-viewport:focus-visible{outline-color:highlight}}}

package/dist/components/collectionrow.css

@@ -1 +1 @@
-@layer kbui.components{.kb-collectionrow{min-inline-size:0;padding:var(--kb-collectionrow-padding-block) var(--kb-collectionrow-padding-inline);color:var(--kb-color-fg);font-family:var(--kb-font-sans);font-size:var(--kb-size-sm);line-height:var(--kb-text-leading-body);overflow-wrap:anywhere}.kb-collectionrow-layout{--_collectionrow-leading:0px;--_collectionrow-aside:0px;grid-template-columns:var(--_collectionrow-leading) minmax(0, 1fr) var(--_collectionrow-aside);align-items:start;min-inline-size:0;display:grid}.kb-collectionrow[data-leading]>.kb-collectionrow-layout{--_collectionrow-leading:var(--kb-collectionrow-leading-width)}.kb-collectionrow[data-aside]>.kb-collectionrow-layout{--_collectionrow-aside:var(--kb-collectionrow-aside-width)}.kb-collectionlist:has(>.kb-collectionrow[data-leading])>.kb-collectionrow>.kb-collectionrow-layout{--_collectionrow-leading:var(--kb-collectionrow-leading-width)}.kb-collectionlist:has(>.kb-collectionrow[data-aside])>.kb-collectionrow>.kb-collectionrow-layout{--_collectionrow-aside:var(--kb-collectionrow-aside-width)}.kb-collectionrow-leading{min-inline-size:0;grid-column:1;padding-inline-end:var(--kb-collectionrow-gap)}.kb-collectionrow-content{grid-column:2;min-inline-size:0}.kb-collectionrow-title{font-weight:var(--kb-font-weight-strong)}.kb-collectionrow-description{color:var(--kb-color-muted);margin-block-start:var(--kb-space-1)}.kb-collectionrow-aside{gap:var(--kb-space-2);min-inline-size:0;text-align:end;grid-column:3;padding-inline-start:var(--kb-collectionrow-gap);display:grid}.kb-collectionrow-metadata{color:var(--kb-color-muted)}.kb-collectionrow .kb-status{max-inline-size:100%}.kb-collectionrow .kb-status-text{white-space:normal;min-inline-size:0}.kb-collectionrow-actions{justify-content:flex-end;gap:var(--kb-space-2);flex-wrap:wrap;min-inline-size:0;display:flex}.kb-collectionrow-actions>:where(button,a){white-space:normal;overflow-wrap:anywhere;max-inline-size:100%}.kb-collectionrow-actions>.kb-button{height:auto;min-block-size:var(--kb-button-height-md);padding-block:var(--kb-space-2)}.kb-collectionrow-actions>.kb-button[data-size=sm]{min-block-size:var(--kb-button-height-sm)}.kb-collectionrow-actions>.kb-button[data-size=lg]{min-block-size:var(--kb-button-height-lg)}.kb-collectionrow[data-selected]{background:var(--kb-color-surface)}@container kb-collectionlist (width<40rem){.kb-collectionrow>.kb-collectionrow-layout{grid-template-columns:var(--_collectionrow-leading) minmax(0, 1fr);row-gap:var(--kb-collectionrow-gap)}.kb-collectionrow-aside{text-align:start;grid-column:2;padding-inline-start:0}.kb-collectionrow-actions{justify-content:flex-start}}@media (forced-colors:active){.kb-collectionrow[data-selected]{outline-offset:-1px;outline:1px solid highlight}}}
+@layer kbui.components{.kb-collectionrow{min-inline-size:0;padding-block:var(--kb-collectionrow-padding-block);color:var(--kb-color-fg);font-family:var(--kb-font-sans);font-size:var(--kb-size-sm);line-height:var(--kb-text-leading-body);overflow-wrap:anywhere;container:kb-collectionrow/inline-size}.kb-collectionrow-layout{--_collectionrow-leading:0px;--_collectionrow-aside:0px;grid-template-columns:minmax(var(--_collectionrow-leading), auto) minmax(0, 1fr) minmax(var(--_collectionrow-aside), auto);min-inline-size:0;padding-inline:var(--kb-collectionrow-padding-inline);align-items:start;display:grid}.kb-collectionrow[data-leading]>.kb-collectionrow-layout{--_collectionrow-leading:var(--kb-collectionrow-leading-width)}.kb-collectionrow[data-aside]>.kb-collectionrow-layout{--_collectionrow-aside:var(--kb-collectionrow-aside-width)}.kb-collectionlist:has(>.kb-collectionrow[data-leading])>.kb-collectionrow>.kb-collectionrow-layout{--_collectionrow-leading:var(--kb-collectionrow-leading-width)}.kb-collectionlist:has(>.kb-collectionrow[data-aside])>.kb-collectionrow>.kb-collectionrow-layout{--_collectionrow-aside:var(--kb-collectionrow-aside-width)}.kb-collectionrow-leading{min-inline-size:0;max-inline-size:40cqi;grid-column:1;padding-inline-end:var(--kb-collectionrow-gap)}.kb-collectionrow-content{grid-column:2;min-inline-size:0}.kb-collectionrow-title{font-weight:var(--kb-font-weight-strong)}.kb-collectionrow-description{color:var(--kb-color-muted);margin-block-start:var(--kb-space-1)}.kb-collectionrow-aside{justify-content:flex-end;align-items:center;gap:var(--kb-space-2);min-inline-size:0;max-inline-size:50cqi;text-align:end;flex-wrap:wrap;grid-column:3;padding-inline-start:var(--kb-collectionrow-gap);display:flex}.kb-collectionrow-metadata{min-inline-size:0;max-inline-size:100%;color:var(--kb-color-muted)}.kb-collectionrow .kb-status{max-inline-size:100%}.kb-collectionrow .kb-status-text{white-space:normal;min-inline-size:0}.kb-collectionrow-actions{justify-content:flex-end;gap:var(--kb-space-2);flex-wrap:wrap;min-inline-size:0;max-inline-size:100%;display:flex}.kb-collectionrow-actions>:where(button,a){white-space:normal;overflow-wrap:anywhere;max-inline-size:100%}.kb-collectionrow-actions>.kb-button{height:auto;min-block-size:var(--kb-button-height-md);padding-block:var(--kb-space-2)}.kb-collectionrow-actions>.kb-button[data-size=sm]{min-block-size:var(--kb-button-height-sm)}.kb-collectionrow-actions>.kb-button[data-size=lg]{min-block-size:var(--kb-button-height-lg)}.kb-collectionrow[data-selected]{background:var(--kb-color-surface)}@container kb-collectionrow (width<48rem){.kb-collectionrow>.kb-collectionrow-layout{grid-template-columns:minmax(var(--_collectionrow-leading), auto) minmax(0, 1fr);row-gap:var(--kb-collectionrow-gap)}.kb-collectionrow-aside{grid-column:2;max-inline-size:none;padding-inline-start:0}}@media (forced-colors:active){.kb-collectionrow[data-selected]{outline-offset:-1px;outline:1px solid highlight}}}

package/dist/components/confirmaction.css

@@ -0,0 +1 @@
+@layer kbui.components{.kb-confirmaction[data-pending]{cursor:progress}.kb-confirmaction-details{gap:var(--kb-space-2);color:var(--kb-color-fg);font-size:var(--kb-text-control-size);margin-block-end:var(--kb-space-4);line-height:1.6;display:grid}.kb-confirmaction-details>*{margin-block:0}}

package/dist/components/dashboard.css

@@ -0,0 +1 @@
+@layer kbui.components{.kb-dashboard{gap:var(--kb-dashboard-gap);box-sizing:border-box;inline-size:100%;min-inline-size:0;max-inline-size:var(--kb-dashboard-max-width);padding-inline:calc(var(--kb-dashboard-gutter-sm) + clamp(0px, (100% + 1px - var(--kb-dashboard-gutter-md-from)) * 99999, var(--kb-dashboard-gutter-md) - var(--kb-dashboard-gutter-sm)) + clamp(0px, (100% + 1px - var(--kb-dashboard-gutter-lg-from)) * 99999, var(--kb-dashboard-gutter-lg) - var(--kb-dashboard-gutter-md)));grid-template-columns:minmax(0,1fr);margin-inline:auto;display:grid}.kb-dashboard-header,.kb-dashboard-metrics{min-inline-size:0}.kb-dashboard-panels{align-items:flex-start;gap:var(--kb-dashboard-gap);flex-wrap:wrap;min-inline-size:0;display:flex}.kb-dashboard-primary,.kb-dashboard-secondary{--_dashboard-share:calc(2 / 3);gap:var(--kb-dashboard-gap);box-sizing:border-box;flex:100%;flex-basis:min(100%, max(calc((var(--kb-dashboard-collapse) - 100%) * 99999), calc((100% - var(--kb-dashboard-gap)) * var(--_dashboard-share) - .5px)));grid-template-columns:minmax(0,1fr);min-inline-size:0;max-inline-size:100%;display:grid}.kb-dashboard-secondary{--_dashboard-share:calc(1 / 3)}}

package/dist/components/errorsummary.css

@@ -1 +1 @@
-@layer kbui.components{.kb-errorsummary{gap:var(--kb-errorsummary-gap);min-inline-size:0;padding:var(--kb-errorsummary-padding);border:1px solid var(--kb-color-danger);border-inline-start-width:var(--kb-space-1);border-radius:var(--kb-errorsummary-radius);background:color-mix(in oklab, var(--kb-color-danger) 8%, transparent);color:var(--kb-color-fg);display:grid}.kb-errorsummary:focus,.kb-errorsummary:focus-visible{outline:2px solid var(--kb-color-ring);outline-offset:2px}.kb-errorsummary-title{overflow-wrap:anywhere;min-inline-size:0;font-family:var(--kb-font-sans);font-size:var(--kb-text-control-size);font-weight:var(--kb-font-weight-strong);line-height:var(--kb-heading-leading);color:var(--kb-color-fg);margin:0}.kb-errorsummary-description{overflow-wrap:anywhere;min-inline-size:0;font-size:var(--kb-text-small-size);line-height:var(--kb-text-leading-body);color:var(--kb-color-muted);margin:0}.kb-errorsummary-list{gap:var(--kb-space-1);font-size:var(--kb-text-small-size);line-height:var(--kb-text-leading-body);margin:0;padding-inline-start:var(--kb-space-4);display:grid}.kb-errorsummary-item{overflow-wrap:anywhere;min-inline-size:0;color:var(--kb-color-danger)}.kb-errorsummary-link{color:var(--kb-color-danger);font-weight:var(--kb-font-weight-medium);text-underline-offset:.16em;border-radius:var(--kb-radius-sm);text-decoration:underline}.kb-errorsummary-link:hover{color:var(--kb-color-fg)}.kb-errorsummary-link:focus-visible{outline:2px solid var(--kb-color-ring);outline-offset:2px}@media (forced-colors:active){.kb-errorsummary{color:canvastext;background:canvas;border-color:canvastext}.kb-errorsummary:focus,.kb-errorsummary:focus-visible,.kb-errorsummary-link:focus-visible{outline-color:highlight}.kb-errorsummary-title,.kb-errorsummary-description,.kb-errorsummary-item{color:canvastext}.kb-errorsummary-link,.kb-errorsummary-link:hover{color:linktext}}}
+@layer kbui.components{.kb-errorsummary{gap:var(--kb-errorsummary-gap);min-inline-size:0;padding:var(--kb-errorsummary-padding);border:1px solid var(--kb-color-danger);border-inline-start-width:var(--kb-space-1);border-radius:var(--kb-errorsummary-radius);background:color-mix(in oklab, var(--kb-color-danger) 8%, transparent);color:var(--kb-color-fg);display:grid}.kb-errorsummary:focus,.kb-errorsummary:focus-visible{outline:2px solid var(--kb-color-ring);outline-offset:2px}.kb-errorsummary-title{overflow-wrap:anywhere;min-inline-size:0;font-family:var(--kb-font-sans);font-size:var(--kb-text-control-size);font-weight:var(--kb-font-weight-strong);line-height:var(--kb-heading-leading);color:var(--kb-color-fg);margin:0}.kb-errorsummary-description{overflow-wrap:anywhere;min-inline-size:0;font-size:var(--kb-text-small-size);line-height:var(--kb-text-leading-body);color:var(--kb-color-muted);margin:0}.kb-errorsummary-list{gap:var(--kb-space-1);font-size:var(--kb-text-small-size);line-height:var(--kb-text-leading-body);margin:0;padding-inline-start:var(--kb-space-4);display:grid}.kb-errorsummary-item{overflow-wrap:anywhere;min-inline-size:0;color:var(--kb-color-danger);margin:0}.kb-errorsummary-link{color:var(--kb-color-danger);font-weight:var(--kb-font-weight-medium);text-underline-offset:.16em;border-radius:var(--kb-radius-sm);text-decoration:underline}.kb-errorsummary-link:hover{color:var(--kb-color-fg)}.kb-errorsummary-link:focus-visible{outline:2px solid var(--kb-color-ring);outline-offset:2px}@media (forced-colors:active){.kb-errorsummary{color:canvastext;background:canvas;border-color:canvastext}.kb-errorsummary:focus,.kb-errorsummary:focus-visible,.kb-errorsummary-link:focus-visible{outline-color:highlight}.kb-errorsummary-title,.kb-errorsummary-description,.kb-errorsummary-item{color:canvastext}.kb-errorsummary-link,.kb-errorsummary-link:hover{color:linktext}}}

package/dist/components/form.css

@@ -0,0 +1 @@
+@layer kbui.components{.kb-form{gap:var(--kb-form-gap);min-inline-size:0;max-inline-size:var(--kb-form-width-md);grid-template-columns:minmax(0,1fr);margin:0;display:grid}.kb-form[data-width=sm]{max-inline-size:var(--kb-form-width-sm)}.kb-form[data-width=full]{max-inline-size:none}.kb-form-header,.kb-form-body{grid-template-columns:minmax(0,1fr);min-inline-size:0;display:grid}.kb-form-header{gap:var(--kb-space-2)}.kb-form-body{gap:var(--kb-form-gap)}.kb-form-actions{container:kb-form-actions/inline-size}@container kb-form-actions (width<30rem){.kb-form-actions>:is(.kb-button,button,a){flex:100%}}}

package/dist/components/formsection.css

@@ -0,0 +1 @@
+@layer kbui.components{.kb-formsection{--_formsection-column-gap:var(--kb-layout-gap-lg);align-items:flex-start;gap:var(--kb-formsection-gap) var(--_formsection-column-gap);min-inline-size:0;color:var(--kb-color-fg);border:0;flex-wrap:wrap;margin:0;padding:0;display:flex}.kb-formsection-header,.kb-formsection-body{--_formsection-share:calc(2 / 3);box-sizing:border-box;flex:100%;grid-template-columns:minmax(0,1fr);min-inline-size:0;max-inline-size:100%;display:grid}.kb-formsection-header{--_formsection-share:calc(1 / 3);gap:var(--kb-formsection-header-gap)}.kb-formsection-body{gap:var(--kb-formsection-fields-gap)}.kb-formsection[data-layout=split]>:is(.kb-formsection-header,.kb-formsection-body),.kb-settings .kb-formsection:not([data-layout])>:is(.kb-formsection-header,.kb-formsection-body){flex-basis:min(100%, max(calc((var(--kb-formsection-collapse) - 100%) * 99999), calc((100% - var(--_formsection-column-gap)) * var(--_formsection-share))))}.kb-formsection-description,.kb-formsection-error{overflow-wrap:anywhere;min-inline-size:0;font-size:var(--kb-text-small-size);line-height:var(--kb-text-leading-body);margin:0}.kb-formsection-description{color:var(--kb-color-muted)}.kb-formsection-fields{gap:var(--kb-formsection-fields-gap);min-inline-size:0;display:grid}.kb-formsection-error{color:var(--kb-color-danger)}.kb-formsection-actions{container:kb-formsection-actions/inline-size}@container kb-formsection-actions (width<30rem){.kb-formsection-actions>:is(.kb-button,button,a){flex:100%}}.kb-formsection:is(:disabled,[data-disabled])>.kb-formsection-header{opacity:.5}@media (forced-colors:active){.kb-formsection,.kb-formsection-description,.kb-formsection-error{color:canvastext}.kb-formsection:is(:disabled,[data-disabled])>.kb-formsection-header{opacity:1}.kb-formsection:is(:disabled,[data-disabled]) :is(.kb-formsection-title,.kb-formsection-description){color:graytext}}}

package/dist/components/gallery.css

@@ -0,0 +1 @@
+@layer kbui.components{.kb-gallery{box-sizing:border-box;gap:var(--kb-gallery-gap);inline-size:100%;min-inline-size:0;max-inline-size:var(--kb-gallery-max-width);padding-inline:var(--kb-gallery-gutter-sm);grid-template-columns:minmax(0,1fr);margin-inline:auto;display:grid;container:kb-gallery/inline-size}@media (width>=48rem){.kb-gallery{padding-inline:var(--kb-gallery-gutter-md)}}@media (width>=64rem){.kb-gallery{padding-inline:var(--kb-gallery-gutter-lg)}}.kb-gallery-header,.kb-gallery-empty{min-inline-size:0}.kb-gallery-filters{align-items:end;gap:var(--kb-gallery-filters-gap);flex-wrap:wrap;min-inline-size:0;display:flex}.kb-gallery-filters>*{flex:1 1 var(--kb-gallery-filter-min-width);min-inline-size:0}.kb-gallery>.kb-gallery-items{grid-template-columns:minmax(0,1fr)}.kb-gallery-item{display:grid}@container kb-gallery (width>=30rem){.kb-gallery>.kb-gallery-items{grid-template-columns:repeat(2,minmax(0,1fr))}.kb-gallery-item[data-featured]{grid-column:span 2}}@container kb-gallery (width>=48rem){.kb-gallery>.kb-gallery-items{grid-template-columns:repeat(3,minmax(0,1fr))}}@container kb-gallery (width>=64rem){.kb-gallery>.kb-gallery-items{grid-template-columns:repeat(4,minmax(0,1fr))}}}

package/dist/components/grid.css

@@ -1 +1 @@
-@layer kbui.components{.kb-grid{--_grid-min-width:var(--kb-grid-min-item-width);grid-template-columns:repeat(auto-fit, minmax(min(100%, var(--_grid-min-width)), 1fr));gap:var(--kb-grid-gap);overflow-wrap:anywhere;align-items:stretch;min-inline-size:0;margin:0;padding:0;list-style:none;display:grid}.kb-grid>*{min-inline-size:0;max-inline-size:100%;margin:0}.kb-grid[data-min-item-width=sm]{--_grid-min-width:var(--kb-grid-min-item-width-sm)}.kb-grid[data-min-item-width=md]{--_grid-min-width:var(--kb-grid-min-item-width-md)}.kb-grid[data-min-item-width=lg]{--_grid-min-width:var(--kb-grid-min-item-width-lg)}.kb-grid[data-columns="2"]{grid-template-columns:repeat(2,minmax(0,1fr))}.kb-grid[data-columns="3"]{grid-template-columns:repeat(3,minmax(0,1fr))}.kb-grid[data-columns="4"]{grid-template-columns:repeat(4,minmax(0,1fr))}.kb-grid[data-layout=stack],.kb-grid[data-columns="1"]{grid-template-columns:minmax(0,1fr)}@media (width<=480px){.kb-grid[data-columns="2"],.kb-grid[data-columns="3"],.kb-grid[data-columns="4"]{grid-template-columns:minmax(0,1fr)}}.kb-grid[data-gap=none]{gap:0}.kb-grid[data-gap=sm]{gap:var(--kb-layout-gap-sm)}.kb-grid[data-gap=md]{gap:var(--kb-layout-gap-md)}.kb-grid[data-gap=lg]{gap:var(--kb-layout-gap-lg)}.kb-grid[data-align=start]{align-items:start}.kb-grid[data-align=center]{align-items:center}.kb-grid[data-align=end]{align-items:end}.kb-grid[data-align=baseline]{align-items:baseline}.kb-grid[data-align=stretch]{align-items:stretch}}
+@layer kbui.components{.kb-grid{--_grid-min-width:var(--kb-grid-min-item-width);--_grid-gap:var(--kb-grid-gap);grid-template-columns:repeat(auto-fit, minmax(min(100%, var(--_grid-min-width)), 1fr));gap:var(--_grid-gap);overflow-wrap:anywhere;align-items:stretch;min-inline-size:0;margin:0;padding:0;list-style:none;display:grid}.kb-grid>*{min-inline-size:0;max-inline-size:100%;margin:0}.kb-grid[data-min-item-width=sm]{--_grid-min-width:var(--kb-grid-min-item-width-sm)}.kb-grid[data-min-item-width=md]{--_grid-min-width:var(--kb-grid-min-item-width-md)}.kb-grid[data-min-item-width=lg]{--_grid-min-width:var(--kb-grid-min-item-width-lg)}.kb-grid[data-columns="2"]{--_grid-columns:2}.kb-grid[data-columns="3"]{--_grid-columns:3}.kb-grid[data-columns="4"]{--_grid-columns:4}.kb-grid:is([data-columns="2"],[data-columns="3"],[data-columns="4"]){grid-template-columns:repeat(auto-fill, minmax(min(100%, max(calc((100% - (var(--_grid-columns) - 1) * var(--_grid-gap)) / var(--_grid-columns) - .5px), calc((30rem - 100%) * 99999))), 1fr))}.kb-grid[data-layout=stack],.kb-grid[data-columns="1"]{grid-template-columns:minmax(0,1fr)}.kb-grid[data-gap=none]{--_grid-gap:0px}.kb-grid[data-gap=sm]{--_grid-gap:var(--kb-layout-gap-sm)}.kb-grid[data-gap=md]{--_grid-gap:var(--kb-layout-gap-md)}.kb-grid[data-gap=lg]{--_grid-gap:var(--kb-layout-gap-lg)}.kb-grid[data-align=start]{align-items:start}.kb-grid[data-align=center]{align-items:center}.kb-grid[data-align=end]{align-items:end}.kb-grid[data-align=baseline]{align-items:baseline}.kb-grid[data-align=stretch]{align-items:stretch}}

package/dist/components/inline.css

@@ -1 +1 @@
-@layer kbui.components{.kb-inline{gap:var(--kb-layout-gap-md);overflow-wrap:anywhere;flex-wrap:wrap;justify-content:flex-start;align-items:center;min-inline-size:0;display:flex}.kb-inline>*{min-inline-size:0;max-inline-size:100%}.kb-inline[data-gap=none]{gap:0}.kb-inline[data-gap=sm]{gap:var(--kb-layout-gap-sm)}.kb-inline[data-gap=lg]{gap:var(--kb-layout-gap-lg)}.kb-inline[data-align=start]{align-items:flex-start}.kb-inline[data-align=end]{align-items:flex-end}.kb-inline[data-align=baseline]{align-items:baseline}.kb-inline[data-align=stretch]{align-items:stretch}.kb-inline[data-justify=center]{justify-content:center}.kb-inline[data-justify=end]{justify-content:flex-end}.kb-inline[data-justify=between]{justify-content:space-between}}
+@layer kbui.components{.kb-inline{gap:var(--kb-layout-gap-md);overflow-wrap:anywhere;flex-wrap:wrap;justify-content:flex-start;align-items:center;min-inline-size:0;display:flex}.kb-inline>*{min-inline-size:0;max-inline-size:100%}.kb-inline>li{margin-block:0}.kb-inline[data-gap=none]{gap:0}.kb-inline[data-gap=sm]{gap:var(--kb-layout-gap-sm)}.kb-inline[data-gap=lg]{gap:var(--kb-layout-gap-lg)}.kb-inline[data-align=start]{align-items:flex-start}.kb-inline[data-align=end]{align-items:flex-end}.kb-inline[data-align=baseline]{align-items:baseline}.kb-inline[data-align=stretch]{align-items:stretch}.kb-inline[data-justify=center]{justify-content:center}.kb-inline[data-justify=end]{justify-content:flex-end}.kb-inline[data-justify=between]{justify-content:space-between}}

package/dist/components/pageheader.css

@@ -0,0 +1 @@
+@layer kbui.components{.kb-pageheader{--_pageheader-title-size:var(--kb-pageheader-title-size-md);--_pageheader-description-size:var(--kb-text-body-size);gap:var(--kb-pageheader-gap);inline-size:100%;min-inline-size:0;color:var(--kb-color-fg);font-family:var(--kb-font-sans);flex-direction:column;display:flex;container:kb-pageheader/inline-size}.kb-pageheader[data-size=sm]{--_pageheader-title-size:var(--kb-pageheader-title-size-sm);--_pageheader-description-size:var(--kb-text-small-size)}.kb-pageheader[data-size=md]{--_pageheader-title-size:var(--kb-pageheader-title-size-md)}.kb-pageheader[data-size=lg]{--_pageheader-title-size:var(--kb-pageheader-title-size-lg)}.kb-pageheader[data-divider]{border-block-end:1px solid var(--kb-pageheader-divider);padding-block-end:var(--kb-pageheader-divider-gap)}.kb-pageheader-navigation{align-items:center;gap:var(--kb-pageheader-actions-gap);min-inline-size:0;font-size:var(--kb-text-small-size);line-height:var(--kb-text-leading-control);color:var(--kb-color-muted);flex-wrap:wrap;display:flex}.kb-pageheader-main{justify-content:space-between;align-items:flex-start;gap:var(--kb-pageheader-main-gap);flex-wrap:wrap;min-inline-size:0;display:flex}.kb-pageheader-heading{flex:1 1 var(--kb-pageheader-heading-min-width);gap:var(--kb-pageheader-heading-gap);flex-direction:column;min-inline-size:0;display:flex}.kb-pageheader-eyebrow{font-family:var(--kb-font-mono);font-size:var(--kb-text-caption-size);font-weight:var(--kb-font-weight-strong);letter-spacing:.06em;text-transform:uppercase;color:var(--kb-color-muted);margin:0}.kb-pageheader-headline{align-items:center;gap:var(--kb-pageheader-headline-gap);flex-wrap:wrap;min-inline-size:0;display:flex}.kb-pageheader-title{min-inline-size:0;font-size:var(--_pageheader-title-size);font-weight:var(--kb-heading-weight);line-height:var(--kb-heading-leading);letter-spacing:var(--kb-heading-tracking);color:var(--kb-color-fg);overflow-wrap:anywhere;text-wrap:balance;margin:0}.kb-pageheader-meta{align-items:center;gap:var(--kb-pageheader-actions-gap);flex-wrap:wrap;min-inline-size:0;display:inline-flex}.kb-pageheader-description{max-inline-size:var(--kb-pageheader-description-max-width);font-size:var(--_pageheader-description-size);line-height:var(--kb-text-leading-body);color:var(--kb-color-muted);overflow-wrap:anywhere;margin:0}.kb-pageheader-actions{justify-content:flex-end;align-items:center;gap:var(--kb-pageheader-actions-gap);flex-wrap:wrap;flex:0 auto;min-inline-size:0;margin-inline-start:auto;display:flex}@container kb-pageheader (width<40rem){.kb-pageheader-actions{flex-basis:100%}}.kb-pageheader-body{min-inline-size:0}}

package/dist/components/panel.css

@@ -1 +1 @@
-@layer kbui.components{.kb-panel{--_panel-bg:var(--kb-panel-background);--_panel-seam:var(--kb-panel-border);--_panel-rim-top:var(--kb-panel-rim-top);--_panel-rim-bottom:var(--kb-panel-rim-bottom);--_panel-highlight:var(--kb-panel-highlight);--_panel-sheen:var(--kb-panel-sheen);--_panel-shadow:var(--kb-panel-shadow);--_panel-glow:var(--kb-panel-glow);--_panel-rail:var(--kb-panel-rail);--_panel-gap:var(--kb-space-3);--_panel-pad:var(--kb-panel-padding);isolation:isolate;gap:var(--_panel-gap);padding:var(--_panel-pad);border-radius:var(--kb-panel-radius);color:var(--kb-color-fg);flex-direction:column;display:flex;position:relative}.kb-panel-glow{z-index:-2;background:radial-gradient(closest-side, var(--_panel-glow), transparent);filter:blur(var(--kb-panel-glow-blur));pointer-events:none;border-radius:50%;position:absolute;inset:15% 4% 0}.kb-panel-plate{z-index:-1;border-radius:inherit;background:linear-gradient(to bottom, var(--_panel-sheen), transparent 55%), var(--_panel-bg);box-shadow:inset 0 1px 0 var(--_panel-highlight), var(--_panel-shadow);backdrop-filter:var(--kb-panel-backdrop);pointer-events:none;transition:background-color var(--kb-motion-duration-base) var(--kb-motion-easing-standard);position:absolute;inset:0;overflow:hidden}.kb-panel-plate:before{content:"";z-index:1;padding:var(--kb-panel-seam);border-radius:inherit;background:linear-gradient(to bottom, var(--_panel-rim-top), var(--_panel-seam) 40%, var(--_panel-seam) 70%, var(--_panel-rim-bottom));position:absolute;inset:0;mask-image:linear-gradient(#000 0 0),linear-gradient(#000 0 0);mask-position:0 0,0 0;mask-size:auto,auto;mask-repeat:repeat,repeat;mask-clip:content-box,border-box;mask-origin:content-box,border-box;mask-composite:exclude;mask-mode:match-source,match-source}.kb-panel[data-tone=quiet]{--_panel-bg:transparent;--_panel-seam:color-mix(in oklab, var(--kb-panel-border) 60%, transparent);--_panel-rim-top:var(--_panel-seam);--_panel-rim-bottom:var(--_panel-seam);--_panel-highlight:transparent;--_panel-sheen:transparent;--_panel-shadow:none;--_panel-glow:transparent}.kb-panel[data-tone=sunken]{--_panel-bg:var(--kb-panel-background-sunken);--_panel-rim-top:var(--kb-panel-border);--_panel-highlight:transparent;--_panel-shadow:var(--kb-material-field-shadow)}.kb-panel[data-tone=active]{--_panel-bg:var(--kb-panel-background-active);--_panel-rim-top:var(--kb-panel-border-active);--_panel-seam:color-mix(in oklab, var(--kb-panel-border-active) 35%, var(--kb-panel-border));--_panel-rail:var(--kb-panel-rail-active);--_panel-shadow:var(--kb-panel-shadow-active);--_panel-glow:var(--kb-panel-glow-active)}.kb-panel[data-tone=critical]{--_panel-rim-top:var(--kb-panel-border-critical);--_panel-seam:color-mix(in oklab, var(--kb-panel-border-critical) 35%, var(--kb-panel-border));--_panel-rail:var(--kb-panel-border-critical);--_panel-glow:var(--kb-panel-glow-critical)}.kb-panel[data-density=compact],.kb-panel[data-nested]{--_panel-gap:var(--kb-space-2);--_panel-pad:calc(var(--kb-panel-padding) / 2)}.kb-panel[data-nested]{--_panel-shadow:none;--_panel-glow:transparent}.kb-panel-rail{background:var(--_panel-rail);width:2px;position:absolute;inset-block:0;inset-inline-start:0}.kb-panel[data-rail=accent] .kb-panel-rail{background:var(--kb-panel-rail-active)}.kb-panel[data-rail=accent],.kb-panel[data-rail=status]{padding-inline-start:calc(var(--_panel-pad) + 2px)}.kb-panel-header{justify-content:space-between;align-items:center;gap:var(--kb-space-2);font-weight:var(--kb-font-weight-strong);flex-wrap:wrap;display:flex;position:relative}.kb-panel-header:after{content:"";inset-inline:calc(var(--kb-panel-seam) - var(--_panel-pad));background:var(--kb-panel-divider);pointer-events:none;height:1px;position:absolute;inset-block-end:calc(var(--_panel-gap) / -2)}.kb-panel[data-closed]>.kb-panel-header:after{display:none}:where(.kb-panel-header) :where(h1,h2,h3,h4,h5,h6){font-size:var(--kb-panel-title-size);font-weight:var(--kb-font-weight-strong);letter-spacing:-.015em;margin:0;line-height:1.35}.kb-panel-toolbar{align-items:center;gap:var(--kb-space-1);flex-wrap:wrap;margin-inline-start:auto;display:flex}.kb-panel-toggle{align-items:center;gap:var(--kb-space-1);height:var(--kb-panel-toggle-height);padding:0 var(--kb-space-2);border-radius:var(--kb-button-radius);background:var(--kb-material-raised-face);color:var(--kb-color-fg);font:inherit;font-size:var(--kb-size-sm);font-weight:var(--kb-font-weight-medium);cursor:pointer;border:1px solid #0000;border-color:var(--kb-material-raised-border);box-shadow:var(--kb-material-raised-shadow);display:inline-flex}.kb-panel-toggle:hover{border-color:var(--kb-color-muted)}.kb-panel-toggle:focus-visible{outline:2px solid var(--kb-color-ring);outline-offset:2px}.kb-panel-body{gap:var(--kb-space-2);min-width:0;font-size:var(--kb-text-body-size);line-height:var(--kb-text-leading-body);flex-direction:column;display:flex}.kb-panel-well{min-width:0;padding:var(--kb-space-3);border-radius:var(--kb-panel-well-radius);background:var(--kb-panel-well);box-shadow:var(--kb-panel-well-shadow);border:1px solid var(--kb-material-soft-border)}.kb-panel-footer{justify-content:flex-end;align-items:center;gap:var(--kb-space-2);flex-wrap:wrap;display:flex}.kb-panel-group{gap:var(--kb-space-3);flex-direction:column;display:flex}.kb-panel-group[data-direction=row]{flex-flow:wrap}.kb-panel-group[data-direction=row]>.kb-panel{flex:16rem;min-width:0}@media (prefers-reduced-motion:reduce){.kb-panel-plate{transition:none}}.kb-panel-toggle:active{box-shadow:var(--kb-material-pressed-shadow)}.kb-panel-group:has(>.kb-panel-handle){flex-wrap:nowrap;gap:0}.kb-panel-group:has(>.kb-panel-handle)>.kb-panel{flex:1 1 0;min-width:0;min-height:0}.kb-panel-group>.kb-panel:has(+.kb-panel-handle){flex:0 0 var(--kb-panel-size,50%)}.kb-panel-handle{flex:0 0 var(--kb-panel-handle-size);touch-action:none;user-select:none;justify-content:center;align-items:center;display:flex;position:relative}.kb-panel-handle:before{content:"";position:absolute;inset:0}.kb-panel-handle[data-orientation=vertical]{cursor:col-resize}.kb-panel-handle[data-orientation=vertical]:before{inset-inline:calc((var(--kb-panel-handle-hit) - var(--kb-panel-handle-size)) / -2)}.kb-panel-handle[data-orientation=horizontal]{cursor:row-resize}.kb-panel-handle[data-orientation=horizontal]:before{inset-block:calc((var(--kb-panel-handle-hit) - var(--kb-panel-handle-size)) / -2)}.kb-panel-handle:after{content:"";border-radius:var(--kb-radius-full);background:var(--kb-panel-handle-line);transition:background var(--kb-motion-duration-fast) var(--kb-motion-easing-standard)}.kb-panel-handle[data-orientation=vertical]:after{width:var(--kb-panel-handle-line-width);height:var(--kb-panel-handle-grip)}.kb-panel-handle[data-orientation=horizontal]:after{width:var(--kb-panel-handle-grip);height:var(--kb-panel-handle-line-width)}.kb-panel-handle:hover:after,.kb-panel-handle[data-dragging]:after{background:var(--kb-panel-handle-line-active)}.kb-panel-handle:focus-visible{outline:2px solid var(--kb-color-ring);outline-offset:2px;border-radius:var(--kb-radius-sm)}@media (prefers-reduced-motion:reduce){.kb-panel-handle:after{transition:none}}@media (forced-colors:active){.kb-panel-handle:after{background:buttontext}.kb-panel-handle:hover:after,.kb-panel-handle[data-dragging]:after{background:highlight}}}
+@layer kbui.components{.kb-panel{--_panel-bg:var(--kb-panel-background);--_panel-seam:var(--kb-panel-border);--_panel-rim-top:var(--kb-panel-rim-top);--_panel-rim-bottom:var(--kb-panel-rim-bottom);--_panel-highlight:var(--kb-panel-highlight);--_panel-sheen:var(--kb-panel-sheen);--_panel-shadow:var(--kb-panel-shadow);--_panel-glow:var(--kb-panel-glow);--_panel-rail:var(--kb-panel-rail);--_panel-gap:var(--kb-space-3);--_panel-pad:var(--kb-panel-padding);isolation:isolate;gap:var(--_panel-gap);padding:var(--_panel-pad);border-radius:var(--kb-panel-radius);color:var(--kb-color-fg);flex-direction:column;display:flex;position:relative}.kb-panel-glow{z-index:-2;background:radial-gradient(closest-side, var(--_panel-glow), transparent);filter:blur(var(--kb-panel-glow-blur));pointer-events:none;border-radius:50%;position:absolute;inset:15% 4% 0}.kb-panel-plate{z-index:-1;border-radius:inherit;background:linear-gradient(to bottom, var(--_panel-sheen), transparent 55%), var(--_panel-bg);box-shadow:inset 0 1px 0 var(--_panel-highlight), var(--_panel-shadow);backdrop-filter:var(--kb-panel-backdrop);pointer-events:none;transition:background-color var(--kb-motion-duration-base) var(--kb-motion-easing-standard);position:absolute;inset:0;overflow:hidden}.kb-panel[data-opaque]>.kb-panel-plate{background:linear-gradient(to bottom, var(--_panel-sheen), transparent 55%), linear-gradient(var(--_panel-bg) 0 0), var(--kb-panel-background-opaque);backdrop-filter:none}.kb-panel-plate:before{content:"";z-index:1;padding:var(--kb-panel-seam);border-radius:inherit;background:linear-gradient(to bottom, var(--_panel-rim-top), var(--_panel-seam) 40%, var(--_panel-seam) 70%, var(--_panel-rim-bottom));position:absolute;inset:0;mask-image:linear-gradient(#000 0 0),linear-gradient(#000 0 0);mask-position:0 0,0 0;mask-size:auto,auto;mask-repeat:repeat,repeat;mask-clip:content-box,border-box;mask-origin:content-box,border-box;mask-composite:exclude;mask-mode:match-source,match-source}.kb-panel[data-tone=quiet]{--_panel-bg:transparent;--_panel-seam:color-mix(in oklab, var(--kb-panel-border) 60%, transparent);--_panel-rim-top:var(--_panel-seam);--_panel-rim-bottom:var(--_panel-seam);--_panel-highlight:transparent;--_panel-sheen:transparent;--_panel-shadow:none;--_panel-glow:transparent}.kb-panel[data-tone=sunken]{--_panel-bg:var(--kb-panel-background-sunken);--_panel-rim-top:var(--kb-panel-border);--_panel-highlight:transparent;--_panel-shadow:var(--kb-material-field-shadow)}.kb-panel[data-tone=active]{--_panel-bg:var(--kb-panel-background-active);--_panel-rim-top:var(--kb-panel-border-active);--_panel-seam:color-mix(in oklab, var(--kb-panel-border-active) 35%, var(--kb-panel-border));--_panel-rail:var(--kb-panel-rail-active);--_panel-shadow:var(--kb-panel-shadow-active);--_panel-glow:var(--kb-panel-glow-active)}.kb-panel[data-tone=critical]{--_panel-rim-top:var(--kb-panel-border-critical);--_panel-seam:color-mix(in oklab, var(--kb-panel-border-critical) 35%, var(--kb-panel-border));--_panel-rail:var(--kb-panel-border-critical);--_panel-glow:var(--kb-panel-glow-critical)}.kb-panel[data-density=compact],.kb-panel[data-nested]{--_panel-gap:var(--kb-space-2);--_panel-pad:calc(var(--kb-panel-padding) / 2)}.kb-panel[data-nested]{--_panel-shadow:none;--_panel-glow:transparent}.kb-panel-rail{background:var(--_panel-rail);width:2px;position:absolute;inset-block:0;inset-inline-start:0}.kb-panel[data-rail=accent] .kb-panel-rail{background:var(--kb-panel-rail-active)}.kb-panel[data-rail=accent],.kb-panel[data-rail=status]{padding-inline-start:calc(var(--_panel-pad) + 2px)}.kb-panel-header{justify-content:space-between;align-items:center;gap:var(--kb-space-2);font-weight:var(--kb-font-weight-strong);flex-wrap:wrap;display:flex;position:relative}.kb-panel-header:after{content:"";inset-inline:calc(var(--kb-panel-seam) - var(--_panel-pad));background:var(--kb-panel-divider);pointer-events:none;height:1px;position:absolute;inset-block-end:calc(var(--_panel-gap) / -2)}.kb-panel[data-closed]>.kb-panel-header:after{display:none}:where(.kb-panel-header) :where(h1,h2,h3,h4,h5,h6){font-size:var(--kb-panel-title-size);font-weight:var(--kb-font-weight-strong);letter-spacing:-.015em;margin:0;line-height:1.35}.kb-panel-toolbar{align-items:center;gap:var(--kb-space-1);flex-wrap:wrap;margin-inline-start:auto;display:flex}.kb-panel-toggle{align-items:center;gap:var(--kb-space-1);height:var(--kb-panel-toggle-height);padding:0 var(--kb-space-2);border-radius:var(--kb-button-radius);background:var(--kb-material-raised-face);color:var(--kb-color-fg);font:inherit;font-size:var(--kb-size-sm);font-weight:var(--kb-font-weight-medium);cursor:pointer;border:1px solid #0000;border-color:var(--kb-material-raised-border);box-shadow:var(--kb-material-raised-shadow);display:inline-flex}.kb-panel-header>.kb-panel-toggle{margin-inline-start:auto}.kb-panel-toggle:hover{border-color:var(--kb-color-muted)}.kb-panel-toggle:focus-visible{outline:2px solid var(--kb-color-ring);outline-offset:2px}.kb-panel-body{gap:var(--kb-space-2);min-width:0;font-size:var(--kb-text-body-size);line-height:var(--kb-text-leading-body);flex-direction:column;display:flex}.kb-panel-well{min-width:0;padding:var(--kb-space-3);border-radius:var(--kb-panel-well-radius);background:var(--kb-panel-well);box-shadow:var(--kb-panel-well-shadow);border:1px solid var(--kb-material-soft-border)}.kb-panel-footer{justify-content:flex-end;align-items:center;gap:var(--kb-space-2);flex-wrap:wrap;display:flex}.kb-panel-group{gap:var(--kb-space-3);flex-direction:column;display:flex}.kb-panel-group[data-direction=row]{flex-flow:wrap}.kb-panel-group[data-direction=row]>.kb-panel{flex:16rem;min-width:0}@media (prefers-reduced-motion:reduce){.kb-panel-plate{transition:none}}.kb-panel-toggle:active{box-shadow:var(--kb-material-pressed-shadow)}.kb-panel-group:has(>.kb-panel-handle){flex-wrap:nowrap;gap:0}.kb-panel-group:has(>.kb-panel-handle)>.kb-panel{flex:1 1 0;min-width:0;min-height:0}.kb-panel-group>.kb-panel:has(+.kb-panel-handle){flex:0 0 var(--kb-panel-size,50%)}.kb-panel-handle{flex:0 0 var(--kb-panel-handle-size);touch-action:none;user-select:none;justify-content:center;align-items:center;display:flex;position:relative}.kb-panel-handle:before{content:"";position:absolute;inset:0}.kb-panel-handle[data-orientation=vertical]{cursor:col-resize}.kb-panel-handle[data-orientation=vertical]:before{inset-inline:calc((var(--kb-panel-handle-hit) - var(--kb-panel-handle-size)) / -2)}.kb-panel-handle[data-orientation=horizontal]{cursor:row-resize}.kb-panel-handle[data-orientation=horizontal]:before{inset-block:calc((var(--kb-panel-handle-hit) - var(--kb-panel-handle-size)) / -2)}.kb-panel-handle:after{content:"";border-radius:var(--kb-radius-full);background:var(--kb-panel-handle-line);transition:background var(--kb-motion-duration-fast) var(--kb-motion-easing-standard)}.kb-panel-handle[data-orientation=vertical]:after{width:var(--kb-panel-handle-line-width);height:var(--kb-panel-handle-grip)}.kb-panel-handle[data-orientation=horizontal]:after{width:var(--kb-panel-handle-grip);height:var(--kb-panel-handle-line-width)}.kb-panel-handle:hover:after,.kb-panel-handle[data-dragging]:after{background:var(--kb-panel-handle-line-active)}.kb-panel-handle:focus-visible{outline:2px solid var(--kb-color-ring);outline-offset:2px;border-radius:var(--kb-radius-sm)}@media (prefers-reduced-motion:reduce){.kb-panel-handle:after{transition:none}}@media (forced-colors:active){.kb-panel-handle:after{background:buttontext}.kb-panel-handle:hover:after,.kb-panel-handle[data-dragging]:after{background:highlight}}}

package/dist/components/settings.css

@@ -0,0 +1 @@
+@layer kbui.components{.kb-settings{gap:var(--kb-settings-gap);grid-template-columns:minmax(0,1fr);min-inline-size:0;display:grid;container:kb-settings/inline-size}.kb-settings-header{gap:var(--kb-space-2);min-inline-size:0;display:grid}.kb-settings-sections{gap:var(--kb-settings-gap);grid-template-columns:minmax(0,1fr);min-inline-size:0;display:grid}.kb-settings-sections>*+*{border-block-start:1px solid var(--kb-settings-divider);padding-block-start:var(--kb-settings-gap)}.kb-settings .kb-collectionrow-aside{text-align:end}.kb-settings .kb-collectionrow-actions{justify-content:flex-end}@container kb-settings (width>=40rem){.kb-settings .kb-collectionrow-layout{grid-template-columns:var(--_collectionrow-leading) minmax(0, 1fr) auto}.kb-settings .kb-collectionrow-aside{flex-wrap:wrap;grid-column:3;justify-content:flex-end;align-items:center;padding-inline-start:var(--kb-collectionrow-gap);display:flex}}@media (forced-colors:active){.kb-settings-sections>*+*{border-block-start-color:canvastext}}}

package/dist/components/skeleton.css

@@ -1 +1 @@
-@layer kbui.components{@keyframes kb-skeleton-shimmer{0%{transform:translate(-100%)}to{transform:translate(100%)}}@keyframes kb-skeleton-pulse{0%,to{opacity:1}50%{opacity:.48}}.kb-skeleton{--_skeleton-height:var(--kb-skeleton-height-md);--_skeleton-radius:var(--kb-skeleton-radius-sm);--_skeleton-avatar-size:var(--kb-skeleton-avatar-size-md);--_skeleton-base:var(--kb-skeleton-base);--_skeleton-highlight:var(--kb-skeleton-highlight);--_skeleton-border:var(--kb-skeleton-border);gap:var(--kb-skeleton-gap);flex-direction:column;inline-size:100%;min-inline-size:0;display:flex}.kb-skeleton[data-size=sm]{--_skeleton-height:var(--kb-skeleton-height-sm);--_skeleton-avatar-size:var(--kb-skeleton-avatar-size-sm)}.kb-skeleton[data-size=md]{--_skeleton-height:var(--kb-skeleton-height-md);--_skeleton-avatar-size:var(--kb-skeleton-avatar-size-md)}.kb-skeleton[data-size=lg]{--_skeleton-height:var(--kb-skeleton-height-lg);--_skeleton-avatar-size:var(--kb-skeleton-avatar-size-lg)}.kb-skeleton[data-tone=subtle]{--_skeleton-base:color-mix(in oklab, var(--kb-skeleton-base) 58%, transparent);--_skeleton-border:color-mix(in oklab, var(--kb-skeleton-border) 55%, transparent)}.kb-skeleton[data-tone=accent]{--_skeleton-base:color-mix(in oklab, var(--kb-color-accent) 10%, var(--kb-skeleton-base));--_skeleton-highlight:color-mix(in oklab, var(--kb-color-accent) 24%, var(--kb-skeleton-highlight));--_skeleton-border:color-mix(in oklab, var(--kb-color-accent) 32%, var(--kb-skeleton-border))}.kb-skeleton-line{inline-size:100%;block-size:var(--_skeleton-height);border-radius:var(--_skeleton-radius);background:var(--_skeleton-base);border:1px solid var(--_skeleton-border);box-shadow:var(--kb-material-inlay-shadow);display:block;position:relative;overflow:hidden}.kb-skeleton[data-variant=text] .kb-skeleton-line:last-child:not(:first-child){inline-size:72%}.kb-skeleton[data-variant=rect]{--_skeleton-radius:var(--kb-skeleton-radius-md)}.kb-skeleton[data-variant=rect] .kb-skeleton-line{block-size:var(--kb-skeleton-block-height)}.kb-skeleton[data-variant=circle]{--_skeleton-radius:var(--kb-skeleton-radius-full);inline-size:var(--_skeleton-avatar-size);flex:none}.kb-skeleton[data-variant=circle] .kb-skeleton-line{inline-size:var(--_skeleton-avatar-size);block-size:var(--_skeleton-avatar-size)}.kb-skeleton[data-variant=pill]{--_skeleton-radius:var(--kb-skeleton-radius-full);inline-size:var(--kb-skeleton-pill-width)}.kb-skeleton[data-animated] .kb-skeleton-line:after{content:"";background:linear-gradient(105deg, transparent 18%, color-mix(in oklab, var(--_skeleton-highlight) 85%, transparent) 45%, var(--kb-skeleton-sheen) 50%, color-mix(in oklab, var(--_skeleton-highlight) 85%, transparent) 55%, transparent 82%);animation:kb-skeleton-shimmer var(--kb-skeleton-duration) var(--kb-skeleton-easing) infinite;position:absolute;inset:0;transform:translate(-100%)}.kb-skeleton[data-animation=pulse][data-animated] .kb-skeleton-line{animation:kb-skeleton-pulse var(--kb-skeleton-pulse-duration) var(--kb-skeleton-easing) infinite}.kb-skeleton[data-animation=pulse][data-animated] .kb-skeleton-line:after{display:none}.kb-skeleton[data-animation=wave][data-animated] .kb-skeleton-line{animation:kb-skeleton-pulse var(--kb-skeleton-pulse-duration) var(--kb-skeleton-easing) infinite}.kb-skeleton[data-animation=wave][data-animated] .kb-skeleton-line:nth-child(2),.kb-skeleton[data-animation=wave][data-animated] .kb-skeleton-line:nth-child(2):after{animation-delay:var(--kb-skeleton-stagger)}.kb-skeleton[data-animation=wave][data-animated] .kb-skeleton-line:nth-child(3),.kb-skeleton[data-animation=wave][data-animated] .kb-skeleton-line:nth-child(3):after{animation-delay:calc(var(--kb-skeleton-stagger) * 2)}.kb-skeleton[data-animation=wave][data-animated] .kb-skeleton-line:nth-child(4),.kb-skeleton[data-animation=wave][data-animated] .kb-skeleton-line:nth-child(4):after{animation-delay:calc(var(--kb-skeleton-stagger) * 3)}.kb-skeleton[data-loaded]{display:contents}.kb-skeleton-content{min-inline-size:0}@media (prefers-reduced-motion:reduce){.kb-skeleton[data-animated] .kb-skeleton-line,.kb-skeleton[data-animation=pulse][data-animated] .kb-skeleton-line,.kb-skeleton[data-animation=wave][data-animated] .kb-skeleton-line{animation:none}.kb-skeleton[data-animated] .kb-skeleton-line:after{background:0 0;animation:none;transform:none}}@media (forced-colors:active){.kb-skeleton-line{box-shadow:none;background:canvas;border:1px solid graytext}.kb-skeleton[data-animated] .kb-skeleton-line,.kb-skeleton[data-animation=pulse][data-animated] .kb-skeleton-line,.kb-skeleton[data-animation=wave][data-animated] .kb-skeleton-line{animation:none}.kb-skeleton[data-animated] .kb-skeleton-line:after{display:none}}}
+@layer kbui.components{@keyframes kb-skeleton-shimmer{0%,10%{transform:translate(-100%)}85%,to{transform:translate(100%)}}@keyframes kb-skeleton-pulse{0%,to{opacity:1}50%{opacity:.76}}.kb-skeleton{--_skeleton-height:var(--kb-skeleton-height-md);--_skeleton-radius:var(--kb-skeleton-radius-sm);--_skeleton-avatar-size:var(--kb-skeleton-avatar-size-md);--_skeleton-base:var(--kb-skeleton-base);--_skeleton-highlight:var(--kb-skeleton-highlight);--_skeleton-border:var(--kb-skeleton-border);gap:var(--kb-skeleton-gap);flex-direction:column;inline-size:100%;min-inline-size:0;display:flex}.kb-skeleton[data-size=sm]{--_skeleton-height:var(--kb-skeleton-height-sm);--_skeleton-avatar-size:var(--kb-skeleton-avatar-size-sm)}.kb-skeleton[data-size=md]{--_skeleton-height:var(--kb-skeleton-height-md);--_skeleton-avatar-size:var(--kb-skeleton-avatar-size-md)}.kb-skeleton[data-size=lg]{--_skeleton-height:var(--kb-skeleton-height-lg);--_skeleton-avatar-size:var(--kb-skeleton-avatar-size-lg)}.kb-skeleton[data-tone=subtle]{--_skeleton-base:color-mix(in oklab, var(--kb-skeleton-base) 58%, transparent);--_skeleton-border:color-mix(in oklab, var(--kb-skeleton-border) 55%, transparent)}.kb-skeleton[data-tone=accent]{--_skeleton-base:color-mix(in oklab, var(--kb-color-accent) 10%, var(--kb-skeleton-base));--_skeleton-highlight:color-mix(in oklab, var(--kb-color-accent) 24%, var(--kb-skeleton-highlight));--_skeleton-border:color-mix(in oklab, var(--kb-color-accent) 32%, var(--kb-skeleton-border))}.kb-skeleton-line{inline-size:100%;block-size:var(--_skeleton-height);border-radius:var(--_skeleton-radius);background:var(--_skeleton-base);border:1px solid var(--_skeleton-border);box-shadow:var(--kb-material-inlay-shadow);display:block;position:relative;overflow:hidden}.kb-skeleton[data-variant=text] .kb-skeleton-line:last-child:not(:first-child){inline-size:72%}.kb-skeleton[data-variant=rect]{--_skeleton-radius:var(--kb-skeleton-radius-md)}.kb-skeleton[data-variant=rect] .kb-skeleton-line{block-size:var(--kb-skeleton-block-height)}.kb-skeleton[data-variant=circle]{--_skeleton-radius:var(--kb-skeleton-radius-full);inline-size:var(--_skeleton-avatar-size);flex:none}.kb-skeleton[data-variant=circle] .kb-skeleton-line{inline-size:var(--_skeleton-avatar-size);block-size:var(--_skeleton-avatar-size)}.kb-skeleton[data-variant=pill]{--_skeleton-radius:var(--kb-skeleton-radius-full);inline-size:var(--kb-skeleton-pill-width)}.kb-skeleton[data-animated] .kb-skeleton-line:after{content:"";background:linear-gradient(105deg, transparent 12%, color-mix(in oklab, var(--_skeleton-highlight) 35%, transparent) 32%, var(--_skeleton-highlight) 47%, var(--kb-skeleton-sheen) 50%, var(--_skeleton-highlight) 53%, color-mix(in oklab, var(--_skeleton-highlight) 35%, transparent) 68%, transparent 88%);animation:kb-skeleton-shimmer var(--kb-skeleton-duration) var(--kb-skeleton-easing) infinite;position:absolute;inset:0;transform:translate(-100%)}.kb-skeleton[data-animation=pulse][data-animated] .kb-skeleton-line{animation:kb-skeleton-pulse var(--kb-skeleton-pulse-duration) var(--kb-skeleton-easing) infinite}.kb-skeleton[data-animation=pulse][data-animated] .kb-skeleton-line:after{display:none}.kb-skeleton[data-animation=wave][data-animated] .kb-skeleton-line{animation:kb-skeleton-pulse var(--kb-skeleton-pulse-duration) var(--kb-skeleton-easing) infinite}.kb-skeleton[data-animation=wave][data-animated] .kb-skeleton-line:nth-child(2),.kb-skeleton[data-animation=wave][data-animated] .kb-skeleton-line:nth-child(2):after{animation-delay:var(--kb-skeleton-stagger)}.kb-skeleton[data-animation=wave][data-animated] .kb-skeleton-line:nth-child(3),.kb-skeleton[data-animation=wave][data-animated] .kb-skeleton-line:nth-child(3):after{animation-delay:calc(var(--kb-skeleton-stagger) * 2)}.kb-skeleton[data-animation=wave][data-animated] .kb-skeleton-line:nth-child(4),.kb-skeleton[data-animation=wave][data-animated] .kb-skeleton-line:nth-child(4):after{animation-delay:calc(var(--kb-skeleton-stagger) * 3)}.kb-skeleton[data-loaded]{display:contents}.kb-skeleton-content{min-inline-size:0}@property --_skeleton-sweep{syntax:"<percentage>";inherits:true;initial-value:100%}@property --_skeleton-fade{syntax:"<number>";inherits:true;initial-value:1}@keyframes kb-skeleton-sweep{0%,10%{--_skeleton-sweep:100%}85%,to{--_skeleton-sweep:0%}}@keyframes kb-skeleton-fade{0%,to{--_skeleton-fade:1}50%{--_skeleton-fade:.76}}.kb-skeleton[data-variant=auto]{display:contents}.kb-skeleton[data-variant=auto][data-animated]:not([data-loaded])>.kb-skeleton-content{animation:kb-skeleton-sweep var(--kb-skeleton-duration) var(--kb-skeleton-easing) infinite}.kb-skeleton[data-variant=auto][data-animation=pulse][data-animated]:not([data-loaded])>.kb-skeleton-content,.kb-skeleton[data-variant=auto][data-animation=wave][data-animated]:not([data-loaded])>.kb-skeleton-content{animation:kb-skeleton-fade var(--kb-skeleton-pulse-duration) var(--kb-skeleton-easing) infinite}.kb-skeleton[data-variant=auto]:not([data-loaded]) .kb-skeleton-content :is(.kb-avatar,.kb-button,.kb-badge,.kb-status,.kb-image,.kb-thumbnail-media,.kb-input-shell,.kb-textarea-control,.kb-select-control,.kb-checkbox-mark,.kb-heading,.kb-text,.kb-stat-label,.kb-stat-value,.kb-thumbnail-title,.kb-thumbnail-description,.kb-input-label,.kb-textarea-label,.kb-select-label,.kb-checkbox-label),.kb-skeleton[data-variant=auto]:not([data-loaded]) .kb-skeleton-content :is(h1,h2,h3,h4,h5,h6,p,li,dt,dd,label,figcaption):not([class*=kb-]){color:#0000;background-color:var(--_skeleton-base);background-image:linear-gradient(105deg, transparent 40%, var(--_skeleton-highlight) 50%, transparent 60%);background-position:var(--_skeleton-sweep) 0;border-color:var(--_skeleton-border);box-shadow:none;text-shadow:none;opacity:var(--_skeleton-fade);background-repeat:no-repeat;background-size:250% 100%}.kb-skeleton[data-variant=auto]:not([data-loaded]) .kb-skeleton-content :is(.kb-avatar,.kb-button,.kb-badge,.kb-status,.kb-image,.kb-thumbnail-media,.kb-input-shell,.kb-textarea-control,.kb-select-control,.kb-checkbox-mark,.kb-heading,.kb-text,.kb-stat-label,.kb-stat-value,.kb-thumbnail-title,.kb-thumbnail-description,.kb-input-label,.kb-textarea-label,.kb-select-label,.kb-checkbox-label):empty:before,.kb-skeleton[data-variant=auto]:not([data-loaded]) .kb-skeleton-content :is(h1,h2,h3,h4,h5,h6,p,li,dt,dd,label,figcaption):not([class*=kb-]):empty:before{content:" "}.kb-skeleton[data-variant=auto]:not([data-loaded]) .kb-skeleton-content :is(.kb-avatar,.kb-button,.kb-badge,.kb-status,.kb-image,.kb-thumbnail-media,.kb-input-shell,.kb-textarea-control,.kb-select-control,.kb-checkbox-mark)>*{visibility:hidden}.kb-skeleton[data-variant=auto]:not([data-loaded]) .kb-skeleton-content :is(.kb-avatar,.kb-button,.kb-badge,.kb-status,.kb-image,.kb-thumbnail-media,.kb-input-shell,.kb-textarea-control,.kb-select-control,.kb-checkbox-mark):empty{min-inline-size:var(--kb-skeleton-pill-width)}.kb-skeleton[data-variant=auto]:not([data-loaded]) .kb-skeleton-content :is(.kb-heading,.kb-text,.kb-stat-label,.kb-stat-value,.kb-thumbnail-title,.kb-thumbnail-description,.kb-input-label,.kb-textarea-label,.kb-select-label,.kb-checkbox-label),.kb-skeleton[data-variant=auto]:not([data-loaded]) .kb-skeleton-content :is(h1,h2,h3,h4,h5,h6,p,li,dt,dd,label,figcaption):not([class*=kb-]){border-radius:var(--_skeleton-radius);mask-image:repeating-linear-gradient(#0000 0 .15lh,#000 .15lh .85lh,#0000 .85lh 1lh)}.kb-skeleton[data-variant=auto]:not([data-loaded]) .kb-skeleton-content :is(.kb-heading,.kb-text,.kb-stat-label,.kb-stat-value,.kb-thumbnail-title,.kb-thumbnail-description,.kb-input-label,.kb-textarea-label,.kb-select-label,.kb-checkbox-label) *,.kb-skeleton[data-variant=auto]:not([data-loaded]) .kb-skeleton-content :is(h1,h2,h3,h4,h5,h6,p,li,dt,dd,label,figcaption):not([class*=kb-]) *{color:#0000;box-shadow:none;background:0 0;border-color:#0000}.kb-skeleton[data-variant=auto]:not([data-loaded]) .kb-skeleton-content :is(.kb-heading,h1,h2,h3,h4,h5,h6):empty{inline-size:55%}.kb-skeleton[data-variant=auto]:not([data-loaded]) .kb-skeleton-content :is(.kb-text,p):empty{inline-size:85%}@media (prefers-reduced-motion:reduce){.kb-skeleton[data-variant=auto][data-animation][data-animated]:not([data-loaded])>.kb-skeleton-content,.kb-skeleton[data-animated] .kb-skeleton-line,.kb-skeleton[data-animation=pulse][data-animated] .kb-skeleton-line,.kb-skeleton[data-animation=wave][data-animated] .kb-skeleton-line{animation:none}.kb-skeleton[data-animated] .kb-skeleton-line:after{background:0 0;animation:none;transform:none}}@media (forced-colors:active){.kb-skeleton[data-variant=auto][data-animation][data-animated]:not([data-loaded])>.kb-skeleton-content{animation:none}.kb-skeleton[data-variant=auto]:not([data-loaded]) .kb-skeleton-content :is(.kb-avatar,.kb-button,.kb-badge,.kb-status,.kb-image,.kb-thumbnail-media,.kb-input-shell,.kb-textarea-control,.kb-select-control,.kb-checkbox-mark,.kb-heading,.kb-text,.kb-stat-label,.kb-stat-value,.kb-thumbnail-title,.kb-thumbnail-description,.kb-input-label,.kb-textarea-label,.kb-select-label,.kb-checkbox-label),.kb-skeleton[data-variant=auto]:not([data-loaded]) .kb-skeleton-content :is(h1,h2,h3,h4,h5,h6,p,li,dt,dd,label,figcaption):not([class*=kb-]){forced-color-adjust:none;color:#0000;background:graytext}.kb-skeleton-line{box-shadow:none;background:canvas;border:1px solid graytext}.kb-skeleton[data-animated] .kb-skeleton-line,.kb-skeleton[data-animation=pulse][data-animated] .kb-skeleton-line,.kb-skeleton[data-animation=wave][data-animated] .kb-skeleton-line{animation:none}.kb-skeleton[data-animated] .kb-skeleton-line:after{display:none}}}

package/dist/components/spinner.css

@@ -1 +1 @@
-@layer kbui.components{@keyframes kb-spinner-rotate{to{transform:rotate(360deg)}}@keyframes kb-spinner-counter-rotate{to{transform:rotate(-360deg)}}@keyframes kb-spinner-pulse{0%,to{opacity:.35;transform:scale(.75)}50%{opacity:1;transform:scale(1)}}@keyframes kb-spinner-bar-wave{0%,to{opacity:.4;transform:scaleY(.45)}50%{opacity:1;transform:scaleY(1)}}.kb-spinner{--_spinner-size:var(--kb-spinner-size-md);--_spinner-ink:var(--kb-color-accent);vertical-align:middle;align-items:center;gap:var(--kb-spinner-gap);color:var(--kb-color-fg);font-family:var(--kb-font-sans);font-size:var(--kb-size-sm);line-height:1.25;display:inline-flex}.kb-spinner[data-size=sm]{--_spinner-size:var(--kb-spinner-size-sm);font-size:var(--kb-size-xs)}.kb-spinner[data-size=md]{--_spinner-size:var(--kb-spinner-size-md)}.kb-spinner[data-size=lg]{--_spinner-size:var(--kb-spinner-size-lg);font-size:var(--kb-size-md)}.kb-spinner[data-tone=current]{--_spinner-ink:currentColor;color:inherit}.kb-spinner[data-tone=accent]{--_spinner-ink:var(--kb-color-accent)}.kb-spinner[data-tone=neutral]{--_spinner-ink:var(--kb-color-muted)}.kb-spinner[data-tone=info]{--_spinner-ink:var(--kb-color-info)}.kb-spinner[data-tone=success]{--_spinner-ink:var(--kb-color-success)}.kb-spinner[data-tone=warning]{--_spinner-ink:var(--kb-color-warning)}.kb-spinner[data-tone=danger]{--_spinner-ink:var(--kb-color-danger)}.kb-spinner[data-appearance=pill]{padding:var(--kb-spinner-pill-padding-block) var(--kb-spinner-pill-padding-inline);border:1px solid color-mix(in oklab, var(--_spinner-ink) 40%, var(--kb-color-border));border-radius:var(--kb-spinner-pill-radius);background:color-mix(in oklab, var(--_spinner-ink) 10%, var(--kb-material-surface-bg));background-image:linear-gradient(180deg, var(--kb-material-soft-sheen), transparent);box-shadow:var(--kb-material-inlay-shadow);color:color-mix(in oklab, var(--_spinner-ink) 70%, var(--kb-color-fg))}.kb-spinner-icon{inline-size:var(--_spinner-size);block-size:var(--_spinner-size);color:var(--_spinner-ink);transform-origin:50%;animation:kb-spinner-rotate var(--kb-spinner-duration) var(--kb-spinner-easing) infinite;flex:none;overflow:visible}.kb-spinner[data-variant=orbit] .kb-spinner-icon,.kb-spinner[data-appearance=pill] .kb-spinner-icon{filter:drop-shadow(0 0 var(--kb-spinner-glow) color-mix(in oklab, var(--_spinner-ink) 42%, transparent))}.kb-spinner[data-variant=orbit] .kb-spinner-icon,.kb-spinner[data-variant=dots] .kb-spinner-icon,.kb-spinner[data-variant=bars] .kb-spinner-icon{animation:none}.kb-spinner-track{fill:none;stroke:currentColor;stroke-width:var(--kb-spinner-stroke-width);opacity:var(--kb-spinner-track-opacity)}.kb-spinner-arc{fill:none;stroke:currentColor;stroke-width:var(--kb-spinner-stroke-width);stroke-linecap:round;transform-origin:50%}.kb-spinner[data-variant=orbit] .kb-spinner-arc:first-of-type{animation:kb-spinner-rotate var(--kb-spinner-duration) var(--kb-spinner-easing) infinite}.kb-spinner[data-variant=orbit] .kb-spinner-arc:last-of-type{animation:kb-spinner-counter-rotate var(--kb-spinner-orbit-duration) var(--kb-spinner-easing) infinite}.kb-spinner-core{fill:currentColor;transform-origin:50%;animation:kb-spinner-pulse var(--kb-spinner-pulse-duration) var(--kb-spinner-pulse-easing) infinite}.kb-spinner-dot{fill:currentColor;transform-origin:50%;transform-box:fill-box;animation:kb-spinner-pulse var(--kb-spinner-pulse-duration) var(--kb-spinner-pulse-easing) infinite}.kb-spinner-dot:nth-of-type(2){animation-delay:var(--kb-spinner-stagger)}.kb-spinner-dot:nth-of-type(3){animation-delay:calc(var(--kb-spinner-stagger) * 2)}.kb-spinner-bar{fill:currentColor;transform-origin:50%;transform-box:fill-box;animation:kb-spinner-bar-wave var(--kb-spinner-pulse-duration) var(--kb-spinner-pulse-easing) infinite}.kb-spinner-bar:nth-of-type(2){animation-delay:var(--kb-spinner-stagger)}.kb-spinner-bar:nth-of-type(3){animation-delay:calc(var(--kb-spinner-stagger) * 2)}.kb-spinner-bar:nth-of-type(4){animation-delay:calc(var(--kb-spinner-stagger) * 3)}.kb-spinner-label{color:var(--kb-color-muted);font-weight:var(--kb-font-weight-medium)}.kb-spinner[data-appearance=pill] .kb-spinner-label{color:inherit;font-weight:var(--kb-font-weight-strong)}.kb-spinner[data-tone=current] .kb-spinner-label{color:inherit}@media (prefers-reduced-motion:reduce){.kb-spinner-icon,.kb-spinner[data-variant=orbit] .kb-spinner-arc:first-of-type,.kb-spinner[data-variant=orbit] .kb-spinner-arc:last-of-type,.kb-spinner-core,.kb-spinner-dot,.kb-spinner-bar{animation:none}}@media (forced-colors:active){.kb-spinner{--_spinner-ink:CanvasText;color:canvastext}.kb-spinner[data-appearance=pill]{box-shadow:none;color:canvastext;background:canvas;border-color:canvastext}.kb-spinner-icon,.kb-spinner[data-variant=orbit] .kb-spinner-icon,.kb-spinner[data-appearance=pill] .kb-spinner-icon{color:highlight;filter:none}.kb-spinner[data-tone=current] .kb-spinner-icon{color:currentColor}.kb-spinner-label,.kb-spinner[data-appearance=pill] .kb-spinner-label{color:canvastext}}}
+@layer kbui.components{@keyframes kb-spinner-rotate{to{transform:rotate(360deg)}}@keyframes kb-spinner-counter-rotate{to{transform:rotate(-360deg)}}@keyframes kb-spinner-sweep{0%{stroke-dasharray:12 88;stroke-dashoffset:0}50%{stroke-dasharray:68 32;stroke-dashoffset:-24px}to{stroke-dasharray:12 88;stroke-dashoffset:-100px}}@keyframes kb-spinner-dot-wave{0%,60%,to{opacity:.5;transform:translateY(15%)scale(.8)}30%{opacity:1;transform:translateY(-50%)scale(1)}}@keyframes kb-spinner-pulse{0%,to{opacity:.6;transform:scale(.85)}50%{opacity:1;transform:scale(1)}}@keyframes kb-spinner-bar-wave{0%,to{opacity:.55;transform:scaleY(.3)}50%{opacity:1;transform:scaleY(1)}}.kb-spinner{--_spinner-size:var(--kb-spinner-size-md);--_spinner-ink:var(--kb-color-accent);vertical-align:middle;align-items:center;gap:var(--kb-spinner-gap);color:var(--kb-color-fg);font-family:var(--kb-font-sans);font-size:var(--kb-size-sm);line-height:1.25;display:inline-flex}.kb-spinner[data-size=sm]{--_spinner-size:var(--kb-spinner-size-sm);font-size:var(--kb-size-xs)}.kb-spinner[data-size=md]{--_spinner-size:var(--kb-spinner-size-md)}.kb-spinner[data-size=lg]{--_spinner-size:var(--kb-spinner-size-lg);font-size:var(--kb-size-md)}.kb-spinner[data-tone=current]{--_spinner-ink:currentColor;color:inherit}.kb-spinner[data-tone=accent]{--_spinner-ink:var(--kb-color-accent)}.kb-spinner[data-tone=neutral]{--_spinner-ink:var(--kb-color-muted)}.kb-spinner[data-tone=info]{--_spinner-ink:var(--kb-color-info)}.kb-spinner[data-tone=success]{--_spinner-ink:var(--kb-color-success)}.kb-spinner[data-tone=warning]{--_spinner-ink:var(--kb-color-warning)}.kb-spinner[data-tone=danger]{--_spinner-ink:var(--kb-color-danger)}.kb-spinner[data-appearance=pill]{padding:var(--kb-spinner-pill-padding-block) var(--kb-spinner-pill-padding-inline);border:1px solid color-mix(in oklab, var(--_spinner-ink) 28%, var(--kb-color-border));border-radius:var(--kb-spinner-pill-radius);background:color-mix(in oklab, var(--_spinner-ink) 8%, var(--kb-material-surface-bg));background-image:linear-gradient(180deg, var(--kb-material-soft-sheen), transparent);box-shadow:var(--kb-material-inlay-shadow);color:color-mix(in oklab, var(--_spinner-ink) 70%, var(--kb-color-fg))}.kb-spinner-icon{inline-size:var(--_spinner-size);block-size:var(--_spinner-size);color:var(--_spinner-ink);transform-origin:50%;animation:kb-spinner-rotate var(--kb-spinner-duration) var(--kb-spinner-easing) infinite;flex:none;overflow:visible}.kb-spinner[data-variant=orbit] .kb-spinner-icon,.kb-spinner[data-appearance=pill] .kb-spinner-icon{filter:drop-shadow(0 0 var(--kb-spinner-glow) color-mix(in oklab, var(--_spinner-ink) 42%, transparent))}.kb-spinner[data-variant=orbit] .kb-spinner-icon,.kb-spinner[data-variant=dots] .kb-spinner-icon,.kb-spinner[data-variant=bars] .kb-spinner-icon{animation:none}.kb-spinner-track{fill:none;stroke:currentColor;stroke-width:var(--kb-spinner-stroke-width);opacity:var(--kb-spinner-track-opacity)}.kb-spinner-arc{fill:none;stroke:currentColor;stroke-width:var(--kb-spinner-stroke-width);stroke-linecap:round;stroke-dasharray:25 75;transform-origin:50%;animation:kb-spinner-sweep calc(var(--kb-spinner-duration) * 3) var(--kb-spinner-pulse-easing) infinite}.kb-spinner[data-variant=orbit] .kb-spinner-arc:first-of-type{animation:kb-spinner-rotate var(--kb-spinner-duration) var(--kb-spinner-easing) infinite, kb-spinner-sweep calc(var(--kb-spinner-duration) * 3) var(--kb-spinner-pulse-easing) infinite}.kb-spinner[data-variant=orbit] .kb-spinner-arc:last-of-type{animation:kb-spinner-counter-rotate var(--kb-spinner-orbit-duration) var(--kb-spinner-easing) infinite, kb-spinner-sweep calc(var(--kb-spinner-duration) * 3) var(--kb-spinner-pulse-easing) infinite reverse}.kb-spinner-core{fill:currentColor;transform-origin:50%;animation:kb-spinner-pulse var(--kb-spinner-pulse-duration) var(--kb-spinner-pulse-easing) infinite}.kb-spinner-dot{fill:currentColor;transform-origin:50%;transform-box:fill-box;animation:kb-spinner-dot-wave var(--kb-spinner-pulse-duration) var(--kb-spinner-pulse-easing) infinite;animation-delay:calc(var(--kb-spinner-stagger) * -3)}.kb-spinner-dot:nth-of-type(2){animation-delay:calc(var(--kb-spinner-stagger) * -2)}.kb-spinner-dot:nth-of-type(3){animation-delay:calc(var(--kb-spinner-stagger) * -1)}.kb-spinner-bar{fill:currentColor;transform-origin:50%;transform-box:fill-box;animation:kb-spinner-bar-wave var(--kb-spinner-pulse-duration) var(--kb-spinner-pulse-easing) infinite;animation-delay:calc(var(--kb-spinner-stagger) * -3)}.kb-spinner-bar:nth-of-type(2){animation-delay:calc(var(--kb-spinner-stagger) * -2)}.kb-spinner-bar:nth-of-type(3){animation-delay:calc(var(--kb-spinner-stagger) * -1)}.kb-spinner-bar:nth-of-type(4){animation-delay:0s}.kb-spinner-label{color:var(--kb-color-muted);font-weight:var(--kb-font-weight-medium)}.kb-spinner[data-appearance=pill] .kb-spinner-label{color:inherit;font-weight:var(--kb-font-weight-strong)}.kb-spinner[data-tone=current] .kb-spinner-label{color:inherit}@media (prefers-reduced-motion:reduce){.kb-spinner-icon,.kb-spinner-arc,.kb-spinner[data-variant=orbit] .kb-spinner-arc:first-of-type,.kb-spinner[data-variant=orbit] .kb-spinner-arc:last-of-type,.kb-spinner-core,.kb-spinner-dot,.kb-spinner-bar{animation:none}}@media (forced-colors:active){.kb-spinner{--_spinner-ink:CanvasText;color:canvastext}.kb-spinner[data-appearance=pill]{box-shadow:none;color:canvastext;background:canvas;border-color:canvastext}.kb-spinner-icon,.kb-spinner[data-variant=orbit] .kb-spinner-icon,.kb-spinner[data-appearance=pill] .kb-spinner-icon{color:highlight;filter:none}.kb-spinner[data-tone=current] .kb-spinner-icon{color:currentColor}.kb-spinner-label,.kb-spinner[data-appearance=pill] .kb-spinner-label{color:canvastext}}}

package/dist/components/stack.css

@@ -0,0 +1 @@
+@layer kbui.components{.kb-stack{gap:var(--kb-layout-gap-md);overflow-wrap:anywhere;flex-direction:column;justify-content:flex-start;align-items:stretch;min-inline-size:0;margin:0;padding:0;list-style:none;display:flex}.kb-stack>*{min-inline-size:0;max-inline-size:100%;margin-block:0}.kb-stack[data-gap=none]{gap:0}.kb-stack[data-gap=sm]{gap:var(--kb-layout-gap-sm)}.kb-stack[data-gap=lg]{gap:var(--kb-layout-gap-lg)}.kb-stack[data-align=start]{align-items:flex-start}.kb-stack[data-align=center]{align-items:center}.kb-stack[data-align=end]{align-items:flex-end}.kb-stack[data-justify=center]{justify-content:center}.kb-stack[data-justify=end]{justify-content:flex-end}.kb-stack[data-justify=between]{justify-content:space-between}}

package/dist/components/statsrow.css

@@ -0,0 +1 @@
+@layer kbui.components{.kb-statsrow{--_statsrow-tracks:2;grid-template-columns:repeat(auto-fit, minmax(min(100%, var(--kb-statsrow-item-min-width)), 1fr));gap:var(--kb-statsrow-row-gap) var(--kb-statsrow-column-gap);inline-size:100%;min-inline-size:0;color:var(--kb-color-fg);font-family:var(--kb-font-sans);margin:0;padding:0;list-style:none;display:grid}.kb-statsrow:has(>.kb-statsrow-item>.kb-statsrow-trend),.kb-statsrow:has(>.kb-statsrow-item>.kb-statsrow-link){--_statsrow-tracks:3}.kb-statsrow:has(>.kb-statsrow-item>.kb-statsrow-trend):has(>.kb-statsrow-item>.kb-statsrow-link){--_statsrow-tracks:4}.kb-statsrow-item{grid-row:span var(--_statsrow-tracks);grid-template-rows:subgrid;row-gap:var(--kb-statsrow-item-gap);overflow-wrap:anywhere;align-content:start;min-inline-size:0;margin:0;display:grid}.kb-statsrow-item>.kb-stat{display:contents}.kb-statsrow-item .kb-stat-label{grid-row:1}.kb-statsrow-item .kb-stat-value{grid-row:2;align-self:end}.kb-statsrow-trend{align-items:baseline;gap:var(--kb-space-1) var(--kb-space-2);min-inline-size:0;font-size:var(--kb-text-small-size);line-height:var(--kb-text-leading-control);color:var(--kb-color-muted);flex-wrap:wrap;grid-row:3;margin:0;display:flex}.kb-statsrow-change{align-items:center;gap:var(--kb-space-1);font-weight:var(--kb-font-weight-strong);font-variant-numeric:tabular-nums;color:var(--kb-statsrow-neutral);display:inline-flex}.kb-statsrow-change[data-tone=positive]{color:var(--kb-statsrow-positive)}.kb-statsrow-change[data-tone=negative]{color:var(--kb-statsrow-negative)}.kb-statsrow-glyph{flex:none;block-size:.875em;inline-size:.875em}.kb-statsrow-link{min-inline-size:0;font-size:var(--kb-text-small-size);line-height:var(--kb-text-leading-control);grid-row:-2}.kb-statsrow[data-appearance=outlined]>.kb-statsrow-item{padding:var(--kb-statsrow-item-padding);border:var(--kb-statsrow-item-border-width) solid var(--kb-statsrow-item-border);border-radius:var(--kb-statsrow-item-radius);background-color:var(--kb-statsrow-item-background)}@supports not ((grid-template-rows:subgrid) and selector(:has(*))){.kb-statsrow-item{gap:var(--kb-statsrow-item-gap);flex-direction:column;display:flex}.kb-statsrow-link{margin-block-start:auto}}}

package/dist/components/status.css

@@ -1 +1 @@
-@layer kbui.components{.kb-status{--_status-ink:var(--kb-status-neutral);align-items:center;gap:var(--kb-space-2);font-size:var(--kb-text-caption-size);font-weight:var(--kb-font-weight-strong);color:var(--_status-ink);letter-spacing:0;line-height:1.25;display:inline-flex}.kb-status[data-tone=info]{--_status-ink:var(--kb-status-info)}.kb-status[data-tone=running]{--_status-ink:var(--kb-status-running)}.kb-status[data-tone=success]{--_status-ink:var(--kb-status-success)}.kb-status[data-tone=warning]{--_status-ink:var(--kb-status-warning)}.kb-status[data-tone=blocked]{--_status-ink:var(--kb-status-blocked)}.kb-status[data-appearance=chip]{padding:var(--kb-status-padding-block) var(--kb-status-padding-inline);border:1px solid color-mix(in oklab, var(--_status-ink) 45%, transparent);border-radius:var(--kb-status-radius);background:color-mix(in oklab, var(--_status-ink) 12%, transparent);color:color-mix(in oklab, var(--_status-ink) 70%, var(--kb-color-fg));gap:var(--kb-status-gap);background-image:linear-gradient(180deg, var(--kb-material-soft-sheen), transparent);box-shadow:var(--kb-material-inlay-shadow)}.kb-status[data-appearance=chip][data-compact]{padding:var(--kb-status-compact-padding-block) var(--kb-status-compact-padding-inline)}.kb-status[data-compact]{gap:var(--kb-status-compact-gap);font-size:var(--kb-status-compact-size)}.kb-status-icon{width:1em;height:1em;color:inherit;flex:none;display:inline-flex}.kb-status[data-appearance=chip]>.kb-status-icon{color:var(--_status-ink);filter:drop-shadow(0 0 var(--kb-status-glow) var(--_status-ink))}.kb-status-icon>*{width:100%;height:100%}.kb-status-text{white-space:nowrap}.kb-status[data-appearance=chip]:before{content:"";width:var(--kb-status-dot-size);height:var(--kb-status-dot-size);background:currentColor;border-radius:50%;flex:none}}
+@layer kbui.components{.kb-status{--_status-ink:var(--kb-status-neutral);align-items:center;gap:var(--kb-space-2);font-size:var(--kb-text-caption-size);font-weight:var(--kb-font-weight-strong);color:var(--_status-ink);letter-spacing:0;line-height:1.25;display:inline-flex}.kb-status[data-tone=info]{--_status-ink:var(--kb-status-info)}.kb-status[data-tone=running]{--_status-ink:var(--kb-status-running)}.kb-status[data-tone=success]{--_status-ink:var(--kb-status-success)}.kb-status[data-tone=warning]{--_status-ink:var(--kb-status-warning)}.kb-status[data-tone=blocked]{--_status-ink:var(--kb-status-blocked)}.kb-status[data-appearance=chip]{padding:var(--kb-status-padding-block) var(--kb-status-padding-inline);border:1px solid color-mix(in oklab, var(--_status-ink) 45%, transparent);border-radius:var(--kb-status-radius);background:color-mix(in oklab, var(--_status-ink) 12%, transparent);color:color-mix(in oklab, var(--_status-ink) 70%, var(--kb-color-fg));gap:var(--kb-status-gap);background-image:linear-gradient(180deg, var(--kb-material-soft-sheen), transparent);box-shadow:var(--kb-material-inlay-shadow)}.kb-status[data-appearance=chip][data-compact]{padding:var(--kb-status-compact-padding-block) var(--kb-status-compact-padding-inline)}.kb-status[data-compact]{gap:var(--kb-status-compact-gap);font-size:var(--kb-status-compact-size)}.kb-status-icon{width:1em;height:1em;color:inherit;flex:none;display:inline-flex}.kb-status[data-appearance=chip]>.kb-status-icon{color:var(--_status-ink);filter:drop-shadow(0 0 var(--kb-status-glow) var(--_status-ink))}.kb-status-icon>*{width:100%;height:100%}.kb-status-text{white-space:nowrap}.kb-status[data-appearance=chip]:not(:has(>.kb-status-icon)):before{content:"";width:var(--kb-status-dot-size);height:var(--kb-status-dot-size);background:currentColor;border-radius:50%;flex:none}}

package/dist/components/supportingpane.css

@@ -0,0 +1 @@
+@layer kbui.components{.kb-supportingpane{box-sizing:border-box;align-items:flex-start;gap:var(--kb-supportingpane-gap);inline-size:100%;max-inline-size:var(--kb-supportingpane-max-width);padding-inline:var(--kb-supportingpane-gutter-sm);overflow-wrap:anywhere;flex-wrap:wrap;margin-inline:auto;display:flex;container:kb-supportingpane/inline-size}@media (width>=48rem){.kb-supportingpane{padding-inline:var(--kb-supportingpane-gutter-md)}}@media (width>=64rem){.kb-supportingpane{padding-inline:var(--kb-supportingpane-gutter-lg)}}.kb-supportingpane-main,.kb-supportingpane-aside{align-content:start;gap:var(--kb-supportingpane-gap);flex:100%;grid-template-columns:minmax(0,1fr);min-inline-size:0;display:grid}@container kb-supportingpane (width>=48rem){.kb-supportingpane-main{flex:1 1 0}.kb-supportingpane-aside{flex:0 0 var(--kb-supportingpane-aside-width)}}}

package/dist/components/table.css

@@ -1 +1 @@
-@layer kbui.components{.kb-table-scroll{isolation:isolate;border:1px solid var(--kb-table-border);border-radius:var(--kb-table-radius);background:var(--kb-table-background);min-inline-size:0;max-inline-size:100%;overflow:auto}.kb-table{--_table-padding-block:var(--kb-table-cell-padding-block);border-collapse:separate;border-spacing:0;inline-size:100%;color:var(--kb-color-fg);background:var(--kb-table-background);font-family:var(--kb-font-sans);font-size:var(--kb-size-sm);text-align:start}.kb-table[data-layout=fixed]{table-layout:fixed}.kb-table[data-density=dense]{--_table-padding-block:var(--kb-table-dense-padding-block)}.kb-table-caption{padding:var(--kb-table-cell-padding-block) var(--kb-table-cell-padding-inline);text-align:start;font-weight:var(--kb-font-weight-strong);color:var(--kb-color-fg);background:var(--kb-table-background)}.kb-table-columnheader,.kb-table-rowheader,.kb-table-cell{padding:var(--_table-padding-block,var(--kb-table-cell-padding-block)) var(--kb-table-cell-padding-inline);border-block-end:1px solid var(--kb-table-border);vertical-align:middle;text-align:start;overflow-wrap:anywhere;background:var(--kb-table-background)}.kb-table-columnheader,.kb-table-rowheader{font-weight:var(--kb-font-weight-strong)}.kb-table-columnheader[data-sortable]{block-size:1px;padding:0}.kb-table-head>.kb-table-row>.kb-table-columnheader,.kb-table-foot>.kb-table-row>.kb-table-cell,.kb-table-foot>.kb-table-row>.kb-table-rowheader{background:var(--kb-table-header-background)}:is(.kb-table-columnheader,.kb-table-rowheader,.kb-table-cell)[data-align=center]{text-align:center}:is(.kb-table-columnheader,.kb-table-rowheader,.kb-table-cell)[data-align=end]{text-align:end}.kb-table-row[data-selected]>:is(.kb-table-cell,.kb-table-rowheader){background:var(--kb-table-selected-background)}.kb-table[data-sticky-header]>.kb-table-head{z-index:2;position:sticky;inset-block-start:0}:is(.kb-table-columnheader,.kb-table-rowheader,.kb-table-cell)[data-sticky]{z-index:1;position:sticky}:is(.kb-table-columnheader,.kb-table-rowheader,.kb-table-cell)[data-sticky=start]{border-inline-end:1px solid var(--kb-table-border);inset-inline-start:0}:is(.kb-table-columnheader,.kb-table-rowheader,.kb-table-cell)[data-sticky=end]{border-inline-start:1px solid var(--kb-table-border);inset-inline-end:0}.kb-table-sort-button{align-items:center;gap:var(--kb-space-2);block-size:100%;inline-size:100%;min-inline-size:var(--kb-table-sort-target);min-block-size:calc(var(--kb-table-sort-target) + 2 * var(--_table-padding-block,var(--kb-table-cell-padding-block)));padding:var(--_table-padding-block,var(--kb-table-cell-padding-block)) var(--kb-table-cell-padding-inline);border-radius:var(--kb-radius-sm);color:inherit;font:inherit;text-align:inherit;white-space:nowrap;cursor:pointer;background:0 0;border:0;display:flex}:is(.kb-table-columnheader,.kb-table-rowheader,.kb-table-cell)[data-align=center]>.kb-table-sort-button{justify-content:center}:is(.kb-table-columnheader,.kb-table-rowheader,.kb-table-cell)[data-align=end]>.kb-table-sort-button{justify-content:flex-end}.kb-table[data-layout=fixed]>:is(.kb-table-head,.kb-table-body,.kb-table-foot)>.kb-table-row>.kb-table-columnheader>.kb-table-sort-button{white-space:normal;overflow-wrap:anywhere}.kb-table-sort-icon{color:var(--kb-color-muted);flex-shrink:0;display:inline-flex}.kb-table-columnheader[aria-sort] .kb-table-sort-icon,.kb-table-sort-button:disabled .kb-table-sort-icon{color:inherit}.kb-table-columnheader[data-align=end]>.kb-table-sort-button>.kb-table-sort-icon{order:-1}.kb-table-sort-button:hover:not(:disabled){background:color-mix(in oklab, var(--kb-color-fg) 6%, transparent);text-decoration:underline}.kb-table-sort-button:disabled{color:var(--kb-color-muted);cursor:default}.kb-table-sort-button:focus-visible,.kb-table-scroll:focus-visible{outline:2px solid var(--kb-color-ring);outline-offset:-2px}.kb-table-rowactions{justify-content:flex-end;align-items:center;gap:var(--kb-space-2);flex-wrap:wrap;display:flex}@media (forced-colors:active){.kb-table-scroll,.kb-table-columnheader,.kb-table-rowheader,.kb-table-cell{border-color:canvastext}.kb-table-row[data-selected]>:is(.kb-table-cell,.kb-table-rowheader){outline-offset:-1px;outline:1px solid highlight}.kb-table-sort-button:focus-visible,.kb-table-scroll:focus-visible{outline-color:highlight}.kb-table-sort-button:disabled{color:graytext}}}
+@layer kbui.components{.kb-table-scroll{isolation:isolate;border:1px solid var(--kb-table-border);border-radius:var(--kb-table-radius);background:var(--kb-table-background);min-inline-size:0;max-inline-size:100%;overflow:auto}.kb-table{--_table-padding-block:var(--kb-table-cell-padding-block);border-collapse:separate;border-spacing:0;inline-size:100%;color:var(--kb-color-fg);background:var(--kb-table-background);font-family:var(--kb-font-sans);font-size:var(--kb-size-sm);text-align:start}.kb-table[data-layout=fixed]{table-layout:fixed}.kb-table[data-density=dense]{--_table-padding-block:var(--kb-table-dense-padding-block)}.kb-table-caption{padding:var(--kb-table-cell-padding-block) var(--kb-table-cell-padding-inline);text-align:start;font-weight:var(--kb-font-weight-strong);color:var(--kb-color-fg);background:var(--kb-table-background)}.kb-table-columnheader,.kb-table-rowheader,.kb-table-cell{padding:var(--_table-padding-block,var(--kb-table-cell-padding-block)) var(--kb-table-cell-padding-inline);border-block-end:1px solid var(--kb-table-border);vertical-align:middle;text-align:start;overflow-wrap:break-word;background:var(--kb-table-background)}.kb-table[data-layout=fixed]>:is(.kb-table-head,.kb-table-body,.kb-table-foot)>.kb-table-row>:is(.kb-table-columnheader,.kb-table-rowheader,.kb-table-cell){overflow-wrap:anywhere}.kb-table-columnheader,.kb-table-rowheader{font-weight:var(--kb-font-weight-strong)}.kb-table-columnheader[data-sortable]{block-size:1px;padding:0}.kb-table-head>.kb-table-row>.kb-table-columnheader,.kb-table-foot>.kb-table-row>.kb-table-cell,.kb-table-foot>.kb-table-row>.kb-table-rowheader{background:var(--kb-table-header-background)}:is(.kb-table-columnheader,.kb-table-rowheader,.kb-table-cell)[data-align=center]{text-align:center}:is(.kb-table-columnheader,.kb-table-rowheader,.kb-table-cell)[data-align=end]{text-align:end}.kb-table-row[data-selected]>:is(.kb-table-cell,.kb-table-rowheader){background:var(--kb-table-selected-background)}.kb-table[data-sticky-header]>.kb-table-head{z-index:2;position:sticky;inset-block-start:0}:is(.kb-table-columnheader,.kb-table-rowheader,.kb-table-cell)[data-sticky]{z-index:1;position:sticky}:is(.kb-table-columnheader,.kb-table-rowheader,.kb-table-cell)[data-sticky=start]{border-inline-end:1px solid var(--kb-table-border);inset-inline-start:0}:is(.kb-table-columnheader,.kb-table-rowheader,.kb-table-cell)[data-sticky=end]{border-inline-start:1px solid var(--kb-table-border);inset-inline-end:0}.kb-table-sort-button{align-items:center;gap:var(--kb-space-2);block-size:100%;inline-size:100%;min-inline-size:var(--kb-table-sort-target);min-block-size:calc(var(--kb-table-sort-target) + 2 * var(--_table-padding-block,var(--kb-table-cell-padding-block)));padding:var(--_table-padding-block,var(--kb-table-cell-padding-block)) var(--kb-table-cell-padding-inline);border-radius:var(--kb-radius-sm);color:inherit;font:inherit;text-align:inherit;white-space:nowrap;cursor:pointer;background:0 0;border:0;display:flex}:is(.kb-table-columnheader,.kb-table-rowheader,.kb-table-cell)[data-align=center]>.kb-table-sort-button{justify-content:center}:is(.kb-table-columnheader,.kb-table-rowheader,.kb-table-cell)[data-align=end]>.kb-table-sort-button{justify-content:flex-end}.kb-table[data-layout=fixed]>:is(.kb-table-head,.kb-table-body,.kb-table-foot)>.kb-table-row>.kb-table-columnheader>.kb-table-sort-button{white-space:normal;overflow-wrap:anywhere}.kb-table-sort-icon{color:var(--kb-color-muted);flex-shrink:0;display:inline-flex}.kb-table-columnheader[aria-sort] .kb-table-sort-icon,.kb-table-sort-button:disabled .kb-table-sort-icon{color:inherit}.kb-table-columnheader[data-align=end]>.kb-table-sort-button>.kb-table-sort-icon{order:-1}.kb-table-sort-button:hover:not(:disabled){background:color-mix(in oklab, var(--kb-color-fg) 6%, transparent);text-decoration:underline}.kb-table-sort-button:disabled{color:var(--kb-color-muted);cursor:default}.kb-table-sort-button:focus-visible,.kb-table-scroll:focus-visible{outline:2px solid var(--kb-color-ring);outline-offset:-2px}.kb-table-rowactions{justify-content:flex-end;align-items:center;gap:var(--kb-space-2);flex-wrap:wrap;display:flex}@media (forced-colors:active){.kb-table-scroll,.kb-table-columnheader,.kb-table-rowheader,.kb-table-cell{border-color:canvastext}.kb-table-row[data-selected]>:is(.kb-table-cell,.kb-table-rowheader){outline-offset:-1px;outline:1px solid highlight}.kb-table-sort-button:focus-visible,.kb-table-scroll:focus-visible{outline-color:highlight}.kb-table-sort-button:disabled{color:graytext}}}

package/dist/components/tabs.css

@@ -1 +1 @@
-@layer kbui.components{.kb-tabs{inline-size:100%;min-inline-size:0;color:var(--kb-color-fg);flex-direction:column;display:flex}.kb-tabs[data-orientation=vertical]{align-items:flex-start;gap:var(--kb-space-4);flex-direction:row}.kb-tabs-list{align-items:center;gap:var(--kb-space-1);scrollbar-width:thin;border-block-end:1px solid var(--kb-color-border);min-inline-size:0;display:flex;position:relative;overflow-x:auto}.kb-tabs-list[data-orientation=vertical]{border-block-end:0;border-inline-end:1px solid var(--kb-color-border);flex-direction:column;flex-shrink:0;align-items:stretch;overflow-x:visible}.kb-tabs-list[data-variant=pill]{inline-size:fit-content;max-inline-size:100%;padding:var(--kb-tabs-list-padding);border:1px solid var(--kb-color-border);border-radius:var(--kb-tabs-radius);background:var(--kb-material-recessed-face);box-shadow:var(--kb-material-field-shadow)}.kb-tabs-tab{z-index:1;justify-content:center;align-items:center;gap:var(--kb-space-2);min-block-size:var(--kb-tabs-tab-height-md);padding-inline:var(--kb-space-3);padding-block:var(--kb-space-1);border-radius:var(--kb-radius-sm) var(--kb-radius-sm) 0 0;color:var(--kb-color-muted);font:inherit;font-size:var(--kb-text-control-size);font-weight:var(--kb-font-weight-medium);line-height:var(--kb-text-leading-control);white-space:nowrap;cursor:pointer;user-select:none;background:0 0;border:1px solid #0000;flex-shrink:0;text-decoration:none;display:inline-flex;position:relative}.kb-tabs-tab[data-size=sm]{min-block-size:var(--kb-tabs-tab-height-sm);padding-inline:var(--kb-space-2);font-size:var(--kb-text-small-size)}.kb-tabs-tab[data-orientation=vertical]{border-radius:var(--kb-radius-sm) 0 0 var(--kb-radius-sm);justify-content:flex-start;inline-size:100%}.kb-tabs-tab[data-variant=pill]{border-radius:calc(var(--kb-tabs-radius) - 2px)}.kb-tabs-tab:hover:not(:disabled):not([data-disabled]){color:var(--kb-color-fg);background:color-mix(in srgb, var(--kb-color-fg) 5%, transparent)}.kb-tabs-tab[data-active]{color:var(--kb-color-fg);font-weight:var(--kb-font-weight-strong)}.kb-tabs-tab[data-variant=line][data-active]{color:var(--kb-color-accent-ink)}.kb-tabs-tab[data-variant=pill][data-active]:not(:has(~.kb-tabs-indicator)){border-color:var(--kb-material-raised-border);background:var(--kb-material-raised-face);box-shadow:var(--kb-material-raised-shadow)}.kb-tabs-tab[data-variant=line][data-active]:not(:has(~.kb-tabs-indicator)){box-shadow:inset 0 calc(-1 * var(--kb-tabs-indicator-thickness)) 0 var(--kb-color-accent)}.kb-tabs-tab[data-variant=line][data-orientation=vertical][data-active]:not(:has(~.kb-tabs-indicator)){box-shadow:inset calc(-1 * var(--kb-tabs-indicator-thickness)) 0 0 var(--kb-color-accent)}.kb-tabs-tab:focus-visible{outline:2px solid var(--kb-color-ring);outline-offset:-2px}.kb-tabs-tab:disabled,.kb-tabs-tab[data-disabled]{opacity:.5;cursor:not-allowed}.kb-tabs-tab-icon{color:currentColor;flex-shrink:0;justify-content:center;align-items:center;display:inline-flex}.kb-tabs-tab-label{min-inline-size:0}.kb-tabs-tab-badge{padding-inline:var(--kb-space-1);border-radius:var(--kb-radius-sm);background:color-mix(in srgb, currentColor 12%, transparent);font-size:var(--kb-text-caption-size);font-variant-numeric:tabular-nums;flex-shrink:0;justify-content:center;align-items:center;display:inline-flex}.kb-tabs-indicator{z-index:0;pointer-events:none;left:var(--active-tab-left,0px);inline-size:var(--active-tab-width,0px);position:absolute}.kb-tabs-indicator[data-variant=pill]{block-size:var(--active-tab-height,calc(100% - 2 * var(--kb-tabs-list-padding)));border:1px solid var(--kb-material-raised-border);border-radius:calc(var(--kb-tabs-radius) - 2px);background:var(--kb-material-raised-face);box-shadow:var(--kb-material-raised-shadow);inset-block-start:var(--active-tab-top,var(--kb-tabs-list-padding))}.kb-tabs-indicator[data-variant=line][data-orientation=horizontal]{block-size:var(--kb-tabs-indicator-thickness);border-radius:var(--kb-radius-full);background:var(--kb-color-accent);inset-block-end:0}.kb-tabs-indicator[data-variant=line][data-orientation=vertical]{left:auto;inline-size:var(--kb-tabs-indicator-thickness);block-size:var(--active-tab-height,0px);border-radius:var(--kb-radius-full);background:var(--kb-color-accent);inset-block-start:var(--active-tab-top,0px);inset-inline-end:0}.kb-tabs-panel{min-inline-size:0;color:var(--kb-color-fg);font-size:var(--kb-text-body-size);line-height:var(--kb-text-leading-body);flex:auto;padding-block-start:var(--kb-tabs-panel-padding)}.kb-tabs-panel[data-orientation=vertical]{padding-block-start:0}.kb-tabs-panel[hidden],.kb-tabs-panel[data-hidden],.kb-tabs-panel[data-ending-style]{display:none}.kb-tabs-panel:focus-visible{border-radius:var(--kb-radius-sm);outline:2px solid var(--kb-color-ring);outline-offset:2px}@media (prefers-reduced-motion:no-preference){.kb-tabs-tab{transition:color var(--kb-motion-duration-fast) var(--kb-motion-easing-standard), background-color var(--kb-motion-duration-fast) var(--kb-motion-easing-standard)}.kb-tabs-indicator{transition:left var(--kb-motion-duration-base) var(--kb-motion-easing-standard), inset-block-start var(--kb-motion-duration-base) var(--kb-motion-easing-standard), inline-size var(--kb-motion-duration-base) var(--kb-motion-easing-standard), block-size var(--kb-motion-duration-base) var(--kb-motion-easing-standard)}}@media (pointer:coarse){.kb-tabs-tab,.kb-tabs-tab[data-size=sm]{min-block-size:var(--kb-button-touch-min)}}@media (forced-colors:active){.kb-tabs-list[data-variant=pill]{box-shadow:none;background:canvas;border-color:buttonborder}.kb-tabs-tab,.kb-tabs-tab:hover:not(:disabled):not([data-disabled]){color:buttontext}.kb-tabs-tab[data-active],.kb-tabs-tab[data-variant][data-active],.kb-tabs-tab[data-variant][data-active]:not(:has(~.kb-tabs-indicator)),.kb-tabs-tab[data-variant][data-orientation][data-active]:not(:has(~.kb-tabs-indicator)){color:highlighttext;box-shadow:none;forced-color-adjust:none;background:highlight;border-color:highlight}.kb-tabs-tab:focus-visible,.kb-tabs-panel:focus-visible{outline-color:highlight}.kb-tabs-tab:disabled,.kb-tabs-tab[data-disabled]{opacity:1;color:graytext}.kb-tabs-tab[data-active]:focus-visible{outline-color:highlighttext}.kb-tabs-indicator{display:none}}}
+@layer kbui.components{.kb-tabs{inline-size:100%;min-inline-size:0;color:var(--kb-color-fg);flex-direction:column;display:flex}.kb-tabs[data-orientation=vertical]{align-items:flex-start;gap:var(--kb-space-4);flex-flow:wrap}.kb-tabs-list{align-items:center;gap:var(--kb-space-1);scrollbar-width:thin;border-block-end:1px solid var(--kb-color-border);min-inline-size:0;display:flex;position:relative;overflow-x:auto}.kb-tabs-list[data-orientation=vertical]{border-block-end:0;border-inline-end:1px solid var(--kb-color-border);flex-direction:column;flex-shrink:0;align-items:stretch;overflow-x:visible}.kb-tabs-list[data-variant=pill]{inline-size:fit-content;max-inline-size:100%;padding:var(--kb-tabs-list-padding);border:1px solid var(--kb-color-border);border-radius:var(--kb-tabs-radius);background:var(--kb-material-recessed-face);box-shadow:var(--kb-material-field-shadow)}.kb-tabs-tab{z-index:1;justify-content:center;align-items:center;gap:var(--kb-space-2);min-block-size:var(--kb-tabs-tab-height-md);padding-inline:var(--kb-space-3);padding-block:var(--kb-space-1);border-radius:var(--kb-radius-sm) var(--kb-radius-sm) 0 0;color:var(--kb-color-muted);font:inherit;font-size:var(--kb-text-control-size);font-weight:var(--kb-font-weight-medium);line-height:var(--kb-text-leading-control);white-space:nowrap;cursor:pointer;user-select:none;background:0 0;border:1px solid #0000;flex-shrink:0;text-decoration:none;display:inline-flex;position:relative}.kb-tabs-tab[data-size=sm]{min-block-size:var(--kb-tabs-tab-height-sm);padding-inline:var(--kb-space-2);font-size:var(--kb-text-small-size)}.kb-tabs-tab[data-orientation=vertical]{border-radius:var(--kb-radius-sm) 0 0 var(--kb-radius-sm);justify-content:flex-start;inline-size:100%}.kb-tabs-tab[data-variant=pill]{border-radius:calc(var(--kb-tabs-radius) - 2px)}.kb-tabs-tab:hover:not(:disabled):not([data-disabled]){color:var(--kb-color-fg);background:color-mix(in srgb, var(--kb-color-fg) 5%, transparent)}.kb-tabs-tab[data-active]{color:var(--kb-color-fg);font-weight:var(--kb-font-weight-strong)}.kb-tabs-tab[data-variant=line][data-active]{color:var(--kb-color-accent-ink)}.kb-tabs-tab[data-variant=pill][data-active]:not(:has(~.kb-tabs-indicator)){border-color:var(--kb-material-raised-border);background:var(--kb-material-raised-face);box-shadow:var(--kb-material-raised-shadow)}.kb-tabs-tab[data-variant=line][data-active]:not(:has(~.kb-tabs-indicator)){box-shadow:inset 0 calc(-1 * var(--kb-tabs-indicator-thickness)) 0 var(--kb-color-accent)}.kb-tabs-tab[data-variant=line][data-orientation=vertical][data-active]:not(:has(~.kb-tabs-indicator)){box-shadow:inset calc(-1 * var(--kb-tabs-indicator-thickness)) 0 0 var(--kb-color-accent)}.kb-tabs-tab:focus-visible{outline:2px solid var(--kb-color-ring);outline-offset:-2px}.kb-tabs-tab:disabled,.kb-tabs-tab[data-disabled]{opacity:.5;cursor:not-allowed}.kb-tabs-tab-icon{color:currentColor;flex-shrink:0;justify-content:center;align-items:center;display:inline-flex}.kb-tabs-tab-label{min-inline-size:0}.kb-tabs-tab-badge{padding-inline:var(--kb-space-1);border-radius:var(--kb-radius-sm);background:color-mix(in srgb, currentColor 12%, transparent);font-size:var(--kb-text-caption-size);font-variant-numeric:tabular-nums;flex-shrink:0;justify-content:center;align-items:center;display:inline-flex}.kb-tabs-indicator{z-index:0;pointer-events:none;left:var(--active-tab-left,0px);inline-size:var(--active-tab-width,0px);position:absolute}.kb-tabs-indicator[data-variant=pill]{block-size:var(--active-tab-height,calc(100% - 2 * var(--kb-tabs-list-padding)));border:1px solid var(--kb-material-raised-border);border-radius:calc(var(--kb-tabs-radius) - 2px);background:var(--kb-material-raised-face);box-shadow:var(--kb-material-raised-shadow);inset-block-start:var(--active-tab-top,var(--kb-tabs-list-padding))}.kb-tabs-indicator[data-variant=line][data-orientation=horizontal]{block-size:var(--kb-tabs-indicator-thickness);border-radius:var(--kb-radius-full);background:var(--kb-color-accent);inset-block-end:0}.kb-tabs-indicator[data-variant=line][data-orientation=vertical]{left:auto;inline-size:var(--kb-tabs-indicator-thickness);block-size:var(--active-tab-height,0px);border-radius:var(--kb-radius-full);background:var(--kb-color-accent);inset-block-start:var(--active-tab-top,0px);inset-inline-end:0}.kb-tabs-panel{min-inline-size:0;color:var(--kb-color-fg);font-size:var(--kb-text-body-size);line-height:var(--kb-text-leading-body);flex:auto;padding-block-start:var(--kb-tabs-panel-padding)}.kb-tabs-panel[data-orientation=vertical]{flex-basis:max(479952rem - 999900%,0px);padding-block-start:0}.kb-tabs-panel[hidden],.kb-tabs-panel[data-hidden],.kb-tabs-panel[data-ending-style]{display:none}.kb-tabs-panel:focus-visible{border-radius:var(--kb-radius-sm);outline:2px solid var(--kb-color-ring);outline-offset:2px}@media (prefers-reduced-motion:no-preference){.kb-tabs-tab{transition:color var(--kb-motion-duration-fast) var(--kb-motion-easing-standard), background-color var(--kb-motion-duration-fast) var(--kb-motion-easing-standard)}.kb-tabs-indicator{transition:left var(--kb-motion-duration-base) var(--kb-motion-easing-standard), inset-block-start var(--kb-motion-duration-base) var(--kb-motion-easing-standard), inline-size var(--kb-motion-duration-base) var(--kb-motion-easing-standard), block-size var(--kb-motion-duration-base) var(--kb-motion-easing-standard)}}@media (pointer:coarse){.kb-tabs-tab,.kb-tabs-tab[data-size=sm]{min-block-size:var(--kb-button-touch-min)}}@media (forced-colors:active){.kb-tabs-list[data-variant=pill]{box-shadow:none;background:canvas;border-color:buttonborder}.kb-tabs-tab,.kb-tabs-tab:hover:not(:disabled):not([data-disabled]){color:buttontext}.kb-tabs-tab[data-active],.kb-tabs-tab[data-variant][data-active],.kb-tabs-tab[data-variant][data-active]:not(:has(~.kb-tabs-indicator)),.kb-tabs-tab[data-variant][data-orientation][data-active]:not(:has(~.kb-tabs-indicator)){color:highlighttext;box-shadow:none;forced-color-adjust:none;background:highlight;border-color:highlight}.kb-tabs-tab:focus-visible,.kb-tabs-panel:focus-visible{outline-color:highlight}.kb-tabs-tab:disabled,.kb-tabs-tab[data-disabled]{opacity:1;color:graytext}.kb-tabs-tab[data-active]:focus-visible{outline-color:highlighttext}.kb-tabs-indicator{display:none}}}

package/dist/components/toast.css

@@ -1 +1 @@
-@layer kbui.components{.kb-toast-viewport{z-index:var(--kb-toast-z-index);gap:var(--kb-toast-gap);inline-size:min(var(--kb-toast-width), calc(100% - var(--kb-toast-gutter) * 2));max-block-size:calc(100dvh - var(--kb-toast-gutter) * 2);overscroll-behavior:contain;pointer-events:none;padding:var(--kb-space-1);scroll-padding:var(--kb-space-1);flex-direction:column;display:flex;position:fixed;overflow:auto}.kb-toast-viewport[data-placement^=top]{--_toast-enter-y:calc(-1 * var(--kb-toast-enter-offset));inset-block-start:var(--kb-toast-gutter)}.kb-toast-viewport[data-placement^=bottom]{inset-block-end:var(--kb-toast-gutter)}.kb-toast-viewport[data-placement$=start]{inset-inline-start:var(--kb-toast-gutter)}.kb-toast-viewport[data-placement$=end]{inset-inline-end:var(--kb-toast-gutter)}.kb-toast-viewport[data-placement=inline]{z-index:auto;max-block-size:none;inline-size:100%;position:relative;overflow:visible}.kb-toast{--_toast-ink:var(--kb-toast-border);height:var(--toast-height,auto);align-items:start;gap:var(--kb-space-3);min-block-size:0;padding:var(--kb-toast-padding);border:1px solid var(--kb-toast-border);border-inline-start:var(--kb-space-1) solid var(--_toast-ink);border-radius:var(--kb-toast-radius);background:var(--kb-toast-background);color:var(--kb-toast-color);box-shadow:var(--kb-toast-shadow);font-size:var(--kb-text-control-size);line-height:var(--kb-text-leading-control);overflow-wrap:anywhere;pointer-events:auto;opacity:1;animation:kb-toast-enter var(--kb-toast-motion-duration) var(--kb-toast-motion-easing) backwards;transition:opacity var(--kb-toast-motion-duration) var(--kb-toast-motion-easing), transform var(--kb-toast-motion-duration) var(--kb-toast-motion-easing), height var(--kb-toast-motion-duration) var(--kb-toast-motion-easing), padding-block var(--kb-toast-motion-duration) var(--kb-toast-motion-easing), border-block-width var(--kb-toast-motion-duration) var(--kb-toast-motion-easing), margin-block-end var(--kb-toast-motion-duration) var(--kb-toast-motion-easing);flex:none;grid-template-columns:minmax(0,1fr) auto;margin-block-end:0;display:grid;transform:translateY(0)scale(1)}.kb-toast[data-tone=info]{--_toast-ink:var(--kb-color-info)}.kb-toast[data-tone=success]{--_toast-ink:var(--kb-color-success)}.kb-toast[data-tone=warning]{--_toast-ink:var(--kb-color-warning)}.kb-toast[data-tone=danger]{--_toast-ink:var(--kb-color-danger)}.kb-toast[data-limited]{display:none}@keyframes kb-toast-enter{0%{opacity:0;transform:translateY(var(--_toast-enter-y,var(--kb-toast-enter-offset))) scale(var(--kb-toast-enter-scale));margin-block-end:calc(-1 * (var(--toast-height,0px) + var(--kb-toast-gap)))}to{opacity:1;margin-block-end:0;transform:translateY(0)scale(1)}}.kb-toast[data-swiping]{animation:none}.kb-toast[data-ending-style]{height:0;opacity:0;transform:translateY(calc(-1 * var(--kb-toast-enter-offset))) scale(var(--kb-toast-enter-scale));pointer-events:none;transition-duration:var(--kb-toast-exit-duration);border-block-width:0;margin-block-end:calc(-1 * var(--kb-toast-gap));padding-block:0;animation:none;overflow:clip}.kb-toast[data-ending-style][data-swipe-direction=right]{transform:translateX(calc(var(--toast-swipe-movement-x) + 100%))}.kb-toast[data-ending-style][data-swipe-direction=left]{transform:translateX(calc(var(--toast-swipe-movement-x) - 100%))}.kb-toast[data-ending-style][data-swipe-direction=up]{transform:translateY(calc(var(--toast-swipe-movement-y) - 100%))}.kb-toast[data-ending-style][data-swipe-direction=down]{transform:translateY(calc(var(--toast-swipe-movement-y) + 100%))}.kb-toast-content{gap:var(--kb-space-2);min-inline-size:0;display:grid}.kb-toast-title{font:inherit;font-weight:var(--kb-font-weight-strong);margin:0}.kb-toast-description{color:var(--kb-toast-color)}.kb-toast-action,.kb-toast-close{min-block-size:var(--kb-toast-control-size);min-inline-size:var(--kb-toast-control-size);padding:var(--kb-space-1) var(--kb-space-2);border:1px solid var(--kb-toast-border);border-radius:var(--kb-radius-sm);color:var(--kb-toast-color);background:var(--kb-toast-background);font:inherit;cursor:pointer;transition:background-color var(--kb-motion-duration-fast) var(--kb-toast-motion-easing), color var(--kb-motion-duration-fast) var(--kb-toast-motion-easing), border-color var(--kb-motion-duration-fast) var(--kb-toast-motion-easing);justify-content:center;justify-self:start;align-items:center;display:inline-flex}.kb-toast-action:disabled,.kb-toast-action[data-disabled],.kb-toast-close:disabled,.kb-toast-close[data-disabled]{color:var(--kb-color-muted);cursor:not-allowed}.kb-toast-action:hover:not(:disabled):not([data-disabled]),.kb-toast-close:hover:not(:disabled):not([data-disabled]){background:var(--kb-color-surface)}.kb-toast:focus-visible,.kb-toast-viewport:focus-visible,.kb-toast-action:focus-visible,.kb-toast-close:focus-visible{outline:2px solid var(--kb-color-ring);outline-offset:2px}@media (prefers-reduced-motion:reduce){.kb-toast,.kb-toast-action,.kb-toast-close{transition:none;animation:none}.kb-toast,.kb-toast[data-starting-style],.kb-toast[data-ending-style],.kb-toast[data-ending-style][data-swipe-direction]{transform:none}}@media (forced-colors:active){.kb-toast{color:canvastext;box-shadow:none;background:canvas;border-color:canvastext}.kb-toast-description{color:canvastext}.kb-toast-action,.kb-toast-close{color:buttontext;background:buttonface;border-color:buttontext}.kb-toast-action:hover:not(:disabled):not([data-disabled]),.kb-toast-close:hover:not(:disabled):not([data-disabled]){color:highlighttext;background:highlight}.kb-toast-action:disabled,.kb-toast-action[data-disabled],.kb-toast-close:disabled,.kb-toast-close[data-disabled]{color:graytext;border-color:graytext}.kb-toast:focus-visible,.kb-toast-viewport:focus-visible,.kb-toast-action:focus-visible,.kb-toast-close:focus-visible{outline-color:highlight}}}
+@layer kbui.components{.kb-toast-viewport{z-index:var(--kb-toast-z-index);gap:var(--kb-toast-gap);inline-size:min(var(--kb-toast-width), calc(100% - var(--kb-toast-gutter) * 2));max-block-size:calc(100dvh - var(--kb-toast-gutter) * 2);overscroll-behavior:contain;pointer-events:none;padding:var(--kb-space-1);scroll-padding:var(--kb-space-1);flex-direction:column;display:flex;position:fixed;overflow:auto}.kb-toast-viewport[data-placement^=top]{--_toast-enter-y:calc(-1 * var(--kb-toast-enter-offset));inset-block-start:var(--kb-toast-gutter)}.kb-toast-viewport[data-placement^=bottom]{inset-block-end:var(--kb-toast-gutter)}.kb-toast-viewport[data-placement$=start]{inset-inline-start:var(--kb-toast-gutter)}.kb-toast-viewport[data-placement$=end]{inset-inline-end:var(--kb-toast-gutter)}.kb-toast-viewport[data-placement=inline]{z-index:auto;max-block-size:none;inline-size:100%;position:relative;overflow:visible}.kb-toast{--_toast-ink:var(--kb-toast-border);height:var(--toast-height,auto);align-items:start;gap:var(--kb-space-3);min-block-size:0;padding:var(--kb-toast-padding);border:1px solid var(--kb-toast-border);border-inline-start:var(--kb-space-1) solid var(--_toast-ink);border-radius:var(--kb-toast-radius);background:var(--kb-toast-background);color:var(--kb-toast-color);box-shadow:var(--kb-toast-shadow);font-size:var(--kb-text-control-size);line-height:var(--kb-text-leading-control);overflow-wrap:anywhere;pointer-events:auto;opacity:1;animation:kb-toast-enter var(--kb-toast-motion-duration) var(--kb-toast-motion-easing) backwards;transition:opacity var(--kb-toast-motion-duration) var(--kb-toast-motion-easing), transform var(--kb-toast-motion-duration) var(--kb-toast-motion-easing), height var(--kb-toast-motion-duration) var(--kb-toast-motion-easing), padding-block var(--kb-toast-motion-duration) var(--kb-toast-motion-easing), border-block-width var(--kb-toast-motion-duration) var(--kb-toast-motion-easing), margin-block-end var(--kb-toast-motion-duration) var(--kb-toast-motion-easing);flex:none;grid-template-columns:minmax(0,1fr) auto;margin-block-end:0;display:grid;transform:translateY(0)scale(1)}.kb-toast[data-tone=info]{--_toast-ink:var(--kb-color-info)}.kb-toast[data-tone=success]{--_toast-ink:var(--kb-color-success)}.kb-toast[data-tone=warning]{--_toast-ink:var(--kb-color-warning)}.kb-toast[data-tone=danger]{--_toast-ink:var(--kb-color-danger)}.kb-toast[data-limited]{display:none}@keyframes kb-toast-enter{0%{opacity:0;transform:translateY(var(--_toast-enter-y,var(--kb-toast-enter-offset))) scale(var(--kb-toast-enter-scale));margin-block-end:calc(-1 * (var(--toast-height,0px) + var(--kb-toast-gap)))}to{opacity:1;margin-block-end:0;transform:translateY(0)scale(1)}}.kb-toast[data-swiping]{animation:none}.kb-toast[data-ending-style]{height:0;opacity:0;transform:translateY(calc(-1 * var(--kb-toast-enter-offset))) scale(var(--kb-toast-enter-scale));pointer-events:none;transition-duration:var(--kb-toast-exit-duration);border-block-width:0;margin-block-end:calc(-1 * var(--kb-toast-gap));padding-block:0;animation:none;overflow:clip}.kb-toast[data-ending-style][data-swipe-direction=right]{transform:translateX(calc(var(--toast-swipe-movement-x) + 100%))}.kb-toast[data-ending-style][data-swipe-direction=left]{transform:translateX(calc(var(--toast-swipe-movement-x) - 100%))}.kb-toast[data-ending-style][data-swipe-direction=up]{transform:translateY(calc(var(--toast-swipe-movement-y) - 100%))}.kb-toast[data-ending-style][data-swipe-direction=down]{transform:translateY(calc(var(--toast-swipe-movement-y) + 100%))}.kb-toast-content{gap:var(--kb-space-2);min-inline-size:0;display:grid}.kb-toast-title{font:inherit;font-weight:var(--kb-font-weight-strong);margin:0}.kb-toast-description{color:var(--kb-toast-color)}.kb-toast-action,.kb-toast-close{min-block-size:var(--kb-toast-control-size);min-inline-size:var(--kb-toast-control-size);padding:var(--kb-space-1) var(--kb-space-2);border:1px solid var(--kb-toast-border);border-radius:var(--kb-radius-sm);color:var(--kb-toast-color);background:var(--kb-toast-background);font:inherit;cursor:pointer;transition:background-color var(--kb-motion-duration-fast) var(--kb-toast-motion-easing), color var(--kb-motion-duration-fast) var(--kb-toast-motion-easing), border-color var(--kb-motion-duration-fast) var(--kb-toast-motion-easing);justify-content:center;justify-self:start;align-items:center;display:inline-flex}.kb-toast-action{justify-self:end}.kb-toast-action:disabled,.kb-toast-action[data-disabled],.kb-toast-close:disabled,.kb-toast-close[data-disabled]{color:var(--kb-color-muted);cursor:not-allowed}.kb-toast-action:hover:not(:disabled):not([data-disabled]),.kb-toast-close:hover:not(:disabled):not([data-disabled]){background:var(--kb-color-surface)}.kb-toast:focus-visible,.kb-toast-viewport:focus-visible,.kb-toast-action:focus-visible,.kb-toast-close:focus-visible{outline:2px solid var(--kb-color-ring);outline-offset:2px}@media (prefers-reduced-motion:reduce){.kb-toast,.kb-toast-action,.kb-toast-close{transition:none;animation:none}.kb-toast,.kb-toast[data-starting-style],.kb-toast[data-ending-style],.kb-toast[data-ending-style][data-swipe-direction]{transform:none}}@media (forced-colors:active){.kb-toast{color:canvastext;box-shadow:none;background:canvas;border-color:canvastext}.kb-toast-description{color:canvastext}.kb-toast-action,.kb-toast-close{color:buttontext;background:buttonface;border-color:buttontext}.kb-toast-action:hover:not(:disabled):not([data-disabled]),.kb-toast-close:hover:not(:disabled):not([data-disabled]){color:highlighttext;background:highlight}.kb-toast-action:disabled,.kb-toast-action[data-disabled],.kb-toast-close:disabled,.kb-toast-close[data-disabled]{color:graytext;border-color:graytext}.kb-toast:focus-visible,.kb-toast-viewport:focus-visible,.kb-toast-action:focus-visible,.kb-toast-close:focus-visible{outline-color:highlight}}}