@tensor_1/tokens 2.10.0 → 2.12.0

package/build/css/components.css

@@ -1,1872 +1 @@
-
-@layer uix.tokens, uix.base, uix.util, uix.motion, uix.components;
-/* uix-styleguide — COMPONENT-ONLY aggregate (the .uix-* component classes, util + motion helpers).
-   Deliberately EXCLUDES tokens.css and base.css so a consumer can pull the components without
-   re-injecting the neutral token block (which would fight a product theme) or UIx's global reset
-   (which would fight the consumer's own base layer). Tokens come from @tensor_1/tokens/css (+ a product
-   theme) imported separately. Built to build/css/components.css by scripts/build-styles.mjs and
-   exported as `@tensor_1/tokens/styles`. Keep this list in sync with the component @imports in main.css. */
-/* uix utilities — a few layout/a11y helpers. Keep this small; tokens + components do the heavy lifting. */
-@layer uix.util {
-  /* visually hidden but available to screen readers */
-  .uix-visually-hidden {
-    position: absolute !important;
-    width: 1px; height: 1px;
-    padding: 0; margin: -1px;
-    overflow: hidden; clip: rect(0, 0, 0, 0);
-    white-space: nowrap; border: 0;
-  }
-
-  /* vertical rhythm — set gap via --gap (defaults to --uix-space-4 / 16px) */
-  .uix-stack { display: flex; flex-direction: column; gap: var(--gap, var(--uix-space-4)); }
-  /* horizontal grouping that wraps */
-  .uix-cluster { display: flex; flex-wrap: wrap; align-items: center; gap: var(--gap, var(--uix-space-2)); }
-
-  .uix-truncate { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
-
-  /* elevation — apply the surface shadow tokens as a utility (cards/panels,
-     floating popovers/menus/dialogs, pressed/active pills). In dark mode
-     --uix-shadow-sm resolves to the inset top highlight, so elevated surfaces
-     keep their lift cue without a heavy drop shadow. */
-  .uix-elevated         { box-shadow: var(--uix-shadow-sm); }
-  .uix-elevated-popover { box-shadow: var(--uix-shadow-popover); }
-  .uix-elevated-pill    { box-shadow: var(--uix-shadow-sm); }
-}
-/* uix motion — shared keyframes, enter/exit helpers, and the reduced-motion guard.
-   Components reference these tokens/keyframes; overlays pair the helpers with @starting-style. */
-/* Reduced-motion guard — UNLAYERED so its !important beats every component transition. */
-@media (prefers-reduced-motion: reduce) {
-  *, *::before, *::after {
-    animation-duration: .001ms !important;
-    animation-iteration-count: 1 !important;
-    transition-duration: .001ms !important;
-    scroll-behavior: auto !important;
-  }
-}
-/* Keyframes (cascade-neutral). */
-@keyframes uix-fade-in { from { opacity: 0; } to { opacity: 1; } }
-@keyframes uix-pop-in {
-  from { opacity: 0; transform: scale(.96) translateY(var(--uix-lift)); }
-  to   { opacity: 1; transform: none; }
-}
-@keyframes uix-slide-in-right { from { opacity: 0; transform: translateX(16px); } to { opacity: 1; transform: none; } }
-@keyframes uix-slide-in-up    { from { opacity: 0; transform: translateY(8px); }   to { opacity: 1; transform: none; } }
-@keyframes uix-spin { to { transform: rotate(1turn); } }
-@keyframes uix-shimmer { from { background-position: 200% 0; } to { background-position: -200% 0; } }
-@layer uix.motion {
-  .uix-anim-fade { animation: uix-fade-in var(--uix-dur) var(--uix-ease-out); }
-  .uix-anim-pop  { animation: uix-pop-in var(--uix-dur-fast) var(--uix-ease-out); }
-  .uix-anim-up   { animation: uix-slide-in-up var(--uix-dur) var(--uix-ease-out); }
-
-  /* Hover-lift affordance for interactive cards/tiles. Gated so touch devices don't get a stuck hover. */
-  .uix-lift-hover { transition: transform var(--uix-dur-fast) var(--uix-ease-out), box-shadow var(--uix-dur-fast) var(--uix-ease-out); }
-  @media (hover: hover) and (pointer: fine) {
-    .uix-lift-hover:hover { transform: translateY(calc(-1 * var(--uix-lift))); box-shadow: var(--uix-shadow-popover); }
-  }
-}
-/* components */
-/* uix button — depends only on --uix-* tokens. */
-@layer uix.components {
-  .uix-btn {
-    display: inline-flex; align-items: center; justify-content: center; gap: .5em;
-    height: var(--uix-control-h); padding: 0 var(--uix-space-4); border: 1px solid transparent;
-    border-radius: var(--uix-radius-md); font: inherit; font-size: var(--uix-text-body); font-weight: 500;
-    line-height: 1; cursor: pointer; user-select: none; white-space: nowrap;
-    transition: background-color var(--uix-dur-fast) var(--uix-ease-out),
-                border-color var(--uix-dur-fast) var(--uix-ease-out),
-                color var(--uix-dur-fast) var(--uix-ease-out),
-                transform var(--uix-dur-fast) var(--uix-ease-out);
-  }
-  .uix-btn:active { transform: scale(.97); }
-  .uix-btn:disabled, .uix-btn[aria-disabled="true"] { opacity: .5; pointer-events: none; }
-  .uix-btn:focus-visible { outline: 2px solid var(--uix-ring); outline-offset: 2px; }
-  .uix-btn svg { width: var(--uix-icon-md); height: var(--uix-icon-md); }
-
-  .uix-btn--primary   { background: var(--uix-accent); color: var(--uix-accent-fg); }
-  .uix-btn--primary:hover   { background: var(--uix-accent-hover); }
-  .uix-btn--secondary { background: var(--uix-bg-subtle); color: var(--uix-text); border-color: var(--uix-border); }
-  .uix-btn--secondary:hover { background: var(--uix-bg-hover); }
-  .uix-btn--outline   { background: transparent; color: var(--uix-text); border-color: var(--uix-border-strong); }
-  .uix-btn--outline:hover   { background: var(--uix-bg-hover); }
-  .uix-btn--ghost     { background: transparent; color: var(--uix-text); }
-  .uix-btn--ghost:hover     { background: var(--uix-bg-hover); }
-  .uix-btn--danger    { background: var(--uix-danger); color: var(--uix-danger-fg); }
-  .uix-btn--danger:hover    { background: color-mix(in srgb, var(--uix-danger) 88%, black); }
-  .uix-btn--link      { background: transparent; color: var(--uix-link); height: auto; padding: 0; }
-  .uix-btn--link:hover      { text-decoration: underline; }
-
-  .uix-btn--sm { height: 28px; padding: 0 var(--uix-space-3); font-size: var(--uix-text-meta); }
-  .uix-btn--lg { height: 44px; padding: 0 var(--uix-space-5); }
-  .uix-btn--icon { width: var(--uix-control-h); padding: 0; }
-  .uix-btn--icon.uix-btn--sm { width: 28px; }
-  .uix-btn--icon.uix-btn--lg { width: 44px; }
-
-  .uix-btn[data-loading] { color: transparent !important; position: relative; pointer-events: none; }
-  .uix-btn[data-loading]::after {
-    content: ""; position: absolute; width: 1em; height: 1em;
-    border: 2px solid currentColor; border-right-color: transparent; border-radius: 50%;
-    color: var(--uix-accent-fg); animation: uix-spin .6s linear infinite;
-  }
-
-  /* attached group */
-  .uix-btn-group { display: inline-flex; }
-  .uix-btn-group .uix-btn { border-radius: 0; border-right-width: 0; }
-  .uix-btn-group .uix-btn:first-child { border-top-left-radius: var(--uix-radius-md); border-bottom-left-radius: var(--uix-radius-md); }
-  .uix-btn-group .uix-btn:last-child { border-radius: 0 var(--uix-radius-md) var(--uix-radius-md) 0; border-right-width: 1px; }
-}
-/* uix input + field wrapper — depends only on --uix-* tokens. */
-@layer uix.components {
-  .uix-field { display: flex; flex-direction: column; gap: var(--uix-space-2); }
-  .uix-field__label { font-size: var(--uix-text-meta); font-weight: 500; color: var(--uix-text); }
-  .uix-field__label[data-required]::after { content: " *"; color: var(--uix-danger-text); }
-  /* message slot for hint / error / success — reserves one line so an appearing error never
-     shifts the layout (UIX-FIX-04); the React <Field> always renders it. */
-  .uix-field__msg { font-size: var(--uix-text-meta); line-height: 1.45; min-height: 1.45em; }
-  .uix-field__hint { font-size: var(--uix-text-meta); color: var(--uix-text-muted); }
-  .uix-field__error { font-size: var(--uix-text-meta); color: var(--uix-danger-text); display: inline-flex; align-items: center; gap: var(--uix-space-2); }
-  .uix-field__error svg, .uix-field__success svg { width: 14px; height: 14px; flex: none; }
-  .uix-field__success { font-size: var(--uix-text-meta); color: var(--uix-success); display: inline-flex; align-items: center; gap: var(--uix-space-2); }
-
-  .uix-input {
-    height: var(--uix-control-h); width: 100%;
-    padding: 0 var(--uix-space-3); border: 1px solid var(--uix-border); border-radius: var(--uix-radius-md);
-    background: var(--uix-surface); color: var(--uix-text); font: inherit; font-size: var(--uix-text-body);
-    transition: border-color var(--uix-dur-fast) var(--uix-ease-out), box-shadow var(--uix-dur-fast) var(--uix-ease-out);
-  }
-  .uix-input::placeholder { color: var(--uix-text-muted); }
-  .uix-input:hover { border-color: var(--uix-border-strong); }
-  .uix-input:focus { outline: none; border-color: var(--uix-ring); box-shadow: 0 0 0 3px var(--uix-brand-muted); }
-  .uix-input:disabled { opacity: .55; cursor: not-allowed; background: var(--uix-bg-subtle); }
-  .uix-input[readonly] { background: var(--uix-bg-subtle); }
-  .uix-input[aria-invalid="true"] { border-color: var(--uix-danger); }
-  .uix-input[aria-invalid="true"]:focus { box-shadow: 0 0 0 3px var(--uix-danger-bg); }
-  .uix-input--sm { height: 28px; font-size: var(--uix-text-meta); }
-
-  /* leading/trailing adornments */
-  .uix-input-group { position: relative; display: flex; align-items: center; }
-  .uix-input-group__icon { position: absolute; left: 10px; color: var(--uix-text-muted); display: inline-flex; pointer-events: none; }
-  .uix-input-group__icon svg { width: var(--uix-icon-md); height: var(--uix-icon-md); }
-  .uix-input-group--has-leading .uix-input { padding-left: 38px; }
-  /* validation microinteractions */
-  .uix-input[data-valid] { border-color: var(--uix-success); }
-  .uix-input[data-valid]:focus { box-shadow: 0 0 0 3px var(--uix-success-bg); }
-  .uix-input-group--has-trailing .uix-input { padding-right: 38px; }
-  .uix-input-group__icon--trailing { left: auto; right: 10px; }
-}
-/* uix textarea — depends only on --uix-* tokens. */
-@layer uix.components {
-  .uix-textarea {
-    width: 100%; min-height: 84px; padding: var(--uix-space-3) var(--uix-space-3); resize: vertical;
-    border: 1px solid var(--uix-border); border-radius: var(--uix-radius-md);
-    background: var(--uix-surface); color: var(--uix-text); font: inherit; font-size: var(--uix-text-body);
-    line-height: var(--uix-leading-body);
-    transition: border-color var(--uix-dur-fast) var(--uix-ease-out), box-shadow var(--uix-dur-fast) var(--uix-ease-out);
-  }
-  .uix-textarea::placeholder { color: var(--uix-text-muted); }
-  .uix-textarea:hover { border-color: var(--uix-border-strong); }
-  .uix-textarea:focus { outline: none; border-color: var(--uix-ring); box-shadow: 0 0 0 3px var(--uix-brand-muted); }
-  .uix-textarea:disabled { opacity: .55; background: var(--uix-bg-subtle); }
-  .uix-textarea[aria-invalid="true"] { border-color: var(--uix-danger); }
-}
-/* uix select (native, styled) — depends only on --uix-* tokens. */
-@layer uix.components {
-  .uix-select {
-    height: var(--uix-control-h); width: 100%; padding: 0 var(--uix-space-8) 0 var(--uix-space-3); appearance: none;
-    border: 1px solid var(--uix-border); border-radius: var(--uix-radius-md);
-    background-color: var(--uix-surface); color: var(--uix-text); font: inherit; font-size: var(--uix-text-body); cursor: pointer;
-    background-repeat: no-repeat; background-position: right 12px center;
-    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23737373' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
-    transition: border-color var(--uix-dur-fast) var(--uix-ease-out), box-shadow var(--uix-dur-fast) var(--uix-ease-out);
-  }
-  .uix-select:hover { border-color: var(--uix-border-strong); }
-  .uix-select:focus { outline: none; border-color: var(--uix-ring); box-shadow: 0 0 0 3px var(--uix-brand-muted); }
-  .uix-select:disabled { opacity: .55; cursor: not-allowed; background-color: var(--uix-bg-subtle); }
-  .uix-select--sm { height: 28px; font-size: var(--uix-text-meta); }
-
-  /* command-palette-style rich select: a trigger that opens a .uix-cmdk popover (search + options) */
-  .uix-select-trigger { display: inline-flex; align-items: center; gap: var(--uix-space-2); height: var(--uix-control-h); padding: 0 var(--uix-space-3); min-width: 220px;
-    border: 1px solid var(--uix-border); border-radius: var(--uix-radius-md); background: var(--uix-surface); color: var(--uix-text);
-    font: inherit; font-size: var(--uix-text-body); cursor: pointer; transition: border-color var(--uix-dur-fast) var(--uix-ease-out); }
-  .uix-select-trigger:hover { border-color: var(--uix-border-strong); }
-  .uix-select-trigger:focus-visible { outline: 2px solid var(--uix-ring); outline-offset: 2px; }
-  .uix-select-trigger__chevron { margin-left: auto; color: var(--uix-text-muted); width: var(--uix-icon-sm); height: var(--uix-icon-sm); }
-}
-/* uix checkbox — depends only on --uix-* tokens. Markup:
-   <label class="uix-checkbox"><input type="checkbox"><span class="uix-checkbox__box">{check svg}</span> Label</label> */
-@layer uix.components {
-  .uix-checkbox { display: inline-flex; align-items: center; gap: var(--uix-space-2); cursor: pointer; font-size: var(--uix-text-body); color: var(--uix-text); }
-  .uix-checkbox > input { position: absolute; opacity: 0; width: 1px; height: 1px; }
-  .uix-checkbox__box {
-    width: 18px; height: 18px; flex: none; display: grid; place-items: center;
-    border: 1px solid var(--uix-border-strong); border-radius: var(--uix-radius-xs); background: var(--uix-surface);
-    transition: background-color var(--uix-dur-fast) var(--uix-ease-out), border-color var(--uix-dur-fast) var(--uix-ease-out);
-  }
-  .uix-checkbox__box svg {
-    width: 13px; height: 13px; color: var(--uix-accent-fg); opacity: 0; transform: scale(.5);
-    transition: opacity var(--uix-dur-fast) var(--uix-ease-out), transform var(--uix-dur-fast) var(--uix-ease-spring);
-  }
-  .uix-checkbox > input:checked + .uix-checkbox__box,
-  .uix-checkbox > input:indeterminate + .uix-checkbox__box { background: var(--uix-accent); border-color: var(--uix-accent); }
-  .uix-checkbox > input:checked + .uix-checkbox__box svg,
-  .uix-checkbox > input:indeterminate + .uix-checkbox__box svg { opacity: 1; transform: none; } /* indeterminate shows its dash icon, not just the filled box (UIX-A11Y-3) */
-  .uix-checkbox > input:focus-visible + .uix-checkbox__box { outline: 2px solid var(--uix-ring); outline-offset: 2px; }
-  .uix-checkbox > input:disabled ~ * { opacity: .5; }
-}
-/* uix radio + radio-group — depends only on --uix-* tokens. */
-@layer uix.components {
-  .uix-radio-group { display: flex; flex-direction: column; gap: var(--uix-space-2); }
-  .uix-radio { display: inline-flex; align-items: center; gap: var(--uix-space-2); cursor: pointer; font-size: var(--uix-text-body); color: var(--uix-text); }
-  .uix-radio > input { position: absolute; opacity: 0; width: 1px; height: 1px; }
-  .uix-radio__dot {
-    width: 18px; height: 18px; flex: none; border-radius: 50%;
-    border: 1px solid var(--uix-border-strong); background: var(--uix-surface);
-    display: grid; place-items: center;
-    transition: border-color var(--uix-dur-fast) var(--uix-ease-out);
-  }
-  .uix-radio__dot::after {
-    content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--uix-accent);
-    opacity: 0; transform: scale(.4); transition: opacity var(--uix-dur-fast) var(--uix-ease-out), transform var(--uix-dur-fast) var(--uix-ease-spring);
-  }
-  .uix-radio > input:checked + .uix-radio__dot { border-color: var(--uix-accent); }
-  .uix-radio > input:checked + .uix-radio__dot::after { opacity: 1; transform: none; }
-  .uix-radio > input:focus-visible + .uix-radio__dot { outline: 2px solid var(--uix-ring); outline-offset: 2px; }
-  .uix-radio > input:disabled ~ * { opacity: .5; }
-}
-/* uix switch — depends only on --uix-* tokens. */
-@layer uix.components {
-  .uix-switch { display: inline-flex; align-items: center; gap: var(--uix-space-2); cursor: pointer; color: var(--uix-text); font-size: var(--uix-text-body); }
-  .uix-switch > input { position: absolute; opacity: 0; width: 1px; height: 1px; }
-  .uix-switch__track {
-    width: 36px; height: 20px; flex: none; border-radius: var(--uix-radius-pill);
-    background: var(--uix-bg-active); position: relative;
-    transition: background-color var(--uix-dur) var(--uix-ease-out);
-  }
-  .uix-switch__track::after {
-    content: ""; position: absolute; top: 2px; left: 2px; width: 16px; height: 16px; border-radius: 50%;
-    background: var(--uix-text-reverse); box-shadow: var(--uix-shadow-sm);
-    transition: transform var(--uix-dur) var(--uix-ease-out);
-  }
-  .uix-switch > input:checked + .uix-switch__track { background: var(--uix-accent); }
-  .uix-switch > input:checked + .uix-switch__track::after { transform: translateX(16px); }
-  .uix-switch > input:focus-visible + .uix-switch__track { outline: 2px solid var(--uix-ring); outline-offset: 2px; }
-  .uix-switch > input:disabled + .uix-switch__track { opacity: .5; }
-}
-/* uix segmented control — depends only on --uix-* tokens. */
-@layer uix.components {
-  .uix-segmented { display: inline-flex; padding: var(--uix-space-1); gap: var(--uix-space-1); background: var(--uix-bg-subtle); border: 1px solid var(--uix-border); border-radius: var(--uix-radius-md); }
-  .uix-segmented__option {
-    border: 0; background: transparent; color: var(--uix-text-hushed); font: inherit; font-size: var(--uix-text-meta); font-weight: 500;
-    padding: var(--uix-space-2) var(--uix-space-3); border-radius: calc(var(--uix-radius-md) - 3px); cursor: pointer;
-    transition: background-color var(--uix-dur-fast) var(--uix-ease-out), color var(--uix-dur-fast) var(--uix-ease-out);
-  }
-  .uix-segmented__option:hover { color: var(--uix-text); }
-  .uix-segmented__option[aria-pressed="true"] { background: var(--uix-surface); color: var(--uix-text); box-shadow: var(--uix-shadow-sm); }
-  .uix-segmented__option:focus-visible { outline: 2px solid var(--uix-ring); outline-offset: 1px; }
-}
-/* uix slider (native range, styled) — depends only on --uix-* tokens. */
-@layer uix.components {
-  .uix-slider { -webkit-appearance: none; appearance: none; width: 220px; height: 20px; background: transparent; cursor: pointer; }
-  .uix-slider::-webkit-slider-runnable-track { height: 6px; border-radius: var(--uix-radius-pill); background: var(--uix-bg-active); }
-  .uix-slider::-moz-range-track { height: 6px; border-radius: var(--uix-radius-pill); background: var(--uix-bg-active); }
-  .uix-slider::-moz-range-progress { height: 6px; border-radius: var(--uix-radius-pill); background: var(--uix-accent); }
-  .uix-slider::-webkit-slider-thumb {
-    -webkit-appearance: none; appearance: none; margin-top: -6px; width: 18px; height: 18px; border-radius: 50%;
-    background: var(--uix-surface); border: 2px solid var(--uix-accent); box-shadow: var(--uix-shadow-sm);
-    transition: transform var(--uix-dur-fast) var(--uix-ease-out);
-  }
-  .uix-slider::-moz-range-thumb { width: 18px; height: 18px; border: 2px solid var(--uix-accent); border-radius: 50%; background: var(--uix-surface); box-shadow: var(--uix-shadow-sm); }
-  .uix-slider:active::-webkit-slider-thumb { transform: scale(1.12); }
-  .uix-slider:focus-visible::-webkit-slider-thumb { outline: 2px solid var(--uix-ring); outline-offset: 2px; }
-  .uix-slider:disabled { opacity: .5; cursor: not-allowed; }
-}
-/* uix number stepper — depends only on --uix-* tokens. */
-@layer uix.components {
-  .uix-stepper { display: inline-flex; align-items: center; height: var(--uix-control-h); overflow: hidden;
-    border: 1px solid var(--uix-border); border-radius: var(--uix-radius-md); background: var(--uix-surface); }
-  .uix-stepper__btn { width: 32px; align-self: stretch; border: 0; background: transparent; color: var(--uix-text); cursor: pointer;
-    display: grid; place-items: center; transition: background-color var(--uix-dur-fast) var(--uix-ease-out); }
-  .uix-stepper__btn:hover { background: var(--uix-bg-hover); }
-  .uix-stepper__btn svg { width: var(--uix-icon-sm); height: var(--uix-icon-sm); }
-  .uix-stepper__input { width: 52px; text-align: center; border: 0; height: 100%; background: transparent; color: var(--uix-text);
-    font: inherit; border-inline: 1px solid var(--uix-border); -moz-appearance: textfield; }
-  .uix-stepper__input::-webkit-outer-spin-button, .uix-stepper__input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
-  .uix-stepper:focus-within { border-color: var(--uix-ring); box-shadow: 0 0 0 3px var(--uix-brand-muted); }
-}
-/* uix file upload / dropzone — depends only on --uix-* tokens. */
-@layer uix.components {
-  .uix-dropzone {
-    display: flex; flex-direction: column; align-items: center; gap: var(--uix-space-2); padding: var(--uix-space-7); text-align: center;
-    border: 1.5px dashed var(--uix-border-strong); border-radius: var(--uix-radius-lg);
-    background: var(--uix-bg-subtle); color: var(--uix-text-muted); cursor: pointer;
-    transition: border-color var(--uix-dur-fast) var(--uix-ease-out), background-color var(--uix-dur-fast) var(--uix-ease-out), color var(--uix-dur-fast) var(--uix-ease-out);
-  }
-  .uix-dropzone:hover, .uix-dropzone[data-dragover] { border-color: var(--uix-accent); background: var(--uix-brand-muted); color: var(--uix-text); }
-  .uix-dropzone svg { width: var(--uix-icon-lg); height: var(--uix-icon-lg); }
-  .uix-filelist { display: flex; flex-direction: column; gap: var(--uix-space-2); margin-top: var(--uix-space-3); }
-  .uix-filelist__item { display: flex; align-items: center; gap: var(--uix-space-3); padding: var(--uix-space-2) var(--uix-space-3); border: 1px solid var(--uix-border); border-radius: var(--uix-radius-md); background: var(--uix-surface); font-size: var(--uix-text-meta); color: var(--uix-text); }
-  .uix-filelist__size { margin-left: auto; color: var(--uix-text-muted); }
-}
-/* uix combobox / listbox surface — depends only on --uix-* tokens. */
-@layer uix.components {
-  .uix-combobox { position: relative; }
-  .uix-listbox {
-    list-style: none; margin: 0; padding: var(--uix-space-1); min-width: 200px;
-    background: var(--uix-surface-2); border: 1px solid var(--uix-border); border-radius: var(--uix-radius-md);
-    box-shadow: var(--uix-shadow-popover);
-  }
-  .uix-listbox__option {
-    padding: var(--uix-space-2) var(--uix-space-3); border-radius: var(--uix-radius-sm); font-size: var(--uix-text-body); color: var(--uix-text);
-    cursor: pointer; display: flex; align-items: center; gap: var(--uix-space-2);
-  }
-  .uix-listbox__option:hover, .uix-listbox__option[aria-selected="true"], .uix-listbox__option[data-active] { background: var(--uix-bg-hover); }
-  .uix-listbox__option[aria-selected="true"] { color: var(--uix-link); }
-  .uix-listbox__empty { padding: var(--uix-space-3); text-align: center; color: var(--uix-text-muted); font-size: var(--uix-text-meta); }
-}
-/* uix tag input / multi-select chips — depends only on --uix-* tokens. */
-@layer uix.components {
-  .uix-taginput {
-    display: flex; flex-wrap: wrap; align-items: center; gap: var(--uix-space-2); min-height: var(--uix-control-h); padding: var(--uix-space-1) var(--uix-space-2);
-    border: 1px solid var(--uix-border); border-radius: var(--uix-radius-md); background: var(--uix-surface);
-  }
-  .uix-taginput:focus-within { border-color: var(--uix-ring); box-shadow: 0 0 0 3px var(--uix-brand-muted); }
-  .uix-taginput__field { flex: 1; min-width: 80px; border: 0; outline: none; background: transparent; color: var(--uix-text); font: inherit; }
-  .uix-tag {
-    display: inline-flex; align-items: center; gap: var(--uix-space-1); padding: var(--uix-space-1) var(--uix-space-1) var(--uix-space-1) var(--uix-space-2); border-radius: var(--uix-radius-sm);
-    background: var(--uix-bg-active); color: var(--uix-text); font-size: var(--uix-text-meta);
-  }
-  .uix-tag__remove { position: relative; display: grid; place-items: center; width: 16px; height: 16px; border: 0; background: transparent; color: var(--uix-text-muted); cursor: pointer; border-radius: var(--uix-radius-xs); }
-  /* Invisible overlay grows the 16px visual to a 24px hit target (UIX-A11Y-3). */
-  .uix-tag__remove::before { content: ""; position: absolute; inset: -4px; }
-  .uix-tag__remove:hover { background: var(--uix-bg-hover); color: var(--uix-text); }
-  .uix-tag__remove svg { width: 12px; height: 12px; }
-}
-/* uix form layout — depends only on --uix-* tokens. */
-@layer uix.components {
-  .uix-form-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: var(--uix-space-5); }
-  .uix-fieldset { border: 1px solid var(--uix-border); border-radius: var(--uix-radius-lg); padding: var(--uix-space-6); }
-  .uix-fieldset > legend { padding: 0 var(--uix-space-2); font-size: var(--uix-text-meta); font-weight: 600; color: var(--uix-text); }
-  /* Labeled RadioGroup renders as a fieldset (UIX-A11Y-3): strip the UA chrome so it
-     looks identical to the plain-div group; the legend spaces itself (fieldset gap
-     doesn't reach a legend). */
-  fieldset.uix-radio-group { border: 0; margin: 0; padding: 0; min-inline-size: auto; }
-  .uix-radio-group__legend { padding: 0; margin: 0 0 var(--uix-space-2); font-size: var(--uix-text-meta); font-weight: 600; color: var(--uix-text); }
-  .uix-form-inline { display: flex; flex-wrap: wrap; align-items: flex-end; gap: var(--uix-space-4); }
-  .uix-validation-summary {
-    border: 1px solid var(--uix-danger); background: var(--uix-danger-bg); color: var(--uix-text);
-    border-radius: var(--uix-radius-md); padding: var(--uix-space-3) var(--uix-space-4); font-size: var(--uix-text-meta);
-  }
-  .uix-validation-summary strong { color: var(--uix-danger-text); }
-  .uix-validation-summary ul { margin: var(--uix-space-2) 0 0; padding-left: var(--uix-space-5); }
-  .uix-validation-summary a { color: var(--uix-danger-text); text-decoration: underline; }
-}
-/* uix app shell — sidebar + topbar + content grid. Depends only on --uix-* tokens. */
-@layer uix.components {
-  .uix-shell {
-    position: relative;
-    display: grid;
-    grid-template-columns: var(--uix-sidebar-w) 1fr;
-    grid-template-rows: var(--uix-topbar-h) 1fr;
-    height: 100%; min-height: 360px;
-    border: 1px solid var(--uix-border); border-radius: var(--uix-radius-lg); overflow: hidden;
-    transition: grid-template-columns var(--uix-dur) var(--uix-ease-out), grid-template-rows var(--uix-dur) var(--uix-ease-out);
-  }
-  .uix-shell__sidebar { grid-row: 1 / 3; background: var(--uix-bg-subtle); border-right: 1px solid var(--uix-border); overflow-y: auto; overflow-x: hidden; visibility: visible; transition: visibility var(--uix-dur) var(--uix-ease-out); }
-  .uix-shell__topbar { grid-column: 2; display: flex; align-items: center; gap: var(--uix-space-3); padding: 0 var(--uix-space-6); background: var(--uix-bg-app); border-bottom: 1px solid var(--uix-border); }
-  .uix-shell__main { grid-column: 2; overflow: auto; padding: var(--uix-space-7); background: var(--uix-bg-app); }
-
-  /* ── nav width tiers ──────────────────────────────────────────────────────────
-     Progressive reveal for wide, many-column tables: full (default) → rail (icon
-     only) → hidden (0). data-collapsed stays a back-compat alias for the rail. */
-  .uix-shell[data-nav="rail"], .uix-shell[data-collapsed] { grid-template-columns: var(--uix-sidebar-w-rail) 1fr; }
-  .uix-shell[data-nav="hidden"] { grid-template-columns: 0 1fr; }
-  /* the 0-width column still renders its links — visibility removes them from the tab
-     order / accessibility tree while keeping the width transition (UIX-A11Y-2) */
-  .uix-shell[data-nav="hidden"] .uix-shell__sidebar { visibility: hidden; }
-
-  /* ── focus / immersive mode ───────────────────────────────────────────────────
-     A table-scoped escape hatch: hide the sidebar AND the topbar so a dense grid
-     uses the whole frame. The app toggles [data-focus] (from a toolbar maximize
-     control) and restores the previous nav state + focus on Esc. */
-  .uix-shell[data-focus] { grid-template-columns: 0 1fr; grid-template-rows: 0 1fr; }
-  .uix-shell[data-focus] .uix-shell__sidebar { visibility: hidden; } /* see [data-nav="hidden"] above (UIX-A11Y-2) */
-  .uix-shell[data-focus] .uix-shell__topbar { display: none; }
-
-  /* a floating host for the "exit focus" affordance (Esc also exits) */
-  .uix-shell__focus-exit { position: absolute; top: var(--uix-space-3); right: var(--uix-space-3); z-index: var(--uix-z-overlay); }
-
-  /* ── skip link ────────────────────────────────────────────────────────────────
-     First tab stop in the shell (UIX-A11Y-2): visually hidden until keyboard focus,
-     then a small pill floating over the shell's top-left corner. */
-  .uix-skiplink {
-    position: absolute; top: var(--uix-space-3); left: var(--uix-space-3); z-index: var(--uix-z-overlay);
-    width: 1px; height: 1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap;
-  }
-  .uix-skiplink:focus-visible {
-    width: auto; height: auto; clip: auto;
-    display: inline-flex; align-items: center;
-    padding: var(--uix-space-2) var(--uix-space-4);
-    background: var(--uix-surface); color: var(--uix-text);
-    border: 1px solid var(--uix-border); border-radius: var(--uix-radius-pill);
-    box-shadow: var(--uix-shadow-popover);
-    outline: 2px solid var(--uix-ring); outline-offset: 2px;
-    font-size: var(--uix-text-meta); font-weight: 500; text-decoration: none;
-  }
-
-  /* ── full-bleed main ──────────────────────────────────────────────────────────
-     Opt-in per surface: a genuinely wide grid drops the content gutter and runs
-     edge to edge, reclaiming 2 x --uix-space-7. Not the default — most pages want
-     the gutter. Pair with a frozen identifier column for horizontal scroll. */
-  .uix-shell__main--bleed { padding: 0; }
-}
-/* uix sidebar nav — items, favorites, collapsible sub-items, collapsed rail. Depends only on --uix-* tokens. */
-@layer uix.components {
-  .uix-sidebar { width: var(--uix-sidebar-w); background: var(--uix-bg-subtle); display: flex; flex-direction: column; gap: var(--uix-space-1); padding: var(--uix-space-2); overflow-x: hidden; overflow-y: auto; }
-  .uix-sidebar__eyebrow {
-    font-size: var(--uix-text-eyebrow); letter-spacing: var(--uix-tracking-eyebrow); text-transform: uppercase;
-    color: var(--uix-text-muted); padding: var(--uix-space-3) var(--uix-space-3) var(--uix-space-1);
-  }
-
-  /* brand header */
-  .uix-sidebar__head { display: flex; align-items: center; justify-content: space-between; gap: var(--uix-space-2); padding: var(--uix-space-1) var(--uix-space-2) var(--uix-space-2); }
-  .uix-sidebar__brand { min-width: 0; font-size: var(--uix-text-h3); font-weight: 700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
-  .uix-sidebar__toggle {
-    display: grid; place-items: center; width: 28px; height: 28px; flex: none;
-    border: 0; background: transparent; color: var(--uix-text-muted); cursor: pointer; border-radius: var(--uix-radius-sm);
-    transition: background-color var(--uix-dur-fast) var(--uix-ease-out), color var(--uix-dur-fast) var(--uix-ease-out);
-  }
-  .uix-sidebar__toggle:hover { background: var(--uix-bg-hover); color: var(--uix-text); }
-  .uix-sidebar__toggle svg { width: 18px; height: 18px; }
-
-  .uix-navitem {
-    display: flex; align-items: center; gap: var(--uix-space-3); height: 36px; padding: 0 var(--uix-space-3);
-    border-radius: var(--uix-radius-sm); color: var(--uix-text-hushed); cursor: pointer; text-decoration: none;
-    border: 0; background: transparent; font: inherit; font-size: var(--uix-text-body); width: 100%; text-align: left;
-    transition: background-color var(--uix-dur-fast) var(--uix-ease-out), color var(--uix-dur-fast) var(--uix-ease-out);
-  }
-  .uix-navitem:hover { background: var(--uix-bg-hover); color: var(--uix-text); text-decoration: none; }
-  /* active uses --uix-link (the brightened-on-dark accent) not raw --uix-accent: the deep accent
-     fails AA as text on the brand-muted tint in dark; link reads legibly in both themes. */
-  .uix-navitem[aria-current="page"] { background: var(--uix-brand-muted); color: var(--uix-link); font-weight: 500; }
-  .uix-navitem__icon { width: var(--uix-icon-md); height: var(--uix-icon-md); flex: none; }
-  .uix-navitem__label { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
-  .uix-navitem__badge { font-size: var(--uix-text-meta); color: var(--uix-text-muted); }
-  /* on the active tint, muted badge dips below AA — hushed composites darker on the tint */
-  .uix-navitem[aria-current="page"] .uix-navitem__badge { color: var(--uix-text-hushed); }
-  .uix-navitem__star { position: relative; display: grid; place-items: center; width: 22px; height: 22px; border: 0; background: transparent; color: var(--uix-text-muted); cursor: pointer; border-radius: var(--uix-radius-xs); opacity: 0; transition: opacity var(--uix-dur-fast) var(--uix-ease-out); }
-  /* invisible halo → 24px effective target with zero visual change (UIX-A11Y-2) */
-  .uix-navitem__star::before { content: ""; position: absolute; inset: -1px; }
-  .uix-navitem__star svg { width: 15px; height: 15px; }
-  /* keyboard reveal mirrors the hover reveal (UIX-A11Y-2) */
-  .uix-navitem:hover .uix-navitem__star,
-  .uix-navitem__star:focus-visible,
-  .uix-navitem:focus-within .uix-navitem__star { opacity: 1; }
-  .uix-navitem__star[data-on] { opacity: 1; color: var(--uix-warning); }
-  .uix-navitem__star[data-on] svg { fill: currentColor; }
-
-  /* collapsible group */
-  .uix-navgroup { }
-  .uix-navgroup__trigger .uix-navgroup__chevron { margin-left: auto; transition: transform var(--uix-dur) var(--uix-ease-out); }
-  .uix-navgroup__trigger[aria-expanded="false"] .uix-navgroup__chevron { transform: rotate(-90deg); }
-  .uix-navgroup__chevron { width: var(--uix-icon-sm); height: var(--uix-icon-sm); }
-  .uix-navgroup__panel { display: grid; grid-template-rows: 1fr; transition: grid-template-rows var(--uix-dur) var(--uix-ease-out); }
-  .uix-navgroup__trigger[aria-expanded="false"] + .uix-navgroup__panel { grid-template-rows: 0fr; }
-  /* visibility keeps the 0fr-collapsed links out of the tab order / accessibility tree
-     (UIX-A11Y-2); the transition delays hiding until the row collapse finishes, and
-     visibility snaps back to visible instantly on expand, so nothing visibly glitches. */
-  .uix-navgroup__panel > div { overflow: hidden; visibility: visible; transition: visibility var(--uix-dur) var(--uix-ease-out); }
-  .uix-navgroup__trigger[aria-expanded="false"] + .uix-navgroup__panel > div { visibility: hidden; }
-  .uix-subitem { padding-left: var(--uix-space-5); }
-  .uix-subitem .uix-navitem__label::before { content: ""; display: inline-block; width: 4px; height: 4px; border-radius: 50%; background: var(--uix-text-muted); margin-right: var(--uix-space-3); vertical-align: middle; }
-
-  /* collapsed rail */
-  .uix-sidebar[data-collapsed], .uix-sidebar[data-nav="rail"] { width: var(--uix-sidebar-w-rail); }
-  .uix-sidebar[data-collapsed] .uix-navitem__badge,
-  .uix-sidebar[data-collapsed] .uix-navitem__star,
-  .uix-sidebar[data-collapsed] .uix-sidebar__eyebrow,
-  .uix-sidebar[data-collapsed] .uix-sidebar__brand,
-  .uix-sidebar[data-collapsed] .uix-navgroup__chevron,
-  .uix-sidebar[data-collapsed] .uix-navgroup__panel { display: none; }
-  /* rail labels stay in the accessibility tree — clip pattern (mirrors .uix-visually-hidden),
-     not display:none, so icon-only nav items keep their names (UIX-A11Y-2). position:absolute
-     removes the label from the flex row, so the centered rail layout is unaffected. */
-  .uix-sidebar[data-collapsed] .uix-navitem__label {
-    position: absolute !important;
-    width: 1px; height: 1px;
-    padding: 0; margin: -1px;
-    overflow: hidden; clip: rect(0, 0, 0, 0);
-    white-space: nowrap; border: 0;
-  }
-  /* center the icon-only rail; head keeps just the toggle, centered */
-  .uix-sidebar[data-collapsed] .uix-navitem { justify-content: center; padding: 0; gap: 0; }
-  .uix-sidebar[data-collapsed] .uix-sidebar__head { justify-content: center; padding-inline: 0; }
-}
-/* uix breadcrumbs — depends only on --uix-* tokens. */
-@layer uix.components {
-  .uix-breadcrumbs { display: flex; align-items: center; gap: var(--uix-space-2); flex-wrap: wrap; font-size: var(--uix-text-meta); color: var(--uix-text-muted); }
-  .uix-breadcrumbs a { color: var(--uix-text-muted); text-decoration: none; }
-  .uix-breadcrumbs a:hover { color: var(--uix-text); text-decoration: underline; }
-  .uix-breadcrumbs__sep { opacity: .55; }
-  .uix-breadcrumbs [aria-current="page"] { color: var(--uix-text); font-weight: 500; }
-}
-/* uix tabs — line / enclosed / pill. Depends only on --uix-* tokens. */
-@layer uix.components {
-  .uix-tabs { display: flex; gap: var(--uix-space-1); }
-  .uix-tab {
-    border: 0; background: transparent; font: inherit; font-size: var(--uix-text-body); font-weight: 500;
-    color: var(--uix-text-hushed); padding: var(--uix-space-3) var(--uix-space-3); cursor: pointer; position: relative;
-    transition: color var(--uix-dur-fast) var(--uix-ease-out), background-color var(--uix-dur-fast) var(--uix-ease-out);
-  }
-  .uix-tab:hover { color: var(--uix-text); }
-  .uix-tab[aria-selected="true"] { color: var(--uix-text); }
-  .uix-tab:focus-visible { outline: 2px solid var(--uix-ring); outline-offset: -2px; border-radius: var(--uix-radius-sm); }
-
-  /* line */
-  .uix-tabs--line { border-bottom: 1px solid var(--uix-border); }
-  .uix-tabs--line .uix-tab::after {
-    content: ""; position: absolute; left: 8px; right: 8px; bottom: -1px; height: 2px;
-    background: var(--uix-accent); border-radius: var(--uix-radius-pill);
-    transform: scaleX(0); transition: transform var(--uix-dur) var(--uix-ease-out);
-  }
-  .uix-tabs--line .uix-tab[aria-selected="true"]::after { transform: scaleX(1); }
-
-  /* enclosed */
-  .uix-tabs--enclosed { gap: 0; border-bottom: 1px solid var(--uix-border); }
-  .uix-tabs--enclosed .uix-tab { border: 1px solid transparent; border-top-left-radius: var(--uix-radius-md); border-top-right-radius: var(--uix-radius-md); margin-bottom: -1px; }
-  .uix-tabs--enclosed .uix-tab[aria-selected="true"] { border-color: var(--uix-border); border-bottom-color: var(--uix-bg-app); background: var(--uix-bg-app); }
-
-  /* pill */
-  .uix-tabs--pill { display: inline-flex; background: var(--uix-bg-subtle); padding: var(--uix-space-1); border-radius: var(--uix-radius-md); }
-  .uix-tabs--pill .uix-tab { padding: var(--uix-space-2) var(--uix-space-4); border-radius: calc(var(--uix-radius-md) - 3px); }
-  .uix-tabs--pill .uix-tab[aria-selected="true"] { background: var(--uix-surface); box-shadow: var(--uix-shadow-sm); }
-}
-/* uix pagination — depends only on --uix-* tokens. */
-@layer uix.components {
-  .uix-pagination { display: inline-flex; align-items: center; gap: var(--uix-space-1); }
-  .uix-pagination__btn {
-    min-width: 32px; height: 32px; padding: 0 var(--uix-space-2); display: inline-flex; align-items: center; justify-content: center;
-    border: 1px solid var(--uix-border); border-radius: var(--uix-radius-sm); background: var(--uix-surface);
-    color: var(--uix-text); font: inherit; font-size: var(--uix-text-meta); line-height: 1; cursor: pointer;
-    transition: background-color var(--uix-dur-fast) var(--uix-ease-out), border-color var(--uix-dur-fast) var(--uix-ease-out);
-  }
-  .uix-pagination__btn:hover { background: var(--uix-bg-hover); }
-  .uix-pagination__btn[aria-current="page"] { background: var(--uix-accent); border-color: var(--uix-accent); color: var(--uix-accent-fg); }
-  .uix-pagination__btn:disabled { opacity: .45; pointer-events: none; }
-  .uix-pagination__ellipsis { padding: 0 var(--uix-space-1); color: var(--uix-text-muted); }
-}
-/* uix steps / wizard — depends only on --uix-* tokens. */
-@layer uix.components {
-  .uix-steps { display: flex; align-items: center; gap: 0; }
-  .uix-step { display: flex; align-items: center; gap: var(--uix-space-3); color: var(--uix-text-muted); }
-  .uix-step__marker {
-    width: 26px; height: 26px; flex: none; border-radius: 50%; display: grid; place-items: center;
-    border: 1px solid var(--uix-border-strong); background: var(--uix-surface); font-size: var(--uix-text-meta); font-weight: 600;
-    line-height: 1;  /* hug the glyph so place-items:center truly centers single digits/symbols */
-  }
-  .uix-step__label { font-size: var(--uix-text-meta); font-weight: 500; }
-  .uix-step__connector { flex: 1; height: 1px; min-width: 28px; background: var(--uix-border); margin: 0 var(--uix-space-3); }
-  .uix-step[data-state="active"] { color: var(--uix-text); }
-  .uix-step[data-state="active"] .uix-step__marker { border-color: var(--uix-accent); color: var(--uix-accent); box-shadow: 0 0 0 3px var(--uix-brand-muted); }
-  .uix-step[data-state="done"] { color: var(--uix-text); }
-  .uix-step[data-state="done"] .uix-step__marker { background: var(--uix-accent); border-color: var(--uix-accent); color: var(--uix-accent-fg); }
-  .uix-step[data-state="done"] + .uix-step__connector,
-  .uix-step__connector[data-done] { background: var(--uix-accent); }
-}
-/* uix command palette (⌘K) — inner surface; mounts in a dialog/popover (overlay mechanics in motion + overlays). */
-@layer uix.components {
-  .uix-cmdk { width: min(560px, 92vw); border: 1px solid var(--uix-border); border-radius: var(--uix-radius-lg); background: var(--uix-surface-2); box-shadow: var(--uix-shadow-overlay); overflow: hidden; }
-  .uix-cmdk__input { width: 100%; height: 48px; border: 0; border-bottom: 1px solid var(--uix-border); background: transparent; color: var(--uix-text); font: inherit; font-size: var(--uix-text-h3); padding: 0 var(--uix-space-4); }
-  .uix-cmdk__input:focus { outline: none; }
-  /* visible focus replacement for the suppressed outline (UIX-A11Y-1): the divider under the
-     input thickens to a 2px ring-colored line */
-  .uix-cmdk__input:focus-visible { border-bottom-color: var(--uix-ring); box-shadow: 0 1px 0 0 var(--uix-ring); }
-  .uix-cmdk__list { max-height: 320px; overflow-y: auto; padding: var(--uix-space-2); }
-  .uix-cmdk__group { font-size: var(--uix-text-eyebrow); letter-spacing: var(--uix-tracking-eyebrow); text-transform: uppercase; color: var(--uix-text-muted); padding: var(--uix-space-2) var(--uix-space-3) var(--uix-space-1); }
-  .uix-cmdk__item { display: flex; align-items: center; gap: var(--uix-space-3); padding: var(--uix-space-3) var(--uix-space-3); border-radius: var(--uix-radius-sm); color: var(--uix-text); cursor: pointer; font-size: var(--uix-text-body); }
-  .uix-cmdk__item svg { width: var(--uix-icon-md); height: var(--uix-icon-md); color: var(--uix-text-muted); }
-  .uix-cmdk__item:hover, .uix-cmdk__item[data-active] { background: var(--uix-bg-hover); }
-  .uix-cmdk__item .uix-kbd { margin-left: auto; }
-  /* ⌘K is keyboard-triggered and high-frequency → open instantly, no animation (Emil's rule) */
-  dialog[data-uix-cmdk-dialog], dialog[data-uix-cmdk-dialog]::backdrop { transition: none; }
-}
-/* uix menu / dropdown / context menu — popover-anchored surface. Depends only on --uix-* tokens. */
-@layer uix.components {
-  .uix-menu { min-width: 200px; margin: 0; padding: var(--uix-space-1); list-style: none; background: var(--uix-surface-2); border: 1px solid var(--uix-border); border-radius: var(--uix-radius-md); box-shadow: var(--uix-shadow-popover); }
-  .uix-menu__item {
-    display: flex; align-items: center; gap: var(--uix-space-3); width: 100%; text-align: left; padding: var(--uix-space-2) var(--uix-space-3);
-    border: 0; background: transparent; border-radius: var(--uix-radius-sm); color: var(--uix-text); font: inherit; font-size: var(--uix-text-body); cursor: pointer;
-  }
-  .uix-menu__item svg { width: var(--uix-icon-md); height: var(--uix-icon-md); color: var(--uix-text-muted); }
-  .uix-menu__item:hover, .uix-menu__item[data-active] { background: var(--uix-bg-hover); }
-  .uix-menu__item--danger { color: var(--uix-danger-text); }
-  .uix-menu__item--danger svg { color: var(--uix-danger-text); }
-  .uix-menu__item .uix-kbd { margin-left: auto; }
-  .uix-menu__sep { height: 1px; background: var(--uix-border); margin: var(--uix-space-1) 0; }
-  .uix-menu__label { font-size: var(--uix-text-eyebrow); letter-spacing: var(--uix-tracking-eyebrow); text-transform: uppercase; color: var(--uix-text-muted); padding: var(--uix-space-2) var(--uix-space-3) var(--uix-space-1); }
-}
-/* uix page header — title/subtitle/actions row. Depends only on --uix-* tokens. */
-@layer uix.components {
-  .uix-page-header { display: flex; align-items: flex-start; gap: var(--uix-space-5); flex-wrap: wrap; padding-bottom: var(--uix-space-6); margin-bottom: var(--uix-space-7); border-bottom: 1px solid var(--uix-border); }
-  .uix-page-header__titles { flex: 1; min-width: 220px; }
-  .uix-page-header__eyebrow { font-size: var(--uix-text-eyebrow); letter-spacing: var(--uix-tracking-eyebrow); text-transform: uppercase; font-weight: 600; color: var(--uix-text-muted); margin-bottom: var(--uix-space-2); }
-  .uix-page-header__title { font-size: var(--uix-text-h2); font-weight: 600; letter-spacing: var(--uix-tracking-tight); }
-  .uix-page-header__subtitle { color: var(--uix-text-muted); font-size: var(--uix-text-meta); margin-top: var(--uix-space-2); max-width: 70ch; }
-  .uix-page-header__actions { display: flex; gap: var(--uix-space-2); align-items: center; flex-wrap: wrap; }
-}
-/* uix keyboard-shortcut chip — depends only on --uix-* tokens. */
-@layer uix.components {
-  .uix-kbd {
-    display: inline-flex; align-items: center; justify-content: center; min-width: 18px; height: 18px; padding: 0 var(--uix-space-2);
-    font-family: var(--uix-font-mono); font-size: var(--uix-text-eyebrow); color: var(--uix-text-muted);
-    background: var(--uix-bg-subtle); border: 1px solid var(--uix-border); border-bottom-width: 2px; border-radius: var(--uix-radius-xs);
-  }
-}
-/* uix card — depends only on --uix-* tokens. */
-@layer uix.components {
-  .uix-card { background: var(--uix-surface); border: 1px solid var(--uix-border); border-radius: var(--uix-radius-lg); box-shadow: var(--uix-shadow-sm); }
-  .uix-card__header { padding: var(--uix-space-5) var(--uix-space-6); border-bottom: 1px solid var(--uix-border); display: flex; align-items: center; gap: var(--uix-space-3); }
-  .uix-card__title { font-size: var(--uix-text-h3); font-weight: 600; }
-  .uix-card__subtitle { font-size: var(--uix-text-meta); color: var(--uix-text-muted); margin-top: var(--uix-space-1); }
-  .uix-card__body { padding: var(--uix-space-6); }
-  .uix-card__footer { padding: var(--uix-space-4) var(--uix-space-6); border-top: 1px solid var(--uix-border); display: flex; gap: var(--uix-space-2); justify-content: flex-end; }
-}
-/* uix KPI / stat tile — depends only on --uix-* tokens. */
-@layer uix.components {
-  .uix-stat { background: var(--uix-surface); border: 1px solid var(--uix-border); border-radius: var(--uix-radius-lg); padding: var(--uix-space-6); }
-  .uix-stat__label { font-size: var(--uix-text-eyebrow); letter-spacing: var(--uix-tracking-eyebrow); text-transform: uppercase; color: var(--uix-text-muted); display: flex; align-items: center; justify-content: space-between; gap: var(--uix-space-2); }
-  .uix-stat__label svg { width: var(--uix-icon-md); height: var(--uix-icon-md); }
-  .uix-stat__value { font-size: var(--uix-text-data-hero); font-weight: 600; line-height: var(--uix-leading-data-hero); margin-top: var(--uix-space-3); }
-  .uix-stat__meta { font-size: var(--uix-text-meta); color: var(--uix-text-muted); margin-top: var(--uix-space-2); display: flex; align-items: center; gap: var(--uix-space-2); }
-  .uix-stat__trend { display: inline-flex; align-items: center; gap: var(--uix-space-1); font-size: var(--uix-text-meta); font-weight: 600; padding: var(--uix-space-1) var(--uix-space-2); border-radius: var(--uix-radius-pill); }
-  /* direction glyph inside the chip (UIX-A11Y-4) — sized to sit on the text baseline row */
-  .uix-stat__trend svg { width: 10px; height: 10px; flex: none; }
-  .uix-stat__trend--up { color: var(--uix-success); background: var(--uix-success-bg); }
-  .uix-stat__trend--down { color: var(--uix-danger-text); background: var(--uix-danger-bg); }
-}
-/* uix status pill — tone API (status / priority / SLA). Depends only on --uix-* tokens. */
-@layer uix.components {
-  .uix-pill {
-    display: inline-flex; align-items: center; gap: var(--uix-space-2); padding: var(--uix-space-1) var(--uix-space-3); border-radius: var(--uix-radius-pill);
-    font-size: var(--uix-text-meta); font-weight: 500; line-height: 1.4;
-    background: var(--tone-bg, var(--uix-bg-active)); color: var(--tone-fg, var(--uix-text-hushed));
-  }
-  .uix-pill__dot { width: 7px; height: 7px; border-radius: 50%; background: var(--tone-dot, currentColor); flex: none; }
-  .uix-pill--neutral { --tone-bg: var(--uix-bg-active); --tone-fg: var(--uix-text-hushed); --tone-dot: var(--uix-text-muted); }
-  .uix-pill--success { --tone-bg: var(--uix-success-bg); --tone-fg: var(--uix-success); --tone-dot: var(--uix-success); }
-  .uix-pill--info    { --tone-bg: var(--uix-info-bg);    --tone-fg: var(--uix-info-text);    --tone-dot: var(--uix-info); }
-  .uix-pill--warning { --tone-bg: var(--uix-warning-bg); --tone-fg: var(--uix-warning-text); --tone-dot: var(--uix-warning); }
-  .uix-pill--danger  { --tone-bg: var(--uix-danger-bg);  --tone-fg: var(--uix-danger-text);  --tone-dot: var(--uix-danger); }
-  /* critical = the one SOLID fill (most urgent); muted = a quiet, chrome-less label */
-  .uix-pill--critical { --tone-bg: var(--uix-danger); --tone-fg: var(--uix-danger-fg); --tone-dot: var(--uix-danger-fg); }
-  .uix-pill--muted    { --tone-bg: transparent;       --tone-fg: var(--uix-text-muted); --tone-dot: var(--uix-text-muted); }
-  /* time-pressure tones (U1 tokens — distinct from severity and validation-error) */
-  .uix-pill--attention { --tone-bg: var(--uix-attention-bg); --tone-fg: var(--uix-attention-text); --tone-dot: var(--uix-attention); }
-  .uix-pill--overdue   { --tone-bg: var(--uix-overdue-bg);   --tone-fg: var(--uix-overdue-text);   --tone-dot: var(--uix-overdue); }
-  /* SLA tones — ok=success, at-risk=attention, breached=overdue */
-  .uix-pill--sla-ok       { --tone-bg: var(--uix-success-bg);   --tone-fg: var(--uix-success);        --tone-dot: var(--uix-success); }
-  .uix-pill--sla-at-risk  { --tone-bg: var(--uix-attention-bg); --tone-fg: var(--uix-attention-text); --tone-dot: var(--uix-attention); }
-  .uix-pill--sla-breached { --tone-bg: var(--uix-overdue-bg);   --tone-fg: var(--uix-overdue-text);   --tone-dot: var(--uix-overdue); }
-  /* Priority/severity tones — P1=danger, P2=warning, P3=amber, P4=info, P5=neutral (complete 5-tier ramp) */
-  .uix-pill--p1 { --tone-bg: var(--uix-danger-bg);  --tone-fg: var(--uix-danger-text);  --tone-dot: var(--uix-danger); }
-  .uix-pill--p2 { --tone-bg: var(--uix-warning-bg); --tone-fg: var(--uix-warning-text); --tone-dot: var(--uix-warning); }
-  .uix-pill--p3 { --tone-bg: var(--uix-amber-bg);   --tone-fg: var(--uix-amber-text);   --tone-dot: var(--uix-amber); }
-  .uix-pill--p4 { --tone-bg: var(--uix-info-bg);    --tone-fg: var(--uix-info-text);    --tone-dot: var(--uix-info); }
-  .uix-pill--p5 { --tone-bg: var(--uix-bg-active);  --tone-fg: var(--uix-text-hushed);  --tone-dot: var(--uix-text-muted); }
-
-  /* outline treatment — transparent fill, tone-tinted border, tone-colored text. The border tints
-     the tone hue (--tone-fg) at 40%; neutral/muted use the structural borders, critical reads strongest. */
-  .uix-pill--outline { background: transparent; border: 1px solid var(--tone-line, color-mix(in srgb, var(--tone-fg) 40%, transparent)); }
-  .uix-pill--outline.uix-pill--neutral  { --tone-line: var(--uix-border-strong); }
-  .uix-pill--outline.uix-pill--muted    { --tone-line: var(--uix-border); }
-  .uix-pill--outline.uix-pill--critical { color: var(--uix-danger-text); --tone-dot: var(--uix-danger); --tone-line: color-mix(in srgb, var(--uix-danger) 60%, transparent); }
-}
-/* uix data table — zebra, sticky header, sort, selection, density, pinned rows,
-   column sizing, bulk actions, row actions, expandable rows, inline edit, resize,
-   search highlight, responsive ladder + compare. Depends only on --uix-* tokens. */
-@layer uix.components {
-  .uix-table-wrap { overflow: auto; max-height: 460px; border: 1px solid var(--uix-border); border-radius: var(--uix-radius-lg); background: var(--uix-surface); }
-  .uix-table { width: 100%; border-collapse: separate; border-spacing: 0; font-size: var(--uix-text-body); }
-
-  .uix-table thead th {
-    position: sticky; top: 0; z-index: var(--uix-z-raised); background: var(--uix-surface); text-align: left;
-    font-size: var(--uix-text-meta); font-weight: 600; color: var(--uix-text-hushed);
-    padding: 0 var(--uix-space-4); height: 44px; border-bottom: 1px solid var(--uix-border); white-space: nowrap;
-  }
-  .uix-table th[data-sort] { cursor: pointer; user-select: none; }
-  .uix-table th[data-sort]:hover { color: var(--uix-text); }
-  .uix-table th[data-sort]::after { content: " ↕"; opacity: .35; }
-  .uix-table th[aria-sort="ascending"]::after { content: " ↑"; opacity: 1; color: var(--uix-accent); }
-  .uix-table th[aria-sort="descending"]::after { content: " ↓"; opacity: 1; color: var(--uix-accent); }
-  /* multi-column sort ordinal (⇧+click adds a secondary key) */
-  .uix-table th[data-sort-order]::before { content: attr(data-sort-order); display: inline-block; margin-right: var(--uix-space-1); font-size: var(--uix-text-eyebrow); font-variant-numeric: tabular-nums; color: var(--uix-accent); }
-
-  /* sortable header's real <button> (UIX-A11Y-2): visually indistinguishable from the old
-     plain-text th — inherited font/colour, no chrome — with an inset overlay so the whole
-     cell stays the click target (the sticky th is its containing block). The sort arrow and
-     ordinal stay as th pseudo-content so they never pollute the button's accessible name. */
-  .uix-th__sortbtn { font: inherit; color: inherit; background: none; border: 0; padding: 0; text-align: inherit; cursor: pointer; }
-  .uix-th__sortbtn::before { content: ""; position: absolute; inset: 0; }
-
-  .uix-table td { padding: 0 var(--uix-space-4); height: var(--uix-row-h); border-bottom: 1px solid var(--uix-border); color: var(--uix-text); vertical-align: middle; }
-  .uix-table tbody tr { background: var(--uix-row); }
-  .uix-table tbody tr:nth-child(even) { background: var(--uix-row-alt); }
-  .uix-table--no-zebra tbody tr, .uix-table--no-zebra tbody tr:nth-child(even) { background: var(--uix-row); }
-  .uix-table tbody tr[data-pinned] { background: var(--uix-row-pinned-bg); }
-  /* [data-selected] carries row-selection styling; aria-selected is invalid on a native
-     table row — AT state comes from the row checkbox (UIX-A11Y-2). */
-  .uix-table tbody tr[data-selected] { background: var(--uix-row-selected-bg); }
-  .uix-table tbody tr:hover { background: var(--uix-bg-hover); }
-  .uix-table[data-density="compact"] td, .uix-table--compact td { height: var(--uix-row-h-compact); }
-  .uix-table[data-density="comfortable"] td { height: var(--uix-row-h-comfortable); }
-
-  .uix-table__pin { border: 0; background: transparent; color: var(--uix-text-muted); cursor: pointer; padding: var(--uix-space-1); border-radius: var(--uix-radius-xs); opacity: 0; transition: opacity var(--uix-dur-fast) var(--uix-ease-out); }
-  /* :focus-visible reveal mirrors .uix-rowact so keyboard users can find the pin (UIX-A11Y-2) */
-  .uix-table tbody tr:hover .uix-table__pin, .uix-table__pin:focus-visible, .uix-table__pin[data-on] { opacity: 1; }
-  .uix-table__pin:hover { background: var(--uix-bg-active); color: var(--uix-text); }
-  .uix-table__pin[data-on] { color: var(--uix-accent); }
-  .uix-table__pin svg { width: 15px; height: 15px; }
-  .uix-table__pin[data-on] svg { fill: currentColor; }
-
-  /* frozen first column (opt-in via .uix-table--pinned-col) */
-  .uix-table--pinned-col th:first-child, .uix-table--pinned-col td:first-child { position: sticky; left: 0; z-index: var(--uix-z-raised); box-shadow: 1px 0 0 var(--uix-border); }
-  .uix-table--pinned-col thead th:first-child { z-index: var(--uix-z-sticky); background: var(--uix-surface); }
-  .uix-table--pinned-col tbody tr td:first-child { background: var(--uix-row); }
-  .uix-table--pinned-col tbody tr:nth-child(even) td:first-child { background: var(--uix-row-alt); }
-  .uix-table--pinned-col.uix-table--no-zebra tbody tr td:first-child,
-  .uix-table--pinned-col.uix-table--no-zebra tbody tr:nth-child(even) td:first-child { background: var(--uix-row); }
-  .uix-table--pinned-col tbody tr[data-pinned] td:first-child { background: var(--uix-row-pinned-bg); }
-  .uix-table--pinned-col tbody tr[data-selected] td:first-child { background: var(--uix-row-selected-bg); }
-  .uix-table--pinned-col tbody tr:hover td:first-child { background: var(--uix-bg-hover); }
-
-  /* ── column sizing + cell behaviour (a shared vocabulary, not per-app px) ──────── */
-  .uix-table--fixed { table-layout: fixed; width: 100%; }
-  .uix-col--w-xs { width: var(--uix-col-w-xs); }
-  .uix-col--w-sm { width: var(--uix-col-w-sm); }
-  .uix-col--w-md { width: var(--uix-col-w-md); }
-  .uix-col--w-lg { width: var(--uix-col-w-lg); }
-  .uix-col--w-xl { width: var(--uix-col-w-xl); }
-  .uix-col--flex,
-  .uix-col--primary { width: auto; min-width: var(--uix-col-title-min); }
-  .uix-col--truncate { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
-  .uix-col--wrap { white-space: normal; overflow-wrap: anywhere; }
-  .uix-col--num { font-variant-numeric: tabular-nums; }
-  .uix-table th.uix-col--num, .uix-table td.uix-col--num { text-align: right; }
-
-  /* ── cell content vocabulary — a fixed set of renderers keeps tables consistent ── */
-  .uix-cell-strong { font-weight: 600; }
-  .uix-cell-sub { display: block; font-size: var(--uix-text-meta); color: var(--uix-text-muted); }
-  .uix-cell-mono { font-family: var(--uix-font-mono); font-size: var(--uix-text-meta); }
-
-  /* ── id cell — the canonical row click-through (row → peek, ↗ → full record) ───── */
-  .uix-id-cell__btn {
-    border: 0; background: transparent; cursor: pointer; padding: 0;
-    color: var(--uix-text); font: inherit;
-    display: inline-flex; align-items: center; gap: var(--uix-space-1); white-space: nowrap;
-  }
-  .uix-id-cell__btn:hover { color: var(--uix-accent); }
-  .uix-id-cell__btn:focus-visible { outline: 2px solid var(--uix-ring); outline-offset: 2px; border-radius: var(--uix-radius-xs); }
-  .uix-id-cell__arrow {
-    width: var(--uix-icon-sm); height: var(--uix-icon-sm); flex-shrink: 0; color: var(--uix-text-muted);
-    opacity: 0; transition: opacity var(--uix-dur-fast) var(--uix-ease-out);
-  }
-  .uix-table tbody tr:hover .uix-id-cell__arrow { opacity: 1; }
-
-  /* ── selection column + select-all ────────────────────────────────────────────── */
-  .uix-table th.uix-table__selcol, .uix-table td.uix-table__selcell { width: 44px; padding-left: var(--uix-space-3); padding-right: 0; text-align: center; }
-
-  /* contextual bulk-action bar — appears when >=1 row is selected */
-  .uix-bulkbar {
-    display: flex; align-items: center; gap: var(--uix-space-3);
-    padding: var(--uix-space-2) var(--uix-space-3); margin-bottom: var(--uix-space-3);
-    border: 1px solid var(--uix-accent); border-radius: var(--uix-radius-md);
-    background: var(--uix-brand-muted); color: var(--uix-text);
-    animation: uix-bulkbar-in var(--uix-dur) var(--uix-ease-out);
-  }
-  .uix-bulkbar[hidden] { display: none; }
-  .uix-bulkbar__count { font-size: var(--uix-text-meta); font-weight: 600; color: var(--uix-accent); font-variant-numeric: tabular-nums; }
-  .uix-bulkbar__spacer { flex: 1; }
-  @keyframes uix-bulkbar-in { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } }
-  @media (prefers-reduced-motion: reduce) { .uix-bulkbar { animation: none; } }
-
-  /* ── row hover actions + kebab ─────────────────────────────────────────────────── */
-  .uix-table__actions { width: 84px; text-align: right; white-space: nowrap; }
-  .uix-rowact { border: 0; background: transparent; color: var(--uix-text-muted); cursor: pointer; padding: var(--uix-space-1); border-radius: var(--uix-radius-sm); opacity: 0; transition: opacity var(--uix-dur-fast) var(--uix-ease-out), background-color var(--uix-dur-fast) var(--uix-ease-out); }
-  .uix-rowact svg { width: 16px; height: 16px; display: block; }
-  .uix-table tbody tr:hover .uix-rowact, .uix-rowact:focus-visible, .uix-rowact[aria-expanded="true"] { opacity: 1; }
-  .uix-rowact:hover { background: var(--uix-bg-active); color: var(--uix-text); }
-
-  /* ── expandable inline row ─────────────────────────────────────────────────────── */
-  .uix-table__expand { border: 0; background: transparent; cursor: pointer; color: var(--uix-text-muted); padding: var(--uix-space-1); border-radius: var(--uix-radius-xs); display: inline-grid; place-items: center; }
-  .uix-table__expand svg { width: 16px; height: 16px; transition: transform var(--uix-dur-fast) var(--uix-ease-out); }
-  .uix-table__expand[aria-expanded="true"] svg { transform: rotate(90deg); }
-  .uix-table__expand:hover { background: var(--uix-bg-active); color: var(--uix-text); }
-  tr.uix-table__detail > td { background: var(--uix-bg-subtle); padding: 0 var(--uix-space-4); }
-  .uix-table__detail-inner { padding: var(--uix-space-4) var(--uix-space-1) var(--uix-space-5); display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: var(--uix-space-4) var(--uix-space-7); }
-  .uix-kv { font-size: var(--uix-text-meta); }
-  .uix-kv__k { color: var(--uix-text-muted); margin-bottom: var(--uix-space-1); }
-  .uix-kv__v { color: var(--uix-text); }
-  @media (prefers-reduced-motion: reduce) { .uix-table__expand svg { transition: none; } }
-
-  /* ── inline cell edit ──────────────────────────────────────────────────────────── */
-  .uix-cell-edit { display: inline-flex; align-items: center; gap: var(--uix-space-2); cursor: text; border-radius: var(--uix-radius-sm); padding: var(--uix-space-1) var(--uix-space-2); margin: calc(-1 * var(--uix-space-1)) calc(-1 * var(--uix-space-2)); transition: background-color var(--uix-dur-fast) var(--uix-ease-out), box-shadow var(--uix-dur-fast) var(--uix-ease-out); }
-  .uix-cell-edit:hover { background: var(--uix-bg-active); }
-  .uix-cell-edit__pencil { width: 13px; height: 13px; color: var(--uix-text-muted); opacity: 0; transition: opacity var(--uix-dur-fast) var(--uix-ease-out); }
-  .uix-table tbody tr:hover .uix-cell-edit__pencil { opacity: 1; }
-  .uix-cell-edit[data-editing] { background: var(--uix-surface); box-shadow: 0 0 0 2px var(--uix-ring); cursor: default; }
-  .uix-cell-edit__ok { color: var(--uix-success); width: 14px; height: 14px; opacity: 0; transition: opacity var(--uix-dur-fast) var(--uix-ease-out); }
-  .uix-cell-edit[data-saved] .uix-cell-edit__ok { opacity: 1; }
-  .uix-cell-edit input, .uix-cell-edit select { border: 0; background: transparent; font: inherit; color: inherit; outline: none; }
-
-  /* ── column resize grip (drag the header's right edge) ─────────────────────────── */
-  .uix-table__resize { position: absolute; top: 0; right: -3px; width: 8px; height: 100%; cursor: col-resize; z-index: var(--uix-z-raised); user-select: none; touch-action: none; }
-  .uix-table__resize::after { content: ""; position: absolute; top: 25%; right: 3px; width: 2px; height: 50%; background: transparent; border-radius: var(--uix-radius-pill); transition: background-color var(--uix-dur-fast) var(--uix-ease-out); }
-  .uix-table thead th:hover .uix-table__resize::after, .uix-table__resize[data-drag]::after { background: var(--uix-accent); }
-
-  /* ── search match highlight ────────────────────────────────────────────────────── */
-  .uix-mark { background: var(--uix-warning-bg); color: var(--uix-text); border-radius: var(--uix-radius-xs); padding: 0 0.15em; box-shadow: inset 0 -1px 0 color-mix(in srgb, var(--uix-warning) 60%, transparent); }
-
-  /* ── responsive ladder — priority-column drop, then card transform ─────────────── */
-  .uix-table--priority th[data-priority="low"], .uix-table--priority td[data-priority="low"] { display: none; }
-  .uix-table--priority-mid th[data-priority="low"], .uix-table--priority-mid td[data-priority="low"],
-  .uix-table--priority-mid th[data-priority="mid"], .uix-table--priority-mid td[data-priority="mid"] { display: none; }
-
-  .uix-table--cards { display: block; }
-  .uix-table--cards thead { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
-  .uix-table--cards tbody, .uix-table--cards tr, .uix-table--cards td { display: block; width: auto; }
-  .uix-table--cards tbody tr { border: 1px solid var(--uix-border); border-radius: var(--uix-radius-md); background: var(--uix-surface); margin: 0 0 var(--uix-space-3); padding: var(--uix-space-1) var(--uix-space-4); box-shadow: var(--uix-shadow-sm); }
-  .uix-table--cards tbody tr[data-selected] { box-shadow: 0 0 0 2px var(--uix-accent); }
-  .uix-table--cards td { height: auto; display: flex; justify-content: space-between; align-items: center; gap: var(--uix-space-5); padding: var(--uix-space-2) 0; border-bottom: 1px solid var(--uix-border); text-align: right; white-space: normal; }
-  .uix-table--cards td:last-child { border-bottom: 0; }
-  .uix-table--cards td::before { content: attr(data-label); color: var(--uix-text-muted); font-size: var(--uix-text-meta); font-weight: 500; text-align: left; flex: none; }
-  .uix-table--cards td[data-col="id"] { font-size: var(--uix-text-h3); font-weight: 600; border-bottom: 1px solid var(--uix-border); padding-bottom: var(--uix-space-3); }
-  .uix-table--cards td[data-col="id"]::before { display: none; }
-  .uix-table--cards td[data-col="select"], .uix-table--cards td[data-col="actions"], .uix-table--cards td[data-col="expand"] { display: none; }
-
-  /* ── compare view — two records field-by-field on a narrow screen ──────────────── */
-  .uix-compare { border: 1px solid var(--uix-border); border-radius: var(--uix-radius-lg); overflow: hidden; font-size: var(--uix-text-meta); }
-  .uix-compare__head, .uix-compare__row { display: grid; grid-template-columns: 1fr 1fr; }
-  .uix-compare__head > div, .uix-compare__cell { padding: var(--uix-space-3); background: var(--uix-surface); border-top: 1px solid var(--uix-border); }
-  .uix-compare__head > div { font-weight: 600; border-top: 0; }
-  .uix-compare__head > div + div, .uix-compare__cell + .uix-compare__cell { border-left: 1px solid var(--uix-border); }
-  .uix-compare__attr { grid-column: 1 / -1; background: var(--uix-bg-subtle); padding: var(--uix-space-1) var(--uix-space-3); border-top: 1px solid var(--uix-border); font-size: var(--uix-text-eyebrow); letter-spacing: var(--uix-tracking-eyebrow); text-transform: uppercase; color: var(--uix-text-muted); }
-}
-/* uix table toolbar + two-row filter bar (status / type). Depends only on --uix-* tokens. */
-@layer uix.components {
-  .uix-toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: var(--uix-space-2); margin-bottom: var(--uix-space-3); }
-  .uix-toolbar__spacer { flex: 1; }
-
-  /* responsive: the status + type groups sit on ONE line when they fit, wrap to two only when cramped */
-  .uix-filterbar { display: flex; flex-wrap: wrap; gap: var(--uix-space-2) var(--uix-space-5); margin-bottom: var(--uix-space-3); }
-  .uix-filterrow { display: flex; flex-wrap: wrap; align-items: center; gap: var(--uix-space-2); }
-  .uix-filterrow__label { font-size: var(--uix-text-meta); color: var(--uix-text-muted); width: 54px; flex: none; }
-
-  .uix-chip {
-    display: inline-flex; align-items: center; gap: var(--uix-space-2); padding: var(--uix-space-1) var(--uix-space-3); border-radius: var(--uix-radius-pill);
-    border: 1px solid var(--uix-border); background: var(--uix-surface); color: var(--uix-text-hushed);
-    font: inherit; font-size: var(--uix-text-meta); cursor: pointer;
-    transition: background-color var(--uix-dur-fast) var(--uix-ease-out), border-color var(--uix-dur-fast) var(--uix-ease-out), color var(--uix-dur-fast) var(--uix-ease-out);
-  }
-  .uix-chip:hover { border-color: var(--uix-border-strong); color: var(--uix-text); }
-  .uix-chip[data-on] { background: var(--uix-brand-muted); border-color: var(--uix-accent); color: var(--uix-accent); }
-  .uix-chip__count { font-variant-numeric: tabular-nums; opacity: .7; }
-}
-/* uix table View menu — consolidates density / zebra / freeze / columns into one popover.
-   Reuses .uix-popover (surface + animation), .uix-segmented, .uix-switch. Depends only on --uix-* tokens. */
-@layer uix.components {
-  .uix-view-menu { min-width: 248px; padding: var(--uix-space-2); }
-  .uix-view-menu__group { padding: var(--uix-space-2) var(--uix-space-2); }
-  .uix-view-menu__group + .uix-view-menu__group { border-top: 1px solid var(--uix-border); }
-  .uix-view-menu__label { font-size: var(--uix-text-eyebrow); letter-spacing: var(--uix-tracking-eyebrow); text-transform: uppercase; color: var(--uix-text-muted); margin-bottom: var(--uix-space-2); }
-  .uix-view-menu__row { display: flex; align-items: center; justify-content: space-between; gap: var(--uix-space-3); font-size: var(--uix-text-body); color: var(--uix-text); cursor: pointer; }
-  .uix-view-menu__row + .uix-view-menu__row { margin-top: var(--uix-space-3); }
-  .uix-view-menu .uix-segmented { display: flex; width: 100%; }
-  .uix-view-menu .uix-segmented__option { flex: 1; text-align: center; }
-  .uix-view-menu__cols { display: flex; flex-direction: column; gap: var(--uix-space-1); max-height: 180px; overflow: auto; }
-  .uix-view-menu__cols .uix-menu__item { font-size: var(--uix-text-meta); }
-}
-/* uix list + list-item — depends only on --uix-* tokens. */
-@layer uix.components {
-  .uix-list { display: flex; flex-direction: column; border: 1px solid var(--uix-border); border-radius: var(--uix-radius-lg); overflow: hidden; background: var(--uix-surface); }
-  .uix-list__item { display: flex; align-items: center; gap: var(--uix-space-3); padding: var(--uix-space-4) var(--uix-space-5); border-bottom: 1px solid var(--uix-border); }
-  .uix-list__item:last-child { border-bottom: 0; }
-  .uix-list__item:hover { background: var(--uix-bg-hover); }
-  .uix-list__title { font-weight: 500; }
-  .uix-list__meta { font-size: var(--uix-text-meta); color: var(--uix-text-muted); }
-  .uix-list__trail { margin-left: auto; display: flex; align-items: center; gap: var(--uix-space-2); }
-}
-/* uix description / key-value list — depends only on --uix-* tokens. */
-@layer uix.components {
-  .uix-dl { display: grid; grid-template-columns: max-content 1fr; gap: var(--uix-space-3) var(--uix-space-6); }
-  .uix-dl dt { color: var(--uix-text-muted); font-size: var(--uix-text-meta); }
-  .uix-dl dd { color: var(--uix-text); font-size: var(--uix-text-body); margin: 0; }
-}
-/* uix avatar / avatar-group / user-chip — depends only on --uix-* tokens. */
-@layer uix.components {
-  .uix-avatar {
-    width: 32px; height: 32px; flex: none; border-radius: 50%; background: var(--uix-bg-active); color: var(--uix-text);
-    display: inline-flex; align-items: center; justify-content: center; font-size: var(--uix-text-meta); font-weight: 600;
-    line-height: 1; overflow: hidden; position: relative;
-  }
-  .uix-avatar img { width: 100%; height: 100%; object-fit: cover; }
-  .uix-avatar--sm { width: 24px; height: 24px; font-size: var(--uix-text-eyebrow); }
-  .uix-avatar--lg { width: 44px; height: 44px; }
-  .uix-avatar__status { position: absolute; right: -1px; bottom: -1px; width: 10px; height: 10px; border-radius: 50%; border: 2px solid var(--uix-surface); background: var(--uix-success); }
-  .uix-avatar-group { display: inline-flex; }
-  .uix-avatar-group .uix-avatar { box-shadow: 0 0 0 2px var(--uix-surface); margin-left: calc(-1 * var(--uix-space-2)); }
-  .uix-avatar-group .uix-avatar:first-child { margin-left: 0; }
-  .uix-user-chip { display: inline-flex; align-items: center; gap: var(--uix-space-2); }
-  .uix-user-chip__name { font-size: var(--uix-text-body); font-weight: 500; }
-  .uix-user-chip__sub { font-size: var(--uix-text-meta); color: var(--uix-text-muted); }
-
-  /* editable avatar — hover/focus overlay for "change photo"; empty = upload placeholder */
-  .uix-avatar--editable { cursor: pointer; }
-  .uix-avatar__edit { position: absolute; inset: 0; display: grid; place-items: center; background: var(--uix-scrim); color: var(--uix-text-reverse); opacity: 0; transition: opacity var(--uix-dur-fast) var(--uix-ease-out); }
-  .uix-avatar__edit svg { width: 45%; height: 45%; }
-  .uix-avatar--editable:hover .uix-avatar__edit, .uix-avatar--editable:focus-visible .uix-avatar__edit { opacity: 1; }
-  .uix-avatar--empty { background: var(--uix-bg-subtle); border: 1.5px dashed var(--uix-border-strong); color: var(--uix-text-muted); }
-}
-/* uix tooltip. Two flavours, both depend only on --uix-* tokens:
-   • .uix-tooltip__bubble — the React <Tooltip>: renders in the top layer via the
-     Popover API, so it escapes any overflow:hidden/scroll ancestor (UIX-FIX-02).
-     JS sets position/left/top; CSS owns appearance + the fade.
-   • [data-uix-tip] — the legacy CSS-only tooltip, kept for back-compat. It is
-     position:absolute and so is clipped by an overflow ancestor; prefer <Tooltip>. */
-@layer uix.components {
-  .uix-tooltip { display: inline-flex; }
-
-  .uix-tooltip__bubble {
-    position: fixed; margin: 0; inset: auto; border: 0;
-    width: max-content; max-width: 16rem;
-    background: var(--uix-text); color: var(--uix-bg-app);
-    font-size: var(--uix-text-meta); font-weight: 500; line-height: 1.4;
-    padding: var(--uix-space-2) var(--uix-space-3); border-radius: var(--uix-radius-sm);
-    /* no pointer-events:none — the bubble must be hoverable (WCAG 1.4.13, UIX-A11Y-1) */
-    box-shadow: var(--uix-shadow-popover); white-space: normal;
-    opacity: 0; transition: opacity var(--uix-dur-fast) var(--uix-ease-out);
-  }
-  .uix-tooltip__bubble:popover-open { opacity: 1; }
-  @starting-style { .uix-tooltip__bubble:popover-open { opacity: 0; } }
-
-  /* legacy CSS-only tooltip — clipped by overflow ancestors; superseded by .uix-tooltip__bubble */
-  [data-uix-tip] { position: relative; }
-  [data-uix-tip]::after {
-    content: attr(data-uix-tip); position: absolute; bottom: calc(100% + 6px); left: 50%;
-    transform: translateX(-50%) translateY(var(--uix-lift));
-    background: var(--uix-text); color: var(--uix-bg-app); font-size: var(--uix-text-meta); font-weight: 500;
-    padding: var(--uix-space-2) var(--uix-space-3); border-radius: var(--uix-radius-sm); white-space: nowrap; box-shadow: var(--uix-shadow-popover);
-    opacity: 0; pointer-events: none; z-index: var(--uix-z-tooltip);
-    transition: opacity var(--uix-dur-fast) var(--uix-ease-out), transform var(--uix-dur-fast) var(--uix-ease-out);
-  }
-  [data-uix-tip]:hover::after, [data-uix-tip]:focus-visible::after { opacity: 1; transform: translateX(-50%) translateY(0); }
-  /* when JS upgrades [data-uix-tip] to a top-layer bubble, drop the clipped CSS-only one */
-  .uix-has-js-tip [data-uix-tip]::after { content: none; }
-}
-/* uix progress bar + ring — depends only on --uix-* tokens. */
-@layer uix.components {
-  .uix-progress { height: 8px; background: var(--uix-bg-active); border-radius: var(--uix-radius-pill); overflow: hidden; }
-  .uix-progress__bar { height: 100%; background: var(--uix-accent); border-radius: inherit; transition: width var(--uix-dur) var(--uix-ease-out); }
-  .uix-progress--indeterminate { position: relative; }
-  .uix-progress--indeterminate .uix-progress__bar { width: 40%; animation: uix-progress-slide 1.2s var(--uix-ease-in-out) infinite; }
-  @keyframes uix-progress-slide { 0% { transform: translateX(-110%); } 100% { transform: translateX(280%); } }
-
-  .uix-ring { width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center;
-    background: conic-gradient(var(--uix-accent) calc(var(--val, .66) * 360deg), var(--uix-bg-active) 0); }
-  .uix-ring__inner { width: 32px; height: 32px; border-radius: 50%; background: var(--uix-surface); display: grid; place-items: center; font-size: var(--uix-text-meta); font-weight: 600; }
-}
-/* uix meter / utilization bar (threshold tones) — depends only on --uix-* tokens. */
-@layer uix.components {
-  .uix-meter { height: 8px; background: var(--uix-bg-active); border-radius: var(--uix-radius-pill); overflow: hidden; }
-  .uix-meter__fill { height: 100%; border-radius: inherit; background: var(--uix-success); transition: width var(--uix-dur) var(--uix-ease-out); }
-  .uix-meter__fill[data-tone="warning"]   { background: var(--uix-warning); }
-  .uix-meter__fill[data-tone="danger"]    { background: var(--uix-danger); }
-  .uix-meter__fill[data-tone="attention"] { background: var(--uix-attention); }
-  .uix-meter__fill[data-tone="overdue"]   { background: var(--uix-overdue); }
-}
-/* uix timeline / activity feed — depends only on --uix-* tokens. */
-@layer uix.components {
-  /* list reset — the React Timeline renders <ol>/<li> for semantics; keep visuals pixel-identical (UIX-A11Y-4) */
-  .uix-timeline { display: flex; flex-direction: column; list-style: none; margin: 0; padding: 0; }
-  .uix-timeline__item { display: grid; grid-template-columns: 24px 1fr; gap: var(--uix-space-3); }
-  .uix-timeline__rail { display: flex; flex-direction: column; align-items: center; }
-  .uix-timeline__node { width: 12px; height: 12px; border-radius: 50%; background: var(--uix-accent); margin-top: var(--uix-space-1); flex: none; box-shadow: 0 0 0 3px var(--uix-brand-muted); }
-  .uix-timeline__line { width: 1px; flex: 1; background: var(--uix-border); margin: var(--uix-space-1) 0; }
-  .uix-timeline__item:last-child .uix-timeline__line { display: none; }
-  .uix-timeline__body { padding-bottom: var(--uix-space-5); }
-  .uix-timeline__meta { font-size: var(--uix-text-meta); color: var(--uix-text-muted); }
-}
-/* uix tree view — WAI-ARIA tree (role=tree/treeitem/group). Depends only on --uix-* tokens.
-   ARIA (aria-expanded / aria-selected / aria-level) lives on the treeitem <li>, so the chevron,
-   selection, and collapse styling all key off the item, not the row (UIX-FIX-04). */
-@layer uix.components {
-  .uix-tree, .uix-tree ul { list-style: none; margin: 0; padding: 0; }
-  .uix-tree__group { padding-left: var(--uix-space-5); }
-  .uix-tree__item { outline: none; } /* the focus ring is drawn on the row, below */
-  .uix-tree__row { display: flex; align-items: center; gap: var(--uix-space-2); padding: var(--uix-space-2) var(--uix-space-2); border-radius: var(--uix-radius-sm); cursor: pointer; color: var(--uix-text); font-size: var(--uix-text-body); }
-  .uix-tree__label { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
-  .uix-tree__item > .uix-tree__row:hover { background: var(--uix-bg-hover); }
-  .uix-tree__item[aria-selected="true"] > .uix-tree__row { background: var(--uix-bg-active); }
-  .uix-tree__item:focus-visible > .uix-tree__row { outline: 2px solid var(--uix-ring); outline-offset: -2px; }
-  .uix-tree__toggle { width: 16px; height: 16px; flex: none; display: grid; place-items: center; color: var(--uix-text-muted); transition: transform var(--uix-dur) var(--uix-ease-out); }
-  .uix-tree__toggle svg { width: 14px; height: 14px; }
-  .uix-tree__item[aria-expanded="false"] > .uix-tree__row .uix-tree__toggle { transform: rotate(-90deg); }
-  .uix-tree__item[aria-expanded="false"] > .uix-tree__group { display: none; }
-}
-/* uix calendar (shared by date pickers) — depends only on --uix-* tokens. */
-@layer uix.components {
-  .uix-calendar { width: 280px; border: 1px solid var(--uix-border); border-radius: var(--uix-radius-lg); background: var(--uix-surface); padding: var(--uix-space-3); }
-  .uix-calendar__head { display: flex; align-items: center; justify-content: space-between; margin-bottom: var(--uix-space-2); font-weight: 600; font-size: var(--uix-text-body); }
-  .uix-calendar__grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: var(--uix-space-1); }
-  .uix-calendar__dow { text-align: center; font-size: var(--uix-text-eyebrow); color: var(--uix-text-muted); padding: var(--uix-space-1) 0; }
-  .uix-calendar__day { aspect-ratio: 1; display: grid; place-items: center; border-radius: var(--uix-radius-sm); font-size: var(--uix-text-meta); color: var(--uix-text); cursor: pointer; border: 0; background: transparent; }
-  .uix-calendar__day:hover { background: var(--uix-bg-hover); }
-  .uix-calendar__day[data-muted] { color: var(--uix-text-muted); opacity: .45; }
-  .uix-calendar__day[data-today] { box-shadow: inset 0 0 0 1px var(--uix-border-strong); }
-  .uix-calendar__day[data-range] { background: var(--uix-brand-muted); border-radius: 0; }
-  .uix-calendar__day[aria-selected="true"] { background: var(--uix-accent); color: var(--uix-accent-fg); }
-}
-/* uix states — empty + skeleton loaders. Depends only on --uix-* tokens. */
-@layer uix.components {
-  .uix-empty { display: flex; flex-direction: column; align-items: center; gap: var(--uix-space-3); text-align: center; padding: var(--uix-space-8); color: var(--uix-text-muted); }
-  .uix-empty__icon { width: 44px; height: 44px; display: grid; place-items: center; border-radius: 50%; background: var(--uix-bg-subtle); color: var(--uix-text-muted); }
-  .uix-empty__icon svg { width: 22px; height: 22px; }
-  .uix-empty__title { font-size: var(--uix-text-h3); font-weight: 600; color: var(--uix-text); }
-  /* error tone — ErrorState reuses .uix-empty with a danger-toned icon */
-  .uix-empty__icon--danger { background: var(--uix-danger-bg); color: var(--uix-danger); }
-
-  .uix-skeleton { background: linear-gradient(90deg, var(--uix-bg-subtle) 25%, var(--uix-bg-hover) 50%, var(--uix-bg-subtle) 75%); background-size: 200% 100%; animation: uix-shimmer 1.4s linear infinite; border-radius: var(--uix-radius-sm); }
-  .uix-skeleton--text { height: 12px; border-radius: var(--uix-radius-pill); }
-  .uix-skeleton--circle { border-radius: 50%; }
-}
-/* uix chart container + legend — palette + framing only; pair sample SVGs / a chart lib using --uix-chart-*. */
-@layer uix.components {
-  .uix-chart { background: var(--uix-surface); border: 1px solid var(--uix-border); border-radius: var(--uix-radius-lg); padding: var(--uix-space-5); }
-  .uix-chart__title { font-size: var(--uix-text-h3); font-weight: 600; }
-  .uix-chart__subtitle { font-size: var(--uix-text-meta); color: var(--uix-text-muted); margin-bottom: var(--uix-space-4); }
-  .uix-legend { display: flex; flex-wrap: wrap; gap: var(--uix-space-3); margin-top: var(--uix-space-3); }
-  .uix-legend__item { display: inline-flex; align-items: center; gap: var(--uix-space-2); font-size: var(--uix-text-meta); color: var(--uix-text-hushed); }
-  .uix-legend__swatch { width: 10px; height: 10px; border-radius: var(--uix-radius-xs); flex: none; }
-}
-/* uix alert / inline banner — tone API. Depends only on --uix-* tokens. */
-@layer uix.components {
-  .uix-alert {
-    display: flex; gap: var(--uix-space-3); padding: var(--uix-space-3) var(--uix-space-4); border-radius: var(--uix-radius-md);
-    border: 1px solid var(--tone-border, var(--uix-border)); background: var(--tone-bg, var(--uix-bg-subtle));
-    color: var(--uix-text); font-size: var(--uix-text-body);
-  }
-  .uix-alert__icon { color: var(--tone-fg, var(--uix-text)); flex: none; }
-  .uix-alert__icon svg { width: var(--uix-icon-md); height: var(--uix-icon-md); }
-  .uix-alert__title { font-weight: 600; margin-bottom: var(--uix-space-1); }
-  .uix-alert__body { font-size: var(--uix-text-meta); color: var(--uix-text-hushed); }
-  .uix-alert--info    { --tone-bg: var(--uix-info-bg);    --tone-border: color-mix(in srgb, var(--uix-info) 30%, transparent);    --tone-fg: var(--uix-info-text); }
-  .uix-alert--success { --tone-bg: var(--uix-success-bg); --tone-border: color-mix(in srgb, var(--uix-success) 30%, transparent); --tone-fg: var(--uix-success); }
-  .uix-alert--warning { --tone-bg: var(--uix-warning-bg); --tone-border: color-mix(in srgb, var(--uix-warning) 40%, transparent); --tone-fg: var(--uix-warning); }
-  .uix-alert--danger  { --tone-bg: var(--uix-danger-bg);  --tone-border: color-mix(in srgb, var(--uix-danger) 30%, transparent);  --tone-fg: var(--uix-danger-text); }
-}
-/* uix toast / notification — depends only on --uix-* tokens. JS appends to .uix-toaster. */
-@layer uix.components {
-  .uix-toaster { position: fixed; bottom: 16px; right: 16px; z-index: var(--uix-z-toast); display: flex; flex-direction: column; gap: var(--uix-space-2); width: 340px; max-width: calc(100vw - 32px); }
-  .uix-toast {
-    display: flex; gap: var(--uix-space-3); align-items: flex-start; padding: var(--uix-space-3) var(--uix-space-4); border-radius: var(--uix-radius-md);
-    background: var(--uix-surface-2); border: 1px solid var(--uix-border); box-shadow: var(--uix-shadow-popover);
-    animation: uix-slide-in-right var(--uix-dur-slow) var(--uix-ease-out);
-  }
-  .uix-toast[data-leaving] { animation: uix-toast-out var(--uix-dur) var(--uix-ease-in) forwards; }
-  @keyframes uix-toast-out { to { opacity: 0; transform: translateX(16px); } }
-  .uix-toast__icon { flex: none; margin-top: 1px; }
-  .uix-toast__icon svg { width: var(--uix-icon-md); height: var(--uix-icon-md); }
-  .uix-toast__body { flex: 1; }
-  .uix-toast__title { font-weight: 600; font-size: var(--uix-text-body); }
-  .uix-toast__msg { font-size: var(--uix-text-meta); color: var(--uix-text-muted); margin-top: var(--uix-space-1); }
-  .uix-toast__close { border: 0; background: transparent; color: var(--uix-text-muted); cursor: pointer; padding: var(--uix-space-1) var(--uix-space-2); border-radius: var(--uix-radius-xs); }
-  .uix-toast__close:hover { background: var(--uix-bg-hover); color: var(--uix-text); }
-  .uix-toast--success .uix-toast__icon { color: var(--uix-success); }
-  .uix-toast--danger  .uix-toast__icon { color: var(--uix-danger); }
-  .uix-toast--info    .uix-toast__icon { color: var(--uix-info); }
-}
-/* uix modal / dialog — native <dialog>, animated enter/exit via @starting-style + allow-discrete. */
-@layer uix.components {
-  .uix-dialog {
-    margin: auto; width: 100%; max-width: min(520px, 92vw); padding: 0; color: var(--uix-text);
-    border: 1px solid var(--uix-border); border-radius: var(--uix-radius-lg);
-    background: var(--uix-surface-2); box-shadow: var(--uix-shadow-overlay);
-    opacity: 0; transform: translateY(8px) scale(.98);
-    transition: opacity var(--uix-dur-slow) var(--uix-ease-out), transform var(--uix-dur-slow) var(--uix-ease-out),
-                overlay var(--uix-dur-slow) allow-discrete, display var(--uix-dur-slow) allow-discrete;
-    /* Author display values for both states required for the fade-in to animate: the allow-discrete
-       `display` transition only engages with author values, which also lets @starting-style fire.
-       With only the UA dialog display, the modal stays at opacity:0. Closed = none; open = block. */
-    display: none;
-  }
-  .uix-dialog[open] { opacity: 1; transform: none; display: block; }
-  @starting-style { .uix-dialog[open] { opacity: 0; transform: translateY(8px) scale(.98); } }
-  .uix-dialog::backdrop {
-    background: var(--uix-scrim); opacity: 0;
-    transition: opacity var(--uix-dur-slow) var(--uix-ease-out), overlay var(--uix-dur-slow) allow-discrete, display var(--uix-dur-slow) allow-discrete;
-  }
-  .uix-dialog[open]::backdrop { opacity: 1; }
-  @starting-style { .uix-dialog[open]::backdrop { opacity: 0; } }
-
-  .uix-dialog__header { display: flex; align-items: center; gap: var(--uix-space-3); padding: var(--uix-space-4) var(--uix-space-5); border-bottom: 1px solid var(--uix-border); }
-  /* title is an <h2> for SR navigation (UIX-A11Y-1); inherits neutralize the base h2
-     heading font/tracking/leading so it renders exactly like the old <div> */
-  .uix-dialog__title { font-size: var(--uix-text-h3); font-weight: 600; font-family: inherit; letter-spacing: inherit; line-height: inherit; }
-  .uix-dialog__close { margin-left: auto; border: 0; background: transparent; color: var(--uix-text-muted); cursor: pointer; width: 30px; height: 30px; display: grid; place-items: center; border-radius: var(--uix-radius-sm); }
-  .uix-dialog__close:hover { background: var(--uix-bg-hover); color: var(--uix-text); }
-  .uix-dialog__close svg { width: var(--uix-icon-md); height: var(--uix-icon-md); }
-  .uix-dialog__body { padding: var(--uix-space-5); color: var(--uix-text-hushed); }
-  .uix-dialog__footer { display: flex; gap: var(--uix-space-2); justify-content: flex-end; padding: var(--uix-space-4) var(--uix-space-5); border-top: 1px solid var(--uix-border); }
-}
-/* uix drawer / side sheet — native <dialog> sliding from the right edge. */
-@layer uix.components {
-  .uix-drawer {
-    margin: 0 0 0 auto; height: 100dvh; max-height: 100dvh; width: min(420px, 100vw); padding: 0; color: var(--uix-text);
-    border: 0; border-left: 1px solid var(--uix-border); border-radius: 0;
-    background: var(--uix-surface); box-shadow: var(--uix-shadow-overlay);
-    transform: translateX(100%);
-    transition: transform var(--uix-dur-slow) var(--uix-ease-out),
-                overlay var(--uix-dur-slow) allow-discrete, display var(--uix-dur-slow) allow-discrete;
-    /* Author display values for both states required for the slide-in (see peek.css). Closed = none. */
-    display: none;
-  }
-  .uix-drawer[open] { transform: none; display: flex; flex-direction: column; }
-  @starting-style { .uix-drawer[open] { transform: translateX(100%); } }
-  .uix-drawer::backdrop {
-    background: var(--uix-scrim); opacity: 0;
-    transition: opacity var(--uix-dur-slow) var(--uix-ease-out), overlay var(--uix-dur-slow) allow-discrete, display var(--uix-dur-slow) allow-discrete;
-  }
-  .uix-drawer[open]::backdrop { opacity: 1; }
-  @starting-style { .uix-drawer[open]::backdrop { opacity: 0; } }
-  .uix-drawer__header { display: flex; align-items: center; gap: var(--uix-space-3); padding: var(--uix-space-4) var(--uix-space-5); border-bottom: 1px solid var(--uix-border); }
-  .uix-drawer__body { padding: var(--uix-space-5); overflow-y: auto; flex: 1; }
-  .uix-drawer__footer { display: flex; gap: var(--uix-space-2); padding: var(--uix-space-4) var(--uix-space-5); border-top: 1px solid var(--uix-border); }
-}
-/* uix side-peek drawer (the §5.8 peek pattern, reused by table rows + sidebar items).
-   Native <dialog>, slides from the right; keyboard ↑/↓ navigates records (app.js). */
-@layer uix.components {
-  .uix-peek {
-    margin: 0 0 0 auto; height: 100dvh; max-height: 100dvh; width: var(--uix-peek-w); padding: 0; color: var(--uix-text);
-    border: 0; border-left: 1px solid var(--uix-border); border-radius: 0;
-    background: var(--uix-surface); box-shadow: var(--uix-shadow-overlay);
-    transform: translateX(100%);
-    transition: transform var(--uix-dur-slow) var(--uix-ease-out),
-                overlay var(--uix-dur-slow) allow-discrete, display var(--uix-dur-slow) allow-discrete;
-    /* Author display values for BOTH states are required for the slide-in to animate: the
-       allow-discrete `display` transition only engages with author values, and that gating also
-       lets the @starting-style entrance fire. With only the UA dialog display, the panel stays
-       parked at translateX(100%). Closed = none; open = flex. */
-    display: none;
-  }
-  .uix-peek[open] { transform: none; display: flex; flex-direction: column; }
-  @starting-style { .uix-peek[open] { transform: translateX(100%); } }
-  .uix-peek::backdrop {
-    background: var(--uix-scrim); opacity: 0;
-    transition: opacity var(--uix-dur-slow) var(--uix-ease-out), overlay var(--uix-dur-slow) allow-discrete, display var(--uix-dur-slow) allow-discrete;
-  }
-  .uix-peek[open]::backdrop { opacity: 1; }
-  @starting-style { .uix-peek[open]::backdrop { opacity: 0; } }
-
-  .uix-peek__header { display: flex; align-items: center; gap: var(--uix-space-3); padding: var(--uix-space-4) var(--uix-space-4); border-bottom: 1px solid var(--uix-border); }
-  .uix-peek__nav { display: inline-flex; gap: var(--uix-space-1); }
-  .uix-peek__navbtn { width: 28px; height: 28px; display: grid; place-items: center; border: 1px solid var(--uix-border); background: var(--uix-surface); color: var(--uix-text); border-radius: var(--uix-radius-sm); cursor: pointer; }
-  .uix-peek__navbtn:hover { background: var(--uix-bg-hover); }
-  /* boundary nav uses aria-disabled (still focusable, so focus isn't stranded — UIX-A11Y-1);
-     mute it and suppress the hover cue like a disabled control */
-  .uix-peek__navbtn[aria-disabled="true"] { color: var(--uix-text-muted); cursor: default; }
-  .uix-peek__navbtn[aria-disabled="true"]:hover { background: var(--uix-surface); }
-  /* title is an <h2> for SR navigation (UIX-A11Y-1); inherits neutralize the base h2
-     heading font/tracking/leading so it renders exactly like the old <div> */
-  .uix-peek__title { font-size: var(--uix-text-h3); font-weight: 600; font-family: inherit; letter-spacing: inherit; line-height: inherit; }
-  .uix-peek__title a { color: var(--uix-link); }
-  .uix-peek__close { margin-left: auto; border: 0; background: transparent; color: var(--uix-text-muted); cursor: pointer; width: 30px; height: 30px; display: grid; place-items: center; border-radius: var(--uix-radius-sm); }
-  .uix-peek__close:hover { background: var(--uix-bg-hover); color: var(--uix-text); }
-  .uix-peek__body { padding: var(--uix-space-5); overflow-y: auto; flex: 1; }
-  .uix-peek__hint { font-size: var(--uix-text-meta); color: var(--uix-text-muted); }
-  .uix-peek__footer { display: flex; gap: var(--uix-space-2); padding: var(--uix-space-4) var(--uix-space-4); border-top: 1px solid var(--uix-border); }
-
-  /* a table wired to open the peek (app.js sets data-uix-rowpeek): its rows read as clickable,
-     since clicking a ticket row is the queue's primary way to open the side-peek. */
-  [data-uix-rowpeek] tbody tr { cursor: pointer; }
-  [data-uix-rowpeek] tbody tr:hover td { background: var(--uix-bg-hover); }
-
-  /* Column sizing + the id-cell click-through pattern now live in table.css (one story for
-     "table cells"). Size columns with .uix-col--w-* / .uix-col--flex + .uix-col--truncate
-     instead of the old [data-uix-table-v2] :nth-child(2) title cap. */
-}
-/* uix popover — generic anchored surface via the native Popover API; animated with @starting-style. */
-@layer uix.components {
-  .uix-popover { margin: 0; padding: var(--uix-space-2); background: var(--uix-surface-2); border: 1px solid var(--uix-border); border-radius: var(--uix-radius-md); box-shadow: var(--uix-shadow-popover); color: var(--uix-text); }
-  [popover].uix-popover {
-    opacity: 0; transform: translateY(calc(-1 * var(--uix-lift)));
-    transition: opacity var(--uix-dur-fast) var(--uix-ease-out), transform var(--uix-dur-fast) var(--uix-ease-out),
-                overlay var(--uix-dur-fast) allow-discrete, display var(--uix-dur-fast) allow-discrete;
-  }
-  [popover].uix-popover:popover-open { opacity: 1; transform: none; }
-  @starting-style { [popover].uix-popover:popover-open { opacity: 0; transform: translateY(calc(-1 * var(--uix-lift))); } }
-}
-/* uix spinner + progress overlay — depends only on --uix-* tokens. */
-@layer uix.components {
-  .uix-spinner { width: 20px; height: 20px; border: 2px solid var(--uix-border-strong); border-right-color: transparent; border-radius: 50%; display: inline-block; animation: uix-spin .6s linear infinite; }
-  .uix-spinner--accent { border-color: var(--uix-accent); border-right-color: transparent; }
-  .uix-spinner--lg { width: 32px; height: 32px; border-width: 3px; }
-  .uix-overlay-progress {
-    position: absolute; inset: 0; display: grid; place-items: center; border-radius: inherit;
-    background: color-mix(in srgb, var(--uix-bg-app) 60%, transparent); backdrop-filter: blur(2px);
-  }
-}
-/* uix detail layout — two-column record (main + side meta). Depends only on --uix-* tokens. */
-@layer uix.components {
-  .uix-detail { display: grid; grid-template-columns: 1fr 280px; gap: var(--uix-space-5); align-items: start; }
-  .uix-detail__main { min-width: 0; display: flex; flex-direction: column; gap: var(--uix-space-4); }
-  .uix-detail__side { display: flex; flex-direction: column; gap: var(--uix-space-4); }
-  @media (max-width: 820px) { .uix-detail { grid-template-columns: 1fr; } }
-}
-/* uix comments thread + composer (@mention) — depends only on --uix-* tokens. */
-@layer uix.components {
-  .uix-comments { display: flex; flex-direction: column; gap: var(--uix-space-4); }
-  .uix-comment { display: grid; grid-template-columns: 32px 1fr; gap: var(--uix-space-3); }
-  .uix-comment__body { background: var(--uix-bg-subtle); border: 1px solid var(--uix-border); border-radius: var(--uix-radius-md); padding: var(--uix-space-3) var(--uix-space-3); }
-  .uix-comment__meta { font-size: var(--uix-text-meta); color: var(--uix-text-muted); margin-bottom: var(--uix-space-1); }
-  .uix-comment__author { font-weight: 600; color: var(--uix-text); }
-  .uix-mention { color: var(--uix-link); background: var(--uix-brand-muted); padding: 0 var(--uix-space-1); border-radius: var(--uix-radius-xs); font-weight: 500; }
-  .uix-composer { border: 1px solid var(--uix-border); border-radius: var(--uix-radius-md); background: var(--uix-surface); }
-  .uix-composer:focus-within { border-color: var(--uix-ring); box-shadow: 0 0 0 3px var(--uix-brand-muted); }
-  .uix-composer textarea { width: 100%; border: 0; background: transparent; resize: vertical; padding: var(--uix-space-3) var(--uix-space-3); color: var(--uix-text); font: inherit; min-height: 60px; }
-  .uix-composer textarea:focus { outline: none; }
-  .uix-composer__bar { display: flex; justify-content: flex-end; gap: var(--uix-space-2); padding: var(--uix-space-2); border-top: 1px solid var(--uix-border); }
-  /* Block so the thumbnail drops onto its own line below the comment text (not inline with it). */
-  .uix-comment__image { display: block; margin-top: var(--uix-space-2); padding: 0; border-radius: var(--uix-radius-sm); overflow: hidden; border: 1px solid var(--uix-border); background: none; cursor: zoom-in; max-width: 200px; }
-  .uix-comment__image img { display: block; width: 100%; height: auto; }
-}
-/* uix emoji reactions — pills with counts + an add-reaction picker popover. Depends only on --uix-* tokens. */
-@layer uix.components {
-  .uix-reactions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--uix-space-2); margin-top: var(--uix-space-2); }
-  .uix-reaction {
-    display: inline-flex; align-items: center; gap: var(--uix-space-2); padding: 1px var(--uix-space-2); line-height: 1.7;
-    border-radius: var(--uix-radius-pill); border: 1px solid var(--uix-border); background: var(--uix-surface);
-    color: var(--uix-text-hushed); font: inherit; font-size: var(--uix-text-meta); cursor: pointer;
-  }
-  .uix-reaction:hover { border-color: var(--uix-border-strong); }
-  .uix-reaction[data-mine] { background: var(--uix-brand-muted); border-color: var(--uix-accent); color: var(--uix-accent); }
-  .uix-reaction__count { font-variant-numeric: tabular-nums; }
-  .uix-reaction-add {
-    display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 24px;
-    border-radius: var(--uix-radius-pill); border: 1px dashed var(--uix-border-strong); background: transparent;
-    color: var(--uix-text-muted); cursor: pointer;
-  }
-  .uix-reaction-add:hover { color: var(--uix-text); border-color: var(--uix-text-muted); }
-  .uix-reaction-add svg { width: var(--uix-icon-sm); height: var(--uix-icon-sm); }
-  .uix-emoji-picker { display: flex; flex-wrap: wrap; gap: var(--uix-space-1); width: 196px; }
-  .uix-emoji-picker__btn { font-size: 18px; line-height: 1; padding: var(--uix-space-2); border: 0; background: transparent; border-radius: var(--uix-radius-sm); cursor: pointer; }
-  .uix-emoji-picker__btn:hover { background: var(--uix-bg-hover); }
-}
-/* uix media / device-asset card — image (or icon placeholder) + name + meta. Depends only on --uix-* tokens. */
-@layer uix.components {
-  .uix-media { display: flex; gap: var(--uix-space-3); align-items: center; }
-  .uix-media__thumb { width: 64px; height: 64px; flex: none; border-radius: var(--uix-radius-md); overflow: hidden; background: var(--uix-bg-subtle); border: 1px solid var(--uix-border); display: grid; place-items: center; }
-  .uix-media__thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
-  .uix-media__thumb svg { width: 28px; height: 28px; color: var(--uix-text-muted); }
-  .uix-media__name { font-weight: 600; }
-  .uix-media__meta { font-size: var(--uix-text-meta); color: var(--uix-text-muted); }
-}
-/* uix image lightbox — native <dialog>, click a thumbnail to enlarge. Depends only on --uix-* tokens. */
-@layer uix.components {
-  /* margin:auto centers the modal <dialog> in the viewport. Set explicitly (not
-     left to the UA default) so centering is robust regardless of any consumer
-     reset — base.css scopes its margin reset to typographic/form elements and
-     deliberately leaves <dialog> alone. Matches .uix-dialog. */
-  .uix-lightbox { margin: auto; border: 0; background: transparent; padding: 0; max-width: 92vw; max-height: 92vh; box-shadow: var(--uix-shadow-overlay); overflow: visible; }
-  /* A definite width is required: an SVG with a viewBox but no intrinsic width/height collapses to
-     0×0 under width:auto, which then shrink-wraps the fit-content <dialog> to nothing (nothing shows
-     on open). min() keeps it within the viewport; height:auto preserves the aspect ratio. */
-  .uix-lightbox img { display: block; width: min(720px, 92vw); height: auto; max-height: 92vh; border-radius: var(--uix-radius-md); }
-  .uix-lightbox::backdrop { background: var(--uix-scrim-strong); }
-}
-/* uix prose content card + note callouts — for KB articles, descriptions, release notes. Depends only on --uix-* tokens. */
-@layer uix.components {
-  .uix-prose { max-width: 66ch; color: var(--uix-text); }
-  .uix-prose > * + * { margin-top: var(--uix-space-3); }
-  .uix-prose h3 { font-size: var(--uix-text-h2); font-weight: 600; }
-  .uix-prose h4 { font-size: var(--uix-text-h3); font-weight: 600; margin-top: var(--uix-space-5); }
-  .uix-prose p { line-height: var(--uix-leading-body); color: var(--uix-text-hushed); }
-  .uix-prose a { color: var(--uix-link); }
-  .uix-prose ul, .uix-prose ol { padding-left: var(--uix-space-5); }
-  .uix-prose li + li { margin-top: var(--uix-space-1); }
-  .uix-prose code { font-family: var(--uix-font-mono); font-size: .9em; background: var(--uix-bg-subtle); padding: 1px var(--uix-space-2); border-radius: var(--uix-radius-xs); }
-  .uix-prose blockquote { border-left: 3px solid var(--uix-border-strong); padding-left: var(--uix-space-3); color: var(--uix-text-muted); }
-
-  .uix-note { display: flex; gap: var(--uix-space-3); padding: var(--uix-space-3) var(--uix-space-4); border-radius: var(--uix-radius-md); border: 1px solid var(--uix-border); background: var(--uix-surface); }
-  .uix-note__icon { flex: none; }
-  .uix-note__icon svg { width: var(--uix-icon-md); height: var(--uix-icon-md); }
-  .uix-note__body { font-size: var(--uix-text-body); color: var(--uix-text); }
-  .uix-note__body > * + * { margin-top: var(--uix-space-2); }
-  .uix-note--info { background: var(--uix-info-bg); border-color: color-mix(in srgb, var(--uix-info) 30%, transparent); }
-  .uix-note--info .uix-note__icon { color: var(--uix-info); }
-  .uix-note--success { background: var(--uix-success-bg); border-color: color-mix(in srgb, var(--uix-success) 30%, transparent); }
-  .uix-note--success .uix-note__icon { color: var(--uix-success); }
-  .uix-note--warning { background: var(--uix-warning-bg); border-color: color-mix(in srgb, var(--uix-warning) 30%, transparent); }
-  .uix-note--warning .uix-note__icon { color: var(--uix-warning); }
-  .uix-note--danger { background: var(--uix-danger-bg); border-color: color-mix(in srgb, var(--uix-danger) 30%, transparent); }
-  .uix-note--danger .uix-note__icon { color: var(--uix-danger); }
-}
-/* uix kanban board / column — depends only on --uix-* tokens. */
-@layer uix.components {
-  .uix-kanban { display: flex; gap: var(--uix-space-4); overflow-x: auto; padding-bottom: var(--uix-space-2); }
-  .uix-kanban__col { flex: 0 0 260px; background: var(--uix-bg-subtle); border: 1px solid var(--uix-border); border-radius: var(--uix-radius-lg); display: flex; flex-direction: column; max-height: 460px; }
-  .uix-kanban__head { display: flex; align-items: center; gap: var(--uix-space-2); padding: var(--uix-space-3) var(--uix-space-4); font-weight: 600; font-size: var(--uix-text-meta); }
-  .uix-kanban__count { margin-left: auto; color: var(--uix-text-muted); font-weight: 500; }
-  .uix-kanban__body { padding: 0 var(--uix-space-3) var(--uix-space-3); display: flex; flex-direction: column; gap: var(--uix-space-2); overflow-y: auto; }
-  .uix-kanban__card { background: var(--uix-surface); border: 1px solid var(--uix-border); border-radius: var(--uix-radius-md); padding: var(--uix-space-3); box-shadow: var(--uix-shadow-sm); cursor: grab; transition: box-shadow var(--uix-dur-fast) var(--uix-ease-out), transform var(--uix-dur-fast) var(--uix-ease-out); }
-  .uix-kanban__card:hover { box-shadow: var(--uix-shadow-popover); }
-  @media (hover: hover) and (pointer: fine) { .uix-kanban__card:hover { transform: translateY(calc(-1 * var(--uix-lift))); } }
-  .uix-kanban__card:active { cursor: grabbing; }
-  .uix-kanban__card-title { font-weight: 500; font-size: var(--uix-text-body); margin-bottom: var(--uix-space-2); }
-  .uix-kanban__card-meta { display: flex; align-items: center; gap: var(--uix-space-2); }
-}
-/* uix inbox master-detail — depends only on --uix-* tokens. */
-@layer uix.components {
-  .uix-inbox { display: grid; grid-template-columns: 300px 1fr; border: 1px solid var(--uix-border); border-radius: var(--uix-radius-lg); overflow: hidden; height: 420px; }
-  .uix-inbox__list { border-right: 1px solid var(--uix-border); overflow-y: auto; background: var(--uix-surface); }
-  .uix-inbox__item { position: relative; display: flex; flex-direction: column; gap: var(--uix-space-1); padding: var(--uix-space-3) var(--uix-space-4); border-bottom: 1px solid var(--uix-border); cursor: pointer; }
-  .uix-inbox__item:hover { background: var(--uix-bg-hover); }
-  /* keyboard active option (aria-activedescendant) mirrors the hover style (UIX-A11Y-2) */
-  .uix-inbox__item[data-active] { background: var(--uix-bg-hover); }
-  .uix-inbox__item[aria-selected="true"] { background: linear-gradient(to right, var(--uix-accent) 3px, var(--uix-brand-muted) 3px); }
-  .uix-inbox__item[data-unread] .uix-inbox__subject { font-weight: 600; }
-  .uix-inbox__subject { font-size: var(--uix-text-body); }
-  .uix-inbox__preview { font-size: var(--uix-text-meta); color: var(--uix-text-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
-  .uix-inbox__detail { overflow-y: auto; padding: var(--uix-space-5); background: var(--uix-bg-app); }
-  /* narrow viewports stack to one pane: list by default, detail when the app sets
-     view="detail" — with a consumer-rendered Back control in the detail pane (UIX-A11Y-2) */
-  @media (max-width: 700px) {
-    .uix-inbox { grid-template-columns: 1fr; }
-    .uix-inbox__detail { display: none; }
-    .uix-inbox[data-view="detail"] .uix-inbox__list { display: none; }
-    .uix-inbox[data-view="detail"] .uix-inbox__detail { display: block; }
-  }
-}
-/* uix notification center — depends only on --uix-* tokens. */
-@layer uix.components {
-  .uix-notifs { background: var(--uix-surface-2); border: 1px solid var(--uix-border); border-radius: var(--uix-radius-lg); overflow: hidden; }
-  .uix-notifs__head { display: flex; align-items: center; padding: var(--uix-space-3) var(--uix-space-4); border-bottom: 1px solid var(--uix-border); font-weight: 600; }
-  .uix-notif { display: grid; grid-template-columns: auto 1fr; gap: var(--uix-space-3); padding: var(--uix-space-3) var(--uix-space-4); border-bottom: 1px solid var(--uix-border); }
-  .uix-notif:last-child { border-bottom: 0; }
-  .uix-notif[data-unread] { background: var(--uix-brand-muted); }
-  .uix-notif__dot { width: 8px; height: 8px; border-radius: 50%; background: var(--uix-accent); margin-top: var(--uix-space-2); }
-  .uix-notif[data-unread] .uix-notif__dot { background: var(--uix-accent); }
-  .uix-notif:not([data-unread]) .uix-notif__dot { background: transparent; }
-  .uix-notif__meta { font-size: var(--uix-text-meta); color: var(--uix-text-muted); }
-  /* on the unread brand-muted tint, muted meta dips below AA — hushed composites darker on the tint */
-  .uix-notif[data-unread] .uix-notif__meta { color: var(--uix-text-hushed); }
-}
-/* uix label / tag taxonomy — colored via --label-color (set to a --uix-chart-* token). */
-@layer uix.components {
-  .uix-label {
-    display: inline-flex; align-items: center; gap: var(--uix-space-2); padding: 1px var(--uix-space-2); border-radius: var(--uix-radius-sm);
-    font-size: var(--uix-text-meta); font-weight: 500;
-    background: color-mix(in srgb, var(--label-color, var(--uix-accent)) 16%, transparent);
-    /* Pull the hue toward the theme foreground so the text clears WCAG AA on its own 16% tint.
-       Raw chart hues (esp. amber #F59E0B at 1.9:1) are tuned for fills, not text-on-tint; the dot
-       keeps the full hue. --uix-text flips per theme, so this darkens on light and lightens on dark. */
-    color: color-mix(in srgb, var(--label-color, var(--uix-accent)) 55%, var(--uix-text));
-  }
-  .uix-label__dot { width: 7px; height: 7px; border-radius: 50%; background: var(--label-color, var(--uix-accent)); }
-}
-/* uix attachment list — depends only on --uix-* tokens. */
-@layer uix.components {
-  .uix-attachments { display: flex; flex-direction: column; gap: var(--uix-space-2); }
-  .uix-attachment { display: flex; align-items: center; gap: var(--uix-space-3); padding: var(--uix-space-2) var(--uix-space-3); border: 1px solid var(--uix-border); border-radius: var(--uix-radius-md); background: var(--uix-surface); }
-  .uix-attachment__icon { width: 32px; height: 32px; flex: none; border-radius: var(--uix-radius-sm); background: var(--uix-bg-subtle); display: grid; place-items: center; color: var(--uix-text-muted); }
-  .uix-attachment__icon svg { width: var(--uix-icon-md); height: var(--uix-icon-md); }
-  .uix-attachment__name { font-size: var(--uix-text-body); }
-  .uix-attachment__size { font-size: var(--uix-text-meta); color: var(--uix-text-muted); }
-  .uix-attachment__actions { margin-left: auto; }
-}
-/* uix deal / pipeline stage bar — depends only on --uix-* tokens. */
-@layer uix.components {
-  .uix-pipeline { display: flex; gap: var(--uix-space-1); }
-  .uix-pipeline__stage { flex: 1; text-align: center; padding: var(--uix-space-2) var(--uix-space-2); font-size: var(--uix-text-meta); color: var(--uix-text-muted); background: var(--uix-bg-subtle); }
-  .uix-pipeline__stage:first-child { border-radius: var(--uix-radius-pill) 0 0 var(--uix-radius-pill); }
-  .uix-pipeline__stage:last-child { border-radius: 0 var(--uix-radius-pill) var(--uix-radius-pill) 0; }
-  .uix-pipeline__stage[data-state="done"] { background: var(--uix-accent); color: var(--uix-accent-fg); }
-  .uix-pipeline__stage[data-state="active"] { background: var(--uix-brand-muted); color: var(--uix-link); font-weight: 600; }
-}
-/* uix flow — workflow & pipeline diagrams: boxed nodes + connectors.
-   Depends only on --uix-* tokens. Edges are decorative inline SVG (aria-hidden);
-   straight runs use pure-CSS connectors. Node state follows the tone-API pattern
-   (see status-pill.css): state --modifiers set only --tone-* vars, the base reads them. */
-@layer uix.components {
-
-  /* ============================================================ node */
-  .uix-node {
-    position: relative;
-    display: inline-grid; grid-template-columns: auto 1fr; align-items: center;
-    gap: var(--uix-space-3); min-width: 132px; width: max-content; max-width: 220px; padding: var(--uix-space-3) var(--uix-space-3);
-    background: var(--uix-surface);
-    border: 1px solid var(--tone-border, var(--uix-border-strong));
-    border-radius: var(--uix-radius-md);
-    box-shadow: var(--uix-shadow-sm);
-    color: var(--uix-text); font-size: var(--uix-text-body); text-align: left;
-  }
-  .uix-node__icon {
-    display: grid; place-items: center; width: 30px; height: 30px; flex: none;
-    border-radius: var(--uix-radius-sm);
-    background: var(--tone-bg, var(--uix-bg-subtle));
-    color: var(--tone-fg, var(--uix-text-muted));
-  }
-  .uix-node__icon svg { width: var(--uix-icon-sm); height: var(--uix-icon-sm); }
-  .uix-node__body { min-width: 0; }
-  .uix-node__title { font-weight: 500; line-height: 1.25; }
-  .uix-node__meta { font-size: var(--uix-text-meta); color: var(--uix-text-muted); }
-  .uix-node__status {
-    display: inline-flex; align-items: center; gap: var(--uix-space-2); margin-top: var(--uix-space-1);
-    font-size: var(--uix-text-eyebrow); letter-spacing: var(--uix-tracking-eyebrow);
-    text-transform: uppercase; color: var(--tone-fg, var(--uix-text-muted));
-  }
-  .uix-node__status::before {
-    content: ""; width: 7px; height: 7px; flex: none; border-radius: 50%;
-    background: var(--tone-dot, var(--uix-text-muted));
-  }
-
-  /* connection handles — decorative connection-point affordance */
-  .uix-node__handle {
-    position: absolute; top: 50%; width: 9px; height: 9px; border-radius: 50%;
-    background: var(--uix-surface); border: 1.5px solid var(--uix-border-strong);
-    transform: translateY(-50%);
-  }
-  .uix-node__handle--in { left: -5px; }
-  .uix-node__handle--out { right: -5px; }
-
-  /* ---- state modifiers: set tone vars only ---- */
-  .uix-node--pending { --tone-bg: var(--uix-bg-subtle);  --tone-fg: var(--uix-text-muted); --tone-dot: var(--uix-text-muted); --tone-border: var(--uix-border); }
-  .uix-node--active  { --tone-bg: var(--uix-brand-muted); --tone-fg: var(--uix-link);       --tone-dot: var(--uix-accent);    --tone-border: var(--uix-accent); }
-  .uix-node--running { --tone-bg: var(--uix-info-bg);    --tone-fg: var(--uix-info-text);  --tone-dot: var(--uix-info);      --tone-border: var(--uix-info); }
-  .uix-node--done    { --tone-bg: var(--uix-success-bg); --tone-fg: var(--uix-success);    --tone-dot: var(--uix-success);   --tone-border: var(--uix-success); }
-  .uix-node--error   { --tone-bg: var(--uix-danger-bg);  --tone-fg: var(--uix-danger-text); --tone-dot: var(--uix-danger);    --tone-border: var(--uix-danger); }
-  /* active/running read as "current" via a soft halo in their own tone */
-  .uix-node--active, .uix-node--running { box-shadow: var(--uix-shadow-sm), 0 0 0 3px var(--tone-bg); }
-
-  /* running node spins its icon */
-  .uix-node--running .uix-node__icon svg { animation: uix-flow-spin 1s linear infinite; }
-
-  /* ---- decision / diamond ---- */
-  .uix-node--decision {
-    min-width: 0; width: 112px; height: 112px; padding: 0; overflow: visible;
-    /* reset the base node's `auto 1fr` columns to one full-width track, else the lone title is
-       trapped in the left `auto` column and place-items:center can't center it over the diamond. */
-    display: grid; grid-template-columns: 1fr; place-items: center; background: transparent; border: 0; box-shadow: none;
-  }
-  .uix-node--decision::before {
-    content: ""; position: absolute; left: 50%; top: 50%; width: 78px; height: 78px;
-    transform: translate(-50%, -50%) rotate(45deg);
-    background: var(--tone-bg, var(--uix-surface));
-    border: 1px solid var(--tone-border, var(--uix-border-strong));
-    border-radius: var(--uix-radius-sm); box-shadow: var(--uix-shadow-sm);
-  }
-  .uix-node--decision .uix-node__title {
-    position: relative; z-index: var(--uix-z-raised); max-width: 88px; text-align: center;
-    font-size: var(--uix-text-meta); color: var(--tone-fg, var(--uix-text));
-  }
-
-  /* ---- start / end terminals (pills) ---- */
-  .uix-node--start, .uix-node--end {
-    grid-template-columns: 1fr; min-width: 0; justify-items: center;
-    padding: var(--uix-space-2) var(--uix-space-5); border-radius: var(--uix-radius-pill);
-    background: var(--uix-bg-active); color: var(--uix-text-hushed); font-weight: 500;
-  }
-
-  /* ============================================================ flow + edges */
-  .uix-flow {
-    position: relative; width: 100%;
-    color: var(--uix-border-strong);            /* edges inherit via currentColor */
-  }
-  .uix-flow__edges {
-    position: absolute; inset: 0; width: 100%; height: 100%;
-    overflow: visible; pointer-events: none;    /* never block node hover/focus */
-  }
-  .uix-flow__edge { fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; }
-  .uix-flow__edge--branch-yes { stroke: var(--uix-success); }
-  .uix-flow__edge--branch-no  { stroke: var(--uix-danger); }
-  .uix-flow__edge--loop       { stroke: var(--uix-accent); stroke-dasharray: 5 4; }
-  .uix-flow__arrow { fill: currentColor; }
-  .uix-flow__edge-label { fill: var(--uix-text-muted); font-family: var(--uix-font-sans); font-size: var(--uix-text-eyebrow); }
-  .uix-flow__edge-label--loop { fill: var(--uix-accent); }
-
-  /* hovering/focusing a diagram sets its edges "flowing" (marching dashes) to read direction */
-  @media (hover: hover) and (pointer: fine) {
-    .uix-flow:hover .uix-flow__edge,
-    .uix-flow:focus-within .uix-flow__edge {
-      stroke-dasharray: 5 4; animation: uix-flow-march var(--uix-dur-slow) linear infinite;
-    }
-  }
-
-  /* ---- linear: flex row of nodes + pure-CSS connectors (no SVG) ---- */
-  .uix-flow--linear .uix-flow__row { display: flex; align-items: center; flex-wrap: wrap; gap: var(--uix-space-1); }
-  .uix-flow__connector {
-    position: relative; flex: 1 1 30px; min-width: 30px; height: 0;
-    border-top: 1.5px solid var(--uix-border-strong); margin: 0 var(--uix-space-1);
-  }
-  .uix-flow__connector::after {
-    content: ""; position: absolute; right: -1px; top: 50%; width: 6px; height: 6px;
-    border-top: 1.5px solid var(--uix-border-strong); border-right: 1.5px solid var(--uix-border-strong);
-    transform: translate(0, -50%) rotate(45deg);
-  }
-  .uix-flow__connector[data-done] { border-color: var(--uix-success); }
-  .uix-flow__connector[data-done]::after { border-color: var(--uix-success); }
-
-  /* ---- branch / loop / mindmap: absolutely-positioned nodes over an SVG edge layer.
-         Container aspect-ratio matches each SVG viewBox so % node positions and path
-         coordinates scale together (uniform), keeping edges glued to nodes at any width. */
-  .uix-flow--branch, .uix-flow--loop { aspect-ratio: 5 / 2; }
-  .uix-flow--mindmap { aspect-ratio: 2 / 1; }
-  .uix-flow--branch .uix-node,
-  .uix-flow--loop .uix-node,
-  .uix-flow--mindmap .uix-node,
-  .uix-flow--canvas .uix-node { position: absolute; transform: translate(-50%, -50%); }
-
-  /* mindmap leaves sit tighter than default nodes */
-  .uix-flow--mindmap .uix-node { min-width: 0; }
-  .uix-flow--mindmap .uix-node--hub { min-width: 120px; }
-
-  /* ============================================================ builder canvas */
-  .uix-flow--canvas {
-    display: grid; grid-template-columns: 188px 1fr;
-    border: 1px solid var(--uix-border); border-radius: var(--uix-radius-lg);
-    overflow: hidden; background: var(--uix-surface); width: 100%;
-  }
-  .uix-flow__palette {
-    display: flex; flex-direction: column; gap: var(--uix-space-2); padding: var(--uix-space-4);
-    border-right: 1px solid var(--uix-border); background: var(--uix-surface);
-  }
-  .uix-flow__palette-title {
-    font-size: var(--uix-text-eyebrow); letter-spacing: var(--uix-tracking-eyebrow);
-    text-transform: uppercase; color: var(--uix-text-muted); margin-bottom: var(--uix-space-1);
-  }
-  .uix-flow__chip {
-    display: flex; align-items: center; gap: var(--uix-space-2); padding: var(--uix-space-2) var(--uix-space-3);
-    border: 1px solid var(--uix-border); border-radius: var(--uix-radius-md);
-    background: var(--uix-surface); color: var(--uix-text);
-    font-size: var(--uix-text-meta); cursor: grab; box-shadow: var(--uix-shadow-sm);
-    transition: box-shadow var(--uix-dur-fast) var(--uix-ease-out),
-                transform var(--uix-dur-fast) var(--uix-ease-out);
-  }
-  .uix-flow__chip svg { width: var(--uix-icon-sm); height: var(--uix-icon-sm); color: var(--uix-text-muted); flex: none; }
-  .uix-flow__chip:active { cursor: grabbing; }
-  @media (hover: hover) and (pointer: fine) {
-    .uix-flow__chip:hover { box-shadow: var(--uix-shadow-popover); transform: translateY(calc(-1 * var(--uix-lift))); }
-  }
-  /* the canvas: a dotted grid, free-placed nodes, one SVG edge layer */
-  .uix-flow__canvas {
-    position: relative; aspect-ratio: 16 / 9; min-height: 280px;
-    background-color: var(--uix-bg-subtle);
-    background-image: radial-gradient(var(--uix-border-strong) 1px, transparent 1px);
-    background-size: 22px 22px; background-position: -1px -1px;
-  }
-  .uix-flow--canvas .uix-node { cursor: grab; }
-  .uix-flow--canvas .uix-node:active { cursor: grabbing; }
-
-  /* selected node ring — mirrors the focus-ring construction (double box-shadow on --uix-ring) */
-  .uix-flow .uix-node[data-selected] {
-    border-color: var(--uix-ring);
-    box-shadow: 0 0 0 2px var(--uix-surface), 0 0 0 4px var(--uix-ring);
-  }
-  /* keyboard/click selection on focusable canvas pieces — no JS needed */
-  .uix-flow__chip:focus-visible,
-  .uix-flow--canvas .uix-node:focus-visible {
-    outline: none; border-color: var(--uix-ring);
-    box-shadow: 0 0 0 2px var(--uix-surface), 0 0 0 4px var(--uix-ring);
-  }
-
-  /* ============================================================ motion */
-  @keyframes uix-flow-spin  { to { transform: rotate(360deg); } }
-  @keyframes uix-flow-march { to { stroke-dashoffset: -18; } }
-
-  @media (prefers-reduced-motion: reduce) {
-    .uix-node--running .uix-node__icon svg,
-    .uix-flow:hover .uix-flow__edge,
-    .uix-flow:focus-within .uix-flow__edge { animation: none; }
-  }
-}
-/* uix audit-log entry — depends only on --uix-* tokens. */
-@layer uix.components {
-  .uix-audit { display: flex; flex-direction: column; }
-  .uix-audit__row { display: grid; grid-template-columns: auto 1fr auto; gap: var(--uix-space-3); align-items: center; padding: var(--uix-space-3) 0; border-bottom: 1px solid var(--uix-border); font-size: var(--uix-text-meta); }
-  .uix-audit__row:last-child { border-bottom: 0; }
-  .uix-audit__actor { font-weight: 500; color: var(--uix-text); }
-  .uix-audit__detail { color: var(--uix-text-hushed); }
-  .uix-audit__detail ins { background: var(--uix-success-bg); color: var(--uix-success); text-decoration: none; padding: 0 var(--uix-space-1); border-radius: var(--uix-radius-xs); }
-  .uix-audit__detail del { background: var(--uix-danger-bg); color: var(--uix-danger-text); text-decoration: line-through; padding: 0 var(--uix-space-1); border-radius: var(--uix-radius-xs); }
-  .uix-audit__time { color: var(--uix-text-muted); white-space: nowrap; }
-}
-/* uix contact / customer card (CRM) — depends only on --uix-* tokens. */
-@layer uix.components {
-  .uix-contact { display: flex; flex-direction: column; align-items: center; text-align: center; gap: var(--uix-space-1); padding: var(--uix-space-5); }
-  .uix-contact__name { font-size: var(--uix-text-h3); font-weight: 600; margin-top: var(--uix-space-2); }
-  .uix-contact__role { font-size: var(--uix-text-meta); color: var(--uix-text-muted); }
-  .uix-contact__actions { display: flex; gap: var(--uix-space-2); margin-top: var(--uix-space-3); align-self: stretch; }
-  .uix-contact__actions > .uix-btn { flex: 1; }
-  .uix-contact__stats { display: flex; gap: var(--uix-space-5); margin-top: var(--uix-space-4); }
-  .uix-contact__stat { text-align: center; }
-  .uix-contact__stat b { display: block; font-size: var(--uix-text-h3); }
-  .uix-contact__stat span { font-size: var(--uix-text-meta); color: var(--uix-text-muted); }
-}
-/* uix SLA indicator / timer (breach states) — depends only on --uix-* tokens. */
-@layer uix.components {
-  .uix-sla { display: inline-flex; align-items: center; gap: var(--uix-space-2); font-size: var(--uix-text-meta); font-weight: 500; color: var(--uix-text-hushed); }
-  .uix-sla svg { width: 14px; height: 14px; }
-  .uix-sla[data-state="ok"] { color: var(--uix-success); }
-  .uix-sla[data-state="at-risk"] { color: var(--uix-warning-text); }
-  .uix-sla[data-state="breach"] { color: var(--uix-danger-text); }
-}
-/* uix utility/typography bits — code, pre, blockquote, divider, status dots. Depends only on --uix-* tokens. */
-@layer uix.components {
-  .uix-code { font-family: var(--uix-font-mono); font-size: .9em; background: var(--uix-bg-subtle); border: 1px solid var(--uix-border); border-radius: var(--uix-radius-xs); padding: .1em .4em; color: var(--uix-text); }
-  .uix-pre { font-family: var(--uix-font-mono); font-size: var(--uix-text-meta); line-height: 1.5; background: var(--uix-bg-subtle); border: 1px solid var(--uix-border); border-radius: var(--uix-radius-md); padding: var(--uix-space-4) var(--uix-space-4); overflow-x: auto; color: var(--uix-text); }
-  .uix-blockquote { border-left: 3px solid var(--uix-accent); padding: var(--uix-space-1) 0 var(--uix-space-1) var(--uix-space-4); color: var(--uix-text-hushed); font-style: italic; }
-  .uix-divider { height: 1px; background: var(--uix-border); border: 0; margin: var(--uix-space-4) 0; }
-  .uix-divider--label { display: flex; align-items: center; gap: var(--uix-space-3); color: var(--uix-text-muted); font-size: var(--uix-text-meta); background: transparent; height: auto; }
-  .uix-divider--label::before, .uix-divider--label::after { content: ""; flex: 1; height: 1px; background: var(--uix-border); }
-  .uix-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--uix-text-muted); }
-  .uix-dot--success { background: var(--uix-success); }
-  .uix-dot--warning { background: var(--uix-warning); }
-  .uix-dot--danger { background: var(--uix-danger); }
-  .uix-dot--info { background: var(--uix-info); }
-}
-/* uix heartbeat / live status indicator — a pulsing ping. Respects reduced-motion (guard stops the ping). */
-@layer uix.components {
-  .uix-heartbeat { position: relative; display: inline-grid; place-items: center; width: 8px; height: 8px; flex: none; }
-  .uix-heartbeat__dot { width: 8px; height: 8px; border-radius: 50%; background: var(--uix-success); z-index: var(--uix-z-raised); }
-  .uix-heartbeat__ping { position: absolute; inset: 0; border-radius: 50%; background: var(--uix-success); animation: uix-ping 1.6s var(--uix-ease-out) infinite; }
-  @keyframes uix-ping { 0% { transform: scale(1); opacity: .55; } 100% { transform: scale(2.8); opacity: 0; } }
-  .uix-heartbeat--warning .uix-heartbeat__dot, .uix-heartbeat--warning .uix-heartbeat__ping { background: var(--uix-warning); }
-  .uix-heartbeat--danger  .uix-heartbeat__dot, .uix-heartbeat--danger  .uix-heartbeat__ping { background: var(--uix-danger); }
-  .uix-heartbeat--idle .uix-heartbeat__dot { background: var(--uix-text-muted); }
-  .uix-heartbeat--idle .uix-heartbeat__ping { display: none; }
-  .uix-live { display: inline-flex; align-items: center; gap: var(--uix-space-2); font-size: var(--uix-text-meta); font-weight: 500; color: var(--uix-text-hushed); }
-}
-/* uix editorial-home kit — the intranet "editorial" landing patterns (INTRA-04):
- * page intro + search, shortcut grid, notice queue, featured stage + rundown,
- * section heads, content/rail grids, news lead, content list, resource grid,
- * stat line, event + status rows. Ported 1:1 from the approved TENSOR intranet
- * prototype (Docs/prototypes/intranet-reimagined/mockups.css); spacing/type
- * snapped to the --uix-* scales per the contract gate, editorial display sizes
- * justified in tests/raw-value-allowlist.json. Depends only on --uix-* tokens. */
-@layer uix.components {
-  /* ── page intro — kicker/title/lede beside the search well ─────────────────── */
-  .uix-page-intro { margin-top: var(--uix-space-6); display: grid; grid-template-columns: minmax(300px, 0.8fr) minmax(460px, 1.2fr); align-items: end; gap: var(--uix-space-7); }
-  .uix-page-intro .uix-page-lede { margin-top: var(--uix-space-2); }
-  .uix-page-kicker { margin: 0 0 var(--uix-space-2); color: var(--uix-text-hushed); font-size: var(--uix-text-meta); }
-  .uix-page-title { max-width: 760px; margin: 0; font-family: var(--uix-font-heading); font-size: clamp(30px, 4vw, 48px); font-weight: 400; letter-spacing: -0.035em; line-height: 1.06; }
-  .uix-page-lede { max-width: 680px; margin: var(--uix-space-3) 0 0; color: var(--uix-text-hushed); font-size: var(--uix-text-h3); }
-  .uix-intro-search__label { margin: 0 0 var(--uix-space-2); color: var(--uix-text-hushed); font-size: var(--uix-text-meta); }
-
-  .uix-searchbar { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: var(--uix-space-2); }
-  .uix-searchbar .uix-input { min-height: 44px; padding-left: 42px; }
-  .uix-searchbar__wrap { position: relative; }
-  .uix-searchbar__wrap > svg { position: absolute; top: 50%; left: 14px; z-index: var(--uix-z-raised); width: 17px; height: 17px; color: var(--uix-text-hushed); transform: translateY(-50%); pointer-events: none; }
-
-  .uix-shortcut-grid { grid-column: 1 / -1; margin-top: var(--uix-space-4); display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--uix-space-2); }
-  .uix-shortcut-grid .uix-btn { min-height: 42px; justify-content: flex-start; }
-
-  /* ── notice queue — rotating "important updates" banner ────────────────────── */
-  .uix-notice { min-height: 48px; padding: var(--uix-space-2) var(--uix-space-4); display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: var(--uix-space-3); border-left: 2px solid var(--uix-text); background: var(--uix-bg-subtle); }
-  .uix-notice__copy { margin: 0; font-size: var(--uix-text-body); }
-  .uix-notice__copy strong { font-weight: 600; }
-  .uix-notice__content { min-width: 0; }
-  .uix-notice__meta { margin: var(--uix-space-1) 0 0; color: var(--uix-text-hushed); font-size: var(--uix-text-eyebrow); }
-  .uix-notice__actions { display: flex; align-items: center; justify-content: flex-end; gap: var(--uix-space-2); }
-  .uix-notice__position { margin-right: var(--uix-space-1); color: var(--uix-text-hushed); font-size: var(--uix-text-eyebrow); white-space: nowrap; }
-  .uix-notice__arrow--previous svg { transform: rotate(180deg); }
-
-  /* ── featured briefing — ONE card: stage + rundown are zones inside it, split
-     by an internal hairline. The selected rundown item grows a caret that sits
-     on (and breaks) that hairline toward the stage, and its ordinal becomes a
-     filled chip echoed by .uix-featured__now in the stage eyebrow — that chip
-     pairing is what carries the selection link once the card stacks. ─────────── */
-  .uix-featured { display: grid; grid-template-columns: minmax(0, 1.7fr) minmax(300px, 0.7fr); align-items: stretch; overflow: hidden; border: 1px solid var(--uix-border); border-radius: var(--uix-radius-md); background: var(--uix-surface); }
-  .uix-page-intro + .uix-featured { margin-top: var(--uix-space-6); }
-
-  .uix-featured__stage { min-width: 0; min-height: 302px; display: grid; grid-template-columns: minmax(260px, 0.95fr) minmax(300px, 1.05fr); }
-  .uix-featured__visual {
-    min-height: 302px; padding: var(--uix-space-6) var(--uix-space-7); display: flex; align-items: flex-end;
-    position: relative; overflow: hidden;
-    background:
-      linear-gradient(135deg, transparent 20%, color-mix(in srgb, var(--uix-text) 8%, transparent)),
-      var(--uix-bg-subtle);
-  }
-  .uix-featured__visual::before,
-  .uix-featured__visual::after { content: ""; position: absolute; border: 1px solid var(--uix-border-strong); border-radius: 50%; }
-  .uix-featured__visual::before { width: 240px; height: 240px; top: -78px; right: -42px; }
-  .uix-featured__visual::after { width: 144px; height: 144px; top: 72px; right: 56px; }
-  .uix-featured__content { padding: var(--uix-space-7); display: flex; flex-direction: column; align-items: flex-start; justify-content: center; }
-  .uix-featured__eyebrow { margin: 0 0 var(--uix-space-4); color: var(--uix-text-hushed); font-size: var(--uix-text-eyebrow); letter-spacing: var(--uix-tracking-eyebrow); text-transform: uppercase; }
-  .uix-featured__title { margin: 0; font-family: var(--uix-font-heading); font-size: clamp(26px, 3vw, 38px); font-weight: 400; letter-spacing: -0.03em; line-height: 1.08; }
-  .uix-featured__description { margin: var(--uix-space-3) 0 var(--uix-space-5); color: var(--uix-text-hushed); }
-  .uix-featured__meta { margin: 0 0 var(--uix-space-5); color: var(--uix-text-hushed); font-size: var(--uix-text-meta); }
-  .uix-featured__now { min-width: 22px; height: 22px; display: inline-grid; place-items: center; margin-right: var(--uix-space-2); border-radius: var(--uix-radius-pill); background: var(--uix-text); color: var(--uix-bg-app); font-variant-numeric: tabular-nums; letter-spacing: 0; }
-
-  .uix-story-signal { position: absolute; top: 26px; left: 28px; z-index: var(--uix-z-raised); }
-  .uix-story-signal__value { display: block; font-family: var(--uix-font-heading); font-size: 48px; font-weight: 400; letter-spacing: -0.04em; line-height: 1; }
-  .uix-story-signal__label { display: block; margin-top: var(--uix-space-2); color: var(--uix-text-hushed); font-size: var(--uix-text-meta); }
-
-  .uix-story-diagram { width: min(100%, 500px); position: relative; z-index: var(--uix-z-raised); display: grid; grid-template-columns: repeat(3, 1fr); align-items: end; gap: var(--uix-space-3); }
-  .uix-story-diagram__bar { min-height: 52px; border: 1px solid var(--uix-border-strong); border-radius: var(--uix-radius-sm); background: color-mix(in srgb, var(--uix-surface) 84%, transparent); }
-  .uix-story-diagram__bar:nth-child(2) { min-height: 104px; }
-  .uix-story-diagram__bar:nth-child(3) { min-height: 126px; background: var(--uix-text); }
-
-  .uix-rundown { min-width: 0; padding: var(--uix-space-4); display: grid; grid-template-rows: auto minmax(0, 1fr); gap: var(--uix-space-3); border-left: 1px solid var(--uix-border); }
-  .uix-rundown__head { padding: var(--uix-space-1) var(--uix-space-1) var(--uix-space-3); display: flex; align-items: flex-start; justify-content: space-between; gap: var(--uix-space-3); border-bottom: 1px solid var(--uix-border); }
-  .uix-rundown__eyebrow { margin: 0; color: var(--uix-text-hushed); font-size: var(--uix-text-eyebrow); letter-spacing: 0.05em; text-transform: uppercase; }
-  .uix-rundown__title { margin: var(--uix-space-1) 0 0; font-family: var(--uix-font-heading); font-size: 18px; font-weight: 400; }
-  .uix-rundown__items { min-width: 0; display: grid; grid-template-rows: repeat(3, minmax(0, 1fr)); gap: var(--uix-space-2); }
-  .uix-rundown__item { position: relative; min-width: 0; min-height: 68px; padding: var(--uix-space-3); display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: var(--uix-space-3); border: 1px solid transparent; border-radius: var(--uix-radius-sm); background: transparent; color: var(--uix-text); cursor: pointer; font: inherit; text-align: left; }
-  .uix-rundown__item:hover { background: var(--uix-bg-hover); }
-  .uix-rundown__item[data-selected="true"] { border-color: var(--uix-border); background: var(--uix-bg-active); }
-  /* caret centered on the internal divider (16px zone pad + 1px hairline + half of the 12px glyph) */
-  .uix-rundown__item[data-selected="true"]::before { content: ""; position: absolute; top: 50%; left: -23px; width: 12px; height: 12px; transform: translateY(-50%) rotate(45deg); background: var(--uix-surface); border-left: 1px solid var(--uix-border-strong); border-bottom: 1px solid var(--uix-border-strong); }
-  .uix-rundown__number { color: var(--uix-text-hushed); font-size: var(--uix-text-eyebrow); font-variant-numeric: tabular-nums; }
-  .uix-rundown__item[data-selected="true"] .uix-rundown__number { min-width: 22px; height: 22px; display: inline-grid; place-items: center; border-radius: var(--uix-radius-pill); background: var(--uix-text); color: var(--uix-bg-app); }
-  .uix-rundown__topic,
-  .uix-rundown__item-title { display: block; }
-  .uix-rundown__topic { color: var(--uix-text-hushed); font-size: var(--uix-text-eyebrow); }
-  .uix-rundown__item-title { margin-top: var(--uix-space-1); font-weight: 600; line-height: 1.2; }
-
-  /* ── section heads ─────────────────────────────────────────────────────────── */
-  .uix-section-head { min-height: 36px; margin-bottom: var(--uix-space-3); display: flex; align-items: center; justify-content: space-between; gap: var(--uix-space-4); }
-  .uix-section-title { margin: 0; font-family: var(--uix-font-heading); font-size: var(--uix-text-h2); font-weight: 400; letter-spacing: var(--uix-tracking-tight); }
-  .uix-section-link { color: var(--uix-text-hushed); font-size: var(--uix-text-meta); text-decoration: none; }
-  .uix-section-link:hover { color: var(--uix-text); }
-
-  /* ── content grid + rail ───────────────────────────────────────────────────── */
-  .uix-content-grid { display: grid; grid-template-columns: minmax(0, 1.65fr) minmax(280px, 0.75fr); gap: var(--uix-space-7); align-items: start; }
-  .uix-content-grid--balanced { grid-template-columns: repeat(2, minmax(0, 1fr)); }
-  .uix-content-grid > * { min-width: 0; }
-  .uix-rail { display: grid; gap: var(--uix-space-4); }
-  .uix-rail-card { padding: var(--uix-space-5); }
-  .uix-rail-card__title { margin: 0; font-family: var(--uix-font-heading); font-size: 18px; font-weight: 400; }
-  .uix-rail-card__meta { margin: var(--uix-space-1) 0 0; color: var(--uix-text-hushed); font-size: var(--uix-text-meta); }
-
-  /* ── news lead + content list ──────────────────────────────────────────────── */
-  .uix-news-lead { padding: 0 0 var(--uix-space-5); border-bottom: 1px solid var(--uix-border); }
-  .uix-news-lead__meta,
-  .uix-list-meta { color: var(--uix-text-hushed); font-size: var(--uix-text-meta); }
-  .uix-news-lead__title { margin: var(--uix-space-2) 0 var(--uix-space-1); font-family: var(--uix-font-heading); font-size: var(--uix-text-h2); font-weight: 400; letter-spacing: var(--uix-tracking-tight); }
-  .uix-news-lead__summary { margin: 0; color: var(--uix-text-hushed); }
-
-  .uix-content-list { margin: 0; padding: 0; list-style: none; }
-  .uix-content-list__item { min-height: 68px; padding: var(--uix-space-3) 0; display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: var(--uix-space-4); border-bottom: 1px solid var(--uix-border); }
-  .uix-content-list__item:last-child { border-bottom: 0; }
-  .uix-content-list__title { margin: 0; font-weight: 600; }
-  .uix-content-list__meta { margin: var(--uix-space-1) 0 0; color: var(--uix-text-hushed); font-size: var(--uix-text-meta); }
-
-  /* ── resource grid ─────────────────────────────────────────────────────────── */
-  .uix-resource-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--uix-space-2); }
-  .uix-resource-grid .uix-btn { min-height: 44px; justify-content: flex-start; }
-
-  /* ── stat line ─────────────────────────────────────────────────────────────── */
-  .uix-stat-line { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 1px solid var(--uix-border); }
-  .uix-stat-line__item { padding: var(--uix-space-4) var(--uix-space-2) var(--uix-space-1) 0; }
-  .uix-stat-line__value { display: block; font-size: 20px; font-variant-numeric: tabular-nums; }
-  .uix-stat-line__label { color: var(--uix-text-hushed); font-size: var(--uix-text-eyebrow); }
-
-  /* ── event + status rows ───────────────────────────────────────────────────── */
-  .uix-event-row { min-height: 64px; padding-block: var(--uix-space-3); display: grid; grid-template-columns: 42px minmax(0, 1fr); align-items: center; gap: var(--uix-space-3); border-bottom: 1px solid var(--uix-border); }
-  .uix-event-row:last-child { border-bottom: 0; }
-  .uix-event-date { text-align: center; }
-  .uix-event-date__month { display: block; color: var(--uix-text-hushed); font-size: var(--uix-text-eyebrow); text-transform: uppercase; }
-  .uix-event-date__day { display: block; font-size: 18px; font-variant-numeric: tabular-nums; }
-  .uix-event-row__title { margin: 0; font-weight: 600; }
-  .uix-event-row__meta { margin: var(--uix-space-1) 0 0; color: var(--uix-text-hushed); font-size: var(--uix-text-meta); }
-
-  .uix-status-row { min-height: 48px; display: flex; align-items: center; gap: var(--uix-space-3); border-bottom: 1px solid var(--uix-border); }
-  .uix-status-row:last-child { border-bottom: 0; }
-  .uix-status-row__name { flex: 1; }
-
-  /* ── responsive — ported 1:1 from the prototype's 920/620 breakpoints ──────── */
-  @media (max-width: 920px) {
-    .uix-page-intro,
-    .uix-content-grid,
-    .uix-content-grid--balanced,
-    .uix-featured { grid-template-columns: 1fr; }
-
-    .uix-rundown { border-left: 0; border-top: 1px solid var(--uix-border); }
-    .uix-rundown__items { grid-template-columns: repeat(3, minmax(0, 1fr)); grid-template-rows: 1fr; }
-    /* stacked zones: the caret flips to point up at the stage above */
-    .uix-rundown__item[data-selected="true"]::before { top: -23px; left: 22px; transform: rotate(45deg); border-bottom: 0; border-top: 1px solid var(--uix-border-strong); }
-
-    .uix-shortcut-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
-  }
-
-  @media (max-width: 620px) {
-    .uix-featured__stage { grid-template-columns: 1fr; }
-    .uix-featured__visual { min-height: 190px; }
-    .uix-featured__content { padding: var(--uix-space-6); }
-
-    .uix-rundown__items { grid-template-columns: 1fr; grid-template-rows: repeat(3, auto); }
-    /* vertical item stack: the directional caret stops making sense — the
-       ordinal chips (item number + .uix-featured__now) carry the pairing */
-    .uix-rundown__item[data-selected="true"]::before { display: none; }
-
-    .uix-notice { grid-template-columns: auto minmax(0, 1fr); }
-    .uix-notice > .uix-btn { grid-column: 2; justify-self: start; }
-    .uix-notice__actions { grid-column: 1 / -1; width: 100%; justify-content: flex-start; flex-wrap: wrap; }
-    .uix-notice__position { flex: 1; }
-
-    .uix-searchbar { grid-template-columns: 1fr; }
-    .uix-searchbar .uix-btn { min-height: 44px; }
-
-    .uix-page-intro { margin-top: var(--uix-space-5); gap: var(--uix-space-5); }
-    .uix-shortcut-grid { grid-template-columns: 1fr 1fr; }
-    .uix-shortcut-grid .uix-btn { min-height: 48px; }
-
-    .uix-story-signal { top: 20px; left: 20px; }
-    .uix-story-signal__value { font-size: var(--uix-text-display); }
-
-    .uix-resource-grid { grid-template-columns: 1fr; }
-
-    .uix-stat-line { grid-template-columns: 1fr; }
-    .uix-stat-line__item { display: flex; align-items: baseline; justify-content: space-between; border-bottom: 1px solid var(--uix-border); }
-  }
-}
-/* uix link patterns — the quiet link, for anchors whose CONTAINER is the affordance.
- *
- * The base layer styles anchors as in-text content links: --uix-link colour, and
- * classless [href] anchors carry a persistent underline (WCAG 1.4.1 / link-in-text-block —
- * a link sitting inside a run of same-coloured prose must not be distinguished by colour
- * alone). That contract is right for prose and wrong for composition slots where the
- * surrounding row/card already communicates interactivity: framework <Link>s passed into
- * kit title slots and table cells rendered brand-blue + bold + underlined — unreadable
- * noise at list density (TENSOR INTRA-04, operator-rejected).
- *
- * A quiet link inherits the surrounding text colour and shows its underline on
- * hover/focus. 1.4.1 is not in play: the link is the whole text of its block (a title,
- * a cell), not a link inside body copy. NEVER quiet a link inside prose — in-text links
- * keep the base blue + underline.
- *
- * Two forms:
- *   • `.uix-link--quiet` — the opt-in utility, for block links outside the scoped slots
- *     (whole-card links, event rows composed by hand, app-specific list patterns).
- *   • quiet BY DEFAULT below — the editorial-home title slots and table data cells,
- *     where every anchor is a block-level navigation target. `.uix-table td` keeps
- *     `:not([class])` so class-bearing anchors in cells (`.uix-btn--link`, pills)
- *     stay styled.
- * Depends only on --uix-* tokens. */
-@layer uix.components {
-  .uix-link--quiet,
-  .uix-content-list__title a,
-  .uix-news-lead__title a,
-  .uix-rundown__item-title a,
-  .uix-event-row__title a,
-  .uix-table td a:not([class]) { color: inherit; text-decoration: none; }
-
-  .uix-link--quiet:hover,
-  .uix-link--quiet:focus-visible,
-  .uix-content-list__title a:hover,
-  .uix-content-list__title a:focus-visible,
-  .uix-news-lead__title a:hover,
-  .uix-news-lead__title a:focus-visible,
-  .uix-rundown__item-title a:hover,
-  .uix-rundown__item-title a:focus-visible,
-  .uix-event-row__title a:hover,
-  .uix-event-row__title a:focus-visible,
-  .uix-table td a:not([class]):hover,
-  .uix-table td a:not([class]):focus-visible { text-decoration: underline; }
-}
+@layer uix.tokens,uix.base,uix.util,uix.motion,uix.components;@layer uix.util{.uix-visually-hidden{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.uix-stack{display:flex;flex-direction:column;gap:var(--gap, var(--uix-space-4))}.uix-cluster{display:flex;flex-wrap:wrap;align-items:center;gap:var(--gap, var(--uix-space-2))}.uix-truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.uix-elevated{box-shadow:var(--uix-shadow-sm)}.uix-elevated-popover{box-shadow:var(--uix-shadow-popover)}.uix-elevated-pill{box-shadow:var(--uix-shadow-sm)}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}}@keyframes uix-fade-in{0%{opacity:0}to{opacity:1}}@keyframes uix-pop-in{0%{opacity:0;transform:scale(.96) translateY(var(--uix-lift))}to{opacity:1;transform:none}}@keyframes uix-slide-in-right{0%{opacity:0;transform:translate(16px)}to{opacity:1;transform:none}}@keyframes uix-slide-in-up{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}@keyframes uix-spin{to{transform:rotate(1turn)}}@keyframes uix-shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}@layer uix.motion{.uix-anim-fade{animation:uix-fade-in var(--uix-dur) var(--uix-ease-out)}.uix-anim-pop{animation:uix-pop-in var(--uix-dur-fast) var(--uix-ease-out)}.uix-anim-up{animation:uix-slide-in-up var(--uix-dur) var(--uix-ease-out)}.uix-lift-hover{transition:transform var(--uix-dur-fast) var(--uix-ease-out),box-shadow var(--uix-dur-fast) var(--uix-ease-out)}@media(hover:hover)and (pointer:fine){.uix-lift-hover:hover{transform:translateY(calc(-1 * var(--uix-lift)));box-shadow:var(--uix-shadow-popover)}}}@layer uix.components{.uix-btn{display:inline-flex;align-items:center;justify-content:center;gap:.5em;height:var(--uix-control-h);padding:0 var(--uix-space-4);border:1px solid transparent;border-radius:var(--uix-radius-md);font:inherit;font-size:var(--uix-text-body);font-weight:500;line-height:1;cursor:pointer;user-select:none;white-space:nowrap;transition:background-color var(--uix-dur-fast) var(--uix-ease-out),border-color var(--uix-dur-fast) var(--uix-ease-out),color var(--uix-dur-fast) var(--uix-ease-out),transform var(--uix-dur-fast) var(--uix-ease-out)}.uix-btn:active{transform:scale(.97)}.uix-btn:disabled,.uix-btn[aria-disabled=true]{opacity:.5;pointer-events:none}.uix-btn:focus-visible{outline:2px solid var(--uix-ring);outline-offset:2px}.uix-btn svg{width:var(--uix-icon-md);height:var(--uix-icon-md)}.uix-btn--primary{background:var(--uix-accent);color:var(--uix-accent-fg)}.uix-btn--primary:hover{background:var(--uix-accent-hover)}.uix-btn--secondary{background:var(--uix-bg-subtle);color:var(--uix-text);border-color:var(--uix-border)}.uix-btn--secondary:hover{background:var(--uix-bg-hover)}.uix-btn--outline{background:transparent;color:var(--uix-text);border-color:var(--uix-border-strong)}.uix-btn--outline:hover{background:var(--uix-bg-hover)}.uix-btn--ghost{background:transparent;color:var(--uix-text)}.uix-btn--ghost:hover{background:var(--uix-bg-hover)}.uix-btn--danger{background:var(--uix-danger);color:var(--uix-danger-fg)}.uix-btn--danger:hover{background:color-mix(in srgb,var(--uix-danger) 88%,black)}.uix-btn--link{background:transparent;color:var(--uix-link);height:auto;padding:0}.uix-btn--link:hover{text-decoration:underline}.uix-btn--sm{height:28px;padding:0 var(--uix-space-3);font-size:var(--uix-text-meta)}.uix-btn--lg{height:44px;padding:0 var(--uix-space-5)}.uix-btn--icon{width:var(--uix-control-h);padding:0}.uix-btn--icon.uix-btn--sm{width:28px}.uix-btn--icon.uix-btn--lg{width:44px}.uix-btn[data-loading]{color:transparent!important;position:relative;pointer-events:none}.uix-btn[data-loading]:after{content:"";position:absolute;width:1em;height:1em;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;color:var(--uix-accent-fg);animation:uix-spin .6s linear infinite}.uix-btn-group{display:inline-flex}.uix-btn-group .uix-btn{border-radius:0;border-right-width:0}.uix-btn-group .uix-btn:first-child{border-top-left-radius:var(--uix-radius-md);border-bottom-left-radius:var(--uix-radius-md)}.uix-btn-group .uix-btn:last-child{border-radius:0 var(--uix-radius-md) var(--uix-radius-md) 0;border-right-width:1px}}@layer uix.components{.uix-field{display:flex;flex-direction:column;gap:var(--uix-space-2)}.uix-field__label{font-size:var(--uix-text-meta);font-weight:500;color:var(--uix-text)}.uix-field__label[data-required]:after{content:" *";color:var(--uix-danger-text)}.uix-field__msg{font-size:var(--uix-text-meta);line-height:1.45;min-height:1.45em}.uix-field__hint{font-size:var(--uix-text-meta);color:var(--uix-text-muted)}.uix-field__error{font-size:var(--uix-text-meta);color:var(--uix-danger-text);display:inline-flex;align-items:center;gap:var(--uix-space-2)}.uix-field__error svg,.uix-field__success svg{width:14px;height:14px;flex:none}.uix-field__success{font-size:var(--uix-text-meta);color:var(--uix-success);display:inline-flex;align-items:center;gap:var(--uix-space-2)}.uix-input{height:var(--uix-control-h);width:100%;padding:0 var(--uix-space-3);border:1px solid var(--uix-border);border-radius:var(--uix-radius-md);background:var(--uix-surface);color:var(--uix-text);font:inherit;font-size:var(--uix-text-body);transition:border-color var(--uix-dur-fast) var(--uix-ease-out),box-shadow var(--uix-dur-fast) var(--uix-ease-out)}.uix-input::placeholder{color:var(--uix-text-muted)}.uix-input:hover{border-color:var(--uix-border-strong)}.uix-input:focus{outline:none;border-color:var(--uix-ring);box-shadow:0 0 0 3px var(--uix-brand-muted)}.uix-input:disabled{opacity:.55;cursor:not-allowed;background:var(--uix-bg-subtle)}.uix-input[readonly]{background:var(--uix-bg-subtle)}.uix-input[aria-invalid=true]{border-color:var(--uix-danger)}.uix-input[aria-invalid=true]:focus{box-shadow:0 0 0 3px var(--uix-danger-bg)}.uix-input--sm{height:28px;font-size:var(--uix-text-meta)}.uix-input-group{position:relative;display:flex;align-items:center}.uix-input-group__icon{position:absolute;left:10px;color:var(--uix-text-muted);display:inline-flex;pointer-events:none}.uix-input-group__icon svg{width:var(--uix-icon-md);height:var(--uix-icon-md)}.uix-input-group--has-leading .uix-input{padding-left:38px}.uix-input[data-valid]{border-color:var(--uix-success)}.uix-input[data-valid]:focus{box-shadow:0 0 0 3px var(--uix-success-bg)}.uix-input-group--has-trailing .uix-input{padding-right:38px}.uix-input-group__icon--trailing{left:auto;right:10px}}@layer uix.components{.uix-textarea{width:100%;min-height:84px;padding:var(--uix-space-3) var(--uix-space-3);resize:vertical;border:1px solid var(--uix-border);border-radius:var(--uix-radius-md);background:var(--uix-surface);color:var(--uix-text);font:inherit;font-size:var(--uix-text-body);line-height:var(--uix-leading-body);transition:border-color var(--uix-dur-fast) var(--uix-ease-out),box-shadow var(--uix-dur-fast) var(--uix-ease-out)}.uix-textarea::placeholder{color:var(--uix-text-muted)}.uix-textarea:hover{border-color:var(--uix-border-strong)}.uix-textarea:focus{outline:none;border-color:var(--uix-ring);box-shadow:0 0 0 3px var(--uix-brand-muted)}.uix-textarea:disabled{opacity:.55;background:var(--uix-bg-subtle)}.uix-textarea[aria-invalid=true]{border-color:var(--uix-danger)}}@layer uix.components{.uix-select{height:var(--uix-control-h);width:100%;padding:0 var(--uix-space-8) 0 var(--uix-space-3);appearance:none;border:1px solid var(--uix-border);border-radius:var(--uix-radius-md);background-color:var(--uix-surface);color:var(--uix-text);font:inherit;font-size:var(--uix-text-body);cursor:pointer;background-repeat:no-repeat;background-position:right 12px center;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23737373' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");transition:border-color var(--uix-dur-fast) var(--uix-ease-out),box-shadow var(--uix-dur-fast) var(--uix-ease-out)}.uix-select:hover{border-color:var(--uix-border-strong)}.uix-select:focus{outline:none;border-color:var(--uix-ring);box-shadow:0 0 0 3px var(--uix-brand-muted)}.uix-select:disabled{opacity:.55;cursor:not-allowed;background-color:var(--uix-bg-subtle)}.uix-select--sm{height:28px;font-size:var(--uix-text-meta)}.uix-select-trigger{display:inline-flex;align-items:center;gap:var(--uix-space-2);height:var(--uix-control-h);padding:0 var(--uix-space-3);min-width:220px;border:1px solid var(--uix-border);border-radius:var(--uix-radius-md);background:var(--uix-surface);color:var(--uix-text);font:inherit;font-size:var(--uix-text-body);cursor:pointer;transition:border-color var(--uix-dur-fast) var(--uix-ease-out)}.uix-select-trigger:hover{border-color:var(--uix-border-strong)}.uix-select-trigger:focus-visible{outline:2px solid var(--uix-ring);outline-offset:2px}.uix-select-trigger__chevron{margin-left:auto;color:var(--uix-text-muted);width:var(--uix-icon-sm);height:var(--uix-icon-sm)}}@layer uix.components{.uix-checkbox{display:inline-flex;align-items:center;gap:var(--uix-space-2);cursor:pointer;font-size:var(--uix-text-body);color:var(--uix-text)}.uix-checkbox>input{position:absolute;opacity:0;width:1px;height:1px}.uix-checkbox__box{width:18px;height:18px;flex:none;display:grid;place-items:center;border:1px solid var(--uix-border-strong);border-radius:var(--uix-radius-xs);background:var(--uix-surface);transition:background-color var(--uix-dur-fast) var(--uix-ease-out),border-color var(--uix-dur-fast) var(--uix-ease-out)}.uix-checkbox__box svg{width:13px;height:13px;color:var(--uix-accent-fg);opacity:0;transform:scale(.5);transition:opacity var(--uix-dur-fast) var(--uix-ease-out),transform var(--uix-dur-fast) var(--uix-ease-spring)}.uix-checkbox>input:checked+.uix-checkbox__box,.uix-checkbox>input:indeterminate+.uix-checkbox__box{background:var(--uix-accent);border-color:var(--uix-accent)}.uix-checkbox>input:checked+.uix-checkbox__box svg{opacity:1;transform:none}.uix-checkbox>input:focus-visible+.uix-checkbox__box{outline:2px solid var(--uix-ring);outline-offset:2px}.uix-checkbox>input:disabled~*{opacity:.5}}@layer uix.components{.uix-radio-group{display:flex;flex-direction:column;gap:var(--uix-space-2)}.uix-radio{display:inline-flex;align-items:center;gap:var(--uix-space-2);cursor:pointer;font-size:var(--uix-text-body);color:var(--uix-text)}.uix-radio>input{position:absolute;opacity:0;width:1px;height:1px}.uix-radio__dot{width:18px;height:18px;flex:none;border-radius:50%;border:1px solid var(--uix-border-strong);background:var(--uix-surface);display:grid;place-items:center;transition:border-color var(--uix-dur-fast) var(--uix-ease-out)}.uix-radio__dot:after{content:"";width:8px;height:8px;border-radius:50%;background:var(--uix-accent);opacity:0;transform:scale(.4);transition:opacity var(--uix-dur-fast) var(--uix-ease-out),transform var(--uix-dur-fast) var(--uix-ease-spring)}.uix-radio>input:checked+.uix-radio__dot{border-color:var(--uix-accent)}.uix-radio>input:checked+.uix-radio__dot:after{opacity:1;transform:none}.uix-radio>input:focus-visible+.uix-radio__dot{outline:2px solid var(--uix-ring);outline-offset:2px}.uix-radio>input:disabled~*{opacity:.5}}@layer uix.components{.uix-switch{display:inline-flex;align-items:center;gap:var(--uix-space-2);cursor:pointer;color:var(--uix-text);font-size:var(--uix-text-body)}.uix-switch>input{position:absolute;opacity:0;width:1px;height:1px}.uix-switch__track{width:36px;height:20px;flex:none;border-radius:var(--uix-radius-pill);background:var(--uix-bg-active);position:relative;transition:background-color var(--uix-dur) var(--uix-ease-out)}.uix-switch__track:after{content:"";position:absolute;top:2px;left:2px;width:16px;height:16px;border-radius:50%;background:var(--uix-text-reverse);box-shadow:var(--uix-shadow-sm);transition:transform var(--uix-dur) var(--uix-ease-out)}.uix-switch>input:checked+.uix-switch__track{background:var(--uix-accent)}.uix-switch>input:checked+.uix-switch__track:after{transform:translate(16px)}.uix-switch>input:focus-visible+.uix-switch__track{outline:2px solid var(--uix-ring);outline-offset:2px}.uix-switch>input:disabled+.uix-switch__track{opacity:.5}}@layer uix.components{.uix-segmented{display:inline-flex;padding:var(--uix-space-1);gap:var(--uix-space-1);background:var(--uix-bg-subtle);border:1px solid var(--uix-border);border-radius:var(--uix-radius-md)}.uix-segmented__option{border:0;background:transparent;color:var(--uix-text-hushed);font:inherit;font-size:var(--uix-text-meta);font-weight:500;padding:var(--uix-space-2) var(--uix-space-3);border-radius:calc(var(--uix-radius-md) - 3px);cursor:pointer;transition:background-color var(--uix-dur-fast) var(--uix-ease-out),color var(--uix-dur-fast) var(--uix-ease-out)}.uix-segmented__option:hover{color:var(--uix-text)}.uix-segmented__option[aria-selected=true],.uix-segmented__option[aria-pressed=true]{background:var(--uix-surface);color:var(--uix-text);box-shadow:var(--uix-shadow-sm)}.uix-segmented__option:focus-visible{outline:2px solid var(--uix-ring);outline-offset:1px}}@layer uix.components{.uix-slider{-webkit-appearance:none;appearance:none;width:220px;height:20px;background:transparent;cursor:pointer}.uix-slider::-webkit-slider-runnable-track{height:6px;border-radius:var(--uix-radius-pill);background:var(--uix-bg-active)}.uix-slider::-moz-range-track{height:6px;border-radius:var(--uix-radius-pill);background:var(--uix-bg-active)}.uix-slider::-moz-range-progress{height:6px;border-radius:var(--uix-radius-pill);background:var(--uix-accent)}.uix-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;margin-top:-6px;width:18px;height:18px;border-radius:50%;background:var(--uix-surface);border:2px solid var(--uix-accent);box-shadow:var(--uix-shadow-sm);transition:transform var(--uix-dur-fast) var(--uix-ease-out)}.uix-slider::-moz-range-thumb{width:18px;height:18px;border:2px solid var(--uix-accent);border-radius:50%;background:var(--uix-surface);box-shadow:var(--uix-shadow-sm)}.uix-slider:active::-webkit-slider-thumb{transform:scale(1.12)}.uix-slider:focus-visible::-webkit-slider-thumb{outline:2px solid var(--uix-ring);outline-offset:2px}.uix-slider:disabled{opacity:.5;cursor:not-allowed}}@layer uix.components{.uix-stepper{display:inline-flex;align-items:center;height:var(--uix-control-h);overflow:hidden;border:1px solid var(--uix-border);border-radius:var(--uix-radius-md);background:var(--uix-surface)}.uix-stepper__btn{width:32px;align-self:stretch;border:0;background:transparent;color:var(--uix-text);cursor:pointer;display:grid;place-items:center;transition:background-color var(--uix-dur-fast) var(--uix-ease-out)}.uix-stepper__btn:hover{background:var(--uix-bg-hover)}.uix-stepper__btn svg{width:var(--uix-icon-sm);height:var(--uix-icon-sm)}.uix-stepper__input{width:52px;text-align:center;border:0;height:100%;background:transparent;color:var(--uix-text);font:inherit;border-inline:1px solid var(--uix-border);-moz-appearance:textfield}.uix-stepper__input::-webkit-outer-spin-button,.uix-stepper__input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.uix-stepper:focus-within{border-color:var(--uix-ring);box-shadow:0 0 0 3px var(--uix-brand-muted)}}@layer uix.components{.uix-dropzone{display:flex;flex-direction:column;align-items:center;gap:var(--uix-space-2);padding:var(--uix-space-7);text-align:center;border:1.5px dashed var(--uix-border-strong);border-radius:var(--uix-radius-lg);background:var(--uix-bg-subtle);color:var(--uix-text-muted);cursor:pointer;transition:border-color var(--uix-dur-fast) var(--uix-ease-out),background-color var(--uix-dur-fast) var(--uix-ease-out),color var(--uix-dur-fast) var(--uix-ease-out)}.uix-dropzone:hover,.uix-dropzone[data-dragover]{border-color:var(--uix-accent);background:var(--uix-brand-muted);color:var(--uix-text)}.uix-dropzone svg{width:var(--uix-icon-lg);height:var(--uix-icon-lg)}.uix-filelist{display:flex;flex-direction:column;gap:var(--uix-space-2);margin-top:var(--uix-space-3)}.uix-filelist__item{display:flex;align-items:center;gap:var(--uix-space-3);padding:var(--uix-space-2) var(--uix-space-3);border:1px solid var(--uix-border);border-radius:var(--uix-radius-md);background:var(--uix-surface);font-size:var(--uix-text-meta);color:var(--uix-text)}.uix-filelist__size{margin-left:auto;color:var(--uix-text-muted)}}@layer uix.components{.uix-combobox{position:relative}.uix-listbox{list-style:none;margin:0;padding:var(--uix-space-1);min-width:200px;background:var(--uix-surface-2);border:1px solid var(--uix-border);border-radius:var(--uix-radius-md);box-shadow:var(--uix-shadow-popover)}.uix-listbox__option{padding:var(--uix-space-2) var(--uix-space-3);border-radius:var(--uix-radius-sm);font-size:var(--uix-text-body);color:var(--uix-text);cursor:pointer;display:flex;align-items:center;gap:var(--uix-space-2)}.uix-listbox__option:hover,.uix-listbox__option[aria-selected=true],.uix-listbox__option[data-active]{background:var(--uix-bg-hover)}.uix-listbox__option[aria-selected=true]{color:var(--uix-link)}.uix-listbox__empty{padding:var(--uix-space-3);text-align:center;color:var(--uix-text-muted);font-size:var(--uix-text-meta)}}@layer uix.components{.uix-taginput{display:flex;flex-wrap:wrap;align-items:center;gap:var(--uix-space-2);min-height:var(--uix-control-h);padding:var(--uix-space-1) var(--uix-space-2);border:1px solid var(--uix-border);border-radius:var(--uix-radius-md);background:var(--uix-surface)}.uix-taginput:focus-within{border-color:var(--uix-ring);box-shadow:0 0 0 3px var(--uix-brand-muted)}.uix-taginput__field{flex:1;min-width:80px;border:0;outline:none;background:transparent;color:var(--uix-text);font:inherit}.uix-tag{display:inline-flex;align-items:center;gap:var(--uix-space-1);padding:var(--uix-space-1) var(--uix-space-1) var(--uix-space-1) var(--uix-space-2);border-radius:var(--uix-radius-sm);background:var(--uix-bg-active);color:var(--uix-text);font-size:var(--uix-text-meta)}.uix-tag__remove{display:grid;place-items:center;width:16px;height:16px;border:0;background:transparent;color:var(--uix-text-muted);cursor:pointer;border-radius:var(--uix-radius-xs)}.uix-tag__remove:hover{background:var(--uix-bg-hover);color:var(--uix-text)}.uix-tag__remove svg{width:12px;height:12px}}@layer uix.components{.uix-form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:var(--uix-space-5)}.uix-fieldset{border:1px solid var(--uix-border);border-radius:var(--uix-radius-lg);padding:var(--uix-space-6)}.uix-fieldset>legend{padding:0 var(--uix-space-2);font-size:var(--uix-text-meta);font-weight:600;color:var(--uix-text)}.uix-form-inline{display:flex;flex-wrap:wrap;align-items:flex-end;gap:var(--uix-space-4)}.uix-validation-summary{border:1px solid var(--uix-danger);background:var(--uix-danger-bg);color:var(--uix-text);border-radius:var(--uix-radius-md);padding:var(--uix-space-3) var(--uix-space-4);font-size:var(--uix-text-meta)}.uix-validation-summary strong{color:var(--uix-danger-text)}.uix-validation-summary ul{margin:var(--uix-space-2) 0 0;padding-left:var(--uix-space-5)}.uix-validation-summary a{color:var(--uix-danger-text);text-decoration:underline}}@layer uix.components{.uix-shell{position:relative;display:grid;grid-template-columns:var(--uix-sidebar-w) 1fr;grid-template-rows:var(--uix-topbar-h) 1fr;height:100%;min-height:360px;border:1px solid var(--uix-border);border-radius:var(--uix-radius-lg);overflow:hidden;transition:grid-template-columns var(--uix-dur) var(--uix-ease-out),grid-template-rows var(--uix-dur) var(--uix-ease-out)}.uix-shell__sidebar{grid-row:1 / 3;background:var(--uix-bg-subtle);border-right:1px solid var(--uix-border);overflow-y:auto;overflow-x:hidden}.uix-shell__topbar{grid-column:2;display:flex;align-items:center;gap:var(--uix-space-3);padding:0 var(--uix-space-6);background:var(--uix-bg-app);border-bottom:1px solid var(--uix-border)}.uix-shell__main{grid-column:2;overflow:auto;padding:var(--uix-space-7);background:var(--uix-bg-app)}.uix-shell[data-nav=rail],.uix-shell[data-collapsed]{grid-template-columns:var(--uix-sidebar-w-rail) 1fr}.uix-shell[data-nav=hidden]{grid-template-columns:0 1fr}.uix-shell[data-focus]{grid-template-columns:0 1fr;grid-template-rows:0 1fr}.uix-shell[data-focus] .uix-shell__topbar{display:none}.uix-shell__focus-exit{position:absolute;top:var(--uix-space-3);right:var(--uix-space-3);z-index:var(--uix-z-overlay)}.uix-shell__main--bleed{padding:0}}@layer uix.components{.uix-sidebar{width:var(--uix-sidebar-w);background:var(--uix-bg-subtle);display:flex;flex-direction:column;gap:var(--uix-space-1);padding:var(--uix-space-2);overflow-x:hidden;overflow-y:auto}.uix-sidebar__eyebrow{font-size:var(--uix-text-eyebrow);letter-spacing:var(--uix-tracking-eyebrow);text-transform:uppercase;color:var(--uix-text-muted);padding:var(--uix-space-3) var(--uix-space-3) var(--uix-space-1)}.uix-sidebar__head{display:flex;align-items:center;justify-content:space-between;gap:var(--uix-space-2);padding:var(--uix-space-1) var(--uix-space-2) var(--uix-space-2)}.uix-sidebar__brand{min-width:0;font-size:var(--uix-text-h3);font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.uix-sidebar__toggle{display:grid;place-items:center;width:28px;height:28px;flex:none;border:0;background:transparent;color:var(--uix-text-muted);cursor:pointer;border-radius:var(--uix-radius-sm);transition:background-color var(--uix-dur-fast) var(--uix-ease-out),color var(--uix-dur-fast) var(--uix-ease-out)}.uix-sidebar__toggle:hover{background:var(--uix-bg-hover);color:var(--uix-text)}.uix-sidebar__toggle svg{width:18px;height:18px}.uix-navitem{display:flex;align-items:center;gap:var(--uix-space-3);height:36px;padding:0 var(--uix-space-3);border-radius:var(--uix-radius-sm);color:var(--uix-text-hushed);cursor:pointer;text-decoration:none;border:0;background:transparent;font:inherit;font-size:var(--uix-text-body);width:100%;text-align:left;transition:background-color var(--uix-dur-fast) var(--uix-ease-out),color var(--uix-dur-fast) var(--uix-ease-out)}.uix-navitem:hover{background:var(--uix-bg-hover);color:var(--uix-text);text-decoration:none}.uix-navitem[aria-current=page]{background:var(--uix-brand-muted);color:var(--uix-link);font-weight:500}.uix-navitem__icon{width:var(--uix-icon-md);height:var(--uix-icon-md);flex:none}.uix-navitem__label{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.uix-navitem__badge{font-size:var(--uix-text-meta);color:var(--uix-text-muted)}.uix-navitem[aria-current=page] .uix-navitem__badge{color:var(--uix-text-hushed)}.uix-navitem__star{display:grid;place-items:center;width:22px;height:22px;border:0;background:transparent;color:var(--uix-text-muted);cursor:pointer;border-radius:var(--uix-radius-xs);opacity:0;transition:opacity var(--uix-dur-fast) var(--uix-ease-out)}.uix-navitem__star svg{width:15px;height:15px}.uix-navitem:hover .uix-navitem__star{opacity:1}.uix-navitem__star[data-on]{opacity:1;color:var(--uix-warning)}.uix-navitem__star[data-on] svg{fill:currentColor}.uix-favourites{margin-bottom:var(--uix-space-1)}.uix-favourites__chevron{flex-shrink:0}.uix-favourites__heading{display:flex;width:100%;align-items:center;gap:calc(var(--uix-space-1) * 1.5);padding:var(--uix-space-2) var(--uix-space-1) var(--uix-space-1);border:0;background:transparent;cursor:pointer;color:inherit}.uix-favourites__list{display:flex;flex-direction:column;gap:calc(var(--uix-space-1) / 4);list-style:none;margin:0;padding:0}.uix-favourites__empty{padding:calc(var(--uix-space-1) * 1.5) var(--uix-space-2);color:color-mix(in srgb,var(--uix-text) 50%,transparent)}.uix-favourites__row{position:relative;display:flex;align-items:center}.uix-favourites__link{min-width:0;flex:1}.uix-favourites__menu-trigger{margin-left:auto;display:inline-flex;height:20px;width:20px;flex-shrink:0;align-items:center;justify-content:center;border:0;border-radius:calc(var(--uix-radius-xs) / 2);background:transparent;cursor:pointer;color:color-mix(in srgb,var(--uix-text) 50%,transparent);opacity:0;transition:opacity var(--uix-dur-fast) var(--uix-ease-out)}.uix-favourites__row:hover .uix-favourites__menu-trigger,.uix-favourites__row:focus-within .uix-favourites__menu-trigger,.uix-favourites__menu-trigger[aria-expanded=true]{opacity:1}.uix-favourites__backdrop{position:fixed;inset:0;cursor:default;background:transparent;z-index:calc(var(--uix-z-tooltip) + 10)}.uix-favourites__menu{position:absolute;right:0;top:calc(100% + 2px);z-index:calc(var(--uix-z-tooltip) + 20);min-width:160px;overflow:hidden;margin:0;padding:var(--uix-space-1) 0;list-style:none;border-radius:calc((var(--uix-radius-xs) + var(--uix-radius-sm)) / 2);border:1px solid var(--uix-border);background:var(--uix-surface);box-shadow:var(--uix-shadow-popover)}.uix-favourites__menu-item{display:flex;width:100%;align-items:center;padding:calc(var(--uix-space-1) * 1.5) var(--uix-space-3);border:0;background:transparent;cursor:pointer;text-align:left;font-size:calc(var(--uix-text-body) * .9285714286);color:color-mix(in srgb,var(--uix-text) 85%,transparent);transition:background-color var(--uix-dur-fast) var(--uix-ease-out)}.uix-favourites__menu-item:hover{background:var(--uix-bg-hover)}.uix-navgroup__trigger .uix-navgroup__chevron{margin-left:auto;transition:transform var(--uix-dur) var(--uix-ease-out)}.uix-navgroup__trigger[aria-expanded=false] .uix-navgroup__chevron{transform:rotate(-90deg)}.uix-navgroup__chevron{width:var(--uix-icon-sm);height:var(--uix-icon-sm)}.uix-navgroup__panel{display:grid;grid-template-rows:1fr;transition:grid-template-rows var(--uix-dur) var(--uix-ease-out)}.uix-navgroup__trigger[aria-expanded=false]+.uix-navgroup__panel{grid-template-rows:0fr}.uix-navgroup__panel>div{overflow:hidden}.uix-subitem{padding-left:var(--uix-space-5)}.uix-subitem .uix-navitem__label:before{content:"";display:inline-block;width:4px;height:4px;border-radius:50%;background:var(--uix-text-muted);margin-right:var(--uix-space-3);vertical-align:middle}.uix-sidebar[data-collapsed],.uix-sidebar[data-nav=rail]{width:var(--uix-sidebar-w-rail)}.uix-sidebar[data-collapsed] .uix-navitem__label,.uix-sidebar[data-collapsed] .uix-navitem__badge,.uix-sidebar[data-collapsed] .uix-navitem__star,.uix-sidebar[data-collapsed] .uix-sidebar__eyebrow,.uix-sidebar[data-collapsed] .uix-sidebar__brand,.uix-sidebar[data-collapsed] .uix-navgroup__chevron,.uix-sidebar[data-collapsed] .uix-navgroup__panel{display:none}.uix-sidebar[data-collapsed] .uix-navitem{justify-content:center;padding:0;gap:0}.uix-sidebar[data-collapsed] .uix-sidebar__head{justify-content:center;padding-inline:0}}@layer uix.components{.uix-breadcrumbs{display:flex;align-items:center;gap:var(--uix-space-2);flex-wrap:wrap;font-size:var(--uix-text-meta);color:var(--uix-text-muted)}.uix-breadcrumbs a{color:var(--uix-text-muted);text-decoration:none}.uix-breadcrumbs a:is(:hover,:focus-visible){color:var(--uix-text);text-decoration:underline}.uix-breadcrumbs__sep{opacity:.55}.uix-breadcrumbs [aria-current=page]{color:var(--uix-text);font-weight:500}}@layer uix.components{.uix-tabs{display:flex;gap:var(--uix-space-1)}.uix-tab{border:0;background:transparent;font:inherit;font-size:var(--uix-text-body);font-weight:500;color:var(--uix-text-hushed);padding:var(--uix-space-3) var(--uix-space-3);cursor:pointer;position:relative;transition:color var(--uix-dur-fast) var(--uix-ease-out),background-color var(--uix-dur-fast) var(--uix-ease-out)}.uix-tab:hover,.uix-tab[aria-selected=true]{color:var(--uix-text)}.uix-tab:focus-visible{outline:2px solid var(--uix-ring);outline-offset:-2px;border-radius:var(--uix-radius-sm)}.uix-tabs--line{border-bottom:1px solid var(--uix-border)}.uix-tabs--line .uix-tab:after{content:"";position:absolute;left:8px;right:8px;bottom:-1px;height:2px;background:var(--uix-accent);border-radius:var(--uix-radius-pill);transform:scaleX(0);transition:transform var(--uix-dur) var(--uix-ease-out)}.uix-tabs--line .uix-tab[aria-selected=true]:after{transform:scaleX(1)}.uix-tabs--enclosed{gap:0;border-bottom:1px solid var(--uix-border)}.uix-tabs--enclosed .uix-tab{border:1px solid transparent;border-top-left-radius:var(--uix-radius-md);border-top-right-radius:var(--uix-radius-md);margin-bottom:-1px}.uix-tabs--enclosed .uix-tab[aria-selected=true]{border-color:var(--uix-border);border-bottom-color:var(--uix-bg-app);background:var(--uix-bg-app)}.uix-tabs--pill{display:inline-flex;background:var(--uix-bg-subtle);padding:var(--uix-space-1);border-radius:var(--uix-radius-md)}.uix-tabs--pill .uix-tab{padding:var(--uix-space-2) var(--uix-space-4);border-radius:calc(var(--uix-radius-md) - 3px)}.uix-tabs--pill .uix-tab[aria-selected=true]{background:var(--uix-surface);box-shadow:var(--uix-shadow-sm)}}@layer uix.components{.uix-pagination{display:inline-flex;align-items:center;gap:var(--uix-space-1)}.uix-pagination__btn{min-width:32px;height:32px;padding:0 var(--uix-space-2);display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--uix-border);border-radius:var(--uix-radius-sm);background:var(--uix-surface);color:var(--uix-text);font:inherit;font-size:var(--uix-text-meta);line-height:1;cursor:pointer;transition:background-color var(--uix-dur-fast) var(--uix-ease-out),border-color var(--uix-dur-fast) var(--uix-ease-out)}.uix-pagination__btn:hover{background:var(--uix-bg-hover)}.uix-pagination__btn[aria-current=page]{background:var(--uix-accent);border-color:var(--uix-accent);color:var(--uix-accent-fg)}.uix-pagination__btn:disabled{opacity:.45;pointer-events:none}.uix-pagination__ellipsis{padding:0 var(--uix-space-1);color:var(--uix-text-muted)}}@layer uix.components{.uix-steps{display:flex;align-items:center;gap:0}.uix-step{display:flex;align-items:center;gap:var(--uix-space-3);color:var(--uix-text-muted)}.uix-step__marker{width:26px;height:26px;flex:none;border-radius:50%;display:grid;place-items:center;border:1px solid var(--uix-border-strong);background:var(--uix-surface);font-size:var(--uix-text-meta);font-weight:600;line-height:1}.uix-step__label{font-size:var(--uix-text-meta);font-weight:500}.uix-step__connector{flex:1;height:1px;min-width:28px;background:var(--uix-border);margin:0 var(--uix-space-3)}.uix-step[data-state=active]{color:var(--uix-text)}.uix-step[data-state=active] .uix-step__marker{border-color:var(--uix-accent);color:var(--uix-accent);box-shadow:0 0 0 3px var(--uix-brand-muted)}.uix-step[data-state=done]{color:var(--uix-text)}.uix-step[data-state=done] .uix-step__marker{background:var(--uix-accent);border-color:var(--uix-accent);color:var(--uix-accent-fg)}.uix-step[data-state=done]+.uix-step__connector,.uix-step__connector[data-done]{background:var(--uix-accent)}}@layer uix.components{.uix-cmdk{width:min(560px,92vw);border:1px solid var(--uix-border);border-radius:var(--uix-radius-lg);background:var(--uix-surface-2);box-shadow:var(--uix-shadow-overlay);overflow:hidden}.uix-cmdk__input{width:100%;height:48px;border:0;border-bottom:1px solid var(--uix-border);background:transparent;color:var(--uix-text);font:inherit;font-size:var(--uix-text-h3);padding:0 var(--uix-space-4)}.uix-cmdk__input:focus{outline:none}.uix-cmdk__list{max-height:320px;overflow-y:auto;padding:var(--uix-space-2)}.uix-cmdk__group{font-size:var(--uix-text-eyebrow);letter-spacing:var(--uix-tracking-eyebrow);text-transform:uppercase;color:var(--uix-text-muted);padding:var(--uix-space-2) var(--uix-space-3) var(--uix-space-1)}.uix-cmdk__item{display:flex;align-items:center;gap:var(--uix-space-3);padding:var(--uix-space-3) var(--uix-space-3);border-radius:var(--uix-radius-sm);color:var(--uix-text);cursor:pointer;font-size:var(--uix-text-body)}.uix-cmdk__item svg{width:var(--uix-icon-md);height:var(--uix-icon-md);color:var(--uix-text-muted)}.uix-cmdk__item:hover,.uix-cmdk__item[data-active]{background:var(--uix-bg-hover)}.uix-cmdk__item .uix-kbd{margin-left:auto}dialog[data-uix-cmdk-dialog],dialog[data-uix-cmdk-dialog]::backdrop{transition:none}}@layer uix.components{.uix-menu{min-width:200px;margin:0;padding:var(--uix-space-1);list-style:none;background:var(--uix-surface-2);border:1px solid var(--uix-border);border-radius:var(--uix-radius-md);box-shadow:var(--uix-shadow-popover)}.uix-menu__item{display:flex;align-items:center;gap:var(--uix-space-3);width:100%;text-align:left;padding:var(--uix-space-2) var(--uix-space-3);border:0;background:transparent;border-radius:var(--uix-radius-sm);color:var(--uix-text);font:inherit;font-size:var(--uix-text-body);cursor:pointer}.uix-menu__item svg{width:var(--uix-icon-md);height:var(--uix-icon-md);color:var(--uix-text-muted)}.uix-menu__item:hover,.uix-menu__item[data-active]{background:var(--uix-bg-hover)}.uix-menu__item--danger{color:var(--uix-danger-text)}.uix-menu__item--danger svg{color:var(--uix-danger-text)}.uix-menu__item .uix-kbd{margin-left:auto}.uix-menu__sep{height:1px;background:var(--uix-border);margin:var(--uix-space-1) 0}.uix-menu__label{font-size:var(--uix-text-eyebrow);letter-spacing:var(--uix-tracking-eyebrow);text-transform:uppercase;color:var(--uix-text-muted);padding:var(--uix-space-2) var(--uix-space-3) var(--uix-space-1)}}@layer uix.components{.uix-page-header{display:flex;align-items:flex-start;gap:var(--uix-space-5);flex-wrap:wrap;padding-bottom:var(--uix-space-6);margin-bottom:var(--uix-space-7);border-bottom:1px solid var(--uix-border)}.uix-page-header__titles{flex:1;min-width:220px}.uix-page-header__eyebrow{font-size:var(--uix-text-eyebrow);letter-spacing:var(--uix-tracking-eyebrow);text-transform:uppercase;font-weight:600;color:var(--uix-text-muted);margin-bottom:var(--uix-space-2)}.uix-page-header__title{font-size:var(--uix-text-h2);font-weight:600;letter-spacing:var(--uix-tracking-tight)}.uix-page-header__subtitle{color:var(--uix-text-muted);font-size:var(--uix-text-meta);margin-top:var(--uix-space-2);max-width:70ch}.uix-page-header__actions{display:flex;gap:var(--uix-space-2);align-items:center;flex-wrap:wrap}}@layer uix.components{.uix-kbd{display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;padding:0 var(--uix-space-2);font-family:var(--uix-font-mono);font-size:var(--uix-text-eyebrow);color:var(--uix-text-muted);background:var(--uix-bg-subtle);border:1px solid var(--uix-border);border-bottom-width:2px;border-radius:var(--uix-radius-xs)}}@layer uix.components{.uix-card{background:var(--uix-surface);border:1px solid var(--uix-border);border-radius:var(--uix-radius-lg);box-shadow:var(--uix-shadow-sm)}.uix-card__header{padding:var(--uix-space-5) var(--uix-space-6);border-bottom:1px solid var(--uix-border);display:flex;align-items:center;gap:var(--uix-space-3)}.uix-card__title{font-size:var(--uix-text-h3);font-weight:600}.uix-card__subtitle{font-size:var(--uix-text-meta);color:var(--uix-text-muted);margin-top:var(--uix-space-1)}.uix-card__body{padding:var(--uix-space-6)}.uix-card__footer{padding:var(--uix-space-4) var(--uix-space-6);border-top:1px solid var(--uix-border);display:flex;gap:var(--uix-space-2);justify-content:flex-end}}@layer uix.components{.uix-stat{background:var(--uix-surface);border:1px solid var(--uix-border);border-radius:var(--uix-radius-lg);padding:var(--uix-space-6)}.uix-stat__label{font-size:var(--uix-text-eyebrow);letter-spacing:var(--uix-tracking-eyebrow);text-transform:uppercase;color:var(--uix-text-muted);display:flex;align-items:center;justify-content:space-between;gap:var(--uix-space-2)}.uix-stat__label svg{width:var(--uix-icon-md);height:var(--uix-icon-md)}.uix-stat__value{font-size:var(--uix-text-data-hero);font-weight:600;line-height:var(--uix-leading-data-hero);margin-top:var(--uix-space-3)}.uix-stat__meta{font-size:var(--uix-text-meta);color:var(--uix-text-muted);margin-top:var(--uix-space-2);display:flex;align-items:center;gap:var(--uix-space-2)}.uix-stat__trend{display:inline-flex;align-items:center;gap:var(--uix-space-1);font-size:var(--uix-text-meta);font-weight:600;padding:var(--uix-space-1) var(--uix-space-2);border-radius:var(--uix-radius-pill)}.uix-stat__trend--up{color:var(--uix-success);background:var(--uix-success-bg)}.uix-stat__trend--down{color:var(--uix-danger-text);background:var(--uix-danger-bg)}}@layer uix.components{.uix-pill{display:inline-flex;align-items:center;gap:var(--uix-space-2);padding:var(--uix-space-1) var(--uix-space-3);border-radius:var(--uix-radius-pill);font-size:var(--uix-text-meta);font-weight:500;line-height:1.4;background:var(--tone-bg, var(--uix-bg-active));color:var(--tone-fg, var(--uix-text-hushed))}.uix-pill__dot{width:7px;height:7px;border-radius:50%;background:var(--tone-dot, currentColor);flex:none}.uix-pill--neutral{--tone-bg: var(--uix-bg-active);--tone-fg: var(--uix-text-hushed);--tone-dot: var(--uix-text-muted)}.uix-pill--success{--tone-bg: var(--uix-success-bg);--tone-fg: var(--uix-success);--tone-dot: var(--uix-success)}.uix-pill--info{--tone-bg: var(--uix-info-bg);--tone-fg: var(--uix-info-text);--tone-dot: var(--uix-info)}.uix-pill--warning{--tone-bg: var(--uix-warning-bg);--tone-fg: var(--uix-warning-text);--tone-dot: var(--uix-warning)}.uix-pill--danger{--tone-bg: var(--uix-danger-bg);--tone-fg: var(--uix-danger-text);--tone-dot: var(--uix-danger)}.uix-pill--critical{--tone-bg: var(--uix-danger);--tone-fg: var(--uix-danger-fg);--tone-dot: var(--uix-danger-fg)}.uix-pill--muted{--tone-bg: transparent;--tone-fg: var(--uix-text-muted);--tone-dot: var(--uix-text-muted)}.uix-pill--attention{--tone-bg: var(--uix-attention-bg);--tone-fg: var(--uix-attention-text);--tone-dot: var(--uix-attention)}.uix-pill--overdue{--tone-bg: var(--uix-overdue-bg);--tone-fg: var(--uix-overdue-text);--tone-dot: var(--uix-overdue)}.uix-pill--sla-ok{--tone-bg: var(--uix-success-bg);--tone-fg: var(--uix-success);--tone-dot: var(--uix-success)}.uix-pill--sla-at-risk{--tone-bg: var(--uix-attention-bg);--tone-fg: var(--uix-attention-text);--tone-dot: var(--uix-attention)}.uix-pill--sla-breached{--tone-bg: var(--uix-overdue-bg);--tone-fg: var(--uix-overdue-text);--tone-dot: var(--uix-overdue)}.uix-pill--p1{--tone-bg: var(--uix-danger-bg);--tone-fg: var(--uix-danger-text);--tone-dot: var(--uix-danger)}.uix-pill--p2{--tone-bg: var(--uix-warning-bg);--tone-fg: var(--uix-warning-text);--tone-dot: var(--uix-warning)}.uix-pill--p3{--tone-bg: var(--uix-amber-bg);--tone-fg: var(--uix-amber-text);--tone-dot: var(--uix-amber)}.uix-pill--p4{--tone-bg: var(--uix-info-bg);--tone-fg: var(--uix-info-text);--tone-dot: var(--uix-info)}.uix-pill--p5{--tone-bg: var(--uix-bg-active);--tone-fg: var(--uix-text-hushed);--tone-dot: var(--uix-text-muted)}.uix-pill--outline{background:transparent;border:1px solid var(--tone-line, color-mix(in srgb, var(--tone-fg) 40%, transparent))}.uix-pill--outline.uix-pill--neutral{--tone-line: var(--uix-border-strong)}.uix-pill--outline.uix-pill--muted{--tone-line: var(--uix-border)}.uix-pill--outline.uix-pill--critical{color:var(--uix-danger-text);--tone-dot: var(--uix-danger);--tone-line: color-mix(in srgb, var(--uix-danger) 60%, transparent)}}@layer uix.components{.uix-table-wrap{overflow:auto;max-height:460px;border:1px solid var(--uix-border);border-radius:var(--uix-radius-lg);background:var(--uix-surface)}.uix-table{width:100%;border-collapse:separate;border-spacing:0;font-size:var(--uix-text-body)}.uix-table thead th{position:sticky;top:0;z-index:var(--uix-z-raised);background:var(--uix-surface);text-align:left;font-size:var(--uix-text-meta);font-weight:600;color:var(--uix-text-hushed);padding:0 var(--uix-space-4);height:44px;border-bottom:1px solid var(--uix-border);white-space:nowrap}.uix-table th[data-sort]{cursor:pointer;user-select:none}.uix-table th[data-sort]:hover{color:var(--uix-text)}.uix-table th[data-sort]:after{content:" \2195";opacity:.35}.uix-table th[aria-sort=ascending]:after{content:" \2191";opacity:1;color:var(--uix-accent)}.uix-table th[aria-sort=descending]:after{content:" \2193";opacity:1;color:var(--uix-accent)}.uix-table th[data-sort-order]:before{content:attr(data-sort-order);display:inline-block;margin-right:var(--uix-space-1);font-size:var(--uix-text-eyebrow);font-variant-numeric:tabular-nums;color:var(--uix-accent)}.uix-table td{padding:0 var(--uix-space-4);height:var(--uix-row-h);border-bottom:1px solid var(--uix-border);color:var(--uix-text);vertical-align:middle}.uix-table tbody tr{background:var(--uix-row)}.uix-table tbody tr:nth-child(2n){background:var(--uix-row-alt)}.uix-table--no-zebra tbody tr,.uix-table--no-zebra tbody tr:nth-child(2n){background:var(--uix-row)}.uix-table tbody tr[data-pinned]{background:var(--uix-row-pinned-bg)}.uix-table tbody tr[aria-selected=true]{background:var(--uix-row-selected-bg)}.uix-table tbody tr:hover{background:var(--uix-bg-hover)}.uix-table[data-density=compact] td,.uix-table--compact td{height:var(--uix-row-h-compact)}.uix-table[data-density=comfortable] td{height:var(--uix-row-h-comfortable)}.uix-table__pin{border:0;background:transparent;color:var(--uix-text-muted);cursor:pointer;padding:var(--uix-space-1);border-radius:var(--uix-radius-xs);opacity:0;transition:opacity var(--uix-dur-fast) var(--uix-ease-out)}.uix-table tbody tr:hover .uix-table__pin,.uix-table__pin[data-on]{opacity:1}.uix-table__pin:hover{background:var(--uix-bg-active);color:var(--uix-text)}.uix-table__pin[data-on]{color:var(--uix-accent)}.uix-table__pin svg{width:15px;height:15px}.uix-table__pin[data-on] svg{fill:currentColor}.uix-table--pinned-col th:first-child,.uix-table--pinned-col td:first-child{position:sticky;left:0;z-index:var(--uix-z-raised);box-shadow:1px 0 0 var(--uix-border)}.uix-table--pinned-col thead th:first-child{z-index:var(--uix-z-sticky);background:var(--uix-surface)}.uix-table--pinned-col tbody tr td:first-child{background:var(--uix-row)}.uix-table--pinned-col tbody tr:nth-child(2n) td:first-child{background:var(--uix-row-alt)}.uix-table--pinned-col.uix-table--no-zebra tbody tr td:first-child,.uix-table--pinned-col.uix-table--no-zebra tbody tr:nth-child(2n) td:first-child{background:var(--uix-row)}.uix-table--pinned-col tbody tr[data-pinned] td:first-child{background:var(--uix-row-pinned-bg)}.uix-table--pinned-col tbody tr[aria-selected=true] td:first-child{background:var(--uix-row-selected-bg)}.uix-table--pinned-col tbody tr:hover td:first-child{background:var(--uix-bg-hover)}.uix-table--fixed{table-layout:fixed;width:100%}.uix-col--w-xs{width:var(--uix-col-w-xs)}.uix-col--w-sm{width:var(--uix-col-w-sm)}.uix-col--w-md{width:var(--uix-col-w-md)}.uix-col--w-lg{width:var(--uix-col-w-lg)}.uix-col--w-xl{width:var(--uix-col-w-xl)}.uix-col--flex,.uix-col--primary{width:auto;min-width:var(--uix-col-title-min)}.uix-col--truncate{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.uix-col--wrap{white-space:normal;overflow-wrap:anywhere}.uix-col--num{font-variant-numeric:tabular-nums}.uix-table th.uix-col--num,.uix-table td.uix-col--num{text-align:right}.uix-cell-strong{font-weight:600}.uix-cell-sub{display:block;font-size:var(--uix-text-meta);color:var(--uix-text-muted)}.uix-cell-mono{font-family:var(--uix-font-mono);font-size:var(--uix-text-meta)}.uix-id-cell__btn{border:0;background:transparent;cursor:pointer;padding:0;color:var(--uix-text);font:inherit;display:inline-flex;align-items:center;gap:var(--uix-space-1);white-space:nowrap}.uix-id-cell__btn:hover{color:var(--uix-accent)}.uix-id-cell__btn:focus-visible{outline:2px solid var(--uix-ring);outline-offset:2px;border-radius:var(--uix-radius-xs)}.uix-id-cell__arrow{width:var(--uix-icon-sm);height:var(--uix-icon-sm);flex-shrink:0;color:var(--uix-text-muted);opacity:0;transition:opacity var(--uix-dur-fast) var(--uix-ease-out)}.uix-table tbody tr:hover .uix-id-cell__arrow{opacity:1}.uix-table th.uix-table__selcol,.uix-table td.uix-table__selcell{width:44px;padding-left:var(--uix-space-3);padding-right:0;text-align:center}.uix-bulkbar{display:flex;align-items:center;gap:var(--uix-space-3);padding:var(--uix-space-2) var(--uix-space-3);margin-bottom:var(--uix-space-3);border:1px solid var(--uix-accent);border-radius:var(--uix-radius-md);background:var(--uix-brand-muted);color:var(--uix-text);animation:uix-bulkbar-in var(--uix-dur) var(--uix-ease-out)}.uix-bulkbar[hidden]{display:none}.uix-bulkbar__count{font-size:var(--uix-text-meta);font-weight:600;color:var(--uix-accent);font-variant-numeric:tabular-nums}.uix-bulkbar__spacer{flex:1}@keyframes uix-bulkbar-in{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}@media(prefers-reduced-motion:reduce){.uix-bulkbar{animation:none}}.uix-table__actions{width:84px;text-align:right;white-space:nowrap}.uix-rowact{border:0;background:transparent;color:var(--uix-text-muted);cursor:pointer;padding:var(--uix-space-1);border-radius:var(--uix-radius-sm);opacity:0;transition:opacity var(--uix-dur-fast) var(--uix-ease-out),background-color var(--uix-dur-fast) var(--uix-ease-out)}.uix-rowact svg{width:16px;height:16px;display:block}.uix-table tbody tr:hover .uix-rowact,.uix-rowact:focus-visible,.uix-rowact[aria-expanded=true]{opacity:1}.uix-rowact:hover{background:var(--uix-bg-active);color:var(--uix-text)}.uix-table__expand{border:0;background:transparent;cursor:pointer;color:var(--uix-text-muted);padding:var(--uix-space-1);border-radius:var(--uix-radius-xs);display:inline-grid;place-items:center}.uix-table__expand svg{width:16px;height:16px;transition:transform var(--uix-dur-fast) var(--uix-ease-out)}.uix-table__expand[aria-expanded=true] svg{transform:rotate(90deg)}.uix-table__expand:hover{background:var(--uix-bg-active);color:var(--uix-text)}tr.uix-table__detail>td{background:var(--uix-bg-subtle);padding:0 var(--uix-space-4)}.uix-table__detail-inner{padding:var(--uix-space-4) var(--uix-space-1) var(--uix-space-5);display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:var(--uix-space-4) var(--uix-space-7)}.uix-kv{font-size:var(--uix-text-meta)}.uix-kv__k{color:var(--uix-text-muted);margin-bottom:var(--uix-space-1)}.uix-kv__v{color:var(--uix-text)}@media(prefers-reduced-motion:reduce){.uix-table__expand svg{transition:none}}.uix-cell-edit{display:inline-flex;align-items:center;gap:var(--uix-space-2);cursor:text;border-radius:var(--uix-radius-sm);padding:var(--uix-space-1) var(--uix-space-2);margin:calc(-1 * var(--uix-space-1)) calc(-1 * var(--uix-space-2));transition:background-color var(--uix-dur-fast) var(--uix-ease-out),box-shadow var(--uix-dur-fast) var(--uix-ease-out)}.uix-cell-edit:hover{background:var(--uix-bg-active)}.uix-cell-edit__pencil{width:13px;height:13px;color:var(--uix-text-muted);opacity:0;transition:opacity var(--uix-dur-fast) var(--uix-ease-out)}.uix-table tbody tr:hover .uix-cell-edit__pencil{opacity:1}.uix-cell-edit[data-editing]{background:var(--uix-surface);box-shadow:0 0 0 2px var(--uix-ring);cursor:default}.uix-cell-edit__ok{color:var(--uix-success);width:14px;height:14px;opacity:0;transition:opacity var(--uix-dur-fast) var(--uix-ease-out)}.uix-cell-edit[data-saved] .uix-cell-edit__ok{opacity:1}.uix-cell-edit input,.uix-cell-edit select{border:0;background:transparent;font:inherit;color:inherit;outline:none}.uix-table__resize{position:absolute;top:0;right:-3px;width:8px;height:100%;cursor:col-resize;z-index:var(--uix-z-raised);user-select:none;touch-action:none}.uix-table__resize:after{content:"";position:absolute;top:25%;right:3px;width:2px;height:50%;background:transparent;border-radius:var(--uix-radius-pill);transition:background-color var(--uix-dur-fast) var(--uix-ease-out)}.uix-table thead th:hover .uix-table__resize:after,.uix-table__resize[data-drag]:after{background:var(--uix-accent)}.uix-mark{background:var(--uix-warning-bg);color:var(--uix-text);border-radius:var(--uix-radius-xs);padding:0 .15em;box-shadow:inset 0 -1px color-mix(in srgb,var(--uix-warning) 60%,transparent)}.uix-table--priority th[data-priority=low],.uix-table--priority td[data-priority=low],.uix-table--priority-mid th[data-priority=low],.uix-table--priority-mid td[data-priority=low],.uix-table--priority-mid th[data-priority=mid],.uix-table--priority-mid td[data-priority=mid]{display:none}.uix-table--cards{display:block}.uix-table--cards thead{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}.uix-table--cards tbody,.uix-table--cards tr,.uix-table--cards td{display:block;width:auto}.uix-table--cards tbody tr{border:1px solid var(--uix-border);border-radius:var(--uix-radius-md);background:var(--uix-surface);margin:0 0 var(--uix-space-3);padding:var(--uix-space-1) var(--uix-space-4);box-shadow:var(--uix-shadow-sm)}.uix-table--cards tbody tr[aria-selected=true]{box-shadow:0 0 0 2px var(--uix-accent)}.uix-table--cards td{height:auto;display:flex;justify-content:space-between;align-items:center;gap:var(--uix-space-5);padding:var(--uix-space-2) 0;border-bottom:1px solid var(--uix-border);text-align:right;white-space:normal}.uix-table--cards td:last-child{border-bottom:0}.uix-table--cards td:before{content:attr(data-label);color:var(--uix-text-muted);font-size:var(--uix-text-meta);font-weight:500;text-align:left;flex:none}.uix-table--cards td[data-col=id]{font-size:var(--uix-text-h3);font-weight:600;border-bottom:1px solid var(--uix-border);padding-bottom:var(--uix-space-3)}.uix-table--cards td[data-col=id]:before{display:none}.uix-table--cards td[data-col=select],.uix-table--cards td[data-col=actions],.uix-table--cards td[data-col=expand]{display:none}.uix-compare{border:1px solid var(--uix-border);border-radius:var(--uix-radius-lg);overflow:hidden;font-size:var(--uix-text-meta)}.uix-compare__head,.uix-compare__row{display:grid;grid-template-columns:1fr 1fr}.uix-compare__head>div,.uix-compare__cell{padding:var(--uix-space-3);background:var(--uix-surface);border-top:1px solid var(--uix-border)}.uix-compare__head>div{font-weight:600;border-top:0}.uix-compare__head>div+div,.uix-compare__cell+.uix-compare__cell{border-left:1px solid var(--uix-border)}.uix-compare__attr{grid-column:1 / -1;background:var(--uix-bg-subtle);padding:var(--uix-space-1) var(--uix-space-3);border-top:1px solid var(--uix-border);font-size:var(--uix-text-eyebrow);letter-spacing:var(--uix-tracking-eyebrow);text-transform:uppercase;color:var(--uix-text-muted)}}@layer uix.components{.uix-toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:var(--uix-space-2);margin-bottom:var(--uix-space-3)}.uix-toolbar__spacer{flex:1}.uix-filterbar{display:flex;flex-wrap:wrap;gap:var(--uix-space-2) var(--uix-space-5);margin-bottom:var(--uix-space-3)}.uix-filterrow{display:flex;flex-wrap:wrap;align-items:center;gap:var(--uix-space-2)}.uix-filterrow__label{font-size:var(--uix-text-meta);color:var(--uix-text-muted);width:54px;flex:none}.uix-chip{display:inline-flex;align-items:center;gap:var(--uix-space-2);padding:var(--uix-space-1) var(--uix-space-3);border-radius:var(--uix-radius-pill);border:1px solid var(--uix-border);background:var(--uix-surface);color:var(--uix-text-hushed);font:inherit;font-size:var(--uix-text-meta);cursor:pointer;transition:background-color var(--uix-dur-fast) var(--uix-ease-out),border-color var(--uix-dur-fast) var(--uix-ease-out),color var(--uix-dur-fast) var(--uix-ease-out)}.uix-chip:hover{border-color:var(--uix-border-strong);color:var(--uix-text)}.uix-chip[data-on]{background:var(--uix-brand-muted);border-color:var(--uix-accent);color:var(--uix-accent)}.uix-chip__count{font-variant-numeric:tabular-nums;opacity:.7}}@layer uix.components{.uix-view-menu{min-width:248px;padding:var(--uix-space-2)}.uix-view-menu__group{padding:var(--uix-space-2) var(--uix-space-2)}.uix-view-menu__group+.uix-view-menu__group{border-top:1px solid var(--uix-border)}.uix-view-menu__label{font-size:var(--uix-text-eyebrow);letter-spacing:var(--uix-tracking-eyebrow);text-transform:uppercase;color:var(--uix-text-muted);margin-bottom:var(--uix-space-2)}.uix-view-menu__row{display:flex;align-items:center;justify-content:space-between;gap:var(--uix-space-3);font-size:var(--uix-text-body);color:var(--uix-text);cursor:pointer}.uix-view-menu__row+.uix-view-menu__row{margin-top:var(--uix-space-3)}.uix-view-menu .uix-segmented{display:flex;width:100%}.uix-view-menu .uix-segmented__option{flex:1;text-align:center}.uix-view-menu__cols{display:flex;flex-direction:column;gap:var(--uix-space-1);max-height:180px;overflow:auto}.uix-view-menu__cols .uix-menu__item{font-size:var(--uix-text-meta)}}@layer uix.components{.uix-list{display:flex;flex-direction:column;border:1px solid var(--uix-border);border-radius:var(--uix-radius-lg);overflow:hidden;background:var(--uix-surface)}.uix-list__item{display:flex;align-items:center;gap:var(--uix-space-3);padding:var(--uix-space-4) var(--uix-space-5);border-bottom:1px solid var(--uix-border)}.uix-list__item:last-child{border-bottom:0}.uix-list__item:hover{background:var(--uix-bg-hover)}.uix-list__title{font-weight:500}.uix-list__meta{font-size:var(--uix-text-meta);color:var(--uix-text-muted)}.uix-list__trail{margin-left:auto;display:flex;align-items:center;gap:var(--uix-space-2)}}@layer uix.components{.uix-dl{display:grid;grid-template-columns:max-content 1fr;gap:var(--uix-space-3) var(--uix-space-6)}.uix-dl dt{color:var(--uix-text-muted);font-size:var(--uix-text-meta)}.uix-dl dd{color:var(--uix-text);font-size:var(--uix-text-body);margin:0}}@layer uix.components{.uix-text-display,.uix-text-h1{font-size:var(--uix-text-display);line-height:var(--uix-leading-display);font-weight:400;letter-spacing:var(--uix-tracking-tight);color:var(--uix-text)}.uix-text-h2{font-size:var(--uix-text-h2);line-height:var(--uix-leading-h2);font-weight:400;letter-spacing:-.01em;color:var(--uix-text)}.uix-text-h3{font-size:var(--uix-text-h3);line-height:var(--uix-leading-h3);font-weight:700;color:var(--uix-text)}.uix-text-body{font-size:var(--uix-text-body);line-height:var(--uix-leading-body);font-weight:400;color:var(--uix-text)}.uix-text-body-hushed{font-size:var(--uix-text-body);line-height:var(--uix-leading-body);font-weight:400;color:var(--uix-text-hushed)}.uix-text-meta{font-size:var(--uix-text-meta);line-height:var(--uix-leading-meta);font-weight:400;color:var(--uix-text-hushed)}.uix-text-eyebrow{font-size:var(--uix-text-eyebrow);line-height:var(--uix-leading-eyebrow);font-weight:700;letter-spacing:var(--uix-tracking-eyebrow);text-transform:uppercase;color:var(--uix-text-hushed)}.uix-text-data-hero{font-size:var(--uix-text-data-hero);line-height:1.1;font-weight:400;letter-spacing:-.01em;color:var(--uix-text);font-variant-numeric:tabular-nums}}@layer uix.components{.uix-avatar{width:32px;height:32px;flex:none;border-radius:50%;background:var(--uix-bg-active);color:var(--uix-text);display:inline-flex;align-items:center;justify-content:center;font-size:var(--uix-text-meta);font-weight:600;line-height:1;overflow:hidden;position:relative}.uix-avatar img{width:100%;height:100%;object-fit:cover}.uix-avatar--sm{width:24px;height:24px;font-size:var(--uix-text-eyebrow)}.uix-avatar--lg{width:44px;height:44px}.uix-avatar__status{position:absolute;right:-1px;bottom:-1px;width:10px;height:10px;border-radius:50%;border:2px solid var(--uix-surface);background:var(--uix-success)}.uix-avatar-group{display:inline-flex}.uix-avatar-group .uix-avatar{box-shadow:0 0 0 2px var(--uix-surface);margin-left:calc(-1 * var(--uix-space-2))}.uix-avatar-group .uix-avatar:first-child{margin-left:0}.uix-user-chip{display:inline-flex;align-items:center;gap:var(--uix-space-2)}.uix-user-chip__name{font-size:var(--uix-text-body);font-weight:500}.uix-user-chip__sub{font-size:var(--uix-text-meta);color:var(--uix-text-muted)}.uix-avatar--editable{cursor:pointer}.uix-avatar__edit{position:absolute;inset:0;display:grid;place-items:center;background:var(--uix-scrim);color:var(--uix-text-reverse);opacity:0;transition:opacity var(--uix-dur-fast) var(--uix-ease-out)}.uix-avatar__edit svg{width:45%;height:45%}.uix-avatar--editable:hover .uix-avatar__edit,.uix-avatar--editable:focus-visible .uix-avatar__edit{opacity:1}.uix-avatar--empty{background:var(--uix-bg-subtle);border:1.5px dashed var(--uix-border-strong);color:var(--uix-text-muted)}}@layer uix.components{.uix-tooltip{display:inline-flex}.uix-tooltip__bubble{position:fixed;margin:0;inset:auto;border:0;width:max-content;max-width:16rem;background:var(--uix-text);color:var(--uix-bg-app);font-size:var(--uix-text-meta);font-weight:500;line-height:1.4;padding:var(--uix-space-2) var(--uix-space-3);border-radius:var(--uix-radius-sm);box-shadow:var(--uix-shadow-popover);white-space:normal;pointer-events:none;opacity:0;transition:opacity var(--uix-dur-fast) var(--uix-ease-out)}.uix-tooltip__bubble:popover-open{opacity:1}@starting-style{.uix-tooltip__bubble:popover-open{opacity:0}}[data-uix-tip]{position:relative}[data-uix-tip]:after{content:attr(data-uix-tip);position:absolute;bottom:calc(100% + 6px);left:50%;transform:translate(-50%) translateY(var(--uix-lift));background:var(--uix-text);color:var(--uix-bg-app);font-size:var(--uix-text-meta);font-weight:500;padding:var(--uix-space-2) var(--uix-space-3);border-radius:var(--uix-radius-sm);white-space:nowrap;box-shadow:var(--uix-shadow-popover);opacity:0;pointer-events:none;z-index:var(--uix-z-tooltip);transition:opacity var(--uix-dur-fast) var(--uix-ease-out),transform var(--uix-dur-fast) var(--uix-ease-out)}[data-uix-tip]:hover:after,[data-uix-tip]:focus-visible:after{opacity:1;transform:translate(-50%) translateY(0)}.uix-has-js-tip [data-uix-tip]:after{content:none}}@layer uix.components{.uix-progress{height:8px;background:var(--uix-bg-active);border-radius:var(--uix-radius-pill);overflow:hidden}.uix-progress__bar{height:100%;background:var(--uix-accent);border-radius:inherit;transition:width var(--uix-dur) var(--uix-ease-out)}.uix-progress--indeterminate{position:relative}.uix-progress--indeterminate .uix-progress__bar{width:40%;animation:uix-progress-slide 1.2s var(--uix-ease-in-out) infinite}@keyframes uix-progress-slide{0%{transform:translate(-110%)}to{transform:translate(280%)}}.uix-ring{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:conic-gradient(var(--uix-accent) calc(var(--val, .66) * 360deg),var(--uix-bg-active) 0)}.uix-ring__inner{width:32px;height:32px;border-radius:50%;background:var(--uix-surface);display:grid;place-items:center;font-size:var(--uix-text-meta);font-weight:600}}@layer uix.components{.uix-meter{height:8px;background:var(--uix-bg-active);border-radius:var(--uix-radius-pill);overflow:hidden}.uix-meter__fill{height:100%;border-radius:inherit;background:var(--uix-success);transition:width var(--uix-dur) var(--uix-ease-out)}.uix-meter__fill[data-tone=warning]{background:var(--uix-warning)}.uix-meter__fill[data-tone=danger]{background:var(--uix-danger)}.uix-meter__fill[data-tone=attention]{background:var(--uix-attention)}.uix-meter__fill[data-tone=overdue]{background:var(--uix-overdue)}}@layer uix.components{.uix-timeline{display:flex;flex-direction:column}.uix-timeline__item{display:grid;grid-template-columns:24px 1fr;gap:var(--uix-space-3)}.uix-timeline__rail{display:flex;flex-direction:column;align-items:center}.uix-timeline__node{width:12px;height:12px;border-radius:50%;background:var(--uix-accent);margin-top:var(--uix-space-1);flex:none;box-shadow:0 0 0 3px var(--uix-brand-muted)}.uix-timeline__line{width:1px;flex:1;background:var(--uix-border);margin:var(--uix-space-1) 0}.uix-timeline__item:last-child .uix-timeline__line{display:none}.uix-timeline__body{padding-bottom:var(--uix-space-5)}.uix-timeline__meta{font-size:var(--uix-text-meta);color:var(--uix-text-muted)}}@layer uix.components{.uix-tree,.uix-tree ul{list-style:none;margin:0;padding:0}.uix-tree__group{padding-left:var(--uix-space-5)}.uix-tree__item{outline:none}.uix-tree__row{display:flex;align-items:center;gap:var(--uix-space-2);padding:var(--uix-space-2) var(--uix-space-2);border-radius:var(--uix-radius-sm);cursor:pointer;color:var(--uix-text);font-size:var(--uix-text-body)}.uix-tree__label{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.uix-tree__item>.uix-tree__row:hover{background:var(--uix-bg-hover)}.uix-tree__item[aria-selected=true]>.uix-tree__row{background:var(--uix-bg-active)}.uix-tree__item:focus-visible>.uix-tree__row{outline:2px solid var(--uix-ring);outline-offset:-2px}.uix-tree__toggle{width:16px;height:16px;flex:none;display:grid;place-items:center;color:var(--uix-text-muted);transition:transform var(--uix-dur) var(--uix-ease-out)}.uix-tree__toggle svg{width:14px;height:14px}.uix-tree__item[aria-expanded=false]>.uix-tree__row .uix-tree__toggle{transform:rotate(-90deg)}.uix-tree__item[aria-expanded=false]>.uix-tree__group{display:none}}@layer uix.components{.uix-calendar{width:280px;border:1px solid var(--uix-border);border-radius:var(--uix-radius-lg);background:var(--uix-surface);padding:var(--uix-space-3)}.uix-calendar__head{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--uix-space-2);font-weight:600;font-size:var(--uix-text-body)}.uix-calendar__grid{display:grid;grid-template-columns:repeat(7,1fr);gap:var(--uix-space-1)}.uix-calendar__dow{text-align:center;font-size:var(--uix-text-eyebrow);color:var(--uix-text-muted);padding:var(--uix-space-1) 0}.uix-calendar__day{aspect-ratio:1;display:grid;place-items:center;border-radius:var(--uix-radius-sm);font-size:var(--uix-text-meta);color:var(--uix-text);cursor:pointer;border:0;background:transparent}.uix-calendar__day:hover{background:var(--uix-bg-hover)}.uix-calendar__day[data-muted]{color:var(--uix-text-muted);opacity:.45}.uix-calendar__day[data-today]{box-shadow:inset 0 0 0 1px var(--uix-border-strong)}.uix-calendar__day[data-range]{background:var(--uix-brand-muted);border-radius:0}.uix-calendar__day[aria-selected=true]{background:var(--uix-accent);color:var(--uix-accent-fg)}}@layer uix.components{.uix-empty{display:flex;flex-direction:column;align-items:center;gap:var(--uix-space-3);text-align:center;padding:var(--uix-space-8);color:var(--uix-text-muted)}.uix-empty__icon{width:44px;height:44px;display:grid;place-items:center;border-radius:50%;background:var(--uix-bg-subtle);color:var(--uix-text-muted)}.uix-empty__icon svg{width:22px;height:22px}.uix-empty__title{font-size:var(--uix-text-h3);font-weight:600;color:var(--uix-text)}.uix-empty__icon--danger{background:var(--uix-danger-bg);color:var(--uix-danger)}.uix-skeleton{background:linear-gradient(90deg,var(--uix-bg-subtle) 25%,var(--uix-bg-hover) 50%,var(--uix-bg-subtle) 75%);background-size:200% 100%;animation:uix-shimmer 1.4s linear infinite;border-radius:var(--uix-radius-sm)}.uix-skeleton--text{height:12px;border-radius:var(--uix-radius-pill)}.uix-skeleton--circle{border-radius:50%}}@layer uix.components{.uix-chart{background:var(--uix-surface);border:1px solid var(--uix-border);border-radius:var(--uix-radius-lg);padding:var(--uix-space-5)}.uix-chart__title{font-size:var(--uix-text-h3);font-weight:600}.uix-chart__subtitle{font-size:var(--uix-text-meta);color:var(--uix-text-muted);margin-bottom:var(--uix-space-4)}.uix-legend{display:flex;flex-wrap:wrap;gap:var(--uix-space-3);margin-top:var(--uix-space-3)}.uix-legend__item{display:inline-flex;align-items:center;gap:var(--uix-space-2);font-size:var(--uix-text-meta);color:var(--uix-text-hushed)}.uix-legend__swatch{width:10px;height:10px;border-radius:var(--uix-radius-xs);flex:none}}@layer uix.components{.uix-alert{display:flex;gap:var(--uix-space-3);padding:var(--uix-space-3) var(--uix-space-4);border-radius:var(--uix-radius-md);border:1px solid var(--tone-border, var(--uix-border));background:var(--tone-bg, var(--uix-bg-subtle));color:var(--uix-text);font-size:var(--uix-text-body)}.uix-alert__icon{color:var(--tone-fg, var(--uix-text));flex:none}.uix-alert__icon svg{width:var(--uix-icon-md);height:var(--uix-icon-md)}.uix-alert__title{font-weight:600;margin-bottom:var(--uix-space-1)}.uix-alert__body{font-size:var(--uix-text-meta);color:var(--uix-text-hushed)}.uix-alert--info{--tone-bg: var(--uix-info-bg);--tone-border: color-mix(in srgb, var(--uix-info) 30%, transparent);--tone-fg: var(--uix-info-text)}.uix-alert--success{--tone-bg: var(--uix-success-bg);--tone-border: color-mix(in srgb, var(--uix-success) 30%, transparent);--tone-fg: var(--uix-success)}.uix-alert--warning{--tone-bg: var(--uix-warning-bg);--tone-border: color-mix(in srgb, var(--uix-warning) 40%, transparent);--tone-fg: var(--uix-warning)}.uix-alert--danger{--tone-bg: var(--uix-danger-bg);--tone-border: color-mix(in srgb, var(--uix-danger) 30%, transparent);--tone-fg: var(--uix-danger-text)}}@layer uix.components{.uix-toaster{position:fixed;bottom:16px;right:16px;z-index:var(--uix-z-toast);display:flex;flex-direction:column;gap:var(--uix-space-2);width:340px;max-width:calc(100vw - 32px)}.uix-toast{display:flex;gap:var(--uix-space-3);align-items:flex-start;padding:var(--uix-space-3) var(--uix-space-4);border-radius:var(--uix-radius-md);background:var(--uix-surface-2);border:1px solid var(--uix-border);box-shadow:var(--uix-shadow-popover);animation:uix-slide-in-right var(--uix-dur-slow) var(--uix-ease-out)}.uix-toast[data-leaving]{animation:uix-toast-out var(--uix-dur) var(--uix-ease-in) forwards}@keyframes uix-toast-out{to{opacity:0;transform:translate(16px)}}.uix-toast__icon{flex:none;margin-top:1px}.uix-toast__icon svg{width:var(--uix-icon-md);height:var(--uix-icon-md)}.uix-toast__body{flex:1}.uix-toast__title{font-weight:600;font-size:var(--uix-text-body)}.uix-toast__msg{font-size:var(--uix-text-meta);color:var(--uix-text-muted);margin-top:var(--uix-space-1)}.uix-toast__close{border:0;background:transparent;color:var(--uix-text-muted);cursor:pointer;padding:var(--uix-space-1) var(--uix-space-2);border-radius:var(--uix-radius-xs)}.uix-toast__close:hover{background:var(--uix-bg-hover);color:var(--uix-text)}.uix-toast--success .uix-toast__icon{color:var(--uix-success)}.uix-toast--danger .uix-toast__icon{color:var(--uix-danger)}.uix-toast--info .uix-toast__icon{color:var(--uix-info)}}@layer uix.components{.uix-dialog{margin:auto;width:100%;max-width:min(520px,92vw);padding:0;color:var(--uix-text);border:1px solid var(--uix-border);border-radius:var(--uix-radius-lg);background:var(--uix-surface-2);box-shadow:var(--uix-shadow-overlay);opacity:0;transform:translateY(8px) scale(.98);transition:opacity var(--uix-dur-slow) var(--uix-ease-out),transform var(--uix-dur-slow) var(--uix-ease-out),overlay var(--uix-dur-slow) allow-discrete,display var(--uix-dur-slow) allow-discrete;display:none}.uix-dialog[open]{opacity:1;transform:none;display:block}@starting-style{.uix-dialog[open]{opacity:0;transform:translateY(8px) scale(.98)}}.uix-dialog::backdrop{background:var(--uix-scrim);opacity:0;transition:opacity var(--uix-dur-slow) var(--uix-ease-out),overlay var(--uix-dur-slow) allow-discrete,display var(--uix-dur-slow) allow-discrete}.uix-dialog[open]::backdrop{opacity:1}@starting-style{.uix-dialog[open]::backdrop{opacity:0}}.uix-dialog__header{display:flex;align-items:center;gap:var(--uix-space-3);padding:var(--uix-space-4) var(--uix-space-5);border-bottom:1px solid var(--uix-border)}.uix-dialog__title{font-size:var(--uix-text-h3);font-weight:600}.uix-dialog__close{margin-left:auto;border:0;background:transparent;color:var(--uix-text-muted);cursor:pointer;width:30px;height:30px;display:grid;place-items:center;border-radius:var(--uix-radius-sm)}.uix-dialog__close:hover{background:var(--uix-bg-hover);color:var(--uix-text)}.uix-dialog__close svg{width:var(--uix-icon-md);height:var(--uix-icon-md)}.uix-dialog__body{padding:var(--uix-space-5);color:var(--uix-text-hushed)}.uix-dialog__footer{display:flex;gap:var(--uix-space-2);justify-content:flex-end;padding:var(--uix-space-4) var(--uix-space-5);border-top:1px solid var(--uix-border)}}@layer uix.components{.uix-drawer{margin:0 0 0 auto;height:100dvh;max-height:100dvh;width:min(420px,100vw);padding:0;color:var(--uix-text);border:0;border-left:1px solid var(--uix-border);border-radius:0;background:var(--uix-surface);box-shadow:var(--uix-shadow-overlay);transform:translate(100%);transition:transform var(--uix-dur-slow) var(--uix-ease-out),overlay var(--uix-dur-slow) allow-discrete,display var(--uix-dur-slow) allow-discrete;display:none}.uix-drawer[open]{transform:none;display:flex;flex-direction:column}@starting-style{.uix-drawer[open]{transform:translate(100%)}}.uix-drawer::backdrop{background:var(--uix-scrim);opacity:0;transition:opacity var(--uix-dur-slow) var(--uix-ease-out),overlay var(--uix-dur-slow) allow-discrete,display var(--uix-dur-slow) allow-discrete}.uix-drawer[open]::backdrop{opacity:1}@starting-style{.uix-drawer[open]::backdrop{opacity:0}}.uix-drawer__header{display:flex;align-items:center;gap:var(--uix-space-3);padding:var(--uix-space-4) var(--uix-space-5);border-bottom:1px solid var(--uix-border)}.uix-drawer__body{padding:var(--uix-space-5);overflow-y:auto;flex:1}.uix-drawer__footer{display:flex;gap:var(--uix-space-2);padding:var(--uix-space-4) var(--uix-space-5);border-top:1px solid var(--uix-border)}}@layer uix.components{.uix-peek{margin:0 0 0 auto;height:100dvh;max-height:100dvh;width:var(--uix-peek-w);padding:0;color:var(--uix-text);border:0;border-left:1px solid var(--uix-border);border-radius:0;background:var(--uix-surface);box-shadow:var(--uix-shadow-overlay);transform:translate(100%);transition:transform var(--uix-dur-slow) var(--uix-ease-out),overlay var(--uix-dur-slow) allow-discrete,display var(--uix-dur-slow) allow-discrete;display:none}.uix-peek[open]{transform:none;display:flex;flex-direction:column}@starting-style{.uix-peek[open]{transform:translate(100%)}}.uix-peek::backdrop{background:var(--uix-scrim);opacity:0;transition:opacity var(--uix-dur-slow) var(--uix-ease-out),overlay var(--uix-dur-slow) allow-discrete,display var(--uix-dur-slow) allow-discrete}.uix-peek[open]::backdrop{opacity:1}@starting-style{.uix-peek[open]::backdrop{opacity:0}}.uix-peek__header{display:flex;align-items:center;gap:var(--uix-space-3);padding:var(--uix-space-4) var(--uix-space-4);border-bottom:1px solid var(--uix-border)}.uix-peek__nav{display:inline-flex;gap:var(--uix-space-1)}.uix-peek__navbtn{width:28px;height:28px;display:grid;place-items:center;border:1px solid var(--uix-border);background:var(--uix-surface);color:var(--uix-text);border-radius:var(--uix-radius-sm);cursor:pointer}.uix-peek__navbtn:hover{background:var(--uix-bg-hover)}.uix-peek__title{font-size:var(--uix-text-h3);font-weight:600}.uix-peek__title a{color:var(--uix-link)}.uix-peek__close{margin-left:auto;border:0;background:transparent;color:var(--uix-text-muted);cursor:pointer;width:30px;height:30px;display:grid;place-items:center;border-radius:var(--uix-radius-sm)}.uix-peek__close:hover{background:var(--uix-bg-hover);color:var(--uix-text)}.uix-peek__body{padding:var(--uix-space-5);overflow-y:auto;flex:1}.uix-peek__hint{font-size:var(--uix-text-meta);color:var(--uix-text-muted)}.uix-peek__footer{display:flex;gap:var(--uix-space-2);padding:var(--uix-space-4) var(--uix-space-4);border-top:1px solid var(--uix-border)}[data-uix-rowpeek] tbody tr{cursor:pointer}[data-uix-rowpeek] tbody tr:hover td{background:var(--uix-bg-hover)}}@layer uix.components{.uix-popover{margin:0;padding:var(--uix-space-2);background:var(--uix-surface-2);border:1px solid var(--uix-border);border-radius:var(--uix-radius-md);box-shadow:var(--uix-shadow-popover);color:var(--uix-text)}[popover].uix-popover{opacity:0;transform:translateY(calc(-1 * var(--uix-lift)));transition:opacity var(--uix-dur-fast) var(--uix-ease-out),transform var(--uix-dur-fast) var(--uix-ease-out),overlay var(--uix-dur-fast) allow-discrete,display var(--uix-dur-fast) allow-discrete}[popover].uix-popover:popover-open{opacity:1;transform:none}@starting-style{[popover].uix-popover:popover-open{opacity:0;transform:translateY(calc(-1 * var(--uix-lift)))}}}@layer uix.components{.uix-spinner{width:20px;height:20px;border:2px solid var(--uix-border-strong);border-right-color:transparent;border-radius:50%;display:inline-block;animation:uix-spin .6s linear infinite}.uix-spinner--accent{border-color:var(--uix-accent);border-right-color:transparent}.uix-spinner--lg{width:32px;height:32px;border-width:3px}.uix-overlay-progress{position:absolute;inset:0;display:grid;place-items:center;border-radius:inherit;background:color-mix(in srgb,var(--uix-bg-app) 60%,transparent);backdrop-filter:blur(2px)}}@layer uix.components{.uix-detail{display:grid;grid-template-columns:1fr 280px;gap:var(--uix-space-5);align-items:start}.uix-detail__main{min-width:0;display:flex;flex-direction:column;gap:var(--uix-space-4)}.uix-detail__side{display:flex;flex-direction:column;gap:var(--uix-space-4)}@media(max-width:820px){.uix-detail{grid-template-columns:1fr}}}@layer uix.components{.uix-comments{display:flex;flex-direction:column;gap:var(--uix-space-4)}.uix-comment{display:grid;grid-template-columns:32px 1fr;gap:var(--uix-space-3)}.uix-comment__body{background:var(--uix-bg-subtle);border:1px solid var(--uix-border);border-radius:var(--uix-radius-md);padding:var(--uix-space-3) var(--uix-space-3)}.uix-comment__meta{font-size:var(--uix-text-meta);color:var(--uix-text-muted);margin-bottom:var(--uix-space-1)}.uix-comment__author{font-weight:600;color:var(--uix-text)}.uix-mention{color:var(--uix-link);background:var(--uix-brand-muted);padding:0 var(--uix-space-1);border-radius:var(--uix-radius-xs);font-weight:500}.uix-composer{border:1px solid var(--uix-border);border-radius:var(--uix-radius-md);background:var(--uix-surface)}.uix-composer:focus-within{border-color:var(--uix-ring);box-shadow:0 0 0 3px var(--uix-brand-muted)}.uix-composer textarea{width:100%;border:0;background:transparent;resize:vertical;padding:var(--uix-space-3) var(--uix-space-3);color:var(--uix-text);font:inherit;min-height:60px}.uix-composer textarea:focus{outline:none}.uix-composer__bar{display:flex;justify-content:flex-end;gap:var(--uix-space-2);padding:var(--uix-space-2);border-top:1px solid var(--uix-border)}.uix-comment__image{display:block;margin-top:var(--uix-space-2);padding:0;border-radius:var(--uix-radius-sm);overflow:hidden;border:1px solid var(--uix-border);background:none;cursor:zoom-in;max-width:200px}.uix-comment__image img{display:block;width:100%;height:auto}}@layer uix.components{.uix-reactions{display:flex;flex-wrap:wrap;align-items:center;gap:var(--uix-space-2);margin-top:var(--uix-space-2)}.uix-reaction{display:inline-flex;align-items:center;gap:var(--uix-space-2);padding:1px var(--uix-space-2);line-height:1.7;border-radius:var(--uix-radius-pill);border:1px solid var(--uix-border);background:var(--uix-surface);color:var(--uix-text-hushed);font:inherit;font-size:var(--uix-text-meta);cursor:pointer}.uix-reaction:hover{border-color:var(--uix-border-strong)}.uix-reaction[data-mine]{background:var(--uix-brand-muted);border-color:var(--uix-accent);color:var(--uix-accent)}.uix-reaction__count{font-variant-numeric:tabular-nums}.uix-reaction-add{display:inline-flex;align-items:center;justify-content:center;width:30px;height:24px;border-radius:var(--uix-radius-pill);border:1px dashed var(--uix-border-strong);background:transparent;color:var(--uix-text-muted);cursor:pointer}.uix-reaction-add:hover{color:var(--uix-text);border-color:var(--uix-text-muted)}.uix-reaction-add svg{width:var(--uix-icon-sm);height:var(--uix-icon-sm)}.uix-emoji-picker{display:flex;flex-wrap:wrap;gap:var(--uix-space-1);width:196px}.uix-emoji-picker__btn{font-size:18px;line-height:1;padding:var(--uix-space-2);border:0;background:transparent;border-radius:var(--uix-radius-sm);cursor:pointer}.uix-emoji-picker__btn:hover{background:var(--uix-bg-hover)}}@layer uix.components{.uix-media{display:flex;gap:var(--uix-space-3);align-items:center}.uix-media__thumb{width:64px;height:64px;flex:none;border-radius:var(--uix-radius-md);overflow:hidden;background:var(--uix-bg-subtle);border:1px solid var(--uix-border);display:grid;place-items:center}.uix-media__thumb img{width:100%;height:100%;object-fit:cover;display:block}.uix-media__thumb svg{width:28px;height:28px;color:var(--uix-text-muted)}.uix-media__name{font-weight:600}.uix-media__meta{font-size:var(--uix-text-meta);color:var(--uix-text-muted)}}@layer uix.components{.uix-lightbox{margin:auto;border:0;background:transparent;padding:0;max-width:92vw;max-height:92vh;box-shadow:var(--uix-shadow-overlay);overflow:visible}.uix-lightbox img{display:block;width:min(720px,92vw);height:auto;max-height:92vh;border-radius:var(--uix-radius-md)}.uix-lightbox::backdrop{background:var(--uix-scrim-strong)}}@layer uix.components{.uix-prose{max-width:66ch;color:var(--uix-text)}.uix-prose>*+*{margin-top:var(--uix-space-3)}.uix-prose h3{font-size:var(--uix-text-h2);font-weight:600}.uix-prose h4{font-size:var(--uix-text-h3);font-weight:600;margin-top:var(--uix-space-5)}.uix-prose p{line-height:var(--uix-leading-body);color:var(--uix-text-hushed)}.uix-prose a{color:var(--uix-link)}.uix-prose ul,.uix-prose ol{padding-left:var(--uix-space-5)}.uix-prose li+li{margin-top:var(--uix-space-1)}.uix-prose code{font-family:var(--uix-font-mono);font-size:.9em;background:var(--uix-bg-subtle);padding:1px var(--uix-space-2);border-radius:var(--uix-radius-xs)}.uix-prose blockquote{border-left:3px solid var(--uix-border-strong);padding-left:var(--uix-space-3);color:var(--uix-text-muted)}.uix-note{display:flex;gap:var(--uix-space-3);padding:var(--uix-space-3) var(--uix-space-4);border-radius:var(--uix-radius-md);border:1px solid var(--uix-border);background:var(--uix-surface)}.uix-note__icon{flex:none}.uix-note__icon svg{width:var(--uix-icon-md);height:var(--uix-icon-md)}.uix-note__body{font-size:var(--uix-text-body);color:var(--uix-text)}.uix-note__body>*+*{margin-top:var(--uix-space-2)}.uix-note--info{background:var(--uix-info-bg);border-color:color-mix(in srgb,var(--uix-info) 30%,transparent)}.uix-note--info .uix-note__icon{color:var(--uix-info)}.uix-note--success{background:var(--uix-success-bg);border-color:color-mix(in srgb,var(--uix-success) 30%,transparent)}.uix-note--success .uix-note__icon{color:var(--uix-success)}.uix-note--warning{background:var(--uix-warning-bg);border-color:color-mix(in srgb,var(--uix-warning) 30%,transparent)}.uix-note--warning .uix-note__icon{color:var(--uix-warning)}.uix-note--danger{background:var(--uix-danger-bg);border-color:color-mix(in srgb,var(--uix-danger) 30%,transparent)}.uix-note--danger .uix-note__icon{color:var(--uix-danger)}}@layer uix.components{.uix-kanban{display:flex;gap:var(--uix-space-4);overflow-x:auto;padding-bottom:var(--uix-space-2)}.uix-kanban__col{flex:0 0 260px;background:var(--uix-bg-subtle);border:1px solid var(--uix-border);border-radius:var(--uix-radius-lg);display:flex;flex-direction:column;max-height:460px}.uix-kanban__head{display:flex;align-items:center;gap:var(--uix-space-2);padding:var(--uix-space-3) var(--uix-space-4);font-weight:600;font-size:var(--uix-text-meta)}.uix-kanban__count{margin-left:auto;color:var(--uix-text-muted);font-weight:500}.uix-kanban__body{padding:0 var(--uix-space-3) var(--uix-space-3);display:flex;flex-direction:column;gap:var(--uix-space-2);overflow-y:auto}.uix-kanban__card{background:var(--uix-surface);border:1px solid var(--uix-border);border-radius:var(--uix-radius-md);padding:var(--uix-space-3);box-shadow:var(--uix-shadow-sm);cursor:grab;transition:box-shadow var(--uix-dur-fast) var(--uix-ease-out),transform var(--uix-dur-fast) var(--uix-ease-out)}.uix-kanban__card:hover{box-shadow:var(--uix-shadow-popover)}@media(hover:hover)and (pointer:fine){.uix-kanban__card:hover{transform:translateY(calc(-1 * var(--uix-lift)))}}.uix-kanban__card:active{cursor:grabbing}.uix-kanban__card-title{font-weight:500;font-size:var(--uix-text-body);margin-bottom:var(--uix-space-2)}.uix-kanban__card-meta{display:flex;align-items:center;gap:var(--uix-space-2)}}@layer uix.components{.uix-inbox{display:grid;grid-template-columns:300px 1fr;border:1px solid var(--uix-border);border-radius:var(--uix-radius-lg);overflow:hidden;height:420px}.uix-inbox__list{border-right:1px solid var(--uix-border);overflow-y:auto;background:var(--uix-surface)}.uix-inbox__item{position:relative;display:flex;flex-direction:column;gap:var(--uix-space-1);padding:var(--uix-space-3) var(--uix-space-4);border-bottom:1px solid var(--uix-border);cursor:pointer}.uix-inbox__item:hover{background:var(--uix-bg-hover)}.uix-inbox__item[aria-selected=true]{background:linear-gradient(to right,var(--uix-accent) 3px,var(--uix-brand-muted) 3px)}.uix-inbox__item[data-unread] .uix-inbox__subject{font-weight:600}.uix-inbox__subject{font-size:var(--uix-text-body)}.uix-inbox__preview{font-size:var(--uix-text-meta);color:var(--uix-text-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.uix-inbox__detail{overflow-y:auto;padding:var(--uix-space-5);background:var(--uix-bg-app)}@media(max-width:700px){.uix-inbox{grid-template-columns:1fr}.uix-inbox__detail{display:none}}}@layer uix.components{.uix-notifs{background:var(--uix-surface-2);border:1px solid var(--uix-border);border-radius:var(--uix-radius-lg);overflow:hidden}.uix-notifs__head{display:flex;align-items:center;padding:var(--uix-space-3) var(--uix-space-4);border-bottom:1px solid var(--uix-border);font-weight:600}.uix-notif{display:grid;grid-template-columns:auto 1fr;gap:var(--uix-space-3);padding:var(--uix-space-3) var(--uix-space-4);border-bottom:1px solid var(--uix-border)}.uix-notif:last-child{border-bottom:0}.uix-notif[data-unread]{background:var(--uix-brand-muted)}.uix-notif__dot{width:8px;height:8px;border-radius:50%;background:var(--uix-accent);margin-top:var(--uix-space-2)}.uix-notif[data-unread] .uix-notif__dot{background:var(--uix-accent)}.uix-notif:not([data-unread]) .uix-notif__dot{background:transparent}.uix-notif__meta{font-size:var(--uix-text-meta);color:var(--uix-text-muted)}.uix-notif[data-unread] .uix-notif__meta{color:var(--uix-text-hushed)}}@layer uix.components{.uix-label{display:inline-flex;align-items:center;gap:var(--uix-space-2);padding:1px var(--uix-space-2);border-radius:var(--uix-radius-sm);font-size:var(--uix-text-meta);font-weight:500;background:color-mix(in srgb,var(--label-color, var(--uix-accent)) 16%,transparent);color:color-mix(in srgb,var(--label-color, var(--uix-accent)) 55%,var(--uix-text))}.uix-label__dot{width:7px;height:7px;border-radius:50%;background:var(--label-color, var(--uix-accent))}}@layer uix.components{.uix-attachments{display:flex;flex-direction:column;gap:var(--uix-space-2)}.uix-attachment{display:flex;align-items:center;gap:var(--uix-space-3);padding:var(--uix-space-2) var(--uix-space-3);border:1px solid var(--uix-border);border-radius:var(--uix-radius-md);background:var(--uix-surface)}.uix-attachment__icon{width:32px;height:32px;flex:none;border-radius:var(--uix-radius-sm);background:var(--uix-bg-subtle);display:grid;place-items:center;color:var(--uix-text-muted)}.uix-attachment__icon svg{width:var(--uix-icon-md);height:var(--uix-icon-md)}.uix-attachment__name{font-size:var(--uix-text-body)}.uix-attachment__size{font-size:var(--uix-text-meta);color:var(--uix-text-muted)}.uix-attachment__actions{margin-left:auto}}@layer uix.components{.uix-pipeline{display:flex;gap:var(--uix-space-1)}.uix-pipeline__stage{flex:1;text-align:center;padding:var(--uix-space-2) var(--uix-space-2);font-size:var(--uix-text-meta);color:var(--uix-text-muted);background:var(--uix-bg-subtle)}.uix-pipeline__stage:first-child{border-radius:var(--uix-radius-pill) 0 0 var(--uix-radius-pill)}.uix-pipeline__stage:last-child{border-radius:0 var(--uix-radius-pill) var(--uix-radius-pill) 0}.uix-pipeline__stage[data-state=done]{background:var(--uix-accent);color:var(--uix-accent-fg)}.uix-pipeline__stage[data-state=active]{background:var(--uix-brand-muted);color:var(--uix-link);font-weight:600}}@layer uix.components{.uix-node{position:relative;display:inline-grid;grid-template-columns:auto 1fr;align-items:center;gap:var(--uix-space-3);min-width:132px;width:max-content;max-width:220px;padding:var(--uix-space-3) var(--uix-space-3);background:var(--uix-surface);border:1px solid var(--tone-border, var(--uix-border-strong));border-radius:var(--uix-radius-md);box-shadow:var(--uix-shadow-sm);color:var(--uix-text);font-size:var(--uix-text-body);text-align:left}.uix-node__icon{display:grid;place-items:center;width:30px;height:30px;flex:none;border-radius:var(--uix-radius-sm);background:var(--tone-bg, var(--uix-bg-subtle));color:var(--tone-fg, var(--uix-text-muted))}.uix-node__icon svg{width:var(--uix-icon-sm);height:var(--uix-icon-sm)}.uix-node__body{min-width:0}.uix-node__title{font-weight:500;line-height:1.25}.uix-node__meta{font-size:var(--uix-text-meta);color:var(--uix-text-muted)}.uix-node__status{display:inline-flex;align-items:center;gap:var(--uix-space-2);margin-top:var(--uix-space-1);font-size:var(--uix-text-eyebrow);letter-spacing:var(--uix-tracking-eyebrow);text-transform:uppercase;color:var(--tone-fg, var(--uix-text-muted))}.uix-node__status:before{content:"";width:7px;height:7px;flex:none;border-radius:50%;background:var(--tone-dot, var(--uix-text-muted))}.uix-node__handle{position:absolute;top:50%;width:9px;height:9px;border-radius:50%;background:var(--uix-surface);border:1.5px solid var(--uix-border-strong);transform:translateY(-50%)}.uix-node__handle--in{left:-5px}.uix-node__handle--out{right:-5px}.uix-node--pending{--tone-bg: var(--uix-bg-subtle);--tone-fg: var(--uix-text-muted);--tone-dot: var(--uix-text-muted);--tone-border: var(--uix-border)}.uix-node--active{--tone-bg: var(--uix-brand-muted);--tone-fg: var(--uix-link);--tone-dot: var(--uix-accent);--tone-border: var(--uix-accent)}.uix-node--running{--tone-bg: var(--uix-info-bg);--tone-fg: var(--uix-info-text);--tone-dot: var(--uix-info);--tone-border: var(--uix-info)}.uix-node--done{--tone-bg: var(--uix-success-bg);--tone-fg: var(--uix-success);--tone-dot: var(--uix-success);--tone-border: var(--uix-success)}.uix-node--error{--tone-bg: var(--uix-danger-bg);--tone-fg: var(--uix-danger-text);--tone-dot: var(--uix-danger);--tone-border: var(--uix-danger)}.uix-node--active,.uix-node--running{box-shadow:var(--uix-shadow-sm),0 0 0 3px var(--tone-bg)}.uix-node--running .uix-node__icon svg{animation:uix-flow-spin 1s linear infinite}.uix-node--decision{min-width:0;width:112px;height:112px;padding:0;overflow:visible;display:grid;grid-template-columns:1fr;place-items:center;background:transparent;border:0;box-shadow:none}.uix-node--decision:before{content:"";position:absolute;left:50%;top:50%;width:78px;height:78px;transform:translate(-50%,-50%) rotate(45deg);background:var(--tone-bg, var(--uix-surface));border:1px solid var(--tone-border, var(--uix-border-strong));border-radius:var(--uix-radius-sm);box-shadow:var(--uix-shadow-sm)}.uix-node--decision .uix-node__title{position:relative;z-index:var(--uix-z-raised);max-width:88px;text-align:center;font-size:var(--uix-text-meta);color:var(--tone-fg, var(--uix-text))}.uix-node--start,.uix-node--end{grid-template-columns:1fr;min-width:0;justify-items:center;padding:var(--uix-space-2) var(--uix-space-5);border-radius:var(--uix-radius-pill);background:var(--uix-bg-active);color:var(--uix-text-hushed);font-weight:500}.uix-flow{position:relative;width:100%;color:var(--uix-border-strong)}.uix-flow__edges{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}.uix-flow__edge{fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round}.uix-flow__edge--branch-yes{stroke:var(--uix-success)}.uix-flow__edge--branch-no{stroke:var(--uix-danger)}.uix-flow__edge--loop{stroke:var(--uix-accent);stroke-dasharray:5 4}.uix-flow__arrow{fill:currentColor}.uix-flow__edge-label{fill:var(--uix-text-muted);font-family:var(--uix-font-sans);font-size:var(--uix-text-eyebrow)}.uix-flow__edge-label--loop{fill:var(--uix-accent)}@media(hover:hover)and (pointer:fine){.uix-flow:hover .uix-flow__edge,.uix-flow:focus-within .uix-flow__edge{stroke-dasharray:5 4;animation:uix-flow-march var(--uix-dur-slow) linear infinite}}.uix-flow--linear .uix-flow__row{display:flex;align-items:center;flex-wrap:wrap;gap:var(--uix-space-1)}.uix-flow__connector{position:relative;flex:1 1 30px;min-width:30px;height:0;border-top:1.5px solid var(--uix-border-strong);margin:0 var(--uix-space-1)}.uix-flow__connector:after{content:"";position:absolute;right:-1px;top:50%;width:6px;height:6px;border-top:1.5px solid var(--uix-border-strong);border-right:1.5px solid var(--uix-border-strong);transform:translateY(-50%) rotate(45deg)}.uix-flow__connector[data-done]{border-color:var(--uix-success)}.uix-flow__connector[data-done]:after{border-color:var(--uix-success)}.uix-flow--branch,.uix-flow--loop{aspect-ratio:5 / 2}.uix-flow--mindmap{aspect-ratio:2 / 1}.uix-flow--branch .uix-node,.uix-flow--loop .uix-node,.uix-flow--mindmap .uix-node,.uix-flow--canvas .uix-node{position:absolute;transform:translate(-50%,-50%)}.uix-flow--mindmap .uix-node{min-width:0}.uix-flow--mindmap .uix-node--hub{min-width:120px}.uix-flow--canvas{display:grid;grid-template-columns:188px 1fr;border:1px solid var(--uix-border);border-radius:var(--uix-radius-lg);overflow:hidden;background:var(--uix-surface);width:100%}.uix-flow__palette{display:flex;flex-direction:column;gap:var(--uix-space-2);padding:var(--uix-space-4);border-right:1px solid var(--uix-border);background:var(--uix-surface)}.uix-flow__palette-title{font-size:var(--uix-text-eyebrow);letter-spacing:var(--uix-tracking-eyebrow);text-transform:uppercase;color:var(--uix-text-muted);margin-bottom:var(--uix-space-1)}.uix-flow__chip{display:flex;align-items:center;gap:var(--uix-space-2);padding:var(--uix-space-2) var(--uix-space-3);border:1px solid var(--uix-border);border-radius:var(--uix-radius-md);background:var(--uix-surface);color:var(--uix-text);font-size:var(--uix-text-meta);cursor:grab;box-shadow:var(--uix-shadow-sm);transition:box-shadow var(--uix-dur-fast) var(--uix-ease-out),transform var(--uix-dur-fast) var(--uix-ease-out)}.uix-flow__chip svg{width:var(--uix-icon-sm);height:var(--uix-icon-sm);color:var(--uix-text-muted);flex:none}.uix-flow__chip:active{cursor:grabbing}@media(hover:hover)and (pointer:fine){.uix-flow__chip:hover{box-shadow:var(--uix-shadow-popover);transform:translateY(calc(-1 * var(--uix-lift)))}}.uix-flow__canvas{position:relative;aspect-ratio:16 / 9;min-height:280px;background-color:var(--uix-bg-subtle);background-image:radial-gradient(var(--uix-border-strong) 1px,transparent 1px);background-size:22px 22px;background-position:-1px -1px}.uix-flow--canvas .uix-node{cursor:grab}.uix-flow--canvas .uix-node:active{cursor:grabbing}.uix-flow .uix-node[data-selected]{border-color:var(--uix-ring);box-shadow:0 0 0 2px var(--uix-surface),0 0 0 4px var(--uix-ring)}.uix-flow__chip:focus-visible,.uix-flow--canvas .uix-node:focus-visible{outline:none;border-color:var(--uix-ring);box-shadow:0 0 0 2px var(--uix-surface),0 0 0 4px var(--uix-ring)}@keyframes uix-flow-spin{to{transform:rotate(360deg)}}@keyframes uix-flow-march{to{stroke-dashoffset:-18}}@media(prefers-reduced-motion:reduce){.uix-node--running .uix-node__icon svg,.uix-flow:hover .uix-flow__edge,.uix-flow:focus-within .uix-flow__edge{animation:none}}}@layer uix.components{.uix-audit{display:flex;flex-direction:column}.uix-audit__row{display:grid;grid-template-columns:auto 1fr auto;gap:var(--uix-space-3);align-items:center;padding:var(--uix-space-3) 0;border-bottom:1px solid var(--uix-border);font-size:var(--uix-text-meta)}.uix-audit__row:last-child{border-bottom:0}.uix-audit__actor{font-weight:500;color:var(--uix-text)}.uix-audit__detail{color:var(--uix-text-hushed)}.uix-audit__detail ins{background:var(--uix-success-bg);color:var(--uix-success);text-decoration:none;padding:0 var(--uix-space-1);border-radius:var(--uix-radius-xs)}.uix-audit__detail del{background:var(--uix-danger-bg);color:var(--uix-danger-text);text-decoration:line-through;padding:0 var(--uix-space-1);border-radius:var(--uix-radius-xs)}.uix-audit__time{color:var(--uix-text-muted);white-space:nowrap}}@layer uix.components{.uix-contact{display:flex;flex-direction:column;align-items:center;text-align:center;gap:var(--uix-space-1);padding:var(--uix-space-5)}.uix-contact__name{font-size:var(--uix-text-h3);font-weight:600;margin-top:var(--uix-space-2)}.uix-contact__role{font-size:var(--uix-text-meta);color:var(--uix-text-muted)}.uix-contact__actions{display:flex;gap:var(--uix-space-2);margin-top:var(--uix-space-3);align-self:stretch}.uix-contact__actions>.uix-btn{flex:1}.uix-contact__stats{display:flex;gap:var(--uix-space-5);margin-top:var(--uix-space-4)}.uix-contact__stat{text-align:center}.uix-contact__stat b{display:block;font-size:var(--uix-text-h3)}.uix-contact__stat span{font-size:var(--uix-text-meta);color:var(--uix-text-muted)}}@layer uix.components{.uix-sla{display:inline-flex;align-items:center;gap:var(--uix-space-2);font-size:var(--uix-text-meta);font-weight:500;color:var(--uix-text-hushed)}.uix-sla svg{width:14px;height:14px}.uix-sla[data-state=ok]{color:var(--uix-success)}.uix-sla[data-state=at-risk]{color:var(--uix-warning-text)}.uix-sla[data-state=breach]{color:var(--uix-danger-text)}}@layer uix.components{.uix-code{font-family:var(--uix-font-mono);font-size:.9em;background:var(--uix-bg-subtle);border:1px solid var(--uix-border);border-radius:var(--uix-radius-xs);padding:.1em .4em;color:var(--uix-text)}.uix-pre{font-family:var(--uix-font-mono);font-size:var(--uix-text-meta);line-height:1.5;background:var(--uix-bg-subtle);border:1px solid var(--uix-border);border-radius:var(--uix-radius-md);padding:var(--uix-space-4) var(--uix-space-4);overflow-x:auto;color:var(--uix-text)}.uix-blockquote{border-left:3px solid var(--uix-accent);padding:var(--uix-space-1) 0 var(--uix-space-1) var(--uix-space-4);color:var(--uix-text-hushed);font-style:italic}.uix-divider{height:1px;background:var(--uix-border);border:0;margin:var(--uix-space-4) 0}.uix-divider--label{display:flex;align-items:center;gap:var(--uix-space-3);color:var(--uix-text-muted);font-size:var(--uix-text-meta);background:transparent;height:auto}.uix-divider--label:before,.uix-divider--label:after{content:"";flex:1;height:1px;background:var(--uix-border)}.uix-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--uix-text-muted)}.uix-dot--success{background:var(--uix-success)}.uix-dot--warning{background:var(--uix-warning)}.uix-dot--danger{background:var(--uix-danger)}.uix-dot--info{background:var(--uix-info)}}@layer uix.components{.uix-heartbeat{position:relative;display:inline-grid;place-items:center;width:8px;height:8px;flex:none}.uix-heartbeat__dot{width:8px;height:8px;border-radius:50%;background:var(--uix-success);z-index:var(--uix-z-raised)}.uix-heartbeat__ping{position:absolute;inset:0;border-radius:50%;background:var(--uix-success);animation:uix-ping 1.6s var(--uix-ease-out) infinite}@keyframes uix-ping{0%{transform:scale(1);opacity:.55}to{transform:scale(2.8);opacity:0}}.uix-heartbeat--warning .uix-heartbeat__dot,.uix-heartbeat--warning .uix-heartbeat__ping{background:var(--uix-warning)}.uix-heartbeat--danger .uix-heartbeat__dot,.uix-heartbeat--danger .uix-heartbeat__ping{background:var(--uix-danger)}.uix-heartbeat--idle .uix-heartbeat__dot{background:var(--uix-text-muted)}.uix-heartbeat--idle .uix-heartbeat__ping{display:none}.uix-live{display:inline-flex;align-items:center;gap:var(--uix-space-2);font-size:var(--uix-text-meta);font-weight:500;color:var(--uix-text-hushed)}}@layer uix.components{.uix-page-intro{margin-top:var(--uix-space-6);display:grid;grid-template-columns:minmax(300px,.8fr) minmax(460px,1.2fr);align-items:end;gap:var(--uix-space-7)}.uix-page-intro .uix-page-lede{margin-top:var(--uix-space-2)}.uix-page-kicker{margin:0 0 var(--uix-space-2);color:var(--uix-text-hushed);font-size:var(--uix-text-meta)}.uix-page-title{max-width:760px;margin:0;font-family:var(--uix-font-heading);font-size:clamp(30px,4vw,48px);font-weight:400;letter-spacing:-.035em;line-height:1.06}.uix-page-lede{max-width:680px;margin:var(--uix-space-3) 0 0;color:var(--uix-text-hushed);font-size:var(--uix-text-h3)}.uix-intro-search__label{margin:0 0 var(--uix-space-2);color:var(--uix-text-hushed);font-size:var(--uix-text-meta)}.uix-searchbar{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:var(--uix-space-2)}.uix-searchbar .uix-input{min-height:44px;padding-left:42px}.uix-searchbar__wrap{position:relative}.uix-searchbar__wrap>svg{position:absolute;top:50%;left:14px;z-index:var(--uix-z-raised);width:17px;height:17px;color:var(--uix-text-hushed);transform:translateY(-50%);pointer-events:none}.uix-shortcut-grid{grid-column:1 / -1;margin-top:var(--uix-space-4);display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--uix-space-2)}.uix-shortcut-grid .uix-btn{min-height:42px;justify-content:flex-start}.uix-notice{min-height:48px;padding:var(--uix-space-2) var(--uix-space-4);display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:var(--uix-space-3);border-left:2px solid var(--uix-text);background:var(--uix-bg-subtle)}.uix-notice__copy{margin:0;font-size:var(--uix-text-body)}.uix-notice__copy strong{font-weight:600}.uix-notice__content{min-width:0}.uix-notice__meta{margin:var(--uix-space-1) 0 0;color:var(--uix-text-hushed);font-size:var(--uix-text-eyebrow)}.uix-notice__actions{display:flex;align-items:center;justify-content:flex-end;gap:var(--uix-space-2)}.uix-notice__position{margin-right:var(--uix-space-1);color:var(--uix-text-hushed);font-size:var(--uix-text-eyebrow);white-space:nowrap}.uix-notice__arrow--previous svg{transform:rotate(180deg)}.uix-featured{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(300px,.7fr);align-items:stretch;overflow:hidden;border:1px solid var(--uix-border);border-radius:var(--uix-radius-md);background:var(--uix-surface)}.uix-page-intro+.uix-featured{margin-top:var(--uix-space-6)}.uix-featured__stage{min-width:0;min-height:302px;display:grid;grid-template-columns:minmax(260px,.95fr) minmax(300px,1.05fr)}.uix-featured__visual{min-height:302px;padding:var(--uix-space-6) var(--uix-space-7);display:flex;align-items:flex-end;position:relative;overflow:hidden;background:linear-gradient(135deg,transparent 20%,color-mix(in srgb,var(--uix-text) 8%,transparent)),var(--uix-bg-subtle)}.uix-featured__visual:before,.uix-featured__visual:after{content:"";position:absolute;border:1px solid var(--uix-border-strong);border-radius:50%}.uix-featured__visual:before{width:240px;height:240px;top:-78px;right:-42px}.uix-featured__visual:after{width:144px;height:144px;top:72px;right:56px}.uix-featured__content{padding:var(--uix-space-7);display:flex;flex-direction:column;align-items:flex-start;justify-content:center}.uix-featured__eyebrow{margin:0 0 var(--uix-space-4);color:var(--uix-text-hushed);font-size:var(--uix-text-eyebrow);letter-spacing:var(--uix-tracking-eyebrow);text-transform:uppercase}.uix-featured__title{margin:0;font-family:var(--uix-font-heading);font-size:clamp(26px,3vw,38px);font-weight:400;letter-spacing:-.03em;line-height:1.08}.uix-featured__description{margin:var(--uix-space-3) 0 var(--uix-space-5);color:var(--uix-text-hushed)}.uix-featured__meta{margin:0 0 var(--uix-space-5);color:var(--uix-text-hushed);font-size:var(--uix-text-meta)}.uix-featured__now{min-width:22px;height:22px;display:inline-grid;place-items:center;margin-right:var(--uix-space-2);border-radius:var(--uix-radius-pill);background:var(--uix-text);color:var(--uix-bg-app);font-variant-numeric:tabular-nums;letter-spacing:0}.uix-story-signal{position:absolute;top:26px;left:28px;z-index:var(--uix-z-raised)}.uix-story-signal__value{display:block;font-family:var(--uix-font-heading);font-size:48px;font-weight:400;letter-spacing:-.04em;line-height:1}.uix-story-signal__label{display:block;margin-top:var(--uix-space-2);color:var(--uix-text-hushed);font-size:var(--uix-text-meta)}.uix-story-diagram{width:min(100%,500px);position:relative;z-index:var(--uix-z-raised);display:grid;grid-template-columns:repeat(3,1fr);align-items:end;gap:var(--uix-space-3)}.uix-story-diagram__bar{min-height:52px;border:1px solid var(--uix-border-strong);border-radius:var(--uix-radius-sm);background:color-mix(in srgb,var(--uix-surface) 84%,transparent)}.uix-story-diagram__bar:nth-child(2){min-height:104px}.uix-story-diagram__bar:nth-child(3){min-height:126px;background:var(--uix-text)}.uix-rundown{min-width:0;padding:var(--uix-space-4);display:grid;grid-template-rows:auto minmax(0,1fr);gap:var(--uix-space-3);border-left:1px solid var(--uix-border)}.uix-rundown__head{padding:var(--uix-space-1) var(--uix-space-1) var(--uix-space-3);display:flex;align-items:flex-start;justify-content:space-between;gap:var(--uix-space-3);border-bottom:1px solid var(--uix-border)}.uix-rundown__eyebrow{margin:0;color:var(--uix-text-hushed);font-size:var(--uix-text-eyebrow);letter-spacing:.05em;text-transform:uppercase}.uix-rundown__title{margin:var(--uix-space-1) 0 0;font-family:var(--uix-font-heading);font-size:18px;font-weight:400}.uix-rundown__items{min-width:0;display:grid;grid-template-rows:repeat(3,minmax(0,1fr));gap:var(--uix-space-2)}.uix-rundown__item{position:relative;min-width:0;min-height:68px;padding:var(--uix-space-3);display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:var(--uix-space-3);border:1px solid transparent;border-radius:var(--uix-radius-sm);background:transparent;color:var(--uix-text);cursor:pointer;font:inherit;text-align:left}.uix-rundown__item:hover{background:var(--uix-bg-hover)}.uix-rundown__item[data-selected=true]{border-color:var(--uix-border);background:var(--uix-bg-active)}.uix-rundown__item[data-selected=true]:before{content:"";position:absolute;top:50%;left:-23px;width:12px;height:12px;transform:translateY(-50%) rotate(45deg);background:var(--uix-surface);border-left:1px solid var(--uix-border-strong);border-bottom:1px solid var(--uix-border-strong)}.uix-rundown__number{color:var(--uix-text-hushed);font-size:var(--uix-text-eyebrow);font-variant-numeric:tabular-nums}.uix-rundown__item[data-selected=true] .uix-rundown__number{min-width:22px;height:22px;display:inline-grid;place-items:center;border-radius:var(--uix-radius-pill);background:var(--uix-text);color:var(--uix-bg-app)}.uix-rundown__topic,.uix-rundown__item-title{display:block}.uix-rundown__topic{color:var(--uix-text-hushed);font-size:var(--uix-text-eyebrow)}.uix-rundown__item-title{margin-top:var(--uix-space-1);font-weight:600;line-height:1.2}.uix-section-head{min-height:36px;margin-bottom:var(--uix-space-3);display:flex;align-items:center;justify-content:space-between;gap:var(--uix-space-4)}.uix-section-title{margin:0;font-family:var(--uix-font-heading);font-size:var(--uix-text-h2);font-weight:400;letter-spacing:var(--uix-tracking-tight)}.uix-section-link{color:var(--uix-text-hushed);font-size:var(--uix-text-meta);text-decoration:none}.uix-section-link:is(:hover,:focus-visible){color:var(--uix-text);text-decoration:underline}.uix-content-grid{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(280px,.75fr);gap:var(--uix-space-7);align-items:start}.uix-content-grid--balanced{grid-template-columns:repeat(2,minmax(0,1fr))}.uix-content-grid>*{min-width:0}.uix-rail{display:grid;gap:var(--uix-space-4)}.uix-rail-card{padding:var(--uix-space-5)}.uix-rail-card__title{margin:0;font-family:var(--uix-font-heading);font-size:18px;font-weight:400}.uix-rail-card__meta{margin:var(--uix-space-1) 0 0;color:var(--uix-text-hushed);font-size:var(--uix-text-meta)}.uix-news-lead{padding:0 0 var(--uix-space-5);border-bottom:1px solid var(--uix-border)}.uix-news-lead__meta,.uix-list-meta{color:var(--uix-text-hushed);font-size:var(--uix-text-meta)}.uix-news-lead__title{margin:var(--uix-space-2) 0 var(--uix-space-1);font-family:var(--uix-font-heading);font-size:var(--uix-text-h2);font-weight:400;letter-spacing:var(--uix-tracking-tight)}.uix-news-lead__summary{margin:0;color:var(--uix-text-hushed)}.uix-content-list{margin:0;padding:0;list-style:none}.uix-content-list__item{min-height:68px;padding:var(--uix-space-3) 0;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:var(--uix-space-4);border-bottom:1px solid var(--uix-border)}.uix-content-list__item:last-child{border-bottom:0}.uix-content-list__title{margin:0;font-weight:600}.uix-content-list__meta{margin:var(--uix-space-1) 0 0;color:var(--uix-text-hushed);font-size:var(--uix-text-meta)}.uix-resource-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--uix-space-2)}.uix-resource-grid .uix-btn{min-height:44px;justify-content:flex-start}.uix-stat-line{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--uix-border)}.uix-stat-line__item{padding:var(--uix-space-4) var(--uix-space-2) var(--uix-space-1) 0}.uix-stat-line__value{display:block;font-size:20px;font-variant-numeric:tabular-nums}.uix-stat-line__label{color:var(--uix-text-hushed);font-size:var(--uix-text-eyebrow)}.uix-event-row{min-height:64px;padding-block:var(--uix-space-3);display:grid;grid-template-columns:42px minmax(0,1fr);align-items:center;gap:var(--uix-space-3);border-bottom:1px solid var(--uix-border)}.uix-event-row:last-child{border-bottom:0}.uix-event-date{text-align:center}.uix-event-date__month{display:block;color:var(--uix-text-hushed);font-size:var(--uix-text-eyebrow);text-transform:uppercase}.uix-event-date__day{display:block;font-size:18px;font-variant-numeric:tabular-nums}.uix-event-row__title{margin:0;font-weight:600}.uix-event-row__meta{margin:var(--uix-space-1) 0 0;color:var(--uix-text-hushed);font-size:var(--uix-text-meta)}.uix-status-row{min-height:48px;display:flex;align-items:center;gap:var(--uix-space-3);border-bottom:1px solid var(--uix-border)}.uix-status-row:last-child{border-bottom:0}.uix-status-row__name{flex:1}@media(max-width:920px){.uix-page-intro,.uix-content-grid,.uix-content-grid--balanced,.uix-featured{grid-template-columns:1fr}.uix-rundown{border-left:0;border-top:1px solid var(--uix-border)}.uix-rundown__items{grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:1fr}.uix-rundown__item[data-selected=true]:before{top:-23px;left:22px;transform:rotate(45deg);border-bottom:0;border-top:1px solid var(--uix-border-strong)}.uix-shortcut-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:620px){.uix-featured__stage{grid-template-columns:1fr}.uix-featured__visual{min-height:190px}.uix-featured__content{padding:var(--uix-space-6)}.uix-rundown__items{grid-template-columns:1fr;grid-template-rows:repeat(3,auto)}.uix-rundown__item[data-selected=true]:before{display:none}.uix-notice{grid-template-columns:auto minmax(0,1fr)}.uix-notice>.uix-btn{grid-column:2;justify-self:start}.uix-notice__actions{grid-column:1 / -1;width:100%;justify-content:flex-start;flex-wrap:wrap}.uix-notice__position{flex:1}.uix-searchbar{grid-template-columns:1fr}.uix-searchbar .uix-btn{min-height:44px}.uix-page-intro{margin-top:var(--uix-space-5);gap:var(--uix-space-5)}.uix-shortcut-grid{grid-template-columns:1fr 1fr}.uix-shortcut-grid .uix-btn{min-height:48px}.uix-story-signal{top:20px;left:20px}.uix-story-signal__value{font-size:var(--uix-text-display)}.uix-resource-grid,.uix-stat-line{grid-template-columns:1fr}.uix-stat-line__item{display:flex;align-items:baseline;justify-content:space-between;border-bottom:1px solid var(--uix-border)}}}@layer uix.components{.uix-link--quiet,:is(.uix-featured__title,.uix-rail-card__title,.uix-news-lead__title,.uix-content-list__title,.uix-rundown__item-title,.uix-event-row__title,.uix-status-row__name,.uix-card__title,.uix-list__title,.uix-inbox__subject,.uix-kanban__card-title,.uix-media__name,.uix-attachment__name,.uix-contact__name,.uix-user-chip__name,.uix-audit__actor) a:not(.uix-btn),:is(.uix-table td,.uix-dl dd) a:not([class]),a:is(.uix-card,.uix-stat,.uix-list__item,.uix-inbox__item,.uix-kanban__card,.uix-notif,.uix-media,.uix-attachment,.uix-contact,.uix-cmdk__item,.uix-content-list__item,.uix-event-row,.uix-status-row){color:inherit;text-decoration:none}.uix-link--quiet:is(:hover,:focus-visible),:is(.uix-featured__title,.uix-rail-card__title,.uix-news-lead__title,.uix-content-list__title,.uix-rundown__item-title,.uix-event-row__title,.uix-status-row__name,.uix-card__title,.uix-list__title,.uix-inbox__subject,.uix-kanban__card-title,.uix-media__name,.uix-attachment__name,.uix-contact__name,.uix-user-chip__name,.uix-audit__actor) a:not(.uix-btn):is(:hover,:focus-visible),:is(.uix-table td,.uix-dl dd) a:not([class]):is(:hover,:focus-visible){text-decoration:underline}a:is(.uix-card,.uix-stat,.uix-list__item,.uix-inbox__item,.uix-kanban__card,.uix-notif,.uix-media,.uix-attachment,.uix-contact,.uix-cmdk__item,.uix-content-list__item,.uix-event-row,.uix-status-row):is(:hover,:focus-visible){background:var(--uix-bg-hover)}a:is(.uix-card,.uix-stat,.uix-kanban__card){display:block}}