@ponchia/ui 0.3.1 → 0.3.2

package/classes/index.d.ts

@@ -14,15 +14,27 @@ export declare const cls: {
   readonly cardHead: 'ui-card__head';
   readonly cardAccent: 'ui-card--accent';
   readonly cardInteractive: 'ui-card--interactive';
+  readonly stat: 'ui-stat';
+  readonly statgrid: 'ui-statgrid';
+  readonly statLabel: 'ui-stat__label';
+  readonly statValue: 'ui-stat__value';
+  readonly statDelta: 'ui-stat__delta';
+  readonly num: 'ui-num';
+  readonly numPos: 'ui-num--pos';
+  readonly numNeg: 'ui-num--neg';
+  readonly numMuted: 'ui-num--muted';
   readonly badge: 'ui-badge';
   readonly badgeAccent: 'ui-badge--accent';
   readonly badgeSuccess: 'ui-badge--success';
   readonly badgeWarning: 'ui-badge--warning';
   readonly badgeDanger: 'ui-badge--danger';
+  readonly badgeMuted: 'ui-badge--muted';
+  readonly badgeDot: 'ui-badge--dot';
   readonly chip: 'ui-chip';
   readonly chipAccent: 'ui-chip--accent';
   readonly link: 'ui-link';
   readonly linkArrow: 'ui-link--arrow';
+  readonly linkCta: 'ui-link--cta';
   readonly keyValue: 'ui-key-value';
   readonly dot: 'ui-dot';
   readonly dotAccent: 'ui-dot--accent';
@@ -33,6 +45,10 @@ export declare const cls: {
   readonly dotgrid: 'ui-dotgrid';
   readonly dotgridAccent: 'ui-dotgrid--accent';
   readonly dotgridDense: 'ui-dotgrid--dense';
+  readonly dotmatrix: 'ui-dotmatrix';
+  readonly dotmatrixCell: 'ui-dotmatrix__cell';
+  readonly dotmatrixCellHot: 'ui-dotmatrix__cell--hot';
+  readonly dotmatrixCellAccent: 'ui-dotmatrix__cell--accent';
   readonly dotfield: 'ui-dotfield';
   readonly dotrule: 'ui-dotrule';
   readonly dotbar: 'ui-dotbar';
@@ -145,14 +161,17 @@ export declare const cls: {
   readonly status: 'ui-status';
   readonly eyebrow: 'ui-eyebrow';
   readonly eyebrowMuted: 'ui-eyebrow--muted';
+  readonly eyebrowSm: 'ui-eyebrow--sm';
   readonly prose: 'ui-prose';
   readonly proseCompact: 'ui-prose--compact';
   readonly quote: 'ui-quote';
   readonly quoteCite: 'ui-quote__cite';
   readonly container: 'ui-container';
   readonly containerNarrow: 'ui-container--narrow';
+  readonly containerWide: 'ui-container--wide';
   readonly skiplink: 'ui-skiplink';
   readonly siteheader: 'ui-siteheader';
+  readonly siteheaderSticky: 'ui-siteheader--sticky';
   readonly siteheaderBrand: 'ui-siteheader__brand';
   readonly siteheaderActions: 'ui-siteheader__actions';
   readonly sitenav: 'ui-sitenav';
@@ -222,13 +241,18 @@ export interface CardOpts {
   interactive?: boolean;
 }
 export interface BadgeOpts {
-  tone?: 'accent' | 'success' | 'warning' | 'danger';
+  tone?: 'accent' | 'success' | 'warning' | 'danger' | 'muted';
+  dot?: boolean;
+}
+export interface NumOpts {
+  tone?: 'pos' | 'neg' | 'muted';
 }
 export interface ChipOpts {
   accent?: boolean;
 }
 export interface LinkOpts {
   arrow?: boolean;
+  cta?: boolean;
 }
 export interface DotOpts {
   tone?: 'accent' | 'success' | 'warning' | 'danger';
@@ -244,6 +268,7 @@ export interface TableOpts {
 }
 export interface EyebrowOpts {
   muted?: boolean;
+  sm?: boolean;
 }
 export interface HintOpts {
   error?: boolean;
@@ -284,6 +309,7 @@ export interface ProseOpts {
 }
 export interface ContainerOpts {
   narrow?: boolean;
+  wide?: boolean;
 }
 export interface TagOpts {
   accent?: boolean;
@@ -293,6 +319,7 @@ export interface Ui {
   button(opts?: ButtonOpts): string;
   card(opts?: CardOpts): string;
   badge(opts?: BadgeOpts): string;
+  num(opts?: NumOpts): string;
   chip(opts?: ChipOpts): string;
   link(opts?: LinkOpts): string;
   dot(opts?: DotOpts): string;

package/classes/index.js

@@ -27,15 +27,27 @@ export const cls = Object.freeze({
   cardHead: 'ui-card__head',
   cardAccent: 'ui-card--accent',
   cardInteractive: 'ui-card--interactive',
+  stat: 'ui-stat',
+  statgrid: 'ui-statgrid',
+  statLabel: 'ui-stat__label',
+  statValue: 'ui-stat__value',
+  statDelta: 'ui-stat__delta',
+  num: 'ui-num',
+  numPos: 'ui-num--pos',
+  numNeg: 'ui-num--neg',
+  numMuted: 'ui-num--muted',
   badge: 'ui-badge',
   badgeAccent: 'ui-badge--accent',
   badgeSuccess: 'ui-badge--success',
   badgeWarning: 'ui-badge--warning',
   badgeDanger: 'ui-badge--danger',
+  badgeMuted: 'ui-badge--muted',
+  badgeDot: 'ui-badge--dot',
   chip: 'ui-chip',
   chipAccent: 'ui-chip--accent',
   link: 'ui-link',
   linkArrow: 'ui-link--arrow',
+  linkCta: 'ui-link--cta',
   keyValue: 'ui-key-value',
   // dots
   dot: 'ui-dot',
@@ -47,6 +59,10 @@ export const cls = Object.freeze({
   dotgrid: 'ui-dotgrid',
   dotgridAccent: 'ui-dotgrid--accent',
   dotgridDense: 'ui-dotgrid--dense',
+  dotmatrix: 'ui-dotmatrix',
+  dotmatrixCell: 'ui-dotmatrix__cell',
+  dotmatrixCellHot: 'ui-dotmatrix__cell--hot',
+  dotmatrixCellAccent: 'ui-dotmatrix__cell--accent',
   dotfield: 'ui-dotfield',
   dotrule: 'ui-dotrule',
   dotbar: 'ui-dotbar',
@@ -166,6 +182,7 @@ export const cls = Object.freeze({
   // typography / utilities
   eyebrow: 'ui-eyebrow',
   eyebrowMuted: 'ui-eyebrow--muted',
+  eyebrowSm: 'ui-eyebrow--sm',
   prose: 'ui-prose',
   proseCompact: 'ui-prose--compact',
   quote: 'ui-quote',
@@ -173,8 +190,10 @@ export const cls = Object.freeze({
   // site shell
   container: 'ui-container',
   containerNarrow: 'ui-container--narrow',
+  containerWide: 'ui-container--wide',
   skiplink: 'ui-skiplink',
   siteheader: 'ui-siteheader',
+  siteheaderSticky: 'ui-siteheader--sticky',
   siteheaderBrand: 'ui-siteheader__brand',
   siteheaderActions: 'ui-siteheader__actions',
   sitenav: 'ui-sitenav',
@@ -255,16 +274,25 @@ export const ui = {
     ),
   card: ({ accent, interactive } = {}) =>
     j(cls.card, accent && cls.cardAccent, interactive && cls.cardInteractive),
-  badge: ({ tone } = {}) =>
+  badge: ({ tone, dot } = {}) =>
     j(
       cls.badge,
       tone === 'accent' && cls.badgeAccent,
       tone === 'success' && cls.badgeSuccess,
       tone === 'warning' && cls.badgeWarning,
       tone === 'danger' && cls.badgeDanger,
+      tone === 'muted' && cls.badgeMuted,
+      dot && cls.badgeDot,
+    ),
+  num: ({ tone } = {}) =>
+    j(
+      cls.num,
+      tone === 'pos' && cls.numPos,
+      tone === 'neg' && cls.numNeg,
+      tone === 'muted' && cls.numMuted,
     ),
   chip: ({ accent } = {}) => j(cls.chip, accent && cls.chipAccent),
-  link: ({ arrow } = {}) => j(cls.link, arrow && cls.linkArrow),
+  link: ({ arrow, cta } = {}) => j(cls.link, arrow && cls.linkArrow, cta && cls.linkCta),
   dot: ({ tone, live } = {}) =>
     j(
       cls.dot,
@@ -283,7 +311,7 @@ export const ui = {
       density === 'comfortable' && cls.tableComfortable,
       lined && cls.tableLined,
     ),
-  eyebrow: ({ muted } = {}) => j(cls.eyebrow, muted && cls.eyebrowMuted),
+  eyebrow: ({ muted, sm } = {}) => j(cls.eyebrow, muted && cls.eyebrowMuted, sm && cls.eyebrowSm),
   hint: ({ error } = {}) => j(cls.hint, error && cls.hintError),
   cluster: ({ between } = {}) => j(cls.cluster, between && cls.clusterBetween),
   stagger: ({ auto } = {}) => j(cls.stagger, auto && cls.staggerAuto),
@@ -312,7 +340,8 @@ export const ui = {
   avatar: ({ size } = {}) =>
     j(cls.avatar, size === 'sm' && cls.avatarSm, size === 'lg' && cls.avatarLg),
   prose: ({ compact } = {}) => j(cls.prose, compact && cls.proseCompact),
-  container: ({ narrow } = {}) => j(cls.container, narrow && cls.containerNarrow),
+  container: ({ narrow, wide } = {}) =>
+    j(cls.container, narrow && cls.containerNarrow, wide && cls.containerWide),
   tag: ({ accent } = {}) => j(cls.tag, accent && cls.tagAccent),
 };
 

package/css/app.css

@@ -202,61 +202,12 @@
   margin: 0.3rem 0 0;
 }
 
-/* --- Metric tiles --- */
-
-.ui-app-metrics {
-  display: grid;
-  gap: var(--space-md);
-  grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr));
-}
-
-/* Inside an opt-in .ui-cq container, collapse to one column when the
-   container (not the viewport) is narrow — keeps metric tiles usable
-   in a slim panel. Inert without .ui-cq, so baselines are unaffected. */
-@container bronto (max-width: 30rem) {
-  .ui-app-metrics {
-    grid-template-columns: 1fr;
-  }
-}
-
-.ui-app-metric {
-  background: var(--panel);
-  border: 1px solid var(--line);
-  border-radius: var(--radius-md);
-  display: grid;
-  gap: 0.4rem;
-  padding: var(--space-md);
-}
-
-.ui-app-metric__label {
-  color: var(--text-dim);
-  font-family: var(--mono);
-  font-size: var(--text-2xs);
-  letter-spacing: var(--tracking-wide);
-  text-transform: uppercase;
-}
-
-.ui-app-metric__value {
-  color: var(--text);
-  font-family: var(--display);
-  font-size: 1.9rem;
-  font-variant-numeric: tabular-nums;
-  letter-spacing: 0.01em;
-  line-height: 1;
-}
-
-.ui-app-metric__delta {
-  font-family: var(--mono);
-  font-size: var(--text-xs);
-}
-
-.ui-app-metric__delta.is-pos {
-  color: var(--success);
-}
-
-.ui-app-metric__delta.is-neg {
-  color: var(--danger);
-}
+/* --- Metric tiles ---
+   The metric primitive itself is shell-agnostic and now lives in
+   primitives.css as `.ui-stat` / `.ui-statgrid`; `.ui-app-metric*` and
+   `.ui-app-metrics` remain as permanent admin-shell aliases (grouped on
+   the canonical rules there — identical output). Nothing app-specific
+   left to define here. */
 
 /* --- Empty state --- */
 

package/css/dots.css

@@ -44,6 +44,30 @@
   inline-size: 100%;
 }
 
+/* Data-bound dot matrix — a grid of state cells (activity / heatmap),
+   the on-brand counterpart to the decorative .ui-dotgrid background.
+   This is the grid + cell tones only; the data→cell mapping is the
+   consumer's. Tune density via --dotmatrix-cols / --dotmatrix-gap. */
+.ui-dotmatrix {
+  display: grid;
+  gap: var(--dotmatrix-gap, 0.5rem);
+  grid-template-columns: repeat(var(--dotmatrix-cols, 12), minmax(0, 1fr));
+}
+
+.ui-dotmatrix__cell {
+  aspect-ratio: 1;
+  background: var(--field-dot);
+  border-radius: 50%;
+}
+
+.ui-dotmatrix__cell--hot {
+  background: var(--field-dot-hot);
+}
+
+.ui-dotmatrix__cell--accent {
+  background: var(--field-dot-accent);
+}
+
 /* Status dot — the glyph-style state indicator. */
 .ui-dot {
   background: var(--text-dim);

package/css/primitives.css

@@ -128,6 +128,13 @@
   border-color: var(--accent);
 }
 
+/* Interactive cards usually wrap a single link; keyboard users get no
+   hover, so surface the focused state on the card itself (not pointer-
+   gated — lives outside the @media (hover) block below). */
+.ui-card--interactive:focus-within {
+  border-color: var(--line-strong);
+}
+
 .ui-card__head,
 .ui-panel__head {
   align-items: flex-start;
@@ -142,6 +149,95 @@
   margin: 0;
 }
 
+/* --- Stat / metric tile — shell-agnostic ---
+   The canonical metric primitive. `.ui-app-metric*` / `.ui-app-metrics`
+   are permanent aliases grouped here so the admin shell keeps working
+   with byte-identical output (no baseline drift). */
+
+.ui-statgrid,
+.ui-app-metrics {
+  display: grid;
+  gap: var(--space-md);
+  grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr));
+}
+
+/* Inside an opt-in .ui-cq container, collapse to one column when the
+   container (not the viewport) is narrow — keeps tiles usable in a slim
+   panel. Inert without .ui-cq, so baselines are unaffected. */
+@container bronto (max-width: 30rem) {
+  .ui-statgrid,
+  .ui-app-metrics {
+    grid-template-columns: 1fr;
+  }
+}
+
+.ui-stat,
+.ui-app-metric {
+  background: var(--panel);
+  border: 1px solid var(--line);
+  border-radius: var(--radius-md);
+  display: grid;
+  gap: 0.4rem;
+  padding: var(--space-md);
+}
+
+.ui-stat__label,
+.ui-app-metric__label {
+  color: var(--text-dim);
+  font-family: var(--mono);
+  font-size: var(--text-2xs);
+  letter-spacing: var(--tracking-wide);
+  text-transform: uppercase;
+}
+
+.ui-stat__value,
+.ui-app-metric__value {
+  color: var(--text);
+  font-family: var(--display);
+  font-size: 1.9rem;
+  font-variant-numeric: tabular-nums;
+  letter-spacing: 0.01em;
+  line-height: 1;
+}
+
+.ui-stat__delta,
+.ui-app-metric__delta {
+  font-family: var(--mono);
+  font-size: var(--text-xs);
+}
+
+.ui-stat__delta.is-pos,
+.ui-app-metric__delta.is-pos {
+  color: var(--success);
+}
+
+.ui-stat__delta.is-neg,
+.ui-app-metric__delta.is-neg {
+  color: var(--danger);
+}
+
+/* --- Numeric value vocabulary ---
+   The same tabular/aligned/tone intent the table has shipped since
+   0.1.0, but freed from `.ui-table` so cards, stats and inline figures
+   share one P&L vocabulary. Token-identical to the table's is-num/
+   is-pos/is-neg (which stay table-local). */
+.ui-num {
+  font-variant-numeric: tabular-nums;
+  text-align: end;
+}
+
+.ui-num--pos {
+  color: var(--success);
+}
+
+.ui-num--neg {
+  color: var(--danger);
+}
+
+.ui-num--muted {
+  color: var(--text-dim);
+}
+
 /* --- Eyebrow / section label — dot-matrix face --- */
 
 .ui-eyebrow {
@@ -160,6 +256,12 @@
   color: var(--text-dim);
 }
 
+/* Dense contexts (cards, table toolbars) — restores the size step that
+   0.2.2 had as eyebrow--tight. Composes with --muted. */
+.ui-eyebrow--sm {
+  font-size: var(--text-2xs);
+}
+
 /* --- Buttons --- */
 
 .ui-button {
@@ -261,14 +363,26 @@
     text-decoration-color var(--duration-fast) var(--ease-standard);
 }
 
-.ui-link--arrow {
+.ui-link--arrow,
+.ui-link--cta {
   align-items: center;
   display: inline-flex;
   gap: 0.4rem;
   text-decoration: none;
 }
 
-.ui-link--arrow::after {
+/* CTA: the eyebrow-faced action link (accent · display · uppercase),
+   composed from the same tokens as .ui-eyebrow + the arrow glyph. */
+.ui-link--cta {
+  color: var(--accent-text);
+  font-family: var(--display);
+  font-weight: 700;
+  letter-spacing: var(--tracking-wide);
+  text-transform: uppercase;
+}
+
+.ui-link--arrow::after,
+.ui-link--cta::after {
   border-inline-end: 1px solid currentColor;
   border-block-start: 1px solid currentColor;
   content: '';
@@ -345,6 +459,42 @@
   border-color: color-mix(in srgb, var(--danger) 40%, var(--line));
 }
 
+/* Idle / unknown — the honest "no signal yet" tone (distinct from the
+   default tinted badge). Token-safe; no new hue. */
+.ui-badge--muted {
+  background: transparent;
+  border-color: var(--line);
+  color: var(--text-dim);
+}
+
+/* Leading state dot — composes with any tone modifier; the dot takes
+   the tone via currentColor-adjacent text, but stays neutral-strong so
+   it reads on the soft tint (same WCAG rationale as the tone note). */
+.ui-badge--dot::before {
+  background: var(--text-soft);
+  border-radius: 50%;
+  content: '';
+  flex: 0 0 auto;
+  block-size: 0.4rem;
+  inline-size: 0.4rem;
+}
+
+.ui-badge--accent.ui-badge--dot::before {
+  background: var(--accent);
+}
+
+.ui-badge--success.ui-badge--dot::before {
+  background: var(--success);
+}
+
+.ui-badge--warning.ui-badge--dot::before {
+  background: var(--warning);
+}
+
+.ui-badge--danger.ui-badge--dot::before {
+  background: var(--danger);
+}
+
 /* --- Key/value list --- */
 
 .ui-key-value {
@@ -384,6 +534,7 @@
   }
 
   .ui-card--interactive:hover {
+    box-shadow: var(--shadow-raised);
     transform: translateY(-2px);
   }
 
@@ -408,11 +559,13 @@
     text-decoration-color: var(--accent);
   }
 
-  .ui-link--arrow:hover::after {
+  .ui-link--arrow:hover::after,
+  .ui-link--cta:hover::after {
     transform: translateX(0.14rem) rotate(45deg);
   }
 
-  [dir='rtl'] .ui-link--arrow:hover::after {
+  [dir='rtl'] .ui-link--arrow:hover::after,
+  [dir='rtl'] .ui-link--cta:hover::after {
     transform: translateX(-0.14rem) rotate(45deg);
   }
 

package/css/site.css

@@ -21,6 +21,12 @@
   max-inline-size: var(--container-narrow, 44rem);
 }
 
+/* App / marketing shells run wider than the 72rem reading measure.
+   Override the cap per-consumer via --container-wide. */
+.ui-container--wide {
+  max-inline-size: var(--container-wide, 82rem);
+}
+
 /* --- Skip link — first focusable, jumps to main --- */
 
 .ui-skiplink {
@@ -51,6 +57,14 @@
   padding-block: var(--space-sm);
 }
 
+/* Structural sticky only — the floating-card skin (radius/shadow/panel
+   bg) is consumer identity, not a framework concern; layer it yourself. */
+.ui-siteheader--sticky {
+  position: sticky;
+  inset-block-start: 0;
+  z-index: var(--z-sticky);
+}
+
 .ui-siteheader__brand {
   align-items: center;
   color: var(--text);

package/dist/bronto.css

@@ -1 +1 @@
-@layer bronto{:root{--radius-xl: 4px;--radius-lg: 3px;--radius-md: 2px;--radius-sm: 1px;--radius-pill: 999px;--space-2xs: 0.25rem;--space-xs: 0.5rem;--space-sm: 0.75rem;--space-md: 1rem;--space-lg: 1.35rem;--space-xl: 1.75rem;--space-2xl: 2.5rem;--mono: 'JetBrains Mono','Fira Code','Cascadia Code','SF Mono',ui-monospace,monospace;--sans: 'Inter','SF Pro Text',-apple-system,BlinkMacSystemFont,'Segoe UI',system-ui,sans-serif;--display: 'Doto',var(--mono);--dot-font: 'Doto',var(--mono);--text-2xs: 0.68rem;--text-xs: 0.76rem;--text-sm: 0.86rem;--text-base: 0.95rem;--text-lg: 1.15rem;--text-xl: 1.45rem;--tracking-wide: 0.14em;--tracking-wider: 0.22em;--ease-standard: cubic-bezier(0.2,0.8,0.2,1);--ease-spring: cubic-bezier(0.16,1,0.3,1);--ease-out: cubic-bezier(0.33,1,0.68,1);--duration-fast: 130ms;--duration-base: 200ms;--duration-slow: 360ms;--dot-size: 2px;--dot-gap: 14px;--z-base: 0;--z-raised: 10;--z-sticky: 20;--z-overlay: 30;--z-popover: 50;--z-toast: 60;--accent-1: color-mix(in srgb,var(--accent) 8%,var(--bg));--accent-2: color-mix(in srgb,var(--accent) 16%,var(--bg));--accent-3: color-mix(in srgb,var(--accent) 32%,var(--bg));--accent-4: color-mix(in srgb,var(--accent) 60%,var(--bg));--accent-5: var(--accent);--accent-6: var(--accent-strong);--surface-1: var(--bg);--surface-2: var(--bg-elevated);--surface-3: var(--panel);--surface-4: var(--panel-soft);--surface-5: var(--line);--surface-6: var(--line-strong);--bronto-color-bg: var(--bg);--bronto-color-surface: var(--panel);--bronto-color-surface-raised: var(--panel-strong);--bronto-color-border: var(--line);--bronto-color-border-strong: var(--line-strong);--bronto-color-text: var(--text);--bronto-color-text-muted: var(--text-dim);--bronto-color-action: var(--accent);--bronto-color-on-action: var(--button-text);--bronto-color-focus: var(--focus-ring);--bronto-color-success: var(--success);--bronto-color-warning: var(--warning);--bronto-color-danger: var(--danger);--surface: var(--panel);--surface-raised: var(--panel-strong);--surface-muted: var(--panel-soft);--border: var(--line);--border-strong: var(--line-strong)}:root,:root[data-theme='light']{color-scheme: light;--bg: #f4f4f2;--bg-elevated: #fbfbfa;--bg-accent: color-mix(in srgb,var(--accent) 6%,transparent);--panel: #ffffff;--panel-strong: #ffffff;--panel-soft: #ececea;--line: #d8d8d4;--line-strong: #a8a8a2;--text: #0a0a0a;--text-soft: #353533;--text-dim: #686863;--accent: #d71921;--accent-strong: color-mix(in srgb,var(--accent) 83%,#000);--accent-text: var(--accent-strong);--accent-soft: color-mix(in srgb,var(--accent) 10%,transparent);--success: #2f7d4f;--success-soft: rgb(47,125,79,0.12);--warning: #806414;--warning-soft: rgb(128,100,20,0.13);--orange: #a85f32;--orange-soft: rgb(168,95,50,0.13);--danger: #c01622;--danger-soft: rgb(192,22,34,0.1);--code-bg: rgb(10,10,10,0.05);--button-text: #ffffff;--field-dot: rgb(10,10,10,0.16);--field-dot-hot: rgb(10,10,10,0.4);--field-dot-accent: color-mix(in srgb,var(--accent) 78%,transparent);--focus-ring: var(--accent);--shadow: none;--shadow-raised: 0 0 0 1px var(--line-strong)}@media (prefers-color-scheme: dark){:root:not([data-theme='light']){color-scheme: dark;--bg: #000000;--bg-elevated: #0a0a0a;--bg-accent: color-mix(in srgb,var(--accent) 8%,transparent);--panel: #0c0c0c;--panel-strong: #141414;--panel-soft: #1a1a1a;--line: #2a2a2a;--line-strong: #444444;--text: #f2f2f2;--text-soft: #c4c4c4;--text-dim: #858585;--accent: #ff3b41;--accent-strong: color-mix(in srgb,var(--accent) 84%,#fff);--accent-text: var(--accent-strong);--accent-soft: color-mix(in srgb,var(--accent) 14%,transparent);--success: #4ec27e;--success-soft: rgb(78,194,126,0.14);--warning: #d8bd72;--warning-soft: rgb(216,189,114,0.14);--orange: #d08c5b;--orange-soft: rgb(208,140,91,0.15);--danger: #ff4d54;--danger-soft: rgb(255,77,84,0.15);--code-bg: rgb(255,255,255,0.05);--button-text: #000000;--field-dot: rgb(242,242,242,0.14);--field-dot-hot: rgb(242,242,242,0.36);--field-dot-accent: color-mix(in srgb,var(--accent) 82%,transparent);--focus-ring: var(--accent);--shadow: none;--shadow-raised: 0 0 0 1px var(--line-strong)}}:root[data-theme='dark']{color-scheme: dark;--bg: #000000;--bg-elevated: #0a0a0a;--bg-accent: color-mix(in srgb,var(--accent) 8%,transparent);--panel: #0c0c0c;--panel-strong: #141414;--panel-soft: #1a1a1a;--line: #2a2a2a;--line-strong: #444444;--text: #f2f2f2;--text-soft: #c4c4c4;--text-dim: #858585;--accent: #ff3b41;--accent-strong: color-mix(in srgb,var(--accent) 84%,#fff);--accent-text: var(--accent-strong);--accent-soft: color-mix(in srgb,var(--accent) 14%,transparent);--success: #4ec27e;--success-soft: rgb(78,194,126,0.14);--warning: #d8bd72;--warning-soft: rgb(216,189,114,0.14);--orange: #d08c5b;--orange-soft: rgb(208,140,91,0.15);--danger: #ff4d54;--danger-soft: rgb(255,77,84,0.15);--code-bg: rgb(255,255,255,0.05);--button-text: #000000;--field-dot: rgb(242,242,242,0.14);--field-dot-hot: rgb(242,242,242,0.36);--field-dot-accent: color-mix(in srgb,var(--accent) 82%,transparent);--focus-ring: var(--accent);--shadow: none;--shadow-raised: 0 0 0 1px var(--line-strong)}[data-density='compact']{--space-2xs: 0.2rem;--space-xs: 0.4rem;--space-sm: 0.6rem;--space-md: 0.8rem;--space-lg: 1.05rem;--space-xl: 1.35rem;--space-2xl: 1.9rem}[data-density='comfortable']{--space-2xs: 0.3rem;--space-xs: 0.6rem;--space-sm: 0.95rem;--space-md: 1.25rem;--space-lg: 1.7rem;--space-xl: 2.2rem;--space-2xl: 3.1rem}[data-contrast='high']{--line: var(--line-strong);--text-dim: var(--text-soft);--focus-ring: var(--accent);--shadow-raised: 0 0 0 1px var(--text)}@media (prefers-contrast: more){:root{--line: var(--line-strong);--text-dim: var(--text-soft);--focus-ring: var(--accent);--shadow-raised: 0 0 0 1px var(--text)}}@font-face{font-family: Doto;font-style: normal;font-weight: 400;font-display: swap;src: url('../fonts/doto-400.ttf') format('truetype')}@font-face{font-family: Doto;font-style: normal;font-weight: 500;font-display: swap;src: url('../fonts/doto-500.ttf') format('truetype')}@font-face{font-family: Doto;font-style: normal;font-weight: 600;font-display: swap;src: url('../fonts/doto-600.ttf') format('truetype')}@font-face{font-family: Doto;font-style: normal;font-weight: 700;font-display: swap;src: url('../fonts/doto-700.ttf') format('truetype')}@font-face{font-family: Doto;font-style: normal;font-weight: 800;font-display: swap;src: url('../fonts/doto-800.ttf') format('truetype')}@font-face{font-family: Doto;font-style: normal;font-weight: 900;font-display: swap;src: url('../fonts/doto-900.ttf') format('truetype')}@media (prefers-reduced-data: reduce){:root{--display: var(--mono);--dot-font: var(--mono)}}*,*::before,*::after{box-sizing: border-box}html{background: var(--bg);color: var(--text);font-family: var(--sans);font-size: 15px;line-height: 1.55;scroll-behavior: smooth;text-rendering: optimizeLegibility;-webkit-font-smoothing: antialiased}body{accent-color: var(--accent);background: var(--bg);color: var(--text);margin: 0;min-block-size: 100vh;position: relative}main [id]{scroll-margin-top: 6rem}::selection{background: var(--accent);color: var(--button-text)}a{color: inherit;text-decoration: none}a,button,summary{-webkit-tap-highlight-color: transparent}button,input,select,textarea{font: inherit}img,svg{display: block;max-inline-size: 100%}p,li{color: var(--text-soft);line-height: 1.65}h1,h2,h3,h4{color: var(--text);font-family: var(--display);font-weight: 700;letter-spacing: 0.01em;line-height: 1.06;margin: 0;text-transform: uppercase}h1{font-size: clamp(2.6rem,6vw,4.6rem);letter-spacing: 0.02em}h2{font-size: clamp(1.7rem,3.4vw,2.4rem)}h3{font-size: 1.25rem}h4{font-size: 1rem;letter-spacing: var(--tracking-wide)}strong,b{color: var(--text);font-weight: 700}code,kbd,samp{background: var(--code-bg);border: 1px solid var(--line);border-radius: var(--radius-sm);color: var(--text);font-family: var(--mono);font-size: 0.88em;padding: 0.1rem 0.36rem}pre{background: var(--code-bg);border: 1px solid var(--line);border-radius: var(--radius-md);font-family: var(--mono);overflow-x: auto;padding: 1rem 1.1rem}pre code{background: transparent;border: 0;padding: 0}hr{border: 0;border-block-start: 1px solid var(--line);margin: var(--space-lg) 0}::-webkit-scrollbar{block-size: 10px;inline-size: 10px}::-webkit-scrollbar-thumb{background: var(--line-strong);border: 2px solid var(--bg);border-radius: var(--radius-pill)}::-webkit-scrollbar-track{background: transparent}a:focus-visible,button:focus-visible,summary:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,[tabindex]:focus-visible{outline: 2px solid var(--focus-ring);outline-offset: 2px}.ui-muted{color: var(--text-dim)}.ui-mono{font-family: var(--mono)}.ui-display{font-family: var(--display);text-transform: uppercase}.ui-visually-hidden{clip-path: inset(50%);block-size: 1px;overflow: hidden;position: absolute;white-space: nowrap;inline-size: 1px}@media (forced-colors: active){.ui-progress__bar,.ui-dotbar i.is-on,.ui-dotspinner i{background: Highlight}.ui-dot,.ui-dot--accent,.ui-dot--success,.ui-dot--warning,.ui-dot--danger,.ui-switch__thumb{background: CanvasText}.ui-dot--live::after{border-color: CanvasText}.ui-switch input:checked + .ui-switch__track,.ui-segmented__option:has(input:checked){outline: 2px solid Highlight;outline-offset: -2px}.ui-tab.is-active{border-block-end-color: Highlight;color: Highlight}a:focus-visible,button:focus-visible,summary:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,[tabindex]:focus-visible{outline: 2px solid Highlight}}@media print{html,body{background: #fff;color: #000}.ui-dotfield,.ui-toast-stack,.ui-app-rail,.ui-app-topbar,.ui-sitenav,.ui-themetoggle__button,.ui-sitemenu,.ui-spinner,.ui-dotloader,.ui-dotspinner,dialog.ui-modal::backdrop{display: none !important}*,*::before,*::after{box-shadow: none !important;text-shadow: none !important}.ui-card,.ui-panel,.ui-surface,.ui-alert,.ui-table-wrap{border: 1px solid #999}.ui-table-wrap,.ui-prose table,.ui-tabs__list,pre{overflow: visible !important}.ui-card,.ui-panel,.ui-alert,figure,blockquote,pre,tr{break-inside: avoid}:is(h1,h2,h3,h4,h5,h6){break-after: avoid}.ui-prose a[href^="http"]::after{content: " (" attr(href) ")";font-size: 0.85em;word-break: break-all}@page{margin: 18mm}}@keyframes pulseDot{0%,100%{opacity: 0.35;transform: scale(0.84)}50%{opacity: 1;transform: scale(1)}}@keyframes scan{0%{transform: translateY(-120%)}100%{transform: translateY(320%)}}@keyframes growBar{to{transform: scaleX(1)}}@keyframes drawLine{from{opacity: 0;stroke-dasharray: 0 999}to{opacity: 1;stroke-dasharray: 999 0}}@keyframes pulseNode{0%,100%{transform: scale(1)}50%{transform: scale(1.08)}}@keyframes pulseRing{0%{opacity: 0.7;transform: scale(0.7)}100%{opacity: 0;transform: scale(1.3)}}@keyframes uiFadeIn{from{opacity: 0}to{opacity: 1}}@keyframes uiRise{from{opacity: 0;transform: translateY(10px)}to{opacity: 1;transform: translateY(0)}}@keyframes uiDotIn{0%{opacity: 0;transform: scale(0.2)}60%{opacity: 1;transform: scale(1.15)}100%{opacity: 1;transform: scale(1)}}@keyframes uiSpin{to{transform: rotate(360deg)}}@keyframes uiBlink{0%,45%{opacity: 1}55%,100%{opacity: 0.2}}@keyframes uiShimmer{from{background-position: 200% 0}to{background-position: -200% 0}}@keyframes uiMatrixReveal{from{clip-path: inset(0 100% 0 0)}to{clip-path: inset(0 0 0 0)}}@keyframes uiTrack{0%{inset-inline-start: -45%}100%{inset-inline-start: 100%}}@keyframes uiToastIn{from{opacity: 0;transform: translateY(12px) scale(0.98)}to{opacity: 1;transform: translateY(0) scale(1)}}.ui-animate-in{animation: uiRise var(--duration-slow) var(--ease-spring) both}.ui-animate-fade{animation: uiFadeIn var(--duration-base) var(--ease-standard) both}.ui-animate-dot{animation: uiDotIn var(--duration-base) var(--ease-spring) both}.ui-animate-matrix{animation: uiMatrixReveal var(--duration-slow) var(--ease-out) both}.ui-stagger > *{animation: uiRise var(--duration-slow) var(--ease-spring) both;animation-delay: calc(var(--i,0) * 60ms)}.ui-stagger--auto > *:nth-child(1){animation-delay: 0ms}.ui-stagger--auto > *:nth-child(2){animation-delay: 60ms}.ui-stagger--auto > *:nth-child(3){animation-delay: 120ms}.ui-stagger--auto > *:nth-child(4){animation-delay: 180ms}.ui-stagger--auto > *:nth-child(5){animation-delay: 240ms}.ui-stagger--auto > *:nth-child(6){animation-delay: 300ms}.ui-stagger--auto > *:nth-child(n + 7){animation-delay: 360ms}@media (prefers-reduced-motion: no-preference){.ui-reveal{opacity: 0;transform: translateY(14px);transition: opacity var(--duration-slow) var(--ease-out),transform var(--duration-slow) var(--ease-out)}.ui-reveal.is-visible{opacity: 1;transform: none}}.ui-skeleton{background: linear-gradient( 90deg,var(--panel-soft) 25%,color-mix(in srgb,var(--panel-soft) 55%,var(--line-strong)) 50%,var(--panel-soft) 75% );background-size: 200% 100%;animation: uiShimmer 1.4s linear infinite;border-radius: var(--radius-sm);color: transparent;min-block-size: 0.8em}.ui-spinner{animation: uiSpin 0.7s linear infinite;border: 2px solid var(--line);border-radius: 50%;border-block-start-color: var(--accent);display: inline-block;block-size: 1.1rem;inline-size: 1.1rem}.ui-caret::after{animation: uiBlink 1.1s steps(1) infinite;content: '▮';margin-inline-start: 0.1em}@media (prefers-reduced-motion: reduce){html{scroll-behavior: auto}*,*::before,*::after{animation-duration: 0.01ms !important;animation-iteration-count: 1 !important;transition-duration: 0.01ms !important}.ui-reveal{opacity: 1 !important;transform: none !important}}.ui-dotgrid{--_dot: var(--dot-color,var(--field-dot));background-image: radial-gradient(var(--_dot) var(--dot-size),transparent var(--dot-size));background-position: 0 0;background-size: var(--dot-gap) var(--dot-gap)}.ui-dotgrid--accent{--dot-color: var(--field-dot-accent)}.ui-dotgrid--dense{--dot-gap: 8px}.ui-dotfield{--_dot: var(--dot-color,var(--field-dot));background-image: radial-gradient(var(--_dot) var(--dot-size),transparent var(--dot-size));background-size: var(--dot-gap) var(--dot-gap);inset: 0;mask-image: radial-gradient(ellipse at 50% 0%,#000 30%,transparent 78%);pointer-events: none;position: fixed;z-index: var(--z-base)}.ui-dotrule{background-image: radial-gradient(var(--line-strong) 1.4px,transparent 1.4px);background-position: 0 50%;background-size: 9px 9px;border: 0;block-size: 3px;margin: var(--space-md) 0;inline-size: 100%}.ui-dot{background: var(--text-dim);border-radius: 50%;display: inline-block;flex: 0 0 auto;block-size: 0.55rem;inline-size: 0.55rem}.ui-dot--accent{background: var(--accent)}.ui-dot--success{background: var(--success)}.ui-dot--warning{background: var(--warning)}.ui-dot--danger{background: var(--danger)}.ui-dot--live{background: var(--success);box-shadow: 0 0 0 0 color-mix(in srgb,var(--success) 70%,transparent);position: relative}.ui-dot--live::after{animation: pulseRing 1.8s var(--ease-out) infinite;border: 1px solid var(--success);border-radius: 50%;content: '';inset: -3px;position: absolute}.ui-status{align-items: center;color: var(--text-soft);display: inline-flex;font-family: var(--mono);font-size: var(--text-xs);gap: 0.45rem;letter-spacing: var(--tracking-wide);text-transform: uppercase}.ui-dotloader{align-items: center;display: inline-flex;gap: 0.32rem}.ui-dotloader span{animation: pulseDot 1s var(--ease-standard) infinite;background: var(--accent);border-radius: 50%;block-size: 0.42rem;inline-size: 0.42rem}.ui-dotloader span:nth-child(2){animation-delay: 0.16s}.ui-dotloader span:nth-child(3){animation-delay: 0.32s}.ui-dotspinner{--ds-box: 1.6rem;--ds-dot: 0.26rem;animation: uiSpin 1s steps(8) infinite;display: inline-block;flex: 0 0 auto;block-size: var(--ds-box);position: relative;inline-size: var(--ds-box)}.ui-dotspinner i{background: var(--accent);border-radius: 50%;block-size: var(--ds-dot);inset: 0;margin: auto;position: absolute;inline-size: var(--ds-dot)}.ui-dotspinner i:nth-child(1){opacity: 1;transform: rotate(0deg) translateY(calc(var(--ds-box) / -2 + var(--ds-dot) / 2))}.ui-dotspinner i:nth-child(2){opacity: 0.85;transform: rotate(45deg) translateY(calc(var(--ds-box) / -2 + var(--ds-dot) / 2))}.ui-dotspinner i:nth-child(3){opacity: 0.7;transform: rotate(90deg) translateY(calc(var(--ds-box) / -2 + var(--ds-dot) / 2))}.ui-dotspinner i:nth-child(4){opacity: 0.56;transform: rotate(135deg) translateY(calc(var(--ds-box) / -2 + var(--ds-dot) / 2))}.ui-dotspinner i:nth-child(5){opacity: 0.44;transform: rotate(180deg) translateY(calc(var(--ds-box) / -2 + var(--ds-dot) / 2))}.ui-dotspinner i:nth-child(6){opacity: 0.34;transform: rotate(225deg) translateY(calc(var(--ds-box) / -2 + var(--ds-dot) / 2))}.ui-dotspinner i:nth-child(7){opacity: 0.25;transform: rotate(270deg) translateY(calc(var(--ds-box) / -2 + var(--ds-dot) / 2))}.ui-dotspinner i:nth-child(8){opacity: 0.16;transform: rotate(315deg) translateY(calc(var(--ds-box) / -2 + var(--ds-dot) / 2))}.ui-dotspinner--sm{--ds-box: 1.05rem;--ds-dot: 0.18rem}.ui-dotspinner--lg{--ds-box: 2.6rem;--ds-dot: 0.42rem}.ui-dotbar{display: flex;gap: 3px}.ui-dotbar i{background: var(--field-dot);border-radius: 1px;flex: 1;block-size: 0.5rem}.ui-dotbar i.is-on{background: var(--accent)}.ui-dotbar--indeterminate i{animation: pulseDot 1.1s var(--ease-standard) infinite}.ui-dotbar--indeterminate i:nth-child(2){animation-delay: 0.09s}.ui-dotbar--indeterminate i:nth-child(3){animation-delay: 0.18s}.ui-dotbar--indeterminate i:nth-child(4){animation-delay: 0.27s}.ui-dotbar--indeterminate i:nth-child(5){animation-delay: 0.36s}.ui-dotbar--indeterminate i:nth-child(6){animation-delay: 0.45s}.ui-dotbar--indeterminate i:nth-child(7){animation-delay: 0.54s}.ui-dotbar--indeterminate i:nth-child(n + 8){animation-delay: 0.63s}.ui-matrix{clip-path: inset(0 100% 0 0);transition: clip-path var(--duration-slow) var(--ease-out)}.ui-matrix.is-in{clip-path: inset(0 0 0 0)}@media (prefers-reduced-motion: reduce){.ui-dot--live::after,.ui-dotloader span,.ui-dotspinner,.ui-dotbar--indeterminate i{animation: none}.ui-dotspinner i{opacity: 0.6}.ui-matrix{clip-path: none}}.ui-themetoggle__button{align-items: center;background: transparent;border: 1px solid var(--line-strong);border-radius: var(--radius-md);color: var(--text);cursor: pointer;display: inline-flex;font-family: var(--mono);font-size: var(--text-xs);font-weight: 600;gap: 0.4rem;justify-content: center;letter-spacing: var(--tracking-wide);min-block-size: 2rem;min-inline-size: 7rem;padding: 0.42rem 0.66rem;text-transform: uppercase;transition: background-color var(--duration-fast) var(--ease-standard),border-color var(--duration-fast) var(--ease-standard),color var(--duration-fast) var(--ease-standard);white-space: nowrap}.ui-themetoggle__button:hover{border-color: var(--accent);color: var(--accent-text)}.ui-themetoggle__prefix{color: var(--text-dim)}.ui-themetoggle__label{color: var(--text);font-weight: 700}.ui-themetoggle__track{background: var(--panel-soft);border: 1px solid var(--line-strong);border-radius: var(--radius-pill);display: inline-flex;block-size: 0.8rem;padding: 0.12rem;inline-size: 1.5rem}.ui-themetoggle__thumb{background: var(--text-dim);border-radius: 50%;display: block;block-size: 100%;transform: translateX(0);transition: background-color var(--duration-fast) var(--ease-standard),transform var(--duration-fast) var(--ease-spring);inline-size: 0.56rem}[data-theme='dark'] .ui-themetoggle__thumb{background: var(--accent);transform: translateX(0.6rem)}[dir='rtl'][data-theme='dark'] .ui-themetoggle__thumb,[dir='rtl'] [data-theme='dark'] .ui-themetoggle__thumb{transform: translateX(-0.6rem)}@media (hover: hover){.ui-themetoggle__button:active{transform: translateY(1px)}}.ui-container{inline-size: 100%;margin-inline: auto;max-inline-size: var(--container,72rem);padding-inline: var(--space-md)}.ui-container--narrow{max-inline-size: var(--container-narrow,44rem)}.ui-skiplink{background: var(--panel-strong);border: 1px solid var(--line-strong);border-radius: var(--radius-md);color: var(--text);inset-block-start: -4rem;inset-inline-start: var(--space-md);padding: 0.7rem 1rem;position: fixed;z-index: var(--z-toast)}.ui-skiplink:focus{inset-block-start: var(--space-md)}.ui-siteheader{align-items: center;border-block-end: 1px solid var(--line);display: flex;flex-wrap: wrap;gap: var(--space-md);justify-content: space-between;padding-block: var(--space-sm)}.ui-siteheader__brand{align-items: center;color: var(--text);display: inline-flex;font-family: var(--display);font-size: var(--text-lg);gap: 0.5rem;letter-spacing: var(--tracking-wide);text-transform: uppercase}.ui-siteheader__brand::before{background: var(--accent);border-radius: 50%;block-size: 0.5rem;content: '';flex: 0 0 auto;inline-size: 0.5rem}.ui-siteheader__actions{align-items: center;display: inline-flex;gap: var(--space-xs)}.ui-sitenav{display: inline-flex;flex-wrap: wrap;gap: 0.15rem}.ui-sitenav a{align-items: center;border: 1px solid transparent;border-radius: var(--radius-md);color: var(--text-soft);display: inline-flex;font-family: var(--mono);font-size: var(--text-xs);gap: 0.45rem;letter-spacing: var(--tracking-wide);padding: 0.4rem 0.6rem;text-transform: uppercase;transition: border-color var(--duration-fast) var(--ease-standard),color var(--duration-fast) var(--ease-standard)}.ui-sitenav a::before{background: currentColor;border-radius: 50%;block-size: 0.32rem;content: '';inline-size: 0.32rem;opacity: 0;transform: scale(0.5);transition: opacity var(--duration-fast) var(--ease-standard),transform var(--duration-fast) var(--ease-spring)}.ui-sitenav a[aria-current]{color: var(--accent-text)}.ui-sitenav a[aria-current]::before{opacity: 1;transform: scale(1)}@media (hover: hover){.ui-sitenav a:hover{color: var(--text)}.ui-sitenav a:hover::before{opacity: 1;transform: scale(1)}}.ui-sitemenu{display: none;position: relative}.ui-sitemenu > summary{align-items: center;background: transparent;border: 1px solid var(--line-strong);border-radius: var(--radius-md);color: var(--text);cursor: pointer;display: inline-flex;font-family: var(--mono);font-size: var(--text-xs);font-weight: 600;gap: 0.4rem;letter-spacing: var(--tracking-wide);list-style: none;min-block-size: 2.4rem;padding: 0.42rem 0.7rem;text-transform: uppercase}.ui-sitemenu > summary::-webkit-details-marker{display: none}.ui-sitemenu[open] > summary{border-color: var(--accent);color: var(--accent-text)}.ui-sitemenu__panel{background: var(--panel-strong);border: 1px solid var(--line-strong);border-radius: var(--radius-md);box-shadow: var(--shadow-raised);display: grid;gap: 0.15rem;inset-block-start: calc(100% + 0.4rem);inset-inline-end: 0;min-inline-size: 12rem;padding: 0.4rem;position: absolute;z-index: var(--z-overlay)}@media (max-width: 720px){.ui-siteheader .ui-sitenav{display: none}.ui-sitemenu{display: block}.ui-sitemenu .ui-sitenav{display: grid}}.ui-sitefooter{align-items: center;border-block-start: 1px solid var(--line);color: var(--text-dim);display: flex;flex-wrap: wrap;font-size: var(--text-sm);gap: var(--space-sm);justify-content: space-between;margin-block-start: var(--space-2xl);padding-block: var(--space-md)}.ui-sitefooter__links{display: flex;flex-wrap: wrap;gap: var(--space-md)}.ui-sitefooter__links a{color: var(--text);text-decoration: underline;text-decoration-color: color-mix(in srgb,var(--accent) 45%,transparent);text-underline-offset: 0.2rem;transition: text-decoration-color var(--duration-fast) var(--ease-standard)}@media (hover: hover){.ui-sitefooter__links a:hover{text-decoration-color: var(--accent)}}.ui-tags{display: flex;flex-wrap: wrap;gap: 0.5rem;list-style: none;margin: 0;padding: 0}.ui-tag{background: var(--panel-soft);border: 1px solid var(--line);border-radius: var(--radius-md);color: var(--text-soft);display: inline-flex;font-size: var(--text-xs);padding: 0.28rem 0.6rem}.ui-tag--accent{background: var(--accent-soft);border-color: color-mix(in srgb,var(--accent) 42%,var(--line));color: var(--accent-text)}.ui-meta{align-items: center;color: var(--text-dim);display: flex;flex-wrap: wrap;font-family: var(--mono);font-size: var(--text-2xs);gap: 0.55rem;letter-spacing: var(--tracking-wide);list-style: none;margin: 0;padding: 0;text-transform: uppercase}.ui-meta__item{align-items: center;display: inline-flex;gap: 0.55rem}.ui-meta__item:not(:last-child)::after{background: var(--line-strong);border-radius: 50%;block-size: 0.22rem;content: '';inline-size: 0.22rem}.ui-prose{color: var(--text-soft);font-size: var(--text-base);line-height: 1.7;--prose-measure: 72ch}.ui-prose > *{margin-block: 0;max-inline-size: var(--prose-measure)}.ui-prose > * + *{margin-block-start: var(--space-md)}.ui-prose > * + :is(h1,h2,h3,h4,h5,h6){margin-block-start: var(--space-2xl)}.ui-prose > :is(figure,pre,table,hr,.ui-dotrule){max-inline-size: none}.ui-prose :is(h1,h2,h3,h4,h5,h6){color: var(--text);font-family: var(--display);line-height: 1.12;text-wrap: balance}.ui-prose h1{font-size: var(--text-xl);letter-spacing: var(--tracking-wide);text-transform: uppercase}.ui-prose h2{font-size: var(--text-lg);letter-spacing: var(--tracking-wide);padding-block-end: 0.3rem;border-block-end: 1px solid var(--line);text-transform: uppercase}.ui-prose h3{font-size: var(--text-lg)}.ui-prose :is(h4,h5,h6){font-size: var(--text-base);letter-spacing: var(--tracking-wide);text-transform: uppercase}.ui-prose :is(h5,h6){color: var(--text-dim)}.ui-prose :is(h1,h2,h3,h4,h5,h6)[id]{scroll-margin-block-start: 6rem}.ui-prose :is(p,ul,ol,dl,blockquote,figure,pre,table){font-size: inherit}.ui-prose a{color: var(--text);text-decoration: underline;text-decoration-color: color-mix(in srgb,var(--accent) 55%,transparent);text-decoration-thickness: 1px;text-underline-offset: 0.22rem;transition: color var(--duration-fast) var(--ease-standard),text-decoration-color var(--duration-fast) var(--ease-standard)}.ui-prose strong{color: var(--text)}.ui-prose mark{background: var(--accent-soft);color: var(--text);padding: 0.02em 0.22em}.ui-prose small{font-size: var(--text-xs)}.ui-prose abbr[title]{text-decoration: underline dotted;text-underline-offset: 0.2rem}.ui-prose :is(sub,sup){font-size: 0.72em}@media (hover: hover){.ui-prose a:hover{color: var(--accent-text);text-decoration-color: var(--accent)}}.ui-prose :is(ul,ol){padding-inline-start: 1.4rem}.ui-prose li + li{margin-block-start: 0.4rem}.ui-prose li::marker{color: var(--accent-text)}.ui-prose ul{list-style: square}.ui-prose :is(ul,ol) :is(ul,ol){margin-block-start: 0.4rem}.ui-prose li:has(> input[type='checkbox']){list-style: none;margin-inline-start: -1.4rem}.ui-prose li > input[type='checkbox']{accent-color: var(--accent);margin-inline-end: 0.4rem}.ui-prose blockquote{border-inline-start: 2px solid var(--accent);color: var(--text-dim);font-style: normal;padding-inline-start: var(--space-md)}.ui-prose blockquote > * + *{margin-block-start: var(--space-xs)}.ui-prose dt{color: var(--text-dim);font-family: var(--mono);font-size: var(--text-2xs);font-weight: 700;letter-spacing: var(--tracking-wide);text-transform: uppercase}.ui-prose dd{margin-inline-start: 0;padding-block: 0.16rem 0.6rem}.ui-prose dd + dt{border-block-start: 1px solid var(--line);padding-block-start: 0.6rem}.ui-prose :not(pre) > code{font-size: 0.88em}.ui-prose pre{font-size: var(--text-sm);line-height: 1.6;overflow-x: auto}.ui-prose hr{background-image: radial-gradient(var(--line-strong) 1.4px,transparent 1.4px);background-position: 0 50%;background-size: 9px 9px;block-size: 3px;border: 0;margin-block: var(--space-xl)}.ui-prose :is(img,video,svg){block-size: auto;border-radius: var(--radius-sm);max-inline-size: 100%}.ui-prose figure{display: grid;gap: 0.5rem;justify-items: start}.ui-prose figcaption{color: var(--text-dim);font-family: var(--mono);font-size: var(--text-2xs);letter-spacing: var(--tracking-wide);text-transform: uppercase}.ui-prose table{border: 1px solid var(--line);border-collapse: collapse;border-radius: var(--radius-md);display: block;font-family: var(--mono);font-size: var(--text-sm);inline-size: 100%;overflow-x: auto}.ui-prose :is(th,td){border-block-end: 1px solid var(--line);padding: 0.6rem 0.8rem;text-align: start;vertical-align: top}.ui-prose th{background: var(--panel);color: var(--text-dim);font-size: var(--text-2xs);font-weight: 700;letter-spacing: var(--tracking-wide);text-transform: uppercase}.ui-prose td{color: var(--text-soft)}.ui-prose tbody tr:last-child :is(th,td){border-block-end: 0}.ui-prose--compact{line-height: 1.55}.ui-prose--compact > * + *{margin-block-start: var(--space-sm)}.ui-prose--compact > * + :is(h1,h2,h3,h4,h5,h6){margin-block-start: var(--space-lg)}.ui-quote{color: var(--text);display: grid;font-family: var(--display);font-size: var(--text-xl);gap: var(--space-sm);line-height: 1.2;margin-block: var(--space-xl);max-inline-size: 40ch;text-wrap: balance}.ui-quote::before{background: var(--accent);block-size: 2px;content: '';inline-size: 2.5rem}.ui-quote__cite{color: var(--text-dim);font-family: var(--mono);font-size: var(--text-2xs);font-style: normal;letter-spacing: var(--tracking-wide);text-transform: uppercase}.ui-stack{display: grid;gap: var(--stack-gap,var(--space-md))}.ui-cluster{align-items: center;display: flex;flex-wrap: wrap;gap: var(--cluster-gap,var(--space-xs))}.ui-cluster--between{justify-content: space-between}.ui-grid{display: grid;gap: var(--grid-gap,var(--space-md));grid-template-columns: repeat(auto-fit,minmax(min(100%,var(--grid-min,16rem)),1fr))}.ui-sidebar{display: flex;flex-wrap: wrap;gap: var(--sidebar-gap,var(--space-md))}.ui-sidebar > :first-child{flex-basis: var(--sidebar-width,16rem);flex-grow: 1}.ui-sidebar > :last-child{flex-basis: 0;flex-grow: 999;min-inline-size: var(--sidebar-min,60%)}.ui-switcher{display: flex;flex-wrap: wrap;gap: var(--switcher-gap,var(--space-md))}.ui-switcher > *{flex-basis: calc((var(--switcher-min,24rem) - 100%) * 999);flex-grow: 1}.ui-center{box-sizing: content-box;margin-inline: auto;max-inline-size: var(--center-max,64rem);padding-inline: var(--center-gutter,var(--space-md))}.ui-ratio{aspect-ratio: var(--ratio,16 / 9)}.ui-ratio > *{block-size: 100%;inline-size: 100%;object-fit: cover}.ui-cq{container: var(--cq-name,bronto) / inline-size}@container bronto (max-width: 34rem){.ui-grid{--grid-min: 100%}}.ui-surface,.ui-card,.ui-panel{background: var(--panel);border: 1px solid var(--line)}.ui-card,.ui-panel{border-radius: var(--radius-lg);display: grid;gap: var(--space-sm);padding: var(--space-md)}.ui-card{transition: border-color var(--duration-base) var(--ease-standard),background-color var(--duration-base) var(--ease-standard),transform var(--duration-base) var(--ease-standard)}.ui-panel{background: var(--panel-strong)}.ui-card--accent{border-color: var(--accent)}.ui-card__head,.ui-panel__head{align-items: flex-start;display: flex;gap: var(--space-sm);justify-content: space-between}.ui-divider{border: 0;border-block-start: 1px solid var(--line);margin: 0}.ui-eyebrow{color: var(--accent-text);font-family: var(--display);font-size: var(--text-xs);font-weight: 700;letter-spacing: var(--tracking-wide);margin: 0;text-transform: uppercase}.ui-eyebrow--muted{color: var(--text-dim)}.ui-button{align-items: center;background: var(--accent);border: 1px solid var(--accent);border-radius: var(--radius-md);color: var(--button-text);cursor: pointer;display: inline-flex;font-family: var(--mono);font-size: var(--text-sm);font-weight: 600;gap: 0.45rem;justify-content: center;letter-spacing: var(--tracking-wide);line-height: 1;min-block-size: 2.4rem;min-inline-size: 2.4rem;padding: 0.66rem 1rem;text-transform: uppercase;transition: background-color var(--duration-fast) var(--ease-standard),border-color var(--duration-fast) var(--ease-standard),color var(--duration-fast) var(--ease-standard),transform var(--duration-fast) var(--ease-standard)}.ui-button--ghost{background: transparent;border-color: var(--line-strong);color: var(--text)}.ui-button--subtle{background: var(--panel-soft);border-color: var(--line);color: var(--text)}.ui-button--danger{background: var(--danger);border-color: var(--danger);color: var(--button-text)}.ui-button--icon{aspect-ratio: 1;min-inline-size: 2.4rem;padding: 0}.ui-button:disabled,.ui-button[aria-disabled='true']{cursor: not-allowed;opacity: 0.45}.ui-button:active{transform: translateY(1px)}.ui-button[aria-busy='true']{cursor: progress;pointer-events: none}.ui-button[aria-busy='true']::before{animation: uiSpin 0.6s linear infinite;block-size: 0.9em;border: 2px solid currentcolor;border-block-start-color: transparent;border-radius: var(--radius-pill);content: '';flex: none;inline-size: 0.9em}@media (prefers-reduced-motion: reduce){.ui-button[aria-busy='true']::before{animation-duration: 1.4s}}.ui-link{color: var(--text);text-decoration: underline;text-decoration-color: color-mix(in srgb,var(--accent) 55%,transparent);text-decoration-thickness: 1px;text-underline-offset: 0.22rem;transition: color var(--duration-fast) var(--ease-standard),text-decoration-color var(--duration-fast) var(--ease-standard)}.ui-link--arrow{align-items: center;display: inline-flex;gap: 0.4rem;text-decoration: none}.ui-link--arrow::after{border-inline-end: 1px solid currentColor;border-block-start: 1px solid currentColor;content: '';block-size: 0.42rem;transform: rotate(45deg);transition: transform var(--duration-fast) var(--ease-standard);inline-size: 0.42rem}.ui-chip{align-items: center;background: transparent;border: 1px solid var(--line-strong);border-radius: var(--radius-sm);color: var(--text-soft);display: inline-flex;font-family: var(--mono);font-size: var(--text-2xs);gap: 0.36rem;letter-spacing: var(--tracking-wide);line-height: 1;min-block-size: 1.7rem;padding: 0.32rem 0.55rem;text-transform: uppercase}.ui-chip--accent{color: var(--accent-text);border-color: var(--accent)}.ui-badge{align-items: center;background: var(--panel-soft);border: 1px solid var(--line);border-radius: var(--radius-sm);color: var(--text-soft);display: inline-flex;font-family: var(--mono);font-size: var(--text-2xs);font-weight: 700;gap: 0.34rem;letter-spacing: var(--tracking-wide);line-height: 1;padding: 0.28rem 0.5rem;text-transform: uppercase}.ui-badge--accent{background: var(--accent-soft);border-color: color-mix(in srgb,var(--accent) 45%,var(--line))}.ui-badge--success{background: var(--success-soft);border-color: color-mix(in srgb,var(--success) 40%,var(--line))}.ui-badge--warning{background: var(--warning-soft);border-color: color-mix(in srgb,var(--warning) 40%,var(--line))}.ui-badge--danger{background: var(--danger-soft);border-color: color-mix(in srgb,var(--danger) 40%,var(--line))}.ui-key-value{display: grid;gap: 0.55rem;margin: 0}.ui-key-value div{border-block-start: 1px solid var(--line);display: grid;gap: 0.16rem;padding-block-start: 0.6rem}.ui-key-value dt{color: var(--text-dim);font-family: var(--mono);font-size: var(--text-2xs);font-weight: 700;letter-spacing: var(--tracking-wide);line-height: 1;text-transform: uppercase}.ui-key-value dd{color: var(--text);font-family: var(--mono);margin: 0}@media (hover: hover){.ui-card:hover{border-color: var(--line-strong)}.ui-card--interactive:hover{transform: translateY(-2px)}.ui-button:hover{background: var(--accent-strong);border-color: var(--accent-strong)}.ui-button--ghost:hover,.ui-button--subtle:hover{background: var(--panel-soft);border-color: var(--accent);color: var(--text)}.ui-button--danger:hover{background: color-mix(in srgb,var(--danger) 84%,#000)}.ui-link:hover{color: var(--accent-text);text-decoration-color: var(--accent)}.ui-link--arrow:hover::after{transform: translateX(0.14rem) rotate(45deg)}[dir='rtl'] .ui-link--arrow:hover::after{transform: translateX(-0.14rem) rotate(45deg)}.ui-chip--accent:hover{background: var(--accent-soft)}}@media (pointer: coarse){.ui-button{min-block-size: 2.9rem;min-inline-size: 2.9rem}.ui-button--icon{min-inline-size: 2.9rem}}.ui-field{display: grid;gap: 0.35rem}.ui-label{color: var(--text-dim);font-family: var(--mono);font-size: var(--text-2xs);font-weight: 700;letter-spacing: var(--tracking-wide);text-transform: uppercase}.ui-input,.ui-select,.ui-textarea{background: var(--bg-elevated);border: 1px solid var(--line-strong);border-radius: var(--radius-md);color: var(--text);font-family: var(--mono);font-size: var(--text-sm);padding: 0.6rem 0.7rem;transition: border-color var(--duration-fast) var(--ease-standard),background-color var(--duration-fast) var(--ease-standard);inline-size: 100%}.ui-input::placeholder,.ui-textarea::placeholder{color: var(--text-dim)}.ui-textarea{min-block-size: 6rem;resize: vertical}.ui-select{appearance: none;background-image: radial-gradient(var(--text-dim) 1.5px,transparent 1.5px);background-position: right 0.75rem center;background-repeat: no-repeat;background-size: 5px 5px;padding-inline-end: 1.8rem}[dir='rtl'] .ui-select{background-position: left 0.75rem center}.ui-input:focus,.ui-select:focus,.ui-textarea:focus{border-color: var(--accent);outline: none}.ui-input:focus-visible,.ui-select:focus-visible,.ui-textarea:focus-visible{outline: 2px solid var(--focus-ring);outline-offset: 1px}.ui-input:disabled,.ui-select:disabled,.ui-textarea:disabled{cursor: not-allowed;opacity: 0.5}.ui-input[aria-invalid='true'],.ui-select[aria-invalid='true'],.ui-textarea[aria-invalid='true']{border-color: var(--danger)}.ui-hint{color: var(--text-dim);font-size: var(--text-2xs)}.ui-hint--error{color: var(--danger)}.ui-input-group{display: flex;isolation: isolate}.ui-input-group > .ui-input,.ui-input-group > .ui-select{border-radius: 0;flex: 1;margin-inline-start: -1px}.ui-input-group > :first-child{border-start-start-radius: var(--radius-md);border-end-start-radius: var(--radius-md);margin-inline-start: 0}.ui-input-group > :last-child{border-start-end-radius: var(--radius-md);border-end-end-radius: var(--radius-md)}.ui-input-group > .ui-input:focus-visible{z-index: 1}.ui-input-group__addon{align-items: center;background: var(--panel-soft);border: 1px solid var(--line);color: var(--text-dim);display: flex;font-size: var(--text-sm);padding-inline: var(--space-sm);white-space: nowrap}.ui-file{color: var(--text-soft);font-size: var(--text-sm)}.ui-file::file-selector-button{background: var(--panel-soft);border: 1px solid var(--line-strong);border-radius: var(--radius-md);color: var(--text);cursor: pointer;font: inherit;margin-inline-end: var(--space-sm);padding: 0.5rem 0.85rem}.ui-file::file-selector-button:hover{border-color: var(--accent)}.ui-range{accent-color: var(--accent);inline-size: 100%}.ui-range:focus-visible{outline: 2px solid var(--focus-ring);outline-offset: 4px}.ui-error-summary{border: 1px solid var(--danger);border-radius: var(--radius-md);color: var(--text);padding: var(--space-md)}.ui-error-summary[hidden]{display: none}.ui-error-summary__title{color: var(--danger);font-family: var(--display);font-size: var(--text-sm);font-weight: 700;letter-spacing: var(--tracking-wide);margin: 0 0 var(--space-xs);text-transform: uppercase}.ui-error-summary__list{margin: 0;padding-inline-start: var(--space-md)}.ui-error-summary__list a{color: var(--danger)}.ui-search{align-items: center;background: var(--bg-elevated);border: 1px solid var(--line-strong);border-radius: var(--radius-md);display: flex;gap: 0.5rem;padding: 0 0.7rem}.ui-search::before{background: var(--text-dim);border-radius: 50%;content: '';flex: 0 0 auto;block-size: 0.42rem;inline-size: 0.42rem}.ui-search:focus-within{border-color: var(--accent)}.ui-search:focus-within::before{background: var(--accent)}.ui-search input{background: transparent;border: 0;color: var(--text);font-family: var(--mono);font-size: var(--text-sm);outline: none;padding: 0.6rem 0;inline-size: 100%}.ui-switch{align-items: center;cursor: pointer;display: inline-flex;gap: 0.6rem}.ui-switch input{position: absolute;opacity: 0;pointer-events: none}.ui-switch__track{background: var(--panel-soft);border: 1px solid var(--line-strong);border-radius: var(--radius-pill);display: inline-flex;block-size: 1.05rem;padding: 2px;transition: background-color var(--duration-fast) var(--ease-standard),border-color var(--duration-fast) var(--ease-standard);inline-size: 1.95rem}.ui-switch__thumb{background: var(--text-dim);border-radius: 50%;block-size: 100%;transition: transform var(--duration-fast) var(--ease-spring),background-color var(--duration-fast) var(--ease-standard);inline-size: 0.78rem}.ui-switch input:checked + .ui-switch__track{background: var(--accent-soft);border-color: var(--accent)}.ui-switch input:checked + .ui-switch__track .ui-switch__thumb{background: var(--accent);transform: translateX(0.9rem)}[dir='rtl'] .ui-switch input:checked + .ui-switch__track .ui-switch__thumb{transform: translateX(-0.9rem)}.ui-switch input:focus-visible + .ui-switch__track{outline: 2px solid var(--focus-ring);outline-offset: 2px}@media (forced-colors: active){.ui-switch__track{border-color: ButtonBorder}.ui-switch__thumb{background: ButtonText}.ui-switch input:checked + .ui-switch__track{border-color: Highlight}.ui-switch input:checked + .ui-switch__track .ui-switch__thumb{background: Highlight}}.ui-check{align-items: center;cursor: pointer;display: inline-flex;gap: 0.5rem;font-size: var(--text-sm)}.ui-check input{accent-color: var(--accent);block-size: 1rem;inline-size: 1rem}@media (pointer: coarse){.ui-input,.ui-select,.ui-textarea{min-block-size: 2.9rem}.ui-search{min-block-size: 2.9rem}.ui-check input{block-size: 1.15rem;inline-size: 1.15rem}}.ui-alert{background: var(--panel-soft);border: 1px solid var(--line);border-inline-start: 2px solid var(--line-strong);border-radius: var(--radius-md);color: var(--text-soft);display: grid;font-size: var(--text-sm);gap: 0.3rem;grid-template-columns: auto 1fr;padding: 0.8rem 0.9rem}.ui-alert::before{background: var(--text-dim);border-radius: 50%;content: '';block-size: 0.5rem;margin-block-start: 0.32rem;inline-size: 0.5rem}.ui-alert > *{grid-column: 2}.ui-alert__title{color: var(--text);font-family: var(--mono);font-size: var(--text-2xs);font-weight: 700;letter-spacing: var(--tracking-wide);margin: 0;text-transform: uppercase}.ui-alert__body{margin: 0}.ui-alert__dismiss{background: transparent;border: 0;color: var(--text-dim);cursor: pointer;font-family: var(--mono);grid-column: 3;grid-row: 1;line-height: 1;padding: 0.1rem 0.3rem}.ui-alert:has(.ui-alert__dismiss){grid-template-columns: auto 1fr auto}.ui-alert--accent{border-inline-start-color: var(--accent)}.ui-alert--accent::before{background: var(--accent)}.ui-alert--success{border-inline-start-color: var(--success)}.ui-alert--success::before{background: var(--success)}.ui-alert--warning{border-inline-start-color: var(--warning)}.ui-alert--warning::before{background: var(--warning)}.ui-alert--danger{border-inline-start-color: var(--danger)}.ui-alert--danger::before{background: var(--danger)}@media (hover: hover){.ui-alert__dismiss:hover{color: var(--text)}}.ui-toast-stack{display: grid;gap: 0.5rem;inset-block: auto 1.25rem;inset-inline: auto 1.25rem;justify-items: end;max-inline-size: min(22rem,calc(100vw - 2rem));pointer-events: none;position: fixed;z-index: var(--z-toast)}.ui-toast-stack--assertive{inset-block: 1.25rem auto}.ui-toast{align-items: flex-start;animation: uiToastIn var(--duration-base) var(--ease-spring) both;background: var(--panel-strong);border: 1px solid var(--line-strong);border-radius: var(--radius-md);box-shadow: var(--shadow-raised);color: var(--text-soft);display: grid;font-size: var(--text-sm);gap: 0.2rem 0.55rem;grid-template-columns: auto 1fr;padding: 0.7rem 0.85rem;pointer-events: auto;inline-size: 100%}.ui-toast::before{background: var(--text-dim);border-radius: 50%;content: '';grid-row: 1 / -1;block-size: 0.5rem;margin-block-start: 0.3rem;inline-size: 0.5rem}.ui-toast__title{color: var(--text);font-family: var(--mono);font-size: var(--text-2xs);font-weight: 700;letter-spacing: var(--tracking-wide);margin: 0;text-transform: uppercase}.ui-toast__close{align-self: start;background: none;border: 0;block-size: 1.4rem;color: var(--text-dim);cursor: pointer;font: inherit;grid-column: 3;grid-row: 1 / -1;inline-size: 1.4rem;padding: 0}.ui-toast__close::before{content: '\00d7';font-size: 1.1rem;line-height: 1}.ui-toast__close:hover{color: var(--text)}.ui-toast--accent::before{background: var(--accent)}.ui-toast--success::before{background: var(--success)}.ui-toast--warning::before{background: var(--warning)}.ui-toast--danger::before{background: var(--danger)}.ui-tooltip{display: inline-flex;position: relative}.ui-tooltip__bubble{background: var(--text);border-radius: var(--radius-sm);inset-block-end: calc(100% + 0.5rem);color: var(--bg);font-family: var(--mono);font-size: var(--text-2xs);inset-inline-start: 50%;letter-spacing: var(--tracking-wide);opacity: 0;padding: 0.34rem 0.5rem;pointer-events: none;position: absolute;text-transform: uppercase;transform: translate(-50%,4px);transition: opacity var(--duration-fast) var(--ease-standard),transform var(--duration-fast) var(--ease-standard);white-space: nowrap;z-index: var(--z-popover)}.ui-tooltip:hover .ui-tooltip__bubble,.ui-tooltip:focus-within .ui-tooltip__bubble{opacity: 1;transform: translate(-50%,0)}@supports (anchor-name: --x){.ui-tooltip{anchor-name: --ui-tooltip}.ui-tooltip__bubble{inset: auto;margin-block-end: 0.5rem;position: fixed;position-anchor: --ui-tooltip;position-area: block-start center;position-try-fallbacks: flip-block;transform: translateY(4px)}.ui-tooltip:hover .ui-tooltip__bubble,.ui-tooltip:focus-within .ui-tooltip__bubble{transform: translateY(0)}}.ui-popover{background: var(--panel-strong);border: 1px solid var(--line-strong);border-radius: var(--radius-md);box-shadow: var(--shadow-raised);color: var(--text-soft);font-size: var(--text-sm);inline-size: max-content;margin: 0;max-inline-size: min(22rem,calc(100vw - 2rem));padding: var(--space-sm) var(--space-md);position: fixed;z-index: var(--z-popover)}.ui-popover:not([popover],.is-open){display: none}.ui-popover[popover]:not(:popover-open){display: none}.ui-progress{background: var(--panel-soft);border: 1px solid var(--line);border-radius: var(--radius-pill);block-size: 0.5rem;overflow: hidden;position: relative;inline-size: 100%}.ui-progress__bar{background: var(--accent);block-size: 100%;transition: inline-size var(--duration-base) var(--ease-out);inline-size: calc(clamp(0,var(--value,0),100) * 1%)}.ui-progress--indeterminate .ui-progress__bar{animation: uiTrack 1.1s var(--ease-standard) infinite;position: absolute;inline-size: 45%}@media (prefers-reduced-motion: reduce){.ui-progress--indeterminate .ui-progress__bar{animation-duration: 0.01ms;inset-inline-start: 0;inline-size: 100%}.ui-toast{animation: none}}.ui-modal{background: var(--panel-strong);border: 1px solid var(--line-strong);border-radius: var(--radius-lg);box-shadow: var(--shadow-raised);color: var(--text);margin: auto;max-block-size: min(85vh,44rem);max-inline-size: min(32rem,calc(100vw - 2rem));overflow: hidden;padding: 0;inline-size: 100%}.ui-modal::backdrop{backdrop-filter: blur(2px);background: color-mix(in srgb,var(--bg) 70%,transparent)}.ui-modal[open]{animation: uiToastIn var(--duration-base) var(--ease-spring) both;display: grid;grid-template-rows: auto 1fr auto}.ui-modal__head{align-items: flex-start;border-block-end: 1px solid var(--line);display: flex;gap: var(--space-sm);justify-content: space-between;padding: var(--space-md)}.ui-modal__title{color: var(--text);font-family: var(--display);font-size: var(--text-lg);letter-spacing: var(--tracking-wide);margin: 0;text-transform: uppercase}.ui-modal__body{overflow-y: auto;padding: var(--space-md)}.ui-modal__foot{border-block-start: 1px solid var(--line);display: flex;flex-wrap: wrap;gap: var(--space-xs);justify-content: flex-end;padding: var(--space-md)}.ui-modal__close{background: transparent;border: 1px solid var(--line-strong);border-radius: var(--radius-md);color: var(--text);cursor: pointer;flex: 0 0 auto;font-family: var(--mono);line-height: 1;padding: 0.34rem 0.5rem}.ui-modal--drawer{block-size: 100vh;margin: 0;margin-inline-start: auto;max-block-size: 100vh;max-inline-size: min(26rem,100vw);border-radius: 0;border-width: 0;border-inline-start-width: 1px}@media (hover: hover){.ui-modal__close:hover{border-color: var(--accent);color: var(--accent-text)}}.ui-menu-host{display: inline-block;position: relative}.ui-menu{background: var(--panel-strong);border: 1px solid var(--line-strong);border-radius: var(--radius-md);box-shadow: var(--shadow-raised);display: grid;gap: 1px;min-inline-size: 11rem;padding: 0.3rem;position: absolute;inset-inline-end: 0;inset-block-start: calc(100% + 0.4rem);z-index: var(--z-overlay)}.ui-menu__label{color: var(--text-dim);font-family: var(--mono);font-size: var(--text-2xs);letter-spacing: var(--tracking-wide);padding: 0.45rem 0.55rem 0.2rem;text-transform: uppercase}.ui-menu__item{align-items: center;background: transparent;border: 0;border-radius: var(--radius-sm);color: var(--text-soft);cursor: pointer;display: flex;font-family: var(--mono);font-size: var(--text-sm);gap: 0.5rem;padding: 0.5rem 0.55rem;text-align: start;inline-size: 100%}.ui-menu__item::before{background: currentColor;border-radius: 50%;content: '';block-size: 0.3rem;opacity: 0.4;inline-size: 0.3rem}.ui-menu__sep{background: var(--line);border: 0;block-size: 1px;margin: 0.2rem 0}@media (hover: hover){.ui-menu__item:hover{background: var(--bg-accent);color: var(--text)}.ui-menu__item:hover::before{opacity: 1}}.ui-combobox{display: inline-block;min-inline-size: 14rem;position: relative}.ui-combobox__input{inline-size: 100%}.ui-combobox__list{background: var(--panel-strong);border: 1px solid var(--line-strong);border-radius: var(--radius-md);box-shadow: var(--shadow-raised);display: grid;gap: 1px;list-style: none;margin: 0;max-block-size: 16rem;overflow-y: auto;padding: 0.3rem;position: absolute;inset-block-start: calc(100% + 0.4rem);inset-inline: 0;z-index: var(--z-overlay)}.ui-combobox__list[hidden]{display: none}.ui-combobox__option{border-radius: var(--radius-sm);color: var(--text-soft);cursor: pointer;font-family: var(--mono);font-size: var(--text-sm);padding: 0.5rem 0.55rem}.ui-combobox__option[hidden]{display: none}.ui-combobox__option.is-active,.ui-combobox__option[aria-selected='true']{background: var(--bg-accent);color: var(--text)}.ui-combobox__empty{color: var(--text-dim);font-size: var(--text-2xs);padding: 0.5rem 0.55rem}.ui-combobox__empty[hidden]{display: none}@media (max-width: 560px){.ui-modal{border-radius: var(--radius-lg) var(--radius-lg) 0 0;margin: auto auto 0;max-block-size: 88vh;max-inline-size: 100vw;inline-size: 100vw}.ui-modal--drawer{border-radius: 0;border-width: 1px 0 0;block-size: 88vh;margin: auto 0 0;max-block-size: 88vh;max-inline-size: 100vw;inline-size: 100vw}.ui-menu{inset-inline: 0;min-inline-size: 0}}@media (prefers-reduced-motion: reduce){.ui-modal[open]{animation: none}}.ui-tabs{display: grid;gap: var(--space-md)}.ui-tabs__list{border-block-end: 1px solid var(--line);display: flex;gap: 0.1rem;overflow-x: auto;scrollbar-width: none}.ui-tabs__list::-webkit-scrollbar{display: none}.ui-tab{background: transparent;border: 0;border-block-end: 2px solid transparent;color: var(--text-dim);cursor: pointer;display: inline-flex;flex: 0 0 auto;font-family: var(--mono);font-size: var(--text-xs);gap: 0.4rem;letter-spacing: var(--tracking-wide);margin-block-end: -1px;padding: 0.6rem 0.85rem;text-transform: uppercase;transition: color var(--duration-fast) var(--ease-standard),border-color var(--duration-fast) var(--ease-standard)}.ui-tab.is-active{border-block-end-color: var(--accent);color: var(--accent-text)}.ui-tab:focus-visible{outline: 2px solid var(--focus-ring);outline-offset: -3px}.ui-tabs__panel[hidden]{display: none}@media (hover: hover){.ui-tab:hover:not(.is-active){color: var(--text)}}.ui-accordion{display: grid}.ui-accordion__item{border-block-end: 1px solid var(--line)}.ui-accordion__summary{align-items: center;color: var(--text);cursor: pointer;display: flex;font-family: var(--mono);font-size: var(--text-sm);gap: 0.6rem;letter-spacing: var(--tracking-wide);list-style: none;padding: 0.85rem 0.2rem;text-transform: uppercase}.ui-accordion__summary::-webkit-details-marker{display: none}.ui-accordion__summary::before{border-inline-end: 1.5px solid var(--text-dim);border-block-end: 1.5px solid var(--text-dim);content: '';block-size: 0.4rem;transform: rotate(-45deg);transition: transform var(--duration-fast) var(--ease-spring);inline-size: 0.4rem}.ui-accordion__item[open] .ui-accordion__summary{color: var(--accent-text)}.ui-accordion__item[open] .ui-accordion__summary::before{border-color: var(--accent);transform: rotate(45deg)}.ui-accordion__body{color: var(--text-soft);padding: 0 0.2rem 0.95rem}.ui-accordion__body > :first-child{margin-block-start: 0}.ui-segmented{background: var(--panel-soft);border: 1px solid var(--line-strong);border-radius: var(--radius-md);display: inline-flex;gap: 1px;overflow: hidden;padding: 2px}.ui-segmented__option{border-radius: var(--radius-sm);color: var(--text-soft);cursor: pointer;flex: 1 0 auto;font-family: var(--mono);font-size: var(--text-xs);letter-spacing: var(--tracking-wide);padding: 0.42rem 0.8rem;text-align: center;text-transform: uppercase;transition: background-color var(--duration-fast) var(--ease-standard),color var(--duration-fast) var(--ease-standard);white-space: nowrap}.ui-segmented__option input{position: absolute;opacity: 0;pointer-events: none}.ui-segmented__option:has(input:checked){background: var(--accent);color: var(--button-text)}.ui-segmented__option:has(input:focus-visible){outline: 2px solid var(--focus-ring);outline-offset: 2px}@media (hover: hover){.ui-segmented__option:hover:not(:has(input:checked)){color: var(--text)}}.ui-breadcrumb{align-items: center;color: var(--text-dim);display: flex;flex-wrap: wrap;font-family: var(--mono);font-size: var(--text-2xs);gap: 0.5rem;letter-spacing: var(--tracking-wide);list-style: none;margin: 0;padding: 0;text-transform: uppercase}.ui-breadcrumb__item{align-items: center;color: var(--text-dim);display: inline-flex;gap: 0.5rem}.ui-breadcrumb__item:not(:last-child)::after{background: var(--line-strong);border-radius: 50%;content: '';block-size: 0.22rem;inline-size: 0.22rem}.ui-breadcrumb__item[aria-current]{color: var(--text)}.ui-breadcrumb__item a{color: inherit}@media (hover: hover){.ui-breadcrumb__item a:hover{color: var(--accent-text)}}.ui-pagination{align-items: center;display: flex;flex-wrap: wrap;gap: 0.3rem;list-style: none;margin: 0;padding: 0}.ui-pagination__item{align-items: center;background: transparent;border: 1px solid var(--line);border-radius: var(--radius-sm);color: var(--text-soft);cursor: pointer;display: inline-flex;font-family: var(--mono);font-size: var(--text-xs);justify-content: center;min-block-size: 2rem;min-inline-size: 2rem;padding: 0 0.5rem;transition: border-color var(--duration-fast) var(--ease-standard),color var(--duration-fast) var(--ease-standard)}.ui-pagination__item.is-active{border-color: var(--accent);color: var(--accent-text)}.ui-pagination__item[aria-disabled='true']{cursor: not-allowed;opacity: 0.4}@media (hover: hover){.ui-pagination__item:not(.is-active,[aria-disabled='true']):hover{border-color: var(--line-strong);color: var(--text)}}.ui-avatar{--av-size: 2.2rem;align-items: center;background: var(--panel-soft);border: 1px solid var(--line-strong);border-radius: var(--radius-sm);color: var(--text);display: inline-flex;flex: 0 0 auto;font-family: var(--mono);font-size: calc(var(--av-size) * 0.38);font-weight: 700;block-size: var(--av-size);justify-content: center;letter-spacing: 0.04em;overflow: hidden;text-transform: uppercase;inline-size: var(--av-size)}.ui-avatar img{block-size: 100%;object-fit: cover;inline-size: 100%}.ui-avatar--sm{--av-size: 1.5rem}.ui-avatar--lg{--av-size: 3.2rem}.ui-avatar-group{display: inline-flex}.ui-avatar-group .ui-avatar{box-shadow: 0 0 0 2px var(--bg)}.ui-avatar-group .ui-avatar:not(:first-child){margin-inline-start: -0.5rem}.ui-table-wrap{border: 1px solid var(--line);border-radius: var(--radius-md);overflow: auto}.ui-table{border-collapse: collapse;font-family: var(--mono);font-size: var(--text-sm);min-inline-size: 100%;inline-size: 100%}.ui-table th,.ui-table td{border-block-end: 1px solid var(--line);overflow-wrap: anywhere;padding: 0.7rem 0.85rem;text-align: start;vertical-align: top}.ui-table th{background: var(--panel);color: var(--text-dim);font-size: var(--text-2xs);font-weight: 700;letter-spacing: var(--tracking-wide);position: sticky;text-transform: uppercase;inset-block-start: 0}.ui-table td{color: var(--text-soft)}.ui-table tbody tr:last-child td{border-block-end: 0}.ui-table tbody tr{transition: background-color var(--duration-fast) var(--ease-standard)}@media (hover: hover){.ui-table tbody tr:hover td{background: var(--bg-accent)}}.ui-table--dense th,.ui-table--dense td{font-size: var(--text-xs);padding: 0.42rem 0.6rem}.ui-table--comfortable th,.ui-table--comfortable td{padding: 0.95rem 1.1rem}.ui-table--lined td{border-inline-end: 1px solid var(--line)}.ui-table--lined td:last-child{border-inline-end: 0}.ui-table .is-num,.ui-table th.is-num{font-variant-numeric: tabular-nums;text-align: end}.ui-table .is-pos{color: var(--success)}.ui-table .is-neg{color: var(--danger)}.ui-table .is-key{color: var(--text);font-weight: 600}.ui-table__empty td{color: var(--text-dim);padding: 2rem;text-align: center}.ui-table__sort{align-items: center;background: none;border: 0;color: inherit;cursor: pointer;display: flex;font: inherit;gap: 0.4rem;letter-spacing: inherit;padding: 0;text-transform: inherit;inline-size: 100%}.ui-table__sort::after{content: '↕';opacity: 0.4}.ui-table th[aria-sort='ascending'] .ui-table__sort::after{content: '↑';opacity: 1}.ui-table th[aria-sort='descending'] .ui-table__sort::after{content: '↓';opacity: 1}.ui-table__select{inline-size: 1px;white-space: nowrap}.ui-table--selectable tbody tr[aria-selected='true'] td{background: var(--bg-accent)}.ui-table__toolbar{align-items: center;border: 1px solid var(--line);border-block-end: 0;border-start-start-radius: var(--radius-md);border-start-end-radius: var(--radius-md);display: flex;gap: var(--space-sm);padding: var(--space-sm) var(--space-md)}.ui-table--loading{opacity: 0.6;pointer-events: none}.ui-app-shell{display: grid;grid-template-columns: var(--app-rail,14rem) minmax(0,1fr);min-block-size: 100vh}.ui-app-shell--full{grid-template-columns: minmax(0,1fr)}.ui-app-rail{background: var(--panel);border-inline-end: 1px solid var(--line);display: flex;flex-direction: column;gap: var(--space-md);padding: var(--space-md);position: sticky;inset-block-start: 0;block-size: 100vh;overflow-y: auto}.ui-app-rail__brand{align-items: center;color: var(--text);display: flex;font-family: var(--display);font-size: 1.05rem;gap: 0.5rem;letter-spacing: var(--tracking-wide);padding: 0.35rem 0.5rem;text-transform: uppercase}.ui-app-rail__brand::before{background: var(--accent);border-radius: 50%;content: '';block-size: 0.5rem;inline-size: 0.5rem}.ui-app-nav{display: grid;gap: 0.15rem}.ui-app-nav__section{color: var(--text-dim);font-family: var(--mono);font-size: var(--text-2xs);letter-spacing: var(--tracking-wide);margin: var(--space-sm) 0 0.3rem;padding: 0 0.5rem;text-transform: uppercase}.ui-app-nav a{align-items: center;border-inline-start: 2px solid transparent;color: var(--text-soft);display: flex;font-family: var(--mono);font-size: var(--text-sm);gap: 0.55rem;padding: 0.5rem 0.6rem;transition: background-color var(--duration-fast) var(--ease-standard),border-color var(--duration-fast) var(--ease-standard),color var(--duration-fast) var(--ease-standard)}.ui-app-nav a::before{background: currentColor;border-radius: 50%;content: '';block-size: 0.34rem;opacity: 0.45;inline-size: 0.34rem}.ui-app-nav a:hover{background: var(--bg-accent);color: var(--text)}.ui-app-nav a.is-active{background: var(--accent-soft);border-inline-start-color: var(--accent);color: var(--accent-text)}.ui-app-nav a.is-active::before{opacity: 1}.ui-app-rail__foot{border-block-start: 1px solid var(--line);color: var(--text-dim);font-family: var(--mono);font-size: var(--text-2xs);margin-block-start: auto;padding-block-start: var(--space-sm)}.ui-app-main{display: flex;flex-direction: column;min-inline-size: 0}.ui-app-topbar{align-items: center;background: color-mix(in srgb,var(--bg) 86%,transparent);backdrop-filter: blur(8px);border-block-end: 1px solid var(--line);display: flex;gap: var(--space-md);justify-content: space-between;padding: 0.75rem var(--space-lg);position: sticky;inset-block-start: 0;z-index: var(--z-raised)}.ui-app-topbar__title{color: var(--text);font-family: var(--display);font-size: 1.1rem;letter-spacing: var(--tracking-wide);margin: 0;text-transform: uppercase}.ui-app-content{display: grid;gap: var(--space-lg);padding: var(--space-lg)}.ui-app-toolbar{align-items: center;background: var(--panel);border: 1px solid var(--line);border-radius: var(--radius-md);display: flex;flex-wrap: wrap;gap: 0.7rem;justify-content: space-between;padding: 0.7rem 0.85rem}.ui-app-toolbar__group{align-items: center;display: flex;flex-wrap: wrap;gap: 0.5rem}.ui-app-panel{background: var(--panel);border: 1px solid var(--line);border-radius: var(--radius-md);display: grid;gap: 0.85rem;padding: var(--space-md)}.ui-app-panel__head{align-items: flex-start;display: flex;gap: 0.7rem;justify-content: space-between}.ui-app-panel__title{color: var(--text);font-family: var(--display);font-size: 0.95rem;letter-spacing: var(--tracking-wide);margin: 0;text-transform: uppercase}.ui-app-panel__head p,.ui-app-empty-state p{color: var(--text-dim);margin: 0.3rem 0 0}.ui-app-metrics{display: grid;gap: var(--space-md);grid-template-columns: repeat(auto-fit,minmax(11rem,1fr))}@container bronto (max-width: 30rem){.ui-app-metrics{grid-template-columns: 1fr}}.ui-app-metric{background: var(--panel);border: 1px solid var(--line);border-radius: var(--radius-md);display: grid;gap: 0.4rem;padding: var(--space-md)}.ui-app-metric__label{color: var(--text-dim);font-family: var(--mono);font-size: var(--text-2xs);letter-spacing: var(--tracking-wide);text-transform: uppercase}.ui-app-metric__value{color: var(--text);font-family: var(--display);font-size: 1.9rem;font-variant-numeric: tabular-nums;letter-spacing: 0.01em;line-height: 1}.ui-app-metric__delta{font-family: var(--mono);font-size: var(--text-xs)}.ui-app-metric__delta.is-pos{color: var(--success)}.ui-app-metric__delta.is-neg{color: var(--danger)}.ui-app-empty-state{border: 1px dashed var(--line-strong);border-radius: var(--radius-md);color: var(--text-dim);padding: var(--space-lg);text-align: center}.ui-app-rail__toggle{display: none}@media (max-width: 880px){.ui-app-shell{grid-template-columns: minmax(0,1fr)}.ui-app-rail{flex-direction: row;block-size: auto;overflow-x: auto;position: sticky;inset-block-start: 0;z-index: calc(var(--z-raised) + 1)}.ui-app-rail__foot{display: none}.ui-app-nav{grid-auto-flow: column;gap: 0.15rem}.ui-app-nav__section{display: none}.ui-app-nav a{border-inline-start: 0;border-block-end: 2px solid transparent;white-space: nowrap}.ui-app-nav a.is-active{border-inline-start: 0;border-block-end-color: var(--accent)}.ui-app-content{padding: var(--space-md)}}}
+@layer bronto{:root{--radius-xl: 4px;--radius-lg: 3px;--radius-md: 2px;--radius-sm: 1px;--radius-pill: 999px;--space-2xs: 0.25rem;--space-xs: 0.5rem;--space-sm: 0.75rem;--space-md: 1rem;--space-lg: 1.35rem;--space-xl: 1.75rem;--space-2xl: 2.5rem;--mono: 'JetBrains Mono','Fira Code','Cascadia Code','SF Mono',ui-monospace,monospace;--sans: 'Inter','SF Pro Text',-apple-system,BlinkMacSystemFont,'Segoe UI',system-ui,sans-serif;--display: 'Doto',var(--mono);--dot-font: 'Doto',var(--mono);--text-2xs: 0.68rem;--text-xs: 0.76rem;--text-sm: 0.86rem;--text-base: 0.95rem;--text-lg: 1.15rem;--text-xl: 1.45rem;--tracking-wide: 0.14em;--tracking-wider: 0.22em;--ease-standard: cubic-bezier(0.2,0.8,0.2,1);--ease-spring: cubic-bezier(0.16,1,0.3,1);--ease-out: cubic-bezier(0.33,1,0.68,1);--duration-fast: 130ms;--duration-base: 200ms;--duration-slow: 360ms;--dot-size: 2px;--dot-gap: 14px;--z-base: 0;--z-raised: 10;--z-sticky: 20;--z-overlay: 30;--z-popover: 50;--z-toast: 60;--accent-1: color-mix(in srgb,var(--accent) 8%,var(--bg));--accent-2: color-mix(in srgb,var(--accent) 16%,var(--bg));--accent-3: color-mix(in srgb,var(--accent) 32%,var(--bg));--accent-4: color-mix(in srgb,var(--accent) 60%,var(--bg));--accent-5: var(--accent);--accent-6: var(--accent-strong);--surface-1: var(--bg);--surface-2: var(--bg-elevated);--surface-3: var(--panel);--surface-4: var(--panel-soft);--surface-5: var(--line);--surface-6: var(--line-strong);--bronto-color-bg: var(--bg);--bronto-color-surface: var(--panel);--bronto-color-surface-raised: var(--panel-strong);--bronto-color-border: var(--line);--bronto-color-border-strong: var(--line-strong);--bronto-color-text: var(--text);--bronto-color-text-muted: var(--text-dim);--bronto-color-action: var(--accent);--bronto-color-on-action: var(--button-text);--bronto-color-focus: var(--focus-ring);--bronto-color-success: var(--success);--bronto-color-warning: var(--warning);--bronto-color-danger: var(--danger);--surface: var(--panel);--surface-raised: var(--panel-strong);--surface-muted: var(--panel-soft);--border: var(--line);--border-strong: var(--line-strong)}:root,:root[data-theme='light']{color-scheme: light;--bg: #f4f4f2;--bg-elevated: #fbfbfa;--bg-accent: color-mix(in srgb,var(--accent) 6%,transparent);--panel: #ffffff;--panel-strong: #ffffff;--panel-soft: #ececea;--line: #d8d8d4;--line-strong: #a8a8a2;--text: #0a0a0a;--text-soft: #353533;--text-dim: #686863;--accent: #d71921;--accent-strong: color-mix(in srgb,var(--accent) 83%,#000);--accent-text: var(--accent-strong);--accent-soft: color-mix(in srgb,var(--accent) 10%,transparent);--success: #2f7d4f;--success-soft: rgb(47,125,79,0.12);--warning: #806414;--warning-soft: rgb(128,100,20,0.13);--orange: #a85f32;--orange-soft: rgb(168,95,50,0.13);--danger: #c01622;--danger-soft: rgb(192,22,34,0.1);--code-bg: rgb(10,10,10,0.05);--button-text: #ffffff;--field-dot: rgb(10,10,10,0.16);--field-dot-hot: rgb(10,10,10,0.4);--field-dot-accent: color-mix(in srgb,var(--accent) 78%,transparent);--focus-ring: var(--accent);--shadow: none;--shadow-raised: 0 0 0 1px var(--line-strong)}@media (prefers-color-scheme: dark){:root:not([data-theme='light']){color-scheme: dark;--bg: #000000;--bg-elevated: #0a0a0a;--bg-accent: color-mix(in srgb,var(--accent) 8%,transparent);--panel: #0c0c0c;--panel-strong: #141414;--panel-soft: #1a1a1a;--line: #2a2a2a;--line-strong: #444444;--text: #f2f2f2;--text-soft: #c4c4c4;--text-dim: #858585;--accent: #ff3b41;--accent-strong: color-mix(in srgb,var(--accent) 84%,#fff);--accent-text: var(--accent-strong);--accent-soft: color-mix(in srgb,var(--accent) 14%,transparent);--success: #4ec27e;--success-soft: rgb(78,194,126,0.14);--warning: #d8bd72;--warning-soft: rgb(216,189,114,0.14);--orange: #d08c5b;--orange-soft: rgb(208,140,91,0.15);--danger: #ff4d54;--danger-soft: rgb(255,77,84,0.15);--code-bg: rgb(255,255,255,0.05);--button-text: #000000;--field-dot: rgb(242,242,242,0.14);--field-dot-hot: rgb(242,242,242,0.36);--field-dot-accent: color-mix(in srgb,var(--accent) 82%,transparent);--focus-ring: var(--accent);--shadow: none;--shadow-raised: 0 0 0 1px var(--line-strong)}}:root[data-theme='dark']{color-scheme: dark;--bg: #000000;--bg-elevated: #0a0a0a;--bg-accent: color-mix(in srgb,var(--accent) 8%,transparent);--panel: #0c0c0c;--panel-strong: #141414;--panel-soft: #1a1a1a;--line: #2a2a2a;--line-strong: #444444;--text: #f2f2f2;--text-soft: #c4c4c4;--text-dim: #858585;--accent: #ff3b41;--accent-strong: color-mix(in srgb,var(--accent) 84%,#fff);--accent-text: var(--accent-strong);--accent-soft: color-mix(in srgb,var(--accent) 14%,transparent);--success: #4ec27e;--success-soft: rgb(78,194,126,0.14);--warning: #d8bd72;--warning-soft: rgb(216,189,114,0.14);--orange: #d08c5b;--orange-soft: rgb(208,140,91,0.15);--danger: #ff4d54;--danger-soft: rgb(255,77,84,0.15);--code-bg: rgb(255,255,255,0.05);--button-text: #000000;--field-dot: rgb(242,242,242,0.14);--field-dot-hot: rgb(242,242,242,0.36);--field-dot-accent: color-mix(in srgb,var(--accent) 82%,transparent);--focus-ring: var(--accent);--shadow: none;--shadow-raised: 0 0 0 1px var(--line-strong)}[data-density='compact']{--space-2xs: 0.2rem;--space-xs: 0.4rem;--space-sm: 0.6rem;--space-md: 0.8rem;--space-lg: 1.05rem;--space-xl: 1.35rem;--space-2xl: 1.9rem}[data-density='comfortable']{--space-2xs: 0.3rem;--space-xs: 0.6rem;--space-sm: 0.95rem;--space-md: 1.25rem;--space-lg: 1.7rem;--space-xl: 2.2rem;--space-2xl: 3.1rem}[data-contrast='high']{--line: var(--line-strong);--text-dim: var(--text-soft);--focus-ring: var(--accent);--shadow-raised: 0 0 0 1px var(--text)}@media (prefers-contrast: more){:root{--line: var(--line-strong);--text-dim: var(--text-soft);--focus-ring: var(--accent);--shadow-raised: 0 0 0 1px var(--text)}}@font-face{font-family: Doto;font-style: normal;font-weight: 400;font-display: swap;src: url('../fonts/doto-400.ttf') format('truetype')}@font-face{font-family: Doto;font-style: normal;font-weight: 500;font-display: swap;src: url('../fonts/doto-500.ttf') format('truetype')}@font-face{font-family: Doto;font-style: normal;font-weight: 600;font-display: swap;src: url('../fonts/doto-600.ttf') format('truetype')}@font-face{font-family: Doto;font-style: normal;font-weight: 700;font-display: swap;src: url('../fonts/doto-700.ttf') format('truetype')}@font-face{font-family: Doto;font-style: normal;font-weight: 800;font-display: swap;src: url('../fonts/doto-800.ttf') format('truetype')}@font-face{font-family: Doto;font-style: normal;font-weight: 900;font-display: swap;src: url('../fonts/doto-900.ttf') format('truetype')}@media (prefers-reduced-data: reduce){:root{--display: var(--mono);--dot-font: var(--mono)}}*,*::before,*::after{box-sizing: border-box}html{background: var(--bg);color: var(--text);font-family: var(--sans);font-size: 15px;line-height: 1.55;scroll-behavior: smooth;text-rendering: optimizeLegibility;-webkit-font-smoothing: antialiased}body{accent-color: var(--accent);background: var(--bg);color: var(--text);margin: 0;min-block-size: 100vh;position: relative}main [id]{scroll-margin-top: 6rem}::selection{background: var(--accent);color: var(--button-text)}a{color: inherit;text-decoration: none}a,button,summary{-webkit-tap-highlight-color: transparent}button,input,select,textarea{font: inherit}img,svg{display: block;max-inline-size: 100%}p,li{color: var(--text-soft);line-height: 1.65}h1,h2,h3,h4{color: var(--text);font-family: var(--display);font-weight: 700;letter-spacing: 0.01em;line-height: 1.06;margin: 0;text-transform: uppercase}h1{font-size: clamp(2.6rem,6vw,4.6rem);letter-spacing: 0.02em}h2{font-size: clamp(1.7rem,3.4vw,2.4rem)}h3{font-size: 1.25rem}h4{font-size: 1rem;letter-spacing: var(--tracking-wide)}strong,b{color: var(--text);font-weight: 700}code,kbd,samp{background: var(--code-bg);border: 1px solid var(--line);border-radius: var(--radius-sm);color: var(--text);font-family: var(--mono);font-size: 0.88em;padding: 0.1rem 0.36rem}pre{background: var(--code-bg);border: 1px solid var(--line);border-radius: var(--radius-md);font-family: var(--mono);overflow-x: auto;padding: 1rem 1.1rem}pre code{background: transparent;border: 0;padding: 0}hr{border: 0;border-block-start: 1px solid var(--line);margin: var(--space-lg) 0}::-webkit-scrollbar{block-size: 10px;inline-size: 10px}::-webkit-scrollbar-thumb{background: var(--line-strong);border: 2px solid var(--bg);border-radius: var(--radius-pill)}::-webkit-scrollbar-track{background: transparent}a:focus-visible,button:focus-visible,summary:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,[tabindex]:focus-visible{outline: 2px solid var(--focus-ring);outline-offset: 2px}.ui-muted{color: var(--text-dim)}.ui-mono{font-family: var(--mono)}.ui-display{font-family: var(--display);text-transform: uppercase}.ui-visually-hidden{clip-path: inset(50%);block-size: 1px;overflow: hidden;position: absolute;white-space: nowrap;inline-size: 1px}@media (forced-colors: active){.ui-progress__bar,.ui-dotbar i.is-on,.ui-dotspinner i{background: Highlight}.ui-dot,.ui-dot--accent,.ui-dot--success,.ui-dot--warning,.ui-dot--danger,.ui-switch__thumb{background: CanvasText}.ui-dot--live::after{border-color: CanvasText}.ui-switch input:checked + .ui-switch__track,.ui-segmented__option:has(input:checked){outline: 2px solid Highlight;outline-offset: -2px}.ui-tab.is-active{border-block-end-color: Highlight;color: Highlight}a:focus-visible,button:focus-visible,summary:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,[tabindex]:focus-visible{outline: 2px solid Highlight}}@media print{html,body{background: #fff;color: #000}.ui-dotfield,.ui-toast-stack,.ui-app-rail,.ui-app-topbar,.ui-sitenav,.ui-themetoggle__button,.ui-sitemenu,.ui-spinner,.ui-dotloader,.ui-dotspinner,dialog.ui-modal::backdrop{display: none !important}*,*::before,*::after{box-shadow: none !important;text-shadow: none !important}.ui-card,.ui-panel,.ui-surface,.ui-alert,.ui-table-wrap{border: 1px solid #999}.ui-table-wrap,.ui-prose table,.ui-tabs__list,pre{overflow: visible !important}.ui-card,.ui-panel,.ui-alert,figure,blockquote,pre,tr{break-inside: avoid}:is(h1,h2,h3,h4,h5,h6){break-after: avoid}.ui-prose a[href^="http"]::after{content: " (" attr(href) ")";font-size: 0.85em;word-break: break-all}@page{margin: 18mm}}@keyframes pulseDot{0%,100%{opacity: 0.35;transform: scale(0.84)}50%{opacity: 1;transform: scale(1)}}@keyframes scan{0%{transform: translateY(-120%)}100%{transform: translateY(320%)}}@keyframes growBar{to{transform: scaleX(1)}}@keyframes drawLine{from{opacity: 0;stroke-dasharray: 0 999}to{opacity: 1;stroke-dasharray: 999 0}}@keyframes pulseNode{0%,100%{transform: scale(1)}50%{transform: scale(1.08)}}@keyframes pulseRing{0%{opacity: 0.7;transform: scale(0.7)}100%{opacity: 0;transform: scale(1.3)}}@keyframes uiFadeIn{from{opacity: 0}to{opacity: 1}}@keyframes uiRise{from{opacity: 0;transform: translateY(10px)}to{opacity: 1;transform: translateY(0)}}@keyframes uiDotIn{0%{opacity: 0;transform: scale(0.2)}60%{opacity: 1;transform: scale(1.15)}100%{opacity: 1;transform: scale(1)}}@keyframes uiSpin{to{transform: rotate(360deg)}}@keyframes uiBlink{0%,45%{opacity: 1}55%,100%{opacity: 0.2}}@keyframes uiShimmer{from{background-position: 200% 0}to{background-position: -200% 0}}@keyframes uiMatrixReveal{from{clip-path: inset(0 100% 0 0)}to{clip-path: inset(0 0 0 0)}}@keyframes uiTrack{0%{inset-inline-start: -45%}100%{inset-inline-start: 100%}}@keyframes uiToastIn{from{opacity: 0;transform: translateY(12px) scale(0.98)}to{opacity: 1;transform: translateY(0) scale(1)}}.ui-animate-in{animation: uiRise var(--duration-slow) var(--ease-spring) both}.ui-animate-fade{animation: uiFadeIn var(--duration-base) var(--ease-standard) both}.ui-animate-dot{animation: uiDotIn var(--duration-base) var(--ease-spring) both}.ui-animate-matrix{animation: uiMatrixReveal var(--duration-slow) var(--ease-out) both}.ui-stagger > *{animation: uiRise var(--duration-slow) var(--ease-spring) both;animation-delay: calc(var(--i,0) * 60ms)}.ui-stagger--auto > *:nth-child(1){animation-delay: 0ms}.ui-stagger--auto > *:nth-child(2){animation-delay: 60ms}.ui-stagger--auto > *:nth-child(3){animation-delay: 120ms}.ui-stagger--auto > *:nth-child(4){animation-delay: 180ms}.ui-stagger--auto > *:nth-child(5){animation-delay: 240ms}.ui-stagger--auto > *:nth-child(6){animation-delay: 300ms}.ui-stagger--auto > *:nth-child(n + 7){animation-delay: 360ms}@media (prefers-reduced-motion: no-preference){.ui-reveal{opacity: 0;transform: translateY(14px);transition: opacity var(--duration-slow) var(--ease-out),transform var(--duration-slow) var(--ease-out)}.ui-reveal.is-visible{opacity: 1;transform: none}}.ui-skeleton{background: linear-gradient( 90deg,var(--panel-soft) 25%,color-mix(in srgb,var(--panel-soft) 55%,var(--line-strong)) 50%,var(--panel-soft) 75% );background-size: 200% 100%;animation: uiShimmer 1.4s linear infinite;border-radius: var(--radius-sm);color: transparent;min-block-size: 0.8em}.ui-spinner{animation: uiSpin 0.7s linear infinite;border: 2px solid var(--line);border-radius: 50%;border-block-start-color: var(--accent);display: inline-block;block-size: 1.1rem;inline-size: 1.1rem}.ui-caret::after{animation: uiBlink 1.1s steps(1) infinite;content: '▮';margin-inline-start: 0.1em}@media (prefers-reduced-motion: reduce){html{scroll-behavior: auto}*,*::before,*::after{animation-duration: 0.01ms !important;animation-iteration-count: 1 !important;transition-duration: 0.01ms !important}.ui-reveal{opacity: 1 !important;transform: none !important}}.ui-dotgrid{--_dot: var(--dot-color,var(--field-dot));background-image: radial-gradient(var(--_dot) var(--dot-size),transparent var(--dot-size));background-position: 0 0;background-size: var(--dot-gap) var(--dot-gap)}.ui-dotgrid--accent{--dot-color: var(--field-dot-accent)}.ui-dotgrid--dense{--dot-gap: 8px}.ui-dotfield{--_dot: var(--dot-color,var(--field-dot));background-image: radial-gradient(var(--_dot) var(--dot-size),transparent var(--dot-size));background-size: var(--dot-gap) var(--dot-gap);inset: 0;mask-image: radial-gradient(ellipse at 50% 0%,#000 30%,transparent 78%);pointer-events: none;position: fixed;z-index: var(--z-base)}.ui-dotrule{background-image: radial-gradient(var(--line-strong) 1.4px,transparent 1.4px);background-position: 0 50%;background-size: 9px 9px;border: 0;block-size: 3px;margin: var(--space-md) 0;inline-size: 100%}.ui-dotmatrix{display: grid;gap: var(--dotmatrix-gap,0.5rem);grid-template-columns: repeat(var(--dotmatrix-cols,12),minmax(0,1fr))}.ui-dotmatrix__cell{aspect-ratio: 1;background: var(--field-dot);border-radius: 50%}.ui-dotmatrix__cell--hot{background: var(--field-dot-hot)}.ui-dotmatrix__cell--accent{background: var(--field-dot-accent)}.ui-dot{background: var(--text-dim);border-radius: 50%;display: inline-block;flex: 0 0 auto;block-size: 0.55rem;inline-size: 0.55rem}.ui-dot--accent{background: var(--accent)}.ui-dot--success{background: var(--success)}.ui-dot--warning{background: var(--warning)}.ui-dot--danger{background: var(--danger)}.ui-dot--live{background: var(--success);box-shadow: 0 0 0 0 color-mix(in srgb,var(--success) 70%,transparent);position: relative}.ui-dot--live::after{animation: pulseRing 1.8s var(--ease-out) infinite;border: 1px solid var(--success);border-radius: 50%;content: '';inset: -3px;position: absolute}.ui-status{align-items: center;color: var(--text-soft);display: inline-flex;font-family: var(--mono);font-size: var(--text-xs);gap: 0.45rem;letter-spacing: var(--tracking-wide);text-transform: uppercase}.ui-dotloader{align-items: center;display: inline-flex;gap: 0.32rem}.ui-dotloader span{animation: pulseDot 1s var(--ease-standard) infinite;background: var(--accent);border-radius: 50%;block-size: 0.42rem;inline-size: 0.42rem}.ui-dotloader span:nth-child(2){animation-delay: 0.16s}.ui-dotloader span:nth-child(3){animation-delay: 0.32s}.ui-dotspinner{--ds-box: 1.6rem;--ds-dot: 0.26rem;animation: uiSpin 1s steps(8) infinite;display: inline-block;flex: 0 0 auto;block-size: var(--ds-box);position: relative;inline-size: var(--ds-box)}.ui-dotspinner i{background: var(--accent);border-radius: 50%;block-size: var(--ds-dot);inset: 0;margin: auto;position: absolute;inline-size: var(--ds-dot)}.ui-dotspinner i:nth-child(1){opacity: 1;transform: rotate(0deg) translateY(calc(var(--ds-box) / -2 + var(--ds-dot) / 2))}.ui-dotspinner i:nth-child(2){opacity: 0.85;transform: rotate(45deg) translateY(calc(var(--ds-box) / -2 + var(--ds-dot) / 2))}.ui-dotspinner i:nth-child(3){opacity: 0.7;transform: rotate(90deg) translateY(calc(var(--ds-box) / -2 + var(--ds-dot) / 2))}.ui-dotspinner i:nth-child(4){opacity: 0.56;transform: rotate(135deg) translateY(calc(var(--ds-box) / -2 + var(--ds-dot) / 2))}.ui-dotspinner i:nth-child(5){opacity: 0.44;transform: rotate(180deg) translateY(calc(var(--ds-box) / -2 + var(--ds-dot) / 2))}.ui-dotspinner i:nth-child(6){opacity: 0.34;transform: rotate(225deg) translateY(calc(var(--ds-box) / -2 + var(--ds-dot) / 2))}.ui-dotspinner i:nth-child(7){opacity: 0.25;transform: rotate(270deg) translateY(calc(var(--ds-box) / -2 + var(--ds-dot) / 2))}.ui-dotspinner i:nth-child(8){opacity: 0.16;transform: rotate(315deg) translateY(calc(var(--ds-box) / -2 + var(--ds-dot) / 2))}.ui-dotspinner--sm{--ds-box: 1.05rem;--ds-dot: 0.18rem}.ui-dotspinner--lg{--ds-box: 2.6rem;--ds-dot: 0.42rem}.ui-dotbar{display: flex;gap: 3px}.ui-dotbar i{background: var(--field-dot);border-radius: 1px;flex: 1;block-size: 0.5rem}.ui-dotbar i.is-on{background: var(--accent)}.ui-dotbar--indeterminate i{animation: pulseDot 1.1s var(--ease-standard) infinite}.ui-dotbar--indeterminate i:nth-child(2){animation-delay: 0.09s}.ui-dotbar--indeterminate i:nth-child(3){animation-delay: 0.18s}.ui-dotbar--indeterminate i:nth-child(4){animation-delay: 0.27s}.ui-dotbar--indeterminate i:nth-child(5){animation-delay: 0.36s}.ui-dotbar--indeterminate i:nth-child(6){animation-delay: 0.45s}.ui-dotbar--indeterminate i:nth-child(7){animation-delay: 0.54s}.ui-dotbar--indeterminate i:nth-child(n + 8){animation-delay: 0.63s}.ui-matrix{clip-path: inset(0 100% 0 0);transition: clip-path var(--duration-slow) var(--ease-out)}.ui-matrix.is-in{clip-path: inset(0 0 0 0)}@media (prefers-reduced-motion: reduce){.ui-dot--live::after,.ui-dotloader span,.ui-dotspinner,.ui-dotbar--indeterminate i{animation: none}.ui-dotspinner i{opacity: 0.6}.ui-matrix{clip-path: none}}.ui-themetoggle__button{align-items: center;background: transparent;border: 1px solid var(--line-strong);border-radius: var(--radius-md);color: var(--text);cursor: pointer;display: inline-flex;font-family: var(--mono);font-size: var(--text-xs);font-weight: 600;gap: 0.4rem;justify-content: center;letter-spacing: var(--tracking-wide);min-block-size: 2rem;min-inline-size: 7rem;padding: 0.42rem 0.66rem;text-transform: uppercase;transition: background-color var(--duration-fast) var(--ease-standard),border-color var(--duration-fast) var(--ease-standard),color var(--duration-fast) var(--ease-standard);white-space: nowrap}.ui-themetoggle__button:hover{border-color: var(--accent);color: var(--accent-text)}.ui-themetoggle__prefix{color: var(--text-dim)}.ui-themetoggle__label{color: var(--text);font-weight: 700}.ui-themetoggle__track{background: var(--panel-soft);border: 1px solid var(--line-strong);border-radius: var(--radius-pill);display: inline-flex;block-size: 0.8rem;padding: 0.12rem;inline-size: 1.5rem}.ui-themetoggle__thumb{background: var(--text-dim);border-radius: 50%;display: block;block-size: 100%;transform: translateX(0);transition: background-color var(--duration-fast) var(--ease-standard),transform var(--duration-fast) var(--ease-spring);inline-size: 0.56rem}[data-theme='dark'] .ui-themetoggle__thumb{background: var(--accent);transform: translateX(0.6rem)}[dir='rtl'][data-theme='dark'] .ui-themetoggle__thumb,[dir='rtl'] [data-theme='dark'] .ui-themetoggle__thumb{transform: translateX(-0.6rem)}@media (hover: hover){.ui-themetoggle__button:active{transform: translateY(1px)}}.ui-container{inline-size: 100%;margin-inline: auto;max-inline-size: var(--container,72rem);padding-inline: var(--space-md)}.ui-container--narrow{max-inline-size: var(--container-narrow,44rem)}.ui-container--wide{max-inline-size: var(--container-wide,82rem)}.ui-skiplink{background: var(--panel-strong);border: 1px solid var(--line-strong);border-radius: var(--radius-md);color: var(--text);inset-block-start: -4rem;inset-inline-start: var(--space-md);padding: 0.7rem 1rem;position: fixed;z-index: var(--z-toast)}.ui-skiplink:focus{inset-block-start: var(--space-md)}.ui-siteheader{align-items: center;border-block-end: 1px solid var(--line);display: flex;flex-wrap: wrap;gap: var(--space-md);justify-content: space-between;padding-block: var(--space-sm)}.ui-siteheader--sticky{position: sticky;inset-block-start: 0;z-index: var(--z-sticky)}.ui-siteheader__brand{align-items: center;color: var(--text);display: inline-flex;font-family: var(--display);font-size: var(--text-lg);gap: 0.5rem;letter-spacing: var(--tracking-wide);text-transform: uppercase}.ui-siteheader__brand::before{background: var(--accent);border-radius: 50%;block-size: 0.5rem;content: '';flex: 0 0 auto;inline-size: 0.5rem}.ui-siteheader__actions{align-items: center;display: inline-flex;gap: var(--space-xs)}.ui-sitenav{display: inline-flex;flex-wrap: wrap;gap: 0.15rem}.ui-sitenav a{align-items: center;border: 1px solid transparent;border-radius: var(--radius-md);color: var(--text-soft);display: inline-flex;font-family: var(--mono);font-size: var(--text-xs);gap: 0.45rem;letter-spacing: var(--tracking-wide);padding: 0.4rem 0.6rem;text-transform: uppercase;transition: border-color var(--duration-fast) var(--ease-standard),color var(--duration-fast) var(--ease-standard)}.ui-sitenav a::before{background: currentColor;border-radius: 50%;block-size: 0.32rem;content: '';inline-size: 0.32rem;opacity: 0;transform: scale(0.5);transition: opacity var(--duration-fast) var(--ease-standard),transform var(--duration-fast) var(--ease-spring)}.ui-sitenav a[aria-current]{color: var(--accent-text)}.ui-sitenav a[aria-current]::before{opacity: 1;transform: scale(1)}@media (hover: hover){.ui-sitenav a:hover{color: var(--text)}.ui-sitenav a:hover::before{opacity: 1;transform: scale(1)}}.ui-sitemenu{display: none;position: relative}.ui-sitemenu > summary{align-items: center;background: transparent;border: 1px solid var(--line-strong);border-radius: var(--radius-md);color: var(--text);cursor: pointer;display: inline-flex;font-family: var(--mono);font-size: var(--text-xs);font-weight: 600;gap: 0.4rem;letter-spacing: var(--tracking-wide);list-style: none;min-block-size: 2.4rem;padding: 0.42rem 0.7rem;text-transform: uppercase}.ui-sitemenu > summary::-webkit-details-marker{display: none}.ui-sitemenu[open] > summary{border-color: var(--accent);color: var(--accent-text)}.ui-sitemenu__panel{background: var(--panel-strong);border: 1px solid var(--line-strong);border-radius: var(--radius-md);box-shadow: var(--shadow-raised);display: grid;gap: 0.15rem;inset-block-start: calc(100% + 0.4rem);inset-inline-end: 0;min-inline-size: 12rem;padding: 0.4rem;position: absolute;z-index: var(--z-overlay)}@media (max-width: 720px){.ui-siteheader .ui-sitenav{display: none}.ui-sitemenu{display: block}.ui-sitemenu .ui-sitenav{display: grid}}.ui-sitefooter{align-items: center;border-block-start: 1px solid var(--line);color: var(--text-dim);display: flex;flex-wrap: wrap;font-size: var(--text-sm);gap: var(--space-sm);justify-content: space-between;margin-block-start: var(--space-2xl);padding-block: var(--space-md)}.ui-sitefooter__links{display: flex;flex-wrap: wrap;gap: var(--space-md)}.ui-sitefooter__links a{color: var(--text);text-decoration: underline;text-decoration-color: color-mix(in srgb,var(--accent) 45%,transparent);text-underline-offset: 0.2rem;transition: text-decoration-color var(--duration-fast) var(--ease-standard)}@media (hover: hover){.ui-sitefooter__links a:hover{text-decoration-color: var(--accent)}}.ui-tags{display: flex;flex-wrap: wrap;gap: 0.5rem;list-style: none;margin: 0;padding: 0}.ui-tag{background: var(--panel-soft);border: 1px solid var(--line);border-radius: var(--radius-md);color: var(--text-soft);display: inline-flex;font-size: var(--text-xs);padding: 0.28rem 0.6rem}.ui-tag--accent{background: var(--accent-soft);border-color: color-mix(in srgb,var(--accent) 42%,var(--line));color: var(--accent-text)}.ui-meta{align-items: center;color: var(--text-dim);display: flex;flex-wrap: wrap;font-family: var(--mono);font-size: var(--text-2xs);gap: 0.55rem;letter-spacing: var(--tracking-wide);list-style: none;margin: 0;padding: 0;text-transform: uppercase}.ui-meta__item{align-items: center;display: inline-flex;gap: 0.55rem}.ui-meta__item:not(:last-child)::after{background: var(--line-strong);border-radius: 50%;block-size: 0.22rem;content: '';inline-size: 0.22rem}.ui-prose{color: var(--text-soft);font-size: var(--text-base);line-height: 1.7;--prose-measure: 72ch}.ui-prose > *{margin-block: 0;max-inline-size: var(--prose-measure)}.ui-prose > * + *{margin-block-start: var(--space-md)}.ui-prose > * + :is(h1,h2,h3,h4,h5,h6){margin-block-start: var(--space-2xl)}.ui-prose > :is(figure,pre,table,hr,.ui-dotrule){max-inline-size: none}.ui-prose :is(h1,h2,h3,h4,h5,h6){color: var(--text);font-family: var(--display);line-height: 1.12;text-wrap: balance}.ui-prose h1{font-size: var(--text-xl);letter-spacing: var(--tracking-wide);text-transform: uppercase}.ui-prose h2{font-size: var(--text-lg);letter-spacing: var(--tracking-wide);padding-block-end: 0.3rem;border-block-end: 1px solid var(--line);text-transform: uppercase}.ui-prose h3{font-size: var(--text-lg)}.ui-prose :is(h4,h5,h6){font-size: var(--text-base);letter-spacing: var(--tracking-wide);text-transform: uppercase}.ui-prose :is(h5,h6){color: var(--text-dim)}.ui-prose :is(h1,h2,h3,h4,h5,h6)[id]{scroll-margin-block-start: 6rem}.ui-prose :is(p,ul,ol,dl,blockquote,figure,pre,table){font-size: inherit}.ui-prose a{color: var(--text);text-decoration: underline;text-decoration-color: color-mix(in srgb,var(--accent) 55%,transparent);text-decoration-thickness: 1px;text-underline-offset: 0.22rem;transition: color var(--duration-fast) var(--ease-standard),text-decoration-color var(--duration-fast) var(--ease-standard)}.ui-prose strong{color: var(--text)}.ui-prose mark{background: var(--accent-soft);color: var(--text);padding: 0.02em 0.22em}.ui-prose small{font-size: var(--text-xs)}.ui-prose abbr[title]{text-decoration: underline dotted;text-underline-offset: 0.2rem}.ui-prose :is(sub,sup){font-size: 0.72em}@media (hover: hover){.ui-prose a:hover{color: var(--accent-text);text-decoration-color: var(--accent)}}.ui-prose :is(ul,ol){padding-inline-start: 1.4rem}.ui-prose li + li{margin-block-start: 0.4rem}.ui-prose li::marker{color: var(--accent-text)}.ui-prose ul{list-style: square}.ui-prose :is(ul,ol) :is(ul,ol){margin-block-start: 0.4rem}.ui-prose li:has(> input[type='checkbox']){list-style: none;margin-inline-start: -1.4rem}.ui-prose li > input[type='checkbox']{accent-color: var(--accent);margin-inline-end: 0.4rem}.ui-prose blockquote{border-inline-start: 2px solid var(--accent);color: var(--text-dim);font-style: normal;padding-inline-start: var(--space-md)}.ui-prose blockquote > * + *{margin-block-start: var(--space-xs)}.ui-prose dt{color: var(--text-dim);font-family: var(--mono);font-size: var(--text-2xs);font-weight: 700;letter-spacing: var(--tracking-wide);text-transform: uppercase}.ui-prose dd{margin-inline-start: 0;padding-block: 0.16rem 0.6rem}.ui-prose dd + dt{border-block-start: 1px solid var(--line);padding-block-start: 0.6rem}.ui-prose :not(pre) > code{font-size: 0.88em}.ui-prose pre{font-size: var(--text-sm);line-height: 1.6;overflow-x: auto}.ui-prose hr{background-image: radial-gradient(var(--line-strong) 1.4px,transparent 1.4px);background-position: 0 50%;background-size: 9px 9px;block-size: 3px;border: 0;margin-block: var(--space-xl)}.ui-prose :is(img,video,svg){block-size: auto;border-radius: var(--radius-sm);max-inline-size: 100%}.ui-prose figure{display: grid;gap: 0.5rem;justify-items: start}.ui-prose figcaption{color: var(--text-dim);font-family: var(--mono);font-size: var(--text-2xs);letter-spacing: var(--tracking-wide);text-transform: uppercase}.ui-prose table{border: 1px solid var(--line);border-collapse: collapse;border-radius: var(--radius-md);display: block;font-family: var(--mono);font-size: var(--text-sm);inline-size: 100%;overflow-x: auto}.ui-prose :is(th,td){border-block-end: 1px solid var(--line);padding: 0.6rem 0.8rem;text-align: start;vertical-align: top}.ui-prose th{background: var(--panel);color: var(--text-dim);font-size: var(--text-2xs);font-weight: 700;letter-spacing: var(--tracking-wide);text-transform: uppercase}.ui-prose td{color: var(--text-soft)}.ui-prose tbody tr:last-child :is(th,td){border-block-end: 0}.ui-prose--compact{line-height: 1.55}.ui-prose--compact > * + *{margin-block-start: var(--space-sm)}.ui-prose--compact > * + :is(h1,h2,h3,h4,h5,h6){margin-block-start: var(--space-lg)}.ui-quote{color: var(--text);display: grid;font-family: var(--display);font-size: var(--text-xl);gap: var(--space-sm);line-height: 1.2;margin-block: var(--space-xl);max-inline-size: 40ch;text-wrap: balance}.ui-quote::before{background: var(--accent);block-size: 2px;content: '';inline-size: 2.5rem}.ui-quote__cite{color: var(--text-dim);font-family: var(--mono);font-size: var(--text-2xs);font-style: normal;letter-spacing: var(--tracking-wide);text-transform: uppercase}.ui-stack{display: grid;gap: var(--stack-gap,var(--space-md))}.ui-cluster{align-items: center;display: flex;flex-wrap: wrap;gap: var(--cluster-gap,var(--space-xs))}.ui-cluster--between{justify-content: space-between}.ui-grid{display: grid;gap: var(--grid-gap,var(--space-md));grid-template-columns: repeat(auto-fit,minmax(min(100%,var(--grid-min,16rem)),1fr))}.ui-sidebar{display: flex;flex-wrap: wrap;gap: var(--sidebar-gap,var(--space-md))}.ui-sidebar > :first-child{flex-basis: var(--sidebar-width,16rem);flex-grow: 1}.ui-sidebar > :last-child{flex-basis: 0;flex-grow: 999;min-inline-size: var(--sidebar-min,60%)}.ui-switcher{display: flex;flex-wrap: wrap;gap: var(--switcher-gap,var(--space-md))}.ui-switcher > *{flex-basis: calc((var(--switcher-min,24rem) - 100%) * 999);flex-grow: 1}.ui-center{box-sizing: content-box;margin-inline: auto;max-inline-size: var(--center-max,64rem);padding-inline: var(--center-gutter,var(--space-md))}.ui-ratio{aspect-ratio: var(--ratio,16 / 9)}.ui-ratio > *{block-size: 100%;inline-size: 100%;object-fit: cover}.ui-cq{container: var(--cq-name,bronto) / inline-size}@container bronto (max-width: 34rem){.ui-grid{--grid-min: 100%}}.ui-surface,.ui-card,.ui-panel{background: var(--panel);border: 1px solid var(--line)}.ui-card,.ui-panel{border-radius: var(--radius-lg);display: grid;gap: var(--space-sm);padding: var(--space-md)}.ui-card{transition: border-color var(--duration-base) var(--ease-standard),background-color var(--duration-base) var(--ease-standard),transform var(--duration-base) var(--ease-standard)}.ui-panel{background: var(--panel-strong)}.ui-card--accent{border-color: var(--accent)}.ui-card--interactive:focus-within{border-color: var(--line-strong)}.ui-card__head,.ui-panel__head{align-items: flex-start;display: flex;gap: var(--space-sm);justify-content: space-between}.ui-divider{border: 0;border-block-start: 1px solid var(--line);margin: 0}.ui-statgrid,.ui-app-metrics{display: grid;gap: var(--space-md);grid-template-columns: repeat(auto-fit,minmax(11rem,1fr))}@container bronto (max-width: 30rem){.ui-statgrid,.ui-app-metrics{grid-template-columns: 1fr}}.ui-stat,.ui-app-metric{background: var(--panel);border: 1px solid var(--line);border-radius: var(--radius-md);display: grid;gap: 0.4rem;padding: var(--space-md)}.ui-stat__label,.ui-app-metric__label{color: var(--text-dim);font-family: var(--mono);font-size: var(--text-2xs);letter-spacing: var(--tracking-wide);text-transform: uppercase}.ui-stat__value,.ui-app-metric__value{color: var(--text);font-family: var(--display);font-size: 1.9rem;font-variant-numeric: tabular-nums;letter-spacing: 0.01em;line-height: 1}.ui-stat__delta,.ui-app-metric__delta{font-family: var(--mono);font-size: var(--text-xs)}.ui-stat__delta.is-pos,.ui-app-metric__delta.is-pos{color: var(--success)}.ui-stat__delta.is-neg,.ui-app-metric__delta.is-neg{color: var(--danger)}.ui-num{font-variant-numeric: tabular-nums;text-align: end}.ui-num--pos{color: var(--success)}.ui-num--neg{color: var(--danger)}.ui-num--muted{color: var(--text-dim)}.ui-eyebrow{color: var(--accent-text);font-family: var(--display);font-size: var(--text-xs);font-weight: 700;letter-spacing: var(--tracking-wide);margin: 0;text-transform: uppercase}.ui-eyebrow--muted{color: var(--text-dim)}.ui-eyebrow--sm{font-size: var(--text-2xs)}.ui-button{align-items: center;background: var(--accent);border: 1px solid var(--accent);border-radius: var(--radius-md);color: var(--button-text);cursor: pointer;display: inline-flex;font-family: var(--mono);font-size: var(--text-sm);font-weight: 600;gap: 0.45rem;justify-content: center;letter-spacing: var(--tracking-wide);line-height: 1;min-block-size: 2.4rem;min-inline-size: 2.4rem;padding: 0.66rem 1rem;text-transform: uppercase;transition: background-color var(--duration-fast) var(--ease-standard),border-color var(--duration-fast) var(--ease-standard),color var(--duration-fast) var(--ease-standard),transform var(--duration-fast) var(--ease-standard)}.ui-button--ghost{background: transparent;border-color: var(--line-strong);color: var(--text)}.ui-button--subtle{background: var(--panel-soft);border-color: var(--line);color: var(--text)}.ui-button--danger{background: var(--danger);border-color: var(--danger);color: var(--button-text)}.ui-button--icon{aspect-ratio: 1;min-inline-size: 2.4rem;padding: 0}.ui-button:disabled,.ui-button[aria-disabled='true']{cursor: not-allowed;opacity: 0.45}.ui-button:active{transform: translateY(1px)}.ui-button[aria-busy='true']{cursor: progress;pointer-events: none}.ui-button[aria-busy='true']::before{animation: uiSpin 0.6s linear infinite;block-size: 0.9em;border: 2px solid currentcolor;border-block-start-color: transparent;border-radius: var(--radius-pill);content: '';flex: none;inline-size: 0.9em}@media (prefers-reduced-motion: reduce){.ui-button[aria-busy='true']::before{animation-duration: 1.4s}}.ui-link{color: var(--text);text-decoration: underline;text-decoration-color: color-mix(in srgb,var(--accent) 55%,transparent);text-decoration-thickness: 1px;text-underline-offset: 0.22rem;transition: color var(--duration-fast) var(--ease-standard),text-decoration-color var(--duration-fast) var(--ease-standard)}.ui-link--arrow,.ui-link--cta{align-items: center;display: inline-flex;gap: 0.4rem;text-decoration: none}.ui-link--cta{color: var(--accent-text);font-family: var(--display);font-weight: 700;letter-spacing: var(--tracking-wide);text-transform: uppercase}.ui-link--arrow::after,.ui-link--cta::after{border-inline-end: 1px solid currentColor;border-block-start: 1px solid currentColor;content: '';block-size: 0.42rem;transform: rotate(45deg);transition: transform var(--duration-fast) var(--ease-standard);inline-size: 0.42rem}.ui-chip{align-items: center;background: transparent;border: 1px solid var(--line-strong);border-radius: var(--radius-sm);color: var(--text-soft);display: inline-flex;font-family: var(--mono);font-size: var(--text-2xs);gap: 0.36rem;letter-spacing: var(--tracking-wide);line-height: 1;min-block-size: 1.7rem;padding: 0.32rem 0.55rem;text-transform: uppercase}.ui-chip--accent{color: var(--accent-text);border-color: var(--accent)}.ui-badge{align-items: center;background: var(--panel-soft);border: 1px solid var(--line);border-radius: var(--radius-sm);color: var(--text-soft);display: inline-flex;font-family: var(--mono);font-size: var(--text-2xs);font-weight: 700;gap: 0.34rem;letter-spacing: var(--tracking-wide);line-height: 1;padding: 0.28rem 0.5rem;text-transform: uppercase}.ui-badge--accent{background: var(--accent-soft);border-color: color-mix(in srgb,var(--accent) 45%,var(--line))}.ui-badge--success{background: var(--success-soft);border-color: color-mix(in srgb,var(--success) 40%,var(--line))}.ui-badge--warning{background: var(--warning-soft);border-color: color-mix(in srgb,var(--warning) 40%,var(--line))}.ui-badge--danger{background: var(--danger-soft);border-color: color-mix(in srgb,var(--danger) 40%,var(--line))}.ui-badge--muted{background: transparent;border-color: var(--line);color: var(--text-dim)}.ui-badge--dot::before{background: var(--text-soft);border-radius: 50%;content: '';flex: 0 0 auto;block-size: 0.4rem;inline-size: 0.4rem}.ui-badge--accent.ui-badge--dot::before{background: var(--accent)}.ui-badge--success.ui-badge--dot::before{background: var(--success)}.ui-badge--warning.ui-badge--dot::before{background: var(--warning)}.ui-badge--danger.ui-badge--dot::before{background: var(--danger)}.ui-key-value{display: grid;gap: 0.55rem;margin: 0}.ui-key-value div{border-block-start: 1px solid var(--line);display: grid;gap: 0.16rem;padding-block-start: 0.6rem}.ui-key-value dt{color: var(--text-dim);font-family: var(--mono);font-size: var(--text-2xs);font-weight: 700;letter-spacing: var(--tracking-wide);line-height: 1;text-transform: uppercase}.ui-key-value dd{color: var(--text);font-family: var(--mono);margin: 0}@media (hover: hover){.ui-card:hover{border-color: var(--line-strong)}.ui-card--interactive:hover{box-shadow: var(--shadow-raised);transform: translateY(-2px)}.ui-button:hover{background: var(--accent-strong);border-color: var(--accent-strong)}.ui-button--ghost:hover,.ui-button--subtle:hover{background: var(--panel-soft);border-color: var(--accent);color: var(--text)}.ui-button--danger:hover{background: color-mix(in srgb,var(--danger) 84%,#000)}.ui-link:hover{color: var(--accent-text);text-decoration-color: var(--accent)}.ui-link--arrow:hover::after,.ui-link--cta:hover::after{transform: translateX(0.14rem) rotate(45deg)}[dir='rtl'] .ui-link--arrow:hover::after,[dir='rtl'] .ui-link--cta:hover::after{transform: translateX(-0.14rem) rotate(45deg)}.ui-chip--accent:hover{background: var(--accent-soft)}}@media (pointer: coarse){.ui-button{min-block-size: 2.9rem;min-inline-size: 2.9rem}.ui-button--icon{min-inline-size: 2.9rem}}.ui-field{display: grid;gap: 0.35rem}.ui-label{color: var(--text-dim);font-family: var(--mono);font-size: var(--text-2xs);font-weight: 700;letter-spacing: var(--tracking-wide);text-transform: uppercase}.ui-input,.ui-select,.ui-textarea{background: var(--bg-elevated);border: 1px solid var(--line-strong);border-radius: var(--radius-md);color: var(--text);font-family: var(--mono);font-size: var(--text-sm);padding: 0.6rem 0.7rem;transition: border-color var(--duration-fast) var(--ease-standard),background-color var(--duration-fast) var(--ease-standard);inline-size: 100%}.ui-input::placeholder,.ui-textarea::placeholder{color: var(--text-dim)}.ui-textarea{min-block-size: 6rem;resize: vertical}.ui-select{appearance: none;background-image: radial-gradient(var(--text-dim) 1.5px,transparent 1.5px);background-position: right 0.75rem center;background-repeat: no-repeat;background-size: 5px 5px;padding-inline-end: 1.8rem}[dir='rtl'] .ui-select{background-position: left 0.75rem center}.ui-input:focus,.ui-select:focus,.ui-textarea:focus{border-color: var(--accent);outline: none}.ui-input:focus-visible,.ui-select:focus-visible,.ui-textarea:focus-visible{outline: 2px solid var(--focus-ring);outline-offset: 1px}.ui-input:disabled,.ui-select:disabled,.ui-textarea:disabled{cursor: not-allowed;opacity: 0.5}.ui-input[aria-invalid='true'],.ui-select[aria-invalid='true'],.ui-textarea[aria-invalid='true']{border-color: var(--danger)}.ui-hint{color: var(--text-dim);font-size: var(--text-2xs)}.ui-hint--error{color: var(--danger)}.ui-input-group{display: flex;isolation: isolate}.ui-input-group > .ui-input,.ui-input-group > .ui-select{border-radius: 0;flex: 1;margin-inline-start: -1px}.ui-input-group > :first-child{border-start-start-radius: var(--radius-md);border-end-start-radius: var(--radius-md);margin-inline-start: 0}.ui-input-group > :last-child{border-start-end-radius: var(--radius-md);border-end-end-radius: var(--radius-md)}.ui-input-group > .ui-input:focus-visible{z-index: 1}.ui-input-group__addon{align-items: center;background: var(--panel-soft);border: 1px solid var(--line);color: var(--text-dim);display: flex;font-size: var(--text-sm);padding-inline: var(--space-sm);white-space: nowrap}.ui-file{color: var(--text-soft);font-size: var(--text-sm)}.ui-file::file-selector-button{background: var(--panel-soft);border: 1px solid var(--line-strong);border-radius: var(--radius-md);color: var(--text);cursor: pointer;font: inherit;margin-inline-end: var(--space-sm);padding: 0.5rem 0.85rem}.ui-file::file-selector-button:hover{border-color: var(--accent)}.ui-range{accent-color: var(--accent);inline-size: 100%}.ui-range:focus-visible{outline: 2px solid var(--focus-ring);outline-offset: 4px}.ui-error-summary{border: 1px solid var(--danger);border-radius: var(--radius-md);color: var(--text);padding: var(--space-md)}.ui-error-summary[hidden]{display: none}.ui-error-summary__title{color: var(--danger);font-family: var(--display);font-size: var(--text-sm);font-weight: 700;letter-spacing: var(--tracking-wide);margin: 0 0 var(--space-xs);text-transform: uppercase}.ui-error-summary__list{margin: 0;padding-inline-start: var(--space-md)}.ui-error-summary__list a{color: var(--danger)}.ui-search{align-items: center;background: var(--bg-elevated);border: 1px solid var(--line-strong);border-radius: var(--radius-md);display: flex;gap: 0.5rem;padding: 0 0.7rem}.ui-search::before{background: var(--text-dim);border-radius: 50%;content: '';flex: 0 0 auto;block-size: 0.42rem;inline-size: 0.42rem}.ui-search:focus-within{border-color: var(--accent)}.ui-search:focus-within::before{background: var(--accent)}.ui-search input{background: transparent;border: 0;color: var(--text);font-family: var(--mono);font-size: var(--text-sm);outline: none;padding: 0.6rem 0;inline-size: 100%}.ui-switch{align-items: center;cursor: pointer;display: inline-flex;gap: 0.6rem}.ui-switch input{position: absolute;opacity: 0;pointer-events: none}.ui-switch__track{background: var(--panel-soft);border: 1px solid var(--line-strong);border-radius: var(--radius-pill);display: inline-flex;block-size: 1.05rem;padding: 2px;transition: background-color var(--duration-fast) var(--ease-standard),border-color var(--duration-fast) var(--ease-standard);inline-size: 1.95rem}.ui-switch__thumb{background: var(--text-dim);border-radius: 50%;block-size: 100%;transition: transform var(--duration-fast) var(--ease-spring),background-color var(--duration-fast) var(--ease-standard);inline-size: 0.78rem}.ui-switch input:checked + .ui-switch__track{background: var(--accent-soft);border-color: var(--accent)}.ui-switch input:checked + .ui-switch__track .ui-switch__thumb{background: var(--accent);transform: translateX(0.9rem)}[dir='rtl'] .ui-switch input:checked + .ui-switch__track .ui-switch__thumb{transform: translateX(-0.9rem)}.ui-switch input:focus-visible + .ui-switch__track{outline: 2px solid var(--focus-ring);outline-offset: 2px}@media (forced-colors: active){.ui-switch__track{border-color: ButtonBorder}.ui-switch__thumb{background: ButtonText}.ui-switch input:checked + .ui-switch__track{border-color: Highlight}.ui-switch input:checked + .ui-switch__track .ui-switch__thumb{background: Highlight}}.ui-check{align-items: center;cursor: pointer;display: inline-flex;gap: 0.5rem;font-size: var(--text-sm)}.ui-check input{accent-color: var(--accent);block-size: 1rem;inline-size: 1rem}@media (pointer: coarse){.ui-input,.ui-select,.ui-textarea{min-block-size: 2.9rem}.ui-search{min-block-size: 2.9rem}.ui-check input{block-size: 1.15rem;inline-size: 1.15rem}}.ui-alert{background: var(--panel-soft);border: 1px solid var(--line);border-inline-start: 2px solid var(--line-strong);border-radius: var(--radius-md);color: var(--text-soft);display: grid;font-size: var(--text-sm);gap: 0.3rem;grid-template-columns: auto 1fr;padding: 0.8rem 0.9rem}.ui-alert::before{background: var(--text-dim);border-radius: 50%;content: '';block-size: 0.5rem;margin-block-start: 0.32rem;inline-size: 0.5rem}.ui-alert > *{grid-column: 2}.ui-alert__title{color: var(--text);font-family: var(--mono);font-size: var(--text-2xs);font-weight: 700;letter-spacing: var(--tracking-wide);margin: 0;text-transform: uppercase}.ui-alert__body{margin: 0}.ui-alert__dismiss{background: transparent;border: 0;color: var(--text-dim);cursor: pointer;font-family: var(--mono);grid-column: 3;grid-row: 1;line-height: 1;padding: 0.1rem 0.3rem}.ui-alert:has(.ui-alert__dismiss){grid-template-columns: auto 1fr auto}.ui-alert--accent{border-inline-start-color: var(--accent)}.ui-alert--accent::before{background: var(--accent)}.ui-alert--success{border-inline-start-color: var(--success)}.ui-alert--success::before{background: var(--success)}.ui-alert--warning{border-inline-start-color: var(--warning)}.ui-alert--warning::before{background: var(--warning)}.ui-alert--danger{border-inline-start-color: var(--danger)}.ui-alert--danger::before{background: var(--danger)}@media (hover: hover){.ui-alert__dismiss:hover{color: var(--text)}}.ui-toast-stack{display: grid;gap: 0.5rem;inset-block: auto 1.25rem;inset-inline: auto 1.25rem;justify-items: end;max-inline-size: min(22rem,calc(100vw - 2rem));pointer-events: none;position: fixed;z-index: var(--z-toast)}.ui-toast-stack--assertive{inset-block: 1.25rem auto}.ui-toast{align-items: flex-start;animation: uiToastIn var(--duration-base) var(--ease-spring) both;background: var(--panel-strong);border: 1px solid var(--line-strong);border-radius: var(--radius-md);box-shadow: var(--shadow-raised);color: var(--text-soft);display: grid;font-size: var(--text-sm);gap: 0.2rem 0.55rem;grid-template-columns: auto 1fr;padding: 0.7rem 0.85rem;pointer-events: auto;inline-size: 100%}.ui-toast::before{background: var(--text-dim);border-radius: 50%;content: '';grid-row: 1 / -1;block-size: 0.5rem;margin-block-start: 0.3rem;inline-size: 0.5rem}.ui-toast__title{color: var(--text);font-family: var(--mono);font-size: var(--text-2xs);font-weight: 700;letter-spacing: var(--tracking-wide);margin: 0;text-transform: uppercase}.ui-toast__close{align-self: start;background: none;border: 0;block-size: 1.4rem;color: var(--text-dim);cursor: pointer;font: inherit;grid-column: 3;grid-row: 1 / -1;inline-size: 1.4rem;padding: 0}.ui-toast__close::before{content: '\00d7';font-size: 1.1rem;line-height: 1}.ui-toast__close:hover{color: var(--text)}.ui-toast--accent::before{background: var(--accent)}.ui-toast--success::before{background: var(--success)}.ui-toast--warning::before{background: var(--warning)}.ui-toast--danger::before{background: var(--danger)}.ui-tooltip{display: inline-flex;position: relative}.ui-tooltip__bubble{background: var(--text);border-radius: var(--radius-sm);inset-block-end: calc(100% + 0.5rem);color: var(--bg);font-family: var(--mono);font-size: var(--text-2xs);inset-inline-start: 50%;letter-spacing: var(--tracking-wide);opacity: 0;padding: 0.34rem 0.5rem;pointer-events: none;position: absolute;text-transform: uppercase;transform: translate(-50%,4px);transition: opacity var(--duration-fast) var(--ease-standard),transform var(--duration-fast) var(--ease-standard);white-space: nowrap;z-index: var(--z-popover)}.ui-tooltip:hover .ui-tooltip__bubble,.ui-tooltip:focus-within .ui-tooltip__bubble{opacity: 1;transform: translate(-50%,0)}@supports (anchor-name: --x){.ui-tooltip{anchor-name: --ui-tooltip}.ui-tooltip__bubble{inset: auto;margin-block-end: 0.5rem;position: fixed;position-anchor: --ui-tooltip;position-area: block-start center;position-try-fallbacks: flip-block;transform: translateY(4px)}.ui-tooltip:hover .ui-tooltip__bubble,.ui-tooltip:focus-within .ui-tooltip__bubble{transform: translateY(0)}}.ui-popover{background: var(--panel-strong);border: 1px solid var(--line-strong);border-radius: var(--radius-md);box-shadow: var(--shadow-raised);color: var(--text-soft);font-size: var(--text-sm);inline-size: max-content;margin: 0;max-inline-size: min(22rem,calc(100vw - 2rem));padding: var(--space-sm) var(--space-md);position: fixed;z-index: var(--z-popover)}.ui-popover:not([popover],.is-open){display: none}.ui-popover[popover]:not(:popover-open){display: none}.ui-progress{background: var(--panel-soft);border: 1px solid var(--line);border-radius: var(--radius-pill);block-size: 0.5rem;overflow: hidden;position: relative;inline-size: 100%}.ui-progress__bar{background: var(--accent);block-size: 100%;transition: inline-size var(--duration-base) var(--ease-out);inline-size: calc(clamp(0,var(--value,0),100) * 1%)}.ui-progress--indeterminate .ui-progress__bar{animation: uiTrack 1.1s var(--ease-standard) infinite;position: absolute;inline-size: 45%}@media (prefers-reduced-motion: reduce){.ui-progress--indeterminate .ui-progress__bar{animation-duration: 0.01ms;inset-inline-start: 0;inline-size: 100%}.ui-toast{animation: none}}.ui-modal{background: var(--panel-strong);border: 1px solid var(--line-strong);border-radius: var(--radius-lg);box-shadow: var(--shadow-raised);color: var(--text);margin: auto;max-block-size: min(85vh,44rem);max-inline-size: min(32rem,calc(100vw - 2rem));overflow: hidden;padding: 0;inline-size: 100%}.ui-modal::backdrop{backdrop-filter: blur(2px);background: color-mix(in srgb,var(--bg) 70%,transparent)}.ui-modal[open]{animation: uiToastIn var(--duration-base) var(--ease-spring) both;display: grid;grid-template-rows: auto 1fr auto}.ui-modal__head{align-items: flex-start;border-block-end: 1px solid var(--line);display: flex;gap: var(--space-sm);justify-content: space-between;padding: var(--space-md)}.ui-modal__title{color: var(--text);font-family: var(--display);font-size: var(--text-lg);letter-spacing: var(--tracking-wide);margin: 0;text-transform: uppercase}.ui-modal__body{overflow-y: auto;padding: var(--space-md)}.ui-modal__foot{border-block-start: 1px solid var(--line);display: flex;flex-wrap: wrap;gap: var(--space-xs);justify-content: flex-end;padding: var(--space-md)}.ui-modal__close{background: transparent;border: 1px solid var(--line-strong);border-radius: var(--radius-md);color: var(--text);cursor: pointer;flex: 0 0 auto;font-family: var(--mono);line-height: 1;padding: 0.34rem 0.5rem}.ui-modal--drawer{block-size: 100vh;margin: 0;margin-inline-start: auto;max-block-size: 100vh;max-inline-size: min(26rem,100vw);border-radius: 0;border-width: 0;border-inline-start-width: 1px}@media (hover: hover){.ui-modal__close:hover{border-color: var(--accent);color: var(--accent-text)}}.ui-menu-host{display: inline-block;position: relative}.ui-menu{background: var(--panel-strong);border: 1px solid var(--line-strong);border-radius: var(--radius-md);box-shadow: var(--shadow-raised);display: grid;gap: 1px;min-inline-size: 11rem;padding: 0.3rem;position: absolute;inset-inline-end: 0;inset-block-start: calc(100% + 0.4rem);z-index: var(--z-overlay)}.ui-menu__label{color: var(--text-dim);font-family: var(--mono);font-size: var(--text-2xs);letter-spacing: var(--tracking-wide);padding: 0.45rem 0.55rem 0.2rem;text-transform: uppercase}.ui-menu__item{align-items: center;background: transparent;border: 0;border-radius: var(--radius-sm);color: var(--text-soft);cursor: pointer;display: flex;font-family: var(--mono);font-size: var(--text-sm);gap: 0.5rem;padding: 0.5rem 0.55rem;text-align: start;inline-size: 100%}.ui-menu__item::before{background: currentColor;border-radius: 50%;content: '';block-size: 0.3rem;opacity: 0.4;inline-size: 0.3rem}.ui-menu__sep{background: var(--line);border: 0;block-size: 1px;margin: 0.2rem 0}@media (hover: hover){.ui-menu__item:hover{background: var(--bg-accent);color: var(--text)}.ui-menu__item:hover::before{opacity: 1}}.ui-combobox{display: inline-block;min-inline-size: 14rem;position: relative}.ui-combobox__input{inline-size: 100%}.ui-combobox__list{background: var(--panel-strong);border: 1px solid var(--line-strong);border-radius: var(--radius-md);box-shadow: var(--shadow-raised);display: grid;gap: 1px;list-style: none;margin: 0;max-block-size: 16rem;overflow-y: auto;padding: 0.3rem;position: absolute;inset-block-start: calc(100% + 0.4rem);inset-inline: 0;z-index: var(--z-overlay)}.ui-combobox__list[hidden]{display: none}.ui-combobox__option{border-radius: var(--radius-sm);color: var(--text-soft);cursor: pointer;font-family: var(--mono);font-size: var(--text-sm);padding: 0.5rem 0.55rem}.ui-combobox__option[hidden]{display: none}.ui-combobox__option.is-active,.ui-combobox__option[aria-selected='true']{background: var(--bg-accent);color: var(--text)}.ui-combobox__empty{color: var(--text-dim);font-size: var(--text-2xs);padding: 0.5rem 0.55rem}.ui-combobox__empty[hidden]{display: none}@media (max-width: 560px){.ui-modal{border-radius: var(--radius-lg) var(--radius-lg) 0 0;margin: auto auto 0;max-block-size: 88vh;max-inline-size: 100vw;inline-size: 100vw}.ui-modal--drawer{border-radius: 0;border-width: 1px 0 0;block-size: 88vh;margin: auto 0 0;max-block-size: 88vh;max-inline-size: 100vw;inline-size: 100vw}.ui-menu{inset-inline: 0;min-inline-size: 0}}@media (prefers-reduced-motion: reduce){.ui-modal[open]{animation: none}}.ui-tabs{display: grid;gap: var(--space-md)}.ui-tabs__list{border-block-end: 1px solid var(--line);display: flex;gap: 0.1rem;overflow-x: auto;scrollbar-width: none}.ui-tabs__list::-webkit-scrollbar{display: none}.ui-tab{background: transparent;border: 0;border-block-end: 2px solid transparent;color: var(--text-dim);cursor: pointer;display: inline-flex;flex: 0 0 auto;font-family: var(--mono);font-size: var(--text-xs);gap: 0.4rem;letter-spacing: var(--tracking-wide);margin-block-end: -1px;padding: 0.6rem 0.85rem;text-transform: uppercase;transition: color var(--duration-fast) var(--ease-standard),border-color var(--duration-fast) var(--ease-standard)}.ui-tab.is-active{border-block-end-color: var(--accent);color: var(--accent-text)}.ui-tab:focus-visible{outline: 2px solid var(--focus-ring);outline-offset: -3px}.ui-tabs__panel[hidden]{display: none}@media (hover: hover){.ui-tab:hover:not(.is-active){color: var(--text)}}.ui-accordion{display: grid}.ui-accordion__item{border-block-end: 1px solid var(--line)}.ui-accordion__summary{align-items: center;color: var(--text);cursor: pointer;display: flex;font-family: var(--mono);font-size: var(--text-sm);gap: 0.6rem;letter-spacing: var(--tracking-wide);list-style: none;padding: 0.85rem 0.2rem;text-transform: uppercase}.ui-accordion__summary::-webkit-details-marker{display: none}.ui-accordion__summary::before{border-inline-end: 1.5px solid var(--text-dim);border-block-end: 1.5px solid var(--text-dim);content: '';block-size: 0.4rem;transform: rotate(-45deg);transition: transform var(--duration-fast) var(--ease-spring);inline-size: 0.4rem}.ui-accordion__item[open] .ui-accordion__summary{color: var(--accent-text)}.ui-accordion__item[open] .ui-accordion__summary::before{border-color: var(--accent);transform: rotate(45deg)}.ui-accordion__body{color: var(--text-soft);padding: 0 0.2rem 0.95rem}.ui-accordion__body > :first-child{margin-block-start: 0}.ui-segmented{background: var(--panel-soft);border: 1px solid var(--line-strong);border-radius: var(--radius-md);display: inline-flex;gap: 1px;overflow: hidden;padding: 2px}.ui-segmented__option{border-radius: var(--radius-sm);color: var(--text-soft);cursor: pointer;flex: 1 0 auto;font-family: var(--mono);font-size: var(--text-xs);letter-spacing: var(--tracking-wide);padding: 0.42rem 0.8rem;text-align: center;text-transform: uppercase;transition: background-color var(--duration-fast) var(--ease-standard),color var(--duration-fast) var(--ease-standard);white-space: nowrap}.ui-segmented__option input{position: absolute;opacity: 0;pointer-events: none}.ui-segmented__option:has(input:checked){background: var(--accent);color: var(--button-text)}.ui-segmented__option:has(input:focus-visible){outline: 2px solid var(--focus-ring);outline-offset: 2px}@media (hover: hover){.ui-segmented__option:hover:not(:has(input:checked)){color: var(--text)}}.ui-breadcrumb{align-items: center;color: var(--text-dim);display: flex;flex-wrap: wrap;font-family: var(--mono);font-size: var(--text-2xs);gap: 0.5rem;letter-spacing: var(--tracking-wide);list-style: none;margin: 0;padding: 0;text-transform: uppercase}.ui-breadcrumb__item{align-items: center;color: var(--text-dim);display: inline-flex;gap: 0.5rem}.ui-breadcrumb__item:not(:last-child)::after{background: var(--line-strong);border-radius: 50%;content: '';block-size: 0.22rem;inline-size: 0.22rem}.ui-breadcrumb__item[aria-current]{color: var(--text)}.ui-breadcrumb__item a{color: inherit}@media (hover: hover){.ui-breadcrumb__item a:hover{color: var(--accent-text)}}.ui-pagination{align-items: center;display: flex;flex-wrap: wrap;gap: 0.3rem;list-style: none;margin: 0;padding: 0}.ui-pagination__item{align-items: center;background: transparent;border: 1px solid var(--line);border-radius: var(--radius-sm);color: var(--text-soft);cursor: pointer;display: inline-flex;font-family: var(--mono);font-size: var(--text-xs);justify-content: center;min-block-size: 2rem;min-inline-size: 2rem;padding: 0 0.5rem;transition: border-color var(--duration-fast) var(--ease-standard),color var(--duration-fast) var(--ease-standard)}.ui-pagination__item.is-active{border-color: var(--accent);color: var(--accent-text)}.ui-pagination__item[aria-disabled='true']{cursor: not-allowed;opacity: 0.4}@media (hover: hover){.ui-pagination__item:not(.is-active,[aria-disabled='true']):hover{border-color: var(--line-strong);color: var(--text)}}.ui-avatar{--av-size: 2.2rem;align-items: center;background: var(--panel-soft);border: 1px solid var(--line-strong);border-radius: var(--radius-sm);color: var(--text);display: inline-flex;flex: 0 0 auto;font-family: var(--mono);font-size: calc(var(--av-size) * 0.38);font-weight: 700;block-size: var(--av-size);justify-content: center;letter-spacing: 0.04em;overflow: hidden;text-transform: uppercase;inline-size: var(--av-size)}.ui-avatar img{block-size: 100%;object-fit: cover;inline-size: 100%}.ui-avatar--sm{--av-size: 1.5rem}.ui-avatar--lg{--av-size: 3.2rem}.ui-avatar-group{display: inline-flex}.ui-avatar-group .ui-avatar{box-shadow: 0 0 0 2px var(--bg)}.ui-avatar-group .ui-avatar:not(:first-child){margin-inline-start: -0.5rem}.ui-table-wrap{border: 1px solid var(--line);border-radius: var(--radius-md);overflow: auto}.ui-table{border-collapse: collapse;font-family: var(--mono);font-size: var(--text-sm);min-inline-size: 100%;inline-size: 100%}.ui-table th,.ui-table td{border-block-end: 1px solid var(--line);overflow-wrap: anywhere;padding: 0.7rem 0.85rem;text-align: start;vertical-align: top}.ui-table th{background: var(--panel);color: var(--text-dim);font-size: var(--text-2xs);font-weight: 700;letter-spacing: var(--tracking-wide);position: sticky;text-transform: uppercase;inset-block-start: 0}.ui-table td{color: var(--text-soft)}.ui-table tbody tr:last-child td{border-block-end: 0}.ui-table tbody tr{transition: background-color var(--duration-fast) var(--ease-standard)}@media (hover: hover){.ui-table tbody tr:hover td{background: var(--bg-accent)}}.ui-table--dense th,.ui-table--dense td{font-size: var(--text-xs);padding: 0.42rem 0.6rem}.ui-table--comfortable th,.ui-table--comfortable td{padding: 0.95rem 1.1rem}.ui-table--lined td{border-inline-end: 1px solid var(--line)}.ui-table--lined td:last-child{border-inline-end: 0}.ui-table .is-num,.ui-table th.is-num{font-variant-numeric: tabular-nums;text-align: end}.ui-table .is-pos{color: var(--success)}.ui-table .is-neg{color: var(--danger)}.ui-table .is-key{color: var(--text);font-weight: 600}.ui-table__empty td{color: var(--text-dim);padding: 2rem;text-align: center}.ui-table__sort{align-items: center;background: none;border: 0;color: inherit;cursor: pointer;display: flex;font: inherit;gap: 0.4rem;letter-spacing: inherit;padding: 0;text-transform: inherit;inline-size: 100%}.ui-table__sort::after{content: '↕';opacity: 0.4}.ui-table th[aria-sort='ascending'] .ui-table__sort::after{content: '↑';opacity: 1}.ui-table th[aria-sort='descending'] .ui-table__sort::after{content: '↓';opacity: 1}.ui-table__select{inline-size: 1px;white-space: nowrap}.ui-table--selectable tbody tr[aria-selected='true'] td{background: var(--bg-accent)}.ui-table__toolbar{align-items: center;border: 1px solid var(--line);border-block-end: 0;border-start-start-radius: var(--radius-md);border-start-end-radius: var(--radius-md);display: flex;gap: var(--space-sm);padding: var(--space-sm) var(--space-md)}.ui-table--loading{opacity: 0.6;pointer-events: none}.ui-app-shell{display: grid;grid-template-columns: var(--app-rail,14rem) minmax(0,1fr);min-block-size: 100vh}.ui-app-shell--full{grid-template-columns: minmax(0,1fr)}.ui-app-rail{background: var(--panel);border-inline-end: 1px solid var(--line);display: flex;flex-direction: column;gap: var(--space-md);padding: var(--space-md);position: sticky;inset-block-start: 0;block-size: 100vh;overflow-y: auto}.ui-app-rail__brand{align-items: center;color: var(--text);display: flex;font-family: var(--display);font-size: 1.05rem;gap: 0.5rem;letter-spacing: var(--tracking-wide);padding: 0.35rem 0.5rem;text-transform: uppercase}.ui-app-rail__brand::before{background: var(--accent);border-radius: 50%;content: '';block-size: 0.5rem;inline-size: 0.5rem}.ui-app-nav{display: grid;gap: 0.15rem}.ui-app-nav__section{color: var(--text-dim);font-family: var(--mono);font-size: var(--text-2xs);letter-spacing: var(--tracking-wide);margin: var(--space-sm) 0 0.3rem;padding: 0 0.5rem;text-transform: uppercase}.ui-app-nav a{align-items: center;border-inline-start: 2px solid transparent;color: var(--text-soft);display: flex;font-family: var(--mono);font-size: var(--text-sm);gap: 0.55rem;padding: 0.5rem 0.6rem;transition: background-color var(--duration-fast) var(--ease-standard),border-color var(--duration-fast) var(--ease-standard),color var(--duration-fast) var(--ease-standard)}.ui-app-nav a::before{background: currentColor;border-radius: 50%;content: '';block-size: 0.34rem;opacity: 0.45;inline-size: 0.34rem}.ui-app-nav a:hover{background: var(--bg-accent);color: var(--text)}.ui-app-nav a.is-active{background: var(--accent-soft);border-inline-start-color: var(--accent);color: var(--accent-text)}.ui-app-nav a.is-active::before{opacity: 1}.ui-app-rail__foot{border-block-start: 1px solid var(--line);color: var(--text-dim);font-family: var(--mono);font-size: var(--text-2xs);margin-block-start: auto;padding-block-start: var(--space-sm)}.ui-app-main{display: flex;flex-direction: column;min-inline-size: 0}.ui-app-topbar{align-items: center;background: color-mix(in srgb,var(--bg) 86%,transparent);backdrop-filter: blur(8px);border-block-end: 1px solid var(--line);display: flex;gap: var(--space-md);justify-content: space-between;padding: 0.75rem var(--space-lg);position: sticky;inset-block-start: 0;z-index: var(--z-raised)}.ui-app-topbar__title{color: var(--text);font-family: var(--display);font-size: 1.1rem;letter-spacing: var(--tracking-wide);margin: 0;text-transform: uppercase}.ui-app-content{display: grid;gap: var(--space-lg);padding: var(--space-lg)}.ui-app-toolbar{align-items: center;background: var(--panel);border: 1px solid var(--line);border-radius: var(--radius-md);display: flex;flex-wrap: wrap;gap: 0.7rem;justify-content: space-between;padding: 0.7rem 0.85rem}.ui-app-toolbar__group{align-items: center;display: flex;flex-wrap: wrap;gap: 0.5rem}.ui-app-panel{background: var(--panel);border: 1px solid var(--line);border-radius: var(--radius-md);display: grid;gap: 0.85rem;padding: var(--space-md)}.ui-app-panel__head{align-items: flex-start;display: flex;gap: 0.7rem;justify-content: space-between}.ui-app-panel__title{color: var(--text);font-family: var(--display);font-size: 0.95rem;letter-spacing: var(--tracking-wide);margin: 0;text-transform: uppercase}.ui-app-panel__head p,.ui-app-empty-state p{color: var(--text-dim);margin: 0.3rem 0 0}.ui-app-empty-state{border: 1px dashed var(--line-strong);border-radius: var(--radius-md);color: var(--text-dim);padding: var(--space-lg);text-align: center}.ui-app-rail__toggle{display: none}@media (max-width: 880px){.ui-app-shell{grid-template-columns: minmax(0,1fr)}.ui-app-rail{flex-direction: row;block-size: auto;overflow-x: auto;position: sticky;inset-block-start: 0;z-index: calc(var(--z-raised) + 1)}.ui-app-rail__foot{display: none}.ui-app-nav{grid-auto-flow: column;gap: 0.15rem}.ui-app-nav__section{display: none}.ui-app-nav a{border-inline-start: 0;border-block-end: 2px solid transparent;white-space: nowrap}.ui-app-nav a.is-active{border-inline-start: 0;border-block-end-color: var(--accent)}.ui-app-content{padding: var(--space-md)}}}

package/dist/css/app.css

@@ -1 +1 @@
-@layer bronto{.ui-app-shell{display: grid;grid-template-columns: var(--app-rail,14rem) minmax(0,1fr);min-block-size: 100vh}.ui-app-shell--full{grid-template-columns: minmax(0,1fr)}.ui-app-rail{background: var(--panel);border-inline-end: 1px solid var(--line);display: flex;flex-direction: column;gap: var(--space-md);padding: var(--space-md);position: sticky;inset-block-start: 0;block-size: 100vh;overflow-y: auto}.ui-app-rail__brand{align-items: center;color: var(--text);display: flex;font-family: var(--display);font-size: 1.05rem;gap: 0.5rem;letter-spacing: var(--tracking-wide);padding: 0.35rem 0.5rem;text-transform: uppercase}.ui-app-rail__brand::before{background: var(--accent);border-radius: 50%;content: '';block-size: 0.5rem;inline-size: 0.5rem}.ui-app-nav{display: grid;gap: 0.15rem}.ui-app-nav__section{color: var(--text-dim);font-family: var(--mono);font-size: var(--text-2xs);letter-spacing: var(--tracking-wide);margin: var(--space-sm) 0 0.3rem;padding: 0 0.5rem;text-transform: uppercase}.ui-app-nav a{align-items: center;border-inline-start: 2px solid transparent;color: var(--text-soft);display: flex;font-family: var(--mono);font-size: var(--text-sm);gap: 0.55rem;padding: 0.5rem 0.6rem;transition: background-color var(--duration-fast) var(--ease-standard),border-color var(--duration-fast) var(--ease-standard),color var(--duration-fast) var(--ease-standard)}.ui-app-nav a::before{background: currentColor;border-radius: 50%;content: '';block-size: 0.34rem;opacity: 0.45;inline-size: 0.34rem}.ui-app-nav a:hover{background: var(--bg-accent);color: var(--text)}.ui-app-nav a.is-active{background: var(--accent-soft);border-inline-start-color: var(--accent);color: var(--accent-text)}.ui-app-nav a.is-active::before{opacity: 1}.ui-app-rail__foot{border-block-start: 1px solid var(--line);color: var(--text-dim);font-family: var(--mono);font-size: var(--text-2xs);margin-block-start: auto;padding-block-start: var(--space-sm)}.ui-app-main{display: flex;flex-direction: column;min-inline-size: 0}.ui-app-topbar{align-items: center;background: color-mix(in srgb,var(--bg) 86%,transparent);backdrop-filter: blur(8px);border-block-end: 1px solid var(--line);display: flex;gap: var(--space-md);justify-content: space-between;padding: 0.75rem var(--space-lg);position: sticky;inset-block-start: 0;z-index: var(--z-raised)}.ui-app-topbar__title{color: var(--text);font-family: var(--display);font-size: 1.1rem;letter-spacing: var(--tracking-wide);margin: 0;text-transform: uppercase}.ui-app-content{display: grid;gap: var(--space-lg);padding: var(--space-lg)}.ui-app-toolbar{align-items: center;background: var(--panel);border: 1px solid var(--line);border-radius: var(--radius-md);display: flex;flex-wrap: wrap;gap: 0.7rem;justify-content: space-between;padding: 0.7rem 0.85rem}.ui-app-toolbar__group{align-items: center;display: flex;flex-wrap: wrap;gap: 0.5rem}.ui-app-panel{background: var(--panel);border: 1px solid var(--line);border-radius: var(--radius-md);display: grid;gap: 0.85rem;padding: var(--space-md)}.ui-app-panel__head{align-items: flex-start;display: flex;gap: 0.7rem;justify-content: space-between}.ui-app-panel__title{color: var(--text);font-family: var(--display);font-size: 0.95rem;letter-spacing: var(--tracking-wide);margin: 0;text-transform: uppercase}.ui-app-panel__head p,.ui-app-empty-state p{color: var(--text-dim);margin: 0.3rem 0 0}.ui-app-metrics{display: grid;gap: var(--space-md);grid-template-columns: repeat(auto-fit,minmax(11rem,1fr))}@container bronto (max-width: 30rem){.ui-app-metrics{grid-template-columns: 1fr}}.ui-app-metric{background: var(--panel);border: 1px solid var(--line);border-radius: var(--radius-md);display: grid;gap: 0.4rem;padding: var(--space-md)}.ui-app-metric__label{color: var(--text-dim);font-family: var(--mono);font-size: var(--text-2xs);letter-spacing: var(--tracking-wide);text-transform: uppercase}.ui-app-metric__value{color: var(--text);font-family: var(--display);font-size: 1.9rem;font-variant-numeric: tabular-nums;letter-spacing: 0.01em;line-height: 1}.ui-app-metric__delta{font-family: var(--mono);font-size: var(--text-xs)}.ui-app-metric__delta.is-pos{color: var(--success)}.ui-app-metric__delta.is-neg{color: var(--danger)}.ui-app-empty-state{border: 1px dashed var(--line-strong);border-radius: var(--radius-md);color: var(--text-dim);padding: var(--space-lg);text-align: center}.ui-app-rail__toggle{display: none}@media (max-width: 880px){.ui-app-shell{grid-template-columns: minmax(0,1fr)}.ui-app-rail{flex-direction: row;block-size: auto;overflow-x: auto;position: sticky;inset-block-start: 0;z-index: calc(var(--z-raised) + 1)}.ui-app-rail__foot{display: none}.ui-app-nav{grid-auto-flow: column;gap: 0.15rem}.ui-app-nav__section{display: none}.ui-app-nav a{border-inline-start: 0;border-block-end: 2px solid transparent;white-space: nowrap}.ui-app-nav a.is-active{border-inline-start: 0;border-block-end-color: var(--accent)}.ui-app-content{padding: var(--space-md)}}}
+@layer bronto{.ui-app-shell{display: grid;grid-template-columns: var(--app-rail,14rem) minmax(0,1fr);min-block-size: 100vh}.ui-app-shell--full{grid-template-columns: minmax(0,1fr)}.ui-app-rail{background: var(--panel);border-inline-end: 1px solid var(--line);display: flex;flex-direction: column;gap: var(--space-md);padding: var(--space-md);position: sticky;inset-block-start: 0;block-size: 100vh;overflow-y: auto}.ui-app-rail__brand{align-items: center;color: var(--text);display: flex;font-family: var(--display);font-size: 1.05rem;gap: 0.5rem;letter-spacing: var(--tracking-wide);padding: 0.35rem 0.5rem;text-transform: uppercase}.ui-app-rail__brand::before{background: var(--accent);border-radius: 50%;content: '';block-size: 0.5rem;inline-size: 0.5rem}.ui-app-nav{display: grid;gap: 0.15rem}.ui-app-nav__section{color: var(--text-dim);font-family: var(--mono);font-size: var(--text-2xs);letter-spacing: var(--tracking-wide);margin: var(--space-sm) 0 0.3rem;padding: 0 0.5rem;text-transform: uppercase}.ui-app-nav a{align-items: center;border-inline-start: 2px solid transparent;color: var(--text-soft);display: flex;font-family: var(--mono);font-size: var(--text-sm);gap: 0.55rem;padding: 0.5rem 0.6rem;transition: background-color var(--duration-fast) var(--ease-standard),border-color var(--duration-fast) var(--ease-standard),color var(--duration-fast) var(--ease-standard)}.ui-app-nav a::before{background: currentColor;border-radius: 50%;content: '';block-size: 0.34rem;opacity: 0.45;inline-size: 0.34rem}.ui-app-nav a:hover{background: var(--bg-accent);color: var(--text)}.ui-app-nav a.is-active{background: var(--accent-soft);border-inline-start-color: var(--accent);color: var(--accent-text)}.ui-app-nav a.is-active::before{opacity: 1}.ui-app-rail__foot{border-block-start: 1px solid var(--line);color: var(--text-dim);font-family: var(--mono);font-size: var(--text-2xs);margin-block-start: auto;padding-block-start: var(--space-sm)}.ui-app-main{display: flex;flex-direction: column;min-inline-size: 0}.ui-app-topbar{align-items: center;background: color-mix(in srgb,var(--bg) 86%,transparent);backdrop-filter: blur(8px);border-block-end: 1px solid var(--line);display: flex;gap: var(--space-md);justify-content: space-between;padding: 0.75rem var(--space-lg);position: sticky;inset-block-start: 0;z-index: var(--z-raised)}.ui-app-topbar__title{color: var(--text);font-family: var(--display);font-size: 1.1rem;letter-spacing: var(--tracking-wide);margin: 0;text-transform: uppercase}.ui-app-content{display: grid;gap: var(--space-lg);padding: var(--space-lg)}.ui-app-toolbar{align-items: center;background: var(--panel);border: 1px solid var(--line);border-radius: var(--radius-md);display: flex;flex-wrap: wrap;gap: 0.7rem;justify-content: space-between;padding: 0.7rem 0.85rem}.ui-app-toolbar__group{align-items: center;display: flex;flex-wrap: wrap;gap: 0.5rem}.ui-app-panel{background: var(--panel);border: 1px solid var(--line);border-radius: var(--radius-md);display: grid;gap: 0.85rem;padding: var(--space-md)}.ui-app-panel__head{align-items: flex-start;display: flex;gap: 0.7rem;justify-content: space-between}.ui-app-panel__title{color: var(--text);font-family: var(--display);font-size: 0.95rem;letter-spacing: var(--tracking-wide);margin: 0;text-transform: uppercase}.ui-app-panel__head p,.ui-app-empty-state p{color: var(--text-dim);margin: 0.3rem 0 0}.ui-app-empty-state{border: 1px dashed var(--line-strong);border-radius: var(--radius-md);color: var(--text-dim);padding: var(--space-lg);text-align: center}.ui-app-rail__toggle{display: none}@media (max-width: 880px){.ui-app-shell{grid-template-columns: minmax(0,1fr)}.ui-app-rail{flex-direction: row;block-size: auto;overflow-x: auto;position: sticky;inset-block-start: 0;z-index: calc(var(--z-raised) + 1)}.ui-app-rail__foot{display: none}.ui-app-nav{grid-auto-flow: column;gap: 0.15rem}.ui-app-nav__section{display: none}.ui-app-nav a{border-inline-start: 0;border-block-end: 2px solid transparent;white-space: nowrap}.ui-app-nav a.is-active{border-inline-start: 0;border-block-end-color: var(--accent)}.ui-app-content{padding: var(--space-md)}}}

package/dist/css/dots.css

@@ -1 +1 @@
-@layer bronto{.ui-dotgrid{--_dot: var(--dot-color,var(--field-dot));background-image: radial-gradient(var(--_dot) var(--dot-size),transparent var(--dot-size));background-position: 0 0;background-size: var(--dot-gap) var(--dot-gap)}.ui-dotgrid--accent{--dot-color: var(--field-dot-accent)}.ui-dotgrid--dense{--dot-gap: 8px}.ui-dotfield{--_dot: var(--dot-color,var(--field-dot));background-image: radial-gradient(var(--_dot) var(--dot-size),transparent var(--dot-size));background-size: var(--dot-gap) var(--dot-gap);inset: 0;mask-image: radial-gradient(ellipse at 50% 0%,#000 30%,transparent 78%);pointer-events: none;position: fixed;z-index: var(--z-base)}.ui-dotrule{background-image: radial-gradient(var(--line-strong) 1.4px,transparent 1.4px);background-position: 0 50%;background-size: 9px 9px;border: 0;block-size: 3px;margin: var(--space-md) 0;inline-size: 100%}.ui-dot{background: var(--text-dim);border-radius: 50%;display: inline-block;flex: 0 0 auto;block-size: 0.55rem;inline-size: 0.55rem}.ui-dot--accent{background: var(--accent)}.ui-dot--success{background: var(--success)}.ui-dot--warning{background: var(--warning)}.ui-dot--danger{background: var(--danger)}.ui-dot--live{background: var(--success);box-shadow: 0 0 0 0 color-mix(in srgb,var(--success) 70%,transparent);position: relative}.ui-dot--live::after{animation: pulseRing 1.8s var(--ease-out) infinite;border: 1px solid var(--success);border-radius: 50%;content: '';inset: -3px;position: absolute}.ui-status{align-items: center;color: var(--text-soft);display: inline-flex;font-family: var(--mono);font-size: var(--text-xs);gap: 0.45rem;letter-spacing: var(--tracking-wide);text-transform: uppercase}.ui-dotloader{align-items: center;display: inline-flex;gap: 0.32rem}.ui-dotloader span{animation: pulseDot 1s var(--ease-standard) infinite;background: var(--accent);border-radius: 50%;block-size: 0.42rem;inline-size: 0.42rem}.ui-dotloader span:nth-child(2){animation-delay: 0.16s}.ui-dotloader span:nth-child(3){animation-delay: 0.32s}.ui-dotspinner{--ds-box: 1.6rem;--ds-dot: 0.26rem;animation: uiSpin 1s steps(8) infinite;display: inline-block;flex: 0 0 auto;block-size: var(--ds-box);position: relative;inline-size: var(--ds-box)}.ui-dotspinner i{background: var(--accent);border-radius: 50%;block-size: var(--ds-dot);inset: 0;margin: auto;position: absolute;inline-size: var(--ds-dot)}.ui-dotspinner i:nth-child(1){opacity: 1;transform: rotate(0deg) translateY(calc(var(--ds-box) / -2 + var(--ds-dot) / 2))}.ui-dotspinner i:nth-child(2){opacity: 0.85;transform: rotate(45deg) translateY(calc(var(--ds-box) / -2 + var(--ds-dot) / 2))}.ui-dotspinner i:nth-child(3){opacity: 0.7;transform: rotate(90deg) translateY(calc(var(--ds-box) / -2 + var(--ds-dot) / 2))}.ui-dotspinner i:nth-child(4){opacity: 0.56;transform: rotate(135deg) translateY(calc(var(--ds-box) / -2 + var(--ds-dot) / 2))}.ui-dotspinner i:nth-child(5){opacity: 0.44;transform: rotate(180deg) translateY(calc(var(--ds-box) / -2 + var(--ds-dot) / 2))}.ui-dotspinner i:nth-child(6){opacity: 0.34;transform: rotate(225deg) translateY(calc(var(--ds-box) / -2 + var(--ds-dot) / 2))}.ui-dotspinner i:nth-child(7){opacity: 0.25;transform: rotate(270deg) translateY(calc(var(--ds-box) / -2 + var(--ds-dot) / 2))}.ui-dotspinner i:nth-child(8){opacity: 0.16;transform: rotate(315deg) translateY(calc(var(--ds-box) / -2 + var(--ds-dot) / 2))}.ui-dotspinner--sm{--ds-box: 1.05rem;--ds-dot: 0.18rem}.ui-dotspinner--lg{--ds-box: 2.6rem;--ds-dot: 0.42rem}.ui-dotbar{display: flex;gap: 3px}.ui-dotbar i{background: var(--field-dot);border-radius: 1px;flex: 1;block-size: 0.5rem}.ui-dotbar i.is-on{background: var(--accent)}.ui-dotbar--indeterminate i{animation: pulseDot 1.1s var(--ease-standard) infinite}.ui-dotbar--indeterminate i:nth-child(2){animation-delay: 0.09s}.ui-dotbar--indeterminate i:nth-child(3){animation-delay: 0.18s}.ui-dotbar--indeterminate i:nth-child(4){animation-delay: 0.27s}.ui-dotbar--indeterminate i:nth-child(5){animation-delay: 0.36s}.ui-dotbar--indeterminate i:nth-child(6){animation-delay: 0.45s}.ui-dotbar--indeterminate i:nth-child(7){animation-delay: 0.54s}.ui-dotbar--indeterminate i:nth-child(n + 8){animation-delay: 0.63s}.ui-matrix{clip-path: inset(0 100% 0 0);transition: clip-path var(--duration-slow) var(--ease-out)}.ui-matrix.is-in{clip-path: inset(0 0 0 0)}@media (prefers-reduced-motion: reduce){.ui-dot--live::after,.ui-dotloader span,.ui-dotspinner,.ui-dotbar--indeterminate i{animation: none}.ui-dotspinner i{opacity: 0.6}.ui-matrix{clip-path: none}}}
+@layer bronto{.ui-dotgrid{--_dot: var(--dot-color,var(--field-dot));background-image: radial-gradient(var(--_dot) var(--dot-size),transparent var(--dot-size));background-position: 0 0;background-size: var(--dot-gap) var(--dot-gap)}.ui-dotgrid--accent{--dot-color: var(--field-dot-accent)}.ui-dotgrid--dense{--dot-gap: 8px}.ui-dotfield{--_dot: var(--dot-color,var(--field-dot));background-image: radial-gradient(var(--_dot) var(--dot-size),transparent var(--dot-size));background-size: var(--dot-gap) var(--dot-gap);inset: 0;mask-image: radial-gradient(ellipse at 50% 0%,#000 30%,transparent 78%);pointer-events: none;position: fixed;z-index: var(--z-base)}.ui-dotrule{background-image: radial-gradient(var(--line-strong) 1.4px,transparent 1.4px);background-position: 0 50%;background-size: 9px 9px;border: 0;block-size: 3px;margin: var(--space-md) 0;inline-size: 100%}.ui-dotmatrix{display: grid;gap: var(--dotmatrix-gap,0.5rem);grid-template-columns: repeat(var(--dotmatrix-cols,12),minmax(0,1fr))}.ui-dotmatrix__cell{aspect-ratio: 1;background: var(--field-dot);border-radius: 50%}.ui-dotmatrix__cell--hot{background: var(--field-dot-hot)}.ui-dotmatrix__cell--accent{background: var(--field-dot-accent)}.ui-dot{background: var(--text-dim);border-radius: 50%;display: inline-block;flex: 0 0 auto;block-size: 0.55rem;inline-size: 0.55rem}.ui-dot--accent{background: var(--accent)}.ui-dot--success{background: var(--success)}.ui-dot--warning{background: var(--warning)}.ui-dot--danger{background: var(--danger)}.ui-dot--live{background: var(--success);box-shadow: 0 0 0 0 color-mix(in srgb,var(--success) 70%,transparent);position: relative}.ui-dot--live::after{animation: pulseRing 1.8s var(--ease-out) infinite;border: 1px solid var(--success);border-radius: 50%;content: '';inset: -3px;position: absolute}.ui-status{align-items: center;color: var(--text-soft);display: inline-flex;font-family: var(--mono);font-size: var(--text-xs);gap: 0.45rem;letter-spacing: var(--tracking-wide);text-transform: uppercase}.ui-dotloader{align-items: center;display: inline-flex;gap: 0.32rem}.ui-dotloader span{animation: pulseDot 1s var(--ease-standard) infinite;background: var(--accent);border-radius: 50%;block-size: 0.42rem;inline-size: 0.42rem}.ui-dotloader span:nth-child(2){animation-delay: 0.16s}.ui-dotloader span:nth-child(3){animation-delay: 0.32s}.ui-dotspinner{--ds-box: 1.6rem;--ds-dot: 0.26rem;animation: uiSpin 1s steps(8) infinite;display: inline-block;flex: 0 0 auto;block-size: var(--ds-box);position: relative;inline-size: var(--ds-box)}.ui-dotspinner i{background: var(--accent);border-radius: 50%;block-size: var(--ds-dot);inset: 0;margin: auto;position: absolute;inline-size: var(--ds-dot)}.ui-dotspinner i:nth-child(1){opacity: 1;transform: rotate(0deg) translateY(calc(var(--ds-box) / -2 + var(--ds-dot) / 2))}.ui-dotspinner i:nth-child(2){opacity: 0.85;transform: rotate(45deg) translateY(calc(var(--ds-box) / -2 + var(--ds-dot) / 2))}.ui-dotspinner i:nth-child(3){opacity: 0.7;transform: rotate(90deg) translateY(calc(var(--ds-box) / -2 + var(--ds-dot) / 2))}.ui-dotspinner i:nth-child(4){opacity: 0.56;transform: rotate(135deg) translateY(calc(var(--ds-box) / -2 + var(--ds-dot) / 2))}.ui-dotspinner i:nth-child(5){opacity: 0.44;transform: rotate(180deg) translateY(calc(var(--ds-box) / -2 + var(--ds-dot) / 2))}.ui-dotspinner i:nth-child(6){opacity: 0.34;transform: rotate(225deg) translateY(calc(var(--ds-box) / -2 + var(--ds-dot) / 2))}.ui-dotspinner i:nth-child(7){opacity: 0.25;transform: rotate(270deg) translateY(calc(var(--ds-box) / -2 + var(--ds-dot) / 2))}.ui-dotspinner i:nth-child(8){opacity: 0.16;transform: rotate(315deg) translateY(calc(var(--ds-box) / -2 + var(--ds-dot) / 2))}.ui-dotspinner--sm{--ds-box: 1.05rem;--ds-dot: 0.18rem}.ui-dotspinner--lg{--ds-box: 2.6rem;--ds-dot: 0.42rem}.ui-dotbar{display: flex;gap: 3px}.ui-dotbar i{background: var(--field-dot);border-radius: 1px;flex: 1;block-size: 0.5rem}.ui-dotbar i.is-on{background: var(--accent)}.ui-dotbar--indeterminate i{animation: pulseDot 1.1s var(--ease-standard) infinite}.ui-dotbar--indeterminate i:nth-child(2){animation-delay: 0.09s}.ui-dotbar--indeterminate i:nth-child(3){animation-delay: 0.18s}.ui-dotbar--indeterminate i:nth-child(4){animation-delay: 0.27s}.ui-dotbar--indeterminate i:nth-child(5){animation-delay: 0.36s}.ui-dotbar--indeterminate i:nth-child(6){animation-delay: 0.45s}.ui-dotbar--indeterminate i:nth-child(7){animation-delay: 0.54s}.ui-dotbar--indeterminate i:nth-child(n + 8){animation-delay: 0.63s}.ui-matrix{clip-path: inset(0 100% 0 0);transition: clip-path var(--duration-slow) var(--ease-out)}.ui-matrix.is-in{clip-path: inset(0 0 0 0)}@media (prefers-reduced-motion: reduce){.ui-dot--live::after,.ui-dotloader span,.ui-dotspinner,.ui-dotbar--indeterminate i{animation: none}.ui-dotspinner i{opacity: 0.6}.ui-matrix{clip-path: none}}}

package/dist/css/primitives.css

@@ -1 +1 @@
-@layer bronto{.ui-stack{display: grid;gap: var(--stack-gap,var(--space-md))}.ui-cluster{align-items: center;display: flex;flex-wrap: wrap;gap: var(--cluster-gap,var(--space-xs))}.ui-cluster--between{justify-content: space-between}.ui-grid{display: grid;gap: var(--grid-gap,var(--space-md));grid-template-columns: repeat(auto-fit,minmax(min(100%,var(--grid-min,16rem)),1fr))}.ui-sidebar{display: flex;flex-wrap: wrap;gap: var(--sidebar-gap,var(--space-md))}.ui-sidebar > :first-child{flex-basis: var(--sidebar-width,16rem);flex-grow: 1}.ui-sidebar > :last-child{flex-basis: 0;flex-grow: 999;min-inline-size: var(--sidebar-min,60%)}.ui-switcher{display: flex;flex-wrap: wrap;gap: var(--switcher-gap,var(--space-md))}.ui-switcher > *{flex-basis: calc((var(--switcher-min,24rem) - 100%) * 999);flex-grow: 1}.ui-center{box-sizing: content-box;margin-inline: auto;max-inline-size: var(--center-max,64rem);padding-inline: var(--center-gutter,var(--space-md))}.ui-ratio{aspect-ratio: var(--ratio,16 / 9)}.ui-ratio > *{block-size: 100%;inline-size: 100%;object-fit: cover}.ui-cq{container: var(--cq-name,bronto) / inline-size}@container bronto (max-width: 34rem){.ui-grid{--grid-min: 100%}}.ui-surface,.ui-card,.ui-panel{background: var(--panel);border: 1px solid var(--line)}.ui-card,.ui-panel{border-radius: var(--radius-lg);display: grid;gap: var(--space-sm);padding: var(--space-md)}.ui-card{transition: border-color var(--duration-base) var(--ease-standard),background-color var(--duration-base) var(--ease-standard),transform var(--duration-base) var(--ease-standard)}.ui-panel{background: var(--panel-strong)}.ui-card--accent{border-color: var(--accent)}.ui-card__head,.ui-panel__head{align-items: flex-start;display: flex;gap: var(--space-sm);justify-content: space-between}.ui-divider{border: 0;border-block-start: 1px solid var(--line);margin: 0}.ui-eyebrow{color: var(--accent-text);font-family: var(--display);font-size: var(--text-xs);font-weight: 700;letter-spacing: var(--tracking-wide);margin: 0;text-transform: uppercase}.ui-eyebrow--muted{color: var(--text-dim)}.ui-button{align-items: center;background: var(--accent);border: 1px solid var(--accent);border-radius: var(--radius-md);color: var(--button-text);cursor: pointer;display: inline-flex;font-family: var(--mono);font-size: var(--text-sm);font-weight: 600;gap: 0.45rem;justify-content: center;letter-spacing: var(--tracking-wide);line-height: 1;min-block-size: 2.4rem;min-inline-size: 2.4rem;padding: 0.66rem 1rem;text-transform: uppercase;transition: background-color var(--duration-fast) var(--ease-standard),border-color var(--duration-fast) var(--ease-standard),color var(--duration-fast) var(--ease-standard),transform var(--duration-fast) var(--ease-standard)}.ui-button--ghost{background: transparent;border-color: var(--line-strong);color: var(--text)}.ui-button--subtle{background: var(--panel-soft);border-color: var(--line);color: var(--text)}.ui-button--danger{background: var(--danger);border-color: var(--danger);color: var(--button-text)}.ui-button--icon{aspect-ratio: 1;min-inline-size: 2.4rem;padding: 0}.ui-button:disabled,.ui-button[aria-disabled='true']{cursor: not-allowed;opacity: 0.45}.ui-button:active{transform: translateY(1px)}.ui-button[aria-busy='true']{cursor: progress;pointer-events: none}.ui-button[aria-busy='true']::before{animation: uiSpin 0.6s linear infinite;block-size: 0.9em;border: 2px solid currentcolor;border-block-start-color: transparent;border-radius: var(--radius-pill);content: '';flex: none;inline-size: 0.9em}@media (prefers-reduced-motion: reduce){.ui-button[aria-busy='true']::before{animation-duration: 1.4s}}.ui-link{color: var(--text);text-decoration: underline;text-decoration-color: color-mix(in srgb,var(--accent) 55%,transparent);text-decoration-thickness: 1px;text-underline-offset: 0.22rem;transition: color var(--duration-fast) var(--ease-standard),text-decoration-color var(--duration-fast) var(--ease-standard)}.ui-link--arrow{align-items: center;display: inline-flex;gap: 0.4rem;text-decoration: none}.ui-link--arrow::after{border-inline-end: 1px solid currentColor;border-block-start: 1px solid currentColor;content: '';block-size: 0.42rem;transform: rotate(45deg);transition: transform var(--duration-fast) var(--ease-standard);inline-size: 0.42rem}.ui-chip{align-items: center;background: transparent;border: 1px solid var(--line-strong);border-radius: var(--radius-sm);color: var(--text-soft);display: inline-flex;font-family: var(--mono);font-size: var(--text-2xs);gap: 0.36rem;letter-spacing: var(--tracking-wide);line-height: 1;min-block-size: 1.7rem;padding: 0.32rem 0.55rem;text-transform: uppercase}.ui-chip--accent{color: var(--accent-text);border-color: var(--accent)}.ui-badge{align-items: center;background: var(--panel-soft);border: 1px solid var(--line);border-radius: var(--radius-sm);color: var(--text-soft);display: inline-flex;font-family: var(--mono);font-size: var(--text-2xs);font-weight: 700;gap: 0.34rem;letter-spacing: var(--tracking-wide);line-height: 1;padding: 0.28rem 0.5rem;text-transform: uppercase}.ui-badge--accent{background: var(--accent-soft);border-color: color-mix(in srgb,var(--accent) 45%,var(--line))}.ui-badge--success{background: var(--success-soft);border-color: color-mix(in srgb,var(--success) 40%,var(--line))}.ui-badge--warning{background: var(--warning-soft);border-color: color-mix(in srgb,var(--warning) 40%,var(--line))}.ui-badge--danger{background: var(--danger-soft);border-color: color-mix(in srgb,var(--danger) 40%,var(--line))}.ui-key-value{display: grid;gap: 0.55rem;margin: 0}.ui-key-value div{border-block-start: 1px solid var(--line);display: grid;gap: 0.16rem;padding-block-start: 0.6rem}.ui-key-value dt{color: var(--text-dim);font-family: var(--mono);font-size: var(--text-2xs);font-weight: 700;letter-spacing: var(--tracking-wide);line-height: 1;text-transform: uppercase}.ui-key-value dd{color: var(--text);font-family: var(--mono);margin: 0}@media (hover: hover){.ui-card:hover{border-color: var(--line-strong)}.ui-card--interactive:hover{transform: translateY(-2px)}.ui-button:hover{background: var(--accent-strong);border-color: var(--accent-strong)}.ui-button--ghost:hover,.ui-button--subtle:hover{background: var(--panel-soft);border-color: var(--accent);color: var(--text)}.ui-button--danger:hover{background: color-mix(in srgb,var(--danger) 84%,#000)}.ui-link:hover{color: var(--accent-text);text-decoration-color: var(--accent)}.ui-link--arrow:hover::after{transform: translateX(0.14rem) rotate(45deg)}[dir='rtl'] .ui-link--arrow:hover::after{transform: translateX(-0.14rem) rotate(45deg)}.ui-chip--accent:hover{background: var(--accent-soft)}}@media (pointer: coarse){.ui-button{min-block-size: 2.9rem;min-inline-size: 2.9rem}.ui-button--icon{min-inline-size: 2.9rem}}}
+@layer bronto{.ui-stack{display: grid;gap: var(--stack-gap,var(--space-md))}.ui-cluster{align-items: center;display: flex;flex-wrap: wrap;gap: var(--cluster-gap,var(--space-xs))}.ui-cluster--between{justify-content: space-between}.ui-grid{display: grid;gap: var(--grid-gap,var(--space-md));grid-template-columns: repeat(auto-fit,minmax(min(100%,var(--grid-min,16rem)),1fr))}.ui-sidebar{display: flex;flex-wrap: wrap;gap: var(--sidebar-gap,var(--space-md))}.ui-sidebar > :first-child{flex-basis: var(--sidebar-width,16rem);flex-grow: 1}.ui-sidebar > :last-child{flex-basis: 0;flex-grow: 999;min-inline-size: var(--sidebar-min,60%)}.ui-switcher{display: flex;flex-wrap: wrap;gap: var(--switcher-gap,var(--space-md))}.ui-switcher > *{flex-basis: calc((var(--switcher-min,24rem) - 100%) * 999);flex-grow: 1}.ui-center{box-sizing: content-box;margin-inline: auto;max-inline-size: var(--center-max,64rem);padding-inline: var(--center-gutter,var(--space-md))}.ui-ratio{aspect-ratio: var(--ratio,16 / 9)}.ui-ratio > *{block-size: 100%;inline-size: 100%;object-fit: cover}.ui-cq{container: var(--cq-name,bronto) / inline-size}@container bronto (max-width: 34rem){.ui-grid{--grid-min: 100%}}.ui-surface,.ui-card,.ui-panel{background: var(--panel);border: 1px solid var(--line)}.ui-card,.ui-panel{border-radius: var(--radius-lg);display: grid;gap: var(--space-sm);padding: var(--space-md)}.ui-card{transition: border-color var(--duration-base) var(--ease-standard),background-color var(--duration-base) var(--ease-standard),transform var(--duration-base) var(--ease-standard)}.ui-panel{background: var(--panel-strong)}.ui-card--accent{border-color: var(--accent)}.ui-card--interactive:focus-within{border-color: var(--line-strong)}.ui-card__head,.ui-panel__head{align-items: flex-start;display: flex;gap: var(--space-sm);justify-content: space-between}.ui-divider{border: 0;border-block-start: 1px solid var(--line);margin: 0}.ui-statgrid,.ui-app-metrics{display: grid;gap: var(--space-md);grid-template-columns: repeat(auto-fit,minmax(11rem,1fr))}@container bronto (max-width: 30rem){.ui-statgrid,.ui-app-metrics{grid-template-columns: 1fr}}.ui-stat,.ui-app-metric{background: var(--panel);border: 1px solid var(--line);border-radius: var(--radius-md);display: grid;gap: 0.4rem;padding: var(--space-md)}.ui-stat__label,.ui-app-metric__label{color: var(--text-dim);font-family: var(--mono);font-size: var(--text-2xs);letter-spacing: var(--tracking-wide);text-transform: uppercase}.ui-stat__value,.ui-app-metric__value{color: var(--text);font-family: var(--display);font-size: 1.9rem;font-variant-numeric: tabular-nums;letter-spacing: 0.01em;line-height: 1}.ui-stat__delta,.ui-app-metric__delta{font-family: var(--mono);font-size: var(--text-xs)}.ui-stat__delta.is-pos,.ui-app-metric__delta.is-pos{color: var(--success)}.ui-stat__delta.is-neg,.ui-app-metric__delta.is-neg{color: var(--danger)}.ui-num{font-variant-numeric: tabular-nums;text-align: end}.ui-num--pos{color: var(--success)}.ui-num--neg{color: var(--danger)}.ui-num--muted{color: var(--text-dim)}.ui-eyebrow{color: var(--accent-text);font-family: var(--display);font-size: var(--text-xs);font-weight: 700;letter-spacing: var(--tracking-wide);margin: 0;text-transform: uppercase}.ui-eyebrow--muted{color: var(--text-dim)}.ui-eyebrow--sm{font-size: var(--text-2xs)}.ui-button{align-items: center;background: var(--accent);border: 1px solid var(--accent);border-radius: var(--radius-md);color: var(--button-text);cursor: pointer;display: inline-flex;font-family: var(--mono);font-size: var(--text-sm);font-weight: 600;gap: 0.45rem;justify-content: center;letter-spacing: var(--tracking-wide);line-height: 1;min-block-size: 2.4rem;min-inline-size: 2.4rem;padding: 0.66rem 1rem;text-transform: uppercase;transition: background-color var(--duration-fast) var(--ease-standard),border-color var(--duration-fast) var(--ease-standard),color var(--duration-fast) var(--ease-standard),transform var(--duration-fast) var(--ease-standard)}.ui-button--ghost{background: transparent;border-color: var(--line-strong);color: var(--text)}.ui-button--subtle{background: var(--panel-soft);border-color: var(--line);color: var(--text)}.ui-button--danger{background: var(--danger);border-color: var(--danger);color: var(--button-text)}.ui-button--icon{aspect-ratio: 1;min-inline-size: 2.4rem;padding: 0}.ui-button:disabled,.ui-button[aria-disabled='true']{cursor: not-allowed;opacity: 0.45}.ui-button:active{transform: translateY(1px)}.ui-button[aria-busy='true']{cursor: progress;pointer-events: none}.ui-button[aria-busy='true']::before{animation: uiSpin 0.6s linear infinite;block-size: 0.9em;border: 2px solid currentcolor;border-block-start-color: transparent;border-radius: var(--radius-pill);content: '';flex: none;inline-size: 0.9em}@media (prefers-reduced-motion: reduce){.ui-button[aria-busy='true']::before{animation-duration: 1.4s}}.ui-link{color: var(--text);text-decoration: underline;text-decoration-color: color-mix(in srgb,var(--accent) 55%,transparent);text-decoration-thickness: 1px;text-underline-offset: 0.22rem;transition: color var(--duration-fast) var(--ease-standard),text-decoration-color var(--duration-fast) var(--ease-standard)}.ui-link--arrow,.ui-link--cta{align-items: center;display: inline-flex;gap: 0.4rem;text-decoration: none}.ui-link--cta{color: var(--accent-text);font-family: var(--display);font-weight: 700;letter-spacing: var(--tracking-wide);text-transform: uppercase}.ui-link--arrow::after,.ui-link--cta::after{border-inline-end: 1px solid currentColor;border-block-start: 1px solid currentColor;content: '';block-size: 0.42rem;transform: rotate(45deg);transition: transform var(--duration-fast) var(--ease-standard);inline-size: 0.42rem}.ui-chip{align-items: center;background: transparent;border: 1px solid var(--line-strong);border-radius: var(--radius-sm);color: var(--text-soft);display: inline-flex;font-family: var(--mono);font-size: var(--text-2xs);gap: 0.36rem;letter-spacing: var(--tracking-wide);line-height: 1;min-block-size: 1.7rem;padding: 0.32rem 0.55rem;text-transform: uppercase}.ui-chip--accent{color: var(--accent-text);border-color: var(--accent)}.ui-badge{align-items: center;background: var(--panel-soft);border: 1px solid var(--line);border-radius: var(--radius-sm);color: var(--text-soft);display: inline-flex;font-family: var(--mono);font-size: var(--text-2xs);font-weight: 700;gap: 0.34rem;letter-spacing: var(--tracking-wide);line-height: 1;padding: 0.28rem 0.5rem;text-transform: uppercase}.ui-badge--accent{background: var(--accent-soft);border-color: color-mix(in srgb,var(--accent) 45%,var(--line))}.ui-badge--success{background: var(--success-soft);border-color: color-mix(in srgb,var(--success) 40%,var(--line))}.ui-badge--warning{background: var(--warning-soft);border-color: color-mix(in srgb,var(--warning) 40%,var(--line))}.ui-badge--danger{background: var(--danger-soft);border-color: color-mix(in srgb,var(--danger) 40%,var(--line))}.ui-badge--muted{background: transparent;border-color: var(--line);color: var(--text-dim)}.ui-badge--dot::before{background: var(--text-soft);border-radius: 50%;content: '';flex: 0 0 auto;block-size: 0.4rem;inline-size: 0.4rem}.ui-badge--accent.ui-badge--dot::before{background: var(--accent)}.ui-badge--success.ui-badge--dot::before{background: var(--success)}.ui-badge--warning.ui-badge--dot::before{background: var(--warning)}.ui-badge--danger.ui-badge--dot::before{background: var(--danger)}.ui-key-value{display: grid;gap: 0.55rem;margin: 0}.ui-key-value div{border-block-start: 1px solid var(--line);display: grid;gap: 0.16rem;padding-block-start: 0.6rem}.ui-key-value dt{color: var(--text-dim);font-family: var(--mono);font-size: var(--text-2xs);font-weight: 700;letter-spacing: var(--tracking-wide);line-height: 1;text-transform: uppercase}.ui-key-value dd{color: var(--text);font-family: var(--mono);margin: 0}@media (hover: hover){.ui-card:hover{border-color: var(--line-strong)}.ui-card--interactive:hover{box-shadow: var(--shadow-raised);transform: translateY(-2px)}.ui-button:hover{background: var(--accent-strong);border-color: var(--accent-strong)}.ui-button--ghost:hover,.ui-button--subtle:hover{background: var(--panel-soft);border-color: var(--accent);color: var(--text)}.ui-button--danger:hover{background: color-mix(in srgb,var(--danger) 84%,#000)}.ui-link:hover{color: var(--accent-text);text-decoration-color: var(--accent)}.ui-link--arrow:hover::after,.ui-link--cta:hover::after{transform: translateX(0.14rem) rotate(45deg)}[dir='rtl'] .ui-link--arrow:hover::after,[dir='rtl'] .ui-link--cta:hover::after{transform: translateX(-0.14rem) rotate(45deg)}.ui-chip--accent:hover{background: var(--accent-soft)}}@media (pointer: coarse){.ui-button{min-block-size: 2.9rem;min-inline-size: 2.9rem}.ui-button--icon{min-inline-size: 2.9rem}}}

package/dist/css/site.css

@@ -1 +1 @@
-@layer bronto{.ui-container{inline-size: 100%;margin-inline: auto;max-inline-size: var(--container,72rem);padding-inline: var(--space-md)}.ui-container--narrow{max-inline-size: var(--container-narrow,44rem)}.ui-skiplink{background: var(--panel-strong);border: 1px solid var(--line-strong);border-radius: var(--radius-md);color: var(--text);inset-block-start: -4rem;inset-inline-start: var(--space-md);padding: 0.7rem 1rem;position: fixed;z-index: var(--z-toast)}.ui-skiplink:focus{inset-block-start: var(--space-md)}.ui-siteheader{align-items: center;border-block-end: 1px solid var(--line);display: flex;flex-wrap: wrap;gap: var(--space-md);justify-content: space-between;padding-block: var(--space-sm)}.ui-siteheader__brand{align-items: center;color: var(--text);display: inline-flex;font-family: var(--display);font-size: var(--text-lg);gap: 0.5rem;letter-spacing: var(--tracking-wide);text-transform: uppercase}.ui-siteheader__brand::before{background: var(--accent);border-radius: 50%;block-size: 0.5rem;content: '';flex: 0 0 auto;inline-size: 0.5rem}.ui-siteheader__actions{align-items: center;display: inline-flex;gap: var(--space-xs)}.ui-sitenav{display: inline-flex;flex-wrap: wrap;gap: 0.15rem}.ui-sitenav a{align-items: center;border: 1px solid transparent;border-radius: var(--radius-md);color: var(--text-soft);display: inline-flex;font-family: var(--mono);font-size: var(--text-xs);gap: 0.45rem;letter-spacing: var(--tracking-wide);padding: 0.4rem 0.6rem;text-transform: uppercase;transition: border-color var(--duration-fast) var(--ease-standard),color var(--duration-fast) var(--ease-standard)}.ui-sitenav a::before{background: currentColor;border-radius: 50%;block-size: 0.32rem;content: '';inline-size: 0.32rem;opacity: 0;transform: scale(0.5);transition: opacity var(--duration-fast) var(--ease-standard),transform var(--duration-fast) var(--ease-spring)}.ui-sitenav a[aria-current]{color: var(--accent-text)}.ui-sitenav a[aria-current]::before{opacity: 1;transform: scale(1)}@media (hover: hover){.ui-sitenav a:hover{color: var(--text)}.ui-sitenav a:hover::before{opacity: 1;transform: scale(1)}}.ui-sitemenu{display: none;position: relative}.ui-sitemenu > summary{align-items: center;background: transparent;border: 1px solid var(--line-strong);border-radius: var(--radius-md);color: var(--text);cursor: pointer;display: inline-flex;font-family: var(--mono);font-size: var(--text-xs);font-weight: 600;gap: 0.4rem;letter-spacing: var(--tracking-wide);list-style: none;min-block-size: 2.4rem;padding: 0.42rem 0.7rem;text-transform: uppercase}.ui-sitemenu > summary::-webkit-details-marker{display: none}.ui-sitemenu[open] > summary{border-color: var(--accent);color: var(--accent-text)}.ui-sitemenu__panel{background: var(--panel-strong);border: 1px solid var(--line-strong);border-radius: var(--radius-md);box-shadow: var(--shadow-raised);display: grid;gap: 0.15rem;inset-block-start: calc(100% + 0.4rem);inset-inline-end: 0;min-inline-size: 12rem;padding: 0.4rem;position: absolute;z-index: var(--z-overlay)}@media (max-width: 720px){.ui-siteheader .ui-sitenav{display: none}.ui-sitemenu{display: block}.ui-sitemenu .ui-sitenav{display: grid}}.ui-sitefooter{align-items: center;border-block-start: 1px solid var(--line);color: var(--text-dim);display: flex;flex-wrap: wrap;font-size: var(--text-sm);gap: var(--space-sm);justify-content: space-between;margin-block-start: var(--space-2xl);padding-block: var(--space-md)}.ui-sitefooter__links{display: flex;flex-wrap: wrap;gap: var(--space-md)}.ui-sitefooter__links a{color: var(--text);text-decoration: underline;text-decoration-color: color-mix(in srgb,var(--accent) 45%,transparent);text-underline-offset: 0.2rem;transition: text-decoration-color var(--duration-fast) var(--ease-standard)}@media (hover: hover){.ui-sitefooter__links a:hover{text-decoration-color: var(--accent)}}.ui-tags{display: flex;flex-wrap: wrap;gap: 0.5rem;list-style: none;margin: 0;padding: 0}.ui-tag{background: var(--panel-soft);border: 1px solid var(--line);border-radius: var(--radius-md);color: var(--text-soft);display: inline-flex;font-size: var(--text-xs);padding: 0.28rem 0.6rem}.ui-tag--accent{background: var(--accent-soft);border-color: color-mix(in srgb,var(--accent) 42%,var(--line));color: var(--accent-text)}.ui-meta{align-items: center;color: var(--text-dim);display: flex;flex-wrap: wrap;font-family: var(--mono);font-size: var(--text-2xs);gap: 0.55rem;letter-spacing: var(--tracking-wide);list-style: none;margin: 0;padding: 0;text-transform: uppercase}.ui-meta__item{align-items: center;display: inline-flex;gap: 0.55rem}.ui-meta__item:not(:last-child)::after{background: var(--line-strong);border-radius: 50%;block-size: 0.22rem;content: '';inline-size: 0.22rem}}
+@layer bronto{.ui-container{inline-size: 100%;margin-inline: auto;max-inline-size: var(--container,72rem);padding-inline: var(--space-md)}.ui-container--narrow{max-inline-size: var(--container-narrow,44rem)}.ui-container--wide{max-inline-size: var(--container-wide,82rem)}.ui-skiplink{background: var(--panel-strong);border: 1px solid var(--line-strong);border-radius: var(--radius-md);color: var(--text);inset-block-start: -4rem;inset-inline-start: var(--space-md);padding: 0.7rem 1rem;position: fixed;z-index: var(--z-toast)}.ui-skiplink:focus{inset-block-start: var(--space-md)}.ui-siteheader{align-items: center;border-block-end: 1px solid var(--line);display: flex;flex-wrap: wrap;gap: var(--space-md);justify-content: space-between;padding-block: var(--space-sm)}.ui-siteheader--sticky{position: sticky;inset-block-start: 0;z-index: var(--z-sticky)}.ui-siteheader__brand{align-items: center;color: var(--text);display: inline-flex;font-family: var(--display);font-size: var(--text-lg);gap: 0.5rem;letter-spacing: var(--tracking-wide);text-transform: uppercase}.ui-siteheader__brand::before{background: var(--accent);border-radius: 50%;block-size: 0.5rem;content: '';flex: 0 0 auto;inline-size: 0.5rem}.ui-siteheader__actions{align-items: center;display: inline-flex;gap: var(--space-xs)}.ui-sitenav{display: inline-flex;flex-wrap: wrap;gap: 0.15rem}.ui-sitenav a{align-items: center;border: 1px solid transparent;border-radius: var(--radius-md);color: var(--text-soft);display: inline-flex;font-family: var(--mono);font-size: var(--text-xs);gap: 0.45rem;letter-spacing: var(--tracking-wide);padding: 0.4rem 0.6rem;text-transform: uppercase;transition: border-color var(--duration-fast) var(--ease-standard),color var(--duration-fast) var(--ease-standard)}.ui-sitenav a::before{background: currentColor;border-radius: 50%;block-size: 0.32rem;content: '';inline-size: 0.32rem;opacity: 0;transform: scale(0.5);transition: opacity var(--duration-fast) var(--ease-standard),transform var(--duration-fast) var(--ease-spring)}.ui-sitenav a[aria-current]{color: var(--accent-text)}.ui-sitenav a[aria-current]::before{opacity: 1;transform: scale(1)}@media (hover: hover){.ui-sitenav a:hover{color: var(--text)}.ui-sitenav a:hover::before{opacity: 1;transform: scale(1)}}.ui-sitemenu{display: none;position: relative}.ui-sitemenu > summary{align-items: center;background: transparent;border: 1px solid var(--line-strong);border-radius: var(--radius-md);color: var(--text);cursor: pointer;display: inline-flex;font-family: var(--mono);font-size: var(--text-xs);font-weight: 600;gap: 0.4rem;letter-spacing: var(--tracking-wide);list-style: none;min-block-size: 2.4rem;padding: 0.42rem 0.7rem;text-transform: uppercase}.ui-sitemenu > summary::-webkit-details-marker{display: none}.ui-sitemenu[open] > summary{border-color: var(--accent);color: var(--accent-text)}.ui-sitemenu__panel{background: var(--panel-strong);border: 1px solid var(--line-strong);border-radius: var(--radius-md);box-shadow: var(--shadow-raised);display: grid;gap: 0.15rem;inset-block-start: calc(100% + 0.4rem);inset-inline-end: 0;min-inline-size: 12rem;padding: 0.4rem;position: absolute;z-index: var(--z-overlay)}@media (max-width: 720px){.ui-siteheader .ui-sitenav{display: none}.ui-sitemenu{display: block}.ui-sitemenu .ui-sitenav{display: grid}}.ui-sitefooter{align-items: center;border-block-start: 1px solid var(--line);color: var(--text-dim);display: flex;flex-wrap: wrap;font-size: var(--text-sm);gap: var(--space-sm);justify-content: space-between;margin-block-start: var(--space-2xl);padding-block: var(--space-md)}.ui-sitefooter__links{display: flex;flex-wrap: wrap;gap: var(--space-md)}.ui-sitefooter__links a{color: var(--text);text-decoration: underline;text-decoration-color: color-mix(in srgb,var(--accent) 45%,transparent);text-underline-offset: 0.2rem;transition: text-decoration-color var(--duration-fast) var(--ease-standard)}@media (hover: hover){.ui-sitefooter__links a:hover{text-decoration-color: var(--accent)}}.ui-tags{display: flex;flex-wrap: wrap;gap: 0.5rem;list-style: none;margin: 0;padding: 0}.ui-tag{background: var(--panel-soft);border: 1px solid var(--line);border-radius: var(--radius-md);color: var(--text-soft);display: inline-flex;font-size: var(--text-xs);padding: 0.28rem 0.6rem}.ui-tag--accent{background: var(--accent-soft);border-color: color-mix(in srgb,var(--accent) 42%,var(--line));color: var(--accent-text)}.ui-meta{align-items: center;color: var(--text-dim);display: flex;flex-wrap: wrap;font-family: var(--mono);font-size: var(--text-2xs);gap: 0.55rem;letter-spacing: var(--tracking-wide);list-style: none;margin: 0;padding: 0;text-transform: uppercase}.ui-meta__item{align-items: center;display: inline-flex;gap: 0.55rem}.ui-meta__item:not(:last-child)::after{background: var(--line-strong);border-radius: 50%;block-size: 0.22rem;content: '';inline-size: 0.22rem}}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ponchia/ui",
-  "version": "0.3.1",
+  "version": "0.3.2",
   "type": "module",
   "description": "Shared Bronto UI framework — Nothing-inspired monochrome CSS theme, dot-matrix motifs, admin shell.",
   "license": "MIT",