@unicom-cloud/ui 0.8.74 → 0.8.75

package/style/variables.less

@@ -1,383 +1,163 @@
-@red-1: #ffe6e6;
-@red-2: #fdc3c3;
-@red-3: #fba1a1;
-@red-4: #f98080;
-@red-5: #f75f5f;
-@red-6: #f53f3f;
-@red-7: #c92929;
-@red-8: #9d1818;
-@red-9: #710c0c;
-@red-10: #450404;
-@orangered-1: #ffeee6;
-@orangered-2: #ffd4c1;
-@orangered-3: #ffbb9c;
-@orangered-4: #ffa277;
-@orangered-5: #ff8953;
-@orangered-6: #ff702e;
-@orangered-7: #d1571e;
-@orangered-8: #a34012;
-@orangered-9: #752b08;
-@orangered-10: #471803;
-@orange-1: #fff6e6;
-@orange-2: #ffe6b8;
-@orange-3: #ffd68a;
-@orange-4: #ffc55c;
-@orange-5: #ffb52e;
-@orange-6: #ffa500;
-@orange-7: #d18700;
-@orange-8: #a36a00;
-@orange-9: #754c00;
-@orange-10: #472e00;
-@gold-1: #fff8e6;
-@gold-2: #ffecbc;
-@gold-3: #ffe092;
-@gold-4: #ffd568;
-@gold-5: #ffc93e;
-@gold-6: #ffbd14;
-@gold-7: #d19a0d;
-@gold-8: #a37808;
-@gold-9: #755504;
-@gold-10: #473401;
-@yellow-1: #fffce6;
-@yellow-2: #fff6bc;
-@yellow-3: #fff192;
-@yellow-4: #ffeb68;
-@yellow-5: #ffe63e;
-@yellow-6: #ffe014;
-@yellow-7: #d1b70d;
-@yellow-8: #a38f08;
-@yellow-9: #756604;
-@yellow-10: #473e01;
-@lime-1: #f6ffe6;
-@lime-2: #e4fab9;
-@lime-3: #d3f58f;
-@lime-4: #c2f066;
-@lime-5: #b1eb3f;
-@lime-6: #a1e619;
-@lime-7: #83bd10;
-@lime-8: #66940a;
-@lime-9: #496b05;
-@lime-10: #2d4201;
-@green-1: #e6ffeb;
-@green-2: #adf1bd;
-@green-3: #7ae393;
-@green-4: #4cd46c;
-@green-5: #24c64a;
-@green-6: #00b82b;
-@green-7: #009824;
-@green-8: #00791c;
-@green-9: #005915;
-@green-10: #00390d;
-@cyan-1: #e6ffff;
-@cyan-2: #b3f6f6;
-@cyan-3: #85ecec;
-@cyan-4: #59e3e3;
-@cyan-5: #30d9d9;
-@cyan-6: #0bd0d0;
-@cyan-7: #07abab;
-@cyan-8: #048787;
-@cyan-9: #026262;
-@cyan-10: #013e3e;
-@blue-1: #e6f1ff;
-@blue-2: #c1deff;
-@blue-3: #9ccaff;
-@blue-4: #77b6ff;
-@blue-5: #53a3ff;
-@blue-6: #2e8fff;
-@blue-7: #1e71d1;
-@blue-8: #1255a3;
-@blue-9: #083b75;
-@blue-10: #032347;
-@pqbblue-1: #e6edff;
-@pqbblue-2: #bdd0ff;
-@pqbblue-3: #94b4ff;
-@pqbblue-4: #6b97ff;
-@pqbblue-5: #437bff;
-@pqbblue-6: #1a5eff;
-@pqbblue-7: #114ad1;
-@pqbblue-8: #0a37a3;
-@pqbblue-9: #052675;
-@pqbblue-10: #011647;
-@purple-1: #f0e6ff;
-@purple-2: #d4bbf7;
-@purple-3: #b992f0;
-@purple-4: #a06ce8;
-@purple-5: #8848e1;
-@purple-6: #7126d9;
-@purple-7: #5919b3;
-@purple-8: #430f8c;
-@purple-9: #2f0766;
-@purple-10: #1c0240;
-@pinkpurple-1: #ffe6ff;
-@pinkpurple-2: #f7b8f7;
-@pinkpurple-3: #f08df0;
-@pinkpurple-4: #e864e8;
-@pinkpurple-5: #e13ee1;
-@pinkpurple-6: #d91ad9;
-@pinkpurple-7: #b311b3;
-@pinkpurple-8: #8c0a8c;
-@pinkpurple-9: #660566;
-@pinkpurple-10: #400240;
-@magenta-1: #ffe6f4;
-@magenta-2: #ffc0e3;
-@magenta-3: #ff9ad2;
-@magenta-4: #ff74c1;
-@magenta-5: #ff4fb0;
-@magenta-6: #ff299f;
-@magenta-7: #d11b7f;
-@magenta-8: #a31061;
-@magenta-9: #750844;
-@magenta-10: #470228;
-@gray-1: #f7f8f9;
-@gray-2: #f2f3f4;
-@gray-3: #e5e6e7;
-@gray-4: #c9cacb;
-@gray-5: #a9abac;
-@gray-6: #868788;
-@gray-7: #6b6c6d;
-@gray-8: #4d4e4f;
-@gray-9: #28292a;
-@gray-10: #1e1f20;
-@dark-red-1: #370303;
-@dark-red-2: #630a0a;
-@dark-red-3: #901616;
-@dark-red-4: #bc2727;
-@dark-red-5: #f43030;
-@dark-red-6: #f65151;
-@dark-red-7: #f87171;
-@dark-red-8: #fa9393;
-@dark-red-9: #fcb4b4;
-@dark-red-10: #ffd6d6;
-@dark-orangered-1: #391302;
-@dark-orangered-2: #672607;
-@dark-orangered-3: #953a10;
-@dark-orangered-4: #c4511c;
-@dark-orangered-5: #ff661f;
-@dark-orangered-6: #ff7f43;
-@dark-orangered-7: #ff9868;
-@dark-orangered-8: #ffb18d;
-@dark-orangered-9: #ffcab1;
-@dark-orangered-10: #ffe3d6;
-@dark-orange-1: #382400;
-@dark-orange-2: #664200;
-@dark-orange-3: #946000;
-@dark-orange-4: #c27d00;
-@dark-orange-5: #f09b00;
-@dark-orange-6: #ffb01f;
-@dark-orange-7: #ffc04c;
-@dark-orange-8: #ffd07a;
-@dark-orange-9: #ffe0a8;
-@dark-orange-10: #fff1d6;
-@dark-gold-1: #382901;
-@dark-gold-2: #664b03;
-@dark-gold-3: #956d07;
-@dark-gold-4: #c38f0c;
-@dark-gold-5: #ffb905;
-@dark-gold-6: #ffc42f;
-@dark-gold-7: #ffd058;
-@dark-gold-8: #ffdc82;
-@dark-gold-9: #ffe8ac;
-@dark-gold-10: #fff4d6;
-@dark-yellow-1: #383101;
-@dark-yellow-2: #665903;
-@dark-yellow-3: #958207;
-@dark-yellow-4: #c3ab0c;
-@dark-yellow-5: #ffde05;
-@dark-yellow-6: #ffe42f;
-@dark-yellow-7: #ffe958;
-@dark-yellow-8: #ffef82;
-@dark-yellow-9: #fff4ac;
-@dark-yellow-10: #fffad6;
-@dark-lime-1: #223301;
-@dark-lime-2: #3f5d04;
-@dark-lime-3: #5c8609;
-@dark-lime-4: #79af0f;
-@dark-lime-5: #97d817;
-@dark-lime-6: #abea31;
-@dark-lime-7: #bcef58;
-@dark-lime-8: #cdf481;
-@dark-lime-9: #dff9ab;
-@dark-lime-10: #f1ffd6;
-@dark-green-1: #002a0a;
-@dark-green-2: #004a11;
-@dark-green-3: #006919;
-@dark-green-4: #008920;
-@dark-green-5: #00a927;
-@dark-green-6: #21b945;
-@dark-green-7: #40d162;
-@dark-green-8: #6ee088;
-@dark-green-9: #a0efb3;
-@dark-green-10: #d6ffe0;
-@dark-cyan-1: #012f2f;
-@dark-cyan-2: #025353;
-@dark-cyan-3: #047878;
-@dark-cyan-4: #079d9d;
-@dark-cyan-5: #0ac1c1;
-@dark-cyan-6: #27d4d4;
-@dark-cyan-7: #4ce1e1;
-@dark-cyan-8: #77eaea;
-@dark-cyan-9: #a6f4f4;
-@dark-cyan-10: #d6ffff;
-@dark-blue-1: #021b39;
-@dark-blue-2: #073467;
-@dark-blue-3: #104e95;
-@dark-blue-4: #1c6ac4;
-@dark-blue-5: #1f87ff;
-@dark-blue-6: #439aff;
-@dark-blue-7: #68aeff;
-@dark-blue-8: #8dc2ff;
-@dark-blue-9: #b1d5ff;
-@dark-blue-10: #d6e9ff;
-@dark-pqbblue-1: #011238;
-@dark-pqbblue-2: #042167;
-@dark-pqbblue-3: #093395;
-@dark-pqbblue-4: #1045c3;
-@dark-pqbblue-5: #0b53ff;
-@dark-pqbblue-6: #3370ff;
-@dark-pqbblue-7: #5c8cff;
-@dark-pqbblue-8: #85a9ff;
-@dark-pqbblue-9: #aec6ff;
-@dark-pqbblue-10: #d6e2ff;
-@dark-purple-1: #160231;
-@dark-purple-2: #280658;
-@dark-purple-3: #3d0d7e;
-@dark-purple-4: #5317a5;
-@dark-purple-5: #6a24cc;
-@dark-purple-6: #7f3bde;
-@dark-purple-7: #975fe6;
-@dark-purple-8: #b185ee;
-@dark-purple-9: #ccadf6;
-@dark-purple-10: #e7d6ff;
-@dark-pinkpurple-1: #310131;
-@dark-pinkpurple-2: #570457;
-@dark-pinkpurple-3: #7e097e;
-@dark-pinkpurple-4: #a510a5;
-@dark-pinkpurple-5: #cb18cb;
-@dark-pinkpurple-6: #de31de;
-@dark-pinkpurple-7: #e657e6;
-@dark-pinkpurple-8: #ee7fee;
-@dark-pinkpurple-9: #f6aaf6;
-@dark-pinkpurple-10: #ffd6ff;
-@dark-magenta-1: #390220;
-@dark-magenta-2: #67073c;
-@dark-magenta-3: #950e59;
-@dark-magenta-4: #c41977;
-@dark-magenta-5: #ff1a98;
-@dark-magenta-6: #ff3fa9;
-@dark-magenta-7: #ff65ba;
-@dark-magenta-8: #ff8bcb;
-@dark-magenta-9: #ffb1dc;
-@dark-magenta-10: #ffd6ed;
-@dark-gray-1: #121213;
-@dark-gray-2: #1c1c1d;
-@dark-gray-3: #404142;
-@dark-gray-4: #5e5f60;
-@dark-gray-5: #797a7b;
-@dark-gray-6: #9c9e9f;
-@dark-gray-7: #bcbdbe;
-@dark-gray-8: #d8d9db;
-@dark-gray-9: #e4e6e8;
-@dark-gray-10: #e8ebee;
-@primary-1: rgb(var(--pqbblue-1));
-@primary-2: rgb(var(--pqbblue-2));
-@primary-3: rgb(var(--pqbblue-3));
-@primary-4: rgb(var(--pqbblue-4));
-@primary-5: rgb(var(--pqbblue-5));
-@primary-6: rgb(var(--pqbblue-6));
-@primary-7: rgb(var(--pqbblue-7));
-@primary-8: rgb(var(--pqbblue-8));
-@primary-9: rgb(var(--pqbblue-9));
-@primary-10: rgb(var(--pqbblue-10));
-@dark-primary-1: rgb(var(--pqbblue-1));
-@dark-primary-2: rgb(var(--pqbblue-2));
-@dark-primary-3: rgb(var(--pqbblue-3));
-@dark-primary-4: rgb(var(--pqbblue-4));
-@dark-primary-5: rgb(var(--pqbblue-5));
-@dark-primary-6: rgb(var(--pqbblue-6));
-@dark-primary-7: rgb(var(--pqbblue-7));
-@dark-primary-8: rgb(var(--pqbblue-8));
-@dark-primary-9: rgb(var(--pqbblue-9));
-@dark-primary-10: rgb(var(--pqbblue-10));
-@success-1: rgb(var(--green-1));
-@success-2: rgb(var(--green-2));
-@success-3: rgb(var(--green-3));
-@success-4: rgb(var(--green-4));
-@success-5: rgb(var(--green-5));
-@success-6: rgb(var(--green-6));
-@success-7: rgb(var(--green-7));
-@success-8: rgb(var(--green-8));
-@success-9: rgb(var(--green-9));
-@success-10: rgb(var(--green-10));
-@dark-success-1: rgb(var(--green-1));
-@dark-success-2: rgb(var(--green-2));
-@dark-success-3: rgb(var(--green-3));
-@dark-success-4: rgb(var(--green-4));
-@dark-success-5: rgb(var(--green-5));
-@dark-success-6: rgb(var(--green-6));
-@dark-success-7: rgb(var(--green-7));
-@dark-success-8: rgb(var(--green-8));
-@dark-success-9: rgb(var(--green-9));
-@dark-success-10: rgb(var(--green-10));
-@danger-1: rgb(var(--red-1));
-@danger-2: rgb(var(--red-2));
-@danger-3: rgb(var(--red-3));
-@danger-4: rgb(var(--red-4));
-@danger-5: rgb(var(--red-5));
-@danger-6: rgb(var(--red-6));
-@danger-7: rgb(var(--red-7));
-@danger-8: rgb(var(--red-8));
-@danger-9: rgb(var(--red-9));
-@danger-10: rgb(var(--red-10));
-@dark-danger-1: rgb(var(--red-1));
-@dark-danger-2: rgb(var(--red-2));
-@dark-danger-3: rgb(var(--red-3));
-@dark-danger-4: rgb(var(--red-4));
-@dark-danger-5: rgb(var(--red-5));
-@dark-danger-6: rgb(var(--red-6));
-@dark-danger-7: rgb(var(--red-7));
-@dark-danger-8: rgb(var(--red-8));
-@dark-danger-9: rgb(var(--red-9));
-@dark-danger-10: rgb(var(--red-10));
-@warning-1: rgb(var(--orange-1));
-@warning-2: rgb(var(--orange-2));
-@warning-3: rgb(var(--orange-3));
-@warning-4: rgb(var(--orange-4));
-@warning-5: rgb(var(--orange-5));
-@warning-6: rgb(var(--orange-6));
-@warning-7: rgb(var(--orange-7));
-@warning-8: rgb(var(--orange-8));
-@warning-9: rgb(var(--orange-9));
-@warning-10: rgb(var(--orange-10));
-@dark-warning-1: rgb(var(--orange-1));
-@dark-warning-2: rgb(var(--orange-2));
-@dark-warning-3: rgb(var(--orange-3));
-@dark-warning-4: rgb(var(--orange-4));
-@dark-warning-5: rgb(var(--orange-5));
-@dark-warning-6: rgb(var(--orange-6));
-@dark-warning-7: rgb(var(--orange-7));
-@dark-warning-8: rgb(var(--orange-8));
-@dark-warning-9: rgb(var(--orange-9));
-@dark-warning-10: rgb(var(--orange-10));
-@link-1: rgb(var(--pqbblue-1));
-@link-2: rgb(var(--pqbblue-2));
-@link-3: rgb(var(--pqbblue-3));
-@link-4: rgb(var(--pqbblue-4));
-@link-5: rgb(var(--pqbblue-5));
-@link-6: rgb(var(--pqbblue-6));
-@link-7: rgb(var(--pqbblue-7));
-@link-8: rgb(var(--pqbblue-8));
-@link-9: rgb(var(--pqbblue-9));
-@link-10: rgb(var(--pqbblue-10));
-@dark-link-1: rgb(var(--pqbblue-1));
-@dark-link-2: rgb(var(--pqbblue-2));
-@dark-link-3: rgb(var(--pqbblue-3));
-@dark-link-4: rgb(var(--pqbblue-4));
-@dark-link-5: rgb(var(--pqbblue-5));
-@dark-link-6: rgb(var(--pqbblue-6));
-@dark-link-7: rgb(var(--pqbblue-7));
-@dark-link-8: rgb(var(--pqbblue-8));
-@dark-link-9: rgb(var(--pqbblue-9));
-@dark-link-10: rgb(var(--pqbblue-10));
+@red-1: rgb(var(--red-1));
+@red-2: rgb(var(--red-2));
+@red-3: rgb(var(--red-3));
+@red-4: rgb(var(--red-4));
+@red-5: rgb(var(--red-5));
+@red-6: rgb(var(--red-6));
+@red-7: rgb(var(--red-7));
+@red-8: rgb(var(--red-8));
+@red-9: rgb(var(--red-9));
+@red-10: rgb(var(--red-10));
+@orangered-1: rgb(var(--orangered-1));
+@orangered-2: rgb(var(--orangered-2));
+@orangered-3: rgb(var(--orangered-3));
+@orangered-4: rgb(var(--orangered-4));
+@orangered-5: rgb(var(--orangered-5));
+@orangered-6: rgb(var(--orangered-6));
+@orangered-7: rgb(var(--orangered-7));
+@orangered-8: rgb(var(--orangered-8));
+@orangered-9: rgb(var(--orangered-9));
+@orangered-10: rgb(var(--orangered-10));
+@orange-1: rgb(var(--orange-1));
+@orange-2: rgb(var(--orange-2));
+@orange-3: rgb(var(--orange-3));
+@orange-4: rgb(var(--orange-4));
+@orange-5: rgb(var(--orange-5));
+@orange-6: rgb(var(--orange-6));
+@orange-7: rgb(var(--orange-7));
+@orange-8: rgb(var(--orange-8));
+@orange-9: rgb(var(--orange-9));
+@orange-10: rgb(var(--orange-10));
+@gold-1: rgb(var(--gold-1));
+@gold-2: rgb(var(--gold-2));
+@gold-3: rgb(var(--gold-3));
+@gold-4: rgb(var(--gold-4));
+@gold-5: rgb(var(--gold-5));
+@gold-6: rgb(var(--gold-6));
+@gold-7: rgb(var(--gold-7));
+@gold-8: rgb(var(--gold-8));
+@gold-9: rgb(var(--gold-9));
+@gold-10: rgb(var(--gold-10));
+@yellow-1: rgb(var(--yellow-1));
+@yellow-2: rgb(var(--yellow-2));
+@yellow-3: rgb(var(--yellow-3));
+@yellow-4: rgb(var(--yellow-4));
+@yellow-5: rgb(var(--yellow-5));
+@yellow-6: rgb(var(--yellow-6));
+@yellow-7: rgb(var(--yellow-7));
+@yellow-8: rgb(var(--yellow-8));
+@yellow-9: rgb(var(--yellow-9));
+@yellow-10: rgb(var(--yellow-10));
+@lime-1: rgb(var(--lime-1));
+@lime-2: rgb(var(--lime-2));
+@lime-3: rgb(var(--lime-3));
+@lime-4: rgb(var(--lime-4));
+@lime-5: rgb(var(--lime-5));
+@lime-6: rgb(var(--lime-6));
+@lime-7: rgb(var(--lime-7));
+@lime-8: rgb(var(--lime-8));
+@lime-9: rgb(var(--lime-9));
+@lime-10: rgb(var(--lime-10));
+@green-1: rgb(var(--green-1));
+@green-2: rgb(var(--green-2));
+@green-3: rgb(var(--green-3));
+@green-4: rgb(var(--green-4));
+@green-5: rgb(var(--green-5));
+@green-6: rgb(var(--green-6));
+@green-7: rgb(var(--green-7));
+@green-8: rgb(var(--green-8));
+@green-9: rgb(var(--green-9));
+@green-10: rgb(var(--green-10));
+@cyan-1: rgb(var(--cyan-1));
+@cyan-2: rgb(var(--cyan-2));
+@cyan-3: rgb(var(--cyan-3));
+@cyan-4: rgb(var(--cyan-4));
+@cyan-5: rgb(var(--cyan-5));
+@cyan-6: rgb(var(--cyan-6));
+@cyan-7: rgb(var(--cyan-7));
+@cyan-8: rgb(var(--cyan-8));
+@cyan-9: rgb(var(--cyan-9));
+@cyan-10: rgb(var(--cyan-10));
+@blue-1: rgb(var(--blue-1));
+@blue-2: rgb(var(--blue-2));
+@blue-3: rgb(var(--blue-3));
+@blue-4: rgb(var(--blue-4));
+@blue-5: rgb(var(--blue-5));
+@blue-6: rgb(var(--blue-6));
+@blue-7: rgb(var(--blue-7));
+@blue-8: rgb(var(--blue-8));
+@blue-9: rgb(var(--blue-9));
+@blue-10: rgb(var(--blue-10));
+@pqbblue-1: rgb(var(--pqbblue-1));
+@pqbblue-2: rgb(var(--pqbblue-2));
+@pqbblue-3: rgb(var(--pqbblue-3));
+@pqbblue-4: rgb(var(--pqbblue-4));
+@pqbblue-5: rgb(var(--pqbblue-5));
+@pqbblue-6: rgb(var(--pqbblue-6));
+@pqbblue-7: rgb(var(--pqbblue-7));
+@pqbblue-8: rgb(var(--pqbblue-8));
+@pqbblue-9: rgb(var(--pqbblue-9));
+@pqbblue-10: rgb(var(--pqbblue-10));
+@purple-1: rgb(var(--purple-1));
+@purple-2: rgb(var(--purple-2));
+@purple-3: rgb(var(--purple-3));
+@purple-4: rgb(var(--purple-4));
+@purple-5: rgb(var(--purple-5));
+@purple-6: rgb(var(--purple-6));
+@purple-7: rgb(var(--purple-7));
+@purple-8: rgb(var(--purple-8));
+@purple-9: rgb(var(--purple-9));
+@purple-10: rgb(var(--purple-10));
+@pinkpurple-1: rgb(var(--pinkpurple-1));
+@pinkpurple-2: rgb(var(--pinkpurple-2));
+@pinkpurple-3: rgb(var(--pinkpurple-3));
+@pinkpurple-4: rgb(var(--pinkpurple-4));
+@pinkpurple-5: rgb(var(--pinkpurple-5));
+@pinkpurple-6: rgb(var(--pinkpurple-6));
+@pinkpurple-7: rgb(var(--pinkpurple-7));
+@pinkpurple-8: rgb(var(--pinkpurple-8));
+@pinkpurple-9: rgb(var(--pinkpurple-9));
+@pinkpurple-10: rgb(var(--pinkpurple-10));
+@magenta-1: rgb(var(--magenta-1));
+@magenta-2: rgb(var(--magenta-2));
+@magenta-3: rgb(var(--magenta-3));
+@magenta-4: rgb(var(--magenta-4));
+@magenta-5: rgb(var(--magenta-5));
+@magenta-6: rgb(var(--magenta-6));
+@magenta-7: rgb(var(--magenta-7));
+@magenta-8: rgb(var(--magenta-8));
+@magenta-9: rgb(var(--magenta-9));
+@magenta-10: rgb(var(--magenta-10));
+@gray-1: rgb(var(--gray-1));
+@gray-2: rgb(var(--gray-2));
+@gray-3: rgb(var(--gray-3));
+@gray-4: rgb(var(--gray-4));
+@gray-5: rgb(var(--gray-5));
+@gray-6: rgb(var(--gray-6));
+@gray-7: rgb(var(--gray-7));
+@gray-8: rgb(var(--gray-8));
+@gray-9: rgb(var(--gray-9));
+@gray-10: rgb(var(--gray-10));
+@color-bg-1: var(--color-white);
+@color-bg-2: var(--color-white);
+@color-bg-3: var(--color-white);
+@color-bg-4: var(--color-white);
+@color-bg-5: var(--color-white);
+@color-text-1: var(--color-neutral-10);
+@color-text-2: var(--color-neutral-8);
+@color-text-3: var(--color-neutral-6);
+@color-text-4: var(--color-neutral-4);
+@color-text-5: var(--color-neutral-2);
+@color-fill-1: var(--color-neutral-1);
+@color-fill-2: var(--color-neutral-2);
+@color-fill-3: var(--color-neutral-3);
+@color-fill-4: var(--color-neutral-4);
+@color-fill-5: var(--color-neutral-5);
+@color-border-1: var(--color-neutral-2);
+@color-border-2: var(--color-neutral-3);
+@color-border-3: var(--color-neutral-4);
+@color-border-4: var(--color-neutral-5);
+@color-border-5: var(--color-neutral-6);
 @data-1: rgb(var(--pqbblue-5));
 @data-2: rgb(var(--pqbblue-2));
 @data-3: rgb(var(--blue-5));
@@ -398,35 +178,192 @@
 @data-18: rgb(var(--cyan-3));
 @data-19: rgb(var(--pinkpurple-4));
 @data-20: rgb(var(--pinkpurple-2));
-@dark-data-1: rgb(var(--pqbblue-5));
-@dark-data-2: rgb(var(--pqbblue-3));
-@dark-data-3: rgb(var(--blue-5));
-@dark-data-4: rgb(var(--blue-3));
-@dark-data-5: rgb(var(--orange-6));
-@dark-data-6: rgb(var(--orange-3));
-@dark-data-7: rgb(var(--green-4));
-@dark-data-8: rgb(var(--green-3));
-@dark-data-9: rgb(var(--purple-4));
-@dark-data-10: rgb(var(--purple-3));
-@dark-data-11: rgb(var(--gold-6));
-@dark-data-12: rgb(var(--gold-4));
-@dark-data-13: rgb(var(--lime-6));
-@dark-data-14: rgb(var(--lime-4));
-@dark-data-15: rgb(var(--magenta-4));
-@dark-data-16: rgb(var(--magenta-3));
-@dark-data-17: rgb(var(--cyan-6));
-@dark-data-18: rgb(var(--cyan-3));
-@dark-data-19: rgb(var(--pinkpurple-4));
-@dark-data-20: rgb(var(--pinkpurple-2));
-@border-none: 0;
-@border-1: 1px;
-@border-2: 2px;
-@border-3: 3px;
-@border-4: 4px;
-@border-5: 5px;
-@border-solid: solid;
-@border-dashed: dashed;
-@border-dotted: dotted;
+@color-data-1: rgb(var(--pqbblue-5));
+@color-data-2: rgb(var(--pqbblue-2));
+@color-data-3: rgb(var(--blue-5));
+@color-data-4: rgb(var(--blue-3));
+@color-data-5: rgb(var(--orange-6));
+@color-data-6: rgb(var(--orange-3));
+@color-data-7: rgb(var(--green-4));
+@color-data-8: rgb(var(--green-2));
+@color-data-9: rgb(var(--purple-4));
+@color-data-10: rgb(var(--purple-2));
+@color-data-11: rgb(var(--gold-6));
+@color-data-12: rgb(var(--gold-4));
+@color-data-13: rgb(var(--lime-6));
+@color-data-14: rgb(var(--lime-4));
+@color-data-15: rgb(var(--magenta-4));
+@color-data-16: rgb(var(--magenta-3));
+@color-data-17: rgb(var(--cyan-6));
+@color-data-18: rgb(var(--cyan-3));
+@color-data-19: rgb(var(--pinkpurple-4));
+@color-data-20: rgb(var(--pinkpurple-2));
+@color-primary-1: rgb(var(--pqbblue-1));
+@color-primary-2: rgb(var(--pqbblue-2));
+@color-primary-3: rgb(var(--pqbblue-3));
+@color-primary-4: rgb(var(--pqbblue-4));
+@color-primary-5: rgb(var(--pqbblue-5));
+@color-primary-6: rgb(var(--pqbblue-6));
+@color-primary-7: rgb(var(--pqbblue-7));
+@color-primary-8: rgb(var(--pqbblue-8));
+@color-primary-9: rgb(var(--pqbblue-9));
+@color-primary-10: rgb(var(--pqbblue-10));
+@color-link-1: rgb(var(--pqbblue-1));
+@color-link-2: rgb(var(--pqbblue-2));
+@color-link-3: rgb(var(--pqbblue-3));
+@color-link-4: rgb(var(--pqbblue-4));
+@color-link-5: rgb(var(--pqbblue-5));
+@color-link-6: rgb(var(--pqbblue-6));
+@color-link-7: rgb(var(--pqbblue-7));
+@color-link-8: rgb(var(--pqbblue-8));
+@color-link-9: rgb(var(--pqbblue-9));
+@color-link-10: rgb(var(--pqbblue-10));
+@color-success-1: rgb(var(--green-1));
+@color-success-2: rgb(var(--green-2));
+@color-success-3: rgb(var(--green-3));
+@color-success-4: rgb(var(--green-4));
+@color-success-5: rgb(var(--green-5));
+@color-success-6: rgb(var(--green-6));
+@color-success-7: rgb(var(--green-7));
+@color-success-8: rgb(var(--green-8));
+@color-success-9: rgb(var(--green-9));
+@color-success-10: rgb(var(--green-10));
+@color-warning-1: rgb(var(--orange-1));
+@color-warning-2: rgb(var(--orange-2));
+@color-warning-3: rgb(var(--orange-3));
+@color-warning-4: rgb(var(--orange-4));
+@color-warning-5: rgb(var(--orange-5));
+@color-warning-6: rgb(var(--orange-6));
+@color-warning-7: rgb(var(--orange-7));
+@color-warning-8: rgb(var(--orange-8));
+@color-warning-9: rgb(var(--orange-9));
+@color-warning-10: rgb(var(--orange-10));
+@color-danger-1: rgb(var(--red-1));
+@color-danger-2: rgb(var(--red-2));
+@color-danger-3: rgb(var(--red-3));
+@color-danger-4: rgb(var(--red-4));
+@color-danger-5: rgb(var(--red-5));
+@color-danger-6: rgb(var(--red-6));
+@color-danger-7: rgb(var(--red-7));
+@color-danger-8: rgb(var(--red-8));
+@color-danger-9: rgb(var(--red-9));
+@color-danger-10: rgb(var(--red-10));
+@color-primary-light-1: rgb(var(--primary-1));
+@color-primary-light-2: rgb(var(--primary-2));
+@color-primary-light-3: rgb(var(--primary-3));
+@color-primary-light-4: rgb(var(--primary-4));
+@color-primary-light-5: rgb(var(--primary-5));
+@color-link-light-1: rgb(var(--link-1));
+@color-link-light-2: rgb(var(--link-2));
+@color-link-light-3: rgb(var(--link-3));
+@color-link-light-4: rgb(var(--link-4));
+@color-link-light-5: rgb(var(--link-5));
+@color-success-light-1: rgb(var(--success-1));
+@color-success-light-2: rgb(var(--success-2));
+@color-success-light-3: rgb(var(--success-3));
+@color-success-light-4: rgb(var(--success-4));
+@color-success-light-5: rgb(var(--success-5));
+@color-warning-light-1: rgb(var(--warning-1));
+@color-warning-light-2: rgb(var(--warning-2));
+@color-warning-light-3: rgb(var(--warning-3));
+@color-warning-light-4: rgb(var(--warning-4));
+@color-warning-light-5: rgb(var(--warning-5));
+@color-danger-light-1: rgb(var(--danger-1));
+@color-danger-light-2: rgb(var(--danger-2));
+@color-danger-light-3: rgb(var(--danger-3));
+@color-danger-light-4: rgb(var(--danger-4));
+@color-danger-light-5: rgb(var(--danger-5));
+@shadow-color-1: var(--shadow-color-1);
+@shadow-color-2: var(--shadow-color-2);
+@shadow-color-3: var(--shadow-color-3);
+@shadow-none: var(--shadow-none);
+@shadow-special: var(--shadow-special);
+@shadow1-center: var(--shadow1-center);
+@shadow1-up: var(--shadow1-up);
+@shadow1-down: var(--shadow1-down);
+@shadow1-left: var(--shadow1-left);
+@shadow1-right: var(--shadow1-right);
+@shadow1-left-up: var(--shadow1-left-up);
+@shadow1-left-down: var(--shadow1-left-down);
+@shadow1-right-up: var(--shadow1-right-up);
+@shadow1-right-down: var(--shadow1-right-down);
+@shadow2-center: var(--shadow2-center);
+@shadow2-up: var(--shadow2-up);
+@shadow2-down: var(--shadow2-down);
+@shadow2-left: var(--shadow2-left);
+@shadow2-right: var(--shadow2-right);
+@shadow2-left-up: var(--shadow2-left-up);
+@shadow2-left-down: var(--shadow2-left-down);
+@shadow2-right-up: var(--shadow2-right-up);
+@shadow2-right-down: var(--shadow2-right-down);
+@shadow3-center: var(--shadow3-center);
+@shadow3-up: var(--shadow3-up);
+@shadow3-down: var(--shadow3-down);
+@shadow3-left: var(--shadow3-left);
+@shadow3-right: var(--shadow3-right);
+@shadow3-left-up: var(--shadow3-left-up);
+@shadow3-left-down: var(--shadow3-left-down);
+@shadow3-right-up: var(--shadow3-right-up);
+@shadow3-right-down: var(--shadow3-right-down);
+@shadow-distance-none: var(--shadow-distance-none);
+@shadow-distance-1: var(--shadow-distance-1);
+@shadow-distance-2: var(--shadow-distance-2);
+@shadow-distance-3: var(--shadow-distance-3);
+@shadow-distance-4: var(--shadow-distance-4);
+@opacity-none: var(--opacity-none);
+@opacity-1: var(--opacity-1);
+@opacity-2: var(--opacity-2);
+@opacity-3: var(--opacity-3);
+@opacity-4: var(--opacity-4);
+@opacity-5: var(--opacity-5);
+@opacity-6: var(--opacity-6);
+@opacity-7: var(--opacity-7);
+@opacity-8: var(--opacity-8);
+@opacity-9: var(--opacity-9);
+@opacity-10: var(--opacity-10);
+@border-solid: var(--border-solid);
+@border-dashed: var(--border-dashed);
+@border-dotted: var(--border-dotted);
+@border-radius-none: var(--border-radius-none);
+@border-radius-small: var(--border-radius-small);
+@border-radius-medium: var(--border-radius-medium);
+@border-radius-large: var(--border-radius-large);
+@border-radius-circle: var(--border-radius-circle);
+@color-transparent: var(--color-transparent);
+@font-weight-100: var(--font-weight-100);
+@font-weight-200: var(--font-weight-200);
+@font-weight-300: var(--font-weight-300);
+@font-weight-400: var(--font-weight-400);
+@font-weight-500: var(--font-weight-500);
+@font-weight-600: var(--font-weight-600);
+@font-weight-700: var(--font-weight-700);
+@font-weight-800: var(--font-weight-800);
+@font-weight-900: var(--font-weight-900);
+@font-weight-1000: var(--font-weight-1000);
+@transition-duration-1: var(--transition-duration-1);
+@transition-duration-2: var(--transition-duration-2);
+@transition-duration-3: var(--transition-duration-3);
+@transition-duration-4: var(--transition-duration-4);
+@transition-duration-5: var(--transition-duration-5);
+@transition-duration-6: var(--transition-duration-6);
+@transition-duration-7: var(--transition-duration-7);
+@transition-duration-8: var(--transition-duration-8);
+@transition-duration-9: var(--transition-duration-9);
+@transition-duration-10: var(--transition-duration-10);
+@transition-duration-loading: var(--transition-duration-loading);
+@transition-timing-function-linear: var(--transition-timing-function-linear);
+@transition-timing-function-standard: var(
+  --transition-timing-function-standard
+);
+@transition-timing-function-overshoot: var(
+  --transition-timing-function-overshoot
+);
+@transition-timing-function-decelerate: var(
+  --transition-timing-function-decelerate
+);
+@transition-timing-function-accelerate: var(
+  --transition-timing-function-accelerate
+);
 @size-none: 0;
 @size-1: 4px;
 @size-2: 8px;
@@ -482,6 +419,31 @@
 @size-small: 28px;
 @size-default: 32px;
 @size-large: 36px;
+@font-size-body: 14px;
+@font-size-display-3: 56px;
+@font-size-display-2: 48px;
+@font-size-display-1: 36px;
+@font-size-title-3: 24px;
+@font-size-title-2: 20px;
+@font-size-title-1: 16px;
+@font-size-body-3: 14px;
+@font-size-body-2: 13px;
+@font-size-body-1: 12px;
+@font-size-caption: 12px;
+@border-none: 0;
+@border-1: 1px;
+@border-2: 2px;
+@border-3: 3px;
+@border-4: 4px;
+@border-5: 5px;
+@z-index-affix: 999;
+@z-index-popup-base: 1000;
+@z-index-popup: 1000;
+@z-index-drawer: 1001;
+@z-index-modal: 1001;
+@z-index-message: 1003;
+@z-index-notification: 1003;
+@z-index-image-preview: 1001;
 @spacing-none: 0;
 @spacing-1: 2px;
 @spacing-2: 4px;
@@ -505,266 +467,10 @@
 @spacing-20: 96px;
 @spacing-21: 100px;
 @spacing-22: 120px;
-@shadow-none: none;
-@shadow-special: 0 0 1px rgba(0, 0, 0, 0.3);
-@shadow1-center: 0 0 5px rgba(0, 0, 0, 0.1);
-@shadow1-up: 0 -2px 5px rgba(0, 0, 0, 0.1);
-@shadow1-down: 0 2px 5px rgba(0, 0, 0, 0.1);
-@shadow1-left: -2px 0 5px rgba(0, 0, 0, 0.1);
-@shadow1-right: 2px 0 5px rgba(0, 0, 0, 0.1);
-@shadow1-left-up: -2px -2px 5px rgba(0, 0, 0, 0.1);
-@shadow1-left-down: -2px 2px 5px rgba(0, 0, 0, 0.1);
-@shadow1-right-up: 2px -2px 5px rgba(0, 0, 0, 0.1);
-@shadow1-right-down: 2px 2px 5px rgba(0, 0, 0, 0.1);
-@shadow2-center: 0 0 10px rgba(0, 0, 0, 0.1);
-@shadow2-up: 0 -4px 10px rgba(0, 0, 0, 0.1);
-@shadow2-down: 0 4px 10px rgba(0, 0, 0, 0.1);
-@shadow2-left: -4px 0 10px rgba(0, 0, 0, 0.1);
-@shadow2-right: 4px 0 10px rgba(0, 0, 0, 0.1);
-@shadow2-left-up: -4px -4px 10px rgba(0, 0, 0, 0.1);
-@shadow2-left-down: -4px 4px 10px rgba(0, 0, 0, 0.1);
-@shadow2-right-up: 4px -4px 10px rgba(0, 0, 0, 0.1);
-@shadow2-right-down: 4px 4px 10px rgba(0, 0, 0, 0.1);
-@shadow3-center: 0 0 20px rgba(0, 0, 0, 0.1);
-@shadow3-up: 0 -8px 20px rgba(0, 0, 0, 0.1);
-@shadow3-down: 0 8px 20px rgba(0, 0, 0, 0.1);
-@shadow3-left: -8px 0 20px rgba(0, 0, 0, 0.1);
-@shadow3-right: 8px 0 20px rgba(0, 0, 0, 0.1);
-@shadow3-left-up: -8px -8px 20px rgba(0, 0, 0, 0.1);
-@shadow3-left-down: -8px 8px 20px rgba(0, 0, 0, 0.1);
-@shadow3-right-up: 8px -8px 20px rgba(0, 0, 0, 0.1);
-@shadow3-right-down: 8px 8px 20px rgba(0, 0, 0, 0.1);
-@font-size-body: 14px;
-@font-size-display-3: 56px;
-@font-size-display-2: 48px;
-@font-size-display-1: 36px;
-@font-size-title-3: 24px;
-@font-size-title-2: 20px;
-@font-size-title-1: 16px;
-@font-size-body-3: 14px;
-@font-size-body-2: 13px;
-@font-size-body-1: 12px;
-@font-size-caption: 12px;
-@border-radius-none: var(--border-radius-none);
-@border-radius-small: var(--border-radius-small);
-@border-radius-medium: var(--border-radius-medium);
-@border-radius-large: var(--border-radius-large);
-@border-radius-circle: var(--border-radius-circle);
-@shadow-distance-none: var(--shadow-distance-none);
-@shadow-distance-1: var(--shadow-distance-1);
-@shadow-distance-2: var(--shadow-distance-2);
-@shadow-distance-3: var(--shadow-distance-3);
-@shadow-distance-4: var(--shadow-distance-4);
-@color-transparent: var(--color-transparent);
-@opacity-none: var(--opacity-none);
-@opacity-1: var(--opacity-1);
-@opacity-2: var(--opacity-2);
-@opacity-3: var(--opacity-3);
-@opacity-4: var(--opacity-4);
-@opacity-5: var(--opacity-5);
-@opacity-6: var(--opacity-6);
-@opacity-7: var(--opacity-7);
-@opacity-8: var(--opacity-8);
-@opacity-9: var(--opacity-9);
-@opacity-10: var(--opacity-10);
-@font-weight-100: var(--font-weight-100);
-@font-weight-200: var(--font-weight-200);
-@font-weight-300: var(--font-weight-300);
-@font-weight-400: var(--font-weight-400);
-@font-weight-500: var(--font-weight-500);
-@font-weight-600: var(--font-weight-600);
-@font-weight-700: var(--font-weight-700);
-@font-weight-800: var(--font-weight-800);
-@font-weight-900: var(--font-weight-900);
-@font-weight-1000: var(--font-weight-1000);
-@color-primary-1: rgb(var(--primary-1));
-@color-primary-2: rgb(var(--primary-2));
-@color-primary-3: rgb(var(--primary-3));
-@color-primary-4: rgb(var(--primary-4));
-@color-primary-5: rgb(var(--primary-5));
-@color-primary-6: rgb(var(--primary-6));
-@color-primary-7: rgb(var(--primary-7));
-@color-primary-8: rgb(var(--primary-8));
-@color-primary-9: rgb(var(--primary-9));
-@color-primary-10: rgb(var(--primary-10));
-@color-success-1: rgb(var(--success-1));
-@color-success-2: rgb(var(--success-2));
-@color-success-3: rgb(var(--success-3));
-@color-success-4: rgb(var(--success-4));
-@color-success-5: rgb(var(--success-5));
-@color-success-6: rgb(var(--success-6));
-@color-success-7: rgb(var(--success-7));
-@color-success-8: rgb(var(--success-8));
-@color-success-9: rgb(var(--success-9));
-@color-success-10: rgb(var(--success-10));
-@color-warning-1: rgb(var(--warning-1));
-@color-warning-2: rgb(var(--warning-2));
-@color-warning-3: rgb(var(--warning-3));
-@color-warning-4: rgb(var(--warning-4));
-@color-warning-5: rgb(var(--warning-5));
-@color-warning-6: rgb(var(--warning-6));
-@color-warning-7: rgb(var(--warning-7));
-@color-warning-8: rgb(var(--warning-8));
-@color-warning-9: rgb(var(--warning-9));
-@color-warning-10: rgb(var(--warning-10));
-@color-danger-1: rgb(var(--danger-1));
-@color-danger-2: rgb(var(--danger-2));
-@color-danger-3: rgb(var(--danger-3));
-@color-danger-4: rgb(var(--danger-4));
-@color-danger-5: rgb(var(--danger-5));
-@color-danger-6: rgb(var(--danger-6));
-@color-danger-7: rgb(var(--danger-7));
-@color-danger-8: rgb(var(--danger-8));
-@color-danger-9: rgb(var(--danger-9));
-@color-danger-10: rgb(var(--danger-10));
-@color-link-1: rgb(var(--link-1));
-@color-link-2: rgb(var(--link-2));
-@color-link-3: rgb(var(--link-3));
-@color-link-4: rgb(var(--link-4));
-@color-link-5: rgb(var(--link-5));
-@color-link-6: rgb(var(--link-6));
-@color-link-7: rgb(var(--link-7));
-@color-link-8: rgb(var(--link-8));
-@color-link-9: rgb(var(--link-9));
-@color-link-10: rgb(var(--link-10));
-@radius-none: var(--border-radius-none);
-@radius-small: var(--border-radius-small);
-@radius-medium: var(--border-radius-medium);
-@radius-large: var(--border-radius-large);
-@radius-circle: var(--border-radius-circle);
-@color-white: var(--color-white);
-@dark-color-white: rgba(255, 255, 255, 0.9);
-@color-black: var(--color-black);
-@dark-color-black: var(--color-black);
-@mask-bg-opacity: 60%;
-@mask-color-bg: rgba(30, 31, 32, 0.6);
-@dark-mask-color-bg: rgba(18, 18, 19, 0.6);
-@color-menu-dark-bg: var(--color-bg-2);
-@color-menu-light-bg: var(--color-white);
-@color-spin-layer-bg: rgba(255, 255, 255, 0.6);
-@color-menu-dark-hover: rgba(255, 255, 255, 0.04);
-@color-tooltip-bg: rgb(var(--gray-10));
-@dark-color-tooltip-bg: var(--color-bg-5);
-@dark-color-spin-layer-bg: rgba(51, 51, 51, 0.6);
-@dark-color-menu-dark-hover: var(--color-fill-2);
-@color-border: rgb(var(--gray-3));
-@color-bg-popup: var(--color-bg-5);
-@color-bg-1: var(--color-white);
-@color-bg-2: var(--color-white);
-@color-bg-3: var(--color-white);
-@color-bg-4: var(--color-white);
-@color-bg-5: var(--color-white);
-@color-bg-white: var(--color-white);
-@color-text-1: var(--color-neutral-10);
-@color-text-2: var(--color-neutral-8);
-@color-text-3: var(--color-neutral-6);
-@color-text-4: var(--color-neutral-4);
-@color-text-5: var(--color-neutral-2);
-@color-fill-1: var(--color-neutral-1);
-@color-fill-2: var(--color-neutral-2);
-@color-fill-3: var(--color-neutral-3);
-@color-fill-4: var(--color-neutral-4);
-@color-fill-5: var(--color-neutral-5);
-@color-border-1: var(--color-neutral-2);
-@color-border-2: var(--color-neutral-3);
-@color-border-3: var(--color-neutral-4);
-@color-border-4: var(--color-neutral-5);
-@color-border-5: var(--color-neutral-6);
-@color-primary-light-1: rgb(var(--primary-1));
-@color-primary-light-2: rgb(var(--primary-2));
-@color-primary-light-3: rgb(var(--primary-3));
-@color-primary-light-4: rgb(var(--primary-4));
-@color-primary-light-5: rgb(var(--primary-5));
-@color-secondary: var(--color-neutral-2);
-@color-secondary-hover: var(--color-neutral-3);
-@color-secondary-active: var(--color-neutral-4);
-@color-secondary-disabled: var(--color-neutral-1);
-@color-danger-light-1: rgb(var(--danger-1));
-@color-danger-light-2: rgb(var(--danger-2));
-@color-danger-light-3: rgb(var(--danger-3));
-@color-danger-light-4: rgb(var(--danger-4));
-@color-danger-light-5: rgb(var(--danger-5));
-@color-success-light-1: rgb(var(--success-1));
-@color-success-light-2: rgb(var(--success-2));
-@color-success-light-3: rgb(var(--success-3));
-@color-success-light-4: rgb(var(--success-4));
-@color-success-light-5: rgb(var(--success-5));
-@color-warning-light-1: rgb(var(--warning-1));
-@color-warning-light-2: rgb(var(--warning-2));
-@color-warning-light-3: rgb(var(--warning-3));
-@color-warning-light-4: rgb(var(--warning-4));
-@color-warning-light-5: rgb(var(--warning-5));
-@color-link-light-1: rgb(var(--link-1));
-@color-link-light-2: rgb(var(--link-2));
-@color-link-light-3: rgb(var(--link-3));
-@color-link-light-4: rgb(var(--link-4));
-@color-link-light-5: rgb(var(--link-5));
-@color-data-1: rgb(var(--pqbblue-5));
-@color-data-2: rgb(var(--pqbblue-3));
-@color-data-3: rgb(var(--blue-5));
-@color-data-4: rgb(var(--blue-3));
-@color-data-5: rgb(var(--orange-6));
-@color-data-6: rgb(var(--orange-3));
-@color-data-7: rgb(var(--green-4));
-@color-data-8: rgb(var(--green-3));
-@color-data-9: rgb(var(--purple-4));
-@color-data-10: rgb(var(--purple-3));
-@color-data-11: rgb(var(--gold-6));
-@color-data-12: rgb(var(--gold-4));
-@color-data-13: rgb(var(--lime-6));
-@color-data-14: rgb(var(--lime-4));
-@color-data-15: rgb(var(--magenta-4));
-@color-data-16: rgb(var(--magenta-3));
-@color-data-17: rgb(var(--cyan-6));
-@color-data-18: rgb(var(--cyan-3));
-@color-data-19: rgb(var(--pinkpurple-4));
-@color-data-20: rgb(var(--pinkpurple-2));
-@dark-color-border: var(--color-border);
-@dark-color-bg-1: var(--color-bg-1);
-@dark-color-bg-2: var(--color-bg-2);
-@dark-color-bg-3: var(--color-bg-3);
-@dark-color-bg-4: var(--color-bg-4);
-@dark-color-bg-5: var(--color-bg-5);
-@dark-color-bg-white: var(--color-bg-white);
-@dark-color-text-1: rgba(255, 255, 255, 0.9);
-@dark-color-text-2: rgba(255, 255, 255, 0.7);
-@dark-color-text-3: rgba(255, 255, 255, 0.5);
-@dark-color-text-4: rgba(255, 255, 255, 0.3);
-@dark-color-text-5: rgba(255, 255, 255, 0.1);
-@dark-color-fill-1: rgba(255, 255, 255, 0.04);
-@dark-color-fill-2: rgba(255, 255, 255, 0.08);
-@dark-color-fill-3: rgba(255, 255, 255, 0.12);
-@dark-color-fill-4: rgba(255, 255, 255, 0.16);
-@dark-color-fill-5: rgba(255, 255, 255, 0.2);
-@dark-color-primary-light-1: rgba(var(--primary-6), 0.2);
-@dark-color-primary-light-2: rgba(var(--primary-6), 0.35);
-@dark-color-primary-light-3: rgba(var(--primary-6), 0.5);
-@dark-color-primary-light-4: rgba(var(--primary-6), 0.65);
-@dark-color-primary-light-5: rgba(var(--primary-6), 0.8);
-@dark-color-secondary: rgba(var(--gray-9), 0.08);
-@dark-color-secondary-hover: rgba(var(--gray-8), 0.16);
-@dark-color-secondary-active: rgba(var(--gray-7), 0.24);
-@dark-color-secondary-disabled: rgba(var(--gray-9), 0.08);
-@dark-color-danger-light-1: rgba(var(--danger-6), 0.2);
-@dark-color-danger-light-2: rgba(var(--danger-6), 0.35);
-@dark-color-danger-light-3: rgba(var(--danger-6), 0.5);
-@dark-color-danger-light-4: rgba(var(--danger-6), 0.65);
-@dark-color-danger-light-5: rgba(var(--danger-6), 0.8);
-@dark-color-success-light-1: rgba(var(--success-6), 0.2);
-@dark-color-success-light-2: rgba(var(--success-6), 0.35);
-@dark-color-success-light-3: rgba(var(--success-6), 0.5);
-@dark-color-success-light-4: rgba(var(--success-6), 0.65);
-@dark-color-success-light-5: rgba(var(--success-6), 0.8);
-@dark-color-warning-light-1: rgba(var(--warning-6), 0.2);
-@dark-color-warning-light-2: rgba(var(--warning-6), 0.35);
-@dark-color-warning-light-3: rgba(var(--warning-6), 0.5);
-@dark-color-warning-light-4: rgba(var(--warning-6), 0.65);
-@dark-color-warning-light-5: rgba(var(--warning-6), 0.8);
-@dark-color-link-light-1: rgba(var(--link-6), 0.2);
-@dark-color-link-light-2: rgba(var(--link-6), 0.35);
-@dark-color-link-light-3: rgba(var(--link-6), 0.5);
-@dark-color-link-light-4: rgba(var(--link-6), 0.65);
-@dark-color-link-light-5: rgba(var(--link-6), 0.8);
+@line-height-base: 1.5;
+@prefix: pqb;
+@font-family: var(--font-family);
+@code-family: var(--code-family);
 @icon-hover-border-radius: var(--border-radius-circle);
 @icon-hover-color-bg: var(--color-fill-2);
 @icon-hover-size-default-height: 20px;
@@ -777,44 +483,3 @@
 @icon-hover-size-default-icon: 12px;
 @icon-hover-size-large-icon: 12px;
 @icon-hover-size-huge-icon: 12px;
-@prefix: pqb;
-@pqb-theme-tag: body;
-@font-family:
-  Inter,
-  -apple-system,
-  BlinkMacSystemFont,
-  PingFang SC,
-  Hiragino Sans GB,
-  noto sans,
-  Microsoft YaHei,
-  Helvetica Neue,
-  Helvetica,
-  Arial,
-  sans-serif;
-@code-family: Consolas, Menlo;
-@transition-duration-1: 0.1s;
-@transition-duration-2: 0.2s;
-@transition-duration-3: 0.3s;
-@transition-duration-4: 0.4s;
-@transition-duration-5: 0.5s;
-@transition-duration-6: 0.6s;
-@transition-duration-7: 0.7s;
-@transition-duration-8: 0.8s;
-@transition-duration-9: 0.9s;
-@transition-duration-10: 1s;
-@transition-duration-loading: 1s;
-@transition-timing-function-linear: cubic-bezier(0, 0, 1, 1);
-@transition-timing-function-standard: cubic-bezier(0.34, 0.69, 0.1, 1);
-@transition-timing-function-overshoot: cubic-bezier(0.3, 1.3, 0.3, 1);
-@transition-timing-function-decelerate: cubic-bezier(0.4, 0.8, 0.74, 1);
-@transition-timing-function-accelerate: cubic-bezier(0.26, 0, 0.6, 0.2);
-@z-index-affix: 999;
-@z-index-popup-base: 1000;
-@z-index-popup: 1000;
-@z-index-drawer: 1001;
-@z-index-modal: 1001;
-@z-index-message: 1003;
-@z-index-notification: 1003;
-@z-index-image-preview: 1001;
-@line-height-base: 1.5;
-@popup-box-shadow-base: 0 2px 5px rgba(0, 0, 0, 0.1);