
/* /platform/public/public.css */
/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */
@layer properties;
@layer theme, base, components, utilities;
@layer theme {
  :root, :host {
    --font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue",
      "Noto Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji",
      "Segoe UI Symbol", "Noto Color Emoji";
    --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono",
      "Courier New", monospace;
    --spacing: 0.25rem;
    --container-lg: 32rem;
    --text-base: var(--type-body);
    --text-base--line-height: var(--type-body-line);
    --text-3xl: 1.875rem;
    --text-3xl--line-height: calc(2.25 / 1.875);
    --font-weight-normal: var(--font-weight-normal);
    --font-weight-medium: 500;
    --font-weight-semibold: 600;
    --tracking-tight: -0.025em;
    --default-font-family: var(--font-sans);
    --default-mono-font-family: var(--font-mono);
    --color-status-info: var(--status-info);
    --color-status-info-soft: var(--status-info-soft);
    --color-status-warning: var(--status-warning);
    --color-status-warning-soft: var(--status-warning-soft);
    --color-status-error: var(--status-error);
    --color-status-error-soft: var(--status-error-soft);
    --color-status-active: var(--color-status-info);
    --color-status-active-soft: var(--color-status-info-soft);
  }
}
@layer base {
  *, ::after, ::before, ::backdrop, ::file-selector-button {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    border: 0 solid;
  }
  html, :host {
    line-height: 1.5;
    -webkit-text-size-adjust: 100%;
    tab-size: 4;
    font-family: var(--default-font-family, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");
    font-feature-settings: var(--default-font-feature-settings, normal);
    font-variation-settings: var(--default-font-variation-settings, normal);
    -webkit-tap-highlight-color: transparent;
  }
  hr {
    height: 0;
    color: inherit;
    border-top-width: 1px;
  }
  abbr:where([title]) {
    -webkit-text-decoration: underline dotted;
    text-decoration: underline dotted;
  }
  h1, h2, h3, h4, h5, h6 {
    font-size: inherit;
    font-weight: inherit;
  }
  a {
    color: inherit;
    -webkit-text-decoration: inherit;
    text-decoration: inherit;
  }
  b, strong {
    font-weight: bolder;
  }
  code, kbd, samp, pre {
    font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);
    font-feature-settings: var(--default-mono-font-feature-settings, normal);
    font-variation-settings: var(--default-mono-font-variation-settings, normal);
    font-size: 1em;
  }
  small {
    font-size: 80%;
  }
  sub, sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
  }
  sub {
    bottom: -0.25em;
  }
  sup {
    top: -0.5em;
  }
  table {
    text-indent: 0;
    border-color: inherit;
    border-collapse: collapse;
  }
  :-moz-focusring:where(:not(iframe)) {
    outline: auto;
  }
  progress {
    vertical-align: baseline;
  }
  summary {
    display: list-item;
  }
  ol, ul, menu {
    list-style: none;
  }
  img, svg, video, canvas, audio, iframe, embed, object {
    display: block;
    vertical-align: middle;
  }
  img, video {
    max-width: 100%;
    height: auto;
  }
  button, input, select, optgroup, textarea, ::file-selector-button {
    font: inherit;
    font-feature-settings: inherit;
    font-variation-settings: inherit;
    letter-spacing: inherit;
    color: inherit;
    border-radius: 0;
    background-color: transparent;
    opacity: 1;
  }
  :where(select:is([multiple], [size])) optgroup {
    font-weight: bolder;
  }
  :where(select:is([multiple], [size])) optgroup option {
    padding-inline-start: 20px;
  }
  ::file-selector-button {
    margin-inline-end: 4px;
  }
  ::placeholder {
    opacity: 1;
  }
  @supports (not (-webkit-appearance: -apple-pay-button))  or (contain-intrinsic-size: 1px) {
    ::placeholder {
      color: currentcolor;
      @supports (color: color-mix(in lab, red, red)) {
        color: color-mix(in oklab, currentcolor 50%, transparent);
      }
    }
  }
  textarea {
    resize: vertical;
  }
  ::-webkit-search-decoration {
    -webkit-appearance: none;
  }
  ::-webkit-date-and-time-value {
    min-height: 1lh;
    text-align: inherit;
  }
  ::-webkit-datetime-edit {
    display: inline-flex;
  }
  ::-webkit-datetime-edit-fields-wrapper {
    padding: 0;
  }
  ::-webkit-datetime-edit, ::-webkit-datetime-edit-year-field, ::-webkit-datetime-edit-month-field, ::-webkit-datetime-edit-day-field, ::-webkit-datetime-edit-hour-field, ::-webkit-datetime-edit-minute-field, ::-webkit-datetime-edit-second-field, ::-webkit-datetime-edit-millisecond-field, ::-webkit-datetime-edit-meridiem-field {
    padding-block: 0;
  }
  ::-webkit-calendar-picker-indicator {
    line-height: 1;
  }
  :-moz-ui-invalid {
    box-shadow: none;
  }
  button, input:where([type="button"], [type="reset"], [type="submit"]), ::file-selector-button {
    appearance: button;
  }
  ::-webkit-inner-spin-button, ::-webkit-outer-spin-button {
    height: auto;
  }
  [hidden]:where(:not([hidden="until-found"])) {
    display: none !important;
  }
}
@layer utilities {
  .visible {
    visibility: visible;
  }
  .absolute {
    position: absolute;
  }
  .fixed {
    position: fixed;
  }
  .relative {
    position: relative;
  }
  .static {
    position: static;
  }
  .inset-0 {
    inset: 0px;
  }
  .isolate {
    isolation: isolate;
  }
  .container {
    width: 100%;
    @media (width >= 640px) {
      max-width: 640px;
    }
    @media (width >= 768px) {
      max-width: 768px;
    }
    @media (width >= 1024px) {
      max-width: 1024px;
    }
    @media (width >= 1280px) {
      max-width: 1280px;
    }
    @media (width >= 1536px) {
      max-width: 1536px;
    }
  }
  .block {
    display: block;
  }
  .flex {
    display: flex;
  }
  .grid {
    display: grid;
  }
  .hidden {
    display: none;
  }
  .inline-block {
    display: inline-block;
  }
  .table {
    display: table;
  }
  .size-\[14px\] {
    width: 14px;
    height: 14px;
  }
  .size-full {
    width: 100%;
    height: 100%;
  }
  .min-h-dvh {
    min-height: 100dvh;
  }
  .w-fit {
    width: fit-content;
  }
  .w-full {
    width: 100%;
  }
  .max-w-lg {
    max-width: var(--container-lg);
  }
  .shrink-0 {
    flex-shrink: 0;
  }
  .flex-wrap {
    flex-wrap: wrap;
  }
  .place-items-center {
    place-items: center;
  }
  .items-center {
    align-items: center;
  }
  .justify-center {
    justify-content: center;
  }
  .gap-1 {
    gap: var(--spacing);
  }
  .gap-3 {
    gap: calc(var(--spacing) * 3);
  }
  .gap-6 {
    gap: calc(var(--spacing) * 6);
  }
  :where(.space-y-6 > :not(:last-child)) {
    --tw-space-y-reverse: 0;
    margin-block-start: calc(calc(var(--spacing) * 6) * var(--tw-space-y-reverse));
    margin-block-end: calc(calc(var(--spacing) * 6) * calc(1 - var(--tw-space-y-reverse)));
  }
  .overflow-hidden {
    overflow: hidden;
  }
  .rounded {
    border-radius: 0.25rem;
  }
  .rounded-\[var\(--radius-micro\)\] {
    border-radius: var(--radius-micro);
  }
  .rounded-full {
    border-radius: calc(infinity * 1px);
  }
  .bg-muted {
    background-color: var(--muted);
  }
  .object-contain {
    object-fit: contain;
  }
  .p-8 {
    padding: calc(var(--spacing) * 8);
  }
  .align-middle {
    vertical-align: middle;
  }
  .type-caption {
    font-size: var(--type-workbench-secondary);
    line-height: var(--type-workbench-secondary-line);
    font-weight: var(--font-weight-regular);
  }
  .text-3xl {
    font-size: var(--text-3xl);
    line-height: var(--tw-leading, var(--text-3xl--line-height));
  }
  .\[font-size\:8px\] {
    font-size: 8px;
  }
  .leading-none {
    --tw-leading: 1;
    line-height: 1;
  }
  .font-medium {
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
  }
  .font-semibold {
    --tw-font-weight: var(--font-weight-semibold);
    font-weight: var(--font-weight-semibold);
  }
  .\[font-weight\:var\(--font-weight-medium\)\] {
    font-weight: var(--font-weight-medium);
  }
  .tracking-tight {
    --tw-tracking: var(--tracking-tight);
    letter-spacing: var(--tracking-tight);
  }
  .text-\[var\(--muted-foreground\)\] {
    color: var(--muted-foreground);
  }
  .text-muted-foreground {
    color: var(--muted-foreground);
  }
  .underline {
    text-decoration-line: underline;
  }
  .underline-offset-4 {
    text-underline-offset: 4px;
  }
  .\!filter {
    filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,) !important;
  }
  .after\:pointer-events-none::after {
    content: var(--tw-content);
    pointer-events: none;
  }
  .after\:absolute::after {
    content: var(--tw-content);
    position: absolute;
  }
  .after\:inset-0::after {
    content: var(--tw-content);
    inset: 0px;
  }
  .after\:rounded-\[inherit\]::after {
    content: var(--tw-content);
    border-radius: inherit;
  }
  .after\:border-\[0\.5px\]::after {
    content: var(--tw-content);
    border-style: var(--tw-border-style);
    border-width: 0.5px;
  }
  .after\:border-foreground\/15::after {
    content: var(--tw-content);
    border-color: var(--foreground);
    @supports (color: color-mix(in lab, red, red)) {
      border-color: color-mix(in oklab, var(--foreground) 15%, transparent);
    }
  }
  .data-\[mark-status\=fallback\]\:bg-muted[data-mark-status="fallback"] {
    background-color: var(--muted);
  }
  @media (forced-colors: active) {
    .forced-colors\:after\:border-\[CanvasText\]::after {
      content: var(--tw-content);
      border-color: CanvasText;
    }
  }
}
@font-face{font-family:"Inter Variable";font-style:normal;font-display:swap;font-weight:100 900;src:url("/fonts/InterVariable-24c601bf5bec.woff2") format("woff2-variations");unicode-range:U+0000,U+0020-007E,U+00A0-00AC,U+00AE-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+2000-200B,U+2010-2027,U+202F-2055,U+2057,U+205F,U+20AC,U+2122,U+2190-2193,U+2212,U+2248,U+2260,U+2264-2265,U+FEFF}@font-face{font-family:"Inter Variable";font-style:normal;font-display:swap;font-weight:100 900;src:url("/fonts/InterVariable-665cff743ffa.woff2") format("woff2-variations");unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303,U+0309,U+0323,U+1EA0-1EF9,U+20AB}@font-face{font-family:"Inter Variable";font-style:normal;font-display:swap;font-weight:100 900;src:url("/fonts/InterVariable-9e2697b0404b.woff2") format("woff2-variations");unicode-range:U+0100-0101,U+0104-010F,U+0112-0127,U+012A-0130,U+0132-0148,U+014A-0151,U+0154-0167,U+016A-019F,U+01A2-01AE,U+01B1-01C3,U+01C5-0254,U+0256-027B,U+027E-0284,U+0286-0290,U+0292-02A4,U+02A6-02BA,U+02BD-02C5,U+02C7-02D9,U+02DB,U+02DD-02FF,U+0302,U+0306-0307,U+030A,U+030C,U+030F,U+0313,U+0315,U+031B,U+0326-0328,U+032C,U+0337-0338,U+0342-0343,U+0346-036F,U+1D00,U+1D0D,U+1D1B,U+1D43,U+1D47-1D49,U+1D4D,U+1D4F-1D50,U+1D52,U+1D56-1D58,U+1D5B,U+1D62-1D65,U+1D9C,U+1DA0,U+1DBB,U+1DBF,U+1E00-1E9B,U+1E9D-1E9F,U+1EFA-1EFF,U+2C7C,U+2C7F,U+A7FF}@font-face{font-family:"Inter Variable";font-style:normal;font-display:swap;font-weight:100 900;src:url("/fonts/InterVariable-24cdf40d6a05.woff2") format("woff2-variations");unicode-range:U+0374-0376,U+037A-037F,U+0384-038A,U+038C,U+038E-03A1,U+03A3-03D7,U+03DC-03DD,U+03F0-03F6,U+03F9-03FA,U+03FC-03FF,U+1F00-1F15,U+1F18-1F1D,U+1F20-1F45,U+1F48-1F4D,U+1F50-1F57,U+1F59,U+1F5B,U+1F5D,U+1F5F-1F7D,U+1F80-1FB4,U+1FB6-1FC4,U+1FC6-1FD3,U+1FD6-1FDB,U+1FDD-1FEF,U+1FF2-1FF4,U+1FF6-1FFE}@font-face{font-family:"Inter Variable";font-style:normal;font-display:swap;font-weight:100 900;src:url("/fonts/InterVariable-96377a67b308.woff2") format("woff2-variations");unicode-range:U+0400-0479,U+0480-049D,U+04A0-04FF,U+052F,U+2DFF,U+A69F}@font-face{font-family:"Inter Variable";font-style:normal;font-display:swap;font-weight:100 900;src:url("/fonts/InterVariable-5cf6839e10bd.woff2") format("woff2-variations");unicode-range:U+0E3F,U+1DC0-1DF5,U+1DFC-1DFF,U+2070-2071,U+2074-208E,U+2090-209C,U+20A0-20AA,U+20AD-20AF,U+20B1-20B5,U+20B8-20BA,U+20BC-20C0,U+20DB-20DE,U+20E8,U+20F0,U+2100-2101,U+2103,U+2105-2106,U+2109,U+2113,U+2116-2117,U+211E-2121,U+2126,U+212A-212B,U+212E,U+2132,U+213B,U+214D,U+2150-217F,U+2183-2186,U+2189,U+2194-2199,U+21A9-21AA,U+21B0-21B1,U+21B3-21B5,U+21BA-21BB,U+21D0,U+21D2,U+21D4,U+21DE-21DF,U+21E4-21E5,U+21E7,U+21EA,U+2202,U+2205-2206,U+220F,U+2211,U+221A,U+221E,U+222B,U+2236,U+2295-2298,U+2303-2305,U+2318,U+2325-2327,U+232B,U+2380,U+2387,U+238B,U+23CE-23CF,U+2423,U+2460-2468,U+24B6-24CF,U+24EA,U+25A0-25A2,U+25AA,U+25B2-25B3,U+25B6-25B7,U+25BA-25BD,U+25C0-25C1,U+25C4-25C7,U+25CA-25CB,U+25CF,U+25E6,U+25EF,U+2600,U+2605-2606,U+263C,U+2661,U+2665,U+266A-266B,U+26A0,U+2713,U+2717,U+2756,U+2764,U+2780-2788,U+27EF,U+27F5-27FA,U+2913,U+2A38,U+2B06,U+2B12-2B13,U+2B1C,U+2B24,U+2E18,U+A92E,U+E000,U+E002-E05E,U+E06A-E0BD,U+E0C8-E0CC,U+E0DC-E0E6,U+E0F3-E0F5,U+E106,U+E109-E10A,U+E10C-E10F,U+E111-E113,U+E117-E118,U+E121-E122,U+E124,U+E12A-E15E,U+E163,U+E1C3,U+E1D2-E1DF,U+E1E1-E2DC,U+EE01-EE07,U+EE09-EE0A,U+EE0C-EE12,U+EE14,U+EE17,U+EE1D-EE45,U+EE47-EE84,U+EE87-EED6,U+EED8-EEE1,U+F6C3,U+1F12F-1F149,U+1F16A-1F16B,U+1F850,U+1F852}
@font-face {
  font-family: "Inter Variable Fallback";
  src: local("Arial"), local("Helvetica");
  size-adjust: 97.71%;
  ascent-override: 99.15%;
  descent-override: 24.69%;
  line-gap-override: 0%;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2212;
}
.zml-num-fraction {
  color: currentColor;
  @supports (color: color-mix(in lab, red, red)) {
    color: color-mix(in oklab, currentColor 62%, transparent);
  }
}
@media (prefers-contrast: more) {
  .zml-num-fraction {
    color: inherit;
  }
}
@media (forced-colors: active) {
  .zml-num-fraction {
    color: inherit;
  }
}
:root {
  --font-sans: "Inter Variable", Inter, "Inter Variable Fallback", "PingFang SC", "Microsoft YaHei",
    "Noto Sans SC", ui-sans-serif, system-ui, -apple-system, "Segoe UI",
    sans-serif;
  --font-data: var(--font-sans);
  --font-mono: "Geist Mono", "SFMono-Regular", "Cascadia Code",
    "Roboto Mono", ui-monospace, monospace;
  --font-weight-regular: 400;
  --font-weight-normal: var(--font-weight-regular);
  --font-weight-medium: 500;
  --font-weight-semibold: 600;
  --font-feature-numeric: "tnum" 1, "kern" 1, "calt" 0;
  --type-workbench-primary: 13px;
  --type-workbench-primary-line: 18px;
  --type-body: 13px;
  --type-body-line: 18px;
  --type-workbench-secondary: 12px;
  --type-workbench-secondary-line: 16px;
  --type-metric-primary: 20px;
  --type-metric-primary-line: 24px;
  --type-metric-tile: 18px;
  --type-metric-tile-line: 24px;
  --type-micro: 11px;
  --type-micro-line: 13px;
  --type-control: 13px;
  --type-control-line: 18px;
  --type-input-touch: 16px;
  --type-row-title: 13px;
  --type-row-title-line: 18px;
  --type-menu-item: 13px;
  --type-menu-item-line: 19.5px;
  --type-button: 12px;
  --type-button-line: 14.5px;
  --type-menu-sub-indicator-line: 5px;
  --type-tooltip: var(--type-micro);
  --type-tooltip-line: 16px;
  --type-mono: 12px;
  --type-mono-line: 16px;
  --type-auth-heading: 18px;
  --type-auth-heading-line: 24px;
  --type-auth-body: 13px;
  --type-auth-body-line: 18px;
  --type-heading-window: 18px;
  --type-heading-window-line: 24px;
  --type-heading-section: 15px;
  --type-heading-section-line: 23px;
  --type-heading-page: 24px;
  --type-heading-page-line: 32px;
  --type-article-body: 15px;
  --type-article-body-line: 24px;
  --font-weight-article-heading: var(--font-weight-semibold);
  --article-reading-width: 80ch;
  --tracking-heading: -0.16px;
  --tracking-body: -0.1px;
  --tracking-section: 0.1px;
  --unread-marker-size: 6px;
  --space-inline-compact: 4px;
  --space-inline-standard: 8px;
  --space-inline-wide: 12px;
  --space-toolbar-quiet: 6px;
  --space-stack-compact: 4px;
  --space-stack-standard: 8px;
  --space-confirmation-actions: 20px;
  --space-section-compact: 16px;
  --space-section-standard: 24px;
  --space-detail-gutter: 44px;
  --radius-micro: 4px;
  --radius-checkbox: 3px;
  --radius-swatch: 2px;
  --radius-small: 6px;
  --radius-control: 8px;
  --radius-section: 10px;
  --radius-auth-field: 10px;
  --radius-rail-switcher: 10px;
  --radius-floating: 12px;
  --radius-shell: 12px;
  --radius-modal: 12px;
  --radius-data-surface: 8px;
  --radius-pill: 9999px;
  --border-width-hairline: 1px;
  --border-width-divider: 0.5px;
  --border-width-control: 1px;
  --border-width-focus: 1px;
  --border-width-invalid: 1px;
  --control-compact: 24px;
  --control-standard: 28px;
  --control-form: 32px;
  --icon-micro: 12px;
  --icon-toolbar: 14px;
  --control-auth: 44px;
  --select-trigger: 30px;
  --select-trigger-compact: 24px;
  --select-option-compact: 24px;
  --select-option-compact-line: 18px;
  --switch-track-w: 30px;
  --switch-track-h: 20px;
  --switch-thumb-size: 14px;
  --switch-pad: 3px;
  --switch-compact-w: 22px;
  --switch-compact-h: 14px;
  --switch-compact-thumb: 10px;
  --switch-compact-pad: 2px;
  --motion-switch: 150ms;
  --motion-switch-thumb: 100ms;
  --motion-switch-thumb-delay: 50ms;
  --field-inline: 12px;
  --menu-item: 32px;
  --filter-menu-width: 207px;
  --filter-cascade-width: 195px;
  --filter-panel-width: 320px;
  --filter-search-height: 36px;
  --display-options-width: 300px;
  --popover-max-width: 331px;
  --display-options-control-min: 99px;
  --details-pane-width: 364.781px;
  --details-inline-min: 1152px;
  --details-balanced-inline-min: 1024px;
  --details-balanced-min: 360px;
  --details-balanced-master: 1.08fr;
  --details-balanced-detail: 0.92fr;
  --details-library-master-width: 288px;
  --selection-list-column-min: 14rem;
  --selection-identity-width: 8rem;
  --hit-plane-coarse: 44px;
  --auth-reveal-size: 40px;
  --avatar-crop-stage: 360px;
  --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);
  --feedback-viewport-top-inset: calc(2 * var(--shell-bar-height) + 0.5px);
  --checkbox-size: 14px;
  --checkbox-indicator-size: 16px;
  --keyboard-occlusion: max(0px, calc(100svh - var(--vv-height, 100svh)));
  --shell-rail-width: 244px;
  --shell-wide-inset: 8px;
  --shell-navigation-inset: 12px;
  --shell-bar-height: 43.5px;
  --window-header-height: 44px;
  --shell-bar-inset-start: 8px;
  --shell-bar-inset-end: 11px;
  --view-title-inset-start: 10px;
  --view-title-inset-end: 4px;
  --row-single: 44px;
  --row-dual: 46px;
  --row-inbox: 55px;
  --table-header: 32px;
  --cell-inline: 12px;
  --cell-gap: 8px;
  --data-alert-rail-width: 3px;
  --data-message-row: 14px;
  --data-annotation-row: 20px;
  --data-matrix-inset: 10px;
  --data-header-coarse: 44px;
  --data-matrix-identity-default: 150px;
  --data-matrix-basis-default: 118px;
  --data-matrix-venue-default: 104px;
  --data-card-collapsed: 124px;
  --data-card-message: 22px;
  --data-card-expanded-extra: 131px;
  --row-dense-single: 32px;
  --row-dense-dual: 40px;
  --row-compact-single: 28px;
  --row-compact-dual: 36px;
  --table-header-compact: 24px;
  --row-legs: 40px;
  --row-legs-line: 16px;
  --row-legs-block: calc((var(--row-legs) - 2 * var(--row-legs-line)) / 2);
  --table-header-dense: 28px;
  --cell-inline-dense: 8px;
  --settings-row: 65px;
  --view-rail-end-slots: 3;
  --view-rail-end-max: calc(
    var(--view-rail-end-slots) * var(--control-standard) +
      (var(--view-rail-end-slots) - 1) * var(--space-toolbar-quiet)
  );
  --table-record-min: 56rem;
  --table-column-asset: 96px;
  --table-column-venue: 128px;
  --table-column-status: 112px;
  --table-column-metric: 136px;
  --table-column-metric-wide: 160px;
  --table-column-identity: 160px;
  --table-column-time: 176px;
  --table-column-action: 96px;
  --table-column-body: 240px;
  --table-column-fill: 160px;
  --table-column-amount: calc(var(--table-column-metric) - 2 * var(--cell-inline));
  --overlay-gutter: 8px;
  --calendar-day-width: 96px;
  --calendar-day-height: 64px;
  --calendar-week-total-width: 104px;
  --calendar-heat-max: 30%;
  --scrollbar-size: 8px;
  --scrollbar-size-rail: 11px;
  --scrollbar-thumb-border: 2px;
  --scrollbar-thumb: var(--foreground);
  @supports (color: color-mix(in lab, red, red)) {
    --scrollbar-thumb: color-mix(in srgb, var(--foreground) 18%, transparent);
  }
  --scrollbar-thumb-hover: var(--foreground);
  @supports (color: color-mix(in lab, red, red)) {
    --scrollbar-thumb-hover: color-mix(in srgb, var(--foreground) 30%, transparent);
  }
  --scrollbar-thumb-active: var(--scrollbar-thumb-hover);
  --window-width-420: 420px;
  --window-width-480: 480px;
  --window-width-560: 560px;
  --window-width-720: 720px;
  --window-width-1120: 1120px;
  --settings-window-width: 1180px;
  --settings-window-width-wide: 1600px;
  --settings-window-height: 704px;
  --toast-width: 360px;
  --settings-reading-width: 640px;
  --settings-section-gap: 48px;
  --settings-control-width: 160px;
  --settings-range-width: 176px;
  --settings-label-min: 128px;
  --settings-fact-label: 168px;
  --settings-fact-row: 40px;
  --settings-card-reading-width: 688px;
  --form-column-min: 18rem;
  --form-section-content-gap: 16px;
  --form-field-narrow: 7.5rem;
  --form-field-compact: 10rem;
  --form-field-default: 12rem;
  --form-field-wide: 18rem;
  --record-identity-min: 10rem;
  --record-summary-min: 16rem;
  --data-identity-prefix-min: 32px;
  --chart-line-primary: 1;
  --chart-line-secondary: 1;
  --chart-line-reference: 1;
  --chart-line-baseline: 1;
  --chart-line-overview: 1;
  --chart-marker-primary: 3;
  --chart-marker-secondary: 3;
  --chart-scale-margin: 0.08;
  --chart-overview-margin: 0.12;
  --chart-area-fill-near: 0.22;
  --chart-area-fill-far: 0.02;
  --chart-bar-spacing: 10;
  --chart-plot-height: clamp(18rem, 48dvh, 34rem);
  --chart-plot-summary-height: clamp(12rem, 30dvh, 20rem);
  --chart-plot-min-height: 12rem;
  --chart-plot-min-wide: 16rem;
  --chart-overview-height: 32px;
  --chart-tooltip-width: 244px;
  --chart-data-max-height: min(20rem, 45dvh);
  --chart-compact-width: 420px;
  --chart-brush-grip: 7px;
  --chart-brush-click-slop: 3px;
  --chart-annotation-offset: 6px;
  --chart-legend-width: 28px;
  --mini-trend-height: 24px;
  --auth-content-width: 288px;
  --auth-action-pitch: 60px;
  --marketing-nav-wide: 72px;
  --marketing-nav-narrow: 64px;
  --marketing-grid-max: 1344px;
  --marketing-gutter-wide: 46px;
  --marketing-gutter-narrow: 24px;
  --marketing-display-wide: 72px;
  --marketing-display-narrow: 40px;
  --marketing-tracking: -0.022em;
  --marketing-lead: 24px;
  --marketing-body: 15px;
  --marketing-heading-weight: 590;
  --marketing-measure: 680px;
  --marketing-hero-wide: 64px;
  --marketing-hero-narrow: 38px;
  --marketing-hero-weight: 510;
  --marketing-heading-wide: 48px;
  --marketing-heading-narrow: 24px;
  --marketing-rhythm-wide: 128px;
  --marketing-rhythm-narrow: 80px;
  --marketing-cta: 44px;
  --marketing-reveal: 350ms;
  --marketing-display-medium: 56px;
  --marketing-hero-medium: 52px;
  --marketing-heading-medium: 40px;
  --marketing-lead-medium: 20px;
  --marketing-lead-narrow: 17px;
  --marketing-gutter-medium: 32px;
  --marketing-gutter-max: 80px;
  --marketing-rhythm-medium: 96px;
  --marketing-title: 24px;
  --marketing-title-narrow: 20px;
  --marketing-subtitle: 20px;
  --marketing-emphasis: 17px;
  --marketing-control-large: 14px;
  --marketing-small: 13px;
  --marketing-micro: 12px;
  --marketing-tag: 11px;
  --marketing-stat: 40px;
  --marketing-stat-narrow: 24px;
  --marketing-price: 32px;
  --marketing-metric: 28px;
  --marketing-metric-line: 32px;
  --marketing-reading-heading-narrow: 32px;
  --marketing-tracking-title: -0.012em;
  --marketing-tracking-body: -0.011em;
  --marketing-tracking-small: -0.01em;
  --marketing-tracking-figure: -0.02em;
  --marketing-tracking-tag: 0.04em;
  --motion-express-page-out: 140ms;
  --motion-express-page-in: 260ms;
  --motion-in: 0s;
  --motion-out: 150ms;
  --motion-instant: 0ms;
  --motion-swap: 150ms;
  --motion-swap-offset: 3px;
  --motion-ease-x1: 0.16;
  --motion-ease-y1: 1;
  --motion-ease-x2: 0.3;
  --motion-ease-y2: 1;
  --motion-micro: 100ms;
  --motion-floating: 100ms;
  --motion-disclosure: 150ms;
  --motion-control: var(--motion-out);
  --motion-overlay: 150ms;
  --motion-overlay-exit: 150ms;
  --motion-popup-enter: 50ms;
  --motion-popup-exit: 210ms;
  --motion-popup-scale: 50ms;
  --ease-popup-enter: linear(0, .2753 14%, .3463 28%, .4662 42%, .6069 56%, .7615 70%, .9028 84%, 1);
  --ease-popup-scale-enter: linear(0, .1377 14%, .1732 28%, .2331 42%, .3035 56%, .3807 70%, .4514 84%, .5 96%, 1 96%, 1);
  --ease-popup-exit: linear(0 0% 15%, .1331 18%, .2742 21%, .3943 24%, .4956 28%, .6697 34%, .8114 44%, .8982 54%, .942 64%, .9679 74%, .9817 84%, .9901 94%, 1);
  --ease-popup-scale-exit: linear(0, .1814 18%, .2734 30%, .3772 44%, .4846 58%, .5 64%, 1 64%, 1);
  --motion-dialog: 300ms;
  --motion-chart-reveal: 300ms;
  --motion-panel: 250ms;
  --motion-pulse-slow: 2400ms;
  --motion-loop: 1200ms;
  --motion-reveal: 80ms;
  --wait-quiet: 1000ms;
  --opacity-refreshing: 0.64;
  --motion-event-flash: 400ms;
  --motion-alert-ignite: 300ms;
  --motion-brand-loop: 2400ms;
  --motion-floating-offset: 4px;
  --motion-overlay-scale-from: 0.98;
  --motion-dialog-scale-from: 0.968;
  --motion-panel-offset: 8px;
  --motion-reduced-duration: 0.01ms;
  --ease-standard: cubic-bezier(0.25, 0.1, 0.25, 1);
  --ease-emphasized: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-move: cubic-bezier(0.77, 0, 0.175, 1);
  --motion-move: 150ms;
  --ease-spring: linear(0, 0.006, 0.025 2.8%, 0.101 6.1%, 0.539 18.9%, 0.721 25.3%, 0.849 31.5%, 0.937 38.1%, 0.968 41.8%, 0.991 45.7%, 1.006 50.1%, 1.015 55%, 1.017 63.9%, 1.001 85.9%, 1);
  --ease-express-enter: cubic-bezier(0.32, 0.72, 0, 1);
  --ease-express-hover: cubic-bezier(0.25, 0.46, 0.45, 0.94);
  --motion-express-hover: 100ms;
  --motion-express-swap: 160ms;
  --motion-express-enter: 600ms;
  --motion-express-enter-offset: 16px;
  --motion-express-stagger: 60ms;
  --motion-express-word: 560ms;
  --motion-express-word-stagger: 40ms;
  --motion-express-count: 1400ms;
  --motion-express-scrub: 400ms;
  --motion-express-spot: 300ms;
  --motion-express-glide: 340ms;
  --motion-express-roll: 520ms;
  --motion-express-tilt: 3;
  --motion-express-magnet: 2;
  --motion-express-ambient-flow: 3600ms;
  --motion-express-ambient-flow-step: 550ms;
  --motion-express-ambient-breathe: 4800ms;
  --motion-express-ambient-drift: 26000ms;
  --motion-express-ambient-drift-alt: 32000ms;
  --motion-express-ambient-marquee: 60000ms;
  --z-base: 0;
  --z-raised: 1;
  --z-sticky: 10;
  --z-navigation: 20;
  --z-workbench-controls: 30;
  --z-floating: 40;
  --z-celebrate: 45;
  --z-overlay: 50;
  --z-toast: 70;
  --z-skip-link: 90;
  --celebrate-count-burst: 320;
  --celebrate-gravity: 0.30;
  --celebrate-flip-floor: 0.22;
  --celebrate-back-mix: 0.30;
  --celebrate-lum-floor: 0.82;
  --shell-surface-border: var(--border);
  --checkbox-border: var(--input);
  --checkbox-border-standalone: lch(52.04% 0 282);
  --motion-checkbox: 80ms;
  --shadow-hairline: 0 0 0 0.5px rgba(0, 0, 0, 0.088);
  --shadow-hairline-hover: 0 0 0 0.5px rgba(0, 0, 0, 0.147);
  --shadow-main-surface: 0 3px 6px -2px rgba(0, 0, 0, 0.02),
    0 1px 1px rgba(0, 0, 0, 0.04);
  --chip-ring: rgba(0, 0, 0, 0.09);
  --chip-ring-strong: rgba(0, 0, 0, 0.15);
  --chip-surface: var(--control-idle);
  --chip-surface-hover: lch(95.883% 0.157 282);
  --chip-surface-pressed: lch(94.854% 0.157 282);
  --shadow-raised: 0 0 0 0.5px var(--chip-ring), var(--shadow-main-surface);
  --shadow-raised-hover: 0 0 0 0.5px var(--chip-ring-strong), var(--shadow-main-surface);
  --shadow-raised-pressed: 0 0 0 0.5px var(--chip-ring-strong);
  --settings-section-border: var(--border);
  --shadow-floating: 0 6px 18px rgba(0, 0, 0, 0.02),
    0 3px 9px rgba(0, 0, 0, 0.04),
    0 1px 1px rgba(0, 0, 0, 0.04);
  --shadow-dialog: 0 9px 48px rgba(0, 0, 0, 0.08),
    0 6px 24px rgba(0, 0, 0, 0.1),
    0 1px 1px rgba(0, 0, 0, 0.04);
  --background: lch(94.44% 0.5 282);
  --work-surface: lch(97.94% 0.5 282);
  --sub-surface: lch(96.8% 0.4 282);
  --card: lch(99.3% 0.3 282);
  --elevated: lch(100% 0 282);
  --popover: lch(100% 0 282);
  --select-compact-list-surface: lch(97.94% 0.5 282);
  --select-compact-list-border: lch(84.44% 0 282);
  --select-compact-list-hover: var(--menu-item-hover);
  --menu: lch(100% 0 282);
  --overlay-surface: lch(100% 0 282);
  --modal-scrim: rgba(0, 0, 0, 0.25);
  --foreground: lch(9.794% 0 282);
  --secondary-foreground: lch(19.588% 1.25 282);
  --muted-foreground: lch(36% 1.25 282);
  --disabled-foreground: lch(64.64% 1.25 282);
  --inverse-foreground: lch(100% 0 282);
  --border-subtle: lch(95.24% 0 282);
  --border: lch(89.84% 0 282);
  --border-segmented: lch(84.44% 0 282);
  --border-strong: lch(78.5% 1.48 282);
  --border-focus: #6d78d5;
  --border-selected: #6d78d5;
  --link-foreground: #6d78d5;
  --border-invalid: lch(45.5% 54 29);
  --input: lch(86.5% 0 282);
  --overlay-border: lch(91.9% 0 282);
  --overlay-divider: lch(91.9% 0 282);
  --modal-border: var(--overlay-border);
  --modal-surface: lch(100% 0 282);
  --overlay-surface-in-modal: var(--overlay-surface);
  --overlay-border-in-modal: var(--overlay-border);
  --overlay-divider-in-modal: var(--overlay-divider);
  --overlay-foreground-in-modal: var(--overlay-foreground);
  --overlay-muted-in-modal: var(--menu-muted);
  --overlay-foreground: var(--secondary-foreground);
  --menu-muted: lch(40% 1 282);
  --menu-item-hover: lch(95% 0 282);
  --control-idle: lch(99.997% 0.5 282);
  --control-hover: lch(94.5% 0.157 282);
  --control-current: lch(89.54% 0.5 282);
  --control-selected: lch(91% 0 282);
  --control-checked: lch(53% 52.26 286.91);
  --control-open: lch(94.854% 0.157 282);
  --tab-current: lch(93.48% 0.5 282);
  --tab-idle: var(--control-idle);
  --tab-hover: lch(94.854% 0.5 282);
  --rail-item-hover: lch(91.43% 0.5 282);
  --rail-item-current: var(--control-current);
  --rail-control-idle: lch(90.55% 0.4 282);
  --rail-control-quiet-hover: lch(0 0 0 / 0.06);
  --rail-control-hover: lch(88.17% 0.4 282);
  --row-step-hover: 5.2%;
  --row-step-current: 8%;
  --row-step-selected: 13%;
  --row-step-selected-hover: 19%;
  --row-fill-hover: var(--foreground);
  @supports (color: color-mix(in lab, red, red)) {
    --row-fill-hover: color-mix(in srgb, var(--foreground) var(--row-step-hover), var(--work-surface));
  }
  --row-fill-current: var(--foreground);
  @supports (color: color-mix(in lab, red, red)) {
    --row-fill-current: color-mix(in srgb, var(--foreground) var(--row-step-current), var(--work-surface));
  }
  --row-fill-selected: var(--primary);
  @supports (color: color-mix(in lab, red, red)) {
    --row-fill-selected: color-mix(in srgb, var(--primary) 10%, var(--work-surface));
  }
  --row-fill-selected-hover: var(--primary);
  @supports (color: color-mix(in lab, red, red)) {
    --row-fill-selected-hover: color-mix(in srgb, var(--primary) 16%, var(--work-surface));
  }
  --segmented-track: var(--tab-current);
  --segmented-current: var(--elevated);
  --segmented-option-current: lch(95.54% 0 282);
  --chip-current: lch(94.86% 0 282);
  --option-well: lch(100% 0 282);
  --option-well-hover: lch(96.914% 0 282);
  --select-well-hover: lch(95.886% 0 282);
  --select-open-border: lch(75.7% 0 282);
  --option-well-hover-foreground: var(--overlay-foreground);
  --switch-track-off: lch(82.5% 0.05 282);
  --switch-track-off-hover: lch(76.98% 0.08 282);
  --control-checked-hover: lch(47% 50.26 286.91);
  --switch-track-on-hover: lch(47% 50.26 286.91);
  --field: lch(100% 0 282);
  --field-border: lch(86.5% 1.48 282);
  --field-border-hover: lch(80% 1.48 282);
  --field-border-pressed: lch(74% 1.48 282);
  --primary: lch(48.5% 52.26 286.91);
  --primary-hover: lch(44% 50.26 286.91);
  --primary-pressed: var(--primary-hover);
  --primary-foreground: lch(100% 5 286.91);
  --destructive: lch(42% 80 29);
  --destructive-wash: lch(93.966% 7.33 19.355);
  --destructive-solid: lch(44% 74 29);
  --destructive-solid-hover: lch(40% 72 29);
  --destructive-solid-foreground: #fff;
  --invalid: lch(45.5% 54 29);
  --status-info: #2563b9;
  --status-healthy: #086646;
  --status-warning: #7a5000;
  --status-error: #ae1f29;
  --status-idle: #686870;
  --status-stale: #6b6252;
  --status-offline: #686870;
  --status-unknown: #686870;
  --status-soft-alpha: 12%;
  --entity-identity-graphite: oklch(0.43 0.018 270);
  --entity-identity-blue: oklch(0.5 0.11 250);
  --entity-identity-indigo: oklch(0.48 0.12 275);
  --entity-identity-violet: oklch(0.5 0.11 310);
  --entity-identity-magenta: oklch(0.5 0.11 340);
  --entity-identity-amber: oklch(0.5 0.085 78);
  --entity-identity-cyan: oklch(0.5 0.075 215);
  --entity-identity-teal: oklch(0.48 0.075 165);
  --celebrate-1: #5e6ad2;
  --celebrate-2: #8b95e6;
  --celebrate-3: #12a594;
  --celebrate-4: #e8a317;
  --celebrate-5: #ef6449;
  --celebrate-6: #d9407a;
  --celebrate-7: #3da35d;
  --celebrate-8: #3b82f6;
  --financial-positive: oklch(0.43 0.1274 163.23);
  --financial-negative: oklch(0.47 0.1648 27.45);
  --financial-neutral: #52525b;
  --risk: oklch(0.491 0.154 58.3);
  --chart-1: lch(53% 52.26 287);
  --chart-2: #348542;
  --chart-3: #cf3e46;
  --chart-4: #9f6800;
  --chart-5: #8e4ec6;
  --chart-composition-gross: #2a78d6;
  --chart-composition-fee: #eb6834;
  --chart-composition-funding: #1baf7a;
  --chart-axis-border: var(--muted-foreground);
  @supports (color: color-mix(in lab, red, red)) {
    --chart-axis-border: color-mix(in srgb, var(--muted-foreground) 20%, transparent);
  }
  --chart-grid-line: var(--muted-foreground);
  @supports (color: color-mix(in lab, red, red)) {
    --chart-grid-line: color-mix(in srgb, var(--muted-foreground) 14%, transparent);
  }
  --chart-crosshair-line: var(--foreground);
  @supports (color: color-mix(in lab, red, red)) {
    --chart-crosshair-line: color-mix(in srgb, var(--foreground) 28%, transparent);
  }
  --chart-zero-line: var(--foreground);
  @supports (color: color-mix(in lab, red, red)) {
    --chart-zero-line: color-mix(in srgb, var(--foreground) 50%, transparent);
  }
  --focus-ring-width: 1px;
  --focus-ring-color: var(--border-focus);
  --identity-tint-rest: 17.5%;
  --identity-tint-active: 24%;
  --focus-offset-default: 0px;
  --focus-offset-standalone: 2px;
  --focus-offset-inset: 0;
  --focus-offset-clipped: -1px;
}
.dark {
  --background: lch(2.595% 0.4 272);
  --work-surface: lch(5.52% 0.4 272);
  --sub-surface: lch(7.32% 0.85 272);
  --card: lch(8.22% 1.3 272);
  --elevated: lch(10.8% 1.05 272);
  --popover: lch(12.72% 0.85 272);
  --select-compact-list-surface: lch(5.52% 0.4 272);
  --select-compact-list-border: lch(16.32% 1.48 272);
  --select-compact-list-hover: lch(14.777% 1.075 272);
  --menu: lch(12.72% 0.85 272);
  --overlay-surface: lch(12.72% 0.85 272);
  --modal-surface: lch(9.232% 0.85 272);
  --modal-scrim: rgba(0, 0, 0, 0.4);
  --foreground: lch(100% 0 272);
  --secondary-foreground: lch(90.451% 1.2 272);
  --muted-foreground: lch(66% 1.2 272);
  --disabled-foreground: lch(36.975% 1.2 272);
  --inverse-foreground: lch(5.52% 0.4 272);
  --border-subtle: lch(9.84% 1.48 272);
  --border: lch(14.16% 1.48 272);
  --border-segmented: lch(18.48% 1.48 272);
  --border-strong: lch(28.032% 1.48 272);
  --border-focus: #8b95e6;
  --border-selected: #8b95e6;
  --link-foreground: lch(80% 80 288.43);
  --border-invalid: lch(71.06% 38 22.22);
  --input: lch(30.833% 1.93 272);
  --overlay-border: lch(25.68% 1.93 272);
  --overlay-divider: lch(20.28% 1.93 272);
  --modal-border: lch(22.193% 1.93 272);
  --overlay-surface-in-modal: lch(16.433% 1.3 272);
  --overlay-border-in-modal: lch(29.393% 2.38 272);
  --overlay-divider-in-modal: lch(20.753% 2.38 272);
  --overlay-foreground-in-modal: lch(91.554% 1.65 272);
  --overlay-muted-in-modal: lch(66.215% 1.65 272);
  --overlay-foreground: lch(91.178% 1.425 272);
  --menu-muted: lch(64.714% 1.425 272);
  --menu-item-hover: lch(20.82% 1.3 272);
  --control-idle: lch(8.22% 1.1 272);
  --control-hover: lch(12.2% 1.1 272);
  --control-current: lch(13.845% 1.3 272);
  --control-selected: lch(13.845% 1.429 272);
  --control-checked: lch(47.918% 59.303 288.421);
  --control-open: lch(18.634% 1.075 272);
  --tab-current: lch(16.706% 0.979 272);
  --tab-idle: lch(10.149% 0.593 272);
  --tab-hover: lch(14.006% 0.593 272);
  --rail-item-hover: lch(8.445% 1.3 272);
  --rail-item-current: var(--control-current);
  --rail-control-idle: lch(10.149% 0.689 272);
  --rail-control-quiet-hover: lch(100 0 0 / 0.06);
  --rail-control-hover: lch(14.777% 1.075 272);
  --row-step-hover: 3.7%;
  --row-step-current: 5.7%;
  --row-step-selected: 14%;
  --row-step-selected-hover: 17%;
  --row-fill-hover: var(--foreground);
  @supports (color: color-mix(in lab, red, red)) {
    --row-fill-hover: color-mix(in srgb, var(--foreground) var(--row-step-hover), var(--work-surface));
  }
  --row-fill-current: var(--foreground);
  @supports (color: color-mix(in lab, red, red)) {
    --row-fill-current: color-mix(in srgb, var(--foreground) var(--row-step-current), var(--work-surface));
  }
  --row-fill-selected: lch(12.141% 17.792 286.445);
  --row-fill-selected-hover: lch(15.966% 18.242 286.445);
  --segmented-track: var(--tab-current);
  --segmented-current: lch(20.418% 1.429 272);
  --segmented-option-current: lch(23.906% 1.429 272);
  --chip-current: lch(25.834% 1.525 272);
  --option-well: lch(17.349% 1.043 272);
  --option-well-hover: lch(21.206% 1.043 272);
  --select-well-hover: lch(21.977% 1.525 272);
  --select-open-border: lch(27.84% 1.93 272);
  --option-well-hover-foreground: var(--overlay-foreground);
  --switch-track-off: lch(48.247% 0.93 272);
  --switch-track-off-hover: lch(56.807% 1.019 272);
  --control-checked-hover: lch(52.418% 61.103 288.421);
  --switch-track-on-hover: lch(47.918% 70 288.421);
  --field: lch(9.232% 0.85 272);
  --field-border: lch(30.833% 1.93 272);
  --field-border-hover: lch(28.032% 6.93 272);
  --field-border-pressed: var(--field-border-hover);
  --primary: lch(47.918% 59.303 288.421);
  --primary-hover: lch(47.918% 70 288.421);
  --primary-pressed: var(--primary-hover);
  --primary-foreground: lch(100% 5 288.421);
  --destructive: #ff8583;
  --destructive-wash: lch(14.272% 13.438 19.784);
  --destructive-solid: lch(46% 70 29);
  --destructive-solid-hover: lch(50% 66 29);
  --destructive-solid-foreground: #fff;
  --invalid: lch(71.06% 38 22.22);
  --status-info: #60a5fa;
  --status-healthy: #34d399;
  --status-warning: #fbbf24;
  --status-error: #f87171;
  --status-idle: #a1a1aa;
  --status-stale: #c4b99f;
  --status-offline: #a1a1aa;
  --status-unknown: #a1a1aa;
  --status-soft-alpha: 15%;
  --entity-identity-graphite: oklch(0.7 0.018 270);
  --entity-identity-blue: oklch(0.72 0.105 250);
  --entity-identity-indigo: oklch(0.7 0.11 275);
  --entity-identity-violet: oklch(0.72 0.1 310);
  --entity-identity-magenta: oklch(0.72 0.1 340);
  --entity-identity-amber: oklch(0.76 0.1 78);
  --entity-identity-cyan: oklch(0.74 0.085 215);
  --entity-identity-teal: oklch(0.71 0.09 165);
  --celebrate-1: #8b95e6;
  --celebrate-2: #b4bbf7;
  --celebrate-3: #3fc1c9;
  --celebrate-4: #f6c445;
  --celebrate-5: #f2764b;
  --celebrate-6: #f0619a;
  --celebrate-7: #5bd9a4;
  --celebrate-8: #ffffff;
  --financial-positive: oklch(0.7729 0.1535 163.22);
  --financial-negative: oklch(0.7106 0.1661 22.22);
  --financial-neutral: #d4d4d8;
  --risk: oklch(0.7576 0.159 55.93);
  --chart-1: lch(58% 55 288);
  --chart-2: #46a758;
  --chart-3: #f4487e;
  --chart-4: #f1a10d;
  --chart-5: #bf7af0;
  --chart-composition-gross: #3987e5;
  --chart-composition-fee: #d95926;
  --chart-composition-funding: #199e70;
  --chart-axis-border: var(--muted-foreground);
  @supports (color: color-mix(in lab, red, red)) {
    --chart-axis-border: color-mix(in srgb, var(--muted-foreground) 24%, transparent);
  }
  --chart-grid-line: var(--muted-foreground);
  @supports (color: color-mix(in lab, red, red)) {
    --chart-grid-line: color-mix(in srgb, var(--muted-foreground) 16%, transparent);
  }
  --chart-crosshair-line: var(--foreground);
  @supports (color: color-mix(in lab, red, red)) {
    --chart-crosshair-line: color-mix(in srgb, var(--foreground) 42%, transparent);
  }
  --chart-zero-line: var(--foreground);
  @supports (color: color-mix(in lab, red, red)) {
    --chart-zero-line: color-mix(in srgb, var(--foreground) 40%, transparent);
  }
  --focus-ring-color: var(--border-focus);
  --scrollbar-thumb: lch(37.275% 1.2 272);
  --scrollbar-thumb-hover: lch(37.375% 1.2 272);
  --scrollbar-thumb-active: lch(36.975% 1.2 272);
  --shadow-main-surface: 0 0.5px 1px 1px rgba(0, 0, 0, 0.3);
  --shell-surface-border: lch(13.08% 1.48 272);
  --checkbox-border: lch(55.92% 1.93 272);
  --checkbox-border-standalone: lch(55.92% 1.93 272);
  --shadow-hairline: 0 0 0 0.5px lch(100% 0 272 / 0.148);
  --shadow-hairline-hover: 0 0 0 0.5px lch(100% 0 272 / 0.247);
  --chip-surface: lch(10.149% 0.689 272);
  --chip-surface-hover: lch(14.777% 1.075 272);
  --chip-surface-pressed: var(--control-open);
  --chip-ring: lch(100% 0 272 / 0.137);
  --chip-ring-strong: lch(100% 0 272 / 0.229);
  --shadow-raised: 0 0 0 0.5px var(--chip-ring), var(--shadow-main-surface);
  --shadow-raised-hover: 0 0 0 0.5px var(--chip-ring-strong), var(--shadow-main-surface);
  --shadow-raised-pressed: 0 0 0 0.5px var(--chip-ring-strong);
  --settings-section-border: var(--overlay-divider);
  --shadow-floating: 0 3px 8px rgba(0, 0, 0, 0.125),
    0 2px 5px rgba(0, 0, 0, 0.125),
    0 1px 1px rgba(0, 0, 0, 0.125);
  --shadow-dialog: 0 4px 40px rgba(0, 0, 0, 0.1),
    0 3px 20px rgba(0, 0, 0, 0.125),
    0 3px 12px rgba(0, 0, 0, 0.125),
    0 2px 8px rgba(0, 0, 0, 0.125),
    0 1px 1px rgba(0, 0, 0, 0.125);
}
:root, .dark {
  --status-info-soft: var(--status-info);
  @supports (color: color-mix(in lab, red, red)) {
    --status-info-soft: color-mix(in oklab, var(--status-info) 8%, transparent);
  }
  --status-healthy-soft: var(--status-healthy);
  @supports (color: color-mix(in lab, red, red)) {
    --status-healthy-soft: color-mix(in oklab, var(--status-healthy) var(--status-soft-alpha), transparent);
  }
  --status-warning-soft: var(--status-warning);
  @supports (color: color-mix(in lab, red, red)) {
    --status-warning-soft: color-mix(in oklab, var(--status-warning) var(--status-soft-alpha), transparent);
  }
  --status-error-soft: var(--status-error);
  @supports (color: color-mix(in lab, red, red)) {
    --status-error-soft: color-mix(in oklab, var(--status-error) var(--status-soft-alpha), transparent);
  }
  --status-idle-soft: var(--status-idle);
  @supports (color: color-mix(in lab, red, red)) {
    --status-idle-soft: color-mix(in oklab, var(--status-idle) var(--status-soft-alpha), transparent);
  }
  --status-stale-soft: var(--status-stale);
  @supports (color: color-mix(in lab, red, red)) {
    --status-stale-soft: color-mix(in oklab, var(--status-stale) var(--status-soft-alpha), transparent);
  }
  --status-offline-soft: var(--status-offline);
  @supports (color: color-mix(in lab, red, red)) {
    --status-offline-soft: color-mix(in oklab, var(--status-offline) var(--status-soft-alpha), transparent);
  }
  --status-unknown-soft: var(--status-unknown);
  @supports (color: color-mix(in lab, red, red)) {
    --status-unknown-soft: color-mix(in oklab, var(--status-unknown) var(--status-soft-alpha), transparent);
  }
  --financial-positive-soft: var(--financial-positive);
  @supports (color: color-mix(in lab, red, red)) {
    --financial-positive-soft: color-mix(in oklab, var(--financial-positive) 14%, transparent);
  }
  --financial-negative-soft: var(--financial-negative);
  @supports (color: color-mix(in lab, red, red)) {
    --financial-negative-soft: color-mix(in oklab, var(--financial-negative) 14%, transparent);
  }
  --risk-soft: var(--risk);
  @supports (color: color-mix(in lab, red, red)) {
    --risk-soft: color-mix(in oklab, var(--risk) 14%, transparent);
  }
  --chart-surface: var(--work-surface);
  --chart-brush-mask: var(--chart-surface);
  @supports (color: color-mix(in lab, red, red)) {
    --chart-brush-mask: color-mix(in srgb, var(--chart-surface) 70%, transparent);
  }
  --chart-brush-window: var(--primary);
  @supports (color: color-mix(in lab, red, red)) {
    --chart-brush-window: color-mix(in srgb, var(--primary) 12%, transparent);
  }
  --chart-axis-text: var(--muted-foreground);
  --chart-crosshair-label-background: var(--background);
  --chart-series-reference: var(--muted-foreground);
  --chart-series-open: var(--chart-4);
  --chart-series-funding: var(--chart-2);
  --chart-series-rebate: var(--chart-5);
  --chart-composition-rebate: var(--chart-composition-fee);
  @supports (color: color-mix(in lab, red, red)) {
    --chart-composition-rebate: color-mix(in srgb, var(--chart-composition-fee) 48%, #ffffff);
  }
  --chart-composition-network: var(--chart-composition-fee);
  @supports (color: color-mix(in lab, red, red)) {
    --chart-composition-network: color-mix(in srgb, var(--chart-composition-fee) 70%, var(--foreground));
  }
  --data-alert-color: var(--status-error);
  --focus-ring-outline: var(--focus-ring-width) solid var(--focus-ring-color);
}
@layer base {
  :focus-visible {
    outline: var(--focus-ring-outline);
    outline-offset: var(--focus-offset-default);
  }
  :root {
    scrollbar-color: var(--scrollbar-thumb) transparent;
  }
  ::-webkit-scrollbar {
    width: var(--scrollbar-size);
    height: var(--scrollbar-size);
  }
  ::-webkit-scrollbar-track, ::-webkit-scrollbar-corner {
    background: transparent;
  }
  ::-webkit-scrollbar-thumb {
    border: var(--scrollbar-thumb-border) solid transparent;
    border-radius: var(--radius-pill);
    background-color: var(--scrollbar-thumb);
    background-clip: padding-box;
  }
  ::-webkit-scrollbar-thumb:hover {
    background-color: var(--scrollbar-thumb-hover);
  }
  ::-webkit-scrollbar-thumb:active {
    background-color: var(--scrollbar-thumb-active);
  }
}
.base-ui-disable-scrollbar {
  scrollbar-width: none;
}
.base-ui-disable-scrollbar::-webkit-scrollbar {
  display: none;
}
:where( button, summary, a[href], input, select, textarea, [role="button"], [role="tab"], [role="link"], [role="menuitem"], [role="menuitemcheckbox"], [role="menuitemradio"], [role="option"], [role="switch"], [role="checkbox"], [role="radio"], [role="combobox"] ):is( :hover, :active, [data-state="open"], [aria-expanded="true"], [aria-current="page"], [data-popup-open], [data-active="true"], [data-focused="true"] ) {
  --motion-control: var(--motion-in);
}
[aria-invalid="true"]:focus-visible {
  --focus-ring-color: var(--invalid);
}
html :is([data-slot="checkbox"], [data-slot="switch"]):focus-visible {
  outline: var(--focus-ring-outline);
  outline-offset: var(--focus-offset-inset);
}
html :is([data-slot="checkbox"], [data-slot="switch"])[aria-invalid="true"]:focus-visible {
  outline-color: var(--invalid);
}
@media (forced-colors: active) {
  html :is([data-slot="checkbox"], [data-slot="switch"]) {
    border-color: ButtonText;
    background: Canvas;
    color: ButtonText;
    forced-color-adjust: none;
  }
  html [data-slot="checkbox"]:is([data-checked], [data-indeterminate]) {
    border-color: Highlight;
    background: Highlight;
    color: HighlightText;
  }
  html [data-slot="switch"] > [data-slot="switch-thumb"] {
    background: ButtonText;
  }
  html [data-slot="switch"] {
    outline: var(--border-width-control) solid ButtonText;
    outline-offset: var(--focus-offset-inset);
  }
  html [data-slot="switch"][data-checked] {
    background: Highlight;
  }
  html [data-slot="switch"][data-checked] > [data-slot="switch-thumb"] {
    background: HighlightText;
  }
  html :is([data-slot="checkbox"], [data-slot="switch"])[aria-invalid="true"]:focus-visible {
    outline-color: Highlight;
  }
}
.zml-sidebar-footer {
  display: flex;
  flex-direction: column;
  flex-shrink: 0;
  align-items: stretch;
  gap: 1px;
  padding-top: var(--space-inline-standard);
}
.zml-connection-summary {
  height: var(--control-standard);
  min-height: var(--control-standard);
  align-items: center;
  gap: 0.375rem;
  padding-inline: var(--space-inline-standard);
  border-radius: var(--radius-control);
  font-size: var(--type-workbench-secondary);
  line-height: var(--type-workbench-secondary-line);
  font-weight: var(--font-weight-regular);
}
@media (any-pointer: coarse) {
  .zml-connection-summary {
    height: auto;
    min-height: var(--hit-plane-coarse);
  }
}
.zml-connection-summary-compact {
  min-height: var(--control-standard);
  align-items: center;
}
.zml-sidebar-preview {
  position: fixed;
  block-size: auto;
  inset-block-start: var(--shell-bar-height);
  inset-block-end: 0;
  inset-inline-start: 0;
  z-index: var(--z-floating);
  width: calc(var(--shell-rail-width) - var(--shell-navigation-inset) - 1px - var(--scrollbar-size-rail));
  border-start-end-radius: var(--radius-floating);
  border-end-end-radius: var(--radius-floating);
  background: var(--work-surface);
  opacity: 1;
  transform: translateX(0);
  transition: opacity var(--motion-overlay) var(--ease-emphasized), transform var(--motion-overlay) var(--ease-emphasized);
}
@starting-style {
  .zml-sidebar-preview {
    opacity: 0;
    transform: translateX(-8px);
  }
}
@media (prefers-reduced-motion: reduce) {
  .zml-sidebar-preview {
    transition: none;
  }
}
.zml-sidebar-reveal-edge {
  position: fixed;
  inset-inline-start: 0;
  top: var(--shell-bar-height);
  bottom: 0;
  width: var(--shell-wide-inset);
  z-index: var(--z-navigation);
}
[data-slot="sidebar-mode-glyph"] [data-part] {
  transform-box: fill-box;
  transform-origin: center;
  transition: opacity var(--motion-micro) var(--ease-standard), transform var(--motion-control) var(--ease-standard);
}
[data-slot="sidebar-mode-glyph"][data-pinned="true"] [data-part="divider"] {
  opacity: 1;
  transform: none;
}
[data-slot="sidebar-mode-glyph"][data-pinned="true"] [data-part="collapse"], [data-slot="sidebar-mode-glyph"][data-pinned="true"] [data-part="expand"] {
  opacity: 0;
}
@media (hover: hover) and (pointer: fine) {
  [data-slot="sidebar-mode-button"]:hover [data-slot="sidebar-mode-glyph"][data-pinned="true"] [data-part="divider"] {
    opacity: 0;
    transform: translateX(-2px);
  }
}
[data-slot="sidebar-mode-button"]:focus-visible [data-slot="sidebar-mode-glyph"][data-pinned="true"] [data-part="divider"] {
  opacity: 0;
  transform: translateX(-2px);
}
[data-slot="sidebar-mode-button"]:is(:hover, :focus-visible) [data-slot="sidebar-mode-glyph"][data-pinned="true"] [data-part="collapse"] {
  opacity: 1;
  transform: none;
}
[data-slot="sidebar-mode-button"]:is(:hover, :focus-visible) [data-slot="sidebar-mode-glyph"][data-pinned="true"] [data-part="expand"] {
  opacity: 0;
}
[data-slot="sidebar-mode-glyph"][data-pinned="false"] [data-part="divider"] {
  opacity: 0;
  transform: translateX(-2px);
}
[data-slot="sidebar-mode-glyph"][data-pinned="false"] [data-part="expand"] {
  opacity: 1;
  transform: none;
}
[data-slot="sidebar-mode-glyph"][data-pinned="false"] [data-part="collapse"] {
  opacity: 0;
}
[data-slot="sidebar-mode-button"]:is(:hover, :focus-visible) [data-slot="sidebar-mode-glyph"][data-pinned="false"] [data-part="divider"] {
  opacity: 1;
  transform: none;
}
@media (prefers-reduced-motion: reduce) {
  [data-slot="sidebar-mode-glyph"] [data-part] {
    transition: none;
  }
}
[data-zml-frozen-surface] {
  --font-sans: "Inter Variable", Inter, "PingFang SC", "Microsoft YaHei",
    "Noto Sans SC", ui-sans-serif, system-ui, -apple-system, "Segoe UI",
    sans-serif;
  --font-data: var(--font-sans);
  --font-feature-numeric: "tnum" 1, "kern" 1, "calt" 0;
  letter-spacing: normal;
  --type-workbench-primary: 13px;
  --type-workbench-primary-line: 18px;
  --type-workbench-secondary: 12px;
  --type-workbench-secondary-line: 16px;
  --type-row-title: 13px;
  --type-row-title-line: 18px;
  --row-single: 44px;
  --row-dual: 46px;
  --table-header: 32px;
  --cell-inline: 12px;
  --cell-gap: 8px;
  --data-message-row: 14px;
  --data-annotation-row: 20px;
  --data-matrix-inset: 10px;
  --data-header-coarse: 44px;
  --data-matrix-identity-default: 150px;
  --data-matrix-venue-default: 104px;
  --work-surface: lch(97.94% 0.5 282);
  --sub-surface: lch(96.8% 0.4 282);
  --foreground: lch(9.794% 0 282);
  --muted-foreground: lch(36% 1.25 282);
  --border-subtle: lch(95.24% 0 282);
  --border: lch(89.84% 0 282);
  --control-hover: lch(94.5% 0.157 282);
  --control-open: lch(87.36% 0.157 282);
  --control-selected: lch(91% 0 282);
  --motion-checkbox: var(--motion-control);
  --disabled-foreground: lch(61.803% 1.2 282);
  --focus-offset-default: 1px;
  --primary-hover: lch(47% 50.26 286.91);
  --menu-muted: lch(39.176% 1.25 282);
  --destructive: lch(45.5% 54 29);
  scrollbar-color: var(--foreground) transparent;
  @supports (color: color-mix(in lab, red, red)) {
    scrollbar-color: color-mix(in srgb, var(--foreground) 18%, transparent) transparent;
  }
}
.dark [data-zml-frozen-surface] {
  --work-surface: lch(5.52% 0.4 272);
  --sub-surface: lch(7.32% 0.85 272);
  --card: lch(8.22% 1.1 272);
  --foreground: lch(100% 0 272);
  --muted-foreground: lch(66% 1.2 272);
  --disabled-foreground: lch(35.024% 1.2 272);
  --border-subtle: lch(9.84% 1.48 272);
  --border: lch(14.16% 1.48 272);
  --control-hover: lch(12.2% 1.1 272);
  --control-open: lch(18.634% 1.075 272);
  --control-selected: lch(13.845% 1.429 272);
  --motion-checkbox: var(--motion-control);
  --focus-ring-color: var(--border-focus);
  --primary-hover: lch(44% 59.303 288.421);
  --menu-muted: lch(60.621% 1.2 272);
  --field-border-pressed: lch(32% 1.48 272);
  --destructive: lch(71.06% 38 22.22);
}
[data-combo-table-scroll]:has(> [data-zml-frozen-surface]) {
  scrollbar-color: color-mix(in srgb, lch(9.444% 0 282) 18%, transparent) transparent;
}
.dark [data-combo-table-scroll]:has(> [data-zml-frozen-surface]) {
  scrollbar-color: color-mix(in srgb, lch(100% 0 272) 18%, transparent) transparent;
}
[data-slot="main-surface"]:focus, #settings-main-content:focus {
  outline: none;
}
:is([data-zml-surface="data"], [data-slot="table-surface"]) {
  border: var(--border-width-hairline) solid var(--border);
  border-radius: var(--radius-data-surface);
}
:is([data-zml-surface="data"], [data-slot="table-surface"]) :is([data-zml-surface="data"], [data-slot="table-surface"]), [data-zml-surface="none"], [data-zml-surface="none"] :is([data-zml-surface="data"], [data-slot="table-surface"]) {
  border: 0;
  border-radius: 0;
}
[data-slot="management-body"] [data-slot="table-surface"] {
  border: 0;
  border-radius: 0;
}
@media (max-width: 479px) {
  [data-slot="table-surface"] {
    border-inline: 0;
    border-radius: 0;
  }
}
@container table (max-width: 479px) {
  [data-slot="table-surface"] > table {
    --table-column-asset: 80px;
    --table-column-venue: 112px;
    --table-column-status: 88px;
    --table-column-metric: 112px;
    --table-column-metric-wide: 128px;
    --table-column-identity: 128px;
    --table-column-time: 144px;
    --table-column-body: 160px;
    --table-column-fill: 128px;
    --table-column-amount: calc(var(--table-column-metric) - 2 * var(--cell-inline));
    --table-narrow-asset: var(--table-column-asset);
    --table-narrow-venue: var(--table-column-venue);
    --table-narrow-status: var(--table-column-status);
    --table-narrow-metric: var(--table-column-metric);
    --table-narrow-metric-wide: var(--table-column-metric-wide);
    --table-narrow-identity: var(--table-column-identity);
    --table-narrow-time: var(--table-column-time);
    --table-narrow-action: var(--table-column-action);
    --table-narrow-body: var(--table-column-body);
  }
}
.zml-virtual-row {
  contain: layout style paint;
}
[data-slot="table-surface"], [data-pattern="loading-anatomy"][data-anatomy="table"] {
  --zml-table-head-step: 7.5%;
  --zml-table-head-border: var(--foreground);
  @supports (color: color-mix(in lab, red, red)) {
    --zml-table-head-border: color-mix(in srgb, var(--foreground) var(--zml-table-head-step), var(--zml-table-host-surface));
  }
  --zml-table-host-surface: var(--zml-table-surface, var(--work-surface));
  --zml-table-stripe-surface: var(--foreground);
  @supports (color: color-mix(in lab, red, red)) {
    --zml-table-stripe-surface: color-mix(in srgb, var(--foreground) 4.5%, var(--zml-table-host-surface));
  }
  --zml-table-row-line: var(--foreground);
  @supports (color: color-mix(in lab, red, red)) {
    --zml-table-row-line: color-mix(in srgb, var(--foreground) 3.5%, var(--zml-table-surface, var(--zml-table-host-surface)));
  }
}
[data-slot="table-surface"] > table > tbody > tr {
  --zml-row-base: var(--zml-table-surface, var(--zml-table-host-surface));
  --row-fill-hover: var(--foreground);
  @supports (color: color-mix(in lab, red, red)) {
    --row-fill-hover: color-mix(in srgb, var(--foreground) var(--row-step-hover), var(--zml-row-base));
  }
  --row-fill-current: var(--foreground);
  @supports (color: color-mix(in lab, red, red)) {
    --row-fill-current: color-mix(in srgb, var(--foreground) var(--row-step-current), var(--zml-row-base));
  }
  --row-fill-selected: var(--primary);
  @supports (color: color-mix(in lab, red, red)) {
    --row-fill-selected: color-mix(in srgb, var(--primary) var(--row-step-selected), var(--zml-row-base));
  }
  --row-fill-selected-hover: var(--primary);
  @supports (color: color-mix(in lab, red, red)) {
    --row-fill-selected-hover: color-mix(in srgb, var(--primary) var(--row-step-selected-hover), var(--zml-row-base));
  }
}
[data-slot="table-surface"][data-overflow] > table > tbody > tr:not([data-state]):hover > :is(td, th) {
  background: var(--row-fill-hover);
}
.dark [data-slot="table-surface"], .dark [data-pattern="loading-anatomy"][data-anatomy="table"] {
  --zml-table-stripe-surface: var(--foreground);
  @supports (color: color-mix(in lab, red, red)) {
    --zml-table-stripe-surface: color-mix(in srgb, var(--foreground) 3.5%, var(--zml-table-host-surface));
  }
  --zml-table-row-line: var(--foreground);
  @supports (color: color-mix(in lab, red, red)) {
    --zml-table-row-line: color-mix(in srgb, var(--foreground) 2.5%, var(--zml-table-surface, var(--zml-table-host-surface)));
  }
  --zml-table-head-step: 5.5%;
}
[data-slot="table-surface"]:not([data-combo-table-host]) > table > tbody > tr > :is(td, th) {
  border-bottom: var(--border-width-hairline) solid var(--zml-table-row-line);
}
[data-slot="table-surface"]:not([data-combo-table-host]) > table > tbody > tr:last-child > :is(td, th) {
  border-bottom: 0;
}
[data-slot="table-surface"][data-overflow][data-stripe=""] tr[data-stripe="odd"] {
  --zml-table-surface: var(--zml-table-stripe-surface);
}
[data-slot="table-surface"][data-overflow][data-stripe="auto"] tbody tr:nth-child(even) {
  --zml-table-surface: var(--zml-table-stripe-surface);
}
.zml-cell-lede {
  display: flex;
  min-width: 0;
  align-items: baseline;
}
.zml-cell-lede > .zml-cell-lede-mark {
  align-self: center;
  flex: none;
}
[data-slot="entity-mark"][data-mark-tier="compact"] {
  width: 14px;
  height: 14px;
  --zml-mark-monogram: 8px;
}
[data-slot="entity-mark"][data-mark-tier="row"] {
  width: 16px;
  height: 16px;
  --zml-mark-monogram: 9px;
}
[data-slot="entity-mark"][data-mark-tier="stacked"] {
  width: 20px;
  height: 20px;
  --zml-mark-monogram: 11px;
}
[data-slot="entity-mark"][data-mark-tier="profile"] {
  width: 32px;
  height: 32px;
  --zml-mark-monogram: 18px;
}
[data-slot="entity-mark"] > [data-mark-monogram] {
  font-size: var(--zml-mark-monogram);
}
.zml-entity-mark-pair[data-mark-tier="compact"] {
  --zml-mark-size: 14px;
  --zml-mark-overlap: 3px;
}
.zml-entity-mark-pair[data-mark-tier="row"] {
  --zml-mark-size: 16px;
  --zml-mark-overlap: 3px;
}
.zml-entity-mark-pair[data-mark-tier="stacked"] {
  --zml-mark-size: 20px;
  --zml-mark-overlap: 4px;
}
.zml-entity-mark-pair[data-mark-tier="profile"] {
  --zml-mark-size: 32px;
  --zml-mark-overlap: 5px;
}
.zml-entity-mark-pair {
  display: inline-flex;
  flex: none;
  align-items: center;
  vertical-align: middle;
}
.zml-entity-mark-pair > :is([data-mark-slot="middle"], [data-mark-slot="secondary"]) {
  margin-inline-start: calc(var(--zml-mark-overlap) * -1);
  z-index: var(--z-raised);
}
.zml-entity-mark-pair[hidden] {
  display: none;
}
.zml-entity-mark-pair > [data-mark-slot="secondary"][hidden] {
  display: none;
}
.zml-entity-mark-pair[data-mark-notch="true"] > :is([data-mark-slot="primary"], [data-mark-slot="middle"]) {
  --zml-mark-notch-radius: calc(var(--zml-mark-size) / 2 + 1.5px);
  --zml-mark-notch-center: calc(var(--zml-mark-size) * 1.5 - var(--zml-mark-overlap));
  -webkit-mask-image: radial-gradient(circle var(--zml-mark-notch-radius) at var(--zml-mark-notch-center) 50%, transparent 100%, #000 100%);
  mask-image: radial-gradient(circle var(--zml-mark-notch-radius) at var(--zml-mark-notch-center) 50%, transparent 100%, #000 100%);
}
.zml-entity-mark-pair[data-mark-notch="true"]:dir(rtl) > :is([data-mark-slot="primary"], [data-mark-slot="middle"]) {
  --zml-mark-notch-center: calc(var(--zml-mark-overlap) - var(--zml-mark-size) / 2);
}
[data-slot="table-surface"] > table > thead {
  border-bottom: 1px solid var(--zml-table-head-border);
}
[data-combo-table-host] [data-combo-column-head] {
  border-bottom: 1px solid var(--zml-combo-head-border);
}
[data-combo-table-host] {
  --zml-combo-head-border: var(--foreground);
  @supports (color: color-mix(in lab, red, red)) {
    --zml-combo-head-border: color-mix(in srgb, var(--foreground) 12%, var(--zml-table-host-surface, var(--work-surface)));
  }
  --zml-combo-family-gap: 8px;
}
.dark [data-combo-table-host] {
  --zml-combo-head-border: var(--foreground);
  @supports (color: color-mix(in lab, red, red)) {
    --zml-combo-head-border: color-mix(in srgb, var(--foreground) 11%, var(--zml-table-host-surface, var(--work-surface)));
  }
}
:is([data-slot="table-surface"], [data-scroll-x-owner]) {
  scroll-padding-inline-start: var(--zml-table-frozen-inline, 0px);
}
[data-slot="table-surface"][data-frozen-first-column] > table > :is(thead, tbody) > tr > :first-child:not([colspan]) {
  position: sticky;
  inset-inline-start: 0;
  z-index: 1;
}
[data-slot="table-edge"] {
  position: sticky;
  top: 0;
  inset-inline-start: 0;
  z-index: calc(var(--z-sticky) + 1);
  height: 0;
  pointer-events: none;
}
[data-slot="table-edge"] > [data-edge] {
  position: absolute;
  top: 0;
  width: calc(var(--space-inline-standard) + var(--space-section-standard));
  height: var(--zml-table-port-height, 0px);
  opacity: 0;
  transition: opacity var(--motion-control) var(--ease-standard);
}
[data-slot="table-edge"] > [data-edge="start"] {
  inset-inline-start: 0;
  background: linear-gradient(to right, var(--zml-table-host-surface, var(--zml-table-surface, var(--work-surface))) var(--space-inline-standard), transparent);
}
[data-slot="table-edge"] > [data-edge="end"] {
  --zml-table-edge-gutter: 0px;
  --zml-table-edge-solid: calc(max(var(--space-inline-standard), var(--zml-table-edge-cover, 0px)) + var(--zml-table-edge-gutter));
  inset-inline-end: calc(var(--zml-table-frozen-inline-end, 0px) - var(--zml-table-edge-gutter));
  width: calc(max(var(--space-inline-standard) + var(--space-section-standard), var(--zml-table-edge-cover, 0px)) + var(--zml-table-edge-gutter));
  background: linear-gradient(to left, var(--zml-table-host-surface, var(--zml-table-surface, var(--work-surface))) var(--zml-table-edge-solid), transparent);
}
:is([data-slot="table-surface"], [data-scroll-x-owner])[data-overflow]:not([data-at-end]) [data-slot="table-edge"] > [data-edge="end"] {
  --zml-table-edge-gutter: var(--zml-table-gutter, 0px);
}
:is([data-slot="table-surface"], [data-scroll-x-owner]):dir(rtl) [data-slot="table-edge"] > [data-edge="start"] {
  background: linear-gradient(to left, var(--zml-table-host-surface, var(--zml-table-surface, var(--work-surface))) var(--space-inline-standard), transparent);
}
:is([data-slot="table-surface"], [data-scroll-x-owner]):dir(rtl) [data-slot="table-edge"] > [data-edge="end"] {
  background: linear-gradient(to right, var(--zml-table-host-surface, var(--zml-table-surface, var(--work-surface))) var(--zml-table-edge-solid), transparent);
}
:is([data-slot="table-surface"], [data-scroll-x-owner])[data-overflow][data-scrolled]:not([data-frozen-start]) [data-edge="start"], :is([data-slot="table-surface"], [data-scroll-x-owner])[data-overflow]:not([data-at-end]) [data-edge="end"] {
  opacity: 1;
}
[data-edge-cut="2"] > table > * > tr > :nth-child(2), [data-edge-cut="3"] > table > * > tr > :nth-child(3), [data-edge-cut="4"] > table > * > tr > :nth-child(4), [data-edge-cut="5"] > table > * > tr > :nth-child(5), [data-edge-cut="6"] > table > * > tr > :nth-child(6), [data-edge-cut="7"] > table > * > tr > :nth-child(7), [data-edge-cut="8"] > table > * > tr > :nth-child(8), [data-edge-cut="9"] > table > * > tr > :nth-child(9), [data-edge-cut="10"] > table > * > tr > :nth-child(10), [data-edge-cut="11"] > table > * > tr > :nth-child(11), [data-edge-cut="12"] > table > * > tr > :nth-child(12), [data-edge-cut="13"] > table > * > tr > :nth-child(13), [data-edge-cut="14"] > table > * > tr > :nth-child(14), [data-edge-cut="15"] > table > * > tr > :nth-child(15), [data-edge-cut="16"] > table > * > tr > :nth-child(16), [data-edge-cut="17"] > table > * > tr > :nth-child(17), [data-edge-cut="18"] > table > * > tr > :nth-child(18), [data-edge-cut="19"] > table > * > tr > :nth-child(19), [data-edge-cut="20"] > table > * > tr > :nth-child(20), [data-edge-cut="21"] > table > * > tr > :nth-child(21), [data-edge-cut="22"] > table > * > tr > :nth-child(22), [data-edge-cut="23"] > table > * > tr > :nth-child(23), [data-edge-cut="24"] > table > * > tr > :nth-child(24) {
  color: transparent;
}
[data-edge-cut="2"] > table > * > tr > :nth-child(2) > *, [data-edge-cut="3"] > table > * > tr > :nth-child(3) > *, [data-edge-cut="4"] > table > * > tr > :nth-child(4) > *, [data-edge-cut="5"] > table > * > tr > :nth-child(5) > *, [data-edge-cut="6"] > table > * > tr > :nth-child(6) > *, [data-edge-cut="7"] > table > * > tr > :nth-child(7) > *, [data-edge-cut="8"] > table > * > tr > :nth-child(8) > *, [data-edge-cut="9"] > table > * > tr > :nth-child(9) > *, [data-edge-cut="10"] > table > * > tr > :nth-child(10) > *, [data-edge-cut="11"] > table > * > tr > :nth-child(11) > *, [data-edge-cut="12"] > table > * > tr > :nth-child(12) > *, [data-edge-cut="13"] > table > * > tr > :nth-child(13) > *, [data-edge-cut="14"] > table > * > tr > :nth-child(14) > *, [data-edge-cut="15"] > table > * > tr > :nth-child(15) > *, [data-edge-cut="16"] > table > * > tr > :nth-child(16) > *, [data-edge-cut="17"] > table > * > tr > :nth-child(17) > *, [data-edge-cut="18"] > table > * > tr > :nth-child(18) > *, [data-edge-cut="19"] > table > * > tr > :nth-child(19) > *, [data-edge-cut="20"] > table > * > tr > :nth-child(20) > *, [data-edge-cut="21"] > table > * > tr > :nth-child(21) > *, [data-edge-cut="22"] > table > * > tr > :nth-child(22) > *, [data-edge-cut="23"] > table > * > tr > :nth-child(23) > *, [data-edge-cut="24"] > table > * > tr > :nth-child(24) > * {
  visibility: hidden;
}
:is([data-slot="table-surface"], [data-scroll-x-owner])[data-overflow][data-edge-cut] > [data-slot="table-edge"] > [data-edge="end"] {
  opacity: 0;
}
[data-slot="table-edge"] > [data-slot="table-reach"] {
  position: absolute;
  top: 0;
  inset-inline-end: calc(var(--zml-table-frozen-inline-end, 0px) + var(--space-inline-compact));
  display: none;
  height: var(--zml-table-header);
  align-items: center;
  pointer-events: auto;
}
:is([data-slot="table-surface"], [data-scroll-x-owner])[data-overflow]:not([data-at-end]) [data-slot="table-reach"] {
  display: flex;
}
@media (pointer: coarse) {
  :is([data-slot="table-surface"], [data-scroll-x-owner])[data-overflow] {
    scroll-snap-type: x proximity;
  }
  :is([data-slot="table-surface"], [data-scroll-x-owner])[data-overflow] :is(th, td, [role="gridcell"], [role="columnheader"]) {
    scroll-snap-align: start;
  }
}
@media (prefers-reduced-motion: reduce) {
  [data-slot="table-edge"] > [data-edge] {
    transition: none;
  }
}
@media (forced-colors: active) {
  [data-slot="table-edge"] > [data-edge] {
    display: none;
  }
}
:root[dir="rtl"] [data-icon-rtl-mirror] {
  transform: scaleX(-1);
}
.zml-data-row {
  background-color: var(--zml-data-row-surface, var(--work-surface));
}
.zml-combo-row[data-row-stripe="odd"] {
  --zml-combo-base-surface: var(--zml-combo-stripe-surface);
}
.zml-combo-row {
  --zml-combo-stripe-surface: var(--foreground);
  @supports (color: color-mix(in lab, red, red)) {
    --zml-combo-stripe-surface: color-mix(in srgb, var(--foreground) 9%, var(--zml-table-host-surface, var(--work-surface)));
  }
  --zml-combo-base-surface: var(--zml-table-host-surface, var(--work-surface));
  --zml-data-row-surface: var(--zml-combo-base-surface);
  --zml-combo-hover-surface: var(--foreground);
  @supports (color: color-mix(in lab, red, red)) {
    --zml-combo-hover-surface: color-mix(in srgb, var(--foreground) var(--row-step-hover), var(--zml-combo-base-surface));
  }
  --zml-combo-current-surface: var(--foreground);
  @supports (color: color-mix(in lab, red, red)) {
    --zml-combo-current-surface: color-mix(in srgb, var(--foreground) var(--row-step-current), var(--zml-combo-base-surface));
  }
  --zml-combo-selected-surface: var(--primary);
  @supports (color: color-mix(in lab, red, red)) {
    --zml-combo-selected-surface: color-mix(in srgb, var(--primary) var(--row-step-selected), var(--zml-combo-base-surface));
  }
  --zml-combo-selected-hover-surface: var(--primary);
  @supports (color: color-mix(in lab, red, red)) {
    --zml-combo-selected-hover-surface: color-mix(in srgb, var(--primary) var(--row-step-selected-hover), var(--zml-combo-base-surface));
  }
  --zml-combo-row-surface: var(--zml-data-row-surface, var(--work-surface));
  --zml-combo-column-step: 18%;
  --zml-combo-column-border: var(--foreground);
  @supports (color: color-mix(in lab, red, red)) {
    --zml-combo-column-border: color-mix(in srgb, var(--foreground) var(--zml-combo-column-step), var(--zml-combo-row-surface));
  }
  --zml-combo-frozen-step: 34%;
  --zml-combo-frozen-border: var(--foreground);
  @supports (color: color-mix(in lab, red, red)) {
    --zml-combo-frozen-border: color-mix(in srgb, var(--foreground) var(--zml-combo-frozen-step), var(--zml-combo-row-surface));
  }
}
[data-combo-table-host] :is(thead, [data-combo-column-head]) {
  --zml-combo-row-surface: var(--zml-table-host-surface, var(--work-surface));
  --zml-combo-column-step: 18%;
  --zml-combo-column-border: var(--foreground);
  @supports (color: color-mix(in lab, red, red)) {
    --zml-combo-column-border: color-mix(in srgb, var(--foreground) var(--zml-combo-column-step), var(--zml-combo-row-surface));
  }
}
.dark [data-combo-table-host] :is(thead, [data-combo-column-head]) {
  --zml-combo-column-step: 12%;
}
.dark .zml-combo-row {
  --zml-combo-stripe-surface: var(--foreground);
  @supports (color: color-mix(in lab, red, red)) {
    --zml-combo-stripe-surface: color-mix(in srgb, var(--foreground) 8%, var(--zml-table-host-surface, var(--work-surface)));
  }
  --zml-combo-column-step: 12%;
  --zml-combo-frozen-step: 26%;
}
.zml-combo-row > :is(th, td) {
  border-bottom-width: 0;
  border-inline-end: 1px solid var(--zml-combo-column-border);
}
.zml-combo-row :is([role="cell"], [role="gridcell"]):not(.zml-combo-drawer-band *)::after {
  content: "";
  position: absolute;
  inset-block: 0;
  inset-inline-end: 0;
  inline-size: 1px;
  background: var(--zml-combo-column-border);
  pointer-events: none;
}
.zml-combo-row :is([role="cell"], [role="gridcell"])[data-combo-frozen-edge="true"]::after {
  background: var(--zml-combo-frozen-border);
}
[data-combo-table-host] [data-combo-column-head] {
  border-inline-end: 1px solid var(--zml-combo-column-border);
}
.zml-combo-row > :is(th, td)[data-combo-column-end="true"], [data-combo-table-host] [data-combo-column-head][data-combo-column-end="true"] {
  border-inline-end-color: transparent;
}
.zml-combo-row :is([role="cell"], [role="gridcell"])[data-combo-column-end="true"]::after {
  content: none;
}
.zml-combo-row > [data-combo-alert-band="true"] {
  border-inline-end: 0;
}
.zml-combo-row > [data-combo-family-end="true"], .zml-combo-row :is([role="cell"], [role="gridcell"])[data-combo-family-end="true"]:not(.zml-combo-drawer-band *) {
  padding-inline-end: calc(var(--zml-cell-inline, var(--cell-inline)) + var(--zml-combo-family-gap, 8px));
}
[data-combo-table-host] [data-combo-column-head][data-combo-family-end="true"] {
  padding-inline-end: var(--zml-combo-family-gap, 8px);
}
[data-combo-scrolled-x="true"] [data-combo-frozen-edge="true"] {
  box-shadow: 6px 0 6px -6px var(--border-strong);
}
[data-combo-scrolled-x="true"] [data-combo-frozen-edge="true"]:dir(rtl) {
  box-shadow: -6px 0 6px -6px var(--border-strong);
}
[data-frozen-columns="idle"] .zml-combo-row [data-combo-sticky] {
  position: relative !important;
  inset: auto !important;
}
[data-combo-table-scroll][data-combo-snap="true"] {
  scroll-snap-type: x proximity;
  scroll-padding-inline-start: var(--zml-combo-frozen-width, 0px);
}
[data-combo-table-scroll][data-combo-snap="true"] thead th:not([data-sticky]) {
  scroll-snap-align: start;
}
.zml-combo-row > .zml-combo-drawer-band {
  grid-column: 1 / -1;
  padding: 0;
  border-inline-end: 0;
  overflow: visible;
}
.zml-row-drawer-band {
  box-sizing: border-box;
  padding: 6px 8px;
  padding-inline-start: 6px;
  border-inline-start: 2px solid var(--primary);
  background: var(--sub-surface);
  color: var(--foreground);
}
.zml-row-drawer {
  box-sizing: border-box;
  min-width: 0;
  overflow: hidden;
  padding: 6px 8px;
  padding-inline-start: 10px;
  background: var(--card);
  color: var(--foreground);
  box-shadow: inset 0 1px 0 var(--foreground);
  @supports (color: color-mix(in lab, red, red)) {
    box-shadow: inset 0 1px 0 color-mix(in srgb, var(--foreground) 5%, transparent);
  }
}
.zml-combo-drawer {
  position: sticky;
  inset-inline-start: 0;
  width: var(--zml-combo-viewport-width, 100%);
  max-width: 100%;
}
.zml-combo-drawer-band:not([data-combo-drawer-ready="true"]) {
  visibility: hidden;
}
@media (hover: hover) {
  .zml-combo-row:not([aria-selected="true"], [data-selected="true"], [data-combo-expanded="true"], [data-combo-confirmed="true"]):hover {
    --zml-data-row-surface: var(--zml-combo-hover-surface);
  }
  .zml-combo-row:is([aria-selected="true"], [data-selected="true"]):hover {
    --zml-data-row-surface: var(--zml-combo-selected-hover-surface);
  }
}
.zml-combo-row:is([data-combo-expanded="true"], [data-combo-confirmed="true"]):not([aria-selected="true"], [data-selected="true"]) {
  --zml-data-row-surface: var(--zml-combo-current-surface);
}
.zml-combo-row:is([aria-selected="true"], [data-selected="true"]) {
  --zml-data-row-surface: var(--zml-combo-selected-surface);
}
.zml-combo-row:focus-visible {
  outline: var(--border-width-focus) solid var(--ring);
  outline-offset: calc(-1 * var(--border-width-focus));
}
.zml-data-message-cell {
  --zml-message-line: var(--data-message-row);
  grid-template-rows: repeat(2, var(--zml-message-line));
  align-content: center;
  padding-block: 0;
  overflow: hidden;
  font-size: var(--type-workbench-secondary);
  line-height: var(--zml-message-line);
}
.zml-data-message-text {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  overflow: hidden;
  overflow-wrap: anywhere;
  max-height: var(--zml-message-line);
}
@keyframes zml-fill-flash-a {
  from {
    background-color: color-mix(in srgb, var(--primary) 28%, transparent);
  }
  to {
    background-color: transparent;
  }
}
@keyframes zml-fill-flash-b {
  from {
    background-color: color-mix(in srgb, var(--primary) 28%, transparent);
  }
  to {
    background-color: transparent;
  }
}
[data-zml-flash] {
  border-radius: var(--radius-micro, 2px);
}
[data-zml-flash="a"] {
  animation: zml-fill-flash-a var(--motion-event-flash) linear;
}
[data-zml-flash="b"] {
  animation: zml-fill-flash-b var(--motion-event-flash) linear;
}
@media (prefers-reduced-motion: reduce) {
  [data-zml-flash] {
    animation: none;
    background-color: var(--primary);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in srgb, var(--primary) 18%, transparent);
    }
  }
}
@keyframes zml-chart-reveal {
  from {
    clip-path: inset(0 100% 0 0);
  }
  to {
    clip-path: inset(0 0 0 0);
  }
}
[data-chart-reveal="play"] {
  animation: zml-chart-reveal var(--motion-chart-reveal) var(--ease-emphasized) both;
}
@media (prefers-reduced-motion: reduce) {
  [data-chart-reveal="play"] {
    animation: none;
  }
}
html[data-pointer-drag] {
  user-select: none;
  -webkit-user-select: none;
}
html[data-pointer-drag="col-resize"], html[data-pointer-drag="col-resize"] * {
  cursor: col-resize !important;
}
html[data-pointer-drag="grabbing"], html[data-pointer-drag="grabbing"] * {
  cursor: grabbing !important;
}
.zml-column-resize-handle {
  position: absolute;
  inset-block: 0;
  inset-inline-end: calc(-1 * var(--zml-column-handle-width, 8px) / 2);
  width: var(--zml-column-handle-width, 8px);
  z-index: var(--z-raised);
  cursor: col-resize;
  touch-action: none;
  user-select: none;
  -webkit-user-select: none;
}
.zml-column-resize-handle::after {
  content: "";
  position: absolute;
  inset-block: 0;
  inset-inline-start: calc(50% - 1px);
  width: 2px;
  background: var(--border-strong);
  opacity: 0;
  transition: opacity var(--motion-micro) var(--ease-standard);
}
.zml-column-resize-handle:hover::after, .zml-column-resize-handle[data-dragging="true"]::after {
  opacity: 1;
}
@media (any-pointer: coarse) {
  .zml-column-resize-handle {
    --zml-column-handle-width: 16px;
  }
}
.zml-column-guide {
  position: fixed;
  top: 0;
  left: 0;
  width: 2px;
  pointer-events: none;
  z-index: var(--z-floating);
  background: var(--foreground);
  will-change: transform;
}
[data-column-drag-source="true"] {
  opacity: 0.4;
}
.zml-column-ghost {
  position: fixed;
  top: 0;
  left: 0;
  pointer-events: none;
  z-index: var(--z-floating);
  opacity: 0.92;
  background: var(--work-surface);
  box-shadow: var(--shadow-floating);
  border-radius: var(--radius-control);
  will-change: transform;
  overflow: hidden;
}
@media (forced-colors: active) {
  .zml-column-resize-handle::after, .zml-column-guide {
    background: Highlight;
  }
  .zml-column-ghost {
    outline: var(--border-width-control) solid CanvasText;
  }
}
[data-row-rail]::before {
  content: "";
  position: absolute;
  inset-block: 0;
  inset-inline-start: 0;
  inline-size: var(--zml-row-rail-width, 2px);
  background: var(--zml-row-rail-color, transparent);
  pointer-events: none;
}
@media (forced-colors: active) {
  [data-row-rail]::before {
    forced-color-adjust: none;
    background: var(--zml-row-rail-forced, transparent);
  }
}
.zml-combo-row[data-combo-control="reduce"] {
  --zml-row-rail-color: var(--risk);
  --zml-row-rail-forced: CanvasText;
}
.zml-combo-row[data-combo-control="stop"] {
  --zml-row-rail-color: var(--muted-foreground);
  --zml-row-rail-forced: CanvasText;
}
.zml-combo-row[data-combo-control="error"] {
  --zml-row-rail-color: var(--status-error);
  --zml-row-rail-forced: CanvasText;
}
.zml-combo-row[data-alert="true"][data-combo-control] {
  --zml-row-rail-width: 5px;
}
.zml-data-message-text[hidden] {
  display: none;
}
@property --zml-data-row-alert-mix {
  syntax: '<percentage>';
  inherits: true;
  initial-value: 0%;
}
.zml-data-row, .zml-combo-row {
  --zml-data-row-alert-mix: 0%;
  --zml-data-row-alert-fill: var(--data-alert-color);
  @supports (color: color-mix(in lab, red, red)) {
    --zml-data-row-alert-fill: color-mix(in srgb, var(--data-alert-color) var(--zml-data-row-alert-mix), transparent);
  }
}
.zml-data-row[data-alert], .zml-combo-row[data-alert] > :is(th, td) {
  background-image: linear-gradient(var(--zml-data-row-alert-fill), var(--zml-data-row-alert-fill));
}
.zml-data-row[data-alert="false"], .zml-combo-row[data-alert="false"] {
  animation: zml-data-row-alert-release var(--motion-out) var(--ease-move) both;
}
.zml-data-row[data-alert="true"], .zml-combo-row[data-alert="true"] {
  --zml-data-row-alert-mix: 12%;
  animation: zml-data-row-alert-ignite var(--motion-alert-ignite) var(--ease-emphasized) both;
}
@keyframes zml-data-row-alert-ignite {
  from {
    --zml-data-row-alert-mix: 0%;
  }
  to {
    --zml-data-row-alert-mix: 12%;
  }
}
@keyframes zml-data-row-alert-release {
  from {
    --zml-data-row-alert-mix: 12%;
  }
  to {
    --zml-data-row-alert-mix: 0%;
  }
}
.zml-data-row-alert {
  print-color-adjust: exact;
}
.zml-data-row[data-alert="true"] .zml-data-row-alert, .zml-combo-row[data-alert="true"] .zml-data-row-alert {
  animation: zml-alert-rail-ignite var(--motion-alert-ignite) var(--ease-emphasized) both, zml-alert-rail-breathe var(--motion-pulse-slow) var(--ease-move) var(--motion-alert-ignite) infinite;
}
.zml-data-row[data-alert="false"] .zml-data-row-alert, .zml-combo-row[data-alert="false"] .zml-data-row-alert {
  animation: zml-alert-rail-release var(--motion-out) var(--ease-move) both;
}
@keyframes zml-alert-rail-ignite {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes zml-alert-rail-breathe {
  0%, 100% {
    opacity: 1;
  }
  50% {
    opacity: 0.45;
  }
}
@keyframes zml-alert-rail-release {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}
@media (prefers-reduced-motion: reduce) {
  .zml-data-row[data-alert], .zml-combo-row[data-alert] {
    animation: none;
  }
  .zml-data-row[data-alert="true"] .zml-data-row-alert, .zml-combo-row[data-alert="true"] .zml-data-row-alert {
    animation: none;
    opacity: 1;
  }
  .zml-data-row[data-alert="false"] .zml-data-row-alert, .zml-combo-row[data-alert="false"] .zml-data-row-alert {
    animation: none;
    opacity: 0;
  }
}
@media (forced-colors: active) {
  .zml-data-row[data-alert], .zml-combo-row[data-alert] > :is(th, td) {
    background-image: none;
  }
  .zml-data-row[data-alert] .zml-data-row-alert, .zml-combo-row[data-alert] .zml-data-row-alert {
    animation: none;
  }
  .zml-data-row[data-alert="true"] .zml-data-row-alert, .zml-combo-row[data-alert="true"] .zml-data-row-alert {
    background: CanvasText;
    opacity: 1;
  }
  .zml-data-row[data-alert="false"] .zml-data-row-alert, .zml-combo-row[data-alert="false"] .zml-data-row-alert {
    opacity: 0;
  }
  .zml-data-row[data-alert="true"], .zml-combo-row[data-alert="true"] > :is(th, td) {
    background-image: none;
  }
}
.zml-data-row[data-focused="true"] {
  outline: var(--focus-ring-outline);
  outline-offset: var(--focus-offset-clipped);
}
.zml-data-row[data-stale="true"] .zml-data-numeric {
  text-decoration-line: underline;
  text-decoration-style: dotted;
  text-decoration-color: var(--status-stale);
  @supports (color: color-mix(in lab, red, red)) {
    text-decoration-color: color-mix(in srgb, var(--status-stale) 45%, transparent);
  }
  text-underline-offset: var(--space-inline-compact);
}
.dark .zml-data-row[data-stale="true"] .zml-data-numeric {
  text-decoration-color: var(--status-stale);
}
@media (forced-colors: active) {
  .zml-combo-row :is([role="cell"], [role="gridcell"]):not(.zml-combo-drawer-band *)::after {
    forced-color-adjust: none;
    background: GrayText;
  }
  .zml-combo-row :is([role="cell"], [role="gridcell"])[data-combo-frozen-edge="true"]::after {
    background: CanvasText;
  }
  .zml-combo-row {
    --zml-data-row-surface: Canvas;
  }
  .zml-combo-row:is([aria-selected="true"], [data-selected="true"], [data-combo-confirmed="true"]) {
    --zml-data-row-surface: Highlight;
    forced-color-adjust: none;
    color: HighlightText;
  }
  .zml-combo-row:is([aria-selected="true"], [data-selected="true"], [data-combo-confirmed="true"]) > :is(th, td) {
    background: linear-gradient(Highlight, Highlight) Canvas;
  }
  .zml-combo-row:is([aria-selected="true"], [data-selected="true"], [data-combo-confirmed="true"]) > :is(th, td) :where(*):not(.zml-data-row-alert) {
    color: HighlightText;
    background-color: transparent !important;
  }
  .zml-combo-row:is([aria-selected="true"], [data-selected="true"], [data-combo-confirmed="true"]) .zml-data-row-alert {
    background-color: HighlightText;
  }
  .zml-data-row, .zml-data-row[data-row-stripe] {
    background-color: Canvas;
  }
  .zml-data-row[aria-selected="true"] {
    background-color: Highlight;
    color: HighlightText;
  }
  .zml-data-row[aria-selected="true"] :where(*) {
    color: HighlightText;
  }
  .zml-data-row-alert {
    background-color: CanvasText;
  }
  .zml-data-row[aria-selected="true"] .zml-data-row-alert {
    background-color: HighlightText;
  }
  .zml-data-row[data-stale="true"] .zml-data-numeric {
    text-decoration-color: CanvasText;
  }
  .zml-data-row[aria-selected="true"][data-stale="true"] .zml-data-numeric {
    text-decoration-color: HighlightText;
  }
  :root {
    --focus-ring-width: 2px;
    --focus-ring-color: Highlight;
  }
  :is(a, button)[aria-current="page"] {
    background: Highlight;
    color: HighlightText;
    forced-color-adjust: none;
  }
  :is(a, button)[aria-current="page"] :where(*) {
    color: HighlightText;
  }
  [data-status][aria-hidden="true"], [data-status-dot-mark] {
    background: CanvasText;
    box-shadow: none !important;
  }
  [data-status="active"][aria-hidden="true"] {
    outline: 1px dotted CanvasText;
    outline-offset: 1px;
  }
  [data-status="error"][aria-hidden="true"], [data-status-dot-mark][data-status-dot-tone="danger"] {
    outline: 1px solid CanvasText;
    outline-offset: 1px;
  }
  [data-status="warning"][aria-hidden="true"], [data-status-dot-mark][data-status-dot-tone="warning"] {
    background: Canvas;
    outline: 1px dashed CanvasText;
    outline-offset: 1px;
  }
  [data-status="offline"][aria-hidden="true"] {
    background: Canvas;
    outline: 1px solid CanvasText;
    outline-offset: 1px;
  }
  [data-status="stale"][aria-hidden="true"] {
    background: Canvas;
    outline: 1px dashed GrayText;
    outline-offset: 1px;
  }
  [data-status="idle"][aria-hidden="true"], [data-status-dot-mark][data-status-dot-tone="muted"] {
    background: Canvas;
    outline: 1px solid GrayText;
    outline-offset: 1px;
  }
  [data-status="unknown"][aria-hidden="true"], [data-status-dot-mark][data-status-dot-tone="unknown"] {
    background: Canvas;
    outline: 1px dotted GrayText;
    outline-offset: 1px;
  }
  [data-status]:not([aria-hidden="true"]) {
    border-color: CanvasText;
    border-style: solid;
  }
  [data-status="active"]:not([aria-hidden="true"]) {
    border-style: dotted;
  }
  [data-status="warning"]:not([aria-hidden="true"]) {
    border-style: dashed;
  }
  [data-status="error"]:not([aria-hidden="true"]), [data-status="offline"]:not([aria-hidden="true"]) {
    outline: 1px solid CanvasText;
    outline-offset: 1px;
  }
  [data-status="offline"]:not([aria-hidden="true"]) {
    border-style: dashed;
  }
  [data-status="stale"]:not([aria-hidden="true"]) {
    border-color: GrayText;
    border-style: dashed;
  }
  [data-status="idle"]:not([aria-hidden="true"]) {
    border-color: GrayText;
    color: GrayText;
  }
  [data-status="unknown"]:not([aria-hidden="true"]) {
    border-color: GrayText;
    border-style: dotted;
    color: GrayText;
  }
}
html[data-theme-transition="suppressed"], html[data-theme-transition="suppressed"] *, html[data-theme-transition="suppressed"] *::before, html[data-theme-transition="suppressed"] *::after {
  transition-delay: 0s !important;
  transition-duration: 0s !important;
}
@media (prefers-contrast: more) {
  :root {
    --focus-ring-width: 2px;
  }
}
.zml-form-section {
  container: zml-form / inline-size;
  display: grid;
  gap: var(--form-section-content-gap);
}
[data-slot="field-grid"] > [data-slot="field-cluster"] {
  display: grid;
  grid-column: span var(--field-cluster-span, 2);
  grid-template-columns: subgrid;
}
@container zml-form (width < 15.5rem) {
  [data-slot="field-grid"] > [data-slot="field-cluster"] {
    display: contents;
  }
}
.zml-form-section[data-divided] {
  border-block-start: 1px solid var(--overlay-divider);
  padding-block-start: var(--space-section-compact);
}
.zml-form-section-header {
  display: grid;
  grid-template-areas: "title actions";
  grid-template-columns: minmax(0,1fr) auto;
  align-items: center;
  gap: var(--space-inline-standard);
}
.zml-form-section-header[data-has-presets="true"] {
  grid-template-areas: "title actions" "presets presets";
}
.zml-form-section-title {
  grid-area: title;
}
.zml-form-section-presets {
  grid-area: presets;
  min-width: 0;
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-inline-compact);
}
.zml-form-section-actions {
  grid-area: actions;
  display: flex;
  flex-wrap: wrap;
  justify-content: end;
  gap: var(--space-inline-compact);
}
.zml-form-section-body {
  display: grid;
  min-width: 0;
  gap: var(--form-section-content-gap);
}
.zml-form-live-region {
  margin: 0;
  min-height: 0;
}
.zml-form-section-body > .zml-form-live-region:empty:not(:first-child) {
  margin-block-start: calc(-1*var(--form-section-content-gap));
}
@container zml-form (min-width: 36rem) {
  .zml-form-section-header[data-has-presets="true"] {
    grid-template-areas: "title presets actions";
    grid-template-columns: auto minmax(0,1fr) auto;
  }
}
.zml-data-matrix {
  --data-heat-quiet: 0%;
  --data-heat-medium: 4%;
  --data-heat-strong: 8%;
  --data-heat-extreme: 12%;
  --data-heat-maximum: 16%;
}
.zml-data-matrix [data-funding-row] {
  --funding-row-fill: var(--work-surface);
  background-color: transparent;
}
.zml-data-matrix [data-funding-row], .zml-data-matrix [data-funding-identity] {
  border-bottom: 0;
}
.zml-data-matrix [data-funding-identity] {
  isolation: isolate;
  background-color: var(--zml-table-surface, var(--work-surface));
  border-inline-end: var(--border-width-hairline) solid var(--border);
}
.zml-data-matrix-seam {
  border-inline-end: var(--border-width-hairline) solid var(--border);
}
.zml-data-matrix [data-funding-row]::before, .zml-data-matrix [data-funding-identity]::before {
  content: "";
  position: absolute;
  inset-block: 0;
  inset-inline: var(--space-inline-standard);
  z-index: -1;
  pointer-events: none;
  border-radius: var(--radius-control);
  background: var(--row-fill-hover);
  opacity: 0;
}
.zml-data-matrix [data-funding-identity]::before {
  inset-inline-end: 0;
  border-start-end-radius: 0;
  border-end-end-radius: 0;
}
.zml-data-matrix [data-hovered="true"] {
  --funding-row-fill: var(--row-fill-hover);
}
.zml-data-matrix [data-hovered="true"]::before {
  opacity: 1;
}
@media (hover: hover) {
  .zml-data-matrix [data-funding-row]:hover, .zml-data-matrix [data-funding-identity]:hover {
    --funding-row-fill: var(--row-fill-hover);
  }
  .zml-data-matrix [data-funding-row]:hover::before, .zml-data-matrix [data-funding-identity]:hover::before {
    opacity: 1;
  }
}
.zml-data-matrix :is([data-funding-row],[data-funding-identity])[aria-selected="true"] {
  --funding-row-fill: var(--row-fill-selected);
}
.zml-data-matrix :is([data-funding-row],[data-funding-identity])[aria-selected="true"]::before {
  background: var(--row-fill-selected);
  opacity: 1;
}
.zml-data-matrix :is([data-funding-row],[data-funding-identity])[aria-selected="true"][data-hovered="true"] {
  --funding-row-fill: var(--row-fill-selected-hover);
}
.zml-data-matrix :is([data-funding-row],[data-funding-identity])[aria-selected="true"][data-hovered="true"]::before {
  background: var(--row-fill-selected-hover);
}
@media (hover: hover) {
  .zml-data-matrix :is([data-funding-row],[data-funding-identity])[aria-selected="true"]:hover {
    --funding-row-fill: var(--row-fill-selected-hover);
  }
  .zml-data-matrix :is([data-funding-row],[data-funding-identity])[aria-selected="true"]:hover::before {
    background: var(--row-fill-selected-hover);
  }
}
.zml-data-matrix-heading {
  padding-inline: clamp(0px,calc(var(--funding-venue-width)/4),var(--space-inline-compact));
  font-size: var(--type-workbench-secondary);
  line-height: var(--type-workbench-secondary-line);
  font-weight: var(--font-weight-medium);
}
.zml-data-matrix-cell {
  --data-matrix-content-height: var(--type-workbench-secondary-line);
  --funding-heat-pct: var(--data-heat-quiet);
  box-sizing: border-box;
  display: block;
  padding-inline: clamp(0px,calc(var(--funding-venue-width)/4),var(--cell-inline-dense));
  padding-top: calc((var(--funding-row-height) - var(--data-matrix-content-height))/2);
}
[data-funding-stat-lines="1"] .zml-data-matrix-cell {
  --data-matrix-content-height: calc(2*var(--type-workbench-secondary-line));
}
[data-funding-stat-lines="2"] .zml-data-matrix-cell {
  --data-matrix-content-height: calc(3*var(--type-workbench-secondary-line));
}
[data-funding-stat-lines="3"] .zml-data-matrix-cell {
  --data-matrix-content-height: calc(4*var(--type-workbench-secondary-line));
}
.zml-data-matrix-cell[data-funding-heat] {
  background-color: var(--primary);
  @supports (color: color-mix(in lab, red, red)) {
    background-color: color-mix(in srgb,var(--primary) var(--funding-heat-pct),transparent);
  }
}
.zml-data-matrix-cell[data-funding-heat="1"] {
  --funding-heat-pct: var(--data-heat-medium);
}
.zml-data-matrix-cell[data-funding-heat="2"] {
  --funding-heat-pct: var(--data-heat-strong);
}
.zml-data-matrix-cell[data-funding-heat="3"] {
  --funding-heat-pct: var(--data-heat-extreme);
}
.zml-data-matrix-cell[data-funding-heat="4"] {
  --funding-heat-pct: var(--data-heat-maximum);
}
.zml-data-matrix-cell[data-funding-adornment] {
  box-shadow: none;
}
.zml-data-matrix-value {
  overflow: hidden;
  text-overflow: ellipsis;
}
.zml-data-matrix-value[data-funding-tone="foreground"] {
  color: var(--foreground);
}
.zml-data-matrix-value[data-funding-tone="muted"] {
  color: var(--muted-foreground);
}
[data-funding-basis-suspect]::before {
  content: attr(data-funding-basis-suspect);
  margin-inline-end: var(--space-inline-compact);
  color: var(--status-warning);
  font-size: var(--type-workbench-secondary);
}
.zml-data-matrix-interval, .zml-data-matrix-value[data-funding-interval]::before {
  margin-inline-end: var(--space-inline-compact);
  color: var(--muted-foreground);
  font-size: var(--type-workbench-secondary);
}
.zml-data-matrix-value[data-funding-interval]::before {
  content: attr(data-funding-interval);
}
.zml-data-matrix-cell[data-funding-stats]::after {
  content: attr(data-funding-stats);
  display: none;
}
.zml-data-matrix-stats, .zml-data-matrix-cell[data-funding-stats]::after {
  box-sizing: border-box;
  width: 100%;
  margin-top: 0;
  color: var(--muted-foreground);
  font-size: var(--type-workbench-secondary);
  font-weight: var(--font-weight-regular);
  font-variant-numeric: tabular-nums;
  line-height: var(--type-workbench-secondary-line);
  text-align: right;
  white-space: pre;
  overflow: hidden;
  text-overflow: ellipsis;
}
[data-funding-stat-lines="0"] .zml-data-matrix-stats, [data-funding-stat-lines="0"] .zml-data-matrix-cell[data-funding-stats]::after {
  display: none;
  height: 0;
}
[data-funding-stat-lines="1"] .zml-data-matrix-stats, [data-funding-stat-lines="1"] .zml-data-matrix-cell[data-funding-stats]::after {
  display: block;
  height: var(--type-workbench-secondary-line);
}
[data-funding-stat-lines="2"] .zml-data-matrix-stats, [data-funding-stat-lines="2"] .zml-data-matrix-cell[data-funding-stats]::after {
  display: block;
  height: calc(2*var(--type-workbench-secondary-line));
}
[data-funding-stat-lines="3"] .zml-data-matrix-stats, [data-funding-stat-lines="3"] .zml-data-matrix-cell[data-funding-stats]::after {
  display: block;
  height: calc(3*var(--type-workbench-secondary-line));
}
@media (forced-colors: active) {
  .zml-data-matrix-cell[data-funding-heat] {
    background-color: Canvas;
  }
  .zml-data-matrix :is([data-funding-row],[data-funding-identity])[aria-selected="true"] {
    --funding-row-fill: Highlight;
    color: HighlightText;
    background-color: Highlight;
  }
  .zml-data-matrix :is([data-funding-row],[data-funding-identity])[aria-selected="true"] :where(*) {
    color: HighlightText;
  }
  .zml-data-matrix [data-funding-row][aria-selected="true"] .zml-data-matrix-cell {
    background-color: Highlight;
  }
  .zml-data-matrix-value[data-funding-tone="muted"] {
    color: GrayText;
  }
  .zml-data-matrix-cell[data-funding-adornment~="best-long"] {
    border-inline-start: var(--focus-ring-width) solid CanvasText;
  }
  .zml-data-matrix-cell[data-funding-adornment~="best-short"] {
    border-inline-end: var(--focus-ring-width) solid CanvasText;
  }
  .zml-data-matrix [data-funding-row][aria-selected="true"] .zml-data-matrix-cell {
    border-color: HighlightText;
  }
}
.zml-column-record-list {
  container: zml-column-record-list / inline-size;
  width: 100%;
  min-width: 0;
}
[data-slot="column-record-grid"] {
  display: grid;
  grid-template-columns: minmax(0,1fr) max-content;
  column-gap: var(--space-section-compact);
  min-width: 0;
}
.zml-column-record-row {
  position: relative;
  isolation: isolate;
  display: grid;
  grid-column: 1 / -1;
  grid-template-columns: subgrid;
  align-items: start;
  column-gap: inherit;
  row-gap: var(--space-stack-compact);
  min-width: 0;
  min-height: var(--row-single);
  padding: var(--space-stack-standard) var(--cell-inline);
  color: var(--muted-foreground);
  font-size: var(--type-workbench-secondary);
  line-height: var(--type-workbench-secondary-line);
}
.zml-column-record-row::before {
  content: "";
  position: absolute;
  inset-block: 0;
  inset-inline: var(--space-inline-standard);
  z-index: -1;
  border-radius: var(--radius-control);
  background: var(--row-fill-hover);
  opacity: 0;
}
.zml-column-record-row[data-interactive]:hover {
  cursor: pointer;
}
.zml-column-record-row[data-interactive]:hover::before {
  opacity: 1;
}
[data-slot="column-record-identity"] {
  grid-area: 1 / 1;
  display: flex;
  align-items: center;
  gap: var(--space-inline-standard);
  min-width: 0;
  overflow-wrap: anywhere;
  color: var(--foreground);
  font-size: var(--type-workbench-primary);
  line-height: var(--type-workbench-primary-line);
  font-weight: var(--font-weight-medium);
}
.zml-column-record-row:not([data-has-actions]) > [data-slot="column-record-identity"] {
  grid-column: 1 / -1;
}
[data-slot="column-record-actions"] {
  grid-area: 1 / 2;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: end;
  gap: var(--space-inline-compact);
  max-width: 100%;
}
[data-slot="column-record-cells"] {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: var(--space-stack-compact) var(--space-inline-wide);
  grid-column: 1 / -1;
  min-width: 0;
}
[data-slot="column-record-cell"] {
  min-width: 0;
  overflow-wrap: anywhere;
}
[data-slot="column-record-cell"][data-full-width] {
  flex-basis: 100%;
}
[data-slot="column-record-footer"] {
  grid-column: 1 / -1;
  min-width: 0;
}
@container zml-column-record-list (min-width: 56rem) {
  [data-slot="column-record-grid"] {
    grid-template-columns: var(--record-columns);
  }
  .zml-column-record-row {
    align-items: center;
  }
  .zml-column-record-row > [data-slot="column-record-identity"], .zml-column-record-row:not([data-has-actions]) > [data-slot="column-record-identity"], [data-slot="column-record-actions"] {
    grid-area: auto;
  }
  [data-slot="column-record-cells"] {
    display: contents;
  }
  [data-slot="column-record-cell"][data-align="end"] {
    justify-self: end;
    text-align: end;
  }
}
@container overlay-frame (max-width: 767.98px) {
  [data-settings-window][data-narrow-view="rail"] [aria-current="page"]:not(:hover) {
    background-color: transparent;
  }
}
[data-overlay-frame] {
  isolation: isolate;
  overscroll-behavior: none;
}
[data-overlay-frame][data-closed] {
  pointer-events: none;
}
[data-overlay-frame] [data-scroll-y-owner] {
  overflow-anchor: none;
  overscroll-behavior-y: contain;
  scroll-padding-block: var(--space-section-compact);
}
:is([data-overlay-frame] > [data-scroll-y-owner], [data-overlay-frame] [data-overlay-primary-scroll]) {
  --overlay-keyboard-inset: var(--keyboard-occlusion);
}
@keyframes zml-reveal {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
[data-reveal] {
  animation: zml-reveal var(--motion-reveal) var(--ease-emphasized) both;
}
[data-refreshing] {
  opacity: var(--opacity-refreshing);
  transition: opacity var(--motion-control) var(--ease-standard);
}
[data-loading-skeleton="true"] {
  transition: visibility 0s linear var(--wait-quiet);
}
@starting-style {
  [data-loading-skeleton="true"] {
    visibility: hidden;
  }
}
[data-inline-status-slot] > :not(:empty) ~ * {
  display: none;
}
[data-inline-status-slot] > :empty {
  display: none;
}
[data-inline-status-slot]:not(:has(> :not(:empty))) {
  display: none;
}
@keyframes zml-dither {
  0% {
    opacity: 0;
  }
  75% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
[data-slot="brand-mark"][data-motion="dither"] [data-dither-cell] {
  opacity: 0;
  animation: zml-dither var(--motion-brand-loop) step-end infinite;
  animation-delay: calc(var(--motion-brand-loop) * var(--zml-dither-order) / -16);
}
[data-dither-order="0"] {
  --zml-dither-order: 0;
}
[data-dither-order="1"] {
  --zml-dither-order: 1;
}
[data-dither-order="2"] {
  --zml-dither-order: 2;
}
[data-dither-order="3"] {
  --zml-dither-order: 3;
}
[data-dither-order="4"] {
  --zml-dither-order: 4;
}
[data-dither-order="5"] {
  --zml-dither-order: 5;
}
[data-dither-order="6"] {
  --zml-dither-order: 6;
}
[data-dither-order="7"] {
  --zml-dither-order: 7;
}
[data-dither-order="8"] {
  --zml-dither-order: 8;
}
[data-dither-order="9"] {
  --zml-dither-order: 9;
}
[data-dither-order="10"] {
  --zml-dither-order: 10;
}
[data-dither-order="11"] {
  --zml-dither-order: 11;
}
[data-dither-order="12"] {
  --zml-dither-order: 12;
}
[data-dither-order="13"] {
  --zml-dither-order: 13;
}
[data-dither-order="14"] {
  --zml-dither-order: 14;
}
[data-dither-order="15"] {
  --zml-dither-order: 15;
}
@media (prefers-reduced-motion: reduce), (forced-colors: active) {
  [data-slot="brand-mark"][data-motion="dither"] [data-dither-cell] {
    animation: none;
    opacity: 0;
  }
}
@keyframes zml-loader-spin {
  to {
    transform: rotate(360deg);
  }
}
.zml-loader {
  transform-origin: center;
  animation: zml-loader-spin var(--motion-loop) linear infinite;
}
@media (prefers-reduced-motion: reduce) {
  .zml-loader {
    animation: none;
  }
}
@keyframes zml-pulse {
  50% {
    opacity: 0.5;
  }
}
[data-loading-skeleton="true"]::before, [data-loading-skeleton="true"]::after {
  content: none;
  animation: none;
  transform: none;
  background-image: none;
}
[data-progress-semantic="progress"][data-progress-state="indeterminate"] [data-slot="progress-rail-indicator"] {
  position: absolute;
  inset-inline-start: -36%;
  width: 36%;
  animation: zml-progress-rail-indeterminate var(--motion-loop) linear infinite;
}
@keyframes zml-progress-rail-indeterminate {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(378%);
  }
}
@media (prefers-reduced-motion: reduce) {
  [data-slot="progress-rail-indicator"] {
    transition: none;
  }
  [data-progress-semantic="progress"][data-progress-state="indeterminate"] [data-slot="progress-rail-indicator"] {
    inset-inline-start: 0;
    width: 100%;
    opacity: 0.4;
    transform: none;
    animation: none !important;
  }
}
@media (forced-colors: active) {
  [data-slot="progress-rail-track"] {
    background: Canvas !important;
    outline: 1px solid CanvasText;
    outline-offset: -1px;
  }
  [data-slot="progress-rail-indicator"] {
    background: Highlight !important;
  }
  [data-progress-semantic="progress"][data-progress-state="indeterminate"] [data-slot="progress-rail-indicator"] {
    inset-inline-start: 0;
    width: 100%;
    opacity: 0.4;
    transform: none;
    animation: none !important;
  }
  [data-loading-skeleton="true"] {
    background: Canvas !important;
    outline: 1px solid GrayText !important;
    outline-offset: -1px;
  }
}
@keyframes zml-auth-enter {
  from {
    opacity: 0;
    transform: translateY(6px);
  }
  to {
    opacity: 1;
    transform: none;
  }
}
[data-slot="auth-content"] {
  animation: zml-auth-enter var(--motion-overlay) var(--ease-emphasized) both;
}
@media (prefers-reduced-motion: reduce) {
  :root {
    --motion-micro: 0ms;
    --motion-floating: 0ms;
    --motion-disclosure: 0ms;
    --motion-out: 0ms;
    --motion-move: 0ms;
    --motion-switch: 0ms;
    --motion-switch-thumb: 0ms;
    --motion-switch-thumb-delay: 0ms;
    --motion-overlay: var(--motion-reduced-duration);
    --motion-overlay-exit: var(--motion-reduced-duration);
    --motion-popup-enter: var(--motion-reduced-duration);
    --motion-popup-exit: var(--motion-reduced-duration);
    --motion-popup-scale: var(--motion-reduced-duration);
    --motion-dialog: var(--motion-reduced-duration);
    --motion-panel: var(--motion-reduced-duration);
    --motion-pulse-slow: 0ms;
    --motion-swap: 0ms;
    --motion-swap-offset: 0px;
    --motion-checkbox: 0ms;
    --motion-loop: 0ms;
    --motion-reveal: 0ms;
    --motion-brand-loop: 0ms;
    --motion-express-hover: 0ms;
    --motion-express-swap: 0ms;
    --motion-express-enter: 0ms;
    --motion-express-enter-offset: 0px;
    --motion-express-stagger: 0ms;
    --motion-express-glide: 0ms;
    --motion-express-scrub: 0ms;
    --motion-express-spot: 0ms;
    --motion-express-ambient-flow: 0ms;
    --motion-express-ambient-flow-step: 0ms;
    --motion-express-ambient-breathe: 0ms;
    --motion-express-ambient-drift: 0ms;
    --motion-express-ambient-drift-alt: 0ms;
    --motion-express-ambient-marquee: 0ms;
    --motion-express-word: 0ms;
    --motion-express-word-stagger: 0ms;
    --motion-express-count: 0ms;
    --motion-express-roll: 0ms;
    --motion-express-page-out: 0ms;
    --motion-express-page-in: 0ms;
    --marketing-reveal: 0ms;
    --motion-alert-ignite: 0ms;
    --motion-floating-offset: 0px;
  }
  [data-slot="auth-content"] {
    animation: none;
  }
  *, *::before, *::after {
    scroll-behavior: auto !important;
    animation-delay: 0s !important;
    animation-duration: var(--motion-reduced-duration) !important;
    animation-iteration-count: 1 !important;
    transition-delay: 0s !important;
    transition-duration: var(--motion-reduced-duration) !important;
  }
}
[data-settings-window] {
  --card: var(--overlay-surface);
}
[data-fx-armed] {
  opacity: 0;
  translate: 0 var(--motion-express-enter-offset);
  transition: opacity var(--motion-express-enter) var(--ease-express-enter), translate var(--motion-express-enter) var(--ease-express-enter);
  transition-delay: calc(var(--fx-i, 0) * var(--motion-express-stagger));
}
[data-fx-armed][data-fx-in] {
  opacity: 1;
  translate: none;
}
.zml-fx-pending [data-fx~="words"]:not([data-fx-in]), .zml-fx-pending [data-fx~="enter"] {
  opacity: 0;
}
.zml-fx-word {
  display: inline-block;
  white-space: pre;
}
.zml-fx-sr {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}
.zml-fx-scrub .zml-fx-word {
  opacity: 0.28;
  transition: opacity var(--motion-express-scrub) var(--ease-express-hover);
}
.zml-fx-scrub .zml-fx-word.zml-fx-lit {
  opacity: 1;
}
.zml-fx-slot {
  display: inline-block;
  height: 1em;
  line-height: 1;
  overflow: hidden;
  vertical-align: -0.06em;
  font-variant-numeric: tabular-nums;
}
.zml-fx-slot-col {
  display: block;
  white-space: pre;
  line-height: 1;
}
.zml-fx-glide-host {
  position: relative;
  isolation: isolate;
}
.zml-fx-glide {
  position: absolute;
  left: 0;
  top: 0;
  z-index: -1;
  border-radius: 9999px;
  background: var(--control-hover);
  opacity: 0;
  pointer-events: none;
  transition: transform var(--motion-express-glide) var(--ease-spring), width var(--motion-express-glide) var(--ease-spring), height var(--motion-express-glide) var(--ease-spring), opacity var(--motion-express-swap) var(--ease-express-hover);
}
.zml-fx-glide[data-instant] {
  transition: none;
}
[data-fx~="spot"] {
  position: relative;
  isolation: isolate;
}
[data-fx~="spot"]::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  border-radius: inherit;
  pointer-events: none;
  opacity: 0;
  background: radial-gradient(420px circle at var(--fx-mx, 50%) var(--fx-my, 0%), var(--foreground), transparent 60%);
  @supports (color: color-mix(in lab, red, red)) {
    background: radial-gradient(420px circle at var(--fx-mx, 50%) var(--fx-my, 0%), color-mix(in srgb, var(--foreground) 7%, transparent), transparent 60%);
  }
  transition: opacity var(--motion-express-spot) var(--ease-express-hover);
}
[data-fx~="spot"][data-fx-active]::before {
  opacity: 1;
}
[data-fx~="tilt"] {
  position: relative;
  transform-style: preserve-3d;
}
[data-fx~="tilt"]::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  opacity: 0;
  background: radial-gradient(360px circle at var(--fx-gx, 50%) var(--fx-gy, 50%), var(--foreground), transparent 55%);
  @supports (color: color-mix(in lab, red, red)) {
    background: radial-gradient(360px circle at var(--fx-gx, 50%) var(--fx-gy, 50%), color-mix(in srgb, var(--foreground) 9%, transparent), transparent 55%);
  }
  transition: opacity var(--motion-express-spot) var(--ease-express-hover);
}
[data-fx~="tilt"][data-fx-active]::after {
  opacity: 1;
}
@media (forced-colors: active) {
  [data-fx~="spot"]::before, [data-fx~="tilt"]::after {
    display: none;
  }
  .zml-fx-glide {
    forced-color-adjust: none;
    background: Highlight;
  }
}
@media (prefers-contrast: more) {
  .zml-fx-scrub .zml-fx-word {
    opacity: 1;
  }
}
@media print {
  [data-fx-armed] {
    opacity: 1 !important;
    translate: none !important;
  }
  .zml-fx-scrub .zml-fx-word {
    opacity: 1 !important;
  }
  .zml-fx-pending [data-fx] {
    opacity: 1 !important;
  }
}
:is( [data-slot="input"], [data-slot="combobox-chip-input"], [data-slot="textarea"] ):is(:autofill, :-webkit-autofill) {
  caret-color: var(--foreground);
  box-shadow: inset 0 0 0 1000px var(--z-autofill-surface, var(--field));
  -webkit-text-fill-color: var(--foreground);
}
@media (forced-colors: active) {
  :is( [data-slot="input"], [data-slot="combobox-chip-input"], [data-slot="textarea"] ):is(:autofill, :-webkit-autofill) {
    caret-color: CanvasText;
    box-shadow: none;
    -webkit-text-fill-color: CanvasText;
  }
}
@media (pointer: coarse) {
  :is( input:not([type="button"], [type="checkbox"], [type="color"], [type="file"], [type="hidden"], [type="image"], [type="radio"], [type="range"], [type="reset"], [type="submit"]), textarea, select, [contenteditable]:not([contenteditable="false"]) ) {
    font-size: var(--type-input-touch);
  }
}
[data-slot="avatar-crop-frame"] {
  box-shadow: 0 0 0 100vmax color-mix(in srgb, #000 55%, transparent), inset 0 0 0 1px color-mix(in srgb, #fff 70%, transparent);
}
@media (forced-colors: active) {
  [data-slot="avatar-crop-frame"] {
    box-shadow: none;
    outline: 1px solid CanvasText;
    outline-offset: -1px;
  }
}
[data-slot="segmented"][data-appearance="joined"] {
  height: auto;
  gap: var(--space-inline-compact);
  padding: var(--space-inline-compact);
  border-radius: var(--radius-control);
  background: var(--foreground);
  @supports (color: color-mix(in lab, red, red)) {
    background: color-mix(in srgb, var(--foreground) 4%, var(--modal-surface));
  }
}
[data-slot="segmented"][data-appearance="joined"] [data-slot="segmented-option"] {
  height: var(--control-form);
  border-color: transparent;
  border-radius: var(--radius-control);
  background: transparent;
  font-size: var(--type-control);
  line-height: var(--type-control-line);
}
[data-slot="segmented"][data-appearance="joined"] [data-slot="segmented-option"]::before {
  box-shadow: none;
}
[data-slot="segmented"][data-appearance="joined"] [data-slot="segmented-option"][data-checked] {
  background: var(--segmented-option-current);
}
[data-slot="dialog-content"]:has(> [data-slot="dialog-body"] > [data-wallet-directory]), [data-slot="dialog-content"]:has(> [data-account-mutation-window] > [data-slot="dialog-body"] > [data-wallet-directory]) {
  height: min(680px, calc(100dvh - 2 * var(--space-section-compact)));
}
:root {
  color-scheme: light;
  --asset-soft-alpha: 8%;
  --asset-border-alpha: 18%;
  --asset-unknown-border-alpha: 16%;
  --card-foreground: var(--foreground);
  --popover-foreground: var(--foreground);
  --secondary: var(--sub-surface);
  --muted: var(--sub-surface);
  --accent: var(--control-hover);
  --accent-foreground: var(--foreground);
  --ring: var(--border-focus);
  --control-room-nav-height: calc(var(--shell-bar-height) + 0.5px);
  --control-height-main: var(--control-standard);
  --control-height-secondary: var(--control-compact);
  --control-height-chrome: var(--control-height-main);
  --control-room-coarse-control-size: var(--hit-plane-coarse);
  --zml-monitor-controls: var(--z-workbench-controls);
  --page-padding: 0.5rem;
  --section-gap: 0.5rem;
  --content-max-width: 88rem;
  --announcement-category-column: 344px;
  --announcement-category-column-compact: 96px;
  --material-page: var(--background);
  --material-surface: var(--work-surface);
  --material-panel: var(--card);
  --material-panel-muted: var(--sub-surface);
  --material-popover: var(--popover);
  --material-field: var(--field);
  --material-field-border: var(--field-border);
  --material-field-border-hover: var(--field-border-hover);
  --material-border: var(--border-subtle);
  --material-border-strong: var(--border-strong);
  --material-control-hover: var(--control-hover);
  --material-control-hover-text: var(--foreground);
  --material-control-rail: var(--sub-surface);
  --material-control-current: var(--control-current);
  --material-focus-border: var(--border-focus);
  --material-control-selected: var(--control-selected);
  --material-control-selected-hover: var(--control-selected);
  --material-emphasis-brand: var(--primary);
  @supports (color: color-mix(in lab, red, red)) {
    --material-emphasis-brand: color-mix(
    in srgb,
    var(--primary) 34%,
    var(--material-control-current)
  );
  }
  --material-shadow-outline: var(--shadow-hairline);
  --material-shadow-popover: var(--shadow-floating);
  --material-radius: var(--radius-control);
  --color-asset-crypto: var(--muted-foreground);
  --color-asset-crypto-soft: transparent;
  --color-asset-crypto-border: transparent;
  --color-asset-equity: #087a55;
  --color-asset-etf: #0f766e;
  --color-asset-commodity: #946200;
  --color-asset-fx: #7440b8;
  --color-asset-index: #2367ad;
  --color-asset-government-security: #3d6b78;
  --color-asset-real-estate: #a83b67;
  --color-asset-other: #6c625a;
  --color-asset-unknown: #77746f;
  --color-asset-equity-soft: var(--color-asset-equity);
  @supports (color: color-mix(in lab, red, red)) {
    --color-asset-equity-soft: color-mix(
    in srgb,
    var(--color-asset-equity) var(--asset-soft-alpha),
    transparent
  );
  }
  --color-asset-equity-border: var(--color-asset-equity);
  @supports (color: color-mix(in lab, red, red)) {
    --color-asset-equity-border: color-mix(
    in srgb,
    var(--color-asset-equity) var(--asset-border-alpha),
    transparent
  );
  }
  --color-asset-etf-soft: var(--color-asset-etf);
  @supports (color: color-mix(in lab, red, red)) {
    --color-asset-etf-soft: color-mix(
    in srgb,
    var(--color-asset-etf) var(--asset-soft-alpha),
    transparent
  );
  }
  --color-asset-etf-border: var(--color-asset-etf);
  @supports (color: color-mix(in lab, red, red)) {
    --color-asset-etf-border: color-mix(
    in srgb,
    var(--color-asset-etf) var(--asset-border-alpha),
    transparent
  );
  }
  --color-asset-commodity-soft: var(--color-asset-commodity);
  @supports (color: color-mix(in lab, red, red)) {
    --color-asset-commodity-soft: color-mix(
    in srgb,
    var(--color-asset-commodity) var(--asset-soft-alpha),
    transparent
  );
  }
  --color-asset-commodity-border: var(--color-asset-commodity);
  @supports (color: color-mix(in lab, red, red)) {
    --color-asset-commodity-border: color-mix(
    in srgb,
    var(--color-asset-commodity) var(--asset-border-alpha),
    transparent
  );
  }
  --color-asset-fx-soft: var(--color-asset-fx);
  @supports (color: color-mix(in lab, red, red)) {
    --color-asset-fx-soft: color-mix(
    in srgb,
    var(--color-asset-fx) var(--asset-soft-alpha),
    transparent
  );
  }
  --color-asset-fx-border: var(--color-asset-fx);
  @supports (color: color-mix(in lab, red, red)) {
    --color-asset-fx-border: color-mix(
    in srgb,
    var(--color-asset-fx) var(--asset-border-alpha),
    transparent
  );
  }
  --color-asset-index-soft: var(--color-asset-index);
  @supports (color: color-mix(in lab, red, red)) {
    --color-asset-index-soft: color-mix(
    in srgb,
    var(--color-asset-index) var(--asset-soft-alpha),
    transparent
  );
  }
  --color-asset-index-border: var(--color-asset-index);
  @supports (color: color-mix(in lab, red, red)) {
    --color-asset-index-border: color-mix(
    in srgb,
    var(--color-asset-index) var(--asset-border-alpha),
    transparent
  );
  }
  --color-asset-government-security-soft: var(--color-asset-government-security);
  @supports (color: color-mix(in lab, red, red)) {
    --color-asset-government-security-soft: color-mix(
    in srgb,
    var(--color-asset-government-security) var(--asset-soft-alpha),
    transparent
  );
  }
  --color-asset-government-security-border: var(--color-asset-government-security);
  @supports (color: color-mix(in lab, red, red)) {
    --color-asset-government-security-border: color-mix(
    in srgb,
    var(--color-asset-government-security) var(--asset-border-alpha),
    transparent
  );
  }
  --color-asset-real-estate-soft: var(--color-asset-real-estate);
  @supports (color: color-mix(in lab, red, red)) {
    --color-asset-real-estate-soft: color-mix(
    in srgb,
    var(--color-asset-real-estate) var(--asset-soft-alpha),
    transparent
  );
  }
  --color-asset-real-estate-border: var(--color-asset-real-estate);
  @supports (color: color-mix(in lab, red, red)) {
    --color-asset-real-estate-border: color-mix(
    in srgb,
    var(--color-asset-real-estate) var(--asset-border-alpha),
    transparent
  );
  }
  --color-asset-other-soft: var(--color-asset-other);
  @supports (color: color-mix(in lab, red, red)) {
    --color-asset-other-soft: color-mix(
    in srgb,
    var(--color-asset-other) var(--asset-soft-alpha),
    transparent
  );
  }
  --color-asset-other-border: var(--color-asset-other);
  @supports (color: color-mix(in lab, red, red)) {
    --color-asset-other-border: color-mix(
    in srgb,
    var(--color-asset-other) var(--asset-border-alpha),
    transparent
  );
  }
  --color-asset-unknown-soft: transparent;
  --color-asset-unknown-border: var(--color-asset-unknown);
  @supports (color: color-mix(in lab, red, red)) {
    --color-asset-unknown-border: color-mix(
    in srgb,
    var(--color-asset-unknown) var(--asset-unknown-border-alpha),
    transparent
  );
  }
}
.dark {
  color-scheme: dark;
  --asset-soft-alpha: 14%;
  --asset-border-alpha: 27%;
  --asset-unknown-border-alpha: 22%;
  --color-asset-equity: #48c78e;
  --color-asset-etf: #45c7bd;
  --color-asset-commodity: #e6a93a;
  --color-asset-fx: #c18cf0;
  --color-asset-index: #70a7ef;
  --color-asset-government-security: #73bdc8;
  --color-asset-real-estate: #ef83ac;
  --color-asset-other: #b4a698;
  --color-asset-unknown: #9b9891;
  --color-interval-4h: #a78bfa;
  --color-favorite: #fbbf24;
  --material-shadow-outline: var(--shadow-hairline);
  --material-shadow-popover: var(--shadow-floating);
}
@media (min-width: 640px) {
  :root, .dark {
    --page-padding: 0.5rem;
    --section-gap: 0.625rem;
  }
}
@media (min-width: 768px) {
  :root, .dark {
    --page-padding: 0.5rem;
    --section-gap: 0.625rem;
  }
}
@media (min-width: 1024px) {
  :root, .dark {
    --page-padding: 0.625rem;
    --section-gap: 0.75rem;
  }
}
@media (min-width: 1536px) {
  :root, .dark {
    --page-padding: 0.75rem;
    --section-gap: 0.875rem;
  }
}
@media (prefers-contrast: more) {
  :root, .dark {
    --focus-ring-color: var(--ring);
    @supports (color: color-mix(in lab, red, red)) {
      --focus-ring-color: color-mix(in srgb, var(--ring) 70%, var(--foreground));
    }
    --muted-foreground: var(--foreground);
    @supports (color: color-mix(in lab, red, red)) {
      --muted-foreground: color-mix(
      in srgb,
      var(--foreground) 76%,
      var(--background)
    );
    }
    --material-border: var(--foreground);
    @supports (color: color-mix(in lab, red, red)) {
      --material-border: color-mix(in srgb, var(--foreground) 34%, transparent);
    }
    --border: var(--foreground);
    @supports (color: color-mix(in lab, red, red)) {
      --border: color-mix(in srgb, var(--foreground) 46%, transparent);
    }
    --material-border-strong: var(--foreground);
    @supports (color: color-mix(in lab, red, red)) {
      --material-border-strong: color-mix(
      in srgb,
      var(--foreground) 58%,
      transparent
    );
    }
    --material-focus-border: var(--primary);
    @supports (color: color-mix(in lab, red, red)) {
      --material-focus-border: color-mix(
      in srgb,
      var(--primary) 70%,
      var(--foreground)
    );
    }
    --material-emphasis-brand: var(--primary);
    @supports (color: color-mix(in lab, red, red)) {
      --material-emphasis-brand: color-mix(
      in srgb,
      var(--primary) 82%,
      var(--foreground)
    );
    }
  }
}
@layer utilities {
  .zm-data-table-sticky-left > [data-slot="table"] > thead tr > *:first-child {
    position: sticky;
    z-index: var(--z-workbench-controls);
  }
  .zm-data-table-sticky-left > [data-slot="table"] > tbody tr > *:first-child:not([colspan]) {
    position: sticky;
    z-index: var(--z-sticky);
  }
  .zm-data-table-sticky-left > [data-slot="table"] > thead tr > *:first-child, .zm-data-table-sticky-left > [data-slot="table"] > tbody tr > *:first-child:not([colspan]) {
    left: 0;
  }
  .zm-monitor-third-line-pill {
    --monitor-third-line-pill-border: var(--material-border);
    --monitor-third-line-pill-bg: var(--material-panel-muted);
    --monitor-third-line-pill-color: var(--muted-foreground);
    border: 1px solid var(--monitor-third-line-pill-border);
    border-radius: var(--radius-micro);
    background: var(--monitor-third-line-pill-bg);
    color: var(--monitor-third-line-pill-color);
  }
  .zm-monitor-third-line-pill-danger {
    --monitor-third-line-pill-border: var(--color-status-error);
    @supports (color: color-mix(in lab, red, red)) {
      --monitor-third-line-pill-border: color-mix(
      in srgb,
      var(--color-status-error) 35%,
      transparent
    );
    }
    --monitor-third-line-pill-bg: var(--color-status-error-soft);
    --monitor-third-line-pill-color: var(--color-status-error);
  }
  .zm-monitor-third-line-pill-warning {
    --monitor-third-line-pill-border: var(--color-status-warning);
    @supports (color: color-mix(in lab, red, red)) {
      --monitor-third-line-pill-border: color-mix(
      in srgb,
      var(--color-status-warning) 35%,
      transparent
    );
    }
    --monitor-third-line-pill-bg: var(--color-status-warning-soft);
    --monitor-third-line-pill-color: var(--color-status-warning);
  }
  .zm-monitor-third-line-pill-accent {
    --monitor-third-line-pill-border: var(--color-status-active);
    @supports (color: color-mix(in lab, red, red)) {
      --monitor-third-line-pill-border: color-mix(
      in srgb,
      var(--color-status-active) 35%,
      transparent
    );
    }
    --monitor-third-line-pill-bg: var(--color-status-active-soft);
    --monitor-third-line-pill-color: var(--color-status-active);
  }
  .zm-monitor-third-line-pill-neutral {
    --monitor-third-line-pill-border: var(--material-border);
    --monitor-third-line-pill-bg: var(--material-panel-muted);
    --monitor-third-line-pill-color: var(--muted-foreground);
  }
  @media (hover: hover) {
    .zm-monitor-third-line-pill-clickable-warning:hover {
      --monitor-third-line-pill-border: var(--color-status-warning);
      @supports (color: color-mix(in lab, red, red)) {
        --monitor-third-line-pill-border: color-mix(
        in srgb,
        var(--color-status-warning) 50%,
        transparent
      );
      }
      --monitor-third-line-pill-bg: var(--color-status-warning-soft);
    }
    .zm-monitor-third-line-pill-clickable-accent:hover {
      --monitor-third-line-pill-border: var(--color-status-active);
      @supports (color: color-mix(in lab, red, red)) {
        --monitor-third-line-pill-border: color-mix(
        in srgb,
        var(--color-status-active) 50%,
        transparent
      );
      }
      --monitor-third-line-pill-bg: var(--color-status-active-soft);
    }
    .zm-monitor-third-line-pill-clickable-danger:hover {
      --monitor-third-line-pill-border: var(--color-status-error);
      @supports (color: color-mix(in lab, red, red)) {
        --monitor-third-line-pill-border: color-mix(
        in srgb,
        var(--color-status-error) 50%,
        transparent
      );
      }
      --monitor-third-line-pill-bg: var(--color-status-error-soft);
    }
    .zm-monitor-column-resize-handle:hover::before {
      background: var(--primary);
      @supports (color: color-mix(in lab, red, red)) {
        background: color-mix(in srgb, var(--primary) 70%, transparent);
      }
    }
  }
}
@media (forced-colors: active) {
  .zm-monitor-third-line-pill {
    border-color: CanvasText;
    border-style: solid;
    background: Canvas;
    color: CanvasText;
  }
  .zm-monitor-third-line-pill-accent {
    border-style: dotted;
  }
  .zm-monitor-third-line-pill-warning {
    border-style: dashed;
  }
  .zm-monitor-third-line-pill-danger {
    outline: 1px solid CanvasText;
    outline-offset: 1px;
  }
  .zm-monitor-third-line-pill-neutral {
    border-color: GrayText;
    color: GrayText;
  }
}
@font-face {
  font-family: "Geist Mono";
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  font-feature-settings: "tnum" 1, "zero" 1;
  src: url("/@fs/Users/zhoupengpeng/Code/zml/node_modules/.pnpm/@fontsource-variable+geist-mono@5.3.0/node_modules/@fontsource-variable/geist-mono/files/geist-mono-latin-wght-normal.woff2") format("woff2-variations");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@layer base {
  body {
    font-size: var(--text-base);
    line-height: var(--text-base--line-height);
    font-weight: var(--font-weight-regular);
  }
  * {
    border-color: var(--border);
    outline-color: var(--ring);
    @supports (color: color-mix(in lab, red, red)) {
      outline-color: color-mix(in oklab, var(--ring) 50%, transparent);
    }
  }
  html {
    height: 100%;
    background: var(--background);
    overflow-x: clip;
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
  }
  body {
    background-color: var(--background);
    font-family: var(--font-sans);
    color: var(--foreground);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    min-height: 100dvh;
    overflow-x: clip;
    font-variant-numeric: proportional-nums;
    font-feature-settings: normal;
  }
  * {
    scrollbar-width: thin;
  }
}
.scrollbar-always-visible::-webkit-scrollbar-thumb {
  background-color: var(--border);
}
.scrollbar-always-visible::-webkit-scrollbar-thumb:hover {
  background-color: var(--muted-foreground);
}
.scrollbar-always-visible {
  scrollbar-color: var(--border) transparent;
}
.hide-scrollbar::-webkit-scrollbar {
  display: none;
}
.hide-scrollbar {
  -ms-overflow-style: none;
  scrollbar-width: none;
}
.local-scroll-performance {
  -webkit-overflow-scrolling: touch;
  overscroll-behavior-x: contain;
  overscroll-behavior-y: auto;
}
@media (any-pointer: coarse) {
  [data-auth-boundary="true"] [data-slot="auth-field"] input {
    min-height: var(--control-auth);
  }
  [data-auth-boundary="true"] [data-slot="auth-action"] {
    min-height: var(--control-auth);
    min-width: var(--control-auth);
  }
}
@layer utilities {
  .material-elevation-outline {
    box-shadow: var(--material-shadow-outline);
  }
  .material-elevation-popover {
    box-shadow: var(--material-shadow-popover);
  }
  .material-elevation-inset {
    box-shadow: inset 0 1px 0 var(--foreground);
    @supports (color: color-mix(in lab, red, red)) {
      box-shadow: inset 0 1px 0 color-mix(in srgb, var(--foreground) 5%, transparent);
    }
  }
  :root {
    --scroll-fade-stop-default: var(--background);
    @supports (color: color-mix(in lab, red, red)) {
      --scroll-fade-stop-default: color-mix(
      in srgb,
      var(--background) 80%,
      transparent
    );
    }
    --scroll-fade-stop-strong: var(--background);
    @supports (color: color-mix(in lab, red, red)) {
      --scroll-fade-stop-strong: color-mix(
      in srgb,
      var(--background) 70%,
      transparent
    );
    }
  }
}
[data-slot="select"]:focus-visible {
  outline-offset: var(--focus-offset-inset);
}
:is( [data-slot="input"], [data-slot="textarea"], [data-slot="combobox-input"], [data-slot="tabs-trigger"], [data-slot="line-choice-item"], [data-slot="table-row"], [data-slot="workspace-tab-carrier"], [data-slot="chip"], [data-slot="segmented-option"] ):focus-visible {
  outline-offset: var(--focus-offset-clipped);
}
[data-slot="combobox-input-group"]:has( [data-slot="combobox-input"]:focus-visible ) {
  outline: var(--focus-ring-outline);
  outline-offset: var(--focus-offset-clipped);
}
[data-slot="combobox-input-group"] [data-slot="combobox-input"]:focus-visible {
  outline: none;
}
[data-slot="radio-card-option"] :is([data-slot="radio-card-control"], [data-slot="checkbox"]):focus-visible {
  outline: none;
}
[data-slot="radio-card-option"]:has(:focus-visible) {
  outline: var(--focus-ring-outline);
  outline-offset: var(--focus-offset-standalone);
}
@media (any-pointer: coarse) {
  [data-coarse-hit] {
    touch-action: manipulation;
  }
  [data-coarse-hit]:not(.absolute):not(.sr-only) {
    position: relative;
  }
  [data-coarse-hit]:not(.sr-only)::before {
    position: absolute;
    inset-inline: 0;
    top: 50%;
    block-size: var(--control-room-coarse-control-size);
    content: "";
    transform: translateY(-50%);
  }
  [data-coarse-hit="square"]::before {
    inset-inline: auto;
    inset-inline-start: 50%;
    inline-size: max(100%, var(--control-room-coarse-control-size));
    transform: translate(-50%, -50%);
  }
}
@media (forced-colors: active) {
  [aria-invalid="true"]:focus-visible {
    outline-style: dashed;
  }
  [data-slot="combobox-input-group"]:has([aria-invalid="true"]):has( [data-slot="combobox-input"]:focus-visible ) {
    outline-style: dashed;
  }
  [data-slot="table-row"][data-selected="true"] > :is(th, td) {
    color: HighlightText;
    background: Highlight;
  }
  [data-slot="table-row"][data-selected="true"] > :is(th, td) :where(*) {
    color: HighlightText;
  }
  [data-slot="table-row"]:is( [aria-current="true"], :has([aria-expanded="true"]) ):not(:focus-visible) {
    outline: 2px dashed CanvasText;
    outline-offset: -2px;
  }
  [data-slot="table-row"][data-selected="true"]:is( [aria-current="true"], :has([aria-expanded="true"]) ):not(:focus-visible) {
    outline-color: HighlightText;
  }
  [data-slot="table-row"][data-selected="true"]:focus-visible {
    outline-color: HighlightText;
  }
}
@media (forced-colors: active) and (hover: hover) {
  [data-slot="table-row"][data-interactive="true"]:hover:not( :focus-visible ):not([aria-current="true"]):not(:has([aria-expanded="true"])) {
    outline: 1px dotted CanvasText;
    outline-offset: -1px;
  }
}
@media (forced-colors: active) {
  [data-slot="checkbox"][data-disabled] {
    border-color: GrayText;
    color: GrayText;
  }
  [data-slot="switch"][data-disabled] {
    outline-color: GrayText;
  }
  [data-slot="switch"][data-disabled] [data-slot="switch-thumb"] {
    background: GrayText;
  }
  :is([data-slot="select-item"], [data-slot="combobox-item"])[data-highlighted] {
    color: HighlightText;
    background: Highlight;
  }
  [data-slot="tabs-trigger"][data-active], [data-slot="tabs-trigger"][data-active] *, button[aria-pressed="true"], button[aria-pressed="true"] * {
    color: HighlightText;
  }
  [data-slot="tabs-trigger"][data-active], button[aria-pressed="true"] {
    background: Highlight;
    forced-color-adjust: none;
  }
  [data-slot="line-choice-item"][data-checked]::after {
    background: Highlight;
  }
  [data-slot="alert"] {
    border-color: CanvasText;
    border-style: solid;
  }
  [data-slot="alert"][role="status"] {
    border-style: dashed;
  }
  [data-slot="alert"][role="alert"] {
    outline: 1px solid CanvasText;
    outline-offset: 1px;
  }
  [data-slot="missing-value"] {
    color: GrayText;
  }
  .material-elevation-outline, .material-elevation-popover, .material-elevation-inset {
    box-shadow: none;
  }
  .material-elevation-outline, .material-elevation-popover {
    outline: 1px solid CanvasText;
    outline-offset: -1px;
  }
}
.site {
  --site-max: var(--marketing-grid-max);
  --site-gutter: var(--marketing-gutter-wide);
  --site-prose: var(--marketing-measure);
  --site-header: var(--marketing-nav-wide);
  --site-section: var(--marketing-rhythm-wide);
  --site-text: var(--foreground);
  --site-text-2: var(--secondary-foreground);
  --site-text-3: var(--muted-foreground);
  --site-line: var(--border);
  --site-line-soft: var(--border-subtle);
  --site-panel: var(--card);
  --site-display: var(--marketing-display-wide);
  --site-display-line: 1;
  --site-display-track: var(--marketing-tracking);
  --site-h1: var(--marketing-hero-wide);
  --site-h1-line: 1;
  --site-h1-track: var(--marketing-tracking);
  --site-h2: var(--marketing-heading-wide);
  --site-h2-line: 1;
  --site-h2-track: var(--marketing-tracking);
  --site-h3: var(--marketing-title);
  --site-h3-line: 1.33;
  --site-h3-track: var(--marketing-tracking-title);
  --site-h4: var(--marketing-subtitle);
  --site-h4-line: 1.33;
  --site-h4-track: var(--marketing-tracking-title);
  --site-lead: var(--marketing-lead);
  --site-lead-line: 1.33;
  --site-lead-track: var(--marketing-tracking-title);
  --site-body: var(--marketing-body);
  --site-body-line: 1.6;
  --site-body-track: var(--marketing-tracking-body);
  --site-small: var(--marketing-small);
  --site-small-line: 1.5;
  --site-small-track: var(--marketing-tracking-small);
  --site-micro: var(--marketing-micro);
  --site-tag: var(--marketing-tag);
  --site-w-regular: var(--font-weight-regular);
  --site-w-medium: var(--marketing-hero-weight);
  --site-w-semibold: var(--marketing-heading-weight);
  --site-hover: var(--motion-express-hover) var(--ease-express-hover);
  --site-swap: var(--motion-express-swap) var(--ease-express-hover);
  --site-nudge: calc(var(--motion-express-magnet) * 1px);
  font-family: var(--font-sans);
  font-feature-settings: "cv01", "ss03";
  scroll-padding-top: calc(var(--site-header) + 24px);
}
@media (width < 1024px) {
  .site {
    --site-gutter: var(--marketing-gutter-medium);
    --site-section: var(--marketing-rhythm-medium);
    --site-display: var(--marketing-display-medium);
    --site-h1: var(--marketing-hero-medium);
    --site-h2: var(--marketing-heading-medium);
    --site-lead: var(--marketing-lead-medium);
  }
}
@media (width < 640px) {
  .site {
    --site-gutter: var(--marketing-gutter-narrow);
    --site-section: var(--marketing-rhythm-narrow);
    --site-header: var(--marketing-nav-narrow);
    --site-display: var(--marketing-display-narrow);
    --site-h1: var(--marketing-hero-narrow);
    --site-h1-line: 1.1;
    --site-h2: var(--marketing-heading-narrow);
    --site-h2-line: 1.33;
    --site-h3: var(--marketing-title-narrow);
    --site-lead: var(--marketing-lead-narrow);
    --site-lead-line: 1.5;
  }
}
*, *::before, *::after {
  box-sizing: border-box;
}
@media (any-pointer: coarse) {
  :where(.site a[href], .site button) {
    position: relative;
  }
  :where(.site a[href], .site button)::after {
    content: "";
    position: absolute;
    inset-block: min(0px, calc(50% - var(--hit-plane-coarse) / 2));
    inset-inline: min(0px, calc(50% - var(--hit-plane-coarse) / 2));
  }
}
html {
  -webkit-text-size-adjust: 100%;
}
body.site {
  margin: 0;
  background: var(--background);
  color: var(--site-text);
  font-size: var(--site-body);
  line-height: var(--site-body-line);
  letter-spacing: var(--site-body-track);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}
:where(.site) :is(h1, h2, h3, h4, p, figure, ul, ol, dl, dd) {
  margin: 0;
  padding: 0;
}
:where(.site) :is(ul, ol) {
  list-style: none;
}
:where(.site) a {
  color: inherit;
  text-decoration: none;
  -webkit-tap-highlight-color: transparent;
}
:where(.site) :is(img, svg) {
  max-width: 100%;
}
.site [hidden] {
  display: none !important;
}
.site ::selection {
  background: var(--primary);
  color: var(--primary-foreground);
}
.site :focus-visible {
  outline: var(--focus-ring-outline);
  outline-offset: 3px;
  border-radius: 4px;
}
.s-wrap {
  width: min(var(--site-max), 100% - var(--site-gutter) * 2);
  margin-inline: auto;
}
.s-prose {
  max-width: var(--site-prose);
}
.s-section {
  padding-block: var(--site-section);
}
.s-rule {
  border-top: 1px solid var(--site-line-soft);
}
.s-display {
  font-size: var(--site-display);
  line-height: var(--site-display-line);
  letter-spacing: var(--site-display-track);
  font-weight: var(--site-w-medium);
  text-wrap: balance;
}
.s-h1 {
  font-size: var(--site-h1);
  line-height: var(--site-h1-line);
  letter-spacing: var(--site-h1-track);
  font-weight: var(--site-w-medium);
  text-wrap: balance;
}
.s-hl {
  display: block;
}
:is(:lang(zh), :lang(ja), :lang(ko)) :is(.s-display, .s-h1, .s-h2, .s-h3) {
  word-break: keep-all;
  line-break: strict;
  overflow-wrap: anywhere;
}
.s-h2 {
  font-size: var(--site-h2);
  line-height: var(--site-h2-line);
  letter-spacing: var(--site-h2-track);
  font-weight: var(--site-w-medium);
  text-wrap: balance;
}
.s-h3 {
  font-size: var(--site-h3);
  line-height: var(--site-h3-line);
  letter-spacing: var(--site-h3-track);
  font-weight: var(--site-w-semibold);
}
.s-h4 {
  font-size: var(--site-h4);
  line-height: var(--site-h4-line);
  letter-spacing: var(--site-h4-track);
  font-weight: var(--site-w-semibold);
  color: var(--site-text-2);
}
.s-lead {
  font-size: var(--site-lead);
  line-height: var(--site-lead-line);
  letter-spacing: var(--site-lead-track);
  color: var(--site-text-2);
  text-wrap: pretty;
}
.s-body {
  color: var(--site-text-3);
  text-wrap: pretty;
}
.s-small {
  font-size: var(--site-small);
  line-height: var(--site-small-line);
  letter-spacing: var(--site-small-track);
  color: var(--site-text-3);
}
.s-micro {
  font-size: var(--site-micro);
  line-height: 1.4;
  color: var(--site-text-3);
}
.s-tag {
  font-family: var(--font-mono);
  font-size: var(--site-tag);
  letter-spacing: var(--marketing-tracking-tag);
  text-transform: uppercase;
  color: var(--site-text-3);
}
.s-num {
  font-variant-numeric: tabular-nums;
  font-feature-settings: var(--font-feature-numeric);
}
:is(:lang(zh), :lang(ja), :lang(ko), :lang(th), :lang(hi), :lang(ar)) :is(.s-display, .s-h1, .s-h2) {
  letter-spacing: -0.005em;
  line-height: 1.2;
}
:is(:lang(zh), :lang(ja), :lang(ko), :lang(th), :lang(hi), :lang(ar)) .s-tag {
  text-transform: none;
  letter-spacing: 0;
  font-family: inherit;
}
.s-header {
  position: fixed;
  inset: 0 0 auto 0;
  z-index: var(--z-navigation, 50);
  height: var(--site-header);
  display: flex;
  align-items: center;
  border-bottom: 1px solid var(--foreground);
  @supports (color: color-mix(in lab, red, red)) {
    border-bottom: 1px solid color-mix(in srgb, var(--foreground) 8%, transparent);
  }
  background: var(--background);
  @supports (color: color-mix(in lab, red, red)) {
    background: color-mix(in lch, var(--background) 80%, transparent);
  }
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
}
.s-header-row {
  display: flex;
  align-items: center;
  gap: 24px;
}
.s-brand {
  display: inline-flex;
  align-items: center;
  flex: none;
  border-radius: 6px;
}
.s-brand img {
  display: block;
  height: 24px;
  width: auto;
}
.s-nav {
  display: flex;
  align-items: center;
  margin-inline-start: auto;
}
.s-nav a, .s-ghost {
  display: inline-flex;
  align-items: center;
  height: 32px;
  padding-inline: 12px;
  border-radius: 9999px;
  font-size: var(--site-small);
  color: var(--site-text-3);
  transition: color var(--site-hover), background-color var(--site-hover);
  white-space: nowrap;
}
.s-nav a:hover, .s-ghost:hover, .s-nav a[aria-current="page"] {
  color: var(--site-text);
}
.s-header-tools {
  display: flex;
  align-items: center;
  gap: 8px;
  padding-inline-start: 16px;
  margin-inline-start: 8px;
  border-inline-start: 1px solid var(--site-line);
}
.s-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 32px;
  padding-inline: 14px;
  border-radius: 9999px;
  font-size: var(--site-small);
  font-weight: var(--site-w-medium);
  background: var(--foreground);
  @supports (color: color-mix(in lab, red, red)) {
    background: color-mix(in lch, var(--foreground) 90%, var(--background));
  }
  color: var(--background);
  transition: background-color var(--site-hover);
  white-space: nowrap;
}
.s-pill:hover {
  background: var(--foreground);
}
.s-pill {
  min-width: 0;
}
.s-pill[data-size="lg"] {
  height: 40px;
  padding-inline: 18px;
  font-size: var(--marketing-control-large);
}
.s-pill[data-tone="quiet"] {
  background: var(--foreground);
  @supports (color: color-mix(in lab, red, red)) {
    background: color-mix(in srgb, var(--foreground) 6%, transparent);
  }
  color: var(--site-text);
  box-shadow: inset 0 0 0 1px var(--site-line);
}
.s-pill[data-tone="quiet"]:hover {
  background: var(--foreground);
  @supports (color: color-mix(in lab, red, red)) {
    background: color-mix(in srgb, var(--foreground) 10%, transparent);
  }
}
.s-menu {
  position: relative;
}
.s-menu > summary {
  list-style: none;
  cursor: pointer;
}
.s-menu > summary::-webkit-details-marker {
  display: none;
}
.s-menu-panel {
  position: absolute;
  inset-inline-end: 0;
  top: calc(100% + 8px);
  min-width: 200px;
  max-height: min(70vh, 480px);
  overflow: auto;
  padding: 6px;
  border: 1px solid var(--site-line);
  border-radius: 12px;
  background: var(--popover, var(--site-panel));
  box-shadow: 0 16px 48px rgb(0 0 0 / 0.5);
  display: grid;
}
.s-menu-panel a {
  display: flex;
  align-items: center;
  min-height: 32px;
  padding: 0 10px;
  border-radius: 8px;
  font-size: var(--site-small);
  color: var(--site-text-2);
  transition: background-color var(--site-hover);
}
.s-menu-panel a:hover, .s-menu-panel a[aria-current] {
  background: var(--control-hover);
  color: var(--site-text);
}
.s-burger {
  display: none;
}
@media (width < 1024px) {
  .s-nav, .s-header-tools .s-ghost {
    display: none;
  }
  .s-header-tools {
    border: 0;
    padding: 0;
    margin-inline-start: auto;
  }
  .s-burger {
    display: block;
  }
  .s-burger > summary {
    width: 44px;
    height: 44px;
    display: grid;
    place-items: center;
    border-radius: 9999px;
    color: var(--site-text-2);
  }
  .s-burger .s-menu-panel {
    position: fixed;
    inset: var(--site-header) 0 0 0;
    max-height: none;
    height: calc(100dvh - var(--site-header));
    overflow-y: auto;
    overscroll-behavior: contain;
    align-content: start;
    border-radius: 0;
    border: 0;
    min-width: 0;
    padding: 12px var(--site-gutter) calc(24px + env(safe-area-inset-bottom, 0px));
    background: var(--background);
  }
  html:has(.s-burger[open]) {
    overflow: hidden;
  }
  .s-burger .s-menu-panel a {
    min-height: 44px;
    font-size: var(--site-body);
  }
}
.s-main {
  padding-top: var(--site-header);
}
.s-skip {
  position: absolute;
  inset-inline-start: 16px;
  top: -64px;
  z-index: var(--z-skip-link, 100);
  padding: 8px 12px;
  border-radius: 8px;
  background: var(--foreground);
  color: var(--background);
  font-size: var(--site-small);
}
.s-skip:focus {
  top: 16px;
}
.s-hero {
  padding-block: 128px 64px;
}
.s-hero-copy {
  display: grid;
  gap: 32px;
  max-width: 900px;
}
.s-hero-copy .s-body {
  font-size: var(--site-body);
  max-width: 560px;
}
.s-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
}
@media (width < 640px) {
  .s-hero {
    padding-block: 72px 40px;
  }
  .s-hero-copy {
    gap: 24px;
  }
}
.s-frame {
  position: relative;
  border: 1px solid var(--site-line);
  border-radius: 16px;
  background: var(--site-panel);
  overflow: hidden;
  box-shadow: 0 0 0 1px var(--foreground), 0 40px 120px -40px rgb(0 0 0 / 0.8);
  @supports (color: color-mix(in lab, red, red)) {
    box-shadow: 0 0 0 1px color-mix(in srgb, var(--foreground) 3%, transparent), 0 40px 120px -40px rgb(0 0 0 / 0.8);
  }
}
.s-spacer {
  margin-inline-start: auto;
}
.s-app-body {
  display: grid;
  grid-template-columns: 216px minmax(0, 1fr);
  min-height: 560px;
}
.s-app-rail {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 12px 10px;
  border-inline-end: 1px solid var(--site-line-soft);
  background: var(--site-panel);
  @supports (color: color-mix(in lab, red, red)) {
    background: color-mix(in lch, var(--site-panel) 60%, var(--background));
  }
}
.s-app-owner {
  display: flex;
  align-items: center;
  gap: 10px;
  height: 32px;
  padding-inline: 8px;
  font-size: var(--site-small);
}
.s-app-owner strong {
  font-weight: var(--site-w-medium);
}
.s-app-rail nav {
  display: grid;
  gap: 2px;
}
.s-app-rail nav a {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 30px;
  padding-inline: 8px;
  border-radius: 8px;
  font-size: var(--site-small);
  color: var(--site-text-3);
  transition: background-color var(--site-hover), color var(--site-hover);
}
.s-app-rail nav a:hover {
  color: var(--site-text);
  background: var(--control-hover);
}
.s-app-rail nav a[aria-current] {
  color: var(--site-text);
  background: var(--control-current);
}
.s-app-main {
  min-width: 0;
  display: flex;
  flex-direction: column;
}
.s-app-title {
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 48px;
  padding-inline: 16px;
  border-bottom: 1px solid var(--site-line-soft);
  font-size: var(--site-small);
}
.s-app-title strong {
  font-weight: var(--site-w-medium);
}
.s-frame-scope {
  color: var(--site-text-3);
}
.s-app-views {
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 8px 12px;
  border-bottom: 1px solid var(--site-line-soft);
  overflow-x: auto;
}
.s-app-views button {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  height: 28px;
  padding-inline: 12px;
  border: 0;
  border-radius: 9999px;
  background: transparent;
  color: var(--site-text-3);
  font: inherit;
  font-size: var(--site-small);
  cursor: pointer;
  white-space: nowrap;
  transition: color var(--site-hover);
}
.s-app-views button:not(:disabled):hover, .s-app-views button[aria-pressed="true"] {
  color: var(--site-text);
}
.s-app-views button:disabled {
  color: var(--site-text-3);
  cursor: default;
}
.s-app-views button em {
  font-style: normal;
  font-size: var(--site-tag);
  color: var(--site-text-3);
}
.s-app-views .zml-fx-glide {
  background: var(--control-selected);
}
.site:not(.zml-fx) .s-app-views button[aria-pressed="true"] {
  background: var(--control-selected);
}
.s-app-rail nav .s-app-item {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 30px;
  padding-inline: 8px;
  border-radius: 8px;
  font-size: var(--site-small);
  color: var(--site-text-3);
}
.s-app-rail nav .s-app-item[aria-current] {
  color: var(--site-text);
  background: var(--control-current);
}
.s-app-views > span {
  display: inline-flex;
  align-items: center;
  height: 28px;
  padding-inline: 12px;
  border-radius: 9999px;
  font-size: var(--site-small);
  color: var(--site-text-3);
  white-space: nowrap;
}
.s-app-views > span[data-on] {
  color: var(--site-text);
  background: var(--control-selected);
}
.s-sim {
  font-size: var(--site-tag);
  padding: 2px 8px;
  border-radius: 9999px;
  border: 1px solid var(--site-line);
  color: var(--site-text-3);
  white-space: nowrap;
}
.s-board .s-dim {
  color: var(--site-text-3);
}
.s-board td[data-row-rail] {
  position: relative;
}
.s-board tr:is([data-state="running"], [aria-selected="true"]) {
  --zml-row-rail-color: var(--primary);
  --zml-row-rail-forced: Highlight;
}
.s-app-summary {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 28px;
  margin: auto 0 0 !important;
  padding: 12px 16px;
  border-top: 1px solid var(--site-line-soft);
  font-size: var(--site-small);
}
.s-app-summary > div {
  display: flex;
  gap: 8px;
  align-items: baseline;
}
.s-app-summary dt {
  color: var(--site-text-3);
}
.s-app-summary dd {
  color: var(--site-text);
}
.s-app-summary [data-sign="pos"] {
  color: var(--financial-positive);
}
.s-board-scroll {
  overflow-x: auto;
  --zml-table-host-surface: var(--site-panel);
}
[data-showcase-board] .s-board-scroll {
  overflow-x: auto;
  overscroll-behavior-inline: contain;
}
[data-showcase-board] .s-board th {
  white-space: normal;
  line-height: 1.25;
  text-wrap: balance;
}
[data-showcase-board] .s-board :is(th, td) {
  unicode-bidi: isolate;
}
.s-board {
  width: 100%;
  border-collapse: collapse;
  font-size: var(--site-small);
  min-width: 720px;
}
.s-board th {
  text-align: start;
  font-weight: var(--site-w-regular);
  color: var(--site-text-3);
  height: 36px;
  padding: 0 16px;
  border-bottom: 1px solid var(--site-line-soft);
  white-space: nowrap;
}
.s-board td {
  height: 52px;
  padding: 0 16px;
  border-bottom: 1px solid var(--site-line-soft);
  color: var(--site-text-2);
  white-space: nowrap;
  vertical-align: middle;
}
.s-board tbody tr:nth-child(even of :not([hidden])) td {
  background: var(--foreground);
  @supports (color: color-mix(in lab, red, red)) {
    background: color-mix(in srgb, var(--foreground) 1.6%, transparent);
  }
}
.s-board tbody tr {
  transition: background-color var(--site-hover);
}
.s-board tbody tr:hover td {
  background: var(--foreground);
  @supports (color: color-mix(in lab, red, red)) {
    background: color-mix(in srgb, var(--foreground) 4%, transparent);
  }
}
.s-board :is(th, td).s-end {
  text-align: end;
}
.s-board .s-line {
  display: flex;
  align-items: center;
  gap: 6px;
  line-height: 20px;
}
.s-board .s-end .s-line {
  justify-content: flex-end;
}
.s-board .s-line em {
  font-style: normal;
  color: var(--site-text-3);
}
.s-board .s-pair {
  color: var(--site-text);
}
.s-board .s-venue em {
  font-size: var(--site-tag);
}
.s-board [data-sign="pos"] {
  color: var(--financial-positive);
}
.s-board [data-sign="neg"] {
  color: var(--financial-negative);
}
.s-frame-foot {
  padding: 10px 16px;
  border-top: 1px solid var(--site-line-soft);
  margin-top: auto !important;
}
.s-frame-empty {
  display: grid;
  gap: 16px;
  place-items: center;
  text-align: center;
  padding: 96px 24px;
  color: var(--site-text-3);
}
@media (width < 768px) {
  .s-app-body {
    grid-template-columns: 1fr;
    min-height: 0;
  }
  .s-app-rail {
    display: none;
  }
  .s-frame-scope {
    display: none;
  }
}
.s-app-split {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 300px;
  flex: 1;
  min-height: 0;
}
[data-showcase-board][data-interactive="true"] .s-board tbody tr {
  cursor: pointer;
}
.s-board tbody tr[aria-selected="true"] td {
  background: var(--control-selected);
}
.s-board tbody tr:focus-visible {
  outline: 0;
}
.s-board tbody tr:focus-visible td {
  background: var(--control-hover);
  box-shadow: inset 0 1px 0 var(--border-focus), inset 0 -1px 0 var(--border-focus);
}
.s-detail {
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding: 16px;
  border-inline-start: 1px solid var(--site-line-soft);
  font-size: var(--site-small);
}
.s-detail header {
  display: grid;
  gap: 4px;
}
.s-detail header strong {
  font-size: var(--site-h4);
  font-weight: var(--site-w-semibold);
  letter-spacing: var(--site-h4-track);
}
.s-detail section {
  display: grid;
  gap: 2px;
  padding: 12px;
  border: 1px solid var(--site-line-soft);
  border-radius: 10px;
  border-inline-start-width: 2px;
}
.s-detail section[data-side="long"] {
  border-inline-start-color: var(--financial-positive);
}
.s-detail section[data-side="short"] {
  border-inline-start-color: var(--financial-negative);
}
.s-detail-label {
  font-size: var(--site-tag);
  color: var(--site-text-3);
}
.s-detail-venue {
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--site-text);
  font-weight: var(--site-w-medium);
}
.s-detail-sub {
  color: var(--site-text-3);
  font-size: var(--site-micro);
  direction: ltr;
  unicode-bidi: isolate;
}
.s-detail-price {
  margin-top: 6px !important;
  font-size: var(--marketing-emphasis);
  color: var(--site-text);
}
.s-detail dl {
  display: grid;
  gap: 8px;
}
.s-detail dl > div {
  display: flex;
  justify-content: space-between;
  gap: 12px;
}
.s-detail dt {
  color: var(--site-text-3);
}
.s-detail dd {
  color: var(--site-text);
}
.s-detail [data-sign="pos"] {
  color: var(--financial-positive);
}
.s-detail [data-sign="neg"] {
  color: var(--financial-negative);
}
.s-detail .s-pill {
  margin-top: auto;
}
@media (width < 1280px) {
  .s-app-split {
    grid-template-columns: 1fr;
  }
  .s-detail {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    border-inline-start: 0;
    border-block-start: 1px solid var(--site-line-soft);
  }
  .s-detail > :is(header, dl, .s-pill) {
    grid-column: 1 / -1;
  }
  .s-detail section {
    min-width: 0;
  }
}
.s-venues {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.s-venues li img {
  border-radius: 50%;
}
.s-venues li {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px 14px;
  border-radius: 9999px;
  border: 1px solid var(--site-line);
  font-size: var(--site-small);
  color: var(--site-text-2);
}
.s-main {
  overflow-x: clip;
}
.s-venue-strip {
  margin-top: 72px;
  display: grid;
  gap: 20px;
}
.s-marquee {
  display: flex;
  overflow: hidden;
  -webkit-mask-image: linear-gradient(to right, transparent, #000 8%, #000 92%, transparent);
  mask-image: linear-gradient(to right, transparent, #000 8%, #000 92%, transparent);
}
.s-marquee ul {
  display: flex;
  flex: none;
  gap: 40px;
  padding-inline-end: 40px;
  animation: s-marquee var(--motion-express-ambient-marquee) linear infinite;
}
.s-marquee:hover ul, .s-marquee:focus-within ul {
  animation-play-state: paused;
}
.s-marquee li {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  white-space: nowrap;
  font-size: var(--site-body);
  color: var(--site-text-3);
  transition: color var(--site-hover);
}
.s-marquee li:hover {
  color: var(--site-text);
}
.s-marquee img {
  border-radius: 50%;
  filter: grayscale(1) brightness(1.4);
  opacity: 0.8;
  transition: filter var(--site-swap), opacity var(--site-swap);
}
.s-marquee li:hover img {
  filter: none;
  opacity: 1;
}
@keyframes s-marquee {
  to {
    transform: translateX(-100%);
  }
}
[dir="rtl"] .s-marquee ul {
  animation-name: s-marquee-rtl;
}
@keyframes s-marquee-rtl {
  to {
    transform: translateX(100%);
  }
}
.s-stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  border-top: 1px solid var(--site-line-soft);
}
.s-stats > div {
  padding: 32px 0;
  display: grid;
  gap: 4px;
}
.s-stats > div + div {
  padding-inline-start: 32px;
  border-inline-start: 1px solid var(--site-line-soft);
}
.s-stats dt {
  order: 2;
}
.s-stats dd {
  font-size: var(--marketing-stat);
  line-height: 1.1;
  letter-spacing: var(--marketing-tracking-figure);
  font-weight: var(--site-w-medium);
}
@media (width < 640px) {
  .s-stats > div + div {
    padding-inline-start: 16px;
  }
  .s-stats > div {
    padding: 20px 0;
  }
}
.s-manifesto {
  font-size: var(--site-h2);
  line-height: 1.04;
  letter-spacing: var(--site-h2-track);
  font-weight: var(--site-w-medium);
  color: var(--site-text-3);
  max-width: 1180px;
  text-wrap: pretty;
}
.s-manifesto strong {
  color: var(--site-text);
  font-weight: inherit;
}
:is(:lang(zh), :lang(ja), :lang(ko), :lang(th), :lang(hi), :lang(ar)) .s-manifesto {
  letter-spacing: 0;
  line-height: 1.35;
}
.s-pillars {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-top: 96px;
}
.s-pillars > li {
  padding: 0;
  padding-inline-end: 32px;
  display: grid;
  gap: 12px;
  align-content: start;
}
.s-pillars > li + li {
  padding-inline-start: 32px;
  border-inline-start: 1px solid var(--site-line-soft);
}
.s-pillars :is(h2, h3) {
  font-size: var(--site-body);
  font-weight: var(--site-w-medium);
  color: var(--site-text);
  margin-top: 24px;
}
.s-fig {
  display: block;
  width: min(100%, 300px);
  height: auto;
  margin-top: 24px;
  color: var(--site-text-3);
  overflow: visible;
}
.s-fig-dim {
  opacity: 0.45;
}
.s-fig-node {
  fill: var(--background);
  stroke: var(--site-text-3);
}
.s-fig-flow {
  stroke: var(--primary);
  stroke-width: 1.5;
  stroke-dasharray: 26 400;
  stroke-dashoffset: 26;
  animation: s-flow var(--motion-express-ambient-flow) linear infinite;
}
.s-fig-flow[data-flow-step="1"] {
  animation-delay: var(--motion-express-ambient-flow-step);
}
.s-fig-flow[data-flow-step="2"] {
  animation-delay: calc(var(--motion-express-ambient-flow-step) * 2);
}
.s-fig-flow[data-flow-step="3"] {
  animation-delay: calc(var(--motion-express-ambient-flow-step) * 3);
}
.s-fig-accent {
  stroke: var(--site-text);
  transform-box: fill-box;
  transform-origin: center;
  animation: s-breathe var(--motion-express-ambient-breathe) ease-in-out infinite;
}
@keyframes s-flow {
  to {
    stroke-dashoffset: -426;
  }
}
@keyframes s-breathe {
  50% {
    opacity: 0.55;
  }
}
@media (width < 768px) {
  .s-pillars {
    grid-template-columns: 1fr;
    margin-top: 48px;
    gap: 32px;
  }
  .s-pillars > li + li {
    padding-inline-start: 0;
    border: 0;
  }
  .s-pillars :is(h2, h3) {
    margin-top: 16px;
  }
  .s-fig {
    width: 220px;
  }
}
.s-feature-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 48px;
  align-items: start;
  margin-bottom: 72px;
}
.s-feature-head .s-lead {
  max-width: 566px;
}
.s-more {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: 24px;
  font-size: var(--site-small);
  color: var(--site-text-3);
  transition: color var(--site-hover);
}
.s-more:hover {
  color: var(--site-text);
}
.s-more span {
  --s-more-dx: var(--site-nudge);
  transition: translate var(--site-swap);
}
[dir="rtl"] .s-more span {
  --s-more-dx: calc(var(--site-nudge) * -1);
  scale: -1 1;
}
@media (hover: hover) {
  .s-more:hover span {
    translate: var(--s-more-dx);
  }
}
.s-index {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 24px;
  margin-top: 48px;
  padding-top: 24px;
  border-top: 1px solid var(--site-line-soft);
}
@media (width < 768px) {
  .s-feature-head {
    grid-template-columns: 1fr;
    gap: 20px;
    margin-bottom: 40px;
  }
}
.s-table-scroll {
  overflow-x: auto;
}
.s-matrix {
  width: 100%;
  border-collapse: collapse;
  font-size: var(--site-small);
  min-width: 640px;
}
.s-matrix th, .s-matrix td {
  text-align: start;
  padding: 14px 16px;
  border-bottom: 1px solid var(--site-line-soft);
  vertical-align: top;
}
.s-matrix thead th {
  color: var(--site-text);
  font-weight: var(--site-w-medium);
  font-size: var(--site-body);
  border-bottom-color: var(--site-line);
}
.s-matrix tbody th {
  font-weight: var(--site-w-regular);
  color: var(--site-text-3);
  width: 32%;
  padding-inline-start: 0;
}
.s-matrix td {
  color: var(--site-text-2);
  border-inline-start: 1px solid var(--site-line-soft);
}
.s-matrix td[data-v="no"] {
  color: var(--site-text-3);
}
.s-matrix td[data-v="yes"] svg, .s-matrix td[data-v="no"] svg {
  display: inline-block;
  margin-inline-end: 8px;
  vertical-align: -2px;
}
.s-plans {
  display: grid;
  gap: 0;
  border: 1px solid var(--site-line);
  border-radius: 16px;
  overflow: hidden;
}
.s-plans[data-cols="3"] {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.s-plans[data-cols="4"] {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.s-plan {
  padding: 32px;
  display: grid;
  gap: 16px;
  align-content: start;
  background: var(--site-panel);
}
.s-plan + .s-plan {
  border-inline-start: 1px solid var(--site-line-soft);
}
.s-plan[data-featured] {
  background: var(--site-panel);
  @supports (color: color-mix(in lab, red, red)) {
    background: color-mix(in lch, var(--site-panel) 88%, var(--foreground));
  }
}
.s-plan-price {
  display: grid;
  gap: 2px;
  font-size: var(--site-body);
  color: var(--site-text-2);
}
.s-plan-price b {
  display: inline-block;
  font-size: var(--marketing-price);
  letter-spacing: var(--marketing-tracking-figure);
  color: var(--site-text);
  font-weight: var(--site-w-medium);
}
.s-plan-metric {
  display: grid;
  gap: 2px;
}
.s-plan-metric b {
  font-size: var(--marketing-metric);
  line-height: var(--marketing-metric-line);
  letter-spacing: var(--marketing-tracking-figure);
  font-weight: var(--site-w-medium);
  color: var(--site-text);
  direction: ltr;
  unicode-bidi: isolate;
}
.s-plan-metric span {
  font-size: var(--site-micro);
  color: var(--site-text-3);
}
.s-plan-metric + .s-plan-price b {
  font-size: var(--site-h4);
}
.s-plan-badge {
  justify-self: start;
  font-size: var(--site-tag);
  padding: 2px 8px;
  border-radius: 9999px;
  border: 1px solid var(--site-line);
  color: var(--site-text-2);
}
.s-plan ul {
  display: grid;
  gap: 8px;
  margin-top: 8px;
  padding-top: 16px;
  border-top: 1px solid var(--site-line-soft);
}
.s-plan li {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  font-size: var(--site-small);
  color: var(--site-text-3);
}
.s-plan li b {
  font-weight: var(--site-w-regular);
  color: var(--site-text-2);
  text-align: end;
}
@media (width < 1024px) {
  .s-plans[data-cols] {
    grid-template-columns: 1fr;
  }
  .s-plan + .s-plan {
    border-inline-start: 0;
    border-top: 1px solid var(--site-line-soft);
  }
}
.s-toggle {
  display: inline-flex;
  padding: 2px;
  border-radius: 9999px;
  border: 1px solid var(--site-line);
}
.s-toggle button {
  height: 28px;
  padding-inline: 14px;
  border: 0;
  border-radius: 9999px;
  background: transparent;
  color: var(--site-text-3);
  font: inherit;
  font-size: var(--site-small);
  cursor: pointer;
  transition: color var(--site-hover), background-color var(--site-swap);
}
.s-toggle button[aria-pressed="true"] {
  background: var(--control-selected);
  color: var(--site-text);
}
.s-reading {
  padding-block: 96px var(--site-section);
  display: grid;
  gap: 64px;
}
.s-reading-head {
  display: grid;
  gap: 20px;
  max-width: 800px;
}
.s-articles {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0;
  border-top: 1px solid var(--site-line-soft);
}
.s-articles > article {
  padding: 32px 0;
  padding-inline-end: 32px;
  border-bottom: 1px solid var(--site-line-soft);
  display: grid;
  gap: 12px;
  align-content: start;
}
.s-articles > article:nth-child(even) {
  padding-inline: 32px 0;
  border-inline-start: 1px solid var(--site-line-soft);
}
.s-articles > article:last-child:nth-child(odd) {
  grid-column: 1 / -1;
  padding-inline-end: 0;
}
.s-articles > article:last-child:nth-child(odd) > :is(p, ul) {
  max-width: 68ch;
}
.s-articles ul {
  display: grid;
  gap: 8px;
}
.s-articles li {
  position: relative;
  padding-inline-start: 18px;
  color: var(--site-text-3);
}
.s-articles li::before {
  content: "";
  position: absolute;
  inset-inline-start: 4px;
  top: 0.72em;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: var(--site-text-3);
}
@media (width < 768px) {
  .s-articles {
    grid-template-columns: 1fr;
  }
  .s-articles > article, .s-articles > article:nth-child(even) {
    padding: 24px 0;
    border-inline-start: 0;
  }
}
.s-terms {
  display: grid;
  gap: 40px;
  max-width: var(--site-prose);
  counter-reset: term;
}
.s-terms section {
  display: grid;
  gap: 8px;
}
.s-faq details {
  border-bottom: 1px solid var(--site-line-soft);
}
.s-faq summary {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: center;
  min-height: 64px;
  cursor: pointer;
  list-style: none;
  font-size: var(--marketing-emphasis);
  color: var(--site-text);
}
.s-faq summary::-webkit-details-marker {
  display: none;
}
.s-faq summary::after {
  content: "+";
  color: var(--site-text-3);
  font-size: var(--site-h4);
  transition: transform var(--site-swap);
}
.s-faq details[open] summary::after {
  transform: rotate(45deg);
}
.s-faq details p {
  padding-bottom: 24px;
  max-width: var(--site-prose);
  color: var(--site-text-3);
}
.s-log {
  display: grid;
}
.s-log > li {
  display: grid;
  grid-template-columns: 160px minmax(0, 1fr);
  gap: 24px;
  padding: 24px 0;
  border-top: 1px solid var(--site-line-soft);
}
.s-log time {
  color: var(--site-text-3);
  font-size: var(--site-small);
}
@media (width < 640px) {
  .s-log > li {
    grid-template-columns: 1fr;
    gap: 6px;
  }
}
.s-closing {
  padding-block: 160px;
  text-align: center;
  display: grid;
  gap: 32px;
  justify-items: center;
}
.s-closing .s-body {
  max-width: 520px;
}
@media (width < 640px) {
  .s-closing {
    padding-block: 96px;
  }
}
.s-footer {
  border-top: 1px solid var(--site-line);
  padding-block: 64px 48px;
}
.s-footer-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) repeat(4, minmax(0, 1fr));
  gap: 32px;
}
.s-footer h3 {
  font-size: var(--site-small);
  font-weight: var(--site-w-medium);
  color: var(--site-text);
  margin-bottom: 16px;
}
.s-footer li + li {
  margin-top: 10px;
}
.s-footer a {
  font-size: var(--site-small);
  color: var(--site-text-3);
  transition: color var(--site-hover);
}
.s-footer a:hover {
  color: var(--site-text);
}
.s-footer-end {
  margin-top: 64px;
  padding-top: 24px;
  border-top: 1px solid var(--site-line-soft);
  display: flex;
  flex-wrap: wrap;
  gap: 12px 32px;
  justify-content: space-between;
}
@media (width < 768px) {
  .s-footer-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .s-footer-grid > :first-child {
    grid-column: 1 / -1;
  }
}
.s-feature-cards {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}
.s-feature-cards .s-card {
  padding: 0 0 28px;
  overflow: hidden;
}
.s-feature-cards .s-card > :not(.s-mini) {
  padding-inline: 28px;
}
.s-feature-cards .s-h4 {
  color: var(--site-text);
  margin-top: 8px;
}
.s-mini {
  display: grid;
  align-content: center;
  gap: 10px;
  height: 300px;
  overflow: hidden;
  padding: 24px 28px;
  border-bottom: 1px solid var(--site-line-soft);
  background: var(--site-panel);
  @supports (color: color-mix(in lab, red, red)) {
    background: color-mix(in lch, var(--site-panel) 55%, var(--background));
  }
  font-size: var(--site-micro);
  color: var(--site-text-3);
}
.s-mini-pair {
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr) auto;
  gap: 2px 10px;
  align-items: center;
  padding-block: 8px;
  border-bottom: 1px solid var(--site-line-soft);
}
.s-mini-pair:last-child {
  border-bottom: 0;
}
.s-mini-pair strong {
  grid-row: span 2;
  color: var(--site-text);
  font-weight: var(--site-w-medium);
  font-size: var(--site-small);
}
.s-mini-pair em {
  grid-row: 1 / span 2;
  grid-column: 3;
  font-style: normal;
  font-size: var(--site-small);
}
.s-mini-leg {
  grid-column: 2;
  display: flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
}
.s-mini-leg::before {
  content: "";
  width: 2px;
  height: 10px;
  border-radius: 1px;
  flex: none;
  background: var(--financial-positive);
}
.s-mini-leg[data-side="short"]::before {
  background: var(--financial-negative);
}
.s-mini-leg img {
  border-radius: 50%;
  flex: none;
}
.s-mini-leg span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.s-mini-leg b {
  margin-inline-start: auto;
  font-weight: var(--site-w-regular);
  color: var(--site-text-2);
}
.s-mini-bar {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 64px;
  gap: 4px 10px;
  align-items: center;
}
.s-mini-bar span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.s-mini-bar b {
  font-weight: var(--site-w-regular);
  text-align: end;
}
.s-mini-bar svg {
  grid-column: 1 / -1;
  display: block;
  width: 100%;
  height: 3px;
  overflow: visible;
}
.s-mini-bar svg:dir(rtl) {
  transform: scaleX(-1);
}
.s-mini-bar rect {
  fill: var(--financial-positive);
  opacity: 0.85;
}
.s-mini-bar svg[data-sign="neg"] rect {
  fill: var(--financial-negative);
}
.s-mini [data-sign="pos"] {
  color: var(--financial-positive);
}
.s-mini [data-sign="neg"] {
  color: var(--financial-negative);
}
.s-mini-kinds {
  display: flex;
  flex-wrap: wrap;
  align-content: center;
  gap: 8px;
}
.s-mini-kinds span {
  padding: 6px 12px;
  border-radius: 9999px;
  border: 1px solid var(--site-line);
  color: var(--site-text-2);
  font-size: var(--site-small);
}
@media (width < 1024px) {
  .s-feature-cards {
    grid-template-columns: 1fr;
  }
  .s-mini {
    height: auto;
  }
}
.s-steps {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}
.s-card {
  position: relative;
  display: grid;
  gap: 12px;
  align-content: start;
  padding: 32px;
  border: 1px solid var(--site-line);
  border-radius: 16px;
  background: var(--site-panel);
}
@media (width < 768px) {
  .s-steps {
    grid-template-columns: 1fr;
  }
}
.s-hero {
  position: relative;
  isolation: isolate;
}
.s-aurora {
  position: absolute;
  inset: -120px -10% auto -10%;
  height: 620px;
  z-index: -1;
  pointer-events: none;
  overflow: hidden;
  -webkit-mask-image: linear-gradient(to bottom, #000 40%, transparent);
  mask-image: linear-gradient(to bottom, #000 40%, transparent);
}
.s-aurora::before, .s-aurora::after {
  content: "";
  position: absolute;
  width: 60%;
  aspect-ratio: 1;
  border-radius: 50%;
  opacity: 0.5;
}
.s-aurora::before {
  inset-inline-start: 8%;
  top: -30%;
  background: radial-gradient(closest-side, var(--primary), transparent);
  @supports (color: color-mix(in lab, red, red)) {
    background: radial-gradient(closest-side, color-mix(in lch, var(--primary) 26%, transparent), transparent);
  }
  animation: s-drift-a var(--motion-express-ambient-drift) ease-in-out infinite alternate;
}
.s-aurora::after {
  inset-inline-end: 4%;
  top: -46%;
  background: radial-gradient(closest-side, var(--foreground), transparent);
  @supports (color: color-mix(in lab, red, red)) {
    background: radial-gradient(closest-side, color-mix(in srgb, var(--foreground) 7%, transparent), transparent);
  }
  animation: s-drift-b var(--motion-express-ambient-drift-alt) ease-in-out infinite alternate;
}
@keyframes s-drift-a {
  to {
    transform: translate3d(12%, 10%, 0) scale(1.12);
  }
}
@keyframes s-drift-b {
  to {
    transform: translate3d(-14%, 8%, 0) scale(0.92);
  }
}
.s-stage {
  perspective: 1600px;
}
.s-header {
  transition: background-color var(--site-swap), border-color var(--site-swap);
  view-transition-name: site-header;
}
@view-transition {
  navigation: auto;
}
::view-transition-old(root) {
  animation: var(--motion-express-page-out) var(--ease-express-hover) both s-vt-out;
}
::view-transition-new(root) {
  animation: var(--motion-express-page-in) var(--ease-express-enter) both s-vt-in;
}
@keyframes s-vt-out {
  to {
    opacity: 0;
  }
}
@keyframes s-vt-in {
  from {
    opacity: 0;
    transform: translateY(8px);
  }
}
@supports (interpolate-size: allow-keywords) {
  .site {
    interpolate-size: allow-keywords;
  }
  .s-faq details::details-content {
    block-size: 0;
    overflow: clip;
    transition: block-size var(--motion-express-glide) var(--ease-spring), content-visibility var(--motion-express-glide) allow-discrete;
  }
  .s-faq details[open]::details-content {
    block-size: auto;
  }
}
.s-num, .s-board .s-line, .s-board [data-value], .s-plan-price, .s-stats dd {
  direction: ltr;
  unicode-bidi: isolate;
}
:is(:lang(zh), :lang(ja), :lang(ko)) :is(.s-display, .s-h1, .s-h2, .s-manifesto) {
  font-weight: var(--font-weight-medium);
}
:is(:lang(zh), :lang(ja), :lang(ko)) .s-h1 {
  font-size: calc(var(--site-h1) * 0.92);
}
.s-menu-label {
  padding: 12px 10px 4px;
  font-size: var(--site-micro);
  color: var(--site-text-3);
}
.s-menu-langs {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 2px;
}
.s-menu-panel a[aria-current="true"] {
  color: var(--site-text);
  background: var(--control-current);
}
@media (width < 640px) {
  .s-board {
    font-size: var(--site-micro);
  }
  .s-board th, .s-board td {
    padding-inline: 6px;
  }
  .s-board th:first-child, .s-board td:first-child {
    padding-inline-start: 12px;
  }
  .s-board th:last-child, .s-board td:last-child {
    padding-inline-end: 12px;
  }
  .s-board .s-venue .s-line > span {
    max-width: 72px;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .s-app .s-board-scroll {
    min-height: 0;
  }
  .s-matrix {
    min-width: 0;
    font-size: var(--site-micro);
  }
  .s-matrix th, .s-matrix td {
    padding: 10px 8px;
  }
  .s-matrix tbody th {
    width: 40%;
  }
  .s-matrix td[data-v]::before {
    margin-inline-end: 4px;
  }
  .s-stats dd {
    font-size: var(--marketing-stat-narrow);
    white-space: nowrap;
  }
  .s-reading .s-h2 {
    font-size: var(--marketing-reading-heading-narrow);
    line-height: 1.1;
  }
  .s-footer a {
    display: inline-block;
    padding-block: 6px;
  }
  .s-more {
    padding-block: 10px;
  }
}
@media (width >= 1280px) {
  .site {
    --site-gutter: var(--marketing-gutter-max);
  }
}
@media print {
  .s-header, .s-aurora {
    display: none;
  }
  .s-main {
    padding-top: 0;
  }
}
.site [data-ambient-paused]::before, .site [data-ambient-paused]::after, .site [data-ambient-paused] * {
  animation-play-state: paused;
}
@media (prefers-reduced-motion: reduce) {
  .s-aurora::before, .s-aurora::after {
    animation: none;
  }
  .s-fig-flow {
    animation: none;
    stroke-dasharray: none;
    opacity: 0.5;
  }
  .s-fig-accent {
    animation: none;
  }
  .s-marquee {
    overflow-x: auto;
  }
  .s-marquee ul {
    animation: none;
  }
  .s-marquee ul[aria-hidden] {
    display: none;
  }
  ::view-transition-group(*), ::view-transition-old(*), ::view-transition-new(*) {
    animation: none !important;
  }
  .site * {
    scroll-behavior: auto !important;
  }
}
.s-text-strong {
  color: var(--site-text) !important;
}
.s-text-muted {
  color: var(--site-text-3) !important;
}
.s-flush-top {
  margin-top: 0 !important;
}
.s-flush-bottom {
  margin-bottom: 0 !important;
}
.s-mt-16 {
  margin-top: 16px !important;
}
.s-mt-32 {
  margin-top: 32px !important;
}
.s-mt-64 {
  margin-top: 64px !important;
}
.s-mb-40 {
  margin-bottom: 40px !important;
}
.s-mb-48 {
  margin-bottom: 48px !important;
}
.s-mb-96 {
  margin-bottom: 96px !important;
}
.s-gap-8 {
  gap: 8px !important;
}
.s-stack-6 {
  display: grid !important;
  gap: 6px !important;
}
.s-stack-8 {
  display: grid !important;
  gap: 8px !important;
}
.s-stack-24 {
  display: grid !important;
  gap: 24px !important;
}
.s-row-10 {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
}
.s-code-block {
  margin: 0 !important;
  padding: 16px !important;
  border: 1px solid var(--site-line) !important;
  border-radius: 12px !important;
  overflow: auto !important;
  background: var(--site-panel) !important;
  color: var(--site-text-2) !important;
  font-family: var(--font-mono) !important;
}
@property --tw-space-y-reverse {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@property --tw-leading {
  syntax: "*";
  inherits: false;
}
@property --tw-font-weight {
  syntax: "*";
  inherits: false;
}
@property --tw-tracking {
  syntax: "*";
  inherits: false;
}
@property --tw-blur {
  syntax: "*";
  inherits: false;
}
@property --tw-brightness {
  syntax: "*";
  inherits: false;
}
@property --tw-contrast {
  syntax: "*";
  inherits: false;
}
@property --tw-grayscale {
  syntax: "*";
  inherits: false;
}
@property --tw-hue-rotate {
  syntax: "*";
  inherits: false;
}
@property --tw-invert {
  syntax: "*";
  inherits: false;
}
@property --tw-opacity {
  syntax: "*";
  inherits: false;
}
@property --tw-saturate {
  syntax: "*";
  inherits: false;
}
@property --tw-sepia {
  syntax: "*";
  inherits: false;
}
@property --tw-drop-shadow {
  syntax: "*";
  inherits: false;
}
@property --tw-drop-shadow-color {
  syntax: "*";
  inherits: false;
}
@property --tw-drop-shadow-alpha {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}
@property --tw-drop-shadow-size {
  syntax: "*";
  inherits: false;
}
@property --tw-content {
  syntax: "*";
  initial-value: "";
  inherits: false;
}
@property --tw-border-style {
  syntax: "*";
  inherits: false;
  initial-value: solid;
}
@layer properties {
  @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
    :root, :host {
      --zml-data-row-alert-mix: 0%;
    }
    *, ::before, ::after, ::backdrop {
      --tw-space-y-reverse: 0;
      --tw-leading: initial;
      --tw-font-weight: initial;
      --tw-tracking: initial;
      --tw-blur: initial;
      --tw-brightness: initial;
      --tw-contrast: initial;
      --tw-grayscale: initial;
      --tw-hue-rotate: initial;
      --tw-invert: initial;
      --tw-opacity: initial;
      --tw-saturate: initial;
      --tw-sepia: initial;
      --tw-drop-shadow: initial;
      --tw-drop-shadow-color: initial;
      --tw-drop-shadow-alpha: 100%;
      --tw-drop-shadow-size: initial;
      --tw-content: "";
      --tw-border-style: solid;
    }
  }
}


/* /@fs//Users/zhoupengpeng/Code/zml/node_modules/.pnpm/tailwindcss@4.3.3/node_modules/tailwindcss/index.css */
/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */
@layer properties;
@layer theme, base, components, utilities;
@layer theme {
  :root, :host {
    --font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue",
      "Noto Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji",
      "Segoe UI Symbol", "Noto Color Emoji";
    --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono",
      "Courier New", monospace;
    --color-emerald-400: oklch(76.5% 0.177 163.223);
    --color-emerald-500: oklch(69.6% 0.17 162.48);
    --spacing: 0.25rem;
    --container-xs: 20rem;
    --container-sm: 24rem;
    --container-md: 28rem;
    --container-lg: 32rem;
    --container-xl: 36rem;
    --text-base: 1rem;
    --text-base--line-height: calc(1.5 / 1);
    --text-3xl: 1.875rem;
    --text-3xl--line-height: calc(2.25 / 1.875);
    --font-weight-normal: 400;
    --font-weight-medium: 500;
    --font-weight-semibold: 600;
    --tracking-tight: -0.025em;
    --tracking-wide: 0.025em;
    --leading-normal: 1.5;
    --radius-sm: 0.25rem;
    --radius-md: 0.375rem;
    --radius-lg: 0.5rem;
    --ease-out: cubic-bezier(0, 0, 0.2, 1);
    --animate-spin: spin 1s linear infinite;
    --default-transition-duration: 150ms;
    --default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    --default-font-family: var(--font-sans);
    --default-mono-font-family: var(--font-mono);
  }
}
@layer base {
  *, ::after, ::before, ::backdrop, ::file-selector-button {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    border: 0 solid;
  }
  html, :host {
    line-height: 1.5;
    -webkit-text-size-adjust: 100%;
    tab-size: 4;
    font-family: var(--default-font-family, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");
    font-feature-settings: var(--default-font-feature-settings, normal);
    font-variation-settings: var(--default-font-variation-settings, normal);
    -webkit-tap-highlight-color: transparent;
  }
  hr {
    height: 0;
    color: inherit;
    border-top-width: 1px;
  }
  abbr:where([title]) {
    -webkit-text-decoration: underline dotted;
    text-decoration: underline dotted;
  }
  h1, h2, h3, h4, h5, h6 {
    font-size: inherit;
    font-weight: inherit;
  }
  a {
    color: inherit;
    -webkit-text-decoration: inherit;
    text-decoration: inherit;
  }
  b, strong {
    font-weight: bolder;
  }
  code, kbd, samp, pre {
    font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);
    font-feature-settings: var(--default-mono-font-feature-settings, normal);
    font-variation-settings: var(--default-mono-font-variation-settings, normal);
    font-size: 1em;
  }
  small {
    font-size: 80%;
  }
  sub, sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
  }
  sub {
    bottom: -0.25em;
  }
  sup {
    top: -0.5em;
  }
  table {
    text-indent: 0;
    border-color: inherit;
    border-collapse: collapse;
  }
  :-moz-focusring:where(:not(iframe)) {
    outline: auto;
  }
  progress {
    vertical-align: baseline;
  }
  summary {
    display: list-item;
  }
  ol, ul, menu {
    list-style: none;
  }
  img, svg, video, canvas, audio, iframe, embed, object {
    display: block;
    vertical-align: middle;
  }
  img, video {
    max-width: 100%;
    height: auto;
  }
  button, input, select, optgroup, textarea, ::file-selector-button {
    font: inherit;
    font-feature-settings: inherit;
    font-variation-settings: inherit;
    letter-spacing: inherit;
    color: inherit;
    border-radius: 0;
    background-color: transparent;
    opacity: 1;
  }
  :where(select:is([multiple], [size])) optgroup {
    font-weight: bolder;
  }
  :where(select:is([multiple], [size])) optgroup option {
    padding-inline-start: 20px;
  }
  ::file-selector-button {
    margin-inline-end: 4px;
  }
  ::placeholder {
    opacity: 1;
  }
  @supports (not (-webkit-appearance: -apple-pay-button))  or (contain-intrinsic-size: 1px) {
    ::placeholder {
      color: currentcolor;
      @supports (color: color-mix(in lab, red, red)) {
        color: color-mix(in oklab, currentcolor 50%, transparent);
      }
    }
  }
  textarea {
    resize: vertical;
  }
  ::-webkit-search-decoration {
    -webkit-appearance: none;
  }
  ::-webkit-date-and-time-value {
    min-height: 1lh;
    text-align: inherit;
  }
  ::-webkit-datetime-edit {
    display: inline-flex;
  }
  ::-webkit-datetime-edit-fields-wrapper {
    padding: 0;
  }
  ::-webkit-datetime-edit, ::-webkit-datetime-edit-year-field, ::-webkit-datetime-edit-month-field, ::-webkit-datetime-edit-day-field, ::-webkit-datetime-edit-hour-field, ::-webkit-datetime-edit-minute-field, ::-webkit-datetime-edit-second-field, ::-webkit-datetime-edit-millisecond-field, ::-webkit-datetime-edit-meridiem-field {
    padding-block: 0;
  }
  ::-webkit-calendar-picker-indicator {
    line-height: 1;
  }
  :-moz-ui-invalid {
    box-shadow: none;
  }
  button, input:where([type="button"], [type="reset"], [type="submit"]), ::file-selector-button {
    appearance: button;
  }
  ::-webkit-inner-spin-button, ::-webkit-outer-spin-button {
    height: auto;
  }
  [hidden]:where(:not([hidden="until-found"])) {
    display: none !important;
  }
}
@layer utilities {
  .\@container\/alert-settings {
    container-type: inline-size;
    container-name: alert-settings;
  }
  .\@container\/alert-templates {
    container-type: inline-size;
    container-name: alert-templates;
  }
  .\@container\/detail {
    container-type: inline-size;
    container-name: detail;
  }
  .\@container\/dialog-frame {
    container-type: inline-size;
    container-name: dialog-frame;
  }
  .\@container\/field-group {
    container-type: inline-size;
    container-name: field-group;
  }
  .\@container\/filter-body {
    container-type: inline-size;
    container-name: filter-body;
  }
  .\@container\/ledger {
    container-type: inline-size;
    container-name: ledger;
  }
  .\@container\/ledger-axis {
    container-type: inline-size;
    container-name: ledger-axis;
  }
  .\@container\/location-bar {
    container-type: inline-size;
    container-name: location-bar;
  }
  .\@container\/management {
    container-type: inline-size;
    container-name: management;
  }
  .\@container\/overlay-frame {
    container-type: inline-size;
    container-name: overlay-frame;
  }
  .\@container\/overview {
    container-type: inline-size;
    container-name: overview;
  }
  .\@container\/settings-body {
    container-type: inline-size;
    container-name: settings-body;
  }
  .\@container\/settings-field {
    container-type: inline-size;
    container-name: settings-field;
  }
  .\@container\/summary {
    container-type: inline-size;
    container-name: summary;
  }
  .\@container\/table {
    container-type: inline-size;
    container-name: table;
  }
  .\@container\/trade-settings {
    container-type: inline-size;
    container-name: trade-settings;
  }
  .\@container\/view-rail {
    container-type: inline-size;
    container-name: view-rail;
  }
  .\@container {
    container-type: inline-size;
  }
  .pointer-events-auto {
    pointer-events: auto;
  }
  .pointer-events-none {
    pointer-events: none;
  }
  .\!visible {
    visibility: visible !important;
  }
  .collapse {
    visibility: collapse;
  }
  .invisible {
    visibility: hidden;
  }
  .visible {
    visibility: visible;
  }
  .sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
    border-width: 0;
  }
  .absolute {
    position: absolute;
  }
  .fixed {
    position: fixed;
  }
  .relative {
    position: relative;
  }
  .static {
    position: static;
  }
  .sticky {
    position: sticky;
  }
  .inset-0 {
    inset: 0px;
  }
  .inset-x-0 {
    inset-inline: 0px;
  }
  .inset-x-\[var\(--space-inline-standard\)\] {
    inset-inline: var(--space-inline-standard);
  }
  .inset-y-0 {
    inset-block: 0px;
  }
  .start-0 {
    inset-inline-start: calc(var(--spacing) * 0);
  }
  .start-1 {
    inset-inline-start: calc(var(--spacing) * 1);
  }
  .start-1\/2 {
    inset-inline-start: calc(1/2 * 100%);
  }
  .start-2\.5 {
    inset-inline-start: calc(var(--spacing) * 2.5);
  }
  .end-0 {
    inset-inline-end: calc(var(--spacing) * 0);
  }
  .end-1 {
    inset-inline-end: calc(var(--spacing) * 1);
  }
  .end-1\.5 {
    inset-inline-end: calc(var(--spacing) * 1.5);
  }
  .end-1\/2 {
    inset-inline-end: calc(1/2 * 100%);
  }
  .end-\[2px\] {
    inset-inline-end: 2px;
  }
  .end-\[7px\] {
    inset-inline-end: 7px;
  }
  .end-\[calc\(var\(--space-section-compact\)\+env\(safe-area-inset-right\,0px\)\)\] {
    inset-inline-end: calc(var(--space-section-compact) + env(safe-area-inset-right,0px));
  }
  .end-\[var\(--space-inline-wide\)\] {
    inset-inline-end: var(--space-inline-wide);
  }
  .top-0 {
    top: 0px;
  }
  .top-1 {
    top: var(--spacing);
  }
  .top-1\/2 {
    top: calc(1 / 2 * 100%);
  }
  .top-\[-0\.5px\] {
    top: -0.5px;
  }
  .top-\[calc\(var\(--feedback-viewport-top-inset\)\+var\(--safe-area-top\)\+1rem\)\] {
    top: calc(var(--feedback-viewport-top-inset) + var(--safe-area-top) + 1rem);
  }
  .top-\[calc\(var\(--feedback-viewport-top-inset\)\+var\(--safe-area-top\)\+1rem\+var\(--feedback-top-clearance\)\)\] {
    top: calc(var(--feedback-viewport-top-inset) + var(--safe-area-top) + 1rem + var(--feedback-top-clearance));
  }
  .top-\[calc\(var\(--space-section-compact\)\+env\(safe-area-inset-top\,0px\)\)\] {
    top: calc(var(--space-section-compact) + env(safe-area-inset-top,0px));
  }
  .top-\[calc\(身份行高\+安全区\)\] {
    top: calc(身份行高+安全区);
  }
  .top-\[var\(--space-inline-wide\)\] {
    top: var(--space-inline-wide);
  }
  .top-\[var\(--zml-table-header\)\] {
    top: var(--zml-table-header);
  }
  .\[right\:calc\(100\%_-_var\(--switch-pad\)_-_var\(--switch-thumb-size\)\)\] {
    right: calc(100% - var(--switch-pad) - var(--switch-thumb-size));
  }
  .right-0 {
    right: 0px;
  }
  .right-\[calc\(1rem\+var\(--safe-area-right\)\)\] {
    right: calc(1rem + var(--safe-area-right));
  }
  .bottom-0 {
    bottom: 0px;
  }
  .bottom-1 {
    bottom: var(--spacing);
  }
  .bottom-\[calc\(1rem\+var\(--safe-area-bottom\)\)\] {
    bottom: calc(1rem + var(--safe-area-bottom));
  }
  .bottom-\[calc\(1rem\+var\(--safe-area-bottom\)\+var\(--feedback-bottom-clearance\)\)\] {
    bottom: calc(1rem + var(--safe-area-bottom) + var(--feedback-bottom-clearance));
  }
  .bottom-\[calc\(var\(--space-section-compact\)\+env\(safe-area-inset-bottom\,0px\)\)\] {
    bottom: calc(var(--space-section-compact) + env(safe-area-inset-bottom,0px));
  }
  .bottom-\[var\(--space-stack-standard\)\] {
    bottom: var(--space-stack-standard);
  }
  .bottom-full {
    bottom: 100%;
  }
  .\[left\:var\(--switch-pad\)\] {
    left: var(--switch-pad);
  }
  .left-0 {
    left: 0px;
  }
  .left-1\/2 {
    left: calc(1 / 2 * 100%);
  }
  .left-\[calc\(1rem\+var\(--safe-area-left\)\)\] {
    left: calc(1rem + var(--safe-area-left));
  }
  .isolate {
    isolation: isolate;
  }
  .z-10 {
    z-index: 10;
  }
  .z-\[1\] {
    z-index: 1;
  }
  .z-\[calc\(var\(--z-toast\)-var\(--toast-index\)\)\] {
    z-index: calc(var(--z-toast) - var(--toast-index));
  }
  .z-\[var\(--z-base\)\] {
    z-index: var(--z-base);
  }
  .z-\[var\(--z-floating\)\] {
    z-index: var(--z-floating);
  }
  .z-\[var\(--z-navigation\)\] {
    z-index: var(--z-navigation);
  }
  .z-\[var\(--z-overlay\)\] {
    z-index: var(--z-overlay);
  }
  .z-\[var\(--z-raised\)\] {
    z-index: var(--z-raised);
  }
  .z-\[var\(--z-sticky\)\] {
    z-index: var(--z-sticky);
  }
  .z-\[var\(--z-toast\)\] {
    z-index: var(--z-toast);
  }
  .z-\[var\(--z-workbench-controls\)\] {
    z-index: var(--z-workbench-controls);
  }
  .z-\[var\(--zml-monitor-controls\)\] {
    z-index: var(--zml-monitor-controls);
  }
  .col-span-2 {
    grid-column: span 2 / span 2;
  }
  .col-span-3 {
    grid-column: span 3 / span 3;
  }
  .col-span-full {
    grid-column: 1 / -1;
  }
  .col-start-1 {
    grid-column-start: 1;
  }
  .col-start-2 {
    grid-column-start: 2;
  }
  .col-start-3 {
    grid-column-start: 3;
  }
  .row-0 {
    grid-row: 0;
  }
  .row-1 {
    grid-row: 1;
  }
  .row-2 {
    grid-row: 2;
  }
  .row-10 {
    grid-row: 10;
  }
  .row-11 {
    grid-row: 11;
  }
  .row-12 {
    grid-row: 12;
  }
  .row-15 {
    grid-row: 15;
  }
  .row-span-2 {
    grid-row: span 2 / span 2;
  }
  .row-start-1 {
    grid-row-start: 1;
  }
  .row-start-2 {
    grid-row-start: 2;
  }
  .container {
    width: 100%;
    @media (width >= 40rem) {
      max-width: 40rem;
    }
    @media (width >= 48rem) {
      max-width: 48rem;
    }
    @media (width >= 64rem) {
      max-width: 64rem;
    }
    @media (width >= 80rem) {
      max-width: 80rem;
    }
    @media (width >= 96rem) {
      max-width: 96rem;
    }
  }
  .m-0 {
    margin: 0px;
  }
  .m-4 {
    margin: calc(var(--spacing) * 4);
  }
  .m-\[var\(--space-section-standard\)\] {
    margin: var(--space-section-standard);
  }
  .-mx-1 {
    margin-inline: calc(var(--spacing) * -1);
  }
  .-mx-4 {
    margin-inline: calc(var(--spacing) * -4);
  }
  .mx-0 {
    margin-inline: 0px;
  }
  .mx-1 {
    margin-inline: var(--spacing);
  }
  .mx-2 {
    margin-inline: calc(var(--spacing) * 2);
  }
  .mx-3 {
    margin-inline: calc(var(--spacing) * 3);
  }
  .mx-4 {
    margin-inline: calc(var(--spacing) * 4);
  }
  .mx-\[-1px\] {
    margin-inline: -1px;
  }
  .mx-\[-14px\] {
    margin-inline: -14px;
  }
  .mx-\[var\(--space-inline-standard\)\] {
    margin-inline: var(--space-inline-standard);
  }
  .mx-\[var\(--space-section-compact\)\] {
    margin-inline: var(--space-section-compact);
  }
  .mx-\[var\(--space-section-standard\)\] {
    margin-inline: var(--space-section-standard);
  }
  .mx-auto {
    margin-inline: auto;
  }
  .-my-1 {
    margin-block: calc(var(--spacing) * -1);
  }
  .my-0\.5 {
    margin-block: calc(var(--spacing) * 0.5);
  }
  .my-1\.5 {
    margin-block: calc(var(--spacing) * 1.5);
  }
  .my-2 {
    margin-block: calc(var(--spacing) * 2);
  }
  .my-3 {
    margin-block: calc(var(--spacing) * 3);
  }
  .-ms-1 {
    margin-inline-start: calc(var(--spacing) * -1);
  }
  .-ms-1\.5 {
    margin-inline-start: calc(var(--spacing) * -1.5);
  }
  .-ms-2 {
    margin-inline-start: calc(var(--spacing) * -2);
  }
  .-ms-\[var\(--space-inline-standard\)\] {
    margin-inline-start: calc(var(--space-inline-standard) * -1);
  }
  .ms-0 {
    margin-inline-start: 0px;
  }
  .ms-1 {
    margin-inline-start: var(--spacing);
  }
  .ms-1\.5 {
    margin-inline-start: calc(var(--spacing) * 1.5);
  }
  .ms-\[calc\(var\(--control-standard\)\+var\(--space-inline-compact\)\)\] {
    margin-inline-start: calc(var(--control-standard) + var(--space-inline-compact));
  }
  .ms-\[var\(--space-inline-compact\)\] {
    margin-inline-start: var(--space-inline-compact);
  }
  .ms-\[var\(--space-inline-standard\)\] {
    margin-inline-start: var(--space-inline-standard);
  }
  .ms-auto {
    margin-inline-start: auto;
  }
  .-me-1 {
    margin-inline-end: calc(var(--spacing) * -1);
  }
  .-me-1\.5 {
    margin-inline-end: calc(var(--spacing) * -1.5);
  }
  .me-0\.5 {
    margin-inline-end: calc(var(--spacing) * 0.5);
  }
  .me-1 {
    margin-inline-end: var(--spacing);
  }
  .me-1\.5 {
    margin-inline-end: calc(var(--spacing) * 1.5);
  }
  .me-\[1\.5px\] {
    margin-inline-end: 1.5px;
  }
  .me-\[calc\(var\(--control-standard\)\+var\(--space-inline-compact\)\)\] {
    margin-inline-end: calc(var(--control-standard) + var(--space-inline-compact));
  }
  .me-\[var\(--space-inline-compact\)\] {
    margin-inline-end: var(--space-inline-compact);
  }
  .me-auto {
    margin-inline-end: auto;
  }
  .me-px {
    margin-inline-end: 1px;
  }
  .-mt-0\.5 {
    margin-top: calc(var(--spacing) * -0.5);
  }
  .-mt-1 {
    margin-top: calc(var(--spacing) * -1);
  }
  .-mt-1\.5 {
    margin-top: calc(var(--spacing) * -1.5);
  }
  .mt-0 {
    margin-top: 0px;
  }
  .mt-0\.5 {
    margin-top: calc(var(--spacing) * 0.5);
  }
  .mt-1 {
    margin-top: var(--spacing);
  }
  .mt-1\.5 {
    margin-top: calc(var(--spacing) * 1.5);
  }
  .mt-2 {
    margin-top: calc(var(--spacing) * 2);
  }
  .mt-3 {
    margin-top: calc(var(--spacing) * 3);
  }
  .mt-\[0\.55em\] {
    margin-top: 0.55em;
  }
  .mt-\[var\(--space-stack-compact\)\] {
    margin-top: var(--space-stack-compact);
  }
  .mt-auto {
    margin-top: auto;
  }
  .-mr-1 {
    margin-right: calc(var(--spacing) * -1);
  }
  .mr-\[calc\(0\.5rem\+var\(--safe-area-right\)\)\] {
    margin-right: calc(0.5rem + var(--safe-area-right));
  }
  .-mb-4 {
    margin-bottom: calc(var(--spacing) * -4);
  }
  .-mb-\[var\(--space-section-compact\)\] {
    margin-bottom: calc(var(--space-section-compact) * -1);
  }
  .mb-0 {
    margin-bottom: 0px;
  }
  .mb-0\.5 {
    margin-bottom: calc(var(--spacing) * 0.5);
  }
  .mb-1 {
    margin-bottom: var(--spacing);
  }
  .mb-1\.5 {
    margin-bottom: calc(var(--spacing) * 1.5);
  }
  .mb-2 {
    margin-bottom: calc(var(--spacing) * 2);
  }
  .mb-3 {
    margin-bottom: calc(var(--spacing) * 3);
  }
  .mb-6 {
    margin-bottom: calc(var(--spacing) * 6);
  }
  .mb-8 {
    margin-bottom: calc(var(--spacing) * 8);
  }
  .mb-\[-1px\] {
    margin-bottom: -1px;
  }
  .mb-\[20px\] {
    margin-bottom: 20px;
  }
  .mb-\[var\(--space-inline-wide\)\] {
    margin-bottom: var(--space-inline-wide);
  }
  .mb-\[var\(--space-section-standard\)\] {
    margin-bottom: var(--space-section-standard);
  }
  .mb-\[var\(--space-stack-standard\)\] {
    margin-bottom: var(--space-stack-standard);
  }
  .ml-\[calc\(0\.5rem\+var\(--safe-area-left\)\)\] {
    margin-left: calc(0.5rem + var(--safe-area-left));
  }
  .box-border {
    box-sizing: border-box;
  }
  .box-content {
    box-sizing: content-box;
  }
  .line-clamp-2 {
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
  }
  .\[display\:var\(--field-message-slot\,none\)\] {
    display: var(--field-message-slot,none);
  }
  .block {
    display: block;
  }
  .contents {
    display: contents;
  }
  .flex {
    display: flex;
  }
  .grid {
    display: grid;
  }
  .hidden {
    display: none;
  }
  .inline {
    display: inline;
  }
  .inline-block {
    display: inline-block;
  }
  .inline-flex {
    display: inline-flex;
  }
  .inline-grid {
    display: inline-grid;
  }
  .table {
    display: table;
  }
  .table-cell {
    display: table-cell;
  }
  .table-row {
    display: table-row;
  }
  .field-sizing-content {
    field-sizing: content;
  }
  .aspect-square {
    aspect-ratio: 1 / 1;
  }
  .size-1 {
    width: var(--spacing);
    height: var(--spacing);
  }
  .size-1\.5 {
    width: calc(var(--spacing) * 1.5);
    height: calc(var(--spacing) * 1.5);
  }
  .size-2 {
    width: calc(var(--spacing) * 2);
    height: calc(var(--spacing) * 2);
  }
  .size-3 {
    width: calc(var(--spacing) * 3);
    height: calc(var(--spacing) * 3);
  }
  .size-3\.5 {
    width: calc(var(--spacing) * 3.5);
    height: calc(var(--spacing) * 3.5);
  }
  .size-4 {
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
  }
  .size-5 {
    width: calc(var(--spacing) * 5);
    height: calc(var(--spacing) * 5);
  }
  .size-6 {
    width: calc(var(--spacing) * 6);
    height: calc(var(--spacing) * 6);
  }
  .size-8 {
    width: calc(var(--spacing) * 8);
    height: calc(var(--spacing) * 8);
  }
  .size-9 {
    width: calc(var(--spacing) * 9);
    height: calc(var(--spacing) * 9);
  }
  .size-\[9px\] {
    width: 9px;
    height: 9px;
  }
  .size-\[14px\] {
    width: 14px;
    height: 14px;
  }
  .size-\[length\:var\(--icon-toolbar\)\] {
    width: var(--icon-toolbar);
    height: var(--icon-toolbar);
  }
  .size-\[var\(--checkbox-indicator-size\)\] {
    width: var(--checkbox-indicator-size);
    height: var(--checkbox-indicator-size);
  }
  .size-\[var\(--checkbox-size\)\] {
    width: var(--checkbox-size);
    height: var(--checkbox-size);
  }
  .size-\[var\(--space-inline-standard\)\] {
    width: var(--space-inline-standard);
    height: var(--space-inline-standard);
  }
  .size-\[var\(--unread-marker-size\)\] {
    width: var(--unread-marker-size);
    height: var(--unread-marker-size);
  }
  .size-full {
    width: 100%;
    height: 100%;
  }
  .h-0 {
    height: 0px;
  }
  .h-0\.5 {
    height: calc(var(--spacing) * 0.5);
  }
  .h-1 {
    height: var(--spacing);
  }
  .h-1\.5 {
    height: calc(var(--spacing) * 1.5);
  }
  .h-1\/2 {
    height: calc(1 / 2 * 100%);
  }
  .h-2 {
    height: calc(var(--spacing) * 2);
  }
  .h-2\.5 {
    height: calc(var(--spacing) * 2.5);
  }
  .h-3 {
    height: calc(var(--spacing) * 3);
  }
  .h-3\.5 {
    height: calc(var(--spacing) * 3.5);
  }
  .h-4 {
    height: calc(var(--spacing) * 4);
  }
  .h-5 {
    height: calc(var(--spacing) * 5);
  }
  .h-6 {
    height: calc(var(--spacing) * 6);
  }
  .h-7 {
    height: calc(var(--spacing) * 7);
  }
  .h-8 {
    height: calc(var(--spacing) * 8);
  }
  .h-9 {
    height: calc(var(--spacing) * 9);
  }
  .h-10 {
    height: calc(var(--spacing) * 10);
  }
  .h-11 {
    height: calc(var(--spacing) * 11);
  }
  .h-16 {
    height: calc(var(--spacing) * 16);
  }
  .h-20 {
    height: calc(var(--spacing) * 20);
  }
  .h-36 {
    height: calc(var(--spacing) * 36);
  }
  .h-40 {
    height: calc(var(--spacing) * 40);
  }
  .h-52 {
    height: calc(var(--spacing) * 52);
  }
  .h-\[0\.5px\] {
    height: 0.5px;
  }
  .h-\[1lh\] {
    height: 1lh;
  }
  .h-\[3px\] {
    height: 3px;
  }
  .h-\[5px\] {
    height: 5px;
  }
  .h-\[13rem\] {
    height: 13rem;
  }
  .h-\[15px\] {
    height: 15px;
  }
  .h-\[18px\] {
    height: 18px;
  }
  .h-\[25px\] {
    height: 25px;
  }
  .h-\[100dvh\] {
    height: 100dvh;
  }
  .h-\[420px\] {
    height: 420px;
  }
  .h-\[480px\] {
    height: 480px;
  }
  .h-\[500px\] {
    height: 500px;
  }
  .h-\[540px\] {
    height: 540px;
  }
  .h-\[560px\] {
    height: 560px;
  }
  .h-\[calc\(100\%-var\(--control-room-nav-height\)-var\(--safe-area-top\)\)\] {
    height: calc(100% - var(--control-room-nav-height) - var(--safe-area-top));
  }
  .h-\[calc\(100dvh-2\*var\(--space-section-compact\)\)\] {
    height: calc(100dvh - 2 * var(--space-section-compact));
  }
  .h-\[calc\(100dvh-var\(--feedback-viewport-top-inset\)-var\(--safe-area-top\)-var\(--safe-area-bottom\)-2rem\)\] {
    height: calc(100dvh - var(--feedback-viewport-top-inset) - var(--safe-area-top) - var(--safe-area-bottom) - 2rem);
  }
  .h-\[calc\(100dvh-var\(--feedback-viewport-top-inset\)-var\(--safe-area-top\)-var\(--safe-area-bottom\)-2rem-var\(--feedback-top-clearance\)-var\(--feedback-bottom-clearance\)\)\] {
    height: calc(100dvh - var(--feedback-viewport-top-inset) - var(--safe-area-top) - var(--safe-area-bottom) - 2rem - var(--feedback-top-clearance) - var(--feedback-bottom-clearance));
  }
  .h-\[calc\(var\(--control-room-nav-height\)\+var\(--safe-area-top\)\)\] {
    height: calc(var(--control-room-nav-height) + var(--safe-area-top));
  }
  .h-\[calc\(var\(--shell-bar-height\)\+0\.5px\)\] {
    height: calc(var(--shell-bar-height) + 0.5px);
  }
  .h-\[var\(--auth-reveal-size\)\] {
    height: var(--auth-reveal-size);
  }
  .h-\[var\(--chart-overview-height\)\] {
    height: var(--chart-overview-height);
  }
  .h-\[var\(--chart-plot-height\)\] {
    height: var(--chart-plot-height);
  }
  .h-\[var\(--control-auth\)\] {
    height: var(--control-auth);
  }
  .h-\[var\(--control-compact\)\] {
    height: var(--control-compact);
  }
  .h-\[var\(--control-form\)\] {
    height: var(--control-form);
  }
  .h-\[var\(--control-height-chrome\)\] {
    height: var(--control-height-chrome);
  }
  .h-\[var\(--control-standard\)\] {
    height: var(--control-standard);
  }
  .h-\[var\(--details-available-height\)\] {
    height: var(--details-available-height);
  }
  .h-\[var\(--filter-search-height\)\] {
    height: var(--filter-search-height);
  }
  .h-\[var\(--mini-trend-height\)\] {
    height: var(--mini-trend-height);
  }
  .h-\[var\(--row-inbox\)\] {
    height: var(--row-inbox);
  }
  .h-\[var\(--row-single\)\] {
    height: var(--row-single);
  }
  .h-\[var\(--select-trigger\)\] {
    height: var(--select-trigger);
  }
  .h-\[var\(--select-trigger-compact\)\] {
    height: var(--select-trigger-compact);
  }
  .h-\[var\(--settings-window-height\)\] {
    height: var(--settings-window-height);
  }
  .h-\[var\(--shell-bar-height\)\] {
    height: var(--shell-bar-height);
  }
  .h-\[var\(--space-inline-wide\)\] {
    height: var(--space-inline-wide);
  }
  .h-\[var\(--space-section-standard\)\] {
    height: var(--space-section-standard);
  }
  .h-\[var\(--switch-thumb-size\)\] {
    height: var(--switch-thumb-size);
  }
  .h-\[var\(--switch-track-h\)\] {
    height: var(--switch-track-h);
  }
  .h-\[var\(--table-header\)\] {
    height: var(--table-header);
  }
  .h-\[var\(--type-control-line\)\] {
    height: var(--type-control-line);
  }
  .h-\[var\(--type-workbench-primary-line\)\] {
    height: var(--type-workbench-primary-line);
  }
  .h-\[var\(--type-workbench-secondary-line\)\] {
    height: var(--type-workbench-secondary-line);
  }
  .h-\[var\(--window-header-height\)\] {
    height: var(--window-header-height);
  }
  .h-\[var\(--zml-row-height\)\] {
    height: var(--zml-row-height);
  }
  .h-\[var\(--zml-row-height\,var\(--row-single\)\)\] {
    height: var(--zml-row-height,var(--row-single));
  }
  .h-\[var\(--zml-table-header\)\] {
    height: var(--zml-table-header);
  }
  .h-auto {
    height: auto;
  }
  .h-dvh {
    height: 100dvh;
  }
  .h-full {
    height: 100%;
  }
  .h-px {
    height: 1px;
  }
  .max-h-24 {
    max-height: calc(var(--spacing) * 24);
  }
  .max-h-40 {
    max-height: calc(var(--spacing) * 40);
  }
  .max-h-52 {
    max-height: calc(var(--spacing) * 52);
  }
  .max-h-\[50\%\] {
    max-height: 50%;
  }
  .max-h-\[calc\(100\%-2\*var\(--space-inline-compact\)\)\] {
    max-height: calc(100% - 2 * var(--space-inline-compact));
  }
  .max-h-\[calc\(100dvh-2\*var\(--space-section-compact\)\)\] {
    max-height: calc(100dvh - 2 * var(--space-section-compact));
  }
  .max-h-\[min\(32rem\,calc\(100dvh-2\*var\(--overlay-gutter\)\)\)\] {
    max-height: min(32rem, calc(100dvh - 2 * var(--overlay-gutter)));
  }
  .max-h-\[min\(var\(--available-height\)\,calc\(100dvh-2\*var\(--overlay-gutter\)\)\)\] {
    max-height: min(var(--available-height), calc(100dvh - 2 * var(--overlay-gutter)));
  }
  .max-h-\[var\(--chart-data-max-height\)\] {
    max-height: var(--chart-data-max-height);
  }
  .max-h-full {
    max-height: 100%;
  }
  .min-h-0 {
    min-height: 0px;
  }
  .min-h-8 {
    min-height: calc(var(--spacing) * 8);
  }
  .min-h-9 {
    min-height: calc(var(--spacing) * 9);
  }
  .min-h-14 {
    min-height: calc(var(--spacing) * 14);
  }
  .min-h-20 {
    min-height: calc(var(--spacing) * 20);
  }
  .min-h-28 {
    min-height: calc(var(--spacing) * 28);
  }
  .min-h-32 {
    min-height: calc(var(--spacing) * 32);
  }
  .min-h-40 {
    min-height: calc(var(--spacing) * 40);
  }
  .min-h-44 {
    min-height: calc(var(--spacing) * 44);
  }
  .min-h-48 {
    min-height: calc(var(--spacing) * 48);
  }
  .min-h-50 {
    min-height: calc(var(--spacing) * 50);
  }
  .min-h-55 {
    min-height: calc(var(--spacing) * 55);
  }
  .min-h-64 {
    min-height: calc(var(--spacing) * 64);
  }
  .min-h-80 {
    min-height: calc(var(--spacing) * 80);
  }
  .min-h-\[1lh\] {
    min-height: 1lh;
  }
  .min-h-\[11\.25rem\] {
    min-height: 11.25rem;
  }
  .min-h-\[45px\] {
    min-height: 45px;
  }
  .min-h-\[220px\] {
    min-height: 220px;
  }
  .min-h-\[calc\(100dvh-var\(--control-room-nav-height\)-var\(--safe-area-top\)\)\] {
    min-height: calc(100dvh - var(--control-room-nav-height) - var(--safe-area-top));
  }
  .min-h-\[min\(35rem\,calc\(100dvh-2\*var\(--space-section-compact\)\)\)\] {
    min-height: min(35rem, calc(100dvh - 2 * var(--space-section-compact)));
  }
  .min-h-\[var\(--calendar-day-height\)\] {
    min-height: var(--calendar-day-height);
  }
  .min-h-\[var\(--chart-plot-height\)\] {
    min-height: var(--chart-plot-height);
  }
  .min-h-\[var\(--chart-plot-min-height\)\] {
    min-height: var(--chart-plot-min-height);
  }
  .min-h-\[var\(--control-auth\)\] {
    min-height: var(--control-auth);
  }
  .min-h-\[var\(--control-compact\)\] {
    min-height: var(--control-compact);
  }
  .min-h-\[var\(--control-form\)\] {
    min-height: var(--control-form);
  }
  .min-h-\[var\(--control-standard\)\] {
    min-height: var(--control-standard);
  }
  .min-h-\[var\(--menu-item\)\] {
    min-height: var(--menu-item);
  }
  .min-h-\[var\(--row-compact-dual\)\] {
    min-height: var(--row-compact-dual);
  }
  .min-h-\[var\(--row-compact-single\)\] {
    min-height: var(--row-compact-single);
  }
  .min-h-\[var\(--row-dense-dual\)\] {
    min-height: var(--row-dense-dual);
  }
  .min-h-\[var\(--row-dense-single\)\] {
    min-height: var(--row-dense-single);
  }
  .min-h-\[var\(--row-single\)\] {
    min-height: var(--row-single);
  }
  .min-h-\[var\(--settings-fact-row\)\] {
    min-height: var(--settings-fact-row);
  }
  .min-h-\[var\(--settings-row\)\] {
    min-height: var(--settings-row);
  }
  .min-h-\[var\(--shell-bar-height\)\] {
    min-height: var(--shell-bar-height);
  }
  .min-h-\[var\(--switch-track-h\)\] {
    min-height: var(--switch-track-h);
  }
  .min-h-\[var\(--table-header-compact\)\] {
    min-height: var(--table-header-compact);
  }
  .min-h-\[var\(--table-header-dense\)\] {
    min-height: var(--table-header-dense);
  }
  .min-h-\[var\(--type-auth-body-line\)\] {
    min-height: var(--type-auth-body-line);
  }
  .min-h-\[var\(--type-workbench-secondary-line\)\] {
    min-height: var(--type-workbench-secondary-line);
  }
  .min-h-dvh {
    min-height: 100dvh;
  }
  .min-h-full {
    min-height: 100%;
  }
  .w-0 {
    width: 0px;
  }
  .w-0\.5 {
    width: calc(var(--spacing) * 0.5);
  }
  .w-1 {
    width: var(--spacing);
  }
  .w-1\.5 {
    width: calc(var(--spacing) * 1.5);
  }
  .w-2 {
    width: calc(var(--spacing) * 2);
  }
  .w-2\.5 {
    width: calc(var(--spacing) * 2.5);
  }
  .w-3\.5 {
    width: calc(var(--spacing) * 3.5);
  }
  .w-4 {
    width: calc(var(--spacing) * 4);
  }
  .w-4\/5 {
    width: calc(4 / 5 * 100%);
  }
  .w-6 {
    width: calc(var(--spacing) * 6);
  }
  .w-7 {
    width: calc(var(--spacing) * 7);
  }
  .w-10 {
    width: calc(var(--spacing) * 10);
  }
  .w-12 {
    width: calc(var(--spacing) * 12);
  }
  .w-14 {
    width: calc(var(--spacing) * 14);
  }
  .w-16 {
    width: calc(var(--spacing) * 16);
  }
  .w-20 {
    width: calc(var(--spacing) * 20);
  }
  .w-24 {
    width: calc(var(--spacing) * 24);
  }
  .w-28 {
    width: calc(var(--spacing) * 28);
  }
  .w-32 {
    width: calc(var(--spacing) * 32);
  }
  .w-36 {
    width: calc(var(--spacing) * 36);
  }
  .w-40 {
    width: calc(var(--spacing) * 40);
  }
  .w-44 {
    width: calc(var(--spacing) * 44);
  }
  .w-48 {
    width: calc(var(--spacing) * 48);
  }
  .w-52 {
    width: calc(var(--spacing) * 52);
  }
  .w-56 {
    width: calc(var(--spacing) * 56);
  }
  .w-64 {
    width: calc(var(--spacing) * 64);
  }
  .w-80 {
    width: calc(var(--spacing) * 80);
  }
  .w-\[3\.75rem\] {
    width: 3.75rem;
  }
  .w-\[5\.5rem\] {
    width: 5.5rem;
  }
  .w-\[5px\] {
    width: 5px;
  }
  .w-\[7\.5rem\] {
    width: 7.5rem;
  }
  .w-\[8\.5rem\] {
    width: 8.5rem;
  }
  .w-\[18\%\] {
    width: 18%;
  }
  .w-\[20\%\] {
    width: 20%;
  }
  .w-\[22rem\] {
    width: 22rem;
  }
  .w-\[24\%\] {
    width: 24%;
  }
  .w-\[26\%\] {
    width: 26%;
  }
  .w-\[26rem\] {
    width: 26rem;
  }
  .w-\[28\%\] {
    width: 28%;
  }
  .w-\[28rem\] {
    width: 28rem;
  }
  .w-\[36\%\] {
    width: 36%;
  }
  .w-\[38\%\] {
    width: 38%;
  }
  .w-\[40\%\] {
    width: 40%;
  }
  .w-\[42\%\] {
    width: 42%;
  }
  .w-\[44\%\] {
    width: 44%;
  }
  .w-\[46\%\] {
    width: 46%;
  }
  .w-\[48\%\] {
    width: 48%;
  }
  .w-\[52\%\] {
    width: 52%;
  }
  .w-\[54\%\] {
    width: 54%;
  }
  .w-\[56\%\] {
    width: 56%;
  }
  .w-\[58\%\] {
    width: 58%;
  }
  .w-\[64\%\] {
    width: 64%;
  }
  .w-\[66\%\] {
    width: 66%;
  }
  .w-\[68\%\] {
    width: 68%;
  }
  .w-\[72\%\] {
    width: 72%;
  }
  .w-\[76\%\] {
    width: 76%;
  }
  .w-\[80\%\] {
    width: 80%;
  }
  .w-\[160px\] {
    width: 160px;
  }
  .w-\[175px\] {
    width: 175px;
  }
  .w-\[min\(16rem\,100\%\)\] {
    width: min(16rem, 100%);
  }
  .w-\[min\(18rem\,calc\(100vw-2rem\)\)\] {
    width: min(18rem, calc(100vw - 2rem));
  }
  .w-\[min\(20rem\,…\)\] {
    width: min(20rem, …);
  }
  .w-\[min\(22\.5rem\,calc\(100vw-2rem\)\)\] {
    width: min(22.5rem, calc(100vw - 2rem));
  }
  .w-\[min\(22rem\,var\(--available-width\)\)\] {
    width: min(22rem, var(--available-width));
  }
  .w-\[min\(var\(--auth-content-width\)\,calc\(100vw-2\*var\(--space-section-compact\)\)\)\] {
    width: min(var(--auth-content-width), calc(100vw - 2 * var(--space-section-compact)));
  }
  .w-\[min\(var\(--details-pane-width\)\,100vw\)\] {
    width: min(var(--details-pane-width), 100vw);
  }
  .w-\[min\(var\(--shell-rail-width\)\,calc\(100vw-2\*var\(--space-section-compact\)\)\)\] {
    width: min(var(--shell-rail-width), calc(100vw - 2 * var(--space-section-compact)));
  }
  .w-\[min\(var\(--toast-width\)\,calc\(100vw-2\*var\(--overlay-gutter\)\)\)\] {
    width: min(var(--toast-width), calc(100vw - 2 * var(--overlay-gutter)));
  }
  .w-\[min\(var\(--toast-width\)\,calc\(100vw-2\*var\(--space-section-compact\)\)\)\] {
    width: min(var(--toast-width), calc(100vw - 2 * var(--space-section-compact)));
  }
  .w-\[min\(var\(--toast-width\)\,calc\(100vw-2rem-var\(--safe-area-left\)-var\(--safe-area-right\)\)\)\] {
    width: min(var(--toast-width), calc(100vw - 2rem - var(--safe-area-left) - var(--safe-area-right)));
  }
  .w-\[min\(var\(--window-width-420\)\,100vw\)\] {
    width: min(var(--window-width-420), 100vw);
  }
  .w-\[var\(--auth-reveal-size\)\] {
    width: var(--auth-reveal-size);
  }
  .w-\[var\(--calendar-week-total-width\)\] {
    width: var(--calendar-week-total-width);
  }
  .w-\[var\(--chart-legend-width\)\] {
    width: var(--chart-legend-width);
  }
  .w-\[var\(--chart-tooltip-width\)\] {
    width: var(--chart-tooltip-width);
  }
  .w-\[var\(--control-compact\)\] {
    width: var(--control-compact);
  }
  .w-\[var\(--control-form\)\] {
    width: var(--control-form);
  }
  .w-\[var\(--control-standard\)\] {
    width: var(--control-standard);
  }
  .w-\[var\(--data-alert-rail-width\)\] {
    width: var(--data-alert-rail-width);
  }
  .w-\[var\(--details-pane-width\)\] {
    width: var(--details-pane-width);
  }
  .w-\[var\(--display-options-width\)\] {
    width: var(--display-options-width);
  }
  .w-\[var\(--filter-cascade-width\)\] {
    width: var(--filter-cascade-width);
  }
  .w-\[var\(--filter-menu-width\)\] {
    width: var(--filter-menu-width);
  }
  .w-\[var\(--filter-panel-width\)\] {
    width: var(--filter-panel-width);
  }
  .w-\[var\(--funding-identity-width\)\] {
    width: var(--funding-identity-width);
  }
  .w-\[var\(--settings-control-width\)\] {
    width: var(--settings-control-width);
  }
  .w-\[var\(--settings-range-width\)\] {
    width: var(--settings-range-width);
  }
  .w-\[var\(--settings-window-width\)\] {
    width: var(--settings-window-width);
  }
  .w-\[var\(--settings-window-width-wide\)\] {
    width: var(--settings-window-width-wide);
  }
  .w-\[var\(--shell-rail-width\)\] {
    width: var(--shell-rail-width);
  }
  .w-\[var\(--space-inline-wide\)\] {
    width: var(--space-inline-wide);
  }
  .w-\[var\(--space-section-compact\)\] {
    width: var(--space-section-compact);
  }
  .w-\[var\(--switch-track-w\)\] {
    width: var(--switch-track-w);
  }
  .w-\[var\(--table-column-asset\)\] {
    width: var(--table-column-asset);
  }
  .w-\[var\(--window-width-420\)\] {
    width: var(--window-width-420);
  }
  .w-\[var\(--window-width-480\)\] {
    width: var(--window-width-480);
  }
  .w-\[var\(--window-width-560\)\] {
    width: var(--window-width-560);
  }
  .w-\[var\(--window-width-720\)\] {
    width: var(--window-width-720);
  }
  .w-\[var\(--window-width-1120\)\] {
    width: var(--window-width-1120);
  }
  .w-\[var\(--zml-cell-inline\)\] {
    width: var(--zml-cell-inline);
  }
  .w-auto {
    width: auto;
  }
  .w-fit {
    width: fit-content;
  }
  .w-full {
    width: 100%;
  }
  .w-max {
    width: max-content;
  }
  .w-px {
    width: 1px;
  }
  .max-w-15 {
    max-width: calc(var(--spacing) * 15);
  }
  .max-w-25 {
    max-width: calc(var(--spacing) * 25);
  }
  .max-w-28 {
    max-width: calc(var(--spacing) * 28);
  }
  .max-w-32 {
    max-width: calc(var(--spacing) * 32);
  }
  .max-w-40 {
    max-width: calc(var(--spacing) * 40);
  }
  .max-w-72 {
    max-width: calc(var(--spacing) * 72);
  }
  .max-w-80 {
    max-width: calc(var(--spacing) * 80);
  }
  .max-w-\[12rem\] {
    max-width: 12rem;
  }
  .max-w-\[16rem\] {
    max-width: 16rem;
  }
  .max-w-\[24rem\] {
    max-width: 24rem;
  }
  .max-w-\[32rem\] {
    max-width: 32rem;
  }
  .max-w-\[40\%\] {
    max-width: 40%;
  }
  .max-w-\[48ch\] {
    max-width: 48ch;
  }
  .max-w-\[80ch\] {
    max-width: 80ch;
  }
  .max-w-\[100dvw\] {
    max-width: 100dvw;
  }
  .max-w-\[calc\(100\%-2\*var\(--space-inline-compact\)\)\] {
    max-width: calc(100% - 2 * var(--space-inline-compact));
  }
  .max-w-\[calc\(100\%-var\(--view-rail-overflow-reserve\,0px\)\)\] {
    max-width: calc(100% - var(--view-rail-overflow-reserve,0px));
  }
  .max-w-\[calc\(100vw-2\*var\(--overlay-gutter\)\)\] {
    max-width: calc(100vw - 2 * var(--overlay-gutter));
  }
  .max-w-\[calc\(100vw-2\*var\(--space-section-compact\)\)\] {
    max-width: calc(100vw - 2 * var(--space-section-compact));
  }
  .max-w-\[min\(22rem\,calc\(100vw-1rem-var\(--safe-area-left\)-var\(--safe-area-right\)\)\)\] {
    max-width: min(22rem, calc(100vw - 1rem - var(--safe-area-left) - var(--safe-area-right)));
  }
  .max-w-\[min\(280px\,var\(--available-width\)\,calc\(100vw-2\*var\(--overlay-gutter\)\)\)\] {
    max-width: min(280px, var(--available-width), calc(100vw - 2 * var(--overlay-gutter)));
  }
  .max-w-\[min\(320px\,var\(--available-width\)\,calc\(100vw-2\*var\(--overlay-gutter\)\)\)\] {
    max-width: min(320px, var(--available-width), calc(100vw - 2 * var(--overlay-gutter)));
  }
  .max-w-\[min\(520px\,var\(--available-width\)\,calc\(100vw-2\*var\(--overlay-gutter\)\)\)\] {
    max-width: min(520px, var(--available-width), calc(100vw - 2 * var(--overlay-gutter)));
  }
  .max-w-\[min\(var\(--available-width\)\,calc\(100vw-2\*var\(--overlay-gutter\)\)\)\] {
    max-width: min(var(--available-width), calc(100vw - 2 * var(--overlay-gutter)));
  }
  .max-w-\[min\(var\(--popover-max-width\)\,calc\(100vw-2\*var\(--overlay-gutter\)\)\)\] {
    max-width: min(var(--popover-max-width), calc(100vw - 2 * var(--overlay-gutter)));
  }
  .max-w-\[token\+2rem\] {
    max-width: token+2rem;
  }
  .max-w-\[var\(--announcement-category-column-compact\)\] {
    max-width: var(--announcement-category-column-compact);
  }
  .max-w-\[var\(--article-reading-width\)\] {
    max-width: var(--article-reading-width);
  }
  .max-w-\[var\(--available-width\)\] {
    max-width: var(--available-width);
  }
  .max-w-\[var\(--avatar-crop-stage\)\] {
    max-width: var(--avatar-crop-stage);
  }
  .max-w-\[var\(--content-max-width\)\] {
    max-width: var(--content-max-width);
  }
  .max-w-\[var\(--form-field-default\)\] {
    max-width: var(--form-field-default);
  }
  .max-w-\[var\(--settings-card-reading-width\)\] {
    max-width: var(--settings-card-reading-width);
  }
  .max-w-\[var\(--settings-reading-width\)\] {
    max-width: var(--settings-reading-width);
  }
  .max-w-\[var\(--state-measure\)\] {
    max-width: var(--state-measure);
  }
  .max-w-\[var\(--table-column-asset\)\] {
    max-width: var(--table-column-asset);
  }
  .max-w-\[…reading-width…\] {
    max-width: …reading-width…;
  }
  .max-w-full {
    max-width: 100%;
  }
  .max-w-lg {
    max-width: var(--container-lg);
  }
  .max-w-md {
    max-width: var(--container-md);
  }
  .max-w-none {
    max-width: none;
  }
  .max-w-sm {
    max-width: var(--container-sm);
  }
  .max-w-xl {
    max-width: var(--container-xl);
  }
  .max-w-xs {
    max-width: var(--container-xs);
  }
  .min-w-0 {
    min-width: 0px;
  }
  .min-w-7 {
    min-width: calc(var(--spacing) * 7);
  }
  .min-w-14 {
    min-width: calc(var(--spacing) * 14);
  }
  .min-w-16 {
    min-width: calc(var(--spacing) * 16);
  }
  .min-w-20 {
    min-width: calc(var(--spacing) * 20);
  }
  .min-w-25 {
    min-width: calc(var(--spacing) * 25);
  }
  .min-w-35 {
    min-width: calc(var(--spacing) * 35);
  }
  .min-w-36 {
    min-width: calc(var(--spacing) * 36);
  }
  .min-w-40 {
    min-width: calc(var(--spacing) * 40);
  }
  .min-w-48 {
    min-width: calc(var(--spacing) * 48);
  }
  .min-w-\[1\.5em\] {
    min-width: 1.5em;
  }
  .min-w-\[2\.5rem\] {
    min-width: 2.5rem;
  }
  .min-w-\[4\.5rem\] {
    min-width: 4.5rem;
  }
  .min-w-\[4\.375rem\] {
    min-width: 4.375rem;
  }
  .min-w-\[5\.625rem\] {
    min-width: 5.625rem;
  }
  .min-w-\[8\.125rem\] {
    min-width: 8.125rem;
  }
  .min-w-\[8rem\] {
    min-width: 8rem;
  }
  .min-w-\[36rem\] {
    min-width: 36rem;
  }
  .min-w-\[175px\] {
    min-width: 175px;
  }
  .min-w-\[calc\(6ch\+3em\)\] {
    min-width: calc(6ch + 3em);
  }
  .min-w-\[calc\(7\*var\(--calendar-day-width\)\)\] {
    min-width: calc(7 * var(--calendar-day-width));
  }
  .min-w-\[calc\(7\*var\(--calendar-day-width\)\+var\(--calendar-week-total-width\)\)\] {
    min-width: calc(7 * var(--calendar-day-width) + var(--calendar-week-total-width));
  }
  .min-w-\[calc\(var\(--auth-content-width\)\+2\*var\(--space-section-compact\)\)\] {
    min-width: calc(var(--auth-content-width) + 2 * var(--space-section-compact));
  }
  .min-w-\[var\(--anchor-width\)\] {
    min-width: var(--anchor-width);
  }
  .min-w-\[var\(--control-form\)\] {
    min-width: var(--control-form);
  }
  .min-w-\[var\(--control-standard\)\] {
    min-width: var(--control-standard);
  }
  .min-w-\[var\(--display-options-control-min\)\] {
    min-width: var(--display-options-control-min);
  }
  .min-w-\[var\(--switch-track-w\)\] {
    min-width: var(--switch-track-w);
  }
  .min-w-\[var\(--table-column-amount\)\] {
    min-width: var(--table-column-amount);
  }
  .min-w-\[var\(--table-column-identity\)\] {
    min-width: var(--table-column-identity);
  }
  .min-w-\[var\(--table-record-min\)\] {
    min-width: var(--table-record-min);
  }
  .min-w-fit {
    min-width: fit-content;
  }
  .min-w-full {
    min-width: 100%;
  }
  .min-w-max {
    min-width: max-content;
  }
  .flex-1 {
    flex: 1;
  }
  .flex-\[1_1_var\(--record-summary-min\)\] {
    flex: 1 1 var(--record-summary-min);
  }
  .flex-\[2_1_var\(--record-summary-min\)\] {
    flex: 2 1 var(--record-summary-min);
  }
  .flex-auto {
    flex: auto;
  }
  .flex-none {
    flex: none;
  }
  .shrink {
    flex-shrink: 1;
  }
  .shrink-0 {
    flex-shrink: 0;
  }
  .grow {
    flex-grow: 1;
  }
  .basis-\[var\(--record-identity-min\)\] {
    flex-basis: var(--record-identity-min);
  }
  .basis-\[var\(--selection-identity-width\)\] {
    flex-basis: var(--selection-identity-width);
  }
  .basis-\[var\(--settings-label-min\)\] {
    flex-basis: var(--settings-label-min);
  }
  .basis-full {
    flex-basis: 100%;
  }
  .table-auto {
    table-layout: auto;
  }
  .table-fixed {
    table-layout: fixed;
  }
  .caption-bottom {
    caption-side: bottom;
  }
  .border-collapse {
    border-collapse: collapse;
  }
  .border-separate {
    border-collapse: separate;
  }
  .border-spacing-0 {
    --tw-border-spacing-x: 0px;
    --tw-border-spacing-y: 0px;
    border-spacing: var(--tw-border-spacing-x) var(--tw-border-spacing-y);
  }
  .origin-\[var\(--transform-origin\)\] {
    transform-origin: var(--transform-origin);
  }
  .-translate-x-1\/2 {
    --tw-translate-x: calc(calc(1 / 2 * 100%) * -1);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }
  .-translate-y-1\/2 {
    --tw-translate-y: calc(calc(1 / 2 * 100%) * -1);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }
  .translate-y-1 {
    --tw-translate-y: var(--spacing);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }
  .\[translate\:calc\(-1\*var\(--view-rail-overflow-pull\,0px\)\)_0\] {
    translate: calc(-1 * var(--view-rail-overflow-pull,0px)) 0;
  }
  .rotate-90 {
    rotate: 90deg;
  }
  .\[transform\:var\(--zml-toast-transform\)\] {
    transform: var(--zml-toast-transform);
  }
  .transform {
    transform: var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,);
  }
  .transform-none {
    transform: none;
  }
  .animate-\[zml-pulse_var\(--motion-loop\)_var\(--ease-move\)_infinite\] {
    animation: zml-pulse var(--motion-loop) var(--ease-move) infinite;
  }
  .animate-none {
    animation: none;
  }
  .animate-spin {
    animation: var(--animate-spin);
  }
  .cursor-col-resize {
    cursor: col-resize;
  }
  .cursor-default {
    cursor: default;
  }
  .cursor-grab {
    cursor: grab;
  }
  .cursor-not-allowed {
    cursor: not-allowed;
  }
  .cursor-pointer {
    cursor: pointer;
  }
  .touch-pan-x {
    --tw-pan-x: pan-x;
    touch-action: var(--tw-pan-x,) var(--tw-pan-y,) var(--tw-pinch-zoom,);
  }
  .touch-manipulation {
    touch-action: manipulation;
  }
  .touch-none {
    touch-action: none;
  }
  .resize {
    resize: both;
  }
  .resize-y {
    resize: vertical;
  }
  .scroll-my-1 {
    scroll-margin-block: var(--spacing);
  }
  .scroll-my-1\.5 {
    scroll-margin-block: calc(var(--spacing) * 1.5);
  }
  .\[scroll-padding-block\:var\(--space-section-compact\)\] {
    scroll-padding-block: var(--space-section-compact);
  }
  .scroll-py-1 {
    scroll-padding-block: var(--spacing);
  }
  .\[scrollbar-width\:none\] {
    scrollbar-width: none;
  }
  .\[scrollbar-width\:thin\] {
    scrollbar-width: thin;
  }
  .\[scrollbar-gutter\:stable\] {
    scrollbar-gutter: stable;
  }
  .\[scrollbar-gutter\:stable_both-edges\] {
    scrollbar-gutter: stable both-edges;
  }
  .list-decimal {
    list-style-type: decimal;
  }
  .list-none {
    list-style-type: none;
  }
  .appearance-none {
    appearance: none;
  }
  .\[grid-template-columns\:repeat\(auto-fit\,minmax\(min\(100\%\,8\.75rem\)\,1fr\)\)\] {
    grid-template-columns: repeat(auto-fit,minmax(min(100%, 8.75rem),1fr));
  }
  .\[grid-template-columns\:repeat\(auto-fit\,minmax\(min\(100\%\,320px\)\,1fr\)\)\] {
    grid-template-columns: repeat(auto-fit,minmax(min(100%, 320px),1fr));
  }
  .grid-cols-1 {
    grid-template-columns: repeat(1, minmax(0, 1fr));
  }
  .grid-cols-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .grid-cols-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .grid-cols-4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
  .grid-cols-\[2\.5rem_minmax\(0\,1fr\)_minmax\(0\,1fr\)\] {
    grid-template-columns: 2.5rem minmax(0,1fr) minmax(0,1fr);
  }
  .grid-cols-\[auto_1fr\] {
    grid-template-columns: auto 1fr;
  }
  .grid-cols-\[auto_minmax\(0\,1fr\)\] {
    grid-template-columns: auto minmax(0,1fr);
  }
  .grid-cols-\[auto_minmax\(0\,1fr\)_auto\] {
    grid-template-columns: auto minmax(0,1fr) auto;
  }
  .grid-cols-\[auto_minmax\(0\,var\(--settings-fact-label\)\)_minmax\(0\,5rem\)_minmax\(0\,1fr\)_auto\] {
    grid-template-columns: auto minmax(0,var(--settings-fact-label)) minmax(0,5rem) minmax(0,1fr) auto;
  }
  .grid-cols-\[max-content_max-content_max-content\] {
    grid-template-columns: max-content max-content max-content;
  }
  .grid-cols-\[minmax\(0\,1fr\)\] {
    grid-template-columns: minmax(0,1fr);
  }
  .grid-cols-\[minmax\(0\,1fr\)_auto\] {
    grid-template-columns: minmax(0,1fr) auto;
  }
  .grid-cols-\[minmax\(0\,1fr\)_auto_auto\] {
    grid-template-columns: minmax(0,1fr) auto auto;
  }
  .grid-cols-\[minmax\(0\,1fr\)_minmax\(0\,1\.5fr\)\] {
    grid-template-columns: minmax(0,1fr) minmax(0,1.5fr);
  }
  .grid-cols-\[minmax\(0\,var\(--details-balanced-master\)\)_minmax\(var\(--details-balanced-min\)\,var\(--details-balanced-detail\)\)\] {
    grid-template-columns: minmax(0,var(--details-balanced-master)) minmax(var(--details-balanced-min),var(--details-balanced-detail));
  }
  .grid-cols-\[minmax\(0\,var\(--settings-fact-label\)\)_minmax\(0\,1fr\)_auto\] {
    grid-template-columns: minmax(0,var(--settings-fact-label)) minmax(0,1fr) auto;
  }
  .grid-cols-\[minmax\(5rem\,1fr\)_minmax\(var\(--display-options-control-min\)\,max-content\)\] {
    grid-template-columns: minmax(5rem,1fr) minmax(var(--display-options-control-min),max-content);
  }
  .grid-cols-\[repeat\(auto-fill\,minmax\(7\.5rem\,1fr\)\)\] {
    grid-template-columns: repeat(auto-fill,minmax(7.5rem,1fr));
  }
  .grid-cols-\[repeat\(auto-fill\,minmax\(14rem\,1fr\)\)\] {
    grid-template-columns: repeat(auto-fill,minmax(14rem,1fr));
  }
  .grid-cols-\[repeat\(auto-fit\,minmax\(min\(100\%\,12rem\)\,1fr\)\)\] {
    grid-template-columns: repeat(auto-fit,minmax(min(100%, 12rem),1fr));
  }
  .grid-cols-\[repeat\(auto-fit\,minmax\(min\(100\%\,var\(--form-column-min\)\)\,1fr\)\)\] {
    grid-template-columns: repeat(auto-fit,minmax(min(100%, var(--form-column-min)),1fr));
  }
  .grid-cols-\[repeat\(auto-fit\,minmax\(min\(100\%\,var\(--form-field-compact\)\)\,1fr\)\)\] {
    grid-template-columns: repeat(auto-fit,minmax(min(100%, var(--form-field-compact)),1fr));
  }
  .grid-cols-\[repeat\(auto-fit\,minmax\(min\(100\%\,var\(--selection-list-column-min\)\)\,1fr\)\)\] {
    grid-template-columns: repeat(auto-fit,minmax(min(100%, var(--selection-list-column-min)),1fr));
  }
  .grid-cols-\[var\(--details-library-master-width\)_minmax\(0\,1fr\)\] {
    grid-template-columns: var(--details-library-master-width) minmax(0,1fr);
  }
  .grid-cols-\[var\(--shell-rail-width\)_minmax\(0\,1fr\)\] {
    grid-template-columns: var(--shell-rail-width) minmax(0,1fr);
  }
  .grid-cols-subgrid {
    grid-template-columns: subgrid;
  }
  .grid-rows-\[minmax\(0\,1fr\)\] {
    grid-template-rows: minmax(0,1fr);
  }
  .grid-rows-\[minmax\(0\,1fr\)_auto\] {
    grid-template-rows: minmax(0,1fr) auto;
  }
  .grid-rows-\[var\(--window-header-height\)_minmax\(0\,1fr\)\] {
    grid-template-rows: var(--window-header-height) minmax(0,1fr);
  }
  .flex-col {
    flex-direction: column;
  }
  .flex-col-reverse {
    flex-direction: column-reverse;
  }
  .flex-row {
    flex-direction: row;
  }
  .flex-row-reverse {
    flex-direction: row-reverse;
  }
  .flex-nowrap {
    flex-wrap: nowrap;
  }
  .flex-wrap {
    flex-wrap: wrap;
  }
  .place-items-center {
    place-items: center;
  }
  .content-start {
    align-content: flex-start;
  }
  .items-baseline {
    align-items: baseline;
  }
  .items-center {
    align-items: center;
  }
  .items-end {
    align-items: flex-end;
  }
  .items-start {
    align-items: flex-start;
  }
  .items-stretch {
    align-items: stretch;
  }
  .justify-between {
    justify-content: space-between;
  }
  .justify-center {
    justify-content: center;
  }
  .justify-end {
    justify-content: flex-end;
  }
  .justify-start {
    justify-content: flex-start;
  }
  .justify-items-center {
    justify-items: center;
  }
  .justify-items-start {
    justify-items: start;
  }
  .justify-items-stretch {
    justify-items: stretch;
  }
  .gap-0 {
    gap: 0px;
  }
  .gap-0\.5 {
    gap: calc(var(--spacing) * 0.5);
  }
  .gap-1 {
    gap: var(--spacing);
  }
  .gap-1\.5 {
    gap: calc(var(--spacing) * 1.5);
  }
  .gap-2 {
    gap: calc(var(--spacing) * 2);
  }
  .gap-3 {
    gap: calc(var(--spacing) * 3);
  }
  .gap-4 {
    gap: calc(var(--spacing) * 4);
  }
  .gap-6 {
    gap: calc(var(--spacing) * 6);
  }
  .gap-\[3px\] {
    gap: 3px;
  }
  .gap-\[5px\] {
    gap: 5px;
  }
  .gap-\[calc\(var\(--auth-action-pitch\)-var\(--control-auth\)\)\] {
    gap: calc(var(--auth-action-pitch) - var(--control-auth));
  }
  .gap-\[inherit\] {
    gap: inherit;
  }
  .gap-\[var\(--cell-gap\)\] {
    gap: var(--cell-gap);
  }
  .gap-\[var\(--form-section-content-gap\)\] {
    gap: var(--form-section-content-gap);
  }
  .gap-\[var\(--section-gap\)\] {
    gap: var(--section-gap);
  }
  .gap-\[var\(--settings-section-gap\)\] {
    gap: var(--settings-section-gap);
  }
  .gap-\[var\(--space-inline-compact\)\] {
    gap: var(--space-inline-compact);
  }
  .gap-\[var\(--space-inline-standard\)\] {
    gap: var(--space-inline-standard);
  }
  .gap-\[var\(--space-inline-wide\)\] {
    gap: var(--space-inline-wide);
  }
  .gap-\[var\(--space-section-compact\)\] {
    gap: var(--space-section-compact);
  }
  .gap-\[var\(--space-section-standard\)\] {
    gap: var(--space-section-standard);
  }
  .gap-\[var\(--space-stack-compact\)\] {
    gap: var(--space-stack-compact);
  }
  .gap-\[var\(--space-stack-standard\)\] {
    gap: var(--space-stack-standard);
  }
  .gap-\[var\(--space-toolbar-quiet\)\] {
    gap: var(--space-toolbar-quiet);
  }
  .gap-px {
    gap: 1px;
  }
  :where(.space-y-1 > :not(:last-child)) {
    --tw-space-y-reverse: 0;
    margin-block-start: calc(var(--spacing) * var(--tw-space-y-reverse));
    margin-block-end: calc(var(--spacing) * calc(1 - var(--tw-space-y-reverse)));
  }
  :where(.space-y-1\.5 > :not(:last-child)) {
    --tw-space-y-reverse: 0;
    margin-block-start: calc(calc(var(--spacing) * 1.5) * var(--tw-space-y-reverse));
    margin-block-end: calc(calc(var(--spacing) * 1.5) * calc(1 - var(--tw-space-y-reverse)));
  }
  :where(.space-y-2 > :not(:last-child)) {
    --tw-space-y-reverse: 0;
    margin-block-start: calc(calc(var(--spacing) * 2) * var(--tw-space-y-reverse));
    margin-block-end: calc(calc(var(--spacing) * 2) * calc(1 - var(--tw-space-y-reverse)));
  }
  :where(.space-y-3 > :not(:last-child)) {
    --tw-space-y-reverse: 0;
    margin-block-start: calc(calc(var(--spacing) * 3) * var(--tw-space-y-reverse));
    margin-block-end: calc(calc(var(--spacing) * 3) * calc(1 - var(--tw-space-y-reverse)));
  }
  :where(.space-y-6 > :not(:last-child)) {
    --tw-space-y-reverse: 0;
    margin-block-start: calc(calc(var(--spacing) * 6) * var(--tw-space-y-reverse));
    margin-block-end: calc(calc(var(--spacing) * 6) * calc(1 - var(--tw-space-y-reverse)));
  }
  :where(.space-y-\[var\(--space-stack-standard\)\] > :not(:last-child)) {
    --tw-space-y-reverse: 0;
    margin-block-start: calc(var(--space-stack-standard) * var(--tw-space-y-reverse));
    margin-block-end: calc(var(--space-stack-standard) * calc(1 - var(--tw-space-y-reverse)));
  }
  .gap-x-1 {
    column-gap: var(--spacing);
  }
  .gap-x-1\.5 {
    column-gap: calc(var(--spacing) * 1.5);
  }
  .gap-x-2 {
    column-gap: calc(var(--spacing) * 2);
  }
  .gap-x-3 {
    column-gap: calc(var(--spacing) * 3);
  }
  .gap-x-4 {
    column-gap: calc(var(--spacing) * 4);
  }
  .gap-x-6 {
    column-gap: calc(var(--spacing) * 6);
  }
  .gap-x-\[var\(--space-detail-gutter\)\] {
    column-gap: var(--space-detail-gutter);
  }
  .gap-x-\[var\(--space-inline-compact\)\] {
    column-gap: var(--space-inline-compact);
  }
  .gap-x-\[var\(--space-inline-standard\)\] {
    column-gap: var(--space-inline-standard);
  }
  .gap-x-\[var\(--space-inline-wide\)\] {
    column-gap: var(--space-inline-wide);
  }
  .gap-x-\[var\(--space-section-compact\)\] {
    column-gap: var(--space-section-compact);
  }
  .gap-y-0 {
    row-gap: 0px;
  }
  .gap-y-0\.5 {
    row-gap: calc(var(--spacing) * 0.5);
  }
  .gap-y-1 {
    row-gap: var(--spacing);
  }
  .gap-y-1\.5 {
    row-gap: calc(var(--spacing) * 1.5);
  }
  .gap-y-2 {
    row-gap: calc(var(--spacing) * 2);
  }
  .gap-y-3 {
    row-gap: calc(var(--spacing) * 3);
  }
  .gap-y-\[var\(--space-inline-compact\)\] {
    row-gap: var(--space-inline-compact);
  }
  .gap-y-\[var\(--space-inline-standard\)\] {
    row-gap: var(--space-inline-standard);
  }
  .gap-y-\[var\(--space-stack-compact\)\] {
    row-gap: var(--space-stack-compact);
  }
  .gap-y-\[var\(--space-stack-standard\)\] {
    row-gap: var(--space-stack-standard);
  }
  :where(.divide-y > :not(:last-child)) {
    --tw-divide-y-reverse: 0;
    border-bottom-style: var(--tw-border-style);
    border-top-style: var(--tw-border-style);
    border-top-width: calc(1px * var(--tw-divide-y-reverse));
    border-bottom-width: calc(1px * calc(1 - var(--tw-divide-y-reverse)));
  }
  :where(.divide-y-0 > :not(:last-child)) {
    --tw-divide-y-reverse: 0;
    border-bottom-style: var(--tw-border-style);
    border-top-style: var(--tw-border-style);
    border-top-width: calc(0px * var(--tw-divide-y-reverse));
    border-bottom-width: calc(0px * calc(1 - var(--tw-divide-y-reverse)));
  }
  :where(.divide-\[var\(--border-subtle\)\] > :not(:last-child)) {
    border-color: var(--border-subtle);
  }
  :where(.divide-\[var\(--material-border\)\] > :not(:last-child)) {
    border-color: var(--material-border);
  }
  .self-center {
    align-self: center;
  }
  .self-start {
    align-self: flex-start;
  }
  .justify-self-end {
    justify-self: flex-end;
  }
  .justify-self-start {
    justify-self: flex-start;
  }
  .truncate {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .overflow-auto {
    overflow: auto;
  }
  .overflow-clip {
    overflow: clip;
  }
  .overflow-hidden {
    overflow: hidden;
  }
  .overflow-visible {
    overflow: visible;
  }
  .\[overflow-x\:clip\] {
    overflow-x: clip;
  }
  .overflow-x-auto {
    overflow-x: auto;
  }
  .overflow-x-clip {
    overflow-x: clip;
  }
  .overflow-x-hidden {
    overflow-x: hidden;
  }
  .\[overflow-y\:visible\] {
    overflow-y: visible;
  }
  .overflow-y-auto {
    overflow-y: auto;
  }
  .overflow-y-hidden {
    overflow-y: hidden;
  }
  .overscroll-contain {
    overscroll-behavior: contain;
  }
  .overscroll-x-contain {
    overscroll-behavior-x: contain;
  }
  .rounded {
    border-radius: 0.25rem;
  }
  .rounded-\[2px\] {
    border-radius: 2px;
  }
  .rounded-\[3px\] {
    border-radius: 3px;
  }
  .rounded-\[30px\] {
    border-radius: 30px;
  }
  .rounded-\[inherit\] {
    border-radius: inherit;
  }
  .rounded-\[var\(--material-radius\)\] {
    border-radius: var(--material-radius);
  }
  .rounded-\[var\(--radius-auth-field\)\] {
    border-radius: var(--radius-auth-field);
  }
  .rounded-\[var\(--radius-checkbox\)\] {
    border-radius: var(--radius-checkbox);
  }
  .rounded-\[var\(--radius-control\)\] {
    border-radius: var(--radius-control);
  }
  .rounded-\[var\(--radius-data-surface\)\] {
    border-radius: var(--radius-data-surface);
  }
  .rounded-\[var\(--radius-floating\)\] {
    border-radius: var(--radius-floating);
  }
  .rounded-\[var\(--radius-md\)\] {
    border-radius: var(--radius-md);
  }
  .rounded-\[var\(--radius-micro\)\] {
    border-radius: var(--radius-micro);
  }
  .rounded-\[var\(--radius-micro\,2px\)\] {
    border-radius: var(--radius-micro,2px);
  }
  .rounded-\[var\(--radius-modal\)\] {
    border-radius: var(--radius-modal);
  }
  .rounded-\[var\(--radius-pill\)\] {
    border-radius: var(--radius-pill);
  }
  .rounded-\[var\(--radius-rail-switcher\)\] {
    border-radius: var(--radius-rail-switcher);
  }
  .rounded-\[var\(--radius-section\)\] {
    border-radius: var(--radius-section);
  }
  .rounded-\[var\(--radius-small\)\] {
    border-radius: var(--radius-small);
  }
  .rounded-\[var\(--radius-swatch\)\] {
    border-radius: var(--radius-swatch);
  }
  .rounded-\[var\(--zml-checkbox-radius\)\] {
    border-radius: var(--zml-checkbox-radius);
  }
  .rounded-full {
    border-radius: calc(infinity * 1px);
  }
  .rounded-lg {
    border-radius: var(--radius-lg);
  }
  .rounded-none {
    border-radius: 0;
  }
  .border {
    border-style: var(--tw-border-style);
    border-width: 1px;
  }
  .border-0 {
    border-style: var(--tw-border-style);
    border-width: 0px;
  }
  .border-2 {
    border-style: var(--tw-border-style);
    border-width: 2px;
  }
  .border-\[0\.5px\] {
    border-style: var(--tw-border-style);
    border-width: 0.5px;
  }
  .border-\[length\:var\(--border-width-hairline\)\] {
    border-style: var(--tw-border-style);
    border-width: var(--border-width-hairline);
  }
  .border-x {
    border-inline-style: var(--tw-border-style);
    border-inline-width: 1px;
  }
  .border-y {
    border-block-style: var(--tw-border-style);
    border-block-width: 1px;
  }
  .border-s {
    border-inline-start-style: var(--tw-border-style);
    border-inline-start-width: 1px;
  }
  .border-s-2 {
    border-inline-start-style: var(--tw-border-style);
    border-inline-start-width: 2px;
  }
  .border-s-\[0\.5px\] {
    border-inline-start-style: var(--tw-border-style);
    border-inline-start-width: 0.5px;
  }
  .border-e {
    border-inline-end-style: var(--tw-border-style);
    border-inline-end-width: 1px;
  }
  .border-e-\[0\.5px\] {
    border-inline-end-style: var(--tw-border-style);
    border-inline-end-width: 0.5px;
  }
  .border-t {
    border-top-style: var(--tw-border-style);
    border-top-width: 1px;
  }
  .border-t-0 {
    border-top-style: var(--tw-border-style);
    border-top-width: 0px;
  }
  .border-t-\[0\.5px\] {
    border-top-style: var(--tw-border-style);
    border-top-width: 0.5px;
  }
  .border-b {
    border-bottom-style: var(--tw-border-style);
    border-bottom-width: 1px;
  }
  .border-b-\[0\.5px\] {
    border-bottom-style: var(--tw-border-style);
    border-bottom-width: 0.5px;
  }
  .border-dashed {
    --tw-border-style: dashed;
    border-style: dashed;
  }
  .border-\[color-mix\(in_oklab\,var\(--status-error\)_26\%\,transparent\)\] {
    border-color: var(--status-error);
    @supports (color: color-mix(in lab, red, red)) {
      border-color: color-mix(in oklab,var(--status-error) 26%,transparent);
    }
  }
  .border-\[color-mix\(in_oklab\,var\(--status-error\)_28\%\,transparent\)\] {
    border-color: var(--status-error);
    @supports (color: color-mix(in lab, red, red)) {
      border-color: color-mix(in oklab,var(--status-error) 28%,transparent);
    }
  }
  .border-\[color-mix\(in_oklab\,var\(--status-error\)_40\%\,var\(--settings-section-border\)\)\] {
    border-color: var(--status-error);
    @supports (color: color-mix(in lab, red, red)) {
      border-color: color-mix(in oklab,var(--status-error) 40%,var(--settings-section-border));
    }
  }
  .border-\[color-mix\(in_oklab\,var\(--status-healthy\)_26\%\,transparent\)\] {
    border-color: var(--status-healthy);
    @supports (color: color-mix(in lab, red, red)) {
      border-color: color-mix(in oklab,var(--status-healthy) 26%,transparent);
    }
  }
  .border-\[color-mix\(in_oklab\,var\(--status-info\)_26\%\,transparent\)\] {
    border-color: var(--status-info);
    @supports (color: color-mix(in lab, red, red)) {
      border-color: color-mix(in oklab,var(--status-info) 26%,transparent);
    }
  }
  .border-\[color-mix\(in_oklab\,var\(--status-warning\)_26\%\,transparent\)\] {
    border-color: var(--status-warning);
    @supports (color: color-mix(in lab, red, red)) {
      border-color: color-mix(in oklab,var(--status-warning) 26%,transparent);
    }
  }
  .border-\[color-mix\(in_oklab\,var\(--status-warning\)_28\%\,transparent\)\] {
    border-color: var(--status-warning);
    @supports (color: color-mix(in lab, red, red)) {
      border-color: color-mix(in oklab,var(--status-warning) 28%,transparent);
    }
  }
  .border-\[color-mix\(in_oklab\,var\(--zml-state-accent\)_26\%\,transparent\)\] {
    border-color: var(--zml-state-accent);
    @supports (color: color-mix(in lab, red, red)) {
      border-color: color-mix(in oklab,var(--zml-state-accent) 26%,transparent);
    }
  }
  .border-\[var\(--border\)\] {
    border-color: var(--border);
  }
  .border-\[var\(--border-segmented\)\] {
    border-color: var(--border-segmented);
  }
  .border-\[var\(--border-selected\)\] {
    border-color: var(--border-selected);
  }
  .border-\[var\(--border-strong\)\] {
    border-color: var(--border-strong);
  }
  .border-\[var\(--border-subtle\)\] {
    border-color: var(--border-subtle);
  }
  .border-\[var\(--chart-crosshair-line\)\] {
    border-color: var(--chart-crosshair-line);
  }
  .border-\[var\(--checkbox-border-standalone\,var\(--checkbox-border\,var\(--switch-track-off\)\)\)\] {
    border-color: var(--checkbox-border-standalone,var(--checkbox-border,var(--switch-track-off)));
  }
  .border-\[var\(--control-checked\)\] {
    border-color: var(--control-checked);
  }
  .border-\[var\(--field-border\)\] {
    border-color: var(--field-border);
  }
  .border-\[var\(--input\)\] {
    border-color: var(--input);
  }
  .border-\[var\(--material-border\)\] {
    border-color: var(--material-border);
  }
  .border-\[var\(--modal-border\)\] {
    border-color: var(--modal-border);
  }
  .border-\[var\(--muted-foreground\)\] {
    border-color: var(--muted-foreground);
  }
  .border-\[var\(--overlay-border\)\] {
    border-color: var(--overlay-border);
  }
  .border-\[var\(--overlay-divider\)\] {
    border-color: var(--overlay-divider);
  }
  .border-\[var\(--primary\)\] {
    border-color: var(--primary);
  }
  .border-\[var\(--select-compact-list-border\)\] {
    border-color: var(--select-compact-list-border);
  }
  .border-\[var\(--settings-section-border\)\] {
    border-color: var(--settings-section-border);
  }
  .border-\[var\(--status-error\)\] {
    border-color: var(--status-error);
  }
  .border-\[var\(--status-healthy\)\] {
    border-color: var(--status-healthy);
  }
  .border-\[var\(--status-unknown\)\] {
    border-color: var(--status-unknown);
  }
  .border-\[var\(--status-warning\)\] {
    border-color: var(--status-warning);
  }
  .border-\[var\(--zml-checkbox-border\)\] {
    border-color: var(--zml-checkbox-border);
  }
  .border-\[var\(--zml-table-head-border\)\] {
    border-color: var(--zml-table-head-border);
  }
  .border-current {
    border-color: currentcolor;
  }
  .border-transparent {
    border-color: transparent;
  }
  .border-s-\[var\(--border\)\] {
    border-inline-start-color: var(--border);
  }
  .border-t-\[var\(--border\)\] {
    border-top-color: var(--border);
  }
  .bg-\[color-mix\(in_oklab\,var\(--status-error\)_8\%\,transparent\)\] {
    background-color: var(--status-error);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab,var(--status-error) 8%,transparent);
    }
  }
  .bg-\[color-mix\(in_oklab\,var\(--status-error\)_14\%\,transparent\)\] {
    background-color: var(--status-error);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab,var(--status-error) 14%,transparent);
    }
  }
  .bg-\[color-mix\(in_oklab\,var\(--status-healthy\)_8\%\,transparent\)\] {
    background-color: var(--status-healthy);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab,var(--status-healthy) 8%,transparent);
    }
  }
  .bg-\[color-mix\(in_oklab\,var\(--status-info\)_8\%\,transparent\)\] {
    background-color: var(--status-info);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab,var(--status-info) 8%,transparent);
    }
  }
  .bg-\[color-mix\(in_oklab\,var\(--status-warning\)_8\%\,transparent\)\] {
    background-color: var(--status-warning);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab,var(--status-warning) 8%,transparent);
    }
  }
  .bg-\[color-mix\(in_oklab\,var\(--status-warning\)_14\%\,transparent\)\] {
    background-color: var(--status-warning);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab,var(--status-warning) 14%,transparent);
    }
  }
  .bg-\[color-mix\(in_oklab\,var\(--work-surface\)_80\%\,transparent\)\] {
    background-color: var(--work-surface);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab,var(--work-surface) 80%,transparent);
    }
  }
  .bg-\[color-mix\(in_oklab\,var\(--zml-state-accent\)_8\%\,transparent\)\] {
    background-color: var(--zml-state-accent);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab,var(--zml-state-accent) 8%,transparent);
    }
  }
  .bg-\[color-mix\(in_srgb\,var\(--calendar-tone\)_var\(--calendar-heat\)\,var\(--calendar-day-surface\)\)\] {
    background-color: var(--calendar-tone);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in srgb,var(--calendar-tone) var(--calendar-heat),var(--calendar-day-surface));
    }
  }
  .bg-\[color-mix\(in_srgb\,var\(--calendar-tone\)_var\(--calendar-heat\)\,var\(--work-surface\)\)\] {
    background-color: var(--calendar-tone);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in srgb,var(--calendar-tone) var(--calendar-heat),var(--work-surface));
    }
  }
  .bg-\[color-mix\(in_srgb\,var\(--foreground\)_6\%\,var\(--zml-table-surface\,var\(--work-surface\)\)\)\] {
    background-color: var(--foreground);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in srgb,var(--foreground) 6%,var(--zml-table-surface,var(--work-surface)));
    }
  }
  .bg-\[color-mix\(in_srgb\,var\(--foreground\)_10\%\,transparent\)\] {
    background-color: var(--foreground);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in srgb,var(--foreground) 10%,transparent);
    }
  }
  .bg-\[var\(--accent\)\] {
    background-color: var(--accent);
  }
  .bg-\[var\(--annotation-color\)\] {
    background-color: var(--annotation-color);
  }
  .bg-\[var\(--background\)\] {
    background-color: var(--background);
  }
  .bg-\[var\(--border\)\] {
    background-color: var(--border);
  }
  .bg-\[var\(--border-strong\)\] {
    background-color: var(--border-strong);
  }
  .bg-\[var\(--border-subtle\)\] {
    background-color: var(--border-subtle);
  }
  .bg-\[var\(--card\)\] {
    background-color: var(--card);
  }
  .bg-\[var\(--chart-brush-mask\)\] {
    background-color: var(--chart-brush-mask);
  }
  .bg-\[var\(--chart-brush-window\)\] {
    background-color: var(--chart-brush-window);
  }
  .bg-\[var\(--chart-composition-fee\)\] {
    background-color: var(--chart-composition-fee);
  }
  .bg-\[var\(--chart-composition-funding\)\] {
    background-color: var(--chart-composition-funding);
  }
  .bg-\[var\(--chart-composition-gross\)\] {
    background-color: var(--chart-composition-gross);
  }
  .bg-\[var\(--chart-composition-network\)\] {
    background-color: var(--chart-composition-network);
  }
  .bg-\[var\(--chart-composition-rebate\)\] {
    background-color: var(--chart-composition-rebate);
  }
  .bg-\[var\(--chart-series-reference\)\] {
    background-color: var(--chart-series-reference);
  }
  .bg-\[var\(--chart-zero-line\)\] {
    background-color: var(--chart-zero-line);
  }
  .bg-\[var\(--chip-surface\)\] {
    background-color: var(--chip-surface);
  }
  .bg-\[var\(--color-progress-danger\)\] {
    background-color: var(--color-progress-danger);
  }
  .bg-\[var\(--color-progress-primary\)\] {
    background-color: var(--color-progress-primary);
  }
  .bg-\[var\(--color-progress-warning\)\] {
    background-color: var(--color-progress-warning);
  }
  .bg-\[var\(--color-status-healthy\)\] {
    background-color: var(--color-status-healthy);
  }
  .bg-\[var\(--color-status-idle\)\] {
    background-color: var(--color-status-idle);
  }
  .bg-\[var\(--control-checked\)\] {
    background-color: var(--control-checked);
  }
  .bg-\[var\(--control-hover\)\] {
    background-color: var(--control-hover);
  }
  .bg-\[var\(--control-idle\)\] {
    background-color: var(--control-idle);
  }
  .bg-\[var\(--control-selected\)\] {
    background-color: var(--control-selected);
  }
  .bg-\[var\(--data-alert-color\)\] {
    background-color: var(--data-alert-color);
  }
  .bg-\[var\(--data-table-base\)\] {
    background-color: var(--data-table-base);
  }
  .bg-\[var\(--destructive-solid\)\] {
    background-color: var(--destructive-solid);
  }
  .bg-\[var\(--elevated\)\] {
    background-color: var(--elevated);
  }
  .bg-\[var\(--field\)\] {
    background-color: var(--field);
  }
  .bg-\[var\(--field-surface\)\] {
    background-color: var(--field-surface);
  }
  .bg-\[var\(--financial-negative\)\] {
    background-color: var(--financial-negative);
  }
  .bg-\[var\(--financial-positive\)\] {
    background-color: var(--financial-positive);
  }
  .bg-\[var\(--material-page\)\] {
    background-color: var(--material-page);
  }
  .bg-\[var\(--menu\)\] {
    background-color: var(--menu);
  }
  .bg-\[var\(--modal-scrim\)\] {
    background-color: var(--modal-scrim);
  }
  .bg-\[var\(--modal-surface\)\] {
    background-color: var(--modal-surface);
  }
  .bg-\[var\(--option-well\)\] {
    background-color: var(--option-well);
  }
  .bg-\[var\(--overlay-divider\)\] {
    background-color: var(--overlay-divider);
  }
  .bg-\[var\(--overlay-surface\)\] {
    background-color: var(--overlay-surface);
  }
  .bg-\[var\(--popover\)\] {
    background-color: var(--popover);
  }
  .bg-\[var\(--primary\)\] {
    background-color: var(--primary);
  }
  .bg-\[var\(--primary-foreground\)\] {
    background-color: var(--primary-foreground);
  }
  .bg-\[var\(--select-compact-list-surface\)\] {
    background-color: var(--select-compact-list-surface);
  }
  .bg-\[var\(--select-trigger-surface\,var\(--card\)\)\] {
    background-color: var(--select-trigger-surface,var(--card));
  }
  .bg-\[var\(--status-error\)\] {
    background-color: var(--status-error);
  }
  .bg-\[var\(--status-healthy\)\] {
    background-color: var(--status-healthy);
  }
  .bg-\[var\(--status-idle\)\] {
    background-color: var(--status-idle);
  }
  .bg-\[var\(--status-info\)\] {
    background-color: var(--status-info);
  }
  .bg-\[var\(--status-offline\)\] {
    background-color: var(--status-offline);
  }
  .bg-\[var\(--status-stale\)\] {
    background-color: var(--status-stale);
  }
  .bg-\[var\(--status-unknown\)\] {
    background-color: var(--status-unknown);
  }
  .bg-\[var\(--status-warning\)\] {
    background-color: var(--status-warning);
  }
  .bg-\[var\(--sub-surface\)\] {
    background-color: var(--sub-surface);
  }
  .bg-\[var\(--switch-track-off\)\] {
    background-color: var(--switch-track-off);
  }
  .bg-\[var\(--view-pill-rest\)\] {
    background-color: var(--view-pill-rest);
  }
  .bg-\[var\(--work-surface\)\] {
    background-color: var(--work-surface);
  }
  .bg-\[var\(--zml-checkbox-surface\)\] {
    background-color: var(--zml-checkbox-surface);
  }
  .bg-\[var\(--zml-table-surface\,var\(--background\)\)\] {
    background-color: var(--zml-table-surface,var(--background));
  }
  .bg-\[var\(--zml-table-surface\,var\(--chart-surface\)\)\] {
    background-color: var(--zml-table-surface,var(--chart-surface));
  }
  .bg-\[var\(--zml-table-surface\,var\(--work-surface\)\)\] {
    background-color: var(--zml-table-surface,var(--work-surface));
  }
  .bg-\[var\(--zml-table-surface\,…\)\] {
    background-color: var(--zml-table-surface,…);
  }
  .bg-emerald-500 {
    background-color: var(--color-emerald-500);
  }
  .bg-inherit {
    background-color: inherit;
  }
  .bg-transparent {
    background-color: transparent;
  }
  .bg-clip-padding {
    background-clip: padding-box;
  }
  .fill-current {
    fill: currentcolor;
  }
  .object-contain {
    object-fit: contain;
  }
  .p-0 {
    padding: 0px;
  }
  .p-0\.5 {
    padding: calc(var(--spacing) * 0.5);
  }
  .p-1\.5 {
    padding: calc(var(--spacing) * 1.5);
  }
  .p-2 {
    padding: calc(var(--spacing) * 2);
  }
  .p-2\.5 {
    padding: calc(var(--spacing) * 2.5);
  }
  .p-3 {
    padding: calc(var(--spacing) * 3);
  }
  .p-4 {
    padding: calc(var(--spacing) * 4);
  }
  .p-8 {
    padding: calc(var(--spacing) * 8);
  }
  .p-\[var\(--cell-inline\)\] {
    padding: var(--cell-inline);
  }
  .p-\[var\(--space-inline-standard\)\] {
    padding: var(--space-inline-standard);
  }
  .p-\[var\(--space-inline-wide\)\] {
    padding: var(--space-inline-wide);
  }
  .p-\[var\(--space-section-compact\)\] {
    padding: var(--space-section-compact);
  }
  .p-\[var\(--space-section-standard\)\] {
    padding: var(--space-section-standard);
  }
  .px-0 {
    padding-inline: 0px;
  }
  .px-0\.5 {
    padding-inline: calc(var(--spacing) * 0.5);
  }
  .px-1 {
    padding-inline: var(--spacing);
  }
  .px-1\.5 {
    padding-inline: calc(var(--spacing) * 1.5);
  }
  .px-2 {
    padding-inline: calc(var(--spacing) * 2);
  }
  .px-2\.5 {
    padding-inline: calc(var(--spacing) * 2.5);
  }
  .px-3 {
    padding-inline: calc(var(--spacing) * 3);
  }
  .px-3\.5 {
    padding-inline: calc(var(--spacing) * 3.5);
  }
  .px-4 {
    padding-inline: calc(var(--spacing) * 4);
  }
  .px-8 {
    padding-inline: calc(var(--spacing) * 8);
  }
  .px-\[2px\] {
    padding-inline: 2px;
  }
  .px-\[5px\] {
    padding-inline: 5px;
  }
  .px-\[6px\] {
    padding-inline: 6px;
  }
  .px-\[10px\] {
    padding-inline: 10px;
  }
  .px-\[14px\] {
    padding-inline: 14px;
  }
  .px-\[calc\(0\.5rem\+var\(--safe-area-left\)\)\] {
    padding-inline: calc(0.5rem + var(--safe-area-left));
  }
  .px-\[calc\(var\(--space-inline-standard\)\*2\)\] {
    padding-inline: calc(var(--space-inline-standard) * 2);
  }
  .px-\[var\(--cell-inline\)\] {
    padding-inline: var(--cell-inline);
  }
  .px-\[var\(--field-inline\)\] {
    padding-inline: var(--field-inline);
  }
  .px-\[var\(--space-inline-compact\)\] {
    padding-inline: var(--space-inline-compact);
  }
  .px-\[var\(--space-inline-standard\)\] {
    padding-inline: var(--space-inline-standard);
  }
  .px-\[var\(--space-inline-wide\)\] {
    padding-inline: var(--space-inline-wide);
  }
  .px-\[var\(--space-section-compact\)\] {
    padding-inline: var(--space-section-compact);
  }
  .px-\[var\(--space-section-standard\)\] {
    padding-inline: var(--space-section-standard);
  }
  .px-\[var\(--zml-cell-inline\)\] {
    padding-inline: var(--zml-cell-inline);
  }
  .px-\[var\(--zml-cell-inline\,var\(--cell-inline\)\)\] {
    padding-inline: var(--zml-cell-inline,var(--cell-inline));
  }
  .py-0 {
    padding-block: 0px;
  }
  .py-0\.5 {
    padding-block: calc(var(--spacing) * 0.5);
  }
  .py-1 {
    padding-block: var(--spacing);
  }
  .py-1\.5 {
    padding-block: calc(var(--spacing) * 1.5);
  }
  .py-2 {
    padding-block: calc(var(--spacing) * 2);
  }
  .py-2\.5 {
    padding-block: calc(var(--spacing) * 2.5);
  }
  .py-3 {
    padding-block: calc(var(--spacing) * 3);
  }
  .py-4 {
    padding-block: calc(var(--spacing) * 4);
  }
  .py-6 {
    padding-block: calc(var(--spacing) * 6);
  }
  .py-\[5px\] {
    padding-block: 5px;
  }
  .py-\[calc\(var\(--space-stack-compact\)\*1\.5\)\] {
    padding-block: calc(var(--space-stack-compact) * 1.5);
  }
  .py-\[var\(--space-inline-compact\)\] {
    padding-block: var(--space-inline-compact);
  }
  .py-\[var\(--space-inline-standard\)\] {
    padding-block: var(--space-inline-standard);
  }
  .py-\[var\(--space-inline-wide\)\] {
    padding-block: var(--space-inline-wide);
  }
  .py-\[var\(--space-section-standard\)\] {
    padding-block: var(--space-section-standard);
  }
  .py-\[var\(--space-stack-compact\)\] {
    padding-block: var(--space-stack-compact);
  }
  .py-\[var\(--space-stack-standard\)\] {
    padding-block: var(--space-stack-standard);
  }
  .py-px {
    padding-block: 1px;
  }
  .ps-1\.5 {
    padding-inline-start: calc(var(--spacing) * 1.5);
  }
  .ps-2 {
    padding-inline-start: calc(var(--spacing) * 2);
  }
  .ps-2\.5 {
    padding-inline-start: calc(var(--spacing) * 2.5);
  }
  .ps-3\.5 {
    padding-inline-start: calc(var(--spacing) * 3.5);
  }
  .ps-5 {
    padding-inline-start: calc(var(--spacing) * 5);
  }
  .ps-8 {
    padding-inline-start: calc(var(--spacing) * 8);
  }
  .ps-12 {
    padding-inline-start: calc(var(--spacing) * 12);
  }
  .ps-\[5px\] {
    padding-inline-start: 5px;
  }
  .ps-\[9px\] {
    padding-inline-start: 9px;
  }
  .ps-\[26px\] {
    padding-inline-start: 26px;
  }
  .ps-\[calc\(var\(--checkbox-size\)\+var\(--space-inline-compact\)\)\] {
    padding-inline-start: calc(var(--checkbox-size) + var(--space-inline-compact));
  }
  .ps-\[calc\(var\(--shell-bar-inset-start\)\+var\(--safe-area-left\)\)\] {
    padding-inline-start: calc(var(--shell-bar-inset-start) + var(--safe-area-left));
  }
  .ps-\[calc\(var\(--shell-navigation-inset\)\+env\(safe-area-inset-left\,0px\)\)\] {
    padding-inline-start: calc(var(--shell-navigation-inset) + env(safe-area-inset-left,0px));
  }
  .ps-\[calc\(var\(--space-inline-standard\)\*2\)\] {
    padding-inline-start: calc(var(--space-inline-standard) * 2);
  }
  .ps-\[calc\(var\(--space-section-compact\)\+env\(safe-area-inset-left\,0px\)\)\] {
    padding-inline-start: calc(var(--space-section-compact) + env(safe-area-inset-left,0px));
  }
  .ps-\[var\(--cell-inline\)\] {
    padding-inline-start: var(--cell-inline);
  }
  .ps-\[var\(--shell-bar-inset-start\)\] {
    padding-inline-start: var(--shell-bar-inset-start);
  }
  .ps-\[var\(--shell-navigation-inset\)\] {
    padding-inline-start: var(--shell-navigation-inset);
  }
  .ps-\[var\(--space-inline-compact\)\] {
    padding-inline-start: var(--space-inline-compact);
  }
  .ps-\[var\(--space-inline-standard\)\] {
    padding-inline-start: var(--space-inline-standard);
  }
  .ps-\[var\(--space-inline-wide\)\] {
    padding-inline-start: var(--space-inline-wide);
  }
  .ps-\[var\(--space-section-compact\)\] {
    padding-inline-start: var(--space-section-compact);
  }
  .ps-\[var\(--space-section-standard\)\] {
    padding-inline-start: var(--space-section-standard);
  }
  .ps-\[var\(--space-toolbar-quiet\)\] {
    padding-inline-start: var(--space-toolbar-quiet);
  }
  .ps-\[var\(--view-title-inset-start\)\] {
    padding-inline-start: var(--view-title-inset-start);
  }
  .pe-0\.5 {
    padding-inline-end: calc(var(--spacing) * 0.5);
  }
  .pe-1 {
    padding-inline-end: var(--spacing);
  }
  .pe-1\.5 {
    padding-inline-end: calc(var(--spacing) * 1.5);
  }
  .pe-2 {
    padding-inline-end: calc(var(--spacing) * 2);
  }
  .pe-2\.5 {
    padding-inline-end: calc(var(--spacing) * 2.5);
  }
  .pe-3 {
    padding-inline-end: calc(var(--spacing) * 3);
  }
  .pe-3\.5 {
    padding-inline-end: calc(var(--spacing) * 3.5);
  }
  .pe-7 {
    padding-inline-end: calc(var(--spacing) * 7);
  }
  .pe-8 {
    padding-inline-end: calc(var(--spacing) * 8);
  }
  .pe-\[9px\] {
    padding-inline-end: 9px;
  }
  .pe-\[18px\] {
    padding-inline-end: 18px;
  }
  .pe-\[25px\] {
    padding-inline-end: 25px;
  }
  .pe-\[calc\(var\(--shell-bar-inset-end\)\+var\(--safe-area-right\)\)\] {
    padding-inline-end: calc(var(--shell-bar-inset-end) + var(--safe-area-right));
  }
  .pe-\[calc\(var\(--space-section-compact\)\+env\(safe-area-inset-right\,0px\)\)\] {
    padding-inline-end: calc(var(--space-section-compact) + env(safe-area-inset-right,0px));
  }
  .pe-\[calc\(var\(--space-section-compact\)\+var\(--control-standard\)\)\] {
    padding-inline-end: calc(var(--space-section-compact) + var(--control-standard));
  }
  .pe-\[var\(--hit-plane-coarse\)\] {
    padding-inline-end: var(--hit-plane-coarse);
  }
  .pe-\[var\(--shell-bar-inset-end\)\] {
    padding-inline-end: var(--shell-bar-inset-end);
  }
  .pe-\[var\(--shell-navigation-inset\)\] {
    padding-inline-end: var(--shell-navigation-inset);
  }
  .pe-\[var\(--space-inline-standard\)\] {
    padding-inline-end: var(--space-inline-standard);
  }
  .pe-\[var\(--space-inline-wide\)\] {
    padding-inline-end: var(--space-inline-wide);
  }
  .pe-\[var\(--space-section-compact\)\] {
    padding-inline-end: var(--space-section-compact);
  }
  .pe-\[var\(--view-title-inset-end\)\] {
    padding-inline-end: var(--view-title-inset-end);
  }
  .pt-0 {
    padding-top: 0px;
  }
  .pt-0\.5 {
    padding-top: calc(var(--spacing) * 0.5);
  }
  .pt-1 {
    padding-top: var(--spacing);
  }
  .pt-2 {
    padding-top: calc(var(--spacing) * 2);
  }
  .pt-2\.5 {
    padding-top: calc(var(--spacing) * 2.5);
  }
  .pt-3 {
    padding-top: calc(var(--spacing) * 3);
  }
  .pt-8 {
    padding-top: calc(var(--spacing) * 8);
  }
  .pt-\[10px\] {
    padding-top: 10px;
  }
  .pt-\[51px\] {
    padding-top: 51px;
  }
  .pt-\[calc\(1rem\+var\(--safe-area-top\)\)\] {
    padding-top: calc(1rem + var(--safe-area-top));
  }
  .pt-\[calc\(var\(--page-padding\)\+var\(--safe-area-top\)\)\] {
    padding-top: calc(var(--page-padding) + var(--safe-area-top));
  }
  .pt-\[calc\(var\(--shell-wide-inset\)\+env\(safe-area-inset-top\,0px\)\)\] {
    padding-top: calc(var(--shell-wide-inset) + env(safe-area-inset-top,0px));
  }
  .pt-\[calc\(var\(--space-section-standard\)\+env\(safe-area-inset-top\,0px\)\)\] {
    padding-top: calc(var(--space-section-standard) + env(safe-area-inset-top,0px));
  }
  .pt-\[env\(safe-area-inset-top\,0px\)\] {
    padding-top: env(safe-area-inset-top,0px);
  }
  .pt-\[var\(--page-padding\)\] {
    padding-top: var(--page-padding);
  }
  .pt-\[var\(--safe-area-top\)\] {
    padding-top: var(--safe-area-top);
  }
  .pt-\[var\(--shell-wide-inset\)\] {
    padding-top: var(--shell-wide-inset);
  }
  .pt-\[var\(--space-confirmation-actions\)\] {
    padding-top: var(--space-confirmation-actions);
  }
  .pt-\[var\(--space-inline-standard\)\] {
    padding-top: var(--space-inline-standard);
  }
  .pt-\[var\(--space-inline-wide\)\] {
    padding-top: var(--space-inline-wide);
  }
  .pt-\[var\(--space-section-compact\)\] {
    padding-top: var(--space-section-compact);
  }
  .pt-\[var\(--space-stack-compact\)\] {
    padding-top: var(--space-stack-compact);
  }
  .pt-\[var\(--space-stack-standard\)\] {
    padding-top: var(--space-stack-standard);
  }
  .pr-1 {
    padding-right: var(--spacing);
  }
  .pr-8 {
    padding-right: calc(var(--spacing) * 8);
  }
  .pr-\[calc\(0\.5rem\+var\(--safe-area-right\)\)\] {
    padding-right: calc(0.5rem + var(--safe-area-right));
  }
  .pr-\[calc\(1rem\+var\(--safe-area-right\)\)\] {
    padding-right: calc(1rem + var(--safe-area-right));
  }
  .pr-\[calc\(var\(--page-padding\)\+var\(--safe-area-right\)\)\] {
    padding-right: calc(var(--page-padding) + var(--safe-area-right));
  }
  .pr-\[env\(safe-area-inset-right\,0px\)\] {
    padding-right: env(safe-area-inset-right,0px);
  }
  .pb-0 {
    padding-bottom: 0px;
  }
  .pb-1 {
    padding-bottom: var(--spacing);
  }
  .pb-1\.5 {
    padding-bottom: calc(var(--spacing) * 1.5);
  }
  .pb-2 {
    padding-bottom: calc(var(--spacing) * 2);
  }
  .pb-3 {
    padding-bottom: calc(var(--spacing) * 3);
  }
  .pb-4 {
    padding-bottom: calc(var(--spacing) * 4);
  }
  .pb-8 {
    padding-bottom: calc(var(--spacing) * 8);
  }
  .pb-\[2px\] {
    padding-bottom: 2px;
  }
  .pb-\[9px\] {
    padding-bottom: 9px;
  }
  .pb-\[10px\] {
    padding-bottom: 10px;
  }
  .pb-\[54px\] {
    padding-bottom: 54px;
  }
  .pb-\[calc\(1rem\+var\(--safe-area-bottom\)\)\] {
    padding-bottom: calc(1rem + var(--safe-area-bottom));
  }
  .pb-\[calc\(var\(--page-padding\)\+var\(--safe-area-bottom\)\)\] {
    padding-bottom: calc(var(--page-padding) + var(--safe-area-bottom));
  }
  .pb-\[calc\(var\(--shell-wide-inset\)\+env\(safe-area-inset-bottom\,0px\)\)\] {
    padding-bottom: calc(var(--shell-wide-inset) + env(safe-area-inset-bottom,0px));
  }
  .pb-\[calc\(var\(--space-section-compact\)\+var\(--overlay-keyboard-inset\,0px\)\)\] {
    padding-bottom: calc(var(--space-section-compact) + var(--overlay-keyboard-inset,0px));
  }
  .pb-\[calc\(var\(--space-section-standard\)\+env\(safe-area-inset-bottom\,0px\)\)\] {
    padding-bottom: calc(var(--space-section-standard) + env(safe-area-inset-bottom,0px));
  }
  .pb-\[env\(safe-area-inset-bottom\,0px\)\] {
    padding-bottom: env(safe-area-inset-bottom,0px);
  }
  .pb-\[var\(--overlay-keyboard-inset\,0px\)\] {
    padding-bottom: var(--overlay-keyboard-inset,0px);
  }
  .pb-\[var\(--shell-wide-inset\)\] {
    padding-bottom: var(--shell-wide-inset);
  }
  .pb-\[var\(--space-inline-compact\)\] {
    padding-bottom: var(--space-inline-compact);
  }
  .pb-\[var\(--space-inline-wide\)\] {
    padding-bottom: var(--space-inline-wide);
  }
  .pb-\[var\(--space-section-compact\)\] {
    padding-bottom: var(--space-section-compact);
  }
  .pb-\[var\(--space-section-standard\)\] {
    padding-bottom: var(--space-section-standard);
  }
  .pb-\[var\(--space-stack-compact\)\] {
    padding-bottom: var(--space-stack-compact);
  }
  .pb-\[var\(--space-stack-standard\)\] {
    padding-bottom: var(--space-stack-standard);
  }
  .pl-\[calc\(0\.5rem\+var\(--safe-area-left\)\)\] {
    padding-left: calc(0.5rem + var(--safe-area-left));
  }
  .pl-\[calc\(1rem\+var\(--safe-area-left\)\)\] {
    padding-left: calc(1rem + var(--safe-area-left));
  }
  .pl-\[calc\(var\(--page-padding\)\+var\(--safe-area-left\)\)\] {
    padding-left: calc(var(--page-padding) + var(--safe-area-left));
  }
  .pl-\[env\(safe-area-inset-left\,0px\)\] {
    padding-left: env(safe-area-inset-left,0px);
  }
  .text-center {
    text-align: center;
  }
  .text-end {
    text-align: end;
  }
  .text-start {
    text-align: start;
  }
  .\[vertical-align\:baseline\] {
    vertical-align: baseline;
  }
  .align-\[-1px\] {
    vertical-align: -1px;
  }
  .align-bottom {
    vertical-align: bottom;
  }
  .align-middle {
    vertical-align: middle;
  }
  .align-top {
    vertical-align: top;
  }
  .\[font-family\:var\(--font-sans\)\] {
    font-family: var(--font-sans);
  }
  .font-\[family-name\:var\(--font-mono\)\] {
    font-family: var(--font-mono);
  }
  .font-sans {
    font-family: var(--font-sans);
  }
  .\[font-feature-settings\:var\(--font-feature-numeric\)\] {
    font-feature-settings: var(--font-feature-numeric);
  }
  .text-3xl {
    font-size: var(--text-3xl);
    line-height: var(--tw-leading, var(--text-3xl--line-height));
  }
  .text-base {
    font-size: var(--text-base);
    line-height: var(--tw-leading, var(--text-base--line-height));
  }
  .\[font-size\:8px\] {
    font-size: 8px;
  }
  .\[font-size\:inherit\] {
    font-size: inherit;
  }
  .\[font-size\:var\(--type-article-body\)\] {
    font-size: var(--type-article-body);
  }
  .\[font-size\:var\(--type-auth-body\)\] {
    font-size: var(--type-auth-body);
  }
  .\[font-size\:var\(--type-auth-heading\)\] {
    font-size: var(--type-auth-heading);
  }
  .\[font-size\:var\(--type-body\)\] {
    font-size: var(--type-body);
  }
  .\[font-size\:var\(--type-button\)\] {
    font-size: var(--type-button);
  }
  .\[font-size\:var\(--type-control\)\] {
    font-size: var(--type-control);
  }
  .\[font-size\:var\(--type-heading-page\)\] {
    font-size: var(--type-heading-page);
  }
  .\[font-size\:var\(--type-heading-section\)\] {
    font-size: var(--type-heading-section);
  }
  .\[font-size\:var\(--type-menu-item\)\] {
    font-size: var(--type-menu-item);
  }
  .\[font-size\:var\(--type-metric-tile\)\] {
    font-size: var(--type-metric-tile);
  }
  .\[font-size\:var\(--type-micro\)\] {
    font-size: var(--type-micro);
  }
  .\[font-size\:var\(--type-micro\,11px\)\] {
    font-size: var(--type-micro,11px);
  }
  .\[font-size\:var\(--type-mono\)\] {
    font-size: var(--type-mono);
  }
  .\[font-size\:var\(--type-row-title\)\] {
    font-size: var(--type-row-title);
  }
  .\[font-size\:var\(--type-tooltip\)\] {
    font-size: var(--type-tooltip);
  }
  .\[font-size\:var\(--type-workbench-primary\)\] {
    font-size: var(--type-workbench-primary);
  }
  .\[font-size\:var\(--type-workbench-secondary\)\] {
    font-size: var(--type-workbench-secondary);
  }
  .text-\[6px\] {
    font-size: 6px;
  }
  .leading-\[1\.5em\] {
    --tw-leading: 1.5em;
    line-height: 1.5em;
  }
  .leading-\[var\(--type-article-body-line\)\] {
    --tw-leading: var(--type-article-body-line);
    line-height: var(--type-article-body-line);
  }
  .leading-\[var\(--type-auth-body-line\)\] {
    --tw-leading: var(--type-auth-body-line);
    line-height: var(--type-auth-body-line);
  }
  .leading-\[var\(--type-auth-heading-line\)\] {
    --tw-leading: var(--type-auth-heading-line);
    line-height: var(--type-auth-heading-line);
  }
  .leading-\[var\(--type-body-line\)\] {
    --tw-leading: var(--type-body-line);
    line-height: var(--type-body-line);
  }
  .leading-\[var\(--type-button-line\)\] {
    --tw-leading: var(--type-button-line);
    line-height: var(--type-button-line);
  }
  .leading-\[var\(--type-control-line\)\] {
    --tw-leading: var(--type-control-line);
    line-height: var(--type-control-line);
  }
  .leading-\[var\(--type-heading-page-line\)\] {
    --tw-leading: var(--type-heading-page-line);
    line-height: var(--type-heading-page-line);
  }
  .leading-\[var\(--type-heading-section-line\)\] {
    --tw-leading: var(--type-heading-section-line);
    line-height: var(--type-heading-section-line);
  }
  .leading-\[var\(--type-menu-item-line\)\] {
    --tw-leading: var(--type-menu-item-line);
    line-height: var(--type-menu-item-line);
  }
  .leading-\[var\(--type-menu-sub-indicator-line\)\] {
    --tw-leading: var(--type-menu-sub-indicator-line);
    line-height: var(--type-menu-sub-indicator-line);
  }
  .leading-\[var\(--type-metric-tile-line\)\] {
    --tw-leading: var(--type-metric-tile-line);
    line-height: var(--type-metric-tile-line);
  }
  .leading-\[var\(--type-micro-line\)\] {
    --tw-leading: var(--type-micro-line);
    line-height: var(--type-micro-line);
  }
  .leading-\[var\(--type-mono-line\)\] {
    --tw-leading: var(--type-mono-line);
    line-height: var(--type-mono-line);
  }
  .leading-\[var\(--type-row-title-line\)\] {
    --tw-leading: var(--type-row-title-line);
    line-height: var(--type-row-title-line);
  }
  .leading-\[var\(--type-tooltip-line\)\] {
    --tw-leading: var(--type-tooltip-line);
    line-height: var(--type-tooltip-line);
  }
  .leading-\[var\(--type-workbench-primary-line\)\] {
    --tw-leading: var(--type-workbench-primary-line);
    line-height: var(--type-workbench-primary-line);
  }
  .leading-\[var\(--type-workbench-secondary-line\)\] {
    --tw-leading: var(--type-workbench-secondary-line);
    line-height: var(--type-workbench-secondary-line);
  }
  .leading-none {
    --tw-leading: 1;
    line-height: 1;
  }
  .leading-normal {
    --tw-leading: var(--leading-normal);
    line-height: var(--leading-normal);
  }
  .font-medium {
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
  }
  .font-normal {
    --tw-font-weight: var(--font-weight-normal);
    font-weight: var(--font-weight-normal);
  }
  .font-semibold {
    --tw-font-weight: var(--font-weight-semibold);
    font-weight: var(--font-weight-semibold);
  }
  .\[font-weight\:var\(--font-weight-article-heading\)\] {
    font-weight: var(--font-weight-article-heading);
  }
  .\[font-weight\:var\(--font-weight-medium\)\] {
    font-weight: var(--font-weight-medium);
  }
  .\[font-weight\:var\(--font-weight-normal\)\] {
    font-weight: var(--font-weight-normal);
  }
  .\[font-weight\:var\(--font-weight-regular\)\] {
    font-weight: var(--font-weight-regular);
  }
  .\[font-weight\:var\(--font-weight-semibold\)\] {
    font-weight: var(--font-weight-semibold);
  }
  .tracking-tight {
    --tw-tracking: var(--tracking-tight);
    letter-spacing: var(--tracking-tight);
  }
  .tracking-wide {
    --tw-tracking: var(--tracking-wide);
    letter-spacing: var(--tracking-wide);
  }
  .\[letter-spacing\:var\(--tracking-body\)\] {
    letter-spacing: var(--tracking-body);
  }
  .\[letter-spacing\:var\(--tracking-heading\)\] {
    letter-spacing: var(--tracking-heading);
  }
  .\[overflow-wrap\:anywhere\] {
    overflow-wrap: anywhere;
  }
  .break-words {
    overflow-wrap: break-word;
  }
  .break-all {
    word-break: break-all;
  }
  .\[text-overflow\:clip\] {
    text-overflow: clip;
  }
  .text-ellipsis {
    text-overflow: ellipsis;
  }
  .hyphens-auto {
    -webkit-hyphens: auto;
    hyphens: auto;
  }
  .whitespace-normal {
    white-space: normal;
  }
  .whitespace-nowrap {
    white-space: nowrap;
  }
  .whitespace-pre {
    white-space: pre;
  }
  .whitespace-pre-line {
    white-space: pre-line;
  }
  .whitespace-pre-wrap {
    white-space: pre-wrap;
  }
  .tab-1 {
    tab-size: 1;
  }
  .text-\[var\(--annotation-color\)\] {
    color: var(--annotation-color);
  }
  .text-\[var\(--chart-axis-text\)\] {
    color: var(--chart-axis-text);
  }
  .text-\[var\(--chart-composition-fee\)\] {
    color: var(--chart-composition-fee);
  }
  .text-\[var\(--chart-composition-funding\)\] {
    color: var(--chart-composition-funding);
  }
  .text-\[var\(--chart-composition-gross\)\] {
    color: var(--chart-composition-gross);
  }
  .text-\[var\(--chart-composition-network\)\] {
    color: var(--chart-composition-network);
  }
  .text-\[var\(--chart-composition-rebate\)\] {
    color: var(--chart-composition-rebate);
  }
  .text-\[var\(--chart-series-reference\)\] {
    color: var(--chart-series-reference);
  }
  .text-\[var\(--destructive\)\] {
    color: var(--destructive);
  }
  .text-\[var\(--destructive-solid-foreground\)\] {
    color: var(--destructive-solid-foreground);
  }
  .text-\[var\(--disabled-foreground\)\] {
    color: var(--disabled-foreground);
  }
  .text-\[var\(--financial-negative\)\] {
    color: var(--financial-negative);
  }
  .text-\[var\(--financial-positive\)\] {
    color: var(--financial-positive);
  }
  .text-\[var\(--foreground\)\] {
    color: var(--foreground);
  }
  .text-\[var\(--invalid\)\] {
    color: var(--invalid);
  }
  .text-\[var\(--link-foreground\)\] {
    color: var(--link-foreground);
  }
  .text-\[var\(--menu-muted\)\] {
    color: var(--menu-muted);
  }
  .text-\[var\(--muted-foreground\)\] {
    color: var(--muted-foreground);
  }
  .text-\[var\(--overlay-foreground\)\] {
    color: var(--overlay-foreground);
  }
  .text-\[var\(--primary\)\] {
    color: var(--primary);
  }
  .text-\[var\(--primary-foreground\)\] {
    color: var(--primary-foreground);
  }
  .text-\[var\(--risk\)\] {
    color: var(--risk);
  }
  .text-\[var\(--secondary-foreground\)\] {
    color: var(--secondary-foreground);
  }
  .text-\[var\(--status-error\)\] {
    color: var(--status-error);
  }
  .text-\[var\(--status-healthy\)\] {
    color: var(--status-healthy);
  }
  .text-\[var\(--status-idle\)\] {
    color: var(--status-idle);
  }
  .text-\[var\(--status-info\)\] {
    color: var(--status-info);
  }
  .text-\[var\(--status-offline\)\] {
    color: var(--status-offline);
  }
  .text-\[var\(--status-stale\)\] {
    color: var(--status-stale);
  }
  .text-\[var\(--status-unknown\)\] {
    color: var(--status-unknown);
  }
  .text-\[var\(--status-warning\)\] {
    color: var(--status-warning);
  }
  .text-\[var\(--warning\)\] {
    color: var(--warning);
  }
  .text-\[var\(--work-surface\)\] {
    color: var(--work-surface);
  }
  .text-\[var\(--zml-notice-accent\)\] {
    color: var(--zml-notice-accent);
  }
  .text-\[var\(--zml-state-accent\)\] {
    color: var(--zml-state-accent);
  }
  .text-current {
    color: currentcolor;
  }
  .text-emerald-400 {
    color: var(--color-emerald-400);
  }
  .text-inherit {
    color: inherit;
  }
  .lowercase {
    text-transform: lowercase;
  }
  .uppercase {
    text-transform: uppercase;
  }
  .slashed-zero {
    --tw-slashed-zero: slashed-zero;
    font-variant-numeric: var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,);
  }
  .tabular-nums {
    --tw-numeric-spacing: tabular-nums;
    font-variant-numeric: var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,);
  }
  .\[font-variant-numeric\:tabular-nums\] {
    font-variant-numeric: tabular-nums;
  }
  .line-through {
    text-decoration-line: line-through;
  }
  .no-underline {
    text-decoration-line: none;
  }
  .underline {
    text-decoration-line: underline;
  }
  .\[text-decoration-thickness\:1px\] {
    text-decoration-thickness: 1px;
  }
  .underline-offset-2 {
    text-underline-offset: 2px;
  }
  .underline-offset-4 {
    text-underline-offset: 4px;
  }
  .caret-\[var\(--control-checked\)\] {
    caret-color: var(--control-checked);
  }
  .opacity-0 {
    opacity: 0%;
  }
  .opacity-50 {
    opacity: 50%;
  }
  .opacity-60 {
    opacity: 60%;
  }
  .opacity-70 {
    opacity: 70%;
  }
  .opacity-100 {
    opacity: 100%;
  }
  .opacity-\[var\(--opacity-refreshing\)\] {
    opacity: var(--opacity-refreshing);
  }
  .shadow {
    --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .shadow-\[var\(--shadow-dialog\)\] {
    --tw-shadow: var(--shadow-dialog);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .shadow-\[var\(--shadow-floating\)\] {
    --tw-shadow: var(--shadow-floating);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .shadow-\[var\(--shadow-main-surface\)\] {
    --tw-shadow: var(--shadow-main-surface);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .shadow-\[var\(--shadow-raised\)\] {
    --tw-shadow: var(--shadow-raised);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .shadow-none {
    --tw-shadow: 0 0 #0000;
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .ring {
    --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .ring-1 {
    --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .\[box-shadow\:0_0_0_2px_var\(--card\)\] {
    box-shadow: 0 0 0 2px var(--card);
  }
  .\[box-shadow\:var\(--shadow-hairline\)\] {
    box-shadow: var(--shadow-hairline);
  }
  .ring-\[var\(--border-strong\)\] {
    --tw-ring-color: var(--border-strong);
  }
  .ring-\[var\(--destructive\)\] {
    --tw-ring-color: var(--destructive);
  }
  .outline {
    outline-style: var(--tw-outline-style);
    outline-width: 1px;
  }
  .blur {
    --tw-blur: blur(8px);
    filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
  }
  .sepia {
    --tw-sepia: sepia(100%);
    filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
  }
  .\!filter {
    filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,) !important;
  }
  .filter {
    filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
  }
  .transition {
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }
  .transition-\[background-color\,border-color\,color\] {
    transition-property: background-color,border-color,color;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }
  .transition-\[background-color\,color\,border-color\] {
    transition-property: background-color,color,border-color;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }
  .transition-\[background-color\,color\] {
    transition-property: background-color,color;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }
  .transition-\[background-color\,opacity\] {
    transition-property: background-color,opacity;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }
  .transition-\[background-color\] {
    transition-property: background-color;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }
  .transition-\[border-color\,background-color\,box-shadow\] {
    transition-property: border-color,background-color,box-shadow;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }
  .transition-\[border-color\,background-color\,color\,opacity\] {
    transition-property: border-color,background-color,color,opacity;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }
  .transition-\[border-color\,background-color\] {
    transition-property: border-color,background-color;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }
  .transition-\[border-color\,color\,background-color\] {
    transition-property: border-color,color,background-color;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }
  .transition-\[border-color\] {
    transition-property: border-color;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }
  .transition-\[color\,background-color\,border-color\]\! {
    transition-property: color,background-color,border-color !important;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function)) !important;
    transition-duration: var(--tw-duration, var(--default-transition-duration)) !important;
  }
  .transition-\[color\,background-color\] {
    transition-property: color,background-color;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }
  .transition-\[color\,text-decoration-color\] {
    transition-property: color,text-decoration-color;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }
  .transition-\[color\] {
    transition-property: color;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }
  .transition-\[opacity\,scale\,width\] {
    transition-property: opacity,scale,width;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }
  .transition-\[opacity\,scale\] {
    transition-property: opacity,scale;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }
  .transition-\[opacity\,transform\] {
    transition-property: opacity,transform;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }
  .transition-\[opacity\,translate\] {
    transition-property: opacity,translate;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }
  .transition-\[opacity\] {
    transition-property: opacity;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }
  .transition-\[transform\,opacity\] {
    transition-property: transform,opacity;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }
  .transition-\[width\] {
    transition-property: width;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }
  .transition-opacity {
    transition-property: opacity;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }
  .transition-transform {
    transition-property: transform, translate, scale, rotate;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }
  .transition-none {
    transition-property: none;
  }
  .duration-0 {
    --tw-duration: 0ms;
    transition-duration: 0ms;
  }
  .duration-\[var\(--motion-checkbox\,var\(--motion-control\)\)\] {
    --tw-duration: var(--motion-checkbox,var(--motion-control));
    transition-duration: var(--motion-checkbox,var(--motion-control));
  }
  .duration-\[var\(--motion-control\)\] {
    --tw-duration: var(--motion-control);
    transition-duration: var(--motion-control);
  }
  .duration-\[var\(--motion-control\)\]\! {
    --tw-duration: var(--motion-control) !important;
    transition-duration: var(--motion-control) !important;
  }
  .duration-\[var\(--motion-dialog\)\] {
    --tw-duration: var(--motion-dialog);
    transition-duration: var(--motion-dialog);
  }
  .duration-\[var\(--motion-disclosure\)\] {
    --tw-duration: var(--motion-disclosure);
    transition-duration: var(--motion-disclosure);
  }
  .duration-\[var\(--motion-floating\)\] {
    --tw-duration: var(--motion-floating);
    transition-duration: var(--motion-floating);
  }
  .duration-\[var\(--motion-micro\)\] {
    --tw-duration: var(--motion-micro);
    transition-duration: var(--motion-micro);
  }
  .duration-\[var\(--motion-move\)\] {
    --tw-duration: var(--motion-move);
    transition-duration: var(--motion-move);
  }
  .duration-\[var\(--motion-out\)\] {
    --tw-duration: var(--motion-out);
    transition-duration: var(--motion-out);
  }
  .duration-\[var\(--motion-overlay\)\] {
    --tw-duration: var(--motion-overlay);
    transition-duration: var(--motion-overlay);
  }
  .duration-\[var\(--motion-panel\)\] {
    --tw-duration: var(--motion-panel);
    transition-duration: var(--motion-panel);
  }
  .duration-\[var\(--motion-swap\)\] {
    --tw-duration: var(--motion-swap);
    transition-duration: var(--motion-swap);
  }
  .duration-\[var\(--motion-switch\)\] {
    --tw-duration: var(--motion-switch);
    transition-duration: var(--motion-switch);
  }
  .duration-\[var\(--zml-checkbox-motion\)\] {
    --tw-duration: var(--zml-checkbox-motion);
    transition-duration: var(--zml-checkbox-motion);
  }
  .\[transition-duration\:var\(--motion-popup-enter\)\,var\(--motion-popup-scale\)\] {
    transition-duration: var(--motion-popup-enter),var(--motion-popup-scale);
  }
  .ease-\[var\(--ease-emphasized\)\] {
    --tw-ease: var(--ease-emphasized);
    transition-timing-function: var(--ease-emphasized);
  }
  .ease-\[var\(--ease-move\)\] {
    --tw-ease: var(--ease-move);
    transition-timing-function: var(--ease-move);
  }
  .ease-\[var\(--ease-standard\)\] {
    --tw-ease: var(--ease-standard);
    transition-timing-function: var(--ease-standard);
  }
  .ease-\[var\(--ease-standard\)\]\! {
    --tw-ease: var(--ease-standard) !important;
    transition-timing-function: var(--ease-standard) !important;
  }
  .ease-\[var\(--zml-checkbox-ease\)\] {
    --tw-ease: var(--zml-checkbox-ease);
    transition-timing-function: var(--zml-checkbox-ease);
  }
  .ease-out {
    --tw-ease: var(--ease-out);
    transition-timing-function: var(--ease-out);
  }
  .\[transition-timing-function\:var\(--ease-popup-enter\)\,var\(--ease-popup-scale-enter\)\] {
    transition-timing-function: var(--ease-popup-enter),var(--ease-popup-scale-enter);
  }
  .\[forced-color-adjust\:none\] {
    forced-color-adjust: none;
  }
  .outline-none {
    --tw-outline-style: none;
    outline-style: none;
  }
  .select-none {
    -webkit-user-select: none;
    user-select: none;
  }
  .select-text {
    -webkit-user-select: text;
    user-select: text;
  }
  .\[--calendar-day-surface\:var\(--row-fill-selected\)\] {
    --calendar-day-surface: var(--row-fill-selected);
  }
  .\[--calendar-day-surface\:var\(--sub-surface\)\] {
    --calendar-day-surface: var(--sub-surface);
  }
  .\[--calendar-day-surface\:var\(--work-surface\)\] {
    --calendar-day-surface: var(--work-surface);
  }
  .\[--chart-plot-height\:16rem\] {
    --chart-plot-height: 16rem;
  }
  .\[--chart-plot-height\:22rem\] {
    --chart-plot-height: 22rem;
  }
  .\[--data-table-base\:var\(--material-panel\)\] {
    --data-table-base: var(--material-panel);
  }
  .\[--data-table-base\:var\(--material-panel-muted\)\] {
    --data-table-base: var(--material-panel-muted);
  }
  .\[--data-table-base\:var\(--material-surface\)\] {
    --data-table-base: var(--material-surface);
  }
  .\[--data-table-base\:var\(--surface-fill\,var\(--material-surface\)\)\] {
    --data-table-base: var(--surface-fill,var(--material-surface));
  }
  .\[--field-message-slot\:block\] {
    --field-message-slot: block;
  }
  .\[--focus-offset-inset\:var\(--focus-offset-standalone\)\] {
    --focus-offset-inset: var(--focus-offset-standalone);
  }
  .\[--material-page\:var\(--material-surface\)\] {
    --material-page: var(--material-surface);
  }
  .\[--menu-item-hover\:var\(--select-compact-list-hover\)\] {
    --menu-item-hover: var(--select-compact-list-hover);
  }
  .\[--overlay-foreground\:var\(--secondary-foreground\)\] {
    --overlay-foreground: var(--secondary-foreground);
  }
  .\[--row-fill\:var\(--row-fill-current\)\] {
    --row-fill: var(--row-fill-current);
  }
  .\[--row-fill\:var\(--row-fill-hover\)\] {
    --row-fill: var(--row-fill-hover);
  }
  .\[--row-fill\:var\(--row-fill-selected\)\] {
    --row-fill: var(--row-fill-selected);
  }
  .\[--safe-area-left\:0px\] {
    --safe-area-left: 0px;
  }
  .\[--scroll-fade-stop-default\:var\(--data-table-base\)\] {
    --scroll-fade-stop-default: var(--data-table-base);
  }
  .\[--scroll-fade-stop-strong\:var\(--data-table-base\)\] {
    --scroll-fade-stop-strong: var(--data-table-base);
  }
  .\[--state-measure\:340px\] {
    --state-measure: 340px;
  }
  .\[--surface-fill\:var\(--background\)\] {
    --surface-fill: var(--background);
  }
  .\[--surface-fill\:var\(--card\)\] {
    --surface-fill: var(--card);
  }
  .\[--surface-fill\:var\(--overlay-surface\)\] {
    --surface-fill: var(--overlay-surface);
  }
  .\[--surface-fill\:var\(--popover\)\] {
    --surface-fill: var(--popover);
  }
  .\[--surface-fill\:var\(--sub-surface\)\] {
    --surface-fill: var(--sub-surface);
  }
  .\[--surface-fill\:var\(--work-surface\)\] {
    --surface-fill: var(--work-surface);
  }
  .\[--switch-pad\:var\(--switch-compact-pad\)\] {
    --switch-pad: var(--switch-compact-pad);
  }
  .\[--switch-thumb-size\:var\(--switch-compact-thumb\)\] {
    --switch-thumb-size: var(--switch-compact-thumb);
  }
  .\[--switch-track-h\:var\(--switch-compact-h\)\] {
    --switch-track-h: var(--switch-compact-h);
  }
  .\[--switch-track-w\:var\(--switch-compact-w\)\] {
    --switch-track-w: var(--switch-compact-w);
  }
  .\[--view-pill-rest\:var\(--tab-idle\)\] {
    --view-pill-rest: var(--tab-idle);
  }
  .\[--zml-button-hit-width\:max\(100\%\,var\(--hit-plane-coarse\)\)\] {
    --zml-button-hit-width: max(100%, var(--hit-plane-coarse));
  }
  .\[--zml-cell-block\:var\(--space-stack-compact\)\] {
    --zml-cell-block: var(--space-stack-compact);
  }
  .\[--zml-cell-block\:var\(--space-stack-standard\)\] {
    --zml-cell-block: var(--space-stack-standard);
  }
  .\[--zml-cell-inline\:var\(--cell-inline\)\] {
    --zml-cell-inline: var(--cell-inline);
  }
  .\[--zml-cell-inline\:var\(--cell-inline-dense\)\] {
    --zml-cell-inline: var(--cell-inline-dense);
  }
  .\[--zml-checkbox-border-checked-hover\:var\(--control-checked-hover\,var\(--primary-hover\)\)\] {
    --zml-checkbox-border-checked-hover: var(--control-checked-hover,var(--primary-hover));
  }
  .\[--zml-checkbox-border-hover\:var\(--control-checked-hover\,var\(--primary-hover\)\)\] {
    --zml-checkbox-border-hover: var(--control-checked-hover,var(--primary-hover));
  }
  .\[--zml-checkbox-border\:var\(--checkbox-border-standalone\,var\(--checkbox-border\,var\(--switch-track-off\)\)\)\] {
    --zml-checkbox-border: var(--checkbox-border-standalone,var(--checkbox-border,var(--switch-track-off)));
  }
  .\[--zml-checkbox-ease\:var\(--ease-emphasized\)\] {
    --zml-checkbox-ease: var(--ease-emphasized);
  }
  .\[--zml-checkbox-fill-hover\:var\(--control-checked\)\] {
    --zml-checkbox-fill-hover: var(--control-checked);
  }
  .\[--zml-checkbox-motion\:0s\] {
    --zml-checkbox-motion: 0s;
  }
  .\[--zml-checkbox-radius\:var\(--radius-checkbox\)\] {
    --zml-checkbox-radius: var(--radius-checkbox);
  }
  .\[--zml-checkbox-surface\:transparent\] {
    --zml-checkbox-surface: transparent;
  }
  .\[--zml-notice-accent\:var\(--muted-foreground\)\] {
    --zml-notice-accent: var(--muted-foreground);
  }
  .\[--zml-notice-accent\:var\(--status-error\)\] {
    --zml-notice-accent: var(--status-error);
  }
  .\[--zml-notice-accent\:var\(--status-healthy\)\] {
    --zml-notice-accent: var(--status-healthy);
  }
  .\[--zml-notice-accent\:var\(--status-info\)\] {
    --zml-notice-accent: var(--status-info);
  }
  .\[--zml-notice-accent\:var\(--status-warning\)\] {
    --zml-notice-accent: var(--status-warning);
  }
  .\[--zml-row-height\:var\(--row-compact-dual\)\] {
    --zml-row-height: var(--row-compact-dual);
  }
  .\[--zml-row-height\:var\(--row-compact-single\)\] {
    --zml-row-height: var(--row-compact-single);
  }
  .\[--zml-row-height\:var\(--row-dense-dual\)\] {
    --zml-row-height: var(--row-dense-dual);
  }
  .\[--zml-row-height\:var\(--row-dense-single\)\] {
    --zml-row-height: var(--row-dense-single);
  }
  .\[--zml-row-height\:var\(--row-inbox\)\] {
    --zml-row-height: var(--row-inbox);
  }
  .\[--zml-switch-thumb-stretch\:0px\] {
    --zml-switch-thumb-stretch: 0px;
  }
  .\[--zml-switch-thumb-stretch\:1px\] {
    --zml-switch-thumb-stretch: 1px;
  }
  .\[--zml-switch-thumb-stretch\:2px\] {
    --zml-switch-thumb-stretch: 2px;
  }
  .\[--zml-table-header\:var\(--table-header\)\] {
    --zml-table-header: var(--table-header);
  }
  .\[--zml-table-header\:var\(--table-header-compact\)\] {
    --zml-table-header: var(--table-header-compact);
  }
  .\[--zml-table-header\:var\(--table-header-dense\)\] {
    --zml-table-header: var(--table-header-dense);
  }
  .\[--zml-table-surface\:var\(--data-table-base\)\] {
    --zml-table-surface: var(--data-table-base);
  }
  .\[--zml-table-surface\:var\(--data-table-base\,transparent\)\] {
    --zml-table-surface: var(--data-table-base,transparent);
  }
  .\[--zml-table-surface\:var\(--material-panel-muted\)\] {
    --zml-table-surface: var(--material-panel-muted);
  }
  .\[--zml-table-surface\:var\(--modal-surface\)\] {
    --zml-table-surface: var(--modal-surface);
  }
  .\[--zml-table-surface\:var\(--overlay-surface\)\] {
    --zml-table-surface: var(--overlay-surface);
  }
  .\[--zml-table-surface\:var\(--work-surface\)\] {
    --zml-table-surface: var(--work-surface);
  }
  .\[--zml-toast-gap\:var\(--space-inline-wide\)\] {
    --zml-toast-gap: var(--space-inline-wide);
  }
  .\[--zml-toast-offset\:calc\(var\(--toast-offset-y\)\*-1\+var\(--toast-index\)\*var\(--zml-toast-gap\)\*-1\+var\(--toast-swipe-movement-y\)\)\] {
    --zml-toast-offset: calc(var(--toast-offset-y) * -1 + var(--toast-index) * var(--zml-toast-gap) * -1 + var(--toast-swipe-movement-y));
  }
  .\[--zml-toast-transform\:translateX\(var\(--toast-swipe-movement-x\)\)_translateY\(var\(--zml-toast-offset\)\)\] {
    --zml-toast-transform: translateX(var(--toast-swipe-movement-x)) translateY(var(--zml-toast-offset));
  }
  .\[-webkit-overflow-scrolling\:touch\] {
    -webkit-overflow-scrolling: touch;
  }
  .\[-webkit-text-security\:disc\] {
    -webkit-text-security: disc;
  }
  .\[border-bottom\:var\(--border-width-hairline\)_solid_var\(--zml-table-row-line\)\] {
    border-bottom: var(--border-width-hairline) solid var(--zml-table-row-line);
  }
  .\[direction\:ltr\] {
    direction: ltr;
  }
  .\[grid-area\:1\/1\] {
    grid-area: 1/1;
  }
  .\[text-shadow\:0_0_3px_var\(--card\)\] {
    text-shadow: 0 0 3px var(--card);
  }
  .\[transition\:left_var\(--motion-switch-thumb\)_var\(--ease-emphasized\)_0s\,right_var\(--motion-switch-thumb\)_var\(--ease-emphasized\)_var\(--motion-switch-thumb-delay\)\] {
    transition: left var(--motion-switch-thumb) var(--ease-emphasized) 0s,right var(--motion-switch-thumb) var(--ease-emphasized) var(--motion-switch-thumb-delay);
  }
  .\[transition\:none\] {
    transition: none;
  }
  .\[unicode-bidi\:isolate\] {
    unicode-bidi: isolate;
  }
  .ring-inset {
    --tw-ring-inset: inset;
  }
  .not-first\:ms-\[var\(--zml-filter-clause-stack-overlap\)\]:not(:first-child) {
    margin-inline-start: var(--zml-filter-clause-stack-overlap);
  }
  .group-open\/auth-recovery\:rotate-90:is(:where(.group\/auth-recovery):is([open], :popover-open, :open) *) {
    rotate: 90deg;
  }
  .group-open\/chart-data\:rotate-90:is(:where(.group\/chart-data):is([open], :popover-open, :open) *) {
    rotate: 90deg;
  }
  .group-open\/disclosure\:rotate-90:is(:where(.group\/disclosure):is([open], :popover-open, :open) *) {
    rotate: 90deg;
  }
  .group-open\/disclosure\:bg-\[var\(--control-current\)\]:is(:where(.group\/disclosure):is([open], :popover-open, :open) *) {
    background-color: var(--control-current);
  }
  .group-open\/disclosure\:text-\[var\(--foreground\)\]:is(:where(.group\/disclosure):is([open], :popover-open, :open) *) {
    color: var(--foreground);
  }
  .group-open\/record-disclosure\:rotate-90:is(:where(.group\/record-disclosure):is([open], :popover-open, :open) *) {
    rotate: 90deg;
  }
  .group-focus-within\/column-head\:opacity-100:is(:where(.group\/column-head):focus-within *) {
    opacity: 100%;
  }
  .group-focus-within\/row\:opacity-100:is(:where(.group\/row):focus-within *) {
    opacity: 100%;
  }
  @media (hover: hover) {
    .group-hover\/column-head\:text-\[var\(--foreground\)\]:is(:where(.group\/column-head):hover *) {
      color: var(--foreground);
    }
    .group-hover\/column-head\:opacity-100:is(:where(.group\/column-head):hover *) {
      opacity: 100%;
    }
    .group-hover\/column-head\:duration-\[var\(--motion-in\)\]:is(:where(.group\/column-head):hover *) {
      --tw-duration: var(--motion-in);
      transition-duration: var(--motion-in);
    }
    .group-hover\/column-sort\:opacity-100:is(:where(.group\/column-sort):hover *) {
      opacity: 100%;
    }
    .group-hover\/native-checkbox\:border-\[var\(--zml-checkbox-border-hover\)\]:is(:where(.group\/native-checkbox):hover *) {
      border-color: var(--zml-checkbox-border-hover);
    }
    .group-hover\/property-row\:bg-\[var\(--tab-hover\)\]:is(:where(.group\/property-row):hover *) {
      background-color: var(--tab-hover);
    }
    .group-hover\/resize\:bg-\[var\(--border-strong\)\]:is(:where(.group\/resize):hover *) {
      background-color: var(--border-strong);
    }
    .group-hover\/row\:opacity-100:is(:where(.group\/row):hover *) {
      opacity: 100%;
    }
    .group-hover\/source\:underline:is(:where(.group\/source):hover *) {
      text-decoration-line: underline;
    }
    .group-hover\/switch\:\[right\:calc\(100\%_-_var\(--switch-pad\)_-_var\(--switch-thumb-size\)_-_var\(--zml-switch-thumb-stretch\)\)\]:is(:where(.group\/switch):hover *) {
      right: calc(100% - var(--switch-pad) - var(--switch-thumb-size) - var(--zml-switch-thumb-stretch));
    }
    .group-hover\/view-pill\:text-\[var\(--secondary-foreground\)\]:is(:where(.group\/view-pill):hover *) {
      color: var(--secondary-foreground);
    }
    .group-hover\/view-pill\:duration-\[var\(--motion-in\)\]:is(:where(.group\/view-pill):hover *) {
      --tw-duration: var(--motion-in);
      transition-duration: var(--motion-in);
    }
  }
  .group-focus-visible\/column-sort\:opacity-100:is(:where(.group\/column-sort):focus-visible *) {
    opacity: 100%;
  }
  .group-focus-visible\/resize\:bg-\[var\(--primary\)\]:is(:where(.group\/resize):focus-visible *) {
    background-color: var(--primary);
  }
  .group-active\/switch\:\[right\:calc\(100\%_-_var\(--switch-pad\)_-_var\(--switch-thumb-size\)_-_var\(--zml-switch-thumb-stretch\)\)\]:is(:where(.group\/switch):active *) {
    right: calc(100% - var(--switch-pad) - var(--switch-thumb-size) - var(--zml-switch-thumb-stretch));
  }
  .group-active\/view-pill\:text-\[var\(--secondary-foreground\)\]:is(:where(.group\/view-pill):active *) {
    color: var(--secondary-foreground);
  }
  .group-active\/view-pill\:duration-\[var\(--motion-in\)\]:is(:where(.group\/view-pill):active *) {
    --tw-duration: var(--motion-in);
    transition-duration: var(--motion-in);
  }
  .group-has-\[\:is\(\:disabled\,\[data-disabled\]\)\]\/frame\:text-\[var\(--disabled-foreground\)\]:is(:where(.group\/frame):has(:is(:is(:disabled, [data-disabled]))) *) {
    color: var(--disabled-foreground);
  }
  .group-has-\[input\:focus-visible\]\/slider\:translate-y-0:is(:where(.group\/slider):has(:is(input:focus-visible)) *) {
    --tw-translate-y: 0px;
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }
  .group-has-\[input\:focus-visible\]\/slider\:opacity-100:is(:where(.group\/slider):has(:is(input:focus-visible)) *) {
    opacity: 100%;
  }
  .group-aria-expanded\/button\:rotate-180:is(:where(.group\/button)[aria-expanded="true"] *) {
    rotate: 180deg;
  }
  .group-aria-\[invalid\=true\]\/radio-group\:border-\[var\(--border-invalid\)\]:is(:where(.group\/radio-group)[aria-invalid="true"] *) {
    border-color: var(--border-invalid);
  }
  .group-data-checked\/menu-item\:border-\[var\(--control-checked\)\]:is(:where(.group\/menu-item)[data-checked] *) {
    border-color: var(--control-checked);
  }
  .group-data-checked\/menu-item\:bg-\[var\(--control-checked\)\]:is(:where(.group\/menu-item)[data-checked] *) {
    background-color: var(--control-checked);
  }
  .group-data-disabled\/frame\:text-\[var\(--disabled-foreground\)\]:is(:where(.group\/frame)[data-disabled] *) {
    color: var(--disabled-foreground);
  }
  .group-data-disabled\/menu-item\:border-\[var\(--border\)\]:is(:where(.group\/menu-item)[data-disabled] *) {
    border-color: var(--border);
  }
  .group-data-disabled\/radio\:bg-\[var\(--disabled-foreground\)\]:is(:where(.group\/radio)[data-disabled] *) {
    background-color: var(--disabled-foreground);
  }
  .group-data-highlighted\/filter-value\:opacity-100:is(:where(.group\/filter-value)[data-highlighted] *) {
    opacity: 100%;
  }
  .group-data-pending\/field\:cursor-progress:is(:where(.group\/field)[data-pending] *) {
    cursor: progress;
  }
  .group-data-\[body-scrolls\]\/dialog\:border-t:is(:where(.group\/dialog)[data-body-scrolls] *) {
    border-top-style: var(--tw-border-style);
    border-top-width: 1px;
  }
  .group-data-\[body-scrolls\]\/dialog\:border-b:is(:where(.group\/dialog)[data-body-scrolls] *) {
    border-bottom-style: var(--tw-border-style);
    border-bottom-width: 1px;
  }
  .group-data-\[body-scrolls\]\/dialog\:border-\[var\(--overlay-divider\)\]:is(:where(.group\/dialog)[data-body-scrolls] *) {
    border-color: var(--overlay-divider);
  }
  .group-data-\[density\=compact\]\/listbox\:min-h-\[var\(--select-option-compact\)\]:is(:where(.group\/listbox)[data-density="compact"] *) {
    min-height: var(--select-option-compact);
  }
  .group-data-\[density\=compact\]\/listbox\:ps-3:is(:where(.group\/listbox)[data-density="compact"] *) {
    padding-inline-start: calc(var(--spacing) * 3);
  }
  .group-data-\[density\=compact\]\/listbox\:pe-\[35px\]:is(:where(.group\/listbox)[data-density="compact"] *) {
    padding-inline-end: 35px;
  }
  .group-data-\[density\=compact\]\/listbox\:\[font-size\:var\(--type-button\)\]:is(:where(.group\/listbox)[data-density="compact"] *) {
    font-size: var(--type-button);
  }
  .group-data-\[density\=compact\]\/listbox\:leading-\[var\(--select-option-compact-line\)\]:is(:where(.group\/listbox)[data-density="compact"] *) {
    --tw-leading: var(--select-option-compact-line);
    line-height: var(--select-option-compact-line);
  }
  .group-data-\[dragging\]\/slider\:translate-y-0:is(:where(.group\/slider)[data-dragging] *) {
    --tw-translate-y: 0px;
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }
  .group-data-\[dragging\]\/slider\:border-\[var\(--control-checked-hover\)\]:is(:where(.group\/slider)[data-dragging] *) {
    border-color: var(--control-checked-hover);
  }
  .group-data-\[dragging\]\/slider\:opacity-100:is(:where(.group\/slider)[data-dragging] *) {
    opacity: 100%;
  }
  .group-data-\[dragging\]\/slider\:duration-\[var\(--motion-floating\)\]:is(:where(.group\/slider)[data-dragging] *) {
    --tw-duration: var(--motion-floating);
    transition-duration: var(--motion-floating);
  }
  .group-data-\[has-close\]\/dialog\:pe-\[calc\(var\(--space-section-standard\)\+var\(--control-standard\)\+var\(--space-inline-compact\)\)\]:is(:where(.group\/dialog)[data-has-close] *) {
    padding-inline-end: calc(var(--space-section-standard) + var(--control-standard) + var(--space-inline-compact));
  }
  .group-data-\[highlighted\=true\]\/day\:\[box-shadow\:inset_0_0_0_1px_var\(--border-strong\)\]:is(:where(.group\/day)[data-highlighted="true"] *) {
    box-shadow: inset 0 0 0 1px var(--border-strong);
  }
  .group-data-\[orientation\=vertical\]\/tabs\:h-fit:is(:where(.group\/tabs)[data-orientation="vertical"] *) {
    height: fit-content;
  }
  .group-data-\[orientation\=vertical\]\/tabs\:w-full:is(:where(.group\/tabs)[data-orientation="vertical"] *) {
    width: 100%;
  }
  .group-data-\[orientation\=vertical\]\/tabs\:flex-col:is(:where(.group\/tabs)[data-orientation="vertical"] *) {
    flex-direction: column;
  }
  .group-data-\[orientation\=vertical\]\/tabs\:items-stretch:is(:where(.group\/tabs)[data-orientation="vertical"] *) {
    align-items: stretch;
  }
  .group-data-\[orientation\=vertical\]\/tabs\:justify-start:is(:where(.group\/tabs)[data-orientation="vertical"] *) {
    justify-content: flex-start;
  }
  .group-data-\[orientation\=vertical\]\/tabs\:rounded-\[var\(--radius-control\)\]:is(:where(.group\/tabs)[data-orientation="vertical"] *) {
    border-radius: var(--radius-control);
  }
  .group-data-\[orientation\=vertical\]\/tabs\:border-0:is(:where(.group\/tabs)[data-orientation="vertical"] *) {
    border-style: var(--tw-border-style);
    border-width: 0px;
  }
  .group-data-\[orientation\=vertical\]\/tabs\:bg-clip-border:is(:where(.group\/tabs)[data-orientation="vertical"] *) {
    background-clip: border-box;
  }
  .group-data-\[orientation\=vertical\]\/tabs\:\[--view-pill-rest\:transparent\]:is(:where(.group\/tabs)[data-orientation="vertical"] *) {
    --view-pill-rest: transparent;
  }
  .group-data-\[panel-open\]\:rotate-90:is(:where(.group)[data-panel-open] *) {
    rotate: 90deg;
  }
  .group-data-\[resizing\]\/resize\:bg-\[var\(--primary\)\]:is(:where(.group\/resize)[data-resizing] *) {
    background-color: var(--primary);
  }
  .group-data-\[state\=current\]\/row\:opacity-100:is(:where(.group\/row)[data-state="current"] *) {
    opacity: 100%;
  }
  .group-data-\[state\=selected\]\/row\:opacity-100:is(:where(.group\/row)[data-state="selected"] *) {
    opacity: 100%;
  }
  .peer-checked\:border-\[var\(--control-checked\)\]:is(:where(.peer):checked ~ *) {
    border-color: var(--control-checked);
  }
  .peer-checked\:bg-\[var\(--control-checked\)\]:is(:where(.peer):checked ~ *) {
    background-color: var(--control-checked);
  }
  .peer-disabled\:border-\[var\(--border\)\]:is(:where(.peer):disabled ~ *) {
    border-color: var(--border);
  }
  .peer-disabled\:bg-\[var\(--sub-surface\)\]:is(:where(.peer):disabled ~ *) {
    background-color: var(--sub-surface);
  }
  .peer-disabled\:text-\[var\(--disabled-foreground\)\]:is(:where(.peer):disabled ~ *) {
    color: var(--disabled-foreground);
  }
  .file\:me-1\.5::file-selector-button {
    margin-inline-end: calc(var(--spacing) * 1.5);
  }
  .file\:inline-flex::file-selector-button {
    display: inline-flex;
  }
  .file\:h-6::file-selector-button {
    height: calc(var(--spacing) * 6);
  }
  .file\:border-0::file-selector-button {
    border-style: var(--tw-border-style);
    border-width: 0px;
  }
  .file\:bg-transparent::file-selector-button {
    background-color: transparent;
  }
  .file\:\[font-weight\:var\(--font-weight-medium\)\]::file-selector-button {
    font-weight: var(--font-weight-medium);
  }
  .file\:text-\[var\(--foreground\)\]::file-selector-button {
    color: var(--foreground);
  }
  .placeholder\:text-\[var\(--menu-muted\)\]::placeholder {
    color: var(--menu-muted);
  }
  .placeholder\:text-\[var\(--muted-foreground\)\]::placeholder {
    color: var(--muted-foreground);
  }
  .before\:pointer-events-none::before {
    content: var(--tw-content);
    pointer-events: none;
  }
  .before\:absolute::before {
    content: var(--tw-content);
    position: absolute;
  }
  .before\:-inset-1\.5::before {
    content: var(--tw-content);
    inset: calc(var(--spacing) * -1.5);
  }
  .before\:inset-0::before {
    content: var(--tw-content);
    inset: 0px;
  }
  .before\:inset-x-0::before {
    content: var(--tw-content);
    inset-inline: 0px;
  }
  .before\:inset-x-1\.5::before {
    content: var(--tw-content);
    inset-inline: calc(var(--spacing) * 1.5);
  }
  .before\:inset-x-\[var\(--space-inline-standard\)\]::before {
    content: var(--tw-content);
    inset-inline: var(--space-inline-standard);
  }
  .before\:-inset-y-\[5px\]::before {
    content: var(--tw-content);
    inset-block: calc(5px * -1);
  }
  .before\:inset-y-0::before {
    content: var(--tw-content);
    inset-block: 0px;
  }
  .before\:-z-10::before {
    content: var(--tw-content);
    z-index: calc(10 * -1);
  }
  .before\:rounded-\[inherit\]::before {
    content: var(--tw-content);
    border-radius: inherit;
  }
  .before\:rounded-\[var\(--radius-control\)\]::before {
    content: var(--tw-content);
    border-radius: var(--radius-control);
  }
  .before\:rounded-\[var\(--radius-pill\)\]::before {
    content: var(--tw-content);
    border-radius: var(--radius-pill);
  }
  .before\:bg-\[var\(--row-fill\,transparent\)\]::before {
    content: var(--tw-content);
    background-color: var(--row-fill,transparent);
  }
  .before\:bg-transparent::before {
    content: var(--tw-content);
    background-color: transparent;
  }
  .before\:shadow-\[var\(--shadow-hairline\)\,var\(--shadow-main-surface\)\]::before {
    content: var(--tw-content);
    --tw-shadow: var(--shadow-hairline), var(--shadow-main-surface);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .before\:shadow-\[var\(--shadow-raised\)\]::before {
    content: var(--tw-content);
    --tw-shadow: var(--shadow-raised);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .before\:shadow-none::before {
    content: var(--tw-content);
    --tw-shadow: 0 0 #0000;
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .before\:\[transition-property\:box-shadow\]::before {
    content: var(--tw-content);
    transition-property: box-shadow;
  }
  .before\:transition-none::before {
    content: var(--tw-content);
    transition-property: none;
  }
  .before\:\[transition-duration\:inherit\]::before {
    content: var(--tw-content);
    transition-duration: inherit;
  }
  .before\:\[transition-timing-function\:inherit\]::before {
    content: var(--tw-content);
    transition-timing-function: inherit;
  }
  .before\:content-\[\"\"\]::before {
    --tw-content: "";
    content: var(--tw-content);
  }
  .before\:content-\[\'\'\]::before {
    --tw-content: '';
    content: var(--tw-content);
  }
  .group-data-\[density\=compact\]\/listbox\:before\:inset-x-1:is(:where(.group\/listbox)[data-density="compact"] *)::before {
    content: var(--tw-content);
    inset-inline: var(--spacing);
  }
  .group-data-\[orientation\=vertical\]\/tabs\:before\:hidden:is(:where(.group\/tabs)[data-orientation="vertical"] *)::before {
    content: var(--tw-content);
    display: none;
  }
  .after\:pointer-events-none::after {
    content: var(--tw-content);
    pointer-events: none;
  }
  .after\:absolute::after {
    content: var(--tw-content);
    position: absolute;
  }
  .after\:-inset-\[0\.8125rem\]::after {
    content: var(--tw-content);
    inset: calc(0.8125rem * -1);
  }
  .after\:inset-0::after {
    content: var(--tw-content);
    inset: 0px;
  }
  .after\:start-0::after {
    content: var(--tw-content);
    inset-inline-start: calc(var(--spacing) * 0);
  }
  .after\:top-1\/2::after {
    content: var(--tw-content);
    top: calc(1 / 2 * 100%);
  }
  .after\:top-full::after {
    content: var(--tw-content);
    top: 100%;
  }
  .after\:left-1\/2::after {
    content: var(--tw-content);
    left: calc(1 / 2 * 100%);
  }
  .after\:h-\[calc\(var\(--zml-toast-gap\)\+1px\)\]::after {
    content: var(--tw-content);
    height: calc(var(--zml-toast-gap) + 1px);
  }
  .after\:h-\[var\(--hit-plane-coarse\)\]::after {
    content: var(--tw-content);
    height: var(--hit-plane-coarse);
  }
  .after\:w-\[var\(--zml-button-hit-width\,100\%\)\]::after {
    content: var(--tw-content);
    width: var(--zml-button-hit-width,100%);
  }
  .after\:w-full::after {
    content: var(--tw-content);
    width: 100%;
  }
  .after\:-translate-1\/2::after {
    content: var(--tw-content);
    --tw-translate-x: calc(calc(1 / 2 * 100%) * -1);
    --tw-translate-y: calc(calc(1 / 2 * 100%) * -1);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }
  .after\:rounded-\[inherit\]::after {
    content: var(--tw-content);
    border-radius: inherit;
  }
  .after\:border-\[0\.5px\]::after {
    content: var(--tw-content);
    border-style: var(--tw-border-style);
    border-width: 0.5px;
  }
  .after\:text-\[var\(--status-error\)\]::after {
    content: var(--tw-content);
    color: var(--status-error);
  }
  .after\:text-\[var\(--status-healthy\)\]::after {
    content: var(--tw-content);
    color: var(--status-healthy);
  }
  .after\:text-\[var\(--status-idle\)\]::after {
    content: var(--tw-content);
    color: var(--status-idle);
  }
  .after\:text-\[var\(--status-info\)\]::after {
    content: var(--tw-content);
    color: var(--status-info);
  }
  .after\:text-\[var\(--status-stale\)\]::after {
    content: var(--tw-content);
    color: var(--status-stale);
  }
  .after\:text-\[var\(--status-warning\)\]::after {
    content: var(--tw-content);
    color: var(--status-warning);
  }
  .after\:content-\[\"\"\]::after {
    --tw-content: "";
    content: var(--tw-content);
  }
  .first\:rounded-s-\[calc\(var\(--radius-control\)-0\.5px\)\]:first-child {
    border-start-start-radius: calc(var(--radius-control) - 0.5px);
    border-end-start-radius: calc(var(--radius-control) - 0.5px);
  }
  .first\:border-t-0:first-child {
    border-top-style: var(--tw-border-style);
    border-top-width: 0px;
  }
  .last\:mb-0:last-child {
    margin-bottom: 0px;
  }
  .last\:rounded-e-\[calc\(var\(--radius-control\)-0\.5px\)\]:last-child {
    border-start-end-radius: calc(var(--radius-control) - 0.5px);
    border-end-end-radius: calc(var(--radius-control) - 0.5px);
  }
  .last\:border-0:last-child {
    border-style: var(--tw-border-style);
    border-width: 0px;
  }
  .last\:border-e-0:last-child {
    border-inline-end-style: var(--tw-border-style);
    border-inline-end-width: 0px;
  }
  .last\:border-b-0:last-child {
    border-bottom-style: var(--tw-border-style);
    border-bottom-width: 0px;
  }
  .last\:pb-0:last-child {
    padding-bottom: 0px;
  }
  .last\:\[border-bottom\:0\]:last-child {
    border-bottom: 0;
  }
  .read-only\:cursor-default:read-only {
    cursor: default;
  }
  .empty\:hidden:empty {
    display: none;
  }
  @media (hover: hover) {
    .hover\:border-\[var\(--border-strong\)\]:hover {
      border-color: var(--border-strong);
    }
    .hover\:border-\[var\(--control-checked-hover\)\]:hover {
      border-color: var(--control-checked-hover);
    }
    .hover\:border-\[var\(--control-checked-hover\,var\(--primary-hover\)\)\]:hover {
      border-color: var(--control-checked-hover,var(--primary-hover));
    }
    .hover\:border-\[var\(--field-border-hover\)\]:hover {
      border-color: var(--field-border-hover);
    }
    .hover\:border-\[var\(--zml-checkbox-border-hover\)\]:hover {
      border-color: var(--zml-checkbox-border-hover);
    }
    .hover\:bg-\[var\(--chip-surface-hover\)\]:hover {
      background-color: var(--chip-surface-hover);
    }
    .hover\:bg-\[var\(--control-hover\)\]:hover {
      background-color: var(--control-hover);
    }
    .hover\:bg-\[var\(--control-selected\)\]:hover {
      background-color: var(--control-selected);
    }
    .hover\:bg-\[var\(--destructive-solid-hover\)\]:hover {
      background-color: var(--destructive-solid-hover);
    }
    .hover\:bg-\[var\(--destructive-wash\)\]:hover {
      background-color: var(--destructive-wash);
    }
    .hover\:bg-\[var\(--material-control-hover\)\]:hover {
      background-color: var(--material-control-hover);
    }
    .hover\:bg-\[var\(--option-well-hover\)\]:hover {
      background-color: var(--option-well-hover);
    }
    .hover\:bg-\[var\(--primary-hover\)\]:hover {
      background-color: var(--primary-hover);
    }
    .hover\:bg-\[var\(--rail-control-quiet-hover\)\]:hover {
      background-color: var(--rail-control-quiet-hover);
    }
    .hover\:bg-\[var\(--rail-item-hover\)\]:hover {
      background-color: var(--rail-item-hover);
    }
    .hover\:bg-\[var\(--row-fill-hover\)\]:hover {
      background-color: var(--row-fill-hover);
    }
    .hover\:bg-\[var\(--select-trigger-surface-hover\,var\(--control-hover\)\)\]:hover {
      background-color: var(--select-trigger-surface-hover,var(--control-hover));
    }
    .hover\:bg-\[var\(--select-well-hover\,var\(--option-well-hover\)\)\]:hover {
      background-color: var(--select-well-hover,var(--option-well-hover));
    }
    .hover\:bg-\[var\(--sub-surface\)\]:hover {
      background-color: var(--sub-surface);
    }
    .hover\:bg-\[var\(--switch-track-off-hover\,var\(--field-border-pressed\)\)\]:hover {
      background-color: var(--switch-track-off-hover,var(--field-border-pressed));
    }
    .hover\:bg-\[var\(--tab-hover\)\]:hover {
      background-color: var(--tab-hover);
    }
    .hover\:bg-transparent:hover {
      background-color: transparent;
    }
    .hover\:text-\[var\(--foreground\)\]:hover {
      color: var(--foreground);
    }
    .hover\:text-\[var\(--material-control-hover-text\)\]:hover {
      color: var(--material-control-hover-text);
    }
    .hover\:text-\[var\(--muted-foreground\)\]:hover {
      color: var(--muted-foreground);
    }
    .hover\:text-\[var\(--option-well-hover-foreground\)\]:hover {
      color: var(--option-well-hover-foreground);
    }
    .hover\:text-\[var\(--secondary-foreground\)\]:hover {
      color: var(--secondary-foreground);
    }
    .hover\:underline:hover {
      text-decoration-line: underline;
    }
    .hover\:\[text-decoration-color\:transparent\]:hover {
      text-decoration-color: transparent;
    }
    .hover\:shadow-none:hover {
      --tw-shadow: 0 0 #0000;
      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    }
    .hover\:\[box-shadow\:inset_0_0_0_1px_var\(--border-strong\)\]:hover {
      box-shadow: inset 0 0 0 1px var(--border-strong);
    }
    .hover\:ring-\[var\(--foreground\)\]:hover {
      --tw-ring-color: var(--foreground);
    }
    .hover\:duration-\[var\(--motion-in\)\]:hover {
      --tw-duration: var(--motion-in);
      transition-duration: var(--motion-in);
    }
    .hover\:duration-\[var\(--motion-instant\)\]:hover {
      --tw-duration: var(--motion-instant);
      transition-duration: var(--motion-instant);
    }
    .hover\:\[--motion-control\:var\(--motion-in\)\]:hover {
      --motion-control: var(--motion-in);
    }
    .hover\:\[--row-fill\:var\(--row-fill-hover\)\]:hover {
      --row-fill: var(--row-fill-hover);
    }
    .hover\:\[--row-fill\:var\(--row-fill-selected-hover\)\]:hover {
      --row-fill: var(--row-fill-selected-hover);
    }
    .group-open\/disclosure\:hover\:bg-\[var\(--control-hover\)\]:is(:where(.group\/disclosure):is([open], :popover-open, :open) *):hover {
      background-color: var(--control-hover);
    }
    .hover\:before\:shadow-\[var\(--shadow-hairline-hover\)\,var\(--shadow-main-surface\)\]:hover::before {
      content: var(--tw-content);
      --tw-shadow: var(--shadow-hairline-hover), var(--shadow-main-surface);
      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    }
    .hover\:before\:shadow-\[var\(--shadow-raised-hover\)\]:hover::before {
      content: var(--tw-content);
      --tw-shadow: var(--shadow-raised-hover);
      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    }
  }
  .focus\:not-sr-only:focus {
    position: static;
    width: auto;
    height: auto;
    padding: 0;
    margin: 0;
    overflow: visible;
    clip-path: none;
    white-space: normal;
  }
  .focus\:absolute:focus {
    position: absolute;
  }
  .focus\:fixed:focus {
    position: fixed;
  }
  .focus\:start-0:focus {
    inset-inline-start: calc(var(--spacing) * 0);
  }
  .focus\:top-1\/2:focus {
    top: calc(1 / 2 * 100%);
  }
  .focus\:top-\[calc\(8px\+env\(safe-area-inset-top\,0px\)\)\]:focus {
    top: calc(8px + env(safe-area-inset-top,0px));
  }
  .focus\:left-\[calc\(8px\+env\(safe-area-inset-left\,0px\)\)\]:focus {
    left: calc(8px + env(safe-area-inset-left,0px));
  }
  .focus\:z-\[var\(--z-floating\)\]:focus {
    z-index: var(--z-floating);
  }
  .focus\:z-\[var\(--z-skip-link\)\]:focus {
    z-index: var(--z-skip-link);
  }
  .focus\:inline-flex:focus {
    display: inline-flex;
  }
  .focus\:h-6:focus {
    height: calc(var(--spacing) * 6);
  }
  .focus\:h-\[var\(--control-form\)\]:focus {
    height: var(--control-form);
  }
  .focus\:w-6:focus {
    width: calc(var(--spacing) * 6);
  }
  .focus\:-translate-y-1\/2:focus {
    --tw-translate-y: calc(calc(1 / 2 * 100%) * -1);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }
  .focus\:items-center:focus {
    align-items: center;
  }
  .focus\:rounded-\[var\(--radius-control\)\]:focus {
    border-radius: var(--radius-control);
  }
  .focus\:rounded-full:focus {
    border-radius: calc(infinity * 1px);
  }
  .focus\:bg-\[var\(--primary\)\]:focus {
    background-color: var(--primary);
  }
  .focus\:bg-\[var\(--segmented-current\)\]:focus {
    background-color: var(--segmented-current);
  }
  .focus\:px-3:focus {
    padding-inline: calc(var(--spacing) * 3);
  }
  .focus\:text-\[var\(--primary-foreground\)\]:focus {
    color: var(--primary-foreground);
  }
  .focus\:\[outline\:var\(--focus-ring-outline\)\]:focus {
    outline: var(--focus-ring-outline);
  }
  .focus-visible\:border-\[var\(--primary\)\]:focus-visible {
    border-color: var(--primary);
  }
  .focus-visible\:bg-\[var\(--material-control-hover\)\]:focus-visible {
    background-color: var(--material-control-hover);
  }
  .focus-visible\:bg-\[var\(--row-fill-hover\)\]:focus-visible {
    background-color: var(--row-fill-hover);
  }
  .focus-visible\:text-\[var\(--material-control-hover-text\)\]:focus-visible {
    color: var(--material-control-hover-text);
  }
  .focus-visible\:\[outline\:var\(--focus-ring-outline\)\]:focus-visible {
    outline: var(--focus-ring-outline);
  }
  .focus-visible\:\[outline-offset\:-1px\]:focus-visible {
    outline-offset: -1px;
  }
  .focus-visible\:\[outline-offset\:var\(--focus-offset-clipped\)\]:focus-visible {
    outline-offset: var(--focus-offset-clipped);
  }
  .focus-visible\:outline-offset-\[var\(--focus-offset-clipped\)\]:focus-visible {
    outline-offset: var(--focus-offset-clipped);
  }
  .focus-visible\:outline-offset-\[var\(--focus-offset-inset\)\]:focus-visible {
    outline-offset: var(--focus-offset-inset);
  }
  .focus-visible\:outline-offset-\[var\(--focus-offset-standalone\)\]:focus-visible {
    outline-offset: var(--focus-offset-standalone);
  }
  .focus-visible\:outline-none\!:focus-visible {
    --tw-outline-style: none !important;
    outline-style: none !important;
  }
  .focus-visible\:\[--row-fill\:var\(--row-fill-hover\)\]:focus-visible {
    --row-fill: var(--row-fill-hover);
  }
  .focus-visible\:\[--row-fill\:var\(--row-fill-selected-hover\)\]:focus-visible {
    --row-fill: var(--row-fill-selected-hover);
  }
  .active\:border-\[var\(--border-strong\)\]:active {
    border-color: var(--border-strong);
  }
  .active\:border-\[var\(--control-checked-hover\)\]:active {
    border-color: var(--control-checked-hover);
  }
  .active\:border-\[var\(--field-border-hover\)\]:active {
    border-color: var(--field-border-hover);
  }
  .active\:bg-\[var\(--chip-surface-hover\)\]:active {
    background-color: var(--chip-surface-hover);
  }
  .active\:bg-\[var\(--control-hover\)\]:active {
    background-color: var(--control-hover);
  }
  .active\:bg-\[var\(--destructive-solid-hover\)\]:active {
    background-color: var(--destructive-solid-hover);
  }
  .active\:bg-\[var\(--destructive-wash\)\]:active {
    background-color: var(--destructive-wash);
  }
  .active\:bg-\[var\(--material-control-hover\)\]:active {
    background-color: var(--material-control-hover);
  }
  .active\:bg-\[var\(--option-well-hover\)\]:active {
    background-color: var(--option-well-hover);
  }
  .active\:bg-\[var\(--primary-hover\)\]:active {
    background-color: var(--primary-hover);
  }
  .active\:bg-\[var\(--rail-control-quiet-hover\)\]:active {
    background-color: var(--rail-control-quiet-hover);
  }
  .active\:bg-\[var\(--rail-item-hover\)\]:active {
    background-color: var(--rail-item-hover);
  }
  .active\:bg-\[var\(--select-trigger-surface-hover\,var\(--control-hover\)\)\]:active {
    background-color: var(--select-trigger-surface-hover,var(--control-hover));
  }
  .active\:bg-\[var\(--select-well-hover\,var\(--option-well-hover\)\)\]:active {
    background-color: var(--select-well-hover,var(--option-well-hover));
  }
  .active\:bg-\[var\(--tab-hover\)\]:active {
    background-color: var(--tab-hover);
  }
  .active\:bg-transparent:active {
    background-color: transparent;
  }
  .active\:text-\[var\(--foreground\)\]:active {
    color: var(--foreground);
  }
  .active\:text-\[var\(--material-control-hover-text\)\]:active {
    color: var(--material-control-hover-text);
  }
  .active\:text-\[var\(--muted-foreground\)\]:active {
    color: var(--muted-foreground);
  }
  .active\:text-\[var\(--option-well-hover-foreground\)\]:active {
    color: var(--option-well-hover-foreground);
  }
  .active\:text-\[var\(--secondary-foreground\)\]:active {
    color: var(--secondary-foreground);
  }
  .active\:duration-\[var\(--motion-in\)\]:active {
    --tw-duration: var(--motion-in);
    transition-duration: var(--motion-in);
  }
  .active\:duration-\[var\(--motion-instant\)\]:active {
    --tw-duration: var(--motion-instant);
    transition-duration: var(--motion-instant);
  }
  .active\:\[--motion-control\:var\(--motion-in\)\]:active {
    --motion-control: var(--motion-in);
  }
  .group-open\/disclosure\:active\:bg-\[var\(--control-hover\)\]:is(:where(.group\/disclosure):is([open], :popover-open, :open) *):active {
    background-color: var(--control-hover);
  }
  .active\:before\:bg-\[var\(--menu-item-hover\)\]:active::before {
    content: var(--tw-content);
    background-color: var(--menu-item-hover);
  }
  .active\:before\:shadow-\[var\(--shadow-hairline-hover\)\,var\(--shadow-main-surface\)\]:active::before {
    content: var(--tw-content);
    --tw-shadow: var(--shadow-hairline-hover), var(--shadow-main-surface);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .active\:before\:shadow-\[var\(--shadow-raised-hover\)\]:active::before {
    content: var(--tw-content);
    --tw-shadow: var(--shadow-raised-hover);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .disabled\:pointer-events-none:disabled {
    pointer-events: none;
  }
  .disabled\:cursor-not-allowed:disabled {
    cursor: not-allowed;
  }
  .disabled\:text-\[var\(--disabled-foreground\)\]:disabled {
    color: var(--disabled-foreground);
  }
  .disabled\:text-\[var\(--muted-foreground\)\]:disabled {
    color: var(--muted-foreground);
  }
  @media (hover: hover) {
    .disabled\:hover\:bg-transparent:disabled:hover {
      background-color: transparent;
    }
  }
  :where([data-pending]) .in-data-pending\:opacity-100 {
    opacity: 100%;
  }
  :where([data-saved]) .in-data-saved\:opacity-0 {
    opacity: 0%;
  }
  :where([data-saved]) .in-data-saved\:opacity-100 {
    opacity: 100%;
  }
  :where([data-edge-to-edge]) .in-data-\[edge-to-edge\]\:flex-1 {
    flex: 1;
  }
  :where([data-edge-to-edge]) .in-data-\[edge-to-edge\]\:overflow-y-auto {
    overflow-y: auto;
  }
  :where([data-edge-to-edge]) .in-data-\[edge-to-edge\]\:overscroll-contain {
    overscroll-behavior: contain;
  }
  :where([data-edge-to-edge]) .in-data-\[edge-to-edge\]\:border-t-\[0\.5px\] {
    border-top-style: var(--tw-border-style);
    border-top-width: 0.5px;
  }
  :where([data-edge-to-edge]) .in-data-\[edge-to-edge\]\:border-b-\[0\.5px\] {
    border-bottom-style: var(--tw-border-style);
    border-bottom-width: 0.5px;
  }
  :where([data-edge-to-edge]) .in-data-\[edge-to-edge\]\:border-\[var\(--overlay-divider\)\] {
    border-color: var(--overlay-divider);
  }
  :where([data-edge-to-edge]) .in-data-\[edge-to-edge\]\:px-4 {
    padding-inline: calc(var(--spacing) * 4);
  }
  :where([data-edge-to-edge]) .in-data-\[edge-to-edge\]\:py-2 {
    padding-block: calc(var(--spacing) * 2);
  }
  :where([data-edge-to-edge]) .in-data-\[edge-to-edge\]\:pe-2 {
    padding-inline-end: calc(var(--spacing) * 2);
  }
  :where([data-suppressed]) .in-data-\[suppressed\]\:pointer-events-none {
    pointer-events: none;
  }
  .has-focus-visible\:\[outline\:var\(--focus-ring-outline\)\]:has(:focus-visible) {
    outline: var(--focus-ring-outline);
  }
  .has-focus-visible\:\[outline-offset\:calc\(-1\*var\(--focus-ring-width\)\)\]:has(:focus-visible) {
    outline-offset: calc(-1 * var(--focus-ring-width));
  }
  .has-focus-visible\:\[outline-offset\:var\(--focus-offset-clipped\)\]:has(:focus-visible) {
    outline-offset: var(--focus-offset-clipped);
  }
  .has-focus-visible\:\[--motion-control\:var\(--motion-in\)\]:has(:focus-visible) {
    --motion-control: var(--motion-in);
  }
  .has-data-\[slot\=combobox-chip\]\:px-1:has([data-slot="combobox-chip"]) {
    padding-inline: var(--spacing);
  }
  .has-data-\[slot\=combobox-chip-remove\]\:pe-0\.5:has([data-slot="combobox-chip-remove"]) {
    padding-inline-end: calc(var(--spacing) * 0.5);
  }
  .has-\[\:checked\]\:opacity-100:has(:is(:checked)) {
    opacity: 100%;
  }
  .has-\[\:disabled\]\:pointer-events-none:has(:is(:disabled)) {
    pointer-events: none;
  }
  .has-\[\:is\(\:disabled\,\[data-disabled\]\)\]\:pointer-events-none:has(:is(:is(:disabled, [data-disabled]))) {
    pointer-events: none;
  }
  .has-\[\:is\(\:disabled\,\[data-disabled\]\)\]\:border-\[var\(--border\)\]:has(:is(:is(:disabled, [data-disabled]))) {
    border-color: var(--border);
  }
  .has-\[\:is\(\:disabled\,\[data-disabled\]\)\]\:bg-\[var\(--sub-surface\)\]:has(:is(:is(:disabled, [data-disabled]))) {
    background-color: var(--sub-surface);
  }
  .has-\[\:is\(\:disabled\,\[data-disabled\]\)\]\:text-\[var\(--disabled-foreground\)\]:has(:is(:is(:disabled, [data-disabled]))) {
    color: var(--disabled-foreground);
  }
  .has-\[\:is\(\[aria-invalid\=true\]\,\[data-invalid\]\)\]\:border-\[var\(--border-invalid\)\]:has(:is(:is([aria-invalid=true], [data-invalid]))) {
    border-color: var(--border-invalid);
  }
  .has-\[\:is\(\[aria-invalid\=true\]\,\[data-invalid\]\)\]\:\[--focus-ring-color\:var\(--invalid\)\]:has(:is(:is([aria-invalid=true], [data-invalid]))) {
    --focus-ring-color: var(--invalid);
  }
  @media (hover: hover) {
    .has-\[\:is\(\[aria-invalid\=true\]\,\[data-invalid\]\)\]\:hover\:border-\[var\(--border-invalid\)\]:has(:is(:is([aria-invalid=true], [data-invalid]))):hover {
      border-color: var(--border-invalid);
    }
  }
  .has-\[\:is\(input\,textarea\)\[readonly\]\]\:cursor-default:has(:is(:is(input, textarea)[readonly])) {
    cursor: default;
  }
  @media (hover: hover) {
    .has-\[\:is\(input\,textarea\)\[readonly\]\]\:hover\:border-\[var\(--input\)\]:has(:is(:is(input, textarea)[readonly])):hover {
      border-color: var(--input);
    }
  }
  .has-\[\:is\(input\,textarea\)\[readonly\]\]\:active\:border-\[var\(--input\)\]:has(:is(:is(input, textarea)[readonly])):active {
    border-color: var(--input);
  }
  .has-\[\[aria-current\=page\]\]\:bg-\[var\(--tab-current\)\]:has(:is([aria-current=page])) {
    background-color: var(--tab-current);
  }
  .has-\[\[aria-current\=page\]\]\:duration-\[var\(--motion-in\)\]:has(:is([aria-current=page])) {
    --tw-duration: var(--motion-in);
    transition-duration: var(--motion-in);
  }
  .has-\[\[aria-current\=page\]\]\:before\:shadow-\[0_0_0_0\.5px_var\(--chip-ring\)\]:has(:is([aria-current=page]))::before {
    content: var(--tw-content);
    --tw-shadow: 0 0 0 0.5px var(--tw-shadow-color, var(--chip-ring));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  @media (hover: hover) {
    .has-\[\[aria-current\=page\]\]\:hover\:bg-\[var\(--tab-current\)\]:has(:is([aria-current=page])):hover {
      background-color: var(--tab-current);
    }
    .has-\[\[aria-current\=page\]\]\:hover\:before\:shadow-\[0_0_0_0\.5px_var\(--chip-ring\)\]:has(:is([aria-current=page])):hover::before {
      content: var(--tw-content);
      --tw-shadow: 0 0 0 0.5px var(--tw-shadow-color, var(--chip-ring));
      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    }
  }
  .has-\[\[aria-current\=page\]\]\:active\:bg-\[var\(--tab-current\)\]:has(:is([aria-current=page])):active {
    background-color: var(--tab-current);
  }
  .has-\[\[aria-current\=page\]\]\:active\:before\:shadow-\[0_0_0_0\.5px_var\(--chip-ring\)\]:has(:is([aria-current=page])):active::before {
    content: var(--tw-content);
    --tw-shadow: 0 0 0 0.5px var(--tw-shadow-color, var(--chip-ring));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .has-\[…\]\:w-\[min\(560px\,…\)\]:has(:is(…)) {
    width: min(560px, …);
  }
  .has-\[\>\[data-slot\=field-content\]\]\:items-start:has( > [data-slot=field-content]) {
    align-items: flex-start;
  }
  .has-\[\>\[data-slot\=notice-actions\]\]\:grid-cols-\[auto_minmax\(0\,1fr\)_auto\]:has( > [data-slot=notice-actions]) {
    grid-template-columns: auto minmax(0,1fr) auto;
  }
  :where(.has-\[\>\[data-slot\=settings-row\]\]\:divide-\[var\(--settings-section-border\)\]:has( > [data-slot=settings-row]) > :not(:last-child)) {
    border-color: var(--settings-section-border);
  }
  .has-\[\>\[data-slot\=settings-row\]\]\:overflow-hidden:has( > [data-slot=settings-row]) {
    overflow: hidden;
  }
  .has-\[\>\[data-slot\=settings-row\]\]\:rounded-\[var\(--radius-section\)\]:has( > [data-slot=settings-row]) {
    border-radius: var(--radius-section);
  }
  .has-\[\>\[data-slot\=settings-row\]\]\:border:has( > [data-slot=settings-row]) {
    border-style: var(--tw-border-style);
    border-width: 1px;
  }
  .has-\[\>\[data-slot\=settings-row\]\]\:border-\[var\(--settings-section-border\)\]:has( > [data-slot=settings-row]) {
    border-color: var(--settings-section-border);
  }
  .has-\[\>\[data-slot\=settings-row\]\]\:bg-\[var\(--card\)\]:has( > [data-slot=settings-row]) {
    background-color: var(--card);
  }
  .has-\[\>\[data-slot\=settings-row\]\]\:shadow-\[var\(--shadow-main-surface\)\]:has( > [data-slot=settings-row]) {
    --tw-shadow: var(--shadow-main-surface);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .has-\[\>\[data-slot\=state-frame-actions\]\]\:grid-cols-\[auto_minmax\(0\,1fr\)_auto\]:has( > [data-slot=state-frame-actions]) {
    grid-template-columns: auto minmax(0,1fr) auto;
  }
  .has-\[\>\[data-slot\=state-frame-actions\]\]\:grid-cols-\[minmax\(0\,1fr\)_auto\]:has( > [data-slot=state-frame-actions]) {
    grid-template-columns: minmax(0,1fr) auto;
  }
  .has-\[\~\[data-slot\=field-error-slot\]\>\[data-slot\=field-error\]\]\:hidden:has( ~ [data-slot=field-error-slot] > [data-slot=field-error]) {
    display: none;
  }
  .aria-disabled\:pointer-events-none[aria-disabled="true"] {
    pointer-events: none;
  }
  .aria-disabled\:text-\[var\(--disabled-foreground\)\][aria-disabled="true"] {
    color: var(--disabled-foreground);
  }
  .aria-disabled\:opacity-60[aria-disabled="true"] {
    opacity: 60%;
  }
  .aria-expanded\:border-transparent[aria-expanded="true"] {
    border-color: transparent;
  }
  .aria-expanded\:bg-\[var\(--control-current\)\][aria-expanded="true"] {
    background-color: var(--control-current);
  }
  .aria-expanded\:text-\[var\(--foreground\)\][aria-expanded="true"] {
    color: var(--foreground);
  }
  @media (hover: hover) {
    .aria-expanded\:hover\:bg-\[var\(--control-hover\)\][aria-expanded="true"]:hover {
      background-color: var(--control-hover);
    }
  }
  .aria-expanded\:active\:bg-\[var\(--control-hover\)\][aria-expanded="true"]:active {
    background-color: var(--control-hover);
  }
  .aria-invalid\:border-\[length\:var\(--border-width-invalid\)\][aria-invalid="true"] {
    border-style: var(--tw-border-style);
    border-width: var(--border-width-invalid);
  }
  .aria-invalid\:border-\[var\(--border-invalid\)\][aria-invalid="true"] {
    border-color: var(--border-invalid);
  }
  .aria-invalid\:border-\[var\(--status-error\)\][aria-invalid="true"] {
    border-color: var(--status-error);
  }
  .aria-invalid\:\[--focus-ring-color\:var\(--invalid\)\][aria-invalid="true"] {
    --focus-ring-color: var(--invalid);
  }
  .aria-invalid\:before\:shadow-\[0_0_0_1px_var\(--border-invalid\)\][aria-invalid="true"]::before {
    content: var(--tw-content);
    --tw-shadow: 0 0 0 1px var(--tw-shadow-color, var(--border-invalid));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  @media (hover: hover) {
    .aria-invalid\:hover\:border-\[var\(--border-invalid\)\][aria-invalid="true"]:hover {
      border-color: var(--border-invalid);
    }
  }
  .aria-invalid\:active\:border-\[var\(--border-invalid\)\][aria-invalid="true"]:active {
    border-color: var(--border-invalid);
  }
  .aria-pressed\:border-\[var\(--border-strong\)\][aria-pressed="true"] {
    border-color: var(--border-strong);
  }
  .aria-pressed\:border-transparent[aria-pressed="true"] {
    border-color: transparent;
  }
  .aria-pressed\:bg-\[var\(--chip-surface-pressed\)\][aria-pressed="true"] {
    background-color: var(--chip-surface-pressed);
  }
  .aria-pressed\:bg-\[var\(--control-open\)\][aria-pressed="true"] {
    background-color: var(--control-open);
  }
  .aria-pressed\:bg-\[var\(--control-selected\)\][aria-pressed="true"] {
    background-color: var(--control-selected);
  }
  .aria-pressed\:bg-\[var\(--destructive-wash\)\][aria-pressed="true"] {
    background-color: var(--destructive-wash);
  }
  .aria-pressed\:bg-\[var\(--material-control-selected\)\][aria-pressed="true"] {
    background-color: var(--material-control-selected);
  }
  .aria-pressed\:bg-\[var\(--primary-hover\)\][aria-pressed="true"] {
    background-color: var(--primary-hover);
  }
  .aria-pressed\:bg-\[var\(--rail-control-idle\)\][aria-pressed="true"] {
    background-color: var(--rail-control-idle);
  }
  .aria-pressed\:text-\[var\(--foreground\)\][aria-pressed="true"] {
    color: var(--foreground);
  }
  .aria-pressed\:before\:shadow-\[var\(--shadow-hairline-hover\)\,var\(--shadow-main-surface\)\][aria-pressed="true"]::before {
    content: var(--tw-content);
    --tw-shadow: var(--shadow-hairline-hover), var(--shadow-main-surface);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  @media (hover: hover) {
    .aria-pressed\:hover\:bg-\[var\(--chip-surface-pressed\)\][aria-pressed="true"]:hover {
      background-color: var(--chip-surface-pressed);
    }
    .aria-pressed\:hover\:bg-\[var\(--control-open\)\][aria-pressed="true"]:hover {
      background-color: var(--control-open);
    }
    .aria-pressed\:hover\:bg-\[var\(--control-selected\)\][aria-pressed="true"]:hover {
      background-color: var(--control-selected);
    }
    .aria-pressed\:hover\:bg-\[var\(--material-control-selected-hover\)\][aria-pressed="true"]:hover {
      background-color: var(--material-control-selected-hover);
    }
    .aria-pressed\:hover\:bg-\[var\(--rail-control-hover\)\][aria-pressed="true"]:hover {
      background-color: var(--rail-control-hover);
    }
  }
  .aria-pressed\:active\:bg-\[var\(--chip-surface-pressed\)\][aria-pressed="true"]:active {
    background-color: var(--chip-surface-pressed);
  }
  .aria-pressed\:active\:bg-\[var\(--control-open\)\][aria-pressed="true"]:active {
    background-color: var(--control-open);
  }
  .aria-pressed\:active\:bg-\[var\(--control-selected\)\][aria-pressed="true"]:active {
    background-color: var(--control-selected);
  }
  .aria-pressed\:active\:bg-\[var\(--material-control-selected-hover\)\][aria-pressed="true"]:active {
    background-color: var(--material-control-selected-hover);
  }
  .aria-pressed\:active\:bg-\[var\(--rail-control-hover\)\][aria-pressed="true"]:active {
    background-color: var(--rail-control-hover);
  }
  .aria-\[current\=page\]\:bg-\[var\(--rail-item-current\)\][aria-current="page"] {
    background-color: var(--rail-item-current);
  }
  .aria-\[current\=page\]\:bg-\[var\(--tab-current\)\][aria-current="page"] {
    background-color: var(--tab-current);
  }
  .aria-\[current\=page\]\:text-\[var\(--foreground\)\][aria-current="page"] {
    color: var(--foreground);
  }
  .aria-\[current\=page\]\:duration-\[var\(--motion-in\)\][aria-current="page"] {
    --tw-duration: var(--motion-in);
    transition-duration: var(--motion-in);
  }
  @media (hover: hover) {
    .group-hover\/view-pill\:aria-\[current\=page\]\:text-\[var\(--foreground\)\]:is(:where(.group\/view-pill):hover *)[aria-current="page"] {
      color: var(--foreground);
    }
  }
  .group-active\/view-pill\:aria-\[current\=page\]\:text-\[var\(--foreground\)\]:is(:where(.group\/view-pill):active *)[aria-current="page"] {
    color: var(--foreground);
  }
  .aria-\[current\=page\]\:before\:bg-\[var\(--control-current\)\][aria-current="page"]::before {
    content: var(--tw-content);
    background-color: var(--control-current);
  }
  .aria-\[current\=page\]\:before\:shadow-\[0_0_0_0\.5px_var\(--chip-ring\)\][aria-current="page"]::before {
    content: var(--tw-content);
    --tw-shadow: 0 0 0 0.5px var(--tw-shadow-color, var(--chip-ring));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  @media (hover: hover) {
    .aria-\[current\=page\]\:hover\:bg-\[var\(--rail-item-current\)\][aria-current="page"]:hover {
      background-color: var(--rail-item-current);
    }
    .aria-\[current\=page\]\:hover\:bg-\[var\(--tab-current\)\][aria-current="page"]:hover {
      background-color: var(--tab-current);
    }
    .aria-\[current\=page\]\:hover\:text-\[var\(--foreground\)\][aria-current="page"]:hover {
      color: var(--foreground);
    }
    .aria-\[current\=page\]\:hover\:before\:shadow-\[0_0_0_0\.5px_var\(--chip-ring\)\][aria-current="page"]:hover::before {
      content: var(--tw-content);
      --tw-shadow: 0 0 0 0.5px var(--tw-shadow-color, var(--chip-ring));
      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    }
  }
  .aria-\[current\=page\]\:active\:bg-\[var\(--tab-current\)\][aria-current="page"]:active {
    background-color: var(--tab-current);
  }
  .aria-\[current\=page\]\:active\:text-\[var\(--foreground\)\][aria-current="page"]:active {
    color: var(--foreground);
  }
  .aria-\[current\=page\]\:active\:before\:shadow-\[0_0_0_0\.5px_var\(--chip-ring\)\][aria-current="page"]:active::before {
    content: var(--tw-content);
    --tw-shadow: 0 0 0 0.5px var(--tw-shadow-color, var(--chip-ring));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .data-active\:bg-\[var\(--tab-current\)\][data-active] {
    background-color: var(--tab-current);
  }
  .data-active\:text-\[var\(--foreground\)\][data-active] {
    color: var(--foreground);
  }
  .data-active\:duration-\[var\(--motion-in\)\][data-active] {
    --tw-duration: var(--motion-in);
    transition-duration: var(--motion-in);
  }
  .data-active\:before\:shadow-\[0_0_0_0\.5px_var\(--chip-ring\)\][data-active]::before {
    content: var(--tw-content);
    --tw-shadow: 0 0 0 0.5px var(--tw-shadow-color, var(--chip-ring));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  @media (hover: hover) {
    .data-active\:hover\:bg-\[var\(--tab-current\)\][data-active]:hover {
      background-color: var(--tab-current);
    }
    .data-active\:hover\:text-\[var\(--foreground\)\][data-active]:hover {
      color: var(--foreground);
    }
    .data-active\:hover\:before\:shadow-\[0_0_0_0\.5px_var\(--chip-ring\)\][data-active]:hover::before {
      content: var(--tw-content);
      --tw-shadow: 0 0 0 0.5px var(--tw-shadow-color, var(--chip-ring));
      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    }
  }
  .data-active\:active\:bg-\[var\(--tab-current\)\][data-active]:active {
    background-color: var(--tab-current);
  }
  .data-active\:active\:text-\[var\(--foreground\)\][data-active]:active {
    color: var(--foreground);
  }
  .data-active\:active\:before\:shadow-\[0_0_0_0\.5px_var\(--chip-ring\)\][data-active]:active::before {
    content: var(--tw-content);
    --tw-shadow: 0 0 0 0.5px var(--tw-shadow-color, var(--chip-ring));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .data-busy\:cursor-progress[data-busy] {
    cursor: progress;
  }
  .data-checked\:\[right\:var\(--switch-pad\)\][data-checked] {
    right: var(--switch-pad);
  }
  .data-checked\:\[left\:calc\(100\%_-_var\(--switch-pad\)_-_var\(--switch-thumb-size\)\)\][data-checked] {
    left: calc(100% - var(--switch-pad) - var(--switch-thumb-size));
  }
  .data-checked\:border-\[var\(--control-checked\)\][data-checked] {
    border-color: var(--control-checked);
  }
  .data-checked\:bg-\[var\(--control-checked\)\][data-checked] {
    background-color: var(--control-checked);
  }
  .data-checked\:bg-\[var\(--segmented-option-current\)\][data-checked] {
    background-color: var(--segmented-option-current);
  }
  .data-checked\:text-\[var\(--foreground\)\][data-checked] {
    color: var(--foreground);
  }
  .data-checked\:opacity-100[data-checked] {
    opacity: 100%;
  }
  .data-checked\:\[--zml-checkbox-motion\:var\(--motion-checkbox\,var\(--motion-control\)\)\][data-checked] {
    --zml-checkbox-motion: var(--motion-checkbox,var(--motion-control));
  }
  .data-checked\:\[transition\:left_var\(--motion-switch-thumb\)_var\(--ease-emphasized\)_var\(--motion-switch-thumb-delay\)\,right_var\(--motion-switch-thumb\)_var\(--ease-emphasized\)_0s\][data-checked] {
    transition: left var(--motion-switch-thumb) var(--ease-emphasized) var(--motion-switch-thumb-delay),right var(--motion-switch-thumb) var(--ease-emphasized) 0s;
  }
  .data-checked\:\[transition\:none\][data-checked] {
    transition: none;
  }
  @media (hover: hover) {
    .group-hover\/switch\:data-checked\:\[right\:var\(--switch-pad\)\]:is(:where(.group\/switch):hover *)[data-checked] {
      right: var(--switch-pad);
    }
    .group-hover\/switch\:data-checked\:\[left\:calc\(100\%_-_var\(--switch-pad\)_-_var\(--switch-thumb-size\)_-_var\(--zml-switch-thumb-stretch\)\)\]:is(:where(.group\/switch):hover *)[data-checked] {
      left: calc(100% - var(--switch-pad) - var(--switch-thumb-size) - var(--zml-switch-thumb-stretch));
    }
  }
  .group-active\/switch\:data-checked\:\[right\:var\(--switch-pad\)\]:is(:where(.group\/switch):active *)[data-checked] {
    right: var(--switch-pad);
  }
  .group-active\/switch\:data-checked\:\[left\:calc\(100\%_-_var\(--switch-pad\)_-_var\(--switch-thumb-size\)_-_var\(--zml-switch-thumb-stretch\)\)\]:is(:where(.group\/switch):active *)[data-checked] {
    left: calc(100% - var(--switch-pad) - var(--switch-thumb-size) - var(--zml-switch-thumb-stretch));
  }
  .data-checked\:before\:shadow-\[var\(--shadow-hairline-hover\)\][data-checked]::before {
    content: var(--tw-content);
    --tw-shadow: var(--shadow-hairline-hover);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  @media (hover: hover) {
    .data-checked\:hover\:border-\[var\(--control-checked-hover\,var\(--primary-hover\)\)\][data-checked]:hover {
      border-color: var(--control-checked-hover,var(--primary-hover));
    }
    .data-checked\:hover\:border-\[var\(--zml-checkbox-border-checked-hover\)\][data-checked]:hover {
      border-color: var(--zml-checkbox-border-checked-hover);
    }
    .data-checked\:hover\:bg-\[var\(--segmented-option-current\)\][data-checked]:hover {
      background-color: var(--segmented-option-current);
    }
    .data-checked\:hover\:bg-\[var\(--switch-track-on-hover\,var\(--control-checked-hover\,var\(--primary-hover\)\)\)\][data-checked]:hover {
      background-color: var(--switch-track-on-hover,var(--control-checked-hover,var(--primary-hover)));
    }
    .data-checked\:hover\:bg-\[var\(--zml-checkbox-fill-hover\)\][data-checked]:hover {
      background-color: var(--zml-checkbox-fill-hover);
    }
    .data-checked\:hover\:text-\[var\(--foreground\)\][data-checked]:hover {
      color: var(--foreground);
    }
    .data-checked\:hover\:before\:shadow-\[var\(--shadow-hairline-hover\)\][data-checked]:hover::before {
      content: var(--tw-content);
      --tw-shadow: var(--shadow-hairline-hover);
      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    }
  }
  .data-checked\:active\:bg-\[var\(--segmented-option-current\)\][data-checked]:active {
    background-color: var(--segmented-option-current);
  }
  .data-checked\:active\:text-\[var\(--foreground\)\][data-checked]:active {
    color: var(--foreground);
  }
  .data-checked\:active\:before\:shadow-\[var\(--shadow-hairline-hover\)\][data-checked]:active::before {
    content: var(--tw-content);
    --tw-shadow: var(--shadow-hairline-hover);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .data-closed\:overflow-hidden[data-closed] {
    overflow: hidden;
  }
  .data-disabled\:pointer-events-none[data-disabled] {
    pointer-events: none;
  }
  .data-disabled\:cursor-not-allowed[data-disabled] {
    cursor: not-allowed;
  }
  .data-disabled\:border-\[var\(--border\)\][data-disabled] {
    border-color: var(--border);
  }
  .data-disabled\:bg-\[var\(--sub-surface\)\][data-disabled] {
    background-color: var(--sub-surface);
  }
  .data-disabled\:text-\[var\(--disabled-foreground\)\][data-disabled] {
    color: var(--disabled-foreground);
  }
  .data-disabled\:opacity-50[data-disabled] {
    opacity: 50%;
  }
  .data-disabled\:shadow-none[data-disabled] {
    --tw-shadow: 0 0 #0000;
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .data-disabled\:not-data-busy\:cursor-default[data-disabled]:not([data-busy]) {
    cursor: default;
  }
  .data-disabled\:not-data-pending\:pointer-events-none[data-disabled]:not([data-pending]) {
    pointer-events: none;
  }
  .data-disabled\:not-data-pending\:opacity-50[data-disabled]:not([data-pending]) {
    opacity: 50%;
  }
  .data-disabled\:not-data-busy\:not-data-saved\:opacity-60[data-disabled]:not([data-busy]):not([data-saved]) {
    opacity: 60%;
  }
  .data-disabled\:before\:shadow-none[data-disabled]::before {
    content: var(--tw-content);
    --tw-shadow: 0 0 #0000;
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .data-dragging\:\[box-shadow\:var\(--shadow-floating\)\][data-dragging] {
    box-shadow: var(--shadow-floating);
  }
  .data-empty\:hidden[data-empty] {
    display: none;
  }
  .data-ending-style\:-translate-x-\[var\(--motion-panel-offset\)\][data-ending-style] {
    --tw-translate-x: calc(var(--motion-panel-offset) * -1);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }
  .data-ending-style\:translate-x-\[var\(--motion-panel-offset\)\][data-ending-style] {
    --tw-translate-x: var(--motion-panel-offset);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }
  .data-ending-style\:scale-\[var\(--motion-dialog-scale-from\)\][data-ending-style] {
    scale: var(--motion-dialog-scale-from);
  }
  .data-ending-style\:\[transform\:scale\(var\(--motion-overlay-scale-from\)\)\][data-ending-style] {
    transform: scale(var(--motion-overlay-scale-from));
  }
  .data-ending-style\:opacity-0[data-ending-style] {
    opacity: 0%;
  }
  .data-ending-style\:duration-\[var\(--motion-floating\)\][data-ending-style] {
    --tw-duration: var(--motion-floating);
    transition-duration: var(--motion-floating);
  }
  .data-ending-style\:duration-\[var\(--motion-overlay-exit\)\][data-ending-style] {
    --tw-duration: var(--motion-overlay-exit);
    transition-duration: var(--motion-overlay-exit);
  }
  .data-ending-style\:\[transition-duration\:var\(--motion-popup-exit\)\,var\(--motion-popup-scale\)\][data-ending-style] {
    transition-duration: var(--motion-popup-exit),var(--motion-popup-scale);
  }
  .data-ending-style\:ease-\[var\(--ease-emphasized\)\][data-ending-style] {
    --tw-ease: var(--ease-emphasized);
    transition-timing-function: var(--ease-emphasized);
  }
  .data-ending-style\:\[transition-timing-function\:var\(--ease-popup-exit\)\,var\(--ease-popup-scale-exit\)\][data-ending-style] {
    transition-timing-function: var(--ease-popup-exit),var(--ease-popup-scale-exit);
  }
  .data-highlighted\:text-\[var\(--foreground\)\][data-highlighted] {
    color: var(--foreground);
  }
  .data-highlighted\:before\:bg-\[var\(--menu-item-hover\)\][data-highlighted]::before {
    content: var(--tw-content);
    background-color: var(--menu-item-hover);
  }
  .aria-\[current\=page\]\:data-highlighted\:before\:bg-\[var\(--control-current\)\][aria-current="page"][data-highlighted]::before {
    content: var(--tw-content);
    background-color: var(--control-current);
  }
  .data-disabled\:data-highlighted\:text-\[var\(--disabled-foreground\)\][data-disabled][data-highlighted] {
    color: var(--disabled-foreground);
  }
  .data-indeterminate\:border-\[var\(--control-checked\)\][data-indeterminate] {
    border-color: var(--control-checked);
  }
  .data-indeterminate\:bg-\[var\(--control-checked\)\][data-indeterminate] {
    background-color: var(--control-checked);
  }
  .data-indeterminate\:\[--zml-checkbox-motion\:var\(--motion-checkbox\,var\(--motion-control\)\)\][data-indeterminate] {
    --zml-checkbox-motion: var(--motion-checkbox,var(--motion-control));
  }
  @media (hover: hover) {
    .data-indeterminate\:hover\:border-\[var\(--zml-checkbox-border-checked-hover\)\][data-indeterminate]:hover {
      border-color: var(--zml-checkbox-border-checked-hover);
    }
    .data-indeterminate\:hover\:bg-\[var\(--zml-checkbox-fill-hover\)\][data-indeterminate]:hover {
      background-color: var(--zml-checkbox-fill-hover);
    }
  }
  .data-instant\:transition-none[data-instant] {
    transition-property: none;
  }
  .data-invalid\:border-\[var\(--border-invalid\)\][data-invalid] {
    border-color: var(--border-invalid);
  }
  .data-invalid\:\[--focus-ring-color\:var\(--invalid\)\][data-invalid] {
    --focus-ring-color: var(--invalid);
  }
  .data-invalid\:before\:shadow-\[0_0_0_1px_var\(--border-invalid\)\][data-invalid]::before {
    content: var(--tw-content);
    --tw-shadow: 0 0 0 1px var(--tw-shadow-color, var(--border-invalid));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  @media (hover: hover) {
    .data-invalid\:hover\:border-\[var\(--border-invalid\)\][data-invalid]:hover {
      border-color: var(--border-invalid);
    }
  }
  .data-invalid\:active\:border-\[var\(--border-invalid\)\][data-invalid]:active {
    border-color: var(--border-invalid);
  }
  .data-limited\:opacity-0[data-limited] {
    opacity: 0%;
  }
  .data-pending\:pointer-events-none[data-pending] {
    pointer-events: none;
  }
  .data-pending\:cursor-progress[data-pending] {
    cursor: progress;
  }
  .data-placeholder\:text-\[var\(--muted-foreground\)\][data-placeholder] {
    color: var(--muted-foreground);
  }
  .data-popup-open\:border-\[var\(--field-border-pressed\)\][data-popup-open] {
    border-color: var(--field-border-pressed);
  }
  .data-popup-open\:border-\[var\(--select-open-border\,transparent\)\][data-popup-open] {
    border-color: var(--select-open-border,transparent);
  }
  .data-popup-open\:bg-\[var\(--rail-control-idle\)\][data-popup-open] {
    background-color: var(--rail-control-idle);
  }
  .data-popup-open\:bg-\[var\(--rail-item-hover\)\][data-popup-open] {
    background-color: var(--rail-item-hover);
  }
  .data-popup-open\:bg-\[var\(--select-trigger-surface-hover\,var\(--control-hover\)\)\][data-popup-open] {
    background-color: var(--select-trigger-surface-hover,var(--control-hover));
  }
  .data-popup-open\:bg-\[var\(--select-well-hover\,var\(--option-well-hover\)\)\][data-popup-open] {
    background-color: var(--select-well-hover,var(--option-well-hover));
  }
  .data-popup-open\:bg-\[var\(--tab-hover\)\][data-popup-open] {
    background-color: var(--tab-hover);
  }
  .data-popup-open\:text-\[var\(--foreground\)\][data-popup-open] {
    color: var(--foreground);
  }
  .data-popup-open\:text-\[var\(--secondary-foreground\)\][data-popup-open] {
    color: var(--secondary-foreground);
  }
  .data-popup-open\:\[--motion-control\:var\(--motion-in\)\][data-popup-open] {
    --motion-control: var(--motion-in);
  }
  .data-popup-open\:before\:bg-\[var\(--menu-item-hover\)\][data-popup-open]::before {
    content: var(--tw-content);
    background-color: var(--menu-item-hover);
  }
  .data-popup-open\:before\:shadow-\[var\(--shadow-hairline\)\,var\(--shadow-main-surface\)\][data-popup-open]::before {
    content: var(--tw-content);
    --tw-shadow: var(--shadow-hairline), var(--shadow-main-surface);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .data-popup-open\:before\:shadow-\[var\(--shadow-raised-hover\)\][data-popup-open]::before {
    content: var(--tw-content);
    --tw-shadow: var(--shadow-raised-hover);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .data-pressed\:bg-\[var\(--chip-current\)\][data-pressed] {
    background-color: var(--chip-current);
  }
  .data-pressed\:text-\[var\(--foreground\)\][data-pressed] {
    color: var(--foreground);
  }
  .data-pressed\:before\:shadow-\[var\(--shadow-hairline\)\][data-pressed]::before {
    content: var(--tw-content);
    --tw-shadow: var(--shadow-hairline);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  @media (hover: hover) {
    .data-pressed\:hover\:bg-\[var\(--chip-current\)\][data-pressed]:hover {
      background-color: var(--chip-current);
    }
    .data-pressed\:hover\:text-\[var\(--foreground\)\][data-pressed]:hover {
      color: var(--foreground);
    }
    .data-pressed\:hover\:before\:shadow-\[var\(--shadow-hairline\)\][data-pressed]:hover::before {
      content: var(--tw-content);
      --tw-shadow: var(--shadow-hairline);
      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    }
  }
  .data-pressed\:active\:bg-\[var\(--chip-current\)\][data-pressed]:active {
    background-color: var(--chip-current);
  }
  .data-pressed\:active\:text-\[var\(--foreground\)\][data-pressed]:active {
    color: var(--foreground);
  }
  .data-pressed\:active\:before\:shadow-\[var\(--shadow-hairline\)\][data-pressed]:active::before {
    content: var(--tw-content);
    --tw-shadow: var(--shadow-hairline);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .data-readonly\:pointer-events-none[data-readonly] {
    pointer-events: none;
  }
  .data-readonly\:cursor-default[data-readonly] {
    cursor: default;
  }
  @media (hover: hover) {
    .data-readonly\:hover\:border-\[var\(--input\)\][data-readonly]:hover {
      border-color: var(--input);
    }
    .data-readonly\:hover\:bg-\[var\(--option-well\)\][data-readonly]:hover {
      background-color: var(--option-well);
    }
  }
  .data-readonly\:active\:border-\[var\(--input\)\][data-readonly]:active {
    border-color: var(--input);
  }
  .data-readonly\:active\:bg-\[var\(--option-well\)\][data-readonly]:active {
    background-color: var(--option-well);
  }
  .data-readonly\:active\:bg-\[var\(--select-trigger-surface\,var\(--card\)\)\][data-readonly]:active {
    background-color: var(--select-trigger-surface,var(--card));
  }
  .data-revealed\:opacity-100[data-revealed] {
    opacity: 100%;
  }
  .data-starting-style\:-translate-x-\[var\(--motion-panel-offset\)\][data-starting-style] {
    --tw-translate-x: calc(var(--motion-panel-offset) * -1);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }
  .data-starting-style\:translate-x-\[var\(--motion-panel-offset\)\][data-starting-style] {
    --tw-translate-x: var(--motion-panel-offset);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }
  .data-starting-style\:scale-\[var\(--motion-dialog-scale-from\)\][data-starting-style] {
    scale: var(--motion-dialog-scale-from);
  }
  .data-starting-style\:\[transform\:scale\(var\(--motion-overlay-scale-from\)\)\][data-starting-style] {
    transform: scale(var(--motion-overlay-scale-from));
  }
  .data-starting-style\:\[transform\:translateY\(var\(--motion-floating-offset\)\)\][data-starting-style] {
    transform: translateY(var(--motion-floating-offset));
  }
  .data-starting-style\:opacity-0[data-starting-style] {
    opacity: 0%;
  }
  .data-\[expired\]\:text-\[var\(--status-error\)\][data-expired] {
    color: var(--status-error);
  }
  .data-\[fact-empty\]\:hidden[data-fact-empty] {
    display: none;
  }
  .data-\[monitor-action\]\:cursor-pointer[data-monitor-action] {
    cursor: pointer;
  }
  .data-\[monitor-action\]\:decoration-\[var\(--border-strong\)\][data-monitor-action] {
    text-decoration-color: var(--border-strong);
  }
  .data-\[monitor-action\]\:underline-offset-2[data-monitor-action] {
    text-underline-offset: 2px;
  }
  @media (hover: hover) {
    .data-\[monitor-action\]\:hover\:underline[data-monitor-action]:hover {
      text-decoration-line: underline;
    }
  }
  .data-\[orientation\=horizontal\]\:h-1[data-orientation="horizontal"] {
    height: var(--spacing);
  }
  .data-\[orientation\=horizontal\]\:h-5[data-orientation="horizontal"] {
    height: calc(var(--spacing) * 5);
  }
  .data-\[orientation\=horizontal\]\:h-\[var\(--border-width-hairline\)\][data-orientation="horizontal"] {
    height: var(--border-width-hairline);
  }
  .data-\[orientation\=horizontal\]\:h-full[data-orientation="horizontal"] {
    height: 100%;
  }
  .data-\[orientation\=horizontal\]\:w-full[data-orientation="horizontal"] {
    width: 100%;
  }
  .data-\[orientation\=horizontal\]\:flex-col[data-orientation="horizontal"] {
    flex-direction: column;
  }
  .data-\[orientation\=vertical\]\:hidden[data-orientation="vertical"] {
    display: none;
  }
  .data-\[orientation\=vertical\]\:h-full[data-orientation="vertical"] {
    height: 100%;
  }
  .data-\[orientation\=vertical\]\:min-h-40[data-orientation="vertical"] {
    min-height: calc(var(--spacing) * 40);
  }
  .data-\[orientation\=vertical\]\:w-1[data-orientation="vertical"] {
    width: var(--spacing);
  }
  .data-\[orientation\=vertical\]\:w-5[data-orientation="vertical"] {
    width: calc(var(--spacing) * 5);
  }
  .data-\[orientation\=vertical\]\:w-\[var\(--border-width-hairline\)\][data-orientation="vertical"] {
    width: var(--border-width-hairline);
  }
  .data-\[orientation\=vertical\]\:w-auto[data-orientation="vertical"] {
    width: auto;
  }
  .data-\[orientation\=vertical\]\:w-full[data-orientation="vertical"] {
    width: 100%;
  }
  .data-\[orientation\=vertical\]\:flex-col[data-orientation="vertical"] {
    flex-direction: column;
  }
  .data-\[orientation\=vertical\]\:self-stretch[data-orientation="vertical"] {
    align-self: stretch;
  }
  .data-\[popup-open\]\:opacity-100[data-popup-open] {
    opacity: 100%;
  }
  .data-\[scrolled\]\:shadow-\[inset_-1px_0_0_var\(--border\)\][data-scrolled] {
    --tw-shadow: inset -1px 0 0 var(--tw-shadow-color, var(--border));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .data-\[scrolled\]\:shadow-\[inset_1px_0_0_var\(--border\)\][data-scrolled] {
    --tw-shadow: inset 1px 0 0 var(--tw-shadow-color, var(--border));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  :is(.\*\:data-\[slot\=field-label\]\:mb-0 > *)[data-slot="field-label"] {
    margin-bottom: 0px;
  }
  .data-ending-style\:data-\[swipe-direction\=down\]\:\[transform\:translateY\(calc\(var\(--toast-swipe-movement-y\)\+150\%\)\)\][data-ending-style][data-swipe-direction="down"] {
    transform: translateY(calc(var(--toast-swipe-movement-y) + 150%));
  }
  .data-ending-style\:data-\[swipe-direction\=left\]\:\[transform\:translateX\(calc\(var\(--toast-swipe-movement-x\)-150\%\)\)_translateY\(var\(--zml-toast-offset\)\)\][data-ending-style][data-swipe-direction="left"] {
    transform: translateX(calc(var(--toast-swipe-movement-x) - 150%)) translateY(var(--zml-toast-offset));
  }
  .data-ending-style\:data-\[swipe-direction\=right\]\:\[transform\:translateX\(calc\(var\(--toast-swipe-movement-x\)\+150\%\)\)_translateY\(var\(--zml-toast-offset\)\)\][data-ending-style][data-swipe-direction="right"] {
    transform: translateX(calc(var(--toast-swipe-movement-x) + 150%)) translateY(var(--zml-toast-offset));
  }
  .data-ending-style\:data-\[swipe-direction\=up\]\:\[transform\:translateY\(calc\(var\(--toast-swipe-movement-y\)-150\%\)\)\][data-ending-style][data-swipe-direction="up"] {
    transform: translateY(calc(var(--toast-swipe-movement-y) - 150%));
  }
  .data-\[variant\=destructive\]\:text-\[var\(--destructive\)\][data-variant="destructive"] {
    color: var(--destructive);
  }
  .data-\[variant\=destructive\]\:data-highlighted\:before\:bg-\[color-mix\(in_oklab\,var\(--destructive\)_10\%\,transparent\)\][data-variant="destructive"][data-highlighted]::before {
    content: var(--tw-content);
    background-color: var(--destructive);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab,var(--destructive) 10%,transparent);
    }
  }
  @media (prefers-reduced-motion: no-preference) {
    .motion-safe\:animate-\[zml-pulse_var\(--motion-loop\)_var\(--ease-move\)_infinite\] {
      animation: zml-pulse var(--motion-loop) var(--ease-move) infinite;
    }
    .motion-safe\:animate-\[zml-pulse_var\(--motion-pulse-slow\)_var\(--ease-move\)_infinite\] {
      animation: zml-pulse var(--motion-pulse-slow) var(--ease-move) infinite;
    }
  }
  @media (prefers-reduced-motion: reduce) {
    .motion-reduce\:animate-none {
      animation: none;
    }
    .motion-reduce\:transition-none {
      transition-property: none;
    }
    .motion-reduce\:before\:\[transition-property\:none\]::before {
      content: var(--tw-content);
      transition-property: none;
    }
    .motion-reduce\:data-ending-style\:translate-0[data-ending-style] {
      --tw-translate-x: 0px;
      --tw-translate-y: 0px;
      translate: var(--tw-translate-x) var(--tw-translate-y);
    }
    .motion-reduce\:data-ending-style\:scale-100[data-ending-style] {
      --tw-scale-x: 100%;
      --tw-scale-y: 100%;
      --tw-scale-z: 100%;
      scale: var(--tw-scale-x) var(--tw-scale-y);
    }
    .motion-reduce\:data-ending-style\:\[transform\:var\(--zml-toast-transform\)\][data-ending-style] {
      transform: var(--zml-toast-transform);
    }
    .motion-reduce\:data-ending-style\:transform-none[data-ending-style] {
      transform: none;
    }
    .motion-reduce\:data-starting-style\:translate-0[data-starting-style] {
      --tw-translate-x: 0px;
      --tw-translate-y: 0px;
      translate: var(--tw-translate-x) var(--tw-translate-y);
    }
    .motion-reduce\:data-starting-style\:scale-100[data-starting-style] {
      --tw-scale-x: 100%;
      --tw-scale-y: 100%;
      --tw-scale-z: 100%;
      scale: var(--tw-scale-x) var(--tw-scale-y);
    }
    .motion-reduce\:data-starting-style\:\[transform\:var\(--zml-toast-transform\)\][data-starting-style] {
      transform: var(--zml-toast-transform);
    }
    .motion-reduce\:data-starting-style\:transform-none[data-starting-style] {
      transform: none;
    }
  }
  @media (width < 419px) {
    .max-\[419px\]\:w-\[calc\(100vw-2\*var\(--space-section-compact\)\)\] {
      width: calc(100vw - 2 * var(--space-section-compact));
    }
    .max-\[419px\]\:shadow-\[var\(--shadow-dialog\)\] {
      --tw-shadow: var(--shadow-dialog);
      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    }
  }
  @media (width < 80rem) {
    .max-xl\:sr-only {
      position: absolute;
      width: 1px;
      height: 1px;
      padding: 0;
      margin: -1px;
      overflow: hidden;
      clip-path: inset(50%);
      white-space: nowrap;
      border-width: 0;
    }
    .max-xl\:flex {
      display: flex;
    }
    .max-xl\:h-auto {
      height: auto;
    }
    .max-xl\:w-full {
      width: 100%;
    }
    .max-xl\:min-w-0 {
      min-width: 0px;
    }
    .max-xl\:flex-none {
      flex: none;
    }
    .max-xl\:flex-col {
      flex-direction: column;
    }
    .max-xl\:items-stretch {
      align-items: stretch;
    }
    .max-xl\:overflow-visible {
      overflow: visible;
    }
  }
  @media (width < 48rem) {
    .max-md\:relative {
      position: relative;
    }
    .max-md\:bottom-\[calc\(1rem\+var\(--safe-area-bottom\)\+var\(--feedback-bottom-clearance\)\+var\(--feedback-viewport-bottom-inset\,0px\)\)\] {
      bottom: calc(1rem + var(--safe-area-bottom) + var(--feedback-bottom-clearance) + var(--feedback-viewport-bottom-inset,0px));
    }
    .max-md\:bottom-\[calc\(1rem\+var\(--safe-area-bottom\)\+var\(--feedback-viewport-bottom-inset\,0px\)\)\] {
      bottom: calc(1rem + var(--safe-area-bottom) + var(--feedback-viewport-bottom-inset,0px));
    }
    .max-md\:bottom-\[calc\(var\(--space-section-compact\)\+env\(safe-area-inset-bottom\,0px\)\+var\(--feedback-viewport-bottom-inset\,0px\)\)\] {
      bottom: calc(var(--space-section-compact) + env(safe-area-inset-bottom,0px) + var(--feedback-viewport-bottom-inset,0px));
    }
    .max-md\:ms-0 {
      margin-inline-start: 0px;
    }
    .max-md\:flex {
      display: flex;
    }
    .max-md\:hidden {
      display: none;
    }
    .max-md\:w-full {
      width: 100%;
    }
    .max-md\:max-w-full {
      max-width: 100%;
    }
    .max-md\:basis-full {
      flex-basis: 100%;
    }
    .max-md\:touch-pan-x {
      --tw-pan-x: pan-x;
      touch-action: var(--tw-pan-x,) var(--tw-pan-y,) var(--tw-pinch-zoom,);
    }
    .max-md\:\[scrollbar-width\:none\] {
      scrollbar-width: none;
    }
    .max-md\:grid-cols-1 {
      grid-template-columns: repeat(1, minmax(0, 1fr));
    }
    .max-md\:grid-cols-2 {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .max-md\:grid-cols-3 {
      grid-template-columns: repeat(3, minmax(0, 1fr));
    }
    .max-md\:flex-wrap {
      flex-wrap: wrap;
    }
    .max-md\:justify-start {
      justify-content: flex-start;
    }
    .max-md\:overflow-x-auto {
      overflow-x: auto;
    }
    .max-md\:overflow-y-hidden {
      overflow-y: hidden;
    }
    .max-md\:overscroll-x-contain {
      overscroll-behavior-x: contain;
    }
    .max-md\:data-scroll-after\:\[mask-image\:linear-gradient\(to_right\,\#000_calc\(100\%-24px\)\,transparent\)\][data-scroll-after] {
      mask-image: linear-gradient(to right,#000 calc(100% - 24px),transparent);
    }
    .max-md\:data-scroll-before\:\[mask-image\:linear-gradient\(to_right\,transparent\,\#000_24px\)\][data-scroll-before] {
      mask-image: linear-gradient(to right,transparent,#000 24px);
    }
    .max-md\:data-scroll-before\:data-scroll-after\:\[mask-image\:linear-gradient\(to_right\,transparent\,\#000_24px\,\#000_calc\(100\%-24px\)\,transparent\)\][data-scroll-before][data-scroll-after] {
      mask-image: linear-gradient(to right,transparent,#000 24px,#000 calc(100% - 24px),transparent);
    }
  }
  @media (width < 40rem) {
    .max-sm\:hidden {
      display: none;
    }
    .max-sm\:w-auto {
      width: auto;
    }
    .max-sm\:flex-none {
      flex: none;
    }
  }
  @media (width >= 420px) {
    .min-\[420px\]\:flex-row {
      flex-direction: row;
    }
  }
  @media (width >= 40rem) {
    .sm\:w-40 {
      width: calc(var(--spacing) * 40);
    }
    .sm\:w-\[var\(--form-field-default\)\] {
      width: var(--form-field-default);
    }
    .sm\:grid-cols-2 {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .sm\:grid-cols-3 {
      grid-template-columns: repeat(3, minmax(0, 1fr));
    }
    .sm\:flex-row {
      flex-direction: row;
    }
    .sm\:px-1 {
      padding-inline: var(--spacing);
    }
    .sm\:px-1\.5 {
      padding-inline: calc(var(--spacing) * 1.5);
    }
  }
  @media (width >= 48rem) {
    .md\:sticky {
      position: sticky;
    }
    .md\:bottom-0 {
      bottom: 0px;
    }
    .md\:z-\[var\(--z-raised\)\] {
      z-index: var(--z-raised);
    }
    .md\:max-h-none {
      max-height: none;
    }
    .md\:w-64 {
      width: calc(var(--spacing) * 64);
    }
    .md\:grid-cols-4 {
      grid-template-columns: repeat(4, minmax(0, 1fr));
    }
    .md\:flex-row {
      flex-direction: row;
    }
    .md\:border-e {
      border-inline-end-style: var(--tw-border-style);
      border-inline-end-width: 1px;
    }
    .md\:border-b-0 {
      border-bottom-style: var(--tw-border-style);
      border-bottom-width: 0px;
    }
    .md\:p-6 {
      padding: calc(var(--spacing) * 6);
    }
    .md\:px-2 {
      padding-inline: calc(var(--spacing) * 2);
    }
  }
  @media (width >= 64rem) {
    .lg\:max-w-\[var\(--announcement-category-column\)\] {
      max-width: var(--announcement-category-column);
    }
  }
  @media (width >= 80rem) {
    .xl\:m-0 {
      margin: 0px;
    }
    .xl\:my-\[var\(--shell-wide-inset\)\] {
      margin-block: var(--shell-wide-inset);
    }
    .xl\:ms-\[var\(--shell-wide-inset\)\] {
      margin-inline-start: var(--shell-wide-inset);
    }
    .xl\:ms-\[var\(--shell-wide-inset\)\]\! {
      margin-inline-start: var(--shell-wide-inset) !important;
    }
    .xl\:me-\[var\(--shell-wide-inset\)\] {
      margin-inline-end: var(--shell-wide-inset);
    }
    .xl\:flex {
      display: flex;
    }
    .xl\:h-\[540px\] {
      height: 540px;
    }
    .xl\:h-\[calc\(100dvh-2\*var\(--shell-wide-inset\)\)\] {
      height: calc(100dvh - 2 * var(--shell-wide-inset));
    }
    .xl\:h-dvh {
      height: 100dvh;
    }
    .xl\:rounded-\[var\(--radius-shell\)\] {
      border-radius: var(--radius-shell);
    }
    .xl\:rounded-none {
      border-radius: 0;
    }
    .xl\:border-0 {
      border-style: var(--tw-border-style);
      border-width: 0px;
    }
    .xl\:border-\[0\.5px\] {
      border-style: var(--tw-border-style);
      border-width: 0.5px;
    }
    .xl\:border-\[var\(--shell-surface-border\)\] {
      border-color: var(--shell-surface-border);
    }
    .xl\:shadow-\[var\(--shadow-main-surface\)\] {
      --tw-shadow: var(--shadow-main-surface);
      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    }
    .xl\:shadow-none {
      --tw-shadow: 0 0 #0000;
      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    }
  }
  @container view-rail (width < 48rem) {
    .\@max-3xl\/view-rail\:flex {
      display: flex;
    }
    .\@max-3xl\/view-rail\:hidden {
      display: none;
    }
  }
  @container ledger (width < 34rem) {
    .\@max-\[34rem\]\/ledger\:block {
      display: block;
    }
    .\@max-\[34rem\]\/ledger\:hidden {
      display: none;
    }
    .\@max-\[34rem\]\/ledger\:w-0 {
      width: 0px;
    }
  }
  @container ledger (width < 24rem) {
    .\@max-\[24rem\]\/ledger\:w-\[7rem\] {
      width: 7rem;
    }
  }
  @container ledger-axis (width < 7.5rem) {
    .\@max-\[7\.5rem\]\/ledger-axis\:hidden {
      display: none;
    }
  }
  @container overlay-frame (width >= 768px) {
    .\@min-\[768px\]\/overlay-frame\:hidden {
      display: none;
    }
  }
  @container detail (width >= 880px) {
    .\@\[880px\]\/detail\:col-start-1 {
      grid-column-start: 1;
    }
    .\@\[880px\]\/detail\:col-start-2 {
      grid-column-start: 2;
    }
    .\@\[880px\]\/detail\:col-start-3 {
      grid-column-start: 3;
    }
    .\@\[880px\]\/detail\:grid-cols-\[1fr_minmax\(0\,var\(--article-reading-width\)\)_minmax\(0\,var\(--details-pane-width\)\)_1fr\] {
      grid-template-columns: 1fr minmax(0,var(--article-reading-width)) minmax(0,var(--details-pane-width)) 1fr;
    }
    .\@\[880px\]\/detail\:grid-cols-\[minmax\(0\,1fr\)_minmax\(0\,var\(--details-pane-width\)\)\] {
      grid-template-columns: minmax(0,1fr) minmax(0,var(--details-pane-width));
    }
    .\@\[880px\]\/detail\:px-0 {
      padding-inline: 0px;
    }
    .\@\[880px\]\/detail\:ps-\[var\(--cell-inline\)\] {
      padding-inline-start: var(--cell-inline);
    }
    .\@\[880px\]\/detail\:pe-0 {
      padding-inline-end: 0px;
    }
    .\@\[880px\]\/detail\:pt-0 {
      padding-top: 0px;
    }
    .\@\[880px\]\/detail\:pt-\[calc\(var\(--shell-bar-height\)\/2\)\] {
      padding-top: calc(var(--shell-bar-height) / 2);
    }
  }
  @container (width >= 24rem) {
    .\@sm\:grid-cols-\[minmax\(0\,2fr\)_minmax\(0\,3fr\)\] {
      grid-template-columns: minmax(0,2fr) minmax(0,3fr);
    }
    .\@sm\:items-start {
      align-items: flex-start;
    }
    .\@sm\:gap-4 {
      gap: calc(var(--spacing) * 4);
    }
    .\@sm\:justify-self-end {
      justify-self: flex-end;
    }
    .\@sm\:text-end {
      text-align: end;
    }
    .\@min-\[24rem\]\:data-\[layout\=split\]\:justify-between[data-layout="split"] {
      justify-content: space-between;
    }
  }
  @container table (width >= 28rem) {
    .\@md\/table\:sticky {
      position: sticky;
    }
    .\@md\/table\:right-0 {
      right: 0px;
    }
    .\@md\/table\:left-0 {
      left: 0px;
    }
    .\@md\/table\:z-\[var\(--z-sticky\)\] {
      z-index: var(--z-sticky);
    }
  }
  @container (width >= 28rem) {
    .\@md\:col-span-1 {
      grid-column: span 1 / span 1;
    }
    .\@md\:col-start-2 {
      grid-column-start: 2;
    }
    .\@md\:col-start-3 {
      grid-column-start: 3;
    }
    .\@md\:col-start-4 {
      grid-column-start: 4;
    }
    .\@md\:row-start-1 {
      grid-row-start: 1;
    }
    .\@md\:ms-auto {
      margin-inline-start: auto;
    }
    .\@md\:h-3 {
      height: calc(var(--spacing) * 3);
    }
    .\@md\:h-40 {
      height: calc(var(--spacing) * 40);
    }
    .\@md\:h-\[16\.25rem\] {
      height: 16.25rem;
    }
    .\@md\:min-h-\[var\(--chart-plot-min-wide\)\] {
      min-height: var(--chart-plot-min-wide);
    }
  }
  @container settings-field (width >= 28rem) {
    .\@md\/settings-field\:w-\[var\(--form-field-wide\)\] {
      width: var(--form-field-wide);
    }
  }
  @container (width >= 28rem) {
    .\@md\:w-12 {
      width: calc(var(--spacing) * 12);
    }
    .\@md\:w-24 {
      width: calc(var(--spacing) * 24);
    }
    .\@md\:w-auto {
      width: auto;
    }
    .\@md\:flex-1 {
      flex: 1;
    }
    .\@md\:grid-cols-\[6rem_minmax\(0\,1fr\)_auto_3rem\] {
      grid-template-columns: 6rem minmax(0,1fr) auto 3rem;
    }
    .\@md\:grid-cols-\[6rem_…\] {
      grid-template-columns: 6rem …;
    }
    .\@md\:justify-end {
      justify-content: flex-end;
    }
    .\@md\:px-5 {
      padding-inline: calc(var(--spacing) * 5);
    }
    .\@md\:text-end {
      text-align: end;
    }
  }
  @container table (width >= 28rem) {
    .\@md\/table\:data-\[scrolled\]\:shadow-\[inset_-1px_0_0_var\(--border\)\][data-scrolled] {
      --tw-shadow: inset -1px 0 0 var(--tw-shadow-color, var(--border));
      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    }
    .\@md\/table\:data-\[scrolled\]\:shadow-\[inset_1px_0_0_var\(--border\)\][data-scrolled] {
      --tw-shadow: inset 1px 0 0 var(--tw-shadow-color, var(--border));
      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    }
  }
  @container (width >= 32rem) {
    .\@lg\:ms-auto {
      margin-inline-start: auto;
    }
    .\@lg\:w-auto {
      width: auto;
    }
    .\@lg\:max-w-sm {
      max-width: var(--container-sm);
    }
    .\@lg\:min-w-48 {
      min-width: calc(var(--spacing) * 48);
    }
    .\@lg\:min-w-72 {
      min-width: calc(var(--spacing) * 72);
    }
    .\@lg\:flex-1 {
      flex: 1;
    }
    .\@lg\:flex-\[0_1_22rem\] {
      flex: 0 1 22rem;
    }
    .\@lg\:shrink-0 {
      flex-shrink: 0;
    }
    .\@lg\:flex-row {
      flex-direction: row;
    }
    .\@lg\:flex-wrap {
      flex-wrap: wrap;
    }
    .\@lg\:items-center {
      align-items: center;
    }
  }
  @container ledger (width >= 40rem) {
    .\@\[40rem\]\/ledger\:w-\[34\%\] {
      width: 34%;
    }
  }
  @container (width >= 42rem) {
    .\@2xl\:w-auto {
      width: auto;
    }
    .\@2xl\:max-w-full {
      max-width: 100%;
    }
    .\@2xl\:shrink {
      flex-shrink: 1;
    }
  }
  @container summary (width >= 42rem) {
    .\@2xl\/summary\:grid-cols-3 {
      grid-template-columns: repeat(3, minmax(0, 1fr));
    }
  }
  @container (width >= 42rem) {
    .\@2xl\:grid-cols-4 {
      grid-template-columns: repeat(4, minmax(0, 1fr));
    }
    .\@2xl\:flex-row {
      flex-direction: row;
    }
    .\@2xl\:items-end {
      align-items: flex-end;
    }
  }
  @container (width >= 48rem) {
    .\@3xl\:px-4 {
      padding-inline: calc(var(--spacing) * 4);
    }
    .\@3xl\:py-4 {
      padding-block: calc(var(--spacing) * 4);
    }
  }
  @container overview (width >= 56rem) {
    .\@4xl\/overview\:grid-cols-2 {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
  }
  @container summary (width >= 56rem) {
    .\@4xl\/summary\:grid-cols-3 {
      grid-template-columns: repeat(3, minmax(0, 1fr));
    }
    .\@4xl\/summary\:grid-cols-4 {
      grid-template-columns: repeat(4, minmax(0, 1fr));
    }
  }
  @container summary (width >= 64rem) {
    .\@5xl\/summary\:grid-cols-6 {
      grid-template-columns: repeat(6, minmax(0, 1fr));
    }
  }
  .rtl\:translate-x-1\/2:where(:dir(rtl), [dir="rtl"], [dir="rtl"] *) {
    --tw-translate-x: calc(1 / 2 * 100%);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }
  .rtl\:\[translate\:var\(--view-rail-overflow-pull\,0px\)_0\]:where(:dir(rtl), [dir="rtl"], [dir="rtl"] *) {
    translate: var(--view-rail-overflow-pull,0px) 0;
  }
  .rtl\:data-ending-style\:-translate-x-\[var\(--motion-panel-offset\)\]:where(:dir(rtl), [dir="rtl"], [dir="rtl"] *)[data-ending-style] {
    --tw-translate-x: calc(var(--motion-panel-offset) * -1);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }
  .rtl\:data-ending-style\:translate-x-\[var\(--motion-panel-offset\)\]:where(:dir(rtl), [dir="rtl"], [dir="rtl"] *)[data-ending-style] {
    --tw-translate-x: var(--motion-panel-offset);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }
  .rtl\:data-starting-style\:-translate-x-\[var\(--motion-panel-offset\)\]:where(:dir(rtl), [dir="rtl"], [dir="rtl"] *)[data-starting-style] {
    --tw-translate-x: calc(var(--motion-panel-offset) * -1);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }
  .rtl\:data-starting-style\:translate-x-\[var\(--motion-panel-offset\)\]:where(:dir(rtl), [dir="rtl"], [dir="rtl"] *)[data-starting-style] {
    --tw-translate-x: var(--motion-panel-offset);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }
  @media (prefers-color-scheme: dark) {
    .dark\:border-transparent {
      border-color: transparent;
    }
  }
  @starting-style {
    .starting\:scale-\[var\(--motion-overlay-scale-from\)\] {
      scale: var(--motion-overlay-scale-from);
    }
    .starting\:opacity-0 {
      opacity: 0%;
    }
  }
  @media (forced-colors: active) {
    .forced-colors\:border {
      border-style: var(--tw-border-style);
      border-width: 1px;
    }
    .forced-colors\:border-\[ButtonText\] {
      border-color: ButtonText;
    }
    .forced-colors\:border-\[CanvasText\] {
      border-color: CanvasText;
    }
    .forced-colors\:bg-\[Canvas\] {
      background-color: Canvas;
    }
    .forced-colors\:bg-\[Highlight\] {
      background-color: Highlight;
    }
    .forced-colors\:text-\[CanvasText\] {
      color: CanvasText;
    }
    .forced-colors\:text-\[GrayText\] {
      color: GrayText;
    }
    .forced-colors\:text-\[HighlightText\] {
      color: HighlightText;
    }
    .forced-colors\:shadow-none {
      --tw-shadow: 0 0 #0000;
      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    }
    .forced-colors\:outline {
      outline-style: var(--tw-outline-style);
      outline-width: 1px;
    }
    .forced-colors\:outline-1 {
      outline-style: var(--tw-outline-style);
      outline-width: 1px;
    }
    .forced-colors\:-outline-offset-1 {
      outline-offset: calc(1px * -1);
    }
    .forced-colors\:outline-\[ButtonText\] {
      outline-color: ButtonText;
    }
    .forced-colors\:transition-none {
      transition-property: none;
    }
    .forced-colors\:\[forced-color-adjust\:none\] {
      forced-color-adjust: none;
    }
    .forced-colors\:forced-color-adjust-none {
      forced-color-adjust: none;
    }
    .forced-colors\:group-data-disabled\/radio\:bg-\[GrayText\]:is(:where(.group\/radio)[data-disabled] *) {
      background-color: GrayText;
    }
    .forced-colors\:after\:border-\[CanvasText\]::after {
      content: var(--tw-content);
      border-color: CanvasText;
    }
    .forced-colors\:data-active\:underline[data-active] {
      text-decoration-line: underline;
    }
    .forced-colors\:data-checked\:underline[data-checked] {
      text-decoration-line: underline;
    }
  }
  @media (pointer: coarse) {
    .pointer-coarse\:hidden {
      display: none;
    }
  }
  @media (any-pointer: coarse) {
    .any-pointer-coarse\:my-\[calc\(\(var\(--control-compact\)-var\(--hit-plane-coarse\)\)\/2\)\] {
      margin-block: calc((var(--control-compact) - var(--hit-plane-coarse)) / 2);
    }
    .any-pointer-coarse\:my-\[calc\(\(var\(--hit-plane-coarse\)-var\(--control-form\)\)\/2\)\] {
      margin-block: calc((var(--hit-plane-coarse) - var(--control-form)) / 2);
    }
    .any-pointer-coarse\:size-\[var\(--hit-plane-coarse\)\] {
      width: var(--hit-plane-coarse);
      height: var(--hit-plane-coarse);
    }
    .any-pointer-coarse\:min-h-0 {
      min-height: 0px;
    }
    .any-pointer-coarse\:min-h-10 {
      min-height: calc(var(--spacing) * 10);
    }
    .any-pointer-coarse\:min-h-\[--hit-plane-coarse\] {
      min-height: --hit-plane-coarse;
    }
    .any-pointer-coarse\:min-h-\[var\(--hit-plane-coarse\)\] {
      min-height: var(--hit-plane-coarse);
    }
    .any-pointer-coarse\:w-\[var\(--hit-plane-coarse\)\] {
      width: var(--hit-plane-coarse);
    }
    .any-pointer-coarse\:min-w-\[var\(--hit-plane-coarse\)\] {
      min-width: var(--hit-plane-coarse);
    }
    .any-pointer-coarse\:gap-0 {
      gap: 0px;
    }
    .any-pointer-coarse\:gap-y-\[calc\(var\(--hit-plane-coarse\)-var\(--control-compact\)\)\] {
      row-gap: calc(var(--hit-plane-coarse) - var(--control-compact));
    }
    .any-pointer-coarse\:overflow-visible {
      overflow: visible;
    }
    .any-pointer-coarse\:pe-\[calc\(var\(--hit-plane-coarse\)\+var\(--space-section-compact\)\)\] {
      padding-inline-end: calc(var(--hit-plane-coarse) + var(--space-section-compact));
    }
    .any-pointer-coarse\:pe-\[calc\(var\(--space-section-compact\)\+var\(--hit-plane-coarse\)\)\] {
      padding-inline-end: calc(var(--space-section-compact) + var(--hit-plane-coarse));
    }
    .any-pointer-coarse\:\[overflow-wrap\:anywhere\] {
      overflow-wrap: anywhere;
    }
    .any-pointer-coarse\:whitespace-normal {
      white-space: normal;
    }
    .any-pointer-coarse\:opacity-100 {
      opacity: 100%;
    }
    .group-data-\[density\=compact\]\/listbox\:any-pointer-coarse\:min-h-\[var\(--hit-plane-coarse\)\]:is(:where(.group\/listbox)[data-density="compact"] *) {
      min-height: var(--hit-plane-coarse);
    }
    .group-data-\[orientation\=vertical\]\/radio-group\:any-pointer-coarse\:min-h-\[var\(--hit-plane-coarse\)\]:is(:where(.group\/radio-group)[data-orientation="vertical"] *) {
      min-height: var(--hit-plane-coarse);
    }
    .any-pointer-coarse\:before\:-inset-y-\[11px\]::before {
      content: var(--tw-content);
      inset-block: calc(11px * -1);
    }
    .any-pointer-coarse\:after\:absolute::after {
      content: var(--tw-content);
      position: absolute;
    }
    .any-pointer-coarse\:after\:top-1\/2::after {
      content: var(--tw-content);
      top: calc(1 / 2 * 100%);
    }
    .any-pointer-coarse\:after\:left-1\/2::after {
      content: var(--tw-content);
      left: calc(1 / 2 * 100%);
    }
    .any-pointer-coarse\:after\:size-\[var\(--hit-plane-coarse\)\]::after {
      content: var(--tw-content);
      width: var(--hit-plane-coarse);
      height: var(--hit-plane-coarse);
    }
    .any-pointer-coarse\:after\:h-\[var\(--hit-plane-coarse\)\]::after {
      content: var(--tw-content);
      height: var(--hit-plane-coarse);
    }
    .any-pointer-coarse\:after\:w-\[max\(100\%\,var\(--hit-plane-coarse\)\)\]::after {
      content: var(--tw-content);
      width: max(100%, var(--hit-plane-coarse));
    }
    .any-pointer-coarse\:after\:w-\[var\(--zml-button-hit-width\,100\%\)\]::after {
      content: var(--tw-content);
      width: var(--zml-button-hit-width,100%);
    }
    .any-pointer-coarse\:after\:w-full::after {
      content: var(--tw-content);
      width: 100%;
    }
    .any-pointer-coarse\:after\:-translate-1\/2::after {
      content: var(--tw-content);
      --tw-translate-x: calc(calc(1 / 2 * 100%) * -1);
      --tw-translate-y: calc(calc(1 / 2 * 100%) * -1);
      translate: var(--tw-translate-x) var(--tw-translate-y);
    }
    .any-pointer-coarse\:after\:content-\[\"\"\]::after {
      --tw-content: "";
      content: var(--tw-content);
    }
    @media (hover: hover) {
      .any-pointer-coarse\:hover\:bg-transparent:hover {
        background-color: transparent;
      }
    }
    .any-pointer-coarse\:active\:bg-transparent:active {
      background-color: transparent;
    }
    .data-\[orientation\=horizontal\]\:any-pointer-coarse\:min-h-\[var\(--hit-plane-coarse\)\][data-orientation="horizontal"] {
      min-height: var(--hit-plane-coarse);
    }
  }
  @media (any-pointer: fine) {
    @media (width >= 80rem) {
      .any-pointer-fine\:xl\:flex {
        display: flex;
      }
    }
  }
  .\[\&_\:is\(\[data-slot\=table-row-header\]\,\[data-slot\=table-cell\]\)\]\:text-\[var\(--disabled-foreground\)\] :is([data-slot=table-row-header], [data-slot=table-cell]) {
    color: var(--disabled-foreground);
  }
  .\[\&_\:is\(\[data-slot\=table-row-header\]\,\[data-slot\=table-cell\]\)\]\:text-\[var\(--muted-foreground\)\] :is([data-slot=table-row-header], [data-slot=table-cell]) {
    color: var(--muted-foreground);
  }
  .\[\&_\[aria-current\]\]\:text-\[var\(--secondary-foreground\)\] [aria-current] {
    color: var(--secondary-foreground);
  }
  .\[\&_\[data-icon-button\]\]\:relative [data-icon-button] {
    position: relative;
  }
  .\[\&_\[data-icon-button\]\]\:size-\[var\(--control-standard\)\] [data-icon-button] {
    width: var(--control-standard);
    height: var(--control-standard);
  }
  .\[\&_\[data-icon-button\]\]\:h-\[var\(--control-standard\)\] [data-icon-button] {
    height: var(--control-standard);
  }
  .\[\&_\[data-icon-button\]\]\:shrink-0 [data-icon-button] {
    flex-shrink: 0;
  }
  @media (any-pointer: coarse) {
    .\[\&_\[data-icon-button\]\]\:any-pointer-coarse\:size-\[var\(--control-standard\)\] [data-icon-button] {
      width: var(--control-standard);
      height: var(--control-standard);
    }
  }
  .\[\&_\[data-ordered-view-item\]\:not\(\[data-current\]\)_\[data-ordered-view-menu-trigger\]\:not\(\[aria-expanded\=\'true\'\]\)\]\:hidden [data-ordered-view-item]:not([data-current]) [data-ordered-view-menu-trigger]:not([aria-expanded='true']) {
    display: none;
  }
  .\[\&_\[data-slot\=auth-action-icon\]_svg\]\:size-4 [data-slot=auth-action-icon] svg {
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
  }
  .\[\&_\[data-slot\=button-spinner\]_svg\]\:size-4 [data-slot=button-spinner] svg {
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
  }
  .\[\&_\[data-slot\=button\]\]\:\[font-size\:inherit\] [data-slot=button] {
    font-size: inherit;
  }
  .\[\&_\[data-slot\=button\]\]\:leading-\[inherit\] [data-slot=button] {
    --tw-leading: inherit;
    line-height: inherit;
  }
  .\[\&_\[data-slot\=button\]\]\:text-\[inherit\] [data-slot=button] {
    color: inherit;
  }
  .\[\&_\[data-slot\=combobox-item-indicator\]\]\:opacity-0 [data-slot=combobox-item-indicator] {
    opacity: 0%;
  }
  .\[\&_\[data-slot\=menu-mark\]_svg\]\:text-\[var\(--primary-foreground\)\] [data-slot=menu-mark] svg {
    color: var(--primary-foreground);
  }
  .\[\&_\[data-slot\=menu-sub-indicator\]\]\:hidden [data-slot=menu-sub-indicator] {
    display: none;
  }
  .\[\&_\[data-slot\=menu-sub-indicator\]\]\:text-\[var\(--disabled-foreground\)\] [data-slot=menu-sub-indicator] {
    color: var(--disabled-foreground);
  }
  .\[\&_\[data-slot\=notice-title\]\]\:text-\[var\(--status-error\)\] [data-slot=notice-title] {
    color: var(--status-error);
  }
  .\[\&_\[data-slot\=segmented\]\]\:max-w-full [data-slot=segmented] {
    max-width: 100%;
  }
  .\[\&_\[data-slot\=select-item-indicator\]\]\:opacity-0 [data-slot=select-item-indicator] {
    opacity: 0%;
  }
  .group-data-\[density\=compact\]\/listbox\:\[\&_\[data-slot\=select-item-indicator\]\]\:absolute:is(:where(.group\/listbox)[data-density="compact"] *) [data-slot=select-item-indicator] {
    position: absolute;
  }
  .group-data-\[density\=compact\]\/listbox\:\[\&_\[data-slot\=select-item-indicator\]\]\:end-3:is(:where(.group\/listbox)[data-density="compact"] *) [data-slot=select-item-indicator] {
    inset-inline-end: calc(var(--spacing) * 3);
  }
  .group-data-\[density\=compact\]\/listbox\:\[\&_\[data-slot\=select-item-indicator\]_svg\]\:size-\[var\(--icon-toolbar\)\]:is(:where(.group\/listbox)[data-density="compact"] *) [data-slot=select-item-indicator] svg {
    width: var(--icon-toolbar);
    height: var(--icon-toolbar);
  }
  .\[\&_\[data-slot\=settings-section-description\]\]\:\[font-size\:var\(--type-body\)\] [data-slot=settings-section-description] {
    font-size: var(--type-body);
  }
  .\[\&_\[data-slot\=settings-section-description\]\]\:leading-\[22px\] [data-slot=settings-section-description] {
    --tw-leading: 22px;
    line-height: 22px;
  }
  .\[\&_\[data-slot\=settings-section-header\]\]\:mx-4 [data-slot=settings-section-header] {
    margin-inline: calc(var(--spacing) * 4);
  }
  .\[\&_\[data-slot\=settings-section-header\]\+\[data-slot\=settings-section-rows\]\]\:mt-4 [data-slot=settings-section-header] + [data-slot=settings-section-rows] {
    margin-top: calc(var(--spacing) * 4);
  }
  .\[\&_\[data-slot\=settings-section-heading\]\]\:\[font-size\:var\(--type-heading-section\)\] [data-slot=settings-section-heading] {
    font-size: var(--type-heading-section);
  }
  .\[\&_\[data-slot\=settings-section-heading\]\]\:leading-\[var\(--type-heading-section-line\)\] [data-slot=settings-section-heading] {
    --tw-leading: var(--type-heading-section-line);
    line-height: var(--type-heading-section-line);
  }
  .\[\&_\[data-slot\=state-frame-actions\]\]\:justify-center [data-slot=state-frame-actions] {
    justify-content: center;
  }
  .\[\&_\[data-slot\=state-frame-icon\]\]\:justify-center [data-slot=state-frame-icon] {
    justify-content: center;
  }
  .\[\&_\[data-slot\=state-frame-title\]\]\:\[font-size\:var\(--type-workbench-primary\)\] [data-slot=state-frame-title] {
    font-size: var(--type-workbench-primary);
  }
  .\[\&_\[data-slot\=state-frame-title\]\]\:leading-\[var\(--type-workbench-primary-line\)\] [data-slot=state-frame-title] {
    --tw-leading: var(--type-workbench-primary-line);
    line-height: var(--type-workbench-primary-line);
  }
  .\[\&_\[data-slot\=state-frame-title\]\]\:\[font-weight\:var\(--font-weight-medium\)\] [data-slot=state-frame-title] {
    font-weight: var(--font-weight-medium);
  }
  .\[\&_\[data-slot\=wallet-artwork\]\]\:size-12 [data-slot=wallet-artwork] {
    width: calc(var(--spacing) * 12);
    height: calc(var(--spacing) * 12);
  }
  .\[\&_\[data-ui-button\]\]\:h-\[var\(--control-standard\)\] [data-ui-button] {
    height: var(--control-standard);
  }
  .\[\&_\[role\=timer\]\]\:tabular-nums [role=timer] {
    --tw-numeric-spacing: tabular-nums;
    font-variant-numeric: var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,);
  }
  .\[\&_a\]\:inline-flex a {
    display: inline-flex;
  }
  .\[\&_a\]\:h-6 a {
    height: calc(var(--spacing) * 6);
  }
  .\[\&_a\]\:min-w-0 a {
    min-width: 0px;
  }
  .\[\&_a\]\:items-center a {
    align-items: center;
  }
  .\[\&_a\]\:rounded-\[var\(--radius-control\)\] a {
    border-radius: var(--radius-control);
  }
  .\[\&_a\]\:ps-1 a {
    padding-inline-start: var(--spacing);
  }
  .\[\&_a\]\:pe-\[5px\] a {
    padding-inline-end: 5px;
  }
  .\[\&_a\]\:font-medium a {
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
  }
  .\[\&_a\]\:break-all a {
    word-break: break-all;
  }
  .\[\&_a\]\:text-\[var\(--link-foreground\)\] a {
    color: var(--link-foreground);
  }
  .\[\&_a\]\:text-\[var\(--secondary-foreground\)\] a {
    color: var(--secondary-foreground);
  }
  .\[\&_a\]\:no-underline a {
    text-decoration-line: none;
  }
  .\[\&_a\]\:underline a {
    text-decoration-line: underline;
  }
  .\[\&_a\]\:\[text-decoration-thickness\:1px\] a {
    text-decoration-thickness: 1px;
  }
  .\[\&_a\]\:underline-offset-2 a {
    text-underline-offset: 2px;
  }
  .\[\&_a\]\:transition-\[background-color\,color\] a {
    transition-property: background-color,color;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }
  .\[\&_a\]\:transition-\[color\,text-decoration-color\] a {
    transition-property: color,text-decoration-color;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }
  .\[\&_a\]\:duration-\[var\(--motion-control\)\] a {
    --tw-duration: var(--motion-control);
    transition-duration: var(--motion-control);
  }
  .\[\&_a\]\:ease-\[var\(--ease-standard\)\] a {
    --tw-ease: var(--ease-standard);
    transition-timing-function: var(--ease-standard);
  }
  .\[\&_a\:hover\]\:bg-\[var\(--control-hover\)\] a:hover {
    background-color: var(--control-hover);
  }
  .\[\&_a\:hover\]\:text-\[var\(--foreground\)\] a:hover {
    color: var(--foreground);
  }
  .\[\&_a\:hover\]\:\[text-decoration-color\:transparent\] a:hover {
    text-decoration-color: transparent;
  }
  .\[\&_blockquote\]\:my-2 blockquote {
    margin-block: calc(var(--spacing) * 2);
  }
  .\[\&_blockquote\]\:border-s-2 blockquote {
    border-inline-start-style: var(--tw-border-style);
    border-inline-start-width: 2px;
  }
  .\[\&_blockquote\]\:border-\[var\(--material-border-strong\)\] blockquote {
    border-color: var(--material-border-strong);
  }
  .\[\&_blockquote\]\:ps-3 blockquote {
    padding-inline-start: calc(var(--spacing) * 3);
  }
  .\[\&_code\]\:rounded-sm code {
    border-radius: var(--radius-sm);
  }
  .\[\&_code\]\:bg-\[var\(--material-panel-muted\)\] code {
    background-color: var(--material-panel-muted);
  }
  .\[\&_code\]\:px-1 code {
    padding-inline: var(--spacing);
  }
  .\[\&_code\]\:py-0\.5 code {
    padding-block: calc(var(--spacing) * 0.5);
  }
  .\[\&_figure\]\:my-\[22px\] figure {
    margin-block: 22px;
  }
  .\[\&_h1\]\:mt-4 h1 {
    margin-top: calc(var(--spacing) * 4);
  }
  .\[\&_h1\]\:mb-2 h1 {
    margin-bottom: calc(var(--spacing) * 2);
  }
  .\[\&_h2\]\:mt-4 h2 {
    margin-top: calc(var(--spacing) * 4);
  }
  .\[\&_h2\]\:mb-2 h2 {
    margin-bottom: calc(var(--spacing) * 2);
  }
  .\[\&_h3\]\:mt-3 h3 {
    margin-top: calc(var(--spacing) * 3);
  }
  .\[\&_h3\]\:mt-\[var\(--space-section-standard\)\] h3 {
    margin-top: var(--space-section-standard);
  }
  .\[\&_h3\]\:mb-1\.5 h3 {
    margin-bottom: calc(var(--spacing) * 1.5);
  }
  .\[\&_h3\]\:\[font-size\:17px\] h3 {
    font-size: 17px;
  }
  .\[\&_h3\]\:leading-6 h3 {
    --tw-leading: calc(var(--spacing) * 6);
    line-height: calc(var(--spacing) * 6);
  }
  .\[\&_h3\]\:\[font-weight\:var\(--font-weight-medium\)\] h3 {
    font-weight: var(--font-weight-medium);
  }
  .\[\&_h3\]\:\[letter-spacing\:var\(--tracking-section\)\] h3 {
    letter-spacing: var(--tracking-section);
  }
  .\[\&_hr\]\:my-3 hr {
    margin-block: calc(var(--spacing) * 3);
  }
  .\[\&_hr\]\:mt-\[22px\] hr {
    margin-top: 22px;
  }
  .\[\&_hr\]\:mb-\[23px\] hr {
    margin-bottom: 23px;
  }
  .\[\&_hr\]\:h-px hr {
    height: 1px;
  }
  .\[\&_hr\]\:border-0 hr {
    border-style: var(--tw-border-style);
    border-width: 0px;
  }
  .\[\&_hr\]\:border-\[var\(--material-border\)\] hr {
    border-color: var(--material-border);
  }
  .\[\&_hr\]\:bg-\[var\(--border\)\] hr {
    background-color: var(--border);
  }
  .\[\&_iframe\]\:my-\[22px\] iframe {
    margin-block: 22px;
  }
  .\[\&_img\]\:my-\[22px\] img {
    margin-block: 22px;
  }
  .\[\&_li\]\:my-1 li {
    margin-block: var(--spacing);
  }
  .\[\&_ol\]\:m-0 ol {
    margin: 0px;
  }
  .\[\&_ol\]\:my-2 ol {
    margin-block: calc(var(--spacing) * 2);
  }
  .\[\&_ol\]\:list-decimal ol {
    list-style-type: decimal;
  }
  .\[\&_ol\]\:ps-\[var\(--space-section-standard\)\] ol {
    padding-inline-start: var(--space-section-standard);
  }
  .\[\&_p\]\:my-2 p {
    margin-block: calc(var(--spacing) * 2);
  }
  .\[\&_p\+p\]\:mt-\[var\(--space-section-compact\)\] p + p {
    margin-top: var(--space-section-compact);
  }
  .\[\&_pre\]\:max-w-full pre {
    max-width: 100%;
  }
  .\[\&_pre\]\:overflow-x-auto pre {
    overflow-x: auto;
  }
  .\[\&_strong\]\:font-medium strong {
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
  }
  .\[\&_svg\]\:pointer-events-none svg {
    pointer-events: none;
  }
  .\[\&_svg\]\:size-3\.5 svg {
    width: calc(var(--spacing) * 3.5);
    height: calc(var(--spacing) * 3.5);
  }
  .\[\&_svg\]\:size-4 svg {
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
  }
  .\[\&_svg\]\:shrink-0 svg {
    flex-shrink: 0;
  }
  .\[\&_svg\]\:text-\[var\(--menu-muted\)\] svg {
    color: var(--menu-muted);
  }
  .\[\&_svg\]\:text-current svg {
    color: currentcolor;
  }
  .\[\&_svg\:not\(\[class\*\=size-\]\)\]\:size-3 svg:not([class*=size-]) {
    width: calc(var(--spacing) * 3);
    height: calc(var(--spacing) * 3);
  }
  .\[\&_svg\:not\(\[class\*\=size-\]\)\]\:size-3\.5 svg:not([class*=size-]) {
    width: calc(var(--spacing) * 3.5);
    height: calc(var(--spacing) * 3.5);
  }
  .\[\&_svg\:not\(\[class\*\=size-\]\)\]\:size-4 svg:not([class*=size-]) {
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
  }
  .\[\&_svg\:not\(\[class\*\=size-\]\)\]\:size-\[length\:var\(--icon-toolbar\)\] svg:not([class*=size-]) {
    width: var(--icon-toolbar);
    height: var(--icon-toolbar);
  }
  .\[\&_td\]\:py-\[var\(--zml-cell-block\,var\(--space-stack-standard\)\)\] td {
    padding-block: var(--zml-cell-block,var(--space-stack-standard));
  }
  .\[\&_td\]\:align-top td {
    vertical-align: top;
  }
  .\[\&_td\]\:whitespace-normal td {
    white-space: normal;
  }
  .\[\&_th\[scope\=row\]\]\:py-\[var\(--zml-cell-block\,var\(--space-stack-standard\)\)\] th[scope=row] {
    padding-block: var(--zml-cell-block,var(--space-stack-standard));
  }
  .\[\&_th\[scope\=row\]\]\:align-top th[scope=row] {
    vertical-align: top;
  }
  .\[\&_th\[scope\=row\]\]\:whitespace-normal th[scope=row] {
    white-space: normal;
  }
  .\[\&_ul\]\:m-0 ul {
    margin: 0px;
  }
  .\[\&_ul\]\:my-2 ul {
    margin-block: calc(var(--spacing) * 2);
  }
  .\[\&_ul\]\:list-disc ul {
    list-style-type: disc;
  }
  .\[\&_ul\]\:ps-\[var\(--space-section-standard\)\] ul {
    padding-inline-start: var(--space-section-standard);
  }
  .\[\&_video\]\:my-\[22px\] video {
    margin-block: 22px;
  }
  .\[\&\:\:-webkit-details-marker\]\:hidden::-webkit-details-marker {
    display: none;
  }
  .\[\&\:\:-webkit-scrollbar\]\:hidden::-webkit-scrollbar {
    display: none;
  }
  @media (width < 48rem) {
    .max-md\:\[\&\:\:-webkit-scrollbar\]\:hidden::-webkit-scrollbar {
      display: none;
    }
  }
  .\[\&\:\:-webkit-search-cancel-button\]\:appearance-none::-webkit-search-cancel-button {
    appearance: none;
  }
  .\[\&\:\:-webkit-search-decoration\]\:appearance-none::-webkit-search-decoration {
    appearance: none;
  }
  .\[\&\:dir\(rtl\)\]\:-scale-x-100:dir(rtl) {
    --tw-scale-x: calc(100% * -1);
    scale: var(--tw-scale-x) var(--tw-scale-y);
  }
  .\[\&\:has\(\[data-slot\=ordered-view-rail-actions\]\>\[data-slot\=view-actions\]\:only-child\:empty\)\]\:hidden:has([data-slot=ordered-view-rail-actions] > [data-slot=view-actions]:only-child:empty) {
    display: none;
  }
  .\[\&\:is\(\[data-popup-open\]\:not\(\[data-passive-popup-trigger\]\)\,\[aria-expanded\=true\]\,\[aria-pressed\=true\]\)\]\:bg-\[var\(--chip-surface-pressed\)\]:is([data-popup-open]:not([data-passive-popup-trigger]), [aria-expanded=true], [aria-pressed=true]) {
    background-color: var(--chip-surface-pressed);
  }
  .\[\&\:is\(\[data-popup-open\]\:not\(\[data-passive-popup-trigger\]\)\,\[aria-expanded\=true\]\,\[aria-pressed\=true\]\)\]\:text-\[var\(--foreground\)\]:is([data-popup-open]:not([data-passive-popup-trigger]), [aria-expanded=true], [aria-pressed=true]) {
    color: var(--foreground);
  }
  .\[\&\:is\(\[data-popup-open\]\:not\(\[data-passive-popup-trigger\]\)\,\[aria-expanded\=true\]\,\[aria-pressed\=true\]\)\]\:before\:shadow-\[var\(--shadow-raised-pressed\)\]:is([data-popup-open]:not([data-passive-popup-trigger]), [aria-expanded=true], [aria-pressed=true])::before {
    content: var(--tw-content);
    --tw-shadow: var(--shadow-raised-pressed);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .\[\&\:is\(\[data-popup-open\]\:not\(\[data-passive-popup-trigger\]\)\,\[aria-expanded\=true\]\,\[aria-pressed\=true\]\)\:is\(\:hover\,\:active\)\]\:bg-\[var\(--chip-surface-pressed\)\]:is([data-popup-open]:not([data-passive-popup-trigger]), [aria-expanded=true], [aria-pressed=true]):is(:hover, :active) {
    background-color: var(--chip-surface-pressed);
  }
  .\[\&\:is\(\[data-popup-open\]\:not\(\[data-passive-popup-trigger\]\)\,\[aria-expanded\=true\]\,\[aria-pressed\=true\]\)\:is\(\:hover\,\:active\)\]\:before\:shadow-\[var\(--shadow-raised-pressed\)\]:is([data-popup-open]:not([data-passive-popup-trigger]), [aria-expanded=true], [aria-pressed=true]):is(:hover, :active)::before {
    content: var(--tw-content);
    --tw-shadow: var(--shadow-raised-pressed);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .\[\&\:is\(button\,summary\,a\[href\]\)\]\:cursor-pointer:is(button, summary, a[href]) {
    cursor: pointer;
  }
  .\[\&\:is\(button\,summary\,a\[href\]\)\:hover\]\:bg-\[var\(--rail-item-hover\)\]:is(button, summary, a[href]):hover {
    background-color: var(--rail-item-hover);
  }
  .\[\&\:is\(button\,summary\,a\[href\]\)\:hover\]\:text-\[var\(--foreground\)\]:is(button, summary, a[href]):hover {
    color: var(--foreground);
  }
  .\[\&\:not\(\:first-child\)\]\:mt-\[var\(--space-inline-compact\)\]:not(:first-child) {
    margin-top: var(--space-inline-compact);
  }
  .\[\&\:not\(\[data-zml-frozen-surface\]_\*\)\:is\(\[aria-expanded\=true\]\,\[data-popup-open\]\:not\(\[data-passive-popup-trigger\]\)\)\]\:border-\[var\(--border-strong\)\]:not([data-zml-frozen-surface] *):is([aria-expanded=true], [data-popup-open]:not([data-passive-popup-trigger])) {
    border-color: var(--border-strong);
  }
  .\[\&\:not\(\[data-zml-frozen-surface\]_\*\)\:is\(\[aria-expanded\=true\]\,\[data-popup-open\]\:not\(\[data-passive-popup-trigger\]\)\)\]\:bg-\[var\(--chip-surface-pressed\)\]:not([data-zml-frozen-surface] *):is([aria-expanded=true], [data-popup-open]:not([data-passive-popup-trigger])) {
    background-color: var(--chip-surface-pressed);
  }
  .\[\&\:not\(\[data-zml-frozen-surface\]_\*\)\:is\(\[aria-expanded\=true\]\,\[data-popup-open\]\:not\(\[data-passive-popup-trigger\]\)\)\]\:bg-\[var\(--control-open\)\]:not([data-zml-frozen-surface] *):is([aria-expanded=true], [data-popup-open]:not([data-passive-popup-trigger])) {
    background-color: var(--control-open);
  }
  .\[\&\:not\(\[data-zml-frozen-surface\]_\*\)\:is\(\[aria-expanded\=true\]\,\[data-popup-open\]\:not\(\[data-passive-popup-trigger\]\)\)\]\:bg-\[var\(--control-selected\)\]:not([data-zml-frozen-surface] *):is([aria-expanded=true], [data-popup-open]:not([data-passive-popup-trigger])) {
    background-color: var(--control-selected);
  }
  .\[\&\:not\(\[data-zml-frozen-surface\]_\*\)\:is\(\[aria-expanded\=true\]\,\[data-popup-open\]\:not\(\[data-passive-popup-trigger\]\)\)\]\:bg-\[var\(--destructive-wash\)\]:not([data-zml-frozen-surface] *):is([aria-expanded=true], [data-popup-open]:not([data-passive-popup-trigger])) {
    background-color: var(--destructive-wash);
  }
  .\[\&\:not\(\[data-zml-frozen-surface\]_\*\)\:is\(\[aria-expanded\=true\]\,\[data-popup-open\]\:not\(\[data-passive-popup-trigger\]\)\)\]\:bg-\[var\(--primary-hover\)\]:not([data-zml-frozen-surface] *):is([aria-expanded=true], [data-popup-open]:not([data-passive-popup-trigger])) {
    background-color: var(--primary-hover);
  }
  .\[\&\:not\(\[data-zml-frozen-surface\]_\*\)\:is\(\[aria-expanded\=true\]\,\[data-popup-open\]\:not\(\[data-passive-popup-trigger\]\)\)\]\:text-\[var\(--foreground\)\]:not([data-zml-frozen-surface] *):is([aria-expanded=true], [data-popup-open]:not([data-passive-popup-trigger])) {
    color: var(--foreground);
  }
  .\[\&\:not\(\[data-zml-frozen-surface\]_\*\)\:is\(\[aria-expanded\=true\]\,\[data-popup-open\]\:not\(\[data-passive-popup-trigger\]\)\)\]\:before\:shadow-\[var\(--shadow-hairline-hover\)\,var\(--shadow-main-surface\)\]:not([data-zml-frozen-surface] *):is([aria-expanded=true], [data-popup-open]:not([data-passive-popup-trigger]))::before {
    content: var(--tw-content);
    --tw-shadow: var(--shadow-hairline-hover), var(--shadow-main-surface);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .\[\&\>\*\]\:order-none > * {
    order: 0;
  }
  .\[\&\>\*\]\:col-span-2 > * {
    grid-column: span 2 / span 2;
  }
  .\[\&\>\*\]\:ms-px > * {
    margin-inline-start: 1px;
  }
  .\[\&\>\*\]\:h-full > * {
    height: 100%;
  }
  .\[\&\>\*\]\:w-auto > * {
    width: auto;
  }
  .\[\&\>\*\]\:w-full > * {
    width: 100%;
  }
  .\[\&\>\*\]\:max-w-full > * {
    max-width: 100%;
  }
  .\[\&\>\*\]\:min-w-0 > * {
    min-width: 0px;
  }
  .\[\&\>\*\]\:shrink-0 > * {
    flex-shrink: 0;
  }
  .\[\&\>\*\]\:truncate > * {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .\[\&\>\*\]\:\[grid-area\:1\/1\] > * {
    grid-area: 1/1;
  }
  @container (width >= 32rem) {
    .\@lg\:\[\&\>\*\]\:w-auto > * {
      width: auto;
    }
  }
  .\[\&\>\*\:last-child\]\:min-w-\[8ch\] > :last-child {
    min-width: 8ch;
  }
  .\[\&\>\*\:last-child\]\:text-end > :last-child {
    text-align: end;
  }
  .\[\&\>\*\:not\(\[data-slot\=settings-row-status\]\)\]\:min-w-0 > :not([data-slot=settings-row-status]) {
    min-width: 0px;
  }
  .\[\&\>\*\:not\(\[data-slot\=settings-row-status\]\)\]\:flex-1 > :not([data-slot=settings-row-status]) {
    flex: 1;
  }
  .\[\&\>\*\:nth-last-child\(2\)\]\:min-w-\[4ch\] > :nth-last-child(2) {
    min-width: 4ch;
  }
  .\[\&\>\*\:nth-last-child\(2\)\]\:text-center > :nth-last-child(2) {
    text-align: center;
  }
  .\[\&\>\*\:nth-last-child\(3\)\]\:min-w-\[10ch\] > :nth-last-child(3) {
    min-width: 10ch;
  }
  .\[\&\>\*\:nth-last-child\(3\)\]\:text-end > :nth-last-child(3) {
    text-align: end;
  }
  .\[\&\>\:first-child\]\:self-center > :first-child {
    align-self: center;
  }
  .\[\&\>\:is\(td\,th\)\]\:bg-\[var\(--row-fill-current\)\] > :is(td, th) {
    background-color: var(--row-fill-current);
  }
  .\[\&\>\:is\(td\,th\)\]\:bg-\[var\(--row-fill-selected\)\] > :is(td, th) {
    background-color: var(--row-fill-selected);
  }
  .\[\&\>\:is\(td\,th\)\]\:bg-\[var\(--zml-table-host-surface\,var\(--zml-table-surface\,var\(--work-surface\)\)\)\] > :is(td, th) {
    background-color: var(--zml-table-host-surface,var(--zml-table-surface,var(--work-surface)));
  }
  .\[\&\>\:is\(td\,th\)\]\:bg-\[var\(--zml-table-surface\,var\(--work-surface\)\)\] > :is(td, th) {
    background-color: var(--zml-table-surface,var(--work-surface));
  }
  .\[\&\>\:is\(td\,th\)\]\:\[background-image\:linear-gradient\(var\(--border\)\,var\(--border\)\)\] > :is(td, th) {
    background-image: linear-gradient(var(--border),var(--border));
  }
  .\[\&\>\:is\(td\,th\)\]\:\[background-size\:100\%_1px\] > :is(td, th) {
    background-size: 100% 1px;
  }
  .\[\&\>\:is\(td\,th\)\]\:bg-no-repeat > :is(td, th) {
    background-repeat: no-repeat;
  }
  @media (hover: hover) {
    .hover\:\[\&\>\:is\(td\,th\)\]\:bg-\[var\(--row-fill-current\)\]:hover > :is(td, th) {
      background-color: var(--row-fill-current);
    }
    .hover\:\[\&\>\:is\(td\,th\)\]\:bg-\[var\(--row-fill-hover\)\]:hover > :is(td, th) {
      background-color: var(--row-fill-hover);
    }
    .hover\:\[\&\>\:is\(td\,th\)\]\:bg-\[var\(--row-fill-selected\)\]:hover > :is(td, th) {
      background-color: var(--row-fill-selected);
    }
    .hover\:\[\&\>\:is\(td\,th\)\]\:bg-\[var\(--row-fill-selected-hover\)\]:hover > :is(td, th) {
      background-color: var(--row-fill-selected-hover);
    }
  }
  .\[\&\>\:is\(th\,td\)\]\:border-b > :is(th, td) {
    border-bottom-style: var(--tw-border-style);
    border-bottom-width: 1px;
  }
  .\[\&\>\:is\(th\,td\)\]\:border-\[var\(--border-subtle\)\] > :is(th, td) {
    border-color: var(--border-subtle);
  }
  .\[\&\>\:is\(th\,td\)\]\:bg-\[var\(--zml-data-row-surface\)\] > :is(th, td) {
    background-color: var(--zml-data-row-surface);
  }
  .\[\&\>\[data-field-span\=full\]\]\:col-span-full > [data-field-span=full] {
    grid-column: 1 / -1;
  }
  .\[\&\>\[data-slot\=button-content\]\]\:w-full > [data-slot=button-content] {
    width: 100%;
  }
  .\[\&\>\[data-slot\=button-link\]\]\:w-auto > [data-slot=button-link] {
    width: auto;
  }
  .\[\&\>\[data-slot\=button-link\]\]\:max-w-full > [data-slot=button-link] {
    max-width: 100%;
  }
  .\[\&\>\[data-slot\=button\]\]\:h-auto > [data-slot=button] {
    height: auto;
  }
  .\[\&\>\[data-slot\=button\]\]\:min-h-\[var\(--control-form\)\] > [data-slot=button] {
    min-height: var(--control-form);
  }
  .\[\&\>\[data-slot\=button\]\]\:w-auto > [data-slot=button] {
    width: auto;
  }
  .\[\&\>\[data-slot\=button\]\]\:max-w-full > [data-slot=button] {
    max-width: 100%;
  }
  .\[\&\>\[data-slot\=button\]\]\:py-\[var\(--space-inline-compact\)\] > [data-slot=button] {
    padding-block: var(--space-inline-compact);
  }
  .\[\&\>\[data-slot\=button\]\]\:whitespace-normal > [data-slot=button] {
    white-space: normal;
  }
  .\[\&\>\[data-slot\=combination-leg\]\+\[data-slot\=combination-leg\]\]\:ms-\[var\(--space-inline-standard\)\] > [data-slot=combination-leg] + [data-slot=combination-leg] {
    margin-inline-start: var(--space-inline-standard);
  }
  .\[\&\>\[data-slot\=disabled-action-hint\]\]\:w-auto > [data-slot=disabled-action-hint] {
    width: auto;
  }
  .\[\&\>\[data-slot\=disabled-action-hint\]\]\:max-w-full > [data-slot=disabled-action-hint] {
    max-width: 100%;
  }
  .\[\&\>\[data-slot\=disabled-action-hint\]\>a\]\:w-auto > [data-slot=disabled-action-hint] > a {
    width: auto;
  }
  .\[\&\>\[data-slot\=disabled-action-hint\]\>button\:not\(\[data-icon-button\]\)\]\:w-auto > [data-slot=disabled-action-hint] > button:not([data-icon-button]) {
    width: auto;
  }
  .\[\&\>\[data-slot\=nav-item-label\]\]\:line-clamp-2 > [data-slot=nav-item-label] {
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
  }
  .\[\&\>\[data-slot\=nav-item-label\]\]\:min-w-0 > [data-slot=nav-item-label] {
    min-width: 0px;
  }
  .\[\&\>\[data-slot\=nav-item-label\]\]\:flex-1 > [data-slot=nav-item-label] {
    flex: 1;
  }
  .\[\&\>\[data-slot\=nav-item-label\]\]\:truncate > [data-slot=nav-item-label] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .\[\&\>\[data-slot\=nav-item-label\]\]\:break-words > [data-slot=nav-item-label] {
    overflow-wrap: break-word;
  }
  .\[\&\>\[data-slot\=settings-row-control\]\]\:w-\[min\(100\%\,20rem\)\] > [data-slot=settings-row-control] {
    width: min(100%, 20rem);
  }
  .\[\&\>\[data-slot\=settings-row\]\+\[data-slot\=settings-row\]\]\:border-t > [data-slot=settings-row] + [data-slot=settings-row] {
    border-top-style: var(--tw-border-style);
    border-top-width: 1px;
  }
  .\[\&\>\[data-slot\=settings-row\]\+\[data-slot\=settings-row\]\]\:border-\[var\(--border-subtle\)\] > [data-slot=settings-row] + [data-slot=settings-row] {
    border-color: var(--border-subtle);
  }
  .\[\&\>a\]\:w-auto > a {
    width: auto;
  }
  .\[\&\>button\]\:w-full > button {
    width: 100%;
  }
  .\[\&\>button\:not\(\[data-icon-button\]\)\]\:w-auto > button:not([data-icon-button]) {
    width: auto;
  }
  .\[\&\>img\]\:size-9 > img {
    width: calc(var(--spacing) * 9);
    height: calc(var(--spacing) * 9);
  }
  .\[\&\>summary\]\:w-fit > summary {
    width: fit-content;
  }
  .\[\&\>summary\]\:cursor-pointer > summary {
    cursor: pointer;
  }
  .\[\&\>summary\]\:underline > summary {
    text-decoration-line: underline;
  }
  .\[\&\>summary\]\:decoration-dotted > summary {
    text-decoration-style: dotted;
  }
  .\[\&\>summary\]\:underline-offset-2 > summary {
    text-underline-offset: 2px;
  }
  .\[\&\>svg\]\:pointer-events-none > svg {
    pointer-events: none;
  }
  .\[\&\>svg\]\:size-9 > svg {
    width: calc(var(--spacing) * 9);
    height: calc(var(--spacing) * 9);
  }
  .\[\&\>svg\]\:size-\[var\(--checkbox-indicator-size\)\] > svg {
    width: var(--checkbox-indicator-size);
    height: var(--checkbox-indicator-size);
  }
  .\[\&\>svg\]\:opacity-0 > svg {
    opacity: 0%;
  }
  .peer-checked\:\[\&\>svg\]\:opacity-100:is(:where(.peer):checked ~ *) > svg {
    opacity: 100%;
  }
  .\[\&\>svg\:not\(\[class\*\=size-\]\)\]\:size-\[var\(--icon-micro\)\] > svg:not([class*=size-]) {
    width: var(--icon-micro);
    height: var(--icon-micro);
  }
  .\[\&\>tr\]\:h-\[var\(--zml-table-header\)\] > tr {
    height: var(--zml-table-header);
  }
  .\[\&\[data-disabled\]_svg\]\:text-\[var\(--disabled-foreground\)\][data-disabled] svg {
    color: var(--disabled-foreground);
  }
  .\[\&\[data-disabled\]\[data-highlighted\]_svg\]\:text-\[var\(--disabled-foreground\)\][data-disabled][data-highlighted] svg {
    color: var(--disabled-foreground);
  }
  .\[\&\[data-ending-style\]\:not\(\[data-limited\]\)\:not\(\[data-swipe-direction\]\)\]\:\[transform\:translateY\(calc\(var\(--zml-toast-offset\)\+var\(--motion-floating-offset\)\)\)\][data-ending-style]:not([data-limited]):not([data-swipe-direction]) {
    transform: translateY(calc(var(--zml-toast-offset) + var(--motion-floating-offset)));
  }
  .\[\&\[data-highlighted\]_\[data-slot\=menu-sub-indicator\]\]\:text-\[var\(--menu-muted\)\][data-highlighted] [data-slot=menu-sub-indicator] {
    color: var(--menu-muted);
  }
  .\[\&\[data-highlighted\]_svg\]\:text-\[var\(--foreground\)\][data-highlighted] svg {
    color: var(--foreground);
  }
  .\[\&\[data-pending\]\>\*\:not\(\[data-slot\=button-spinner\]\)\]\:opacity-0[data-pending] > :not([data-slot=button-spinner]) {
    opacity: 0%;
  }
  .\[\&\[data-pending\]\>\*\:not\(\[data-slot\=button-spinner\]\)\]\:opacity-100[data-pending] > :not([data-slot=button-spinner]) {
    opacity: 100%;
  }
  .\[\&\[data-popup-open\]_\[data-slot\=menu-sub-indicator\]\]\:text-\[var\(--menu-muted\)\][data-popup-open] [data-slot=menu-sub-indicator] {
    color: var(--menu-muted);
  }
  .\[\&\[data-selected\=true\]\:not\(\[data-first-selected\=true\]\)\:not\(\[data-first-in-group\=true\]\)\]\:before\:rounded-t-none[data-selected=true]:not([data-first-selected=true]):not([data-first-in-group=true])::before {
    content: var(--tw-content);
    border-top-left-radius: 0;
    border-top-right-radius: 0;
  }
  .\[\&\[data-selected\=true\]\:not\(\[data-last-selected\=true\]\)\:not\(\[data-last-in-group\=true\]\)\]\:before\:rounded-b-none[data-selected=true]:not([data-last-selected=true]):not([data-last-in-group=true])::before {
    content: var(--tw-content);
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
  }
  .\[\&\[data-selected\]_\[data-slot\=combobox-item-indicator\]\]\:opacity-100[data-selected] [data-slot=combobox-item-indicator] {
    opacity: 100%;
  }
  .\[\&\[data-selected\]_\[data-slot\=select-item-indicator\]\]\:opacity-100[data-selected] [data-slot=select-item-indicator] {
    opacity: 100%;
  }
  .\[\&\[data-variant\=destructive\]_svg\]\:text-\[var\(--destructive\)\][data-variant=destructive] svg {
    color: var(--destructive);
  }
  .\[\&\[hidden\]\:not\(\[hidden\=\'until-found\'\]\)\]\:hidden[hidden]:not([hidden='until-found']) {
    display: none;
  }
  @media (any-pointer:coarse) {
    .\[\@media\(any-pointer\:coarse\)\]\:min-h-10 {
      min-height: calc(var(--spacing) * 10);
    }
    .\[\@media\(any-pointer\:coarse\)\]\:min-h-\[var\(--hit-plane-coarse\)\] {
      min-height: var(--hit-plane-coarse);
    }
    .\[\@media\(any-pointer\:coarse\)\]\:\[\&\:not\(\[data-ui-button\]\)\:not\(\[data-coarse-hit\]\)\]\:min-h-\[var\(--hit-plane-coarse\)\]:not([data-ui-button]):not([data-coarse-hit]) {
      min-height: var(--hit-plane-coarse);
    }
  }
  [data-slot=auth-field] + .\[\[data-slot\=auth-field\]\+\&\]\:mt-\[calc\(-1\*var\(--space-inline-wide\)\)\] {
    margin-top: calc(-1 * var(--space-inline-wide));
  }
  [data-slot=bar-leading-context] + .\[\[data-slot\=bar-leading-context\]\+\&\]\:ps-0 {
    padding-inline-start: 0px;
  }
  [data-slot=display-options-body] > .\[\[data-slot\=display-options-body\]\>\&\]\:grid-cols-subgrid {
    grid-template-columns: subgrid;
  }
  [data-slot=display-options-layouts] + .\[\[data-slot\=display-options-layouts\]\+\&\]\:border-t-0 {
    border-top-style: var(--tw-border-style);
    border-top-width: 0px;
  }
  [data-slot=display-options-section] > .\[\[data-slot\=display-options-section\]\>\&\]\:grid-cols-subgrid {
    grid-template-columns: subgrid;
  }
  [data-slot=field-hint] ~ .\[\[data-slot\=field-hint\]\~\&\]\:hidden {
    display: none;
  }
  [data-slot=global-rail] + .\[\[data-slot\=global-rail\]\+\&\]\:ms-0 {
    margin-inline-start: 0px;
  }
  @media (width >= 80rem) {
    [data-slot=global-rail] + .xl\:\[\[data-slot\=global-rail\]\+\&\]\:ms-0 {
      margin-inline-start: 0px;
    }
  }
  [data-slot=table-surface][data-overflow] .\[\[data-slot\=table-surface\]\[data-overflow\]_\&\]\:shadow-\[inset_-1px_0_0_var\(--border-subtle\)\] {
    --tw-shadow: inset -1px 0 0 var(--tw-shadow-color, var(--border-subtle));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  [data-slot=table-surface][data-overflow] .\[\[data-slot\=table-surface\]\[data-overflow\]_\&\]\:shadow-\[inset_1px_0_0_var\(--border-subtle\)\] {
    --tw-shadow: inset 1px 0 0 var(--tw-shadow-color, var(--border-subtle));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  @container table (width >= 28rem) {
    [data-slot=table-surface][data-overflow] .\@md\/table\:\[\[data-slot\=table-surface\]\[data-overflow\]_\&\]\:shadow-\[inset_-1px_0_0_var\(--border-subtle\)\] {
      --tw-shadow: inset -1px 0 0 var(--tw-shadow-color, var(--border-subtle));
      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    }
    [data-slot=table-surface][data-overflow] .\@md\/table\:\[\[data-slot\=table-surface\]\[data-overflow\]_\&\]\:shadow-\[inset_1px_0_0_var\(--border-subtle\)\] {
      --tw-shadow: inset 1px 0 0 var(--tw-shadow-color, var(--border-subtle));
      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    }
  }
  [data-slot=table-surface][data-overflow]:not([data-at-end]) .\[\[data-slot\=table-surface\]\[data-overflow\]\:not\(\[data-at-end\]\)_\&\]\:shadow-\[inset_1px_0_0_var\(--border\)\] {
    --tw-shadow: inset 1px 0 0 var(--tw-shadow-color, var(--border));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  @container table (width >= 28rem) {
    [data-slot=table-surface][data-overflow]:not([data-at-end]) .\@md\/table\:\[\[data-slot\=table-surface\]\[data-overflow\]\:not\(\[data-at-end\]\)_\&\]\:shadow-\[inset_1px_0_0_var\(--border\)\] {
      --tw-shadow: inset 1px 0 0 var(--tw-shadow-color, var(--border));
      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    }
  }
  [data-slot=table-surface][data-scrolled] .\[\[data-slot\=table-surface\]\[data-scrolled\]_\&\]\:shadow-\[inset_-1px_0_0_var\(--border\)\] {
    --tw-shadow: inset -1px 0 0 var(--tw-shadow-color, var(--border));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  @container table (width >= 28rem) {
    [data-slot=table-surface][data-scrolled] .\@md\/table\:\[\[data-slot\=table-surface\]\[data-scrolled\]_\&\]\:shadow-\[inset_-1px_0_0_var\(--border\)\] {
      --tw-shadow: inset -1px 0 0 var(--tw-shadow-color, var(--border));
      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    }
  }
  [data-zml-frozen-surface] .\[\[data-zml-frozen-surface\]_\&\]\:\[--focus-offset-inset\:0px\] {
    --focus-offset-inset: 0px;
  }
  [data-zml-frozen-surface] .\[\[data-zml-frozen-surface\]_\&\]\:\[--zml-checkbox-border-checked-hover\:var\(--control-checked\)\] {
    --zml-checkbox-border-checked-hover: var(--control-checked);
  }
  [data-zml-frozen-surface] .\[\[data-zml-frozen-surface\]_\&\]\:\[--zml-checkbox-border-hover\:var\(--field-border-pressed\)\] {
    --zml-checkbox-border-hover: var(--field-border-pressed);
  }
  [data-zml-frozen-surface] .\[\[data-zml-frozen-surface\]_\&\]\:\[--zml-checkbox-border\:var\(--border-strong\)\] {
    --zml-checkbox-border: var(--border-strong);
  }
  [data-zml-frozen-surface] .\[\[data-zml-frozen-surface\]_\&\]\:\[--zml-checkbox-ease\:var\(--ease-standard\)\] {
    --zml-checkbox-ease: var(--ease-standard);
  }
  [data-zml-frozen-surface] .\[\[data-zml-frozen-surface\]_\&\]\:\[--zml-checkbox-fill-hover\:var\(--primary-hover\)\] {
    --zml-checkbox-fill-hover: var(--primary-hover);
  }
  [data-zml-frozen-surface] .\[\[data-zml-frozen-surface\]_\&\]\:\[--zml-checkbox-motion\:var\(--motion-checkbox\,var\(--motion-control\)\)\] {
    --zml-checkbox-motion: var(--motion-checkbox,var(--motion-control));
  }
  [data-zml-frozen-surface] .\[\[data-zml-frozen-surface\]_\&\]\:\[--zml-checkbox-radius\:var\(--radius-micro\)\] {
    --zml-checkbox-radius: var(--radius-micro);
  }
  [data-zml-frozen-surface] .\[\[data-zml-frozen-surface\]_\&\]\:\[--zml-checkbox-surface\:var\(--field\)\] {
    --zml-checkbox-surface: var(--field);
  }
}
@property --tw-border-spacing-x {
  syntax: "<length>";
  inherits: false;
  initial-value: 0;
}
@property --tw-border-spacing-y {
  syntax: "<length>";
  inherits: false;
  initial-value: 0;
}
@property --tw-translate-x {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@property --tw-translate-y {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@property --tw-translate-z {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@property --tw-rotate-x {
  syntax: "*";
  inherits: false;
}
@property --tw-rotate-y {
  syntax: "*";
  inherits: false;
}
@property --tw-rotate-z {
  syntax: "*";
  inherits: false;
}
@property --tw-skew-x {
  syntax: "*";
  inherits: false;
}
@property --tw-skew-y {
  syntax: "*";
  inherits: false;
}
@property --tw-pan-x {
  syntax: "*";
  inherits: false;
}
@property --tw-pan-y {
  syntax: "*";
  inherits: false;
}
@property --tw-pinch-zoom {
  syntax: "*";
  inherits: false;
}
@property --tw-space-y-reverse {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@property --tw-divide-y-reverse {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@property --tw-border-style {
  syntax: "*";
  inherits: false;
  initial-value: solid;
}
@property --tw-leading {
  syntax: "*";
  inherits: false;
}
@property --tw-font-weight {
  syntax: "*";
  inherits: false;
}
@property --tw-tracking {
  syntax: "*";
  inherits: false;
}
@property --tw-ordinal {
  syntax: "*";
  inherits: false;
}
@property --tw-slashed-zero {
  syntax: "*";
  inherits: false;
}
@property --tw-numeric-figure {
  syntax: "*";
  inherits: false;
}
@property --tw-numeric-spacing {
  syntax: "*";
  inherits: false;
}
@property --tw-numeric-fraction {
  syntax: "*";
  inherits: false;
}
@property --tw-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-shadow-color {
  syntax: "*";
  inherits: false;
}
@property --tw-shadow-alpha {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}
@property --tw-inset-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-inset-shadow-color {
  syntax: "*";
  inherits: false;
}
@property --tw-inset-shadow-alpha {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}
@property --tw-ring-color {
  syntax: "*";
  inherits: false;
}
@property --tw-ring-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-inset-ring-color {
  syntax: "*";
  inherits: false;
}
@property --tw-inset-ring-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-ring-inset {
  syntax: "*";
  inherits: false;
}
@property --tw-ring-offset-width {
  syntax: "<length>";
  inherits: false;
  initial-value: 0px;
}
@property --tw-ring-offset-color {
  syntax: "*";
  inherits: false;
  initial-value: #fff;
}
@property --tw-ring-offset-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-outline-style {
  syntax: "*";
  inherits: false;
  initial-value: solid;
}
@property --tw-blur {
  syntax: "*";
  inherits: false;
}
@property --tw-brightness {
  syntax: "*";
  inherits: false;
}
@property --tw-contrast {
  syntax: "*";
  inherits: false;
}
@property --tw-grayscale {
  syntax: "*";
  inherits: false;
}
@property --tw-hue-rotate {
  syntax: "*";
  inherits: false;
}
@property --tw-invert {
  syntax: "*";
  inherits: false;
}
@property --tw-opacity {
  syntax: "*";
  inherits: false;
}
@property --tw-saturate {
  syntax: "*";
  inherits: false;
}
@property --tw-sepia {
  syntax: "*";
  inherits: false;
}
@property --tw-drop-shadow {
  syntax: "*";
  inherits: false;
}
@property --tw-drop-shadow-color {
  syntax: "*";
  inherits: false;
}
@property --tw-drop-shadow-alpha {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}
@property --tw-drop-shadow-size {
  syntax: "*";
  inherits: false;
}
@property --tw-duration {
  syntax: "*";
  inherits: false;
}
@property --tw-ease {
  syntax: "*";
  inherits: false;
}
@property --tw-content {
  syntax: "*";
  initial-value: "";
  inherits: false;
}
@property --tw-scale-x {
  syntax: "*";
  inherits: false;
  initial-value: 1;
}
@property --tw-scale-y {
  syntax: "*";
  inherits: false;
  initial-value: 1;
}
@property --tw-scale-z {
  syntax: "*";
  inherits: false;
  initial-value: 1;
}
@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}
@layer properties {
  @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
    *, ::before, ::after, ::backdrop {
      --tw-border-spacing-x: 0;
      --tw-border-spacing-y: 0;
      --tw-translate-x: 0;
      --tw-translate-y: 0;
      --tw-translate-z: 0;
      --tw-rotate-x: initial;
      --tw-rotate-y: initial;
      --tw-rotate-z: initial;
      --tw-skew-x: initial;
      --tw-skew-y: initial;
      --tw-pan-x: initial;
      --tw-pan-y: initial;
      --tw-pinch-zoom: initial;
      --tw-space-y-reverse: 0;
      --tw-divide-y-reverse: 0;
      --tw-border-style: solid;
      --tw-leading: initial;
      --tw-font-weight: initial;
      --tw-tracking: initial;
      --tw-ordinal: initial;
      --tw-slashed-zero: initial;
      --tw-numeric-figure: initial;
      --tw-numeric-spacing: initial;
      --tw-numeric-fraction: initial;
      --tw-shadow: 0 0 #0000;
      --tw-shadow-color: initial;
      --tw-shadow-alpha: 100%;
      --tw-inset-shadow: 0 0 #0000;
      --tw-inset-shadow-color: initial;
      --tw-inset-shadow-alpha: 100%;
      --tw-ring-color: initial;
      --tw-ring-shadow: 0 0 #0000;
      --tw-inset-ring-color: initial;
      --tw-inset-ring-shadow: 0 0 #0000;
      --tw-ring-inset: initial;
      --tw-ring-offset-width: 0px;
      --tw-ring-offset-color: #fff;
      --tw-ring-offset-shadow: 0 0 #0000;
      --tw-outline-style: solid;
      --tw-blur: initial;
      --tw-brightness: initial;
      --tw-contrast: initial;
      --tw-grayscale: initial;
      --tw-hue-rotate: initial;
      --tw-invert: initial;
      --tw-opacity: initial;
      --tw-saturate: initial;
      --tw-sepia: initial;
      --tw-drop-shadow: initial;
      --tw-drop-shadow-color: initial;
      --tw-drop-shadow-alpha: 100%;
      --tw-drop-shadow-size: initial;
      --tw-duration: initial;
      --tw-ease: initial;
      --tw-content: "";
      --tw-scale-x: 1;
      --tw-scale-y: 1;
      --tw-scale-z: 1;
    }
  }
}


/* /@fs//Users/zhoupengpeng/Code/zml/platform/frontend/app/shadcn-variants.css */
/* Vendored from the MIT-licensed shadcn Tailwind variant sheet.
 *
 * 这份必须与 Trade 侧编译时用的那份**逐个变体**一致（Trade 直接 @import 上游包里的
 * 同一张表，本成员没装那个包，只能抄）。共享层的组件源码两边一模一样，但
 * `data-<key>:` 这种裸变体的**含义由本文件裁决**：这里有定义就走定义（例如
 * `data-vertical:` → `:where([data-orientation="vertical"])`），没有定义就退回
 * Tailwind 内建的 `[data-vertical]`。于是漏抄一个变体不会报错、不会少一条 class，
 * 只会让同一段共享代码在 Trade 上生效、在这里静默失配——slider 的方向选择器正是
 * 这样在本成员整条失效（轨道高度 0，页面上只剩一颗把手），而 Trade 一切正常。
 * 加变体前先核对上游那张表，不要按「本成员现在用不到」裁剪。
 *
 * 另有一条与本文件无关但同形的坑：`data-selected` 只匹配 `[data-selected="true"]`，
 * 而 Base UI 的布尔状态发的是 `data-selected=""`——要匹配 Base UI 的选中态得写
 * `data-[selected]:`，别用 `data-selected:`。
 */
@custom-variant data-open {
  &:where([data-state="open"]),
  &:where([data-open]:not([data-open="false"])) {
    @slot;
  }
}

@custom-variant data-closed {
  &:where([data-state="closed"]),
  &:where([data-closed]:not([data-closed="false"])) {
    @slot;
  }
}

@custom-variant data-checked {
  &:where([data-state="checked"]),
  &:where([data-checked]:not([data-checked="false"])) {
    @slot;
  }
}

@custom-variant data-selected {
  &:where([data-selected="true"]) {
    @slot;
  }
}

@custom-variant data-disabled {
  &:where([data-disabled="true"]),
  &:where([data-disabled]:not([data-disabled="false"])) {
    @slot;
  }
}

@custom-variant data-active {
  &:where([data-state="active"]),
  &:where([data-active]:not([data-active="false"])) {
    @slot;
  }
}

@custom-variant data-unchecked {
  &:where([data-state="unchecked"]),
  &:where([data-unchecked]:not([data-unchecked="false"])) {
    @slot;
  }
}

@custom-variant data-horizontal {
  &:where([data-orientation="horizontal"]) {
    @slot;
  }
}

@custom-variant data-vertical {
  &:where([data-orientation="vertical"]) {
    @slot;
  }
}


/* /@fs//Users/zhoupengpeng/Code/zml/standards/zml-interface/tokens.css */
/*
 * ZML tokens — 唯一跨成员 Foundation 源码。合同正文见 docs/08-ZML界面语法.md。
 * 成员经前端根的 zml-interface 链接原地 @import 本文件。品牌、金融与图表的视觉参数
 * 在此统一；成员 theme.css 只承载必要别名，业务语义仍由原业务 owner 拥有。
 */

/*
 * 断点 owner。两端此前各自表达同一批断点——ZML 平台在自己的 @theme 里把 md/xl
 * 钉成 768 / 1280，ZML Trade 在 TSX 里写 `min-[48rem]`——写的是同一个值，却没有任何
 * 一处是 owner，改一处不会带动另外两处。取值即 Tailwind 默认梯在默认根字号下的
 * 解，所以收口本身不移动任何断点；收的是「谁说了算」。
 *
 * 单位取 px 而不是 Tailwind 默认的 rem，是被一条真实耦合定死的：成员会用
 * `window.innerWidth` 与同一批阈值做原始比较来给视口分档（phone/tablet/desktop），
 * 而 innerWidth 是 CSS px、不随根字号缩放。CSS 若用 rem，放大字号的用户会拿到
 * 「JS 说 desktop、CSS 已经切到 tablet」的撕裂布局。两端都保持浏览器默认根字号，
 * 因此这里的 px 与 Tailwind 默认 rem 梯当前逐档同值。
 * 结构切换只允许 md / xl 两档，sm / lg / 2xl 仅用于密度微调。
 * 成员不得再声明 --breakpoint-*；调用点用 `md:` / `xl:`，不写 `min-[48rem]`。
 */
/*
 * 状态、金融方向与类别身份的 Tailwind 命名空间，两端同名（2026-09-23）：此前一端叫 `success` / `warning`，
 * 另一端叫 `status-healthy` / `status-warning`，同一个共享配方在两端要写两种类名。
 * 非 inline：工具类编成 var(--color-*) 引用，`.dark` 改底层 token 时随之生效。
 */
@theme {
  --color-status-info: var(--status-info);
  --color-status-info-soft: var(--status-info-soft);
  --color-status-healthy: var(--status-healthy);
  --color-status-healthy-soft: var(--status-healthy-soft);
  --color-status-warning: var(--status-warning);
  --color-status-warning-soft: var(--status-warning-soft);
  --color-status-error: var(--status-error);
  --color-status-error-soft: var(--status-error-soft);
  --color-status-idle: var(--status-idle);
  --color-status-idle-soft: var(--status-idle-soft);
  --color-status-stale: var(--status-stale);
  --color-status-stale-soft: var(--status-stale-soft);
  --color-status-offline: var(--status-offline);
  --color-status-offline-soft: var(--status-offline-soft);
  --color-status-unknown: var(--status-unknown);
  --color-status-unknown-soft: var(--status-unknown-soft);
  --color-financial-positive: var(--financial-positive);
  --color-financial-positive-soft: var(--financial-positive-soft);
  --color-financial-negative: var(--financial-negative);
  --color-financial-negative-soft: var(--financial-negative-soft);
  --color-financial-neutral: var(--financial-neutral);
  --color-risk: var(--risk);
  --color-risk-soft: var(--risk-soft);
  --color-entity-identity-graphite: var(--entity-identity-graphite);
  --color-entity-identity-blue: var(--entity-identity-blue);
  --color-entity-identity-indigo: var(--entity-identity-indigo);
  --color-entity-identity-violet: var(--entity-identity-violet);
  --color-entity-identity-magenta: var(--entity-identity-magenta);
  --color-entity-identity-amber: var(--entity-identity-amber);
  --color-entity-identity-cyan: var(--entity-identity-cyan);
  --color-entity-identity-teal: var(--entity-identity-teal);
}

/*
 * Tailwind 默认圆角梯里没有角色的那一档关掉：`--radius-xl` 此前在两端是别名、取值不同（ZML Trade 12 =
 * 浮层，ZML 平台 10 = 分区），同一个 `rounded-xl` 在两端是两种圆角。别名已删，消费者写角色 token
 * （--radius-floating / --radius-section …）；这里把默认值也清掉，写 `rounded-xl` 不再静默落到 Tailwind 的 12。
 */
@theme {
  --radius-xl: initial;
}

@theme {
  --breakpoint-sm: 640px;
  --breakpoint-md: 768px;
  --breakpoint-lg: 1024px;
  --breakpoint-xl: 1280px;
  --breakpoint-2xl: 1536px;
}

/*
 * 容器查询断点只有这一套（`@max-table-compact/table` 这类写法读它们）：容器查询读不到 --breakpoint-*，
 * 成员不再在类名里写 `@max-[600px]/…` 这种字面像素。命名说的是「哪一类容器在多窄时换档」，不是屏幕档。
 * - table-compact：数据表（成员工作面里的整张表）窄档，身份列与操作列收窄；
 * - pane-compact / pane-split：详情窄栏里的表与属性栏——不足 480 收成紧凑档，到 512 属性栏分两列；
 * - settings-compact：设置阅读列失去两侧留白的宽度（阅读宽 + 两侧内距）；
 * - management-compact：管理中心导航轨与正文从并排改为单栏（与 md 同值，但量的是管理中心容器）。
 */
@theme {
  --container-table-compact: 600px;
  --container-pane-compact: 479px;
  --container-pane-split: 512px;
  --container-settings-compact: 672px;
  --container-management-compact: 768px;
}

/*
 * Inter Variable 只有这一份切：成员 `/fonts/InterVariable-24c601bf5bec.woff2`（完整可变字体）。交付时接入插件把这张
 * face 换成同一份字体按 unicode-range 生成的分片 face（assets/fonts/subset-inter.py：保留 wght 与 opsz、
 * 全部 OpenType 特性与原度量，各片码位不重叠、并集等于原字体），字形与度量逐字不变。
 * `@fontsource-variable/inter` 的 `inter-latin-wght-normal.woff2` 是另一份文件
 * （仅 latin + wght，无 opsz），24px「Security & access」墨盒 202.89，对不上
 * Linear / 完整切的 194.48。不要在这里手写带 unicode-range 的第二张 face——分片只由交付生成，
 * 手写的片会把拉丁码位抢走。CJK 仍走 --font-sans 栈里的 PingFang SC。
 */
@font-face{font-family:"Inter Variable";font-style:normal;font-display:swap;font-weight:100 900;src:url("/fonts/InterVariable-24c601bf5bec.woff2") format("woff2-variations");unicode-range:U+0000,U+0020-007E,U+00A0-00AC,U+00AE-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+2000-200B,U+2010-2027,U+202F-2055,U+2057,U+205F,U+20AC,U+2122,U+2190-2193,U+2212,U+2248,U+2260,U+2264-2265,U+FEFF}@font-face{font-family:"Inter Variable";font-style:normal;font-display:swap;font-weight:100 900;src:url("/fonts/InterVariable-665cff743ffa.woff2") format("woff2-variations");unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303,U+0309,U+0323,U+1EA0-1EF9,U+20AB}@font-face{font-family:"Inter Variable";font-style:normal;font-display:swap;font-weight:100 900;src:url("/fonts/InterVariable-9e2697b0404b.woff2") format("woff2-variations");unicode-range:U+0100-0101,U+0104-010F,U+0112-0127,U+012A-0130,U+0132-0148,U+014A-0151,U+0154-0167,U+016A-019F,U+01A2-01AE,U+01B1-01C3,U+01C5-0254,U+0256-027B,U+027E-0284,U+0286-0290,U+0292-02A4,U+02A6-02BA,U+02BD-02C5,U+02C7-02D9,U+02DB,U+02DD-02FF,U+0302,U+0306-0307,U+030A,U+030C,U+030F,U+0313,U+0315,U+031B,U+0326-0328,U+032C,U+0337-0338,U+0342-0343,U+0346-036F,U+1D00,U+1D0D,U+1D1B,U+1D43,U+1D47-1D49,U+1D4D,U+1D4F-1D50,U+1D52,U+1D56-1D58,U+1D5B,U+1D62-1D65,U+1D9C,U+1DA0,U+1DBB,U+1DBF,U+1E00-1E9B,U+1E9D-1E9F,U+1EFA-1EFF,U+2C7C,U+2C7F,U+A7FF}@font-face{font-family:"Inter Variable";font-style:normal;font-display:swap;font-weight:100 900;src:url("/fonts/InterVariable-24cdf40d6a05.woff2") format("woff2-variations");unicode-range:U+0374-0376,U+037A-037F,U+0384-038A,U+038C,U+038E-03A1,U+03A3-03D7,U+03DC-03DD,U+03F0-03F6,U+03F9-03FA,U+03FC-03FF,U+1F00-1F15,U+1F18-1F1D,U+1F20-1F45,U+1F48-1F4D,U+1F50-1F57,U+1F59,U+1F5B,U+1F5D,U+1F5F-1F7D,U+1F80-1FB4,U+1FB6-1FC4,U+1FC6-1FD3,U+1FD6-1FDB,U+1FDD-1FEF,U+1FF2-1FF4,U+1FF6-1FFE}@font-face{font-family:"Inter Variable";font-style:normal;font-display:swap;font-weight:100 900;src:url("/fonts/InterVariable-96377a67b308.woff2") format("woff2-variations");unicode-range:U+0400-0479,U+0480-049D,U+04A0-04FF,U+052F,U+2DFF,U+A69F}@font-face{font-family:"Inter Variable";font-style:normal;font-display:swap;font-weight:100 900;src:url("/fonts/InterVariable-5cf6839e10bd.woff2") format("woff2-variations");unicode-range:U+0E3F,U+1DC0-1DF5,U+1DFC-1DFF,U+2070-2071,U+2074-208E,U+2090-209C,U+20A0-20AA,U+20AD-20AF,U+20B1-20B5,U+20B8-20BA,U+20BC-20C0,U+20DB-20DE,U+20E8,U+20F0,U+2100-2101,U+2103,U+2105-2106,U+2109,U+2113,U+2116-2117,U+211E-2121,U+2126,U+212A-212B,U+212E,U+2132,U+213B,U+214D,U+2150-217F,U+2183-2186,U+2189,U+2194-2199,U+21A9-21AA,U+21B0-21B1,U+21B3-21B5,U+21BA-21BB,U+21D0,U+21D2,U+21D4,U+21DE-21DF,U+21E4-21E5,U+21E7,U+21EA,U+2202,U+2205-2206,U+220F,U+2211,U+221A,U+221E,U+222B,U+2236,U+2295-2298,U+2303-2305,U+2318,U+2325-2327,U+232B,U+2380,U+2387,U+238B,U+23CE-23CF,U+2423,U+2460-2468,U+24B6-24CF,U+24EA,U+25A0-25A2,U+25AA,U+25B2-25B3,U+25B6-25B7,U+25BA-25BD,U+25C0-25C1,U+25C4-25C7,U+25CA-25CB,U+25CF,U+25E6,U+25EF,U+2600,U+2605-2606,U+263C,U+2661,U+2665,U+266A-266B,U+26A0,U+2713,U+2717,U+2756,U+2764,U+2780-2788,U+27EF,U+27F5-27FA,U+2913,U+2A38,U+2B06,U+2B12-2B13,U+2B1C,U+2B24,U+2E18,U+A92E,U+E000,U+E002-E05E,U+E06A-E0BD,U+E0C8-E0CC,U+E0DC-E0E6,U+E0F3-E0F5,U+E106,U+E109-E10A,U+E10C-E10F,U+E111-E113,U+E117-E118,U+E121-E122,U+E124,U+E12A-E15E,U+E163,U+E1C3,U+E1D2-E1DF,U+E1E1-E2DC,U+EE01-EE07,U+EE09-EE0A,U+EE0C-EE12,U+EE14,U+EE17,U+EE1D-EE45,U+EE47-EE84,U+EE87-EED6,U+EED8-EEE1,U+F6C3,U+1F12F-1F149,U+1F16A-1F16B,U+1F850,U+1F852}

/*
 * Inter 到达前的度量对齐回退（font-display: swap 的交换期）：本机 Arial / Helvetica 按 Inter 的平均字宽与
 * 行盒缩放（size-adjust 取拉丁样本的字宽比，ascent / descent 取 Inter hhea 1984 / 494 ÷ 2048 再除以缩放），
 * 首帧文字不等字体、字体到达时不跳版。只认领 Inter 拉丁片的码位：Inter 到达后这些码位都由 Inter 承接，
 * 本 face 不再参与；拉丁片以外的码位（CJK 等）照旧落到栈里后面的字体。
 */
@font-face {
  font-family: "Inter Variable Fallback";
  src: local("Arial"), local("Helvetica");
  size-adjust: 97.71%;
  ascent-override: 99.15%;
  descent-override: 24.69%;
  line-gap-override: 0%;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2212;
}

/*
 * 字阶工具类：按**角色**命名的唯一一套，两端与共享层原地消费（08 §4、§4.1）。
 *
 * - 一个角色 = 字号 + 行盒 + 字重档，三者成对取自同一族 token，不在调用点拆开写。
 * - **字阶不带颜色**。颜色由调用点的颜色类或所在表面的角色给：此前 ZML 平台的 type-caption
 *   自带 muted、ZML Trade 的不带，同名不同义——同一个共享组件落在两端就是两种颜色。
 * - 数字与代码是**排版修饰**，不改字号：type-numeric（tabular + 关上下文替换，零不加斜杠——与共享
 *   Table 数字列、数值草稿输入同一配方）、type-code（等宽 + tabular + 斜杠零：代码串里 0 与 O 要分得开），
 *   叠在任一字号角色上。
 * - **否定式合同**：成员不得再定义 type-* 或另起字阶类（两端 lint 与样式扫描拦截，README §1）。
 *   此前两端各一份、同名不同义（caption 的颜色、control 的字重、numeric 的斜杠零）、异名同义
 *   （ZML 平台五个名字都是 12/16），共享组件里写的名字只在一端生效。
 */
@utility type-page-title {
  font-size: var(--type-heading-page);
  line-height: var(--type-heading-page-line);
  font-weight: var(--font-weight-medium);
}
@utility type-heading-section {
  font-size: var(--type-heading-section);
  line-height: var(--type-heading-section-line);
  font-weight: var(--font-weight-medium);
}
/* 窗口与弹窗标题（18/24）：设置窗、弹窗标题与独立设置页（账单页）的页头同一档。 */
@utility type-window-title {
  font-size: var(--type-heading-window);
  line-height: var(--type-heading-window-line);
  font-weight: var(--font-weight-semibold);
}
/* 列表行与表行的主标识、分组标题（标签档 13/18）。 */
@utility type-row-title {
  font-size: var(--type-row-title);
  line-height: var(--type-row-title-line);
  font-weight: var(--font-weight-medium);
}
@utility type-body {
  font-size: var(--type-body);
  line-height: var(--type-body-line);
  font-weight: var(--font-weight-regular);
}
/* 12px 从属文字（表内次档、说明、时间戳、脚注）。行盒取 `--type-workbench-secondary-line`
 * （2026-09-21，原因见下方「行盒与 CJK」）；16 仍是资金矩阵格高 calc 的长度 token。
 * 眉标（全大写小标签）= type-caption + uppercase + tracking-wide，不另起名。 */
@utility type-caption {
  font-size: var(--type-workbench-secondary);
  line-height: var(--type-workbench-secondary-line);
  font-weight: var(--font-weight-regular);
}
/* 12px chrome 控件标签（按钮 24/28 档、pill、chip）。 */
@utility type-button {
  font-size: var(--type-button);
  line-height: var(--type-button-line);
  font-weight: var(--font-weight-medium);
}
@utility type-numeric {
  font-variant-numeric: tabular-nums;
  font-feature-settings: var(--font-feature-numeric);
}
@utility type-code {
  font-family: var(--font-mono);
  font-variant-numeric: tabular-nums slashed-zero;
  font-feature-settings: var(--font-feature-numeric);
}
/* 小数部分变暗（docs/07 §6.1，唯一出口 primitives/num）：整数位是扫描焦点，小数段降一档。
   用 currentColor 混透明而不是换成 muted 色——盈亏绿红的小数段仍是绿红，只是更轻；高对比与强制颜色下不降。 */
.zml-num-fraction { color: color-mix(in oklab, currentColor 62%, transparent); }
@media (prefers-contrast: more) { .zml-num-fraction { color: inherit; } }
@media (forced-colors: active) { .zml-num-fraction { color: inherit; } }

:root {
  --font-sans: "Inter Variable", Inter, "Inter Variable Fallback", "PingFang SC", "Microsoft YaHei",
    "Noto Sans SC", ui-sans-serif, system-ui, -apple-system, "Segoe UI",
    sans-serif;
  --font-data: var(--font-sans);
  --font-mono: "Geist Mono", "SFMono-Regular", "Cascadia Code",
    "Roboto Mono", ui-monospace, monospace;
  /*
   * 正文档 400。参照的四个表面（菜单行、listbox option、Select 值文字、raised-select）
   * 逐个实测都是 400；原来写 450 的依据「参照字重梯没有 400」被这四处实测证伪。
   *
   * 本族只取整档刻度（400 / 500 / 550 / 600），中间值（450 那类）一律不用，原因是它在
   * 两种字形上给出互相矛盾的结果：
   *   - 拉丁与数字走 Inter Variable 的连续轴，每一个中间值都真的插值出一档；
   *   - 中文没有 Inter 字形，回落到 PingFang SC 的**静态字面**，只能命中整档。
   * 实测命中的字面（Chrome/macOS，CDP `CSS.getPlatformFontsForNode` 直读 PostScript 名，
   * 不靠像素也不靠宽度——中文全角前进宽在所有字重下恒定，宽度法必然测不出差别）：
   *   400 / 420 / 440 / 450 → PingFangSC-Regular；460 / 480 / 500 / 550 → PingFangSC-Medium；
   *   600 → PingFangSC-Semibold。
   * 也就是说 450 在中文上与 400 **逐像素相同**，只在拉丁/数字上比 400 重一点点
   * （同串 13px：拉丁 +0.32%、数字 +0.73%）。中间值买不到「中文可辨的第二档」，
   * 却让同一份数据在中西文之间失去同一个重量语义，所以只走整档。
   *
   * --font-weight-normal 与本颗曾是同一事实的两个名字；收敛成别名，值只由 regular 拥有。
   */
  --font-weight-regular: 400;
  --font-weight-normal: var(--font-weight-regular);
  --font-weight-medium: 500;
  --font-weight-semibold: 600;
  --font-feature-numeric: "tnum" 1, "kern" 1, "calt" 0;

  /* ——— 行盒与 CJK（2026-09-21）———————————————————————————————————————
     `-line` 全族是**长度**，不是比值，也**不再由 CSS `normal` 代替**。

     此前共享层有 69 处写 `leading-[normal]`，并在十几处注释里把它说成刻意校准：
     「Linear 事项标题 Light 1440 实测 13/`normal` 15.5」「All-issues 12/`normal` 14.5」。
     那两个读数只在**拉丁**下成立。`normal` 是按**实际渲染字体**的度量算的，而中文、日文、
     韩文回退到另一张字面。本产品实测（Inter Variable + PingFang SC，同一字号）：

       字号   拉丁 / 阿拉伯 / 泰      中 / 日 / 韩
        11         14                    15
        12         15                    17
        13         16                    18
        15         19                    20
        18         21                    24
        20         24                    27

     也就是说：那份校准在产品的**默认语言 zh-CN 下从来没有生效过**，而 16 种语言各自落在
     不同的盒高上——同一个页面换种语言，没有钉高的地方（堆叠文本、事实行、面板内容）
     纵向节律就变。实测某页 307 个承载文字的元素里 **242 个（79%）**在 `normal` 上。

     取 token 之后中文侧多数逐值不变（13px 的 18 就是它本来的值），其余语言追平它，
     行盒与语言解耦。**数值本身不动**：这些档几乎都是单行语境（徽标、按钮、表头、指标数字），
     偏紧的行盒对 CJK 只是紧一点、不裁切；而其中 `--type-workbench-secondary-line`
     还被资金矩阵的格高 calc 与骨架高度当**长度**消费，动它会连带改矩阵几何。
     真要给某一档加高，先把「行盒」与「一行 12px 文字的长度」拆成两颗 token，别就地改值。

     这不是新原则：同族的 `--type-button-line` 早在本轮之前就因为同一个发现（12px 拉丁 14.5 /
     汉字 16.5，「靠内容撑高的那些会按语种改变行高——这正是本族最不能有的一种漂」）被钉成了长度。
     本轮只是把那条已被接受的判断应用到其余 69 处。

     **否定式合同**：源码只看得出「现在写 token」，看不出「不许改回 `normal`」——
     改回去在英文下什么都不会坏，坏的是中文以及其余 15 种语言各走各的盒高。 */
  --type-workbench-primary: 13px;
  --type-workbench-primary-line: 18px;
  --type-body: 13px;
  --type-body-line: 18px;
  /* 12/16「表内次档」这一档的唯一 owner，冻结面钉的也是它（见下方冻结块）。
     与它逐值相同的 --type-workbench-micro / -line 是 11px 另开一档（--type-micro）时留下的
     历史名，没有独立语义、也从未进过冻结块；徽标是它最后一个消费者，改读本颗之后
     共享层 + Trade + 平台三处同时零消费者，2026-09-22 按收敛判据 §3「残留」删除
     （判据「删掉后需要它的人要重新发现什么」答「没什么」：12/16 要什么有什么，全在本颗）。
     **否定式合同**：这一档不再另起别名。源码只看得出「现在有几个名字」，看不出「不许再加一个」。 */
  --type-workbench-secondary: 12px;
  --type-workbench-secondary-line: 16px;
  /* 数字面的两档主数字（08 §4.1 之外唯一允许的两档，2026-09-19）：
     metric-primary 20/24 只给一个面的第一问题（侧窥面板的净资产、对账窗的差异额）；
     metric-tile 18/24 只给统计总览的指标格（六格同号，主次靠位置不靠字号）。不出现 14–16。 */
  --type-metric-primary: 20px;
  --type-metric-primary-line: 24px;
  --type-metric-tile: 18px;
  --type-metric-tile-line: 24px;
  /*
   * Linear 的四档是 11 / 12 / 13 / 15；ZML 的 12px 早被表内文字占用（owner 是上面那颗
   * --type-workbench-secondary），11 只能另开一档。**否定式合同**：不得把 11 折进 12 那一档——
   * 两档只差 1px，合并在任何截图上都不明显，坏的是导航计数这类 chrome 数字会跑到表内档上去。
   * Linear chrome 行高普遍是 `normal`（Inter 11px ≈ 13.3），这里取 13 作为可参与 calc 的解，
   * 而不是抄单行 keycap 的 12.1。
   */
  --type-micro: 11px;
  --type-micro-line: 13px;
  --type-control: 13px;
  --type-control-line: 18px;
  /* 触控设备上可编辑文字的下限（08 §20）：iOS 聚焦小于它的输入框会放大整页。只由全局规则层消费。 */
  --type-input-touch: 16px;
  --type-row-title: 13px;
  --type-row-title-line: 18px;
  /*
   * 浮层行（菜单项 / listbox option / 溢出面行）的 13px 字阶与行盒，实测 13 / 19.5（= 13×1.5）。
   * **不改 --type-workbench-primary-line 那颗**：它 18 的那一档正被资金费率矩阵的 calc 消费
   * （单元格内容高 = 主行盒，带统计行时再加一到两个次级行盒），改值就是改矩阵的行几何。
   * 这条约束与冻结无关（矩阵已移出冻结面）：它成立的理由是**矩阵是这颗的真实几何消费者**，
   * 且矩阵现在读的就是 root 这一颗，改这里等于当场改矩阵行高。
   * 也不让菜单行去借别族的行盒：字号与行盒必须成对取自同一族，跨族配对正是环 alpha 那次错配的成因。
   * 所以浮层行自立一档，字号与 workbench 主档同为 13 但各自拥有。
   * 冻结面不钉：菜单 / listbox 一律 portal 到 body，永远不在 [data-zml-frozen-surface] 子树内。
   */
  --type-menu-item: 13px;
  --type-menu-item-line: 19.5px;
  /*
   * 「12px chrome 文字」这一个事实的唯一 owner，不是「按钮字号」：按钮的 24/28 档、tab pill、chip、
   * segmented、display-options 面板、popover 分组标签、compact Select 触发器都读它（名字是历史包袱）。
   * 参照站 24/28 档实测 12px、32 档实测 13px —— 那**不是这颗要分档**，32/44 档在配方里用 size 覆盖成
   * `--type-control` / `--type-auth-body`，本颗只服务 12px 那一档。一颗 token 长出四个尺寸分支，
   * 下次改 12px 档就得先想清楚会不会碰到 32 档；档位差交给 size 变体表达，这里保持单值。
   *
   * 数据面的 12px 是另一颗（`--type-workbench-secondary`：在冻结面里钉着，且它的 `-line` 兄弟
   * 正被资金费率矩阵的行几何 calc 消费）：同样 12px，但行盒不同（表内 16 / chrome 14.5），
   * 两个事实必须各有 owner。
   */
  --type-button: 12px;
  /*
   * 12px chrome 文字的行盒。参照站这一族一律 `line-height: normal`，实测行盒 14.5。
   *
   * 这里**不照抄 `normal`**：normal 由每段文字实际命中的那支字体的度量解出，
   * 而 --font-sans 的 CJK 回落是 PingFang SC。同一条 `font-size:12px; line-height:normal`
   * 在本族字体栈上实测两个解：拉丁串 14.5、汉字串 16.5（混排取大值）。
   * 参照站是纯拉丁界面，normal 在那边只有一个解；在中文界面里它有两个，
   * 同一枚 pill 的行盒会随字符串里有没有汉字在 14.5 / 16.8 之间跳，
   * 混排串取两者的大值。定高 flex 盒看不出来，靠内容撑高的那些（弹层分区标题、
   * display-options 行）会按语种改变行高——这正是本族最不能有的一种漂。
   *
   * 也不写无单位比值：`-line` 全族的契约是长度（同族的 --type-workbench-secondary-line
   * 正被资金费率矩阵的行几何 calc 消费），换成比值就断了这个契约。
   *
   * 所以钉成长度 14.5px。代价是换拉丁 UI 字体时要按上面那条式子重新推一次——
   * 这条代价写在这里、可解释、只有一个地方要改；normal 的代价是隐形的，且按语种发作。
   */
  --type-button-line: 14.5px;
  /* 子菜单箭头槽里那颗 6px ▶ 的行盒。目的只是不让 CSS `normal` 把盒高交给当地字体，
     **落点不该跟着变**——实测写 7.5 会把字形上移，`5px` 才复现 `normal` 的位置。
     参照那句「实测 7.5」量的是**盒高**，不是这一档 flex 槽里的落点，两者不是同一个数。所以取 5。

     **偏移量记过一次错，更正在此**：第一轮审计记的是「上移 1 CSS px」，第二轮在**真子菜单**上
     （ZML Trade 仪表盘筛选 → 级联面，14 枚真实 ▶）用 Range 量字形落点，实测是 **0.25 CSS px**
     —— 1 个设备像素在 dpr 4 下正是 0.25 CSS px，上一轮把设备像素当成 CSS px 记进了合同注释，
     差 4 倍。取值 5 不受影响（它与 `normal` 落点逐位相同），错的是那句记录。 */
  --type-menu-sub-indicator-line: 5px;
  /* tooltip 与 chart 注记就是 11px 档本身，不再另存一份常量；16.5 是 11×1.5 的推算值，
     Linear 无对应，多行可换行浮层取 16。 */
  --type-tooltip: var(--type-micro);
  --type-tooltip-line: 16px;
  --type-mono: 12px;
  --type-mono-line: 16px;
  --type-auth-heading: 18px;
  --type-auth-heading-line: 24px;
  --type-auth-body: 13px;
  --type-auth-body-line: 18px;
  --type-heading-window: 18px;
  --type-heading-window-line: 24px;
  --type-heading-section: 15px;
  --type-heading-section-line: 23px;
  --type-heading-page: 24px;
  --type-heading-page-line: 32px;
  --type-article-body: 15px;
  --type-article-body-line: 24px;
  /* 文章标题就是 semibold 档，不再另存一份 600。 */
  --font-weight-article-heading: var(--font-weight-semibold);
  /*
   * Linear 的阅读列上限是作者单位 80ch（Inter 16px 下解出 805px），不是固定 px——
   * 用 ch 才能随字体伸缩。--settings-reading-width 是另一张表面，保持 640。
   */
  --article-reading-width: 80ch;
  /*
   * 字距轴：Linear 在大字号上收紧、在 17px 中间档反向放开，靠一个统一 em 系数推不出来。
   * 行标识的 -0.26px 落在冻结数据面内，本轮不加；冻结块显式 letter-spacing:normal 兜底。
   */
  --tracking-heading: -0.16px;
  --tracking-body: -0.1px;
  --tracking-section: 0.1px;
  --unread-marker-size: 6px;

  --space-inline-compact: 4px;
  --space-inline-standard: 8px;
  --space-inline-wide: 12px;
  /* Linear Add filter → Display options 实测 6px（28 盒 pitch 34）。quiet 工具组专用，不是 4/8 档。 */
  --space-toolbar-quiet: 6px;
  --space-stack-compact: 4px;
  --space-stack-standard: 8px;
  /* 确认面的说明与操作分组间距，独立于普通浮层页脚。 */
  --space-confirmation-actions: 20px;
  --space-section-compact: 16px;
  --space-section-standard: 24px;
  /* 对象详情主栏与属性栏之间的列间距（Linear 项目页实测 44.2652，取整）。只此一颗，DetailLayout 读它。 */
  --space-detail-gutter: 44px;

  --radius-micro: 4px;
  /* 复选框实测 3，不复用 --radius-micro（那颗还服务 timeline-interval，语义不同）。 */
  --radius-checkbox: 3px;
  /* 图例色块（8 见方的类别色块）：比复选框再收一档，读作色块而不是控件。 */
  --radius-swatch: 2px;
  --radius-small: 6px;
  --radius-control: 8px;
  --radius-section: 10px;
  --radius-auth-field: 10px;
  /* 工作区切换器：Linear 实测 10，介于 --radius-control(8) 与 pill 之间；不设 token 就只能在两端各写一次裸值。 */
  --radius-rail-switcher: 10px;
  --radius-floating: 12px;
  --radius-shell: 12px;
  /* 窗口族（Dialog / AlertDialog / SettingsWindow）同一圆角：与浮层同为 12，写成独立 token 只为让三个面读同一颗。 */
  --radius-modal: 12px;
  /* L2 数据面（08 §5 面的四层）：表区 / 矩阵 / 日历 / 图表外壳 / 列表区。
     与 --radius-control(8) 同值不同语义——控件是被点的东西，数据面是装东西的面；
     合成一颗会让「改控件圆角」顺手改掉每一张表的外形（--radius-checkbox 同理，见上）。 */
  --radius-data-surface: 8px;
  --radius-pill: 9999px;

  --border-width-hairline: 1px;
  /* 组内分隔的发丝线（0.5，与菜单 / 浮层分区同宽）：成员要画这条线时取它，不写字面像素。 */
  --border-width-divider: 0.5px;
  --border-width-control: 1px;
  --border-width-focus: 1px;
  --border-width-invalid: 1px;

  --control-compact: 24px;
  --control-standard: 28px;
  --control-form: 32px;
  /* Linear toolbar quiet glyphs 实测 14×14（16 viewBox 缩放到 14）；内容/导航仍 16——
     那个 16 是 Icon 组件的默认尺寸，不经 token，所以这一族只钉偏离默认的两档。 */
  --icon-micro: 12px;
  --icon-toolbar: 14px;
  --control-auth: 44px;
  --select-trigger: 30px;
  --select-trigger-compact: 24px;
  --select-option-compact: 24px;
  --select-option-compact-line: 18px;
  /* 设置页大号开关实测 轨 30×20 / 滑块 14 / 内缩 3；行程 30−14−2×3 = 10。 */
  --switch-track-w: 30px;
  --switch-track-h: 20px;
  --switch-thumb-size: 14px;
  --switch-pad: 3px;
  /* 弹窗小号开关实测 22×14 / 滑块 10 / 内缩 2；行程 22−10−2×2 = 8。 */
  --switch-compact-w: 22px;
  --switch-compact-h: 14px;
  --switch-compact-thumb: 10px;
  --switch-compact-pad: 2px;
  /*
   * 「果冻感」不是缩放过冲，是前缘先动、后缘晚 50ms 跟上把滑块拉长再收回——
   * 所以这里是「轨 150 / 滑块 100 / 后缘延迟 50」三颗，而不是一条带过冲的曲线。
   * 大号与小号实测同值，只有一套。
   */
  --motion-switch: 150ms;
  --motion-switch-thumb: 100ms;
  --motion-switch-thumb-delay: 50ms;
  --field-inline: 12px;
  --menu-item: 32px;
  /*
   * L1 定宽取 Linear 本面 used border-box 207（offsetWidth / rect）。
   * Linear 声明 min-width 206 与 --row-width 206，0.5+0.5 边把 used 撑到 207；
   * 我们消费的是 width 不是 min-width，所以 token 落 used 207，内容列 206 对齐 Linear 行宽。
   * L2 级联面 min-width 194 + 2×0.5 边 = 195。
   */
  --filter-menu-width: 207px;
  --filter-cascade-width: 195px;
  --filter-panel-width: 320px;
  --filter-search-height: 36px;
  /* 显示选项的内容盒定宽；边框由浮层材质拥有，不把设备像素舍入算进内容宽。 */
  --display-options-width: 300px;
  /* 普通 Popover 的容量边界独立于显示选项，不随某一专项面板校准而收缩。 */
  --popover-max-width: 331px;
  /*
   * Display 行内 Select 触发器：All-issues Light 本面四枚共用 used **99**（max 160，
   * `--x-width` 是内容 51/73/78/107，不是 used）。成员短标签按内容收到 51，左缘随文案跳。
   * 控件列下限取 99，上限仍是盒上的 max-w-40 = 160。
   */
  --display-options-control-min: 99px;
  /* 右属性栏实测与视口无关的定宽 364.781。 */
  --details-pane-width: 364.781px;
  --details-inline-min: 1152px;
  --details-balanced-inline-min: 1024px;
  --details-balanced-min: 360px;
  --details-balanced-master: 1.08fr;
  --details-balanced-detail: 0.92fr;
  --details-library-master-width: 288px;
  --selection-list-column-min: 14rem;
  --selection-identity-width: 8rem;
  /* 触控命中面（08 §20）：44 是 iOS 人机指南的最小触控靶，也是页面度量「命中区 ≥ 44」的判据。
     控件光学盒不跟着变：粗指针下按钮、字段、页签、分段、勾选族只加这一档透明平面；导航项、菜单行与
     listbox 行把光学盒抬到它，行与行之间因此不叠平面。 */
  --hit-plane-coarse: 44px;
  /* 登录面 44 高字段里揭示钮的方形光学盒：比字段外框小一档、四周留出边；粗指针命中仍按 --hit-plane-coarse。 */
  --auth-reveal-size: 40px;
  /* 头像裁剪舞台的最大显示边长（patterns/avatar-crop）；窄窗里随容器收窄，裁剪坐标不随之变。 */
  --avatar-crop-stage: 360px;
  /* safe-area 四档一家：两端逐字相同，只在这里声明一次；成员的顶栏结算值（如 shell 的 top-bar-block）引用它们。 */
  --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);
  /* 反馈视口顶部两角的起算高度：工作面 chrome 的两行（页头 + 视图行，08 §3）之下。顶角的事件推送卡
     （平台公告提醒）不得压住页头的页面级动作与视图行的轨尾工具（08 §10「不占正文几何」的同一条理由）；
     两行几何两端同一份，所以起算高度也只在这里一份，成员不再各写。没有工作面 chrome 的表面（认证页）顶角没有 lane。 */
  --feedback-viewport-top-inset: calc(2 * var(--shell-bar-height) + 0.5px);
  --checkbox-size: 14px;
  /* 指示器呈现档。判据是**笔画落在设备像素栅格上**，不是「大一点好看」：
     16 网格家族的笔画恒为 1.5 单元，呈现尺寸 S 下的设备像素宽度 = S ÷ 16 × 1.5 × DPR = 3·S·DPR/32。
       S=12 → DPR1 1.125 / DPR2 2.25   两档都跨在两个物理像素之间（这是本条被判缺陷的原因）
       S=14 → DPR1 1.3125 / DPR2 2.625 更差
       S=16 → DPR1 1.5   / DPR2 3.0    DPR2 整数、DPR1 落在半像素格
     DPR2 要整数需 3S/16 ∈ ℤ，即 S 是 16 的倍数；DPR1 要整数需 S=32，超出任何控件盒——
     所以 16 是这条笔画在真实档位里唯一的解，DPR1 的半像素格是它的最优下界，不是妥协掉的第二方案。
     16 > --checkbox-size(14) 是有意的：勾字形的墨迹 bbox 只有 10×8 单元，按 16 呈现是 10×8 px，
     在 14 的盒里左右各余 2px；svg 盒溢出的那 1px 圈内没有任何墨，且盒是 fixed size + shrink-0，
     **列宽与行高一律不动**（这条是冻结表的硬约束，改档必须逐列复量）。
     顺带对上参照：参照站勾形 10×9，我们按 16 呈现是 10×8；按 12 呈现只有 7.5×6，小一整档。 */
  --checkbox-indicator-size: 16px;
  --keyboard-occlusion: max(0px, calc(100svh - var(--vv-height, 100svh)));
  --shell-rail-width: 244px;
  --shell-wide-inset: 8px;
  --shell-navigation-inset: 12px;
  /* Linear body 的 --header-height 实测 43.5（顶栏跨 y 8.5→52），
     同时是详情两列 padding-top 21.75 的推导基准（恰为一半）。 */
  --shell-bar-height: 43.5px;
  /* 窗口 header 行：整像素 44（Linear 设置窗实测），不借工作台位置栏的 43.5。 */
  --window-header-height: 44px;
  --shell-bar-inset-start: 8px;
  --shell-bar-inset-end: 11px;
  --view-title-inset-start: 10px;
  --view-title-inset-end: 4px;

  --row-single: 44px;
  /* --row-dual 是「双行文本」的行盒，**不是**「表格行比列表行高一档」那个语义。
     后者曾另有一颗 48 的 --row-table，两端一张表都没有读过它，已删；真要再分这一档，
     重新开一颗并同时给出消费者，不要把 --row-dual 借过去。 */
  --row-dual: 46px;
  --row-inbox: 55px;
  --table-header: 32px;
  --cell-inline: 12px;
  --cell-gap: 8px;
  --data-alert-rail-width: 3px;
  --data-message-row: 14px;
  --data-annotation-row: 20px;
  --data-matrix-inset: 10px;
  --data-header-coarse: 44px;
  --data-matrix-identity-default: 150px;
  /* 基差列宽由基差读数的**输出域**推导，不是拍的常数（2026-09-22，此前 88 装不下 ≥4 位整数、右对齐从起始边
     裁掉正负号）。读数固定四位小数、带符号、带 %，12px Inter 等宽数字下每个字形的步进（页内实测）：
     符号 8 · 数字 8 · 小数点 3 · % 11，于是文字宽 = 8 + 8·N + 3 + 4·8 + 11 = 54 + 8·N，只随整数位数 N 变化；
     格两侧内距各 8。生产分布里现货 / 永续基差出现过 6 位整数（+176990.3466%），取 N = 6：
     54 + 48 + 16 = 118。整数位再多一位就再加 8。 */
  --data-matrix-basis-default: 118px;
  --data-matrix-venue-default: 104px;
  --data-card-collapsed: 124px;
  --data-card-message: 22px;
  --data-card-expanded-extra: 131px;
  --row-dense-single: 32px;
  --row-dense-dual: 40px;
  /* 紧凑档（08 §9.2 显示选项「密度 · 紧凑」，2026-09-19 用户决定）：盯盘用的 28 / 36，列头 24。
     只是行高与列头一档，字号不变；不是第四种字号也不是「更小的表」。 */
  --row-compact-single: 28px;
  --row-compact-dual: 36px;
  --table-header-compact: 24px;
  /* 双腿数据行（**两张组合主表：Trade 组合主表与平台组合监控主表**，08 §1.2 与
     docs/08 §5「两张组合主表的一行是一个组合的两条腿……行高 40（--row-legs）」）：
     两腿各占一条行距、上下各一份内距；它是「一行两腿」，
     不是 --row-dense-dual 的「主文 + 元数据」双行文本。行高 40 是 08 §1.2 登记的不变量。
     **行距 16 = 次档（12px）的行盒**（`--type-workbench-secondary-line`，08 §4.3）：腿行里装的
     是决策值与限定词，全是次档；主档 13 一行只出现在币对那一处主语上（08 §4.2「一行最多一处」）。
     它**不是**主档的 18——把主档行盒套到次档文字上，内容就是 4+18+18+4=44，顶破 40 的行盒
     （2026-09-22 实测：每一枚格 45、行盒 40，底色盖住下一行 5px）。这两颗必须是字面量：
     scripts/project_zml_interface.py 把它们派生成 DATA_GRID_METRICS 给虚拟引擎读，只认字面 px；
     所以「16 等于哪一颗」由这段话钉住，而不是由 var() 钉住。
     **两个消费者都要算在内**：平台经 DATA_GRID_METRICS.legsRow 读同一颗，行根同样带
     `.zml-combo-row`。2026-09-22 这段注释一度被收窄成「（组合主表）」，而平台的消费没变——
     一颗两个消费者的共享 token，注释里只剩一个，就是把仍然有效的约束当过期描述清掉；
     这类范围约束 grep 不回来，只能靠这里写住。
     **行高是档，内距是档减内容剩下的余量**（照 2026-09-21 修盈亏日历的那条，不是反过来）：
     行距再动一次，让内距吸收，40 不动。 */
  --row-legs: 40px;
  --row-legs-line: 16px;
  --row-legs-block: calc((var(--row-legs) - 2 * var(--row-legs-line)) / 2);
  --table-header-dense: 28px;
  --cell-inline-dense: 8px;
  --settings-row: 65px;
  /*
   * 窄档轨尾预算。Linear 390 与 1024 实测轨尾是同一组三枚 28 quiet（筛选 / 显示 / 详情）、
   * 同一 6 间距——窄档缩的是同时可见的药丸数，不是工具的枚数、尺寸或间距。
   * 溢出入口在 Linear 是**轨内**的一枚药丸（接替被裁掉的那一段，带当前项名 + 展开符），
   * 不占轨尾；一旦把它挪到工具组旁边，它就是第四枚 28 加一个组间距，390 上直接吃掉 36 轨宽，
   * 轨只剩一个半药丸。这颗预算是登记的目标值，目前没有样式消费者执行它：共享轨给轨尾钉的上界是
   * 「给溢出入口留位」（入口实宽 + 行槽），超预算的成员（Trade 组合页四枚、平台搜索 + 五枚）
   * 仍是 docs/08 §3 的未结项，由各成员自己收口。
   */
  --view-rail-end-slots: 3;
  --view-rail-end-max: calc(
    var(--view-rail-end-slots) * var(--control-standard) +
      (var(--view-rail-end-slots) - 1) * var(--space-toolbar-quiet)
  );
  --table-record-min: 56rem;
  /*
   * 列宽刻度（08 §20）：全站表格只有这一套档位——TableSurface、原语 Table、Trade 的 Table 与命令式 / 虚拟化
   * FinancialTable 都经 table-surface-variants 的 `tableColumnWidth` 取 `var(--table-column-<档>)`，不另持数值。
   * 此前 FinancialTable 另有一套「最小宽」档（身份 176 / 金额 112 / 正文 16rem），与本套同名不同值，
   * 同一份持仓在两种表里列宽不同；合一时取本套（两端 TableSurface 表已按它逐列核过）。
   * `venue` 是交易所身份列：标记 16 + 间距 8 +「Hyperliquid」约 66 + 格内距 24 ≈ 114，进 8 的整档。
   * `--table-column-amount` 是数字列的**内容盒**（metric − 两侧格内距），给按内容加减的自定义轨用，
   * 它是派生值，窄档块里用同一条式子重新声明（custom property 在声明处求值，只改 metric 不会带动它）。
   */
  --table-column-asset: 96px;
  --table-column-venue: 128px;
  --table-column-status: 112px;
  --table-column-metric: 136px;
  --table-column-metric-wide: 160px;
  --table-column-identity: 160px;
  --table-column-time: 176px;
  --table-column-action: 96px;
  --table-column-body: 240px;
  --table-column-fill: 160px;
  --table-column-amount: calc(var(--table-column-metric) - 2 * var(--cell-inline));

  --overlay-gutter: 8px;
  --calendar-day-width: 96px;
  --calendar-day-height: 64px;
  --calendar-week-total-width: 104px;
  --calendar-heat-max: 30%;
  --scrollbar-size: 8px;
  /*
   * 侧栏槽宽实测 11（offsetWidth − clientWidth）。轨宽 220 = 244 − 12 左 − 1 右 − 11 槽，
   * 是侧栏唯一的对齐基准。全局 --scrollbar-size 不动：两端的 `*::-webkit-scrollbar`
   * 会把它带进三张冻结表的滚动条占位。
   */
  --scrollbar-size-rail: 11px;
  --scrollbar-thumb-border: 2px;
  /* Light 未实测，保留 alpha 混合；Dark 见 .dark 块的三档不透明实测值。 */
  --scrollbar-thumb: color-mix(in srgb, var(--foreground) 18%, transparent);
  --scrollbar-thumb-hover: color-mix(in srgb, var(--foreground) 30%, transparent);
  --scrollbar-thumb-active: var(--scrollbar-thumb-hover);
  /*
   * 窗口宽度档（08 §10）：窗与窗之间只有宽度不同，档只有这几颗；成员经 Dialog `width` / SettingsWindow `size`
   * 的枚举取档，不写任意宽度。480 是确认面默认档（Linear Log out 实测），560 是表单窗默认档，
   * 720 是任务窗（组合参数），1120 是中窥档（取窗里最宽的内容：账户持仓 10 列实测 1065）。
   * 420 同时是侧窥抽屉的合同档（同一个内容判据：单列属性）。
   */
  --window-width-420: 420px;
  --window-width-480: 480px;
  --window-width-560: 560px;
  --window-width-720: 720px;
  --window-width-1120: 1120px;
  /* 设置窗两档：个人设置 1180×704（Linear 偏好设置实测），管理台这类带满幅宽表的分组 1600 宽、钉视口高。 */
  --settings-window-width: 1180px;
  --settings-window-width-wide: 1600px;
  --settings-window-height: 704px;
  /* 回执栈宽（08 §10 回执右下、宽 360；窄于 360+2×16 时按视口收）。 */
  --toast-width: 360px;
  --settings-reading-width: 640px;
  --settings-section-gap: 48px;
  --settings-control-width: 160px;
  --settings-range-width: 176px;
  --settings-label-min: 128px;
  /*
   * 事实卡（管理台叶的分区形态：卡内小标题 + 「名称 | 值 | 动作」三列行）。名称列 168 装下「新交易对发现周期」
   * 这类 8 字业务名不折行；行 40 = 13/18 单行 + 上下 11，与设置行 65 分开——事实行只读、改动开窗，不装输入框。
   * 卡片阅读宽 688 = 640 行宽 + 两侧卡内距 24（卡内小标题与行同一左缘）。
   */
  --settings-fact-label: 168px;
  --settings-fact-row: 40px;
  --settings-card-reading-width: 688px;
  --form-column-min: 18rem;
  --form-section-content-gap: 16px;
  --form-field-narrow: 7.5rem;
  --form-field-compact: 10rem;
  --form-field-default: 12rem;
  --form-field-wide: 18rem;
  --record-identity-min: 10rem;
  --record-summary-min: 16rem;
  --data-identity-prefix-min: 32px;
  /* Linear Insights：发丝线。密点序列加粗会糊成色块，序列靠色与笔形（实/虚）区分，不靠线宽。 */
  --chart-line-primary: 1;
  --chart-line-secondary: 1;
  --chart-line-reference: 1;
  --chart-line-baseline: 1;
  --chart-line-overview: 1;
  --chart-marker-primary: 3;
  --chart-marker-secondary: 3;
  --chart-scale-margin: 0.08;
  --chart-overview-margin: 0.12;
  --chart-area-fill-near: 0.22;
  --chart-area-fill-far: 0.02;
  --chart-bar-spacing: 10;
  --chart-plot-height: clamp(18rem, 48dvh, 34rem);
  /* 总览中的趋势面保留完整交互，为同页的指标与明细留出阅读容量。 */
  --chart-plot-summary-height: clamp(12rem, 30dvh, 20rem);
  --chart-plot-min-height: 12rem;
  --chart-plot-min-wide: 16rem;
  --chart-overview-height: 32px;
  --chart-tooltip-width: 244px;
  --chart-data-max-height: min(20rem, 45dvh);
  --chart-compact-width: 420px;
  --chart-brush-grip: 7px;
  --chart-brush-click-slop: 3px;
  --chart-annotation-offset: 6px;
  --chart-legend-width: 28px;
  /* 行内迷你走势（patterns/mini-trend）：指标卡与表格行里的字形高度。 */
  --mini-trend-height: 24px;
  --auth-content-width: 288px;
  --auth-action-pitch: 60px;

  /* 官网刻度（08 §18）。2026-09-17 对 linear.app 首页与价格页一次性快照复测：
     导航 72 / 64、首屏 64/1/-0.022em → 手机 38、节标题 48 → 24、收尾 72、节奏 128、字重 510 / 590、
     首页栅格 1344 + 两侧 46（读物页仍用 --marketing-measure）。此后由 ZML 自行演进，不追对方改版。 */
  --marketing-nav-wide: 72px;
  --marketing-nav-narrow: 64px;
  --marketing-grid-max: 1344px;
  --marketing-gutter-wide: 46px;
  --marketing-gutter-narrow: 24px;
  --marketing-display-wide: 72px;
  --marketing-display-narrow: 40px;
  --marketing-tracking: -0.022em;
  --marketing-lead: 24px;
  --marketing-body: 15px;
  --marketing-heading-weight: 590;
  --marketing-measure: 680px;
  --marketing-hero-wide: 64px;
  --marketing-hero-narrow: 38px;
  --marketing-hero-weight: 510;
  --marketing-heading-wide: 48px;
  --marketing-heading-narrow: 24px;
  --marketing-rhythm-wide: 128px;
  --marketing-rhythm-narrow: 80px;
  --marketing-cta: 44px;
  --marketing-reveal: 350ms;
  /* 官网刻度的其余档（2026-09-23 从公开页样式收上来，数值逐位不变）：公开页样式只写版式与组合，
     任何字号、字距、行盒、间距档与动效时长都读这里（08 §18「不带第二份刻度」）。
     -medium 是 lg 断点以下那一档，-narrow 是 sm 断点以下那一档。 */
  --marketing-display-medium: 56px;
  --marketing-hero-medium: 52px;
  --marketing-heading-medium: 40px;
  --marketing-lead-medium: 20px;
  --marketing-lead-narrow: 17px;
  --marketing-gutter-medium: 32px;
  --marketing-gutter-max: 80px;
  --marketing-rhythm-medium: 96px;
  --marketing-title: 24px;
  --marketing-title-narrow: 20px;
  --marketing-subtitle: 20px;
  --marketing-emphasis: 17px;
  --marketing-control-large: 14px;
  --marketing-small: 13px;
  --marketing-micro: 12px;
  --marketing-tag: 11px;
  --marketing-stat: 40px;
  --marketing-stat-narrow: 24px;
  --marketing-price: 32px;
  --marketing-metric: 28px;
  --marketing-metric-line: 32px;
  --marketing-reading-heading-narrow: 32px;
  --marketing-tracking-title: -0.012em;
  --marketing-tracking-body: -0.011em;
  --marketing-tracking-small: -0.01em;
  --marketing-tracking-figure: -0.02em;
  --marketing-tracking-tag: 0.04em;
  /* 跨页过渡：旧页 140 淡出、新页 260 升入（出比进快，读者的注意力先落到新页）。 */
  --motion-express-page-out: 140ms;
  --motion-express-page-in: 260ms;

  /*
   * 工作台时长梯（08 §12，唯一一张）：0（状态进场）/ 50（菜单族进场）/ 80（出现、勾选）/ 100（tooltip、开关把手）/
   * 150（悬停淡回、回执、展开、搬运）/ 210（菜单族退场）/ 250（侧窥）/ 300（模态、统计图揭开、告警成立）/
   * 400（成交闪）/ 1200（等待循环）。梯外只有两条**循环周期**，不是过渡时长：告警边轨呼吸 2400（08 §12 唯一允许的
   * 持续循环）与品牌 dither 2400（表现档）；官网的 --motion-express-* 属表现档，不进这张梯。
   * 曲线只有四类：强 ease-out `--ease-emphasized`（进场与退场）、对称 ease-in-out `--ease-move`（屏内搬运、变形、呼吸）、
   * ease `--ease-standard`（悬停与变色）、linear（匀速循环）；菜单族另用实测的 `--ease-popup-*` linear()。
   * Linear 的时长梯只有 0 / .1 / .15 / .25 / .35 / .45，全站 123 条非零 transition 里 101 条是
   * `0.15s ease`——动效不是曲线库，是一个时长。220ms 是自造中间值，已按梯归位。
   * 方向是不对称的：进场（hover / focus / 按下 / 展开 / 选中）立即翻，指针离开才用 150ms 淡回。
   * 所以 --motion-control 是「退场」时长，进场由下方的状态选择器覆写成 --motion-in。按下不缩放（08 §6.1）。
   */
  --motion-in: 0s;
  --motion-out: 150ms;
  --motion-instant: 0ms;
  /* beUI-inspired local continuity; static surfaces remain Linear calibrated. */
  --motion-swap: 150ms;
  --motion-swap-offset: 3px;
  --motion-ease-x1: 0.16;
  --motion-ease-y1: 1;
  --motion-ease-x2: 0.3;
  --motion-ease-y2: 1;
  --motion-micro: 100ms;
  --motion-floating: 100ms;
  --motion-disclosure: 150ms;
  --motion-control: var(--motion-out);
  --motion-overlay: 150ms;
  --motion-overlay-exit: 150ms;
  /* Menu / Popover / Select：可见进入先于 JS 状态收敛；退出先收缩再淡出。
     对齐实际可见曲线，不把 opacity > 1 误当可见过冲；其余 overlay 家族保持独立。 */
  --motion-popup-enter: 50ms;
  --motion-popup-exit: 210ms;
  --motion-popup-scale: 50ms;
  --ease-popup-enter: linear(0, .2753 14%, .3463 28%, .4662 42%, .6069 56%, .7615 70%, .9028 84%, 1);
  --ease-popup-scale-enter: linear(0, .1377 14%, .1732 28%, .2331 42%, .3035 56%, .3807 70%, .4514 84%, .5 96%, 1 96%, 1);
  --ease-popup-exit: linear(0 0% 15%, .1331 18%, .2742 21%, .3943 24%, .4956 28%, .6697 34%, .8114 44%, .8982 54%, .942 64%, .9679 74%, .9817 84%, .9901 94%, 1);
  --ease-popup-scale-exit: linear(0, .1814 18%, .2734 30%, .3772 44%, .4846 58%, .5 64%, 1 64%, 1);
  /* 模态开场实测 WAAPI 300ms 无过冲弹簧（20%→0.57、35%→0.83、50%→0.95 后长尾收敛）。 */
  --motion-dialog: 300ms;
  /* 统计图首次揭开（08 §12 登记的例外）：非实时统计图只在首次打开时整块从左往右揭开，clip-path 不动数据，
     切换不重播，减弱动态关闭；不做柱子逐根长出（准星读数与读屏会读到动画中间值）。执行：chart-reveal。 */
  --motion-chart-reveal: 300ms;
  --motion-panel: 250ms;
  /* 慢呼吸周期（告警边轨，08 §12 唯一允许的持续循环）；曲线是对称的 --ease-move。
     状态点的「进行中」呼吸不另开周期，读等待循环 --motion-loop。 */
  --motion-pulse-slow: 2400ms;
  --motion-loop: 1200ms;
  /* 等待 → 结论、占位 → 内容、懒路由切块只有一条淡入：Linear 路由切块实测 80ms，没有 spinner、骨架或文案。
     这是全站唯一的「出现」时长；整块一次揭示，不逐项 stagger（08 §12、§19）。 */
  --motion-reveal: 80ms;
  /* 等待的静默期（08 §19）：短于它的等待什么都不画。与 primitives/state-frame-spec 的 STATE_FRAME_QUIET_MS 同值
     （两端测试核对）；样式层只在骨架这一处兑现它，组件里的计时仍归 state-frame-quiet。不随减弱动态归零：它不是动效。 */
  --wait-quiet: 1000ms;
  /* 后台刷新拖过静默期时，已有内容略降的不透明度（08 §19「后台刷新不画加载态，旧内容保留并略降不透明度」）。
     只降到仍完全可读：它说的是「这份可能马上要换」，不是「这份不可用」。 */
  --opacity-refreshing: 0.64;
  /* 事件闪烁（成交改写数值）：一次线性衰减；减少动效下同一时长的静态底色，所以这一颗不在减少动效里归零。 */
  --motion-event-flash: 400ms;
  /* 报警成立：底色与边轨从 0 进场（进场用强 ease-out），之后边轨按 --motion-pulse-slow 呼吸。取梯上的 300。 */
  --motion-alert-ignite: 300ms;
  /* 品牌等待：根等待面上家族标识的 dither 明暗循环周期（08 §17、09 §10）。全站唯一的表现档循环。 */
  --motion-brand-loop: 2400ms;
  /* tooltip / toast 的方向性入场位移。菜单与 popover 实测**只动 opacity + scale，没有这一层平移**——
     它们不是「位移量为 0」，而是配方里根本不写 translate。曾为此另存一颗 0 值的
     --motion-overlay-offset，没有任何配方读它（读了反而会凭空多出一条恒等 transform），已删。 */
  --motion-floating-offset: 4px;
  --motion-overlay-scale-from: 0.98;
  --motion-dialog-scale-from: 0.968;
  --motion-panel-offset: 8px;
  /* 0.01ms 而非 0：依赖 transitionend / 读计算时长调度退场移除的逻辑仍要收到事件。 */
  --motion-reduced-duration: 0.01ms;
  --ease-standard: cubic-bezier(0.25, 0.1, 0.25, 1);
  /* 强 ease-out，全站**唯一**的 ease-out：无过冲弹簧的 bezier 近似（t=.2→.62、.35→.83、.5→.92，与实测采样吻合）。
     模态、侧窥、回执、tooltip、开关、勾选的进场**与退场**都读它：退场也走强 ease-out——ease-in 起步慢，恰好拖住
     用户点了关闭之后最盯着的那一刻。此前另有三颗别名（dialog / overlay / exit）指向它、三颗 CSS `ease-out` 关键字
     （floating / switch / checkbox，Linear 勾选框实测值）与它并存，已合并：80–150ms 的过渡里两条 ease-out 看不出差别，
     一个角色一条曲线（08 §12）。 */
  --ease-emphasized: cubic-bezier(0.16, 1, 0.3, 1);
  /* **§12「屏内移动 / 变形用 ease-in-out」这一整桶的曲线**，不只是搬运。
     元素从一个位置搬到另一个位置（重排推让、拖放落位），以及就地改几何（箭头转 90°、条宽随值变），
     两端都静止、两端都在视野里，要的都是起步和收尾对称的 ease-in-out（动效规则 §2 moving）。
     进场/退场那五条全是 ease-out（起步猛、收尾缓）——用在这一桶上会让元素「弹出去再刹住」，
     读起来像被甩过去而不是被搬过去。这是第 6 条曲线，理由是现有五条里没有任何一条是对称的：
     不是取值偏好，是缺一类。

     **2026-09-21 更正认领范围**：原注释只写了「位移专用」，于是给 `transition-transform`
     / `transition-[width]` 补曲线那一轮找不到 owner，错按「变色」桶补了 `--ease-standard`。
     §12 那条把「屏内移动」与「变形」并列在同一桶里，后半句此前没有 owner，现在有了。
     下面那颗 --motion-move 仍然只服务搬运（时长与指针状态有关，见其注释），变形各用各的时长。 */
  --ease-move: cubic-bezier(0.77, 0, 0.175, 1);
  /* 这一桶的时长自成一档，不借 --motion-control：那一档是**状态**时长，元素一被指到或按下就塌成 0
     （见下方冻结规则）——而拖放落位恰好发生在手指刚离开、元素仍是 :hover 的那一刻，
     借它会让落位动画被自己的悬停态吃掉，变回瞬移。

     **2026-09-21 第二轮对抗性审计：变形那三处正好踩了这个坑。** 给它们补曲线那一轮换了
     --ease-move 却没换时长，而展开箭头的宿主是 IconButton（`<button>`，且自带 `aria-expanded`）
     与 `<summary>`，两者都在冻结选择器表上：点它的那一刻 `:hover`+`:active` 成立、展开后
     `[aria-expanded="true"]` 继续成立，实测 hover 中 `--motion-control` 解出 **0s** ——
     曲线一帧都跑不了。--motion-move 与 --motion-out 同为 150ms，换过去时长不变、不再被冻结。
     曲线与时长要一起换：这一桶的两颗本来就是一对。 */
  --motion-move: 150ms;
  /*
   * 表现型动效刻度（08 §12、§18）——只给**展示面**用：官网、引导、空态、庆祝。工作台控件仍是上面那架
   * 0 / .1 / .15 / .25 梯，不因为有了这一档就给按钮、菜单、表格加弹簧。
   * 气质对齐 Linear 官网实测：进入 0.7s cubic-bezier(.32,.72,0,1)、悬停 0.1s / 0.16s ease-out-quad；
   * 连续形变、数字滚动、光标跟随借 beUI 的语汇，但弹簧压到近临界阻尼（过冲 ≤ 1.7%），不做果冻回弹。
   * 引擎是 primitives/expressive-motion.ts，刻度只在这里一份；成员不在页面里手写时长与曲线。
   */
  --ease-spring: linear(0, 0.006, 0.025 2.8%, 0.101 6.1%, 0.539 18.9%, 0.721 25.3%, 0.849 31.5%, 0.937 38.1%, 0.968 41.8%, 0.991 45.7%, 1.006 50.1%, 1.015 55%, 1.017 63.9%, 1.001 85.9%, 1);
  --ease-express-enter: cubic-bezier(0.32, 0.72, 0, 1);
  --ease-express-hover: cubic-bezier(0.25, 0.46, 0.45, 0.94);
  --motion-express-hover: 100ms;
  --motion-express-swap: 160ms;
  --motion-express-enter: 600ms;
  --motion-express-enter-offset: 16px;
  --motion-express-stagger: 60ms;
  --motion-express-word: 560ms;
  --motion-express-word-stagger: 40ms;
  --motion-express-count: 1400ms;
  /* 滚动点亮的逐词淡入、光标聚光 / 倾斜高光的出现（展示面专用）。 */
  --motion-express-scrub: 400ms;
  --motion-express-spot: 300ms;
  --motion-express-glide: 340ms;
  --motion-express-roll: 520ms;
  --motion-express-tilt: 3;
  --motion-express-magnet: 2;
  /* 展示面的环境循环（官网装饰：流线、呼吸、极光漂移、跑马灯）。只在进入视口时跑，离屏由成员的唯一可见性观察者暂停；
     减少动效下这里归零，成员另给静态终值（08 §12、§18）。flow-step 是同组流线逐条错开的相位差。 */
  --motion-express-ambient-flow: 3600ms;
  --motion-express-ambient-flow-step: 550ms;
  --motion-express-ambient-breathe: 4800ms;
  --motion-express-ambient-drift: 26000ms;
  --motion-express-ambient-drift-alt: 32000ms;
  --motion-express-ambient-marquee: 60000ms;

  --z-base: 0;
  --z-raised: 1;
  --z-sticky: 10;
  --z-navigation: 20;
  --z-workbench-controls: 30;
  --z-floating: 40;
  /* 装饰层：在导航之上、浮层之下。庆祝动效不得盖住 dialog、drawer、popover 或 toast。 */
  --z-celebrate: 45;
  --z-overlay: 50;
  --z-toast: 70;
  --z-skip-link: 90;

  /* 庆祝动效（docs/08：只用于一次性里程碑）。数值按实际渲染静帧校准：
     透视下限 0.22 防止纸片被压成一像素线；背面混白 0.30 让翻面可辨而不洗白饱和度。 */
  /* 基准密度按 1440×900 定，实际粒子数随视口面积缩放（0.55–1.5 倍）。 */
  --celebrate-count-burst: 320;
  /* 重力按「整发 3-4 秒收干净」定：终端速度 = 重力 / (1 - 阻力)。
     0.115 配上主体层的阻力只有 1.4px/帧，尾巴会拖到 10 秒。 */
  --celebrate-gravity: 0.30;
  --celebrate-flip-floor: 0.22;
  --celebrate-back-mix: 0.30;
  --celebrate-lum-floor: 0.82;

  /* 发丝环随 hover 加深，是 Select 触发器这一族唯一的悬停反馈（原来它是状态不变的）。
     Light 的 hover 档未实测，取与 --chip-ring-strong 同深（0.088 → 0.15，加深 1.70×），
     与 Dark 实测的 0.143 → 0.238（1.66×）同比，方向与幅度都对得上。推导值，待取证。 */
  /*
   * 主内容面的外边界自成一颗：Linear 实测 main 四边是 lch(13.08 1.48 272)，不是通用 --border(14.16)——
   * 而 --border 正被资金费率矩阵当列分隔线消费，不能动。矩阵已移出冻结面，但这条消费关系还在：
   * 改这颗就是直接改矩阵的列分隔线。Light 侧 Linear 值未取证，先别名回 --border。
   */
  --shell-surface-border: var(--border);
  /* Linear 实测复选框未选态边 lch(55.92 1.93 272)、过渡 80ms（比控件族的 150 快一档）。 */
  --checkbox-border: var(--input);
  /*
   * 表外复选框的静止边：实测这一档差了 26.5 个 L*（我们 78.5 带 1.48 紫偏，参照 52.04
   * 纯中性），是本族最大偏差，所以另起一颗承接，不动上面那颗。
   *
   * **更正**：分家时写的理由「--checkbox-border 被冻结的组合主表消费」经查不成立——
   * 冻结作用域把 --zml-checkbox-border 显式指向 var(--border-strong)，那里根本不读
   * --checkbox-border；而消费链首取的又是本颗（两个主题都有值，兜底永不触发），
   * 于是 --checkbox-border 现在两侧都没有读者。是否删除属于 root 侧取舍，留给该 owner。
   */
  --checkbox-border-standalone: lch(52.04% 0 282);
  --motion-checkbox: 80ms;
  --shadow-hairline: 0 0 0 0.5px rgba(0, 0, 0, 0.088);
  /*
   * hover 档 alpha 是 0.147，不是 0.15。Light 实测（真实指针悬停坐实，非规则推读）参照站
   * 这一圈就是 lch(0 0 0 / 0.147)；rest 侧 0.088 与 Dark 的 0.148 / 0.247 三颗早已逐位精确，
   * 只有这一颗当初按「0.09 → 0.15」的整数直觉补齐。它同时喂 chip 选中环、分段未选 hover 环、
   * 分段选中环、Select hover 环四处，一颗归位四处同时对上。
   *
   * 冻结面不钉（逐张表查过的结论，不是省略）：读这颗的四族——Button 的 chip 档、Chip、
   * Segmented、Select 触发器——在三张冻结表里一个实例都没有；表内只有表头、选择框、数值格
   * 与行内 IconButton，且冻结起点上这颗 token 还不存在。将来若真有上述控件落进冻结表，
   * 要钉的是「起点等价物」而不是这颗现值。
   */
  --shadow-hairline-hover: 0 0 0 0.5px rgba(0, 0, 0, 0.147);
  --shadow-main-surface:
    0 3px 6px -2px rgba(0, 0, 0, 0.02),
    0 1px 1px rgba(0, 0, 0, 0.04);
  /*
   * 抬起态（工作面工具钮等圆形/药丸 chip）：发丝环 + 环境投影 + 接触投影三层。
   * 环随状态加深，按下/展开时**只留环、去掉两层投影**——chip 被压回平面，
   * 这一下"沉下去"就是 rest/hover/open 三态的质感差别，靠单一 border 做不出来。
   */
  /*
   * 环 alpha 是按所在表面标定的，不是常数：参照站同一个环变量在工具条上解成 0.133、
   * 在别处 0.137、在设置卡上 0.143（Light 侧对应跨度 0.088 / 0.09 / 0.093），
   * hover 侧同理 0.222 / 0.238。所以 --chip-ring 与 --shadow-hairline **不是重复**，
   * 是同一条环规则在两个表面上的两次标定：--chip-ring 走工作面工具钮/药丸那一档
   * （Light 0.09→0.15、Dark 0.137→0.229），--shadow-hairline 走 Select 触发器 /
   * 分段 / 设置卡那一档（Light 0.088→0.15、Dark 0.143→0.238）。
   * 两者合并成一颗会在其中一族上偏亮或偏暗，参照站自己就避开了这种写死。
   */
  --chip-ring: rgba(0, 0, 0, 0.09);
  --chip-ring-strong: rgba(0, 0, 0, 0.15);
  /*
   * chip 底色绕着工作面明度做对称摆动：rest 比 --work-surface(97.94) 亮约 2L，
   * hover 比它暗约 2L。所以静止时是"浮起的白片"，指过去才变成"压下的灰片"，
   * 而不是从透明淡入一层灰。chip 自成一族，不复用 --control-hover（那管菜单行与普通 quiet）。
   */
  --chip-surface: var(--control-idle);
  --chip-surface-hover: lch(95.883% 0.157 282);
  /*
   * 展开态。Light 实机（工具栏「显示选项」chip，底 --work-surface 97.95）三档量到
   * rest 100 → hover 95.84 → 展开 94.80：rest→hover 4.16L 够，hover→展开只有 1.05L。
   * 展开时确实还多丢了两层投影，但那两层是 2% 与 4% 的黑、在近白底上几乎不可见，
   * 撑不起「按下去」这一鼓——主信号仍是那 1.05L，低于可辨门槛。
   * 旧值 94.854 又恰好等于 --chip-current(94.86)，是两族撞到一起，不是这一族解出来的。
   * 按 Dark 实测的同一对（hover 14.777 → open 18.634，3.857L）乘侧栏族镜像比 0.515 得 1.99L，
   * 从 hover 95.883 再压下去落在 93.893（实测明度 93.77）：距 hover 2.07L、距工作面 4.18L。
   * 推导值，待 Linear Light 实测确认。
   */
  /*
   * 展开态实机 computed 底。旧值 93.893 的弃用理由是「94.854 与 --chip-current 撞车」——
   * 撞值是我们 token 命名的问题，不构成否定实测的证据；而 93.893 反而贴近参照的选中
   * tab(93.483)，串到隔壁族去了。按实测改回。
   */
  --chip-surface-pressed: lch(94.854% 0.157 282);
  /*
   * 抬起族 = 「环 + 主面投影」的合成式：环走各主题自己的 --chip-ring / --chip-ring-strong，
   * 投影段引 --shadow-main-surface，不再逐层重抄。此前 Light 与 Dark 各把投影段抄了一遍，
   * 于是同一段投影在每个主题里都有三处副本（--shadow-main-surface、--shadow-raised、
   * --shadow-raised-hover），改一处必漏其余。展开求值与收敛前逐字节相同。
   *
   * **这一族必须在每个主题块里各声明一次，不能只在 :root 写一遍。**
   * 自定义属性的 var() 替换发生在**声明它的那个元素**上，替换完的结果才向下继承；
   * 只写在 :root 时，`.dark` 一旦不在 html 上（主题作用域是嵌套容器：局部反色岛、
   * 主题化浮层、预览面），该容器里的 --chip-ring 已经改不动上游替换好的结果，
   * Dark 表面会画出 Light 的黑环。这一条实机验过：在 Light 页面里挂一个 .dark 容器，
   * --shadow-hairline / --shadow-main-surface 都正确切到 Dark，唯独只在 :root 声明的
   * --shadow-raised 三颗仍解析成整串 Light 值。所以下面 .dark 里那三行不是重复，是必需。
   */
  --shadow-raised: 0 0 0 0.5px var(--chip-ring), var(--shadow-main-surface);
  --shadow-raised-hover: 0 0 0 0.5px var(--chip-ring-strong), var(--shadow-main-surface);
  /* 展开只保留加重环；兼容阴影列表由浏览器自动补齐，不保存透明占位。 */
  --shadow-raised-pressed: 0 0 0 0.5px var(--chip-ring-strong);
  /* 设置分组使用独立实线边框，避免半像素外投影在缩放时显得断续。 */
  --settings-section-border: var(--border);
  --shadow-floating:
    0 6px 18px rgba(0, 0, 0, 0.02),
    0 3px 9px rgba(0, 0, 0, 0.04),
    0 1px 1px rgba(0, 0, 0, 0.04);
  --shadow-dialog:
    0 9px 48px rgba(0, 0, 0, 0.08),
    0 6px 24px rgba(0, 0, 0, 0.1),
    0 1px 1px rgba(0, 0, 0, 0.04);

  --background: lch(94.44% 0.5 282);
  --work-surface: lch(97.94% 0.5 282);
  --sub-surface: lch(96.8% 0.4 282);
  --card: lch(99.3% 0.3 282);
  --elevated: lch(100% 0 282);
  --popover: lch(100% 0 282);
  --select-compact-list-surface: lch(97.94% 0.5 282);
  --select-compact-list-border: lch(84.44% 0 282);
  --select-compact-list-hover: var(--menu-item-hover);
  --menu: lch(100% 0 282);
  --overlay-surface: lch(100% 0 282);
  --modal-scrim: rgba(0, 0, 0, 0.25);

  /*
   * 9.794 与 --tab-current(93.483) 出自参照站同一个主题档；旧值 9.444 属于另一个档
   * （那一档的选中底是 89.983），等于底色取 A 档、文字取 B 档，档内自相矛盾。
   * 实测调色板的 Light 文字四级也正是 9.794 / 19.588 / 39.176 / 64.64。
   * 渲染差 1/255（rgb 26 → 27）。冻结面的 --foreground 跟这颗同值：排版不在冻结轴上，
   * 表内主语必须与页面其它字、与参照标题同一档，不能再钉回 9.444 让组合表暗一截。
   */
  --foreground: lch(9.794% 0 282);
  --secondary-foreground: lch(19.588% 1.25 282);
  /* 2026-09-20 由 AA 反推加深（原 39.176）：告警行底色固定在 12% 之后，限定词档在斑马 + 告警底上
     只有 4.19，破 AA——它是这条梯上最后一处不够的。36% 回到 4.88，工作面上同时从 6.34 升到 7.09。
     与 Dark 档那次抬亮同源：冻结保护的是 chrome 的色轴升级不得穿透，不是保护一个实测低于 AA 的取值。 */
  --muted-foreground: lch(36% 1.25 282);
  /*
   * Light 文字四级阶梯（实测调色板）：9.794 / 19.588 / 39.176 / 64.64。
   * 上面三级已逐值命中，只有这一级此前取 61.803 —— 那是 **Dark 的 --muted-foreground**，
   * 是跨主题借错了档，不是 Light 自己的解。禁用文字按 WCAG 1.4.3 属 incidental，
   * 不受 4.5:1 约束（在 --work-surface 上 2.84 → 2.58，两个值本来都在门槛以下）。
   */
  --disabled-foreground: lch(64.64% 1.25 282);
  --inverse-foreground: lch(100% 0 282);

  --border-subtle: lch(95.24% 0 282);
  --border: lch(89.84% 0 282);
  /*
   * 分段拼接件（筛选子句胶囊的外框与段间竖线）的边。Light 实测 84.44，正落在**同一条 chroma-0
   * 边阶梯**的第三档：95.24 → 89.84 → 84.44，两步都恰好 5.4L。所以它不是新机制，是这条阶梯
   * 本来就缺的一格。
   *
   * 不借 --border-strong：那颗是 chroma 1.48 的**另一条**阶梯（Light 78.5），不是这条的下一档；
   * 借它会让子句框比参照重 5.94L，而子句是密排的、外框与段间线同时重 6 个 L 档就从「一枚被切开的
   * 实心片」读成「一排带黑边的小格」。也不借 --border（89.84）：段间线与外框同色时，胶囊在
   * --control-idle(99.997) 的段底上几乎分不出段。
   *
   * 冻结面不钉：这颗是本轮新增，冻结起点上不存在，且三张冻结表里没有子句实例（表内只有表头、
   * 选择框、数值格与行内 IconButton）。将来若真有分段件落进冻结表，要钉的是「起点等价物」。
   */
  --border-segmented: lch(84.44% 0 282);
  --border-strong: lch(78.5% 1.48 282);
  /* Linear App Light `--focus-ring-color` 实测 #6d78d5，不是 primary 的高彩度紫。 */
  --border-focus: #6d78d5;
  /* 选中边自成一档，理由见深色块同名 token 的说明；浅色取值与拆分前逐位相同。 */
  --border-selected: #6d78d5;
  /* 正文链接色。浅色这一档尚无实测值，先按拆分前的表现原样保留（即 --border-focus 的取值），
     不假装它已经校准过；深色那一档有实测值。补测浅色后只改这一行。 */
  --link-foreground: #6d78d5;
  --border-invalid: lch(45.5% 54 29);
  --input: lch(86.5% 0 282);
  /*
   * 浮层三条线是三件事，不是一颗：外框（面与工作面的分界）、面内分隔线（弱于外框）、
   * 模态外框（模态自成一档）。原来全押在 --overlay-border 上，三处必有两处对不上。
   * Light 只有外框有出处。分隔线用 Dark 的「分隔线/外框各自相对面底的明度差之比」0.583
   * 折算：Light 外框差 100−91.9=8.1，× 0.583 得 4.7，落在 95.5，方向（比外框弱）与幅度都成立。
   * 模态外框看着像偷懒的别名，其实是同一条规则的解：Dark 里边相对自身面底的明度差恒为 12.96
   * （外框 25.68−12.72、模态边 22.193−9.232 完全相等），而 Light 两个面同为纯白，
   * 同差值必然同色。两条都是推导值，待 Light 实测确认。
   */
  --overlay-border: lch(91.9% 0 282);
  /* 实测：参照 Light 下「面内分隔线」与「面外框」恰好同值（拆成两颗只对 Dark 有意义）。 */
  --overlay-divider: lch(91.9% 0 282);
  --modal-border: var(--overlay-border);
  /* 模态面在 Dark 里比菜单浮层更暗、自成一档。Light 这边浮层面已经顶到纯白，
     再分一档只能往下压，模态反而显脏；而 Light 的抬升本来就由投影编码
     （--shadow-dialog 在 Light 是三层实投影，Dark 几乎不可见），不靠明度。
     所以同值是 Light 自己的解，不是把 Dark 抄过来。待 Light 实测确认模态面确实仍是纯白。 */
  --modal-surface: lch(100% 0 282);
  /*
   * 浮层开在模态之内时整体再抬一档。Light 顶到白就没有「再亮一档」可用，
   * 这一层的分离交给 --shadow-floating 与外框，明度上同值。
   * 外框那条另有依据：Dark 里边相对自身面底的明度差恒为 12.96（L1 与 in-modal 相等），
   * Light 两个面同为纯白，同规则解出同色。分隔线在 Dark 里 in-modal 反而更弱
   * （相对面底 4.32 对 L1 的 7.56），折到 Light 约 97.4，与现值只差 1.9L，
   * 还不值得另开一档，等实测再定。文字两条见下方 --overlay-foreground。
   * 与 Dark 段同一件事：这是模态之上的浮层，不是级联子面。
   */
  --overlay-surface-in-modal: var(--overlay-surface);
  --overlay-border-in-modal: var(--overlay-border);
  --overlay-divider-in-modal: var(--overlay-divider);
  --overlay-foreground-in-modal: var(--overlay-foreground);
  --overlay-muted-in-modal: var(--menu-muted);
  /*
   * 浮层内的文字与图标不跟工作面：Dark 实测正文 +0.73L、次级 +2.9L（暗色里更亮 = 更强）。
   * 这两句不能按明度照搬到 Light——「略亮」在 Light 是更弱不是更强。真按 Dark 的
   * 「相对自身面底的对比度」折算，Light 次级会落到约 45.7（比工作面档的 39.18 还浅），
   * 因为浮层面是纯白、比工作面更亮，等比例的对比度换算下来文字必然更浅，可读性反而降。
   * 无 Light 实测就不做这种减法：先按「对比度不变」指回工作面档。这是推导值，待取证。
   */
  --overlay-foreground: var(--secondary-foreground);
  /*
   * 浮层档次级文字。**此前 Light 是没填的别名**，而 Dark 早就是浮层专用值——
   * 同一颗 token 两个主题一半实测一半兜底，且 popover 的注释已经写着 Light 是 40，
   * 也就是那条注释在此之前是假的。实测参照的 39.176/19.588 与 40/20 不是两个表面，
   * 是它自己调色板的两个主题档：chrome 面用前者（我们逐值命中），浮层族用后者。
   */
  --menu-muted: lch(40% 1 282);
  /* 菜单/筛选行的高亮贴片。菜单面比工作面亮，高亮档必须跟着抬，
     不能沿用按工作面标定的 --control-hover（那颗还被冻结数据面消费）。
     值按 Dark 的 8.1L 差 × 侧栏族同一条镜像比 0.515 = 4.17L 折算，落在白底下的 95.83；
     与所在面（--overlay-surface 100）差 4.17L，可见性成立。推导值，待 Light 实测。 */
  /* 实测 95、且是纯中性 C=0——浅色高亮不带彩度。Dark 的 20.82/1.3 已逐值命中，别动。 */
  --menu-item-hover: lch(95% 0 282);

  --control-idle: lch(99.997% 0.5 282);
  --control-hover: lch(94.5% 0.157 282);
  /* **控件族没有「按下档」，这是合同不是遗漏。** 参照站的 `:hover` 与 `:active` 是两条
     同值声明（Light 设置页 form 档触发器实测，见 select-variants 那段），按下沿用悬停编码；
     08 §6.1 把「按下不新增静态材质档」写成规则，button-variants 记载它是两个主题六个控件族
     实测里唯一无例外的一条。这里曾有一颗 --control-pressed(93)：select 因为「hover→active→展开
     解出三个值而参照只有一个」把它撤掉，collapsible 与 native-disclosure 却留着，直到悬停/按下
     进入矩阵量程才被量出来（2026-09-17）。token 一并退役，免得下次又有人按名字取用。 */
  --control-current: lch(89.54% 0.5 282);
  --control-selected: lch(91% 0 282);
  --control-checked: lch(53% 52.26 286.91);
  /* Linear Light Issue options：quiet 28px 图标按钮，rest 透明且无投影；
     菜单展开后背景为此值，::before / ::after 仍无投影。与工具 chip 同底不代表同族：
     chip 另有环与投影。替代从 Dark 镜像推导的 87.36，不再按“最深档”猜开态。 */
  --control-open: lch(94.854% 0.157 282);
  --tab-current: lch(93.48% 0.5 282);
  /*
   * 标签轨自成一族：与 quiet 图标钮同一档，与工具 chip（chroma 更高）分开。
   * 上一版把 hover 别名到 --control-hover，只核了「hover 相对底板可见」，没核 hover 相对 current。
   * Light 实机量到的坏在 Tabs 那条轨上（底 --work-surface 97.95）：idle 100 / hover 94.45 / current 93.42——
   * hover 与 current 只差 1.02L：指到一个非当前页签时，它和当前页签看起来一样「已选」，
   * 当前项失去唯一性。Dark 同一对是 14.006 → 16.706（2.70L），没有这个歧义，所以是 Light 独有的坏。
   * 注意实测那条轨的 hover 读的是 --control-hover 不是本颗（两颗当时同值，坏法一样），
   * 而药丸轨的非当前态没量到（现场只有一个当前药丸）。所以本颗只治得了药丸轨与三处 quiet 悬停，
   * Tabs 那条轨要等它自己改key——这条不在 tokens 层能修完，见交接。
   * idle(=--control-idle 100) 与 current(93.48，Linear Light 实测) 都有出处不能动，只有 hover 是自由项，
   * 可行窗口是 94.92–96.45：下界来自 current，上界来自 --work-surface——因为这颗还被属性行、
   * 列头排序钮、「加筛选条件」借去当工作面上的 quiet 悬停，不只是药丸轨自己的。
   * 取窗口内让三个底（idle / current / work-surface）余量同时最大的一点：95.69，
   * 实测明度 95.79，三边余量 4.21 / 2.37 / 2.16。chroma 跟同族的 idle 与 current 取 0.5，
   * 不再带 --control-hover 的 0.157。推导值，待 Linear Light 实测确认。
   * 若将来实测证明 Linear 的药丸 hover 与工作面 quiet 悬停本来就是两个键，这颗要拆成两颗。
   */
  --tab-idle: var(--control-idle);
  /*
   * 实测。原注自称「推导值，待 Linear Light 实测确认」，本轮取到了。
   * 落它的前置条件（细环 + 未选投影）也已在本轮建立——参照正是靠那条抬起通道，
   * 才敢把 hover 底压到离选中只差 1.37L 而不产生「hover 看起来像已选」的歧义。
   */
  --tab-hover: lch(94.854% 0.5 282);

  /*
   * 侧栏档。侧栏底（--background）是全壳最暗/最深的一层，工作面在它之上，
   * 所以一套按工作面标定的 --control-hover 落到侧栏必然过头：Light 下
   * 94.5 落在 94.44 的底上只差 0.06L，等于没有悬停反馈。
   * Light 侧栏 2026-09-09 实机（Linear All issues 1440 DPR2）：Inbox hover 底
   * lch(91.64 0.5 282)、字色 lch(9.794)；current Issues 底 lch(89.54) = --control-current。
   * 本颗 91.43 对 live 91.64 差 0.21 L*，感知阈内不改值。旧句「Linear 页面内不存在
   * Light 调色板」已证伪——工作区当时就是 Light，Dark 才是未切主题所以未测。
   */
  --rail-item-hover: lch(91.43% 0.5 282);
  --rail-item-current: var(--control-current);
  --rail-control-idle: lch(90.55% 0.4 282);
  /*
   * 安静轨工具（Help 24、Search 28）rest 透明，hover/open 同值 lch(0 0 0 / 0.06)。
   * 不是别名 idle：idle 90.55 是开态钉钮的底，拿来当 rest→hover 等于没有反馈。
   * 钉钮 aria-pressed 仍走 idle / --rail-control-hover，不读这颗。
   * Dark 未测 Linear，那边仍别名 idle。
   */
  --rail-control-quiet-hover: lch(0 0 0 / 0.06);
  --rail-control-hover: lch(88.17% 0.4 282);

  /*
   * 行填充档。行与控件不是同一件事：Linear 的行选中带靛蓝色相，不是零彩度灰，
   * 而且有 selected+hover 第三档。--control-hover / --control-selected 保持原值供控件与冻结面。
   * Light 实机（All issues 1440 DPR2）：issue 行坐在 --work-surface lch(97.94% 0.5 282) 上，
   * hover ::before 是画布 --background lch(94.44% 0.5 282)，不是控件 hover 94.5/0.157。
   * L* 与 94.5 只差 0.06（阈内），差在 chroma 0.5 vs 0.157——别名到 --background 才能同色相。
   * Dark 仍是独立档（弱于控件 hover）；Linear Dark 未测，不从 Light 反推。
   */
  /* 2026-09-21：行态改成**相对宿主底色的固定步**，不再是绝对色。
     旧值 --background（L94.44）是一颗钉死的颜色，叠到别的底色上步长就变：实测同一张表里
     hover 在白行走 −9.45、在斑马行只剩 −2.47，差 4 倍；同产品还并存 −6.63（导航项）、
     −4.85（菜单项）、−3.13(−4.16)（按钮）几档强度，而 ZML 平台的表行与搜索框干脆没有 hover。
     根因是这颗 token 有**两个 owner**：这里的绝对色（列表行 / 导航项用）与表面上的 color-mix（表行用）。
     现在只有一个做法：`color-mix(前景 N%, 当前宿主底)`，N 固定，于是**在任何底色上步长相同**。
     梯（ΔL*）：hover 4 · 当前 6 · 选中 6（带色相）· 告警 8。两两 ≥ 2，且都不跟降级后的斑马（3.5）打架——
     斑马此前 6.98，早就吃到「当前」该在的位置上了。
     百分比按实测反推（浅：3.5% → ΔL* 2.77、4.5% → 3.48，约 0.71/%）。 */
  /* 行态梯的**步长**只登记一次（08 §9.2：hover 4 < 当前 6 ≈ 选中 6，相邻 ≥ 2）。列表族在 tr 上、
     组合主表在行上各自拿本行底色套同一组步长；此前两处各写一遍百分比，组合表还另有一套 8% / 11%
     ——同一把梯三份数字（2026-09-22 收口）。这里的绝对色只供没有行底色可读的列表行 / 导航项。 */
  --row-step-hover: 5.2%;
  --row-step-current: 8%;
  --row-step-selected: 13%;
  --row-step-selected-hover: 19%;
  --row-fill-hover: color-mix(in srgb, var(--foreground) var(--row-step-hover), var(--work-surface));
  --row-fill-current: color-mix(in srgb, var(--foreground) var(--row-step-current), var(--work-surface));
  --row-fill-selected: color-mix(in srgb, var(--primary) 10%, var(--work-surface));
  --row-fill-selected-hover: color-mix(in srgb, var(--primary) 16%, var(--work-surface));
  /* 槽 = Linear controlTertiarySelected（与 Tabs current 同键）。Auth 语言 Segmented 凹槽用。 */
  --segmented-track: var(--tab-current);
  /* 滑块 = Linear elevated。Auth 凹槽滑块用。 */
  --segmented-current: var(--elevated);
  /* Display List/Board 独立按钮选中自填色（Linear Light 实测 95.54，不是凹槽滑块）。 */
  --segmented-option-current: lch(95.54% 0 282);
  --chip-current: lch(94.86% 0 282);
  /*
   * 未选 pill / 关 chip / Select 触发器的「井」。Light 实机复核：这颗在白浮层上只比面底低 0.665L，
   * 落到设置分组卡（--card 99.335）上更是 0L——井本身完全没有填色，全靠 --shadow-hairline
   * 那圈 0.088 黑（叠在卡上解出 91.2，差 8.1L）撑边界。Dark 侧同一颗相对面底是 +4.63L 的实底。
   * 本轮不动它：状态对（rest→hover 2.08L、off→on 4.54L）都在门槛之上，抬起感在 Light 本来就
   * 由环与投影编码（面已顶到白，没有「更亮一档」可用），改这颗等于替 Linear 决定 Light 的抬起语言。
   * 待 Linear Light 实测「白面板上的 Select 触发器到底有没有自己的底色」再定。
   */
  /*
   * 解开对 --card 的别名，按实测独立取值。两个互不相干的表面（切换 chip 的 OFF rest 与
   * 浮层内 Select 触发器的 rest）都量到 lch(100% 0 282)，即与浮层面底 ΔL* 精确为 0——
   * 白面已顶到白、没有更亮一档可用，轮廓 100% 由 0.5px 环承担。环与投影本轮已补上，
   * 所以这颗现在跟得起；改的是本族取值，不动 --card 的其它消费者。
   */
  --option-well: lch(100% 0 282);
  /* 未选/OFF 态 hover 是「亮起一格」，且文字只到 overlay 正文档——全白留给 ON 态，hover 不许抢。
     Light 未实测，按 Dark 的 ΔL 镜像推导，待取证。 */
  /* 实测 96.914 且纯中性（我们原带 0.157 彩度）。原注「Light 未实测，按 Dark 镜像推导」已作废。 */
  --option-well-hover: lch(96.914% 0 282);
  /*
   * 浮层内 Select 触发器的 hover 底。**必须与 --option-well-hover 分开**：
   * 那颗同时被切换 chip 与分段控件消费，而它们的 hover 底实测是另一个值。
   * 两族在 rest 档同值（都是 --option-well），只在 hover 档分家。
   */
  --select-well-hover: lch(95.886% 0 282);
  /*
   * Select 触发器展开时的实色 border——这是本表面**唯一一处 border 真正上色**的地方，
   * 也是参照站开合的全部视觉差异（底与字都停在 hover 档、环回落到 rest）。
   * 注意这一族不走「压平」：open 保留投影，靠提底 + 文字提亮 + 这圈实色边加重。
   */
  --select-open-border: lch(75.7% 0 282);
  --option-well-hover-foreground: var(--overlay-foreground);
  --switch-track-off: lch(82.5% 0.05 282);
  /*
   * 关轨 hover 实测。此前借 --field-border-pressed（lch(74% 1.48 282)）：暗了 2.98L
   * 且带 1.48 紫偏，而参照这一颗近乎纯中性。独立成一颗还解开了一处死结——
   * --field-border-hover / -pressed 那三档原本因为「被关轨 hover 借去当填色」而不敢动，
   * 借用解除后它们可以按字段边框自己的实测独立收敛。
   */
  --switch-track-off-hover: lch(76.98% 0.08 282);
  /*
   * 勾选族的 hover 强调色。此前 switch ON-hover、checkbox 的 hover 边与选中 hover 边、
   * radio hover 边全部借 --primary-hover（当时是 lch(44% 53.85 286.91)）——那是按钮主色的
   * hover 档，比参照暗 3L、艳 3.59C。rest 强调走 --control-checked，hover 走这一颗，
   * 整族两个态各收敛成一颗，不按控件分别定义。
   */
  --control-checked-hover: lch(47% 50.26 286.91);
  /* 开轨填充 hover（暗色那侧的理由见 .dark 块）。浅色这一侧 hover 本来就往暗走、
     滑块对轨 3.94 → 4.846 方向正确，所以与边框那颗同值，不额外分叉。 */
  --switch-track-on-hover: lch(47% 50.26 286.91);
  --field: lch(100% 0 282);
  --field-border: lch(86.5% 1.48 282);
  /*
   * 三档全是旧的推导值，Dark 实测已经动摇了其中两点，但都不到能盲改的程度：
   * 一是 Dark 的 hover 信号是「彩度从 1.93 跃到 6.93」而不是明度，Light 这三档彩度全是 1.48、
   * 没有那一跃；二是 Dark 实测按下与 hover 同值，Light 独有第三档。
   * 不动的原因是这颗被 Switch 的关态轨 hover 借去当填色（不是边框），
   * 折掉第三档会把那处 8.5L 的悬停反馈压到 2.5L。要改得连组件侧的借用一起改，
   * 且必须先有 Light 实测。
   */
  --field-border-hover: lch(80% 1.48 282);
  --field-border-pressed: lch(74% 1.48 282);

  /*
   * 参照站 Light 的强调色实测是 lch(53% 52.26 286.91)（#6d78d5），比这颗亮 4.5L。
   * **明度这一档是有意不跟的，理由是对比度不是复刻**：主按钮标签走 --primary-foreground
   * （lch(100% 5 286.91)，即 rgb 255,254,255），13px/500 属正文级，WCAG 1.4.3 要 4.5:1。
   * 本轮独立复核（CIE Lab D50 → sRGB → 相对亮度，取 8bit 钳位后的值）：
   *   48.5% → rgb(97,109,201)  对比度 4.60:1  ✅
   *   53%   → rgb(109,120,213) 对比度 3.94:1  ❌ 掉到 4.5 以下
   * 跟到 53 会让全站最主要的动作按钮的标签不达 AA，所以明度停在 48.5。
   * 替代方案已经在文件里落地：参照的 53% 原色本来就同时是它的焦点色与勾选强调色，
   * 而这两处**不承载文字**（1.4.11 只要 3:1，3.94 达标）——--border-focus 已是 #6d78d5、
   * --control-checked 已是 lch(53% 52.26 286.91)。即「只在非文字承载处跟随」已经成立，
   * 缺的只有主按钮实底这一处，而那一处正是不能跟的那处。
   */
  --primary: lch(48.5% 52.26 286.91);
  /*
   * 明度：参照 hover 是 lch(47% 50.26 286.91)，相对它自己的 rest 降 6.0L。
   * 我们的 rest 因上面的对比度取舍停在 48.5，直接照抄 47 只剩 1.5L 落差、悬停几乎读不出来
   * （且 47 的对比度 4.85:1 虽然过线，但把 rest→hover 的「按实」信号压没了），
   * 所以明度保持 44（落差 4.5L，对比度 5.43:1）。
   * 彩度：**方向此前是反的**。参照接合时降彩度（52.26 → 50.26），我们原来升到 53.85。
   * 本轮只改这一项，取参照实测的 50.26：rgb(83,98,191) → rgb(86,98,185)，
   * 对比度 5.40 → 5.43，不动明度轴所以对比度余量不受影响。
   * 按下与 hover 同值是实测（参照没有独立按下态），沿用。
   */
  --primary-hover: lch(44% 50.26 286.91);
  --primary-pressed: var(--primary-hover);
  --primary-foreground: lch(100% 5 286.91);
  /*
   * 危险色与表单无效色**分家**：参照把这两支分开调（洗底色相 19.355 与文字 29 已经不同源，
   * --destructive-wash 因此独立成颗），绑成一颗就只能一起动，谁也到不了自己的解。
   *
   * --destructive 只负责危险动作前景：危险按钮与危险菜单项的文字和图标。
   * 参照实测 lch(50% 80 29)，色相已同，差在明度 +4.5、彩度 +26。
   * 实测彩度几乎不占对比度预算——同明度下 C 54→80，工作面上 5.122:1 → 5.180:1，
   * 明度才是唯一杠杆。所以取满参照的彩度与色相、明度停在 45.5：
   * rgb(182,68,67) → rgb(211,9,49)，工作面 5.18、白面 5.45、--background 4.74，全部过 4.5。
   * 剩下的 4.5 明度是 AA 底线换来的：参照值在工作面只有 4.375:1、在 --background 4.006:1，
   * 而两个成员现在都用 text-destructive 承载错误正文，跟到 50 会把那些正文一起压到 4.5 以下。
   * 明度继续往参照走的前置条件是成员把错误正文改挂 --invalid，不是改这颗的值。
   */
  /* 2026-09-21 按 AA 反推加深：原 L45.5 在行态底色上过不了 4.5——实测「下架倒计时」这类
     destructive 文字在**当前行**底上只有 4.33（旧的 current 档更深，那时是 4.04，一直没被量到），
     告警档上 4.09。与 §5 那两颗（浅色方向色、两端限定词色）同一条办法：合同说
     「够不到就压低这一档，不是压低文字」，但这一档再压就会把 hover(4) 与当前(6) 挤平——
     所以改这一颗文字色。L42：当前行 4.82 / 告警档 4.55 / 工作面 5.57，三档都过且有余量。
     加深只改善其它每一档，不引入新的偏低处。 */
  --destructive: lch(42% 80 29);
  /*
   * 危险按钮 hover / active 的洗底。**推不出来，必须独立成一颗**：
   * 实测色相 19.355 与文字色的 29 是分开调的两支红，用 color-mix(--destructive …) 凑不出。
   */
  --destructive-wash: lch(93.966% 7.33 19.355);
  /*
   * 确认面**执行键**的实心红（08 §6.2「红只出现在最终确认键上」、§9.4 完整确认）。与 --destructive 分家：
   * 那颗是入口的红字前景，在白面上要够暗才过 4.5；这颗是承载白字的底，判据反过来——白字压它 ≥ 4.5:1。
   * 取值（sRGB 解算、白字 #fff）：静止 lch(44% 74 29) = #c81b32 → 5.74:1；悬停按 Light 主按钮的方向压暗一档
   * lch(40% 72 29) = #b90c2b → 6.65:1。都在 sRGB 色域内（--destructive 那颗 C80 越界、靠截断），
   * 所以不借它：截断值在广色域屏上画成另一种红。按下与悬停同值（08 §6.1 按下不新增材质档）。
   */
  --destructive-solid: lch(44% 74 29);
  --destructive-solid-hover: lch(40% 72 29);
  --destructive-solid-foreground: #fff;
  /*
   * --invalid 只负责表单校验：错误正文、必填星号、无效态焦点环与 --border-invalid 同族。
   * 参照站没有可对照的校验色实测，所以它没有要追的目标值，唯一硬约束是正文 4.5:1——
   * 本值在最暗的 --background 上 4.690:1、工作面 5.122:1。分家前它被 --destructive
   * 拖着走，现在起独立：没有新证据就不要动它，也不要让它跟着危险色升彩度。
   */
  --invalid: lch(45.5% 54 29);

  --status-info: #2563b9;
  --status-healthy: #086646;
  --status-warning: #7a5000;
  --status-error: #ae1f29;
  --status-idle: #686870;
  --status-stale: #6b6252;
  --status-offline: #686870;
  --status-unknown: #686870;
  /* 运行状态 soft 淡底的混合比例（info 另取 8%）；派生式在下方 `:root, .dark` 块只写一次。 */
  --status-soft-alpha: 12%;
  /* 稳定类别身份色板（2026-09-23 从 ZML Trade 成员层收上来，值逐位不变）：独立于品牌、图表序列、
     金融方向与运行状态；浅色值文字安全，也驱动小身份标记，页面不自造私有色板。 */
  --entity-identity-graphite: oklch(0.43 0.018 270);
  --entity-identity-blue: oklch(0.5 0.11 250);
  --entity-identity-indigo: oklch(0.48 0.12 275);
  --entity-identity-violet: oklch(0.5 0.11 310);
  --entity-identity-magenta: oklch(0.5 0.11 340);
  --entity-identity-amber: oklch(0.5 0.085 78);
  --entity-identity-cyan: oklch(0.5 0.075 215);
  --entity-identity-teal: oklch(0.48 0.075 165);

  /* 庆祝色板独立于语义色轴：只喂彩纸渲染，任何业务状态、图表或数据色都不得引用。 */
  --celebrate-1: #5e6ad2;
  --celebrate-2: #8b95e6;
  --celebrate-3: #12a594;
  --celebrate-4: #e8a317;
  --celebrate-5: #ef6449;
  --celebrate-6: #d9407a;
  --celebrate-7: #3da35d;
  --celebrate-8: #3b82f6;
  /* 浅色两颗按 AA 反推加深（2026-09-20）：告警行底色固定在 12% 之后，原先的 0.459 在斑马 + 告警
     底上只有 4.259，破 AA；0.43 回到 4.76。白底与斑马底同时变好（6.19→6.92 / 5.17→5.78），
     没有任何一档因此变差。加深方向色是合同给同类问题定的那条路——先腾余量，不是去补第二颗色。 */
  --financial-positive: oklch(0.43 0.1274 163.23);
  --financial-negative: oklch(0.47 0.1648 27.45);
  --financial-neutral: #52525b;
  --risk: oklch(0.491 0.154 58.3);
  --chart-1: lch(53% 52.26 287);
  --chart-2: #348542;
  --chart-3: #cf3e46;
  --chart-4: #9f6800;
  --chart-5: #8e4ec6;
  /* 净利构成色（价差利润 / 交易手续费 / 手续费返佣 / 资金费 / 链上网络费）：只区分科目，不表示好坏——盈亏红绿只给
     有结论的量（净利、变化）。两个主题各一套，已按色觉校验；返佣 = 交易手续费与白 52% 混。执行：统计构成图、账本桥图。 */
  --chart-composition-gross: #2a78d6;
  --chart-composition-fee: #eb6834;
  --chart-composition-funding: #1baf7a;
  --chart-axis-border: color-mix(in srgb, var(--muted-foreground) 20%, transparent);
  --chart-grid-line: color-mix(in srgb, var(--muted-foreground) 14%, transparent);
  --chart-crosshair-line: color-mix(in srgb, var(--foreground) 28%, transparent);
  --chart-zero-line: color-mix(in srgb, var(--foreground) 50%, transparent);

  --focus-ring-width: 1px;
  --focus-ring-color: var(--border-focus);
  /*
   * 全局 :focus-visible 的默认偏移。0 是实测：参照站 secondary / quiet / danger 三族
   * 与 Select 触发器都用真实键盘取焦读到 outline-offset: 0px，2px 只属于 primary
   * （底色与焦点色同源，必须让开），药丸/chip 那一族反而是 -1px 内嵌。
   * 旧值 1px 无出处，且它让每一个未覆盖的控件都比参照多撑出一圈。
   * 覆盖档不受影响：primary / 勾选族读 --focus-offset-standalone(2px)，
   * 冻结面靠 --focus-offset-inset 钉回 0。
   */
  /*
   * 身份色底的两级占比。实体色 chip 的静止是身份色 @17.5%，被指到 / 按下 / 浮层开着时到 24%
   * （参照实现只有这两档，没有第三档）。此前 24% 在同一个文件里写了三遍、17.5% 写了一遍，
   * 改一档要改四处；占比是刻度不是局部选择，所以收在这里。两个值与收拢前逐位相同。
   */
  --identity-tint-rest: 17.5%;
  --identity-tint-active: 24%;
  --focus-offset-default: 0px;
  --focus-offset-standalone: 2px;
  --focus-offset-inset: 0;
  --focus-offset-clipped: -1px;
}

.dark {
  --background: lch(2.595% 0.4 272);
  --work-surface: lch(5.52% 0.4 272);
  --sub-surface: lch(7.32% 0.85 272);
  /* 中性色随 elevation 抬 chroma，抵消底色变亮后的偏黄感；1.1 是漏抄的。 */
  --card: lch(8.22% 1.3 272);
  --elevated: lch(10.8% 1.05 272);
  --popover: lch(12.72% 0.85 272);
  --select-compact-list-surface: lch(5.52% 0.4 272);
  --select-compact-list-border: lch(16.32% 1.48 272);
  --select-compact-list-hover: lch(14.777% 1.075 272);
  --menu: lch(12.72% 0.85 272);
  --overlay-surface: lch(12.72% 0.85 272);
  /* 模态面自成一档，比菜单浮层更暗；sheet / drawer / 设置窗仍走 --overlay-surface。 */
  --modal-surface: lch(9.232% 0.85 272);
  --modal-scrim: rgba(0, 0, 0, 0.4);

  --foreground: lch(100% 0 272);
  --secondary-foreground: lch(90.451% 1.2 272);
  /* 工作面档的次级文字（视图标签未选态、行元数据、属性表头、空态描述）。
     浮层与模态内更亮，见 --menu-muted / --overlay-muted-in-modal。 */
  /* 暗色限定词抬到 L 64（2026-09-20 实测）：61.8 / 60.6 在行态最高一档（当前 / 展开，L19.3）上只有
     4.49 / 4.31:1，低于 AA 4.5——斑马按 Carbon 档重标之后这一档才露出来。抬 2 级后底 6.7、斑马 5.3、
     悬停 5.0、当前 4.8，全部过 AA；它只会让所有暗色面上的对比变好，与 L100 前景的分离从 38 收到 36，
     肉眼不可辨。参照：Carbon g100 的 text-secondary 是 L79.5，ZML 这一档本来就偏低。 */
  /* 2026-09-20 二次抬亮（56 → 64 → 66）：64 时「当前」档上的限定词实测 4.405，仍差一口气。
     每次抬都由实测反推，不按观感调；抬亮只改善其它每一档，没有哪一档因此变差。 */
  --muted-foreground: lch(66% 1.2 272);
  --disabled-foreground: lch(36.975% 1.2 272);
  --inverse-foreground: lch(5.52% 0.4 272);

  --border-subtle: lch(9.84% 1.48 272);
  --border: lch(14.16% 1.48 272);
  /*
   * **Dark 值来自我们自己的阶梯，非参照实测**（本轮参照只量了 Light 1280；Dark 全档未测）。
   * 推法与 Light 同构：Dark 这条阶梯 9.84 → 14.16 是 +4.32，再走一步得 18.48，
   * 与 Light 一样落在 --border(14.16) 与 --border-strong(28.032) 之间。
   * Dark 侧一旦实测，以实测覆盖本值，不要按「Light 对上了所以 Dark 也对」保留。
   */
  --border-segmented: lch(18.48% 1.48 272);
  --border-strong: lch(28.032% 1.48 272);
  --border-focus: #8b95e6;
  /* 选中边（collection 卡、日历格）与焦点环是两件事：一个说「这一项被选中了」、另一个说
     「键盘现在在这里」，同一件东西上会同时出现。此前两者共用 --border-focus，于是任一方要调色
     都会把另一方一起带走。取值与拆分前逐位相同，拆的是职责不是颜色。 */
  --border-selected: #8b95e6;
  /* 正文链接色。此前借 --border-focus，注释里已记下深色的实测目标值却无处安放。 */
  --link-foreground: lch(80% 80 288.43);
  --border-invalid: lch(71.06% 38 22.22);
  /* 输入框静止边实测 30.833；原来的 20.03 在暗色下几乎看不见。 */
  --input: lch(30.833% 1.93 272);
  /* 浮层外框实测 25.68（同一值在菜单、listbox、tooltip、属性选择器上重复量到）。 */
  --overlay-border: lch(25.68% 1.93 272);
  /* 面内分隔线：亮于面底 12.72、暗于外框 25.68。原来共用 --border-subtle(9.84) 比面底还暗，方向反了。 */
  --overlay-divider: lch(20.28% 1.93 272);
  --modal-border: lch(22.193% 1.93 272);
  /* 父面是模态面时（浮层开在 Dialog / AlertDialog 之上），浮层的面、边、分隔线、文字整体上抬一档
     （Dark 参照取值）。这与浮层里再开浮层（08 §6.1：同底同边同圆角、只把投影升到 --shadow-dialog）
     是两件事，不要叫 L2。当前零消费者是有意的，启用条件见 primitives/README 浮层族。 */
  --overlay-surface-in-modal: lch(16.433% 1.3 272);
  --overlay-border-in-modal: lch(29.393% 2.38 272);
  --overlay-divider-in-modal: lch(20.753% 2.38 272);
  --overlay-foreground-in-modal: lch(91.554% 1.65 272);
  --overlay-muted-in-modal: lch(66.215% 1.65 272);
  --overlay-foreground: lch(91.178% 1.425 272);
  --menu-muted: lch(64.714% 1.425 272);
  --menu-item-hover: lch(20.82% 1.3 272);

  --control-idle: lch(8.22% 1.1 272);
  --control-hover: lch(12.2% 1.1 272);
  /* 没有「按下档」：判据与理由见 Light 侧同一位置的说明。曾有的 --control-pressed(14.4)
     在 Dark 下甚至**比 hover 还亮**，按下读起来像是又开了一档，与参照的单值相反。 */
  --control-current: lch(13.845% 1.3 272);
  --control-selected: lch(13.845% 1.429 272);
  --control-checked: lch(47.918% 59.303 288.421);
  /* 第五鼓：菜单展开与 toggle-on。rest 10.149 → hover 14.777 → open 18.634 单调递增，
     原来展开态借用 --control-pressed(14.4) 比 hover 还低，展开等于没反应。 */
  --control-open: lch(18.634% 1.075 272);
  --tab-current: lch(16.706% 0.979 272);
  /* 标签轨与 quiet 图标钮同一档（chroma 0.593），与工具 chip（chroma 0.689/1.075）分开。 */
  --tab-idle: lch(10.149% 0.593 272);
  --tab-hover: lch(14.006% 0.593 272);

  /* 侧栏档：侧栏底 2.595 比工作面 5.52 更暗，所以自带一条独立阶梯 8.445 / 10.149 / 13.845 / 14.777。 */
  --rail-item-hover: lch(8.445% 1.3 272);
  --rail-item-current: var(--control-current);
  --rail-control-idle: lch(10.149% 0.689 272);
  /*
   * 取 Light 那一档的**结构对偶**：6% 白 overlay。Light 侧自己已经写明「别名 idle 等于没有反馈」，
   * 而这里恰好就别名着 idle——于是深色下把指针放到安静轨工具上，底色与一枚已钉住的钮逐位相同，
   * 既读不出「我指到了」，也读不出「这枚是开着的」。两种错里，抄错一个明度远好过没有反馈。
   * 对偶的是**做法**（同一层 6% 中性 overlay）不是数值，明暗各取各的中性端。
   * 仍未对 Linear Dark 实测：补测之后以实测覆盖本值，不要因为「看起来对了」就把它当已校准。
   */
  --rail-control-quiet-hover: lch(100 0 0 / 0.06);
  --rail-control-hover: lch(14.777% 1.075 272);

  /* 行填充档：选中带靛蓝色相（hue 286.445），不是零彩度灰，且有 selected+hover 第三档。 */
  /* 同上；暗色 2.5% → ΔL* 2.80、3.5% → 3.81，约 1.01/%。 */
  --row-step-hover: 3.7%;
  --row-step-current: 5.7%;
  --row-step-selected: 14%;
  /* 选中 + 悬停的上限由 AA 定：21% 落到暗色斑马行（8% 斑马 + 14% 选中之上）时，12px 负向数字只剩 4.41:1
     （2026-09-22 Trade 实测），压到 17%（实测 4.6 档）；这一档只是选中之上的悬停反馈，不在 §9.2 的主梯上。 */
  --row-step-selected-hover: 17%;
  --row-fill-hover: color-mix(in srgb, var(--foreground) var(--row-step-hover), var(--work-surface));
  --row-fill-current: color-mix(in srgb, var(--foreground) var(--row-step-current), var(--work-surface));
  --row-fill-selected: lch(12.141% 17.792 286.445);
  --row-fill-selected-hover: lch(15.966% 18.242 286.445);
  --segmented-track: var(--tab-current);
  /* 滑块 = Linear generateTheme elevated 同键（ZML --elevated 10.8 是面板，不是这颗）。 */
  --segmented-current: lch(20.418% 1.429 272);
  /* Display List/Board 选中：Dark 1440/1024/390 实机 lch(23.906 1.429 272)，不是 tab-current。 */
  --segmented-option-current: lch(23.906% 1.429 272);
  /* Display properties 开 chip：Dark 实机 lch(25.834 1.525 272)。 */
  --chip-current: lch(25.834% 1.525 272);
  /* Display 未选 pill / 关 chip：Dark 实机 lch(17.349 1.043 272)，不是 --card。 */
  --option-well: lch(17.349% 1.043 272);
  --option-well-hover: lch(21.206% 1.043 272);
  /* 与 Light 同理：Select 触发器 hover 与 chip/segmented 的 hover 不是一颗。 */
  --select-well-hover: lch(21.977% 1.525 272);
  --select-open-border: lch(27.84% 1.93 272);
  --option-well-hover-foreground: var(--overlay-foreground);
  /* off 轨实测（原来是估值）。三次取样落在 47.551 / 48.247 / 48.296，取中间那次。 */
  --switch-track-off: lch(48.247% 0.93 272);
  /*
   * 关轨 hover。**此前方向是反的**：借来的 --field-border-pressed 在 Dark 解到
   * lch(28.032% 6.93 272)，于是悬停一个关闭的开关会让轨暗掉 20L 并跳出 6.93 彩度，
   * 而参照是亮 8.56L。取弹层面那一档，因为 --switch-track-off 的 48.247 正是同一表面的读数
   * （基础面那一对是 47.551 → 56.238）。
   */
  --switch-track-off-hover: lch(56.807% 1.019 272);
  /* 与 Dark 现有 --primary-hover 逐位相同：本档无视觉变化，只是把角色从「按钮主色 hover」
     换成「勾选族 hover 强调」，让 Light 那边真正的校正有一颗独立的 owner 可落。

     **2026-09-21 两轮对抗性审计，这颗改过一次又改回来，两次都有理由，记全：**

     第一轮指出它被漏掉了：共享 Switch 用它做**开轨的填充**，轨上滑块取 --primary-foreground，
     实测（暗色）滑块对轨 rest **4.671** → hover **4.005**，与主按钮当初 4.671 → 3.98 同型。
     于是照主按钮那条判据改成了 lch(47.918% 70 288.421)，实测 hover 回到 4.620。

     第二轮指出那次改动**只验了 4 个消费者里的 1 个**。另外三个是**边框**不是填充：
     checkbox-variants（未选中 hover 边 / 选中 hover 边）、radio-group（同）、slider（把手三态边）。
     填充要与滑块的近白墨对比，边框要与背衬面对比 —— **两者的优化方向相反**。
     实测未选中复选框边对浮层背衬：rest 5.467 → hover 旧值 4.970 → hover 新值 **4.282**，
     新值让边框更看不见，正是同一条 §13 判据要防的（两者都 ≥3:1，所以不是不合格，是方向错）。

     所以拆：**这颗回到边框那一档的校准值**，开轨的填充另立 --switch-track-on-hover（见下）。
     一颗 token 干两种活、两种活的最优方向相反时，拆开是唯一出路。

     留一条未结：未选中复选框边 rest 5.467 → hover 4.970，**在本轮改动之前就已经是 hover 比 rest 更不可见**。
     它的语义是「悬停显示强调色，预示按下会选中」，与「hover 要更醒目」有真实张力；
     没有干净的重定值依据，不盲改，记在这里。 */
  --control-checked-hover: lch(52.418% 61.103 288.421);
  /* 开轨填充的 hover。与 --switch-track-off-hover 同一条理由（那颗的注释写着「方向随主题翻转，
     所以必须是自己的 token」）：开轨是填充、要与近白滑块对比，关轨与边框都不是。
     暗色实测：明度不动、彩度 59.303 → 70，滑块对轨 4.671 → **4.620**（与 rest 齐平），
     对 rest 的 ΔE76 **10.84**，hover 仍明显可分。 */
  --switch-track-on-hover: lch(47.918% 70 288.421);
  --field: lch(9.232% 0.85 272);
  --field-border: lch(30.833% 1.93 272);
  /* hover 是「变暗变蓝」不是变亮：明度回落、彩度从 1.93 跃到 6.93，那次跃升是这个交互唯一的信号。
     按下与 hover 实测同值，不做第三档压深。 */
  --field-border-hover: lch(28.032% 6.93 272);
  --field-border-pressed: var(--field-border-hover);

  --primary: lch(47.918% 59.303 288.421);
  /* 主按钮 hover 是「变亮变彩」，按下与 hover 同值——原来两档都往暗走且多做了一档，方向错了。
   *
   * **2026-09-21：方向对，幅度错。** 上一版取 lch(52.418% 61.103) 把明度也抬了 4.5L，
   * 而墨色两个主题都是近白（--primary-foreground L* 100）——在暗底上「提亮填充」必然压低字的对比。
   * 实测：rest AA **4.67** → hover AA **3.98**，**低于 AA 4.5**。悬停让主按钮的字变得更难读，
   * 这是它最被盯着的那一刻。浅色那一侧从一开始就按对比度选值（见上面 --primary-hover 的注释：
   * 「明度保持 44…对比度 5.43:1」），只有暗色这一侧没算。
   *
   * 改法保留「不往暗走」这条判断，只把信号从明度轴换到彩度轴 —— 与本文件 --field-border-hover
   * 同一个办法（「明度回落、彩度跃升，那次跃升是这个交互唯一的信号」）。**明度一点不动**，
   * 彩度 59.303 → 70。实测：AA **4.62**（与 rest 的 4.67 齐平，hover 不再比 rest 难读），
   * 对 rest 的 ΔE 从 4.89 升到 **10.84** —— 比原来更显眼，不是为了合规把信号削掉。
   * 对页底的 ΔL* 46.5（原 50.7、rest 46.2），按钮没有因此退到背景里。
   *
   * 判据留给以后：**填充态控件的 hover 不得让它自己的标签比 rest 更难读。** 这条与「hover 往哪边走」
   * 无关——往哪边走看主题气质，能不能走到那一步看墨色还剩多少余量。 */
  --primary-hover: lch(47.918% 70 288.421);
  --primary-pressed: var(--primary-hover);
  --primary-foreground: lch(100% 5 288.421);
  /*
   * 参照 Dark 危险文字的授权坐标 lch(80% 80 29) **超出 sRGB 色域**（线性 R 解到 1.7175），
   * 那 80 彩度在屏幕上是虚的，而且虚得不一致：同一串坐标 Chrome 在 sRGB 画布上截成
   * rgb(255,134,131)，在 display-p3 画布上却画成 P3 rgb(255,146,138) —— 两种屏两个颜色。
   * 参照站自己存的是 sRGB 十六进制 #ff8583（= rgb(255,133,131)，与上面的截断值一致），
   * 所以**存十六进制才能在任何屏上复现参照**；存那串 lch 只会在广色域屏上过饱和。
   * 换成真实显示值重新量偏差：#ff8583 反解回 lch 是 (69.782, 52.640, 26.459)，
   * 相对我们原来的 lch(71.06% 38 22.22)，明度只差 −1.28（本来就基本对上），
   * 真正的差是彩度 +14.5 与色相 +4.5（参照更暖，不是更粉）——三个轴都远小于
   * 按那串虚拟坐标算出的「ΔL −8.94 / ΔC −42 / Δh −6.78」，那一版是在跟一个画不出来的颜色比。
   * 对比度工作面 8.333 → 7.966、最暗面 8.859 → 8.468，余量充足。
   */
  --destructive: #ff8583;
  /* 同 Light：色相 19.784 与文字的 29 不同源。 */
  --destructive-wash: lch(14.272% 13.438 19.784);
  /*
   * 执行键实心红（Dark）。**不能用上面的 #ff8583**：那是深底上的红字前景，白字压它只有 2.35:1。
   * 另取一支能承载白字的红：静止 lch(46% 70 29) = #ca2d39 → 5.32:1；悬停按 Dark 主按钮的方向提亮一档
   * lch(50% 66 29) = #d24145 → 4.60:1，两档都过 4.5，且在模态面底（Dark 9.2L）上轮廓清楚。
   */
  --destructive-solid: lch(46% 70 29);
  --destructive-solid-hover: lch(50% 66 29);
  --destructive-solid-foreground: #fff;
  /* 同 Light：表单校验自有一颗，参照无对照值，不跟 --destructive 走。
     Dark 余量充足（最暗面 8.859:1），本轮不动。 */
  --invalid: lch(71.06% 38 22.22);
  --status-info: #60a5fa;
  --status-healthy: #34d399;
  --status-warning: #fbbf24;
  --status-error: #f87171;
  --status-idle: #a1a1aa;
  --status-stale: #c4b99f;
  --status-offline: #a1a1aa;
  --status-unknown: #a1a1aa;
  --status-soft-alpha: 15%;
  /* 暗色身份色只抬明度，不借更亮的图表序列或品牌主色；cyan 与 teal 仍是两个可分的扫读目标。 */
  --entity-identity-graphite: oklch(0.7 0.018 270);
  --entity-identity-blue: oklch(0.72 0.105 250);
  --entity-identity-indigo: oklch(0.7 0.11 275);
  --entity-identity-violet: oklch(0.72 0.1 310);
  --entity-identity-magenta: oklch(0.72 0.1 340);
  --entity-identity-amber: oklch(0.76 0.1 78);
  --entity-identity-cyan: oklch(0.74 0.085 215);
  --entity-identity-teal: oklch(0.71 0.09 165);

  --celebrate-1: #8b95e6;
  --celebrate-2: #b4bbf7;
  --celebrate-3: #3fc1c9;
  --celebrate-4: #f6c445;
  --celebrate-5: #f2764b;
  --celebrate-6: #f0619a;
  --celebrate-7: #5bd9a4;
  --celebrate-8: #ffffff;
  --financial-positive: oklch(0.7729 0.1535 163.22);
  --financial-negative: oklch(0.7106 0.1661 22.22);
  --financial-neutral: #d4d4d8;
  --risk: oklch(0.7576 0.159 55.93);
  --chart-1: lch(58% 55 288);
  --chart-2: #46a758;
  /* 色差一律按 CIEDE2000（ΔE00）计。类别色与金融色两个主题下都要 ΔE00 ≥ 12（08 §9.3）。
     2026-09-21 把原 #ee686d（对暗色 --financial-negative 只有 3.92）改成同色相降明度的 #ea484e，
     但那次按 CIE76 算——按 ΔE00 它对亏损红只有 **9.01**，仍不隔离。同色相（oklch h≈23，与亏损红
     h≈22 几乎重合）下拉到 ΔE00 ≥ 12 必须把明度压到对卡片面 AA 4.5 以下（它也当文字色用），
     所以 2026-09-24 改为向玫红偏 17° 的 oklch(0.66 0.21 6)：对亏损红 ΔE00 **12.58**、对卡片面
     AA **5.13**（原 4.68）、对其 10% 淡底 AA 4.62（原 4.25），对其余系列、盈色与风险色 ΔE00 ≥ 25。
     浅色 #cf3e46 对浅色亏损红 ΔE00 12.13，达标不动；两主题同色相各调明度的约定在这一颗上让位于隔离。 */
  --chart-3: #f4487e;
  --chart-4: #f1a10d;
  --chart-5: #bf7af0;
  --chart-composition-gross: #3987e5;
  --chart-composition-fee: #d95926;
  --chart-composition-funding: #199e70;
  --chart-axis-border: color-mix(in srgb, var(--muted-foreground) 24%, transparent);
  --chart-grid-line: color-mix(in srgb, var(--muted-foreground) 16%, transparent);
  --chart-crosshair-line: color-mix(in srgb, var(--foreground) 42%, transparent);
  --chart-zero-line: color-mix(in srgb, var(--foreground) 40%, transparent);
  /*
   * 焦点环走专用环色，两个主题同一条接法（08 §13：焦点环不是品牌 primary 紫）。
   * 这里曾经钉成 var(--primary)：深色下「已选中且聚焦」的勾选框、开关、单选就是紫底外面再套一圈
   * 同色紫环，只剩 2px offset 那道缝能分开两者；而同一份 token 里冻结数据面早就把环钉成 #8b95e6，
   * 自证深色环的起点本来就是专用色。浅色 #6d78d5 与深色 #8b95e6 是两套主题各自的实测值。
   */
  --focus-ring-color: var(--border-focus);
  /* Dark 滚动条拇指是不透明色而非 alpha 混合（混合会让拇指明度随底色漂）。
     实测三态几乎同值，hover 微提、按下微压。 */
  --scrollbar-thumb: lch(37.275% 1.2 272);
  --scrollbar-thumb-hover: lch(37.375% 1.2 272);
  --scrollbar-thumb-active: lch(36.975% 1.2 272);
  --shadow-main-surface: 0 0.5px 1px 1px rgba(0, 0, 0, 0.3);
  /* Dark 的立体环是白 alpha 递增，不是不透明深色；随 hover 加深是这一族唯一的悬停反馈。 */
  --shell-surface-border: lch(13.08% 1.48 272);
  --checkbox-border: lch(55.92% 1.93 272);
  /* Dark 此前已校准，表外档沿用同值；两档都有这颗只是为了让消费链在两个主题下形态一致。
     留意参照 Dark 这颗随表面取两个值（列表行面 48.72、弹层菜单面 55.92），我们的工作面更接近后者。 */
  --checkbox-border-standalone: lch(55.92% 1.93 272);
  /* 实测 chip/分段/Select 族 Dark 是 0.148 → 0.247，我们此前供 0.143 → 0.238，
     两档都偏轻（合成到 8bit 各差约 2/255）。这一族与药丸+工具钮那族是**两次表面标定**，
     不是重复机制，别合成一颗。 */
  --shadow-hairline: 0 0 0 0.5px lch(100% 0 272 / 0.148);
  --shadow-hairline-hover: 0 0 0 0.5px lch(100% 0 272 / 0.247);
  /*
   * 解开对 --control-* 的别名，chip 自成一族，不跟着菜单行/表格行漂。
   * 旧注「Dark 三态不带任何环与投影，所以没有 --chip-ring：Dark 无消费者」与事实相反，
   * 已删：那个结论来自只读宿主 button 的 computed box-shadow，而环与投影全画在伪元素上、
   * 宿主本来就恒为 none（同一处误读在下面 --shadow-raised 那段也记过一次）。
   * Dark 工具钮实测确有环：rest 0.137 → hover/展开 0.229，白 alpha，配一层黑投影。
   */
  --chip-surface: lch(10.149% 0.689 272);
  --chip-surface-hover: lch(14.777% 1.075 272);
  --chip-surface-pressed: var(--control-open);
  /*
   * Dark 工具钮的抬起环。**此前判据是错的**：当时读的是宿主 button 的 computed
   * box-shadow，而参照站把环与投影画在 ::after 上、宿主本来就恒为 none。
   * 后果是 Dark 下工具钮三态只有底色递亮，展开那一鼓「收投影」没有东西可收——
   * 这就是 Dark 侧「没有按下去的感觉」的直接原因。
   * rest → hover 只抬环（0.137 → 0.229，+67%），投影层一字不动；
   * open 把环保持在 hover 值并移除投影；有过渡的消费者由 CSS 自动补齐零阴影。
   */
  --chip-ring: lch(100% 0 272 / 0.137);
  --chip-ring-strong: lch(100% 0 272 / 0.229);
  /* 组合式在本主题块内重声明一次——理由见 :root 那一段：var() 替换在声明处发生，
     只写在 :root 会让嵌套 .dark 作用域拿到已替换好的 Light 环。 */
  --shadow-raised: 0 0 0 0.5px var(--chip-ring), var(--shadow-main-surface);
  --shadow-raised-hover: 0 0 0 0.5px var(--chip-ring-strong), var(--shadow-main-surface);
  --shadow-raised-pressed: 0 0 0 0.5px var(--chip-ring-strong);
  --settings-section-border: var(--overlay-divider);
  --shadow-floating:
    0 3px 8px rgba(0, 0, 0, 0.125),
    0 2px 5px rgba(0, 0, 0, 0.125),
    0 1px 1px rgba(0, 0, 0, 0.125);
  --shadow-dialog:
    0 4px 40px rgba(0, 0, 0, 0.1),
    0 3px 20px rgba(0, 0, 0, 0.125),
    0 3px 12px rgba(0, 0, 0, 0.125),
    0 2px 8px rgba(0, 0, 0, 0.125),
    0 1px 1px rgba(0, 0, 0, 0.125);
}

/*
 * **纯别名 / 纯合成式的语义色必须在每一个主题作用域里各声明一次，不能只写在 :root。**
 * 依据与 --shadow-raised 那三颗同一条（见 :root 那一段，已实机验过）：自定义属性的 var()
 * 替换发生在**声明它的那个元素**上，替换完的结果才向下继承。只写在 :root 时，`.dark` 一旦
 * 不在 html 上（主题作用域是嵌套容器：局部反色岛、主题化浮层、预览面），容器里新的
 * --muted-foreground / --work-surface / --status-error 已经改不动上游替换好的结果，
 * Dark 表面会拿到整串 Light 值。
 *
 * 写成 `:root, .dark` 而不是在 .dark 块里再抄一遍字面量：抄一遍等于同一个值有两处副本，
 * 改一处必漏另一处；一个选择器列表让**同一条声明**同时落在两个主题元素上，值只有一份，
 * 而替换仍然在各自的元素上发生。`.dark` 在 html 上时两个选择器命中同一元素，同值幂等。
 *
 * 判据（哪些该搬进来）：值里含 var()，且被引用的那颗在 .dark 里有对偶。含字面颜色的、
 * 或引用的全是主题无关量的，留在 :root，不要整族搬过来。
 *
 * 这一组此前全部只在 :root：图表 9 颗（轴文字、十字线标签底、参考线、面底、刷选遮罩与窗、
 * 三个序列角色）、告警轴 1 颗、时间线标记 1 颗、焦点环外框 1 颗——嵌套 .dark 下都会画成 Light。
 * 焦点环那颗尤其要紧：全站 `:focus-visible` 都读它。
 */
:root,
.dark {
  /* 运行状态与金融方向的 soft 淡底：唯一 owner（2026-09-23 收口）。此前两端各算一份——ZML Trade 在
     oklab、ZML 平台在 srgb，名字也不同（一端 --status-*-soft，一端 --color-status-*-soft）。
     向透明混合时两种插值空间给出同一颗颜色（透明不贡献分量，结果就是原色 × 占比），所以收成一份
     不改任何像素；比例随主题走（--status-soft-alpha），info 与方向轴各自固定一档。 */
  --status-info-soft: color-mix(in oklab, var(--status-info) 8%, transparent);
  --status-healthy-soft: color-mix(in oklab, var(--status-healthy) var(--status-soft-alpha), transparent);
  --status-warning-soft: color-mix(in oklab, var(--status-warning) var(--status-soft-alpha), transparent);
  --status-error-soft: color-mix(in oklab, var(--status-error) var(--status-soft-alpha), transparent);
  --status-idle-soft: color-mix(in oklab, var(--status-idle) var(--status-soft-alpha), transparent);
  --status-stale-soft: color-mix(in oklab, var(--status-stale) var(--status-soft-alpha), transparent);
  --status-offline-soft: color-mix(in oklab, var(--status-offline) var(--status-soft-alpha), transparent);
  --status-unknown-soft: color-mix(in oklab, var(--status-unknown) var(--status-soft-alpha), transparent);
  --financial-positive-soft: color-mix(in oklab, var(--financial-positive) 14%, transparent);
  --financial-negative-soft: color-mix(in oklab, var(--financial-negative) 14%, transparent);
  --risk-soft: color-mix(in oklab, var(--risk) 14%, transparent);

  /* 图面是不透明单元：底色跟宿主面（08 §10）。这里只给页面档；窗 / 抽屉里的图由 chart-shell
     在元素上读 --zml-table-surface——自定义属性在声明处就已代换，token 里写 fallback 不会随宿主变，
     这正是本块存在的同一条理由。遮罩由面底自己混出来，刷选窗体跟品牌主色。 */
  --chart-surface: var(--work-surface);
  --chart-brush-mask: color-mix(in srgb, var(--chart-surface) 70%, transparent);
  --chart-brush-window: color-mix(in srgb, var(--primary) 12%, transparent);
  --chart-axis-text: var(--muted-foreground);
  --chart-crosshair-label-background: var(--background);
  --chart-series-reference: var(--muted-foreground);
  /* 序列角色层只定义一次，两个主题各自的取值由它指向的调色位承担。
     返佣自成一个角色：此前它与资金费共用一颗 token，同一张图里两条语义不同的线是一个颜色，
     读者只能靠位置猜哪条是哪条，而图例本来就是为了不用猜。 */
  --chart-series-open: var(--chart-4);
  --chart-series-funding: var(--chart-2);
  --chart-series-rebate: var(--chart-5);
  /* 构成色的派生两颗：手续费返佣是交易手续费与白 52% 混（同一笔手续费的回流，同色相）；链上网络费是另一种成本，
     取交易手续费向前景色退三成（与返佣、交易手续费都可分），同样只区分科目。 */
  --chart-composition-rebate: color-mix(in srgb, var(--chart-composition-fee) 48%, #ffffff);
  --chart-composition-network: color-mix(in srgb, var(--chart-composition-fee) 70%, var(--foreground));
  /* 告警行态的唯一颜色 owner（边轨与底色层都从这里取）：今天等于 --status-error，换轴只改这一颗。 */
  --data-alert-color: var(--status-error);
  /* 焦点环外框：宽度是主题无关量，环色两个主题各有实测值，所以合成式本身必须按主题各解一次。 */
  --focus-ring-outline: var(--focus-ring-width) solid var(--focus-ring-color);
}

/*
 * 必须待在 `@layer base` 里。无 layer 的作者样式**整体**压过 `@layer utilities` 中的工具类
 * （与特异度无关，是层叠层的规则），裸写这条会让全站所有 `focus-visible:outline-offset-*`
 * 工具类静默失效——组件明明声明了内描边偏移，实际却永远是默认值。
 * 两端都是先 `@import "tailwindcss"` 再导入本文件，层序已建立，这里入层即可正确让位。
 */
@layer base {
  :focus-visible {
    outline: var(--focus-ring-outline);
    outline-offset: var(--focus-offset-default);
  }
}

/*
 * 滚条槽几何与拇指三态的唯一 owner。两端此前各写一份逐字相同的副本，
 * 消费的又是本文件的同一批 --scrollbar-*：同一事实两处维护，改一端就漂。
 *
 * 与上面的 :focus-visible 同理必须待在 `@layer base`：`::-webkit-scrollbar`
 * 家族的特异度极低但无层规则整体压过 `@layer utilities`，写在层外时调用点的
 * `[&::-webkit-scrollbar]:hidden` / `[scrollbar-width:none]` 永远不生效——
 * 固定行高内的横滚轨会被迫让出槽宽，行内元素于是不再居中于行高。
 *
 * scrollbar-color 挂 :root 而不是 `*`：它本就是继承属性，挂 `*` 会切断继承，
 * 让自己换色的滚动面（成员的 .scrollbar-always-visible 一类）无法把颜色传给
 * 内层滚动容器。
 * scrollbar-width 不在这里：两端取值不同且各自钉着已冻结的表内槽宽，见成员注释。
 */
@layer base {
  :root {
    scrollbar-color: var(--scrollbar-thumb) transparent;
  }

  ::-webkit-scrollbar {
    width: var(--scrollbar-size);
    height: var(--scrollbar-size);
  }

  ::-webkit-scrollbar-track,
  ::-webkit-scrollbar-corner {
    background: transparent;
  }

  ::-webkit-scrollbar-thumb {
    border: var(--scrollbar-thumb-border) solid transparent;
    border-radius: var(--radius-pill);
    background-color: var(--scrollbar-thumb);
    background-clip: padding-box;
  }

  ::-webkit-scrollbar-thumb:hover {
    background-color: var(--scrollbar-thumb-hover);
  }

  /* 按下档。这条规则此前缺席，--scrollbar-thumb-active 两个主题的取值因此一直没有消费者；
     补规则而不是删 token——Dark 那一档是实测值（三态几乎同值，按下微压），删掉就丢了实测。 */
  ::-webkit-scrollbar-thumb:active {
    background-color: var(--scrollbar-thumb-active);
  }
}

/*
 * Base UI 的 Select 弹层与 ScrollArea 视口挂 `.base-ui-disable-scrollbar` 隐藏原生滚条，这段规则原本由
 * Base UI 在运行时插入 `\3c style>` 交付。两端 CSP 只放行带本次 nonce 的样式元素，应用根因此以
 * CSPProvider disableStyleElements 关掉插入，规则改由这里交付：与 Base UI 原文逐字相同、同样不入层
 * （原本就是无层作者样式，入层会被 base 层的 ::-webkit-scrollbar 槽宽压过）。
 */
.base-ui-disable-scrollbar {
  scrollbar-width: none;
}

.base-ui-disable-scrollbar::-webkit-scrollbar {
  display: none;
}

/*
 * 进场 0s / 退场 150ms。控件被指到、聚焦、按下、展开或成为当前项时，把控件时长塌成 0——
 * 状态立刻翻；指针一离开，元素退出这些状态，--motion-control 恢复 150ms 淡回。
 * 只挂在交互元素本身，不挂容器：容器一被指到就会把整棵子树的过渡关掉，
 * 于是子元素之间移动指针时退场也变成硬切。
 * 冻结数据面内**有**过渡声明（选择列与表头的共享 Checkbox 的 border/background；
 * 列头拖排的 transform 与 opacity；矩阵列宽把手的 width/background-color），
 * 但这条规则一条都够不着——原因还是「var() 在声明处就替换完了」：
 *   - Checkbox 的时长读 --motion-checkbox，那颗在冻结根上就解成了 --motion-control(150ms)，
 *     被指到的是复选框自己，它本地的 --motion-control:0s 到不了一个已经解出的继承值。
 *     实测：冻结复选框 hover 中读到 0.15s（既不是 0s，也不是 root 的 80ms）。
 *   - 列头拖排的 duration-control 由成员在 :root 上解成 150ms，同理够不着；
 *   - 其余几条读的是 --motion-disclosure、dnd-kit 自带的内联时长或 Tailwind 默认值，
 *     根本不经过 --motion-control。
 * 换句话说：这里的「无影响」是钉法与解析位置挣来的，不是因为那里没有过渡。
 */
:where(
  button,
  summary,
  a[href],
  input,
  select,
  textarea,
  [role="button"],
  [role="tab"],
  [role="link"],
  [role="menuitem"],
  [role="menuitemcheckbox"],
  [role="menuitemradio"],
  [role="option"],
  [role="switch"],
  [role="checkbox"],
  [role="radio"],
  [role="combobox"]
):is(
  :hover,
  /* :focus-visible 不在此列：它会把「聚焦中的元素」整个过渡时长清零，连退场淡出一起吃掉
     （动效规则 §4 非对称时长：按下要快，退场仍要走完）。需要聚焦即刻翻材质的调用点自己写 focus-visible:duration-instant。 */
  :active,
  [data-state="open"],
  [aria-expanded="true"],
  [aria-current="page"],
  [data-popup-open],
  [data-active="true"],
  [data-focused="true"]
) {
  --motion-control: var(--motion-in);
}

[aria-invalid="true"]:focus-visible {
  --focus-ring-color: var(--invalid);
}

/*
 * 勾选族焦点偏移**继续读 --focus-offset-inset**，不要改成 --focus-offset-standalone。
 * 实测参照两个主题都是 2px，表外档由组件自己把 --focus-offset-inset 局部重定向成 2px 达成；
 * 而冻结面靠 `[[data-zml-frozen-surface] &]:[--focus-offset-inset:0px]` 把它钉回 0。
 * 这条规则一旦改读 --focus-offset-standalone，那个钉子就够不着了，冻结表选择框会从 0 变 2px。
 * 换句话说：这里的间接层不是冗余，它就是冻结面的开关。
 */
html :is([data-slot="checkbox"], [data-slot="switch"]):focus-visible {
  outline: var(--focus-ring-outline);
  outline-offset: var(--focus-offset-inset);
}
html :is([data-slot="checkbox"], [data-slot="switch"])[aria-invalid="true"]:focus-visible {
  outline-color: var(--invalid);
}
@media (forced-colors: active) {
  html :is([data-slot="checkbox"], [data-slot="switch"]) {
    border-color: ButtonText; background: Canvas; color: ButtonText; forced-color-adjust: none;
  }
  html [data-slot="checkbox"]:is([data-checked], [data-indeterminate]) {
    border-color: Highlight; background: Highlight; color: HighlightText;
  }
  html [data-slot="switch"] > [data-slot="switch-thumb"] { background: ButtonText; }
  html [data-slot="switch"] { outline: var(--border-width-control) solid ButtonText; outline-offset: var(--focus-offset-inset); }
  html [data-slot="switch"][data-checked] { background: Highlight; }
  html [data-slot="switch"][data-checked] > [data-slot="switch-thumb"] { background: HighlightText; }
  html :is([data-slot="checkbox"], [data-slot="switch"])[aria-invalid="true"]:focus-visible { outline-color: Highlight; }
}

/* 程序化定位到主工作面不画整页焦点框；实际控件继续消费全局焦点环。 */
/* 侧栏底部（08 §3）：自上而下「状态中心 → 帮助」一列，各行拉满内容轨、行距 1px 与导航列表同节奏。
 * 这是底部几何的唯一 owner：无层规则整体压过 `@layer utilities`，成员调用点再写 `items-*` 也改不动它——
 * 此前这里是 `align-items: center`，成员写的 `items-stretch` 被静默压掉，状态行缩成内容宽、在 244 的轨里居中，
 * 左缘比「帮助」右移约 50（抽屉里约 70），两端各自看都「写对了」。 */
.zml-sidebar-footer { display: flex; flex-direction: column; flex-shrink: 0; align-items: stretch; gap: 1px; padding-top: var(--space-inline-standard); }
/* 侧栏连接摘要是 12px chrome：行高 CSS `normal`（拉丁 14.5），不是数据面
 * `--type-workbench-secondary-line`（2026-09-21，原因见「行盒与 CJK」）。
 * 盒高仍 `--control-standard` 28。内距 8、标记格 14、间距 0.375rem 与导航项（ps-2 / 图标 14 / gap-1.5）同值：
 * 摘要首字与「帮助」等导航项的字同列。粗指针下与导航项同抬到 44 命中面。 */
.zml-connection-summary { height: var(--control-standard); min-height: var(--control-standard); align-items: center; gap: 0.375rem; padding-inline: var(--space-inline-standard); border-radius: var(--radius-control); font-size: var(--type-workbench-secondary); line-height: var(--type-workbench-secondary-line); font-weight: var(--font-weight-regular); }
@media (any-pointer: coarse) { .zml-connection-summary { height: auto; min-height: var(--hit-plane-coarse); } }
.zml-connection-summary-compact { min-height: var(--control-standard); align-items: center; }
/*
 * 折叠后浮出的 peek 是「浮在侧栏底板之上的一层」，不是把侧栏原样浮起来：
 * 取工作面明度（比侧栏底亮）、带右侧圆角、不加浮层投影，且从头部下沿起。
 * 宽度是内容轨本身 220（= 244 − 12 左 − 1 右 − 11 滚动槽），不是整条 244。
 */
.zml-sidebar-preview { position: fixed; block-size: auto; inset-block-start: var(--shell-bar-height); inset-block-end: 0; inset-inline-start: 0; z-index: var(--z-floating); width: calc(var(--shell-rail-width) - var(--shell-navigation-inset) - 1px - var(--scrollbar-size-rail)); border-start-end-radius: var(--radius-floating); border-end-end-radius: var(--radius-floating); background: var(--work-surface); }
/* 进场用可打断的过渡而不是关键帧：peek 由悬停反复触发，关键帧每次从零重启，回拖时会跳回起点
   （动效规则 §4）。曲线与其它浮层同族用强 ease-out，不用内建 ease（§2）。 */
.zml-sidebar-preview { opacity: 1; transform: translateX(0); transition: opacity var(--motion-overlay) var(--ease-emphasized), transform var(--motion-overlay) var(--ease-emphasized); }
@starting-style { .zml-sidebar-preview { opacity: 0; transform: translateX(-8px); } }
@media (prefers-reduced-motion: reduce) { .zml-sidebar-preview { transition: none; } }
.zml-sidebar-reveal-edge { position: fixed; inset-inline-start: 0; top: var(--shell-bar-height); bottom: 0; width: var(--shell-wide-inset); z-index: var(--z-navigation); }
/* Linear 密度侧栏开合：面板/分隔与方向符切换；reduced-motion 只切终值。 */
[data-slot="sidebar-mode-glyph"] [data-part] {
  transform-box: fill-box;
  transform-origin: center;
  transition: opacity var(--motion-micro) var(--ease-standard), transform var(--motion-control) var(--ease-standard);
}
[data-slot="sidebar-mode-glyph"][data-pinned="true"] [data-part="divider"] { opacity: 1; transform: none; }
[data-slot="sidebar-mode-glyph"][data-pinned="true"] [data-part="collapse"],
[data-slot="sidebar-mode-glyph"][data-pinned="true"] [data-part="expand"] { opacity: 0; }
/* 只含位移的悬停分支要加指针门：触摸点按会触发假悬停并把字形留在换过的位置（动效规则 §6）。
   键盘分支必须留在门外——它与指针类型无关。 */
@media (hover: hover) and (pointer: fine) {
  [data-slot="sidebar-mode-button"]:hover [data-slot="sidebar-mode-glyph"][data-pinned="true"] [data-part="divider"] {
    opacity: 0;
    transform: translateX(-2px);
  }
}
[data-slot="sidebar-mode-button"]:focus-visible [data-slot="sidebar-mode-glyph"][data-pinned="true"] [data-part="divider"] {
  opacity: 0;
  transform: translateX(-2px);
}
[data-slot="sidebar-mode-button"]:is(:hover, :focus-visible) [data-slot="sidebar-mode-glyph"][data-pinned="true"] [data-part="collapse"] { opacity: 1; transform: none; }
[data-slot="sidebar-mode-button"]:is(:hover, :focus-visible) [data-slot="sidebar-mode-glyph"][data-pinned="true"] [data-part="expand"] { opacity: 0; }
[data-slot="sidebar-mode-glyph"][data-pinned="false"] [data-part="divider"] { opacity: 0; transform: translateX(-2px); }
[data-slot="sidebar-mode-glyph"][data-pinned="false"] [data-part="expand"] { opacity: 1; transform: none; }
[data-slot="sidebar-mode-glyph"][data-pinned="false"] [data-part="collapse"] { opacity: 0; }
[data-slot="sidebar-mode-button"]:is(:hover, :focus-visible) [data-slot="sidebar-mode-glyph"][data-pinned="false"] [data-part="divider"] {
  opacity: 1;
  transform: none;
}
@media (prefers-reduced-motion: reduce) {
  [data-slot="sidebar-mode-glyph"] [data-part] { transition: none; }
}

/*
 * 冻结数据面：表内几何与斑马所依赖的色轴钉在本次冻结起点。
 * 只作用于 [data-zml-frozen-surface] 内，不复制表引擎。chrome 的**色轴与几何**升级不得穿透。
 *
 * **字重轴已从冻结面移出**（本轮用户裁决：表内排版必须与全站同一档，且「不需要特意的加粗」）。
 * 冻结起点把表内正文钉在 450、semibold 钉在 550，理由是「中文 400/450 是 Regular/Medium
 * 两张字面，两档并排能一眼读出轻重差」——这条前提**实测不成立**：Chrome/macOS 上
 * 450 与 400 命中的都是 PingFangSC-Regular（跳变点在 450→460 之间，读法见 root 那段），
 * 中文逐像素相同。收益为零，代价却是全额付出的：表内每一个数字都比全站重一档
 * （Inter Variable 连续轴，13px 同串 +0.73%），而数字正是这几张数据表的主体内容
 * （删字重轴那一轮的实测占比：资金费率矩阵 93.1% / ZML 平台监控主表 78.2% 的可见文字在
 * 表内正文档。资金费率矩阵此后已移出冻结面，这组实测只用来解释当初为什么删掉字重轴）。
 * 所以这里删掉整条字重轴，表内正文回到 root 的 400、semibold 回到 600。
 *
 * 字阶（--type-workbench-* / --type-row-title-*）**仍然钉着**，不是遗漏：
 * 它们当前与 root 逐颗同值，钉子不制造任何表内/表外差。
 *
 * 但要说清楚这颗钉子**够不着资金费率矩阵**：矩阵已移出冻结面，它读的是 **root** 那几颗。
 * root 与本块当前逐颗同值（18 / 16），所以今天零差异，但保护关系确实断了——
 * 本块只覆盖两张冻结表（ZML Trade 组合主表、ZML 平台组合监控主表）。
 * 矩阵那条约束现在挂在 root 那两颗的注释上，且仍是硬约束：矩阵行高由 JS 读
 * --type-workbench-primary-line 算出，改 root 那颗会直接改矩阵行高，本块钉不住它。
 * （格内居中的 --data-matrix-content-height 已随分档收口改读 secondary-line，
 * 与行高解耦；两者不要再当成同一条链。）
 * --type-button / --type-button-line 与它们不同，是表内实测**真的**与 root
 * 分了叉（root 已按参照的 line-height:normal 走到 14.5），行内钮与表头钮是定高 flex 盒、
 * 行盒不改变几何，所以随全站统一，钉子一并删除。
 */
[data-zml-frozen-surface] {
  --font-sans: "Inter Variable", Inter, "PingFang SC", "Microsoft YaHei",
    "Noto Sans SC", ui-sans-serif, system-ui, -apple-system, "Segoe UI",
    sans-serif;
  --font-data: var(--font-sans);
  --font-feature-numeric: "tnum" 1, "kern" 1, "calt" 0;
  /* 字距是继承轴：即使表内没人写 letter-spacing，祖先一旦带上就会落进来。显式钉回 normal。 */
  letter-spacing: normal;
  --type-workbench-primary: 13px;
  --type-workbench-primary-line: 18px;
  --type-workbench-secondary: 12px;
  --type-workbench-secondary-line: 16px;
  --type-row-title: 13px;
  --type-row-title-line: 18px;
  --row-single: 44px;
  --row-dual: 46px;
  --table-header: 32px;
  --cell-inline: 12px;
  --cell-gap: 8px;
  --data-message-row: 14px;
  --data-annotation-row: 20px;
  --data-matrix-inset: 10px;
  --data-header-coarse: 44px;
  --data-matrix-identity-default: 150px;
  --data-matrix-venue-default: 104px;
  --work-surface: lch(97.94% 0.5 282);
  --sub-surface: lch(96.8% 0.4 282);
  /* 排版轴：与 :root / 参照标题同值。不是布局钉子。 */
  --foreground: lch(9.794% 0 282);
  /* 2026-09-20 由 AA 反推加深（原 39.176）：告警行底色固定在 12% 之后，限定词档在斑马 + 告警底上
     只有 4.19，破 AA——它是这条梯上最后一处不够的。36% 回到 4.88，工作面上同时从 6.34 升到 7.09。
     与 Dark 档那次抬亮同源：冻结保护的是 chrome 的色轴升级不得穿透，不是保护一个实测低于 AA 的取值。 */
  --muted-foreground: lch(36% 1.25 282);
  --border-subtle: lch(95.24% 0 282);
  --border: lch(89.84% 0 282);
  --control-hover: lch(94.5% 0.157 282);
  --control-open: lch(87.36% 0.157 282);
  --control-selected: lch(91% 0 282);
  /*
   * **涨跌与陈旧这条色轴不进冻结面**（此前钉在这里的 --financial-positive /
   * --financial-negative / --financial-neutral / --status-stale 四颗已删）。
   *
   * 删的理由是实测，不是偏好：这四颗钉的值与 root 的 Light 档**逐颗相同**，而 root 侧
   * 自钉入（178d4f6f）以来一次都没动过——所以它们在 Light 里从来没生效过，是空钉。
   * 代价却全额付出在 Dark：本块的选择器不带主题条件，`.dark [data-zml-frozen-surface]`
   * 又没有给这四颗补对偶，于是 Light 值直接落进 Dark 的冻结表。实测平台组合监控主表
   * Dark 档 `+920.8899%` 落在 2.876:1（Light 档同一格 6.187:1），低于 AA 4.5。
   * 这正是本块下方 --destructive 那条注释预告过的失败：「同样必须两个主题各钉一次，
   * 否则上面那颗 Light 值会落进 .dark 的冻结表」——那条只修好了它自己那一颗。
   *
   * 不补四颗 Dark 对偶而是整条移出，理由与字重轴同源：冻结保护的是「chrome 的色轴与几何
   * 升级不得穿透」，而涨跌方向色是**数据自己的语义轴**，全站同一套，不是表面装饰；
   * 冻结它既没有保护对象，又多一份要跟着 root 漂的副本。移出后两个主题都读 root，
   * 表内表外同色。
   */
  /*
   * 选择列与表头直接渲染共享 Checkbox，过渡时长会穿透进来：root 侧新增的 80ms 比控件族
   * 快一档，钉回冻结起点的 --motion-control(150ms)。真机复核 hover 中读到 0.15s。
   *
   * 同批一起钉的 --checkbox-border **已删，它在冻结面里从来没被读到**：冻结作用域把
   * --zml-checkbox-border 显式指向 var(--border-strong)，钉 --checkbox-border 是钉在
   * 一条不通的链上——而且钉的还是一个仍在漂的别名（--switch-track-off 的 Dark 档
   * 已从起点 lch(42% 1.1 272) 走到 lch(48.247% 0.93 272)）。这是「消费者被改读另一颗
   * 等价变量、钉子就够不着」的又一例，与上面 --focus-offset-inset 那段同源。
   *
   * 真正生效的那条链**不需要钉**（查过才这么写，不是省略）：--border-strong 两个主题都
   * 停在冻结起点，Light lch(78.5% 1.48 282) / Dark lch(28.032% 1.48 272)，自冻结提交起
   * 逐提交核对未动。真机读到的冻结复选框边 65,66,68 正是 Dark --border-strong 的 sRGB
   * （--switch-track-off 会解到 114,115,116），台账当时把它记成 --switch-track-off 是归因错。
   */
  --motion-checkbox: var(--motion-control);
  /*
   * 本轮 root 侧改动的三个角色都有穿透进冻结表的实际路径，逐个钉回冻结起点：
   * --disabled-foreground：Dark 冻结档早就钉了（35.024），Light 档当时因为 root 恰好
   *   等于冻结起点而没钉，root 一动就暴露成缺口，这里补齐；
   * --focus-offset-default：行焦点框走全局 :focus-visible，偏移是几何，属表内；
   * --primary-hover：共享 Checkbox 在 [data-zml-frozen-surface] 作用域里把
   *   --zml-checkbox-fill-hover 显式指回它（表外那两档已改读 --control-checked-hover），
   *   所以它是冻结表选择框的悬停填色，必须停在起点。
   * 注意 --primary-hover 必须两个主题各钉一次：自定义属性按「离元素更近者胜」，
   *   只钉在这里会把 Light 的值也带进 .dark 的冻结表。
   */
  --disabled-foreground: lch(61.803% 1.2 282);
  --focus-offset-default: 1px;
  /*
   * **这颗此前钉错了值。** 补钉子那一轮钉的是「当时 root 上的值」，
   * 而它在本会话里已经被改过一次（起点 lch(47% 50.26 286.91) → lch(44% 53.85 286.91)），
   * 于是钉子把漂移固化住了，看起来有保护、实际保护的是漂移后的状态。
   * 现按跨批次总账查到的冻结起点钉回。
   * 教训：钉子的值必须来自冻结起点，不是来自「补钉子的那一刻」。
   */
  --primary-hover: lch(47% 50.26 286.91);
  /*
   * --menu-muted 钉回冻结起点（起点上它还是 --muted-foreground 的别名）。
   *
   * **补钉时给的理由是错的，在此更正。** 当时写的是「compact Select 触发器读它、
   * 且活在冻结组合表里」——实机证伪：显示选项浮层 portal 到 body，触发器不在
   * 冻结子树内，那条穿透路径不存在。
   *
   * 钉子保留：删它要先独立核查这颗在冻结子树内还有没有别的读者，而留一颗值等于
   * 起点的钉子无害。本会话已因「钉子钉错值」固化过一次漂移，不凭推理删钉子。
   */
  --menu-muted: lch(39.176% 1.25 282);
  /*
   * --destructive 也有穿透路径：组合主表行内工具条的危险动作图标直接用它上色，
   * 是表内元素而不是 portal 出去的浮层。root 侧本轮把它升到参照彩度，这里钉回冻结起点。
   * 与 --primary-hover 同理，必须两个主题各钉一次。
   * --invalid 本轮值没动，不需要钉。
   *
   * --destructive-wash 是冻结之后才新增的一颗，**没有穿透路径，所以不钉**（这是查过的结论不是省略）：
   * 它只被 Button 的 destructive 档当 hover/active 洗底用，而两个成员的冻结面里都没有这一档——
   * 冻结表内的危险动作走的是 IconButton 上的 text-destructive（只染前景，走上面那颗）
   * 与 MenuItem 的 destructive 高亮（自己的 color-mix，同样只读上面那颗）。
   * 将来若真有 Button destructive 落进冻结表，它在冻结起点上根本不存在，
   * 那时要钉的是「起点等价物」= color-mix(in oklab, var(--destructive) 15%, transparent)，不是现在这颗实色。
   */
  --destructive: lch(45.5% 54 29);
  /*
   * 冻结表自有滚动容器的拇指色。**在冻结块里钉 --scrollbar-thumb 完全无效**：
   * scrollbar-color 是普通继承属性且声明在 :root，var(--scrollbar-thumb) 在 :root 就
   * 代换完了，后代继承到的是**已经解出的颜色**——消费者不读 token，只继承结果。
   * 这是「var() 在声明处替换」那条律的又一种失效形式，唯一修法是在滚动宿主上重新声明。
   *
   * 声明在冻结根上现在只覆盖组合监控主表：它的视口壳在冻结根之内、继承即可到达。
   * 资金费率矩阵已移出冻结面，它自己的滚动宿主不再带冻结属性，拇指色跟随 :root 那条
   * 走全站现行档——这里既够不着它，也不该管它。ZML Trade 组合主表的宿主是冻结根的
   * **父级**（冻结属性挂在 table 上、overflow 在外层），继承方向相反，见下面那条。
   *
   * 值取冻结起点：前景 18% 的半透明混合（root 的 Dark 档后来被改成不透明的
   * lch(37.275% 1.2 272)，在工作面上从 61,61,61 跳到 87,88,90，亮约 25 级，
   * 而且把合成语义从半透明改成了不透明）。这里写表达式而不是实色，是因为冻结块自己
   * 钉着起点的 --foreground，两个主题各自解出的正是各自的起点值。
   */
  scrollbar-color: color-mix(in srgb, var(--foreground) 18%, transparent) transparent;
}
.dark [data-zml-frozen-surface] {
  --work-surface: lch(5.52% 0.4 272);
  --sub-surface: lch(7.32% 0.85 272);
  --card: lch(8.22% 1.1 272);
  --foreground: lch(100% 0 272);
  /* 冻结面同抬：冻结保护的是「chrome 的色轴与几何升级不得穿透」，不是保护一个实测低于 AA 的取值。
     先例就在本块上方——字重轴被证伪后整条从冻结面移出。 */
  /* 2026-09-20 二次抬亮（56 → 64 → 66）：64 时「当前」档上的限定词实测 4.405，仍差一口气。
     每次抬都由实测反推，不按观感调；抬亮只改善其它每一档，没有哪一档因此变差。 */
  --muted-foreground: lch(66% 1.2 272);
  --disabled-foreground: lch(35.024% 1.2 272);
  --border-subtle: lch(9.84% 1.48 272);
  --border: lch(14.16% 1.48 272);
  --control-hover: lch(12.2% 1.1 272);
  --control-open: lch(18.634% 1.075 272);
  --control-selected: lch(13.845% 1.429 272);
  /* 同 Light 冻结档：Checkbox 过渡时长钉回起点的 150ms；同批的 --checkbox-border 是空钉，
     已删（冻结作用域把 --zml-checkbox-border 指向 --border-strong，那颗未漂），理由见上。 */
  --motion-checkbox: var(--motion-control);
  /* 行焦点框走 --focus-ring-outline，焦点环换色会穿透进表内，钉回冻结起点。
     值只存一份：起点就是本主题的专用环色，不在这里再抄一遍字面量。 */
  --focus-ring-color: var(--border-focus);
  /*
   * **这颗此前也钉错了值**（同 Light 档：钉的是改动后的值而不是冻结起点）。
   * 起点是 lch(44% 59.303 288.421)，root 侧在本会话被抬到 52.418。按起点钉回。
   */
  --primary-hover: lch(44% 59.303 288.421);
  /*
   * 同 Light 冻结档：--menu-muted 钉回冻结起点（Dark 起点是 --muted-foreground 的
   * 60.621，root 侧现在是浮层专用的 64.714）。
   *
   * **补钉时给的理由是错的，在此更正。** 当时写的是「compact Select 触发器读它、
   * 且活在冻结组合表里」——实机证伪：显示选项浮层是 portal 到 body 的，那颗触发器
   * 根本不在冻结子树内。所以那条穿透路径不存在。
   *
   * 钉子暂时保留而不是跟着理由一起删：删钉子要先扫清这颗 token 在冻结子树内**是否
   * 还有别的读者**，那是一次独立核查；而留一颗值等于冻结起点的钉子无害。
   * 本会话已因「钉子钉错值」固化过一次漂移，所以这里宁可留着也不凭推理删。
   */
  --menu-muted: lch(60.621% 1.2 272);
  /*
   * 冻结选择列未选态的 hover 描边：共享 Checkbox 在冻结作用域里把
   * --zml-checkbox-border-hover 指回这一颗，而它本身此前没被钉。
   * root 侧把它从 lch(32% 1.48 272) 改成别名 var(--field-border-hover)（解到 28.032/6.93），
   * 明度降了近 4、彩度跳了 4.7 倍。钉回起点。
   */
  --field-border-pressed: lch(32% 1.48 272);
  /* 行内危险图标同 Light 冻结档：root 侧换成了参照的 #ff8583，这里钉回冻结起点。
     同样必须两个主题各钉一次，否则上面那颗 Light 值会落进 .dark 的冻结表。 */
  --destructive: lch(71.06% 38 22.22);
}
/*
 * 冻结拇指色的第二张表：ZML Trade 组合主表的滚动宿主是冻结根的**父级**（冻结属性挂在 table
 * 元素上，overflow 在外层容器），继承只能向下，上面那条在冻结根上的声明够不着它，
 * 只有直接命中宿主才有效。:has(> …) 是为了不误伤同一宿主的卡片档——那不是冻结面。
 *
 * 这里在冻结作用域之外，不能写 var(--foreground)：root 的 Light --foreground 已从起点
 * 9.444 走到 9.794。钉子的值必须来自冻结起点，所以两个主题各写一次起点实值。
 */
[data-combo-table-scroll]:has(> [data-zml-frozen-surface]) {
  scrollbar-color: color-mix(in srgb, lch(9.444% 0 282) 18%, transparent) transparent;
}
.dark [data-combo-table-scroll]:has(> [data-zml-frozen-surface]) {
  scrollbar-color: color-mix(in srgb, lch(100% 0 272) 18%, transparent) transparent;
}
[data-slot="main-surface"]:focus, #settings-main-content:focus { outline: none; }
/* 身份槽 10/4 内距的 owner 是 shellBarSlotClassName.identity，不再按 view-bar 特化一份。 */

/* ==========================================================================
   面的四层（08 §5）：L1 页面面 / L2 数据面 / L3 内嵌块 / L4 浮层
   ==========================================================================

   根定律：每个可见元素恰好属于一个「面」，面决定它的边界、密度、字阶与交互态强度；
   调用点只提供数据和角色，不提供几何。本块只解决 L2 的边界。

   为什么需要这块：L2 此前**没有边界 owner**。2026-09-21 实测——9 个表格面
   全部是 border 0 / 自有底 0 / 圆角 0，而资金费率矩阵的宿主却自带 1px + 圆角 8。
   同一产品里两块并排的数据面给出相反答案，差别不来自它们承载什么，来自各自是谁写的。
   同一轮普查：31 个带任何边界属性的容器共用出 **8 种**边界语言，其中 15 个（近一半）
   实际上没有边界，而完整卡语言（边 1111 + 底 + 角 10 + 影）全产品只用过 **1 次**。

   L2 = 有框、无自有底、无影：
   - **有框**，因为数据面必须说得出「我从哪开始、到哪结束」。横向溢出时尤其：
     /ops-center 20 列、表 2680px 落在 1650px 宿主里，62% 的内容在屏外，
     那张面连列线都没有，读者无从判断自己还在不在同一张表上。
   - **无自有底**，因为 L1 已经给了底；L2 再给一层就是第二套层级（08 §5）。
   - **无影**，同上：影是 L1 与 L4 的语言，L2 借它就是叠卡。

   **嵌套由这里裁决，不由调用点裁决。** 一区两表（账户详情侧窥）时外层赢、内层退框，
   表之间的分区线由该区自己的分区 owner 画（Section / Separator），不在这里发明第二套。
   调用点只声明「我是一块数据面」，不需要知道自己有没有被另一块数据面包着——
   要求调用点做这个判断，正是让那 8 种语言长出来的机制。

   **这是否定式合同的一半**：源码只看得出「现在画 1px」，看不出「不许再加底、加影、
   加第二圈描边」。成员补卡、补描边、补发光一律按 08 §5 处理。 */
/* 两个载体都算 L2，**不是**两套语言：
   - `data-zml-surface="data"` 是显式声明，给不是表的数据面（矩阵、日历、图表外壳、列表区）
     和不走 TableSurface 组件的宿主用。
   - `data-slot="table-surface"` 已经是「这是一张表的滚动 owner」的既有标记，两端的命令式表与
     虚拟化表都手写它（平台的组合监控主表就是）。让它直接蕴含 L2，是为了不必逐调用点补一次标记——
     「让十来个调用点各自穿一次」正是本轮在收的那类分叉的成因（同 §9.2 auto 斑马那条的理由）。 */
:is([data-zml-surface="data"], [data-slot="table-surface"]) {
  border: var(--border-width-hairline) solid var(--border);
  border-radius: var(--radius-data-surface);
}
/* 退框有两种情形，都在这里裁决，都不要求调用点自己判断：
   1. 被另一块数据面包着（一区两表）——外层赢；
   2. 宿主已经替它框了（浮层内的小表、格内表）——由该宿主写 data-zml-surface="none"。 */
:is([data-zml-surface="data"], [data-slot="table-surface"]) :is([data-zml-surface="data"], [data-slot="table-surface"]),
[data-zml-surface="none"],
[data-zml-surface="none"] :is([data-zml-surface="data"], [data-slot="table-surface"]) {
  border: 0;
  border-radius: 0;
}
/* 通栏表（审计 X-7 / X-8）：两种位置上表格本身就是正文，不再包一层 L2 框。
   1. 管理台正文（运维 / 厂商 / 平台管理，management-page 模板）：叶正文就是一张记录表，列一直铺到正文右缘，
      表头行紧贴视图行——与组合 / 账户主表同一个表面；框只会在正文与左轨之外再画一圈，右侧留出一条空带。
   2. 窄档（视口不足 480，与 --container-pane-compact 同一门槛）：两侧竖框与圆角退场，表格横向通栏，
      只留表头线与行线（08 §20「表格横向滑动、首列固定」）；成员页边距为 0 的主记录页随之贴边。
   上下沿的发丝线在窄档保留：没有侧框时它们就是表的起止。 */
[data-slot="management-body"] [data-slot="table-surface"] {
  border: 0;
  border-radius: 0;
}
@media (max-width: 479px) {
  [data-slot="table-surface"] {
    border-inline: 0;
    border-radius: 0;
  }
}
/* 窄档列宽档（审计 X-5）：390 下滚动口要装得下「身份列 + 两个数据列」，宽档那组列宽在身份列之后只装得下一列，
   其余被切成整列空白。按容器宽（表面自己是 table 容器）换一组窄值：值取自两端窄档实测的最长常见值
   （金额「$2,741,798.12」约 88 + 格内距 16；时间短式；身份两段名截断走共享 tooltip），
   定宽写成 px 的列不受影响——那些是按内容实测过的列，窄档要换值就在列上声明 `narrow` 档（见下方窄档轨）。 */
@container table (max-width: 479px) {
  [data-slot="table-surface"] > table {
    --table-column-asset: 80px;
    --table-column-venue: 112px;
    --table-column-status: 88px;
    --table-column-metric: 112px;
    --table-column-metric-wide: 128px;
    --table-column-identity: 128px;
    --table-column-time: 144px;
    --table-column-body: 160px;
    --table-column-fill: 128px;
    --table-column-amount: calc(var(--table-column-metric) - 2 * var(--cell-inline));
    /* 窄档轨（`TableColumnSpec.narrow`）：宽档按内容实测写 px 的列，在窄档换成刻度里的一档。
       这组变量只在窄档声明，宽档读不到、落回列自己的 px（`var(--table-narrow-<档>, <px>)`）。 */
    --table-narrow-asset: var(--table-column-asset);
    --table-narrow-venue: var(--table-column-venue);
    --table-narrow-status: var(--table-column-status);
    --table-narrow-metric: var(--table-column-metric);
    --table-narrow-metric-wide: var(--table-column-metric-wide);
    --table-narrow-identity: var(--table-column-identity);
    --table-narrow-time: var(--table-column-time);
    --table-narrow-action: var(--table-column-action);
    --table-narrow-body: var(--table-column-body);
  }
}

/* 数据行状态互不借用：选择改写底色；告警另有边轨并叠一层底色（见下方「告警行态」块）；陈旧只改数字下划线。 */
.zml-virtual-row {
  contain: layout style paint;
}

/* 列表表格族的斑马（08 §9.2）从**宿主面**抬一步，不从钉死的 --work-surface 抬。
   td/th、冻结列、sticky 列头读的 --zml-table-surface 由宿主（工作面 / 中窥窗 / 抽屉）声明；表面在自己身上把它
   抓成 --zml-table-host-surface（在 tr 改写 --zml-table-surface 之前抓，所以不成环），斑马以它为基——
   否则窗 / 抽屉里的斑马行是一块工作面色的异色板（2026-09-19 用户在暗色与资产分区看到的正是这个）。
   混入比按主题各一颗：暗色底离黑近，同样的比抬得更高，所以比浅色小一档。

   **2026-09-21 重标**：斑马从浅 9%（ΔL* 7.0）/ 暗 8%（9.2）降到浅 4.5%（3.48）/ 暗 3.5%（3.81），
   并且只在表真的横滚时才画（见下方 [data-overflow] 那两条）。原来那个幅度是「斑马是全项目唯一结构信号」
   时代的产物——行线 0/19、表框 0/9，所有分行的活都压在它身上。行线回归后它只是横滚宽表的第二重锚点，
   9% 反而会盖住行态：hover 4 / 当前 6 都在它下面。此前为此加的「开了斑马的表重钉一套更深的行态」
   也随之退役——那套重钉本来就是在补偿「绝对色叠到斑马上步长塌掉」，行态改成按本行底色抬固定步之后
   （见下方 tbody > tr 那一段）基准自己就对了。
   历史外部锚 IBM Carbon 的 layer → layer-accent 步长（white 7.0 / g10 10.8 / g90 10.9 / g100 8.8）
   量的是「面与面」的分层，不是「同一张表里相邻两行」，此前把它当作斑马的验收线是借错了尺。

   梯：底 < 斑马(3.5) < hover(4) < 当前(6) < 告警(8)。选中不在这条亮度梯上（它带色相：浅 a1.5 b−5 / 暗 a7.1 b−16.6）。
   成员只写 tr[data-stripe="odd"]（分组表按组内序号交替，组头不参与）；表面开关 data-stripe 归 TableSurface。 */
/* 表头到正文的边界（2026-09-20 补）：§9.2「钉住的列头靠不透明底遮挡，不长下边线或阴影」的
   理由只覆盖了**滚动遮挡**——行从底下滚过去时不透明底确实够了；它没覆盖**静止时的边界**。
   实测两族都是：表头底色 = 正文底色（浅色同为 L98）、线 0px、无阴影，只剩 1px 的字号差；
   第一行若是偶行就与表头逐位同色，边界没有任何载体。参照 4 家有 3 家画（Carbon border-bottom、
   TradingView 表头线比行线重一档、AG Grid 与行线同档），唯一不画的 Stripe 有行线、第一行的线
   就是节奏——而 ZML 行线也没有。所以这是全表**唯一**的横向结构线，它必须看得见。
   由宿主面派生（与其余线同一条链），步长落在 ΔL* ≈ 9，与 TradingView 的表头线同量级。 */
/* ——— 2026-09-21 重标：行线回归，斑马从「唯一结构信号」降为「横滚宽表的辅助」———
   此前的配比是：行线 0/19、列线 3/19、表外框 0/9，斑马 19/19。斑马是唯一的结构信号，
   所以被推到 ΔL* 6.98（浅）/ 9.2（暗），三个实测代价：
     ① 吃光行态预算——同一张表里 hover 在白行走 −9.45、在斑马行只剩 −2.47，差 4 倍；
     ② 告警档没有 AA 安全余量；
     ③ 14 张 3–9 列、根本不横滚的表也背着这个成本，换不来任何收益。
   22 个顶尖参照实测：2 个默认开斑马，**这 2 个都同时画 1px 行线**；20 个默认关斑马、画行线；
   **没有一个用斑马代替行线**。ZML 是唯一一个。
   机制层面也不成立：IEEE TVCG 2024（Ji, Perin & Nacenta）给的是「降低纵向带宽 → 更自信的纵向
   扫视」，不是「横向不串行」——与本条此前的措辞和 Carbon 的说法都对不上。也就是说这笔预算
   是为一个不成立的理由付的。

   现在的分工：
     行线  ΔL* ≈ 2.7  全表族默认，**每一张表都有**；
     列线  ΔL* ≈ 2.7  只在冻结列接缝与横向溢出表；
     表头线 ΔL* ≈ 6   行线回来之后不需要 9/12 那么重了；
     斑马  ΔL* ≈ 3.5  只在横滚宽表，作为行线之外的第二重横向锚点。
   腾出来的预算归行态（§7 交互态阶梯）。 */
/* 表格骨架（LoadingAnatomy 的 table 档）与就绪表同几何（08 §9.2 全表族画行线、§19 占位与就绪同几何）：
   骨架不一定挂在表面里，所以它与表面共用这一组表头线 / 行线 token 的声明，不另起颜色、不另记步长。 */
[data-slot="table-surface"],
[data-pattern="loading-anatomy"][data-anatomy="table"] {
  /* 表头线：原 12%（ΔL* 9.45）。行线回归后它不再是「全表唯一的横向结构线」，
     降到 ΔL* ≈ 6——仍明显重于行线，层级成立。 */
  --zml-table-head-step: 7.5%;
  --zml-table-head-border: color-mix(in srgb, var(--foreground) var(--zml-table-head-step), var(--zml-table-host-surface));
  --zml-table-host-surface: var(--zml-table-surface, var(--work-surface));
  /* 斑马：原 9%（ΔL* 6.98）。降到 ΔL* ≈ 3.5——够把相邻行分开，又不再压住 hover(4) / 当前(6)。 */
  --zml-table-stripe-surface: color-mix(in srgb, var(--foreground) 4.5%, var(--zml-table-host-surface));
  /* 行线：**由本行自己的底色抬一步**，不取固定色（08 §5 同一条派生链）。
     取固定色的后果已经在列线上付过一次：落到加深后的斑马底上就是同色，线当场消失。 */
  --zml-table-row-line: color-mix(in srgb, var(--foreground) 3.5%, var(--zml-table-surface, var(--zml-table-host-surface)));
}
/* 表内的行态基准是**本行自己的底色**，不是宿主面色。
   这一段必须声明在 `tr` 上：自定义属性在**声明处**就已代换，写在 :root 或表面上时
   `var(--zml-table-surface)` 读到的是那一层的值（未设 → 兜底），不会随行变
   （同一个陷阱本文件上方已经记过一次）。声明在 tr 上，斑马行读到的就是斑马色。
   这样就不再需要「开了斑马的表重钉一套更深的档」——那套重钉本来就是在补偿
   「绝对色叠到斑马上步长塌掉」，基准对了它自己就没用了。 */
[data-slot="table-surface"] > table > tbody > tr {
  --zml-row-base: var(--zml-table-surface, var(--zml-table-host-surface));
  --row-fill-hover: color-mix(in srgb, var(--foreground) var(--row-step-hover), var(--zml-row-base));
  --row-fill-current: color-mix(in srgb, var(--foreground) var(--row-step-current), var(--zml-row-base));
  /* 选中同样要按本行底色算。它不在亮度梯上（带 primary 色相），但「选中比静息深多少」
     仍须在任何底色上一致：实测改前浅色下在窗面（L100）上只剩 ΔL* 1.24，而在工作面上是 6.77——
     和 hover 当初 −9.45 / −2.47 是同一类 bug，只是换了一颗 token。 */
  --row-fill-selected: color-mix(in srgb, var(--primary) var(--row-step-selected), var(--zml-row-base));
  --row-fill-selected-hover: color-mix(in srgb, var(--primary) var(--row-step-selected-hover), var(--zml-row-base));
}

/* **行 hover 有两个职责，此前只实现了一个**（2026-09-21）。
   recipe 把 hover 挂在 `interactive` 上，那是「这一行可以点」的可供性——对的。
   但在真的横向滚动的表上，行 hover 还有第二个职责：**横向扫读时的行追踪**。
   实测 /ops-center 20 列、表 2680px 落在 1650px 宿主里、62% 的内容在屏外，
   而它的行不可点，于是恰恰在最需要追踪的那张表上一点反馈都没有。
   判据与斑马同一条（表真的横滚），理由也同一条：横向行程。
   不改 cursor——这是阅读辅助，不是「可以点」的暗示。
   `:not([data-state])` 是必需的：本条是无层作者规则，会盖过 recipe 里 current / selected
   所在的工具类层（08 §14），不排除就会把「当前行」在横滚表上变回普通 hover。 */
[data-slot="table-surface"][data-overflow] > table > tbody > tr:not([data-state]):hover > :is(td, th) {
  background: var(--row-fill-hover);
}
.dark [data-slot="table-surface"],
.dark [data-pattern="loading-anatomy"][data-anatomy="table"] {
  --zml-table-stripe-surface: color-mix(in srgb, var(--foreground) 3.5%, var(--zml-table-host-surface));
  --zml-table-row-line: color-mix(in srgb, var(--foreground) 2.5%, var(--zml-table-surface, var(--zml-table-host-surface)));
}
.dark [data-slot="table-surface"],
.dark [data-pattern="loading-anatomy"][data-anatomy="table"] { --zml-table-head-step: 5.5%; }

/* 行线画在格上，不画在 tr 上：表是 border-separate + spacing 0，材质与行态填充都由格持有
   （tr 上的 border 在 separate 模式下不渲染）。最后一行不画——表的下边界由 L2 的外框给（§5.1），
   再画一条就是同一件事说两遍。
   **组合主表不在此列**：§5.2「一个组合的两腿共用底色，内部不画横线」，它的横向分隔由斑马承担；
   平台那张主表同时挂着 data-slot="table-surface"，所以必须显式排除，否则会在两腿之间长出一条线。 */
[data-slot="table-surface"]:not([data-combo-table-host]) > table > tbody > tr > :is(td, th) {
  border-bottom: var(--border-width-hairline) solid var(--zml-table-row-line);
}
[data-slot="table-surface"]:not([data-combo-table-host]) > table > tbody > tr:last-child > :is(td, th) {
  border-bottom: 0;
}
/* 显式档：`[data-stripe=""]`，**不是** `[data-stripe]`。后者是存在性选择器，`data-stripe="auto"`
   同样命中——两条规则会同时作用在一张 auto 表上，把行序号从 1 起算或分组表被误切到 auto 时，
   所有行都会着色、斑马整条消失。三处文档（本文件、Table 与 TableSurface 的 JSDoc）都断言
   「两档互斥、auto 不看行上的属性」，在这行收窄之前那句断言在 CSS 层是假的。 */
/* **斑马只在真实横滚时出现**（2026-09-21）：合同的判据是「表宽 > 宿主宽」，而表面本来就在
   量这件事并写 `data-overflow`（08 §20 溢出可发现性）。把 painting 挂在那个量上，判据就只有
   一处实现、不会漂，调用点一行都不用改——两端 5 种表组件、约 50 处 `stripe`，逐处穿判据
   漏一处就是一张「这张表凭什么不一样」的表，而那正是本轮在收的分叉。
   实测：19 张表里只有 5 张真的横滚，其余 14 张（3–9 列）此前全都背着 ΔL* 6.98 的斑马。
   两档都受这一条约束，包括分组表的显式档：组的归属由组头表达（自带 ΔL* 2 底），不由斑马表达。 */
[data-slot="table-surface"][data-overflow][data-stripe=""] tr[data-stripe="odd"] {
  --zml-table-surface: var(--zml-table-stripe-surface);
}
/*
 * `stripe="auto"`：平表不用把行序号穿到每个调用点。
 *
 * 逐行写 `data-stripe` 是**分组表**的必需——那里的交替要按组内序号算、组头不参与，位置序号
 * 给不出正确答案。但全项目大多数列表表格是平的，让十来个调用点各自穿一次行序号，只要有一处
 * 漏了就又是一处「这张表没有斑马」的分叉，而这正是本轮在修的那类分叉的成因。
 *
 * 两档互斥，不混用：auto 只按位置交替，且**不看** data-stripe；显式档只认行上的属性。
 * 分组表必须用显式档——auto 会把组头也算进位置序号里。首行不着色，从第二行起交替。
 */
[data-slot="table-surface"][data-overflow][data-stripe="auto"] tbody tr:nth-child(even) {
  --zml-table-surface: var(--zml-table-stripe-surface);
}

/* 格内「前导标记 + 文字」的唯一写法（2026-09-20）。
   直接写 `flex items-center` 会把格的基线交给标记：flex 容器的基线取第一个 flex 项，而图标 /
   色点没有文字基线，于是同一行里带标记的格与纯文字的格差出一截（实测账户列表身份格 3.5px，
   改后 19 = 19 逐位对齐）。容器按基线排，标记自己居中——`self-center` 的项不参与基线计算，
   于是基线落回文字。合同见 08 §4.2「同一行里各格的第一行必须落在同一条基线上」。 */
.zml-cell-lede {
  display: flex;
  min-width: 0;
  align-items: baseline;
}
.zml-cell-lede > .zml-cell-lede-mark {
  align-self: center;
  flex: none;
}

/* 合成身份标记：父场所 + scope（HIP-3 市场段 / 执行通道来源所 / 独立部署实例）的唯一写法。
   几何与两枚自定义属性由 primitives/entity-mark-tiers 的 entityMarkPairFrame 给出（08 §11）。

   缺口挖在**父**身上，而不是给子画一圈「宿主面色」的环：环必须选一个颜色，可行底色在
   斑马 / 悬停 / 展开 / 告警四态各不相同，两个主题再乘二——任何固定色都会在其余状态里错一档，
   而这正是本轮在修的那类分叉。mask 挖出的是真透明，行底色自己透上来，八种组合全部自动对，
   forced-colors 下也不需要第二套。缺口比子大 1.5px，那 1.5px 就是两颗之间的空隙。 */
/* 身份标记的档位几何（08 §11）：盒边长、兜底字号与合成标记的两枚自定义属性按 data-mark-tier 取值，
   数值与 primitives/entity-mark-tiers 的档位表是同一份（entity-mark-tiers.test 逐档核对）。写成属性规则而不是
   行内样式：预渲染页的 CSP 不放行任何 style 属性（style-src-attr 'none'），行内尺寸会让标记塌成 0×0。
   命令式宽表行仍可经 CSSOM 写同样的值。 */
[data-slot="entity-mark"][data-mark-tier="compact"] { width: 14px; height: 14px; --zml-mark-monogram: 8px; }
[data-slot="entity-mark"][data-mark-tier="row"] { width: 16px; height: 16px; --zml-mark-monogram: 9px; }
[data-slot="entity-mark"][data-mark-tier="stacked"] { width: 20px; height: 20px; --zml-mark-monogram: 11px; }
[data-slot="entity-mark"][data-mark-tier="profile"] { width: 32px; height: 32px; --zml-mark-monogram: 18px; }
[data-slot="entity-mark"] > [data-mark-monogram] { font-size: var(--zml-mark-monogram); }
.zml-entity-mark-pair[data-mark-tier="compact"] { --zml-mark-size: 14px; --zml-mark-overlap: 3px; }
.zml-entity-mark-pair[data-mark-tier="row"] { --zml-mark-size: 16px; --zml-mark-overlap: 3px; }
.zml-entity-mark-pair[data-mark-tier="stacked"] { --zml-mark-size: 20px; --zml-mark-overlap: 4px; }
.zml-entity-mark-pair[data-mark-tier="profile"] { --zml-mark-size: 32px; --zml-mark-overlap: 5px; }

.zml-entity-mark-pair {
  display: inline-flex;
  flex: none;
  align-items: center;
  vertical-align: middle;
}
.zml-entity-mark-pair > :is([data-mark-slot="middle"], [data-mark-slot="secondary"]) {
  margin-inline-start: calc(var(--zml-mark-overlap) * -1);
  z-index: var(--z-raised);
}
/* 命令式宽表行回收复用同一批节点，父与 scope 都要能被 `hidden` 关掉。容器与第二颗自己带了
   display 工具类（inline-flex / inline-block），作者样式压过 UA 的 `[hidden]{display:none}`，
   于是 `element.hidden = true` 在这两处不生效——两条显式规则把它接回来。 */
.zml-entity-mark-pair[hidden] {
  display: none;
}
.zml-entity-mark-pair > [data-mark-slot="secondary"][hidden] {
  display: none;
}
/* 缺口中心 = 子圆心，在父盒坐标里：LTR 落在父盒右外侧，RTL 落在左外侧（mask 坐标是物理的，
   逻辑属性帮不上忙，所以这一对必须手写对偶）。 */
/* 叠放（三颗链标记）里夹在中间的那颗同时被后一颗咬住，缺口与父同一条配方。 */
.zml-entity-mark-pair[data-mark-notch="true"] > :is([data-mark-slot="primary"], [data-mark-slot="middle"]) {
  --zml-mark-notch-radius: calc(var(--zml-mark-size) / 2 + 1.5px);
  --zml-mark-notch-center: calc(var(--zml-mark-size) * 1.5 - var(--zml-mark-overlap));
  -webkit-mask-image: radial-gradient(circle var(--zml-mark-notch-radius) at var(--zml-mark-notch-center) 50%, transparent 100%, #000 100%);
  mask-image: radial-gradient(circle var(--zml-mark-notch-radius) at var(--zml-mark-notch-center) 50%, transparent 100%, #000 100%);
}
.zml-entity-mark-pair[data-mark-notch="true"]:dir(rtl) > :is([data-mark-slot="primary"], [data-mark-slot="middle"]) {
  --zml-mark-notch-center: calc(var(--zml-mark-overlap) - var(--zml-mark-size) / 2);
}

[data-slot="table-surface"] > table > thead {
  border-bottom: 1px solid var(--zml-table-head-border);
}
/* 组合主表的列头**不是 thead**——平台那张是 div 网格（同一个形状陷阱在本轮已经踩过两次），
   所以落在列头格上。Trade 的 th 自身 border-b 为 0（thead 原先持有那一条），两端各只画一层。 */
[data-combo-table-host] [data-combo-column-head] {
  border-bottom: 1px solid var(--zml-combo-head-border);
}
/* 组合主表的宿主不是 [data-slot=table-surface]，自己声明同一条派生链。 */
[data-combo-table-host] {
  --zml-combo-head-border: color-mix(in srgb, var(--foreground) 12%, var(--zml-table-host-surface, var(--work-surface)));
  /*
   * 列族之间的分带：族尾格右内距多一档留白。**线不再分档，分带只靠这一档留白。**
   * 「族线与列线同档」曾经由一颗 --zml-combo-family-border 别名表达（值就是 --zml-combo-column-border），
   * 两端没有任何规则读它——同档的正确写法是族尾**不另声明线色**，多一颗别名只是把同一件事再说一遍，
   * 已删。要恢复「族尾重一档」必须先推翻下面这条裁定，不要靠悄悄给这颗别名换个值。
   *
   * **作用域是宿主，不是行**（2026-09-22）：08 §5.2「族尾那一档留白……两端各按自己的层写、
   * 写完的总量必须相等」要的是两端跟着同一个数走，而读这颗值的规则有两条——一条落在行体格上、
   * 一条落在列头格上。它此前声明在 `.zml-combo-row` 上，而列头行不是这个类（平台实测
   * `headRowIsComboRow: false`），于是列头那条规则跑的永远是 `var()` 的字面量兜底：两端的
   * 8 是各自写死的巧合，不是同一颗 token。受控实验（平台 @1440）——注入
   * `.zml-combo-row{--zml-combo-family-gap:20px}` 后行体格 16→28、列头格仍是 8，两端当场差 12。
   * 宿主同时是两条规则的共同祖先（`[data-combo-table-host] [data-combo-column-head]` 与行体格
   * 都在它下面），所以这里是唯一能同时喂到两端的作用域；两端保留字面量兜底只为宿主属性缺席时
   * 仍取同一个数，不构成第二个真相源。
   *
   * 同档裁定（2026-09-20 用户复核后裁定，取代 09-18 的「族尾重一档」）：
   *   ① 实测配比是反的——15 列登记 8 个族，一行 14 条线里 8 条重、5 条轻，例外成了多数就不是层级；
   *   ② 族尾同时还有 8px 额外留白，邻近性已经把分组做完了，线再画一遍是同一件事说两遍；
   *   ③ 族尾按**当前列序**现算，而列序归账户且可自由重排——同一条边界会因为用户拖了一次列
   *      就从轻变重，权重随用户操作漂移的不是视觉语言；列宽把手又正好骑在列界上，两种权重
   *      会让同一个把手在不同边界上读起来不一样；
   *   ④ 参照里没有一家做纵向轻重分级：Attio 两轴同色同粗、AG Grid 只给冻结边一条实色、
   *      Glide 两轴共用一个 borderColor、Carbon 没有列边框 token。
   */
  --zml-combo-family-gap: 8px;
}
.dark [data-combo-table-host] {
  --zml-combo-head-border: color-mix(in srgb, var(--foreground) 11%, var(--zml-table-host-surface, var(--work-surface)));
}

/* 表面横向溢出的可发现性（08 §20：不按视口隐列、不换卡片；方向入口只在该方向仍有内容时出现）。
   TableSurface 量真实溢出后在自己身上写 data-overflow / data-scrolled / data-at-end / data-frozen-start，
   并把冻结列宽写进 --zml-table-frozen-inline；这里只按属性画，滚动过程零 React 渲染。
   **这一层不绑 `<table>`。** 判据是「一个横向滚动的数据面」，不是「一张语义表」——资金费率矩阵是
   `role="grid"` 的虚拟化 div 面，此前因为不叫 table-surface 就一条渐隐、一枚「›」都没有，
   实测 375 宽下 373→4366（**11.7 屏**）全靠盲滚。所以钩子是 `data-scroll-x-owner`，
   `[data-slot="table-surface"]` 仍然命中（它自己也写这个属性），两者取并集。
      边缘渐隐骑在一枚 sticky(top 0 / inline-start 0)、零高的层上：它随视口横纵都钉住、宽度恰是滚动口的
   内容宽（不含纵向滚动条），所以渐隐落在滚动条内侧、不遮滚动条；层的高度由表面量好写进 --zml-table-port-height
   （取滚动口与表二者较矮者，短表不会因此长出纵向溢出）。冻结身份列在时起点不画渐隐——它的右缘承重边
   （--border）就是「左边还有列」的信号；起点渐隐只给没有冻结列的表。列头行尾的「›」是键盘与粗指针的到达入口，
   一次滚到下一列起点；列头 / 行内控件获焦时浏览器自己的 scrollIntoView 经 scroll-padding 绕过冻结列。 */
:is([data-slot="table-surface"], [data-scroll-x-owner]) {
  scroll-padding-inline-start: var(--zml-table-frozen-inline, 0px);
}
/* 首列固定（TableSurface frozenFirstColumn）：身份列钉在横滑起点。格底色本来就由行态画在格上（tableRowClassName），
   钉住的格因此不透明且随斑马 / 悬停 / 选中换色；表头那一格压在正文钉住格之上。 */
[data-slot="table-surface"][data-frozen-first-column] > table > :is(thead, tbody) > tr > :first-child:not([colspan]) {
  position: sticky;
  inset-inline-start: 0;
  z-index: 1;
}
[data-slot="table-edge"] {
  position: sticky;
  top: 0;
  inset-inline-start: 0;
  z-index: calc(var(--z-sticky) + 1);
  height: 0;
  pointer-events: none;
}
/* 渐隐 32 宽：靠边 8px 实色、余下 24 渐变——「›」（24 宽、距边 4）落在实色段上，不压在末列右对齐的列头字上。
   末端冻结列（行尾动作列）在时，渐隐与「›」都退到它的内侧，冻结列自己是不透明面。 */
[data-slot="table-edge"] > [data-edge] {
  position: absolute;
  top: 0;
  width: calc(var(--space-inline-standard) + var(--space-section-standard));
  height: var(--zml-table-port-height, 0px);
  opacity: 0;
  transition: opacity var(--motion-control) var(--ease-standard);
}
[data-slot="table-edge"] > [data-edge="start"] {
  inset-inline-start: 0;
  background: linear-gradient(to right, var(--zml-table-host-surface, var(--zml-table-surface, var(--work-surface))) var(--space-inline-standard), transparent);
}
/* 末端：被视口切开的那一列整列用实底盖住（`--zml-table-edge-cover`，量法见 useTableSurfaceOverflow），
   数字不以撕开的头几位露出来（07 §6.1）；没有被切开的列时退回 32 宽渐隐。预留的滚动条槽
   （`--zml-table-gutter`）里仍会画内容，所以渐隐向外多盖一条槽宽，贴住圆角边框内侧。
   宿主底色带回落链：`--zml-table-host-surface` 只在 table-surface 上声明，`data-scroll-x-owner` 的 div 面（资金费率矩阵）
   读不到它时整条 gradient 失效、实底透明——覆盖层量对了却什么也没盖（审计 N6-2）。 */
[data-slot="table-edge"] > [data-edge="end"] {
  --zml-table-edge-gutter: 0px;
  --zml-table-edge-solid: calc(max(var(--space-inline-standard), var(--zml-table-edge-cover, 0px)) + var(--zml-table-edge-gutter));
  inset-inline-end: calc(var(--zml-table-frozen-inline-end, 0px) - var(--zml-table-edge-gutter));
  width: calc(max(var(--space-inline-standard) + var(--space-section-standard), var(--zml-table-edge-cover, 0px)) + var(--zml-table-edge-gutter));
  background: linear-gradient(to left, var(--zml-table-host-surface, var(--zml-table-surface, var(--work-surface))) var(--zml-table-edge-solid), transparent);
}
/* 伸进滚动条槽的那一条只在末端渐隐真的可见时才有（横向溢出且未到末端）。这一层虽是 opacity 0，
   它的盒仍计入滚动口的可滚范围：表不溢出时常驻伸出一条槽宽，滚动口就凭空多出 11px 横向可滚（信号收件表
   1440 实测 scrollWidth 1184 > clientWidth 1173，触控板一推整表横晃）；到末端时也会越过表尾再滚一条槽宽。
   末端渐隐只在「溢出且未到末端」时显形，槽里才有被横滚出来的内容要盖——两个判据是同一个。 */
:is([data-slot="table-surface"], [data-scroll-x-owner])[data-overflow]:not([data-at-end]) [data-slot="table-edge"] > [data-edge="end"] {
  --zml-table-edge-gutter: var(--zml-table-gutter, 0px);
}
:is([data-slot="table-surface"], [data-scroll-x-owner]):dir(rtl) [data-slot="table-edge"] > [data-edge="start"] { background: linear-gradient(to left, var(--zml-table-host-surface, var(--zml-table-surface, var(--work-surface))) var(--space-inline-standard), transparent); }
:is([data-slot="table-surface"], [data-scroll-x-owner]):dir(rtl) [data-slot="table-edge"] > [data-edge="end"] { background: linear-gradient(to right, var(--zml-table-host-surface, var(--zml-table-surface, var(--work-surface))) var(--zml-table-edge-solid), transparent); }
:is([data-slot="table-surface"], [data-scroll-x-owner])[data-overflow][data-scrolled]:not([data-frozen-start]) [data-edge="start"],
:is([data-slot="table-surface"], [data-scroll-x-owner])[data-overflow]:not([data-at-end]) [data-edge="end"] {
  opacity: 1;
}
/* 语义表末端被切的那一列：只隐去内容，不盖实底（useTableSurfaceOverflow 写 `data-edge-cut` = 列序）。
   格本身照画——行底色、斑马、悬停、当前行一直铺到表的可视右缘（审计 X-6：实底层只有一种颜色，盖在行态上是一截断带）；
   被切的数字不以撕开的头几位露出来（07 §6.1）。文字节点走 color，子元素走 visibility（会继承，只写直接子元素）。
   这一列此刻没有可读内容，末端渐隐也随之退场——「›」仍在列头行尾给出方向入口。上限 24 列，超出的表退回实底覆盖。 */
[data-edge-cut="2"] > table > * > tr > :nth-child(2),
[data-edge-cut="3"] > table > * > tr > :nth-child(3),
[data-edge-cut="4"] > table > * > tr > :nth-child(4),
[data-edge-cut="5"] > table > * > tr > :nth-child(5),
[data-edge-cut="6"] > table > * > tr > :nth-child(6),
[data-edge-cut="7"] > table > * > tr > :nth-child(7),
[data-edge-cut="8"] > table > * > tr > :nth-child(8),
[data-edge-cut="9"] > table > * > tr > :nth-child(9),
[data-edge-cut="10"] > table > * > tr > :nth-child(10),
[data-edge-cut="11"] > table > * > tr > :nth-child(11),
[data-edge-cut="12"] > table > * > tr > :nth-child(12),
[data-edge-cut="13"] > table > * > tr > :nth-child(13),
[data-edge-cut="14"] > table > * > tr > :nth-child(14),
[data-edge-cut="15"] > table > * > tr > :nth-child(15),
[data-edge-cut="16"] > table > * > tr > :nth-child(16),
[data-edge-cut="17"] > table > * > tr > :nth-child(17),
[data-edge-cut="18"] > table > * > tr > :nth-child(18),
[data-edge-cut="19"] > table > * > tr > :nth-child(19),
[data-edge-cut="20"] > table > * > tr > :nth-child(20),
[data-edge-cut="21"] > table > * > tr > :nth-child(21),
[data-edge-cut="22"] > table > * > tr > :nth-child(22),
[data-edge-cut="23"] > table > * > tr > :nth-child(23),
[data-edge-cut="24"] > table > * > tr > :nth-child(24) {
  color: transparent;
}
[data-edge-cut="2"] > table > * > tr > :nth-child(2) > *,
[data-edge-cut="3"] > table > * > tr > :nth-child(3) > *,
[data-edge-cut="4"] > table > * > tr > :nth-child(4) > *,
[data-edge-cut="5"] > table > * > tr > :nth-child(5) > *,
[data-edge-cut="6"] > table > * > tr > :nth-child(6) > *,
[data-edge-cut="7"] > table > * > tr > :nth-child(7) > *,
[data-edge-cut="8"] > table > * > tr > :nth-child(8) > *,
[data-edge-cut="9"] > table > * > tr > :nth-child(9) > *,
[data-edge-cut="10"] > table > * > tr > :nth-child(10) > *,
[data-edge-cut="11"] > table > * > tr > :nth-child(11) > *,
[data-edge-cut="12"] > table > * > tr > :nth-child(12) > *,
[data-edge-cut="13"] > table > * > tr > :nth-child(13) > *,
[data-edge-cut="14"] > table > * > tr > :nth-child(14) > *,
[data-edge-cut="15"] > table > * > tr > :nth-child(15) > *,
[data-edge-cut="16"] > table > * > tr > :nth-child(16) > *,
[data-edge-cut="17"] > table > * > tr > :nth-child(17) > *,
[data-edge-cut="18"] > table > * > tr > :nth-child(18) > *,
[data-edge-cut="19"] > table > * > tr > :nth-child(19) > *,
[data-edge-cut="20"] > table > * > tr > :nth-child(20) > *,
[data-edge-cut="21"] > table > * > tr > :nth-child(21) > *,
[data-edge-cut="22"] > table > * > tr > :nth-child(22) > *,
[data-edge-cut="23"] > table > * > tr > :nth-child(23) > *,
[data-edge-cut="24"] > table > * > tr > :nth-child(24) > * {
  visibility: hidden;
}
:is([data-slot="table-surface"], [data-scroll-x-owner])[data-overflow][data-edge-cut] > [data-slot="table-edge"] > [data-edge="end"] {
  opacity: 0;
}
[data-slot="table-edge"] > [data-slot="table-reach"] {
  position: absolute;
  top: 0;
  inset-inline-end: calc(var(--zml-table-frozen-inline-end, 0px) + var(--space-inline-compact));
  display: none;
  height: var(--zml-table-header);
  align-items: center;
  pointer-events: auto;
}
:is([data-slot="table-surface"], [data-scroll-x-owner])[data-overflow]:not([data-at-end]) [data-slot="table-reach"] {
  display: flex;
}
/* 粗指针 / 触摸下列吸附：列起点即吸附点，冻结列宽作 padding；细指针不吸附——滚轮与轨道板不该被列边界抢方向盘。 */
@media (pointer: coarse) {
  :is([data-slot="table-surface"], [data-scroll-x-owner])[data-overflow] {
    scroll-snap-type: x proximity;
  }
  :is([data-slot="table-surface"], [data-scroll-x-owner])[data-overflow] :is(th, td, [role="gridcell"], [role="columnheader"]) {
    scroll-snap-align: start;
  }
}
@media (prefers-reduced-motion: reduce) {
  [data-slot="table-edge"] > [data-edge] { transition: none; }
}
@media (forced-colors: active) {
  [data-slot="table-edge"] > [data-edge] { display: none; }
}

/* 方向类字形在 RTL 里镜像：icons.tsx 按角色表 `mirrorInRtl` 输出 data-icon-rtl-mirror，这里是唯一消费者
   （此前属性一直在输出、没有任何 CSS 读它，步进条「›」在 RTL 仍指右——2026-09-19 审计 MP-16）。 */
:root[dir="rtl"] [data-icon-rtl-mirror] { transform: scaleX(-1); }

/* 「这一行现在是什么底色」只有一个 owner：--zml-data-row-surface。各行态改写它，底色由这一条画。
   原因：组合主表的列线由本行底色派生（§5），直接写 background-color 的行态线就读不到，
   平台的斑马行此前正是如此——列线按未加深的工作面算，落在加深后的斑马底上几乎同色。 */
.zml-data-row {
  background-color: var(--zml-data-row-surface, var(--work-surface));
}

/* 斑马只有一个 owner：行上的 `data-row-stripe="odd"`，两端同一入口。斑马只改写**静息基准**，
   当前底由下面的静息规则从基准派生，所以这里不必再写一遍当前底。
   此前 Trade 走 recipe 的 striped 工具类，只写当前底、不写基准，于是斑马行的悬停 / 展开 / 选中
   全部从平底行的基准抬——浅色斑马悬停只 +0.78、暗色反向 −5.85、选中比静息更浅（2026-09-22 实测）。 */
.zml-combo-row[data-row-stripe="odd"] {
  --zml-combo-base-surface: var(--zml-combo-stripe-surface);
}

/* 组合靠连续底色 + 组合间留缝横向定位（08 §5，用户 2026-09-17 裁定）：行高 40 里两腿仍各 16 行距，
   上下内距 4 全部落在组合之间；斑马隔行一眼可辨；组合之间不再画接缝线——留缝之后它是第三个信号，
   只增加纹理；悬停有自己的一档，在奇偶两种底上都比斑马明确；两腿共用底色，内部不画横线。 */
.zml-combo-row {
  /* 斑马底与悬停底都从**宿主面**抬，不钉死 --work-surface：组合主表在平台侧套在 DataTableShell 里，
     宿主声明的是自己那颗面色，钉死工作面会让斑马行成为一块异色板（列表族 2026-09-19 已修过同一个 bug）。
     Trade 的宿主不声明这颗变量，回落 --work-surface，取值不变。
     浅色斑马原先与族线同源于 --border 45%（2026-09-17：各自取值成了灰白棋盘），只有 ΔL* 3.5。
     线色自 2026-09-20 起由本行底色派生、自动跟着斑马走，同源那条理由不再成立，于是按与列表族同一把尺
     重标为前景混入：浅 9%（ΔL* 7.0）、暗 8%（ΔL* 9.2），外部锚同上（Carbon 7.0–10.9）。 */
  --zml-combo-stripe-surface: color-mix(in srgb, var(--foreground) 9%, var(--zml-table-host-surface, var(--work-surface)));
  /* hover / 当前从**本行自己的静息底色**抬一步，步长受本表两种底色的文字对比约束。
     原先从宿主面抬固定比，于是同一张表里 hover 在白行走 −10.16、在斑马行只剩 −3.18（3.2 倍差）——
     与列表族当初 −9.45 / −2.47 是同一个 bug，只是换了一条 token 链。
     基准改对之后就不需要「比斑马更深」这条补偿了：它从哪一行出发就从哪一行抬。
     **斑马仍保持 9% / 8% 不降**——§5.2 记着 2026-09-17 用户决定「组合与组合之间不画接缝线」，
     所以斑马是这张表**唯一**的横向信号，与列表族（有行线兜底）不是同一个负载。 */
  /* **基准是「本行静息底色」，不是「本行当前底色」。** 这两件事此前共用 --zml-combo-row-surface，
     构成自定义属性依赖环：--zml-combo-row-surface → --zml-data-row-surface →（悬停时）
     --zml-combo-hover-surface → --zml-combo-row-surface。按 CSS Variables §3，环内三颗在悬停
     那一帧全部 computed 成 guaranteed-invalid，后果分两半：
       · 底色那条 `var(--zml-data-row-surface, var(--work-surface))` 有兜底 → 退成宿主面，
         于是悬停看着「什么也没发生」，斑马行上还反向变浅；
       · 列线那条 `color-mix(…, var(--zml-combo-row-surface))` 没有兜底 → 整条声明 IACVT，
         border-style 退到 initial 的 none → **被指到那一行的竖线整排消失**。
     所以这不是「悬停太弱」，是悬停把这一行的底色和全部列线一起抹掉了。
     --zml-combo-base-surface 只从斑马/宿主面来，任何行态都不改写它，环因此不成立；
     而列线继续读 --zml-combo-row-surface（= 当前态底色），仍然跟着悬停/选中/展开走。 */
  --zml-combo-base-surface: var(--zml-table-host-surface, var(--work-surface));
  /* 静息：当前底就是基准。斑马、悬停、选中、确认、展开都只改写这两颗之一，底色永远由 --zml-data-row-surface 画。 */
  --zml-data-row-surface: var(--zml-combo-base-surface);
  /* 四档全部从**本行静息基准**抬，步长取 §9.2 那一把梯（--row-step-*），不再自持一套 8% / 11%：
     此前组合表的悬停 / 展开在斑马行上 ΔL* 只 +0.78（浅）甚至反向 −5.85（暗），选中直接消费 :root 的
     绝对色、比斑马静息更浅——不是步长错，是基准错；基准对了，同一组步长在奇偶两种底上给出同一档差。
     每一档的上限仍由 AA 定：最弱的小字号语义文字在**该行态的底色上**须 ≥ 4.5:1，够不到就压低步长，
     不压低文字；文字色、宿主面或斑马改变后须重验两主题 × 奇偶 × 五态，不能继承偶行结论。 */
  --zml-combo-hover-surface: color-mix(in srgb, var(--foreground) var(--row-step-hover), var(--zml-combo-base-surface));
  --zml-combo-current-surface: color-mix(in srgb, var(--foreground) var(--row-step-current), var(--zml-combo-base-surface));
  --zml-combo-selected-surface: color-mix(in srgb, var(--primary) var(--row-step-selected), var(--zml-combo-base-surface));
  --zml-combo-selected-hover-surface: color-mix(in srgb, var(--primary) var(--row-step-selected-hover), var(--zml-combo-base-surface));
  /* 列线与族线由**本行自己的底色**抬一个固定步得到，不取固定颜色 token（用户 2026-09-18）。
     原因：斑马、悬停、选中、展开各有底色，任何固定线色都只能对其中一种校准——在暗色里
     取 --border（L14）画线，落到 8% 斑马底（约 L14）上就是同色，列与列当场没有区分。
     一条声明覆盖全部行态，深浅主题只差抬多少：浅色底压缩在近白端，需要更大的步。
     斑马承担横向分组，这两条线承担纵向分列；冻结区右缘的承重边仍由粘格自己画。
     列头自己也声明一份：它没有行底色，回落到工作面，于是族线在表头与正文是同一条。 */
  --zml-combo-row-surface: var(--zml-data-row-surface, var(--work-surface));
  --zml-combo-column-step: 18%;
  --zml-combo-column-border: color-mix(in srgb, var(--foreground) var(--zml-combo-column-step), var(--zml-combo-row-surface));
  /* 冻结区承重边是**唯一**的例外，也必须是最强的那一条：它说的是「左边这些列不跟着滚」，
     与「列与列之间」不是同一类边界。此前它取固定的 --border-strong，实测 ΔL* 19.5，
     反而比族尾线的 27 还轻——层级是倒的（2026-09-20 实测）。改为同样由本行底色派生，
     步长高于列线，于是它在任何行态上都稳稳是最重的一条。 */
  --zml-combo-frozen-step: 34%;
  --zml-combo-frozen-border: color-mix(in srgb, var(--foreground) var(--zml-combo-frozen-step), var(--zml-combo-row-surface));
}
/* 列头的色轴作用域与元素形状无关：Trade 是真 thead/th，平台是 div 网格里带 data-combo-column-head
   的格，两者都要拿到同一条派生链（2026-09-20 纯化：原来只写 thead，平台侧整段落空、一条纵线都没有）。 */
[data-combo-table-host] :is(thead, [data-combo-column-head]) {
  --zml-combo-row-surface: var(--zml-table-host-surface, var(--work-surface));
  --zml-combo-column-step: 18%;
  /* 列头也要在这一层重算，否则 --zml-combo-column-step 在表头是零消费者、列头只能各自
     写死一颗固定色，表头与正文的列线就不是同一条（2026-09-20 纯化）。 */
  --zml-combo-column-border: color-mix(in srgb, var(--foreground) var(--zml-combo-column-step), var(--zml-combo-row-surface));
}
.dark [data-combo-table-host] :is(thead, [data-combo-column-head]) {
  --zml-combo-column-step: 12%;
}
.dark .zml-combo-row {
  /* 暗色斑马 3.5% 只有约 ΔL 4，在低明度区接近感知阈；抬到 8%（实测 ΔL* 9.2）才「隔行一眼可辨」。 */
  --zml-combo-stripe-surface: color-mix(in srgb, var(--foreground) 8%, var(--zml-table-host-surface, var(--work-surface)));
  /* 暗色步长由 .dark 的 --row-step-* 给出，声明在上面那条里一次生效；8% 斑马已占用部分文字对比预算，
     上限按最差奇行文字校（见下方各态实测）。金融色、限定词与几何保持共享语义，不为行态另造前景。 */
  --zml-combo-column-step: 12%;
  --zml-combo-frozen-step: 26%;
}
.zml-combo-row > :is(th, td) {
  /* 行族配方给格画的下边线在组合行里恒不画：组合之间靠留白与斑马分开（08 §5）。
     **连宽度一起收掉，不能只把颜色改成透明**（2026-09-22）：透明的 1px 照样占位，格的 border box
     就比行盒高 1；而格的底色正是按 border box 画的，于是每一行的底色会盖住下一行顶部那 1px。
     行又是绝对定位的复用槽，DOM 次序与视觉次序无关，谁盖谁随槽回收而变——同一条缝时有时无。 */
  border-bottom-width: 0;
  border-inline-end: 1px solid var(--zml-combo-column-border);
}
/* div 网格形状那一支的列线：格尾一枚 1px 伪元素（格本身是绝对 / 粘性定位的，伪元素以它为包含块）。
   **不用 box-shadow**（2026-09-23 改）：① forced-colors 下 UA 把 box-shadow 强制成 none，列线在高对比下
   整片消失，而那一支的 forced-colors 规则写的也是 box-shadow——编得出、永不生效；② box-shadow 是单值
   属性，冻结区的软投影一写上去就把承重边盖掉；③ 它没有逻辑方向，得靠 `[dir="rtl"]` 祖先选择器手工镜像，
   而组合主表的表格区域恒为 LTR（08 §9.2），祖先选择器照样命中文档根的 rtl，于是线画到了上一列身上。
   伪元素用 inset-inline-end，按表格区域自己的方向落位，几何与 inset 阴影逐像素相同（压在格内最后 1px）。 */
.zml-combo-row :is([role="cell"], [role="gridcell"]):not(.zml-combo-drawer-band *)::after {
  content: "";
  position: absolute;
  inset-block: 0;
  inset-inline-end: 0;
  inline-size: 1px;
  background: var(--zml-combo-column-border);
  pointer-events: none;
}
/*
 * 冻结区右缘的承重边，div 网格形状那一支。`<table>` 形状的成员（Trade）在冻结格上把
 * --zml-combo-column-border 指向冻结档就够了，因为那条线的载体是 border；div 网格没有
 * border 载体，线由上面那条 inset 阴影画，改变量对它无效，所以按属性单独出一条。
 *
 * 这是本轮补的**最后一处两端不一致**：平台此前在成员端内联写死
 * `box-shadow: inset -1px 0 var(--border-strong)`——颜色是 chrome 的固定强边界，
 * 与 Trade 那端的派生档（--zml-combo-frozen-border，浅 34% / 暗 26% 混入行底色）不是同一颗；
 * 方向是物理的，RTL 下画到格的起始端；而且内联声明会盖掉共享层对同一属性的任何规则，
 * 冻结边从此脱离共享的线宽阶梯。现在两端同读一颗派生色，阶梯只有一处定义。
 */
.zml-combo-row :is([role="cell"], [role="gridcell"])[data-combo-frozen-edge="true"]::after {
  background: var(--zml-combo-frozen-border);
}
/* 列头自己画同一条轻列线，形状无关。Trade 原先在成员端用工具类写死 --border，两端各写一次。 */
[data-combo-table-host] [data-combo-column-head] {
  border-inline-end: 1px solid var(--zml-combo-column-border);
}

/* 表尾不画线：最后一列的右缘是表的边界，不是列与列之间。
   载体是成员贴的 data-combo-column-end，不是 :last-child——行尾恒挂着告警带与展开带两枚
   隐藏格（display:none 不改变结构），:last-child 永远落在它们身上，数据列一次都豁免不到
   （2026-09-20 纯化）。两条纵向线路径（border 与格尾伪元素）同时豁免，否则只有一端生效。 */
.zml-combo-row > :is(th, td)[data-combo-column-end="true"],
[data-combo-table-host] [data-combo-column-head][data-combo-column-end="true"] {
  border-inline-end-color: transparent;
}
.zml-combo-row :is([role="cell"], [role="gridcell"])[data-combo-column-end="true"]::after {
  content: none;
}
/* 行尾的告警带与展开带跨全列，它们的右缘同样是表的边界。展开带自己已清零，告警带补上。 */
.zml-combo-row > [data-combo-alert-band="true"] {
  border-inline-end: 0;
}

/* 列族分带：族尾格右内距多一档留白，**只有留白，不再多画一条更重的线**（2026-09-20）。
   线仍由上面那两条基线规则画，与族内同档；这里不重复声明颜色。
   数据格自己带 `--zml-cell-inline` 的左右内距，这条把右侧那一份**改写**成「内距 + 族间距」，
   所以族尾格比族内格多让出的是族间距那一档。 */
.zml-combo-row > [data-combo-family-end="true"],
.zml-combo-row :is([role="cell"], [role="gridcell"])[data-combo-family-end="true"]:not(.zml-combo-drawer-band *) {
  padding-inline-end: calc(var(--zml-cell-inline, var(--cell-inline)) + var(--zml-combo-family-gap, 8px));
}
/* 列头格是 `p-0`：格内距在格内那层 `data-slot="table-column-heading"` 上（两张组合主表都如此）。
   这里因此只加族间距那一档——照数据格那条写就是在格内距之外**再加**一份，右侧变成 8+8+8=24，
   而数据格是 16，右对齐族尾列的列头文字右缘比它统辖的数字缩进 8（2026-09-22 在平台主表实测
   −9 对族内列的 −1，fundingDetail / fsl / oi / f5d 四列）。两条规则量的是同一件事，只是内距的
   归属层不同，不能合成一条选择器。 */
[data-combo-table-host] [data-combo-column-head][data-combo-family-end="true"] {
  padding-inline-end: var(--zml-combo-family-gap, 8px);
}

/* 冻结区右缘横滚离开起点后的软投影：说明左边还有被盖住的内容；停在起点时只有那条承重边。
   box-shadow 没有逻辑属性，按**格自己的方向**（`:dir()`）镜像，不按祖先的 `[dir]` 属性——组合主表的
   表格区域恒为 LTR 而文档根可能是 rtl，祖先属性选择器会在 LTR 的表里把投影打进冻结区内部。
   它只是「左边还有内容」的软提示：forced-colors 下 box-shadow 失效无妨，承重边是格尾伪元素 / border，照常画。 */
[data-combo-scrolled-x="true"] [data-combo-frozen-edge="true"] {
  box-shadow: 6px 0 6px -6px var(--border-strong);
}
[data-combo-scrolled-x="true"] [data-combo-frozen-edge="true"]:dir(rtl) {
  box-shadow: -6px 0 6px -6px var(--border-strong);
}

/* 冻结列按需吸附（primitives/frozen-column-engagement）：横滚停在起点且没有可能引出横滚的手势时，
   行体里只在横滚时才需要粘性的元素（成员挂 data-combo-sticky）落回 relative，纵向滚动不再逐帧为它们重算粘性偏移。
   列头不带这个标记，始终粘性。成员的冻结格流内位置就是静止位（网格格；块流格靠 margin 落位），粘性偏移
   只管钉住后的位置，所以落回时偏移一并清零——相对定位保留偏移会把第二枚冻结格再推一个偏移。
   两个 !important 是因为成员把粘性与偏移写在内联样式上（逐行命令式几何），无层规则盖不过内联。 */
[data-frozen-columns="idle"] .zml-combo-row [data-combo-sticky] {
  position: relative !important;
  inset: auto !important;
}

/* 窄容器或粗指针下横滚按列起点吸附（08 §20）：吸附起点是冻结区右缘，桌面自由滚。 */
[data-combo-table-scroll][data-combo-snap="true"] {
  scroll-snap-type: x proximity;
  scroll-padding-inline-start: var(--zml-combo-frozen-width, 0px);
}
[data-combo-table-scroll][data-combo-snap="true"] thead th:not([data-sticky]) {
  scroll-snap-align: start;
}

/* 行下展开区（08 §22 启动台）：跨全列的带，内容贴视口左缘、横滚时不动；展开行是当前态。 */
.zml-combo-row > .zml-combo-drawer-band {
  grid-column: 1 / -1;
  padding: 0;
  border-inline-end: 0;
  overflow: visible;
}
/* 两端同一份展开区材质：muted 带里一块 panel 面，顶部一线内高光；主色立柱落在**带**的起始缘（表格左缘），
   从带顶贯到带底——它说的是「这一块属于上面那一行」，画在内层面板上会被带的 8px 留白隔开、55% 混色在 panel 上
   几乎读不出（原型对照 C-6）。带的起始内距让出立柱的 2px，内层面板与内容的落点与改前逐像素相同（立柱 2 + 带 6 = 面板 8，面板内距 10 → 内容 18）。
   成员只管贴视口与宽度。 */
.zml-row-drawer-band {
  box-sizing: border-box;
  padding: 6px 8px;
  padding-inline-start: 6px;
  border-inline-start: 2px solid var(--primary);
  background: var(--sub-surface);
  color: var(--foreground);
}
.zml-row-drawer {
  box-sizing: border-box;
  min-width: 0;
  overflow: hidden;
  padding: 6px 8px;
  padding-inline-start: 10px;
  background: var(--card);
  color: var(--foreground);
  box-shadow: inset 0 1px 0 color-mix(in srgb, var(--foreground) 5%, transparent);
}
.zml-combo-drawer {
  position: sticky;
  inset-inline-start: 0;
  width: var(--zml-combo-viewport-width, 100%);
  max-width: 100%;
}
/* 高度尚未计入行几何前不露面：否则展开区会先压在下一行上，几何长高后再跳一次。 */
.zml-combo-drawer-band:not([data-combo-drawer-ready="true"]) {
  visibility: hidden;
}
/* 展开行的底色只有一个 owner，且必须落在**行**上：列线由本行底色派生，声明在格上时行拿不到，
   展开那一行的列线会按未展开的底色算（用户 2026-09-18 纯化）。格的底色本来就继承自行。
   展开与确认同属「当前」档，声明合在下面的行态块里。 */
/* 行态优先级由**选择器结构**保证（08 §5「选中、确认与展开优先于悬停」）：悬停规则显式排除三种持久态，
   选中 + 悬停自成一档；不比特异度、不用 !important。此前悬停规则靶特异度压过展开规则，展开行一被悬停
   就退到悬停档（2026-09-22 实测：展开 = 悬停 = 91.67）。
   选中在两端是同一个事实、两种拼法：平台的行是 div 网格、写 aria-selected；Trade 的行是 `<table>` 里的
   `<tr>`，ARIA 只允许 grid/treegrid 的行带 aria-selected，所以写 data-selected。 */
@media (hover: hover) {
  .zml-combo-row:not([aria-selected="true"], [data-selected="true"], [data-combo-expanded="true"], [data-combo-confirmed="true"]):hover {
    --zml-data-row-surface: var(--zml-combo-hover-surface);
  }
  .zml-combo-row:is([aria-selected="true"], [data-selected="true"]):hover {
    --zml-data-row-surface: var(--zml-combo-selected-hover-surface);
  }
}
.zml-combo-row:is([data-combo-expanded="true"], [data-combo-confirmed="true"]):not([aria-selected="true"], [data-selected="true"]) {
  --zml-data-row-surface: var(--zml-combo-current-surface);
}
.zml-combo-row:is([aria-selected="true"], [data-selected="true"]) {
  --zml-data-row-surface: var(--zml-combo-selected-surface);
}
.zml-combo-row:focus-visible {
  outline: var(--border-width-focus) solid var(--ring);
  outline-offset: calc(-1 * var(--border-width-focus));
}

/* 消息列两行（08 §4.2「消息是状态加正文」）：上行状态词、下行动作与消息正文，**两行不是三行**；
   两行在组合行高内居中，不参与虚拟行增高，正文的出现与清空不改行高、也不改状态词的位置。
   **两条轨，不是一条高两倍的轨**（2026-09-22）：`calc(--zml-message-line * 2)` 声明的是
   **一条 28 的轨**，statusRoot 独占它，正文掉进隐式 auto 轨。后果是两条同根的：
     · 正文只剩隐式那一条（实测 16），`-webkit-line-clamp: 2` 的省略号落在第 2 行、而第 2 行在
       可视框外——于是是**硬切不是截断**，静息态看不出被裁（实测 scrollHeight 28 / clientHeight 16），
       挂单价、数量这类执行读数被整段吞掉；
     · 格内容高随正文有无在 28↔44 之间变，align-content: center 把差值均分到上下，状态词随之
       位移 7~8px（实测 top 8 ↔ 1、0）；一整屏消息此起彼伏，读起来就是「整个组合在抖」。
   正文全文走它已有的委托式悬浮，不靠把格撑高来读全。 */
.zml-data-message-cell {
  --zml-message-line: var(--data-message-row);
  grid-template-rows: repeat(2, var(--zml-message-line));
  align-content: center;
  padding-block: 0;
  overflow: hidden;
  font-size: var(--type-workbench-secondary);
  line-height: var(--zml-message-line);
}
.zml-data-message-text {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  /* 正文占两行里的下面那一行，所以 clamp 是 1：clamp 档必须等于正文真正拿到的轨数，
     大于它省略号就画在框外，等于没有截断记号。 */
  -webkit-line-clamp: 1;
  overflow: hidden;
  overflow-wrap: anywhere;
  max-height: var(--zml-message-line);
}
/* 事件闪烁（Trade 主表，08 §12「热路径」例外）：只在离散事件上闪一次——开仓 / 平仓成交改写数量、均价、实开、
   累计盈亏——每 tick 都在变的行情、价差、名义、预计不闪。只动底色（不动几何、不触发布局），
   `--motion-event-flash` 线性衰减回静止档；同一格两次闪烁至少隔 300ms（触发端合并）。
   a / b 两条同形关键帧交替：换 animation-name 即重启动画，触发端不需要强制重排。
   减少动效下不做渐变：底色静态显示同样时长后由触发端移除属性（颜色变化不属于运动）。 */
@keyframes zml-fill-flash-a {
  from { background-color: color-mix(in srgb, var(--primary) 28%, transparent); }
  to { background-color: transparent; }
}
@keyframes zml-fill-flash-b {
  from { background-color: color-mix(in srgb, var(--primary) 28%, transparent); }
  to { background-color: transparent; }
}
[data-zml-flash] { border-radius: var(--radius-micro, 2px); }
[data-zml-flash="a"] { animation: zml-fill-flash-a var(--motion-event-flash) linear; }
[data-zml-flash="b"] { animation: zml-fill-flash-b var(--motion-event-flash) linear; }
@media (prefers-reduced-motion: reduce) {
  [data-zml-flash] { animation: none; background-color: color-mix(in srgb, var(--primary) 18%, transparent); }
}
/* 统计图首次揭开（08 §12 例外，patterns/chart-reveal）：整块绘图面从左往右揭开一次，只动 clip-path——
   数据、刻度与准星从第一帧就是终值，不做柱子逐根长出。属性只在首次打开时写一次，切换期间不重播。 */
@keyframes zml-chart-reveal {
  from { clip-path: inset(0 100% 0 0); }
  to { clip-path: inset(0 0 0 0); }
}
[data-chart-reveal="play"] { animation: zml-chart-reveal var(--motion-chart-reveal) var(--ease-emphasized) both; }
@media (prefers-reduced-motion: reduce) {
  [data-chart-reveal="play"] { animation: none; }
}

/* 指针拖动手势期（primitives/pointer-drag，08 §22）：手势里指针会离开载体，所以选择与光标要在整页关掉 / 统一。
   属性由引擎在阈值达成时写、结束时删；空闲时这些规则不命中任何元素。 */
html[data-pointer-drag] { user-select: none; -webkit-user-select: none; }
html[data-pointer-drag="col-resize"], html[data-pointer-drag="col-resize"] * { cursor: col-resize !important; }
html[data-pointer-drag="grabbing"], html[data-pointer-drag="grabbing"] * { cursor: grabbing !important; }

/* 列头的两种拖动（patterns/table-column-interaction，08 §22）。
   把手骑在列界上：8px 跨两列、整表头高；静止不画，指到 / 拖动时那条列界线抬到强边 2px。
   粗指针命中面 16px（触摸列宽仍可拖，touch-action 由把手自己关）。 */
.zml-column-resize-handle {
  position: absolute; inset-block: 0; inset-inline-end: calc(-1 * var(--zml-column-handle-width, 8px) / 2);
  width: var(--zml-column-handle-width, 8px); z-index: var(--z-raised);
  cursor: col-resize; touch-action: none; user-select: none; -webkit-user-select: none;
}
.zml-column-resize-handle::after {
  content: ""; position: absolute; inset-block: 0; inset-inline-start: calc(50% - 1px); width: 2px;
  background: var(--border-strong); opacity: 0; transition: opacity var(--motion-micro) var(--ease-standard);
}
.zml-column-resize-handle:hover::after, .zml-column-resize-handle[data-dragging="true"]::after { opacity: 1; }
@media (any-pointer: coarse) { .zml-column-resize-handle { --zml-column-handle-width: 16px; } }
/* 拖动期间贯穿可视表高的引导线 / 插入线：一个元素、只改 transform，不动任何行。 */
.zml-column-guide {
  position: fixed; top: 0; left: 0; width: 2px; pointer-events: none; z-index: var(--z-floating);
  background: var(--foreground); will-change: transform;
}
/* 重排源列在原位变淡；幽灵是列头格的克隆，跟指针走。 */
[data-column-drag-source="true"] { opacity: 0.4; }
.zml-column-ghost {
  position: fixed; top: 0; left: 0; pointer-events: none; z-index: var(--z-floating); opacity: 0.92;
  background: var(--work-surface); box-shadow: var(--shadow-floating); border-radius: var(--radius-control);
  will-change: transform; overflow: hidden;
}
@media (forced-colors: active) {
  .zml-column-resize-handle::after, .zml-column-guide { background: Highlight; }
  .zml-column-ghost { outline: var(--border-width-control) solid CanvasText; }
}
/* 行首实色轨的**唯一 owner**（2026-09-23 收口）：带 `data-row-rail` 的格用自己的 ::before 画一条实色条，
   颜色 / 宽度 / 高对比色由所在行的状态经三颗自定义属性下发，格只声明「我是承载轨的那一格」。
   - 载体是伪元素而不是 inset box-shadow：forced-colors 下 UA 把 box-shadow 强制成 none，此前控制轨与
     「告警 + 控制」的 5px 轨在高对比下永不出现，而写给它们的 forced-colors 规则同样是 box-shadow（假生效）；
     box-shadow 也没有逻辑方向，RTL 要靠 `[dir="rtl"]` 祖先选择器手工镜像，在恒为 LTR 的表格区域里反而画错边。
   - 逻辑方向（inset-inline-start），跟随格所在区域的实际方向。
   - 格必须是定位元素（粘性冻结格天然是；普通格由调用点给 relative）。
   - forced-colors：只在状态下发了 `--zml-row-rail-forced` 时画，取系统色，不跟作者色。 */
[data-row-rail]::before {
  content: "";
  position: absolute;
  inset-block: 0;
  inset-inline-start: 0;
  inline-size: var(--zml-row-rail-width, 2px);
  background: var(--zml-row-rail-color, transparent);
  pointer-events: none;
}
@media (forced-colors: active) {
  [data-row-rail]::before {
    forced-color-adjust: none;
    background: var(--zml-row-rail-forced, transparent);
  }
}
/* 行首指示轨（Trade 主表，08 §4.2）：控制态是用户的开关——只减仓 warning、停止灰、出错风险色，运行不着色；
   红只留给出错，所以看到红一定是要处理的事。轨是一条 2px 细线，画在冻结的选择格起始缘，横滚不动；
   状态词本身仍在消息列上行，轨只是余光里的提醒，不承担识读。
   告警边轨（3px）与控制轨并存时控制轨加宽到 5px，露出边轨内侧 2px，不互相吃掉。 */
.zml-combo-row[data-combo-control="reduce"] { --zml-row-rail-color: var(--risk); --zml-row-rail-forced: CanvasText; }
.zml-combo-row[data-combo-control="stop"] { --zml-row-rail-color: var(--muted-foreground); --zml-row-rail-forced: CanvasText; }
.zml-combo-row[data-combo-control="error"] { --zml-row-rail-color: var(--status-error); --zml-row-rail-forced: CanvasText; }
.zml-combo-row[data-alert="true"][data-combo-control] { --zml-row-rail-width: 5px; }
.zml-data-message-text[hidden] { display: none; }

/* 告警行态（08 §5 / §22 提醒表面）：两张组合主表共用，成员只写 data-alert，不另写颜色。
   标红是持续状态：提醒成立即出现、解除即退，没有开关也没有节奏。三个载体各管一件事——
   ① 3px 边轨（.zml-data-row-alert）是身份，实色不动，高对比下唯一保留；
   ② 行底色层只说「这一行在报」，**固定**在一个过 AA 的档（--zml-data-row-alert-mix，注册过的自定义属性），
      叠在斑马 / 悬停 / 选中之上而不替换它们（background-image 一层，底色仍由各态 owner 画），
      所以选中的告警行读作「选中 + 告警」，不是二选一；每帧只重绘这几行的底色，不重排；
   ③ 「还在报」由**边轨呼吸**表达，不由底色表达（2026-09-20 用户裁定，理由见下方那段）：
      边轨不承载任何文字，在它身上跑 opacity 呼吸的对比代价是零。
      进场是底色从 0 涨到静态档 + 边轨淡入，解除时两者各自淡出，成员回收行时才摘掉属性。
   全表同相位：成员在行进入告警态时把**边轨**呼吸动画的 startTime 对齐到文档时间轴的下一个整周期
   （点燃期之后并入；行尚未入树或仍 hidden 时动画还不存在，助手会在下一帧重试），
   几十行同时告警也读作一次呼吸。助手必须按边轨的 keyframes 名找、且要 getAnimations({subtree:true})——
   呼吸从行搬到边轨那一轮漏了这两处，整条同相位静默失效过一次。
   reduced-motion 下不点燃、不呼吸：成立瞬间出现、解除瞬间消失（两态各写一条，写成 [data-alert] 会把
   解除也钉成常显）。forced-colors 下没有底色层，且边轨的呼吸必须显式关掉——opacity 动画不受
   forced-colors 影响，不关会让 CanvasText 的轨一直闪，与「实色不动」相反。
   行态只有「成立 / 刚解除 / 无」三值：条件满足但持续时长仍在计时的中间态不进表面（2026-09-20 用户决定），
   原因是它按门槛抖动进出，而第三行告警带按条数增高，一次进出就把整表几何推一遍。
   Trade 同一起始缘另有 2px 控制轨（行首实色轨，见上）：两者并存时控制轨加宽到 5px，露出边轨内侧 2px，不互相吃掉。 */
@property --zml-data-row-alert-mix {
  syntax: '<percentage>';
  inherits: true;
  initial-value: 0%;
}
.zml-data-row,
.zml-combo-row {
  --zml-data-row-alert-mix: 0%;
  --zml-data-row-alert-fill: color-mix(in srgb, var(--data-alert-color) var(--zml-data-row-alert-mix), transparent);
}
.zml-data-row[data-alert],
.zml-combo-row[data-alert] > :is(th, td) {
  background-image: linear-gradient(var(--zml-data-row-alert-fill), var(--zml-data-row-alert-fill));
}
.zml-data-row[data-alert="false"],
.zml-combo-row[data-alert="false"] {
  animation: zml-data-row-alert-release var(--motion-out) var(--ease-move) both;
}
/*
 * **呼吸在边轨上，不在行底色上**（2026-09-20 用户裁定）。
 *
 * 原设计让行底色在 12%↔18% 之间呼吸、成立那刻先冲到 32%。实测这三个值都把行内文字压破 AA：
 * 18% 峰值下 Trade 浅 3.725 / 暗 4.309，平台浅 2.879 / 暗 3.309；连 12% 的下限在浅色下也只有
 * 4.259。合同本来就写了「每一档的上限由 AA 定，够不到就压低这一档」，但浅色下**压不出**一个
 * 既过 AA 又「一眼可辨」的值：8% 时 AA 4.557 而 ΔL* 只有 5.0，10% 时 ΔL* 6.5 而 AA 掉到 4.368，
 * 两个区间没有交集——瓶颈是底色与文字在同一块面上抢同一份明度差。
 *
 * 出路是换载体而不是在两个信号之间二选一：3px 实色边轨**不承载任何文字**，在它身上呼吸的
 * 对比代价是零。所以底色固定在一个过 AA 的值、只负责「这一行在报」，边轨负责「还在报」。
 * 边轨本来就是合同指定的身份载体（高对比模式下唯一保留的那个），职责没有新增。
 * 进场也从「先冲深再回落」改成「从 0 涨到静态值」：原来那 320ms 的 32% 是一段确定破 AA 的时间，
 * 而它要表达的「捕捉到新报警」现在由边轨的进场承担。
 */
.zml-data-row[data-alert="true"],
.zml-combo-row[data-alert="true"] {
  --zml-data-row-alert-mix: 12%;
  animation: zml-data-row-alert-ignite var(--motion-alert-ignite) var(--ease-emphasized) both;
}
@keyframes zml-data-row-alert-ignite {
  from { --zml-data-row-alert-mix: 0%; }
  to { --zml-data-row-alert-mix: 12%; }
}
@keyframes zml-data-row-alert-release {
  from { --zml-data-row-alert-mix: 12%; }
  to { --zml-data-row-alert-mix: 0%; }
}
.zml-data-row-alert {
  print-color-adjust: exact;
}
/* 「还在报」的载体：边轨自己呼吸。透明度动画跑在合成层上，不重排、不重绘行内文字，
   也不改变任何文字所在的底色，所以它不受 AA 约束——这正是把呼吸从底色搬过来的理由。 */
.zml-data-row[data-alert="true"] .zml-data-row-alert,
.zml-combo-row[data-alert="true"] .zml-data-row-alert {
  animation:
    zml-alert-rail-ignite var(--motion-alert-ignite) var(--ease-emphasized) both,
    zml-alert-rail-breathe var(--motion-pulse-slow) var(--ease-move) var(--motion-alert-ignite) infinite;
}
.zml-data-row[data-alert="false"] .zml-data-row-alert,
.zml-combo-row[data-alert="false"] .zml-data-row-alert {
  animation: zml-alert-rail-release var(--motion-out) var(--ease-move) both;
}
@keyframes zml-alert-rail-ignite { from { opacity: 0; } to { opacity: 1; } }
@keyframes zml-alert-rail-breathe { 0%, 100% { opacity: 1; } 50% { opacity: 0.45; } }
@keyframes zml-alert-rail-release { from { opacity: 1; } to { opacity: 0; } }
@media (prefers-reduced-motion: reduce) {
  .zml-data-row[data-alert],
  .zml-combo-row[data-alert] { animation: none; }
  /* 边轨接过呼吸之后，静止档也必须跟着接过来：只停行上的动画会留下一条还在呼吸的轨。
     **成立与解除要分开写**：写成 [data-alert] 会连 "false" 一起盖住，把淡出动画也停掉并钉死
     opacity: 1——已解除的行会永远挂着一条告警轨，直到成员回收它，与 §5「解除即退」相反。
     静止档要的是「瞬间出现 / 瞬间消失」，不是「不消失」。 */
  .zml-data-row[data-alert="true"] .zml-data-row-alert,
  .zml-combo-row[data-alert="true"] .zml-data-row-alert { animation: none; opacity: 1; }
  .zml-data-row[data-alert="false"] .zml-data-row-alert,
  .zml-combo-row[data-alert="false"] .zml-data-row-alert { animation: none; opacity: 0; }
}
@media (forced-colors: active) {
  .zml-data-row[data-alert],
  .zml-combo-row[data-alert] > :is(th, td) { background-image: none; }
  /* 高对比：实色轨改用系统前景色，UA 会抹掉非 url() 背景图，所以显式重画。
     **并且必须关掉呼吸**：改造前呼吸跑在行底色上，本块的 `background-image: none` 顺手把它一起杀了；
     改造后呼吸是 opacity 动画，forced-colors 不碰 opacity，于是 CanvasText 的轨会在 1↔0.45 之间循环闪。
     §5 与本文件都写着「实色不动，高对比下唯一保留的载体」——它得既实色又不动。 */
  .zml-data-row[data-alert] .zml-data-row-alert,
  .zml-combo-row[data-alert] .zml-data-row-alert { animation: none; }
  .zml-data-row[data-alert="true"] .zml-data-row-alert,
  .zml-combo-row[data-alert="true"] .zml-data-row-alert { background: CanvasText; opacity: 1; }
  .zml-data-row[data-alert="false"] .zml-data-row-alert,
  .zml-combo-row[data-alert="false"] .zml-data-row-alert { opacity: 0; }
}
@media (forced-colors: active) {
  .zml-data-row[data-alert="true"],
  .zml-combo-row[data-alert="true"] > :is(th, td) { background-image: none; }
}

/* .zml-data-row 自己不再声明悬停 / 选中：它唯一的现役载体就是组合行，行态归上面的 .zml-combo-row 行态块；
   此前这里的选中直接吃 :root 的绝对色 --control-selected，在斑马行上与静息同色（浅 ΔL* 0.03、暗反向 −0.9）。 */

.zml-data-row[data-focused="true"] {
  outline: var(--focus-ring-outline);
  outline-offset: var(--focus-offset-clipped);
}

.zml-data-row[data-stale="true"] .zml-data-numeric {
  text-decoration-line: underline;
  text-decoration-style: dotted;
  /* 浅色下满色点线一屏几十处读成噪音（2026-09-17 视觉审阅）：浅色弱化到 45%，深色保持满色。 */
  text-decoration-color: color-mix(in srgb, var(--status-stale) 45%, transparent);
  text-underline-offset: var(--space-inline-compact);
}
.dark .zml-data-row[data-stale="true"] .zml-data-numeric {
  text-decoration-color: var(--status-stale);
}

@media (forced-colors: active) {
  /* 列线与冻结承重边（div 网格那一支的格尾伪元素）：UA 会把作者背景色压成 Canvas，线就没了；显式取系统色。 */
  .zml-combo-row :is([role="cell"], [role="gridcell"]):not(.zml-combo-drawer-band *)::after {
    forced-color-adjust: none;
    background: GrayText;
  }
  .zml-combo-row :is([role="cell"], [role="gridcell"])[data-combo-frozen-edge="true"]::after { background: CanvasText; }
  .zml-combo-row { --zml-data-row-surface: Canvas; }
  .zml-combo-row:is([aria-selected="true"], [data-selected="true"], [data-combo-confirmed="true"]) {
    --zml-data-row-surface: Highlight;
    forced-color-adjust: none;
    color: HighlightText;
  }
  /* System Highlight can be translucent; the Canvas base keeps sticky cells opaque. */
  .zml-combo-row:is([aria-selected="true"], [data-selected="true"], [data-combo-confirmed="true"]) > :is(th, td) { background: linear-gradient(Highlight, Highlight) Canvas; }
  .zml-combo-row:is([aria-selected="true"], [data-selected="true"], [data-combo-confirmed="true"]) > :is(th, td) :where(*):not(.zml-data-row-alert) { color: HighlightText; background-color: transparent !important; }
  .zml-combo-row:is([aria-selected="true"], [data-selected="true"], [data-combo-confirmed="true"]) .zml-data-row-alert { background-color: HighlightText; }
  .zml-data-row, .zml-data-row[data-row-stripe] { background-color: Canvas; }
  .zml-data-row[aria-selected="true"] { background-color: Highlight; color: HighlightText; }
  .zml-data-row[aria-selected="true"] :where(*) { color: HighlightText; }
  .zml-data-row-alert { background-color: CanvasText; }
  .zml-data-row[aria-selected="true"] .zml-data-row-alert { background-color: HighlightText; }
  .zml-data-row[data-stale="true"] .zml-data-numeric { text-decoration-color: CanvasText; }
  .zml-data-row[aria-selected="true"][data-stale="true"] .zml-data-numeric { text-decoration-color: HighlightText; }
}

@media (forced-colors: active) {
  :root {
    --focus-ring-width: 2px;
    --focus-ring-color: Highlight;
  }

  /* Current destinations use one system palette across members. Keeping auto
     adjustment on the link allows Chrome's text backplate to cover its nested
     label with Canvas while the inherited text remains HighlightText. */
  :is(a, button)[aria-current="page"] {
    background: Highlight;
    color: HighlightText;
    forced-color-adjust: none;
  }
  :is(a, button)[aria-current="page"] :where(*) {
    color: HighlightText;
  }
}

/*
 * 高对比下的状态标记形状编码 —— 唯一 owner。
 *
 * 强制配色把 `color` / `background-color` / `border-color` / `outline-color` 一起换成
 * 用户调色板里的同一批系统色，于是「一组颜色枚举 + 一颗圆点」这套编码整条塌掉：八档
 * 运行健康塌成一个 CanvasText，成员的金融方向档同样塌成一个。**颜色不再可用时，状态
 * 只能改由形状承载**——这是一条无障碍合同，不是配色，所以它跟焦点环、滚动条一样住在
 * 全局规则层，新成员自动继承。
 *
 * 两端此前各写一份（ZML 平台 `[data-status][aria-hidden="true"]`、ZML Trade
 * `[data-status-dot-mark][data-status-dot-tone]`），逐档实测比对后收到这里：
 *   · warning（空心 + 虚线 CanvasText + offset 1）两端**逐值相同**；
 *   · ZML 平台 `error` 与 ZML Trade `danger`（实线 CanvasText + offset 1）**逐值相同**；
 *   · 唯一分歧是灰环偏移：ZML 平台 `idle` 用 `outline-offset: 1px`，ZML Trade `muted` /
 *     `unknown` 用 `-1px`。取 `1px`——同一张表里其余带环档全是外环 1px，混着用会让
 *     灰档的墨迹外缘比相邻档小 2px，读成「同一颗点忽大忽小」。实测 ZML Trade 数据格
 *     （`overflow: hidden` 的 td）左侧留白 8px、上侧 4px，外环只需要 2px，不会被裁。
 * 并成一份之后才看得见两边各缺什么：ZML 平台的 `stale` / `offline` / `unknown` 三档
 * **完全没有规则**，实测与 `healthy` 同为实心 CanvasText——「离线」和「健康」在高对比下
 * 长得一模一样。这里按同一套判别式补齐。
 *
 * 判别式是三条正交轴，不引入第四条：
 *   · 填充：实心 CanvasText =「系统认为它在正常跑」，空心 Canvas =「没在正常跑」；
 *   · 描边样式：solid > dashed > dotted，越实越响；
 *   · 描边角色色：CanvasText = 当前有效，GrayText = 系统调色板里的「非活动」角色
 *     （那是一个角色，不是一次色相选择）。
 * 八档由此两两可分，且**几何不随状态变**：全部走 `outline`（不占布局）与 `border-style`
 * （不改边宽），实测标记盒在八档下恒为 6×6。
 *
 * 成员词表映射（ZML Trade tone → 本表档位）：warning → warning、danger → error、
 * muted → idle、unknown → unknown。**金融方向档（profit / loss / long / short /
 * venue / funding / …）刻意不给形状**，落在基档的实心 CanvasText 上：涨跌方向不是
 * 一种「健康度」，高对比下也没有第二条通道能表达它，硬编一个形状只会让它被读成状态。
 * 方向信息在这里由数值本身与符号承担（族律见 primitives/status-indicator-variants.ts）。
 *
 * 本块与本文件其它 forced-colors 块一样**不进 cascade layer**：Tailwind 工具类住在
 * `@layer utilities`，无层规则整体压过它，所以填充与描边都不需要 `!important`。
 * 唯一的例外是 `box-shadow`：成员那圈 26% 发丝环是同为无层、且特异度相同的规则
 * （成员 CSS 在 tokens.css 之后导入，平手时它赢），只能用 `!important` 清掉——
 * 那圈环读的是被替换掉的作者色，留着等于在系统底色上画一圈同色噪声。
 */
@media (forced-colors: active) {
  /* 基档：实心。ZML Trade 的方向档与 ZML 平台的 healthy 都停在这里。 */
  [data-status][aria-hidden="true"],
  [data-status-dot-mark] {
    background: CanvasText;
    box-shadow: none !important;
  }

  /* 实心 + 点线：正在进行。 */
  [data-status="active"][aria-hidden="true"] {
    outline: 1px dotted CanvasText;
    outline-offset: 1px;
  }

  /* 实心 + 实线：最响一档。 */
  [data-status="error"][aria-hidden="true"],
  [data-status-dot-mark][data-status-dot-tone="danger"] {
    outline: 1px solid CanvasText;
    outline-offset: 1px;
  }

  /* 空心 + 虚线：需要注意但仍在跑。 */
  [data-status="warning"][aria-hidden="true"],
  [data-status-dot-mark][data-status-dot-tone="warning"] {
    background: Canvas;
    outline: 1px dashed CanvasText;
    outline-offset: 1px;
  }

  /* 空心 + 实线：确定不在跑。与 error 的差在填充，与 idle 的差在角色色。 */
  [data-status="offline"][aria-hidden="true"] {
    background: Canvas;
    outline: 1px solid CanvasText;
    outline-offset: 1px;
  }

  /* 空心 + 灰虚线：快照可能过期——不是告警，是「这份数据不是当前的」。 */
  [data-status="stale"][aria-hidden="true"] {
    background: Canvas;
    outline: 1px dashed GrayText;
    outline-offset: 1px;
  }

  /* 空心 + 灰实线：闲置。 */
  [data-status="idle"][aria-hidden="true"],
  [data-status-dot-mark][data-status-dot-tone="muted"] {
    background: Canvas;
    outline: 1px solid GrayText;
    outline-offset: 1px;
  }

  /* 空心 + 灰点线：没有结论。与 idle 的差在样式，两者都不该读成一个判断。 */
  [data-status="unknown"][aria-hidden="true"],
  [data-status-dot-mark][data-status-dot-tone="unknown"] {
    background: Canvas;
    outline: 1px dotted GrayText;
    outline-offset: 1px;
  }

  /*
   * 状态徽标走同一张判别表，只是没有「填充」这条轴（pill 面整块是 Canvas），
   * 于是最响的两档改由**外框重数**表达：`border` 之外再套一圈 `outline`。
   * 徽标与点的唯一稳定区分位是 `aria-hidden`——点有，徽标没有，不需要组件侧配合。
   *
   * `soft` 变体的边是 `border-transparent`，而 `transparent` **不**被强制替换：
   * 不显式给边色，徽标在高对比下连框都没有。
   */
  [data-status]:not([aria-hidden="true"]) {
    border-color: CanvasText;
    border-style: solid;
  }

  [data-status="active"]:not([aria-hidden="true"]) {
    border-style: dotted;
  }

  [data-status="warning"]:not([aria-hidden="true"]) {
    border-style: dashed;
  }

  [data-status="error"]:not([aria-hidden="true"]),
  [data-status="offline"]:not([aria-hidden="true"]) {
    outline: 1px solid CanvasText;
    outline-offset: 1px;
  }

  [data-status="offline"]:not([aria-hidden="true"]) {
    border-style: dashed;
  }

  [data-status="stale"]:not([aria-hidden="true"]) {
    border-color: GrayText;
    border-style: dashed;
  }

  [data-status="idle"]:not([aria-hidden="true"]) {
    border-color: GrayText;
    color: GrayText;
  }

  [data-status="unknown"]:not([aria-hidden="true"]) {
    border-color: GrayText;
    border-style: dotted;
    color: GrayText;
  }
}

/*
 * 主题换代抑制（`data-theme-transition="suppressed"`）。
 *
 * Light 与 Dark 是两套各自实测的取值，不是一套的反色。换代那一刻若组件自己的
 * hover / pressed / focus 过渡还开着，浏览器会在两套 token 之间**插值**，闪出一个
 * 两者都不是的中间色。共享 ThemeProvider 在换代时把这枚属性挂到根上、跨过新世代
 * 被真正绘制的那一帧后摘掉。
 *
 * **属性由共享层落，规则此前却由两个成员各写一份**——同一条机制两处维护，
 * 而且缺了规则那枚属性就只是个没人读的标记（合并主题 Provider 时实测到一端本来就没有）。
 * 现在收到这里：属性与规则同一个 owner。
 *
 * 只压时长与延迟、**不写 `transition: none`**：抑制窗口内可能有浮层正等着
 * `transitionend` 结算退场，整条关掉会把它们永久挂在过渡中。
 */
html[data-theme-transition="suppressed"],
html[data-theme-transition="suppressed"] *,
html[data-theme-transition="suppressed"] *::before,
html[data-theme-transition="suppressed"] *::after {
  transition-delay: 0s !important;
  transition-duration: 0s !important;
}

/*
 * 高对比偏好下的环宽。与上面的 forced-colors 档同值同理由：1px 的环在提高
 * 对比度的偏好下不再是一条可靠的键盘位置信号。环宽是本文件拥有的焦点合同的
 * 一部分，两端此前各写一份 2px，属于同一事实的两处维护。
 * 高对比**色轴**不收：ZML Trade 重指的是 --control-* / --field-border-* 阶梯，
 * ZML 平台重指的是 --material-* 阶梯，两族 token 本就分属各自成员，
 * 且 color-mix 的混合空间与基准色都不同，强行合并会让某一端出现可见色差。
 */
@media (prefers-contrast: more) {
  :root {
    --focus-ring-width: 2px;
  }
}

.zml-form-section { container: zml-form / inline-size; display: grid; gap: var(--form-section-content-gap); }
[data-slot="field-grid"] > [data-slot="field-cluster"] { display: grid; grid-column: span var(--field-cluster-span, 2); grid-template-columns: subgrid; }
@container zml-form (width < 15.5rem) { [data-slot="field-grid"] > [data-slot="field-cluster"] { display: contents; } }
.zml-form-section[data-divided] { border-block-start: 1px solid var(--overlay-divider); padding-block-start: var(--space-section-compact); }
.zml-form-section-header { display: grid; grid-template-areas: "title actions"; grid-template-columns: minmax(0,1fr) auto; align-items: center; gap: var(--space-inline-standard); }
.zml-form-section-header[data-has-presets="true"] { grid-template-areas: "title actions" "presets presets"; }
.zml-form-section-title { grid-area: title; }
.zml-form-section-presets { grid-area: presets; min-width: 0; display: flex; flex-wrap: wrap; gap: var(--space-inline-compact); }
.zml-form-section-actions { grid-area: actions; display: flex; flex-wrap: wrap; justify-content: end; gap: var(--space-inline-compact); }
.zml-form-section-body { display: grid; min-width: 0; gap: var(--form-section-content-gap); }
.zml-form-live-region { margin: 0; min-height: 0; }
.zml-form-section-body > .zml-form-live-region:empty:not(:first-child) { margin-block-start: calc(-1*var(--form-section-content-gap)); }
@container zml-form (min-width: 36rem) {
  .zml-form-section-header[data-has-presets="true"] { grid-template-areas: "title presets actions"; grid-template-columns: auto minmax(0,1fr) auto; }
}

/* 比较矩阵：固定身份、行态、热度和统计行共享；热度值与最优腿仍由业务引擎提供。 */
.zml-data-matrix {
  /* 底色只承载幅度判断：**一种色相**（主色，不分正负——费率是市场事实，不是盈亏结论），同币种行内按幅度
     分四档由浅到深，行内幅度最小的格与面同底（quiet 0%）。数字一律中性；最优多 / 空所由格内周期行前的
     「多 / 空」字标出，不靠颜色，也不另垫底色或竖线。

     **2026-09-21 两处更正：**
     ① `extreme` 原值 6% 与 `strong` 逐位相同——选择器把 p13/p14 映到 strong、p15 映到 extreme，
        结构上是四档，值上只给了三档，于是 p15 在屏幕上与 p13/p14 无法区分。名字声明了几档就画几档。
     ② 坡也偏轻：原 0→9% 实测最大 ΔL* 浅 3.91 / 暗 4.05。现取 0 / 4 / 8 / 12 / 16，
        实测最大 |ΔL*| 浅 **5.15** / 暗 **6.06**，相邻档约 2.4，逐档可分。
        上限由格内 12px 文字的 AA 封顶——实测最低 **6.34**（浅）/ **5.81**（暗），离 4.5 还有余量。

     **别把这条写成「跨度要 ≥ 某条线的 N 倍」**：一条 1px 发线与一整片底色的 ΔL* 不可直接相比，
     同样的数值，面积一大就强得多。本轮初稿正是这么定的，随后被自己证伪——可站住的判据只有
     「**每一档与相邻档 ΔL* ≥ 1.0，且有自己名字的档不得与另一档渲染成同色**」。 */
  --data-heat-quiet: 0%;
  --data-heat-medium: 4%;
  --data-heat-strong: 8%;
  --data-heat-extreme: 12%;
  --data-heat-maximum: 16%;
}
.zml-data-matrix [data-funding-row] { --funding-row-fill: var(--work-surface); background-color: transparent; }
.zml-data-matrix [data-funding-row], .zml-data-matrix [data-funding-identity] { border-bottom: 0; }
/* 粘列身份永远吃工作面：悬停/选中走 ::before，不能把 --funding-row-fill 铺满，否则 Linear 的 inset 8 / r8 会塌成整格。 */
/* 冻结身份格是不透明单元：底色跟宿主面声明的填充（08 §10），不自己挑 --work-surface——否则矩阵落在别的面里就是一块异色板。 */
.zml-data-matrix [data-funding-identity] { isolation: isolate; background-color: var(--zml-table-surface, var(--work-surface)); border-inline-end: var(--border-width-hairline) solid var(--border); }
.zml-data-matrix-seam { border-inline-end: var(--border-width-hairline) solid var(--border); }
/*
 * 行态层对齐 Linear issue ::before：inset-inline 8、radius 8、z-index -1。
 * 填充走行档 --row-fill-*，不借用控件/冻结面的 --control-hover / --control-selected。
 * 身份列只做左帽（end 0、右侧不圆），和数据行在粘列接缝处齐缝。
 */
.zml-data-matrix [data-funding-row]::before,
.zml-data-matrix [data-funding-identity]::before {
  content: "";
  position: absolute;
  inset-block: 0;
  inset-inline: var(--space-inline-standard);
  z-index: -1;
  pointer-events: none;
  border-radius: var(--radius-control);
  background: var(--row-fill-hover);
  opacity: 0;
}
.zml-data-matrix [data-funding-identity]::before {
  inset-inline-end: 0;
  border-start-end-radius: 0;
  border-end-end-radius: 0;
}
.zml-data-matrix [data-hovered="true"] { --funding-row-fill: var(--row-fill-hover); }
.zml-data-matrix [data-hovered="true"]::before { opacity: 1; }
@media (hover: hover) {
  .zml-data-matrix [data-funding-row]:hover,
  .zml-data-matrix [data-funding-identity]:hover { --funding-row-fill: var(--row-fill-hover); }
  .zml-data-matrix [data-funding-row]:hover::before,
  .zml-data-matrix [data-funding-identity]:hover::before { opacity: 1; }
}
.zml-data-matrix :is([data-funding-row],[data-funding-identity])[aria-selected="true"] { --funding-row-fill: var(--row-fill-selected); }
.zml-data-matrix :is([data-funding-row],[data-funding-identity])[aria-selected="true"]::before {
  background: var(--row-fill-selected);
  opacity: 1;
}
.zml-data-matrix :is([data-funding-row],[data-funding-identity])[aria-selected="true"][data-hovered="true"] { --funding-row-fill: var(--row-fill-selected-hover); }
.zml-data-matrix :is([data-funding-row],[data-funding-identity])[aria-selected="true"][data-hovered="true"]::before { background: var(--row-fill-selected-hover); }
@media (hover: hover) {
  .zml-data-matrix :is([data-funding-row],[data-funding-identity])[aria-selected="true"]:hover { --funding-row-fill: var(--row-fill-selected-hover); }
  .zml-data-matrix :is([data-funding-row],[data-funding-identity])[aria-selected="true"]:hover::before { background: var(--row-fill-selected-hover); }
}
/* 矩阵表头是 12px chrome：行盒取 `--type-workbench-secondary-line`（2026-09-21，原因见「行盒与 CJK」）。
 * Linear Display「Grouping」/ All-issues「Jun 14」同档。盒高仍 32（矩阵 `--table-header`）。 */
.zml-data-matrix-heading { padding-inline: clamp(0px,calc(var(--funding-venue-width)/4),var(--space-inline-compact)); font-size: var(--type-workbench-secondary); line-height: var(--type-workbench-secondary-line); font-weight: var(--font-weight-medium); }
.zml-data-matrix-cell {
  /*
   * 格内内容高 = 值行 + N 条统计行，三档都以 --type-workbench-secondary-line(16) 为基数。
   * 值行原来按 --type-workbench-primary-line(18) 算，那是它还是 13px 主档时的事；分档收口后
   * 值行降到 12/16，基数没跟着改，居中公式 (44-18)/2=13 就把内容顶高了 1px（上 13 + 内容 16
   * + 下 15）。改成 16 后是 14/16/14，正中。
   * **行高不受影响**：44 / 60 由 JS 的 fundingRowHeightForStats 算，仍读 primaryLine，
   * 与这里的格内居中解耦——所以这是纯光学修正，不是布局改动。
   */
  --data-matrix-content-height: var(--type-workbench-secondary-line);
  --funding-heat-pct: var(--data-heat-quiet);
  box-sizing: border-box;
  display: block;
  padding-inline: clamp(0px,calc(var(--funding-venue-width)/4),var(--cell-inline-dense));
  padding-top: calc((var(--funding-row-height) - var(--data-matrix-content-height))/2);
}
[data-funding-stat-lines="1"] .zml-data-matrix-cell { --data-matrix-content-height: calc(2*var(--type-workbench-secondary-line)); }
[data-funding-stat-lines="2"] .zml-data-matrix-cell { --data-matrix-content-height: calc(3*var(--type-workbench-secondary-line)); }
[data-funding-stat-lines="3"] .zml-data-matrix-cell { --data-matrix-content-height: calc(4*var(--type-workbench-secondary-line)); }
.zml-data-matrix-cell[data-funding-heat] { background-color: color-mix(in srgb,var(--primary) var(--funding-heat-pct),transparent); }
.zml-data-matrix-cell[data-funding-heat="1"] { --funding-heat-pct: var(--data-heat-medium); }
.zml-data-matrix-cell[data-funding-heat="2"] { --funding-heat-pct: var(--data-heat-strong); }
.zml-data-matrix-cell[data-funding-heat="3"] { --funding-heat-pct: var(--data-heat-extreme); }
.zml-data-matrix-cell[data-funding-heat="4"] { --funding-heat-pct: var(--data-heat-maximum); }
.zml-data-matrix-cell[data-funding-adornment] { box-shadow: none; }
/* 手动压窄时明确省略，禁止数字画进相邻列；完整值仍由单格说明与币种详情承载。 */
.zml-data-matrix-value { overflow: hidden; text-overflow: ellipsis; }
.zml-data-matrix-value[data-funding-tone="foreground"] { color: var(--foreground); }
.zml-data-matrix-value[data-funding-tone="muted"] { color: var(--muted-foreground); }
/* 实时口径的结算周期（含最优腿短标）：与费率同一行、排在费率之前的次级小字，不随热度着色。 */
/* 资金费率矩阵的虚拟格把周期与统计行写成属性、由生成内容画出（每格少两个元素），与测宽用的 span 同一套字形。 */
/* 资金费率矩阵基差偏离超限：数值照写，前面一枚「待核对」短标记（原因在格的读数与提示里）。 */
[data-funding-basis-suspect]::before { content: attr(data-funding-basis-suspect); margin-inline-end: var(--space-inline-compact); color: var(--status-warning); font-size: var(--type-workbench-secondary); }
.zml-data-matrix-interval,
.zml-data-matrix-value[data-funding-interval]::before { margin-inline-end: var(--space-inline-compact); color: var(--muted-foreground); font-size: var(--type-workbench-secondary); }
.zml-data-matrix-value[data-funding-interval]::before { content: attr(data-funding-interval); }
.zml-data-matrix-cell[data-funding-stats]::after { content: attr(data-funding-stats); display: none; }
.zml-data-matrix-stats,
.zml-data-matrix-cell[data-funding-stats]::after {
  box-sizing: border-box;
  width: 100%;
  margin-top: 0;
  color: var(--muted-foreground);
  font-size: var(--type-workbench-secondary);
  font-weight: var(--font-weight-regular);
  font-variant-numeric: tabular-nums;
  line-height: var(--type-workbench-secondary-line);
  text-align: right;
  white-space: pre;
  overflow: hidden;
  text-overflow: ellipsis;
}
[data-funding-stat-lines="0"] .zml-data-matrix-stats,
[data-funding-stat-lines="0"] .zml-data-matrix-cell[data-funding-stats]::after { display: none; height: 0; }
[data-funding-stat-lines="1"] .zml-data-matrix-stats,
[data-funding-stat-lines="1"] .zml-data-matrix-cell[data-funding-stats]::after { display: block; height: var(--type-workbench-secondary-line); }
[data-funding-stat-lines="2"] .zml-data-matrix-stats,
[data-funding-stat-lines="2"] .zml-data-matrix-cell[data-funding-stats]::after { display: block; height: calc(2*var(--type-workbench-secondary-line)); }
[data-funding-stat-lines="3"] .zml-data-matrix-stats,
[data-funding-stat-lines="3"] .zml-data-matrix-cell[data-funding-stats]::after { display: block; height: calc(3*var(--type-workbench-secondary-line)); }
@media (forced-colors: active) {
  .zml-data-matrix-cell[data-funding-heat] { background-color: Canvas; }
  .zml-data-matrix :is([data-funding-row],[data-funding-identity])[aria-selected="true"] { --funding-row-fill: Highlight; color: HighlightText; background-color: Highlight; }
  .zml-data-matrix :is([data-funding-row],[data-funding-identity])[aria-selected="true"] :where(*) { color: HighlightText; }
  .zml-data-matrix [data-funding-row][aria-selected="true"] .zml-data-matrix-cell { background-color: Highlight; }
  .zml-data-matrix-value[data-funding-tone="muted"] { color: GrayText; }
  .zml-data-matrix-cell[data-funding-adornment~="best-long"] { border-inline-start: var(--focus-ring-width) solid CanvasText; }
  .zml-data-matrix-cell[data-funding-adornment~="best-short"] { border-inline-end: var(--focus-ring-width) solid CanvasText; }
  .zml-data-matrix [data-funding-row][aria-selected="true"] .zml-data-matrix-cell { border-color: HighlightText; }
}

/* Column collections keep one shared wide column axis and a complete narrow metadata flow. */
.zml-column-record-list { container: zml-column-record-list / inline-size; width: 100%; min-width: 0; }
[data-slot="column-record-grid"] { display: grid; grid-template-columns: minmax(0,1fr) max-content; column-gap: var(--space-section-compact); min-width: 0; }
.zml-column-record-row { position: relative; isolation: isolate; display: grid; grid-column: 1 / -1; grid-template-columns: subgrid; align-items: start; column-gap: inherit; row-gap: var(--space-stack-compact); min-width: 0; min-height: var(--row-single); padding: var(--space-stack-standard) var(--cell-inline); color: var(--muted-foreground); font-size: var(--type-workbench-secondary); line-height: var(--type-workbench-secondary-line); }
/*
 * 行填充走统一的 ::before 内缩层：上下贴齐、左右内缩 8、圆角 8、静止 opacity 0。
 * 原来是在行本体上铺满宽无圆角的底色，和列表行的填充通道各写各的；
 * 底色也改吃行档 --row-fill-hover，不再借用按工作面标定的 --control-hover（那颗还供冻结面）。
 */
.zml-column-record-row::before {
  content: "";
  position: absolute;
  inset-block: 0;
  inset-inline: var(--space-inline-standard);
  z-index: -1;
  border-radius: var(--radius-control);
  background: var(--row-fill-hover);
  opacity: 0;
}
.zml-column-record-row[data-interactive]:hover { cursor: pointer; }
.zml-column-record-row[data-interactive]:hover::before { opacity: 1; }
[data-slot="column-record-identity"] { grid-area: 1 / 1; display: flex; align-items: center; gap: var(--space-inline-standard); min-width: 0; overflow-wrap: anywhere; color: var(--foreground); font-size: var(--type-workbench-primary); line-height: var(--type-workbench-primary-line); font-weight: var(--font-weight-medium); }
.zml-column-record-row:not([data-has-actions]) > [data-slot="column-record-identity"] { grid-column: 1 / -1; }
[data-slot="column-record-actions"] { grid-area: 1 / 2; display: flex; flex-wrap: wrap; align-items: center; justify-content: end; gap: var(--space-inline-compact); max-width: 100%; }
[data-slot="column-record-cells"] { display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--space-stack-compact) var(--space-inline-wide); grid-column: 1 / -1; min-width: 0; }
[data-slot="column-record-cell"] { min-width: 0; overflow-wrap: anywhere; }
[data-slot="column-record-cell"][data-full-width] { flex-basis: 100%; }
[data-slot="column-record-footer"] { grid-column: 1 / -1; min-width: 0; }
@container zml-column-record-list (min-width: 56rem) {
  [data-slot="column-record-grid"] { grid-template-columns: var(--record-columns); }
  .zml-column-record-row { align-items: center; }
  .zml-column-record-row > [data-slot="column-record-identity"], .zml-column-record-row:not([data-has-actions]) > [data-slot="column-record-identity"], [data-slot="column-record-actions"] { grid-area: auto; }
  [data-slot="column-record-cells"] { display: contents; }
  [data-slot="column-record-cell"][data-align="end"] { justify-self: end; text-align: end; }
}

/* 设置窗窄档（< 768）的一级列表是去处清单，不是「当前在哪」的指示：当前项不铺选中底（审计 TE-1 / E-4）。
   宽档左栏与二级页不受影响；悬停反馈照常。 */
@container overlay-frame (max-width: 767.98px) {
  [data-settings-window][data-narrow-view="rail"] [aria-current="page"]:not(:hover) { background-color: transparent; }
}

/* Overlay frames consume the member's measured visual viewport, when available. */
[data-overlay-frame] { isolation: isolate; overscroll-behavior: none; }
[data-overlay-frame][data-closed] { pointer-events: none; }
[data-overlay-frame] [data-scroll-y-owner] {
  overflow-anchor: none;
  overscroll-behavior-y: contain;
  scroll-padding-block: var(--space-section-compact);
}
:is([data-overlay-frame] > [data-scroll-y-owner], [data-overlay-frame] [data-overlay-primary-scroll]) {
  /* 只传递实际遮挡量；正常内距由对应浮层 body 配方拥有。 */
  --overlay-keyboard-inset: var(--keyboard-occlusion);
}

/* ==========================================================================
 * 等待与揭示（08 §12、§19）——不定等待字形、结构占位、不定态进度与「出现」只在这里一处声明。
 * 消费者：primitives/loader（.zml-loader）、state-frame 与 primitives/loading-anatomy（[data-reveal]）、
 * primitives/skeleton（[data-loading-skeleton]）、primitives/proportion-rail 不定态（progress-rail*）。
 * 两端此前各存一份 progress-rail 不定态与 skeleton 的 forced-colors 规则（值曾差一档），现收口到此。
 * ========================================================================== */

/* 揭示：等待期满的状态面、静默期满的骨架、懒路由落地的内容，整块淡入一次。
   reduced 下 --motion-reveal 归 0，动画直达终值；不写 animation:none，保持 fill-mode 的终态。 */
@keyframes zml-reveal { from { opacity: 0; } to { opacity: 1; } }
/* 整块揭示是**进场**：按方向规则走强 ease-out，不用两端都缓的 --ease-standard（08 §12）。
   如实说明：80ms 下两条曲线肉眼几乎分不开，这里改的是取档一致性，不是可见缺陷。 */
[data-reveal] { animation: zml-reveal var(--motion-reveal) var(--ease-emphasized) both; }

/* 后台刷新：有快照时的重读不画骨架、转圈或「加载中」，只让已有内容略降不透明度——而且只在刷新拖过静默期
   （1 秒，与首载同一个计时）之后；一秒内完成的刷新什么都不画。挂点由 state-frame-quiet 的
   useBackgroundRefresh 给出，唯一 owner 在这里。reduced 下 --motion-control 归 0，直达终值。 */
[data-refreshing] { opacity: var(--opacity-refreshing); transition: opacity var(--motion-control) var(--ease-standard); }

/* 骨架的静默期由样式层兑现（08 §19「静默期内几何先占位、视觉不画」）：任何带 data-loading-skeleton 的占位块
   挂上的那一刻先不可见、占住几何，--wait-quiet 之后才出现——不论它来自结构占位、成员手写还是命令式表格行，
   一秒内结束的等待都不闪。只动 visibility（不是动效，减弱动态照样生效），揭示的淡入仍归 [data-reveal]。 */
[data-loading-skeleton="true"] { transition: visibility 0s linear var(--wait-quiet); }
@starting-style { [data-loading-skeleton="true"] { visibility: hidden; } }

/* 行内状态位（primitives/state-feedback 的 InlineStatusSlot）：同一位置一次只说一件事。第一件渲染出内容的候选之后，
   其余兄弟一律不显示——候选组件返回 null 不产生节点、返回空壳是 :empty，都不占这一位。 */
[data-inline-status-slot] > :not(:empty) ~ * { display: none; }
[data-inline-status-slot] > :empty { display: none; }
/* 一件都没有时整位不占：调用点给这一位的外边距随之消失。 */
[data-inline-status-slot]:not(:has(> :not(:empty))) { display: none; }

/* 品牌等待（根等待面唯一）：家族标识自己的 16 个像素格按 4×4 Bayer 次序错相，逐格被底色盖住再放开——
   像素级 dither 溶解，不是淡入淡出：step-end 让每格只有「有 / 无」两态。一格一周期 --motion-brand-loop，
   同一时刻约四分之一的格被盖住。reduced 与 forced-colors 下格全部不画，停在完整标识。 */
@keyframes zml-dither { 0% { opacity: 0; } 75% { opacity: 1; } 100% { opacity: 0; } }
[data-slot="brand-mark"][data-motion="dither"] [data-dither-cell] {
  opacity: 0;
  animation: zml-dither var(--motion-brand-loop) step-end infinite;
  animation-delay: calc(var(--motion-brand-loop) * var(--zml-dither-order) / -16);
}
/* 格的相位次序（Bayer 0–15）由 data-dither-order 给出、在这里落成自定义属性：标识不写 style 属性（CSP style-src-attr 'none'）。 */
[data-dither-order="0"] { --zml-dither-order: 0; }
[data-dither-order="1"] { --zml-dither-order: 1; }
[data-dither-order="2"] { --zml-dither-order: 2; }
[data-dither-order="3"] { --zml-dither-order: 3; }
[data-dither-order="4"] { --zml-dither-order: 4; }
[data-dither-order="5"] { --zml-dither-order: 5; }
[data-dither-order="6"] { --zml-dither-order: 6; }
[data-dither-order="7"] { --zml-dither-order: 7; }
[data-dither-order="8"] { --zml-dither-order: 8; }
[data-dither-order="9"] { --zml-dither-order: 9; }
[data-dither-order="10"] { --zml-dither-order: 10; }
[data-dither-order="11"] { --zml-dither-order: 11; }
[data-dither-order="12"] { --zml-dither-order: 12; }
[data-dither-order="13"] { --zml-dither-order: 13; }
[data-dither-order="14"] { --zml-dither-order: 14; }
[data-dither-order="15"] { --zml-dither-order: 15; }
@media (prefers-reduced-motion: reduce), (forced-colors: active) {
  [data-slot="brand-mark"][data-motion="dither"] [data-dither-cell] { animation: none; opacity: 0; }
}

/* 不定等待字形：一周 --motion-loop 匀速；reduced 下停在静态开口弧（仍读作未完成）。 */
@keyframes zml-loader-spin { to { transform: rotate(360deg); } }
.zml-loader { transform-origin: center; animation: zml-loader-spin var(--motion-loop) linear infinite; }
@media (prefers-reduced-motion: reduce) { .zml-loader { animation: none; } }
/* 明暗呼吸（骨架块、状态点「进行中」）：透明度 1 → .5 → 1，一周期取调用点给的循环时长、曲线恒为对称的 --ease-move。
   自持关键帧而不借 Tailwind 内建的 pulse：内建关键帧只在有人写 `animate-pulse` 时才被产出，任意值写法会静默失效。 */
@keyframes zml-pulse { 50% { opacity: 0.5; } }

/* 骨架块不带扫光：成员或第三方样式的 ::before/::after shimmer 一律不生效。 */
[data-loading-skeleton="true"]::before,
[data-loading-skeleton="true"]::after { content: none; animation: none; transform: none; background-image: none; }

/* 比例条不定态：36% 宽指示块沿轨往返；reduced 与 forced-colors 下铺满整轨、降不透明度，
   表达「范围未知」而不是某个百分比或 100%（aria-valuetext 提供语义冗余）。两种偏好同形，
   否则同时开着两个偏好的用户会拿到第三种形态。 */
[data-progress-semantic="progress"][data-progress-state="indeterminate"] [data-slot="progress-rail-indicator"] {
  position: absolute;
  inset-inline-start: -36%;
  width: 36%;
  /* 匀速循环用 linear（动效规则 §2：constant motion → linear）；缓动会让不定等待看起来一顿一顿。 */
  animation: zml-progress-rail-indeterminate var(--motion-loop) linear infinite;
}
@keyframes zml-progress-rail-indeterminate { from { transform: translateX(0); } to { transform: translateX(378%); } }
@media (prefers-reduced-motion: reduce) {
  [data-slot="progress-rail-indicator"] { transition: none; }
  [data-progress-semantic="progress"][data-progress-state="indeterminate"] [data-slot="progress-rail-indicator"] {
    inset-inline-start: 0;
    width: 100%;
    opacity: 0.4;
    transform: none;
    animation: none !important;
  }
}
@media (forced-colors: active) {
  [data-slot="progress-rail-track"] { background: Canvas !important; outline: 1px solid CanvasText; outline-offset: -1px; }
  [data-slot="progress-rail-indicator"] { background: Highlight !important; }
  [data-progress-semantic="progress"][data-progress-state="indeterminate"] [data-slot="progress-rail-indicator"] {
    inset-inline-start: 0;
    width: 100%;
    opacity: 0.4;
    transform: none;
    animation: none !important;
  }
  [data-loading-skeleton="true"] { background: Canvas !important; outline: 1px solid GrayText !important; outline-offset: -1px; }
}

@keyframes zml-auth-enter {
  from {
    opacity: 0;
    transform: translateY(6px);
  }
  to {
    opacity: 1;
    transform: none;
  }
}

[data-slot="auth-content"] {
  animation: zml-auth-enter var(--motion-overlay) var(--ease-emphasized) both;
}

@media (prefers-reduced-motion: reduce) {
  /*
   * 逐类退让，不是一刀切归零：浮层/模态/面板的退场时长塌到 --motion-reduced-duration(0.01ms)
   * 而不是 0，依赖 transitionend 或读计算时长来调度退场移除的逻辑仍要收到事件；
   * 纯装饰的循环与位移才真正归 0。
   */
  :root {
    --motion-micro: 0ms;
    --motion-floating: 0ms;
    --motion-disclosure: 0ms;
    --motion-out: 0ms;
    --motion-move: 0ms;
    --motion-switch: 0ms;
    --motion-switch-thumb: 0ms;
    --motion-switch-thumb-delay: 0ms;
    --motion-overlay: var(--motion-reduced-duration);
    --motion-overlay-exit: var(--motion-reduced-duration);
    --motion-popup-enter: var(--motion-reduced-duration);
    --motion-popup-exit: var(--motion-reduced-duration);
    --motion-popup-scale: var(--motion-reduced-duration);
    --motion-dialog: var(--motion-reduced-duration);
    --motion-panel: var(--motion-reduced-duration);
    --motion-pulse-slow: 0ms;
    --motion-swap: 0ms;
    --motion-swap-offset: 0px;
    --motion-checkbox: 0ms;
    --motion-loop: 0ms;
    --motion-reveal: 0ms;
    --motion-brand-loop: 0ms;
    /* 表现型动效在减少动效下整层不启动（引擎直接返回），这里把 CSS 侧的时长同步归零。 */
    --motion-express-hover: 0ms;
    --motion-express-swap: 0ms;
    --motion-express-enter: 0ms;
    --motion-express-enter-offset: 0px;
    --motion-express-stagger: 0ms;
    --motion-express-glide: 0ms;
    --motion-express-scrub: 0ms;
    --motion-express-spot: 0ms;
    --motion-express-ambient-flow: 0ms;
    --motion-express-ambient-flow-step: 0ms;
    --motion-express-ambient-breathe: 0ms;
    --motion-express-ambient-drift: 0ms;
    --motion-express-ambient-drift-alt: 0ms;
    --motion-express-ambient-marquee: 0ms;
    --motion-express-word: 0ms;
    --motion-express-word-stagger: 0ms;
    --motion-express-count: 0ms;
    --motion-express-roll: 0ms;
    --motion-express-page-out: 0ms;
    --motion-express-page-in: 0ms;
    --marketing-reveal: 0ms;
    --motion-alert-ignite: 0ms;
    --motion-floating-offset: 0px;
  }

  [data-slot="auth-content"] {
    animation: none;
  }

  /*
   * 通配兜底：上面的逐类退让只覆盖消费 --motion-* 的声明，没走 token 的
   * 消费方过渡会整条逃出本合同。两端此前各写一份兜底，取值却是矛盾的
   * ——一端 0s、一端 0.01ms。0s 在多数实现里根本不派发 transitionend /
   * animationend，依赖事件卸载的浮层会停在打开态不消失；0.01ms 没有可感知
   * 时长而事件照常派发，所以兜底与上面的逐类档共用 --motion-reduced-duration。
   *
   * **本块必须留在 cascade layer 之外。** 它是 !important，而 important 声明的
   * 层叠顺序是反的：进层会让它压过成员那些同样 !important、必须最终生效的
   * 减动效改写（例如把不定态进度整条静态化的 `animation: none !important`）。
   * §14 禁的是无层**普通**声明静默吃掉工具类；!important 平台兜底压过工具类
   * 正是它的职责，与层位无关。
   */
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    animation-delay: 0s !important;
    animation-duration: var(--motion-reduced-duration) !important;
    animation-iteration-count: 1 !important;
    transition-delay: 0s !important;
    transition-duration: var(--motion-reduced-duration) !important;
  }
}

/* 设置窗内的行组（08 §22 设置行组）：页面上的 --card 是相对工作面抬起的，压到模态面上会比宿主更暗、读成凹井；
   窗内用浮层面那一档做行组底，抬升方向与页面一致。 */
[data-settings-window] {
  --card: var(--overlay-surface);
}

/*
 * 表现型动效的 CSS 半边（引擎：primitives/expressive-motion.ts）。
 * 隐藏态只认引擎打上的 data-fx-armed：脚本没跑、减少动效、forced-colors，以及引擎启动之后才挂载的元素，
 * 都保持可见。这里不写 will-change——WAAPI 运行期间浏览器自己会提层，常驻声明只会让几十个词各占一层。
 */
[data-fx-armed] {
  opacity: 0;
  translate: 0 var(--motion-express-enter-offset);
  transition: opacity var(--motion-express-enter) var(--ease-express-enter), translate var(--motion-express-enter) var(--ease-express-enter);
  transition-delay: calc(var(--fx-i, 0) * var(--motion-express-stagger));
}
[data-fx-armed][data-fx-in] { opacity: 1; translate: none; }
/* 启动前占位：宿主在 <head> 里同步给 <html> 打 .zml-fx-pending（减少动效时不打，并自带超时摘除），
   首屏的 words / enter 元素因此不会「先完整出现、再消失重播」。引擎一启动就摘掉它；
   引擎没来（脚本被拦、加载失败）超时也会摘，内容不会被永久藏住。 */
.zml-fx-pending [data-fx~="words"]:not([data-fx-in]), .zml-fx-pending [data-fx~="enter"] { opacity: 0; }
/* 拆词后的可见片段是装饰（整体在 .zml-fx-visual 里对读屏隐藏），读屏读 .zml-fx-sr 里的原句。 */
.zml-fx-word { display: inline-block; white-space: pre; }
.zml-fx-sr { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
/* 滚动点亮：未点亮的词退到 28% 而不是消失，整段始终可读。 */
.zml-fx-scrub .zml-fx-word { opacity: 0.28; transition: opacity var(--motion-express-scrub) var(--ease-express-hover); }
.zml-fx-scrub .zml-fx-word.zml-fx-lit { opacity: 1; }
/* 数字槽：每一位是一列 0–9，弹到目标值；等宽数字保证列宽不跳。槽只在滚动期间存在，结束后引擎还原文本。 */
.zml-fx-slot { display: inline-block; height: 1em; line-height: 1; overflow: hidden; vertical-align: -0.06em; font-variant-numeric: tabular-nums; }
.zml-fx-slot-col { display: block; white-space: pre; line-height: 1; }
/* 滑动底片：钉在宿主的物理左上角，位移由引擎按物理坐标给——逻辑 inset 在 RTL 下会让它飞出宿主。 */
.zml-fx-glide-host { position: relative; isolation: isolate; }
.zml-fx-glide {
  position: absolute; left: 0; top: 0; z-index: -1; border-radius: 9999px; background: var(--control-hover); opacity: 0; pointer-events: none;
  transition: transform var(--motion-express-glide) var(--ease-spring), width var(--motion-express-glide) var(--ease-spring), height var(--motion-express-glide) var(--ease-spring), opacity var(--motion-express-swap) var(--ease-express-hover);
}
.zml-fx-glide[data-instant] { transition: none; }
/* 光标聚光：引擎只写 --fx-mx / --fx-my，怎么画由消费者决定。这里给一档默认的边缘受光。 */
[data-fx~="spot"] { position: relative; isolation: isolate; }
[data-fx~="spot"]::before {
  content: ""; position: absolute; inset: 0; z-index: -1; border-radius: inherit; pointer-events: none; opacity: 0;
  background: radial-gradient(420px circle at var(--fx-mx, 50%) var(--fx-my, 0%), color-mix(in srgb, var(--foreground) 7%, transparent), transparent 60%);
  transition: opacity var(--motion-express-spot) var(--ease-express-hover);
}
[data-fx~="spot"][data-fx-active]::before { opacity: 1; }
/* 倾斜卡的高光跟着光标走。只用在可点的卡上：不可点的卡倾斜是在暗示一个不存在的动作。 */
[data-fx~="tilt"] { position: relative; transform-style: preserve-3d; }
[data-fx~="tilt"]::after {
  content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; opacity: 0;
  background: radial-gradient(360px circle at var(--fx-gx, 50%) var(--fx-gy, 50%), color-mix(in srgb, var(--foreground) 9%, transparent), transparent 55%);
  transition: opacity var(--motion-express-spot) var(--ease-express-hover);
}
[data-fx~="tilt"][data-fx-active]::after { opacity: 1; }
@media (forced-colors: active) {
  [data-fx~="spot"]::before, [data-fx~="tilt"]::after { display: none; }
  /* 底片的底色会被系统色盖掉；选中态不能因此消失。 */
  .zml-fx-glide { forced-color-adjust: none; background: Highlight; }
}
@media (prefers-contrast: more) { .zml-fx-scrub .zml-fx-word { opacity: 1; } }
/* 打印、导出 PDF、整页截图不滚动：没进过视口的内容必须照样出现。 */
@media print {
  [data-fx-armed] { opacity: 1 !important; translate: none !important; }
  .zml-fx-scrub .zml-fx-word { opacity: 1 !important; }
  .zml-fx-pending [data-fx] { opacity: 1 !important; }
}

/* ── 浏览器自动填充是字段状态，不是第三套主题（08 §7）。两端同一条：把 UA 的黄/蓝底重绘回语义字段材质，
   不替换组件自己的边、焦点环与校验态。要换底的槽只改 --z-autofill-surface（认证面落在卡片材质上就是这么用）。 */
:is(
  [data-slot="input"],
  [data-slot="combobox-chip-input"],
  [data-slot="textarea"]
):is(:autofill, :-webkit-autofill) {
  caret-color: var(--foreground);
  box-shadow: inset 0 0 0 1000px var(--z-autofill-surface, var(--field));
  -webkit-text-fill-color: var(--foreground);
}

@media (forced-colors: active) {
  :is(
    [data-slot="input"],
    [data-slot="combobox-chip-input"],
    [data-slot="textarea"]
  ):is(:autofill, :-webkit-autofill) {
    caret-color: CanvasText;
    box-shadow: none;
    -webkit-text-fill-color: CanvasText;
  }
}

/* ── 触控设备上可编辑文字至少 16px（08 §20）。iOS Safari 聚焦字号小于 16px 的输入框会把整页放大、
   失焦也不缩回；修法是字号，不是在 viewport 里写 maximum-scale / user-scalable——那会连用户自己的双指缩放
   一起禁掉（低视力与读屏用户的能力）。只改字号，控件盒、行高与密度不动；按元素而不是按 data-slot 选，
   成员原生输入（就地改名、表格内数字格）同样继承。不进 cascade layer：压过调用点的字号工具类。 */
@media (pointer: coarse) {
  :is(
    input:not([type="button"], [type="checkbox"], [type="color"], [type="file"], [type="hidden"], [type="image"], [type="radio"], [type="range"], [type="reset"], [type="submit"]),
    textarea,
    select,
    [contenteditable]:not([contenteditable="false"])
  ) {
    font-size: var(--type-input-touch);
  }
}

/* ── 头像裁剪的圆形取景（patterns/avatar-crop）：圆里是保存下来的那一块，圆外压暗仍可见；
   压暗用一圈足够大的外扩投影画，被舞台的 overflow 裁在方框内，不另铺遮罩层。两个主题同一深度：
   压的是用户自己的照片，不是界面面板。强制颜色下投影被丢弃，只留一圈系统色边。 */
[data-slot="avatar-crop-frame"] {
  box-shadow:
    0 0 0 100vmax color-mix(in srgb, #000 55%, transparent),
    inset 0 0 0 1px color-mix(in srgb, #fff 70%, transparent);
}
@media (forced-colors: active) {
  [data-slot="avatar-crop-frame"] { box-shadow: none; outline: 1px solid CanvasText; outline-offset: -1px; }
}

/* Joined mode choices share one quiet well; independent workbench options keep their existing geometry. */
[data-slot="segmented"][data-appearance="joined"] {
  height: auto;
  gap: var(--space-inline-compact);
  padding: var(--space-inline-compact);
  border-radius: var(--radius-control);
  background: color-mix(in srgb, var(--foreground) 4%, var(--modal-surface));
}
[data-slot="segmented"][data-appearance="joined"] [data-slot="segmented-option"] {
  height: var(--control-form);
  border-color: transparent;
  border-radius: var(--radius-control);
  background: transparent;
  font-size: var(--type-control);
  line-height: var(--type-control-line);
}
[data-slot="segmented"][data-appearance="joined"] [data-slot="segmented-option"]::before { box-shadow: none; }
[data-slot="segmented"][data-appearance="joined"] [data-slot="segmented-option"][data-checked] { background: var(--segmented-option-current); }

/* A searchable directory keeps its search and paging rails still while result counts change. */
[data-slot="dialog-content"]:has(> [data-slot="dialog-body"] > [data-wallet-directory]),
[data-slot="dialog-content"]:has(> [data-account-mutation-window] > [data-slot="dialog-body"] > [data-wallet-directory]) {
  height: min(680px, calc(100dvh - 2 * var(--space-section-compact)));
}


/* /@fs//Users/zhoupengpeng/Code/zml/platform/frontend/app/theme.css */
/*
 * ZML 平台语义层：金融色轴、chart、资产分类、品牌派生、成员几何与 Tailwind 命名空间映射。
 * Foundation 值只由共享层 tokens.css 拥有（材质、前景、边界、控件、动作、运行状态、
 * 金融方向、radius、字体、控件高度、shell 几何、motion、z、focus）。本文件只允许：
 *   1. 成员专属命名（chart、asset、interval、favorite、monitor/funding 合成参数）；
 *   2. 成员历史命名向 tokens 的别名（值不在这里第二次出现）；
 *   3. 把 tokens 映射进 Tailwind 命名空间（--color-* / --radius-* / --font-weight-*）。
 * 不得在这里重写任何 tokens 已有名字的值；需要改 Foundation 就改 standards 再投影。
 */

/* ── Light mode (default) ── */
:root {
  color-scheme: light;

  /* Monitor rows compose alert/selection/focus overlays on one inherited data
     surface. These two alphas are a domain composite, not a shared control theme. */

  /* 资产分类的 soft 与 border 派生：只在这里定义混合比例，色相取自本文件的成员调色板；
     暗色只改比例，不复制色值。运行状态的 soft 归共享 tokens.css。 */
  --asset-soft-alpha: 8%;
  --asset-border-alpha: 18%;
  --asset-unknown-border-alpha: 16%;

  /* ── shadcn 角色名 → Foundation ─────────────────────────────────────────
     --background / --foreground / --card / --popover / --primary* / --destructive /
     --border / --input / --secondary-foreground / --muted-foreground 直接由
     tokens 拥有；下面只补 shadcn 需要而 tokens 没有的复合角色。 */
  --card-foreground: var(--foreground);
  --popover-foreground: var(--foreground);
  --secondary: var(--sub-surface);
  --muted: var(--sub-surface);
  --accent: var(--control-hover);
  --accent-foreground: var(--foreground);
  --ring: var(--border-focus);

  /* ── 成员几何别名 → Foundation ──────────────────────────────────────────
     控件高度、粗指针命中面、顶栏高度的值只由 tokens 拥有；
     这些名字是成员组件已经在消费的历史命名，保留为别名。
     别名只在真有消费者时存在：没人读的别名是重复机制，删掉后要用直接读 tokens。 */
  /* 身份行总高 = 内容 43.5 + 0.5 发丝；壳内所有「让开顶栏」的算式读这一个值。 */
  --control-room-nav-height: calc(var(--shell-bar-height) + 0.5px);
  --control-height-main: var(--control-standard);
  --control-height-secondary: var(--control-compact);
  --control-height-chrome: var(--control-height-main);
  --control-room-coarse-control-size: var(--hit-plane-coarse);
  --zml-monitor-controls: var(--z-workbench-controls);

  /* ── 成员专属布局 token ────────────────────────────────────────────────
     这些是相对单位的成员版面节奏，与 tokens 的像素几何不同族：rem 跟随浏览器
     字号缩放，改写成 px token 会静默关掉这个缩放，所以不做「值相等」的别名。 */
  --page-padding: 0.5rem;
  --section-gap: 0.5rem;
  --content-max-width: 88rem;
  /* 资讯收件箱行尾分类 chip 的上限宽：16 种语言里最长的分类词是 fr「Modifications apportées aux opérations
     boursières」，产品字体（Inter Variable 12/400）canvas 实测 304，加 chip 横向节奏 8 + 14 圆点槽 + 6 + 1 + 8 与两侧
     1px 边 = 344。槽按内容取宽，这只是上限：其它语言不为法语付宽；超出（新登记的分类词、客户端字体不同）由共享
     chip 按真实溢出挂 title 兜底。它是资讯行自己的宽，不再借资产列的 --table-column-asset。
     窄于 1024 的行没有这份余量：标题是主语，分类上限退回 96（与改前相同），被裁的分类由 title 与行的可访问描述揭示。 */
  --announcement-category-column: 344px;
  --announcement-category-column-compact: 96px;
  /* ── material：成员表面角色 → Foundation 角色 ───────────────────────────
     Shared states consume the versioned Foundation roles byte-for-byte. */
  --material-page: var(--background);
  --material-surface: var(--work-surface);
  --material-panel: var(--card);
  --material-panel-muted: var(--sub-surface);
  --material-popover: var(--popover);
  --material-field: var(--field);
  --material-field-border: var(--field-border);
  --material-field-border-hover: var(--field-border-hover);
  --material-border: var(--border-subtle);
  /* 边界族三档共享同一 chroma，强弱只由明度表达；显式值避免 foreground
     派生破坏边界族恒定性。 */
  --material-border-strong: var(--border-strong);
  --material-control-hover: var(--control-hover);
  --material-control-hover-text: var(--foreground);
  --material-control-rail: var(--sub-surface);
  --material-control-current: var(--control-current);
  --material-focus-border: var(--border-focus);
  --material-control-selected: var(--control-selected);
  --material-control-selected-hover: var(--control-selected);
  --material-emphasis-brand: color-mix(
    in srgb,
    var(--primary) 34%,
    var(--material-control-current)
  );
  --material-shadow-outline: var(--shadow-hairline);
  --material-shadow-popover: var(--shadow-floating);
  --material-radius: var(--radius-control);


  /* Asset classification colors. These are identity labels, never runtime
     status or market-direction signals. Base hues are the member identity
     palette; soft / border derive from them through the alphas above. */
  --color-asset-crypto: var(--muted-foreground);
  --color-asset-crypto-soft: transparent;
  --color-asset-crypto-border: transparent;
  --color-asset-equity: #087a55;
  --color-asset-etf: #0f766e;
  --color-asset-commodity: #946200;
  --color-asset-fx: #7440b8;
  --color-asset-index: #2367ad;
  --color-asset-government-security: #3d6b78;
  --color-asset-real-estate: #a83b67;
  --color-asset-other: #6c625a;
  --color-asset-unknown: #77746f;
  --color-asset-equity-soft: color-mix(
    in srgb,
    var(--color-asset-equity) var(--asset-soft-alpha),
    transparent
  );
  --color-asset-equity-border: color-mix(
    in srgb,
    var(--color-asset-equity) var(--asset-border-alpha),
    transparent
  );
  --color-asset-etf-soft: color-mix(
    in srgb,
    var(--color-asset-etf) var(--asset-soft-alpha),
    transparent
  );
  --color-asset-etf-border: color-mix(
    in srgb,
    var(--color-asset-etf) var(--asset-border-alpha),
    transparent
  );
  --color-asset-commodity-soft: color-mix(
    in srgb,
    var(--color-asset-commodity) var(--asset-soft-alpha),
    transparent
  );
  --color-asset-commodity-border: color-mix(
    in srgb,
    var(--color-asset-commodity) var(--asset-border-alpha),
    transparent
  );
  --color-asset-fx-soft: color-mix(
    in srgb,
    var(--color-asset-fx) var(--asset-soft-alpha),
    transparent
  );
  --color-asset-fx-border: color-mix(
    in srgb,
    var(--color-asset-fx) var(--asset-border-alpha),
    transparent
  );
  --color-asset-index-soft: color-mix(
    in srgb,
    var(--color-asset-index) var(--asset-soft-alpha),
    transparent
  );
  --color-asset-index-border: color-mix(
    in srgb,
    var(--color-asset-index) var(--asset-border-alpha),
    transparent
  );
  --color-asset-government-security-soft: color-mix(
    in srgb,
    var(--color-asset-government-security) var(--asset-soft-alpha),
    transparent
  );
  --color-asset-government-security-border: color-mix(
    in srgb,
    var(--color-asset-government-security) var(--asset-border-alpha),
    transparent
  );
  --color-asset-real-estate-soft: color-mix(
    in srgb,
    var(--color-asset-real-estate) var(--asset-soft-alpha),
    transparent
  );
  --color-asset-real-estate-border: color-mix(
    in srgb,
    var(--color-asset-real-estate) var(--asset-border-alpha),
    transparent
  );
  --color-asset-other-soft: color-mix(
    in srgb,
    var(--color-asset-other) var(--asset-soft-alpha),
    transparent
  );
  --color-asset-other-border: color-mix(
    in srgb,
    var(--color-asset-other) var(--asset-border-alpha),
    transparent
  );
  --color-asset-unknown-soft: transparent;
  --color-asset-unknown-border: color-mix(
    in srgb,
    var(--color-asset-unknown) var(--asset-unknown-border-alpha),
    transparent
  );
}

/* ── Dark mode（唯一 .dark 块；Foundation 的暗色值住在共享层 tokens.css） ── */
.dark {
  color-scheme: dark;
  --asset-soft-alpha: 14%;
  --asset-border-alpha: 27%;
  --asset-unknown-border-alpha: 22%;


  --color-asset-equity: #48c78e;
  --color-asset-etf: #45c7bd;
  --color-asset-commodity: #e6a93a;
  --color-asset-fx: #c18cf0;
  --color-asset-index: #70a7ef;
  --color-asset-government-security: #73bdc8;
  --color-asset-real-estate: #ef83ac;
  --color-asset-other: #b4a698;
  --color-asset-unknown: #9b9891;

  --color-interval-4h: #a78bfa;
  --color-favorite: #fbbf24;

  --material-shadow-outline: var(--shadow-hairline);
  --material-shadow-popover: var(--shadow-floating);
}

/* ── Tailwind 命名空间映射 ───────────────────────────────────────────────
   只放真正生成工具类的命名空间。--font-sans / --font-mono /
   --font-weight-medium / --font-weight-semibold 不在这里重写：Tailwind 默认主题
   的同名变量住在 @layer theme，共享层 tokens.css 的无层 :root 声明在层叠里压过它，
   font-sans / font-medium 等工具类因此直接落到 Foundation 的值。 */
@theme inline {
  /* 断点由共享层 tokens.css 的 @theme 拥有,成员不再声明 --breakpoint-*。
     那里的 px 取值正是被本成员这条耦合定死的:use-viewport-class 的
     VIEWPORT_BREAKPOINTS 用 window.innerWidth 与 768/1280 做原始比较,
     两侧必须同单位同值(1680 是 JS 容量档,无 CSS 断点)。 */
  --font-heading: var(--font-sans);
  --color-chart-5: var(--chart-5);
  --color-chart-4: var(--chart-4);
  --color-chart-3: var(--chart-3);
  --color-chart-2: var(--chart-2);
  --color-chart-1: var(--chart-1);
  --color-ring: var(--ring);
  --color-input: var(--input);
  --color-border: var(--border);
  --color-destructive: var(--destructive);
  --color-accent-foreground: var(--accent-foreground);
  --color-accent: var(--accent);
  --color-muted-foreground: var(--muted-foreground);
  --color-muted: var(--muted);
  --color-secondary-foreground: var(--secondary-foreground);
  --color-secondary: var(--secondary);
  --color-primary-foreground: var(--primary-foreground);
  --color-primary: var(--primary);
  --color-popover-foreground: var(--popover-foreground);
  --color-popover: var(--popover);
  --color-card-foreground: var(--card-foreground);
  --color-card: var(--card);
  --color-foreground: var(--foreground);
  --color-background: var(--background);
  /* Tailwind 的 rounded-sm…4xl 直接落到角色 radius，不再有第二套 calc 阶梯：
     sm→micro 4, md→small 6, lg→control 8, xl→section 10, 2xl/3xl/4xl→floating 12。
     角色本身（--radius-micro…--radius-pill）由 tokens 拥有，组件优先写角色名。 */
  --radius-sm: var(--radius-micro);
  --radius-md: var(--radius-small);
  --radius-lg: var(--radius-control);
  --radius-2xl: var(--radius-floating);
  --radius-3xl: var(--radius-floating);
  --radius-4xl: var(--radius-floating);

  /* 这里把 Tailwind 自带的 text-* 档重绑到 ZML 字阶 token，字号与行盒成对取自同一族。
     作用是兜底：万一有人写了 `text-xs` / `text-sm`，解出来的是产品刻度，不是 Tailwind
     默认的 rem 档。**这不是在造新名字**——这些名字 Tailwind 本来就有，删掉这几行只会让它们
     退回 rem 默认值、与刻度脱钩，所以绑定要留着。
     （上一版此处写着「使用 rem」「不进入 @theme」：两句都与本块现状相反——值全是 px token，
     而本块就在上面那个 `@theme inline` 里。按现状更正，不保留已被代码推翻的说明。）

     同轮删掉 `--text-2xs`：它与 `--text-xs` 逐值相同（都是 --type-workbench-secondary 的 12/16），
     但 2xs 不是 Tailwind 自带档，是在这里新造的名字，且全仓零消费者——12/16 这一档在
     Monitor 一度有四个同义名（--text-2xs / --text-xs / --type-workbench-secondary /
     --type-workbench-micro）。owner 是 `--type-workbench-secondary`。
     **否定式合同**：不要再为已有 token owner 的字阶另起别名。源码只看得出「现在有几个名字」，
     看不出「不许再加一个」。 */
  --text-xs: var(--type-workbench-secondary);
  --text-xs--line-height: var(--type-workbench-secondary-line);
  --text-sm: var(--type-body);
  --text-sm--line-height: var(--type-body-line);
  --text-base: var(--type-body);
  --text-base--line-height: var(--type-body-line);
  --text-control: var(--type-control);
  --text-control--line-height: var(--type-control-line);
  --text-lg: var(--type-heading-section);
  --text-lg--line-height: var(--type-heading-section-line);
  --text-metric: var(--type-auth-heading);
  --text-metric--line-height: var(--type-auth-heading-line);
  --text-display: var(--type-heading-page);
  --text-display--line-height: var(--type-heading-page-line);
  /* 字重轴只有两档（见 docs/08「字重轴」）：
     - regular / normal 400：正文、说明、菜单项与 listbox 选项、Field 值、一切数据与数字；
     - medium 500：控件标签、页签、导航、按钮、分区与分组标题、字段标签、表头、行主标识。
     字重不承载选中、当前、方向、风险档或变化等状态——那些走色轴、徽标或标记。
     中文回落字族在 401~500 之间渲染完全一致，所以这两档之间不存在"中间字重"。 */
  --font-weight-normal: var(--font-weight-normal);
}

/* Semantic data / status colors.
   Deliberately a non-inline @theme block: utilities must compile to
   var(--color-*) references so the .dark overrides take effect.
   Keeping these in `@theme inline` bakes light literals into every
   utility and silently kills dark theming.
   色相全部来自 tokens 的 --status-* / --financial-* / --risk；本块只做
   命名空间映射与 soft 派生，没有第二份色值。 */
@theme {
  /* Market direction colors — tv-* encodes price movement only */
  --color-tv-positive: var(--financial-positive);
  --color-tv-negative: var(--financial-negative);
  --color-tv-warning: var(--risk);
  /* 方向淡底不在成员另算：用共享 --color-financial-positive-soft / -negative-soft / --color-risk-soft（14%，
     2026-09-24 两端统一；此前这里有一份无人消费的 10% 派生）。 */

  /* 运行状态、金融中性与风险轴的 --color-* 名（含 soft）由共享 tokens.css 的 @theme 映射，两端同名；
     这里只留成员自有的派生名。 */
  --color-status-active: var(--color-status-info);
  --color-status-active-soft: var(--color-status-info-soft);
  /* On-color for solid status-error carriers (alert count pills). */
  --color-status-error-foreground: var(--inverse-foreground);

  /* Progress and meter tones describe completion, quality, or capacity risk.
     They remain separate from system-health status roles even when a theme
     intentionally maps warning and danger to the same calibrated colors. */
  --color-progress-primary: var(--primary);
  --color-progress-warning: var(--color-status-warning);
  --color-progress-danger: var(--color-status-error);

  /* Interval period colors */
  --color-interval-1h: var(--color-tv-warning);
  --color-interval-2h: var(--status-info);
  --color-interval-4h: #7c3aed;

  /* User favorite marker (star) — user-curated state, distinct from
     status-* (system health) and tv-* (market direction). */
  --color-favorite: #d97706;
}

/* Responsive spacing */
@media (min-width: 640px) {
  :root,
  .dark {
    --page-padding: 0.5rem;
    --section-gap: 0.625rem;
  }
}
@media (min-width: 768px) {
  :root,
  .dark {
    --page-padding: 0.5rem;
    --section-gap: 0.625rem;
  }
}
@media (min-width: 1024px) {
  :root,
  .dark {
    --page-padding: 0.625rem;
    --section-gap: 0.75rem;
  }
}

@media (min-width: 1536px) {
  :root,
  .dark {
    --page-padding: 0.75rem;
    --section-gap: 0.875rem;
  }
}

/* 环宽（--focus-ring-width: 2px）已收口到共享层 tokens.css：它是共享焦点
   合同的一部分，两端此前各写一份同值。这里只留成员自有的色轴——ZML 平台重指
   的是 --material-* 阶梯，与 Trade 的 --control-* / --field-border-* 是两族不同
   的 token，混合空间与基准色也不同，不能合并成一份。 */
@media (prefers-contrast: more) {
  :root,
  .dark {
    /* 全站焦点环只消费 --focus-ring-color；混向 --foreground 可让两个主题
       同时远离背景并提高对比度。 */
    --focus-ring-color: color-mix(in srgb, var(--ring) 70%, var(--foreground));
    --muted-foreground: color-mix(
      in srgb,
      var(--foreground) 76%,
      var(--background)
    );
    /* 高对比边界保持 --material-border < --border < --material-border-strong；
       三档必须一起抬升，--border 仍是全站默认边界角色。 */
    --material-border: color-mix(in srgb, var(--foreground) 34%, transparent);
    --border: color-mix(in srgb, var(--foreground) 46%, transparent);
    --material-border-strong: color-mix(
      in srgb,
      var(--foreground) 58%,
      transparent
    );
    --material-focus-border: color-mix(
      in srgb,
      var(--primary) 70%,
      var(--foreground)
    );
    --material-emphasis-brand: color-mix(
      in srgb,
      var(--primary) 82%,
      var(--foreground)
    );
  }
}


/* /@fs//Users/zhoupengpeng/Code/zml/platform/frontend/app/business.css */
@layer utilities {
  /* 冻结列只拥有「粘」这一件事：`position` + 层级 + `left`。
     底色不在这里画——共享 table recipe 已经给每一个 th / td 上了不透明底，
     并且行态（hover / selected / current）是画在 `[&>:is(td,th)]` 上的，粘滞首列
     作为行的直接子元素自动跟着换色。这里再写一层 background 就等于把行态从首列
     上抹掉，于是必须在 CSS 里手工复刻一份行态全序才能补回来——那份 66 行的
     `--data-table-row-fill` 全序正是这么来的，且它与共享裁决必须逐条对齐才不撕裂。
     现在底色只有共享 recipe 一个 owner，那份复刻已删。
     表头「要不要粘」同样只有共享 TableHeader 一个 owner（thead 上的 sticky）；
     此处曾另有一条 `.zm-data-table-sticky-header`，由一个从未被任何调用点传过 true
     的 prop 驱动，是死机制，一并删除。 */
  .zm-data-table-sticky-left > [data-slot="table"] > thead tr > *:first-child {
    position: sticky;
    z-index: var(--z-workbench-controls);
  }

  .zm-data-table-sticky-left
    > [data-slot="table"]
    > tbody
    tr
    > *:first-child:not([colspan]) {
    position: sticky;
    z-index: var(--z-sticky);
  }

  .zm-data-table-sticky-left > [data-slot="table"] > thead tr > *:first-child,
  .zm-data-table-sticky-left
    > [data-slot="table"]
    > tbody
    tr
    > *:first-child:not([colspan]) {
    left: 0;
  }

  .zm-monitor-third-line-pill {
    --monitor-third-line-pill-border: var(--material-border);
    --monitor-third-line-pill-bg: var(--material-panel-muted);
    --monitor-third-line-pill-color: var(--muted-foreground);
    border: 1px solid var(--monitor-third-line-pill-border);
    border-radius: var(--radius-micro);
    background: var(--monitor-third-line-pill-bg);
    color: var(--monitor-third-line-pill-color);
  }

  .zm-monitor-third-line-pill-danger {
    --monitor-third-line-pill-border: color-mix(
      in srgb,
      var(--color-status-error) 35%,
      transparent
    );
    --monitor-third-line-pill-bg: var(--color-status-error-soft);
    --monitor-third-line-pill-color: var(--color-status-error);
  }

  .zm-monitor-third-line-pill-warning {
    --monitor-third-line-pill-border: color-mix(
      in srgb,
      var(--color-status-warning) 35%,
      transparent
    );
    --monitor-third-line-pill-bg: var(--color-status-warning-soft);
    --monitor-third-line-pill-color: var(--color-status-warning);
  }

  .zm-monitor-third-line-pill-accent {
    --monitor-third-line-pill-border: color-mix(
      in srgb,
      var(--color-status-active) 35%,
      transparent
    );
    --monitor-third-line-pill-bg: var(--color-status-active-soft);
    --monitor-third-line-pill-color: var(--color-status-active);
  }

  .zm-monitor-third-line-pill-neutral {
    --monitor-third-line-pill-border: var(--material-border);
    --monitor-third-line-pill-bg: var(--material-panel-muted);
    --monitor-third-line-pill-color: var(--muted-foreground);
  }

  /* 手写 CSS 的裸 `:hover` 必须自行加指针门。
     密集监控行里粘滞 hover 会被读成「当前行」，与真正的 current/selected 冲突。 */
  @media (hover: hover) {
    .zm-monitor-third-line-pill-clickable-warning:hover {
      --monitor-third-line-pill-border: color-mix(
        in srgb,
        var(--color-status-warning) 50%,
        transparent
      );
      --monitor-third-line-pill-bg: var(--color-status-warning-soft);
    }

    .zm-monitor-third-line-pill-clickable-accent:hover {
      --monitor-third-line-pill-border: color-mix(
        in srgb,
        var(--color-status-active) 50%,
        transparent
      );
      --monitor-third-line-pill-bg: var(--color-status-active-soft);
    }

    .zm-monitor-third-line-pill-clickable-danger:hover {
      --monitor-third-line-pill-border: color-mix(
        in srgb,
        var(--color-status-error) 50%,
        transparent
      );
      --monitor-third-line-pill-bg: var(--color-status-error-soft);
    }

    .zm-monitor-column-resize-handle:hover::before {
      background: color-mix(in srgb, var(--primary) 70%, transparent);
    }
  }
}


/* ── 高对比投影（业务面）：与 globals.css 的 ①–⑨ 分块同序，只搬业务 owner。 ── */

@media (forced-colors: active) {
  /* 监控第三行的 pill：与上表同一套阶梯，同一条判据。 */
  .zm-monitor-third-line-pill {
    border-color: CanvasText;
    border-style: solid;
    background: Canvas;
    color: CanvasText;
  }

  .zm-monitor-third-line-pill-accent {
    border-style: dotted;
  }

  .zm-monitor-third-line-pill-warning {
    border-style: dashed;
  }

  .zm-monitor-third-line-pill-danger {
    outline: 1px solid CanvasText;
    outline-offset: 1px;
  }

  .zm-monitor-third-line-pill-neutral {
    border-color: GrayText;
    color: GrayText;
  }
}
