:root{
  --ct-bg: #F5F5F6;
  --ct-surface: rgba(255,255,255,.96);
  --ct-surface-2: rgba(255,255,255,.92);
  --ct-border: rgba(24,24,27,.10);
  --ct-text: rgba(17,24,39,.94);
  --ct-muted: rgba(38,38,42,.60);
  --ct-muted-2: rgba(38,38,42,.44);
  --ct-accent: linear-gradient(135deg, rgba(64,142,255,.95), rgba(160,99,255,.95));
  --ct-accent-hover: linear-gradient(135deg, rgba(64,142,255,1), rgba(160,99,255,1));
  --ct-success: #0b5f2a;
  --ct-warning: #ffb020;
  --ct-danger: #ff4d4d;
  --ct-focus: 0 0 0 4px rgba(83,110,150,.16);
  --ct-thead-bg: #F7F7F6;
  --ct-table-sticky-bg: #ffffff;

  --ct-s1: 4px;
  --ct-s2: 8px;
  --ct-s3: 12px;
  --ct-s4: 16px;
  --ct-s5: 24px;
  --ct-s6: 32px;

  --ct-radius-control: 12px;
  --ct-radius-popover: 14px;
  --ct-radius-card: 16px;
  --ct-radius-pill: 999px;

  --ct-h-control: 40px;
  --ct-h-secondary: 40px;
  --ct-h-primary: 48px;

  --ct-shadow-card: 0 18px 45px rgba(10,12,16,.12);
  --ct-shadow-popover: 0 12px 30px rgba(10,12,16,.18);
  --ct-modal-backdrop-bg: rgba(17, 24, 39, .52);
  --ct-modal-backdrop-blur: 0px;
  --ct-modal-backdrop-filter: none;

  --ct-font-sans: ui-sans-serif, system-ui, -apple-system, "SF Pro Display", "SF Pro Text",
    Inter, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji", "Segoe UI Emoji";
  --ct-font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
  --ct-font-ui: "Inter", var(--ct-font-sans);

  --ct-bg-decor-1: radial-gradient(900px 520px at 18% 0%, rgba(120,90,255,.06), transparent 60%);
  --ct-bg-decor-2: radial-gradient(820px 560px at 92% 8%, rgba(40,150,255,.06), transparent 60%);
  --ct-button-bg: rgba(10,12,16,.06);
  --ct-button-bg-hover: rgba(10,12,16,.09);
  --ct-sticky-top: 68px;

  --bg: var(--ct-bg);
  --card: rgba(10,12,16,.045);
  --card2: rgba(10,12,16,.06);
  --surface: var(--ct-surface);
  --surface2: var(--ct-surface-2);
  --border: var(--ct-border);
  --text: var(--ct-text);
  --muted: var(--ct-muted);
  --muted2: var(--ct-muted-2);
  --shadow: var(--ct-shadow-card);
  --radius: calc(var(--ct-radius-card) + 2px);
  --radius2: var(--ct-radius-popover);
  --good: var(--ct-success);
  --bad: var(--ct-danger);
  --warn: var(--ct-warning);
  --btn: var(--ct-button-bg);
  --btnHover: var(--ct-button-bg-hover);
  --primary: var(--ct-accent);
  --primaryHover: var(--ct-accent-hover);
  --focus: var(--ct-focus);
  --theadBg: var(--ct-thead-bg);
  --tableStickyBg: var(--ct-table-sticky-bg);
  --bgDecor1: var(--ct-bg-decor-1);
  --bgDecor2: var(--ct-bg-decor-2);
  --stickyTop: var(--ct-sticky-top);
  /* card shell */
  --ct-page-card-bg:     #FFFFFF;
  --ct-page-card-border: #E4E4E1;
  --ct-page-card-radius: 14px;
  --ct-page-card-pad:    13px;

  /* inner table shell */
  --ct-page-table-shell-bg:     #FFFFFF;
  --ct-page-table-shell-border: #E5E5E2;
  --ct-page-table-shell-radius: 10px;

  /* table header row */
  --ct-page-thead-bg:   #F7F7F6;
  --ct-page-thead-text: #6B7280;

  /* table row separator */
  --ct-page-row-sep: #EEEEEC;

  /* filter / actions bar */
  --ct-page-filter-bg:     #F7F7F6;
  --ct-page-filter-border: #E4E4E1;
  --ct-page-filter-radius: 10px;

  /* empty state */
  --ct-page-empty-bg:     #FAFAF9;
  --ct-page-empty-border: #E6E6E3;
  --ct-page-empty-radius: 14px;

  /* typography */
  --ct-page-section-title: #121826;
  --ct-page-empty-title:   #121826;
  --ct-page-muted:         #6B7280;
}
