@ponchia/ui 0.15.0 → 0.16.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +26 -0
- package/README.md +1 -1
- package/classes/vscode.css-custom-data.json +4 -0
- package/css/annotations.css +4 -2
- package/css/connectors.css +4 -2
- package/css/marks.css +3 -2
- package/css/tokens.css +1 -0
- package/dist/bronto.css +1 -1
- package/dist/css/analytical.css +1 -1
- package/dist/css/annotations.css +1 -1
- package/dist/css/connectors.css +1 -1
- package/dist/css/marks.css +1 -1
- package/dist/css/report-kit.css +1 -1
- package/dist/css/tokens.css +1 -1
- package/dist/css/tool.css +1 -1
- package/docs/compositions.md +2 -2
- package/docs/connectors.md +4 -2
- package/docs/contrast.md +16 -0
- package/docs/d2.md +10 -10
- package/docs/marks.md +2 -1
- package/docs/mermaid.md +2 -0
- package/docs/reference.md +1 -0
- package/docs/renderer.md +1 -0
- package/docs/reporting.md +8 -8
- package/docs/stability.md +1 -1
- package/docs/theming.md +10 -1
- package/llms.txt +1 -1
- package/package.json +1 -1
- package/renderer/index.d.ts +5 -0
- package/renderer/index.d.ts.map +1 -1
- package/renderer/index.js +6 -1
- package/tokens/d2.js +2 -2
- package/tokens/d2.json +2 -2
- package/tokens/figma.variables.json +26 -0
- package/tokens/index.d.ts +2 -2
- package/tokens/index.js +6 -0
- package/tokens/index.json +4 -2
- package/tokens/mermaid.js +2 -2
- package/tokens/mermaid.json +2 -2
- package/tokens/resolved.json +2 -0
- package/tokens/tokens.dtcg.json +42 -0
package/dist/css/tool.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
@layer bronto{:root{--radius-xl: 8px;--radius-lg: 6px;--radius-md: 4px;--radius-sm: 2px;--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;--space-0-5: 0.125rem;--space-0-75: 0.1875rem;--space-1-5: 0.375rem;--space-2-5: 0.625rem;--tap-target: max(44px,2.9rem);--tap-target-min: max(24px,1.6rem);--safe-area-top: env(safe-area-inset-top,0px);--safe-area-right: env(safe-area-inset-right,0px);--safe-area-bottom: env(safe-area-inset-bottom,0px);--safe-area-left: env(safe-area-inset-left,0px);--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;--dot-font: 'Doto',var(--mono);--display: var(--dot-font);--display-weight: 700;--display-weight-strong: 800;--text-2xs: 0.75rem;--text-xs: 0.8125rem;--text-sm: 0.875rem;--text-base: 1rem;--text-lg: 1.125rem;--text-xl: 1.5rem;--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;--z-canvas: var(--z-base);--z-chrome: var(--z-sticky);--z-panel: 25;--z-modal: var(--z-overlay);--z-menu: var(--z-popover);--z-tooltip: 70;--z-navigation: 80;--ui-zoom: 1;--ui-px: 1px;--hairline: 1px;--focus-ring-width: 2px;--focus-ring-offset: 2px;--accent-1: color-mix(in oklch,var(--accent) 8%,var(--accent-ramp-end));--accent-2: color-mix(in oklch,var(--accent) 16%,var(--accent-ramp-end));--accent-3: color-mix(in oklch,var(--accent) 32%,var(--accent-ramp-end));--accent-4: color-mix(in oklch,var(--accent) 60%,var(--accent-ramp-end));--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);--bronto-color-info: var(--info);--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-ramp-end: #ffffff;--accent-strong: color-mix(in srgb,var(--accent) 83%,#000);--accent-text: var(--accent-strong);--on-accent: var(--button-text);--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);--danger: #c01622;--danger-soft: rgb(192,22,34,0.1);--info: #1f63c4;--info-soft: rgb(31,99,196,0.12);--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: #121212;--bg-elevated: #181818;--bg-accent: color-mix(in srgb,var(--accent) 8%,transparent);--panel: #1c1c1c;--panel-strong: #222222;--panel-soft: #242424;--line: #383838;--line-strong: #555555;--text: #e6e6e6;--text-soft: #c8c8c8;--text-dim: #a0a0a0;--accent: #ff3b41;--accent-ramp-end: #000000;--accent-strong: color-mix(in srgb,var(--accent) 80%,#fff);--accent-text: var(--accent-strong);--on-accent: var(--button-text);--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);--danger: #ff4d54;--danger-soft: rgb(255,77,84,0.15);--info: #6fb0e6;--info-soft: rgb(111,176,230,0.14);--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: #121212;--bg-elevated: #181818;--bg-accent: color-mix(in srgb,var(--accent) 8%,transparent);--panel: #1c1c1c;--panel-strong: #222222;--panel-soft: #242424;--line: #383838;--line-strong: #555555;--text: #e6e6e6;--text-soft: #c8c8c8;--text-dim: #a0a0a0;--accent: #ff3b41;--accent-ramp-end: #000000;--accent-strong: color-mix(in srgb,var(--accent) 80%,#fff);--accent-text: var(--accent-strong);--on-accent: var(--button-text);--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);--danger: #ff4d54;--danger-soft: rgb(255,77,84,0.15);--info: #6fb0e6;--info-soft: rgb(111,176,230,0.14);--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-0-5: 0.1rem;--space-0-75: 0.15rem;--space-1-5: 0.3rem;--space-2-5: 0.5rem;--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-0-5: 0.15rem;--space-0-75: 0.225rem;--space-1-5: 0.45rem;--space-2-5: 0.75rem;--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-ui-zoom]{--ui-px: calc(1px / max(var(--ui-zoom,1),0.15));--hairline: var(--ui-px);--focus-ring-width: calc(2 * var(--ui-px));--focus-ring-offset: calc(2 * var(--ui-px))}[data-contrast='high'],:root[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:root{--line: var(--line-strong);--text-dim: var(--text-soft);--focus-ring: var(--accent);--shadow-raised: 0 0 0 1px var(--text)}}:root[data-theme='dark'][data-surface='oled']{--bg: #000000;--bg-elevated: #0a0a0a;--panel: #101010;--panel-strong: #161616;--panel-soft: #1a1a1a}@media (prefers-color-scheme: dark){:root:not([data-theme='light'])[data-surface='oled']{--bg: #000000;--bg-elevated: #0a0a0a;--panel: #101010;--panel-strong: #161616;--panel-soft: #1a1a1a}}@media print{:root:root:root:root{color-scheme: light;--text: #111;--text-soft: #2a2a2a;--text-dim: #555;--bg: #fff;--bg-elevated: #fff;--panel: #fff;--panel-strong: #fff;--panel-soft: #f7f7f7;--line: #d9d9d9;--line-strong: #b3b3b3;--success: #2f7d4f;--success-soft: rgb(47,125,79,0.12);--danger: #c01622;--danger-soft: rgb(192,22,34,0.1);--warning: #806414;--warning-soft: rgb(128,100,20,0.13);--info: #1f63c4;--info-soft: rgb(31,99,196,0.12);--accent: #d71921;--bg-accent: color-mix(in srgb,var(--accent) 6%,transparent);--accent-ramp-end: #ffffff;--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);--button-text: #ffffff;--on-accent: var(--button-text);--field-dot: rgb(17,17,17,0.16);--field-dot-hot: rgb(17,17,17,0.4);--field-dot-accent: color-mix(in srgb,var(--accent) 78%,transparent);--focus-ring: var(--accent);--code-bg: rgb(17,17,17,0.05)}}@font-face{font-family: Doto;font-style: normal;font-weight: 400;font-display: swap;src: url('../../fonts/doto-400.woff2') format('woff2')}@font-face{font-family: Doto;font-style: normal;font-weight: 500;font-display: swap;src: url('../../fonts/doto-500.woff2') format('woff2')}@font-face{font-family: Doto;font-style: normal;font-weight: 600;font-display: swap;src: url('../../fonts/doto-600.woff2') format('woff2')}@font-face{font-family: Doto;font-style: normal;font-weight: 700;font-display: swap;src: url('../../fonts/doto-700.woff2') format('woff2')}@font-face{font-family: Doto;font-style: normal;font-weight: 800;font-display: swap;src: url('../../fonts/doto-800.woff2') format('woff2')}@font-face{font-family: Doto;font-style: normal;font-weight: 900;font-display: swap;src: url('../../fonts/doto-900.woff2') format('woff2')}@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: 1rem;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: 100dvh;position: relative}:root{--scroll-offset: 6rem}main [id]{scroll-margin-block-start: var(--scroll-offset)}::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(--sans);font-weight: 650;letter-spacing: -0.02em;line-height: 1.2;margin: 0}h1{font-size: clamp(2rem,4vw,3rem)}h2{font-size: clamp(1.5rem,3vw,2rem)}h3{font-size: 1.25rem}h4{font-size: 1rem}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: var(--focus-ring-width) solid var(--focus-ring);outline-offset: var(--focus-ring-offset)}.ui-muted{color: var(--text-dim)}.ui-mono{font-family: var(--mono)}.ui-display{font-family: var(--display);font-weight: var(--display-weight);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}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 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 uiScrollReveal{0%{opacity: 0;transform: translateY(10px)}35%{opacity: 1}100%{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)}}@keyframes uiScrollGrow{to{transform: scaleX(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(min(var(--i,0),6) * 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) and (scripting: enabled){.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}.ui-scroll-progress{background: var(--accent);block-size: 3px;inset-block-start: 0;inset-inline: 0;position: fixed;transform: scaleX(0);transform-origin: 0 50%;z-index: var(--z-overlay)}[dir='rtl'] .ui-scroll-progress{transform-origin: 100% 50%}@media (forced-colors: active){.ui-spinner{border-color: CanvasText;border-block-start-color: Highlight}.ui-scroll-progress{background: Highlight}.ui-skeleton{border: 1px solid CanvasText}}@supports (animation-timeline: scroll()){@media (prefers-reduced-motion: no-preference){.ui-scroll-progress{animation: uiScrollGrow linear;animation-timeline: scroll(root block)}}}@supports (animation-timeline: view()){@media (prefers-reduced-motion: no-preference){.ui-scroll-reveal{animation: uiScrollReveal linear both;animation-timeline: view();animation-range: entry 0% entry 100%}}}.ui-vt{view-transition-name: var(--ui-vt-name,none)}@media (prefers-reduced-motion: no-preference){::view-transition-old(root),::view-transition-new(root){animation-duration: var(--duration-base);animation-timing-function: var(--ease-standard)}}@media (prefers-reduced-motion: reduce){::view-transition-group(*),::view-transition-old(*),::view-transition-new(*){animation: none !important}}@media (prefers-reduced-motion: reduce){html{scroll-behavior: auto}*,*::before,*::after{animation-duration: 0.01ms !important;animation-iteration-count: 1 !important;animation-delay: 0s !important;transition-duration: 0.01ms !important}.ui-skeleton{animation: none;background: var(--panel-soft);background-size: auto}.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),var(--dotmatrix-dot,minmax(0,1fr)))}.ui-dotmatrix__cell{aspect-ratio: 1;background: var(--field-dot);border-radius: var(--dotmatrix-dot-radius,50%)}.ui-dotmatrix__cell--hot{background: var(--field-dot-hot);box-shadow: 0 0 var(--dotmatrix-glow,0) var(--field-dot-hot)}.ui-dotmatrix__cell--accent{background: var(--field-dot-accent);box-shadow: 0 0 var(--dotmatrix-glow,0) var(--field-dot-accent)}.ui-dotmatrix--reveal .ui-dotmatrix__cell{animation: dotmatrixCellOn var(--duration-base) var(--ease-out) both;animation-delay: calc(var(--i,0) * var(--dotmatrix-reveal-step,3ms))}@keyframes dotmatrixCellOn{from{opacity: 0;transform: scale(0.35)}}.ui-dotmatrix--pulse{animation: dotmatrixPulse 1.8s var(--ease-standard) infinite}@keyframes dotmatrixPulse{50%{opacity: var(--dotmatrix-pulse-min,0.55);transform: scale(0.94)}}.ui-icon{display: inline-block;flex: 0 0 auto;inline-size: var(--icon-size,1em);block-size: var(--icon-size,1em);background: currentcolor;vertical-align: -0.125em;-webkit-mask: var(--icon-mask) center / contain no-repeat;mask: var(--icon-mask) center / contain no-repeat}.ui-dot{--ui-dot-color: var(--text-dim);background: var(--ui-dot-color);border-radius: 50%;display: inline-block;flex: 0 0 auto;block-size: 0.55rem;inline-size: 0.55rem}.ui-dot--accent{--ui-dot-color: var(--accent)}.ui-dot--success{--ui-dot-color: var(--success)}.ui-dot--warning{--ui-dot-color: var(--warning)}.ui-dot--danger{--ui-dot-color: var(--danger)}.ui-dot--info{--ui-dot-color: var(--info)}.ui-dot--live{box-shadow: 0 0 0 0 color-mix(in srgb,var(--ui-dot-color) 70%,transparent);position: relative}.ui-dot--live:not( .ui-dot--accent,.ui-dot--success,.ui-dot--warning,.ui-dot--danger,.ui-dot--info ){--ui-dot-color: var(--success)}.ui-dot--live::after{animation: pulseRing 1.8s var(--ease-out) infinite;border: 1px solid var(--ui-dot-color);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 i:nth-child(n + 9){display: none}.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: var(--radius-sm);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-waffle{display: grid;gap: var(--waffle-gap,0.18em);grid-template-columns: repeat(var(--waffle-cols,10),1fr);inline-size: var(--waffle-size,7em)}.ui-waffle i{aspect-ratio: 1;background: var(--field-dot);border-radius: var(--dotmatrix-dot-radius,50%)}.ui-waffle i.is-on{background: var(--field-dot-accent);box-shadow: 0 0 var(--dotmatrix-glow,0) var(--field-dot-accent)}.ui-activity{display: grid;gap: var(--activity-gap,0.18em);grid-auto-columns: var(--activity-cell,0.82em);grid-auto-flow: column;grid-template-rows: repeat(var(--activity-rows,7),1fr)}.ui-activity i{aspect-ratio: 1;background: var(--field-dot);border-radius: var(--dotmatrix-dot-radius,2px)}.ui-activity i[data-level='1']{background: color-mix(in oklab,var(--field-dot-accent) 30%,var(--field-dot))}.ui-activity i[data-level='2']{background: color-mix(in oklab,var(--field-dot-accent) 55%,var(--field-dot))}.ui-activity i[data-level='3']{background: color-mix(in oklab,var(--field-dot-accent) 78%,var(--field-dot))}.ui-activity i[data-level='4']{background: var(--field-dot-accent)}.ui-level{block-size: var(--level-height,4em);display: flex;flex-direction: column-reverse;gap: var(--level-gap,2px);inline-size: var(--level-size,0.7em)}.ui-level i{background: var(--field-dot);border-radius: var(--radius-sm);flex: 1}.ui-level i.is-on{background: var(--accent);box-shadow: 0 0 var(--dotmatrix-glow,0) var(--accent)}.ui-level--warn i.is-on{background: var(--warning)}.ui-level--danger i.is-on{background: var(--danger)}.ui-dotgauge{--_v: var(--v,0);--_sweep: var(--gauge-sweep,270deg);aspect-ratio: 1;background: conic-gradient( from var(--gauge-from,135deg),var(--field-dot-accent) calc(var(--_v) * var(--_sweep)),var(--field-dot) calc(var(--_v) * var(--_sweep)) var(--_sweep),transparent var(--_sweep) );border-radius: 50%;inline-size: var(--gauge-size,5em);-webkit-mask: radial-gradient(closest-side,transparent 58%,#000 59%),radial-gradient(circle,#000 34%,transparent 36%) 0 0 / var(--gauge-dot,0.5em) var(--gauge-dot,0.5em);-webkit-mask-composite: source-in;mask: radial-gradient(closest-side,transparent 58%,#000 59%),radial-gradient(circle,#000 34%,transparent 36%) 0 0 / var(--gauge-dot,0.5em) var(--gauge-dot,0.5em);mask-composite: intersect}.ui-readout{align-items: flex-end;display: inline-flex;gap: var(--readout-gap,0.12em)}.ui-readout__spacer{display: inline-block;inline-size: var(--readout-space,0.5em)}.ui-halftone{-webkit-mask: radial-gradient(circle,#000 var(--halftone-dot,38%),transparent calc(var(--halftone-dot,38%) + 1%)) 0 0 / var(--halftone-gap,0.5em) var(--halftone-gap,0.5em);mask: radial-gradient(circle,#000 var(--halftone-dot,38%),transparent calc(var(--halftone-dot,38%) + 1%)) 0 0 / var(--halftone-gap,0.5em) var(--halftone-gap,0.5em)}.ui-dotfit{container: dotfit / inline-size}@container dotfit (inline-size < 18rem){.ui-dotfit .ui-dotgrid{--dot-gap: 8px}.ui-dotfit .ui-activity{--activity-cell: 0.6em}.ui-dotfit .ui-waffle{--waffle-size: 5em}}@media (scripting: enabled){.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,.ui-dotmatrix--reveal .ui-dotmatrix__cell,.ui-dotmatrix--pulse{animation: none}.ui-dotspinner i{opacity: 0.6}.ui-matrix{clip-path: none}}@media (forced-colors: active){.ui-dot--success{--ui-dot-color: LinkText;forced-color-adjust: none}.ui-dot--warning{--ui-dot-color: Mark;forced-color-adjust: none}.ui-dot--danger{--ui-dot-color: Highlight;forced-color-adjust: none}.ui-dot--info{--ui-dot-color: ButtonText;forced-color-adjust: none}.ui-dot--accent{--ui-dot-color: LinkText;forced-color-adjust: none}.ui-dot--live:not( .ui-dot--accent,.ui-dot--success,.ui-dot--warning,.ui-dot--danger,.ui-dot--info ){--ui-dot-color: LinkText;forced-color-adjust: none}.ui-icon{forced-color-adjust: none;background: CanvasText}.ui-dotmatrix__cell--hot{forced-color-adjust: none;background: Highlight}.ui-dotmatrix__cell--accent{forced-color-adjust: none;background: LinkText}.ui-waffle i.is-on,.ui-level i.is-on{forced-color-adjust: none;background: LinkText}.ui-level--warn i.is-on{background: Mark}.ui-level--danger i.is-on{background: Highlight}.ui-activity i[data-level='1'],.ui-activity i[data-level='2'],.ui-activity i[data-level='3'],.ui-activity i[data-level='4']{forced-color-adjust: none;background: CanvasText}.ui-dotgauge{forced-color-adjust: none}}@media print{.ui-dotmatrix__cell,.ui-dotbar i,.ui-dot,.ui-icon,.ui-waffle i,.ui-activity i,.ui-level i,.ui-dotgauge{-webkit-print-color-adjust: exact;print-color-adjust: exact}}.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{min-inline-size: 0;color: var(--text-soft);font-size: var(--text-base);line-height: 1.7;overflow-wrap: break-word;--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(--sans);line-height: 1.12;text-wrap: balance}.ui-prose h1{font-size: var(--text-xl);letter-spacing: 0;text-transform: none}.ui-prose h2{font-size: var(--text-lg);letter-spacing: 0;padding-block-end: 0.3rem;border-block-end: 1px solid var(--line);text-transform: none}.ui-prose h3{font-size: var(--text-lg)}.ui-prose :is(h4,h5,h6){font-size: var(--text-base);letter-spacing: 0;text-transform: none}.ui-prose :is(h5,h6){color: var(--text-dim)}.ui-prose :is(h1,h2,h3,h4,h5,h6)[id]{scroll-margin-block-start: var(--scroll-offset)}.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:not(.ui-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(--sans);font-size: var(--text-2xs);font-weight: 700;letter-spacing: 0;text-transform: none}.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(--sans);font-size: var(--text-2xs);letter-spacing: 0;text-transform: none}.ui-prose table{border: 1px solid var(--line);border-collapse: collapse;border-radius: var(--radius-md);display: block;font-family: var(--sans);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: 0;text-transform: none}.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-prose--blocks{--prose-measure: none;--prose-block: 3px;--prose-heading-lead: 18px;--prose-list-column: 24px;color: var(--text);line-height: 1.5}.ui-prose--blocks > *,.ui-prose--blocks > * + *,.ui-prose--blocks > * + :is(h1,h2,h3,h4,h5,h6),.ui-prose--blocks li,.ui-prose--blocks li + li,.ui-prose--blocks li > *,.ui-prose--blocks :is(ul,ol) :is(ul,ol),.ui-prose--blocks blockquote > *,.ui-prose--blocks blockquote > * + *{margin-block: 0}.ui-prose--blocks > :not(ul,ol),.ui-prose--blocks li{padding-block: var(--prose-block)}.ui-prose--blocks li:has(> :is(ul,ol)){padding-block-end: 0}.ui-prose--blocks li > :is(ul,ol){padding-block-start: var(--prose-block)}.ui-prose--blocks :is(h1,h2,h3,h4,h5,h6){padding-block: var(--prose-heading-lead) var(--prose-block);border: 0;font-size: 1em;font-weight: 600;line-height: 1.25}.ui-prose--blocks h1{font-size: 1.6em}.ui-prose--blocks h2{font-size: 1.3em}.ui-prose--blocks h3{font-size: 1.15em}.ui-prose--blocks :is(ul,ol){padding-inline-start: var(--prose-list-column)}.ui-prose--blocks ul{list-style: disc}.ui-prose--blocks ul ul{list-style: circle}.ui-prose--blocks ul ul ul{list-style: square}.ui-prose--blocks li::marker{color: inherit}.ui-prose--blocks li:has(> input[type='checkbox'],> p > input[type='checkbox']){margin-inline-start: calc(-1 * var(--prose-list-column));padding-block: 10px;list-style: none}.ui-prose--blocks :is(li,li > p):has(> input[type='checkbox']){display: flex;align-items: flex-start}.ui-prose--blocks :is(li,li > p) > input[type='checkbox']{flex: none;inline-size: 20px;block-size: 20px;margin: 2px 6px 0}@media (pointer: coarse){.ui-prose--blocks li:has(> input[type='checkbox'],> p > input[type='checkbox']){padding-block: 16px}.ui-prose--blocks :is(li,li > p) > input[type='checkbox']{margin-inline: 12px}}.ui-prose--blocks blockquote{margin-inline: 0}.ui-prose--blocks blockquote > *{line-height: inherit}.ui-quote{color: var(--text);display: grid;font-family: var(--sans);font-size: var(--text-xl);font-weight: var(--display-weight);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(--sans);font-size: var(--text-2xs);font-style: normal;letter-spacing: 0;text-transform: none}.ui-stack{min-inline-size: 0;grid-template-columns: minmax(0,1fr);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 > :first-child{block-size: 100%;inline-size: 100%;object-fit: cover}.ui-cq{container: bronto / inline-size}@container bronto (max-inline-size: 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(min(100%,11rem),1fr))}@container bronto (max-inline-size: 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;min-inline-size: 0;padding: var(--space-md)}.ui-stat__label,.ui-app-metric__label{color: var(--text-dim);font-family: var(--sans);font-size: var(--text-2xs);letter-spacing: 0;text-transform: none}.ui-stat__value,.ui-app-metric__value{color: var(--text);font-family: var(--sans);font-size: 1.9rem;font-variant-numeric: tabular-nums;font-weight: var(--display-weight-strong);letter-spacing: 0;line-height: 1.05;overflow-wrap: anywhere}.ui-stat__delta,.ui-app-metric__delta{font-family: var(--sans);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-stat__delta.is-pos::before,.ui-app-metric__delta.is-pos::before{content: '▲ ';font-size: 0.85em}.ui-stat__delta.is-neg::before,.ui-app-metric__delta.is-neg::before{content: '▼ ';font-size: 0.85em}.ui-num{display: inline-block;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-delta{align-items: baseline;color: var(--text-soft);display: inline-flex;font-variant-numeric: tabular-nums;gap: 0.2em}.ui-delta::before{font-size: 0.85em}.ui-delta--up{color: var(--success)}.ui-delta--up::before{content: '▲'}.ui-delta--down{color: var(--danger)}.ui-delta--down::before{content: '▼'}.ui-delta--flat{color: var(--text-dim)}.ui-delta--flat::before{content: '—'}.ui-delta--invert.ui-delta--up{color: var(--danger)}.ui-delta--invert.ui-delta--down{color: var(--success)}.ui-eyebrow{color: var(--accent-text);font-family: var(--sans);font-size: var(--text-xs);font-weight: 700;letter-spacing: 0;margin: 0;text-transform: none}.ui-eyebrow--muted{color: var(--text-dim)}.ui-eyebrow--sm{font-size: var(--text-2xs)}.ui-eyebrow--caps{letter-spacing: var(--tracking-wide);text-transform: uppercase}.ui-eyebrow--mono{font-family: var(--mono)}.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(--sans);font-size: var(--text-sm);font-weight: 600;gap: 0.45rem;justify-content: center;letter-spacing: 0;line-height: 1;min-block-size: 2.4rem;min-inline-size: 2.4rem;padding: 0.66rem 1rem;text-transform: none;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--sm{font-size: var(--text-xs);gap: 0.3rem;min-block-size: 1.9rem;min-inline-size: 1.9rem;padding: 0.4rem 0.66rem}.ui-button--lg{font-size: var(--text-base);gap: 0.55rem;min-block-size: 2.9rem;min-inline-size: 2.9rem;padding: 0.85rem 1.4rem}.ui-button--dense{gap: 0.25rem;min-block-size: var(--tap-target-min);min-inline-size: var(--tap-target-min);padding: 0.2rem 0.35rem}.ui-button--dense.ui-button--icon{padding: 0}.ui-button__label{min-inline-size: 0;overflow: hidden;text-overflow: ellipsis;white-space: nowrap}.ui-button--icon .ui-button__label{clip-path: inset(50%);block-size: 1px;overflow: hidden;position: absolute;white-space: nowrap;inline-size: 1px}.ui-button:disabled,.ui-button[aria-disabled='true']{cursor: not-allowed;opacity: 0.45}.ui-button[aria-disabled='true'],.ui-link[aria-disabled='true']{pointer-events: none}.ui-link[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{border-block-start-color: currentcolor}}.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(--sans);font-weight: 700;letter-spacing: 0;text-transform: none}.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}[dir='rtl'] .ui-link--arrow::after,[dir='rtl'] .ui-link--cta::after{transform: rotate(-45deg)}@media (pointer: coarse){.ui-link--arrow,.ui-link--cta{min-block-size: var(--tap-target-min)}}.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(--sans);font-size: var(--text-2xs);gap: 0.36rem;letter-spacing: 0;line-height: 1;min-block-size: 1.7rem;padding: 0.32rem 0.55rem;text-transform: none}.ui-chip--accent{color: var(--text-soft);border-color: var(--accent)}.ui-chip--dense{min-block-size: 1.25rem;padding: 0.15rem 0.4rem}.ui-chip--dense:is(button,a,[role='button']){min-block-size: var(--tap-target-min);min-inline-size: var(--tap-target-min)}@media (pointer: coarse){.ui-chip--dense:is(button,a,[role='button']){min-block-size: var(--tap-target);min-inline-size: var(--tap-target)}}.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(--sans);font-size: var(--text-2xs);font-weight: 700;gap: 0.34rem;letter-spacing: 0;line-height: 1;padding: 0.28rem 0.5rem;text-transform: none}.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--info{background: var(--info-soft);border-color: color-mix(in srgb,var(--info) 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-badge--info.ui-badge--dot::before{background: var(--info)}.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(--sans);font-size: var(--text-2xs);font-weight: 700;letter-spacing: 0;line-height: 1;text-transform: none}.ui-key-value dd{color: var(--text);font-family: var(--sans);margin: 0;min-inline-size: 0;overflow-wrap: anywhere}@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: var(--tap-target);min-inline-size: var(--tap-target)}.ui-button--icon{min-inline-size: var(--tap-target)}}.ui-empty-state,.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-empty-state p,.ui-app-empty-state p{color: var(--text-dim);margin: 0.3rem 0 0}.ui-empty-state__glyph{display: block;font-size: 1.5rem;line-height: 1;opacity: 0.5}.ui-empty-state__lead{color: var(--text);margin: 0}.ui-empty-state__hint{font-size: var(--text-2xs);margin: 0;opacity: 0.8}.ui-empty-state--invite{align-items: center;border: 0;display: flex;flex-direction: column;gap: var(--space-2xs);justify-content: center;min-block-size: 100%;padding: var(--space-sm)}.ui-kbd{align-items: center;background: var(--panel-soft);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);justify-content: center;line-height: 1;min-inline-size: 1.4rem;padding: 0.18rem 0.4rem}.ui-shortcut{align-items: center;display: inline-flex;gap: 0.25rem;vertical-align: middle;white-space: nowrap}.ui-shortcut__sep{color: var(--text-dim);font-family: var(--mono);font-size: var(--text-2xs)}.ui-timeline{display: grid;gap: var(--space-md);list-style: none;margin: 0;padding: 0}.ui-timeline__item{border-inline-start: 1px solid var(--line);display: grid;gap: 0.2rem;padding-inline-start: var(--space-md);position: relative}.ui-timeline__item::before{background: var(--line-strong);border-radius: 50%;block-size: 0.5rem;content: '';inline-size: 0.5rem;inset-block-start: 0.18rem;inset-inline-start: calc(-0.25rem - 0.5px);position: absolute}.ui-timeline__item[aria-current]::before{background: var(--accent)}.ui-timeline__time{color: var(--text-dim);font-family: var(--mono);font-size: var(--text-2xs);letter-spacing: var(--tracking-wide);text-transform: uppercase}.ui-row{align-items: center;background: transparent;border: 0;border-radius: var(--radius-sm);color: var(--text-soft);cursor: pointer;display: flex;font: inherit;gap: 0.5rem;min-inline-size: 0;padding: 0.4rem 0.5rem;text-align: start;inline-size: 100%}.ui-row:not(button,a,[role='button'],[role='option'],[tabindex]){cursor: default}.ui-row__title{flex: 1 1 auto;min-inline-size: 0;overflow: hidden;text-overflow: ellipsis;white-space: nowrap}.ui-row__meta{color: var(--text-dim);flex: none;font-family: var(--mono);font-size: var(--text-2xs)}.ui-row__mark{display: inline-flex;flex: none}.ui-row--stacked{align-items: stretch;flex-direction: column;gap: 0.15rem}.ui-row--stacked .ui-row__title{flex: none}.ui-row--ruled{border-block-end: 1px solid var(--line);border-radius: 0}.ui-row[aria-selected='true'],.ui-row[aria-current]:not([aria-current='false']),.ui-row.is-selected{background: var(--panel-soft);color: var(--text)}@media (hover: hover){.ui-row:is(button,a,[role='button'],[role='option'],[tabindex]):hover{background: var(--bg-accent);color: var(--text)}}.ui-row:focus-visible{background: var(--bg-accent);color: var(--text);outline: var(--focus-ring-width) solid var(--focus-ring);outline-offset: calc(-1 * var(--focus-ring-offset))}@media (pointer: coarse){.ui-row{min-block-size: var(--tap-target)}}@media (forced-colors: active){.ui-row[aria-selected='true'],.ui-row[aria-current]:not([aria-current='false']),.ui-row.is-selected,.ui-row:hover,.ui-row:focus-visible{forced-color-adjust: none;background: Highlight;color: HighlightText}}.ui-field{display: grid;gap: 0.35rem}.ui-label{color: var(--text-dim);font-family: var(--sans);font-size: var(--text-2xs);font-weight: 700;letter-spacing: 0;text-transform: none}.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(--sans);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: var(--focus-ring-width) solid var(--focus-ring);outline-offset: calc(var(--focus-ring-offset) / 2)}.ui-input:disabled,.ui-select:disabled,.ui-textarea:disabled{cursor: not-allowed;opacity: 0.5}.ui-input:read-only:not(:disabled),.ui-textarea:read-only:not(:disabled){background: var(--panel-soft);cursor: default}.ui-range:disabled,.ui-file:disabled,.ui-switch:has(input:disabled),.ui-check:has(input:disabled),.ui-segmented__option:has(input:disabled){cursor: not-allowed;opacity: 0.5}.ui-input:autofill,.ui-select:autofill,.ui-textarea:autofill,.ui-search input:autofill{-webkit-text-fill-color: var(--text);box-shadow: inset 0 0 0 100rem var(--bg-elevated);caret-color: var(--text)}.ui-input[aria-invalid='true'],.ui-select[aria-invalid='true'],.ui-textarea[aria-invalid='true']{border-color: var(--danger)}.ui-check:has(input[aria-invalid='true']) input{outline: 2px solid var(--danger);outline-offset: 1px}.ui-switch:has(input[aria-invalid='true']) .ui-switch__track{border-color: var(--danger)}.ui-segmented:has(input[aria-invalid='true']){border-color: var(--danger)}@media (forced-colors: active){.ui-input[aria-invalid='true'],.ui-select[aria-invalid='true'],.ui-textarea[aria-invalid='true']{border-style: double;border-width: 3px}.ui-check:has(input[aria-invalid='true']) input{outline-width: 3px;outline-style: double}.ui-switch:has(input[aria-invalid='true']) .ui-switch__track,.ui-segmented:has(input[aria-invalid='true']){border-style: double;border-width: 3px}.ui-hint--error::before,.ui-error-summary__title::before{content: '⚠ '}}.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,.ui-input-group > .ui-select:focus-visible{z-index: 1}.ui-input-group__addon{align-items: center;background: var(--panel-soft);border: 1px solid var(--line-strong);color: var(--text-dim);display: flex;font-size: var(--text-sm);padding-inline: var(--space-sm);white-space: nowrap}.ui-input-icon{display: block;position: relative}.ui-input-icon > .ui-input{padding-inline-start: 2.2rem}.ui-input-icon--end > .ui-input{padding-inline: 0.7rem 2.2rem}.ui-input-icon__icon{align-items: center;color: var(--text-dim);display: inline-flex;inset-block-start: 50%;inset-inline-start: 0.7rem;justify-content: center;pointer-events: none;position: absolute;transform: translateY(-50%)}.ui-input-icon--end .ui-input-icon__icon{inset-inline: auto 0.7rem}.ui-input-icon__icon svg{block-size: 1rem;inline-size: 1rem}.ui-input-icon:focus-within .ui-input-icon__icon{color: var(--accent)}.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{margin-inline: 0;accent-color: var(--accent);inline-size: 100%}.ui-range:focus-visible{outline: var(--focus-ring-width) solid var(--focus-ring);outline-offset: calc(2 * var(--focus-ring-offset))}.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(--sans);font-size: var(--text-sm);font-weight: 700;letter-spacing: 0;margin: 0 0 var(--space-xs);text-transform: none}.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:has(input:focus-visible){outline: var(--focus-ring-width) solid var(--focus-ring);outline-offset: calc(var(--focus-ring-offset) / 2)}.ui-search:focus-within::before{background: var(--accent)}.ui-search input{background: transparent;border: 0;color: var(--text);font-family: var(--sans);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: var(--focus-ring-width) solid var(--focus-ring);outline-offset: var(--focus-ring-offset)}@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: var(--tap-target)}.ui-search{min-block-size: var(--tap-target)}.ui-switch,.ui-check{min-block-size: var(--tap-target)}.ui-check input{block-size: 1.15rem;inline-size: 1.15rem}}@property --value{syntax: '<number>';inherits: true;initial-value: 0}.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;print-color-adjust: exact}.ui-alert > *{grid-column: 2}.ui-alert__title{color: var(--text);font-family: var(--sans);font-size: var(--text-2xs);font-weight: 700;letter-spacing: 0;margin: 0;text-transform: none}.ui-alert__body{margin: 0}.ui-alert__close{background: transparent;border: 0;color: var(--text-dim);cursor: pointer;font-family: var(--sans);grid-column: 3;grid-row: 1;line-height: 1;padding: 0.1rem 0.3rem}.ui-alert:has(.ui-alert__close){grid-template-columns: auto 1fr auto}.ui-alert--accent{--alert-tone: var(--accent);border-inline-start-color: var(--accent)}.ui-alert--accent::before{background: var(--accent)}.ui-alert--success{--alert-tone: var(--success);border-inline-start-color: var(--success)}.ui-alert--success::before{background: var(--success)}.ui-alert--warning{--alert-tone: var(--warning);border-inline-start-color: var(--warning)}.ui-alert--warning::before{background: var(--warning)}.ui-alert--danger{--alert-tone: var(--danger);border-inline-start-color: var(--danger)}.ui-alert--danger::before{background: var(--danger)}.ui-alert--info{--alert-tone: var(--info);border-inline-start-color: var(--info)}.ui-alert--info::before{background: var(--info)}.ui-alert--band{background: color-mix(in oklch,var(--alert-tone,var(--text-dim)) 10%,var(--panel));border: 0;border-block-end: 1px solid var(--line);border-radius: 0;font-size: var(--text-2xs);gap: var(--space-1-5);padding: var(--space-1-5) var(--space-sm)}.ui-alert--band::before{block-size: 0.4rem;inline-size: 0.4rem;margin-block-start: 0.3em}.ui-body-state{align-items: center;box-sizing: border-box;color: var(--text-dim);display: flex;flex: 1 1 auto;flex-direction: column;font-size: var(--text-xs);gap: var(--space-2xs);justify-content: center;margin: 0;min-block-size: 100%;padding: var(--space-md);text-align: center;text-wrap: balance}.ui-body-state > *{margin: 0}.ui-body-state--error,.ui-body-state--stale{--body-state-tone: var(--danger);color: var(--text-soft)}.ui-body-state--stale{--body-state-tone: var(--warning)}.ui-body-state--error::before,.ui-body-state--stale::before{background: var(--body-state-tone);border-radius: 50%;block-size: 0.5rem;content: '';inline-size: 0.5rem;print-color-adjust: exact}@container bronto (max-inline-size: 15rem){.ui-body-state{font-size: var(--text-2xs);padding: var(--space-xs)}}@media (hover: hover){.ui-alert__close:hover{color: var(--text)}}.ui-toast-stack{display: grid;gap: 0.5rem;inset-block: auto max(1.25rem,var(--safe-area-bottom));inset-inline: auto max(1.25rem,var(--safe-area-right));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: max(1.25rem,var(--safe-area-top)) auto}.ui-toast{align-items: flex-start;animation: uiToastIn var(--duration-base) var(--ease-spring) both;transition: opacity var(--duration-base) var(--ease-out),transform var(--duration-base) var(--ease-out);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.is-leaving{animation: none;opacity: 0;transform: translateY(6px) scale(0.98)}.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;print-color-adjust: exact}.ui-toast__title{color: var(--text);font-family: var(--sans);font-size: var(--text-2xs);font-weight: 700;letter-spacing: 0;margin: 0;text-transform: none}.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}@media (pointer: coarse){.ui-alert__close,.ui-toast__close{display: inline-grid;place-items: center;min-block-size: var(--tap-target);min-inline-size: var(--tap-target)}.ui-alert__close{padding: 0}}@media (hover: hover){.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-toast--info::before{background: var(--info)}@media (forced-colors: active){.ui-alert::before,.ui-toast::before,.ui-body-state--error::before,.ui-body-state--stale::before{background: none;border-radius: 0;content: var(--tone-glyph,'\2022');block-size: auto;inline-size: auto;margin-block-start: 0;font-family: var(--sans);font-weight: 700;line-height: 1.1}.ui-alert--accent,.ui-toast--accent{--tone-glyph: '\25C6'}.ui-alert--success,.ui-toast--success{--tone-glyph: '\2713'}.ui-alert--warning,.ui-toast--warning,.ui-body-state--stale{--tone-glyph: '\0021'}.ui-alert--danger,.ui-toast--danger,.ui-body-state--error{--tone-glyph: '\2715'}.ui-alert--info,.ui-toast--info{--tone-glyph: '\69'}}.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(--sans);font-size: var(--text-2xs);inset-inline-start: 50%;letter-spacing: 0;opacity: 0;padding: 0.34rem 0.5rem;pointer-events: none;position: absolute;text-transform: none;transform: translate(-50%,4px);transition: opacity 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)}.ui-tooltip:dir(rtl) .ui-tooltip__bubble{transform: translate(50%,4px)}.ui-tooltip:dir(rtl):hover .ui-tooltip__bubble,.ui-tooltip:dir(rtl):focus-within .ui-tooltip__bubble{transform: translate(50%,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));overflow: auto;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}@media (prefers-reduced-motion: no-preference){.ui-popover{opacity: 0;transform: translateY(-4px) scale(0.98);transition: opacity var(--duration-fast) var(--ease-out),transform var(--duration-fast) var(--ease-out),overlay var(--duration-fast) allow-discrete,display var(--duration-fast) allow-discrete}.ui-popover.is-open,.ui-popover[popover]:popover-open{opacity: 1;transform: none}@starting-style{.ui-popover.is-open,.ui-popover[popover]:popover-open{opacity: 0;transform: translateY(-4px) scale(0.98)}}}.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%;display: block;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;background: repeating-linear-gradient( -45deg,var(--accent) 0,var(--accent) 0.3rem,color-mix(in srgb,var(--accent) 35%,transparent) 0.3rem,color-mix(in srgb,var(--accent) 35%,transparent) 0.6rem );inset-inline-start: 0;inline-size: 100%}.ui-toast{animation: none;transition: none}}.ui-meter{background: var(--panel-soft);border: 1px solid var(--line);border-radius: var(--radius-pill);block-size: 0.5rem;overflow: hidden;inline-size: 100%}.ui-meter__fill{background: var(--text-dim);block-size: 100%;display: block;transition: inline-size var(--duration-base) var(--ease-out);inline-size: calc(clamp(0,var(--value,0),100) * 1%)}.ui-meter--accent .ui-meter__fill{background: var(--accent)}.ui-meter--success .ui-meter__fill{background: var(--success)}.ui-meter--warning .ui-meter__fill{background: var(--warning)}.ui-meter--danger .ui-meter__fill{background: var(--danger)}.ui-meter--info .ui-meter__fill{background: var(--info)}.ui-meter__row{align-items: center;display: grid;gap: var(--space-2xs) var(--space-md);grid-template-columns: minmax(9rem,14rem) 1fr auto;margin-block: var(--space-2xs)}.ui-meter__row .ui-meter{min-inline-size: 8rem}.ui-meter__label{color: var(--text-soft)}.ui-meter__value{color: var(--text);font-family: var(--sans);font-variant-numeric: tabular-nums;text-align: end}@media (max-width: 32rem){.ui-meter__row{grid-template-columns: 1fr}.ui-meter__value{text-align: start}}.ui-steps{counter-reset: ui-step;display: flex;flex-wrap: wrap;gap: var(--space-sm);list-style: none;margin: 0;padding: 0}.ui-steps__item{align-items: center;color: var(--text-dim);counter-increment: ui-step;display: inline-flex;flex: 1 1 auto;font-family: var(--sans);font-size: var(--text-xs);gap: 0.5rem;letter-spacing: 0;min-inline-size: min(100%,max-content);text-transform: none}.ui-steps__item::before{align-items: center;border: 1px solid var(--line-strong);border-radius: 50%;color: var(--text-dim);content: counter(ui-step);display: inline-flex;flex: 0 0 auto;block-size: 1.5rem;inline-size: 1.5rem;justify-content: center}.ui-steps__item:not(:last-child)::after{background: var(--line);block-size: 1px;content: '';flex: 1 1 1.5rem;min-inline-size: 1rem}.ui-steps__item[aria-current='step']{color: var(--text)}.ui-steps__item[aria-current='step']::before{border-color: var(--accent);color: var(--accent-text)}.ui-steps__item--done{color: var(--text-soft)}.ui-steps__item--done::before{background: var(--accent);border-color: var(--accent);color: var(--button-text)}@media print{.ui-progress__bar,.ui-meter__fill{-webkit-print-color-adjust: exact;print-color-adjust: exact}}@media (forced-colors: active){.ui-progress__bar,.ui-meter__fill,.ui-meter--accent .ui-meter__fill,.ui-meter--success .ui-meter__fill,.ui-meter--warning .ui-meter__fill,.ui-meter--danger .ui-meter__fill,.ui-meter--info .ui-meter__fill{background: Highlight;forced-color-adjust: 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]{display: grid;grid-template-rows: auto 1fr auto}dialog.ui-modal{opacity: 0;transform: translateY(6px) scale(0.98);transition: opacity var(--duration-base) var(--ease-spring),transform var(--duration-base) var(--ease-spring),overlay var(--duration-base) allow-discrete,display var(--duration-base) allow-discrete}dialog.ui-modal[open]{opacity: 1;transform: none}@starting-style{dialog.ui-modal[open]{opacity: 0;transform: translateY(6px) scale(0.98)}}dialog.ui-modal::backdrop{opacity: 0;transition: opacity var(--duration-base) var(--ease-out),overlay var(--duration-base) allow-discrete,display var(--duration-base) allow-discrete}dialog.ui-modal[open]::backdrop{opacity: 1}@starting-style{dialog.ui-modal[open]::backdrop{opacity: 0}}html:has(dialog.ui-modal[open]){overflow: hidden}.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(--sans);font-size: var(--text-lg);letter-spacing: 0;margin: 0;text-transform: none}.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(--sans);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);padding-block: var(--safe-area-top) var(--safe-area-bottom);padding-inline-end: var(--safe-area-right);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)}}@media (pointer: coarse){.ui-modal__close{align-items: center;display: inline-flex;justify-content: center;min-block-size: var(--tap-target);min-inline-size: var(--tap-target)}}.ui-lightbox{background: color-mix(in srgb,var(--bg) 92%,#000);border: 0;block-size: 100vh;color: var(--text);max-block-size: 100vh;max-inline-size: 100vw;padding: var(--safe-area-top) var(--safe-area-right) var(--safe-area-bottom) var(--safe-area-left);inline-size: 100vw}.ui-lightbox::backdrop{background: color-mix(in srgb,#000 80%,transparent)}.ui-lightbox[open]{align-content: center;display: grid}.ui-lightbox .ui-carousel{inline-size: 100%;margin: auto;max-inline-size: min(64rem,100vw)}.ui-lightbox .ui-carousel__slide > img{margin-inline: auto;max-block-size: 80vh;max-inline-size: 100%;inline-size: auto;object-fit: contain}.ui-lightbox__close{inset-block-start: var(--space-sm);inset-inline-end: var(--space-sm);position: fixed;z-index: var(--z-raised)}.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}.ui-menu--dropdown{position: absolute;inset-inline-end: 0;inset-block-start: calc(100% + 0.4rem);z-index: var(--z-overlay)}.ui-menu--at-pointer{position: fixed;z-index: var(--z-popover)}.ui-menu__label{color: var(--text-dim);font-family: var(--sans);font-size: var(--text-2xs);letter-spacing: 0;padding: 0.45rem 0.55rem 0.2rem;text-transform: none}.ui-menu__item{font-family: var(--sans);font-size: var(--text-sm);padding: 0.5rem 0.55rem}.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-menu__item:focus-visible{background: var(--bg-accent);color: var(--text)}.ui-menu__item:focus-visible::before{opacity: 1}@media (forced-colors: active){.ui-menu__item:hover,.ui-menu__item:focus-visible{forced-color-adjust: none;background: Highlight;color: HighlightText}.ui-menu__item:hover::before,.ui-menu__item:focus-visible::before{background: HighlightText;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(--sans);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)}@media (forced-colors: active){.ui-combobox__option.is-active,.ui-combobox__option[aria-selected='true']{forced-color-adjust: none;background: Highlight;color: HighlightText}}.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{inline-size: max-content;max-inline-size: calc(100vw - (2 * var(--space-sm)));min-inline-size: min(11rem,calc(100vw - (2 * var(--space-sm))))}.ui-combobox{display: block;inline-size: 100%;min-inline-size: 0}}@media (prefers-reduced-motion: reduce){.ui-modal[open]{animation: none}dialog.ui-modal,dialog.ui-modal::backdrop{transition: none}}@media (prefers-reduced-transparency: reduce){.ui-modal::backdrop{backdrop-filter: none;background: var(--surface-1)}.ui-lightbox::backdrop{background: var(--surface-1)}}@media (forced-colors: active){.ui-modal::backdrop,.ui-lightbox::backdrop{background: color-mix(in srgb,#000 50%,transparent);forced-color-adjust: 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(--sans);font-size: var(--text-xs);gap: 0.4rem;letter-spacing: 0;margin-block-end: -1px;padding: 0.6rem 0.85rem;text-transform: none;transition: color var(--duration-fast) var(--ease-standard),border-color var(--duration-fast) var(--ease-standard)}@media (pointer: coarse){.ui-tab{min-block-size: var(--tap-target)}}.ui-tab.is-active{border-block-end-color: var(--accent);color: var(--accent-text)}@media (forced-colors: active){.ui-tab.is-active{border-block-end-color: Highlight;color: Highlight}}.ui-tab:focus-visible{outline: var(--focus-ring-width) solid var(--focus-ring);outline-offset: calc(-1.5 * var(--focus-ring-offset))}.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(--sans);font-size: var(--text-sm);gap: 0.6rem;letter-spacing: 0;list-style: none;padding: 0.85rem 0.2rem;text-transform: none}.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}@supports selector(::details-content){@media (prefers-reduced-motion: no-preference){.ui-accordion{interpolate-size: allow-keywords}.ui-accordion__item::details-content{block-size: 0;overflow: hidden;transition: block-size var(--duration-base) var(--ease-out),content-visibility var(--duration-base) allow-discrete}.ui-accordion__item[open]::details-content{block-size: auto}}}.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(--sans);font-size: var(--text-xs);letter-spacing: 0;padding: 0.42rem 0.8rem;text-align: center;text-transform: none;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: var(--focus-ring-width) solid var(--focus-ring);outline-offset: calc(-1 * var(--focus-ring-offset))}@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(--sans);font-size: var(--text-2xs);gap: 0.5rem;letter-spacing: 0;list-style: none;margin: 0;padding: 0;text-transform: none}.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]:not([aria-current='false']){color: var(--text)}.ui-breadcrumb__item a{color: inherit}@media (hover: hover){.ui-breadcrumb__item a:hover{color: var(--accent-text)}}@media (pointer: coarse){.ui-breadcrumb__item a{align-items: center;display: inline-flex;justify-content: center;min-block-size: var(--tap-target-min);min-inline-size: var(--tap-target-min)}}.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(--sans);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,.ui-pagination__item[aria-current]:not([aria-current='false']){border-color: var(--accent);color: var(--accent-text)}.ui-pagination__item[aria-disabled='true'],.ui-pagination__item:disabled{cursor: not-allowed;opacity: 0.4;pointer-events: none}@media (hover: hover){.ui-pagination__item:not( .is-active,[aria-current]:not([aria-current='false']),[aria-disabled='true'],:disabled ):hover{border-color: var(--line-strong);color: var(--text)}}@media (pointer: coarse){.ui-pagination__item{min-block-size: var(--tap-target);min-inline-size: var(--tap-target)}}.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(--sans);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: none;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-carousel{display: grid;gap: var(--space-sm)}.ui-carousel__stage{position: relative}.ui-carousel__viewport{display: flex;overflow-x: auto;scroll-behavior: smooth;scroll-snap-type: x mandatory;scrollbar-width: none}.ui-carousel__viewport::-webkit-scrollbar{display: none}.ui-carousel__viewport:focus-visible{outline: var(--focus-ring-width) solid var(--focus-ring);outline-offset: calc(-1 * var(--focus-ring-offset))}.ui-carousel__slide{flex: 0 0 100%;scroll-snap-align: center}.ui-carousel__slide > :is(img,picture,.ui-ratio){display: block;inline-size: 100%;object-fit: cover}.ui-carousel__prev,.ui-carousel__next{align-items: center;background: color-mix(in srgb,var(--panel-strong) 80%,transparent);border: 1px solid var(--line-strong);border-radius: var(--radius-pill);color: var(--text);cursor: pointer;display: inline-flex;block-size: 2.2rem;inline-size: 2.2rem;inset-block-start: 50%;justify-content: center;position: absolute;transform: translateY(-50%);z-index: var(--z-raised)}.ui-carousel__prev{inset-inline-start: var(--space-xs)}.ui-carousel__next{inset-inline-end: var(--space-xs)}.ui-carousel__prev::before,.ui-carousel__next::before{block-size: 0.5rem;border-block-start: 1.5px solid currentcolor;border-inline-end: 1.5px solid currentcolor;content: '';inline-size: 0.5rem}.ui-carousel__prev::before{margin-inline-start: 0.2rem;transform: rotate(-135deg)}.ui-carousel__next::before{margin-inline-end: 0.2rem;transform: rotate(45deg)}[dir='rtl'] .ui-carousel__prev::before{transform: rotate(45deg)}[dir='rtl'] .ui-carousel__next::before{transform: rotate(-135deg)}.ui-carousel__prev:disabled,.ui-carousel__next:disabled{cursor: not-allowed;opacity: 0.35}.ui-carousel__prev:focus-visible,.ui-carousel__next:focus-visible{outline: var(--focus-ring-width) solid var(--focus-ring);outline-offset: var(--focus-ring-offset)}.ui-carousel__status{background: color-mix(in srgb,var(--panel-strong) 75%,transparent);border-radius: var(--radius-pill);color: var(--text);font-family: var(--sans);font-size: var(--text-2xs);inset-block-end: var(--space-xs);inset-inline-start: var(--space-xs);letter-spacing: 0;padding: 0.2rem 0.5rem;position: absolute}@media (prefers-reduced-transparency: reduce){.ui-carousel__prev,.ui-carousel__next,.ui-carousel__status{background: var(--surface-3)}}.ui-carousel__thumbs{display: flex;gap: 0.4rem;list-style: none;margin: 0;overflow-x: auto;padding: 0;scroll-behavior: smooth;scrollbar-width: none}.ui-carousel__thumbs::-webkit-scrollbar{display: none}.ui-carousel__thumb{background: transparent;border: 1px solid var(--line);border-radius: var(--radius-sm);cursor: pointer;flex: 0 0 auto;block-size: 3rem;inline-size: 4rem;overflow: hidden;padding: 0}.ui-carousel__thumb > img{block-size: 100%;inline-size: 100%;object-fit: cover}.ui-carousel__thumb[aria-current='true']{border-color: var(--accent)}.ui-carousel__thumb:focus-visible{outline: var(--focus-ring-width) solid var(--focus-ring);outline-offset: var(--focus-ring-offset)}@media (prefers-reduced-motion: reduce){.ui-carousel__viewport,.ui-carousel__thumbs{scroll-behavior: auto}}}
|
|
1
|
+
@layer bronto{:root{--radius-xl: 8px;--radius-lg: 6px;--radius-md: 4px;--radius-sm: 2px;--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;--space-0-5: 0.125rem;--space-0-75: 0.1875rem;--space-1-5: 0.375rem;--space-2-5: 0.625rem;--tap-target: max(44px,2.9rem);--tap-target-min: max(24px,1.6rem);--safe-area-top: env(safe-area-inset-top,0px);--safe-area-right: env(safe-area-inset-right,0px);--safe-area-bottom: env(safe-area-inset-bottom,0px);--safe-area-left: env(safe-area-inset-left,0px);--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;--dot-font: 'Doto',var(--mono);--display: var(--dot-font);--display-weight: 700;--display-weight-strong: 800;--text-2xs: 0.75rem;--text-xs: 0.8125rem;--text-sm: 0.875rem;--text-base: 1rem;--text-lg: 1.125rem;--text-xl: 1.5rem;--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;--z-canvas: var(--z-base);--z-chrome: var(--z-sticky);--z-panel: 25;--z-modal: var(--z-overlay);--z-menu: var(--z-popover);--z-tooltip: 70;--z-navigation: 80;--ui-zoom: 1;--ui-px: 1px;--hairline: 1px;--focus-ring-width: 2px;--focus-ring-offset: 2px;--accent-1: color-mix(in oklch,var(--accent) 8%,var(--accent-ramp-end));--accent-2: color-mix(in oklch,var(--accent) 16%,var(--accent-ramp-end));--accent-3: color-mix(in oklch,var(--accent) 32%,var(--accent-ramp-end));--accent-4: color-mix(in oklch,var(--accent) 60%,var(--accent-ramp-end));--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);--bronto-color-info: var(--info);--surface: var(--panel);--surface-raised: var(--panel-strong);--surface-muted: var(--panel-soft);--border: var(--line);--border-strong: var(--line-strong);--edge: var(--text-dim)}: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-ramp-end: #ffffff;--accent-strong: color-mix(in srgb,var(--accent) 83%,#000);--accent-text: var(--accent-strong);--on-accent: var(--button-text);--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);--danger: #c01622;--danger-soft: rgb(192,22,34,0.1);--info: #1f63c4;--info-soft: rgb(31,99,196,0.12);--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: #121212;--bg-elevated: #181818;--bg-accent: color-mix(in srgb,var(--accent) 8%,transparent);--panel: #1c1c1c;--panel-strong: #222222;--panel-soft: #242424;--line: #383838;--line-strong: #555555;--text: #e6e6e6;--text-soft: #c8c8c8;--text-dim: #a0a0a0;--accent: #ff3b41;--accent-ramp-end: #000000;--accent-strong: color-mix(in srgb,var(--accent) 80%,#fff);--accent-text: var(--accent-strong);--on-accent: var(--button-text);--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);--danger: #ff4d54;--danger-soft: rgb(255,77,84,0.15);--info: #6fb0e6;--info-soft: rgb(111,176,230,0.14);--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: #121212;--bg-elevated: #181818;--bg-accent: color-mix(in srgb,var(--accent) 8%,transparent);--panel: #1c1c1c;--panel-strong: #222222;--panel-soft: #242424;--line: #383838;--line-strong: #555555;--text: #e6e6e6;--text-soft: #c8c8c8;--text-dim: #a0a0a0;--accent: #ff3b41;--accent-ramp-end: #000000;--accent-strong: color-mix(in srgb,var(--accent) 80%,#fff);--accent-text: var(--accent-strong);--on-accent: var(--button-text);--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);--danger: #ff4d54;--danger-soft: rgb(255,77,84,0.15);--info: #6fb0e6;--info-soft: rgb(111,176,230,0.14);--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-0-5: 0.1rem;--space-0-75: 0.15rem;--space-1-5: 0.3rem;--space-2-5: 0.5rem;--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-0-5: 0.15rem;--space-0-75: 0.225rem;--space-1-5: 0.45rem;--space-2-5: 0.75rem;--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-ui-zoom]{--ui-px: calc(1px / max(var(--ui-zoom,1),0.15));--hairline: var(--ui-px);--focus-ring-width: calc(2 * var(--ui-px));--focus-ring-offset: calc(2 * var(--ui-px))}[data-contrast='high'],:root[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:root{--line: var(--line-strong);--text-dim: var(--text-soft);--focus-ring: var(--accent);--shadow-raised: 0 0 0 1px var(--text)}}:root[data-theme='dark'][data-surface='oled']{--bg: #000000;--bg-elevated: #0a0a0a;--panel: #101010;--panel-strong: #161616;--panel-soft: #1a1a1a}@media (prefers-color-scheme: dark){:root:not([data-theme='light'])[data-surface='oled']{--bg: #000000;--bg-elevated: #0a0a0a;--panel: #101010;--panel-strong: #161616;--panel-soft: #1a1a1a}}@media print{:root:root:root:root{color-scheme: light;--text: #111;--text-soft: #2a2a2a;--text-dim: #555;--bg: #fff;--bg-elevated: #fff;--panel: #fff;--panel-strong: #fff;--panel-soft: #f7f7f7;--line: #d9d9d9;--line-strong: #b3b3b3;--success: #2f7d4f;--success-soft: rgb(47,125,79,0.12);--danger: #c01622;--danger-soft: rgb(192,22,34,0.1);--warning: #806414;--warning-soft: rgb(128,100,20,0.13);--info: #1f63c4;--info-soft: rgb(31,99,196,0.12);--accent: #d71921;--bg-accent: color-mix(in srgb,var(--accent) 6%,transparent);--accent-ramp-end: #ffffff;--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);--button-text: #ffffff;--on-accent: var(--button-text);--field-dot: rgb(17,17,17,0.16);--field-dot-hot: rgb(17,17,17,0.4);--field-dot-accent: color-mix(in srgb,var(--accent) 78%,transparent);--focus-ring: var(--accent);--code-bg: rgb(17,17,17,0.05)}}@font-face{font-family: Doto;font-style: normal;font-weight: 400;font-display: swap;src: url('../../fonts/doto-400.woff2') format('woff2')}@font-face{font-family: Doto;font-style: normal;font-weight: 500;font-display: swap;src: url('../../fonts/doto-500.woff2') format('woff2')}@font-face{font-family: Doto;font-style: normal;font-weight: 600;font-display: swap;src: url('../../fonts/doto-600.woff2') format('woff2')}@font-face{font-family: Doto;font-style: normal;font-weight: 700;font-display: swap;src: url('../../fonts/doto-700.woff2') format('woff2')}@font-face{font-family: Doto;font-style: normal;font-weight: 800;font-display: swap;src: url('../../fonts/doto-800.woff2') format('woff2')}@font-face{font-family: Doto;font-style: normal;font-weight: 900;font-display: swap;src: url('../../fonts/doto-900.woff2') format('woff2')}@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: 1rem;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: 100dvh;position: relative}:root{--scroll-offset: 6rem}main [id]{scroll-margin-block-start: var(--scroll-offset)}::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(--sans);font-weight: 650;letter-spacing: -0.02em;line-height: 1.2;margin: 0}h1{font-size: clamp(2rem,4vw,3rem)}h2{font-size: clamp(1.5rem,3vw,2rem)}h3{font-size: 1.25rem}h4{font-size: 1rem}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: var(--focus-ring-width) solid var(--focus-ring);outline-offset: var(--focus-ring-offset)}.ui-muted{color: var(--text-dim)}.ui-mono{font-family: var(--mono)}.ui-display{font-family: var(--display);font-weight: var(--display-weight);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}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 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 uiScrollReveal{0%{opacity: 0;transform: translateY(10px)}35%{opacity: 1}100%{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)}}@keyframes uiScrollGrow{to{transform: scaleX(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(min(var(--i,0),6) * 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) and (scripting: enabled){.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}.ui-scroll-progress{background: var(--accent);block-size: 3px;inset-block-start: 0;inset-inline: 0;position: fixed;transform: scaleX(0);transform-origin: 0 50%;z-index: var(--z-overlay)}[dir='rtl'] .ui-scroll-progress{transform-origin: 100% 50%}@media (forced-colors: active){.ui-spinner{border-color: CanvasText;border-block-start-color: Highlight}.ui-scroll-progress{background: Highlight}.ui-skeleton{border: 1px solid CanvasText}}@supports (animation-timeline: scroll()){@media (prefers-reduced-motion: no-preference){.ui-scroll-progress{animation: uiScrollGrow linear;animation-timeline: scroll(root block)}}}@supports (animation-timeline: view()){@media (prefers-reduced-motion: no-preference){.ui-scroll-reveal{animation: uiScrollReveal linear both;animation-timeline: view();animation-range: entry 0% entry 100%}}}.ui-vt{view-transition-name: var(--ui-vt-name,none)}@media (prefers-reduced-motion: no-preference){::view-transition-old(root),::view-transition-new(root){animation-duration: var(--duration-base);animation-timing-function: var(--ease-standard)}}@media (prefers-reduced-motion: reduce){::view-transition-group(*),::view-transition-old(*),::view-transition-new(*){animation: none !important}}@media (prefers-reduced-motion: reduce){html{scroll-behavior: auto}*,*::before,*::after{animation-duration: 0.01ms !important;animation-iteration-count: 1 !important;animation-delay: 0s !important;transition-duration: 0.01ms !important}.ui-skeleton{animation: none;background: var(--panel-soft);background-size: auto}.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),var(--dotmatrix-dot,minmax(0,1fr)))}.ui-dotmatrix__cell{aspect-ratio: 1;background: var(--field-dot);border-radius: var(--dotmatrix-dot-radius,50%)}.ui-dotmatrix__cell--hot{background: var(--field-dot-hot);box-shadow: 0 0 var(--dotmatrix-glow,0) var(--field-dot-hot)}.ui-dotmatrix__cell--accent{background: var(--field-dot-accent);box-shadow: 0 0 var(--dotmatrix-glow,0) var(--field-dot-accent)}.ui-dotmatrix--reveal .ui-dotmatrix__cell{animation: dotmatrixCellOn var(--duration-base) var(--ease-out) both;animation-delay: calc(var(--i,0) * var(--dotmatrix-reveal-step,3ms))}@keyframes dotmatrixCellOn{from{opacity: 0;transform: scale(0.35)}}.ui-dotmatrix--pulse{animation: dotmatrixPulse 1.8s var(--ease-standard) infinite}@keyframes dotmatrixPulse{50%{opacity: var(--dotmatrix-pulse-min,0.55);transform: scale(0.94)}}.ui-icon{display: inline-block;flex: 0 0 auto;inline-size: var(--icon-size,1em);block-size: var(--icon-size,1em);background: currentcolor;vertical-align: -0.125em;-webkit-mask: var(--icon-mask) center / contain no-repeat;mask: var(--icon-mask) center / contain no-repeat}.ui-dot{--ui-dot-color: var(--text-dim);background: var(--ui-dot-color);border-radius: 50%;display: inline-block;flex: 0 0 auto;block-size: 0.55rem;inline-size: 0.55rem}.ui-dot--accent{--ui-dot-color: var(--accent)}.ui-dot--success{--ui-dot-color: var(--success)}.ui-dot--warning{--ui-dot-color: var(--warning)}.ui-dot--danger{--ui-dot-color: var(--danger)}.ui-dot--info{--ui-dot-color: var(--info)}.ui-dot--live{box-shadow: 0 0 0 0 color-mix(in srgb,var(--ui-dot-color) 70%,transparent);position: relative}.ui-dot--live:not( .ui-dot--accent,.ui-dot--success,.ui-dot--warning,.ui-dot--danger,.ui-dot--info ){--ui-dot-color: var(--success)}.ui-dot--live::after{animation: pulseRing 1.8s var(--ease-out) infinite;border: 1px solid var(--ui-dot-color);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 i:nth-child(n + 9){display: none}.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: var(--radius-sm);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-waffle{display: grid;gap: var(--waffle-gap,0.18em);grid-template-columns: repeat(var(--waffle-cols,10),1fr);inline-size: var(--waffle-size,7em)}.ui-waffle i{aspect-ratio: 1;background: var(--field-dot);border-radius: var(--dotmatrix-dot-radius,50%)}.ui-waffle i.is-on{background: var(--field-dot-accent);box-shadow: 0 0 var(--dotmatrix-glow,0) var(--field-dot-accent)}.ui-activity{display: grid;gap: var(--activity-gap,0.18em);grid-auto-columns: var(--activity-cell,0.82em);grid-auto-flow: column;grid-template-rows: repeat(var(--activity-rows,7),1fr)}.ui-activity i{aspect-ratio: 1;background: var(--field-dot);border-radius: var(--dotmatrix-dot-radius,2px)}.ui-activity i[data-level='1']{background: color-mix(in oklab,var(--field-dot-accent) 30%,var(--field-dot))}.ui-activity i[data-level='2']{background: color-mix(in oklab,var(--field-dot-accent) 55%,var(--field-dot))}.ui-activity i[data-level='3']{background: color-mix(in oklab,var(--field-dot-accent) 78%,var(--field-dot))}.ui-activity i[data-level='4']{background: var(--field-dot-accent)}.ui-level{block-size: var(--level-height,4em);display: flex;flex-direction: column-reverse;gap: var(--level-gap,2px);inline-size: var(--level-size,0.7em)}.ui-level i{background: var(--field-dot);border-radius: var(--radius-sm);flex: 1}.ui-level i.is-on{background: var(--accent);box-shadow: 0 0 var(--dotmatrix-glow,0) var(--accent)}.ui-level--warn i.is-on{background: var(--warning)}.ui-level--danger i.is-on{background: var(--danger)}.ui-dotgauge{--_v: var(--v,0);--_sweep: var(--gauge-sweep,270deg);aspect-ratio: 1;background: conic-gradient( from var(--gauge-from,135deg),var(--field-dot-accent) calc(var(--_v) * var(--_sweep)),var(--field-dot) calc(var(--_v) * var(--_sweep)) var(--_sweep),transparent var(--_sweep) );border-radius: 50%;inline-size: var(--gauge-size,5em);-webkit-mask: radial-gradient(closest-side,transparent 58%,#000 59%),radial-gradient(circle,#000 34%,transparent 36%) 0 0 / var(--gauge-dot,0.5em) var(--gauge-dot,0.5em);-webkit-mask-composite: source-in;mask: radial-gradient(closest-side,transparent 58%,#000 59%),radial-gradient(circle,#000 34%,transparent 36%) 0 0 / var(--gauge-dot,0.5em) var(--gauge-dot,0.5em);mask-composite: intersect}.ui-readout{align-items: flex-end;display: inline-flex;gap: var(--readout-gap,0.12em)}.ui-readout__spacer{display: inline-block;inline-size: var(--readout-space,0.5em)}.ui-halftone{-webkit-mask: radial-gradient(circle,#000 var(--halftone-dot,38%),transparent calc(var(--halftone-dot,38%) + 1%)) 0 0 / var(--halftone-gap,0.5em) var(--halftone-gap,0.5em);mask: radial-gradient(circle,#000 var(--halftone-dot,38%),transparent calc(var(--halftone-dot,38%) + 1%)) 0 0 / var(--halftone-gap,0.5em) var(--halftone-gap,0.5em)}.ui-dotfit{container: dotfit / inline-size}@container dotfit (inline-size < 18rem){.ui-dotfit .ui-dotgrid{--dot-gap: 8px}.ui-dotfit .ui-activity{--activity-cell: 0.6em}.ui-dotfit .ui-waffle{--waffle-size: 5em}}@media (scripting: enabled){.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,.ui-dotmatrix--reveal .ui-dotmatrix__cell,.ui-dotmatrix--pulse{animation: none}.ui-dotspinner i{opacity: 0.6}.ui-matrix{clip-path: none}}@media (forced-colors: active){.ui-dot--success{--ui-dot-color: LinkText;forced-color-adjust: none}.ui-dot--warning{--ui-dot-color: Mark;forced-color-adjust: none}.ui-dot--danger{--ui-dot-color: Highlight;forced-color-adjust: none}.ui-dot--info{--ui-dot-color: ButtonText;forced-color-adjust: none}.ui-dot--accent{--ui-dot-color: LinkText;forced-color-adjust: none}.ui-dot--live:not( .ui-dot--accent,.ui-dot--success,.ui-dot--warning,.ui-dot--danger,.ui-dot--info ){--ui-dot-color: LinkText;forced-color-adjust: none}.ui-icon{forced-color-adjust: none;background: CanvasText}.ui-dotmatrix__cell--hot{forced-color-adjust: none;background: Highlight}.ui-dotmatrix__cell--accent{forced-color-adjust: none;background: LinkText}.ui-waffle i.is-on,.ui-level i.is-on{forced-color-adjust: none;background: LinkText}.ui-level--warn i.is-on{background: Mark}.ui-level--danger i.is-on{background: Highlight}.ui-activity i[data-level='1'],.ui-activity i[data-level='2'],.ui-activity i[data-level='3'],.ui-activity i[data-level='4']{forced-color-adjust: none;background: CanvasText}.ui-dotgauge{forced-color-adjust: none}}@media print{.ui-dotmatrix__cell,.ui-dotbar i,.ui-dot,.ui-icon,.ui-waffle i,.ui-activity i,.ui-level i,.ui-dotgauge{-webkit-print-color-adjust: exact;print-color-adjust: exact}}.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{min-inline-size: 0;color: var(--text-soft);font-size: var(--text-base);line-height: 1.7;overflow-wrap: break-word;--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(--sans);line-height: 1.12;text-wrap: balance}.ui-prose h1{font-size: var(--text-xl);letter-spacing: 0;text-transform: none}.ui-prose h2{font-size: var(--text-lg);letter-spacing: 0;padding-block-end: 0.3rem;border-block-end: 1px solid var(--line);text-transform: none}.ui-prose h3{font-size: var(--text-lg)}.ui-prose :is(h4,h5,h6){font-size: var(--text-base);letter-spacing: 0;text-transform: none}.ui-prose :is(h5,h6){color: var(--text-dim)}.ui-prose :is(h1,h2,h3,h4,h5,h6)[id]{scroll-margin-block-start: var(--scroll-offset)}.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:not(.ui-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(--sans);font-size: var(--text-2xs);font-weight: 700;letter-spacing: 0;text-transform: none}.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(--sans);font-size: var(--text-2xs);letter-spacing: 0;text-transform: none}.ui-prose table{border: 1px solid var(--line);border-collapse: collapse;border-radius: var(--radius-md);display: block;font-family: var(--sans);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: 0;text-transform: none}.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-prose--blocks{--prose-measure: none;--prose-block: 3px;--prose-heading-lead: 18px;--prose-list-column: 24px;color: var(--text);line-height: 1.5}.ui-prose--blocks > *,.ui-prose--blocks > * + *,.ui-prose--blocks > * + :is(h1,h2,h3,h4,h5,h6),.ui-prose--blocks li,.ui-prose--blocks li + li,.ui-prose--blocks li > *,.ui-prose--blocks :is(ul,ol) :is(ul,ol),.ui-prose--blocks blockquote > *,.ui-prose--blocks blockquote > * + *{margin-block: 0}.ui-prose--blocks > :not(ul,ol),.ui-prose--blocks li{padding-block: var(--prose-block)}.ui-prose--blocks li:has(> :is(ul,ol)){padding-block-end: 0}.ui-prose--blocks li > :is(ul,ol){padding-block-start: var(--prose-block)}.ui-prose--blocks :is(h1,h2,h3,h4,h5,h6){padding-block: var(--prose-heading-lead) var(--prose-block);border: 0;font-size: 1em;font-weight: 600;line-height: 1.25}.ui-prose--blocks h1{font-size: 1.6em}.ui-prose--blocks h2{font-size: 1.3em}.ui-prose--blocks h3{font-size: 1.15em}.ui-prose--blocks :is(ul,ol){padding-inline-start: var(--prose-list-column)}.ui-prose--blocks ul{list-style: disc}.ui-prose--blocks ul ul{list-style: circle}.ui-prose--blocks ul ul ul{list-style: square}.ui-prose--blocks li::marker{color: inherit}.ui-prose--blocks li:has(> input[type='checkbox'],> p > input[type='checkbox']){margin-inline-start: calc(-1 * var(--prose-list-column));padding-block: 10px;list-style: none}.ui-prose--blocks :is(li,li > p):has(> input[type='checkbox']){display: flex;align-items: flex-start}.ui-prose--blocks :is(li,li > p) > input[type='checkbox']{flex: none;inline-size: 20px;block-size: 20px;margin: 2px 6px 0}@media (pointer: coarse){.ui-prose--blocks li:has(> input[type='checkbox'],> p > input[type='checkbox']){padding-block: 16px}.ui-prose--blocks :is(li,li > p) > input[type='checkbox']{margin-inline: 12px}}.ui-prose--blocks blockquote{margin-inline: 0}.ui-prose--blocks blockquote > *{line-height: inherit}.ui-quote{color: var(--text);display: grid;font-family: var(--sans);font-size: var(--text-xl);font-weight: var(--display-weight);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(--sans);font-size: var(--text-2xs);font-style: normal;letter-spacing: 0;text-transform: none}.ui-stack{min-inline-size: 0;grid-template-columns: minmax(0,1fr);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 > :first-child{block-size: 100%;inline-size: 100%;object-fit: cover}.ui-cq{container: bronto / inline-size}@container bronto (max-inline-size: 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(min(100%,11rem),1fr))}@container bronto (max-inline-size: 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;min-inline-size: 0;padding: var(--space-md)}.ui-stat__label,.ui-app-metric__label{color: var(--text-dim);font-family: var(--sans);font-size: var(--text-2xs);letter-spacing: 0;text-transform: none}.ui-stat__value,.ui-app-metric__value{color: var(--text);font-family: var(--sans);font-size: 1.9rem;font-variant-numeric: tabular-nums;font-weight: var(--display-weight-strong);letter-spacing: 0;line-height: 1.05;overflow-wrap: anywhere}.ui-stat__delta,.ui-app-metric__delta{font-family: var(--sans);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-stat__delta.is-pos::before,.ui-app-metric__delta.is-pos::before{content: '▲ ';font-size: 0.85em}.ui-stat__delta.is-neg::before,.ui-app-metric__delta.is-neg::before{content: '▼ ';font-size: 0.85em}.ui-num{display: inline-block;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-delta{align-items: baseline;color: var(--text-soft);display: inline-flex;font-variant-numeric: tabular-nums;gap: 0.2em}.ui-delta::before{font-size: 0.85em}.ui-delta--up{color: var(--success)}.ui-delta--up::before{content: '▲'}.ui-delta--down{color: var(--danger)}.ui-delta--down::before{content: '▼'}.ui-delta--flat{color: var(--text-dim)}.ui-delta--flat::before{content: '—'}.ui-delta--invert.ui-delta--up{color: var(--danger)}.ui-delta--invert.ui-delta--down{color: var(--success)}.ui-eyebrow{color: var(--accent-text);font-family: var(--sans);font-size: var(--text-xs);font-weight: 700;letter-spacing: 0;margin: 0;text-transform: none}.ui-eyebrow--muted{color: var(--text-dim)}.ui-eyebrow--sm{font-size: var(--text-2xs)}.ui-eyebrow--caps{letter-spacing: var(--tracking-wide);text-transform: uppercase}.ui-eyebrow--mono{font-family: var(--mono)}.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(--sans);font-size: var(--text-sm);font-weight: 600;gap: 0.45rem;justify-content: center;letter-spacing: 0;line-height: 1;min-block-size: 2.4rem;min-inline-size: 2.4rem;padding: 0.66rem 1rem;text-transform: none;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--sm{font-size: var(--text-xs);gap: 0.3rem;min-block-size: 1.9rem;min-inline-size: 1.9rem;padding: 0.4rem 0.66rem}.ui-button--lg{font-size: var(--text-base);gap: 0.55rem;min-block-size: 2.9rem;min-inline-size: 2.9rem;padding: 0.85rem 1.4rem}.ui-button--dense{gap: 0.25rem;min-block-size: var(--tap-target-min);min-inline-size: var(--tap-target-min);padding: 0.2rem 0.35rem}.ui-button--dense.ui-button--icon{padding: 0}.ui-button__label{min-inline-size: 0;overflow: hidden;text-overflow: ellipsis;white-space: nowrap}.ui-button--icon .ui-button__label{clip-path: inset(50%);block-size: 1px;overflow: hidden;position: absolute;white-space: nowrap;inline-size: 1px}.ui-button:disabled,.ui-button[aria-disabled='true']{cursor: not-allowed;opacity: 0.45}.ui-button[aria-disabled='true'],.ui-link[aria-disabled='true']{pointer-events: none}.ui-link[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{border-block-start-color: currentcolor}}.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(--sans);font-weight: 700;letter-spacing: 0;text-transform: none}.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}[dir='rtl'] .ui-link--arrow::after,[dir='rtl'] .ui-link--cta::after{transform: rotate(-45deg)}@media (pointer: coarse){.ui-link--arrow,.ui-link--cta{min-block-size: var(--tap-target-min)}}.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(--sans);font-size: var(--text-2xs);gap: 0.36rem;letter-spacing: 0;line-height: 1;min-block-size: 1.7rem;padding: 0.32rem 0.55rem;text-transform: none}.ui-chip--accent{color: var(--text-soft);border-color: var(--accent)}.ui-chip--dense{min-block-size: 1.25rem;padding: 0.15rem 0.4rem}.ui-chip--dense:is(button,a,[role='button']){min-block-size: var(--tap-target-min);min-inline-size: var(--tap-target-min)}@media (pointer: coarse){.ui-chip--dense:is(button,a,[role='button']){min-block-size: var(--tap-target);min-inline-size: var(--tap-target)}}.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(--sans);font-size: var(--text-2xs);font-weight: 700;gap: 0.34rem;letter-spacing: 0;line-height: 1;padding: 0.28rem 0.5rem;text-transform: none}.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--info{background: var(--info-soft);border-color: color-mix(in srgb,var(--info) 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-badge--info.ui-badge--dot::before{background: var(--info)}.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(--sans);font-size: var(--text-2xs);font-weight: 700;letter-spacing: 0;line-height: 1;text-transform: none}.ui-key-value dd{color: var(--text);font-family: var(--sans);margin: 0;min-inline-size: 0;overflow-wrap: anywhere}@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: var(--tap-target);min-inline-size: var(--tap-target)}.ui-button--icon{min-inline-size: var(--tap-target)}}.ui-empty-state,.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-empty-state p,.ui-app-empty-state p{color: var(--text-dim);margin: 0.3rem 0 0}.ui-empty-state__glyph{display: block;font-size: 1.5rem;line-height: 1;opacity: 0.5}.ui-empty-state__lead{color: var(--text);margin: 0}.ui-empty-state__hint{font-size: var(--text-2xs);margin: 0;opacity: 0.8}.ui-empty-state--invite{align-items: center;border: 0;display: flex;flex-direction: column;gap: var(--space-2xs);justify-content: center;min-block-size: 100%;padding: var(--space-sm)}.ui-kbd{align-items: center;background: var(--panel-soft);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);justify-content: center;line-height: 1;min-inline-size: 1.4rem;padding: 0.18rem 0.4rem}.ui-shortcut{align-items: center;display: inline-flex;gap: 0.25rem;vertical-align: middle;white-space: nowrap}.ui-shortcut__sep{color: var(--text-dim);font-family: var(--mono);font-size: var(--text-2xs)}.ui-timeline{display: grid;gap: var(--space-md);list-style: none;margin: 0;padding: 0}.ui-timeline__item{border-inline-start: 1px solid var(--line);display: grid;gap: 0.2rem;padding-inline-start: var(--space-md);position: relative}.ui-timeline__item::before{background: var(--line-strong);border-radius: 50%;block-size: 0.5rem;content: '';inline-size: 0.5rem;inset-block-start: 0.18rem;inset-inline-start: calc(-0.25rem - 0.5px);position: absolute}.ui-timeline__item[aria-current]::before{background: var(--accent)}.ui-timeline__time{color: var(--text-dim);font-family: var(--mono);font-size: var(--text-2xs);letter-spacing: var(--tracking-wide);text-transform: uppercase}.ui-row{align-items: center;background: transparent;border: 0;border-radius: var(--radius-sm);color: var(--text-soft);cursor: pointer;display: flex;font: inherit;gap: 0.5rem;min-inline-size: 0;padding: 0.4rem 0.5rem;text-align: start;inline-size: 100%}.ui-row:not(button,a,[role='button'],[role='option'],[tabindex]){cursor: default}.ui-row__title{flex: 1 1 auto;min-inline-size: 0;overflow: hidden;text-overflow: ellipsis;white-space: nowrap}.ui-row__meta{color: var(--text-dim);flex: none;font-family: var(--mono);font-size: var(--text-2xs)}.ui-row__mark{display: inline-flex;flex: none}.ui-row--stacked{align-items: stretch;flex-direction: column;gap: 0.15rem}.ui-row--stacked .ui-row__title{flex: none}.ui-row--ruled{border-block-end: 1px solid var(--line);border-radius: 0}.ui-row[aria-selected='true'],.ui-row[aria-current]:not([aria-current='false']),.ui-row.is-selected{background: var(--panel-soft);color: var(--text)}@media (hover: hover){.ui-row:is(button,a,[role='button'],[role='option'],[tabindex]):hover{background: var(--bg-accent);color: var(--text)}}.ui-row:focus-visible{background: var(--bg-accent);color: var(--text);outline: var(--focus-ring-width) solid var(--focus-ring);outline-offset: calc(-1 * var(--focus-ring-offset))}@media (pointer: coarse){.ui-row{min-block-size: var(--tap-target)}}@media (forced-colors: active){.ui-row[aria-selected='true'],.ui-row[aria-current]:not([aria-current='false']),.ui-row.is-selected,.ui-row:hover,.ui-row:focus-visible{forced-color-adjust: none;background: Highlight;color: HighlightText}}.ui-field{display: grid;gap: 0.35rem}.ui-label{color: var(--text-dim);font-family: var(--sans);font-size: var(--text-2xs);font-weight: 700;letter-spacing: 0;text-transform: none}.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(--sans);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: var(--focus-ring-width) solid var(--focus-ring);outline-offset: calc(var(--focus-ring-offset) / 2)}.ui-input:disabled,.ui-select:disabled,.ui-textarea:disabled{cursor: not-allowed;opacity: 0.5}.ui-input:read-only:not(:disabled),.ui-textarea:read-only:not(:disabled){background: var(--panel-soft);cursor: default}.ui-range:disabled,.ui-file:disabled,.ui-switch:has(input:disabled),.ui-check:has(input:disabled),.ui-segmented__option:has(input:disabled){cursor: not-allowed;opacity: 0.5}.ui-input:autofill,.ui-select:autofill,.ui-textarea:autofill,.ui-search input:autofill{-webkit-text-fill-color: var(--text);box-shadow: inset 0 0 0 100rem var(--bg-elevated);caret-color: var(--text)}.ui-input[aria-invalid='true'],.ui-select[aria-invalid='true'],.ui-textarea[aria-invalid='true']{border-color: var(--danger)}.ui-check:has(input[aria-invalid='true']) input{outline: 2px solid var(--danger);outline-offset: 1px}.ui-switch:has(input[aria-invalid='true']) .ui-switch__track{border-color: var(--danger)}.ui-segmented:has(input[aria-invalid='true']){border-color: var(--danger)}@media (forced-colors: active){.ui-input[aria-invalid='true'],.ui-select[aria-invalid='true'],.ui-textarea[aria-invalid='true']{border-style: double;border-width: 3px}.ui-check:has(input[aria-invalid='true']) input{outline-width: 3px;outline-style: double}.ui-switch:has(input[aria-invalid='true']) .ui-switch__track,.ui-segmented:has(input[aria-invalid='true']){border-style: double;border-width: 3px}.ui-hint--error::before,.ui-error-summary__title::before{content: '⚠ '}}.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,.ui-input-group > .ui-select:focus-visible{z-index: 1}.ui-input-group__addon{align-items: center;background: var(--panel-soft);border: 1px solid var(--line-strong);color: var(--text-dim);display: flex;font-size: var(--text-sm);padding-inline: var(--space-sm);white-space: nowrap}.ui-input-icon{display: block;position: relative}.ui-input-icon > .ui-input{padding-inline-start: 2.2rem}.ui-input-icon--end > .ui-input{padding-inline: 0.7rem 2.2rem}.ui-input-icon__icon{align-items: center;color: var(--text-dim);display: inline-flex;inset-block-start: 50%;inset-inline-start: 0.7rem;justify-content: center;pointer-events: none;position: absolute;transform: translateY(-50%)}.ui-input-icon--end .ui-input-icon__icon{inset-inline: auto 0.7rem}.ui-input-icon__icon svg{block-size: 1rem;inline-size: 1rem}.ui-input-icon:focus-within .ui-input-icon__icon{color: var(--accent)}.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{margin-inline: 0;accent-color: var(--accent);inline-size: 100%}.ui-range:focus-visible{outline: var(--focus-ring-width) solid var(--focus-ring);outline-offset: calc(2 * var(--focus-ring-offset))}.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(--sans);font-size: var(--text-sm);font-weight: 700;letter-spacing: 0;margin: 0 0 var(--space-xs);text-transform: none}.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:has(input:focus-visible){outline: var(--focus-ring-width) solid var(--focus-ring);outline-offset: calc(var(--focus-ring-offset) / 2)}.ui-search:focus-within::before{background: var(--accent)}.ui-search input{background: transparent;border: 0;color: var(--text);font-family: var(--sans);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: var(--focus-ring-width) solid var(--focus-ring);outline-offset: var(--focus-ring-offset)}@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: var(--tap-target)}.ui-search{min-block-size: var(--tap-target)}.ui-switch,.ui-check{min-block-size: var(--tap-target)}.ui-check input{block-size: 1.15rem;inline-size: 1.15rem}}@property --value{syntax: '<number>';inherits: true;initial-value: 0}.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;print-color-adjust: exact}.ui-alert > *{grid-column: 2}.ui-alert__title{color: var(--text);font-family: var(--sans);font-size: var(--text-2xs);font-weight: 700;letter-spacing: 0;margin: 0;text-transform: none}.ui-alert__body{margin: 0}.ui-alert__close{background: transparent;border: 0;color: var(--text-dim);cursor: pointer;font-family: var(--sans);grid-column: 3;grid-row: 1;line-height: 1;padding: 0.1rem 0.3rem}.ui-alert:has(.ui-alert__close){grid-template-columns: auto 1fr auto}.ui-alert--accent{--alert-tone: var(--accent);border-inline-start-color: var(--accent)}.ui-alert--accent::before{background: var(--accent)}.ui-alert--success{--alert-tone: var(--success);border-inline-start-color: var(--success)}.ui-alert--success::before{background: var(--success)}.ui-alert--warning{--alert-tone: var(--warning);border-inline-start-color: var(--warning)}.ui-alert--warning::before{background: var(--warning)}.ui-alert--danger{--alert-tone: var(--danger);border-inline-start-color: var(--danger)}.ui-alert--danger::before{background: var(--danger)}.ui-alert--info{--alert-tone: var(--info);border-inline-start-color: var(--info)}.ui-alert--info::before{background: var(--info)}.ui-alert--band{background: color-mix(in oklch,var(--alert-tone,var(--text-dim)) 10%,var(--panel));border: 0;border-block-end: 1px solid var(--line);border-radius: 0;font-size: var(--text-2xs);gap: var(--space-1-5);padding: var(--space-1-5) var(--space-sm)}.ui-alert--band::before{block-size: 0.4rem;inline-size: 0.4rem;margin-block-start: 0.3em}.ui-body-state{align-items: center;box-sizing: border-box;color: var(--text-dim);display: flex;flex: 1 1 auto;flex-direction: column;font-size: var(--text-xs);gap: var(--space-2xs);justify-content: center;margin: 0;min-block-size: 100%;padding: var(--space-md);text-align: center;text-wrap: balance}.ui-body-state > *{margin: 0}.ui-body-state--error,.ui-body-state--stale{--body-state-tone: var(--danger);color: var(--text-soft)}.ui-body-state--stale{--body-state-tone: var(--warning)}.ui-body-state--error::before,.ui-body-state--stale::before{background: var(--body-state-tone);border-radius: 50%;block-size: 0.5rem;content: '';inline-size: 0.5rem;print-color-adjust: exact}@container bronto (max-inline-size: 15rem){.ui-body-state{font-size: var(--text-2xs);padding: var(--space-xs)}}@media (hover: hover){.ui-alert__close:hover{color: var(--text)}}.ui-toast-stack{display: grid;gap: 0.5rem;inset-block: auto max(1.25rem,var(--safe-area-bottom));inset-inline: auto max(1.25rem,var(--safe-area-right));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: max(1.25rem,var(--safe-area-top)) auto}.ui-toast{align-items: flex-start;animation: uiToastIn var(--duration-base) var(--ease-spring) both;transition: opacity var(--duration-base) var(--ease-out),transform var(--duration-base) var(--ease-out);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.is-leaving{animation: none;opacity: 0;transform: translateY(6px) scale(0.98)}.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;print-color-adjust: exact}.ui-toast__title{color: var(--text);font-family: var(--sans);font-size: var(--text-2xs);font-weight: 700;letter-spacing: 0;margin: 0;text-transform: none}.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}@media (pointer: coarse){.ui-alert__close,.ui-toast__close{display: inline-grid;place-items: center;min-block-size: var(--tap-target);min-inline-size: var(--tap-target)}.ui-alert__close{padding: 0}}@media (hover: hover){.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-toast--info::before{background: var(--info)}@media (forced-colors: active){.ui-alert::before,.ui-toast::before,.ui-body-state--error::before,.ui-body-state--stale::before{background: none;border-radius: 0;content: var(--tone-glyph,'\2022');block-size: auto;inline-size: auto;margin-block-start: 0;font-family: var(--sans);font-weight: 700;line-height: 1.1}.ui-alert--accent,.ui-toast--accent{--tone-glyph: '\25C6'}.ui-alert--success,.ui-toast--success{--tone-glyph: '\2713'}.ui-alert--warning,.ui-toast--warning,.ui-body-state--stale{--tone-glyph: '\0021'}.ui-alert--danger,.ui-toast--danger,.ui-body-state--error{--tone-glyph: '\2715'}.ui-alert--info,.ui-toast--info{--tone-glyph: '\69'}}.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(--sans);font-size: var(--text-2xs);inset-inline-start: 50%;letter-spacing: 0;opacity: 0;padding: 0.34rem 0.5rem;pointer-events: none;position: absolute;text-transform: none;transform: translate(-50%,4px);transition: opacity 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)}.ui-tooltip:dir(rtl) .ui-tooltip__bubble{transform: translate(50%,4px)}.ui-tooltip:dir(rtl):hover .ui-tooltip__bubble,.ui-tooltip:dir(rtl):focus-within .ui-tooltip__bubble{transform: translate(50%,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));overflow: auto;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}@media (prefers-reduced-motion: no-preference){.ui-popover{opacity: 0;transform: translateY(-4px) scale(0.98);transition: opacity var(--duration-fast) var(--ease-out),transform var(--duration-fast) var(--ease-out),overlay var(--duration-fast) allow-discrete,display var(--duration-fast) allow-discrete}.ui-popover.is-open,.ui-popover[popover]:popover-open{opacity: 1;transform: none}@starting-style{.ui-popover.is-open,.ui-popover[popover]:popover-open{opacity: 0;transform: translateY(-4px) scale(0.98)}}}.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%;display: block;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;background: repeating-linear-gradient( -45deg,var(--accent) 0,var(--accent) 0.3rem,color-mix(in srgb,var(--accent) 35%,transparent) 0.3rem,color-mix(in srgb,var(--accent) 35%,transparent) 0.6rem );inset-inline-start: 0;inline-size: 100%}.ui-toast{animation: none;transition: none}}.ui-meter{background: var(--panel-soft);border: 1px solid var(--line);border-radius: var(--radius-pill);block-size: 0.5rem;overflow: hidden;inline-size: 100%}.ui-meter__fill{background: var(--text-dim);block-size: 100%;display: block;transition: inline-size var(--duration-base) var(--ease-out);inline-size: calc(clamp(0,var(--value,0),100) * 1%)}.ui-meter--accent .ui-meter__fill{background: var(--accent)}.ui-meter--success .ui-meter__fill{background: var(--success)}.ui-meter--warning .ui-meter__fill{background: var(--warning)}.ui-meter--danger .ui-meter__fill{background: var(--danger)}.ui-meter--info .ui-meter__fill{background: var(--info)}.ui-meter__row{align-items: center;display: grid;gap: var(--space-2xs) var(--space-md);grid-template-columns: minmax(9rem,14rem) 1fr auto;margin-block: var(--space-2xs)}.ui-meter__row .ui-meter{min-inline-size: 8rem}.ui-meter__label{color: var(--text-soft)}.ui-meter__value{color: var(--text);font-family: var(--sans);font-variant-numeric: tabular-nums;text-align: end}@media (max-width: 32rem){.ui-meter__row{grid-template-columns: 1fr}.ui-meter__value{text-align: start}}.ui-steps{counter-reset: ui-step;display: flex;flex-wrap: wrap;gap: var(--space-sm);list-style: none;margin: 0;padding: 0}.ui-steps__item{align-items: center;color: var(--text-dim);counter-increment: ui-step;display: inline-flex;flex: 1 1 auto;font-family: var(--sans);font-size: var(--text-xs);gap: 0.5rem;letter-spacing: 0;min-inline-size: min(100%,max-content);text-transform: none}.ui-steps__item::before{align-items: center;border: 1px solid var(--line-strong);border-radius: 50%;color: var(--text-dim);content: counter(ui-step);display: inline-flex;flex: 0 0 auto;block-size: 1.5rem;inline-size: 1.5rem;justify-content: center}.ui-steps__item:not(:last-child)::after{background: var(--line);block-size: 1px;content: '';flex: 1 1 1.5rem;min-inline-size: 1rem}.ui-steps__item[aria-current='step']{color: var(--text)}.ui-steps__item[aria-current='step']::before{border-color: var(--accent);color: var(--accent-text)}.ui-steps__item--done{color: var(--text-soft)}.ui-steps__item--done::before{background: var(--accent);border-color: var(--accent);color: var(--button-text)}@media print{.ui-progress__bar,.ui-meter__fill{-webkit-print-color-adjust: exact;print-color-adjust: exact}}@media (forced-colors: active){.ui-progress__bar,.ui-meter__fill,.ui-meter--accent .ui-meter__fill,.ui-meter--success .ui-meter__fill,.ui-meter--warning .ui-meter__fill,.ui-meter--danger .ui-meter__fill,.ui-meter--info .ui-meter__fill{background: Highlight;forced-color-adjust: 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]{display: grid;grid-template-rows: auto 1fr auto}dialog.ui-modal{opacity: 0;transform: translateY(6px) scale(0.98);transition: opacity var(--duration-base) var(--ease-spring),transform var(--duration-base) var(--ease-spring),overlay var(--duration-base) allow-discrete,display var(--duration-base) allow-discrete}dialog.ui-modal[open]{opacity: 1;transform: none}@starting-style{dialog.ui-modal[open]{opacity: 0;transform: translateY(6px) scale(0.98)}}dialog.ui-modal::backdrop{opacity: 0;transition: opacity var(--duration-base) var(--ease-out),overlay var(--duration-base) allow-discrete,display var(--duration-base) allow-discrete}dialog.ui-modal[open]::backdrop{opacity: 1}@starting-style{dialog.ui-modal[open]::backdrop{opacity: 0}}html:has(dialog.ui-modal[open]){overflow: hidden}.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(--sans);font-size: var(--text-lg);letter-spacing: 0;margin: 0;text-transform: none}.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(--sans);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);padding-block: var(--safe-area-top) var(--safe-area-bottom);padding-inline-end: var(--safe-area-right);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)}}@media (pointer: coarse){.ui-modal__close{align-items: center;display: inline-flex;justify-content: center;min-block-size: var(--tap-target);min-inline-size: var(--tap-target)}}.ui-lightbox{background: color-mix(in srgb,var(--bg) 92%,#000);border: 0;block-size: 100vh;color: var(--text);max-block-size: 100vh;max-inline-size: 100vw;padding: var(--safe-area-top) var(--safe-area-right) var(--safe-area-bottom) var(--safe-area-left);inline-size: 100vw}.ui-lightbox::backdrop{background: color-mix(in srgb,#000 80%,transparent)}.ui-lightbox[open]{align-content: center;display: grid}.ui-lightbox .ui-carousel{inline-size: 100%;margin: auto;max-inline-size: min(64rem,100vw)}.ui-lightbox .ui-carousel__slide > img{margin-inline: auto;max-block-size: 80vh;max-inline-size: 100%;inline-size: auto;object-fit: contain}.ui-lightbox__close{inset-block-start: var(--space-sm);inset-inline-end: var(--space-sm);position: fixed;z-index: var(--z-raised)}.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}.ui-menu--dropdown{position: absolute;inset-inline-end: 0;inset-block-start: calc(100% + 0.4rem);z-index: var(--z-overlay)}.ui-menu--at-pointer{position: fixed;z-index: var(--z-popover)}.ui-menu__label{color: var(--text-dim);font-family: var(--sans);font-size: var(--text-2xs);letter-spacing: 0;padding: 0.45rem 0.55rem 0.2rem;text-transform: none}.ui-menu__item{font-family: var(--sans);font-size: var(--text-sm);padding: 0.5rem 0.55rem}.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-menu__item:focus-visible{background: var(--bg-accent);color: var(--text)}.ui-menu__item:focus-visible::before{opacity: 1}@media (forced-colors: active){.ui-menu__item:hover,.ui-menu__item:focus-visible{forced-color-adjust: none;background: Highlight;color: HighlightText}.ui-menu__item:hover::before,.ui-menu__item:focus-visible::before{background: HighlightText;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(--sans);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)}@media (forced-colors: active){.ui-combobox__option.is-active,.ui-combobox__option[aria-selected='true']{forced-color-adjust: none;background: Highlight;color: HighlightText}}.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{inline-size: max-content;max-inline-size: calc(100vw - (2 * var(--space-sm)));min-inline-size: min(11rem,calc(100vw - (2 * var(--space-sm))))}.ui-combobox{display: block;inline-size: 100%;min-inline-size: 0}}@media (prefers-reduced-motion: reduce){.ui-modal[open]{animation: none}dialog.ui-modal,dialog.ui-modal::backdrop{transition: none}}@media (prefers-reduced-transparency: reduce){.ui-modal::backdrop{backdrop-filter: none;background: var(--surface-1)}.ui-lightbox::backdrop{background: var(--surface-1)}}@media (forced-colors: active){.ui-modal::backdrop,.ui-lightbox::backdrop{background: color-mix(in srgb,#000 50%,transparent);forced-color-adjust: 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(--sans);font-size: var(--text-xs);gap: 0.4rem;letter-spacing: 0;margin-block-end: -1px;padding: 0.6rem 0.85rem;text-transform: none;transition: color var(--duration-fast) var(--ease-standard),border-color var(--duration-fast) var(--ease-standard)}@media (pointer: coarse){.ui-tab{min-block-size: var(--tap-target)}}.ui-tab.is-active{border-block-end-color: var(--accent);color: var(--accent-text)}@media (forced-colors: active){.ui-tab.is-active{border-block-end-color: Highlight;color: Highlight}}.ui-tab:focus-visible{outline: var(--focus-ring-width) solid var(--focus-ring);outline-offset: calc(-1.5 * var(--focus-ring-offset))}.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(--sans);font-size: var(--text-sm);gap: 0.6rem;letter-spacing: 0;list-style: none;padding: 0.85rem 0.2rem;text-transform: none}.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}@supports selector(::details-content){@media (prefers-reduced-motion: no-preference){.ui-accordion{interpolate-size: allow-keywords}.ui-accordion__item::details-content{block-size: 0;overflow: hidden;transition: block-size var(--duration-base) var(--ease-out),content-visibility var(--duration-base) allow-discrete}.ui-accordion__item[open]::details-content{block-size: auto}}}.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(--sans);font-size: var(--text-xs);letter-spacing: 0;padding: 0.42rem 0.8rem;text-align: center;text-transform: none;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: var(--focus-ring-width) solid var(--focus-ring);outline-offset: calc(-1 * var(--focus-ring-offset))}@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(--sans);font-size: var(--text-2xs);gap: 0.5rem;letter-spacing: 0;list-style: none;margin: 0;padding: 0;text-transform: none}.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]:not([aria-current='false']){color: var(--text)}.ui-breadcrumb__item a{color: inherit}@media (hover: hover){.ui-breadcrumb__item a:hover{color: var(--accent-text)}}@media (pointer: coarse){.ui-breadcrumb__item a{align-items: center;display: inline-flex;justify-content: center;min-block-size: var(--tap-target-min);min-inline-size: var(--tap-target-min)}}.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(--sans);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,.ui-pagination__item[aria-current]:not([aria-current='false']){border-color: var(--accent);color: var(--accent-text)}.ui-pagination__item[aria-disabled='true'],.ui-pagination__item:disabled{cursor: not-allowed;opacity: 0.4;pointer-events: none}@media (hover: hover){.ui-pagination__item:not( .is-active,[aria-current]:not([aria-current='false']),[aria-disabled='true'],:disabled ):hover{border-color: var(--line-strong);color: var(--text)}}@media (pointer: coarse){.ui-pagination__item{min-block-size: var(--tap-target);min-inline-size: var(--tap-target)}}.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(--sans);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: none;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-carousel{display: grid;gap: var(--space-sm)}.ui-carousel__stage{position: relative}.ui-carousel__viewport{display: flex;overflow-x: auto;scroll-behavior: smooth;scroll-snap-type: x mandatory;scrollbar-width: none}.ui-carousel__viewport::-webkit-scrollbar{display: none}.ui-carousel__viewport:focus-visible{outline: var(--focus-ring-width) solid var(--focus-ring);outline-offset: calc(-1 * var(--focus-ring-offset))}.ui-carousel__slide{flex: 0 0 100%;scroll-snap-align: center}.ui-carousel__slide > :is(img,picture,.ui-ratio){display: block;inline-size: 100%;object-fit: cover}.ui-carousel__prev,.ui-carousel__next{align-items: center;background: color-mix(in srgb,var(--panel-strong) 80%,transparent);border: 1px solid var(--line-strong);border-radius: var(--radius-pill);color: var(--text);cursor: pointer;display: inline-flex;block-size: 2.2rem;inline-size: 2.2rem;inset-block-start: 50%;justify-content: center;position: absolute;transform: translateY(-50%);z-index: var(--z-raised)}.ui-carousel__prev{inset-inline-start: var(--space-xs)}.ui-carousel__next{inset-inline-end: var(--space-xs)}.ui-carousel__prev::before,.ui-carousel__next::before{block-size: 0.5rem;border-block-start: 1.5px solid currentcolor;border-inline-end: 1.5px solid currentcolor;content: '';inline-size: 0.5rem}.ui-carousel__prev::before{margin-inline-start: 0.2rem;transform: rotate(-135deg)}.ui-carousel__next::before{margin-inline-end: 0.2rem;transform: rotate(45deg)}[dir='rtl'] .ui-carousel__prev::before{transform: rotate(45deg)}[dir='rtl'] .ui-carousel__next::before{transform: rotate(-135deg)}.ui-carousel__prev:disabled,.ui-carousel__next:disabled{cursor: not-allowed;opacity: 0.35}.ui-carousel__prev:focus-visible,.ui-carousel__next:focus-visible{outline: var(--focus-ring-width) solid var(--focus-ring);outline-offset: var(--focus-ring-offset)}.ui-carousel__status{background: color-mix(in srgb,var(--panel-strong) 75%,transparent);border-radius: var(--radius-pill);color: var(--text);font-family: var(--sans);font-size: var(--text-2xs);inset-block-end: var(--space-xs);inset-inline-start: var(--space-xs);letter-spacing: 0;padding: 0.2rem 0.5rem;position: absolute}@media (prefers-reduced-transparency: reduce){.ui-carousel__prev,.ui-carousel__next,.ui-carousel__status{background: var(--surface-3)}}.ui-carousel__thumbs{display: flex;gap: 0.4rem;list-style: none;margin: 0;overflow-x: auto;padding: 0;scroll-behavior: smooth;scrollbar-width: none}.ui-carousel__thumbs::-webkit-scrollbar{display: none}.ui-carousel__thumb{background: transparent;border: 1px solid var(--line);border-radius: var(--radius-sm);cursor: pointer;flex: 0 0 auto;block-size: 3rem;inline-size: 4rem;overflow: hidden;padding: 0}.ui-carousel__thumb > img{block-size: 100%;inline-size: 100%;object-fit: cover}.ui-carousel__thumb[aria-current='true']{border-color: var(--accent)}.ui-carousel__thumb:focus-visible{outline: var(--focus-ring-width) solid var(--focus-ring);outline-offset: var(--focus-ring-offset)}@media (prefers-reduced-motion: reduce){.ui-carousel__viewport,.ui-carousel__thumbs{scroll-behavior: auto}}}
|
package/docs/compositions.md
CHANGED
|
@@ -74,8 +74,8 @@ Use the core stylesheet plus `report-kit.css` for a standalone HTML report.
|
|
|
74
74
|
Use real asset URLs in HTML; package specifiers resolve only in build tools.
|
|
75
75
|
|
|
76
76
|
```html
|
|
77
|
-
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@ponchia/ui@0.
|
|
78
|
-
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@ponchia/ui@0.
|
|
77
|
+
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@ponchia/ui@0.16.0/dist/bronto.css" />
|
|
78
|
+
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@ponchia/ui@0.16.0/dist/css/report-kit.css" />
|
|
79
79
|
<article class="ui-report">
|
|
80
80
|
<header class="ui-report__cover ui-report__cover--compact">
|
|
81
81
|
<h1 class="ui-report__title">Keep the current configuration</h1>
|
package/docs/connectors.md
CHANGED
|
@@ -63,8 +63,10 @@ relationship it depicts is also clear from the content/DOM order.
|
|
|
63
63
|
| `data-end` | `arrow` (default), `dot`, `none`. |
|
|
64
64
|
|
|
65
65
|
Tones: `ui-connector--accent` / `--muted` / `--success` / `--warning` /
|
|
66
|
-
`--danger` / `--info
|
|
67
|
-
|
|
66
|
+
`--danger` / `--info`. By default the line is monochrome, in `--edge`, which
|
|
67
|
+
holds 3:1 against the surface; `--muted` drops to the decorative `--line`
|
|
68
|
+
hairline. `ui-connector--dashed` for a dashed line; `ui-connector--draw`
|
|
69
|
+
strokes it in once (reduced-motion-safe).
|
|
68
70
|
`ui.connector({ tone, dashed, motion })` builds the class string.
|
|
69
71
|
|
|
70
72
|
## Geometry helpers (no DOM)
|
package/docs/contrast.md
CHANGED
|
@@ -65,6 +65,8 @@ Overall: **all contractual pairings meet their floor ✅**.
|
|
|
65
65
|
| `--warning` | `--surface` | Warning indicator vs a card | UI / large (3:1) | 5.60:1 | Lc 77.8 | ✅ pass |
|
|
66
66
|
| `--danger` | `--surface` | Danger indicator vs a card | UI / large (3:1) | 6.21:1 | Lc 78.9 | ✅ pass |
|
|
67
67
|
| `--info` | `--surface` | Info indicator vs a card | UI / large (3:1) | 5.77:1 | Lc 78.3 | ✅ pass |
|
|
68
|
+
| `--edge` | `--bg` | Relationship line vs page background | UI / large (3:1) | 5.09:1 | Lc 71.4 | ✅ pass |
|
|
69
|
+
| `--edge` | `--surface` | Relationship line vs a card | UI / large (3:1) | 5.60:1 | Lc 78.0 | ✅ pass |
|
|
68
70
|
| `--line-strong` | `--surface` | Strong hairline vs a card | Decorative (1.4.11-exempt) | 2.39:1 | Lc 47.1 | ℹ️ not gated |
|
|
69
71
|
|
|
70
72
|
## Dark theme
|
|
@@ -94,6 +96,8 @@ Overall: **all contractual pairings meet their floor ✅**.
|
|
|
94
96
|
| `--warning` | `--surface` | Warning indicator vs a card | UI / large (3:1) | 9.29:1 | Lc 66.6 | ✅ pass |
|
|
95
97
|
| `--danger` | `--surface` | Danger indicator vs a card | UI / large (3:1) | 5.23:1 | Lc 41.5 | ✅ pass |
|
|
96
98
|
| `--info` | `--surface` | Info indicator vs a card | UI / large (3:1) | 7.33:1 | Lc 54.8 | ✅ pass |
|
|
99
|
+
| `--edge` | `--bg` | Relationship line vs page background | UI / large (3:1) | 7.16:1 | Lc 50.3 | ✅ pass |
|
|
100
|
+
| `--edge` | `--surface` | Relationship line vs a card | UI / large (3:1) | 6.52:1 | Lc 49.3 | ✅ pass |
|
|
97
101
|
| `--line-strong` | `--surface` | Strong hairline vs a card | Decorative (1.4.11-exempt) | 2.29:1 | Lc 14.5 | ℹ️ not gated |
|
|
98
102
|
|
|
99
103
|
## Display colorways (skins)
|
|
@@ -134,6 +138,8 @@ palette untouched). Accents are authored in OKLCH; `--accent-text` is the
|
|
|
134
138
|
| `--warning` | `--surface` | Warning indicator vs a card | UI / large (3:1) | 5.60:1 | Lc 77.8 | ✅ pass |
|
|
135
139
|
| `--danger` | `--surface` | Danger indicator vs a card | UI / large (3:1) | 6.21:1 | Lc 78.9 | ✅ pass |
|
|
136
140
|
| `--info` | `--surface` | Info indicator vs a card | UI / large (3:1) | 5.77:1 | Lc 78.3 | ✅ pass |
|
|
141
|
+
| `--edge` | `--bg` | Relationship line vs page background | UI / large (3:1) | 5.07:1 | Lc 71.2 | ✅ pass |
|
|
142
|
+
| `--edge` | `--surface` | Relationship line vs a card | UI / large (3:1) | 5.60:1 | Lc 78.0 | ✅ pass |
|
|
137
143
|
| `--line-strong` | `--surface` | Strong hairline vs a card | Decorative (1.4.11-exempt) | 2.41:1 | Lc 47.4 | ℹ️ not gated |
|
|
138
144
|
|
|
139
145
|
### Amber CRT — dark
|
|
@@ -163,6 +169,8 @@ palette untouched). Accents are authored in OKLCH; `--accent-text` is the
|
|
|
163
169
|
| `--warning` | `--surface` | Warning indicator vs a card | UI / large (3:1) | 9.29:1 | Lc 66.6 | ✅ pass |
|
|
164
170
|
| `--danger` | `--surface` | Danger indicator vs a card | UI / large (3:1) | 5.23:1 | Lc 41.5 | ✅ pass |
|
|
165
171
|
| `--info` | `--surface` | Info indicator vs a card | UI / large (3:1) | 7.33:1 | Lc 54.8 | ✅ pass |
|
|
172
|
+
| `--edge` | `--bg` | Relationship line vs page background | UI / large (3:1) | 7.17:1 | Lc 50.3 | ✅ pass |
|
|
173
|
+
| `--edge` | `--surface` | Relationship line vs a card | UI / large (3:1) | 6.52:1 | Lc 49.3 | ✅ pass |
|
|
166
174
|
| `--line-strong` | `--surface` | Strong hairline vs a card | Decorative (1.4.11-exempt) | 2.28:1 | Lc 14.5 | ℹ️ not gated |
|
|
167
175
|
|
|
168
176
|
### E-ink — light
|
|
@@ -192,6 +200,8 @@ palette untouched). Accents are authored in OKLCH; `--accent-text` is the
|
|
|
192
200
|
| `--warning` | `--surface` | Warning indicator vs a card | UI / large (3:1) | 5.60:1 | Lc 77.8 | ✅ pass |
|
|
193
201
|
| `--danger` | `--surface` | Danger indicator vs a card | UI / large (3:1) | 6.21:1 | Lc 78.9 | ✅ pass |
|
|
194
202
|
| `--info` | `--surface` | Info indicator vs a card | UI / large (3:1) | 5.77:1 | Lc 78.3 | ✅ pass |
|
|
203
|
+
| `--edge` | `--bg` | Relationship line vs page background | UI / large (3:1) | 5.09:1 | Lc 71.4 | ✅ pass |
|
|
204
|
+
| `--edge` | `--surface` | Relationship line vs a card | UI / large (3:1) | 5.60:1 | Lc 78.0 | ✅ pass |
|
|
195
205
|
| `--line-strong` | `--surface` | Strong hairline vs a card | Decorative (1.4.11-exempt) | 2.39:1 | Lc 47.1 | ℹ️ not gated |
|
|
196
206
|
|
|
197
207
|
### E-ink — dark
|
|
@@ -221,6 +231,8 @@ palette untouched). Accents are authored in OKLCH; `--accent-text` is the
|
|
|
221
231
|
| `--warning` | `--surface` | Warning indicator vs a card | UI / large (3:1) | 9.29:1 | Lc 66.6 | ✅ pass |
|
|
222
232
|
| `--danger` | `--surface` | Danger indicator vs a card | UI / large (3:1) | 5.23:1 | Lc 41.5 | ✅ pass |
|
|
223
233
|
| `--info` | `--surface` | Info indicator vs a card | UI / large (3:1) | 7.33:1 | Lc 54.8 | ✅ pass |
|
|
234
|
+
| `--edge` | `--bg` | Relationship line vs page background | UI / large (3:1) | 7.16:1 | Lc 50.3 | ✅ pass |
|
|
235
|
+
| `--edge` | `--surface` | Relationship line vs a card | UI / large (3:1) | 6.52:1 | Lc 49.3 | ✅ pass |
|
|
224
236
|
| `--line-strong` | `--surface` | Strong hairline vs a card | Decorative (1.4.11-exempt) | 2.29:1 | Lc 14.6 | ℹ️ not gated |
|
|
225
237
|
|
|
226
238
|
### Phosphor Green — light
|
|
@@ -250,6 +262,8 @@ palette untouched). Accents are authored in OKLCH; `--accent-text` is the
|
|
|
250
262
|
| `--warning` | `--surface` | Warning indicator vs a card | UI / large (3:1) | 5.60:1 | Lc 77.8 | ✅ pass |
|
|
251
263
|
| `--danger` | `--surface` | Danger indicator vs a card | UI / large (3:1) | 6.21:1 | Lc 78.9 | ✅ pass |
|
|
252
264
|
| `--info` | `--surface` | Info indicator vs a card | UI / large (3:1) | 5.77:1 | Lc 78.3 | ✅ pass |
|
|
265
|
+
| `--edge` | `--bg` | Relationship line vs page background | UI / large (3:1) | 5.12:1 | Lc 71.8 | ✅ pass |
|
|
266
|
+
| `--edge` | `--surface` | Relationship line vs a card | UI / large (3:1) | 5.60:1 | Lc 78.0 | ✅ pass |
|
|
253
267
|
| `--line-strong` | `--surface` | Strong hairline vs a card | Decorative (1.4.11-exempt) | 2.35:1 | Lc 46.4 | ℹ️ not gated |
|
|
254
268
|
|
|
255
269
|
### Phosphor Green — dark
|
|
@@ -279,6 +293,8 @@ palette untouched). Accents are authored in OKLCH; `--accent-text` is the
|
|
|
279
293
|
| `--warning` | `--surface` | Warning indicator vs a card | UI / large (3:1) | 9.29:1 | Lc 66.6 | ✅ pass |
|
|
280
294
|
| `--danger` | `--surface` | Danger indicator vs a card | UI / large (3:1) | 5.23:1 | Lc 41.5 | ✅ pass |
|
|
281
295
|
| `--info` | `--surface` | Info indicator vs a card | UI / large (3:1) | 7.33:1 | Lc 54.8 | ✅ pass |
|
|
296
|
+
| `--edge` | `--bg` | Relationship line vs page background | UI / large (3:1) | 7.14:1 | Lc 50.2 | ✅ pass |
|
|
297
|
+
| `--edge` | `--surface` | Relationship line vs a card | UI / large (3:1) | 6.52:1 | Lc 49.3 | ✅ pass |
|
|
282
298
|
| `--line-strong` | `--surface` | Strong hairline vs a card | Decorative (1.4.11-exempt) | 2.33:1 | Lc 15.1 | ℹ️ not gated |
|
|
283
299
|
|
|
284
300
|
## Data-viz palette (advisory)
|
package/docs/d2.md
CHANGED
|
@@ -32,7 +32,7 @@ its `themeOverrides` / `darkThemeOverrides`:
|
|
|
32
32
|
|
|
33
33
|
```js
|
|
34
34
|
import { brontoD2Overrides } from '@ponchia/ui/d2';
|
|
35
|
-
brontoD2Overrides('dark'); // { N1: '#e6e6e6', B1: '#
|
|
35
|
+
brontoD2Overrides('dark'); // { N1: '#e6e6e6', B1: '#a0a0a0', … }
|
|
36
36
|
```
|
|
37
37
|
|
|
38
38
|
For a build step or non-JS host, read `@ponchia/ui/d2.json` directly.
|
|
@@ -68,7 +68,7 @@ not spent on borders, edges, or shapes the author never marked:
|
|
|
68
68
|
| `N1`–`N3` | Text · muted · subtle | `--text` · `--text-soft` · `--text-dim` |
|
|
69
69
|
| `N4`–`N5` | Strong / regular lines | `--line-strong` · `--line` |
|
|
70
70
|
| `N6`–`N7` | Subtle background · canvas | `--panel-soft` · `--bg` |
|
|
71
|
-
| `B1` | Shape borders **and** connections (edges) | `--
|
|
71
|
+
| `B1` | Shape borders **and** connections (edges) | `--edge` (a connection carries meaning: 3:1, WCAG 1.4.11) |
|
|
72
72
|
| `B2`–`B3` | Muted borders | `--line` |
|
|
73
73
|
| `B4`–`B6` | Container fills (outer → leaf) | `--panel-soft` · `--bg-elevated` · `--panel` |
|
|
74
74
|
| `AA*` / `AB*` | Alternative-accent ramps (special-shape fills, class/sql headers) | kept **neutral** |
|
|
@@ -121,9 +121,9 @@ paste the resolved hex from [`tokens/resolved.json`](./architecture.md) for a
|
|
|
121
121
|
| Diagram element | bronto token | (live D2 slot it mirrors) |
|
|
122
122
|
| --- | --- | --- |
|
|
123
123
|
| Node fill | `--panel` | `B4`–`B6` container fills |
|
|
124
|
-
| Node border | `--
|
|
124
|
+
| Node border | `--edge` | `B1` |
|
|
125
125
|
| Node label | `--text` | `N1` |
|
|
126
|
-
| Edge / connector + arrowhead | `--
|
|
126
|
+
| Edge / connector + arrowhead | `--edge` | `B1` |
|
|
127
127
|
| Edge label | `--text-soft` | `N2` |
|
|
128
128
|
| Cluster / container fill | `--panel-soft` | `B4` |
|
|
129
129
|
| Accent (emphasised) node fill · its label | `--accent` · `--on-accent` | the `accent` class above |
|
|
@@ -132,20 +132,20 @@ paste the resolved hex from [`tokens/resolved.json`](./architecture.md) for a
|
|
|
132
132
|
<svg viewBox="0 0 320 120" role="img" aria-labelledby="flow-title">
|
|
133
133
|
<title id="flow-title">Ingest → Queue → Worker</title>
|
|
134
134
|
<!-- edge -->
|
|
135
|
-
<line x1="92" y1="40" x2="128" y2="40" stroke="var(--
|
|
136
|
-
<line x1="220" y1="40" x2="256" y2="40" stroke="var(--
|
|
135
|
+
<line x1="92" y1="40" x2="128" y2="40" stroke="var(--edge)" marker-end="url(#arrow)" />
|
|
136
|
+
<line x1="220" y1="40" x2="256" y2="40" stroke="var(--edge)" marker-end="url(#arrow)" />
|
|
137
137
|
<defs>
|
|
138
138
|
<marker id="arrow" viewBox="0 0 8 8" refX="7" refY="4" markerWidth="6" markerHeight="6" orient="auto">
|
|
139
|
-
<path d="M0,0 L8,4 L0,8 z" fill="var(--
|
|
139
|
+
<path d="M0,0 L8,4 L0,8 z" fill="var(--edge)" />
|
|
140
140
|
</marker>
|
|
141
141
|
</defs>
|
|
142
142
|
<!-- neutral node -->
|
|
143
|
-
<rect x="16" y="22" width="76" height="36" rx="6" fill="var(--panel)" stroke="var(--
|
|
143
|
+
<rect x="16" y="22" width="76" height="36" rx="6" fill="var(--panel)" stroke="var(--edge)" />
|
|
144
144
|
<text x="54" y="44" text-anchor="middle" fill="var(--text)" font-size="12">Ingest</text>
|
|
145
145
|
<!-- accent (emphasised) node: on-accent ink on the accent fill -->
|
|
146
146
|
<rect x="128" y="22" width="92" height="36" rx="6" fill="var(--accent)" stroke="var(--accent-strong)" />
|
|
147
147
|
<text x="174" y="44" text-anchor="middle" fill="var(--on-accent)" font-size="12">Queue</text>
|
|
148
|
-
<rect x="256" y="22" width="64" height="36" rx="6" fill="var(--panel)" stroke="var(--
|
|
148
|
+
<rect x="256" y="22" width="64" height="36" rx="6" fill="var(--panel)" stroke="var(--edge)" />
|
|
149
149
|
<text x="288" y="44" text-anchor="middle" fill="var(--text)" font-size="12">Worker</text>
|
|
150
150
|
</svg>
|
|
151
151
|
```
|
|
@@ -170,7 +170,7 @@ themed page, never for `file://`/PDF artifacts or `<img>` embeds):
|
|
|
170
170
|
win over the inline attributes**, so strip ALL hex-bearing rules from the
|
|
171
171
|
`<style>` first — only then do attribute rewrites take effect.
|
|
172
172
|
3. Rewrite the inline hex → `var(--token)` using the slot table above
|
|
173
|
-
(`N1`→`--text`, `N4
|
|
173
|
+
(`N1`→`--text`, `N4`→`--line-strong`, `B1`→`--edge`, `N6`/`B4`→`--panel-soft`,
|
|
174
174
|
`B6`→`--panel`, accent class fill→`--accent`, its ink→`--on-accent`, …).
|
|
175
175
|
4. Leave `<mask>` `fill="black"`/`"white"` keywords alone — that is a
|
|
176
176
|
luminance mask, not a colour.
|
package/docs/marks.md
CHANGED
|
@@ -64,7 +64,8 @@ Brackets a whole block and optionally labels it — the prose analogue of
|
|
|
64
64
|
```
|
|
65
65
|
|
|
66
66
|
Tones: `--accent` (the rationed accent), `--success`, `--warning`, `--danger`,
|
|
67
|
-
`--info`. The default is a neutral bracket
|
|
67
|
+
`--info`. The default is a neutral bracket in `--edge`, the dim-text ink, so the
|
|
68
|
+
tick holds 3:1 and its label holds text contrast.
|
|
68
69
|
|
|
69
70
|
## Recipes
|
|
70
71
|
|
package/docs/mermaid.md
CHANGED
|
@@ -95,6 +95,8 @@ switch, re-`initialize` with the other palette and re-render.
|
|
|
95
95
|
[charts palette](./legends.md) (blue first; no slot is the accent).
|
|
96
96
|
- **Structural** diagrams — flowchart, sequence, class, ER, state — use the
|
|
97
97
|
monochrome node/edge/cluster grammar and spend the accent only on notes.
|
|
98
|
+
Edges (`lineColor`) are `--edge`, which holds 3:1 against the canvas; node
|
|
99
|
+
borders stay on the `--line-strong` hairline.
|
|
98
100
|
- **Not themed: `gantt` and `timeline`.** Their colours come from
|
|
99
101
|
diagram-specific slots (`taskBkgColor`, `sectionBkgColor*`, `gridColor`,
|
|
100
102
|
`todayLineColor`, …) that the base `themeVariables` map does **not** set, so a
|
package/docs/reference.md
CHANGED
|
@@ -1852,6 +1852,7 @@ Exact mirror of the `:root` blocks in `css/tokens.css`
|
|
|
1852
1852
|
| `--surface-muted` | `var(--panel-soft)` |
|
|
1853
1853
|
| `--border` | `var(--line)` |
|
|
1854
1854
|
| `--border-strong` | `var(--line-strong)` |
|
|
1855
|
+
| `--edge` | `var(--text-dim)` |
|
|
1855
1856
|
|
|
1856
1857
|
### Light theme
|
|
1857
1858
|
|
package/docs/renderer.md
CHANGED
|
@@ -36,6 +36,7 @@ accept both.
|
|
|
36
36
|
| `bg`, `bgElevated`, `panel`, `panelStrong` | `--bg`, `--bg-elevated`, `--panel`, `--panel-strong` | Backgrounds; draw on `panel` |
|
|
37
37
|
| `text`, `textSoft`, `textDim` | `--text`, `--text-soft`, `--text-dim` | Labels, secondary and tertiary ink |
|
|
38
38
|
| `line`, `lineStrong` | `--line`, `--line-strong` | Grid and hairlines; axes and rules |
|
|
39
|
+
| `edge` | `--edge` | A line that carries meaning: a relationship, connector or leader. 3:1 against the surface; `line` and `lineStrong` are decorative and are not |
|
|
39
40
|
| `accent`, `accentText`, `onAccent`, `focus` | accent family | The one emphasis, its text forms, focus |
|
|
40
41
|
| `selection` | `--accent` at 27% | A translucent selection wash |
|
|
41
42
|
| `success`, `warning`, `danger`, `info` | status tier | Status only, never categories |
|