:root {
  --design-primary-50: #effadf;
  --design-primary-100: #e1f3c7;
  --design-primary-200: #c9e3a0;
  --design-primary-300: #abcc71;
  --design-primary-400: #8db140;
  --design-primary-500: #71950c;
  --design-primary-600: #5c7b00;
  --design-primary-700: #496200;
  --design-primary-800: #374b00;
  --design-primary-900: #253400;
  --design-primary-950: #151f00;
  --design-neutral-50: #f4f6f2;
  --design-neutral-100: #eaece7;
  --design-neutral-200: #d6d9d1;
  --design-neutral-300: #bbbfb6;
  --design-neutral-400: #9fa498;
  --design-neutral-500: #83887d;
  --design-neutral-600: #6c7165;
  --design-neutral-700: #565a50;
  --design-neutral-800: #40443b;
  --design-neutral-900: #2c2f28;
  --design-neutral-950: #191c16;
  --design-surface-1: #f4f9ec;
  --design-surface-2: #fbfff6;
  --design-surface-3: #e7ecdf;
  --design-surface-hover: #dde2d5;
  --design-surface-active: #d3d8cb;
  --design-text: #1b1e15;
  --design-text-muted: #53574c;
  --design-border: #d5dacd;
  --design-border-strong: #83887d;
  --design-primary: #779b1a;
  --design-on-primary: #000000;
  --design-primary-hover: #83a82d;
  --design-primary-active: #8fb43c;
  --design-frame: #374b00;
  --design-on-frame: #ffffff;
  --design-frame-hover: #2e3f00;
  --design-frame-active: #253400;
  --design-link: #4b6500;
  --design-success: #006d1a;
  --design-on-success: #ffffff;
  --design-success-hover: #006016;
  --design-success-active: #005312;
  --design-success-subtle: #ddeddc;
  --design-success-border: #97c59e;
  --design-warning: #7e5400;
  --design-on-warning: #ffffff;
  --design-warning-hover: #704a00;
  --design-warning-active: #614000;
  --design-warning-subtle: #ecead8;
  --design-warning-border: #c9bb94;
  --design-danger: #a7332e;
  --design-on-danger: #ffffff;
  --design-danger-hover: #992523;
  --design-danger-active: #8c1617;
  --design-danger-subtle: #f1e7de;
  --design-danger-border: #d9ada6;
  --design-info: #00619a;
  --design-on-info: #ffffff;
  --design-info-hover: #005589;
  --design-info-active: #004a77;
  --design-info-subtle: #ddeceb;
  --design-info-border: #97c0d1;
  --design-primary-50-rgb: 239, 250, 223;
  --design-primary-100-rgb: 225, 243, 199;
  --design-primary-200-rgb: 201, 227, 160;
  --design-primary-300-rgb: 171, 204, 113;
  --design-primary-400-rgb: 141, 177, 64;
  --design-primary-500-rgb: 113, 149, 12;
  --design-primary-600-rgb: 92, 123, 0;
  --design-primary-700-rgb: 73, 98, 0;
  --design-primary-800-rgb: 55, 75, 0;
  --design-primary-900-rgb: 37, 52, 0;
  --design-primary-950-rgb: 21, 31, 0;
  --design-neutral-50-rgb: 244, 246, 242;
  --design-neutral-100-rgb: 234, 236, 231;
  --design-neutral-200-rgb: 214, 217, 209;
  --design-neutral-300-rgb: 187, 191, 182;
  --design-neutral-400-rgb: 159, 164, 152;
  --design-neutral-500-rgb: 131, 136, 125;
  --design-neutral-600-rgb: 108, 113, 101;
  --design-neutral-700-rgb: 86, 90, 80;
  --design-neutral-800-rgb: 64, 68, 59;
  --design-neutral-900-rgb: 44, 47, 40;
  --design-neutral-950-rgb: 25, 28, 22;
  --design-surface-1-rgb: 244, 249, 236;
  --design-surface-2-rgb: 251, 255, 246;
  --design-surface-3-rgb: 231, 236, 223;
  --design-surface-hover-rgb: 221, 226, 213;
  --design-surface-active-rgb: 211, 216, 203;
  --design-text-rgb: 27, 30, 21;
  --design-text-muted-rgb: 83, 87, 76;
  --design-border-rgb: 213, 218, 205;
  --design-border-strong-rgb: 131, 136, 125;
  --design-primary-rgb: 119, 155, 26;
  --design-on-primary-rgb: 0, 0, 0;
  --design-primary-hover-rgb: 131, 168, 45;
  --design-primary-active-rgb: 143, 180, 60;
  --design-frame-rgb: 55, 75, 0;
  --design-on-frame-rgb: 255, 255, 255;
  --design-frame-hover-rgb: 46, 63, 0;
  --design-frame-active-rgb: 37, 52, 0;
  --design-link-rgb: 75, 101, 0;
  --design-success-rgb: 0, 109, 26;
  --design-on-success-rgb: 255, 255, 255;
  --design-success-hover-rgb: 0, 96, 22;
  --design-success-active-rgb: 0, 83, 18;
  --design-success-subtle-rgb: 221, 237, 220;
  --design-success-border-rgb: 151, 197, 158;
  --design-warning-rgb: 126, 84, 0;
  --design-on-warning-rgb: 255, 255, 255;
  --design-warning-hover-rgb: 112, 74, 0;
  --design-warning-active-rgb: 97, 64, 0;
  --design-warning-subtle-rgb: 236, 234, 216;
  --design-warning-border-rgb: 201, 187, 148;
  --design-danger-rgb: 167, 51, 46;
  --design-on-danger-rgb: 255, 255, 255;
  --design-danger-hover-rgb: 153, 37, 35;
  --design-danger-active-rgb: 140, 22, 23;
  --design-danger-subtle-rgb: 241, 231, 222;
  --design-danger-border-rgb: 217, 173, 166;
  --design-info-rgb: 0, 97, 154;
  --design-on-info-rgb: 255, 255, 255;
  --design-info-hover-rgb: 0, 85, 137;
  --design-info-active-rgb: 0, 74, 119;
  --design-info-subtle-rgb: 221, 236, 235;
  --design-info-border-rgb: 151, 192, 209;
  --design-shadow-color: 0, 0, 0, 0.10;
  --design-invert: 0;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-design-theme="light"]) {
  --design-primary-50: #151f00;
  --design-primary-100: #253400;
  --design-primary-200: #374b00;
  --design-primary-300: #496200;
  --design-primary-400: #5c7b00;
  --design-primary-500: #71950c;
  --design-primary-600: #8db140;
  --design-primary-700: #abcc71;
  --design-primary-800: #c9e3a0;
  --design-primary-900: #e1f3c7;
  --design-primary-950: #effadf;
  --design-neutral-50: #191c16;
  --design-neutral-100: #2c2f28;
  --design-neutral-200: #40443b;
  --design-neutral-300: #565a50;
  --design-neutral-400: #6c7165;
  --design-neutral-500: #83887d;
  --design-neutral-600: #9fa498;
  --design-neutral-700: #bbbfb6;
  --design-neutral-800: #d6d9d1;
  --design-neutral-900: #eaece7;
  --design-neutral-950: #f4f6f2;
  --design-surface-1: #0e1108;
  --design-surface-2: #171b12;
  --design-surface-3: #22261c;
  --design-surface-hover: #2c3026;
  --design-surface-active: #363a30;
  --design-text: #e8ede1;
  --design-text-muted: #a2a79b;
  --design-border: #31352b;
  --design-border-strong: #6f7468;
  --design-primary: #8db33a;
  --design-on-primary: #000000;
  --design-primary-hover: #99c048;
  --design-primary-active: #a5cd56;
  --design-frame: #253400;
  --design-on-frame: #ffffff;
  --design-frame-hover: #1d2900;
  --design-frame-active: #151f00;
  --design-link: #8db33a;
  --design-success: #69c76e;
  --design-on-success: #000000;
  --design-success-hover: #76d47a;
  --design-success-active: #83e187;
  --design-success-subtle: #21301d;
  --design-success-border: #386037;
  --design-warning: #e59e19;
  --design-on-warning: #000000;
  --design-warning-hover: #f3ab30;
  --design-warning-active: #ffb846;
  --design-warning-subtle: #302b13;
  --design-warning-border: #694f15;
  --design-danger: #ff8579;
  --design-on-danger: #000000;
  --design-danger-hover: #ff9b90;
  --design-danger-active: #ffb0a6;
  --design-danger-subtle: #33281e;
  --design-danger-border: #74453b;
  --design-info: #59b6ff;
  --design-on-info: #000000;
  --design-info-hover: #79c2ff;
  --design-info-active: #95ceff;
  --design-info-subtle: #1f2e2e;
  --design-info-border: #315971;
  --design-primary-50-rgb: 21, 31, 0;
  --design-primary-100-rgb: 37, 52, 0;
  --design-primary-200-rgb: 55, 75, 0;
  --design-primary-300-rgb: 73, 98, 0;
  --design-primary-400-rgb: 92, 123, 0;
  --design-primary-500-rgb: 113, 149, 12;
  --design-primary-600-rgb: 141, 177, 64;
  --design-primary-700-rgb: 171, 204, 113;
  --design-primary-800-rgb: 201, 227, 160;
  --design-primary-900-rgb: 225, 243, 199;
  --design-primary-950-rgb: 239, 250, 223;
  --design-neutral-50-rgb: 25, 28, 22;
  --design-neutral-100-rgb: 44, 47, 40;
  --design-neutral-200-rgb: 64, 68, 59;
  --design-neutral-300-rgb: 86, 90, 80;
  --design-neutral-400-rgb: 108, 113, 101;
  --design-neutral-500-rgb: 131, 136, 125;
  --design-neutral-600-rgb: 159, 164, 152;
  --design-neutral-700-rgb: 187, 191, 182;
  --design-neutral-800-rgb: 214, 217, 209;
  --design-neutral-900-rgb: 234, 236, 231;
  --design-neutral-950-rgb: 244, 246, 242;
  --design-surface-1-rgb: 14, 17, 8;
  --design-surface-2-rgb: 23, 27, 18;
  --design-surface-3-rgb: 34, 38, 28;
  --design-surface-hover-rgb: 44, 48, 38;
  --design-surface-active-rgb: 54, 58, 48;
  --design-text-rgb: 232, 237, 225;
  --design-text-muted-rgb: 162, 167, 155;
  --design-border-rgb: 49, 53, 43;
  --design-border-strong-rgb: 111, 116, 104;
  --design-primary-rgb: 141, 179, 58;
  --design-on-primary-rgb: 0, 0, 0;
  --design-primary-hover-rgb: 153, 192, 72;
  --design-primary-active-rgb: 165, 205, 86;
  --design-frame-rgb: 37, 52, 0;
  --design-on-frame-rgb: 255, 255, 255;
  --design-frame-hover-rgb: 29, 41, 0;
  --design-frame-active-rgb: 21, 31, 0;
  --design-link-rgb: 141, 179, 58;
  --design-success-rgb: 105, 199, 110;
  --design-on-success-rgb: 0, 0, 0;
  --design-success-hover-rgb: 118, 212, 122;
  --design-success-active-rgb: 131, 225, 135;
  --design-success-subtle-rgb: 33, 48, 29;
  --design-success-border-rgb: 56, 96, 55;
  --design-warning-rgb: 229, 158, 25;
  --design-on-warning-rgb: 0, 0, 0;
  --design-warning-hover-rgb: 243, 171, 48;
  --design-warning-active-rgb: 255, 184, 70;
  --design-warning-subtle-rgb: 48, 43, 19;
  --design-warning-border-rgb: 105, 79, 21;
  --design-danger-rgb: 255, 133, 121;
  --design-on-danger-rgb: 0, 0, 0;
  --design-danger-hover-rgb: 255, 155, 144;
  --design-danger-active-rgb: 255, 176, 166;
  --design-danger-subtle-rgb: 51, 40, 30;
  --design-danger-border-rgb: 116, 69, 59;
  --design-info-rgb: 89, 182, 255;
  --design-on-info-rgb: 0, 0, 0;
  --design-info-hover-rgb: 121, 194, 255;
  --design-info-active-rgb: 149, 206, 255;
  --design-info-subtle-rgb: 31, 46, 46;
  --design-info-border-rgb: 49, 89, 113;
  --design-shadow-color: 0, 0, 0, 0.45;
  --design-invert: 1;
  }
}
:root[data-design-theme="dark"] {
  --design-primary-50: #151f00;
  --design-primary-100: #253400;
  --design-primary-200: #374b00;
  --design-primary-300: #496200;
  --design-primary-400: #5c7b00;
  --design-primary-500: #71950c;
  --design-primary-600: #8db140;
  --design-primary-700: #abcc71;
  --design-primary-800: #c9e3a0;
  --design-primary-900: #e1f3c7;
  --design-primary-950: #effadf;
  --design-neutral-50: #191c16;
  --design-neutral-100: #2c2f28;
  --design-neutral-200: #40443b;
  --design-neutral-300: #565a50;
  --design-neutral-400: #6c7165;
  --design-neutral-500: #83887d;
  --design-neutral-600: #9fa498;
  --design-neutral-700: #bbbfb6;
  --design-neutral-800: #d6d9d1;
  --design-neutral-900: #eaece7;
  --design-neutral-950: #f4f6f2;
  --design-surface-1: #0e1108;
  --design-surface-2: #171b12;
  --design-surface-3: #22261c;
  --design-surface-hover: #2c3026;
  --design-surface-active: #363a30;
  --design-text: #e8ede1;
  --design-text-muted: #a2a79b;
  --design-border: #31352b;
  --design-border-strong: #6f7468;
  --design-primary: #8db33a;
  --design-on-primary: #000000;
  --design-primary-hover: #99c048;
  --design-primary-active: #a5cd56;
  --design-frame: #253400;
  --design-on-frame: #ffffff;
  --design-frame-hover: #1d2900;
  --design-frame-active: #151f00;
  --design-link: #8db33a;
  --design-success: #69c76e;
  --design-on-success: #000000;
  --design-success-hover: #76d47a;
  --design-success-active: #83e187;
  --design-success-subtle: #21301d;
  --design-success-border: #386037;
  --design-warning: #e59e19;
  --design-on-warning: #000000;
  --design-warning-hover: #f3ab30;
  --design-warning-active: #ffb846;
  --design-warning-subtle: #302b13;
  --design-warning-border: #694f15;
  --design-danger: #ff8579;
  --design-on-danger: #000000;
  --design-danger-hover: #ff9b90;
  --design-danger-active: #ffb0a6;
  --design-danger-subtle: #33281e;
  --design-danger-border: #74453b;
  --design-info: #59b6ff;
  --design-on-info: #000000;
  --design-info-hover: #79c2ff;
  --design-info-active: #95ceff;
  --design-info-subtle: #1f2e2e;
  --design-info-border: #315971;
  --design-primary-50-rgb: 21, 31, 0;
  --design-primary-100-rgb: 37, 52, 0;
  --design-primary-200-rgb: 55, 75, 0;
  --design-primary-300-rgb: 73, 98, 0;
  --design-primary-400-rgb: 92, 123, 0;
  --design-primary-500-rgb: 113, 149, 12;
  --design-primary-600-rgb: 141, 177, 64;
  --design-primary-700-rgb: 171, 204, 113;
  --design-primary-800-rgb: 201, 227, 160;
  --design-primary-900-rgb: 225, 243, 199;
  --design-primary-950-rgb: 239, 250, 223;
  --design-neutral-50-rgb: 25, 28, 22;
  --design-neutral-100-rgb: 44, 47, 40;
  --design-neutral-200-rgb: 64, 68, 59;
  --design-neutral-300-rgb: 86, 90, 80;
  --design-neutral-400-rgb: 108, 113, 101;
  --design-neutral-500-rgb: 131, 136, 125;
  --design-neutral-600-rgb: 159, 164, 152;
  --design-neutral-700-rgb: 187, 191, 182;
  --design-neutral-800-rgb: 214, 217, 209;
  --design-neutral-900-rgb: 234, 236, 231;
  --design-neutral-950-rgb: 244, 246, 242;
  --design-surface-1-rgb: 14, 17, 8;
  --design-surface-2-rgb: 23, 27, 18;
  --design-surface-3-rgb: 34, 38, 28;
  --design-surface-hover-rgb: 44, 48, 38;
  --design-surface-active-rgb: 54, 58, 48;
  --design-text-rgb: 232, 237, 225;
  --design-text-muted-rgb: 162, 167, 155;
  --design-border-rgb: 49, 53, 43;
  --design-border-strong-rgb: 111, 116, 104;
  --design-primary-rgb: 141, 179, 58;
  --design-on-primary-rgb: 0, 0, 0;
  --design-primary-hover-rgb: 153, 192, 72;
  --design-primary-active-rgb: 165, 205, 86;
  --design-frame-rgb: 37, 52, 0;
  --design-on-frame-rgb: 255, 255, 255;
  --design-frame-hover-rgb: 29, 41, 0;
  --design-frame-active-rgb: 21, 31, 0;
  --design-link-rgb: 141, 179, 58;
  --design-success-rgb: 105, 199, 110;
  --design-on-success-rgb: 0, 0, 0;
  --design-success-hover-rgb: 118, 212, 122;
  --design-success-active-rgb: 131, 225, 135;
  --design-success-subtle-rgb: 33, 48, 29;
  --design-success-border-rgb: 56, 96, 55;
  --design-warning-rgb: 229, 158, 25;
  --design-on-warning-rgb: 0, 0, 0;
  --design-warning-hover-rgb: 243, 171, 48;
  --design-warning-active-rgb: 255, 184, 70;
  --design-warning-subtle-rgb: 48, 43, 19;
  --design-warning-border-rgb: 105, 79, 21;
  --design-danger-rgb: 255, 133, 121;
  --design-on-danger-rgb: 0, 0, 0;
  --design-danger-hover-rgb: 255, 155, 144;
  --design-danger-active-rgb: 255, 176, 166;
  --design-danger-subtle-rgb: 51, 40, 30;
  --design-danger-border-rgb: 116, 69, 59;
  --design-info-rgb: 89, 182, 255;
  --design-on-info-rgb: 0, 0, 0;
  --design-info-hover-rgb: 121, 194, 255;
  --design-info-active-rgb: 149, 206, 255;
  --design-info-subtle-rgb: 31, 46, 46;
  --design-info-border-rgb: 49, 89, 113;
  --design-shadow-color: 0, 0, 0, 0.45;
  --design-invert: 1;
}
:root {
  --design-font: system-ui, -apple-system, "Segoe UI", Roboto, "Liberation Sans", Arial, sans-serif;
  --design-radius-sm: 4px;
  --design-radius: 8px;
  --design-radius-lg: 12px;
  --design-space-1: 4px;
  --design-space-2: 8px;
  --design-space-3: 12px;
  --design-space-4: 16px;
  --design-space-5: 24px;
  --design-space-6: 32px;
  --design-shadow-1: 0 1px 2px rgba(var(--design-shadow-color));
  --design-shadow-2: 0 2px 8px rgba(var(--design-shadow-color));
  --design-shadow-3: 0 8px 24px rgba(var(--design-shadow-color));
  --design-focus-ring: 0 0 0 3px color-mix(in srgb, var(--design-link) 45%, transparent);
  --design-focus-ring-inset: inset 0 0 0 1px var(--design-link);
}
:root {
  --bs-font-sans-serif: var(--design-font);
  --bs-body-font-family: var(--design-font);
  --bs-body-color: var(--design-text);
  --bs-body-color-rgb: var(--design-text-rgb);
  --bs-body-bg: var(--design-surface-1);
  --bs-body-bg-rgb: var(--design-surface-1-rgb);
  --bs-emphasis-color: var(--design-text);
  --bs-emphasis-color-rgb: var(--design-text-rgb);
  --bs-secondary-color: var(--design-text-muted);
  --bs-secondary-color-rgb: var(--design-text-muted-rgb);
  --bs-secondary-bg: var(--design-surface-3);
  --bs-secondary-bg-rgb: var(--design-surface-3-rgb);
  --bs-tertiary-color: var(--design-text-muted);
  --bs-tertiary-color-rgb: var(--design-text-muted-rgb);
  --bs-tertiary-bg: var(--design-surface-2);
  --bs-tertiary-bg-rgb: var(--design-surface-2-rgb);
  --bs-primary: var(--design-primary);
  --bs-primary-rgb: var(--design-primary-rgb);
  --bs-secondary: var(--design-neutral-600);
  --bs-secondary-rgb: var(--design-neutral-600-rgb);
  --bs-success: var(--design-success);
  --bs-success-rgb: var(--design-success-rgb);
  --bs-success-text-emphasis: var(--design-success);
  --bs-success-bg-subtle: var(--design-success-subtle);
  --bs-success-border-subtle: var(--design-success-border);
  --bs-warning: var(--design-warning);
  --bs-warning-rgb: var(--design-warning-rgb);
  --bs-warning-text-emphasis: var(--design-warning);
  --bs-warning-bg-subtle: var(--design-warning-subtle);
  --bs-warning-border-subtle: var(--design-warning-border);
  --bs-danger: var(--design-danger);
  --bs-danger-rgb: var(--design-danger-rgb);
  --bs-danger-text-emphasis: var(--design-danger);
  --bs-danger-bg-subtle: var(--design-danger-subtle);
  --bs-danger-border-subtle: var(--design-danger-border);
  --bs-info: var(--design-info);
  --bs-info-rgb: var(--design-info-rgb);
  --bs-info-text-emphasis: var(--design-info);
  --bs-info-bg-subtle: var(--design-info-subtle);
  --bs-info-border-subtle: var(--design-info-border);
  --bs-primary-text-emphasis: var(--design-link);
  --bs-primary-bg-subtle: var(--design-primary-100);
  --bs-primary-border-subtle: var(--design-primary-300);
  --bs-light: var(--design-surface-2);
  --bs-light-rgb: var(--design-surface-2-rgb);
  --bs-dark: var(--design-neutral-900);
  --bs-dark-rgb: var(--design-neutral-900-rgb);
  --bs-white: var(--design-surface-2);
  --bs-white-rgb: var(--design-surface-2-rgb);
  --bs-black: var(--design-text);
  --bs-black-rgb: var(--design-text-rgb);
  --bs-gray: var(--design-neutral-500);
  --bs-gray-dark: var(--design-neutral-800);
  --bs-gray-100: var(--design-neutral-100);
  --bs-gray-200: var(--design-neutral-200);
  --bs-gray-300: var(--design-neutral-300);
  --bs-gray-400: var(--design-neutral-400);
  --bs-gray-500: var(--design-neutral-500);
  --bs-gray-600: var(--design-neutral-600);
  --bs-gray-700: var(--design-neutral-700);
  --bs-gray-800: var(--design-neutral-800);
  --bs-gray-900: var(--design-neutral-900);
  --bs-link-color: var(--design-link);
  --bs-link-color-rgb: var(--design-link-rgb);
  --bs-link-hover-color: var(--design-primary-800);
  --bs-link-hover-color-rgb: var(--design-primary-800-rgb);
  --bs-code-color: var(--design-danger);
  --bs-highlight-color: var(--design-text);
  --bs-highlight-bg: var(--design-warning-subtle);
  --bs-border-color: var(--design-border);
  --bs-border-color-translucent: rgba(var(--design-text-rgb), 0.15);
  --bs-border-radius-sm: var(--design-radius-sm);
  --bs-border-radius: var(--design-radius);
  --bs-border-radius-lg: var(--design-radius-lg);
  --bs-box-shadow-sm: var(--design-shadow-1);
  --bs-box-shadow: var(--design-shadow-2);
  --bs-box-shadow-lg: var(--design-shadow-3);
  --bs-focus-ring-color: color-mix(in srgb, var(--design-link) 45%, transparent);
  --bs-table-color: var(--design-text);
  --bs-table-bg: transparent;
  --bs-table-border-color: var(--design-border);
  --bs-table-striped-bg: var(--design-surface-3);
  --bs-table-hover-bg: rgba(var(--design-primary-rgb), 0.06);
}
@layer infinito-design {
  :root {
    color-scheme: light;
  }
  @media (prefers-color-scheme: dark) {
    :root:not([data-design-theme="light"]) {
      color-scheme: dark;
    }
  }
  :root[data-design-theme="dark"] {
    color-scheme: dark;
  }
  html {
    accent-color: var(--design-primary);
    scrollbar-color: var(--design-neutral-400) var(--design-surface-1);
  }
  body {
    background-color: var(--design-surface-1);
    color: var(--design-text);
    font-family: var(--design-font);
  }
  ::selection {
    background-color: var(--design-primary-200);
    color: var(--design-text);
  }
  a {
    color: var(--design-link);
  }
  a:hover {
    color: var(--bs-link-hover-color);
  }
  :focus-visible {
    outline: 2px solid var(--design-focus, var(--design-link));
    outline-offset: 2px;
  }
  button {
    background-color: var(--design-surface-3);
    color: var(--design-text);
    border: 1px solid var(--design-border);
    border-radius: var(--design-radius);
  }
  button:hover {
    background-color: var(--design-surface-hover);
  }
  button:active {
    background-color: var(--design-surface-active);
  }
  input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]),
  textarea,
  select {
    background-color: var(--design-surface-2);
    color: var(--design-text);
    border: 1px solid var(--design-border-strong);
    border-radius: var(--design-radius);
  }
  input::placeholder,
  textarea::placeholder {
    color: var(--design-text-muted);
  }
  input:hover,
  textarea:hover,
  select:hover {
    border-color: var(--design-primary);
  }
  input:focus-visible,
  textarea:focus-visible,
  select:focus-visible {
    border-color: var(--design-focus, var(--design-link));
    outline-offset: -2px;
  }
  input:user-invalid,
  textarea:user-invalid,
  select:user-invalid {
    border-color: var(--design-danger);
  }
  input:disabled,
  textarea:disabled,
  select:disabled {
    background-color: var(--design-surface-3);
    color: var(--design-text-muted);
  }
  option {
    background-color: var(--design-surface-2);
    color: var(--design-text);
  }
  th, td {
    border-color: var(--design-border);
  }
  thead {
    background-color: var(--design-surface-3);
    color: var(--design-text);
  }
}