:root {
    /* primitive token (原始值:列舉顏色值)
  ------------------------------------------*/
    /*neutral*/
    /* neutral */
    --neutral-white: #fff;
    --neutral-1: #F7F8FA;
    --neutral-2: #F2F3F5;
    --neutral-3: #E5E6EB;
    --neutral-4: #C9CDD4;
    --neutral-5: #A9AEB8;
    --neutral-6: #86909C;
    --neutral-7: #6B7785;
    --neutral-8: #4E5969;
    --neutral-9: #272E3B;
    --neutral-10: #1D2129;
    --neutral-black: #000;
    /* lime */
    --lime-98: #ecf6de;
    --lime-95: #d3eabf;
    --lime-80: #9ED900;
    --lime-sourse: #73C12D;
    --lime-sourse-rgb: 115, 193, 45; /* raw-rgb */
    --lime-50: #376b00;
    --lime-40: #1D6C00;
    --lime-30: #145300;
    --lime-10: #072102;
    /* orange */
    --orange-95: #FFEDE3;
    --orange-90: #FFDCC6;
    --orange-80: #FFB785;
    --orange-sourse: #FF8500;
    --orange-sourse-rgb: 245, 125, 0; /* raw-rgb */
    --orange-50: #B4621C;
    --orange-40: #954A00;
    --orange-30: #713700;
    --orange-10: #301400;
    /* sky */
    --sky-95: #E4F3FF;
    --sky-90: #C7E7FF;
    --sky-80: #86CFFF;
    --sky-sourse: #449BCA; /*無障礙 Tom20251017*/
    --sky-sourse-rgb: 0, 182, 254; /* raw-rgb */
    --sky-50: #307EA9;
    --sky-40: #00658F;
    --sky-30: #004C6D;
    --sky-10: #001E2E;
    /* magenta */
    --magenta-95: #FFEDEF;
    --magenta-90: #FFD9E1;
    --magenta-80: #FFB1C5;
    --magenta-sourse: #FF5A94;
    --magenta-sourse-rgb: 255, 90, 148; /* raw-rgb */
    --magenta-50: #D53974;
    --magenta-40: #B41C5C;
    --magenta-30: #8F0044;
    --magenta-10: #3F001A;
    /* violet */
    --violet-95: #F5EEFF;
    --violet-90: #E8DDFF;
    --violet-80: #CEBDFF;
    --violet-sourse: #805FDB;
    --violet-sourse-rgb: 128, 95, 219; /* raw-rgb */
    --violet-50: #8161DD;
    --violet-40: #6846C2;
    --violet-30: #390193;
    --violet-10: #21005D;
    /* green */
    --green-95: #D5FCC1;
    --green-90: #BEF1A8;
    --green-80: #8DDA73;
    --green-sourse: #208900;
    --green-sourse-rgb: 32, 137, 0; /* raw-rgb */
    --green-50: #35881F;
    --green-40: #186E00;
    --green-30: #083900;
    --green-10: #032100;
    /* blue */
    --blue-95: #ECF0FF;
    --blue-90: #D6E3FF;
    --blue-80: #A9C7FF;
    --blue-sourse: #0077E5;
    --blue-sourse-rgb: 0, 119, 229; /* raw-rgb */
    --blue-50: #3377D1;
    --blue-40: #005DB6;
    --blue-30: #003062;
    --blue-10: #003062;
    /* tech-blue */
    --tech-blue-95: #EFEFFF;
    --tech-blue-90: #DEE1FF;
    --tech-blue-80: #B8C3FF;
    --tech-blue-sourse: #254BD3;
    --tech-blue-sourse-rgb: 37, 75, 211;
    --tech-blue-50: #476AFA;
    --tech-blue-40: #2C50D8;
    --tech-blue-30: #0C267F;
    --tech-blue-10: #1F2C64;
    /* yellow */
    --yellow-98: #FFF9ED;
    --yellow-95: #FFF1B9;
    --yellow-90: #FFE24B;
    --yellow-sourse: #F6D600;
    --yellow-sourse-rgb: 246, 214, 0;
    --yellow-50: #967200;
    --yellow-40: #775A00;
    --yellow-30: #5A4300;
    --yellow-10: #251A00;
    /* red */
    --red-95: #FFEDEA;
    --red-90: #FFDAD5;
    --red-80: #FFB4A8;
    --red-sourse: #E13325;
    --red-sourse-rgb: 188, 20, 13;
    --red-50: #E13325;
    --red-40: #BC140D;
    --red-30: #930002;
    --red-10: #410000;
    /* alias (別名:定義顏色值)
  ------------------------------------------*/
    /*neutral*/
    /* neutal-border */
    --neutral-border-4: var(--neutral-6, #86909C);
    --neutral-border-3: var(--neutral-4, #C9CDD4);
    --neutral-border-2: var(--neutral-3, #E5E6EB);
    --neutral-border-1: var(--neutral-2, #F2F3F5);
    /* neutal-fill */
    --neutral-fill-6: var(--neutral-10, #1D2129);
    --neutral-fill-5: var(--neutral-5, #A9AEB8);
    --neutral-fill-4: var(--neutral-4, #C9CDD4);
    --neutral-fill-3: var(--neutral-3, #E5E6EB);
    --neutral-fill-2: var(--neutral-2, #F2F3F5);
    --neutral-fill-1: var(--neutral-1, #F7F8FA);
    --neutral-fill-0: var(--neutral-white, #fff);
    /* neutal-text */
    --neutral-text-1: var(--neutral-10, #1D2129);
    --neutral-text-2: var(--neutral-8, #4E5969);
    --neutral-text-3: var(--neutral-6, #86909C);
    --neutral-text-4: var(--neutral-5, #A9AEB8);
    --neutral-text-5: var(--neutral-white, #fff);
    /* semantic color */
    /*link*/
    --link-foreground: #0066FF;
    /* danger */
    --danger-foreground: var(--red-40,#BC140D);
    --danger-background: var(--red-95,#FFEDEA);
    --danger-stroke: var(--red-50,#E13325);
    --danger-rgb: var(--red-sourse-rgb);
    /* success */
    --success-forground: var(--green-40, #208900);
    /* note */
    --note-forground: #F85390;
    /*theme(oridinal, theme 1)*/
    --theme: var(--lime-sourse, #73C12D);
    --theme-rgb: var(--lime-sourse-rgb);
    --theme-sourse-filter: brightness(0) saturate(100%) invert(59%) sepia(94%) saturate(345%) hue-rotate(49deg) brightness(94%) contrast(93%);
    /* background */
    --theme-background-1: var(--lime-50, #278A00);
    --theme-background-2: var(--lime-sourse, #73C12D);
    --theme-background-3: var(--lime-95, #DDFD9A);
    --theme-background-4: var(--lime-98, #F2FFD1);
    /* foreground */
    --theme-foreground-1: var(--lime-sourse, #73C12D);
    --theme-foreground-2: var(--lime-40, #145300);
    --theme-foreground-onColor-1: var(--lime-10, #072102);
    --theme-foreground-onColor-2: var(--lime-30, #245115);
    --theme-foreground-onColor-3: var(--lime-sourse, #73C12D);
    --theme-stroke: var(--lime-sourse, #73C12D);
}

/* orange */
[data-theme="2"] {
  --theme: var(--orange-sourse, #F57D00);
  --theme-rgb: var(--orange-sourse-rgb);
  --theme-sourse-filter: brightness(0) saturate(100%) invert(67%) sepia(77%) saturate(4727%) hue-rotate(3deg) brightness(100%) contrast(100%);
    /* background */
    --theme-background-1: var(--orange-50, #B4621C);
    --theme-background-2: var(--orange-sourse, #F57D00);
    --theme-background-3: var(--orange-90, #FFDCC6);
    --theme-background-4: var(--orange-95, #FFEDE3);
    /* foreground */
    --theme-foreground-1: var(--orange-sourse, #F57D00);
    --theme-foreground-2: var(--orange-40, #954A00);
    --theme-foreground-onColor-1: var(--orange-10, #301400);
    --theme-foreground-onColor-2: var(--orange-30, #713700);
    --theme-foreground-onColor-3: var(--orange-sourse, #F57D00);
    --theme-stroke: var(--orange-sourse, #F57D00);
}

/* sky blue */
[data-theme="3"] {
  --theme: var(--sky-sourse, #00B6FE);
  --theme-rgb: var(--sky-sourse-rgb);
  --theme-sourse-filter: brightness(0) saturate(100%) invert(58%) sepia(45%) saturate(6159%) hue-rotate(170deg) brightness(109%) contrast(101%);
    /* background */
    --theme-background-1: var(--sky-50, #307EA9);
    --theme-background-2: var(--sky-sourse, #00B6FE);
    --theme-background-3: var(--sky-90, #C7E7FF);
    --theme-background-4: var(--sky-95, #E4F3FF);
    /* foreground */
    --theme-foreground-1: var(--sky-sourse, #00B6FE);
    --theme-foreground-2: var(--sky-40, #00658F);
    --theme-foreground-onColor-1: var(--sky-10, #001E2E);
    --theme-foreground-onColor-2: var(--sky-30, #004C6D);
    --theme-foreground-onColor-3: var(--sky-sourse, #00B6FE);
    --theme-stroke: var(--sky-sourse, #00B6FE);
}

/* magenta */
[data-theme="4"] {
  --theme: var(--magenta-sourse, #FF5A94);
  --theme-rgb: var(--magenta-sourse-rgb);
  --theme-sourse-filter: brightness(0) saturate(100%) invert(49%) sepia(87%) saturate(1632%) hue-rotate(307deg) brightness(100%) contrast(103%);
    /* background */
    --theme-background-1: var(--magenta-50, #D53974);
    --theme-background-2: var(--magenta-sourse, #FF5A94);
    --theme-background-3: var(--magenta-90, #FFD9E1);
    --theme-background-4: var(--magenta-95, #FFEDEF);
    /* foreground */
    --theme-foreground-1: var(--magenta-sourse, #FF5A94);
    --theme-foreground-2: var(--magenta-40, #B41C5C);
    --theme-foreground-onColor-1: var(--magenta-10, #3F001A);
    --theme-foreground-onColor-2: var(--magenta-30, #8F0044);
    --theme-foreground-onColor-3: var(--magenta-sourse, #FF5A94);
    --theme-stroke: var(--magenta-sourse, #FF5A94);
}

/* violet */
[data-theme="5"] {
  --theme: var(--violet-sourse, #805FDB);
  --theme-rgb: var(--violet-sourse-rgb);
  --theme-sourse-filter: brightness(0) saturate(100%) invert(47%) sepia(21%) saturate(6597%) hue-rotate(229deg) brightness(87%) contrast(96%);
    /* background */
    --theme-background-1: var(--violet-50, #8161DD);
    --theme-background-2: var(--violet-sourse, #805FDB);
    --theme-background-3: var(--violet-90, #E8DDFF);
    --theme-background-4: var(--violet-95, #F5EEFF);
    /* foreground */
    --theme-foreground-1: var(--violet-sourse, #805FDB);
    --theme-foreground-2: var(--violet-40, #6846C2);
    --theme-foreground-onColor-1: var(--violet-10, #21005D);
    --theme-foreground-onColor-2: var(--violet-30, #390193);
    --theme-foreground-onColor-3: var(--violet-sourse, #805FDB);
    --theme-stroke: var(--violet-sourse, #805FDB);
}

/* green */
[data-theme="6"] {
  --theme: var(--green-sourse, #208900);
  --theme-rgb: var(--green-sourse-rgb);
  --theme-sourse-filter: brightness(0) saturate(100%) invert(42%) sepia(79%) saturate(5400%) hue-rotate(78deg) brightness(97%) contrast(101%);
    /* background */
    --theme-background-1: var(--green-50, #35881F);
    --theme-background-2: var(--green-sourse, #208900);
    --theme-background-3: var(--green-90, #BEF1A8);
    --theme-background-4: var(--green-95, #D5FCC1);
    /* foreground */
    --theme-foreground-1: var(--green-sourse, #208900);
    --theme-foreground-2: var(--green-40, #186E00);
    --theme-foreground-onColor-1: var(--green-10, #032100);
    --theme-foreground-onColor-2: var(--green-30, #083900);
    --theme-foreground-onColor-3: var(--green-sourse, #208900);
    --theme-stroke: var(--green-sourse, #208900);
}

/* blue */
[data-theme="7"] {
  --theme: var(--blue-sourse, #0077E5);
  --theme-rgb: var(--blue-sourse-rgb);
  --theme-sourse-filter: brightness(0) saturate(100%) invert(37%) sepia(63%) saturate(5219%) hue-rotate(194deg) brightness(95%) contrast(101%);
    /* background */
    --theme-background-1: var(--blue-50, #3377D1);
    --theme-background-2: var(--blue-sourse, #0077E5);
    --theme-background-3: var(--blue-90, #D6E3FF);
    --theme-background-4: var(--blue-95, #ECF0FF);
    /* foreground */
    --theme-foreground-1: var(--blue-sourse, #0077E5);
    --theme-foreground-2: var(--blue-40, #005DB6);
    --theme-foreground-onColor-1: var(--blue-10, #003062);
    --theme-foreground-onColor-2: var(--blue-30, #003062);
    --theme-foreground-onColor-3: var(--blue-sourse, #0077E5);
    --theme-stroke: var(--blue-sourse, #0077E5);
}

/* tech-blue */
[data-theme="8"] {
  --theme: var(--tech-blue-sourse);
  --theme-rgb: var(--tech-blue-sourse-rgb);
  --theme-sourse-filter: brightness(0) saturate(100%) invert(35%) sepia(85%) saturate(4197%) hue-rotate(217deg) brightness(83%) contrast(96%);
    /* background */
    --theme-background-1: var(--tech-blue-50, #476AFA);
    --theme-background-2: var(--tech-blue-sourse, #254BD3);
    --theme-background-3: var(--tech-blue-90, #DEE1FF);
    --theme-background-4: var(--tech-blue-95, #EFEFFF);
    /* foreground */
    --theme-foreground-1: var(--tech-blue-sourse #254BD3);
    --theme-foreground-2: var(--tech-blue-40, #2C50D8);
    --theme-foreground-onColor-1: var(--tech-blue-10, #1F2C64);
    --theme-foreground-onColor-2: var(--tech-blue-30, #0C267F);
    --theme-foreground-onColor-3: var(--tech-blue-sourse, #254BD3);
    --theme-stroke: var(--tech-blue-sourse);
}

/* yellow */
[data-theme="9"] {
  /*theme(oridinal, theme 1)*/
  --theme: var(--yellow-sourse, #F6D600);
  --theme-rgb: var(--yellow-sourse-rgb);
  --theme-sourse-filter: brightness(0) saturate(100%) invert(76%) sepia(95%) saturate(2602%) hue-rotate(8deg) brightness(108%) contrast(101%);
    /* background */
    --theme-background-1: var(--yellow-50);
    --theme-background-2: var(--yellow-sourse, #F6D600);
    --theme-background-3: var(--yellow-95);
    --theme-background-4: var(--yellow-98);
    /* foreground */
    --theme-foreground-1: var(--yellow-sourse, #F6D600);
    --theme-foreground-2: var(--yellow-40, #775A00);
    --theme-foreground-onColor-1: var(--yellow-10);
    --theme-foreground-onColor-2: var(--yellow-30);
    --theme-foreground-onColor-3: var(--yellow-sourse, #F6D600);
    --theme-stroke: var(--yellow-sourse, #F6D600);
}