@meddleware/ui 0.1.27 → 0.1.29

package/README.md

@@ -43,6 +43,7 @@ theming system — only the styling tokens they resolve to.
 | `.mw-mono` | Monospace font (`--mw-font-mono`). |
 | `.mw-spinner` | Sigil-like ring loader that settles into a simple form. |
 | `.mw-hand-drawn` | Empty positioned **placeholder hook** for bespoke hand-drawn SVG/canvas added later — drop an `<svg>`/`<canvas>` inside, or target `.mw-hand-drawn > svg` from your app. |
+| `.mw-visually-hidden` | Hides content visually while keeping it available to assistive technology (e.g. a group's `<legend>`). |
 
 Seasonal theming is entirely in `@meddleware/design-tokens` (import `seasons.css` + set
 `data-season`); the components pick it up automatically through the role tokens.
@@ -53,9 +54,9 @@ Seasonal theming is entirely in `@meddleware/design-tokens` (import `seasons.css
 
 | Component | Description |
 | --- | --- |
-| `AppHeader` | Top navigation bar. Accepts `variant`, optional `colors` override, and named slots for dynamic content. |
-| `AppSidebar` | Side navigation panel. Same API as `AppHeader`. |
-| `AppFooter` | Page footer. Same API as `AppHeader`. |
+| `AppHeader` | Top bar (`<header>`). Slots `brand`, default and `actions` render **directly** in the header — no wrapper elements. The brand slot's single element comes first and takes the brand typography, pushing everything after it to the inline end; default-slot content that should fill the gap sets its own `flex: 1`. |
+| `AppSidebar` | Side panel (`<aside>`) around a component-owned `<nav aria-label="Primary">` (default slot). The `head`, `body` and `foot` slots render directly and style themselves; the nav grows, so body/foot content settles at the bottom. |
+| `AppFooter` | Page footer (`<footer>`). Slots `start`, default and `end` render directly; `docsUrl` / `devUrl` render a component-owned `<nav aria-label="Documentation">` at the inline end. |
 
 All three accept a `variant` prop:
 
@@ -70,10 +71,14 @@ All three accept a `variant` prop:
 | Component | Description |
 | --- | --- |
 | `UiButton` | Styled button. |
-| `UiCard` | Card container with surface background and border. |
-| `UiSelect` | Styled select input. |
+| `UiCard` | Card `<section>`: optional `<header>` (title), body content directly inside, optional `<footer>`. |
+| `UiSelect` | Styled native `<select>` (single root; attributes fall through; chevron painted in CSS). Label it with `UiFormField` or an `aria-label`. |
+| `UiFormField` | A labelled field as a `<p>`: `<label for>` + `label-suffix` slot (e.g. `UiFieldHint`, kept outside the label) + control slot (receives `attrs` with `id` / `aria-*`) + hint/error `<small>`. Slot content must be phrasing content. |
 | `UiNotice` | Notice / alert banner. |
+| `UiDialog` | Modal on the native `<dialog>`: `<article>` › `<header>` (h2 title + close) · body slot · `<footer>` (`actions` slot, scoped `close(value)`). `v-model:open`, `title`, `dismissible` (Escape/backdrop/close button via native `closedby`), `width`; emits `close(returnValue)`. |
+| `AppTabNav` / `UiTabPanel` | WAI-ARIA tabs: `AppTabNav` is the `tablist` (arrow keys, Home/End, roving tabindex); wrap each view's content in `UiTabPanel` with the same `idPrefix` and the shown `tab` id. Only the selected tab gets `aria-controls` (one panel rendered); pass `all-panels` when every tab's panel stays mounted. `tabIds(prefix, id)` returns the linked ids. |
 | `SidebarItem` | Navigation button for use inside `AppSidebar`. Accepts `label`, `icon`, `active`, and `disabled` props. |
+| `SidebarGroup` | Labelled group of sidebar items: a `<fieldset>` whose visible `<legend>` names the group. |
 | `CopyableAddress` | Shows a value (address/blob id/tx digest) with a dedicated **copy icon** (the value text is not the copy trigger). Put a link in the default slot to make it both linkable and copyable. Props: `address`, `truncate`, `chars`, `label`. |
 | `ExplorerLink` | External block-explorer link with a truncated label (or slot). Chain-agnostic — pass `href` (build it with `suiExplorerUrl`, or an app helper such as a Walruscan URL). Nest inside `CopyableAddress` for link + copy. |
 
@@ -86,6 +91,17 @@ icon copies:
 </CopyableAddress>
 ```
 
+### Desktop-console primitives
+
+| Component | Description |
+| --- | --- |
+| `UiPanel` | Titled surface: `<section>` + heading (`title` prop/slot; `level` 2–6, default 2) + body content directly inside. |
+| `UiStatGrid` / `UiStatRow` | Key/value readout as a description list (`<dl>` with `<dt>`/`<dd>` pairs). |
+| `UiToolbar` | Toolbar as `<menu>` (a list of commands). Props: `actions: ToolbarAction[]` (`{ id, label, disabled? }`); emits `action(id)`. |
+| `UiToolbarButton` | Compact console button; also usable standalone (refresh, pagination). |
+| `UiStatusBar` | Status bar as a list. Standard items from optional props `network` (+ `healthy`), `epoch`, `lastRefresh`; extra `<li>` items in the default slot. |
+| `UiDataTable`, `UiBadge`, `UiStatusDot`, `UiActivityFeed` / `UiActivityItem` | Scrollable table; status pill; health dot; activity list (`UiActivityItem` takes `type`, `time`, optional `datetime` to render a `<time>`). |
+
 ### Explorer helper
 
 | Export | Type | Description |

package/dist/base.css

@@ -1,2 +1,2 @@
-*,:before,:after{box-sizing:border-box}html,body{margin:0;padding:0}body{background:var(--bg);min-height:100vh;color:var(--text);font-family:var(--mw-font-sans);font-size:var(--font-size-base);line-height:var(--leading-normal);letter-spacing:var(--tracking-normal);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizelegibility}:where(ul,ol):where([role=list],[role=listitem]){margin:0;padding:0;list-style:none}:where(img,svg,video,canvas){max-width:100%;display:block}:where(fieldset){border:0;margin:0;padding:0}a{color:var(--accent);transition:color var(--transition-base);text-decoration:none}a:hover{text-decoration:underline}:where(button,input,select,textarea){font-family:inherit}:where(a,button,input,select,textarea):focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px}.mw-mono{font-family:var(--mw-font-mono)}.mw-noise{isolation:isolate;position:relative}.mw-noise:before{content:"";z-index:-1;background-image:var(--noise-overlay);opacity:var(--noise-opacity);pointer-events:none;background-repeat:repeat;position:absolute;inset:0}.mw-hand-drawn{display:inline-flex;position:relative}.mw-spinner{width:var(--space-sm);height:var(--space-sm);border:2px solid var(--border);border-top-color:var(--accent);animation:mw-spin var(--transition-slow) linear infinite;border-radius:50%;display:inline-block}@keyframes mw-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.001ms!important;animation-duration:.001ms!important}.mw-spinner{border-top-color:var(--accent);animation:none}}.mw-header[data-v-a7df94dc]{align-items:center;gap:var(--space-sm);height:var(--mw-header-height,56px);padding:0 var(--space-sm);background:var(--_bg);color:var(--_text);border-bottom:1px solid var(--_border);font-family:var(--mw-font-sans);transition:background var(--transition-base), backdrop-filter var(--transition-base), border-color var(--transition-base), box-shadow var(--transition-base);display:flex}.mw-header--sticky[data-v-a7df94dc]{z-index:50;position:sticky;top:0}.mw-header--scrolled[data-v-a7df94dc]{background:color-mix(in srgb, var(--_bg-solid,var(--bg)) 82%, transparent);-webkit-backdrop-filter:blur(10px);border-bottom-color:var(--border);box-shadow:0 1px 0 color-mix(in srgb, var(--border) 60%, transparent)}.mw-header__brand[data-v-a7df94dc]{align-items:center;gap:var(--space-2xs);letter-spacing:var(--tracking-wide);white-space:nowrap;font-weight:650;display:flex}.mw-header__center[data-v-a7df94dc]{flex:auto;min-width:0}.mw-header__actions[data-v-a7df94dc]{align-items:center;gap:var(--space-2xs);margin-left:auto;display:flex}.mw-sidebar[data-v-a2b8405c]{height:100%;width:var(--mw-sidebar-width,240px);background:var(--_bg);color:var(--_text);border-right:1px solid var(--_border);font-family:var(--mw-font-sans);flex-direction:column;display:flex}.mw-sidebar__head[data-v-a2b8405c]{padding:var(--space-sm);border-bottom:1px solid var(--_border)}.mw-sidebar__nav[data-v-a2b8405c]{gap:var(--space-3xs);padding:var(--space-xs);flex-direction:column;flex:auto;display:flex;overflow-y:auto}.mw-sidebar__body[data-v-a2b8405c]{flex-shrink:0}.mw-sidebar__foot[data-v-a2b8405c]{padding:var(--space-xs) var(--space-sm);border-top:1px solid var(--_border);color:var(--_muted);font-size:var(--font-size-sm)}.mw-footer[data-v-979579a9]{align-items:center;gap:var(--space-sm);padding:var(--space-xs) var(--space-sm);background:var(--_bg);color:var(--_muted);border-top:1px solid var(--_border);font-family:var(--mw-font-sans);font-size:var(--font-size-sm);flex-wrap:wrap;display:flex}.mw-footer--transparent[data-v-979579a9]{border-top:1px solid var(--border)}.mw-footer__center[data-v-979579a9]{flex:auto;min-width:0}.mw-footer__end[data-v-979579a9]{align-items:center;gap:var(--space-sm);margin-left:auto;display:flex}.mw-footer__docs-link[data-v-979579a9]{color:inherit;text-underline-offset:2px;opacity:.7;text-decoration:underline}.mw-footer__docs-link[data-v-979579a9]:hover{opacity:1}.mw-mode[data-v-345f2b04]{border:1px solid var(--_border,var(--border));border-radius:var(--radius);background:color-mix(in srgb, var(--_text,var(--text)) 6%, transparent);gap:2px;padding:2px;display:inline-flex}.mw-mode__btn[data-v-345f2b04]{align-items:center;gap:var(--space-3xs);padding:var(--space-3xs) var(--space-2xs);border-radius:calc(var(--radius) - 3px);color:var(--_text,var(--text));font:inherit;font-size:var(--font-size-sm);cursor:pointer;opacity:.7;transition:opacity var(--transition-base), background var(--transition-base);background:0 0;border:0;display:inline-flex}.mw-mode__btn[data-v-345f2b04]:hover{opacity:1}.mw-mode__btn.is-active[data-v-345f2b04]{opacity:1;background:color-mix(in srgb, var(--_text,var(--text)) 14%, transparent)}.mw-mode__btn[data-v-345f2b04]:focus-visible{outline:2px solid var(--focus-ring);outline-offset:1px}@media (width<=640px){.mw-mode__label[data-v-345f2b04]{display:none}}.mw-btn[data-v-bc33cc23]{justify-content:center;align-items:center;gap:var(--space-2xs);padding:var(--space-2xs) var(--space-xs);border-radius:var(--radius);font:inherit;cursor:pointer;transition:filter var(--transition-base), background var(--transition-base);border:1px solid #0000;font-weight:550;display:inline-flex}.mw-btn[data-v-bc33cc23]:disabled{opacity:.55;cursor:not-allowed}.mw-btn[data-v-bc33cc23]:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px}.mw-btn--primary[data-v-bc33cc23]{background:var(--accent);color:var(--accent-contrast)}.mw-btn--primary[data-v-bc33cc23]:not(:disabled):hover{filter:brightness(1.08)}.mw-btn--secondary[data-v-bc33cc23]{background:var(--secondary);color:var(--secondary-contrast)}.mw-btn--secondary[data-v-bc33cc23]:not(:disabled):hover{filter:brightness(1.08)}.mw-btn--ghost[data-v-bc33cc23]{color:var(--text);border-color:var(--border);background:0 0}.mw-btn--ghost[data-v-bc33cc23]:not(:disabled):hover{background:var(--lift)}.mw-btn--danger[data-v-bc33cc23]{background:var(--danger);color:var(--accent-contrast)}.mw-btn--danger[data-v-bc33cc23]:not(:disabled):hover{filter:brightness(1.08)}.mw-card[data-v-883f87f5]{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);color:var(--text);overflow:hidden}.mw-card__header[data-v-883f87f5]{padding:var(--space-xs) var(--space-sm);border-bottom:1px solid var(--border)}.mw-card__title[data-v-883f87f5]{font-size:var(--font-size-base);margin:0;font-weight:600}.mw-card__body[data-v-883f87f5]{padding:var(--space-sm)}.mw-card__footer[data-v-883f87f5]{padding:var(--space-xs) var(--space-sm);border-top:1px solid var(--border);background:var(--lift)}.mw-select[data-v-3096db80]{position:relative}.mw-select select[data-v-3096db80]{appearance:none;width:100%;padding:var(--space-2xs) calc(var(--space-md) + var(--space-2xs)) var(--space-2xs) var(--space-xs);background:var(--surface);color:var(--text);border:1px solid var(--border);border-radius:var(--radius);font:inherit}.mw-select select[data-v-3096db80]:focus-visible{outline:2px solid var(--focus-ring);outline-offset:1px}.mw-select__chevron[data-v-3096db80]{right:var(--space-xs);pointer-events:none;stroke:var(--muted);stroke-width:1.5px;fill:none;position:absolute;top:50%;transform:translateY(-50%)}.mw-notice[data-v-ee7fffb1]{padding:var(--space-2xs) var(--space-xs);border:1px solid var(--border);border-radius:var(--radius);background:var(--lift);color:var(--text);font-size:var(--font-size-sm);border-left-width:3px;margin:0}.mw-notice--error[data-v-ee7fffb1]{border-left-color:var(--danger);color:var(--danger);background:color-mix(in srgb, var(--danger) 8%, transparent)}.mw-notice--ok[data-v-ee7fffb1]{border-left-color:var(--ok);color:var(--ok);background:color-mix(in srgb, var(--ok) 8%, transparent)}.sidebar-item[data-v-8da2d583]{align-items:center;gap:var(--space-2xs);width:100%;padding:var(--space-2xs) var(--space-xs);border-radius:var(--radius);color:inherit;font:inherit;text-align:left;cursor:pointer;opacity:.85;transition:background var(--transition-base), opacity var(--transition-base);background:0 0;border:0;display:flex}.sidebar-item[data-v-8da2d583]:hover:not(:disabled){background:color-mix(in srgb, currentColor 10%, transparent);opacity:1}.sidebar-item.is-active[data-v-8da2d583]{background:color-mix(in srgb, var(--accent) 26%, transparent);opacity:1}.sidebar-item[data-v-8da2d583]:disabled{cursor:default}.sidebar-item[data-v-8da2d583]:focus-visible{outline:2px solid var(--focus-ring);outline-offset:1px}.sidebar-item__icon[data-v-8da2d583]{text-align:center;width:1.1rem}.sidebar-group--l1+.sidebar-group--l1[data-v-c8f6c8b2]{margin-block-start:var(--space-2xs)}.sidebar-group__label[data-v-c8f6c8b2]{padding:var(--space-3xs) var(--space-xs);font-size:var(--font-size-xs);color:var(--muted);-webkit-user-select:none;user-select:none;font-weight:600}.sidebar-group--l1>.sidebar-group__label[data-v-c8f6c8b2]{text-transform:uppercase;letter-spacing:var(--tracking-wide);opacity:.75}.sidebar-group--l2>.sidebar-group__label[data-v-c8f6c8b2]{opacity:.6;padding-inline-start:calc(var(--space-xs) + var(--space-3xs))}.sidebar-group--l2>.sidebar-group__items[data-v-c8f6c8b2]{padding-inline-start:var(--space-3xs)}.mw-tab-nav[data-v-00b3c666]{gap:var(--space-3xs);border-bottom:2px solid var(--border);display:flex}.mw-tab-nav__tab[data-v-00b3c666]{appearance:none;padding:var(--space-2xs) var(--space-sm);cursor:pointer;font-size:var(--font-size-base);color:var(--muted);transition:color var(--transition-base), border-color var(--transition-base);background:0 0;border:none;border-bottom:2px solid #0000;border-radius:0;margin-bottom:-2px}.mw-tab-nav__tab[data-v-00b3c666]:hover{color:var(--text)}.mw-tab-nav__tab--active[data-v-00b3c666]{border-bottom-color:var(--accent);color:var(--text);font-weight:600}.mw-tab-nav--raised[data-v-00b3c666]{border-bottom:1px solid var(--border);background:var(--surface);scrollbar-width:none;flex-shrink:0;align-items:flex-end;gap:2px;padding:4px 4px 0;overflow-x:auto}.mw-tab-nav--raised[data-v-00b3c666]::-webkit-scrollbar{display:none}.mw-tab-nav--raised .mw-tab-nav__tab[data-v-00b3c666]{border-bottom:1px solid var(--border);color:var(--muted);background:var(--lift);letter-spacing:.01em;white-space:nowrap;transition:color var(--transition-base), background var(--transition-base), border-color var(--transition-base);border-top:2px solid #0000;border-left:1px solid #0000;border-right:1px solid #0000;margin-bottom:-1px;padding:5px 14px 6px;font-size:.8rem;font-weight:500}.mw-tab-nav--raised .mw-tab-nav__tab[data-v-00b3c666]:hover:not(.mw-tab-nav__tab--active){color:var(--text);background:var(--surface)}.mw-tab-nav--raised .mw-tab-nav__tab--active[data-v-00b3c666]{color:var(--text);background:var(--bg);border-color:var(--accent) var(--border) var(--bg) var(--border);font-weight:600}.ca-root[data-v-b43dabdd]{align-items:center;gap:.35em;display:inline-flex}.ca-value[data-v-b43dabdd]{font-family:var(--mw-font-mono,monospace);font-size:inherit}.ca-copy[data-v-b43dabdd]{color:var(--muted,#888);cursor:pointer;transition:color var(--transition-base);background:0 0;border:none;justify-content:center;align-items:center;padding:0;line-height:1;display:inline-flex}.ca-copy[data-v-b43dabdd]:hover{color:var(--text,#f0f0f0)}.ca-copy--copied[data-v-b43dabdd]{color:var(--accent,#6366f1)}.ca-icon[data-v-b43dabdd]{display:block}.el-root[data-v-073d1bbe]{font-family:monospace;font-size:inherit;color:var(--accent,#6366f1);text-underline-offset:2px;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;transition:color .15s}.el-root[data-v-073d1bbe]:hover{color:var(--text,#f0f0f0);text-decoration-style:solid}.copyright-line[data-v-44b327f4]{white-space:nowrap;text-align:center;display:inline-block}.symbol-link[data-v-44b327f4]{color:inherit;vertical-align:text-top;align-items:center;padding:0 .1rem;text-decoration:none;display:inline-flex}.symbol-link[data-v-44b327f4]:hover{text-decoration:underline}.kopimi-symbol[data-v-44b327f4]{align-items:center;line-height:1;display:inline-flex}.kopimi-mark[data-v-44b327f4]{vertical-align:-.15em;display:inline}.text-content[data-v-44b327f4]{display:inline}.ui-stepper[data-v-33717fc3]{margin:0 0 var(--space-md,1.5rem);padding:0;list-style:none;display:flex}.ui-stepper__step[data-v-33717fc3]{flex-direction:column;flex:1 1 0;align-items:center;gap:.4rem;min-width:0;display:flex;position:relative}.ui-stepper__step[data-v-33717fc3]:not(:first-child):before{content:"";background:var(--border);z-index:0;height:2px;position:absolute;top:1rem;left:-50%;right:50%}.ui-stepper__step.is-done[data-v-33717fc3]:before,.ui-stepper__step.is-active[data-v-33717fc3]:before{background:var(--accent)}.ui-stepper__badge[data-v-33717fc3]{z-index:1;border:2px solid var(--border);background:var(--surface);width:2rem;height:2rem;color:var(--muted);cursor:default;transition:background-color var(--transition-base,.2s), border-color var(--transition-base,.2s);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;padding:0;font-family:inherit;font-size:.8rem;font-weight:600;line-height:1;display:flex;position:relative}button.ui-stepper__badge[data-v-33717fc3]{cursor:pointer}button.ui-stepper__badge[data-v-33717fc3]:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px}.is-done .ui-stepper__badge[data-v-33717fc3]{background:var(--accent);border-color:var(--accent);color:#fff}.is-active .ui-stepper__badge[data-v-33717fc3]{background:color-mix(in srgb, var(--accent) 12%, var(--surface));border-color:var(--accent);color:var(--accent)}.ui-stepper__label[data-v-33717fc3]{text-align:center;color:var(--muted);white-space:nowrap;text-overflow:ellipsis;max-width:100%;font-size:.78rem;line-height:1.2;overflow:hidden}.is-done .ui-stepper__label[data-v-33717fc3],.is-active .ui-stepper__label[data-v-33717fc3]{color:var(--text)}.is-active .ui-stepper__label[data-v-33717fc3]{font-weight:600}.mw-seg[data-v-0dacb6ea]{border:1px solid var(--border);border-radius:var(--radius);display:inline-flex;overflow:hidden}.mw-seg__item[data-v-0dacb6ea]{height:2rem;padding:0 var(--space-sm);border-right:1px solid var(--border);cursor:pointer;font-size:var(--font-size-sm);color:var(--muted);transition:background var(--transition-base), color var(--transition-base);-webkit-user-select:none;user-select:none;white-space:nowrap;background:0 0;justify-content:center;align-items:center;margin:0;display:flex}.mw-seg__item[data-v-0dacb6ea]:last-child{border-right:none}.mw-seg__item--active[data-v-0dacb6ea]{background:var(--accent);color:var(--accent-contrast)}.mw-seg__item--disabled[data-v-0dacb6ea]{opacity:.5;pointer-events:none;cursor:not-allowed}.mw-seg__item input[type=radio][data-v-0dacb6ea]{opacity:0;pointer-events:none;width:0;height:0;position:absolute}.mw-field-hint[data-v-29d9a629]{margin-left:var(--space-3xs,.35rem);vertical-align:middle;display:inline-block;position:relative}.mw-field-hint__btn[data-v-29d9a629]{border:1px solid var(--muted);width:1.1em;height:1.1em;color:var(--muted);cursor:help;background:0 0;border-radius:50%;justify-content:center;align-items:center;padding:0;font-family:inherit;font-size:.75rem;font-weight:700;line-height:1;display:inline-flex}.mw-field-hint__btn[data-v-29d9a629]:focus-visible{outline:2px solid var(--focus-ring);outline-offset:1px}.mw-field-hint__tip[data-v-29d9a629]{z-index:10;min-width:200px;max-width:min(300px,90vw);padding:var(--space-2xs,.6rem) var(--space-xs,.75rem);background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);font-size:var(--font-size-sm,.85rem);color:var(--text);visibility:hidden;opacity:0;transition:opacity var(--transition-base,.15s ease), visibility var(--transition-base,.15s ease);pointer-events:none;font-weight:400;line-height:1.5;position:absolute;top:calc(100% + 6px);left:0;box-shadow:0 4px 12px #0000001f}.mw-field-hint:hover .mw-field-hint__tip[data-v-29d9a629],.mw-field-hint:focus-within .mw-field-hint__tip[data-v-29d9a629]{visibility:visible;opacity:1;pointer-events:auto}.mw-form-field label[data-v-c22333c7]{margin:.9rem 0 .3rem;font-weight:600;display:block}.mw-form-field__hint[data-v-c22333c7]{color:var(--muted);font-size:var(--font-size-sm,.9rem);margin:.25rem 0 0;font-weight:400}.mw-form-field__error[data-v-c22333c7]{color:var(--danger);font-size:var(--font-size-sm,.88rem);margin:.25rem 0 0}.mw-panel[data-v-d112e62d]{border:1px solid var(--border);background:var(--surface);border-radius:2px;overflow:hidden}.mw-panel__head[data-v-d112e62d]{letter-spacing:.06em;text-transform:uppercase;color:var(--muted);background:var(--lift);border-bottom:1px solid var(--border);padding:5px 10px;font-size:.72rem;font-weight:600}.mw-panel__body[data-v-d112e62d]{padding:10px}.mw-badge[data-v-5aa44ef5]{letter-spacing:.04em;text-transform:uppercase;border-radius:2px;padding:1px 6px;font-size:.7rem;font-weight:600;display:inline-block}.mw-badge--active[data-v-5aa44ef5]{background:color-mix(in srgb, var(--ok) 20%, transparent);color:var(--ok)}.mw-badge--closed[data-v-5aa44ef5]{background:color-mix(in srgb, var(--muted) 20%, transparent);color:var(--muted)}.mw-badge--pending[data-v-5aa44ef5]{background:color-mix(in srgb, var(--warning) 20%, transparent);color:var(--warning)}.mw-badge--neutral[data-v-5aa44ef5]{background:var(--lift);color:var(--muted)}.mw-toolbar[data-v-827466de]{border-bottom:1px solid var(--border);background:var(--surface);flex-shrink:0;align-items:center;gap:4px;padding:4px 8px;display:flex}.mw-toolbar-btn[data-v-d5f19134]{background:var(--lift);border:1px solid var(--border);height:26px;color:var(--text);cursor:pointer;white-space:nowrap;border-radius:2px;align-items:center;gap:5px;padding:3px 10px;font-size:.8rem;transition:background .1s,border-color .1s;display:inline-flex}.mw-toolbar-btn[data-v-d5f19134]:hover:not(:disabled){background:var(--surface);border-color:var(--accent)}.mw-toolbar-btn[data-v-d5f19134]:disabled{opacity:.5;cursor:not-allowed}.mw-toolbar-btn[data-v-d5f19134]:focus-visible{outline:2px solid var(--focus-ring);outline-offset:1px}.mw-stat-grid[data-v-f481948b]{grid-template-columns:auto 1fr;gap:3px 12px;font-size:.8rem;display:grid}.mw-stat-grid__label[data-v-4c872fab]{color:var(--muted);white-space:nowrap}.mw-stat-grid__value[data-v-4c872fab]{font-family:var(--mw-font-mono);color:var(--text);text-align:right}.mw-stat-grid__value--left[data-v-4c872fab]{text-align:left}.mw-data-table-wrap[data-v-fc20cb49]{overflow-x:auto}.mw-data-table[data-v-fc20cb49]{border-collapse:collapse;width:100%;font-size:.8rem}.mw-data-table[data-v-fc20cb49] th{text-align:left;letter-spacing:.05em;text-transform:uppercase;color:var(--muted);border-bottom:1px solid var(--border);white-space:nowrap;padding:5px 8px;font-size:.7rem;font-weight:600}.mw-data-table[data-v-fc20cb49] td{border-bottom:1px solid var(--border);vertical-align:middle;padding:5px 8px}.mw-data-table[data-v-fc20cb49] tbody tr:last-child td{border-bottom:none}.mw-data-table[data-v-fc20cb49] tbody tr:nth-child(2n) td{background:var(--lift)}.mw-data-table__empty[data-v-fc20cb49]{text-align:center;color:var(--muted);padding:24px 16px;font-size:.8rem}.mw-statusbar[data-v-890bec3f]{color:var(--muted);background:var(--surface);border-top:1px solid var(--border);font-size:.72rem;font-family:var(--mw-font-mono);z-index:1;flex-shrink:0;align-items:center;gap:16px;padding:3px 12px;display:flex;position:sticky;bottom:0}.mw-statusbar[data-v-890bec3f] .mw-statusbar__item{align-items:center;display:flex}.mw-statusbar[data-v-890bec3f] .mw-statusbar__sep{color:var(--border)}.mw-status-dot[data-v-62e9a7cc]{border-radius:50%;flex-shrink:0;width:7px;height:7px;margin-right:4px;display:inline-block}.mw-status-dot--ok[data-v-62e9a7cc]{background:var(--ok)}.mw-status-dot--warn[data-v-62e9a7cc]{background:var(--warning)}.mw-status-dot--error[data-v-62e9a7cc]{background:var(--danger)}.mw-feed[data-v-9e578c9d]{margin:0;padding:0;font-size:.78rem;list-style:none}.mw-feed__item[data-v-f662c634]{border-bottom:1px solid var(--border);color:var(--muted);align-items:flex-start;gap:8px;padding:4px 0;display:flex}.mw-feed__item[data-v-f662c634]:last-child{border-bottom:none}.mw-feed__dot[data-v-f662c634]{background:var(--accent);border-radius:50%;flex-shrink:0;width:6px;height:6px;margin-top:4px}.mw-feed__type[data-v-f662c634]{color:var(--text);white-space:nowrap;font-weight:500}.mw-feed__time[data-v-f662c634]{white-space:nowrap;font-family:var(--mw-font-mono);margin-left:auto;font-size:.72rem}.status-widget[data-v-6436368e]{align-items:center;gap:var(--space-2xs);color:inherit;font-size:var(--font-size-sm);opacity:.85;transition:opacity var(--transition-base);text-decoration:none;display:inline-flex}.status-widget[data-v-6436368e]:hover{opacity:1}.status-widget__dot[data-v-6436368e]{width:var(--space-2xs);height:var(--space-2xs);border-radius:50%;flex-shrink:0}.status-widget--ok .status-widget__dot[data-v-6436368e]{background:var(--ok)}.status-widget--degraded .status-widget__dot[data-v-6436368e]{background:var(--warning)}.status-widget--error .status-widget__dot[data-v-6436368e]{background:var(--danger)}
+*,:before,:after{box-sizing:border-box}html,body{margin:0;padding:0}body{background:var(--bg);min-height:100vh;color:var(--text);font-family:var(--mw-font-sans);font-size:var(--font-size-base);line-height:var(--leading-normal);letter-spacing:var(--tracking-normal);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizelegibility}:where(ul,ol):where([role=list],[role=listitem]),:where(menu){margin:0;padding:0;list-style:none}.mw-visually-hidden{clip-path:inset(50%);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}:where(img,svg,video,canvas){max-width:100%;display:block}:where(fieldset){border:0;min-inline-size:0;margin:0;padding:0}:where(legend){padding:0}a{color:var(--accent);transition:color var(--transition-base);text-decoration:none}a:hover{text-decoration:underline}:where(button,input,select,textarea){font-family:inherit}:where(a,button,input,select,textarea):focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px}.mw-mono{font-family:var(--mw-font-mono)}.mw-noise{isolation:isolate;position:relative}.mw-noise:before{content:"";z-index:-1;background-image:var(--noise-overlay);opacity:var(--noise-opacity);pointer-events:none;background-repeat:repeat;position:absolute;inset:0}.mw-hand-drawn{display:inline-flex;position:relative}.mw-spinner{width:var(--space-sm);height:var(--space-sm);border:2px solid var(--border);border-top-color:var(--accent);animation:mw-spin var(--transition-slow) linear infinite;border-radius:50%;display:inline-block}@keyframes mw-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.001ms!important;animation-duration:.001ms!important}.mw-spinner{border-top-color:var(--accent);animation:none}}.mw-header[data-v-4c177b22]{--_bg:var(--v207c6e6c);--_surface:var(--f304fa44);--_text:var(--v25353d32);--_muted:var(--v2a36159c);--_border:var(--v65041df1);--_ok:var(--v20707ebe);--_danger:var(--v49861e28);--_info:var(--v12e68073);align-items:center;gap:var(--space-2xs);height:var(--mw-header-height,56px);padding:0 var(--space-sm);background:var(--_bg);color:var(--_text);border-bottom:1px solid var(--_border);font-family:var(--mw-font-sans);transition:background var(--transition-base), backdrop-filter var(--transition-base), border-color var(--transition-base), box-shadow var(--transition-base);display:flex}.mw-header--sticky[data-v-4c177b22]{z-index:50;position:sticky;top:0}.mw-header--scrolled[data-v-4c177b22]{background:color-mix(in srgb, var(--_bg-solid,var(--bg)) 82%, transparent);-webkit-backdrop-filter:blur(10px);border-bottom-color:var(--border);box-shadow:0 1px 0 color-mix(in srgb, var(--border) 60%, transparent)}.mw-header>[data-v-4c177b22-s]:first-child{align-items:center;gap:var(--space-2xs);letter-spacing:var(--tracking-wide);white-space:nowrap;margin-inline-end:auto;font-weight:650;display:flex}.mw-header[data-v-4c177b22]:not(.mw-header--transparent){--ok:var(--_ok);--danger:var(--_danger);--info:var(--_info)}.mw-sidebar[data-v-30f2000a]{--_bg:var(--v71ead984);--_surface:var(--fe385338);--_text:var(--v7d45f128);--_muted:var(--v130792a2);--_border:var(--d33b7caa);--_ok:var(--v71f0d15b);--_danger:var(--v7ae441e2);--_info:var(--a1e36aa6);--_width:var(--v4463291a);height:100%;width:var(--_width);background:var(--_bg);color:var(--_text);border-right:1px solid var(--_border);font-family:var(--mw-font-sans);flex-direction:column;display:flex}.mw-sidebar__nav[data-v-30f2000a]{gap:var(--space-3xs);padding:var(--space-xs) 0;flex-direction:column;flex:auto;display:flex;overflow-y:auto}.mw-sidebar[data-v-30f2000a]:not(.mw-sidebar--transparent){--ok:var(--_ok);--danger:var(--_danger);--info:var(--_info)}.mw-footer[data-v-6c5fa699]{--_bg:var(--v605673bd);--_surface:var(--v08ecb7cb);--_text:var(--v796a1136);--_muted:var(--v4ed7a1c9);--_border:var(--v56d7d138);--_ok:var(--v605c6b94);--_danger:var(--v8dd3d0ca);--_info:var(--v9e078ab4);align-items:center;gap:var(--space-sm);padding:var(--space-xs) var(--space-sm);background:var(--_bg);color:var(--_muted);border-top:1px solid var(--_border);font-family:var(--mw-font-sans);font-size:var(--font-size-sm);flex-wrap:wrap;display:flex}.mw-footer--transparent[data-v-6c5fa699]{border-top:1px solid var(--border)}.mw-footer__docs[data-v-6c5fa699]{align-items:center;gap:var(--space-sm);margin-inline-start:auto;display:flex}.mw-footer__docs a[data-v-6c5fa699]{color:inherit;text-underline-offset:2px;opacity:.7;text-decoration:underline}.mw-footer__docs a[data-v-6c5fa699]:hover{opacity:1}.mw-footer[data-v-6c5fa699]:not(.mw-footer--transparent){--ok:var(--_ok);--danger:var(--_danger);--info:var(--_info)}.mw-mode[data-v-e5cba7a7]{border:1px solid var(--_border,var(--border));border-radius:var(--radius);background:color-mix(in srgb, var(--_text,var(--text)) 6%, transparent);gap:2px;min-inline-size:0;margin:0;padding:2px;display:inline-flex}.mw-mode__btn[data-v-e5cba7a7]{align-items:center;gap:var(--space-3xs);padding:var(--space-3xs) var(--space-2xs);border-radius:calc(var(--radius) - 3px);color:var(--_text,var(--text));font:inherit;font-size:var(--font-size-sm);cursor:pointer;opacity:.7;transition:opacity var(--transition-base), background var(--transition-base);background:0 0;border:0;display:inline-flex}.mw-mode__btn[data-v-e5cba7a7]:hover{opacity:1}.mw-mode__btn.is-active[data-v-e5cba7a7]{opacity:1;background:color-mix(in srgb, var(--_text,var(--text)) 14%, transparent)}.mw-mode__btn[data-v-e5cba7a7]:focus-visible{outline:2px solid var(--focus-ring);outline-offset:1px}@media (width<=640px){.mw-mode__label[data-v-e5cba7a7]{display:none}}.mw-btn[data-v-bc33cc23]{justify-content:center;align-items:center;gap:var(--space-2xs);padding:var(--space-2xs) var(--space-xs);border-radius:var(--radius);font:inherit;cursor:pointer;transition:filter var(--transition-base), background var(--transition-base);border:1px solid #0000;font-weight:550;display:inline-flex}.mw-btn[data-v-bc33cc23]:disabled{opacity:.55;cursor:not-allowed}.mw-btn[data-v-bc33cc23]:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px}.mw-btn--primary[data-v-bc33cc23]{background:var(--accent);color:var(--accent-contrast)}.mw-btn--primary[data-v-bc33cc23]:not(:disabled):hover{filter:brightness(1.08)}.mw-btn--secondary[data-v-bc33cc23]{background:var(--secondary);color:var(--secondary-contrast)}.mw-btn--secondary[data-v-bc33cc23]:not(:disabled):hover{filter:brightness(1.08)}.mw-btn--ghost[data-v-bc33cc23]{color:var(--text);border-color:var(--border);background:0 0}.mw-btn--ghost[data-v-bc33cc23]:not(:disabled):hover{background:var(--lift)}.mw-btn--danger[data-v-bc33cc23]{background:var(--danger);color:var(--accent-contrast)}.mw-btn--danger[data-v-bc33cc23]:not(:disabled):hover{filter:brightness(1.08)}.mw-card[data-v-384b36cf]{padding:var(--space-sm);background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);color:var(--text);overflow:hidden}.mw-card__header[data-v-384b36cf]{margin:calc(-1 * var(--space-sm)) calc(-1 * var(--space-sm)) var(--space-sm);padding:var(--space-xs) var(--space-sm);border-bottom:1px solid var(--border)}.mw-card__title[data-v-384b36cf]{font-size:var(--font-size-base);margin:0;font-weight:600}.mw-card__footer[data-v-384b36cf]{margin:var(--space-sm) calc(-1 * var(--space-sm)) calc(-1 * var(--space-sm));padding:var(--space-xs) var(--space-sm);border-top:1px solid var(--border);background:var(--lift)}.mw-select[data-v-38fbd9b5]{--_chevron-stroke:var(--muted);--_chevron-arm:6px;appearance:none;width:100%;padding:var(--space-2xs) calc(var(--space-md) + var(--space-2xs)) var(--space-2xs) var(--space-xs);background-color:var(--surface);background-image:linear-gradient(45deg, transparent calc(50% - .75px), var(--_chevron-stroke) calc(50% - .75px), var(--_chevron-stroke) calc(50% + .75px), transparent calc(50% + .75px)), linear-gradient(-45deg, transparent calc(50% - .75px), var(--_chevron-stroke) calc(50% - .75px), var(--_chevron-stroke) calc(50% + .75px), transparent calc(50% + .75px));background-position:right calc(var(--space-xs) + var(--_chevron-arm)) center, right var(--space-xs) center;background-size:var(--_chevron-arm) var(--_chevron-arm);color:var(--text);border:1px solid var(--border);border-radius:var(--radius);font:inherit;background-repeat:no-repeat}.mw-select[data-v-38fbd9b5]:focus-visible{outline:2px solid var(--focus-ring);outline-offset:1px}.mw-notice[data-v-ee7fffb1]{padding:var(--space-2xs) var(--space-xs);border:1px solid var(--border);border-radius:var(--radius);background:var(--lift);color:var(--text);font-size:var(--font-size-sm);border-left-width:3px;margin:0}.mw-notice--error[data-v-ee7fffb1]{border-left-color:var(--danger);color:var(--danger);background:color-mix(in srgb, var(--danger) 8%, transparent)}.mw-notice--ok[data-v-ee7fffb1]{border-left-color:var(--ok);color:var(--ok);background:color-mix(in srgb, var(--ok) 8%, transparent)}.sidebar-item[data-v-c8ae7e5f]{align-items:center;gap:var(--space-2xs);width:100%;padding:var(--space-2xs) var(--space-sm);color:inherit;font:inherit;text-align:left;cursor:pointer;opacity:.85;transition:background var(--transition-base), opacity var(--transition-base);background:0 0;border:0;border-radius:0;display:flex}.sidebar-item[data-v-c8ae7e5f]:hover:not(:disabled){background:color-mix(in srgb, currentColor 10%, transparent);opacity:1}.sidebar-item.is-active[data-v-c8ae7e5f]{background:color-mix(in srgb, var(--accent) 26%, transparent);opacity:1}.sidebar-item[data-v-c8ae7e5f]:disabled{cursor:default}.sidebar-item[data-v-c8ae7e5f]:focus-visible{outline:2px solid var(--focus-ring);outline-offset:1px}.sidebar-item__icon[data-v-c8ae7e5f]{text-align:center;width:1.1rem}.sidebar-group[data-v-95acc444]{border:0;min-inline-size:0;margin:0;padding:0}.sidebar-group--l1+.sidebar-group--l1[data-v-95acc444]{margin-block-start:var(--space-2xs)}.sidebar-group__label[data-v-95acc444]{float:inline-start;width:100%;padding:var(--space-3xs) var(--space-xs);font-size:var(--font-size-xs);color:var(--muted);-webkit-user-select:none;user-select:none;font-weight:600}.sidebar-group__label[data-v-95acc444]+*{clear:both}.sidebar-group--l1>.sidebar-group__label[data-v-95acc444]{text-transform:uppercase;letter-spacing:var(--tracking-wide);opacity:.75}.sidebar-group--l2[data-v-95acc444]{padding-inline-start:var(--space-3xs)}.sidebar-group--l2>.sidebar-group__label[data-v-95acc444]{opacity:.6;padding-inline-start:var(--space-xs)}.mw-tab-nav[data-v-fbb7de4c]{gap:var(--space-3xs);border-bottom:2px solid var(--border);margin:0;padding:0;list-style:none;display:flex}.mw-tab-nav__item[data-v-fbb7de4c]{display:contents}.mw-tab-nav__tab[data-v-fbb7de4c]{appearance:none;padding:var(--space-2xs) var(--space-sm);cursor:pointer;font-size:var(--font-size-base);color:var(--muted);transition:color var(--transition-base), border-color var(--transition-base);background:0 0;border:none;border-bottom:2px solid #0000;border-radius:0;margin-bottom:-2px}.mw-tab-nav__tab[data-v-fbb7de4c]:hover{color:var(--text)}.mw-tab-nav__tab--active[data-v-fbb7de4c]{border-bottom-color:var(--accent);color:var(--text);font-weight:600}.mw-tab-nav--raised[data-v-fbb7de4c]{border-bottom:1px solid var(--border);background:var(--surface);scrollbar-width:none;flex-shrink:0;align-items:flex-end;gap:2px;padding:4px 4px 0;overflow-x:auto}.mw-tab-nav--raised[data-v-fbb7de4c]::-webkit-scrollbar{display:none}.mw-tab-nav--raised .mw-tab-nav__tab[data-v-fbb7de4c]{border-bottom:1px solid var(--border);color:var(--muted);background:var(--lift);letter-spacing:.01em;white-space:nowrap;transition:color var(--transition-base), background var(--transition-base), border-color var(--transition-base);border-top:2px solid #0000;border-left:1px solid #0000;border-right:1px solid #0000;margin-bottom:-1px;padding:5px 14px 6px;font-size:.8rem;font-weight:500}.mw-tab-nav--raised .mw-tab-nav__tab[data-v-fbb7de4c]:hover:not(.mw-tab-nav__tab--active){color:var(--text);background:var(--surface)}.mw-tab-nav--raised .mw-tab-nav__tab--active[data-v-fbb7de4c]{color:var(--text);background:var(--bg);border-color:var(--accent) var(--border) var(--bg) var(--border);font-weight:600}.mw-tab-nav--raised.mw-tab-nav--lg[data-v-fbb7de4c]{gap:3px;padding:6px 6px 0}.mw-tab-nav--raised.mw-tab-nav--lg .mw-tab-nav__tab[data-v-fbb7de4c]{padding:9px 20px 10px;font-size:.95rem;font-weight:600}.mw-tab-panel[data-v-add194c8]:focus-visible{outline:2px solid var(--focus-ring);outline-offset:-2px}.mw-dialog[data-v-78973168]{--_width:var(--ce627f2e);width:var(--_width);border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);max-height:90vh;color:var(--text);padding:0;box-shadow:0 1.25rem 3.75rem #00000073}.mw-dialog[data-v-78973168]::backdrop{-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);background:#00000080}.mw-dialog__content[data-v-78973168]{gap:var(--space-sm);padding:var(--space-md);flex-direction:column;display:flex}.mw-dialog__header[data-v-78973168]{justify-content:space-between;align-items:center;gap:var(--space-sm);display:flex}.mw-dialog__title[data-v-78973168]{font-size:var(--font-size-base);margin:0;font-weight:600}.mw-dialog__close[data-v-78973168]{padding:0 var(--space-3xs);border-radius:var(--radius);color:var(--muted);font-size:var(--font-size-xl);cursor:pointer;background:0 0;border:0;line-height:1}.mw-dialog__close[data-v-78973168]:hover{color:var(--text)}.mw-dialog__actions[data-v-78973168]{justify-content:flex-end;gap:var(--space-xs);flex-wrap:wrap;display:flex}.ca-root[data-v-56006bd1]{align-items:center;gap:.35em;display:inline-flex}.ca-value[data-v-56006bd1]{font-family:var(--mw-font-mono,monospace);font-size:inherit}.ca-copy[data-v-56006bd1]{color:var(--muted,#6e635c);cursor:pointer;transition:color var(--transition-base);background:0 0;border:none;justify-content:center;align-items:center;padding:0;line-height:1;display:inline-flex}.ca-copy[data-v-56006bd1]:hover{color:var(--text,#f0f0f0)}.ca-copy--copied[data-v-56006bd1]{color:var(--accent,#6366f1)}.ca-icon[data-v-56006bd1]{display:block}.el-root[data-v-073d1bbe]{font-family:monospace;font-size:inherit;color:var(--accent,#6366f1);text-underline-offset:2px;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;transition:color .15s}.el-root[data-v-073d1bbe]:hover{color:var(--text,#f0f0f0);text-decoration-style:solid}.copyright-line[data-v-464082bf]{white-space:nowrap;text-align:center;display:inline-block}.symbol-link[data-v-464082bf]{color:inherit;vertical-align:text-top;align-items:center;padding:0 .1rem;text-decoration:none;display:inline-flex}.symbol-link[data-v-464082bf]:hover{text-decoration:underline}.kopimi-symbol[data-v-464082bf]{align-items:center;line-height:1;display:inline-flex}.kopimi-mark[data-v-464082bf]{vertical-align:-.15em;display:inline}.text-content[data-v-464082bf]{display:inline}.ui-stepper[data-v-6f5db325]{margin:0 0 var(--space-md,1.5rem);padding:0;list-style:none;display:flex}.ui-stepper__step[data-v-6f5db325]{flex-direction:column;flex:1 1 0;align-items:center;gap:.4rem;min-width:0;display:flex;position:relative}.ui-stepper__step[data-v-6f5db325]:not(:first-child):before{content:"";background:var(--border);z-index:0;height:2px;position:absolute;top:1rem;left:-50%;right:50%}.ui-stepper__step.is-done[data-v-6f5db325]:before,.ui-stepper__step.is-active[data-v-6f5db325]:before{background:var(--accent)}.ui-stepper__badge[data-v-6f5db325]{z-index:1;border:2px solid var(--border);background:var(--surface);width:2rem;height:2rem;color:var(--muted);cursor:default;transition:background-color var(--transition-base,.2s), border-color var(--transition-base,.2s);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;padding:0;font-family:inherit;font-size:.8rem;font-weight:600;line-height:1;display:flex;position:relative}button.ui-stepper__badge[data-v-6f5db325]{cursor:pointer}button.ui-stepper__badge[data-v-6f5db325]:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px}.is-done .ui-stepper__badge[data-v-6f5db325]{background:var(--accent);border-color:var(--accent);color:#fff}.is-active .ui-stepper__badge[data-v-6f5db325]{background:color-mix(in srgb, var(--accent) 12%, var(--surface));border-color:var(--accent);color:var(--accent)}.ui-stepper__label[data-v-6f5db325]{text-align:center;color:var(--muted);white-space:nowrap;text-overflow:ellipsis;max-width:100%;font-size:.78rem;line-height:1.2;overflow:hidden}.is-done .ui-stepper__label[data-v-6f5db325],.is-active .ui-stepper__label[data-v-6f5db325]{color:var(--text)}.is-active .ui-stepper__label[data-v-6f5db325]{font-weight:600}.mw-seg[data-v-430ffdd6]{border:1px solid var(--border);border-radius:var(--radius);min-inline-size:0;margin:0;padding:0;display:inline-flex;overflow:hidden}.mw-seg__item[data-v-430ffdd6]{height:2rem;padding:0 var(--space-sm);border-right:1px solid var(--border);cursor:pointer;font-size:var(--font-size-sm);color:var(--muted);transition:background var(--transition-base), color var(--transition-base);-webkit-user-select:none;user-select:none;white-space:nowrap;background:0 0;justify-content:center;align-items:center;margin:0;display:flex}.mw-seg__item[data-v-430ffdd6]:last-child{border-right:none}.mw-seg__item--active[data-v-430ffdd6]{background:var(--accent);color:var(--accent-contrast)}.mw-seg__item[data-v-430ffdd6]:has(input:focus-visible){outline:2px solid var(--focus-ring);outline-offset:-2px}.mw-seg__item--disabled[data-v-430ffdd6]{opacity:.5;pointer-events:none;cursor:not-allowed}.mw-seg__item input[type=radio][data-v-430ffdd6]{opacity:0;pointer-events:none;width:0;height:0;position:absolute}.mw-field-hint[data-v-29d9a629]{margin-left:var(--space-3xs,.35rem);vertical-align:middle;display:inline-block;position:relative}.mw-field-hint__btn[data-v-29d9a629]{border:1px solid var(--muted);width:1.1em;height:1.1em;color:var(--muted);cursor:help;background:0 0;border-radius:50%;justify-content:center;align-items:center;padding:0;font-family:inherit;font-size:.75rem;font-weight:700;line-height:1;display:inline-flex}.mw-field-hint__btn[data-v-29d9a629]:focus-visible{outline:2px solid var(--focus-ring);outline-offset:1px}.mw-field-hint__tip[data-v-29d9a629]{z-index:10;min-width:200px;max-width:min(300px,90vw);padding:var(--space-2xs,.6rem) var(--space-xs,.75rem);background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);font-size:var(--font-size-sm,.85rem);color:var(--text);visibility:hidden;opacity:0;transition:opacity var(--transition-base,.15s ease), visibility var(--transition-base,.15s ease);pointer-events:none;font-weight:400;line-height:1.5;position:absolute;top:calc(100% + 6px);left:0;box-shadow:0 4px 12px #0000001f}.mw-field-hint:hover .mw-field-hint__tip[data-v-29d9a629],.mw-field-hint:focus-within .mw-field-hint__tip[data-v-29d9a629]{visibility:visible;opacity:1;pointer-events:auto}.mw-form-field[data-v-5aef34d9]{margin:0}.mw-form-field__label[data-v-5aef34d9]{margin:.9rem 0 .3rem;font-weight:600;display:inline-block}.mw-form-field :is(input[data-v-5aef34d9-s],select[data-v-5aef34d9-s],textarea[data-v-5aef34d9-s]){display:block}.mw-form-field__hint[data-v-5aef34d9],.mw-form-field__error[data-v-5aef34d9]{font-size:var(--font-size-sm,.9rem);margin:.25rem 0 0;display:block}.mw-form-field__hint[data-v-5aef34d9]{color:var(--muted);font-weight:400}.mw-form-field__error[data-v-5aef34d9]{color:var(--danger)}.mw-tool-intro[data-v-9a5436b9]{color:var(--muted);margin:.25rem 0 1.25rem}.mw-panel[data-v-62fac524]{border:1px solid var(--border);background:var(--surface);border-radius:2px;padding:10px;overflow:hidden}.mw-panel__title[data-v-62fac524]{letter-spacing:.06em;font-size:.72rem;font-weight:600;line-height:inherit;text-transform:uppercase;color:var(--muted);background:var(--lift);border-bottom:1px solid var(--border);margin:-10px -10px 10px;padding:5px 10px}.mw-badge[data-v-5aa44ef5]{letter-spacing:.04em;text-transform:uppercase;border-radius:2px;padding:1px 6px;font-size:.7rem;font-weight:600;display:inline-block}.mw-badge--active[data-v-5aa44ef5]{background:color-mix(in srgb, var(--ok) 20%, transparent);color:var(--ok)}.mw-badge--closed[data-v-5aa44ef5]{background:color-mix(in srgb, var(--muted) 20%, transparent);color:var(--muted)}.mw-badge--pending[data-v-5aa44ef5]{background:color-mix(in srgb, var(--warning) 20%, transparent);color:var(--warning)}.mw-badge--neutral[data-v-5aa44ef5]{background:var(--lift);color:var(--muted)}.mw-toolbar-btn[data-v-d5f19134]{background:var(--lift);border:1px solid var(--border);height:26px;color:var(--text);cursor:pointer;white-space:nowrap;border-radius:2px;align-items:center;gap:5px;padding:3px 10px;font-size:.8rem;transition:background .1s,border-color .1s;display:inline-flex}.mw-toolbar-btn[data-v-d5f19134]:hover:not(:disabled){background:var(--surface);border-color:var(--accent)}.mw-toolbar-btn[data-v-d5f19134]:disabled{opacity:.5;cursor:not-allowed}.mw-toolbar-btn[data-v-d5f19134]:focus-visible{outline:2px solid var(--focus-ring);outline-offset:1px}.mw-toolbar[data-v-170c8eb5]{border-bottom:1px solid var(--border);background:var(--surface);flex-shrink:0;align-items:center;gap:4px;margin:0;padding:4px 8px;list-style:none;display:flex}.mw-stat-grid[data-v-3608575d]{grid-template-columns:auto 1fr;gap:3px 12px;margin:0;font-size:.8rem;display:grid}.mw-stat-grid__label[data-v-829f7772]{color:var(--muted);white-space:nowrap}.mw-stat-grid__value[data-v-829f7772]{font-family:var(--mw-font-mono);color:var(--text);text-align:right;margin:0}.mw-stat-grid__value--left[data-v-829f7772]{text-align:left}.mw-data-table-wrap[data-v-de139c21]{overflow-x:auto}.mw-data-table[data-v-de139c21]{border-collapse:collapse;width:100%;font-size:.8rem}.mw-data-table[data-v-de139c21] th{text-align:left;letter-spacing:.05em;text-transform:uppercase;color:var(--muted);border-bottom:1px solid var(--border);white-space:nowrap;padding:5px 8px;font-size:.7rem;font-weight:600}.mw-data-table[data-v-de139c21] td{border-bottom:1px solid var(--border);vertical-align:middle;padding:5px 8px}.mw-data-table[data-v-de139c21] tbody tr:last-child td{border-bottom:none}.mw-data-table[data-v-de139c21] tbody tr:nth-child(2n) td{background:var(--lift)}.mw-data-table__empty[data-v-de139c21]{text-align:center;color:var(--muted);padding:24px 16px;font-size:.8rem}.mw-status-dot[data-v-62e9a7cc]{border-radius:50%;flex-shrink:0;width:7px;height:7px;margin-right:4px;display:inline-block}.mw-status-dot--ok[data-v-62e9a7cc]{background:var(--ok)}.mw-status-dot--warn[data-v-62e9a7cc]{background:var(--warning)}.mw-status-dot--error[data-v-62e9a7cc]{background:var(--danger)}.mw-statusbar[data-v-cb4a19b8]{color:var(--muted);background:var(--surface);border-top:1px solid var(--border);font-size:.72rem;font-family:var(--mw-font-mono);z-index:1;flex-shrink:0;align-items:center;gap:16px;margin:0;padding:3px 12px;list-style:none;display:flex;position:sticky;bottom:0}.mw-statusbar[data-v-cb4a19b8]>li{align-items:center;display:flex}.mw-statusbar[data-v-cb4a19b8]>li+li:before{content:"│" / "";color:var(--border);margin-inline-end:16px}.mw-statusbar__pending[data-v-cb4a19b8]{opacity:.7}.mw-feed[data-v-9e578c9d]{margin:0;padding:0;font-size:.78rem;list-style:none}.mw-feed__item[data-v-797b66a9]{border-bottom:1px solid var(--border);color:var(--text);white-space:nowrap;align-items:flex-start;gap:8px;padding:4px 0;font-weight:500;display:flex}.mw-feed__item[data-v-797b66a9]:before{content:"";background:var(--accent);border-radius:50%;flex-shrink:0;width:6px;height:6px;margin-top:4px}.mw-feed__item[data-v-797b66a9]:last-child{border-bottom:none}.mw-feed__meta[data-v-797b66a9]{color:var(--muted);font-family:var(--mw-font-mono);margin-left:auto;font-size:.72rem;font-weight:400}.status-widget[data-v-57682f53]{align-items:center;gap:var(--space-2xs);color:inherit;font-size:var(--font-size-sm);opacity:.85;transition:opacity var(--transition-base);text-decoration:none;display:inline-flex}.status-widget[data-v-57682f53]:hover{opacity:1}.status-widget[data-v-57682f53]:before{content:"";width:var(--space-2xs);height:var(--space-2xs);border-radius:50%;flex-shrink:0}.status-widget--ok[data-v-57682f53]:before{background:var(--ok)}.status-widget--degraded[data-v-57682f53]:before{background:var(--warning)}.status-widget--error[data-v-57682f53]:before{background:var(--danger)}
 /*$vite$:1*/

package/dist/components/AppTabNav.vue.d.ts

@@ -5,8 +5,14 @@ export interface AppTab {
 type __VLS_Props = {
     tabs: AppTab[];
     modelValue: string;
+    /** Shared with the UiTabPanel(s) of this tab set to link tab ↔ panel ids. */
+    idPrefix: string;
     ariaLabel?: string;
     variant?: 'underline' | 'raised';
+    /** 'lg' enlarges the tabs (padding + font) so they stand out from body text. */
+    size?: 'md' | 'lg';
+    /** Every tab's UiTabPanel is in the DOM (inactive ones hidden), not only the selected one. */
+    allPanels?: boolean;
 };
 declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     "update:modelValue": (id: string) => any;
@@ -14,6 +20,8 @@ declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {
     "onUpdate:modelValue"?: ((id: string) => any) | undefined;
 }>, {
     variant: "underline" | "raised";
+    size: "md" | "lg";
+    allPanels: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: typeof __VLS_export;
 export default _default;

package/dist/components/SidebarGroup.vue.d.ts

@@ -1,10 +1,9 @@
 /**
- * SidebarGroup — accessible section-header wrapper for sidebar navigation.
+ * SidebarGroup — accessible, labelled group of sidebar navigation items.
  *
- * Renders a visible group label and wraps its children in a WAI-ARIA `group` so
- * assistive technology announces the category before reading the contained items.
- * The visible label element carries `aria-hidden="true"` — its content is already
- * conveyed by `aria-label` on the group container, preventing double-announcement.
+ * Renders a native `<fieldset>` (implicit `group` role) whose visible `<legend>` is also
+ * the group's accessible name, so assistive technology announces the category once
+ * before reading the contained items — no ARIA attributes or hidden duplicates needed.
  *
  * Two visual levels are supported via the {@link SidebarGroupProps.level} prop:
  * - `1` — top-level category label (e.g. "Blockchain"): uppercase, wide tracking,
@@ -28,10 +27,7 @@
  * > "Blockchain, group; Sui, group; DAO, button, current page; Token Deployer, button"
  */
 type __VLS_Props = {
-    /**
-     * Human-readable group name. Used as both the `aria-label` on the group
-     * container and the rendered visible section header.
-     */
+    /** Human-readable group name, rendered as the group's visible `<legend>`. */
     label: string;
     /**
      * Visual hierarchy level.

package/dist/components/UiActivityItem.vue.d.ts

@@ -1,12 +1,15 @@
 type __VLS_Props = {
     type?: string;
     time?: string;
+    datetime?: string;
 };
-declare var __VLS_1: {}, __VLS_3: {};
+declare var __VLS_1: {}, __VLS_3: {}, __VLS_5: {};
 type __VLS_Slots = {} & {
     type?: (props: typeof __VLS_1) => any;
 } & {
     time?: (props: typeof __VLS_3) => any;
+} & {
+    time?: (props: typeof __VLS_5) => any;
 };
 declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;

package/dist/components/UiDialog.vue.d.ts

@@ -0,0 +1,45 @@
+type __VLS_Props = {
+    /** Dialog heading (also its accessible name). Override the markup with the `title` slot. */
+    title?: string;
+    /** Allow closing via Escape, backdrop click and the close button. */
+    dismissible?: boolean;
+    /** Accessible label for the header close button. */
+    closeLabel?: string;
+    /** CSS width of the dialog (default `min(420px, 90vw)`). */
+    width?: string;
+};
+declare function close(returnValue?: string): void;
+type __VLS_ModelProps = {
+    'open'?: boolean;
+};
+type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
+declare var __VLS_1: {}, __VLS_3: {}, __VLS_5: {
+    close: typeof close;
+};
+type __VLS_Slots = {} & {
+    title?: (props: typeof __VLS_1) => any;
+} & {
+    default?: (props: typeof __VLS_3) => any;
+} & {
+    actions?: (props: typeof __VLS_5) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<__VLS_PublicProps, {
+    close: typeof close;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    close: (returnValue: string) => any;
+    "update:open": (value: boolean) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    onClose?: ((returnValue: string) => any) | undefined;
+    "onUpdate:open"?: ((value: boolean) => any) | undefined;
+}>, {
+    dismissible: boolean;
+    closeLabel: string;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/UiPanel.vue.d.ts

@@ -1,13 +1,16 @@
 type __VLS_Props = {
     title?: string;
+    level?: 2 | 3 | 4 | 5 | 6;
 };
-declare var __VLS_1: {}, __VLS_3: {};
+declare var __VLS_7: {}, __VLS_9: {};
 type __VLS_Slots = {} & {
-    head?: (props: typeof __VLS_1) => any;
+    title?: (props: typeof __VLS_7) => any;
 } & {
-    default?: (props: typeof __VLS_3) => any;
+    default?: (props: typeof __VLS_9) => any;
 };
-declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+    level: 2 | 3 | 4 | 5 | 6;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
 declare const _default: typeof __VLS_export;
 export default _default;

package/dist/components/UiSelect.vue.d.ts

@@ -1,4 +1,7 @@
 type __VLS_ModelProps = {
+    /** Styled native <select>. A single root element: attributes (id, aria-*, disabled…) fall
+     * through to the select itself, and the chevron is painted in its background with two
+     * token-coloured gradient strokes (so it follows the theme without an overlay element). */
     modelValue?: string;
 };
 declare var __VLS_1: {};

package/dist/components/UiStatusBar.vue.d.ts

@@ -1,8 +1,16 @@
-declare var __VLS_1: {};
+type __VLS_Props = {
+    network?: string;
+    healthy?: boolean;
+    epoch?: number | null;
+    lastRefresh?: Date | null;
+};
+declare var __VLS_6: {};
 type __VLS_Slots = {} & {
-    default?: (props: typeof __VLS_1) => any;
+    default?: (props: typeof __VLS_6) => any;
 };
-declare const __VLS_base: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+    healthy: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
 declare const _default: typeof __VLS_export;
 export default _default;

package/dist/components/UiTabPanel.vue.d.ts

@@ -0,0 +1,17 @@
+type __VLS_Props = {
+    idPrefix: string;
+    tab: string;
+};
+declare var __VLS_1: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_1) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/UiToolIntro.vue.d.ts

@@ -0,0 +1,13 @@
+declare var __VLS_1: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_1) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/UiToolbar.vue.d.ts

@@ -1,13 +1,15 @@
-declare var __VLS_1: {};
-type __VLS_Slots = {} & {
-    default?: (props: typeof __VLS_1) => any;
+export interface ToolbarAction {
+    id: string;
+    label: string;
+    disabled?: boolean;
+}
+type __VLS_Props = {
+    actions: ToolbarAction[];
 };
-declare const __VLS_base: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
-declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    action: (id: string) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onAction?: ((id: string) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: typeof __VLS_export;
 export default _default;
-type __VLS_WithSlots<T, S> = T & {
-    new (): {
-        $slots: S;
-    };
-};

package/dist/index.d.ts

@@ -11,6 +11,10 @@ export { default as SidebarItem } from './components/SidebarItem.vue';
 export { default as SidebarGroup } from './components/SidebarGroup.vue';
 export { default as AppTabNav } from './components/AppTabNav.vue';
 export type { AppTab } from './components/AppTabNav.vue';
+export { default as UiTabPanel } from './components/UiTabPanel.vue';
+export { tabIds } from './tabs.js';
+export type { TabIds } from './tabs.js';
+export { default as UiDialog } from './components/UiDialog.vue';
 export { default as CopyableAddress } from './components/CopyableAddress.vue';
 export { default as ExplorerLink } from './components/ExplorerLink.vue';
 export { default as CopyrightLine } from './components/CopyrightLine.vue';
@@ -20,9 +24,11 @@ export { default as UiSegmentedControl } from './components/UiSegmentedControl.v
 export type { SegmentedOption } from './components/UiSegmentedControl.vue';
 export { default as UiFieldHint } from './components/UiFieldHint.vue';
 export { default as UiFormField } from './components/UiFormField.vue';
+export { default as UiToolIntro } from './components/UiToolIntro.vue';
 export { default as UiPanel } from './components/UiPanel.vue';
 export { default as UiBadge } from './components/UiBadge.vue';
 export { default as UiToolbar } from './components/UiToolbar.vue';
+export type { ToolbarAction } from './components/UiToolbar.vue';
 export { default as UiToolbarButton } from './components/UiToolbarButton.vue';
 export { default as UiStatGrid } from './components/UiStatGrid.vue';
 export { default as UiStatRow } from './components/UiStatRow.vue';

package/dist/internal/panel.d.ts

@@ -8,12 +8,18 @@ export interface PanelColors {
     text?: string;
     muted?: string;
     border?: string;
+    ok?: string;
+    danger?: string;
+    info?: string;
 }
 /**
  * Resolve a panel variant to a set of local CSS variables (`--_bg`, `--_text`,
  * …) that the header/sidebar/footer styles consume. Variants use the
  * theme-INDEPENDENT `--mw-panel-*` tokens so a dark panel renders correctly on
  * a light page (and vice-versa). Transparent inherits the page text colour.
+ * Light/dark variants also carry status colours (`--_ok`, `--_danger`, `--_info`)
+ * legible on that panel; the components re-scope `--ok`/`--danger`/`--info` to
+ * them for their content. Transparent panels keep the page's status roles.
  * Any supplied `colors` override the defaults — token values are the default.
  */
 export declare function panelVars(variant: PanelVariant, colors?: PanelColors): CSSProperties;

package/dist/tabs.d.ts

@@ -0,0 +1,8 @@
+export interface TabIds {
+    /** id of the `role="tab"` button. */
+    tab: string;
+    /** id of the `role="tabpanel"` region. */
+    panel: string;
+}
+/** Deterministic tab/panel ids for a tab `id` within a tab set identified by `prefix`. */
+export declare function tabIds(prefix: string, id: string): TabIds;