/* BluUITheme — shared palette, surfaces and appearance modes.
   Preset hues follow Ant Design Tag filled presets; status hues follow solid
   statuses. Component CSS stays on each Block. Set data-bluui-theme to light
   or dark on an ancestor; absent an override, the device preference applies.
   Generated by native-builds/PaletteDarkMode/build-palette.py. Foregrounds
   are tuned for WCAG AA contrast while preserving the reference palette hues. */
.grid-demo {
  color-scheme: light;
  --blu-font-family: Inter,
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        Roboto,
        Helvetica,
        Arial,
        sans-serif;
  --blu-font-size-xs: 12px;
  --blu-font-size-sm: 13px;
  --blu-font-size-md: 14px;
  --blu-font-size-lg: 15px;
  --blu-font-size-xl: 18px;
  --blu-font-weight-normal: 400;
  --blu-font-weight-medium: 500;
  --blu-font-weight-semibold: 600;
  --blu-font-weight-bold: 700;
  --blu-radius-xs: 4px;
  --blu-radius-sm: 6px;
  --blu-radius-md: 8px;
  --blu-radius-lg: 12px;
  --blu-radius-xl: 16px;
  --blu-space-1: 4px;
  --blu-space-2: 8px;
  --blu-space-3: 12px;
  --blu-space-4: 16px;
  --blu-space-5: 20px;
  --blu-space-6: 24px;
  --blu-transition-fast: 120ms ease;
  --blu-transition-normal: 180ms ease;
  --bluui-background: #f5f7fb;
  --bluui-surface: #ffffff;
  --bluui-surface-muted: #f7f8fb;
  --bluui-surface-raised: #ffffff;
  --bluui-text: #182230;
  --bluui-text-muted: #5c6b80;
  --bluui-text-subtle: #626f82;
  --bluui-border: #e2e8f0;
  --bluui-border-strong: #b8c4d4;
  --bluui-control-border: #7b8799;
  --bluui-row-border: #edf0f5;
  --bluui-hover: #f0f2f7;
  --bluui-selected: #e9e6ff;
  --bluui-changed: #f5f3ff;
  --bluui-skeleton-base: #e2e8f0;
  --bluui-skeleton-shine: rgb(255 255 255 / 65%);
  --bluui-scrim: rgb(15 23 42 / 45%);
  --bluui-shadow-color: rgb(15 23 42 / 12%);
  --bluui-primary-hover: #4338ca;
  --bluui-primary-active: #3730a3;
  --bluui-on-primary: #ffffff;
  --bluui-primary: #4f46e5;
  --bluui-focus-shadow: 0 0 0 3px rgb(79 70 229 / 22%);
  --bluui-menu-shadow: 0 10px 30px rgb(15 23 42 / 16%);
  --bluui-color-default-soft: #f5f5f5;
  --bluui-color-default-text: #1d1d1d;
  --bluui-color-default-border: #d9d9d9;
  --bluui-color-default-solid: #000000;
  --bluui-color-default-contrast: #ffffff;
  --bluui-color-primary-soft: #eef2ff;
  --bluui-color-primary-text: #4338ca;
  --bluui-color-primary-border: #c7d2fe;
  --bluui-color-primary-solid: #4f46e5;
  --bluui-color-primary-contrast: #ffffff;
  --bluui-color-secondary-soft: #e2e8f0;
  --bluui-color-secondary-text: #334155;
  --bluui-color-secondary-border: #cbd5e1;
  --bluui-color-secondary-solid: #475569;
  --bluui-color-secondary-contrast: #ffffff;
  --bluui-color-success-soft: #f6ffed;
  --bluui-color-success-text: #2d6c0e;
  --bluui-color-success-border: #b7eb8f;
  --bluui-color-success-solid: #52c41a;
  --bluui-color-success-contrast: #000000;
  --bluui-color-processing-soft: #e6f4ff;
  --bluui-color-processing-text: #1054b5;
  --bluui-color-processing-border: #91caff;
  --bluui-color-processing-solid: #2681ff;
  --bluui-color-processing-contrast: #000000;
  --bluui-color-warning-soft: #fffbe6;
  --bluui-color-warning-text: #7d560a;
  --bluui-color-warning-border: #ffe58f;
  --bluui-color-warning-solid: #faad14;
  --bluui-color-warning-contrast: #000000;
  --bluui-color-error-soft: #fff2f0;
  --bluui-color-error-text: #a33133;
  --bluui-color-error-border: #ffccc7;
  --bluui-color-error-solid: #ff4d4f;
  --bluui-color-error-contrast: #000000;
  --bluui-color-danger-soft: #fff2f0;
  --bluui-color-danger-text: #a33133;
  --bluui-color-danger-border: #ffccc7;
  --bluui-color-danger-solid: #ff4d4f;
  --bluui-color-danger-contrast: #000000;
  --bluui-color-magenta-soft: #fff0f6;
  --bluui-color-magenta-text: #a9196d;
  --bluui-color-magenta-border: #ffadd2;
  --bluui-color-magenta-solid: #ed409e;
  --bluui-color-magenta-contrast: #000000;
  --bluui-color-red-soft: #fff1f0;
  --bluui-color-red-text: #b4111e;
  --bluui-color-red-border: #ffa39e;
  --bluui-color-red-solid: #e4202a;
  --bluui-color-red-contrast: #ffffff;
  --bluui-color-volcano-soft: #fff2e8;
  --bluui-color-volcano-text: #aa2d0a;
  --bluui-color-volcano-border: #ffbb96;
  --bluui-color-volcano-solid: #fa541c;
  --bluui-color-volcano-contrast: #000000;
  --bluui-color-orange-soft: #fff7e6;
  --bluui-color-orange-text: #904905;
  --bluui-color-orange-border: #ffd591;
  --bluui-color-orange-solid: #fa8c16;
  --bluui-color-orange-contrast: #000000;
  --bluui-color-gold-soft: #fffbe6;
  --bluui-color-gold-text: #835404;
  --bluui-color-gold-border: #ffe58f;
  --bluui-color-gold-solid: #faad14;
  --bluui-color-gold-contrast: #000000;
  --bluui-color-lime-soft: #fcffe6;
  --bluui-color-lime-text: #486803;
  --bluui-color-lime-border: #eaff8f;
  --bluui-color-lime-solid: #a0d911;
  --bluui-color-lime-contrast: #000000;
  --bluui-color-green-soft: #f6ffed;
  --bluui-color-green-text: #276d09;
  --bluui-color-green-border: #b7eb8f;
  --bluui-color-green-solid: #52c41a;
  --bluui-color-green-contrast: #000000;
  --bluui-color-cyan-soft: #e6fffb;
  --bluui-color-cyan-text: #06686c;
  --bluui-color-cyan-border: #87e8de;
  --bluui-color-cyan-solid: #13c2c2;
  --bluui-color-cyan-contrast: #000000;
  --bluui-color-blue-soft: #e6f4ff;
  --bluui-color-blue-text: #0851c8;
  --bluui-color-blue-border: #91caff;
  --bluui-color-blue-solid: #2681ff;
  --bluui-color-blue-contrast: #000000;
  --bluui-color-geekblue-soft: #f0f5ff;
  --bluui-color-geekblue-text: #1d39c4;
  --bluui-color-geekblue-border: #adc6ff;
  --bluui-color-geekblue-solid: #2f54eb;
  --bluui-color-geekblue-contrast: #ffffff;
  --bluui-color-purple-soft: #f9f0ff;
  --bluui-color-purple-text: #531dab;
  --bluui-color-purple-border: #d3adf7;
  --bluui-color-purple-solid: #722ed1;
  --bluui-color-purple-contrast: #ffffff;
  --bluui-default-soft: var(--bluui-color-default-soft);
  --bluui-default-text: var(--bluui-color-default-text);
  --bluui-default-border: var(--bluui-color-default-border);
  --bluui-default: var(--bluui-color-default-solid);
  --blu-color-default-50: var(--bluui-color-default-soft);
  --blu-color-default-100: var(--bluui-color-default-border);
  --blu-color-default-600: var(--bluui-color-default-solid);
  --blu-color-default-700: var(--bluui-color-default-text);
  --blu-color-default-800: var(--bluui-color-default-text);
  --bluui-primary-soft: var(--bluui-color-primary-soft);
  --bluui-primary-text: var(--bluui-color-primary-text);
  --bluui-primary-border: var(--bluui-color-primary-border);
  --blu-color-primary-50: var(--bluui-color-primary-soft);
  --blu-color-primary-100: var(--bluui-color-primary-border);
  --blu-color-primary-600: var(--bluui-color-primary-solid);
  --blu-color-primary-700: var(--bluui-color-primary-text);
  --blu-color-primary-800: var(--bluui-color-primary-text);
  --bluui-secondary-soft: var(--bluui-color-secondary-soft);
  --bluui-secondary-text: var(--bluui-color-secondary-text);
  --bluui-secondary-border: var(--bluui-color-secondary-border);
  --bluui-secondary: var(--bluui-color-secondary-solid);
  --blu-color-secondary-50: var(--bluui-color-secondary-soft);
  --blu-color-secondary-100: var(--bluui-color-secondary-border);
  --blu-color-secondary-600: var(--bluui-color-secondary-solid);
  --blu-color-secondary-700: var(--bluui-color-secondary-text);
  --blu-color-secondary-800: var(--bluui-color-secondary-text);
  --bluui-success-soft: var(--bluui-color-success-soft);
  --bluui-success-text: var(--bluui-color-success-text);
  --bluui-success-border: var(--bluui-color-success-border);
  --bluui-success: var(--bluui-color-success-solid);
  --blu-color-success-50: var(--bluui-color-success-soft);
  --blu-color-success-100: var(--bluui-color-success-border);
  --blu-color-success-600: var(--bluui-color-success-solid);
  --blu-color-success-700: var(--bluui-color-success-text);
  --blu-color-success-800: var(--bluui-color-success-text);
  --bluui-processing-soft: var(--bluui-color-processing-soft);
  --bluui-processing-text: var(--bluui-color-processing-text);
  --bluui-processing-border: var(--bluui-color-processing-border);
  --bluui-processing: var(--bluui-color-processing-solid);
  --blu-color-processing-50: var(--bluui-color-processing-soft);
  --blu-color-processing-100: var(--bluui-color-processing-border);
  --blu-color-processing-600: var(--bluui-color-processing-solid);
  --blu-color-processing-700: var(--bluui-color-processing-text);
  --blu-color-processing-800: var(--bluui-color-processing-text);
  --bluui-warning-soft: var(--bluui-color-warning-soft);
  --bluui-warning-text: var(--bluui-color-warning-text);
  --bluui-warning-border: var(--bluui-color-warning-border);
  --bluui-warning: var(--bluui-color-warning-solid);
  --blu-color-warning-50: var(--bluui-color-warning-soft);
  --blu-color-warning-100: var(--bluui-color-warning-border);
  --blu-color-warning-600: var(--bluui-color-warning-solid);
  --blu-color-warning-700: var(--bluui-color-warning-text);
  --blu-color-warning-800: var(--bluui-color-warning-text);
  --bluui-error-soft: var(--bluui-color-error-soft);
  --bluui-error-text: var(--bluui-color-error-text);
  --bluui-error-border: var(--bluui-color-error-border);
  --bluui-error: var(--bluui-color-error-solid);
  --blu-color-error-50: var(--bluui-color-error-soft);
  --blu-color-error-100: var(--bluui-color-error-border);
  --blu-color-error-600: var(--bluui-color-error-solid);
  --blu-color-error-700: var(--bluui-color-error-text);
  --blu-color-error-800: var(--bluui-color-error-text);
  --bluui-danger-soft: var(--bluui-color-danger-soft);
  --bluui-danger-text: var(--bluui-color-danger-text);
  --bluui-danger-border: var(--bluui-color-danger-border);
  --bluui-danger: var(--bluui-color-danger-solid);
  --blu-color-danger-50: var(--bluui-color-danger-soft);
  --blu-color-danger-100: var(--bluui-color-danger-border);
  --blu-color-danger-600: var(--bluui-color-danger-solid);
  --blu-color-danger-700: var(--bluui-color-danger-text);
  --blu-color-danger-800: var(--bluui-color-danger-text);
  --bluui-magenta-soft: var(--bluui-color-magenta-soft);
  --bluui-magenta-text: var(--bluui-color-magenta-text);
  --bluui-magenta-border: var(--bluui-color-magenta-border);
  --bluui-magenta: var(--bluui-color-magenta-solid);
  --blu-color-magenta-50: var(--bluui-color-magenta-soft);
  --blu-color-magenta-100: var(--bluui-color-magenta-border);
  --blu-color-magenta-600: var(--bluui-color-magenta-solid);
  --blu-color-magenta-700: var(--bluui-color-magenta-text);
  --blu-color-magenta-800: var(--bluui-color-magenta-text);
  --bluui-red-soft: var(--bluui-color-red-soft);
  --bluui-red-text: var(--bluui-color-red-text);
  --bluui-red-border: var(--bluui-color-red-border);
  --bluui-red: var(--bluui-color-red-solid);
  --blu-color-red-50: var(--bluui-color-red-soft);
  --blu-color-red-100: var(--bluui-color-red-border);
  --blu-color-red-600: var(--bluui-color-red-solid);
  --blu-color-red-700: var(--bluui-color-red-text);
  --blu-color-red-800: var(--bluui-color-red-text);
  --bluui-volcano-soft: var(--bluui-color-volcano-soft);
  --bluui-volcano-text: var(--bluui-color-volcano-text);
  --bluui-volcano-border: var(--bluui-color-volcano-border);
  --bluui-volcano: var(--bluui-color-volcano-solid);
  --blu-color-volcano-50: var(--bluui-color-volcano-soft);
  --blu-color-volcano-100: var(--bluui-color-volcano-border);
  --blu-color-volcano-600: var(--bluui-color-volcano-solid);
  --blu-color-volcano-700: var(--bluui-color-volcano-text);
  --blu-color-volcano-800: var(--bluui-color-volcano-text);
  --bluui-orange-soft: var(--bluui-color-orange-soft);
  --bluui-orange-text: var(--bluui-color-orange-text);
  --bluui-orange-border: var(--bluui-color-orange-border);
  --bluui-orange: var(--bluui-color-orange-solid);
  --blu-color-orange-50: var(--bluui-color-orange-soft);
  --blu-color-orange-100: var(--bluui-color-orange-border);
  --blu-color-orange-600: var(--bluui-color-orange-solid);
  --blu-color-orange-700: var(--bluui-color-orange-text);
  --blu-color-orange-800: var(--bluui-color-orange-text);
  --bluui-gold-soft: var(--bluui-color-gold-soft);
  --bluui-gold-text: var(--bluui-color-gold-text);
  --bluui-gold-border: var(--bluui-color-gold-border);
  --bluui-gold: var(--bluui-color-gold-solid);
  --blu-color-gold-50: var(--bluui-color-gold-soft);
  --blu-color-gold-100: var(--bluui-color-gold-border);
  --blu-color-gold-600: var(--bluui-color-gold-solid);
  --blu-color-gold-700: var(--bluui-color-gold-text);
  --blu-color-gold-800: var(--bluui-color-gold-text);
  --bluui-lime-soft: var(--bluui-color-lime-soft);
  --bluui-lime-text: var(--bluui-color-lime-text);
  --bluui-lime-border: var(--bluui-color-lime-border);
  --bluui-lime: var(--bluui-color-lime-solid);
  --blu-color-lime-50: var(--bluui-color-lime-soft);
  --blu-color-lime-100: var(--bluui-color-lime-border);
  --blu-color-lime-600: var(--bluui-color-lime-solid);
  --blu-color-lime-700: var(--bluui-color-lime-text);
  --blu-color-lime-800: var(--bluui-color-lime-text);
  --bluui-green-soft: var(--bluui-color-green-soft);
  --bluui-green-text: var(--bluui-color-green-text);
  --bluui-green-border: var(--bluui-color-green-border);
  --bluui-green: var(--bluui-color-green-solid);
  --blu-color-green-50: var(--bluui-color-green-soft);
  --blu-color-green-100: var(--bluui-color-green-border);
  --blu-color-green-600: var(--bluui-color-green-solid);
  --blu-color-green-700: var(--bluui-color-green-text);
  --blu-color-green-800: var(--bluui-color-green-text);
  --bluui-cyan-soft: var(--bluui-color-cyan-soft);
  --bluui-cyan-text: var(--bluui-color-cyan-text);
  --bluui-cyan-border: var(--bluui-color-cyan-border);
  --bluui-cyan: var(--bluui-color-cyan-solid);
  --blu-color-cyan-50: var(--bluui-color-cyan-soft);
  --blu-color-cyan-100: var(--bluui-color-cyan-border);
  --blu-color-cyan-600: var(--bluui-color-cyan-solid);
  --blu-color-cyan-700: var(--bluui-color-cyan-text);
  --blu-color-cyan-800: var(--bluui-color-cyan-text);
  --bluui-blue-soft: var(--bluui-color-blue-soft);
  --bluui-blue-text: var(--bluui-color-blue-text);
  --bluui-blue-border: var(--bluui-color-blue-border);
  --bluui-blue: var(--bluui-color-blue-solid);
  --blu-color-blue-50: var(--bluui-color-blue-soft);
  --blu-color-blue-100: var(--bluui-color-blue-border);
  --blu-color-blue-600: var(--bluui-color-blue-solid);
  --blu-color-blue-700: var(--bluui-color-blue-text);
  --blu-color-blue-800: var(--bluui-color-blue-text);
  --bluui-geekblue-soft: var(--bluui-color-geekblue-soft);
  --bluui-geekblue-text: var(--bluui-color-geekblue-text);
  --bluui-geekblue-border: var(--bluui-color-geekblue-border);
  --bluui-geekblue: var(--bluui-color-geekblue-solid);
  --blu-color-geekblue-50: var(--bluui-color-geekblue-soft);
  --blu-color-geekblue-100: var(--bluui-color-geekblue-border);
  --blu-color-geekblue-600: var(--bluui-color-geekblue-solid);
  --blu-color-geekblue-700: var(--bluui-color-geekblue-text);
  --blu-color-geekblue-800: var(--bluui-color-geekblue-text);
  --bluui-purple-soft: var(--bluui-color-purple-soft);
  --bluui-purple-text: var(--bluui-color-purple-text);
  --bluui-purple-border: var(--bluui-color-purple-border);
  --bluui-purple: var(--bluui-color-purple-solid);
  --blu-color-purple-50: var(--bluui-color-purple-soft);
  --blu-color-purple-100: var(--bluui-color-purple-border);
  --blu-color-purple-600: var(--bluui-color-purple-solid);
  --blu-color-purple-700: var(--bluui-color-purple-text);
  --blu-color-purple-800: var(--bluui-color-purple-text);
  --bluui-primary-light: var(--bluui-primary-soft);
  --bluui-info-soft: var(--bluui-processing-soft);
  --bluui-info-text: var(--bluui-processing-text);
  --bluui-info-border: var(--bluui-processing-border);
  --bluui-font: var(--blu-font-family);
  --blu-background: var(--bluui-background);
  --blu-surface: var(--bluui-surface);
  --blu-text: var(--bluui-text);
  --blu-text-secondary: var(--bluui-text-muted);
  --blu-border: var(--bluui-border);
  --blu-border-strong: var(--bluui-border-strong);
  --blu-focus-ring: var(--bluui-focus-shadow);
  --blu-shadow-xs: 0 1px 2px var(--bluui-shadow-color);
  --blu-shadow-sm: 0 2px 5px var(--bluui-shadow-color);
  --blu-shadow-md: var(--bluui-menu-shadow);
  --color-background-body: var(--bluui-background);
  --color-background-main: var(--bluui-surface);
  --color-primary: var(--bluui-primary);
  --color-primary-hover: var(--bluui-primary-hover);
  --color-focus-outer: var(--bluui-primary);
  --color-neutral-0: var(--bluui-surface);
  --color-neutral-1: var(--bluui-surface-muted);
  --color-neutral-2: var(--bluui-hover);
  --color-neutral-3: var(--bluui-border);
  --color-neutral-4: var(--bluui-control-border);
  --color-neutral-5: var(--bluui-text-subtle);
  --color-neutral-6: var(--bluui-text-muted);
  --color-neutral-7: var(--bluui-text-muted);
  --color-neutral-8: var(--bluui-text);
  --color-neutral-9: var(--bluui-text);
  --color-neutral-10: var(--bluui-text);
  --blu-color-gray-50: var(--bluui-surface);
  --blu-color-gray-100: var(--bluui-surface-muted);
  --blu-color-gray-200: var(--bluui-border);
  --blu-color-gray-300: var(--bluui-control-border);
  --blu-color-gray-400: var(--bluui-text-subtle);
  --blu-color-gray-500: var(--bluui-text-muted);
  --blu-color-gray-600: var(--bluui-text-muted);
  --blu-color-gray-700: var(--bluui-text);
  --blu-color-gray-800: var(--bluui-text);
  --blu-color-gray-900: var(--bluui-text);
}

/* Explicit mode overrides also support scoped preview containers. */
.grid-demo[data-bluui-theme="light"] {
  color-scheme: light;
  --bluui-background: #f5f7fb;
  --bluui-surface: #ffffff;
  --bluui-surface-muted: #f7f8fb;
  --bluui-surface-raised: #ffffff;
  --bluui-text: #182230;
  --bluui-text-muted: #5c6b80;
  --bluui-text-subtle: #626f82;
  --bluui-border: #e2e8f0;
  --bluui-border-strong: #b8c4d4;
  --bluui-control-border: #7b8799;
  --bluui-row-border: #edf0f5;
  --bluui-hover: #f0f2f7;
  --bluui-selected: #e9e6ff;
  --bluui-changed: #f5f3ff;
  --bluui-skeleton-base: #e2e8f0;
  --bluui-skeleton-shine: rgb(255 255 255 / 65%);
  --bluui-scrim: rgb(15 23 42 / 45%);
  --bluui-shadow-color: rgb(15 23 42 / 12%);
  --bluui-primary-hover: #4338ca;
  --bluui-primary-active: #3730a3;
  --bluui-on-primary: #ffffff;
  --bluui-primary: #4f46e5;
  --bluui-focus-shadow: 0 0 0 3px rgb(79 70 229 / 22%);
  --bluui-menu-shadow: 0 10px 30px rgb(15 23 42 / 16%);
  --bluui-color-default-soft: #f5f5f5;
  --bluui-color-default-text: #1d1d1d;
  --bluui-color-default-border: #d9d9d9;
  --bluui-color-default-solid: #000000;
  --bluui-color-default-contrast: #ffffff;
  --bluui-color-primary-soft: #eef2ff;
  --bluui-color-primary-text: #4338ca;
  --bluui-color-primary-border: #c7d2fe;
  --bluui-color-primary-solid: #4f46e5;
  --bluui-color-primary-contrast: #ffffff;
  --bluui-color-secondary-soft: #e2e8f0;
  --bluui-color-secondary-text: #334155;
  --bluui-color-secondary-border: #cbd5e1;
  --bluui-color-secondary-solid: #475569;
  --bluui-color-secondary-contrast: #ffffff;
  --bluui-color-success-soft: #f6ffed;
  --bluui-color-success-text: #2d6c0e;
  --bluui-color-success-border: #b7eb8f;
  --bluui-color-success-solid: #52c41a;
  --bluui-color-success-contrast: #000000;
  --bluui-color-processing-soft: #e6f4ff;
  --bluui-color-processing-text: #1054b5;
  --bluui-color-processing-border: #91caff;
  --bluui-color-processing-solid: #2681ff;
  --bluui-color-processing-contrast: #000000;
  --bluui-color-warning-soft: #fffbe6;
  --bluui-color-warning-text: #7d560a;
  --bluui-color-warning-border: #ffe58f;
  --bluui-color-warning-solid: #faad14;
  --bluui-color-warning-contrast: #000000;
  --bluui-color-error-soft: #fff2f0;
  --bluui-color-error-text: #a33133;
  --bluui-color-error-border: #ffccc7;
  --bluui-color-error-solid: #ff4d4f;
  --bluui-color-error-contrast: #000000;
  --bluui-color-danger-soft: #fff2f0;
  --bluui-color-danger-text: #a33133;
  --bluui-color-danger-border: #ffccc7;
  --bluui-color-danger-solid: #ff4d4f;
  --bluui-color-danger-contrast: #000000;
  --bluui-color-magenta-soft: #fff0f6;
  --bluui-color-magenta-text: #a9196d;
  --bluui-color-magenta-border: #ffadd2;
  --bluui-color-magenta-solid: #ed409e;
  --bluui-color-magenta-contrast: #000000;
  --bluui-color-red-soft: #fff1f0;
  --bluui-color-red-text: #b4111e;
  --bluui-color-red-border: #ffa39e;
  --bluui-color-red-solid: #e4202a;
  --bluui-color-red-contrast: #ffffff;
  --bluui-color-volcano-soft: #fff2e8;
  --bluui-color-volcano-text: #aa2d0a;
  --bluui-color-volcano-border: #ffbb96;
  --bluui-color-volcano-solid: #fa541c;
  --bluui-color-volcano-contrast: #000000;
  --bluui-color-orange-soft: #fff7e6;
  --bluui-color-orange-text: #904905;
  --bluui-color-orange-border: #ffd591;
  --bluui-color-orange-solid: #fa8c16;
  --bluui-color-orange-contrast: #000000;
  --bluui-color-gold-soft: #fffbe6;
  --bluui-color-gold-text: #835404;
  --bluui-color-gold-border: #ffe58f;
  --bluui-color-gold-solid: #faad14;
  --bluui-color-gold-contrast: #000000;
  --bluui-color-lime-soft: #fcffe6;
  --bluui-color-lime-text: #486803;
  --bluui-color-lime-border: #eaff8f;
  --bluui-color-lime-solid: #a0d911;
  --bluui-color-lime-contrast: #000000;
  --bluui-color-green-soft: #f6ffed;
  --bluui-color-green-text: #276d09;
  --bluui-color-green-border: #b7eb8f;
  --bluui-color-green-solid: #52c41a;
  --bluui-color-green-contrast: #000000;
  --bluui-color-cyan-soft: #e6fffb;
  --bluui-color-cyan-text: #06686c;
  --bluui-color-cyan-border: #87e8de;
  --bluui-color-cyan-solid: #13c2c2;
  --bluui-color-cyan-contrast: #000000;
  --bluui-color-blue-soft: #e6f4ff;
  --bluui-color-blue-text: #0851c8;
  --bluui-color-blue-border: #91caff;
  --bluui-color-blue-solid: #2681ff;
  --bluui-color-blue-contrast: #000000;
  --bluui-color-geekblue-soft: #f0f5ff;
  --bluui-color-geekblue-text: #1d39c4;
  --bluui-color-geekblue-border: #adc6ff;
  --bluui-color-geekblue-solid: #2f54eb;
  --bluui-color-geekblue-contrast: #ffffff;
  --bluui-color-purple-soft: #f9f0ff;
  --bluui-color-purple-text: #531dab;
  --bluui-color-purple-border: #d3adf7;
  --bluui-color-purple-solid: #722ed1;
  --bluui-color-purple-contrast: #ffffff;
  --bluui-default-soft: var(--bluui-color-default-soft);
  --bluui-default-text: var(--bluui-color-default-text);
  --bluui-default-border: var(--bluui-color-default-border);
  --bluui-default: var(--bluui-color-default-solid);
  --blu-color-default-50: var(--bluui-color-default-soft);
  --blu-color-default-100: var(--bluui-color-default-border);
  --blu-color-default-600: var(--bluui-color-default-solid);
  --blu-color-default-700: var(--bluui-color-default-text);
  --blu-color-default-800: var(--bluui-color-default-text);
  --bluui-primary-soft: var(--bluui-color-primary-soft);
  --bluui-primary-text: var(--bluui-color-primary-text);
  --bluui-primary-border: var(--bluui-color-primary-border);
  --blu-color-primary-50: var(--bluui-color-primary-soft);
  --blu-color-primary-100: var(--bluui-color-primary-border);
  --blu-color-primary-600: var(--bluui-color-primary-solid);
  --blu-color-primary-700: var(--bluui-color-primary-text);
  --blu-color-primary-800: var(--bluui-color-primary-text);
  --bluui-secondary-soft: var(--bluui-color-secondary-soft);
  --bluui-secondary-text: var(--bluui-color-secondary-text);
  --bluui-secondary-border: var(--bluui-color-secondary-border);
  --bluui-secondary: var(--bluui-color-secondary-solid);
  --blu-color-secondary-50: var(--bluui-color-secondary-soft);
  --blu-color-secondary-100: var(--bluui-color-secondary-border);
  --blu-color-secondary-600: var(--bluui-color-secondary-solid);
  --blu-color-secondary-700: var(--bluui-color-secondary-text);
  --blu-color-secondary-800: var(--bluui-color-secondary-text);
  --bluui-success-soft: var(--bluui-color-success-soft);
  --bluui-success-text: var(--bluui-color-success-text);
  --bluui-success-border: var(--bluui-color-success-border);
  --bluui-success: var(--bluui-color-success-solid);
  --blu-color-success-50: var(--bluui-color-success-soft);
  --blu-color-success-100: var(--bluui-color-success-border);
  --blu-color-success-600: var(--bluui-color-success-solid);
  --blu-color-success-700: var(--bluui-color-success-text);
  --blu-color-success-800: var(--bluui-color-success-text);
  --bluui-processing-soft: var(--bluui-color-processing-soft);
  --bluui-processing-text: var(--bluui-color-processing-text);
  --bluui-processing-border: var(--bluui-color-processing-border);
  --bluui-processing: var(--bluui-color-processing-solid);
  --blu-color-processing-50: var(--bluui-color-processing-soft);
  --blu-color-processing-100: var(--bluui-color-processing-border);
  --blu-color-processing-600: var(--bluui-color-processing-solid);
  --blu-color-processing-700: var(--bluui-color-processing-text);
  --blu-color-processing-800: var(--bluui-color-processing-text);
  --bluui-warning-soft: var(--bluui-color-warning-soft);
  --bluui-warning-text: var(--bluui-color-warning-text);
  --bluui-warning-border: var(--bluui-color-warning-border);
  --bluui-warning: var(--bluui-color-warning-solid);
  --blu-color-warning-50: var(--bluui-color-warning-soft);
  --blu-color-warning-100: var(--bluui-color-warning-border);
  --blu-color-warning-600: var(--bluui-color-warning-solid);
  --blu-color-warning-700: var(--bluui-color-warning-text);
  --blu-color-warning-800: var(--bluui-color-warning-text);
  --bluui-error-soft: var(--bluui-color-error-soft);
  --bluui-error-text: var(--bluui-color-error-text);
  --bluui-error-border: var(--bluui-color-error-border);
  --bluui-error: var(--bluui-color-error-solid);
  --blu-color-error-50: var(--bluui-color-error-soft);
  --blu-color-error-100: var(--bluui-color-error-border);
  --blu-color-error-600: var(--bluui-color-error-solid);
  --blu-color-error-700: var(--bluui-color-error-text);
  --blu-color-error-800: var(--bluui-color-error-text);
  --bluui-danger-soft: var(--bluui-color-danger-soft);
  --bluui-danger-text: var(--bluui-color-danger-text);
  --bluui-danger-border: var(--bluui-color-danger-border);
  --bluui-danger: var(--bluui-color-danger-solid);
  --blu-color-danger-50: var(--bluui-color-danger-soft);
  --blu-color-danger-100: var(--bluui-color-danger-border);
  --blu-color-danger-600: var(--bluui-color-danger-solid);
  --blu-color-danger-700: var(--bluui-color-danger-text);
  --blu-color-danger-800: var(--bluui-color-danger-text);
  --bluui-magenta-soft: var(--bluui-color-magenta-soft);
  --bluui-magenta-text: var(--bluui-color-magenta-text);
  --bluui-magenta-border: var(--bluui-color-magenta-border);
  --bluui-magenta: var(--bluui-color-magenta-solid);
  --blu-color-magenta-50: var(--bluui-color-magenta-soft);
  --blu-color-magenta-100: var(--bluui-color-magenta-border);
  --blu-color-magenta-600: var(--bluui-color-magenta-solid);
  --blu-color-magenta-700: var(--bluui-color-magenta-text);
  --blu-color-magenta-800: var(--bluui-color-magenta-text);
  --bluui-red-soft: var(--bluui-color-red-soft);
  --bluui-red-text: var(--bluui-color-red-text);
  --bluui-red-border: var(--bluui-color-red-border);
  --bluui-red: var(--bluui-color-red-solid);
  --blu-color-red-50: var(--bluui-color-red-soft);
  --blu-color-red-100: var(--bluui-color-red-border);
  --blu-color-red-600: var(--bluui-color-red-solid);
  --blu-color-red-700: var(--bluui-color-red-text);
  --blu-color-red-800: var(--bluui-color-red-text);
  --bluui-volcano-soft: var(--bluui-color-volcano-soft);
  --bluui-volcano-text: var(--bluui-color-volcano-text);
  --bluui-volcano-border: var(--bluui-color-volcano-border);
  --bluui-volcano: var(--bluui-color-volcano-solid);
  --blu-color-volcano-50: var(--bluui-color-volcano-soft);
  --blu-color-volcano-100: var(--bluui-color-volcano-border);
  --blu-color-volcano-600: var(--bluui-color-volcano-solid);
  --blu-color-volcano-700: var(--bluui-color-volcano-text);
  --blu-color-volcano-800: var(--bluui-color-volcano-text);
  --bluui-orange-soft: var(--bluui-color-orange-soft);
  --bluui-orange-text: var(--bluui-color-orange-text);
  --bluui-orange-border: var(--bluui-color-orange-border);
  --bluui-orange: var(--bluui-color-orange-solid);
  --blu-color-orange-50: var(--bluui-color-orange-soft);
  --blu-color-orange-100: var(--bluui-color-orange-border);
  --blu-color-orange-600: var(--bluui-color-orange-solid);
  --blu-color-orange-700: var(--bluui-color-orange-text);
  --blu-color-orange-800: var(--bluui-color-orange-text);
  --bluui-gold-soft: var(--bluui-color-gold-soft);
  --bluui-gold-text: var(--bluui-color-gold-text);
  --bluui-gold-border: var(--bluui-color-gold-border);
  --bluui-gold: var(--bluui-color-gold-solid);
  --blu-color-gold-50: var(--bluui-color-gold-soft);
  --blu-color-gold-100: var(--bluui-color-gold-border);
  --blu-color-gold-600: var(--bluui-color-gold-solid);
  --blu-color-gold-700: var(--bluui-color-gold-text);
  --blu-color-gold-800: var(--bluui-color-gold-text);
  --bluui-lime-soft: var(--bluui-color-lime-soft);
  --bluui-lime-text: var(--bluui-color-lime-text);
  --bluui-lime-border: var(--bluui-color-lime-border);
  --bluui-lime: var(--bluui-color-lime-solid);
  --blu-color-lime-50: var(--bluui-color-lime-soft);
  --blu-color-lime-100: var(--bluui-color-lime-border);
  --blu-color-lime-600: var(--bluui-color-lime-solid);
  --blu-color-lime-700: var(--bluui-color-lime-text);
  --blu-color-lime-800: var(--bluui-color-lime-text);
  --bluui-green-soft: var(--bluui-color-green-soft);
  --bluui-green-text: var(--bluui-color-green-text);
  --bluui-green-border: var(--bluui-color-green-border);
  --bluui-green: var(--bluui-color-green-solid);
  --blu-color-green-50: var(--bluui-color-green-soft);
  --blu-color-green-100: var(--bluui-color-green-border);
  --blu-color-green-600: var(--bluui-color-green-solid);
  --blu-color-green-700: var(--bluui-color-green-text);
  --blu-color-green-800: var(--bluui-color-green-text);
  --bluui-cyan-soft: var(--bluui-color-cyan-soft);
  --bluui-cyan-text: var(--bluui-color-cyan-text);
  --bluui-cyan-border: var(--bluui-color-cyan-border);
  --bluui-cyan: var(--bluui-color-cyan-solid);
  --blu-color-cyan-50: var(--bluui-color-cyan-soft);
  --blu-color-cyan-100: var(--bluui-color-cyan-border);
  --blu-color-cyan-600: var(--bluui-color-cyan-solid);
  --blu-color-cyan-700: var(--bluui-color-cyan-text);
  --blu-color-cyan-800: var(--bluui-color-cyan-text);
  --bluui-blue-soft: var(--bluui-color-blue-soft);
  --bluui-blue-text: var(--bluui-color-blue-text);
  --bluui-blue-border: var(--bluui-color-blue-border);
  --bluui-blue: var(--bluui-color-blue-solid);
  --blu-color-blue-50: var(--bluui-color-blue-soft);
  --blu-color-blue-100: var(--bluui-color-blue-border);
  --blu-color-blue-600: var(--bluui-color-blue-solid);
  --blu-color-blue-700: var(--bluui-color-blue-text);
  --blu-color-blue-800: var(--bluui-color-blue-text);
  --bluui-geekblue-soft: var(--bluui-color-geekblue-soft);
  --bluui-geekblue-text: var(--bluui-color-geekblue-text);
  --bluui-geekblue-border: var(--bluui-color-geekblue-border);
  --bluui-geekblue: var(--bluui-color-geekblue-solid);
  --blu-color-geekblue-50: var(--bluui-color-geekblue-soft);
  --blu-color-geekblue-100: var(--bluui-color-geekblue-border);
  --blu-color-geekblue-600: var(--bluui-color-geekblue-solid);
  --blu-color-geekblue-700: var(--bluui-color-geekblue-text);
  --blu-color-geekblue-800: var(--bluui-color-geekblue-text);
  --bluui-purple-soft: var(--bluui-color-purple-soft);
  --bluui-purple-text: var(--bluui-color-purple-text);
  --bluui-purple-border: var(--bluui-color-purple-border);
  --bluui-purple: var(--bluui-color-purple-solid);
  --blu-color-purple-50: var(--bluui-color-purple-soft);
  --blu-color-purple-100: var(--bluui-color-purple-border);
  --blu-color-purple-600: var(--bluui-color-purple-solid);
  --blu-color-purple-700: var(--bluui-color-purple-text);
  --blu-color-purple-800: var(--bluui-color-purple-text);
  --bluui-primary-light: var(--bluui-primary-soft);
  --bluui-info-soft: var(--bluui-processing-soft);
  --bluui-info-text: var(--bluui-processing-text);
  --bluui-info-border: var(--bluui-processing-border);
  --bluui-font: var(--blu-font-family);
  --blu-background: var(--bluui-background);
  --blu-surface: var(--bluui-surface);
  --blu-text: var(--bluui-text);
  --blu-text-secondary: var(--bluui-text-muted);
  --blu-border: var(--bluui-border);
  --blu-border-strong: var(--bluui-border-strong);
  --blu-focus-ring: var(--bluui-focus-shadow);
  --blu-shadow-xs: 0 1px 2px var(--bluui-shadow-color);
  --blu-shadow-sm: 0 2px 5px var(--bluui-shadow-color);
  --blu-shadow-md: var(--bluui-menu-shadow);
  --color-background-body: var(--bluui-background);
  --color-background-main: var(--bluui-surface);
  --color-primary: var(--bluui-primary);
  --color-primary-hover: var(--bluui-primary-hover);
  --color-focus-outer: var(--bluui-primary);
  --color-neutral-0: var(--bluui-surface);
  --color-neutral-1: var(--bluui-surface-muted);
  --color-neutral-2: var(--bluui-hover);
  --color-neutral-3: var(--bluui-border);
  --color-neutral-4: var(--bluui-control-border);
  --color-neutral-5: var(--bluui-text-subtle);
  --color-neutral-6: var(--bluui-text-muted);
  --color-neutral-7: var(--bluui-text-muted);
  --color-neutral-8: var(--bluui-text);
  --color-neutral-9: var(--bluui-text);
  --color-neutral-10: var(--bluui-text);
  --blu-color-gray-50: var(--bluui-surface);
  --blu-color-gray-100: var(--bluui-surface-muted);
  --blu-color-gray-200: var(--bluui-border);
  --blu-color-gray-300: var(--bluui-control-border);
  --blu-color-gray-400: var(--bluui-text-subtle);
  --blu-color-gray-500: var(--bluui-text-muted);
  --blu-color-gray-600: var(--bluui-text-muted);
  --blu-color-gray-700: var(--bluui-text);
  --blu-color-gray-800: var(--bluui-text);
  --blu-color-gray-900: var(--bluui-text);
}

/* BluGrid 0.4.0. Set --bluui-* tokens on the host or an ancestor.
   Button appearance comes from the consumer's BluUITheme. */
.blu-grid, .blu-grid-shell, .blu-grid-edit-toolbar, .blu-grid-column-panel, .blu-grid-view-toolbar {
  --blu-primary: var(--bluui-primary, #4f46e5);
  --blu-surface: var(--bluui-surface, #fff);
  --blu-surface-muted: var(--bluui-surface-muted, #f8fafc);
  --blu-text: var(--bluui-text, #182230);
  --blu-text-muted: var(--bluui-text-muted, #64748b);
  --blu-border: var(--bluui-border, #e2e8f0);
  --blu-row-border: var(--bluui-row-border, #eef0f4);
  --blu-control-border: var(--bluui-control-border, #cbd5e1);
  --blu-selected: var(--bluui-selected, #e0e7ff);
  --blu-hover: var(--bluui-hover, #f8faff);
  --blu-changed: var(--bluui-changed, #f5f3ff);
  --blu-danger: var(--bluui-danger, #b42318);
  --blu-radius: var(--bluui-radius, 10px);
  --blu-control-radius: var(--bluui-control-radius, 6px);
  --blu-font: var(--bluui-font, Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif);
  --blu-font-size: var(--bluui-grid-font-size, 14px);
  --blu-header-font-size: var(--bluui-grid-header-font-size, 12px);
  --blu-focus-shadow: var(--bluui-focus-shadow, 0 0 0 3px rgb(79 70 229 / 16%));
  --blu-menu-shadow: var(--bluui-menu-shadow, 0 8px 24px rgb(15 23 42 / 12%));
  width: 100%; min-width: 0; box-sizing: border-box;
  font-family: var(--blu-font);
}
.blu-grid .blu-grid-number { text-align: right; font-variant-numeric: tabular-nums; }
.blu-grid .blu-grid-number-header .ag-header-cell-label { justify-content: flex-end; }
.blu-grid .blu-grid-number-header .ag-cell-label-container { gap: 6px; }
.blu-grid .blu-grid-boolean { color: var(--blu-text-muted); }
.blu-grid .ag-root-wrapper { box-shadow: 0 1px 3px rgb(15 23 42 / 3%); }
.blu-grid .ag-header-cell-text { letter-spacing: .01em; }
.blu-grid .ag-cell { font-variant-numeric: tabular-nums; }
.blu-grid .ag-row.blu-grid-row-changed { background-color: var(--blu-changed); }
.blu-grid .ag-row.blu-grid-row-changed.ag-row-selected { background-color: var(--blu-selected); }
.blu-grid .ag-row.blu-grid-row-changed::after {
  content: ''; position: absolute; inset: 0 auto 0 0; width: 3px; background: var(--blu-primary); pointer-events: none;
}
.blu-grid .blu-grid-cell-changed {
  font-weight: 600; text-decoration: underline dotted var(--blu-primary); text-underline-offset: 5px;
}
.blu-grid .blu-grid-editor {
  width: 100%; min-width: 0; height: 100%; box-sizing: border-box; padding: 0 12px;
  border: 2px solid var(--blu-primary); border-radius: var(--blu-control-radius); background: var(--blu-surface);
  color: var(--blu-text); font: inherit; outline: none;
}
.blu-grid select.blu-grid-editor {
  appearance: none; -webkit-appearance: none; cursor: pointer; margin: 0; padding-inline-end: 32px;
  background-image: linear-gradient(45deg, transparent 50%, var(--blu-text-muted) 50%),
    linear-gradient(135deg, var(--blu-text-muted) 50%, transparent 50%);
  background-position: right 18px center, right 13px center;
  background-size: 5px 5px; background-repeat: no-repeat;
}
.blu-grid .blu-grid-editor[aria-invalid="true"] { border-color: var(--blu-danger); }
.blu-grid .blu-grid-datetime-editor {
  width: 340px; max-width: calc(100vw - 32px); padding: 12px;
  display: flex; flex-direction: column; gap: 8px; box-sizing: border-box;
  border: 1px solid var(--blu-border); border-radius: var(--blu-radius);
  background: var(--blu-surface); box-shadow: var(--blu-menu-shadow); color: var(--blu-text);
}
.blu-grid .blu-grid-datetime-editor .blu-grid-editor { height: 40px; flex: none; }
.blu-grid .blu-grid-datetime-editor [hidden] { display: none; }
.blu-grid .blu-grid-editor-zone { color: var(--blu-text-muted); font-size: 12px; line-height: 1.4; }
.blu-grid-edit-toolbar {
  display: flex; flex-wrap: wrap; align-items: center; gap: 12px;
  padding: 12px 16px; margin-bottom: 8px; border: 1px solid var(--blu-border);
  border-inline-start: 3px solid var(--blu-primary); border-radius: var(--blu-radius);
  background: var(--blu-surface); color: var(--blu-text); font-size: var(--blu-font-size);
}
.blu-grid-edit-toolbar[hidden] { display: none; }
.blu-grid-edit-count {
  display: inline-flex; align-items: center; margin-inline-end: auto; padding: 6px 10px;
  border-radius: var(--blu-control-radius); background: var(--blu-changed); font-weight: 600; line-height: 1.4;
}
.blu-grid-edit-actions {
  display: flex; flex-wrap: wrap; align-items: center; gap: 8px; width: auto; min-width: 0; margin-inline-start: auto;
}

/* Grid frame and shared toolbar. Native Button Blocks retain their behavior;
   their generated wrappers size to content inside this component only. */
.blu-grid-shell { border:1px solid var(--blu-border); border-radius:var(--blu-radius); background:var(--blu-surface); box-shadow:0 2px 6px rgb(15 23 42 / 3%); }
.blu-grid-shell .ag-root-wrapper { border:0; box-shadow:none; border-radius:0 0 var(--blu-radius) var(--blu-radius); }
.blu-grid-view-toolbar { display:flex; align-items:center; flex-wrap:wrap; justify-content:flex-end; gap:8px; position:relative; padding:12px; margin:0; min-height:56px; font-size:13px; color:var(--blu-text-muted); border-bottom:1px solid var(--blu-border); border-radius:var(--blu-radius) var(--blu-radius) 0 0; background:var(--blu-surface); overflow:visible; }
.blu-grid-edit-actions > [data-block], .blu-grid-view-toolbar > [data-block], .blu-grid-column-actions > [data-block] { width:auto; min-width:0; flex:0 0 auto; }
.blu-grid-view-trigger,.blu-grid-view-actions { width:auto; min-width:0; flex:0 1 auto; }
.blu-grid-view-actions,.blu-grid-view-actions > [data-block],.blu-grid-view-actions > [data-container] { display:flex; align-items:center; flex-wrap:wrap; gap:8px; width:auto; }
.blu-grid-view-toolbar button,.blu-grid-column-popover button,.blu-grid-edit-actions button { box-sizing:border-box; min-height:34px; height:34px; padding:6px 11px; font-size:12px; line-height:20px; border-radius:7px; gap:7px; white-space:nowrap; }
.blu-grid-view-trigger button { display:inline-flex; align-items:center; justify-content:center; background:var(--blu-surface); color:var(--blu-text); border:1px solid var(--blu-border); box-shadow:none; }
.blu-grid-view-trigger button:hover,.blu-grid-view-trigger button[aria-expanded="true"] { background:var(--blu-selected); color:var(--blu-primary); border-color:var(--blu-primary); }
.blu-grid-search { display:flex; align-items:center; flex:1 1 250px; width:auto; min-width:0; gap:8px; margin-inline-end:auto; }
.blu-grid-search input { flex:1 1 200px; width:100%; min-width:100px; max-width:300px; box-sizing:border-box; height:34px; margin:0; border:1px solid var(--blu-border); border-radius:7px; background:var(--blu-surface-muted); font:inherit; font-size:13px; padding:7px 11px; }
.blu-grid-search > [data-block] { flex:0 0 auto; width:auto; }
.blu-grid-view-message,.blu-grid-control-message { font-size:12px; color:var(--blu-text-muted); overflow-wrap:anywhere; }
.blu-grid-view-message:empty { display:none; }
.blu-grid-column-error,.blu-grid-tools-error { color:var(--blu-danger,#b42318); font-size:12px; line-height:1.5; margin:4px 0; overflow-wrap:anywhere; }

/* Column settings: one clear hierarchy, a scrolling options body, and a stable
   footer. Position and available height are supplied by column-panel.js. */
.blu-grid-column-panel { background:var(--blu-surface); border:1px solid var(--blu-border); border-radius:12px; box-sizing:border-box; color:var(--blu-text); }
.blu-grid-column-popover { position:absolute; inset-inline-end:0; top:calc(100% + 8px); z-index:40; display:flex; flex-direction:column; gap:0; width:360px; max-width:calc(100vw - 32px); padding:18px; margin:0; box-shadow:0 12px 40px rgb(15 23 42 / 16%),0 2px 8px rgb(15 23 42 / 5%); text-align:start; overflow:auto; }
.blu-grid-column-title { display:block; margin:0 0 5px; color:var(--blu-text); font-size:15px; font-weight:650; line-height:1.4; }
.blu-grid-column-hint { display:block; margin-bottom:16px; color:var(--blu-text-muted); font-size:12px; line-height:1.55; }
.blu-grid-display-options { display:grid; gap:12px; padding:0 0 16px; margin-bottom:16px; border-bottom:1px solid var(--blu-border); }
.blu-grid-preference-heading { color:var(--blu-text-muted); font-size:10px; font-weight:650; letter-spacing:.11em; line-height:1.5; }
.blu-grid-tool-field { display:flex; justify-content:space-between; align-items:center; gap:12px; font-size:12px; font-weight:500; }
.blu-grid-tool-select { appearance:none; -webkit-appearance:none; box-sizing:border-box; min-width:105px; height:32px; margin:0; border:1px solid var(--blu-border); border-radius:6px; background:var(--blu-surface) var(--blu-grid-select-arrow) no-repeat right 9px center / 12px; color:var(--blu-text); font:inherit; font-size:12px; line-height:18px; padding:6px 26px 6px 10px; cursor:pointer; }
.blu-grid-tool-field select { width:145px; }
.blu-grid-floating-toggle { display:flex; align-items:center; gap:9px; font-size:12px; color:var(--blu-text); cursor:pointer; }
.blu-grid-tool-buttons { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.blu-grid-tool-buttons > button:last-child { grid-column:1 / -1; }
.blu-grid-preference-columns { display:grid; gap:3px; }
.blu-grid-preference-columns > .blu-grid-preference-heading { margin-bottom:5px; }
.blu-grid-preference-column { display:grid; grid-template-columns:minmax(0,1fr) 105px; align-items:center; gap:12px; min-height:40px; padding:4px 0; border-bottom:1px solid var(--blu-row-border); }
.blu-grid-preference-column:last-child { border-bottom:0; }
.blu-grid-preference-column label { display:flex; align-items:center; gap:9px; margin:0; font-size:12px; font-weight:400; color:var(--blu-text); cursor:pointer; }
.blu-grid-column-list { min-height:0; max-height:280px; overflow:auto; }
.blu-grid-column-choice { display:flex; align-items:center; gap:9px; min-height:36px; font-size:12px; }
.blu-grid-column-actions { display:flex; flex-wrap:wrap; gap:8px; flex:none; padding-top:14px; margin-top:14px; border-top:1px solid var(--blu-border); }
.blu-grid-column-command-grid { display:grid; gap:8px; width:100%; }
.blu-grid-column-command-row { display:flex; gap:8px; width:100%; }
.blu-grid-column-command-row > .blu-grid-column-command-slot { flex:1 1 0; min-width:0; width:0; }
.blu-grid-column-command-slot > [data-block] { display:block; width:100%; }
.blu-grid-column-command-slot button { width:100%; }
.blu-grid-column-end { display:flex; align-items:center; justify-content:flex-end; flex-wrap:wrap; gap:8px; width:auto; min-width:0; max-width:100%; margin-inline-start:auto; }
.blu-grid-column-done,.blu-grid-column-done > [data-block] { width:auto; min-width:0; flex:0 0 auto; }
.blu-grid-column-end .blu-grid-view-message { flex-basis:100%; }
.blu-grid-view-toolbar [hidden],.blu-grid-column-popover[hidden],.blu-grid-tools-error[hidden] { display:none; }

/* Selection and bulk editing use one compact command strip. Application
   commands are visually secondary until records have been selected. */
.blu-grid-selection-tools { display:flex; flex-wrap:wrap; align-items:center; gap:8px; padding:10px 12px; background:var(--blu-surface-muted,#f8fafc); border-bottom:1px solid var(--blu-border,#e2e8f0); }
.has-selection .blu-grid-selection-tools { background:var(--bluui-primary-soft, #f7f7ff); }
.blu-grid-selection-count { display:inline-flex; align-items:center; min-width:78px; margin-inline-end:4px; font-size:12px; font-weight:500; color:var(--blu-text-muted,#64748b); }
.has-selection .blu-grid-selection-count { color:var(--blu-primary,#4f46e5); font-weight:650; }
.blu-grid-tool-button { display:inline-flex; align-items:center; justify-content:center; gap:7px; appearance:none; box-sizing:border-box; border:1px solid var(--blu-border,#dbe3ee); border-radius:6px; padding:6px 10px; height:32px; min-height:32px; background:var(--blu-surface,#fff); color:var(--blu-text,#334155); font:inherit; font-size:12px; line-height:18px; cursor:pointer; }
.blu-grid-tool-button:hover:not(:disabled) { background:var(--blu-hover,#f8faff); border-color:var(--bluui-primary-border, #b8bcf5); color:var(--blu-primary,#4f46e5); }
.blu-grid-tool-button:disabled { opacity:.45; cursor:default; }
.blu-grid-shell .blu-grid-edit-toolbar { margin:0; padding:10px 12px; border-width:0 0 1px 3px; border-radius:0; background:var(--bluui-primary-soft, #faf8ff); }
.blu-grid-edit-count { padding:4px 8px; font-size:12px; }
.blu-grid-icon { display:block; width:16px; height:16px; flex:0 0 16px; pointer-events:none; }

/* Table chrome and native AG Grid pagination share the toolbar proportions. */
.blu-grid .ag-header { border-bottom:1px solid var(--blu-border); }
.blu-grid .ag-header-cell { font-weight:600; }
.blu-grid .ag-header-row-column-filter { background:var(--blu-surface); }
.blu-grid .ag-floating-filter-input { min-width:0; }
/* The header identifies each filter; remove the redundant search glyph so it
   cannot overlap the browser-native date segments. */
.blu-grid .ag-floating-filter-input .ag-input-field-search-icon { display:none; }
.blu-grid .ag-floating-filter-input input { height:30px; min-height:30px; padding-inline:9px; border-radius:6px; border-color:var(--blu-border); background:var(--blu-surface-muted); font-size:12px; }
.blu-grid .ag-floating-filter-button-button { width:24px; height:28px; border-radius:5px; color:var(--blu-text-muted); }
.blu-grid .ag-floating-filter-button-button:hover { background:var(--blu-selected); color:var(--blu-primary); }
.blu-grid .ag-paging-panel { display:flex; align-items:center; min-height:56px; height:auto; padding:10px 14px; border-top:1px solid var(--blu-border); background:var(--blu-surface); color:var(--blu-text-muted); font-size:12px; gap:12px; }
/* AG Grid 36 wraps its visible pagination controls in this content element. */
.blu-grid .ag-paging-panel-content { display:flex; align-items:center; flex-wrap:wrap; width:100%; min-width:0; gap:12px; }
.blu-grid .ag-paging-page-size { margin:0; gap:8px; }
.blu-grid .ag-paging-row-summary-panel { margin-inline-start:auto; margin-inline-end:8px; gap:5px; }
.blu-grid .ag-paging-page-summary-panel { gap:7px; margin:0; }
.blu-grid .ag-paging-button { display:inline-flex; align-items:center; justify-content:center; flex:none; width:30px; height:30px; margin:0; border:1px solid var(--blu-border); border-radius:6px; background:var(--blu-surface); color:var(--blu-text); }
.blu-grid .ag-paging-button:hover:not(.ag-disabled) { color:var(--blu-primary); border-color:var(--blu-primary); background:var(--blu-hover); }
.blu-grid .ag-paging-button.ag-disabled { opacity:.35; background:var(--blu-surface-muted); }
.blu-grid .ag-paging-panel .ag-picker-field-wrapper { min-height:30px; height:30px; border:1px solid var(--blu-border); border-radius:6px; background:var(--blu-surface); box-shadow:none; }
.blu-grid .ag-paging-panel .ag-text-field-input { width:40px; height:30px; min-height:30px; margin:0; padding:4px; border:1px solid var(--blu-border); border-radius:6px; font-size:12px; text-align:center; background:var(--blu-surface-muted); }

/* Row commands use an icon button and an owned popover outside the scrolling
   viewport. The renderer removes its menu/listeners when recycled or destroyed. */
.blu-grid-row-actions { display:inline-flex; align-items:center; justify-content:center; height:100%; }
.blu-grid-row-action-trigger { display:inline-flex; align-items:center; justify-content:center; width:30px; height:28px; padding:0; border:1px solid transparent; border-radius:6px; background:transparent; color:var(--blu-text-muted,#64748b); cursor:pointer; vertical-align:middle; }
.blu-grid-row-action-trigger:hover,.blu-grid-row-action-trigger[aria-expanded="true"] { border-color:var(--blu-border,#dbe3ee); background:var(--blu-surface-muted,#f8fafc); color:var(--blu-primary,#4f46e5); }
.blu-grid-row-menu { position:fixed; z-index:10000; box-sizing:border-box; width:210px; padding:6px; border:1px solid var(--bluui-border,#dbe3ee); border-radius:10px; background:var(--bluui-surface,#fff); color:var(--bluui-text,#334155); box-shadow:0 10px 32px rgb(15 23 42 / 15%); font-family:var(--bluui-font,Inter,ui-sans-serif,system-ui,sans-serif); }
.blu-grid-row-menu__title { display:block; padding:8px 10px; color:var(--bluui-text-muted,#64748b); font-size:9px; font-weight:650; letter-spacing:.1em; }
.blu-grid-row-menu__item { display:flex; align-items:center; gap:10px; width:100%; padding:9px 10px; border:0; border-radius:6px; background:transparent; color:inherit; font:inherit; font-size:12px; text-align:start; cursor:pointer; }
.blu-grid-row-menu__item:hover,.blu-grid-row-menu__item:focus-visible { background:var(--bluui-surface-muted, #eef2ff); color:var(--bluui-primary,#4f46e5); outline:none; }
.blu-grid-row-menu__item:disabled { opacity:.4; cursor:default; }

/* Expanded record: a quiet summary header, then readable labeled values.
   Content scrolls within the configured detail height; records still count once. */
.blu-grid-detail-toggle { display:inline-flex; align-items:center; justify-content:center; border:0; background:transparent; border-radius:5px; width:26px; height:26px; padding:0; color:var(--bluui-text-muted,#64748b); cursor:pointer; vertical-align:middle; }
.blu-grid-detail-toggle:hover { background:var(--bluui-selected,#e0e7ff); color:var(--bluui-primary,#4f46e5); }
.blu-grid-details { box-sizing:border-box; display:flex; flex-direction:column; height:100%; background:var(--bluui-surface-muted,#f8fafc); color:var(--bluui-text,#334155); border-block:1px solid var(--bluui-border,#dbe3ee); border-inline-start:3px solid var(--bluui-primary,#4f46e5); }
.blu-grid-details__header { display:flex; align-items:center; gap:12px; flex:0 0 57px; padding:0 16px; background:var(--bluui-surface,#fff); border-bottom:1px solid var(--bluui-border,#dbe3ee); }
.blu-grid-details__title { display:grid; gap:2px; flex:1; min-width:0; }
.blu-grid-details__eyebrow { color:var(--bluui-primary,#4f46e5); font-size:9px; font-weight:650; letter-spacing:.1em; line-height:1.4; }
.blu-grid-details__title strong { overflow:hidden; text-overflow:ellipsis; font-size:13px; font-weight:600; line-height:1.5; }
.blu-grid-details__fields { display:grid; grid-template-columns:repeat(auto-fit,minmax(190px,1fr)); gap:16px 24px; overflow:auto; margin:0; padding:18px 22px; }
.blu-grid-details__field { min-width:0; }
.blu-grid-details__field dt { color:var(--bluui-text-muted,#64748b); font-size:11px; line-height:1.4; margin-bottom:5px; }
.blu-grid-details__field dd { margin:0; white-space:pre-wrap; overflow-wrap:anywhere; font-size:13px; line-height:1.5; font-weight:500; }

/* Optional cell renderers use BluUI's restrained semantic colors. */
.blu-grid-cell-badge { display:inline-flex; align-items:center; max-width:100%; padding:2px 9px; line-height:22px; border-radius:999px; font-size:12px; background:var(--bluui-surface-muted, #f1f5f9); color:var(--bluui-text-muted, #475569); }
.blu-grid-cell-action { border:0; background:transparent; color:var(--bluui-primary,#4f46e5); font:inherit; cursor:pointer; padding:4px 8px; border-radius:6px; }
.blu-grid-cell-action:hover { background:var(--bluui-surface-muted, #eef2ff); }
.blu-grid-cell-action:disabled,.blu-grid-detail-toggle:disabled,.blu-grid-row-action-trigger:disabled { opacity:.45; cursor:default; }
.blu-grid-cell-progress { width:100%; height:10px; accent-color:var(--bluui-primary,#4f46e5); }
.blu-grid-tool-button:focus-visible,.blu-grid-tool-select:focus-visible,.blu-grid-row-action-trigger:focus-visible,.blu-grid-detail-toggle:focus-visible,.blu-grid-view-toolbar button:focus-visible,.blu-grid-column-popover button:focus-visible,.blu-grid-floating-toggle input:focus-visible,.blu-grid-preference-column input[type="checkbox"]:focus-visible { outline:2px solid var(--bluui-primary,#4f46e5); outline-offset:2px; }

/* Small screens keep commands and page navigation usable without shrinking
   their touch targets; the grid itself retains horizontal scrolling. */
@media (max-width:700px) {
  .blu-grid-search { flex-basis:100%; }
  .blu-grid-search input { max-width:none; }
  .blu-grid .ag-paging-panel { flex-wrap:wrap; gap:10px; padding:10px; }
  .blu-grid .ag-paging-row-summary-panel { margin-inline-start:auto; }
  .blu-grid .ag-paging-page-summary-panel { margin-inline-start:auto; }
  .blu-grid-selection-tools { gap:6px; }
  .blu-grid-column-popover { width:min(360px,calc(100vw - 32px)); }
}

/* Inline mask icons follow the button color without a font or HTTP request. */
.blu-grid-shell,.blu-grid-column-panel,.blu-grid-details { --blu-grid-select-arrow:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%2364748b%22%20stroke-width%3D%221.7%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M6%209l6%206%206-6%22%2F%3E%3C%2Fsvg%3E"); --blu-grid-checkbox-tick:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22white%22%20stroke-width%3D%221.7%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M5%2012l4%204L19%206%22%2F%3E%3C%2Fsvg%3E"); }
.blu-grid-command::before,.blu-grid-view-trigger button::before { content:""; display:inline-block; flex:0 0 15px; width:15px; height:15px; border:0; border-radius:0; background:currentColor; mask:var(--blu-grid-command-icon) center / contain no-repeat; -webkit-mask:var(--blu-grid-command-icon) center / contain no-repeat; }
.blu-grid-command--columns{ --blu-grid-command-icon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.7%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M4%204h16v16H4z%20M9%204v16%20M15%204v16%22%2F%3E%3C%2Fsvg%3E"); }
.blu-grid-command--search{ --blu-grid-command-icon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.7%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M10.5%2017a6.5%206.5%200%201%200%200-13%206.5%206.5%200%200%200%200%2013%20M16%2016l4%204%22%2F%3E%3C%2Fsvg%3E"); }
.blu-grid-command--download{ --blu-grid-command-icon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.7%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M12%203v12%20M7%2010l5%205%205-5%20M4%2016v4h16v-4%22%2F%3E%3C%2Fsvg%3E"); }
.blu-grid-command--save{ --blu-grid-command-icon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.7%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M5%203h12l4%204v14H3V3z%20M7%203v6h10V3%20M7%2021v-8h10v8%22%2F%3E%3C%2Fsvg%3E"); }
.blu-grid-command--restore{ --blu-grid-command-icon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.7%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M3%2011a9%209%200%201%201%202%207%20M3%204v7h7%20M12%207v5l3%202%22%2F%3E%3C%2Fsvg%3E"); }
.blu-grid-command--reset{ --blu-grid-command-icon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.7%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M4%2010a8%208%200%201%201%201%208%20M4%204v6h6%22%2F%3E%3C%2Fsvg%3E"); }
.blu-grid-command--check{ --blu-grid-command-icon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.7%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M5%2012l4%204L19%206%22%2F%3E%3C%2Fsvg%3E"); }
.blu-grid-command--close{ --blu-grid-command-icon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.7%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M6%206l12%2012%20M18%206L6%2018%22%2F%3E%3C%2Fsvg%3E"); }
.blu-grid-view-trigger button { --blu-grid-command-icon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.7%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M4%204h16v16H4z%20M9%204v16%20M15%204v16%22%2F%3E%3C%2Fsvg%3E"); }


/* Business rules use the shared ComponentColor palette as BluUI components.
   Cell rules use a restrained tint; the existing draft marker remains visible. */
/* Apply semantic row colors to the Quartz row surface in BluGrid 0.5.
   explicitly; selection and unsaved-change backgrounds keep precedence. */
.blu-grid .ag-row[class*="blu-grid-row-tone--"]:not(.ag-row-selected):not(.blu-grid-row-changed) {
  background-color: var(--ag-row-background-color);
}

/* A pinned summary is separate from data rows, selection, editing and CSV.
   Its scope stays beside the label so a page total cannot look like a grand total. */
.blu-grid .ag-floating-bottom { border-top: 1px solid var(--blu-border); }
.blu-grid .ag-row-pinned { background: var(--blu-surface-muted); font-weight: 600; }
.blu-grid .ag-row-pinned .ag-cell { display: flex; align-items: center; }
.blu-grid .ag-row-pinned .blu-grid-number { justify-content: flex-end; }
.blu-grid .ag-row-pinned .blu-grid-summary-label {
  white-space: pre-line;
  line-height: 18px;
  font-size: 11px;
  color: var(--blu-text-muted);
}
.blu-grid .ag-row-pinned .blu-grid-summary-label::first-line {
  color: var(--blu-text);
  font-size: 12px;
}

/* Presets stay softly tinted so selection and draft indicators remain clear. */
.blu-grid-cell-badge--default, .blu-grid .blu-grid-cell-tone--default { background:var(--bluui-color-default-soft,#f5f5f5); color:var(--bluui-color-default-text,rgba(0, 0, 0, 0.88)); }
.blu-grid .blu-grid-row-tone--default { --ag-row-background-color:var(--bluui-color-default-soft,#f5f5f5); }
.blu-grid-cell-badge--primary, .blu-grid .blu-grid-cell-tone--primary { background:var(--bluui-color-primary-soft,#eef2ff); color:var(--bluui-color-primary-text,#4338ca); }
.blu-grid .blu-grid-row-tone--primary { --ag-row-background-color:var(--bluui-color-primary-soft,#eef2ff); }
.blu-grid-cell-badge--secondary, .blu-grid .blu-grid-cell-tone--secondary { background:var(--bluui-color-secondary-soft,#e2e8f0); color:var(--bluui-color-secondary-text,#334155); }
.blu-grid .blu-grid-row-tone--secondary { --ag-row-background-color:var(--bluui-color-secondary-soft,#e2e8f0); }
.blu-grid-cell-badge--success, .blu-grid .blu-grid-cell-tone--success { background:var(--bluui-color-success-soft,#f6ffed); color:var(--bluui-color-success-text,#52c41a); }
.blu-grid .blu-grid-row-tone--success { --ag-row-background-color:var(--bluui-color-success-soft,#f6ffed); }
.blu-grid-cell-badge--processing, .blu-grid .blu-grid-cell-tone--processing { background:var(--bluui-color-processing-soft,#e6f4ff); color:var(--bluui-color-processing-text,#1677ff); }
.blu-grid .blu-grid-row-tone--processing { --ag-row-background-color:var(--bluui-color-processing-soft,#e6f4ff); }
.blu-grid-cell-badge--warning, .blu-grid .blu-grid-cell-tone--warning { background:var(--bluui-color-warning-soft,#fffbe6); color:var(--bluui-color-warning-text,#faad14); }
.blu-grid .blu-grid-row-tone--warning { --ag-row-background-color:var(--bluui-color-warning-soft,#fffbe6); }
.blu-grid-cell-badge--error, .blu-grid .blu-grid-cell-tone--error { background:var(--bluui-color-error-soft,#fff2f0); color:var(--bluui-color-error-text,#ff4d4f); }
.blu-grid .blu-grid-row-tone--error { --ag-row-background-color:var(--bluui-color-error-soft,#fff2f0); }
.blu-grid-cell-badge--danger, .blu-grid .blu-grid-cell-tone--danger { background:var(--bluui-color-danger-soft,#fff2f0); color:var(--bluui-color-danger-text,#ff4d4f); }
.blu-grid .blu-grid-row-tone--danger { --ag-row-background-color:var(--bluui-color-danger-soft,#fff2f0); }
.blu-grid-cell-badge--magenta, .blu-grid .blu-grid-cell-tone--magenta { background:var(--bluui-color-magenta-soft,#fff0f6); color:var(--bluui-color-magenta-text,#c41d7f); }
.blu-grid .blu-grid-row-tone--magenta { --ag-row-background-color:var(--bluui-color-magenta-soft,#fff0f6); }
.blu-grid-cell-badge--red, .blu-grid .blu-grid-cell-tone--red { background:var(--bluui-color-red-soft,#fff1f0); color:var(--bluui-color-red-text,#cf1322); }
.blu-grid .blu-grid-row-tone--red { --ag-row-background-color:var(--bluui-color-red-soft,#fff1f0); }
.blu-grid-cell-badge--volcano, .blu-grid .blu-grid-cell-tone--volcano { background:var(--bluui-color-volcano-soft,#fff2e8); color:var(--bluui-color-volcano-text,#d4380d); }
.blu-grid .blu-grid-row-tone--volcano { --ag-row-background-color:var(--bluui-color-volcano-soft,#fff2e8); }
.blu-grid-cell-badge--orange, .blu-grid .blu-grid-cell-tone--orange { background:var(--bluui-color-orange-soft,#fff7e6); color:var(--bluui-color-orange-text,#d46b08); }
.blu-grid .blu-grid-row-tone--orange { --ag-row-background-color:var(--bluui-color-orange-soft,#fff7e6); }
.blu-grid-cell-badge--gold, .blu-grid .blu-grid-cell-tone--gold { background:var(--bluui-color-gold-soft,#fffbe6); color:var(--bluui-color-gold-text,#d48806); }
.blu-grid .blu-grid-row-tone--gold { --ag-row-background-color:var(--bluui-color-gold-soft,#fffbe6); }
.blu-grid-cell-badge--lime, .blu-grid .blu-grid-cell-tone--lime { background:var(--bluui-color-lime-soft,#fcffe6); color:var(--bluui-color-lime-text,#7cb305); }
.blu-grid .blu-grid-row-tone--lime { --ag-row-background-color:var(--bluui-color-lime-soft,#fcffe6); }
.blu-grid-cell-badge--green, .blu-grid .blu-grid-cell-tone--green { background:var(--bluui-color-green-soft,#f6ffed); color:var(--bluui-color-green-text,#389e0d); }
.blu-grid .blu-grid-row-tone--green { --ag-row-background-color:var(--bluui-color-green-soft,#f6ffed); }
.blu-grid-cell-badge--cyan, .blu-grid .blu-grid-cell-tone--cyan { background:var(--bluui-color-cyan-soft,#e6fffb); color:var(--bluui-color-cyan-text,#08979c); }
.blu-grid .blu-grid-row-tone--cyan { --ag-row-background-color:var(--bluui-color-cyan-soft,#e6fffb); }
.blu-grid-cell-badge--blue, .blu-grid .blu-grid-cell-tone--blue { background:var(--bluui-color-blue-soft,#e6f4ff); color:var(--bluui-color-blue-text,#0958d9); }
.blu-grid .blu-grid-row-tone--blue { --ag-row-background-color:var(--bluui-color-blue-soft,#e6f4ff); }
.blu-grid-cell-badge--geekblue, .blu-grid .blu-grid-cell-tone--geekblue { background:var(--bluui-color-geekblue-soft,#f0f5ff); color:var(--bluui-color-geekblue-text,#1d39c4); }
.blu-grid .blu-grid-row-tone--geekblue { --ag-row-background-color:var(--bluui-color-geekblue-soft,#f0f5ff); }
.blu-grid-cell-badge--purple, .blu-grid .blu-grid-cell-tone--purple { background:var(--bluui-color-purple-soft,#f9f0ff); color:var(--bluui-color-purple-text,#531dab); }
.blu-grid .blu-grid-row-tone--purple { --ag-row-background-color:var(--bluui-color-purple-soft,#f9f0ff); }

/* Native select/date controls follow the same resolved appearance as Quartz. */
.blu-grid { --ag-browser-color-scheme:inherit; color-scheme:inherit; }

/* Keep paging commands reachable at 320 CSS pixels / 400% zoom. */
@media (max-width: 600px) {
  .blu-grid .ag-paging-page-summary-panel { flex-wrap: wrap; justify-content: center; max-width: 100%; min-width: 0; white-space: normal; }
  .blu-grid .ag-paging-row-summary-panel { flex-wrap: wrap; max-width: 100%; }
}

/* Form boundaries must remain visible in both modes (WCAG non-text contrast). */
.blu-grid-search input,
.blu-grid-tool-select,
.blu-grid .ag-floating-filter-input input,
.blu-grid .ag-paging-panel .ag-picker-field-wrapper,
.blu-grid .ag-paging-panel .ag-text-field-input {
  border-color: var(--blu-control-border);
}

/* Advanced column adjustments stay tucked beneath each column's main controls. */
.blu-grid-column-adjust { grid-column:1 / -1; min-width:0; padding-bottom:6px; }
.blu-grid-column-adjust summary { cursor:pointer; min-height:28px; display:list-item; margin-left:16px; color:var(--blu-text-muted); font-size:12px; }
.blu-grid-column-adjust summary:focus-visible { outline:2px solid var(--blu-primary); outline-offset:2px; }
.blu-grid-column-adjust-fields { display:grid; grid-template-columns:1fr 1fr; gap:12px; padding:6px 0; }
.blu-grid-column-adjust-fields label { display:flex; flex-direction:column; align-items:stretch; gap:6px; min-width:0; }
.blu-grid-column-adjust-fields input,.blu-grid-column-adjust-fields select { width:100%; min-width:0; }
.blu-grid-column-adjust-fields input:focus-visible { outline:2px solid var(--blu-primary); outline-offset:2px; }
/* Persistent command feedback: readable by assistive technology without moving focus. */
.blu-grid-command-status {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* Integrated workbench is explicitly enabled by the host. */
.blu-grid-integrated{display:flex;flex-direction:column;min-width:0}
.blu-grid-engine{flex:1;min-height:180px;min-width:0}
.blu-grid-engine[hidden],.blu-grid-report[hidden]{display:none}
.blu-grid-workbench{flex:none;min-width:0;font:inherit;color:inherit}
.blu-grid-workbench-toolbar,.blu-grid-workbench-modes{display:flex;align-items:center;flex-wrap:wrap;gap:6px;padding:10px 0}
.blu-grid-workbench-toolbar{border-bottom:1px solid var(--bluui-border,#e3e5eb)}
.blu-grid-workbench-toolbar input[type=search]{flex:1;min-width:160px}
.blu-grid-workbench select,.blu-grid-workbench input,.blu-grid-workbench-dialog input,.blu-grid-workbench-dialog select,.blu-grid-workbench-dialog textarea{font:inherit;color:inherit;background:var(--bluui-surface,#fff);border:1px solid var(--bluui-border,#cbd5e1);border-radius:6px;padding:8px 10px;min-height:36px;max-width:100%;min-width:0;box-sizing:border-box}
.blu-grid-workbench button,.blu-grid-report button,.blu-grid-workbench-dialog button{font:inherit;font-size:12px;min-height:36px;border:1px solid var(--bluui-border,#d7dce3);border-radius:6px;padding:7px 12px;background:var(--bluui-surface,#fff);color:inherit;cursor:pointer}
.blu-grid-workbench button:disabled,.blu-grid-workbench-dialog button:disabled{opacity:.45;cursor:default}
.blu-grid-workbench-modes button{border:0;background:transparent}
.blu-grid-workbench-modes button[aria-pressed=true]{background:var(--bluui-color-primary-soft,#eeebfa);color:var(--bluui-color-primary-text,#4338ca);font-weight:650}
.blu-grid-range-label{margin-left:auto;font-size:12px;color:var(--bluui-text-muted,#657084)}
.blu-grid-workbench-status{font-size:12px;min-height:26px;color:var(--bluui-text-muted,#657084)}
.blu-grid-workbench-status:not(:empty),.blu-grid-report>[role=alert]{box-sizing:border-box;padding:12px 16px;line-height:1.5;overflow-wrap:anywhere}
.blu-grid .ag-cell.blu-grid-range-cell{background:var(--bluui-color-primary-soft,#eeebfa);box-shadow:inset 0 0 0 1px var(--bluui-color-primary-solid,#6651cc)}
.blu-grid-report{flex:1;min-height:0;overflow:auto;border:1px solid var(--bluui-border,#e3e5eb);border-radius:8px;padding:12px}
.blu-grid-report table,.blu-grid-workbench-dialog table{border-collapse:collapse;width:100%;font-size:12px}
.blu-grid-report td,.blu-grid-report th,.blu-grid-workbench-dialog td,.blu-grid-workbench-dialog th{text-align:left;padding:10px 12px;border-bottom:1px solid var(--bluui-border,#e3e5eb);vertical-align:top}
.blu-grid-report>table>tr>th{background:var(--bluui-surface-muted,#f7f8fa)}
.blu-grid-report th button{border:0;background:transparent;padding:0;min-height:28px;font-weight:600;color:var(--bluui-color-primary-text,#4338ca)}
.blu-grid-report th button::before{content:'▸';display:inline-block;margin-right:8px}
.blu-grid-report th button[aria-expanded=true]::before{content:'▾'}
.blu-grid-records-detail{min-width:700px}.blu-grid-report p{font-size:12px;margin:0 0 12px}
.blu-grid-workbench-bar{display:block;height:14px;border-radius:3px;background:var(--bluui-color-primary-solid,#6651cc);margin-top:6px;min-width:0}
.blu-grid-workbench-dialog{box-sizing:border-box;width:min(760px,calc(100vw - 32px));max-width:760px;max-height:85vh;overflow:auto;padding:24px;border:1px solid var(--bluui-border,#d7dce3);border-radius:12px;background:var(--bluui-surface,#fff);color:var(--bluui-text,#202838);font:14px/1.5 system-ui,sans-serif}
.blu-grid-workbench-dialog::backdrop{background:#15203b60}.blu-grid-workbench-dialog h2{font-size:20px;margin:0 0 12px}
.blu-grid-workbench-dialog label{display:grid;gap:6px;margin:14px 0;font-weight:600}.blu-grid-workbench-dialog p{font-size:13px}.blu-grid-workbench-dialog button{margin:4px 6px 4px 0}
.blu-grid-workbench-error{color:var(--bluui-color-error-solid,#b42318)}.blu-grid-workbench-error:empty{display:none}.blu-grid-paste-preview{overflow:auto;max-height:36vh}
.blu-grid-workbench :focus-visible,.blu-grid-workbench-dialog :focus-visible,.blu-grid-report :focus-visible{outline:2px solid var(--bluui-color-primary-solid,#6651cc);outline-offset:2px}

.blu-grid-workbench-modes button:disabled{opacity:.4;cursor:default}
.blu-grid-chart{max-width:1100px;padding:8px 10px 16px;margin:auto}
.blu-grid-chart h3{font-size:19px;font-weight:650;margin:0 0 8px}
.blu-grid-chart-legend{list-style:none;display:flex;flex-wrap:wrap;gap:18px;margin:18px 0;padding:0;font-size:12px}
.blu-grid-chart-legend li{display:flex;align-items:center;gap:7px}.blu-grid-chart-legend span{width:10px;height:10px;border-radius:3px}
.blu-grid-chart-axis{display:flex;justify-content:space-between;margin:12px 70px 0 150px;color:var(--bluui-text-muted,#657084);font-size:11px}
.blu-grid-chart-group{padding:14px 0;border-bottom:1px solid var(--bluui-border,#e3e5eb)}
.blu-grid-report .blu-grid-chart-group-title{font-size:14px;font-weight:650;color:var(--bluui-color-primary-text,#4338ca);border:0;background:transparent;padding:0;min-height:30px;margin-bottom:6px}
.blu-grid-chart-row{display:grid;grid-template-columns:minmax(80px,140px) minmax(0,1fr) 60px;gap:10px;align-items:center;min-height:32px;font-size:12px}
.blu-grid-chart-row>span{overflow-wrap:anywhere}.blu-grid-chart-row strong{text-align:right;font-variant-numeric:tabular-nums}
.blu-grid-chart-track{position:relative;height:20px;background:var(--bluui-surface-muted,#f1f3f7);border-radius:3px}
.blu-grid-chart-zero{position:absolute;top:-3px;bottom:-3px;width:1px;background:var(--bluui-control-border,#bbc2cd);z-index:1}
.blu-grid-chart-bar{position:absolute;top:0;height:100%;border-radius:3px}
@media(max-width:600px){.blu-grid-chart-row{grid-template-columns:80px minmax(0,1fr) 44px;gap:8px}.blu-grid-chart-axis{margin-left:88px;margin-right:52px}}

/* Compact, grid-owned panels. They never place a backdrop over the screen. */
.blu-grid-workbench{position:relative;z-index:10}
.blu-grid-workbench-toolbar,.blu-grid-workbench-modes{gap:6px;padding:8px 0}
.blu-grid-workbench-toolbar>button,.blu-grid-workbench-toolbar>input,.blu-grid-workbench-modes>button{min-height:32px;height:32px;font-size:12px}
.blu-grid-workbench-toolbar>button{padding:5px 9px}
.blu-grid-workbench-toolbar>button[aria-expanded=true]{background:var(--bluui-color-primary-soft,#eeebfa);border-color:var(--bluui-color-primary-solid,#6651cc);color:var(--bluui-color-primary-text,#4338ca)}
.blu-grid-workbench .blu-grid-views-trigger{justify-content:flex-start;min-width:150px;max-width:238px;gap:8px;font-weight:600}
.blu-grid-views-label{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1;text-align:left}
.blu-grid-views-trigger .blu-grid-icon{width:15px;height:15px;flex-shrink:0}
.blu-grid-popover{position:absolute;z-index:50;box-sizing:border-box;padding:0;border:1px solid var(--bluui-border,#dce0e8);border-radius:10px;background:var(--bluui-surface,#fff);color:var(--bluui-text,#202838);box-shadow:0 12px 30px rgb(25 34 55 / 14%),0 2px 5px rgb(25 34 55 / 5%);overflow:auto;overscroll-behavior:contain;text-align:left;font:12px/1.4 system-ui,sans-serif}
.blu-grid-popover[hidden]{display:none}
.blu-grid-popover-head{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:11px 12px 8px}
.blu-grid-popover-head h3{font-size:13px;line-height:1.4;font-weight:650;margin:0}
.blu-grid-workbench .blu-grid-popover-close{width:26px;min-height:26px;height:26px;padding:0;border:0;background:transparent;font-size:20px;color:var(--bluui-text-muted,#6b7280)}
.blu-grid-popover-body{padding:0 12px 12px}
.blu-grid-popover-form{margin:0;display:grid;gap:10px}
.blu-grid-popover-form label{display:grid;gap:5px;font-size:11px;font-weight:600;min-width:0;color:var(--bluui-text-muted,#657084)}
.blu-grid-popover-form input,.blu-grid-popover-form select,.blu-grid-workbench .blu-grid-view-search{height:32px;min-height:32px;width:100%;font-size:12px;padding:5px 8px;color:var(--bluui-text,#202838);font-weight:400;border-radius:6px}
.blu-grid-popover-form select:disabled{opacity:.5;background:var(--bluui-surface-muted,#f7f8fa)}
.blu-grid-popover-fields{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px 12px}
.blu-grid-popover-form p{margin:0;font-size:11px;line-height:1.5;color:var(--bluui-text-muted,#657084)}
.blu-grid-popover-footer{display:flex;align-items:center;justify-content:space-between;gap:8px;padding-top:10px;margin-top:2px;border-top:1px solid var(--bluui-border,#e3e5eb)}
.blu-grid-workbench .blu-grid-popover-footer button{height:30px;min-height:30px;font-size:12px;padding:4px 10px}
.blu-grid-workbench .blu-grid-popover-footer button.is-primary{background:var(--bluui-color-primary-solid,#6651cc);color:#fff;border-color:transparent;min-width:72px}
.blu-grid-popover>.blu-grid-workbench-error{box-sizing:border-box;margin:0;padding:12px 16px;font-size:12px;line-height:1.5;overflow-wrap:anywhere}
.blu-grid-view-search{margin-bottom:8px}
.blu-grid-saved-list{max-height:260px;overflow:auto;margin:0 -5px;padding:0 5px}
.blu-grid-view-section{font-size:10px;font-weight:650;letter-spacing:.07em;text-transform:uppercase;color:var(--bluui-text-muted,#657084);padding:9px 5px 5px}
.blu-grid-workbench .blu-grid-saved-option{display:flex;align-items:center;width:100%;height:auto;min-height:48px;gap:9px;padding:8px;margin:2px 0;border:0;background:transparent;text-align:left;border-radius:6px}
.blu-grid-workbench .blu-grid-saved-option:hover,.blu-grid-workbench .blu-grid-saved-option:focus-visible{background:var(--bluui-surface-muted,#f5f6f9)}
.blu-grid-workbench .blu-grid-saved-option[aria-checked=true]{background:var(--bluui-color-primary-soft,#eeebfa);color:var(--bluui-color-primary-text,#4338ca)}
.blu-grid-saved-text{display:grid;gap:3px;flex:1;min-width:0}
.blu-grid-saved-name{font-weight:600;font-size:12px;overflow-wrap:anywhere}
.blu-grid-saved-text small{font-size:10px;line-height:1.4;color:var(--bluui-text-muted,#657084);white-space:normal}
.blu-grid-saved-option>.blu-grid-icon{width:15px;height:15px;flex:none}
.blu-grid-saved-option>.blu-grid-icon:last-child{visibility:hidden}
.blu-grid-saved-option[aria-checked=true]>.blu-grid-icon:last-child{visibility:visible}
.blu-grid-view-empty{font-size:12px;line-height:1.5;color:var(--bluui-text-muted,#657084);padding:10px 5px;margin:0}
.blu-grid-popover--views .blu-grid-popover-footer button{justify-content:flex-start;border:0;background:transparent;color:var(--bluui-color-primary-text,#4338ca);padding-left:4px}
.blu-grid-popover-error{color:var(--blu-grid-danger,#b42318);font-size:12px;margin:0 12px 12px}.blu-grid-popover-error:empty{display:none}

.blu-grid-workbench [hidden]{display:none!important}

/* BEGIN GENERATED SHARED CHECKBOX — scripts/build-checkbox-styles.mjs */
/* One checkbox design, emitted into each owning Block. Keep native input/tree/grid semantics. */
:is(:is(.blu-grid-floating-toggle,.blu-grid-preference-column) input[type="checkbox"],input.blu-grid-details__selection) {
  -webkit-appearance:none;
  appearance:none;
  box-sizing:border-box;
  position:relative;
  display:inline-block;
  flex:0 0 22px;
  width:22px;
  height:22px;
  min-width:22px;
  min-height:22px;
  margin:0;
  padding:0;
  border:1.5px solid var(--bluui-control-border,#7b8799);
  border-radius:6px;
  background-color:var(--bluui-surface,#fff);
  background-image:none;
  box-shadow:0 1px 2px rgb(15 23 42 / 6%);
  vertical-align:middle;
  cursor:pointer;
  opacity:1;
  filter:none;
  transition:background-color 120ms ease,border-color 120ms ease,box-shadow 120ms ease;
}
:is(:is(.blu-grid-floating-toggle,.blu-grid-preference-column) input[type="checkbox"],input.blu-grid-details__selection)::after { content:none; }
:is(:is(.blu-grid-floating-toggle,.blu-grid-preference-column) input[type="checkbox"],input.blu-grid-details__selection):checked,
:is(:is(.blu-grid-floating-toggle,.blu-grid-preference-column) input[type="checkbox"],input.blu-grid-details__selection):indeterminate {
  border-color:var(--bluui-color-primary-solid,#4f46e5);
  background-color:var(--bluui-color-primary-solid,#4f46e5);
}
:is(:is(.blu-grid-floating-toggle,.blu-grid-preference-column) input[type="checkbox"],input.blu-grid-details__selection):checked::after,
:is(:is(.blu-grid-floating-toggle,.blu-grid-preference-column) input[type="checkbox"],input.blu-grid-details__selection):indeterminate::after {
  content:"";
  box-sizing:content-box;
  position:absolute;
  inset:auto;
  width:10px;
  height:6px;
  left:4px;
  top:5px;
  border:solid var(--bluui-color-primary-contrast,#fff);
  border-width:0 0 2px 2px;
  border-radius:0;
  background:none;
  -webkit-mask:none;
  mask:none;
  transform:rotate(-45deg);
  pointer-events:none;
}
:is(:is(.blu-grid-floating-toggle,.blu-grid-preference-column) input[type="checkbox"],input.blu-grid-details__selection):indeterminate::after {
  height:0;
  top:8px;
  border-width:0 0 2px;
  transform:none;
}
:is(:is(.blu-grid-floating-toggle,.blu-grid-preference-column) input[type="checkbox"],input.blu-grid-details__selection):hover:not(:disabled) {
  border-color:var(--bluui-color-primary-solid,#4f46e5);
  box-shadow:0 0 0 3px var(--bluui-color-primary-soft,#eef2ff);
}
:is(:is(.blu-grid-floating-toggle,.blu-grid-preference-column) input[type="checkbox"],input.blu-grid-details__selection):focus-visible {
  outline:2px solid var(--bluui-color-primary-solid,#4f46e5);
  outline-offset:3px;
}
:is(:is(.blu-grid-floating-toggle,.blu-grid-preference-column) input[type="checkbox"],input.blu-grid-details__selection):disabled {
  border-color:var(--bluui-border-strong,#b8c4d4);
  background-color:var(--bluui-surface-muted,#f7f8fb);
  box-shadow:none;
  cursor:not-allowed;
}
:is(:is(.blu-grid-floating-toggle,.blu-grid-preference-column) input[type="checkbox"],input.blu-grid-details__selection):disabled:checked,
:is(:is(.blu-grid-floating-toggle,.blu-grid-preference-column) input[type="checkbox"],input.blu-grid-details__selection):disabled:indeterminate {
  border-color:var(--bluui-text-muted,#5c6b80);
  background-color:var(--bluui-text-muted,#5c6b80);
}
@media (prefers-reduced-motion:reduce) {
  :is(:is(.blu-grid-floating-toggle,.blu-grid-preference-column) input[type="checkbox"],input.blu-grid-details__selection) { transition:none; }
}
:is(:is(.blu-grid-floating-toggle,.blu-grid-preference-column) input[type="checkbox"],input.blu-grid-details__selection)::before { content:none; }
@media (forced-colors:active) {
  :is(:is(.blu-grid-floating-toggle,.blu-grid-preference-column) input[type="checkbox"],input.blu-grid-details__selection),
  :is(:is(.blu-grid-floating-toggle,.blu-grid-preference-column) input[type="checkbox"],input.blu-grid-details__selection):checked,
  :is(:is(.blu-grid-floating-toggle,.blu-grid-preference-column) input[type="checkbox"],input.blu-grid-details__selection):indeterminate,
  :is(:is(.blu-grid-floating-toggle,.blu-grid-preference-column) input[type="checkbox"],input.blu-grid-details__selection):disabled,
  :is(:is(.blu-grid-floating-toggle,.blu-grid-preference-column) input[type="checkbox"],input.blu-grid-details__selection):disabled:checked,
  :is(:is(.blu-grid-floating-toggle,.blu-grid-preference-column) input[type="checkbox"],input.blu-grid-details__selection):disabled:indeterminate { -webkit-appearance:checkbox; appearance:auto; background:revert; border:revert; box-shadow:none; forced-color-adjust:auto; }
  :is(:is(.blu-grid-floating-toggle,.blu-grid-preference-column) input[type="checkbox"],input.blu-grid-details__selection):checked::after, :is(:is(.blu-grid-floating-toggle,.blu-grid-preference-column) input[type="checkbox"],input.blu-grid-details__selection):indeterminate::after { content:none; }
}
/* One checkbox design, emitted into each owning Block. Keep native input/tree/grid semantics. */
.blu-grid .ag-checkbox-input-wrapper {
  -webkit-appearance:none;
  appearance:none;
  box-sizing:border-box;
  position:relative;
  display:inline-block;
  flex:0 0 22px;
  width:22px;
  height:22px;
  min-width:22px;
  min-height:22px;
  margin:0;
  padding:0;
  border:1.5px solid var(--bluui-control-border,#7b8799);
  border-radius:6px;
  background-color:var(--bluui-surface,#fff);
  background-image:none;
  box-shadow:0 1px 2px rgb(15 23 42 / 6%);
  vertical-align:middle;
  cursor:pointer;
  opacity:1;
  filter:none;
  transition:background-color 120ms ease,border-color 120ms ease,box-shadow 120ms ease;
}
.blu-grid .ag-checkbox-input-wrapper::after { content:none; }
.blu-grid .ag-checkbox-input-wrapper.ag-checked,
.blu-grid .ag-checkbox-input-wrapper.ag-indeterminate {
  border-color:var(--bluui-color-primary-solid,#4f46e5);
  background-color:var(--bluui-color-primary-solid,#4f46e5);
}
.blu-grid .ag-checkbox-input-wrapper.ag-checked::after,
.blu-grid .ag-checkbox-input-wrapper.ag-indeterminate::after {
  content:"";
  box-sizing:content-box;
  position:absolute;
  inset:auto;
  width:10px;
  height:6px;
  left:4px;
  top:5px;
  border:solid var(--bluui-color-primary-contrast,#fff);
  border-width:0 0 2px 2px;
  border-radius:0;
  background:none;
  -webkit-mask:none;
  mask:none;
  transform:rotate(-45deg);
  pointer-events:none;
}
.blu-grid .ag-checkbox-input-wrapper.ag-indeterminate::after {
  height:0;
  top:8px;
  border-width:0 0 2px;
  transform:none;
}
.blu-grid .ag-checkbox-input-wrapper:hover:not(.ag-disabled) {
  border-color:var(--bluui-color-primary-solid,#4f46e5);
  box-shadow:0 0 0 3px var(--bluui-color-primary-soft,#eef2ff);
}
.blu-grid .ag-checkbox-input-wrapper:has(input:focus-visible) {
  outline:2px solid var(--bluui-color-primary-solid,#4f46e5);
  outline-offset:3px;
}
.blu-grid .ag-checkbox-input-wrapper.ag-disabled {
  border-color:var(--bluui-border-strong,#b8c4d4);
  background-color:var(--bluui-surface-muted,#f7f8fb);
  box-shadow:none;
  cursor:not-allowed;
}
.blu-grid .ag-checkbox-input-wrapper.ag-disabled.ag-checked,
.blu-grid .ag-checkbox-input-wrapper.ag-disabled.ag-indeterminate {
  border-color:var(--bluui-text-muted,#5c6b80);
  background-color:var(--bluui-text-muted,#5c6b80);
}
@media (prefers-reduced-motion:reduce) {
  .blu-grid .ag-checkbox-input-wrapper { transition:none; }
}
@media (forced-colors:active) {
  .blu-grid .ag-checkbox-input-wrapper,
  .blu-grid .ag-checkbox-input-wrapper.ag-checked,
  .blu-grid .ag-checkbox-input-wrapper.ag-indeterminate,
  .blu-grid .ag-checkbox-input-wrapper.ag-disabled,
  .blu-grid .ag-checkbox-input-wrapper.ag-disabled.ag-checked,
  .blu-grid .ag-checkbox-input-wrapper.ag-disabled.ag-indeterminate { forced-color-adjust:none; background:Canvas; border-color:CanvasText; box-shadow:none; }
  .blu-grid .ag-checkbox-input-wrapper.ag-checked, .blu-grid .ag-checkbox-input-wrapper.ag-indeterminate { background:Highlight; border-color:Highlight; }
  .blu-grid .ag-checkbox-input-wrapper.ag-checked::after, .blu-grid .ag-checkbox-input-wrapper.ag-indeterminate::after { border-color:HighlightText; }
  .blu-grid .ag-checkbox-input-wrapper.ag-disabled, .blu-grid .ag-checkbox-input-wrapper.ag-disabled.ag-checked, .blu-grid .ag-checkbox-input-wrapper.ag-disabled.ag-indeterminate { border-color:GrayText; background:Canvas; }
  .blu-grid .ag-checkbox-input-wrapper.ag-disabled.ag-checked::after, .blu-grid .ag-checkbox-input-wrapper.ag-disabled.ag-indeterminate::after { border-color:GrayText; }
  .blu-grid .ag-checkbox-input-wrapper:has(input:focus-visible) { outline-color:Highlight; }
}
.blu-grid .ag-checkbox-input-wrapper > input.ag-checkbox-input { width:100%; height:100%; min-width:0; min-height:0; position:absolute; inset:0; margin:0; padding:0; border:0; opacity:0; }
/* END GENERATED SHARED CHECKBOX */
/* Workbench controls share one compact, anchored surface. */
.blu-grid-popover,.blu-grid-popover-form input,.blu-grid-popover-form select,.blu-grid-workbench .blu-grid-view-search{border-radius:0}
.blu-grid-popover--columns .blu-grid-display-options{padding:10px 0;gap:8px}
.blu-grid-popover--columns .blu-grid-preference-columns{padding:0}
.blu-grid-popover--columns .blu-grid-preference-column{padding:8px 0}
.blu-grid-popover--columns .blu-grid-preference-column[hidden]{display:none}
.blu-grid-popover--columns .blu-grid-tool-select{border-radius:0;height:30px;min-height:30px;font-size:12px}
.blu-grid-popover--columns .blu-grid-tool-buttons{flex-wrap:wrap}
.blu-grid-popover--columns .blu-grid-tool-buttons button{min-height:28px;height:28px;padding:4px 6px;font-size:11px}
.blu-grid-popover--columns .blu-grid-preference-columns{margin-top:8px;max-height:320px;overflow:auto}
.blu-grid-popover--columns .blu-grid-preference-column{display:grid;grid-template-columns:minmax(0,1fr) 68px 24px;align-items:center;gap:4px 8px;padding:4px 0;min-height:32px}
.blu-grid-popover--columns .blu-grid-preference-column>label{font-size:12px;gap:7px;min-width:0;overflow-wrap:anywhere}
.blu-grid-popover--columns .blu-grid-preference-column>.blu-grid-tool-select{height:26px;min-height:26px;padding:2px 4px;font-size:11px}
.blu-grid-popover--columns .blu-grid-column-adjust{display:contents}
.blu-grid-popover--columns .blu-grid-column-adjust>summary{display:block;margin:0;min-height:26px;line-height:24px;text-align:center;cursor:pointer;font-size:19px;list-style:none}
.blu-grid-popover--columns .blu-grid-column-adjust>summary::-webkit-details-marker{display:none}
.blu-grid-popover--columns .blu-grid-column-adjust[open]>summary{background:var(--bluui-color-primary-soft,#eeebfa);color:var(--bluui-color-primary-text,#4338ca)}
.blu-grid-popover--columns .blu-grid-column-adjust-fields{grid-column:1/-1;padding:6px 0 8px}
.blu-grid-popover--columns .blu-grid-column-adjust:not([open])>.blu-grid-column-adjust-fields{display:none}
.blu-grid-popover--columns .blu-grid-display-disclosure{margin-top:8px;padding-top:8px;border-top:1px solid var(--bluui-border,#e3e5eb)}
.blu-grid-popover--columns .blu-grid-display-disclosure>summary{font-size:12px;cursor:pointer}
.blu-grid-popover--columns .blu-grid-display-options .blu-grid-preference-heading{display:none}
.blu-grid-popover--columns .blu-grid-column-save-note{margin:10px 0 0;font-size:11px;line-height:1.4;color:var(--bluui-text-muted,#657084)}

.blukavant-spotlight{display:block;padding-block:40px;border-top:1px solid var(--line);scroll-margin-top:24px}
.blukavant-spotlight-intro{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-bottom:28px}
.blukavant-spotlight .eyebrow{margin:0 0 12px}
.blukavant-spotlight h2{margin:0 0 12px;font-size:clamp(32px,3vw,42px);line-height:1.15}
.blukavant-spotlight-description{max-width:50ch;margin:0;color:var(--muted);font-size:16px;line-height:1.7}
.blukavant-spotlight .button{flex-shrink:0}
.grid-demo{background:#fff;border:1px solid var(--line);min-width:0;color:#192332;--blu-font-family:Manrope,Arial,sans-serif;--bluui-color-primary-solid:#0068ec;--bluui-color-primary-soft:#eef5ff;--bluui-color-primary-text:#005aca}
.grid-demo-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:20px 24px;border-bottom:1px solid #e1e5eb}
.grid-demo-heading h3{font:700 17px/1.4 Manrope,Arial,sans-serif;letter-spacing:0;margin:0 0 4px}
.grid-demo-heading p{font-size:13px;line-height:1.6;color:var(--muted);margin:0}
.grid-demo-actions{display:flex;flex-wrap:wrap;gap:10px;flex-shrink:0}
.grid-demo-actions button{font:600 12px/1.4 Manrope,Arial,sans-serif;padding:9px 12px;background:white;border:1px solid #b9c4d2;border-radius:3px;color:#244366;cursor:pointer;min-height:36px}
.grid-demo-actions button:disabled{opacity:.5;cursor:default}
#blukavantui-grid{min-height:480px;max-width:100%;font-size:14px}
.grid-demo .blu-grid{border:0;border-radius:0;--ag-font-family:Manrope,Arial,sans-serif}
.grid-demo .blu-grid-toolbar{border-radius:0}
.grid-demo-footer{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 24px;border-top:1px solid #e1e5eb;font-size:12px;color:var(--muted)}
.grid-demo-footer p{margin:0;line-height:1.6}
.grid-demo-footer a{color:#005aca;text-decoration:underline;text-underline-offset:3px;flex-shrink:0}
.grid-demo-note{margin:12px 0 0;font-size:12px;color:var(--muted)}
@media(max-width:760px){
.blukavant-spotlight{padding-block:32px}
.blukavant-spotlight-intro{align-items:flex-start;flex-direction:column;gap:20px}
.grid-demo-heading{align-items:flex-start;flex-direction:column;padding:16px}
.grid-demo-footer{align-items:flex-start;flex-direction:column;gap:8px;padding:12px 16px}
.grid-demo-actions{gap:8px}
.grid-demo .blu-grid-workbench{min-width:0}
#blukavantui-grid{min-height:680px}
}