body {
    --semi-transition_duration-slowest: 0s;
    --semi-transition_duration-slower: 0s;
    --semi-transition_duration-slow: 0s;
    --semi-transition_duration-normal: 0s;
    --semi-transition_duration-fast: 0s;
    --semi-transition_duration-faster: 0s;
    --semi-transition_duration-fastest: 0s;
    --semi-transition_duration-none: 0s;
    --semi-transition_function-linear: linear;
    --semi-transition_function-ease: ease;
    --semi-transition_function-easeIn: ease-in;
    --semi-transition_function-easeOut: ease-out;
    --semi-transition_function-easeInIOut: ease-in-out;
    --semi-transition_delay-none: 0s;
    --semi-transition_delay-slowest: 0s;
    --semi-transition_delay-slower: 0s;
    --semi-transition_delay-slow: 0s;
    --semi-transition_delay-normal: 0s;
    --semi-transition_delay-fast: 0s;
    --semi-transition_delay-faster: 0s;
    --semi-transition_delay-fastest: 0s;
    --semi-transform_scale-none: scale(1, 1);
    --semi-transform_scale-small: scale(1, 1);
    --semi-transform_scale-medium: scale(1, 1);
    --semi-transform_scale-large: scale(1, 1);
    --semi-transform-rotate-none: rotate(0deg);
    --semi-transform_rotate-clockwise90deg: rotate(90deg);
    --semi-transform_rotate-clockwise180deg: rotate(180deg);
    --semi-transform_rotate-clockwise270deg: rotate(270deg);
    --semi-transform_rotate-clockwise360deg: rotate(360deg);
    --semi-transform_rotate-anticlockwise90deg: rotate(-90deg);
    --semi-transform_rotate-anticlockwise180deg: rotate(-180deg);
    --semi-transform_rotate-anticlockwise270deg: rotate(-270deg);
    --semi-transform_rotate-anticlockwise360deg: rotate(-360deg)
}

:host {
    --semi-transition_duration-slowest: 0s;
    --semi-transition_duration-slower: 0s;
    --semi-transition_duration-slow: 0s;
    --semi-transition_duration-normal: 0s;
    --semi-transition_duration-fast: 0s;
    --semi-transition_duration-faster: 0s;
    --semi-transition_duration-fastest: 0s;
    --semi-transition_duration-none: 0s;
    --semi-transition_function-linear: linear;
    --semi-transition_function-ease: ease;
    --semi-transition_function-easeIn: ease-in;
    --semi-transition_function-easeOut: ease-out;
    --semi-transition_function-easeInIOut: ease-in-out;
    --semi-transition_delay-none: 0s;
    --semi-transition_delay-slowest: 0s;
    --semi-transition_delay-slower: 0s;
    --semi-transition_delay-slow: 0s;
    --semi-transition_delay-normal: 0s;
    --semi-transition_delay-fast: 0s;
    --semi-transition_delay-faster: 0s;
    --semi-transition_delay-fastest: 0s;
    --semi-transform_scale-none: scale(1, 1);
    --semi-transform_scale-small: scale(1, 1);
    --semi-transform_scale-medium: scale(1, 1);
    --semi-transform_scale-large: scale(1, 1);
    --semi-transform-rotate-none: rotate(0deg);
    --semi-transform_rotate-clockwise90deg: rotate(90deg);
    --semi-transform_rotate-clockwise180deg: rotate(180deg);
    --semi-transform_rotate-clockwise270deg: rotate(270deg);
    --semi-transform_rotate-clockwise360deg: rotate(360deg);
    --semi-transform_rotate-anticlockwise90deg: rotate(-90deg);
    --semi-transform_rotate-anticlockwise180deg: rotate(-180deg);
    --semi-transform_rotate-anticlockwise270deg: rotate(-270deg);
    --semi-transform_rotate-anticlockwise360deg: rotate(-360deg)
}

body,
body .semi-always-light {
    --semi-amber-0: 254, 251, 235;
    --semi-amber-1: 252, 245, 206;
    --semi-amber-2: 249, 232, 158;
    --semi-amber-3: 246, 216, 111;
    --semi-amber-4: 243, 198, 65;
    --semi-amber-5: 240, 177, 20;
    --semi-amber-6: 200, 138, 15;
    --semi-amber-7: 160, 102, 10;
    --semi-amber-8: 120, 70, 6;
    --semi-amber-9: 80, 43, 3;
    --semi-black: 0, 0, 0;
    --semi-blue-0: 234, 245, 255;
    --semi-blue-1: 203, 231, 254;
    --semi-blue-2: 152, 205, 253;
    --semi-blue-3: 101, 178, 252;
    --semi-blue-4: 50, 149, 251;
    --semi-blue-5: 0, 100, 250;
    --semi-blue-6: 0, 98, 214;
    --semi-blue-7: 0, 79, 179;
    --semi-blue-8: 0, 61, 143;
    --semi-blue-9: 0, 44, 107;
    --semi-cyan-0: 229, 247, 248;
    --semi-cyan-1: 194, 239, 240;
    --semi-cyan-2: 138, 221, 226;
    --semi-cyan-3: 88, 203, 211;
    --semi-cyan-4: 44, 184, 197;
    --semi-cyan-5: 5, 164, 182;
    --semi-cyan-6: 3, 134, 152;
    --semi-cyan-7: 1, 105, 121;
    --semi-cyan-8: 0, 77, 91;
    --semi-cyan-9: 0, 50, 61;
    --semi-green-0: 236, 247, 236;
    --semi-green-1: 208, 240, 209;
    --semi-green-2: 164, 224, 167;
    --semi-green-3: 125, 209, 130;
    --semi-green-4: 90, 194, 98;
    --semi-green-5: 59, 179, 70;
    --semi-green-6: 48, 149, 59;
    --semi-green-7: 37, 119, 47;
    --semi-green-8: 27, 89, 36;
    --semi-green-9: 17, 60, 24;
    --semi-grey-0: 249, 249, 249;
    --semi-grey-1: 230, 232, 234;
    --semi-grey-2: 198, 202, 205;
    --semi-grey-3: 167, 171, 176;
    --semi-grey-4: 136, 141, 146;
    --semi-grey-5: 107, 112, 117;
    --semi-grey-6: 85, 91, 97;
    --semi-grey-7: 65, 70, 76;
    --semi-grey-8: 46, 50, 56;
    --semi-grey-9: 28, 31, 35;
    --semi-indigo-0: 236, 239, 248;
    --semi-indigo-1: 209, 216, 240;
    --semi-indigo-2: 167, 179, 225;
    --semi-indigo-3: 128, 144, 211;
    --semi-indigo-4: 94, 111, 196;
    --semi-indigo-5: 63, 81, 181;
    --semi-indigo-6: 51, 66, 161;
    --semi-indigo-7: 40, 52, 140;
    --semi-indigo-8: 31, 40, 120;
    --semi-indigo-9: 23, 29, 99;
    --semi-light-blue-0: 233, 247, 253;
    --semi-light-blue-1: 201, 236, 252;
    --semi-light-blue-2: 149, 216, 248;
    --semi-light-blue-3: 98, 195, 245;
    --semi-light-blue-4: 48, 172, 241;
    --semi-light-blue-5: 0, 149, 238;
    --semi-light-blue-6: 0, 123, 202;
    --semi-light-blue-7: 0, 99, 167;
    --semi-light-blue-8: 0, 75, 131;
    --semi-light-blue-9: 0, 53, 95;
    --semi-light-green-0: 243, 248, 236;
    --semi-light-green-1: 227, 240, 208;
    --semi-light-green-2: 200, 226, 165;
    --semi-light-green-3: 173, 211, 126;
    --semi-light-green-4: 147, 197, 91;
    --semi-light-green-5: 123, 182, 60;
    --semi-light-green-6: 100, 152, 48;
    --semi-light-green-7: 78, 121, 38;
    --semi-light-green-8: 57, 91, 27;
    --semi-light-green-9: 37, 61, 18;
    --semi-lime-0: 242, 250, 230;
    --semi-lime-1: 227, 246, 197;
    --semi-lime-2: 203, 237, 142;
    --semi-lime-3: 183, 227, 91;
    --semi-lime-4: 167, 218, 44;
    --semi-lime-5: 155, 209, 0;
    --semi-lime-6: 126, 174, 0;
    --semi-lime-7: 99, 139, 0;
    --semi-lime-8: 72, 104, 0;
    --semi-lime-9: 47, 70, 0;
    --semi-orange-0: 255, 248, 234;
    --semi-orange-1: 254, 238, 204;
    --semi-orange-2: 254, 217, 152;
    --semi-orange-3: 253, 193, 101;
    --semi-orange-4: 253, 166, 51;
    --semi-orange-5: 252, 136, 0;
    --semi-orange-6: 210, 103, 0;
    --semi-orange-7: 168, 74, 0;
    --semi-orange-8: 126, 49, 0;
    --semi-orange-9: 84, 29, 0;
    --semi-pink-0: 253, 236, 239;
    --semi-pink-1: 251, 207, 216;
    --semi-pink-2: 246, 160, 181;
    --semi-pink-3: 242, 115, 150;
    --semi-pink-4: 237, 72, 123;
    --semi-pink-5: 233, 30, 99;
    --semi-pink-6: 197, 19, 86;
    --semi-pink-7: 162, 11, 72;
    --semi-pink-8: 126, 5, 58;
    --semi-pink-9: 90, 1, 43;
    --semi-purple-0: 247, 233, 247;
    --semi-purple-1: 239, 202, 240;
    --semi-purple-2: 221, 155, 224;
    --semi-purple-3: 201, 111, 209;
    --semi-purple-4: 180, 73, 194;
    --semi-purple-5: 158, 40, 179;
    --semi-purple-6: 135, 30, 158;
    --semi-purple-7: 113, 22, 138;
    --semi-purple-8: 92, 15, 117;
    --semi-purple-9: 73, 10, 97;
    --semi-red-0: 254, 242, 237;
    --semi-red-1: 254, 221, 210;
    --semi-red-2: 253, 183, 165;
    --semi-red-3: 251, 144, 120;
    --semi-red-4: 250, 102, 76;
    --semi-red-5: 249, 57, 32;
    --semi-red-6: 213, 37, 21;
    --semi-red-7: 178, 20, 12;
    --semi-red-8: 142, 8, 5;
    --semi-red-9: 106, 1, 3;
    --semi-teal-0: 228, 247, 244;
    --semi-teal-1: 192, 240, 232;
    --semi-teal-2: 135, 224, 211;
    --semi-teal-3: 84, 209, 193;
    --semi-teal-4: 39, 194, 176;
    --semi-teal-5: 0, 179, 161;
    --semi-teal-6: 0, 149, 137;
    --semi-teal-7: 0, 119, 111;
    --semi-teal-8: 0, 89, 85;
    --semi-teal-9: 0, 60, 58;
    --semi-violet-0: 243, 237, 249;
    --semi-violet-1: 226, 209, 244;
    --semi-violet-2: 196, 167, 233;
    --semi-violet-3: 166, 127, 221;
    --semi-violet-4: 136, 91, 210;
    --semi-violet-5: 106, 58, 199;
    --semi-violet-6: 87, 47, 179;
    --semi-violet-7: 70, 37, 158;
    --semi-violet-8: 54, 28, 138;
    --semi-violet-9: 40, 20, 117;
    --semi-white: 255, 255, 255;
    --semi-yellow-0: 255, 253, 234;
    --semi-yellow-1: 254, 251, 203;
    --semi-yellow-2: 253, 243, 152;
    --semi-yellow-3: 252, 232, 101;
    --semi-yellow-4: 251, 218, 50;
    --semi-yellow-5: 250, 200, 0;
    --semi-yellow-6: 208, 170, 0;
    --semi-yellow-7: 167, 139, 0;
    --semi-yellow-8: 125, 106, 0;
    --semi-yellow-9: 83, 72, 0
}

:host {
    --semi-amber-0: 254, 251, 235;
    --semi-amber-1: 252, 245, 206;
    --semi-amber-2: 249, 232, 158;
    --semi-amber-3: 246, 216, 111;
    --semi-amber-4: 243, 198, 65;
    --semi-amber-5: 240, 177, 20;
    --semi-amber-6: 200, 138, 15;
    --semi-amber-7: 160, 102, 10;
    --semi-amber-8: 120, 70, 6;
    --semi-amber-9: 80, 43, 3;
    --semi-black: 0, 0, 0;
    --semi-blue-0: 234, 245, 255;
    --semi-blue-1: 203, 231, 254;
    --semi-blue-2: 152, 205, 253;
    --semi-blue-3: 101, 178, 252;
    --semi-blue-4: 50, 149, 251;
    --semi-blue-5: 0, 100, 250;
    --semi-blue-6: 0, 98, 214;
    --semi-blue-7: 0, 79, 179;
    --semi-blue-8: 0, 61, 143;
    --semi-blue-9: 0, 44, 107;
    --semi-cyan-0: 229, 247, 248;
    --semi-cyan-1: 194, 239, 240;
    --semi-cyan-2: 138, 221, 226;
    --semi-cyan-3: 88, 203, 211;
    --semi-cyan-4: 44, 184, 197;
    --semi-cyan-5: 5, 164, 182;
    --semi-cyan-6: 3, 134, 152;
    --semi-cyan-7: 1, 105, 121;
    --semi-cyan-8: 0, 77, 91;
    --semi-cyan-9: 0, 50, 61;
    --semi-green-0: 236, 247, 236;
    --semi-green-1: 208, 240, 209;
    --semi-green-2: 164, 224, 167;
    --semi-green-3: 125, 209, 130;
    --semi-green-4: 90, 194, 98;
    --semi-green-5: 59, 179, 70;
    --semi-green-6: 48, 149, 59;
    --semi-green-7: 37, 119, 47;
    --semi-green-8: 27, 89, 36;
    --semi-green-9: 17, 60, 24;
    --semi-grey-0: 249, 249, 249;
    --semi-grey-1: 230, 232, 234;
    --semi-grey-2: 198, 202, 205;
    --semi-grey-3: 167, 171, 176;
    --semi-grey-4: 136, 141, 146;
    --semi-grey-5: 107, 112, 117;
    --semi-grey-6: 85, 91, 97;
    --semi-grey-7: 65, 70, 76;
    --semi-grey-8: 46, 50, 56;
    --semi-grey-9: 28, 31, 35;
    --semi-indigo-0: 236, 239, 248;
    --semi-indigo-1: 209, 216, 240;
    --semi-indigo-2: 167, 179, 225;
    --semi-indigo-3: 128, 144, 211;
    --semi-indigo-4: 94, 111, 196;
    --semi-indigo-5: 63, 81, 181;
    --semi-indigo-6: 51, 66, 161;
    --semi-indigo-7: 40, 52, 140;
    --semi-indigo-8: 31, 40, 120;
    --semi-indigo-9: 23, 29, 99;
    --semi-light-blue-0: 233, 247, 253;
    --semi-light-blue-1: 201, 236, 252;
    --semi-light-blue-2: 149, 216, 248;
    --semi-light-blue-3: 98, 195, 245;
    --semi-light-blue-4: 48, 172, 241;
    --semi-light-blue-5: 0, 149, 238;
    --semi-light-blue-6: 0, 123, 202;
    --semi-light-blue-7: 0, 99, 167;
    --semi-light-blue-8: 0, 75, 131;
    --semi-light-blue-9: 0, 53, 95;
    --semi-light-green-0: 243, 248, 236;
    --semi-light-green-1: 227, 240, 208;
    --semi-light-green-2: 200, 226, 165;
    --semi-light-green-3: 173, 211, 126;
    --semi-light-green-4: 147, 197, 91;
    --semi-light-green-5: 123, 182, 60;
    --semi-light-green-6: 100, 152, 48;
    --semi-light-green-7: 78, 121, 38;
    --semi-light-green-8: 57, 91, 27;
    --semi-light-green-9: 37, 61, 18;
    --semi-lime-0: 242, 250, 230;
    --semi-lime-1: 227, 246, 197;
    --semi-lime-2: 203, 237, 142;
    --semi-lime-3: 183, 227, 91;
    --semi-lime-4: 167, 218, 44;
    --semi-lime-5: 155, 209, 0;
    --semi-lime-6: 126, 174, 0;
    --semi-lime-7: 99, 139, 0;
    --semi-lime-8: 72, 104, 0;
    --semi-lime-9: 47, 70, 0;
    --semi-orange-0: 255, 248, 234;
    --semi-orange-1: 254, 238, 204;
    --semi-orange-2: 254, 217, 152;
    --semi-orange-3: 253, 193, 101;
    --semi-orange-4: 253, 166, 51;
    --semi-orange-5: 252, 136, 0;
    --semi-orange-6: 210, 103, 0;
    --semi-orange-7: 168, 74, 0;
    --semi-orange-8: 126, 49, 0;
    --semi-orange-9: 84, 29, 0;
    --semi-pink-0: 253, 236, 239;
    --semi-pink-1: 251, 207, 216;
    --semi-pink-2: 246, 160, 181;
    --semi-pink-3: 242, 115, 150;
    --semi-pink-4: 237, 72, 123;
    --semi-pink-5: 233, 30, 99;
    --semi-pink-6: 197, 19, 86;
    --semi-pink-7: 162, 11, 72;
    --semi-pink-8: 126, 5, 58;
    --semi-pink-9: 90, 1, 43;
    --semi-purple-0: 247, 233, 247;
    --semi-purple-1: 239, 202, 240;
    --semi-purple-2: 221, 155, 224;
    --semi-purple-3: 201, 111, 209;
    --semi-purple-4: 180, 73, 194;
    --semi-purple-5: 158, 40, 179;
    --semi-purple-6: 135, 30, 158;
    --semi-purple-7: 113, 22, 138;
    --semi-purple-8: 92, 15, 117;
    --semi-purple-9: 73, 10, 97;
    --semi-red-0: 254, 242, 237;
    --semi-red-1: 254, 221, 210;
    --semi-red-2: 253, 183, 165;
    --semi-red-3: 251, 144, 120;
    --semi-red-4: 250, 102, 76;
    --semi-red-5: 249, 57, 32;
    --semi-red-6: 213, 37, 21;
    --semi-red-7: 178, 20, 12;
    --semi-red-8: 142, 8, 5;
    --semi-red-9: 106, 1, 3;
    --semi-teal-0: 228, 247, 244;
    --semi-teal-1: 192, 240, 232;
    --semi-teal-2: 135, 224, 211;
    --semi-teal-3: 84, 209, 193;
    --semi-teal-4: 39, 194, 176;
    --semi-teal-5: 0, 179, 161;
    --semi-teal-6: 0, 149, 137;
    --semi-teal-7: 0, 119, 111;
    --semi-teal-8: 0, 89, 85;
    --semi-teal-9: 0, 60, 58;
    --semi-violet-0: 243, 237, 249;
    --semi-violet-1: 226, 209, 244;
    --semi-violet-2: 196, 167, 233;
    --semi-violet-3: 166, 127, 221;
    --semi-violet-4: 136, 91, 210;
    --semi-violet-5: 106, 58, 199;
    --semi-violet-6: 87, 47, 179;
    --semi-violet-7: 70, 37, 158;
    --semi-violet-8: 54, 28, 138;
    --semi-violet-9: 40, 20, 117;
    --semi-white: 255, 255, 255;
    --semi-yellow-0: 255, 253, 234;
    --semi-yellow-1: 254, 251, 203;
    --semi-yellow-2: 253, 243, 152;
    --semi-yellow-3: 252, 232, 101;
    --semi-yellow-4: 251, 218, 50;
    --semi-yellow-5: 250, 200, 0;
    --semi-yellow-6: 208, 170, 0;
    --semi-yellow-7: 167, 139, 0;
    --semi-yellow-8: 125, 106, 0;
    --semi-yellow-9: 83, 72, 0
}

:host .semi-always-light {
    --semi-amber-0: 254, 251, 235;
    --semi-amber-1: 252, 245, 206;
    --semi-amber-2: 249, 232, 158;
    --semi-amber-3: 246, 216, 111;
    --semi-amber-4: 243, 198, 65;
    --semi-amber-5: 240, 177, 20;
    --semi-amber-6: 200, 138, 15;
    --semi-amber-7: 160, 102, 10;
    --semi-amber-8: 120, 70, 6;
    --semi-amber-9: 80, 43, 3;
    --semi-black: 0, 0, 0;
    --semi-blue-0: 234, 245, 255;
    --semi-blue-1: 203, 231, 254;
    --semi-blue-2: 152, 205, 253;
    --semi-blue-3: 101, 178, 252;
    --semi-blue-4: 50, 149, 251;
    --semi-blue-5: 0, 100, 250;
    --semi-blue-6: 0, 98, 214;
    --semi-blue-7: 0, 79, 179;
    --semi-blue-8: 0, 61, 143;
    --semi-blue-9: 0, 44, 107;
    --semi-cyan-0: 229, 247, 248;
    --semi-cyan-1: 194, 239, 240;
    --semi-cyan-2: 138, 221, 226;
    --semi-cyan-3: 88, 203, 211;
    --semi-cyan-4: 44, 184, 197;
    --semi-cyan-5: 5, 164, 182;
    --semi-cyan-6: 3, 134, 152;
    --semi-cyan-7: 1, 105, 121;
    --semi-cyan-8: 0, 77, 91;
    --semi-cyan-9: 0, 50, 61;
    --semi-green-0: 236, 247, 236;
    --semi-green-1: 208, 240, 209;
    --semi-green-2: 164, 224, 167;
    --semi-green-3: 125, 209, 130;
    --semi-green-4: 90, 194, 98;
    --semi-green-5: 59, 179, 70;
    --semi-green-6: 48, 149, 59;
    --semi-green-7: 37, 119, 47;
    --semi-green-8: 27, 89, 36;
    --semi-green-9: 17, 60, 24;
    --semi-grey-0: 249, 249, 249;
    --semi-grey-1: 230, 232, 234;
    --semi-grey-2: 198, 202, 205;
    --semi-grey-3: 167, 171, 176;
    --semi-grey-4: 136, 141, 146;
    --semi-grey-5: 107, 112, 117;
    --semi-grey-6: 85, 91, 97;
    --semi-grey-7: 65, 70, 76;
    --semi-grey-8: 46, 50, 56;
    --semi-grey-9: 28, 31, 35;
    --semi-indigo-0: 236, 239, 248;
    --semi-indigo-1: 209, 216, 240;
    --semi-indigo-2: 167, 179, 225;
    --semi-indigo-3: 128, 144, 211;
    --semi-indigo-4: 94, 111, 196;
    --semi-indigo-5: 63, 81, 181;
    --semi-indigo-6: 51, 66, 161;
    --semi-indigo-7: 40, 52, 140;
    --semi-indigo-8: 31, 40, 120;
    --semi-indigo-9: 23, 29, 99;
    --semi-light-blue-0: 233, 247, 253;
    --semi-light-blue-1: 201, 236, 252;
    --semi-light-blue-2: 149, 216, 248;
    --semi-light-blue-3: 98, 195, 245;
    --semi-light-blue-4: 48, 172, 241;
    --semi-light-blue-5: 0, 149, 238;
    --semi-light-blue-6: 0, 123, 202;
    --semi-light-blue-7: 0, 99, 167;
    --semi-light-blue-8: 0, 75, 131;
    --semi-light-blue-9: 0, 53, 95;
    --semi-light-green-0: 243, 248, 236;
    --semi-light-green-1: 227, 240, 208;
    --semi-light-green-2: 200, 226, 165;
    --semi-light-green-3: 173, 211, 126;
    --semi-light-green-4: 147, 197, 91;
    --semi-light-green-5: 123, 182, 60;
    --semi-light-green-6: 100, 152, 48;
    --semi-light-green-7: 78, 121, 38;
    --semi-light-green-8: 57, 91, 27;
    --semi-light-green-9: 37, 61, 18;
    --semi-lime-0: 242, 250, 230;
    --semi-lime-1: 227, 246, 197;
    --semi-lime-2: 203, 237, 142;
    --semi-lime-3: 183, 227, 91;
    --semi-lime-4: 167, 218, 44;
    --semi-lime-5: 155, 209, 0;
    --semi-lime-6: 126, 174, 0;
    --semi-lime-7: 99, 139, 0;
    --semi-lime-8: 72, 104, 0;
    --semi-lime-9: 47, 70, 0;
    --semi-orange-0: 255, 248, 234;
    --semi-orange-1: 254, 238, 204;
    --semi-orange-2: 254, 217, 152;
    --semi-orange-3: 253, 193, 101;
    --semi-orange-4: 253, 166, 51;
    --semi-orange-5: 252, 136, 0;
    --semi-orange-6: 210, 103, 0;
    --semi-orange-7: 168, 74, 0;
    --semi-orange-8: 126, 49, 0;
    --semi-orange-9: 84, 29, 0;
    --semi-pink-0: 253, 236, 239;
    --semi-pink-1: 251, 207, 216;
    --semi-pink-2: 246, 160, 181;
    --semi-pink-3: 242, 115, 150;
    --semi-pink-4: 237, 72, 123;
    --semi-pink-5: 233, 30, 99;
    --semi-pink-6: 197, 19, 86;
    --semi-pink-7: 162, 11, 72;
    --semi-pink-8: 126, 5, 58;
    --semi-pink-9: 90, 1, 43;
    --semi-purple-0: 247, 233, 247;
    --semi-purple-1: 239, 202, 240;
    --semi-purple-2: 221, 155, 224;
    --semi-purple-3: 201, 111, 209;
    --semi-purple-4: 180, 73, 194;
    --semi-purple-5: 158, 40, 179;
    --semi-purple-6: 135, 30, 158;
    --semi-purple-7: 113, 22, 138;
    --semi-purple-8: 92, 15, 117;
    --semi-purple-9: 73, 10, 97;
    --semi-red-0: 254, 242, 237;
    --semi-red-1: 254, 221, 210;
    --semi-red-2: 253, 183, 165;
    --semi-red-3: 251, 144, 120;
    --semi-red-4: 250, 102, 76;
    --semi-red-5: 249, 57, 32;
    --semi-red-6: 213, 37, 21;
    --semi-red-7: 178, 20, 12;
    --semi-red-8: 142, 8, 5;
    --semi-red-9: 106, 1, 3;
    --semi-teal-0: 228, 247, 244;
    --semi-teal-1: 192, 240, 232;
    --semi-teal-2: 135, 224, 211;
    --semi-teal-3: 84, 209, 193;
    --semi-teal-4: 39, 194, 176;
    --semi-teal-5: 0, 179, 161;
    --semi-teal-6: 0, 149, 137;
    --semi-teal-7: 0, 119, 111;
    --semi-teal-8: 0, 89, 85;
    --semi-teal-9: 0, 60, 58;
    --semi-violet-0: 243, 237, 249;
    --semi-violet-1: 226, 209, 244;
    --semi-violet-2: 196, 167, 233;
    --semi-violet-3: 166, 127, 221;
    --semi-violet-4: 136, 91, 210;
    --semi-violet-5: 106, 58, 199;
    --semi-violet-6: 87, 47, 179;
    --semi-violet-7: 70, 37, 158;
    --semi-violet-8: 54, 28, 138;
    --semi-violet-9: 40, 20, 117;
    --semi-white: 255, 255, 255;
    --semi-yellow-0: 255, 253, 234;
    --semi-yellow-1: 254, 251, 203;
    --semi-yellow-2: 253, 243, 152;
    --semi-yellow-3: 252, 232, 101;
    --semi-yellow-4: 251, 218, 50;
    --semi-yellow-5: 250, 200, 0;
    --semi-yellow-6: 208, 170, 0;
    --semi-yellow-7: 167, 139, 0;
    --semi-yellow-8: 125, 106, 0;
    --semi-yellow-9: 83, 72, 0
}

body[theme-mode=dark],
body .semi-always-dark {
    --semi-red-0: 108, 9, 11;
    --semi-red-1: 144, 17, 16;
    --semi-red-2: 180, 32, 25;
    --semi-red-3: 215, 51, 36;
    --semi-red-4: 251, 73, 50;
    --semi-red-5: 252, 114, 90;
    --semi-red-6: 253, 153, 131;
    --semi-red-7: 253, 190, 172;
    --semi-red-8: 254, 224, 213;
    --semi-red-9: 255, 243, 239;
    --semi-pink-0: 92, 7, 48;
    --semi-pink-1: 128, 14, 65;
    --semi-pink-2: 164, 23, 81;
    --semi-pink-3: 199, 34, 97;
    --semi-pink-4: 235, 47, 113;
    --semi-pink-5: 239, 86, 134;
    --semi-pink-6: 243, 126, 159;
    --semi-pink-7: 247, 168, 188;
    --semi-pink-8: 251, 211, 220;
    --semi-pink-9: 253, 238, 241;
    --semi-purple-0: 74, 16, 97;
    --semi-purple-1: 94, 23, 118;
    --semi-purple-2: 115, 31, 138;
    --semi-purple-3: 137, 40, 159;
    --semi-purple-4: 160, 51, 179;
    --semi-purple-5: 181, 83, 194;
    --semi-purple-6: 202, 120, 209;
    --semi-purple-7: 221, 160, 225;
    --semi-purple-8: 239, 206, 240;
    --semi-purple-9: 247, 235, 247;
    --semi-violet-0: 64, 27, 119;
    --semi-violet-1: 76, 36, 140;
    --semi-violet-2: 88, 46, 160;
    --semi-violet-3: 100, 57, 181;
    --semi-violet-4: 114, 70, 201;
    --semi-violet-5: 136, 101, 212;
    --semi-violet-6: 162, 136, 223;
    --semi-violet-7: 190, 173, 233;
    --semi-violet-8: 221, 212, 244;
    --semi-violet-9: 241, 238, 250;
    --semi-indigo-0: 23, 30, 101;
    --semi-indigo-1: 32, 41, 122;
    --semi-indigo-2: 41, 54, 142;
    --semi-indigo-3: 52, 68, 163;
    --semi-indigo-4: 64, 83, 183;
    --semi-indigo-5: 95, 113, 197;
    --semi-indigo-6: 129, 145, 212;
    --semi-indigo-7: 167, 180, 226;
    --semi-indigo-8: 209, 216, 241;
    --semi-indigo-9: 237, 239, 248;
    --semi-blue-0: 5, 49, 112;
    --semi-blue-1: 10, 70, 148;
    --semi-blue-2: 19, 92, 184;
    --semi-blue-3: 29, 117, 219;
    --semi-blue-4: 41, 144, 255;
    --semi-blue-5: 84, 169, 255;
    --semi-blue-6: 127, 193, 255;
    --semi-blue-7: 169, 215, 255;
    --semi-blue-8: 212, 236, 255;
    --semi-blue-9: 239, 248, 255;
    --semi-light-blue-0: 0, 55, 97;
    --semi-light-blue-1: 0, 77, 133;
    --semi-light-blue-2: 3, 102, 169;
    --semi-light-blue-3: 10, 129, 204;
    --semi-light-blue-4: 19, 159, 240;
    --semi-light-blue-5: 64, 180, 243;
    --semi-light-blue-6: 110, 200, 246;
    --semi-light-blue-7: 157, 220, 249;
    --semi-light-blue-8: 206, 238, 252;
    --semi-light-blue-9: 235, 248, 254;
    --semi-cyan-0: 4, 52, 61;
    --semi-cyan-1: 7, 79, 92;
    --semi-cyan-2: 10, 108, 123;
    --semi-cyan-3: 14, 137, 153;
    --semi-cyan-4: 19, 168, 184;
    --semi-cyan-5: 56, 187, 198;
    --semi-cyan-6: 98, 205, 212;
    --semi-cyan-7: 145, 223, 227;
    --semi-cyan-8: 198, 239, 241;
    --semi-cyan-9: 231, 247, 248;
    --semi-teal-0: 2, 60, 57;
    --semi-teal-1: 4, 90, 85;
    --semi-teal-2: 7, 119, 111;
    --semi-teal-3: 10, 149, 136;
    --semi-teal-4: 14, 179, 161;
    --semi-teal-5: 51, 194, 176;
    --semi-teal-6: 94, 209, 193;
    --semi-teal-7: 142, 225, 211;
    --semi-teal-8: 196, 240, 232;
    --semi-teal-9: 230, 247, 244;
    --semi-green-0: 18, 60, 25;
    --semi-green-1: 28, 90, 37;
    --semi-green-2: 39, 119, 49;
    --semi-green-3: 50, 149, 61;
    --semi-green-4: 62, 179, 73;
    --semi-green-5: 93, 194, 100;
    --semi-green-6: 127, 209, 132;
    --semi-green-7: 166, 225, 168;
    --semi-green-8: 208, 240, 209;
    --semi-green-9: 236, 247, 236;
    --semi-light-green-0: 38, 61, 19;
    --semi-light-green-1: 59, 92, 29;
    --semi-light-green-2: 81, 123, 40;
    --semi-light-green-3: 103, 153, 52;
    --semi-light-green-4: 127, 184, 64;
    --semi-light-green-5: 151, 198, 95;
    --semi-light-green-6: 176, 212, 129;
    --semi-light-green-7: 201, 227, 167;
    --semi-light-green-8: 228, 241, 209;
    --semi-light-green-9: 243, 248, 237;
    --semi-lime-0: 49, 70, 3;
    --semi-lime-1: 75, 105, 5;
    --semi-lime-2: 103, 141, 9;
    --semi-lime-3: 132, 176, 12;
    --semi-lime-4: 162, 211, 17;
    --semi-lime-5: 174, 220, 58;
    --semi-lime-6: 189, 229, 102;
    --semi-lime-7: 207, 237, 150;
    --semi-lime-8: 229, 246, 201;
    --semi-lime-9: 243, 251, 233;
    --semi-yellow-0: 84, 73, 3;
    --semi-yellow-1: 126, 108, 6;
    --semi-yellow-2: 168, 142, 10;
    --semi-yellow-3: 210, 175, 15;
    --semi-yellow-4: 252, 206, 20;
    --semi-yellow-5: 253, 222, 67;
    --semi-yellow-6: 253, 235, 113;
    --semi-yellow-7: 254, 245, 160;
    --semi-yellow-8: 254, 251, 208;
    --semi-yellow-9: 255, 254, 236;
    --semi-amber-0: 81, 46, 9;
    --semi-amber-1: 121, 75, 15;
    --semi-amber-2: 161, 107, 22;
    --semi-amber-3: 202, 143, 30;
    --semi-amber-4: 242, 183, 38;
    --semi-amber-5: 245, 202, 80;
    --semi-amber-6: 247, 219, 122;
    --semi-amber-7: 250, 234, 166;
    --semi-amber-8: 252, 246, 210;
    --semi-amber-9: 254, 251, 237;
    --semi-orange-0: 85, 31, 3;
    --semi-orange-1: 128, 53, 6;
    --semi-orange-2: 170, 80, 10;
    --semi-orange-3: 213, 111, 15;
    --semi-orange-4: 255, 146, 20;
    --semi-orange-5: 255, 174, 67;
    --semi-orange-6: 255, 199, 114;
    --semi-orange-7: 255, 221, 161;
    --semi-orange-8: 255, 239, 208;
    --semi-orange-9: 255, 249, 237;
    --semi-grey-0: 28, 31, 35;
    --semi-grey-1: 46, 50, 56;
    --semi-grey-2: 65, 70, 76;
    --semi-grey-3: 85, 91, 97;
    --semi-grey-4: 107, 112, 117;
    --semi-grey-5: 136, 141, 146;
    --semi-grey-6: 167, 171, 176;
    --semi-grey-7: 198, 202, 205;
    --semi-grey-8: 230, 232, 234;
    --semi-grey-9: 249, 249, 249;
    --semi-white: 255, 255, 255;
    --semi-black: 0, 0, 0
}

:host([theme-mode=dark]) {
    --semi-red-0: 108, 9, 11;
    --semi-red-1: 144, 17, 16;
    --semi-red-2: 180, 32, 25;
    --semi-red-3: 215, 51, 36;
    --semi-red-4: 251, 73, 50;
    --semi-red-5: 252, 114, 90;
    --semi-red-6: 253, 153, 131;
    --semi-red-7: 253, 190, 172;
    --semi-red-8: 254, 224, 213;
    --semi-red-9: 255, 243, 239;
    --semi-pink-0: 92, 7, 48;
    --semi-pink-1: 128, 14, 65;
    --semi-pink-2: 164, 23, 81;
    --semi-pink-3: 199, 34, 97;
    --semi-pink-4: 235, 47, 113;
    --semi-pink-5: 239, 86, 134;
    --semi-pink-6: 243, 126, 159;
    --semi-pink-7: 247, 168, 188;
    --semi-pink-8: 251, 211, 220;
    --semi-pink-9: 253, 238, 241;
    --semi-purple-0: 74, 16, 97;
    --semi-purple-1: 94, 23, 118;
    --semi-purple-2: 115, 31, 138;
    --semi-purple-3: 137, 40, 159;
    --semi-purple-4: 160, 51, 179;
    --semi-purple-5: 181, 83, 194;
    --semi-purple-6: 202, 120, 209;
    --semi-purple-7: 221, 160, 225;
    --semi-purple-8: 239, 206, 240;
    --semi-purple-9: 247, 235, 247;
    --semi-violet-0: 64, 27, 119;
    --semi-violet-1: 76, 36, 140;
    --semi-violet-2: 88, 46, 160;
    --semi-violet-3: 100, 57, 181;
    --semi-violet-4: 114, 70, 201;
    --semi-violet-5: 136, 101, 212;
    --semi-violet-6: 162, 136, 223;
    --semi-violet-7: 190, 173, 233;
    --semi-violet-8: 221, 212, 244;
    --semi-violet-9: 241, 238, 250;
    --semi-indigo-0: 23, 30, 101;
    --semi-indigo-1: 32, 41, 122;
    --semi-indigo-2: 41, 54, 142;
    --semi-indigo-3: 52, 68, 163;
    --semi-indigo-4: 64, 83, 183;
    --semi-indigo-5: 95, 113, 197;
    --semi-indigo-6: 129, 145, 212;
    --semi-indigo-7: 167, 180, 226;
    --semi-indigo-8: 209, 216, 241;
    --semi-indigo-9: 237, 239, 248;
    --semi-blue-0: 5, 49, 112;
    --semi-blue-1: 10, 70, 148;
    --semi-blue-2: 19, 92, 184;
    --semi-blue-3: 29, 117, 219;
    --semi-blue-4: 41, 144, 255;
    --semi-blue-5: 84, 169, 255;
    --semi-blue-6: 127, 193, 255;
    --semi-blue-7: 169, 215, 255;
    --semi-blue-8: 212, 236, 255;
    --semi-blue-9: 239, 248, 255;
    --semi-light-blue-0: 0, 55, 97;
    --semi-light-blue-1: 0, 77, 133;
    --semi-light-blue-2: 3, 102, 169;
    --semi-light-blue-3: 10, 129, 204;
    --semi-light-blue-4: 19, 159, 240;
    --semi-light-blue-5: 64, 180, 243;
    --semi-light-blue-6: 110, 200, 246;
    --semi-light-blue-7: 157, 220, 249;
    --semi-light-blue-8: 206, 238, 252;
    --semi-light-blue-9: 235, 248, 254;
    --semi-cyan-0: 4, 52, 61;
    --semi-cyan-1: 7, 79, 92;
    --semi-cyan-2: 10, 108, 123;
    --semi-cyan-3: 14, 137, 153;
    --semi-cyan-4: 19, 168, 184;
    --semi-cyan-5: 56, 187, 198;
    --semi-cyan-6: 98, 205, 212;
    --semi-cyan-7: 145, 223, 227;
    --semi-cyan-8: 198, 239, 241;
    --semi-cyan-9: 231, 247, 248;
    --semi-teal-0: 2, 60, 57;
    --semi-teal-1: 4, 90, 85;
    --semi-teal-2: 7, 119, 111;
    --semi-teal-3: 10, 149, 136;
    --semi-teal-4: 14, 179, 161;
    --semi-teal-5: 51, 194, 176;
    --semi-teal-6: 94, 209, 193;
    --semi-teal-7: 142, 225, 211;
    --semi-teal-8: 196, 240, 232;
    --semi-teal-9: 230, 247, 244;
    --semi-green-0: 18, 60, 25;
    --semi-green-1: 28, 90, 37;
    --semi-green-2: 39, 119, 49;
    --semi-green-3: 50, 149, 61;
    --semi-green-4: 62, 179, 73;
    --semi-green-5: 93, 194, 100;
    --semi-green-6: 127, 209, 132;
    --semi-green-7: 166, 225, 168;
    --semi-green-8: 208, 240, 209;
    --semi-green-9: 236, 247, 236;
    --semi-light-green-0: 38, 61, 19;
    --semi-light-green-1: 59, 92, 29;
    --semi-light-green-2: 81, 123, 40;
    --semi-light-green-3: 103, 153, 52;
    --semi-light-green-4: 127, 184, 64;
    --semi-light-green-5: 151, 198, 95;
    --semi-light-green-6: 176, 212, 129;
    --semi-light-green-7: 201, 227, 167;
    --semi-light-green-8: 228, 241, 209;
    --semi-light-green-9: 243, 248, 237;
    --semi-lime-0: 49, 70, 3;
    --semi-lime-1: 75, 105, 5;
    --semi-lime-2: 103, 141, 9;
    --semi-lime-3: 132, 176, 12;
    --semi-lime-4: 162, 211, 17;
    --semi-lime-5: 174, 220, 58;
    --semi-lime-6: 189, 229, 102;
    --semi-lime-7: 207, 237, 150;
    --semi-lime-8: 229, 246, 201;
    --semi-lime-9: 243, 251, 233;
    --semi-yellow-0: 84, 73, 3;
    --semi-yellow-1: 126, 108, 6;
    --semi-yellow-2: 168, 142, 10;
    --semi-yellow-3: 210, 175, 15;
    --semi-yellow-4: 252, 206, 20;
    --semi-yellow-5: 253, 222, 67;
    --semi-yellow-6: 253, 235, 113;
    --semi-yellow-7: 254, 245, 160;
    --semi-yellow-8: 254, 251, 208;
    --semi-yellow-9: 255, 254, 236;
    --semi-amber-0: 81, 46, 9;
    --semi-amber-1: 121, 75, 15;
    --semi-amber-2: 161, 107, 22;
    --semi-amber-3: 202, 143, 30;
    --semi-amber-4: 242, 183, 38;
    --semi-amber-5: 245, 202, 80;
    --semi-amber-6: 247, 219, 122;
    --semi-amber-7: 250, 234, 166;
    --semi-amber-8: 252, 246, 210;
    --semi-amber-9: 254, 251, 237;
    --semi-orange-0: 85, 31, 3;
    --semi-orange-1: 128, 53, 6;
    --semi-orange-2: 170, 80, 10;
    --semi-orange-3: 213, 111, 15;
    --semi-orange-4: 255, 146, 20;
    --semi-orange-5: 255, 174, 67;
    --semi-orange-6: 255, 199, 114;
    --semi-orange-7: 255, 221, 161;
    --semi-orange-8: 255, 239, 208;
    --semi-orange-9: 255, 249, 237;
    --semi-grey-0: 28, 31, 35;
    --semi-grey-1: 46, 50, 56;
    --semi-grey-2: 65, 70, 76;
    --semi-grey-3: 85, 91, 97;
    --semi-grey-4: 107, 112, 117;
    --semi-grey-5: 136, 141, 146;
    --semi-grey-6: 167, 171, 176;
    --semi-grey-7: 198, 202, 205;
    --semi-grey-8: 230, 232, 234;
    --semi-grey-9: 249, 249, 249;
    --semi-white: 255, 255, 255;
    --semi-black: 0, 0, 0
}

:host .semi-always-dark {
    --semi-red-0: 108, 9, 11;
    --semi-red-1: 144, 17, 16;
    --semi-red-2: 180, 32, 25;
    --semi-red-3: 215, 51, 36;
    --semi-red-4: 251, 73, 50;
    --semi-red-5: 252, 114, 90;
    --semi-red-6: 253, 153, 131;
    --semi-red-7: 253, 190, 172;
    --semi-red-8: 254, 224, 213;
    --semi-red-9: 255, 243, 239;
    --semi-pink-0: 92, 7, 48;
    --semi-pink-1: 128, 14, 65;
    --semi-pink-2: 164, 23, 81;
    --semi-pink-3: 199, 34, 97;
    --semi-pink-4: 235, 47, 113;
    --semi-pink-5: 239, 86, 134;
    --semi-pink-6: 243, 126, 159;
    --semi-pink-7: 247, 168, 188;
    --semi-pink-8: 251, 211, 220;
    --semi-pink-9: 253, 238, 241;
    --semi-purple-0: 74, 16, 97;
    --semi-purple-1: 94, 23, 118;
    --semi-purple-2: 115, 31, 138;
    --semi-purple-3: 137, 40, 159;
    --semi-purple-4: 160, 51, 179;
    --semi-purple-5: 181, 83, 194;
    --semi-purple-6: 202, 120, 209;
    --semi-purple-7: 221, 160, 225;
    --semi-purple-8: 239, 206, 240;
    --semi-purple-9: 247, 235, 247;
    --semi-violet-0: 64, 27, 119;
    --semi-violet-1: 76, 36, 140;
    --semi-violet-2: 88, 46, 160;
    --semi-violet-3: 100, 57, 181;
    --semi-violet-4: 114, 70, 201;
    --semi-violet-5: 136, 101, 212;
    --semi-violet-6: 162, 136, 223;
    --semi-violet-7: 190, 173, 233;
    --semi-violet-8: 221, 212, 244;
    --semi-violet-9: 241, 238, 250;
    --semi-indigo-0: 23, 30, 101;
    --semi-indigo-1: 32, 41, 122;
    --semi-indigo-2: 41, 54, 142;
    --semi-indigo-3: 52, 68, 163;
    --semi-indigo-4: 64, 83, 183;
    --semi-indigo-5: 95, 113, 197;
    --semi-indigo-6: 129, 145, 212;
    --semi-indigo-7: 167, 180, 226;
    --semi-indigo-8: 209, 216, 241;
    --semi-indigo-9: 237, 239, 248;
    --semi-blue-0: 5, 49, 112;
    --semi-blue-1: 10, 70, 148;
    --semi-blue-2: 19, 92, 184;
    --semi-blue-3: 29, 117, 219;
    --semi-blue-4: 41, 144, 255;
    --semi-blue-5: 84, 169, 255;
    --semi-blue-6: 127, 193, 255;
    --semi-blue-7: 169, 215, 255;
    --semi-blue-8: 212, 236, 255;
    --semi-blue-9: 239, 248, 255;
    --semi-light-blue-0: 0, 55, 97;
    --semi-light-blue-1: 0, 77, 133;
    --semi-light-blue-2: 3, 102, 169;
    --semi-light-blue-3: 10, 129, 204;
    --semi-light-blue-4: 19, 159, 240;
    --semi-light-blue-5: 64, 180, 243;
    --semi-light-blue-6: 110, 200, 246;
    --semi-light-blue-7: 157, 220, 249;
    --semi-light-blue-8: 206, 238, 252;
    --semi-light-blue-9: 235, 248, 254;
    --semi-cyan-0: 4, 52, 61;
    --semi-cyan-1: 7, 79, 92;
    --semi-cyan-2: 10, 108, 123;
    --semi-cyan-3: 14, 137, 153;
    --semi-cyan-4: 19, 168, 184;
    --semi-cyan-5: 56, 187, 198;
    --semi-cyan-6: 98, 205, 212;
    --semi-cyan-7: 145, 223, 227;
    --semi-cyan-8: 198, 239, 241;
    --semi-cyan-9: 231, 247, 248;
    --semi-teal-0: 2, 60, 57;
    --semi-teal-1: 4, 90, 85;
    --semi-teal-2: 7, 119, 111;
    --semi-teal-3: 10, 149, 136;
    --semi-teal-4: 14, 179, 161;
    --semi-teal-5: 51, 194, 176;
    --semi-teal-6: 94, 209, 193;
    --semi-teal-7: 142, 225, 211;
    --semi-teal-8: 196, 240, 232;
    --semi-teal-9: 230, 247, 244;
    --semi-green-0: 18, 60, 25;
    --semi-green-1: 28, 90, 37;
    --semi-green-2: 39, 119, 49;
    --semi-green-3: 50, 149, 61;
    --semi-green-4: 62, 179, 73;
    --semi-green-5: 93, 194, 100;
    --semi-green-6: 127, 209, 132;
    --semi-green-7: 166, 225, 168;
    --semi-green-8: 208, 240, 209;
    --semi-green-9: 236, 247, 236;
    --semi-light-green-0: 38, 61, 19;
    --semi-light-green-1: 59, 92, 29;
    --semi-light-green-2: 81, 123, 40;
    --semi-light-green-3: 103, 153, 52;
    --semi-light-green-4: 127, 184, 64;
    --semi-light-green-5: 151, 198, 95;
    --semi-light-green-6: 176, 212, 129;
    --semi-light-green-7: 201, 227, 167;
    --semi-light-green-8: 228, 241, 209;
    --semi-light-green-9: 243, 248, 237;
    --semi-lime-0: 49, 70, 3;
    --semi-lime-1: 75, 105, 5;
    --semi-lime-2: 103, 141, 9;
    --semi-lime-3: 132, 176, 12;
    --semi-lime-4: 162, 211, 17;
    --semi-lime-5: 174, 220, 58;
    --semi-lime-6: 189, 229, 102;
    --semi-lime-7: 207, 237, 150;
    --semi-lime-8: 229, 246, 201;
    --semi-lime-9: 243, 251, 233;
    --semi-yellow-0: 84, 73, 3;
    --semi-yellow-1: 126, 108, 6;
    --semi-yellow-2: 168, 142, 10;
    --semi-yellow-3: 210, 175, 15;
    --semi-yellow-4: 252, 206, 20;
    --semi-yellow-5: 253, 222, 67;
    --semi-yellow-6: 253, 235, 113;
    --semi-yellow-7: 254, 245, 160;
    --semi-yellow-8: 254, 251, 208;
    --semi-yellow-9: 255, 254, 236;
    --semi-amber-0: 81, 46, 9;
    --semi-amber-1: 121, 75, 15;
    --semi-amber-2: 161, 107, 22;
    --semi-amber-3: 202, 143, 30;
    --semi-amber-4: 242, 183, 38;
    --semi-amber-5: 245, 202, 80;
    --semi-amber-6: 247, 219, 122;
    --semi-amber-7: 250, 234, 166;
    --semi-amber-8: 252, 246, 210;
    --semi-amber-9: 254, 251, 237;
    --semi-orange-0: 85, 31, 3;
    --semi-orange-1: 128, 53, 6;
    --semi-orange-2: 170, 80, 10;
    --semi-orange-3: 213, 111, 15;
    --semi-orange-4: 255, 146, 20;
    --semi-orange-5: 255, 174, 67;
    --semi-orange-6: 255, 199, 114;
    --semi-orange-7: 255, 221, 161;
    --semi-orange-8: 255, 239, 208;
    --semi-orange-9: 255, 249, 237;
    --semi-grey-0: 28, 31, 35;
    --semi-grey-1: 46, 50, 56;
    --semi-grey-2: 65, 70, 76;
    --semi-grey-3: 85, 91, 97;
    --semi-grey-4: 107, 112, 117;
    --semi-grey-5: 136, 141, 146;
    --semi-grey-6: 167, 171, 176;
    --semi-grey-7: 198, 202, 205;
    --semi-grey-8: 230, 232, 234;
    --semi-grey-9: 249, 249, 249;
    --semi-white: 255, 255, 255;
    --semi-black: 0, 0, 0
}

body,
body[theme-mode=dark] .semi-always-light {
    -webkit-font-smoothing: antialiased;
    --semi-color-white: rgba(var(--semi-white), 1);
    --semi-color-black: rgba(var(--semi-black), 1);
    --semi-color-primary: rgba(var(--semi-blue-5), 1);
    --semi-color-primary-hover: rgba(var(--semi-blue-6), 1);
    --semi-color-primary-active: rgba(var(--semi-blue-7), 1);
    --semi-color-primary-disabled: rgba(var(--semi-blue-2), 1);
    --semi-color-primary-light-default: rgba(var(--semi-blue-0), 1);
    --semi-color-primary-light-hover: rgba(var(--semi-blue-1), 1);
    --semi-color-primary-light-active: rgba(var(--semi-blue-2), 1);
    --semi-color-secondary: rgba(var(--semi-light-blue-5), 1);
    --semi-color-secondary-hover: rgba(var(--semi-light-blue-6), 1);
    --semi-color-secondary-active: rgba(var(--semi-light-blue-7), 1);
    --semi-color-secondary-disabled: rgba(var(--semi-light-blue-2), 1);
    --semi-color-secondary-light-default: rgba(var(--semi-light-blue-0), 1);
    --semi-color-secondary-light-hover: rgba(var(--semi-light-blue-1), 1);
    --semi-color-secondary-light-active: rgba(var(--semi-light-blue-2), 1);
    --semi-color-tertiary: rgba(var(--semi-grey-5), 1);
    --semi-color-tertiary-hover: rgba(var(--semi-grey-6), 1);
    --semi-color-tertiary-active: rgba(var(--semi-grey-7), 1);
    --semi-color-tertiary-light-default: rgba(var(--semi-grey-0), 1);
    --semi-color-tertiary-light-hover: rgba(var(--semi-grey-1), 1);
    --semi-color-tertiary-light-active: rgba(var(--semi-grey-2), 1);
    --semi-color-default: rgba(var(--semi-grey-0), 1);
    --semi-color-default-hover: rgba(var(--semi-grey-1), 1);
    --semi-color-default-active: rgba(var(--semi-grey-2), 1);
    --semi-color-info: rgba(var(--semi-blue-5), 1);
    --semi-color-info-hover: rgba(var(--semi-blue-6), 1);
    --semi-color-info-active: rgba(var(--semi-blue-7), 1);
    --semi-color-info-disabled: rgba(var(--semi-blue-2), 1);
    --semi-color-info-light-default: rgba(var(--semi-blue-0), 1);
    --semi-color-info-light-hover: rgba(var(--semi-blue-1), 1);
    --semi-color-info-light-active: rgba(var(--semi-blue-2), 1);
    --semi-color-success: rgba(var(--semi-green-5), 1);
    --semi-color-success-hover: rgba(var(--semi-green-6), 1);
    --semi-color-success-active: rgba(var(--semi-green-7), 1);
    --semi-color-success-disabled: rgba(var(--semi-green-2), 1);
    --semi-color-success-light-default: rgba(var(--semi-green-0), 1);
    --semi-color-success-light-hover: rgba(var(--semi-green-1), 1);
    --semi-color-success-light-active: rgba(var(--semi-green-2), 1);
    --semi-color-danger: rgba(var(--semi-red-5), 1);
    --semi-color-danger-hover: rgba(var(--semi-red-6), 1);
    --semi-color-danger-active: rgba(var(--semi-red-7), 1);
    --semi-color-danger-light-default: rgba(var(--semi-red-0), 1);
    --semi-color-danger-light-hover: rgba(var(--semi-red-1), 1);
    --semi-color-danger-light-active: rgba(var(--semi-red-2), 1);
    --semi-color-warning: rgba(var(--semi-orange-5), 1);
    --semi-color-warning-hover: rgba(var(--semi-orange-6), 1);
    --semi-color-warning-active: rgba(var(--semi-orange-7), 1);
    --semi-color-warning-light-default: rgba(var(--semi-orange-0), 1);
    --semi-color-warning-light-hover: rgba(var(--semi-orange-1), 1);
    --semi-color-warning-light-active: rgba(var(--semi-orange-2), 1);
    --semi-color-focus-border: rgba(var(--semi-blue-5), 1);
    --semi-color-disabled-text: rgba(var(--semi-grey-9), .35);
    --semi-color-disabled-border: rgba(var(--semi-grey-1), 1);
    --semi-color-disabled-bg: rgba(var(--semi-grey-1), 1);
    --semi-color-disabled-fill: rgba(var(--semi-grey-8), .04);
    --semi-color-shadow: rgba(var(--semi-black), .04);
    --semi-color-link: rgba(var(--semi-blue-5), 1);
    --semi-color-link-hover: rgba(var(--semi-blue-6), 1);
    --semi-color-link-active: rgba(var(--semi-blue-7), 1);
    --semi-color-link-visited: rgba(var(--semi-blue-5), 1);
    --semi-color-border: rgba(var(--semi-grey-9), .08);
    --semi-color-nav-bg: rgba(var(--semi-white), 1);
    --semi-color-overlay-bg: rgba(22, 22, 26, .6);
    --semi-color-fill-0: rgba(var(--semi-grey-8), .05);
    --semi-color-fill-1: rgba(var(--semi-grey-8), .09);
    --semi-color-fill-2: rgba(var(--semi-grey-8), .13);
    --semi-color-bg-0: rgba(var(--semi-white), 1);
    --semi-color-bg-1: rgba(var(--semi-white), 1);
    --semi-color-bg-2: rgba(var(--semi-white), 1);
    --semi-color-bg-3: rgba(var(--semi-white), 1);
    --semi-color-bg-4: rgba(var(--semi-white), 1);
    --semi-color-text-0: rgba(var(--semi-grey-9), 1);
    --semi-color-text-1: rgba(var(--semi-grey-9), .8);
    --semi-color-text-2: rgba(var(--semi-grey-9), .62);
    --semi-color-text-3: rgba(var(--semi-grey-9), .35);
    --semi-shadow-elevated: 0 0 1px rgba(0, 0, 0, .3), 0 4px 14px rgba(0, 0, 0, .1);
    --semi-border-radius-extra-small: 3px;
    --semi-border-radius-small: 3px;
    --semi-border-radius-medium: 6px;
    --semi-border-radius-large: 12px;
    --semi-border-radius-circle: 50%;
    --semi-border-radius-full: 9999px;
    --semi-color-highlight-bg: rgba(var(--semi-yellow-4), 1);
    --semi-color-highlight: rgba(var(--semi-black), 1);
    --semi-color-data-0: #5769ff;
    --semi-color-data-1: #8ed4e7;
    --semi-color-data-2: #f58700;
    --semi-color-data-3: #dcb7fc;
    --semi-color-data-4: #4a9cf7;
    --semi-color-data-5: #f3cc35;
    --semi-color-data-6: #fe8090;
    --semi-color-data-7: #8bd7d2;
    --semi-color-data-8: #83b023;
    --semi-color-data-9: #e9a5e5;
    --semi-color-data-10: #30a7ce;
    --semi-color-data-11: #f9c064;
    --semi-color-data-12: #b171f9;
    --semi-color-data-13: #77b6f9;
    --semi-color-data-14: #c88f02;
    --semi-color-data-15: #ffaab2;
    --semi-color-data-16: #33b0ab;
    --semi-color-data-17: #b6d781;
    --semi-color-data-18: #d458d4;
    --semi-color-data-19: #bcc6ff;
    font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif
}

:host {
    -webkit-font-smoothing: antialiased;
    --semi-color-white: rgba(var(--semi-white), 1);
    --semi-color-black: rgba(var(--semi-black), 1);
    --semi-color-primary: rgba(var(--semi-blue-5), 1);
    --semi-color-primary-hover: rgba(var(--semi-blue-6), 1);
    --semi-color-primary-active: rgba(var(--semi-blue-7), 1);
    --semi-color-primary-disabled: rgba(var(--semi-blue-2), 1);
    --semi-color-primary-light-default: rgba(var(--semi-blue-0), 1);
    --semi-color-primary-light-hover: rgba(var(--semi-blue-1), 1);
    --semi-color-primary-light-active: rgba(var(--semi-blue-2), 1);
    --semi-color-secondary: rgba(var(--semi-light-blue-5), 1);
    --semi-color-secondary-hover: rgba(var(--semi-light-blue-6), 1);
    --semi-color-secondary-active: rgba(var(--semi-light-blue-7), 1);
    --semi-color-secondary-disabled: rgba(var(--semi-light-blue-2), 1);
    --semi-color-secondary-light-default: rgba(var(--semi-light-blue-0), 1);
    --semi-color-secondary-light-hover: rgba(var(--semi-light-blue-1), 1);
    --semi-color-secondary-light-active: rgba(var(--semi-light-blue-2), 1);
    --semi-color-tertiary: rgba(var(--semi-grey-5), 1);
    --semi-color-tertiary-hover: rgba(var(--semi-grey-6), 1);
    --semi-color-tertiary-active: rgba(var(--semi-grey-7), 1);
    --semi-color-tertiary-light-default: rgba(var(--semi-grey-0), 1);
    --semi-color-tertiary-light-hover: rgba(var(--semi-grey-1), 1);
    --semi-color-tertiary-light-active: rgba(var(--semi-grey-2), 1);
    --semi-color-default: rgba(var(--semi-grey-0), 1);
    --semi-color-default-hover: rgba(var(--semi-grey-1), 1);
    --semi-color-default-active: rgba(var(--semi-grey-2), 1);
    --semi-color-info: rgba(var(--semi-blue-5), 1);
    --semi-color-info-hover: rgba(var(--semi-blue-6), 1);
    --semi-color-info-active: rgba(var(--semi-blue-7), 1);
    --semi-color-info-disabled: rgba(var(--semi-blue-2), 1);
    --semi-color-info-light-default: rgba(var(--semi-blue-0), 1);
    --semi-color-info-light-hover: rgba(var(--semi-blue-1), 1);
    --semi-color-info-light-active: rgba(var(--semi-blue-2), 1);
    --semi-color-success: rgba(var(--semi-green-5), 1);
    --semi-color-success-hover: rgba(var(--semi-green-6), 1);
    --semi-color-success-active: rgba(var(--semi-green-7), 1);
    --semi-color-success-disabled: rgba(var(--semi-green-2), 1);
    --semi-color-success-light-default: rgba(var(--semi-green-0), 1);
    --semi-color-success-light-hover: rgba(var(--semi-green-1), 1);
    --semi-color-success-light-active: rgba(var(--semi-green-2), 1);
    --semi-color-danger: rgba(var(--semi-red-5), 1);
    --semi-color-danger-hover: rgba(var(--semi-red-6), 1);
    --semi-color-danger-active: rgba(var(--semi-red-7), 1);
    --semi-color-danger-light-default: rgba(var(--semi-red-0), 1);
    --semi-color-danger-light-hover: rgba(var(--semi-red-1), 1);
    --semi-color-danger-light-active: rgba(var(--semi-red-2), 1);
    --semi-color-warning: rgba(var(--semi-orange-5), 1);
    --semi-color-warning-hover: rgba(var(--semi-orange-6), 1);
    --semi-color-warning-active: rgba(var(--semi-orange-7), 1);
    --semi-color-warning-light-default: rgba(var(--semi-orange-0), 1);
    --semi-color-warning-light-hover: rgba(var(--semi-orange-1), 1);
    --semi-color-warning-light-active: rgba(var(--semi-orange-2), 1);
    --semi-color-focus-border: rgba(var(--semi-blue-5), 1);
    --semi-color-disabled-text: rgba(var(--semi-grey-9), .35);
    --semi-color-disabled-border: rgba(var(--semi-grey-1), 1);
    --semi-color-disabled-bg: rgba(var(--semi-grey-1), 1);
    --semi-color-disabled-fill: rgba(var(--semi-grey-8), .04);
    --semi-color-shadow: rgba(var(--semi-black), .04);
    --semi-color-link: rgba(var(--semi-blue-5), 1);
    --semi-color-link-hover: rgba(var(--semi-blue-6), 1);
    --semi-color-link-active: rgba(var(--semi-blue-7), 1);
    --semi-color-link-visited: rgba(var(--semi-blue-5), 1);
    --semi-color-border: rgba(var(--semi-grey-9), .08);
    --semi-color-nav-bg: rgba(var(--semi-white), 1);
    --semi-color-overlay-bg: rgba(22, 22, 26, .6);
    --semi-color-fill-0: rgba(var(--semi-grey-8), .05);
    --semi-color-fill-1: rgba(var(--semi-grey-8), .09);
    --semi-color-fill-2: rgba(var(--semi-grey-8), .13);
    --semi-color-bg-0: rgba(var(--semi-white), 1);
    --semi-color-bg-1: rgba(var(--semi-white), 1);
    --semi-color-bg-2: rgba(var(--semi-white), 1);
    --semi-color-bg-3: rgba(var(--semi-white), 1);
    --semi-color-bg-4: rgba(var(--semi-white), 1);
    --semi-color-text-0: rgba(var(--semi-grey-9), 1);
    --semi-color-text-1: rgba(var(--semi-grey-9), .8);
    --semi-color-text-2: rgba(var(--semi-grey-9), .62);
    --semi-color-text-3: rgba(var(--semi-grey-9), .35);
    --semi-shadow-elevated: 0 0 1px rgba(0, 0, 0, .3), 0 4px 14px rgba(0, 0, 0, .1);
    --semi-border-radius-extra-small: 3px;
    --semi-border-radius-small: 3px;
    --semi-border-radius-medium: 6px;
    --semi-border-radius-large: 12px;
    --semi-border-radius-circle: 50%;
    --semi-border-radius-full: 9999px;
    --semi-color-highlight-bg: rgba(var(--semi-yellow-4), 1);
    --semi-color-highlight: rgba(var(--semi-black), 1);
    --semi-color-data-0: #5769ff;
    --semi-color-data-1: #8ed4e7;
    --semi-color-data-2: #f58700;
    --semi-color-data-3: #dcb7fc;
    --semi-color-data-4: #4a9cf7;
    --semi-color-data-5: #f3cc35;
    --semi-color-data-6: #fe8090;
    --semi-color-data-7: #8bd7d2;
    --semi-color-data-8: #83b023;
    --semi-color-data-9: #e9a5e5;
    --semi-color-data-10: #30a7ce;
    --semi-color-data-11: #f9c064;
    --semi-color-data-12: #b171f9;
    --semi-color-data-13: #77b6f9;
    --semi-color-data-14: #c88f02;
    --semi-color-data-15: #ffaab2;
    --semi-color-data-16: #33b0ab;
    --semi-color-data-17: #b6d781;
    --semi-color-data-18: #d458d4;
    --semi-color-data-19: #bcc6ff;
    font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif
}

:host .semi-always-light {
    -webkit-font-smoothing: antialiased;
    --semi-color-white: rgba(var(--semi-white), 1);
    --semi-color-black: rgba(var(--semi-black), 1);
    --semi-color-primary: rgba(var(--semi-blue-5), 1);
    --semi-color-primary-hover: rgba(var(--semi-blue-6), 1);
    --semi-color-primary-active: rgba(var(--semi-blue-7), 1);
    --semi-color-primary-disabled: rgba(var(--semi-blue-2), 1);
    --semi-color-primary-light-default: rgba(var(--semi-blue-0), 1);
    --semi-color-primary-light-hover: rgba(var(--semi-blue-1), 1);
    --semi-color-primary-light-active: rgba(var(--semi-blue-2), 1);
    --semi-color-secondary: rgba(var(--semi-light-blue-5), 1);
    --semi-color-secondary-hover: rgba(var(--semi-light-blue-6), 1);
    --semi-color-secondary-active: rgba(var(--semi-light-blue-7), 1);
    --semi-color-secondary-disabled: rgba(var(--semi-light-blue-2), 1);
    --semi-color-secondary-light-default: rgba(var(--semi-light-blue-0), 1);
    --semi-color-secondary-light-hover: rgba(var(--semi-light-blue-1), 1);
    --semi-color-secondary-light-active: rgba(var(--semi-light-blue-2), 1);
    --semi-color-tertiary: rgba(var(--semi-grey-5), 1);
    --semi-color-tertiary-hover: rgba(var(--semi-grey-6), 1);
    --semi-color-tertiary-active: rgba(var(--semi-grey-7), 1);
    --semi-color-tertiary-light-default: rgba(var(--semi-grey-0), 1);
    --semi-color-tertiary-light-hover: rgba(var(--semi-grey-1), 1);
    --semi-color-tertiary-light-active: rgba(var(--semi-grey-2), 1);
    --semi-color-default: rgba(var(--semi-grey-0), 1);
    --semi-color-default-hover: rgba(var(--semi-grey-1), 1);
    --semi-color-default-active: rgba(var(--semi-grey-2), 1);
    --semi-color-info: rgba(var(--semi-blue-5), 1);
    --semi-color-info-hover: rgba(var(--semi-blue-6), 1);
    --semi-color-info-active: rgba(var(--semi-blue-7), 1);
    --semi-color-info-disabled: rgba(var(--semi-blue-2), 1);
    --semi-color-info-light-default: rgba(var(--semi-blue-0), 1);
    --semi-color-info-light-hover: rgba(var(--semi-blue-1), 1);
    --semi-color-info-light-active: rgba(var(--semi-blue-2), 1);
    --semi-color-success: rgba(var(--semi-green-5), 1);
    --semi-color-success-hover: rgba(var(--semi-green-6), 1);
    --semi-color-success-active: rgba(var(--semi-green-7), 1);
    --semi-color-success-disabled: rgba(var(--semi-green-2), 1);
    --semi-color-success-light-default: rgba(var(--semi-green-0), 1);
    --semi-color-success-light-hover: rgba(var(--semi-green-1), 1);
    --semi-color-success-light-active: rgba(var(--semi-green-2), 1);
    --semi-color-danger: rgba(var(--semi-red-5), 1);
    --semi-color-danger-hover: rgba(var(--semi-red-6), 1);
    --semi-color-danger-active: rgba(var(--semi-red-7), 1);
    --semi-color-danger-light-default: rgba(var(--semi-red-0), 1);
    --semi-color-danger-light-hover: rgba(var(--semi-red-1), 1);
    --semi-color-danger-light-active: rgba(var(--semi-red-2), 1);
    --semi-color-warning: rgba(var(--semi-orange-5), 1);
    --semi-color-warning-hover: rgba(var(--semi-orange-6), 1);
    --semi-color-warning-active: rgba(var(--semi-orange-7), 1);
    --semi-color-warning-light-default: rgba(var(--semi-orange-0), 1);
    --semi-color-warning-light-hover: rgba(var(--semi-orange-1), 1);
    --semi-color-warning-light-active: rgba(var(--semi-orange-2), 1);
    --semi-color-focus-border: rgba(var(--semi-blue-5), 1);
    --semi-color-disabled-text: rgba(var(--semi-grey-9), .35);
    --semi-color-disabled-border: rgba(var(--semi-grey-1), 1);
    --semi-color-disabled-bg: rgba(var(--semi-grey-1), 1);
    --semi-color-disabled-fill: rgba(var(--semi-grey-8), .04);
    --semi-color-shadow: rgba(var(--semi-black), .04);
    --semi-color-link: rgba(var(--semi-blue-5), 1);
    --semi-color-link-hover: rgba(var(--semi-blue-6), 1);
    --semi-color-link-active: rgba(var(--semi-blue-7), 1);
    --semi-color-link-visited: rgba(var(--semi-blue-5), 1);
    --semi-color-border: rgba(var(--semi-grey-9), .08);
    --semi-color-nav-bg: rgba(var(--semi-white), 1);
    --semi-color-overlay-bg: rgba(22, 22, 26, .6);
    --semi-color-fill-0: rgba(var(--semi-grey-8), .05);
    --semi-color-fill-1: rgba(var(--semi-grey-8), .09);
    --semi-color-fill-2: rgba(var(--semi-grey-8), .13);
    --semi-color-bg-0: rgba(var(--semi-white), 1);
    --semi-color-bg-1: rgba(var(--semi-white), 1);
    --semi-color-bg-2: rgba(var(--semi-white), 1);
    --semi-color-bg-3: rgba(var(--semi-white), 1);
    --semi-color-bg-4: rgba(var(--semi-white), 1);
    --semi-color-text-0: rgba(var(--semi-grey-9), 1);
    --semi-color-text-1: rgba(var(--semi-grey-9), .8);
    --semi-color-text-2: rgba(var(--semi-grey-9), .62);
    --semi-color-text-3: rgba(var(--semi-grey-9), .35);
    --semi-shadow-elevated: 0 0 1px rgba(0, 0, 0, .3), 0 4px 14px rgba(0, 0, 0, .1);
    --semi-border-radius-extra-small: 3px;
    --semi-border-radius-small: 3px;
    --semi-border-radius-medium: 6px;
    --semi-border-radius-large: 12px;
    --semi-border-radius-circle: 50%;
    --semi-border-radius-full: 9999px;
    --semi-color-highlight-bg: rgba(var(--semi-yellow-4), 1);
    --semi-color-highlight: rgba(var(--semi-black), 1);
    --semi-color-data-0: #5769ff;
    --semi-color-data-1: #8ed4e7;
    --semi-color-data-2: #f58700;
    --semi-color-data-3: #dcb7fc;
    --semi-color-data-4: #4a9cf7;
    --semi-color-data-5: #f3cc35;
    --semi-color-data-6: #fe8090;
    --semi-color-data-7: #8bd7d2;
    --semi-color-data-8: #83b023;
    --semi-color-data-9: #e9a5e5;
    --semi-color-data-10: #30a7ce;
    --semi-color-data-11: #f9c064;
    --semi-color-data-12: #b171f9;
    --semi-color-data-13: #77b6f9;
    --semi-color-data-14: #c88f02;
    --semi-color-data-15: #ffaab2;
    --semi-color-data-16: #33b0ab;
    --semi-color-data-17: #b6d781;
    --semi-color-data-18: #d458d4;
    --semi-color-data-19: #bcc6ff;
    font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif
}

body[theme-mode=dark],
body .semi-always-dark {
    -webkit-font-smoothing: antialiased;
    --semi-color-white: #e4e7f5;
    --semi-color-black: rgba(var(--semi-black), 1);
    --semi-color-primary: rgba(var(--semi-blue-5), 1);
    --semi-color-primary-hover: rgba(var(--semi-blue-6), 1);
    --semi-color-primary-active: rgba(var(--semi-blue-7), 1);
    --semi-color-primary-disabled: rgba(var(--semi-blue-2), 1);
    --semi-color-primary-light-default: rgba(var(--semi-blue-5), .2);
    --semi-color-primary-light-hover: rgba(var(--semi-blue-5), .3);
    --semi-color-primary-light-active: rgba(var(--semi-blue-5), .4);
    --semi-color-secondary: rgba(var(--semi-light-blue-5), 1);
    --semi-color-secondary-hover: rgba(var(--semi-light-blue-6), 1);
    --semi-color-secondary-active: rgba(var(--semi-light-blue-7), 1);
    --semi-color-secondary-disabled: rgba(var(--semi-light-blue-2), 1);
    --semi-color-secondary-light-default: rgba(var(--semi-light-blue-5), .2);
    --semi-color-secondary-light-hover: rgba(var(--semi-light-blue-5), .3);
    --semi-color-secondary-light-active: rgba(var(--semi-light-blue-5), .4);
    --semi-color-tertiary: rgba(var(--semi-grey-5), 1);
    --semi-color-tertiary-hover: rgba(var(--semi-grey-6), 1);
    --semi-color-tertiary-active: rgba(var(--semi-grey-7), 1);
    --semi-color-tertiary-light-default: rgba(var(--semi-grey-5), .2);
    --semi-color-tertiary-light-hover: rgba(var(--semi-grey-5), .3);
    --semi-color-tertiary-light-active: rgba(var(--semi-grey-5), .4);
    --semi-color-default: rgba(var(--semi-grey-0), 1);
    --semi-color-default-hover: rgba(var(--semi-grey-1), 1);
    --semi-color-default-active: rgba(var(--semi-grey-2), 1);
    --semi-color-info: rgba(var(--semi-blue-5), 1);
    --semi-color-info-hover: rgba(var(--semi-blue-6), 1);
    --semi-color-info-active: rgba(var(--semi-blue-7), 1);
    --semi-color-info-disabled: rgba(var(--semi-blue-2), 1);
    --semi-color-info-light-default: rgba(var(--semi-blue-5), .2);
    --semi-color-info-light-hover: rgba(var(--semi-blue-5), .3);
    --semi-color-info-light-active: rgba(var(--semi-blue-5), .4);
    --semi-color-success: rgba(var(--semi-green-5), 1);
    --semi-color-success-hover: rgba(var(--semi-green-6), 1);
    --semi-color-success-active: rgba(var(--semi-green-7), 1);
    --semi-color-success-disabled: rgba(var(--semi-green-2), 1);
    --semi-color-success-light-default: rgba(var(--semi-green-5), .2);
    --semi-color-success-light-hover: rgba(var(--semi-green-5), .3);
    --semi-color-success-light-active: rgba(var(--semi-green-5), .4);
    --semi-color-danger: rgba(var(--semi-red-5), 1);
    --semi-color-danger-hover: rgba(var(--semi-red-6), 1);
    --semi-color-danger-active: rgba(var(--semi-red-7), 1);
    --semi-color-danger-light-default: rgba(var(--semi-red-5), .2);
    --semi-color-danger-light-hover: rgba(var(--semi-red-5), .3);
    --semi-color-danger-light-active: rgba(var(--semi-red-5), .4);
    --semi-color-warning: rgba(var(--semi-orange-5), 1);
    --semi-color-warning-hover: rgba(var(--semi-orange-6), 1);
    --semi-color-warning-active: rgba(var(--semi-orange-7), 1);
    --semi-color-warning-light-default: rgba(var(--semi-orange-5), .2);
    --semi-color-warning-light-hover: rgba(var(--semi-orange-5), .3);
    --semi-color-warning-light-active: rgba(var(--semi-orange-5), .4);
    --semi-color-focus-border: rgba(var(--semi-blue-5), 1);
    --semi-color-disabled-text: rgba(var(--semi-grey-9), .35);
    --semi-color-disabled-border: rgba(var(--semi-grey-1), 1);
    --semi-color-disabled-bg: rgba(var(--semi-grey-1), 1);
    --semi-color-disabled-fill: rgba(var(--semi-grey-8), .04);
    --semi-color-link: rgba(var(--semi-blue-5), 1);
    --semi-color-link-hover: rgba(var(--semi-blue-6), 1);
    --semi-color-link-active: rgba(var(--semi-blue-7), 1);
    --semi-color-link-visited: rgba(var(--semi-blue-5), 1);
    --semi-color-nav-bg: #232429;
    --semi-shadow-elevated: inset 0 0 0 1px rgba(255, 255, 255, .1), 0 4px 14px rgba(0, 0, 0, .25);
    --semi-color-overlay-bg: rgba(22, 22, 26, .6);
    --semi-color-fill-0: rgba(var(--semi-white), .12);
    --semi-color-fill-1: rgba(var(--semi-white), .16);
    --semi-color-fill-2: rgba(var(--semi-white), .2);
    --semi-color-border: rgba(var(--semi-white), .08);
    --semi-color-shadow: rgba(var(--semi-black), .04);
    --semi-color-bg-0: #16161a;
    --semi-color-bg-1: #232429;
    --semi-color-bg-2: #35363c;
    --semi-color-bg-3: #43444a;
    --semi-color-bg-4: #4f5159;
    --semi-color-text-0: rgba(var(--semi-grey-9), 1);
    --semi-color-text-1: rgba(var(--semi-grey-9), .8);
    --semi-color-text-2: rgba(var(--semi-grey-9), .6);
    --semi-color-text-3: rgba(var(--semi-grey-9), .35);
    --semi-border-radius-extra-small: 3px;
    --semi-border-radius-small: 3px;
    --semi-border-radius-medium: 6px;
    --semi-border-radius-large: 12px;
    --semi-border-radius-circle: 50%;
    --semi-border-radius-full: 9999px;
    --semi-color-highlight-bg: rgba(var(--semi-yellow-2), 1);
    --semi-color-highlight: rgba(var(--semi-white), 1);
    --semi-color-data-0: #5e6dc2;
    --semi-color-data-1: #086878;
    --semi-color-data-2: #faad3f;
    --semi-color-data-3: #4c2b9c;
    --semi-color-data-4: #107df8;
    --semi-color-data-5: #f8ca10;
    --semi-color-data-6: #c31e57;
    --semi-color-data-7: #057773;
    --semi-color-data-8: #9acf0d;
    --semi-color-data-9: #751d8a;
    --semi-color-data-10: #10a2b4;
    --semi-color-data-11: #d06e0b;
    --semi-color-data-12: #7142c5;
    --semi-color-data-13: #0764d4;
    --semi-color-data-14: #fbe86e;
    --semi-color-data-15: #a01349;
    --semi-color-data-16: #0bb3a7;
    --semi-color-data-17: #628a06;
    --semi-color-data-18: #a230b3;
    --semi-color-data-19: #28338a;
    font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif
}

:host([theme-mode=dark]) {
    -webkit-font-smoothing: antialiased;
    --semi-color-white: #e4e7f5;
    --semi-color-black: rgba(var(--semi-black), 1);
    --semi-color-primary: rgba(var(--semi-blue-5), 1);
    --semi-color-primary-hover: rgba(var(--semi-blue-6), 1);
    --semi-color-primary-active: rgba(var(--semi-blue-7), 1);
    --semi-color-primary-disabled: rgba(var(--semi-blue-2), 1);
    --semi-color-primary-light-default: rgba(var(--semi-blue-5), .2);
    --semi-color-primary-light-hover: rgba(var(--semi-blue-5), .3);
    --semi-color-primary-light-active: rgba(var(--semi-blue-5), .4);
    --semi-color-secondary: rgba(var(--semi-light-blue-5), 1);
    --semi-color-secondary-hover: rgba(var(--semi-light-blue-6), 1);
    --semi-color-secondary-active: rgba(var(--semi-light-blue-7), 1);
    --semi-color-secondary-disabled: rgba(var(--semi-light-blue-2), 1);
    --semi-color-secondary-light-default: rgba(var(--semi-light-blue-5), .2);
    --semi-color-secondary-light-hover: rgba(var(--semi-light-blue-5), .3);
    --semi-color-secondary-light-active: rgba(var(--semi-light-blue-5), .4);
    --semi-color-tertiary: rgba(var(--semi-grey-5), 1);
    --semi-color-tertiary-hover: rgba(var(--semi-grey-6), 1);
    --semi-color-tertiary-active: rgba(var(--semi-grey-7), 1);
    --semi-color-tertiary-light-default: rgba(var(--semi-grey-5), .2);
    --semi-color-tertiary-light-hover: rgba(var(--semi-grey-5), .3);
    --semi-color-tertiary-light-active: rgba(var(--semi-grey-5), .4);
    --semi-color-default: rgba(var(--semi-grey-0), 1);
    --semi-color-default-hover: rgba(var(--semi-grey-1), 1);
    --semi-color-default-active: rgba(var(--semi-grey-2), 1);
    --semi-color-info: rgba(var(--semi-blue-5), 1);
    --semi-color-info-hover: rgba(var(--semi-blue-6), 1);
    --semi-color-info-active: rgba(var(--semi-blue-7), 1);
    --semi-color-info-disabled: rgba(var(--semi-blue-2), 1);
    --semi-color-info-light-default: rgba(var(--semi-blue-5), .2);
    --semi-color-info-light-hover: rgba(var(--semi-blue-5), .3);
    --semi-color-info-light-active: rgba(var(--semi-blue-5), .4);
    --semi-color-success: rgba(var(--semi-green-5), 1);
    --semi-color-success-hover: rgba(var(--semi-green-6), 1);
    --semi-color-success-active: rgba(var(--semi-green-7), 1);
    --semi-color-success-disabled: rgba(var(--semi-green-2), 1);
    --semi-color-success-light-default: rgba(var(--semi-green-5), .2);
    --semi-color-success-light-hover: rgba(var(--semi-green-5), .3);
    --semi-color-success-light-active: rgba(var(--semi-green-5), .4);
    --semi-color-danger: rgba(var(--semi-red-5), 1);
    --semi-color-danger-hover: rgba(var(--semi-red-6), 1);
    --semi-color-danger-active: rgba(var(--semi-red-7), 1);
    --semi-color-danger-light-default: rgba(var(--semi-red-5), .2);
    --semi-color-danger-light-hover: rgba(var(--semi-red-5), .3);
    --semi-color-danger-light-active: rgba(var(--semi-red-5), .4);
    --semi-color-warning: rgba(var(--semi-orange-5), 1);
    --semi-color-warning-hover: rgba(var(--semi-orange-6), 1);
    --semi-color-warning-active: rgba(var(--semi-orange-7), 1);
    --semi-color-warning-light-default: rgba(var(--semi-orange-5), .2);
    --semi-color-warning-light-hover: rgba(var(--semi-orange-5), .3);
    --semi-color-warning-light-active: rgba(var(--semi-orange-5), .4);
    --semi-color-focus-border: rgba(var(--semi-blue-5), 1);
    --semi-color-disabled-text: rgba(var(--semi-grey-9), .35);
    --semi-color-disabled-border: rgba(var(--semi-grey-1), 1);
    --semi-color-disabled-bg: rgba(var(--semi-grey-1), 1);
    --semi-color-disabled-fill: rgba(var(--semi-grey-8), .04);
    --semi-color-link: rgba(var(--semi-blue-5), 1);
    --semi-color-link-hover: rgba(var(--semi-blue-6), 1);
    --semi-color-link-active: rgba(var(--semi-blue-7), 1);
    --semi-color-link-visited: rgba(var(--semi-blue-5), 1);
    --semi-color-nav-bg: #232429;
    --semi-shadow-elevated: inset 0 0 0 1px rgba(255, 255, 255, .1), 0 4px 14px rgba(0, 0, 0, .25);
    --semi-color-overlay-bg: rgba(22, 22, 26, .6);
    --semi-color-fill-0: rgba(var(--semi-white), .12);
    --semi-color-fill-1: rgba(var(--semi-white), .16);
    --semi-color-fill-2: rgba(var(--semi-white), .2);
    --semi-color-border: rgba(var(--semi-white), .08);
    --semi-color-shadow: rgba(var(--semi-black), .04);
    --semi-color-bg-0: #16161a;
    --semi-color-bg-1: #232429;
    --semi-color-bg-2: #35363c;
    --semi-color-bg-3: #43444a;
    --semi-color-bg-4: #4f5159;
    --semi-color-text-0: rgba(var(--semi-grey-9), 1);
    --semi-color-text-1: rgba(var(--semi-grey-9), .8);
    --semi-color-text-2: rgba(var(--semi-grey-9), .6);
    --semi-color-text-3: rgba(var(--semi-grey-9), .35);
    --semi-border-radius-extra-small: 3px;
    --semi-border-radius-small: 3px;
    --semi-border-radius-medium: 6px;
    --semi-border-radius-large: 12px;
    --semi-border-radius-circle: 50%;
    --semi-border-radius-full: 9999px;
    --semi-color-highlight-bg: rgba(var(--semi-yellow-2), 1);
    --semi-color-highlight: rgba(var(--semi-white), 1);
    --semi-color-data-0: #5e6dc2;
    --semi-color-data-1: #086878;
    --semi-color-data-2: #faad3f;
    --semi-color-data-3: #4c2b9c;
    --semi-color-data-4: #107df8;
    --semi-color-data-5: #f8ca10;
    --semi-color-data-6: #c31e57;
    --semi-color-data-7: #057773;
    --semi-color-data-8: #9acf0d;
    --semi-color-data-9: #751d8a;
    --semi-color-data-10: #10a2b4;
    --semi-color-data-11: #d06e0b;
    --semi-color-data-12: #7142c5;
    --semi-color-data-13: #0764d4;
    --semi-color-data-14: #fbe86e;
    --semi-color-data-15: #a01349;
    --semi-color-data-16: #0bb3a7;
    --semi-color-data-17: #628a06;
    --semi-color-data-18: #a230b3;
    --semi-color-data-19: #28338a;
    font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif
}

:host .semi-always-dark {
    -webkit-font-smoothing: antialiased;
    --semi-color-white: #e4e7f5;
    --semi-color-black: rgba(var(--semi-black), 1);
    --semi-color-primary: rgba(var(--semi-blue-5), 1);
    --semi-color-primary-hover: rgba(var(--semi-blue-6), 1);
    --semi-color-primary-active: rgba(var(--semi-blue-7), 1);
    --semi-color-primary-disabled: rgba(var(--semi-blue-2), 1);
    --semi-color-primary-light-default: rgba(var(--semi-blue-5), .2);
    --semi-color-primary-light-hover: rgba(var(--semi-blue-5), .3);
    --semi-color-primary-light-active: rgba(var(--semi-blue-5), .4);
    --semi-color-secondary: rgba(var(--semi-light-blue-5), 1);
    --semi-color-secondary-hover: rgba(var(--semi-light-blue-6), 1);
    --semi-color-secondary-active: rgba(var(--semi-light-blue-7), 1);
    --semi-color-secondary-disabled: rgba(var(--semi-light-blue-2), 1);
    --semi-color-secondary-light-default: rgba(var(--semi-light-blue-5), .2);
    --semi-color-secondary-light-hover: rgba(var(--semi-light-blue-5), .3);
    --semi-color-secondary-light-active: rgba(var(--semi-light-blue-5), .4);
    --semi-color-tertiary: rgba(var(--semi-grey-5), 1);
    --semi-color-tertiary-hover: rgba(var(--semi-grey-6), 1);
    --semi-color-tertiary-active: rgba(var(--semi-grey-7), 1);
    --semi-color-tertiary-light-default: rgba(var(--semi-grey-5), .2);
    --semi-color-tertiary-light-hover: rgba(var(--semi-grey-5), .3);
    --semi-color-tertiary-light-active: rgba(var(--semi-grey-5), .4);
    --semi-color-default: rgba(var(--semi-grey-0), 1);
    --semi-color-default-hover: rgba(var(--semi-grey-1), 1);
    --semi-color-default-active: rgba(var(--semi-grey-2), 1);
    --semi-color-info: rgba(var(--semi-blue-5), 1);
    --semi-color-info-hover: rgba(var(--semi-blue-6), 1);
    --semi-color-info-active: rgba(var(--semi-blue-7), 1);
    --semi-color-info-disabled: rgba(var(--semi-blue-2), 1);
    --semi-color-info-light-default: rgba(var(--semi-blue-5), .2);
    --semi-color-info-light-hover: rgba(var(--semi-blue-5), .3);
    --semi-color-info-light-active: rgba(var(--semi-blue-5), .4);
    --semi-color-success: rgba(var(--semi-green-5), 1);
    --semi-color-success-hover: rgba(var(--semi-green-6), 1);
    --semi-color-success-active: rgba(var(--semi-green-7), 1);
    --semi-color-success-disabled: rgba(var(--semi-green-2), 1);
    --semi-color-success-light-default: rgba(var(--semi-green-5), .2);
    --semi-color-success-light-hover: rgba(var(--semi-green-5), .3);
    --semi-color-success-light-active: rgba(var(--semi-green-5), .4);
    --semi-color-danger: rgba(var(--semi-red-5), 1);
    --semi-color-danger-hover: rgba(var(--semi-red-6), 1);
    --semi-color-danger-active: rgba(var(--semi-red-7), 1);
    --semi-color-danger-light-default: rgba(var(--semi-red-5), .2);
    --semi-color-danger-light-hover: rgba(var(--semi-red-5), .3);
    --semi-color-danger-light-active: rgba(var(--semi-red-5), .4);
    --semi-color-warning: rgba(var(--semi-orange-5), 1);
    --semi-color-warning-hover: rgba(var(--semi-orange-6), 1);
    --semi-color-warning-active: rgba(var(--semi-orange-7), 1);
    --semi-color-warning-light-default: rgba(var(--semi-orange-5), .2);
    --semi-color-warning-light-hover: rgba(var(--semi-orange-5), .3);
    --semi-color-warning-light-active: rgba(var(--semi-orange-5), .4);
    --semi-color-focus-border: rgba(var(--semi-blue-5), 1);
    --semi-color-disabled-text: rgba(var(--semi-grey-9), .35);
    --semi-color-disabled-border: rgba(var(--semi-grey-1), 1);
    --semi-color-disabled-bg: rgba(var(--semi-grey-1), 1);
    --semi-color-disabled-fill: rgba(var(--semi-grey-8), .04);
    --semi-color-link: rgba(var(--semi-blue-5), 1);
    --semi-color-link-hover: rgba(var(--semi-blue-6), 1);
    --semi-color-link-active: rgba(var(--semi-blue-7), 1);
    --semi-color-link-visited: rgba(var(--semi-blue-5), 1);
    --semi-color-nav-bg: #232429;
    --semi-shadow-elevated: inset 0 0 0 1px rgba(255, 255, 255, .1), 0 4px 14px rgba(0, 0, 0, .25);
    --semi-color-overlay-bg: rgba(22, 22, 26, .6);
    --semi-color-fill-0: rgba(var(--semi-white), .12);
    --semi-color-fill-1: rgba(var(--semi-white), .16);
    --semi-color-fill-2: rgba(var(--semi-white), .2);
    --semi-color-border: rgba(var(--semi-white), .08);
    --semi-color-shadow: rgba(var(--semi-black), .04);
    --semi-color-bg-0: #16161a;
    --semi-color-bg-1: #232429;
    --semi-color-bg-2: #35363c;
    --semi-color-bg-3: #43444a;
    --semi-color-bg-4: #4f5159;
    --semi-color-text-0: rgba(var(--semi-grey-9), 1);
    --semi-color-text-1: rgba(var(--semi-grey-9), .8);
    --semi-color-text-2: rgba(var(--semi-grey-9), .6);
    --semi-color-text-3: rgba(var(--semi-grey-9), .35);
    --semi-border-radius-extra-small: 3px;
    --semi-border-radius-small: 3px;
    --semi-border-radius-medium: 6px;
    --semi-border-radius-large: 12px;
    --semi-border-radius-circle: 50%;
    --semi-border-radius-full: 9999px;
    --semi-color-highlight-bg: rgba(var(--semi-yellow-2), 1);
    --semi-color-highlight: rgba(var(--semi-white), 1);
    --semi-color-data-0: #5e6dc2;
    --semi-color-data-1: #086878;
    --semi-color-data-2: #faad3f;
    --semi-color-data-3: #4c2b9c;
    --semi-color-data-4: #107df8;
    --semi-color-data-5: #f8ca10;
    --semi-color-data-6: #c31e57;
    --semi-color-data-7: #057773;
    --semi-color-data-8: #9acf0d;
    --semi-color-data-9: #751d8a;
    --semi-color-data-10: #10a2b4;
    --semi-color-data-11: #d06e0b;
    --semi-color-data-12: #7142c5;
    --semi-color-data-13: #0764d4;
    --semi-color-data-14: #fbe86e;
    --semi-color-data-15: #a01349;
    --semi-color-data-16: #0bb3a7;
    --semi-color-data-17: #628a06;
    --semi-color-data-18: #a230b3;
    --semi-color-data-19: #28338a;
    font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif
}

.semi-light-scrollbar::-webkit-scrollbar {
    width: 8px;
    height: 8px
}

.semi-light-scrollbar ::-webkit-scrollbar {
    width: 8px;
    height: 8px
}

.semi-light-scrollbar::-webkit-scrollbar-track {
    background: 0 0
}

.semi-light-scrollbar ::-webkit-scrollbar-track {
    background: 0 0
}

.semi-light-scrollbar::-webkit-scrollbar-corner {
    background-color: transparent
}

.semi-light-scrollbar ::-webkit-scrollbar-corner {
    background-color: transparent
}

.semi-light-scrollbar::-webkit-scrollbar-thumb {
    background: 0 0;
    border-radius: 6px;
    transition: all 1s
}

.semi-light-scrollbar ::-webkit-scrollbar-thumb {
    background: 0 0;
    border-radius: 6px;
    transition: all 1s
}

.semi-light-scrollbar:hover::-webkit-scrollbar-thumb {
    background: var(--semi-color-fill-2)
}

.semi-light-scrollbar :hover::-webkit-scrollbar-thumb {
    background: var(--semi-color-fill-2)
}

.semi-light-scrollbar::-webkit-scrollbar-thumb:hover {
    background: var(--semi-color-fill-1)
}

.semi-light-scrollbar ::-webkit-scrollbar-thumb:hover {
    background: var(--semi-color-fill-1)
}

@layer base {
    .semi-backtop {
        box-sizing: border-box;
        z-index: 10;
        cursor: pointer;
        text-align: center;
        position: fixed;
        bottom: 50px;
        right: 100px;
        overflow: hidden
    }

    .semi-rtl .semi-backtop,
    .semi-portal-rtl .semi-backtop {
        direction: rtl;
        left: 100px;
        right: auto
    }
}

@layer base {
    .semi-button-split {
        display: inline-block
    }

    .semi-button-split .semi-button {
        border-radius: 0;
        margin-right: 1px
    }

    .semi-button-split .semi-button-first {
        border-top-left-radius: var(--semi-border-radius-small);
        border-bottom-left-radius: var(--semi-border-radius-small)
    }

    .semi-button-split .semi-button-last {
        border-top-right-radius: var(--semi-border-radius-small);
        border-bottom-right-radius: var(--semi-border-radius-small);
        margin-right: unset
    }

    .semi-button-split:hover .semi-button-borderless:active {
        background-color: var(--semi-color-fill-1)
    }

    .semi-button {
        box-shadow: none;
        cursor: pointer;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        border-radius: var(--semi-border-radius-small);
        vertical-align: middle;
        white-space: nowrap;
        border: 0 solid transparent;
        outline: none;
        justify-content: center;
        align-items: center;
        height: 32px;
        padding: 6px 12px;
        font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif;
        font-size: 14px;
        font-weight: 600;
        line-height: 20px;
        display: inline-flex
    }

    .semi-button.semi-button-primary:focus-visible {
        outline: 2px solid var(--semi-color-primary-light-active)
    }

    .semi-button.semi-button-secondary:focus-visible {
        outline: 2px solid var(--semi-color-primary-light-active)
    }

    .semi-button.semi-button-tertiary:focus-visible {
        outline: 2px solid var(--semi-color-primary-light-active)
    }

    .semi-button.semi-button-warning:focus-visible {
        outline: 2px solid var(--semi-color-primary-light-active)
    }

    .semi-button.semi-button-danger:focus-visible {
        outline: 2px solid var(--semi-color-primary-light-active)
    }

    .semi-button-content {
        align-items: center;
        display: flex
    }

    .semi-button-danger {
        background-color: var(--semi-color-danger);
        color: rgba(var(--semi-white), 1);
        transition: background-color var(--semi-transition_duration-none)var(--semi-transition_function-easeIn)var(--semi-transition_delay-none), border var(--semi-transition_duration-none)var(--semi-transition_function-easeIn)var(--semi-transition_delay-none);
        transform: scale(var(--semi-transform_scale-none))
    }

    .semi-button-danger-disabled {
        background-color: var(--semi-color-disabled-bg)
    }

    .semi-button-danger-disabled.semi-button-outline {
        border: 1px solid var(--semi-color-border);
        background-color: transparent
    }

    .semi-button-danger-disabled.semi-button-light {
        background-color: var(--semi-color-fill-0)
    }

    .semi-button-danger:hover {
        background-color: var(--semi-color-danger-hover)
    }

    .semi-button-danger:active {
        background-color: var(--semi-color-danger-active)
    }

    .semi-button-danger.semi-button-outline {
        border: 1px solid var(--semi-color-danger);
        background-color: transparent
    }

    .semi-button-danger.semi-button-light,
    .semi-button-danger.semi-button-outline,
    .semi-button-danger.semi-button-borderless {
        color: var(--semi-color-danger)
    }

    .semi-button-danger:not(.semi-button-borderless):not(.semi-button-light):focus-visible {
        outline: 2px solid var(--semi-color-danger-light-active)
    }

    .semi-button-warning {
        background-color: var(--semi-color-warning);
        color: rgba(var(--semi-white), 1);
        transition: background-color var(--semi-transition_duration-none)var(--semi-transition_function-easeIn)var(--semi-transition_delay-none), border var(--semi-transition_duration-none)var(--semi-transition_function-easeIn)var(--semi-transition_delay-none);
        transform: scale(var(--semi-transform_scale-none))
    }

    .semi-button-warning-disabled {
        background-color: var(--semi-color-disabled-bg)
    }

    .semi-button-warning-disabled.semi-button-outline {
        border: 1px solid var(--semi-color-border);
        background-color: transparent
    }

    .semi-button-warning-disabled.semi-button-light {
        background-color: var(--semi-color-fill-0)
    }

    .semi-button-warning:hover {
        background-color: var(--semi-color-warning-hover)
    }

    .semi-button-warning:active {
        background-color: var(--semi-color-warning-active)
    }

    .semi-button-warning.semi-button-outline {
        border: 1px solid var(--semi-color-warning);
        background-color: transparent
    }

    .semi-button-warning.semi-button-light,
    .semi-button-warning.semi-button-outline,
    .semi-button-warning.semi-button-borderless {
        color: var(--semi-color-warning)
    }

    .semi-button-warning:not(.semi-button-borderless):not(.semi-button-light):focus-visible {
        outline: 2px solid var(--semi-color-warning-light-active)
    }

    .semi-button-tertiary {
        background-color: var(--semi-color-tertiary);
        color: rgba(var(--semi-white), 1);
        transition: background-color var(--semi-transition_duration-none)var(--semi-transition_function-easeIn)var(--semi-transition_delay-none), border var(--semi-transition_duration-none)var(--semi-transition_function-easeIn)var(--semi-transition_delay-none);
        transform: scale(var(--semi-transform_scale-none))
    }

    .semi-button-tertiary-disabled {
        background-color: var(--semi-color-disabled-bg)
    }

    .semi-button-tertiary-disabled.semi-button-outline {
        border: 1px solid var(--semi-color-border);
        background-color: transparent
    }

    .semi-button-tertiary-disabled.semi-button-light {
        background-color: var(--semi-color-fill-0)
    }

    .semi-button-tertiary:hover {
        background-color: var(--semi-color-tertiary-hover)
    }

    .semi-button-tertiary:active {
        background-color: var(--semi-color-tertiary-active)
    }

    .semi-button-tertiary.semi-button-outline {
        border: 1px solid var(--semi-color-border);
        background-color: transparent
    }

    .semi-button-tertiary.semi-button-light,
    .semi-button-tertiary.semi-button-outline,
    .semi-button-tertiary.semi-button-borderless {
        color: var(--semi-color-text-1)
    }

    .semi-button-primary {
        background-color: var(--semi-color-primary);
        color: rgba(var(--semi-white), 1);
        transition: background-color var(--semi-transition_duration-none)var(--semi-transition_function-easeIn)var(--semi-transition_delay-none), border var(--semi-transition_duration-none)var(--semi-transition_function-easeIn)var(--semi-transition_delay-none);
        transform: scale(var(--semi-transform_scale-none))
    }

    .semi-button-primary-disabled {
        background-color: var(--semi-color-disabled-bg)
    }

    .semi-button-primary-disabled.semi-button-light {
        background: var(--semi-color-fill-0)
    }

    .semi-button-primary-disabled.semi-button-outline {
        border: 1px solid var(--semi-color-border);
        background-color: transparent
    }

    .semi-button-primary:not(.semi-button-borderless):not(.semi-button-light):not(.semi-button-outline):hover {
        background-color: var(--semi-color-primary-hover)
    }

    .semi-button-primary.semi-button-outline {
        border: 1px solid var(--semi-color-border);
        background-color: transparent
    }

    .semi-button-primary:not(.semi-button-borderless):not(.semi-button-light):not(.semi-button-outline):active {
        background-color: var(--semi-color-primary-active)
    }

    .semi-button-primary.semi-button-light,
    .semi-button-primary.semi-button-outline,
    .semi-button-primary.semi-button-borderless {
        color: var(--semi-color-primary)
    }

    .semi-button-secondary {
        background-color: var(--semi-color-secondary);
        outline-color: var(--semi-color-secondary);
        color: rgba(var(--semi-white), 1);
        transition: background-color var(--semi-transition_duration-none)var(--semi-transition_function-easeIn)var(--semi-transition_delay-none), border var(--semi-transition_duration-none)var(--semi-transition_function-easeIn)var(--semi-transition_delay-none);
        transform: scale(var(--semi-transform_scale-none))
    }

    .semi-button-secondary-disabled {
        background-color: var(--semi-color-disabled-bg)
    }

    .semi-button-secondary-disabled.semi-button-outline {
        border: 1px solid var(--semi-color-border);
        background-color: transparent
    }

    .semi-button-secondary-disabled.semi-button-light {
        background-color: var(--semi-color-fill-0)
    }

    .semi-button-secondary.semi-button-outline {
        border: 1px solid var(--semi-color-border);
        background-color: transparent
    }

    .semi-button-secondary:hover {
        background-color: var(--semi-color-secondary-hover)
    }

    .semi-button-secondary:active {
        background-color: var(--semi-color-secondary-active)
    }

    .semi-button-secondary.semi-button-light,
    .semi-button-secondary.semi-button-outline,
    .semi-button-secondary.semi-button-borderless {
        color: var(--semi-color-secondary)
    }

    .semi-button-disabled {
        color: var(--semi-color-disabled-text);
        cursor: not-allowed
    }

    .semi-button-disabled:not(.semi-button-borderless):not(.semi-button-light):hover,
    .semi-button-disabled.semi-button-light,
    .semi-button-disabled.semi-button-borderless {
        color: var(--semi-color-disabled-text)
    }

    .semi-button-borderless {
        transition: background-color var(--semi-transition_duration-none)var(--semi-transition_function-easeIn)var(--semi-transition_delay-none);
        transform: scale(var(--semi-transform_scale-none));
        background-color: transparent;
        border: 0 solid transparent
    }

    .semi-button-borderless:not(.semi-button-disabled):hover {
        background-color: var(--semi-color-fill-0);
        border: 0 solid transparent
    }

    .semi-button-borderless:not(.semi-button-disabled):active {
        background-color: var(--semi-color-fill-1);
        border: 0 solid transparent
    }

    .semi-button-outline {
        background-color: transparent
    }

    .semi-button-outline:not(.semi-button-disabled):hover {
        background-color: var(--semi-color-fill-0)
    }

    .semi-button-outline:not(.semi-button-disabled):active {
        background-color: var(--semi-color-fill-1)
    }

    .semi-button-light {
        background-color: var(--semi-color-fill-0);
        transition: background-color var(--semi-transition_duration-none)var(--semi-transition_function-easeIn)var(--semi-transition_delay-none), border var(--semi-transition_duration-none)var(--semi-transition_function-easeIn)var(--semi-transition_delay-none);
        transform: scale(var(--semi-transform_scale-none));
        border: 0 solid transparent
    }

    .semi-button-light:not(.semi-button-disabled):hover {
        background-color: var(--semi-color-fill-1);
        border: 0 solid transparent
    }

    .semi-button-light:not(.semi-button-disabled):active {
        background-color: var(--semi-color-fill-2);
        border: 0 solid transparent
    }

    .semi-button-size-small {
        height: 24px;
        padding: 2px 12px
    }

    .semi-button-size-large {
        height: 40px;
        padding: 10px 16px
    }

    .semi-button-block {
        width: 100%
    }

    .semi-button-group {
        flex-wrap: wrap;
        display: flex
    }

    .semi-button-group>.semi-button {
        border-radius: 0;
        margin: 0;
        padding-left: 0;
        padding-right: 0
    }

    .semi-button-group>.semi-button .semi-button-content {
        padding-left: 12px;
        padding-right: 12px
    }

    .semi-button-group>.semi-button-size-large .semi-button-content {
        padding-left: 16px;
        padding-right: 16px
    }

    .semi-button-group>.semi-button-size-small .semi-button-content {
        padding-left: 12px;
        padding-right: 12px
    }

    .semi-button-group>.semi-button.semi-button-with-icon-only {
        padding-left: 0;
        padding-right: 0
    }

    .semi-button-group>.semi-button.semi-button-with-icon-only .semi-button-content {
        padding-left: 8px;
        padding-right: 8px
    }

    .semi-button-group>.semi-button.semi-button-with-icon-only.semi-button-size-small .semi-button-content {
        padding-left: 4px;
        padding-right: 4px
    }

    .semi-button-group>.semi-button.semi-button-with-icon-only.semi-button-size-large .semi-button-content {
        padding-left: 12px;
        padding-right: 12px
    }

    .semi-button-group>.semi-button:first-child {
        border-top-left-radius: var(--semi-border-radius-small);
        border-bottom-left-radius: var(--semi-border-radius-small)
    }

    .semi-button-group>.semi-button:last-child {
        border-top-right-radius: var(--semi-border-radius-small);
        border-bottom-right-radius: var(--semi-border-radius-small)
    }

    .semi-button-group>.semi-button-outline:not(:last-child) {
        border-right-color: transparent;
        margin-right: -1px
    }

    .semi-button-group-line {
        background-color: var(--semi-color-border);
        align-items: center;
        display: inline-flex
    }

    .semi-button-group-line-primary {
        background-color: var(--semi-color-primary)
    }

    .semi-button-group-line-secondary {
        background-color: var(--semi-color-secondary)
    }

    .semi-button-group-line-tertiary {
        background-color: var(--semi-color-tertiary)
    }

    .semi-button-group-line-warning {
        background-color: var(--semi-color-warning)
    }

    .semi-button-group-line-danger {
        background-color: var(--semi-color-danger)
    }

    .semi-button-group-line-disabled {
        background-color: var(--semi-color-disabled-bg)
    }

    .semi-button-group-line-light {
        background-color: var(--semi-color-fill-0)
    }

    .semi-button-group-line-borderless {
        background-color: transparent
    }

    .semi-button-group-line:before {
        content: "";
        background-color: var(--semi-color-border);
        width: 1px;
        height: 20px;
        display: block
    }

    .semi-rtl .semi-button,
    .semi-portal-rtl .semi-button {
        direction: rtl;
        padding-left: 12px;
        padding-right: 12px
    }

    .semi-rtl .semi-button-size-small,
    .semi-portal-rtl .semi-button-size-small {
        padding-left: 12px;
        padding-right: 12px
    }

    .semi-rtl .semi-button-size-large,
    .semi-portal-rtl .semi-button-size-large {
        padding-left: 16px;
        padding-right: 16px
    }

    .semi-rtl .semi-button-group,
    .semi-portal-rtl .semi-button-group {
        direction: rtl
    }

    .semi-rtl .semi-button-group>.semi-button,
    .semi-portal-rtl .semi-button-group>.semi-button {
        padding-left: 0;
        padding-right: 0
    }

    .semi-rtl .semi-button-group>.semi-button .semi-button-content,
    .semi-portal-rtl .semi-button-group>.semi-button .semi-button-content {
        padding-left: 12px;
        padding-right: 12px
    }

    .semi-rtl .semi-button-group>.semi-button-size-large .semi-button-content,
    .semi-portal-rtl .semi-button-group>.semi-button-size-large .semi-button-content {
        padding-left: 16px;
        padding-right: 16px
    }

    .semi-rtl .semi-button-group>.semi-button-size-small .semi-button-content,
    .semi-portal-rtl .semi-button-group>.semi-button-size-small .semi-button-content {
        padding-left: 12px;
        padding-right: 12px
    }

    .semi-rtl .semi-button-group>.semi-button.semi-button-with-icon-only,
    .semi-portal-rtl .semi-button-group>.semi-button.semi-button-with-icon-only {
        padding-left: 0;
        padding-right: 0
    }

    .semi-rtl .semi-button-group>.semi-button.semi-button-with-icon-only .semi-button-content,
    .semi-portal-rtl .semi-button-group>.semi-button.semi-button-with-icon-only .semi-button-content {
        padding-left: 8px;
        padding-right: 8px
    }

    .semi-rtl .semi-button-group>.semi-button.semi-button-with-icon-only.semi-button-size-small .semi-button-content,
    .semi-portal-rtl .semi-button-group>.semi-button.semi-button-with-icon-only.semi-button-size-small .semi-button-content {
        padding-left: 4px;
        padding-right: 4px
    }

    .semi-rtl .semi-button-group>.semi-button.semi-button-with-icon-only.semi-button-size-large .semi-button-content,
    .semi-portal-rtl .semi-button-group>.semi-button.semi-button-with-icon-only.semi-button-size-large .semi-button-content {
        padding-left: 12px;
        padding-right: 12px
    }

    .semi-rtl .semi-button-group>.semi-button:first-child,
    .semi-portal-rtl .semi-button-group>.semi-button:first-child {
        border-top-left-radius: 0;
        border-bottom-left-radius: 0;
        border-top-right-radius: var(--semi-border-radius-small);
        border-bottom-right-radius: var(--semi-border-radius-small)
    }

    .semi-rtl .semi-button-group>.semi-button:not(:last-child) .semi-button-content,
    .semi-portal-rtl .semi-button-group>.semi-button:not(:last-child) .semi-button-content {
        border-left: 1px var(--semi-color-border)solid;
        border-right: 0
    }

    .semi-rtl .semi-button-group>.semi-button:last-child,
    .semi-portal-rtl .semi-button-group>.semi-button:last-child {
        border-top-right-radius: 0;
        border-bottom-right-radius: 0;
        border-top-left-radius: var(--semi-border-radius-small);
        border-bottom-left-radius: var(--semi-border-radius-small)
    }

    .semi-rtl .semi-button.semi-button-with-icon-only,
    .semi-portal-rtl .semi-button.semi-button-with-icon-only {
        padding-left: 8px;
        padding-right: 8px
    }

    .semi-rtl .semi-button.semi-button-with-icon-only.semi-button-size-small,
    .semi-portal-rtl .semi-button.semi-button-with-icon-only.semi-button-size-small {
        padding-left: 4px;
        padding-right: 4px
    }

    .semi-rtl .semi-button.semi-button-with-icon-only.semi-button-size-large,
    .semi-portal-rtl .semi-button.semi-button-with-icon-only.semi-button-size-large {
        padding-left: 12px;
        padding-right: 12px
    }

    .semi-rtl .semi-button-content-left,
    .semi-portal-rtl .semi-button-content-left {
        margin-left: 8px;
        margin-right: 0
    }

    .semi-rtl .semi-button-content-right,
    .semi-portal-rtl .semi-button-content-right {
        margin-left: 0;
        margin-right: 8px
    }
}







@layer base {
    @keyframes semi-animation-rotate {
        0% {
            transform: rotate(0)
        }

        to {
            transform: rotate(360deg)
        }
    }

    .semi-button.semi-button-with-icon {
        align-items: center;
        display: inline-flex
    }

    .semi-button.semi-button-with-icon .semi-button-content {
        justify-content: center;
        align-items: center;
        display: flex
    }

    .semi-button.semi-button-loading {
        pointer-events: none;
        cursor: not-allowed
    }

    .semi-button.semi-button-loading .semi-button-content>svg {
        width: 16px;
        height: 16px;
        animation: .6s linear infinite forwards semi-animation-rotate
    }

    .semi-button.semi-button-with-icon-only {
        justify-content: center;
        align-items: center;
        width: 32px;
        height: 32px;
        padding: 8px
    }

    .semi-button.semi-button-with-icon-only.semi-button-size-small {
        width: 24px;
        height: 24px;
        padding: 4px
    }

    .semi-button.semi-button-with-icon-only.semi-button-size-large {
        width: 40px;
        height: 40px;
        padding: 12px
    }

    .semi-button-content-left {
        align-items: center;
        margin-right: 8px;
        display: flex
    }

    .semi-button-content-right {
        align-items: center;
        margin-left: 8px;
        display: flex
    }

    .semi-rtl .semi-button,
    .semi-portal-rtl .semi-button {
        direction: rtl;
        padding-left: 12px;
        padding-right: 12px
    }

    .semi-rtl .semi-button-size-small,
    .semi-portal-rtl .semi-button-size-small {
        padding-left: 12px;
        padding-right: 12px
    }

    .semi-rtl .semi-button-size-large,
    .semi-portal-rtl .semi-button-size-large {
        padding-left: 16px;
        padding-right: 16px
    }

    .semi-rtl .semi-button-group,
    .semi-portal-rtl .semi-button-group {
        direction: rtl
    }

    .semi-rtl .semi-button-group>.semi-button,
    .semi-portal-rtl .semi-button-group>.semi-button {
        padding-left: 0;
        padding-right: 0
    }

    .semi-rtl .semi-button-group>.semi-button .semi-button-content,
    .semi-portal-rtl .semi-button-group>.semi-button .semi-button-content {
        padding-left: 12px;
        padding-right: 12px
    }

    .semi-rtl .semi-button-group>.semi-button-size-large .semi-button-content,
    .semi-portal-rtl .semi-button-group>.semi-button-size-large .semi-button-content {
        padding-left: 16px;
        padding-right: 16px
    }

    .semi-rtl .semi-button-group>.semi-button-size-small .semi-button-content,
    .semi-portal-rtl .semi-button-group>.semi-button-size-small .semi-button-content {
        padding-left: 12px;
        padding-right: 12px
    }

    .semi-rtl .semi-button-group>.semi-button.semi-button-with-icon-only,
    .semi-portal-rtl .semi-button-group>.semi-button.semi-button-with-icon-only {
        padding-left: 0;
        padding-right: 0
    }

    .semi-rtl .semi-button-group>.semi-button.semi-button-with-icon-only .semi-button-content,
    .semi-portal-rtl .semi-button-group>.semi-button.semi-button-with-icon-only .semi-button-content {
        padding-left: 8px;
        padding-right: 8px
    }

    .semi-rtl .semi-button-group>.semi-button.semi-button-with-icon-only.semi-button-size-small .semi-button-content,
    .semi-portal-rtl .semi-button-group>.semi-button.semi-button-with-icon-only.semi-button-size-small .semi-button-content {
        padding-left: 4px;
        padding-right: 4px
    }

    .semi-rtl .semi-button-group>.semi-button.semi-button-with-icon-only.semi-button-size-large .semi-button-content,
    .semi-portal-rtl .semi-button-group>.semi-button.semi-button-with-icon-only.semi-button-size-large .semi-button-content {
        padding-left: 12px;
        padding-right: 12px
    }

    .semi-rtl .semi-button-group>.semi-button:first-child,
    .semi-portal-rtl .semi-button-group>.semi-button:first-child {
        border-top-left-radius: 0;
        border-bottom-left-radius: 0;
        border-top-right-radius: var(--semi-border-radius-small);
        border-bottom-right-radius: var(--semi-border-radius-small)
    }

    .semi-rtl .semi-button-group>.semi-button:not(:last-child) .semi-button-content,
    .semi-portal-rtl .semi-button-group>.semi-button:not(:last-child) .semi-button-content {
        border-left: 1px var(--semi-color-border)solid;
        border-right: 0
    }

    .semi-rtl .semi-button-group>.semi-button:last-child,
    .semi-portal-rtl .semi-button-group>.semi-button:last-child {
        border-top-right-radius: 0;
        border-bottom-right-radius: 0;
        border-top-left-radius: var(--semi-border-radius-small);
        border-bottom-left-radius: var(--semi-border-radius-small)
    }

    .semi-rtl .semi-button.semi-button-with-icon-only,
    .semi-portal-rtl .semi-button.semi-button-with-icon-only {
        padding-left: 8px;
        padding-right: 8px
    }

    .semi-rtl .semi-button.semi-button-with-icon-only.semi-button-size-small,
    .semi-portal-rtl .semi-button.semi-button-with-icon-only.semi-button-size-small {
        padding-left: 4px;
        padding-right: 4px
    }

    .semi-rtl .semi-button.semi-button-with-icon-only.semi-button-size-large,
    .semi-portal-rtl .semi-button.semi-button-with-icon-only.semi-button-size-large {
        padding-left: 12px;
        padding-right: 12px
    }

    .semi-rtl .semi-button-content-left,
    .semi-portal-rtl .semi-button-content-left {
        margin-left: 8px;
        margin-right: 0
    }

    .semi-rtl .semi-button-content-right,
    .semi-portal-rtl .semi-button-content-right {
        margin-left: 0;
        margin-right: 8px
    }
}


.semi-icon {
    text-align: center;
    text-transform: none;
    text-rendering: optimizeLegibility;
    fill: currentColor;
    font-style: normal;
    line-height: 0;
    display: inline-block
}

.semi-icon-extra-small {
    font-size: 8px
}

.semi-icon-small {
    font-size: 12px
}

.semi-icon-default {
    font-size: 16px
}

.semi-icon-large {
    font-size: 20px
}

.semi-icon-extra-large {
    font-size: 24px
}

.semi-icon-spinning {
    animation: .6s linear infinite forwards semi-icon-animation-rotate
}

@keyframes semi-icon-animation-rotate {
    0% {
        transform: rotate(0)
    }

    to {
        transform: rotate(360deg)
    }
}


@layer base {
    .semi-badge {
        display: inline-block;
        position: relative
    }

    .semi-badge-dot {
        box-sizing: border-box;
        border-radius: var(--semi-border-radius-circle);
        background-color: var(--semi-color-bg-1);
        border: 1px var(--semi-color-bg-1)solid;
        z-index: 1;
        width: 8px;
        height: 8px
    }

    .semi-badge-count {
        box-sizing: border-box;
        background-color: var(--semi-color-bg-1);
        border: 1px var(--semi-color-bg-1)solid;
        z-index: 1;
        text-align: center;
        min-width: 18px;
        height: 18px;
        font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif;
        font-size: 12px;
        line-height: 16px;
        font-weight: 14px;
        color: var(--semi-color-bg-2);
        border-radius: 9px;
        padding: 0 4px
    }

    .semi-badge-rightTop {
        transform-origin: 100% 0;
        position: absolute;
        top: 0;
        right: 0;
        transform: translate(50%, -50%)
    }

    .semi-badge-rightBottom {
        transform-origin: 100% 0;
        position: absolute;
        bottom: 0;
        right: 0;
        transform: translate(50%, 50%)
    }

    .semi-badge-leftTop {
        transform-origin: 100% 0;
        position: absolute;
        top: 0;
        left: 0;
        transform: translate(-50%, -50%)
    }

    .semi-badge-leftBottom {
        transform-origin: 100% 0;
        position: absolute;
        bottom: 0;
        left: 0;
        transform: translate(-50%, 50%)
    }

    .semi-badge-custom {
        display: flex
    }

    .semi-badge-block {
        display: inline-block;
        position: static
    }

    .semi-badge-light:before {
        content: "";
        border-radius: inherit;
        background-color: var(--semi-color-bg-2);
        z-index: -1;
        width: 100%;
        height: 100%;
        display: block;
        position: absolute;
        top: 0;
        left: 0
    }

    .semi-badge-light:after {
        content: "";
        border-radius: inherit;
        background-color: inherit;
        z-index: -1;
        width: 100%;
        height: 100%;
        display: block;
        position: absolute;
        top: 0;
        left: 0
    }

    .semi-badge-primary.semi-badge-solid {
        background-color: var(--semi-color-primary)
    }

    .semi-badge-primary.semi-badge-light {
        background-color: var(--semi-color-primary-light-default);
        color: var(--semi-color-primary)
    }

    .semi-badge-primary.semi-badge-inverted {
        color: var(--semi-color-primary)
    }

    .semi-badge-secondary.semi-badge-solid {
        background-color: var(--semi-color-secondary)
    }

    .semi-badge-secondary.semi-badge-light {
        background-color: var(--semi-color-secondary-light-default);
        color: var(--semi-color-secondary)
    }

    .semi-badge-secondary.semi-badge-inverted {
        color: var(--semi-color-secondary)
    }

    .semi-badge-tertiary.semi-badge-solid {
        background-color: var(--semi-color-tertiary)
    }

    .semi-badge-tertiary.semi-badge-light {
        background-color: var(--semi-color-tertiary-light-default);
        color: var(--semi-color-tertiary)
    }

    .semi-badge-tertiary.semi-badge-inverted {
        color: var(--semi-color-tertiary)
    }

    .semi-badge-danger.semi-badge-solid {
        background-color: var(--semi-color-danger)
    }

    .semi-badge-danger.semi-badge-light {
        background-color: var(--semi-color-danger-light-default);
        color: var(--semi-color-danger)
    }

    .semi-badge-danger.semi-badge-inverted {
        color: var(--semi-color-danger)
    }

    .semi-badge-warning.semi-badge-solid {
        background-color: var(--semi-color-warning)
    }

    .semi-badge-warning.semi-badge-light {
        background-color: var(--semi-color-warning-light-default);
        color: var(--semi-color-warning)
    }

    .semi-badge-warning.semi-badge-inverted {
        color: var(--semi-color-warning)
    }

    .semi-badge-success.semi-badge-solid {
        background-color: var(--semi-color-success)
    }

    .semi-badge-success.semi-badge-light {
        background-color: var(--semi-color-success-light-default);
        color: var(--semi-color-success)
    }

    .semi-badge-success.semi-badge-inverted {
        color: var(--semi-color-success)
    }

    .semi-rtl .semi-badge,
    .semi-portal-rtl .semi-badge {
        direction: rtl
    }
}


@layer base {
    .semi-collapsible-transition {
        transition: height .25s cubic-bezier(.25, .1, .25, 1)var(--semi-transition_delay-none), opacity .25s var(--semi-transition_function-easeIn)var(--semi-transition_delay-none)
    }
}


@layer base {
    .semi-collapse-item {
        border-bottom: 1px solid var(--semi-color-border)
    }

    .semi-collapse-header {
        border-radius: var(--semi-border-radius-small);
        cursor: pointer;
        color: var(--semi-color-text-0);
        outline: none;
        justify-content: space-between;
        align-items: center;
        margin: 4px 8px;
        padding: 8px;
        font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif;
        font-size: 14px;
        font-weight: 600;
        line-height: 20px;
        display: flex
    }

    .semi-collapse-header-right {
        align-items: center;
        display: flex
    }

    .semi-collapse-header-right span {
        padding-right: 8px;
        display: flex
    }

    .semi-collapse-header-right span:last-child {
        padding-right: 0
    }

    .semi-collapse-header-icon {
        width: 16px;
        height: 16px;
        color: var(--semi-color-text-2)
    }

    .semi-collapse-header-iconLeft {
        justify-content: flex-start
    }

    .semi-collapse-header-iconLeft .semi-collapse-header-icon {
        margin-right: 8px
    }

    .semi-collapse-header-iconDisabled {
        color: var(--semi-color-disabled-text)
    }

    .semi-collapse-header:hover {
        background-color: var(--semi-color-fill-0)
    }

    .semi-collapse-header:active {
        background-color: var(--semi-color-fill-1)
    }

    .semi-collapse-header-disabled {
        color: var(--semi-color-disabled-text)
    }

    .semi-collapse-header-disabled:hover {
        background-color: transparent
    }

    .semi-collapse-content {
        color: var(--semi-color-text-1);
        padding: 4px 16px 8px;
        font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif;
        font-size: 14px;
        line-height: 20px
    }

    .semi-collapse-content p {
        margin: 0
    }

    .semi-rtl .semi-collapse,
    .semi-portal-rtl .semi-collapse {
        direction: rtl
    }

    .semi-rtl .semi-collapse-header-right span,
    .semi-portal-rtl .semi-collapse-header-right span {
        padding-left: 8px;
        padding-right: 0;
        display: flex
    }

    .semi-rtl .semi-collapse-header-right span:last-child,
    .semi-portal-rtl .semi-collapse-header-right span:last-child {
        padding-left: 0;
        padding-right: 0
    }
}


@layer base {
    .semi-empty {
        display: flex
    }

    .semi-empty-image {
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        -webkit-user-drag: none;
        pointer-events: none;
        justify-content: center;
        display: flex
    }

    .semi-empty-vertical {
        flex-direction: column;
        align-items: center
    }

    .semi-empty-vertical .semi-empty-content {
        margin-top: 24px
    }

    .semi-empty-vertical .semi-empty-title,
    .semi-empty-vertical .semi-empty-description {
        text-align: center
    }

    .semi-empty-horizontal .semi-empty-content {
        margin-left: 32px
    }

    .semi-empty-title.semi-typography {
        font-weight: 600;
        display: block
    }

    .semi-empty-title+.semi-empty-description {
        margin-top: 16px
    }

    .semi-empty-description {
        color: var(--semi-color-text-1)
    }

    .semi-empty-footer {
        margin-top: 24px
    }

    .semi-rtl .semi-empty,
    .semi-portal-rtl .semi-empty {
        direction: rtl
    }

    .semi-rtl .semi-empty-horizontal .semi-empty-content,
    .semi-portal-rtl .semi-empty-horizontal .semi-empty-content {
        margin-left: auto;
        margin-right: 32px
    }
}


@layer base {
    .semi-typography {
        color: var(--semi-color-text-0);
        font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif;
        font-size: 14px;
        line-height: 20px
    }

    .semi-typography.semi-typography-secondary {
        color: var(--semi-color-text-1)
    }

    .semi-typography.semi-typography-tertiary {
        color: var(--semi-color-text-2)
    }

    .semi-typography.semi-typography-quaternary {
        color: var(--semi-color-text-3)
    }

    .semi-typography.semi-typography-warning {
        color: var(--semi-color-warning)
    }

    .semi-typography.semi-typography-success {
        color: var(--semi-color-success)
    }

    .semi-typography.semi-typography-danger {
        color: var(--semi-color-danger)
    }

    .semi-typography.semi-typography-link {
        color: var(--semi-color-link);
        font-weight: 600
    }

    .semi-typography.semi-typography-disabled {
        color: var(--semi-color-disabled-text);
        cursor: not-allowed;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none
    }

    .semi-typography.semi-typography-disabled.semi-typography-link {
        color: var(--semi-color-link)
    }

    .semi-typography-icon {
        vertical-align: middle;
        color: inherit;
        margin-right: 4px
    }

    .semi-typography-small {
        font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif;
        font-size: 12px;
        font-weight: 400;
        line-height: 16px
    }

    .semi-typography-small.semi-typography-paragraph {
        font-weight: 400
    }

    .semi-typography code {
        border: 1px solid var(--semi-color-border);
        color: var(--semi-color-text-2);
        background-color: var(--semi-color-fill-1);
        border-radius: 2px;
        padding: 2px 4px
    }

    .semi-typography mark {
        background-color: var(--semi-color-primary-light-default)
    }

    .semi-typography u {
        -webkit-text-decoration-skip: ink;
        -webkit-text-decoration-skip-ink: auto;
        text-decoration-skip-ink: auto;
        text-decoration: underline
    }

    .semi-typography del {
        text-decoration: line-through
    }

    .semi-typography strong {
        font-weight: 600
    }

    .semi-typography a {
        color: var(--semi-color-link);
        cursor: pointer;
        text-decoration: none;
        display: inline
    }

    .semi-typography a:visited {
        color: var(--semi-color-link-visited)
    }

    .semi-typography a:hover {
        color: var(--semi-color-link-hover)
    }

    .semi-typography a:active {
        color: var(--semi-color-link-active)
    }

    .semi-typography a .semi-typography-link-underline:hover {
        border-bottom: 1px solid var(--semi-color-link-hover);
        margin-bottom: -1px
    }

    .semi-typography a .semi-typography-link-underline:active {
        border-bottom: 1px solid var(--semi-color-link-active);
        margin-bottom: -1px
    }

    .semi-typography-ellipsis-single-line {
        overflow: hidden
    }

    .semi-typography-ellipsis-multiple-line {
        -webkit-box-orient: vertical;
        display: -webkit-box;
        overflow: hidden
    }

    .semi-typography-ellipsis-multiple-line.semi-typography-ellipsis-multiple-line-text {
        display: -webkit-inline-box
    }

    .semi-typography-ellipsis-overflow-ellipsis {
        white-space: nowrap;
        text-overflow: ellipsis;
        display: block
    }

    .semi-typography-ellipsis-overflow-ellipsis.semi-typography-ellipsis-overflow-ellipsis-text {
        vertical-align: top;
        max-width: 100%;
        display: inline-block
    }

    .semi-typography-ellipsis-expand {
        margin-left: 8px;
        display: inline
    }

    .semi-typography-action-copy {
        vertical-align: middle;
        margin-left: 4px;
        padding: 0;
        display: inline-flex
    }

    .semi-typography a.semi-typography-action-copy-icon {
        display: inline-flex
    }

    .semi-typography-action-copied {
        color: var(--semi-color-text-2);
        margin-left: 4px;
        padding: 0;
        display: inline-flex
    }

    .semi-typography-action-copied .semi-icon {
        vertical-align: middle;
        color: var(--semi-color-success)
    }

    .semi-typography-paragraph {
        margin: 0
    }

    h1.semi-typography,
    .semi-typography-h1.semi-typography {
        margin: 0;
        font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif;
        font-size: 32px;
        font-weight: 600;
        line-height: 44px
    }

    h1.semi-typography.semi-typography-h1-weight-light,
    .semi-typography-h1.semi-typography.semi-typography-h1-weight-light {
        font-weight: 200
    }

    h1.semi-typography.semi-typography-h1-weight-regular,
    .semi-typography-h1.semi-typography.semi-typography-h1-weight-regular {
        font-weight: 400
    }

    h1.semi-typography.semi-typography-h1-weight-medium,
    .semi-typography-h1.semi-typography.semi-typography-h1-weight-medium {
        font-weight: 500
    }

    h1.semi-typography.semi-typography-h1-weight-semibold,
    .semi-typography-h1.semi-typography.semi-typography-h1-weight-semibold {
        font-weight: 600
    }

    h1.semi-typography.semi-typography-h1-weight-bold,
    .semi-typography-h1.semi-typography.semi-typography-h1-weight-bold {
        font-weight: 700
    }

    h2.semi-typography,
    .semi-typography-h2.semi-typography {
        margin: 0;
        font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif;
        font-size: 28px;
        font-weight: 600;
        line-height: 40px
    }

    h2.semi-typography.semi-typography-h2-weight-light,
    .semi-typography-h2.semi-typography.semi-typography-h2-weight-light {
        font-weight: 200
    }

    h2.semi-typography.semi-typography-h2-weight-regular,
    .semi-typography-h2.semi-typography.semi-typography-h2-weight-regular {
        font-weight: 400
    }

    h2.semi-typography.semi-typography-h2-weight-medium,
    .semi-typography-h2.semi-typography.semi-typography-h2-weight-medium {
        font-weight: 500
    }

    h2.semi-typography.semi-typography-h2-weight-semibold,
    .semi-typography-h2.semi-typography.semi-typography-h2-weight-semibold {
        font-weight: 600
    }

    h2.semi-typography.semi-typography-h2-weight-bold,
    .semi-typography-h2.semi-typography.semi-typography-h2-weight-bold {
        font-weight: 700
    }

    h3.semi-typography,
    .semi-typography-h3.semi-typography {
        margin: 0;
        font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif;
        font-size: 24px;
        font-weight: 600;
        line-height: 32px
    }

    h3.semi-typography.semi-typography-h3-weight-light,
    .semi-typography-h3.semi-typography.semi-typography-h3-weight-light {
        font-weight: 200
    }

    h3.semi-typography.semi-typography-h3-weight-regular,
    .semi-typography-h3.semi-typography.semi-typography-h3-weight-regular {
        font-weight: 400
    }

    h3.semi-typography.semi-typography-h3-weight-medium,
    .semi-typography-h3.semi-typography.semi-typography-h3-weight-medium {
        font-weight: 500
    }

    h3.semi-typography.semi-typography-h3-weight-semibold,
    .semi-typography-h3.semi-typography.semi-typography-h3-weight-semibold {
        font-weight: 600
    }

    h3.semi-typography.semi-typography-h3-weight-bold,
    .semi-typography-h3.semi-typography.semi-typography-h3-weight-bold {
        font-weight: 700
    }

    h4.semi-typography,
    .semi-typography-h4.semi-typography {
        margin: 0;
        font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif;
        font-size: 20px;
        font-weight: 600;
        line-height: 28px
    }

    h4.semi-typography.semi-typography-h4-weight-light,
    .semi-typography-h4.semi-typography.semi-typography-h4-weight-light {
        font-weight: 200
    }

    h4.semi-typography.semi-typography-h4-weight-regular,
    .semi-typography-h4.semi-typography.semi-typography-h4-weight-regular {
        font-weight: 400
    }

    h4.semi-typography.semi-typography-h4-weight-medium,
    .semi-typography-h4.semi-typography.semi-typography-h4-weight-medium {
        font-weight: 500
    }

    h4.semi-typography.semi-typography-h4-weight-semibold,
    .semi-typography-h4.semi-typography.semi-typography-h4-weight-semibold {
        font-weight: 600
    }

    h4.semi-typography.semi-typography-h4-weight-bold,
    .semi-typography-h4.semi-typography.semi-typography-h4-weight-bold {
        font-weight: 700
    }

    h5.semi-typography,
    .semi-typography-h5.semi-typography {
        margin: 0;
        font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif;
        font-size: 18px;
        font-weight: 600;
        line-height: 24px
    }

    h5.semi-typography.semi-typography-h5-weight-light,
    .semi-typography-h5.semi-typography.semi-typography-h5-weight-light {
        font-weight: 200
    }

    h5.semi-typography.semi-typography-h5-weight-regular,
    .semi-typography-h5.semi-typography.semi-typography-h5-weight-regular {
        font-weight: 400
    }

    h5.semi-typography.semi-typography-h5-weight-medium,
    .semi-typography-h5.semi-typography.semi-typography-h5-weight-medium {
        font-weight: 500
    }

    h5.semi-typography.semi-typography-h5-weight-semibold,
    .semi-typography-h5.semi-typography.semi-typography-h5-weight-semibold {
        font-weight: 600
    }

    h5.semi-typography.semi-typography-h5-weight-bold,
    .semi-typography-h5.semi-typography.semi-typography-h5-weight-bold {
        font-weight: 700
    }

    h6.semi-typography,
    .semi-typography-h6.semi-typography {
        margin: 0;
        font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif;
        font-size: 16px;
        font-weight: 600;
        line-height: 22px
    }

    h6.semi-typography.semi-typography-h6-weight-light,
    .semi-typography-h6.semi-typography.semi-typography-h6-weight-light {
        font-weight: 200
    }

    h6.semi-typography.semi-typography-h6-weight-regular,
    .semi-typography-h6.semi-typography.semi-typography-h6-weight-regular {
        font-weight: 400
    }

    h6.semi-typography.semi-typography-h6-weight-medium,
    .semi-typography-h6.semi-typography.semi-typography-h6-weight-medium {
        font-weight: 500
    }

    h6.semi-typography.semi-typography-h6-weight-semibold,
    .semi-typography-h6.semi-typography.semi-typography-h6-weight-semibold {
        font-weight: 600
    }

    h6.semi-typography.semi-typography-h6-weight-bold,
    .semi-typography-h6.semi-typography.semi-typography-h6-weight-bold {
        font-weight: 700
    }

    p.semi-typography-extended,
    .semi-typography-paragraph.semi-typography-extended {
        font-weight: 400;
        line-height: 24px
    }

    .semi-rtl .semi-typography,
    .semi-portal-rtl .semi-typography {
        direction: rtl
    }

    .semi-rtl .semi-typography-link a,
    .semi-rtl .semi-typography a,
    .semi-portal-rtl .semi-typography-link a,
    .semi-portal-rtl .semi-typography a {
        display: inline-block
    }

    .semi-rtl .semi-typography-icon,
    .semi-portal-rtl .semi-typography-icon {
        margin-left: 4px;
        margin-right: auto
    }

    .semi-rtl .semi-typography-ellipsis-expand,
    .semi-portal-rtl .semi-typography-ellipsis-expand {
        margin-left: auto
    }

    .semi-rtl .semi-typography-action-copy,
    .semi-portal-rtl .semi-typography-action-copy,
    .semi-rtl .semi-typography-action-copied,
    .semi-portal-rtl .semi-typography-action-copied {
        margin-left: auto;
        margin-right: 4px
    }
}


@layer base {
    @keyframes semi-tooltip-zoomIn {
        0% {
            opacity: 0;
            transform: scale(.8)
        }

        50% {
            opacity: 1
        }
    }

    @keyframes semi-tooltip-bounceIn {
        0% {
            opacity: 0;
            transform: scale(.6)
        }

        70% {
            opacity: 1;
            transform: scale(1.01)
        }

        to {
            opacity: 1;
            animation-timing-function: cubic-bezier(.215, .61, .355, 1);
            transform: scale(1)
        }
    }

    @keyframes semi-tooltip-zoomOut {
        0% {
            opacity: 1
        }

        60% {
            opacity: 0;
            transform: scale(.8)
        }

        to {
            opacity: 0
        }
    }

    .semi-tooltip-wrapper {
        background-color: rgba(var(--semi-grey-7), 1);
        color: var(--semi-color-bg-0);
        border-radius: var(--semi-border-radius-medium);
        word-wrap: break-word;
        overflow-wrap: break-word;
        opacity: 0;
        max-width: 240px;
        padding: 8px 12px;
        font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif;
        font-size: 14px;
        line-height: 20px;
        position: relative;
        top: 0;
        left: 0
    }

    .semi-tooltip-wrapper-show {
        opacity: 1
    }

    .semi-tooltip-content {
        min-width: 0
    }

    .semi-tooltip-trigger {
        width: auto;
        height: auto;
        display: inline-block
    }

    .semi-tooltip-with-arrow {
        box-sizing: border-box;
        justify-content: center;
        align-items: center;
        display: flex
    }

    .semi-tooltip-animation-show {
        animation: .1s cubic-bezier(.215, .61, .355, 1) forwards semi-tooltip-zoomIn
    }

    .semi-tooltip-animation-hide {
        animation: .1s cubic-bezier(.215, .61, .355, 1) forwards semi-tooltip-zoomOut
    }

    .semi-tooltip-wrapper .semi-tooltip-icon-arrow {
        width: 24px;
        height: 7px;
        color: rgba(var(--semi-grey-7), 1);
        position: absolute
    }

    .semi-tooltip-wrapper[x-placement=top] .semi-tooltip-icon-arrow {
        bottom: -6px;
        left: 50%;
        transform: translate(-50%)
    }

    .semi-tooltip-wrapper[x-placement=top].semi-tooltip-with-arrow,
    .semi-tooltip-wrapper[x-placement=top] .semi-tooltip-with-arrow {
        min-width: 36px
    }

    .semi-tooltip-wrapper[x-placement=topLeft] .semi-tooltip-icon-arrow {
        bottom: -6px;
        left: 6px
    }

    .semi-tooltip-wrapper[x-placement=topLeft].semi-tooltip-with-arrow,
    .semi-tooltip-wrapper[x-placement=topLeft] .semi-tooltip-with-arrow {
        min-width: 36px
    }

    .semi-tooltip-wrapper[x-placement=topRight] .semi-tooltip-icon-arrow {
        bottom: -6px;
        right: 6px
    }

    .semi-tooltip-wrapper[x-placement=topRight].semi-tooltip-with-arrow,
    .semi-tooltip-wrapper[x-placement=topRight] .semi-tooltip-with-arrow {
        min-width: 36px
    }

    .semi-tooltip-wrapper[x-placement=leftTop] .semi-tooltip-icon-arrow {
        width: 7px;
        height: 24px;
        top: 5px;
        right: -6px
    }

    .semi-tooltip-wrapper[x-placement=leftTop].semi-tooltip-with-arrow,
    .semi-tooltip-wrapper[x-placement=leftTop] .semi-tooltip-with-arrow {
        min-height: 34px
    }

    .semi-tooltip-wrapper[x-placement=left] .semi-tooltip-icon-arrow {
        width: 7px;
        height: 24px;
        top: 50%;
        right: -6px;
        transform: translateY(-50%)
    }

    .semi-tooltip-wrapper[x-placement=left].semi-tooltip-with-arrow,
    .semi-tooltip-wrapper[x-placement=left] .semi-tooltip-with-arrow {
        min-height: 34px
    }

    .semi-tooltip-wrapper[x-placement=leftBottom] .semi-tooltip-icon-arrow {
        width: 7px;
        height: 24px;
        bottom: 5px;
        right: -6px
    }

    .semi-tooltip-wrapper[x-placement=leftBottom].semi-tooltip-with-arrow,
    .semi-tooltip-wrapper[x-placement=leftBottom] .semi-tooltip-with-arrow {
        min-height: 34px
    }

    .semi-tooltip-wrapper[x-placement=rightTop] .semi-tooltip-icon-arrow {
        width: 7px;
        height: 24px;
        top: 5px;
        left: -6px;
        transform: rotate(180deg)
    }

    .semi-tooltip-wrapper[x-placement=rightTop].semi-tooltip-with-arrow,
    .semi-tooltip-wrapper[x-placement=rightTop] .semi-tooltip-with-arrow {
        min-height: 34px
    }

    .semi-tooltip-wrapper[x-placement=right] .semi-tooltip-icon-arrow {
        width: 7px;
        height: 24px;
        top: 50%;
        left: -6px;
        transform: translateY(-50%)rotate(180deg)
    }

    .semi-tooltip-wrapper[x-placement=right].semi-tooltip-with-arrow,
    .semi-tooltip-wrapper[x-placement=right] .semi-tooltip-with-arrow {
        min-height: 34px
    }

    .semi-tooltip-wrapper[x-placement=rightBottom] .semi-tooltip-icon-arrow {
        width: 7px;
        height: 24px;
        bottom: 5px;
        left: -6px;
        transform: rotate(180deg)
    }

    .semi-tooltip-wrapper[x-placement=rightBottom].semi-tooltip-with-arrow,
    .semi-tooltip-wrapper[x-placement=rightBottom] .semi-tooltip-with-arrow {
        min-height: 34px
    }

    .semi-tooltip-wrapper[x-placement=bottomLeft] .semi-tooltip-icon-arrow {
        top: -6px;
        left: 6px;
        transform: rotate(180deg)
    }

    .semi-tooltip-wrapper[x-placement=bottomLeft].semi-tooltip-with-arrow,
    .semi-tooltip-wrapper[x-placement=bottomLeft] .semi-tooltip-with-arrow {
        min-width: 36px
    }

    .semi-tooltip-wrapper[x-placement=bottom] .semi-tooltip-icon-arrow {
        top: -6px;
        left: 50%;
        transform: translate(-50%)rotate(180deg)
    }

    .semi-tooltip-wrapper[x-placement=bottom].semi-tooltip-with-arrow,
    .semi-tooltip-wrapper[x-placement=bottom] .semi-tooltip-with-arrow {
        min-width: 36px
    }

    .semi-tooltip-wrapper[x-placement=bottomRight] .semi-tooltip-icon-arrow {
        top: -6px;
        right: 6px;
        transform: rotate(180deg)
    }

    .semi-tooltip-wrapper[x-placement=bottomRight].semi-tooltip-with-arrow,
    .semi-tooltip-wrapper[x-placement=bottomRight] .semi-tooltip-with-arrow {
        min-width: 36px
    }

    .semi-rtl .semi-tooltip-wrapper,
    .semi-portal-rtl .semi-tooltip-wrapper {
        direction: rtl;
        padding-left: 12px;
        padding-right: 12px;
        left: auto;
        right: 0
    }
}


@layer base {
    .semi-portal {
        z-index: 1;
        width: 100%;
        position: absolute;
        top: 0;
        left: 0
    }

    .semi-portal-inner {
        min-width: -moz-max-content;
        background-color: transparent;
        min-width: max-content;
        position: absolute
    }
}


@layer base {
    @keyframes semi-popover-zoomIn {
        0% {
            opacity: 0;
            transform: scale(.8)
        }

        50% {
            opacity: 1
        }
    }

    @keyframes semi-popover-zoomOut {
        0% {
            opacity: 1
        }

        60% {
            opacity: 0;
            transform: scale(.8)
        }

        to {
            opacity: 0
        }
    }

    .semi-popover-wrapper {
        background-color: var(--semi-color-bg-3);
        box-shadow: var(--semi-shadow-elevated);
        z-index: 1030;
        border-radius: var(--semi-border-radius-medium);
        opacity: 0;
        font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif;
        font-size: 14px;
        line-height: 20px;
        position: relative
    }

    .semi-popover-wrapper-show {
        opacity: 1
    }

    .semi-popover-trigger {
        width: auto;
        height: auto;
        display: inline-block
    }

    .semi-popover-title {
        border-bottom: 1px solid var(--semi-color-border);
        padding: 8px
    }

    .semi-popover-confirm {
        position: absolute
    }

    .semi-popover-with-arrow {
        box-sizing: border-box;
        padding: 12px
    }

    .semi-popover-animation-show {
        animation: .1s cubic-bezier(.215, .61, .355, 1) forwards semi-popover-zoomIn
    }

    .semi-popover-animation-hide {
        animation: .1s cubic-bezier(.215, .61, .355, 1) forwards semi-popover-zoomOut
    }

    .semi-popover-wrapper .semi-popover-icon-arrow {
        width: 24px;
        height: 8px;
        color: unset;
        position: absolute
    }

    .semi-popover-wrapper[x-placement=top] .semi-popover-icon-arrow {
        bottom: -7px;
        left: 50%;
        transform: translate(-50%)
    }

    .semi-popover-wrapper[x-placement=top].semi-popover-with-arrow,
    .semi-popover-wrapper[x-placement=top] .semi-popover-with-arrow {
        min-width: 36px
    }

    .semi-popover-wrapper[x-placement=topLeft] .semi-popover-icon-arrow {
        bottom: -7px;
        left: 6px
    }

    .semi-popover-wrapper[x-placement=topLeft].semi-popover-with-arrow,
    .semi-popover-wrapper[x-placement=topLeft] .semi-popover-with-arrow {
        min-width: 36px
    }

    .semi-popover-wrapper[x-placement=topRight] .semi-popover-icon-arrow {
        bottom: -7px;
        right: 6px
    }

    .semi-popover-wrapper[x-placement=topRight].semi-popover-with-arrow,
    .semi-popover-wrapper[x-placement=topRight] .semi-popover-with-arrow {
        min-width: 36px
    }

    .semi-popover-wrapper[x-placement=leftTop] .semi-popover-icon-arrow {
        width: 8px;
        height: 24px;
        top: 6px;
        right: -7px
    }

    .semi-popover-wrapper[x-placement=leftTop].semi-popover-with-arrow,
    .semi-popover-wrapper[x-placement=leftTop] .semi-popover-with-arrow {
        min-height: 36px
    }

    .semi-popover-wrapper[x-placement=left] .semi-popover-icon-arrow {
        width: 8px;
        height: 24px;
        top: 50%;
        right: -7px;
        transform: translateY(-50%)
    }

    .semi-popover-wrapper[x-placement=left].semi-popover-with-arrow,
    .semi-popover-wrapper[x-placement=left] .semi-popover-with-arrow {
        min-height: 36px
    }

    .semi-popover-wrapper[x-placement=leftBottom] .semi-popover-icon-arrow {
        width: 8px;
        height: 24px;
        bottom: 6px;
        right: -7px
    }

    .semi-popover-wrapper[x-placement=leftBottom].semi-popover-with-arrow,
    .semi-popover-wrapper[x-placement=leftBottom] .semi-popover-with-arrow {
        min-height: 36px
    }

    .semi-popover-wrapper[x-placement=rightTop] .semi-popover-icon-arrow {
        width: 8px;
        height: 24px;
        top: 6px;
        left: -7px;
        transform: rotate(180deg)
    }

    .semi-popover-wrapper[x-placement=rightTop].semi-popover-with-arrow,
    .semi-popover-wrapper[x-placement=rightTop] .semi-popover-with-arrow {
        min-height: 36px
    }

    .semi-popover-wrapper[x-placement=right] .semi-popover-icon-arrow {
        width: 8px;
        height: 24px;
        top: 50%;
        left: -7px;
        transform: translateY(-50%)rotate(180deg)
    }

    .semi-popover-wrapper[x-placement=right].semi-popover-with-arrow,
    .semi-popover-wrapper[x-placement=right] .semi-popover-with-arrow {
        min-height: 36px
    }

    .semi-popover-wrapper[x-placement=rightBottom] .semi-popover-icon-arrow {
        width: 8px;
        height: 24px;
        bottom: 6px;
        left: -7px;
        transform: rotate(180deg)
    }

    .semi-popover-wrapper[x-placement=rightBottom].semi-popover-with-arrow,
    .semi-popover-wrapper[x-placement=rightBottom] .semi-popover-with-arrow {
        min-height: 36px
    }

    .semi-popover-wrapper[x-placement=bottomLeft] .semi-popover-icon-arrow {
        top: -7px;
        left: 6px;
        transform: rotate(180deg)
    }

    .semi-popover-wrapper[x-placement=bottomLeft].semi-popover-with-arrow,
    .semi-popover-wrapper[x-placement=bottomLeft] .semi-popover-with-arrow {
        min-width: 36px
    }

    .semi-popover-wrapper[x-placement=bottom] .semi-popover-icon-arrow {
        top: -7px;
        left: 50%;
        transform: translate(-50%)rotate(180deg)
    }

    .semi-popover-wrapper[x-placement=bottom].semi-popover-with-arrow,
    .semi-popover-wrapper[x-placement=bottom] .semi-popover-with-arrow {
        min-width: 36px
    }

    .semi-popover-wrapper[x-placement=bottomRight] .semi-popover-icon-arrow {
        top: -7px;
        right: 6px;
        transform: rotate(180deg)
    }

    .semi-popover-wrapper[x-placement=bottomRight].semi-popover-with-arrow,
    .semi-popover-wrapper[x-placement=bottomRight] .semi-popover-with-arrow {
        min-width: 36px
    }

    .semi-popover.semi-popover-rtl {
        direction: rtl
    }
}


@layer base {
    .semi-list {
        font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif;
        font-size: 14px;
        line-height: 20px
    }

    .semi-list-items {
        margin: 0;
        padding: 0;
        list-style: none
    }

    .semi-list-header,
    .semi-list-footer {
        padding: 12px 24px
    }

    .semi-list-empty {
        color: var(--semi-color-text-2);
        text-align: center;
        width: 100%;
        padding: 12px 0
    }

    .semi-list-item {
        box-sizing: border-box;
        flex-wrap: wrap;
        align-items: center;
        margin: 0;
        padding: 12px 24px;
        list-style: none;
        display: flex
    }

    .semi-list-item-body {
        flex: 1;
        display: flex
    }

    .semi-list-item-body-header {
        margin-right: 20px
    }

    .semi-list-item-body-flex-start {
        align-items: flex-start
    }

    .semi-list-item-body-flex-end {
        align-items: flex-end
    }

    .semi-list-item-body-center {
        align-items: center
    }

    .semi-list-item-body-stretch {
        align-items: stretch
    }

    .semi-list-item-body-baseline {
        align-items: baseline
    }

    .semi-list-item-extra {
        flex: none;
        margin-left: 40px
    }

    .semi-list-split .semi-list-item {
        border-bottom: 1px solid var(--semi-color-border)
    }

    .semi-list-split .semi-list-item:last-child {
        border-bottom: none
    }

    .semi-list-split .semi-list-header {
        border-bottom: 1px solid var(--semi-color-border)
    }

    .semi-list-split .semi-list-footer {
        border-top: 1px solid var(--semi-color-border)
    }

    .semi-list-small .semi-list-item,
    .semi-list-small .semi-list-header,
    .semi-list-small .semi-list-footer {
        padding: 8px 16px
    }

    .semi-list-large .semi-list-item,
    .semi-list-large .semi-list-header,
    .semi-list-large .semi-list-footer {
        padding: 16px 24px
    }

    .semi-list.semi-list-grid .semi-list-item {
        padding: 0
    }

    .semi-list.semi-list-bordered {
        border: 1px solid var(--semi-color-border)
    }

    .semi-list.semi-list-flex .semi-list-items {
        display: flex
    }

    .semi-list.semi-list-flex.semi-list-split .semi-list-item {
        border-bottom: none;
        border-right: 1px solid var(--semi-color-border)
    }

    .semi-list.semi-list-flex.semi-list-split .semi-list-item:last-child {
        border-right: none
    }

    .semi-rtl .semi-list,
    .semi-portal-rtl .semi-list,
    .semi-rtl .semi-list-item,
    .semi-portal-rtl .semi-list-item {
        direction: rtl
    }

    .semi-rtl .semi-list-item-body-header,
    .semi-portal-rtl .semi-list-item-body-header {
        margin-left: 20px;
        margin-right: auto
    }

    .semi-rtl .semi-list-item-extra,
    .semi-portal-rtl .semi-list-item-extra {
        flex: none;
        margin-left: 0;
        margin-right: 40px
    }

    .semi-rtl .semi-list.semi-list-flex.semi-list-split .semi-list-item,
    .semi-portal-rtl .semi-list.semi-list-flex.semi-list-split .semi-list-item {
        border-bottom: none;
        border-right: 0;
        border-left: 1px solid var(--semi-color-border)
    }

    .semi-rtl .semi-list.semi-list-flex.semi-list-split .semi-list-item:last-child,
    .semi-portal-rtl .semi-list.semi-list-flex.semi-list-split .semi-list-item:last-child {
        border-left: none
    }
}


@layer base {
    .semi-row {
        box-sizing: border-box;
        zoom: 1;
        height: auto;
        margin-left: 0;
        margin-right: 0;
        display: block;
        position: relative
    }

    .semi-row:before,
    .semi-row:after {
        content: "";
        display: table
    }

    .semi-row:after {
        clear: both
    }

    .semi-row-flex {
        flex-flow: wrap;
        display: flex
    }

    .semi-row-flex:before,
    .semi-row-flex:after {
        display: flex
    }

    .semi-col-0,
    .semi-col-xs-0,
    .semi-col-sm-0,
    .semi-col-md-0,
    .semi-col-lg-0,
    .semi-col-xl-0,
    .semi-col-xxl-0 {
        display: none
    }

    .semi-row-flex-start {
        justify-content: flex-start
    }

    .semi-row-flex-center {
        justify-content: center
    }

    .semi-row-flex-end {
        justify-content: flex-end
    }

    .semi-row-flex-space-between {
        justify-content: space-between
    }

    .semi-row-flex-space-around {
        justify-content: space-around
    }

    .semi-row-flex-top {
        align-items: flex-start
    }

    .semi-row-flex-middle {
        align-items: center
    }

    .semi-row-flex-bottom {
        align-items: flex-end
    }

    .semi-col {
        position: relative
    }

    .semi-col-1,
    .semi-col-xs-1,
    .semi-col-sm-1,
    .semi-col-md-1,
    .semi-col-lg-1,
    .semi-col-2,
    .semi-col-xs-2,
    .semi-col-sm-2,
    .semi-col-md-2,
    .semi-col-lg-2,
    .semi-col-3,
    .semi-col-xs-3,
    .semi-col-sm-3,
    .semi-col-md-3,
    .semi-col-lg-3,
    .semi-col-4,
    .semi-col-xs-4,
    .semi-col-sm-4,
    .semi-col-md-4,
    .semi-col-lg-4,
    .semi-col-5,
    .semi-col-xs-5,
    .semi-col-sm-5,
    .semi-col-md-5,
    .semi-col-lg-5,
    .semi-col-6,
    .semi-col-xs-6,
    .semi-col-sm-6,
    .semi-col-md-6,
    .semi-col-lg-6,
    .semi-col-7,
    .semi-col-xs-7,
    .semi-col-sm-7,
    .semi-col-md-7,
    .semi-col-lg-7,
    .semi-col-8,
    .semi-col-xs-8,
    .semi-col-sm-8,
    .semi-col-md-8,
    .semi-col-lg-8,
    .semi-col-9,
    .semi-col-xs-9,
    .semi-col-sm-9,
    .semi-col-md-9,
    .semi-col-lg-9,
    .semi-col-10,
    .semi-col-xs-10,
    .semi-col-sm-10,
    .semi-col-md-10,
    .semi-col-lg-10,
    .semi-col-11,
    .semi-col-xs-11,
    .semi-col-sm-11,
    .semi-col-md-11,
    .semi-col-lg-11,
    .semi-col-12,
    .semi-col-xs-12,
    .semi-col-sm-12,
    .semi-col-md-12,
    .semi-col-lg-12,
    .semi-col-13,
    .semi-col-xs-13,
    .semi-col-sm-13,
    .semi-col-md-13,
    .semi-col-lg-13,
    .semi-col-14,
    .semi-col-xs-14,
    .semi-col-sm-14,
    .semi-col-md-14,
    .semi-col-lg-14,
    .semi-col-15,
    .semi-col-xs-15,
    .semi-col-sm-15,
    .semi-col-md-15,
    .semi-col-lg-15,
    .semi-col-16,
    .semi-col-xs-16,
    .semi-col-sm-16,
    .semi-col-md-16,
    .semi-col-lg-16,
    .semi-col-17,
    .semi-col-xs-17,
    .semi-col-sm-17,
    .semi-col-md-17,
    .semi-col-lg-17,
    .semi-col-18,
    .semi-col-xs-18,
    .semi-col-sm-18,
    .semi-col-md-18,
    .semi-col-lg-18,
    .semi-col-19,
    .semi-col-xs-19,
    .semi-col-sm-19,
    .semi-col-md-19,
    .semi-col-lg-19,
    .semi-col-20,
    .semi-col-xs-20,
    .semi-col-sm-20,
    .semi-col-md-20,
    .semi-col-lg-20,
    .semi-col-21,
    .semi-col-xs-21,
    .semi-col-sm-21,
    .semi-col-md-21,
    .semi-col-lg-21,
    .semi-col-22,
    .semi-col-xs-22,
    .semi-col-sm-22,
    .semi-col-md-22,
    .semi-col-lg-22,
    .semi-col-23,
    .semi-col-xs-23,
    .semi-col-sm-23,
    .semi-col-md-23,
    .semi-col-lg-23,
    .semi-col-24,
    .semi-col-xs-24,
    .semi-col-sm-24,
    .semi-col-md-24,
    .semi-col-lg-24 {
        min-height: 1px;
        padding-left: 0;
        padding-right: 0;
        position: relative
    }

    .semi-col-1,
    .semi-col-2,
    .semi-col-3,
    .semi-col-4,
    .semi-col-5,
    .semi-col-6,
    .semi-col-7,
    .semi-col-8,
    .semi-col-9,
    .semi-col-10,
    .semi-col-11,
    .semi-col-12,
    .semi-col-13,
    .semi-col-14,
    .semi-col-15,
    .semi-col-16,
    .semi-col-17,
    .semi-col-18,
    .semi-col-19,
    .semi-col-20,
    .semi-col-21,
    .semi-col-22,
    .semi-col-23,
    .semi-col-24 {
        float: left;
        flex: none
    }

    .semi-col-1 {
        box-sizing: border-box;
        width: 4.16667%;
        display: block
    }

    .semi-col-push-1 {
        left: 4.16667%
    }

    .semi-col-pull-1 {
        right: 4.16667%
    }

    .semi-col-offset-1 {
        margin-left: 4.16667%
    }

    .semi-col-order-1 {
        order: 1
    }

    .semi-col-2 {
        box-sizing: border-box;
        width: 8.33333%;
        display: block
    }

    .semi-col-push-2 {
        left: 8.33333%
    }

    .semi-col-pull-2 {
        right: 8.33333%
    }

    .semi-col-offset-2 {
        margin-left: 8.33333%
    }

    .semi-col-order-2 {
        order: 2
    }

    .semi-col-3 {
        box-sizing: border-box;
        width: 12.5%;
        display: block
    }

    .semi-col-push-3 {
        left: 12.5%
    }

    .semi-col-pull-3 {
        right: 12.5%
    }

    .semi-col-offset-3 {
        margin-left: 12.5%
    }

    .semi-col-order-3 {
        order: 3
    }

    .semi-col-4 {
        box-sizing: border-box;
        width: 16.6667%;
        display: block
    }

    .semi-col-push-4 {
        left: 16.6667%
    }

    .semi-col-pull-4 {
        right: 16.6667%
    }

    .semi-col-offset-4 {
        margin-left: 16.6667%
    }

    .semi-col-order-4 {
        order: 4
    }

    .semi-col-5 {
        box-sizing: border-box;
        width: 20.8333%;
        display: block
    }

    .semi-col-push-5 {
        left: 20.8333%
    }

    .semi-col-pull-5 {
        right: 20.8333%
    }

    .semi-col-offset-5 {
        margin-left: 20.8333%
    }

    .semi-col-order-5 {
        order: 5
    }

    .semi-col-6 {
        box-sizing: border-box;
        width: 25%;
        display: block
    }

    .semi-col-push-6 {
        left: 25%
    }

    .semi-col-pull-6 {
        right: 25%
    }

    .semi-col-offset-6 {
        margin-left: 25%
    }

    .semi-col-order-6 {
        order: 6
    }

    .semi-col-7 {
        box-sizing: border-box;
        width: 29.1667%;
        display: block
    }

    .semi-col-push-7 {
        left: 29.1667%
    }

    .semi-col-pull-7 {
        right: 29.1667%
    }

    .semi-col-offset-7 {
        margin-left: 29.1667%
    }

    .semi-col-order-7 {
        order: 7
    }

    .semi-col-8 {
        box-sizing: border-box;
        width: 33.3333%;
        display: block
    }

    .semi-col-push-8 {
        left: 33.3333%
    }

    .semi-col-pull-8 {
        right: 33.3333%
    }

    .semi-col-offset-8 {
        margin-left: 33.3333%
    }

    .semi-col-order-8 {
        order: 8
    }

    .semi-col-9 {
        box-sizing: border-box;
        width: 37.5%;
        display: block
    }

    .semi-col-push-9 {
        left: 37.5%
    }

    .semi-col-pull-9 {
        right: 37.5%
    }

    .semi-col-offset-9 {
        margin-left: 37.5%
    }

    .semi-col-order-9 {
        order: 9
    }

    .semi-col-10 {
        box-sizing: border-box;
        width: 41.6667%;
        display: block
    }

    .semi-col-push-10 {
        left: 41.6667%
    }

    .semi-col-pull-10 {
        right: 41.6667%
    }

    .semi-col-offset-10 {
        margin-left: 41.6667%
    }

    .semi-col-order-10 {
        order: 10
    }

    .semi-col-11 {
        box-sizing: border-box;
        width: 45.8333%;
        display: block
    }

    .semi-col-push-11 {
        left: 45.8333%
    }

    .semi-col-pull-11 {
        right: 45.8333%
    }

    .semi-col-offset-11 {
        margin-left: 45.8333%
    }

    .semi-col-order-11 {
        order: 11
    }

    .semi-col-12 {
        box-sizing: border-box;
        width: 50%;
        display: block
    }

    .semi-col-push-12 {
        left: 50%
    }

    .semi-col-pull-12 {
        right: 50%
    }

    .semi-col-offset-12 {
        margin-left: 50%
    }

    .semi-col-order-12 {
        order: 12
    }

    .semi-col-13 {
        box-sizing: border-box;
        width: 54.1667%;
        display: block
    }

    .semi-col-push-13 {
        left: 54.1667%
    }

    .semi-col-pull-13 {
        right: 54.1667%
    }

    .semi-col-offset-13 {
        margin-left: 54.1667%
    }

    .semi-col-order-13 {
        order: 13
    }

    .semi-col-14 {
        box-sizing: border-box;
        width: 58.3333%;
        display: block
    }

    .semi-col-push-14 {
        left: 58.3333%
    }

    .semi-col-pull-14 {
        right: 58.3333%
    }

    .semi-col-offset-14 {
        margin-left: 58.3333%
    }

    .semi-col-order-14 {
        order: 14
    }

    .semi-col-15 {
        box-sizing: border-box;
        width: 62.5%;
        display: block
    }

    .semi-col-push-15 {
        left: 62.5%
    }

    .semi-col-pull-15 {
        right: 62.5%
    }

    .semi-col-offset-15 {
        margin-left: 62.5%
    }

    .semi-col-order-15 {
        order: 15
    }

    .semi-col-16 {
        box-sizing: border-box;
        width: 66.6667%;
        display: block
    }

    .semi-col-push-16 {
        left: 66.6667%
    }

    .semi-col-pull-16 {
        right: 66.6667%
    }

    .semi-col-offset-16 {
        margin-left: 66.6667%
    }

    .semi-col-order-16 {
        order: 16
    }

    .semi-col-17 {
        box-sizing: border-box;
        width: 70.8333%;
        display: block
    }

    .semi-col-push-17 {
        left: 70.8333%
    }

    .semi-col-pull-17 {
        right: 70.8333%
    }

    .semi-col-offset-17 {
        margin-left: 70.8333%
    }

    .semi-col-order-17 {
        order: 17
    }

    .semi-col-18 {
        box-sizing: border-box;
        width: 75%;
        display: block
    }

    .semi-col-push-18 {
        left: 75%
    }

    .semi-col-pull-18 {
        right: 75%
    }

    .semi-col-offset-18 {
        margin-left: 75%
    }

    .semi-col-order-18 {
        order: 18
    }

    .semi-col-19 {
        box-sizing: border-box;
        width: 79.1667%;
        display: block
    }

    .semi-col-push-19 {
        left: 79.1667%
    }

    .semi-col-pull-19 {
        right: 79.1667%
    }

    .semi-col-offset-19 {
        margin-left: 79.1667%
    }

    .semi-col-order-19 {
        order: 19
    }

    .semi-col-20 {
        box-sizing: border-box;
        width: 83.3333%;
        display: block
    }

    .semi-col-push-20 {
        left: 83.3333%
    }

    .semi-col-pull-20 {
        right: 83.3333%
    }

    .semi-col-offset-20 {
        margin-left: 83.3333%
    }

    .semi-col-order-20 {
        order: 20
    }

    .semi-col-21 {
        box-sizing: border-box;
        width: 87.5%;
        display: block
    }

    .semi-col-push-21 {
        left: 87.5%
    }

    .semi-col-pull-21 {
        right: 87.5%
    }

    .semi-col-offset-21 {
        margin-left: 87.5%
    }

    .semi-col-order-21 {
        order: 21
    }

    .semi-col-22 {
        box-sizing: border-box;
        width: 91.6667%;
        display: block
    }

    .semi-col-push-22 {
        left: 91.6667%
    }

    .semi-col-pull-22 {
        right: 91.6667%
    }

    .semi-col-offset-22 {
        margin-left: 91.6667%
    }

    .semi-col-order-22 {
        order: 22
    }

    .semi-col-23 {
        box-sizing: border-box;
        width: 95.8333%;
        display: block
    }

    .semi-col-push-23 {
        left: 95.8333%
    }

    .semi-col-pull-23 {
        right: 95.8333%
    }

    .semi-col-offset-23 {
        margin-left: 95.8333%
    }

    .semi-col-order-23 {
        order: 23
    }

    .semi-col-24 {
        box-sizing: border-box;
        width: 100%;
        display: block
    }

    .semi-col-push-24 {
        left: 100%
    }

    .semi-col-pull-24 {
        right: 100%
    }

    .semi-col-offset-24 {
        margin-left: 100%
    }

    .semi-col-order-24 {
        order: 24
    }

    .semi-rtl .semi-col-1,
    .semi-rtl .semi-col-2,
    .semi-rtl .semi-col-3,
    .semi-rtl .semi-col-4,
    .semi-rtl .semi-col-5,
    .semi-rtl .semi-col-6,
    .semi-rtl .semi-col-7,
    .semi-rtl .semi-col-8,
    .semi-rtl .semi-col-9,
    .semi-rtl .semi-col-10,
    .semi-rtl .semi-col-11,
    .semi-rtl .semi-col-12,
    .semi-rtl .semi-col-13,
    .semi-rtl .semi-col-14,
    .semi-rtl .semi-col-15,
    .semi-rtl .semi-col-16,
    .semi-rtl .semi-col-17,
    .semi-rtl .semi-col-18,
    .semi-rtl .semi-col-19,
    .semi-rtl .semi-col-20,
    .semi-rtl .semi-col-21,
    .semi-rtl .semi-col-22,
    .semi-rtl .semi-col-23,
    .semi-rtl .semi-col-24 {
        float: right
    }

    .semi-rtl .semi-col-offset-1 {
        margin-left: auto;
        margin-right: 4.16667%
    }

    .semi-rtl .semi-col-offset-2 {
        margin-left: auto;
        margin-right: 8.33333%
    }

    .semi-rtl .semi-col-offset-3 {
        margin-left: auto;
        margin-right: 12.5%
    }

    .semi-rtl .semi-col-offset-4 {
        margin-left: auto;
        margin-right: 16.6667%
    }

    .semi-rtl .semi-col-offset-5 {
        margin-left: auto;
        margin-right: 20.8333%
    }

    .semi-rtl .semi-col-offset-6 {
        margin-left: auto;
        margin-right: 25%
    }

    .semi-rtl .semi-col-offset-7 {
        margin-left: auto;
        margin-right: 29.1667%
    }

    .semi-rtl .semi-col-offset-8 {
        margin-left: auto;
        margin-right: 33.3333%
    }

    .semi-rtl .semi-col-offset-9 {
        margin-left: auto;
        margin-right: 37.5%
    }

    .semi-rtl .semi-col-offset-10 {
        margin-left: auto;
        margin-right: 41.6667%
    }

    .semi-rtl .semi-col-offset-11 {
        margin-left: auto;
        margin-right: 45.8333%
    }

    .semi-rtl .semi-col-offset-12 {
        margin-left: auto;
        margin-right: 50%
    }

    .semi-rtl .semi-col-offset-13 {
        margin-left: auto;
        margin-right: 54.1667%
    }

    .semi-rtl .semi-col-offset-14 {
        margin-left: auto;
        margin-right: 58.3333%
    }

    .semi-rtl .semi-col-offset-15 {
        margin-left: auto;
        margin-right: 62.5%
    }

    .semi-rtl .semi-col-offset-16 {
        margin-left: auto;
        margin-right: 66.6667%
    }

    .semi-rtl .semi-col-offset-17 {
        margin-left: auto;
        margin-right: 70.8333%
    }

    .semi-rtl .semi-col-offset-18 {
        margin-left: auto;
        margin-right: 75%
    }

    .semi-rtl .semi-col-offset-19 {
        margin-left: auto;
        margin-right: 79.1667%
    }

    .semi-rtl .semi-col-offset-20 {
        margin-left: auto;
        margin-right: 83.3333%
    }

    .semi-rtl .semi-col-offset-21 {
        margin-left: auto;
        margin-right: 87.5%
    }

    .semi-rtl .semi-col-offset-22 {
        margin-left: auto;
        margin-right: 91.6667%
    }

    .semi-rtl .semi-col-offset-23 {
        margin-left: auto;
        margin-right: 95.8333%
    }

    .semi-rtl .semi-col-offset-24 {
        margin-left: auto;
        margin-right: 100%
    }

    .semi-col-xs-1,
    .semi-col-xs-2,
    .semi-col-xs-3,
    .semi-col-xs-4,
    .semi-col-xs-5,
    .semi-col-xs-6,
    .semi-col-xs-7,
    .semi-col-xs-8,
    .semi-col-xs-9,
    .semi-col-xs-10,
    .semi-col-xs-11,
    .semi-col-xs-12,
    .semi-col-xs-13,
    .semi-col-xs-14,
    .semi-col-xs-15,
    .semi-col-xs-16,
    .semi-col-xs-17,
    .semi-col-xs-18,
    .semi-col-xs-19,
    .semi-col-xs-20,
    .semi-col-xs-21,
    .semi-col-xs-22,
    .semi-col-xs-23,
    .semi-col-xs-24 {
        float: left;
        flex: none
    }

    .semi-col-xs-1 {
        box-sizing: border-box;
        width: 4.16667%;
        display: block
    }

    .semi-col-xs-push-1 {
        left: 4.16667%
    }

    .semi-col-xs-pull-1 {
        right: 4.16667%
    }

    .semi-col-xs-offset-1 {
        margin-left: 4.16667%
    }

    .semi-col-xs-order-1 {
        order: 1
    }

    .semi-col-xs-2 {
        box-sizing: border-box;
        width: 8.33333%;
        display: block
    }

    .semi-col-xs-push-2 {
        left: 8.33333%
    }

    .semi-col-xs-pull-2 {
        right: 8.33333%
    }

    .semi-col-xs-offset-2 {
        margin-left: 8.33333%
    }

    .semi-col-xs-order-2 {
        order: 2
    }

    .semi-col-xs-3 {
        box-sizing: border-box;
        width: 12.5%;
        display: block
    }

    .semi-col-xs-push-3 {
        left: 12.5%
    }

    .semi-col-xs-pull-3 {
        right: 12.5%
    }

    .semi-col-xs-offset-3 {
        margin-left: 12.5%
    }

    .semi-col-xs-order-3 {
        order: 3
    }

    .semi-col-xs-4 {
        box-sizing: border-box;
        width: 16.6667%;
        display: block
    }

    .semi-col-xs-push-4 {
        left: 16.6667%
    }

    .semi-col-xs-pull-4 {
        right: 16.6667%
    }

    .semi-col-xs-offset-4 {
        margin-left: 16.6667%
    }

    .semi-col-xs-order-4 {
        order: 4
    }

    .semi-col-xs-5 {
        box-sizing: border-box;
        width: 20.8333%;
        display: block
    }

    .semi-col-xs-push-5 {
        left: 20.8333%
    }

    .semi-col-xs-pull-5 {
        right: 20.8333%
    }

    .semi-col-xs-offset-5 {
        margin-left: 20.8333%
    }

    .semi-col-xs-order-5 {
        order: 5
    }

    .semi-col-xs-6 {
        box-sizing: border-box;
        width: 25%;
        display: block
    }

    .semi-col-xs-push-6 {
        left: 25%
    }

    .semi-col-xs-pull-6 {
        right: 25%
    }

    .semi-col-xs-offset-6 {
        margin-left: 25%
    }

    .semi-col-xs-order-6 {
        order: 6
    }

    .semi-col-xs-7 {
        box-sizing: border-box;
        width: 29.1667%;
        display: block
    }

    .semi-col-xs-push-7 {
        left: 29.1667%
    }

    .semi-col-xs-pull-7 {
        right: 29.1667%
    }

    .semi-col-xs-offset-7 {
        margin-left: 29.1667%
    }

    .semi-col-xs-order-7 {
        order: 7
    }

    .semi-col-xs-8 {
        box-sizing: border-box;
        width: 33.3333%;
        display: block
    }

    .semi-col-xs-push-8 {
        left: 33.3333%
    }

    .semi-col-xs-pull-8 {
        right: 33.3333%
    }

    .semi-col-xs-offset-8 {
        margin-left: 33.3333%
    }

    .semi-col-xs-order-8 {
        order: 8
    }

    .semi-col-xs-9 {
        box-sizing: border-box;
        width: 37.5%;
        display: block
    }

    .semi-col-xs-push-9 {
        left: 37.5%
    }

    .semi-col-xs-pull-9 {
        right: 37.5%
    }

    .semi-col-xs-offset-9 {
        margin-left: 37.5%
    }

    .semi-col-xs-order-9 {
        order: 9
    }

    .semi-col-xs-10 {
        box-sizing: border-box;
        width: 41.6667%;
        display: block
    }

    .semi-col-xs-push-10 {
        left: 41.6667%
    }

    .semi-col-xs-pull-10 {
        right: 41.6667%
    }

    .semi-col-xs-offset-10 {
        margin-left: 41.6667%
    }

    .semi-col-xs-order-10 {
        order: 10
    }

    .semi-col-xs-11 {
        box-sizing: border-box;
        width: 45.8333%;
        display: block
    }

    .semi-col-xs-push-11 {
        left: 45.8333%
    }

    .semi-col-xs-pull-11 {
        right: 45.8333%
    }

    .semi-col-xs-offset-11 {
        margin-left: 45.8333%
    }

    .semi-col-xs-order-11 {
        order: 11
    }

    .semi-col-xs-12 {
        box-sizing: border-box;
        width: 50%;
        display: block
    }

    .semi-col-xs-push-12 {
        left: 50%
    }

    .semi-col-xs-pull-12 {
        right: 50%
    }

    .semi-col-xs-offset-12 {
        margin-left: 50%
    }

    .semi-col-xs-order-12 {
        order: 12
    }

    .semi-col-xs-13 {
        box-sizing: border-box;
        width: 54.1667%;
        display: block
    }

    .semi-col-xs-push-13 {
        left: 54.1667%
    }

    .semi-col-xs-pull-13 {
        right: 54.1667%
    }

    .semi-col-xs-offset-13 {
        margin-left: 54.1667%
    }

    .semi-col-xs-order-13 {
        order: 13
    }

    .semi-col-xs-14 {
        box-sizing: border-box;
        width: 58.3333%;
        display: block
    }

    .semi-col-xs-push-14 {
        left: 58.3333%
    }

    .semi-col-xs-pull-14 {
        right: 58.3333%
    }

    .semi-col-xs-offset-14 {
        margin-left: 58.3333%
    }

    .semi-col-xs-order-14 {
        order: 14
    }

    .semi-col-xs-15 {
        box-sizing: border-box;
        width: 62.5%;
        display: block
    }

    .semi-col-xs-push-15 {
        left: 62.5%
    }

    .semi-col-xs-pull-15 {
        right: 62.5%
    }

    .semi-col-xs-offset-15 {
        margin-left: 62.5%
    }

    .semi-col-xs-order-15 {
        order: 15
    }

    .semi-col-xs-16 {
        box-sizing: border-box;
        width: 66.6667%;
        display: block
    }

    .semi-col-xs-push-16 {
        left: 66.6667%
    }

    .semi-col-xs-pull-16 {
        right: 66.6667%
    }

    .semi-col-xs-offset-16 {
        margin-left: 66.6667%
    }

    .semi-col-xs-order-16 {
        order: 16
    }

    .semi-col-xs-17 {
        box-sizing: border-box;
        width: 70.8333%;
        display: block
    }

    .semi-col-xs-push-17 {
        left: 70.8333%
    }

    .semi-col-xs-pull-17 {
        right: 70.8333%
    }

    .semi-col-xs-offset-17 {
        margin-left: 70.8333%
    }

    .semi-col-xs-order-17 {
        order: 17
    }

    .semi-col-xs-18 {
        box-sizing: border-box;
        width: 75%;
        display: block
    }

    .semi-col-xs-push-18 {
        left: 75%
    }

    .semi-col-xs-pull-18 {
        right: 75%
    }

    .semi-col-xs-offset-18 {
        margin-left: 75%
    }

    .semi-col-xs-order-18 {
        order: 18
    }

    .semi-col-xs-19 {
        box-sizing: border-box;
        width: 79.1667%;
        display: block
    }

    .semi-col-xs-push-19 {
        left: 79.1667%
    }

    .semi-col-xs-pull-19 {
        right: 79.1667%
    }

    .semi-col-xs-offset-19 {
        margin-left: 79.1667%
    }

    .semi-col-xs-order-19 {
        order: 19
    }

    .semi-col-xs-20 {
        box-sizing: border-box;
        width: 83.3333%;
        display: block
    }

    .semi-col-xs-push-20 {
        left: 83.3333%
    }

    .semi-col-xs-pull-20 {
        right: 83.3333%
    }

    .semi-col-xs-offset-20 {
        margin-left: 83.3333%
    }

    .semi-col-xs-order-20 {
        order: 20
    }

    .semi-col-xs-21 {
        box-sizing: border-box;
        width: 87.5%;
        display: block
    }

    .semi-col-xs-push-21 {
        left: 87.5%
    }

    .semi-col-xs-pull-21 {
        right: 87.5%
    }

    .semi-col-xs-offset-21 {
        margin-left: 87.5%
    }

    .semi-col-xs-order-21 {
        order: 21
    }

    .semi-col-xs-22 {
        box-sizing: border-box;
        width: 91.6667%;
        display: block
    }

    .semi-col-xs-push-22 {
        left: 91.6667%
    }

    .semi-col-xs-pull-22 {
        right: 91.6667%
    }

    .semi-col-xs-offset-22 {
        margin-left: 91.6667%
    }

    .semi-col-xs-order-22 {
        order: 22
    }

    .semi-col-xs-23 {
        box-sizing: border-box;
        width: 95.8333%;
        display: block
    }

    .semi-col-xs-push-23 {
        left: 95.8333%
    }

    .semi-col-xs-pull-23 {
        right: 95.8333%
    }

    .semi-col-xs-offset-23 {
        margin-left: 95.8333%
    }

    .semi-col-xs-order-23 {
        order: 23
    }

    .semi-col-xs-24 {
        box-sizing: border-box;
        width: 100%;
        display: block
    }

    .semi-col-xs-push-24 {
        left: 100%
    }

    .semi-col-xs-pull-24 {
        right: 100%
    }

    .semi-col-xs-offset-24 {
        margin-left: 100%
    }

    .semi-col-xs-order-24 {
        order: 24
    }

    .semi-rtl .semi-col-xs-1,
    .semi-rtl .semi-col-xs-2,
    .semi-rtl .semi-col-xs-3,
    .semi-rtl .semi-col-xs-4,
    .semi-rtl .semi-col-xs-5,
    .semi-rtl .semi-col-xs-6,
    .semi-rtl .semi-col-xs-7,
    .semi-rtl .semi-col-xs-8,
    .semi-rtl .semi-col-xs-9,
    .semi-rtl .semi-col-xs-10,
    .semi-rtl .semi-col-xs-11,
    .semi-rtl .semi-col-xs-12,
    .semi-rtl .semi-col-xs-13,
    .semi-rtl .semi-col-xs-14,
    .semi-rtl .semi-col-xs-15,
    .semi-rtl .semi-col-xs-16,
    .semi-rtl .semi-col-xs-17,
    .semi-rtl .semi-col-xs-18,
    .semi-rtl .semi-col-xs-19,
    .semi-rtl .semi-col-xs-20,
    .semi-rtl .semi-col-xs-21,
    .semi-rtl .semi-col-xs-22,
    .semi-rtl .semi-col-xs-23,
    .semi-rtl .semi-col-xs-24 {
        float: right
    }

    .semi-rtl .semi-col-xs-offset-1 {
        margin-left: auto;
        margin-right: 4.16667%
    }

    .semi-rtl .semi-col-xs-offset-2 {
        margin-left: auto;
        margin-right: 8.33333%
    }

    .semi-rtl .semi-col-xs-offset-3 {
        margin-left: auto;
        margin-right: 12.5%
    }

    .semi-rtl .semi-col-xs-offset-4 {
        margin-left: auto;
        margin-right: 16.6667%
    }

    .semi-rtl .semi-col-xs-offset-5 {
        margin-left: auto;
        margin-right: 20.8333%
    }

    .semi-rtl .semi-col-xs-offset-6 {
        margin-left: auto;
        margin-right: 25%
    }

    .semi-rtl .semi-col-xs-offset-7 {
        margin-left: auto;
        margin-right: 29.1667%
    }

    .semi-rtl .semi-col-xs-offset-8 {
        margin-left: auto;
        margin-right: 33.3333%
    }

    .semi-rtl .semi-col-xs-offset-9 {
        margin-left: auto;
        margin-right: 37.5%
    }

    .semi-rtl .semi-col-xs-offset-10 {
        margin-left: auto;
        margin-right: 41.6667%
    }

    .semi-rtl .semi-col-xs-offset-11 {
        margin-left: auto;
        margin-right: 45.8333%
    }

    .semi-rtl .semi-col-xs-offset-12 {
        margin-left: auto;
        margin-right: 50%
    }

    .semi-rtl .semi-col-xs-offset-13 {
        margin-left: auto;
        margin-right: 54.1667%
    }

    .semi-rtl .semi-col-xs-offset-14 {
        margin-left: auto;
        margin-right: 58.3333%
    }

    .semi-rtl .semi-col-xs-offset-15 {
        margin-left: auto;
        margin-right: 62.5%
    }

    .semi-rtl .semi-col-xs-offset-16 {
        margin-left: auto;
        margin-right: 66.6667%
    }

    .semi-rtl .semi-col-xs-offset-17 {
        margin-left: auto;
        margin-right: 70.8333%
    }

    .semi-rtl .semi-col-xs-offset-18 {
        margin-left: auto;
        margin-right: 75%
    }

    .semi-rtl .semi-col-xs-offset-19 {
        margin-left: auto;
        margin-right: 79.1667%
    }

    .semi-rtl .semi-col-xs-offset-20 {
        margin-left: auto;
        margin-right: 83.3333%
    }

    .semi-rtl .semi-col-xs-offset-21 {
        margin-left: auto;
        margin-right: 87.5%
    }

    .semi-rtl .semi-col-xs-offset-22 {
        margin-left: auto;
        margin-right: 91.6667%
    }

    .semi-rtl .semi-col-xs-offset-23 {
        margin-left: auto;
        margin-right: 95.8333%
    }

    .semi-rtl .semi-col-xs-offset-24 {
        margin-left: auto;
        margin-right: 100%
    }

    @media (min-width:576px) {

        .semi-col-sm-1,
        .semi-col-sm-2,
        .semi-col-sm-3,
        .semi-col-sm-4,
        .semi-col-sm-5,
        .semi-col-sm-6,
        .semi-col-sm-7,
        .semi-col-sm-8,
        .semi-col-sm-9,
        .semi-col-sm-10,
        .semi-col-sm-11,
        .semi-col-sm-12,
        .semi-col-sm-13,
        .semi-col-sm-14,
        .semi-col-sm-15,
        .semi-col-sm-16,
        .semi-col-sm-17,
        .semi-col-sm-18,
        .semi-col-sm-19,
        .semi-col-sm-20,
        .semi-col-sm-21,
        .semi-col-sm-22,
        .semi-col-sm-23,
        .semi-col-sm-24 {
            float: left;
            flex: none
        }

        .semi-col-sm-1 {
            box-sizing: border-box;
            width: 4.16667%;
            display: block
        }

        .semi-col-sm-push-1 {
            left: 4.16667%
        }

        .semi-col-sm-pull-1 {
            right: 4.16667%
        }

        .semi-col-sm-offset-1 {
            margin-left: 4.16667%
        }

        .semi-col-sm-order-1 {
            order: 1
        }

        .semi-col-sm-2 {
            box-sizing: border-box;
            width: 8.33333%;
            display: block
        }

        .semi-col-sm-push-2 {
            left: 8.33333%
        }

        .semi-col-sm-pull-2 {
            right: 8.33333%
        }

        .semi-col-sm-offset-2 {
            margin-left: 8.33333%
        }

        .semi-col-sm-order-2 {
            order: 2
        }

        .semi-col-sm-3 {
            box-sizing: border-box;
            width: 12.5%;
            display: block
        }

        .semi-col-sm-push-3 {
            left: 12.5%
        }

        .semi-col-sm-pull-3 {
            right: 12.5%
        }

        .semi-col-sm-offset-3 {
            margin-left: 12.5%
        }

        .semi-col-sm-order-3 {
            order: 3
        }

        .semi-col-sm-4 {
            box-sizing: border-box;
            width: 16.6667%;
            display: block
        }

        .semi-col-sm-push-4 {
            left: 16.6667%
        }

        .semi-col-sm-pull-4 {
            right: 16.6667%
        }

        .semi-col-sm-offset-4 {
            margin-left: 16.6667%
        }

        .semi-col-sm-order-4 {
            order: 4
        }

        .semi-col-sm-5 {
            box-sizing: border-box;
            width: 20.8333%;
            display: block
        }

        .semi-col-sm-push-5 {
            left: 20.8333%
        }

        .semi-col-sm-pull-5 {
            right: 20.8333%
        }

        .semi-col-sm-offset-5 {
            margin-left: 20.8333%
        }

        .semi-col-sm-order-5 {
            order: 5
        }

        .semi-col-sm-6 {
            box-sizing: border-box;
            width: 25%;
            display: block
        }

        .semi-col-sm-push-6 {
            left: 25%
        }

        .semi-col-sm-pull-6 {
            right: 25%
        }

        .semi-col-sm-offset-6 {
            margin-left: 25%
        }

        .semi-col-sm-order-6 {
            order: 6
        }

        .semi-col-sm-7 {
            box-sizing: border-box;
            width: 29.1667%;
            display: block
        }

        .semi-col-sm-push-7 {
            left: 29.1667%
        }

        .semi-col-sm-pull-7 {
            right: 29.1667%
        }

        .semi-col-sm-offset-7 {
            margin-left: 29.1667%
        }

        .semi-col-sm-order-7 {
            order: 7
        }

        .semi-col-sm-8 {
            box-sizing: border-box;
            width: 33.3333%;
            display: block
        }

        .semi-col-sm-push-8 {
            left: 33.3333%
        }

        .semi-col-sm-pull-8 {
            right: 33.3333%
        }

        .semi-col-sm-offset-8 {
            margin-left: 33.3333%
        }

        .semi-col-sm-order-8 {
            order: 8
        }

        .semi-col-sm-9 {
            box-sizing: border-box;
            width: 37.5%;
            display: block
        }

        .semi-col-sm-push-9 {
            left: 37.5%
        }

        .semi-col-sm-pull-9 {
            right: 37.5%
        }

        .semi-col-sm-offset-9 {
            margin-left: 37.5%
        }

        .semi-col-sm-order-9 {
            order: 9
        }

        .semi-col-sm-10 {
            box-sizing: border-box;
            width: 41.6667%;
            display: block
        }

        .semi-col-sm-push-10 {
            left: 41.6667%
        }

        .semi-col-sm-pull-10 {
            right: 41.6667%
        }

        .semi-col-sm-offset-10 {
            margin-left: 41.6667%
        }

        .semi-col-sm-order-10 {
            order: 10
        }

        .semi-col-sm-11 {
            box-sizing: border-box;
            width: 45.8333%;
            display: block
        }

        .semi-col-sm-push-11 {
            left: 45.8333%
        }

        .semi-col-sm-pull-11 {
            right: 45.8333%
        }

        .semi-col-sm-offset-11 {
            margin-left: 45.8333%
        }

        .semi-col-sm-order-11 {
            order: 11
        }

        .semi-col-sm-12 {
            box-sizing: border-box;
            width: 50%;
            display: block
        }

        .semi-col-sm-push-12 {
            left: 50%
        }

        .semi-col-sm-pull-12 {
            right: 50%
        }

        .semi-col-sm-offset-12 {
            margin-left: 50%
        }

        .semi-col-sm-order-12 {
            order: 12
        }

        .semi-col-sm-13 {
            box-sizing: border-box;
            width: 54.1667%;
            display: block
        }

        .semi-col-sm-push-13 {
            left: 54.1667%
        }

        .semi-col-sm-pull-13 {
            right: 54.1667%
        }

        .semi-col-sm-offset-13 {
            margin-left: 54.1667%
        }

        .semi-col-sm-order-13 {
            order: 13
        }

        .semi-col-sm-14 {
            box-sizing: border-box;
            width: 58.3333%;
            display: block
        }

        .semi-col-sm-push-14 {
            left: 58.3333%
        }

        .semi-col-sm-pull-14 {
            right: 58.3333%
        }

        .semi-col-sm-offset-14 {
            margin-left: 58.3333%
        }

        .semi-col-sm-order-14 {
            order: 14
        }

        .semi-col-sm-15 {
            box-sizing: border-box;
            width: 62.5%;
            display: block
        }

        .semi-col-sm-push-15 {
            left: 62.5%
        }

        .semi-col-sm-pull-15 {
            right: 62.5%
        }

        .semi-col-sm-offset-15 {
            margin-left: 62.5%
        }

        .semi-col-sm-order-15 {
            order: 15
        }

        .semi-col-sm-16 {
            box-sizing: border-box;
            width: 66.6667%;
            display: block
        }

        .semi-col-sm-push-16 {
            left: 66.6667%
        }

        .semi-col-sm-pull-16 {
            right: 66.6667%
        }

        .semi-col-sm-offset-16 {
            margin-left: 66.6667%
        }

        .semi-col-sm-order-16 {
            order: 16
        }

        .semi-col-sm-17 {
            box-sizing: border-box;
            width: 70.8333%;
            display: block
        }

        .semi-col-sm-push-17 {
            left: 70.8333%
        }

        .semi-col-sm-pull-17 {
            right: 70.8333%
        }

        .semi-col-sm-offset-17 {
            margin-left: 70.8333%
        }

        .semi-col-sm-order-17 {
            order: 17
        }

        .semi-col-sm-18 {
            box-sizing: border-box;
            width: 75%;
            display: block
        }

        .semi-col-sm-push-18 {
            left: 75%
        }

        .semi-col-sm-pull-18 {
            right: 75%
        }

        .semi-col-sm-offset-18 {
            margin-left: 75%
        }

        .semi-col-sm-order-18 {
            order: 18
        }

        .semi-col-sm-19 {
            box-sizing: border-box;
            width: 79.1667%;
            display: block
        }

        .semi-col-sm-push-19 {
            left: 79.1667%
        }

        .semi-col-sm-pull-19 {
            right: 79.1667%
        }

        .semi-col-sm-offset-19 {
            margin-left: 79.1667%
        }

        .semi-col-sm-order-19 {
            order: 19
        }

        .semi-col-sm-20 {
            box-sizing: border-box;
            width: 83.3333%;
            display: block
        }

        .semi-col-sm-push-20 {
            left: 83.3333%
        }

        .semi-col-sm-pull-20 {
            right: 83.3333%
        }

        .semi-col-sm-offset-20 {
            margin-left: 83.3333%
        }

        .semi-col-sm-order-20 {
            order: 20
        }

        .semi-col-sm-21 {
            box-sizing: border-box;
            width: 87.5%;
            display: block
        }

        .semi-col-sm-push-21 {
            left: 87.5%
        }

        .semi-col-sm-pull-21 {
            right: 87.5%
        }

        .semi-col-sm-offset-21 {
            margin-left: 87.5%
        }

        .semi-col-sm-order-21 {
            order: 21
        }

        .semi-col-sm-22 {
            box-sizing: border-box;
            width: 91.6667%;
            display: block
        }

        .semi-col-sm-push-22 {
            left: 91.6667%
        }

        .semi-col-sm-pull-22 {
            right: 91.6667%
        }

        .semi-col-sm-offset-22 {
            margin-left: 91.6667%
        }

        .semi-col-sm-order-22 {
            order: 22
        }

        .semi-col-sm-23 {
            box-sizing: border-box;
            width: 95.8333%;
            display: block
        }

        .semi-col-sm-push-23 {
            left: 95.8333%
        }

        .semi-col-sm-pull-23 {
            right: 95.8333%
        }

        .semi-col-sm-offset-23 {
            margin-left: 95.8333%
        }

        .semi-col-sm-order-23 {
            order: 23
        }

        .semi-col-sm-24 {
            box-sizing: border-box;
            width: 100%;
            display: block
        }

        .semi-col-sm-push-24 {
            left: 100%
        }

        .semi-col-sm-pull-24 {
            right: 100%
        }

        .semi-col-sm-offset-24 {
            margin-left: 100%
        }

        .semi-col-sm-order-24 {
            order: 24
        }

        .semi-rtl .semi-col-sm-1,
        .semi-rtl .semi-col-sm-2,
        .semi-rtl .semi-col-sm-3,
        .semi-rtl .semi-col-sm-4,
        .semi-rtl .semi-col-sm-5,
        .semi-rtl .semi-col-sm-6,
        .semi-rtl .semi-col-sm-7,
        .semi-rtl .semi-col-sm-8,
        .semi-rtl .semi-col-sm-9,
        .semi-rtl .semi-col-sm-10,
        .semi-rtl .semi-col-sm-11,
        .semi-rtl .semi-col-sm-12,
        .semi-rtl .semi-col-sm-13,
        .semi-rtl .semi-col-sm-14,
        .semi-rtl .semi-col-sm-15,
        .semi-rtl .semi-col-sm-16,
        .semi-rtl .semi-col-sm-17,
        .semi-rtl .semi-col-sm-18,
        .semi-rtl .semi-col-sm-19,
        .semi-rtl .semi-col-sm-20,
        .semi-rtl .semi-col-sm-21,
        .semi-rtl .semi-col-sm-22,
        .semi-rtl .semi-col-sm-23,
        .semi-rtl .semi-col-sm-24 {
            float: right
        }

        .semi-rtl .semi-col-sm-offset-1 {
            margin-left: auto;
            margin-right: 4.16667%
        }

        .semi-rtl .semi-col-sm-offset-2 {
            margin-left: auto;
            margin-right: 8.33333%
        }

        .semi-rtl .semi-col-sm-offset-3 {
            margin-left: auto;
            margin-right: 12.5%
        }

        .semi-rtl .semi-col-sm-offset-4 {
            margin-left: auto;
            margin-right: 16.6667%
        }

        .semi-rtl .semi-col-sm-offset-5 {
            margin-left: auto;
            margin-right: 20.8333%
        }

        .semi-rtl .semi-col-sm-offset-6 {
            margin-left: auto;
            margin-right: 25%
        }

        .semi-rtl .semi-col-sm-offset-7 {
            margin-left: auto;
            margin-right: 29.1667%
        }

        .semi-rtl .semi-col-sm-offset-8 {
            margin-left: auto;
            margin-right: 33.3333%
        }

        .semi-rtl .semi-col-sm-offset-9 {
            margin-left: auto;
            margin-right: 37.5%
        }

        .semi-rtl .semi-col-sm-offset-10 {
            margin-left: auto;
            margin-right: 41.6667%
        }

        .semi-rtl .semi-col-sm-offset-11 {
            margin-left: auto;
            margin-right: 45.8333%
        }

        .semi-rtl .semi-col-sm-offset-12 {
            margin-left: auto;
            margin-right: 50%
        }

        .semi-rtl .semi-col-sm-offset-13 {
            margin-left: auto;
            margin-right: 54.1667%
        }

        .semi-rtl .semi-col-sm-offset-14 {
            margin-left: auto;
            margin-right: 58.3333%
        }

        .semi-rtl .semi-col-sm-offset-15 {
            margin-left: auto;
            margin-right: 62.5%
        }

        .semi-rtl .semi-col-sm-offset-16 {
            margin-left: auto;
            margin-right: 66.6667%
        }

        .semi-rtl .semi-col-sm-offset-17 {
            margin-left: auto;
            margin-right: 70.8333%
        }

        .semi-rtl .semi-col-sm-offset-18 {
            margin-left: auto;
            margin-right: 75%
        }

        .semi-rtl .semi-col-sm-offset-19 {
            margin-left: auto;
            margin-right: 79.1667%
        }

        .semi-rtl .semi-col-sm-offset-20 {
            margin-left: auto;
            margin-right: 83.3333%
        }

        .semi-rtl .semi-col-sm-offset-21 {
            margin-left: auto;
            margin-right: 87.5%
        }

        .semi-rtl .semi-col-sm-offset-22 {
            margin-left: auto;
            margin-right: 91.6667%
        }

        .semi-rtl .semi-col-sm-offset-23 {
            margin-left: auto;
            margin-right: 95.8333%
        }

        .semi-rtl .semi-col-sm-offset-24 {
            margin-left: auto;
            margin-right: 100%
        }
    }

    @media (min-width:768px) {

        .semi-col-md-1,
        .semi-col-md-2,
        .semi-col-md-3,
        .semi-col-md-4,
        .semi-col-md-5,
        .semi-col-md-6,
        .semi-col-md-7,
        .semi-col-md-8,
        .semi-col-md-9,
        .semi-col-md-10,
        .semi-col-md-11,
        .semi-col-md-12,
        .semi-col-md-13,
        .semi-col-md-14,
        .semi-col-md-15,
        .semi-col-md-16,
        .semi-col-md-17,
        .semi-col-md-18,
        .semi-col-md-19,
        .semi-col-md-20,
        .semi-col-md-21,
        .semi-col-md-22,
        .semi-col-md-23,
        .semi-col-md-24 {
            float: left;
            flex: none
        }

        .semi-col-md-1 {
            box-sizing: border-box;
            width: 4.16667%;
            display: block
        }

        .semi-col-md-push-1 {
            left: 4.16667%
        }

        .semi-col-md-pull-1 {
            right: 4.16667%
        }

        .semi-col-md-offset-1 {
            margin-left: 4.16667%
        }

        .semi-col-md-order-1 {
            order: 1
        }

        .semi-col-md-2 {
            box-sizing: border-box;
            width: 8.33333%;
            display: block
        }

        .semi-col-md-push-2 {
            left: 8.33333%
        }

        .semi-col-md-pull-2 {
            right: 8.33333%
        }

        .semi-col-md-offset-2 {
            margin-left: 8.33333%
        }

        .semi-col-md-order-2 {
            order: 2
        }

        .semi-col-md-3 {
            box-sizing: border-box;
            width: 12.5%;
            display: block
        }

        .semi-col-md-push-3 {
            left: 12.5%
        }

        .semi-col-md-pull-3 {
            right: 12.5%
        }

        .semi-col-md-offset-3 {
            margin-left: 12.5%
        }

        .semi-col-md-order-3 {
            order: 3
        }

        .semi-col-md-4 {
            box-sizing: border-box;
            width: 16.6667%;
            display: block
        }

        .semi-col-md-push-4 {
            left: 16.6667%
        }

        .semi-col-md-pull-4 {
            right: 16.6667%
        }

        .semi-col-md-offset-4 {
            margin-left: 16.6667%
        }

        .semi-col-md-order-4 {
            order: 4
        }

        .semi-col-md-5 {
            box-sizing: border-box;
            width: 20.8333%;
            display: block
        }

        .semi-col-md-push-5 {
            left: 20.8333%
        }

        .semi-col-md-pull-5 {
            right: 20.8333%
        }

        .semi-col-md-offset-5 {
            margin-left: 20.8333%
        }

        .semi-col-md-order-5 {
            order: 5
        }

        .semi-col-md-6 {
            box-sizing: border-box;
            width: 25%;
            display: block
        }

        .semi-col-md-push-6 {
            left: 25%
        }

        .semi-col-md-pull-6 {
            right: 25%
        }

        .semi-col-md-offset-6 {
            margin-left: 25%
        }

        .semi-col-md-order-6 {
            order: 6
        }

        .semi-col-md-7 {
            box-sizing: border-box;
            width: 29.1667%;
            display: block
        }

        .semi-col-md-push-7 {
            left: 29.1667%
        }

        .semi-col-md-pull-7 {
            right: 29.1667%
        }

        .semi-col-md-offset-7 {
            margin-left: 29.1667%
        }

        .semi-col-md-order-7 {
            order: 7
        }

        .semi-col-md-8 {
            box-sizing: border-box;
            width: 33.3333%;
            display: block
        }

        .semi-col-md-push-8 {
            left: 33.3333%
        }

        .semi-col-md-pull-8 {
            right: 33.3333%
        }

        .semi-col-md-offset-8 {
            margin-left: 33.3333%
        }

        .semi-col-md-order-8 {
            order: 8
        }

        .semi-col-md-9 {
            box-sizing: border-box;
            width: 37.5%;
            display: block
        }

        .semi-col-md-push-9 {
            left: 37.5%
        }

        .semi-col-md-pull-9 {
            right: 37.5%
        }

        .semi-col-md-offset-9 {
            margin-left: 37.5%
        }

        .semi-col-md-order-9 {
            order: 9
        }

        .semi-col-md-10 {
            box-sizing: border-box;
            width: 41.6667%;
            display: block
        }

        .semi-col-md-push-10 {
            left: 41.6667%
        }

        .semi-col-md-pull-10 {
            right: 41.6667%
        }

        .semi-col-md-offset-10 {
            margin-left: 41.6667%
        }

        .semi-col-md-order-10 {
            order: 10
        }

        .semi-col-md-11 {
            box-sizing: border-box;
            width: 45.8333%;
            display: block
        }

        .semi-col-md-push-11 {
            left: 45.8333%
        }

        .semi-col-md-pull-11 {
            right: 45.8333%
        }

        .semi-col-md-offset-11 {
            margin-left: 45.8333%
        }

        .semi-col-md-order-11 {
            order: 11
        }

        .semi-col-md-12 {
            box-sizing: border-box;
            width: 50%;
            display: block
        }

        .semi-col-md-push-12 {
            left: 50%
        }

        .semi-col-md-pull-12 {
            right: 50%
        }

        .semi-col-md-offset-12 {
            margin-left: 50%
        }

        .semi-col-md-order-12 {
            order: 12
        }

        .semi-col-md-13 {
            box-sizing: border-box;
            width: 54.1667%;
            display: block
        }

        .semi-col-md-push-13 {
            left: 54.1667%
        }

        .semi-col-md-pull-13 {
            right: 54.1667%
        }

        .semi-col-md-offset-13 {
            margin-left: 54.1667%
        }

        .semi-col-md-order-13 {
            order: 13
        }

        .semi-col-md-14 {
            box-sizing: border-box;
            width: 58.3333%;
            display: block
        }

        .semi-col-md-push-14 {
            left: 58.3333%
        }

        .semi-col-md-pull-14 {
            right: 58.3333%
        }

        .semi-col-md-offset-14 {
            margin-left: 58.3333%
        }

        .semi-col-md-order-14 {
            order: 14
        }

        .semi-col-md-15 {
            box-sizing: border-box;
            width: 62.5%;
            display: block
        }

        .semi-col-md-push-15 {
            left: 62.5%
        }

        .semi-col-md-pull-15 {
            right: 62.5%
        }

        .semi-col-md-offset-15 {
            margin-left: 62.5%
        }

        .semi-col-md-order-15 {
            order: 15
        }

        .semi-col-md-16 {
            box-sizing: border-box;
            width: 66.6667%;
            display: block
        }

        .semi-col-md-push-16 {
            left: 66.6667%
        }

        .semi-col-md-pull-16 {
            right: 66.6667%
        }

        .semi-col-md-offset-16 {
            margin-left: 66.6667%
        }

        .semi-col-md-order-16 {
            order: 16
        }

        .semi-col-md-17 {
            box-sizing: border-box;
            width: 70.8333%;
            display: block
        }

        .semi-col-md-push-17 {
            left: 70.8333%
        }

        .semi-col-md-pull-17 {
            right: 70.8333%
        }

        .semi-col-md-offset-17 {
            margin-left: 70.8333%
        }

        .semi-col-md-order-17 {
            order: 17
        }

        .semi-col-md-18 {
            box-sizing: border-box;
            width: 75%;
            display: block
        }

        .semi-col-md-push-18 {
            left: 75%
        }

        .semi-col-md-pull-18 {
            right: 75%
        }

        .semi-col-md-offset-18 {
            margin-left: 75%
        }

        .semi-col-md-order-18 {
            order: 18
        }

        .semi-col-md-19 {
            box-sizing: border-box;
            width: 79.1667%;
            display: block
        }

        .semi-col-md-push-19 {
            left: 79.1667%
        }

        .semi-col-md-pull-19 {
            right: 79.1667%
        }

        .semi-col-md-offset-19 {
            margin-left: 79.1667%
        }

        .semi-col-md-order-19 {
            order: 19
        }

        .semi-col-md-20 {
            box-sizing: border-box;
            width: 83.3333%;
            display: block
        }

        .semi-col-md-push-20 {
            left: 83.3333%
        }

        .semi-col-md-pull-20 {
            right: 83.3333%
        }

        .semi-col-md-offset-20 {
            margin-left: 83.3333%
        }

        .semi-col-md-order-20 {
            order: 20
        }

        .semi-col-md-21 {
            box-sizing: border-box;
            width: 87.5%;
            display: block
        }

        .semi-col-md-push-21 {
            left: 87.5%
        }

        .semi-col-md-pull-21 {
            right: 87.5%
        }

        .semi-col-md-offset-21 {
            margin-left: 87.5%
        }

        .semi-col-md-order-21 {
            order: 21
        }

        .semi-col-md-22 {
            box-sizing: border-box;
            width: 91.6667%;
            display: block
        }

        .semi-col-md-push-22 {
            left: 91.6667%
        }

        .semi-col-md-pull-22 {
            right: 91.6667%
        }

        .semi-col-md-offset-22 {
            margin-left: 91.6667%
        }

        .semi-col-md-order-22 {
            order: 22
        }

        .semi-col-md-23 {
            box-sizing: border-box;
            width: 95.8333%;
            display: block
        }

        .semi-col-md-push-23 {
            left: 95.8333%
        }

        .semi-col-md-pull-23 {
            right: 95.8333%
        }

        .semi-col-md-offset-23 {
            margin-left: 95.8333%
        }

        .semi-col-md-order-23 {
            order: 23
        }

        .semi-col-md-24 {
            box-sizing: border-box;
            width: 100%;
            display: block
        }

        .semi-col-md-push-24 {
            left: 100%
        }

        .semi-col-md-pull-24 {
            right: 100%
        }

        .semi-col-md-offset-24 {
            margin-left: 100%
        }

        .semi-col-md-order-24 {
            order: 24
        }

        .semi-rtl .semi-col-md-1,
        .semi-rtl .semi-col-md-2,
        .semi-rtl .semi-col-md-3,
        .semi-rtl .semi-col-md-4,
        .semi-rtl .semi-col-md-5,
        .semi-rtl .semi-col-md-6,
        .semi-rtl .semi-col-md-7,
        .semi-rtl .semi-col-md-8,
        .semi-rtl .semi-col-md-9,
        .semi-rtl .semi-col-md-10,
        .semi-rtl .semi-col-md-11,
        .semi-rtl .semi-col-md-12,
        .semi-rtl .semi-col-md-13,
        .semi-rtl .semi-col-md-14,
        .semi-rtl .semi-col-md-15,
        .semi-rtl .semi-col-md-16,
        .semi-rtl .semi-col-md-17,
        .semi-rtl .semi-col-md-18,
        .semi-rtl .semi-col-md-19,
        .semi-rtl .semi-col-md-20,
        .semi-rtl .semi-col-md-21,
        .semi-rtl .semi-col-md-22,
        .semi-rtl .semi-col-md-23,
        .semi-rtl .semi-col-md-24 {
            float: right
        }

        .semi-rtl .semi-col-md-offset-1 {
            margin-left: auto;
            margin-right: 4.16667%
        }

        .semi-rtl .semi-col-md-offset-2 {
            margin-left: auto;
            margin-right: 8.33333%
        }

        .semi-rtl .semi-col-md-offset-3 {
            margin-left: auto;
            margin-right: 12.5%
        }

        .semi-rtl .semi-col-md-offset-4 {
            margin-left: auto;
            margin-right: 16.6667%
        }

        .semi-rtl .semi-col-md-offset-5 {
            margin-left: auto;
            margin-right: 20.8333%
        }

        .semi-rtl .semi-col-md-offset-6 {
            margin-left: auto;
            margin-right: 25%
        }

        .semi-rtl .semi-col-md-offset-7 {
            margin-left: auto;
            margin-right: 29.1667%
        }

        .semi-rtl .semi-col-md-offset-8 {
            margin-left: auto;
            margin-right: 33.3333%
        }

        .semi-rtl .semi-col-md-offset-9 {
            margin-left: auto;
            margin-right: 37.5%
        }

        .semi-rtl .semi-col-md-offset-10 {
            margin-left: auto;
            margin-right: 41.6667%
        }

        .semi-rtl .semi-col-md-offset-11 {
            margin-left: auto;
            margin-right: 45.8333%
        }

        .semi-rtl .semi-col-md-offset-12 {
            margin-left: auto;
            margin-right: 50%
        }

        .semi-rtl .semi-col-md-offset-13 {
            margin-left: auto;
            margin-right: 54.1667%
        }

        .semi-rtl .semi-col-md-offset-14 {
            margin-left: auto;
            margin-right: 58.3333%
        }

        .semi-rtl .semi-col-md-offset-15 {
            margin-left: auto;
            margin-right: 62.5%
        }

        .semi-rtl .semi-col-md-offset-16 {
            margin-left: auto;
            margin-right: 66.6667%
        }

        .semi-rtl .semi-col-md-offset-17 {
            margin-left: auto;
            margin-right: 70.8333%
        }

        .semi-rtl .semi-col-md-offset-18 {
            margin-left: auto;
            margin-right: 75%
        }

        .semi-rtl .semi-col-md-offset-19 {
            margin-left: auto;
            margin-right: 79.1667%
        }

        .semi-rtl .semi-col-md-offset-20 {
            margin-left: auto;
            margin-right: 83.3333%
        }

        .semi-rtl .semi-col-md-offset-21 {
            margin-left: auto;
            margin-right: 87.5%
        }

        .semi-rtl .semi-col-md-offset-22 {
            margin-left: auto;
            margin-right: 91.6667%
        }

        .semi-rtl .semi-col-md-offset-23 {
            margin-left: auto;
            margin-right: 95.8333%
        }

        .semi-rtl .semi-col-md-offset-24 {
            margin-left: auto;
            margin-right: 100%
        }
    }

    @media (min-width:992px) {

        .semi-col-lg-1,
        .semi-col-lg-2,
        .semi-col-lg-3,
        .semi-col-lg-4,
        .semi-col-lg-5,
        .semi-col-lg-6,
        .semi-col-lg-7,
        .semi-col-lg-8,
        .semi-col-lg-9,
        .semi-col-lg-10,
        .semi-col-lg-11,
        .semi-col-lg-12,
        .semi-col-lg-13,
        .semi-col-lg-14,
        .semi-col-lg-15,
        .semi-col-lg-16,
        .semi-col-lg-17,
        .semi-col-lg-18,
        .semi-col-lg-19,
        .semi-col-lg-20,
        .semi-col-lg-21,
        .semi-col-lg-22,
        .semi-col-lg-23,
        .semi-col-lg-24 {
            float: left;
            flex: none
        }

        .semi-col-lg-1 {
            box-sizing: border-box;
            width: 4.16667%;
            display: block
        }

        .semi-col-lg-push-1 {
            left: 4.16667%
        }

        .semi-col-lg-pull-1 {
            right: 4.16667%
        }

        .semi-col-lg-offset-1 {
            margin-left: 4.16667%
        }

        .semi-col-lg-order-1 {
            order: 1
        }

        .semi-col-lg-2 {
            box-sizing: border-box;
            width: 8.33333%;
            display: block
        }

        .semi-col-lg-push-2 {
            left: 8.33333%
        }

        .semi-col-lg-pull-2 {
            right: 8.33333%
        }

        .semi-col-lg-offset-2 {
            margin-left: 8.33333%
        }

        .semi-col-lg-order-2 {
            order: 2
        }

        .semi-col-lg-3 {
            box-sizing: border-box;
            width: 12.5%;
            display: block
        }

        .semi-col-lg-push-3 {
            left: 12.5%
        }

        .semi-col-lg-pull-3 {
            right: 12.5%
        }

        .semi-col-lg-offset-3 {
            margin-left: 12.5%
        }

        .semi-col-lg-order-3 {
            order: 3
        }

        .semi-col-lg-4 {
            box-sizing: border-box;
            width: 16.6667%;
            display: block
        }

        .semi-col-lg-push-4 {
            left: 16.6667%
        }

        .semi-col-lg-pull-4 {
            right: 16.6667%
        }

        .semi-col-lg-offset-4 {
            margin-left: 16.6667%
        }

        .semi-col-lg-order-4 {
            order: 4
        }

        .semi-col-lg-5 {
            box-sizing: border-box;
            width: 20.8333%;
            display: block
        }

        .semi-col-lg-push-5 {
            left: 20.8333%
        }

        .semi-col-lg-pull-5 {
            right: 20.8333%
        }

        .semi-col-lg-offset-5 {
            margin-left: 20.8333%
        }

        .semi-col-lg-order-5 {
            order: 5
        }

        .semi-col-lg-6 {
            box-sizing: border-box;
            width: 25%;
            display: block
        }

        .semi-col-lg-push-6 {
            left: 25%
        }

        .semi-col-lg-pull-6 {
            right: 25%
        }

        .semi-col-lg-offset-6 {
            margin-left: 25%
        }

        .semi-col-lg-order-6 {
            order: 6
        }

        .semi-col-lg-7 {
            box-sizing: border-box;
            width: 29.1667%;
            display: block
        }

        .semi-col-lg-push-7 {
            left: 29.1667%
        }

        .semi-col-lg-pull-7 {
            right: 29.1667%
        }

        .semi-col-lg-offset-7 {
            margin-left: 29.1667%
        }

        .semi-col-lg-order-7 {
            order: 7
        }

        .semi-col-lg-8 {
            box-sizing: border-box;
            width: 33.3333%;
            display: block
        }

        .semi-col-lg-push-8 {
            left: 33.3333%
        }

        .semi-col-lg-pull-8 {
            right: 33.3333%
        }

        .semi-col-lg-offset-8 {
            margin-left: 33.3333%
        }

        .semi-col-lg-order-8 {
            order: 8
        }

        .semi-col-lg-9 {
            box-sizing: border-box;
            width: 37.5%;
            display: block
        }

        .semi-col-lg-push-9 {
            left: 37.5%
        }

        .semi-col-lg-pull-9 {
            right: 37.5%
        }

        .semi-col-lg-offset-9 {
            margin-left: 37.5%
        }

        .semi-col-lg-order-9 {
            order: 9
        }

        .semi-col-lg-10 {
            box-sizing: border-box;
            width: 41.6667%;
            display: block
        }

        .semi-col-lg-push-10 {
            left: 41.6667%
        }

        .semi-col-lg-pull-10 {
            right: 41.6667%
        }

        .semi-col-lg-offset-10 {
            margin-left: 41.6667%
        }

        .semi-col-lg-order-10 {
            order: 10
        }

        .semi-col-lg-11 {
            box-sizing: border-box;
            width: 45.8333%;
            display: block
        }

        .semi-col-lg-push-11 {
            left: 45.8333%
        }

        .semi-col-lg-pull-11 {
            right: 45.8333%
        }

        .semi-col-lg-offset-11 {
            margin-left: 45.8333%
        }

        .semi-col-lg-order-11 {
            order: 11
        }

        .semi-col-lg-12 {
            box-sizing: border-box;
            width: 50%;
            display: block
        }

        .semi-col-lg-push-12 {
            left: 50%
        }

        .semi-col-lg-pull-12 {
            right: 50%
        }

        .semi-col-lg-offset-12 {
            margin-left: 50%
        }

        .semi-col-lg-order-12 {
            order: 12
        }

        .semi-col-lg-13 {
            box-sizing: border-box;
            width: 54.1667%;
            display: block
        }

        .semi-col-lg-push-13 {
            left: 54.1667%
        }

        .semi-col-lg-pull-13 {
            right: 54.1667%
        }

        .semi-col-lg-offset-13 {
            margin-left: 54.1667%
        }

        .semi-col-lg-order-13 {
            order: 13
        }

        .semi-col-lg-14 {
            box-sizing: border-box;
            width: 58.3333%;
            display: block
        }

        .semi-col-lg-push-14 {
            left: 58.3333%
        }

        .semi-col-lg-pull-14 {
            right: 58.3333%
        }

        .semi-col-lg-offset-14 {
            margin-left: 58.3333%
        }

        .semi-col-lg-order-14 {
            order: 14
        }

        .semi-col-lg-15 {
            box-sizing: border-box;
            width: 62.5%;
            display: block
        }

        .semi-col-lg-push-15 {
            left: 62.5%
        }

        .semi-col-lg-pull-15 {
            right: 62.5%
        }

        .semi-col-lg-offset-15 {
            margin-left: 62.5%
        }

        .semi-col-lg-order-15 {
            order: 15
        }

        .semi-col-lg-16 {
            box-sizing: border-box;
            width: 66.6667%;
            display: block
        }

        .semi-col-lg-push-16 {
            left: 66.6667%
        }

        .semi-col-lg-pull-16 {
            right: 66.6667%
        }

        .semi-col-lg-offset-16 {
            margin-left: 66.6667%
        }

        .semi-col-lg-order-16 {
            order: 16
        }

        .semi-col-lg-17 {
            box-sizing: border-box;
            width: 70.8333%;
            display: block
        }

        .semi-col-lg-push-17 {
            left: 70.8333%
        }

        .semi-col-lg-pull-17 {
            right: 70.8333%
        }

        .semi-col-lg-offset-17 {
            margin-left: 70.8333%
        }

        .semi-col-lg-order-17 {
            order: 17
        }

        .semi-col-lg-18 {
            box-sizing: border-box;
            width: 75%;
            display: block
        }

        .semi-col-lg-push-18 {
            left: 75%
        }

        .semi-col-lg-pull-18 {
            right: 75%
        }

        .semi-col-lg-offset-18 {
            margin-left: 75%
        }

        .semi-col-lg-order-18 {
            order: 18
        }

        .semi-col-lg-19 {
            box-sizing: border-box;
            width: 79.1667%;
            display: block
        }

        .semi-col-lg-push-19 {
            left: 79.1667%
        }

        .semi-col-lg-pull-19 {
            right: 79.1667%
        }

        .semi-col-lg-offset-19 {
            margin-left: 79.1667%
        }

        .semi-col-lg-order-19 {
            order: 19
        }

        .semi-col-lg-20 {
            box-sizing: border-box;
            width: 83.3333%;
            display: block
        }

        .semi-col-lg-push-20 {
            left: 83.3333%
        }

        .semi-col-lg-pull-20 {
            right: 83.3333%
        }

        .semi-col-lg-offset-20 {
            margin-left: 83.3333%
        }

        .semi-col-lg-order-20 {
            order: 20
        }

        .semi-col-lg-21 {
            box-sizing: border-box;
            width: 87.5%;
            display: block
        }

        .semi-col-lg-push-21 {
            left: 87.5%
        }

        .semi-col-lg-pull-21 {
            right: 87.5%
        }

        .semi-col-lg-offset-21 {
            margin-left: 87.5%
        }

        .semi-col-lg-order-21 {
            order: 21
        }

        .semi-col-lg-22 {
            box-sizing: border-box;
            width: 91.6667%;
            display: block
        }

        .semi-col-lg-push-22 {
            left: 91.6667%
        }

        .semi-col-lg-pull-22 {
            right: 91.6667%
        }

        .semi-col-lg-offset-22 {
            margin-left: 91.6667%
        }

        .semi-col-lg-order-22 {
            order: 22
        }

        .semi-col-lg-23 {
            box-sizing: border-box;
            width: 95.8333%;
            display: block
        }

        .semi-col-lg-push-23 {
            left: 95.8333%
        }

        .semi-col-lg-pull-23 {
            right: 95.8333%
        }

        .semi-col-lg-offset-23 {
            margin-left: 95.8333%
        }

        .semi-col-lg-order-23 {
            order: 23
        }

        .semi-col-lg-24 {
            box-sizing: border-box;
            width: 100%;
            display: block
        }

        .semi-col-lg-push-24 {
            left: 100%
        }

        .semi-col-lg-pull-24 {
            right: 100%
        }

        .semi-col-lg-offset-24 {
            margin-left: 100%
        }

        .semi-col-lg-order-24 {
            order: 24
        }

        .semi-rtl .semi-col-lg-1,
        .semi-rtl .semi-col-lg-2,
        .semi-rtl .semi-col-lg-3,
        .semi-rtl .semi-col-lg-4,
        .semi-rtl .semi-col-lg-5,
        .semi-rtl .semi-col-lg-6,
        .semi-rtl .semi-col-lg-7,
        .semi-rtl .semi-col-lg-8,
        .semi-rtl .semi-col-lg-9,
        .semi-rtl .semi-col-lg-10,
        .semi-rtl .semi-col-lg-11,
        .semi-rtl .semi-col-lg-12,
        .semi-rtl .semi-col-lg-13,
        .semi-rtl .semi-col-lg-14,
        .semi-rtl .semi-col-lg-15,
        .semi-rtl .semi-col-lg-16,
        .semi-rtl .semi-col-lg-17,
        .semi-rtl .semi-col-lg-18,
        .semi-rtl .semi-col-lg-19,
        .semi-rtl .semi-col-lg-20,
        .semi-rtl .semi-col-lg-21,
        .semi-rtl .semi-col-lg-22,
        .semi-rtl .semi-col-lg-23,
        .semi-rtl .semi-col-lg-24 {
            float: right
        }

        .semi-rtl .semi-col-lg-offset-1 {
            margin-left: auto;
            margin-right: 4.16667%
        }

        .semi-rtl .semi-col-lg-offset-2 {
            margin-left: auto;
            margin-right: 8.33333%
        }

        .semi-rtl .semi-col-lg-offset-3 {
            margin-left: auto;
            margin-right: 12.5%
        }

        .semi-rtl .semi-col-lg-offset-4 {
            margin-left: auto;
            margin-right: 16.6667%
        }

        .semi-rtl .semi-col-lg-offset-5 {
            margin-left: auto;
            margin-right: 20.8333%
        }

        .semi-rtl .semi-col-lg-offset-6 {
            margin-left: auto;
            margin-right: 25%
        }

        .semi-rtl .semi-col-lg-offset-7 {
            margin-left: auto;
            margin-right: 29.1667%
        }

        .semi-rtl .semi-col-lg-offset-8 {
            margin-left: auto;
            margin-right: 33.3333%
        }

        .semi-rtl .semi-col-lg-offset-9 {
            margin-left: auto;
            margin-right: 37.5%
        }

        .semi-rtl .semi-col-lg-offset-10 {
            margin-left: auto;
            margin-right: 41.6667%
        }

        .semi-rtl .semi-col-lg-offset-11 {
            margin-left: auto;
            margin-right: 45.8333%
        }

        .semi-rtl .semi-col-lg-offset-12 {
            margin-left: auto;
            margin-right: 50%
        }

        .semi-rtl .semi-col-lg-offset-13 {
            margin-left: auto;
            margin-right: 54.1667%
        }

        .semi-rtl .semi-col-lg-offset-14 {
            margin-left: auto;
            margin-right: 58.3333%
        }

        .semi-rtl .semi-col-lg-offset-15 {
            margin-left: auto;
            margin-right: 62.5%
        }

        .semi-rtl .semi-col-lg-offset-16 {
            margin-left: auto;
            margin-right: 66.6667%
        }

        .semi-rtl .semi-col-lg-offset-17 {
            margin-left: auto;
            margin-right: 70.8333%
        }

        .semi-rtl .semi-col-lg-offset-18 {
            margin-left: auto;
            margin-right: 75%
        }

        .semi-rtl .semi-col-lg-offset-19 {
            margin-left: auto;
            margin-right: 79.1667%
        }

        .semi-rtl .semi-col-lg-offset-20 {
            margin-left: auto;
            margin-right: 83.3333%
        }

        .semi-rtl .semi-col-lg-offset-21 {
            margin-left: auto;
            margin-right: 87.5%
        }

        .semi-rtl .semi-col-lg-offset-22 {
            margin-left: auto;
            margin-right: 91.6667%
        }

        .semi-rtl .semi-col-lg-offset-23 {
            margin-left: auto;
            margin-right: 95.8333%
        }

        .semi-rtl .semi-col-lg-offset-24 {
            margin-left: auto;
            margin-right: 100%
        }
    }

    @media (min-width:1200px) {

        .semi-col-xl-1,
        .semi-col-xl-2,
        .semi-col-xl-3,
        .semi-col-xl-4,
        .semi-col-xl-5,
        .semi-col-xl-6,
        .semi-col-xl-7,
        .semi-col-xl-8,
        .semi-col-xl-9,
        .semi-col-xl-10,
        .semi-col-xl-11,
        .semi-col-xl-12,
        .semi-col-xl-13,
        .semi-col-xl-14,
        .semi-col-xl-15,
        .semi-col-xl-16,
        .semi-col-xl-17,
        .semi-col-xl-18,
        .semi-col-xl-19,
        .semi-col-xl-20,
        .semi-col-xl-21,
        .semi-col-xl-22,
        .semi-col-xl-23,
        .semi-col-xl-24 {
            float: left;
            flex: none
        }

        .semi-col-xl-1 {
            box-sizing: border-box;
            width: 4.16667%;
            display: block
        }

        .semi-col-xl-push-1 {
            left: 4.16667%
        }

        .semi-col-xl-pull-1 {
            right: 4.16667%
        }

        .semi-col-xl-offset-1 {
            margin-left: 4.16667%
        }

        .semi-col-xl-order-1 {
            order: 1
        }

        .semi-col-xl-2 {
            box-sizing: border-box;
            width: 8.33333%;
            display: block
        }

        .semi-col-xl-push-2 {
            left: 8.33333%
        }

        .semi-col-xl-pull-2 {
            right: 8.33333%
        }

        .semi-col-xl-offset-2 {
            margin-left: 8.33333%
        }

        .semi-col-xl-order-2 {
            order: 2
        }

        .semi-col-xl-3 {
            box-sizing: border-box;
            width: 12.5%;
            display: block
        }

        .semi-col-xl-push-3 {
            left: 12.5%
        }

        .semi-col-xl-pull-3 {
            right: 12.5%
        }

        .semi-col-xl-offset-3 {
            margin-left: 12.5%
        }

        .semi-col-xl-order-3 {
            order: 3
        }

        .semi-col-xl-4 {
            box-sizing: border-box;
            width: 16.6667%;
            display: block
        }

        .semi-col-xl-push-4 {
            left: 16.6667%
        }

        .semi-col-xl-pull-4 {
            right: 16.6667%
        }

        .semi-col-xl-offset-4 {
            margin-left: 16.6667%
        }

        .semi-col-xl-order-4 {
            order: 4
        }

        .semi-col-xl-5 {
            box-sizing: border-box;
            width: 20.8333%;
            display: block
        }

        .semi-col-xl-push-5 {
            left: 20.8333%
        }

        .semi-col-xl-pull-5 {
            right: 20.8333%
        }

        .semi-col-xl-offset-5 {
            margin-left: 20.8333%
        }

        .semi-col-xl-order-5 {
            order: 5
        }

        .semi-col-xl-6 {
            box-sizing: border-box;
            width: 25%;
            display: block
        }

        .semi-col-xl-push-6 {
            left: 25%
        }

        .semi-col-xl-pull-6 {
            right: 25%
        }

        .semi-col-xl-offset-6 {
            margin-left: 25%
        }

        .semi-col-xl-order-6 {
            order: 6
        }

        .semi-col-xl-7 {
            box-sizing: border-box;
            width: 29.1667%;
            display: block
        }

        .semi-col-xl-push-7 {
            left: 29.1667%
        }

        .semi-col-xl-pull-7 {
            right: 29.1667%
        }

        .semi-col-xl-offset-7 {
            margin-left: 29.1667%
        }

        .semi-col-xl-order-7 {
            order: 7
        }

        .semi-col-xl-8 {
            box-sizing: border-box;
            width: 33.3333%;
            display: block
        }

        .semi-col-xl-push-8 {
            left: 33.3333%
        }

        .semi-col-xl-pull-8 {
            right: 33.3333%
        }

        .semi-col-xl-offset-8 {
            margin-left: 33.3333%
        }

        .semi-col-xl-order-8 {
            order: 8
        }

        .semi-col-xl-9 {
            box-sizing: border-box;
            width: 37.5%;
            display: block
        }

        .semi-col-xl-push-9 {
            left: 37.5%
        }

        .semi-col-xl-pull-9 {
            right: 37.5%
        }

        .semi-col-xl-offset-9 {
            margin-left: 37.5%
        }

        .semi-col-xl-order-9 {
            order: 9
        }

        .semi-col-xl-10 {
            box-sizing: border-box;
            width: 41.6667%;
            display: block
        }

        .semi-col-xl-push-10 {
            left: 41.6667%
        }

        .semi-col-xl-pull-10 {
            right: 41.6667%
        }

        .semi-col-xl-offset-10 {
            margin-left: 41.6667%
        }

        .semi-col-xl-order-10 {
            order: 10
        }

        .semi-col-xl-11 {
            box-sizing: border-box;
            width: 45.8333%;
            display: block
        }

        .semi-col-xl-push-11 {
            left: 45.8333%
        }

        .semi-col-xl-pull-11 {
            right: 45.8333%
        }

        .semi-col-xl-offset-11 {
            margin-left: 45.8333%
        }

        .semi-col-xl-order-11 {
            order: 11
        }

        .semi-col-xl-12 {
            box-sizing: border-box;
            width: 50%;
            display: block
        }

        .semi-col-xl-push-12 {
            left: 50%
        }

        .semi-col-xl-pull-12 {
            right: 50%
        }

        .semi-col-xl-offset-12 {
            margin-left: 50%
        }

        .semi-col-xl-order-12 {
            order: 12
        }

        .semi-col-xl-13 {
            box-sizing: border-box;
            width: 54.1667%;
            display: block
        }

        .semi-col-xl-push-13 {
            left: 54.1667%
        }

        .semi-col-xl-pull-13 {
            right: 54.1667%
        }

        .semi-col-xl-offset-13 {
            margin-left: 54.1667%
        }

        .semi-col-xl-order-13 {
            order: 13
        }

        .semi-col-xl-14 {
            box-sizing: border-box;
            width: 58.3333%;
            display: block
        }

        .semi-col-xl-push-14 {
            left: 58.3333%
        }

        .semi-col-xl-pull-14 {
            right: 58.3333%
        }

        .semi-col-xl-offset-14 {
            margin-left: 58.3333%
        }

        .semi-col-xl-order-14 {
            order: 14
        }

        .semi-col-xl-15 {
            box-sizing: border-box;
            width: 62.5%;
            display: block
        }

        .semi-col-xl-push-15 {
            left: 62.5%
        }

        .semi-col-xl-pull-15 {
            right: 62.5%
        }

        .semi-col-xl-offset-15 {
            margin-left: 62.5%
        }

        .semi-col-xl-order-15 {
            order: 15
        }

        .semi-col-xl-16 {
            box-sizing: border-box;
            width: 66.6667%;
            display: block
        }

        .semi-col-xl-push-16 {
            left: 66.6667%
        }

        .semi-col-xl-pull-16 {
            right: 66.6667%
        }

        .semi-col-xl-offset-16 {
            margin-left: 66.6667%
        }

        .semi-col-xl-order-16 {
            order: 16
        }

        .semi-col-xl-17 {
            box-sizing: border-box;
            width: 70.8333%;
            display: block
        }

        .semi-col-xl-push-17 {
            left: 70.8333%
        }

        .semi-col-xl-pull-17 {
            right: 70.8333%
        }

        .semi-col-xl-offset-17 {
            margin-left: 70.8333%
        }

        .semi-col-xl-order-17 {
            order: 17
        }

        .semi-col-xl-18 {
            box-sizing: border-box;
            width: 75%;
            display: block
        }

        .semi-col-xl-push-18 {
            left: 75%
        }

        .semi-col-xl-pull-18 {
            right: 75%
        }

        .semi-col-xl-offset-18 {
            margin-left: 75%
        }

        .semi-col-xl-order-18 {
            order: 18
        }

        .semi-col-xl-19 {
            box-sizing: border-box;
            width: 79.1667%;
            display: block
        }

        .semi-col-xl-push-19 {
            left: 79.1667%
        }

        .semi-col-xl-pull-19 {
            right: 79.1667%
        }

        .semi-col-xl-offset-19 {
            margin-left: 79.1667%
        }

        .semi-col-xl-order-19 {
            order: 19
        }

        .semi-col-xl-20 {
            box-sizing: border-box;
            width: 83.3333%;
            display: block
        }

        .semi-col-xl-push-20 {
            left: 83.3333%
        }

        .semi-col-xl-pull-20 {
            right: 83.3333%
        }

        .semi-col-xl-offset-20 {
            margin-left: 83.3333%
        }

        .semi-col-xl-order-20 {
            order: 20
        }

        .semi-col-xl-21 {
            box-sizing: border-box;
            width: 87.5%;
            display: block
        }

        .semi-col-xl-push-21 {
            left: 87.5%
        }

        .semi-col-xl-pull-21 {
            right: 87.5%
        }

        .semi-col-xl-offset-21 {
            margin-left: 87.5%
        }

        .semi-col-xl-order-21 {
            order: 21
        }

        .semi-col-xl-22 {
            box-sizing: border-box;
            width: 91.6667%;
            display: block
        }

        .semi-col-xl-push-22 {
            left: 91.6667%
        }

        .semi-col-xl-pull-22 {
            right: 91.6667%
        }

        .semi-col-xl-offset-22 {
            margin-left: 91.6667%
        }

        .semi-col-xl-order-22 {
            order: 22
        }

        .semi-col-xl-23 {
            box-sizing: border-box;
            width: 95.8333%;
            display: block
        }

        .semi-col-xl-push-23 {
            left: 95.8333%
        }

        .semi-col-xl-pull-23 {
            right: 95.8333%
        }

        .semi-col-xl-offset-23 {
            margin-left: 95.8333%
        }

        .semi-col-xl-order-23 {
            order: 23
        }

        .semi-col-xl-24 {
            box-sizing: border-box;
            width: 100%;
            display: block
        }

        .semi-col-xl-push-24 {
            left: 100%
        }

        .semi-col-xl-pull-24 {
            right: 100%
        }

        .semi-col-xl-offset-24 {
            margin-left: 100%
        }

        .semi-col-xl-order-24 {
            order: 24
        }

        .semi-rtl .semi-col-xl-1,
        .semi-rtl .semi-col-xl-2,
        .semi-rtl .semi-col-xl-3,
        .semi-rtl .semi-col-xl-4,
        .semi-rtl .semi-col-xl-5,
        .semi-rtl .semi-col-xl-6,
        .semi-rtl .semi-col-xl-7,
        .semi-rtl .semi-col-xl-8,
        .semi-rtl .semi-col-xl-9,
        .semi-rtl .semi-col-xl-10,
        .semi-rtl .semi-col-xl-11,
        .semi-rtl .semi-col-xl-12,
        .semi-rtl .semi-col-xl-13,
        .semi-rtl .semi-col-xl-14,
        .semi-rtl .semi-col-xl-15,
        .semi-rtl .semi-col-xl-16,
        .semi-rtl .semi-col-xl-17,
        .semi-rtl .semi-col-xl-18,
        .semi-rtl .semi-col-xl-19,
        .semi-rtl .semi-col-xl-20,
        .semi-rtl .semi-col-xl-21,
        .semi-rtl .semi-col-xl-22,
        .semi-rtl .semi-col-xl-23,
        .semi-rtl .semi-col-xl-24 {
            float: right
        }

        .semi-rtl .semi-col-xl-offset-1 {
            margin-left: auto;
            margin-right: 4.16667%
        }

        .semi-rtl .semi-col-xl-offset-2 {
            margin-left: auto;
            margin-right: 8.33333%
        }

        .semi-rtl .semi-col-xl-offset-3 {
            margin-left: auto;
            margin-right: 12.5%
        }

        .semi-rtl .semi-col-xl-offset-4 {
            margin-left: auto;
            margin-right: 16.6667%
        }

        .semi-rtl .semi-col-xl-offset-5 {
            margin-left: auto;
            margin-right: 20.8333%
        }

        .semi-rtl .semi-col-xl-offset-6 {
            margin-left: auto;
            margin-right: 25%
        }

        .semi-rtl .semi-col-xl-offset-7 {
            margin-left: auto;
            margin-right: 29.1667%
        }

        .semi-rtl .semi-col-xl-offset-8 {
            margin-left: auto;
            margin-right: 33.3333%
        }

        .semi-rtl .semi-col-xl-offset-9 {
            margin-left: auto;
            margin-right: 37.5%
        }

        .semi-rtl .semi-col-xl-offset-10 {
            margin-left: auto;
            margin-right: 41.6667%
        }

        .semi-rtl .semi-col-xl-offset-11 {
            margin-left: auto;
            margin-right: 45.8333%
        }

        .semi-rtl .semi-col-xl-offset-12 {
            margin-left: auto;
            margin-right: 50%
        }

        .semi-rtl .semi-col-xl-offset-13 {
            margin-left: auto;
            margin-right: 54.1667%
        }

        .semi-rtl .semi-col-xl-offset-14 {
            margin-left: auto;
            margin-right: 58.3333%
        }

        .semi-rtl .semi-col-xl-offset-15 {
            margin-left: auto;
            margin-right: 62.5%
        }

        .semi-rtl .semi-col-xl-offset-16 {
            margin-left: auto;
            margin-right: 66.6667%
        }

        .semi-rtl .semi-col-xl-offset-17 {
            margin-left: auto;
            margin-right: 70.8333%
        }

        .semi-rtl .semi-col-xl-offset-18 {
            margin-left: auto;
            margin-right: 75%
        }

        .semi-rtl .semi-col-xl-offset-19 {
            margin-left: auto;
            margin-right: 79.1667%
        }

        .semi-rtl .semi-col-xl-offset-20 {
            margin-left: auto;
            margin-right: 83.3333%
        }

        .semi-rtl .semi-col-xl-offset-21 {
            margin-left: auto;
            margin-right: 87.5%
        }

        .semi-rtl .semi-col-xl-offset-22 {
            margin-left: auto;
            margin-right: 91.6667%
        }

        .semi-rtl .semi-col-xl-offset-23 {
            margin-left: auto;
            margin-right: 95.8333%
        }

        .semi-rtl .semi-col-xl-offset-24 {
            margin-left: auto;
            margin-right: 100%
        }
    }

    @media (min-width:1600px) {

        .semi-col-xxl-1,
        .semi-col-xxl-2,
        .semi-col-xxl-3,
        .semi-col-xxl-4,
        .semi-col-xxl-5,
        .semi-col-xxl-6,
        .semi-col-xxl-7,
        .semi-col-xxl-8,
        .semi-col-xxl-9,
        .semi-col-xxl-10,
        .semi-col-xxl-11,
        .semi-col-xxl-12,
        .semi-col-xxl-13,
        .semi-col-xxl-14,
        .semi-col-xxl-15,
        .semi-col-xxl-16,
        .semi-col-xxl-17,
        .semi-col-xxl-18,
        .semi-col-xxl-19,
        .semi-col-xxl-20,
        .semi-col-xxl-21,
        .semi-col-xxl-22,
        .semi-col-xxl-23,
        .semi-col-xxl-24 {
            float: left;
            flex: none
        }

        .semi-col-xxl-1 {
            box-sizing: border-box;
            width: 4.16667%;
            display: block
        }

        .semi-col-xxl-push-1 {
            left: 4.16667%
        }

        .semi-col-xxl-pull-1 {
            right: 4.16667%
        }

        .semi-col-xxl-offset-1 {
            margin-left: 4.16667%
        }

        .semi-col-xxl-order-1 {
            order: 1
        }

        .semi-col-xxl-2 {
            box-sizing: border-box;
            width: 8.33333%;
            display: block
        }

        .semi-col-xxl-push-2 {
            left: 8.33333%
        }

        .semi-col-xxl-pull-2 {
            right: 8.33333%
        }

        .semi-col-xxl-offset-2 {
            margin-left: 8.33333%
        }

        .semi-col-xxl-order-2 {
            order: 2
        }

        .semi-col-xxl-3 {
            box-sizing: border-box;
            width: 12.5%;
            display: block
        }

        .semi-col-xxl-push-3 {
            left: 12.5%
        }

        .semi-col-xxl-pull-3 {
            right: 12.5%
        }

        .semi-col-xxl-offset-3 {
            margin-left: 12.5%
        }

        .semi-col-xxl-order-3 {
            order: 3
        }

        .semi-col-xxl-4 {
            box-sizing: border-box;
            width: 16.6667%;
            display: block
        }

        .semi-col-xxl-push-4 {
            left: 16.6667%
        }

        .semi-col-xxl-pull-4 {
            right: 16.6667%
        }

        .semi-col-xxl-offset-4 {
            margin-left: 16.6667%
        }

        .semi-col-xxl-order-4 {
            order: 4
        }

        .semi-col-xxl-5 {
            box-sizing: border-box;
            width: 20.8333%;
            display: block
        }

        .semi-col-xxl-push-5 {
            left: 20.8333%
        }

        .semi-col-xxl-pull-5 {
            right: 20.8333%
        }

        .semi-col-xxl-offset-5 {
            margin-left: 20.8333%
        }

        .semi-col-xxl-order-5 {
            order: 5
        }

        .semi-col-xxl-6 {
            box-sizing: border-box;
            width: 25%;
            display: block
        }

        .semi-col-xxl-push-6 {
            left: 25%
        }

        .semi-col-xxl-pull-6 {
            right: 25%
        }

        .semi-col-xxl-offset-6 {
            margin-left: 25%
        }

        .semi-col-xxl-order-6 {
            order: 6
        }

        .semi-col-xxl-7 {
            box-sizing: border-box;
            width: 29.1667%;
            display: block
        }

        .semi-col-xxl-push-7 {
            left: 29.1667%
        }

        .semi-col-xxl-pull-7 {
            right: 29.1667%
        }

        .semi-col-xxl-offset-7 {
            margin-left: 29.1667%
        }

        .semi-col-xxl-order-7 {
            order: 7
        }

        .semi-col-xxl-8 {
            box-sizing: border-box;
            width: 33.3333%;
            display: block
        }

        .semi-col-xxl-push-8 {
            left: 33.3333%
        }

        .semi-col-xxl-pull-8 {
            right: 33.3333%
        }

        .semi-col-xxl-offset-8 {
            margin-left: 33.3333%
        }

        .semi-col-xxl-order-8 {
            order: 8
        }

        .semi-col-xxl-9 {
            box-sizing: border-box;
            width: 37.5%;
            display: block
        }

        .semi-col-xxl-push-9 {
            left: 37.5%
        }

        .semi-col-xxl-pull-9 {
            right: 37.5%
        }

        .semi-col-xxl-offset-9 {
            margin-left: 37.5%
        }

        .semi-col-xxl-order-9 {
            order: 9
        }

        .semi-col-xxl-10 {
            box-sizing: border-box;
            width: 41.6667%;
            display: block
        }

        .semi-col-xxl-push-10 {
            left: 41.6667%
        }

        .semi-col-xxl-pull-10 {
            right: 41.6667%
        }

        .semi-col-xxl-offset-10 {
            margin-left: 41.6667%
        }

        .semi-col-xxl-order-10 {
            order: 10
        }

        .semi-col-xxl-11 {
            box-sizing: border-box;
            width: 45.8333%;
            display: block
        }

        .semi-col-xxl-push-11 {
            left: 45.8333%
        }

        .semi-col-xxl-pull-11 {
            right: 45.8333%
        }

        .semi-col-xxl-offset-11 {
            margin-left: 45.8333%
        }

        .semi-col-xxl-order-11 {
            order: 11
        }

        .semi-col-xxl-12 {
            box-sizing: border-box;
            width: 50%;
            display: block
        }

        .semi-col-xxl-push-12 {
            left: 50%
        }

        .semi-col-xxl-pull-12 {
            right: 50%
        }

        .semi-col-xxl-offset-12 {
            margin-left: 50%
        }

        .semi-col-xxl-order-12 {
            order: 12
        }

        .semi-col-xxl-13 {
            box-sizing: border-box;
            width: 54.1667%;
            display: block
        }

        .semi-col-xxl-push-13 {
            left: 54.1667%
        }

        .semi-col-xxl-pull-13 {
            right: 54.1667%
        }

        .semi-col-xxl-offset-13 {
            margin-left: 54.1667%
        }

        .semi-col-xxl-order-13 {
            order: 13
        }

        .semi-col-xxl-14 {
            box-sizing: border-box;
            width: 58.3333%;
            display: block
        }

        .semi-col-xxl-push-14 {
            left: 58.3333%
        }

        .semi-col-xxl-pull-14 {
            right: 58.3333%
        }

        .semi-col-xxl-offset-14 {
            margin-left: 58.3333%
        }

        .semi-col-xxl-order-14 {
            order: 14
        }

        .semi-col-xxl-15 {
            box-sizing: border-box;
            width: 62.5%;
            display: block
        }

        .semi-col-xxl-push-15 {
            left: 62.5%
        }

        .semi-col-xxl-pull-15 {
            right: 62.5%
        }

        .semi-col-xxl-offset-15 {
            margin-left: 62.5%
        }

        .semi-col-xxl-order-15 {
            order: 15
        }

        .semi-col-xxl-16 {
            box-sizing: border-box;
            width: 66.6667%;
            display: block
        }

        .semi-col-xxl-push-16 {
            left: 66.6667%
        }

        .semi-col-xxl-pull-16 {
            right: 66.6667%
        }

        .semi-col-xxl-offset-16 {
            margin-left: 66.6667%
        }

        .semi-col-xxl-order-16 {
            order: 16
        }

        .semi-col-xxl-17 {
            box-sizing: border-box;
            width: 70.8333%;
            display: block
        }

        .semi-col-xxl-push-17 {
            left: 70.8333%
        }

        .semi-col-xxl-pull-17 {
            right: 70.8333%
        }

        .semi-col-xxl-offset-17 {
            margin-left: 70.8333%
        }

        .semi-col-xxl-order-17 {
            order: 17
        }

        .semi-col-xxl-18 {
            box-sizing: border-box;
            width: 75%;
            display: block
        }

        .semi-col-xxl-push-18 {
            left: 75%
        }

        .semi-col-xxl-pull-18 {
            right: 75%
        }

        .semi-col-xxl-offset-18 {
            margin-left: 75%
        }

        .semi-col-xxl-order-18 {
            order: 18
        }

        .semi-col-xxl-19 {
            box-sizing: border-box;
            width: 79.1667%;
            display: block
        }

        .semi-col-xxl-push-19 {
            left: 79.1667%
        }

        .semi-col-xxl-pull-19 {
            right: 79.1667%
        }

        .semi-col-xxl-offset-19 {
            margin-left: 79.1667%
        }

        .semi-col-xxl-order-19 {
            order: 19
        }

        .semi-col-xxl-20 {
            box-sizing: border-box;
            width: 83.3333%;
            display: block
        }

        .semi-col-xxl-push-20 {
            left: 83.3333%
        }

        .semi-col-xxl-pull-20 {
            right: 83.3333%
        }

        .semi-col-xxl-offset-20 {
            margin-left: 83.3333%
        }

        .semi-col-xxl-order-20 {
            order: 20
        }

        .semi-col-xxl-21 {
            box-sizing: border-box;
            width: 87.5%;
            display: block
        }

        .semi-col-xxl-push-21 {
            left: 87.5%
        }

        .semi-col-xxl-pull-21 {
            right: 87.5%
        }

        .semi-col-xxl-offset-21 {
            margin-left: 87.5%
        }

        .semi-col-xxl-order-21 {
            order: 21
        }

        .semi-col-xxl-22 {
            box-sizing: border-box;
            width: 91.6667%;
            display: block
        }

        .semi-col-xxl-push-22 {
            left: 91.6667%
        }

        .semi-col-xxl-pull-22 {
            right: 91.6667%
        }

        .semi-col-xxl-offset-22 {
            margin-left: 91.6667%
        }

        .semi-col-xxl-order-22 {
            order: 22
        }

        .semi-col-xxl-23 {
            box-sizing: border-box;
            width: 95.8333%;
            display: block
        }

        .semi-col-xxl-push-23 {
            left: 95.8333%
        }

        .semi-col-xxl-pull-23 {
            right: 95.8333%
        }

        .semi-col-xxl-offset-23 {
            margin-left: 95.8333%
        }

        .semi-col-xxl-order-23 {
            order: 23
        }

        .semi-col-xxl-24 {
            box-sizing: border-box;
            width: 100%;
            display: block
        }

        .semi-col-xxl-push-24 {
            left: 100%
        }

        .semi-col-xxl-pull-24 {
            right: 100%
        }

        .semi-col-xxl-offset-24 {
            margin-left: 100%
        }

        .semi-col-xxl-order-24 {
            order: 24
        }

        .semi-rtl .semi-col-xxl-1,
        .semi-rtl .semi-col-xxl-2,
        .semi-rtl .semi-col-xxl-3,
        .semi-rtl .semi-col-xxl-4,
        .semi-rtl .semi-col-xxl-5,
        .semi-rtl .semi-col-xxl-6,
        .semi-rtl .semi-col-xxl-7,
        .semi-rtl .semi-col-xxl-8,
        .semi-rtl .semi-col-xxl-9,
        .semi-rtl .semi-col-xxl-10,
        .semi-rtl .semi-col-xxl-11,
        .semi-rtl .semi-col-xxl-12,
        .semi-rtl .semi-col-xxl-13,
        .semi-rtl .semi-col-xxl-14,
        .semi-rtl .semi-col-xxl-15,
        .semi-rtl .semi-col-xxl-16,
        .semi-rtl .semi-col-xxl-17,
        .semi-rtl .semi-col-xxl-18,
        .semi-rtl .semi-col-xxl-19,
        .semi-rtl .semi-col-xxl-20,
        .semi-rtl .semi-col-xxl-21,
        .semi-rtl .semi-col-xxl-22,
        .semi-rtl .semi-col-xxl-23,
        .semi-rtl .semi-col-xxl-24 {
            float: right
        }

        .semi-rtl .semi-col-xxl-offset-1 {
            margin-left: auto;
            margin-right: 4.16667%
        }

        .semi-rtl .semi-col-xxl-offset-2 {
            margin-left: auto;
            margin-right: 8.33333%
        }

        .semi-rtl .semi-col-xxl-offset-3 {
            margin-left: auto;
            margin-right: 12.5%
        }

        .semi-rtl .semi-col-xxl-offset-4 {
            margin-left: auto;
            margin-right: 16.6667%
        }

        .semi-rtl .semi-col-xxl-offset-5 {
            margin-left: auto;
            margin-right: 20.8333%
        }

        .semi-rtl .semi-col-xxl-offset-6 {
            margin-left: auto;
            margin-right: 25%
        }

        .semi-rtl .semi-col-xxl-offset-7 {
            margin-left: auto;
            margin-right: 29.1667%
        }

        .semi-rtl .semi-col-xxl-offset-8 {
            margin-left: auto;
            margin-right: 33.3333%
        }

        .semi-rtl .semi-col-xxl-offset-9 {
            margin-left: auto;
            margin-right: 37.5%
        }

        .semi-rtl .semi-col-xxl-offset-10 {
            margin-left: auto;
            margin-right: 41.6667%
        }

        .semi-rtl .semi-col-xxl-offset-11 {
            margin-left: auto;
            margin-right: 45.8333%
        }

        .semi-rtl .semi-col-xxl-offset-12 {
            margin-left: auto;
            margin-right: 50%
        }

        .semi-rtl .semi-col-xxl-offset-13 {
            margin-left: auto;
            margin-right: 54.1667%
        }

        .semi-rtl .semi-col-xxl-offset-14 {
            margin-left: auto;
            margin-right: 58.3333%
        }

        .semi-rtl .semi-col-xxl-offset-15 {
            margin-left: auto;
            margin-right: 62.5%
        }

        .semi-rtl .semi-col-xxl-offset-16 {
            margin-left: auto;
            margin-right: 66.6667%
        }

        .semi-rtl .semi-col-xxl-offset-17 {
            margin-left: auto;
            margin-right: 70.8333%
        }

        .semi-rtl .semi-col-xxl-offset-18 {
            margin-left: auto;
            margin-right: 75%
        }

        .semi-rtl .semi-col-xxl-offset-19 {
            margin-left: auto;
            margin-right: 79.1667%
        }

        .semi-rtl .semi-col-xxl-offset-20 {
            margin-left: auto;
            margin-right: 83.3333%
        }

        .semi-rtl .semi-col-xxl-offset-21 {
            margin-left: auto;
            margin-right: 87.5%
        }

        .semi-rtl .semi-col-xxl-offset-22 {
            margin-left: auto;
            margin-right: 91.6667%
        }

        .semi-rtl .semi-col-xxl-offset-23 {
            margin-left: auto;
            margin-right: 95.8333%
        }

        .semi-rtl .semi-col-xxl-offset-24 {
            margin-left: auto;
            margin-right: 100%
        }
    }

    .semi-rtl .semi-row,
    .semi-rtl .semi-row-flex,
    .semi-portal-rtl .semi-row,
    .semi-portal-rtl .semi-row-flex {
        direction: rtl
    }
}


@layer base {
    .semi-spin {
        width: 20px;
        height: 20px;
        display: inline-block;
        position: relative
    }

    @keyframes semi-animation-rotate {
        0% {
            transform: rotate(0)
        }

        to {
            transform: rotate(360deg)
        }
    }

    .semi-spin-wrapper {
        text-align: center;
        width: 100%;
        color: var(--semi-color-primary);
        position: absolute;
        top: 50%;
        transform: translateY(-50%)
    }

    .semi-spin-wrapper>svg {
        vertical-align: top;
        width: 20px;
        height: 20px;
        animation: .6s linear infinite forwards semi-animation-rotate;
        display: inline
    }

    .semi-spin-animate {
        animation: 1.6s linear infinite forwards semi-animation-rotate;
        display: inline-flex
    }

    .semi-spin-children {
        opacity: .5;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none
    }

    .semi-spin-block {
        display: block
    }

    .semi-spin-block:after {
        content: "";
        z-index: 1;
        width: 100%;
        height: 100%;
        position: absolute;
        top: 0;
        left: 0
    }

    .semi-spin-block .semi-spin-wrapper {
        display: block
    }

    .semi-spin-block.semi-spin {
        width: auto;
        height: auto
    }

    .semi-spin-hidden:after {
        content: none
    }

    .semi-spin-hidden>.semi-spin-children {
        opacity: 1;
        -webkit-user-select: auto;
        -moz-user-select: auto;
        -ms-user-select: auto;
        user-select: auto
    }

    .semi-spin-small,
    .semi-spin-small>.semi-spin-wrapper svg {
        width: 14px;
        height: 14px
    }

    .semi-spin-middle,
    .semi-spin-middle>.semi-spin-wrapper svg {
        width: 20px;
        height: 20px
    }

    .semi-spin-large,
    .semi-spin-large>.semi-spin-wrapper svg {
        width: 32px;
        height: 32px
    }

    .semi-spin-container {
        overflow: hidden
    }

    .semi-rtl .semi-spin,
    .semi-portal-rtl .semi-spin,
    .semi-rtl .semi-spin-container,
    .semi-portal-rtl .semi-spin-container {
        direction: rtl
    }
}


@layer base {
    @keyframes semi-input-active {
        0% {
            transform: scale(1)
        }

        to {
            transform: scale(.97)
        }
    }

    @keyframes semi-input-inactive {
        0% {
            transform: scale(.97)
        }

        to {
            transform: scale(1)
        }
    }

    .semi-input {
        transition: background-color var(--semi-transition_duration-none)var(--semi-transition_function-easeIn)var(--semi-transition_delay-none), border var(--semi-transition_duration-none)var(--semi-transition_function-easeIn)var(--semi-transition_delay-none);
        transform: scale(var(--semi-transform_scale-none))
    }

    .semi-input-wrapper {
        vertical-align: middle;
        box-shadow: none;
        background-color: var(--semi-color-fill-0);
        border-radius: var(--semi-border-radius-small);
        cursor: text;
        box-sizing: border-box;
        width: 100%;
        color: var(--semi-color-text-0);
        transition: background-color var(--semi-transition_duration-none)var(--semi-transition_function-easeIn)var(--semi-transition_delay-none), border var(--semi-transition_duration-none)var(--semi-transition_function-easeIn)var(--semi-transition_delay-none);
        transform: scale(var(--semi-transform_scale-none));
        border: 1px solid transparent;
        outline: none;
        font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif;
        font-size: 14px;
        line-height: 20px;
        display: inline-block;
        position: relative
    }

    .semi-input-wrapper-default {
        height: 32px;
        font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif;
        font-size: 14px;
        line-height: 30px
    }

    .semi-input-wrapper-small {
        height: 24px;
        font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif;
        font-size: 14px;
        line-height: 22px
    }

    .semi-input-wrapper-large {
        height: 40px;
        font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif;
        font-size: 16px;
        line-height: 38px
    }

    .semi-input-wrapper:hover {
        background-color: var(--semi-color-fill-1);
        border-color: transparent
    }

    .semi-input-wrapper-focus {
        background-color: var(--semi-color-fill-0);
        border: var(--semi-color-focus-border)solid 1px
    }

    .semi-input-wrapper-focus:hover {
        background-color: var(--semi-color-fill-0);
        border-color: var(--semi-color-focus-border)
    }

    .semi-input-wrapper-focus:active {
        background-color: var(--semi-color-fill-2);
        border-color: var(--semi-color-focus-border)
    }

    .semi-input-wrapper.semi-input-readonly {
        cursor: default
    }

    .semi-input-wrapper-error {
        background-color: var(--semi-color-danger-light-default);
        border-color: var(--semi-color-danger-light-default)
    }

    .semi-input-wrapper-error:hover {
        background-color: var(--semi-color-danger-light-hover);
        border-color: var(--semi-color-danger-light-hover)
    }

    .semi-input-wrapper-error.semi-input-wrapper-focus {
        background-color: var(--semi-color-danger-light-default);
        border-color: var(--semi-color-danger)
    }

    .semi-input-wrapper-error:active {
        background-color: var(--semi-color-danger-light-active);
        border-color: var(--semi-color-danger)
    }

    .semi-input-wrapper-warning {
        background-color: var(--semi-color-warning-light-default);
        border-color: var(--semi-color-warning-light-default)
    }

    .semi-input-wrapper-warning:hover {
        background-color: var(--semi-color-warning-light-hover);
        border-color: var(--semi-color-warning-light-hover)
    }

    .semi-input-wrapper-warning.semi-input-wrapper-focus {
        background-color: var(--semi-color-warning-light-default);
        border-color: var(--semi-color-warning)
    }

    .semi-input-wrapper-warning:active {
        background-color: var(--semi-color-warning-light-active);
        border-color: var(--semi-color-warning)
    }

    .semi-input-wrapper__with-prefix {
        align-items: center;
        display: inline-flex
    }

    .semi-input-wrapper__with-prefix .semi-input {
        padding-left: 0
    }

    .semi-input-wrapper__with-suffix {
        align-items: center;
        display: inline-flex
    }

    .semi-input-wrapper__with-suffix .semi-input {
        padding-right: 0
    }

    .semi-input-wrapper-clearable,
    .semi-input-wrapper-modebtn {
        align-items: center;
        display: inline-flex
    }

    .semi-input-wrapper-hidden {
        border: none
    }

    .semi-input-wrapper .semi-icon {
        color: var(--semi-color-text-2)
    }

    .semi-input-wrapper .semi-input-clearbtn,
    .semi-input-wrapper .semi-input-modebtn {
        color: var(--semi-color-primary-hover)
    }

    .semi-input-wrapper .semi-input-clearbtn>svg,
    .semi-input-wrapper .semi-input-modebtn>svg {
        pointer-events: none
    }

    .semi-input-wrapper .semi-input-clearbtn:hover,
    .semi-input-wrapper .semi-input-modebtn:hover {
        cursor: pointer
    }

    .semi-input-wrapper .semi-input-clearbtn:hover .semi-icon,
    .semi-input-wrapper .semi-input-modebtn:hover .semi-icon {
        color: var(--semi-color-primary-hover)
    }

    .semi-input-wrapper .semi-input-clearbtn:focus-visible {
        border-radius: var(--semi-border-radius-small);
        outline: 2px solid var(--semi-color-primary-light-active);
        outline-offset: -1px
    }

    .semi-input-wrapper .semi-input-modebtn:focus-visible {
        border-radius: var(--semi-border-radius-small);
        outline: 2px solid var(--semi-color-primary-light-active);
        outline-offset: -1px
    }

    .semi-input-wrapper__with-suffix-icon.semi-input-wrapper-clearable:not(.semi-input-wrapper__with-suffix-hidden) .semi-input-clearbtn {
        justify-content: flex-end;
        min-width: 24px
    }

    .semi-input-wrapper-modebtn.semi-input-wrapper-clearable .semi-input-clearbtn {
        justify-content: center;
        min-width: 16px
    }

    .semi-input-wrapper.semi-input-wrapper__with-append-only .semi-input {
        border-radius: 0 var(--semi-border-radius-small)var(--semi-border-radius-small)0
    }

    .semi-input-wrapper.semi-input-wrapper__with-append-only .semi-input:not(:last-child) {
        border-right-style: none;
        border-radius: 0
    }

    .semi-input-wrapper.semi-input-wrapper__with-prepend-only .semi-input {
        border-radius: var(--semi-border-radius-small)0 0 var(--semi-border-radius-small)
    }

    .semi-input-wrapper.semi-input-wrapper__with-prepend-only .semi-input:not(:last-child) {
        border-right-style: none
    }

    .semi-input-wrapper.semi-input-wrapper__with-prepend,
    .semi-input-wrapper.semi-input-wrapper__with-append {
        background-color: transparent;
        align-items: center;
        display: inline-flex
    }

    .semi-input-wrapper.semi-input-wrapper__with-prepend:hover,
    .semi-input-wrapper.semi-input-wrapper__with-append:hover {
        background-color: transparent
    }

    .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-focus,
    .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-focus {
        background-color: transparent;
        border: 1px solid transparent
    }

    .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input,
    .semi-input-wrapper.semi-input-wrapper__with-append .semi-input {
        background-color: var(--semi-color-fill-0);
        border: 1px solid transparent
    }

    .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input:hover,
    .semi-input-wrapper.semi-input-wrapper__with-append .semi-input:hover,
    .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input:hover+.semi-input-clearbtn,
    .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input:hover~.semi-input-modebtn,
    .semi-input-wrapper.semi-input-wrapper__with-append .semi-input:hover+.semi-input-clearbtn,
    .semi-input-wrapper.semi-input-wrapper__with-append .semi-input:hover~.semi-input-modebtn {
        background-color: var(--semi-color-fill-1)
    }

    .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input:focus,
    .semi-input-wrapper.semi-input-wrapper__with-append .semi-input:focus {
        border: 1px var(--semi-color-focus-border)solid;
        background-color: var(--semi-color-fill-0)
    }

    .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input:focus.semi-input-sibling-clearbtn,
    .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input:focus.semi-input-sibling-modebtn,
    .semi-input-wrapper.semi-input-wrapper__with-append .semi-input:focus.semi-input-sibling-clearbtn,
    .semi-input-wrapper.semi-input-wrapper__with-append .semi-input:focus.semi-input-sibling-modebtn,
    .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input:focus.semi-input-sibling-modebtn+.semi-input-clearbtn,
    .semi-input-wrapper.semi-input-wrapper__with-append .semi-input:focus.semi-input-sibling-modebtn+.semi-input-clearbtn {
        border-right-style: none
    }

    .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input:focus+.semi-input-clearbtn,
    .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input:focus~.semi-input-modebtn,
    .semi-input-wrapper.semi-input-wrapper__with-append .semi-input:focus+.semi-input-clearbtn,
    .semi-input-wrapper.semi-input-wrapper__with-append .semi-input:focus~.semi-input-modebtn {
        box-sizing: border-box;
        background-color: var(--semi-color-fill-0)
    }

    .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input:focus+.semi-input-clearbtn,
    .semi-input-wrapper.semi-input-wrapper__with-append .semi-input:focus+.semi-input-clearbtn {
        border: 1px var(--semi-color-focus-border)solid;
        border-radius: 0 var(--semi-border-radius-small)var(--semi-border-radius-small)0;
        border-left-style: none
    }

    .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input:focus+.semi-input-clearbtn:not(:last-child),
    .semi-input-wrapper.semi-input-wrapper__with-append .semi-input:focus+.semi-input-clearbtn:not(:last-child) {
        border-radius: 0
    }

    .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input:focus~.semi-input-modebtn,
    .semi-input-wrapper.semi-input-wrapper__with-append .semi-input:focus~.semi-input-modebtn {
        border: 1px var(--semi-color-focus-border)solid;
        border-radius: 0 var(--semi-border-radius-small)var(--semi-border-radius-small)0;
        border-left-style: none
    }

    .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input:focus~.semi-input-modebtn:not(:last-child),
    .semi-input-wrapper.semi-input-wrapper__with-append .semi-input:focus~.semi-input-modebtn:not(:last-child) {
        border-radius: 0
    }

    .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input:active,
    .semi-input-wrapper.semi-input-wrapper__with-append .semi-input:active,
    .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input:active+.semi-input-clearbtn,
    .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input:active~.semi-input-modebtn,
    .semi-input-wrapper.semi-input-wrapper__with-append .semi-input:active+.semi-input-clearbtn,
    .semi-input-wrapper.semi-input-wrapper__with-append .semi-input:active~.semi-input-modebtn {
        background-color: var(--semi-color-fill-2)
    }

    .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input-clearbtn,
    .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input-modebtn,
    .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input-clearbtn:hover,
    .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input-modebtn:hover,
    .semi-input-wrapper.semi-input-wrapper__with-append .semi-input-clearbtn,
    .semi-input-wrapper.semi-input-wrapper__with-append .semi-input-modebtn,
    .semi-input-wrapper.semi-input-wrapper__with-append .semi-input-clearbtn:hover,
    .semi-input-wrapper.semi-input-wrapper__with-append .semi-input-modebtn:hover {
        background-color: var(--semi-color-fill-0)
    }

    .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input-clearbtn:last-child,
    .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input-modebtn:last-child,
    .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input-clearbtn:hover:last-child,
    .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input-modebtn:hover:last-child,
    .semi-input-wrapper.semi-input-wrapper__with-append .semi-input-clearbtn:last-child,
    .semi-input-wrapper.semi-input-wrapper__with-append .semi-input-modebtn:last-child,
    .semi-input-wrapper.semi-input-wrapper__with-append .semi-input-clearbtn:hover:last-child,
    .semi-input-wrapper.semi-input-wrapper__with-append .semi-input-modebtn:hover:last-child {
        border-radius: 0 var(--semi-border-radius-small)var(--semi-border-radius-small)0
    }

    .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error,
    .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error {
        border-color: transparent
    }

    .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input,
    .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input {
        background-color: var(--semi-color-danger-light-default);
        border-color: var(--semi-color-danger-light-default)
    }

    .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input:hover,
    .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input:hover {
        background-color: var(--semi-color-danger-light-hover);
        border-color: var(--semi-color-danger-light-hover)
    }

    .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input:hover+.semi-input-clearbtn,
    .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input:hover+.semi-input-modebtn,
    .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input:hover+.semi-input-clearbtn,
    .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input:hover+.semi-input-modebtn {
        background-color: var(--semi-color-danger-light-hover)
    }

    .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input:focus,
    .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input:focus,
    .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input:focus+.semi-input-clearbtn,
    .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input:focus+.semi-input-modebtn,
    .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input:focus+.semi-input-clearbtn,
    .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input:focus+.semi-input-modebtn {
        background-color: var(--semi-color-danger-light-default);
        border-color: var(--semi-color-danger)
    }

    .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input:active,
    .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input:active {
        background-color: var(--semi-color-danger-light-active)
    }

    .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input:active+.semi-input-clearbtn,
    .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input:active+.semi-input-modebtn,
    .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input:active+.semi-input-clearbtn,
    .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input:active+.semi-input-modebtn {
        background-color: var(--semi-color-danger-light-active);
        border-color: var(--semi-color-danger)
    }

    .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input-clearbtn,
    .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input-modebtn,
    .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input-clearbtn:hover,
    .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input-modebtn:hover,
    .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input-clearbtn,
    .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input-modebtn,
    .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input-clearbtn:hover,
    .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input-modebtn:hover {
        background-color: var(--semi-color-danger-light-default)
    }

    .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input-clearbtn:last-child,
    .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input-modebtn:last-child,
    .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input-clearbtn:hover:last-child,
    .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input-modebtn:hover:last-child,
    .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input-clearbtn:last-child,
    .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input-modebtn:last-child,
    .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input-clearbtn:hover:last-child,
    .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input-modebtn:hover:last-child {
        border-radius: 0 var(--semi-border-radius-small)var(--semi-border-radius-small)0
    }

    .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning,
    .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning {
        border-color: transparent
    }

    .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input,
    .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input {
        background-color: var(--semi-color-warning-light-default);
        border-color: var(--semi-color-warning-light-default)
    }

    .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input:hover,
    .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input:hover {
        background-color: var(--semi-color-warning-light-hover);
        border-color: var(--semi-color-warning-light-hover)
    }

    .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input:hover+.semi-input-clearbtn,
    .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input:hover+.semi-input-modebtn,
    .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input:hover+.semi-input-clearbtn,
    .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input:hover+.semi-input-modebtn {
        background-color: var(--semi-color-warning-light-hover)
    }

    .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input:focus,
    .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input:focus,
    .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input:focus+.semi-input-clearbtn,
    .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input:focus+.semi-input-modebtn,
    .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input:focus+.semi-input-clearbtn,
    .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input:focus+.semi-input-modebtn {
        background-color: var(--semi-color-warning-light-default);
        border-color: var(--semi-color-warning)
    }

    .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input:active,
    .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input:active {
        background-color: var(--semi-color-warning-light-active)
    }

    .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input:active+.semi-input-clearbtn,
    .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input:active+.semi-input-modebtn,
    .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input:active+.semi-input-clearbtn,
    .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input:active+.semi-input-modebtn {
        background-color: var(--semi-color-warning-light-active);
        border-color: var(--semi-color-warning)
    }

    .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input-clearbtn,
    .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input-modebtn,
    .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input-clearbtn:hover,
    .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input-modebtn:hover,
    .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input-clearbtn,
    .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input-modebtn,
    .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input-clearbtn:hover,
    .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input-modebtn:hover {
        background-color: var(--semi-color-warning-light-default)
    }

    .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input-clearbtn:last-child,
    .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input-modebtn:last-child,
    .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input-clearbtn:hover:last-child,
    .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input-modebtn:hover:last-child,
    .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input-clearbtn:last-child,
    .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input-modebtn:last-child,
    .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input-clearbtn:hover:last-child,
    .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input-modebtn:hover:last-child {
        border-radius: 0 var(--semi-border-radius-small)var(--semi-border-radius-small)0
    }

    .semi-input-wrapper-disabled {
        cursor: not-allowed;
        color: var(--semi-color-disabled-text);
        background-color: var(--semi-color-disabled-fill);
        -webkit-text-fill-color: var(--semi-color-disabled-text)
    }

    .semi-input-wrapper-disabled:hover {
        background-color: var(--semi-color-disabled-fill)
    }

    .semi-input-wrapper-disabled .semi-input-append,
    .semi-input-wrapper-disabled .semi-input-prepend,
    .semi-input-wrapper-disabled .semi-input-suffix,
    .semi-input-wrapper-disabled .semi-input-prefix,
    .semi-input-wrapper-disabled .semi-icon {
        color: var(--semi-color-disabled-text)
    }

    .semi-input {
        width: 100%;
        color: inherit;
        box-sizing: border-box;
        background-color: transparent;
        border: none;
        outline: none;
        padding-left: 12px;
        padding-right: 12px
    }

    .semi-input[type=password]::-ms-reveal {
        display: none
    }

    .semi-input[type=password]::-ms-clear {
        display: none
    }

    .semi-input[type=search]::-webkit-search-cancel-button {
        display: none
    }

    .semi-input::placeholder {
        color: var(--semi-color-text-2)
    }

    .semi-input::placeholder {
        color: var(--semi-color-text-2)
    }

    .semi-input::placeholder {
        color: var(--semi-color-text-2)
    }

    .semi-input-large {
        height: 38px;
        font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif;
        font-size: 16px;
        line-height: 38px
    }

    .semi-input-small {
        height: 22px;
        font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif;
        font-size: 14px;
        line-height: 22px
    }

    .semi-input-default {
        height: 30px;
        font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif;
        font-size: 14px;
        line-height: 30px
    }

    .semi-input-disabled {
        cursor: not-allowed;
        color: inherit
    }

    .semi-input-inset-label {
        color: var(--semi-color-text-2);
        white-space: nowrap;
        flex-shrink: 0;
        margin-right: 12px;
        font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif;
        font-size: 14px;
        font-weight: 600;
        line-height: 20px
    }

    .semi-input-prefix,
    .semi-input-suffix {
        justify-content: center;
        align-items: center;
        display: flex
    }

    .semi-input-prefix-text,
    .semi-input-suffix-text {
        color: var(--semi-color-text-2);
        white-space: nowrap;
        margin: 0 12px;
        font-weight: 600
    }

    .semi-input-prefix-icon,
    .semi-input-suffix-icon {
        color: var(--semi-color-text-2);
        margin: 0 8px
    }

    .semi-input-suffix {
        justify-content: center;
        align-items: center;
        display: flex
    }

    .semi-input-clearbtn,
    .semi-input-modebtn {
        justify-content: center;
        align-items: center;
        min-width: 32px;
        height: 100%;
        display: flex
    }

    .semi-input-clearbtn+.semi-input-suffix+.semi-input-suffix-text,
    .semi-input-clearbtn+.semi-input-suffix+.semi-input-suffix-icon {
        margin-left: 0
    }

    .semi-input-suffix-hidden {
        display: none
    }

    .semi-input-prepend,
    .semi-input-append {
        background-color: var(--semi-color-fill-0);
        height: 100%;
        color: var(--semi-color-text-2);
        flex-shrink: 0;
        align-items: center;
        font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif;
        font-size: 14px;
        line-height: 20px;
        display: flex
    }

    .semi-input-prepend-icon,
    .semi-input-prepend-text,
    .semi-input-append-icon,
    .semi-input-append-text {
        padding: 0 12px
    }

    .semi-input-append {
        border-radius: 0 var(--semi-border-radius-small)var(--semi-border-radius-small)0;
        border-left: 1px solid transparent
    }

    .semi-input-prepend {
        border-radius: var(--semi-border-radius-small)0 0 var(--semi-border-radius-small);
        border-right: 1px solid transparent
    }

    .semi-input-disabled::placeholder {
        color: var(--semi-color-disabled-text)
    }

    .semi-input-disabled::placeholder {
        color: var(--semi-color-disabled-text)
    }

    .semi-input-disabled::placeholder {
        color: var(--semi-color-disabled-text)
    }

    .semi-input-group {
        flex-wrap: wrap;
        align-content: center;
        align-items: center;
        display: inline-flex
    }

    .semi-input-group .semi-select,
    .semi-input-group .semi-tagInput,
    .semi-input-group .semi-cascader,
    .semi-input-group .semi-tree-select,
    .semi-input-group>.semi-input-wrapper {
        border-radius: 0
    }

    .semi-input-group .semi-select:first-child,
    .semi-input-group .semi-tagInput:first-child,
    .semi-input-group .semi-cascader:first-child,
    .semi-input-group .semi-tree-select:first-child,
    .semi-input-group>.semi-input-wrapper:first-child {
        border-radius: var(--semi-border-radius-small)0 0 var(--semi-border-radius-small)
    }

    .semi-input-group .semi-select:last-child,
    .semi-input-group .semi-tagInput:last-child,
    .semi-input-group .semi-cascader:last-child,
    .semi-input-group .semi-tree-select:last-child,
    .semi-input-group>.semi-input-wrapper:last-child {
        border-radius: 0 var(--semi-border-radius-small)var(--semi-border-radius-small)0
    }

    .semi-input-group .semi-select:not(:last-child),
    .semi-input-group .semi-tagInput:not(:last-child),
    .semi-input-group .semi-cascader:not(:last-child),
    .semi-input-group .semi-tree-select:not(:last-child),
    .semi-input-group>.semi-input-wrapper:not(:last-child) {
        position: relative
    }

    .semi-input-group .semi-select:not(:last-child):after,
    .semi-input-group .semi-tagInput:not(:last-child):after,
    .semi-input-group .semi-cascader:not(:last-child):after,
    .semi-input-group .semi-tree-select:not(:last-child):after,
    .semi-input-group>.semi-input-wrapper:not(:last-child):after {
        content: "";
        background-color: var(--semi-color-border);
        width: 1px;
        position: absolute;
        top: 1px;
        bottom: 1px;
        right: -1px
    }

    .semi-input-group .semi-select {
        overflow-y: visible
    }

    .semi-input-group .semi-input-number .semi-input-wrapper,
    .semi-input-group .semi-input-number .semi-datepicker-range-input,
    .semi-input-group .semi-datepicker .semi-input-wrapper,
    .semi-input-group .semi-datepicker .semi-datepicker-range-input,
    .semi-input-group .semi-timepicker .semi-input-wrapper,
    .semi-input-group .semi-timepicker .semi-datepicker-range-input,
    .semi-input-group .semi-autocomplete .semi-input-wrapper,
    .semi-input-group .semi-autocomplete .semi-datepicker-range-input {
        border-radius: 0
    }

    .semi-input-group .semi-input-number:first-child .semi-input-wrapper,
    .semi-input-group .semi-input-number:first-child .semi-datepicker-range-input,
    .semi-input-group .semi-datepicker:first-child .semi-input-wrapper,
    .semi-input-group .semi-datepicker:first-child .semi-datepicker-range-input,
    .semi-input-group .semi-timepicker:first-child .semi-input-wrapper,
    .semi-input-group .semi-timepicker:first-child .semi-datepicker-range-input,
    .semi-input-group .semi-autocomplete:first-child .semi-input-wrapper,
    .semi-input-group .semi-autocomplete:first-child .semi-datepicker-range-input {
        border-radius: var(--semi-border-radius-small)0 0 var(--semi-border-radius-small)
    }

    .semi-input-group .semi-input-number:last-child .semi-input-wrapper,
    .semi-input-group .semi-input-number:last-child .semi-datepicker-range-input,
    .semi-input-group .semi-datepicker:last-child .semi-input-wrapper,
    .semi-input-group .semi-datepicker:last-child .semi-datepicker-range-input,
    .semi-input-group .semi-timepicker:last-child .semi-input-wrapper,
    .semi-input-group .semi-timepicker:last-child .semi-datepicker-range-input,
    .semi-input-group .semi-autocomplete:last-child .semi-input-wrapper,
    .semi-input-group .semi-autocomplete:last-child .semi-datepicker-range-input {
        border-radius: 0 var(--semi-border-radius-small)var(--semi-border-radius-small)0
    }

    .semi-input-group .semi-input-number:not(:last-child),
    .semi-input-group .semi-datepicker:not(:last-child),
    .semi-input-group .semi-timepicker:not(:last-child),
    .semi-input-group .semi-autocomplete:not(:last-child) {
        position: relative
    }

    .semi-input-group .semi-input-number:not(:last-child):after,
    .semi-input-group .semi-datepicker:not(:last-child):after,
    .semi-input-group .semi-timepicker:not(:last-child):after,
    .semi-input-group .semi-autocomplete:not(:last-child):after {
        content: "";
        background-color: var(--semi-color-border);
        width: 1px;
        position: absolute;
        top: 1px;
        bottom: 1px;
        right: -1px
    }

    .semi-input-group-wrapper-with-top-label {
        margin-top: 16px;
        margin-bottom: 16px
    }

    .semi-input-group-wrapper-with-top-label .semi-input-group {
        display: flex
    }

    .semi-input-group-wrapper-with-top-label .semi-input-group .semi-form-field {
        margin-top: 0;
        margin-bottom: 0
    }

    .semi-input-only_border,
    .semi-input-only_border:hover {
        border-color: var(--semi-color-border);
        background: 0 0
    }

    .semi-input-only_border:focus-within {
        background: 0 0
    }

    .semi-input-borderless:not(:focus-within):not(:hover) {
        background-color: transparent;
        border-color: transparent
    }

    .semi-input-borderless:focus-within:not(:active) {
        background-color: transparent
    }

    .semi-input-borderless.semi-input-wrapper-error:not(:focus-within) {
        border-color: var(--semi-color-danger)
    }

    .semi-input-borderless.semi-input-wrapper-warning:not(:focus-within) {
        border-color: var(--semi-color-warning)
    }

    .semi-rtl .semi-input-wrapper,
    .semi-portal-rtl .semi-input-wrapper {
        direction: rtl
    }

    .semi-rtl .semi-input-wrapper__with-prefix .semi-input,
    .semi-portal-rtl .semi-input-wrapper__with-prefix .semi-input {
        padding-left: auto;
        padding-right: 0
    }

    .semi-rtl .semi-input-wrapper__with-suffix .semi-input,
    .semi-portal-rtl .semi-input-wrapper__with-suffix .semi-input {
        padding-left: 0;
        padding-right: auto
    }

    .semi-rtl .semi-input,
    .semi-portal-rtl .semi-input {
        padding-left: 12px;
        padding-right: 12px
    }

    .semi-rtl .semi-input-inset-label,
    .semi-portal-rtl .semi-input-inset-label {
        margin-left: 12px;
        margin-right: auto
    }

    .semi-rtl .semi-input-clearbtn+.semi-rtl .semi-input-suffix+.semi-input-suffix-text,
    .semi-rtl .semi-input-clearbtn+.semi-portal-rtl .semi-input-suffix+.semi-input-suffix-text,
    .semi-portal-rtl .semi-input-clearbtn+.semi-rtl .semi-input-suffix+.semi-input-suffix-text,
    .semi-portal-rtl .semi-input-clearbtn+.semi-portal-rtl .semi-input-suffix+.semi-input-suffix-text,
    .semi-rtl .semi-input-clearbtn+.semi-rtl .semi-input-suffix+.semi-input-suffix-icon,
    .semi-rtl .semi-input-clearbtn+.semi-portal-rtl .semi-input-suffix+.semi-input-suffix-icon,
    .semi-portal-rtl .semi-input-clearbtn+.semi-rtl .semi-input-suffix+.semi-input-suffix-icon,
    .semi-portal-rtl .semi-input-clearbtn+.semi-portal-rtl .semi-input-suffix+.semi-input-suffix-icon {
        margin-left: auto;
        margin-right: 0
    }

    .semi-rtl .semi-input-append,
    .semi-portal-rtl .semi-input-append {
        border-left: 0;
        border-right: 1px solid transparent
    }

    .semi-rtl .semi-input-prepend,
    .semi-portal-rtl .semi-input-prepend {
        border-left: 1px solid transparent;
        border-right: 0
    }

    .semi-rtl .semi-input-group .semi-select:not(:last-child):after,
    .semi-rtl .semi-input-group .semi-cascader:not(:last-child):after,
    .semi-rtl .semi-input-group .semi-tree-select:not(:last-child):after,
    .semi-rtl .semi-input-group>.semi-input-wrapper:not(:last-child):after,
    .semi-portal-rtl .semi-input-group .semi-select:not(:last-child):after,
    .semi-portal-rtl .semi-input-group .semi-cascader:not(:last-child):after,
    .semi-portal-rtl .semi-input-group .semi-tree-select:not(:last-child):after,
    .semi-portal-rtl .semi-input-group>.semi-input-wrapper:not(:last-child):after,
    .semi-rtl .semi-input-group .semi-input-number:not(:last-child):after,
    .semi-portal-rtl .semi-input-group .semi-input-number:not(:last-child):after {
        left: -1px;
        right: auto
    }

    .semi-rtl .semi-input-textarea-wrapper,
    .semi-portal-rtl .semi-input-textarea-wrapper {
        direction: rtl
    }

    .semi-rtl .semi-input-textarea-counter,
    .semi-portal-rtl .semi-input-textarea-counter {
        text-align: left
    }

    .semi-rtl .semi-input-textarea-showClear,
    .semi-portal-rtl .semi-input-textarea-showClear {
        padding-left: 36px;
        padding-right: 0
    }
}


@layer base {
    .semi-avatar {
        white-space: nowrap;
        text-align: center;
        vertical-align: middle;
        justify-content: center;
        align-items: center;
        display: inline-flex;
        position: relative;
        overflow: hidden
    }

    .semi-avatar:focus-visible {
        outline: 2px solid var(--semi-color-primary-light-active)
    }

    .semi-avatar-focus {
        outline: 2px solid var(--semi-color-primary-light-active)
    }

    .semi-avatar-no-focus-visible:focus-visible {
        outline: none
    }

    .semi-avatar .semi-avatar-label {
        align-items: center;
        font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif;
        font-size: 14px;
        font-weight: 600;
        line-height: 20px;
        display: flex
    }

    .semi-avatar-content {
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none
    }

    .semi-avatar-extra-extra-small {
        border-radius: 3px;
        width: 20px;
        height: 20px
    }

    .semi-avatar-extra-extra-small .semi-avatar-content {
        transform-origin: 50%;
        transform: scale(.8)
    }

    .semi-avatar-extra-extra-small .semi-avatar-label {
        font-size: 10px;
        line-height: 15px
    }

    .semi-avatar-extra-small {
        border-radius: 3px;
        width: 24px;
        height: 24px
    }

    .semi-avatar-extra-small .semi-avatar-content {
        transform-origin: 50%;
        transform: scale(.8)
    }

    .semi-avatar-extra-small .semi-avatar-label {
        font-size: 10px;
        line-height: 15px
    }

    .semi-avatar-small {
        border-radius: 3px;
        width: 32px;
        height: 32px
    }

    .semi-avatar-small .semi-avatar-label {
        font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif;
        font-size: 12px;
        line-height: 16px
    }

    .semi-avatar-default {
        border-radius: 3px;
        width: 40px;
        height: 40px
    }

    .semi-avatar-default .semi-avatar-label {
        font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif;
        font-size: 18px;
        line-height: 24px
    }

    .semi-avatar-medium {
        border-radius: 3px;
        width: 48px;
        height: 48px
    }

    .semi-avatar-medium .semi-avatar-label {
        font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif;
        font-size: 20px;
        line-height: 28px
    }

    .semi-avatar-large {
        border-radius: 6px;
        width: 72px;
        height: 72px
    }

    .semi-avatar-large .semi-avatar-label {
        font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif;
        font-size: 32px;
        line-height: 44px
    }

    .semi-avatar-extra-large {
        border-radius: 12px;
        width: 128px;
        height: 128px
    }

    .semi-avatar-extra-large .semi-avatar-label {
        font-size: 64px;
        line-height: 77px
    }

    .semi-avatar-circle {
        border-radius: var(--semi-border-radius-circle)
    }

    .semi-avatar-image {
        background-color: transparent
    }

    .semi-avatar>img {
        -o-object-fit: cover;
        object-fit: cover;
        width: 100%;
        height: 100%;
        display: block
    }

    .semi-avatar-hover {
        width: 100%;
        height: 100%;
        position: absolute;
        top: 0;
        left: 0
    }

    .semi-avatar:hover {
        cursor: pointer
    }

    .semi-avatar-wrapper {
        width: -moz-fit-content;
        flex-direction: column;
        align-items: center;
        width: fit-content;
        display: inline-flex;
        position: relative
    }

    .semi-avatar-wrapper .semi-avatar-top_slot-bg {
        border-radius: 50%;
        justify-content: center;
        display: flex;
        position: absolute;
        overflow: hidden
    }

    .semi-avatar-wrapper .semi-avatar-top_slot-bg-small {
        width: 32px;
        height: 32px
    }

    .semi-avatar-wrapper .semi-avatar-top_slot-bg-default {
        width: 40px;
        height: 40px
    }

    .semi-avatar-wrapper .semi-avatar-top_slot-bg-medium {
        width: 48px;
        height: 48px
    }

    .semi-avatar-wrapper .semi-avatar-top_slot-bg-large {
        width: 72px;
        height: 72px
    }

    .semi-avatar-wrapper .semi-avatar-top_slot-bg-extra-large {
        width: 128px;
        height: 128px
    }

    .semi-avatar-wrapper .semi-avatar-top_slot-bg-svg {
        position: absolute
    }

    .semi-avatar-wrapper .semi-avatar-top_slot-bg-svg-small {
        top: -28px;
        scale: .4
    }

    .semi-avatar-wrapper .semi-avatar-top_slot-bg-svg-default {
        top: -32px;
        scale: .7
    }

    .semi-avatar-wrapper .semi-avatar-top_slot-bg-svg-medium {
        top: -30px;
        scale: .8
    }

    .semi-avatar-wrapper .semi-avatar-top_slot-bg-svg-large {
        top: -30px;
        scale: 1.1
    }

    .semi-avatar-wrapper .semi-avatar-top_slot-bg-svg-extra-large {
        top: -32px;
        scale: 1.4
    }

    .semi-avatar-wrapper .semi-avatar-top_slot-wrapper {
        justify-content: center;
        display: flex;
        position: absolute
    }

    .semi-avatar-wrapper .semi-avatar-top_slot-wrapper .semi-avatar-top_slot {
        color: var(--semi-color-bg-0);
        font-weight: 600
    }

    .semi-avatar-wrapper .semi-avatar-top_slot-wrapper .semi-avatar-top_slot-content {
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        line-height: normal;
        position: relative
    }

    .semi-avatar-wrapper .semi-avatar-top_slot-wrapper .semi-avatar-top_slot-content-small {
        margin-top: 0;
        font-size: 5px
    }

    .semi-avatar-wrapper .semi-avatar-top_slot-wrapper .semi-avatar-top_slot-content-default {
        margin-top: -2px;
        font-size: 6px
    }

    .semi-avatar-wrapper .semi-avatar-top_slot-wrapper .semi-avatar-top_slot-content-medium {
        margin-top: 0;
        font-size: 8px
    }

    .semi-avatar-wrapper .semi-avatar-top_slot-wrapper .semi-avatar-top_slot-content-large {
        margin-top: 0;
        font-size: 14px
    }

    .semi-avatar-wrapper .semi-avatar-top_slot-wrapper .semi-avatar-top_slot-content-extra-large {
        margin-top: 0;
        font-size: 16px
    }

    .semi-avatar-wrapper .semi-avatar-bottom_slot {
        color: var(--semi-color-bg-0);
        cursor: pointer;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        position: absolute;
        bottom: 3.5px;
        transform: translateY(50%)
    }

    .semi-avatar-wrapper .semi-avatar-bottom_slot-shape_circle {
        background: var(--semi-color-primary);
        border-radius: var(--semi-border-radius-circle);
        justify-content: center;
        align-items: center;
        line-height: normal;
        display: flex
    }

    .semi-avatar-wrapper .semi-avatar-bottom_slot-shape_circle-extra-small,
    .semi-avatar-wrapper .semi-avatar-bottom_slot-shape_circle-small {
        width: 12px;
        height: 12px;
        font-size: 5px
    }

    .semi-avatar-wrapper .semi-avatar-bottom_slot-shape_circle-default {
        width: 16px;
        height: 16px;
        font-size: 12px
    }

    .semi-avatar-wrapper .semi-avatar-bottom_slot-shape_circle-medium {
        width: 18px;
        height: 18px;
        font-size: 12px
    }

    .semi-avatar-wrapper .semi-avatar-bottom_slot-shape_circle-large {
        width: 28px;
        height: 28px;
        font-size: 12px
    }

    .semi-avatar-wrapper .semi-avatar-bottom_slot-shape_circle-extra-large {
        width: 28px;
        height: 28px;
        font-size: 14px
    }

    .semi-avatar-wrapper .semi-avatar-bottom_slot-shape_square {
        background: var(--semi-color-primary);
        border-style: solid;
        border-color: var(--semi-color-bg-0);
        border-radius: 4px;
        justify-content: center;
        align-items: center;
        padding: 1px 4px;
        font-weight: 600;
        display: flex
    }

    .semi-avatar-wrapper .semi-avatar-bottom_slot-shape_square-extra_small,
    .semi-avatar-wrapper .semi-avatar-bottom_slot-shape_square-small {
        border-width: 2px;
        font-size: 5px
    }

    .semi-avatar-wrapper .semi-avatar-bottom_slot-shape_square-default,
    .semi-avatar-wrapper .semi-avatar-bottom_slot-shape_square-medium,
    .semi-avatar-wrapper .semi-avatar-bottom_slot-shape_square-large {
        border-width: 2px;
        font-size: 12px
    }

    .semi-avatar-wrapper .semi-avatar-bottom_slot-shape_square-extra-large {
        border-width: 2px;
        font-size: 14px
    }

    .semi-avatar-group {
        display: inline-block
    }

    .semi-avatar-group .semi-avatar {
        box-sizing: border-box
    }

    .semi-avatar-group .semi-avatar:first-child {
        margin-left: 0
    }

    .semi-avatar-group .semi-avatar-extra-large {
        border: 3px var(--semi-color-bg-1)solid;
        margin-left: -32px
    }

    .semi-avatar-group .semi-avatar-large {
        border: 3px var(--semi-color-bg-1)solid;
        margin-left: -18px
    }

    .semi-avatar-group .semi-avatar-medium,
    .semi-avatar-group .semi-avatar-default,
    .semi-avatar-group .semi-avatar-small {
        border: 2px var(--semi-color-bg-1)solid;
        margin-left: -12px
    }

    .semi-avatar-group .semi-avatar-extra-small {
        border: 1px var(--semi-color-bg-1)solid;
        margin-left: -10px
    }

    .semi-avatar-group .semi-avatar-extra-extra-small {
        border: 1px var(--semi-color-bg-1)solid;
        margin-left: -4px
    }

    .semi-avatar-group .semi-avatar-item-start-0 {
        z-index: 100
    }

    .semi-avatar-group .semi-avatar-item-end-0 {
        z-index: 80
    }

    .semi-avatar-group .semi-avatar-item-start-1 {
        z-index: 99
    }

    .semi-avatar-group .semi-avatar-item-end-1 {
        z-index: 81
    }

    .semi-avatar-group .semi-avatar-item-start-2 {
        z-index: 98
    }

    .semi-avatar-group .semi-avatar-item-end-2 {
        z-index: 82
    }

    .semi-avatar-group .semi-avatar-item-start-3 {
        z-index: 97
    }

    .semi-avatar-group .semi-avatar-item-end-3 {
        z-index: 83
    }

    .semi-avatar-group .semi-avatar-item-start-4 {
        z-index: 96
    }

    .semi-avatar-group .semi-avatar-item-end-4 {
        z-index: 84
    }

    .semi-avatar-group .semi-avatar-item-start-5 {
        z-index: 95
    }

    .semi-avatar-group .semi-avatar-item-end-5 {
        z-index: 85
    }

    .semi-avatar-group .semi-avatar-item-start-6 {
        z-index: 94
    }

    .semi-avatar-group .semi-avatar-item-end-6 {
        z-index: 86
    }

    .semi-avatar-group .semi-avatar-item-start-7 {
        z-index: 93
    }

    .semi-avatar-group .semi-avatar-item-end-7 {
        z-index: 87
    }

    .semi-avatar-group .semi-avatar-item-start-8 {
        z-index: 92
    }

    .semi-avatar-group .semi-avatar-item-end-8 {
        z-index: 88
    }

    .semi-avatar-group .semi-avatar-item-start-9 {
        z-index: 91
    }

    .semi-avatar-group .semi-avatar-item-end-9 {
        z-index: 89
    }

    .semi-avatar-group .semi-avatar-item-start-10,
    .semi-avatar-group .semi-avatar-item-end-10 {
        z-index: 90
    }

    .semi-avatar-group .semi-avatar-item-start-11 {
        z-index: 89
    }

    .semi-avatar-group .semi-avatar-item-end-11 {
        z-index: 91
    }

    .semi-avatar-group .semi-avatar-item-start-12 {
        z-index: 88
    }

    .semi-avatar-group .semi-avatar-item-end-12 {
        z-index: 92
    }

    .semi-avatar-group .semi-avatar-item-start-13 {
        z-index: 87
    }

    .semi-avatar-group .semi-avatar-item-end-13 {
        z-index: 93
    }

    .semi-avatar-group .semi-avatar-item-start-14 {
        z-index: 86
    }

    .semi-avatar-group .semi-avatar-item-end-14 {
        z-index: 94
    }

    .semi-avatar-group .semi-avatar-item-start-15 {
        z-index: 85
    }

    .semi-avatar-group .semi-avatar-item-end-15 {
        z-index: 95
    }

    .semi-avatar-group .semi-avatar-item-start-16 {
        z-index: 84
    }

    .semi-avatar-group .semi-avatar-item-end-16 {
        z-index: 96
    }

    .semi-avatar-group .semi-avatar-item-start-17 {
        z-index: 83
    }

    .semi-avatar-group .semi-avatar-item-end-17 {
        z-index: 97
    }

    .semi-avatar-group .semi-avatar-item-start-18 {
        z-index: 82
    }

    .semi-avatar-group .semi-avatar-item-end-18 {
        z-index: 98
    }

    .semi-avatar-group .semi-avatar-item-start-19 {
        z-index: 81
    }

    .semi-avatar-group .semi-avatar-item-end-19 {
        z-index: 99
    }

    .semi-avatar-group .semi-avatar-item-start-20 {
        z-index: 80
    }

    .semi-avatar-group .semi-avatar-item-end-20 {
        z-index: 100
    }

    .semi-avatar-group .semi-avatar-item-more {
        background-color: rgba(var(--semi-grey-5), 1)
    }

    .semi-avatar-amber {
        background-color: rgba(var(--semi-amber-3), 1);
        color: rgba(var(--semi-white), 1)
    }

    .semi-avatar-blue {
        background-color: rgba(var(--semi-blue-3), 1);
        color: rgba(var(--semi-white), 1)
    }

    .semi-avatar-cyan {
        background-color: rgba(var(--semi-cyan-3), 1);
        color: rgba(var(--semi-white), 1)
    }

    .semi-avatar-green {
        background-color: rgba(var(--semi-green-3), 1);
        color: rgba(var(--semi-white), 1)
    }

    .semi-avatar-grey {
        background-color: rgba(var(--semi-grey-3), 1);
        color: rgba(var(--semi-white), 1)
    }

    .semi-avatar-indigo {
        background-color: rgba(var(--semi-indigo-3), 1);
        color: rgba(var(--semi-white), 1)
    }

    .semi-avatar-light-blue {
        background-color: rgba(var(--semi-light-blue-3), 1);
        color: rgba(var(--semi-white), 1)
    }

    .semi-avatar-light-green {
        background-color: rgba(var(--semi-light-green-3), 1);
        color: rgba(var(--semi-white), 1)
    }

    .semi-avatar-lime {
        background-color: rgba(var(--semi-lime-3), 1);
        color: rgba(var(--semi-white), 1)
    }

    .semi-avatar-orange {
        background-color: rgba(var(--semi-orange-3), 1);
        color: rgba(var(--semi-white), 1)
    }

    .semi-avatar-pink {
        background-color: rgba(var(--semi-pink-3), 1);
        color: rgba(var(--semi-white), 1)
    }

    .semi-avatar-purple {
        background-color: rgba(var(--semi-purple-3), 1);
        color: rgba(var(--semi-white), 1)
    }

    .semi-avatar-red {
        background-color: rgba(var(--semi-red-3), 1);
        color: rgba(var(--semi-white), 1)
    }

    .semi-avatar-teal {
        background-color: rgba(var(--semi-teal-3), 1);
        color: rgba(var(--semi-white), 1)
    }

    .semi-avatar-violet {
        background-color: rgba(var(--semi-violet-3), 1);
        color: rgba(var(--semi-white), 1)
    }

    .semi-avatar-yellow {
        background-color: rgba(var(--semi-yellow-3), 1);
        color: rgba(var(--semi-white), 1)
    }

    .semi-avatar-additionalBorder {
        border-style: solid;
        border-color: var(--semi-color-primary);
        box-sizing: border-box;
        border-width: 1.5px;
        display: inline-block;
        position: absolute;
        top: -3.5px;
        left: -3.5px
    }

    .semi-avatar-additionalBorder-extra-extra-small {
        width: 27px;
        height: 27px
    }

    .semi-avatar-additionalBorder-extra-small {
        width: 31px;
        height: 31px
    }

    .semi-avatar-additionalBorder-small {
        width: 39px;
        height: 39px
    }

    .semi-avatar-additionalBorder-default {
        width: 47px;
        height: 47px
    }

    .semi-avatar-additionalBorder-medium {
        width: 55px;
        height: 55px
    }

    .semi-avatar-additionalBorder-large {
        width: 79px;
        height: 79px
    }

    .semi-avatar-additionalBorder-extra-large {
        width: 135px;
        height: 135px
    }

    .semi-avatar-square.semi-avatar-additionalBorder-extra_extra_small,
    .semi-avatar-square.semi-avatar-additionalBorder-extra_small,
    .semi-avatar-square.semi-avatar-additionalBorder-small,
    .semi-avatar-square.semi-avatar-additionalBorder-default,
    .semi-avatar-square.semi-avatar-additionalBorder-medium {
        border-radius: 3px
    }

    .semi-avatar-square.semi-avatar-additionalBorder-large {
        border-radius: 6px
    }

    .semi-avatar-additionalBorder-circle {
        border-radius: var(--semi-border-radius-circle)
    }

    .semi-avatar-additionalBorder-animated {
        animation: .8s linear infinite semi-avatar-additionalBorder
    }

    .semi-avatar-animated {
        animation: 1s linear infinite semi-avatar-content
    }

    @keyframes semi-avatar-additionalBorder {
        0% {
            opacity: 1;
            transform: scale(1)
        }

        to {
            opacity: 0;
            border-width: 0;
            transform: scale(1.15)
        }
    }

    @keyframes semi-avatar-content {
        0% {
            transform: scale(1)
        }

        50% {
            transform: scale(.9)
        }

        to {
            transform: scale(1)
        }
    }

    .semi-rtl .semi-avatar,
    .semi-portal-rtl .semi-avatar {
        direction: rtl
    }

    .semi-rtl .semi-avatar-extra-extra-small .semi-avatar-content,
    .semi-portal-rtl .semi-avatar-extra-extra-small .semi-avatar-content,
    .semi-rtl .semi-avatar-extra-small .semi-avatar-content,
    .semi-portal-rtl .semi-avatar-extra-small .semi-avatar-content {
        transform: scale(.8)
    }

    .semi-rtl .semi-avatar-hover,
    .semi-portal-rtl .semi-avatar-hover {
        left: auto;
        right: 0
    }

    .semi-rtl .semi-avatar-group,
    .semi-portal-rtl .semi-avatar-group {
        direction: rtl
    }

    .semi-rtl .semi-avatar-group .semi-avatar:first-child,
    .semi-portal-rtl .semi-avatar-group .semi-avatar:first-child {
        margin-left: auto;
        margin-right: 0
    }

    .semi-rtl .semi-avatar-group .semi-avatar-extra-large,
    .semi-portal-rtl .semi-avatar-group .semi-avatar-extra-large {
        margin-left: auto;
        margin-right: -32px
    }

    .semi-rtl .semi-avatar-group .semi-avatar-large,
    .semi-portal-rtl .semi-avatar-group .semi-avatar-large {
        margin-left: auto;
        margin-right: -18px
    }

    .semi-rtl .semi-avatar-group .semi-avatar-medium,
    .semi-rtl .semi-avatar-group .semi-avatar-small,
    .semi-portal-rtl .semi-avatar-group .semi-avatar-medium,
    .semi-portal-rtl .semi-avatar-group .semi-avatar-small {
        margin-left: auto;
        margin-right: -12px
    }

    .semi-rtl .semi-avatar-group .semi-avatar-extra-small,
    .semi-portal-rtl .semi-avatar-group .semi-avatar-extra-small {
        margin-left: auto;
        margin-right: -10px
    }

    .semi-rtl .semi-avatar-group .semi-avatar-extra-extra-small,
    .semi-portal-rtl .semi-avatar-group .semi-avatar-extra-extra-small {
        margin-left: auto;
        margin-right: -4px
    }
}


@layer base {
    .semi-tag {
        box-sizing: border-box;
        border-radius: var(--semi-border-radius-small);
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        white-space: nowrap;
        vertical-align: bottom;
        background-color: transparent;
        justify-content: center;
        align-items: center;
        display: inline-flex;
        position: relative;
        overflow: hidden
    }

    .semi-tag-default,
    .semi-tag-small {
        height: 20px;
        padding: 2px 8px;
        font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif;
        font-size: 12px;
        line-height: 16px
    }

    .semi-tag-default:focus-visible {
        outline: 2px solid var(--semi-color-primary-light-active)
    }

    .semi-tag-small:focus-visible {
        outline: 2px solid var(--semi-color-primary-light-active)
    }

    .semi-tag-square {
        border-radius: var(--semi-border-radius-small)
    }

    .semi-tag-circle {
        border-radius: var(--semi-border-radius-full)
    }

    .semi-tag-large {
        height: 24px;
        padding: 4px 8px;
        font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif;
        font-size: 12px;
        line-height: 16px
    }

    .semi-tag-large:focus-visible {
        outline: 2px solid var(--semi-color-primary-light-active)
    }

    .semi-tag-invisible {
        display: none
    }

    .semi-tag-prefix-icon {
        padding-right: 4px;
        display: flex
    }

    .semi-tag-suffix-icon {
        padding-left: 4px;
        display: flex
    }

    .semi-tag-content {
        flex: 1
    }

    .semi-tag-content-ellipsis {
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow: hidden
    }

    .semi-tag-content-center {
        justify-content: center;
        align-items: center;
        min-width: 0;
        height: 100%;
        display: flex
    }

    .semi-tag-close {
        color: var(--semi-color-text-2);
        cursor: pointer;
        justify-content: center;
        align-items: center;
        padding-left: 4px;
        display: flex
    }

    .semi-tag-close:hover {
        color: var(--semi-color-text-1)
    }

    .semi-tag-close:active {
        color: var(--semi-color-text-0)
    }

    .semi-tag-closable {
        padding: 4px 4px 4px 8px
    }

    .semi-tag-avatar-square .semi-avatar,
    .semi-tag-avatar-circle .semi-avatar {
        margin-right: 4px
    }

    .semi-tag-avatar-square {
        padding: 0 4px 0 0
    }

    .semi-tag-avatar-square .semi-avatar>img {
        background-color: var(--semi-color-default)
    }

    .semi-tag-avatar-circle {
        padding: 2px 4px 2px 2px
    }

    .semi-tag-avatar-square.semi-tag-default .semi-avatar,
    .semi-tag-avatar-square.semi-tag-small .semi-avatar {
        width: 20px;
        height: 20px
    }

    .semi-tag-avatar-square.semi-tag-large .semi-avatar {
        width: 24px;
        height: 24px
    }

    .semi-tag-avatar-circle.semi-tag-small,
    .semi-tag-avatar-circle.semi-tag-default {
        border-radius: 11px
    }

    .semi-tag-avatar-circle.semi-tag-small .semi-avatar,
    .semi-tag-avatar-circle.semi-tag-default .semi-avatar {
        width: 16px;
        height: 16px
    }

    .semi-tag-avatar-circle.semi-tag-large {
        border-radius: 13px
    }

    .semi-tag-avatar-circle.semi-tag-large .semi-avatar {
        width: 20px;
        height: 20px
    }

    .semi-tag-group {
        height: auto;
        display: block
    }

    .semi-tag-group .semi-tag {
        margin-bottom: 0;
        margin-right: 8px
    }

    .semi-tag-group-max.semi-tag-group-small {
        height: 22px
    }

    .semi-tag-group-max.semi-tag-group-large {
        height: 26px
    }

    .semi-tag-rest-group-popover .semi-tag {
        margin-bottom: 0;
        margin-right: 8px
    }

    .semi-tag-rest-group-popover .semi-tag:last-of-type {
        margin-right: 0
    }

    .semi-tag-amber-ghost {
        border: 1px solid rgba(var(--semi-amber-4), 1);
        color: rgba(var(--semi-amber-5), 1);
        background-color: transparent
    }

    .semi-tag-amber-solid {
        background-color: rgba(var(--semi-amber-5), 1);
        color: rgba(var(--semi-white), 1)
    }

    .semi-tag-amber-light {
        background-color: rgba(var(--semi-amber-5), .15);
        color: rgba(var(--semi-amber-8), 1)
    }

    .semi-tag-blue-ghost {
        border: 1px solid rgba(var(--semi-blue-4), 1);
        color: rgba(var(--semi-blue-5), 1);
        background-color: transparent
    }

    .semi-tag-blue-solid {
        background-color: rgba(var(--semi-blue-5), 1);
        color: rgba(var(--semi-white), 1)
    }

    .semi-tag-blue-light {
        background-color: rgba(var(--semi-blue-5), .15);
        color: rgba(var(--semi-blue-8), 1)
    }

    .semi-tag-cyan-ghost {
        border: 1px solid rgba(var(--semi-cyan-4), 1);
        color: rgba(var(--semi-cyan-5), 1);
        background-color: transparent
    }

    .semi-tag-cyan-solid {
        background-color: rgba(var(--semi-cyan-5), 1);
        color: rgba(var(--semi-white), 1)
    }

    .semi-tag-cyan-light {
        background-color: rgba(var(--semi-cyan-5), .15);
        color: rgba(var(--semi-cyan-8), 1)
    }

    .semi-tag-green-ghost {
        border: 1px solid rgba(var(--semi-green-4), 1);
        color: rgba(var(--semi-green-5), 1);
        background-color: transparent
    }

    .semi-tag-green-solid {
        background-color: rgba(var(--semi-green-5), 1);
        color: rgba(var(--semi-white), 1)
    }

    .semi-tag-green-light {
        background-color: rgba(var(--semi-green-5), .15);
        color: rgba(var(--semi-green-8), 1)
    }

    .semi-tag-grey-ghost {
        border: 1px solid rgba(var(--semi-grey-4), 1);
        color: rgba(var(--semi-grey-5), 1);
        background-color: transparent
    }

    .semi-tag-grey-solid {
        background-color: rgba(var(--semi-grey-5), 1);
        color: rgba(var(--semi-white), 1)
    }

    .semi-tag-grey-light {
        background-color: rgba(var(--semi-grey-5), .15);
        color: rgba(var(--semi-grey-8), 1)
    }

    .semi-tag-indigo-ghost {
        border: 1px solid rgba(var(--semi-indigo-4), 1);
        color: rgba(var(--semi-indigo-5), 1);
        background-color: transparent
    }

    .semi-tag-indigo-solid {
        background-color: rgba(var(--semi-indigo-5), 1);
        color: rgba(var(--semi-white), 1)
    }

    .semi-tag-indigo-light {
        background-color: rgba(var(--semi-indigo-5), .15);
        color: rgba(var(--semi-indigo-8), 1)
    }

    .semi-tag-light-blue-ghost {
        border: 1px solid rgba(var(--semi-light-blue-4), 1);
        color: rgba(var(--semi-light-blue-5), 1);
        background-color: transparent
    }

    .semi-tag-light-blue-solid {
        background-color: rgba(var(--semi-light-blue-5), 1);
        color: rgba(var(--semi-white), 1)
    }

    .semi-tag-light-blue-light {
        background-color: rgba(var(--semi-light-blue-5), .15);
        color: rgba(var(--semi-light-blue-8), 1)
    }

    .semi-tag-light-green-ghost {
        border: 1px solid rgba(var(--semi-light-green-4), 1);
        color: rgba(var(--semi-light-green-5), 1);
        background-color: transparent
    }

    .semi-tag-light-green-solid {
        background-color: rgba(var(--semi-light-green-5), 1);
        color: rgba(var(--semi-white), 1)
    }

    .semi-tag-light-green-light {
        background-color: rgba(var(--semi-light-green-5), .15);
        color: rgba(var(--semi-light-green-8), 1)
    }

    .semi-tag-lime-ghost {
        border: 1px solid rgba(var(--semi-lime-4), 1);
        color: rgba(var(--semi-lime-5), 1);
        background-color: transparent
    }

    .semi-tag-lime-solid {
        background-color: rgba(var(--semi-lime-5), 1);
        color: rgba(var(--semi-white), 1)
    }

    .semi-tag-lime-light {
        background-color: rgba(var(--semi-lime-5), .15);
        color: rgba(var(--semi-lime-8), 1)
    }

    .semi-tag-orange-ghost {
        border: 1px solid rgba(var(--semi-orange-4), 1);
        color: rgba(var(--semi-orange-5), 1);
        background-color: transparent
    }

    .semi-tag-orange-solid {
        background-color: rgba(var(--semi-orange-5), 1);
        color: rgba(var(--semi-white), 1)
    }

    .semi-tag-orange-light {
        background-color: rgba(var(--semi-orange-5), .15);
        color: rgba(var(--semi-orange-8), 1)
    }

    .semi-tag-pink-ghost {
        border: 1px solid rgba(var(--semi-pink-4), 1);
        color: rgba(var(--semi-pink-5), 1);
        background-color: transparent
    }

    .semi-tag-pink-solid {
        background-color: rgba(var(--semi-pink-5), 1);
        color: rgba(var(--semi-white), 1)
    }

    .semi-tag-pink-light {
        background-color: rgba(var(--semi-pink-5), .15);
        color: rgba(var(--semi-pink-8), 1)
    }

    .semi-tag-purple-ghost {
        border: 1px solid rgba(var(--semi-purple-4), 1);
        color: rgba(var(--semi-purple-5), 1);
        background-color: transparent
    }

    .semi-tag-purple-solid {
        background-color: rgba(var(--semi-purple-5), 1);
        color: rgba(var(--semi-white), 1)
    }

    .semi-tag-purple-light {
        background-color: rgba(var(--semi-purple-5), .15);
        color: rgba(var(--semi-purple-8), 1)
    }

    .semi-tag-red-ghost {
        border: 1px solid rgba(var(--semi-red-4), 1);
        color: rgba(var(--semi-red-5), 1);
        background-color: transparent
    }

    .semi-tag-red-solid {
        background-color: rgba(var(--semi-red-5), 1);
        color: rgba(var(--semi-white), 1)
    }

    .semi-tag-red-light {
        background-color: rgba(var(--semi-red-5), .15);
        color: rgba(var(--semi-red-8), 1)
    }

    .semi-tag-teal-ghost {
        border: 1px solid rgba(var(--semi-teal-4), 1);
        color: rgba(var(--semi-teal-5), 1);
        background-color: transparent
    }

    .semi-tag-teal-solid {
        background-color: rgba(var(--semi-teal-5), 1);
        color: rgba(var(--semi-white), 1)
    }

    .semi-tag-teal-light {
        background-color: rgba(var(--semi-teal-5), .15);
        color: rgba(var(--semi-teal-8), 1)
    }

    .semi-tag-violet-ghost {
        border: 1px solid rgba(var(--semi-violet-4), 1);
        color: rgba(var(--semi-violet-5), 1);
        background-color: transparent
    }

    .semi-tag-violet-solid {
        background-color: rgba(var(--semi-violet-5), 1);
        color: rgba(var(--semi-white), 1)
    }

    .semi-tag-violet-light {
        background-color: rgba(var(--semi-violet-5), .15);
        color: rgba(var(--semi-violet-8), 1)
    }

    .semi-tag-yellow-ghost {
        border: 1px solid rgba(var(--semi-yellow-4), 1);
        color: rgba(var(--semi-yellow-5), 1);
        background-color: transparent
    }

    .semi-tag-yellow-solid {
        background-color: rgba(var(--semi-yellow-5), 1);
        color: rgba(var(--semi-white), 1)
    }

    .semi-tag-yellow-light {
        background-color: rgba(var(--semi-yellow-5), .15);
        color: rgba(var(--semi-yellow-8), 1)
    }

    .semi-tag-white-ghost,
    .semi-tag-white-solid,
    .semi-tag-white-light {
        background-color: var(--semi-color-bg-4);
        border: 1px solid rgba(var(--semi-grey-2), .7);
        color: var(--semi-color-text-0)
    }

    .semi-tag-white-ghost .semi-tag-close,
    .semi-tag-white-light .semi-tag-close,
    .semi-tag-white-solid .semi-tag-close {
        color: var(--semi-color-text-2)
    }

    .semi-tag-avatar-square,
    .semi-tag-avatar-circle {
        background-color: var(--semi-color-bg-4);
        border: 1px solid var(--semi-color-border);
        color: var(--semi-color-text-0)
    }

    .semi-tag-solid .semi-tag-close {
        color: var(--semi-color-white);
        opacity: .8
    }

    .semi-tag-solid .semi-tag-close:hover {
        opacity: 1
    }

    .semi-tag-solid .semi-tag-close:active {
        opacity: .9
    }

    .semi-rtl .semi-tag,
    .semi-portal-rtl .semi-tag {
        direction: rtl
    }

    .semi-rtl .semi-tag-close,
    .semi-portal-rtl .semi-tag-close {
        padding-left: auto;
        padding-right: 4px
    }

    .semi-rtl .semi-tag-closable,
    .semi-portal-rtl .semi-tag-closable {
        padding: 4px 8px 4px 4px
    }

    .semi-rtl .semi-tag-avatar-square .semi-avatar,
    .semi-rtl .semi-tag-avatar-circle .semi-avatar,
    .semi-portal-rtl .semi-tag-avatar-square .semi-avatar,
    .semi-portal-rtl .semi-tag-avatar-circle .semi-avatar {
        margin-left: 4px;
        margin-right: auto
    }

    .semi-rtl .semi-tag-avatar-square,
    .semi-portal-rtl .semi-tag-avatar-square {
        padding-left: 4px;
        padding-right: auto
    }

    .semi-rtl .semi-tag-avatar-circle,
    .semi-portal-rtl .semi-tag-avatar-circle {
        padding: 2px 2px 2px 4px
    }

    .semi-rtl .semi-tag-group,
    .semi-portal-rtl .semi-tag-group {
        direction: rtl
    }

    .semi-rtl .semi-tag-group .semi-tag,
    .semi-portal-rtl .semi-tag-group .semi-tag {
        margin-left: 8px;
        margin-right: auto
    }

    .semi-rtl .semi-tag-rest-group-popover,
    .semi-portal-rtl .semi-tag-rest-group-popover {
        direction: rtl
    }

    .semi-rtl .semi-tag-rest-group-popover .semi-tag,
    .semi-portal-rtl .semi-tag-rest-group-popover .semi-tag {
        margin-left: 8px;
        margin-right: 0
    }

    .semi-rtl .semi-tag-rest-group-popover .semi-tag:last-of-type,
    .semi-portal-rtl .semi-tag-rest-group-popover .semi-tag:last-of-type {
        margin-left: 0;
        margin-right: auto
    }
}


@layer base {
    .semi-overflow-list {
        flex-wrap: nowrap;
        min-width: 0;
        display: flex
    }

    .semi-overflow-list-spacer {
        flex-shrink: 1;
        width: 1px
    }

    .semi-overflow-list-scroll-wrapper {
        flex-wrap: nowrap;
        flex: 1;
        display: flex;
        overflow-x: scroll
    }

    .semi-rtl .semi-overflow-list,
    .semi-portal-rtl .semi-overflow-list {
        direction: rtl
    }
}


@layer base {
    .semi-space {
        display: inline-flex
    }

    .semi-space-vertical {
        flex-direction: column
    }

    .semi-space-horizontal {
        flex-direction: row
    }

    .semi-space-align-center {
        align-items: center
    }

    .semi-space-align-end {
        align-items: flex-end
    }

    .semi-space-align-start {
        align-items: flex-start
    }

    .semi-space-align-baseline {
        align-items: baseline
    }

    .semi-space-wrap {
        flex-wrap: wrap
    }

    .semi-space-tight-horizontal {
        -moz-column-gap: 8px;
        column-gap: 8px
    }

    .semi-space-tight-vertical {
        row-gap: 8px
    }

    .semi-space-medium-horizontal {
        -moz-column-gap: 16px;
        column-gap: 16px
    }

    .semi-space-medium-vertical {
        row-gap: 16px
    }

    .semi-space-loose-horizontal {
        -moz-column-gap: 24px;
        column-gap: 24px
    }

    .semi-space-loose-vertical {
        row-gap: 24px
    }

    .semi-rtl .semi-space,
    .semi-portal-rtl .semi-space {
        direction: rtl
    }
}


@layer base {
    .semi-highlight-tag {
        color: var(--semi-color-highlight);
        background-color: var(--semi-color-highlight-bg);
        font-weight: 600
    }
}


@layer base {
    .semi-select-option {
        word-break: break-all;
        color: var(--semi-color-text-0);
        cursor: pointer;
        box-sizing: border-box;
        transition: background-color var(--semi-transition_duration-none)var(--semi-transition_function-easeIn)var(--semi-transition_delay-none);
        border-radius: 0;
        flex-wrap: nowrap;
        align-items: center;
        padding: 8px 12px;
        font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif;
        font-size: 14px;
        line-height: 20px;
        display: flex;
        position: relative
    }

    .semi-select-option-icon {
        color: transparent;
        align-content: center;
        justify-content: center;
        width: 12px;
        margin-right: 8px;
        display: flex
    }

    .semi-select-option-text {
        white-space: pre;
        flex-wrap: wrap;
        display: flex
    }

    .semi-select-option-keyword {
        color: var(--semi-color-primary);
        background-color: inherit;
        font-weight: 600
    }

    .semi-select-option:active {
        background-color: var(--semi-color-fill-1)
    }

    .semi-select-option-empty {
        cursor: not-allowed;
        color: var(--semi-color-disabled-text);
        justify-content: center
    }

    .semi-select-option-empty:hover,
    .semi-select-option-empty:active {
        background-color: inherit
    }

    .semi-select-option-disabled {
        color: var(--semi-color-disabled-text);
        cursor: not-allowed
    }

    .semi-select-option-disabled:hover {
        background-color: var(--semi-color-fill-0)
    }

    .semi-select-option-selected {
        background: 0 0;
        font-weight: 600
    }

    .semi-select-option-selected .semi-select-option-icon {
        color: var(--semi-color-text-2)
    }

    .semi-select-option-focused {
        background-color: var(--semi-color-fill-0)
    }

    .semi-select {
        box-sizing: border-box;
        border-radius: var(--semi-border-radius-small);
        background-color: var(--semi-color-fill-0);
        vertical-align: middle;
        cursor: pointer;
        height: 32px;
        transition: background-color var(--semi-transition_duration-none)var(--semi-transition_function-easeIn)var(--semi-transition_delay-none), border var(--semi-transition_duration-none)var(--semi-transition_function-easeIn)var(--semi-transition_delay-none);
        transform: scale(var(--semi-transform_scale-none));
        border: 1px solid transparent;
        outline: none;
        max-height: 300px;
        font-weight: 400;
        display: inline-flex;
        position: relative;
        overflow-y: auto
    }

    .semi-select:hover {
        background-color: var(--semi-color-fill-1);
        border: 1px solid transparent
    }

    .semi-select:focus {
        border: 1px solid var(--semi-color-focus-border);
        background-color: var(--semi-color-fill-0);
        outline: 0
    }

    .semi-select:active {
        background-color: var(--semi-color-fill-2)
    }

    .semi-select-small {
        height: 24px;
        line-height: 24px
    }

    .semi-select-large {
        min-height: 40px;
        line-height: 40px
    }

    .semi-select-large .semi-select-selection {
        font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif;
        font-size: 16px;
        line-height: 22px
    }

    .semi-select-open,
    .semi-select-focus {
        border: 1px solid var(--semi-color-focus-border);
        outline: 0
    }

    .semi-select-open:hover,
    .semi-select-focus:hover {
        background-color: var(--semi-color-fill-0);
        border: 1px solid var(--semi-color-focus-border)
    }

    .semi-select-open:active,
    .semi-select-focus:active {
        background-color: var(--semi-color-fill-2);
        border: 1px solid var(--semi-color-focus-border)
    }

    .semi-select-warning {
        background-color: var(--semi-color-warning-light-default);
        border-color: var(--semi-color-warning-light-default)
    }

    .semi-select-warning:hover {
        background-color: var(--semi-color-warning-light-hover);
        border-color: var(--semi-color-warning-light-hover)
    }

    .semi-select-warning:focus {
        background-color: var(--semi-color-warning-light-default);
        border-color: var(--semi-color-warning)
    }

    .semi-select-warning:active {
        background-color: var(--semi-color-warning-light-active);
        border-color: var(--semi-color-warning-light-active)
    }

    .semi-select-error {
        background-color: var(--semi-color-danger-light-default);
        border-color: var(--semi-color-danger-light-default)
    }

    .semi-select-error:hover {
        background-color: var(--semi-color-danger-light-hover);
        border-color: var(--semi-color-danger-light-hover)
    }

    .semi-select-error:focus {
        background-color: var(--semi-color-danger-light-default);
        border-color: var(--semi-color-danger)
    }

    .semi-select-error:active {
        background-color: var(--semi-color-danger-light-active);
        border-color: var(--semi-color-danger-light-active)
    }

    .semi-select-disabled {
        cursor: not-allowed;
        background-color: var(--semi-color-disabled-fill)
    }

    .semi-select-disabled:hover {
        background-color: var(--semi-color-disabled-fill)
    }

    .semi-select-disabled:focus {
        background-color: var(--semi-color-disabled-fill);
        border: 1px solid transparent
    }

    .semi-select-disabled .semi-select-selection,
    .semi-select-disabled .semi-select-selection-placeholder {
        color: var(--semi-color-disabled-text);
        cursor: not-allowed
    }

    .semi-select-disabled .semi-select-arrow,
    .semi-select-disabled .semi-select-prefix,
    .semi-select-disabled .semi-select-suffix {
        color: var(--semi-color-disabled-text)
    }

    .semi-select-disabled .semi-tag {
        color: var(--semi-color-disabled-text);
        background-color: transparent
    }

    .semi-select-selection {
        cursor: pointer;
        height: 100%;
        color: var(--semi-color-text-0);
        flex-grow: 1;
        align-items: center;
        margin-left: 12px;
        font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif;
        font-size: 14px;
        line-height: 20px;
        display: flex;
        overflow: hidden
    }

    .semi-select-selection-text {
        text-overflow: ellipsis;
        width: 100%;
        overflow: hidden
    }

    .semi-select-selection-text-inactive {
        opacity: .4;
        display: flex
    }

    .semi-select-selection-text-hide {
        display: none
    }

    .semi-select-selection-placeholder {
        color: var(--semi-color-text-2)
    }

    .semi-select-selection .semi-tag {
        margin-top: 1px;
        margin-bottom: 1px;
        margin-right: 4px
    }

    .semi-select-selection .semi-tag:first-of-type {
        margin-left: 0
    }

    .semi-select-selection .semi-tag-group {
        height: inherit
    }

    .semi-select-selection .semi-tag-group .semi-tag {
        margin-top: 1px;
        margin-bottom: 1px;
        margin-right: 4px
    }

    .semi-select-content-wrapper {
        white-space: nowrap;
        align-items: center;
        height: 100%;
        display: flex;
        overflow: hidden
    }

    .semi-select-content-wrapper-collapse {
        flex-shrink: 0;
        width: 100%;
        display: inline-flex
    }

    .semi-select-content-wrapper-collapse .semi-overflow-list-overflow {
        min-width: 50px;
        max-width: 100%
    }

    .semi-select-content-wrapper-collapse>.semi-select-content-wrapper-collapse-tag {
        background-color: transparent
    }

    .semi-select-content-wrapper-collapse>.semi-select-content-wrapper-collapse-N {
        color: var(--semi-color-text-0);
        background-color: transparent;
        padding: 4px;
        font-size: 12px
    }

    .semi-select-multiple {
        height: auto
    }

    .semi-select-multiple .semi-select-selection {
        margin-left: 4px
    }

    .semi-select-multiple .semi-select-content-wrapper {
        flex-wrap: wrap;
        width: 100%;
        min-height: 30px
    }

    .semi-select-multiple .semi-select-content-wrapper-empty {
        margin-left: 8px
    }

    .semi-select-multiple .semi-select-content-wrapper .semi-tag-group {
        align-items: center;
        display: flex
    }

    .semi-select-multiple .semi-select-content-wrapper-one-line {
        flex-wrap: nowrap
    }

    .semi-select-multiple .semi-select-content-wrapper-one-line .semi-tag-group {
        flex-wrap: nowrap;
        flex-shrink: 0;
        justify-content: flex-start;
        overflow: hidden
    }

    .semi-select-multiple .semi-select-inline-label-wrapper {
        flex-shrink: 0
    }

    .semi-select-multiple.semi-select-large .semi-select-content-wrapper {
        min-height: 38px
    }

    .semi-select-multiple.semi-select-small .semi-select-content-wrapper {
        min-height: 22px
    }

    .semi-select-arrow {
        width: 32px;
        color: var(--semi-color-text-2);
        transform: rotate(var(--semi-transform-rotate-none));
        flex-shrink: 0;
        justify-content: center;
        align-items: center;
        display: flex
    }

    .semi-select-arrow-empty {
        width: 12px;
        display: flex
    }

    .semi-select-prefix,
    .semi-select-suffix {
        justify-content: center;
        align-items: center;
        display: flex
    }

    .semi-select-prefix-text,
    .semi-select-suffix-text {
        margin: 0 12px
    }

    .semi-select-prefix-icon,
    .semi-select-suffix-icon {
        color: var(--semi-color-text-2);
        margin: 0 8px
    }

    .semi-select-suffix {
        justify-content: center;
        align-items: center;
        display: flex
    }

    .semi-select-clear {
        width: 32px;
        color: var(--semi-color-text-2);
        flex-shrink: 0;
        justify-content: center;
        align-items: center;
        display: flex
    }

    .semi-select-clear:hover {
        color: var(--semi-color-primary)
    }

    .semi-select-inset-label-wrapper {
        display: inline
    }

    .semi-select-inset-label {
        color: var(--semi-color-text-2);
        white-space: nowrap;
        flex-shrink: 0;
        margin-right: 12px;
        font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif;
        font-size: 14px;
        font-weight: 600;
        line-height: 20px
    }

    .semi-select-create-tips {
        color: var(--semi-color-text-2);
        margin-right: 4px
    }

    .semi-select-with-prefix .semi-select-selection {
        margin-left: 0
    }

    .semi-select-single.semi-select-filterable .semi-select-content-wrapper {
        flex-grow: 1;
        height: 100%;
        position: relative;
        overflow: hidden
    }

    .semi-select-single.semi-select-filterable .semi-input-wrapper {
        background-color: transparent;
        border: none;
        width: 100%;
        height: 100%;
        position: absolute;
        top: 0;
        left: 0
    }

    .semi-select-single.semi-select-filterable .semi-input-wrapper-focus {
        border: none
    }

    .semi-select-single.semi-select-filterable .semi-input {
        height: 100%;
        padding-left: 0;
        padding-right: 0
    }

    .semi-select-multiple.semi-select-filterable .semi-select-content-wrapper {
        flex-grow: 1;
        height: 100%;
        position: relative;
        overflow: hidden
    }

    .semi-select-multiple.semi-select-filterable .semi-select-content-wrapper:not(.semi-select-content-wrapper-empty) .semi-input-wrapper {
        height: 24px;
        line-height: 24px
    }

    .semi-select-multiple.semi-select-filterable .semi-select-content-wrapper:not(.semi-select-content-wrapper-empty) .semi-input-wrapper .semi-input-default {
        height: 24px
    }

    .semi-select-multiple.semi-select-filterable .semi-select-content-wrapper-empty .semi-input-wrapper {
        height: 100%;
        position: absolute;
        top: 0;
        left: 0
    }

    .semi-select-multiple.semi-select-filterable .semi-select-content-wrapper-empty .semi-input-wrapper .semi-input-default {
        height: 100%
    }

    .semi-select-multiple.semi-select-filterable .semi-input-wrapper {
        background-color: transparent;
        border: none;
        width: 100%;
        height: 100%
    }

    .semi-select-multiple.semi-select-filterable .semi-input-wrapper-focus {
        border: none
    }

    .semi-select-multiple.semi-select-filterable .semi-input {
        padding-left: 0;
        padding-right: 0
    }

    .semi-select-multiple.semi-select-filterable.semi-select-large .semi-select-content-wrapper:not(.semi-select-content-wrapper-empty) .semi-input-wrapper-large {
        height: 24px;
        line-height: 24px
    }

    .semi-select-multiple.semi-select-filterable.semi-select-large .semi-select-content-wrapper:not(.semi-select-content-wrapper-empty) .semi-input-wrapper-large .semi-input-large {
        height: 24px
    }

    .semi-select-multiple.semi-select-filterable.semi-select-small .semi-select-content-wrapper:not(.semi-select-content-wrapper-empty) .semi-input-wrapper {
        height: 20px;
        line-height: 20px
    }

    .semi-select-multiple.semi-select-filterable.semi-select-small .semi-select-content-wrapper:not(.semi-select-content-wrapper-empty) .semi-input-wrapper .semi-input-small {
        height: 20px
    }

    .semi-select-option-list-wrapper {
        padding: 4px 0
    }

    .semi-select-option-list {
        overflow-x: hidden;
        overflow-y: auto
    }

    .semi-select-option-list-chosen .semi-select-option-icon {
        display: flex
    }

    .semi-select-group {
        color: var(--semi-color-text-2);
        cursor: default;
        margin-top: 4px;
        padding: 12px 16px 4px 32px;
        font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif;
        font-size: 12px;
        line-height: 16px
    }

    .semi-select-group:not(:first-of-type) {
        border-top: 1px solid var(--semi-color-border)
    }

    .semi-select-loading-wrapper {
        cursor: not-allowed;
        box-sizing: content-box;
        height: 20px;
        padding: 8px 16px
    }

    .semi-select-borderless:not(:focus-within):not(:hover) {
        background-color: transparent;
        border-color: transparent
    }

    .semi-select-borderless:not(:focus-within):not(:hover) .semi-select-arrow {
        opacity: 0
    }

    .semi-select-borderless:focus-within:not(:active) {
        background-color: transparent
    }

    .semi-select-borderless.semi-select-error:not(:focus-within) {
        border-color: var(--semi-color-danger)
    }

    .semi-select-borderless.semi-select-warning:not(:focus-within) {
        border-color: var(--semi-color-warning)
    }

    .semi-select-borderless.semi-select-error:focus-within {
        border-color: var(--semi-color-danger)
    }

    .semi-select-borderless.semi-select-warning:focus-within {
        border-color: var(--semi-color-warning)
    }

    .semi-select-dropdown-search-wrapper {
        border-bottom: 1px solid transparent;
        padding: 8px 12px
    }

    .semi-rtl .semi-select,
    .semi-portal-rtl .semi-select {
        direction: rtl
    }

    .semi-rtl .semi-select-selection,
    .semi-portal-rtl .semi-select-selection {
        margin-left: 0;
        margin-right: 12px
    }

    .semi-rtl .semi-select-selection .semi-tag:first-of-type,
    .semi-portal-rtl .semi-select-selection .semi-tag:first-of-type {
        margin-right: 0
    }

    .semi-rtl .semi-select-selection .semi-tag-group .semi-tag,
    .semi-portal-rtl .semi-select-selection .semi-tag-group .semi-tag {
        margin-left: 4px;
        margin-right: 0
    }

    .semi-rtl .semi-select-multiple .semi-select-selection,
    .semi-portal-rtl .semi-select-multiple .semi-select-selection {
        margin-left: 0;
        margin-right: 4px
    }

    .semi-rtl .semi-select-multiple .semi-select-content-wrapper-empty,
    .semi-portal-rtl .semi-select-multiple .semi-select-content-wrapper-empty {
        margin-left: 0;
        margin-right: 8px
    }

    .semi-rtl .semi-select-inset-label,
    .semi-portal-rtl .semi-select-inset-label {
        margin-left: 12px
    }

    .semi-rtl .semi-select-create-tips,
    .semi-portal-rtl .semi-select-create-tips {
        margin-left: 4px;
        margin-right: 0
    }

    .semi-rtl .semi-select-with-prefix .semi-select-selection,
    .semi-portal-rtl .semi-select-with-prefix .semi-select-selection {
        margin-left: auto;
        margin-right: 0
    }

    .semi-rtl .semi-select-single.semi-select-filterable .semi-input-wrapper,
    .semi-portal-rtl .semi-select-single.semi-select-filterable .semi-input-wrapper,
    .semi-rtl .semi-select-multiple.semi-select-filterable .semi-select-content-wrapper-empty .semi-input-wrapper,
    .semi-portal-rtl .semi-select-multiple.semi-select-filterable .semi-select-content-wrapper-empty .semi-input-wrapper {
        left: auto;
        right: 0
    }

    .semi-rtl .semi-select-group,
    .semi-portal-rtl .semi-select-group {
        padding-left: 32px;
        padding-right: 16px
    }

    .semi-rtl .semi-select-option-icon,
    .semi-portal-rtl .semi-select-option-icon {
        margin-left: 8px;
        margin-right: 0
    }
}


@layer base {
    .semi-toast {
        pointer-events: none
    }

    .semi-toast-wrapper {
        z-index: 1010;
        justify-content: center;
        width: 100%;
        height: 0;
        display: flex;
        position: fixed;
        top: 0
    }

    .semi-toast-wrapper .semi-toast-innerWrapper {
        width: -moz-fit-content;
        width: fit-content;
        height: -moz-fit-content;
        text-align: center;
        height: fit-content
    }

    .semi-toast-wrapper .semi-toast-innerWrapper-hover .semi-toast-zero-height-wrapper {
        perspective: unset;
        perspective-origin: 50%
    }

    .semi-toast-zero-height-wrapper {
        perspective-origin: 50% 280px;
        perspective: 280px;
        height: 0;
        transition: all .3s cubic-bezier(.22, .57, .02, 1.2);
        overflow: visible
    }

    .semi-toast-content {
        pointer-events: all;
        box-shadow: var(--semi-shadow-elevated);
        background-color: var(--semi-color-bg-3);
        border-radius: var(--semi-border-radius-medium);
        color: var(--semi-color-text-0);
        justify-content: center;
        align-items: flex-start;
        margin: 12px;
        padding: 12px 8px;
        font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif;
        font-size: 14px;
        font-weight: 600;
        line-height: 20px;
        display: inline-flex
    }

    .semi-toast-content .semi-toast-close-button {
        height: 20px;
        margin-top: -2px
    }

    .semi-toast-content .semi-toast-content-text {
        text-align: left;
        word-wrap: break-word;
        overflow-wrap: break-word;
        margin-left: 12px;
        margin-right: 12px
    }

    .semi-toast-light.semi-toast-warning .semi-toast-content {
        background-color: var(--semi-color-warning-light-default);
        border: 1px solid var(--semi-color-warning)
    }

    .semi-toast-light.semi-toast-warning .semi-toast-icon-warning {
        color: var(--semi-color-warning)
    }

    .semi-toast-light.semi-toast-success .semi-toast-content {
        background-color: var(--semi-color-success-light-default);
        border: 1px solid var(--semi-color-success)
    }

    .semi-toast-light.semi-toast-success .semi-toast-icon-success {
        color: var(--semi-color-success)
    }

    .semi-toast-light.semi-toast-info .semi-toast-content {
        background-color: var(--semi-color-info-light-default);
        border: 1px solid var(--semi-color-info)
    }

    .semi-toast-light.semi-toast-info .semi-toast-icon-info {
        color: var(--semi-color-info)
    }

    .semi-toast-light.semi-toast-error .semi-toast-content {
        background-color: var(--semi-color-danger-light-default);
        border: 1px solid var(--semi-color-danger)
    }

    .semi-toast-light.semi-toast-error .semi-toast-icon-error {
        color: var(--semi-color-danger)
    }

    .semi-toast .semi-toast-icon-warning {
        color: var(--semi-color-warning)
    }

    .semi-toast .semi-toast-icon-success {
        color: var(--semi-color-success)
    }

    .semi-toast .semi-toast-icon-info {
        color: var(--semi-color-info)
    }

    .semi-toast .semi-toast-icon-error {
        color: var(--semi-color-danger)
    }

    .semi-toast-animation-show {
        animation: .3s cubic-bezier(.22, .57, .02, 1.2) forwards semi-toast-keyframe-toast-show
    }

    .semi-toast-animation-hide {
        animation: .3s cubic-bezier(.22, .57, .02, 1.2) forwards semi-toast-keyframe-toast-hide
    }

    @keyframes semi-toast-keyframe-toast-show {
        0% {
            opacity: 0;
            transform: translateY(-100%)
        }

        to {
            opacity: 1
        }
    }

    @keyframes semi-toast-keyframe-toast-hide {
        0% {
            opacity: 1
        }

        to {
            opacity: 0;
            transform: translateY(-100%)
        }
    }

    .semi-toast-rtl {
        direction: rtl
    }

    .semi-toast-rtl .semi-toast-content .semi-toast-content-text {
        text-align: right;
        margin-left: 12px;
        margin-right: 12px
    }
}


.coz-button {
    cursor: pointer;
    border-style: none
}

.coz-button.semi-button-disabled {
    cursor: not-allowed
}

.coz-button.semi-button.coz-btn-brand {
    color: rgba(var(--coze-fg-5), var(--coze-fg-5-alpha));
    background-color: rgba(var(--coze-brand-5), 1)
}

.coz-button.semi-button.coz-btn-brand.semi-button-primary:not(:-webkit-any(.semi-button-borderless, .semi-button-light)):hover {
    background-color: rgba(var(--coze-brand-6), 1)
}

.coz-button.semi-button.coz-btn-brand.semi-button-primary:not(:-moz-any(.semi-button-borderless, .semi-button-light)):hover {
    background-color: rgba(var(--coze-brand-6), 1)
}

.coz-button.semi-button.coz-btn-brand.semi-button-primary:not(:is(.semi-button-borderless, .semi-button-light)):hover {
    background-color: rgba(var(--coze-brand-6), 1)
}

.coz-button.semi-button.coz-btn-brand.semi-button-primary:not(:-webkit-any(.semi-button-borderless, .semi-button-light)):active {
    background-color: rgba(var(--coze-brand-7), 1)
}

.coz-button.semi-button.coz-btn-brand.semi-button-primary:not(:-moz-any(.semi-button-borderless, .semi-button-light)):active {
    background-color: rgba(var(--coze-brand-7), 1)
}

.coz-button.semi-button.coz-btn-brand.semi-button-primary:not(:is(.semi-button-borderless, .semi-button-light)):active {
    background-color: rgba(var(--coze-brand-7), 1)
}

.coz-button.semi-button.coz-btn-brand:disabled {
    color: rgba(var(--coze-fg-5), var(--coze-fg-5-alpha));
    background-color: rgba(var(--coze-brand-3), var(--coze-brand-3-alpha))
}

.coz-button.semi-button.coz-btn-brand:disabled:hover,
.coz-button.semi-button.coz-btn-brand:disabled:active {
    color: rgba(var(--coze-fg-5), var(--coze-fg-5-alpha))
}

.coz-button.semi-button.coz-btn-highlight {
    color: rgba(var(--coze-brand-5), 1);
    background-color: rgba(var(--coze-brand-1), var(--coze-brand-1-alpha))
}

.coz-button.semi-button.coz-btn-highlight.semi-button-primary:not(:-webkit-any(.semi-button-borderless, .semi-button-light)):hover {
    background-color: rgba(var(--coze-brand-2), var(--coze-brand-2-alpha))
}

.coz-button.semi-button.coz-btn-highlight.semi-button-primary:not(:-moz-any(.semi-button-borderless, .semi-button-light)):hover {
    background-color: rgba(var(--coze-brand-2), var(--coze-brand-2-alpha))
}

.coz-button.semi-button.coz-btn-highlight.semi-button-primary:not(:is(.semi-button-borderless, .semi-button-light)):hover {
    background-color: rgba(var(--coze-brand-2), var(--coze-brand-2-alpha))
}

.coz-button.semi-button.coz-btn-highlight.semi-button-primary:not(:-webkit-any(.semi-button-borderless, .semi-button-light)):active {
    background-color: rgba(var(--coze-brand-3), var(--coze-brand-3-alpha))
}

.coz-button.semi-button.coz-btn-highlight.semi-button-primary:not(:-moz-any(.semi-button-borderless, .semi-button-light)):active {
    background-color: rgba(var(--coze-brand-3), var(--coze-brand-3-alpha))
}

.coz-button.semi-button.coz-btn-highlight.semi-button-primary:not(:is(.semi-button-borderless, .semi-button-light)):active {
    background-color: rgba(var(--coze-brand-3), var(--coze-brand-3-alpha))
}

.coz-button.semi-button.coz-btn-highlight:disabled {
    color: rgba(var(--coze-brand-3), var(--coze-brand-3-alpha));
    background-color: rgba(var(--coze-brand-1), var(--coze-brand-1-alpha))
}

.coz-button.semi-button.coz-btn-highlight:disabled:hover,
.coz-button.semi-button.coz-btn-highlight:disabled:active {
    color: rgba(var(--coze-brand-3), var(--coze-brand-3-alpha))
}

.coz-button.semi-button.coz-btn-primary {
    color: rgba(var(--coze-fg-3), var(--coze-fg-3-alpha));
    background-color: rgba(var(--coze-bg-5), var(--coze-bg-5-alpha))
}

.coz-button.semi-button.coz-btn-primary.semi-button-primary:not(:-webkit-any(.semi-button-borderless, .semi-button-light)):hover {
    background-color: rgba(var(--coze-bg-6), var(--coze-bg-6-alpha))
}

.coz-button.semi-button.coz-btn-primary.semi-button-primary:not(:-moz-any(.semi-button-borderless, .semi-button-light)):hover {
    background-color: rgba(var(--coze-bg-6), var(--coze-bg-6-alpha))
}

.coz-button.semi-button.coz-btn-primary.semi-button-primary:not(:is(.semi-button-borderless, .semi-button-light)):hover {
    background-color: rgba(var(--coze-bg-6), var(--coze-bg-6-alpha))
}

.coz-button.semi-button.coz-btn-primary.semi-button-primary:not(:-webkit-any(.semi-button-borderless, .semi-button-light)):active {
    background-color: rgba(var(--coze-bg-7), var(--coze-bg-7-alpha))
}

.coz-button.semi-button.coz-btn-primary.semi-button-primary:not(:-moz-any(.semi-button-borderless, .semi-button-light)):active {
    background-color: rgba(var(--coze-bg-7), var(--coze-bg-7-alpha))
}

.coz-button.semi-button.coz-btn-primary.semi-button-primary:not(:is(.semi-button-borderless, .semi-button-light)):active {
    background-color: rgba(var(--coze-bg-7), var(--coze-bg-7-alpha))
}

.coz-button.semi-button.coz-btn-primary:disabled {
    color: rgba(var(--coze-fg-1), var(--coze-fg-1-alpha));
    background-color: rgba(var(--coze-bg-5), var(--coze-bg-5-alpha))
}

.coz-button.semi-button.coz-btn-primary:disabled:hover,
.coz-button.semi-button.coz-btn-primary:disabled:active {
    color: rgba(var(--coze-fg-1), var(--coze-fg-1-alpha))
}

.coz-button.semi-button.coz-btn-secondary {
    color: rgba(var(--coze-fg-3), var(--coze-fg-3-alpha));
    background-color: transparent
}

.coz-button.semi-button.coz-btn-secondary.semi-button-primary:not(:-webkit-any(.semi-button-borderless, .semi-button-light)):hover {
    background-color: rgba(var(--coze-bg-5), var(--coze-bg-5-alpha))
}

.coz-button.semi-button.coz-btn-secondary.semi-button-primary:not(:-moz-any(.semi-button-borderless, .semi-button-light)):hover {
    background-color: rgba(var(--coze-bg-5), var(--coze-bg-5-alpha))
}

.coz-button.semi-button.coz-btn-secondary.semi-button-primary:not(:is(.semi-button-borderless, .semi-button-light)):hover {
    background-color: rgba(var(--coze-bg-5), var(--coze-bg-5-alpha))
}

.coz-button.semi-button.coz-btn-secondary.semi-button-primary:not(:-webkit-any(.semi-button-borderless, .semi-button-light)):active {
    background-color: rgba(var(--coze-bg-6), var(--coze-bg-6-alpha))
}

.coz-button.semi-button.coz-btn-secondary.semi-button-primary:not(:-moz-any(.semi-button-borderless, .semi-button-light)):active {
    background-color: rgba(var(--coze-bg-6), var(--coze-bg-6-alpha))
}

.coz-button.semi-button.coz-btn-secondary.semi-button-primary:not(:is(.semi-button-borderless, .semi-button-light)):active {
    background-color: rgba(var(--coze-bg-6), var(--coze-bg-6-alpha))
}

.coz-button.semi-button.coz-btn-secondary:disabled,
.coz-button.semi-button.coz-btn-secondary:disabled:hover,
.coz-button.semi-button.coz-btn-secondary:disabled:active {
    color: rgba(var(--coze-fg-1), var(--coze-fg-1-alpha));
    background-color: transparent
}

.coz-button.semi-button.coz-btn-yellow {
    color: rgba(var(--coze-fg-7), 1);
    background-color: rgba(var(--coze-yellow-5), 1)
}

.coz-button.semi-button.coz-btn-yellow.semi-button-primary:not(:-webkit-any(.semi-button-borderless, .semi-button-light)):hover {
    background-color: rgba(var(--coze-yellow-6), 1)
}

.coz-button.semi-button.coz-btn-yellow.semi-button-primary:not(:-moz-any(.semi-button-borderless, .semi-button-light)):hover {
    background-color: rgba(var(--coze-yellow-6), 1)
}

.coz-button.semi-button.coz-btn-yellow.semi-button-primary:not(:is(.semi-button-borderless, .semi-button-light)):hover {
    background-color: rgba(var(--coze-yellow-6), 1)
}

.coz-button.semi-button.coz-btn-yellow.semi-button-primary:not(:-webkit-any(.semi-button-borderless, .semi-button-light)):active {
    background-color: rgba(var(--coze-yellow-7), 1)
}

.coz-button.semi-button.coz-btn-yellow.semi-button-primary:not(:-moz-any(.semi-button-borderless, .semi-button-light)):active {
    background-color: rgba(var(--coze-yellow-7), 1)
}

.coz-button.semi-button.coz-btn-yellow.semi-button-primary:not(:is(.semi-button-borderless, .semi-button-light)):active {
    background-color: rgba(var(--coze-yellow-7), 1)
}

.coz-button.semi-button.coz-btn-yellow:disabled {
    color: rgba(var(--coze-fg-white), var(--coze-fg-white-alpha));
    background-color: rgba(var(--coze-yellow-3), var(--coze-yellow-3-alpha))
}

.coz-button.semi-button.coz-btn-yellow:disabled:hover,
.coz-button.semi-button.coz-btn-yellow:disabled:active {
    color: rgba(var(--coze-fg-white), var(--coze-fg-white-alpha))
}

.coz-button.semi-button.coz-btn-red {
    color: rgba(var(--coze-fg-7), 1);
    background-color: rgba(var(--coze-red-5), 1)
}

.coz-button.semi-button.coz-btn-red.semi-button-primary:not(:-webkit-any(.semi-button-borderless, .semi-button-light)):hover {
    background-color: rgba(var(--coze-red-6), 1)
}

.coz-button.semi-button.coz-btn-red.semi-button-primary:not(:-moz-any(.semi-button-borderless, .semi-button-light)):hover {
    background-color: rgba(var(--coze-red-6), 1)
}

.coz-button.semi-button.coz-btn-red.semi-button-primary:not(:is(.semi-button-borderless, .semi-button-light)):hover {
    background-color: rgba(var(--coze-red-6), 1)
}

.coz-button.semi-button.coz-btn-red.semi-button-primary:not(:-webkit-any(.semi-button-borderless, .semi-button-light)):active {
    background-color: rgba(var(--coze-red-7), 1)
}

.coz-button.semi-button.coz-btn-red.semi-button-primary:not(:-moz-any(.semi-button-borderless, .semi-button-light)):active {
    background-color: rgba(var(--coze-red-7), 1)
}

.coz-button.semi-button.coz-btn-red.semi-button-primary:not(:is(.semi-button-borderless, .semi-button-light)):active {
    background-color: rgba(var(--coze-red-7), 1)
}

.coz-button.semi-button.coz-btn-red:disabled {
    color: rgba(var(--coze-fg-white), var(--coze-fg-white-alpha));
    background-color: rgba(var(--coze-red-3), var(--coze-red-3-alpha))
}

.coz-button.semi-button.coz-btn-red:disabled:hover,
.coz-button.semi-button.coz-btn-red:disabled:active {
    color: rgba(var(--coze-fg-white), var(--coze-fg-white-alpha))
}

.coz-button.semi-button.coz-btn-redhglt {
    color: rgba(var(--coze-red-5), 1);
    background-color: rgba(var(--coze-red-1), var(--coze-red-1-alpha))
}

.coz-button.semi-button.coz-btn-redhglt.semi-button-primary:not(:-webkit-any(.semi-button-borderless, .semi-button-light)):hover {
    background-color: rgba(var(--coze-red-2), var(--coze-red-2-alpha))
}

.coz-button.semi-button.coz-btn-redhglt.semi-button-primary:not(:-moz-any(.semi-button-borderless, .semi-button-light)):hover {
    background-color: rgba(var(--coze-red-2), var(--coze-red-2-alpha))
}

.coz-button.semi-button.coz-btn-redhglt.semi-button-primary:not(:is(.semi-button-borderless, .semi-button-light)):hover {
    background-color: rgba(var(--coze-red-2), var(--coze-red-2-alpha))
}

.coz-button.semi-button.coz-btn-redhglt.semi-button-primary:not(:-webkit-any(.semi-button-borderless, .semi-button-light)):active {
    background-color: rgba(var(--coze-red-3), var(--coze-red-3-alpha))
}

.coz-button.semi-button.coz-btn-redhglt.semi-button-primary:not(:-moz-any(.semi-button-borderless, .semi-button-light)):active {
    background-color: rgba(var(--coze-red-3), var(--coze-red-3-alpha))
}

.coz-button.semi-button.coz-btn-redhglt.semi-button-primary:not(:is(.semi-button-borderless, .semi-button-light)):active {
    background-color: rgba(var(--coze-red-3), var(--coze-red-3-alpha))
}

.coz-button.semi-button.coz-btn-redhglt:disabled {
    color: rgba(var(--coze-red-3), var(--coze-red-3-alpha));
    background-color: rgba(var(--coze-red-1), var(--coze-red-1-alpha))
}

.coz-button.semi-button.coz-btn-redhglt:disabled:hover,
.coz-button.semi-button.coz-btn-redhglt:disabled:active {
    color: rgba(var(--coze-red-3), var(--coze-red-3-alpha))
}

.coz-button.semi-button.coz-btn-green {
    color: rgba(var(--coze-fg-7), 1);
    background-color: rgba(var(--coze-green-5), 1)
}

.coz-button.semi-button.coz-btn-green.semi-button-primary:not(:-webkit-any(.semi-button-borderless, .semi-button-light)):hover {
    background-color: rgba(var(--coze-green-6), 1)
}

.coz-button.semi-button.coz-btn-green.semi-button-primary:not(:-moz-any(.semi-button-borderless, .semi-button-light)):hover {
    background-color: rgba(var(--coze-green-6), 1)
}

.coz-button.semi-button.coz-btn-green.semi-button-primary:not(:is(.semi-button-borderless, .semi-button-light)):hover {
    background-color: rgba(var(--coze-green-6), 1)
}

.coz-button.semi-button.coz-btn-green.semi-button-primary:not(:-webkit-any(.semi-button-borderless, .semi-button-light)):active {
    background-color: rgba(var(--coze-green-7), 1)
}

.coz-button.semi-button.coz-btn-green.semi-button-primary:not(:-moz-any(.semi-button-borderless, .semi-button-light)):active {
    background-color: rgba(var(--coze-green-7), 1)
}

.coz-button.semi-button.coz-btn-green.semi-button-primary:not(:is(.semi-button-borderless, .semi-button-light)):active {
    background-color: rgba(var(--coze-green-7), 1)
}

.coz-button.semi-button.coz-btn-green:disabled {
    color: rgba(var(--coze-fg-white), var(--coze-fg-white-alpha));
    background-color: rgba(var(--coze-green-3), var(--coze-green-3-alpha))
}

.coz-button.semi-button.coz-btn-green:disabled:hover,
.coz-button.semi-button.coz-btn-green:disabled:active {
    color: rgba(var(--coze-fg-white), var(--coze-fg-white-alpha))
}

.coz-button.semi-button.coz-btn-ai-plus {
    color: rgba(var(--coze-fg-5), var(--coze-fg-5-alpha));
    background: linear-gradient(90deg, rgba(var(--coze-brand-5), 1)0%, rgba(var(--coze-purple-5), 1)100%)
}

.coz-button.semi-button.coz-btn-ai-plus.semi-button-primary:not(:-webkit-any(.semi-button-borderless, .semi-button-light)):hover {
    background: linear-gradient(90deg, rgba(var(--coze-brand-6), 1)0%, rgba(var(--coze-purple-6), 1)100%)
}

.coz-button.semi-button.coz-btn-ai-plus.semi-button-primary:not(:-moz-any(.semi-button-borderless, .semi-button-light)):hover {
    background: linear-gradient(90deg, rgba(var(--coze-brand-6), 1)0%, rgba(var(--coze-purple-6), 1)100%)
}

.coz-button.semi-button.coz-btn-ai-plus.semi-button-primary:not(:is(.semi-button-borderless, .semi-button-light)):hover {
    background: linear-gradient(90deg, rgba(var(--coze-brand-6), 1)0%, rgba(var(--coze-purple-6), 1)100%)
}

.coz-button.semi-button.coz-btn-ai-plus.semi-button-primary:not(:-webkit-any(.semi-button-borderless, .semi-button-light)):active {
    background: linear-gradient(90deg, rgba(var(--coze-brand-7), 1)0%, rgba(var(--coze-purple-7), 1)100%)
}

.coz-button.semi-button.coz-btn-ai-plus.semi-button-primary:not(:-moz-any(.semi-button-borderless, .semi-button-light)):active {
    background: linear-gradient(90deg, rgba(var(--coze-brand-7), 1)0%, rgba(var(--coze-purple-7), 1)100%)
}

.coz-button.semi-button.coz-btn-ai-plus.semi-button-primary:not(:is(.semi-button-borderless, .semi-button-light)):active {
    background: linear-gradient(90deg, rgba(var(--coze-brand-7), 1)0%, rgba(var(--coze-purple-7), 1)100%)
}

.coz-button.semi-button.coz-btn-ai-plus:disabled {
    color: rgba(var(--coze-fg-5), var(--coze-fg-5-alpha));
    background: linear-gradient(90deg, rgba(var(--coze-brand-3), var(--coze-brand-3-alpha))0%, rgba(var(--coze-purple-3), var(--coze-purple-3-alpha))100%)
}

.coz-button.semi-button.coz-btn-ai-plus:disabled:hover,
.coz-button.semi-button.coz-btn-ai-plus:disabled:active {
    color: rgba(var(--coze-fg-5), var(--coze-fg-5-alpha))
}

.coz-button.semi-button.coz-btn-ai-hglt,
.coz-button.semi-button.coz-btn-ai-primary {
    background: linear-gradient(90deg, rgba(var(--coze-brand-1), var(--coze-brand-1-alpha))0%, rgba(var(--coze-purple-1), var(--coze-purple-1-alpha))100%)
}

.coz-button.semi-button.coz-btn-ai-hglt.semi-button-primary:not(:-webkit-any(.semi-button-borderless, .semi-button-light)):hover,
.coz-button.semi-button.coz-btn-ai-primary.semi-button-primary:not(:-webkit-any(.semi-button-borderless, .semi-button-light)):hover {
    background: linear-gradient(90deg, rgba(var(--coze-brand-2), var(--coze-brand-2-alpha))0%, rgba(var(--coze-purple-2), var(--coze-purple-2-alpha))100%)
}

.coz-button.semi-button.coz-btn-ai-hglt.semi-button-primary:not(:-moz-any(.semi-button-borderless, .semi-button-light)):hover,
.coz-button.semi-button.coz-btn-ai-primary.semi-button-primary:not(:-moz-any(.semi-button-borderless, .semi-button-light)):hover {
    background: linear-gradient(90deg, rgba(var(--coze-brand-2), var(--coze-brand-2-alpha))0%, rgba(var(--coze-purple-2), var(--coze-purple-2-alpha))100%)
}

.coz-button.semi-button.coz-btn-ai-hglt.semi-button-primary:not(:is(.semi-button-borderless, .semi-button-light)):hover,
.coz-button.semi-button.coz-btn-ai-primary.semi-button-primary:not(:is(.semi-button-borderless, .semi-button-light)):hover {
    background: linear-gradient(90deg, rgba(var(--coze-brand-2), var(--coze-brand-2-alpha))0%, rgba(var(--coze-purple-2), var(--coze-purple-2-alpha))100%)
}

.coz-button.semi-button.coz-btn-ai-hglt.semi-button-primary:not(:-webkit-any(.semi-button-borderless, .semi-button-light)):active,
.coz-button.semi-button.coz-btn-ai-primary.semi-button-primary:not(:-webkit-any(.semi-button-borderless, .semi-button-light)):active {
    background: linear-gradient(90deg, rgba(var(--coze-brand-3), var(--coze-brand-3-alpha))0%, rgba(var(--coze-purple-3), var(--coze-purple-3-alpha))100%)
}

.coz-button.semi-button.coz-btn-ai-hglt.semi-button-primary:not(:-moz-any(.semi-button-borderless, .semi-button-light)):active,
.coz-button.semi-button.coz-btn-ai-primary.semi-button-primary:not(:-moz-any(.semi-button-borderless, .semi-button-light)):active {
    background: linear-gradient(90deg, rgba(var(--coze-brand-3), var(--coze-brand-3-alpha))0%, rgba(var(--coze-purple-3), var(--coze-purple-3-alpha))100%)
}

.coz-button.semi-button.coz-btn-ai-hglt.semi-button-primary:not(:is(.semi-button-borderless, .semi-button-light)):active,
.coz-button.semi-button.coz-btn-ai-primary.semi-button-primary:not(:is(.semi-button-borderless, .semi-button-light)):active {
    background: linear-gradient(90deg, rgba(var(--coze-brand-3), var(--coze-brand-3-alpha))0%, rgba(var(--coze-purple-3), var(--coze-purple-3-alpha))100%)
}

.coz-button.semi-button.coz-btn-ai-hglt .coz-ai-button-text,
.coz-button.semi-button.coz-btn-ai-primary .coz-ai-button-text {
    background: linear-gradient(90deg, rgba(var(--coze-brand-5), 1)0%, rgba(var(--coze-purple-5), 1)100%);
    -webkit-text-fill-color: transparent;
    -webkit-background-clip: text;
    background-clip: text
}

.coz-button.semi-button.coz-btn-ai-hglt:disabled,
.coz-button.semi-button.coz-btn-ai-primary:disabled {
    color: rgba(var(--coze-brand-3), var(--coze-brand-3-alpha));
    background: linear-gradient(90deg, rgba(var(--coze-brand-1), var(--coze-brand-1-alpha))0%, rgba(var(--coze-purple-1), var(--coze-purple-1-alpha))100%)
}

.coz-button.semi-button.coz-btn-ai-hglt:disabled:hover,
.coz-button.semi-button.coz-btn-ai-primary:disabled:hover,
.coz-button.semi-button.coz-btn-ai-hglt:disabled:active,
.coz-button.semi-button.coz-btn-ai-primary:disabled:active {
    color: rgba(var(--coze-brand-3), var(--coze-brand-3-alpha))
}

.coz-button.semi-button.coz-btn-ai-hglt:disabled .coz-ai-button-text,
.coz-button.semi-button.coz-btn-ai-primary:disabled .coz-ai-button-text {
    background: linear-gradient(90deg, rgba(var(--coze-brand-3), var(--coze-brand-3-alpha))0%, rgba(var(--coze-purple-3), var(--coze-purple-3-alpha))100%);
    -webkit-text-fill-color: transparent;
    -webkit-background-clip: text;
    background-clip: text
}

.coz-button.semi-button.coz-btn-ai-primary,
.coz-button.semi-button.coz-btn-ai-primary:disabled {
    background: 0 0
}

.coz-button.semi-button .coz-btn-loading {
    animation: .6s linear infinite forwards semi-animation-rotate
}

.coz-button.coz-btn-large {
    height: var(--coze-40);
    min-width: var(--coze-40);
    padding-left: var(--coze-20);
    padding-right: var(--coze-20);
    padding-top: var(--coze-9);
    padding-bottom: var(--coze-9);
    font-size: var(--coze-16);
    border-radius: var(--coze-10);
    border-width: 0
}

.coz-button.coz-btn-large.semi-button-with-icon-only {
    width: var(--coze-40)
}

.coz-button.coz-btn-large .semi-button-content-left {
    margin-right: var(--coze-8)
}

.coz-button.coz-btn-large .semi-button-content-right {
    margin-left: var(--coze-8)
}

.coz-button.coz-btn-default {
    height: var(--coze-32);
    min-width: var(--coze-32);
    padding-left: var(--coze-16);
    padding-right: var(--coze-16);
    padding-top: var(--coze-6);
    padding-bottom: var(--coze-6);
    font-size: var(--coze-14);
    border-radius: var(--coze-8);
    border-width: 0
}

.coz-button.coz-btn-default.semi-button-with-icon-only {
    width: var(--coze-32)
}

.coz-button.coz-btn-default .semi-button-content-left {
    margin-right: var(--coze-6)
}

.coz-button.coz-btn-default .semi-button-content-right {
    margin-left: var(--coze-8)
}

.coz-button.coz-btn-small {
    height: var(--coze-24);
    min-width: var(--coze-24);
    padding-left: var(--coze-8);
    padding-right: var(--coze-8);
    padding-top: var(--coze-4);
    padding-bottom: var(--coze-4);
    font-size: var(--coze-12);
    border-radius: var(--coze-5);
    border-width: 0
}

.coz-button.coz-btn-small.semi-button-with-icon-only {
    width: var(--coze-24)
}

.coz-button.coz-btn-small .semi-button-content-left {
    margin-right: var(--coze-4)
}

.coz-button.coz-btn-small .semi-button-content-right {
    margin-left: var(--coze-4)
}

.coz-button.coz-btn-mini {
    height: var(--coze-16);
    min-width: var(--coze-16);
    padding-left: var(--coze-5);
    padding-right: var(--coze-5);
    font-size: var(--coze-12);
    border-radius: var(--coze-4);
    border-width: 0;
    padding-top: 0;
    padding-bottom: 0;
    font-weight: 400
}

.coz-button.coz-btn-mini.semi-button-with-icon-only {
    width: var(--coze-16)
}

.coz-button.coz-btn-mini .semi-button-content-left {
    margin-right: var(--coze-2)
}

.coz-button.coz-btn-mini .semi-button-content-right {
    margin-left: var(--coze-2)
}

.coz-icon-button.coz-icon-button-large .semi-button-with-icon-only {
    padding: 11px
}

.coz-icon-button.coz-icon-button-large .semi-button-content-left {
    margin-right: var(--coze-8)
}

.coz-icon-button.coz-icon-button-large .semi-button-content-right {
    margin-left: var(--coze-8)
}

.coz-icon-button.coz-icon-button-default .semi-button-with-icon-only {
    padding: var(--coze-8)
}

.coz-icon-button.coz-icon-button-default .semi-button-content-left {
    margin-right: var(--coze-6)
}

.coz-icon-button.coz-icon-button-default .semi-button-content-right {
    margin-left: var(--coze-6)
}

.coz-icon-button.coz-icon-button-small .semi-button-with-icon-only {
    padding: var(--coze-5)
}

.coz-icon-button.coz-icon-button-small .semi-button-content-left {
    margin-right: var(--coze-4)
}

.coz-icon-button.coz-icon-button-small .semi-button-content-right {
    margin-left: var(--coze-4)
}

.coz-icon-button.coz-icon-button-mini .semi-button-with-icon-only {
    padding: var(--coze-2)
}

.coz-icon-button.coz-icon-button-mini .semi-button-content-left {
    margin-right: var(--coze-2)
}

.coz-icon-button.coz-icon-button-mini .semi-button-content-right {
    margin-left: var(--coze-2)
}

.coz-split-button {
    align-items: flex-start;
    display: inline-flex
}

.coz-btn-large .coz-badge-layout {
    margin-left: 11px;
    margin-right: -3px
}

.coz-btn-default .coz-badge-layout {
    margin-left: 9px;
    margin-right: -3px
}

.coz-btn-small .coz-badge-layout {
    margin-left: 7px;
    margin-right: -1px
}

.coz-btn-brand .coz-badge-layout {
    color: rgba(var(--coze-fg-5), var(--coze-fg-5-alpha))
}

.coz-badge.semi-badge.coz-badge-mini.coz-btn-badge-brand .semi-badge-dot,
.coz-badge.semi-badge.coz-badge-mini.coz-btn-badge-hgltplus .semi-badge-dot {
    background-color: rgba(var(--coze-fg-5), var(--coze-fg-5-alpha))
}

.coz-badge.semi-badge.coz-badge-mini.coz-btn-badge-highlight .semi-badge-dot {
    background-color: rgba(var(--coze-brand-5), 1)
}

.coz-badge.semi-badge.coz-badge-mini.coz-btn-badge-primary .semi-badge-dot,
.coz-badge.semi-badge.coz-badge-mini.coz-btn-badge-secondary .semi-badge-dot {
    background-color: rgba(var(--coze-fg-3), var(--coze-fg-3-alpha))
}

.coz-badge.semi-badge.coz-badge-mini.coz-btn-badge-yellow .semi-badge-dot,
.coz-badge.semi-badge.coz-badge-mini.coz-btn-badge-red .semi-badge-dot,
.coz-badge.semi-badge.coz-badge-mini.coz-btn-badge-green .semi-badge-dot {
    background-color: rgba(var(--coze-fg-7), 1)
}

.coz-badge .coz-icon-button+.semi-badge-rightTop:not(.semi-badge-dot) {
    transform: translate(50%, -50%)
}

.coz-icon-button-large+.semi-badge-rightTop {
    top: 2.93px;
    right: 2.93px
}

.coz-icon-button-large.coz-icon-button-secondary+.semi-badge-rightTop {
    top: 10px;
    right: 10px
}

.coz-icon-button-default+.semi-badge-rightTop {
    top: 2.3px;
    right: 2.3px
}

.coz-icon-button-default.coz-icon-button-secondary+.semi-badge-rightTop {
    top: 7px;
    right: 7px
}

.coz-icon-button-small+.semi-badge-rightTop {
    top: 1.76px;
    right: 1.76px
}

.coz-icon-button-small.coz-icon-button-secondary+.semi-badge-rightTop {
    top: 4px;
    right: 4px
}


.coz-badge {
    display: inline-flex
}

.coz-badge .semi-badge-rightTop:not(.semi-badge-dot) {
    transform: translate(8px, -8px)
}

.coz-badge.coz-badge-default .semi-badge-count {
    height: var(--coze-16);
    min-width: var(--coze-16);
    font-size: var(--coze-12);
    font-weight: 500;
    line-height: var(--coze-16);
    color: rgba(var(--coze-fg-7), 1);
    background-color: rgba(var(--coze-red-5), 1);
    border-width: 0
}

.coz-badge.coz-badge-mini .semi-badge-primary.semi-badge-solid {
    height: var(--coze-6);
    width: var(--coze-6);
    background-color: rgba(var(--coze-red-5), 1);
    border-width: 0;
    border-color: rgba(var(--coze-stroke-5), var(--coze-stroke-5-alpha))
}

.coz-badge.coz-badge-alt .semi-badge-count {
    height: var(--coze-16);
    min-width: var(--coze-16);
    font-size: var(--coze-12);
    font-weight: 500;
    line-height: var(--coze-16);
    color: rgba(var(--coze-fg-5), var(--coze-fg-5-alpha));
    background-color: rgba(var(--coze-brand-5), 1);
    border-width: 0;
    border-color: rgba(var(--coze-stroke-5), var(--coze-stroke-5-alpha))
}


.coz-tooltip.semi-tooltip-wrapper {
    --tw-shadow: 0 4px 12px 0px rgba(var(--coze-shadow-0), .08), 0px 8px 24px 0px rgba(var(--coze-shadow-0), .04);
    --tw-shadow-colored: 0 4px 12px 0px var(--tw-shadow-color), 0px 8px 24px 0px var(--tw-shadow-color);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 transparent), var(--tw-ring-shadow, 0 0 transparent), var(--tw-shadow);
    color: rgba(var(--coze-fg-3), var(--coze-fg-3-alpha));
    background-color: rgba(var(--coze-bg-3), var(--coze-bg-3-alpha));
    min-width: 36px
}

.coz-tooltip.semi-tooltip-wrapper .semi-tooltip-icon-arrow {
    color: rgba(var(--coze-bg-3), var(--coze-bg-3-alpha))
}

.coz-tooltip.semi-tooltip-wrapper .semi-tooltip-content {
    font-size: var(--coze-14);
    font-weight: 500
}

.coz-tooltip.coz-tooltip-dark.semi-tooltip-wrapper {
    background-color: rgb(var(--black-5));
    color: rgb(var(--white-1));
    --tw-shadow: 0 4px 12px 0px rgba(var(--coze-shadow-0), .08), 0px 8px 24px 0px rgba(var(--coze-shadow-0), .04);
    --tw-shadow-colored: 0 4px 12px 0px var(--tw-shadow-color), 0px 8px 24px 0px var(--tw-shadow-color);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 transparent), var(--tw-ring-shadow, 0 0 transparent), var(--tw-shadow)
}

.coz-tooltip.coz-tooltip-dark.semi-tooltip-wrapper .semi-tooltip-icon-arrow {
    color: rgb(var(--black-5))
}


.coz-popover.semi-popover-wrapper {
    max-width: 800px;
    padding: var(--coze-4);
    box-shadow: 0px 8px 24px 0px rgba(var(--coze-shadow-0), .16), 0px 16px 48px 0px rgba(var(--coze-shadow-0), .08)
}

.coz-popover.semi-popover-with-arrow {
    border-width: var(--coze-1);
    border-color: rgba(var(--coze-stroke-5), var(--coze-stroke-5-alpha));
    background-color: rgba(var(--coze-bg-3), var(--coze-bg-3-alpha));
    padding: var(--coze-16)
}

.coz-popover .semi-popover-icon-arrow {
    color: rgba(var(--coze-bg-3), var(--coze-bg-3-alpha));
    -webkit-filter: drop-shadow(1px 5px 3px rgba(0, 0, 0, .1));
    filter: drop-shadow(1px 5px 3px rgba(0, 0, 0, .1))
}


.coz-typography.semi-typography.coz-title {
    font-weight: 500
}

.coz-typography.semi-typography.coz-title.coz-title-28 {
    font-size: var(--coze-28);
    line-height: var(--coze-36)
}

.coz-typography.semi-typography.coz-title.coz-title-20 {
    font-size: var(--coze-20);
    line-height: var(--coze-28)
}

.coz-typography.semi-typography.coz-title.coz-title-16 {
    font-size: var(--coze-16);
    line-height: var(--coze-22)
}

.coz-typography.semi-typography.coz-title.coz-title-14 {
    font-size: var(--coze-14);
    line-height: var(--coze-20)
}

.coz-typography.semi-typography.coz-title.coz-title-12 {
    font-size: var(--coze-12);
    line-height: var(--coze-16)
}

.coz-typography.semi-typography.coz-text {
    font-weight: 400
}

.coz-typography.semi-typography.coz-text.coz-text-16 {
    font-size: var(--coze-16);
    line-height: var(--coze-28)
}

.coz-typography.semi-typography.coz-text.coz-text-14 {
    font-size: var(--coze-14);
    line-height: var(--coze-20)
}

.coz-typography.semi-typography.coz-text.coz-text-12 {
    font-size: var(--coze-12);
    line-height: var(--coze-16)
}

.coz-typography.semi-typography.coz-text.coz-text-10 {
    font-size: var(--coze-10);
    line-height: var(--coze-14)
}

.coz-typography.semi-typography.coz-paragraph {
    font-weight: 400
}

.coz-typography.semi-typography.coz-paragraph.coz-paragraph-16 {
    font-size: var(--coze-16);
    line-height: var(--coze-28)
}

.coz-typography.semi-typography.coz-paragraph.coz-paragraph-14 {
    font-size: var(--coze-14);
    line-height: var(--coze-20)
}

.coz-typography.semi-typography.coz-paragraph.coz-paragraph-12 {
    font-size: var(--coze-12);
    line-height: var(--coze-16)
}

.coz-typography.semi-typography .semi-typography-ellipsis-expand {
    color: rgba(var(--coze-brand-5), 1)
}


.playground-sub-menu-APnOTK .semi-collapse-header {
    margin: 2px 0;
    padding: 6px 8px 6px 0;
    font-weight: 400;
    line-height: 20px
}

@media (hover:hover) {
    .playground-sub-menu-APnOTK .semi-collapse-header:hover {
        background-color: rgba(var(--coze-bg-5), var(--coze-bg-5-alpha))
    }
}

.playground-sub-menu-APnOTK .semi-collapse-header {
    color: rgba(var(--coze-fg-2), var(--coze-fg-2-alpha))
}

.playground-sub-menu-APnOTK .collapse-header-active>.semi-collapse-header {
    color: rgba(var(--coze-fg-3), var(--coze-fg-3-alpha))
}

.playground-sub-menu-APnOTK .semi-collapse-item {
    border: none
}

.playground-sub-menu-APnOTK .semi-collapse-item:has(a.active)>.semi-collapse-header {
    color: rgba(var(--coze-fg-3), var(--coze-fg-3-alpha));
    font-weight: 500
}

.playground-sub-menu-APnOTK .semi-collapse-content {
    padding: 0
}

.playground-sub-menu-APnOTK .semi-collapse-header-icon {
    width: 12px;
    height: 12px;
    color: rgba(var(--coze-fg-2), var(--coze-fg-2-alpha));
    margin-top: -4px
}

.playground-sub-menu-APnOTK .semi-collapse {
    flex-direction: column;
    row-gap: 2px;
    display: flex
}


@layer base {
    body {
        --red-1: 255, 236, 232;
        --red-2: 253, 205, 197;
        --red-3: 251, 172, 163;
        --red-4: 249, 137, 129;
        --red-5: 247, 101, 96;
        --red-6: 245, 63, 63;
        --red-7: 203, 39, 45;
        --red-8: 161, 21, 30;
        --red-9: 119, 8, 19;
        --red-10: 77, 0, 10;
        --orangered-1: 255, 243, 232;
        --orangered-2: 253, 221, 195;
        --orangered-3: 252, 197, 159;
        --orangered-4: 250, 172, 123;
        --orangered-5: 249, 144, 87;
        --orangered-6: 247, 114, 52;
        --orangered-7: 204, 81, 32;
        --orangered-8: 162, 53, 17;
        --orangered-9: 119, 31, 6;
        --orangered-10: 77, 14, 0;
        --orange-1: 255, 247, 232;
        --orange-2: 255, 228, 186;
        --orange-3: 255, 207, 139;
        --orange-4: 255, 182, 93;
        --orange-5: 255, 154, 46;
        --orange-6: 255, 125, 0;
        --orange-7: 210, 95, 0;
        --orange-8: 166, 69, 0;
        --orange-9: 121, 46, 0;
        --orange-10: 77, 27, 0;
        --gold-1: 255, 252, 232;
        --gold-2: 253, 244, 191;
        --gold-3: 252, 233, 150;
        --gold-4: 250, 220, 109;
        --gold-5: 249, 204, 69;
        --gold-6: 247, 186, 30;
        --gold-7: 204, 146, 19;
        --gold-8: 162, 109, 10;
        --gold-9: 119, 75, 4;
        --gold-10: 77, 45, 0;
        --yellow-1: 254, 255, 232;
        --yellow-2: 254, 254, 190;
        --yellow-3: 253, 250, 148;
        --yellow-4: 252, 242, 107;
        --yellow-5: 251, 232, 66;
        --yellow-6: 250, 220, 25;
        --yellow-7: 207, 175, 15;
        --yellow-8: 163, 132, 8;
        --yellow-9: 120, 93, 3;
        --yellow-10: 77, 56, 0;
        --lime-1: 252, 255, 232;
        --lime-2: 237, 248, 187;
        --lime-3: 220, 241, 144;
        --lime-4: 201, 233, 104;
        --lime-5: 181, 226, 65;
        --lime-6: 159, 219, 29;
        --lime-7: 126, 183, 18;
        --lime-8: 95, 148, 10;
        --lime-9: 67, 112, 4;
        --lime-10: 42, 77, 0;
        --green-1: 232, 255, 234;
        --green-2: 175, 240, 181;
        --green-3: 123, 225, 136;
        --green-4: 76, 210, 99;
        --green-5: 35, 195, 67;
        --green-6: 0, 180, 42;
        --green-7: 0, 154, 41;
        --green-8: 0, 128, 38;
        --green-9: 0, 102, 34;
        --green-10: 0, 77, 28;
        --cyan-1: 232, 255, 251;
        --cyan-2: 183, 244, 236;
        --cyan-3: 137, 233, 224;
        --cyan-4: 94, 223, 214;
        --cyan-5: 55, 212, 207;
        --cyan-6: 20, 201, 201;
        --cyan-7: 13, 165, 170;
        --cyan-8: 7, 130, 139;
        --cyan-9: 3, 97, 108;
        --cyan-10: 0, 66, 77;
        --blue-1: 232, 247, 255;
        --blue-2: 195, 231, 254;
        --blue-3: 159, 212, 253;
        --blue-4: 123, 192, 252;
        --blue-5: 87, 169, 251;
        --blue-6: 52, 145, 250;
        --blue-7: 32, 108, 207;
        --blue-8: 17, 75, 163;
        --blue-9: 6, 48, 120;
        --blue-10: 0, 26, 77;
        --arcoblue-1: 232, 243, 255;
        --arcoblue-2: 190, 218, 255;
        --arcoblue-3: 148, 191, 255;
        --arcoblue-4: 106, 161, 255;
        --arcoblue-5: 64, 128, 255;
        --arcoblue-6: 22, 93, 255;
        --arcoblue-7: 14, 66, 210;
        --arcoblue-8: 7, 44, 166;
        --arcoblue-9: 3, 26, 121;
        --arcoblue-10: 0, 13, 77;
        --purple-1: 245, 232, 255;
        --purple-2: 221, 190, 246;
        --purple-3: 195, 150, 237;
        --purple-4: 168, 113, 227;
        --purple-5: 141, 78, 218;
        --purple-6: 114, 46, 209;
        --purple-7: 85, 29, 176;
        --purple-8: 60, 16, 143;
        --purple-9: 39, 6, 110;
        --purple-10: 22, 0, 77;
        --pinkpurple-1: 255, 232, 251;
        --pinkpurple-2: 247, 186, 239;
        --pinkpurple-3: 240, 142, 230;
        --pinkpurple-4: 232, 101, 223;
        --pinkpurple-5: 225, 62, 219;
        --pinkpurple-6: 217, 26, 217;
        --pinkpurple-7: 176, 16, 182;
        --pinkpurple-8: 138, 9, 147;
        --pinkpurple-9: 101, 3, 112;
        --pinkpurple-10: 66, 0, 77;
        --magenta-1: 255, 232, 241;
        --magenta-2: 253, 194, 219;
        --magenta-3: 251, 157, 199;
        --magenta-4: 249, 121, 183;
        --magenta-5: 247, 84, 168;
        --magenta-6: 245, 49, 157;
        --magenta-7: 203, 30, 131;
        --magenta-8: 161, 16, 105;
        --magenta-9: 119, 6, 79;
        --magenta-10: 77, 0, 52;
        --gray-1: 247, 248, 250;
        --gray-2: 242, 243, 245;
        --gray-3: 229, 230, 235;
        --gray-4: 201, 205, 212;
        --gray-5: 169, 174, 184;
        --gray-6: 134, 144, 156;
        --gray-7: 107, 119, 133;
        --gray-8: 78, 89, 105;
        --gray-9: 39, 46, 59;
        --gray-10: 29, 33, 41;
        --success-1: var(--green-1);
        --success-2: var(--green-2);
        --success-3: var(--green-3);
        --success-4: var(--green-4);
        --success-5: var(--green-5);
        --success-6: var(--green-6);
        --success-7: var(--green-7);
        --success-8: var(--green-8);
        --success-9: var(--green-9);
        --success-10: var(--green-10);
        --primary-1: var(--arcoblue-1);
        --primary-2: var(--arcoblue-2);
        --primary-3: var(--arcoblue-3);
        --primary-4: var(--arcoblue-4);
        --primary-5: var(--arcoblue-5);
        --primary-6: var(--arcoblue-6);
        --primary-7: var(--arcoblue-7);
        --primary-8: var(--arcoblue-8);
        --primary-9: var(--arcoblue-9);
        --primary-10: var(--arcoblue-10);
        --danger-1: var(--red-1);
        --danger-2: var(--red-2);
        --danger-3: var(--red-3);
        --danger-4: var(--red-4);
        --danger-5: var(--red-5);
        --danger-6: var(--red-6);
        --danger-7: var(--red-7);
        --danger-8: var(--red-8);
        --danger-9: var(--red-9);
        --danger-10: var(--red-10);
        --warning-1: var(--orange-1);
        --warning-2: var(--orange-2);
        --warning-3: var(--orange-3);
        --warning-4: var(--orange-4);
        --warning-5: var(--orange-5);
        --warning-6: var(--orange-6);
        --warning-7: var(--orange-7);
        --warning-8: var(--orange-8);
        --warning-9: var(--orange-9);
        --warning-10: var(--orange-10);
        --link-1: var(--arcoblue-1);
        --link-2: var(--arcoblue-2);
        --link-3: var(--arcoblue-3);
        --link-4: var(--arcoblue-4);
        --link-5: var(--arcoblue-5);
        --link-6: var(--arcoblue-6);
        --link-7: var(--arcoblue-7);
        --link-8: var(--arcoblue-8);
        --link-9: var(--arcoblue-9);
        --link-10: var(--arcoblue-10);
        --data-1: var(--arcoblue-5);
        --data-2: var(--arcoblue-2);
        --data-3: 85, 197, 253;
        --data-4: 156, 220, 252;
        --data-5: var(--orange-6);
        --data-6: var(--orange-3);
        --data-7: var(--green-4);
        --data-8: var(--green-2);
        --data-9: var(--purple-4);
        --data-10: var(--purple-2);
        --data-11: var(--gold-6);
        --data-12: var(--gold-4);
        --data-13: var(--lime-6);
        --data-14: var(--lime-4);
        --data-15: var(--magenta-4);
        --data-16: var(--magenta-3);
        --data-17: var(--cyan-6);
        --data-18: var(--cyan-3);
        --data-19: var(--pinkpurple-4);
        --data-20: var(--pinkpurple-2)
    }

    body[arco-theme=dark] {
        --red-1: 77, 0, 10;
        --red-2: 119, 6, 17;
        --red-3: 161, 22, 31;
        --red-4: 203, 46, 52;
        --red-5: 245, 78, 78;
        --red-6: 247, 105, 101;
        --red-7: 249, 141, 134;
        --red-8: 251, 176, 167;
        --red-9: 253, 209, 202;
        --red-10: 255, 240, 236;
        --orangered-1: 77, 14, 0;
        --orangered-2: 119, 30, 5;
        --orangered-3: 162, 55, 20;
        --orangered-4: 204, 87, 41;
        --orangered-5: 247, 126, 69;
        --orangered-6: 249, 146, 90;
        --orangered-7: 250, 173, 125;
        --orangered-8: 252, 198, 161;
        --orangered-9: 253, 222, 197;
        --orangered-10: 255, 244, 235;
        --orange-1: 77, 27, 0;
        --orange-2: 121, 48, 4;
        --orange-3: 166, 75, 10;
        --orange-4: 210, 105, 19;
        --orange-5: 255, 141, 31;
        --orange-6: 255, 150, 38;
        --orange-7: 255, 179, 87;
        --orange-8: 255, 205, 135;
        --orange-9: 255, 227, 184;
        --orange-10: 255, 247, 232;
        --gold-1: 77, 45, 0;
        --gold-2: 119, 75, 4;
        --gold-3: 162, 111, 15;
        --gold-4: 204, 150, 31;
        --gold-5: 247, 192, 52;
        --gold-6: 249, 204, 68;
        --gold-7: 250, 220, 108;
        --gold-8: 252, 233, 149;
        --gold-9: 253, 244, 190;
        --gold-10: 255, 252, 232;
        --yellow-1: 77, 56, 0;
        --yellow-2: 120, 94, 7;
        --yellow-3: 163, 134, 20;
        --yellow-4: 207, 179, 37;
        --yellow-5: 250, 225, 60;
        --yellow-6: 251, 233, 75;
        --yellow-7: 252, 243, 116;
        --yellow-8: 253, 250, 157;
        --yellow-9: 254, 254, 198;
        --yellow-10: 254, 255, 240;
        --lime-1: 42, 77, 0;
        --lime-2: 68, 112, 6;
        --lime-3: 98, 148, 18;
        --lime-4: 132, 183, 35;
        --lime-5: 168, 219, 57;
        --lime-6: 184, 226, 75;
        --lime-7: 203, 233, 112;
        --lime-8: 222, 241, 152;
        --lime-9: 238, 248, 194;
        --lime-10: 253, 255, 238;
        --green-1: 0, 77, 28;
        --green-2: 4, 102, 37;
        --green-3: 10, 128, 45;
        --green-4: 18, 154, 55;
        --green-5: 29, 180, 64;
        --green-6: 39, 195, 70;
        --green-7: 80, 210, 102;
        --green-8: 126, 225, 139;
        --green-9: 178, 240, 183;
        --green-10: 235, 255, 236;
        --cyan-1: 0, 66, 77;
        --cyan-2: 6, 97, 108;
        --cyan-3: 17, 131, 139;
        --cyan-4: 31, 166, 170;
        --cyan-5: 48, 201, 201;
        --cyan-6: 63, 212, 207;
        --cyan-7: 102, 223, 215;
        --cyan-8: 144, 233, 225;
        --cyan-9: 190, 244, 237;
        --cyan-10: 240, 255, 252;
        --blue-1: 0, 26, 77;
        --blue-2: 5, 47, 120;
        --blue-3: 19, 76, 163;
        --blue-4: 41, 113, 207;
        --blue-5: 70, 154, 250;
        --blue-6: 90, 170, 251;
        --blue-7: 125, 193, 252;
        --blue-8: 161, 213, 253;
        --blue-9: 198, 232, 254;
        --blue-10: 234, 248, 255;
        --arcoblue-1: 0, 13, 77;
        --arcoblue-2: 4, 27, 121;
        --arcoblue-3: 14, 50, 166;
        --arcoblue-4: 29, 77, 210;
        --arcoblue-5: 48, 111, 255;
        --arcoblue-6: 60, 126, 255;
        --arcoblue-7: 104, 159, 255;
        --arcoblue-8: 147, 190, 255;
        --arcoblue-9: 190, 218, 255;
        --arcoblue-10: 234, 244, 255;
        --purple-1: 22, 0, 77;
        --purple-2: 39, 6, 110;
        --purple-3: 62, 19, 143;
        --purple-4: 90, 37, 176;
        --purple-5: 123, 61, 209;
        --purple-6: 142, 81, 218;
        --purple-7: 169, 116, 227;
        --purple-8: 197, 154, 237;
        --purple-9: 223, 194, 246;
        --purple-10: 247, 237, 255;
        --pinkpurple-1: 66, 0, 77;
        --pinkpurple-2: 101, 3, 112;
        --pinkpurple-3: 138, 13, 147;
        --pinkpurple-4: 176, 27, 182;
        --pinkpurple-5: 217, 46, 217;
        --pinkpurple-6: 225, 61, 219;
        --pinkpurple-7: 232, 102, 223;
        --pinkpurple-8: 240, 146, 230;
        --pinkpurple-9: 247, 193, 240;
        --pinkpurple-10: 255, 242, 253;
        --magenta-1: 77, 0, 52;
        --magenta-2: 119, 8, 80;
        --magenta-3: 161, 23, 108;
        --magenta-4: 203, 43, 136;
        --magenta-5: 245, 69, 166;
        --magenta-6: 247, 86, 169;
        --magenta-7: 249, 122, 184;
        --magenta-8: 251, 158, 200;
        --magenta-9: 253, 195, 219;
        --magenta-10: 255, 232, 241;
        --gray-1: 23, 23, 26;
        --gray-2: 46, 46, 48;
        --gray-3: 72, 72, 73;
        --gray-4: 95, 95, 96;
        --gray-5: 120, 120, 122;
        --gray-6: 146, 146, 147;
        --gray-7: 171, 171, 172;
        --gray-8: 197, 197, 197;
        --gray-9: 223, 223, 223;
        --gray-10: 246, 246, 246;
        --primary-1: var(--arcoblue-1);
        --primary-2: var(--arcoblue-2);
        --primary-3: var(--arcoblue-3);
        --primary-4: var(--arcoblue-4);
        --primary-5: var(--arcoblue-5);
        --primary-6: var(--arcoblue-6);
        --primary-7: var(--arcoblue-7);
        --primary-8: var(--arcoblue-8);
        --primary-9: var(--arcoblue-9);
        --primary-10: var(--arcoblue-10);
        --success-1: var(--green-1);
        --success-2: var(--green-2);
        --success-3: var(--green-3);
        --success-4: var(--green-4);
        --success-5: var(--green-5);
        --success-6: var(--green-6);
        --success-7: var(--green-7);
        --success-8: var(--green-8);
        --success-9: var(--green-9);
        --success-10: var(--green-10);
        --danger-1: var(--red-1);
        --danger-2: var(--red-2);
        --danger-3: var(--red-3);
        --danger-4: var(--red-4);
        --danger-5: var(--red-5);
        --danger-6: var(--red-6);
        --danger-7: var(--red-7);
        --danger-8: var(--red-8);
        --danger-9: var(--red-9);
        --danger-10: var(--red-10);
        --warning-1: var(--orange-1);
        --warning-2: var(--orange-2);
        --warning-3: var(--orange-3);
        --warning-4: var(--orange-4);
        --warning-5: var(--orange-5);
        --warning-6: var(--orange-6);
        --warning-7: var(--orange-7);
        --warning-8: var(--orange-8);
        --warning-9: var(--orange-9);
        --warning-10: var(--orange-10);
        --link-1: var(--arcoblue-1);
        --link-2: var(--arcoblue-2);
        --link-3: var(--arcoblue-3);
        --link-4: var(--arcoblue-4);
        --link-5: var(--arcoblue-5);
        --link-6: var(--arcoblue-6);
        --link-7: var(--arcoblue-7);
        --link-8: var(--arcoblue-8);
        --link-9: var(--arcoblue-9);
        --link-10: var(--arcoblue-10);
        --data-1: var(--arcoblue-5);
        --data-2: var(--arcoblue-3);
        --data-3: var(--blue-5);
        --data-4: var(--blue-3);
        --data-5: var(--orange-6);
        --data-6: var(--orange-3);
        --data-7: var(--green-4);
        --data-8: var(--green-3);
        --data-9: var(--purple-4);
        --data-10: var(--purple-3);
        --data-11: var(--gold-6);
        --data-12: var(--gold-4);
        --data-13: var(--lime-6);
        --data-14: var(--lime-4);
        --data-15: var(--magenta-4);
        --data-16: var(--magenta-3);
        --data-17: var(--cyan-6);
        --data-18: var(--cyan-3);
        --data-19: var(--pinkpurple-4);
        --data-20: var(--pinkpurple-2)
    }

    body {
        --color-white: #fff;
        --color-black: #000;
        --color-border: rgb(var(--gray-3));
        --color-bg-popup: var(--color-bg-5);
        --color-bg-1: #fff;
        --color-bg-2: #fff;
        --color-bg-3: #fff;
        --color-bg-4: #fff;
        --color-bg-5: #fff;
        --color-bg-white: #fff;
        --color-neutral-1: rgb(var(--gray-1));
        --color-neutral-2: rgb(var(--gray-2));
        --color-neutral-3: rgb(var(--gray-3));
        --color-neutral-4: rgb(var(--gray-4));
        --color-neutral-5: rgb(var(--gray-5));
        --color-neutral-6: rgb(var(--gray-6));
        --color-neutral-7: rgb(var(--gray-7));
        --color-neutral-8: rgb(var(--gray-8));
        --color-neutral-9: rgb(var(--gray-9));
        --color-neutral-10: rgb(var(--gray-10));
        --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-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-6);
        --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-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-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-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-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-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-data-1: rgb(var(--arcoblue-5));
        --color-data-2: rgb(var(--arcoblue-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));
        --border-radius-none: 0;
        --border-radius-small: 2px;
        --border-radius-medium: 4px;
        --border-radius-large: 8px;
        --border-radius-circle: 50%;
        --color-tooltip-bg: rgb(var(--gray-10));
        --color-spin-layer-bg: rgba(255, 255, 255, .6);
        --color-menu-dark-bg: #232324;
        --color-menu-light-bg: #fff;
        --color-menu-dark-hover: rgba(255, 255, 255, .04);
        --color-mask-bg: rgba(29, 33, 41, .6);
        --font-weight-100: 100;
        --font-weight-200: 200;
        --font-weight-300: 300;
        --font-weight-400: 400;
        --font-weight-500: 500;
        --font-weight-600: 600;
        --font-weight-700: 700;
        --font-weight-800: 800;
        --font-weight-900: 900
    }

    body[arco-theme=dark] {
        --color-white: rgba(255, 255, 255, .9);
        --color-black: #000;
        --color-border: #333335;
        --color-bg-1: #17171a;
        --color-bg-2: #232324;
        --color-bg-3: #2a2a2b;
        --color-bg-4: #313132;
        --color-bg-5: #373739;
        --color-bg-white: #f6f6f6;
        --color-text-1: rgba(255, 255, 255, .9);
        --color-text-2: rgba(255, 255, 255, .7);
        --color-text-3: rgba(255, 255, 255, .5);
        --color-text-4: rgba(255, 255, 255, .3);
        --color-fill-1: rgba(255, 255, 255, .04);
        --color-fill-2: rgba(255, 255, 255, .08);
        --color-fill-3: rgba(255, 255, 255, .12);
        --color-fill-4: rgba(255, 255, 255, .16);
        --color-primary-light-1: rgba(var(--primary-6), .2);
        --color-primary-light-2: rgba(var(--primary-6), .35);
        --color-primary-light-3: rgba(var(--primary-6), .5);
        --color-primary-light-4: rgba(var(--primary-6), .65);
        --color-secondary: rgba(var(--gray-9), .08);
        --color-secondary-hover: rgba(var(--gray-8), .16);
        --color-secondary-active: rgba(var(--gray-7), .24);
        --color-secondary-disabled: rgba(var(--gray-9), .08);
        --color-danger-light-1: rgba(var(--danger-6), .2);
        --color-danger-light-2: rgba(var(--danger-6), .35);
        --color-danger-light-3: rgba(var(--danger-6), .5);
        --color-danger-light-4: rgba(var(--danger-6), .65);
        --color-success-light-1: rgba(var(--success-6), .2);
        --color-success-light-2: rgba(var(--success-6), .35);
        --color-success-light-3: rgba(var(--success-6), .5);
        --color-success-light-4: rgba(var(--success-6), .65);
        --color-warning-light-1: rgba(var(--warning-6), .2);
        --color-warning-light-2: rgba(var(--warning-6), .35);
        --color-warning-light-3: rgba(var(--warning-6), .5);
        --color-warning-light-4: rgba(var(--warning-6), .65);
        --color-link-light-1: rgba(var(--link-6), .2);
        --color-link-light-2: rgba(var(--link-6), .35);
        --color-link-light-3: rgba(var(--link-6), .5);
        --color-link-light-4: rgba(var(--link-6), .65);
        --color-tooltip-bg: #373739;
        --color-spin-layer-bg: rgba(51, 51, 51, .6);
        --color-menu-dark-bg: #232324;
        --color-menu-light-bg: #232324;
        --color-menu-dark-hover: var(--color-fill-2);
        --color-mask-bg: rgba(23, 23, 26, .6)
    }

    html,
    body {
        -webkit-text-size-adjust: 100%;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        font-family: Inter, -apple-system, BlinkMacSystemFont, PingFang SC, Hiragino Sans GB, noto sans, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif;
        line-height: 1.5
    }

    body {
        margin: 0;
        padding: 0
    }

    main {
        display: block
    }

    h1 {
        margin: .67em 0;
        font-size: 2em
    }

    hr {
        box-sizing: content-box;
        height: 0;
        overflow: visible
    }

    tr,
    th {
        margin: 0;
        padding: 0
    }

    pre {
        font-family: monospace;
        font-size: 1em
    }

    a {
        background-color: transparent
    }

    abbr[title] {
        text-decoration: underline;
        border-bottom: none;
        -webkit-text-decoration: underline dotted;
        text-decoration: underline dotted
    }

    b,
    strong {
        font-weight: bolder
    }

    code,
    kbd,
    samp {
        font-family: monospace;
        font-size: 1em
    }

    small {
        font-size: 80%
    }

    sub,
    sup {
        vertical-align: baseline;
        font-size: 75%;
        line-height: 0;
        position: relative
    }

    sub {
        bottom: -.25em
    }

    sup {
        top: -.5em
    }

    img {
        border-style: none
    }

    button,
    input,
    optgroup,
    select,
    textarea {
        margin: 0;
        font-family: inherit;
        line-height: 1.15
    }

    button,
    input {
        overflow: visible
    }

    button,
    select {
        text-transform: none
    }

    button {
        -webkit-appearance: button
    }

    [type=button] {
        -webkit-appearance: button
    }

    [type=reset] {
        -webkit-appearance: button
    }

    [type=submit] {
        -webkit-appearance: button
    }

    button::-moz-focus-inner {
        border-style: none;
        padding: 0
    }

    [type=button]::-moz-focus-inner {
        border-style: none;
        padding: 0
    }

    [type=reset]::-moz-focus-inner {
        border-style: none;
        padding: 0
    }

    [type=submit]::-moz-focus-inner {
        border-style: none;
        padding: 0
    }

    button:-moz-focusring {
        outline: 1px dotted buttontext
    }

    [type=button]:-moz-focusring {
        outline: 1px dotted buttontext
    }

    [type=reset]:-moz-focusring {
        outline: 1px dotted buttontext
    }

    [type=submit]:-moz-focusring {
        outline: 1px dotted buttontext
    }

    fieldset {
        padding: .35em .75em .625em
    }

    legend {
        box-sizing: border-box;
        color: inherit;
        white-space: normal;
        max-width: 100%;
        padding: 0;
        display: table
    }

    progress {
        vertical-align: baseline
    }

    textarea {
        overflow: auto
    }

    [type=checkbox] {
        box-sizing: border-box;
        padding: 0
    }

    [type=radio] {
        box-sizing: border-box;
        padding: 0
    }

    [type=number]::-webkit-inner-spin-button {
        height: auto
    }

    [type=number]::-webkit-outer-spin-button {
        height: auto
    }

    [type=search] {
        -webkit-appearance: textfield;
        outline-offset: -2px
    }

    [type=search]::-webkit-search-decoration {
        -webkit-appearance: none
    }

    ::-webkit-file-upload-button {
        -webkit-appearance: button;
        font: inherit
    }

    details {
        display: block
    }

    summary {
        display: list-item
    }

    template,
    [hidden] {
        display: none
    }

    * {
        outline: none
    }

    input::-ms-clear {
        display: none
    }

    input::-ms-reveal {
        display: none
    }

    .arco-icon {
        color: inherit;
        vertical-align: -2px;
        stroke: currentColor;
        width: 1em;
        height: 1em;
        font-style: normal;
        display: inline-block
    }

    .arco-icon[fill=currentColor] {
        fill: currentColor;
        stroke: none
    }

    .arco-icon[stroke=currentColor] {
        stroke: currentColor;
        fill: none
    }

    .arco-icon[fill=currentColor][stroke=currentColor] {
        fill: currentColor;
        stroke: currentColor
    }

    .arco-icon-loading {
        animation: 1s cubic-bezier(0, 0, 1, 1) infinite arco-loading-circle
    }

    @keyframes arco-loading-circle {
        to {
            transform: rotate(360deg)
        }
    }

    .arco-icon-hover {
        cursor: pointer;
        line-height: 0;
        display: inline-block;
        position: relative
    }

    .arco-icon-hover .arco-icon {
        vertical-align: -.09em;
        position: relative
    }

    .arco-icon-hover:before {
        content: "";
        border-radius: var(--border-radius-circle);
        box-sizing: border-box;
        background-color: transparent;
        transition: background-color .1s cubic-bezier(0, 0, 1, 1);
        display: block;
        position: absolute
    }

    .arco-icon-hover:hover:before {
        background-color: var(--color-fill-2)
    }

    .arco-icon-hover.arco-icon-hover-disabled:before {
        opacity: 0
    }

    .arco-icon-hover:before,
    .arco-icon-hover-size-mini:before,
    .arco-icon-hover-size-small:before {
        width: 20px;
        height: 20px;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%)
    }

    .arco-icon-hover-size-large:before,
    .arco-icon-hover-size-huge:before {
        width: 24px;
        height: 24px;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%)
    }

    .fadeInStandard-enter,
    .fadeInStandard-appear {
        opacity: 0
    }

    .fadeInStandard-enter-active,
    .fadeInStandard-appear-active {
        opacity: 1;
        transition: opacity .3s cubic-bezier(.34, .69, .1, 1)
    }

    .fadeInStandard-exit {
        opacity: 1
    }

    .fadeInStandard-exit-active {
        opacity: 0;
        transition: opacity .3s cubic-bezier(.34, .69, .1, 1)
    }

    .fadeIn-enter,
    .fadeIn-appear {
        opacity: 0
    }

    .fadeIn-enter-active,
    .fadeIn-appear-active {
        opacity: 1;
        transition: opacity .1s cubic-bezier(0, 0, 1, 1)
    }

    .fadeIn-exit {
        opacity: 1
    }

    .fadeIn-exit-active {
        opacity: 0;
        transition: opacity .1s cubic-bezier(0, 0, 1, 1)
    }

    .slideDynamicOrigin-enter,
    .slideDynamicOrigin-appear {
        opacity: 0;
        transform-origin: 0 0;
        transform: scaleY(.9)translateZ(0)
    }

    .slideDynamicOrigin-enter-active,
    .slideDynamicOrigin-appear-active,
    .slideDynamicOrigin-exit {
        opacity: 1;
        transform-origin: 0 0;
        transition: transform .2s cubic-bezier(.34, .69, .1, 1), opacity .2s cubic-bezier(.34, .69, .1, 1);
        transform: scaleY(1)translateZ(0)
    }

    .slideDynamicOrigin-exit-active {
        opacity: 0;
        transform-origin: 0 0;
        transition: transform .2s cubic-bezier(.34, .69, .1, 1), opacity .2s cubic-bezier(.34, .69, .1, 1);
        transform: scaleY(.9)translateZ(0)
    }

    .slideLeft-enter,
    .slideLeft-appear {
        transform: translate(-100%)
    }

    .slideLeft-enter-active,
    .slideLeft-appear-active {
        transition: transform .3s cubic-bezier(.34, .69, .1, 1);
        transform: translate(0)
    }

    .slideLeft-exit {
        transform: translate(0)
    }

    .slideLeft-exit-active {
        transition: transform .3s cubic-bezier(.34, .69, .1, 1);
        transform: translate(-100%)
    }

    .slideRight-enter,
    .slideRight-appear {
        transform: translate(100%)
    }

    .slideRight-enter-active,
    .slideRight-appear-active {
        transition: transform .3s cubic-bezier(.34, .69, .1, 1);
        transform: translate(0)
    }

    .slideRight-exit {
        transform: translate(0)
    }

    .slideRight-exit-active {
        transition: transform .3s cubic-bezier(.34, .69, .1, 1);
        transform: translate(100%)
    }

    .slideTop-enter,
    .slideTop-appear {
        transform: translateY(-100%)
    }

    .slideTop-enter-active,
    .slideTop-appear-active {
        transition: transform .3s cubic-bezier(.34, .69, .1, 1);
        transform: translateY(0)
    }

    .slideTop-exit {
        transform: translateY(0)
    }

    .slideTop-exit-active {
        transition: transform .3s cubic-bezier(.34, .69, .1, 1);
        transform: translateY(-100%)
    }

    .slideBottom-enter,
    .slideBottom-appear {
        transform: translateY(100%)
    }

    .slideBottom-enter-active,
    .slideBottom-appear-active {
        transition: transform .3s cubic-bezier(.34, .69, .1, 1);
        transform: translateY(0)
    }

    .slideBottom-exit {
        transform: translateY(0)
    }

    .slideBottom-exit-active {
        transition: transform .3s cubic-bezier(.34, .69, .1, 1);
        transform: translateY(100%)
    }

    .zoomIn-enter,
    .zoomIn-appear {
        opacity: 0;
        transform: scale(.5)
    }

    .zoomIn-enter-active,
    .zoomIn-appear-active {
        opacity: 1;
        transition: opacity .3s cubic-bezier(.34, .69, .1, 1), transform .3s cubic-bezier(.34, .69, .1, 1);
        transform: scale(1)
    }

    .zoomIn-exit {
        opacity: 1;
        transform: scale(1)
    }

    .zoomIn-exit-active {
        opacity: 0;
        transition: opacity .3s cubic-bezier(.3, 1.3, .3, 1), transform .3s cubic-bezier(.3, 1.3, .3, 1);
        transform: scale(.5)
    }

    .zoomInFadeOut-enter,
    .zoomInFadeOut-appear {
        opacity: 0;
        transform: scale(.5)
    }

    .zoomInFadeOut-enter-active,
    .zoomInFadeOut-appear-active {
        opacity: 1;
        transition: opacity .2s cubic-bezier(.34, .69, .1, 1), transform .2s cubic-bezier(.34, .69, .1, 1);
        transform: scale(1)
    }

    .zoomInFadeOut-exit {
        opacity: 1;
        transform: scale(1)
    }

    .zoomInFadeOut-exit-active {
        opacity: 0;
        transition: opacity .2s cubic-bezier(.3, 1.3, .3, 1), transform .2s cubic-bezier(.3, 1.3, .3, 1);
        transform: scale(.5)
    }

    .zoomInBig-enter,
    .zoomInBig-appear {
        opacity: 0;
        transform: scale(.5)
    }

    .zoomInBig-enter-active,
    .zoomInBig-appear-active {
        opacity: 1;
        transition: opacity .2s cubic-bezier(0, 0, 1, 1), transform .2s cubic-bezier(0, 0, 1, 1);
        transform: scale(1)
    }

    .zoomInBig-exit {
        opacity: 1;
        transform: scale(1)
    }

    .zoomInBig-exit-active {
        opacity: 0;
        transition: opacity .2s cubic-bezier(0, 0, 1, 1), transform .2s cubic-bezier(0, 0, 1, 1);
        transform: scale(.2)
    }

    .zoomInLeft-enter,
    .zoomInLeft-appear {
        opacity: .1;
        transform-origin: 0;
        transform: scale(.1)
    }

    .zoomInLeft-enter-active,
    .zoomInLeft-appear-active {
        opacity: 1;
        transition: opacity .3s cubic-bezier(0, 0, 1, 1), transform .3s cubic-bezier(.3, 1.3, .3, 1);
        transform: scale(1)
    }

    .zoomInLeft-exit {
        opacity: 1;
        transform-origin: 0;
        transform: scale(1)
    }

    .zoomInLeft-exit-active {
        opacity: .1;
        transition: opacity .3s cubic-bezier(0, 0, 1, 1), transform .3s cubic-bezier(.3, 1.3, .3, 1);
        transform: scale(.1)
    }

    .zoomInTop-enter,
    .zoomInTop-appear {
        opacity: 0;
        transform-origin: 0 0;
        transform: scaleY(.8)translateZ(0)
    }

    .zoomInTop-enter-active,
    .zoomInTop-appear-active {
        opacity: 1;
        transform-origin: 0 0;
        transition: transform .3s cubic-bezier(.3, 1.3, .3, 1), opacity .3s cubic-bezier(.3, 1.3, .3, 1);
        transform: scaleY(1)translateZ(0)
    }

    .zoomInTop-exit {
        opacity: 1;
        transform-origin: 0 0;
        transform: scaleY(1)translateZ(0)
    }

    .zoomInTop-exit-active {
        opacity: 0;
        transform-origin: 0 0;
        transition: transform .3s cubic-bezier(.3, 1.3, .3, 1), opacity .3s cubic-bezier(.3, 1.3, .3, 1);
        transform: scaleY(.8)translateZ(0)
    }

    .zoomInBottom-enter,
    .zoomInBottom-appear {
        opacity: 0;
        transform-origin: 100% 100%;
        transform: scaleY(.8)translateZ(0)
    }

    .zoomInBottom-enter-active,
    .zoomInBottom-appear-active {
        opacity: 1;
        transform-origin: 100% 100%;
        transition: transform .3s cubic-bezier(.3, 1.3, .3, 1), opacity .3s cubic-bezier(.3, 1.3, .3, 1);
        transform: scaleY(1)translateZ(0)
    }

    .zoomInBottom-exit {
        opacity: 1;
        transform-origin: 100% 100%;
        transform: scaleY(1)translateZ(0)
    }

    .zoomInBottom-exit-active {
        opacity: 0;
        transform-origin: 100% 100%;
        transition: transform .3s cubic-bezier(.3, 1.3, .3, 1), opacity .3s cubic-bezier(.3, 1.3, .3, 1);
        transform: scaleY(.8)translateZ(0)
    }

    body {
        font-size: 14px
    }
}


@layer base {
    .arco-affix {
        z-index: 999;
        position: fixed
    }
}


@layer base {
    .arco-anchor {
        width: 150px;
        position: relative;
        overflow: auto
    }

    .arco-anchor-line-slider {
        background-color: rgb(var(--primary-6));
        z-index: 1;
        width: 2px;
        height: 12px;
        margin-top: 9.0005px;
        transition: all .2s cubic-bezier(.34, .69, .1, 1);
        position: absolute;
        top: 0;
        left: 0
    }

    .arco-anchor-list {
        margin-left: 6px;
        position: relative
    }

    .arco-anchor-list:before {
        content: "";
        background-color: var(--color-fill-3);
        width: 2px;
        height: 100%;
        position: absolute;
        left: -6px
    }

    .arco-anchor-link {
        margin-bottom: 2px
    }

    .arco-anchor-link-title {
        color: var(--color-text-2);
        cursor: pointer;
        text-overflow: ellipsis;
        white-space: nowrap;
        border-radius: var(--border-radius-small);
        margin-bottom: 2px;
        padding: 4px 8px;
        font-size: 14px;
        line-height: 1.5715;
        text-decoration: none;
        display: block;
        overflow: hidden
    }

    .arco-anchor-link-title:hover {
        background-color: var(--color-fill-2);
        color: var(--color-text-1);
        font-weight: 500
    }

    .arco-anchor-link-title:focus-visible {
        box-shadow: inset 0 0 0 2px rgb(var(--primary-6))
    }

    .arco-anchor-link-active>.arco-anchor-link-title {
        color: var(--color-text-1);
        font-weight: 500;
        transition: all .1s cubic-bezier(0, 0, 1, 1)
    }

    .arco-anchor-link .arco-anchor-link {
        margin-left: 16px
    }

    .arco-anchor-lineless .arco-anchor-list {
        margin-left: 0
    }

    .arco-anchor-lineless .arco-anchor-list:before {
        display: none
    }

    .arco-anchor-lineless .arco-anchor-link-active>.arco-anchor-link-title {
        background-color: var(--color-fill-2);
        color: rgb(var(--primary-6));
        font-weight: 500
    }

    .arco-anchor-rtl {
        direction: rtl
    }

    .arco-anchor-rtl .arco-anchor-list {
        margin-left: 0;
        margin-right: 6px
    }

    .arco-anchor-rtl .arco-anchor-list:before {
        left: initial;
        right: -6px
    }

    .arco-anchor-rtl .arco-anchor-link .arco-anchor-link {
        margin-left: 0;
        margin-right: 16px
    }

    .arco-anchor-rtl.arco-anchor-lineless .arco-anchor-list {
        margin-right: 0
    }

    .arco-anchor-rtl .arco-anchor-line-slider {
        left: initial;
        right: 0
    }

    .arco-anchor.arco-anchor-horizontal {
        width: 100%
    }

    .arco-anchor-horizontal .arco-anchor-list {
        width: 100%;
        margin: 0;
        display: flex
    }

    .arco-anchor-horizontal .arco-anchor-list:before {
        width: 100%;
        height: 2px;
        bottom: 0;
        left: 0;
        right: 0
    }

    .arco-anchor-horizontal .arco-anchor-link-title:hover {
        font-weight: 400
    }

    .arco-anchor-horizontal .arco-anchor-link-active .arco-anchor-link-title:hover {
        font-weight: 500
    }

    .arco-anchor-horizontal .arco-anchor-link:not(:first-of-type) {
        margin-left: 16px
    }

    .arco-anchor-rtl.arco-anchor-horizontal .arco-anchor-link:not(:first-of-type) {
        margin-right: 16px;
        margin-left: unset
    }

    .arco-anchor-horizontal .arco-anchor-line-slider {
        width: 0;
        height: 2px;
        top: unset;
        bottom: 0;
        right: unset;
        background-color: transparent;
        margin: 0
    }

    .arco-anchor-horizontal .arco-anchor-line-slider:before {
        content: "";
        background-color: rgb(var(--primary-6));
        height: 100%;
        display: block;
        position: absolute;
        left: 8px;
        right: 8px
    }

    .arco-anchor.arco-anchor-lineless .arco-anchor-link,
    .arco-anchor.arco-anchor-lineless .arco-anchor-link-title {
        margin-bottom: 0
    }
}


@layer base {
    .arco-btn {
        -webkit-appearance: none;
        -moz-appearance: none;
        -ms-appearance: none;
        appearance: none;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        cursor: pointer;
        white-space: nowrap;
        box-sizing: border-box;
        outline: none;
        font-weight: 400;
        line-height: 1.5715;
        transition: all .1s cubic-bezier(0, 0, 1, 1);
        display: inline-block;
        position: relative
    }

    .arco-btn>a:only-child {
        color: currentColor
    }

    .arco-btn:active {
        transition: none
    }

    .arco-btn:empty {
        vertical-align: bottom;
        display: inline-block
    }

    .arco-btn-long {
        width: 100%;
        display: block
    }

    .arco-btn-link {
        justify-content: center;
        align-items: center;
        text-decoration: none;
        display: inline-flex
    }

    .arco-btn-link:not([href]) {
        color: var(--color-text-4)
    }

    .arco-btn-link:hover {
        text-decoration: none
    }

    .arco-btn-loading {
        cursor: default;
        position: relative
    }

    .arco-btn-loading:before {
        content: "";
        z-index: 1;
        border-radius: inherit;
        opacity: .4;
        pointer-events: none;
        background: #fff;
        transition: opacity .1s cubic-bezier(0, 0, 1, 1);
        display: block;
        position: absolute;
        top: -1px;
        bottom: -1px;
        left: -1px;
        right: -1px
    }

    .arco-btn-loading-fixed-width {
        transition: none
    }

    .arco-btn-two-chinese-chars>:not(svg) {
        letter-spacing: .3em;
        margin-right: -.3em
    }

    a.arco-btn-icon-only {
        vertical-align: top;
        justify-content: center;
        align-items: center;
        display: inline-flex
    }

    .arco-btn-outline:not(.arco-btn-disabled) {
        color: rgb(var(--primary-6));
        border: 1px solid rgb(var(--primary-6));
        background-color: transparent
    }

    .arco-btn-outline:not(.arco-btn-disabled):not(.arco-btn-loading):hover {
        border-color: rgb(var(--primary-5));
        color: rgb(var(--primary-5));
        background-color: transparent
    }

    .arco-btn-outline:not(.arco-btn-disabled):not(.arco-btn-loading):active {
        border-color: rgb(var(--primary-7));
        color: rgb(var(--primary-7));
        background-color: transparent
    }

    .arco-btn-outline:not(.arco-btn-disabled):focus-visible {
        box-shadow: 0 0 0 2px rgb(var(--primary-3))
    }

    .arco-btn-outline.arco-btn-disabled {
        color: var(--color-primary-light-3);
        border: 1px solid var(--color-primary-light-3);
        cursor: not-allowed;
        background-color: transparent
    }

    .arco-btn-outline.arco-btn-status-warning:not(.arco-btn-disabled) {
        color: rgb(var(--warning-6));
        border-color: rgb(var(--warning-6));
        background-color: transparent
    }

    .arco-btn-outline.arco-btn-status-warning:not(.arco-btn-disabled):not(.arco-btn-loading):hover {
        border-color: rgb(var(--warning-5));
        color: rgb(var(--warning-5));
        background-color: transparent
    }

    .arco-btn-outline.arco-btn-status-warning:not(.arco-btn-disabled):not(.arco-btn-loading):active {
        border-color: rgb(var(--warning-7));
        color: rgb(var(--warning-7));
        background-color: transparent
    }

    .arco-btn-outline.arco-btn-status-warning:not(.arco-btn-disabled):focus-visible {
        box-shadow: 0 0 0 2px rgb(var(--warning-3))
    }

    .arco-btn-outline.arco-btn-status-warning.arco-btn-disabled {
        color: var(--color-warning-light-3);
        border: 1px solid var(--color-warning-light-3);
        background-color: transparent
    }

    .arco-btn-outline.arco-btn-status-danger:not(.arco-btn-disabled) {
        color: rgb(var(--danger-6));
        border-color: rgb(var(--danger-6));
        background-color: transparent
    }

    .arco-btn-outline.arco-btn-status-danger:not(.arco-btn-disabled):not(.arco-btn-loading):hover {
        border-color: rgb(var(--danger-5));
        color: rgb(var(--danger-5));
        background-color: transparent
    }

    .arco-btn-outline.arco-btn-status-danger:not(.arco-btn-disabled):not(.arco-btn-loading):active {
        border-color: rgb(var(--danger-7));
        color: rgb(var(--danger-7));
        background-color: transparent
    }

    .arco-btn-outline.arco-btn-status-danger:not(.arco-btn-disabled):focus-visible {
        box-shadow: 0 0 0 2px rgb(var(--danger-3))
    }

    .arco-btn-outline.arco-btn-status-danger.arco-btn-disabled {
        color: var(--color-danger-light-3);
        border: 1px solid var(--color-danger-light-3);
        background-color: transparent
    }

    .arco-btn-outline.arco-btn-status-success:not(.arco-btn-disabled) {
        color: rgb(var(--success-6));
        border-color: rgb(var(--success-6));
        background-color: transparent
    }

    .arco-btn-outline.arco-btn-status-success:not(.arco-btn-disabled):not(.arco-btn-loading):hover {
        border-color: rgb(var(--success-5));
        color: rgb(var(--success-5));
        background-color: transparent
    }

    .arco-btn-outline.arco-btn-status-success:not(.arco-btn-disabled):not(.arco-btn-loading):active {
        border-color: rgb(var(--success-7));
        color: rgb(var(--success-7));
        background-color: transparent
    }

    .arco-btn-outline.arco-btn-status-success:not(.arco-btn-disabled):focus-visible {
        box-shadow: 0 0 0 2px rgb(var(--success-3))
    }

    .arco-btn-outline.arco-btn-status-success.arco-btn-disabled {
        color: var(--color-success-light-3);
        border: 1px solid var(--color-success-light-3);
        background-color: transparent
    }

    .arco-btn-primary:not(.arco-btn-disabled) {
        background-color: rgb(var(--primary-6));
        color: #fff;
        border: 1px solid transparent
    }

    .arco-btn-primary:not(.arco-btn-disabled):not(.arco-btn-loading):hover {
        color: #fff;
        background-color: rgb(var(--primary-5));
        border-color: transparent
    }

    .arco-btn-primary:not(.arco-btn-disabled):not(.arco-btn-loading):active {
        color: #fff;
        background-color: rgb(var(--primary-7));
        border-color: transparent
    }

    .arco-btn-primary:not(.arco-btn-disabled):focus-visible {
        box-shadow: 0 0 0 2px rgb(var(--primary-3))
    }

    .arco-btn-primary.arco-btn-disabled {
        background-color: var(--color-primary-light-3);
        color: #fff;
        cursor: not-allowed;
        border: 1px solid transparent
    }

    .arco-btn-primary.arco-btn-status-warning:not(.arco-btn-disabled) {
        background-color: rgb(var(--warning-6));
        color: #fff;
        border-color: transparent
    }

    .arco-btn-primary.arco-btn-status-warning:not(.arco-btn-disabled):not(.arco-btn-loading):hover {
        color: #fff;
        background-color: rgb(var(--warning-5));
        border-color: transparent
    }

    .arco-btn-primary.arco-btn-status-warning:not(.arco-btn-disabled):not(.arco-btn-loading):active {
        color: #fff;
        background-color: rgb(var(--warning-7));
        border-color: transparent
    }

    .arco-btn-primary.arco-btn-status-warning:not(.arco-btn-disabled):focus-visible {
        box-shadow: 0 0 0 2px rgb(var(--warning-3))
    }

    .arco-btn-primary.arco-btn-status-warning.arco-btn-disabled {
        color: #fff;
        background-color: var(--color-warning-light-3);
        border: 1px solid transparent
    }

    .arco-btn-primary.arco-btn-status-danger:not(.arco-btn-disabled) {
        background-color: rgb(var(--danger-6));
        color: #fff;
        border-color: transparent
    }

    .arco-btn-primary.arco-btn-status-danger:not(.arco-btn-disabled):not(.arco-btn-loading):hover {
        color: #fff;
        background-color: rgb(var(--danger-5));
        border-color: transparent
    }

    .arco-btn-primary.arco-btn-status-danger:not(.arco-btn-disabled):not(.arco-btn-loading):active {
        color: #fff;
        background-color: rgb(var(--danger-7));
        border-color: transparent
    }

    .arco-btn-primary.arco-btn-status-danger:not(.arco-btn-disabled):focus-visible {
        box-shadow: 0 0 0 2px rgb(var(--danger-3))
    }

    .arco-btn-primary.arco-btn-status-danger.arco-btn-disabled {
        color: #fff;
        background-color: var(--color-danger-light-3);
        border: 1px solid transparent
    }

    .arco-btn-primary.arco-btn-status-success:not(.arco-btn-disabled) {
        background-color: rgb(var(--success-6));
        color: #fff;
        border-color: transparent
    }

    .arco-btn-primary.arco-btn-status-success:not(.arco-btn-disabled):not(.arco-btn-loading):hover {
        color: #fff;
        background-color: rgb(var(--success-5));
        border-color: transparent
    }

    .arco-btn-primary.arco-btn-status-success:not(.arco-btn-disabled):not(.arco-btn-loading):active {
        color: #fff;
        background-color: rgb(var(--success-7));
        border-color: transparent
    }

    .arco-btn-primary.arco-btn-status-success:not(.arco-btn-disabled):focus-visible {
        box-shadow: 0 0 0 2px rgb(var(--success-3))
    }

    .arco-btn-primary.arco-btn-status-success.arco-btn-disabled {
        color: #fff;
        background-color: var(--color-success-light-3);
        border: 1px solid transparent
    }

    .arco-btn-secondary:not(.arco-btn-disabled) {
        background-color: var(--color-secondary);
        color: var(--color-text-2);
        border: 1px solid transparent
    }

    .arco-btn-secondary:not(.arco-btn-disabled):not(.arco-btn-loading):hover {
        color: var(--color-text-2);
        background-color: var(--color-secondary-hover);
        border-color: transparent
    }

    .arco-btn-secondary:not(.arco-btn-disabled):not(.arco-btn-loading):active {
        color: var(--color-text-2);
        background-color: var(--color-secondary-active);
        border-color: transparent
    }

    .arco-btn-secondary:not(.arco-btn-disabled):focus-visible {
        box-shadow: 0 0 0 2px var(--color-neutral-4)
    }

    .arco-btn-secondary.arco-btn-disabled {
        background-color: var(--color-secondary-disabled);
        color: var(--color-text-4);
        cursor: not-allowed;
        border: 1px solid transparent
    }

    .arco-btn-secondary.arco-btn-status-warning:not(.arco-btn-disabled) {
        background-color: var(--color-warning-light-1);
        color: rgb(var(--warning-6));
        border-color: transparent
    }

    .arco-btn-secondary.arco-btn-status-warning:not(.arco-btn-disabled):not(.arco-btn-loading):hover {
        color: rgb(var(--warning-6));
        background-color: var(--color-warning-light-2);
        border-color: transparent
    }

    .arco-btn-secondary.arco-btn-status-warning:not(.arco-btn-disabled):not(.arco-btn-loading):active {
        color: rgb(var(--warning-6));
        background-color: var(--color-warning-light-3);
        border-color: transparent
    }

    .arco-btn-secondary.arco-btn-status-warning:not(.arco-btn-disabled):focus-visible {
        box-shadow: 0 0 0 2px rgb(var(--warning-3))
    }

    .arco-btn-secondary.arco-btn-status-warning.arco-btn-disabled {
        color: var(--color-warning-light-3);
        background-color: var(--color-warning-light-1);
        border: 1px solid transparent
    }

    .arco-btn-secondary.arco-btn-status-danger:not(.arco-btn-disabled) {
        background-color: var(--color-danger-light-1);
        color: rgb(var(--danger-6));
        border-color: transparent
    }

    .arco-btn-secondary.arco-btn-status-danger:not(.arco-btn-disabled):not(.arco-btn-loading):hover {
        color: rgb(var(--danger-6));
        background-color: var(--color-danger-light-2);
        border-color: transparent
    }

    .arco-btn-secondary.arco-btn-status-danger:not(.arco-btn-disabled):not(.arco-btn-loading):active {
        color: rgb(var(--danger-6));
        background-color: var(--color-danger-light-3);
        border-color: transparent
    }

    .arco-btn-secondary.arco-btn-status-danger:not(.arco-btn-disabled):focus-visible {
        box-shadow: 0 0 0 2px rgb(var(--danger-3))
    }

    .arco-btn-secondary.arco-btn-status-danger.arco-btn-disabled {
        color: var(--color-danger-light-3);
        background-color: var(--color-danger-light-1);
        border: 1px solid transparent
    }

    .arco-btn-secondary.arco-btn-status-success:not(.arco-btn-disabled) {
        background-color: var(--color-success-light-1);
        color: rgb(var(--success-6));
        border-color: transparent
    }

    .arco-btn-secondary.arco-btn-status-success:not(.arco-btn-disabled):not(.arco-btn-loading):hover {
        color: rgb(var(--success-6));
        background-color: var(--color-success-light-2);
        border-color: transparent
    }

    .arco-btn-secondary.arco-btn-status-success:not(.arco-btn-disabled):not(.arco-btn-loading):active {
        color: rgb(var(--success-6));
        background-color: var(--color-success-light-3);
        border-color: transparent
    }

    .arco-btn-secondary.arco-btn-status-success:not(.arco-btn-disabled):focus-visible {
        box-shadow: 0 0 0 2px rgb(var(--success-3))
    }

    .arco-btn-secondary.arco-btn-status-success.arco-btn-disabled {
        color: var(--color-success-light-3);
        background-color: var(--color-success-light-1);
        border: 1px solid transparent
    }

    .arco-btn-dashed:not(.arco-btn-disabled) {
        background-color: var(--color-fill-2);
        color: var(--color-text-2);
        border: 1px dashed var(--color-neutral-3)
    }

    .arco-btn-dashed:not(.arco-btn-disabled):not(.arco-btn-loading):hover {
        border-color: var(--color-neutral-4);
        color: var(--color-text-2);
        background-color: var(--color-fill-3)
    }

    .arco-btn-dashed:not(.arco-btn-disabled):not(.arco-btn-loading):active {
        border-color: var(--color-neutral-5);
        color: var(--color-text-2);
        background-color: var(--color-fill-4)
    }

    .arco-btn-dashed:not(.arco-btn-disabled):focus-visible {
        box-shadow: 0 0 0 2px var(--color-neutral-4)
    }

    .arco-btn-dashed.arco-btn-disabled {
        background-color: var(--color-fill-2);
        color: var(--color-text-4);
        border: 1px dashed var(--color-neutral-3);
        cursor: not-allowed
    }

    .arco-btn-dashed.arco-btn-status-warning:not(.arco-btn-disabled) {
        background-color: var(--color-warning-light-1);
        color: rgb(var(--warning-6));
        border-color: var(--color-warning-light-2)
    }

    .arco-btn-dashed.arco-btn-status-warning:not(.arco-btn-disabled):not(.arco-btn-loading):hover {
        border-color: var(--color-warning-light-3);
        color: rgb(var(--warning-6));
        background-color: var(--color-warning-light-2)
    }

    .arco-btn-dashed.arco-btn-status-warning:not(.arco-btn-disabled):not(.arco-btn-loading):active {
        border-color: var(--color-warning-light-4);
        color: rgb(var(--warning-6));
        background-color: var(--color-warning-light-3)
    }

    .arco-btn-dashed.arco-btn-status-warning:not(.arco-btn-disabled):focus-visible {
        box-shadow: 0 0 0 2px rgb(var(--warning-3))
    }

    .arco-btn-dashed.arco-btn-status-warning.arco-btn-disabled {
        color: var(--color-warning-light-3);
        background-color: var(--color-warning-light-1);
        border: 1px dashed var(--color-warning-light-2)
    }

    .arco-btn-dashed.arco-btn-status-danger:not(.arco-btn-disabled) {
        background-color: var(--color-danger-light-1);
        color: rgb(var(--danger-6));
        border-color: var(--color-danger-light-2)
    }

    .arco-btn-dashed.arco-btn-status-danger:not(.arco-btn-disabled):not(.arco-btn-loading):hover {
        border-color: var(--color-danger-light-3);
        color: rgb(var(--danger-6));
        background-color: var(--color-danger-light-2)
    }

    .arco-btn-dashed.arco-btn-status-danger:not(.arco-btn-disabled):not(.arco-btn-loading):active {
        border-color: var(--color-danger-light-4);
        color: rgb(var(--danger-6));
        background-color: var(--color-danger-light-3)
    }

    .arco-btn-dashed.arco-btn-status-danger:not(.arco-btn-disabled):focus-visible {
        box-shadow: 0 0 0 2px rgb(var(--danger-3))
    }

    .arco-btn-dashed.arco-btn-status-danger.arco-btn-disabled {
        color: var(--color-danger-light-3);
        background-color: var(--color-danger-light-1);
        border: 1px dashed var(--color-danger-light-2)
    }

    .arco-btn-dashed.arco-btn-status-success:not(.arco-btn-disabled) {
        background-color: var(--color-success-light-1);
        color: rgb(var(--success-6));
        border-color: var(--color-success-light-2)
    }

    .arco-btn-dashed.arco-btn-status-success:not(.arco-btn-disabled):not(.arco-btn-loading):hover {
        border-color: var(--color-success-light-3);
        color: rgb(var(--success-6));
        background-color: var(--color-success-light-2)
    }

    .arco-btn-dashed.arco-btn-status-success:not(.arco-btn-disabled):not(.arco-btn-loading):active {
        border-color: var(--color-success-light-4);
        color: rgb(var(--success-6));
        background-color: var(--color-success-light-3)
    }

    .arco-btn-dashed.arco-btn-status-success:not(.arco-btn-disabled):focus-visible {
        box-shadow: 0 0 0 2px rgb(var(--success-3))
    }

    .arco-btn-dashed.arco-btn-status-success.arco-btn-disabled {
        color: var(--color-success-light-3);
        background-color: var(--color-success-light-1);
        border: 1px dashed var(--color-success-light-2)
    }

    .arco-btn-text:not(.arco-btn-disabled) {
        color: rgb(var(--primary-6));
        background-color: transparent;
        border: 1px solid transparent
    }

    .arco-btn-text:not(.arco-btn-disabled):not(.arco-btn-loading):hover {
        color: rgb(var(--primary-6));
        background-color: var(--color-fill-2);
        border-color: transparent
    }

    .arco-btn-text:not(.arco-btn-disabled):not(.arco-btn-loading):active {
        color: rgb(var(--primary-6));
        background-color: var(--color-fill-3);
        border-color: transparent
    }

    .arco-btn-text:not(.arco-btn-disabled):focus-visible {
        box-shadow: 0 0 0 2px var(--color-neutral-4)
    }

    .arco-btn-text.arco-btn-disabled {
        color: var(--color-primary-light-3);
        cursor: not-allowed;
        background-color: transparent;
        border: 1px solid transparent
    }

    .arco-btn-text.arco-btn-status-warning:not(.arco-btn-disabled) {
        color: rgb(var(--warning-6));
        background-color: transparent;
        border-color: transparent
    }

    .arco-btn-text.arco-btn-status-warning:not(.arco-btn-disabled):not(.arco-btn-loading):hover {
        color: rgb(var(--warning-6));
        background-color: var(--color-fill-2);
        border-color: transparent
    }

    .arco-btn-text.arco-btn-status-warning:not(.arco-btn-disabled):not(.arco-btn-loading):active {
        color: rgb(var(--warning-6));
        background-color: var(--color-fill-3);
        border-color: transparent
    }

    .arco-btn-text.arco-btn-status-warning:not(.arco-btn-disabled):focus-visible {
        box-shadow: 0 0 0 2px rgb(var(--warning-3))
    }

    .arco-btn-text.arco-btn-status-warning.arco-btn-disabled {
        color: var(--color-warning-light-3);
        background-color: transparent;
        border: 1px solid transparent
    }

    .arco-btn-text.arco-btn-status-danger:not(.arco-btn-disabled) {
        color: rgb(var(--danger-6));
        background-color: transparent;
        border-color: transparent
    }

    .arco-btn-text.arco-btn-status-danger:not(.arco-btn-disabled):not(.arco-btn-loading):hover {
        color: rgb(var(--danger-6));
        background-color: var(--color-fill-2);
        border-color: transparent
    }

    .arco-btn-text.arco-btn-status-danger:not(.arco-btn-disabled):not(.arco-btn-loading):active {
        color: rgb(var(--danger-6));
        background-color: var(--color-fill-3);
        border-color: transparent
    }

    .arco-btn-text.arco-btn-status-danger:not(.arco-btn-disabled):focus-visible {
        box-shadow: 0 0 0 2px rgb(var(--danger-3))
    }

    .arco-btn-text.arco-btn-status-danger.arco-btn-disabled {
        color: var(--color-danger-light-3);
        background-color: transparent;
        border: 1px solid transparent
    }

    .arco-btn-text.arco-btn-status-success:not(.arco-btn-disabled) {
        color: rgb(var(--success-6));
        background-color: transparent;
        border-color: transparent
    }

    .arco-btn-text.arco-btn-status-success:not(.arco-btn-disabled):not(.arco-btn-loading):hover {
        color: rgb(var(--success-6));
        background-color: var(--color-fill-2);
        border-color: transparent
    }

    .arco-btn-text.arco-btn-status-success:not(.arco-btn-disabled):not(.arco-btn-loading):active {
        color: rgb(var(--success-6));
        background-color: var(--color-fill-3);
        border-color: transparent
    }

    .arco-btn-text.arco-btn-status-success:not(.arco-btn-disabled):focus-visible {
        box-shadow: 0 0 0 2px rgb(var(--success-3))
    }

    .arco-btn-text.arco-btn-status-success.arco-btn-disabled {
        color: var(--color-success-light-3);
        background-color: transparent;
        border: 1px solid transparent
    }

    .arco-btn-size-mini {
        border-radius: var(--border-radius-small);
        height: 24px;
        padding: 0 11px;
        font-size: 12px
    }

    .arco-btn-size-mini>svg+span,
    .arco-btn-size-mini>span+svg {
        margin-left: 4px
    }

    .arco-btn-size-mini svg {
        vertical-align: -2px
    }

    .arco-btn-size-mini.arco-btn-rtl>svg+span,
    .arco-btn-size-mini.arco-btn-rtl>span+svg {
        margin-left: 0;
        margin-right: 4px
    }

    .arco-btn-size-mini.arco-btn-loading-fixed-width.arco-btn-loading {
        padding-left: 3px;
        padding-right: 3px
    }

    .arco-btn-size-mini.arco-btn-icon-only {
        width: 24px;
        height: 24px;
        padding: 0
    }

    .arco-btn-size-mini.arco-btn-shape-circle {
        text-align: center;
        border-radius: var(--border-radius-circle);
        width: 24px;
        height: 24px;
        padding: 0
    }

    .arco-btn-size-mini.arco-btn-shape-round {
        border-radius: 12px
    }

    .arco-btn-group .arco-btn-size-mini:first-child {
        border-radius: var(--border-radius-small)0 0 var(--border-radius-small)
    }

    .arco-btn-group .arco-btn-size-mini:last-child {
        border-radius: 0 var(--border-radius-small)var(--border-radius-small)0
    }

    .arco-btn-group .arco-btn-size-mini:first-child:last-child {
        border-radius: var(--border-radius-small)
    }

    .arco-btn-group .arco-btn-size-mini.arco-btn-shape-round:first-child {
        border-radius: 12px 0 0 12px
    }

    .arco-btn-group .arco-btn-size-mini.arco-btn-shape-round:last-child {
        border-radius: 0 12px 12px 0
    }

    .arco-btn-group .arco-btn-size-mini.arco-btn-shape-round:first-child:last-child {
        border-radius: 12px
    }

    .arco-btn-group .arco-btn-rtl.arco-btn-size-mini:first-child {
        border-radius: 0 var(--border-radius-small)var(--border-radius-small)0
    }

    .arco-btn-group .arco-btn-rtl.arco-btn-size-mini:last-child {
        border-radius: var(--border-radius-small)0 0 var(--border-radius-small)
    }

    .arco-btn-group .arco-btn-rtl.arco-btn-size-mini:first-child:last-child {
        border-radius: var(--border-radius-small)
    }

    .arco-btn-group .arco-btn-rtl.arco-btn-size-mini.arco-btn-shape-round:first-child {
        border-radius: 0 12px 12px 0
    }

    .arco-btn-group .arco-btn-rtl.arco-btn-size-mini.arco-btn-shape-round:last-child {
        border-radius: 12px 0 0 12px
    }

    .arco-btn-group .arco-btn-rtl.arco-btn-size-mini.arco-btn-shape-round:first-child:last-child {
        border-radius: 12px
    }

    .arco-btn-size-small {
        border-radius: var(--border-radius-small);
        height: 28px;
        padding: 0 15px;
        font-size: 14px
    }

    .arco-btn-size-small>svg+span,
    .arco-btn-size-small>span+svg {
        margin-left: 6px
    }

    .arco-btn-size-small svg {
        vertical-align: -2px
    }

    .arco-btn-size-small.arco-btn-rtl>svg+span,
    .arco-btn-size-small.arco-btn-rtl>span+svg {
        margin-left: 0;
        margin-right: 6px
    }

    .arco-btn-size-small.arco-btn-loading-fixed-width.arco-btn-loading {
        padding-left: 5px;
        padding-right: 5px
    }

    .arco-btn-size-small.arco-btn-icon-only {
        width: 28px;
        height: 28px;
        padding: 0
    }

    .arco-btn-size-small.arco-btn-shape-circle {
        text-align: center;
        border-radius: var(--border-radius-circle);
        width: 28px;
        height: 28px;
        padding: 0
    }

    .arco-btn-size-small.arco-btn-shape-round {
        border-radius: 14px
    }

    .arco-btn-group .arco-btn-size-small:first-child {
        border-radius: var(--border-radius-small)0 0 var(--border-radius-small)
    }

    .arco-btn-group .arco-btn-size-small:last-child {
        border-radius: 0 var(--border-radius-small)var(--border-radius-small)0
    }

    .arco-btn-group .arco-btn-size-small:first-child:last-child {
        border-radius: var(--border-radius-small)
    }

    .arco-btn-group .arco-btn-size-small.arco-btn-shape-round:first-child {
        border-radius: 14px 0 0 14px
    }

    .arco-btn-group .arco-btn-size-small.arco-btn-shape-round:last-child {
        border-radius: 0 14px 14px 0
    }

    .arco-btn-group .arco-btn-size-small.arco-btn-shape-round:first-child:last-child {
        border-radius: 14px
    }

    .arco-btn-group .arco-btn-rtl.arco-btn-size-small:first-child {
        border-radius: 0 var(--border-radius-small)var(--border-radius-small)0
    }

    .arco-btn-group .arco-btn-rtl.arco-btn-size-small:last-child {
        border-radius: var(--border-radius-small)0 0 var(--border-radius-small)
    }

    .arco-btn-group .arco-btn-rtl.arco-btn-size-small:first-child:last-child {
        border-radius: var(--border-radius-small)
    }

    .arco-btn-group .arco-btn-rtl.arco-btn-size-small.arco-btn-shape-round:first-child {
        border-radius: 0 14px 14px 0
    }

    .arco-btn-group .arco-btn-rtl.arco-btn-size-small.arco-btn-shape-round:last-child {
        border-radius: 14px 0 0 14px
    }

    .arco-btn-group .arco-btn-rtl.arco-btn-size-small.arco-btn-shape-round:first-child:last-child {
        border-radius: 14px
    }

    .arco-btn-size-default {
        border-radius: var(--border-radius-small);
        height: 32px;
        padding: 0 15px;
        font-size: 14px
    }

    .arco-btn-size-default>svg+span,
    .arco-btn-size-default>span+svg {
        margin-left: 8px
    }

    .arco-btn-size-default svg {
        vertical-align: -2px
    }

    .arco-btn-size-default.arco-btn-rtl>svg+span,
    .arco-btn-size-default.arco-btn-rtl>span+svg {
        margin-left: 0;
        margin-right: 8px
    }

    .arco-btn-size-default.arco-btn-loading-fixed-width.arco-btn-loading {
        padding-left: 4px;
        padding-right: 4px
    }

    .arco-btn-size-default.arco-btn-icon-only {
        width: 32px;
        height: 32px;
        padding: 0
    }

    .arco-btn-size-default.arco-btn-shape-circle {
        text-align: center;
        border-radius: var(--border-radius-circle);
        width: 32px;
        height: 32px;
        padding: 0
    }

    .arco-btn-size-default.arco-btn-shape-round {
        border-radius: 16px
    }

    .arco-btn-group .arco-btn-size-default:first-child {
        border-radius: var(--border-radius-small)0 0 var(--border-radius-small)
    }

    .arco-btn-group .arco-btn-size-default:last-child {
        border-radius: 0 var(--border-radius-small)var(--border-radius-small)0
    }

    .arco-btn-group .arco-btn-size-default:first-child:last-child {
        border-radius: var(--border-radius-small)
    }

    .arco-btn-group .arco-btn-size-default.arco-btn-shape-round:first-child {
        border-radius: 16px 0 0 16px
    }

    .arco-btn-group .arco-btn-size-default.arco-btn-shape-round:last-child {
        border-radius: 0 16px 16px 0
    }

    .arco-btn-group .arco-btn-size-default.arco-btn-shape-round:first-child:last-child {
        border-radius: 16px
    }

    .arco-btn-group .arco-btn-rtl.arco-btn-size-default:first-child {
        border-radius: 0 var(--border-radius-small)var(--border-radius-small)0
    }

    .arco-btn-group .arco-btn-rtl.arco-btn-size-default:last-child {
        border-radius: var(--border-radius-small)0 0 var(--border-radius-small)
    }

    .arco-btn-group .arco-btn-rtl.arco-btn-size-default:first-child:last-child {
        border-radius: var(--border-radius-small)
    }

    .arco-btn-group .arco-btn-rtl.arco-btn-size-default.arco-btn-shape-round:first-child {
        border-radius: 0 16px 16px 0
    }

    .arco-btn-group .arco-btn-rtl.arco-btn-size-default.arco-btn-shape-round:last-child {
        border-radius: 16px 0 0 16px
    }

    .arco-btn-group .arco-btn-rtl.arco-btn-size-default.arco-btn-shape-round:first-child:last-child {
        border-radius: 16px
    }

    .arco-btn-size-large {
        border-radius: var(--border-radius-small);
        height: 36px;
        padding: 0 19px;
        font-size: 14px
    }

    .arco-btn-size-large>svg+span,
    .arco-btn-size-large>span+svg {
        margin-left: 8px
    }

    .arco-btn-size-large svg {
        vertical-align: -2px
    }

    .arco-btn-size-large.arco-btn-rtl>svg+span,
    .arco-btn-size-large.arco-btn-rtl>span+svg {
        margin-left: 0;
        margin-right: 8px
    }

    .arco-btn-size-large.arco-btn-loading-fixed-width.arco-btn-loading {
        padding-left: 8px;
        padding-right: 8px
    }

    .arco-btn-size-large.arco-btn-icon-only {
        width: 36px;
        height: 36px;
        padding: 0
    }

    .arco-btn-size-large.arco-btn-shape-circle {
        text-align: center;
        border-radius: var(--border-radius-circle);
        width: 36px;
        height: 36px;
        padding: 0
    }

    .arco-btn-size-large.arco-btn-shape-round {
        border-radius: 18px
    }

    .arco-btn-group .arco-btn-size-large:first-child {
        border-radius: var(--border-radius-small)0 0 var(--border-radius-small)
    }

    .arco-btn-group .arco-btn-size-large:last-child {
        border-radius: 0 var(--border-radius-small)var(--border-radius-small)0
    }

    .arco-btn-group .arco-btn-size-large:first-child:last-child {
        border-radius: var(--border-radius-small)
    }

    .arco-btn-group .arco-btn-size-large.arco-btn-shape-round:first-child {
        border-radius: 18px 0 0 18px
    }

    .arco-btn-group .arco-btn-size-large.arco-btn-shape-round:last-child {
        border-radius: 0 18px 18px 0
    }

    .arco-btn-group .arco-btn-size-large.arco-btn-shape-round:first-child:last-child {
        border-radius: 18px
    }

    .arco-btn-group .arco-btn-rtl.arco-btn-size-large:first-child {
        border-radius: 0 var(--border-radius-small)var(--border-radius-small)0
    }

    .arco-btn-group .arco-btn-rtl.arco-btn-size-large:last-child {
        border-radius: var(--border-radius-small)0 0 var(--border-radius-small)
    }

    .arco-btn-group .arco-btn-rtl.arco-btn-size-large:first-child:last-child {
        border-radius: var(--border-radius-small)
    }

    .arco-btn-group .arco-btn-rtl.arco-btn-size-large.arco-btn-shape-round:first-child {
        border-radius: 0 18px 18px 0
    }

    .arco-btn-group .arco-btn-rtl.arco-btn-size-large.arco-btn-shape-round:last-child {
        border-radius: 18px 0 0 18px
    }

    .arco-btn-group .arco-btn-rtl.arco-btn-size-large.arco-btn-shape-round:first-child:last-child {
        border-radius: 18px
    }

    .arco-btn-group {
        display: inline-block
    }

    .arco-btn-group .arco-btn-outline:not(:first-child),
    .arco-btn-group .arco-btn-dashed:not(:first-child) {
        margin-left: -1px
    }

    .arco-btn-group .arco-btn-primary:not(:last-child) {
        border-right: 1px solid rgb(var(--primary-5))
    }

    .arco-btn-group .arco-btn-secondary:not(:last-child) {
        border-right: 1px solid var(--color-secondary-hover)
    }

    .arco-btn-group .arco-btn-text:not(:last-child) {
        border-right: 1px solid transparent
    }

    .arco-btn-group .arco-btn-status-warning:not(:last-child) {
        border-right: 1px solid rgb(var(--warning-5))
    }

    .arco-btn-group .arco-btn-status-warning:not(:last-child).arco-btn-text {
        border-right: 1px solid var(--color-fill-2)
    }

    .arco-btn-group .arco-btn-status-danger:not(:last-child) {
        border-right: 1px solid rgb(var(--danger-5))
    }

    .arco-btn-group .arco-btn-status-danger:not(:last-child).arco-btn-text {
        border-right: 1px solid var(--color-fill-2)
    }

    .arco-btn-group .arco-btn-status-success:not(:last-child) {
        border-right: 1px solid rgb(var(--success-5))
    }

    .arco-btn-group .arco-btn-status-success:not(:last-child).arco-btn-text {
        border-right: 1px solid var(--color-fill-2)
    }

    .arco-btn-group .arco-btn-rtl.arco-btn-outline:not(:first-child),
    .arco-btn-group .arco-btn-rtl.arco-btn-dashed:not(:first-child) {
        margin-left: 0;
        margin-right: -1px
    }

    .arco-btn-group .arco-btn-rtl.arco-btn-primary:not(:last-child) {
        border-left: 1px solid rgb(var(--primary-5));
        border-right: 0
    }

    .arco-btn-group .arco-btn-rtl.arco-btn-secondary:not(:last-child) {
        border-left: 1px solid var(--color-secondary-hover);
        border-right: 0
    }

    .arco-btn-group .arco-btn-rtl.arco-btn-text:not(:last-child) {
        border-left: 1px solid transparent;
        border-right: 0
    }

    .arco-btn-group .arco-btn-rtl.arco-btn-status-warning:not(:last-child) {
        border-left: 1px solid rgb(var(--warning-5));
        border-right: 0
    }

    .arco-btn-group .arco-btn-rtl.arco-btn-status-warning:not(:last-child).arco-btn-text {
        border-left: 1px solid var(--color-fill-2)
    }

    .arco-btn-group .arco-btn-rtl.arco-btn-status-danger:not(:last-child) {
        border-left: 1px solid rgb(var(--danger-5));
        border-right: 0
    }

    .arco-btn-group .arco-btn-rtl.arco-btn-status-danger:not(:last-child).arco-btn-text {
        border-left: 1px solid var(--color-fill-2)
    }

    .arco-btn-group .arco-btn-rtl.arco-btn-status-success:not(:last-child) {
        border-left: 1px solid rgb(var(--success-5));
        border-right: 0
    }

    .arco-btn-group .arco-btn-rtl.arco-btn-status-success:not(:last-child).arco-btn-text {
        border-left: 1px solid var(--color-fill-2)
    }

    .arco-btn-group .arco-btn-outline:hover,
    .arco-btn-group .arco-btn-dashed:hover,
    .arco-btn-group .arco-btn-outline:active,
    .arco-btn-group .arco-btn-dashed:active {
        z-index: 2
    }

    .arco-btn-group .arco-btn:not(:first-child):not(:last-child) {
        border-radius: 0
    }

    .arco-btn-rtl {
        direction: rtl
    }

    body[arco-theme=dark] .arco-btn-primary.arco-btn-disabled {
        color: rgba(255, 255, 255, .3)
    }
}


@layer base {
    .arco-trigger {
        z-index: 1000;
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden;
        position: absolute
    }

    .arco-trigger-arrow {
        background-color: var(--color-bg-5);
        content: "";
        box-sizing: border-box;
        width: 8px;
        height: 8px;
        transform-origin: 50% 50% 0;
        z-index: -1;
        display: block;
        position: absolute;
        transform: rotate(45deg)
    }

    .arco-trigger[trigger-placement=top]>.arco-trigger-arrow-container .arco-trigger-arrow,
    .arco-trigger[trigger-placement=tl]>.arco-trigger-arrow-container .arco-trigger-arrow,
    .arco-trigger[trigger-placement=tr]>.arco-trigger-arrow-container .arco-trigger-arrow {
        border-top: none;
        border-left: none;
        border-bottom-right-radius: 2px;
        margin-left: -4px;
        bottom: -4px
    }

    .arco-trigger[trigger-placement=bottom]>.arco-trigger-arrow-container .arco-trigger-arrow,
    .arco-trigger[trigger-placement=bl]>.arco-trigger-arrow-container .arco-trigger-arrow,
    .arco-trigger[trigger-placement=br]>.arco-trigger-arrow-container .arco-trigger-arrow {
        border-bottom: none;
        border-right: none;
        border-top-left-radius: 2px;
        margin-left: -4px;
        top: -4px
    }

    .arco-trigger[trigger-placement=left]>.arco-trigger-arrow-container .arco-trigger-arrow,
    .arco-trigger[trigger-placement=lt]>.arco-trigger-arrow-container .arco-trigger-arrow,
    .arco-trigger[trigger-placement=lb]>.arco-trigger-arrow-container .arco-trigger-arrow {
        border-bottom: none;
        border-left: none;
        border-top-right-radius: 2px;
        margin-top: -4px;
        right: -4px
    }

    .arco-trigger[trigger-placement=right]>.arco-trigger-arrow-container .arco-trigger-arrow,
    .arco-trigger[trigger-placement=rt]>.arco-trigger-arrow-container .arco-trigger-arrow,
    .arco-trigger[trigger-placement=rb]>.arco-trigger-arrow-container .arco-trigger-arrow {
        border-top: none;
        border-right: none;
        border-bottom-left-radius: 2px;
        margin-top: -4px;
        left: -4px
    }

    .arco-trigger-rtl {
        direction: rtl
    }
}


@layer base {
    .arco-dropdown-menu {
        box-sizing: border-box;
        border: 1px solid var(--color-fill-3);
        border-radius: var(--border-radius-medium);
        background-color: var(--color-bg-popup);
        max-height: 200px;
        padding: 4px 0;
        position: relative;
        overflow: auto;
        box-shadow: 0 4px 10px rgba(0, 0, 0, .1)
    }

    .arco-dropdown-menu-hidden {
        display: none
    }

    .arco-dropdown-menu-item,
    .arco-dropdown-menu-pop-header {
        box-sizing: border-box;
        text-align: left;
        cursor: pointer;
        z-index: 1;
        white-space: nowrap;
        text-overflow: ellipsis;
        width: 100%;
        height: 36px;
        color: var(--color-text-1);
        background-color: transparent;
        padding: 0 12px;
        font-size: 14px;
        line-height: 36px;
        position: relative;
        overflow: hidden
    }

    .arco-dropdown-menu-item.arco-dropdown-menu-selected,
    .arco-dropdown-menu-pop-header.arco-dropdown-menu-selected {
        color: var(--color-text-1);
        background-color: transparent;
        font-weight: 500;
        transition: all .1s cubic-bezier(0, 0, 1, 1)
    }

    .arco-dropdown-menu-item:hover,
    .arco-dropdown-menu-pop-header:hover {
        color: var(--color-text-1);
        background-color: var(--color-fill-2)
    }

    .arco-dropdown-menu-item:focus-visible {
        box-shadow: 0 0 0 2px rgb(var(--primary-6))inset
    }

    .arco-dropdown-menu-pop-header:focus-visible {
        box-shadow: 0 0 0 2px rgb(var(--primary-6))inset
    }

    .arco-dropdown-menu-item.arco-dropdown-menu-active,
    .arco-dropdown-menu-pop-header.arco-dropdown-menu-active {
        box-shadow: 0 0 0 1px rgb(var(--primary-6))inset
    }

    .arco-dropdown-menu-item.arco-dropdown-menu-disabled,
    .arco-dropdown-menu-pop-header.arco-dropdown-menu-disabled {
        color: var(--color-text-4);
        cursor: not-allowed;
        background-color: transparent
    }

    .arco-dropdown-menu-item a,
    .arco-dropdown-menu-pop-header a,
    .arco-dropdown-menu-item a:hover,
    .arco-dropdown-menu-pop-header a:hover,
    .arco-dropdown-menu-item a:focus,
    .arco-dropdown-menu-pop-header a:focus,
    .arco-dropdown-menu-item a:active,
    .arco-dropdown-menu-pop-header a:active {
        color: inherit;
        cursor: inherit;
        text-decoration: none
    }

    .arco-dropdown-menu-item>a:only-child:before,
    .arco-dropdown-menu-pop-header>a:only-child:before {
        content: "";
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0
    }

    .arco-dropdown-menu-pop-header {
        justify-content: space-between;
        align-items: center;
        display: flex
    }

    .arco-dropdown-menu-pop-header .arco-dropdown-menu-icon-suffix {
        margin-left: 12px
    }

    .arco-dropdown-menu-group:first-child .arco-dropdown-menu-group-title {
        margin-top: 4px
    }

    .arco-dropdown-menu-group-title {
        box-sizing: border-box;
        width: 100%;
        color: var(--color-text-3);
        white-space: nowrap;
        text-overflow: ellipsis;
        margin-top: 8px;
        padding: 0 12px;
        font-size: 12px;
        line-height: 20px;
        overflow: hidden
    }

    .arco-dropdown-menu-dark {
        border-color: var(--color-menu-dark-bg);
        background-color: var(--color-menu-dark-bg)
    }

    .arco-dropdown-menu-dark .arco-dropdown-menu-item,
    .arco-dropdown-menu-dark .arco-dropdown-menu-pop-header {
        color: var(--color-text-4);
        background-color: transparent
    }

    .arco-dropdown-menu-dark .arco-dropdown-menu-item.arco-dropdown-menu-selected,
    .arco-dropdown-menu-dark .arco-dropdown-menu-pop-header.arco-dropdown-menu-selected {
        color: var(--color-white);
        background-color: transparent
    }

    .arco-dropdown-menu-dark .arco-dropdown-menu-item.arco-dropdown-menu-selected:hover,
    .arco-dropdown-menu-dark .arco-dropdown-menu-pop-header.arco-dropdown-menu-selected:hover {
        color: var(--color-white)
    }

    .arco-dropdown-menu-dark .arco-dropdown-menu-item:hover,
    .arco-dropdown-menu-dark .arco-dropdown-menu-pop-header:hover {
        color: var(--color-text-4);
        background-color: var(--color-menu-dark-hover)
    }

    .arco-dropdown-menu-dark .arco-dropdown-menu-item.arco-dropdown-menu-disabled,
    .arco-dropdown-menu-dark .arco-dropdown-menu-pop-header.arco-dropdown-menu-disabled {
        color: var(--color-text-2);
        background-color: transparent
    }

    .arco-dropdown-menu-dark .arco-dropdown-menu-group-title {
        color: var(--color-text-3)
    }

    .arco-dropdown-menu-pop-trigger .arco-trigger-arrow {
        display: none
    }

    .arco-dropdown-menu+.arco-trigger-arrow {
        background-color: var(--color-bg-popup)
    }

    .arco-dropdown-menu-rtl .arco-dropdown-menu-item,
    .arco-dropdown-menu-rtl .arco-dropdown-menu-pop-header {
        text-align: right
    }

    .arco-dropdown-menu-rtl .arco-dropdown-menu-item .arco-dropdown-menu-icon-suffix,
    .arco-dropdown-menu-rtl .arco-dropdown-menu-pop-header .arco-dropdown-menu-icon-suffix {
        margin-left: 0;
        margin-right: 12px
    }
}


@layer base {
    .arco-tooltip-content {
        background-color: var(--color-tooltip-bg);
        border-radius: var(--border-radius-small);
        color: #fff;
        padding: 8px 12px;
        font-size: 14px;
        line-height: 1.5715;
        box-shadow: 0 4px 10px rgba(0, 0, 0, .1)
    }

    .arco-tooltip-content-inner {
        word-wrap: break-word
    }

    .arco-tooltip-content-inner:not(:-webkit-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
        text-align: left
    }

    .arco-tooltip-content-inner:not(:-moz-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
        text-align: left
    }

    .arco-tooltip-content-inner:not(:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
        text-align: left
    }

    .arco-tooltip-content-inner:-webkit-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
        text-align: right
    }

    .arco-tooltip-content-inner:-moz-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
        text-align: right
    }

    .arco-tooltip-content-inner:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
        text-align: right
    }

    .arco-tooltip-mini {
        padding: 4px 12px;
        font-size: 14px
    }

    .arco-trigger-arrow.arco-tooltip-arrow {
        background-color: var(--color-tooltip-bg)
    }

    body[arco-theme=dark] .arco-tooltip-content {
        border: 1px solid var(--color-neutral-3)
    }

    body[arco-theme=dark] .arco-tooltip .arco-trigger-arrow.arco-tooltip-arrow {
        z-index: 1
    }

    body[arco-theme=dark] .arco-trigger[trigger-placement=top] .arco-trigger-arrow.arco-tooltip-arrow,
    body[arco-theme=dark] .arco-trigger[trigger-placement=tl] .arco-trigger-arrow.arco-tooltip-arrow,
    body[arco-theme=dark] .arco-trigger[trigger-placement=tr] .arco-trigger-arrow.arco-tooltip-arrow {
        border-bottom: 1px solid var(--color-neutral-3);
        border-right: 1px solid var(--color-neutral-3)
    }

    body[arco-theme=dark] .arco-trigger[trigger-placement=bottom] .arco-trigger-arrow.arco-tooltip-arrow,
    body[arco-theme=dark] .arco-trigger[trigger-placement=bl] .arco-trigger-arrow.arco-tooltip-arrow,
    body[arco-theme=dark] .arco-trigger[trigger-placement=br] .arco-trigger-arrow.arco-tooltip-arrow {
        border-top: 1px solid var(--color-neutral-3);
        border-left: 1px solid var(--color-neutral-3)
    }

    body[arco-theme=dark] .arco-trigger[trigger-placement=left] .arco-trigger-arrow.arco-tooltip-arrow,
    body[arco-theme=dark] .arco-trigger[trigger-placement=lt] .arco-trigger-arrow.arco-tooltip-arrow,
    body[arco-theme=dark] .arco-trigger[trigger-placement=lb] .arco-trigger-arrow.arco-tooltip-arrow {
        border-top: 1px solid var(--color-neutral-3);
        border-right: 1px solid var(--color-neutral-3)
    }

    body[arco-theme=dark] .arco-trigger[trigger-placement=right] .arco-trigger-arrow.arco-tooltip-arrow,
    body[arco-theme=dark] .arco-trigger[trigger-placement=rt] .arco-trigger-arrow.arco-tooltip-arrow,
    body[arco-theme=dark] .arco-trigger[trigger-placement=rb] .arco-trigger-arrow.arco-tooltip-arrow {
        border-left: 1px solid var(--color-neutral-3);
        border-bottom: 1px solid var(--color-neutral-3)
    }
}


@layer base {
    @keyframes arco-menu-selected-item-label-enter {
        0% {
            opacity: 0
        }

        to {
            opacity: 1
        }
    }

    .arco-menu {
        box-sizing: border-box;
        width: 100%;
        font-size: 14px;
        line-height: 1.5715;
        transition: width .2s cubic-bezier(.34, .69, .1, 1);
        position: relative
    }

    .arco-menu-indent {
        width: 20px;
        display: inline-block
    }

    .arco-menu .arco-menu-item,
    .arco-menu .arco-menu-group-title,
    .arco-menu .arco-menu-pop-header,
    .arco-menu .arco-menu-inline-header {
        border-radius: var(--border-radius-small);
        box-sizing: border-box;
        cursor: pointer;
        position: relative
    }

    .arco-menu .arco-menu-item.arco-menu-disabled,
    .arco-menu .arco-menu-group-title.arco-menu-disabled,
    .arco-menu .arco-menu-pop-header.arco-menu-disabled,
    .arco-menu .arco-menu-inline-header.arco-menu-disabled {
        cursor: not-allowed
    }

    .arco-menu .arco-menu-item.arco-menu-selected,
    .arco-menu .arco-menu-group-title.arco-menu-selected,
    .arco-menu .arco-menu-pop-header.arco-menu-selected,
    .arco-menu .arco-menu-inline-header.arco-menu-selected {
        font-weight: 500;
        transition: color .2s cubic-bezier(0, 0, 1, 1)
    }

    .arco-menu .arco-menu-item.arco-menu-selected svg,
    .arco-menu .arco-menu-group-title.arco-menu-selected svg,
    .arco-menu .arco-menu-pop-header.arco-menu-selected svg,
    .arco-menu .arco-menu-inline-header.arco-menu-selected svg {
        transition: color .2s cubic-bezier(0, 0, 1, 1)
    }

    .arco-menu .arco-menu-item .arco-icon,
    .arco-menu .arco-menu-group-title .arco-icon,
    .arco-menu .arco-menu-pop-header .arco-icon,
    .arco-menu .arco-menu-inline-header .arco-icon {
        margin-right: 16px
    }

    .arco-menu-light {
        background-color: var(--color-menu-light-bg)
    }

    .arco-menu-light .arco-menu-item,
    .arco-menu-light .arco-menu-group-title,
    .arco-menu-light .arco-menu-pop-header,
    .arco-menu-light .arco-menu-inline-header {
        background-color: var(--color-menu-light-bg);
        color: var(--color-text-2)
    }

    .arco-menu-light .arco-menu-item .arco-icon,
    .arco-menu-light .arco-menu-group-title .arco-icon,
    .arco-menu-light .arco-menu-pop-header .arco-icon,
    .arco-menu-light .arco-menu-inline-header .arco-icon {
        color: var(--color-text-3)
    }

    .arco-menu-light .arco-menu-item:hover,
    .arco-menu-light .arco-menu-group-title:hover,
    .arco-menu-light .arco-menu-pop-header:hover,
    .arco-menu-light .arco-menu-inline-header:hover {
        background-color: var(--color-fill-2);
        color: var(--color-text-2)
    }

    .arco-menu-light .arco-menu-item:hover .arco-icon,
    .arco-menu-light .arco-menu-group-title:hover .arco-icon,
    .arco-menu-light .arco-menu-pop-header:hover .arco-icon,
    .arco-menu-light .arco-menu-inline-header:hover .arco-icon {
        color: var(--color-text-3)
    }

    .arco-menu-light .arco-menu-item:focus-visible {
        box-shadow: 0 0 0 2px rgb(var(--primary-6))inset
    }

    .arco-menu-light .arco-menu-group-title:focus-visible {
        box-shadow: 0 0 0 2px rgb(var(--primary-6))inset
    }

    .arco-menu-light .arco-menu-pop-header:focus-visible {
        box-shadow: 0 0 0 2px rgb(var(--primary-6))inset
    }

    .arco-menu-light .arco-menu-inline-header:focus-visible {
        box-shadow: 0 0 0 2px rgb(var(--primary-6))inset
    }

    .arco-menu-light .arco-menu-item.arco-menu-selected,
    .arco-menu-light .arco-menu-group-title.arco-menu-selected,
    .arco-menu-light .arco-menu-pop-header.arco-menu-selected,
    .arco-menu-light .arco-menu-inline-header.arco-menu-selected,
    .arco-menu-light .arco-menu-item.arco-menu-selected .arco-icon,
    .arco-menu-light .arco-menu-group-title.arco-menu-selected .arco-icon,
    .arco-menu-light .arco-menu-pop-header.arco-menu-selected .arco-icon,
    .arco-menu-light .arco-menu-inline-header.arco-menu-selected .arco-icon {
        color: rgb(var(--primary-6))
    }

    .arco-menu-light .arco-menu-item.arco-menu-disabled,
    .arco-menu-light .arco-menu-group-title.arco-menu-disabled,
    .arco-menu-light .arco-menu-pop-header.arco-menu-disabled,
    .arco-menu-light .arco-menu-inline-header.arco-menu-disabled {
        background-color: var(--color-menu-light-bg);
        color: var(--color-text-4)
    }

    .arco-menu-light .arco-menu-item.arco-menu-disabled .arco-icon,
    .arco-menu-light .arco-menu-group-title.arco-menu-disabled .arco-icon,
    .arco-menu-light .arco-menu-pop-header.arco-menu-disabled .arco-icon,
    .arco-menu-light .arco-menu-inline-header.arco-menu-disabled .arco-icon {
        color: var(--color-text-4)
    }

    .arco-menu-light .arco-menu-item.arco-menu-selected {
        background-color: var(--color-fill-2)
    }

    .arco-menu-light .arco-menu-inline-header.arco-menu-selected,
    .arco-menu-light .arco-menu-inline-header.arco-menu-selected .arco-icon {
        color: rgb(var(--primary-6))
    }

    .arco-menu-light .arco-menu-inline-header.arco-menu-selected:hover {
        background-color: var(--color-fill-2)
    }

    .arco-menu-light.arco-menu-horizontal .arco-menu-item.arco-menu-selected,
    .arco-menu-light.arco-menu-horizontal .arco-menu-group-title.arco-menu-selected,
    .arco-menu-light.arco-menu-horizontal .arco-menu-pop-header.arco-menu-selected,
    .arco-menu-light.arco-menu-horizontal .arco-menu-inline-header.arco-menu-selected {
        background: 0 0;
        transition: color .2s cubic-bezier(0, 0, 1, 1)
    }

    .arco-menu-light.arco-menu-horizontal .arco-menu-item.arco-menu-selected:hover,
    .arco-menu-light.arco-menu-horizontal .arco-menu-group-title.arco-menu-selected:hover,
    .arco-menu-light.arco-menu-horizontal .arco-menu-pop-header.arco-menu-selected:hover,
    .arco-menu-light.arco-menu-horizontal .arco-menu-inline-header.arco-menu-selected:hover {
        background-color: var(--color-fill-2)
    }

    .arco-menu-light .arco-menu-group-title {
        color: var(--color-text-3);
        pointer-events: none
    }

    .arco-menu-light .arco-menu-collapse-button {
        background-color: var(--color-fill-1);
        color: var(--color-text-3)
    }

    .arco-menu-light .arco-menu-collapse-button:hover {
        background-color: var(--color-fill-3)
    }

    .arco-menu-light .arco-menu-collapse-button:focus-visible {
        box-shadow: 0 0 0 2px rgb(var(--primary-6))
    }

    .arco-menu-dark {
        background-color: var(--color-menu-dark-bg)
    }

    .arco-menu-dark .arco-menu-item,
    .arco-menu-dark .arco-menu-group-title,
    .arco-menu-dark .arco-menu-pop-header,
    .arco-menu-dark .arco-menu-inline-header {
        background-color: var(--color-menu-dark-bg);
        color: var(--color-text-4)
    }

    .arco-menu-dark .arco-menu-item .arco-icon,
    .arco-menu-dark .arco-menu-group-title .arco-icon,
    .arco-menu-dark .arco-menu-pop-header .arco-icon,
    .arco-menu-dark .arco-menu-inline-header .arco-icon {
        color: var(--color-text-3)
    }

    .arco-menu-dark .arco-menu-item:hover,
    .arco-menu-dark .arco-menu-group-title:hover,
    .arco-menu-dark .arco-menu-pop-header:hover,
    .arco-menu-dark .arco-menu-inline-header:hover {
        background-color: var(--color-menu-dark-hover);
        color: var(--color-text-4)
    }

    .arco-menu-dark .arco-menu-item:hover .arco-icon,
    .arco-menu-dark .arco-menu-group-title:hover .arco-icon,
    .arco-menu-dark .arco-menu-pop-header:hover .arco-icon,
    .arco-menu-dark .arco-menu-inline-header:hover .arco-icon {
        color: var(--color-text-3)
    }

    .arco-menu-dark .arco-menu-item:focus-visible {
        box-shadow: 0 0 0 2px rgb(var(--primary-6))inset
    }

    .arco-menu-dark .arco-menu-group-title:focus-visible {
        box-shadow: 0 0 0 2px rgb(var(--primary-6))inset
    }

    .arco-menu-dark .arco-menu-pop-header:focus-visible {
        box-shadow: 0 0 0 2px rgb(var(--primary-6))inset
    }

    .arco-menu-dark .arco-menu-inline-header:focus-visible {
        box-shadow: 0 0 0 2px rgb(var(--primary-6))inset
    }

    .arco-menu-dark .arco-menu-item.arco-menu-selected,
    .arco-menu-dark .arco-menu-group-title.arco-menu-selected,
    .arco-menu-dark .arco-menu-pop-header.arco-menu-selected,
    .arco-menu-dark .arco-menu-inline-header.arco-menu-selected,
    .arco-menu-dark .arco-menu-item.arco-menu-selected .arco-icon,
    .arco-menu-dark .arco-menu-group-title.arco-menu-selected .arco-icon,
    .arco-menu-dark .arco-menu-pop-header.arco-menu-selected .arco-icon,
    .arco-menu-dark .arco-menu-inline-header.arco-menu-selected .arco-icon {
        color: var(--color-white)
    }

    .arco-menu-dark .arco-menu-item.arco-menu-disabled,
    .arco-menu-dark .arco-menu-group-title.arco-menu-disabled,
    .arco-menu-dark .arco-menu-pop-header.arco-menu-disabled,
    .arco-menu-dark .arco-menu-inline-header.arco-menu-disabled {
        background-color: var(--color-menu-dark-bg);
        color: var(--color-text-2)
    }

    .arco-menu-dark .arco-menu-item.arco-menu-disabled .arco-icon,
    .arco-menu-dark .arco-menu-group-title.arco-menu-disabled .arco-icon,
    .arco-menu-dark .arco-menu-pop-header.arco-menu-disabled .arco-icon,
    .arco-menu-dark .arco-menu-inline-header.arco-menu-disabled .arco-icon {
        color: var(--color-text-2)
    }

    .arco-menu-dark .arco-menu-item.arco-menu-selected {
        background-color: var(--color-menu-dark-hover)
    }

    .arco-menu-dark .arco-menu-inline-header.arco-menu-selected,
    .arco-menu-dark .arco-menu-inline-header.arco-menu-selected .arco-icon {
        color: rgb(var(--primary-6))
    }

    .arco-menu-dark .arco-menu-inline-header.arco-menu-selected:hover {
        background-color: var(--color-menu-dark-hover)
    }

    .arco-menu-dark.arco-menu-horizontal .arco-menu-item.arco-menu-selected,
    .arco-menu-dark.arco-menu-horizontal .arco-menu-group-title.arco-menu-selected,
    .arco-menu-dark.arco-menu-horizontal .arco-menu-pop-header.arco-menu-selected,
    .arco-menu-dark.arco-menu-horizontal .arco-menu-inline-header.arco-menu-selected {
        background: 0 0;
        transition: color .2s cubic-bezier(0, 0, 1, 1)
    }

    .arco-menu-dark.arco-menu-horizontal .arco-menu-item.arco-menu-selected:hover,
    .arco-menu-dark.arco-menu-horizontal .arco-menu-group-title.arco-menu-selected:hover,
    .arco-menu-dark.arco-menu-horizontal .arco-menu-pop-header.arco-menu-selected:hover,
    .arco-menu-dark.arco-menu-horizontal .arco-menu-inline-header.arco-menu-selected:hover {
        background-color: var(--color-menu-dark-hover)
    }

    .arco-menu-dark .arco-menu-group-title {
        color: var(--color-text-3);
        pointer-events: none
    }

    .arco-menu-dark .arco-menu-collapse-button {
        background-color: rgb(var(--primary-6));
        color: var(--color-white)
    }

    .arco-menu-dark .arco-menu-collapse-button:hover {
        background-color: rgb(var(--primary-7))
    }

    .arco-menu-dark .arco-menu-collapse-button:focus-visible {
        box-shadow: 0 0 0 2px rgb(var(--primary-6))
    }

    .arco-menu a,
    .arco-menu a:hover,
    .arco-menu a:focus,
    .arco-menu a:active {
        color: inherit;
        cursor: inherit;
        text-decoration: none
    }

    .arco-menu-item-inner>a:only-child:before {
        content: "";
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0
    }

    .arco-menu-inner {
        box-sizing: border-box;
        width: 100%;
        height: 100%;
        overflow: auto
    }

    .arco-menu-vertical .arco-menu-item,
    .arco-menu-vertical .arco-menu-group-title,
    .arco-menu-vertical .arco-menu-pop-header,
    .arco-menu-vertical .arco-menu-inline-header {
        padding: 0 12px;
        line-height: 40px
    }

    .arco-menu-vertical .arco-menu-item .arco-menu-icon-suffix .arco-icon,
    .arco-menu-vertical .arco-menu-group-title .arco-menu-icon-suffix .arco-icon,
    .arco-menu-vertical .arco-menu-pop-header .arco-menu-icon-suffix .arco-icon,
    .arco-menu-vertical .arco-menu-inline-header .arco-menu-icon-suffix .arco-icon {
        margin-right: 0
    }

    .arco-menu-vertical .arco-menu-item,
    .arco-menu-vertical .arco-menu-group-title,
    .arco-menu-vertical .arco-menu-pop-header,
    .arco-menu-vertical .arco-menu-inline-header {
        white-space: nowrap;
        text-overflow: ellipsis;
        margin-bottom: 4px;
        overflow: hidden
    }

    .arco-menu-vertical .arco-menu-item .arco-menu-item-inner,
    .arco-menu-vertical .arco-menu-group-title .arco-menu-item-inner,
    .arco-menu-vertical .arco-menu-pop-header .arco-menu-item-inner,
    .arco-menu-vertical .arco-menu-inline-header .arco-menu-item-inner {
        white-space: nowrap;
        text-overflow: ellipsis;
        width: 100%;
        overflow: hidden
    }

    .arco-menu-vertical .arco-menu-item .arco-menu-icon-suffix,
    .arco-menu-vertical .arco-menu-group-title .arco-menu-icon-suffix,
    .arco-menu-vertical .arco-menu-pop-header .arco-menu-icon-suffix,
    .arco-menu-vertical .arco-menu-inline-header .arco-menu-icon-suffix {
        position: absolute;
        top: 50%;
        right: 12px;
        transform: translateY(-50%)
    }

    .arco-menu-vertical .arco-menu-item .arco-menu-icon-suffix.is-open,
    .arco-menu-vertical .arco-menu-group-title .arco-menu-icon-suffix.is-open,
    .arco-menu-vertical .arco-menu-pop-header .arco-menu-icon-suffix.is-open,
    .arco-menu-vertical .arco-menu-inline-header .arco-menu-icon-suffix.is-open {
        transform: translateY(-50%)rotate(180deg)
    }

    .arco-menu-vertical .arco-menu-inner {
        padding: 4px 8px
    }

    .arco-menu-vertical .arco-menu-item.arco-menu-item-indented {
        display: flex
    }

    .arco-menu-vertical .arco-menu-pop-header,
    .arco-menu-vertical .arco-menu-inline-header {
        padding-right: 28px
    }

    .arco-menu-horizontal {
        width: auto;
        height: auto
    }

    .arco-menu-horizontal .arco-menu-item,
    .arco-menu-horizontal .arco-menu-group-title,
    .arco-menu-horizontal .arco-menu-pop-header,
    .arco-menu-horizontal .arco-menu-inline-header {
        padding: 0 12px;
        line-height: 30px
    }

    .arco-menu-horizontal .arco-menu-item .arco-menu-icon-suffix .arco-icon,
    .arco-menu-horizontal .arco-menu-group-title .arco-menu-icon-suffix .arco-icon,
    .arco-menu-horizontal .arco-menu-pop-header .arco-menu-icon-suffix .arco-icon,
    .arco-menu-horizontal .arco-menu-inline-header .arco-menu-icon-suffix .arco-icon {
        margin-right: 0
    }

    .arco-menu-horizontal .arco-menu-item .arco-icon,
    .arco-menu-horizontal .arco-menu-group-title .arco-icon,
    .arco-menu-horizontal .arco-menu-pop-header .arco-icon,
    .arco-menu-horizontal .arco-menu-inline-header .arco-icon {
        margin-right: 8px
    }

    .arco-menu-horizontal .arco-menu-item .arco-menu-icon-suffix,
    .arco-menu-horizontal .arco-menu-group-title .arco-menu-icon-suffix,
    .arco-menu-horizontal .arco-menu-pop-header .arco-menu-icon-suffix,
    .arco-menu-horizontal .arco-menu-inline-header .arco-menu-icon-suffix {
        margin-left: 6px
    }

    .arco-menu-horizontal .arco-menu-inner {
        align-items: center;
        padding: 14px 20px;
        display: flex
    }

    .arco-menu-horizontal .arco-menu-item,
    .arco-menu-horizontal .arco-menu-pop {
        vertical-align: middle;
        flex-shrink: 0;
        display: inline-block
    }

    .arco-menu-horizontal .arco-menu-item:not(:first-child),
    .arco-menu-horizontal .arco-menu-pop:not(:first-child) {
        margin-left: 12px
    }

    .arco-menu-horizontal .arco-menu-pop:after {
        content: " ";
        width: 100%;
        height: 14px;
        position: absolute;
        bottom: -14px;
        left: 0
    }

    .arco-menu-overflow-wrap {
        width: 100%
    }

    .arco-menu-overflow-sub-menu-mirror {
        margin-left: 12px
    }

    .arco-menu-overflow-sub-menu-mirror,
    .arco-menu-overflow-hidden-menu-item {
        white-space: nowrap;
        visibility: hidden;
        pointer-events: none;
        position: absolute !important
    }

    .arco-menu-selected-label {
        background-color: rgb(var(--primary-6));
        height: 3px;
        animation: .2s cubic-bezier(0, 0, 1, 1) arco-menu-selected-item-label-enter;
        position: absolute;
        bottom: -14px;
        left: 12px;
        right: 12px
    }

    .arco-menu-pop-button {
        width: auto;
        box-shadow: none;
        background: 0 0
    }

    .arco-menu-pop-button.arco-menu-collapse {
        width: auto
    }

    .arco-menu-pop-button .arco-menu-item,
    .arco-menu-pop-button .arco-menu-group-title,
    .arco-menu-pop-button .arco-menu-pop-header,
    .arco-menu-pop-button .arco-menu-inline-header {
        border: 1px solid transparent;
        border-radius: 50%;
        width: 40px;
        height: 40px;
        margin-bottom: 16px;
        line-height: 40px;
        box-shadow: 0 4px 10px rgba(0, 0, 0, .1)
    }

    .arco-menu-collapse {
        width: 48px
    }

    .arco-menu-collapse .arco-menu-inner {
        padding: 4px
    }

    .arco-menu-collapse .arco-menu-group-title,
    .arco-menu-collapse .arco-menu-icon-suffix {
        display: none
    }

    .arco-menu-collapse .arco-menu-item .arco-icon,
    .arco-menu-collapse .arco-menu-group-title .arco-icon,
    .arco-menu-collapse .arco-menu-pop-header .arco-icon,
    .arco-menu-collapse .arco-menu-inline-header .arco-icon {
        margin-left: 1px;
        margin-right: 100vw
    }

    .arco-menu-collapse .arco-menu-collapse-button {
        right: unset;
        left: 50%;
        transform: translate(-50%)
    }

    .arco-menu-collapse-button {
        border-radius: var(--border-radius-small);
        cursor: pointer;
        justify-content: center;
        align-items: center;
        width: 24px;
        height: 24px;
        display: flex;
        position: absolute;
        bottom: 12px;
        right: 12px
    }

    .arco-menu-inline-content {
        height: auto;
        transition: height .2s cubic-bezier(.34, .69, .1, 1);
        overflow: hidden
    }

    .arco-menu-item-tooltip a {
        color: inherit;
        cursor: pointer;
        text-decoration: none
    }

    .arco-menu-item-tooltip a:hover,
    .arco-menu-item-tooltip a:focus,
    .arco-menu-item-tooltip a:active {
        color: inherit
    }

    .arco-menu-item-tooltip a:before {
        content: "";
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0
    }

    .arco-menu-pop-trigger.arco-trigger-position-bl {
        transform: translateY(14px)
    }

    .arco-menu-pop-trigger.arco-trigger-position-bl .arco-trigger-arrow {
        z-index: 0;
        border-left: 1px solid var(--color-neutral-3);
        border-top: 1px solid var(--color-neutral-3)
    }

    .arco-menu-pop-trigger.arco-trigger[trigger-placement=rt] {
        transform: translate(8px)
    }

    .arco-menu-pop-trigger.arco-trigger[trigger-placement=rt] .arco-trigger-arrow {
        z-index: 0;
        border-left: 1px solid var(--color-neutral-3);
        border-bottom: 1px solid var(--color-neutral-3)
    }

    .arco-menu-pop-trigger.arco-trigger[trigger-placement=lt] {
        transform: translate(-8px)
    }

    .arco-menu-pop-trigger.arco-trigger[trigger-placement=lt] .arco-trigger-arrow {
        z-index: 0;
        border-right: 1px solid var(--color-neutral-3);
        border-top: 1px solid var(--color-neutral-3)
    }

    .arco-menu-pop-trigger .arco-dropdown-menu-dark~.arco-trigger-arrow-container .arco-trigger-arrow {
        background-color: var(--color-menu-dark-bg);
        border-color: var(--color-menu-dark-bg)
    }

    .arco-menu-rtl {
        direction: rtl
    }

    .arco-menu-rtl .arco-menu-item .arco-icon,
    .arco-menu-rtl .arco-menu-group-title .arco-icon,
    .arco-menu-rtl .arco-menu-pop-header .arco-icon,
    .arco-menu-rtl .arco-menu-inline-header .arco-icon {
        margin-left: 16px;
        margin-right: 0
    }

    .arco-menu-rtl.arco-menu-horizontal .arco-menu-item .arco-menu-icon-suffix .arco-icon,
    .arco-menu-rtl.arco-menu-horizontal .arco-menu-group-title .arco-menu-icon-suffix .arco-icon,
    .arco-menu-rtl.arco-menu-horizontal .arco-menu-pop-header .arco-menu-icon-suffix .arco-icon,
    .arco-menu-rtl.arco-menu-horizontal .arco-menu-inline-header .arco-menu-icon-suffix .arco-icon {
        margin-left: 0
    }

    .arco-menu-rtl.arco-menu-horizontal .arco-menu-item .arco-icon,
    .arco-menu-rtl.arco-menu-horizontal .arco-menu-group-title .arco-icon,
    .arco-menu-rtl.arco-menu-horizontal .arco-menu-pop-header .arco-icon,
    .arco-menu-rtl.arco-menu-horizontal .arco-menu-inline-header .arco-icon {
        margin-left: 8px;
        margin-right: 0
    }

    .arco-menu-rtl.arco-menu-horizontal .arco-menu-item .arco-menu-icon-suffix,
    .arco-menu-rtl.arco-menu-horizontal .arco-menu-group-title .arco-menu-icon-suffix,
    .arco-menu-rtl.arco-menu-horizontal .arco-menu-pop-header .arco-menu-icon-suffix,
    .arco-menu-rtl.arco-menu-horizontal .arco-menu-inline-header .arco-menu-icon-suffix {
        margin-left: 0;
        margin-right: 6px
    }

    .arco-menu-rtl.arco-menu-horizontal .arco-menu-item:not(:first-child),
    .arco-menu-rtl.arco-menu-horizontal .arco-menu-pop:not(:first-child) {
        margin-left: 0;
        margin-right: 12px
    }

    .arco-menu-rtl.arco-menu-vertical .arco-menu-item .arco-menu-icon-suffix .arco-icon,
    .arco-menu-rtl.arco-menu-vertical .arco-menu-group-title .arco-menu-icon-suffix .arco-icon,
    .arco-menu-rtl.arco-menu-vertical .arco-menu-pop-header .arco-menu-icon-suffix .arco-icon,
    .arco-menu-rtl.arco-menu-vertical .arco-menu-inline-header .arco-menu-icon-suffix .arco-icon {
        margin-left: 0
    }

    .arco-menu-rtl.arco-menu-vertical .arco-menu-item,
    .arco-menu-rtl.arco-menu-vertical .arco-menu-group-title,
    .arco-menu-rtl.arco-menu-vertical .arco-menu-pop-header,
    .arco-menu-rtl.arco-menu-vertical .arco-menu-inline-header,
    .arco-menu-rtl.arco-menu-vertical .arco-menu-item .arco-menu-item-inner,
    .arco-menu-rtl.arco-menu-vertical .arco-menu-group-title .arco-menu-item-inner,
    .arco-menu-rtl.arco-menu-vertical .arco-menu-pop-header .arco-menu-item-inner,
    .arco-menu-rtl.arco-menu-vertical .arco-menu-inline-header .arco-menu-item-inner {
        text-overflow: clip
    }

    .arco-menu-rtl.arco-menu-vertical .arco-menu-item .arco-menu-icon-suffix,
    .arco-menu-rtl.arco-menu-vertical .arco-menu-group-title .arco-menu-icon-suffix,
    .arco-menu-rtl.arco-menu-vertical .arco-menu-pop-header .arco-menu-icon-suffix,
    .arco-menu-rtl.arco-menu-vertical .arco-menu-inline-header .arco-menu-icon-suffix {
        right: initial;
        left: 12px
    }

    .arco-menu-rtl.arco-menu-vertical .arco-menu-pop-header,
    .arco-menu-rtl.arco-menu-vertical .arco-menu-inline-header {
        padding-left: 28px;
        padding-right: 12px
    }

    .arco-menu-rtl .arco-menu-pop:after {
        right: 0;
        left: initial
    }

    .arco-menu-rtl .arco-menu-collapse .arco-menu-item .arco-icon,
    .arco-menu-rtl .arco-menu-collapse .arco-menu-group-title .arco-icon,
    .arco-menu-rtl .arco-menu-collapse .arco-menu-pop-header .arco-icon,
    .arco-menu-rtl .arco-menu-collapse .arco-menu-inline-header .arco-icon {
        margin-left: 100vw;
        margin-right: 1px
    }

    .arco-menu-rtl .arco-menu-pop-trigger.arco-trigger-position-bl .arco-trigger-arrow {
        border-left: none;
        border-right: 1px solid var(--color-neutral-3)
    }

    .arco-menu-rtl .arco-menu-pop-trigger.arco-trigger[trigger-placement=rt] {
        transform: translate(-8px)
    }

    .arco-menu-rtl .arco-menu-pop-trigger.arco-trigger[trigger-placement=lt] {
        transform: translate(8px)
    }

    .arco-menu-rtl .arco-menu-pop-trigger.arco-trigger[trigger-placement=lt] .arco-trigger-arrow {
        border-right: none;
        border-left: 1px solid var(--color-neutral-3)
    }
}


@layer base {
    .arco-input {
        -webkit-appearance: none;
        -moz-appearance: none;
        -ms-appearance: none;
        appearance: none;
        -webkit-tap-highlight-color: transparent;
        border-radius: var(--border-radius-small);
        width: 100%;
        color: var(--color-text-1);
        box-sizing: border-box;
        background-color: var(--color-fill-2);
        border: 1px solid transparent;
        outline: none;
        padding: 4px 12px;
        font-size: 14px;
        line-height: 1.5715;
        transition: color .1s cubic-bezier(0, 0, 1, 1), border-color .1s cubic-bezier(0, 0, 1, 1), background-color .1s cubic-bezier(0, 0, 1, 1)
    }

    .arco-input::placeholder {
        color: var(--color-text-3)
    }

    .arco-input::placeholder {
        color: var(--color-text-3)
    }

    .arco-input::placeholder {
        color: var(--color-text-3)
    }

    .arco-input:hover {
        background-color: var(--color-fill-3);
        border-color: transparent
    }

    .arco-input:focus,
    .arco-input.arco-input-focus {
        border-color: rgb(var(--primary-6));
        background-color: var(--color-bg-2);
        box-shadow: 0 0 0 0 var(--color-primary-light-2)
    }

    .arco-input-error {
        background-color: var(--color-danger-light-1);
        border-color: transparent
    }

    .arco-input-error:hover {
        background-color: var(--color-danger-light-2);
        border-color: transparent
    }

    .arco-input-error .arco-input,
    .arco-input-error .arco-input:hover {
        box-shadow: none;
        background: 0 0
    }

    .arco-input-error.arco-input-focus,
    .arco-input-error.arco-input-focus:hover,
    .arco-input-error:focus,
    .arco-input-error:focus:hover {
        border-color: rgb(var(--danger-6));
        background-color: var(--color-bg-2);
        box-shadow: 0 0 0 0 var(--color-danger-light-2)
    }

    .arco-input-warning {
        background-color: var(--color-warning-light-1);
        border-color: transparent
    }

    .arco-input-warning:hover {
        background-color: var(--color-warning-light-2);
        border-color: transparent
    }

    .arco-input-warning .arco-input,
    .arco-input-warning .arco-input:hover {
        box-shadow: none;
        background: 0 0
    }

    .arco-input-warning.arco-input-focus,
    .arco-input-warning.arco-input-focus:hover,
    .arco-input-warning:focus,
    .arco-input-warning:focus:hover {
        border-color: rgb(var(--warning-6));
        background-color: var(--color-bg-2);
        box-shadow: 0 0 0 0 var(--color-warning-light-2)
    }

    .arco-input-autowidth {
        text-overflow: ellipsis;
        flex: 1;
        overflow: hidden
    }

    .arco-input-autowidth:hover {
        text-overflow: unset
    }

    .arco-input-disabled {
        background-color: var(--color-fill-2);
        cursor: not-allowed;
        color: var(--color-text-4);
        -webkit-text-fill-color: var(--color-text-4);
        border-color: transparent
    }

    .arco-input-disabled:hover {
        background-color: var(--color-fill-2);
        color: var(--color-text-4);
        border-color: transparent
    }

    .arco-input-disabled::placeholder {
        color: var(--color-text-4)
    }

    .arco-input-disabled::placeholder {
        color: var(--color-text-4)
    }

    .arco-input-disabled::placeholder {
        color: var(--color-text-4)
    }

    .arco-input input:disabled {
        color: var(--color-text-4);
        opacity: 1;
        -webkit-text-fill-color: var(--color-text-4)
    }

    .arco-input-word-limit {
        color: var(--color-text-3);
        padding-left: 8px;
        font-size: 12px
    }

    .arco-input-word-limit-error {
        color: rgb(var(--danger-6))
    }

    .arco-input-size-mini {
        padding-top: 1px;
        padding-bottom: 1px;
        font-size: 12px;
        line-height: 1.667
    }

    .arco-input-size-small {
        padding-top: 2px;
        padding-bottom: 2px;
        font-size: 14px
    }

    .arco-input-size-large {
        padding-top: 6px;
        padding-bottom: 6px;
        font-size: 14px
    }

    .arco-input-group-wrapper-mini .arco-input-group-addbefore,
    .arco-input-group-wrapper-mini .arco-input-group-addafter,
    .arco-input-inner-wrapper.arco-input-inner-wrapper-mini,
    .arco-input-size-mini {
        padding-left: 8px;
        padding-right: 8px
    }

    .arco-input-group-wrapper-small .arco-input-group-addbefore,
    .arco-input-group-wrapper-small .arco-input-group-addafter,
    .arco-input-inner-wrapper.arco-input-inner-wrapper-small,
    .arco-input-size-small {
        padding-left: 12px;
        padding-right: 12px
    }

    .arco-input-group-wrapper-large .arco-input-group-addbefore,
    .arco-input-group-wrapper-large .arco-input-group-addafter,
    .arco-input-inner-wrapper.arco-input-inner-wrapper-large,
    .arco-input-size-large {
        padding-left: 16px;
        padding-right: 16px
    }

    .arco-input-clear-icon {
        cursor: pointer;
        color: var(--color-text-2);
        font-size: 12px
    }

    .arco-input-clear-icon:focus-visible:before {
        box-shadow: 0 0 0 2px rgb(var(--primary-6))
    }

    .arco-input-clear-icon>svg {
        transition: color .1s cubic-bezier(0, 0, 1, 1);
        position: relative
    }

    .arco-input-inner-wrapper {
        -webkit-appearance: none;
        -moz-appearance: none;
        -ms-appearance: none;
        appearance: none;
        -webkit-tap-highlight-color: transparent;
        border-radius: var(--border-radius-small);
        color: var(--color-text-1);
        box-sizing: border-box;
        background-color: var(--color-fill-2);
        border: 1px solid transparent;
        outline: none;
        align-items: center;
        width: 100%;
        padding-left: 12px;
        padding-right: 12px;
        font-size: 14px;
        transition: color .1s cubic-bezier(0, 0, 1, 1), border-color .1s cubic-bezier(0, 0, 1, 1), background-color .1s cubic-bezier(0, 0, 1, 1);
        display: inline-flex;
        position: relative
    }

    .arco-input-inner-wrapper::placeholder {
        color: var(--color-text-3)
    }

    .arco-input-inner-wrapper::placeholder {
        color: var(--color-text-3)
    }

    .arco-input-inner-wrapper::placeholder {
        color: var(--color-text-3)
    }

    .arco-input-inner-wrapper:hover {
        background-color: var(--color-fill-3);
        border-color: transparent
    }

    .arco-input-inner-wrapper:focus,
    .arco-input-inner-wrapper.arco-input-inner-wrapper-focus {
        border-color: rgb(var(--primary-6));
        background-color: var(--color-bg-2);
        box-shadow: 0 0 0 0 var(--color-primary-light-2)
    }

    .arco-input-inner-wrapper-error {
        background-color: var(--color-danger-light-1);
        border-color: transparent
    }

    .arco-input-inner-wrapper-error:hover {
        background-color: var(--color-danger-light-2);
        border-color: transparent
    }

    .arco-input-inner-wrapper-error .arco-input,
    .arco-input-inner-wrapper-error .arco-input:hover {
        box-shadow: none;
        background: 0 0
    }

    .arco-input-inner-wrapper-error.arco-input-inner-wrapper-focus,
    .arco-input-inner-wrapper-error.arco-input-inner-wrapper-focus:hover,
    .arco-input-inner-wrapper-error:focus,
    .arco-input-inner-wrapper-error:focus:hover {
        border-color: rgb(var(--danger-6));
        background-color: var(--color-bg-2);
        box-shadow: 0 0 0 0 var(--color-danger-light-2)
    }

    .arco-input-inner-wrapper-warning {
        background-color: var(--color-warning-light-1);
        border-color: transparent
    }

    .arco-input-inner-wrapper-warning:hover {
        background-color: var(--color-warning-light-2);
        border-color: transparent
    }

    .arco-input-inner-wrapper-warning .arco-input,
    .arco-input-inner-wrapper-warning .arco-input:hover {
        box-shadow: none;
        background: 0 0
    }

    .arco-input-inner-wrapper-warning.arco-input-inner-wrapper-focus,
    .arco-input-inner-wrapper-warning.arco-input-inner-wrapper-focus:hover,
    .arco-input-inner-wrapper-warning:focus,
    .arco-input-inner-wrapper-warning:focus:hover {
        border-color: rgb(var(--warning-6));
        background-color: var(--color-bg-2);
        box-shadow: 0 0 0 0 var(--color-warning-light-2)
    }

    .arco-input-inner-wrapper .arco-input {
        background: 0 0;
        border: none;
        border-radius: 0;
        padding-left: 0;
        padding-right: 0
    }

    .arco-input-inner-wrapper .arco-input:hover,
    .arco-input-inner-wrapper .arco-input:focus {
        box-shadow: none;
        background: 0 0
    }

    .arco-input-inner-wrapper-has-prefix>.arco-input-clear-wrapper .arco-input,
    .arco-input-inner-wrapper-has-prefix>.arco-input {
        padding-left: 12px
    }

    .arco-input-inner-wrapper .arco-input-group-prefix,
    .arco-input-inner-wrapper .arco-input-group-suffix {
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        white-space: nowrap;
        align-items: center;
        height: 100%;
        display: inline-flex
    }

    .arco-input-inner-wrapper .arco-input-group-prefix>svg,
    .arco-input-inner-wrapper .arco-input-group-suffix>svg {
        font-size: 14px
    }

    .arco-input-inner-wrapper .arco-input-group-prefix,
    .arco-input-inner-wrapper .arco-input-group-suffix {
        color: var(--color-text-2)
    }

    .arco-input-inner-wrapper-disabled {
        background-color: var(--color-fill-2);
        cursor: not-allowed;
        color: var(--color-text-4);
        -webkit-text-fill-color: var(--color-text-4);
        border-color: transparent
    }

    .arco-input-inner-wrapper-disabled:hover {
        background-color: var(--color-fill-2);
        color: var(--color-text-4);
        border-color: transparent
    }

    .arco-input-inner-wrapper-disabled::placeholder {
        color: var(--color-text-4)
    }

    .arco-input-inner-wrapper-disabled::placeholder {
        color: var(--color-text-4)
    }

    .arco-input-inner-wrapper-disabled::placeholder {
        color: var(--color-text-4)
    }

    .arco-input-inner-wrapper-disabled .arco-input-group-prefix,
    .arco-input-inner-wrapper-disabled .arco-input-group-suffix {
        color: inherit
    }

    .arco-input-inner-wrapper .arco-input-clear-icon {
        visibility: hidden
    }

    .arco-input-inner-wrapper:hover .arco-input-clear-icon {
        visibility: visible
    }

    .arco-input-inner-wrapper:hover .arco-input-clear-icon~.arco-input-group-suffix {
        margin-left: 4px
    }

    .arco-input-inner-wrapper:not(.arco-input-inner-wrapper-focus) .arco-input-clear-icon:hover:before {
        background-color: var(--color-fill-4)
    }

    .arco-input-group-wrapper-autowidth .arco-input-group {
        align-items: stretch;
        display: flex
    }

    .arco-input-group-wrapper-autowidth .arco-input-group-addbefore,
    .arco-input-group-wrapper-autowidth .arco-input-group-after {
        height: unset;
        flex-grow: 0;
        flex-shrink: 0;
        align-items: center;
        width: auto;
        display: inline-flex
    }

    .arco-input-group-wrapper-autowidth .arco-input-inner-wrapper {
        overflow: hidden
    }

    .arco-input-group-wrapper-autowidth .arco-input {
        text-overflow: ellipsis;
        flex: 1;
        overflow: hidden
    }

    .arco-input-group-wrapper-autowidth .arco-input:hover {
        text-overflow: unset
    }

    .arco-input-group {
        width: 100%;
        height: 100%;
        line-height: 0;
        display: table
    }

    .arco-input-group>.arco-input-inner-wrapper,
    .arco-input-group>.arco-input {
        border-radius: 0
    }

    .arco-input-group>.arco-input-inner-wrapper-focus,
    .arco-input-group>.arco-input-focus {
        border-radius: var(--border-radius-small)
    }

    .arco-input-group>:first-child {
        border-top-left-radius: var(--border-radius-small);
        border-bottom-left-radius: var(--border-radius-small)
    }

    .arco-input-group>:last-child {
        border-top-right-radius: var(--border-radius-small);
        border-bottom-right-radius: var(--border-radius-small)
    }

    .arco-input-group-addbefore,
    .arco-input-group-addafter {
        white-space: nowrap;
        vertical-align: middle;
        box-sizing: border-box;
        width: 1px;
        height: 100%;
        color: var(--color-text-1);
        background-color: var(--color-fill-2);
        border: 1px solid transparent;
        padding: 0 12px;
        display: table-cell
    }

    .arco-input-group-addbefore>svg,
    .arco-input-group-addafter>svg {
        font-size: 14px
    }

    .arco-input-group-addafter {
        border-left: 1px solid var(--color-neutral-3)
    }

    .arco-input-group-addafter .item-style {
        width: auto;
        height: 100%;
        margin: -1px -13px -1px -12px
    }

    .arco-input-group-addafter .arco-input {
        border-color: transparent;
        border-top-left-radius: 0;
        border-bottom-left-radius: 0;
        width: auto;
        height: 100%;
        margin: -1px -13px -1px -12px
    }

    .arco-input-group-addafter .arco-select {
        width: auto;
        height: 100%;
        margin: -1px -13px -1px -12px
    }

    .arco-input-group-addafter .arco-select .arco-select-view {
        background-color: inherit;
        border-color: transparent;
        border-radius: 0
    }

    .arco-input-group-addafter .arco-select.arco-select-single .arco-select-view {
        height: 100%
    }

    .arco-input-group-addbefore {
        border-right: 1px solid var(--color-neutral-3)
    }

    .arco-input-group-addbefore .item-style {
        width: auto;
        height: 100%;
        margin: -1px -12px -1px -13px
    }

    .arco-input-group-addbefore .arco-input {
        border-color: transparent;
        border-top-right-radius: 0;
        border-bottom-right-radius: 0;
        width: auto;
        height: 100%;
        margin: -1px -12px -1px -13px
    }

    .arco-input-group-addbefore .arco-select {
        width: auto;
        height: 100%;
        margin: -1px -12px -1px -13px
    }

    .arco-input-group-addbefore .arco-select .arco-select-view {
        background-color: inherit;
        border-color: transparent;
        border-radius: 0
    }

    .arco-input-group-addbefore .arco-select.arco-select-single .arco-select-view {
        height: 100%
    }

    .arco-input-group-wrapper {
        vertical-align: top;
        width: 100%;
        display: inline-block
    }

    .arco-input-group-wrapper.arco-input-group-wrapper-mini .arco-input-group,
    .arco-input-group-wrapper.arco-input-group-wrapper-mini .arco-input-inner-wrapper .arco-input-group-prefix,
    .arco-input-group-wrapper.arco-input-group-wrapper-mini .arco-input-inner-wrapper .arco-input-group-suffix,
    .arco-input-group-wrapper.arco-input-group-wrapper-mini .arco-input-inner-wrapper .arco-input-group-prefix>svg,
    .arco-input-group-wrapper.arco-input-group-wrapper-mini .arco-input-inner-wrapper .arco-input-group-suffix>svg {
        font-size: 12px
    }

    .arco-input-group-wrapper.arco-input-group-wrapper-mini .arco-input-group-addbefore,
    .arco-input-group-wrapper.arco-input-group-wrapper-mini .arco-input-group-addafter {
        height: 22px;
        font-size: 12px
    }

    .arco-input-group-wrapper.arco-input-group-wrapper-mini .arco-input-group-addbefore>svg,
    .arco-input-group-wrapper.arco-input-group-wrapper-mini .arco-input-group-addafter>svg {
        font-size: 12px
    }

    .arco-input-group-wrapper.arco-input-group-wrapper-mini .arco-input-group-addafter .item-style {
        width: auto;
        height: 100%;
        margin: -1px -13px -1px -12px
    }

    .arco-input-group-wrapper.arco-input-group-wrapper-mini .arco-input-group-addafter .arco-input {
        border-color: transparent;
        border-top-left-radius: 0;
        border-bottom-left-radius: 0;
        width: auto;
        height: 100%;
        margin: -1px -13px -1px -12px
    }

    .arco-input-group-wrapper.arco-input-group-wrapper-mini .arco-input-group-addafter .arco-select {
        width: auto;
        height: 100%;
        margin: -1px -13px -1px -12px
    }

    .arco-input-group-wrapper.arco-input-group-wrapper-mini .arco-input-group-addafter .arco-select .arco-select-view {
        background-color: inherit;
        border-color: transparent;
        border-radius: 0
    }

    .arco-input-group-wrapper.arco-input-group-wrapper-mini .arco-input-group-addafter .arco-select.arco-select-single .arco-select-view {
        height: 100%
    }

    .arco-input-group-wrapper.arco-input-group-wrapper-mini .arco-input-group-addbefore .item-style {
        width: auto;
        height: 100%;
        margin: -1px -12px -1px -13px
    }

    .arco-input-group-wrapper.arco-input-group-wrapper-mini .arco-input-group-addbefore .arco-input {
        border-color: transparent;
        border-top-right-radius: 0;
        border-bottom-right-radius: 0;
        width: auto;
        height: 100%;
        margin: -1px -12px -1px -13px
    }

    .arco-input-group-wrapper.arco-input-group-wrapper-mini .arco-input-group-addbefore .arco-select {
        width: auto;
        height: 100%;
        margin: -1px -12px -1px -13px
    }

    .arco-input-group-wrapper.arco-input-group-wrapper-mini .arco-input-group-addbefore .arco-select .arco-select-view {
        background-color: inherit;
        border-color: transparent;
        border-radius: 0
    }

    .arco-input-group-wrapper.arco-input-group-wrapper-mini .arco-input-group-addbefore .arco-select.arco-select-single .arco-select-view {
        height: 100%
    }

    .arco-input-group-wrapper.arco-input-group-wrapper-small .arco-input-group,
    .arco-input-group-wrapper.arco-input-group-wrapper-small .arco-input-inner-wrapper .arco-input-group-prefix,
    .arco-input-group-wrapper.arco-input-group-wrapper-small .arco-input-inner-wrapper .arco-input-group-suffix,
    .arco-input-group-wrapper.arco-input-group-wrapper-small .arco-input-inner-wrapper .arco-input-group-prefix>svg,
    .arco-input-group-wrapper.arco-input-group-wrapper-small .arco-input-inner-wrapper .arco-input-group-suffix>svg {
        font-size: 14px
    }

    .arco-input-group-wrapper.arco-input-group-wrapper-small .arco-input-group-addbefore,
    .arco-input-group-wrapper.arco-input-group-wrapper-small .arco-input-group-addafter {
        height: 26px;
        font-size: 14px
    }

    .arco-input-group-wrapper.arco-input-group-wrapper-small .arco-input-group-addbefore>svg,
    .arco-input-group-wrapper.arco-input-group-wrapper-small .arco-input-group-addafter>svg {
        font-size: 14px
    }

    .arco-input-group-wrapper.arco-input-group-wrapper-small .arco-input-group-addafter .item-style {
        width: auto;
        height: 100%;
        margin: -1px -13px -1px -12px
    }

    .arco-input-group-wrapper.arco-input-group-wrapper-small .arco-input-group-addafter .arco-input {
        border-color: transparent;
        border-top-left-radius: 0;
        border-bottom-left-radius: 0;
        width: auto;
        height: 100%;
        margin: -1px -13px -1px -12px
    }

    .arco-input-group-wrapper.arco-input-group-wrapper-small .arco-input-group-addafter .arco-select {
        width: auto;
        height: 100%;
        margin: -1px -13px -1px -12px
    }

    .arco-input-group-wrapper.arco-input-group-wrapper-small .arco-input-group-addafter .arco-select .arco-select-view {
        background-color: inherit;
        border-color: transparent;
        border-radius: 0
    }

    .arco-input-group-wrapper.arco-input-group-wrapper-small .arco-input-group-addafter .arco-select.arco-select-single .arco-select-view {
        height: 100%
    }

    .arco-input-group-wrapper.arco-input-group-wrapper-small .arco-input-group-addbefore .item-style {
        width: auto;
        height: 100%;
        margin: -1px -12px -1px -13px
    }

    .arco-input-group-wrapper.arco-input-group-wrapper-small .arco-input-group-addbefore .arco-input {
        border-color: transparent;
        border-top-right-radius: 0;
        border-bottom-right-radius: 0;
        width: auto;
        height: 100%;
        margin: -1px -12px -1px -13px
    }

    .arco-input-group-wrapper.arco-input-group-wrapper-small .arco-input-group-addbefore .arco-select {
        width: auto;
        height: 100%;
        margin: -1px -12px -1px -13px
    }

    .arco-input-group-wrapper.arco-input-group-wrapper-small .arco-input-group-addbefore .arco-select .arco-select-view {
        background-color: inherit;
        border-color: transparent;
        border-radius: 0
    }

    .arco-input-group-wrapper.arco-input-group-wrapper-small .arco-input-group-addbefore .arco-select.arco-select-single .arco-select-view {
        height: 100%
    }

    .arco-input-group-wrapper.arco-input-group-wrapper-large .arco-input-group,
    .arco-input-group-wrapper.arco-input-group-wrapper-large .arco-input-inner-wrapper .arco-input-group-prefix,
    .arco-input-group-wrapper.arco-input-group-wrapper-large .arco-input-inner-wrapper .arco-input-group-suffix,
    .arco-input-group-wrapper.arco-input-group-wrapper-large .arco-input-inner-wrapper .arco-input-group-prefix>svg,
    .arco-input-group-wrapper.arco-input-group-wrapper-large .arco-input-inner-wrapper .arco-input-group-suffix>svg {
        font-size: 14px
    }

    .arco-input-group-wrapper.arco-input-group-wrapper-large .arco-input-group-addbefore,
    .arco-input-group-wrapper.arco-input-group-wrapper-large .arco-input-group-addafter {
        height: 34px;
        font-size: 14px
    }

    .arco-input-group-wrapper.arco-input-group-wrapper-large .arco-input-group-addbefore>svg,
    .arco-input-group-wrapper.arco-input-group-wrapper-large .arco-input-group-addafter>svg {
        font-size: 14px
    }

    .arco-input-group-wrapper.arco-input-group-wrapper-large .arco-input-group-addafter .item-style {
        width: auto;
        height: 100%;
        margin: -1px -13px -1px -12px
    }

    .arco-input-group-wrapper.arco-input-group-wrapper-large .arco-input-group-addafter .arco-input {
        border-color: transparent;
        border-top-left-radius: 0;
        border-bottom-left-radius: 0;
        width: auto;
        height: 100%;
        margin: -1px -13px -1px -12px
    }

    .arco-input-group-wrapper.arco-input-group-wrapper-large .arco-input-group-addafter .arco-select {
        width: auto;
        height: 100%;
        margin: -1px -13px -1px -12px
    }

    .arco-input-group-wrapper.arco-input-group-wrapper-large .arco-input-group-addafter .arco-select .arco-select-view {
        background-color: inherit;
        border-color: transparent;
        border-radius: 0
    }

    .arco-input-group-wrapper.arco-input-group-wrapper-large .arco-input-group-addafter .arco-select.arco-select-single .arco-select-view {
        height: 100%
    }

    .arco-input-group-wrapper.arco-input-group-wrapper-large .arco-input-group-addbefore .item-style {
        width: auto;
        height: 100%;
        margin: -1px -12px -1px -13px
    }

    .arco-input-group-wrapper.arco-input-group-wrapper-large .arco-input-group-addbefore .arco-input {
        border-color: transparent;
        border-top-right-radius: 0;
        border-bottom-right-radius: 0;
        width: auto;
        height: 100%;
        margin: -1px -12px -1px -13px
    }

    .arco-input-group-wrapper.arco-input-group-wrapper-large .arco-input-group-addbefore .arco-select {
        width: auto;
        height: 100%;
        margin: -1px -12px -1px -13px
    }

    .arco-input-group-wrapper.arco-input-group-wrapper-large .arco-input-group-addbefore .arco-select .arco-select-view {
        background-color: inherit;
        border-color: transparent;
        border-radius: 0
    }

    .arco-input-group-wrapper.arco-input-group-wrapper-large .arco-input-group-addbefore .arco-select.arco-select-single .arco-select-view {
        height: 100%
    }

    .arco-input-group-wrapper.arco-input-custom-height .arco-input-group,
    .arco-input-group-wrapper.arco-input-custom-height .arco-input-inner-wrapper .arco-input-group-prefix,
    .arco-input-group-wrapper.arco-input-custom-height .arco-input-inner-wrapper .arco-input-group-suffix,
    .arco-input-group-wrapper.arco-input-custom-height .arco-input-inner-wrapper .arco-input-group-prefix>svg,
    .arco-input-group-wrapper.arco-input-custom-height .arco-input-inner-wrapper .arco-input-group-suffix>svg {
        font-size: 14px
    }

    .arco-input-group-wrapper.arco-input-custom-height .arco-input-group-addbefore,
    .arco-input-group-wrapper.arco-input-custom-height .arco-input-group-addafter {
        height: 22px;
        font-size: 14px
    }

    .arco-input-group-wrapper.arco-input-custom-height .arco-input-group-addbefore>svg,
    .arco-input-group-wrapper.arco-input-custom-height .arco-input-group-addafter>svg {
        font-size: 14px
    }

    .arco-input-group-wrapper.arco-input-custom-height .arco-input-group-addafter .item-style {
        width: auto;
        height: 100%;
        margin: -1px -13px -1px -12px
    }

    .arco-input-group-wrapper.arco-input-custom-height .arco-input-group-addafter .arco-input {
        border-color: transparent;
        border-top-left-radius: 0;
        border-bottom-left-radius: 0;
        width: auto;
        height: 100%;
        margin: -1px -13px -1px -12px
    }

    .arco-input-group-wrapper.arco-input-custom-height .arco-input-group-addafter .arco-select {
        width: auto;
        height: 100%;
        margin: -1px -13px -1px -12px
    }

    .arco-input-group-wrapper.arco-input-custom-height .arco-input-group-addafter .arco-select .arco-select-view {
        background-color: inherit;
        border-color: transparent;
        border-radius: 0
    }

    .arco-input-group-wrapper.arco-input-custom-height .arco-input-group-addafter .arco-select.arco-select-single .arco-select-view {
        height: 100%
    }

    .arco-input-group-wrapper.arco-input-custom-height .arco-input-group-addbefore .item-style {
        width: auto;
        height: 100%;
        margin: -1px -12px -1px -13px
    }

    .arco-input-group-wrapper.arco-input-custom-height .arco-input-group-addbefore .arco-input {
        border-color: transparent;
        border-top-right-radius: 0;
        border-bottom-right-radius: 0;
        width: auto;
        height: 100%;
        margin: -1px -12px -1px -13px
    }

    .arco-input-group-wrapper.arco-input-custom-height .arco-input-group-addbefore .arco-select {
        width: auto;
        height: 100%;
        margin: -1px -12px -1px -13px
    }

    .arco-input-group-wrapper.arco-input-custom-height .arco-input-group-addbefore .arco-select .arco-select-view {
        background-color: inherit;
        border-color: transparent;
        border-radius: 0
    }

    .arco-input-group-wrapper.arco-input-custom-height .arco-input-group-addbefore .arco-select.arco-select-single .arco-select-view,
    .arco-input-group-wrapper.arco-input-custom-height .arco-input-inner-wrapper,
    .arco-input-group-wrapper.arco-input-custom-height .arco-input-inner-wrapper .arco-input,
    .arco-input-group-wrapper.arco-input-custom-height .arco-input-inner-wrapper .arco-input-clear-wrapper,
    .arco-input-group-wrapper.arco-input-custom-height .arco-input-inner-wrapper .arco-input-clear-wrapper .arco-input,
    .arco-input-group-wrapper .arco-input-inner-wrapper {
        height: 100%
    }

    .arco-input-group-wrapper.arco-input-disabled {
        cursor: not-allowed
    }

    .arco-input-mirror {
        visibility: hidden;
        position: absolute;
        top: 0;
        left: 0
    }

    .arco-textarea {
        -webkit-appearance: none;
        -moz-appearance: none;
        -ms-appearance: none;
        appearance: none;
        -webkit-tap-highlight-color: transparent;
        border-radius: var(--border-radius-small);
        width: 100%;
        color: var(--color-text-1);
        box-sizing: border-box;
        background-color: var(--color-fill-2);
        vertical-align: top;
        resize: vertical;
        border: 1px solid transparent;
        outline: none;
        max-width: 100%;
        height: auto;
        min-height: 32px;
        padding: 4px 12px;
        font-size: 14px;
        line-height: 1.5715;
        transition: color .1s cubic-bezier(0, 0, 1, 1), border-color .1s cubic-bezier(0, 0, 1, 1), background-color .1s cubic-bezier(0, 0, 1, 1);
        position: relative;
        overflow: auto
    }

    .arco-textarea::placeholder {
        color: var(--color-text-3)
    }

    .arco-textarea::placeholder {
        color: var(--color-text-3)
    }

    .arco-textarea::placeholder {
        color: var(--color-text-3)
    }

    .arco-textarea:hover {
        background-color: var(--color-fill-3);
        border-color: transparent
    }

    .arco-textarea:focus,
    .arco-textarea.arco-textarea-focus {
        border-color: rgb(var(--primary-6));
        background-color: var(--color-bg-2);
        box-shadow: 0 0 0 0 var(--color-primary-light-2)
    }

    .arco-textarea-error {
        background-color: var(--color-danger-light-1);
        border-color: transparent
    }

    .arco-textarea-error:hover {
        background-color: var(--color-danger-light-2);
        border-color: transparent
    }

    .arco-textarea-error .arco-input,
    .arco-textarea-error .arco-input:hover {
        box-shadow: none;
        background: 0 0
    }

    .arco-textarea-error.arco-textarea-focus,
    .arco-textarea-error.arco-textarea-focus:hover,
    .arco-textarea-error:focus,
    .arco-textarea-error:focus:hover {
        border-color: rgb(var(--danger-6));
        background-color: var(--color-bg-2);
        box-shadow: 0 0 0 0 var(--color-danger-light-2)
    }

    .arco-textarea-warning {
        background-color: var(--color-warning-light-1);
        border-color: transparent
    }

    .arco-textarea-warning:hover {
        background-color: var(--color-warning-light-2);
        border-color: transparent
    }

    .arco-textarea-warning .arco-input,
    .arco-textarea-warning .arco-input:hover {
        box-shadow: none;
        background: 0 0
    }

    .arco-textarea-warning.arco-textarea-focus,
    .arco-textarea-warning.arco-textarea-focus:hover,
    .arco-textarea-warning:focus,
    .arco-textarea-warning:focus:hover {
        border-color: rgb(var(--warning-6));
        background-color: var(--color-bg-2);
        box-shadow: 0 0 0 0 var(--color-warning-light-2)
    }

    .arco-textarea-disabled {
        background-color: var(--color-fill-2);
        cursor: not-allowed;
        color: var(--color-text-4);
        -webkit-text-fill-color: var(--color-text-4);
        border-color: transparent
    }

    .arco-textarea-disabled:hover {
        background-color: var(--color-fill-2);
        color: var(--color-text-4);
        border-color: transparent
    }

    .arco-textarea-disabled::placeholder {
        color: var(--color-text-4)
    }

    .arco-textarea-disabled::placeholder {
        color: var(--color-text-4)
    }

    .arco-textarea-disabled::placeholder {
        color: var(--color-text-4)
    }

    .arco-input-group.arco-input-group-compact>.arco-select {
        vertical-align: unset
    }

    .arco-input-group.arco-input-group-compact>.arco-select .arco-select-view,
    .arco-input-group.arco-input-group-compact>*,
    .arco-input-group.arco-input-group-compact>* .arco-input-group>:last-child,
    .arco-input-group.arco-input-group-compact>* .arco-input-group>:first-child {
        border-radius: 0
    }

    .arco-input-group.arco-input-group-compact>:not(:last-child) {
        border-right: 1px solid var(--color-neutral-3);
        box-sizing: border-box;
        position: relative
    }

    .arco-input-group.arco-input-group-compact>:first-child,
    .arco-input-group.arco-input-group-compact>:first-child .arco-input-group>:first-child,
    .arco-input-group.arco-input-group-compact>:first-child .arco-select .arco-select-view,
    .arco-input-group.arco-input-group-compact>:first-child .arco-input-group>:first-child .arco-select .arco-select-view {
        border-top-left-radius: var(--border-radius-small);
        border-bottom-left-radius: var(--border-radius-small)
    }

    .arco-input-group.arco-input-group-compact>:last-child,
    .arco-input-group.arco-input-group-compact>:last-child .arco-input-group>:last-child,
    .arco-input-group.arco-input-group-compact>:last-child .arco-select .arco-select-view,
    .arco-input-group.arco-input-group-compact>:last-child .arco-input-group>:last-child .arco-select .arco-select-view {
        border-top-right-radius: var(--border-radius-small);
        border-bottom-right-radius: var(--border-radius-small)
    }

    .arco-input-group.arco-input-group-compact>.arco-input:not(:last-child) {
        border-right-color: var(--color-neutral-3)
    }

    .arco-input-group.arco-input-group-compact>.arco-input:not(:last-child):focus {
        border-right-color: rgb(var(--primary-6))
    }

    .size-height-size-mini {
        padding-top: 1px;
        padding-bottom: 1px;
        font-size: 12px;
        line-height: 1.667
    }

    .size-height-size-small {
        padding-top: 2px;
        padding-bottom: 2px;
        font-size: 14px
    }

    .size-height-size-large {
        padding-top: 6px;
        padding-bottom: 6px;
        font-size: 14px
    }

    .size-height-group-wrapper-mini .arco-input-group-addbefore,
    .size-height-group-wrapper-mini .arco-input-group-addafter,
    .size-height-inner-wrapper.size-height-inner-wrapper-mini,
    .size-height-size-mini {
        padding-left: 8px;
        padding-right: 8px
    }

    .size-height-group-wrapper-small .arco-input-group-addbefore,
    .size-height-group-wrapper-small .arco-input-group-addafter,
    .size-height-inner-wrapper.size-height-inner-wrapper-small,
    .size-height-size-small {
        padding-left: 12px;
        padding-right: 12px
    }

    .size-height-group-wrapper-large .arco-input-group-addbefore,
    .size-height-group-wrapper-large .arco-input-group-addafter,
    .size-height-inner-wrapper.size-height-inner-wrapper-large,
    .size-height-size-large {
        padding-left: 16px;
        padding-right: 16px
    }

    .group-size.group-size-mini .arco-input-group,
    .group-size.group-size-mini .arco-input-inner-wrapper .arco-input-group-prefix,
    .group-size.group-size-mini .arco-input-inner-wrapper .arco-input-group-suffix,
    .group-size.group-size-mini .arco-input-inner-wrapper .arco-input-group-prefix>svg,
    .group-size.group-size-mini .arco-input-inner-wrapper .arco-input-group-suffix>svg {
        font-size: 12px
    }

    .group-size.group-size-mini .arco-input-group-addbefore,
    .group-size.group-size-mini .arco-input-group-addafter {
        height: 22px;
        font-size: 12px
    }

    .group-size.group-size-mini .arco-input-group-addbefore>svg,
    .group-size.group-size-mini .arco-input-group-addafter>svg {
        font-size: 12px
    }

    .group-size.group-size-mini .arco-input-group-addafter .item-style {
        width: auto;
        height: 100%;
        margin: -1px -13px -1px -12px
    }

    .group-size.group-size-mini .arco-input-group-addafter .arco-input {
        border-color: transparent;
        border-top-left-radius: 0;
        border-bottom-left-radius: 0;
        width: auto;
        height: 100%;
        margin: -1px -13px -1px -12px
    }

    .group-size.group-size-mini .arco-input-group-addafter .arco-select {
        width: auto;
        height: 100%;
        margin: -1px -13px -1px -12px
    }

    .group-size.group-size-mini .arco-input-group-addafter .arco-select .arco-select-view {
        background-color: inherit;
        border-color: transparent;
        border-radius: 0
    }

    .group-size.group-size-mini .arco-input-group-addafter .arco-select.arco-select-single .arco-select-view {
        height: 100%
    }

    .group-size.group-size-mini .arco-input-group-addbefore .item-style {
        width: auto;
        height: 100%;
        margin: -1px -12px -1px -13px
    }

    .group-size.group-size-mini .arco-input-group-addbefore .arco-input {
        border-color: transparent;
        border-top-right-radius: 0;
        border-bottom-right-radius: 0;
        width: auto;
        height: 100%;
        margin: -1px -12px -1px -13px
    }

    .group-size.group-size-mini .arco-input-group-addbefore .arco-select {
        width: auto;
        height: 100%;
        margin: -1px -12px -1px -13px
    }

    .group-size.group-size-mini .arco-input-group-addbefore .arco-select .arco-select-view {
        background-color: inherit;
        border-color: transparent;
        border-radius: 0
    }

    .group-size.group-size-mini .arco-input-group-addbefore .arco-select.arco-select-single .arco-select-view {
        height: 100%
    }

    .group-size.group-size-small .arco-input-group,
    .group-size.group-size-small .arco-input-inner-wrapper .arco-input-group-prefix,
    .group-size.group-size-small .arco-input-inner-wrapper .arco-input-group-suffix,
    .group-size.group-size-small .arco-input-inner-wrapper .arco-input-group-prefix>svg,
    .group-size.group-size-small .arco-input-inner-wrapper .arco-input-group-suffix>svg {
        font-size: 14px
    }

    .group-size.group-size-small .arco-input-group-addbefore,
    .group-size.group-size-small .arco-input-group-addafter {
        height: 26px;
        font-size: 14px
    }

    .group-size.group-size-small .arco-input-group-addbefore>svg,
    .group-size.group-size-small .arco-input-group-addafter>svg {
        font-size: 14px
    }

    .group-size.group-size-small .arco-input-group-addafter .item-style {
        width: auto;
        height: 100%;
        margin: -1px -13px -1px -12px
    }

    .group-size.group-size-small .arco-input-group-addafter .arco-input {
        border-color: transparent;
        border-top-left-radius: 0;
        border-bottom-left-radius: 0;
        width: auto;
        height: 100%;
        margin: -1px -13px -1px -12px
    }

    .group-size.group-size-small .arco-input-group-addafter .arco-select {
        width: auto;
        height: 100%;
        margin: -1px -13px -1px -12px
    }

    .group-size.group-size-small .arco-input-group-addafter .arco-select .arco-select-view {
        background-color: inherit;
        border-color: transparent;
        border-radius: 0
    }

    .group-size.group-size-small .arco-input-group-addafter .arco-select.arco-select-single .arco-select-view {
        height: 100%
    }

    .group-size.group-size-small .arco-input-group-addbefore .item-style {
        width: auto;
        height: 100%;
        margin: -1px -12px -1px -13px
    }

    .group-size.group-size-small .arco-input-group-addbefore .arco-input {
        border-color: transparent;
        border-top-right-radius: 0;
        border-bottom-right-radius: 0;
        width: auto;
        height: 100%;
        margin: -1px -12px -1px -13px
    }

    .group-size.group-size-small .arco-input-group-addbefore .arco-select {
        width: auto;
        height: 100%;
        margin: -1px -12px -1px -13px
    }

    .group-size.group-size-small .arco-input-group-addbefore .arco-select .arco-select-view {
        background-color: inherit;
        border-color: transparent;
        border-radius: 0
    }

    .group-size.group-size-small .arco-input-group-addbefore .arco-select.arco-select-single .arco-select-view {
        height: 100%
    }

    .group-size.group-size-large .arco-input-group,
    .group-size.group-size-large .arco-input-inner-wrapper .arco-input-group-prefix,
    .group-size.group-size-large .arco-input-inner-wrapper .arco-input-group-suffix,
    .group-size.group-size-large .arco-input-inner-wrapper .arco-input-group-prefix>svg,
    .group-size.group-size-large .arco-input-inner-wrapper .arco-input-group-suffix>svg {
        font-size: 14px
    }

    .group-size.group-size-large .arco-input-group-addbefore,
    .group-size.group-size-large .arco-input-group-addafter {
        height: 34px;
        font-size: 14px
    }

    .group-size.group-size-large .arco-input-group-addbefore>svg,
    .group-size.group-size-large .arco-input-group-addafter>svg {
        font-size: 14px
    }

    .group-size.group-size-large .arco-input-group-addafter .item-style {
        width: auto;
        height: 100%;
        margin: -1px -13px -1px -12px
    }

    .group-size.group-size-large .arco-input-group-addafter .arco-input {
        border-color: transparent;
        border-top-left-radius: 0;
        border-bottom-left-radius: 0;
        width: auto;
        height: 100%;
        margin: -1px -13px -1px -12px
    }

    .group-size.group-size-large .arco-input-group-addafter .arco-select {
        width: auto;
        height: 100%;
        margin: -1px -13px -1px -12px
    }

    .group-size.group-size-large .arco-input-group-addafter .arco-select .arco-select-view {
        background-color: inherit;
        border-color: transparent;
        border-radius: 0
    }

    .group-size.group-size-large .arco-input-group-addafter .arco-select.arco-select-single .arco-select-view {
        height: 100%
    }

    .group-size.group-size-large .arco-input-group-addbefore .item-style {
        width: auto;
        height: 100%;
        margin: -1px -12px -1px -13px
    }

    .group-size.group-size-large .arco-input-group-addbefore .arco-input {
        border-color: transparent;
        border-top-right-radius: 0;
        border-bottom-right-radius: 0;
        width: auto;
        height: 100%;
        margin: -1px -12px -1px -13px
    }

    .group-size.group-size-large .arco-input-group-addbefore .arco-select {
        width: auto;
        height: 100%;
        margin: -1px -12px -1px -13px
    }

    .group-size.group-size-large .arco-input-group-addbefore .arco-select .arco-select-view {
        background-color: inherit;
        border-color: transparent;
        border-radius: 0
    }

    .group-size.group-size-large .arco-input-group-addbefore .arco-select.arco-select-single .arco-select-view {
        height: 100%
    }

    .group-size.arco-input-custom-height .arco-input-group,
    .group-size.arco-input-custom-height .arco-input-inner-wrapper .arco-input-group-prefix,
    .group-size.arco-input-custom-height .arco-input-inner-wrapper .arco-input-group-suffix,
    .group-size.arco-input-custom-height .arco-input-inner-wrapper .arco-input-group-prefix>svg,
    .group-size.arco-input-custom-height .arco-input-inner-wrapper .arco-input-group-suffix>svg {
        font-size: 14px
    }

    .group-size.arco-input-custom-height .arco-input-group-addbefore,
    .group-size.arco-input-custom-height .arco-input-group-addafter {
        height: 22px;
        font-size: 14px
    }

    .group-size.arco-input-custom-height .arco-input-group-addbefore>svg,
    .group-size.arco-input-custom-height .arco-input-group-addafter>svg {
        font-size: 14px
    }

    .group-size.arco-input-custom-height .arco-input-group-addafter .item-style {
        width: auto;
        height: 100%;
        margin: -1px -13px -1px -12px
    }

    .group-size.arco-input-custom-height .arco-input-group-addafter .arco-input {
        border-color: transparent;
        border-top-left-radius: 0;
        border-bottom-left-radius: 0;
        width: auto;
        height: 100%;
        margin: -1px -13px -1px -12px
    }

    .group-size.arco-input-custom-height .arco-input-group-addafter .arco-select {
        width: auto;
        height: 100%;
        margin: -1px -13px -1px -12px
    }

    .group-size.arco-input-custom-height .arco-input-group-addafter .arco-select .arco-select-view {
        background-color: inherit;
        border-color: transparent;
        border-radius: 0
    }

    .group-size.arco-input-custom-height .arco-input-group-addafter .arco-select.arco-select-single .arco-select-view {
        height: 100%
    }

    .group-size.arco-input-custom-height .arco-input-group-addbefore .item-style {
        width: auto;
        height: 100%;
        margin: -1px -12px -1px -13px
    }

    .group-size.arco-input-custom-height .arco-input-group-addbefore .arco-input {
        border-color: transparent;
        border-top-right-radius: 0;
        border-bottom-right-radius: 0;
        width: auto;
        height: 100%;
        margin: -1px -12px -1px -13px
    }

    .group-size.arco-input-custom-height .arco-input-group-addbefore .arco-select {
        width: auto;
        height: 100%;
        margin: -1px -12px -1px -13px
    }

    .group-size.arco-input-custom-height .arco-input-group-addbefore .arco-select .arco-select-view {
        background-color: inherit;
        border-color: transparent;
        border-radius: 0
    }

    .group-size.arco-input-custom-height .arco-input-group-addbefore .arco-select.arco-select-single .arco-select-view,
    .group-size.arco-input-custom-height .arco-input-inner-wrapper,
    .group-size.arco-input-custom-height .arco-input-inner-wrapper .arco-input,
    .group-size.arco-input-custom-height .arco-input-inner-wrapper .arco-input-clear-wrapper,
    .group-size.arco-input-custom-height .arco-input-inner-wrapper .arco-input-clear-wrapper .arco-input {
        height: 100%
    }

    .arco-textarea-wrapper {
        width: 100%;
        display: inline-block;
        position: relative
    }

    .arco-textarea-clear-wrapper:hover .arco-textarea-clear-icon {
        display: inline-block
    }

    .arco-textarea-clear-wrapper .arco-textarea {
        padding-right: 20px
    }

    .arco-textarea-word-limit {
        color: var(--color-text-3);
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        font-size: 12px;
        position: absolute;
        bottom: 6px;
        right: 10px
    }

    .arco-textarea-word-limit-error {
        color: rgb(var(--danger-6))
    }

    .arco-textarea-clear-icon {
        color: var(--color-text-2);
        font-size: 12px;
        display: none;
        position: absolute;
        top: 10px;
        right: 10px
    }

    .arco-textarea-clear-icon>svg {
        transition: color .1s cubic-bezier(0, 0, 1, 1);
        position: relative
    }

    .arco-input-search.arco-input-group-wrapper .arco-input-group-addbefore {
        transition: all .1s cubic-bezier(0, 0, 1, 1)
    }

    .arco-input-search.arco-input-group-wrapper .arco-input-group-addafter {
        border: none;
        padding: 0
    }

    .arco-input-search.arco-input-group-wrapper .arco-input-group-suffix {
        color: var(--color-text-2);
        font-size: 14px
    }

    .arco-input-search.arco-input-group-wrapper:not(.arco-input-disabled) .arco-input-group-addbefore {
        cursor: pointer;
        color: var(--color-text-2);
        font-size: 14px
    }

    .arco-input-search.arco-input-group-wrapper .arco-input-search-btn {
        height: 100%;
        color: var(--color-white);
        border-top-left-radius: 0;
        border-bottom-left-radius: 0;
        font-size: 14px
    }

    .arco-input-search-button .arco-input-inner-wrapper:not(.arco-input-inner-wrapper-rtl) {
        border-right: none;
        border-top-right-radius: 0;
        border-bottom-right-radius: 0
    }

    .arco-input-password.arco-input-group-wrapper:not(.arco-input-disabled) .arco-input-group-suffix {
        cursor: pointer;
        color: var(--color-text-2);
        font-size: 12px
    }

    .arco-input-password.arco-input-group-wrapper .arco-input-password-visibility-icon:focus-visible {
        box-shadow: 0 0 0 2px rgb(var(--primary-6));
        border-radius: var(--border-radius-small)
    }

    .arco-input-group-wrapper-rtl {
        direction: rtl
    }

    .arco-input-group-wrapper-rtl .arco-input-word-limit {
        padding-left: 0;
        padding-right: input-padding-word-limit-left
    }

    .arco-input-group-wrapper-rtl.arco-input-clear-wrapper .arco-input {
        padding-left: 24px;
        padding-right: 0
    }

    .arco-input-group-wrapper-rtl .arco-input-group>:first-child {
        border-radius: 0 var(--border-radius-small)var(--border-radius-small)0
    }

    .arco-input-group-wrapper-rtl .arco-input-group>:last-child {
        border-radius: var(--border-radius-small)0 0 var(--border-radius-small)
    }

    .arco-input-group-wrapper-rtl .arco-input-group-addafter {
        border-left: none;
        border-right: 1px solid var(--color-neutral-3)
    }

    .arco-input-group-wrapper-rtl .arco-input-group-addafter .item-style {
        width: auto;
        height: 100%;
        margin: -1px -12px -1px -13px
    }

    .arco-input-group-wrapper-rtl .arco-input-group-addafter .arco-input {
        border-color: transparent;
        border-top-right-radius: 0;
        border-bottom-right-radius: 0;
        width: auto;
        height: 100%;
        margin: -1px -12px -1px -13px
    }

    .arco-input-group-wrapper-rtl .arco-input-group-addafter .arco-select {
        width: auto;
        height: 100%;
        margin: -1px -12px -1px -13px
    }

    .arco-input-group-wrapper-rtl .arco-input-group-addafter .arco-select .arco-select-view {
        background-color: inherit;
        border-color: transparent;
        border-radius: 0
    }

    .arco-input-group-wrapper-rtl .arco-input-group-addafter .arco-select.arco-select-single .arco-select-view {
        height: 100%
    }

    .arco-input-group-wrapper-rtl .arco-input-group-addbefore {
        border-right: none;
        border-left: 1px solid var(--color-neutral-3)
    }

    .arco-input-group-wrapper-rtl .arco-input-group-addbefore .item-style {
        width: auto;
        height: 100%;
        margin: -1px -13px -1px -12px
    }

    .arco-input-group-wrapper-rtl .arco-input-group-addbefore .arco-input {
        border-color: transparent;
        border-top-left-radius: 0;
        border-bottom-left-radius: 0;
        width: auto;
        height: 100%;
        margin: -1px -13px -1px -12px
    }

    .arco-input-group-wrapper-rtl .arco-input-group-addbefore .arco-select {
        width: auto;
        height: 100%;
        margin: -1px -13px -1px -12px
    }

    .arco-input-group-wrapper-rtl .arco-input-group-addbefore .arco-select .arco-select-view {
        background-color: inherit;
        border-color: transparent;
        border-radius: 0
    }

    .arco-input-group-wrapper-rtl .arco-input-group-addbefore .arco-select.arco-select-single .arco-select-view {
        height: 100%
    }

    .arco-input-group-wrapper-rtl .arco-input-group.arco-input-group-compact>:not(:last-child) {
        border-right: none;
        border-left: 1px solid var(--color-neutral-3)
    }

    .arco-input-group-wrapper-rtl .arco-input-group.arco-input-group-compact>:first-child,
    .arco-input-group-wrapper-rtl .arco-input-group.arco-input-group-compact>:first-child .arco-input-group>:first-child,
    .arco-input-group-wrapper-rtl .arco-input-group.arco-input-group-compact>:first-child .arco-select .arco-select-view,
    .arco-input-group-wrapper-rtl .arco-input-group.arco-input-group-compact>:first-child .arco-input-group>:first-child .arco-select .arco-select-view {
        border-radius: 0 var(--border-radius-small)var(--border-radius-small)0
    }

    .arco-input-group-wrapper-rtl .arco-input-group.arco-input-group-compact>:last-child,
    .arco-input-group-wrapper-rtl .arco-input-group.arco-input-group-compact>:last-child .arco-input-group>:last-child,
    .arco-input-group-wrapper-rtl .arco-input-group.arco-input-group-compact>:last-child .arco-select .arco-select-view,
    .arco-input-group-wrapper-rtl .arco-input-group.arco-input-group-compact>:last-child .arco-input-group>:last-child .arco-select .arco-select-view {
        border-radius: var(--border-radius-small)0 0 var(--border-radius-small)
    }

    .arco-input-group-wrapper-rtl .arco-input-group.arco-input-group-compact>.arco-input:not(:last-child) {
        border-left-color: var(--color-neutral-3)
    }

    .arco-input-group-wrapper-rtl .arco-input-group.arco-input-group-compact>.arco-input:not(:last-child):focus {
        border-left-color: rgb(var(--primary-6))
    }

    .arco-input-group-wrapper-rtl.arco-input-search .arco-input-search-btn {
        border-radius: var(--border-radius-small)0 0 var(--border-radius-small)
    }

    .arco-input-inner-wrapper-rtl {
        direction: rtl
    }

    .arco-input-inner-wrapper-rtl.arco-input-inner-wrapper-has-prefix>.arco-input-clear-wrapper .arco-input,
    .arco-input-inner-wrapper-rtl.arco-input-inner-wrapper-has-prefix>.arco-input {
        padding-left: 0;
        padding-right: 12px
    }

    .arco-input-inner-wrapper-rtl>.arco-input-clear-wrapper .arco-input {
        padding-left: 12px;
        padding-right: 0
    }

    .arco-input-inner-wrapper-rtl>.arco-input-clear-wrapper .arco-input-clear-icon {
        right: initial;
        left: 8px
    }

    .arco-input-inner-wrapper-rtl:hover .arco-input-clear-icon~.arco-input-group-suffix {
        margin-left: 4px
    }

    .arco-input-search-button .arco-input-inner-wrapper-rtl {
        border-radius: 0 var(--border-radius-small)var(--border-radius-small)0;
        border-left: none
    }

    .arco-textarea-wrapper-rtl {
        direction: rtl
    }

    .arco-textarea-wrapper-rtl .arco-textarea {
        padding-left: 20px
    }

    .arco-textarea-wrapper-rtl .arco-textarea-word-limit,
    .arco-textarea-wrapper-rtl .arco-textarea-clear-icon {
        right: initial;
        left: 10px
    }
}


@layer base {
    .arco-message-wrapper {
        z-index: 1003;
        text-align: center;
        pointer-events: none;
        box-sizing: border-box;
        width: 100%;
        padding: 0 10px;
        position: fixed;
        left: 0
    }

    .arco-message-wrapper-top {
        top: 40px
    }

    .arco-message-wrapper-bottom {
        bottom: 40px
    }

    .arco-message {
        border-radius: var(--border-radius-small);
        border: 1px solid var(--color-neutral-3);
        background-color: var(--color-bg-popup);
        text-align: center;
        pointer-events: auto;
        margin-bottom: 16px;
        padding: 10px 16px;
        line-height: 1;
        transition: opacity .1s cubic-bezier(0, 0, 1, 1);
        display: inline-block;
        position: relative;
        overflow: hidden;
        box-shadow: 0 4px 10px rgba(0, 0, 0, .1)
    }

    .arco-message-closable {
        padding-right: 38px
    }

    .arco-message-icon {
        color: var(--color-text-1);
        vertical-align: middle;
        margin-right: 8px;
        font-size: 20px;
        animation: .1s cubic-bezier(0, 0, 1, 1) arco-msg-fade, .4s cubic-bezier(.3, 1.3, .3, 1) arco-msg-fade;
        display: inline-block
    }

    .arco-message-content {
        vertical-align: middle;
        color: var(--color-text-1);
        font-size: 14px
    }

    .arco-message-info {
        background-color: var(--color-bg-popup);
        border-color: var(--color-neutral-3)
    }

    .arco-message-info .arco-message-icon {
        color: rgb(var(--primary-6))
    }

    .arco-message-info .arco-message-content {
        color: var(--color-text-1)
    }

    .arco-message-success {
        background-color: var(--color-bg-popup);
        border-color: var(--color-neutral-3)
    }

    .arco-message-success .arco-message-icon {
        color: rgb(var(--success-6))
    }

    .arco-message-success .arco-message-content {
        color: var(--color-text-1)
    }

    .arco-message-warning {
        background-color: var(--color-bg-popup);
        border-color: var(--color-neutral-3)
    }

    .arco-message-warning .arco-message-icon {
        color: rgb(var(--warning-6))
    }

    .arco-message-warning .arco-message-content {
        color: var(--color-text-1)
    }

    .arco-message-error {
        background-color: var(--color-bg-popup);
        border-color: var(--color-neutral-3)
    }

    .arco-message-error .arco-message-icon {
        color: rgb(var(--danger-6))
    }

    .arco-message-error .arco-message-content {
        color: var(--color-text-1)
    }

    .arco-message-loading {
        background-color: var(--color-bg-popup);
        border-color: var(--color-neutral-3)
    }

    .arco-message-loading .arco-message-icon {
        color: rgb(var(--primary-6))
    }

    .arco-message-loading .arco-message-content {
        color: var(--color-text-1)
    }

    .arco-message-close-btn {
        color: var(--color-text-1);
        font-size: 12px;
        position: absolute;
        top: 14px;
        right: 12px
    }

    .arco-message-close-btn>svg {
        position: relative
    }

    .arco-message .arco-icon-hover.arco-message-icon-hover:before {
        width: 20px;
        height: 20px
    }

    .fadeMessage-enter,
    .fadeMessage-appear {
        opacity: 0
    }

    .fadeMessage-enter-active,
    .fadeMessage-appear-active {
        opacity: 1;
        transition: opacity .1s cubic-bezier(0, 0, 1, 1)
    }

    .fadeMessage-exit {
        opacity: 0;
        overflow: hidden
    }

    .fadeMessage-exit-active {
        opacity: 0;
        height: 0;
        transition: all .3s cubic-bezier(.34, .69, .1, 1)
    }

    .arco-message-rtl {
        direction: rtl
    }

    .arco-message-rtl .arco-message-icon {
        margin-left: 8px;
        margin-right: 0
    }

    @keyframes arco-msg-fade {
        0% {
            opacity: 0
        }

        to {
            opacity: 1
        }
    }

    @keyframes arco-msg-scale {
        0% {
            transform: scale(0)
        }

        to {
            transform: scale(1)
        }
    }
}


.ps {
    overflow-anchor: none;
    -ms-overflow-style: none;
    touch-action: auto;
    -ms-touch-action: auto;
    overflow: hidden !important
}

.ps__rail-x {
    opacity: 0;
    height: 15px;
    transition: background-color .2s linear, opacity .2s linear;
    display: none;
    position: absolute;
    bottom: 0
}

.ps__rail-y {
    opacity: 0;
    width: 15px;
    transition: background-color .2s linear, opacity .2s linear;
    display: none;
    position: absolute;
    right: 0
}

.ps--active-x>.ps__rail-x,
.ps--active-y>.ps__rail-y {
    background-color: transparent;
    display: block
}

.ps:hover>.ps__rail-x,
.ps:hover>.ps__rail-y,
.ps--focus>.ps__rail-x,
.ps--focus>.ps__rail-y,
.ps--scrolling-x>.ps__rail-x,
.ps--scrolling-y>.ps__rail-y {
    opacity: .6
}

.ps .ps__rail-x:hover,
.ps .ps__rail-y:hover,
.ps .ps__rail-x:focus,
.ps .ps__rail-y:focus,
.ps .ps__rail-x.ps--clicking,
.ps .ps__rail-y.ps--clicking {
    opacity: .9;
    background-color: #eee
}

.ps__thumb-x {
    background-color: #aaa;
    border-radius: 6px;
    height: 6px;
    transition: background-color .2s linear, height .2s ease-in-out;
    position: absolute;
    bottom: 2px
}

.ps__thumb-y {
    background-color: #aaa;
    border-radius: 6px;
    width: 6px;
    transition: background-color .2s linear, width .2s ease-in-out;
    position: absolute;
    right: 2px
}

.ps__rail-x:hover>.ps__thumb-x,
.ps__rail-x:focus>.ps__thumb-x,
.ps__rail-x.ps--clicking .ps__thumb-x {
    background-color: #999;
    height: 11px
}

.ps__rail-y:hover>.ps__thumb-y,
.ps__rail-y:focus>.ps__thumb-y,
.ps__rail-y.ps--clicking .ps__thumb-y {
    background-color: #999;
    width: 11px
}

@supports (-ms-overflow-style:none) {
    .ps {
        overflow: auto !important
    }
}

@media screen and (-ms-high-contrast:active),
(-ms-high-contrast:none) {
    .ps {
        overflow: auto !important
    }
}


.reset_focus_outline:focus {
    --hack-merge-rules: true;
    outline: none
}

.reset_focus_outline:focus-visible {
    outline: none
}

.ud__svg-spin-loading {
    box-sizing: border-box;
    animation: 1.2s linear infinite SpinSVGRotate
}

.ud__svg-spin-loading>circle {
    stroke-dasharray: 1 220;
    stroke-dashoffset: 0;
    stroke-linecap: round;
    animation: 2.5s ease-in-out infinite SpinSVGDash
}

@keyframes SpinSVGRotate {
    to {
        transform: rotate(360deg)
    }
}

@keyframes SpinSVGDash {
    0% {
        stroke-dasharray: 1 220;
        stroke-dashoffset: 0
    }

    50% {
        stroke-dasharray: 150 220;
        stroke-dashoffset: -68px
    }

    to {
        stroke-dasharray: 150 220;
        stroke-dashoffset: -218px
    }
}


body {
    color: #1f2329;
    background-color: #fff;
    margin: 0
}

body,
input,
button,
select,
optgroup,
textarea,
body.ud__lang-zh,
input.ud__lang-zh,
button.ud__lang-zh,
select.ud__lang-zh,
optgroup.ud__lang-zh,
textarea.ud__lang-zh,
.ud__lang-zh body,
.ud__lang-zh input,
.ud__lang-zh button,
.ud__lang-zh select,
.ud__lang-zh optgroup,
.ud__lang-zh textarea,
body.ud__lang-en,
input.ud__lang-en,
button.ud__lang-en,
select.ud__lang-en,
optgroup.ud__lang-en,
textarea.ud__lang-en,
.ud__lang-en body,
.ud__lang-en input,
.ud__lang-en button,
.ud__lang-en select,
.ud__lang-en optgroup,
.ud__lang-en textarea {
    font-family: LarkEmojiFont, LarkChineseQuote, -apple-system, BlinkMacSystemFont, Helvetica Neue, Tahoma, PingFang SC, Microsoft Yahei, Arial, Hiragino Sans GB, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji
}

body.ud__lang-jp,
input.ud__lang-jp,
button.ud__lang-jp,
select.ud__lang-jp,
optgroup.ud__lang-jp,
textarea.ud__lang-jp,
.ud__lang-jp body,
.ud__lang-jp input,
.ud__lang-jp button,
.ud__lang-jp select,
.ud__lang-jp optgroup,
.ud__lang-jp textarea {
    font-family: ヒラギノ角ゴ Pro W3, Hiragino Kaku Gothic Pro, Yu Gothic UI, 游ゴシック体, Noto Sans Japanese, Microsoft Jhenghei UI, Microsoft Yahei UI, ＭＳ Ｐゴシック, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji
}

input::-ms-clear {
    display: none
}

input::-ms-reveal {
    display: none
}

input,
button,
select,
optgroup,
textarea {
    color: inherit;
    font-family: inherit
}

.ud-scrollbar::-webkit-scrollbar-thumb {
    background-color: rgba(31, 35, 41, .3);
    background-clip: padding-box;
    border: 2px solid transparent;
    border-radius: 9999px;
    transition: background .2s cubic-bezier(.34, .69, .1, 1)
}

.ud-scrollbar::-webkit-scrollbar {
    background-color: transparent;
    width: 11px;
    height: 11px
}

.ud-scrollbar::-webkit-scrollbar-thumb:hover {
    background-color: rgba(31, 35, 41, .6) !important
}

.ud-scrollbar::-webkit-scrollbar:hover {
    width: 11px;
    height: 11px
}

.ud-scrollbar::-webkit-scrollbar-button {
    display: none
}

.ud-scrollbar::-webkit-scrollbar-track {
    background-color: transparent
}

.ud-scrollbar::-webkit-scrollbar-corner {
    background-color: transparent
}

.rc-virtual-list-scrollbar {
    width: 11px !important
}

.rc-virtual-list-scrollbar-thumb {
    box-sizing: border-box;
    padding: 2px;
    background: 0 0 !important;
    width: 11px !important
}

.rc-virtual-list-scrollbar-thumb:after {
    box-sizing: border-box;
    content: " ";
    border-radius: 9999px;
    width: 100%;
    height: 100%;
    transition: background-color .2s cubic-bezier(.34, .69, .1, 1);
    display: block;
    background-color: rgba(31, 35, 41, .3) !important
}

.rc-virtual-list-scrollbar-thumb:hover:after {
    background-color: rgba(31, 35, 41, .6) !important
}

[type=search] {
    outline-offset: -2px;
    -webkit-appearance: none
}

[type=search]::-webkit-search-cancel-button {
    -webkit-appearance: none
}

[type=search]::-webkit-search-decoration {
    -webkit-appearance: none
}

.reset_focus_outline:focus {
    --hack-merge-rules: true;
    outline: none
}

.reset_focus_outline:focus-visible {
    outline: none
}

.ud-slide-up-enter,
.ud-slide-up-appear,
.ud-slide-up-leave {
    animation-duration: .2s;
    animation-play-state: paused;
    animation-fill-mode: both
}

.ud-slide-up-enter.ud-slide-up-enter-active,
.ud-slide-up-appear.ud-slide-up-appear-active {
    animation-name: udSlideUpIn;
    animation-play-state: running
}

.ud-slide-up-leave.ud-slide-up-leave-active {
    pointer-events: none;
    animation-name: udSlideUpOut;
    animation-play-state: running
}

.ud-slide-up-enter,
.ud-slide-up-appear {
    opacity: 0;
    animation-timing-function: cubic-bezier(.34, .69, .1, 1)
}

.ud-slide-up-leave {
    animation-timing-function: cubic-bezier(.34, .69, .1, 1)
}

.ud-slide-down-enter,
.ud-slide-down-appear,
.ud-slide-down-leave {
    animation-duration: .2s;
    animation-play-state: paused;
    animation-fill-mode: both
}

.ud-slide-down-enter.ud-slide-down-enter-active,
.ud-slide-down-appear.ud-slide-down-appear-active {
    animation-name: udSlideDownIn;
    animation-play-state: running
}

.ud-slide-down-leave.ud-slide-down-leave-active {
    pointer-events: none;
    animation-name: udSlideDownOut;
    animation-play-state: running
}

.ud-slide-down-enter,
.ud-slide-down-appear {
    opacity: 0;
    animation-timing-function: cubic-bezier(.34, .69, .1, 1)
}

.ud-slide-down-leave {
    animation-timing-function: cubic-bezier(.34, .69, .1, 1)
}

.ud-slide-left-enter,
.ud-slide-left-appear,
.ud-slide-left-leave {
    animation-duration: .2s;
    animation-play-state: paused;
    animation-fill-mode: both
}

.ud-slide-left-enter.ud-slide-left-enter-active,
.ud-slide-left-appear.ud-slide-left-appear-active {
    animation-name: udSlideLeftIn;
    animation-play-state: running
}

.ud-slide-left-leave.ud-slide-left-leave-active {
    pointer-events: none;
    animation-name: udSlideLeftOut;
    animation-play-state: running
}

.ud-slide-left-enter,
.ud-slide-left-appear {
    opacity: 0;
    animation-timing-function: cubic-bezier(.34, .69, .1, 1)
}

.ud-slide-left-leave {
    animation-timing-function: cubic-bezier(.34, .69, .1, 1)
}

.ud-slide-right-enter,
.ud-slide-right-appear,
.ud-slide-right-leave {
    animation-duration: .2s;
    animation-play-state: paused;
    animation-fill-mode: both
}

.ud-slide-right-enter.ud-slide-right-enter-active,
.ud-slide-right-appear.ud-slide-right-appear-active {
    animation-name: udSlideRightIn;
    animation-play-state: running
}

.ud-slide-right-leave.ud-slide-right-leave-active {
    pointer-events: none;
    animation-name: udSlideRightOut;
    animation-play-state: running
}

.ud-slide-right-enter,
.ud-slide-right-appear {
    opacity: 0;
    animation-timing-function: cubic-bezier(.34, .69, .1, 1)
}

.ud-slide-right-leave {
    animation-timing-function: cubic-bezier(.34, .69, .1, 1)
}

@keyframes udSlideUpIn {
    0% {
        transform-origin: 0 0;
        opacity: 0;
        transform: translateY(-8px)
    }

    to {
        transform-origin: 0 0;
        opacity: 1;
        transform: translateY(0)
    }
}

@keyframes udSlideUpOut {
    0% {
        transform-origin: 0 0;
        opacity: 1;
        transform: translateY(0)
    }

    to {
        transform-origin: 0 0;
        opacity: 0;
        transform: translateY(-8px)
    }
}

@keyframes udSlideDownIn {
    0% {
        transform-origin: 100% 100%;
        opacity: 0;
        transform: translateY(8px)
    }

    to {
        transform-origin: 100% 100%;
        opacity: 1;
        transform: translateY(0)
    }
}

@keyframes udSlideDownOut {
    0% {
        transform-origin: 100% 100%;
        opacity: 1;
        transform: translateY(0)
    }

    to {
        transform-origin: 100% 100%;
        opacity: 0;
        transform: translateY(8px)
    }
}

@keyframes udSlideLeftIn {
    0% {
        transform-origin: 0 0;
        opacity: 0;
        transform: scaleX(.5)
    }

    to {
        transform-origin: 0 0;
        opacity: 1;
        transform: scaleX(1)
    }
}

@keyframes udSlideLeftOut {
    0% {
        transform-origin: 0 0;
        opacity: 1;
        transform: scaleX(1)
    }

    to {
        transform-origin: 0 0;
        opacity: 0;
        transform: scaleX(.5)
    }
}

@keyframes udSlideRightIn {
    0% {
        transform-origin: 100% 0;
        opacity: 0;
        transform: scaleX(.5)
    }

    to {
        transform-origin: 100% 0;
        opacity: 1;
        transform: scaleX(1)
    }
}

@keyframes udSlideRightOut {
    0% {
        transform-origin: 100% 0;
        opacity: 1;
        transform: scaleX(1)
    }

    to {
        transform-origin: 100% 0;
        opacity: 0;
        transform: scaleX(.5)
    }
}

.zoom-enter,
.zoom-appear,
.zoom-leave {
    animation-duration: .2s;
    animation-play-state: paused;
    animation-fill-mode: both
}

.zoom-enter.zoom-enter-active,
.zoom-appear.zoom-appear-active {
    animation-name: udZoomIn;
    animation-play-state: running
}

.zoom-leave.zoom-leave-active {
    pointer-events: none;
    animation-name: udZoomOut;
    animation-play-state: running
}

.zoom-enter,
.zoom-appear {
    opacity: 0;
    animation-timing-function: cubic-bezier(.08, .82, .17, 1);
    transform: scale(0)
}

.zoom-enter-prepare,
.zoom-appear-prepare {
    transform: none
}

.zoom-leave {
    animation-timing-function: cubic-bezier(.78, .14, .15, .86)
}

.ud-zoom-big-enter,
.ud-zoom-big-appear,
.ud-zoom-big-leave {
    animation-duration: .2s;
    animation-play-state: paused;
    animation-fill-mode: both
}

.ud-zoom-big-enter.ud-zoom-big-enter-active,
.ud-zoom-big-appear.ud-zoom-big-appear-active {
    animation-name: udZoomBigIn;
    animation-play-state: running
}

.ud-zoom-big-leave.ud-zoom-big-leave-active {
    pointer-events: none;
    animation-name: udZoomBigOut;
    animation-play-state: running
}

.ud-zoom-big-enter,
.ud-zoom-big-appear {
    opacity: 0;
    animation-timing-function: cubic-bezier(.08, .82, .17, 1);
    transform: scale(0)
}

.ud-zoom-big-enter-prepare,
.ud-zoom-big-appear-prepare {
    transform: none
}

.ud-zoom-big-leave {
    animation-timing-function: cubic-bezier(.78, .14, .15, .86)
}

.ud-zoom-big-fast-enter,
.ud-zoom-big-fast-appear,
.ud-zoom-big-fast-leave {
    animation-duration: .1s;
    animation-play-state: paused;
    animation-fill-mode: both
}

.ud-zoom-big-fast-enter.ud-zoom-big-fast-enter-active,
.ud-zoom-big-fast-appear.ud-zoom-big-fast-appear-active {
    animation-name: udZoomBigIn;
    animation-play-state: running
}

.ud-zoom-big-fast-leave.ud-zoom-big-fast-leave-active {
    pointer-events: none;
    animation-name: udZoomBigOut;
    animation-play-state: running
}

.ud-zoom-big-fast-enter,
.ud-zoom-big-fast-appear {
    opacity: 0;
    animation-timing-function: cubic-bezier(.08, .82, .17, 1);
    transform: scale(0)
}

.ud-zoom-big-fast-enter-prepare,
.ud-zoom-big-fast-appear-prepare {
    transform: none
}

.ud-zoom-big-fast-leave {
    animation-timing-function: cubic-bezier(.78, .14, .15, .86)
}

.ud-zoom-up-enter,
.ud-zoom-up-appear,
.ud-zoom-up-leave {
    animation-duration: .2s;
    animation-play-state: paused;
    animation-fill-mode: both
}

.ud-zoom-up-enter.ud-zoom-up-enter-active,
.ud-zoom-up-appear.ud-zoom-up-appear-active {
    animation-name: udZoomUpIn;
    animation-play-state: running
}

.ud-zoom-up-leave.ud-zoom-up-leave-active {
    pointer-events: none;
    animation-name: udZoomUpOut;
    animation-play-state: running
}

.ud-zoom-up-enter,
.ud-zoom-up-appear {
    opacity: 0;
    animation-timing-function: cubic-bezier(.08, .82, .17, 1);
    transform: scale(0)
}

.ud-zoom-up-enter-prepare,
.ud-zoom-up-appear-prepare {
    transform: none
}

.ud-zoom-up-leave {
    animation-timing-function: cubic-bezier(.78, .14, .15, .86)
}

.ud-zoom-down-enter,
.ud-zoom-down-appear,
.ud-zoom-down-leave {
    animation-duration: .2s;
    animation-play-state: paused;
    animation-fill-mode: both
}

.ud-zoom-down-enter.ud-zoom-down-enter-active,
.ud-zoom-down-appear.ud-zoom-down-appear-active {
    animation-name: udZoomDownIn;
    animation-play-state: running
}

.ud-zoom-down-leave.ud-zoom-down-leave-active {
    pointer-events: none;
    animation-name: udZoomDownOut;
    animation-play-state: running
}

.ud-zoom-down-enter,
.ud-zoom-down-appear {
    opacity: 0;
    animation-timing-function: cubic-bezier(.08, .82, .17, 1);
    transform: scale(0)
}

.ud-zoom-down-enter-prepare,
.ud-zoom-down-appear-prepare {
    transform: none
}

.ud-zoom-down-leave {
    animation-timing-function: cubic-bezier(.78, .14, .15, .86)
}

.ud-zoom-left-enter,
.ud-zoom-left-appear,
.ud-zoom-left-leave {
    animation-duration: .2s;
    animation-play-state: paused;
    animation-fill-mode: both
}

.ud-zoom-left-enter.ud-zoom-left-enter-active,
.ud-zoom-left-appear.ud-zoom-left-appear-active {
    animation-name: udZoomLeftIn;
    animation-play-state: running
}

.ud-zoom-left-leave.ud-zoom-left-leave-active {
    pointer-events: none;
    animation-name: udZoomLeftOut;
    animation-play-state: running
}

.ud-zoom-left-enter,
.ud-zoom-left-appear {
    opacity: 0;
    animation-timing-function: cubic-bezier(.08, .82, .17, 1);
    transform: scale(0)
}

.ud-zoom-left-enter-prepare,
.ud-zoom-left-appear-prepare {
    transform: none
}

.ud-zoom-left-leave {
    animation-timing-function: cubic-bezier(.78, .14, .15, .86)
}

.ud-zoom-right-enter,
.ud-zoom-right-appear,
.ud-zoom-right-leave {
    animation-duration: .2s;
    animation-play-state: paused;
    animation-fill-mode: both
}

.ud-zoom-right-enter.ud-zoom-right-enter-active,
.ud-zoom-right-appear.ud-zoom-right-appear-active {
    animation-name: udZoomRightIn;
    animation-play-state: running
}

.ud-zoom-right-leave.ud-zoom-right-leave-active {
    pointer-events: none;
    animation-name: udZoomRightOut;
    animation-play-state: running
}

.ud-zoom-right-enter,
.ud-zoom-right-appear {
    opacity: 0;
    animation-timing-function: cubic-bezier(.08, .82, .17, 1);
    transform: scale(0)
}

.ud-zoom-right-enter-prepare,
.ud-zoom-right-appear-prepare {
    transform: none
}

.ud-zoom-right-leave {
    animation-timing-function: cubic-bezier(.78, .14, .15, .86)
}

@keyframes udZoomIn {
    0% {
        opacity: 0;
        transform: scale(.2)
    }

    to {
        opacity: 1;
        transform: scale(1)
    }
}

@keyframes udZoomOut {
    0% {
        transform: scale(1)
    }

    to {
        opacity: 0;
        transform: scale(.2)
    }
}

@keyframes udZoomBigIn {
    0% {
        opacity: 0;
        transform: scale(.8)
    }

    to {
        opacity: 1;
        transform: scale(1)
    }
}

@keyframes udZoomBigOut {
    0% {
        transform: scale(1)
    }

    to {
        opacity: 0;
        transform: scale(.8)
    }
}

@keyframes udZoomUpIn {
    0% {
        transform-origin: 50% 0;
        opacity: 0;
        transform: scale(.8)
    }

    to {
        transform-origin: 50% 0;
        transform: scale(1)
    }
}

@keyframes udZoomUpOut {
    0% {
        transform-origin: 50% 0;
        transform: scale(1)
    }

    to {
        transform-origin: 50% 0;
        opacity: 0;
        transform: scale(.8)
    }
}

@keyframes udZoomLeftIn {
    0% {
        transform-origin: 0%;
        opacity: 0;
        transform: scale(.8)
    }

    to {
        transform-origin: 0%;
        transform: scale(1)
    }
}

@keyframes udZoomLeftOut {
    0% {
        transform-origin: 0%;
        transform: scale(1)
    }

    to {
        transform-origin: 0%;
        opacity: 0;
        transform: scale(.8)
    }
}

@keyframes udZoomRightIn {
    0% {
        transform-origin: 100%;
        opacity: 0;
        transform: scale(.8)
    }

    to {
        transform-origin: 100%;
        transform: scale(1)
    }
}

@keyframes udZoomRightOut {
    0% {
        transform-origin: 100%;
        transform: scale(1)
    }

    to {
        transform-origin: 100%;
        opacity: 0;
        transform: scale(.8)
    }
}

@keyframes udZoomDownIn {
    0% {
        transform-origin: 50% 100%;
        opacity: 0;
        transform: scale(.8)
    }

    to {
        transform-origin: 50% 100%;
        transform: scale(1)
    }
}

@keyframes udZoomDownOut {
    0% {
        transform-origin: 50% 100%;
        transform: scale(1)
    }

    to {
        transform-origin: 50% 100%;
        opacity: 0;
        transform: scale(.8)
    }
}

.ud-motion-collapse {
    overflow: hidden;
    transition: height .2s cubic-bezier(.645, .045, .355, 1), opacity .2s cubic-bezier(.645, .045, .355, 1) !important
}


.reset_focus_outline:focus {
    --hack-merge-rules: true;
    outline: none
}

.reset_focus_outline:focus-visible {
    outline: none
}

.ud__button {
    box-sizing: border-box;
    color: #1f2329;
    font-variant: tabular-nums;
    white-space: nowrap;
    text-align: center;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    touch-action: manipulation;
    background: 0 0;
    border: 1px solid #fff;
    outline: none;
    margin: 0;
    padding: 0;
    font-size: 14px;
    line-height: 1.5715;
    text-decoration: none;
    list-style: none;
    transition: color .1s ease-in, background-color .1s ease-in, border-color .1s ease-in, width .2s ease-in;
    display: inline-block;
    position: relative
}

.ud__button>a:only-child {
    color: currentColor
}

.ud__button>a:only-child:after {
    content: "";
    background: 0 0;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0
}

.ud__button--size-xs {
    border-radius: 4px;
    min-width: 48px;
    height: 24px;
    padding: 1px 7px;
    font-size: 12px;
    line-height: 20px
}

.ud__button--size-xs.ud__button--square,
.ud__button--size-xs.ud__button--circle {
    width: 24px;
    min-width: initial;
    text-align: center;
    padding-left: initial;
    padding-right: initial
}

.ud__button--size-sm {
    border-radius: 4px;
    min-width: 48px;
    height: 28px;
    padding: 3px 7px;
    font-size: 12px;
    line-height: 20px
}

.ud__button--size-sm.ud__button--square,
.ud__button--size-sm.ud__button--circle {
    width: 28px;
    min-width: initial;
    text-align: center;
    padding-left: initial;
    padding-right: initial
}

.ud__button--size-md {
    border-radius: 4px;
    min-width: 80px;
    height: 32px;
    padding: 4px 11px;
    font-size: 14px;
    line-height: 22px
}

.ud__button--size-md.ud__button--square,
.ud__button--size-md.ud__button--circle {
    width: 32px;
    min-width: initial;
    text-align: center;
    padding-left: initial;
    padding-right: initial
}

.ud__button--size-lg {
    border-radius: 4px;
    min-width: 96px;
    height: 40px;
    padding: 7px 15px;
    font-size: 16px;
    line-height: 24px
}

.ud__button--size-lg.ud__button--square,
.ud__button--size-lg.ud__button--circle {
    width: 40px;
    min-width: initial;
    text-align: center;
    padding-left: initial;
    padding-right: initial
}

.ud__button--size-xl {
    border-radius: 4px;
    min-width: 100px;
    height: 48px;
    padding: 10px 15px;
    font-size: 18px;
    line-height: 26px
}

.ud__button--size-xl.ud__button--square,
.ud__button--size-xl.ud__button--circle {
    width: 48px;
    min-width: initial;
    text-align: center;
    padding-left: initial;
    padding-right: initial
}

.ud__button--circle {
    border-radius: 50%
}

.ud__button--round {
    border-radius: 999999px
}

.ud__button--filled-default {
    color: #fff;
    background: #3370ff;
    border-color: #3370ff
}

.ud__button--filled-default:hover {
    color: #fff;
    background: #4e83fd;
    border-color: #4e83fd
}

.ud__button--filled-default:focus-visible {
    color: #fff;
    --hack-merge-rules: true;
    background: #4e83fd;
    border-color: #4e83fd
}

.ud__button--filled-default:active {
    color: #fff;
    background: #245bdb;
    border-color: #245bdb
}

.ud__button--filled-default-loading,
.ud__button--filled-default-loading:hover,
.ud__button--filled-default-loading:active {
    color: #fff;
    cursor: default;
    background: #82a7fc;
    border-color: #82a7fc
}

.ud__button--filled-default-loading:focus-visible {
    color: #fff;
    cursor: default;
    --hack-merge-rules: true;
    background: #82a7fc;
    border-color: #82a7fc
}

.ud__button--filled-default-loading .ud__button__loading-icon {
    color: #fff
}

.ud__button--filled-primary {
    color: #fff;
    background: #3370ff;
    border-color: #3370ff
}

.ud__button--filled-primary:hover {
    color: #fff;
    background: #4e83fd;
    border-color: #4e83fd
}

.ud__button--filled-primary:focus-visible {
    color: #fff;
    --hack-merge-rules: true;
    background: #4e83fd;
    border-color: #4e83fd
}

.ud__button--filled-primary:active {
    color: #fff;
    background: #245bdb;
    border-color: #245bdb
}

.ud__button--filled-primary-loading,
.ud__button--filled-primary-loading:hover,
.ud__button--filled-primary-loading:active {
    color: #fff;
    cursor: default;
    background: #82a7fc;
    border-color: #82a7fc
}

.ud__button--filled-primary-loading:focus-visible {
    color: #fff;
    cursor: default;
    --hack-merge-rules: true;
    background: #82a7fc;
    border-color: #82a7fc
}

.ud__button--filled-primary-loading .ud__button__loading-icon {
    color: #fff
}

.ud__button--filled-danger {
    color: #fff;
    background: #f54a45;
    border-color: #f54a45
}

.ud__button--filled-danger:hover {
    color: #fff;
    background: #f76964;
    border-color: #f76964
}

.ud__button--filled-danger:focus-visible {
    color: #fff;
    --hack-merge-rules: true;
    background: #f76964;
    border-color: #f76964
}

.ud__button--filled-danger:active {
    color: #fff;
    background: #d83931;
    border-color: #d83931
}

.ud__button--filled-danger-loading,
.ud__button--filled-danger-loading:hover,
.ud__button--filled-danger-loading:active {
    color: #fff;
    cursor: default;
    background: #f98e8b;
    border-color: #f98e8b
}

.ud__button--filled-danger-loading:focus-visible {
    color: #fff;
    cursor: default;
    --hack-merge-rules: true;
    background: #f98e8b;
    border-color: #f98e8b
}

.ud__button--filled-danger-loading .ud__button__loading-icon {
    color: #fff
}

.ud__button--filled[disabled],
.ud__button--filled:disabled,
.ud__button--filled[disabled]:hover,
.ud__button--filled:disabled:hover,
.ud__button--filled[disabled]:active,
.ud__button--filled:disabled:active {
    color: #fff;
    cursor: not-allowed;
    background: #bbbfc4;
    border-color: #bbbfc4
}

.ud__button--filled[disabled]:focus-visible {
    color: #fff;
    cursor: not-allowed;
    --hack-merge-rules: true;
    background: #bbbfc4;
    border-color: #bbbfc4
}

.ud__button--filled:disabled:focus-visible {
    color: #fff;
    cursor: not-allowed;
    --hack-merge-rules: true;
    background: #bbbfc4;
    border-color: #bbbfc4
}

.ud__button--outlined-default {
    color: #1f2329;
    background: #fff;
    border-color: #bbbfc4
}

.ud__button--outlined-default:hover {
    color: #1f2329;
    background: #f2f3f5;
    border-color: #bbbfc4
}

.ud__button--outlined-default:focus-visible {
    color: #1f2329;
    --hack-merge-rules: true;
    background: #f2f3f5;
    border-color: #bbbfc4
}

.ud__button--outlined-default:active {
    color: #1f2329;
    background: #eff0f1;
    border-color: #bbbfc4
}

.ud__button--outlined-default-loading,
.ud__button--outlined-default-loading:hover,
.ud__button--outlined-default-loading:active {
    color: #8f959e;
    cursor: default;
    background: #fff;
    border-color: #bbbfc4
}

.ud__button--outlined-default-loading:focus-visible {
    color: #8f959e;
    cursor: default;
    --hack-merge-rules: true;
    background: #fff;
    border-color: #bbbfc4
}

.ud__button--outlined-default-loading .ud__button__loading-icon {
    color: #3370ff
}

.ud__button--outlined-primary {
    color: #3370ff;
    background: #fff;
    border-color: #3370ff
}

.ud__button--outlined-primary:hover {
    color: #3370ff;
    background: #e1eaff;
    border-color: #3370ff
}

.ud__button--outlined-primary:focus-visible {
    color: #3370ff;
    --hack-merge-rules: true;
    background: #e1eaff;
    border-color: #3370ff
}

.ud__button--outlined-primary:active {
    color: #3370ff;
    background: #bacefd;
    border-color: #3370ff
}

.ud__button--outlined-primary-loading,
.ud__button--outlined-primary-loading:hover,
.ud__button--outlined-primary-loading:active {
    color: #82a7fc;
    cursor: default;
    background: #fff;
    border-color: #82a7fc
}

.ud__button--outlined-primary-loading:focus-visible {
    color: #82a7fc;
    cursor: default;
    --hack-merge-rules: true;
    background: #fff;
    border-color: #82a7fc
}

.ud__button--outlined-primary-loading .ud__button__loading-icon {
    color: #3370ff
}

.ud__button--outlined-danger {
    color: #f54a45;
    background: #fff;
    border-color: #f54a45
}

.ud__button--outlined-danger:hover {
    color: #f54a45;
    background: #fde2e2;
    border-color: #f54a45
}

.ud__button--outlined-danger:focus-visible {
    color: #f54a45;
    --hack-merge-rules: true;
    background: #fde2e2;
    border-color: #f54a45
}

.ud__button--outlined-danger:active {
    color: #f54a45;
    background: #fbbfbc;
    border-color: #f54a45
}

.ud__button--outlined-danger-loading,
.ud__button--outlined-danger-loading:hover,
.ud__button--outlined-danger-loading:active {
    color: #f98e8b;
    cursor: default;
    background: #fff;
    border-color: #f98e8b
}

.ud__button--outlined-danger-loading:focus-visible {
    color: #f98e8b;
    cursor: default;
    --hack-merge-rules: true;
    background: #fff;
    border-color: #f98e8b
}

.ud__button--outlined-danger-loading .ud__button__loading-icon {
    color: #f54a45
}

.ud__button--outlined[disabled],
.ud__button--outlined:disabled,
.ud__button--outlined[disabled]:hover,
.ud__button--outlined:disabled:hover,
.ud__button--outlined[disabled]:active,
.ud__button--outlined:disabled:active {
    color: #bbbfc4;
    cursor: not-allowed;
    background: #fff;
    border-color: #bbbfc4
}

.ud__button--outlined[disabled]:focus-visible {
    color: #bbbfc4;
    cursor: not-allowed;
    --hack-merge-rules: true;
    background: #fff;
    border-color: #bbbfc4
}

.ud__button--outlined:disabled:focus-visible {
    color: #bbbfc4;
    cursor: not-allowed;
    --hack-merge-rules: true;
    background: #fff;
    border-color: #bbbfc4
}

.ud__button--text {
    height: initial;
    min-width: initial;
    border: none;
    padding: 2px 4px
}

.ud__button--text-default {
    color: #1f2329;
    background: 0 0;
    border-color: transparent
}

.ud__button--text-default-selected,
.ud__button--text-default:hover {
    color: #1f2329;
    background: rgba(31, 35, 41, .1);
    border-color: transparent
}

.ud__button--text-default:focus-visible {
    color: #1f2329;
    --hack-merge-rules: true;
    background: rgba(31, 35, 41, .1);
    border-color: transparent
}

.ud__button--text-default:active {
    color: #1f2329;
    background: rgba(31, 35, 41, .2);
    border-color: transparent
}

.ud__button--text-default-loading,
.ud__button--text-default-loading:hover,
.ud__button--text-default-loading:active {
    color: #8f959e;
    cursor: default;
    background: 0 0;
    border-color: transparent
}

.ud__button--text-default-loading:focus-visible {
    color: #8f959e;
    cursor: default;
    --hack-merge-rules: true;
    background: 0 0;
    border-color: transparent
}

.ud__button--text-default-loading .ud__button__loading-icon {
    color: #3370ff
}

.ud__button--text-primary {
    color: #3370ff;
    background: 0 0;
    border-color: transparent
}

.ud__button--text-primary-selected,
.ud__button--text-primary:hover {
    color: #3370ff;
    background: rgba(51, 112, 255, .1);
    border-color: transparent
}

.ud__button--text-primary:focus-visible {
    color: #3370ff;
    --hack-merge-rules: true;
    background: rgba(51, 112, 255, .1);
    border-color: transparent
}

.ud__button--text-primary:active {
    color: #3370ff;
    background: rgba(51, 112, 255, .2);
    border-color: transparent
}

.ud__button--text-primary-loading,
.ud__button--text-primary-loading:hover,
.ud__button--text-primary-loading:active {
    color: #82a7fc;
    cursor: default;
    background: 0 0;
    border-color: transparent
}

.ud__button--text-primary-loading:focus-visible {
    color: #82a7fc;
    cursor: default;
    --hack-merge-rules: true;
    background: 0 0;
    border-color: transparent
}

.ud__button--text-primary-loading .ud__button__loading-icon {
    color: #3370ff
}

.ud__button--text-danger {
    color: #f54a45;
    background: 0 0;
    border-color: transparent
}

.ud__button--text-danger-selected,
.ud__button--text-danger:hover {
    color: #f54a45;
    background: rgba(245, 74, 69, .1);
    border-color: transparent
}

.ud__button--text-danger:focus-visible {
    color: #f54a45;
    --hack-merge-rules: true;
    background: rgba(245, 74, 69, .1);
    border-color: transparent
}

.ud__button--text-danger:active {
    color: #f54a45;
    background: rgba(245, 74, 69, .2);
    border-color: transparent
}

.ud__button--text-danger-loading,
.ud__button--text-danger-loading:hover,
.ud__button--text-danger-loading:active {
    color: #f98e8b;
    cursor: default;
    background: 0 0;
    border-color: transparent
}

.ud__button--text-danger-loading:focus-visible {
    color: #f98e8b;
    cursor: default;
    --hack-merge-rules: true;
    background: 0 0;
    border-color: transparent
}

.ud__button--text-danger-loading .ud__button__loading-icon {
    color: #f54a45
}

.ud__button--text[disabled],
.ud__button--text:disabled,
.ud__button--text[disabled]:hover,
.ud__button--text:disabled:hover,
.ud__button--text[disabled]:active,
.ud__button--text:disabled:active {
    color: #bbbfc4;
    cursor: not-allowed;
    background: 0 0;
    border-color: transparent
}

.ud__button--text[disabled]:focus-visible {
    color: #bbbfc4;
    cursor: not-allowed;
    --hack-merge-rules: true;
    background: 0 0;
    border-color: transparent
}

.ud__button--text:disabled:focus-visible {
    color: #bbbfc4;
    cursor: not-allowed;
    --hack-merge-rules: true;
    background: 0 0;
    border-color: transparent
}

.ud__button--text-secondary {
    height: initial;
    padding: initial;
    min-width: initial;
    border: none
}

.ud__button--text-secondary-default {
    color: #1f2329;
    background: 0 0;
    border-color: transparent
}

.ud__button--text-secondary-default-selected,
.ud__button--text-secondary-default:hover {
    color: #3370ff;
    background: 0 0;
    border-color: transparent
}

.ud__button--text-secondary-default:focus-visible {
    color: #3370ff;
    --hack-merge-rules: true;
    background: 0 0;
    border-color: transparent
}

.ud__button--text-secondary-default:active {
    color: #245bdb;
    background: 0 0;
    border-color: transparent
}

.ud__button--text-secondary-default-loading,
.ud__button--text-secondary-default-loading:hover,
.ud__button--text-secondary-default-loading:active {
    color: #3370ff;
    cursor: default;
    background: 0 0;
    border-color: transparent
}

.ud__button--text-secondary-default-loading:focus-visible {
    color: #3370ff;
    cursor: default;
    --hack-merge-rules: true;
    background: 0 0;
    border-color: transparent
}

.ud__button--text-secondary-default-loading .ud__button__loading-icon {
    color: #3370ff
}

.ud__button--text-secondary-primary {
    color: #1f2329;
    background: 0 0;
    border-color: transparent
}

.ud__button--text-secondary-primary-selected,
.ud__button--text-secondary-primary:hover {
    color: #3370ff;
    background: 0 0;
    border-color: transparent
}

.ud__button--text-secondary-primary:focus-visible {
    color: #3370ff;
    --hack-merge-rules: true;
    background: 0 0;
    border-color: transparent
}

.ud__button--text-secondary-primary:active {
    color: #245bdb;
    background: 0 0;
    border-color: transparent
}

.ud__button--text-secondary-primary-loading,
.ud__button--text-secondary-primary-loading:hover,
.ud__button--text-secondary-primary-loading:active {
    color: #3370ff;
    cursor: default;
    background: 0 0;
    border-color: transparent
}

.ud__button--text-secondary-primary-loading:focus-visible {
    color: #3370ff;
    cursor: default;
    --hack-merge-rules: true;
    background: 0 0;
    border-color: transparent
}

.ud__button--text-secondary-primary-loading .ud__button__loading-icon {
    color: #3370ff
}

.ud__button--text-secondary-danger {
    color: #1f2329;
    background: 0 0;
    border-color: transparent
}

.ud__button--text-secondary-danger-selected,
.ud__button--text-secondary-danger:hover {
    color: #f54a45;
    background: 0 0;
    border-color: transparent
}

.ud__button--text-secondary-danger:focus-visible {
    color: #f54a45;
    --hack-merge-rules: true;
    background: 0 0;
    border-color: transparent
}

.ud__button--text-secondary-danger:active {
    color: #d83931;
    background: 0 0;
    border-color: transparent
}

.ud__button--text-secondary-danger-loading,
.ud__button--text-secondary-danger-loading:hover,
.ud__button--text-secondary-danger-loading:active {
    color: #3370ff;
    cursor: default;
    background: 0 0;
    border-color: transparent
}

.ud__button--text-secondary-danger-loading:focus-visible {
    color: #3370ff;
    cursor: default;
    --hack-merge-rules: true;
    background: 0 0;
    border-color: transparent
}

.ud__button--text-secondary-danger-loading .ud__button__loading-icon {
    color: #f54a45
}

.ud__button--text-secondary[disabled],
.ud__button--text-secondary:disabled,
.ud__button--text-secondary[disabled]:hover,
.ud__button--text-secondary:disabled:hover,
.ud__button--text-secondary[disabled]:active,
.ud__button--text-secondary:disabled:active {
    color: #bbbfc4;
    cursor: not-allowed;
    background: 0 0;
    border-color: transparent
}

.ud__button--text-secondary[disabled]:focus-visible {
    color: #bbbfc4;
    cursor: not-allowed;
    --hack-merge-rules: true;
    background: 0 0;
    border-color: transparent
}

.ud__button--text-secondary:disabled:focus-visible {
    color: #bbbfc4;
    cursor: not-allowed;
    --hack-merge-rules: true;
    background: 0 0;
    border-color: transparent
}

.ud__button--link {
    height: initial;
    padding: initial;
    min-width: initial;
    border: none
}

.ud__button--link-default {
    color: #3370ff;
    background: 0 0;
    border-color: transparent
}

.ud__button--link-default-selected,
.ud__button--link-default:hover {
    color: #4e83fd;
    background: 0 0;
    border-color: transparent
}

.ud__button--link-default:focus-visible {
    color: #4e83fd;
    --hack-merge-rules: true;
    background: 0 0;
    border-color: transparent
}

.ud__button--link-default:active {
    color: #245bdb;
    background: 0 0;
    border-color: transparent
}

.ud__button--link-default-loading,
.ud__button--link-default-loading:hover,
.ud__button--link-default-loading:active {
    color: #82a7fc;
    cursor: default;
    background: 0 0;
    border-color: transparent
}

.ud__button--link-default-loading:focus-visible {
    color: #82a7fc;
    cursor: default;
    --hack-merge-rules: true;
    background: 0 0;
    border-color: transparent
}

.ud__button--link-default-loading .ud__button__loading-icon {
    color: #3370ff
}

.ud__button--link-primary {
    color: #3370ff;
    background: 0 0;
    border-color: transparent
}

.ud__button--link-primary-selected,
.ud__button--link-primary:hover {
    color: #4e83fd;
    background: 0 0;
    border-color: transparent
}

.ud__button--link-primary:focus-visible {
    color: #4e83fd;
    --hack-merge-rules: true;
    background: 0 0;
    border-color: transparent
}

.ud__button--link-primary:active {
    color: #245bdb;
    background: 0 0;
    border-color: transparent
}

.ud__button--link-primary-loading,
.ud__button--link-primary-loading:hover,
.ud__button--link-primary-loading:active {
    color: #82a7fc;
    cursor: default;
    background: 0 0;
    border-color: transparent
}

.ud__button--link-primary-loading:focus-visible {
    color: #82a7fc;
    cursor: default;
    --hack-merge-rules: true;
    background: 0 0;
    border-color: transparent
}

.ud__button--link-primary-loading .ud__button__loading-icon {
    color: #3370ff
}

.ud__button--link-danger {
    color: #f54a45;
    background: 0 0;
    border-color: transparent
}

.ud__button--link-danger-selected,
.ud__button--link-danger:hover {
    color: #f76964;
    background: 0 0;
    border-color: transparent
}

.ud__button--link-danger:focus-visible {
    color: #f76964;
    --hack-merge-rules: true;
    background: 0 0;
    border-color: transparent
}

.ud__button--link-danger:active {
    color: #d83931;
    background: 0 0;
    border-color: transparent
}

.ud__button--link-danger-loading,
.ud__button--link-danger-loading:hover,
.ud__button--link-danger-loading:active {
    color: #f98e8b;
    cursor: default;
    background: 0 0;
    border-color: transparent
}

.ud__button--link-danger-loading:focus-visible {
    color: #f98e8b;
    cursor: default;
    --hack-merge-rules: true;
    background: 0 0;
    border-color: transparent
}

.ud__button--link-danger-loading .ud__button__loading-icon {
    color: #f54a45
}

.ud__button--link[disabled],
.ud__button--link:disabled,
.ud__button--link[disabled]:hover,
.ud__button--link:disabled:hover,
.ud__button--link[disabled]:active,
.ud__button--link:disabled:active {
    color: #bbbfc4;
    cursor: not-allowed;
    background: 0 0;
    border-color: transparent
}

.ud__button--link[disabled]:focus-visible {
    color: #bbbfc4;
    cursor: not-allowed;
    --hack-merge-rules: true;
    background: 0 0;
    border-color: transparent
}

.ud__button--link:disabled:focus-visible {
    color: #bbbfc4;
    cursor: not-allowed;
    --hack-merge-rules: true;
    background: 0 0;
    border-color: transparent
}

.ud__button--icon {
    min-width: initial;
    height: initial;
    border: none;
    padding: 4px;
    line-height: 0
}

.ud__button--icon.ud__button--square,
.ud__button--icon.ud__button--circle {
    width: initial;
    padding: 4px
}

.ud__button--icon-default {
    color: #2b2f36;
    background: 0 0;
    border-color: transparent
}

.ud__button--icon-default-selected,
.ud__button--icon-default:hover {
    color: #2b2f36;
    background: rgba(31, 35, 41, .1);
    border-color: transparent
}

.ud__button--icon-default:focus-visible {
    color: #2b2f36;
    --hack-merge-rules: true;
    background: rgba(31, 35, 41, .1);
    border-color: transparent
}

.ud__button--icon-default:active {
    color: #2b2f36;
    background: rgba(31, 35, 41, .2);
    border-color: transparent
}

.ud__button--icon-default-loading,
.ud__button--icon-default-loading:hover,
.ud__button--icon-default-loading:active {
    color: #8f959e;
    cursor: default;
    background: 0 0;
    border-color: transparent
}

.ud__button--icon-default-loading:focus-visible {
    color: #8f959e;
    cursor: default;
    --hack-merge-rules: true;
    background: 0 0;
    border-color: transparent
}

.ud__button--icon-default-loading .ud__button__loading-icon {
    color: #3370ff
}

.ud__button--icon-default-selected:hover {
    background-color: rgba(31, 35, 41, .2)
}

.ud__button--icon-primary {
    color: #3370ff;
    background: 0 0;
    border-color: transparent
}

.ud__button--icon-primary-selected,
.ud__button--icon-primary:hover {
    color: #3370ff;
    background: rgba(51, 112, 255, .1);
    border-color: transparent
}

.ud__button--icon-primary:focus-visible {
    color: #3370ff;
    --hack-merge-rules: true;
    background: rgba(51, 112, 255, .1);
    border-color: transparent
}

.ud__button--icon-primary:active {
    color: #3370ff;
    background: rgba(51, 112, 255, .2);
    border-color: transparent
}

.ud__button--icon-primary-loading,
.ud__button--icon-primary-loading:hover,
.ud__button--icon-primary-loading:active {
    color: #82a7fc;
    cursor: default;
    background: 0 0;
    border-color: transparent
}

.ud__button--icon-primary-loading:focus-visible {
    color: #82a7fc;
    cursor: default;
    --hack-merge-rules: true;
    background: 0 0;
    border-color: transparent
}

.ud__button--icon-primary-loading .ud__button__loading-icon {
    color: #3370ff
}

.ud__button--icon-primary-selected:hover {
    background-color: rgba(51, 112, 255, .2)
}

.ud__button--icon-danger {
    color: #f54a45;
    background: 0 0;
    border-color: transparent
}

.ud__button--icon-danger-selected,
.ud__button--icon-danger:hover {
    color: #f54a45;
    background: rgba(245, 74, 69, .1);
    border-color: transparent
}

.ud__button--icon-danger:focus-visible {
    color: #f54a45;
    --hack-merge-rules: true;
    background: rgba(245, 74, 69, .1);
    border-color: transparent
}

.ud__button--icon-danger:active {
    color: #f54a45;
    background: rgba(245, 74, 69, .2);
    border-color: transparent
}

.ud__button--icon-danger-loading,
.ud__button--icon-danger-loading:hover,
.ud__button--icon-danger-loading:active {
    color: #f98e8b;
    cursor: default;
    background: 0 0;
    border-color: transparent
}

.ud__button--icon-danger-loading:focus-visible {
    color: #f98e8b;
    cursor: default;
    --hack-merge-rules: true;
    background: 0 0;
    border-color: transparent
}

.ud__button--icon-danger-loading .ud__button__loading-icon {
    color: #f54a45
}

.ud__button--icon-danger-selected:hover {
    background-color: rgba(245, 74, 69, .2)
}

.ud__button--icon[disabled],
.ud__button--icon:disabled,
.ud__button--icon[disabled]:hover,
.ud__button--icon:disabled:hover,
.ud__button--icon[disabled]:active,
.ud__button--icon:disabled:active {
    color: #bbbfc4;
    cursor: not-allowed;
    background: 0 0;
    border-color: transparent
}

.ud__button--icon[disabled]:focus-visible {
    color: #bbbfc4;
    cursor: not-allowed;
    --hack-merge-rules: true;
    background: 0 0;
    border-color: transparent
}

.ud__button--icon:disabled:focus-visible {
    color: #bbbfc4;
    cursor: not-allowed;
    --hack-merge-rules: true;
    background: 0 0;
    border-color: transparent
}

.ud__button--icon-size-xs {
    border-radius: 4px;
    font-size: 12px
}

.ud__button--icon-size-sm {
    border-radius: 4px;
    font-size: 16px
}

.ud__button--icon-size-md {
    border-radius: 4px;
    font-size: 20px
}

.ud__button--icon-size-lg {
    border-radius: 4px;
    font-size: 24px
}

.ud__button--icon-size-xl {
    border-radius: 4px;
    font-size: 28px
}

.ud__button__loading-icon {
    box-sizing: border-box;
    line-height: 1
}

.ud__button__loading-icon svg {
    vertical-align: -.15em;
    display: inline-block
}

.ud__button__icon-inline {
    box-sizing: border-box;
    line-height: 0;
    display: inline-block
}

.ud__button__icon-inline-start {
    margin-right: 4px
}

.ud__button__icon-inline-end {
    margin-left: 4px
}

.ud__button--size-sm .ud__button__icon-inline,
.ud__button--size-xs .ud__button__icon-inline {
    margin-right: 2px
}

.ud__button--autowidth {
    min-width: initial
}

.ud__button--block {
    width: 100%
}

.ud__button--loading {
    position: relative
}

.ud__button--loading:not([disabled]) {
    pointer-events: none
}


.reset_focus_outline:focus {
    --hack-merge-rules: true;
    outline: none
}

.reset_focus_outline:focus-visible {
    outline: none
}

.ud__notice.ud__notice-success .ud__notice__statusIcon {
    color: #34c724
}

.ud__notice.ud__notice-info .ud__notice__statusIcon {
    color: #3370ff
}

.ud__notice.ud__notice-warning .ud__notice__statusIcon {
    color: #f80
}

.ud__notice.ud__notice-error .ud__notice__statusIcon {
    color: #f54a45
}

.ud__notice.ud__notice--outlined {
    border: 1px solid transparent;
    padding: 15px 3px 15px 19px;
    font-weight: 500
}

.ud__notice.ud__notice--outlined.ud__os-mac,
.ud__os-mac .ud__notice.ud__notice--outlined {
    font-weight: 500
}

.ud__notice.ud__notice--outlined.ud__os-win,
.ud__os-win .ud__notice.ud__notice--outlined {
    font-weight: 600
}

.ud__notice.ud__notice--outlined.ud__notice-info {
    background-color: #f0f4ff;
    border-color: #3370ff
}

.ud__notice.ud__notice--outlined.ud__notice-info .ud__notice--ellipsis .ud__notice__description-content:after {
    background-color: #f0f4ff
}

.ud__notice.ud__notice--outlined.ud__notice-success {
    background-color: #f0fbef;
    border-color: #34c724
}

.ud__notice.ud__notice--outlined.ud__notice-success .ud__notice--ellipsis .ud__notice__description-content:after {
    background-color: #f0fbef
}

.ud__notice.ud__notice--outlined.ud__notice-warning {
    background-color: #fff5eb;
    border-color: #f80
}

.ud__notice.ud__notice--outlined.ud__notice-warning .ud__notice--ellipsis .ud__notice__description-content:after {
    background-color: #fff5eb
}

.ud__notice.ud__notice--outlined.ud__notice-error {
    background-color: #fef1f1;
    border-color: #f54a45
}

.ud__notice.ud__notice--outlined.ud__notice-error .ud__notice--ellipsis .ud__notice__description-content:after {
    background-color: #fef1f1
}

.ud__notice.ud__notice--plain {
    background-color: #fff;
    border: 1px solid transparent;
    padding: 15px 3px 15px 19px;
    font-weight: 500;
    box-shadow: 0 4px 8px rgba(31, 35, 41, .1)
}

.ud__notice.ud__notice--plain.ud__os-mac,
.ud__os-mac .ud__notice.ud__notice--plain {
    font-weight: 500
}

.ud__notice.ud__notice--plain.ud__os-win,
.ud__os-win .ud__notice.ud__notice--plain {
    font-weight: 600
}

.ud__notice.ud__notice--plain.ud__notice-info .ud__notice--ellipsis .ud__notice__description-content:after,
.ud__notice.ud__notice--plain.ud__notice-success .ud__notice--ellipsis .ud__notice__description-content:after,
.ud__notice.ud__notice--plain.ud__notice-warning .ud__notice--ellipsis .ud__notice__description-content:after,
.ud__notice.ud__notice--plain.ud__notice-error .ud__notice--ellipsis .ud__notice__description-content:after {
    background-color: #fff
}

.ud__notice.ud__notice--filled {
    padding: 9px 0 9px 16px
}

.ud__notice.ud__notice--filled.ud__notice-success {
    background-color: #d9f5d6
}

.ud__notice.ud__notice--filled.ud__notice-success .ud__notice--ellipsis .ud__notice__description-content:after,
.ud__notice.ud__notice--filled.ud__notice-info,
.ud__notice.ud__notice--filled.ud__notice-info .ud__notice--ellipsis .ud__notice__description-content:after {
    background-color: #e1eaff
}

.ud__notice.ud__notice--filled.ud__notice-warning,
.ud__notice.ud__notice--filled.ud__notice-warning .ud__notice--ellipsis .ud__notice__description-content:after {
    background-color: #feead2
}

.ud__notice.ud__notice--filled.ud__notice-error,
.ud__notice.ud__notice--filled.ud__notice-error .ud__notice--ellipsis .ud__notice__description-content:after {
    background-color: #fde2e2
}

.ud__notice {
    overflow: hidden
}

.ud__notice .ud__notice__main {
    margin-right: -16px
}

.ud__notice {
    box-sizing: border-box;
    color: #1f2329;
    font-variant: tabular-nums;
    text-align: left;
    pointer-events: auto;
    border-radius: 4px;
    align-items: center;
    margin: 0;
    padding: 0;
    font-size: 14px;
    line-height: 1.5715;
    list-style: none;
    display: flex
}

.ud__notice .ud__notice--multiline .ud__notice__description-action {
    width: 100%
}

.ud__notice .ud__notice--ellipsis .ud__notice__description-content {
    height: 100%;
    position: relative;
    overflow: hidden
}

.ud__notice .ud__notice--ellipsis .ud__notice__description-content:after {
    content: "...";
    background-color: #fff;
    padding: 0 5px;
    position: absolute;
    bottom: 0;
    right: 0
}

.ud__notice .ud__notice__statusIcon {
    box-sizing: border-box;
    flex-shrink: 0;
    align-self: baseline;
    margin-top: 3px;
    margin-right: 8px;
    font-size: 16px;
    line-height: 0;
    display: inline-block
}

.ud__notice .ud__notice__main {
    box-sizing: border-box;
    flex-flow: column;
    flex-grow: 1;
    display: flex
}

.ud__notice .ud__notice__main.ud__notice__main--no-title {
    flex-flow: row;
    align-items: flex-start
}

.ud__notice .ud__notice__main.ud__notice__main--no-title .ud__button--content {
    margin-top: 0
}

.ud__notice .ud__notice__title {
    box-sizing: border-box;
    text-align: left;
    white-space: normal;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 4px;
    padding-right: 32px;
    font-weight: 500;
    display: flex
}

.ud__notice .ud__notice__title.ud__os-mac,
.ud__os-mac .ud__notice .ud__notice__title {
    font-weight: 500
}

.ud__notice .ud__notice__title.ud__os-win,
.ud__os-win .ud__notice .ud__notice__title {
    font-weight: 600
}

.ud__notice.ud__notice-banner {
    border: 0;
    border-radius: 0;
    margin-bottom: 0
}

.ud__notice.ud__notice-align-center {
    justify-content: center;
    padding-left: 32px;
    padding-right: 32px;
    position: relative
}

.ud__notice.ud__notice-align-center .ud__notice__main {
    flex-grow: 0
}

.ud__notice.ud__notice-align-center .ud__notice__description-content {
    margin-right: 0
}

.ud__notice.ud__notice-align-center .ud__notice__close {
    position: absolute;
    right: 16px
}

.ud__notice .ud__notice__close {
    color: #646a73;
    flex: none;
    margin: 0 32px 0 -20px
}

.ud__notice .ud__notice__close.ud__button--icon {
    margin: -1px 28px -1px -20px
}

.ud__notice .ud__notice__description {
    box-sizing: border-box;
    flex-wrap: wrap;
    flex-grow: 1;
    justify-content: space-between;
    align-items: center;
    display: flex
}

.ud__notice .ud__notice__description .ud__notice__description-content {
    box-sizing: border-box;
    word-break: break-word;
    -webkit-box-orient: vertical;
    flex-grow: 1;
    padding-right: 32px;
    display: -webkit-box;
    overflow: hidden
}

.ud__notice .ud__notice__description .ud__notice__description-action {
    padding-right: 32px
}

.ud__notice.ud__notice-has-title .ud__notice__close,
.ud__notice.ud__notice-align-center .ud__notice__close {
    margin: 0 0 0 16px
}

.ud__notice.ud__notice-has-title .ud__notice__close.ud__button--icon,
.ud__notice.ud__notice-align-center .ud__notice__close.ud__button--icon {
    margin: -1px -4px -1px 12px
}

.ud__notice.ud__notice-align-center .ud__notice__description-content,
.ud__notice.ud__notice-align-center .ud__notice__description-action {
    padding-right: 16px
}

.ud__notice .ud__notice-align-center.ud__notice-has-action .ud__notice__description-content,
.ud__notice .ud__notice-align-center.ud__notice-closable .ud__notice__description-action {
    padding-right: 32px
}


.reset_focus_outline:focus {
    --hack-merge-rules: true;
    outline: none
}

.reset_focus_outline:focus-visible {
    outline: none
}

.ud__msg-manager {
    box-sizing: border-box;
    color: #1f2329;
    font-variant: tabular-nums;
    z-index: 1010;
    pointer-events: none;
    margin: 0;
    padding: 0;
    font-size: 14px;
    line-height: 1.5715;
    list-style: none;
    position: fixed
}

.ud__msg-manager.ud__msg-manager--sticky {
    position: absolute
}

.ud__msg-manager .ud__msg-manager-item {
    pointer-events: none
}

.ud__msg-manager.ud__msg-manager--topLeft {
    top: 16px;
    bottom: auto;
    left: 16px
}

.ud__msg-manager.ud__msg-manager--topRight {
    top: 16px;
    bottom: auto;
    right: 16px
}

.ud__msg-manager.ud__msg-manager--bottomLeft {
    top: auto;
    bottom: 16px;
    left: 16px
}

.ud__msg-manager.ud__msg-manager--bottomRight {
    top: auto;
    bottom: 16px;
    right: 16px
}

.ud__msg-manager.ud__msg-manager--top {
    text-align: center;
    width: 100%;
    padding: 0 16px 16px
}

.ud__msg-manager-item {
    box-sizing: border-box;
    transition: height .4s cubic-bezier(.645, .045, .355, 1), margin-bottom .4s cubic-bezier(.645, .045, .355, 1)
}

.ud__msg-manager-item.notification-animation-enter .ud__notification {
    opacity: 0
}

.ud__msg-manager-item.notification-animation-enter-done .ud__notification,
.ud__msg-manager-item.notification-animation-enter-active .ud__notification,
.ud__msg-manager-item.notification-animation-exit .ud__notification {
    opacity: 1
}

.ud__msg-manager-item.notification-animation-exit-active {
    margin-bottom: 0
}

.ud__msg-manager-item.notification-animation-exit-active .ud__notification {
    opacity: 0
}

.ud__msg-manager--topLeft .ud__notification__notice-content,
.ud__msg-manager--bottomLeft .ud__notification__notice-content {
    float: left
}

.ud__msg-manager--topLeft .notification-animation-enter .ud__notification,
.ud__msg-manager--bottomLeft .notification-animation-enter .ud__notification {
    transform: translate(-100%)translateY(0)
}

.ud__msg-manager--topLeft .notification-animation-enter-done .ud__notification,
.ud__msg-manager--bottomLeft .notification-animation-enter-done .ud__notification,
.ud__msg-manager--topLeft .notification-animation-enter-active .ud__notification,
.ud__msg-manager--bottomLeft .notification-animation-enter-active .ud__notification {
    transform: translate(0)translateY(0)
}

.ud__msg-manager--topRight .ud__notification__notice-content,
.ud__msg-manager--bottomRight .ud__notification__notice-content {
    float: right
}

.ud__msg-manager--topRight .notification-animation-enter .ud__notification,
.ud__msg-manager--bottomRight .notification-animation-enter .ud__notification {
    transform: translate(100%)translateY(0)
}

.ud__msg-manager--topRight .notification-animation-enter-done .ud__notification,
.ud__msg-manager--bottomRight .notification-animation-enter-done .ud__notification,
.ud__msg-manager--topRight .notification-animation-enter-active .ud__notification,
.ud__msg-manager--bottomRight .notification-animation-enter-active .ud__notification {
    transform: translate(0)translateY(0)
}

.ud__notification:before,
.ud__notification:after {
    box-sizing: border-box;
    content: " ";
    display: table
}

.ud__notification:after {
    clear: both
}

.ud__notification .ud__notification__notice {
    clear: both;
    padding: 8px
}

.ud__notification .ud__notification__notice-success .ud__notification__notice-border {
    background-color: #62d256;
    width: 4px;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0
}

.ud__notification .ud__notification__notice-info .ud__notification__notice-border {
    background-color: #4e83fd;
    width: 4px;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0
}

.ud__notification .ud__notification__notice-error .ud__notification__notice-border {
    background-color: #f76964;
    width: 4px;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0
}

.ud__notification .ud__notification__notice-warning .ud__notification__notice-border {
    background-color: #ffa53d;
    width: 4px;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0
}

.ud__notification .ud__notification__notice-close {
    box-sizing: border-box;
    color: #646a73;
    cursor: pointer;
    outline: none;
    position: absolute;
    top: 24px;
    right: 24px
}

.ud__notification .ud__notification__notice-title {
    box-sizing: border-box;
    margin-bottom: 8px;
    padding-right: 16px;
    font-size: 16px;
    font-weight: 500;
    line-height: 24px
}

.ud__notification .ud__notification__notice-title.ud__os-mac,
.ud__os-mac .ud__notification .ud__notification__notice-title {
    font-weight: 500
}

.ud__notification .ud__notification__notice-title.ud__os-win,
.ud__os-win .ud__notification .ud__notification__notice-title {
    font-weight: 600
}

.ud__notification .ud__notification__notice-des {
    box-sizing: border-box;
    font-size: 14px;
    font-weight: 400;
    line-height: 22px
}

.ud__notification .ud__notification__notice-des.ud__os-mac,
.ud__os-mac .ud__notification .ud__notification__notice-des {
    font-weight: 400
}

.ud__notification .ud__notification__notice-des.ud__os-win,
.ud__os-win .ud__notification .ud__notification__notice-des {
    font-weight: 500
}

.ud__notification .ud__notification__notice-btn {
    box-sizing: border-box;
    text-align: right;
    margin-top: 8px;
    padding-left: 4px
}

.ud__notification .ud__notification__notice-btn .ud__button {
    margin-left: 12px
}

.ud__notification .ud__notification__notice-with-icon {
    box-sizing: border-box;
    padding-left: 44px;
    padding-right: 16px
}

.ud__notification .ud__notification__notice-hide-icon {
    box-sizing: border-box;
    padding-left: 4px
}

.ud__notification .ud__notification__notice-icon-default,
.ud__notification .ud__notification__notice-icon-error,
.ud__notification .ud__notification__notice-icon-warning,
.ud__notification .ud__notification__notice-icon-success,
.ud__notification .ud__notification__notice-icon-info {
    text-align: center;
    width: 24px;
    font-size: 24px;
    line-height: 24px;
    position: absolute;
    top: 24px;
    left: 28px
}

.ud__notification .ud__notification__notice-icon-error {
    color: #f54a45
}

.ud__notification .ud__notification__notice-icon-warning {
    color: #f80
}

.ud__notification .ud__notification__notice-icon-success {
    color: #34c724
}

.ud__notification .ud__notification__notice-icon-info {
    color: #3370ff
}

.ud__notification .ud__notification__notice-content {
    color: #1f2329;
    box-sizing: border-box;
    background: #fff;
    border-radius: 8px;
    width: 420px;
    padding: 24px;
    display: inline-block;
    position: relative;
    overflow: hidden;
    box-shadow: 0 6px 24px rgba(31, 35, 41, .08)
}

.ud__notification .ud__notification__notice-operation {
    text-align: right;
    margin-top: 8px
}


.reset_focus_outline:focus {
    --hack-merge-rules: true;
    outline: none
}

.reset_focus_outline:focus-visible {
    outline: none
}

.ud__toast.ud__notice {
    opacity: 0;
    max-width: 600px;
    margin-bottom: 16px;
    transition: opacity .3s cubic-bezier(.34, .69, .1, 1), transform .3s cubic-bezier(.34, .69, .1, 1);
    display: inline-flex;
    transform: translateY(-100%);
    box-shadow: 0 4px 8px rgba(31, 35, 41, .1)
}

.toast--animation-enter .ud__toast {
    opacity: 0;
    transform: translateY(-100%)
}

.toast--animation-enter-active .ud__toast,
.toast--animation-enter-done .ud__toast {
    opacity: 1;
    transform: translateY(0)
}

.toast--animation-exit .ud__toast {
    opacity: 1;
    transform: translateY(0%)
}

.toast--animation-exit-active {
    margin-bottom: 0
}

.toast--animation-exit-active .ud__toast {
    opacity: 0;
    transform: translateY(0%)
}


.reset_focus_outline:focus {
    --hack-merge-rules: true;
    outline: none
}

.reset_focus_outline:focus-visible {
    outline: none
}

.ud__layout {
    box-sizing: border-box;
    background: #f2f3f5;
    flex-direction: column;
    flex: auto;
    min-height: 0;
    display: flex
}

.ud__layout--has-sider {
    flex-direction: row
}

.ud__layout--has-sider>.ud__layout,
.ud__layout--has-sider>.ud__layout-content {
    overflow-x: hidden
}

.ud__layout__header,
.ud__layout__footer {
    flex: none
}

.ud__layout__header {
    box-sizing: border-box;
    color: #1f2329;
    background: #fff;
    height: 64px;
    padding: 0 50px;
    line-height: 64px
}

.ud__layout__footer {
    box-sizing: border-box;
    color: #1f2329;
    background: #f2f3f5;
    padding: 24px 50px;
    font-size: 14px
}

.ud__layout__content {
    box-sizing: border-box;
    flex: auto;
    min-height: 0
}

.ud__layout__sider {
    box-sizing: border-box;
    background: #fff;
    min-width: 0;
    transition: all .2s;
    position: relative
}

.ud__layout__sider__children {
    box-sizing: border-box;
    height: 100%;
    margin-top: -.1px;
    padding-top: .1px
}

.ud__layout__sider-has-trigger {
    padding-bottom: 48px
}

.ud__layout__sider-right {
    order: 1
}

.ud__layout__sider-trigger {
    box-sizing: border-box;
    z-index: 1;
    color: #1f2329;
    text-align: center;
    cursor: pointer;
    background: #fff;
    border-top: 1px solid #bbbfc4;
    height: 48px;
    line-height: 48px;
    transition: all .2s;
    position: fixed;
    bottom: 0
}

.ud__layout__sider--zero-width>* {
    overflow: hidden
}

.ud__layout__sider--zero-width-trigger {
    z-index: 1;
    color: #1f2329;
    text-align: center;
    cursor: pointer;
    background: #fff;
    border-radius: 0 4px 4px 0;
    width: 36px;
    height: 42px;
    font-size: 18px;
    line-height: 42px;
    transition: background .3s;
    position: absolute;
    top: 64px;
    right: -36px
}

.ud__layout__sider--zero-width-trigger:hover {
    background: #fff
}

.ud__layout__sider--zero-width-trigger-right {
    border-radius: 4px 0 0 4px;
    left: -36px
}


.reset_focus_outline:focus {
    --hack-merge-rules: true;
    outline: none
}

.reset_focus_outline:focus-visible {
    outline: none
}

.ud__menu {
    box-sizing: border-box;
    font-variant: tabular-nums;
    color: #1f2329;
    text-align: left;
    background: #fff;
    outline: none;
    margin: 0;
    padding: 0;
    font-size: 14px;
    line-height: 1.5715;
    list-style: none;
    transition: width .3s cubic-bezier(.34, .69, .1, 1)
}

.ud__menu a:focus-visible {
    --hack-merge-rules: true;
    outline: none
}

.ud__menu-item:focus-visible {
    --hack-merge-rules: true;
    outline: none
}

.ud__menu-submenu-title:focus-visible {
    --hack-merge-rules: true;
    outline: none
}

.ud__menu a:focus,
.ud__menu-item:focus,
.ud__menu-submenu-title:focus {
    outline: none
}

.ud__menu-submenu-popup {
    pointer-events: auto !important
}

.ud__menu:before,
.ud__menu:after {
    content: "";
    display: table
}

.ud__menu ul,
.ud__menu ol {
    margin: 0;
    padding: 0;
    list-style: none
}

.ud__menu ul li {
    box-sizing: border-box
}

.ud__menu-icon-wrap {
    box-sizing: border-box;
    color: #2b2f36;
    display: flex
}

.ud__menu-icon-wrap-disabled {
    color: #bbbfc4
}

.ud__menu-item-group-title {
    box-sizing: border-box;
    color: #8f959e;
    padding: 8px 20px;
    font-size: 14px;
    line-height: 1.5715
}

.ud__menu-submenu {
    box-sizing: border-box
}

.ud__menu-submenu.ud-slide-up-enter.ud-slide-up-enter-active.ud__menu-submenu-placement-bottomLeft,
.ud__menu-submenu.ud-slide-up-appear.ud-slide-up-appear-active.ud__menu-submenu-placement-bottomLeft {
    animation-name: udSlideUpIn
}

.ud__menu-submenu.ud-slide-up-enter.ud-slide-up-enter-active.ud__menu-submenu-placement-topLeft,
.ud__menu-submenu.ud-slide-up-appear.ud-slide-up-appear-active.ud__menu-submenu-placement-topLeft {
    animation-name: udSlideDownIn
}

.ud__menu-submenu.ud-slide-up-leave.ud-slide-up-leave-active.ud__menu-submenu-placement-bottomLeft {
    animation-name: udSlideUpOut
}

.ud__menu-submenu.ud-slide-up-leave.ud-slide-up-leave-active.ud__menu-submenu-placement-topLeft {
    animation-name: udSlideDownOut
}

.ud__menu-submenu-selected,
.ud__menu-submenu-selected .ud__menu-icon-wrap {
    color: #3370ff
}

.ud__menu-submenu-selected>.ud__menu-submenu-title {
    font-weight: 500
}

.ud__menu-item:active,
.ud__menu-submenu-title:active {
    background: rgba(51, 112, 255, .12)
}

.ud__menu-submenu .ud__menu-sub {
    cursor: initial;
    border: 1px solid #dee0e3;
    box-shadow: 0 4px 8px rgba(31, 35, 41, .1)
}

.ud__menu-item a {
    color: #1f2329
}

.ud__menu-item a:hover {
    color: #3370ff
}

.ud__menu-item a:before {
    content: "";
    background-color: transparent;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0
}

.ud__menu-item-divider {
    background-color: rgba(31, 35, 41, .15);
    height: 1px;
    line-height: 0;
    overflow: hidden
}

.ud__menu-item-active,
.ud__menu-submenu-title:hover {
    background: rgba(31, 35, 41, .08)
}

.ud__menu-item-selected {
    color: #3370ff;
    font-weight: 500
}

.ud__menu-item-selected .ud__menu-icon-wrap,
.ud__menu-item-selected a,
.ud__menu-item-selected a:hover {
    color: #3370ff
}

.ud__menu:not(.ud__menu-horizontal) .ud__menu-item-selected {
    background-color: rgba(51, 112, 255, .12)
}

.ud__menu-vertical-right {
    border-left: 1px solid #dee0e3
}

.ud__menu-vertical.ud__menu-sub,
.ud__menu-vertical-left.ud__menu-sub,
.ud__menu-vertical-right.ud__menu-sub {
    transform-origin: 0 0;
    min-width: 160px;
    max-height: calc(100vh - 100px);
    padding: 8px 0;
    overflow: hidden
}

.ud__menu-vertical.ud__menu-sub:not(.ud-zoom-big-enter-active):not(.ud-zoom-big-leave-active),
.ud__menu-vertical-left.ud__menu-sub:not(.ud-zoom-big-enter-active):not(.ud-zoom-big-leave-active),
.ud__menu-vertical-right.ud__menu-sub:not(.ud-zoom-big-enter-active):not(.ud-zoom-big-leave-active) {
    overflow-x: hidden;
    overflow-y: auto
}

.ud__menu-vertical.ud__menu-sub .ud__menu-item,
.ud__menu-vertical-left.ud__menu-sub .ud__menu-item,
.ud__menu-vertical-right.ud__menu-sub .ud__menu-item {
    border-right: 0;
    margin-left: 0;
    left: 0
}

.ud__menu-vertical.ud__menu-sub .ud__menu-item:after,
.ud__menu-vertical-left.ud__menu-sub .ud__menu-item:after,
.ud__menu-vertical-right.ud__menu-sub .ud__menu-item:after {
    border-right: 0
}

.ud__menu-vertical.ud__menu-sub>.ud__menu-item,
.ud__menu-vertical-left.ud__menu-sub>.ud__menu-item,
.ud__menu-vertical-right.ud__menu-sub>.ud__menu-item,
.ud__menu-vertical.ud__menu-sub>.ud__menu-submenu,
.ud__menu-vertical-left.ud__menu-sub>.ud__menu-submenu,
.ud__menu-vertical-right.ud__menu-sub>.ud__menu-submenu {
    transform-origin: 0 0
}

.ud__menu-item-title-content-text-overflow {
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden
}

.ud__menu-item,
.ud__menu-submenu-title {
    white-space: nowrap;
    cursor: pointer;
    box-sizing: border-box;
    align-items: center;
    margin: 0;
    transition: color .1s cubic-bezier(0, 0, 1, 1), border-color .1s cubic-bezier(0, 0, 1, 1), background .1s cubic-bezier(0, 0, 1, 1), padding .1s cubic-bezier(0, 0, 1, 1);
    display: flex;
    position: relative
}

.ud__menu-item .ud__menu-icon-wrap,
.ud__menu-submenu-title .ud__menu-icon-wrap {
    margin-right: 8px;
    font-size: 20px;
    transition: color .1s cubic-bezier(0, 0, 1, 1)
}

.ud__menu-item.ud__menu-item-only-child>svg,
.ud__menu-submenu-title.ud__menu-item-only-child>svg {
    margin-right: 0
}

.ud__menu>.ud__menu-item-divider {
    background-color: rgba(31, 35, 41, .15);
    height: 1px;
    margin: 1px 0;
    padding: 0;
    line-height: 0;
    overflow: hidden
}

.ud__menu-submenu-popup {
    z-index: 1050;
    border-radius: 4px;
    position: absolute
}

.ud__menu-submenu-popup:before {
    z-index: -1;
    opacity: .0001;
    content: " ";
    width: 100%;
    height: 100%;
    position: absolute;
    top: -7px;
    bottom: 0;
    left: 0;
    right: 0
}

.ud__menu-submenu-placement-rightTop:before {
    top: 0;
    left: -7px
}

.ud__menu-submenu>.ud__menu {
    background-color: #fff;
    border-radius: 4px
}

.ud__menu-submenu>.ud__menu-submenu-title:after {
    transition: transform .3s cubic-bezier(.645, .045, .355, 1)
}

.ud__menu-submenu-popup>.ud__menu {
    background-color: #fff
}

.ud__menu-submenu-expand-icon,
.ud__menu-submenu-arrow {
    box-sizing: border-box;
    color: #8f959e;
    font-size: 16px;
    line-height: 0;
    display: inline-block;
    position: absolute;
    top: 50%;
    right: 16px;
    transform: translateY(-50%)
}

.ud__menu-submenu:hover>.ud__menu-submenu-title>.ud__menu-submenu-expand-icon {
    color: #3370ff
}

.ud__menu-submenu-vertical>.ud__menu-submenu-title .ud__menu-submenu-arrow,
.ud__menu-submenu-vertical-left>.ud__menu-submenu-title .ud__menu-submenu-arrow,
.ud__menu-submenu-vertical-right>.ud__menu-submenu-title .ud__menu-submenu-arrow,
.ud__menu-submenu-inline>.ud__menu-submenu-title .ud__menu-submenu-arrow {
    font-size: 16px
}

.ud__menu-submenu-vertical>.ud__menu-submenu-title .ud__menu-submenu-arrow svg,
.ud__menu-submenu-vertical-left>.ud__menu-submenu-title .ud__menu-submenu-arrow svg,
.ud__menu-submenu-vertical-right>.ud__menu-submenu-title .ud__menu-submenu-arrow svg,
.ud__menu-submenu-inline>.ud__menu-submenu-title .ud__menu-submenu-arrow svg {
    vertical-align: middle;
    font-size: 16px
}

.ud__menu-vertical .ud__menu-submenu-selected,
.ud__menu-vertical-left .ud__menu-submenu-selected,
.ud__menu-vertical-right .ud__menu-submenu-selected {
    color: #3370ff
}

.ud__menu-vertical .ud__menu-item,
.ud__menu-vertical-left .ud__menu-item,
.ud__menu-vertical-right .ud__menu-item,
.ud__menu-inline .ud__menu-item {
    position: relative
}

.ud__menu-vertical .ud__menu-item:after,
.ud__menu-vertical-left .ud__menu-item:after,
.ud__menu-vertical-right .ud__menu-item:after,
.ud__menu-inline .ud__menu-item:after {
    opacity: 0;
    content: "";
    border-right: 4px solid #3370ff;
    transition: transform .15s cubic-bezier(.215, .61, .355, 1), opacity .15s cubic-bezier(.215, .61, .355, 1);
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    transform: scaleY(.0001)
}

.ud__menu-vertical .ud__menu-item,
.ud__menu-vertical-left .ud__menu-item,
.ud__menu-vertical-right .ud__menu-item,
.ud__menu-inline .ud__menu-item,
.ud__menu-vertical .ud__menu-submenu-title,
.ud__menu-vertical-left .ud__menu-submenu-title,
.ud__menu-vertical-right .ud__menu-submenu-title,
.ud__menu-inline .ud__menu-submenu-title {
    height: 48px;
    margin-top: 0;
    margin-bottom: 0;
    padding: 0 16px
}

.ud__menu-vertical .ud__menu-submenu,
.ud__menu-vertical-left .ud__menu-submenu,
.ud__menu-vertical-right .ud__menu-submenu,
.ud__menu-inline .ud__menu-submenu {
    padding-bottom: .02px
}

.ud__menu-vertical .ud__menu-item:not(:last-child),
.ud__menu-vertical-left .ud__menu-item:not(:last-child),
.ud__menu-vertical-right .ud__menu-item:not(:last-child),
.ud__menu-inline .ud__menu-item:not(:last-child) {
    margin-bottom: 0
}

.ud__menu-vertical>.ud__menu-item,
.ud__menu-vertical-left>.ud__menu-item,
.ud__menu-vertical-right>.ud__menu-item,
.ud__menu-inline>.ud__menu-item,
.ud__menu-vertical>.ud__menu-submenu>.ud__menu-submenu-title,
.ud__menu-vertical-left>.ud__menu-submenu>.ud__menu-submenu-title,
.ud__menu-vertical-right>.ud__menu-submenu>.ud__menu-submenu-title,
.ud__menu-inline>.ud__menu-submenu>.ud__menu-submenu-title {
    height: 48px
}

.ud__menu-vertical .ud__menu-submenu-title {
    padding-right: 44px
}

.ud__menu-vertical .ud__menu-submenu-title[aria-expanded=true] {
    background: rgba(31, 35, 41, .08)
}

.ud__menu-item-group-list {
    margin: 0;
    padding: 0
}

.ud__menu-item-group-list .ud__menu-item,
.ud__menu-item-group-list .ud__menu-submenu-title {
    padding: 0 16px 0 20px
}

.ud__menu-root.ud__menu-vertical,
.ud__menu-root.ud__menu-vertical-left,
.ud__menu-root.ud__menu-vertical-right,
.ud__menu-root.ud__menu-inline {
    box-shadow: none
}

.ud__menu-item-disabled,
.ud__menu-submenu-disabled {
    cursor: not-allowed;
    background: 0 0;
    color: #bbbfc4 !important;
    border-color: transparent !important
}

.ud__menu-item-disabled a,
.ud__menu-submenu-disabled a {
    pointer-events: none;
    color: #bbbfc4 !important
}

.ud__menu-item-disabled>.ud__menu-submenu-title,
.ud__menu-submenu-disabled>.ud__menu-submenu-title {
    cursor: not-allowed;
    color: #bbbfc4 !important
}

.ud__menu-item-disabled>.ud__menu-submenu-title>.ud__menu-submenu-arrow:before,
.ud__menu-submenu-disabled>.ud__menu-submenu-title>.ud__menu-submenu-arrow:before,
.ud__menu-item-disabled>.ud__menu-submenu-title>.ud__menu-submenu-arrow:after,
.ud__menu-submenu-disabled>.ud__menu-submenu-title>.ud__menu-submenu-arrow:after {
    background: #bbbfc4 !important
}

.ud__layout__header .ud__menu {
    line-height: inherit
}

.ud__menu-horizontal,
.ud__menu-normal-horizontal {
    flex-wrap: nowrap;
    display: flex
}

.ud__menu-submenu-hidden,
.ud__menu-normal-submenu-hidden {
    display: none
}

.ud__menu-overflow-item,
.ud__menu-normal-overflow-item {
    flex: none
}

.ud__menu-hidden,
.ud__menu-normal-hidden {
    display: none
}

.ud__menu-horizontal .ud__menu-item,
.ud__menu-horizontal .ud__menu-submenu {
    margin-top: -1px
}

.ud__menu-horizontal>.ud__menu-item:hover,
.ud__menu-horizontal>.ud__menu-item-active,
.ud__menu-horizontal>.ud__menu-submenu .ud__menu-submenu-title:hover {
    background-color: transparent
}

.ud__menu-horizontal.ud__menu-sub {
    min-width: 114px
}

.ud__menu-horizontal {
    white-space: nowrap;
    border: 0;
    line-height: 56px
}

.ud__menu-horizontal>.ud__menu-item,
.ud__menu-horizontal>.ud__menu-submenu {
    margin: 0;
    padding: 0 16px
}

.ud__menu-horizontal>.ud__menu-item-selected,
.ud__menu-horizontal>.ud__menu-submenu-selected {
    color: #3370ff;
    position: relative
}

.ud__menu-horizontal>.ud__menu-item-selected:after,
.ud__menu-horizontal>.ud__menu-submenu-selected:after {
    content: "";
    background-color: #3370ff;
    width: calc(100% - 32px);
    height: 3px;
    position: absolute;
    bottom: 0
}

.ud__menu-horizontal>.ud__menu-item:hover,
.ud__menu-horizontal>.ud__menu-submenu:hover,
.ud__menu-horizontal>.ud__menu-item-active,
.ud__menu-horizontal>.ud__menu-submenu-active,
.ud__menu-horizontal>.ud__menu-item-open,
.ud__menu-horizontal>.ud__menu-submenu-open,
.ud__menu-horizontal>.ud__menu-item:hover .ud__menu-icon-wrap,
.ud__menu-horizontal>.ud__menu-submenu:hover .ud__menu-icon-wrap,
.ud__menu-horizontal>.ud__menu-item-active .ud__menu-icon-wrap,
.ud__menu-horizontal>.ud__menu-submenu-active .ud__menu-icon-wrap,
.ud__menu-horizontal>.ud__menu-item-open .ud__menu-icon-wrap,
.ud__menu-horizontal>.ud__menu-submenu-open .ud__menu-icon-wrap {
    color: #3370ff
}

.ud__menu-horizontal>.ud__menu-item-disabled:hover .ud__menu-icon-wrap,
.ud__menu-horizontal>.ud__menu-submenu-disabled:hover .ud__menu-icon-wrap,
.ud__menu-horizontal>.ud__menu-item-disabled-active .ud__menu-icon-wrap,
.ud__menu-horizontal>.ud__menu-submenu-disabled-active .ud__menu-icon-wrap,
.ud__menu-horizontal>.ud__menu-item-disabled-open .ud__menu-icon-wrap,
.ud__menu-horizontal>.ud__menu-submenu-disabled-open .ud__menu-icon-wrap {
    color: #bbbfc4
}

.ud__menu-horizontal>.ud__menu-item,
.ud__menu-horizontal>.ud__menu-submenu {
    vertical-align: bottom;
    position: relative
}

.ud__menu-horizontal>.ud__menu-submenu>.ud__menu-submenu-title {
    padding: 0
}

.ud__menu-horizontal>.ud__menu-item a {
    color: #1f2329
}

.ud__menu-horizontal>.ud__menu-item a:hover {
    color: #3370ff
}

.ud__menu-horizontal>.ud__menu-item a:before {
    bottom: -2px
}

.ud__menu-horizontal>.ud__menu-item-selected a {
    color: #3370ff
}

.ud__menu-horizontal:after {
    clear: both;
    content: " ";
    height: 0;
    display: block
}

.ud__menu-normal {
    box-sizing: border-box;
    text-align: left;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #dee0e3;
    border-radius: 4px;
    outline: none;
    margin: 0;
    padding: 8px 0;
    font-size: 14px;
    font-weight: 400;
    line-height: 22px;
    list-style-type: none;
    position: relative;
    box-shadow: 0 4px 8px rgba(31, 35, 41, .1)
}

.ud__menu-normal.ud__os-mac,
.ud__os-mac .ud__menu-normal {
    font-weight: 400
}

.ud__menu-normal.ud__os-win,
.ud__os-win .ud__menu-normal {
    font-weight: 500
}

.ud__menu-normal a:focus-visible {
    --hack-merge-rules: true;
    outline: none
}

.ud__menu-normal-item:focus-visible {
    --hack-merge-rules: true;
    outline: none
}

.ud__menu-normal-submenu-title:focus-visible {
    --hack-merge-rules: true;
    outline: none
}

.ud__menu-normal a:focus,
.ud__menu-normal-item:focus,
.ud__menu-normal-submenu-title:focus {
    outline: none
}

.ud__menu-normal-item-group-title {
    box-sizing: border-box;
    color: #8f959e;
    padding: 5px 11px;
    font-weight: 500
}

.ud__menu-normal-icon-wrap {
    box-sizing: border-box;
    color: #2b2f36;
    margin-right: 8px;
    font-size: 16px;
    line-height: 0;
    display: inline-block
}

.ud__menu-normal-icon-wrap-disabled {
    color: #bbbfc4
}

.ud__menu-normal-submenu-popup {
    box-sizing: border-box;
    z-index: 1050;
    box-shadow: none;
    transform-origin: 0 0;
    background: 0 0;
    border-width: 0;
    position: absolute
}

.ud__menu-normal-submenu-popup ul,
.ud__menu-normal-submenu-popup li {
    list-style: none
}

.ud__menu-normal-submenu-popup-include-subMenu>.ud__menu-normal>.ud__menu-normal-item {
    padding-right: 35px
}

.ud__menu-normal-item-title-content-text-overflow {
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden
}

.ud__menu-normal-item,
.ud__menu-normal-submenu-title {
    box-sizing: border-box;
    clear: both;
    cursor: pointer;
    align-items: center;
    margin: 0;
    padding: 5px 11px;
    display: flex;
    position: relative
}

.ud__menu-normal-item[aria-expanded=true],
.ud__menu-normal-submenu-title[aria-expanded=true] {
    background: rgba(31, 35, 41, .08)
}

.ud__menu-normal-item a,
.ud__menu-normal-submenu-title a {
    color: #1f2329;
    margin: -5px -11px;
    padding: 5px 11px;
    text-decoration: none;
    display: block
}

.ud__menu-normal-item a:hover,
.ud__menu-normal-submenu-title a:hover {
    color: #1f2329
}

.ud__menu-normal-item:hover,
.ud__menu-normal-submenu-title:hover {
    background-color: rgba(31, 35, 41, .08)
}

.ud__menu-normal-item-divider,
.ud__menu-normal-submenu-title-divider {
    box-sizing: border-box;
    background-color: rgba(31, 35, 41, .15);
    height: 1px;
    margin: 4px 0;
    line-height: 0;
    overflow: hidden
}

.ud__menu-normal-item .ud__menu-normal-submenu-arrow,
.ud__menu-normal-submenu-title .ud__menu-normal-submenu-arrow {
    box-sizing: border-box;
    color: #8f959e;
    font-size: 16px;
    line-height: 0;
    display: inline-block;
    position: absolute;
    top: 50%;
    right: 12px;
    transform: translateY(-50%)
}

.ud__menu-normal-item,
.ud__menu-normal-submenu {
    box-sizing: border-box;
    color: #1f2329
}

.ud__menu-normal-item-selected,
.ud__menu-normal-submenu-selected,
.ud__menu-normal-item-selected>a,
.ud__menu-normal-submenu-selected>a {
    color: #3370ff
}

.ud__menu-normal-item-suffix-icon {
    box-sizing: border-box;
    color: #8f959e;
    font-size: 16px;
    line-height: 0;
    display: inline-block;
    position: absolute;
    top: 50%;
    right: 12px;
    transform: translateY(-50%)
}

.ud__menu-normal-submenu-selected .ud__menu-normal-icon-wrap,
.ud__menu-normal-item-selected>.ud__menu-normal-item-suffix-icon,
.ud__menu-normal-item-selected .ud__menu-normal-icon-wrap {
    color: #3370ff
}

.ud__menu-normal-item-group-list {
    margin: 0;
    padding: 0;
    list-style: none
}

.ud__menu-normal-item-selected,
.ud__menu-normal-submenu-title {
    padding-right: 35px
}

.ud__menu-normal-submenu-vertical {
    position: relative
}

.ud__menu-normal-submenu-vertical>.ud__menu-normal {
    transform-origin: 0 0;
    min-width: 100%;
    margin-left: 4px;
    position: absolute;
    top: 0;
    left: 100%
}

.ud__menu-normal-submenu.ud__menu-normal-submenu-disabled .ud__menu-normal-submenu-title,
.ud__menu-normal-submenu.ud__menu-normal-submenu-disabled .ud__menu-normal-submenu-title .ud__menu-normal-submenu-arrow-icon {
    box-sizing: border-box;
    color: #bbbfc4;
    cursor: not-allowed;
    background-color: #fff
}

.ud__menu-normal-submenu-disabled,
.ud__menu-normal-item-disabled {
    color: #bbbfc4;
    cursor: not-allowed
}

.ud__menu-normal-submenu-disabled:hover,
.ud__menu-normal-item-disabled:hover {
    color: #bbbfc4;
    cursor: not-allowed;
    background-color: #fff
}

.ud__menu-normal-submenu-selected .ud__menu-normal-submenu-title {
    background: rgba(31, 35, 41, .08)
}

.ud__menu-submenu-inline .ud__menu-submenu-arrow-icon {
    box-sizing: border-box;
    transition: transform .4s cubic-bezier(.34, .69, .1, 1);
    transform: rotate(90deg)
}

.ud__menu-submenu-inline.ud__menu-submenu-open>.ud__menu-submenu-title .ud__menu-submenu-arrow-icon {
    transform: rotate(270deg)
}

.ud__menu-inline-collapsed-noicon {
    text-align: center;
    width: 20px;
    font-size: 16px
}

.ud__menu-sub.ud__menu-inline {
    box-shadow: none;
    border: 0;
    border-radius: 0;
    padding: 0
}

.ud__menu-sub.ud__menu-inline>.ud__menu-item,
.ud__menu-sub.ud__menu-inline>.ud__menu-submenu>.ud__menu-submenu-title {
    height: 48px;
    line-height: 48px;
    list-style-type: disc;
    list-style-position: inside
}

.ud__menu-sub.ud__menu-inline .ud__menu-item-group-title {
    padding-left: 52px
}

.ud__menu-inline {
    width: 100%
}

.ud__menu-inline .ud__menu-selected:after,
.ud__menu-inline .ud__menu-item-selected:after {
    opacity: 1;
    transition: transform .15s cubic-bezier(.645, .045, .355, 1), opacity .15s cubic-bezier(.645, .045, .355, 1);
    transform: scaleY(1)
}

.ud__menu-inline .ud__menu-submenu-title {
    padding-right: 44px
}

.ud__menu-inline-collapsed {
    width: 64px
}

.ud__menu-inline-collapsed>.ud__menu-item,
.ud__menu-inline-collapsed>.ud__menu-item-group>.ud__menu-item-group-list>.ud__menu-item,
.ud__menu-inline-collapsed>.ud__menu-item-group>.ud__menu-item-group-list>.ud__menu-submenu>.ud__menu-submenu-title,
.ud__menu-inline-collapsed>.ud__menu-submenu>.ud__menu-submenu-title {
    text-overflow: clip;
    padding: 0 22px;
    left: 0
}

.ud__menu-inline-collapsed>.ud__menu-item .ud__menu-submenu-arrow,
.ud__menu-inline-collapsed>.ud__menu-item-group>.ud__menu-item-group-list>.ud__menu-item .ud__menu-submenu-arrow,
.ud__menu-inline-collapsed>.ud__menu-item-group>.ud__menu-item-group-list>.ud__menu-submenu>.ud__menu-submenu-title .ud__menu-submenu-arrow,
.ud__menu-inline-collapsed>.ud__menu-submenu>.ud__menu-submenu-title .ud__menu-submenu-arrow {
    display: none
}

.ud__menu-inline-collapsed>.ud__menu-item svg,
.ud__menu-inline-collapsed>.ud__menu-item-group>.ud__menu-item-group-list>.ud__menu-item svg,
.ud__menu-inline-collapsed>.ud__menu-item-group>.ud__menu-item-group-list>.ud__menu-submenu>.ud__menu-submenu-title svg,
.ud__menu-inline-collapsed>.ud__menu-submenu>.ud__menu-submenu-title svg {
    margin: 0;
    font-size: 20px;
    line-height: 48px
}

.ud__menu-inline-collapsed svg {
    display: inline-block
}

.ud__menu-inline-collapsed .ud__menu-item-group-title {
    white-space: nowrap;
    text-overflow: ellipsis;
    padding-left: 4px;
    padding-right: 4px;
    overflow: hidden
}

.ud__menu-inline-collapsed .ud__menu-item-selected:after {
    opacity: 1;
    transition: transform .15s cubic-bezier(.645, .045, .355, 1), opacity .15s cubic-bezier(.645, .045, .355, 1);
    transform: scaleY(1)
}


.reset_focus_outline:focus {
    --hack-merge-rules: true;
    outline: none
}

.reset_focus_outline:focus-visible {
    outline: none
}

.ud__tooltip {
    box-sizing: border-box;
    z-index: 1070;
    width: -moz-max-content;
    max-width: 320px;
    width: max-content;
    position: absolute;
    top: -9999px;
    left: -9999px;
    pointer-events: auto !important
}

.ud__tooltip-no-entry {
    pointer-events: none
}

.ud__tooltip-hidden {
    display: none
}

.ud__tooltip__arrow {
    box-sizing: border-box;
    position: absolute;
    overflow: hidden
}

.ud__tooltip__arrow__content {
    box-sizing: border-box;
    content: "";
    transform-origin: 50%;
    background: #fff;
    border: 1px solid #dee0e3;
    display: block;
    position: absolute;
    transform: rotate(45deg)
}

.ud__tooltip__arrow-top {
    top: 1px;
    left: 0;
    transform: translate(-50%, -100%)
}

.ud__tooltip__arrow-top>.ud__tooltip__arrow__content {
    top: 29.2893%;
    left: 14.6447%
}

.ud__tooltip__arrow-bottom {
    bottom: 1px;
    left: 0;
    transform: translate(-50%, 100%)
}

.ud__tooltip__arrow-bottom>.ud__tooltip__arrow__content {
    top: -70.7107%;
    left: 14.6447%
}

.ud__tooltip__arrow-left {
    top: 0;
    left: 1px;
    transform: translate(-100%, -50%)
}

.ud__tooltip__arrow-left>.ud__tooltip__arrow__content {
    top: 14.6447%;
    left: 29.2893%
}

.ud__tooltip__arrow-right {
    top: 0;
    right: 1px;
    transform: translate(100%, -50%)
}

.ud__tooltip__arrow-right>.ud__tooltip__arrow__content {
    top: 14.6447%;
    left: -70.7107%
}

.ud__tooltip-content {
    box-sizing: border-box;
    color: #fff;
    text-align: left;
    word-wrap: break-word;
    background-color: #1f2329;
    border-radius: 4px;
    min-width: 30px;
    padding: 8px 12px;
    font-size: 12px;
    line-height: 20px;
    text-decoration: none;
    position: relative;
    box-shadow: 0 4px 8px rgba(31, 35, 41, .1)
}

.ud__tooltip__arrow__content {
    box-sizing: border-box;
    background: #1f2329;
    border-color: #1f2329
}

.ud__tooltip__invalid-children-wrapper {
    box-sizing: border-box;
    display: inline-block
}

.ud-tooltip-zoom-enter,
.ud-tooltip-zoom-appear,
.ud-tooltip-zoom-leave {
    animation-duration: .2s;
    animation-play-state: paused;
    animation-fill-mode: both
}

.ud-tooltip-zoom-enter.ud-tooltip-zoom-enter-active,
.ud-tooltip-zoom-appear.ud-tooltip-zoom-appear-active {
    animation-name: udTooltipZoomIn;
    animation-play-state: running
}

.ud-tooltip-zoom-leave.ud-tooltip-zoom-leave-active {
    pointer-events: none;
    animation-name: udTooltipZoomOut;
    animation-play-state: running
}

.ud-tooltip-zoom-enter,
.ud-tooltip-zoom-appear {
    opacity: 0;
    animation-timing-function: cubic-bezier(.34, .69, .1, 1)
}

.ud-tooltip-zoom-leave {
    animation-timing-function: cubic-bezier(.34, .69, .1, 1)
}

.ud-tooltip-zoom[class*=-top] {
    transform-origin: bottom
}

.ud-tooltip-zoom[class*=-left] {
    transform-origin: 100%
}

.ud-tooltip-zoom[class*=-right] {
    transform-origin: 0
}

.ud-tooltip-zoom[class*=-bottom] {
    transform-origin: top
}

.ud-tooltip-zoom[class*=-topLeft],
.ud-tooltip-zoom[class*=-rightBottom] {
    transform-origin: 0 100%
}

.ud-tooltip-zoom[class*=-topRight],
.ud-tooltip-zoom[class*=-leftBottom] {
    transform-origin: 100% 100%
}

.ud-tooltip-zoom[class*=-leftTop],
.ud-tooltip-zoom[class*=-bottomRight] {
    transform-origin: 100% 0
}

.ud-tooltip-zoom[class*=-rightTop],
.ud-tooltip-zoom[class*=-bottomLeft] {
    transform-origin: 0 0
}

@keyframes udTooltipZoomIn {
    0% {
        opacity: 0;
        transform: scale(.7)
    }

    to {
        opacity: 1;
        transform: scale(1)
    }
}

@keyframes udTooltipZoomOut {
    0% {
        transform: scale(1)
    }

    to {
        opacity: 0;
        transform: scale(.7)
    }
}


.reset_focus_outline:focus {
    --hack-merge-rules: true;
    outline: none
}

.reset_focus_outline:focus-visible {
    outline: none
}

.ud__dropdown {
    box-sizing: border-box;
    z-index: 1050;
    width: -moz-max-content;
    max-width: 420px;
    width: max-content;
    position: absolute;
    top: -9999px;
    left: -9999px;
    pointer-events: auto !important
}

.ud__dropdown-no-entry {
    pointer-events: none
}

.ud__dropdown-hidden {
    display: none
}

.ud__dropdown__arrow {
    box-sizing: border-box;
    position: absolute;
    overflow: hidden
}

.ud__dropdown__arrow__content {
    box-sizing: border-box;
    content: "";
    transform-origin: 50%;
    background: #fff;
    border: 1px solid #dee0e3;
    display: block;
    position: absolute;
    transform: rotate(45deg)
}

.ud__dropdown__arrow-top {
    top: 1px;
    left: 0;
    transform: translate(-50%, -100%)
}

.ud__dropdown__arrow-top>.ud__dropdown__arrow__content {
    top: 29.2893%;
    left: 14.6447%
}

.ud__dropdown__arrow-bottom {
    bottom: 1px;
    left: 0;
    transform: translate(-50%, 100%)
}

.ud__dropdown__arrow-bottom>.ud__dropdown__arrow__content {
    top: -70.7107%;
    left: 14.6447%
}

.ud__dropdown__arrow-left {
    top: 0;
    left: 1px;
    transform: translate(-100%, -50%)
}

.ud__dropdown__arrow-left>.ud__dropdown__arrow__content {
    top: 14.6447%;
    left: 29.2893%
}

.ud__dropdown__arrow-right {
    top: 0;
    right: 1px;
    transform: translate(100%, -50%)
}

.ud__dropdown__arrow-right>.ud__dropdown__arrow__content {
    top: 14.6447%;
    left: -70.7107%
}

.ud__dropdown.ud-slide-up-enter.ud-slide-up-enter-active.ud__dropdown-placement-topLeft,
.ud__dropdown.ud-slide-up-appear.ud-slide-up-appear-active.ud__dropdown-placement-topLeft,
.ud__dropdown.ud-slide-up-enter.ud-slide-up-enter-active.ud__dropdown-placement-topCenter,
.ud__dropdown.ud-slide-up-appear.ud-slide-up-appear-active.ud__dropdown-placement-topCenter,
.ud__dropdown.ud-slide-up-enter.ud-slide-up-enter-active.ud__dropdown-placement-topRight,
.ud__dropdown.ud-slide-up-appear.ud-slide-up-appear-active.ud__dropdown-placement-topRight {
    animation-name: udSlideDownIn
}

.ud__dropdown.ud-slide-up-leave.ud-slide-up-leave-active.ud__dropdown-placement-topLeft,
.ud__dropdown.ud-slide-up-leave.ud-slide-up-leave-active.ud__dropdown-placement-topCenter,
.ud__dropdown.ud-slide-up-leave.ud-slide-up-leave-active.ud__dropdown-placement-topRight {
    animation-name: udSlideDownOut
}

.ud__dropdown-button {
    box-sizing: border-box;
    white-space: nowrap;
    display: inline-flex
}

.ud__dropdown-button .ud__button:first-child:not(:last-child) {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    margin-right: 0
}

.ud__dropdown-button .ud__button:last-child:not(:first-child) {
    border-left-width: 0;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0
}







@layer base {
    @keyframes semi-animation-rotate {
        0% {
            transform: rotate(0)
        }

        to {
            transform: rotate(360deg)
        }
    }

    .semi-button.semi-button-with-icon {
        align-items: center;
        display: inline-flex
    }

    .semi-button.semi-button-with-icon .semi-button-content {
        justify-content: center;
        align-items: center;
        display: flex
    }

    .semi-button.semi-button-loading {
        pointer-events: none;
        cursor: not-allowed
    }

    .semi-button.semi-button-loading .semi-button-content>svg {
        width: 16px;
        height: 16px;
        animation: .6s linear infinite forwards semi-animation-rotate
    }

    .semi-button.semi-button-with-icon-only {
        justify-content: center;
        align-items: center;
        width: 32px;
        height: 32px;
        padding: 8px
    }

    .semi-button.semi-button-with-icon-only.semi-button-size-small {
        width: 24px;
        height: 24px;
        padding: 4px
    }

    .semi-button.semi-button-with-icon-only.semi-button-size-large {
        width: 40px;
        height: 40px;
        padding: 12px
    }

    .semi-button-content-left {
        align-items: center;
        margin-right: 8px;
        display: flex
    }

    .semi-button-content-right {
        align-items: center;
        margin-left: 8px;
        display: flex
    }

    .semi-rtl .semi-button,
    .semi-portal-rtl .semi-button {
        direction: rtl;
        padding-left: 12px;
        padding-right: 12px
    }

    .semi-rtl .semi-button-size-small,
    .semi-portal-rtl .semi-button-size-small {
        padding-left: 12px;
        padding-right: 12px
    }

    .semi-rtl .semi-button-size-large,
    .semi-portal-rtl .semi-button-size-large {
        padding-left: 16px;
        padding-right: 16px
    }

    .semi-rtl .semi-button-group,
    .semi-portal-rtl .semi-button-group {
        direction: rtl
    }

    .semi-rtl .semi-button-group>.semi-button,
    .semi-portal-rtl .semi-button-group>.semi-button {
        padding-left: 0;
        padding-right: 0
    }

    .semi-rtl .semi-button-group>.semi-button .semi-button-content,
    .semi-portal-rtl .semi-button-group>.semi-button .semi-button-content {
        padding-left: 12px;
        padding-right: 12px
    }

    .semi-rtl .semi-button-group>.semi-button-size-large .semi-button-content,
    .semi-portal-rtl .semi-button-group>.semi-button-size-large .semi-button-content {
        padding-left: 16px;
        padding-right: 16px
    }

    .semi-rtl .semi-button-group>.semi-button-size-small .semi-button-content,
    .semi-portal-rtl .semi-button-group>.semi-button-size-small .semi-button-content {
        padding-left: 12px;
        padding-right: 12px
    }

    .semi-rtl .semi-button-group>.semi-button.semi-button-with-icon-only,
    .semi-portal-rtl .semi-button-group>.semi-button.semi-button-with-icon-only {
        padding-left: 0;
        padding-right: 0
    }

    .semi-rtl .semi-button-group>.semi-button.semi-button-with-icon-only .semi-button-content,
    .semi-portal-rtl .semi-button-group>.semi-button.semi-button-with-icon-only .semi-button-content {
        padding-left: 8px;
        padding-right: 8px
    }

    .semi-rtl .semi-button-group>.semi-button.semi-button-with-icon-only.semi-button-size-small .semi-button-content,
    .semi-portal-rtl .semi-button-group>.semi-button.semi-button-with-icon-only.semi-button-size-small .semi-button-content {
        padding-left: 4px;
        padding-right: 4px
    }

    .semi-rtl .semi-button-group>.semi-button.semi-button-with-icon-only.semi-button-size-large .semi-button-content,
    .semi-portal-rtl .semi-button-group>.semi-button.semi-button-with-icon-only.semi-button-size-large .semi-button-content {
        padding-left: 12px;
        padding-right: 12px
    }

    .semi-rtl .semi-button-group>.semi-button:first-child,
    .semi-portal-rtl .semi-button-group>.semi-button:first-child {
        border-top-left-radius: 0;
        border-bottom-left-radius: 0;
        border-top-right-radius: var(--semi-border-radius-small);
        border-bottom-right-radius: var(--semi-border-radius-small)
    }

    .semi-rtl .semi-button-group>.semi-button:not(:last-child) .semi-button-content,
    .semi-portal-rtl .semi-button-group>.semi-button:not(:last-child) .semi-button-content {
        border-left: 1px var(--semi-color-border)solid;
        border-right: 0
    }

    .semi-rtl .semi-button-group>.semi-button:last-child,
    .semi-portal-rtl .semi-button-group>.semi-button:last-child {
        border-top-right-radius: 0;
        border-bottom-right-radius: 0;
        border-top-left-radius: var(--semi-border-radius-small);
        border-bottom-left-radius: var(--semi-border-radius-small)
    }

    .semi-rtl .semi-button.semi-button-with-icon-only,
    .semi-portal-rtl .semi-button.semi-button-with-icon-only {
        padding-left: 8px;
        padding-right: 8px
    }

    .semi-rtl .semi-button.semi-button-with-icon-only.semi-button-size-small,
    .semi-portal-rtl .semi-button.semi-button-with-icon-only.semi-button-size-small {
        padding-left: 4px;
        padding-right: 4px
    }

    .semi-rtl .semi-button.semi-button-with-icon-only.semi-button-size-large,
    .semi-portal-rtl .semi-button.semi-button-with-icon-only.semi-button-size-large {
        padding-left: 12px;
        padding-right: 12px
    }

    .semi-rtl .semi-button-content-left,
    .semi-portal-rtl .semi-button-content-left {
        margin-left: 8px;
        margin-right: 0
    }

    .semi-rtl .semi-button-content-right,
    .semi-portal-rtl .semi-button-content-right {
        margin-left: 0;
        margin-right: 8px
    }
}


.semi-icon {
    text-align: center;
    text-transform: none;
    text-rendering: optimizeLegibility;
    fill: currentColor;
    font-style: normal;
    line-height: 0;
    display: inline-block
}

.semi-icon-extra-small {
    font-size: 8px
}

.semi-icon-small {
    font-size: 12px
}

.semi-icon-default {
    font-size: 16px
}

.semi-icon-large {
    font-size: 20px
}

.semi-icon-extra-large {
    font-size: 24px
}

.semi-icon-spinning {
    animation: .6s linear infinite forwards semi-icon-animation-rotate
}

@keyframes semi-icon-animation-rotate {
    0% {
        transform: rotate(0)
    }

    to {
        transform: rotate(360deg)
    }
}


@layer base {
    .semi-badge {
        display: inline-block;
        position: relative
    }

    .semi-badge-dot {
        box-sizing: border-box;
        border-radius: var(--semi-border-radius-circle);
        background-color: var(--semi-color-bg-1);
        border: 1px var(--semi-color-bg-1)solid;
        z-index: 1;
        width: 8px;
        height: 8px
    }

    .semi-badge-count {
        box-sizing: border-box;
        background-color: var(--semi-color-bg-1);
        border: 1px var(--semi-color-bg-1)solid;
        z-index: 1;
        text-align: center;
        min-width: 18px;
        height: 18px;
        font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif;
        font-size: 12px;
        line-height: 16px;
        font-weight: 14px;
        color: var(--semi-color-bg-2);
        border-radius: 9px;
        padding: 0 4px
    }

    .semi-badge-rightTop {
        transform-origin: 100% 0;
        position: absolute;
        top: 0;
        right: 0;
        transform: translate(50%, -50%)
    }

    .semi-badge-rightBottom {
        transform-origin: 100% 0;
        position: absolute;
        bottom: 0;
        right: 0;
        transform: translate(50%, 50%)
    }

    .semi-badge-leftTop {
        transform-origin: 100% 0;
        position: absolute;
        top: 0;
        left: 0;
        transform: translate(-50%, -50%)
    }

    .semi-badge-leftBottom {
        transform-origin: 100% 0;
        position: absolute;
        bottom: 0;
        left: 0;
        transform: translate(-50%, 50%)
    }

    .semi-badge-custom {
        display: flex
    }

    .semi-badge-block {
        display: inline-block;
        position: static
    }

    .semi-badge-light:before {
        content: "";
        border-radius: inherit;
        background-color: var(--semi-color-bg-2);
        z-index: -1;
        width: 100%;
        height: 100%;
        display: block;
        position: absolute;
        top: 0;
        left: 0
    }

    .semi-badge-light:after {
        content: "";
        border-radius: inherit;
        background-color: inherit;
        z-index: -1;
        width: 100%;
        height: 100%;
        display: block;
        position: absolute;
        top: 0;
        left: 0
    }

    .semi-badge-primary.semi-badge-solid {
        background-color: var(--semi-color-primary)
    }

    .semi-badge-primary.semi-badge-light {
        background-color: var(--semi-color-primary-light-default);
        color: var(--semi-color-primary)
    }

    .semi-badge-primary.semi-badge-inverted {
        color: var(--semi-color-primary)
    }

    .semi-badge-secondary.semi-badge-solid {
        background-color: var(--semi-color-secondary)
    }

    .semi-badge-secondary.semi-badge-light {
        background-color: var(--semi-color-secondary-light-default);
        color: var(--semi-color-secondary)
    }

    .semi-badge-secondary.semi-badge-inverted {
        color: var(--semi-color-secondary)
    }

    .semi-badge-tertiary.semi-badge-solid {
        background-color: var(--semi-color-tertiary)
    }

    .semi-badge-tertiary.semi-badge-light {
        background-color: var(--semi-color-tertiary-light-default);
        color: var(--semi-color-tertiary)
    }

    .semi-badge-tertiary.semi-badge-inverted {
        color: var(--semi-color-tertiary)
    }

    .semi-badge-danger.semi-badge-solid {
        background-color: var(--semi-color-danger)
    }

    .semi-badge-danger.semi-badge-light {
        background-color: var(--semi-color-danger-light-default);
        color: var(--semi-color-danger)
    }

    .semi-badge-danger.semi-badge-inverted {
        color: var(--semi-color-danger)
    }

    .semi-badge-warning.semi-badge-solid {
        background-color: var(--semi-color-warning)
    }

    .semi-badge-warning.semi-badge-light {
        background-color: var(--semi-color-warning-light-default);
        color: var(--semi-color-warning)
    }

    .semi-badge-warning.semi-badge-inverted {
        color: var(--semi-color-warning)
    }

    .semi-badge-success.semi-badge-solid {
        background-color: var(--semi-color-success)
    }

    .semi-badge-success.semi-badge-light {
        background-color: var(--semi-color-success-light-default);
        color: var(--semi-color-success)
    }

    .semi-badge-success.semi-badge-inverted {
        color: var(--semi-color-success)
    }

    .semi-rtl .semi-badge,
    .semi-portal-rtl .semi-badge {
        direction: rtl
    }
}


@layer base {
    .semi-collapsible-transition {
        transition: height .25s cubic-bezier(.25, .1, .25, 1)var(--semi-transition_delay-none), opacity .25s var(--semi-transition_function-easeIn)var(--semi-transition_delay-none)
    }
}


@layer base {
    .semi-collapse-item {
        border-bottom: 1px solid var(--semi-color-border)
    }

    .semi-collapse-header {
        border-radius: var(--semi-border-radius-small);
        cursor: pointer;
        color: var(--semi-color-text-0);
        outline: none;
        justify-content: space-between;
        align-items: center;
        margin: 4px 8px;
        padding: 8px;
        font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif;
        font-size: 14px;
        font-weight: 600;
        line-height: 20px;
        display: flex
    }

    .semi-collapse-header-right {
        align-items: center;
        display: flex
    }

    .semi-collapse-header-right span {
        padding-right: 8px;
        display: flex
    }

    .semi-collapse-header-right span:last-child {
        padding-right: 0
    }

    .semi-collapse-header-icon {
        width: 16px;
        height: 16px;
        color: var(--semi-color-text-2)
    }

    .semi-collapse-header-iconLeft {
        justify-content: flex-start
    }

    .semi-collapse-header-iconLeft .semi-collapse-header-icon {
        margin-right: 8px
    }

    .semi-collapse-header-iconDisabled {
        color: var(--semi-color-disabled-text)
    }

    .semi-collapse-header:hover {
        background-color: var(--semi-color-fill-0)
    }

    .semi-collapse-header:active {
        background-color: var(--semi-color-fill-1)
    }

    .semi-collapse-header-disabled {
        color: var(--semi-color-disabled-text)
    }

    .semi-collapse-header-disabled:hover {
        background-color: transparent
    }

    .semi-collapse-content {
        color: var(--semi-color-text-1);
        padding: 4px 16px 8px;
        font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif;
        font-size: 14px;
        line-height: 20px
    }

    .semi-collapse-content p {
        margin: 0
    }

    .semi-rtl .semi-collapse,
    .semi-portal-rtl .semi-collapse {
        direction: rtl
    }

    .semi-rtl .semi-collapse-header-right span,
    .semi-portal-rtl .semi-collapse-header-right span {
        padding-left: 8px;
        padding-right: 0;
        display: flex
    }

    .semi-rtl .semi-collapse-header-right span:last-child,
    .semi-portal-rtl .semi-collapse-header-right span:last-child {
        padding-left: 0;
        padding-right: 0
    }
}


@layer base {
    .semi-empty {
        display: flex
    }

    .semi-empty-image {
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        -webkit-user-drag: none;
        pointer-events: none;
        justify-content: center;
        display: flex
    }

    .semi-empty-vertical {
        flex-direction: column;
        align-items: center
    }

    .semi-empty-vertical .semi-empty-content {
        margin-top: 24px
    }

    .semi-empty-vertical .semi-empty-title,
    .semi-empty-vertical .semi-empty-description {
        text-align: center
    }

    .semi-empty-horizontal .semi-empty-content {
        margin-left: 32px
    }

    .semi-empty-title.semi-typography {
        font-weight: 600;
        display: block
    }

    .semi-empty-title+.semi-empty-description {
        margin-top: 16px
    }

    .semi-empty-description {
        color: var(--semi-color-text-1)
    }

    .semi-empty-footer {
        margin-top: 24px
    }

    .semi-rtl .semi-empty,
    .semi-portal-rtl .semi-empty {
        direction: rtl
    }

    .semi-rtl .semi-empty-horizontal .semi-empty-content,
    .semi-portal-rtl .semi-empty-horizontal .semi-empty-content {
        margin-left: auto;
        margin-right: 32px
    }
}


@layer base {
    .semi-typography {
        color: var(--semi-color-text-0);
        font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif;
        font-size: 14px;
        line-height: 20px
    }

    .semi-typography.semi-typography-secondary {
        color: var(--semi-color-text-1)
    }

    .semi-typography.semi-typography-tertiary {
        color: var(--semi-color-text-2)
    }

    .semi-typography.semi-typography-quaternary {
        color: var(--semi-color-text-3)
    }

    .semi-typography.semi-typography-warning {
        color: var(--semi-color-warning)
    }

    .semi-typography.semi-typography-success {
        color: var(--semi-color-success)
    }

    .semi-typography.semi-typography-danger {
        color: var(--semi-color-danger)
    }

    .semi-typography.semi-typography-link {
        color: var(--semi-color-link);
        font-weight: 600
    }

    .semi-typography.semi-typography-disabled {
        color: var(--semi-color-disabled-text);
        cursor: not-allowed;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none
    }

    .semi-typography.semi-typography-disabled.semi-typography-link {
        color: var(--semi-color-link)
    }

    .semi-typography-icon {
        vertical-align: middle;
        color: inherit;
        margin-right: 4px
    }

    .semi-typography-small {
        font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif;
        font-size: 12px;
        font-weight: 400;
        line-height: 16px
    }

    .semi-typography-small.semi-typography-paragraph {
        font-weight: 400
    }

    .semi-typography code {
        border: 1px solid var(--semi-color-border);
        color: var(--semi-color-text-2);
        background-color: var(--semi-color-fill-1);
        border-radius: 2px;
        padding: 2px 4px
    }

    .semi-typography mark {
        background-color: var(--semi-color-primary-light-default)
    }

    .semi-typography u {
        -webkit-text-decoration-skip: ink;
        -webkit-text-decoration-skip-ink: auto;
        text-decoration-skip-ink: auto;
        text-decoration: underline
    }

    .semi-typography del {
        text-decoration: line-through
    }

    .semi-typography strong {
        font-weight: 600
    }

    .semi-typography a {
        color: var(--semi-color-link);
        cursor: pointer;
        text-decoration: none;
        display: inline
    }

    .semi-typography a:visited {
        color: var(--semi-color-link-visited)
    }

    .semi-typography a:hover {
        color: var(--semi-color-link-hover)
    }

    .semi-typography a:active {
        color: var(--semi-color-link-active)
    }

    .semi-typography a .semi-typography-link-underline:hover {
        border-bottom: 1px solid var(--semi-color-link-hover);
        margin-bottom: -1px
    }

    .semi-typography a .semi-typography-link-underline:active {
        border-bottom: 1px solid var(--semi-color-link-active);
        margin-bottom: -1px
    }

    .semi-typography-ellipsis-single-line {
        overflow: hidden
    }

    .semi-typography-ellipsis-multiple-line {
        -webkit-box-orient: vertical;
        display: -webkit-box;
        overflow: hidden
    }

    .semi-typography-ellipsis-multiple-line.semi-typography-ellipsis-multiple-line-text {
        display: -webkit-inline-box
    }

    .semi-typography-ellipsis-overflow-ellipsis {
        white-space: nowrap;
        text-overflow: ellipsis;
        display: block
    }

    .semi-typography-ellipsis-overflow-ellipsis.semi-typography-ellipsis-overflow-ellipsis-text {
        vertical-align: top;
        max-width: 100%;
        display: inline-block
    }

    .semi-typography-ellipsis-expand {
        margin-left: 8px;
        display: inline
    }

    .semi-typography-action-copy {
        vertical-align: middle;
        margin-left: 4px;
        padding: 0;
        display: inline-flex
    }

    .semi-typography a.semi-typography-action-copy-icon {
        display: inline-flex
    }

    .semi-typography-action-copied {
        color: var(--semi-color-text-2);
        margin-left: 4px;
        padding: 0;
        display: inline-flex
    }

    .semi-typography-action-copied .semi-icon {
        vertical-align: middle;
        color: var(--semi-color-success)
    }

    .semi-typography-paragraph {
        margin: 0
    }

    h1.semi-typography,
    .semi-typography-h1.semi-typography {
        margin: 0;
        font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif;
        font-size: 32px;
        font-weight: 600;
        line-height: 44px
    }

    h1.semi-typography.semi-typography-h1-weight-light,
    .semi-typography-h1.semi-typography.semi-typography-h1-weight-light {
        font-weight: 200
    }

    h1.semi-typography.semi-typography-h1-weight-regular,
    .semi-typography-h1.semi-typography.semi-typography-h1-weight-regular {
        font-weight: 400
    }

    h1.semi-typography.semi-typography-h1-weight-medium,
    .semi-typography-h1.semi-typography.semi-typography-h1-weight-medium {
        font-weight: 500
    }

    h1.semi-typography.semi-typography-h1-weight-semibold,
    .semi-typography-h1.semi-typography.semi-typography-h1-weight-semibold {
        font-weight: 600
    }

    h1.semi-typography.semi-typography-h1-weight-bold,
    .semi-typography-h1.semi-typography.semi-typography-h1-weight-bold {
        font-weight: 700
    }

    h2.semi-typography,
    .semi-typography-h2.semi-typography {
        margin: 0;
        font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif;
        font-size: 28px;
        font-weight: 600;
        line-height: 40px
    }

    h2.semi-typography.semi-typography-h2-weight-light,
    .semi-typography-h2.semi-typography.semi-typography-h2-weight-light {
        font-weight: 200
    }

    h2.semi-typography.semi-typography-h2-weight-regular,
    .semi-typography-h2.semi-typography.semi-typography-h2-weight-regular {
        font-weight: 400
    }

    h2.semi-typography.semi-typography-h2-weight-medium,
    .semi-typography-h2.semi-typography.semi-typography-h2-weight-medium {
        font-weight: 500
    }

    h2.semi-typography.semi-typography-h2-weight-semibold,
    .semi-typography-h2.semi-typography.semi-typography-h2-weight-semibold {
        font-weight: 600
    }

    h2.semi-typography.semi-typography-h2-weight-bold,
    .semi-typography-h2.semi-typography.semi-typography-h2-weight-bold {
        font-weight: 700
    }

    h3.semi-typography,
    .semi-typography-h3.semi-typography {
        margin: 0;
        font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif;
        font-size: 24px;
        font-weight: 600;
        line-height: 32px
    }

    h3.semi-typography.semi-typography-h3-weight-light,
    .semi-typography-h3.semi-typography.semi-typography-h3-weight-light {
        font-weight: 200
    }

    h3.semi-typography.semi-typography-h3-weight-regular,
    .semi-typography-h3.semi-typography.semi-typography-h3-weight-regular {
        font-weight: 400
    }

    h3.semi-typography.semi-typography-h3-weight-medium,
    .semi-typography-h3.semi-typography.semi-typography-h3-weight-medium {
        font-weight: 500
    }

    h3.semi-typography.semi-typography-h3-weight-semibold,
    .semi-typography-h3.semi-typography.semi-typography-h3-weight-semibold {
        font-weight: 600
    }

    h3.semi-typography.semi-typography-h3-weight-bold,
    .semi-typography-h3.semi-typography.semi-typography-h3-weight-bold {
        font-weight: 700
    }

    h4.semi-typography,
    .semi-typography-h4.semi-typography {
        margin: 0;
        font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif;
        font-size: 20px;
        font-weight: 600;
        line-height: 28px
    }

    h4.semi-typography.semi-typography-h4-weight-light,
    .semi-typography-h4.semi-typography.semi-typography-h4-weight-light {
        font-weight: 200
    }

    h4.semi-typography.semi-typography-h4-weight-regular,
    .semi-typography-h4.semi-typography.semi-typography-h4-weight-regular {
        font-weight: 400
    }

    h4.semi-typography.semi-typography-h4-weight-medium,
    .semi-typography-h4.semi-typography.semi-typography-h4-weight-medium {
        font-weight: 500
    }

    h4.semi-typography.semi-typography-h4-weight-semibold,
    .semi-typography-h4.semi-typography.semi-typography-h4-weight-semibold {
        font-weight: 600
    }

    h4.semi-typography.semi-typography-h4-weight-bold,
    .semi-typography-h4.semi-typography.semi-typography-h4-weight-bold {
        font-weight: 700
    }

    h5.semi-typography,
    .semi-typography-h5.semi-typography {
        margin: 0;
        font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif;
        font-size: 18px;
        font-weight: 600;
        line-height: 24px
    }

    h5.semi-typography.semi-typography-h5-weight-light,
    .semi-typography-h5.semi-typography.semi-typography-h5-weight-light {
        font-weight: 200
    }

    h5.semi-typography.semi-typography-h5-weight-regular,
    .semi-typography-h5.semi-typography.semi-typography-h5-weight-regular {
        font-weight: 400
    }

    h5.semi-typography.semi-typography-h5-weight-medium,
    .semi-typography-h5.semi-typography.semi-typography-h5-weight-medium {
        font-weight: 500
    }

    h5.semi-typography.semi-typography-h5-weight-semibold,
    .semi-typography-h5.semi-typography.semi-typography-h5-weight-semibold {
        font-weight: 600
    }

    h5.semi-typography.semi-typography-h5-weight-bold,
    .semi-typography-h5.semi-typography.semi-typography-h5-weight-bold {
        font-weight: 700
    }

    h6.semi-typography,
    .semi-typography-h6.semi-typography {
        margin: 0;
        font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif;
        font-size: 16px;
        font-weight: 600;
        line-height: 22px
    }

    h6.semi-typography.semi-typography-h6-weight-light,
    .semi-typography-h6.semi-typography.semi-typography-h6-weight-light {
        font-weight: 200
    }

    h6.semi-typography.semi-typography-h6-weight-regular,
    .semi-typography-h6.semi-typography.semi-typography-h6-weight-regular {
        font-weight: 400
    }

    h6.semi-typography.semi-typography-h6-weight-medium,
    .semi-typography-h6.semi-typography.semi-typography-h6-weight-medium {
        font-weight: 500
    }

    h6.semi-typography.semi-typography-h6-weight-semibold,
    .semi-typography-h6.semi-typography.semi-typography-h6-weight-semibold {
        font-weight: 600
    }

    h6.semi-typography.semi-typography-h6-weight-bold,
    .semi-typography-h6.semi-typography.semi-typography-h6-weight-bold {
        font-weight: 700
    }

    p.semi-typography-extended,
    .semi-typography-paragraph.semi-typography-extended {
        font-weight: 400;
        line-height: 24px
    }

    .semi-rtl .semi-typography,
    .semi-portal-rtl .semi-typography {
        direction: rtl
    }

    .semi-rtl .semi-typography-link a,
    .semi-rtl .semi-typography a,
    .semi-portal-rtl .semi-typography-link a,
    .semi-portal-rtl .semi-typography a {
        display: inline-block
    }

    .semi-rtl .semi-typography-icon,
    .semi-portal-rtl .semi-typography-icon {
        margin-left: 4px;
        margin-right: auto
    }

    .semi-rtl .semi-typography-ellipsis-expand,
    .semi-portal-rtl .semi-typography-ellipsis-expand {
        margin-left: auto
    }

    .semi-rtl .semi-typography-action-copy,
    .semi-portal-rtl .semi-typography-action-copy,
    .semi-rtl .semi-typography-action-copied,
    .semi-portal-rtl .semi-typography-action-copied {
        margin-left: auto;
        margin-right: 4px
    }
}


@layer base {
    @keyframes semi-tooltip-zoomIn {
        0% {
            opacity: 0;
            transform: scale(.8)
        }

        50% {
            opacity: 1
        }
    }

    @keyframes semi-tooltip-bounceIn {
        0% {
            opacity: 0;
            transform: scale(.6)
        }

        70% {
            opacity: 1;
            transform: scale(1.01)
        }

        to {
            opacity: 1;
            animation-timing-function: cubic-bezier(.215, .61, .355, 1);
            transform: scale(1)
        }
    }

    @keyframes semi-tooltip-zoomOut {
        0% {
            opacity: 1
        }

        60% {
            opacity: 0;
            transform: scale(.8)
        }

        to {
            opacity: 0
        }
    }

    .semi-tooltip-wrapper {
        background-color: rgba(var(--semi-grey-7), 1);
        color: var(--semi-color-bg-0);
        border-radius: var(--semi-border-radius-medium);
        word-wrap: break-word;
        overflow-wrap: break-word;
        opacity: 0;
        max-width: 240px;
        padding: 8px 12px;
        font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif;
        font-size: 14px;
        line-height: 20px;
        position: relative;
        top: 0;
        left: 0
    }

    .semi-tooltip-wrapper-show {
        opacity: 1
    }

    .semi-tooltip-content {
        min-width: 0
    }

    .semi-tooltip-trigger {
        width: auto;
        height: auto;
        display: inline-block
    }

    .semi-tooltip-with-arrow {
        box-sizing: border-box;
        justify-content: center;
        align-items: center;
        display: flex
    }

    .semi-tooltip-animation-show {
        animation: .1s cubic-bezier(.215, .61, .355, 1) forwards semi-tooltip-zoomIn
    }

    .semi-tooltip-animation-hide {
        animation: .1s cubic-bezier(.215, .61, .355, 1) forwards semi-tooltip-zoomOut
    }

    .semi-tooltip-wrapper .semi-tooltip-icon-arrow {
        width: 24px;
        height: 7px;
        color: rgba(var(--semi-grey-7), 1);
        position: absolute
    }

    .semi-tooltip-wrapper[x-placement=top] .semi-tooltip-icon-arrow {
        bottom: -6px;
        left: 50%;
        transform: translate(-50%)
    }

    .semi-tooltip-wrapper[x-placement=top].semi-tooltip-with-arrow,
    .semi-tooltip-wrapper[x-placement=top] .semi-tooltip-with-arrow {
        min-width: 36px
    }

    .semi-tooltip-wrapper[x-placement=topLeft] .semi-tooltip-icon-arrow {
        bottom: -6px;
        left: 6px
    }

    .semi-tooltip-wrapper[x-placement=topLeft].semi-tooltip-with-arrow,
    .semi-tooltip-wrapper[x-placement=topLeft] .semi-tooltip-with-arrow {
        min-width: 36px
    }

    .semi-tooltip-wrapper[x-placement=topRight] .semi-tooltip-icon-arrow {
        bottom: -6px;
        right: 6px
    }

    .semi-tooltip-wrapper[x-placement=topRight].semi-tooltip-with-arrow,
    .semi-tooltip-wrapper[x-placement=topRight] .semi-tooltip-with-arrow {
        min-width: 36px
    }

    .semi-tooltip-wrapper[x-placement=leftTop] .semi-tooltip-icon-arrow {
        width: 7px;
        height: 24px;
        top: 5px;
        right: -6px
    }

    .semi-tooltip-wrapper[x-placement=leftTop].semi-tooltip-with-arrow,
    .semi-tooltip-wrapper[x-placement=leftTop] .semi-tooltip-with-arrow {
        min-height: 34px
    }

    .semi-tooltip-wrapper[x-placement=left] .semi-tooltip-icon-arrow {
        width: 7px;
        height: 24px;
        top: 50%;
        right: -6px;
        transform: translateY(-50%)
    }

    .semi-tooltip-wrapper[x-placement=left].semi-tooltip-with-arrow,
    .semi-tooltip-wrapper[x-placement=left] .semi-tooltip-with-arrow {
        min-height: 34px
    }

    .semi-tooltip-wrapper[x-placement=leftBottom] .semi-tooltip-icon-arrow {
        width: 7px;
        height: 24px;
        bottom: 5px;
        right: -6px
    }

    .semi-tooltip-wrapper[x-placement=leftBottom].semi-tooltip-with-arrow,
    .semi-tooltip-wrapper[x-placement=leftBottom] .semi-tooltip-with-arrow {
        min-height: 34px
    }

    .semi-tooltip-wrapper[x-placement=rightTop] .semi-tooltip-icon-arrow {
        width: 7px;
        height: 24px;
        top: 5px;
        left: -6px;
        transform: rotate(180deg)
    }

    .semi-tooltip-wrapper[x-placement=rightTop].semi-tooltip-with-arrow,
    .semi-tooltip-wrapper[x-placement=rightTop] .semi-tooltip-with-arrow {
        min-height: 34px
    }

    .semi-tooltip-wrapper[x-placement=right] .semi-tooltip-icon-arrow {
        width: 7px;
        height: 24px;
        top: 50%;
        left: -6px;
        transform: translateY(-50%)rotate(180deg)
    }

    .semi-tooltip-wrapper[x-placement=right].semi-tooltip-with-arrow,
    .semi-tooltip-wrapper[x-placement=right] .semi-tooltip-with-arrow {
        min-height: 34px
    }

    .semi-tooltip-wrapper[x-placement=rightBottom] .semi-tooltip-icon-arrow {
        width: 7px;
        height: 24px;
        bottom: 5px;
        left: -6px;
        transform: rotate(180deg)
    }

    .semi-tooltip-wrapper[x-placement=rightBottom].semi-tooltip-with-arrow,
    .semi-tooltip-wrapper[x-placement=rightBottom] .semi-tooltip-with-arrow {
        min-height: 34px
    }

    .semi-tooltip-wrapper[x-placement=bottomLeft] .semi-tooltip-icon-arrow {
        top: -6px;
        left: 6px;
        transform: rotate(180deg)
    }

    .semi-tooltip-wrapper[x-placement=bottomLeft].semi-tooltip-with-arrow,
    .semi-tooltip-wrapper[x-placement=bottomLeft] .semi-tooltip-with-arrow {
        min-width: 36px
    }

    .semi-tooltip-wrapper[x-placement=bottom] .semi-tooltip-icon-arrow {
        top: -6px;
        left: 50%;
        transform: translate(-50%)rotate(180deg)
    }

    .semi-tooltip-wrapper[x-placement=bottom].semi-tooltip-with-arrow,
    .semi-tooltip-wrapper[x-placement=bottom] .semi-tooltip-with-arrow {
        min-width: 36px
    }

    .semi-tooltip-wrapper[x-placement=bottomRight] .semi-tooltip-icon-arrow {
        top: -6px;
        right: 6px;
        transform: rotate(180deg)
    }

    .semi-tooltip-wrapper[x-placement=bottomRight].semi-tooltip-with-arrow,
    .semi-tooltip-wrapper[x-placement=bottomRight] .semi-tooltip-with-arrow {
        min-width: 36px
    }

    .semi-rtl .semi-tooltip-wrapper,
    .semi-portal-rtl .semi-tooltip-wrapper {
        direction: rtl;
        padding-left: 12px;
        padding-right: 12px;
        left: auto;
        right: 0
    }
}


@layer base {
    .semi-portal {
        z-index: 1;
        width: 100%;
        position: absolute;
        top: 0;
        left: 0
    }

    .semi-portal-inner {
        min-width: -moz-max-content;
        background-color: transparent;
        min-width: max-content;
        position: absolute
    }
}


@layer base {
    @keyframes semi-popover-zoomIn {
        0% {
            opacity: 0;
            transform: scale(.8)
        }

        50% {
            opacity: 1
        }
    }

    @keyframes semi-popover-zoomOut {
        0% {
            opacity: 1
        }

        60% {
            opacity: 0;
            transform: scale(.8)
        }

        to {
            opacity: 0
        }
    }

    .semi-popover-wrapper {
        background-color: var(--semi-color-bg-3);
        box-shadow: var(--semi-shadow-elevated);
        z-index: 1030;
        border-radius: var(--semi-border-radius-medium);
        opacity: 0;
        font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif;
        font-size: 14px;
        line-height: 20px;
        position: relative
    }

    .semi-popover-wrapper-show {
        opacity: 1
    }

    .semi-popover-trigger {
        width: auto;
        height: auto;
        display: inline-block
    }

    .semi-popover-title {
        border-bottom: 1px solid var(--semi-color-border);
        padding: 8px
    }

    .semi-popover-confirm {
        position: absolute
    }

    .semi-popover-with-arrow {
        box-sizing: border-box;
        padding: 12px
    }

    .semi-popover-animation-show {
        animation: .1s cubic-bezier(.215, .61, .355, 1) forwards semi-popover-zoomIn
    }

    .semi-popover-animation-hide {
        animation: .1s cubic-bezier(.215, .61, .355, 1) forwards semi-popover-zoomOut
    }

    .semi-popover-wrapper .semi-popover-icon-arrow {
        width: 24px;
        height: 8px;
        color: unset;
        position: absolute
    }

    .semi-popover-wrapper[x-placement=top] .semi-popover-icon-arrow {
        bottom: -7px;
        left: 50%;
        transform: translate(-50%)
    }

    .semi-popover-wrapper[x-placement=top].semi-popover-with-arrow,
    .semi-popover-wrapper[x-placement=top] .semi-popover-with-arrow {
        min-width: 36px
    }

    .semi-popover-wrapper[x-placement=topLeft] .semi-popover-icon-arrow {
        bottom: -7px;
        left: 6px
    }

    .semi-popover-wrapper[x-placement=topLeft].semi-popover-with-arrow,
    .semi-popover-wrapper[x-placement=topLeft] .semi-popover-with-arrow {
        min-width: 36px
    }

    .semi-popover-wrapper[x-placement=topRight] .semi-popover-icon-arrow {
        bottom: -7px;
        right: 6px
    }

    .semi-popover-wrapper[x-placement=topRight].semi-popover-with-arrow,
    .semi-popover-wrapper[x-placement=topRight] .semi-popover-with-arrow {
        min-width: 36px
    }

    .semi-popover-wrapper[x-placement=leftTop] .semi-popover-icon-arrow {
        width: 8px;
        height: 24px;
        top: 6px;
        right: -7px
    }

    .semi-popover-wrapper[x-placement=leftTop].semi-popover-with-arrow,
    .semi-popover-wrapper[x-placement=leftTop] .semi-popover-with-arrow {
        min-height: 36px
    }

    .semi-popover-wrapper[x-placement=left] .semi-popover-icon-arrow {
        width: 8px;
        height: 24px;
        top: 50%;
        right: -7px;
        transform: translateY(-50%)
    }

    .semi-popover-wrapper[x-placement=left].semi-popover-with-arrow,
    .semi-popover-wrapper[x-placement=left] .semi-popover-with-arrow {
        min-height: 36px
    }

    .semi-popover-wrapper[x-placement=leftBottom] .semi-popover-icon-arrow {
        width: 8px;
        height: 24px;
        bottom: 6px;
        right: -7px
    }

    .semi-popover-wrapper[x-placement=leftBottom].semi-popover-with-arrow,
    .semi-popover-wrapper[x-placement=leftBottom] .semi-popover-with-arrow {
        min-height: 36px
    }

    .semi-popover-wrapper[x-placement=rightTop] .semi-popover-icon-arrow {
        width: 8px;
        height: 24px;
        top: 6px;
        left: -7px;
        transform: rotate(180deg)
    }

    .semi-popover-wrapper[x-placement=rightTop].semi-popover-with-arrow,
    .semi-popover-wrapper[x-placement=rightTop] .semi-popover-with-arrow {
        min-height: 36px
    }

    .semi-popover-wrapper[x-placement=right] .semi-popover-icon-arrow {
        width: 8px;
        height: 24px;
        top: 50%;
        left: -7px;
        transform: translateY(-50%)rotate(180deg)
    }

    .semi-popover-wrapper[x-placement=right].semi-popover-with-arrow,
    .semi-popover-wrapper[x-placement=right] .semi-popover-with-arrow {
        min-height: 36px
    }

    .semi-popover-wrapper[x-placement=rightBottom] .semi-popover-icon-arrow {
        width: 8px;
        height: 24px;
        bottom: 6px;
        left: -7px;
        transform: rotate(180deg)
    }

    .semi-popover-wrapper[x-placement=rightBottom].semi-popover-with-arrow,
    .semi-popover-wrapper[x-placement=rightBottom] .semi-popover-with-arrow {
        min-height: 36px
    }

    .semi-popover-wrapper[x-placement=bottomLeft] .semi-popover-icon-arrow {
        top: -7px;
        left: 6px;
        transform: rotate(180deg)
    }

    .semi-popover-wrapper[x-placement=bottomLeft].semi-popover-with-arrow,
    .semi-popover-wrapper[x-placement=bottomLeft] .semi-popover-with-arrow {
        min-width: 36px
    }

    .semi-popover-wrapper[x-placement=bottom] .semi-popover-icon-arrow {
        top: -7px;
        left: 50%;
        transform: translate(-50%)rotate(180deg)
    }

    .semi-popover-wrapper[x-placement=bottom].semi-popover-with-arrow,
    .semi-popover-wrapper[x-placement=bottom] .semi-popover-with-arrow {
        min-width: 36px
    }

    .semi-popover-wrapper[x-placement=bottomRight] .semi-popover-icon-arrow {
        top: -7px;
        right: 6px;
        transform: rotate(180deg)
    }

    .semi-popover-wrapper[x-placement=bottomRight].semi-popover-with-arrow,
    .semi-popover-wrapper[x-placement=bottomRight] .semi-popover-with-arrow {
        min-width: 36px
    }

    .semi-popover.semi-popover-rtl {
        direction: rtl
    }
}


@layer base {
    .semi-list {
        font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif;
        font-size: 14px;
        line-height: 20px
    }

    .semi-list-items {
        margin: 0;
        padding: 0;
        list-style: none
    }

    .semi-list-header,
    .semi-list-footer {
        padding: 12px 24px
    }

    .semi-list-empty {
        color: var(--semi-color-text-2);
        text-align: center;
        width: 100%;
        padding: 12px 0
    }

    .semi-list-item {
        box-sizing: border-box;
        flex-wrap: wrap;
        align-items: center;
        margin: 0;
        padding: 12px 24px;
        list-style: none;
        display: flex
    }

    .semi-list-item-body {
        flex: 1;
        display: flex
    }

    .semi-list-item-body-header {
        margin-right: 20px
    }

    .semi-list-item-body-flex-start {
        align-items: flex-start
    }

    .semi-list-item-body-flex-end {
        align-items: flex-end
    }

    .semi-list-item-body-center {
        align-items: center
    }

    .semi-list-item-body-stretch {
        align-items: stretch
    }

    .semi-list-item-body-baseline {
        align-items: baseline
    }

    .semi-list-item-extra {
        flex: none;
        margin-left: 40px
    }

    .semi-list-split .semi-list-item {
        border-bottom: 1px solid var(--semi-color-border)
    }

    .semi-list-split .semi-list-item:last-child {
        border-bottom: none
    }

    .semi-list-split .semi-list-header {
        border-bottom: 1px solid var(--semi-color-border)
    }

    .semi-list-split .semi-list-footer {
        border-top: 1px solid var(--semi-color-border)
    }

    .semi-list-small .semi-list-item,
    .semi-list-small .semi-list-header,
    .semi-list-small .semi-list-footer {
        padding: 8px 16px
    }

    .semi-list-large .semi-list-item,
    .semi-list-large .semi-list-header,
    .semi-list-large .semi-list-footer {
        padding: 16px 24px
    }

    .semi-list.semi-list-grid .semi-list-item {
        padding: 0
    }

    .semi-list.semi-list-bordered {
        border: 1px solid var(--semi-color-border)
    }

    .semi-list.semi-list-flex .semi-list-items {
        display: flex
    }

    .semi-list.semi-list-flex.semi-list-split .semi-list-item {
        border-bottom: none;
        border-right: 1px solid var(--semi-color-border)
    }

    .semi-list.semi-list-flex.semi-list-split .semi-list-item:last-child {
        border-right: none
    }

    .semi-rtl .semi-list,
    .semi-portal-rtl .semi-list,
    .semi-rtl .semi-list-item,
    .semi-portal-rtl .semi-list-item {
        direction: rtl
    }

    .semi-rtl .semi-list-item-body-header,
    .semi-portal-rtl .semi-list-item-body-header {
        margin-left: 20px;
        margin-right: auto
    }

    .semi-rtl .semi-list-item-extra,
    .semi-portal-rtl .semi-list-item-extra {
        flex: none;
        margin-left: 0;
        margin-right: 40px
    }

    .semi-rtl .semi-list.semi-list-flex.semi-list-split .semi-list-item,
    .semi-portal-rtl .semi-list.semi-list-flex.semi-list-split .semi-list-item {
        border-bottom: none;
        border-right: 0;
        border-left: 1px solid var(--semi-color-border)
    }

    .semi-rtl .semi-list.semi-list-flex.semi-list-split .semi-list-item:last-child,
    .semi-portal-rtl .semi-list.semi-list-flex.semi-list-split .semi-list-item:last-child {
        border-left: none
    }
}


@layer base {
    .semi-row {
        box-sizing: border-box;
        zoom: 1;
        height: auto;
        margin-left: 0;
        margin-right: 0;
        display: block;
        position: relative
    }

    .semi-row:before,
    .semi-row:after {
        content: "";
        display: table
    }

    .semi-row:after {
        clear: both
    }

    .semi-row-flex {
        flex-flow: wrap;
        display: flex
    }

    .semi-row-flex:before,
    .semi-row-flex:after {
        display: flex
    }

    .semi-col-0,
    .semi-col-xs-0,
    .semi-col-sm-0,
    .semi-col-md-0,
    .semi-col-lg-0,
    .semi-col-xl-0,
    .semi-col-xxl-0 {
        display: none
    }

    .semi-row-flex-start {
        justify-content: flex-start
    }

    .semi-row-flex-center {
        justify-content: center
    }

    .semi-row-flex-end {
        justify-content: flex-end
    }

    .semi-row-flex-space-between {
        justify-content: space-between
    }

    .semi-row-flex-space-around {
        justify-content: space-around
    }

    .semi-row-flex-top {
        align-items: flex-start
    }

    .semi-row-flex-middle {
        align-items: center
    }

    .semi-row-flex-bottom {
        align-items: flex-end
    }

    .semi-col {
        position: relative
    }

    .semi-col-1,
    .semi-col-xs-1,
    .semi-col-sm-1,
    .semi-col-md-1,
    .semi-col-lg-1,
    .semi-col-2,
    .semi-col-xs-2,
    .semi-col-sm-2,
    .semi-col-md-2,
    .semi-col-lg-2,
    .semi-col-3,
    .semi-col-xs-3,
    .semi-col-sm-3,
    .semi-col-md-3,
    .semi-col-lg-3,
    .semi-col-4,
    .semi-col-xs-4,
    .semi-col-sm-4,
    .semi-col-md-4,
    .semi-col-lg-4,
    .semi-col-5,
    .semi-col-xs-5,
    .semi-col-sm-5,
    .semi-col-md-5,
    .semi-col-lg-5,
    .semi-col-6,
    .semi-col-xs-6,
    .semi-col-sm-6,
    .semi-col-md-6,
    .semi-col-lg-6,
    .semi-col-7,
    .semi-col-xs-7,
    .semi-col-sm-7,
    .semi-col-md-7,
    .semi-col-lg-7,
    .semi-col-8,
    .semi-col-xs-8,
    .semi-col-sm-8,
    .semi-col-md-8,
    .semi-col-lg-8,
    .semi-col-9,
    .semi-col-xs-9,
    .semi-col-sm-9,
    .semi-col-md-9,
    .semi-col-lg-9,
    .semi-col-10,
    .semi-col-xs-10,
    .semi-col-sm-10,
    .semi-col-md-10,
    .semi-col-lg-10,
    .semi-col-11,
    .semi-col-xs-11,
    .semi-col-sm-11,
    .semi-col-md-11,
    .semi-col-lg-11,
    .semi-col-12,
    .semi-col-xs-12,
    .semi-col-sm-12,
    .semi-col-md-12,
    .semi-col-lg-12,
    .semi-col-13,
    .semi-col-xs-13,
    .semi-col-sm-13,
    .semi-col-md-13,
    .semi-col-lg-13,
    .semi-col-14,
    .semi-col-xs-14,
    .semi-col-sm-14,
    .semi-col-md-14,
    .semi-col-lg-14,
    .semi-col-15,
    .semi-col-xs-15,
    .semi-col-sm-15,
    .semi-col-md-15,
    .semi-col-lg-15,
    .semi-col-16,
    .semi-col-xs-16,
    .semi-col-sm-16,
    .semi-col-md-16,
    .semi-col-lg-16,
    .semi-col-17,
    .semi-col-xs-17,
    .semi-col-sm-17,
    .semi-col-md-17,
    .semi-col-lg-17,
    .semi-col-18,
    .semi-col-xs-18,
    .semi-col-sm-18,
    .semi-col-md-18,
    .semi-col-lg-18,
    .semi-col-19,
    .semi-col-xs-19,
    .semi-col-sm-19,
    .semi-col-md-19,
    .semi-col-lg-19,
    .semi-col-20,
    .semi-col-xs-20,
    .semi-col-sm-20,
    .semi-col-md-20,
    .semi-col-lg-20,
    .semi-col-21,
    .semi-col-xs-21,
    .semi-col-sm-21,
    .semi-col-md-21,
    .semi-col-lg-21,
    .semi-col-22,
    .semi-col-xs-22,
    .semi-col-sm-22,
    .semi-col-md-22,
    .semi-col-lg-22,
    .semi-col-23,
    .semi-col-xs-23,
    .semi-col-sm-23,
    .semi-col-md-23,
    .semi-col-lg-23,
    .semi-col-24,
    .semi-col-xs-24,
    .semi-col-sm-24,
    .semi-col-md-24,
    .semi-col-lg-24 {
        min-height: 1px;
        padding-left: 0;
        padding-right: 0;
        position: relative
    }

    .semi-col-1,
    .semi-col-2,
    .semi-col-3,
    .semi-col-4,
    .semi-col-5,
    .semi-col-6,
    .semi-col-7,
    .semi-col-8,
    .semi-col-9,
    .semi-col-10,
    .semi-col-11,
    .semi-col-12,
    .semi-col-13,
    .semi-col-14,
    .semi-col-15,
    .semi-col-16,
    .semi-col-17,
    .semi-col-18,
    .semi-col-19,
    .semi-col-20,
    .semi-col-21,
    .semi-col-22,
    .semi-col-23,
    .semi-col-24 {
        float: left;
        flex: none
    }

    .semi-col-1 {
        box-sizing: border-box;
        width: 4.16667%;
        display: block
    }

    .semi-col-push-1 {
        left: 4.16667%
    }

    .semi-col-pull-1 {
        right: 4.16667%
    }

    .semi-col-offset-1 {
        margin-left: 4.16667%
    }

    .semi-col-order-1 {
        order: 1
    }

    .semi-col-2 {
        box-sizing: border-box;
        width: 8.33333%;
        display: block
    }

    .semi-col-push-2 {
        left: 8.33333%
    }

    .semi-col-pull-2 {
        right: 8.33333%
    }

    .semi-col-offset-2 {
        margin-left: 8.33333%
    }

    .semi-col-order-2 {
        order: 2
    }

    .semi-col-3 {
        box-sizing: border-box;
        width: 12.5%;
        display: block
    }

    .semi-col-push-3 {
        left: 12.5%
    }

    .semi-col-pull-3 {
        right: 12.5%
    }

    .semi-col-offset-3 {
        margin-left: 12.5%
    }

    .semi-col-order-3 {
        order: 3
    }

    .semi-col-4 {
        box-sizing: border-box;
        width: 16.6667%;
        display: block
    }

    .semi-col-push-4 {
        left: 16.6667%
    }

    .semi-col-pull-4 {
        right: 16.6667%
    }

    .semi-col-offset-4 {
        margin-left: 16.6667%
    }

    .semi-col-order-4 {
        order: 4
    }

    .semi-col-5 {
        box-sizing: border-box;
        width: 20.8333%;
        display: block
    }

    .semi-col-push-5 {
        left: 20.8333%
    }

    .semi-col-pull-5 {
        right: 20.8333%
    }

    .semi-col-offset-5 {
        margin-left: 20.8333%
    }

    .semi-col-order-5 {
        order: 5
    }

    .semi-col-6 {
        box-sizing: border-box;
        width: 25%;
        display: block
    }

    .semi-col-push-6 {
        left: 25%
    }

    .semi-col-pull-6 {
        right: 25%
    }

    .semi-col-offset-6 {
        margin-left: 25%
    }

    .semi-col-order-6 {
        order: 6
    }

    .semi-col-7 {
        box-sizing: border-box;
        width: 29.1667%;
        display: block
    }

    .semi-col-push-7 {
        left: 29.1667%
    }

    .semi-col-pull-7 {
        right: 29.1667%
    }

    .semi-col-offset-7 {
        margin-left: 29.1667%
    }

    .semi-col-order-7 {
        order: 7
    }

    .semi-col-8 {
        box-sizing: border-box;
        width: 33.3333%;
        display: block
    }

    .semi-col-push-8 {
        left: 33.3333%
    }

    .semi-col-pull-8 {
        right: 33.3333%
    }

    .semi-col-offset-8 {
        margin-left: 33.3333%
    }

    .semi-col-order-8 {
        order: 8
    }

    .semi-col-9 {
        box-sizing: border-box;
        width: 37.5%;
        display: block
    }

    .semi-col-push-9 {
        left: 37.5%
    }

    .semi-col-pull-9 {
        right: 37.5%
    }

    .semi-col-offset-9 {
        margin-left: 37.5%
    }

    .semi-col-order-9 {
        order: 9
    }

    .semi-col-10 {
        box-sizing: border-box;
        width: 41.6667%;
        display: block
    }

    .semi-col-push-10 {
        left: 41.6667%
    }

    .semi-col-pull-10 {
        right: 41.6667%
    }

    .semi-col-offset-10 {
        margin-left: 41.6667%
    }

    .semi-col-order-10 {
        order: 10
    }

    .semi-col-11 {
        box-sizing: border-box;
        width: 45.8333%;
        display: block
    }

    .semi-col-push-11 {
        left: 45.8333%
    }

    .semi-col-pull-11 {
        right: 45.8333%
    }

    .semi-col-offset-11 {
        margin-left: 45.8333%
    }

    .semi-col-order-11 {
        order: 11
    }

    .semi-col-12 {
        box-sizing: border-box;
        width: 50%;
        display: block
    }

    .semi-col-push-12 {
        left: 50%
    }

    .semi-col-pull-12 {
        right: 50%
    }

    .semi-col-offset-12 {
        margin-left: 50%
    }

    .semi-col-order-12 {
        order: 12
    }

    .semi-col-13 {
        box-sizing: border-box;
        width: 54.1667%;
        display: block
    }

    .semi-col-push-13 {
        left: 54.1667%
    }

    .semi-col-pull-13 {
        right: 54.1667%
    }

    .semi-col-offset-13 {
        margin-left: 54.1667%
    }

    .semi-col-order-13 {
        order: 13
    }

    .semi-col-14 {
        box-sizing: border-box;
        width: 58.3333%;
        display: block
    }

    .semi-col-push-14 {
        left: 58.3333%
    }

    .semi-col-pull-14 {
        right: 58.3333%
    }

    .semi-col-offset-14 {
        margin-left: 58.3333%
    }

    .semi-col-order-14 {
        order: 14
    }

    .semi-col-15 {
        box-sizing: border-box;
        width: 62.5%;
        display: block
    }

    .semi-col-push-15 {
        left: 62.5%
    }

    .semi-col-pull-15 {
        right: 62.5%
    }

    .semi-col-offset-15 {
        margin-left: 62.5%
    }

    .semi-col-order-15 {
        order: 15
    }

    .semi-col-16 {
        box-sizing: border-box;
        width: 66.6667%;
        display: block
    }

    .semi-col-push-16 {
        left: 66.6667%
    }

    .semi-col-pull-16 {
        right: 66.6667%
    }

    .semi-col-offset-16 {
        margin-left: 66.6667%
    }

    .semi-col-order-16 {
        order: 16
    }

    .semi-col-17 {
        box-sizing: border-box;
        width: 70.8333%;
        display: block
    }

    .semi-col-push-17 {
        left: 70.8333%
    }

    .semi-col-pull-17 {
        right: 70.8333%
    }

    .semi-col-offset-17 {
        margin-left: 70.8333%
    }

    .semi-col-order-17 {
        order: 17
    }

    .semi-col-18 {
        box-sizing: border-box;
        width: 75%;
        display: block
    }

    .semi-col-push-18 {
        left: 75%
    }

    .semi-col-pull-18 {
        right: 75%
    }

    .semi-col-offset-18 {
        margin-left: 75%
    }

    .semi-col-order-18 {
        order: 18
    }

    .semi-col-19 {
        box-sizing: border-box;
        width: 79.1667%;
        display: block
    }

    .semi-col-push-19 {
        left: 79.1667%
    }

    .semi-col-pull-19 {
        right: 79.1667%
    }

    .semi-col-offset-19 {
        margin-left: 79.1667%
    }

    .semi-col-order-19 {
        order: 19
    }

    .semi-col-20 {
        box-sizing: border-box;
        width: 83.3333%;
        display: block
    }

    .semi-col-push-20 {
        left: 83.3333%
    }

    .semi-col-pull-20 {
        right: 83.3333%
    }

    .semi-col-offset-20 {
        margin-left: 83.3333%
    }

    .semi-col-order-20 {
        order: 20
    }

    .semi-col-21 {
        box-sizing: border-box;
        width: 87.5%;
        display: block
    }

    .semi-col-push-21 {
        left: 87.5%
    }

    .semi-col-pull-21 {
        right: 87.5%
    }

    .semi-col-offset-21 {
        margin-left: 87.5%
    }

    .semi-col-order-21 {
        order: 21
    }

    .semi-col-22 {
        box-sizing: border-box;
        width: 91.6667%;
        display: block
    }

    .semi-col-push-22 {
        left: 91.6667%
    }

    .semi-col-pull-22 {
        right: 91.6667%
    }

    .semi-col-offset-22 {
        margin-left: 91.6667%
    }

    .semi-col-order-22 {
        order: 22
    }

    .semi-col-23 {
        box-sizing: border-box;
        width: 95.8333%;
        display: block
    }

    .semi-col-push-23 {
        left: 95.8333%
    }

    .semi-col-pull-23 {
        right: 95.8333%
    }

    .semi-col-offset-23 {
        margin-left: 95.8333%
    }

    .semi-col-order-23 {
        order: 23
    }

    .semi-col-24 {
        box-sizing: border-box;
        width: 100%;
        display: block
    }

    .semi-col-push-24 {
        left: 100%
    }

    .semi-col-pull-24 {
        right: 100%
    }

    .semi-col-offset-24 {
        margin-left: 100%
    }

    .semi-col-order-24 {
        order: 24
    }

    .semi-rtl .semi-col-1,
    .semi-rtl .semi-col-2,
    .semi-rtl .semi-col-3,
    .semi-rtl .semi-col-4,
    .semi-rtl .semi-col-5,
    .semi-rtl .semi-col-6,
    .semi-rtl .semi-col-7,
    .semi-rtl .semi-col-8,
    .semi-rtl .semi-col-9,
    .semi-rtl .semi-col-10,
    .semi-rtl .semi-col-11,
    .semi-rtl .semi-col-12,
    .semi-rtl .semi-col-13,
    .semi-rtl .semi-col-14,
    .semi-rtl .semi-col-15,
    .semi-rtl .semi-col-16,
    .semi-rtl .semi-col-17,
    .semi-rtl .semi-col-18,
    .semi-rtl .semi-col-19,
    .semi-rtl .semi-col-20,
    .semi-rtl .semi-col-21,
    .semi-rtl .semi-col-22,
    .semi-rtl .semi-col-23,
    .semi-rtl .semi-col-24 {
        float: right
    }

    .semi-rtl .semi-col-offset-1 {
        margin-left: auto;
        margin-right: 4.16667%
    }

    .semi-rtl .semi-col-offset-2 {
        margin-left: auto;
        margin-right: 8.33333%
    }

    .semi-rtl .semi-col-offset-3 {
        margin-left: auto;
        margin-right: 12.5%
    }

    .semi-rtl .semi-col-offset-4 {
        margin-left: auto;
        margin-right: 16.6667%
    }

    .semi-rtl .semi-col-offset-5 {
        margin-left: auto;
        margin-right: 20.8333%
    }

    .semi-rtl .semi-col-offset-6 {
        margin-left: auto;
        margin-right: 25%
    }

    .semi-rtl .semi-col-offset-7 {
        margin-left: auto;
        margin-right: 29.1667%
    }

    .semi-rtl .semi-col-offset-8 {
        margin-left: auto;
        margin-right: 33.3333%
    }

    .semi-rtl .semi-col-offset-9 {
        margin-left: auto;
        margin-right: 37.5%
    }

    .semi-rtl .semi-col-offset-10 {
        margin-left: auto;
        margin-right: 41.6667%
    }

    .semi-rtl .semi-col-offset-11 {
        margin-left: auto;
        margin-right: 45.8333%
    }

    .semi-rtl .semi-col-offset-12 {
        margin-left: auto;
        margin-right: 50%
    }

    .semi-rtl .semi-col-offset-13 {
        margin-left: auto;
        margin-right: 54.1667%
    }

    .semi-rtl .semi-col-offset-14 {
        margin-left: auto;
        margin-right: 58.3333%
    }

    .semi-rtl .semi-col-offset-15 {
        margin-left: auto;
        margin-right: 62.5%
    }

    .semi-rtl .semi-col-offset-16 {
        margin-left: auto;
        margin-right: 66.6667%
    }

    .semi-rtl .semi-col-offset-17 {
        margin-left: auto;
        margin-right: 70.8333%
    }

    .semi-rtl .semi-col-offset-18 {
        margin-left: auto;
        margin-right: 75%
    }

    .semi-rtl .semi-col-offset-19 {
        margin-left: auto;
        margin-right: 79.1667%
    }

    .semi-rtl .semi-col-offset-20 {
        margin-left: auto;
        margin-right: 83.3333%
    }

    .semi-rtl .semi-col-offset-21 {
        margin-left: auto;
        margin-right: 87.5%
    }

    .semi-rtl .semi-col-offset-22 {
        margin-left: auto;
        margin-right: 91.6667%
    }

    .semi-rtl .semi-col-offset-23 {
        margin-left: auto;
        margin-right: 95.8333%
    }

    .semi-rtl .semi-col-offset-24 {
        margin-left: auto;
        margin-right: 100%
    }

    .semi-col-xs-1,
    .semi-col-xs-2,
    .semi-col-xs-3,
    .semi-col-xs-4,
    .semi-col-xs-5,
    .semi-col-xs-6,
    .semi-col-xs-7,
    .semi-col-xs-8,
    .semi-col-xs-9,
    .semi-col-xs-10,
    .semi-col-xs-11,
    .semi-col-xs-12,
    .semi-col-xs-13,
    .semi-col-xs-14,
    .semi-col-xs-15,
    .semi-col-xs-16,
    .semi-col-xs-17,
    .semi-col-xs-18,
    .semi-col-xs-19,
    .semi-col-xs-20,
    .semi-col-xs-21,
    .semi-col-xs-22,
    .semi-col-xs-23,
    .semi-col-xs-24 {
        float: left;
        flex: none
    }

    .semi-col-xs-1 {
        box-sizing: border-box;
        width: 4.16667%;
        display: block
    }

    .semi-col-xs-push-1 {
        left: 4.16667%
    }

    .semi-col-xs-pull-1 {
        right: 4.16667%
    }

    .semi-col-xs-offset-1 {
        margin-left: 4.16667%
    }

    .semi-col-xs-order-1 {
        order: 1
    }

    .semi-col-xs-2 {
        box-sizing: border-box;
        width: 8.33333%;
        display: block
    }

    .semi-col-xs-push-2 {
        left: 8.33333%
    }

    .semi-col-xs-pull-2 {
        right: 8.33333%
    }

    .semi-col-xs-offset-2 {
        margin-left: 8.33333%
    }

    .semi-col-xs-order-2 {
        order: 2
    }

    .semi-col-xs-3 {
        box-sizing: border-box;
        width: 12.5%;
        display: block
    }

    .semi-col-xs-push-3 {
        left: 12.5%
    }

    .semi-col-xs-pull-3 {
        right: 12.5%
    }

    .semi-col-xs-offset-3 {
        margin-left: 12.5%
    }

    .semi-col-xs-order-3 {
        order: 3
    }

    .semi-col-xs-4 {
        box-sizing: border-box;
        width: 16.6667%;
        display: block
    }

    .semi-col-xs-push-4 {
        left: 16.6667%
    }

    .semi-col-xs-pull-4 {
        right: 16.6667%
    }

    .semi-col-xs-offset-4 {
        margin-left: 16.6667%
    }

    .semi-col-xs-order-4 {
        order: 4
    }

    .semi-col-xs-5 {
        box-sizing: border-box;
        width: 20.8333%;
        display: block
    }

    .semi-col-xs-push-5 {
        left: 20.8333%
    }

    .semi-col-xs-pull-5 {
        right: 20.8333%
    }

    .semi-col-xs-offset-5 {
        margin-left: 20.8333%
    }

    .semi-col-xs-order-5 {
        order: 5
    }

    .semi-col-xs-6 {
        box-sizing: border-box;
        width: 25%;
        display: block
    }

    .semi-col-xs-push-6 {
        left: 25%
    }

    .semi-col-xs-pull-6 {
        right: 25%
    }

    .semi-col-xs-offset-6 {
        margin-left: 25%
    }

    .semi-col-xs-order-6 {
        order: 6
    }

    .semi-col-xs-7 {
        box-sizing: border-box;
        width: 29.1667%;
        display: block
    }

    .semi-col-xs-push-7 {
        left: 29.1667%
    }

    .semi-col-xs-pull-7 {
        right: 29.1667%
    }

    .semi-col-xs-offset-7 {
        margin-left: 29.1667%
    }

    .semi-col-xs-order-7 {
        order: 7
    }

    .semi-col-xs-8 {
        box-sizing: border-box;
        width: 33.3333%;
        display: block
    }

    .semi-col-xs-push-8 {
        left: 33.3333%
    }

    .semi-col-xs-pull-8 {
        right: 33.3333%
    }

    .semi-col-xs-offset-8 {
        margin-left: 33.3333%
    }

    .semi-col-xs-order-8 {
        order: 8
    }

    .semi-col-xs-9 {
        box-sizing: border-box;
        width: 37.5%;
        display: block
    }

    .semi-col-xs-push-9 {
        left: 37.5%
    }

    .semi-col-xs-pull-9 {
        right: 37.5%
    }

    .semi-col-xs-offset-9 {
        margin-left: 37.5%
    }

    .semi-col-xs-order-9 {
        order: 9
    }

    .semi-col-xs-10 {
        box-sizing: border-box;
        width: 41.6667%;
        display: block
    }

    .semi-col-xs-push-10 {
        left: 41.6667%
    }

    .semi-col-xs-pull-10 {
        right: 41.6667%
    }

    .semi-col-xs-offset-10 {
        margin-left: 41.6667%
    }

    .semi-col-xs-order-10 {
        order: 10
    }

    .semi-col-xs-11 {
        box-sizing: border-box;
        width: 45.8333%;
        display: block
    }

    .semi-col-xs-push-11 {
        left: 45.8333%
    }

    .semi-col-xs-pull-11 {
        right: 45.8333%
    }

    .semi-col-xs-offset-11 {
        margin-left: 45.8333%
    }

    .semi-col-xs-order-11 {
        order: 11
    }

    .semi-col-xs-12 {
        box-sizing: border-box;
        width: 50%;
        display: block
    }

    .semi-col-xs-push-12 {
        left: 50%
    }

    .semi-col-xs-pull-12 {
        right: 50%
    }

    .semi-col-xs-offset-12 {
        margin-left: 50%
    }

    .semi-col-xs-order-12 {
        order: 12
    }

    .semi-col-xs-13 {
        box-sizing: border-box;
        width: 54.1667%;
        display: block
    }

    .semi-col-xs-push-13 {
        left: 54.1667%
    }

    .semi-col-xs-pull-13 {
        right: 54.1667%
    }

    .semi-col-xs-offset-13 {
        margin-left: 54.1667%
    }

    .semi-col-xs-order-13 {
        order: 13
    }

    .semi-col-xs-14 {
        box-sizing: border-box;
        width: 58.3333%;
        display: block
    }

    .semi-col-xs-push-14 {
        left: 58.3333%
    }

    .semi-col-xs-pull-14 {
        right: 58.3333%
    }

    .semi-col-xs-offset-14 {
        margin-left: 58.3333%
    }

    .semi-col-xs-order-14 {
        order: 14
    }

    .semi-col-xs-15 {
        box-sizing: border-box;
        width: 62.5%;
        display: block
    }

    .semi-col-xs-push-15 {
        left: 62.5%
    }

    .semi-col-xs-pull-15 {
        right: 62.5%
    }

    .semi-col-xs-offset-15 {
        margin-left: 62.5%
    }

    .semi-col-xs-order-15 {
        order: 15
    }

    .semi-col-xs-16 {
        box-sizing: border-box;
        width: 66.6667%;
        display: block
    }

    .semi-col-xs-push-16 {
        left: 66.6667%
    }

    .semi-col-xs-pull-16 {
        right: 66.6667%
    }

    .semi-col-xs-offset-16 {
        margin-left: 66.6667%
    }

    .semi-col-xs-order-16 {
        order: 16
    }

    .semi-col-xs-17 {
        box-sizing: border-box;
        width: 70.8333%;
        display: block
    }

    .semi-col-xs-push-17 {
        left: 70.8333%
    }

    .semi-col-xs-pull-17 {
        right: 70.8333%
    }

    .semi-col-xs-offset-17 {
        margin-left: 70.8333%
    }

    .semi-col-xs-order-17 {
        order: 17
    }

    .semi-col-xs-18 {
        box-sizing: border-box;
        width: 75%;
        display: block
    }

    .semi-col-xs-push-18 {
        left: 75%
    }

    .semi-col-xs-pull-18 {
        right: 75%
    }

    .semi-col-xs-offset-18 {
        margin-left: 75%
    }

    .semi-col-xs-order-18 {
        order: 18
    }

    .semi-col-xs-19 {
        box-sizing: border-box;
        width: 79.1667%;
        display: block
    }

    .semi-col-xs-push-19 {
        left: 79.1667%
    }

    .semi-col-xs-pull-19 {
        right: 79.1667%
    }

    .semi-col-xs-offset-19 {
        margin-left: 79.1667%
    }

    .semi-col-xs-order-19 {
        order: 19
    }

    .semi-col-xs-20 {
        box-sizing: border-box;
        width: 83.3333%;
        display: block
    }

    .semi-col-xs-push-20 {
        left: 83.3333%
    }

    .semi-col-xs-pull-20 {
        right: 83.3333%
    }

    .semi-col-xs-offset-20 {
        margin-left: 83.3333%
    }

    .semi-col-xs-order-20 {
        order: 20
    }

    .semi-col-xs-21 {
        box-sizing: border-box;
        width: 87.5%;
        display: block
    }

    .semi-col-xs-push-21 {
        left: 87.5%
    }

    .semi-col-xs-pull-21 {
        right: 87.5%
    }

    .semi-col-xs-offset-21 {
        margin-left: 87.5%
    }

    .semi-col-xs-order-21 {
        order: 21
    }

    .semi-col-xs-22 {
        box-sizing: border-box;
        width: 91.6667%;
        display: block
    }

    .semi-col-xs-push-22 {
        left: 91.6667%
    }

    .semi-col-xs-pull-22 {
        right: 91.6667%
    }

    .semi-col-xs-offset-22 {
        margin-left: 91.6667%
    }

    .semi-col-xs-order-22 {
        order: 22
    }

    .semi-col-xs-23 {
        box-sizing: border-box;
        width: 95.8333%;
        display: block
    }

    .semi-col-xs-push-23 {
        left: 95.8333%
    }

    .semi-col-xs-pull-23 {
        right: 95.8333%
    }

    .semi-col-xs-offset-23 {
        margin-left: 95.8333%
    }

    .semi-col-xs-order-23 {
        order: 23
    }

    .semi-col-xs-24 {
        box-sizing: border-box;
        width: 100%;
        display: block
    }

    .semi-col-xs-push-24 {
        left: 100%
    }

    .semi-col-xs-pull-24 {
        right: 100%
    }

    .semi-col-xs-offset-24 {
        margin-left: 100%
    }

    .semi-col-xs-order-24 {
        order: 24
    }

    .semi-rtl .semi-col-xs-1,
    .semi-rtl .semi-col-xs-2,
    .semi-rtl .semi-col-xs-3,
    .semi-rtl .semi-col-xs-4,
    .semi-rtl .semi-col-xs-5,
    .semi-rtl .semi-col-xs-6,
    .semi-rtl .semi-col-xs-7,
    .semi-rtl .semi-col-xs-8,
    .semi-rtl .semi-col-xs-9,
    .semi-rtl .semi-col-xs-10,
    .semi-rtl .semi-col-xs-11,
    .semi-rtl .semi-col-xs-12,
    .semi-rtl .semi-col-xs-13,
    .semi-rtl .semi-col-xs-14,
    .semi-rtl .semi-col-xs-15,
    .semi-rtl .semi-col-xs-16,
    .semi-rtl .semi-col-xs-17,
    .semi-rtl .semi-col-xs-18,
    .semi-rtl .semi-col-xs-19,
    .semi-rtl .semi-col-xs-20,
    .semi-rtl .semi-col-xs-21,
    .semi-rtl .semi-col-xs-22,
    .semi-rtl .semi-col-xs-23,
    .semi-rtl .semi-col-xs-24 {
        float: right
    }

    .semi-rtl .semi-col-xs-offset-1 {
        margin-left: auto;
        margin-right: 4.16667%
    }

    .semi-rtl .semi-col-xs-offset-2 {
        margin-left: auto;
        margin-right: 8.33333%
    }

    .semi-rtl .semi-col-xs-offset-3 {
        margin-left: auto;
        margin-right: 12.5%
    }

    .semi-rtl .semi-col-xs-offset-4 {
        margin-left: auto;
        margin-right: 16.6667%
    }

    .semi-rtl .semi-col-xs-offset-5 {
        margin-left: auto;
        margin-right: 20.8333%
    }

    .semi-rtl .semi-col-xs-offset-6 {
        margin-left: auto;
        margin-right: 25%
    }

    .semi-rtl .semi-col-xs-offset-7 {
        margin-left: auto;
        margin-right: 29.1667%
    }

    .semi-rtl .semi-col-xs-offset-8 {
        margin-left: auto;
        margin-right: 33.3333%
    }

    .semi-rtl .semi-col-xs-offset-9 {
        margin-left: auto;
        margin-right: 37.5%
    }

    .semi-rtl .semi-col-xs-offset-10 {
        margin-left: auto;
        margin-right: 41.6667%
    }

    .semi-rtl .semi-col-xs-offset-11 {
        margin-left: auto;
        margin-right: 45.8333%
    }

    .semi-rtl .semi-col-xs-offset-12 {
        margin-left: auto;
        margin-right: 50%
    }

    .semi-rtl .semi-col-xs-offset-13 {
        margin-left: auto;
        margin-right: 54.1667%
    }

    .semi-rtl .semi-col-xs-offset-14 {
        margin-left: auto;
        margin-right: 58.3333%
    }

    .semi-rtl .semi-col-xs-offset-15 {
        margin-left: auto;
        margin-right: 62.5%
    }

    .semi-rtl .semi-col-xs-offset-16 {
        margin-left: auto;
        margin-right: 66.6667%
    }

    .semi-rtl .semi-col-xs-offset-17 {
        margin-left: auto;
        margin-right: 70.8333%
    }

    .semi-rtl .semi-col-xs-offset-18 {
        margin-left: auto;
        margin-right: 75%
    }

    .semi-rtl .semi-col-xs-offset-19 {
        margin-left: auto;
        margin-right: 79.1667%
    }

    .semi-rtl .semi-col-xs-offset-20 {
        margin-left: auto;
        margin-right: 83.3333%
    }

    .semi-rtl .semi-col-xs-offset-21 {
        margin-left: auto;
        margin-right: 87.5%
    }

    .semi-rtl .semi-col-xs-offset-22 {
        margin-left: auto;
        margin-right: 91.6667%
    }

    .semi-rtl .semi-col-xs-offset-23 {
        margin-left: auto;
        margin-right: 95.8333%
    }

    .semi-rtl .semi-col-xs-offset-24 {
        margin-left: auto;
        margin-right: 100%
    }

    @media (min-width:576px) {

        .semi-col-sm-1,
        .semi-col-sm-2,
        .semi-col-sm-3,
        .semi-col-sm-4,
        .semi-col-sm-5,
        .semi-col-sm-6,
        .semi-col-sm-7,
        .semi-col-sm-8,
        .semi-col-sm-9,
        .semi-col-sm-10,
        .semi-col-sm-11,
        .semi-col-sm-12,
        .semi-col-sm-13,
        .semi-col-sm-14,
        .semi-col-sm-15,
        .semi-col-sm-16,
        .semi-col-sm-17,
        .semi-col-sm-18,
        .semi-col-sm-19,
        .semi-col-sm-20,
        .semi-col-sm-21,
        .semi-col-sm-22,
        .semi-col-sm-23,
        .semi-col-sm-24 {
            float: left;
            flex: none
        }

        .semi-col-sm-1 {
            box-sizing: border-box;
            width: 4.16667%;
            display: block
        }

        .semi-col-sm-push-1 {
            left: 4.16667%
        }

        .semi-col-sm-pull-1 {
            right: 4.16667%
        }

        .semi-col-sm-offset-1 {
            margin-left: 4.16667%
        }

        .semi-col-sm-order-1 {
            order: 1
        }

        .semi-col-sm-2 {
            box-sizing: border-box;
            width: 8.33333%;
            display: block
        }

        .semi-col-sm-push-2 {
            left: 8.33333%
        }

        .semi-col-sm-pull-2 {
            right: 8.33333%
        }

        .semi-col-sm-offset-2 {
            margin-left: 8.33333%
        }

        .semi-col-sm-order-2 {
            order: 2
        }

        .semi-col-sm-3 {
            box-sizing: border-box;
            width: 12.5%;
            display: block
        }

        .semi-col-sm-push-3 {
            left: 12.5%
        }

        .semi-col-sm-pull-3 {
            right: 12.5%
        }

        .semi-col-sm-offset-3 {
            margin-left: 12.5%
        }

        .semi-col-sm-order-3 {
            order: 3
        }

        .semi-col-sm-4 {
            box-sizing: border-box;
            width: 16.6667%;
            display: block
        }

        .semi-col-sm-push-4 {
            left: 16.6667%
        }

        .semi-col-sm-pull-4 {
            right: 16.6667%
        }

        .semi-col-sm-offset-4 {
            margin-left: 16.6667%
        }

        .semi-col-sm-order-4 {
            order: 4
        }

        .semi-col-sm-5 {
            box-sizing: border-box;
            width: 20.8333%;
            display: block
        }

        .semi-col-sm-push-5 {
            left: 20.8333%
        }

        .semi-col-sm-pull-5 {
            right: 20.8333%
        }

        .semi-col-sm-offset-5 {
            margin-left: 20.8333%
        }

        .semi-col-sm-order-5 {
            order: 5
        }

        .semi-col-sm-6 {
            box-sizing: border-box;
            width: 25%;
            display: block
        }

        .semi-col-sm-push-6 {
            left: 25%
        }

        .semi-col-sm-pull-6 {
            right: 25%
        }

        .semi-col-sm-offset-6 {
            margin-left: 25%
        }

        .semi-col-sm-order-6 {
            order: 6
        }

        .semi-col-sm-7 {
            box-sizing: border-box;
            width: 29.1667%;
            display: block
        }

        .semi-col-sm-push-7 {
            left: 29.1667%
        }

        .semi-col-sm-pull-7 {
            right: 29.1667%
        }

        .semi-col-sm-offset-7 {
            margin-left: 29.1667%
        }

        .semi-col-sm-order-7 {
            order: 7
        }

        .semi-col-sm-8 {
            box-sizing: border-box;
            width: 33.3333%;
            display: block
        }

        .semi-col-sm-push-8 {
            left: 33.3333%
        }

        .semi-col-sm-pull-8 {
            right: 33.3333%
        }

        .semi-col-sm-offset-8 {
            margin-left: 33.3333%
        }

        .semi-col-sm-order-8 {
            order: 8
        }

        .semi-col-sm-9 {
            box-sizing: border-box;
            width: 37.5%;
            display: block
        }

        .semi-col-sm-push-9 {
            left: 37.5%
        }

        .semi-col-sm-pull-9 {
            right: 37.5%
        }

        .semi-col-sm-offset-9 {
            margin-left: 37.5%
        }

        .semi-col-sm-order-9 {
            order: 9
        }

        .semi-col-sm-10 {
            box-sizing: border-box;
            width: 41.6667%;
            display: block
        }

        .semi-col-sm-push-10 {
            left: 41.6667%
        }

        .semi-col-sm-pull-10 {
            right: 41.6667%
        }

        .semi-col-sm-offset-10 {
            margin-left: 41.6667%
        }

        .semi-col-sm-order-10 {
            order: 10
        }

        .semi-col-sm-11 {
            box-sizing: border-box;
            width: 45.8333%;
            display: block
        }

        .semi-col-sm-push-11 {
            left: 45.8333%
        }

        .semi-col-sm-pull-11 {
            right: 45.8333%
        }

        .semi-col-sm-offset-11 {
            margin-left: 45.8333%
        }

        .semi-col-sm-order-11 {
            order: 11
        }

        .semi-col-sm-12 {
            box-sizing: border-box;
            width: 50%;
            display: block
        }

        .semi-col-sm-push-12 {
            left: 50%
        }

        .semi-col-sm-pull-12 {
            right: 50%
        }

        .semi-col-sm-offset-12 {
            margin-left: 50%
        }

        .semi-col-sm-order-12 {
            order: 12
        }

        .semi-col-sm-13 {
            box-sizing: border-box;
            width: 54.1667%;
            display: block
        }

        .semi-col-sm-push-13 {
            left: 54.1667%
        }

        .semi-col-sm-pull-13 {
            right: 54.1667%
        }

        .semi-col-sm-offset-13 {
            margin-left: 54.1667%
        }

        .semi-col-sm-order-13 {
            order: 13
        }

        .semi-col-sm-14 {
            box-sizing: border-box;
            width: 58.3333%;
            display: block
        }

        .semi-col-sm-push-14 {
            left: 58.3333%
        }

        .semi-col-sm-pull-14 {
            right: 58.3333%
        }

        .semi-col-sm-offset-14 {
            margin-left: 58.3333%
        }

        .semi-col-sm-order-14 {
            order: 14
        }

        .semi-col-sm-15 {
            box-sizing: border-box;
            width: 62.5%;
            display: block
        }

        .semi-col-sm-push-15 {
            left: 62.5%
        }

        .semi-col-sm-pull-15 {
            right: 62.5%
        }

        .semi-col-sm-offset-15 {
            margin-left: 62.5%
        }

        .semi-col-sm-order-15 {
            order: 15
        }

        .semi-col-sm-16 {
            box-sizing: border-box;
            width: 66.6667%;
            display: block
        }

        .semi-col-sm-push-16 {
            left: 66.6667%
        }

        .semi-col-sm-pull-16 {
            right: 66.6667%
        }

        .semi-col-sm-offset-16 {
            margin-left: 66.6667%
        }

        .semi-col-sm-order-16 {
            order: 16
        }

        .semi-col-sm-17 {
            box-sizing: border-box;
            width: 70.8333%;
            display: block
        }

        .semi-col-sm-push-17 {
            left: 70.8333%
        }

        .semi-col-sm-pull-17 {
            right: 70.8333%
        }

        .semi-col-sm-offset-17 {
            margin-left: 70.8333%
        }

        .semi-col-sm-order-17 {
            order: 17
        }

        .semi-col-sm-18 {
            box-sizing: border-box;
            width: 75%;
            display: block
        }

        .semi-col-sm-push-18 {
            left: 75%
        }

        .semi-col-sm-pull-18 {
            right: 75%
        }

        .semi-col-sm-offset-18 {
            margin-left: 75%
        }

        .semi-col-sm-order-18 {
            order: 18
        }

        .semi-col-sm-19 {
            box-sizing: border-box;
            width: 79.1667%;
            display: block
        }

        .semi-col-sm-push-19 {
            left: 79.1667%
        }

        .semi-col-sm-pull-19 {
            right: 79.1667%
        }

        .semi-col-sm-offset-19 {
            margin-left: 79.1667%
        }

        .semi-col-sm-order-19 {
            order: 19
        }

        .semi-col-sm-20 {
            box-sizing: border-box;
            width: 83.3333%;
            display: block
        }

        .semi-col-sm-push-20 {
            left: 83.3333%
        }

        .semi-col-sm-pull-20 {
            right: 83.3333%
        }

        .semi-col-sm-offset-20 {
            margin-left: 83.3333%
        }

        .semi-col-sm-order-20 {
            order: 20
        }

        .semi-col-sm-21 {
            box-sizing: border-box;
            width: 87.5%;
            display: block
        }

        .semi-col-sm-push-21 {
            left: 87.5%
        }

        .semi-col-sm-pull-21 {
            right: 87.5%
        }

        .semi-col-sm-offset-21 {
            margin-left: 87.5%
        }

        .semi-col-sm-order-21 {
            order: 21
        }

        .semi-col-sm-22 {
            box-sizing: border-box;
            width: 91.6667%;
            display: block
        }

        .semi-col-sm-push-22 {
            left: 91.6667%
        }

        .semi-col-sm-pull-22 {
            right: 91.6667%
        }

        .semi-col-sm-offset-22 {
            margin-left: 91.6667%
        }

        .semi-col-sm-order-22 {
            order: 22
        }

        .semi-col-sm-23 {
            box-sizing: border-box;
            width: 95.8333%;
            display: block
        }

        .semi-col-sm-push-23 {
            left: 95.8333%
        }

        .semi-col-sm-pull-23 {
            right: 95.8333%
        }

        .semi-col-sm-offset-23 {
            margin-left: 95.8333%
        }

        .semi-col-sm-order-23 {
            order: 23
        }

        .semi-col-sm-24 {
            box-sizing: border-box;
            width: 100%;
            display: block
        }

        .semi-col-sm-push-24 {
            left: 100%
        }

        .semi-col-sm-pull-24 {
            right: 100%
        }

        .semi-col-sm-offset-24 {
            margin-left: 100%
        }

        .semi-col-sm-order-24 {
            order: 24
        }

        .semi-rtl .semi-col-sm-1,
        .semi-rtl .semi-col-sm-2,
        .semi-rtl .semi-col-sm-3,
        .semi-rtl .semi-col-sm-4,
        .semi-rtl .semi-col-sm-5,
        .semi-rtl .semi-col-sm-6,
        .semi-rtl .semi-col-sm-7,
        .semi-rtl .semi-col-sm-8,
        .semi-rtl .semi-col-sm-9,
        .semi-rtl .semi-col-sm-10,
        .semi-rtl .semi-col-sm-11,
        .semi-rtl .semi-col-sm-12,
        .semi-rtl .semi-col-sm-13,
        .semi-rtl .semi-col-sm-14,
        .semi-rtl .semi-col-sm-15,
        .semi-rtl .semi-col-sm-16,
        .semi-rtl .semi-col-sm-17,
        .semi-rtl .semi-col-sm-18,
        .semi-rtl .semi-col-sm-19,
        .semi-rtl .semi-col-sm-20,
        .semi-rtl .semi-col-sm-21,
        .semi-rtl .semi-col-sm-22,
        .semi-rtl .semi-col-sm-23,
        .semi-rtl .semi-col-sm-24 {
            float: right
        }

        .semi-rtl .semi-col-sm-offset-1 {
            margin-left: auto;
            margin-right: 4.16667%
        }

        .semi-rtl .semi-col-sm-offset-2 {
            margin-left: auto;
            margin-right: 8.33333%
        }

        .semi-rtl .semi-col-sm-offset-3 {
            margin-left: auto;
            margin-right: 12.5%
        }

        .semi-rtl .semi-col-sm-offset-4 {
            margin-left: auto;
            margin-right: 16.6667%
        }

        .semi-rtl .semi-col-sm-offset-5 {
            margin-left: auto;
            margin-right: 20.8333%
        }

        .semi-rtl .semi-col-sm-offset-6 {
            margin-left: auto;
            margin-right: 25%
        }

        .semi-rtl .semi-col-sm-offset-7 {
            margin-left: auto;
            margin-right: 29.1667%
        }

        .semi-rtl .semi-col-sm-offset-8 {
            margin-left: auto;
            margin-right: 33.3333%
        }

        .semi-rtl .semi-col-sm-offset-9 {
            margin-left: auto;
            margin-right: 37.5%
        }

        .semi-rtl .semi-col-sm-offset-10 {
            margin-left: auto;
            margin-right: 41.6667%
        }

        .semi-rtl .semi-col-sm-offset-11 {
            margin-left: auto;
            margin-right: 45.8333%
        }

        .semi-rtl .semi-col-sm-offset-12 {
            margin-left: auto;
            margin-right: 50%
        }

        .semi-rtl .semi-col-sm-offset-13 {
            margin-left: auto;
            margin-right: 54.1667%
        }

        .semi-rtl .semi-col-sm-offset-14 {
            margin-left: auto;
            margin-right: 58.3333%
        }

        .semi-rtl .semi-col-sm-offset-15 {
            margin-left: auto;
            margin-right: 62.5%
        }

        .semi-rtl .semi-col-sm-offset-16 {
            margin-left: auto;
            margin-right: 66.6667%
        }

        .semi-rtl .semi-col-sm-offset-17 {
            margin-left: auto;
            margin-right: 70.8333%
        }

        .semi-rtl .semi-col-sm-offset-18 {
            margin-left: auto;
            margin-right: 75%
        }

        .semi-rtl .semi-col-sm-offset-19 {
            margin-left: auto;
            margin-right: 79.1667%
        }

        .semi-rtl .semi-col-sm-offset-20 {
            margin-left: auto;
            margin-right: 83.3333%
        }

        .semi-rtl .semi-col-sm-offset-21 {
            margin-left: auto;
            margin-right: 87.5%
        }

        .semi-rtl .semi-col-sm-offset-22 {
            margin-left: auto;
            margin-right: 91.6667%
        }

        .semi-rtl .semi-col-sm-offset-23 {
            margin-left: auto;
            margin-right: 95.8333%
        }

        .semi-rtl .semi-col-sm-offset-24 {
            margin-left: auto;
            margin-right: 100%
        }
    }

    @media (min-width:768px) {

        .semi-col-md-1,
        .semi-col-md-2,
        .semi-col-md-3,
        .semi-col-md-4,
        .semi-col-md-5,
        .semi-col-md-6,
        .semi-col-md-7,
        .semi-col-md-8,
        .semi-col-md-9,
        .semi-col-md-10,
        .semi-col-md-11,
        .semi-col-md-12,
        .semi-col-md-13,
        .semi-col-md-14,
        .semi-col-md-15,
        .semi-col-md-16,
        .semi-col-md-17,
        .semi-col-md-18,
        .semi-col-md-19,
        .semi-col-md-20,
        .semi-col-md-21,
        .semi-col-md-22,
        .semi-col-md-23,
        .semi-col-md-24 {
            float: left;
            flex: none
        }

        .semi-col-md-1 {
            box-sizing: border-box;
            width: 4.16667%;
            display: block
        }

        .semi-col-md-push-1 {
            left: 4.16667%
        }

        .semi-col-md-pull-1 {
            right: 4.16667%
        }

        .semi-col-md-offset-1 {
            margin-left: 4.16667%
        }

        .semi-col-md-order-1 {
            order: 1
        }

        .semi-col-md-2 {
            box-sizing: border-box;
            width: 8.33333%;
            display: block
        }

        .semi-col-md-push-2 {
            left: 8.33333%
        }

        .semi-col-md-pull-2 {
            right: 8.33333%
        }

        .semi-col-md-offset-2 {
            margin-left: 8.33333%
        }

        .semi-col-md-order-2 {
            order: 2
        }

        .semi-col-md-3 {
            box-sizing: border-box;
            width: 12.5%;
            display: block
        }

        .semi-col-md-push-3 {
            left: 12.5%
        }

        .semi-col-md-pull-3 {
            right: 12.5%
        }

        .semi-col-md-offset-3 {
            margin-left: 12.5%
        }

        .semi-col-md-order-3 {
            order: 3
        }

        .semi-col-md-4 {
            box-sizing: border-box;
            width: 16.6667%;
            display: block
        }

        .semi-col-md-push-4 {
            left: 16.6667%
        }

        .semi-col-md-pull-4 {
            right: 16.6667%
        }

        .semi-col-md-offset-4 {
            margin-left: 16.6667%
        }

        .semi-col-md-order-4 {
            order: 4
        }

        .semi-col-md-5 {
            box-sizing: border-box;
            width: 20.8333%;
            display: block
        }

        .semi-col-md-push-5 {
            left: 20.8333%
        }

        .semi-col-md-pull-5 {
            right: 20.8333%
        }

        .semi-col-md-offset-5 {
            margin-left: 20.8333%
        }

        .semi-col-md-order-5 {
            order: 5
        }

        .semi-col-md-6 {
            box-sizing: border-box;
            width: 25%;
            display: block
        }

        .semi-col-md-push-6 {
            left: 25%
        }

        .semi-col-md-pull-6 {
            right: 25%
        }

        .semi-col-md-offset-6 {
            margin-left: 25%
        }

        .semi-col-md-order-6 {
            order: 6
        }

        .semi-col-md-7 {
            box-sizing: border-box;
            width: 29.1667%;
            display: block
        }

        .semi-col-md-push-7 {
            left: 29.1667%
        }

        .semi-col-md-pull-7 {
            right: 29.1667%
        }

        .semi-col-md-offset-7 {
            margin-left: 29.1667%
        }

        .semi-col-md-order-7 {
            order: 7
        }

        .semi-col-md-8 {
            box-sizing: border-box;
            width: 33.3333%;
            display: block
        }

        .semi-col-md-push-8 {
            left: 33.3333%
        }

        .semi-col-md-pull-8 {
            right: 33.3333%
        }

        .semi-col-md-offset-8 {
            margin-left: 33.3333%
        }

        .semi-col-md-order-8 {
            order: 8
        }

        .semi-col-md-9 {
            box-sizing: border-box;
            width: 37.5%;
            display: block
        }

        .semi-col-md-push-9 {
            left: 37.5%
        }

        .semi-col-md-pull-9 {
            right: 37.5%
        }

        .semi-col-md-offset-9 {
            margin-left: 37.5%
        }

        .semi-col-md-order-9 {
            order: 9
        }

        .semi-col-md-10 {
            box-sizing: border-box;
            width: 41.6667%;
            display: block
        }

        .semi-col-md-push-10 {
            left: 41.6667%
        }

        .semi-col-md-pull-10 {
            right: 41.6667%
        }

        .semi-col-md-offset-10 {
            margin-left: 41.6667%
        }

        .semi-col-md-order-10 {
            order: 10
        }

        .semi-col-md-11 {
            box-sizing: border-box;
            width: 45.8333%;
            display: block
        }

        .semi-col-md-push-11 {
            left: 45.8333%
        }

        .semi-col-md-pull-11 {
            right: 45.8333%
        }

        .semi-col-md-offset-11 {
            margin-left: 45.8333%
        }

        .semi-col-md-order-11 {
            order: 11
        }

        .semi-col-md-12 {
            box-sizing: border-box;
            width: 50%;
            display: block
        }

        .semi-col-md-push-12 {
            left: 50%
        }

        .semi-col-md-pull-12 {
            right: 50%
        }

        .semi-col-md-offset-12 {
            margin-left: 50%
        }

        .semi-col-md-order-12 {
            order: 12
        }

        .semi-col-md-13 {
            box-sizing: border-box;
            width: 54.1667%;
            display: block
        }

        .semi-col-md-push-13 {
            left: 54.1667%
        }

        .semi-col-md-pull-13 {
            right: 54.1667%
        }

        .semi-col-md-offset-13 {
            margin-left: 54.1667%
        }

        .semi-col-md-order-13 {
            order: 13
        }

        .semi-col-md-14 {
            box-sizing: border-box;
            width: 58.3333%;
            display: block
        }

        .semi-col-md-push-14 {
            left: 58.3333%
        }

        .semi-col-md-pull-14 {
            right: 58.3333%
        }

        .semi-col-md-offset-14 {
            margin-left: 58.3333%
        }

        .semi-col-md-order-14 {
            order: 14
        }

        .semi-col-md-15 {
            box-sizing: border-box;
            width: 62.5%;
            display: block
        }

        .semi-col-md-push-15 {
            left: 62.5%
        }

        .semi-col-md-pull-15 {
            right: 62.5%
        }

        .semi-col-md-offset-15 {
            margin-left: 62.5%
        }

        .semi-col-md-order-15 {
            order: 15
        }

        .semi-col-md-16 {
            box-sizing: border-box;
            width: 66.6667%;
            display: block
        }

        .semi-col-md-push-16 {
            left: 66.6667%
        }

        .semi-col-md-pull-16 {
            right: 66.6667%
        }

        .semi-col-md-offset-16 {
            margin-left: 66.6667%
        }

        .semi-col-md-order-16 {
            order: 16
        }

        .semi-col-md-17 {
            box-sizing: border-box;
            width: 70.8333%;
            display: block
        }

        .semi-col-md-push-17 {
            left: 70.8333%
        }

        .semi-col-md-pull-17 {
            right: 70.8333%
        }

        .semi-col-md-offset-17 {
            margin-left: 70.8333%
        }

        .semi-col-md-order-17 {
            order: 17
        }

        .semi-col-md-18 {
            box-sizing: border-box;
            width: 75%;
            display: block
        }

        .semi-col-md-push-18 {
            left: 75%
        }

        .semi-col-md-pull-18 {
            right: 75%
        }

        .semi-col-md-offset-18 {
            margin-left: 75%
        }

        .semi-col-md-order-18 {
            order: 18
        }

        .semi-col-md-19 {
            box-sizing: border-box;
            width: 79.1667%;
            display: block
        }

        .semi-col-md-push-19 {
            left: 79.1667%
        }

        .semi-col-md-pull-19 {
            right: 79.1667%
        }

        .semi-col-md-offset-19 {
            margin-left: 79.1667%
        }

        .semi-col-md-order-19 {
            order: 19
        }

        .semi-col-md-20 {
            box-sizing: border-box;
            width: 83.3333%;
            display: block
        }

        .semi-col-md-push-20 {
            left: 83.3333%
        }

        .semi-col-md-pull-20 {
            right: 83.3333%
        }

        .semi-col-md-offset-20 {
            margin-left: 83.3333%
        }

        .semi-col-md-order-20 {
            order: 20
        }

        .semi-col-md-21 {
            box-sizing: border-box;
            width: 87.5%;
            display: block
        }

        .semi-col-md-push-21 {
            left: 87.5%
        }

        .semi-col-md-pull-21 {
            right: 87.5%
        }

        .semi-col-md-offset-21 {
            margin-left: 87.5%
        }

        .semi-col-md-order-21 {
            order: 21
        }

        .semi-col-md-22 {
            box-sizing: border-box;
            width: 91.6667%;
            display: block
        }

        .semi-col-md-push-22 {
            left: 91.6667%
        }

        .semi-col-md-pull-22 {
            right: 91.6667%
        }

        .semi-col-md-offset-22 {
            margin-left: 91.6667%
        }

        .semi-col-md-order-22 {
            order: 22
        }

        .semi-col-md-23 {
            box-sizing: border-box;
            width: 95.8333%;
            display: block
        }

        .semi-col-md-push-23 {
            left: 95.8333%
        }

        .semi-col-md-pull-23 {
            right: 95.8333%
        }

        .semi-col-md-offset-23 {
            margin-left: 95.8333%
        }

        .semi-col-md-order-23 {
            order: 23
        }

        .semi-col-md-24 {
            box-sizing: border-box;
            width: 100%;
            display: block
        }

        .semi-col-md-push-24 {
            left: 100%
        }

        .semi-col-md-pull-24 {
            right: 100%
        }

        .semi-col-md-offset-24 {
            margin-left: 100%
        }

        .semi-col-md-order-24 {
            order: 24
        }

        .semi-rtl .semi-col-md-1,
        .semi-rtl .semi-col-md-2,
        .semi-rtl .semi-col-md-3,
        .semi-rtl .semi-col-md-4,
        .semi-rtl .semi-col-md-5,
        .semi-rtl .semi-col-md-6,
        .semi-rtl .semi-col-md-7,
        .semi-rtl .semi-col-md-8,
        .semi-rtl .semi-col-md-9,
        .semi-rtl .semi-col-md-10,
        .semi-rtl .semi-col-md-11,
        .semi-rtl .semi-col-md-12,
        .semi-rtl .semi-col-md-13,
        .semi-rtl .semi-col-md-14,
        .semi-rtl .semi-col-md-15,
        .semi-rtl .semi-col-md-16,
        .semi-rtl .semi-col-md-17,
        .semi-rtl .semi-col-md-18,
        .semi-rtl .semi-col-md-19,
        .semi-rtl .semi-col-md-20,
        .semi-rtl .semi-col-md-21,
        .semi-rtl .semi-col-md-22,
        .semi-rtl .semi-col-md-23,
        .semi-rtl .semi-col-md-24 {
            float: right
        }

        .semi-rtl .semi-col-md-offset-1 {
            margin-left: auto;
            margin-right: 4.16667%
        }

        .semi-rtl .semi-col-md-offset-2 {
            margin-left: auto;
            margin-right: 8.33333%
        }

        .semi-rtl .semi-col-md-offset-3 {
            margin-left: auto;
            margin-right: 12.5%
        }

        .semi-rtl .semi-col-md-offset-4 {
            margin-left: auto;
            margin-right: 16.6667%
        }

        .semi-rtl .semi-col-md-offset-5 {
            margin-left: auto;
            margin-right: 20.8333%
        }

        .semi-rtl .semi-col-md-offset-6 {
            margin-left: auto;
            margin-right: 25%
        }

        .semi-rtl .semi-col-md-offset-7 {
            margin-left: auto;
            margin-right: 29.1667%
        }

        .semi-rtl .semi-col-md-offset-8 {
            margin-left: auto;
            margin-right: 33.3333%
        }

        .semi-rtl .semi-col-md-offset-9 {
            margin-left: auto;
            margin-right: 37.5%
        }

        .semi-rtl .semi-col-md-offset-10 {
            margin-left: auto;
            margin-right: 41.6667%
        }

        .semi-rtl .semi-col-md-offset-11 {
            margin-left: auto;
            margin-right: 45.8333%
        }

        .semi-rtl .semi-col-md-offset-12 {
            margin-left: auto;
            margin-right: 50%
        }

        .semi-rtl .semi-col-md-offset-13 {
            margin-left: auto;
            margin-right: 54.1667%
        }

        .semi-rtl .semi-col-md-offset-14 {
            margin-left: auto;
            margin-right: 58.3333%
        }

        .semi-rtl .semi-col-md-offset-15 {
            margin-left: auto;
            margin-right: 62.5%
        }

        .semi-rtl .semi-col-md-offset-16 {
            margin-left: auto;
            margin-right: 66.6667%
        }

        .semi-rtl .semi-col-md-offset-17 {
            margin-left: auto;
            margin-right: 70.8333%
        }

        .semi-rtl .semi-col-md-offset-18 {
            margin-left: auto;
            margin-right: 75%
        }

        .semi-rtl .semi-col-md-offset-19 {
            margin-left: auto;
            margin-right: 79.1667%
        }

        .semi-rtl .semi-col-md-offset-20 {
            margin-left: auto;
            margin-right: 83.3333%
        }

        .semi-rtl .semi-col-md-offset-21 {
            margin-left: auto;
            margin-right: 87.5%
        }

        .semi-rtl .semi-col-md-offset-22 {
            margin-left: auto;
            margin-right: 91.6667%
        }

        .semi-rtl .semi-col-md-offset-23 {
            margin-left: auto;
            margin-right: 95.8333%
        }

        .semi-rtl .semi-col-md-offset-24 {
            margin-left: auto;
            margin-right: 100%
        }
    }

    @media (min-width:992px) {

        .semi-col-lg-1,
        .semi-col-lg-2,
        .semi-col-lg-3,
        .semi-col-lg-4,
        .semi-col-lg-5,
        .semi-col-lg-6,
        .semi-col-lg-7,
        .semi-col-lg-8,
        .semi-col-lg-9,
        .semi-col-lg-10,
        .semi-col-lg-11,
        .semi-col-lg-12,
        .semi-col-lg-13,
        .semi-col-lg-14,
        .semi-col-lg-15,
        .semi-col-lg-16,
        .semi-col-lg-17,
        .semi-col-lg-18,
        .semi-col-lg-19,
        .semi-col-lg-20,
        .semi-col-lg-21,
        .semi-col-lg-22,
        .semi-col-lg-23,
        .semi-col-lg-24 {
            float: left;
            flex: none
        }

        .semi-col-lg-1 {
            box-sizing: border-box;
            width: 4.16667%;
            display: block
        }

        .semi-col-lg-push-1 {
            left: 4.16667%
        }

        .semi-col-lg-pull-1 {
            right: 4.16667%
        }

        .semi-col-lg-offset-1 {
            margin-left: 4.16667%
        }

        .semi-col-lg-order-1 {
            order: 1
        }

        .semi-col-lg-2 {
            box-sizing: border-box;
            width: 8.33333%;
            display: block
        }

        .semi-col-lg-push-2 {
            left: 8.33333%
        }

        .semi-col-lg-pull-2 {
            right: 8.33333%
        }

        .semi-col-lg-offset-2 {
            margin-left: 8.33333%
        }

        .semi-col-lg-order-2 {
            order: 2
        }

        .semi-col-lg-3 {
            box-sizing: border-box;
            width: 12.5%;
            display: block
        }

        .semi-col-lg-push-3 {
            left: 12.5%
        }

        .semi-col-lg-pull-3 {
            right: 12.5%
        }

        .semi-col-lg-offset-3 {
            margin-left: 12.5%
        }

        .semi-col-lg-order-3 {
            order: 3
        }

        .semi-col-lg-4 {
            box-sizing: border-box;
            width: 16.6667%;
            display: block
        }

        .semi-col-lg-push-4 {
            left: 16.6667%
        }

        .semi-col-lg-pull-4 {
            right: 16.6667%
        }

        .semi-col-lg-offset-4 {
            margin-left: 16.6667%
        }

        .semi-col-lg-order-4 {
            order: 4
        }

        .semi-col-lg-5 {
            box-sizing: border-box;
            width: 20.8333%;
            display: block
        }

        .semi-col-lg-push-5 {
            left: 20.8333%
        }

        .semi-col-lg-pull-5 {
            right: 20.8333%
        }

        .semi-col-lg-offset-5 {
            margin-left: 20.8333%
        }

        .semi-col-lg-order-5 {
            order: 5
        }

        .semi-col-lg-6 {
            box-sizing: border-box;
            width: 25%;
            display: block
        }

        .semi-col-lg-push-6 {
            left: 25%
        }

        .semi-col-lg-pull-6 {
            right: 25%
        }

        .semi-col-lg-offset-6 {
            margin-left: 25%
        }

        .semi-col-lg-order-6 {
            order: 6
        }

        .semi-col-lg-7 {
            box-sizing: border-box;
            width: 29.1667%;
            display: block
        }

        .semi-col-lg-push-7 {
            left: 29.1667%
        }

        .semi-col-lg-pull-7 {
            right: 29.1667%
        }

        .semi-col-lg-offset-7 {
            margin-left: 29.1667%
        }

        .semi-col-lg-order-7 {
            order: 7
        }

        .semi-col-lg-8 {
            box-sizing: border-box;
            width: 33.3333%;
            display: block
        }

        .semi-col-lg-push-8 {
            left: 33.3333%
        }

        .semi-col-lg-pull-8 {
            right: 33.3333%
        }

        .semi-col-lg-offset-8 {
            margin-left: 33.3333%
        }

        .semi-col-lg-order-8 {
            order: 8
        }

        .semi-col-lg-9 {
            box-sizing: border-box;
            width: 37.5%;
            display: block
        }

        .semi-col-lg-push-9 {
            left: 37.5%
        }

        .semi-col-lg-pull-9 {
            right: 37.5%
        }

        .semi-col-lg-offset-9 {
            margin-left: 37.5%
        }

        .semi-col-lg-order-9 {
            order: 9
        }

        .semi-col-lg-10 {
            box-sizing: border-box;
            width: 41.6667%;
            display: block
        }

        .semi-col-lg-push-10 {
            left: 41.6667%
        }

        .semi-col-lg-pull-10 {
            right: 41.6667%
        }

        .semi-col-lg-offset-10 {
            margin-left: 41.6667%
        }

        .semi-col-lg-order-10 {
            order: 10
        }

        .semi-col-lg-11 {
            box-sizing: border-box;
            width: 45.8333%;
            display: block
        }

        .semi-col-lg-push-11 {
            left: 45.8333%
        }

        .semi-col-lg-pull-11 {
            right: 45.8333%
        }

        .semi-col-lg-offset-11 {
            margin-left: 45.8333%
        }

        .semi-col-lg-order-11 {
            order: 11
        }

        .semi-col-lg-12 {
            box-sizing: border-box;
            width: 50%;
            display: block
        }

        .semi-col-lg-push-12 {
            left: 50%
        }

        .semi-col-lg-pull-12 {
            right: 50%
        }

        .semi-col-lg-offset-12 {
            margin-left: 50%
        }

        .semi-col-lg-order-12 {
            order: 12
        }

        .semi-col-lg-13 {
            box-sizing: border-box;
            width: 54.1667%;
            display: block
        }

        .semi-col-lg-push-13 {
            left: 54.1667%
        }

        .semi-col-lg-pull-13 {
            right: 54.1667%
        }

        .semi-col-lg-offset-13 {
            margin-left: 54.1667%
        }

        .semi-col-lg-order-13 {
            order: 13
        }

        .semi-col-lg-14 {
            box-sizing: border-box;
            width: 58.3333%;
            display: block
        }

        .semi-col-lg-push-14 {
            left: 58.3333%
        }

        .semi-col-lg-pull-14 {
            right: 58.3333%
        }

        .semi-col-lg-offset-14 {
            margin-left: 58.3333%
        }

        .semi-col-lg-order-14 {
            order: 14
        }

        .semi-col-lg-15 {
            box-sizing: border-box;
            width: 62.5%;
            display: block
        }

        .semi-col-lg-push-15 {
            left: 62.5%
        }

        .semi-col-lg-pull-15 {
            right: 62.5%
        }

        .semi-col-lg-offset-15 {
            margin-left: 62.5%
        }

        .semi-col-lg-order-15 {
            order: 15
        }

        .semi-col-lg-16 {
            box-sizing: border-box;
            width: 66.6667%;
            display: block
        }

        .semi-col-lg-push-16 {
            left: 66.6667%
        }

        .semi-col-lg-pull-16 {
            right: 66.6667%
        }

        .semi-col-lg-offset-16 {
            margin-left: 66.6667%
        }

        .semi-col-lg-order-16 {
            order: 16
        }

        .semi-col-lg-17 {
            box-sizing: border-box;
            width: 70.8333%;
            display: block
        }

        .semi-col-lg-push-17 {
            left: 70.8333%
        }

        .semi-col-lg-pull-17 {
            right: 70.8333%
        }

        .semi-col-lg-offset-17 {
            margin-left: 70.8333%
        }

        .semi-col-lg-order-17 {
            order: 17
        }

        .semi-col-lg-18 {
            box-sizing: border-box;
            width: 75%;
            display: block
        }

        .semi-col-lg-push-18 {
            left: 75%
        }

        .semi-col-lg-pull-18 {
            right: 75%
        }

        .semi-col-lg-offset-18 {
            margin-left: 75%
        }

        .semi-col-lg-order-18 {
            order: 18
        }

        .semi-col-lg-19 {
            box-sizing: border-box;
            width: 79.1667%;
            display: block
        }

        .semi-col-lg-push-19 {
            left: 79.1667%
        }

        .semi-col-lg-pull-19 {
            right: 79.1667%
        }

        .semi-col-lg-offset-19 {
            margin-left: 79.1667%
        }

        .semi-col-lg-order-19 {
            order: 19
        }

        .semi-col-lg-20 {
            box-sizing: border-box;
            width: 83.3333%;
            display: block
        }

        .semi-col-lg-push-20 {
            left: 83.3333%
        }

        .semi-col-lg-pull-20 {
            right: 83.3333%
        }

        .semi-col-lg-offset-20 {
            margin-left: 83.3333%
        }

        .semi-col-lg-order-20 {
            order: 20
        }

        .semi-col-lg-21 {
            box-sizing: border-box;
            width: 87.5%;
            display: block
        }

        .semi-col-lg-push-21 {
            left: 87.5%
        }

        .semi-col-lg-pull-21 {
            right: 87.5%
        }

        .semi-col-lg-offset-21 {
            margin-left: 87.5%
        }

        .semi-col-lg-order-21 {
            order: 21
        }

        .semi-col-lg-22 {
            box-sizing: border-box;
            width: 91.6667%;
            display: block
        }

        .semi-col-lg-push-22 {
            left: 91.6667%
        }

        .semi-col-lg-pull-22 {
            right: 91.6667%
        }

        .semi-col-lg-offset-22 {
            margin-left: 91.6667%
        }

        .semi-col-lg-order-22 {
            order: 22
        }

        .semi-col-lg-23 {
            box-sizing: border-box;
            width: 95.8333%;
            display: block
        }

        .semi-col-lg-push-23 {
            left: 95.8333%
        }

        .semi-col-lg-pull-23 {
            right: 95.8333%
        }

        .semi-col-lg-offset-23 {
            margin-left: 95.8333%
        }

        .semi-col-lg-order-23 {
            order: 23
        }

        .semi-col-lg-24 {
            box-sizing: border-box;
            width: 100%;
            display: block
        }

        .semi-col-lg-push-24 {
            left: 100%
        }

        .semi-col-lg-pull-24 {
            right: 100%
        }

        .semi-col-lg-offset-24 {
            margin-left: 100%
        }

        .semi-col-lg-order-24 {
            order: 24
        }

        .semi-rtl .semi-col-lg-1,
        .semi-rtl .semi-col-lg-2,
        .semi-rtl .semi-col-lg-3,
        .semi-rtl .semi-col-lg-4,
        .semi-rtl .semi-col-lg-5,
        .semi-rtl .semi-col-lg-6,
        .semi-rtl .semi-col-lg-7,
        .semi-rtl .semi-col-lg-8,
        .semi-rtl .semi-col-lg-9,
        .semi-rtl .semi-col-lg-10,
        .semi-rtl .semi-col-lg-11,
        .semi-rtl .semi-col-lg-12,
        .semi-rtl .semi-col-lg-13,
        .semi-rtl .semi-col-lg-14,
        .semi-rtl .semi-col-lg-15,
        .semi-rtl .semi-col-lg-16,
        .semi-rtl .semi-col-lg-17,
        .semi-rtl .semi-col-lg-18,
        .semi-rtl .semi-col-lg-19,
        .semi-rtl .semi-col-lg-20,
        .semi-rtl .semi-col-lg-21,
        .semi-rtl .semi-col-lg-22,
        .semi-rtl .semi-col-lg-23,
        .semi-rtl .semi-col-lg-24 {
            float: right
        }

        .semi-rtl .semi-col-lg-offset-1 {
            margin-left: auto;
            margin-right: 4.16667%
        }

        .semi-rtl .semi-col-lg-offset-2 {
            margin-left: auto;
            margin-right: 8.33333%
        }

        .semi-rtl .semi-col-lg-offset-3 {
            margin-left: auto;
            margin-right: 12.5%
        }

        .semi-rtl .semi-col-lg-offset-4 {
            margin-left: auto;
            margin-right: 16.6667%
        }

        .semi-rtl .semi-col-lg-offset-5 {
            margin-left: auto;
            margin-right: 20.8333%
        }

        .semi-rtl .semi-col-lg-offset-6 {
            margin-left: auto;
            margin-right: 25%
        }

        .semi-rtl .semi-col-lg-offset-7 {
            margin-left: auto;
            margin-right: 29.1667%
        }

        .semi-rtl .semi-col-lg-offset-8 {
            margin-left: auto;
            margin-right: 33.3333%
        }

        .semi-rtl .semi-col-lg-offset-9 {
            margin-left: auto;
            margin-right: 37.5%
        }

        .semi-rtl .semi-col-lg-offset-10 {
            margin-left: auto;
            margin-right: 41.6667%
        }

        .semi-rtl .semi-col-lg-offset-11 {
            margin-left: auto;
            margin-right: 45.8333%
        }

        .semi-rtl .semi-col-lg-offset-12 {
            margin-left: auto;
            margin-right: 50%
        }

        .semi-rtl .semi-col-lg-offset-13 {
            margin-left: auto;
            margin-right: 54.1667%
        }

        .semi-rtl .semi-col-lg-offset-14 {
            margin-left: auto;
            margin-right: 58.3333%
        }

        .semi-rtl .semi-col-lg-offset-15 {
            margin-left: auto;
            margin-right: 62.5%
        }

        .semi-rtl .semi-col-lg-offset-16 {
            margin-left: auto;
            margin-right: 66.6667%
        }

        .semi-rtl .semi-col-lg-offset-17 {
            margin-left: auto;
            margin-right: 70.8333%
        }

        .semi-rtl .semi-col-lg-offset-18 {
            margin-left: auto;
            margin-right: 75%
        }

        .semi-rtl .semi-col-lg-offset-19 {
            margin-left: auto;
            margin-right: 79.1667%
        }

        .semi-rtl .semi-col-lg-offset-20 {
            margin-left: auto;
            margin-right: 83.3333%
        }

        .semi-rtl .semi-col-lg-offset-21 {
            margin-left: auto;
            margin-right: 87.5%
        }

        .semi-rtl .semi-col-lg-offset-22 {
            margin-left: auto;
            margin-right: 91.6667%
        }

        .semi-rtl .semi-col-lg-offset-23 {
            margin-left: auto;
            margin-right: 95.8333%
        }

        .semi-rtl .semi-col-lg-offset-24 {
            margin-left: auto;
            margin-right: 100%
        }
    }

    @media (min-width:1200px) {

        .semi-col-xl-1,
        .semi-col-xl-2,
        .semi-col-xl-3,
        .semi-col-xl-4,
        .semi-col-xl-5,
        .semi-col-xl-6,
        .semi-col-xl-7,
        .semi-col-xl-8,
        .semi-col-xl-9,
        .semi-col-xl-10,
        .semi-col-xl-11,
        .semi-col-xl-12,
        .semi-col-xl-13,
        .semi-col-xl-14,
        .semi-col-xl-15,
        .semi-col-xl-16,
        .semi-col-xl-17,
        .semi-col-xl-18,
        .semi-col-xl-19,
        .semi-col-xl-20,
        .semi-col-xl-21,
        .semi-col-xl-22,
        .semi-col-xl-23,
        .semi-col-xl-24 {
            float: left;
            flex: none
        }

        .semi-col-xl-1 {
            box-sizing: border-box;
            width: 4.16667%;
            display: block
        }

        .semi-col-xl-push-1 {
            left: 4.16667%
        }

        .semi-col-xl-pull-1 {
            right: 4.16667%
        }

        .semi-col-xl-offset-1 {
            margin-left: 4.16667%
        }

        .semi-col-xl-order-1 {
            order: 1
        }

        .semi-col-xl-2 {
            box-sizing: border-box;
            width: 8.33333%;
            display: block
        }

        .semi-col-xl-push-2 {
            left: 8.33333%
        }

        .semi-col-xl-pull-2 {
            right: 8.33333%
        }

        .semi-col-xl-offset-2 {
            margin-left: 8.33333%
        }

        .semi-col-xl-order-2 {
            order: 2
        }

        .semi-col-xl-3 {
            box-sizing: border-box;
            width: 12.5%;
            display: block
        }

        .semi-col-xl-push-3 {
            left: 12.5%
        }

        .semi-col-xl-pull-3 {
            right: 12.5%
        }

        .semi-col-xl-offset-3 {
            margin-left: 12.5%
        }

        .semi-col-xl-order-3 {
            order: 3
        }

        .semi-col-xl-4 {
            box-sizing: border-box;
            width: 16.6667%;
            display: block
        }

        .semi-col-xl-push-4 {
            left: 16.6667%
        }

        .semi-col-xl-pull-4 {
            right: 16.6667%
        }

        .semi-col-xl-offset-4 {
            margin-left: 16.6667%
        }

        .semi-col-xl-order-4 {
            order: 4
        }

        .semi-col-xl-5 {
            box-sizing: border-box;
            width: 20.8333%;
            display: block
        }

        .semi-col-xl-push-5 {
            left: 20.8333%
        }

        .semi-col-xl-pull-5 {
            right: 20.8333%
        }

        .semi-col-xl-offset-5 {
            margin-left: 20.8333%
        }

        .semi-col-xl-order-5 {
            order: 5
        }

        .semi-col-xl-6 {
            box-sizing: border-box;
            width: 25%;
            display: block
        }

        .semi-col-xl-push-6 {
            left: 25%
        }

        .semi-col-xl-pull-6 {
            right: 25%
        }

        .semi-col-xl-offset-6 {
            margin-left: 25%
        }

        .semi-col-xl-order-6 {
            order: 6
        }

        .semi-col-xl-7 {
            box-sizing: border-box;
            width: 29.1667%;
            display: block
        }

        .semi-col-xl-push-7 {
            left: 29.1667%
        }

        .semi-col-xl-pull-7 {
            right: 29.1667%
        }

        .semi-col-xl-offset-7 {
            margin-left: 29.1667%
        }

        .semi-col-xl-order-7 {
            order: 7
        }

        .semi-col-xl-8 {
            box-sizing: border-box;
            width: 33.3333%;
            display: block
        }

        .semi-col-xl-push-8 {
            left: 33.3333%
        }

        .semi-col-xl-pull-8 {
            right: 33.3333%
        }

        .semi-col-xl-offset-8 {
            margin-left: 33.3333%
        }

        .semi-col-xl-order-8 {
            order: 8
        }

        .semi-col-xl-9 {
            box-sizing: border-box;
            width: 37.5%;
            display: block
        }

        .semi-col-xl-push-9 {
            left: 37.5%
        }

        .semi-col-xl-pull-9 {
            right: 37.5%
        }

        .semi-col-xl-offset-9 {
            margin-left: 37.5%
        }

        .semi-col-xl-order-9 {
            order: 9
        }

        .semi-col-xl-10 {
            box-sizing: border-box;
            width: 41.6667%;
            display: block
        }

        .semi-col-xl-push-10 {
            left: 41.6667%
        }

        .semi-col-xl-pull-10 {
            right: 41.6667%
        }

        .semi-col-xl-offset-10 {
            margin-left: 41.6667%
        }

        .semi-col-xl-order-10 {
            order: 10
        }

        .semi-col-xl-11 {
            box-sizing: border-box;
            width: 45.8333%;
            display: block
        }

        .semi-col-xl-push-11 {
            left: 45.8333%
        }

        .semi-col-xl-pull-11 {
            right: 45.8333%
        }

        .semi-col-xl-offset-11 {
            margin-left: 45.8333%
        }

        .semi-col-xl-order-11 {
            order: 11
        }

        .semi-col-xl-12 {
            box-sizing: border-box;
            width: 50%;
            display: block
        }

        .semi-col-xl-push-12 {
            left: 50%
        }

        .semi-col-xl-pull-12 {
            right: 50%
        }

        .semi-col-xl-offset-12 {
            margin-left: 50%
        }

        .semi-col-xl-order-12 {
            order: 12
        }

        .semi-col-xl-13 {
            box-sizing: border-box;
            width: 54.1667%;
            display: block
        }

        .semi-col-xl-push-13 {
            left: 54.1667%
        }

        .semi-col-xl-pull-13 {
            right: 54.1667%
        }

        .semi-col-xl-offset-13 {
            margin-left: 54.1667%
        }

        .semi-col-xl-order-13 {
            order: 13
        }

        .semi-col-xl-14 {
            box-sizing: border-box;
            width: 58.3333%;
            display: block
        }

        .semi-col-xl-push-14 {
            left: 58.3333%
        }

        .semi-col-xl-pull-14 {
            right: 58.3333%
        }

        .semi-col-xl-offset-14 {
            margin-left: 58.3333%
        }

        .semi-col-xl-order-14 {
            order: 14
        }

        .semi-col-xl-15 {
            box-sizing: border-box;
            width: 62.5%;
            display: block
        }

        .semi-col-xl-push-15 {
            left: 62.5%
        }

        .semi-col-xl-pull-15 {
            right: 62.5%
        }

        .semi-col-xl-offset-15 {
            margin-left: 62.5%
        }

        .semi-col-xl-order-15 {
            order: 15
        }

        .semi-col-xl-16 {
            box-sizing: border-box;
            width: 66.6667%;
            display: block
        }

        .semi-col-xl-push-16 {
            left: 66.6667%
        }

        .semi-col-xl-pull-16 {
            right: 66.6667%
        }

        .semi-col-xl-offset-16 {
            margin-left: 66.6667%
        }

        .semi-col-xl-order-16 {
            order: 16
        }

        .semi-col-xl-17 {
            box-sizing: border-box;
            width: 70.8333%;
            display: block
        }

        .semi-col-xl-push-17 {
            left: 70.8333%
        }

        .semi-col-xl-pull-17 {
            right: 70.8333%
        }

        .semi-col-xl-offset-17 {
            margin-left: 70.8333%
        }

        .semi-col-xl-order-17 {
            order: 17
        }

        .semi-col-xl-18 {
            box-sizing: border-box;
            width: 75%;
            display: block
        }

        .semi-col-xl-push-18 {
            left: 75%
        }

        .semi-col-xl-pull-18 {
            right: 75%
        }

        .semi-col-xl-offset-18 {
            margin-left: 75%
        }

        .semi-col-xl-order-18 {
            order: 18
        }

        .semi-col-xl-19 {
            box-sizing: border-box;
            width: 79.1667%;
            display: block
        }

        .semi-col-xl-push-19 {
            left: 79.1667%
        }

        .semi-col-xl-pull-19 {
            right: 79.1667%
        }

        .semi-col-xl-offset-19 {
            margin-left: 79.1667%
        }

        .semi-col-xl-order-19 {
            order: 19
        }

        .semi-col-xl-20 {
            box-sizing: border-box;
            width: 83.3333%;
            display: block
        }

        .semi-col-xl-push-20 {
            left: 83.3333%
        }

        .semi-col-xl-pull-20 {
            right: 83.3333%
        }

        .semi-col-xl-offset-20 {
            margin-left: 83.3333%
        }

        .semi-col-xl-order-20 {
            order: 20
        }

        .semi-col-xl-21 {
            box-sizing: border-box;
            width: 87.5%;
            display: block
        }

        .semi-col-xl-push-21 {
            left: 87.5%
        }

        .semi-col-xl-pull-21 {
            right: 87.5%
        }

        .semi-col-xl-offset-21 {
            margin-left: 87.5%
        }

        .semi-col-xl-order-21 {
            order: 21
        }

        .semi-col-xl-22 {
            box-sizing: border-box;
            width: 91.6667%;
            display: block
        }

        .semi-col-xl-push-22 {
            left: 91.6667%
        }

        .semi-col-xl-pull-22 {
            right: 91.6667%
        }

        .semi-col-xl-offset-22 {
            margin-left: 91.6667%
        }

        .semi-col-xl-order-22 {
            order: 22
        }

        .semi-col-xl-23 {
            box-sizing: border-box;
            width: 95.8333%;
            display: block
        }

        .semi-col-xl-push-23 {
            left: 95.8333%
        }

        .semi-col-xl-pull-23 {
            right: 95.8333%
        }

        .semi-col-xl-offset-23 {
            margin-left: 95.8333%
        }

        .semi-col-xl-order-23 {
            order: 23
        }

        .semi-col-xl-24 {
            box-sizing: border-box;
            width: 100%;
            display: block
        }

        .semi-col-xl-push-24 {
            left: 100%
        }

        .semi-col-xl-pull-24 {
            right: 100%
        }

        .semi-col-xl-offset-24 {
            margin-left: 100%
        }

        .semi-col-xl-order-24 {
            order: 24
        }

        .semi-rtl .semi-col-xl-1,
        .semi-rtl .semi-col-xl-2,
        .semi-rtl .semi-col-xl-3,
        .semi-rtl .semi-col-xl-4,
        .semi-rtl .semi-col-xl-5,
        .semi-rtl .semi-col-xl-6,
        .semi-rtl .semi-col-xl-7,
        .semi-rtl .semi-col-xl-8,
        .semi-rtl .semi-col-xl-9,
        .semi-rtl .semi-col-xl-10,
        .semi-rtl .semi-col-xl-11,
        .semi-rtl .semi-col-xl-12,
        .semi-rtl .semi-col-xl-13,
        .semi-rtl .semi-col-xl-14,
        .semi-rtl .semi-col-xl-15,
        .semi-rtl .semi-col-xl-16,
        .semi-rtl .semi-col-xl-17,
        .semi-rtl .semi-col-xl-18,
        .semi-rtl .semi-col-xl-19,
        .semi-rtl .semi-col-xl-20,
        .semi-rtl .semi-col-xl-21,
        .semi-rtl .semi-col-xl-22,
        .semi-rtl .semi-col-xl-23,
        .semi-rtl .semi-col-xl-24 {
            float: right
        }

        .semi-rtl .semi-col-xl-offset-1 {
            margin-left: auto;
            margin-right: 4.16667%
        }

        .semi-rtl .semi-col-xl-offset-2 {
            margin-left: auto;
            margin-right: 8.33333%
        }

        .semi-rtl .semi-col-xl-offset-3 {
            margin-left: auto;
            margin-right: 12.5%
        }

        .semi-rtl .semi-col-xl-offset-4 {
            margin-left: auto;
            margin-right: 16.6667%
        }

        .semi-rtl .semi-col-xl-offset-5 {
            margin-left: auto;
            margin-right: 20.8333%
        }

        .semi-rtl .semi-col-xl-offset-6 {
            margin-left: auto;
            margin-right: 25%
        }

        .semi-rtl .semi-col-xl-offset-7 {
            margin-left: auto;
            margin-right: 29.1667%
        }

        .semi-rtl .semi-col-xl-offset-8 {
            margin-left: auto;
            margin-right: 33.3333%
        }

        .semi-rtl .semi-col-xl-offset-9 {
            margin-left: auto;
            margin-right: 37.5%
        }

        .semi-rtl .semi-col-xl-offset-10 {
            margin-left: auto;
            margin-right: 41.6667%
        }

        .semi-rtl .semi-col-xl-offset-11 {
            margin-left: auto;
            margin-right: 45.8333%
        }

        .semi-rtl .semi-col-xl-offset-12 {
            margin-left: auto;
            margin-right: 50%
        }

        .semi-rtl .semi-col-xl-offset-13 {
            margin-left: auto;
            margin-right: 54.1667%
        }

        .semi-rtl .semi-col-xl-offset-14 {
            margin-left: auto;
            margin-right: 58.3333%
        }

        .semi-rtl .semi-col-xl-offset-15 {
            margin-left: auto;
            margin-right: 62.5%
        }

        .semi-rtl .semi-col-xl-offset-16 {
            margin-left: auto;
            margin-right: 66.6667%
        }

        .semi-rtl .semi-col-xl-offset-17 {
            margin-left: auto;
            margin-right: 70.8333%
        }

        .semi-rtl .semi-col-xl-offset-18 {
            margin-left: auto;
            margin-right: 75%
        }

        .semi-rtl .semi-col-xl-offset-19 {
            margin-left: auto;
            margin-right: 79.1667%
        }

        .semi-rtl .semi-col-xl-offset-20 {
            margin-left: auto;
            margin-right: 83.3333%
        }

        .semi-rtl .semi-col-xl-offset-21 {
            margin-left: auto;
            margin-right: 87.5%
        }

        .semi-rtl .semi-col-xl-offset-22 {
            margin-left: auto;
            margin-right: 91.6667%
        }

        .semi-rtl .semi-col-xl-offset-23 {
            margin-left: auto;
            margin-right: 95.8333%
        }

        .semi-rtl .semi-col-xl-offset-24 {
            margin-left: auto;
            margin-right: 100%
        }
    }

    @media (min-width:1600px) {

        .semi-col-xxl-1,
        .semi-col-xxl-2,
        .semi-col-xxl-3,
        .semi-col-xxl-4,
        .semi-col-xxl-5,
        .semi-col-xxl-6,
        .semi-col-xxl-7,
        .semi-col-xxl-8,
        .semi-col-xxl-9,
        .semi-col-xxl-10,
        .semi-col-xxl-11,
        .semi-col-xxl-12,
        .semi-col-xxl-13,
        .semi-col-xxl-14,
        .semi-col-xxl-15,
        .semi-col-xxl-16,
        .semi-col-xxl-17,
        .semi-col-xxl-18,
        .semi-col-xxl-19,
        .semi-col-xxl-20,
        .semi-col-xxl-21,
        .semi-col-xxl-22,
        .semi-col-xxl-23,
        .semi-col-xxl-24 {
            float: left;
            flex: none
        }

        .semi-col-xxl-1 {
            box-sizing: border-box;
            width: 4.16667%;
            display: block
        }

        .semi-col-xxl-push-1 {
            left: 4.16667%
        }

        .semi-col-xxl-pull-1 {
            right: 4.16667%
        }

        .semi-col-xxl-offset-1 {
            margin-left: 4.16667%
        }

        .semi-col-xxl-order-1 {
            order: 1
        }

        .semi-col-xxl-2 {
            box-sizing: border-box;
            width: 8.33333%;
            display: block
        }

        .semi-col-xxl-push-2 {
            left: 8.33333%
        }

        .semi-col-xxl-pull-2 {
            right: 8.33333%
        }

        .semi-col-xxl-offset-2 {
            margin-left: 8.33333%
        }

        .semi-col-xxl-order-2 {
            order: 2
        }

        .semi-col-xxl-3 {
            box-sizing: border-box;
            width: 12.5%;
            display: block
        }

        .semi-col-xxl-push-3 {
            left: 12.5%
        }

        .semi-col-xxl-pull-3 {
            right: 12.5%
        }

        .semi-col-xxl-offset-3 {
            margin-left: 12.5%
        }

        .semi-col-xxl-order-3 {
            order: 3
        }

        .semi-col-xxl-4 {
            box-sizing: border-box;
            width: 16.6667%;
            display: block
        }

        .semi-col-xxl-push-4 {
            left: 16.6667%
        }

        .semi-col-xxl-pull-4 {
            right: 16.6667%
        }

        .semi-col-xxl-offset-4 {
            margin-left: 16.6667%
        }

        .semi-col-xxl-order-4 {
            order: 4
        }

        .semi-col-xxl-5 {
            box-sizing: border-box;
            width: 20.8333%;
            display: block
        }

        .semi-col-xxl-push-5 {
            left: 20.8333%
        }

        .semi-col-xxl-pull-5 {
            right: 20.8333%
        }

        .semi-col-xxl-offset-5 {
            margin-left: 20.8333%
        }

        .semi-col-xxl-order-5 {
            order: 5
        }

        .semi-col-xxl-6 {
            box-sizing: border-box;
            width: 25%;
            display: block
        }

        .semi-col-xxl-push-6 {
            left: 25%
        }

        .semi-col-xxl-pull-6 {
            right: 25%
        }

        .semi-col-xxl-offset-6 {
            margin-left: 25%
        }

        .semi-col-xxl-order-6 {
            order: 6
        }

        .semi-col-xxl-7 {
            box-sizing: border-box;
            width: 29.1667%;
            display: block
        }

        .semi-col-xxl-push-7 {
            left: 29.1667%
        }

        .semi-col-xxl-pull-7 {
            right: 29.1667%
        }

        .semi-col-xxl-offset-7 {
            margin-left: 29.1667%
        }

        .semi-col-xxl-order-7 {
            order: 7
        }

        .semi-col-xxl-8 {
            box-sizing: border-box;
            width: 33.3333%;
            display: block
        }

        .semi-col-xxl-push-8 {
            left: 33.3333%
        }

        .semi-col-xxl-pull-8 {
            right: 33.3333%
        }

        .semi-col-xxl-offset-8 {
            margin-left: 33.3333%
        }

        .semi-col-xxl-order-8 {
            order: 8
        }

        .semi-col-xxl-9 {
            box-sizing: border-box;
            width: 37.5%;
            display: block
        }

        .semi-col-xxl-push-9 {
            left: 37.5%
        }

        .semi-col-xxl-pull-9 {
            right: 37.5%
        }

        .semi-col-xxl-offset-9 {
            margin-left: 37.5%
        }

        .semi-col-xxl-order-9 {
            order: 9
        }

        .semi-col-xxl-10 {
            box-sizing: border-box;
            width: 41.6667%;
            display: block
        }

        .semi-col-xxl-push-10 {
            left: 41.6667%
        }

        .semi-col-xxl-pull-10 {
            right: 41.6667%
        }

        .semi-col-xxl-offset-10 {
            margin-left: 41.6667%
        }

        .semi-col-xxl-order-10 {
            order: 10
        }

        .semi-col-xxl-11 {
            box-sizing: border-box;
            width: 45.8333%;
            display: block
        }

        .semi-col-xxl-push-11 {
            left: 45.8333%
        }

        .semi-col-xxl-pull-11 {
            right: 45.8333%
        }

        .semi-col-xxl-offset-11 {
            margin-left: 45.8333%
        }

        .semi-col-xxl-order-11 {
            order: 11
        }

        .semi-col-xxl-12 {
            box-sizing: border-box;
            width: 50%;
            display: block
        }

        .semi-col-xxl-push-12 {
            left: 50%
        }

        .semi-col-xxl-pull-12 {
            right: 50%
        }

        .semi-col-xxl-offset-12 {
            margin-left: 50%
        }

        .semi-col-xxl-order-12 {
            order: 12
        }

        .semi-col-xxl-13 {
            box-sizing: border-box;
            width: 54.1667%;
            display: block
        }

        .semi-col-xxl-push-13 {
            left: 54.1667%
        }

        .semi-col-xxl-pull-13 {
            right: 54.1667%
        }

        .semi-col-xxl-offset-13 {
            margin-left: 54.1667%
        }

        .semi-col-xxl-order-13 {
            order: 13
        }

        .semi-col-xxl-14 {
            box-sizing: border-box;
            width: 58.3333%;
            display: block
        }

        .semi-col-xxl-push-14 {
            left: 58.3333%
        }

        .semi-col-xxl-pull-14 {
            right: 58.3333%
        }

        .semi-col-xxl-offset-14 {
            margin-left: 58.3333%
        }

        .semi-col-xxl-order-14 {
            order: 14
        }

        .semi-col-xxl-15 {
            box-sizing: border-box;
            width: 62.5%;
            display: block
        }

        .semi-col-xxl-push-15 {
            left: 62.5%
        }

        .semi-col-xxl-pull-15 {
            right: 62.5%
        }

        .semi-col-xxl-offset-15 {
            margin-left: 62.5%
        }

        .semi-col-xxl-order-15 {
            order: 15
        }

        .semi-col-xxl-16 {
            box-sizing: border-box;
            width: 66.6667%;
            display: block
        }

        .semi-col-xxl-push-16 {
            left: 66.6667%
        }

        .semi-col-xxl-pull-16 {
            right: 66.6667%
        }

        .semi-col-xxl-offset-16 {
            margin-left: 66.6667%
        }

        .semi-col-xxl-order-16 {
            order: 16
        }

        .semi-col-xxl-17 {
            box-sizing: border-box;
            width: 70.8333%;
            display: block
        }

        .semi-col-xxl-push-17 {
            left: 70.8333%
        }

        .semi-col-xxl-pull-17 {
            right: 70.8333%
        }

        .semi-col-xxl-offset-17 {
            margin-left: 70.8333%
        }

        .semi-col-xxl-order-17 {
            order: 17
        }

        .semi-col-xxl-18 {
            box-sizing: border-box;
            width: 75%;
            display: block
        }

        .semi-col-xxl-push-18 {
            left: 75%
        }

        .semi-col-xxl-pull-18 {
            right: 75%
        }

        .semi-col-xxl-offset-18 {
            margin-left: 75%
        }

        .semi-col-xxl-order-18 {
            order: 18
        }

        .semi-col-xxl-19 {
            box-sizing: border-box;
            width: 79.1667%;
            display: block
        }

        .semi-col-xxl-push-19 {
            left: 79.1667%
        }

        .semi-col-xxl-pull-19 {
            right: 79.1667%
        }

        .semi-col-xxl-offset-19 {
            margin-left: 79.1667%
        }

        .semi-col-xxl-order-19 {
            order: 19
        }

        .semi-col-xxl-20 {
            box-sizing: border-box;
            width: 83.3333%;
            display: block
        }

        .semi-col-xxl-push-20 {
            left: 83.3333%
        }

        .semi-col-xxl-pull-20 {
            right: 83.3333%
        }

        .semi-col-xxl-offset-20 {
            margin-left: 83.3333%
        }

        .semi-col-xxl-order-20 {
            order: 20
        }

        .semi-col-xxl-21 {
            box-sizing: border-box;
            width: 87.5%;
            display: block
        }

        .semi-col-xxl-push-21 {
            left: 87.5%
        }

        .semi-col-xxl-pull-21 {
            right: 87.5%
        }

        .semi-col-xxl-offset-21 {
            margin-left: 87.5%
        }

        .semi-col-xxl-order-21 {
            order: 21
        }

        .semi-col-xxl-22 {
            box-sizing: border-box;
            width: 91.6667%;
            display: block
        }

        .semi-col-xxl-push-22 {
            left: 91.6667%
        }

        .semi-col-xxl-pull-22 {
            right: 91.6667%
        }

        .semi-col-xxl-offset-22 {
            margin-left: 91.6667%
        }

        .semi-col-xxl-order-22 {
            order: 22
        }

        .semi-col-xxl-23 {
            box-sizing: border-box;
            width: 95.8333%;
            display: block
        }

        .semi-col-xxl-push-23 {
            left: 95.8333%
        }

        .semi-col-xxl-pull-23 {
            right: 95.8333%
        }

        .semi-col-xxl-offset-23 {
            margin-left: 95.8333%
        }

        .semi-col-xxl-order-23 {
            order: 23
        }

        .semi-col-xxl-24 {
            box-sizing: border-box;
            width: 100%;
            display: block
        }

        .semi-col-xxl-push-24 {
            left: 100%
        }

        .semi-col-xxl-pull-24 {
            right: 100%
        }

        .semi-col-xxl-offset-24 {
            margin-left: 100%
        }

        .semi-col-xxl-order-24 {
            order: 24
        }

        .semi-rtl .semi-col-xxl-1,
        .semi-rtl .semi-col-xxl-2,
        .semi-rtl .semi-col-xxl-3,
        .semi-rtl .semi-col-xxl-4,
        .semi-rtl .semi-col-xxl-5,
        .semi-rtl .semi-col-xxl-6,
        .semi-rtl .semi-col-xxl-7,
        .semi-rtl .semi-col-xxl-8,
        .semi-rtl .semi-col-xxl-9,
        .semi-rtl .semi-col-xxl-10,
        .semi-rtl .semi-col-xxl-11,
        .semi-rtl .semi-col-xxl-12,
        .semi-rtl .semi-col-xxl-13,
        .semi-rtl .semi-col-xxl-14,
        .semi-rtl .semi-col-xxl-15,
        .semi-rtl .semi-col-xxl-16,
        .semi-rtl .semi-col-xxl-17,
        .semi-rtl .semi-col-xxl-18,
        .semi-rtl .semi-col-xxl-19,
        .semi-rtl .semi-col-xxl-20,
        .semi-rtl .semi-col-xxl-21,
        .semi-rtl .semi-col-xxl-22,
        .semi-rtl .semi-col-xxl-23,
        .semi-rtl .semi-col-xxl-24 {
            float: right
        }

        .semi-rtl .semi-col-xxl-offset-1 {
            margin-left: auto;
            margin-right: 4.16667%
        }

        .semi-rtl .semi-col-xxl-offset-2 {
            margin-left: auto;
            margin-right: 8.33333%
        }

        .semi-rtl .semi-col-xxl-offset-3 {
            margin-left: auto;
            margin-right: 12.5%
        }

        .semi-rtl .semi-col-xxl-offset-4 {
            margin-left: auto;
            margin-right: 16.6667%
        }

        .semi-rtl .semi-col-xxl-offset-5 {
            margin-left: auto;
            margin-right: 20.8333%
        }

        .semi-rtl .semi-col-xxl-offset-6 {
            margin-left: auto;
            margin-right: 25%
        }

        .semi-rtl .semi-col-xxl-offset-7 {
            margin-left: auto;
            margin-right: 29.1667%
        }

        .semi-rtl .semi-col-xxl-offset-8 {
            margin-left: auto;
            margin-right: 33.3333%
        }

        .semi-rtl .semi-col-xxl-offset-9 {
            margin-left: auto;
            margin-right: 37.5%
        }

        .semi-rtl .semi-col-xxl-offset-10 {
            margin-left: auto;
            margin-right: 41.6667%
        }

        .semi-rtl .semi-col-xxl-offset-11 {
            margin-left: auto;
            margin-right: 45.8333%
        }

        .semi-rtl .semi-col-xxl-offset-12 {
            margin-left: auto;
            margin-right: 50%
        }

        .semi-rtl .semi-col-xxl-offset-13 {
            margin-left: auto;
            margin-right: 54.1667%
        }

        .semi-rtl .semi-col-xxl-offset-14 {
            margin-left: auto;
            margin-right: 58.3333%
        }

        .semi-rtl .semi-col-xxl-offset-15 {
            margin-left: auto;
            margin-right: 62.5%
        }

        .semi-rtl .semi-col-xxl-offset-16 {
            margin-left: auto;
            margin-right: 66.6667%
        }

        .semi-rtl .semi-col-xxl-offset-17 {
            margin-left: auto;
            margin-right: 70.8333%
        }

        .semi-rtl .semi-col-xxl-offset-18 {
            margin-left: auto;
            margin-right: 75%
        }

        .semi-rtl .semi-col-xxl-offset-19 {
            margin-left: auto;
            margin-right: 79.1667%
        }

        .semi-rtl .semi-col-xxl-offset-20 {
            margin-left: auto;
            margin-right: 83.3333%
        }

        .semi-rtl .semi-col-xxl-offset-21 {
            margin-left: auto;
            margin-right: 87.5%
        }

        .semi-rtl .semi-col-xxl-offset-22 {
            margin-left: auto;
            margin-right: 91.6667%
        }

        .semi-rtl .semi-col-xxl-offset-23 {
            margin-left: auto;
            margin-right: 95.8333%
        }

        .semi-rtl .semi-col-xxl-offset-24 {
            margin-left: auto;
            margin-right: 100%
        }
    }

    .semi-rtl .semi-row,
    .semi-rtl .semi-row-flex,
    .semi-portal-rtl .semi-row,
    .semi-portal-rtl .semi-row-flex {
        direction: rtl
    }
}


@layer base {
    .semi-spin {
        width: 20px;
        height: 20px;
        display: inline-block;
        position: relative
    }

    @keyframes semi-animation-rotate {
        0% {
            transform: rotate(0)
        }

        to {
            transform: rotate(360deg)
        }
    }

    .semi-spin-wrapper {
        text-align: center;
        width: 100%;
        color: var(--semi-color-primary);
        position: absolute;
        top: 50%;
        transform: translateY(-50%)
    }

    .semi-spin-wrapper>svg {
        vertical-align: top;
        width: 20px;
        height: 20px;
        animation: .6s linear infinite forwards semi-animation-rotate;
        display: inline
    }

    .semi-spin-animate {
        animation: 1.6s linear infinite forwards semi-animation-rotate;
        display: inline-flex
    }

    .semi-spin-children {
        opacity: .5;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none
    }

    .semi-spin-block {
        display: block
    }

    .semi-spin-block:after {
        content: "";
        z-index: 1;
        width: 100%;
        height: 100%;
        position: absolute;
        top: 0;
        left: 0
    }

    .semi-spin-block .semi-spin-wrapper {
        display: block
    }

    .semi-spin-block.semi-spin {
        width: auto;
        height: auto
    }

    .semi-spin-hidden:after {
        content: none
    }

    .semi-spin-hidden>.semi-spin-children {
        opacity: 1;
        -webkit-user-select: auto;
        -moz-user-select: auto;
        -ms-user-select: auto;
        user-select: auto
    }

    .semi-spin-small,
    .semi-spin-small>.semi-spin-wrapper svg {
        width: 14px;
        height: 14px
    }

    .semi-spin-middle,
    .semi-spin-middle>.semi-spin-wrapper svg {
        width: 20px;
        height: 20px
    }

    .semi-spin-large,
    .semi-spin-large>.semi-spin-wrapper svg {
        width: 32px;
        height: 32px
    }

    .semi-spin-container {
        overflow: hidden
    }

    .semi-rtl .semi-spin,
    .semi-portal-rtl .semi-spin,
    .semi-rtl .semi-spin-container,
    .semi-portal-rtl .semi-spin-container {
        direction: rtl
    }
}


@layer base {
    @keyframes semi-input-active {
        0% {
            transform: scale(1)
        }

        to {
            transform: scale(.97)
        }
    }

    @keyframes semi-input-inactive {
        0% {
            transform: scale(.97)
        }

        to {
            transform: scale(1)
        }
    }

    .semi-input {
        transition: background-color var(--semi-transition_duration-none)var(--semi-transition_function-easeIn)var(--semi-transition_delay-none), border var(--semi-transition_duration-none)var(--semi-transition_function-easeIn)var(--semi-transition_delay-none);
        transform: scale(var(--semi-transform_scale-none))
    }

    .semi-input-wrapper {
        vertical-align: middle;
        box-shadow: none;
        background-color: var(--semi-color-fill-0);
        border-radius: var(--semi-border-radius-small);
        cursor: text;
        box-sizing: border-box;
        width: 100%;
        color: var(--semi-color-text-0);
        transition: background-color var(--semi-transition_duration-none)var(--semi-transition_function-easeIn)var(--semi-transition_delay-none), border var(--semi-transition_duration-none)var(--semi-transition_function-easeIn)var(--semi-transition_delay-none);
        transform: scale(var(--semi-transform_scale-none));
        border: 1px solid transparent;
        outline: none;
        font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif;
        font-size: 14px;
        line-height: 20px;
        display: inline-block;
        position: relative
    }

    .semi-input-wrapper-default {
        height: 32px;
        font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif;
        font-size: 14px;
        line-height: 30px
    }

    .semi-input-wrapper-small {
        height: 24px;
        font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif;
        font-size: 14px;
        line-height: 22px
    }

    .semi-input-wrapper-large {
        height: 40px;
        font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif;
        font-size: 16px;
        line-height: 38px
    }

    .semi-input-wrapper:hover {
        background-color: var(--semi-color-fill-1);
        border-color: transparent
    }

    .semi-input-wrapper-focus {
        background-color: var(--semi-color-fill-0);
        border: var(--semi-color-focus-border)solid 1px
    }

    .semi-input-wrapper-focus:hover {
        background-color: var(--semi-color-fill-0);
        border-color: var(--semi-color-focus-border)
    }

    .semi-input-wrapper-focus:active {
        background-color: var(--semi-color-fill-2);
        border-color: var(--semi-color-focus-border)
    }

    .semi-input-wrapper.semi-input-readonly {
        cursor: default
    }

    .semi-input-wrapper-error {
        background-color: var(--semi-color-danger-light-default);
        border-color: var(--semi-color-danger-light-default)
    }

    .semi-input-wrapper-error:hover {
        background-color: var(--semi-color-danger-light-hover);
        border-color: var(--semi-color-danger-light-hover)
    }

    .semi-input-wrapper-error.semi-input-wrapper-focus {
        background-color: var(--semi-color-danger-light-default);
        border-color: var(--semi-color-danger)
    }

    .semi-input-wrapper-error:active {
        background-color: var(--semi-color-danger-light-active);
        border-color: var(--semi-color-danger)
    }

    .semi-input-wrapper-warning {
        background-color: var(--semi-color-warning-light-default);
        border-color: var(--semi-color-warning-light-default)
    }

    .semi-input-wrapper-warning:hover {
        background-color: var(--semi-color-warning-light-hover);
        border-color: var(--semi-color-warning-light-hover)
    }

    .semi-input-wrapper-warning.semi-input-wrapper-focus {
        background-color: var(--semi-color-warning-light-default);
        border-color: var(--semi-color-warning)
    }

    .semi-input-wrapper-warning:active {
        background-color: var(--semi-color-warning-light-active);
        border-color: var(--semi-color-warning)
    }

    .semi-input-wrapper__with-prefix {
        align-items: center;
        display: inline-flex
    }

    .semi-input-wrapper__with-prefix .semi-input {
        padding-left: 0
    }

    .semi-input-wrapper__with-suffix {
        align-items: center;
        display: inline-flex
    }

    .semi-input-wrapper__with-suffix .semi-input {
        padding-right: 0
    }

    .semi-input-wrapper-clearable,
    .semi-input-wrapper-modebtn {
        align-items: center;
        display: inline-flex
    }

    .semi-input-wrapper-hidden {
        border: none
    }

    .semi-input-wrapper .semi-icon {
        color: var(--semi-color-text-2)
    }

    .semi-input-wrapper .semi-input-clearbtn,
    .semi-input-wrapper .semi-input-modebtn {
        color: var(--semi-color-primary-hover)
    }

    .semi-input-wrapper .semi-input-clearbtn>svg,
    .semi-input-wrapper .semi-input-modebtn>svg {
        pointer-events: none
    }

    .semi-input-wrapper .semi-input-clearbtn:hover,
    .semi-input-wrapper .semi-input-modebtn:hover {
        cursor: pointer
    }

    .semi-input-wrapper .semi-input-clearbtn:hover .semi-icon,
    .semi-input-wrapper .semi-input-modebtn:hover .semi-icon {
        color: var(--semi-color-primary-hover)
    }

    .semi-input-wrapper .semi-input-clearbtn:focus-visible {
        border-radius: var(--semi-border-radius-small);
        outline: 2px solid var(--semi-color-primary-light-active);
        outline-offset: -1px
    }

    .semi-input-wrapper .semi-input-modebtn:focus-visible {
        border-radius: var(--semi-border-radius-small);
        outline: 2px solid var(--semi-color-primary-light-active);
        outline-offset: -1px
    }

    .semi-input-wrapper__with-suffix-icon.semi-input-wrapper-clearable:not(.semi-input-wrapper__with-suffix-hidden) .semi-input-clearbtn {
        justify-content: flex-end;
        min-width: 24px
    }

    .semi-input-wrapper-modebtn.semi-input-wrapper-clearable .semi-input-clearbtn {
        justify-content: center;
        min-width: 16px
    }

    .semi-input-wrapper.semi-input-wrapper__with-append-only .semi-input {
        border-radius: 0 var(--semi-border-radius-small)var(--semi-border-radius-small)0
    }

    .semi-input-wrapper.semi-input-wrapper__with-append-only .semi-input:not(:last-child) {
        border-right-style: none;
        border-radius: 0
    }

    .semi-input-wrapper.semi-input-wrapper__with-prepend-only .semi-input {
        border-radius: var(--semi-border-radius-small)0 0 var(--semi-border-radius-small)
    }

    .semi-input-wrapper.semi-input-wrapper__with-prepend-only .semi-input:not(:last-child) {
        border-right-style: none
    }

    .semi-input-wrapper.semi-input-wrapper__with-prepend,
    .semi-input-wrapper.semi-input-wrapper__with-append {
        background-color: transparent;
        align-items: center;
        display: inline-flex
    }

    .semi-input-wrapper.semi-input-wrapper__with-prepend:hover,
    .semi-input-wrapper.semi-input-wrapper__with-append:hover {
        background-color: transparent
    }

    .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-focus,
    .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-focus {
        background-color: transparent;
        border: 1px solid transparent
    }

    .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input,
    .semi-input-wrapper.semi-input-wrapper__with-append .semi-input {
        background-color: var(--semi-color-fill-0);
        border: 1px solid transparent
    }

    .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input:hover,
    .semi-input-wrapper.semi-input-wrapper__with-append .semi-input:hover,
    .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input:hover+.semi-input-clearbtn,
    .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input:hover~.semi-input-modebtn,
    .semi-input-wrapper.semi-input-wrapper__with-append .semi-input:hover+.semi-input-clearbtn,
    .semi-input-wrapper.semi-input-wrapper__with-append .semi-input:hover~.semi-input-modebtn {
        background-color: var(--semi-color-fill-1)
    }

    .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input:focus,
    .semi-input-wrapper.semi-input-wrapper__with-append .semi-input:focus {
        border: 1px var(--semi-color-focus-border)solid;
        background-color: var(--semi-color-fill-0)
    }

    .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input:focus.semi-input-sibling-clearbtn,
    .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input:focus.semi-input-sibling-modebtn,
    .semi-input-wrapper.semi-input-wrapper__with-append .semi-input:focus.semi-input-sibling-clearbtn,
    .semi-input-wrapper.semi-input-wrapper__with-append .semi-input:focus.semi-input-sibling-modebtn,
    .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input:focus.semi-input-sibling-modebtn+.semi-input-clearbtn,
    .semi-input-wrapper.semi-input-wrapper__with-append .semi-input:focus.semi-input-sibling-modebtn+.semi-input-clearbtn {
        border-right-style: none
    }

    .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input:focus+.semi-input-clearbtn,
    .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input:focus~.semi-input-modebtn,
    .semi-input-wrapper.semi-input-wrapper__with-append .semi-input:focus+.semi-input-clearbtn,
    .semi-input-wrapper.semi-input-wrapper__with-append .semi-input:focus~.semi-input-modebtn {
        box-sizing: border-box;
        background-color: var(--semi-color-fill-0)
    }

    .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input:focus+.semi-input-clearbtn,
    .semi-input-wrapper.semi-input-wrapper__with-append .semi-input:focus+.semi-input-clearbtn {
        border: 1px var(--semi-color-focus-border)solid;
        border-radius: 0 var(--semi-border-radius-small)var(--semi-border-radius-small)0;
        border-left-style: none
    }

    .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input:focus+.semi-input-clearbtn:not(:last-child),
    .semi-input-wrapper.semi-input-wrapper__with-append .semi-input:focus+.semi-input-clearbtn:not(:last-child) {
        border-radius: 0
    }

    .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input:focus~.semi-input-modebtn,
    .semi-input-wrapper.semi-input-wrapper__with-append .semi-input:focus~.semi-input-modebtn {
        border: 1px var(--semi-color-focus-border)solid;
        border-radius: 0 var(--semi-border-radius-small)var(--semi-border-radius-small)0;
        border-left-style: none
    }

    .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input:focus~.semi-input-modebtn:not(:last-child),
    .semi-input-wrapper.semi-input-wrapper__with-append .semi-input:focus~.semi-input-modebtn:not(:last-child) {
        border-radius: 0
    }

    .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input:active,
    .semi-input-wrapper.semi-input-wrapper__with-append .semi-input:active,
    .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input:active+.semi-input-clearbtn,
    .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input:active~.semi-input-modebtn,
    .semi-input-wrapper.semi-input-wrapper__with-append .semi-input:active+.semi-input-clearbtn,
    .semi-input-wrapper.semi-input-wrapper__with-append .semi-input:active~.semi-input-modebtn {
        background-color: var(--semi-color-fill-2)
    }

    .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input-clearbtn,
    .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input-modebtn,
    .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input-clearbtn:hover,
    .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input-modebtn:hover,
    .semi-input-wrapper.semi-input-wrapper__with-append .semi-input-clearbtn,
    .semi-input-wrapper.semi-input-wrapper__with-append .semi-input-modebtn,
    .semi-input-wrapper.semi-input-wrapper__with-append .semi-input-clearbtn:hover,
    .semi-input-wrapper.semi-input-wrapper__with-append .semi-input-modebtn:hover {
        background-color: var(--semi-color-fill-0)
    }

    .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input-clearbtn:last-child,
    .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input-modebtn:last-child,
    .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input-clearbtn:hover:last-child,
    .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input-modebtn:hover:last-child,
    .semi-input-wrapper.semi-input-wrapper__with-append .semi-input-clearbtn:last-child,
    .semi-input-wrapper.semi-input-wrapper__with-append .semi-input-modebtn:last-child,
    .semi-input-wrapper.semi-input-wrapper__with-append .semi-input-clearbtn:hover:last-child,
    .semi-input-wrapper.semi-input-wrapper__with-append .semi-input-modebtn:hover:last-child {
        border-radius: 0 var(--semi-border-radius-small)var(--semi-border-radius-small)0
    }

    .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error,
    .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error {
        border-color: transparent
    }

    .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input,
    .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input {
        background-color: var(--semi-color-danger-light-default);
        border-color: var(--semi-color-danger-light-default)
    }

    .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input:hover,
    .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input:hover {
        background-color: var(--semi-color-danger-light-hover);
        border-color: var(--semi-color-danger-light-hover)
    }

    .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input:hover+.semi-input-clearbtn,
    .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input:hover+.semi-input-modebtn,
    .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input:hover+.semi-input-clearbtn,
    .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input:hover+.semi-input-modebtn {
        background-color: var(--semi-color-danger-light-hover)
    }

    .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input:focus,
    .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input:focus,
    .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input:focus+.semi-input-clearbtn,
    .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input:focus+.semi-input-modebtn,
    .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input:focus+.semi-input-clearbtn,
    .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input:focus+.semi-input-modebtn {
        background-color: var(--semi-color-danger-light-default);
        border-color: var(--semi-color-danger)
    }

    .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input:active,
    .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input:active {
        background-color: var(--semi-color-danger-light-active)
    }

    .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input:active+.semi-input-clearbtn,
    .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input:active+.semi-input-modebtn,
    .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input:active+.semi-input-clearbtn,
    .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input:active+.semi-input-modebtn {
        background-color: var(--semi-color-danger-light-active);
        border-color: var(--semi-color-danger)
    }

    .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input-clearbtn,
    .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input-modebtn,
    .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input-clearbtn:hover,
    .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input-modebtn:hover,
    .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input-clearbtn,
    .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input-modebtn,
    .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input-clearbtn:hover,
    .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input-modebtn:hover {
        background-color: var(--semi-color-danger-light-default)
    }

    .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input-clearbtn:last-child,
    .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input-modebtn:last-child,
    .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input-clearbtn:hover:last-child,
    .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input-modebtn:hover:last-child,
    .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input-clearbtn:last-child,
    .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input-modebtn:last-child,
    .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input-clearbtn:hover:last-child,
    .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input-modebtn:hover:last-child {
        border-radius: 0 var(--semi-border-radius-small)var(--semi-border-radius-small)0
    }

    .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning,
    .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning {
        border-color: transparent
    }

    .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input,
    .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input {
        background-color: var(--semi-color-warning-light-default);
        border-color: var(--semi-color-warning-light-default)
    }

    .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input:hover,
    .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input:hover {
        background-color: var(--semi-color-warning-light-hover);
        border-color: var(--semi-color-warning-light-hover)
    }

    .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input:hover+.semi-input-clearbtn,
    .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input:hover+.semi-input-modebtn,
    .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input:hover+.semi-input-clearbtn,
    .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input:hover+.semi-input-modebtn {
        background-color: var(--semi-color-warning-light-hover)
    }

    .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input:focus,
    .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input:focus,
    .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input:focus+.semi-input-clearbtn,
    .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input:focus+.semi-input-modebtn,
    .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input:focus+.semi-input-clearbtn,
    .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input:focus+.semi-input-modebtn {
        background-color: var(--semi-color-warning-light-default);
        border-color: var(--semi-color-warning)
    }

    .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input:active,
    .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input:active {
        background-color: var(--semi-color-warning-light-active)
    }

    .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input:active+.semi-input-clearbtn,
    .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input:active+.semi-input-modebtn,
    .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input:active+.semi-input-clearbtn,
    .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input:active+.semi-input-modebtn {
        background-color: var(--semi-color-warning-light-active);
        border-color: var(--semi-color-warning)
    }

    .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input-clearbtn,
    .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input-modebtn,
    .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input-clearbtn:hover,
    .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input-modebtn:hover,
    .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input-clearbtn,
    .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input-modebtn,
    .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input-clearbtn:hover,
    .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input-modebtn:hover {
        background-color: var(--semi-color-warning-light-default)
    }

    .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input-clearbtn:last-child,
    .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input-modebtn:last-child,
    .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input-clearbtn:hover:last-child,
    .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input-modebtn:hover:last-child,
    .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input-clearbtn:last-child,
    .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input-modebtn:last-child,
    .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input-clearbtn:hover:last-child,
    .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input-modebtn:hover:last-child {
        border-radius: 0 var(--semi-border-radius-small)var(--semi-border-radius-small)0
    }

    .semi-input-wrapper-disabled {
        cursor: not-allowed;
        color: var(--semi-color-disabled-text);
        background-color: var(--semi-color-disabled-fill);
        -webkit-text-fill-color: var(--semi-color-disabled-text)
    }

    .semi-input-wrapper-disabled:hover {
        background-color: var(--semi-color-disabled-fill)
    }

    .semi-input-wrapper-disabled .semi-input-append,
    .semi-input-wrapper-disabled .semi-input-prepend,
    .semi-input-wrapper-disabled .semi-input-suffix,
    .semi-input-wrapper-disabled .semi-input-prefix,
    .semi-input-wrapper-disabled .semi-icon {
        color: var(--semi-color-disabled-text)
    }

    .semi-input {
        width: 100%;
        color: inherit;
        box-sizing: border-box;
        background-color: transparent;
        border: none;
        outline: none;
        padding-left: 12px;
        padding-right: 12px
    }

    .semi-input[type=password]::-ms-reveal {
        display: none
    }

    .semi-input[type=password]::-ms-clear {
        display: none
    }

    .semi-input[type=search]::-webkit-search-cancel-button {
        display: none
    }

    .semi-input::placeholder {
        color: var(--semi-color-text-2)
    }

    .semi-input::placeholder {
        color: var(--semi-color-text-2)
    }

    .semi-input::placeholder {
        color: var(--semi-color-text-2)
    }

    .semi-input-large {
        height: 38px;
        font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif;
        font-size: 16px;
        line-height: 38px
    }

    .semi-input-small {
        height: 22px;
        font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif;
        font-size: 14px;
        line-height: 22px
    }

    .semi-input-default {
        height: 30px;
        font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif;
        font-size: 14px;
        line-height: 30px
    }

    .semi-input-disabled {
        cursor: not-allowed;
        color: inherit
    }

    .semi-input-inset-label {
        color: var(--semi-color-text-2);
        white-space: nowrap;
        flex-shrink: 0;
        margin-right: 12px;
        font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif;
        font-size: 14px;
        font-weight: 600;
        line-height: 20px
    }

    .semi-input-prefix,
    .semi-input-suffix {
        justify-content: center;
        align-items: center;
        display: flex
    }

    .semi-input-prefix-text,
    .semi-input-suffix-text {
        color: var(--semi-color-text-2);
        white-space: nowrap;
        margin: 0 12px;
        font-weight: 600
    }

    .semi-input-prefix-icon,
    .semi-input-suffix-icon {
        color: var(--semi-color-text-2);
        margin: 0 8px
    }

    .semi-input-suffix {
        justify-content: center;
        align-items: center;
        display: flex
    }

    .semi-input-clearbtn,
    .semi-input-modebtn {
        justify-content: center;
        align-items: center;
        min-width: 32px;
        height: 100%;
        display: flex
    }

    .semi-input-clearbtn+.semi-input-suffix+.semi-input-suffix-text,
    .semi-input-clearbtn+.semi-input-suffix+.semi-input-suffix-icon {
        margin-left: 0
    }

    .semi-input-suffix-hidden {
        display: none
    }

    .semi-input-prepend,
    .semi-input-append {
        background-color: var(--semi-color-fill-0);
        height: 100%;
        color: var(--semi-color-text-2);
        flex-shrink: 0;
        align-items: center;
        font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif;
        font-size: 14px;
        line-height: 20px;
        display: flex
    }

    .semi-input-prepend-icon,
    .semi-input-prepend-text,
    .semi-input-append-icon,
    .semi-input-append-text {
        padding: 0 12px
    }

    .semi-input-append {
        border-radius: 0 var(--semi-border-radius-small)var(--semi-border-radius-small)0;
        border-left: 1px solid transparent
    }

    .semi-input-prepend {
        border-radius: var(--semi-border-radius-small)0 0 var(--semi-border-radius-small);
        border-right: 1px solid transparent
    }

    .semi-input-disabled::placeholder {
        color: var(--semi-color-disabled-text)
    }

    .semi-input-disabled::placeholder {
        color: var(--semi-color-disabled-text)
    }

    .semi-input-disabled::placeholder {
        color: var(--semi-color-disabled-text)
    }

    .semi-input-group {
        flex-wrap: wrap;
        align-content: center;
        align-items: center;
        display: inline-flex
    }

    .semi-input-group .semi-select,
    .semi-input-group .semi-tagInput,
    .semi-input-group .semi-cascader,
    .semi-input-group .semi-tree-select,
    .semi-input-group>.semi-input-wrapper {
        border-radius: 0
    }

    .semi-input-group .semi-select:first-child,
    .semi-input-group .semi-tagInput:first-child,
    .semi-input-group .semi-cascader:first-child,
    .semi-input-group .semi-tree-select:first-child,
    .semi-input-group>.semi-input-wrapper:first-child {
        border-radius: var(--semi-border-radius-small)0 0 var(--semi-border-radius-small)
    }

    .semi-input-group .semi-select:last-child,
    .semi-input-group .semi-tagInput:last-child,
    .semi-input-group .semi-cascader:last-child,
    .semi-input-group .semi-tree-select:last-child,
    .semi-input-group>.semi-input-wrapper:last-child {
        border-radius: 0 var(--semi-border-radius-small)var(--semi-border-radius-small)0
    }

    .semi-input-group .semi-select:not(:last-child),
    .semi-input-group .semi-tagInput:not(:last-child),
    .semi-input-group .semi-cascader:not(:last-child),
    .semi-input-group .semi-tree-select:not(:last-child),
    .semi-input-group>.semi-input-wrapper:not(:last-child) {
        position: relative
    }

    .semi-input-group .semi-select:not(:last-child):after,
    .semi-input-group .semi-tagInput:not(:last-child):after,
    .semi-input-group .semi-cascader:not(:last-child):after,
    .semi-input-group .semi-tree-select:not(:last-child):after,
    .semi-input-group>.semi-input-wrapper:not(:last-child):after {
        content: "";
        background-color: var(--semi-color-border);
        width: 1px;
        position: absolute;
        top: 1px;
        bottom: 1px;
        right: -1px
    }

    .semi-input-group .semi-select {
        overflow-y: visible
    }

    .semi-input-group .semi-input-number .semi-input-wrapper,
    .semi-input-group .semi-input-number .semi-datepicker-range-input,
    .semi-input-group .semi-datepicker .semi-input-wrapper,
    .semi-input-group .semi-datepicker .semi-datepicker-range-input,
    .semi-input-group .semi-timepicker .semi-input-wrapper,
    .semi-input-group .semi-timepicker .semi-datepicker-range-input,
    .semi-input-group .semi-autocomplete .semi-input-wrapper,
    .semi-input-group .semi-autocomplete .semi-datepicker-range-input {
        border-radius: 0
    }

    .semi-input-group .semi-input-number:first-child .semi-input-wrapper,
    .semi-input-group .semi-input-number:first-child .semi-datepicker-range-input,
    .semi-input-group .semi-datepicker:first-child .semi-input-wrapper,
    .semi-input-group .semi-datepicker:first-child .semi-datepicker-range-input,
    .semi-input-group .semi-timepicker:first-child .semi-input-wrapper,
    .semi-input-group .semi-timepicker:first-child .semi-datepicker-range-input,
    .semi-input-group .semi-autocomplete:first-child .semi-input-wrapper,
    .semi-input-group .semi-autocomplete:first-child .semi-datepicker-range-input {
        border-radius: var(--semi-border-radius-small)0 0 var(--semi-border-radius-small)
    }

    .semi-input-group .semi-input-number:last-child .semi-input-wrapper,
    .semi-input-group .semi-input-number:last-child .semi-datepicker-range-input,
    .semi-input-group .semi-datepicker:last-child .semi-input-wrapper,
    .semi-input-group .semi-datepicker:last-child .semi-datepicker-range-input,
    .semi-input-group .semi-timepicker:last-child .semi-input-wrapper,
    .semi-input-group .semi-timepicker:last-child .semi-datepicker-range-input,
    .semi-input-group .semi-autocomplete:last-child .semi-input-wrapper,
    .semi-input-group .semi-autocomplete:last-child .semi-datepicker-range-input {
        border-radius: 0 var(--semi-border-radius-small)var(--semi-border-radius-small)0
    }

    .semi-input-group .semi-input-number:not(:last-child),
    .semi-input-group .semi-datepicker:not(:last-child),
    .semi-input-group .semi-timepicker:not(:last-child),
    .semi-input-group .semi-autocomplete:not(:last-child) {
        position: relative
    }

    .semi-input-group .semi-input-number:not(:last-child):after,
    .semi-input-group .semi-datepicker:not(:last-child):after,
    .semi-input-group .semi-timepicker:not(:last-child):after,
    .semi-input-group .semi-autocomplete:not(:last-child):after {
        content: "";
        background-color: var(--semi-color-border);
        width: 1px;
        position: absolute;
        top: 1px;
        bottom: 1px;
        right: -1px
    }

    .semi-input-group-wrapper-with-top-label {
        margin-top: 16px;
        margin-bottom: 16px
    }

    .semi-input-group-wrapper-with-top-label .semi-input-group {
        display: flex
    }

    .semi-input-group-wrapper-with-top-label .semi-input-group .semi-form-field {
        margin-top: 0;
        margin-bottom: 0
    }

    .semi-input-only_border,
    .semi-input-only_border:hover {
        border-color: var(--semi-color-border);
        background: 0 0
    }

    .semi-input-only_border:focus-within {
        background: 0 0
    }

    .semi-input-borderless:not(:focus-within):not(:hover) {
        background-color: transparent;
        border-color: transparent
    }

    .semi-input-borderless:focus-within:not(:active) {
        background-color: transparent
    }

    .semi-input-borderless.semi-input-wrapper-error:not(:focus-within) {
        border-color: var(--semi-color-danger)
    }

    .semi-input-borderless.semi-input-wrapper-warning:not(:focus-within) {
        border-color: var(--semi-color-warning)
    }

    .semi-rtl .semi-input-wrapper,
    .semi-portal-rtl .semi-input-wrapper {
        direction: rtl
    }

    .semi-rtl .semi-input-wrapper__with-prefix .semi-input,
    .semi-portal-rtl .semi-input-wrapper__with-prefix .semi-input {
        padding-left: auto;
        padding-right: 0
    }

    .semi-rtl .semi-input-wrapper__with-suffix .semi-input,
    .semi-portal-rtl .semi-input-wrapper__with-suffix .semi-input {
        padding-left: 0;
        padding-right: auto
    }

    .semi-rtl .semi-input,
    .semi-portal-rtl .semi-input {
        padding-left: 12px;
        padding-right: 12px
    }

    .semi-rtl .semi-input-inset-label,
    .semi-portal-rtl .semi-input-inset-label {
        margin-left: 12px;
        margin-right: auto
    }

    .semi-rtl .semi-input-clearbtn+.semi-rtl .semi-input-suffix+.semi-input-suffix-text,
    .semi-rtl .semi-input-clearbtn+.semi-portal-rtl .semi-input-suffix+.semi-input-suffix-text,
    .semi-portal-rtl .semi-input-clearbtn+.semi-rtl .semi-input-suffix+.semi-input-suffix-text,
    .semi-portal-rtl .semi-input-clearbtn+.semi-portal-rtl .semi-input-suffix+.semi-input-suffix-text,
    .semi-rtl .semi-input-clearbtn+.semi-rtl .semi-input-suffix+.semi-input-suffix-icon,
    .semi-rtl .semi-input-clearbtn+.semi-portal-rtl .semi-input-suffix+.semi-input-suffix-icon,
    .semi-portal-rtl .semi-input-clearbtn+.semi-rtl .semi-input-suffix+.semi-input-suffix-icon,
    .semi-portal-rtl .semi-input-clearbtn+.semi-portal-rtl .semi-input-suffix+.semi-input-suffix-icon {
        margin-left: auto;
        margin-right: 0
    }

    .semi-rtl .semi-input-append,
    .semi-portal-rtl .semi-input-append {
        border-left: 0;
        border-right: 1px solid transparent
    }

    .semi-rtl .semi-input-prepend,
    .semi-portal-rtl .semi-input-prepend {
        border-left: 1px solid transparent;
        border-right: 0
    }

    .semi-rtl .semi-input-group .semi-select:not(:last-child):after,
    .semi-rtl .semi-input-group .semi-cascader:not(:last-child):after,
    .semi-rtl .semi-input-group .semi-tree-select:not(:last-child):after,
    .semi-rtl .semi-input-group>.semi-input-wrapper:not(:last-child):after,
    .semi-portal-rtl .semi-input-group .semi-select:not(:last-child):after,
    .semi-portal-rtl .semi-input-group .semi-cascader:not(:last-child):after,
    .semi-portal-rtl .semi-input-group .semi-tree-select:not(:last-child):after,
    .semi-portal-rtl .semi-input-group>.semi-input-wrapper:not(:last-child):after,
    .semi-rtl .semi-input-group .semi-input-number:not(:last-child):after,
    .semi-portal-rtl .semi-input-group .semi-input-number:not(:last-child):after {
        left: -1px;
        right: auto
    }

    .semi-rtl .semi-input-textarea-wrapper,
    .semi-portal-rtl .semi-input-textarea-wrapper {
        direction: rtl
    }

    .semi-rtl .semi-input-textarea-counter,
    .semi-portal-rtl .semi-input-textarea-counter {
        text-align: left
    }

    .semi-rtl .semi-input-textarea-showClear,
    .semi-portal-rtl .semi-input-textarea-showClear {
        padding-left: 36px;
        padding-right: 0
    }
}


@layer base {
    .semi-avatar {
        white-space: nowrap;
        text-align: center;
        vertical-align: middle;
        justify-content: center;
        align-items: center;
        display: inline-flex;
        position: relative;
        overflow: hidden
    }

    .semi-avatar:focus-visible {
        outline: 2px solid var(--semi-color-primary-light-active)
    }

    .semi-avatar-focus {
        outline: 2px solid var(--semi-color-primary-light-active)
    }

    .semi-avatar-no-focus-visible:focus-visible {
        outline: none
    }

    .semi-avatar .semi-avatar-label {
        align-items: center;
        font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif;
        font-size: 14px;
        font-weight: 600;
        line-height: 20px;
        display: flex
    }

    .semi-avatar-content {
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none
    }

    .semi-avatar-extra-extra-small {
        border-radius: 3px;
        width: 20px;
        height: 20px
    }

    .semi-avatar-extra-extra-small .semi-avatar-content {
        transform-origin: 50%;
        transform: scale(.8)
    }

    .semi-avatar-extra-extra-small .semi-avatar-label {
        font-size: 10px;
        line-height: 15px
    }

    .semi-avatar-extra-small {
        border-radius: 3px;
        width: 24px;
        height: 24px
    }

    .semi-avatar-extra-small .semi-avatar-content {
        transform-origin: 50%;
        transform: scale(.8)
    }

    .semi-avatar-extra-small .semi-avatar-label {
        font-size: 10px;
        line-height: 15px
    }

    .semi-avatar-small {
        border-radius: 3px;
        width: 32px;
        height: 32px
    }

    .semi-avatar-small .semi-avatar-label {
        font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif;
        font-size: 12px;
        line-height: 16px
    }

    .semi-avatar-default {
        border-radius: 3px;
        width: 40px;
        height: 40px
    }

    .semi-avatar-default .semi-avatar-label {
        font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif;
        font-size: 18px;
        line-height: 24px
    }

    .semi-avatar-medium {
        border-radius: 3px;
        width: 48px;
        height: 48px
    }

    .semi-avatar-medium .semi-avatar-label {
        font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif;
        font-size: 20px;
        line-height: 28px
    }

    .semi-avatar-large {
        border-radius: 6px;
        width: 72px;
        height: 72px
    }

    .semi-avatar-large .semi-avatar-label {
        font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif;
        font-size: 32px;
        line-height: 44px
    }

    .semi-avatar-extra-large {
        border-radius: 12px;
        width: 128px;
        height: 128px
    }

    .semi-avatar-extra-large .semi-avatar-label {
        font-size: 64px;
        line-height: 77px
    }

    .semi-avatar-circle {
        border-radius: var(--semi-border-radius-circle)
    }

    .semi-avatar-image {
        background-color: transparent
    }

    .semi-avatar>img {
        -o-object-fit: cover;
        object-fit: cover;
        width: 100%;
        height: 100%;
        display: block
    }

    .semi-avatar-hover {
        width: 100%;
        height: 100%;
        position: absolute;
        top: 0;
        left: 0
    }

    .semi-avatar:hover {
        cursor: pointer
    }

    .semi-avatar-wrapper {
        width: -moz-fit-content;
        flex-direction: column;
        align-items: center;
        width: fit-content;
        display: inline-flex;
        position: relative
    }

    .semi-avatar-wrapper .semi-avatar-top_slot-bg {
        border-radius: 50%;
        justify-content: center;
        display: flex;
        position: absolute;
        overflow: hidden
    }

    .semi-avatar-wrapper .semi-avatar-top_slot-bg-small {
        width: 32px;
        height: 32px
    }

    .semi-avatar-wrapper .semi-avatar-top_slot-bg-default {
        width: 40px;
        height: 40px
    }

    .semi-avatar-wrapper .semi-avatar-top_slot-bg-medium {
        width: 48px;
        height: 48px
    }

    .semi-avatar-wrapper .semi-avatar-top_slot-bg-large {
        width: 72px;
        height: 72px
    }

    .semi-avatar-wrapper .semi-avatar-top_slot-bg-extra-large {
        width: 128px;
        height: 128px
    }

    .semi-avatar-wrapper .semi-avatar-top_slot-bg-svg {
        position: absolute
    }

    .semi-avatar-wrapper .semi-avatar-top_slot-bg-svg-small {
        top: -28px;
        scale: .4
    }

    .semi-avatar-wrapper .semi-avatar-top_slot-bg-svg-default {
        top: -32px;
        scale: .7
    }

    .semi-avatar-wrapper .semi-avatar-top_slot-bg-svg-medium {
        top: -30px;
        scale: .8
    }

    .semi-avatar-wrapper .semi-avatar-top_slot-bg-svg-large {
        top: -30px;
        scale: 1.1
    }

    .semi-avatar-wrapper .semi-avatar-top_slot-bg-svg-extra-large {
        top: -32px;
        scale: 1.4
    }

    .semi-avatar-wrapper .semi-avatar-top_slot-wrapper {
        justify-content: center;
        display: flex;
        position: absolute
    }

    .semi-avatar-wrapper .semi-avatar-top_slot-wrapper .semi-avatar-top_slot {
        color: var(--semi-color-bg-0);
        font-weight: 600
    }

    .semi-avatar-wrapper .semi-avatar-top_slot-wrapper .semi-avatar-top_slot-content {
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        line-height: normal;
        position: relative
    }

    .semi-avatar-wrapper .semi-avatar-top_slot-wrapper .semi-avatar-top_slot-content-small {
        margin-top: 0;
        font-size: 5px
    }

    .semi-avatar-wrapper .semi-avatar-top_slot-wrapper .semi-avatar-top_slot-content-default {
        margin-top: -2px;
        font-size: 6px
    }

    .semi-avatar-wrapper .semi-avatar-top_slot-wrapper .semi-avatar-top_slot-content-medium {
        margin-top: 0;
        font-size: 8px
    }

    .semi-avatar-wrapper .semi-avatar-top_slot-wrapper .semi-avatar-top_slot-content-large {
        margin-top: 0;
        font-size: 14px
    }

    .semi-avatar-wrapper .semi-avatar-top_slot-wrapper .semi-avatar-top_slot-content-extra-large {
        margin-top: 0;
        font-size: 16px
    }

    .semi-avatar-wrapper .semi-avatar-bottom_slot {
        color: var(--semi-color-bg-0);
        cursor: pointer;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        position: absolute;
        bottom: 3.5px;
        transform: translateY(50%)
    }

    .semi-avatar-wrapper .semi-avatar-bottom_slot-shape_circle {
        background: var(--semi-color-primary);
        border-radius: var(--semi-border-radius-circle);
        justify-content: center;
        align-items: center;
        line-height: normal;
        display: flex
    }

    .semi-avatar-wrapper .semi-avatar-bottom_slot-shape_circle-extra-small,
    .semi-avatar-wrapper .semi-avatar-bottom_slot-shape_circle-small {
        width: 12px;
        height: 12px;
        font-size: 5px
    }

    .semi-avatar-wrapper .semi-avatar-bottom_slot-shape_circle-default {
        width: 16px;
        height: 16px;
        font-size: 12px
    }

    .semi-avatar-wrapper .semi-avatar-bottom_slot-shape_circle-medium {
        width: 18px;
        height: 18px;
        font-size: 12px
    }

    .semi-avatar-wrapper .semi-avatar-bottom_slot-shape_circle-large {
        width: 28px;
        height: 28px;
        font-size: 12px
    }

    .semi-avatar-wrapper .semi-avatar-bottom_slot-shape_circle-extra-large {
        width: 28px;
        height: 28px;
        font-size: 14px
    }

    .semi-avatar-wrapper .semi-avatar-bottom_slot-shape_square {
        background: var(--semi-color-primary);
        border-style: solid;
        border-color: var(--semi-color-bg-0);
        border-radius: 4px;
        justify-content: center;
        align-items: center;
        padding: 1px 4px;
        font-weight: 600;
        display: flex
    }

    .semi-avatar-wrapper .semi-avatar-bottom_slot-shape_square-extra_small,
    .semi-avatar-wrapper .semi-avatar-bottom_slot-shape_square-small {
        border-width: 2px;
        font-size: 5px
    }

    .semi-avatar-wrapper .semi-avatar-bottom_slot-shape_square-default,
    .semi-avatar-wrapper .semi-avatar-bottom_slot-shape_square-medium,
    .semi-avatar-wrapper .semi-avatar-bottom_slot-shape_square-large {
        border-width: 2px;
        font-size: 12px
    }

    .semi-avatar-wrapper .semi-avatar-bottom_slot-shape_square-extra-large {
        border-width: 2px;
        font-size: 14px
    }

    .semi-avatar-group {
        display: inline-block
    }

    .semi-avatar-group .semi-avatar {
        box-sizing: border-box
    }

    .semi-avatar-group .semi-avatar:first-child {
        margin-left: 0
    }

    .semi-avatar-group .semi-avatar-extra-large {
        border: 3px var(--semi-color-bg-1)solid;
        margin-left: -32px
    }

    .semi-avatar-group .semi-avatar-large {
        border: 3px var(--semi-color-bg-1)solid;
        margin-left: -18px
    }

    .semi-avatar-group .semi-avatar-medium,
    .semi-avatar-group .semi-avatar-default,
    .semi-avatar-group .semi-avatar-small {
        border: 2px var(--semi-color-bg-1)solid;
        margin-left: -12px
    }

    .semi-avatar-group .semi-avatar-extra-small {
        border: 1px var(--semi-color-bg-1)solid;
        margin-left: -10px
    }

    .semi-avatar-group .semi-avatar-extra-extra-small {
        border: 1px var(--semi-color-bg-1)solid;
        margin-left: -4px
    }

    .semi-avatar-group .semi-avatar-item-start-0 {
        z-index: 100
    }

    .semi-avatar-group .semi-avatar-item-end-0 {
        z-index: 80
    }

    .semi-avatar-group .semi-avatar-item-start-1 {
        z-index: 99
    }

    .semi-avatar-group .semi-avatar-item-end-1 {
        z-index: 81
    }

    .semi-avatar-group .semi-avatar-item-start-2 {
        z-index: 98
    }

    .semi-avatar-group .semi-avatar-item-end-2 {
        z-index: 82
    }

    .semi-avatar-group .semi-avatar-item-start-3 {
        z-index: 97
    }

    .semi-avatar-group .semi-avatar-item-end-3 {
        z-index: 83
    }

    .semi-avatar-group .semi-avatar-item-start-4 {
        z-index: 96
    }

    .semi-avatar-group .semi-avatar-item-end-4 {
        z-index: 84
    }

    .semi-avatar-group .semi-avatar-item-start-5 {
        z-index: 95
    }

    .semi-avatar-group .semi-avatar-item-end-5 {
        z-index: 85
    }

    .semi-avatar-group .semi-avatar-item-start-6 {
        z-index: 94
    }

    .semi-avatar-group .semi-avatar-item-end-6 {
        z-index: 86
    }

    .semi-avatar-group .semi-avatar-item-start-7 {
        z-index: 93
    }

    .semi-avatar-group .semi-avatar-item-end-7 {
        z-index: 87
    }

    .semi-avatar-group .semi-avatar-item-start-8 {
        z-index: 92
    }

    .semi-avatar-group .semi-avatar-item-end-8 {
        z-index: 88
    }

    .semi-avatar-group .semi-avatar-item-start-9 {
        z-index: 91
    }

    .semi-avatar-group .semi-avatar-item-end-9 {
        z-index: 89
    }

    .semi-avatar-group .semi-avatar-item-start-10,
    .semi-avatar-group .semi-avatar-item-end-10 {
        z-index: 90
    }

    .semi-avatar-group .semi-avatar-item-start-11 {
        z-index: 89
    }

    .semi-avatar-group .semi-avatar-item-end-11 {
        z-index: 91
    }

    .semi-avatar-group .semi-avatar-item-start-12 {
        z-index: 88
    }

    .semi-avatar-group .semi-avatar-item-end-12 {
        z-index: 92
    }

    .semi-avatar-group .semi-avatar-item-start-13 {
        z-index: 87
    }

    .semi-avatar-group .semi-avatar-item-end-13 {
        z-index: 93
    }

    .semi-avatar-group .semi-avatar-item-start-14 {
        z-index: 86
    }

    .semi-avatar-group .semi-avatar-item-end-14 {
        z-index: 94
    }

    .semi-avatar-group .semi-avatar-item-start-15 {
        z-index: 85
    }

    .semi-avatar-group .semi-avatar-item-end-15 {
        z-index: 95
    }

    .semi-avatar-group .semi-avatar-item-start-16 {
        z-index: 84
    }

    .semi-avatar-group .semi-avatar-item-end-16 {
        z-index: 96
    }

    .semi-avatar-group .semi-avatar-item-start-17 {
        z-index: 83
    }

    .semi-avatar-group .semi-avatar-item-end-17 {
        z-index: 97
    }

    .semi-avatar-group .semi-avatar-item-start-18 {
        z-index: 82
    }

    .semi-avatar-group .semi-avatar-item-end-18 {
        z-index: 98
    }

    .semi-avatar-group .semi-avatar-item-start-19 {
        z-index: 81
    }

    .semi-avatar-group .semi-avatar-item-end-19 {
        z-index: 99
    }

    .semi-avatar-group .semi-avatar-item-start-20 {
        z-index: 80
    }

    .semi-avatar-group .semi-avatar-item-end-20 {
        z-index: 100
    }

    .semi-avatar-group .semi-avatar-item-more {
        background-color: rgba(var(--semi-grey-5), 1)
    }

    .semi-avatar-amber {
        background-color: rgba(var(--semi-amber-3), 1);
        color: rgba(var(--semi-white), 1)
    }

    .semi-avatar-blue {
        background-color: rgba(var(--semi-blue-3), 1);
        color: rgba(var(--semi-white), 1)
    }

    .semi-avatar-cyan {
        background-color: rgba(var(--semi-cyan-3), 1);
        color: rgba(var(--semi-white), 1)
    }

    .semi-avatar-green {
        background-color: rgba(var(--semi-green-3), 1);
        color: rgba(var(--semi-white), 1)
    }

    .semi-avatar-grey {
        background-color: rgba(var(--semi-grey-3), 1);
        color: rgba(var(--semi-white), 1)
    }

    .semi-avatar-indigo {
        background-color: rgba(var(--semi-indigo-3), 1);
        color: rgba(var(--semi-white), 1)
    }

    .semi-avatar-light-blue {
        background-color: rgba(var(--semi-light-blue-3), 1);
        color: rgba(var(--semi-white), 1)
    }

    .semi-avatar-light-green {
        background-color: rgba(var(--semi-light-green-3), 1);
        color: rgba(var(--semi-white), 1)
    }

    .semi-avatar-lime {
        background-color: rgba(var(--semi-lime-3), 1);
        color: rgba(var(--semi-white), 1)
    }

    .semi-avatar-orange {
        background-color: rgba(var(--semi-orange-3), 1);
        color: rgba(var(--semi-white), 1)
    }

    .semi-avatar-pink {
        background-color: rgba(var(--semi-pink-3), 1);
        color: rgba(var(--semi-white), 1)
    }

    .semi-avatar-purple {
        background-color: rgba(var(--semi-purple-3), 1);
        color: rgba(var(--semi-white), 1)
    }

    .semi-avatar-red {
        background-color: rgba(var(--semi-red-3), 1);
        color: rgba(var(--semi-white), 1)
    }

    .semi-avatar-teal {
        background-color: rgba(var(--semi-teal-3), 1);
        color: rgba(var(--semi-white), 1)
    }

    .semi-avatar-violet {
        background-color: rgba(var(--semi-violet-3), 1);
        color: rgba(var(--semi-white), 1)
    }

    .semi-avatar-yellow {
        background-color: rgba(var(--semi-yellow-3), 1);
        color: rgba(var(--semi-white), 1)
    }

    .semi-avatar-additionalBorder {
        border-style: solid;
        border-color: var(--semi-color-primary);
        box-sizing: border-box;
        border-width: 1.5px;
        display: inline-block;
        position: absolute;
        top: -3.5px;
        left: -3.5px
    }

    .semi-avatar-additionalBorder-extra-extra-small {
        width: 27px;
        height: 27px
    }

    .semi-avatar-additionalBorder-extra-small {
        width: 31px;
        height: 31px
    }

    .semi-avatar-additionalBorder-small {
        width: 39px;
        height: 39px
    }

    .semi-avatar-additionalBorder-default {
        width: 47px;
        height: 47px
    }

    .semi-avatar-additionalBorder-medium {
        width: 55px;
        height: 55px
    }

    .semi-avatar-additionalBorder-large {
        width: 79px;
        height: 79px
    }

    .semi-avatar-additionalBorder-extra-large {
        width: 135px;
        height: 135px
    }

    .semi-avatar-square.semi-avatar-additionalBorder-extra_extra_small,
    .semi-avatar-square.semi-avatar-additionalBorder-extra_small,
    .semi-avatar-square.semi-avatar-additionalBorder-small,
    .semi-avatar-square.semi-avatar-additionalBorder-default,
    .semi-avatar-square.semi-avatar-additionalBorder-medium {
        border-radius: 3px
    }

    .semi-avatar-square.semi-avatar-additionalBorder-large {
        border-radius: 6px
    }

    .semi-avatar-additionalBorder-circle {
        border-radius: var(--semi-border-radius-circle)
    }

    .semi-avatar-additionalBorder-animated {
        animation: .8s linear infinite semi-avatar-additionalBorder
    }

    .semi-avatar-animated {
        animation: 1s linear infinite semi-avatar-content
    }

    @keyframes semi-avatar-additionalBorder {
        0% {
            opacity: 1;
            transform: scale(1)
        }

        to {
            opacity: 0;
            border-width: 0;
            transform: scale(1.15)
        }
    }

    @keyframes semi-avatar-content {
        0% {
            transform: scale(1)
        }

        50% {
            transform: scale(.9)
        }

        to {
            transform: scale(1)
        }
    }

    .semi-rtl .semi-avatar,
    .semi-portal-rtl .semi-avatar {
        direction: rtl
    }

    .semi-rtl .semi-avatar-extra-extra-small .semi-avatar-content,
    .semi-portal-rtl .semi-avatar-extra-extra-small .semi-avatar-content,
    .semi-rtl .semi-avatar-extra-small .semi-avatar-content,
    .semi-portal-rtl .semi-avatar-extra-small .semi-avatar-content {
        transform: scale(.8)
    }

    .semi-rtl .semi-avatar-hover,
    .semi-portal-rtl .semi-avatar-hover {
        left: auto;
        right: 0
    }

    .semi-rtl .semi-avatar-group,
    .semi-portal-rtl .semi-avatar-group {
        direction: rtl
    }

    .semi-rtl .semi-avatar-group .semi-avatar:first-child,
    .semi-portal-rtl .semi-avatar-group .semi-avatar:first-child {
        margin-left: auto;
        margin-right: 0
    }

    .semi-rtl .semi-avatar-group .semi-avatar-extra-large,
    .semi-portal-rtl .semi-avatar-group .semi-avatar-extra-large {
        margin-left: auto;
        margin-right: -32px
    }

    .semi-rtl .semi-avatar-group .semi-avatar-large,
    .semi-portal-rtl .semi-avatar-group .semi-avatar-large {
        margin-left: auto;
        margin-right: -18px
    }

    .semi-rtl .semi-avatar-group .semi-avatar-medium,
    .semi-rtl .semi-avatar-group .semi-avatar-small,
    .semi-portal-rtl .semi-avatar-group .semi-avatar-medium,
    .semi-portal-rtl .semi-avatar-group .semi-avatar-small {
        margin-left: auto;
        margin-right: -12px
    }

    .semi-rtl .semi-avatar-group .semi-avatar-extra-small,
    .semi-portal-rtl .semi-avatar-group .semi-avatar-extra-small {
        margin-left: auto;
        margin-right: -10px
    }

    .semi-rtl .semi-avatar-group .semi-avatar-extra-extra-small,
    .semi-portal-rtl .semi-avatar-group .semi-avatar-extra-extra-small {
        margin-left: auto;
        margin-right: -4px
    }
}


@layer base {
    .semi-tag {
        box-sizing: border-box;
        border-radius: var(--semi-border-radius-small);
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        white-space: nowrap;
        vertical-align: bottom;
        background-color: transparent;
        justify-content: center;
        align-items: center;
        display: inline-flex;
        position: relative;
        overflow: hidden
    }

    .semi-tag-default,
    .semi-tag-small {
        height: 20px;
        padding: 2px 8px;
        font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif;
        font-size: 12px;
        line-height: 16px
    }

    .semi-tag-default:focus-visible {
        outline: 2px solid var(--semi-color-primary-light-active)
    }

    .semi-tag-small:focus-visible {
        outline: 2px solid var(--semi-color-primary-light-active)
    }

    .semi-tag-square {
        border-radius: var(--semi-border-radius-small)
    }

    .semi-tag-circle {
        border-radius: var(--semi-border-radius-full)
    }

    .semi-tag-large {
        height: 24px;
        padding: 4px 8px;
        font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif;
        font-size: 12px;
        line-height: 16px
    }

    .semi-tag-large:focus-visible {
        outline: 2px solid var(--semi-color-primary-light-active)
    }

    .semi-tag-invisible {
        display: none
    }

    .semi-tag-prefix-icon {
        padding-right: 4px;
        display: flex
    }

    .semi-tag-suffix-icon {
        padding-left: 4px;
        display: flex
    }

    .semi-tag-content {
        flex: 1
    }

    .semi-tag-content-ellipsis {
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow: hidden
    }

    .semi-tag-content-center {
        justify-content: center;
        align-items: center;
        min-width: 0;
        height: 100%;
        display: flex
    }

    .semi-tag-close {
        color: var(--semi-color-text-2);
        cursor: pointer;
        justify-content: center;
        align-items: center;
        padding-left: 4px;
        display: flex
    }

    .semi-tag-close:hover {
        color: var(--semi-color-text-1)
    }

    .semi-tag-close:active {
        color: var(--semi-color-text-0)
    }

    .semi-tag-closable {
        padding: 4px 4px 4px 8px
    }

    .semi-tag-avatar-square .semi-avatar,
    .semi-tag-avatar-circle .semi-avatar {
        margin-right: 4px
    }

    .semi-tag-avatar-square {
        padding: 0 4px 0 0
    }

    .semi-tag-avatar-square .semi-avatar>img {
        background-color: var(--semi-color-default)
    }

    .semi-tag-avatar-circle {
        padding: 2px 4px 2px 2px
    }

    .semi-tag-avatar-square.semi-tag-default .semi-avatar,
    .semi-tag-avatar-square.semi-tag-small .semi-avatar {
        width: 20px;
        height: 20px
    }

    .semi-tag-avatar-square.semi-tag-large .semi-avatar {
        width: 24px;
        height: 24px
    }

    .semi-tag-avatar-circle.semi-tag-small,
    .semi-tag-avatar-circle.semi-tag-default {
        border-radius: 11px
    }

    .semi-tag-avatar-circle.semi-tag-small .semi-avatar,
    .semi-tag-avatar-circle.semi-tag-default .semi-avatar {
        width: 16px;
        height: 16px
    }

    .semi-tag-avatar-circle.semi-tag-large {
        border-radius: 13px
    }

    .semi-tag-avatar-circle.semi-tag-large .semi-avatar {
        width: 20px;
        height: 20px
    }

    .semi-tag-group {
        height: auto;
        display: block
    }

    .semi-tag-group .semi-tag {
        margin-bottom: 0;
        margin-right: 8px
    }

    .semi-tag-group-max.semi-tag-group-small {
        height: 22px
    }

    .semi-tag-group-max.semi-tag-group-large {
        height: 26px
    }

    .semi-tag-rest-group-popover .semi-tag {
        margin-bottom: 0;
        margin-right: 8px
    }

    .semi-tag-rest-group-popover .semi-tag:last-of-type {
        margin-right: 0
    }

    .semi-tag-amber-ghost {
        border: 1px solid rgba(var(--semi-amber-4), 1);
        color: rgba(var(--semi-amber-5), 1);
        background-color: transparent
    }

    .semi-tag-amber-solid {
        background-color: rgba(var(--semi-amber-5), 1);
        color: rgba(var(--semi-white), 1)
    }

    .semi-tag-amber-light {
        background-color: rgba(var(--semi-amber-5), .15);
        color: rgba(var(--semi-amber-8), 1)
    }

    .semi-tag-blue-ghost {
        border: 1px solid rgba(var(--semi-blue-4), 1);
        color: rgba(var(--semi-blue-5), 1);
        background-color: transparent
    }

    .semi-tag-blue-solid {
        background-color: rgba(var(--semi-blue-5), 1);
        color: rgba(var(--semi-white), 1)
    }

    .semi-tag-blue-light {
        background-color: rgba(var(--semi-blue-5), .15);
        color: rgba(var(--semi-blue-8), 1)
    }

    .semi-tag-cyan-ghost {
        border: 1px solid rgba(var(--semi-cyan-4), 1);
        color: rgba(var(--semi-cyan-5), 1);
        background-color: transparent
    }

    .semi-tag-cyan-solid {
        background-color: rgba(var(--semi-cyan-5), 1);
        color: rgba(var(--semi-white), 1)
    }

    .semi-tag-cyan-light {
        background-color: rgba(var(--semi-cyan-5), .15);
        color: rgba(var(--semi-cyan-8), 1)
    }

    .semi-tag-green-ghost {
        border: 1px solid rgba(var(--semi-green-4), 1);
        color: rgba(var(--semi-green-5), 1);
        background-color: transparent
    }

    .semi-tag-green-solid {
        background-color: rgba(var(--semi-green-5), 1);
        color: rgba(var(--semi-white), 1)
    }

    .semi-tag-green-light {
        background-color: rgba(var(--semi-green-5), .15);
        color: rgba(var(--semi-green-8), 1)
    }

    .semi-tag-grey-ghost {
        border: 1px solid rgba(var(--semi-grey-4), 1);
        color: rgba(var(--semi-grey-5), 1);
        background-color: transparent
    }

    .semi-tag-grey-solid {
        background-color: rgba(var(--semi-grey-5), 1);
        color: rgba(var(--semi-white), 1)
    }

    .semi-tag-grey-light {
        background-color: rgba(var(--semi-grey-5), .15);
        color: rgba(var(--semi-grey-8), 1)
    }

    .semi-tag-indigo-ghost {
        border: 1px solid rgba(var(--semi-indigo-4), 1);
        color: rgba(var(--semi-indigo-5), 1);
        background-color: transparent
    }

    .semi-tag-indigo-solid {
        background-color: rgba(var(--semi-indigo-5), 1);
        color: rgba(var(--semi-white), 1)
    }

    .semi-tag-indigo-light {
        background-color: rgba(var(--semi-indigo-5), .15);
        color: rgba(var(--semi-indigo-8), 1)
    }

    .semi-tag-light-blue-ghost {
        border: 1px solid rgba(var(--semi-light-blue-4), 1);
        color: rgba(var(--semi-light-blue-5), 1);
        background-color: transparent
    }

    .semi-tag-light-blue-solid {
        background-color: rgba(var(--semi-light-blue-5), 1);
        color: rgba(var(--semi-white), 1)
    }

    .semi-tag-light-blue-light {
        background-color: rgba(var(--semi-light-blue-5), .15);
        color: rgba(var(--semi-light-blue-8), 1)
    }

    .semi-tag-light-green-ghost {
        border: 1px solid rgba(var(--semi-light-green-4), 1);
        color: rgba(var(--semi-light-green-5), 1);
        background-color: transparent
    }

    .semi-tag-light-green-solid {
        background-color: rgba(var(--semi-light-green-5), 1);
        color: rgba(var(--semi-white), 1)
    }

    .semi-tag-light-green-light {
        background-color: rgba(var(--semi-light-green-5), .15);
        color: rgba(var(--semi-light-green-8), 1)
    }

    .semi-tag-lime-ghost {
        border: 1px solid rgba(var(--semi-lime-4), 1);
        color: rgba(var(--semi-lime-5), 1);
        background-color: transparent
    }

    .semi-tag-lime-solid {
        background-color: rgba(var(--semi-lime-5), 1);
        color: rgba(var(--semi-white), 1)
    }

    .semi-tag-lime-light {
        background-color: rgba(var(--semi-lime-5), .15);
        color: rgba(var(--semi-lime-8), 1)
    }

    .semi-tag-orange-ghost {
        border: 1px solid rgba(var(--semi-orange-4), 1);
        color: rgba(var(--semi-orange-5), 1);
        background-color: transparent
    }

    .semi-tag-orange-solid {
        background-color: rgba(var(--semi-orange-5), 1);
        color: rgba(var(--semi-white), 1)
    }

    .semi-tag-orange-light {
        background-color: rgba(var(--semi-orange-5), .15);
        color: rgba(var(--semi-orange-8), 1)
    }

    .semi-tag-pink-ghost {
        border: 1px solid rgba(var(--semi-pink-4), 1);
        color: rgba(var(--semi-pink-5), 1);
        background-color: transparent
    }

    .semi-tag-pink-solid {
        background-color: rgba(var(--semi-pink-5), 1);
        color: rgba(var(--semi-white), 1)
    }

    .semi-tag-pink-light {
        background-color: rgba(var(--semi-pink-5), .15);
        color: rgba(var(--semi-pink-8), 1)
    }

    .semi-tag-purple-ghost {
        border: 1px solid rgba(var(--semi-purple-4), 1);
        color: rgba(var(--semi-purple-5), 1);
        background-color: transparent
    }

    .semi-tag-purple-solid {
        background-color: rgba(var(--semi-purple-5), 1);
        color: rgba(var(--semi-white), 1)
    }

    .semi-tag-purple-light {
        background-color: rgba(var(--semi-purple-5), .15);
        color: rgba(var(--semi-purple-8), 1)
    }

    .semi-tag-red-ghost {
        border: 1px solid rgba(var(--semi-red-4), 1);
        color: rgba(var(--semi-red-5), 1);
        background-color: transparent
    }

    .semi-tag-red-solid {
        background-color: rgba(var(--semi-red-5), 1);
        color: rgba(var(--semi-white), 1)
    }

    .semi-tag-red-light {
        background-color: rgba(var(--semi-red-5), .15);
        color: rgba(var(--semi-red-8), 1)
    }

    .semi-tag-teal-ghost {
        border: 1px solid rgba(var(--semi-teal-4), 1);
        color: rgba(var(--semi-teal-5), 1);
        background-color: transparent
    }

    .semi-tag-teal-solid {
        background-color: rgba(var(--semi-teal-5), 1);
        color: rgba(var(--semi-white), 1)
    }

    .semi-tag-teal-light {
        background-color: rgba(var(--semi-teal-5), .15);
        color: rgba(var(--semi-teal-8), 1)
    }

    .semi-tag-violet-ghost {
        border: 1px solid rgba(var(--semi-violet-4), 1);
        color: rgba(var(--semi-violet-5), 1);
        background-color: transparent
    }

    .semi-tag-violet-solid {
        background-color: rgba(var(--semi-violet-5), 1);
        color: rgba(var(--semi-white), 1)
    }

    .semi-tag-violet-light {
        background-color: rgba(var(--semi-violet-5), .15);
        color: rgba(var(--semi-violet-8), 1)
    }

    .semi-tag-yellow-ghost {
        border: 1px solid rgba(var(--semi-yellow-4), 1);
        color: rgba(var(--semi-yellow-5), 1);
        background-color: transparent
    }

    .semi-tag-yellow-solid {
        background-color: rgba(var(--semi-yellow-5), 1);
        color: rgba(var(--semi-white), 1)
    }

    .semi-tag-yellow-light {
        background-color: rgba(var(--semi-yellow-5), .15);
        color: rgba(var(--semi-yellow-8), 1)
    }

    .semi-tag-white-ghost,
    .semi-tag-white-solid,
    .semi-tag-white-light {
        background-color: var(--semi-color-bg-4);
        border: 1px solid rgba(var(--semi-grey-2), .7);
        color: var(--semi-color-text-0)
    }

    .semi-tag-white-ghost .semi-tag-close,
    .semi-tag-white-light .semi-tag-close,
    .semi-tag-white-solid .semi-tag-close {
        color: var(--semi-color-text-2)
    }

    .semi-tag-avatar-square,
    .semi-tag-avatar-circle {
        background-color: var(--semi-color-bg-4);
        border: 1px solid var(--semi-color-border);
        color: var(--semi-color-text-0)
    }

    .semi-tag-solid .semi-tag-close {
        color: var(--semi-color-white);
        opacity: .8
    }

    .semi-tag-solid .semi-tag-close:hover {
        opacity: 1
    }

    .semi-tag-solid .semi-tag-close:active {
        opacity: .9
    }

    .semi-rtl .semi-tag,
    .semi-portal-rtl .semi-tag {
        direction: rtl
    }

    .semi-rtl .semi-tag-close,
    .semi-portal-rtl .semi-tag-close {
        padding-left: auto;
        padding-right: 4px
    }

    .semi-rtl .semi-tag-closable,
    .semi-portal-rtl .semi-tag-closable {
        padding: 4px 8px 4px 4px
    }

    .semi-rtl .semi-tag-avatar-square .semi-avatar,
    .semi-rtl .semi-tag-avatar-circle .semi-avatar,
    .semi-portal-rtl .semi-tag-avatar-square .semi-avatar,
    .semi-portal-rtl .semi-tag-avatar-circle .semi-avatar {
        margin-left: 4px;
        margin-right: auto
    }

    .semi-rtl .semi-tag-avatar-square,
    .semi-portal-rtl .semi-tag-avatar-square {
        padding-left: 4px;
        padding-right: auto
    }

    .semi-rtl .semi-tag-avatar-circle,
    .semi-portal-rtl .semi-tag-avatar-circle {
        padding: 2px 2px 2px 4px
    }

    .semi-rtl .semi-tag-group,
    .semi-portal-rtl .semi-tag-group {
        direction: rtl
    }

    .semi-rtl .semi-tag-group .semi-tag,
    .semi-portal-rtl .semi-tag-group .semi-tag {
        margin-left: 8px;
        margin-right: auto
    }

    .semi-rtl .semi-tag-rest-group-popover,
    .semi-portal-rtl .semi-tag-rest-group-popover {
        direction: rtl
    }

    .semi-rtl .semi-tag-rest-group-popover .semi-tag,
    .semi-portal-rtl .semi-tag-rest-group-popover .semi-tag {
        margin-left: 8px;
        margin-right: 0
    }

    .semi-rtl .semi-tag-rest-group-popover .semi-tag:last-of-type,
    .semi-portal-rtl .semi-tag-rest-group-popover .semi-tag:last-of-type {
        margin-left: 0;
        margin-right: auto
    }
}


@layer base {
    .semi-overflow-list {
        flex-wrap: nowrap;
        min-width: 0;
        display: flex
    }

    .semi-overflow-list-spacer {
        flex-shrink: 1;
        width: 1px
    }

    .semi-overflow-list-scroll-wrapper {
        flex-wrap: nowrap;
        flex: 1;
        display: flex;
        overflow-x: scroll
    }

    .semi-rtl .semi-overflow-list,
    .semi-portal-rtl .semi-overflow-list {
        direction: rtl
    }
}


@layer base {
    .semi-space {
        display: inline-flex
    }

    .semi-space-vertical {
        flex-direction: column
    }

    .semi-space-horizontal {
        flex-direction: row
    }

    .semi-space-align-center {
        align-items: center
    }

    .semi-space-align-end {
        align-items: flex-end
    }

    .semi-space-align-start {
        align-items: flex-start
    }

    .semi-space-align-baseline {
        align-items: baseline
    }

    .semi-space-wrap {
        flex-wrap: wrap
    }

    .semi-space-tight-horizontal {
        -moz-column-gap: 8px;
        column-gap: 8px
    }

    .semi-space-tight-vertical {
        row-gap: 8px
    }

    .semi-space-medium-horizontal {
        -moz-column-gap: 16px;
        column-gap: 16px
    }

    .semi-space-medium-vertical {
        row-gap: 16px
    }

    .semi-space-loose-horizontal {
        -moz-column-gap: 24px;
        column-gap: 24px
    }

    .semi-space-loose-vertical {
        row-gap: 24px
    }

    .semi-rtl .semi-space,
    .semi-portal-rtl .semi-space {
        direction: rtl
    }
}


@layer base {
    .semi-highlight-tag {
        color: var(--semi-color-highlight);
        background-color: var(--semi-color-highlight-bg);
        font-weight: 600
    }
}


@layer base {
    .semi-select-option {
        word-break: break-all;
        color: var(--semi-color-text-0);
        cursor: pointer;
        box-sizing: border-box;
        transition: background-color var(--semi-transition_duration-none)var(--semi-transition_function-easeIn)var(--semi-transition_delay-none);
        border-radius: 0;
        flex-wrap: nowrap;
        align-items: center;
        padding: 8px 12px;
        font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif;
        font-size: 14px;
        line-height: 20px;
        display: flex;
        position: relative
    }

    .semi-select-option-icon {
        color: transparent;
        align-content: center;
        justify-content: center;
        width: 12px;
        margin-right: 8px;
        display: flex
    }

    .semi-select-option-text {
        white-space: pre;
        flex-wrap: wrap;
        display: flex
    }

    .semi-select-option-keyword {
        color: var(--semi-color-primary);
        background-color: inherit;
        font-weight: 600
    }

    .semi-select-option:active {
        background-color: var(--semi-color-fill-1)
    }

    .semi-select-option-empty {
        cursor: not-allowed;
        color: var(--semi-color-disabled-text);
        justify-content: center
    }

    .semi-select-option-empty:hover,
    .semi-select-option-empty:active {
        background-color: inherit
    }

    .semi-select-option-disabled {
        color: var(--semi-color-disabled-text);
        cursor: not-allowed
    }

    .semi-select-option-disabled:hover {
        background-color: var(--semi-color-fill-0)
    }

    .semi-select-option-selected {
        background: 0 0;
        font-weight: 600
    }

    .semi-select-option-selected .semi-select-option-icon {
        color: var(--semi-color-text-2)
    }

    .semi-select-option-focused {
        background-color: var(--semi-color-fill-0)
    }

    .semi-select {
        box-sizing: border-box;
        border-radius: var(--semi-border-radius-small);
        background-color: var(--semi-color-fill-0);
        vertical-align: middle;
        cursor: pointer;
        height: 32px;
        transition: background-color var(--semi-transition_duration-none)var(--semi-transition_function-easeIn)var(--semi-transition_delay-none), border var(--semi-transition_duration-none)var(--semi-transition_function-easeIn)var(--semi-transition_delay-none);
        transform: scale(var(--semi-transform_scale-none));
        border: 1px solid transparent;
        outline: none;
        max-height: 300px;
        font-weight: 400;
        display: inline-flex;
        position: relative;
        overflow-y: auto
    }

    .semi-select:hover {
        background-color: var(--semi-color-fill-1);
        border: 1px solid transparent
    }

    .semi-select:focus {
        border: 1px solid var(--semi-color-focus-border);
        background-color: var(--semi-color-fill-0);
        outline: 0
    }

    .semi-select:active {
        background-color: var(--semi-color-fill-2)
    }

    .semi-select-small {
        height: 24px;
        line-height: 24px
    }

    .semi-select-large {
        min-height: 40px;
        line-height: 40px
    }

    .semi-select-large .semi-select-selection {
        font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif;
        font-size: 16px;
        line-height: 22px
    }

    .semi-select-open,
    .semi-select-focus {
        border: 1px solid var(--semi-color-focus-border);
        outline: 0
    }

    .semi-select-open:hover,
    .semi-select-focus:hover {
        background-color: var(--semi-color-fill-0);
        border: 1px solid var(--semi-color-focus-border)
    }

    .semi-select-open:active,
    .semi-select-focus:active {
        background-color: var(--semi-color-fill-2);
        border: 1px solid var(--semi-color-focus-border)
    }

    .semi-select-warning {
        background-color: var(--semi-color-warning-light-default);
        border-color: var(--semi-color-warning-light-default)
    }

    .semi-select-warning:hover {
        background-color: var(--semi-color-warning-light-hover);
        border-color: var(--semi-color-warning-light-hover)
    }

    .semi-select-warning:focus {
        background-color: var(--semi-color-warning-light-default);
        border-color: var(--semi-color-warning)
    }

    .semi-select-warning:active {
        background-color: var(--semi-color-warning-light-active);
        border-color: var(--semi-color-warning-light-active)
    }

    .semi-select-error {
        background-color: var(--semi-color-danger-light-default);
        border-color: var(--semi-color-danger-light-default)
    }

    .semi-select-error:hover {
        background-color: var(--semi-color-danger-light-hover);
        border-color: var(--semi-color-danger-light-hover)
    }

    .semi-select-error:focus {
        background-color: var(--semi-color-danger-light-default);
        border-color: var(--semi-color-danger)
    }

    .semi-select-error:active {
        background-color: var(--semi-color-danger-light-active);
        border-color: var(--semi-color-danger-light-active)
    }

    .semi-select-disabled {
        cursor: not-allowed;
        background-color: var(--semi-color-disabled-fill)
    }

    .semi-select-disabled:hover {
        background-color: var(--semi-color-disabled-fill)
    }

    .semi-select-disabled:focus {
        background-color: var(--semi-color-disabled-fill);
        border: 1px solid transparent
    }

    .semi-select-disabled .semi-select-selection,
    .semi-select-disabled .semi-select-selection-placeholder {
        color: var(--semi-color-disabled-text);
        cursor: not-allowed
    }

    .semi-select-disabled .semi-select-arrow,
    .semi-select-disabled .semi-select-prefix,
    .semi-select-disabled .semi-select-suffix {
        color: var(--semi-color-disabled-text)
    }

    .semi-select-disabled .semi-tag {
        color: var(--semi-color-disabled-text);
        background-color: transparent
    }

    .semi-select-selection {
        cursor: pointer;
        height: 100%;
        color: var(--semi-color-text-0);
        flex-grow: 1;
        align-items: center;
        margin-left: 12px;
        font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif;
        font-size: 14px;
        line-height: 20px;
        display: flex;
        overflow: hidden
    }

    .semi-select-selection-text {
        text-overflow: ellipsis;
        width: 100%;
        overflow: hidden
    }

    .semi-select-selection-text-inactive {
        opacity: .4;
        display: flex
    }

    .semi-select-selection-text-hide {
        display: none
    }

    .semi-select-selection-placeholder {
        color: var(--semi-color-text-2)
    }

    .semi-select-selection .semi-tag {
        margin-top: 1px;
        margin-bottom: 1px;
        margin-right: 4px
    }

    .semi-select-selection .semi-tag:first-of-type {
        margin-left: 0
    }

    .semi-select-selection .semi-tag-group {
        height: inherit
    }

    .semi-select-selection .semi-tag-group .semi-tag {
        margin-top: 1px;
        margin-bottom: 1px;
        margin-right: 4px
    }

    .semi-select-content-wrapper {
        white-space: nowrap;
        align-items: center;
        height: 100%;
        display: flex;
        overflow: hidden
    }

    .semi-select-content-wrapper-collapse {
        flex-shrink: 0;
        width: 100%;
        display: inline-flex
    }

    .semi-select-content-wrapper-collapse .semi-overflow-list-overflow {
        min-width: 50px;
        max-width: 100%
    }

    .semi-select-content-wrapper-collapse>.semi-select-content-wrapper-collapse-tag {
        background-color: transparent
    }

    .semi-select-content-wrapper-collapse>.semi-select-content-wrapper-collapse-N {
        color: var(--semi-color-text-0);
        background-color: transparent;
        padding: 4px;
        font-size: 12px
    }

    .semi-select-multiple {
        height: auto
    }

    .semi-select-multiple .semi-select-selection {
        margin-left: 4px
    }

    .semi-select-multiple .semi-select-content-wrapper {
        flex-wrap: wrap;
        width: 100%;
        min-height: 30px
    }

    .semi-select-multiple .semi-select-content-wrapper-empty {
        margin-left: 8px
    }

    .semi-select-multiple .semi-select-content-wrapper .semi-tag-group {
        align-items: center;
        display: flex
    }

    .semi-select-multiple .semi-select-content-wrapper-one-line {
        flex-wrap: nowrap
    }

    .semi-select-multiple .semi-select-content-wrapper-one-line .semi-tag-group {
        flex-wrap: nowrap;
        flex-shrink: 0;
        justify-content: flex-start;
        overflow: hidden
    }

    .semi-select-multiple .semi-select-inline-label-wrapper {
        flex-shrink: 0
    }

    .semi-select-multiple.semi-select-large .semi-select-content-wrapper {
        min-height: 38px
    }

    .semi-select-multiple.semi-select-small .semi-select-content-wrapper {
        min-height: 22px
    }

    .semi-select-arrow {
        width: 32px;
        color: var(--semi-color-text-2);
        transform: rotate(var(--semi-transform-rotate-none));
        flex-shrink: 0;
        justify-content: center;
        align-items: center;
        display: flex
    }

    .semi-select-arrow-empty {
        width: 12px;
        display: flex
    }

    .semi-select-prefix,
    .semi-select-suffix {
        justify-content: center;
        align-items: center;
        display: flex
    }

    .semi-select-prefix-text,
    .semi-select-suffix-text {
        margin: 0 12px
    }

    .semi-select-prefix-icon,
    .semi-select-suffix-icon {
        color: var(--semi-color-text-2);
        margin: 0 8px
    }

    .semi-select-suffix {
        justify-content: center;
        align-items: center;
        display: flex
    }

    .semi-select-clear {
        width: 32px;
        color: var(--semi-color-text-2);
        flex-shrink: 0;
        justify-content: center;
        align-items: center;
        display: flex
    }

    .semi-select-clear:hover {
        color: var(--semi-color-primary)
    }

    .semi-select-inset-label-wrapper {
        display: inline
    }

    .semi-select-inset-label {
        color: var(--semi-color-text-2);
        white-space: nowrap;
        flex-shrink: 0;
        margin-right: 12px;
        font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif;
        font-size: 14px;
        font-weight: 600;
        line-height: 20px
    }

    .semi-select-create-tips {
        color: var(--semi-color-text-2);
        margin-right: 4px
    }

    .semi-select-with-prefix .semi-select-selection {
        margin-left: 0
    }

    .semi-select-single.semi-select-filterable .semi-select-content-wrapper {
        flex-grow: 1;
        height: 100%;
        position: relative;
        overflow: hidden
    }

    .semi-select-single.semi-select-filterable .semi-input-wrapper {
        background-color: transparent;
        border: none;
        width: 100%;
        height: 100%;
        position: absolute;
        top: 0;
        left: 0
    }

    .semi-select-single.semi-select-filterable .semi-input-wrapper-focus {
        border: none
    }

    .semi-select-single.semi-select-filterable .semi-input {
        height: 100%;
        padding-left: 0;
        padding-right: 0
    }

    .semi-select-multiple.semi-select-filterable .semi-select-content-wrapper {
        flex-grow: 1;
        height: 100%;
        position: relative;
        overflow: hidden
    }

    .semi-select-multiple.semi-select-filterable .semi-select-content-wrapper:not(.semi-select-content-wrapper-empty) .semi-input-wrapper {
        height: 24px;
        line-height: 24px
    }

    .semi-select-multiple.semi-select-filterable .semi-select-content-wrapper:not(.semi-select-content-wrapper-empty) .semi-input-wrapper .semi-input-default {
        height: 24px
    }

    .semi-select-multiple.semi-select-filterable .semi-select-content-wrapper-empty .semi-input-wrapper {
        height: 100%;
        position: absolute;
        top: 0;
        left: 0
    }

    .semi-select-multiple.semi-select-filterable .semi-select-content-wrapper-empty .semi-input-wrapper .semi-input-default {
        height: 100%
    }

    .semi-select-multiple.semi-select-filterable .semi-input-wrapper {
        background-color: transparent;
        border: none;
        width: 100%;
        height: 100%
    }

    .semi-select-multiple.semi-select-filterable .semi-input-wrapper-focus {
        border: none
    }

    .semi-select-multiple.semi-select-filterable .semi-input {
        padding-left: 0;
        padding-right: 0
    }

    .semi-select-multiple.semi-select-filterable.semi-select-large .semi-select-content-wrapper:not(.semi-select-content-wrapper-empty) .semi-input-wrapper-large {
        height: 24px;
        line-height: 24px
    }

    .semi-select-multiple.semi-select-filterable.semi-select-large .semi-select-content-wrapper:not(.semi-select-content-wrapper-empty) .semi-input-wrapper-large .semi-input-large {
        height: 24px
    }

    .semi-select-multiple.semi-select-filterable.semi-select-small .semi-select-content-wrapper:not(.semi-select-content-wrapper-empty) .semi-input-wrapper {
        height: 20px;
        line-height: 20px
    }

    .semi-select-multiple.semi-select-filterable.semi-select-small .semi-select-content-wrapper:not(.semi-select-content-wrapper-empty) .semi-input-wrapper .semi-input-small {
        height: 20px
    }

    .semi-select-option-list-wrapper {
        padding: 4px 0
    }

    .semi-select-option-list {
        overflow-x: hidden;
        overflow-y: auto
    }

    .semi-select-option-list-chosen .semi-select-option-icon {
        display: flex
    }

    .semi-select-group {
        color: var(--semi-color-text-2);
        cursor: default;
        margin-top: 4px;
        padding: 12px 16px 4px 32px;
        font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif;
        font-size: 12px;
        line-height: 16px
    }

    .semi-select-group:not(:first-of-type) {
        border-top: 1px solid var(--semi-color-border)
    }

    .semi-select-loading-wrapper {
        cursor: not-allowed;
        box-sizing: content-box;
        height: 20px;
        padding: 8px 16px
    }

    .semi-select-borderless:not(:focus-within):not(:hover) {
        background-color: transparent;
        border-color: transparent
    }

    .semi-select-borderless:not(:focus-within):not(:hover) .semi-select-arrow {
        opacity: 0
    }

    .semi-select-borderless:focus-within:not(:active) {
        background-color: transparent
    }

    .semi-select-borderless.semi-select-error:not(:focus-within) {
        border-color: var(--semi-color-danger)
    }

    .semi-select-borderless.semi-select-warning:not(:focus-within) {
        border-color: var(--semi-color-warning)
    }

    .semi-select-borderless.semi-select-error:focus-within {
        border-color: var(--semi-color-danger)
    }

    .semi-select-borderless.semi-select-warning:focus-within {
        border-color: var(--semi-color-warning)
    }

    .semi-select-dropdown-search-wrapper {
        border-bottom: 1px solid transparent;
        padding: 8px 12px
    }

    .semi-rtl .semi-select,
    .semi-portal-rtl .semi-select {
        direction: rtl
    }

    .semi-rtl .semi-select-selection,
    .semi-portal-rtl .semi-select-selection {
        margin-left: 0;
        margin-right: 12px
    }

    .semi-rtl .semi-select-selection .semi-tag:first-of-type,
    .semi-portal-rtl .semi-select-selection .semi-tag:first-of-type {
        margin-right: 0
    }

    .semi-rtl .semi-select-selection .semi-tag-group .semi-tag,
    .semi-portal-rtl .semi-select-selection .semi-tag-group .semi-tag {
        margin-left: 4px;
        margin-right: 0
    }

    .semi-rtl .semi-select-multiple .semi-select-selection,
    .semi-portal-rtl .semi-select-multiple .semi-select-selection {
        margin-left: 0;
        margin-right: 4px
    }

    .semi-rtl .semi-select-multiple .semi-select-content-wrapper-empty,
    .semi-portal-rtl .semi-select-multiple .semi-select-content-wrapper-empty {
        margin-left: 0;
        margin-right: 8px
    }

    .semi-rtl .semi-select-inset-label,
    .semi-portal-rtl .semi-select-inset-label {
        margin-left: 12px
    }

    .semi-rtl .semi-select-create-tips,
    .semi-portal-rtl .semi-select-create-tips {
        margin-left: 4px;
        margin-right: 0
    }

    .semi-rtl .semi-select-with-prefix .semi-select-selection,
    .semi-portal-rtl .semi-select-with-prefix .semi-select-selection {
        margin-left: auto;
        margin-right: 0
    }

    .semi-rtl .semi-select-single.semi-select-filterable .semi-input-wrapper,
    .semi-portal-rtl .semi-select-single.semi-select-filterable .semi-input-wrapper,
    .semi-rtl .semi-select-multiple.semi-select-filterable .semi-select-content-wrapper-empty .semi-input-wrapper,
    .semi-portal-rtl .semi-select-multiple.semi-select-filterable .semi-select-content-wrapper-empty .semi-input-wrapper {
        left: auto;
        right: 0
    }

    .semi-rtl .semi-select-group,
    .semi-portal-rtl .semi-select-group {
        padding-left: 32px;
        padding-right: 16px
    }

    .semi-rtl .semi-select-option-icon,
    .semi-portal-rtl .semi-select-option-icon {
        margin-left: 8px;
        margin-right: 0
    }
}


@layer base {
    .semi-toast {
        pointer-events: none
    }

    .semi-toast-wrapper {
        z-index: 1010;
        justify-content: center;
        width: 100%;
        height: 0;
        display: flex;
        position: fixed;
        top: 0
    }

    .semi-toast-wrapper .semi-toast-innerWrapper {
        width: -moz-fit-content;
        width: fit-content;
        height: -moz-fit-content;
        text-align: center;
        height: fit-content
    }

    .semi-toast-wrapper .semi-toast-innerWrapper-hover .semi-toast-zero-height-wrapper {
        perspective: unset;
        perspective-origin: 50%
    }

    .semi-toast-zero-height-wrapper {
        perspective-origin: 50% 280px;
        perspective: 280px;
        height: 0;
        transition: all .3s cubic-bezier(.22, .57, .02, 1.2);
        overflow: visible
    }

    .semi-toast-content {
        pointer-events: all;
        box-shadow: var(--semi-shadow-elevated);
        background-color: var(--semi-color-bg-3);
        border-radius: var(--semi-border-radius-medium);
        color: var(--semi-color-text-0);
        justify-content: center;
        align-items: flex-start;
        margin: 12px;
        padding: 12px 8px;
        font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif;
        font-size: 14px;
        font-weight: 600;
        line-height: 20px;
        display: inline-flex
    }

    .semi-toast-content .semi-toast-close-button {
        height: 20px;
        margin-top: -2px
    }

    .semi-toast-content .semi-toast-content-text {
        text-align: left;
        word-wrap: break-word;
        overflow-wrap: break-word;
        margin-left: 12px;
        margin-right: 12px
    }

    .semi-toast-light.semi-toast-warning .semi-toast-content {
        background-color: var(--semi-color-warning-light-default);
        border: 1px solid var(--semi-color-warning)
    }

    .semi-toast-light.semi-toast-warning .semi-toast-icon-warning {
        color: var(--semi-color-warning)
    }

    .semi-toast-light.semi-toast-success .semi-toast-content {
        background-color: var(--semi-color-success-light-default);
        border: 1px solid var(--semi-color-success)
    }

    .semi-toast-light.semi-toast-success .semi-toast-icon-success {
        color: var(--semi-color-success)
    }

    .semi-toast-light.semi-toast-info .semi-toast-content {
        background-color: var(--semi-color-info-light-default);
        border: 1px solid var(--semi-color-info)
    }

    .semi-toast-light.semi-toast-info .semi-toast-icon-info {
        color: var(--semi-color-info)
    }

    .semi-toast-light.semi-toast-error .semi-toast-content {
        background-color: var(--semi-color-danger-light-default);
        border: 1px solid var(--semi-color-danger)
    }

    .semi-toast-light.semi-toast-error .semi-toast-icon-error {
        color: var(--semi-color-danger)
    }

    .semi-toast .semi-toast-icon-warning {
        color: var(--semi-color-warning)
    }

    .semi-toast .semi-toast-icon-success {
        color: var(--semi-color-success)
    }

    .semi-toast .semi-toast-icon-info {
        color: var(--semi-color-info)
    }

    .semi-toast .semi-toast-icon-error {
        color: var(--semi-color-danger)
    }

    .semi-toast-animation-show {
        animation: .3s cubic-bezier(.22, .57, .02, 1.2) forwards semi-toast-keyframe-toast-show
    }

    .semi-toast-animation-hide {
        animation: .3s cubic-bezier(.22, .57, .02, 1.2) forwards semi-toast-keyframe-toast-hide
    }

    @keyframes semi-toast-keyframe-toast-show {
        0% {
            opacity: 0;
            transform: translateY(-100%)
        }

        to {
            opacity: 1
        }
    }

    @keyframes semi-toast-keyframe-toast-hide {
        0% {
            opacity: 1
        }

        to {
            opacity: 0;
            transform: translateY(-100%)
        }
    }

    .semi-toast-rtl {
        direction: rtl
    }

    .semi-toast-rtl .semi-toast-content .semi-toast-content-text {
        text-align: right;
        margin-left: 12px;
        margin-right: 12px
    }
}


.coz-button {
    cursor: pointer;
    border-style: none
}

.coz-button.semi-button-disabled {
    cursor: not-allowed
}

.coz-button.semi-button.coz-btn-brand {
    color: rgba(var(--coze-fg-5), var(--coze-fg-5-alpha));
    background-color: rgba(var(--coze-brand-5), 1)
}

.coz-button.semi-button.coz-btn-brand.semi-button-primary:not(:-webkit-any(.semi-button-borderless, .semi-button-light)):hover {
    background-color: rgba(var(--coze-brand-6), 1)
}

.coz-button.semi-button.coz-btn-brand.semi-button-primary:not(:-moz-any(.semi-button-borderless, .semi-button-light)):hover {
    background-color: rgba(var(--coze-brand-6), 1)
}

.coz-button.semi-button.coz-btn-brand.semi-button-primary:not(:is(.semi-button-borderless, .semi-button-light)):hover {
    background-color: rgba(var(--coze-brand-6), 1)
}

.coz-button.semi-button.coz-btn-brand.semi-button-primary:not(:-webkit-any(.semi-button-borderless, .semi-button-light)):active {
    background-color: rgba(var(--coze-brand-7), 1)
}

.coz-button.semi-button.coz-btn-brand.semi-button-primary:not(:-moz-any(.semi-button-borderless, .semi-button-light)):active {
    background-color: rgba(var(--coze-brand-7), 1)
}

.coz-button.semi-button.coz-btn-brand.semi-button-primary:not(:is(.semi-button-borderless, .semi-button-light)):active {
    background-color: rgba(var(--coze-brand-7), 1)
}

.coz-button.semi-button.coz-btn-brand:disabled {
    color: rgba(var(--coze-fg-5), var(--coze-fg-5-alpha));
    background-color: rgba(var(--coze-brand-3), var(--coze-brand-3-alpha))
}

.coz-button.semi-button.coz-btn-brand:disabled:hover,
.coz-button.semi-button.coz-btn-brand:disabled:active {
    color: rgba(var(--coze-fg-5), var(--coze-fg-5-alpha))
}

.coz-button.semi-button.coz-btn-highlight {
    color: rgba(var(--coze-brand-5), 1);
    background-color: rgba(var(--coze-brand-1), var(--coze-brand-1-alpha))
}

.coz-button.semi-button.coz-btn-highlight.semi-button-primary:not(:-webkit-any(.semi-button-borderless, .semi-button-light)):hover {
    background-color: rgba(var(--coze-brand-2), var(--coze-brand-2-alpha))
}

.coz-button.semi-button.coz-btn-highlight.semi-button-primary:not(:-moz-any(.semi-button-borderless, .semi-button-light)):hover {
    background-color: rgba(var(--coze-brand-2), var(--coze-brand-2-alpha))
}

.coz-button.semi-button.coz-btn-highlight.semi-button-primary:not(:is(.semi-button-borderless, .semi-button-light)):hover {
    background-color: rgba(var(--coze-brand-2), var(--coze-brand-2-alpha))
}

.coz-button.semi-button.coz-btn-highlight.semi-button-primary:not(:-webkit-any(.semi-button-borderless, .semi-button-light)):active {
    background-color: rgba(var(--coze-brand-3), var(--coze-brand-3-alpha))
}

.coz-button.semi-button.coz-btn-highlight.semi-button-primary:not(:-moz-any(.semi-button-borderless, .semi-button-light)):active {
    background-color: rgba(var(--coze-brand-3), var(--coze-brand-3-alpha))
}

.coz-button.semi-button.coz-btn-highlight.semi-button-primary:not(:is(.semi-button-borderless, .semi-button-light)):active {
    background-color: rgba(var(--coze-brand-3), var(--coze-brand-3-alpha))
}

.coz-button.semi-button.coz-btn-highlight:disabled {
    color: rgba(var(--coze-brand-3), var(--coze-brand-3-alpha));
    background-color: rgba(var(--coze-brand-1), var(--coze-brand-1-alpha))
}

.coz-button.semi-button.coz-btn-highlight:disabled:hover,
.coz-button.semi-button.coz-btn-highlight:disabled:active {
    color: rgba(var(--coze-brand-3), var(--coze-brand-3-alpha))
}

.coz-button.semi-button.coz-btn-primary {
    color: rgba(var(--coze-fg-3), var(--coze-fg-3-alpha));
    background-color: rgba(var(--coze-bg-5), var(--coze-bg-5-alpha))
}

.coz-button.semi-button.coz-btn-primary.semi-button-primary:not(:-webkit-any(.semi-button-borderless, .semi-button-light)):hover {
    background-color: rgba(var(--coze-bg-6), var(--coze-bg-6-alpha))
}

.coz-button.semi-button.coz-btn-primary.semi-button-primary:not(:-moz-any(.semi-button-borderless, .semi-button-light)):hover {
    background-color: rgba(var(--coze-bg-6), var(--coze-bg-6-alpha))
}

.coz-button.semi-button.coz-btn-primary.semi-button-primary:not(:is(.semi-button-borderless, .semi-button-light)):hover {
    background-color: rgba(var(--coze-bg-6), var(--coze-bg-6-alpha))
}

.coz-button.semi-button.coz-btn-primary.semi-button-primary:not(:-webkit-any(.semi-button-borderless, .semi-button-light)):active {
    background-color: rgba(var(--coze-bg-7), var(--coze-bg-7-alpha))
}

.coz-button.semi-button.coz-btn-primary.semi-button-primary:not(:-moz-any(.semi-button-borderless, .semi-button-light)):active {
    background-color: rgba(var(--coze-bg-7), var(--coze-bg-7-alpha))
}

.coz-button.semi-button.coz-btn-primary.semi-button-primary:not(:is(.semi-button-borderless, .semi-button-light)):active {
    background-color: rgba(var(--coze-bg-7), var(--coze-bg-7-alpha))
}

.coz-button.semi-button.coz-btn-primary:disabled {
    color: rgba(var(--coze-fg-1), var(--coze-fg-1-alpha));
    background-color: rgba(var(--coze-bg-5), var(--coze-bg-5-alpha))
}

.coz-button.semi-button.coz-btn-primary:disabled:hover,
.coz-button.semi-button.coz-btn-primary:disabled:active {
    color: rgba(var(--coze-fg-1), var(--coze-fg-1-alpha))
}

.coz-button.semi-button.coz-btn-secondary {
    color: rgba(var(--coze-fg-3), var(--coze-fg-3-alpha));
    background-color: transparent
}

.coz-button.semi-button.coz-btn-secondary.semi-button-primary:not(:-webkit-any(.semi-button-borderless, .semi-button-light)):hover {
    background-color: rgba(var(--coze-bg-5), var(--coze-bg-5-alpha))
}

.coz-button.semi-button.coz-btn-secondary.semi-button-primary:not(:-moz-any(.semi-button-borderless, .semi-button-light)):hover {
    background-color: rgba(var(--coze-bg-5), var(--coze-bg-5-alpha))
}

.coz-button.semi-button.coz-btn-secondary.semi-button-primary:not(:is(.semi-button-borderless, .semi-button-light)):hover {
    background-color: rgba(var(--coze-bg-5), var(--coze-bg-5-alpha))
}

.coz-button.semi-button.coz-btn-secondary.semi-button-primary:not(:-webkit-any(.semi-button-borderless, .semi-button-light)):active {
    background-color: rgba(var(--coze-bg-6), var(--coze-bg-6-alpha))
}

.coz-button.semi-button.coz-btn-secondary.semi-button-primary:not(:-moz-any(.semi-button-borderless, .semi-button-light)):active {
    background-color: rgba(var(--coze-bg-6), var(--coze-bg-6-alpha))
}

.coz-button.semi-button.coz-btn-secondary.semi-button-primary:not(:is(.semi-button-borderless, .semi-button-light)):active {
    background-color: rgba(var(--coze-bg-6), var(--coze-bg-6-alpha))
}

.coz-button.semi-button.coz-btn-secondary:disabled,
.coz-button.semi-button.coz-btn-secondary:disabled:hover,
.coz-button.semi-button.coz-btn-secondary:disabled:active {
    color: rgba(var(--coze-fg-1), var(--coze-fg-1-alpha));
    background-color: transparent
}

.coz-button.semi-button.coz-btn-yellow {
    color: rgba(var(--coze-fg-7), 1);
    background-color: rgba(var(--coze-yellow-5), 1)
}

.coz-button.semi-button.coz-btn-yellow.semi-button-primary:not(:-webkit-any(.semi-button-borderless, .semi-button-light)):hover {
    background-color: rgba(var(--coze-yellow-6), 1)
}

.coz-button.semi-button.coz-btn-yellow.semi-button-primary:not(:-moz-any(.semi-button-borderless, .semi-button-light)):hover {
    background-color: rgba(var(--coze-yellow-6), 1)
}

.coz-button.semi-button.coz-btn-yellow.semi-button-primary:not(:is(.semi-button-borderless, .semi-button-light)):hover {
    background-color: rgba(var(--coze-yellow-6), 1)
}

.coz-button.semi-button.coz-btn-yellow.semi-button-primary:not(:-webkit-any(.semi-button-borderless, .semi-button-light)):active {
    background-color: rgba(var(--coze-yellow-7), 1)
}

.coz-button.semi-button.coz-btn-yellow.semi-button-primary:not(:-moz-any(.semi-button-borderless, .semi-button-light)):active {
    background-color: rgba(var(--coze-yellow-7), 1)
}

.coz-button.semi-button.coz-btn-yellow.semi-button-primary:not(:is(.semi-button-borderless, .semi-button-light)):active {
    background-color: rgba(var(--coze-yellow-7), 1)
}

.coz-button.semi-button.coz-btn-yellow:disabled {
    color: rgba(var(--coze-fg-white), var(--coze-fg-white-alpha));
    background-color: rgba(var(--coze-yellow-3), var(--coze-yellow-3-alpha))
}

.coz-button.semi-button.coz-btn-yellow:disabled:hover,
.coz-button.semi-button.coz-btn-yellow:disabled:active {
    color: rgba(var(--coze-fg-white), var(--coze-fg-white-alpha))
}

.coz-button.semi-button.coz-btn-red {
    color: rgba(var(--coze-fg-7), 1);
    background-color: rgba(var(--coze-red-5), 1)
}

.coz-button.semi-button.coz-btn-red.semi-button-primary:not(:-webkit-any(.semi-button-borderless, .semi-button-light)):hover {
    background-color: rgba(var(--coze-red-6), 1)
}

.coz-button.semi-button.coz-btn-red.semi-button-primary:not(:-moz-any(.semi-button-borderless, .semi-button-light)):hover {
    background-color: rgba(var(--coze-red-6), 1)
}

.coz-button.semi-button.coz-btn-red.semi-button-primary:not(:is(.semi-button-borderless, .semi-button-light)):hover {
    background-color: rgba(var(--coze-red-6), 1)
}

.coz-button.semi-button.coz-btn-red.semi-button-primary:not(:-webkit-any(.semi-button-borderless, .semi-button-light)):active {
    background-color: rgba(var(--coze-red-7), 1)
}

.coz-button.semi-button.coz-btn-red.semi-button-primary:not(:-moz-any(.semi-button-borderless, .semi-button-light)):active {
    background-color: rgba(var(--coze-red-7), 1)
}

.coz-button.semi-button.coz-btn-red.semi-button-primary:not(:is(.semi-button-borderless, .semi-button-light)):active {
    background-color: rgba(var(--coze-red-7), 1)
}

.coz-button.semi-button.coz-btn-red:disabled {
    color: rgba(var(--coze-fg-white), var(--coze-fg-white-alpha));
    background-color: rgba(var(--coze-red-3), var(--coze-red-3-alpha))
}

.coz-button.semi-button.coz-btn-red:disabled:hover,
.coz-button.semi-button.coz-btn-red:disabled:active {
    color: rgba(var(--coze-fg-white), var(--coze-fg-white-alpha))
}

.coz-button.semi-button.coz-btn-redhglt {
    color: rgba(var(--coze-red-5), 1);
    background-color: rgba(var(--coze-red-1), var(--coze-red-1-alpha))
}

.coz-button.semi-button.coz-btn-redhglt.semi-button-primary:not(:-webkit-any(.semi-button-borderless, .semi-button-light)):hover {
    background-color: rgba(var(--coze-red-2), var(--coze-red-2-alpha))
}

.coz-button.semi-button.coz-btn-redhglt.semi-button-primary:not(:-moz-any(.semi-button-borderless, .semi-button-light)):hover {
    background-color: rgba(var(--coze-red-2), var(--coze-red-2-alpha))
}

.coz-button.semi-button.coz-btn-redhglt.semi-button-primary:not(:is(.semi-button-borderless, .semi-button-light)):hover {
    background-color: rgba(var(--coze-red-2), var(--coze-red-2-alpha))
}

.coz-button.semi-button.coz-btn-redhglt.semi-button-primary:not(:-webkit-any(.semi-button-borderless, .semi-button-light)):active {
    background-color: rgba(var(--coze-red-3), var(--coze-red-3-alpha))
}

.coz-button.semi-button.coz-btn-redhglt.semi-button-primary:not(:-moz-any(.semi-button-borderless, .semi-button-light)):active {
    background-color: rgba(var(--coze-red-3), var(--coze-red-3-alpha))
}

.coz-button.semi-button.coz-btn-redhglt.semi-button-primary:not(:is(.semi-button-borderless, .semi-button-light)):active {
    background-color: rgba(var(--coze-red-3), var(--coze-red-3-alpha))
}

.coz-button.semi-button.coz-btn-redhglt:disabled {
    color: rgba(var(--coze-red-3), var(--coze-red-3-alpha));
    background-color: rgba(var(--coze-red-1), var(--coze-red-1-alpha))
}

.coz-button.semi-button.coz-btn-redhglt:disabled:hover,
.coz-button.semi-button.coz-btn-redhglt:disabled:active {
    color: rgba(var(--coze-red-3), var(--coze-red-3-alpha))
}

.coz-button.semi-button.coz-btn-green {
    color: rgba(var(--coze-fg-7), 1);
    background-color: rgba(var(--coze-green-5), 1)
}

.coz-button.semi-button.coz-btn-green.semi-button-primary:not(:-webkit-any(.semi-button-borderless, .semi-button-light)):hover {
    background-color: rgba(var(--coze-green-6), 1)
}

.coz-button.semi-button.coz-btn-green.semi-button-primary:not(:-moz-any(.semi-button-borderless, .semi-button-light)):hover {
    background-color: rgba(var(--coze-green-6), 1)
}

.coz-button.semi-button.coz-btn-green.semi-button-primary:not(:is(.semi-button-borderless, .semi-button-light)):hover {
    background-color: rgba(var(--coze-green-6), 1)
}

.coz-button.semi-button.coz-btn-green.semi-button-primary:not(:-webkit-any(.semi-button-borderless, .semi-button-light)):active {
    background-color: rgba(var(--coze-green-7), 1)
}

.coz-button.semi-button.coz-btn-green.semi-button-primary:not(:-moz-any(.semi-button-borderless, .semi-button-light)):active {
    background-color: rgba(var(--coze-green-7), 1)
}

.coz-button.semi-button.coz-btn-green.semi-button-primary:not(:is(.semi-button-borderless, .semi-button-light)):active {
    background-color: rgba(var(--coze-green-7), 1)
}

.coz-button.semi-button.coz-btn-green:disabled {
    color: rgba(var(--coze-fg-white), var(--coze-fg-white-alpha));
    background-color: rgba(var(--coze-green-3), var(--coze-green-3-alpha))
}

.coz-button.semi-button.coz-btn-green:disabled:hover,
.coz-button.semi-button.coz-btn-green:disabled:active {
    color: rgba(var(--coze-fg-white), var(--coze-fg-white-alpha))
}

.coz-button.semi-button.coz-btn-ai-plus {
    color: rgba(var(--coze-fg-5), var(--coze-fg-5-alpha));
    background: linear-gradient(90deg, rgba(var(--coze-brand-5), 1)0%, rgba(var(--coze-purple-5), 1)100%)
}

.coz-button.semi-button.coz-btn-ai-plus.semi-button-primary:not(:-webkit-any(.semi-button-borderless, .semi-button-light)):hover {
    background: linear-gradient(90deg, rgba(var(--coze-brand-6), 1)0%, rgba(var(--coze-purple-6), 1)100%)
}

.coz-button.semi-button.coz-btn-ai-plus.semi-button-primary:not(:-moz-any(.semi-button-borderless, .semi-button-light)):hover {
    background: linear-gradient(90deg, rgba(var(--coze-brand-6), 1)0%, rgba(var(--coze-purple-6), 1)100%)
}

.coz-button.semi-button.coz-btn-ai-plus.semi-button-primary:not(:is(.semi-button-borderless, .semi-button-light)):hover {
    background: linear-gradient(90deg, rgba(var(--coze-brand-6), 1)0%, rgba(var(--coze-purple-6), 1)100%)
}

.coz-button.semi-button.coz-btn-ai-plus.semi-button-primary:not(:-webkit-any(.semi-button-borderless, .semi-button-light)):active {
    background: linear-gradient(90deg, rgba(var(--coze-brand-7), 1)0%, rgba(var(--coze-purple-7), 1)100%)
}

.coz-button.semi-button.coz-btn-ai-plus.semi-button-primary:not(:-moz-any(.semi-button-borderless, .semi-button-light)):active {
    background: linear-gradient(90deg, rgba(var(--coze-brand-7), 1)0%, rgba(var(--coze-purple-7), 1)100%)
}

.coz-button.semi-button.coz-btn-ai-plus.semi-button-primary:not(:is(.semi-button-borderless, .semi-button-light)):active {
    background: linear-gradient(90deg, rgba(var(--coze-brand-7), 1)0%, rgba(var(--coze-purple-7), 1)100%)
}

.coz-button.semi-button.coz-btn-ai-plus:disabled {
    color: rgba(var(--coze-fg-5), var(--coze-fg-5-alpha));
    background: linear-gradient(90deg, rgba(var(--coze-brand-3), var(--coze-brand-3-alpha))0%, rgba(var(--coze-purple-3), var(--coze-purple-3-alpha))100%)
}

.coz-button.semi-button.coz-btn-ai-plus:disabled:hover,
.coz-button.semi-button.coz-btn-ai-plus:disabled:active {
    color: rgba(var(--coze-fg-5), var(--coze-fg-5-alpha))
}

.coz-button.semi-button.coz-btn-ai-hglt,
.coz-button.semi-button.coz-btn-ai-primary {
    background: linear-gradient(90deg, rgba(var(--coze-brand-1), var(--coze-brand-1-alpha))0%, rgba(var(--coze-purple-1), var(--coze-purple-1-alpha))100%)
}

.coz-button.semi-button.coz-btn-ai-hglt.semi-button-primary:not(:-webkit-any(.semi-button-borderless, .semi-button-light)):hover,
.coz-button.semi-button.coz-btn-ai-primary.semi-button-primary:not(:-webkit-any(.semi-button-borderless, .semi-button-light)):hover {
    background: linear-gradient(90deg, rgba(var(--coze-brand-2), var(--coze-brand-2-alpha))0%, rgba(var(--coze-purple-2), var(--coze-purple-2-alpha))100%)
}

.coz-button.semi-button.coz-btn-ai-hglt.semi-button-primary:not(:-moz-any(.semi-button-borderless, .semi-button-light)):hover,
.coz-button.semi-button.coz-btn-ai-primary.semi-button-primary:not(:-moz-any(.semi-button-borderless, .semi-button-light)):hover {
    background: linear-gradient(90deg, rgba(var(--coze-brand-2), var(--coze-brand-2-alpha))0%, rgba(var(--coze-purple-2), var(--coze-purple-2-alpha))100%)
}

.coz-button.semi-button.coz-btn-ai-hglt.semi-button-primary:not(:is(.semi-button-borderless, .semi-button-light)):hover,
.coz-button.semi-button.coz-btn-ai-primary.semi-button-primary:not(:is(.semi-button-borderless, .semi-button-light)):hover {
    background: linear-gradient(90deg, rgba(var(--coze-brand-2), var(--coze-brand-2-alpha))0%, rgba(var(--coze-purple-2), var(--coze-purple-2-alpha))100%)
}

.coz-button.semi-button.coz-btn-ai-hglt.semi-button-primary:not(:-webkit-any(.semi-button-borderless, .semi-button-light)):active,
.coz-button.semi-button.coz-btn-ai-primary.semi-button-primary:not(:-webkit-any(.semi-button-borderless, .semi-button-light)):active {
    background: linear-gradient(90deg, rgba(var(--coze-brand-3), var(--coze-brand-3-alpha))0%, rgba(var(--coze-purple-3), var(--coze-purple-3-alpha))100%)
}

.coz-button.semi-button.coz-btn-ai-hglt.semi-button-primary:not(:-moz-any(.semi-button-borderless, .semi-button-light)):active,
.coz-button.semi-button.coz-btn-ai-primary.semi-button-primary:not(:-moz-any(.semi-button-borderless, .semi-button-light)):active {
    background: linear-gradient(90deg, rgba(var(--coze-brand-3), var(--coze-brand-3-alpha))0%, rgba(var(--coze-purple-3), var(--coze-purple-3-alpha))100%)
}

.coz-button.semi-button.coz-btn-ai-hglt.semi-button-primary:not(:is(.semi-button-borderless, .semi-button-light)):active,
.coz-button.semi-button.coz-btn-ai-primary.semi-button-primary:not(:is(.semi-button-borderless, .semi-button-light)):active {
    background: linear-gradient(90deg, rgba(var(--coze-brand-3), var(--coze-brand-3-alpha))0%, rgba(var(--coze-purple-3), var(--coze-purple-3-alpha))100%)
}

.coz-button.semi-button.coz-btn-ai-hglt .coz-ai-button-text,
.coz-button.semi-button.coz-btn-ai-primary .coz-ai-button-text {
    background: linear-gradient(90deg, rgba(var(--coze-brand-5), 1)0%, rgba(var(--coze-purple-5), 1)100%);
    -webkit-text-fill-color: transparent;
    -webkit-background-clip: text;
    background-clip: text
}

.coz-button.semi-button.coz-btn-ai-hglt:disabled,
.coz-button.semi-button.coz-btn-ai-primary:disabled {
    color: rgba(var(--coze-brand-3), var(--coze-brand-3-alpha));
    background: linear-gradient(90deg, rgba(var(--coze-brand-1), var(--coze-brand-1-alpha))0%, rgba(var(--coze-purple-1), var(--coze-purple-1-alpha))100%)
}

.coz-button.semi-button.coz-btn-ai-hglt:disabled:hover,
.coz-button.semi-button.coz-btn-ai-primary:disabled:hover,
.coz-button.semi-button.coz-btn-ai-hglt:disabled:active,
.coz-button.semi-button.coz-btn-ai-primary:disabled:active {
    color: rgba(var(--coze-brand-3), var(--coze-brand-3-alpha))
}

.coz-button.semi-button.coz-btn-ai-hglt:disabled .coz-ai-button-text,
.coz-button.semi-button.coz-btn-ai-primary:disabled .coz-ai-button-text {
    background: linear-gradient(90deg, rgba(var(--coze-brand-3), var(--coze-brand-3-alpha))0%, rgba(var(--coze-purple-3), var(--coze-purple-3-alpha))100%);
    -webkit-text-fill-color: transparent;
    -webkit-background-clip: text;
    background-clip: text
}

.coz-button.semi-button.coz-btn-ai-primary,
.coz-button.semi-button.coz-btn-ai-primary:disabled {
    background: 0 0
}

.coz-button.semi-button .coz-btn-loading {
    animation: .6s linear infinite forwards semi-animation-rotate
}

.coz-button.coz-btn-large {
    height: var(--coze-40);
    min-width: var(--coze-40);
    padding-left: var(--coze-20);
    padding-right: var(--coze-20);
    padding-top: var(--coze-9);
    padding-bottom: var(--coze-9);
    font-size: var(--coze-16);
    border-radius: var(--coze-10);
    border-width: 0
}

.coz-button.coz-btn-large.semi-button-with-icon-only {
    width: var(--coze-40)
}

.coz-button.coz-btn-large .semi-button-content-left {
    margin-right: var(--coze-8)
}

.coz-button.coz-btn-large .semi-button-content-right {
    margin-left: var(--coze-8)
}

.coz-button.coz-btn-default {
    height: var(--coze-32);
    min-width: var(--coze-32);
    padding-left: var(--coze-16);
    padding-right: var(--coze-16);
    padding-top: var(--coze-6);
    padding-bottom: var(--coze-6);
    font-size: var(--coze-14);
    border-radius: var(--coze-8);
    border-width: 0
}

.coz-button.coz-btn-default.semi-button-with-icon-only {
    width: var(--coze-32)
}

.coz-button.coz-btn-default .semi-button-content-left {
    margin-right: var(--coze-6)
}

.coz-button.coz-btn-default .semi-button-content-right {
    margin-left: var(--coze-8)
}

.coz-button.coz-btn-small {
    height: var(--coze-24);
    min-width: var(--coze-24);
    padding-left: var(--coze-8);
    padding-right: var(--coze-8);
    padding-top: var(--coze-4);
    padding-bottom: var(--coze-4);
    font-size: var(--coze-12);
    border-radius: var(--coze-5);
    border-width: 0
}

.coz-button.coz-btn-small.semi-button-with-icon-only {
    width: var(--coze-24)
}

.coz-button.coz-btn-small .semi-button-content-left {
    margin-right: var(--coze-4)
}

.coz-button.coz-btn-small .semi-button-content-right {
    margin-left: var(--coze-4)
}

.coz-button.coz-btn-mini {
    height: var(--coze-16);
    min-width: var(--coze-16);
    padding-left: var(--coze-5);
    padding-right: var(--coze-5);
    font-size: var(--coze-12);
    border-radius: var(--coze-4);
    border-width: 0;
    padding-top: 0;
    padding-bottom: 0;
    font-weight: 400
}

.coz-button.coz-btn-mini.semi-button-with-icon-only {
    width: var(--coze-16)
}

.coz-button.coz-btn-mini .semi-button-content-left {
    margin-right: var(--coze-2)
}

.coz-button.coz-btn-mini .semi-button-content-right {
    margin-left: var(--coze-2)
}

.coz-icon-button.coz-icon-button-large .semi-button-with-icon-only {
    padding: 11px
}

.coz-icon-button.coz-icon-button-large .semi-button-content-left {
    margin-right: var(--coze-8)
}

.coz-icon-button.coz-icon-button-large .semi-button-content-right {
    margin-left: var(--coze-8)
}

.coz-icon-button.coz-icon-button-default .semi-button-with-icon-only {
    padding: var(--coze-8)
}

.coz-icon-button.coz-icon-button-default .semi-button-content-left {
    margin-right: var(--coze-6)
}

.coz-icon-button.coz-icon-button-default .semi-button-content-right {
    margin-left: var(--coze-6)
}

.coz-icon-button.coz-icon-button-small .semi-button-with-icon-only {
    padding: var(--coze-5)
}

.coz-icon-button.coz-icon-button-small .semi-button-content-left {
    margin-right: var(--coze-4)
}

.coz-icon-button.coz-icon-button-small .semi-button-content-right {
    margin-left: var(--coze-4)
}

.coz-icon-button.coz-icon-button-mini .semi-button-with-icon-only {
    padding: var(--coze-2)
}

.coz-icon-button.coz-icon-button-mini .semi-button-content-left {
    margin-right: var(--coze-2)
}

.coz-icon-button.coz-icon-button-mini .semi-button-content-right {
    margin-left: var(--coze-2)
}

.coz-split-button {
    align-items: flex-start;
    display: inline-flex
}

.coz-btn-large .coz-badge-layout {
    margin-left: 11px;
    margin-right: -3px
}

.coz-btn-default .coz-badge-layout {
    margin-left: 9px;
    margin-right: -3px
}

.coz-btn-small .coz-badge-layout {
    margin-left: 7px;
    margin-right: -1px
}

.coz-btn-brand .coz-badge-layout {
    color: rgba(var(--coze-fg-5), var(--coze-fg-5-alpha))
}

.coz-badge.semi-badge.coz-badge-mini.coz-btn-badge-brand .semi-badge-dot,
.coz-badge.semi-badge.coz-badge-mini.coz-btn-badge-hgltplus .semi-badge-dot {
    background-color: rgba(var(--coze-fg-5), var(--coze-fg-5-alpha))
}

.coz-badge.semi-badge.coz-badge-mini.coz-btn-badge-highlight .semi-badge-dot {
    background-color: rgba(var(--coze-brand-5), 1)
}

.coz-badge.semi-badge.coz-badge-mini.coz-btn-badge-primary .semi-badge-dot,
.coz-badge.semi-badge.coz-badge-mini.coz-btn-badge-secondary .semi-badge-dot {
    background-color: rgba(var(--coze-fg-3), var(--coze-fg-3-alpha))
}

.coz-badge.semi-badge.coz-badge-mini.coz-btn-badge-yellow .semi-badge-dot,
.coz-badge.semi-badge.coz-badge-mini.coz-btn-badge-red .semi-badge-dot,
.coz-badge.semi-badge.coz-badge-mini.coz-btn-badge-green .semi-badge-dot {
    background-color: rgba(var(--coze-fg-7), 1)
}

.coz-badge .coz-icon-button+.semi-badge-rightTop:not(.semi-badge-dot) {
    transform: translate(50%, -50%)
}

.coz-icon-button-large+.semi-badge-rightTop {
    top: 2.93px;
    right: 2.93px
}

.coz-icon-button-large.coz-icon-button-secondary+.semi-badge-rightTop {
    top: 10px;
    right: 10px
}

.coz-icon-button-default+.semi-badge-rightTop {
    top: 2.3px;
    right: 2.3px
}

.coz-icon-button-default.coz-icon-button-secondary+.semi-badge-rightTop {
    top: 7px;
    right: 7px
}

.coz-icon-button-small+.semi-badge-rightTop {
    top: 1.76px;
    right: 1.76px
}

.coz-icon-button-small.coz-icon-button-secondary+.semi-badge-rightTop {
    top: 4px;
    right: 4px
}


.coz-badge {
    display: inline-flex
}

.coz-badge .semi-badge-rightTop:not(.semi-badge-dot) {
    transform: translate(8px, -8px)
}

.coz-badge.coz-badge-default .semi-badge-count {
    height: var(--coze-16);
    min-width: var(--coze-16);
    font-size: var(--coze-12);
    font-weight: 500;
    line-height: var(--coze-16);
    color: rgba(var(--coze-fg-7), 1);
    background-color: rgba(var(--coze-red-5), 1);
    border-width: 0
}

.coz-badge.coz-badge-mini .semi-badge-primary.semi-badge-solid {
    height: var(--coze-6);
    width: var(--coze-6);
    background-color: rgba(var(--coze-red-5), 1);
    border-width: 0;
    border-color: rgba(var(--coze-stroke-5), var(--coze-stroke-5-alpha))
}

.coz-badge.coz-badge-alt .semi-badge-count {
    height: var(--coze-16);
    min-width: var(--coze-16);
    font-size: var(--coze-12);
    font-weight: 500;
    line-height: var(--coze-16);
    color: rgba(var(--coze-fg-5), var(--coze-fg-5-alpha));
    background-color: rgba(var(--coze-brand-5), 1);
    border-width: 0;
    border-color: rgba(var(--coze-stroke-5), var(--coze-stroke-5-alpha))
}


.coz-tooltip.semi-tooltip-wrapper {
    --tw-shadow: 0 4px 12px 0px rgba(var(--coze-shadow-0), .08), 0px 8px 24px 0px rgba(var(--coze-shadow-0), .04);
    --tw-shadow-colored: 0 4px 12px 0px var(--tw-shadow-color), 0px 8px 24px 0px var(--tw-shadow-color);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 transparent), var(--tw-ring-shadow, 0 0 transparent), var(--tw-shadow);
    color: rgba(var(--coze-fg-3), var(--coze-fg-3-alpha));
    background-color: rgba(var(--coze-bg-3), var(--coze-bg-3-alpha));
    min-width: 36px
}

.coz-tooltip.semi-tooltip-wrapper .semi-tooltip-icon-arrow {
    color: rgba(var(--coze-bg-3), var(--coze-bg-3-alpha))
}

.coz-tooltip.semi-tooltip-wrapper .semi-tooltip-content {
    font-size: var(--coze-14);
    font-weight: 500
}

.coz-tooltip.coz-tooltip-dark.semi-tooltip-wrapper {
    background-color: rgb(var(--black-5));
    color: rgb(var(--white-1));
    --tw-shadow: 0 4px 12px 0px rgba(var(--coze-shadow-0), .08), 0px 8px 24px 0px rgba(var(--coze-shadow-0), .04);
    --tw-shadow-colored: 0 4px 12px 0px var(--tw-shadow-color), 0px 8px 24px 0px var(--tw-shadow-color);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 transparent), var(--tw-ring-shadow, 0 0 transparent), var(--tw-shadow)
}

.coz-tooltip.coz-tooltip-dark.semi-tooltip-wrapper .semi-tooltip-icon-arrow {
    color: rgb(var(--black-5))
}


.coz-popover.semi-popover-wrapper {
    max-width: 800px;
    padding: var(--coze-4);
    box-shadow: 0px 8px 24px 0px rgba(var(--coze-shadow-0), .16), 0px 16px 48px 0px rgba(var(--coze-shadow-0), .08)
}

.coz-popover.semi-popover-with-arrow {
    border-width: var(--coze-1);
    border-color: rgba(var(--coze-stroke-5), var(--coze-stroke-5-alpha));
    background-color: rgba(var(--coze-bg-3), var(--coze-bg-3-alpha));
    padding: var(--coze-16)
}

.coz-popover .semi-popover-icon-arrow {
    color: rgba(var(--coze-bg-3), var(--coze-bg-3-alpha));
    -webkit-filter: drop-shadow(1px 5px 3px rgba(0, 0, 0, .1));
    filter: drop-shadow(1px 5px 3px rgba(0, 0, 0, .1))
}


.coz-typography.semi-typography.coz-title {
    font-weight: 500
}

.coz-typography.semi-typography.coz-title.coz-title-28 {
    font-size: var(--coze-28);
    line-height: var(--coze-36)
}

.coz-typography.semi-typography.coz-title.coz-title-20 {
    font-size: var(--coze-20);
    line-height: var(--coze-28)
}

.coz-typography.semi-typography.coz-title.coz-title-16 {
    font-size: var(--coze-16);
    line-height: var(--coze-22)
}

.coz-typography.semi-typography.coz-title.coz-title-14 {
    font-size: var(--coze-14);
    line-height: var(--coze-20)
}

.coz-typography.semi-typography.coz-title.coz-title-12 {
    font-size: var(--coze-12);
    line-height: var(--coze-16)
}

.coz-typography.semi-typography.coz-text {
    font-weight: 400
}

.coz-typography.semi-typography.coz-text.coz-text-16 {
    font-size: var(--coze-16);
    line-height: var(--coze-28)
}

.coz-typography.semi-typography.coz-text.coz-text-14 {
    font-size: var(--coze-14);
    line-height: var(--coze-20)
}

.coz-typography.semi-typography.coz-text.coz-text-12 {
    font-size: var(--coze-12);
    line-height: var(--coze-16)
}

.coz-typography.semi-typography.coz-text.coz-text-10 {
    font-size: var(--coze-10);
    line-height: var(--coze-14)
}

.coz-typography.semi-typography.coz-paragraph {
    font-weight: 400
}

.coz-typography.semi-typography.coz-paragraph.coz-paragraph-16 {
    font-size: var(--coze-16);
    line-height: var(--coze-28)
}

.coz-typography.semi-typography.coz-paragraph.coz-paragraph-14 {
    font-size: var(--coze-14);
    line-height: var(--coze-20)
}

.coz-typography.semi-typography.coz-paragraph.coz-paragraph-12 {
    font-size: var(--coze-12);
    line-height: var(--coze-16)
}

.coz-typography.semi-typography .semi-typography-ellipsis-expand {
    color: rgba(var(--coze-brand-5), 1)
}


.playground-sub-menu-APnOTK .semi-collapse-header {
    margin: 2px 0;
    padding: 6px 8px 6px 0;
    font-weight: 400;
    line-height: 20px
}

@media (hover:hover) {
    .playground-sub-menu-APnOTK .semi-collapse-header:hover {
        background-color: rgba(var(--coze-bg-5), var(--coze-bg-5-alpha))
    }
}

.playground-sub-menu-APnOTK .semi-collapse-header {
    color: rgba(var(--coze-fg-2), var(--coze-fg-2-alpha))
}

.playground-sub-menu-APnOTK .collapse-header-active>.semi-collapse-header {
    color: rgba(var(--coze-fg-3), var(--coze-fg-3-alpha))
}

.playground-sub-menu-APnOTK .semi-collapse-item {
    border: none
}

.playground-sub-menu-APnOTK .semi-collapse-item:has(a.active)>.semi-collapse-header {
    color: rgba(var(--coze-fg-3), var(--coze-fg-3-alpha));
    font-weight: 500
}

.playground-sub-menu-APnOTK .semi-collapse-content {
    padding: 0
}

.playground-sub-menu-APnOTK .semi-collapse-header-icon {
    width: 12px;
    height: 12px;
    color: rgba(var(--coze-fg-2), var(--coze-fg-2-alpha));
    margin-top: -4px
}

.playground-sub-menu-APnOTK .semi-collapse {
    flex-direction: column;
    row-gap: 2px;
    display: flex
}


@layer base {
    body {
        --red-1: 255, 236, 232;
        --red-2: 253, 205, 197;
        --red-3: 251, 172, 163;
        --red-4: 249, 137, 129;
        --red-5: 247, 101, 96;
        --red-6: 245, 63, 63;
        --red-7: 203, 39, 45;
        --red-8: 161, 21, 30;
        --red-9: 119, 8, 19;
        --red-10: 77, 0, 10;
        --orangered-1: 255, 243, 232;
        --orangered-2: 253, 221, 195;
        --orangered-3: 252, 197, 159;
        --orangered-4: 250, 172, 123;
        --orangered-5: 249, 144, 87;
        --orangered-6: 247, 114, 52;
        --orangered-7: 204, 81, 32;
        --orangered-8: 162, 53, 17;
        --orangered-9: 119, 31, 6;
        --orangered-10: 77, 14, 0;
        --orange-1: 255, 247, 232;
        --orange-2: 255, 228, 186;
        --orange-3: 255, 207, 139;
        --orange-4: 255, 182, 93;
        --orange-5: 255, 154, 46;
        --orange-6: 255, 125, 0;
        --orange-7: 210, 95, 0;
        --orange-8: 166, 69, 0;
        --orange-9: 121, 46, 0;
        --orange-10: 77, 27, 0;
        --gold-1: 255, 252, 232;
        --gold-2: 253, 244, 191;
        --gold-3: 252, 233, 150;
        --gold-4: 250, 220, 109;
        --gold-5: 249, 204, 69;
        --gold-6: 247, 186, 30;
        --gold-7: 204, 146, 19;
        --gold-8: 162, 109, 10;
        --gold-9: 119, 75, 4;
        --gold-10: 77, 45, 0;
        --yellow-1: 254, 255, 232;
        --yellow-2: 254, 254, 190;
        --yellow-3: 253, 250, 148;
        --yellow-4: 252, 242, 107;
        --yellow-5: 251, 232, 66;
        --yellow-6: 250, 220, 25;
        --yellow-7: 207, 175, 15;
        --yellow-8: 163, 132, 8;
        --yellow-9: 120, 93, 3;
        --yellow-10: 77, 56, 0;
        --lime-1: 252, 255, 232;
        --lime-2: 237, 248, 187;
        --lime-3: 220, 241, 144;
        --lime-4: 201, 233, 104;
        --lime-5: 181, 226, 65;
        --lime-6: 159, 219, 29;
        --lime-7: 126, 183, 18;
        --lime-8: 95, 148, 10;
        --lime-9: 67, 112, 4;
        --lime-10: 42, 77, 0;
        --green-1: 232, 255, 234;
        --green-2: 175, 240, 181;
        --green-3: 123, 225, 136;
        --green-4: 76, 210, 99;
        --green-5: 35, 195, 67;
        --green-6: 0, 180, 42;
        --green-7: 0, 154, 41;
        --green-8: 0, 128, 38;
        --green-9: 0, 102, 34;
        --green-10: 0, 77, 28;
        --cyan-1: 232, 255, 251;
        --cyan-2: 183, 244, 236;
        --cyan-3: 137, 233, 224;
        --cyan-4: 94, 223, 214;
        --cyan-5: 55, 212, 207;
        --cyan-6: 20, 201, 201;
        --cyan-7: 13, 165, 170;
        --cyan-8: 7, 130, 139;
        --cyan-9: 3, 97, 108;
        --cyan-10: 0, 66, 77;
        --blue-1: 232, 247, 255;
        --blue-2: 195, 231, 254;
        --blue-3: 159, 212, 253;
        --blue-4: 123, 192, 252;
        --blue-5: 87, 169, 251;
        --blue-6: 52, 145, 250;
        --blue-7: 32, 108, 207;
        --blue-8: 17, 75, 163;
        --blue-9: 6, 48, 120;
        --blue-10: 0, 26, 77;
        --arcoblue-1: 232, 243, 255;
        --arcoblue-2: 190, 218, 255;
        --arcoblue-3: 148, 191, 255;
        --arcoblue-4: 106, 161, 255;
        --arcoblue-5: 64, 128, 255;
        --arcoblue-6: 22, 93, 255;
        --arcoblue-7: 14, 66, 210;
        --arcoblue-8: 7, 44, 166;
        --arcoblue-9: 3, 26, 121;
        --arcoblue-10: 0, 13, 77;
        --purple-1: 245, 232, 255;
        --purple-2: 221, 190, 246;
        --purple-3: 195, 150, 237;
        --purple-4: 168, 113, 227;
        --purple-5: 141, 78, 218;
        --purple-6: 114, 46, 209;
        --purple-7: 85, 29, 176;
        --purple-8: 60, 16, 143;
        --purple-9: 39, 6, 110;
        --purple-10: 22, 0, 77;
        --pinkpurple-1: 255, 232, 251;
        --pinkpurple-2: 247, 186, 239;
        --pinkpurple-3: 240, 142, 230;
        --pinkpurple-4: 232, 101, 223;
        --pinkpurple-5: 225, 62, 219;
        --pinkpurple-6: 217, 26, 217;
        --pinkpurple-7: 176, 16, 182;
        --pinkpurple-8: 138, 9, 147;
        --pinkpurple-9: 101, 3, 112;
        --pinkpurple-10: 66, 0, 77;
        --magenta-1: 255, 232, 241;
        --magenta-2: 253, 194, 219;
        --magenta-3: 251, 157, 199;
        --magenta-4: 249, 121, 183;
        --magenta-5: 247, 84, 168;
        --magenta-6: 245, 49, 157;
        --magenta-7: 203, 30, 131;
        --magenta-8: 161, 16, 105;
        --magenta-9: 119, 6, 79;
        --magenta-10: 77, 0, 52;
        --gray-1: 247, 248, 250;
        --gray-2: 242, 243, 245;
        --gray-3: 229, 230, 235;
        --gray-4: 201, 205, 212;
        --gray-5: 169, 174, 184;
        --gray-6: 134, 144, 156;
        --gray-7: 107, 119, 133;
        --gray-8: 78, 89, 105;
        --gray-9: 39, 46, 59;
        --gray-10: 29, 33, 41;
        --success-1: var(--green-1);
        --success-2: var(--green-2);
        --success-3: var(--green-3);
        --success-4: var(--green-4);
        --success-5: var(--green-5);
        --success-6: var(--green-6);
        --success-7: var(--green-7);
        --success-8: var(--green-8);
        --success-9: var(--green-9);
        --success-10: var(--green-10);
        --primary-1: var(--arcoblue-1);
        --primary-2: var(--arcoblue-2);
        --primary-3: var(--arcoblue-3);
        --primary-4: var(--arcoblue-4);
        --primary-5: var(--arcoblue-5);
        --primary-6: var(--arcoblue-6);
        --primary-7: var(--arcoblue-7);
        --primary-8: var(--arcoblue-8);
        --primary-9: var(--arcoblue-9);
        --primary-10: var(--arcoblue-10);
        --danger-1: var(--red-1);
        --danger-2: var(--red-2);
        --danger-3: var(--red-3);
        --danger-4: var(--red-4);
        --danger-5: var(--red-5);
        --danger-6: var(--red-6);
        --danger-7: var(--red-7);
        --danger-8: var(--red-8);
        --danger-9: var(--red-9);
        --danger-10: var(--red-10);
        --warning-1: var(--orange-1);
        --warning-2: var(--orange-2);
        --warning-3: var(--orange-3);
        --warning-4: var(--orange-4);
        --warning-5: var(--orange-5);
        --warning-6: var(--orange-6);
        --warning-7: var(--orange-7);
        --warning-8: var(--orange-8);
        --warning-9: var(--orange-9);
        --warning-10: var(--orange-10);
        --link-1: var(--arcoblue-1);
        --link-2: var(--arcoblue-2);
        --link-3: var(--arcoblue-3);
        --link-4: var(--arcoblue-4);
        --link-5: var(--arcoblue-5);
        --link-6: var(--arcoblue-6);
        --link-7: var(--arcoblue-7);
        --link-8: var(--arcoblue-8);
        --link-9: var(--arcoblue-9);
        --link-10: var(--arcoblue-10);
        --data-1: var(--arcoblue-5);
        --data-2: var(--arcoblue-2);
        --data-3: 85, 197, 253;
        --data-4: 156, 220, 252;
        --data-5: var(--orange-6);
        --data-6: var(--orange-3);
        --data-7: var(--green-4);
        --data-8: var(--green-2);
        --data-9: var(--purple-4);
        --data-10: var(--purple-2);
        --data-11: var(--gold-6);
        --data-12: var(--gold-4);
        --data-13: var(--lime-6);
        --data-14: var(--lime-4);
        --data-15: var(--magenta-4);
        --data-16: var(--magenta-3);
        --data-17: var(--cyan-6);
        --data-18: var(--cyan-3);
        --data-19: var(--pinkpurple-4);
        --data-20: var(--pinkpurple-2)
    }

    body[arco-theme=dark] {
        --red-1: 77, 0, 10;
        --red-2: 119, 6, 17;
        --red-3: 161, 22, 31;
        --red-4: 203, 46, 52;
        --red-5: 245, 78, 78;
        --red-6: 247, 105, 101;
        --red-7: 249, 141, 134;
        --red-8: 251, 176, 167;
        --red-9: 253, 209, 202;
        --red-10: 255, 240, 236;
        --orangered-1: 77, 14, 0;
        --orangered-2: 119, 30, 5;
        --orangered-3: 162, 55, 20;
        --orangered-4: 204, 87, 41;
        --orangered-5: 247, 126, 69;
        --orangered-6: 249, 146, 90;
        --orangered-7: 250, 173, 125;
        --orangered-8: 252, 198, 161;
        --orangered-9: 253, 222, 197;
        --orangered-10: 255, 244, 235;
        --orange-1: 77, 27, 0;
        --orange-2: 121, 48, 4;
        --orange-3: 166, 75, 10;
        --orange-4: 210, 105, 19;
        --orange-5: 255, 141, 31;
        --orange-6: 255, 150, 38;
        --orange-7: 255, 179, 87;
        --orange-8: 255, 205, 135;
        --orange-9: 255, 227, 184;
        --orange-10: 255, 247, 232;
        --gold-1: 77, 45, 0;
        --gold-2: 119, 75, 4;
        --gold-3: 162, 111, 15;
        --gold-4: 204, 150, 31;
        --gold-5: 247, 192, 52;
        --gold-6: 249, 204, 68;
        --gold-7: 250, 220, 108;
        --gold-8: 252, 233, 149;
        --gold-9: 253, 244, 190;
        --gold-10: 255, 252, 232;
        --yellow-1: 77, 56, 0;
        --yellow-2: 120, 94, 7;
        --yellow-3: 163, 134, 20;
        --yellow-4: 207, 179, 37;
        --yellow-5: 250, 225, 60;
        --yellow-6: 251, 233, 75;
        --yellow-7: 252, 243, 116;
        --yellow-8: 253, 250, 157;
        --yellow-9: 254, 254, 198;
        --yellow-10: 254, 255, 240;
        --lime-1: 42, 77, 0;
        --lime-2: 68, 112, 6;
        --lime-3: 98, 148, 18;
        --lime-4: 132, 183, 35;
        --lime-5: 168, 219, 57;
        --lime-6: 184, 226, 75;
        --lime-7: 203, 233, 112;
        --lime-8: 222, 241, 152;
        --lime-9: 238, 248, 194;
        --lime-10: 253, 255, 238;
        --green-1: 0, 77, 28;
        --green-2: 4, 102, 37;
        --green-3: 10, 128, 45;
        --green-4: 18, 154, 55;
        --green-5: 29, 180, 64;
        --green-6: 39, 195, 70;
        --green-7: 80, 210, 102;
        --green-8: 126, 225, 139;
        --green-9: 178, 240, 183;
        --green-10: 235, 255, 236;
        --cyan-1: 0, 66, 77;
        --cyan-2: 6, 97, 108;
        --cyan-3: 17, 131, 139;
        --cyan-4: 31, 166, 170;
        --cyan-5: 48, 201, 201;
        --cyan-6: 63, 212, 207;
        --cyan-7: 102, 223, 215;
        --cyan-8: 144, 233, 225;
        --cyan-9: 190, 244, 237;
        --cyan-10: 240, 255, 252;
        --blue-1: 0, 26, 77;
        --blue-2: 5, 47, 120;
        --blue-3: 19, 76, 163;
        --blue-4: 41, 113, 207;
        --blue-5: 70, 154, 250;
        --blue-6: 90, 170, 251;
        --blue-7: 125, 193, 252;
        --blue-8: 161, 213, 253;
        --blue-9: 198, 232, 254;
        --blue-10: 234, 248, 255;
        --arcoblue-1: 0, 13, 77;
        --arcoblue-2: 4, 27, 121;
        --arcoblue-3: 14, 50, 166;
        --arcoblue-4: 29, 77, 210;
        --arcoblue-5: 48, 111, 255;
        --arcoblue-6: 60, 126, 255;
        --arcoblue-7: 104, 159, 255;
        --arcoblue-8: 147, 190, 255;
        --arcoblue-9: 190, 218, 255;
        --arcoblue-10: 234, 244, 255;
        --purple-1: 22, 0, 77;
        --purple-2: 39, 6, 110;
        --purple-3: 62, 19, 143;
        --purple-4: 90, 37, 176;
        --purple-5: 123, 61, 209;
        --purple-6: 142, 81, 218;
        --purple-7: 169, 116, 227;
        --purple-8: 197, 154, 237;
        --purple-9: 223, 194, 246;
        --purple-10: 247, 237, 255;
        --pinkpurple-1: 66, 0, 77;
        --pinkpurple-2: 101, 3, 112;
        --pinkpurple-3: 138, 13, 147;
        --pinkpurple-4: 176, 27, 182;
        --pinkpurple-5: 217, 46, 217;
        --pinkpurple-6: 225, 61, 219;
        --pinkpurple-7: 232, 102, 223;
        --pinkpurple-8: 240, 146, 230;
        --pinkpurple-9: 247, 193, 240;
        --pinkpurple-10: 255, 242, 253;
        --magenta-1: 77, 0, 52;
        --magenta-2: 119, 8, 80;
        --magenta-3: 161, 23, 108;
        --magenta-4: 203, 43, 136;
        --magenta-5: 245, 69, 166;
        --magenta-6: 247, 86, 169;
        --magenta-7: 249, 122, 184;
        --magenta-8: 251, 158, 200;
        --magenta-9: 253, 195, 219;
        --magenta-10: 255, 232, 241;
        --gray-1: 23, 23, 26;
        --gray-2: 46, 46, 48;
        --gray-3: 72, 72, 73;
        --gray-4: 95, 95, 96;
        --gray-5: 120, 120, 122;
        --gray-6: 146, 146, 147;
        --gray-7: 171, 171, 172;
        --gray-8: 197, 197, 197;
        --gray-9: 223, 223, 223;
        --gray-10: 246, 246, 246;
        --primary-1: var(--arcoblue-1);
        --primary-2: var(--arcoblue-2);
        --primary-3: var(--arcoblue-3);
        --primary-4: var(--arcoblue-4);
        --primary-5: var(--arcoblue-5);
        --primary-6: var(--arcoblue-6);
        --primary-7: var(--arcoblue-7);
        --primary-8: var(--arcoblue-8);
        --primary-9: var(--arcoblue-9);
        --primary-10: var(--arcoblue-10);
        --success-1: var(--green-1);
        --success-2: var(--green-2);
        --success-3: var(--green-3);
        --success-4: var(--green-4);
        --success-5: var(--green-5);
        --success-6: var(--green-6);
        --success-7: var(--green-7);
        --success-8: var(--green-8);
        --success-9: var(--green-9);
        --success-10: var(--green-10);
        --danger-1: var(--red-1);
        --danger-2: var(--red-2);
        --danger-3: var(--red-3);
        --danger-4: var(--red-4);
        --danger-5: var(--red-5);
        --danger-6: var(--red-6);
        --danger-7: var(--red-7);
        --danger-8: var(--red-8);
        --danger-9: var(--red-9);
        --danger-10: var(--red-10);
        --warning-1: var(--orange-1);
        --warning-2: var(--orange-2);
        --warning-3: var(--orange-3);
        --warning-4: var(--orange-4);
        --warning-5: var(--orange-5);
        --warning-6: var(--orange-6);
        --warning-7: var(--orange-7);
        --warning-8: var(--orange-8);
        --warning-9: var(--orange-9);
        --warning-10: var(--orange-10);
        --link-1: var(--arcoblue-1);
        --link-2: var(--arcoblue-2);
        --link-3: var(--arcoblue-3);
        --link-4: var(--arcoblue-4);
        --link-5: var(--arcoblue-5);
        --link-6: var(--arcoblue-6);
        --link-7: var(--arcoblue-7);
        --link-8: var(--arcoblue-8);
        --link-9: var(--arcoblue-9);
        --link-10: var(--arcoblue-10);
        --data-1: var(--arcoblue-5);
        --data-2: var(--arcoblue-3);
        --data-3: var(--blue-5);
        --data-4: var(--blue-3);
        --data-5: var(--orange-6);
        --data-6: var(--orange-3);
        --data-7: var(--green-4);
        --data-8: var(--green-3);
        --data-9: var(--purple-4);
        --data-10: var(--purple-3);
        --data-11: var(--gold-6);
        --data-12: var(--gold-4);
        --data-13: var(--lime-6);
        --data-14: var(--lime-4);
        --data-15: var(--magenta-4);
        --data-16: var(--magenta-3);
        --data-17: var(--cyan-6);
        --data-18: var(--cyan-3);
        --data-19: var(--pinkpurple-4);
        --data-20: var(--pinkpurple-2)
    }

    body {
        --color-white: #fff;
        --color-black: #000;
        --color-border: rgb(var(--gray-3));
        --color-bg-popup: var(--color-bg-5);
        --color-bg-1: #fff;
        --color-bg-2: #fff;
        --color-bg-3: #fff;
        --color-bg-4: #fff;
        --color-bg-5: #fff;
        --color-bg-white: #fff;
        --color-neutral-1: rgb(var(--gray-1));
        --color-neutral-2: rgb(var(--gray-2));
        --color-neutral-3: rgb(var(--gray-3));
        --color-neutral-4: rgb(var(--gray-4));
        --color-neutral-5: rgb(var(--gray-5));
        --color-neutral-6: rgb(var(--gray-6));
        --color-neutral-7: rgb(var(--gray-7));
        --color-neutral-8: rgb(var(--gray-8));
        --color-neutral-9: rgb(var(--gray-9));
        --color-neutral-10: rgb(var(--gray-10));
        --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-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-6);
        --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-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-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-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-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-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-data-1: rgb(var(--arcoblue-5));
        --color-data-2: rgb(var(--arcoblue-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));
        --border-radius-none: 0;
        --border-radius-small: 2px;
        --border-radius-medium: 4px;
        --border-radius-large: 8px;
        --border-radius-circle: 50%;
        --color-tooltip-bg: rgb(var(--gray-10));
        --color-spin-layer-bg: rgba(255, 255, 255, .6);
        --color-menu-dark-bg: #232324;
        --color-menu-light-bg: #fff;
        --color-menu-dark-hover: rgba(255, 255, 255, .04);
        --color-mask-bg: rgba(29, 33, 41, .6);
        --font-weight-100: 100;
        --font-weight-200: 200;
        --font-weight-300: 300;
        --font-weight-400: 400;
        --font-weight-500: 500;
        --font-weight-600: 600;
        --font-weight-700: 700;
        --font-weight-800: 800;
        --font-weight-900: 900
    }

    body[arco-theme=dark] {
        --color-white: rgba(255, 255, 255, .9);
        --color-black: #000;
        --color-border: #333335;
        --color-bg-1: #17171a;
        --color-bg-2: #232324;
        --color-bg-3: #2a2a2b;
        --color-bg-4: #313132;
        --color-bg-5: #373739;
        --color-bg-white: #f6f6f6;
        --color-text-1: rgba(255, 255, 255, .9);
        --color-text-2: rgba(255, 255, 255, .7);
        --color-text-3: rgba(255, 255, 255, .5);
        --color-text-4: rgba(255, 255, 255, .3);
        --color-fill-1: rgba(255, 255, 255, .04);
        --color-fill-2: rgba(255, 255, 255, .08);
        --color-fill-3: rgba(255, 255, 255, .12);
        --color-fill-4: rgba(255, 255, 255, .16);
        --color-primary-light-1: rgba(var(--primary-6), .2);
        --color-primary-light-2: rgba(var(--primary-6), .35);
        --color-primary-light-3: rgba(var(--primary-6), .5);
        --color-primary-light-4: rgba(var(--primary-6), .65);
        --color-secondary: rgba(var(--gray-9), .08);
        --color-secondary-hover: rgba(var(--gray-8), .16);
        --color-secondary-active: rgba(var(--gray-7), .24);
        --color-secondary-disabled: rgba(var(--gray-9), .08);
        --color-danger-light-1: rgba(var(--danger-6), .2);
        --color-danger-light-2: rgba(var(--danger-6), .35);
        --color-danger-light-3: rgba(var(--danger-6), .5);
        --color-danger-light-4: rgba(var(--danger-6), .65);
        --color-success-light-1: rgba(var(--success-6), .2);
        --color-success-light-2: rgba(var(--success-6), .35);
        --color-success-light-3: rgba(var(--success-6), .5);
        --color-success-light-4: rgba(var(--success-6), .65);
        --color-warning-light-1: rgba(var(--warning-6), .2);
        --color-warning-light-2: rgba(var(--warning-6), .35);
        --color-warning-light-3: rgba(var(--warning-6), .5);
        --color-warning-light-4: rgba(var(--warning-6), .65);
        --color-link-light-1: rgba(var(--link-6), .2);
        --color-link-light-2: rgba(var(--link-6), .35);
        --color-link-light-3: rgba(var(--link-6), .5);
        --color-link-light-4: rgba(var(--link-6), .65);
        --color-tooltip-bg: #373739;
        --color-spin-layer-bg: rgba(51, 51, 51, .6);
        --color-menu-dark-bg: #232324;
        --color-menu-light-bg: #232324;
        --color-menu-dark-hover: var(--color-fill-2);
        --color-mask-bg: rgba(23, 23, 26, .6)
    }

    html,
    body {
        -webkit-text-size-adjust: 100%;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        font-family: Inter, -apple-system, BlinkMacSystemFont, PingFang SC, Hiragino Sans GB, noto sans, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif;
        line-height: 1.5
    }

    body {
        margin: 0;
        padding: 0
    }

    main {
        display: block
    }

    h1 {
        margin: .67em 0;
        font-size: 2em
    }

    hr {
        box-sizing: content-box;
        height: 0;
        overflow: visible
    }

    tr,
    th {
        margin: 0;
        padding: 0
    }

    pre {
        font-family: monospace;
        font-size: 1em
    }

    a {
        background-color: transparent
    }

    abbr[title] {
        text-decoration: underline;
        border-bottom: none;
        -webkit-text-decoration: underline dotted;
        text-decoration: underline dotted
    }

    b,
    strong {
        font-weight: bolder
    }

    code,
    kbd,
    samp {
        font-family: monospace;
        font-size: 1em
    }

    small {
        font-size: 80%
    }

    sub,
    sup {
        vertical-align: baseline;
        font-size: 75%;
        line-height: 0;
        position: relative
    }

    sub {
        bottom: -.25em
    }

    sup {
        top: -.5em
    }

    img {
        border-style: none
    }

    button,
    input,
    optgroup,
    select,
    textarea {
        margin: 0;
        font-family: inherit;
        line-height: 1.15
    }

    button,
    input {
        overflow: visible
    }

    button,
    select {
        text-transform: none
    }

    button {
        -webkit-appearance: button
    }

    [type=button] {
        -webkit-appearance: button
    }

    [type=reset] {
        -webkit-appearance: button
    }

    [type=submit] {
        -webkit-appearance: button
    }

    button::-moz-focus-inner {
        border-style: none;
        padding: 0
    }

    [type=button]::-moz-focus-inner {
        border-style: none;
        padding: 0
    }

    [type=reset]::-moz-focus-inner {
        border-style: none;
        padding: 0
    }

    [type=submit]::-moz-focus-inner {
        border-style: none;
        padding: 0
    }

    button:-moz-focusring {
        outline: 1px dotted buttontext
    }

    [type=button]:-moz-focusring {
        outline: 1px dotted buttontext
    }

    [type=reset]:-moz-focusring {
        outline: 1px dotted buttontext
    }

    [type=submit]:-moz-focusring {
        outline: 1px dotted buttontext
    }

    fieldset {
        padding: .35em .75em .625em
    }

    legend {
        box-sizing: border-box;
        color: inherit;
        white-space: normal;
        max-width: 100%;
        padding: 0;
        display: table
    }

    progress {
        vertical-align: baseline
    }

    textarea {
        overflow: auto
    }

    [type=checkbox] {
        box-sizing: border-box;
        padding: 0
    }

    [type=radio] {
        box-sizing: border-box;
        padding: 0
    }

    [type=number]::-webkit-inner-spin-button {
        height: auto
    }

    [type=number]::-webkit-outer-spin-button {
        height: auto
    }

    [type=search] {
        -webkit-appearance: textfield;
        outline-offset: -2px
    }

    [type=search]::-webkit-search-decoration {
        -webkit-appearance: none
    }

    ::-webkit-file-upload-button {
        -webkit-appearance: button;
        font: inherit
    }

    details {
        display: block
    }

    summary {
        display: list-item
    }

    template,
    [hidden] {
        display: none
    }

    * {
        outline: none
    }

    input::-ms-clear {
        display: none
    }

    input::-ms-reveal {
        display: none
    }

    .arco-icon {
        color: inherit;
        vertical-align: -2px;
        stroke: currentColor;
        width: 1em;
        height: 1em;
        font-style: normal;
        display: inline-block
    }

    .arco-icon[fill=currentColor] {
        fill: currentColor;
        stroke: none
    }

    .arco-icon[stroke=currentColor] {
        stroke: currentColor;
        fill: none
    }

    .arco-icon[fill=currentColor][stroke=currentColor] {
        fill: currentColor;
        stroke: currentColor
    }

    .arco-icon-loading {
        animation: 1s cubic-bezier(0, 0, 1, 1) infinite arco-loading-circle
    }

    @keyframes arco-loading-circle {
        to {
            transform: rotate(360deg)
        }
    }

    .arco-icon-hover {
        cursor: pointer;
        line-height: 0;
        display: inline-block;
        position: relative
    }

    .arco-icon-hover .arco-icon {
        vertical-align: -.09em;
        position: relative
    }

    .arco-icon-hover:before {
        content: "";
        border-radius: var(--border-radius-circle);
        box-sizing: border-box;
        background-color: transparent;
        transition: background-color .1s cubic-bezier(0, 0, 1, 1);
        display: block;
        position: absolute
    }

    .arco-icon-hover:hover:before {
        background-color: var(--color-fill-2)
    }

    .arco-icon-hover.arco-icon-hover-disabled:before {
        opacity: 0
    }

    .arco-icon-hover:before,
    .arco-icon-hover-size-mini:before,
    .arco-icon-hover-size-small:before {
        width: 20px;
        height: 20px;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%)
    }

    .arco-icon-hover-size-large:before,
    .arco-icon-hover-size-huge:before {
        width: 24px;
        height: 24px;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%)
    }

    .fadeInStandard-enter,
    .fadeInStandard-appear {
        opacity: 0
    }

    .fadeInStandard-enter-active,
    .fadeInStandard-appear-active {
        opacity: 1;
        transition: opacity .3s cubic-bezier(.34, .69, .1, 1)
    }

    .fadeInStandard-exit {
        opacity: 1
    }

    .fadeInStandard-exit-active {
        opacity: 0;
        transition: opacity .3s cubic-bezier(.34, .69, .1, 1)
    }

    .fadeIn-enter,
    .fadeIn-appear {
        opacity: 0
    }

    .fadeIn-enter-active,
    .fadeIn-appear-active {
        opacity: 1;
        transition: opacity .1s cubic-bezier(0, 0, 1, 1)
    }

    .fadeIn-exit {
        opacity: 1
    }

    .fadeIn-exit-active {
        opacity: 0;
        transition: opacity .1s cubic-bezier(0, 0, 1, 1)
    }

    .slideDynamicOrigin-enter,
    .slideDynamicOrigin-appear {
        opacity: 0;
        transform-origin: 0 0;
        transform: scaleY(.9)translateZ(0)
    }

    .slideDynamicOrigin-enter-active,
    .slideDynamicOrigin-appear-active,
    .slideDynamicOrigin-exit {
        opacity: 1;
        transform-origin: 0 0;
        transition: transform .2s cubic-bezier(.34, .69, .1, 1), opacity .2s cubic-bezier(.34, .69, .1, 1);
        transform: scaleY(1)translateZ(0)
    }

    .slideDynamicOrigin-exit-active {
        opacity: 0;
        transform-origin: 0 0;
        transition: transform .2s cubic-bezier(.34, .69, .1, 1), opacity .2s cubic-bezier(.34, .69, .1, 1);
        transform: scaleY(.9)translateZ(0)
    }

    .slideLeft-enter,
    .slideLeft-appear {
        transform: translate(-100%)
    }

    .slideLeft-enter-active,
    .slideLeft-appear-active {
        transition: transform .3s cubic-bezier(.34, .69, .1, 1);
        transform: translate(0)
    }

    .slideLeft-exit {
        transform: translate(0)
    }

    .slideLeft-exit-active {
        transition: transform .3s cubic-bezier(.34, .69, .1, 1);
        transform: translate(-100%)
    }

    .slideRight-enter,
    .slideRight-appear {
        transform: translate(100%)
    }

    .slideRight-enter-active,
    .slideRight-appear-active {
        transition: transform .3s cubic-bezier(.34, .69, .1, 1);
        transform: translate(0)
    }

    .slideRight-exit {
        transform: translate(0)
    }

    .slideRight-exit-active {
        transition: transform .3s cubic-bezier(.34, .69, .1, 1);
        transform: translate(100%)
    }

    .slideTop-enter,
    .slideTop-appear {
        transform: translateY(-100%)
    }

    .slideTop-enter-active,
    .slideTop-appear-active {
        transition: transform .3s cubic-bezier(.34, .69, .1, 1);
        transform: translateY(0)
    }

    .slideTop-exit {
        transform: translateY(0)
    }

    .slideTop-exit-active {
        transition: transform .3s cubic-bezier(.34, .69, .1, 1);
        transform: translateY(-100%)
    }

    .slideBottom-enter,
    .slideBottom-appear {
        transform: translateY(100%)
    }

    .slideBottom-enter-active,
    .slideBottom-appear-active {
        transition: transform .3s cubic-bezier(.34, .69, .1, 1);
        transform: translateY(0)
    }

    .slideBottom-exit {
        transform: translateY(0)
    }

    .slideBottom-exit-active {
        transition: transform .3s cubic-bezier(.34, .69, .1, 1);
        transform: translateY(100%)
    }

    .zoomIn-enter,
    .zoomIn-appear {
        opacity: 0;
        transform: scale(.5)
    }

    .zoomIn-enter-active,
    .zoomIn-appear-active {
        opacity: 1;
        transition: opacity .3s cubic-bezier(.34, .69, .1, 1), transform .3s cubic-bezier(.34, .69, .1, 1);
        transform: scale(1)
    }

    .zoomIn-exit {
        opacity: 1;
        transform: scale(1)
    }

    .zoomIn-exit-active {
        opacity: 0;
        transition: opacity .3s cubic-bezier(.3, 1.3, .3, 1), transform .3s cubic-bezier(.3, 1.3, .3, 1);
        transform: scale(.5)
    }

    .zoomInFadeOut-enter,
    .zoomInFadeOut-appear {
        opacity: 0;
        transform: scale(.5)
    }

    .zoomInFadeOut-enter-active,
    .zoomInFadeOut-appear-active {
        opacity: 1;
        transition: opacity .2s cubic-bezier(.34, .69, .1, 1), transform .2s cubic-bezier(.34, .69, .1, 1);
        transform: scale(1)
    }

    .zoomInFadeOut-exit {
        opacity: 1;
        transform: scale(1)
    }

    .zoomInFadeOut-exit-active {
        opacity: 0;
        transition: opacity .2s cubic-bezier(.3, 1.3, .3, 1), transform .2s cubic-bezier(.3, 1.3, .3, 1);
        transform: scale(.5)
    }

    .zoomInBig-enter,
    .zoomInBig-appear {
        opacity: 0;
        transform: scale(.5)
    }

    .zoomInBig-enter-active,
    .zoomInBig-appear-active {
        opacity: 1;
        transition: opacity .2s cubic-bezier(0, 0, 1, 1), transform .2s cubic-bezier(0, 0, 1, 1);
        transform: scale(1)
    }

    .zoomInBig-exit {
        opacity: 1;
        transform: scale(1)
    }

    .zoomInBig-exit-active {
        opacity: 0;
        transition: opacity .2s cubic-bezier(0, 0, 1, 1), transform .2s cubic-bezier(0, 0, 1, 1);
        transform: scale(.2)
    }

    .zoomInLeft-enter,
    .zoomInLeft-appear {
        opacity: .1;
        transform-origin: 0;
        transform: scale(.1)
    }

    .zoomInLeft-enter-active,
    .zoomInLeft-appear-active {
        opacity: 1;
        transition: opacity .3s cubic-bezier(0, 0, 1, 1), transform .3s cubic-bezier(.3, 1.3, .3, 1);
        transform: scale(1)
    }

    .zoomInLeft-exit {
        opacity: 1;
        transform-origin: 0;
        transform: scale(1)
    }

    .zoomInLeft-exit-active {
        opacity: .1;
        transition: opacity .3s cubic-bezier(0, 0, 1, 1), transform .3s cubic-bezier(.3, 1.3, .3, 1);
        transform: scale(.1)
    }

    .zoomInTop-enter,
    .zoomInTop-appear {
        opacity: 0;
        transform-origin: 0 0;
        transform: scaleY(.8)translateZ(0)
    }

    .zoomInTop-enter-active,
    .zoomInTop-appear-active {
        opacity: 1;
        transform-origin: 0 0;
        transition: transform .3s cubic-bezier(.3, 1.3, .3, 1), opacity .3s cubic-bezier(.3, 1.3, .3, 1);
        transform: scaleY(1)translateZ(0)
    }

    .zoomInTop-exit {
        opacity: 1;
        transform-origin: 0 0;
        transform: scaleY(1)translateZ(0)
    }

    .zoomInTop-exit-active {
        opacity: 0;
        transform-origin: 0 0;
        transition: transform .3s cubic-bezier(.3, 1.3, .3, 1), opacity .3s cubic-bezier(.3, 1.3, .3, 1);
        transform: scaleY(.8)translateZ(0)
    }

    .zoomInBottom-enter,
    .zoomInBottom-appear {
        opacity: 0;
        transform-origin: 100% 100%;
        transform: scaleY(.8)translateZ(0)
    }

    .zoomInBottom-enter-active,
    .zoomInBottom-appear-active {
        opacity: 1;
        transform-origin: 100% 100%;
        transition: transform .3s cubic-bezier(.3, 1.3, .3, 1), opacity .3s cubic-bezier(.3, 1.3, .3, 1);
        transform: scaleY(1)translateZ(0)
    }

    .zoomInBottom-exit {
        opacity: 1;
        transform-origin: 100% 100%;
        transform: scaleY(1)translateZ(0)
    }

    .zoomInBottom-exit-active {
        opacity: 0;
        transform-origin: 100% 100%;
        transition: transform .3s cubic-bezier(.3, 1.3, .3, 1), opacity .3s cubic-bezier(.3, 1.3, .3, 1);
        transform: scaleY(.8)translateZ(0)
    }

    body {
        font-size: 14px
    }
}


@layer base {
    .arco-affix {
        z-index: 999;
        position: fixed
    }
}


@layer base {
    .arco-anchor {
        width: 150px;
        position: relative;
        overflow: auto
    }

    .arco-anchor-line-slider {
        background-color: rgb(var(--primary-6));
        z-index: 1;
        width: 2px;
        height: 12px;
        margin-top: 9.0005px;
        transition: all .2s cubic-bezier(.34, .69, .1, 1);
        position: absolute;
        top: 0;
        left: 0
    }

    .arco-anchor-list {
        margin-left: 6px;
        position: relative
    }

    .arco-anchor-list:before {
        content: "";
        background-color: var(--color-fill-3);
        width: 2px;
        height: 100%;
        position: absolute;
        left: -6px
    }

    .arco-anchor-link {
        margin-bottom: 2px
    }

    .arco-anchor-link-title {
        color: var(--color-text-2);
        cursor: pointer;
        text-overflow: ellipsis;
        white-space: nowrap;
        border-radius: var(--border-radius-small);
        margin-bottom: 2px;
        padding: 4px 8px;
        font-size: 14px;
        line-height: 1.5715;
        text-decoration: none;
        display: block;
        overflow: hidden
    }

    .arco-anchor-link-title:hover {
        background-color: var(--color-fill-2);
        color: var(--color-text-1);
        font-weight: 500
    }

    .arco-anchor-link-title:focus-visible {
        box-shadow: inset 0 0 0 2px rgb(var(--primary-6))
    }

    .arco-anchor-link-active>.arco-anchor-link-title {
        color: var(--color-text-1);
        font-weight: 500;
        transition: all .1s cubic-bezier(0, 0, 1, 1)
    }

    .arco-anchor-link .arco-anchor-link {
        margin-left: 16px
    }

    .arco-anchor-lineless .arco-anchor-list {
        margin-left: 0
    }

    .arco-anchor-lineless .arco-anchor-list:before {
        display: none
    }

    .arco-anchor-lineless .arco-anchor-link-active>.arco-anchor-link-title {
        background-color: var(--color-fill-2);
        color: rgb(var(--primary-6));
        font-weight: 500
    }

    .arco-anchor-rtl {
        direction: rtl
    }

    .arco-anchor-rtl .arco-anchor-list {
        margin-left: 0;
        margin-right: 6px
    }

    .arco-anchor-rtl .arco-anchor-list:before {
        left: initial;
        right: -6px
    }

    .arco-anchor-rtl .arco-anchor-link .arco-anchor-link {
        margin-left: 0;
        margin-right: 16px
    }

    .arco-anchor-rtl.arco-anchor-lineless .arco-anchor-list {
        margin-right: 0
    }

    .arco-anchor-rtl .arco-anchor-line-slider {
        left: initial;
        right: 0
    }

    .arco-anchor.arco-anchor-horizontal {
        width: 100%
    }

    .arco-anchor-horizontal .arco-anchor-list {
        width: 100%;
        margin: 0;
        display: flex
    }

    .arco-anchor-horizontal .arco-anchor-list:before {
        width: 100%;
        height: 2px;
        bottom: 0;
        left: 0;
        right: 0
    }

    .arco-anchor-horizontal .arco-anchor-link-title:hover {
        font-weight: 400
    }

    .arco-anchor-horizontal .arco-anchor-link-active .arco-anchor-link-title:hover {
        font-weight: 500
    }

    .arco-anchor-horizontal .arco-anchor-link:not(:first-of-type) {
        margin-left: 16px
    }

    .arco-anchor-rtl.arco-anchor-horizontal .arco-anchor-link:not(:first-of-type) {
        margin-right: 16px;
        margin-left: unset
    }

    .arco-anchor-horizontal .arco-anchor-line-slider {
        width: 0;
        height: 2px;
        top: unset;
        bottom: 0;
        right: unset;
        background-color: transparent;
        margin: 0
    }

    .arco-anchor-horizontal .arco-anchor-line-slider:before {
        content: "";
        background-color: rgb(var(--primary-6));
        height: 100%;
        display: block;
        position: absolute;
        left: 8px;
        right: 8px
    }

    .arco-anchor.arco-anchor-lineless .arco-anchor-link,
    .arco-anchor.arco-anchor-lineless .arco-anchor-link-title {
        margin-bottom: 0
    }
}


@layer base {
    .arco-btn {
        -webkit-appearance: none;
        -moz-appearance: none;
        -ms-appearance: none;
        appearance: none;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        cursor: pointer;
        white-space: nowrap;
        box-sizing: border-box;
        outline: none;
        font-weight: 400;
        line-height: 1.5715;
        transition: all .1s cubic-bezier(0, 0, 1, 1);
        display: inline-block;
        position: relative
    }

    .arco-btn>a:only-child {
        color: currentColor
    }

    .arco-btn:active {
        transition: none
    }

    .arco-btn:empty {
        vertical-align: bottom;
        display: inline-block
    }

    .arco-btn-long {
        width: 100%;
        display: block
    }

    .arco-btn-link {
        justify-content: center;
        align-items: center;
        text-decoration: none;
        display: inline-flex
    }

    .arco-btn-link:not([href]) {
        color: var(--color-text-4)
    }

    .arco-btn-link:hover {
        text-decoration: none
    }

    .arco-btn-loading {
        cursor: default;
        position: relative
    }

    .arco-btn-loading:before {
        content: "";
        z-index: 1;
        border-radius: inherit;
        opacity: .4;
        pointer-events: none;
        background: #fff;
        transition: opacity .1s cubic-bezier(0, 0, 1, 1);
        display: block;
        position: absolute;
        top: -1px;
        bottom: -1px;
        left: -1px;
        right: -1px
    }

    .arco-btn-loading-fixed-width {
        transition: none
    }

    .arco-btn-two-chinese-chars>:not(svg) {
        letter-spacing: .3em;
        margin-right: -.3em
    }

    a.arco-btn-icon-only {
        vertical-align: top;
        justify-content: center;
        align-items: center;
        display: inline-flex
    }

    .arco-btn-outline:not(.arco-btn-disabled) {
        color: rgb(var(--primary-6));
        border: 1px solid rgb(var(--primary-6));
        background-color: transparent
    }

    .arco-btn-outline:not(.arco-btn-disabled):not(.arco-btn-loading):hover {
        border-color: rgb(var(--primary-5));
        color: rgb(var(--primary-5));
        background-color: transparent
    }

    .arco-btn-outline:not(.arco-btn-disabled):not(.arco-btn-loading):active {
        border-color: rgb(var(--primary-7));
        color: rgb(var(--primary-7));
        background-color: transparent
    }

    .arco-btn-outline:not(.arco-btn-disabled):focus-visible {
        box-shadow: 0 0 0 2px rgb(var(--primary-3))
    }

    .arco-btn-outline.arco-btn-disabled {
        color: var(--color-primary-light-3);
        border: 1px solid var(--color-primary-light-3);
        cursor: not-allowed;
        background-color: transparent
    }

    .arco-btn-outline.arco-btn-status-warning:not(.arco-btn-disabled) {
        color: rgb(var(--warning-6));
        border-color: rgb(var(--warning-6));
        background-color: transparent
    }

    .arco-btn-outline.arco-btn-status-warning:not(.arco-btn-disabled):not(.arco-btn-loading):hover {
        border-color: rgb(var(--warning-5));
        color: rgb(var(--warning-5));
        background-color: transparent
    }

    .arco-btn-outline.arco-btn-status-warning:not(.arco-btn-disabled):not(.arco-btn-loading):active {
        border-color: rgb(var(--warning-7));
        color: rgb(var(--warning-7));
        background-color: transparent
    }

    .arco-btn-outline.arco-btn-status-warning:not(.arco-btn-disabled):focus-visible {
        box-shadow: 0 0 0 2px rgb(var(--warning-3))
    }

    .arco-btn-outline.arco-btn-status-warning.arco-btn-disabled {
        color: var(--color-warning-light-3);
        border: 1px solid var(--color-warning-light-3);
        background-color: transparent
    }

    .arco-btn-outline.arco-btn-status-danger:not(.arco-btn-disabled) {
        color: rgb(var(--danger-6));
        border-color: rgb(var(--danger-6));
        background-color: transparent
    }

    .arco-btn-outline.arco-btn-status-danger:not(.arco-btn-disabled):not(.arco-btn-loading):hover {
        border-color: rgb(var(--danger-5));
        color: rgb(var(--danger-5));
        background-color: transparent
    }

    .arco-btn-outline.arco-btn-status-danger:not(.arco-btn-disabled):not(.arco-btn-loading):active {
        border-color: rgb(var(--danger-7));
        color: rgb(var(--danger-7));
        background-color: transparent
    }

    .arco-btn-outline.arco-btn-status-danger:not(.arco-btn-disabled):focus-visible {
        box-shadow: 0 0 0 2px rgb(var(--danger-3))
    }

    .arco-btn-outline.arco-btn-status-danger.arco-btn-disabled {
        color: var(--color-danger-light-3);
        border: 1px solid var(--color-danger-light-3);
        background-color: transparent
    }

    .arco-btn-outline.arco-btn-status-success:not(.arco-btn-disabled) {
        color: rgb(var(--success-6));
        border-color: rgb(var(--success-6));
        background-color: transparent
    }

    .arco-btn-outline.arco-btn-status-success:not(.arco-btn-disabled):not(.arco-btn-loading):hover {
        border-color: rgb(var(--success-5));
        color: rgb(var(--success-5));
        background-color: transparent
    }

    .arco-btn-outline.arco-btn-status-success:not(.arco-btn-disabled):not(.arco-btn-loading):active {
        border-color: rgb(var(--success-7));
        color: rgb(var(--success-7));
        background-color: transparent
    }

    .arco-btn-outline.arco-btn-status-success:not(.arco-btn-disabled):focus-visible {
        box-shadow: 0 0 0 2px rgb(var(--success-3))
    }

    .arco-btn-outline.arco-btn-status-success.arco-btn-disabled {
        color: var(--color-success-light-3);
        border: 1px solid var(--color-success-light-3);
        background-color: transparent
    }

    .arco-btn-primary:not(.arco-btn-disabled) {
        background-color: rgb(var(--primary-6));
        color: #fff;
        border: 1px solid transparent
    }

    .arco-btn-primary:not(.arco-btn-disabled):not(.arco-btn-loading):hover {
        color: #fff;
        background-color: rgb(var(--primary-5));
        border-color: transparent
    }

    .arco-btn-primary:not(.arco-btn-disabled):not(.arco-btn-loading):active {
        color: #fff;
        background-color: rgb(var(--primary-7));
        border-color: transparent
    }

    .arco-btn-primary:not(.arco-btn-disabled):focus-visible {
        box-shadow: 0 0 0 2px rgb(var(--primary-3))
    }

    .arco-btn-primary.arco-btn-disabled {
        background-color: var(--color-primary-light-3);
        color: #fff;
        cursor: not-allowed;
        border: 1px solid transparent
    }

    .arco-btn-primary.arco-btn-status-warning:not(.arco-btn-disabled) {
        background-color: rgb(var(--warning-6));
        color: #fff;
        border-color: transparent
    }

    .arco-btn-primary.arco-btn-status-warning:not(.arco-btn-disabled):not(.arco-btn-loading):hover {
        color: #fff;
        background-color: rgb(var(--warning-5));
        border-color: transparent
    }

    .arco-btn-primary.arco-btn-status-warning:not(.arco-btn-disabled):not(.arco-btn-loading):active {
        color: #fff;
        background-color: rgb(var(--warning-7));
        border-color: transparent
    }

    .arco-btn-primary.arco-btn-status-warning:not(.arco-btn-disabled):focus-visible {
        box-shadow: 0 0 0 2px rgb(var(--warning-3))
    }

    .arco-btn-primary.arco-btn-status-warning.arco-btn-disabled {
        color: #fff;
        background-color: var(--color-warning-light-3);
        border: 1px solid transparent
    }

    .arco-btn-primary.arco-btn-status-danger:not(.arco-btn-disabled) {
        background-color: rgb(var(--danger-6));
        color: #fff;
        border-color: transparent
    }

    .arco-btn-primary.arco-btn-status-danger:not(.arco-btn-disabled):not(.arco-btn-loading):hover {
        color: #fff;
        background-color: rgb(var(--danger-5));
        border-color: transparent
    }

    .arco-btn-primary.arco-btn-status-danger:not(.arco-btn-disabled):not(.arco-btn-loading):active {
        color: #fff;
        background-color: rgb(var(--danger-7));
        border-color: transparent
    }

    .arco-btn-primary.arco-btn-status-danger:not(.arco-btn-disabled):focus-visible {
        box-shadow: 0 0 0 2px rgb(var(--danger-3))
    }

    .arco-btn-primary.arco-btn-status-danger.arco-btn-disabled {
        color: #fff;
        background-color: var(--color-danger-light-3);
        border: 1px solid transparent
    }

    .arco-btn-primary.arco-btn-status-success:not(.arco-btn-disabled) {
        background-color: rgb(var(--success-6));
        color: #fff;
        border-color: transparent
    }

    .arco-btn-primary.arco-btn-status-success:not(.arco-btn-disabled):not(.arco-btn-loading):hover {
        color: #fff;
        background-color: rgb(var(--success-5));
        border-color: transparent
    }

    .arco-btn-primary.arco-btn-status-success:not(.arco-btn-disabled):not(.arco-btn-loading):active {
        color: #fff;
        background-color: rgb(var(--success-7));
        border-color: transparent
    }

    .arco-btn-primary.arco-btn-status-success:not(.arco-btn-disabled):focus-visible {
        box-shadow: 0 0 0 2px rgb(var(--success-3))
    }

    .arco-btn-primary.arco-btn-status-success.arco-btn-disabled {
        color: #fff;
        background-color: var(--color-success-light-3);
        border: 1px solid transparent
    }

    .arco-btn-secondary:not(.arco-btn-disabled) {
        background-color: var(--color-secondary);
        color: var(--color-text-2);
        border: 1px solid transparent
    }

    .arco-btn-secondary:not(.arco-btn-disabled):not(.arco-btn-loading):hover {
        color: var(--color-text-2);
        background-color: var(--color-secondary-hover);
        border-color: transparent
    }

    .arco-btn-secondary:not(.arco-btn-disabled):not(.arco-btn-loading):active {
        color: var(--color-text-2);
        background-color: var(--color-secondary-active);
        border-color: transparent
    }

    .arco-btn-secondary:not(.arco-btn-disabled):focus-visible {
        box-shadow: 0 0 0 2px var(--color-neutral-4)
    }

    .arco-btn-secondary.arco-btn-disabled {
        background-color: var(--color-secondary-disabled);
        color: var(--color-text-4);
        cursor: not-allowed;
        border: 1px solid transparent
    }

    .arco-btn-secondary.arco-btn-status-warning:not(.arco-btn-disabled) {
        background-color: var(--color-warning-light-1);
        color: rgb(var(--warning-6));
        border-color: transparent
    }

    .arco-btn-secondary.arco-btn-status-warning:not(.arco-btn-disabled):not(.arco-btn-loading):hover {
        color: rgb(var(--warning-6));
        background-color: var(--color-warning-light-2);
        border-color: transparent
    }

    .arco-btn-secondary.arco-btn-status-warning:not(.arco-btn-disabled):not(.arco-btn-loading):active {
        color: rgb(var(--warning-6));
        background-color: var(--color-warning-light-3);
        border-color: transparent
    }

    .arco-btn-secondary.arco-btn-status-warning:not(.arco-btn-disabled):focus-visible {
        box-shadow: 0 0 0 2px rgb(var(--warning-3))
    }

    .arco-btn-secondary.arco-btn-status-warning.arco-btn-disabled {
        color: var(--color-warning-light-3);
        background-color: var(--color-warning-light-1);
        border: 1px solid transparent
    }

    .arco-btn-secondary.arco-btn-status-danger:not(.arco-btn-disabled) {
        background-color: var(--color-danger-light-1);
        color: rgb(var(--danger-6));
        border-color: transparent
    }

    .arco-btn-secondary.arco-btn-status-danger:not(.arco-btn-disabled):not(.arco-btn-loading):hover {
        color: rgb(var(--danger-6));
        background-color: var(--color-danger-light-2);
        border-color: transparent
    }

    .arco-btn-secondary.arco-btn-status-danger:not(.arco-btn-disabled):not(.arco-btn-loading):active {
        color: rgb(var(--danger-6));
        background-color: var(--color-danger-light-3);
        border-color: transparent
    }

    .arco-btn-secondary.arco-btn-status-danger:not(.arco-btn-disabled):focus-visible {
        box-shadow: 0 0 0 2px rgb(var(--danger-3))
    }

    .arco-btn-secondary.arco-btn-status-danger.arco-btn-disabled {
        color: var(--color-danger-light-3);
        background-color: var(--color-danger-light-1);
        border: 1px solid transparent
    }

    .arco-btn-secondary.arco-btn-status-success:not(.arco-btn-disabled) {
        background-color: var(--color-success-light-1);
        color: rgb(var(--success-6));
        border-color: transparent
    }

    .arco-btn-secondary.arco-btn-status-success:not(.arco-btn-disabled):not(.arco-btn-loading):hover {
        color: rgb(var(--success-6));
        background-color: var(--color-success-light-2);
        border-color: transparent
    }

    .arco-btn-secondary.arco-btn-status-success:not(.arco-btn-disabled):not(.arco-btn-loading):active {
        color: rgb(var(--success-6));
        background-color: var(--color-success-light-3);
        border-color: transparent
    }

    .arco-btn-secondary.arco-btn-status-success:not(.arco-btn-disabled):focus-visible {
        box-shadow: 0 0 0 2px rgb(var(--success-3))
    }

    .arco-btn-secondary.arco-btn-status-success.arco-btn-disabled {
        color: var(--color-success-light-3);
        background-color: var(--color-success-light-1);
        border: 1px solid transparent
    }

    .arco-btn-dashed:not(.arco-btn-disabled) {
        background-color: var(--color-fill-2);
        color: var(--color-text-2);
        border: 1px dashed var(--color-neutral-3)
    }

    .arco-btn-dashed:not(.arco-btn-disabled):not(.arco-btn-loading):hover {
        border-color: var(--color-neutral-4);
        color: var(--color-text-2);
        background-color: var(--color-fill-3)
    }

    .arco-btn-dashed:not(.arco-btn-disabled):not(.arco-btn-loading):active {
        border-color: var(--color-neutral-5);
        color: var(--color-text-2);
        background-color: var(--color-fill-4)
    }

    .arco-btn-dashed:not(.arco-btn-disabled):focus-visible {
        box-shadow: 0 0 0 2px var(--color-neutral-4)
    }

    .arco-btn-dashed.arco-btn-disabled {
        background-color: var(--color-fill-2);
        color: var(--color-text-4);
        border: 1px dashed var(--color-neutral-3);
        cursor: not-allowed
    }

    .arco-btn-dashed.arco-btn-status-warning:not(.arco-btn-disabled) {
        background-color: var(--color-warning-light-1);
        color: rgb(var(--warning-6));
        border-color: var(--color-warning-light-2)
    }

    .arco-btn-dashed.arco-btn-status-warning:not(.arco-btn-disabled):not(.arco-btn-loading):hover {
        border-color: var(--color-warning-light-3);
        color: rgb(var(--warning-6));
        background-color: var(--color-warning-light-2)
    }

    .arco-btn-dashed.arco-btn-status-warning:not(.arco-btn-disabled):not(.arco-btn-loading):active {
        border-color: var(--color-warning-light-4);
        color: rgb(var(--warning-6));
        background-color: var(--color-warning-light-3)
    }

    .arco-btn-dashed.arco-btn-status-warning:not(.arco-btn-disabled):focus-visible {
        box-shadow: 0 0 0 2px rgb(var(--warning-3))
    }

    .arco-btn-dashed.arco-btn-status-warning.arco-btn-disabled {
        color: var(--color-warning-light-3);
        background-color: var(--color-warning-light-1);
        border: 1px dashed var(--color-warning-light-2)
    }

    .arco-btn-dashed.arco-btn-status-danger:not(.arco-btn-disabled) {
        background-color: var(--color-danger-light-1);
        color: rgb(var(--danger-6));
        border-color: var(--color-danger-light-2)
    }

    .arco-btn-dashed.arco-btn-status-danger:not(.arco-btn-disabled):not(.arco-btn-loading):hover {
        border-color: var(--color-danger-light-3);
        color: rgb(var(--danger-6));
        background-color: var(--color-danger-light-2)
    }

    .arco-btn-dashed.arco-btn-status-danger:not(.arco-btn-disabled):not(.arco-btn-loading):active {
        border-color: var(--color-danger-light-4);
        color: rgb(var(--danger-6));
        background-color: var(--color-danger-light-3)
    }

    .arco-btn-dashed.arco-btn-status-danger:not(.arco-btn-disabled):focus-visible {
        box-shadow: 0 0 0 2px rgb(var(--danger-3))
    }

    .arco-btn-dashed.arco-btn-status-danger.arco-btn-disabled {
        color: var(--color-danger-light-3);
        background-color: var(--color-danger-light-1);
        border: 1px dashed var(--color-danger-light-2)
    }

    .arco-btn-dashed.arco-btn-status-success:not(.arco-btn-disabled) {
        background-color: var(--color-success-light-1);
        color: rgb(var(--success-6));
        border-color: var(--color-success-light-2)
    }

    .arco-btn-dashed.arco-btn-status-success:not(.arco-btn-disabled):not(.arco-btn-loading):hover {
        border-color: var(--color-success-light-3);
        color: rgb(var(--success-6));
        background-color: var(--color-success-light-2)
    }

    .arco-btn-dashed.arco-btn-status-success:not(.arco-btn-disabled):not(.arco-btn-loading):active {
        border-color: var(--color-success-light-4);
        color: rgb(var(--success-6));
        background-color: var(--color-success-light-3)
    }

    .arco-btn-dashed.arco-btn-status-success:not(.arco-btn-disabled):focus-visible {
        box-shadow: 0 0 0 2px rgb(var(--success-3))
    }

    .arco-btn-dashed.arco-btn-status-success.arco-btn-disabled {
        color: var(--color-success-light-3);
        background-color: var(--color-success-light-1);
        border: 1px dashed var(--color-success-light-2)
    }

    .arco-btn-text:not(.arco-btn-disabled) {
        color: rgb(var(--primary-6));
        background-color: transparent;
        border: 1px solid transparent
    }

    .arco-btn-text:not(.arco-btn-disabled):not(.arco-btn-loading):hover {
        color: rgb(var(--primary-6));
        background-color: var(--color-fill-2);
        border-color: transparent
    }

    .arco-btn-text:not(.arco-btn-disabled):not(.arco-btn-loading):active {
        color: rgb(var(--primary-6));
        background-color: var(--color-fill-3);
        border-color: transparent
    }

    .arco-btn-text:not(.arco-btn-disabled):focus-visible {
        box-shadow: 0 0 0 2px var(--color-neutral-4)
    }

    .arco-btn-text.arco-btn-disabled {
        color: var(--color-primary-light-3);
        cursor: not-allowed;
        background-color: transparent;
        border: 1px solid transparent
    }

    .arco-btn-text.arco-btn-status-warning:not(.arco-btn-disabled) {
        color: rgb(var(--warning-6));
        background-color: transparent;
        border-color: transparent
    }

    .arco-btn-text.arco-btn-status-warning:not(.arco-btn-disabled):not(.arco-btn-loading):hover {
        color: rgb(var(--warning-6));
        background-color: var(--color-fill-2);
        border-color: transparent
    }

    .arco-btn-text.arco-btn-status-warning:not(.arco-btn-disabled):not(.arco-btn-loading):active {
        color: rgb(var(--warning-6));
        background-color: var(--color-fill-3);
        border-color: transparent
    }

    .arco-btn-text.arco-btn-status-warning:not(.arco-btn-disabled):focus-visible {
        box-shadow: 0 0 0 2px rgb(var(--warning-3))
    }

    .arco-btn-text.arco-btn-status-warning.arco-btn-disabled {
        color: var(--color-warning-light-3);
        background-color: transparent;
        border: 1px solid transparent
    }

    .arco-btn-text.arco-btn-status-danger:not(.arco-btn-disabled) {
        color: rgb(var(--danger-6));
        background-color: transparent;
        border-color: transparent
    }

    .arco-btn-text.arco-btn-status-danger:not(.arco-btn-disabled):not(.arco-btn-loading):hover {
        color: rgb(var(--danger-6));
        background-color: var(--color-fill-2);
        border-color: transparent
    }

    .arco-btn-text.arco-btn-status-danger:not(.arco-btn-disabled):not(.arco-btn-loading):active {
        color: rgb(var(--danger-6));
        background-color: var(--color-fill-3);
        border-color: transparent
    }

    .arco-btn-text.arco-btn-status-danger:not(.arco-btn-disabled):focus-visible {
        box-shadow: 0 0 0 2px rgb(var(--danger-3))
    }

    .arco-btn-text.arco-btn-status-danger.arco-btn-disabled {
        color: var(--color-danger-light-3);
        background-color: transparent;
        border: 1px solid transparent
    }

    .arco-btn-text.arco-btn-status-success:not(.arco-btn-disabled) {
        color: rgb(var(--success-6));
        background-color: transparent;
        border-color: transparent
    }

    .arco-btn-text.arco-btn-status-success:not(.arco-btn-disabled):not(.arco-btn-loading):hover {
        color: rgb(var(--success-6));
        background-color: var(--color-fill-2);
        border-color: transparent
    }

    .arco-btn-text.arco-btn-status-success:not(.arco-btn-disabled):not(.arco-btn-loading):active {
        color: rgb(var(--success-6));
        background-color: var(--color-fill-3);
        border-color: transparent
    }

    .arco-btn-text.arco-btn-status-success:not(.arco-btn-disabled):focus-visible {
        box-shadow: 0 0 0 2px rgb(var(--success-3))
    }

    .arco-btn-text.arco-btn-status-success.arco-btn-disabled {
        color: var(--color-success-light-3);
        background-color: transparent;
        border: 1px solid transparent
    }

    .arco-btn-size-mini {
        border-radius: var(--border-radius-small);
        height: 24px;
        padding: 0 11px;
        font-size: 12px
    }

    .arco-btn-size-mini>svg+span,
    .arco-btn-size-mini>span+svg {
        margin-left: 4px
    }

    .arco-btn-size-mini svg {
        vertical-align: -2px
    }

    .arco-btn-size-mini.arco-btn-rtl>svg+span,
    .arco-btn-size-mini.arco-btn-rtl>span+svg {
        margin-left: 0;
        margin-right: 4px
    }

    .arco-btn-size-mini.arco-btn-loading-fixed-width.arco-btn-loading {
        padding-left: 3px;
        padding-right: 3px
    }

    .arco-btn-size-mini.arco-btn-icon-only {
        width: 24px;
        height: 24px;
        padding: 0
    }

    .arco-btn-size-mini.arco-btn-shape-circle {
        text-align: center;
        border-radius: var(--border-radius-circle);
        width: 24px;
        height: 24px;
        padding: 0
    }

    .arco-btn-size-mini.arco-btn-shape-round {
        border-radius: 12px
    }

    .arco-btn-group .arco-btn-size-mini:first-child {
        border-radius: var(--border-radius-small)0 0 var(--border-radius-small)
    }

    .arco-btn-group .arco-btn-size-mini:last-child {
        border-radius: 0 var(--border-radius-small)var(--border-radius-small)0
    }

    .arco-btn-group .arco-btn-size-mini:first-child:last-child {
        border-radius: var(--border-radius-small)
    }

    .arco-btn-group .arco-btn-size-mini.arco-btn-shape-round:first-child {
        border-radius: 12px 0 0 12px
    }

    .arco-btn-group .arco-btn-size-mini.arco-btn-shape-round:last-child {
        border-radius: 0 12px 12px 0
    }

    .arco-btn-group .arco-btn-size-mini.arco-btn-shape-round:first-child:last-child {
        border-radius: 12px
    }

    .arco-btn-group .arco-btn-rtl.arco-btn-size-mini:first-child {
        border-radius: 0 var(--border-radius-small)var(--border-radius-small)0
    }

    .arco-btn-group .arco-btn-rtl.arco-btn-size-mini:last-child {
        border-radius: var(--border-radius-small)0 0 var(--border-radius-small)
    }

    .arco-btn-group .arco-btn-rtl.arco-btn-size-mini:first-child:last-child {
        border-radius: var(--border-radius-small)
    }

    .arco-btn-group .arco-btn-rtl.arco-btn-size-mini.arco-btn-shape-round:first-child {
        border-radius: 0 12px 12px 0
    }

    .arco-btn-group .arco-btn-rtl.arco-btn-size-mini.arco-btn-shape-round:last-child {
        border-radius: 12px 0 0 12px
    }

    .arco-btn-group .arco-btn-rtl.arco-btn-size-mini.arco-btn-shape-round:first-child:last-child {
        border-radius: 12px
    }

    .arco-btn-size-small {
        border-radius: var(--border-radius-small);
        height: 28px;
        padding: 0 15px;
        font-size: 14px
    }

    .arco-btn-size-small>svg+span,
    .arco-btn-size-small>span+svg {
        margin-left: 6px
    }

    .arco-btn-size-small svg {
        vertical-align: -2px
    }

    .arco-btn-size-small.arco-btn-rtl>svg+span,
    .arco-btn-size-small.arco-btn-rtl>span+svg {
        margin-left: 0;
        margin-right: 6px
    }

    .arco-btn-size-small.arco-btn-loading-fixed-width.arco-btn-loading {
        padding-left: 5px;
        padding-right: 5px
    }

    .arco-btn-size-small.arco-btn-icon-only {
        width: 28px;
        height: 28px;
        padding: 0
    }

    .arco-btn-size-small.arco-btn-shape-circle {
        text-align: center;
        border-radius: var(--border-radius-circle);
        width: 28px;
        height: 28px;
        padding: 0
    }

    .arco-btn-size-small.arco-btn-shape-round {
        border-radius: 14px
    }

    .arco-btn-group .arco-btn-size-small:first-child {
        border-radius: var(--border-radius-small)0 0 var(--border-radius-small)
    }

    .arco-btn-group .arco-btn-size-small:last-child {
        border-radius: 0 var(--border-radius-small)var(--border-radius-small)0
    }

    .arco-btn-group .arco-btn-size-small:first-child:last-child {
        border-radius: var(--border-radius-small)
    }

    .arco-btn-group .arco-btn-size-small.arco-btn-shape-round:first-child {
        border-radius: 14px 0 0 14px
    }

    .arco-btn-group .arco-btn-size-small.arco-btn-shape-round:last-child {
        border-radius: 0 14px 14px 0
    }

    .arco-btn-group .arco-btn-size-small.arco-btn-shape-round:first-child:last-child {
        border-radius: 14px
    }

    .arco-btn-group .arco-btn-rtl.arco-btn-size-small:first-child {
        border-radius: 0 var(--border-radius-small)var(--border-radius-small)0
    }

    .arco-btn-group .arco-btn-rtl.arco-btn-size-small:last-child {
        border-radius: var(--border-radius-small)0 0 var(--border-radius-small)
    }

    .arco-btn-group .arco-btn-rtl.arco-btn-size-small:first-child:last-child {
        border-radius: var(--border-radius-small)
    }

    .arco-btn-group .arco-btn-rtl.arco-btn-size-small.arco-btn-shape-round:first-child {
        border-radius: 0 14px 14px 0
    }

    .arco-btn-group .arco-btn-rtl.arco-btn-size-small.arco-btn-shape-round:last-child {
        border-radius: 14px 0 0 14px
    }

    .arco-btn-group .arco-btn-rtl.arco-btn-size-small.arco-btn-shape-round:first-child:last-child {
        border-radius: 14px
    }

    .arco-btn-size-default {
        border-radius: var(--border-radius-small);
        height: 32px;
        padding: 0 15px;
        font-size: 14px
    }

    .arco-btn-size-default>svg+span,
    .arco-btn-size-default>span+svg {
        margin-left: 8px
    }

    .arco-btn-size-default svg {
        vertical-align: -2px
    }

    .arco-btn-size-default.arco-btn-rtl>svg+span,
    .arco-btn-size-default.arco-btn-rtl>span+svg {
        margin-left: 0;
        margin-right: 8px
    }

    .arco-btn-size-default.arco-btn-loading-fixed-width.arco-btn-loading {
        padding-left: 4px;
        padding-right: 4px
    }

    .arco-btn-size-default.arco-btn-icon-only {
        width: 32px;
        height: 32px;
        padding: 0
    }

    .arco-btn-size-default.arco-btn-shape-circle {
        text-align: center;
        border-radius: var(--border-radius-circle);
        width: 32px;
        height: 32px;
        padding: 0
    }

    .arco-btn-size-default.arco-btn-shape-round {
        border-radius: 16px
    }

    .arco-btn-group .arco-btn-size-default:first-child {
        border-radius: var(--border-radius-small)0 0 var(--border-radius-small)
    }

    .arco-btn-group .arco-btn-size-default:last-child {
        border-radius: 0 var(--border-radius-small)var(--border-radius-small)0
    }

    .arco-btn-group .arco-btn-size-default:first-child:last-child {
        border-radius: var(--border-radius-small)
    }

    .arco-btn-group .arco-btn-size-default.arco-btn-shape-round:first-child {
        border-radius: 16px 0 0 16px
    }

    .arco-btn-group .arco-btn-size-default.arco-btn-shape-round:last-child {
        border-radius: 0 16px 16px 0
    }

    .arco-btn-group .arco-btn-size-default.arco-btn-shape-round:first-child:last-child {
        border-radius: 16px
    }

    .arco-btn-group .arco-btn-rtl.arco-btn-size-default:first-child {
        border-radius: 0 var(--border-radius-small)var(--border-radius-small)0
    }

    .arco-btn-group .arco-btn-rtl.arco-btn-size-default:last-child {
        border-radius: var(--border-radius-small)0 0 var(--border-radius-small)
    }

    .arco-btn-group .arco-btn-rtl.arco-btn-size-default:first-child:last-child {
        border-radius: var(--border-radius-small)
    }

    .arco-btn-group .arco-btn-rtl.arco-btn-size-default.arco-btn-shape-round:first-child {
        border-radius: 0 16px 16px 0
    }

    .arco-btn-group .arco-btn-rtl.arco-btn-size-default.arco-btn-shape-round:last-child {
        border-radius: 16px 0 0 16px
    }

    .arco-btn-group .arco-btn-rtl.arco-btn-size-default.arco-btn-shape-round:first-child:last-child {
        border-radius: 16px
    }

    .arco-btn-size-large {
        border-radius: var(--border-radius-small);
        height: 36px;
        padding: 0 19px;
        font-size: 14px
    }

    .arco-btn-size-large>svg+span,
    .arco-btn-size-large>span+svg {
        margin-left: 8px
    }

    .arco-btn-size-large svg {
        vertical-align: -2px
    }

    .arco-btn-size-large.arco-btn-rtl>svg+span,
    .arco-btn-size-large.arco-btn-rtl>span+svg {
        margin-left: 0;
        margin-right: 8px
    }

    .arco-btn-size-large.arco-btn-loading-fixed-width.arco-btn-loading {
        padding-left: 8px;
        padding-right: 8px
    }

    .arco-btn-size-large.arco-btn-icon-only {
        width: 36px;
        height: 36px;
        padding: 0
    }

    .arco-btn-size-large.arco-btn-shape-circle {
        text-align: center;
        border-radius: var(--border-radius-circle);
        width: 36px;
        height: 36px;
        padding: 0
    }

    .arco-btn-size-large.arco-btn-shape-round {
        border-radius: 18px
    }

    .arco-btn-group .arco-btn-size-large:first-child {
        border-radius: var(--border-radius-small)0 0 var(--border-radius-small)
    }

    .arco-btn-group .arco-btn-size-large:last-child {
        border-radius: 0 var(--border-radius-small)var(--border-radius-small)0
    }

    .arco-btn-group .arco-btn-size-large:first-child:last-child {
        border-radius: var(--border-radius-small)
    }

    .arco-btn-group .arco-btn-size-large.arco-btn-shape-round:first-child {
        border-radius: 18px 0 0 18px
    }

    .arco-btn-group .arco-btn-size-large.arco-btn-shape-round:last-child {
        border-radius: 0 18px 18px 0
    }

    .arco-btn-group .arco-btn-size-large.arco-btn-shape-round:first-child:last-child {
        border-radius: 18px
    }

    .arco-btn-group .arco-btn-rtl.arco-btn-size-large:first-child {
        border-radius: 0 var(--border-radius-small)var(--border-radius-small)0
    }

    .arco-btn-group .arco-btn-rtl.arco-btn-size-large:last-child {
        border-radius: var(--border-radius-small)0 0 var(--border-radius-small)
    }

    .arco-btn-group .arco-btn-rtl.arco-btn-size-large:first-child:last-child {
        border-radius: var(--border-radius-small)
    }

    .arco-btn-group .arco-btn-rtl.arco-btn-size-large.arco-btn-shape-round:first-child {
        border-radius: 0 18px 18px 0
    }

    .arco-btn-group .arco-btn-rtl.arco-btn-size-large.arco-btn-shape-round:last-child {
        border-radius: 18px 0 0 18px
    }

    .arco-btn-group .arco-btn-rtl.arco-btn-size-large.arco-btn-shape-round:first-child:last-child {
        border-radius: 18px
    }

    .arco-btn-group {
        display: inline-block
    }

    .arco-btn-group .arco-btn-outline:not(:first-child),
    .arco-btn-group .arco-btn-dashed:not(:first-child) {
        margin-left: -1px
    }

    .arco-btn-group .arco-btn-primary:not(:last-child) {
        border-right: 1px solid rgb(var(--primary-5))
    }

    .arco-btn-group .arco-btn-secondary:not(:last-child) {
        border-right: 1px solid var(--color-secondary-hover)
    }

    .arco-btn-group .arco-btn-text:not(:last-child) {
        border-right: 1px solid transparent
    }

    .arco-btn-group .arco-btn-status-warning:not(:last-child) {
        border-right: 1px solid rgb(var(--warning-5))
    }

    .arco-btn-group .arco-btn-status-warning:not(:last-child).arco-btn-text {
        border-right: 1px solid var(--color-fill-2)
    }

    .arco-btn-group .arco-btn-status-danger:not(:last-child) {
        border-right: 1px solid rgb(var(--danger-5))
    }

    .arco-btn-group .arco-btn-status-danger:not(:last-child).arco-btn-text {
        border-right: 1px solid var(--color-fill-2)
    }

    .arco-btn-group .arco-btn-status-success:not(:last-child) {
        border-right: 1px solid rgb(var(--success-5))
    }

    .arco-btn-group .arco-btn-status-success:not(:last-child).arco-btn-text {
        border-right: 1px solid var(--color-fill-2)
    }

    .arco-btn-group .arco-btn-rtl.arco-btn-outline:not(:first-child),
    .arco-btn-group .arco-btn-rtl.arco-btn-dashed:not(:first-child) {
        margin-left: 0;
        margin-right: -1px
    }

    .arco-btn-group .arco-btn-rtl.arco-btn-primary:not(:last-child) {
        border-left: 1px solid rgb(var(--primary-5));
        border-right: 0
    }

    .arco-btn-group .arco-btn-rtl.arco-btn-secondary:not(:last-child) {
        border-left: 1px solid var(--color-secondary-hover);
        border-right: 0
    }

    .arco-btn-group .arco-btn-rtl.arco-btn-text:not(:last-child) {
        border-left: 1px solid transparent;
        border-right: 0
    }

    .arco-btn-group .arco-btn-rtl.arco-btn-status-warning:not(:last-child) {
        border-left: 1px solid rgb(var(--warning-5));
        border-right: 0
    }

    .arco-btn-group .arco-btn-rtl.arco-btn-status-warning:not(:last-child).arco-btn-text {
        border-left: 1px solid var(--color-fill-2)
    }

    .arco-btn-group .arco-btn-rtl.arco-btn-status-danger:not(:last-child) {
        border-left: 1px solid rgb(var(--danger-5));
        border-right: 0
    }

    .arco-btn-group .arco-btn-rtl.arco-btn-status-danger:not(:last-child).arco-btn-text {
        border-left: 1px solid var(--color-fill-2)
    }

    .arco-btn-group .arco-btn-rtl.arco-btn-status-success:not(:last-child) {
        border-left: 1px solid rgb(var(--success-5));
        border-right: 0
    }

    .arco-btn-group .arco-btn-rtl.arco-btn-status-success:not(:last-child).arco-btn-text {
        border-left: 1px solid var(--color-fill-2)
    }

    .arco-btn-group .arco-btn-outline:hover,
    .arco-btn-group .arco-btn-dashed:hover,
    .arco-btn-group .arco-btn-outline:active,
    .arco-btn-group .arco-btn-dashed:active {
        z-index: 2
    }

    .arco-btn-group .arco-btn:not(:first-child):not(:last-child) {
        border-radius: 0
    }

    .arco-btn-rtl {
        direction: rtl
    }

    body[arco-theme=dark] .arco-btn-primary.arco-btn-disabled {
        color: rgba(255, 255, 255, .3)
    }
}


@layer base {
    .arco-trigger {
        z-index: 1000;
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden;
        position: absolute
    }

    .arco-trigger-arrow {
        background-color: var(--color-bg-5);
        content: "";
        box-sizing: border-box;
        width: 8px;
        height: 8px;
        transform-origin: 50% 50% 0;
        z-index: -1;
        display: block;
        position: absolute;
        transform: rotate(45deg)
    }

    .arco-trigger[trigger-placement=top]>.arco-trigger-arrow-container .arco-trigger-arrow,
    .arco-trigger[trigger-placement=tl]>.arco-trigger-arrow-container .arco-trigger-arrow,
    .arco-trigger[trigger-placement=tr]>.arco-trigger-arrow-container .arco-trigger-arrow {
        border-top: none;
        border-left: none;
        border-bottom-right-radius: 2px;
        margin-left: -4px;
        bottom: -4px
    }

    .arco-trigger[trigger-placement=bottom]>.arco-trigger-arrow-container .arco-trigger-arrow,
    .arco-trigger[trigger-placement=bl]>.arco-trigger-arrow-container .arco-trigger-arrow,
    .arco-trigger[trigger-placement=br]>.arco-trigger-arrow-container .arco-trigger-arrow {
        border-bottom: none;
        border-right: none;
        border-top-left-radius: 2px;
        margin-left: -4px;
        top: -4px
    }

    .arco-trigger[trigger-placement=left]>.arco-trigger-arrow-container .arco-trigger-arrow,
    .arco-trigger[trigger-placement=lt]>.arco-trigger-arrow-container .arco-trigger-arrow,
    .arco-trigger[trigger-placement=lb]>.arco-trigger-arrow-container .arco-trigger-arrow {
        border-bottom: none;
        border-left: none;
        border-top-right-radius: 2px;
        margin-top: -4px;
        right: -4px
    }

    .arco-trigger[trigger-placement=right]>.arco-trigger-arrow-container .arco-trigger-arrow,
    .arco-trigger[trigger-placement=rt]>.arco-trigger-arrow-container .arco-trigger-arrow,
    .arco-trigger[trigger-placement=rb]>.arco-trigger-arrow-container .arco-trigger-arrow {
        border-top: none;
        border-right: none;
        border-bottom-left-radius: 2px;
        margin-top: -4px;
        left: -4px
    }

    .arco-trigger-rtl {
        direction: rtl
    }
}


@layer base {
    .arco-dropdown-menu {
        box-sizing: border-box;
        border: 1px solid var(--color-fill-3);
        border-radius: var(--border-radius-medium);
        background-color: var(--color-bg-popup);
        max-height: 200px;
        padding: 4px 0;
        position: relative;
        overflow: auto;
        box-shadow: 0 4px 10px rgba(0, 0, 0, .1)
    }

    .arco-dropdown-menu-hidden {
        display: none
    }

    .arco-dropdown-menu-item,
    .arco-dropdown-menu-pop-header {
        box-sizing: border-box;
        text-align: left;
        cursor: pointer;
        z-index: 1;
        white-space: nowrap;
        text-overflow: ellipsis;
        width: 100%;
        height: 36px;
        color: var(--color-text-1);
        background-color: transparent;
        padding: 0 12px;
        font-size: 14px;
        line-height: 36px;
        position: relative;
        overflow: hidden
    }

    .arco-dropdown-menu-item.arco-dropdown-menu-selected,
    .arco-dropdown-menu-pop-header.arco-dropdown-menu-selected {
        color: var(--color-text-1);
        background-color: transparent;
        font-weight: 500;
        transition: all .1s cubic-bezier(0, 0, 1, 1)
    }

    .arco-dropdown-menu-item:hover,
    .arco-dropdown-menu-pop-header:hover {
        color: var(--color-text-1);
        background-color: var(--color-fill-2)
    }

    .arco-dropdown-menu-item:focus-visible {
        box-shadow: 0 0 0 2px rgb(var(--primary-6))inset
    }

    .arco-dropdown-menu-pop-header:focus-visible {
        box-shadow: 0 0 0 2px rgb(var(--primary-6))inset
    }

    .arco-dropdown-menu-item.arco-dropdown-menu-active,
    .arco-dropdown-menu-pop-header.arco-dropdown-menu-active {
        box-shadow: 0 0 0 1px rgb(var(--primary-6))inset
    }

    .arco-dropdown-menu-item.arco-dropdown-menu-disabled,
    .arco-dropdown-menu-pop-header.arco-dropdown-menu-disabled {
        color: var(--color-text-4);
        cursor: not-allowed;
        background-color: transparent
    }

    .arco-dropdown-menu-item a,
    .arco-dropdown-menu-pop-header a,
    .arco-dropdown-menu-item a:hover,
    .arco-dropdown-menu-pop-header a:hover,
    .arco-dropdown-menu-item a:focus,
    .arco-dropdown-menu-pop-header a:focus,
    .arco-dropdown-menu-item a:active,
    .arco-dropdown-menu-pop-header a:active {
        color: inherit;
        cursor: inherit;
        text-decoration: none
    }

    .arco-dropdown-menu-item>a:only-child:before,
    .arco-dropdown-menu-pop-header>a:only-child:before {
        content: "";
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0
    }

    .arco-dropdown-menu-pop-header {
        justify-content: space-between;
        align-items: center;
        display: flex
    }

    .arco-dropdown-menu-pop-header .arco-dropdown-menu-icon-suffix {
        margin-left: 12px
    }

    .arco-dropdown-menu-group:first-child .arco-dropdown-menu-group-title {
        margin-top: 4px
    }

    .arco-dropdown-menu-group-title {
        box-sizing: border-box;
        width: 100%;
        color: var(--color-text-3);
        white-space: nowrap;
        text-overflow: ellipsis;
        margin-top: 8px;
        padding: 0 12px;
        font-size: 12px;
        line-height: 20px;
        overflow: hidden
    }

    .arco-dropdown-menu-dark {
        border-color: var(--color-menu-dark-bg);
        background-color: var(--color-menu-dark-bg)
    }

    .arco-dropdown-menu-dark .arco-dropdown-menu-item,
    .arco-dropdown-menu-dark .arco-dropdown-menu-pop-header {
        color: var(--color-text-4);
        background-color: transparent
    }

    .arco-dropdown-menu-dark .arco-dropdown-menu-item.arco-dropdown-menu-selected,
    .arco-dropdown-menu-dark .arco-dropdown-menu-pop-header.arco-dropdown-menu-selected {
        color: var(--color-white);
        background-color: transparent
    }

    .arco-dropdown-menu-dark .arco-dropdown-menu-item.arco-dropdown-menu-selected:hover,
    .arco-dropdown-menu-dark .arco-dropdown-menu-pop-header.arco-dropdown-menu-selected:hover {
        color: var(--color-white)
    }

    .arco-dropdown-menu-dark .arco-dropdown-menu-item:hover,
    .arco-dropdown-menu-dark .arco-dropdown-menu-pop-header:hover {
        color: var(--color-text-4);
        background-color: var(--color-menu-dark-hover)
    }

    .arco-dropdown-menu-dark .arco-dropdown-menu-item.arco-dropdown-menu-disabled,
    .arco-dropdown-menu-dark .arco-dropdown-menu-pop-header.arco-dropdown-menu-disabled {
        color: var(--color-text-2);
        background-color: transparent
    }

    .arco-dropdown-menu-dark .arco-dropdown-menu-group-title {
        color: var(--color-text-3)
    }

    .arco-dropdown-menu-pop-trigger .arco-trigger-arrow {
        display: none
    }

    .arco-dropdown-menu+.arco-trigger-arrow {
        background-color: var(--color-bg-popup)
    }

    .arco-dropdown-menu-rtl .arco-dropdown-menu-item,
    .arco-dropdown-menu-rtl .arco-dropdown-menu-pop-header {
        text-align: right
    }

    .arco-dropdown-menu-rtl .arco-dropdown-menu-item .arco-dropdown-menu-icon-suffix,
    .arco-dropdown-menu-rtl .arco-dropdown-menu-pop-header .arco-dropdown-menu-icon-suffix {
        margin-left: 0;
        margin-right: 12px
    }
}


@layer base {
    .arco-tooltip-content {
        background-color: var(--color-tooltip-bg);
        border-radius: var(--border-radius-small);
        color: #fff;
        padding: 8px 12px;
        font-size: 14px;
        line-height: 1.5715;
        box-shadow: 0 4px 10px rgba(0, 0, 0, .1)
    }

    .arco-tooltip-content-inner {
        word-wrap: break-word
    }

    .arco-tooltip-content-inner:not(:-webkit-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
        text-align: left
    }

    .arco-tooltip-content-inner:not(:-moz-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
        text-align: left
    }

    .arco-tooltip-content-inner:not(:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
        text-align: left
    }

    .arco-tooltip-content-inner:-webkit-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
        text-align: right
    }

    .arco-tooltip-content-inner:-moz-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
        text-align: right
    }

    .arco-tooltip-content-inner:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
        text-align: right
    }

    .arco-tooltip-mini {
        padding: 4px 12px;
        font-size: 14px
    }

    .arco-trigger-arrow.arco-tooltip-arrow {
        background-color: var(--color-tooltip-bg)
    }

    body[arco-theme=dark] .arco-tooltip-content {
        border: 1px solid var(--color-neutral-3)
    }

    body[arco-theme=dark] .arco-tooltip .arco-trigger-arrow.arco-tooltip-arrow {
        z-index: 1
    }

    body[arco-theme=dark] .arco-trigger[trigger-placement=top] .arco-trigger-arrow.arco-tooltip-arrow,
    body[arco-theme=dark] .arco-trigger[trigger-placement=tl] .arco-trigger-arrow.arco-tooltip-arrow,
    body[arco-theme=dark] .arco-trigger[trigger-placement=tr] .arco-trigger-arrow.arco-tooltip-arrow {
        border-bottom: 1px solid var(--color-neutral-3);
        border-right: 1px solid var(--color-neutral-3)
    }

    body[arco-theme=dark] .arco-trigger[trigger-placement=bottom] .arco-trigger-arrow.arco-tooltip-arrow,
    body[arco-theme=dark] .arco-trigger[trigger-placement=bl] .arco-trigger-arrow.arco-tooltip-arrow,
    body[arco-theme=dark] .arco-trigger[trigger-placement=br] .arco-trigger-arrow.arco-tooltip-arrow {
        border-top: 1px solid var(--color-neutral-3);
        border-left: 1px solid var(--color-neutral-3)
    }

    body[arco-theme=dark] .arco-trigger[trigger-placement=left] .arco-trigger-arrow.arco-tooltip-arrow,
    body[arco-theme=dark] .arco-trigger[trigger-placement=lt] .arco-trigger-arrow.arco-tooltip-arrow,
    body[arco-theme=dark] .arco-trigger[trigger-placement=lb] .arco-trigger-arrow.arco-tooltip-arrow {
        border-top: 1px solid var(--color-neutral-3);
        border-right: 1px solid var(--color-neutral-3)
    }

    body[arco-theme=dark] .arco-trigger[trigger-placement=right] .arco-trigger-arrow.arco-tooltip-arrow,
    body[arco-theme=dark] .arco-trigger[trigger-placement=rt] .arco-trigger-arrow.arco-tooltip-arrow,
    body[arco-theme=dark] .arco-trigger[trigger-placement=rb] .arco-trigger-arrow.arco-tooltip-arrow {
        border-left: 1px solid var(--color-neutral-3);
        border-bottom: 1px solid var(--color-neutral-3)
    }
}


@layer base {
    @keyframes arco-menu-selected-item-label-enter {
        0% {
            opacity: 0
        }

        to {
            opacity: 1
        }
    }

    .arco-menu {
        box-sizing: border-box;
        width: 100%;
        font-size: 14px;
        line-height: 1.5715;
        transition: width .2s cubic-bezier(.34, .69, .1, 1);
        position: relative
    }

    .arco-menu-indent {
        width: 20px;
        display: inline-block
    }

    .arco-menu .arco-menu-item,
    .arco-menu .arco-menu-group-title,
    .arco-menu .arco-menu-pop-header,
    .arco-menu .arco-menu-inline-header {
        border-radius: var(--border-radius-small);
        box-sizing: border-box;
        cursor: pointer;
        position: relative
    }

    .arco-menu .arco-menu-item.arco-menu-disabled,
    .arco-menu .arco-menu-group-title.arco-menu-disabled,
    .arco-menu .arco-menu-pop-header.arco-menu-disabled,
    .arco-menu .arco-menu-inline-header.arco-menu-disabled {
        cursor: not-allowed
    }

    .arco-menu .arco-menu-item.arco-menu-selected,
    .arco-menu .arco-menu-group-title.arco-menu-selected,
    .arco-menu .arco-menu-pop-header.arco-menu-selected,
    .arco-menu .arco-menu-inline-header.arco-menu-selected {
        font-weight: 500;
        transition: color .2s cubic-bezier(0, 0, 1, 1)
    }

    .arco-menu .arco-menu-item.arco-menu-selected svg,
    .arco-menu .arco-menu-group-title.arco-menu-selected svg,
    .arco-menu .arco-menu-pop-header.arco-menu-selected svg,
    .arco-menu .arco-menu-inline-header.arco-menu-selected svg {
        transition: color .2s cubic-bezier(0, 0, 1, 1)
    }

    .arco-menu .arco-menu-item .arco-icon,
    .arco-menu .arco-menu-group-title .arco-icon,
    .arco-menu .arco-menu-pop-header .arco-icon,
    .arco-menu .arco-menu-inline-header .arco-icon {
        margin-right: 16px
    }

    .arco-menu-light {
        background-color: var(--color-menu-light-bg)
    }

    .arco-menu-light .arco-menu-item,
    .arco-menu-light .arco-menu-group-title,
    .arco-menu-light .arco-menu-pop-header,
    .arco-menu-light .arco-menu-inline-header {
        background-color: var(--color-menu-light-bg);
        color: var(--color-text-2)
    }

    .arco-menu-light .arco-menu-item .arco-icon,
    .arco-menu-light .arco-menu-group-title .arco-icon,
    .arco-menu-light .arco-menu-pop-header .arco-icon,
    .arco-menu-light .arco-menu-inline-header .arco-icon {
        color: var(--color-text-3)
    }

    .arco-menu-light .arco-menu-item:hover,
    .arco-menu-light .arco-menu-group-title:hover,
    .arco-menu-light .arco-menu-pop-header:hover,
    .arco-menu-light .arco-menu-inline-header:hover {
        background-color: var(--color-fill-2);
        color: var(--color-text-2)
    }

    .arco-menu-light .arco-menu-item:hover .arco-icon,
    .arco-menu-light .arco-menu-group-title:hover .arco-icon,
    .arco-menu-light .arco-menu-pop-header:hover .arco-icon,
    .arco-menu-light .arco-menu-inline-header:hover .arco-icon {
        color: var(--color-text-3)
    }

    .arco-menu-light .arco-menu-item:focus-visible {
        box-shadow: 0 0 0 2px rgb(var(--primary-6))inset
    }

    .arco-menu-light .arco-menu-group-title:focus-visible {
        box-shadow: 0 0 0 2px rgb(var(--primary-6))inset
    }

    .arco-menu-light .arco-menu-pop-header:focus-visible {
        box-shadow: 0 0 0 2px rgb(var(--primary-6))inset
    }

    .arco-menu-light .arco-menu-inline-header:focus-visible {
        box-shadow: 0 0 0 2px rgb(var(--primary-6))inset
    }

    .arco-menu-light .arco-menu-item.arco-menu-selected,
    .arco-menu-light .arco-menu-group-title.arco-menu-selected,
    .arco-menu-light .arco-menu-pop-header.arco-menu-selected,
    .arco-menu-light .arco-menu-inline-header.arco-menu-selected,
    .arco-menu-light .arco-menu-item.arco-menu-selected .arco-icon,
    .arco-menu-light .arco-menu-group-title.arco-menu-selected .arco-icon,
    .arco-menu-light .arco-menu-pop-header.arco-menu-selected .arco-icon,
    .arco-menu-light .arco-menu-inline-header.arco-menu-selected .arco-icon {
        color: rgb(var(--primary-6))
    }

    .arco-menu-light .arco-menu-item.arco-menu-disabled,
    .arco-menu-light .arco-menu-group-title.arco-menu-disabled,
    .arco-menu-light .arco-menu-pop-header.arco-menu-disabled,
    .arco-menu-light .arco-menu-inline-header.arco-menu-disabled {
        background-color: var(--color-menu-light-bg);
        color: var(--color-text-4)
    }

    .arco-menu-light .arco-menu-item.arco-menu-disabled .arco-icon,
    .arco-menu-light .arco-menu-group-title.arco-menu-disabled .arco-icon,
    .arco-menu-light .arco-menu-pop-header.arco-menu-disabled .arco-icon,
    .arco-menu-light .arco-menu-inline-header.arco-menu-disabled .arco-icon {
        color: var(--color-text-4)
    }

    .arco-menu-light .arco-menu-item.arco-menu-selected {
        background-color: var(--color-fill-2)
    }

    .arco-menu-light .arco-menu-inline-header.arco-menu-selected,
    .arco-menu-light .arco-menu-inline-header.arco-menu-selected .arco-icon {
        color: rgb(var(--primary-6))
    }

    .arco-menu-light .arco-menu-inline-header.arco-menu-selected:hover {
        background-color: var(--color-fill-2)
    }

    .arco-menu-light.arco-menu-horizontal .arco-menu-item.arco-menu-selected,
    .arco-menu-light.arco-menu-horizontal .arco-menu-group-title.arco-menu-selected,
    .arco-menu-light.arco-menu-horizontal .arco-menu-pop-header.arco-menu-selected,
    .arco-menu-light.arco-menu-horizontal .arco-menu-inline-header.arco-menu-selected {
        background: 0 0;
        transition: color .2s cubic-bezier(0, 0, 1, 1)
    }

    .arco-menu-light.arco-menu-horizontal .arco-menu-item.arco-menu-selected:hover,
    .arco-menu-light.arco-menu-horizontal .arco-menu-group-title.arco-menu-selected:hover,
    .arco-menu-light.arco-menu-horizontal .arco-menu-pop-header.arco-menu-selected:hover,
    .arco-menu-light.arco-menu-horizontal .arco-menu-inline-header.arco-menu-selected:hover {
        background-color: var(--color-fill-2)
    }

    .arco-menu-light .arco-menu-group-title {
        color: var(--color-text-3);
        pointer-events: none
    }

    .arco-menu-light .arco-menu-collapse-button {
        background-color: var(--color-fill-1);
        color: var(--color-text-3)
    }

    .arco-menu-light .arco-menu-collapse-button:hover {
        background-color: var(--color-fill-3)
    }

    .arco-menu-light .arco-menu-collapse-button:focus-visible {
        box-shadow: 0 0 0 2px rgb(var(--primary-6))
    }

    .arco-menu-dark {
        background-color: var(--color-menu-dark-bg)
    }

    .arco-menu-dark .arco-menu-item,
    .arco-menu-dark .arco-menu-group-title,
    .arco-menu-dark .arco-menu-pop-header,
    .arco-menu-dark .arco-menu-inline-header {
        background-color: var(--color-menu-dark-bg);
        color: var(--color-text-4)
    }

    .arco-menu-dark .arco-menu-item .arco-icon,
    .arco-menu-dark .arco-menu-group-title .arco-icon,
    .arco-menu-dark .arco-menu-pop-header .arco-icon,
    .arco-menu-dark .arco-menu-inline-header .arco-icon {
        color: var(--color-text-3)
    }

    .arco-menu-dark .arco-menu-item:hover,
    .arco-menu-dark .arco-menu-group-title:hover,
    .arco-menu-dark .arco-menu-pop-header:hover,
    .arco-menu-dark .arco-menu-inline-header:hover {
        background-color: var(--color-menu-dark-hover);
        color: var(--color-text-4)
    }

    .arco-menu-dark .arco-menu-item:hover .arco-icon,
    .arco-menu-dark .arco-menu-group-title:hover .arco-icon,
    .arco-menu-dark .arco-menu-pop-header:hover .arco-icon,
    .arco-menu-dark .arco-menu-inline-header:hover .arco-icon {
        color: var(--color-text-3)
    }

    .arco-menu-dark .arco-menu-item:focus-visible {
        box-shadow: 0 0 0 2px rgb(var(--primary-6))inset
    }

    .arco-menu-dark .arco-menu-group-title:focus-visible {
        box-shadow: 0 0 0 2px rgb(var(--primary-6))inset
    }

    .arco-menu-dark .arco-menu-pop-header:focus-visible {
        box-shadow: 0 0 0 2px rgb(var(--primary-6))inset
    }

    .arco-menu-dark .arco-menu-inline-header:focus-visible {
        box-shadow: 0 0 0 2px rgb(var(--primary-6))inset
    }

    .arco-menu-dark .arco-menu-item.arco-menu-selected,
    .arco-menu-dark .arco-menu-group-title.arco-menu-selected,
    .arco-menu-dark .arco-menu-pop-header.arco-menu-selected,
    .arco-menu-dark .arco-menu-inline-header.arco-menu-selected,
    .arco-menu-dark .arco-menu-item.arco-menu-selected .arco-icon,
    .arco-menu-dark .arco-menu-group-title.arco-menu-selected .arco-icon,
    .arco-menu-dark .arco-menu-pop-header.arco-menu-selected .arco-icon,
    .arco-menu-dark .arco-menu-inline-header.arco-menu-selected .arco-icon {
        color: var(--color-white)
    }

    .arco-menu-dark .arco-menu-item.arco-menu-disabled,
    .arco-menu-dark .arco-menu-group-title.arco-menu-disabled,
    .arco-menu-dark .arco-menu-pop-header.arco-menu-disabled,
    .arco-menu-dark .arco-menu-inline-header.arco-menu-disabled {
        background-color: var(--color-menu-dark-bg);
        color: var(--color-text-2)
    }

    .arco-menu-dark .arco-menu-item.arco-menu-disabled .arco-icon,
    .arco-menu-dark .arco-menu-group-title.arco-menu-disabled .arco-icon,
    .arco-menu-dark .arco-menu-pop-header.arco-menu-disabled .arco-icon,
    .arco-menu-dark .arco-menu-inline-header.arco-menu-disabled .arco-icon {
        color: var(--color-text-2)
    }

    .arco-menu-dark .arco-menu-item.arco-menu-selected {
        background-color: var(--color-menu-dark-hover)
    }

    .arco-menu-dark .arco-menu-inline-header.arco-menu-selected,
    .arco-menu-dark .arco-menu-inline-header.arco-menu-selected .arco-icon {
        color: rgb(var(--primary-6))
    }

    .arco-menu-dark .arco-menu-inline-header.arco-menu-selected:hover {
        background-color: var(--color-menu-dark-hover)
    }

    .arco-menu-dark.arco-menu-horizontal .arco-menu-item.arco-menu-selected,
    .arco-menu-dark.arco-menu-horizontal .arco-menu-group-title.arco-menu-selected,
    .arco-menu-dark.arco-menu-horizontal .arco-menu-pop-header.arco-menu-selected,
    .arco-menu-dark.arco-menu-horizontal .arco-menu-inline-header.arco-menu-selected {
        background: 0 0;
        transition: color .2s cubic-bezier(0, 0, 1, 1)
    }

    .arco-menu-dark.arco-menu-horizontal .arco-menu-item.arco-menu-selected:hover,
    .arco-menu-dark.arco-menu-horizontal .arco-menu-group-title.arco-menu-selected:hover,
    .arco-menu-dark.arco-menu-horizontal .arco-menu-pop-header.arco-menu-selected:hover,
    .arco-menu-dark.arco-menu-horizontal .arco-menu-inline-header.arco-menu-selected:hover {
        background-color: var(--color-menu-dark-hover)
    }

    .arco-menu-dark .arco-menu-group-title {
        color: var(--color-text-3);
        pointer-events: none
    }

    .arco-menu-dark .arco-menu-collapse-button {
        background-color: rgb(var(--primary-6));
        color: var(--color-white)
    }

    .arco-menu-dark .arco-menu-collapse-button:hover {
        background-color: rgb(var(--primary-7))
    }

    .arco-menu-dark .arco-menu-collapse-button:focus-visible {
        box-shadow: 0 0 0 2px rgb(var(--primary-6))
    }

    .arco-menu a,
    .arco-menu a:hover,
    .arco-menu a:focus,
    .arco-menu a:active {
        color: inherit;
        cursor: inherit;
        text-decoration: none
    }

    .arco-menu-item-inner>a:only-child:before {
        content: "";
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0
    }

    .arco-menu-inner {
        box-sizing: border-box;
        width: 100%;
        height: 100%;
        overflow: auto
    }

    .arco-menu-vertical .arco-menu-item,
    .arco-menu-vertical .arco-menu-group-title,
    .arco-menu-vertical .arco-menu-pop-header,
    .arco-menu-vertical .arco-menu-inline-header {
        padding: 0 12px;
        line-height: 40px
    }

    .arco-menu-vertical .arco-menu-item .arco-menu-icon-suffix .arco-icon,
    .arco-menu-vertical .arco-menu-group-title .arco-menu-icon-suffix .arco-icon,
    .arco-menu-vertical .arco-menu-pop-header .arco-menu-icon-suffix .arco-icon,
    .arco-menu-vertical .arco-menu-inline-header .arco-menu-icon-suffix .arco-icon {
        margin-right: 0
    }

    .arco-menu-vertical .arco-menu-item,
    .arco-menu-vertical .arco-menu-group-title,
    .arco-menu-vertical .arco-menu-pop-header,
    .arco-menu-vertical .arco-menu-inline-header {
        white-space: nowrap;
        text-overflow: ellipsis;
        margin-bottom: 4px;
        overflow: hidden
    }

    .arco-menu-vertical .arco-menu-item .arco-menu-item-inner,
    .arco-menu-vertical .arco-menu-group-title .arco-menu-item-inner,
    .arco-menu-vertical .arco-menu-pop-header .arco-menu-item-inner,
    .arco-menu-vertical .arco-menu-inline-header .arco-menu-item-inner {
        white-space: nowrap;
        text-overflow: ellipsis;
        width: 100%;
        overflow: hidden
    }

    .arco-menu-vertical .arco-menu-item .arco-menu-icon-suffix,
    .arco-menu-vertical .arco-menu-group-title .arco-menu-icon-suffix,
    .arco-menu-vertical .arco-menu-pop-header .arco-menu-icon-suffix,
    .arco-menu-vertical .arco-menu-inline-header .arco-menu-icon-suffix {
        position: absolute;
        top: 50%;
        right: 12px;
        transform: translateY(-50%)
    }

    .arco-menu-vertical .arco-menu-item .arco-menu-icon-suffix.is-open,
    .arco-menu-vertical .arco-menu-group-title .arco-menu-icon-suffix.is-open,
    .arco-menu-vertical .arco-menu-pop-header .arco-menu-icon-suffix.is-open,
    .arco-menu-vertical .arco-menu-inline-header .arco-menu-icon-suffix.is-open {
        transform: translateY(-50%)rotate(180deg)
    }

    .arco-menu-vertical .arco-menu-inner {
        padding: 4px 8px
    }

    .arco-menu-vertical .arco-menu-item.arco-menu-item-indented {
        display: flex
    }

    .arco-menu-vertical .arco-menu-pop-header,
    .arco-menu-vertical .arco-menu-inline-header {
        padding-right: 28px
    }

    .arco-menu-horizontal {
        width: auto;
        height: auto
    }

    .arco-menu-horizontal .arco-menu-item,
    .arco-menu-horizontal .arco-menu-group-title,
    .arco-menu-horizontal .arco-menu-pop-header,
    .arco-menu-horizontal .arco-menu-inline-header {
        padding: 0 12px;
        line-height: 30px
    }

    .arco-menu-horizontal .arco-menu-item .arco-menu-icon-suffix .arco-icon,
    .arco-menu-horizontal .arco-menu-group-title .arco-menu-icon-suffix .arco-icon,
    .arco-menu-horizontal .arco-menu-pop-header .arco-menu-icon-suffix .arco-icon,
    .arco-menu-horizontal .arco-menu-inline-header .arco-menu-icon-suffix .arco-icon {
        margin-right: 0
    }

    .arco-menu-horizontal .arco-menu-item .arco-icon,
    .arco-menu-horizontal .arco-menu-group-title .arco-icon,
    .arco-menu-horizontal .arco-menu-pop-header .arco-icon,
    .arco-menu-horizontal .arco-menu-inline-header .arco-icon {
        margin-right: 8px
    }

    .arco-menu-horizontal .arco-menu-item .arco-menu-icon-suffix,
    .arco-menu-horizontal .arco-menu-group-title .arco-menu-icon-suffix,
    .arco-menu-horizontal .arco-menu-pop-header .arco-menu-icon-suffix,
    .arco-menu-horizontal .arco-menu-inline-header .arco-menu-icon-suffix {
        margin-left: 6px
    }

    .arco-menu-horizontal .arco-menu-inner {
        align-items: center;
        padding: 14px 20px;
        display: flex
    }

    .arco-menu-horizontal .arco-menu-item,
    .arco-menu-horizontal .arco-menu-pop {
        vertical-align: middle;
        flex-shrink: 0;
        display: inline-block
    }

    .arco-menu-horizontal .arco-menu-item:not(:first-child),
    .arco-menu-horizontal .arco-menu-pop:not(:first-child) {
        margin-left: 12px
    }

    .arco-menu-horizontal .arco-menu-pop:after {
        content: " ";
        width: 100%;
        height: 14px;
        position: absolute;
        bottom: -14px;
        left: 0
    }

    .arco-menu-overflow-wrap {
        width: 100%
    }

    .arco-menu-overflow-sub-menu-mirror {
        margin-left: 12px
    }

    .arco-menu-overflow-sub-menu-mirror,
    .arco-menu-overflow-hidden-menu-item {
        white-space: nowrap;
        visibility: hidden;
        pointer-events: none;
        position: absolute !important
    }

    .arco-menu-selected-label {
        background-color: rgb(var(--primary-6));
        height: 3px;
        animation: .2s cubic-bezier(0, 0, 1, 1) arco-menu-selected-item-label-enter;
        position: absolute;
        bottom: -14px;
        left: 12px;
        right: 12px
    }

    .arco-menu-pop-button {
        width: auto;
        box-shadow: none;
        background: 0 0
    }

    .arco-menu-pop-button.arco-menu-collapse {
        width: auto
    }

    .arco-menu-pop-button .arco-menu-item,
    .arco-menu-pop-button .arco-menu-group-title,
    .arco-menu-pop-button .arco-menu-pop-header,
    .arco-menu-pop-button .arco-menu-inline-header {
        border: 1px solid transparent;
        border-radius: 50%;
        width: 40px;
        height: 40px;
        margin-bottom: 16px;
        line-height: 40px;
        box-shadow: 0 4px 10px rgba(0, 0, 0, .1)
    }

    .arco-menu-collapse {
        width: 48px
    }

    .arco-menu-collapse .arco-menu-inner {
        padding: 4px
    }

    .arco-menu-collapse .arco-menu-group-title,
    .arco-menu-collapse .arco-menu-icon-suffix {
        display: none
    }

    .arco-menu-collapse .arco-menu-item .arco-icon,
    .arco-menu-collapse .arco-menu-group-title .arco-icon,
    .arco-menu-collapse .arco-menu-pop-header .arco-icon,
    .arco-menu-collapse .arco-menu-inline-header .arco-icon {
        margin-left: 1px;
        margin-right: 100vw
    }

    .arco-menu-collapse .arco-menu-collapse-button {
        right: unset;
        left: 50%;
        transform: translate(-50%)
    }

    .arco-menu-collapse-button {
        border-radius: var(--border-radius-small);
        cursor: pointer;
        justify-content: center;
        align-items: center;
        width: 24px;
        height: 24px;
        display: flex;
        position: absolute;
        bottom: 12px;
        right: 12px
    }

    .arco-menu-inline-content {
        height: auto;
        transition: height .2s cubic-bezier(.34, .69, .1, 1);
        overflow: hidden
    }

    .arco-menu-item-tooltip a {
        color: inherit;
        cursor: pointer;
        text-decoration: none
    }

    .arco-menu-item-tooltip a:hover,
    .arco-menu-item-tooltip a:focus,
    .arco-menu-item-tooltip a:active {
        color: inherit
    }

    .arco-menu-item-tooltip a:before {
        content: "";
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0
    }

    .arco-menu-pop-trigger.arco-trigger-position-bl {
        transform: translateY(14px)
    }

    .arco-menu-pop-trigger.arco-trigger-position-bl .arco-trigger-arrow {
        z-index: 0;
        border-left: 1px solid var(--color-neutral-3);
        border-top: 1px solid var(--color-neutral-3)
    }

    .arco-menu-pop-trigger.arco-trigger[trigger-placement=rt] {
        transform: translate(8px)
    }

    .arco-menu-pop-trigger.arco-trigger[trigger-placement=rt] .arco-trigger-arrow {
        z-index: 0;
        border-left: 1px solid var(--color-neutral-3);
        border-bottom: 1px solid var(--color-neutral-3)
    }

    .arco-menu-pop-trigger.arco-trigger[trigger-placement=lt] {
        transform: translate(-8px)
    }

    .arco-menu-pop-trigger.arco-trigger[trigger-placement=lt] .arco-trigger-arrow {
        z-index: 0;
        border-right: 1px solid var(--color-neutral-3);
        border-top: 1px solid var(--color-neutral-3)
    }

    .arco-menu-pop-trigger .arco-dropdown-menu-dark~.arco-trigger-arrow-container .arco-trigger-arrow {
        background-color: var(--color-menu-dark-bg);
        border-color: var(--color-menu-dark-bg)
    }

    .arco-menu-rtl {
        direction: rtl
    }

    .arco-menu-rtl .arco-menu-item .arco-icon,
    .arco-menu-rtl .arco-menu-group-title .arco-icon,
    .arco-menu-rtl .arco-menu-pop-header .arco-icon,
    .arco-menu-rtl .arco-menu-inline-header .arco-icon {
        margin-left: 16px;
        margin-right: 0
    }

    .arco-menu-rtl.arco-menu-horizontal .arco-menu-item .arco-menu-icon-suffix .arco-icon,
    .arco-menu-rtl.arco-menu-horizontal .arco-menu-group-title .arco-menu-icon-suffix .arco-icon,
    .arco-menu-rtl.arco-menu-horizontal .arco-menu-pop-header .arco-menu-icon-suffix .arco-icon,
    .arco-menu-rtl.arco-menu-horizontal .arco-menu-inline-header .arco-menu-icon-suffix .arco-icon {
        margin-left: 0
    }

    .arco-menu-rtl.arco-menu-horizontal .arco-menu-item .arco-icon,
    .arco-menu-rtl.arco-menu-horizontal .arco-menu-group-title .arco-icon,
    .arco-menu-rtl.arco-menu-horizontal .arco-menu-pop-header .arco-icon,
    .arco-menu-rtl.arco-menu-horizontal .arco-menu-inline-header .arco-icon {
        margin-left: 8px;
        margin-right: 0
    }

    .arco-menu-rtl.arco-menu-horizontal .arco-menu-item .arco-menu-icon-suffix,
    .arco-menu-rtl.arco-menu-horizontal .arco-menu-group-title .arco-menu-icon-suffix,
    .arco-menu-rtl.arco-menu-horizontal .arco-menu-pop-header .arco-menu-icon-suffix,
    .arco-menu-rtl.arco-menu-horizontal .arco-menu-inline-header .arco-menu-icon-suffix {
        margin-left: 0;
        margin-right: 6px
    }

    .arco-menu-rtl.arco-menu-horizontal .arco-menu-item:not(:first-child),
    .arco-menu-rtl.arco-menu-horizontal .arco-menu-pop:not(:first-child) {
        margin-left: 0;
        margin-right: 12px
    }

    .arco-menu-rtl.arco-menu-vertical .arco-menu-item .arco-menu-icon-suffix .arco-icon,
    .arco-menu-rtl.arco-menu-vertical .arco-menu-group-title .arco-menu-icon-suffix .arco-icon,
    .arco-menu-rtl.arco-menu-vertical .arco-menu-pop-header .arco-menu-icon-suffix .arco-icon,
    .arco-menu-rtl.arco-menu-vertical .arco-menu-inline-header .arco-menu-icon-suffix .arco-icon {
        margin-left: 0
    }

    .arco-menu-rtl.arco-menu-vertical .arco-menu-item,
    .arco-menu-rtl.arco-menu-vertical .arco-menu-group-title,
    .arco-menu-rtl.arco-menu-vertical .arco-menu-pop-header,
    .arco-menu-rtl.arco-menu-vertical .arco-menu-inline-header,
    .arco-menu-rtl.arco-menu-vertical .arco-menu-item .arco-menu-item-inner,
    .arco-menu-rtl.arco-menu-vertical .arco-menu-group-title .arco-menu-item-inner,
    .arco-menu-rtl.arco-menu-vertical .arco-menu-pop-header .arco-menu-item-inner,
    .arco-menu-rtl.arco-menu-vertical .arco-menu-inline-header .arco-menu-item-inner {
        text-overflow: clip
    }

    .arco-menu-rtl.arco-menu-vertical .arco-menu-item .arco-menu-icon-suffix,
    .arco-menu-rtl.arco-menu-vertical .arco-menu-group-title .arco-menu-icon-suffix,
    .arco-menu-rtl.arco-menu-vertical .arco-menu-pop-header .arco-menu-icon-suffix,
    .arco-menu-rtl.arco-menu-vertical .arco-menu-inline-header .arco-menu-icon-suffix {
        right: initial;
        left: 12px
    }

    .arco-menu-rtl.arco-menu-vertical .arco-menu-pop-header,
    .arco-menu-rtl.arco-menu-vertical .arco-menu-inline-header {
        padding-left: 28px;
        padding-right: 12px
    }

    .arco-menu-rtl .arco-menu-pop:after {
        right: 0;
        left: initial
    }

    .arco-menu-rtl .arco-menu-collapse .arco-menu-item .arco-icon,
    .arco-menu-rtl .arco-menu-collapse .arco-menu-group-title .arco-icon,
    .arco-menu-rtl .arco-menu-collapse .arco-menu-pop-header .arco-icon,
    .arco-menu-rtl .arco-menu-collapse .arco-menu-inline-header .arco-icon {
        margin-left: 100vw;
        margin-right: 1px
    }

    .arco-menu-rtl .arco-menu-pop-trigger.arco-trigger-position-bl .arco-trigger-arrow {
        border-left: none;
        border-right: 1px solid var(--color-neutral-3)
    }

    .arco-menu-rtl .arco-menu-pop-trigger.arco-trigger[trigger-placement=rt] {
        transform: translate(-8px)
    }

    .arco-menu-rtl .arco-menu-pop-trigger.arco-trigger[trigger-placement=lt] {
        transform: translate(8px)
    }

    .arco-menu-rtl .arco-menu-pop-trigger.arco-trigger[trigger-placement=lt] .arco-trigger-arrow {
        border-right: none;
        border-left: 1px solid var(--color-neutral-3)
    }
}


@layer base {
    .arco-input {
        -webkit-appearance: none;
        -moz-appearance: none;
        -ms-appearance: none;
        appearance: none;
        -webkit-tap-highlight-color: transparent;
        border-radius: var(--border-radius-small);
        width: 100%;
        color: var(--color-text-1);
        box-sizing: border-box;
        background-color: var(--color-fill-2);
        border: 1px solid transparent;
        outline: none;
        padding: 4px 12px;
        font-size: 14px;
        line-height: 1.5715;
        transition: color .1s cubic-bezier(0, 0, 1, 1), border-color .1s cubic-bezier(0, 0, 1, 1), background-color .1s cubic-bezier(0, 0, 1, 1)
    }

    .arco-input::placeholder {
        color: var(--color-text-3)
    }

    .arco-input::placeholder {
        color: var(--color-text-3)
    }

    .arco-input::placeholder {
        color: var(--color-text-3)
    }

    .arco-input:hover {
        background-color: var(--color-fill-3);
        border-color: transparent
    }

    .arco-input:focus,
    .arco-input.arco-input-focus {
        border-color: rgb(var(--primary-6));
        background-color: var(--color-bg-2);
        box-shadow: 0 0 0 0 var(--color-primary-light-2)
    }

    .arco-input-error {
        background-color: var(--color-danger-light-1);
        border-color: transparent
    }

    .arco-input-error:hover {
        background-color: var(--color-danger-light-2);
        border-color: transparent
    }

    .arco-input-error .arco-input,
    .arco-input-error .arco-input:hover {
        box-shadow: none;
        background: 0 0
    }

    .arco-input-error.arco-input-focus,
    .arco-input-error.arco-input-focus:hover,
    .arco-input-error:focus,
    .arco-input-error:focus:hover {
        border-color: rgb(var(--danger-6));
        background-color: var(--color-bg-2);
        box-shadow: 0 0 0 0 var(--color-danger-light-2)
    }

    .arco-input-warning {
        background-color: var(--color-warning-light-1);
        border-color: transparent
    }

    .arco-input-warning:hover {
        background-color: var(--color-warning-light-2);
        border-color: transparent
    }

    .arco-input-warning .arco-input,
    .arco-input-warning .arco-input:hover {
        box-shadow: none;
        background: 0 0
    }

    .arco-input-warning.arco-input-focus,
    .arco-input-warning.arco-input-focus:hover,
    .arco-input-warning:focus,
    .arco-input-warning:focus:hover {
        border-color: rgb(var(--warning-6));
        background-color: var(--color-bg-2);
        box-shadow: 0 0 0 0 var(--color-warning-light-2)
    }

    .arco-input-autowidth {
        text-overflow: ellipsis;
        flex: 1;
        overflow: hidden
    }

    .arco-input-autowidth:hover {
        text-overflow: unset
    }

    .arco-input-disabled {
        background-color: var(--color-fill-2);
        cursor: not-allowed;
        color: var(--color-text-4);
        -webkit-text-fill-color: var(--color-text-4);
        border-color: transparent
    }

    .arco-input-disabled:hover {
        background-color: var(--color-fill-2);
        color: var(--color-text-4);
        border-color: transparent
    }

    .arco-input-disabled::placeholder {
        color: var(--color-text-4)
    }

    .arco-input-disabled::placeholder {
        color: var(--color-text-4)
    }

    .arco-input-disabled::placeholder {
        color: var(--color-text-4)
    }

    .arco-input input:disabled {
        color: var(--color-text-4);
        opacity: 1;
        -webkit-text-fill-color: var(--color-text-4)
    }

    .arco-input-word-limit {
        color: var(--color-text-3);
        padding-left: 8px;
        font-size: 12px
    }

    .arco-input-word-limit-error {
        color: rgb(var(--danger-6))
    }

    .arco-input-size-mini {
        padding-top: 1px;
        padding-bottom: 1px;
        font-size: 12px;
        line-height: 1.667
    }

    .arco-input-size-small {
        padding-top: 2px;
        padding-bottom: 2px;
        font-size: 14px
    }

    .arco-input-size-large {
        padding-top: 6px;
        padding-bottom: 6px;
        font-size: 14px
    }

    .arco-input-group-wrapper-mini .arco-input-group-addbefore,
    .arco-input-group-wrapper-mini .arco-input-group-addafter,
    .arco-input-inner-wrapper.arco-input-inner-wrapper-mini,
    .arco-input-size-mini {
        padding-left: 8px;
        padding-right: 8px
    }

    .arco-input-group-wrapper-small .arco-input-group-addbefore,
    .arco-input-group-wrapper-small .arco-input-group-addafter,
    .arco-input-inner-wrapper.arco-input-inner-wrapper-small,
    .arco-input-size-small {
        padding-left: 12px;
        padding-right: 12px
    }

    .arco-input-group-wrapper-large .arco-input-group-addbefore,
    .arco-input-group-wrapper-large .arco-input-group-addafter,
    .arco-input-inner-wrapper.arco-input-inner-wrapper-large,
    .arco-input-size-large {
        padding-left: 16px;
        padding-right: 16px
    }

    .arco-input-clear-icon {
        cursor: pointer;
        color: var(--color-text-2);
        font-size: 12px
    }

    .arco-input-clear-icon:focus-visible:before {
        box-shadow: 0 0 0 2px rgb(var(--primary-6))
    }

    .arco-input-clear-icon>svg {
        transition: color .1s cubic-bezier(0, 0, 1, 1);
        position: relative
    }

    .arco-input-inner-wrapper {
        -webkit-appearance: none;
        -moz-appearance: none;
        -ms-appearance: none;
        appearance: none;
        -webkit-tap-highlight-color: transparent;
        border-radius: var(--border-radius-small);
        color: var(--color-text-1);
        box-sizing: border-box;
        background-color: var(--color-fill-2);
        border: 1px solid transparent;
        outline: none;
        align-items: center;
        width: 100%;
        padding-left: 12px;
        padding-right: 12px;
        font-size: 14px;
        transition: color .1s cubic-bezier(0, 0, 1, 1), border-color .1s cubic-bezier(0, 0, 1, 1), background-color .1s cubic-bezier(0, 0, 1, 1);
        display: inline-flex;
        position: relative
    }

    .arco-input-inner-wrapper::placeholder {
        color: var(--color-text-3)
    }

    .arco-input-inner-wrapper::placeholder {
        color: var(--color-text-3)
    }

    .arco-input-inner-wrapper::placeholder {
        color: var(--color-text-3)
    }

    .arco-input-inner-wrapper:hover {
        background-color: var(--color-fill-3);
        border-color: transparent
    }

    .arco-input-inner-wrapper:focus,
    .arco-input-inner-wrapper.arco-input-inner-wrapper-focus {
        border-color: rgb(var(--primary-6));
        background-color: var(--color-bg-2);
        box-shadow: 0 0 0 0 var(--color-primary-light-2)
    }

    .arco-input-inner-wrapper-error {
        background-color: var(--color-danger-light-1);
        border-color: transparent
    }

    .arco-input-inner-wrapper-error:hover {
        background-color: var(--color-danger-light-2);
        border-color: transparent
    }

    .arco-input-inner-wrapper-error .arco-input,
    .arco-input-inner-wrapper-error .arco-input:hover {
        box-shadow: none;
        background: 0 0
    }

    .arco-input-inner-wrapper-error.arco-input-inner-wrapper-focus,
    .arco-input-inner-wrapper-error.arco-input-inner-wrapper-focus:hover,
    .arco-input-inner-wrapper-error:focus,
    .arco-input-inner-wrapper-error:focus:hover {
        border-color: rgb(var(--danger-6));
        background-color: var(--color-bg-2);
        box-shadow: 0 0 0 0 var(--color-danger-light-2)
    }

    .arco-input-inner-wrapper-warning {
        background-color: var(--color-warning-light-1);
        border-color: transparent
    }

    .arco-input-inner-wrapper-warning:hover {
        background-color: var(--color-warning-light-2);
        border-color: transparent
    }

    .arco-input-inner-wrapper-warning .arco-input,
    .arco-input-inner-wrapper-warning .arco-input:hover {
        box-shadow: none;
        background: 0 0
    }

    .arco-input-inner-wrapper-warning.arco-input-inner-wrapper-focus,
    .arco-input-inner-wrapper-warning.arco-input-inner-wrapper-focus:hover,
    .arco-input-inner-wrapper-warning:focus,
    .arco-input-inner-wrapper-warning:focus:hover {
        border-color: rgb(var(--warning-6));
        background-color: var(--color-bg-2);
        box-shadow: 0 0 0 0 var(--color-warning-light-2)
    }

    .arco-input-inner-wrapper .arco-input {
        background: 0 0;
        border: none;
        border-radius: 0;
        padding-left: 0;
        padding-right: 0
    }

    .arco-input-inner-wrapper .arco-input:hover,
    .arco-input-inner-wrapper .arco-input:focus {
        box-shadow: none;
        background: 0 0
    }

    .arco-input-inner-wrapper-has-prefix>.arco-input-clear-wrapper .arco-input,
    .arco-input-inner-wrapper-has-prefix>.arco-input {
        padding-left: 12px
    }

    .arco-input-inner-wrapper .arco-input-group-prefix,
    .arco-input-inner-wrapper .arco-input-group-suffix {
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        white-space: nowrap;
        align-items: center;
        height: 100%;
        display: inline-flex
    }

    .arco-input-inner-wrapper .arco-input-group-prefix>svg,
    .arco-input-inner-wrapper .arco-input-group-suffix>svg {
        font-size: 14px
    }

    .arco-input-inner-wrapper .arco-input-group-prefix,
    .arco-input-inner-wrapper .arco-input-group-suffix {
        color: var(--color-text-2)
    }

    .arco-input-inner-wrapper-disabled {
        background-color: var(--color-fill-2);
        cursor: not-allowed;
        color: var(--color-text-4);
        -webkit-text-fill-color: var(--color-text-4);
        border-color: transparent
    }

    .arco-input-inner-wrapper-disabled:hover {
        background-color: var(--color-fill-2);
        color: var(--color-text-4);
        border-color: transparent
    }

    .arco-input-inner-wrapper-disabled::placeholder {
        color: var(--color-text-4)
    }

    .arco-input-inner-wrapper-disabled::placeholder {
        color: var(--color-text-4)
    }

    .arco-input-inner-wrapper-disabled::placeholder {
        color: var(--color-text-4)
    }

    .arco-input-inner-wrapper-disabled .arco-input-group-prefix,
    .arco-input-inner-wrapper-disabled .arco-input-group-suffix {
        color: inherit
    }

    .arco-input-inner-wrapper .arco-input-clear-icon {
        visibility: hidden
    }

    .arco-input-inner-wrapper:hover .arco-input-clear-icon {
        visibility: visible
    }

    .arco-input-inner-wrapper:hover .arco-input-clear-icon~.arco-input-group-suffix {
        margin-left: 4px
    }

    .arco-input-inner-wrapper:not(.arco-input-inner-wrapper-focus) .arco-input-clear-icon:hover:before {
        background-color: var(--color-fill-4)
    }

    .arco-input-group-wrapper-autowidth .arco-input-group {
        align-items: stretch;
        display: flex
    }

    .arco-input-group-wrapper-autowidth .arco-input-group-addbefore,
    .arco-input-group-wrapper-autowidth .arco-input-group-after {
        height: unset;
        flex-grow: 0;
        flex-shrink: 0;
        align-items: center;
        width: auto;
        display: inline-flex
    }

    .arco-input-group-wrapper-autowidth .arco-input-inner-wrapper {
        overflow: hidden
    }

    .arco-input-group-wrapper-autowidth .arco-input {
        text-overflow: ellipsis;
        flex: 1;
        overflow: hidden
    }

    .arco-input-group-wrapper-autowidth .arco-input:hover {
        text-overflow: unset
    }

    .arco-input-group {
        width: 100%;
        height: 100%;
        line-height: 0;
        display: table
    }

    .arco-input-group>.arco-input-inner-wrapper,
    .arco-input-group>.arco-input {
        border-radius: 0
    }

    .arco-input-group>.arco-input-inner-wrapper-focus,
    .arco-input-group>.arco-input-focus {
        border-radius: var(--border-radius-small)
    }

    .arco-input-group>:first-child {
        border-top-left-radius: var(--border-radius-small);
        border-bottom-left-radius: var(--border-radius-small)
    }

    .arco-input-group>:last-child {
        border-top-right-radius: var(--border-radius-small);
        border-bottom-right-radius: var(--border-radius-small)
    }

    .arco-input-group-addbefore,
    .arco-input-group-addafter {
        white-space: nowrap;
        vertical-align: middle;
        box-sizing: border-box;
        width: 1px;
        height: 100%;
        color: var(--color-text-1);
        background-color: var(--color-fill-2);
        border: 1px solid transparent;
        padding: 0 12px;
        display: table-cell
    }

    .arco-input-group-addbefore>svg,
    .arco-input-group-addafter>svg {
        font-size: 14px
    }

    .arco-input-group-addafter {
        border-left: 1px solid var(--color-neutral-3)
    }

    .arco-input-group-addafter .item-style {
        width: auto;
        height: 100%;
        margin: -1px -13px -1px -12px
    }

    .arco-input-group-addafter .arco-input {
        border-color: transparent;
        border-top-left-radius: 0;
        border-bottom-left-radius: 0;
        width: auto;
        height: 100%;
        margin: -1px -13px -1px -12px
    }

    .arco-input-group-addafter .arco-select {
        width: auto;
        height: 100%;
        margin: -1px -13px -1px -12px
    }

    .arco-input-group-addafter .arco-select .arco-select-view {
        background-color: inherit;
        border-color: transparent;
        border-radius: 0
    }

    .arco-input-group-addafter .arco-select.arco-select-single .arco-select-view {
        height: 100%
    }

    .arco-input-group-addbefore {
        border-right: 1px solid var(--color-neutral-3)
    }

    .arco-input-group-addbefore .item-style {
        width: auto;
        height: 100%;
        margin: -1px -12px -1px -13px
    }

    .arco-input-group-addbefore .arco-input {
        border-color: transparent;
        border-top-right-radius: 0;
        border-bottom-right-radius: 0;
        width: auto;
        height: 100%;
        margin: -1px -12px -1px -13px
    }

    .arco-input-group-addbefore .arco-select {
        width: auto;
        height: 100%;
        margin: -1px -12px -1px -13px
    }

    .arco-input-group-addbefore .arco-select .arco-select-view {
        background-color: inherit;
        border-color: transparent;
        border-radius: 0
    }

    .arco-input-group-addbefore .arco-select.arco-select-single .arco-select-view {
        height: 100%
    }

    .arco-input-group-wrapper {
        vertical-align: top;
        width: 100%;
        display: inline-block
    }

    .arco-input-group-wrapper.arco-input-group-wrapper-mini .arco-input-group,
    .arco-input-group-wrapper.arco-input-group-wrapper-mini .arco-input-inner-wrapper .arco-input-group-prefix,
    .arco-input-group-wrapper.arco-input-group-wrapper-mini .arco-input-inner-wrapper .arco-input-group-suffix,
    .arco-input-group-wrapper.arco-input-group-wrapper-mini .arco-input-inner-wrapper .arco-input-group-prefix>svg,
    .arco-input-group-wrapper.arco-input-group-wrapper-mini .arco-input-inner-wrapper .arco-input-group-suffix>svg {
        font-size: 12px
    }

    .arco-input-group-wrapper.arco-input-group-wrapper-mini .arco-input-group-addbefore,
    .arco-input-group-wrapper.arco-input-group-wrapper-mini .arco-input-group-addafter {
        height: 22px;
        font-size: 12px
    }

    .arco-input-group-wrapper.arco-input-group-wrapper-mini .arco-input-group-addbefore>svg,
    .arco-input-group-wrapper.arco-input-group-wrapper-mini .arco-input-group-addafter>svg {
        font-size: 12px
    }

    .arco-input-group-wrapper.arco-input-group-wrapper-mini .arco-input-group-addafter .item-style {
        width: auto;
        height: 100%;
        margin: -1px -13px -1px -12px
    }

    .arco-input-group-wrapper.arco-input-group-wrapper-mini .arco-input-group-addafter .arco-input {
        border-color: transparent;
        border-top-left-radius: 0;
        border-bottom-left-radius: 0;
        width: auto;
        height: 100%;
        margin: -1px -13px -1px -12px
    }

    .arco-input-group-wrapper.arco-input-group-wrapper-mini .arco-input-group-addafter .arco-select {
        width: auto;
        height: 100%;
        margin: -1px -13px -1px -12px
    }

    .arco-input-group-wrapper.arco-input-group-wrapper-mini .arco-input-group-addafter .arco-select .arco-select-view {
        background-color: inherit;
        border-color: transparent;
        border-radius: 0
    }

    .arco-input-group-wrapper.arco-input-group-wrapper-mini .arco-input-group-addafter .arco-select.arco-select-single .arco-select-view {
        height: 100%
    }

    .arco-input-group-wrapper.arco-input-group-wrapper-mini .arco-input-group-addbefore .item-style {
        width: auto;
        height: 100%;
        margin: -1px -12px -1px -13px
    }

    .arco-input-group-wrapper.arco-input-group-wrapper-mini .arco-input-group-addbefore .arco-input {
        border-color: transparent;
        border-top-right-radius: 0;
        border-bottom-right-radius: 0;
        width: auto;
        height: 100%;
        margin: -1px -12px -1px -13px
    }

    .arco-input-group-wrapper.arco-input-group-wrapper-mini .arco-input-group-addbefore .arco-select {
        width: auto;
        height: 100%;
        margin: -1px -12px -1px -13px
    }

    .arco-input-group-wrapper.arco-input-group-wrapper-mini .arco-input-group-addbefore .arco-select .arco-select-view {
        background-color: inherit;
        border-color: transparent;
        border-radius: 0
    }

    .arco-input-group-wrapper.arco-input-group-wrapper-mini .arco-input-group-addbefore .arco-select.arco-select-single .arco-select-view {
        height: 100%
    }

    .arco-input-group-wrapper.arco-input-group-wrapper-small .arco-input-group,
    .arco-input-group-wrapper.arco-input-group-wrapper-small .arco-input-inner-wrapper .arco-input-group-prefix,
    .arco-input-group-wrapper.arco-input-group-wrapper-small .arco-input-inner-wrapper .arco-input-group-suffix,
    .arco-input-group-wrapper.arco-input-group-wrapper-small .arco-input-inner-wrapper .arco-input-group-prefix>svg,
    .arco-input-group-wrapper.arco-input-group-wrapper-small .arco-input-inner-wrapper .arco-input-group-suffix>svg {
        font-size: 14px
    }

    .arco-input-group-wrapper.arco-input-group-wrapper-small .arco-input-group-addbefore,
    .arco-input-group-wrapper.arco-input-group-wrapper-small .arco-input-group-addafter {
        height: 26px;
        font-size: 14px
    }

    .arco-input-group-wrapper.arco-input-group-wrapper-small .arco-input-group-addbefore>svg,
    .arco-input-group-wrapper.arco-input-group-wrapper-small .arco-input-group-addafter>svg {
        font-size: 14px
    }

    .arco-input-group-wrapper.arco-input-group-wrapper-small .arco-input-group-addafter .item-style {
        width: auto;
        height: 100%;
        margin: -1px -13px -1px -12px
    }

    .arco-input-group-wrapper.arco-input-group-wrapper-small .arco-input-group-addafter .arco-input {
        border-color: transparent;
        border-top-left-radius: 0;
        border-bottom-left-radius: 0;
        width: auto;
        height: 100%;
        margin: -1px -13px -1px -12px
    }

    .arco-input-group-wrapper.arco-input-group-wrapper-small .arco-input-group-addafter .arco-select {
        width: auto;
        height: 100%;
        margin: -1px -13px -1px -12px
    }

    .arco-input-group-wrapper.arco-input-group-wrapper-small .arco-input-group-addafter .arco-select .arco-select-view {
        background-color: inherit;
        border-color: transparent;
        border-radius: 0
    }

    .arco-input-group-wrapper.arco-input-group-wrapper-small .arco-input-group-addafter .arco-select.arco-select-single .arco-select-view {
        height: 100%
    }

    .arco-input-group-wrapper.arco-input-group-wrapper-small .arco-input-group-addbefore .item-style {
        width: auto;
        height: 100%;
        margin: -1px -12px -1px -13px
    }

    .arco-input-group-wrapper.arco-input-group-wrapper-small .arco-input-group-addbefore .arco-input {
        border-color: transparent;
        border-top-right-radius: 0;
        border-bottom-right-radius: 0;
        width: auto;
        height: 100%;
        margin: -1px -12px -1px -13px
    }

    .arco-input-group-wrapper.arco-input-group-wrapper-small .arco-input-group-addbefore .arco-select {
        width: auto;
        height: 100%;
        margin: -1px -12px -1px -13px
    }

    .arco-input-group-wrapper.arco-input-group-wrapper-small .arco-input-group-addbefore .arco-select .arco-select-view {
        background-color: inherit;
        border-color: transparent;
        border-radius: 0
    }

    .arco-input-group-wrapper.arco-input-group-wrapper-small .arco-input-group-addbefore .arco-select.arco-select-single .arco-select-view {
        height: 100%
    }

    .arco-input-group-wrapper.arco-input-group-wrapper-large .arco-input-group,
    .arco-input-group-wrapper.arco-input-group-wrapper-large .arco-input-inner-wrapper .arco-input-group-prefix,
    .arco-input-group-wrapper.arco-input-group-wrapper-large .arco-input-inner-wrapper .arco-input-group-suffix,
    .arco-input-group-wrapper.arco-input-group-wrapper-large .arco-input-inner-wrapper .arco-input-group-prefix>svg,
    .arco-input-group-wrapper.arco-input-group-wrapper-large .arco-input-inner-wrapper .arco-input-group-suffix>svg {
        font-size: 14px
    }

    .arco-input-group-wrapper.arco-input-group-wrapper-large .arco-input-group-addbefore,
    .arco-input-group-wrapper.arco-input-group-wrapper-large .arco-input-group-addafter {
        height: 34px;
        font-size: 14px
    }

    .arco-input-group-wrapper.arco-input-group-wrapper-large .arco-input-group-addbefore>svg,
    .arco-input-group-wrapper.arco-input-group-wrapper-large .arco-input-group-addafter>svg {
        font-size: 14px
    }

    .arco-input-group-wrapper.arco-input-group-wrapper-large .arco-input-group-addafter .item-style {
        width: auto;
        height: 100%;
        margin: -1px -13px -1px -12px
    }

    .arco-input-group-wrapper.arco-input-group-wrapper-large .arco-input-group-addafter .arco-input {
        border-color: transparent;
        border-top-left-radius: 0;
        border-bottom-left-radius: 0;
        width: auto;
        height: 100%;
        margin: -1px -13px -1px -12px
    }

    .arco-input-group-wrapper.arco-input-group-wrapper-large .arco-input-group-addafter .arco-select {
        width: auto;
        height: 100%;
        margin: -1px -13px -1px -12px
    }

    .arco-input-group-wrapper.arco-input-group-wrapper-large .arco-input-group-addafter .arco-select .arco-select-view {
        background-color: inherit;
        border-color: transparent;
        border-radius: 0
    }

    .arco-input-group-wrapper.arco-input-group-wrapper-large .arco-input-group-addafter .arco-select.arco-select-single .arco-select-view {
        height: 100%
    }

    .arco-input-group-wrapper.arco-input-group-wrapper-large .arco-input-group-addbefore .item-style {
        width: auto;
        height: 100%;
        margin: -1px -12px -1px -13px
    }

    .arco-input-group-wrapper.arco-input-group-wrapper-large .arco-input-group-addbefore .arco-input {
        border-color: transparent;
        border-top-right-radius: 0;
        border-bottom-right-radius: 0;
        width: auto;
        height: 100%;
        margin: -1px -12px -1px -13px
    }

    .arco-input-group-wrapper.arco-input-group-wrapper-large .arco-input-group-addbefore .arco-select {
        width: auto;
        height: 100%;
        margin: -1px -12px -1px -13px
    }

    .arco-input-group-wrapper.arco-input-group-wrapper-large .arco-input-group-addbefore .arco-select .arco-select-view {
        background-color: inherit;
        border-color: transparent;
        border-radius: 0
    }

    .arco-input-group-wrapper.arco-input-group-wrapper-large .arco-input-group-addbefore .arco-select.arco-select-single .arco-select-view {
        height: 100%
    }

    .arco-input-group-wrapper.arco-input-custom-height .arco-input-group,
    .arco-input-group-wrapper.arco-input-custom-height .arco-input-inner-wrapper .arco-input-group-prefix,
    .arco-input-group-wrapper.arco-input-custom-height .arco-input-inner-wrapper .arco-input-group-suffix,
    .arco-input-group-wrapper.arco-input-custom-height .arco-input-inner-wrapper .arco-input-group-prefix>svg,
    .arco-input-group-wrapper.arco-input-custom-height .arco-input-inner-wrapper .arco-input-group-suffix>svg {
        font-size: 14px
    }

    .arco-input-group-wrapper.arco-input-custom-height .arco-input-group-addbefore,
    .arco-input-group-wrapper.arco-input-custom-height .arco-input-group-addafter {
        height: 22px;
        font-size: 14px
    }

    .arco-input-group-wrapper.arco-input-custom-height .arco-input-group-addbefore>svg,
    .arco-input-group-wrapper.arco-input-custom-height .arco-input-group-addafter>svg {
        font-size: 14px
    }

    .arco-input-group-wrapper.arco-input-custom-height .arco-input-group-addafter .item-style {
        width: auto;
        height: 100%;
        margin: -1px -13px -1px -12px
    }

    .arco-input-group-wrapper.arco-input-custom-height .arco-input-group-addafter .arco-input {
        border-color: transparent;
        border-top-left-radius: 0;
        border-bottom-left-radius: 0;
        width: auto;
        height: 100%;
        margin: -1px -13px -1px -12px
    }

    .arco-input-group-wrapper.arco-input-custom-height .arco-input-group-addafter .arco-select {
        width: auto;
        height: 100%;
        margin: -1px -13px -1px -12px
    }

    .arco-input-group-wrapper.arco-input-custom-height .arco-input-group-addafter .arco-select .arco-select-view {
        background-color: inherit;
        border-color: transparent;
        border-radius: 0
    }

    .arco-input-group-wrapper.arco-input-custom-height .arco-input-group-addafter .arco-select.arco-select-single .arco-select-view {
        height: 100%
    }

    .arco-input-group-wrapper.arco-input-custom-height .arco-input-group-addbefore .item-style {
        width: auto;
        height: 100%;
        margin: -1px -12px -1px -13px
    }

    .arco-input-group-wrapper.arco-input-custom-height .arco-input-group-addbefore .arco-input {
        border-color: transparent;
        border-top-right-radius: 0;
        border-bottom-right-radius: 0;
        width: auto;
        height: 100%;
        margin: -1px -12px -1px -13px
    }

    .arco-input-group-wrapper.arco-input-custom-height .arco-input-group-addbefore .arco-select {
        width: auto;
        height: 100%;
        margin: -1px -12px -1px -13px
    }

    .arco-input-group-wrapper.arco-input-custom-height .arco-input-group-addbefore .arco-select .arco-select-view {
        background-color: inherit;
        border-color: transparent;
        border-radius: 0
    }

    .arco-input-group-wrapper.arco-input-custom-height .arco-input-group-addbefore .arco-select.arco-select-single .arco-select-view,
    .arco-input-group-wrapper.arco-input-custom-height .arco-input-inner-wrapper,
    .arco-input-group-wrapper.arco-input-custom-height .arco-input-inner-wrapper .arco-input,
    .arco-input-group-wrapper.arco-input-custom-height .arco-input-inner-wrapper .arco-input-clear-wrapper,
    .arco-input-group-wrapper.arco-input-custom-height .arco-input-inner-wrapper .arco-input-clear-wrapper .arco-input,
    .arco-input-group-wrapper .arco-input-inner-wrapper {
        height: 100%
    }

    .arco-input-group-wrapper.arco-input-disabled {
        cursor: not-allowed
    }

    .arco-input-mirror {
        visibility: hidden;
        position: absolute;
        top: 0;
        left: 0
    }

    .arco-textarea {
        -webkit-appearance: none;
        -moz-appearance: none;
        -ms-appearance: none;
        appearance: none;
        -webkit-tap-highlight-color: transparent;
        border-radius: var(--border-radius-small);
        width: 100%;
        color: var(--color-text-1);
        box-sizing: border-box;
        background-color: var(--color-fill-2);
        vertical-align: top;
        resize: vertical;
        border: 1px solid transparent;
        outline: none;
        max-width: 100%;
        height: auto;
        min-height: 32px;
        padding: 4px 12px;
        font-size: 14px;
        line-height: 1.5715;
        transition: color .1s cubic-bezier(0, 0, 1, 1), border-color .1s cubic-bezier(0, 0, 1, 1), background-color .1s cubic-bezier(0, 0, 1, 1);
        position: relative;
        overflow: auto
    }

    .arco-textarea::placeholder {
        color: var(--color-text-3)
    }

    .arco-textarea::placeholder {
        color: var(--color-text-3)
    }

    .arco-textarea::placeholder {
        color: var(--color-text-3)
    }

    .arco-textarea:hover {
        background-color: var(--color-fill-3);
        border-color: transparent
    }

    .arco-textarea:focus,
    .arco-textarea.arco-textarea-focus {
        border-color: rgb(var(--primary-6));
        background-color: var(--color-bg-2);
        box-shadow: 0 0 0 0 var(--color-primary-light-2)
    }

    .arco-textarea-error {
        background-color: var(--color-danger-light-1);
        border-color: transparent
    }

    .arco-textarea-error:hover {
        background-color: var(--color-danger-light-2);
        border-color: transparent
    }

    .arco-textarea-error .arco-input,
    .arco-textarea-error .arco-input:hover {
        box-shadow: none;
        background: 0 0
    }

    .arco-textarea-error.arco-textarea-focus,
    .arco-textarea-error.arco-textarea-focus:hover,
    .arco-textarea-error:focus,
    .arco-textarea-error:focus:hover {
        border-color: rgb(var(--danger-6));
        background-color: var(--color-bg-2);
        box-shadow: 0 0 0 0 var(--color-danger-light-2)
    }

    .arco-textarea-warning {
        background-color: var(--color-warning-light-1);
        border-color: transparent
    }

    .arco-textarea-warning:hover {
        background-color: var(--color-warning-light-2);
        border-color: transparent
    }

    .arco-textarea-warning .arco-input,
    .arco-textarea-warning .arco-input:hover {
        box-shadow: none;
        background: 0 0
    }

    .arco-textarea-warning.arco-textarea-focus,
    .arco-textarea-warning.arco-textarea-focus:hover,
    .arco-textarea-warning:focus,
    .arco-textarea-warning:focus:hover {
        border-color: rgb(var(--warning-6));
        background-color: var(--color-bg-2);
        box-shadow: 0 0 0 0 var(--color-warning-light-2)
    }

    .arco-textarea-disabled {
        background-color: var(--color-fill-2);
        cursor: not-allowed;
        color: var(--color-text-4);
        -webkit-text-fill-color: var(--color-text-4);
        border-color: transparent
    }

    .arco-textarea-disabled:hover {
        background-color: var(--color-fill-2);
        color: var(--color-text-4);
        border-color: transparent
    }

    .arco-textarea-disabled::placeholder {
        color: var(--color-text-4)
    }

    .arco-textarea-disabled::placeholder {
        color: var(--color-text-4)
    }

    .arco-textarea-disabled::placeholder {
        color: var(--color-text-4)
    }

    .arco-input-group.arco-input-group-compact>.arco-select {
        vertical-align: unset
    }

    .arco-input-group.arco-input-group-compact>.arco-select .arco-select-view,
    .arco-input-group.arco-input-group-compact>*,
    .arco-input-group.arco-input-group-compact>* .arco-input-group>:last-child,
    .arco-input-group.arco-input-group-compact>* .arco-input-group>:first-child {
        border-radius: 0
    }

    .arco-input-group.arco-input-group-compact>:not(:last-child) {
        border-right: 1px solid var(--color-neutral-3);
        box-sizing: border-box;
        position: relative
    }

    .arco-input-group.arco-input-group-compact>:first-child,
    .arco-input-group.arco-input-group-compact>:first-child .arco-input-group>:first-child,
    .arco-input-group.arco-input-group-compact>:first-child .arco-select .arco-select-view,
    .arco-input-group.arco-input-group-compact>:first-child .arco-input-group>:first-child .arco-select .arco-select-view {
        border-top-left-radius: var(--border-radius-small);
        border-bottom-left-radius: var(--border-radius-small)
    }

    .arco-input-group.arco-input-group-compact>:last-child,
    .arco-input-group.arco-input-group-compact>:last-child .arco-input-group>:last-child,
    .arco-input-group.arco-input-group-compact>:last-child .arco-select .arco-select-view,
    .arco-input-group.arco-input-group-compact>:last-child .arco-input-group>:last-child .arco-select .arco-select-view {
        border-top-right-radius: var(--border-radius-small);
        border-bottom-right-radius: var(--border-radius-small)
    }

    .arco-input-group.arco-input-group-compact>.arco-input:not(:last-child) {
        border-right-color: var(--color-neutral-3)
    }

    .arco-input-group.arco-input-group-compact>.arco-input:not(:last-child):focus {
        border-right-color: rgb(var(--primary-6))
    }

    .size-height-size-mini {
        padding-top: 1px;
        padding-bottom: 1px;
        font-size: 12px;
        line-height: 1.667
    }

    .size-height-size-small {
        padding-top: 2px;
        padding-bottom: 2px;
        font-size: 14px
    }

    .size-height-size-large {
        padding-top: 6px;
        padding-bottom: 6px;
        font-size: 14px
    }

    .size-height-group-wrapper-mini .arco-input-group-addbefore,
    .size-height-group-wrapper-mini .arco-input-group-addafter,
    .size-height-inner-wrapper.size-height-inner-wrapper-mini,
    .size-height-size-mini {
        padding-left: 8px;
        padding-right: 8px
    }

    .size-height-group-wrapper-small .arco-input-group-addbefore,
    .size-height-group-wrapper-small .arco-input-group-addafter,
    .size-height-inner-wrapper.size-height-inner-wrapper-small,
    .size-height-size-small {
        padding-left: 12px;
        padding-right: 12px
    }

    .size-height-group-wrapper-large .arco-input-group-addbefore,
    .size-height-group-wrapper-large .arco-input-group-addafter,
    .size-height-inner-wrapper.size-height-inner-wrapper-large,
    .size-height-size-large {
        padding-left: 16px;
        padding-right: 16px
    }

    .group-size.group-size-mini .arco-input-group,
    .group-size.group-size-mini .arco-input-inner-wrapper .arco-input-group-prefix,
    .group-size.group-size-mini .arco-input-inner-wrapper .arco-input-group-suffix,
    .group-size.group-size-mini .arco-input-inner-wrapper .arco-input-group-prefix>svg,
    .group-size.group-size-mini .arco-input-inner-wrapper .arco-input-group-suffix>svg {
        font-size: 12px
    }

    .group-size.group-size-mini .arco-input-group-addbefore,
    .group-size.group-size-mini .arco-input-group-addafter {
        height: 22px;
        font-size: 12px
    }

    .group-size.group-size-mini .arco-input-group-addbefore>svg,
    .group-size.group-size-mini .arco-input-group-addafter>svg {
        font-size: 12px
    }

    .group-size.group-size-mini .arco-input-group-addafter .item-style {
        width: auto;
        height: 100%;
        margin: -1px -13px -1px -12px
    }

    .group-size.group-size-mini .arco-input-group-addafter .arco-input {
        border-color: transparent;
        border-top-left-radius: 0;
        border-bottom-left-radius: 0;
        width: auto;
        height: 100%;
        margin: -1px -13px -1px -12px
    }

    .group-size.group-size-mini .arco-input-group-addafter .arco-select {
        width: auto;
        height: 100%;
        margin: -1px -13px -1px -12px
    }

    .group-size.group-size-mini .arco-input-group-addafter .arco-select .arco-select-view {
        background-color: inherit;
        border-color: transparent;
        border-radius: 0
    }

    .group-size.group-size-mini .arco-input-group-addafter .arco-select.arco-select-single .arco-select-view {
        height: 100%
    }

    .group-size.group-size-mini .arco-input-group-addbefore .item-style {
        width: auto;
        height: 100%;
        margin: -1px -12px -1px -13px
    }

    .group-size.group-size-mini .arco-input-group-addbefore .arco-input {
        border-color: transparent;
        border-top-right-radius: 0;
        border-bottom-right-radius: 0;
        width: auto;
        height: 100%;
        margin: -1px -12px -1px -13px
    }

    .group-size.group-size-mini .arco-input-group-addbefore .arco-select {
        width: auto;
        height: 100%;
        margin: -1px -12px -1px -13px
    }

    .group-size.group-size-mini .arco-input-group-addbefore .arco-select .arco-select-view {
        background-color: inherit;
        border-color: transparent;
        border-radius: 0
    }

    .group-size.group-size-mini .arco-input-group-addbefore .arco-select.arco-select-single .arco-select-view {
        height: 100%
    }

    .group-size.group-size-small .arco-input-group,
    .group-size.group-size-small .arco-input-inner-wrapper .arco-input-group-prefix,
    .group-size.group-size-small .arco-input-inner-wrapper .arco-input-group-suffix,
    .group-size.group-size-small .arco-input-inner-wrapper .arco-input-group-prefix>svg,
    .group-size.group-size-small .arco-input-inner-wrapper .arco-input-group-suffix>svg {
        font-size: 14px
    }

    .group-size.group-size-small .arco-input-group-addbefore,
    .group-size.group-size-small .arco-input-group-addafter {
        height: 26px;
        font-size: 14px
    }

    .group-size.group-size-small .arco-input-group-addbefore>svg,
    .group-size.group-size-small .arco-input-group-addafter>svg {
        font-size: 14px
    }

    .group-size.group-size-small .arco-input-group-addafter .item-style {
        width: auto;
        height: 100%;
        margin: -1px -13px -1px -12px
    }

    .group-size.group-size-small .arco-input-group-addafter .arco-input {
        border-color: transparent;
        border-top-left-radius: 0;
        border-bottom-left-radius: 0;
        width: auto;
        height: 100%;
        margin: -1px -13px -1px -12px
    }

    .group-size.group-size-small .arco-input-group-addafter .arco-select {
        width: auto;
        height: 100%;
        margin: -1px -13px -1px -12px
    }

    .group-size.group-size-small .arco-input-group-addafter .arco-select .arco-select-view {
        background-color: inherit;
        border-color: transparent;
        border-radius: 0
    }

    .group-size.group-size-small .arco-input-group-addafter .arco-select.arco-select-single .arco-select-view {
        height: 100%
    }

    .group-size.group-size-small .arco-input-group-addbefore .item-style {
        width: auto;
        height: 100%;
        margin: -1px -12px -1px -13px
    }

    .group-size.group-size-small .arco-input-group-addbefore .arco-input {
        border-color: transparent;
        border-top-right-radius: 0;
        border-bottom-right-radius: 0;
        width: auto;
        height: 100%;
        margin: -1px -12px -1px -13px
    }

    .group-size.group-size-small .arco-input-group-addbefore .arco-select {
        width: auto;
        height: 100%;
        margin: -1px -12px -1px -13px
    }

    .group-size.group-size-small .arco-input-group-addbefore .arco-select .arco-select-view {
        background-color: inherit;
        border-color: transparent;
        border-radius: 0
    }

    .group-size.group-size-small .arco-input-group-addbefore .arco-select.arco-select-single .arco-select-view {
        height: 100%
    }

    .group-size.group-size-large .arco-input-group,
    .group-size.group-size-large .arco-input-inner-wrapper .arco-input-group-prefix,
    .group-size.group-size-large .arco-input-inner-wrapper .arco-input-group-suffix,
    .group-size.group-size-large .arco-input-inner-wrapper .arco-input-group-prefix>svg,
    .group-size.group-size-large .arco-input-inner-wrapper .arco-input-group-suffix>svg {
        font-size: 14px
    }

    .group-size.group-size-large .arco-input-group-addbefore,
    .group-size.group-size-large .arco-input-group-addafter {
        height: 34px;
        font-size: 14px
    }

    .group-size.group-size-large .arco-input-group-addbefore>svg,
    .group-size.group-size-large .arco-input-group-addafter>svg {
        font-size: 14px
    }

    .group-size.group-size-large .arco-input-group-addafter .item-style {
        width: auto;
        height: 100%;
        margin: -1px -13px -1px -12px
    }

    .group-size.group-size-large .arco-input-group-addafter .arco-input {
        border-color: transparent;
        border-top-left-radius: 0;
        border-bottom-left-radius: 0;
        width: auto;
        height: 100%;
        margin: -1px -13px -1px -12px
    }

    .group-size.group-size-large .arco-input-group-addafter .arco-select {
        width: auto;
        height: 100%;
        margin: -1px -13px -1px -12px
    }

    .group-size.group-size-large .arco-input-group-addafter .arco-select .arco-select-view {
        background-color: inherit;
        border-color: transparent;
        border-radius: 0
    }

    .group-size.group-size-large .arco-input-group-addafter .arco-select.arco-select-single .arco-select-view {
        height: 100%
    }

    .group-size.group-size-large .arco-input-group-addbefore .item-style {
        width: auto;
        height: 100%;
        margin: -1px -12px -1px -13px
    }

    .group-size.group-size-large .arco-input-group-addbefore .arco-input {
        border-color: transparent;
        border-top-right-radius: 0;
        border-bottom-right-radius: 0;
        width: auto;
        height: 100%;
        margin: -1px -12px -1px -13px
    }

    .group-size.group-size-large .arco-input-group-addbefore .arco-select {
        width: auto;
        height: 100%;
        margin: -1px -12px -1px -13px
    }

    .group-size.group-size-large .arco-input-group-addbefore .arco-select .arco-select-view {
        background-color: inherit;
        border-color: transparent;
        border-radius: 0
    }

    .group-size.group-size-large .arco-input-group-addbefore .arco-select.arco-select-single .arco-select-view {
        height: 100%
    }

    .group-size.arco-input-custom-height .arco-input-group,
    .group-size.arco-input-custom-height .arco-input-inner-wrapper .arco-input-group-prefix,
    .group-size.arco-input-custom-height .arco-input-inner-wrapper .arco-input-group-suffix,
    .group-size.arco-input-custom-height .arco-input-inner-wrapper .arco-input-group-prefix>svg,
    .group-size.arco-input-custom-height .arco-input-inner-wrapper .arco-input-group-suffix>svg {
        font-size: 14px
    }

    .group-size.arco-input-custom-height .arco-input-group-addbefore,
    .group-size.arco-input-custom-height .arco-input-group-addafter {
        height: 22px;
        font-size: 14px
    }

    .group-size.arco-input-custom-height .arco-input-group-addbefore>svg,
    .group-size.arco-input-custom-height .arco-input-group-addafter>svg {
        font-size: 14px
    }

    .group-size.arco-input-custom-height .arco-input-group-addafter .item-style {
        width: auto;
        height: 100%;
        margin: -1px -13px -1px -12px
    }

    .group-size.arco-input-custom-height .arco-input-group-addafter .arco-input {
        border-color: transparent;
        border-top-left-radius: 0;
        border-bottom-left-radius: 0;
        width: auto;
        height: 100%;
        margin: -1px -13px -1px -12px
    }

    .group-size.arco-input-custom-height .arco-input-group-addafter .arco-select {
        width: auto;
        height: 100%;
        margin: -1px -13px -1px -12px
    }

    .group-size.arco-input-custom-height .arco-input-group-addafter .arco-select .arco-select-view {
        background-color: inherit;
        border-color: transparent;
        border-radius: 0
    }

    .group-size.arco-input-custom-height .arco-input-group-addafter .arco-select.arco-select-single .arco-select-view {
        height: 100%
    }

    .group-size.arco-input-custom-height .arco-input-group-addbefore .item-style {
        width: auto;
        height: 100%;
        margin: -1px -12px -1px -13px
    }

    .group-size.arco-input-custom-height .arco-input-group-addbefore .arco-input {
        border-color: transparent;
        border-top-right-radius: 0;
        border-bottom-right-radius: 0;
        width: auto;
        height: 100%;
        margin: -1px -12px -1px -13px
    }

    .group-size.arco-input-custom-height .arco-input-group-addbefore .arco-select {
        width: auto;
        height: 100%;
        margin: -1px -12px -1px -13px
    }

    .group-size.arco-input-custom-height .arco-input-group-addbefore .arco-select .arco-select-view {
        background-color: inherit;
        border-color: transparent;
        border-radius: 0
    }

    .group-size.arco-input-custom-height .arco-input-group-addbefore .arco-select.arco-select-single .arco-select-view,
    .group-size.arco-input-custom-height .arco-input-inner-wrapper,
    .group-size.arco-input-custom-height .arco-input-inner-wrapper .arco-input,
    .group-size.arco-input-custom-height .arco-input-inner-wrapper .arco-input-clear-wrapper,
    .group-size.arco-input-custom-height .arco-input-inner-wrapper .arco-input-clear-wrapper .arco-input {
        height: 100%
    }

    .arco-textarea-wrapper {
        width: 100%;
        display: inline-block;
        position: relative
    }

    .arco-textarea-clear-wrapper:hover .arco-textarea-clear-icon {
        display: inline-block
    }

    .arco-textarea-clear-wrapper .arco-textarea {
        padding-right: 20px
    }

    .arco-textarea-word-limit {
        color: var(--color-text-3);
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        font-size: 12px;
        position: absolute;
        bottom: 6px;
        right: 10px
    }

    .arco-textarea-word-limit-error {
        color: rgb(var(--danger-6))
    }

    .arco-textarea-clear-icon {
        color: var(--color-text-2);
        font-size: 12px;
        display: none;
        position: absolute;
        top: 10px;
        right: 10px
    }

    .arco-textarea-clear-icon>svg {
        transition: color .1s cubic-bezier(0, 0, 1, 1);
        position: relative
    }

    .arco-input-search.arco-input-group-wrapper .arco-input-group-addbefore {
        transition: all .1s cubic-bezier(0, 0, 1, 1)
    }

    .arco-input-search.arco-input-group-wrapper .arco-input-group-addafter {
        border: none;
        padding: 0
    }

    .arco-input-search.arco-input-group-wrapper .arco-input-group-suffix {
        color: var(--color-text-2);
        font-size: 14px
    }

    .arco-input-search.arco-input-group-wrapper:not(.arco-input-disabled) .arco-input-group-addbefore {
        cursor: pointer;
        color: var(--color-text-2);
        font-size: 14px
    }

    .arco-input-search.arco-input-group-wrapper .arco-input-search-btn {
        height: 100%;
        color: var(--color-white);
        border-top-left-radius: 0;
        border-bottom-left-radius: 0;
        font-size: 14px
    }

    .arco-input-search-button .arco-input-inner-wrapper:not(.arco-input-inner-wrapper-rtl) {
        border-right: none;
        border-top-right-radius: 0;
        border-bottom-right-radius: 0
    }

    .arco-input-password.arco-input-group-wrapper:not(.arco-input-disabled) .arco-input-group-suffix {
        cursor: pointer;
        color: var(--color-text-2);
        font-size: 12px
    }

    .arco-input-password.arco-input-group-wrapper .arco-input-password-visibility-icon:focus-visible {
        box-shadow: 0 0 0 2px rgb(var(--primary-6));
        border-radius: var(--border-radius-small)
    }

    .arco-input-group-wrapper-rtl {
        direction: rtl
    }

    .arco-input-group-wrapper-rtl .arco-input-word-limit {
        padding-left: 0;
        padding-right: input-padding-word-limit-left
    }

    .arco-input-group-wrapper-rtl.arco-input-clear-wrapper .arco-input {
        padding-left: 24px;
        padding-right: 0
    }

    .arco-input-group-wrapper-rtl .arco-input-group>:first-child {
        border-radius: 0 var(--border-radius-small)var(--border-radius-small)0
    }

    .arco-input-group-wrapper-rtl .arco-input-group>:last-child {
        border-radius: var(--border-radius-small)0 0 var(--border-radius-small)
    }

    .arco-input-group-wrapper-rtl .arco-input-group-addafter {
        border-left: none;
        border-right: 1px solid var(--color-neutral-3)
    }

    .arco-input-group-wrapper-rtl .arco-input-group-addafter .item-style {
        width: auto;
        height: 100%;
        margin: -1px -12px -1px -13px
    }

    .arco-input-group-wrapper-rtl .arco-input-group-addafter .arco-input {
        border-color: transparent;
        border-top-right-radius: 0;
        border-bottom-right-radius: 0;
        width: auto;
        height: 100%;
        margin: -1px -12px -1px -13px
    }

    .arco-input-group-wrapper-rtl .arco-input-group-addafter .arco-select {
        width: auto;
        height: 100%;
        margin: -1px -12px -1px -13px
    }

    .arco-input-group-wrapper-rtl .arco-input-group-addafter .arco-select .arco-select-view {
        background-color: inherit;
        border-color: transparent;
        border-radius: 0
    }

    .arco-input-group-wrapper-rtl .arco-input-group-addafter .arco-select.arco-select-single .arco-select-view {
        height: 100%
    }

    .arco-input-group-wrapper-rtl .arco-input-group-addbefore {
        border-right: none;
        border-left: 1px solid var(--color-neutral-3)
    }

    .arco-input-group-wrapper-rtl .arco-input-group-addbefore .item-style {
        width: auto;
        height: 100%;
        margin: -1px -13px -1px -12px
    }

    .arco-input-group-wrapper-rtl .arco-input-group-addbefore .arco-input {
        border-color: transparent;
        border-top-left-radius: 0;
        border-bottom-left-radius: 0;
        width: auto;
        height: 100%;
        margin: -1px -13px -1px -12px
    }

    .arco-input-group-wrapper-rtl .arco-input-group-addbefore .arco-select {
        width: auto;
        height: 100%;
        margin: -1px -13px -1px -12px
    }

    .arco-input-group-wrapper-rtl .arco-input-group-addbefore .arco-select .arco-select-view {
        background-color: inherit;
        border-color: transparent;
        border-radius: 0
    }

    .arco-input-group-wrapper-rtl .arco-input-group-addbefore .arco-select.arco-select-single .arco-select-view {
        height: 100%
    }

    .arco-input-group-wrapper-rtl .arco-input-group.arco-input-group-compact>:not(:last-child) {
        border-right: none;
        border-left: 1px solid var(--color-neutral-3)
    }

    .arco-input-group-wrapper-rtl .arco-input-group.arco-input-group-compact>:first-child,
    .arco-input-group-wrapper-rtl .arco-input-group.arco-input-group-compact>:first-child .arco-input-group>:first-child,
    .arco-input-group-wrapper-rtl .arco-input-group.arco-input-group-compact>:first-child .arco-select .arco-select-view,
    .arco-input-group-wrapper-rtl .arco-input-group.arco-input-group-compact>:first-child .arco-input-group>:first-child .arco-select .arco-select-view {
        border-radius: 0 var(--border-radius-small)var(--border-radius-small)0
    }

    .arco-input-group-wrapper-rtl .arco-input-group.arco-input-group-compact>:last-child,
    .arco-input-group-wrapper-rtl .arco-input-group.arco-input-group-compact>:last-child .arco-input-group>:last-child,
    .arco-input-group-wrapper-rtl .arco-input-group.arco-input-group-compact>:last-child .arco-select .arco-select-view,
    .arco-input-group-wrapper-rtl .arco-input-group.arco-input-group-compact>:last-child .arco-input-group>:last-child .arco-select .arco-select-view {
        border-radius: var(--border-radius-small)0 0 var(--border-radius-small)
    }

    .arco-input-group-wrapper-rtl .arco-input-group.arco-input-group-compact>.arco-input:not(:last-child) {
        border-left-color: var(--color-neutral-3)
    }

    .arco-input-group-wrapper-rtl .arco-input-group.arco-input-group-compact>.arco-input:not(:last-child):focus {
        border-left-color: rgb(var(--primary-6))
    }

    .arco-input-group-wrapper-rtl.arco-input-search .arco-input-search-btn {
        border-radius: var(--border-radius-small)0 0 var(--border-radius-small)
    }

    .arco-input-inner-wrapper-rtl {
        direction: rtl
    }

    .arco-input-inner-wrapper-rtl.arco-input-inner-wrapper-has-prefix>.arco-input-clear-wrapper .arco-input,
    .arco-input-inner-wrapper-rtl.arco-input-inner-wrapper-has-prefix>.arco-input {
        padding-left: 0;
        padding-right: 12px
    }

    .arco-input-inner-wrapper-rtl>.arco-input-clear-wrapper .arco-input {
        padding-left: 12px;
        padding-right: 0
    }

    .arco-input-inner-wrapper-rtl>.arco-input-clear-wrapper .arco-input-clear-icon {
        right: initial;
        left: 8px
    }

    .arco-input-inner-wrapper-rtl:hover .arco-input-clear-icon~.arco-input-group-suffix {
        margin-left: 4px
    }

    .arco-input-search-button .arco-input-inner-wrapper-rtl {
        border-radius: 0 var(--border-radius-small)var(--border-radius-small)0;
        border-left: none
    }

    .arco-textarea-wrapper-rtl {
        direction: rtl
    }

    .arco-textarea-wrapper-rtl .arco-textarea {
        padding-left: 20px
    }

    .arco-textarea-wrapper-rtl .arco-textarea-word-limit,
    .arco-textarea-wrapper-rtl .arco-textarea-clear-icon {
        right: initial;
        left: 10px
    }
}


@layer base {
    .arco-message-wrapper {
        z-index: 1003;
        text-align: center;
        pointer-events: none;
        box-sizing: border-box;
        width: 100%;
        padding: 0 10px;
        position: fixed;
        left: 0
    }

    .arco-message-wrapper-top {
        top: 40px
    }

    .arco-message-wrapper-bottom {
        bottom: 40px
    }

    .arco-message {
        border-radius: var(--border-radius-small);
        border: 1px solid var(--color-neutral-3);
        background-color: var(--color-bg-popup);
        text-align: center;
        pointer-events: auto;
        margin-bottom: 16px;
        padding: 10px 16px;
        line-height: 1;
        transition: opacity .1s cubic-bezier(0, 0, 1, 1);
        display: inline-block;
        position: relative;
        overflow: hidden;
        box-shadow: 0 4px 10px rgba(0, 0, 0, .1)
    }

    .arco-message-closable {
        padding-right: 38px
    }

    .arco-message-icon {
        color: var(--color-text-1);
        vertical-align: middle;
        margin-right: 8px;
        font-size: 20px;
        animation: .1s cubic-bezier(0, 0, 1, 1) arco-msg-fade, .4s cubic-bezier(.3, 1.3, .3, 1) arco-msg-fade;
        display: inline-block
    }

    .arco-message-content {
        vertical-align: middle;
        color: var(--color-text-1);
        font-size: 14px
    }

    .arco-message-info {
        background-color: var(--color-bg-popup);
        border-color: var(--color-neutral-3)
    }

    .arco-message-info .arco-message-icon {
        color: rgb(var(--primary-6))
    }

    .arco-message-info .arco-message-content {
        color: var(--color-text-1)
    }

    .arco-message-success {
        background-color: var(--color-bg-popup);
        border-color: var(--color-neutral-3)
    }

    .arco-message-success .arco-message-icon {
        color: rgb(var(--success-6))
    }

    .arco-message-success .arco-message-content {
        color: var(--color-text-1)
    }

    .arco-message-warning {
        background-color: var(--color-bg-popup);
        border-color: var(--color-neutral-3)
    }

    .arco-message-warning .arco-message-icon {
        color: rgb(var(--warning-6))
    }

    .arco-message-warning .arco-message-content {
        color: var(--color-text-1)
    }

    .arco-message-error {
        background-color: var(--color-bg-popup);
        border-color: var(--color-neutral-3)
    }

    .arco-message-error .arco-message-icon {
        color: rgb(var(--danger-6))
    }

    .arco-message-error .arco-message-content {
        color: var(--color-text-1)
    }

    .arco-message-loading {
        background-color: var(--color-bg-popup);
        border-color: var(--color-neutral-3)
    }

    .arco-message-loading .arco-message-icon {
        color: rgb(var(--primary-6))
    }

    .arco-message-loading .arco-message-content {
        color: var(--color-text-1)
    }

    .arco-message-close-btn {
        color: var(--color-text-1);
        font-size: 12px;
        position: absolute;
        top: 14px;
        right: 12px
    }

    .arco-message-close-btn>svg {
        position: relative
    }

    .arco-message .arco-icon-hover.arco-message-icon-hover:before {
        width: 20px;
        height: 20px
    }

    .fadeMessage-enter,
    .fadeMessage-appear {
        opacity: 0
    }

    .fadeMessage-enter-active,
    .fadeMessage-appear-active {
        opacity: 1;
        transition: opacity .1s cubic-bezier(0, 0, 1, 1)
    }

    .fadeMessage-exit {
        opacity: 0;
        overflow: hidden
    }

    .fadeMessage-exit-active {
        opacity: 0;
        height: 0;
        transition: all .3s cubic-bezier(.34, .69, .1, 1)
    }

    .arco-message-rtl {
        direction: rtl
    }

    .arco-message-rtl .arco-message-icon {
        margin-left: 8px;
        margin-right: 0
    }

    @keyframes arco-msg-fade {
        0% {
            opacity: 0
        }

        to {
            opacity: 1
        }
    }

    @keyframes arco-msg-scale {
        0% {
            transform: scale(0)
        }

        to {
            transform: scale(1)
        }
    }
}


.ps {
    overflow-anchor: none;
    -ms-overflow-style: none;
    touch-action: auto;
    -ms-touch-action: auto;
    overflow: hidden !important
}

.ps__rail-x {
    opacity: 0;
    height: 15px;
    transition: background-color .2s linear, opacity .2s linear;
    display: none;
    position: absolute;
    bottom: 0
}

.ps__rail-y {
    opacity: 0;
    width: 15px;
    transition: background-color .2s linear, opacity .2s linear;
    display: none;
    position: absolute;
    right: 0
}

.ps--active-x>.ps__rail-x,
.ps--active-y>.ps__rail-y {
    background-color: transparent;
    display: block
}

.ps:hover>.ps__rail-x,
.ps:hover>.ps__rail-y,
.ps--focus>.ps__rail-x,
.ps--focus>.ps__rail-y,
.ps--scrolling-x>.ps__rail-x,
.ps--scrolling-y>.ps__rail-y {
    opacity: .6
}

.ps .ps__rail-x:hover,
.ps .ps__rail-y:hover,
.ps .ps__rail-x:focus,
.ps .ps__rail-y:focus,
.ps .ps__rail-x.ps--clicking,
.ps .ps__rail-y.ps--clicking {
    opacity: .9;
    background-color: #eee
}

.ps__thumb-x {
    background-color: #aaa;
    border-radius: 6px;
    height: 6px;
    transition: background-color .2s linear, height .2s ease-in-out;
    position: absolute;
    bottom: 2px
}

.ps__thumb-y {
    background-color: #aaa;
    border-radius: 6px;
    width: 6px;
    transition: background-color .2s linear, width .2s ease-in-out;
    position: absolute;
    right: 2px
}

.ps__rail-x:hover>.ps__thumb-x,
.ps__rail-x:focus>.ps__thumb-x,
.ps__rail-x.ps--clicking .ps__thumb-x {
    background-color: #999;
    height: 11px
}

.ps__rail-y:hover>.ps__thumb-y,
.ps__rail-y:focus>.ps__thumb-y,
.ps__rail-y.ps--clicking .ps__thumb-y {
    background-color: #999;
    width: 11px
}

@supports (-ms-overflow-style:none) {
    .ps {
        overflow: auto !important
    }
}

@media screen and (-ms-high-contrast:active),
(-ms-high-contrast:none) {
    .ps {
        overflow: auto !important
    }
}


.reset_focus_outline:focus {
    --hack-merge-rules: true;
    outline: none
}

.reset_focus_outline:focus-visible {
    outline: none
}

.ud__svg-spin-loading {
    box-sizing: border-box;
    animation: 1.2s linear infinite SpinSVGRotate
}

.ud__svg-spin-loading>circle {
    stroke-dasharray: 1 220;
    stroke-dashoffset: 0;
    stroke-linecap: round;
    animation: 2.5s ease-in-out infinite SpinSVGDash
}

@keyframes SpinSVGRotate {
    to {
        transform: rotate(360deg)
    }
}

@keyframes SpinSVGDash {
    0% {
        stroke-dasharray: 1 220;
        stroke-dashoffset: 0
    }

    50% {
        stroke-dasharray: 150 220;
        stroke-dashoffset: -68px
    }

    to {
        stroke-dasharray: 150 220;
        stroke-dashoffset: -218px
    }
}


body {
    color: #1f2329;
    background-color: #fff;
    margin: 0
}

body,
input,
button,
select,
optgroup,
textarea,
body.ud__lang-zh,
input.ud__lang-zh,
button.ud__lang-zh,
select.ud__lang-zh,
optgroup.ud__lang-zh,
textarea.ud__lang-zh,
.ud__lang-zh body,
.ud__lang-zh input,
.ud__lang-zh button,
.ud__lang-zh select,
.ud__lang-zh optgroup,
.ud__lang-zh textarea,
body.ud__lang-en,
input.ud__lang-en,
button.ud__lang-en,
select.ud__lang-en,
optgroup.ud__lang-en,
textarea.ud__lang-en,
.ud__lang-en body,
.ud__lang-en input,
.ud__lang-en button,
.ud__lang-en select,
.ud__lang-en optgroup,
.ud__lang-en textarea {
    font-family: LarkEmojiFont, LarkChineseQuote, -apple-system, BlinkMacSystemFont, Helvetica Neue, Tahoma, PingFang SC, Microsoft Yahei, Arial, Hiragino Sans GB, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji
}

body.ud__lang-jp,
input.ud__lang-jp,
button.ud__lang-jp,
select.ud__lang-jp,
optgroup.ud__lang-jp,
textarea.ud__lang-jp,
.ud__lang-jp body,
.ud__lang-jp input,
.ud__lang-jp button,
.ud__lang-jp select,
.ud__lang-jp optgroup,
.ud__lang-jp textarea {
    font-family: ヒラギノ角ゴ Pro W3, Hiragino Kaku Gothic Pro, Yu Gothic UI, 游ゴシック体, Noto Sans Japanese, Microsoft Jhenghei UI, Microsoft Yahei UI, ＭＳ Ｐゴシック, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji
}

input::-ms-clear {
    display: none
}

input::-ms-reveal {
    display: none
}

input,
button,
select,
optgroup,
textarea {
    color: inherit;
    font-family: inherit
}

.ud-scrollbar::-webkit-scrollbar-thumb {
    background-color: rgba(31, 35, 41, .3);
    background-clip: padding-box;
    border: 2px solid transparent;
    border-radius: 9999px;
    transition: background .2s cubic-bezier(.34, .69, .1, 1)
}

.ud-scrollbar::-webkit-scrollbar {
    background-color: transparent;
    width: 11px;
    height: 11px
}

.ud-scrollbar::-webkit-scrollbar-thumb:hover {
    background-color: rgba(31, 35, 41, .6) !important
}

.ud-scrollbar::-webkit-scrollbar:hover {
    width: 11px;
    height: 11px
}

.ud-scrollbar::-webkit-scrollbar-button {
    display: none
}

.ud-scrollbar::-webkit-scrollbar-track {
    background-color: transparent
}

.ud-scrollbar::-webkit-scrollbar-corner {
    background-color: transparent
}

.rc-virtual-list-scrollbar {
    width: 11px !important
}

.rc-virtual-list-scrollbar-thumb {
    box-sizing: border-box;
    padding: 2px;
    background: 0 0 !important;
    width: 11px !important
}

.rc-virtual-list-scrollbar-thumb:after {
    box-sizing: border-box;
    content: " ";
    border-radius: 9999px;
    width: 100%;
    height: 100%;
    transition: background-color .2s cubic-bezier(.34, .69, .1, 1);
    display: block;
    background-color: rgba(31, 35, 41, .3) !important
}

.rc-virtual-list-scrollbar-thumb:hover:after {
    background-color: rgba(31, 35, 41, .6) !important
}

[type=search] {
    outline-offset: -2px;
    -webkit-appearance: none
}

[type=search]::-webkit-search-cancel-button {
    -webkit-appearance: none
}

[type=search]::-webkit-search-decoration {
    -webkit-appearance: none
}

.reset_focus_outline:focus {
    --hack-merge-rules: true;
    outline: none
}

.reset_focus_outline:focus-visible {
    outline: none
}

.ud-slide-up-enter,
.ud-slide-up-appear,
.ud-slide-up-leave {
    animation-duration: .2s;
    animation-play-state: paused;
    animation-fill-mode: both
}

.ud-slide-up-enter.ud-slide-up-enter-active,
.ud-slide-up-appear.ud-slide-up-appear-active {
    animation-name: udSlideUpIn;
    animation-play-state: running
}

.ud-slide-up-leave.ud-slide-up-leave-active {
    pointer-events: none;
    animation-name: udSlideUpOut;
    animation-play-state: running
}

.ud-slide-up-enter,
.ud-slide-up-appear {
    opacity: 0;
    animation-timing-function: cubic-bezier(.34, .69, .1, 1)
}

.ud-slide-up-leave {
    animation-timing-function: cubic-bezier(.34, .69, .1, 1)
}

.ud-slide-down-enter,
.ud-slide-down-appear,
.ud-slide-down-leave {
    animation-duration: .2s;
    animation-play-state: paused;
    animation-fill-mode: both
}

.ud-slide-down-enter.ud-slide-down-enter-active,
.ud-slide-down-appear.ud-slide-down-appear-active {
    animation-name: udSlideDownIn;
    animation-play-state: running
}

.ud-slide-down-leave.ud-slide-down-leave-active {
    pointer-events: none;
    animation-name: udSlideDownOut;
    animation-play-state: running
}

.ud-slide-down-enter,
.ud-slide-down-appear {
    opacity: 0;
    animation-timing-function: cubic-bezier(.34, .69, .1, 1)
}

.ud-slide-down-leave {
    animation-timing-function: cubic-bezier(.34, .69, .1, 1)
}

.ud-slide-left-enter,
.ud-slide-left-appear,
.ud-slide-left-leave {
    animation-duration: .2s;
    animation-play-state: paused;
    animation-fill-mode: both
}

.ud-slide-left-enter.ud-slide-left-enter-active,
.ud-slide-left-appear.ud-slide-left-appear-active {
    animation-name: udSlideLeftIn;
    animation-play-state: running
}

.ud-slide-left-leave.ud-slide-left-leave-active {
    pointer-events: none;
    animation-name: udSlideLeftOut;
    animation-play-state: running
}

.ud-slide-left-enter,
.ud-slide-left-appear {
    opacity: 0;
    animation-timing-function: cubic-bezier(.34, .69, .1, 1)
}

.ud-slide-left-leave {
    animation-timing-function: cubic-bezier(.34, .69, .1, 1)
}

.ud-slide-right-enter,
.ud-slide-right-appear,
.ud-slide-right-leave {
    animation-duration: .2s;
    animation-play-state: paused;
    animation-fill-mode: both
}

.ud-slide-right-enter.ud-slide-right-enter-active,
.ud-slide-right-appear.ud-slide-right-appear-active {
    animation-name: udSlideRightIn;
    animation-play-state: running
}

.ud-slide-right-leave.ud-slide-right-leave-active {
    pointer-events: none;
    animation-name: udSlideRightOut;
    animation-play-state: running
}

.ud-slide-right-enter,
.ud-slide-right-appear {
    opacity: 0;
    animation-timing-function: cubic-bezier(.34, .69, .1, 1)
}

.ud-slide-right-leave {
    animation-timing-function: cubic-bezier(.34, .69, .1, 1)
}

@keyframes udSlideUpIn {
    0% {
        transform-origin: 0 0;
        opacity: 0;
        transform: translateY(-8px)
    }

    to {
        transform-origin: 0 0;
        opacity: 1;
        transform: translateY(0)
    }
}

@keyframes udSlideUpOut {
    0% {
        transform-origin: 0 0;
        opacity: 1;
        transform: translateY(0)
    }

    to {
        transform-origin: 0 0;
        opacity: 0;
        transform: translateY(-8px)
    }
}

@keyframes udSlideDownIn {
    0% {
        transform-origin: 100% 100%;
        opacity: 0;
        transform: translateY(8px)
    }

    to {
        transform-origin: 100% 100%;
        opacity: 1;
        transform: translateY(0)
    }
}

@keyframes udSlideDownOut {
    0% {
        transform-origin: 100% 100%;
        opacity: 1;
        transform: translateY(0)
    }

    to {
        transform-origin: 100% 100%;
        opacity: 0;
        transform: translateY(8px)
    }
}

@keyframes udSlideLeftIn {
    0% {
        transform-origin: 0 0;
        opacity: 0;
        transform: scaleX(.5)
    }

    to {
        transform-origin: 0 0;
        opacity: 1;
        transform: scaleX(1)
    }
}

@keyframes udSlideLeftOut {
    0% {
        transform-origin: 0 0;
        opacity: 1;
        transform: scaleX(1)
    }

    to {
        transform-origin: 0 0;
        opacity: 0;
        transform: scaleX(.5)
    }
}

@keyframes udSlideRightIn {
    0% {
        transform-origin: 100% 0;
        opacity: 0;
        transform: scaleX(.5)
    }

    to {
        transform-origin: 100% 0;
        opacity: 1;
        transform: scaleX(1)
    }
}

@keyframes udSlideRightOut {
    0% {
        transform-origin: 100% 0;
        opacity: 1;
        transform: scaleX(1)
    }

    to {
        transform-origin: 100% 0;
        opacity: 0;
        transform: scaleX(.5)
    }
}

.zoom-enter,
.zoom-appear,
.zoom-leave {
    animation-duration: .2s;
    animation-play-state: paused;
    animation-fill-mode: both
}

.zoom-enter.zoom-enter-active,
.zoom-appear.zoom-appear-active {
    animation-name: udZoomIn;
    animation-play-state: running
}

.zoom-leave.zoom-leave-active {
    pointer-events: none;
    animation-name: udZoomOut;
    animation-play-state: running
}

.zoom-enter,
.zoom-appear {
    opacity: 0;
    animation-timing-function: cubic-bezier(.08, .82, .17, 1);
    transform: scale(0)
}

.zoom-enter-prepare,
.zoom-appear-prepare {
    transform: none
}

.zoom-leave {
    animation-timing-function: cubic-bezier(.78, .14, .15, .86)
}

.ud-zoom-big-enter,
.ud-zoom-big-appear,
.ud-zoom-big-leave {
    animation-duration: .2s;
    animation-play-state: paused;
    animation-fill-mode: both
}

.ud-zoom-big-enter.ud-zoom-big-enter-active,
.ud-zoom-big-appear.ud-zoom-big-appear-active {
    animation-name: udZoomBigIn;
    animation-play-state: running
}

.ud-zoom-big-leave.ud-zoom-big-leave-active {
    pointer-events: none;
    animation-name: udZoomBigOut;
    animation-play-state: running
}

.ud-zoom-big-enter,
.ud-zoom-big-appear {
    opacity: 0;
    animation-timing-function: cubic-bezier(.08, .82, .17, 1);
    transform: scale(0)
}

.ud-zoom-big-enter-prepare,
.ud-zoom-big-appear-prepare {
    transform: none
}

.ud-zoom-big-leave {
    animation-timing-function: cubic-bezier(.78, .14, .15, .86)
}

.ud-zoom-big-fast-enter,
.ud-zoom-big-fast-appear,
.ud-zoom-big-fast-leave {
    animation-duration: .1s;
    animation-play-state: paused;
    animation-fill-mode: both
}

.ud-zoom-big-fast-enter.ud-zoom-big-fast-enter-active,
.ud-zoom-big-fast-appear.ud-zoom-big-fast-appear-active {
    animation-name: udZoomBigIn;
    animation-play-state: running
}

.ud-zoom-big-fast-leave.ud-zoom-big-fast-leave-active {
    pointer-events: none;
    animation-name: udZoomBigOut;
    animation-play-state: running
}

.ud-zoom-big-fast-enter,
.ud-zoom-big-fast-appear {
    opacity: 0;
    animation-timing-function: cubic-bezier(.08, .82, .17, 1);
    transform: scale(0)
}

.ud-zoom-big-fast-enter-prepare,
.ud-zoom-big-fast-appear-prepare {
    transform: none
}

.ud-zoom-big-fast-leave {
    animation-timing-function: cubic-bezier(.78, .14, .15, .86)
}

.ud-zoom-up-enter,
.ud-zoom-up-appear,
.ud-zoom-up-leave {
    animation-duration: .2s;
    animation-play-state: paused;
    animation-fill-mode: both
}

.ud-zoom-up-enter.ud-zoom-up-enter-active,
.ud-zoom-up-appear.ud-zoom-up-appear-active {
    animation-name: udZoomUpIn;
    animation-play-state: running
}

.ud-zoom-up-leave.ud-zoom-up-leave-active {
    pointer-events: none;
    animation-name: udZoomUpOut;
    animation-play-state: running
}

.ud-zoom-up-enter,
.ud-zoom-up-appear {
    opacity: 0;
    animation-timing-function: cubic-bezier(.08, .82, .17, 1);
    transform: scale(0)
}

.ud-zoom-up-enter-prepare,
.ud-zoom-up-appear-prepare {
    transform: none
}

.ud-zoom-up-leave {
    animation-timing-function: cubic-bezier(.78, .14, .15, .86)
}

.ud-zoom-down-enter,
.ud-zoom-down-appear,
.ud-zoom-down-leave {
    animation-duration: .2s;
    animation-play-state: paused;
    animation-fill-mode: both
}

.ud-zoom-down-enter.ud-zoom-down-enter-active,
.ud-zoom-down-appear.ud-zoom-down-appear-active {
    animation-name: udZoomDownIn;
    animation-play-state: running
}

.ud-zoom-down-leave.ud-zoom-down-leave-active {
    pointer-events: none;
    animation-name: udZoomDownOut;
    animation-play-state: running
}

.ud-zoom-down-enter,
.ud-zoom-down-appear {
    opacity: 0;
    animation-timing-function: cubic-bezier(.08, .82, .17, 1);
    transform: scale(0)
}

.ud-zoom-down-enter-prepare,
.ud-zoom-down-appear-prepare {
    transform: none
}

.ud-zoom-down-leave {
    animation-timing-function: cubic-bezier(.78, .14, .15, .86)
}

.ud-zoom-left-enter,
.ud-zoom-left-appear,
.ud-zoom-left-leave {
    animation-duration: .2s;
    animation-play-state: paused;
    animation-fill-mode: both
}

.ud-zoom-left-enter.ud-zoom-left-enter-active,
.ud-zoom-left-appear.ud-zoom-left-appear-active {
    animation-name: udZoomLeftIn;
    animation-play-state: running
}

.ud-zoom-left-leave.ud-zoom-left-leave-active {
    pointer-events: none;
    animation-name: udZoomLeftOut;
    animation-play-state: running
}

.ud-zoom-left-enter,
.ud-zoom-left-appear {
    opacity: 0;
    animation-timing-function: cubic-bezier(.08, .82, .17, 1);
    transform: scale(0)
}

.ud-zoom-left-enter-prepare,
.ud-zoom-left-appear-prepare {
    transform: none
}

.ud-zoom-left-leave {
    animation-timing-function: cubic-bezier(.78, .14, .15, .86)
}

.ud-zoom-right-enter,
.ud-zoom-right-appear,
.ud-zoom-right-leave {
    animation-duration: .2s;
    animation-play-state: paused;
    animation-fill-mode: both
}

.ud-zoom-right-enter.ud-zoom-right-enter-active,
.ud-zoom-right-appear.ud-zoom-right-appear-active {
    animation-name: udZoomRightIn;
    animation-play-state: running
}

.ud-zoom-right-leave.ud-zoom-right-leave-active {
    pointer-events: none;
    animation-name: udZoomRightOut;
    animation-play-state: running
}

.ud-zoom-right-enter,
.ud-zoom-right-appear {
    opacity: 0;
    animation-timing-function: cubic-bezier(.08, .82, .17, 1);
    transform: scale(0)
}

.ud-zoom-right-enter-prepare,
.ud-zoom-right-appear-prepare {
    transform: none
}

.ud-zoom-right-leave {
    animation-timing-function: cubic-bezier(.78, .14, .15, .86)
}

@keyframes udZoomIn {
    0% {
        opacity: 0;
        transform: scale(.2)
    }

    to {
        opacity: 1;
        transform: scale(1)
    }
}

@keyframes udZoomOut {
    0% {
        transform: scale(1)
    }

    to {
        opacity: 0;
        transform: scale(.2)
    }
}

@keyframes udZoomBigIn {
    0% {
        opacity: 0;
        transform: scale(.8)
    }

    to {
        opacity: 1;
        transform: scale(1)
    }
}

@keyframes udZoomBigOut {
    0% {
        transform: scale(1)
    }

    to {
        opacity: 0;
        transform: scale(.8)
    }
}

@keyframes udZoomUpIn {
    0% {
        transform-origin: 50% 0;
        opacity: 0;
        transform: scale(.8)
    }

    to {
        transform-origin: 50% 0;
        transform: scale(1)
    }
}

@keyframes udZoomUpOut {
    0% {
        transform-origin: 50% 0;
        transform: scale(1)
    }

    to {
        transform-origin: 50% 0;
        opacity: 0;
        transform: scale(.8)
    }
}

@keyframes udZoomLeftIn {
    0% {
        transform-origin: 0%;
        opacity: 0;
        transform: scale(.8)
    }

    to {
        transform-origin: 0%;
        transform: scale(1)
    }
}

@keyframes udZoomLeftOut {
    0% {
        transform-origin: 0%;
        transform: scale(1)
    }

    to {
        transform-origin: 0%;
        opacity: 0;
        transform: scale(.8)
    }
}

@keyframes udZoomRightIn {
    0% {
        transform-origin: 100%;
        opacity: 0;
        transform: scale(.8)
    }

    to {
        transform-origin: 100%;
        transform: scale(1)
    }
}

@keyframes udZoomRightOut {
    0% {
        transform-origin: 100%;
        transform: scale(1)
    }

    to {
        transform-origin: 100%;
        opacity: 0;
        transform: scale(.8)
    }
}

@keyframes udZoomDownIn {
    0% {
        transform-origin: 50% 100%;
        opacity: 0;
        transform: scale(.8)
    }

    to {
        transform-origin: 50% 100%;
        transform: scale(1)
    }
}

@keyframes udZoomDownOut {
    0% {
        transform-origin: 50% 100%;
        transform: scale(1)
    }

    to {
        transform-origin: 50% 100%;
        opacity: 0;
        transform: scale(.8)
    }
}

.ud-motion-collapse {
    overflow: hidden;
    transition: height .2s cubic-bezier(.645, .045, .355, 1), opacity .2s cubic-bezier(.645, .045, .355, 1) !important
}


.reset_focus_outline:focus {
    --hack-merge-rules: true;
    outline: none
}

.reset_focus_outline:focus-visible {
    outline: none
}

.ud__button {
    box-sizing: border-box;
    color: #1f2329;
    font-variant: tabular-nums;
    white-space: nowrap;
    text-align: center;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    touch-action: manipulation;
    background: 0 0;
    border: 1px solid #fff;
    outline: none;
    margin: 0;
    padding: 0;
    font-size: 14px;
    line-height: 1.5715;
    text-decoration: none;
    list-style: none;
    transition: color .1s ease-in, background-color .1s ease-in, border-color .1s ease-in, width .2s ease-in;
    display: inline-block;
    position: relative
}

.ud__button>a:only-child {
    color: currentColor
}

.ud__button>a:only-child:after {
    content: "";
    background: 0 0;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0
}

.ud__button--size-xs {
    border-radius: 4px;
    min-width: 48px;
    height: 24px;
    padding: 1px 7px;
    font-size: 12px;
    line-height: 20px
}

.ud__button--size-xs.ud__button--square,
.ud__button--size-xs.ud__button--circle {
    width: 24px;
    min-width: initial;
    text-align: center;
    padding-left: initial;
    padding-right: initial
}

.ud__button--size-sm {
    border-radius: 4px;
    min-width: 48px;
    height: 28px;
    padding: 3px 7px;
    font-size: 12px;
    line-height: 20px
}

.ud__button--size-sm.ud__button--square,
.ud__button--size-sm.ud__button--circle {
    width: 28px;
    min-width: initial;
    text-align: center;
    padding-left: initial;
    padding-right: initial
}

.ud__button--size-md {
    border-radius: 4px;
    min-width: 80px;
    height: 32px;
    padding: 4px 11px;
    font-size: 14px;
    line-height: 22px
}

.ud__button--size-md.ud__button--square,
.ud__button--size-md.ud__button--circle {
    width: 32px;
    min-width: initial;
    text-align: center;
    padding-left: initial;
    padding-right: initial
}

.ud__button--size-lg {
    border-radius: 4px;
    min-width: 96px;
    height: 40px;
    padding: 7px 15px;
    font-size: 16px;
    line-height: 24px
}

.ud__button--size-lg.ud__button--square,
.ud__button--size-lg.ud__button--circle {
    width: 40px;
    min-width: initial;
    text-align: center;
    padding-left: initial;
    padding-right: initial
}

.ud__button--size-xl {
    border-radius: 4px;
    min-width: 100px;
    height: 48px;
    padding: 10px 15px;
    font-size: 18px;
    line-height: 26px
}

.ud__button--size-xl.ud__button--square,
.ud__button--size-xl.ud__button--circle {
    width: 48px;
    min-width: initial;
    text-align: center;
    padding-left: initial;
    padding-right: initial
}

.ud__button--circle {
    border-radius: 50%
}

.ud__button--round {
    border-radius: 999999px
}

.ud__button--filled-default {
    color: #fff;
    background: #3370ff;
    border-color: #3370ff
}

.ud__button--filled-default:hover {
    color: #fff;
    background: #4e83fd;
    border-color: #4e83fd
}

.ud__button--filled-default:focus-visible {
    color: #fff;
    --hack-merge-rules: true;
    background: #4e83fd;
    border-color: #4e83fd
}

.ud__button--filled-default:active {
    color: #fff;
    background: #245bdb;
    border-color: #245bdb
}

.ud__button--filled-default-loading,
.ud__button--filled-default-loading:hover,
.ud__button--filled-default-loading:active {
    color: #fff;
    cursor: default;
    background: #82a7fc;
    border-color: #82a7fc
}

.ud__button--filled-default-loading:focus-visible {
    color: #fff;
    cursor: default;
    --hack-merge-rules: true;
    background: #82a7fc;
    border-color: #82a7fc
}

.ud__button--filled-default-loading .ud__button__loading-icon {
    color: #fff
}

.ud__button--filled-primary {
    color: #fff;
    background: #3370ff;
    border-color: #3370ff
}

.ud__button--filled-primary:hover {
    color: #fff;
    background: #4e83fd;
    border-color: #4e83fd
}

.ud__button--filled-primary:focus-visible {
    color: #fff;
    --hack-merge-rules: true;
    background: #4e83fd;
    border-color: #4e83fd
}

.ud__button--filled-primary:active {
    color: #fff;
    background: #245bdb;
    border-color: #245bdb
}

.ud__button--filled-primary-loading,
.ud__button--filled-primary-loading:hover,
.ud__button--filled-primary-loading:active {
    color: #fff;
    cursor: default;
    background: #82a7fc;
    border-color: #82a7fc
}

.ud__button--filled-primary-loading:focus-visible {
    color: #fff;
    cursor: default;
    --hack-merge-rules: true;
    background: #82a7fc;
    border-color: #82a7fc
}

.ud__button--filled-primary-loading .ud__button__loading-icon {
    color: #fff
}

.ud__button--filled-danger {
    color: #fff;
    background: #f54a45;
    border-color: #f54a45
}

.ud__button--filled-danger:hover {
    color: #fff;
    background: #f76964;
    border-color: #f76964
}

.ud__button--filled-danger:focus-visible {
    color: #fff;
    --hack-merge-rules: true;
    background: #f76964;
    border-color: #f76964
}

.ud__button--filled-danger:active {
    color: #fff;
    background: #d83931;
    border-color: #d83931
}

.ud__button--filled-danger-loading,
.ud__button--filled-danger-loading:hover,
.ud__button--filled-danger-loading:active {
    color: #fff;
    cursor: default;
    background: #f98e8b;
    border-color: #f98e8b
}

.ud__button--filled-danger-loading:focus-visible {
    color: #fff;
    cursor: default;
    --hack-merge-rules: true;
    background: #f98e8b;
    border-color: #f98e8b
}

.ud__button--filled-danger-loading .ud__button__loading-icon {
    color: #fff
}

.ud__button--filled[disabled],
.ud__button--filled:disabled,
.ud__button--filled[disabled]:hover,
.ud__button--filled:disabled:hover,
.ud__button--filled[disabled]:active,
.ud__button--filled:disabled:active {
    color: #fff;
    cursor: not-allowed;
    background: #bbbfc4;
    border-color: #bbbfc4
}

.ud__button--filled[disabled]:focus-visible {
    color: #fff;
    cursor: not-allowed;
    --hack-merge-rules: true;
    background: #bbbfc4;
    border-color: #bbbfc4
}

.ud__button--filled:disabled:focus-visible {
    color: #fff;
    cursor: not-allowed;
    --hack-merge-rules: true;
    background: #bbbfc4;
    border-color: #bbbfc4
}

.ud__button--outlined-default {
    color: #1f2329;
    background: #fff;
    border-color: #bbbfc4
}

.ud__button--outlined-default:hover {
    color: #1f2329;
    background: #f2f3f5;
    border-color: #bbbfc4
}

.ud__button--outlined-default:focus-visible {
    color: #1f2329;
    --hack-merge-rules: true;
    background: #f2f3f5;
    border-color: #bbbfc4
}

.ud__button--outlined-default:active {
    color: #1f2329;
    background: #eff0f1;
    border-color: #bbbfc4
}

.ud__button--outlined-default-loading,
.ud__button--outlined-default-loading:hover,
.ud__button--outlined-default-loading:active {
    color: #8f959e;
    cursor: default;
    background: #fff;
    border-color: #bbbfc4
}

.ud__button--outlined-default-loading:focus-visible {
    color: #8f959e;
    cursor: default;
    --hack-merge-rules: true;
    background: #fff;
    border-color: #bbbfc4
}

.ud__button--outlined-default-loading .ud__button__loading-icon {
    color: #3370ff
}

.ud__button--outlined-primary {
    color: #3370ff;
    background: #fff;
    border-color: #3370ff
}

.ud__button--outlined-primary:hover {
    color: #3370ff;
    background: #e1eaff;
    border-color: #3370ff
}

.ud__button--outlined-primary:focus-visible {
    color: #3370ff;
    --hack-merge-rules: true;
    background: #e1eaff;
    border-color: #3370ff
}

.ud__button--outlined-primary:active {
    color: #3370ff;
    background: #bacefd;
    border-color: #3370ff
}

.ud__button--outlined-primary-loading,
.ud__button--outlined-primary-loading:hover,
.ud__button--outlined-primary-loading:active {
    color: #82a7fc;
    cursor: default;
    background: #fff;
    border-color: #82a7fc
}

.ud__button--outlined-primary-loading:focus-visible {
    color: #82a7fc;
    cursor: default;
    --hack-merge-rules: true;
    background: #fff;
    border-color: #82a7fc
}

.ud__button--outlined-primary-loading .ud__button__loading-icon {
    color: #3370ff
}

.ud__button--outlined-danger {
    color: #f54a45;
    background: #fff;
    border-color: #f54a45
}

.ud__button--outlined-danger:hover {
    color: #f54a45;
    background: #fde2e2;
    border-color: #f54a45
}

.ud__button--outlined-danger:focus-visible {
    color: #f54a45;
    --hack-merge-rules: true;
    background: #fde2e2;
    border-color: #f54a45
}

.ud__button--outlined-danger:active {
    color: #f54a45;
    background: #fbbfbc;
    border-color: #f54a45
}

.ud__button--outlined-danger-loading,
.ud__button--outlined-danger-loading:hover,
.ud__button--outlined-danger-loading:active {
    color: #f98e8b;
    cursor: default;
    background: #fff;
    border-color: #f98e8b
}

.ud__button--outlined-danger-loading:focus-visible {
    color: #f98e8b;
    cursor: default;
    --hack-merge-rules: true;
    background: #fff;
    border-color: #f98e8b
}

.ud__button--outlined-danger-loading .ud__button__loading-icon {
    color: #f54a45
}

.ud__button--outlined[disabled],
.ud__button--outlined:disabled,
.ud__button--outlined[disabled]:hover,
.ud__button--outlined:disabled:hover,
.ud__button--outlined[disabled]:active,
.ud__button--outlined:disabled:active {
    color: #bbbfc4;
    cursor: not-allowed;
    background: #fff;
    border-color: #bbbfc4
}

.ud__button--outlined[disabled]:focus-visible {
    color: #bbbfc4;
    cursor: not-allowed;
    --hack-merge-rules: true;
    background: #fff;
    border-color: #bbbfc4
}

.ud__button--outlined:disabled:focus-visible {
    color: #bbbfc4;
    cursor: not-allowed;
    --hack-merge-rules: true;
    background: #fff;
    border-color: #bbbfc4
}

.ud__button--text {
    height: initial;
    min-width: initial;
    border: none;
    padding: 2px 4px
}

.ud__button--text-default {
    color: #1f2329;
    background: 0 0;
    border-color: transparent
}

.ud__button--text-default-selected,
.ud__button--text-default:hover {
    color: #1f2329;
    background: rgba(31, 35, 41, .1);
    border-color: transparent
}

.ud__button--text-default:focus-visible {
    color: #1f2329;
    --hack-merge-rules: true;
    background: rgba(31, 35, 41, .1);
    border-color: transparent
}

.ud__button--text-default:active {
    color: #1f2329;
    background: rgba(31, 35, 41, .2);
    border-color: transparent
}

.ud__button--text-default-loading,
.ud__button--text-default-loading:hover,
.ud__button--text-default-loading:active {
    color: #8f959e;
    cursor: default;
    background: 0 0;
    border-color: transparent
}

.ud__button--text-default-loading:focus-visible {
    color: #8f959e;
    cursor: default;
    --hack-merge-rules: true;
    background: 0 0;
    border-color: transparent
}

.ud__button--text-default-loading .ud__button__loading-icon {
    color: #3370ff
}

.ud__button--text-primary {
    color: #3370ff;
    background: 0 0;
    border-color: transparent
}

.ud__button--text-primary-selected,
.ud__button--text-primary:hover {
    color: #3370ff;
    background: rgba(51, 112, 255, .1);
    border-color: transparent
}

.ud__button--text-primary:focus-visible {
    color: #3370ff;
    --hack-merge-rules: true;
    background: rgba(51, 112, 255, .1);
    border-color: transparent
}

.ud__button--text-primary:active {
    color: #3370ff;
    background: rgba(51, 112, 255, .2);
    border-color: transparent
}

.ud__button--text-primary-loading,
.ud__button--text-primary-loading:hover,
.ud__button--text-primary-loading:active {
    color: #82a7fc;
    cursor: default;
    background: 0 0;
    border-color: transparent
}

.ud__button--text-primary-loading:focus-visible {
    color: #82a7fc;
    cursor: default;
    --hack-merge-rules: true;
    background: 0 0;
    border-color: transparent
}

.ud__button--text-primary-loading .ud__button__loading-icon {
    color: #3370ff
}

.ud__button--text-danger {
    color: #f54a45;
    background: 0 0;
    border-color: transparent
}

.ud__button--text-danger-selected,
.ud__button--text-danger:hover {
    color: #f54a45;
    background: rgba(245, 74, 69, .1);
    border-color: transparent
}

.ud__button--text-danger:focus-visible {
    color: #f54a45;
    --hack-merge-rules: true;
    background: rgba(245, 74, 69, .1);
    border-color: transparent
}

.ud__button--text-danger:active {
    color: #f54a45;
    background: rgba(245, 74, 69, .2);
    border-color: transparent
}

.ud__button--text-danger-loading,
.ud__button--text-danger-loading:hover,
.ud__button--text-danger-loading:active {
    color: #f98e8b;
    cursor: default;
    background: 0 0;
    border-color: transparent
}

.ud__button--text-danger-loading:focus-visible {
    color: #f98e8b;
    cursor: default;
    --hack-merge-rules: true;
    background: 0 0;
    border-color: transparent
}

.ud__button--text-danger-loading .ud__button__loading-icon {
    color: #f54a45
}

.ud__button--text[disabled],
.ud__button--text:disabled,
.ud__button--text[disabled]:hover,
.ud__button--text:disabled:hover,
.ud__button--text[disabled]:active,
.ud__button--text:disabled:active {
    color: #bbbfc4;
    cursor: not-allowed;
    background: 0 0;
    border-color: transparent
}

.ud__button--text[disabled]:focus-visible {
    color: #bbbfc4;
    cursor: not-allowed;
    --hack-merge-rules: true;
    background: 0 0;
    border-color: transparent
}

.ud__button--text:disabled:focus-visible {
    color: #bbbfc4;
    cursor: not-allowed;
    --hack-merge-rules: true;
    background: 0 0;
    border-color: transparent
}

.ud__button--text-secondary {
    height: initial;
    padding: initial;
    min-width: initial;
    border: none
}

.ud__button--text-secondary-default {
    color: #1f2329;
    background: 0 0;
    border-color: transparent
}

.ud__button--text-secondary-default-selected,
.ud__button--text-secondary-default:hover {
    color: #3370ff;
    background: 0 0;
    border-color: transparent
}

.ud__button--text-secondary-default:focus-visible {
    color: #3370ff;
    --hack-merge-rules: true;
    background: 0 0;
    border-color: transparent
}

.ud__button--text-secondary-default:active {
    color: #245bdb;
    background: 0 0;
    border-color: transparent
}

.ud__button--text-secondary-default-loading,
.ud__button--text-secondary-default-loading:hover,
.ud__button--text-secondary-default-loading:active {
    color: #3370ff;
    cursor: default;
    background: 0 0;
    border-color: transparent
}

.ud__button--text-secondary-default-loading:focus-visible {
    color: #3370ff;
    cursor: default;
    --hack-merge-rules: true;
    background: 0 0;
    border-color: transparent
}

.ud__button--text-secondary-default-loading .ud__button__loading-icon {
    color: #3370ff
}

.ud__button--text-secondary-primary {
    color: #1f2329;
    background: 0 0;
    border-color: transparent
}

.ud__button--text-secondary-primary-selected,
.ud__button--text-secondary-primary:hover {
    color: #3370ff;
    background: 0 0;
    border-color: transparent
}

.ud__button--text-secondary-primary:focus-visible {
    color: #3370ff;
    --hack-merge-rules: true;
    background: 0 0;
    border-color: transparent
}

.ud__button--text-secondary-primary:active {
    color: #245bdb;
    background: 0 0;
    border-color: transparent
}

.ud__button--text-secondary-primary-loading,
.ud__button--text-secondary-primary-loading:hover,
.ud__button--text-secondary-primary-loading:active {
    color: #3370ff;
    cursor: default;
    background: 0 0;
    border-color: transparent
}

.ud__button--text-secondary-primary-loading:focus-visible {
    color: #3370ff;
    cursor: default;
    --hack-merge-rules: true;
    background: 0 0;
    border-color: transparent
}

.ud__button--text-secondary-primary-loading .ud__button__loading-icon {
    color: #3370ff
}

.ud__button--text-secondary-danger {
    color: #1f2329;
    background: 0 0;
    border-color: transparent
}

.ud__button--text-secondary-danger-selected,
.ud__button--text-secondary-danger:hover {
    color: #f54a45;
    background: 0 0;
    border-color: transparent
}

.ud__button--text-secondary-danger:focus-visible {
    color: #f54a45;
    --hack-merge-rules: true;
    background: 0 0;
    border-color: transparent
}

.ud__button--text-secondary-danger:active {
    color: #d83931;
    background: 0 0;
    border-color: transparent
}

.ud__button--text-secondary-danger-loading,
.ud__button--text-secondary-danger-loading:hover,
.ud__button--text-secondary-danger-loading:active {
    color: #3370ff;
    cursor: default;
    background: 0 0;
    border-color: transparent
}

.ud__button--text-secondary-danger-loading:focus-visible {
    color: #3370ff;
    cursor: default;
    --hack-merge-rules: true;
    background: 0 0;
    border-color: transparent
}

.ud__button--text-secondary-danger-loading .ud__button__loading-icon {
    color: #f54a45
}

.ud__button--text-secondary[disabled],
.ud__button--text-secondary:disabled,
.ud__button--text-secondary[disabled]:hover,
.ud__button--text-secondary:disabled:hover,
.ud__button--text-secondary[disabled]:active,
.ud__button--text-secondary:disabled:active {
    color: #bbbfc4;
    cursor: not-allowed;
    background: 0 0;
    border-color: transparent
}

.ud__button--text-secondary[disabled]:focus-visible {
    color: #bbbfc4;
    cursor: not-allowed;
    --hack-merge-rules: true;
    background: 0 0;
    border-color: transparent
}

.ud__button--text-secondary:disabled:focus-visible {
    color: #bbbfc4;
    cursor: not-allowed;
    --hack-merge-rules: true;
    background: 0 0;
    border-color: transparent
}

.ud__button--link {
    height: initial;
    padding: initial;
    min-width: initial;
    border: none
}

.ud__button--link-default {
    color: #3370ff;
    background: 0 0;
    border-color: transparent
}

.ud__button--link-default-selected,
.ud__button--link-default:hover {
    color: #4e83fd;
    background: 0 0;
    border-color: transparent
}

.ud__button--link-default:focus-visible {
    color: #4e83fd;
    --hack-merge-rules: true;
    background: 0 0;
    border-color: transparent
}

.ud__button--link-default:active {
    color: #245bdb;
    background: 0 0;
    border-color: transparent
}

.ud__button--link-default-loading,
.ud__button--link-default-loading:hover,
.ud__button--link-default-loading:active {
    color: #82a7fc;
    cursor: default;
    background: 0 0;
    border-color: transparent
}

.ud__button--link-default-loading:focus-visible {
    color: #82a7fc;
    cursor: default;
    --hack-merge-rules: true;
    background: 0 0;
    border-color: transparent
}

.ud__button--link-default-loading .ud__button__loading-icon {
    color: #3370ff
}

.ud__button--link-primary {
    color: #3370ff;
    background: 0 0;
    border-color: transparent
}

.ud__button--link-primary-selected,
.ud__button--link-primary:hover {
    color: #4e83fd;
    background: 0 0;
    border-color: transparent
}

.ud__button--link-primary:focus-visible {
    color: #4e83fd;
    --hack-merge-rules: true;
    background: 0 0;
    border-color: transparent
}

.ud__button--link-primary:active {
    color: #245bdb;
    background: 0 0;
    border-color: transparent
}

.ud__button--link-primary-loading,
.ud__button--link-primary-loading:hover,
.ud__button--link-primary-loading:active {
    color: #82a7fc;
    cursor: default;
    background: 0 0;
    border-color: transparent
}

.ud__button--link-primary-loading:focus-visible {
    color: #82a7fc;
    cursor: default;
    --hack-merge-rules: true;
    background: 0 0;
    border-color: transparent
}

.ud__button--link-primary-loading .ud__button__loading-icon {
    color: #3370ff
}

.ud__button--link-danger {
    color: #f54a45;
    background: 0 0;
    border-color: transparent
}

.ud__button--link-danger-selected,
.ud__button--link-danger:hover {
    color: #f76964;
    background: 0 0;
    border-color: transparent
}

.ud__button--link-danger:focus-visible {
    color: #f76964;
    --hack-merge-rules: true;
    background: 0 0;
    border-color: transparent
}

.ud__button--link-danger:active {
    color: #d83931;
    background: 0 0;
    border-color: transparent
}

.ud__button--link-danger-loading,
.ud__button--link-danger-loading:hover,
.ud__button--link-danger-loading:active {
    color: #f98e8b;
    cursor: default;
    background: 0 0;
    border-color: transparent
}

.ud__button--link-danger-loading:focus-visible {
    color: #f98e8b;
    cursor: default;
    --hack-merge-rules: true;
    background: 0 0;
    border-color: transparent
}

.ud__button--link-danger-loading .ud__button__loading-icon {
    color: #f54a45
}

.ud__button--link[disabled],
.ud__button--link:disabled,
.ud__button--link[disabled]:hover,
.ud__button--link:disabled:hover,
.ud__button--link[disabled]:active,
.ud__button--link:disabled:active {
    color: #bbbfc4;
    cursor: not-allowed;
    background: 0 0;
    border-color: transparent
}

.ud__button--link[disabled]:focus-visible {
    color: #bbbfc4;
    cursor: not-allowed;
    --hack-merge-rules: true;
    background: 0 0;
    border-color: transparent
}

.ud__button--link:disabled:focus-visible {
    color: #bbbfc4;
    cursor: not-allowed;
    --hack-merge-rules: true;
    background: 0 0;
    border-color: transparent
}

.ud__button--icon {
    min-width: initial;
    height: initial;
    border: none;
    padding: 4px;
    line-height: 0
}

.ud__button--icon.ud__button--square,
.ud__button--icon.ud__button--circle {
    width: initial;
    padding: 4px
}

.ud__button--icon-default {
    color: #2b2f36;
    background: 0 0;
    border-color: transparent
}

.ud__button--icon-default-selected,
.ud__button--icon-default:hover {
    color: #2b2f36;
    background: rgba(31, 35, 41, .1);
    border-color: transparent
}

.ud__button--icon-default:focus-visible {
    color: #2b2f36;
    --hack-merge-rules: true;
    background: rgba(31, 35, 41, .1);
    border-color: transparent
}

.ud__button--icon-default:active {
    color: #2b2f36;
    background: rgba(31, 35, 41, .2);
    border-color: transparent
}

.ud__button--icon-default-loading,
.ud__button--icon-default-loading:hover,
.ud__button--icon-default-loading:active {
    color: #8f959e;
    cursor: default;
    background: 0 0;
    border-color: transparent
}

.ud__button--icon-default-loading:focus-visible {
    color: #8f959e;
    cursor: default;
    --hack-merge-rules: true;
    background: 0 0;
    border-color: transparent
}

.ud__button--icon-default-loading .ud__button__loading-icon {
    color: #3370ff
}

.ud__button--icon-default-selected:hover {
    background-color: rgba(31, 35, 41, .2)
}

.ud__button--icon-primary {
    color: #3370ff;
    background: 0 0;
    border-color: transparent
}

.ud__button--icon-primary-selected,
.ud__button--icon-primary:hover {
    color: #3370ff;
    background: rgba(51, 112, 255, .1);
    border-color: transparent
}

.ud__button--icon-primary:focus-visible {
    color: #3370ff;
    --hack-merge-rules: true;
    background: rgba(51, 112, 255, .1);
    border-color: transparent
}

.ud__button--icon-primary:active {
    color: #3370ff;
    background: rgba(51, 112, 255, .2);
    border-color: transparent
}

.ud__button--icon-primary-loading,
.ud__button--icon-primary-loading:hover,
.ud__button--icon-primary-loading:active {
    color: #82a7fc;
    cursor: default;
    background: 0 0;
    border-color: transparent
}

.ud__button--icon-primary-loading:focus-visible {
    color: #82a7fc;
    cursor: default;
    --hack-merge-rules: true;
    background: 0 0;
    border-color: transparent
}

.ud__button--icon-primary-loading .ud__button__loading-icon {
    color: #3370ff
}

.ud__button--icon-primary-selected:hover {
    background-color: rgba(51, 112, 255, .2)
}

.ud__button--icon-danger {
    color: #f54a45;
    background: 0 0;
    border-color: transparent
}

.ud__button--icon-danger-selected,
.ud__button--icon-danger:hover {
    color: #f54a45;
    background: rgba(245, 74, 69, .1);
    border-color: transparent
}

.ud__button--icon-danger:focus-visible {
    color: #f54a45;
    --hack-merge-rules: true;
    background: rgba(245, 74, 69, .1);
    border-color: transparent
}

.ud__button--icon-danger:active {
    color: #f54a45;
    background: rgba(245, 74, 69, .2);
    border-color: transparent
}

.ud__button--icon-danger-loading,
.ud__button--icon-danger-loading:hover,
.ud__button--icon-danger-loading:active {
    color: #f98e8b;
    cursor: default;
    background: 0 0;
    border-color: transparent
}

.ud__button--icon-danger-loading:focus-visible {
    color: #f98e8b;
    cursor: default;
    --hack-merge-rules: true;
    background: 0 0;
    border-color: transparent
}

.ud__button--icon-danger-loading .ud__button__loading-icon {
    color: #f54a45
}

.ud__button--icon-danger-selected:hover {
    background-color: rgba(245, 74, 69, .2)
}

.ud__button--icon[disabled],
.ud__button--icon:disabled,
.ud__button--icon[disabled]:hover,
.ud__button--icon:disabled:hover,
.ud__button--icon[disabled]:active,
.ud__button--icon:disabled:active {
    color: #bbbfc4;
    cursor: not-allowed;
    background: 0 0;
    border-color: transparent
}

.ud__button--icon[disabled]:focus-visible {
    color: #bbbfc4;
    cursor: not-allowed;
    --hack-merge-rules: true;
    background: 0 0;
    border-color: transparent
}

.ud__button--icon:disabled:focus-visible {
    color: #bbbfc4;
    cursor: not-allowed;
    --hack-merge-rules: true;
    background: 0 0;
    border-color: transparent
}

.ud__button--icon-size-xs {
    border-radius: 4px;
    font-size: 12px
}

.ud__button--icon-size-sm {
    border-radius: 4px;
    font-size: 16px
}

.ud__button--icon-size-md {
    border-radius: 4px;
    font-size: 20px
}

.ud__button--icon-size-lg {
    border-radius: 4px;
    font-size: 24px
}

.ud__button--icon-size-xl {
    border-radius: 4px;
    font-size: 28px
}

.ud__button__loading-icon {
    box-sizing: border-box;
    line-height: 1
}

.ud__button__loading-icon svg {
    vertical-align: -.15em;
    display: inline-block
}

.ud__button__icon-inline {
    box-sizing: border-box;
    line-height: 0;
    display: inline-block
}

.ud__button__icon-inline-start {
    margin-right: 4px
}

.ud__button__icon-inline-end {
    margin-left: 4px
}

.ud__button--size-sm .ud__button__icon-inline,
.ud__button--size-xs .ud__button__icon-inline {
    margin-right: 2px
}

.ud__button--autowidth {
    min-width: initial
}

.ud__button--block {
    width: 100%
}

.ud__button--loading {
    position: relative
}

.ud__button--loading:not([disabled]) {
    pointer-events: none
}


.reset_focus_outline:focus {
    --hack-merge-rules: true;
    outline: none
}

.reset_focus_outline:focus-visible {
    outline: none
}

.ud__notice.ud__notice-success .ud__notice__statusIcon {
    color: #34c724
}

.ud__notice.ud__notice-info .ud__notice__statusIcon {
    color: #3370ff
}

.ud__notice.ud__notice-warning .ud__notice__statusIcon {
    color: #f80
}

.ud__notice.ud__notice-error .ud__notice__statusIcon {
    color: #f54a45
}

.ud__notice.ud__notice--outlined {
    border: 1px solid transparent;
    padding: 15px 3px 15px 19px;
    font-weight: 500
}

.ud__notice.ud__notice--outlined.ud__os-mac,
.ud__os-mac .ud__notice.ud__notice--outlined {
    font-weight: 500
}

.ud__notice.ud__notice--outlined.ud__os-win,
.ud__os-win .ud__notice.ud__notice--outlined {
    font-weight: 600
}

.ud__notice.ud__notice--outlined.ud__notice-info {
    background-color: #f0f4ff;
    border-color: #3370ff
}

.ud__notice.ud__notice--outlined.ud__notice-info .ud__notice--ellipsis .ud__notice__description-content:after {
    background-color: #f0f4ff
}

.ud__notice.ud__notice--outlined.ud__notice-success {
    background-color: #f0fbef;
    border-color: #34c724
}

.ud__notice.ud__notice--outlined.ud__notice-success .ud__notice--ellipsis .ud__notice__description-content:after {
    background-color: #f0fbef
}

.ud__notice.ud__notice--outlined.ud__notice-warning {
    background-color: #fff5eb;
    border-color: #f80
}

.ud__notice.ud__notice--outlined.ud__notice-warning .ud__notice--ellipsis .ud__notice__description-content:after {
    background-color: #fff5eb
}

.ud__notice.ud__notice--outlined.ud__notice-error {
    background-color: #fef1f1;
    border-color: #f54a45
}

.ud__notice.ud__notice--outlined.ud__notice-error .ud__notice--ellipsis .ud__notice__description-content:after {
    background-color: #fef1f1
}

.ud__notice.ud__notice--plain {
    background-color: #fff;
    border: 1px solid transparent;
    padding: 15px 3px 15px 19px;
    font-weight: 500;
    box-shadow: 0 4px 8px rgba(31, 35, 41, .1)
}

.ud__notice.ud__notice--plain.ud__os-mac,
.ud__os-mac .ud__notice.ud__notice--plain {
    font-weight: 500
}

.ud__notice.ud__notice--plain.ud__os-win,
.ud__os-win .ud__notice.ud__notice--plain {
    font-weight: 600
}

.ud__notice.ud__notice--plain.ud__notice-info .ud__notice--ellipsis .ud__notice__description-content:after,
.ud__notice.ud__notice--plain.ud__notice-success .ud__notice--ellipsis .ud__notice__description-content:after,
.ud__notice.ud__notice--plain.ud__notice-warning .ud__notice--ellipsis .ud__notice__description-content:after,
.ud__notice.ud__notice--plain.ud__notice-error .ud__notice--ellipsis .ud__notice__description-content:after {
    background-color: #fff
}

.ud__notice.ud__notice--filled {
    padding: 9px 0 9px 16px
}

.ud__notice.ud__notice--filled.ud__notice-success {
    background-color: #d9f5d6
}

.ud__notice.ud__notice--filled.ud__notice-success .ud__notice--ellipsis .ud__notice__description-content:after,
.ud__notice.ud__notice--filled.ud__notice-info,
.ud__notice.ud__notice--filled.ud__notice-info .ud__notice--ellipsis .ud__notice__description-content:after {
    background-color: #e1eaff
}

.ud__notice.ud__notice--filled.ud__notice-warning,
.ud__notice.ud__notice--filled.ud__notice-warning .ud__notice--ellipsis .ud__notice__description-content:after {
    background-color: #feead2
}

.ud__notice.ud__notice--filled.ud__notice-error,
.ud__notice.ud__notice--filled.ud__notice-error .ud__notice--ellipsis .ud__notice__description-content:after {
    background-color: #fde2e2
}

.ud__notice {
    overflow: hidden
}

.ud__notice .ud__notice__main {
    margin-right: -16px
}

.ud__notice {
    box-sizing: border-box;
    color: #1f2329;
    font-variant: tabular-nums;
    text-align: left;
    pointer-events: auto;
    border-radius: 4px;
    align-items: center;
    margin: 0;
    padding: 0;
    font-size: 14px;
    line-height: 1.5715;
    list-style: none;
    display: flex
}

.ud__notice .ud__notice--multiline .ud__notice__description-action {
    width: 100%
}

.ud__notice .ud__notice--ellipsis .ud__notice__description-content {
    height: 100%;
    position: relative;
    overflow: hidden
}

.ud__notice .ud__notice--ellipsis .ud__notice__description-content:after {
    content: "...";
    background-color: #fff;
    padding: 0 5px;
    position: absolute;
    bottom: 0;
    right: 0
}

.ud__notice .ud__notice__statusIcon {
    box-sizing: border-box;
    flex-shrink: 0;
    align-self: baseline;
    margin-top: 3px;
    margin-right: 8px;
    font-size: 16px;
    line-height: 0;
    display: inline-block
}

.ud__notice .ud__notice__main {
    box-sizing: border-box;
    flex-flow: column;
    flex-grow: 1;
    display: flex
}

.ud__notice .ud__notice__main.ud__notice__main--no-title {
    flex-flow: row;
    align-items: flex-start
}

.ud__notice .ud__notice__main.ud__notice__main--no-title .ud__button--content {
    margin-top: 0
}

.ud__notice .ud__notice__title {
    box-sizing: border-box;
    text-align: left;
    white-space: normal;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 4px;
    padding-right: 32px;
    font-weight: 500;
    display: flex
}

.ud__notice .ud__notice__title.ud__os-mac,
.ud__os-mac .ud__notice .ud__notice__title {
    font-weight: 500
}

.ud__notice .ud__notice__title.ud__os-win,
.ud__os-win .ud__notice .ud__notice__title {
    font-weight: 600
}

.ud__notice.ud__notice-banner {
    border: 0;
    border-radius: 0;
    margin-bottom: 0
}

.ud__notice.ud__notice-align-center {
    justify-content: center;
    padding-left: 32px;
    padding-right: 32px;
    position: relative
}

.ud__notice.ud__notice-align-center .ud__notice__main {
    flex-grow: 0
}

.ud__notice.ud__notice-align-center .ud__notice__description-content {
    margin-right: 0
}

.ud__notice.ud__notice-align-center .ud__notice__close {
    position: absolute;
    right: 16px
}

.ud__notice .ud__notice__close {
    color: #646a73;
    flex: none;
    margin: 0 32px 0 -20px
}

.ud__notice .ud__notice__close.ud__button--icon {
    margin: -1px 28px -1px -20px
}

.ud__notice .ud__notice__description {
    box-sizing: border-box;
    flex-wrap: wrap;
    flex-grow: 1;
    justify-content: space-between;
    align-items: center;
    display: flex
}

.ud__notice .ud__notice__description .ud__notice__description-content {
    box-sizing: border-box;
    word-break: break-word;
    -webkit-box-orient: vertical;
    flex-grow: 1;
    padding-right: 32px;
    display: -webkit-box;
    overflow: hidden
}

.ud__notice .ud__notice__description .ud__notice__description-action {
    padding-right: 32px
}

.ud__notice.ud__notice-has-title .ud__notice__close,
.ud__notice.ud__notice-align-center .ud__notice__close {
    margin: 0 0 0 16px
}

.ud__notice.ud__notice-has-title .ud__notice__close.ud__button--icon,
.ud__notice.ud__notice-align-center .ud__notice__close.ud__button--icon {
    margin: -1px -4px -1px 12px
}

.ud__notice.ud__notice-align-center .ud__notice__description-content,
.ud__notice.ud__notice-align-center .ud__notice__description-action {
    padding-right: 16px
}

.ud__notice .ud__notice-align-center.ud__notice-has-action .ud__notice__description-content,
.ud__notice .ud__notice-align-center.ud__notice-closable .ud__notice__description-action {
    padding-right: 32px
}


.reset_focus_outline:focus {
    --hack-merge-rules: true;
    outline: none
}

.reset_focus_outline:focus-visible {
    outline: none
}

.ud__msg-manager {
    box-sizing: border-box;
    color: #1f2329;
    font-variant: tabular-nums;
    z-index: 1010;
    pointer-events: none;
    margin: 0;
    padding: 0;
    font-size: 14px;
    line-height: 1.5715;
    list-style: none;
    position: fixed
}

.ud__msg-manager.ud__msg-manager--sticky {
    position: absolute
}

.ud__msg-manager .ud__msg-manager-item {
    pointer-events: none
}

.ud__msg-manager.ud__msg-manager--topLeft {
    top: 16px;
    bottom: auto;
    left: 16px
}

.ud__msg-manager.ud__msg-manager--topRight {
    top: 16px;
    bottom: auto;
    right: 16px
}

.ud__msg-manager.ud__msg-manager--bottomLeft {
    top: auto;
    bottom: 16px;
    left: 16px
}

.ud__msg-manager.ud__msg-manager--bottomRight {
    top: auto;
    bottom: 16px;
    right: 16px
}

.ud__msg-manager.ud__msg-manager--top {
    text-align: center;
    width: 100%;
    padding: 0 16px 16px
}

.ud__msg-manager-item {
    box-sizing: border-box;
    transition: height .4s cubic-bezier(.645, .045, .355, 1), margin-bottom .4s cubic-bezier(.645, .045, .355, 1)
}

.ud__msg-manager-item.notification-animation-enter .ud__notification {
    opacity: 0
}

.ud__msg-manager-item.notification-animation-enter-done .ud__notification,
.ud__msg-manager-item.notification-animation-enter-active .ud__notification,
.ud__msg-manager-item.notification-animation-exit .ud__notification {
    opacity: 1
}

.ud__msg-manager-item.notification-animation-exit-active {
    margin-bottom: 0
}

.ud__msg-manager-item.notification-animation-exit-active .ud__notification {
    opacity: 0
}

.ud__msg-manager--topLeft .ud__notification__notice-content,
.ud__msg-manager--bottomLeft .ud__notification__notice-content {
    float: left
}

.ud__msg-manager--topLeft .notification-animation-enter .ud__notification,
.ud__msg-manager--bottomLeft .notification-animation-enter .ud__notification {
    transform: translate(-100%)translateY(0)
}

.ud__msg-manager--topLeft .notification-animation-enter-done .ud__notification,
.ud__msg-manager--bottomLeft .notification-animation-enter-done .ud__notification,
.ud__msg-manager--topLeft .notification-animation-enter-active .ud__notification,
.ud__msg-manager--bottomLeft .notification-animation-enter-active .ud__notification {
    transform: translate(0)translateY(0)
}

.ud__msg-manager--topRight .ud__notification__notice-content,
.ud__msg-manager--bottomRight .ud__notification__notice-content {
    float: right
}

.ud__msg-manager--topRight .notification-animation-enter .ud__notification,
.ud__msg-manager--bottomRight .notification-animation-enter .ud__notification {
    transform: translate(100%)translateY(0)
}

.ud__msg-manager--topRight .notification-animation-enter-done .ud__notification,
.ud__msg-manager--bottomRight .notification-animation-enter-done .ud__notification,
.ud__msg-manager--topRight .notification-animation-enter-active .ud__notification,
.ud__msg-manager--bottomRight .notification-animation-enter-active .ud__notification {
    transform: translate(0)translateY(0)
}

.ud__notification:before,
.ud__notification:after {
    box-sizing: border-box;
    content: " ";
    display: table
}

.ud__notification:after {
    clear: both
}

.ud__notification .ud__notification__notice {
    clear: both;
    padding: 8px
}

.ud__notification .ud__notification__notice-success .ud__notification__notice-border {
    background-color: #62d256;
    width: 4px;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0
}

.ud__notification .ud__notification__notice-info .ud__notification__notice-border {
    background-color: #4e83fd;
    width: 4px;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0
}

.ud__notification .ud__notification__notice-error .ud__notification__notice-border {
    background-color: #f76964;
    width: 4px;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0
}

.ud__notification .ud__notification__notice-warning .ud__notification__notice-border {
    background-color: #ffa53d;
    width: 4px;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0
}

.ud__notification .ud__notification__notice-close {
    box-sizing: border-box;
    color: #646a73;
    cursor: pointer;
    outline: none;
    position: absolute;
    top: 24px;
    right: 24px
}

.ud__notification .ud__notification__notice-title {
    box-sizing: border-box;
    margin-bottom: 8px;
    padding-right: 16px;
    font-size: 16px;
    font-weight: 500;
    line-height: 24px
}

.ud__notification .ud__notification__notice-title.ud__os-mac,
.ud__os-mac .ud__notification .ud__notification__notice-title {
    font-weight: 500
}

.ud__notification .ud__notification__notice-title.ud__os-win,
.ud__os-win .ud__notification .ud__notification__notice-title {
    font-weight: 600
}

.ud__notification .ud__notification__notice-des {
    box-sizing: border-box;
    font-size: 14px;
    font-weight: 400;
    line-height: 22px
}

.ud__notification .ud__notification__notice-des.ud__os-mac,
.ud__os-mac .ud__notification .ud__notification__notice-des {
    font-weight: 400
}

.ud__notification .ud__notification__notice-des.ud__os-win,
.ud__os-win .ud__notification .ud__notification__notice-des {
    font-weight: 500
}

.ud__notification .ud__notification__notice-btn {
    box-sizing: border-box;
    text-align: right;
    margin-top: 8px;
    padding-left: 4px
}

.ud__notification .ud__notification__notice-btn .ud__button {
    margin-left: 12px
}

.ud__notification .ud__notification__notice-with-icon {
    box-sizing: border-box;
    padding-left: 44px;
    padding-right: 16px
}

.ud__notification .ud__notification__notice-hide-icon {
    box-sizing: border-box;
    padding-left: 4px
}

.ud__notification .ud__notification__notice-icon-default,
.ud__notification .ud__notification__notice-icon-error,
.ud__notification .ud__notification__notice-icon-warning,
.ud__notification .ud__notification__notice-icon-success,
.ud__notification .ud__notification__notice-icon-info {
    text-align: center;
    width: 24px;
    font-size: 24px;
    line-height: 24px;
    position: absolute;
    top: 24px;
    left: 28px
}

.ud__notification .ud__notification__notice-icon-error {
    color: #f54a45
}

.ud__notification .ud__notification__notice-icon-warning {
    color: #f80
}

.ud__notification .ud__notification__notice-icon-success {
    color: #34c724
}

.ud__notification .ud__notification__notice-icon-info {
    color: #3370ff
}

.ud__notification .ud__notification__notice-content {
    color: #1f2329;
    box-sizing: border-box;
    background: #fff;
    border-radius: 8px;
    width: 420px;
    padding: 24px;
    display: inline-block;
    position: relative;
    overflow: hidden;
    box-shadow: 0 6px 24px rgba(31, 35, 41, .08)
}

.ud__notification .ud__notification__notice-operation {
    text-align: right;
    margin-top: 8px
}


.reset_focus_outline:focus {
    --hack-merge-rules: true;
    outline: none
}

.reset_focus_outline:focus-visible {
    outline: none
}

.ud__toast.ud__notice {
    opacity: 0;
    max-width: 600px;
    margin-bottom: 16px;
    transition: opacity .3s cubic-bezier(.34, .69, .1, 1), transform .3s cubic-bezier(.34, .69, .1, 1);
    display: inline-flex;
    transform: translateY(-100%);
    box-shadow: 0 4px 8px rgba(31, 35, 41, .1)
}

.toast--animation-enter .ud__toast {
    opacity: 0;
    transform: translateY(-100%)
}

.toast--animation-enter-active .ud__toast,
.toast--animation-enter-done .ud__toast {
    opacity: 1;
    transform: translateY(0)
}

.toast--animation-exit .ud__toast {
    opacity: 1;
    transform: translateY(0%)
}

.toast--animation-exit-active {
    margin-bottom: 0
}

.toast--animation-exit-active .ud__toast {
    opacity: 0;
    transform: translateY(0%)
}


.reset_focus_outline:focus {
    --hack-merge-rules: true;
    outline: none
}

.reset_focus_outline:focus-visible {
    outline: none
}

.ud__layout {
    box-sizing: border-box;
    background: #f2f3f5;
    flex-direction: column;
    flex: auto;
    min-height: 0;
    display: flex
}

.ud__layout--has-sider {
    flex-direction: row
}

.ud__layout--has-sider>.ud__layout,
.ud__layout--has-sider>.ud__layout-content {
    overflow-x: hidden
}

.ud__layout__header,
.ud__layout__footer {
    flex: none
}

.ud__layout__header {
    box-sizing: border-box;
    color: #1f2329;
    background: #fff;
    height: 64px;
    padding: 0 50px;
    line-height: 64px
}

.ud__layout__footer {
    box-sizing: border-box;
    color: #1f2329;
    background: #f2f3f5;
    padding: 24px 50px;
    font-size: 14px
}

.ud__layout__content {
    box-sizing: border-box;
    flex: auto;
    min-height: 0
}

.ud__layout__sider {
    box-sizing: border-box;
    background: #fff;
    min-width: 0;
    transition: all .2s;
    position: relative
}

.ud__layout__sider__children {
    box-sizing: border-box;
    height: 100%;
    margin-top: -.1px;
    padding-top: .1px
}

.ud__layout__sider-has-trigger {
    padding-bottom: 48px
}

.ud__layout__sider-right {
    order: 1
}

.ud__layout__sider-trigger {
    box-sizing: border-box;
    z-index: 1;
    color: #1f2329;
    text-align: center;
    cursor: pointer;
    background: #fff;
    border-top: 1px solid #bbbfc4;
    height: 48px;
    line-height: 48px;
    transition: all .2s;
    position: fixed;
    bottom: 0
}

.ud__layout__sider--zero-width>* {
    overflow: hidden
}

.ud__layout__sider--zero-width-trigger {
    z-index: 1;
    color: #1f2329;
    text-align: center;
    cursor: pointer;
    background: #fff;
    border-radius: 0 4px 4px 0;
    width: 36px;
    height: 42px;
    font-size: 18px;
    line-height: 42px;
    transition: background .3s;
    position: absolute;
    top: 64px;
    right: -36px
}

.ud__layout__sider--zero-width-trigger:hover {
    background: #fff
}

.ud__layout__sider--zero-width-trigger-right {
    border-radius: 4px 0 0 4px;
    left: -36px
}


.reset_focus_outline:focus {
    --hack-merge-rules: true;
    outline: none
}

.reset_focus_outline:focus-visible {
    outline: none
}

.ud__menu {
    box-sizing: border-box;
    font-variant: tabular-nums;
    color: #1f2329;
    text-align: left;
    background: #fff;
    outline: none;
    margin: 0;
    padding: 0;
    font-size: 14px;
    line-height: 1.5715;
    list-style: none;
    transition: width .3s cubic-bezier(.34, .69, .1, 1)
}

.ud__menu a:focus-visible {
    --hack-merge-rules: true;
    outline: none
}

.ud__menu-item:focus-visible {
    --hack-merge-rules: true;
    outline: none
}

.ud__menu-submenu-title:focus-visible {
    --hack-merge-rules: true;
    outline: none
}

.ud__menu a:focus,
.ud__menu-item:focus,
.ud__menu-submenu-title:focus {
    outline: none
}

.ud__menu-submenu-popup {
    pointer-events: auto !important
}

.ud__menu:before,
.ud__menu:after {
    content: "";
    display: table
}

.ud__menu ul,
.ud__menu ol {
    margin: 0;
    padding: 0;
    list-style: none
}

.ud__menu ul li {
    box-sizing: border-box
}

.ud__menu-icon-wrap {
    box-sizing: border-box;
    color: #2b2f36;
    display: flex
}

.ud__menu-icon-wrap-disabled {
    color: #bbbfc4
}

.ud__menu-item-group-title {
    box-sizing: border-box;
    color: #8f959e;
    padding: 8px 20px;
    font-size: 14px;
    line-height: 1.5715
}

.ud__menu-submenu {
    box-sizing: border-box
}

.ud__menu-submenu.ud-slide-up-enter.ud-slide-up-enter-active.ud__menu-submenu-placement-bottomLeft,
.ud__menu-submenu.ud-slide-up-appear.ud-slide-up-appear-active.ud__menu-submenu-placement-bottomLeft {
    animation-name: udSlideUpIn
}

.ud__menu-submenu.ud-slide-up-enter.ud-slide-up-enter-active.ud__menu-submenu-placement-topLeft,
.ud__menu-submenu.ud-slide-up-appear.ud-slide-up-appear-active.ud__menu-submenu-placement-topLeft {
    animation-name: udSlideDownIn
}

.ud__menu-submenu.ud-slide-up-leave.ud-slide-up-leave-active.ud__menu-submenu-placement-bottomLeft {
    animation-name: udSlideUpOut
}

.ud__menu-submenu.ud-slide-up-leave.ud-slide-up-leave-active.ud__menu-submenu-placement-topLeft {
    animation-name: udSlideDownOut
}

.ud__menu-submenu-selected,
.ud__menu-submenu-selected .ud__menu-icon-wrap {
    color: #3370ff
}

.ud__menu-submenu-selected>.ud__menu-submenu-title {
    font-weight: 500
}

.ud__menu-item:active,
.ud__menu-submenu-title:active {
    background: rgba(51, 112, 255, .12)
}

.ud__menu-submenu .ud__menu-sub {
    cursor: initial;
    border: 1px solid #dee0e3;
    box-shadow: 0 4px 8px rgba(31, 35, 41, .1)
}

.ud__menu-item a {
    color: #1f2329
}

.ud__menu-item a:hover {
    color: #3370ff
}

.ud__menu-item a:before {
    content: "";
    background-color: transparent;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0
}

.ud__menu-item-divider {
    background-color: rgba(31, 35, 41, .15);
    height: 1px;
    line-height: 0;
    overflow: hidden
}

.ud__menu-item-active,
.ud__menu-submenu-title:hover {
    background: rgba(31, 35, 41, .08)
}

.ud__menu-item-selected {
    color: #3370ff;
    font-weight: 500
}

.ud__menu-item-selected .ud__menu-icon-wrap,
.ud__menu-item-selected a,
.ud__menu-item-selected a:hover {
    color: #3370ff
}

.ud__menu:not(.ud__menu-horizontal) .ud__menu-item-selected {
    background-color: rgba(51, 112, 255, .12)
}

.ud__menu-vertical-right {
    border-left: 1px solid #dee0e3
}

.ud__menu-vertical.ud__menu-sub,
.ud__menu-vertical-left.ud__menu-sub,
.ud__menu-vertical-right.ud__menu-sub {
    transform-origin: 0 0;
    min-width: 160px;
    max-height: calc(100vh - 100px);
    padding: 8px 0;
    overflow: hidden
}

.ud__menu-vertical.ud__menu-sub:not(.ud-zoom-big-enter-active):not(.ud-zoom-big-leave-active),
.ud__menu-vertical-left.ud__menu-sub:not(.ud-zoom-big-enter-active):not(.ud-zoom-big-leave-active),
.ud__menu-vertical-right.ud__menu-sub:not(.ud-zoom-big-enter-active):not(.ud-zoom-big-leave-active) {
    overflow-x: hidden;
    overflow-y: auto
}

.ud__menu-vertical.ud__menu-sub .ud__menu-item,
.ud__menu-vertical-left.ud__menu-sub .ud__menu-item,
.ud__menu-vertical-right.ud__menu-sub .ud__menu-item {
    border-right: 0;
    margin-left: 0;
    left: 0
}

.ud__menu-vertical.ud__menu-sub .ud__menu-item:after,
.ud__menu-vertical-left.ud__menu-sub .ud__menu-item:after,
.ud__menu-vertical-right.ud__menu-sub .ud__menu-item:after {
    border-right: 0
}

.ud__menu-vertical.ud__menu-sub>.ud__menu-item,
.ud__menu-vertical-left.ud__menu-sub>.ud__menu-item,
.ud__menu-vertical-right.ud__menu-sub>.ud__menu-item,
.ud__menu-vertical.ud__menu-sub>.ud__menu-submenu,
.ud__menu-vertical-left.ud__menu-sub>.ud__menu-submenu,
.ud__menu-vertical-right.ud__menu-sub>.ud__menu-submenu {
    transform-origin: 0 0
}

.ud__menu-item-title-content-text-overflow {
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden
}

.ud__menu-item,
.ud__menu-submenu-title {
    white-space: nowrap;
    cursor: pointer;
    box-sizing: border-box;
    align-items: center;
    margin: 0;
    transition: color .1s cubic-bezier(0, 0, 1, 1), border-color .1s cubic-bezier(0, 0, 1, 1), background .1s cubic-bezier(0, 0, 1, 1), padding .1s cubic-bezier(0, 0, 1, 1);
    display: flex;
    position: relative
}

.ud__menu-item .ud__menu-icon-wrap,
.ud__menu-submenu-title .ud__menu-icon-wrap {
    margin-right: 8px;
    font-size: 20px;
    transition: color .1s cubic-bezier(0, 0, 1, 1)
}

.ud__menu-item.ud__menu-item-only-child>svg,
.ud__menu-submenu-title.ud__menu-item-only-child>svg {
    margin-right: 0
}

.ud__menu>.ud__menu-item-divider {
    background-color: rgba(31, 35, 41, .15);
    height: 1px;
    margin: 1px 0;
    padding: 0;
    line-height: 0;
    overflow: hidden
}

.ud__menu-submenu-popup {
    z-index: 1050;
    border-radius: 4px;
    position: absolute
}

.ud__menu-submenu-popup:before {
    z-index: -1;
    opacity: .0001;
    content: " ";
    width: 100%;
    height: 100%;
    position: absolute;
    top: -7px;
    bottom: 0;
    left: 0;
    right: 0
}

.ud__menu-submenu-placement-rightTop:before {
    top: 0;
    left: -7px
}

.ud__menu-submenu>.ud__menu {
    background-color: #fff;
    border-radius: 4px
}

.ud__menu-submenu>.ud__menu-submenu-title:after {
    transition: transform .3s cubic-bezier(.645, .045, .355, 1)
}

.ud__menu-submenu-popup>.ud__menu {
    background-color: #fff
}

.ud__menu-submenu-expand-icon,
.ud__menu-submenu-arrow {
    box-sizing: border-box;
    color: #8f959e;
    font-size: 16px;
    line-height: 0;
    display: inline-block;
    position: absolute;
    top: 50%;
    right: 16px;
    transform: translateY(-50%)
}

.ud__menu-submenu:hover>.ud__menu-submenu-title>.ud__menu-submenu-expand-icon {
    color: #3370ff
}

.ud__menu-submenu-vertical>.ud__menu-submenu-title .ud__menu-submenu-arrow,
.ud__menu-submenu-vertical-left>.ud__menu-submenu-title .ud__menu-submenu-arrow,
.ud__menu-submenu-vertical-right>.ud__menu-submenu-title .ud__menu-submenu-arrow,
.ud__menu-submenu-inline>.ud__menu-submenu-title .ud__menu-submenu-arrow {
    font-size: 16px
}

.ud__menu-submenu-vertical>.ud__menu-submenu-title .ud__menu-submenu-arrow svg,
.ud__menu-submenu-vertical-left>.ud__menu-submenu-title .ud__menu-submenu-arrow svg,
.ud__menu-submenu-vertical-right>.ud__menu-submenu-title .ud__menu-submenu-arrow svg,
.ud__menu-submenu-inline>.ud__menu-submenu-title .ud__menu-submenu-arrow svg {
    vertical-align: middle;
    font-size: 16px
}

.ud__menu-vertical .ud__menu-submenu-selected,
.ud__menu-vertical-left .ud__menu-submenu-selected,
.ud__menu-vertical-right .ud__menu-submenu-selected {
    color: #3370ff
}

.ud__menu-vertical .ud__menu-item,
.ud__menu-vertical-left .ud__menu-item,
.ud__menu-vertical-right .ud__menu-item,
.ud__menu-inline .ud__menu-item {
    position: relative
}

.ud__menu-vertical .ud__menu-item:after,
.ud__menu-vertical-left .ud__menu-item:after,
.ud__menu-vertical-right .ud__menu-item:after,
.ud__menu-inline .ud__menu-item:after {
    opacity: 0;
    content: "";
    border-right: 4px solid #3370ff;
    transition: transform .15s cubic-bezier(.215, .61, .355, 1), opacity .15s cubic-bezier(.215, .61, .355, 1);
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    transform: scaleY(.0001)
}

.ud__menu-vertical .ud__menu-item,
.ud__menu-vertical-left .ud__menu-item,
.ud__menu-vertical-right .ud__menu-item,
.ud__menu-inline .ud__menu-item,
.ud__menu-vertical .ud__menu-submenu-title,
.ud__menu-vertical-left .ud__menu-submenu-title,
.ud__menu-vertical-right .ud__menu-submenu-title,
.ud__menu-inline .ud__menu-submenu-title {
    height: 48px;
    margin-top: 0;
    margin-bottom: 0;
    padding: 0 16px
}

.ud__menu-vertical .ud__menu-submenu,
.ud__menu-vertical-left .ud__menu-submenu,
.ud__menu-vertical-right .ud__menu-submenu,
.ud__menu-inline .ud__menu-submenu {
    padding-bottom: .02px
}

.ud__menu-vertical .ud__menu-item:not(:last-child),
.ud__menu-vertical-left .ud__menu-item:not(:last-child),
.ud__menu-vertical-right .ud__menu-item:not(:last-child),
.ud__menu-inline .ud__menu-item:not(:last-child) {
    margin-bottom: 0
}

.ud__menu-vertical>.ud__menu-item,
.ud__menu-vertical-left>.ud__menu-item,
.ud__menu-vertical-right>.ud__menu-item,
.ud__menu-inline>.ud__menu-item,
.ud__menu-vertical>.ud__menu-submenu>.ud__menu-submenu-title,
.ud__menu-vertical-left>.ud__menu-submenu>.ud__menu-submenu-title,
.ud__menu-vertical-right>.ud__menu-submenu>.ud__menu-submenu-title,
.ud__menu-inline>.ud__menu-submenu>.ud__menu-submenu-title {
    height: 48px
}

.ud__menu-vertical .ud__menu-submenu-title {
    padding-right: 44px
}

.ud__menu-vertical .ud__menu-submenu-title[aria-expanded=true] {
    background: rgba(31, 35, 41, .08)
}

.ud__menu-item-group-list {
    margin: 0;
    padding: 0
}

.ud__menu-item-group-list .ud__menu-item,
.ud__menu-item-group-list .ud__menu-submenu-title {
    padding: 0 16px 0 20px
}

.ud__menu-root.ud__menu-vertical,
.ud__menu-root.ud__menu-vertical-left,
.ud__menu-root.ud__menu-vertical-right,
.ud__menu-root.ud__menu-inline {
    box-shadow: none
}

.ud__menu-item-disabled,
.ud__menu-submenu-disabled {
    cursor: not-allowed;
    background: 0 0;
    color: #bbbfc4 !important;
    border-color: transparent !important
}

.ud__menu-item-disabled a,
.ud__menu-submenu-disabled a {
    pointer-events: none;
    color: #bbbfc4 !important
}

.ud__menu-item-disabled>.ud__menu-submenu-title,
.ud__menu-submenu-disabled>.ud__menu-submenu-title {
    cursor: not-allowed;
    color: #bbbfc4 !important
}

.ud__menu-item-disabled>.ud__menu-submenu-title>.ud__menu-submenu-arrow:before,
.ud__menu-submenu-disabled>.ud__menu-submenu-title>.ud__menu-submenu-arrow:before,
.ud__menu-item-disabled>.ud__menu-submenu-title>.ud__menu-submenu-arrow:after,
.ud__menu-submenu-disabled>.ud__menu-submenu-title>.ud__menu-submenu-arrow:after {
    background: #bbbfc4 !important
}

.ud__layout__header .ud__menu {
    line-height: inherit
}

.ud__menu-horizontal,
.ud__menu-normal-horizontal {
    flex-wrap: nowrap;
    display: flex
}

.ud__menu-submenu-hidden,
.ud__menu-normal-submenu-hidden {
    display: none
}

.ud__menu-overflow-item,
.ud__menu-normal-overflow-item {
    flex: none
}

.ud__menu-hidden,
.ud__menu-normal-hidden {
    display: none
}

.ud__menu-horizontal .ud__menu-item,
.ud__menu-horizontal .ud__menu-submenu {
    margin-top: -1px
}

.ud__menu-horizontal>.ud__menu-item:hover,
.ud__menu-horizontal>.ud__menu-item-active,
.ud__menu-horizontal>.ud__menu-submenu .ud__menu-submenu-title:hover {
    background-color: transparent
}

.ud__menu-horizontal.ud__menu-sub {
    min-width: 114px
}

.ud__menu-horizontal {
    white-space: nowrap;
    border: 0;
    line-height: 56px
}

.ud__menu-horizontal>.ud__menu-item,
.ud__menu-horizontal>.ud__menu-submenu {
    margin: 0;
    padding: 0 16px
}

.ud__menu-horizontal>.ud__menu-item-selected,
.ud__menu-horizontal>.ud__menu-submenu-selected {
    color: #3370ff;
    position: relative
}

.ud__menu-horizontal>.ud__menu-item-selected:after,
.ud__menu-horizontal>.ud__menu-submenu-selected:after {
    content: "";
    background-color: #3370ff;
    width: calc(100% - 32px);
    height: 3px;
    position: absolute;
    bottom: 0
}

.ud__menu-horizontal>.ud__menu-item:hover,
.ud__menu-horizontal>.ud__menu-submenu:hover,
.ud__menu-horizontal>.ud__menu-item-active,
.ud__menu-horizontal>.ud__menu-submenu-active,
.ud__menu-horizontal>.ud__menu-item-open,
.ud__menu-horizontal>.ud__menu-submenu-open,
.ud__menu-horizontal>.ud__menu-item:hover .ud__menu-icon-wrap,
.ud__menu-horizontal>.ud__menu-submenu:hover .ud__menu-icon-wrap,
.ud__menu-horizontal>.ud__menu-item-active .ud__menu-icon-wrap,
.ud__menu-horizontal>.ud__menu-submenu-active .ud__menu-icon-wrap,
.ud__menu-horizontal>.ud__menu-item-open .ud__menu-icon-wrap,
.ud__menu-horizontal>.ud__menu-submenu-open .ud__menu-icon-wrap {
    color: #3370ff
}

.ud__menu-horizontal>.ud__menu-item-disabled:hover .ud__menu-icon-wrap,
.ud__menu-horizontal>.ud__menu-submenu-disabled:hover .ud__menu-icon-wrap,
.ud__menu-horizontal>.ud__menu-item-disabled-active .ud__menu-icon-wrap,
.ud__menu-horizontal>.ud__menu-submenu-disabled-active .ud__menu-icon-wrap,
.ud__menu-horizontal>.ud__menu-item-disabled-open .ud__menu-icon-wrap,
.ud__menu-horizontal>.ud__menu-submenu-disabled-open .ud__menu-icon-wrap {
    color: #bbbfc4
}

.ud__menu-horizontal>.ud__menu-item,
.ud__menu-horizontal>.ud__menu-submenu {
    vertical-align: bottom;
    position: relative
}

.ud__menu-horizontal>.ud__menu-submenu>.ud__menu-submenu-title {
    padding: 0
}

.ud__menu-horizontal>.ud__menu-item a {
    color: #1f2329
}

.ud__menu-horizontal>.ud__menu-item a:hover {
    color: #3370ff
}

.ud__menu-horizontal>.ud__menu-item a:before {
    bottom: -2px
}

.ud__menu-horizontal>.ud__menu-item-selected a {
    color: #3370ff
}

.ud__menu-horizontal:after {
    clear: both;
    content: " ";
    height: 0;
    display: block
}

.ud__menu-normal {
    box-sizing: border-box;
    text-align: left;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #dee0e3;
    border-radius: 4px;
    outline: none;
    margin: 0;
    padding: 8px 0;
    font-size: 14px;
    font-weight: 400;
    line-height: 22px;
    list-style-type: none;
    position: relative;
    box-shadow: 0 4px 8px rgba(31, 35, 41, .1)
}

.ud__menu-normal.ud__os-mac,
.ud__os-mac .ud__menu-normal {
    font-weight: 400
}

.ud__menu-normal.ud__os-win,
.ud__os-win .ud__menu-normal {
    font-weight: 500
}

.ud__menu-normal a:focus-visible {
    --hack-merge-rules: true;
    outline: none
}

.ud__menu-normal-item:focus-visible {
    --hack-merge-rules: true;
    outline: none
}

.ud__menu-normal-submenu-title:focus-visible {
    --hack-merge-rules: true;
    outline: none
}

.ud__menu-normal a:focus,
.ud__menu-normal-item:focus,
.ud__menu-normal-submenu-title:focus {
    outline: none
}

.ud__menu-normal-item-group-title {
    box-sizing: border-box;
    color: #8f959e;
    padding: 5px 11px;
    font-weight: 500
}

.ud__menu-normal-icon-wrap {
    box-sizing: border-box;
    color: #2b2f36;
    margin-right: 8px;
    font-size: 16px;
    line-height: 0;
    display: inline-block
}

.ud__menu-normal-icon-wrap-disabled {
    color: #bbbfc4
}

.ud__menu-normal-submenu-popup {
    box-sizing: border-box;
    z-index: 1050;
    box-shadow: none;
    transform-origin: 0 0;
    background: 0 0;
    border-width: 0;
    position: absolute
}

.ud__menu-normal-submenu-popup ul,
.ud__menu-normal-submenu-popup li {
    list-style: none
}

.ud__menu-normal-submenu-popup-include-subMenu>.ud__menu-normal>.ud__menu-normal-item {
    padding-right: 35px
}

.ud__menu-normal-item-title-content-text-overflow {
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden
}

.ud__menu-normal-item,
.ud__menu-normal-submenu-title {
    box-sizing: border-box;
    clear: both;
    cursor: pointer;
    align-items: center;
    margin: 0;
    padding: 5px 11px;
    display: flex;
    position: relative
}

.ud__menu-normal-item[aria-expanded=true],
.ud__menu-normal-submenu-title[aria-expanded=true] {
    background: rgba(31, 35, 41, .08)
}

.ud__menu-normal-item a,
.ud__menu-normal-submenu-title a {
    color: #1f2329;
    margin: -5px -11px;
    padding: 5px 11px;
    text-decoration: none;
    display: block
}

.ud__menu-normal-item a:hover,
.ud__menu-normal-submenu-title a:hover {
    color: #1f2329
}

.ud__menu-normal-item:hover,
.ud__menu-normal-submenu-title:hover {
    background-color: rgba(31, 35, 41, .08)
}

.ud__menu-normal-item-divider,
.ud__menu-normal-submenu-title-divider {
    box-sizing: border-box;
    background-color: rgba(31, 35, 41, .15);
    height: 1px;
    margin: 4px 0;
    line-height: 0;
    overflow: hidden
}

.ud__menu-normal-item .ud__menu-normal-submenu-arrow,
.ud__menu-normal-submenu-title .ud__menu-normal-submenu-arrow {
    box-sizing: border-box;
    color: #8f959e;
    font-size: 16px;
    line-height: 0;
    display: inline-block;
    position: absolute;
    top: 50%;
    right: 12px;
    transform: translateY(-50%)
}

.ud__menu-normal-item,
.ud__menu-normal-submenu {
    box-sizing: border-box;
    color: #1f2329
}

.ud__menu-normal-item-selected,
.ud__menu-normal-submenu-selected,
.ud__menu-normal-item-selected>a,
.ud__menu-normal-submenu-selected>a {
    color: #3370ff
}

.ud__menu-normal-item-suffix-icon {
    box-sizing: border-box;
    color: #8f959e;
    font-size: 16px;
    line-height: 0;
    display: inline-block;
    position: absolute;
    top: 50%;
    right: 12px;
    transform: translateY(-50%)
}

.ud__menu-normal-submenu-selected .ud__menu-normal-icon-wrap,
.ud__menu-normal-item-selected>.ud__menu-normal-item-suffix-icon,
.ud__menu-normal-item-selected .ud__menu-normal-icon-wrap {
    color: #3370ff
}

.ud__menu-normal-item-group-list {
    margin: 0;
    padding: 0;
    list-style: none
}

.ud__menu-normal-item-selected,
.ud__menu-normal-submenu-title {
    padding-right: 35px
}

.ud__menu-normal-submenu-vertical {
    position: relative
}

.ud__menu-normal-submenu-vertical>.ud__menu-normal {
    transform-origin: 0 0;
    min-width: 100%;
    margin-left: 4px;
    position: absolute;
    top: 0;
    left: 100%
}

.ud__menu-normal-submenu.ud__menu-normal-submenu-disabled .ud__menu-normal-submenu-title,
.ud__menu-normal-submenu.ud__menu-normal-submenu-disabled .ud__menu-normal-submenu-title .ud__menu-normal-submenu-arrow-icon {
    box-sizing: border-box;
    color: #bbbfc4;
    cursor: not-allowed;
    background-color: #fff
}

.ud__menu-normal-submenu-disabled,
.ud__menu-normal-item-disabled {
    color: #bbbfc4;
    cursor: not-allowed
}

.ud__menu-normal-submenu-disabled:hover,
.ud__menu-normal-item-disabled:hover {
    color: #bbbfc4;
    cursor: not-allowed;
    background-color: #fff
}

.ud__menu-normal-submenu-selected .ud__menu-normal-submenu-title {
    background: rgba(31, 35, 41, .08)
}

.ud__menu-submenu-inline .ud__menu-submenu-arrow-icon {
    box-sizing: border-box;
    transition: transform .4s cubic-bezier(.34, .69, .1, 1);
    transform: rotate(90deg)
}

.ud__menu-submenu-inline.ud__menu-submenu-open>.ud__menu-submenu-title .ud__menu-submenu-arrow-icon {
    transform: rotate(270deg)
}

.ud__menu-inline-collapsed-noicon {
    text-align: center;
    width: 20px;
    font-size: 16px
}

.ud__menu-sub.ud__menu-inline {
    box-shadow: none;
    border: 0;
    border-radius: 0;
    padding: 0
}

.ud__menu-sub.ud__menu-inline>.ud__menu-item,
.ud__menu-sub.ud__menu-inline>.ud__menu-submenu>.ud__menu-submenu-title {
    height: 48px;
    line-height: 48px;
    list-style-type: disc;
    list-style-position: inside
}

.ud__menu-sub.ud__menu-inline .ud__menu-item-group-title {
    padding-left: 52px
}

.ud__menu-inline {
    width: 100%
}

.ud__menu-inline .ud__menu-selected:after,
.ud__menu-inline .ud__menu-item-selected:after {
    opacity: 1;
    transition: transform .15s cubic-bezier(.645, .045, .355, 1), opacity .15s cubic-bezier(.645, .045, .355, 1);
    transform: scaleY(1)
}

.ud__menu-inline .ud__menu-submenu-title {
    padding-right: 44px
}

.ud__menu-inline-collapsed {
    width: 64px
}

.ud__menu-inline-collapsed>.ud__menu-item,
.ud__menu-inline-collapsed>.ud__menu-item-group>.ud__menu-item-group-list>.ud__menu-item,
.ud__menu-inline-collapsed>.ud__menu-item-group>.ud__menu-item-group-list>.ud__menu-submenu>.ud__menu-submenu-title,
.ud__menu-inline-collapsed>.ud__menu-submenu>.ud__menu-submenu-title {
    text-overflow: clip;
    padding: 0 22px;
    left: 0
}

.ud__menu-inline-collapsed>.ud__menu-item .ud__menu-submenu-arrow,
.ud__menu-inline-collapsed>.ud__menu-item-group>.ud__menu-item-group-list>.ud__menu-item .ud__menu-submenu-arrow,
.ud__menu-inline-collapsed>.ud__menu-item-group>.ud__menu-item-group-list>.ud__menu-submenu>.ud__menu-submenu-title .ud__menu-submenu-arrow,
.ud__menu-inline-collapsed>.ud__menu-submenu>.ud__menu-submenu-title .ud__menu-submenu-arrow {
    display: none
}

.ud__menu-inline-collapsed>.ud__menu-item svg,
.ud__menu-inline-collapsed>.ud__menu-item-group>.ud__menu-item-group-list>.ud__menu-item svg,
.ud__menu-inline-collapsed>.ud__menu-item-group>.ud__menu-item-group-list>.ud__menu-submenu>.ud__menu-submenu-title svg,
.ud__menu-inline-collapsed>.ud__menu-submenu>.ud__menu-submenu-title svg {
    margin: 0;
    font-size: 20px;
    line-height: 48px
}

.ud__menu-inline-collapsed svg {
    display: inline-block
}

.ud__menu-inline-collapsed .ud__menu-item-group-title {
    white-space: nowrap;
    text-overflow: ellipsis;
    padding-left: 4px;
    padding-right: 4px;
    overflow: hidden
}

.ud__menu-inline-collapsed .ud__menu-item-selected:after {
    opacity: 1;
    transition: transform .15s cubic-bezier(.645, .045, .355, 1), opacity .15s cubic-bezier(.645, .045, .355, 1);
    transform: scaleY(1)
}


.reset_focus_outline:focus {
    --hack-merge-rules: true;
    outline: none
}

.reset_focus_outline:focus-visible {
    outline: none
}

.ud__tooltip {
    box-sizing: border-box;
    z-index: 1070;
    width: -moz-max-content;
    max-width: 320px;
    width: max-content;
    position: absolute;
    top: -9999px;
    left: -9999px;
    pointer-events: auto !important
}

.ud__tooltip-no-entry {
    pointer-events: none
}

.ud__tooltip-hidden {
    display: none
}

.ud__tooltip__arrow {
    box-sizing: border-box;
    position: absolute;
    overflow: hidden
}

.ud__tooltip__arrow__content {
    box-sizing: border-box;
    content: "";
    transform-origin: 50%;
    background: #fff;
    border: 1px solid #dee0e3;
    display: block;
    position: absolute;
    transform: rotate(45deg)
}

.ud__tooltip__arrow-top {
    top: 1px;
    left: 0;
    transform: translate(-50%, -100%)
}

.ud__tooltip__arrow-top>.ud__tooltip__arrow__content {
    top: 29.2893%;
    left: 14.6447%
}

.ud__tooltip__arrow-bottom {
    bottom: 1px;
    left: 0;
    transform: translate(-50%, 100%)
}

.ud__tooltip__arrow-bottom>.ud__tooltip__arrow__content {
    top: -70.7107%;
    left: 14.6447%
}

.ud__tooltip__arrow-left {
    top: 0;
    left: 1px;
    transform: translate(-100%, -50%)
}

.ud__tooltip__arrow-left>.ud__tooltip__arrow__content {
    top: 14.6447%;
    left: 29.2893%
}

.ud__tooltip__arrow-right {
    top: 0;
    right: 1px;
    transform: translate(100%, -50%)
}

.ud__tooltip__arrow-right>.ud__tooltip__arrow__content {
    top: 14.6447%;
    left: -70.7107%
}

.ud__tooltip-content {
    box-sizing: border-box;
    color: #fff;
    text-align: left;
    word-wrap: break-word;
    background-color: #1f2329;
    border-radius: 4px;
    min-width: 30px;
    padding: 8px 12px;
    font-size: 12px;
    line-height: 20px;
    text-decoration: none;
    position: relative;
    box-shadow: 0 4px 8px rgba(31, 35, 41, .1)
}

.ud__tooltip__arrow__content {
    box-sizing: border-box;
    background: #1f2329;
    border-color: #1f2329
}

.ud__tooltip__invalid-children-wrapper {
    box-sizing: border-box;
    display: inline-block
}

.ud-tooltip-zoom-enter,
.ud-tooltip-zoom-appear,
.ud-tooltip-zoom-leave {
    animation-duration: .2s;
    animation-play-state: paused;
    animation-fill-mode: both
}

.ud-tooltip-zoom-enter.ud-tooltip-zoom-enter-active,
.ud-tooltip-zoom-appear.ud-tooltip-zoom-appear-active {
    animation-name: udTooltipZoomIn;
    animation-play-state: running
}

.ud-tooltip-zoom-leave.ud-tooltip-zoom-leave-active {
    pointer-events: none;
    animation-name: udTooltipZoomOut;
    animation-play-state: running
}

.ud-tooltip-zoom-enter,
.ud-tooltip-zoom-appear {
    opacity: 0;
    animation-timing-function: cubic-bezier(.34, .69, .1, 1)
}

.ud-tooltip-zoom-leave {
    animation-timing-function: cubic-bezier(.34, .69, .1, 1)
}

.ud-tooltip-zoom[class*=-top] {
    transform-origin: bottom
}

.ud-tooltip-zoom[class*=-left] {
    transform-origin: 100%
}

.ud-tooltip-zoom[class*=-right] {
    transform-origin: 0
}

.ud-tooltip-zoom[class*=-bottom] {
    transform-origin: top
}

.ud-tooltip-zoom[class*=-topLeft],
.ud-tooltip-zoom[class*=-rightBottom] {
    transform-origin: 0 100%
}

.ud-tooltip-zoom[class*=-topRight],
.ud-tooltip-zoom[class*=-leftBottom] {
    transform-origin: 100% 100%
}

.ud-tooltip-zoom[class*=-leftTop],
.ud-tooltip-zoom[class*=-bottomRight] {
    transform-origin: 100% 0
}

.ud-tooltip-zoom[class*=-rightTop],
.ud-tooltip-zoom[class*=-bottomLeft] {
    transform-origin: 0 0
}

@keyframes udTooltipZoomIn {
    0% {
        opacity: 0;
        transform: scale(.7)
    }

    to {
        opacity: 1;
        transform: scale(1)
    }
}

@keyframes udTooltipZoomOut {
    0% {
        transform: scale(1)
    }

    to {
        opacity: 0;
        transform: scale(.7)
    }
}


.reset_focus_outline:focus {
    --hack-merge-rules: true;
    outline: none
}

.reset_focus_outline:focus-visible {
    outline: none
}

.ud__dropdown {
    box-sizing: border-box;
    z-index: 1050;
    width: -moz-max-content;
    max-width: 420px;
    width: max-content;
    position: absolute;
    top: -9999px;
    left: -9999px;
    pointer-events: auto !important
}

.ud__dropdown-no-entry {
    pointer-events: none
}

.ud__dropdown-hidden {
    display: none
}

.ud__dropdown__arrow {
    box-sizing: border-box;
    position: absolute;
    overflow: hidden
}

.ud__dropdown__arrow__content {
    box-sizing: border-box;
    content: "";
    transform-origin: 50%;
    background: #fff;
    border: 1px solid #dee0e3;
    display: block;
    position: absolute;
    transform: rotate(45deg)
}

.ud__dropdown__arrow-top {
    top: 1px;
    left: 0;
    transform: translate(-50%, -100%)
}

.ud__dropdown__arrow-top>.ud__dropdown__arrow__content {
    top: 29.2893%;
    left: 14.6447%
}

.ud__dropdown__arrow-bottom {
    bottom: 1px;
    left: 0;
    transform: translate(-50%, 100%)
}

.ud__dropdown__arrow-bottom>.ud__dropdown__arrow__content {
    top: -70.7107%;
    left: 14.6447%
}

.ud__dropdown__arrow-left {
    top: 0;
    left: 1px;
    transform: translate(-100%, -50%)
}

.ud__dropdown__arrow-left>.ud__dropdown__arrow__content {
    top: 14.6447%;
    left: 29.2893%
}

.ud__dropdown__arrow-right {
    top: 0;
    right: 1px;
    transform: translate(100%, -50%)
}

.ud__dropdown__arrow-right>.ud__dropdown__arrow__content {
    top: 14.6447%;
    left: -70.7107%
}

.ud__dropdown.ud-slide-up-enter.ud-slide-up-enter-active.ud__dropdown-placement-topLeft,
.ud__dropdown.ud-slide-up-appear.ud-slide-up-appear-active.ud__dropdown-placement-topLeft,
.ud__dropdown.ud-slide-up-enter.ud-slide-up-enter-active.ud__dropdown-placement-topCenter,
.ud__dropdown.ud-slide-up-appear.ud-slide-up-appear-active.ud__dropdown-placement-topCenter,
.ud__dropdown.ud-slide-up-enter.ud-slide-up-enter-active.ud__dropdown-placement-topRight,
.ud__dropdown.ud-slide-up-appear.ud-slide-up-appear-active.ud__dropdown-placement-topRight {
    animation-name: udSlideDownIn
}

.ud__dropdown.ud-slide-up-leave.ud-slide-up-leave-active.ud__dropdown-placement-topLeft,
.ud__dropdown.ud-slide-up-leave.ud-slide-up-leave-active.ud__dropdown-placement-topCenter,
.ud__dropdown.ud-slide-up-leave.ud-slide-up-leave-active.ud__dropdown-placement-topRight {
    animation-name: udSlideDownOut
}

.ud__dropdown-button {
    box-sizing: border-box;
    white-space: nowrap;
    display: inline-flex
}

.ud__dropdown-button .ud__button:first-child:not(:last-child) {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    margin-right: 0
}

.ud__dropdown-button .ud__button:last-child:not(:first-child) {
    border-left-width: 0;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0
}



.adit-color-picker {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-color: #fff;
    border: 1px solid #dee0e3;
    border-radius: 2px;
    padding: 16px;
    display: flex;
    box-shadow: 0 3px 12px 2px #dee0e3
}

.adit-color-picker>.adit-color-picker-col {
    flex-direction: column;
    margin-left: 6px;
    margin-right: 6px;
    display: flex
}

.adit-color-picker>.adit-color-picker-col:first-child {
    margin-left: 0
}

.adit-color-picker>.adit-color-picker-col:last-child {
    margin-right: 0
}

.adit-color-picker>.adit-color-picker-col>.color-swatch {
    box-sizing: border-box;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    border: 1px solid;
    border-radius: 2px;
    width: 18px;
    height: 18px;
    margin-top: 3px;
    margin-bottom: 3px
}

.adit-color-picker>.adit-color-picker-col>.color-swatch:first-child {
    margin-top: 0
}

.adit-color-picker>.adit-color-picker-col>.color-swatch:last-child {
    margin-bottom: 0
}

.adit-color-picker>.adit-color-picker-col>.color-swatch:nth-child(2) {
    margin-top: 13px
}

.adit-color-picker>.adit-color-picker-col>.color-swatch>svg {
    visibility: hidden;
    fill: #fff
}

.adit-color-picker>.adit-color-picker-col>.color-swatch[adit-swatch-selected]>svg {
    visibility: visible
}

.adit-color-picker-btn>button>svg {
    width: 26px;
    height: 26px
}

.adit-color-picker-btn>button>svg path {
    transform: scale(1.2)translate(-2px, -1.5px)
}

.adit-color-picker-btn>button>svg rect {
    transform: translateY(2.5px)
}

.adit-color-picker-btn:hover {
    background-color: #eff0f1
}

.adit-color-picker-btn svg {
    display: block
}

.editor-kit-wrapper-container.adit-wrapper-container .adit-dropdown {
    position: relative
}

.editor-kit-wrapper-container.adit-wrapper-container .adit-dropdown [adit-disabled] button:hover {
    background-color: transparent
}

.editor-kit-wrapper-container.adit-wrapper-container .adit-dropdown .adit-format-button {
    background-clip: padding-box;
    border-radius: 6px;
    height: 26px;
    padding: 4px 8px
}

.editor-kit-wrapper-container.adit-wrapper-container .adit-dropdown .adit-format-button>svg {
    fill-rule: evenodd;
    width: 12px !important
}

.editor-kit-wrapper-container.adit-wrapper-container .adit-dropdown-content {
    color: #2b2f36;
    box-sizing: border-box;
    background-color: #fff;
    border: 1px solid #dee0e3;
    border-radius: 6px;
    margin: 0;
    padding: 4px;
    font-family: Monospaced Number, Chinese Quote, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif;
    font-size: 14px;
    line-height: 1.5;
    list-style: none;
    display: block;
    box-shadow: 0 3px 12px 2px #dee0e3
}

.editor-kit-wrapper-container.adit-wrapper-container .adit-dropdown-content .adit-format-button {
    display: flex
}

.editor-kit-wrapper-container.adit-wrapper-container .adit-dropdown-content .menu-text {
    box-sizing: border-box;
    cursor: pointer;
    border-radius: 4px;
    min-width: 132px;
    padding: 8px 18px
}

.editor-kit-wrapper-container.adit-wrapper-container .adit-dropdown-content .menu-text:hover {
    background-color: #eff0f1
}

.editor-kit-wrapper-container.adit-wrapper-container .adit-dropdown-pivot {
    position: relative
}

.editor-kit-wrapper-container.adit-wrapper-container .adit-dropdown-pivot .adit-format-button>svg>path {
    font-weight: 700;
    transform: translate(2.5px, 6.5px) !important
}

.editor-kit-wrapper-container.adit-wrapper-container .adit-dropdown-pivot .adit-dropdown-locate {
    border-radius: 6px;
    position: absolute;
    left: 50%;
    transform: translate(-50%)
}

.editor-kit-wrapper-container.adit-wrapper-container .adit-dropdown-pivot .adit-dropdown-locate.top {
    bottom: 100%
}

.editor-kit-wrapper-container.adit-wrapper-container .adit-dropdown-pivot .adit-dropdown-locate.top>.adit-dropdown-box {
    margin-bottom: 6px
}

.editor-kit-wrapper-container.adit-wrapper-container .adit-dropdown-pivot .adit-dropdown-locate.top>.adit-dropdown-box:before {
    border-width: 6px 6px 0;
    border-top-color: #dee0e3;
    margin-left: -6px;
    bottom: -5px
}

.editor-kit-wrapper-container.adit-wrapper-container .adit-dropdown-pivot .adit-dropdown-locate.top>.adit-dropdown-box:after {
    border-width: 5px 5px 0;
    border-top-color: #fff;
    margin-left: -5px;
    bottom: -4px
}

.editor-kit-wrapper-container.adit-wrapper-container .adit-dropdown-pivot .adit-dropdown-locate.bottom {
    top: 100%
}

.editor-kit-wrapper-container.adit-wrapper-container .adit-dropdown-pivot .adit-dropdown-locate.bottom>.adit-dropdown-box {
    margin-top: 6px
}

.editor-kit-wrapper-container.adit-wrapper-container .adit-dropdown-pivot .adit-dropdown-locate.bottom>.adit-dropdown-box:before {
    border-width: 0 6px 6px;
    border-bottom-color: #dee0e3;
    margin-left: -6px;
    top: -5px
}

.editor-kit-wrapper-container.adit-wrapper-container .adit-dropdown-pivot .adit-dropdown-locate.bottom>.adit-dropdown-box:after {
    border-width: 0 5px 5px;
    border-bottom-color: #fff;
    margin-left: -5px;
    top: -4px
}

.editor-kit-wrapper-container.adit-wrapper-container .adit-dropdown-pivot .adit-dropdown-locate>.adit-dropdown-box {
    cursor: auto;
    position: relative
}

.editor-kit-wrapper-container.adit-wrapper-container .adit-dropdown-pivot .adit-dropdown-locate>.adit-dropdown-box:before,
.editor-kit-wrapper-container.adit-wrapper-container .adit-dropdown-pivot .adit-dropdown-locate>.adit-dropdown-box:after {
    content: "";
    border-style: solid;
    border-color: transparent;
    width: 0;
    height: 0;
    display: block;
    position: absolute;
    left: 50%
}

.editor-kit-wrapper-container.adit-wrapper-container .adit-format-icon {
    height: 12px
}

.editor-kit-wrapper-container.adit-wrapper-container .adit-format-icon>.icon-fontfamily {
    justify-content: center;
    align-items: center;
    display: flex
}

.editor-kit-wrapper-container.adit-wrapper-container .adit-format-icon>.icon-fontfamily>span {
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 67px;
    font-size: 14px;
    font-weight: 500;
    overflow: hidden
}

.editor-kit-wrapper-container.adit-wrapper-container .adit-format-align {
    min-width: 48px
}

.editor-kit-wrapper-container.adit-wrapper-container .adit-format-align .menu-icon {
    cursor: pointer;
    border-radius: 4px;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 32px;
    display: flex
}

.editor-kit-wrapper-container.adit-wrapper-container .adit-format-align .menu-icon svg>path {
    transform: scale(.8)translate(4px, 4px)
}

.editor-kit-wrapper-container.adit-wrapper-container .adit-format-align .menu-icon:hover {
    background-color: #eff0f1
}

.editor-kit-wrapper-container.adit-wrapper-container .adit-dropdown-fontfamily {
    min-width: 160px
}

.editor-kit-wrapper-container.adit-wrapper-container .adit-dropdown-fontsize {
    min-width: 120px
}

.editor-kit-wrapper-container.adit-wrapper-container .adit-format-button {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    cursor: pointer;
    white-space: pre;
    background-clip: content-box;
    border-radius: 6px;
    align-items: center;
    padding: 0;
    font-size: 14px;
    display: flex;
    position: relative
}

.editor-kit-wrapper-container.adit-wrapper-container .adit-format-button svg {
    fill-rule: evenodd
}

.editor-kit-wrapper-container.adit-wrapper-container .adit-format-button:hover:not([adit-disabled]) {
    background-color: #eff0f1
}

.editor-kit-wrapper-container.adit-wrapper-container .adit-format-button svg,
.editor-kit-wrapper-container.adit-wrapper-container .adit-format-button button {
    margin: 0;
    padding: 0
}

.editor-kit-wrapper-container.adit-wrapper-container .adit-format-button:not(.adit-color-picker-btn) svg {
    width: 26px;
    height: 26px
}

.editor-kit-wrapper-container.adit-wrapper-container .adit-format-button:not(.adit-color-picker-btn) svg path {
    transform: scale(.8)translate(4px, 4px)
}

.editor-kit-wrapper-container.adit-wrapper-container [adit-disabled] .adit-format-button:hover {
    background-color: transparent
}

.editor-kit-wrapper-container.adit-wrapper-container .adit-format-icon {
    align-items: center;
    display: flex
}

.editor-kit-wrapper-container.adit-wrapper-container [adit-selected]:not([adit-disable-selected]),
.editor-kit-wrapper-container.adit-wrapper-container [adit-enable-default] [adit-default]:not([adit-disable-selected]) {
    fill: #3370ff;
    color: #3370ff
}

.editor-kit-wrapper-container.adit-wrapper-container [adit-disabled] {
    pointer-events: none;
    cursor: auto;
    fill: #dee0e3 !important;
    color: #dee0e3 !important
}

.editor-kit-wrapper-container.adit-wrapper-container [adit-disabled] rect {
    fill: #dee0e3 !important
}

.editor-kit-wrapper-container.adit-wrapper-container [adit-disabled] span {
    color: #dee0e3
}

.editor-kit-wrapper-container.adit-wrapper-container [adit-disabled] button {
    pointer-events: none;
    cursor: auto
}

.editor-kit-wrapper-container.adit-wrapper-container .adit-toolbar-wrapper {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-color: #fff;
    border: 1px solid #dee0e3;
    align-items: center;
    padding: 7px 16.5px;
    font-size: 7px;
    display: flex
}

.editor-kit-wrapper-container.adit-wrapper-container .adit-toolbar-wrapper>div:not(:first-child) {
    margin-left: 4px
}

.editor-kit-wrapper-container.adit-wrapper-container .adit-toolbar-wrapper>div:not(:last-child) {
    margin-right: 4px
}

.editor-kit-wrapper-container.adit-wrapper-container .adit-toolbar-wrapper .adit-format-button {
    justify-content: center;
    align-items: center;
    display: flex
}

.adit-tooltip-container {
    visibility: hidden;
    width: 0;
    height: 0;
    position: absolute;
    overflow: hidden;
    transform: translate(-50%)
}

.adit-tooltip-container .adit-tooltip-transition {
    opacity: 0;
    transition: all .1s;
    transform: scale(.6)
}

.adit-tooltip-container .adit-tooltip-box {
    box-sizing: border-box;
    color: #fff;
    white-space: nowrap;
    background-color: #1f2329;
    border-color: #1f2329;
    border-radius: 8px;
    align-items: center;
    min-width: 20px;
    min-height: 32px;
    padding: 8px 12px;
    display: flex;
    position: relative
}

.adit-tooltip-container .adit-tooltip-box:before {
    content: "";
    border-style: solid;
    border-color: transparent;
    width: 0;
    height: 0;
    display: block;
    position: absolute;
    left: 50%
}

.adit-tooltip-container .adit-tooltip-box .adit-tooltip-content {
    white-space: pre;
    text-align: center;
    font-size: 12px
}

.adit-tooltip-pivot {
    position: relative
}

.adit-tooltip-pivot .adit-tooltip {
    pointer-events: none;
    z-index: 99999;
    height: 0;
    position: absolute;
    left: 50%;
    transform: translate(-50%)
}

.adit-tooltip-visible .adit-tooltip-container {
    visibility: visible;
    width: auto;
    height: auto;
    overflow: visible
}

.adit-tooltip-hover .adit-tooltip-transition {
    opacity: 1;
    transform: scale(1)
}

.adit-wrapper-container.top .adit-tooltip {
    bottom: 100%
}

.adit-wrapper-container.top .adit-tooltip-transition {
    transform-origin: bottom
}

.adit-wrapper-container.top .adit-tooltip-visible .adit-tooltip-container {
    margin-bottom: 12px;
    bottom: 0
}

.adit-wrapper-container.top .adit-tooltip-visible .adit-tooltip-container .adit-tooltip-box:before {
    border-width: 6px 6px 0;
    border-top-color: #1f2329;
    margin-left: -6px;
    bottom: -6px
}

.adit-wrapper-container.bottom .adit-tooltip {
    top: 100%
}

.adit-wrapper-container.bottom .adit-tooltip-transition {
    transform-origin: top
}

.adit-wrapper-container.bottom .adit-tooltip-visible .adit-tooltip-container {
    margin-top: 12px;
    top: 0
}

.adit-wrapper-container.bottom .adit-tooltip-visible .adit-tooltip-container .adit-tooltip-box:before {
    border-width: 0 6px 6px;
    border-bottom-color: #1f2329;
    margin-left: -6px;
    top: -6px
}

.editor-kit-wrapper-container.adit-wrapper-container {
    z-index: 9999;
    background-color: #fff;
    border: 1px solid #dee0e3;
    min-width: 320px;
    font-family: Segoe UI Emoji, Helvetica Neue, -apple-system, BlinkMacSystemFont, PingFang SC, Roboto, Microsoft YaHei, Source Han Sans SC, Noto Sans CJK SC, Myriad Pro, Hiragino Sans, Yu Gothic, Lucida Grande, sans-serif;
    position: relative
}

.editor-kit-wrapper-container.adit-wrapper-container * {
    box-sizing: border-box;
    -webkit-font-smoothing: antialiased
}

.editor-kit-wrapper-container.adit-wrapper-container button {
    cursor: pointer;
    background-color: transparent;
    border: none
}

.editor-kit-wrapper-container.adit-wrapper-container a,
.editor-kit-wrapper-container.adit-wrapper-container button,
.editor-kit-wrapper-container.adit-wrapper-container input,
.editor-kit-wrapper-container.adit-wrapper-container textarea {
    outline: 0
}

.editor-kit-wrapper-container.adit-wrapper-container:before,
.editor-kit-wrapper-container.adit-wrapper-container:after {
    content: "";
    clear: both;
    display: block
}

.editor-kit-wrapper-container.adit-wrapper-container>.adit-plate {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    z-index: 999;
    background-color: #fff;
    border: 1px solid #dee0e3;
    border-radius: 8px;
    flex-wrap: wrap;
    justify-content: center;
    margin-left: 12px;
    padding: 8px;
    display: flex;
    position: absolute;
    right: 12px;
    box-shadow: 0 6px 24px rgba(17, 34, 51, .1)
}

.editor-kit-wrapper-container.adit-wrapper-container>.adit-plate:empty {
    display: none
}

.editor-kit-wrapper-container.adit-wrapper-container>.adit-plate.vertical {
    display: flex
}

.editor-kit-wrapper-container.adit-wrapper-container>.adit-plate.vertical.top,
.editor-kit-wrapper-container.adit-wrapper-container>.adit-plate.vertical.top .adit-group,
.editor-kit-wrapper-container.adit-wrapper-container>.adit-plate.vertical.bottom,
.editor-kit-wrapper-container.adit-wrapper-container>.adit-plate.vertical.bottom .adit-group {
    flex-direction: column
}

.editor-kit-wrapper-container.adit-wrapper-container>.adit-plate:not(.vertical),
.editor-kit-wrapper-container.adit-wrapper-container>.adit-plate:not(.vertical) .adit-group {
    flex-direction: row
}

.editor-kit-wrapper-container.adit-wrapper-container.top>.adit-plate {
    bottom: 100%
}

.editor-kit-wrapper-container.adit-wrapper-container.bottom>.adit-plate {
    top: 100%
}

.editor-kit-wrapper-container .adit-wrapper {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    float: left;
    background-color: #fff;
    align-items: center;
    padding: 7px 16.5px;
    display: flex
}

.editor-kit-wrapper-container .adit-wrapper>div:not(:first-child),
.editor-kit-wrapper-container .adit-plate:not(.vertical)>div:not(:first-child) {
    padding-left: 4px
}

.editor-kit-wrapper-container .adit-wrapper>div:not(:last-child),
.editor-kit-wrapper-container .adit-plate:not(.vertical)>div:not(:last-child) {
    padding-right: 4px
}

.editor-kit-wrapper-container .adit-group {
    display: flex
}

.editor-kit-wrapper-container .adit-group:not(:first-child):before {
    content: "";
    background-color: #dee0e3;
    width: 1px;
    height: 18px;
    margin: auto 4px auto 0;
    display: block
}

.editor-kit-wrapper-container .adit-group:not(:first-child)>div {
    padding-left: 4px
}

.editor-kit-wrapper-container .adit-group>div:not(:last-child) {
    padding-right: 4px
}

.editor-kit-wrapper-container .adit-plate.vertical .adit-group:before {
    content: none
}

.editor-kit-wrapper-container .adit-plate.vertical .adit-group>div {
    padding: 0
}

.editor-kit-wrapper-container .adit-toolbar-iframe {
    visibility: hidden;
    pointer-events: none;
    border: none;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0
}


span.equation-leaf {
    margin: 0 2px
}

.editor-kit-container .editor-kit-equation-block {
    vertical-align: middle;
    max-width: 100%;
    padding: 0 1px;
    font-size: 0;
    line-height: 0;
    display: inline-block;
    position: relative
}

.editor-kit-equation-popover-wrapper {
    width: 0;
    height: 0;
    position: absolute;
    top: -999px;
    left: -999px
}

.equation-leaf>[data-rect-container=true]>[data-zero-space=true] {
    width: .1px
}

.equation-leaf>[data-rect-container=true]>[data-zero-space=true]::-moz-selection {
    background-color: transparent
}

.equation-leaf>[data-rect-container=true]>[data-zero-space=true]::selection {
    background-color: transparent
}

.equation-leaf>[data-rect-container=true] {
    align-items: center;
    max-width: calc(100% - 1px);
    display: inline-flex
}

.equation-leaf>[data-rect-container=true]>[data-fake-text] {
    max-width: 100%;
    display: inline-flex
}

.equation-leaf.equation-display-block>[data-rect-container=true],
.equation-leaf.equation-display-block>[data-rect-container=true]>[data-fake-text] {
    width: 100%
}

.editor-kit-equation-editor {
    box-sizing: border-box;
    border: 1px solid #d0d3d6;
    border-radius: 6px;
    font-family: monospace;
    position: relative;
    overflow: hidden
}

.editor-kit-equation-editor:hover {
    border-color: #3370ff
}

.editor-kit-equation-editor .editor-kit-container {
    outline: none;
    max-height: 500px;
    padding: 8px 12px;
    line-height: 22px;
    position: relative;
    overflow-y: auto
}

.editor-kit-equation-editor .editor-kit-container:hover::-webkit-scrollbar-thumb {
    background-color: rgba(31, 35, 41, .3);
    background-clip: padding-box;
    border: 2px solid transparent;
    border-radius: 9999px;
    transition: background .2s cubic-bezier(.34, .69, .1, 1)
}

.editor-kit-equation-editor .editor-kit-container::-webkit-scrollbar {
    background-color: transparent;
    width: 11px;
    height: 11px
}

.editor-kit-equation-editor .editor-kit-container::-webkit-scrollbar-thumb:hover {
    background-color: rgba(31, 35, 41, .6) !important
}

.editor-kit-equation-editor .editor-kit-container::-webkit-scrollbar:hover {
    width: 11px;
    height: 11px
}

.editor-kit-equation-editor .editor-kit-container::-webkit-scrollbar-button {
    display: none
}

.editor-kit-equation-editor .editor-kit-container::-webkit-scrollbar-track {
    background-color: transparent
}

.editor-kit-equation-editor .editor-kit-container::-webkit-scrollbar-corner {
    background-color: transparent
}

.editor-kit-equation-editor .editor-kit-container[data-placeholder]:before {
    content: attr(data-placeholder)
}

.editor-kit-equation-editor .editor-kit-container:before {
    content: attr(data-placeholder);
    pointer-events: none;
    color: #bbbfc4;
    height: 0;
    position: absolute;
    top: 8px;
    left: 12px
}

.editor-kit-equation-editor-selected {
    border-color: #3370ff
}

.editor-kit-container .editor-kit-equation-view {
    transform-origin: 0;
    border-radius: 4px;
    min-width: 16px;
    padding: 0 2px;
    display: inline-block
}

.editor-kit-container .editor-kit-equation-block .editor-kit-equation-view.placeholder {
    background-color: #eff0f1
}

.editor-kit-container .editor-kit-equation-block.editable .editor-kit-equation-view {
    cursor: pointer
}

.editor-kit-container .editor-kit-equation-block.editable .editor-kit-equation-view ::-moz-selection {
    background-color: transparent
}

.editor-kit-container .editor-kit-equation-block.editable .editor-kit-equation-view ::selection {
    background-color: transparent
}

.editor-kit-container .editor-kit-equation-block.editable .editor-kit-equation-view:hover {
    background-color: rgba(31, 35, 41, .08)
}

.editor-kit-container .editor-kit-equation-block.editable .editor-kit-equation-view:hover.placeholder {
    background-color: #dee0e3
}

.editor-kit-container .editor-kit-equation-block.editable .editor-kit-equation-view:active {
    background-color: rgba(31, 35, 41, .12) !important
}

.editor-kit-container .editor-kit-equation-block.editable .editor-kit-equation-view:active.placeholder {
    background-color: #bbbfc4 !important
}

.editor-kit-container .editor-kit-equation-block.editor-kit-equation-block-selected .editor-kit-equation-view,
.editor-kit-container .editor-kit-equation-block.editor-kit-equation-block-selected .editor-kit-equation-view.placeholder {
    background-color: #e1eaff !important
}

.editor-kit-container .editor-kit-equation-view-content {
    width: 100%;
    font-size: 15px;
    display: inline-block
}

.editor-kit-container .editor-kit-equation-view-placeholder {
    display: inline-block
}

.editor-kit-container .overflow-numbering .katex-display>.katex>.katex-html>.tag {
    position: relative
}


.editor-kit-container ul,
.editor-kit-container ol {
    margin: 0;
    padding-left: 0
}

.editor-kit-container ul.list-done li {
    color: #646a73
}

.editor-kit-container ul.r-list-bullet {
    list-style: none
}

.editor-kit-container ul.r-list-indent {
    list-style-type: none
}

.editor-kit-container ul.r-list-bullet li {
    padding-left: 22px
}

.editor-kit-container ul.r-list-bullet li:before {
    box-sizing: border-box;
    text-align: right;
    color: #3370ff;
    width: 0;
    margin-left: -20px;
    margin-right: 20px;
    display: inline-block;
    position: absolute;
    transform: scale(1.25)
}

.editor-kit-container .heading-h1 ul.r-list-bullet li,
.editor-kit-container .heading-h1 ol.r-list-bullet li {
    padding-left: 32px
}

.editor-kit-container .heading-h1 ul.r-list-bullet li:before,
.editor-kit-container .heading-h1 ol.r-list-bullet li:before {
    margin-left: -29px;
    margin-right: 29px
}

.editor-kit-container .heading-h2 ul.r-list-bullet li,
.editor-kit-container .heading-h2 ol.r-list-bullet li {
    padding-left: 23px
}

.editor-kit-container .heading-h2 ul.r-list-bullet li:before,
.editor-kit-container .heading-h2 ol.r-list-bullet li:before {
    margin-left: -21px;
    margin-right: 21px
}

.editor-kit-container .heading-h3 ul.r-list-bullet li,
.editor-kit-container .heading-h3 ol.r-list-bullet li {
    padding-left: 22px
}

.editor-kit-container .heading-h3 ul.r-list-bullet li:before,
.editor-kit-container .heading-h3 ol.r-list-bullet li:before {
    margin-left: -20px;
    margin-right: 20px
}

.editor-kit-container .text-indent ul.r-list-bullet li:before,
.editor-kit-container .text-indent ol.r-list-bullet li:before {
    text-indent: -1em
}

.editor-kit-container ul.list-bullet1 li:before,
.editor-kit-container ul.list-bullet4 li:before,
.editor-kit-container ul.list-bullet7 li:before,
.editor-kit-container ul.list-bullet10 li:before,
.editor-kit-container ul.list-bullet13 li:before,
.editor-kit-container ul.list-bullet16 li:before {
    content: "•"
}

.editor-kit-container .chrome:not(.window) ul.list-bullet2 li:before,
.editor-kit-container .safari ul.list-bullet2 li:before,
.editor-kit-container .chrome:not(.window) ul.list-bullet5 li:before,
.editor-kit-container .safari ul.list-bullet5 li:before,
.editor-kit-container .chrome:not(.window) ul.list-bullet8 li:before,
.editor-kit-container .safari ul.list-bullet8 li:before,
.editor-kit-container .chrome:not(.window) ul.list-bullet11 li:before,
.editor-kit-container .safari ul.list-bullet11 li:before,
.editor-kit-container .chrome:not(.window) ul.list-bullet14 li:before,
.editor-kit-container .safari ul.list-bullet14 li:before {
    font-weight: 700;
    transform: scale(.8)
}

.editor-kit-container ul.list-bullet2 li:before,
.editor-kit-container ul.list-bullet5 li:before,
.editor-kit-container ul.list-bullet8 li:before,
.editor-kit-container ul.list-bullet11 li:before,
.editor-kit-container ul.list-bullet14 li:before {
    content: "◦"
}

.editor-kit-container ul.list-bullet3 li:before,
.editor-kit-container ul.list-bullet6 li:before,
.editor-kit-container ul.list-bullet9 li:before,
.editor-kit-container ul.list-bullet12 li:before,
.editor-kit-container ul.list-bullet15 li:before {
    content: "▪"
}

.editor-kit-container ul.r-list-number,
.editor-kit-container ol.r-list-number {
    list-style-type: none
}

.editor-kit-container ul.r-list-number li,
.editor-kit-container ol.r-list-number li {
    padding-left: 22px
}

.editor-kit-container ul.r-list-number li:before,
.editor-kit-container ol.r-list-number li:before {
    content: attr(data-start)".";
    text-align: left;
    white-space: nowrap;
    box-sizing: border-box;
    color: #3370ff;
    background-clip: padding-box;
    border-radius: 2px;
    min-width: 18px;
    height: 100%;
    margin-left: -22px;
    margin-right: 4px;
    padding-left: 2px;
    padding-right: 2px;
    line-height: 1.2;
    display: inline-block;
    overflow: visible;
    transform: translate(-2px)
}

.editor-kit-container .heading-h1 ul.r-list-number li,
.editor-kit-container .heading-h1 ol.r-list-number li {
    padding-left: 32px
}

.editor-kit-container .heading-h1 ul.r-list-number li:before,
.editor-kit-container .heading-h1 ol.r-list-number li:before {
    min-width: 1.1em;
    margin-left: -32px;
    margin-right: 3px;
    padding-left: 2px;
    padding-right: 2px;
    transform: translate(-2px)
}

.editor-kit-container .heading-h2 ul.r-list-number li,
.editor-kit-container .heading-h2 ol.r-list-number li {
    padding-left: 23px
}

.editor-kit-container .heading-h2 ul.r-list-number li:before,
.editor-kit-container .heading-h2 ol.r-list-number li:before {
    margin-left: -23px;
    margin-right: 2px;
    padding-left: 2px;
    padding-right: 2px;
    transform: translate(-2px)
}

.editor-kit-container .heading-h3 ul.r-list-number li,
.editor-kit-container .heading-h3 ol.r-list-number li {
    padding-left: 22px
}

.editor-kit-container .heading-h3 ul.r-list-number li:before,
.editor-kit-container .heading-h3 ol.r-list-number li:before {
    margin-left: -22px;
    margin-right: 2px;
    padding-left: 2px;
    padding-right: 2px;
    transform: translate(-2px)
}

.editor-kit-container .heading-h4 ul.r-list-number li,
.editor-kit-container .heading-h4 ol.r-list-number li {
    padding-left: 21px
}

.editor-kit-container .heading-h4 ul.r-list-number li:before,
.editor-kit-container .heading-h4 ol.r-list-number li:before {
    margin-left: -21px;
    margin-right: 2px;
    padding-left: 2px;
    padding-right: 2px;
    transform: translate(-2px)
}

.editor-kit-container .heading-h5 ul.r-list-number li,
.editor-kit-container .heading-h6 ul.r-list-number li,
.editor-kit-container .heading-h7 ul.r-list-number li,
.editor-kit-container .heading-h8 ul.r-list-number li,
.editor-kit-container .heading-h9 ul.r-list-number li,
.editor-kit-container .heading-h5 ol.r-list-number li,
.editor-kit-container .heading-h6 ol.r-list-number li,
.editor-kit-container .heading-h7 ol.r-list-number li,
.editor-kit-container .heading-h8 ol.r-list-number li,
.editor-kit-container .heading-h9 ol.r-list-number li {
    padding-left: 20px
}

.editor-kit-container .heading-h5 ul.r-list-number li:before,
.editor-kit-container .heading-h6 ul.r-list-number li:before,
.editor-kit-container .heading-h7 ul.r-list-number li:before,
.editor-kit-container .heading-h8 ul.r-list-number li:before,
.editor-kit-container .heading-h9 ul.r-list-number li:before,
.editor-kit-container .heading-h5 ol.r-list-number li:before,
.editor-kit-container .heading-h6 ol.r-list-number li:before,
.editor-kit-container .heading-h7 ol.r-list-number li:before,
.editor-kit-container .heading-h8 ol.r-list-number li:before,
.editor-kit-container .heading-h9 ol.r-list-number li:before {
    margin-left: -20px;
    margin-right: 2px;
    padding-left: 2px;
    padding-right: 2px;
    transform: translate(-2px)
}

.editor-kit-container .text-indent ul.r-list-number li:before,
.editor-kit-container .text-indent ol.r-list-number li:before {
    text-indent: 0;
    margin-left: -20px;
    padding-right: 4px
}

.editor-kit-container .text-indent.heading-h1 ul.r-list-number li:before,
.editor-kit-container .text-indent.heading-h2 ul.r-list-number li:before,
.editor-kit-container .text-indent.heading-h1 ol.r-list-number li:before,
.editor-kit-container .text-indent.heading-h2 ol.r-list-number li:before {
    margin-left: -26px;
    padding-right: 10px
}

.editor-kit-container.window ul.r-list-number li:before,
.editor-kit-container.window ol.r-list-number li:before,
.editor-kit-container.window .heading-h1 ul.r-list-number li:before,
.editor-kit-container.window .heading-h2 ul.r-list-number li:before,
.editor-kit-container.window .heading-h1 ol.r-list-number li:before,
.editor-kit-container.window .heading-h2 ol.r-list-number li:before,
.editor-kit-container.window .heading-h2 ul.r-list-number li:before,
.editor-kit-container.window .heading-h2 ol.r-list-number li:before {
    padding-right: 0 !important
}

.editor-kit-container.window .heading-h3 ul.r-list-number li:before,
.editor-kit-container.window .heading-h4 ul.r-list-number li:before,
.editor-kit-container.window .heading-h5 ul.r-list-number li:before,
.editor-kit-container.window .heading-h6 ul.r-list-number li:before,
.editor-kit-container.window .heading-h7 ul.r-list-number li:before,
.editor-kit-container.window .heading-h8 ul.r-list-number li:before,
.editor-kit-container.window .heading-h9 ul.r-list-number li:before,
.editor-kit-container.window .heading-h3 ol.r-list-number li:before,
.editor-kit-container.window .heading-h4 ol.r-list-number li:before,
.editor-kit-container.window .heading-h5 ol.r-list-number li:before,
.editor-kit-container.window .heading-h6 ol.r-list-number li:before,
.editor-kit-container.window .heading-h7 ol.r-list-number li:before,
.editor-kit-container.window .heading-h8 ol.r-list-number li:before,
.editor-kit-container.window .heading-h9 ol.r-list-number li:before {
    padding-right: 2px !important
}

.editor-kit-container.chrome ul.r-list-number li,
.editor-kit-container.chrome ol.r-list-number li {
    vertical-align: -4px
}

.editor-kit-container.chrome ul.r-list-number li:before,
.editor-kit-container.chrome ol.r-list-number li:before {
    background-position: right 1px bottom 6px !important
}

.editor-kit-container.chrome .heading-h1 ul.r-list-number li,
.editor-kit-container.chrome .heading-h1 ol.r-list-number li {
    line-height: 42px
}

.editor-kit-container.chrome .heading-h1 ul.r-list-number li:before,
.editor-kit-container.chrome .heading-h1 ol.r-list-number li:before {
    background-position: right 3px bottom 9px !important
}

.editor-kit-container.chrome .heading-h1 ul.r-list-number li .collapsable-section-handle,
.editor-kit-container.chrome .heading-h1 ol.r-list-number li .collapsable-section-handle {
    height: 42px
}

.editor-kit-container.chrome .heading-h2 ul.r-list-number li,
.editor-kit-container.chrome .heading-h2 ol.r-list-number li {
    line-height: 32px
}

.editor-kit-container.chrome .heading-h2 ul.r-list-number li:before,
.editor-kit-container.chrome .heading-h2 ol.r-list-number li:before {
    background-position: right 0 bottom 6px !important
}

.editor-kit-container.chrome .heading-h2 ul.r-list-number li .collapsable-section-handle,
.editor-kit-container.chrome .heading-h2 ol.r-list-number li .collapsable-section-handle {
    height: 32px
}

.editor-kit-container.chrome .heading-h3 ul.r-list-number li,
.editor-kit-container.chrome .heading-h3 ol.r-list-number li {
    line-height: 25px
}

.editor-kit-container.chrome .heading-h3 ul.r-list-number li:before,
.editor-kit-container.chrome .heading-h3 ol.r-list-number li:before {
    background-position: right 0 bottom 4px !important
}

.editor-kit-container.chrome .heading-h3 ul.r-list-number li .collapsable-section-handle,
.editor-kit-container.chrome .heading-h3 ol.r-list-number li .collapsable-section-handle {
    height: 25px
}

.editor-kit-container.chrome .heading-h4 ul.r-list-number li,
.editor-kit-container.chrome .heading-h4 ol.r-list-number li {
    line-height: 24px
}

.editor-kit-container.chrome .heading-h4 ul.r-list-number li:before,
.editor-kit-container.chrome .heading-h4 ol.r-list-number li:before {
    background-position: right 0 bottom 3px !important
}

.editor-kit-container.chrome .heading-h4 ul.r-list-number li .collapsable-section-handle,
.editor-kit-container.chrome .heading-h4 ol.r-list-number li .collapsable-section-handle {
    height: 24px
}

.editor-kit-container.chrome .heading-h5 ul.r-list-number li,
.editor-kit-container.chrome .heading-h6 ul.r-list-number li,
.editor-kit-container.chrome .heading-h7 ul.r-list-number li,
.editor-kit-container.chrome .heading-h8 ul.r-list-number li,
.editor-kit-container.chrome .heading-h9 ul.r-list-number li,
.editor-kit-container.chrome .heading-h5 ol.r-list-number li,
.editor-kit-container.chrome .heading-h6 ol.r-list-number li,
.editor-kit-container.chrome .heading-h7 ol.r-list-number li,
.editor-kit-container.chrome .heading-h8 ol.r-list-number li,
.editor-kit-container.chrome .heading-h9 ol.r-list-number li {
    line-height: 22px
}

.editor-kit-container.chrome .heading-h5 ul.r-list-number li:before,
.editor-kit-container.chrome .heading-h6 ul.r-list-number li:before,
.editor-kit-container.chrome .heading-h7 ul.r-list-number li:before,
.editor-kit-container.chrome .heading-h8 ul.r-list-number li:before,
.editor-kit-container.chrome .heading-h9 ul.r-list-number li:before,
.editor-kit-container.chrome .heading-h5 ol.r-list-number li:before,
.editor-kit-container.chrome .heading-h6 ol.r-list-number li:before,
.editor-kit-container.chrome .heading-h7 ol.r-list-number li:before,
.editor-kit-container.chrome .heading-h8 ol.r-list-number li:before,
.editor-kit-container.chrome .heading-h9 ol.r-list-number li:before {
    background-position: right 0 bottom 2px !important
}

.editor-kit-container.chrome .heading-h5 ul.r-list-number li .collapsable-section-handle,
.editor-kit-container.chrome .heading-h6 ul.r-list-number li .collapsable-section-handle,
.editor-kit-container.chrome .heading-h7 ul.r-list-number li .collapsable-section-handle,
.editor-kit-container.chrome .heading-h8 ul.r-list-number li .collapsable-section-handle,
.editor-kit-container.chrome .heading-h9 ul.r-list-number li .collapsable-section-handle,
.editor-kit-container.chrome .heading-h5 ol.r-list-number li .collapsable-section-handle,
.editor-kit-container.chrome .heading-h6 ol.r-list-number li .collapsable-section-handle,
.editor-kit-container.chrome .heading-h7 ol.r-list-number li .collapsable-section-handle,
.editor-kit-container.chrome .heading-h8 ol.r-list-number li .collapsable-section-handle,
.editor-kit-container.chrome .heading-h9 ol.r-list-number li .collapsable-section-handle {
    height: 22px
}

.editor-kit-container ul.r-list.list-check16,
.editor-kit-container ul.r-list.list-done16 {
    margin-left: 354px
}

.editor-kit-container ul.list-bullet16,
.editor-kit-container ol.list-number16 {
    margin-left: 360px
}

.editor-kit-container ul.r-list.list-check15,
.editor-kit-container ul.r-list.list-done15 {
    margin-left: 330px
}

.editor-kit-container ul.list-bullet15,
.editor-kit-container ol.list-number15 {
    margin-left: 336px
}

.editor-kit-container ul.r-list.list-check14,
.editor-kit-container ul.r-list.list-done14 {
    margin-left: 306px
}

.editor-kit-container ul.list-bullet14,
.editor-kit-container ol.list-number14 {
    margin-left: 312px
}

.editor-kit-container ul.r-list.list-check13,
.editor-kit-container ul.r-list.list-done13 {
    margin-left: 282px
}

.editor-kit-container ul.list-bullet13,
.editor-kit-container ol.list-number13 {
    margin-left: 288px
}

.editor-kit-container ul.r-list.list-check12,
.editor-kit-container ul.r-list.list-done12 {
    margin-left: 258px
}

.editor-kit-container ul.list-bullet12,
.editor-kit-container ol.list-number12 {
    margin-left: 264px
}

.editor-kit-container ul.r-list.list-check11,
.editor-kit-container ul.r-list.list-done11 {
    margin-left: 234px
}

.editor-kit-container ul.list-bullet11,
.editor-kit-container ol.list-number11 {
    margin-left: 240px
}

.editor-kit-container ul.r-list.list-check10,
.editor-kit-container ul.r-list.list-done10 {
    margin-left: 210px
}

.editor-kit-container ul.list-bullet10,
.editor-kit-container ol.list-number10 {
    margin-left: 216px
}

.editor-kit-container ul.r-list.list-check9,
.editor-kit-container ul.r-list.list-done9 {
    margin-left: 186px
}

.editor-kit-container ul.list-bullet9,
.editor-kit-container ol.list-number9 {
    margin-left: 192px
}

.editor-kit-container ul.r-list.list-check8,
.editor-kit-container ul.r-list.list-done8 {
    margin-left: 162px
}

.editor-kit-container ul.list-bullet8,
.editor-kit-container ol.list-number8 {
    margin-left: 168px
}

.editor-kit-container ul.r-list.list-check7,
.editor-kit-container ul.r-list.list-done7 {
    margin-left: 138px
}

.editor-kit-container ul.list-bullet7,
.editor-kit-container ol.list-number7 {
    margin-left: 144px
}

.editor-kit-container ul.r-list.list-check6,
.editor-kit-container ul.r-list.list-done6 {
    margin-left: 114px
}

.editor-kit-container ul.list-bullet6,
.editor-kit-container ol.list-number6 {
    margin-left: 120px
}

.editor-kit-container ul.r-list.list-check5,
.editor-kit-container ul.r-list.list-done5 {
    margin-left: 90px
}

.editor-kit-container ul.list-bullet5,
.editor-kit-container ol.list-number5 {
    margin-left: 96px
}

.editor-kit-container ul.r-list.list-check4,
.editor-kit-container ul.r-list.list-done4 {
    margin-left: 66px
}

.editor-kit-container ul.list-bullet4,
.editor-kit-container ol.list-number4 {
    margin-left: 72px
}

.editor-kit-container ul.r-list.list-check3,
.editor-kit-container ul.r-list.list-done3 {
    margin-left: 42px
}

.editor-kit-container ul.list-bullet3,
.editor-kit-container ol.list-number3 {
    margin-left: 48px
}

.editor-kit-container ul.r-list.list-check2,
.editor-kit-container ul.r-list.list-done2 {
    margin-left: 18px
}

.editor-kit-container ul.list-bullet2,
.editor-kit-container ol.list-number2 {
    margin-left: 24px
}

.editor-kit-container ul.r-list.list-check1,
.editor-kit-container ul.r-list.list-done1 {
    margin-left: -6px
}

.editor-kit-container ul.list-bullet1,
.editor-kit-container ol.list-number1 {
    margin-left: 0
}

.editor-kit-container ul.list-indent16 {
    margin-left: 382px
}

.editor-kit-container ul.list-indent15 {
    margin-left: 358px
}

.editor-kit-container ul.list-indent14 {
    margin-left: 334px
}

.editor-kit-container ul.list-indent13 {
    margin-left: 310px
}

.editor-kit-container ul.list-indent12 {
    margin-left: 286px
}

.editor-kit-container ul.list-indent11 {
    margin-left: 262px
}

.editor-kit-container ul.list-indent10 {
    margin-left: 238px
}

.editor-kit-container ul.list-indent9 {
    margin-left: 214px
}

.editor-kit-container ul.list-indent8 {
    margin-left: 190px
}

.editor-kit-container ul.list-indent7 {
    margin-left: 166px
}

.editor-kit-container ul.list-indent6 {
    margin-left: 142px
}

.editor-kit-container ul.list-indent5 {
    margin-left: 118px
}

.editor-kit-container ul.list-indent4 {
    margin-left: 94px
}

.editor-kit-container ul.list-indent3 {
    margin-left: 70px
}

.editor-kit-container ul.list-indent2 {
    margin-left: 46px
}

.editor-kit-container ul.list-indent1 {
    margin-left: 22px
}

.editor-kit-container .heading-h1 ul.list-indent16 {
    margin-left: 390px
}

.editor-kit-container .heading-h1 ul.list-indent15 {
    margin-left: 366px
}

.editor-kit-container .heading-h1 ul.list-indent14 {
    margin-left: 342px
}

.editor-kit-container .heading-h1 ul.list-indent13 {
    margin-left: 318px
}

.editor-kit-container .heading-h1 ul.list-indent12 {
    margin-left: 294px
}

.editor-kit-container .heading-h1 ul.list-indent11 {
    margin-left: 270px
}

.editor-kit-container .heading-h1 ul.list-indent10 {
    margin-left: 246px
}

.editor-kit-container .heading-h1 ul.list-indent9 {
    margin-left: 222px
}

.editor-kit-container .heading-h1 ul.list-indent8 {
    margin-left: 198px
}

.editor-kit-container .heading-h1 ul.list-indent7 {
    margin-left: 174px
}

.editor-kit-container .heading-h1 ul.list-indent6 {
    margin-left: 150px
}

.editor-kit-container .heading-h1 ul.list-indent5 {
    margin-left: 126px
}

.editor-kit-container .heading-h1 ul.list-indent4 {
    margin-left: 102px
}

.editor-kit-container .heading-h1 ul.list-indent3 {
    margin-left: 78px
}

.editor-kit-container .heading-h1 ul.list-indent2 {
    margin-left: 54px
}

.editor-kit-container .heading-h1 ul.list-indent1 {
    margin-left: 30px
}

.editor-kit-container .heading-h2 ul.list-indent16 {
    margin-left: 384px
}

.editor-kit-container .heading-h2 ul.list-indent15 {
    margin-left: 360px
}

.editor-kit-container .heading-h2 ul.list-indent14 {
    margin-left: 336px
}

.editor-kit-container .heading-h2 ul.list-indent13 {
    margin-left: 312px
}

.editor-kit-container .heading-h2 ul.list-indent12 {
    margin-left: 288px
}

.editor-kit-container .heading-h2 ul.list-indent11 {
    margin-left: 264px
}

.editor-kit-container .heading-h2 ul.list-indent10 {
    margin-left: 240px
}

.editor-kit-container .heading-h2 ul.list-indent9 {
    margin-left: 216px
}

.editor-kit-container .heading-h2 ul.list-indent8 {
    margin-left: 192px
}

.editor-kit-container .heading-h2 ul.list-indent7 {
    margin-left: 168px
}

.editor-kit-container .heading-h2 ul.list-indent6 {
    margin-left: 144px
}

.editor-kit-container .heading-h2 ul.list-indent5 {
    margin-left: 120px
}

.editor-kit-container .heading-h2 ul.list-indent4 {
    margin-left: 96px
}

.editor-kit-container .heading-h2 ul.list-indent3 {
    margin-left: 72px
}

.editor-kit-container .heading-h2 ul.list-indent2 {
    margin-left: 48px
}

.editor-kit-container .heading-h2 ul.list-indent1 {
    margin-left: 24px
}

.editor-kit-container .heading-h3 ul.list-indent16 {
    margin-left: 383px
}

.editor-kit-container .heading-h3 ul.list-indent15 {
    margin-left: 359px
}

.editor-kit-container .heading-h3 ul.list-indent14 {
    margin-left: 335px
}

.editor-kit-container .heading-h3 ul.list-indent13 {
    margin-left: 311px
}

.editor-kit-container .heading-h3 ul.list-indent12 {
    margin-left: 287px
}

.editor-kit-container .heading-h3 ul.list-indent11 {
    margin-left: 263px
}

.editor-kit-container .heading-h3 ul.list-indent10 {
    margin-left: 239px
}

.editor-kit-container .heading-h3 ul.list-indent9 {
    margin-left: 215px
}

.editor-kit-container .heading-h3 ul.list-indent8 {
    margin-left: 191px
}

.editor-kit-container .heading-h3 ul.list-indent7 {
    margin-left: 167px
}

.editor-kit-container .heading-h3 ul.list-indent6 {
    margin-left: 143px
}

.editor-kit-container .heading-h3 ul.list-indent5 {
    margin-left: 119px
}

.editor-kit-container .heading-h3 ul.list-indent4 {
    margin-left: 95px
}

.editor-kit-container .heading-h3 ul.list-indent3 {
    margin-left: 71px
}

.editor-kit-container .heading-h3 ul.list-indent2 {
    margin-left: 47px
}

.editor-kit-container .heading-h3 ul.list-indent1 {
    margin-left: 23px
}

.editor-kit-container .heading-h4 ul.list-indent16 {
    margin-left: 383px
}

.editor-kit-container .heading-h4 ul.list-indent15 {
    margin-left: 359px
}

.editor-kit-container .heading-h4 ul.list-indent14 {
    margin-left: 335px
}

.editor-kit-container .heading-h4 ul.list-indent13 {
    margin-left: 311px
}

.editor-kit-container .heading-h4 ul.list-indent12 {
    margin-left: 287px
}

.editor-kit-container .heading-h4 ul.list-indent11 {
    margin-left: 263px
}

.editor-kit-container .heading-h4 ul.list-indent10 {
    margin-left: 239px
}

.editor-kit-container .heading-h4 ul.list-indent9 {
    margin-left: 215px
}

.editor-kit-container .heading-h4 ul.list-indent8 {
    margin-left: 191px
}

.editor-kit-container .heading-h4 ul.list-indent7 {
    margin-left: 167px
}

.editor-kit-container .heading-h4 ul.list-indent6 {
    margin-left: 143px
}

.editor-kit-container .heading-h4 ul.list-indent5 {
    margin-left: 119px
}

.editor-kit-container .heading-h4 ul.list-indent4 {
    margin-left: 95px
}

.editor-kit-container .heading-h4 ul.list-indent3 {
    margin-left: 71px
}

.editor-kit-container .heading-h4 ul.list-indent2 {
    margin-left: 47px
}

.editor-kit-container .heading-h4 ul.list-indent1 {
    margin-left: 23px
}

.editor-kit-container .heading-h5 ul.list-indent16,
.editor-kit-container .heading-h6 ul.list-indent16,
.editor-kit-container .heading-h7 ul.list-indent16,
.editor-kit-container .heading-h8 ul.list-indent16,
.editor-kit-container .heading-h9 ul.list-indent16 {
    margin-left: 383px
}

.editor-kit-container .heading-h5 ul.list-indent15,
.editor-kit-container .heading-h6 ul.list-indent15,
.editor-kit-container .heading-h7 ul.list-indent15,
.editor-kit-container .heading-h8 ul.list-indent15,
.editor-kit-container .heading-h9 ul.list-indent15 {
    margin-left: 359px
}

.editor-kit-container .heading-h5 ul.list-indent14,
.editor-kit-container .heading-h6 ul.list-indent14,
.editor-kit-container .heading-h7 ul.list-indent14,
.editor-kit-container .heading-h8 ul.list-indent14,
.editor-kit-container .heading-h9 ul.list-indent14 {
    margin-left: 335px
}

.editor-kit-container .heading-h5 ul.list-indent13,
.editor-kit-container .heading-h6 ul.list-indent13,
.editor-kit-container .heading-h7 ul.list-indent13,
.editor-kit-container .heading-h8 ul.list-indent13,
.editor-kit-container .heading-h9 ul.list-indent13 {
    margin-left: 311px
}

.editor-kit-container .heading-h5 ul.list-indent12,
.editor-kit-container .heading-h6 ul.list-indent12,
.editor-kit-container .heading-h7 ul.list-indent12,
.editor-kit-container .heading-h8 ul.list-indent12,
.editor-kit-container .heading-h9 ul.list-indent12 {
    margin-left: 287px
}

.editor-kit-container .heading-h5 ul.list-indent11,
.editor-kit-container .heading-h6 ul.list-indent11,
.editor-kit-container .heading-h7 ul.list-indent11,
.editor-kit-container .heading-h8 ul.list-indent11,
.editor-kit-container .heading-h9 ul.list-indent11 {
    margin-left: 263px
}

.editor-kit-container .heading-h5 ul.list-indent10,
.editor-kit-container .heading-h6 ul.list-indent10,
.editor-kit-container .heading-h7 ul.list-indent10,
.editor-kit-container .heading-h8 ul.list-indent10,
.editor-kit-container .heading-h9 ul.list-indent10 {
    margin-left: 239px
}

.editor-kit-container .heading-h5 ul.list-indent9,
.editor-kit-container .heading-h6 ul.list-indent9,
.editor-kit-container .heading-h7 ul.list-indent9,
.editor-kit-container .heading-h8 ul.list-indent9,
.editor-kit-container .heading-h9 ul.list-indent9 {
    margin-left: 215px
}

.editor-kit-container .heading-h5 ul.list-indent8,
.editor-kit-container .heading-h6 ul.list-indent8,
.editor-kit-container .heading-h7 ul.list-indent8,
.editor-kit-container .heading-h8 ul.list-indent8,
.editor-kit-container .heading-h9 ul.list-indent8 {
    margin-left: 191px
}

.editor-kit-container .heading-h5 ul.list-indent7,
.editor-kit-container .heading-h6 ul.list-indent7,
.editor-kit-container .heading-h7 ul.list-indent7,
.editor-kit-container .heading-h8 ul.list-indent7,
.editor-kit-container .heading-h9 ul.list-indent7 {
    margin-left: 167px
}

.editor-kit-container .heading-h5 ul.list-indent6,
.editor-kit-container .heading-h6 ul.list-indent6,
.editor-kit-container .heading-h7 ul.list-indent6,
.editor-kit-container .heading-h8 ul.list-indent6,
.editor-kit-container .heading-h9 ul.list-indent6 {
    margin-left: 143px
}

.editor-kit-container .heading-h5 ul.list-indent5,
.editor-kit-container .heading-h6 ul.list-indent5,
.editor-kit-container .heading-h7 ul.list-indent5,
.editor-kit-container .heading-h8 ul.list-indent5,
.editor-kit-container .heading-h9 ul.list-indent5 {
    margin-left: 119px
}

.editor-kit-container .heading-h5 ul.list-indent4,
.editor-kit-container .heading-h6 ul.list-indent4,
.editor-kit-container .heading-h7 ul.list-indent4,
.editor-kit-container .heading-h8 ul.list-indent4,
.editor-kit-container .heading-h9 ul.list-indent4 {
    margin-left: 95px
}

.editor-kit-container .heading-h5 ul.list-indent3,
.editor-kit-container .heading-h6 ul.list-indent3,
.editor-kit-container .heading-h7 ul.list-indent3,
.editor-kit-container .heading-h8 ul.list-indent3,
.editor-kit-container .heading-h9 ul.list-indent3 {
    margin-left: 71px
}

.editor-kit-container .heading-h5 ul.list-indent2,
.editor-kit-container .heading-h6 ul.list-indent2,
.editor-kit-container .heading-h7 ul.list-indent2,
.editor-kit-container .heading-h8 ul.list-indent2,
.editor-kit-container .heading-h9 ul.list-indent2 {
    margin-left: 47px
}

.editor-kit-container .heading-h5 ul.list-indent1,
.editor-kit-container .heading-h6 ul.list-indent1,
.editor-kit-container .heading-h7 ul.list-indent1,
.editor-kit-container .heading-h8 ul.list-indent1,
.editor-kit-container .heading-h9 ul.list-indent1 {
    margin-left: 23px
}

.editor-kit-container .ace-table ul.r-list-bullet li {
    padding-left: 20px
}

.editor-kit-container .ace-table ul.r-list-bullet li:before {
    margin-left: -19px;
    margin-right: 19px
}

.editor-kit-container .ace-table .heading-h1 ul.r-list-bullet li,
.editor-kit-container .ace-table .heading-h1 ol.r-list-bullet li {
    padding-left: 29px
}

.editor-kit-container .ace-table .heading-h1 ul.r-list-bullet li:before,
.editor-kit-container .ace-table .heading-h1 ol.r-list-bullet li:before {
    margin-left: -29px;
    margin-right: 29px
}

.editor-kit-container .ace-table .heading-h2 ul.r-list-bullet li,
.editor-kit-container .ace-table .heading-h2 ol.r-list-bullet li {
    padding-left: 23px
}

.editor-kit-container .ace-table .heading-h2 ul.r-list-bullet li:before,
.editor-kit-container .ace-table .heading-h2 ol.r-list-bullet li:before {
    margin-left: -23px;
    margin-right: 23px
}

.editor-kit-container .ace-table .heading-h3 ul.r-list-bullet li,
.editor-kit-container .ace-table .heading-h3 ol.r-list-bullet li {
    padding-left: 20px
}

.editor-kit-container .ace-table .heading-h3 ul.r-list-bullet li:before,
.editor-kit-container .ace-table .heading-h3 ol.r-list-bullet li:before {
    margin-left: -20px;
    margin-right: 20px
}

.editor-kit-container .ace-table .heading-h4 ul.r-list-bullet li,
.editor-kit-container .ace-table .heading-h4 ol.r-list-bullet li {
    padding-left: 20px
}

.editor-kit-container .ace-table .heading-h4 ul.r-list-bullet li:before,
.editor-kit-container .ace-table .heading-h4 ol.r-list-bullet li:before {
    margin-left: -20px;
    margin-right: 20px
}

.editor-kit-container .ace-table .heading-h5 ul.r-list-bullet li,
.editor-kit-container .ace-table .heading-h6 ul.r-list-bullet li,
.editor-kit-container .ace-table .heading-h7 ul.r-list-bullet li,
.editor-kit-container .ace-table .heading-h8 ul.r-list-bullet li,
.editor-kit-container .ace-table .heading-h9 ul.r-list-bullet li,
.editor-kit-container .ace-table .heading-h5 ol.r-list-bullet li,
.editor-kit-container .ace-table .heading-h6 ol.r-list-bullet li,
.editor-kit-container .ace-table .heading-h7 ol.r-list-bullet li,
.editor-kit-container .ace-table .heading-h8 ol.r-list-bullet li,
.editor-kit-container .ace-table .heading-h9 ol.r-list-bullet li {
    padding-left: 20px
}

.editor-kit-container .ace-table .heading-h5 ul.r-list-bullet li:before,
.editor-kit-container .ace-table .heading-h6 ul.r-list-bullet li:before,
.editor-kit-container .ace-table .heading-h7 ul.r-list-bullet li:before,
.editor-kit-container .ace-table .heading-h8 ul.r-list-bullet li:before,
.editor-kit-container .ace-table .heading-h9 ul.r-list-bullet li:before,
.editor-kit-container .ace-table .heading-h5 ol.r-list-bullet li:before,
.editor-kit-container .ace-table .heading-h6 ol.r-list-bullet li:before,
.editor-kit-container .ace-table .heading-h7 ol.r-list-bullet li:before,
.editor-kit-container .ace-table .heading-h8 ol.r-list-bullet li:before,
.editor-kit-container .ace-table .heading-h9 ol.r-list-bullet li:before {
    margin-left: -20px;
    margin-right: 20px
}

.editor-kit-container .ace-table ul.r-list-number li,
.editor-kit-container .ace-table ol.r-list-number li {
    padding-left: 20px
}

.editor-kit-container .ace-table ul.r-list-number li:before,
.editor-kit-container .ace-table ol.r-list-number li:before {
    margin-left: -20px;
    margin-right: 2px;
    padding-left: 2px;
    padding-right: 2px;
    transform: translate(-2px)
}

.editor-kit-container .ace-table .heading-h1 ul.r-list-number li,
.editor-kit-container .ace-table .heading-h1 ol.r-list-number li {
    padding-left: 29px;
    line-height: 27px
}

.editor-kit-container .ace-table .heading-h1 ul.r-list-number li:before,
.editor-kit-container .ace-table .heading-h1 ol.r-list-number li:before {
    margin-left: -29px;
    margin-right: 4px;
    padding-left: 2px;
    padding-right: 2px;
    transform: translate(-2px)
}

.editor-kit-container .ace-table .heading-h2 ul.r-list-number li,
.editor-kit-container .ace-table .heading-h2 ol.r-list-number li {
    padding-left: 23px;
    line-height: 23px
}

.editor-kit-container .ace-table .heading-h2 ul.r-list-number li:before,
.editor-kit-container .ace-table .heading-h2 ol.r-list-number li:before {
    margin-left: -23px;
    margin-right: 3px;
    padding-left: 2px;
    padding-right: 2px;
    transform: translate(-2px)
}

.editor-kit-container .ace-table .heading-h3 ul.r-list-number li,
.editor-kit-container .ace-table .heading-h3 ol.r-list-number li {
    padding-left: 20px;
    line-height: 21px
}

.editor-kit-container .ace-table .heading-h3 ul.r-list-number li:before,
.editor-kit-container .ace-table .heading-h3 ol.r-list-number li:before {
    margin-left: -20px;
    margin-right: 2px;
    padding-left: 2px;
    padding-right: 2px;
    transform: translate(-2px)
}

.editor-kit-container .ace-table .heading-h4 ul.r-list-number li,
.editor-kit-container .ace-table .heading-h4 ol.r-list-number li {
    padding-left: 20px;
    line-height: 18px
}

.editor-kit-container .ace-table .heading-h4 ul.r-list-number li:before,
.editor-kit-container .ace-table .heading-h4 ol.r-list-number li:before {
    margin-left: -20px;
    margin-right: 2px;
    padding-left: 2px;
    padding-right: 2px;
    transform: translate(-2px)
}

.editor-kit-container .ace-table .heading-h5 ul.r-list-number li,
.editor-kit-container .ace-table .heading-h6 ul.r-list-number li,
.editor-kit-container .ace-table .heading-h7 ul.r-list-number li,
.editor-kit-container .ace-table .heading-h8 ul.r-list-number li,
.editor-kit-container .ace-table .heading-h9 ul.r-list-number li,
.editor-kit-container .ace-table .heading-h5 ol.r-list-number li,
.editor-kit-container .ace-table .heading-h6 ol.r-list-number li,
.editor-kit-container .ace-table .heading-h7 ol.r-list-number li,
.editor-kit-container .ace-table .heading-h8 ol.r-list-number li,
.editor-kit-container .ace-table .heading-h9 ol.r-list-number li {
    padding-left: 20px;
    line-height: 18px
}

.editor-kit-container .ace-table .heading-h5 ul.r-list-number li:before,
.editor-kit-container .ace-table .heading-h6 ul.r-list-number li:before,
.editor-kit-container .ace-table .heading-h7 ul.r-list-number li:before,
.editor-kit-container .ace-table .heading-h8 ul.r-list-number li:before,
.editor-kit-container .ace-table .heading-h9 ul.r-list-number li:before,
.editor-kit-container .ace-table .heading-h5 ol.r-list-number li:before,
.editor-kit-container .ace-table .heading-h6 ol.r-list-number li:before,
.editor-kit-container .ace-table .heading-h7 ol.r-list-number li:before,
.editor-kit-container .ace-table .heading-h8 ol.r-list-number li:before,
.editor-kit-container .ace-table .heading-h9 ol.r-list-number li:before {
    margin-left: -20px;
    margin-right: 2px;
    padding-left: 2px;
    padding-right: 2px;
    transform: translate(-2px)
}

.editor-kit-container.chrome .ace-table .heading-h1 ul.r-list-number li:before,
.editor-kit-container.chrome .ace-table .heading-h1 ol.r-list-number li:before {
    background-position: right 3px bottom 11px !important
}

.editor-kit-container.chrome .ace-table .heading-h2 ul.r-list-number li:before,
.editor-kit-container.chrome .ace-table .heading-h2 ol.r-list-number li:before {
    background-position: right 1px bottom 7px !important
}

.editor-kit-container.chrome .ace-table .heading-h3 ul.r-list-number li:before,
.editor-kit-container.chrome .ace-table .heading-h3 ol.r-list-number li:before {
    background-position: right 0 bottom 6px !important
}

.editor-kit-container.chrome .ace-table .heading-h4 ul.r-list-number li:before,
.editor-kit-container.chrome .ace-table .heading-h4 ol.r-list-number li:before {
    background-position: right 0 bottom 5px !important
}

.editor-kit-container.chrome .ace-table .heading-h5 ul.r-list-number li:before,
.editor-kit-container.chrome .ace-table .heading-h6 ul.r-list-number li:before,
.editor-kit-container.chrome .ace-table .heading-h7 ul.r-list-number li:before,
.editor-kit-container.chrome .ace-table .heading-h8 ul.r-list-number li:before,
.editor-kit-container.chrome .ace-table .heading-h9 ul.r-list-number li:before,
.editor-kit-container.chrome .ace-table .heading-h5 ol.r-list-number li:before,
.editor-kit-container.chrome .ace-table .heading-h6 ol.r-list-number li:before,
.editor-kit-container.chrome .ace-table .heading-h7 ol.r-list-number li:before,
.editor-kit-container.chrome .ace-table .heading-h8 ol.r-list-number li:before,
.editor-kit-container.chrome .ace-table .heading-h9 ol.r-list-number li:before {
    background-position: right 0 bottom 4px !important
}

.fs-mode ul.r-list-bullet li:before {
    margin-left: -1em !important
}

.fs-mode .heading-h1 ul.r-list-bullet li:before,
.fs-mode .heading-h1 ol.r-list-bullet li:before {
    margin-left: -.6em !important
}

.fs-mode .heading-h2 ul.r-list-bullet li:before,
.fs-mode .heading-h2 ol.r-list-bullet li:before {
    margin-left: -.7em !important
}

.fs-mode .heading-h3 ul.r-list-bullet li:before,
.fs-mode .heading-h3 ol.r-list-bullet li:before {
    margin-left: -.8em !important
}

.fs-mode .heading-h4 ul.r-list-bullet li:before,
.fs-mode .heading-h4 ol.r-list-bullet li:before {
    margin-left: -.9em !important
}

.editor-kit-container.ipad ul.r-list-bullet li:before {
    font-family: -webkit-standard
}


.vc-hover-background {
    border-radius: 4px;
    background-color: var(--C50, #fef1f8) !important
}

.vc-hover-border {
    border-color: var(--C500, #f01d94) !important
}

.code-block__lang-picker div.ud__popover-content {
    max-width: 240px;
    padding: 0 !important
}

.code-block__lang-picker div.ud__popover-content .scrollbar-container .ps__rail-x:hover,
.code-block__lang-picker div.ud__popover-content .scrollbar-container .ps__rail-y:hover,
.code-block__lang-picker div.ud__popover-content .scrollbar-container .ps__rail-x:focus,
.code-block__lang-picker div.ud__popover-content .scrollbar-container .ps__rail-y:focus,
.code-block__lang-picker div.ud__popover-content .scrollbar-container .ps__rail-x.ps--clicking,
.code-block__lang-picker div.ud__popover-content .scrollbar-container .ps__rail-y.ps--clicking {
    background-color: transparent
}

.code-block__lang-picker div.ud__popover-content .scrollbar-container .ps__thumb-y {
    background: rgba(var(--N900-raw, 235, 235, 235), .3)
}

.code-block__lang-picker div.ud__popover-content .scrollbar-container .ps__rail-y:hover>.ps__thumb-y,
.code-block__lang-picker div.ud__popover-content .scrollbar-container .ps__rail-y:focus>.ps__thumb-y,
.code-block__lang-picker div.ud__popover-content .scrollbar-container .ps__rail-y.ps--clicking .ps__thumb-y {
    background-color: rgba(var(--N900-raw), .6)
}

.code-block__lang-picker div.ud__popover-content .scrollbar-container-small .ps__thumb-y {
    background: rgba(var(--N900-raw, 235, 235, 235), .3)
}

.code-block__lang-picker div.ud__popover-content .scrollbar-container-small .ps__thumb-y:hover {
    background: rgba(var(--N900-raw, 235, 235, 235), .6) !important
}

.code-block__lang-picker div.ud__popover-content .scrollbar-container-small .ps__rail-y:hover .ps__thumb-y,
.code-block__lang-picker div.ud__popover-content .scrollbar-container-small .ps__rail-y.ps--clicking .ps__thumb-y {
    background: rgba(var(--N900-raw, 235, 235, 235), .6)
}

.code-block__lang-picker .ud__menu-vertical {
    padding: 0
}

.code-block__lang-picker .ud__menu-vertical .ud__menu-item {
    margin-top: 0;
    margin-bottom: 0
}

.code-block__lang-picker-content {
    flex-direction: column;
    display: flex
}

.code-block__lang-picker-search {
    border-bottom: 1px solid var(--line-border-card, #dee0e3);
    flex-shrink: 0;
    align-items: center;
    display: flex
}

.code-block__lang-picker-search .code-block__lang-picker-search-icon {
    margin: 0 8px 0 12px
}

.code-block__lang-picker-search .code-block__lang-picker-search-icon svg path {
    fill: var(--icon-n3, #8f959e)
}

.code-block__lang-picker-search .code-block__lang-picker-search-input {
    background-color: var(--bg-float, #fff);
    width: 100%;
    color: var(--text-title, #1f2329);
    border: none;
    outline: none;
    flex: 1;
    padding: 10px 12px 10px 0;
    font-size: 14px;
    line-height: 20px
}

.code-block__lang-picker-search .code-block__lang-picker-search-input::placeholder {
    color: var(--text-placeholder, #8f959e)
}

.code-block__lang-picker-search .code-block__lang-picker-search-input::placeholder {
    color: var(--text-placeholder, #8f959e)
}

.code-block__lang-picker-search .code-block__lang-picker-search-input::placeholder {
    color: var(--text-placeholder, #8f959e)
}

.code-block__lang-picker .code-block__lang-picker-list-container {
    border-radius: 4px;
    padding: 4px 0
}

.code-block__lang-picker .code-block__lang-picker-list {
    flex: 1;
    overflow: auto;
    border-right: none !important
}

.code-block__lang-picker .code-block__lang-picker-list .code-block__lang-picker-list-item {
    justify-content: space-between;
    align-items: center;
    height: 36px;
    padding-left: 12px;
    padding-right: 12px;
    line-height: 36px;
    display: flex
}

.code-block__lang-picker .code-block__lang-picker-list .code-block__lang-picker-list-item .ud__menu-item-title-content {
    justify-content: space-between;
    align-items: center;
    width: 100%;
    display: flex
}

.code-block__lang-picker .code-block__lang-picker-list .code-block__lang-picker-list-item .lang-text {
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 196px;
    overflow: hidden
}

.code-block__lang-picker .code-block__lang-picker-list .code-block__lang-picker-list-item .select-icon {
    margin-left: 8px
}

.code-block__lang-picker .code-block__lang-picker-list .code-block__lang-picker-list-item:hover {
    background-color: var(--fill-hover, rgba(var(--N900-raw, 235, 235, 235), .08))
}

.code-block__lang-picker .code-block__lang-picker-list .code-block__lang-picker-list-item-selected {
    color: var(--primary-pri-500, #4c88ff)
}

.code-block__lang-picker .code-block__lang-picker-list .code-block__lang-picker-list-item-active,
.code-block__lang-picker .code-block__lang-picker-list .code-block__lang-picker-list-item-active:hover {
    background-color: var(--bg-filler, #eff0f1)
}

.code-block__lang-picker .code-block__lang-picker-list .code-block__lang-picker-list-item-disable {
    color: var(--text-caption, #646a73);
    opacity: 1
}

.code-block__lang-picker .code-block__lang-picker-list .code-block__lang-picker-list-item-disable:hover {
    color: var(--text-caption, #646a73)
}

.universe-icon {
    text-align: center;
    text-transform: none;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-style: normal;
    line-height: 0;
    display: inline-block
}

.universe-icon>* {
    line-height: 1
}

.universe-icon svg {
    vertical-align: -.14em;
    display: inline-block
}

.universe-icon:before {
    display: none
}

.scrollbar-container {
    -ms-overflow-style: none;
    position: relative
}

.scrollbar-container .ps__rail-x:hover,
.scrollbar-container .ps__rail-y:hover,
.scrollbar-container .ps__rail-x:focus,
.scrollbar-container .ps__rail-y:focus,
.scrollbar-container .ps__rail-x.ps--clicking,
.scrollbar-container .ps__rail-y.ps--clicking {
    background-color: transparent
}

.scrollbar-container .ps__rail-y:hover>.ps__thumb-y,
.scrollbar-container .ps__rail-y:focus>.ps__thumb-y,
.scrollbar-container .ps__rail-y.ps--clicking .ps__thumb-y {
    background-color: rgba(var(--N900-raw), .6)
}

.scrollbar-container-small .ps__thumb-y {
    background: rgba(var(--N900-raw, 235, 235, 235), .3)
}

.scrollbar-container-small .ps__rail-y:hover .ps__thumb-y,
.scrollbar-container-small .ps__rail-y.ps--clicking .ps__thumb-y {
    background: rgba(var(--N900-raw, 235, 235, 235), .6)
}

.scrollbar-container.ps {
    overflow: auto !important
}

.scrollbar-container .ps__rail-y {
    z-index: 99
}

.scrollbar-container .ps__thumb-y {
    background: var(--ccmtoken-doc-highlightcolor-neutral-solid)
}

.scrollbar-container::-webkit-scrollbar {
    display: none
}

.scrollbar-container-small.ps:hover>.ps__rail-y,
.scrollbar-container-small.ps--scrolling-y>.ps__rail-y {
    opacity: 1
}

.scrollbar-container-small .ps__thumb-y {
    background: rgba(var(--N600-raw), .3);
    border-radius: 3.5px;
    width: 7px
}

.scrollbar-container-small .ps__thumb-y:hover {
    background: rgba(var(--N600-raw), .6) !important
}

.scrollbar-container-small .ps__rail-y {
    width: 11px;
    margin: 2px 0
}

.scrollbar-container-small .ps__rail-y:hover {
    opacity: 1;
    background: 0 0
}

.scrollbar-container-small .ps__rail-y:hover .ps__thumb-y {
    background: rgba(var(--N600-raw), .3);
    width: 7px
}

.scrollbar-container-small .ps__rail-y.ps--clicking {
    opacity: 1;
    background: 0 0
}

.scrollbar-container-small .ps__rail-y.ps--clicking .ps__thumb-y {
    background: rgba(var(--N600-raw), .6);
    width: 7px
}

.lark .scrollbar-container.ps {
    overflow: hidden !important
}

.bear-container.lark .ps__rail-y {
    z-index: 1
}

.hljs {
    color: #383a42;
    background: #fafafa;
    padding: .5em;
    display: block;
    overflow-x: auto
}

.hljs-comment,
.hljs-quote {
    color: #a0a1a7;
    font-style: italic
}

.hljs-doctag,
.hljs-keyword,
.hljs-formula {
    color: #a626a4
}

.hljs-section,
.hljs-name,
.hljs-selector-tag,
.hljs-deletion,
.hljs-subst {
    color: #e45649
}

.hljs-literal {
    color: #0184bb
}

.hljs-string,
.hljs-regexp,
.hljs-addition,
.hljs-attribute,
.hljs-meta-string {
    color: #50a14f
}

.hljs-built_in,
.hljs-class .hljs-title {
    color: #c18401
}

.hljs-attr,
.hljs-variable,
.hljs-template-variable,
.hljs-type,
.hljs-selector-class,
.hljs-selector-attr,
.hljs-selector-pseudo,
.hljs-number {
    color: #986801
}

.hljs-symbol,
.hljs-bullet,
.hljs-link,
.hljs-meta,
.hljs-selector-id,
.hljs-title {
    color: #4078f2
}

.hljs-emphasis {
    font-style: italic
}

.hljs-strong {
    font-weight: 700
}

.hljs-link {
    text-decoration: underline
}

.code-line-wrapper:before {
    content: attr(data-line-num);
    text-align: right;
    width: 46px;
    color: var(--text-caption);
    word-break: break-word;
    cursor: default;
    white-space: nowrap;
    position: absolute;
    left: 0;
    -webkit-user-select: none !important;
    -moz-user-select: none !important;
    -ms-user-select: none !important
}

.editor-kit-code-block {
    color: var(--N800, #2b2f36);
    background-color: var(--bg-body-overlay, #f5f6f7);
    border: 1px solid var(--line-border-card, #dee0e3);
    border-radius: 4px;
    padding-bottom: 2px;
    font-size: 14px;
    font-weight: 400;
    position: relative;
    transition: none !important
}

.editor-kit-code-block.hovered:not(.selected) {
    border: 1px solid var(--B200, #bacefd);
    box-shadow: 0 0 0 1px var(--B200, #bacefd);
    background-color: transparent
}

.editor-kit-code-block.selected {
    border-color: var(--text-link-hover, #3370ff)
}

.editor-kit-code-block .bold {
    font-weight: 700 !important
}

.windows.chrome96 .editor-kit-code-block .bold {
    font-weight: 599 !important
}

.editor-kit-code-block .code-block-header {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    border-radius: 4px 4px 0 0;
    min-width: 92px;
    height: 24px;
    padding: 4px 8px 0;
    font-size: 14px;
    display: flex;
    position: absolute;
    left: 0;
    right: 0
}

.editor-kit-code-block .code-block-header button {
    cursor: pointer;
    border: none
}

.editor-kit-code-block .code-block-header .ant-select {
    height: 26px
}

.editor-kit-code-block .code-block-header .ant-select-selection-item,
.editor-kit-code-block .code-block-header .ant-select-selection-search-input {
    line-height: 26px !important
}

.editor-kit-code-block .code-block-header .remain-space {
    border: none;
    flex: 1;
    min-width: 1px;
    height: 0
}

.editor-kit-code-block .code-block-header .full-space {
    border: none;
    width: 100%;
    min-width: 1px;
    height: 0;
    position: absolute
}

.editor-kit-code-block .code-block-header .code-wrap {
    height: 22px;
    color: var(--text-caption, #646a73);
    background-color: transparent;
    border: 0;
    border-radius: 4px;
    justify-content: space-around;
    align-items: center;
    margin-right: 17px;
    padding: 0 4px 0 2px;
    transition: none;
    display: flex;
    position: relative
}

.editor-kit-code-block .code-block-header .code-wrap path {
    fill: var(--icon-n2, #646a73)
}

.editor-kit-code-block .code-block-header .code-wrap:hover {
    background: rgba(var(--N900-raw), .1)
}

.editor-kit-code-block .code-block-header .code-wrap:active {
    background-color: rgba(var(--N900-raw), .2)
}

.editor-kit-code-block .code-block-header .code-wrap:after {
    content: "";
    background-color: var(--line-divider-default, rgba(var(--N900-raw, 235, 235, 235), .15));
    width: 1px;
    height: 16px;
    display: block;
    position: absolute;
    top: 3px;
    right: -9px
}

.editor-kit-code-block .code-block-header .code-wrap.hide-divider {
    margin-right: 0
}

.editor-kit-code-block .code-block-header .code-wrap.hide-divider:after {
    display: none
}

.editor-kit-code-block .code-block-header .code-copy {
    height: 22px;
    color: var(--text-caption, #646a73);
    background-color: transparent;
    border: 0;
    border-radius: 4px;
    justify-content: space-around;
    align-items: center;
    padding: 0 4px 0 2px;
    transition: none;
    display: flex
}

.editor-kit-code-block .code-block-header .code-copy path {
    fill: var(--icon-n2, #646a73)
}

.editor-kit-code-block .code-block-header .code-copy:hover {
    background: rgba(var(--N900-raw), .1)
}

.editor-kit-code-block .code-block-header .code-copy:active {
    background-color: rgba(var(--N900-raw), .2)
}

.editor-kit-code-block .code-block-header .code-dropdown {
    background-color: transparent;
    border: 0;
    border-radius: 4px;
    justify-content: center;
    align-items: center;
    width: 22px;
    height: 22px;
    padding: 0 8px;
    transition: none;
    display: flex;
    position: absolute;
    top: 4px;
    right: 5px
}

.editor-kit-code-block .code-block-header .code-dropdown:active {
    background-color: rgba(var(--bg-tips-raw), .2)
}

.editor-kit-code-block .code-block-header [ant-click-animating-without-extra-node=true]:after {
    display: none
}

html:not(.mobile) .bear-web-x-container.keyboard-mode .editor-kit-code-block .code-block-header {
    opacity: 0;
    pointer-events: none
}

.editor-kit-code-block.code-mobile-block .code-block-header {
    height: 36px;
    padding-top: 10px;
    padding-bottom: 6px;
    padding-right: 17px;
    font-size: 14px;
    position: static
}

.editor-kit-code-block.code-mobile-block .code-block-header .code-copy:hover {
    background-color: var(--bg-body-overlay, #f5f6f7)
}

.editor-kit-code-block.code-mobile-block .code-block-header .code-copy:active {
    background-color: rgba(var(--N900-raw), .2)
}

.editor-kit-code-block.code-mobile-block .code-block-header .code-dropdown {
    position: static;
    right: 0
}

.editor-kit-code-block.code-mobile-block .code-block-content {
    margin-top: 0
}

.editor-kit-code-block.code-mobile-block .code-block-content .code-block-zone-container {
    -webkit-overflow-scrolling: auto;
    padding-bottom: 16px
}

.editor-kit-code-block .code-block-content {
    border-radius: 0 0 4px 4px;
    min-height: 53px;
    margin: 24px 20px 0 0;
    font-family: SourceCodeProMac;
    display: flex;
    position: relative;
    overflow-x: visible;
    overflow-y: auto;
    line-height: 22px !important
}

.windows .editor-kit-code-block .code-block-content,
.mobile .editor-kit-code-block .code-block-content {
    font-family: Source Code Pro, Menlo, Monaco, Consolas, Liberation Mono, Courier New, Microsoft Yahei
}

.editor-kit-code-block .code-block-content .code-block-lines-gutter {
    color: var(--text-caption, #646a73);
    flex-direction: column;
    padding-right: 12px;
    display: flex;
    position: -webkit-sticky;
    position: sticky;
    left: 0
}

.editor-kit-code-block .code-block-content .code-block-lines-gutter span {
    text-align: right;
    white-space: nowrap
}

.editor-kit-code-block .code-block-content .text-editor,
.editor-kit-code-block .code-block-content .code-block-zone-container {
    word-wrap: normal;
    word-break: keep-all;
    cursor: text;
    position: static;
    text-align: left !important;
    white-space: pre !important;
    line-height: 22px !important
}

.editor-kit-code-block .code-block-content .text-editor .link-wrapper,
.editor-kit-code-block .code-block-content .code-block-zone-container .link-wrapper {
    white-space: nowrap !important
}

.editor-kit-code-block .code-block-content .text-editor .link[data-link-node] span,
.editor-kit-code-block .code-block-content .code-block-zone-container .link[data-link-node] span {
    white-space: pre;
    word-wrap: normal;
    word-break: normal
}

.editor-kit-code-block .code-block-content .code-block-zone-container {
    scrollbar-width: thin;
    scrollbar-color: transparent transparent;
    outline: none;
    flex: 1;
    margin-left: 57px;
    padding-bottom: 24px;
    overflow: auto
}

.editor-kit-code-block .code-block-content .code-block-zone-container::-webkit-scrollbar {
    height: 7px
}

.editor-kit-code-block .code-block-content .code-block-zone-container::-webkit-scrollbar-track {
    background: 0 0
}

.editor-kit-code-block .code-block-content .code-block-zone-container::-webkit-scrollbar-thumb {
    background: 0 0
}

.editor-kit-code-block .code-block-content .code-block-zone-container:hover {
    scrollbar-color: rgba(var(--N600-raw), .3)var(--N100-FG, #f2f3f5)
}

.editor-kit-code-block .code-block-content .code-block-zone-container:hover::-webkit-scrollbar-thumb {
    background-color: rgba(var(--N600-BG-raw), .3);
    border-radius: 7px
}

.editor-kit-code-block .code-block-content .code-block-zone-container:hover::-webkit-scrollbar-thumb:hover {
    background-color: rgba(var(--N600-BG-raw), .6)
}

.editor-kit-code-block .code-wrap-content .text-editor,
.editor-kit-code-block .code-wrap-content .code-block-zone-container {
    word-break: break-all;
    white-space: pre-wrap !important
}

.editor-kit-code-block .code-wrap-content .text-editor div,
.editor-kit-code-block .code-wrap-content .code-block-zone-container div {
    white-space: break-spaces !important
}

.editor-kit-code-block .code-wrap-content .text-editor .link[data-link-node] span,
.editor-kit-code-block .code-wrap-content .code-block-zone-container .link[data-link-node] span {
    white-space: pre-wrap;
    word-break: break-all
}

.token.operator,
.token.entity,
.token.url,
.language-css .token.string,
.style .token.string {
    color: var(--Y800-FG, #fed37d);
    background: 0 0
}

.editor-kit-code-block .code-block-header-btn {
    white-space: nowrap;
    vertical-align: top;
    border-radius: 4px;
    align-items: center;
    height: 22px;
    padding: 0 4px;
    line-height: 22px;
    transition: none;
    display: flex
}

.editor-kit-code-block .code-block-header-btn span {
    color: var(--text-caption, #646a73);
    text-overflow: ellipsis;
    padding-right: 6px;
    display: block;
    overflow: hidden
}

.editor-kit-code-block .code-block-header-btn path {
    fill: var(--icon-n2, #646a73)
}

@media (hover:none) {
    .editor-kit-code-block .code-block-header-btn.ant-btn-text:hover {
        background: inherit
    }
}

.editor-kit-code-block .code-block-header-btn-con {
    z-index: 2;
    border-radius: 4px;
    justify-content: center;
    align-items: center;
    height: 22px
}

.editor-kit-code-block .code-block-header-btn-con:hover {
    background: rgba(var(--N900-raw), .1)
}

.editor-kit-code-block .code-block-header-btn-con:active {
    background-color: rgba(var(--N900-raw), .2)
}

.editor-kit-code-block .ghost-btn.disabled:hover {
    background: 0 0
}

.editor-kit-code-block .ghost-btn.hover {
    background: rgba(var(--bg-tips-raw), .1)
}

.editor-kit-code-block .code-block-header.disabled .code-block-header-btn-con .code-block-header-btn {
    cursor: default
}

.editor-kit-code-block .code-block-header.disabled .code-block-header-btn-con:hover,
.editor-kit-code-block .code-block-header.disabled .code-block-header-btn-con:active {
    background-color: transparent
}

.editor-kit-code-block .uneditable .code-block-header-btn {
    cursor: inherit
}

.editor-kit-code-block .uneditable .code-block-header-btn-con {
    background: inherit
}

.code-menu.ud__menu-normal {
    background-color: var(--bg-body, #f8f9fa);
    box-shadow: var(--shadow-s4-down, 0px 8px 24px 8px rgba(var(--shadow-default-raw, 31, 35, 41), .04), 0px 6px 12px rgba(var(--shadow-default-raw, 31, 35, 41), .04), 0px 4px 8px -8px rgba(var(--shadow-default-raw, 31, 35, 41), .06));
    color: var(--icon-n1, #2b2f36);
    border-radius: 4px;
    padding: 8px 0;
    transition: none
}

.code-menu.ud__menu-normal .ud__menu-normal-item {
    justify-content: left;
    align-items: center;
    width: 198px;
    height: 32px;
    display: flex
}

.code-menu.ud__menu-normal .ud__menu-normal-item span {
    justify-content: left;
    align-items: center;
    display: flex
}

.code-menu.ud__menu-normal .ud__menu-normal-item span svg {
    margin-right: 5px
}

.code-menu.ud__menu-normal .ud__menu-normal-item span svg path {
    fill: var(--icon-n1, #2b2f36)
}

.code-menu.ud__menu-normal .ud__menu-normal-item:hover {
    background: rgba(var(--bg-tips-raw), .1)
}

.code-menu.ud__menu-normal .ud__menu-normal-item:active {
    background-color: rgba(var(--bg-tips-raw), .2)
}

.code-menu-mobile.ud__menu-normal {
    background-color: var(--bg-body, #f8f9fa);
    box-shadow: 0 4px 8px var(--shadow-default-md, rgba(var(--N900-raw, 235, 235, 235), .1));
    color: var(--N800, #2b2f36);
    border-radius: 4px;
    padding: 8px 0;
    font-size: 14px;
    line-height: 20px;
    transition: none
}

.code-menu-mobile.ud__menu-normal .ud__menu-normal-item {
    height: 50px;
    color: var(--text-title, #1f2329);
    justify-content: left;
    align-items: center;
    padding: 15px 9px;
    display: flex
}

.code-menu-mobile.ud__menu-normal .ud__menu-normal-item span {
    justify-content: left;
    align-items: center;
    display: flex
}

.code-menu-mobile.ud__menu-normal .ud__menu-normal-item span svg {
    margin-right: 3px
}

.code-menu-mobile.ud__menu-normal .ud__menu-normal-item span svg path {
    fill: var(--icon-n1, #2b2f36)
}

.code-menu-mobile.ud__menu-normal .ud__menu-normal-item:hover {
    background: rgba(var(--bg-tips-raw), .1)
}

.code-menu-mobile.ud__menu-normal .ud__menu-normal-item:active {
    background-color: rgba(var(--bg-tips-raw), .2)
}


@layer base {
    .arco-spin {
        display: inline-block
    }

    .arco-spin-block {
        display: block
    }

    .arco-spin-with-tip {
        text-align: center
    }

    .arco-spin-icon {
        color: rgb(var(--primary-6));
        font-size: 20px
    }

    .arco-spin-tip {
        color: rgb(var(--primary-6));
        margin-top: 6px;
        font-size: 14px;
        font-weight: 500
    }

    .arco-spin-loading-layer {
        text-align: center;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none
    }

    .arco-spin-children {
        position: relative
    }

    .arco-spin-children:after {
        content: "";
        background-color: var(--color-spin-layer-bg);
        opacity: 0;
        pointer-events: none;
        z-index: 1;
        width: 100%;
        height: 100%;
        transition: opacity .1s cubic-bezier(0, 0, 1, 1);
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0
    }

    .arco-spin-loading {
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        position: relative
    }

    .arco-spin-loading .arco-spin-loading-layer-inner {
        z-index: 2;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%)
    }

    .arco-spin-loading .arco-spin-children:after {
        opacity: 1;
        pointer-events: auto
    }

    .arco-spin-dot {
        background-color: rgb(var(--primary-6));
        border-radius: var(--border-radius-circle);
        width: 8px;
        height: 8px;
        animation: 2s cubic-bezier(0, 0, 1, 1) infinite forwards arco-dot-loading;
        position: absolute;
        top: 0;
        left: 50%;
        transform: translate(-50%)scale(0)
    }

    .arco-spin-dot:nth-child(2) {
        background-color: rgb(var(--primary-5));
        animation-delay: .4s
    }

    .arco-spin-dot:nth-child(3) {
        background-color: rgb(var(--primary-4));
        animation-delay: .8s
    }

    .arco-spin-dot:nth-child(4) {
        background-color: rgb(var(--primary-4));
        animation-delay: 1.2s
    }

    .arco-spin-dot:nth-child(5) {
        background-color: rgb(var(--primary-2));
        animation-delay: 1.6s
    }

    .arco-spin-dot-list {
        transform-style: preserve-3d;
        perspective: 200px;
        width: 56px;
        height: 8px;
        display: inline-block;
        position: relative
    }

    @keyframes arco-dot-loading {
        0% {
            transform: translate3d(-48.621%, 0, -.985px)scale(.511)
        }

        2.778% {
            transform: translate3d(-95.766%, 0, -.94px)scale(.545)
        }

        5.556% {
            transform: translate3d(-140%, 0, -.866px)scale(.6)
        }

        8.333% {
            transform: translate3d(-179.981%, 0, -.766px)scale(.675)
        }

        11.111% {
            transform: translate3d(-214.492%, 0, -.643px)scale(.768)
        }

        13.889% {
            transform: translate3d(-242.487%, 0, -.5px)scale(.875)
        }

        16.667% {
            transform: translate3d(-263.114%, 0, -.342px)scale(.993)
        }

        19.444% {
            transform: translate3d(-275.746%, 0, -.174px)scale(1.12)
        }

        22.222% {
            transform: translate(-280%)scale(1.25)
        }

        25% {
            transform: translate3d(-275.746%, 0, .174px)scale(1.38)
        }

        27.778% {
            transform: translate3d(-263.114%, 0, .342px)scale(1.507)
        }

        30.556% {
            transform: translate3d(-242.487%, 0, .5px)scale(1.625)
        }

        33.333% {
            transform: translate3d(-214.492%, 0, .643px)scale(1.732)
        }

        36.111% {
            transform: translate3d(-179.981%, 0, .766px)scale(1.825)
        }

        38.889% {
            transform: translate3d(-140%, 0, .866px)scale(1.9)
        }

        41.667% {
            transform: translate3d(-95.766%, 0, .94px)scale(1.955)
        }

        44.444% {
            transform: translate3d(-48.621%, 0, .985px)scale(1.989)
        }

        47.222% {
            transform: translateZ(1px)scale(2)
        }

        50% {
            transform: translate3d(48.621%, 0, .985px)scale(1.989)
        }

        52.778% {
            transform: translate3d(95.766%, 0, .94px)scale(1.955)
        }

        55.556% {
            transform: translate3d(140%, 0, .866px)scale(1.9)
        }

        58.333% {
            transform: translate3d(179.981%, 0, .766px)scale(1.825)
        }

        61.111% {
            transform: translate3d(214.492%, 0, .643px)scale(1.732)
        }

        63.889% {
            transform: translate3d(242.487%, 0, .5px)scale(1.625)
        }

        66.667% {
            transform: translate3d(263.114%, 0, .342px)scale(1.507)
        }

        69.444% {
            transform: translate3d(275.746%, 0, .174px)scale(1.38)
        }

        72.222% {
            transform: translate(280%)scale(1.25)
        }

        75% {
            transform: translate3d(275.746%, 0, -.174px)scale(1.12)
        }

        77.778% {
            transform: translate3d(263.114%, 0, -.342px)scale(.993)
        }

        80.556% {
            transform: translate3d(242.487%, 0, -.5px)scale(.875)
        }

        83.333% {
            transform: translate3d(214.492%, 0, -.643px)scale(.768)
        }

        86.111% {
            transform: translate3d(179.981%, 0, -.766px)scale(.675)
        }

        88.889% {
            transform: translate3d(140%, 0, -.866px)scale(.6)
        }

        91.667% {
            transform: translate3d(95.766%, 0, -.94px)scale(.545)
        }

        94.444% {
            transform: translate3d(48.621%, 0, -.985px)scale(.511)
        }

        97.222% {
            transform: translateZ(-1px)scale(.5)
        }
    }
}


@layer base {
    .arco-progress {
        font-size: 12px;
        line-height: 1;
        position: relative
    }

    .arco-progress-line,
    .arco-progress-steps {
        width: 100%;
        max-width: 100%;
        display: inline-block
    }

    .arco-progress-line-wrapper,
    .arco-progress-steps-wrapper {
        align-items: center;
        width: 100%;
        max-width: 100%;
        height: 100%;
        display: flex
    }

    .arco-progress-line-text,
    .arco-progress-steps-text {
        color: var(--color-text-2);
        white-space: nowrap;
        text-align: right;
        flex-grow: 1;
        flex-shrink: 0;
        min-width: 32px;
        margin-left: 16px;
        font-size: 12px
    }

    .arco-progress-line-text .arco-icon,
    .arco-progress-steps-text .arco-icon {
        margin-left: 4px;
        font-size: 12px
    }

    .arco-progress-line-outer {
        background-color: var(--color-fill-3);
        border-radius: 100px;
        width: 100%;
        display: inline-block;
        position: relative;
        overflow: hidden
    }

    .arco-progress-line-inner {
        background-color: rgb(var(--primary-6));
        border-radius: 100px;
        max-width: 100%;
        height: 100%;
        transition: width .6s cubic-bezier(.34, .69, .1, 1), background .3s cubic-bezier(.34, .69, .1, 1);
        position: relative
    }

    .arco-progress-line-inner-buffer {
        background-color: var(--color-primary-light-3);
        border-radius: 0 100px 100px 0;
        max-width: 100%;
        height: 100%;
        transition: all .6s cubic-bezier(.34, .69, .1, 1);
        position: absolute;
        top: 0;
        left: 0
    }

    .arco-progress-line-inner-animate:after {
        content: "";
        border-radius: inherit;
        background: linear-gradient(90deg, transparent 25%, rgba(255, 255, 255, .5) 50%, transparent 75%) 0 0/400% 100%;
        width: 100%;
        height: 100%;
        animation: 1.5s cubic-bezier(.34, .69, .1, 1) infinite arco-progress-loading;
        display: block;
        position: absolute;
        top: 0
    }

    .arco-progress-line-text .arco-icon {
        color: var(--color-text-2)
    }

    .arco-progress-steps-outer {
        width: 100%;
        display: flex
    }

    .arco-progress-steps-text {
        min-width: unset;
        margin-left: 8px
    }

    .arco-progress-steps-text .arco-icon {
        color: var(--color-text-2)
    }

    .arco-progress-steps-item {
        background-color: var(--color-fill-3);
        flex: 1;
        height: 100%;
        display: inline-block;
        position: relative
    }

    .arco-progress-steps-item:not(:last-of-type) {
        margin-right: 3px
    }

    .arco-progress-steps-item:last-of-type {
        border-top-right-radius: 100px;
        border-bottom-right-radius: 100px
    }

    .arco-progress-steps-item:first-of-type {
        border-top-left-radius: 100px;
        border-bottom-left-radius: 100px
    }

    .arco-progress-steps-item-active {
        background-color: rgb(var(--primary-6))
    }

    .arco-progress-steps.arco-progress-small {
        width: auto
    }

    .arco-progress-steps.arco-progress-small .arco-progress-steps-item {
        flex: unset;
        border-radius: 2px;
        width: 2px
    }

    .arco-progress-steps.arco-progress-small .arco-progress-steps-item:not(:last-of-type) {
        margin-right: 3px
    }

    .arco-progress-is-warning .arco-progress-line-inner,
    .arco-progress-is-warning .arco-progress-steps-item-active {
        background-color: rgb(var(--warning-6))
    }

    .arco-progress-is-warning .arco-progress-line-text .arco-icon,
    .arco-progress-is-warning .arco-progress-steps-text .arco-icon {
        color: rgb(var(--warning-6))
    }

    .arco-progress-is-success .arco-progress-line-inner,
    .arco-progress-is-success .arco-progress-steps-item-active {
        background-color: rgb(var(--success-6))
    }

    .arco-progress-is-success .arco-progress-line-text .arco-icon,
    .arco-progress-is-success .arco-progress-steps-text .arco-icon {
        color: rgb(var(--success-6))
    }

    .arco-progress-is-error .arco-progress-line-inner,
    .arco-progress-is-error .arco-progress-steps-item-active {
        background-color: rgb(var(--danger-6))
    }

    .arco-progress-is-error .arco-progress-line-text .arco-icon,
    .arco-progress-is-error .arco-progress-steps-text .arco-icon {
        color: rgb(var(--danger-6))
    }

    .arco-progress-small .arco-progress-line-text {
        margin-left: 16px;
        font-size: 12px
    }

    .arco-progress-small .arco-progress-line-text .arco-icon {
        font-size: 12px
    }

    .arco-progress-large .arco-progress-line-text {
        margin-left: 16px;
        font-size: 16px
    }

    .arco-progress-large .arco-progress-line-text .arco-icon {
        font-size: 14px
    }

    .arco-progress-circle {
        display: inline-block
    }

    .arco-progress-circle-wrapper {
        text-align: center;
        vertical-align: text-bottom;
        line-height: 1;
        display: inline-block;
        position: relative
    }

    .arco-progress-circle-svg {
        transform: rotate(-90deg)
    }

    .arco-progress-circle-text {
        font-size: 14px
    }

    .arco-progress-circle-text .arco-icon {
        color: var(--color-text-2);
        font-size: 16px
    }

    .arco-progress-circle .arco-progress-circle-text {
        color: var(--color-text-3);
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%)
    }

    .arco-progress-circle-mask {
        stroke: var(--color-fill-3)
    }

    .arco-progress-circle-path {
        stroke: rgb(var(--primary-6));
        transition: stroke-dashoffset .6s cubic-bezier(0, 0, 1, 1), stroke .6s cubic-bezier(0, 0, 1, 1)
    }

    .arco-progress-mini .arco-progress-circle-mask {
        stroke: var(--color-primary-light-3)
    }

    .arco-progress-mini .arco-progress-circle-path {
        stroke: rgb(var(--primary-6))
    }

    .arco-progress-mini.arco-progress-is-warning .arco-progress-circle-mask {
        stroke: var(--color-warning-light-3)
    }

    .arco-progress-mini.arco-progress-is-error .arco-progress-circle-mask {
        stroke: var(--color-danger-light-3)
    }

    .arco-progress-mini.arco-progress-is-success .arco-progress-circle-mask {
        stroke: var(--color-success-light-3)
    }

    .arco-progress-mini.arco-progress-is-success .arco-progress-circle-wrapper .arco-icon-check {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%)translateY(-50%)
    }

    .arco-progress-mini .arco-progress-circle-text {
        top: unset;
        left: unset;
        transform: unset;
        position: static
    }

    .arco-progress-small .arco-progress-circle-text {
        font-size: 13px
    }

    .arco-progress-small .arco-progress-circle-text .arco-icon {
        font-size: 14px
    }

    .arco-progress-large .arco-progress-circle-text,
    .arco-progress-large .arco-progress-circle-text .arco-icon {
        font-size: 16px
    }

    .arco-progress-is-warning .arco-progress-circle-path {
        stroke: rgb(var(--warning-6))
    }

    .arco-progress-is-warning .arco-icon {
        color: rgb(var(--warning-6))
    }

    .arco-progress-is-success .arco-progress-circle-path {
        stroke: rgb(var(--success-6))
    }

    .arco-progress-is-success .arco-icon {
        color: rgb(var(--success-6))
    }

    .arco-progress-is-error .arco-progress-circle-path {
        stroke: rgb(var(--danger-6))
    }

    .arco-progress-is-error .arco-icon {
        color: rgb(var(--danger-6))
    }

    @keyframes arco-progress-loading {
        0% {
            background-position: 100%
        }

        to {
            background-position: 0
        }
    }

    .arco-progress-rtl .arco-progress-line-text,
    .arco-progress-rtl .arco-progress-steps-text {
        margin-left: 0;
        margin-right: 16px
    }

    .arco-progress-rtl .arco-progress-line-text .arco-icon,
    .arco-progress-rtl .arco-progress-steps-text .arco-icon {
        margin-left: 0;
        margin-right: 4px
    }

    .arco-progress-rtl .arco-progress-steps-text {
        margin-left: 0;
        margin-right: 8px
    }

    .arco-progress-rtl .arco-progress-steps-item:not(:last-of-type),
    .arco-progress-rtl.arco-progress-steps.arco-progress-small .arco-progress-steps-item:not(:last-of-type) {
        margin-left: 3px;
        margin-right: 0
    }

    .arco-progress-rtl.arco-progress-small .arco-progress-line-text,
    .arco-progress-rtl.arco-progress-large .arco-progress-line-text {
        margin-left: 0;
        margin-right: 16px
    }

    .arco-progress-rtl.arco-progress-line .arco-progress-line-inner-buffer {
        left: initial;
        right: 0
    }
}


@layer base {
    .arco-image-trigger {
        background: var(--color-bg-5);
        border: 1px solid var(--color-neutral-3);
        border-radius: 4px;
        padding: 6px 4px
    }

    .arco-image-trigger .arco-trigger-arrow {
        border: 1px solid var(--color-neutral-3);
        background-color: var(--color-bg-5)
    }

    .arco-image {
        border-radius: var(--border-radius-small);
        vertical-align: middle;
        display: inline-block;
        position: relative
    }

    .arco-image-img {
        vertical-align: middle;
        border-radius: inherit
    }

    .arco-image-img:focus-visible {
        box-shadow: 0 0 0 2px rgb(var(--primary-6))
    }

    .arco-image-overlay {
        width: 100%;
        height: 100%;
        position: absolute;
        top: 0;
        left: 0
    }

    .arco-image-footer {
        width: 100%;
        max-width: 100%;
        display: flex
    }

    .arco-image-footer-block {
        flex: auto
    }

    .arco-image-caption-title {
        font-size: 16px;
        font-weight: 500
    }

    .arco-image-caption-description {
        font-size: 14px
    }

    .arco-image-actions {
        padding-left: 12px
    }

    .arco-image-actions-list {
        justify-content: flex-end;
        align-items: center;
        display: flex
    }

    .arco-image-actions-item {
        border-radius: var(--border-radius-small);
        cursor: pointer;
        margin-left: 12px;
        padding: 0;
        font-size: 14px;
        line-height: 1
    }

    .arco-image-actions-item:first-child {
        margin-left: 0
    }

    .arco-image-actions-item-trigger {
        padding: 5px 4px;
        display: inline-block
    }

    .arco-image-with-footer-inner .arco-image-footer {
        color: var(--color-white);
        box-sizing: border-box;
        border-bottom-right-radius: inherit;
        border-bottom-left-radius: inherit;
        background: linear-gradient(360deg, rgba(0, 0, 0, .3) 0%, transparent 100%);
        align-items: center;
        padding: 9px 16px;
        position: absolute;
        bottom: 0;
        left: 0
    }

    .arco-image-with-footer-inner .arco-image-caption-title,
    .arco-image-with-footer-inner .arco-image-caption-description {
        color: var(--color-white)
    }

    .arco-image-with-footer-inner .arco-image-actions-item:hover {
        background: rgba(0, 0, 0, .5)
    }

    .arco-image-with-footer-outer .arco-image-footer {
        color: var(--color-neutral-8);
        margin-top: 4px
    }

    .arco-image-with-footer-outer .arco-image-caption-title {
        color: var(--color-text-1)
    }

    .arco-image-with-footer-outer .arco-image-caption-description {
        color: var(--color-neutral-6)
    }

    .arco-image-with-footer-outer .arco-image-actions-item:hover {
        background: var(--color-neutral-2)
    }

    .arco-image-with-preview:hover {
        cursor: zoom-in
    }

    .arco-image-error {
        background-color: var(--color-neutral-1);
        width: 100%;
        height: 100%;
        color: var(--color-neutral-4);
        box-sizing: border-box;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        display: flex
    }

    .arco-image-error-icon {
        width: 60px;
        max-width: 100%;
        height: 60px;
        max-height: 100%
    }

    .arco-image-error-icon>svg {
        width: 100%;
        height: 100%
    }

    .arco-image-error-alt {
        text-align: center;
        padding: 8px 16px;
        font-size: 12px;
        line-height: 1.6667
    }

    .arco-image-loader {
        background-color: var(--color-neutral-1);
        width: 100%;
        height: 100%;
        position: absolute;
        top: 0;
        left: 0
    }

    .arco-image-loader-spin {
        color: rgb(var(--primary-6));
        text-align: center;
        font-size: 32px;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%)
    }

    .arco-image-loader-spin-text {
        color: var(--color-neutral-6);
        font-size: 16px
    }

    .arco-image-simple.arco-image-with-footer-inner .arco-image-footer {
        padding: 12px 16px
    }

    .arco-image-before-load .arco-image-img,
    .arco-image-loading .arco-image-img,
    .arco-image-loading-error .arco-image-img {
        visibility: hidden
    }

    .arco-image-trigger .arco-image-actions-list {
        flex-direction: column
    }

    .arco-image-trigger .arco-image-actions-item {
        color: var(--color-neutral-8);
        margin-left: 0
    }

    .arco-image-trigger .arco-image-actions-item:hover {
        background: var(--color-neutral-2)
    }

    .arco-image-preview {
        z-index: 1001;
        width: 100%;
        height: 100%;
        position: fixed;
        top: 0;
        left: 0
    }

    .arco-image-preview-hide {
        display: none
    }

    .arco-image-preview-mask,
    .arco-image-preview-wrapper {
        width: 100%;
        height: 100%;
        position: absolute;
        top: 0;
        left: 0
    }

    .arco-image-preview-mask {
        background-color: var(--color-mask-bg)
    }

    .arco-image-preview-img-container {
        text-align: center;
        width: 100%;
        height: 100%
    }

    .arco-image-preview-img-container:before {
        content: "";
        vertical-align: middle;
        width: 0;
        height: 100%;
        display: inline-block
    }

    .arco-image-preview-img-container .arco-image-preview-img {
        vertical-align: middle;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        cursor: grab;
        max-width: 100%;
        max-height: 100%;
        display: inline-block
    }

    .arco-image-preview-img-container .arco-image-preview-img.arco-image-preview-img-moving {
        cursor: grabbing
    }

    .arco-image-preview-scale-value {
        box-sizing: border-box;
        color: var(--color-white);
        font-size: 12px;
        line-height: initial;
        background-color: rgba(255, 255, 255, .08);
        padding: 7px 10px;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%)
    }

    .arco-image-preview-toolbar {
        background-color: var(--color-bg-2);
        border-radius: var(--border-radius-medium);
        align-items: flex-start;
        padding: 4px 16px;
        display: flex;
        position: absolute;
        bottom: 46px;
        left: 50%;
        transform: translate(-50%)
    }

    .arco-image-preview-toolbar-action {
        color: var(--color-neutral-8);
        border-radius: var(--border-radius-small);
        cursor: pointer;
        background-color: transparent;
        align-items: center;
        font-size: 14px;
        display: flex
    }

    .arco-image-preview-toolbar-action:not(:last-of-type) {
        margin-right: 0
    }

    .arco-image-preview-toolbar-action:hover {
        background-color: var(--color-neutral-2);
        color: rgb(var(--primary-6))
    }

    .arco-image-preview-toolbar-action-disabled,
    .arco-image-preview-toolbar-action-disabled:hover {
        color: var(--color-text-4);
        cursor: not-allowed;
        background-color: transparent
    }

    .arco-image-preview-toolbar-action-name {
        padding-right: 12px;
        font-size: 12px
    }

    .arco-image-preview-toolbar-action-content {
        padding: 13px;
        line-height: 1
    }

    .arco-image-preview-toolbar-simple {
        padding: 4px
    }

    .arco-image-preview-toolbar-simple .arco-image-preview-toolbar-action {
        margin-right: 0
    }

    .arco-image-preview-trigger.arco-image-trigger {
        padding: 12px 16px
    }

    .arco-image-preview-trigger.arco-image-trigger .arco-image-preview-toolbar-action {
        text-align: left;
        margin-right: 0
    }

    .arco-image-preview-trigger.arco-image-trigger .arco-image-preview-toolbar-action:not(:last-of-type) {
        margin-bottom: 0
    }

    .arco-image-preview-loading {
        color: rgb(var(--primary-6));
        border-radius: var(--border-radius-medium);
        box-sizing: border-box;
        background-color: #232324;
        justify-content: center;
        align-items: center;
        width: 48px;
        height: 48px;
        padding: 10px;
        font-size: 18px;
        display: flex;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%)
    }

    .arco-image-preview-close-btn {
        width: 32px;
        height: 32px;
        color: var(--color-white);
        text-align: center;
        cursor: pointer;
        background: rgba(0, 0, 0, .5);
        border-radius: 50%;
        font-size: 14px;
        line-height: 32px;
        position: absolute;
        top: 36px;
        right: 36px
    }

    .arco-image-preview-arrow-left,
    .arco-image-preview-arrow-right {
        width: 32px;
        height: 32px;
        color: var(--color-white);
        cursor: pointer;
        z-index: 2;
        background-color: rgba(255, 255, 255, .3);
        border-radius: 50%;
        justify-content: center;
        align-items: center;
        display: flex;
        position: absolute
    }

    .arco-image-preview-arrow-left>svg,
    .arco-image-preview-arrow-right>svg {
        color: var(--color-white);
        font-size: 16px
    }

    .arco-image-preview-arrow-left:hover,
    .arco-image-preview-arrow-right:hover {
        background-color: rgba(255, 255, 255, .5)
    }

    .arco-image-preview-arrow-left {
        top: 50%;
        left: 20px;
        transform: translateY(-50%)
    }

    .arco-image-preview-arrow-right {
        top: 50%;
        right: 20px;
        transform: translateY(-50%)
    }

    .arco-image-preview-arrow-disabled {
        cursor: not-allowed;
        color: rgba(255, 255, 255, .3);
        background-color: rgba(255, 255, 255, .2)
    }

    .arco-image-preview-arrow-disabled>svg {
        color: rgba(255, 255, 255, .3)
    }

    .arco-image-preview-arrow-disabled:hover {
        background-color: rgba(255, 255, 255, .2)
    }

    .fadeImage-enter,
    .fadeImage-appear {
        opacity: 0
    }

    .fadeImage-enter-active,
    .fadeImage-appear-active {
        opacity: 1;
        transition: opacity .4s cubic-bezier(.3, 1.3, .3, 1)
    }

    .fadeImage-exit {
        opacity: 1
    }

    .fadeImage-exit-active {
        opacity: 0;
        transition: opacity .4s cubic-bezier(.3, 1.3, .3, 1)
    }

    .arco-image-rtl {
        direction: rtl
    }

    .arco-image-rtl .arco-image-actions-item {
        margin-left: 0;
        margin-right: 12px
    }

    .arco-image-rtl .arco-image-actions-item:first-child {
        margin-right: 0
    }
}


@layer base {
    .arco-modal-mask {
        z-index: 1001;
        background-color: var(--color-mask-bg);
        width: 100%;
        height: 100%;
        display: none;
        position: fixed;
        top: 0;
        left: 0
    }

    .arco-modal-wrapper {
        z-index: 1001;
        width: 100%;
        height: 100%;
        position: fixed;
        top: 0;
        left: 0;
        overflow: auto
    }

    .arco-modal-wrapper-no-mask {
        pointer-events: none
    }

    .arco-modal-wrapper-no-mask .arco-modal {
        pointer-events: auto
    }

    .arco-modal-wrapper.arco-modal-wrapper-align-center {
        text-align: center;
        white-space: nowrap
    }

    .arco-modal-wrapper.arco-modal-wrapper-align-center:after {
        content: "";
        vertical-align: middle;
        width: 0;
        height: 100%;
        display: inline-block
    }

    .arco-modal-wrapper.arco-modal-wrapper-align-center .arco-modal {
        vertical-align: middle;
        display: inline-block;
        top: 0
    }

    .arco-modal {
        border-radius: var(--border-radius-medium);
        border: 0 solid var(--color-neutral-3);
        background-color: var(--color-bg-3);
        text-align: left;
        width: 520px;
        white-space: initial;
        box-shadow: none;
        box-sizing: border-box;
        margin: 0 auto;
        line-height: 1.5715;
        position: relative;
        top: 100px
    }

    .arco-modal-header {
        box-sizing: border-box;
        border-bottom: 1px solid var(--color-neutral-3);
        align-items: center;
        width: 100%;
        height: 48px;
        padding: 0 20px;
        display: flex
    }

    .arco-modal-header .arco-modal-title {
        text-align: center;
        flex: 1
    }

    .arco-modal-content {
        color: var(--color-text-1);
        padding: 24px 20px;
        font-size: 14px;
        position: relative
    }

    .arco-modal-footer {
        border-top: 1px solid var(--color-neutral-3);
        box-sizing: border-box;
        text-align: right;
        width: 100%;
        padding: 16px 20px
    }

    .arco-modal-footer>.arco-btn {
        margin-left: 12px
    }

    .arco-modal-footer>.arco-btn:only-child {
        margin-left: 0
    }

    .arco-modal .arco-modal-close-icon {
        cursor: pointer;
        color: var(--color-text-1);
        font-size: 12px;
        position: absolute;
        top: 18px;
        right: 20px
    }

    .arco-modal-title {
        color: var(--color-text-1);
        font-size: 16px;
        font-weight: 500
    }

    .arco-modal-title .arco-icon {
        vertical-align: -3px;
        margin-right: 10px;
        font-size: 18px
    }

    .arco-modal-title .arco-icon-info-circle-fill {
        color: rgb(var(--primary-6))
    }

    .arco-modal-title .arco-icon-check-circle-fill {
        color: rgb(var(--success-6))
    }

    .arco-modal-title .arco-icon-exclamation-circle-fill {
        color: rgb(var(--warning-6))
    }

    .arco-modal-title .arco-icon-close-circle-fill {
        color: rgb(var(--danger-6))
    }

    .arco-modal-simple {
        width: 464px;
        padding: 24px 32px 32px
    }

    .arco-modal-simple .arco-modal-header,
    .arco-modal-simple .arco-modal-footer {
        height: unset;
        border: none;
        padding: 0
    }

    .arco-modal-simple .arco-modal-header {
        margin-bottom: 24px
    }

    .arco-modal-simple .arco-modal-title {
        text-align: center
    }

    .arco-modal-simple .arco-modal-footer {
        text-align: center;
        margin-top: 32px
    }

    .arco-modal-simple .arco-modal-content {
        padding: 0
    }

    .zoomModal-enter,
    .zoomModal-appear {
        opacity: 0;
        transform: scale(.5)
    }

    .zoomModal-enter-active,
    .zoomModal-appear-active {
        opacity: 1;
        transition: opacity .4s cubic-bezier(.3, 1.3, .3, 1), transform .4s cubic-bezier(.3, 1.3, .3, 1);
        transform: scale(1)
    }

    .zoomModal-exit {
        opacity: 1;
        transform: scale(1)
    }

    .zoomModal-exit-active {
        opacity: 0;
        transition: opacity .4s cubic-bezier(.3, 1.3, .3, 1), transform .4s cubic-bezier(.3, 1.3, .3, 1);
        transform: scale(.5)
    }

    .fadeModal-enter,
    .fadeModal-appear {
        opacity: 0
    }

    .fadeModal-enter-active,
    .fadeModal-appear-active {
        opacity: 1;
        transition: opacity .4s cubic-bezier(.3, 1.3, .3, 1)
    }

    .fadeModal-exit {
        opacity: 1
    }

    .fadeModal-exit-active {
        opacity: 0;
        transition: opacity .4s cubic-bezier(.3, 1.3, .3, 1)
    }

    .arco-modal-rtl {
        direction: rtl
    }

    .arco-modal-rtl .arco-modal-footer {
        text-align: unset
    }

    .arco-modal-rtl .arco-modal-footer>.arco-btn {
        margin-left: 0;
        margin-right: 12px
    }

    .arco-modal-rtl .arco-modal-footer>.arco-btn:only-child {
        margin-right: 0
    }

    .arco-modal-rtl .arco-modal-title .arco-icon {
        margin-left: 10px;
        margin-right: 0
    }

    .arco-modal-rtl .arco-modal-close-icon {
        right: initial;
        left: 20px
    }

    .arco-modal-rtl.arco-modal-simple .arco-modal-footer {
        text-align: center
    }
}


@layer base {

    .switchSlideText-enter,
    .switchSlideText-appear {
        left: -100% !important
    }

    .switchSlideText-enter-active,
    .switchSlideText-appear-active {
        transition: left .2s cubic-bezier(.34, .69, .1, 1);
        left: 8px !important
    }

    .switchSlideText-exit {
        left: 100% !important
    }

    .switchSlideText-exit-active {
        transition: left .2s cubic-bezier(.34, .69, .1, 1);
        left: 26px !important
    }

    .arco-switch {
        background-color: var(--color-fill-4);
        cursor: pointer;
        box-sizing: border-box;
        vertical-align: middle;
        border: none;
        border-radius: 12px;
        outline: none;
        min-width: 40px;
        height: 24px;
        padding: 0;
        line-height: 24px;
        transition: background-color .2s cubic-bezier(.34, .69, .1, 1);
        position: relative;
        overflow: hidden
    }

    .arco-switch-type-round:focus-visible {
        box-shadow: 0 0 0 2px rgb(var(--gray-6))
    }

    .arco-switch-type-circle:focus-visible {
        box-shadow: 0 0 0 2px rgb(var(--gray-6))
    }

    .arco-switch-type-round.arco-switch-checked:focus-visible {
        box-shadow: 0 0 0 2px var(--color-primary-light-3)
    }

    .arco-switch-type-circle.arco-switch-checked:focus-visible {
        box-shadow: 0 0 0 2px var(--color-primary-light-3)
    }

    .arco-switch-type-line:focus-visible .arco-switch-dot {
        box-shadow: 0 0 0 2px rgb(var(--gray-6));
        transition: none
    }

    .arco-switch-type-line.arco-switch-checked:focus-visible .arco-switch-dot {
        box-shadow: 0 0 0 2px var(--color-primary-light-3)
    }

    .arco-switch-dot {
        background-color: var(--color-bg-white);
        width: 16px;
        height: 16px;
        color: var(--color-neutral-3);
        border-radius: 50%;
        justify-content: center;
        align-items: center;
        font-size: 12px;
        transition: all .2s cubic-bezier(.34, .69, .1, 1);
        display: flex;
        position: absolute;
        top: 4px;
        left: 4px
    }

    .arco-switch-checked {
        background-color: rgb(var(--primary-6))
    }

    .arco-switch-checked .arco-switch-dot {
        color: rgb(var(--primary-6));
        left: calc(100% - 20px)
    }

    .arco-switch[disabled] .arco-switch-dot {
        color: var(--color-fill-2)
    }

    .arco-switch[disabled].arco-switch-checked .arco-switch-dot {
        color: var(--color-primary-light-3)
    }

    .arco-switch-text-holder {
        opacity: 0;
        margin: 0 8px 0 26px;
        font-size: 12px
    }

    .arco-switch-text {
        color: var(--color-white);
        font-size: 12px;
        position: absolute;
        top: 0;
        left: 26px
    }

    .arco-switch-checked .arco-switch-text-holder {
        margin: 0 26px 0 8px
    }

    .arco-switch-checked .arco-switch-text {
        color: var(--color-white);
        left: 8px
    }

    .arco-switch[disabled] {
        cursor: not-allowed;
        background-color: var(--color-fill-2)
    }

    .arco-switch[disabled] .arco-switch-text {
        color: var(--color-white)
    }

    .arco-switch[disabled].arco-switch-checked {
        background-color: var(--color-primary-light-3)
    }

    .arco-switch[disabled].arco-switch-checked .arco-switch-text {
        color: var(--color-white)
    }

    .arco-switch-loading {
        background-color: var(--color-fill-2)
    }

    .arco-switch-loading .arco-switch-dot {
        color: var(--color-neutral-3)
    }

    .arco-switch-loading .arco-switch-text {
        color: var(--color-white)
    }

    .arco-switch-loading.arco-switch-checked {
        background-color: var(--color-primary-light-3)
    }

    .arco-switch-loading.arco-switch-checked .arco-switch-dot {
        color: var(--color-primary-light-3)
    }

    .arco-switch-loading.arco-switch-checked .arco-switch-text {
        color: var(--color-primary-light-1)
    }

    .arco-switch-small {
        min-width: 28px;
        height: 16px;
        line-height: 16px
    }

    .arco-switch-small.arco-switch-checked {
        padding-left: -2px
    }

    .arco-switch-small .arco-switch-dot {
        border-radius: 8px;
        width: 12px;
        height: 12px;
        top: 2px;
        left: 2px
    }

    .arco-switch-small .arco-switch-dot-icon {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%)scale(.66667)
    }

    .arco-switch-small.arco-switch-checked .arco-switch-dot {
        left: calc(100% - 14px)
    }

    .arco-switch-type-round {
        border-radius: var(--border-radius-small);
        min-width: 40px
    }

    .arco-switch-type-round .arco-switch-dot {
        border-radius: 2px
    }

    .arco-switch-type-round.arco-switch-small {
        border-radius: 2px;
        min-width: 28px;
        height: 16px;
        line-height: 16px
    }

    .arco-switch-type-round.arco-switch-small .arco-switch-dot {
        border-radius: 1px
    }

    .arco-switch-type-line {
        min-width: 36px;
        overflow: unset;
        background-color: transparent
    }

    .arco-switch-type-line:after {
        content: "";
        background-color: var(--color-fill-4);
        border-radius: 3px;
        width: 100%;
        height: 6px;
        transition: background-color .2s cubic-bezier(.34, .69, .1, 1);
        display: block
    }

    .arco-switch-type-line .arco-switch-dot {
        background-color: var(--color-bg-white);
        width: 20px;
        height: 20px;
        box-shadow: 0 1px 3px var(--color-neutral-6);
        border-radius: 10px;
        top: 2px;
        left: 0
    }

    .arco-switch-type-line.arco-switch-checked {
        background-color: transparent
    }

    .arco-switch-type-line.arco-switch-checked:after {
        background-color: rgb(var(--primary-6))
    }

    .arco-switch-type-line.arco-switch-checked .arco-switch-dot {
        left: calc(100% - 20px)
    }

    .arco-switch-type-line[disabled] {
        cursor: not-allowed;
        background-color: transparent
    }

    .arco-switch-type-line[disabled]:after {
        background-color: var(--color-fill-2)
    }

    .arco-switch-type-line[disabled].arco-switch-checked {
        background-color: transparent
    }

    .arco-switch-type-line[disabled].arco-switch-checked:after {
        background-color: var(--color-primary-light-3)
    }

    .arco-switch-type-line.arco-switch-loading {
        background-color: transparent
    }

    .arco-switch-type-line.arco-switch-loading:after {
        background-color: var(--color-fill-2)
    }

    .arco-switch-type-line.arco-switch-loading.arco-switch-checked {
        background-color: transparent
    }

    .arco-switch-type-line.arco-switch-loading.arco-switch-checked:after {
        background-color: var(--color-primary-light-3)
    }

    .arco-switch-type-line.arco-switch-small {
        min-width: 28px;
        height: 16px;
        line-height: 16px
    }

    .arco-switch-type-line.arco-switch-small.arco-switch-checked {
        padding-left: 0
    }

    .arco-switch-type-line.arco-switch-small .arco-switch-dot {
        border-radius: 8px;
        width: 16px;
        height: 16px;
        top: 0
    }

    .arco-switch-type-line.arco-switch-small .arco-switch-dot-icon {
        transform: translate(-50%, -50%)scale(1)
    }

    .arco-switch-type-line.arco-switch-small.arco-switch-checked .arco-switch-dot {
        left: calc(100% - 16px)
    }

    .arco-switch-rtl {
        direction: rtl
    }

    .arco-switch-rtl .switchSlideText-enter,
    .arco-switch-rtl .switchSlideText-appear {
        left: initial;
        right: -100% !important
    }

    .arco-switch-rtl .switchSlideText-enter-active,
    .arco-switch-rtl .switchSlideText-appear-active {
        left: initial;
        transition: right .2s cubic-bezier(.34, .69, .1, 1);
        right: 8px !important
    }

    .arco-switch-rtl .switchSlideText-exit {
        left: initial;
        right: 100% !important
    }

    .arco-switch-rtl .switchSlideText-exit-active {
        left: initial;
        transition: right .2s cubic-bezier(.34, .69, .1, 1);
        right: 26px !important
    }

    .arco-switch-rtl .arco-switch-dot {
        left: initial;
        right: 4px
    }

    .arco-switch-rtl .arco-switch-text-holder {
        margin: 0 26px 0 8px
    }

    .arco-switch-rtl .arco-switch-text {
        left: initial;
        right: 26px
    }

    .arco-switch-rtl.arco-switch-small .arco-switch-dot {
        right: 2px
    }

    .arco-switch-rtl.arco-switch-type-line .arco-switch-dot {
        right: 0
    }

    .arco-switch-rtl.arco-switch-checked .arco-switch-dot {
        right: calc(100% - 20px)
    }

    .arco-switch-rtl.arco-switch-checked .arco-switch-text-holder {
        margin: 0 8px 0 26px
    }

    .arco-switch-rtl.arco-switch-checked .arco-switch-text {
        right: 8px;
        left: initial
    }

    .arco-switch-rtl.arco-switch-checked.arco-switch-small {
        padding-left: 0;
        padding-right: -2px
    }

    .arco-switch-rtl.arco-switch-checked.arco-switch-small.arco-switch-type-line {
        padding-left: 0;
        padding-right: 0
    }

    .arco-switch-rtl.arco-switch-checked.arco-switch-small .arco-switch-dot {
        left: initial;
        right: calc(100% - 14px)
    }
}


@layer base {
    .arco-input-number {
        box-sizing: border-box;
        border-radius: var(--border-radius-small);
        width: 100%;
        display: inline-block;
        position: relative
    }

    .arco-input-number-step-button {
        box-sizing: border-box;
        border-color: var(--color-neutral-3);
        background-color: var(--color-fill-2);
        color: var(--color-text-2);
        cursor: pointer;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        justify-content: center;
        align-items: center;
        transition: all .1s cubic-bezier(0, 0, 1, 1);
        display: flex
    }

    .arco-input-number-step-button:hover {
        border-color: var(--color-fill-3);
        background-color: var(--color-fill-3)
    }

    .arco-input-number-step-button:active {
        border-color: var(--color-fill-4);
        background-color: var(--color-fill-4)
    }

    .arco-input-number-step-button-disabled {
        cursor: not-allowed;
        background-color: var(--color-fill-2);
        color: var(--color-text-4)
    }

    .arco-input-number-step-button-disabled:hover,
    .arco-input-number-step-button-disabled:active {
        border-color: var(--color-neutral-3);
        background-color: var(--color-fill-2)
    }

    .arco-input-number-prefix,
    .arco-input-number-suffix {
        transition: all .1s cubic-bezier(0, 0, 1, 1)
    }

    .arco-input-number-mode-embed .arco-input-number-step-layer {
        opacity: 0;
        border-radius: 1px;
        width: 18px;
        transition: all .1s cubic-bezier(0, 0, 1, 1);
        position: absolute;
        top: 4px;
        bottom: 4px;
        right: 4px;
        overflow: hidden
    }

    .arco-input-number-mode-embed .arco-input-number-step-layer .arco-input-number-step-button {
        width: 100%;
        height: 50%;
        font-size: 10px
    }

    .arco-input-number-mode-embed:not(.arco-input-group-wrapper-disabled):hover .arco-input-number-step-layer {
        opacity: 1
    }

    .arco-input-number-mode-embed:not(.arco-input-group-wrapper-disabled):hover .arco-input-number-step-layer~.arco-input-number-suffix {
        opacity: 0;
        pointer-events: none
    }

    .arco-input-number-mode-embed .arco-input-inner-wrapper:not(.arco-input-inner-wrapper-focus) .arco-input-number-step-button:not(.arco-input-number-step-button-disabled):hover {
        background-color: var(--color-fill-4)
    }

    .arco-input-number-rtl.arco-input-number-mode-embed .arco-input-number-step-layer {
        right: unset;
        left: 4px
    }

    .arco-input-number-mode-button .arco-input {
        text-align: center
    }

    .arco-input-number-mode-button .arco-input-group {
        position: relative
    }

    .arco-input-number-mode-button .arco-input-group-addbefore,
    .arco-input-number-mode-button .arco-input-group-addafter {
        padding: 0
    }

    .arco-input-number-mode-button .arco-input-group .arco-input-number-step-button {
        border: inherit;
        height: 100%;
        position: absolute;
        top: 0
    }

    .arco-input-number-mode-button .arco-input-group .arco-input-number-step-button:active {
        border-color: var(--color-fill-4)
    }

    .arco-input-number-mode-button .arco-input-group-addbefore .arco-input-number-step-button {
        border-right-color: var(--color-neutral-3);
        left: 0
    }

    .arco-input-number-mode-button .arco-input-group-addafter .arco-input-number-step-button {
        border-left-color: var(--color-neutral-3);
        right: 0
    }

    .arco-input-number-mode-button.arco-input-number-size-mini .arco-input-group-addbefore,
    .arco-input-number-mode-button.arco-input-number-size-mini .arco-input-group-addafter,
    .arco-input-number-mode-button.arco-input-number-size-mini .arco-input-group-addbefore .arco-input-number-step-button,
    .arco-input-number-mode-button.arco-input-number-size-mini .arco-input-group-addafter .arco-input-number-step-button {
        width: 24px
    }

    .arco-input-number-mode-button.arco-input-number-size-small .arco-input-group-addbefore,
    .arco-input-number-mode-button.arco-input-number-size-small .arco-input-group-addafter,
    .arco-input-number-mode-button.arco-input-number-size-small .arco-input-group-addbefore .arco-input-number-step-button,
    .arco-input-number-mode-button.arco-input-number-size-small .arco-input-group-addafter .arco-input-number-step-button {
        width: 28px
    }

    .arco-input-number-mode-button.arco-input-number-size-default .arco-input-group-addbefore,
    .arco-input-number-mode-button.arco-input-number-size-default .arco-input-group-addafter,
    .arco-input-number-mode-button.arco-input-number-size-default .arco-input-group-addbefore .arco-input-number-step-button,
    .arco-input-number-mode-button.arco-input-number-size-default .arco-input-group-addafter .arco-input-number-step-button {
        width: 32px
    }

    .arco-input-number-mode-button.arco-input-number-size-large .arco-input-group-addbefore,
    .arco-input-number-mode-button.arco-input-number-size-large .arco-input-group-addafter,
    .arco-input-number-mode-button.arco-input-number-size-large .arco-input-group-addbefore .arco-input-number-step-button,
    .arco-input-number-mode-button.arco-input-number-size-large .arco-input-group-addafter .arco-input-number-step-button {
        width: 36px
    }

    .arco-input-number-readonly .arco-input-number-step-button {
        pointer-events: none;
        color: var(--color-text-4)
    }

    .arco-input-number-illegal-value input {
        color: rgb(var(--danger-6))
    }
}


.xgplayer-fullscreen-parent {
    z-index: 9999;
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0
}

.xgplayer-fullscreen-parent .xgplayer.xgplayer-is-cssfullscreen,
.xgplayer-fullscreen-parent .xgplayer.xgplayer-is-fullscreen {
    z-index: 10;
    position: absolute
}

.xgplayer-rotate-parent {
    z-index: 9999;
    transform-origin: 0 0;
    width: 100vh;
    height: 100vw;
    position: fixed;
    top: 0;
    bottom: 0;
    left: 100%;
    right: 0;
    transform: rotate(90deg)
}

.xgplayer-rotate-parent .xgplayer.xgplayer-rotate-fullscreen {
    z-index: 10;
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    position: absolute;
    top: 0;
    left: 0;
    transform: rotate(0)
}

.xgplayer-rotate-parent .xgplayer-mobile video {
    z-index: -1
}

.xgplayer {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    cursor: pointer;
    background: #000;
    width: 100%;
    height: 100%;
    font-family: PingFang SC, Helvetica Neue, Helvetica, STHeiTi, Microsoft YaHei, WenQuanYi Micro Hei, sans-serif;
    font-size: 14px;
    font-weight: 400;
    position: relative;
    overflow: hidden
}

.xgplayer * {
    vertical-align: baseline;
    white-space: normal;
    word-wrap: normal;
    overflow-wrap: normal;
    border: 0;
    margin: 0;
    padding: 0
}

.xgplayer ul,
.xgplayer li {
    list-style: none
}

.xgplayer .xgplayer-none {
    display: none
}

.xgplayer.xgplayer-is-fullscreen {
    z-index: 9999;
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    position: fixed;
    top: 0;
    left: 0
}

.xgplayer.xgplayer-is-cssfullscreen {
    z-index: 9999;
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0
}

.xgplayer.xgplayer-rotate-fullscreen {
    transform-origin: 0 0;
    z-index: 9999;
    width: 100vh;
    height: 100vw;
    position: fixed;
    top: 0;
    bottom: 0;
    left: 100%;
    right: 0;
    transform: rotate(90deg)
}

.xgplayer.xgplayer-rotate-fullscreen.xgplayer-mobile video {
    z-index: -1
}

.xgplayer xg-video-container.xg-video-container {
    width: 100%;
    display: block;
    position: absolute;
    top: 0;
    bottom: 48px
}

.xgplayer video {
    outline: none;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0
}

.xgplayer[data-xgfill=contain] video {
    -o-object-fit: contain;
    object-fit: contain
}

.xgplayer[data-xgfill=cover] video {
    -o-object-fit: cover;
    object-fit: cover
}

.xgplayer[data-xgfill=fill] video {
    -o-object-fit: fill;
    object-fit: fill
}

.xgplayer .xg-pos {
    left: 10px;
    right: 10px
}

.xgplayer .xg-margin {
    margin-left: 16px;
    margin-right: 16px
}

.xgplayer .xg-bottom {
    bottom: 0
}

.xgplayer .btn-text {
    text-align: center;
    height: 24px;
    font-size: 13px;
    position: relative;
    top: 50%
}

.xgplayer .btn-text span {
    background: rgba(0, 0, 0, .38);
    border-radius: 12px;
    min-width: 52px;
    height: 24px;
    line-height: 24px;
    display: inline-block
}

.xgplayer xg-icon {
    box-sizing: border-box;
    cursor: pointer;
    color: rgba(255, 255, 255, .8);
    fill: #fff;
    height: 40px;
    margin-left: 16px;
    margin-right: 16px;
    position: relative
}

.xgplayer xg-icon.xg-icon-disable {
    cursor: not-allowed
}

.xgplayer xg-icon .xg-tips {
    top: -30px;
    left: 50%;
    transform: translate(-50%)
}

.xgplayer xg-icon:active .xg-tips,
.xgplayer xg-icon:hover .xg-tips {
    display: block
}

.xgplayer xg-icon:active .xg-tips.hide,
.xgplayer xg-icon:hover .xg-tips.hide {
    display: none
}

.xgplayer xg-icon .xgplayer-icon {
    cursor: pointer;
    position: relative;
    top: 50%;
    transform: translateY(-50%)
}

.xgplayer xg-icon .xg-icon-disable {
    cursor: not-allowed
}

.xgplayer xg-icon .xg-img {
    width: 100%
}

.xgplayer xg-icon svg,
.xgplayer xg-icon img {
    height: 100%;
    display: block
}

.xgplayer xg-bar {
    display: block
}

.xgplayer.xgplayer-inactive xg-bar,
.xgplayer.xgplayer-mini xg-bar {
    display: none
}

.xgplayer.xgplayer-inactive .xg-top-bar {
    display: flex
}

.xgplayer.xgplayer-inactive .xg-top-bar.top-bar-autohide {
    display: none
}

.xgplayer .xg-top-bar {
    z-index: 10;
    height: 50px;
    padding: 0 16px;
    display: flex;
    position: absolute;
    top: 0
}

.xgplayer .xg-top-bar xg-icon {
    width: 34px;
    margin-top: 0;
    position: relative;
    top: 10px;
    left: 0
}

.xgplayer .xg-top-bar xg-icon:first-child {
    margin-left: 0
}

.xgplayer .xg-left-bar,
.xgplayer .xg-right-bar {
    z-index: 9;
    width: 50px;
    position: absolute;
    top: 50px;
    bottom: 50px
}

.xgplayer .xg-left-bar {
    left: 0
}

.xgplayer .xg-right-bar {
    right: 0
}

.xgplayer .xg-tips {
    color: #fff;
    text-align: center;
    white-space: nowrap;
    opacity: .85;
    background: rgba(0, 0, 0, .54);
    border-radius: 4px;
    padding: 4px 6px;
    font-size: 12px;
    display: none;
    position: absolute
}

.xgplayer .xg-margin {
    left: 0;
    right: 0
}

.xgplayer-mobile {
    -webkit-tap-highlight-color: transparent
}

.xgplayer-mobile * {
    -webkit-tap-highlight-color: transparent;
    text-decoration: none
}

.xgplayer-mobile.xgplayer-rotate-fullscreen .xg-top-bar,
.xgplayer-mobile.xgplayer-rotate-fullscreen .xg-pos {
    left: 6%;
    right: 6%
}

.xgplayer-mobile xg-icon:hover .xg-tips {
    display: none
}

.xg-list-slide-scroll::-webkit-scrollbar-track {
    background-color: transparent;
    display: none
}

.xg-list-slide-scroll:hover::-webkit-scrollbar-track {
    display: block
}

.xg-list-slide-scroll::-webkit-scrollbar {
    -webkit-appearance: none;
    -moz-appearance: none;
    -ms-appearance: none;
    appearance: none;
    background: 0 0;
    width: 4px;
    height: 4px
}

.xg-list-slide-scroll::-webkit-scrollbar-corner {
    background: 0 0;
    display: none
}

.xg-list-slide-scroll::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, .5);
    border-radius: 3px;
    width: 4px;
    display: none
}

.xg-list-slide-scroll:hover::-webkit-scrollbar-thumb {
    display: block
}

@media only screen and (max-width:480px) {
    .xgplayer-mobile xg-icon {
        margin-left: 10px;
        margin-right: 10px
    }

    .xgplayer-mobile .xg-top-bar {
        left: 10px;
        right: 10px
    }
}

@media screen and (orientation:portrait) {

    .xgplayer-mobile.xgplayer-is-fullscreen .xgplayer-controls,
    .xgplayer-mobile.xgplayer-is-cssfullscreen .xgplayer-controls {
        bottom: 34px;
        bottom: constant(safe-area-inset-bottom);
        bottom: env(safe-area-inset-bottom)
    }

    .xgplayer-mobile.xgplayer-is-fullscreen .xg-top-bar,
    .xgplayer-mobile.xgplayer-is-cssfullscreen .xg-top-bar {
        top: 34px;
        top: constant(safe-area-inset-top);
        top: env(safe-area-inset-top)
    }
}

@media only screen and (orientation:landscape) {

    .xgplayer-mobile.xgplayer-is-fullscreen .xg-top-bar,
    .xgplayer-mobile.xgplayer-is-fullscreen .xg-pos {
        left: 6%;
        right: 6%
    }

    .xgplayer-mobile.xgplayer-rotate-fullscreen {
        width: 100vw;
        height: 100vh;
        left: 0;
        transform: rotate(0)
    }
}

.xgplayer .xgplayer-screen-container {
    width: 100%;
    display: block
}

.xgplayer .xg-options-icon {
    cursor: pointer;
    display: none
}

.xgplayer .xg-options-icon.show {
    display: block
}

@keyframes xg_right_options_active {
    0% {
        transform: translate(50%)
    }

    to {
        transform: translate(-50%)
    }
}

@keyframes xg_right_options_hide {
    0% {
        transform: translate(-50%)
    }

    to {
        transform: translate(50%)
    }
}

@keyframes xg_left_options_active {
    0% {
        transform: translate(-50%)
    }

    to {
        transform: translate(50%)
    }
}

@keyframes xg_left_options_hide {
    0% {
        transform: translate(50%)
    }

    to {
        transform: translate(-50%)
    }
}

.xgplayer .xg-options-list {
    z-index: 5;
    cursor: pointer;
    opacity: .85;
    color: rgba(255, 255, 255, .8);
    background: rgba(0, 0, 0, .54);
    border-radius: 1px;
    width: 78px;
    height: 0;
    font-size: 14px;
    display: none;
    position: absolute;
    bottom: 100%;
    right: 50%;
    overflow: auto;
    transform: translate(50%)
}

.xgplayer .xg-options-list li {
    text-align: center;
    color: rgba(255, 255, 255, .8);
    height: 20px;
    padding: 4px 0;
    line-height: 20px;
    position: relative
}

.xgplayer .xg-options-list li:hover,
.xgplayer .xg-options-list li.selected {
    color: red;
    opacity: 1
}

.xgplayer .xg-options-list li:first-child {
    margin-top: 12px;
    position: relative
}

.xgplayer .xg-options-list li:last-child {
    margin-bottom: 12px;
    position: relative
}

.xgplayer .xg-options-list:hover {
    opacity: 1
}

.xgplayer .xg-options-list.active {
    height: auto;
    display: block
}

.xgplayer .xg-options-list.xg-side-list {
    box-sizing: border-box;
    background: rgba(0, 0, 0, .9);
    flex-direction: column;
    width: 20%;
    height: 100%;
    display: flex;
    bottom: 0
}

.xgplayer .xg-options-list.xg-side-list li {
    flex: 1;
    width: 100%;
    padding: 0;
    position: relative
}

.xgplayer .xg-options-list.xg-side-list li span {
    pointer-events: none;
    display: block;
    position: relative;
    top: 50%;
    transform: translateY(-50%)
}

.xgplayer .xg-options-list.xg-side-list li:first-child {
    margin-top: 20px
}

.xgplayer .xg-options-list.xg-side-list li:last-child {
    margin-bottom: 20px
}

.xgplayer .xg-options-list.xg-right-side {
    right: -10.5%
}

.xgplayer .xg-options-list.xg-right-side.active {
    height: 100%;
    animation: .2s ease-out forwards xg_right_options_active
}

.xgplayer .xg-options-list.xg-right-side.hide {
    height: 100%;
    animation: .2s ease-in forwards xg_right_options_hide
}

.xgplayer .xg-options-list.xg-left-side {
    left: -10.5%;
    transform: translate(-50%)
}

.xgplayer .xg-options-list.xg-left-side.active {
    height: 100%;
    animation: .2s ease-out forwards xg_left_options_active
}

.xgplayer .xg-options-list.xg-left-side.hide {
    height: 100%;
    animation: .2s ease-in forwards xg_left_options_hide
}

@media only screen and (max-width:480px) {
    .xgplayer-mobile .xg-options-icon.portrait {
        display: none
    }

    .xgplayer-mobile .xg-options-list li:hover {
        color: rgba(255, 255, 255, .8)
    }

    .xgplayer-mobile .xg-options-list li.selected {
        color: red
    }
}

.xgplayer.not-allow-autoplay .xgplayer-controls,
.xgplayer.xgplayer-nostart .xgplayer-controls,
.xgplayer.xgplayer-inactive .controls-autohide {
    pointer-events: none;
    visibility: hidden;
    cursor: default;
    opacity: 0
}

.xgplayer.not-allow-autoplay .xgplayer-controls-initshow,
.xgplayer.xgplayer-nostart .xgplayer-controls-initshow {
    pointer-events: auto;
    visibility: visible;
    opacity: 1
}

.xgplayer .xgplayer-controls {
    visibility: visible;
    opacity: 1;
    z-index: 10;
    background-image: linear-gradient(transparent, rgba(0, 0, 0, .37), rgba(0, 0, 0, .75), rgba(0, 0, 0, .75));
    height: 48px;
    transition: opacity .5s, visibility .5s;
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0
}

.xgplayer .xgplayer-controls.show {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    display: block
}

.xgplayer .xg-inner-controls {
    justify-content: space-between;
    height: 40px;
    display: flex;
    position: absolute;
    bottom: 0
}

.xgplayer .xg-left-grid,
.xgplayer .xg-right-grid {
    z-index: 1;
    flex-wrap: wrap;
    flex-shrink: 1;
    height: 100%;
    display: flex;
    position: relative
}

.xgplayer .xg-right-grid {
    flex-direction: row-reverse
}

.xgplayer .xg-right-grid>:first-child {
    margin-right: 0
}

.xgplayer .xg-right-grid xg-icon,
.xgplayer .xg-left-grid>:first-child {
    margin-left: 0
}

.xgplayer .xg-left-grid xg-icon {
    margin-right: 0
}

.xgplayer .xg-center-grid {
    text-align: center;
    outline: none;
    padding: 5px 0;
    display: block;
    position: absolute;
    top: -20px;
    left: 0;
    right: 0
}

.xgplayer .flex-controls .xg-inner-controls {
    justify-content: space-around;
    display: flex;
    bottom: 8px
}

.xgplayer .flex-controls .xg-center-grid {
    flex: 1;
    justify-content: space-between;
    align-items: center;
    height: 100%;
    padding: 0 16px;
    display: flex;
    position: relative;
    top: 0;
    left: 0;
    right: 0
}

.xgplayer.xgplayer-mobile .xg-center-grid {
    z-index: 2
}

.xgplayer.xgplayer-mobile .flex-controls .xg-center-grid {
    padding: 0 8px
}

.xgplayer .bottom-controls .xg-center-grid {
    padding: 0;
    top: 20px
}

.xgplayer .bottom-controls .xg-left-grid,
.xgplayer .bottom-controls .xg-right-grid {
    bottom: 10px
}

.xgplayer .mini-controls {
    background-image: none
}

.xgplayer .mini-controls .xg-inner-controls {
    bottom: 0;
    left: 0;
    right: 0
}

.xgplayer .mini-controls .xg-center-grid {
    padding: 0;
    top: auto;
    bottom: -28px
}

.xgplayer .mini-controls .xg-left-grid,
.xgplayer .mini-controls .xg-right-grid {
    display: none
}

.xgplayer .controls-follow {
    transition: bottom .3s;
    bottom: 70px
}

.xgplayer.flex-controls .controls-follow {
    bottom: 45px
}

.xgplayer.xgplayer-inactive .controls-follow,
.xgplayer.no-controls .controls-follow,
.xgplayer.mini-controls .controls-follow {
    bottom: 10px
}

.xgplayer .xgplayer-cssfullscreen .xg-get-cssfull {
    display: block
}

.xgplayer .xgplayer-cssfullscreen .xg-exit-cssfull,
.xgplayer .xgplayer-cssfullscreen[data-state=full] .xg-get-cssfull {
    display: none
}

.xgplayer .xgplayer-cssfullscreen[data-state=full] .xg-exit-cssfull {
    display: block
}

.xgplayer .xgplayer-fullscreen .xg-exit-fullscreen {
    display: none
}

.xgplayer .xgplayer-fullscreen .xg-get-fullscreen,
.xgplayer .xgplayer-fullscreen[data-state=full] .xg-exit-fullscreen {
    display: block
}

.xgplayer .xgplayer-fullscreen[data-state=full] .xg-get-fullscreen {
    display: none
}

.xgplayer .xg-top-bar .xgplayer-back {
    width: 34px;
    height: 40px;
    display: none;
    position: relative;
    top: 16px;
    left: 0
}

.xgplayer .xg-top-bar .xgplayer-back.show {
    display: block
}

.xgplayer .xgplayer-play .xg-icon-play {
    display: none
}

.xgplayer .xgplayer-play .xg-icon-pause,
.xgplayer .xgplayer-play[data-state=pause] .xg-icon-play {
    display: block
}

.xgplayer .xgplayer-play[data-state=pause] .xg-icon-pause {
    display: none
}

.xgplayer .xgplayer-progress {
    cursor: pointer;
    outline: none;
    flex: 1;
    align-items: center;
    min-width: 10px;
    height: 20px;
    display: flex;
    position: relative;
    top: 0;
    left: 0;
    right: 0
}

.xgplayer .xgplayer-progress-outer {
    cursor: pointer;
    border-radius: 3px;
    width: 100%;
    height: 2px;
    position: relative
}

.xgplayer .progress-list {
    border-radius: inherit;
    width: 100%;
    height: 100%;
    display: flex
}

.xgplayer .xgplayer-progress-inner {
    border-radius: inherit;
    pointer-events: none;
    background: rgba(255, 255, 255, .3);
    flex: 1;
    height: 100%;
    margin-right: 2px;
    transition: height .2s ease-in, opacity .2s ease-out;
    position: relative
}

.xgplayer .xgplayer-progress-inner:last-child,
.xgplayer .xgplayer-progress-inner:only-child {
    margin-right: 0
}

.xgplayer .inner-focus-point {
    background: #fff;
    position: relative
}

.xgplayer .inner-focus-point:before,
.xgplayer .inner-focus-point:after {
    content: " ";
    z-index: 1;
    background: #fff;
    border-radius: 3px;
    width: 2px;
    height: 300%;
    display: block;
    position: absolute;
    top: 50%;
    transform: translateY(-50%)
}

.xgplayer .inner-focus-point:before {
    left: 0
}

.xgplayer .inner-focus-point:after {
    right: 0
}

.xgplayer .xgplayer-progress-cache,
.xgplayer .xgplayer-progress-played {
    border-radius: inherit;
    width: 0;
    height: 100%;
    display: block;
    position: absolute;
    top: 0;
    left: 0
}

.xgplayer .xgplayer-progress-played {
    background: linear-gradient(-90deg, #fa1f41 0%, #e31106 100%)
}

.xgplayer .xgplayer-progress-cache {
    background: rgba(255, 255, 255, .5)
}

.xgplayer .xgplayer-progress-btn {
    z-index: 1;
    box-sizing: border-box;
    pointer-events: none;
    background: rgba(255, 94, 94, .306);
    border: .5px solid rgba(255, 94, 94, .055);
    border-radius: 30px;
    width: 20px;
    height: 20px;
    display: block;
    position: absolute;
    top: 50%;
    left: 0;
    transform: translate(-50%, -50%);
    box-shadow: 0 0 1px rgba(255, 0, 0, .384)
}

.xgplayer .xgplayer-progress-btn:before {
    content: " ";
    background: #fff;
    border-radius: 30px;
    width: 12px;
    height: 12px;
    display: block;
    position: relative;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%)
}

.xgplayer .xgplayer-progress-btn.active {
    border: 4px solid rgba(255, 94, 94, .063)
}

.xgplayer .xgplayer-progress-btn.active:before {
    box-shadow: 0 0 3px rgba(248, 89, 89, .69)
}

.xgplayer .xgplayer-progress-dot {
    z-index: 16;
    background: #fff;
    border-radius: 6px;
    width: 5px;
    height: 100%;
    display: inline-block;
    position: absolute;
    top: 0
}

.xgplayer .xgplayer-progress-dot .xgplayer-progress-tip {
    cursor: default;
    white-space: nowrap;
    background: rgba(0, 0, 0, .3);
    border: 1px solid rgba(0, 0, 0, .8);
    border-radius: 6px;
    width: auto;
    height: auto;
    line-height: 30px;
    display: none;
    position: absolute;
    top: -40px;
    left: 25%;
    transform: scale(.8)translate(-50%)
}

.xgplayer .xgplayer-progress-dot:hover .xgplayer-progress-tip {
    display: block
}

.xgplayer .flex-controls .xgplayer-progress {
    transform: translateY(0)
}

.xgplayer.xgplayer-pc .xgplayer-progress-btn {
    transform: translate(-50%, -50%)scale(0)
}

.xgplayer.xgplayer-pc .xgplayer-progress-outer {
    height: 3px
}

.xgplayer.xgplayer-pc .xgplayer-progress-inner {
    margin-right: 4px
}

.xgplayer.xgplayer-pc .xgplayer-progress-inner:last-child,
.xgplayer.xgplayer-pc .xgplayer-progress-inner:only-child {
    margin-right: 0
}

.xgplayer.xgplayer-pc .inner-focus-point:before,
.xgplayer.xgplayer-pc .inner-focus-point:after {
    width: 3px
}

.xgplayer.xgplayer-pc .inner-focus-highlight {
    background: rgba(255, 255, 255, .8)
}

.xgplayer.xgplayer-pc .xgplayer-progress.active .xgplayer-progress-outer {
    height: 6px;
    margin-bottom: 3px;
    transition: height .3s, margin-bottom .3s
}

.xgplayer.xgplayer-pc .xgplayer-progress.active .xgplayer-progress-btn {
    transform: translate(-50%, -50%)scale(1)
}

.xgplayer.xgplayer-pc .xgplayer-progress.active .inner-focus-point:before,
.xgplayer.xgplayer-pc .xgplayer-progress.active .inner-focus-point:after {
    width: 6px
}

.xgplayer .xgplayer-progress-bottom .xgplayer-progress-outer {
    top: 9px
}

.xgplayer .xgplayer-progress-bottom .xgplayer-progress-btn:before {
    width: 6px;
    height: 6px
}

.xgplayer.xgplayer-mobile .xgplayer-progress-bottom .xgplayer-progress-outer {
    height: 4px
}

@media (prefers-color-scheme:dark) {
    .xgplayer .xgplayer-progress .xgplayer-progress-inner {
        background-color: rgba(255, 255, 255, .3)
    }

    .xgplayer .xgplayer-progress .inner-focus-highlight {
        background: rgba(255, 255, 255, .8)
    }

    .xgplayer .xgplayer-progress .xgplayer-progress-btn {
        background: rgba(255, 94, 94, .306);
        border: .5px solid rgba(255, 94, 94, .055);
        box-shadow: 0 0 1px rgba(255, 0, 0, .384)
    }

    .xgplayer .xgplayer-progress .xgplayer-progress-btn:before {
        background-color: #fff
    }

    .xgplayer .xgplayer-progress .xgplayer-progress-played {
        background-color: linear-gradient(-90deg, #fa1f41 0%, #e31106 100%)
    }

    .xgplayer .xgplayer-progress .xgplayer-progress-cache {
        background-color: rgba(255, 255, 255, .5)
    }
}

.xg-mini-progress {
    pointer-events: none;
    height: 2px;
    display: none;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0
}

.xg-mini-progress xg-mini-progress-played,
.xg-mini-progress xg-mini-progress-cache {
    border-radius: inherit;
    width: 0;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0
}

.xg-mini-progress xg-mini-progress-played {
    background: linear-gradient(-90deg, #fa1f41 0%, #e31106 100%)
}

.xg-mini-progress xg-mini-progress-cache {
    background: rgba(255, 255, 255, .5)
}

.xg-mini-progress-show,
.xgplayer-inactive .xg-mini-progress,
.xgplayer-mini .xg-mini-progress {
    display: block
}

.xgplayer .xgplayer-time {
    pointer-events: none;
    color: #fff;
    text-align: center;
    min-width: 40px;
    font-family: PingFangSC-Semibold;
    font-size: 14px;
    line-height: 40px;
    display: inline-block
}

.xgplayer .xgplayer-time span {
    height: 40px;
    line-height: 40px;
    display: inline-block
}

.xgplayer .xgplayer-time span .time-min-width {
    text-align: center;
    min-width: 2ch
}

.xgplayer .xgplayer-time span .time-min-width:first-child {
    text-align: right
}

.xgplayer .xgplayer-time span .time-min-width:last-child {
    text-align: left
}

.xgplayer .xgplayer-time .time-duration {
    color: rgba(255, 255, 255, .5)
}

.xgplayer .xgplayer-time .time-live-tag {
    display: none
}

.xgplayer .xgplayer-time.xg-time-left {
    margin-left: 0
}

.xgplayer .xgplayer-time.xg-time-right {
    margin-right: 0
}

.xgplayer.xgplayer-mobile .xgplayer-time {
    min-width: 30px;
    font-size: 12px
}

.xgplayer.xgplayer-mobile .xgplayer-time.xg-time-left {
    margin-right: 8px
}

.xgplayer.xgplayer-mobile .xgplayer-time.xg-time-right {
    margin-left: 8px
}

.xgplayer .xgplayer-volume.slide-show .xgplayer-slider {
    display: block
}

.xgplayer .xgplayer-slider {
    background: rgba(0, 0, 0, .54);
    border-radius: 1px;
    outline: none;
    width: 28px;
    height: 92px;
    display: none;
    position: absolute;
    bottom: 40px
}

.xgplayer .xgplayer-slider:after {
    content: " ";
    z-index: 20;
    width: 28px;
    height: 15px;
    cursor: initial;
    display: block;
    position: absolute;
    bottom: -15px;
    left: 0
}

.xgplayer .xgplayer-value-label {
    color: #fff;
    text-align: center;
    background-color: rgba(0, 0, 0, .54);
    padding: 5px 0 0;
    font-size: 12px;
    position: absolute;
    bottom: 100%;
    left: 0;
    right: 0
}

.xgplayer .xgplayer-bar,
.xgplayer .xgplayer-drag {
    cursor: pointer;
    background: rgba(255, 255, 255, .3);
    border-radius: 100px;
    outline: none;
    width: 4px;
    height: 76px;
    display: block;
    position: absolute;
    bottom: 6px;
    left: 12px
}

.xgplayer .xgplayer-drag {
    background: #fa1f41;
    max-height: 76px;
    bottom: 0;
    left: 0
}

.xgplayer .xgplayer-drag:after {
    content: " ";
    background: #fff;
    border-radius: 50%;
    width: 8px;
    height: 8px;
    display: inline-block;
    position: absolute;
    top: -4px;
    left: -2px;
    box-shadow: 0 0 5px rgba(0, 0, 0, .26)
}

.xgplayer .xgplayer-volume[data-state=normal] .xg-volume {
    display: block
}

.xgplayer .xgplayer-volume[data-state=normal] .xg-volume-small,
.xgplayer .xgplayer-volume[data-state=normal] .xg-volume-mute,
.xgplayer .xgplayer-volume[data-state=small] .xg-volume {
    display: none
}

.xgplayer .xgplayer-volume[data-state=small] .xg-volume-small {
    display: block
}

.xgplayer .xgplayer-volume[data-state=small] .xg-volume-mute,
.xgplayer .xgplayer-volume[data-state=mute] .xg-volume,
.xgplayer .xgplayer-volume[data-state=mute] .xg-volume-small {
    display: none
}

.xgplayer .xgplayer-volume[data-state=mute] .xg-volume-mute {
    display: block
}

.xgplayer.xgplayer-mobile .xgplayer-volume .xgplayer-slider,
.xgplayer-replay {
    display: none
}

.xgplayer .xgplayer-replay {
    z-index: 5;
    cursor: pointer;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 100px;
    height: 100px;
    display: none;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%)
}

.xgplayer .xgplayer-replay .xgplayer-replay-txt {
    color: #fff;
    text-align: center;
    font-size: 14px;
    line-height: 34px;
    display: inline-block
}

.xgplayer.xgplayer-mobile .xgplayer-replay-svg {
    width: 50px;
    height: 50px
}

.xgplayer.xgplayer-mobile .xgplayer-replay-txt {
    font-size: 12px;
    line-height: 24px
}

.xgplayer .xgplayer-poster {
    opacity: 1;
    visibility: visible;
    pointer-events: none;
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: 100%;
    width: 100%;
    height: 100%;
    transition: opacity .3s, visibility .3s;
    display: block;
    position: absolute;
    top: 0;
    left: 0
}

.xgplayer .xgplayer-poster.hide,
.xgplayer.xgplayer-playing .xgplayer-poster {
    opacity: 0;
    visibility: hidden
}

.xgplayer.xgplayer-playing .xg-not-hidden,
.xgplayer.xgplayer-is-enter .xgplayer-poster.xg-showplay,
.xgplayer.xgplayer-playing .xgplayer-poster.xg-showplay,
.xgplayer.xgplayer-nostart .xgplayer-poster,
.xgplayer.xgplayer-ended .xgplayer-poster,
.xgplayer.not-allow-autoplay .xgplayer-poster {
    opacity: 1;
    visibility: visible
}

.xgplayer.xgplayer-nostart .xgplayer-poster.hide,
.xgplayer.xgplayer-ended .xgplayer-poster.hide,
.xgplayer.not-allow-autoplay .xgplayer-poster.hide {
    opacity: 0;
    visibility: hidden
}

@keyframes playPause {
    0% {
        opacity: 1;
        transform: scale(1)
    }

    99% {
        opacity: 0;
        transform: scale(1.3)
    }

    to {
        opacity: 0;
        transform: scale(1)
    }
}

.xgplayer xg-start-inner {
    background: rgba(0, 0, 0, .38);
    border-radius: 50%;
    width: 100%;
    height: 100%;
    display: block;
    overflow: hidden
}

.xgplayer .xgplayer-start {
    z-index: 5;
    cursor: pointer;
    width: 70px;
    height: 70px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%)
}

.xgplayer .xgplayer-start svg {
    width: 100%;
    height: 100%
}

.xgplayer .xgplayer-start.hide,
.xgplayer .xgplayer-start.focus-hide {
    pointer-events: none;
    display: none
}

.xgplayer .xgplayer-start:hover {
    opacity: .85
}

.xgplayer .xgplayer-start .xg-icon-play {
    display: block
}

.xgplayer .xgplayer-start .xg-icon-pause,
.xgplayer .xgplayer-start[data-state=pause] .xg-icon-play {
    display: none
}

.xgplayer .xgplayer-start[data-state=pause] .xg-icon-pause,
.xgplayer .xgplayer-start.interact {
    display: block
}

.xgplayer .xgplayer-start.interact xg-start-inner {
    animation: .4s ease-out .1s forwards playPause
}

.xgplayer .xgplayer-start.show {
    display: block
}

.xgplayer.xgplayer-mobile xg-start-inner {
    background: initial;
    border-radius: 0
}

.xgplayer.xgplayer-mobile .xgplayer-start {
    width: 50px;
    height: 50px
}

.xgplayer.xgplayer-mobile .xgplayer-start:hover {
    opacity: 1
}

.xgplayer.xgplayer-inactive .xgplayer-start.auto-hide,
.xgplayer.xgplayer-is-enter .xgplayer-start.auto-hide,
.xgplayer.xgplayer-isloading.xgplayer-playing .xgplayer-start,
.xgplayer.xgplayer-is-enter .xgplayer-start,
.xgplayer.xgplayer-is-error .xgplayer-start,
.xgplayer.xgplayer-is-enter .xgplayer-start.show,
.xgplayer.xgplayer-is-error .xgplayer-start.show {
    display: none
}

.xgplayer-enter {
    z-index: 5;
    pointer-events: none;
    background: rgba(0, 0, 0, .8);
    width: 100%;
    height: 100%;
    display: none;
    position: absolute;
    top: 0;
    left: 0
}

.xgplayer-enter .show {
    display: block
}

.xgplayer-enter .xgplayer-enter-spinner {
    z-index: 1;
    width: 100px;
    height: 100px;
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%)
}

.xgplayer-enter .xgplayer-enter-spinner div {
    opacity: 0;
    background-color: rgba(255, 255, 255, .7);
    border-radius: 30px;
    width: 6%;
    height: 13%;
    animation: 1s linear infinite fade;
    position: absolute;
    top: 45%;
    left: 45%
}

.xgplayer-enter .xgplayer-enter-spinner div.xgplayer-enter-bar1 {
    animation-delay: 0s;
    transform: rotate(0)translateY(-140%)
}

.xgplayer-enter .xgplayer-enter-spinner div.xgplayer-enter-bar2 {
    animation-delay: -.9163s;
    transform: rotate(30deg)translateY(-140%)
}

.xgplayer-enter .xgplayer-enter-spinner div.xgplayer-enter-bar3 {
    animation-delay: -.833s;
    transform: rotate(60deg)translateY(-140%)
}

.xgplayer-enter .xgplayer-enter-spinner div.xgplayer-enter-bar4 {
    animation-delay: -.7497s;
    transform: rotate(90deg)translateY(-140%)
}

.xgplayer-enter .xgplayer-enter-spinner div.xgplayer-enter-bar5 {
    animation-delay: -.6664s;
    transform: rotate(120deg)translateY(-140%)
}

.xgplayer-enter .xgplayer-enter-spinner div.xgplayer-enter-bar6 {
    animation-delay: -.5831s;
    transform: rotate(150deg)translateY(-140%)
}

.xgplayer-enter .xgplayer-enter-spinner div.xgplayer-enter-bar7 {
    animation-delay: -.4998s;
    transform: rotate(180deg)translateY(-140%)
}

.xgplayer-enter .xgplayer-enter-spinner div.xgplayer-enter-bar8 {
    animation-delay: -.4165s;
    transform: rotate(210deg)translateY(-140%)
}

.xgplayer-enter .xgplayer-enter-spinner div.xgplayer-enter-bar9 {
    animation-delay: -.3332s;
    transform: rotate(240deg)translateY(-140%)
}

.xgplayer-enter .xgplayer-enter-spinner div.xgplayer-enter-bar10 {
    animation-delay: -.2499s;
    transform: rotate(270deg)translateY(-140%)
}

.xgplayer-enter .xgplayer-enter-spinner div.xgplayer-enter-bar11 {
    animation-delay: -.1666s;
    transform: rotate(300deg)translateY(-140%)
}

.xgplayer-enter .xgplayer-enter-spinner div.xgplayer-enter-bar12 {
    animation-delay: -.0833s;
    transform: rotate(330deg)translateY(-142%)
}

@keyframes fade {
    0% {
        opacity: 1
    }

    to {
        opacity: .25
    }
}

.xgplayer.xgplayer-is-enter .xgplayer-enter {
    opacity: 1;
    transition: opacity .3s;
    display: block
}

.xgplayer.xgplayer-nostart .xgplayer-enter {
    display: none
}

.xgplayer.xgplayer-mobile .xgplayer-enter .xgplayer-enter-spinner {
    width: 70px;
    height: 70px
}

.xg-mini-layer {
    z-index: 11;
    background: linear-gradient(rgba(57, 57, 57, .9), rgba(57, 57, 57, 0) 50.27%);
    width: 100%;
    height: 100%;
    display: none;
    position: absolute;
    top: 0;
    left: 0
}

.xg-mini-layer .mask {
    pointer-events: none;
    background-color: rgba(0, 0, 0, .4);
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0
}

.xg-mini-layer xg-mini-header {
    box-sizing: border-box;
    color: #fff;
    z-index: 22;
    justify-content: space-between;
    padding: 10px 3px 0 8px;
    font-size: 14px;
    display: flex;
    position: absolute;
    top: 0;
    left: 0;
    right: 40px
}

.xg-mini-layer xg-mini-header .xgplayer-pip-disableBtn {
    pointer-events: all
}

.xg-mini-layer xg-mini-header #disabledMini {
    display: none;
    position: relative
}

.xg-mini-layer xg-mini-header #disabledMini+label {
    cursor: pointer;
    align-items: center;
    display: flex;
    position: relative
}

.xg-mini-layer xg-mini-header #disabledMini+label:before {
    content: "";
    color: #ff142b;
    text-align: center;
    vertical-align: middle;
    background-color: transparent;
    border: 1px solid #cdcdcd;
    border-radius: 2px;
    width: 16px;
    height: 16px;
    margin-right: 7px;
    line-height: 16px;
    display: inline-block
}

.xg-mini-layer xg-mini-header #disabledMini:checked+label {
    color: #ff142b
}

.xg-mini-layer xg-mini-header #disabledMini:checked+label:before {
    border-color: #ff142b
}

.xg-mini-layer xg-mini-header #disabledMini:checked+label:after {
    content: "";
    border: 2px solid #ff142b;
    border-width: 0 2px 2px 0;
    width: 4px;
    height: 8px;
    position: absolute;
    top: 5px;
    left: 6px;
    transform: rotate(45deg)
}

.xg-mini-layer xg-mini-header .xgplayer-mini-disableBtn xg-tips {
    white-space: nowrap;
    background-color: rgba(0, 0, 0, .54);
    border-radius: 4px;
    padding: 4px 6px;
    display: none;
    position: absolute;
    bottom: -30px;
    right: 15px
}

.xg-mini-layer xg-mini-header .xgplayer-mini-disableBtn:hover #disabledMini+label:before {
    border-color: #ff142b
}

.xg-mini-layer xg-mini-header .xgplayer-mini-disableBtn:hover #disabledMini+label {
    color: #ff142b
}

.xg-mini-layer xg-mini-header .xgplayer-mini-disableBtn:hover xg-tips {
    display: block
}

.xg-mini-layer .mini-cancel-btn {
    cursor: pointer;
    color: #fff;
    text-align: center;
    width: 40px;
    height: 38px;
    line-height: 38px;
    display: block;
    position: absolute;
    top: 0;
    right: 0
}

.xg-mini-layer .play-icon {
    cursor: pointer;
    background: rgba(0, 0, 0, .54);
    border-radius: 24px;
    width: 48px;
    height: 48px;
    margin: -24px 0 0 -24px;
    position: absolute;
    top: 50%;
    left: 50%
}

.xg-mini-layer .play-icon svg,
.xg-mini-layer .play-icon img {
    fill: #faf7f7;
    width: 50px;
    height: 50px
}

.xg-mini-layer .xg-icon-play {
    display: none
}

.xg-mini-layer .xg-icon-pause,
.xg-mini-layer[data-state=pause] .xg-icon-play {
    display: block
}

.xg-mini-layer[data-state=pause] .xg-icon-pause {
    display: none
}

.xgplayer-miniicon {
    outline: none;
    display: block;
    position: relative
}

.xgplayer-miniicon .name {
    text-align: center;
    color: rgba(255, 255, 255, .8);
    height: 20px;
    font-size: 13px;
    line-height: 40px
}

.xgplayer-miniicon .name span {
    vertical-align: middle;
    background: rgba(0, 0, 0, .38);
    border-radius: 10px;
    width: 60px;
    height: 20px;
    font-size: 13px;
    line-height: 20px;
    display: inline-block
}

.xgplayer-mini {
    z-index: 91;
    width: 320px;
    height: 180px;
    position: fixed;
    box-shadow: 0 4px 7px 2px rgba(0, 0, 0, .2)
}

.xgplayer-mini:hover {
    cursor: move
}

.xgplayer-mini:hover .xg-mini-layer {
    display: block
}

.xgplayer-mini.xgplayer-ended .xg-mini-layer {
    display: none
}

.xgplayer-mobile .xg-mini-layer .play-icon {
    border-radius: initial;
    background: 0 0
}

.xgplayer.xgplayer-inactive {
    cursor: none
}

.xgplayer xg-thumbnail {
    display: block
}

.xgplayer xg-trigger {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0
}

.xgplayer xg-trigger .time-preview {
    color: #fff;
    text-shadow: 0 0 1px rgba(0, 0, 0, .54);
    text-align: center;
    pointer-events: none;
    width: 200px;
    margin: 0 auto;
    padding: 0 20px 30px;
    font-size: 18px;
    display: none;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%)
}

.xgplayer xg-trigger .time-preview span {
    line-height: 24px
}

.xgplayer xg-trigger .time-preview .xg-cur {
    color: red
}

.xgplayer xg-trigger .time-preview .xg-separator {
    font-size: 14px
}

.xgplayer xg-trigger .time-preview .xg-seek-show {
    transform: translate(-10px)
}

.xgplayer xg-trigger .time-preview .xg-seek-show.xg-back .xg-seek-pre {
    transform: rotate(180deg)translate(-5px)
}

.xgplayer xg-trigger .time-preview .xg-seek-show.hide-seek-icon .xg-seek-icon {
    display: none
}

.xgplayer xg-trigger .time-preview .xg-bar {
    box-sizing: content-box;
    background: rgba(255, 255, 255, .3);
    border-radius: 10px;
    width: 96px;
    height: 2px;
    margin: 8px auto 0
}

.xgplayer xg-trigger .time-preview .xg-bar .xg-curbar {
    background-color: red;
    width: 0;
    height: 100%
}

.xgplayer xg-trigger .time-preview .xg-bar.hide {
    display: none
}

.xgplayer xg-trigger .mobile-thumbnail {
    position: relative;
    left: 50%;
    transform: translate(-50%)
}

.xgplayer xg-trigger .xg-top-note {
    color: #fff;
    background: rgba(0, 0, 0, .3);
    border-radius: 100px;
    width: 135px;
    height: 32px;
    margin-left: -78px;
    position: absolute;
    top: 26px;
    left: 50%
}

.xgplayer xg-trigger .xg-top-note span {
    text-align: center;
    height: 32px;
    font-size: 13px;
    line-height: 32px;
    display: block
}

.xgplayer xg-trigger .xg-top-note i {
    color: red;
    margin: 0 5px
}

.xgplayer xg-trigger .xg-playbackrate {
    display: none
}

.xgplayer xg-trigger[data-xg-action=seeking] .time-preview,
.xgplayer xg-trigger[data-xg-action=playbackrate] .xg-playbackrate {
    display: block
}

.xgplayer .gradient {
    pointer-events: none;
    background-image: linear-gradient(rgba(0, 0, 0, .6), rgba(0, 0, 0, .36) 20%, transparent 36%, transparent 70%, rgba(0, 0, 0, .24) 77%, rgba(0, 0, 0, .36) 83%, rgba(0, 0, 0, .6));
    width: 100%;
    height: 100%;
    display: none;
    position: absolute;
    top: 0;
    left: 0
}

.xgplayer .gradient.top {
    background-image: linear-gradient(rgba(0, 0, 0, .6), rgba(0, 0, 0, .36) 20%, transparent 36%, transparent 70%)
}

.xgplayer .gradient.bottom {
    background-image: linear-gradient(transparent 70%, rgba(0, 0, 0, .24) 77%, rgba(0, 0, 0, .36) 83%, rgba(0, 0, 0, .6))
}

.xgplayer .gradient.none,
.xgplayer-mobile .xgplayer-controls {
    background-image: initial
}

.xgplayer-mobile.xgplayer-playing .gradient {
    display: block
}

.xgplayer-mobile.xgplayer-inactive .gradient {
    background-image: initial
}

.xgplayer-mobile .xgmask {
    z-index: 10;
    pointer-events: none;
    background-color: transparent;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0
}

@media (prefers-color-scheme:dark) {
    .xgplayer-mobile xg-trigger .time-preview {
        color: #fff
    }

    .xgplayer-mobile xg-trigger .time-preview span.xg-cur {
        color: red
    }

    .xgplayer-mobile xg-trigger .time-preview .xg-bar {
        background-color: rgba(255, 255, 255, .3)
    }

    .xgplayer-mobile xg-trigger .time-preview .xg-bar.xg-curbar {
        background-color: red
    }
}

@keyframes loadingRotate {
    0% {
        transform: rotate(0)
    }

    25% {
        transform: rotate(90deg)
    }

    50% {
        transform: rotate(180deg)
    }

    75% {
        transform: rotate(270deg)
    }

    to {
        transform: rotate(360deg)
    }
}

@keyframes loadingDashOffset {
    0% {
        stroke-dashoffset: 236px
    }

    to {
        stroke-dashoffset: 0
    }
}

xg-loading-inner {
    transform-origin: 50%;
    width: 100%;
    height: 100%;
    animation: 1s linear .1s infinite loadingRotate;
    display: block
}

.xgplayer-loading {
    z-index: 10;
    pointer-events: none;
    width: 70px;
    height: 70px;
    display: none;
    position: absolute;
    top: 50%;
    left: 50%;
    overflow: hidden;
    transform: translate(-50%, -50%)
}

.xgplayer-loading svg,
.xgplayer-loading img {
    width: 100%;
    height: 100%
}

.xgplayer-mobile .xgplayer-loading {
    width: 50px;
    height: 50px
}

.xgplayer-isloading .xgplayer-loading {
    display: block
}

.xgplayer-nostart .xgplayer-loading,
.xgplayer-pause .xgplayer-loading,
.xgplayer-is-enter .xgplayer-loading,
.xgplayer-is-ended .xgplayer-loading,
.xgplayer-is-error .xgplayer-loading,
.xgplayer .xgplayer-pip .xg-exit-pip {
    display: none
}

.xgplayer .xgplayer-pip .xg-get-pip,
.xgplayer .xgplayer-pip[data-state=pip] .xg-exit-pip {
    display: block
}

.xgplayer .xgplayer-pip[data-state=pip] .xg-get-pip {
    display: none
}

.xgplayer .xgplayer-playnext {
    cursor: pointer;
    display: none;
    position: relative
}

.xgplayer .xgplayer-playnext .xgplayer-tips .xgplayer-tip-playnext {
    display: block
}

.xgplayer .xgplayer-playnext:hover {
    opacity: .85
}

.xgplayer .xgplayer-playnext:hover .xgplayer-tips {
    display: block
}

.lang-is-en .xgplayer-playnext .xgplayer-tips {
    margin-left: -25px
}

.lang-is-jp .xgplayer-playnext .xgplayer-tips {
    margin-left: -38px
}

.xgplayer .xgplayer-download {
    cursor: pointer;
    display: block;
    position: relative
}

.lang-is-en .xgplayer-download .xgplayer-tips {
    margin-left: -32px
}

.lang-is-jp .xgplayer-download .xgplayer-tips {
    margin-left: -40px
}

.xgplayer .xgplayer-shot {
    display: none
}

.xgplayer-definition {
    cursor: pointer;
    display: none
}

.xgplayer .xgplayer-playbackrate {
    cursor: default;
    display: none
}

.xgplayer-error {
    z-index: 6;
    color: #fff;
    text-align: center;
    background: #000;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
    line-height: 100%;
    display: none;
    position: absolute;
    top: 0;
    left: 0
}

.xgplayer-error .xgplayer-error-refresh {
    color: #fa1f41;
    cursor: pointer;
    padding: 0 3px
}

.xgplayer-error .xgplayer-error-text {
    margin: auto 6px 20px;
    line-height: 18px;
    display: block
}

.xgplayer-is-error .xgplayer-error {
    display: flex
}

.xgplayer .xgplayer-prompt {
    pointer-events: none;
    z-index: 1;
    opacity: 0;
    text-align: center;
    color: #fff;
    background: rgba(0, 0, 0, .5);
    border-radius: 50px;
    padding: 6px 12px 5px;
    font-size: 12px;
    line-height: 17px;
    display: block;
    position: absolute;
    left: 10px
}

.xgplayer .xgplayer-prompt.show {
    opacity: 1;
    z-index: 10;
    pointer-events: initial;
    display: block
}

.xgplayer .xgplayer-prompt.arrow {
    transform: translate(-50%)
}

.xgplayer .xgplayer-prompt.arrow:after {
    content: "";
    border-top: 8px solid rgba(0, 0, 0, .5);
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    width: 0;
    height: 0;
    display: block;
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translate(-50%, 100%)
}

.xgplayer .xgplayer-prompt .highlight {
    color: red;
    cursor: pointer;
    margin-left: 6px;
    display: inline-block
}

.xgplayer.xgplayer-is-error .xgplayer-prompt.show {
    opacity: 1;
    display: none
}

.xgplayer .xgplayer-spot {
    background: #fff;
    border-radius: 12px;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0
}

.xgplayer .xgplayer-spot.mini {
    min-width: 6px;
    transform: translate(-50%)
}

.xgplayer .xgplayer-spot.active .xgplayer-spot-pop {
    opacity: 1;
    pointer-events: initial;
    display: block
}

.xgplayer .xgplayer-spot-pop {
    opacity: 0;
    pointer-events: none;
    padding-bottom: 5px;
    display: block;
    position: absolute;
    bottom: 5px;
    left: 50%;
    transform: translate(-50%)
}

.xgplayer-mobile .xgplayer-spot {
    opacity: 1;
    min-width: 3px;
    height: 3px;
    top: 50%;
    transform: translateY(-50%)
}

.xgplayer-mobile .xgplayer-spot.mini {
    min-width: 3px;
    transform: translate(-50%, -50%)
}

.xgplayer .xgplayer-progress.active .xgplayer-spot {
    opacity: 1;
    visibility: visible;
    transition: opacity .3s
}

.xgplayer .xg-spot-info {
    display: none;
    position: absolute;
    bottom: 100%;
    left: 0
}

.xgplayer .xg-spot-info.short-line .xg-spot-line {
    height: 6px
}

.xgplayer .xg-spot-info.short-line .xg-spot-content {
    bottom: -4px
}

.xgplayer .xg-spot-info.no-thumbnail .xg-spot-thumbnail {
    display: none
}

.xgplayer .xg-spot-info.no-thumbnail .xgplayer-progress-point {
    display: block
}

.xgplayer .xg-spot-info.no-timepoint .xgplayer-progress-point,
.xgplayer .xg-spot-info.hide {
    display: none
}

.xgplayer .xgplayer-progress.active .xg-spot-info {
    display: block
}

.xgplayer .xgplayer-progress.active .xg-spot-info.hide {
    display: none
}

.xgplayer .xg-spot-line {
    pointer-events: none;
    background-color: #fff;
    width: 1px;
    height: 41px;
    margin-left: 50%;
    display: block;
    position: relative;
    bottom: -7px
}

.xgplayer .xgplayer-progress-point {
    color: #fff;
    text-align: center;
    opacity: .85;
    white-space: nowrap;
    background: rgba(0, 0, 0, .54);
    border-radius: 4px;
    padding: 4px 6px;
    font-size: 11px;
    display: none;
    position: relative;
    bottom: -4px;
    left: 50%;
    transform: translate(-50%)
}

.xgplayer .xg-spot-content {
    color: #fff;
    border-radius: 2px 2px 0 0;
    position: relative;
    bottom: -7px
}

.xgplayer .xg-spot-ext-text {
    position: relative;
    bottom: -7px
}

.xgplayer .xg-spot-thumbnail {
    pointer-events: none;
    background-color: #111010;
    border-radius: 2px 2px 0 0;
    position: relative
}

.xgplayer .xg-spot-time {
    pointer-events: none;
    font-size: 12px;
    line-height: 16.8px;
    position: absolute;
    bottom: 2px;
    left: 50%;
    transform: translate(-50%)
}

.xgplayer .progress-thumbnail {
    margin: 0 auto;
    display: block
}

.xgplayer .xg-spot-text {
    pointer-events: none;
    box-sizing: border-box;
    background: rgba(0, 0, 0, .8);
    border-radius: 0 0 2px 2px;
    padding: 5px 8px;
    display: none
}

.xgplayer .spot-inner-text {
    text-overflow: ellipsis;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    max-height: 40px;
    font-size: 12px;
    line-height: 20px;
    display: -webkit-box;
    overflow: hidden
}

.xgplayer .xg-spot-content.show-text .xg-spot-text {
    display: block
}

.xgplayer .product .xg-spot-text {
    background: #3370ff
}

.xgplayer .product .xg-spot-line {
    background: 0 0;
    border-top: 7px solid #3370ff;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    width: 0;
    height: 15px;
    left: -10px
}

.xgplayer .xgvideo-preview {
    opacity: 0;
    visibility: hidden;
    background-color: #000;
    width: 100%;
    height: 100%;
    transition: visibility .3s, opacity .3s;
    position: absolute;
    top: 0;
    left: 0
}

.xgplayer .xgvideo-preview .xgvideo-thumbnail {
    border-radius: 0;
    position: relative;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%)
}

.xgplayer .xgvideo-preview.show {
    opacity: 1;
    visibility: visible
}

.xgplayer-dynamic-bg,
.xgplayer-dynamic-bg canvas,
.xgplayer-dynamic-bg xgmask,
.xgplayer-dynamic-bg xgfilter {
    pointer-events: none;
    width: 100%;
    height: 100%;
    display: block;
    position: absolute;
    top: 0;
    left: 0
}

.xgplayer-dynamic-bg canvas {
    transform: translateZ(0)
}

.xgplayer-dynamic-bg xgmask {
    background: rgba(0, 0, 0, .7)
}


.CodeMirror {
    color: #000;
    direction: ltr;
    height: 300px;
    font-family: monospace
}

.CodeMirror-lines {
    padding: 4px 0
}

.CodeMirror pre.CodeMirror-line,
.CodeMirror pre.CodeMirror-line-like {
    padding: 0 4px
}

.CodeMirror-scrollbar-filler,
.CodeMirror-gutter-filler {
    background-color: #fff
}

.CodeMirror-gutters {
    white-space: nowrap;
    background-color: #f7f7f7;
    border-right: 1px solid #ddd
}

.CodeMirror-linenumber {
    text-align: right;
    color: #999;
    white-space: nowrap;
    min-width: 20px;
    padding: 0 3px 0 5px
}

.CodeMirror-guttermarker {
    color: #000
}

.CodeMirror-guttermarker-subtle {
    color: #999
}

.CodeMirror-cursor {
    border-left: 1px solid #000;
    border-right: none;
    width: 0
}

.CodeMirror div.CodeMirror-secondarycursor {
    border-left: 1px solid silver
}

.cm-fat-cursor .CodeMirror-cursor {
    background: #7e7;
    width: auto;
    border: 0 !important
}

.cm-fat-cursor div.CodeMirror-cursors {
    z-index: 1
}

.cm-fat-cursor .CodeMirror-line::-moz-selection {
    background: 0 0
}

.cm-fat-cursor .CodeMirror-line>span::-moz-selection {
    background: 0 0
}

.cm-fat-cursor .CodeMirror-line>span>span::-moz-selection {
    background: 0 0
}

.cm-fat-cursor .CodeMirror-line::-moz-selection {
    background: 0 0
}

.cm-fat-cursor .CodeMirror-line::selection {
    background: 0 0
}

.cm-fat-cursor .CodeMirror-line>span::-moz-selection {
    background: 0 0
}

.cm-fat-cursor .CodeMirror-line>span::selection {
    background: 0 0
}

.cm-fat-cursor .CodeMirror-line>span>span::-moz-selection {
    background: 0 0
}

.cm-fat-cursor .CodeMirror-line>span>span::selection {
    background: 0 0
}

.cm-fat-cursor .CodeMirror-line::-moz-selection {
    background: 0 0
}

.cm-fat-cursor .CodeMirror-line>span::-moz-selection {
    background: 0 0
}

.cm-fat-cursor .CodeMirror-line>span>span::-moz-selection {
    background: 0 0
}

.cm-fat-cursor {
    caret-color: transparent
}

@keyframes blink {
    0% {}

    50% {
        background-color: transparent
    }

    to {}
}

.cm-tab {
    -webkit-text-decoration: inherit;
    text-decoration: inherit;
    display: inline-block
}

.CodeMirror-rulers {
    position: absolute;
    top: -50px;
    bottom: 0;
    left: 0;
    right: 0;
    overflow: hidden
}

.CodeMirror-ruler {
    border-left: 1px solid #ccc;
    position: absolute;
    top: 0;
    bottom: 0
}

.cm-s-default .cm-header {
    color: #00f
}

.cm-s-default .cm-quote {
    color: #090
}

.cm-negative {
    color: #d44
}

.cm-positive {
    color: #292
}

.cm-header,
.cm-strong {
    font-weight: 700
}

.cm-em {
    font-style: italic
}

.cm-link {
    text-decoration: underline
}

.cm-strikethrough {
    text-decoration: line-through
}

.cm-s-default .cm-keyword {
    color: #708
}

.cm-s-default .cm-atom {
    color: #219
}

.cm-s-default .cm-number {
    color: #164
}

.cm-s-default .cm-def {
    color: #00f
}

.cm-s-default .cm-variable-2 {
    color: #05a
}

.cm-s-default .cm-variable-3,
.cm-s-default .cm-type {
    color: #085
}

.cm-s-default .cm-comment {
    color: #a50
}

.cm-s-default .cm-string {
    color: #a11
}

.cm-s-default .cm-string-2 {
    color: #f50
}

.cm-s-default .cm-meta,
.cm-s-default .cm-qualifier {
    color: #555
}

.cm-s-default .cm-builtin {
    color: #30a
}

.cm-s-default .cm-bracket {
    color: #997
}

.cm-s-default .cm-tag {
    color: #170
}

.cm-s-default .cm-attribute {
    color: #00c
}

.cm-s-default .cm-hr {
    color: #999
}

.cm-s-default .cm-link {
    color: #00c
}

.cm-s-default .cm-error,
.cm-invalidchar {
    color: red
}

.CodeMirror-composing {
    border-bottom: 2px solid
}

div.CodeMirror span.CodeMirror-matchingbracket {
    color: #0b0
}

div.CodeMirror span.CodeMirror-nonmatchingbracket {
    color: #a22
}

.CodeMirror-matchingtag {
    background: rgba(255, 150, 0, .3)
}

.CodeMirror-activeline-background {
    background: #e8f2ff
}

.CodeMirror {
    background: #fff;
    position: relative;
    overflow: hidden
}

.CodeMirror-scroll {
    z-index: 0;
    outline: none;
    height: 100%;
    margin-bottom: -50px;
    margin-right: -50px;
    padding-bottom: 50px;
    position: relative;
    overflow: scroll !important
}

.CodeMirror-sizer {
    border-right: 50px solid transparent;
    position: relative
}

.CodeMirror-vscrollbar,
.CodeMirror-hscrollbar,
.CodeMirror-scrollbar-filler,
.CodeMirror-gutter-filler {
    z-index: 6;
    outline: none;
    display: none;
    position: absolute
}

.CodeMirror-vscrollbar {
    top: 0;
    right: 0;
    overflow-x: hidden;
    overflow-y: scroll
}

.CodeMirror-hscrollbar {
    bottom: 0;
    left: 0;
    overflow-x: scroll;
    overflow-y: hidden
}

.CodeMirror-scrollbar-filler {
    bottom: 0;
    right: 0
}

.CodeMirror-gutter-filler {
    bottom: 0;
    left: 0
}

.CodeMirror-gutters {
    z-index: 3;
    min-height: 100%;
    position: absolute;
    top: 0;
    left: 0
}

.CodeMirror-gutter {
    white-space: normal;
    vertical-align: top;
    height: 100%;
    margin-bottom: -50px;
    display: inline-block
}

.CodeMirror-gutter-wrapper {
    z-index: 4;
    position: absolute;
    background: 0 0 !important;
    border: none !important
}

.CodeMirror-gutter-background {
    z-index: 4;
    position: absolute;
    top: 0;
    bottom: 0
}

.CodeMirror-gutter-elt {
    cursor: default;
    z-index: 4;
    position: absolute
}

.CodeMirror-gutter-wrapper ::-moz-selection {
    background-color: transparent
}

.CodeMirror-gutter-wrapper ::selection {
    background-color: transparent
}

.CodeMirror-lines {
    cursor: text;
    min-height: 1px
}

.CodeMirror pre.CodeMirror-line,
.CodeMirror pre.CodeMirror-line-like {
    font-family: inherit;
    font-size: inherit;
    white-space: pre;
    word-wrap: normal;
    line-height: inherit;
    color: inherit;
    z-index: 2;
    -webkit-tap-highlight-color: transparent;
    font-variant-ligatures: contextual;
    background: 0 0;
    border-width: 0;
    border-radius: 0;
    margin: 0;
    position: relative;
    overflow: visible
}

.CodeMirror-wrap pre.CodeMirror-line,
.CodeMirror-wrap pre.CodeMirror-line-like {
    word-wrap: break-word;
    white-space: pre-wrap;
    word-break: normal
}

.CodeMirror-linebackground {
    z-index: 0;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0
}

.CodeMirror-linewidget {
    z-index: 2;
    padding: .1px;
    position: relative
}

.CodeMirror-rtl pre {
    direction: rtl
}

.CodeMirror-code {
    outline: none
}

.CodeMirror-scroll,
.CodeMirror-sizer,
.CodeMirror-gutter,
.CodeMirror-gutters,
.CodeMirror-linenumber {
    box-sizing: content-box
}

.CodeMirror-measure {
    visibility: hidden;
    width: 100%;
    height: 0;
    position: absolute;
    overflow: hidden
}

.CodeMirror-cursor {
    pointer-events: none;
    position: absolute
}

.CodeMirror-measure pre {
    position: static
}

div.CodeMirror-cursors {
    visibility: hidden;
    z-index: 3;
    position: relative
}

div.CodeMirror-dragcursors,
.CodeMirror-focused div.CodeMirror-cursors {
    visibility: visible
}

.CodeMirror-selected {
    background: #d9d9d9
}

.CodeMirror-focused .CodeMirror-selected {
    background: #d7d4f0
}

.CodeMirror-crosshair {
    cursor: crosshair
}

.CodeMirror-line::-moz-selection {
    background: #d7d4f0
}

.CodeMirror-line>span::-moz-selection {
    background: #d7d4f0
}

.CodeMirror-line>span>span::-moz-selection {
    background: #d7d4f0
}

.CodeMirror-line::-moz-selection {
    background: #d7d4f0
}

.CodeMirror-line::selection {
    background: #d7d4f0
}

.CodeMirror-line>span::-moz-selection {
    background: #d7d4f0
}

.CodeMirror-line>span::selection {
    background: #d7d4f0
}

.CodeMirror-line>span>span::-moz-selection {
    background: #d7d4f0
}

.CodeMirror-line>span>span::selection {
    background: #d7d4f0
}

.CodeMirror-line::-moz-selection {
    background: #d7d4f0
}

.CodeMirror-line>span::-moz-selection {
    background: #d7d4f0
}

.CodeMirror-line>span>span::-moz-selection {
    background: #d7d4f0
}

.cm-searching {
    background-color: rgba(255, 255, 0, .4)
}

.cm-force-border {
    padding-right: .1px
}

@media print {
    .CodeMirror div.CodeMirror-cursors {
        visibility: hidden
    }
}

.cm-tab-wrap-hack:after {
    content: ""
}

span.CodeMirror-selectedtext {
    background: 0 0
}


.cm-s-monokai.CodeMirror {
    color: #f8f8f2;
    background: #272822
}

.cm-s-monokai div.CodeMirror-selected {
    background: #49483e
}

.cm-s-monokai .CodeMirror-line::-moz-selection {
    background: rgba(73, 72, 62, .99)
}

.cm-s-monokai .CodeMirror-line>span::-moz-selection {
    background: rgba(73, 72, 62, .99)
}

.cm-s-monokai .CodeMirror-line>span>span::-moz-selection {
    background: rgba(73, 72, 62, .99)
}

.cm-s-monokai .CodeMirror-line::-moz-selection {
    background: rgba(73, 72, 62, .99)
}

.cm-s-monokai .CodeMirror-line::selection {
    background: rgba(73, 72, 62, .99)
}

.cm-s-monokai .CodeMirror-line>span::-moz-selection {
    background: rgba(73, 72, 62, .99)
}

.cm-s-monokai .CodeMirror-line>span::selection {
    background: rgba(73, 72, 62, .99)
}

.cm-s-monokai .CodeMirror-line>span>span::-moz-selection {
    background: rgba(73, 72, 62, .99)
}

.cm-s-monokai .CodeMirror-line>span>span::selection {
    background: rgba(73, 72, 62, .99)
}

.cm-s-monokai .CodeMirror-line::-moz-selection {
    background: rgba(73, 72, 62, .99)
}

.cm-s-monokai .CodeMirror-line>span::-moz-selection {
    background: rgba(73, 72, 62, .99)
}

.cm-s-monokai .CodeMirror-line>span>span::-moz-selection {
    background: rgba(73, 72, 62, .99)
}

.cm-s-monokai .CodeMirror-gutters {
    background: #272822;
    border-right: 0
}

.cm-s-monokai .CodeMirror-guttermarker {
    color: #fff
}

.cm-s-monokai .CodeMirror-guttermarker-subtle,
.cm-s-monokai .CodeMirror-linenumber {
    color: #d0d0d0
}

.cm-s-monokai .CodeMirror-cursor {
    border-left: 1px solid #f8f8f0
}

.cm-s-monokai span.cm-comment {
    color: #75715e
}

.cm-s-monokai span.cm-atom,
.cm-s-monokai span.cm-number {
    color: #ae81ff
}

.cm-s-monokai span.cm-comment.cm-attribute {
    color: #97b757
}

.cm-s-monokai span.cm-comment.cm-def {
    color: #bc9262
}

.cm-s-monokai span.cm-comment.cm-tag {
    color: #bc6283
}

.cm-s-monokai span.cm-comment.cm-type {
    color: #5998a6
}

.cm-s-monokai span.cm-property,
.cm-s-monokai span.cm-attribute {
    color: #a6e22e
}

.cm-s-monokai span.cm-keyword {
    color: #f92672
}

.cm-s-monokai span.cm-builtin {
    color: #66d9ef
}

.cm-s-monokai span.cm-string {
    color: #e6db74
}

.cm-s-monokai span.cm-variable {
    color: #f8f8f2
}

.cm-s-monokai span.cm-variable-2 {
    color: #9effff
}

.cm-s-monokai span.cm-variable-3,
.cm-s-monokai span.cm-type {
    color: #66d9ef
}

.cm-s-monokai span.cm-def {
    color: #fd971f
}

.cm-s-monokai span.cm-bracket {
    color: #f8f8f2
}

.cm-s-monokai span.cm-tag {
    color: #f92672
}

.cm-s-monokai span.cm-header,
.cm-s-monokai span.cm-link {
    color: #ae81ff
}

.cm-s-monokai span.cm-error {
    color: #f8f8f0;
    background: #f92672
}

.cm-s-monokai .CodeMirror-activeline-background {
    background: #373831
}

.cm-s-monokai .CodeMirror-matchingbracket {
    text-decoration: underline;
    color: #fff !important
}


.CodeMirror-simplescroll-horizontal div,
.CodeMirror-simplescroll-vertical div {
    box-sizing: border-box;
    background: #ccc;
    border: 1px solid #bbb;
    border-radius: 2px;
    position: absolute
}

.CodeMirror-simplescroll-horizontal,
.CodeMirror-simplescroll-vertical {
    z-index: 6;
    background: #eee;
    position: absolute
}

.CodeMirror-simplescroll-horizontal {
    height: 8px;
    bottom: 0;
    left: 0
}

.CodeMirror-simplescroll-horizontal div {
    height: 100%;
    bottom: 0
}

.CodeMirror-simplescroll-vertical {
    width: 8px;
    top: 0;
    right: 0
}

.CodeMirror-simplescroll-vertical div {
    width: 100%;
    right: 0
}

.CodeMirror-overlayscroll .CodeMirror-scrollbar-filler,
.CodeMirror-overlayscroll .CodeMirror-gutter-filler {
    display: none
}

.CodeMirror-overlayscroll-horizontal div,
.CodeMirror-overlayscroll-vertical div {
    background: #bcd;
    border-radius: 3px;
    position: absolute
}

.CodeMirror-overlayscroll-horizontal,
.CodeMirror-overlayscroll-vertical {
    z-index: 6;
    position: absolute
}

.CodeMirror-overlayscroll-horizontal {
    height: 6px;
    bottom: 0;
    left: 0
}

.CodeMirror-overlayscroll-horizontal div {
    height: 100%;
    bottom: 0
}

.CodeMirror-overlayscroll-vertical {
    width: 6px;
    top: 0;
    right: 0
}

.CodeMirror-overlayscroll-vertical div {
    width: 100%;
    right: 0
}


@layer base {
    .arco-alert {
        box-sizing: border-box;
        border-radius: var(--border-radius-small);
        text-align: left;
        align-items: center;
        width: 100%;
        padding: 8px 15px;
        font-size: 14px;
        line-height: 1.5715;
        display: flex;
        overflow: hidden
    }

    .arco-alert-with-title {
        align-items: flex-start;
        padding: 15px
    }

    .arco-alert-info {
        background-color: var(--color-primary-light-1);
        border: 1px solid transparent
    }

    .arco-alert-success {
        background-color: var(--color-success-light-1);
        border: 1px solid transparent
    }

    .arco-alert-warning {
        background-color: var(--color-warning-light-1);
        border: 1px solid transparent
    }

    .arco-alert-error {
        background-color: var(--color-danger-light-1);
        border: 1px solid transparent
    }

    .arco-alert-banner {
        border: none;
        border-radius: 0
    }

    .arco-alert-content-wrapper {
        flex: 1;
        position: relative
    }

    .arco-alert-title {
        margin-bottom: 4px;
        font-size: 16px;
        font-weight: 500;
        line-height: 1.5
    }

    .arco-alert-info .arco-alert-title,
    .arco-alert-info .arco-alert-content {
        color: var(--color-text-1)
    }

    .arco-alert-info.arco-alert-with-title .arco-alert-content {
        color: var(--color-text-2)
    }

    .arco-alert-success .arco-alert-title,
    .arco-alert-success .arco-alert-content {
        color: var(--color-text-1)
    }

    .arco-alert-success.arco-alert-with-title .arco-alert-content {
        color: var(--color-text-2)
    }

    .arco-alert-warning .arco-alert-title,
    .arco-alert-warning .arco-alert-content {
        color: var(--color-text-1)
    }

    .arco-alert-warning.arco-alert-with-title .arco-alert-content {
        color: var(--color-text-2)
    }

    .arco-alert-error .arco-alert-title,
    .arco-alert-error .arco-alert-content {
        color: var(--color-text-1)
    }

    .arco-alert-error.arco-alert-with-title .arco-alert-content {
        color: var(--color-text-2)
    }

    .arco-alert-icon-wrapper {
        align-items: center;
        height: 22.001px;
        margin-right: 8px;
        display: flex
    }

    .arco-alert-icon-wrapper svg {
        font-size: 16px
    }

    .arco-alert-with-title .arco-alert-icon-wrapper {
        height: 24px
    }

    .arco-alert-with-title .arco-alert-icon-wrapper svg {
        font-size: 18px
    }

    .arco-alert-info .arco-alert-icon-wrapper svg {
        color: rgb(var(--primary-6))
    }

    .arco-alert-success .arco-alert-icon-wrapper svg {
        color: rgb(var(--success-6))
    }

    .arco-alert-warning .arco-alert-icon-wrapper svg {
        color: rgb(var(--warning-6))
    }

    .arco-alert-error .arco-alert-icon-wrapper svg {
        color: rgb(var(--danger-6))
    }

    .arco-alert-close-btn {
        box-sizing: border-box;
        color: var(--color-text-2);
        cursor: pointer;
        background-color: transparent;
        border: none;
        outline: none;
        margin-left: 8px;
        padding: 0;
        font-size: 12px;
        transition: color .1s cubic-bezier(0, 0, 1, 1);
        top: 4px;
        right: 0
    }

    .arco-alert-close-btn:hover {
        color: var(--color-text-1)
    }

    .arco-alert-action+.arco-alert-close-btn,
    .arco-alert-action {
        margin-left: 8px
    }

    .arco-alert-with-title .arco-alert-close-btn {
        margin-top: 0;
        margin-right: 0
    }

    .arco-alert-rtl {
        text-align: right;
        direction: rtl
    }

    .arco-alert-rtl .arco-alert-with-title {
        align-items: flex-end
    }

    .arco-alert-rtl .arco-alert-icon-wrapper {
        margin-left: 8px;
        margin-right: 0
    }

    .arco-alert-rtl .arco-alert-close-btn {
        right: initial;
        left: 0
    }

    .arco-alert-rtl .arco-alert-action,
    .arco-alert-rtl .arco-alert-action+.arco-alert-close-btn {
        margin-left: 0;
        margin-right: 8px
    }
}


@layer base {
    .arco-popover-content {
        padding: 12px 16px
    }

    .arco-popover-title {
        color: var(--color-text-1);
        font-size: 16px;
        font-weight: 500
    }

    .arco-popover-title+.arco-popover-inner-content {
        margin-top: 4px
    }

    .arco-popover-content,
    .arco-popconfirm-content {
        color: var(--color-text-2);
        background-color: var(--color-bg-popup);
        border-radius: var(--border-radius-medium);
        box-sizing: border-box;
        border: 1px solid var(--color-neutral-3);
        width: 100%;
        max-width: none;
        font-size: 14px;
        line-height: 1.5715;
        box-shadow: 0 4px 10px rgba(0, 0, 0, .1)
    }

    .arco-popover-content-inner,
    .arco-popconfirm-content-inner {
        word-wrap: break-word;
        text-align: left
    }

    .arco-popover-arrow.arco-trigger-arrow,
    .arco-popconfirm-arrow.arco-trigger-arrow {
        background-color: var(--color-bg-popup);
        border: 1px solid var(--color-neutral-3);
        z-index: 1
    }

    .arco-popover-inner-rtl {
        text-align: right;
        direction: rtl
    }
}


@layer base {
    .arco-space {
        display: inline-flex
    }

    .arco-space-vertical {
        flex-direction: column
    }

    .arco-space-align-baseline {
        align-items: baseline
    }

    .arco-space-align-start {
        align-items: flex-start
    }

    .arco-space-align-end {
        align-items: flex-end
    }

    .arco-space-align-center {
        align-items: center
    }

    .arco-space-wrap {
        flex-wrap: wrap
    }

    .arco-space-rtl {
        direction: rtl
    }
}


@layer base {
    .arco-radio>input[type=radio] {
        opacity: 0;
        width: 0;
        height: 0;
        position: absolute;
        top: 0;
        left: 0
    }

    .arco-radio-button>input[type=radio] {
        opacity: 0;
        width: 0;
        height: 0;
        position: absolute;
        top: 0;
        left: 0
    }

    .arco-radio>input[type=radio]:focus-visible+.arco-radio-icon-hover:before {
        background-color: var(--color-fill-2);
        opacity: 1
    }

    .arco-radio-button>input[type=radio]:focus-visible+.arco-radio-icon-hover:before {
        background-color: var(--color-fill-2);
        opacity: 1
    }

    .arco-radio>input[type=radio]:focus-visible+.arco-radio-button-inner {
        box-shadow: inset 0 0 0 2px rgb(var(--primary-6));
        border-radius: inherit
    }

    .arco-radio-button>input[type=radio]:focus-visible+.arco-radio-button-inner {
        box-shadow: inset 0 0 0 2px rgb(var(--primary-6));
        border-radius: inherit
    }

    .arco-icon-hover.arco-radio-icon-hover:before {
        width: 24px;
        height: 24px
    }

    .arco-radio {
        cursor: pointer;
        font-size: 14px;
        line-height: unset;
        padding-left: 5px;
        display: inline-block;
        position: relative
    }

    .arco-radio-text {
        color: var(--color-text-1);
        margin-left: 8px
    }

    .arco-radio-mask-wrapper {
        vertical-align: middle;
        line-height: 1;
        position: relative;
        top: -.09em
    }

    .arco-radio-mask {
        border: 2px solid var(--color-neutral-3);
        box-sizing: border-box;
        border-radius: var(--border-radius-circle);
        width: 14px;
        height: 14px;
        line-height: 14px;
        display: block;
        position: relative
    }

    .arco-radio-mask:after {
        box-sizing: border-box;
        content: "";
        border-radius: var(--border-radius-circle);
        background-color: var(--color-bg-2);
        width: 10px;
        height: 10px;
        transition: transform .3s cubic-bezier(.3, 1.3, .3, 1);
        display: inline-block;
        position: absolute;
        top: 0;
        left: 0;
        transform: scale(1)
    }

    .arco-radio:hover .arco-radio-mask {
        border-color: var(--color-neutral-3)
    }

    .arco-radio-checked .arco-radio-mask {
        background-color: rgb(var(--primary-6));
        border-color: rgb(var(--primary-6))
    }

    .arco-radio-checked .arco-radio-mask:after {
        background-color: var(--color-white);
        transform: scale(.4)
    }

    .arco-radio-checked:hover .arco-radio-mask {
        border-color: rgb(var(--primary-6))
    }

    .arco-radio-disabled,
    .arco-radio-disabled .arco-radio-icon-hover {
        cursor: not-allowed
    }

    .arco-radio-disabled .arco-radio-text {
        color: var(--color-text-4)
    }

    .arco-radio-disabled .arco-radio-mask {
        border-color: var(--color-neutral-3)
    }

    .arco-radio-disabled .arco-radio-mask:after {
        background-color: var(--color-fill-2)
    }

    .arco-radio-disabled:hover .arco-radio-mask {
        border-color: var(--color-neutral-3)
    }

    .arco-radio-checked.arco-radio-disabled .arco-radio-mask,
    .arco-radio-checked.arco-radio-disabled:hover .arco-radio-mask {
        background-color: var(--color-primary-light-3);
        border-color: transparent
    }

    .arco-radio-checked.arco-radio-disabled .arco-radio-mask:after {
        background-color: var(--color-fill-2)
    }

    .arco-radio-checked.arco-radio-disabled .arco-radio-text {
        color: var(--color-text-4)
    }

    .arco-radio:hover .arco-radio-icon-hover:before {
        background-color: var(--color-fill-2)
    }

    .arco-radio-group {
        box-sizing: border-box;
        display: inline-block
    }

    .arco-radio-group .arco-radio {
        margin-right: 20px
    }

    .arco-radio-group-type-button {
        z-index: 0;
        padding: 1.5px;
        line-height: 26px;
        position: relative
    }

    .arco-radio-button {
        border-radius: var(--border-radius-small);
        color: var(--color-text-2);
        cursor: pointer;
        background-color: transparent;
        margin: 1.5px;
        font-size: 14px;
        line-height: 26px;
        transition: all .1s cubic-bezier(0, 0, 1, 1);
        display: inline-block;
        position: relative
    }

    .arco-radio-button-inner {
        padding: 0 12px;
        display: block;
        position: relative
    }

    .arco-radio-button:not(:first-of-type):before {
        background-color: var(--color-neutral-3);
        content: "";
        width: 1px;
        height: 14px;
        transition: all .1s cubic-bezier(0, 0, 1, 1);
        display: block;
        position: absolute;
        top: 50%;
        left: -2px;
        transform: translateY(-50%)
    }

    .arco-radio-button:hover:before,
    .arco-radio-button:hover+.arco-radio-button:before,
    .arco-radio-button.arco-radio-checked:before,
    .arco-radio-button.arco-radio-checked+.arco-radio-button:before {
        opacity: 0
    }

    .arco-radio-button:after {
        content: " ";
        background-color: var(--color-fill-2);
        pointer-events: none;
        z-index: -1;
        display: block;
        position: absolute;
        top: -3px;
        bottom: -3px;
        left: -3px;
        right: -3px
    }

    .arco-radio-button:first-of-type:after {
        border-top-left-radius: var(--border-radius-small);
        border-bottom-left-radius: var(--border-radius-small)
    }

    .arco-radio-button:last-of-type:after {
        border-top-right-radius: var(--border-radius-small);
        border-bottom-right-radius: var(--border-radius-small)
    }

    .arco-radio-button:hover {
        background-color: var(--color-bg-5);
        color: var(--color-text-1)
    }

    .arco-radio-button.arco-radio-checked {
        background-color: var(--color-bg-5);
        color: rgb(var(--primary-6));
        font-weight: 500
    }

    .arco-radio-button.arco-radio-disabled {
        cursor: not-allowed;
        color: var(--color-text-4);
        background-color: transparent
    }

    .arco-radio-button.arco-radio-disabled.arco-radio-checked {
        background-color: var(--color-bg-5);
        color: var(--color-primary-light-3)
    }

    .arco-radio-size-small {
        line-height: 28px
    }

    .arco-radio-size-small.arco-radio-group-type-button,
    .arco-radio-size-small .arco-radio-button {
        font-size: 14px;
        line-height: 22px
    }

    .arco-radio-size-large {
        line-height: 36px
    }

    .arco-radio-size-large.arco-radio-group-type-button,
    .arco-radio-size-large .arco-radio-button {
        font-size: 14px;
        line-height: 30px
    }

    .arco-radio-size-mini {
        line-height: 24px
    }

    .arco-radio-size-mini.arco-radio-group-type-button,
    .arco-radio-size-mini .arco-radio-button {
        font-size: 12px;
        line-height: 18px
    }

    .arco-radio-group-direction-vertical .arco-radio {
        margin-right: 0;
        line-height: 32px;
        display: block
    }

    body[arco-theme=dark] .arco-radio-button.arco-radio-checked,
    body[arco-theme=dark] .arco-radio-button:not(.arco-radio-disabled):hover {
        background-color: var(--color-fill-3)
    }

    body[arco-theme=dark] .arco-radio-button:after {
        background-color: var(--color-bg-3)
    }

    .arco-radio-rtl {
        padding-left: 0;
        padding-right: 5px
    }

    .arco-radio-rtl .arco-radio-text {
        margin-left: 0;
        margin-right: 8px
    }

    .arco-radio-group-rtl .arco-radio {
        margin-left: 20px;
        margin-right: 0
    }

    .arco-radio-group-rtl.arco-radio-group-direction-vertical .arco-radio {
        margin-right: unset;
        margin-left: 0
    }
}


@layer base {

    .arco-skeleton,
    .arco-skeleton-header {
        display: flex
    }

    .arco-skeleton-header .arco-skeleton-image {
        background-color: var(--color-fill-2);
        border-radius: var(--border-radius-small);
        width: 48px;
        height: 48px
    }

    .arco-skeleton-header .arco-skeleton-image-circle {
        border-radius: 50%
    }

    .arco-skeleton-header .arco-skeleton-image-small {
        width: 36px;
        height: 36px
    }

    .arco-skeleton-header .arco-skeleton-image-large {
        width: 60px;
        height: 60px
    }

    .arco-skeleton-header .arco-skeleton-image-left {
        margin-right: 16px
    }

    .arco-skeleton-header .arco-skeleton-image-right {
        margin-left: 16px
    }

    .arco-skeleton-content {
        flex-grow: 1;
        overflow: hidden
    }

    .arco-skeleton-content .arco-skeleton-text {
        margin: 0;
        padding: 0;
        list-style: none
    }

    .arco-skeleton-content .arco-skeleton-text-row {
        background-color: var(--color-fill-2);
        height: 16px
    }

    .arco-skeleton-content .arco-skeleton-text-row:not(:last-child) {
        margin-bottom: 16px
    }

    .arco-skeleton-animate .arco-skeleton-image,
    .arco-skeleton-animate .arco-skeleton-text>li {
        background: linear-gradient(90deg, var(--color-fill-2)25%, var(--color-fill-3)37%, var(--color-fill-2)63%);
        background-size: 400% 100%;
        animation: 1.5s cubic-bezier(0, 0, 1, 1) infinite arco-skeleton-circle
    }

    @keyframes arco-skeleton-circle {
        0% {
            background-position: 100%
        }

        to {
            background-position: 0
        }
    }

    .arco-skeleton-rtl .arco-skeleton-image-left {
        margin-left: 16px;
        margin-right: 0
    }

    .arco-skeleton-rtl .arco-skeleton-image-right {
        margin-left: 0;
        margin-right: 16px
    }
}


@layer base {
    .arco-link {
        color: rgb(var(--link-6));
        cursor: pointer;
        border-radius: var(--border-radius-small);
        background-color: transparent;
        padding: 1px 4px;
        font-size: 14px;
        line-height: 1.5715;
        text-decoration: none;
        transition: all .1s cubic-bezier(0, 0, 1, 1);
        display: inline-block
    }

    .arco-link:hover {
        color: rgb(var(--link-6));
        background-color: var(--color-fill-2)
    }

    .arco-link:active {
        color: rgb(var(--link-6));
        background-color: var(--color-fill-3);
        transition: none
    }

    .arco-link:focus-visible {
        box-shadow: 0 0 0 2px var(--color-link-light-3)
    }

    .arco-link.arco-link-hoverless {
        background-color: unset;
        padding: 0;
        display: inline
    }

    .arco-link.arco-link-hoverless:active,
    .arco-link.arco-link-hoverless:hover {
        background-color: unset
    }

    .arco-link.arco-link-disabled {
        color: var(--color-link-light-3);
        cursor: not-allowed;
        background: 0 0
    }

    .arco-link-is-success,
    .arco-link-is-success:hover,
    .arco-link-is-success:active {
        color: rgb(var(--success-6))
    }

    .arco-link-is-success.arco-link-disabled {
        color: var(--color-success-light-3)
    }

    .arco-link-is-error,
    .arco-link-is-error:hover,
    .arco-link-is-error:active {
        color: rgb(var(--danger-6))
    }

    .arco-link-is-error.arco-link-disabled {
        color: var(--color-danger-light-3)
    }

    .arco-link-is-warning,
    .arco-link-is-warning:hover,
    .arco-link-is-warning:active {
        color: rgb(var(--warning-6))
    }

    .arco-link-is-warning.arco-link-disabled {
        color: var(--color-warning-light-2)
    }

    .arco-link-icon {
        margin-right: 6px;
        font-size: 12px
    }

    .arco-link-rtl .arco-link-icon {
        margin-left: 6px;
        margin-right: 0
    }
}


@layer base {
    .arco-row {
        flex-flow: wrap;
        display: flex
    }

    .arco-row-align-start {
        align-items: flex-start
    }

    .arco-row-align-center {
        align-items: center
    }

    .arco-row-align-end {
        align-items: flex-end
    }

    .arco-row-justify-start {
        justify-content: flex-start
    }

    .arco-row-justify-center {
        justify-content: center
    }

    .arco-row-justify-end {
        justify-content: flex-end
    }

    .arco-row-justify-space-around {
        justify-content: space-around
    }

    .arco-row-justify-space-between {
        justify-content: space-between
    }

    .arco-row-rtl {
        direction: rtl
    }

    .arco-col {
        box-sizing: border-box;
        position: relative
    }

    .arco-col-rtl {
        direction: rtl
    }

    .arco-col-0 {
        display: none
    }

    .arco-col-1 {
        flex: 0 0 4.16667%;
        width: 4.16667%;
        display: block
    }

    .arco-col-2 {
        flex: 0 0 8.33333%;
        width: 8.33333%;
        display: block
    }

    .arco-col-3 {
        flex: 0 0 12.5%;
        width: 12.5%;
        display: block
    }

    .arco-col-4 {
        flex: 0 0 16.6667%;
        width: 16.6667%;
        display: block
    }

    .arco-col-5 {
        flex: 0 0 20.8333%;
        width: 20.8333%;
        display: block
    }

    .arco-col-6 {
        flex: 0 0 25%;
        width: 25%;
        display: block
    }

    .arco-col-7 {
        flex: 0 0 29.1667%;
        width: 29.1667%;
        display: block
    }

    .arco-col-8 {
        flex: 0 0 33.3333%;
        width: 33.3333%;
        display: block
    }

    .arco-col-9 {
        flex: 0 0 37.5%;
        width: 37.5%;
        display: block
    }

    .arco-col-10 {
        flex: 0 0 41.6667%;
        width: 41.6667%;
        display: block
    }

    .arco-col-11 {
        flex: 0 0 45.8333%;
        width: 45.8333%;
        display: block
    }

    .arco-col-12 {
        flex: 0 0 50%;
        width: 50%;
        display: block
    }

    .arco-col-13 {
        flex: 0 0 54.1667%;
        width: 54.1667%;
        display: block
    }

    .arco-col-14 {
        flex: 0 0 58.3333%;
        width: 58.3333%;
        display: block
    }

    .arco-col-15 {
        flex: 0 0 62.5%;
        width: 62.5%;
        display: block
    }

    .arco-col-16 {
        flex: 0 0 66.6667%;
        width: 66.6667%;
        display: block
    }

    .arco-col-17 {
        flex: 0 0 70.8333%;
        width: 70.8333%;
        display: block
    }

    .arco-col-18 {
        flex: 0 0 75%;
        width: 75%;
        display: block
    }

    .arco-col-19 {
        flex: 0 0 79.1667%;
        width: 79.1667%;
        display: block
    }

    .arco-col-20 {
        flex: 0 0 83.3333%;
        width: 83.3333%;
        display: block
    }

    .arco-col-21 {
        flex: 0 0 87.5%;
        width: 87.5%;
        display: block
    }

    .arco-col-22 {
        flex: 0 0 91.6667%;
        width: 91.6667%;
        display: block
    }

    .arco-col-23 {
        flex: 0 0 95.8333%;
        width: 95.8333%;
        display: block
    }

    .arco-col-24 {
        flex: 0 0 100%;
        width: 100%;
        display: block
    }

    .arco-col-offset-0 {
        margin-left: 0%
    }

    .arco-col-offset-0.arco-col-rtl {
        margin-left: 0;
        margin-right: 0%
    }

    .arco-col-offset-1 {
        margin-left: 4.16667%
    }

    .arco-col-offset-1.arco-col-rtl {
        margin-left: 0;
        margin-right: 4.16667%
    }

    .arco-col-offset-2 {
        margin-left: 8.33333%
    }

    .arco-col-offset-2.arco-col-rtl {
        margin-left: 0;
        margin-right: 8.33333%
    }

    .arco-col-offset-3 {
        margin-left: 12.5%
    }

    .arco-col-offset-3.arco-col-rtl {
        margin-left: 0;
        margin-right: 12.5%
    }

    .arco-col-offset-4 {
        margin-left: 16.6667%
    }

    .arco-col-offset-4.arco-col-rtl {
        margin-left: 0;
        margin-right: 16.6667%
    }

    .arco-col-offset-5 {
        margin-left: 20.8333%
    }

    .arco-col-offset-5.arco-col-rtl {
        margin-left: 0;
        margin-right: 20.8333%
    }

    .arco-col-offset-6 {
        margin-left: 25%
    }

    .arco-col-offset-6.arco-col-rtl {
        margin-left: 0;
        margin-right: 25%
    }

    .arco-col-offset-7 {
        margin-left: 29.1667%
    }

    .arco-col-offset-7.arco-col-rtl {
        margin-left: 0;
        margin-right: 29.1667%
    }

    .arco-col-offset-8 {
        margin-left: 33.3333%
    }

    .arco-col-offset-8.arco-col-rtl {
        margin-left: 0;
        margin-right: 33.3333%
    }

    .arco-col-offset-9 {
        margin-left: 37.5%
    }

    .arco-col-offset-9.arco-col-rtl {
        margin-left: 0;
        margin-right: 37.5%
    }

    .arco-col-offset-10 {
        margin-left: 41.6667%
    }

    .arco-col-offset-10.arco-col-rtl {
        margin-left: 0;
        margin-right: 41.6667%
    }

    .arco-col-offset-11 {
        margin-left: 45.8333%
    }

    .arco-col-offset-11.arco-col-rtl {
        margin-left: 0;
        margin-right: 45.8333%
    }

    .arco-col-offset-12 {
        margin-left: 50%
    }

    .arco-col-offset-12.arco-col-rtl {
        margin-left: 0;
        margin-right: 50%
    }

    .arco-col-offset-13 {
        margin-left: 54.1667%
    }

    .arco-col-offset-13.arco-col-rtl {
        margin-left: 0;
        margin-right: 54.1667%
    }

    .arco-col-offset-14 {
        margin-left: 58.3333%
    }

    .arco-col-offset-14.arco-col-rtl {
        margin-left: 0;
        margin-right: 58.3333%
    }

    .arco-col-offset-15 {
        margin-left: 62.5%
    }

    .arco-col-offset-15.arco-col-rtl {
        margin-left: 0;
        margin-right: 62.5%
    }

    .arco-col-offset-16 {
        margin-left: 66.6667%
    }

    .arco-col-offset-16.arco-col-rtl {
        margin-left: 0;
        margin-right: 66.6667%
    }

    .arco-col-offset-17 {
        margin-left: 70.8333%
    }

    .arco-col-offset-17.arco-col-rtl {
        margin-left: 0;
        margin-right: 70.8333%
    }

    .arco-col-offset-18 {
        margin-left: 75%
    }

    .arco-col-offset-18.arco-col-rtl {
        margin-left: 0;
        margin-right: 75%
    }

    .arco-col-offset-19 {
        margin-left: 79.1667%
    }

    .arco-col-offset-19.arco-col-rtl {
        margin-left: 0;
        margin-right: 79.1667%
    }

    .arco-col-offset-20 {
        margin-left: 83.3333%
    }

    .arco-col-offset-20.arco-col-rtl {
        margin-left: 0;
        margin-right: 83.3333%
    }

    .arco-col-offset-21 {
        margin-left: 87.5%
    }

    .arco-col-offset-21.arco-col-rtl {
        margin-left: 0;
        margin-right: 87.5%
    }

    .arco-col-offset-22 {
        margin-left: 91.6667%
    }

    .arco-col-offset-22.arco-col-rtl {
        margin-left: 0;
        margin-right: 91.6667%
    }

    .arco-col-offset-23 {
        margin-left: 95.8333%
    }

    .arco-col-offset-23.arco-col-rtl {
        margin-left: 0;
        margin-right: 95.8333%
    }

    .arco-col-order-0 {
        order: 0
    }

    .arco-col-order-1 {
        order: 1
    }

    .arco-col-order-2 {
        order: 2
    }

    .arco-col-order-3 {
        order: 3
    }

    .arco-col-order-4 {
        order: 4
    }

    .arco-col-order-5 {
        order: 5
    }

    .arco-col-order-6 {
        order: 6
    }

    .arco-col-order-7 {
        order: 7
    }

    .arco-col-order-8 {
        order: 8
    }

    .arco-col-order-9 {
        order: 9
    }

    .arco-col-order-10 {
        order: 10
    }

    .arco-col-order-11 {
        order: 11
    }

    .arco-col-order-12 {
        order: 12
    }

    .arco-col-order-13 {
        order: 13
    }

    .arco-col-order-14 {
        order: 14
    }

    .arco-col-order-15 {
        order: 15
    }

    .arco-col-order-16 {
        order: 16
    }

    .arco-col-order-17 {
        order: 17
    }

    .arco-col-order-18 {
        order: 18
    }

    .arco-col-order-19 {
        order: 19
    }

    .arco-col-order-20 {
        order: 20
    }

    .arco-col-order-21 {
        order: 21
    }

    .arco-col-order-22 {
        order: 22
    }

    .arco-col-order-23 {
        order: 23
    }

    .arco-col-order-24 {
        order: 24
    }

    .arco-col-pull-0 {
        right: 0%
    }

    .arco-col-pull-0.arco-col-rtl {
        right: unset;
        left: 0%
    }

    .arco-col-pull-1 {
        right: 4.16667%
    }

    .arco-col-pull-1.arco-col-rtl {
        right: unset;
        left: 4.16667%
    }

    .arco-col-pull-2 {
        right: 8.33333%
    }

    .arco-col-pull-2.arco-col-rtl {
        right: unset;
        left: 8.33333%
    }

    .arco-col-pull-3 {
        right: 12.5%
    }

    .arco-col-pull-3.arco-col-rtl {
        right: unset;
        left: 12.5%
    }

    .arco-col-pull-4 {
        right: 16.6667%
    }

    .arco-col-pull-4.arco-col-rtl {
        right: unset;
        left: 16.6667%
    }

    .arco-col-pull-5 {
        right: 20.8333%
    }

    .arco-col-pull-5.arco-col-rtl {
        right: unset;
        left: 20.8333%
    }

    .arco-col-pull-6 {
        right: 25%
    }

    .arco-col-pull-6.arco-col-rtl {
        right: unset;
        left: 25%
    }

    .arco-col-pull-7 {
        right: 29.1667%
    }

    .arco-col-pull-7.arco-col-rtl {
        right: unset;
        left: 29.1667%
    }

    .arco-col-pull-8 {
        right: 33.3333%
    }

    .arco-col-pull-8.arco-col-rtl {
        right: unset;
        left: 33.3333%
    }

    .arco-col-pull-9 {
        right: 37.5%
    }

    .arco-col-pull-9.arco-col-rtl {
        right: unset;
        left: 37.5%
    }

    .arco-col-pull-10 {
        right: 41.6667%
    }

    .arco-col-pull-10.arco-col-rtl {
        right: unset;
        left: 41.6667%
    }

    .arco-col-pull-11 {
        right: 45.8333%
    }

    .arco-col-pull-11.arco-col-rtl {
        right: unset;
        left: 45.8333%
    }

    .arco-col-pull-12 {
        right: 50%
    }

    .arco-col-pull-12.arco-col-rtl {
        right: unset;
        left: 50%
    }

    .arco-col-pull-13 {
        right: 54.1667%
    }

    .arco-col-pull-13.arco-col-rtl {
        right: unset;
        left: 54.1667%
    }

    .arco-col-pull-14 {
        right: 58.3333%
    }

    .arco-col-pull-14.arco-col-rtl {
        right: unset;
        left: 58.3333%
    }

    .arco-col-pull-15 {
        right: 62.5%
    }

    .arco-col-pull-15.arco-col-rtl {
        right: unset;
        left: 62.5%
    }

    .arco-col-pull-16 {
        right: 66.6667%
    }

    .arco-col-pull-16.arco-col-rtl {
        right: unset;
        left: 66.6667%
    }

    .arco-col-pull-17 {
        right: 70.8333%
    }

    .arco-col-pull-17.arco-col-rtl {
        right: unset;
        left: 70.8333%
    }

    .arco-col-pull-18 {
        right: 75%
    }

    .arco-col-pull-18.arco-col-rtl {
        right: unset;
        left: 75%
    }

    .arco-col-pull-19 {
        right: 79.1667%
    }

    .arco-col-pull-19.arco-col-rtl {
        right: unset;
        left: 79.1667%
    }

    .arco-col-pull-20 {
        right: 83.3333%
    }

    .arco-col-pull-20.arco-col-rtl {
        right: unset;
        left: 83.3333%
    }

    .arco-col-pull-21 {
        right: 87.5%
    }

    .arco-col-pull-21.arco-col-rtl {
        right: unset;
        left: 87.5%
    }

    .arco-col-pull-22 {
        right: 91.6667%
    }

    .arco-col-pull-22.arco-col-rtl {
        right: unset;
        left: 91.6667%
    }

    .arco-col-pull-23 {
        right: 95.8333%
    }

    .arco-col-pull-23.arco-col-rtl {
        right: unset;
        left: 95.8333%
    }

    .arco-col-pull-24 {
        right: 100%
    }

    .arco-col-pull-24.arco-col-rtl {
        right: unset;
        left: 100%
    }

    .arco-col-push-0 {
        left: 0%
    }

    .arco-col-push-0.arco-col-rtl {
        left: unset;
        right: 0%
    }

    .arco-col-push-1 {
        left: 4.16667%
    }

    .arco-col-push-1.arco-col-rtl {
        left: unset;
        right: 4.16667%
    }

    .arco-col-push-2 {
        left: 8.33333%
    }

    .arco-col-push-2.arco-col-rtl {
        left: unset;
        right: 8.33333%
    }

    .arco-col-push-3 {
        left: 12.5%
    }

    .arco-col-push-3.arco-col-rtl {
        left: unset;
        right: 12.5%
    }

    .arco-col-push-4 {
        left: 16.6667%
    }

    .arco-col-push-4.arco-col-rtl {
        left: unset;
        right: 16.6667%
    }

    .arco-col-push-5 {
        left: 20.8333%
    }

    .arco-col-push-5.arco-col-rtl {
        left: unset;
        right: 20.8333%
    }

    .arco-col-push-6 {
        left: 25%
    }

    .arco-col-push-6.arco-col-rtl {
        left: unset;
        right: 25%
    }

    .arco-col-push-7 {
        left: 29.1667%
    }

    .arco-col-push-7.arco-col-rtl {
        left: unset;
        right: 29.1667%
    }

    .arco-col-push-8 {
        left: 33.3333%
    }

    .arco-col-push-8.arco-col-rtl {
        left: unset;
        right: 33.3333%
    }

    .arco-col-push-9 {
        left: 37.5%
    }

    .arco-col-push-9.arco-col-rtl {
        left: unset;
        right: 37.5%
    }

    .arco-col-push-10 {
        left: 41.6667%
    }

    .arco-col-push-10.arco-col-rtl {
        left: unset;
        right: 41.6667%
    }

    .arco-col-push-11 {
        left: 45.8333%
    }

    .arco-col-push-11.arco-col-rtl {
        left: unset;
        right: 45.8333%
    }

    .arco-col-push-12 {
        left: 50%
    }

    .arco-col-push-12.arco-col-rtl {
        left: unset;
        right: 50%
    }

    .arco-col-push-13 {
        left: 54.1667%
    }

    .arco-col-push-13.arco-col-rtl {
        left: unset;
        right: 54.1667%
    }

    .arco-col-push-14 {
        left: 58.3333%
    }

    .arco-col-push-14.arco-col-rtl {
        left: unset;
        right: 58.3333%
    }

    .arco-col-push-15 {
        left: 62.5%
    }

    .arco-col-push-15.arco-col-rtl {
        left: unset;
        right: 62.5%
    }

    .arco-col-push-16 {
        left: 66.6667%
    }

    .arco-col-push-16.arco-col-rtl {
        left: unset;
        right: 66.6667%
    }

    .arco-col-push-17 {
        left: 70.8333%
    }

    .arco-col-push-17.arco-col-rtl {
        left: unset;
        right: 70.8333%
    }

    .arco-col-push-18 {
        left: 75%
    }

    .arco-col-push-18.arco-col-rtl {
        left: unset;
        right: 75%
    }

    .arco-col-push-19 {
        left: 79.1667%
    }

    .arco-col-push-19.arco-col-rtl {
        left: unset;
        right: 79.1667%
    }

    .arco-col-push-20 {
        left: 83.3333%
    }

    .arco-col-push-20.arco-col-rtl {
        left: unset;
        right: 83.3333%
    }

    .arco-col-push-21 {
        left: 87.5%
    }

    .arco-col-push-21.arco-col-rtl {
        left: unset;
        right: 87.5%
    }

    .arco-col-push-22 {
        left: 91.6667%
    }

    .arco-col-push-22.arco-col-rtl {
        left: unset;
        right: 91.6667%
    }

    .arco-col-push-23 {
        left: 95.8333%
    }

    .arco-col-push-23.arco-col-rtl {
        left: unset;
        right: 95.8333%
    }

    .arco-col-push-24 {
        left: 100%
    }

    .arco-col-push-24.arco-col-rtl {
        left: unset;
        right: 100%
    }

    .arco-col-xs-0 {
        display: none
    }

    .arco-col-xs-1 {
        flex: 0 0 4.16667%;
        width: 4.16667%;
        display: block
    }

    .arco-col-xs-2 {
        flex: 0 0 8.33333%;
        width: 8.33333%;
        display: block
    }

    .arco-col-xs-3 {
        flex: 0 0 12.5%;
        width: 12.5%;
        display: block
    }

    .arco-col-xs-4 {
        flex: 0 0 16.6667%;
        width: 16.6667%;
        display: block
    }

    .arco-col-xs-5 {
        flex: 0 0 20.8333%;
        width: 20.8333%;
        display: block
    }

    .arco-col-xs-6 {
        flex: 0 0 25%;
        width: 25%;
        display: block
    }

    .arco-col-xs-7 {
        flex: 0 0 29.1667%;
        width: 29.1667%;
        display: block
    }

    .arco-col-xs-8 {
        flex: 0 0 33.3333%;
        width: 33.3333%;
        display: block
    }

    .arco-col-xs-9 {
        flex: 0 0 37.5%;
        width: 37.5%;
        display: block
    }

    .arco-col-xs-10 {
        flex: 0 0 41.6667%;
        width: 41.6667%;
        display: block
    }

    .arco-col-xs-11 {
        flex: 0 0 45.8333%;
        width: 45.8333%;
        display: block
    }

    .arco-col-xs-12 {
        flex: 0 0 50%;
        width: 50%;
        display: block
    }

    .arco-col-xs-13 {
        flex: 0 0 54.1667%;
        width: 54.1667%;
        display: block
    }

    .arco-col-xs-14 {
        flex: 0 0 58.3333%;
        width: 58.3333%;
        display: block
    }

    .arco-col-xs-15 {
        flex: 0 0 62.5%;
        width: 62.5%;
        display: block
    }

    .arco-col-xs-16 {
        flex: 0 0 66.6667%;
        width: 66.6667%;
        display: block
    }

    .arco-col-xs-17 {
        flex: 0 0 70.8333%;
        width: 70.8333%;
        display: block
    }

    .arco-col-xs-18 {
        flex: 0 0 75%;
        width: 75%;
        display: block
    }

    .arco-col-xs-19 {
        flex: 0 0 79.1667%;
        width: 79.1667%;
        display: block
    }

    .arco-col-xs-20 {
        flex: 0 0 83.3333%;
        width: 83.3333%;
        display: block
    }

    .arco-col-xs-21 {
        flex: 0 0 87.5%;
        width: 87.5%;
        display: block
    }

    .arco-col-xs-22 {
        flex: 0 0 91.6667%;
        width: 91.6667%;
        display: block
    }

    .arco-col-xs-23 {
        flex: 0 0 95.8333%;
        width: 95.8333%;
        display: block
    }

    .arco-col-xs-24 {
        flex: 0 0 100%;
        width: 100%;
        display: block
    }

    .arco-col-xs-offset-0 {
        margin-left: 0%
    }

    .arco-col-xs-offset-0.arco-col-rtl {
        margin-left: 0;
        margin-right: 0%
    }

    .arco-col-xs-offset-1 {
        margin-left: 4.16667%
    }

    .arco-col-xs-offset-1.arco-col-rtl {
        margin-left: 0;
        margin-right: 4.16667%
    }

    .arco-col-xs-offset-2 {
        margin-left: 8.33333%
    }

    .arco-col-xs-offset-2.arco-col-rtl {
        margin-left: 0;
        margin-right: 8.33333%
    }

    .arco-col-xs-offset-3 {
        margin-left: 12.5%
    }

    .arco-col-xs-offset-3.arco-col-rtl {
        margin-left: 0;
        margin-right: 12.5%
    }

    .arco-col-xs-offset-4 {
        margin-left: 16.6667%
    }

    .arco-col-xs-offset-4.arco-col-rtl {
        margin-left: 0;
        margin-right: 16.6667%
    }

    .arco-col-xs-offset-5 {
        margin-left: 20.8333%
    }

    .arco-col-xs-offset-5.arco-col-rtl {
        margin-left: 0;
        margin-right: 20.8333%
    }

    .arco-col-xs-offset-6 {
        margin-left: 25%
    }

    .arco-col-xs-offset-6.arco-col-rtl {
        margin-left: 0;
        margin-right: 25%
    }

    .arco-col-xs-offset-7 {
        margin-left: 29.1667%
    }

    .arco-col-xs-offset-7.arco-col-rtl {
        margin-left: 0;
        margin-right: 29.1667%
    }

    .arco-col-xs-offset-8 {
        margin-left: 33.3333%
    }

    .arco-col-xs-offset-8.arco-col-rtl {
        margin-left: 0;
        margin-right: 33.3333%
    }

    .arco-col-xs-offset-9 {
        margin-left: 37.5%
    }

    .arco-col-xs-offset-9.arco-col-rtl {
        margin-left: 0;
        margin-right: 37.5%
    }

    .arco-col-xs-offset-10 {
        margin-left: 41.6667%
    }

    .arco-col-xs-offset-10.arco-col-rtl {
        margin-left: 0;
        margin-right: 41.6667%
    }

    .arco-col-xs-offset-11 {
        margin-left: 45.8333%
    }

    .arco-col-xs-offset-11.arco-col-rtl {
        margin-left: 0;
        margin-right: 45.8333%
    }

    .arco-col-xs-offset-12 {
        margin-left: 50%
    }

    .arco-col-xs-offset-12.arco-col-rtl {
        margin-left: 0;
        margin-right: 50%
    }

    .arco-col-xs-offset-13 {
        margin-left: 54.1667%
    }

    .arco-col-xs-offset-13.arco-col-rtl {
        margin-left: 0;
        margin-right: 54.1667%
    }

    .arco-col-xs-offset-14 {
        margin-left: 58.3333%
    }

    .arco-col-xs-offset-14.arco-col-rtl {
        margin-left: 0;
        margin-right: 58.3333%
    }

    .arco-col-xs-offset-15 {
        margin-left: 62.5%
    }

    .arco-col-xs-offset-15.arco-col-rtl {
        margin-left: 0;
        margin-right: 62.5%
    }

    .arco-col-xs-offset-16 {
        margin-left: 66.6667%
    }

    .arco-col-xs-offset-16.arco-col-rtl {
        margin-left: 0;
        margin-right: 66.6667%
    }

    .arco-col-xs-offset-17 {
        margin-left: 70.8333%
    }

    .arco-col-xs-offset-17.arco-col-rtl {
        margin-left: 0;
        margin-right: 70.8333%
    }

    .arco-col-xs-offset-18 {
        margin-left: 75%
    }

    .arco-col-xs-offset-18.arco-col-rtl {
        margin-left: 0;
        margin-right: 75%
    }

    .arco-col-xs-offset-19 {
        margin-left: 79.1667%
    }

    .arco-col-xs-offset-19.arco-col-rtl {
        margin-left: 0;
        margin-right: 79.1667%
    }

    .arco-col-xs-offset-20 {
        margin-left: 83.3333%
    }

    .arco-col-xs-offset-20.arco-col-rtl {
        margin-left: 0;
        margin-right: 83.3333%
    }

    .arco-col-xs-offset-21 {
        margin-left: 87.5%
    }

    .arco-col-xs-offset-21.arco-col-rtl {
        margin-left: 0;
        margin-right: 87.5%
    }

    .arco-col-xs-offset-22 {
        margin-left: 91.6667%
    }

    .arco-col-xs-offset-22.arco-col-rtl {
        margin-left: 0;
        margin-right: 91.6667%
    }

    .arco-col-xs-offset-23 {
        margin-left: 95.8333%
    }

    .arco-col-xs-offset-23.arco-col-rtl {
        margin-left: 0;
        margin-right: 95.8333%
    }

    .arco-col-xs-order-0 {
        order: 0
    }

    .arco-col-xs-order-1 {
        order: 1
    }

    .arco-col-xs-order-2 {
        order: 2
    }

    .arco-col-xs-order-3 {
        order: 3
    }

    .arco-col-xs-order-4 {
        order: 4
    }

    .arco-col-xs-order-5 {
        order: 5
    }

    .arco-col-xs-order-6 {
        order: 6
    }

    .arco-col-xs-order-7 {
        order: 7
    }

    .arco-col-xs-order-8 {
        order: 8
    }

    .arco-col-xs-order-9 {
        order: 9
    }

    .arco-col-xs-order-10 {
        order: 10
    }

    .arco-col-xs-order-11 {
        order: 11
    }

    .arco-col-xs-order-12 {
        order: 12
    }

    .arco-col-xs-order-13 {
        order: 13
    }

    .arco-col-xs-order-14 {
        order: 14
    }

    .arco-col-xs-order-15 {
        order: 15
    }

    .arco-col-xs-order-16 {
        order: 16
    }

    .arco-col-xs-order-17 {
        order: 17
    }

    .arco-col-xs-order-18 {
        order: 18
    }

    .arco-col-xs-order-19 {
        order: 19
    }

    .arco-col-xs-order-20 {
        order: 20
    }

    .arco-col-xs-order-21 {
        order: 21
    }

    .arco-col-xs-order-22 {
        order: 22
    }

    .arco-col-xs-order-23 {
        order: 23
    }

    .arco-col-xs-order-24 {
        order: 24
    }

    .arco-col-xs-pull-0 {
        right: 0%
    }

    .arco-col-xs-pull-0.arco-col-rtl {
        right: unset;
        left: 0%
    }

    .arco-col-xs-pull-1 {
        right: 4.16667%
    }

    .arco-col-xs-pull-1.arco-col-rtl {
        right: unset;
        left: 4.16667%
    }

    .arco-col-xs-pull-2 {
        right: 8.33333%
    }

    .arco-col-xs-pull-2.arco-col-rtl {
        right: unset;
        left: 8.33333%
    }

    .arco-col-xs-pull-3 {
        right: 12.5%
    }

    .arco-col-xs-pull-3.arco-col-rtl {
        right: unset;
        left: 12.5%
    }

    .arco-col-xs-pull-4 {
        right: 16.6667%
    }

    .arco-col-xs-pull-4.arco-col-rtl {
        right: unset;
        left: 16.6667%
    }

    .arco-col-xs-pull-5 {
        right: 20.8333%
    }

    .arco-col-xs-pull-5.arco-col-rtl {
        right: unset;
        left: 20.8333%
    }

    .arco-col-xs-pull-6 {
        right: 25%
    }

    .arco-col-xs-pull-6.arco-col-rtl {
        right: unset;
        left: 25%
    }

    .arco-col-xs-pull-7 {
        right: 29.1667%
    }

    .arco-col-xs-pull-7.arco-col-rtl {
        right: unset;
        left: 29.1667%
    }

    .arco-col-xs-pull-8 {
        right: 33.3333%
    }

    .arco-col-xs-pull-8.arco-col-rtl {
        right: unset;
        left: 33.3333%
    }

    .arco-col-xs-pull-9 {
        right: 37.5%
    }

    .arco-col-xs-pull-9.arco-col-rtl {
        right: unset;
        left: 37.5%
    }

    .arco-col-xs-pull-10 {
        right: 41.6667%
    }

    .arco-col-xs-pull-10.arco-col-rtl {
        right: unset;
        left: 41.6667%
    }

    .arco-col-xs-pull-11 {
        right: 45.8333%
    }

    .arco-col-xs-pull-11.arco-col-rtl {
        right: unset;
        left: 45.8333%
    }

    .arco-col-xs-pull-12 {
        right: 50%
    }

    .arco-col-xs-pull-12.arco-col-rtl {
        right: unset;
        left: 50%
    }

    .arco-col-xs-pull-13 {
        right: 54.1667%
    }

    .arco-col-xs-pull-13.arco-col-rtl {
        right: unset;
        left: 54.1667%
    }

    .arco-col-xs-pull-14 {
        right: 58.3333%
    }

    .arco-col-xs-pull-14.arco-col-rtl {
        right: unset;
        left: 58.3333%
    }

    .arco-col-xs-pull-15 {
        right: 62.5%
    }

    .arco-col-xs-pull-15.arco-col-rtl {
        right: unset;
        left: 62.5%
    }

    .arco-col-xs-pull-16 {
        right: 66.6667%
    }

    .arco-col-xs-pull-16.arco-col-rtl {
        right: unset;
        left: 66.6667%
    }

    .arco-col-xs-pull-17 {
        right: 70.8333%
    }

    .arco-col-xs-pull-17.arco-col-rtl {
        right: unset;
        left: 70.8333%
    }

    .arco-col-xs-pull-18 {
        right: 75%
    }

    .arco-col-xs-pull-18.arco-col-rtl {
        right: unset;
        left: 75%
    }

    .arco-col-xs-pull-19 {
        right: 79.1667%
    }

    .arco-col-xs-pull-19.arco-col-rtl {
        right: unset;
        left: 79.1667%
    }

    .arco-col-xs-pull-20 {
        right: 83.3333%
    }

    .arco-col-xs-pull-20.arco-col-rtl {
        right: unset;
        left: 83.3333%
    }

    .arco-col-xs-pull-21 {
        right: 87.5%
    }

    .arco-col-xs-pull-21.arco-col-rtl {
        right: unset;
        left: 87.5%
    }

    .arco-col-xs-pull-22 {
        right: 91.6667%
    }

    .arco-col-xs-pull-22.arco-col-rtl {
        right: unset;
        left: 91.6667%
    }

    .arco-col-xs-pull-23 {
        right: 95.8333%
    }

    .arco-col-xs-pull-23.arco-col-rtl {
        right: unset;
        left: 95.8333%
    }

    .arco-col-xs-pull-24 {
        right: 100%
    }

    .arco-col-xs-pull-24.arco-col-rtl {
        right: unset;
        left: 100%
    }

    .arco-col-xs-push-0 {
        left: 0%
    }

    .arco-col-xs-push-0.arco-col-rtl {
        left: unset;
        right: 0%
    }

    .arco-col-xs-push-1 {
        left: 4.16667%
    }

    .arco-col-xs-push-1.arco-col-rtl {
        left: unset;
        right: 4.16667%
    }

    .arco-col-xs-push-2 {
        left: 8.33333%
    }

    .arco-col-xs-push-2.arco-col-rtl {
        left: unset;
        right: 8.33333%
    }

    .arco-col-xs-push-3 {
        left: 12.5%
    }

    .arco-col-xs-push-3.arco-col-rtl {
        left: unset;
        right: 12.5%
    }

    .arco-col-xs-push-4 {
        left: 16.6667%
    }

    .arco-col-xs-push-4.arco-col-rtl {
        left: unset;
        right: 16.6667%
    }

    .arco-col-xs-push-5 {
        left: 20.8333%
    }

    .arco-col-xs-push-5.arco-col-rtl {
        left: unset;
        right: 20.8333%
    }

    .arco-col-xs-push-6 {
        left: 25%
    }

    .arco-col-xs-push-6.arco-col-rtl {
        left: unset;
        right: 25%
    }

    .arco-col-xs-push-7 {
        left: 29.1667%
    }

    .arco-col-xs-push-7.arco-col-rtl {
        left: unset;
        right: 29.1667%
    }

    .arco-col-xs-push-8 {
        left: 33.3333%
    }

    .arco-col-xs-push-8.arco-col-rtl {
        left: unset;
        right: 33.3333%
    }

    .arco-col-xs-push-9 {
        left: 37.5%
    }

    .arco-col-xs-push-9.arco-col-rtl {
        left: unset;
        right: 37.5%
    }

    .arco-col-xs-push-10 {
        left: 41.6667%
    }

    .arco-col-xs-push-10.arco-col-rtl {
        left: unset;
        right: 41.6667%
    }

    .arco-col-xs-push-11 {
        left: 45.8333%
    }

    .arco-col-xs-push-11.arco-col-rtl {
        left: unset;
        right: 45.8333%
    }

    .arco-col-xs-push-12 {
        left: 50%
    }

    .arco-col-xs-push-12.arco-col-rtl {
        left: unset;
        right: 50%
    }

    .arco-col-xs-push-13 {
        left: 54.1667%
    }

    .arco-col-xs-push-13.arco-col-rtl {
        left: unset;
        right: 54.1667%
    }

    .arco-col-xs-push-14 {
        left: 58.3333%
    }

    .arco-col-xs-push-14.arco-col-rtl {
        left: unset;
        right: 58.3333%
    }

    .arco-col-xs-push-15 {
        left: 62.5%
    }

    .arco-col-xs-push-15.arco-col-rtl {
        left: unset;
        right: 62.5%
    }

    .arco-col-xs-push-16 {
        left: 66.6667%
    }

    .arco-col-xs-push-16.arco-col-rtl {
        left: unset;
        right: 66.6667%
    }

    .arco-col-xs-push-17 {
        left: 70.8333%
    }

    .arco-col-xs-push-17.arco-col-rtl {
        left: unset;
        right: 70.8333%
    }

    .arco-col-xs-push-18 {
        left: 75%
    }

    .arco-col-xs-push-18.arco-col-rtl {
        left: unset;
        right: 75%
    }

    .arco-col-xs-push-19 {
        left: 79.1667%
    }

    .arco-col-xs-push-19.arco-col-rtl {
        left: unset;
        right: 79.1667%
    }

    .arco-col-xs-push-20 {
        left: 83.3333%
    }

    .arco-col-xs-push-20.arco-col-rtl {
        left: unset;
        right: 83.3333%
    }

    .arco-col-xs-push-21 {
        left: 87.5%
    }

    .arco-col-xs-push-21.arco-col-rtl {
        left: unset;
        right: 87.5%
    }

    .arco-col-xs-push-22 {
        left: 91.6667%
    }

    .arco-col-xs-push-22.arco-col-rtl {
        left: unset;
        right: 91.6667%
    }

    .arco-col-xs-push-23 {
        left: 95.8333%
    }

    .arco-col-xs-push-23.arco-col-rtl {
        left: unset;
        right: 95.8333%
    }

    .arco-col-xs-push-24 {
        left: 100%
    }

    .arco-col-xs-push-24.arco-col-rtl {
        left: unset;
        right: 100%
    }

    @media (min-width:576px) {
        .arco-col-sm-0 {
            display: none
        }

        .arco-col-sm-1 {
            flex: 0 0 4.16667%;
            width: 4.16667%;
            display: block
        }

        .arco-col-sm-2 {
            flex: 0 0 8.33333%;
            width: 8.33333%;
            display: block
        }

        .arco-col-sm-3 {
            flex: 0 0 12.5%;
            width: 12.5%;
            display: block
        }

        .arco-col-sm-4 {
            flex: 0 0 16.6667%;
            width: 16.6667%;
            display: block
        }

        .arco-col-sm-5 {
            flex: 0 0 20.8333%;
            width: 20.8333%;
            display: block
        }

        .arco-col-sm-6 {
            flex: 0 0 25%;
            width: 25%;
            display: block
        }

        .arco-col-sm-7 {
            flex: 0 0 29.1667%;
            width: 29.1667%;
            display: block
        }

        .arco-col-sm-8 {
            flex: 0 0 33.3333%;
            width: 33.3333%;
            display: block
        }

        .arco-col-sm-9 {
            flex: 0 0 37.5%;
            width: 37.5%;
            display: block
        }

        .arco-col-sm-10 {
            flex: 0 0 41.6667%;
            width: 41.6667%;
            display: block
        }

        .arco-col-sm-11 {
            flex: 0 0 45.8333%;
            width: 45.8333%;
            display: block
        }

        .arco-col-sm-12 {
            flex: 0 0 50%;
            width: 50%;
            display: block
        }

        .arco-col-sm-13 {
            flex: 0 0 54.1667%;
            width: 54.1667%;
            display: block
        }

        .arco-col-sm-14 {
            flex: 0 0 58.3333%;
            width: 58.3333%;
            display: block
        }

        .arco-col-sm-15 {
            flex: 0 0 62.5%;
            width: 62.5%;
            display: block
        }

        .arco-col-sm-16 {
            flex: 0 0 66.6667%;
            width: 66.6667%;
            display: block
        }

        .arco-col-sm-17 {
            flex: 0 0 70.8333%;
            width: 70.8333%;
            display: block
        }

        .arco-col-sm-18 {
            flex: 0 0 75%;
            width: 75%;
            display: block
        }

        .arco-col-sm-19 {
            flex: 0 0 79.1667%;
            width: 79.1667%;
            display: block
        }

        .arco-col-sm-20 {
            flex: 0 0 83.3333%;
            width: 83.3333%;
            display: block
        }

        .arco-col-sm-21 {
            flex: 0 0 87.5%;
            width: 87.5%;
            display: block
        }

        .arco-col-sm-22 {
            flex: 0 0 91.6667%;
            width: 91.6667%;
            display: block
        }

        .arco-col-sm-23 {
            flex: 0 0 95.8333%;
            width: 95.8333%;
            display: block
        }

        .arco-col-sm-24 {
            flex: 0 0 100%;
            width: 100%;
            display: block
        }

        .arco-col-sm-offset-0 {
            margin-left: 0%
        }

        .arco-col-sm-offset-0.arco-col-rtl {
            margin-left: 0;
            margin-right: 0%
        }

        .arco-col-sm-offset-1 {
            margin-left: 4.16667%
        }

        .arco-col-sm-offset-1.arco-col-rtl {
            margin-left: 0;
            margin-right: 4.16667%
        }

        .arco-col-sm-offset-2 {
            margin-left: 8.33333%
        }

        .arco-col-sm-offset-2.arco-col-rtl {
            margin-left: 0;
            margin-right: 8.33333%
        }

        .arco-col-sm-offset-3 {
            margin-left: 12.5%
        }

        .arco-col-sm-offset-3.arco-col-rtl {
            margin-left: 0;
            margin-right: 12.5%
        }

        .arco-col-sm-offset-4 {
            margin-left: 16.6667%
        }

        .arco-col-sm-offset-4.arco-col-rtl {
            margin-left: 0;
            margin-right: 16.6667%
        }

        .arco-col-sm-offset-5 {
            margin-left: 20.8333%
        }

        .arco-col-sm-offset-5.arco-col-rtl {
            margin-left: 0;
            margin-right: 20.8333%
        }

        .arco-col-sm-offset-6 {
            margin-left: 25%
        }

        .arco-col-sm-offset-6.arco-col-rtl {
            margin-left: 0;
            margin-right: 25%
        }

        .arco-col-sm-offset-7 {
            margin-left: 29.1667%
        }

        .arco-col-sm-offset-7.arco-col-rtl {
            margin-left: 0;
            margin-right: 29.1667%
        }

        .arco-col-sm-offset-8 {
            margin-left: 33.3333%
        }

        .arco-col-sm-offset-8.arco-col-rtl {
            margin-left: 0;
            margin-right: 33.3333%
        }

        .arco-col-sm-offset-9 {
            margin-left: 37.5%
        }

        .arco-col-sm-offset-9.arco-col-rtl {
            margin-left: 0;
            margin-right: 37.5%
        }

        .arco-col-sm-offset-10 {
            margin-left: 41.6667%
        }

        .arco-col-sm-offset-10.arco-col-rtl {
            margin-left: 0;
            margin-right: 41.6667%
        }

        .arco-col-sm-offset-11 {
            margin-left: 45.8333%
        }

        .arco-col-sm-offset-11.arco-col-rtl {
            margin-left: 0;
            margin-right: 45.8333%
        }

        .arco-col-sm-offset-12 {
            margin-left: 50%
        }

        .arco-col-sm-offset-12.arco-col-rtl {
            margin-left: 0;
            margin-right: 50%
        }

        .arco-col-sm-offset-13 {
            margin-left: 54.1667%
        }

        .arco-col-sm-offset-13.arco-col-rtl {
            margin-left: 0;
            margin-right: 54.1667%
        }

        .arco-col-sm-offset-14 {
            margin-left: 58.3333%
        }

        .arco-col-sm-offset-14.arco-col-rtl {
            margin-left: 0;
            margin-right: 58.3333%
        }

        .arco-col-sm-offset-15 {
            margin-left: 62.5%
        }

        .arco-col-sm-offset-15.arco-col-rtl {
            margin-left: 0;
            margin-right: 62.5%
        }

        .arco-col-sm-offset-16 {
            margin-left: 66.6667%
        }

        .arco-col-sm-offset-16.arco-col-rtl {
            margin-left: 0;
            margin-right: 66.6667%
        }

        .arco-col-sm-offset-17 {
            margin-left: 70.8333%
        }

        .arco-col-sm-offset-17.arco-col-rtl {
            margin-left: 0;
            margin-right: 70.8333%
        }

        .arco-col-sm-offset-18 {
            margin-left: 75%
        }

        .arco-col-sm-offset-18.arco-col-rtl {
            margin-left: 0;
            margin-right: 75%
        }

        .arco-col-sm-offset-19 {
            margin-left: 79.1667%
        }

        .arco-col-sm-offset-19.arco-col-rtl {
            margin-left: 0;
            margin-right: 79.1667%
        }

        .arco-col-sm-offset-20 {
            margin-left: 83.3333%
        }

        .arco-col-sm-offset-20.arco-col-rtl {
            margin-left: 0;
            margin-right: 83.3333%
        }

        .arco-col-sm-offset-21 {
            margin-left: 87.5%
        }

        .arco-col-sm-offset-21.arco-col-rtl {
            margin-left: 0;
            margin-right: 87.5%
        }

        .arco-col-sm-offset-22 {
            margin-left: 91.6667%
        }

        .arco-col-sm-offset-22.arco-col-rtl {
            margin-left: 0;
            margin-right: 91.6667%
        }

        .arco-col-sm-offset-23 {
            margin-left: 95.8333%
        }

        .arco-col-sm-offset-23.arco-col-rtl {
            margin-left: 0;
            margin-right: 95.8333%
        }

        .arco-col-sm-order-0 {
            order: 0
        }

        .arco-col-sm-order-1 {
            order: 1
        }

        .arco-col-sm-order-2 {
            order: 2
        }

        .arco-col-sm-order-3 {
            order: 3
        }

        .arco-col-sm-order-4 {
            order: 4
        }

        .arco-col-sm-order-5 {
            order: 5
        }

        .arco-col-sm-order-6 {
            order: 6
        }

        .arco-col-sm-order-7 {
            order: 7
        }

        .arco-col-sm-order-8 {
            order: 8
        }

        .arco-col-sm-order-9 {
            order: 9
        }

        .arco-col-sm-order-10 {
            order: 10
        }

        .arco-col-sm-order-11 {
            order: 11
        }

        .arco-col-sm-order-12 {
            order: 12
        }

        .arco-col-sm-order-13 {
            order: 13
        }

        .arco-col-sm-order-14 {
            order: 14
        }

        .arco-col-sm-order-15 {
            order: 15
        }

        .arco-col-sm-order-16 {
            order: 16
        }

        .arco-col-sm-order-17 {
            order: 17
        }

        .arco-col-sm-order-18 {
            order: 18
        }

        .arco-col-sm-order-19 {
            order: 19
        }

        .arco-col-sm-order-20 {
            order: 20
        }

        .arco-col-sm-order-21 {
            order: 21
        }

        .arco-col-sm-order-22 {
            order: 22
        }

        .arco-col-sm-order-23 {
            order: 23
        }

        .arco-col-sm-order-24 {
            order: 24
        }

        .arco-col-sm-pull-0 {
            right: 0%
        }

        .arco-col-sm-pull-0.arco-col-rtl {
            right: unset;
            left: 0%
        }

        .arco-col-sm-pull-1 {
            right: 4.16667%
        }

        .arco-col-sm-pull-1.arco-col-rtl {
            right: unset;
            left: 4.16667%
        }

        .arco-col-sm-pull-2 {
            right: 8.33333%
        }

        .arco-col-sm-pull-2.arco-col-rtl {
            right: unset;
            left: 8.33333%
        }

        .arco-col-sm-pull-3 {
            right: 12.5%
        }

        .arco-col-sm-pull-3.arco-col-rtl {
            right: unset;
            left: 12.5%
        }

        .arco-col-sm-pull-4 {
            right: 16.6667%
        }

        .arco-col-sm-pull-4.arco-col-rtl {
            right: unset;
            left: 16.6667%
        }

        .arco-col-sm-pull-5 {
            right: 20.8333%
        }

        .arco-col-sm-pull-5.arco-col-rtl {
            right: unset;
            left: 20.8333%
        }

        .arco-col-sm-pull-6 {
            right: 25%
        }

        .arco-col-sm-pull-6.arco-col-rtl {
            right: unset;
            left: 25%
        }

        .arco-col-sm-pull-7 {
            right: 29.1667%
        }

        .arco-col-sm-pull-7.arco-col-rtl {
            right: unset;
            left: 29.1667%
        }

        .arco-col-sm-pull-8 {
            right: 33.3333%
        }

        .arco-col-sm-pull-8.arco-col-rtl {
            right: unset;
            left: 33.3333%
        }

        .arco-col-sm-pull-9 {
            right: 37.5%
        }

        .arco-col-sm-pull-9.arco-col-rtl {
            right: unset;
            left: 37.5%
        }

        .arco-col-sm-pull-10 {
            right: 41.6667%
        }

        .arco-col-sm-pull-10.arco-col-rtl {
            right: unset;
            left: 41.6667%
        }

        .arco-col-sm-pull-11 {
            right: 45.8333%
        }

        .arco-col-sm-pull-11.arco-col-rtl {
            right: unset;
            left: 45.8333%
        }

        .arco-col-sm-pull-12 {
            right: 50%
        }

        .arco-col-sm-pull-12.arco-col-rtl {
            right: unset;
            left: 50%
        }

        .arco-col-sm-pull-13 {
            right: 54.1667%
        }

        .arco-col-sm-pull-13.arco-col-rtl {
            right: unset;
            left: 54.1667%
        }

        .arco-col-sm-pull-14 {
            right: 58.3333%
        }

        .arco-col-sm-pull-14.arco-col-rtl {
            right: unset;
            left: 58.3333%
        }

        .arco-col-sm-pull-15 {
            right: 62.5%
        }

        .arco-col-sm-pull-15.arco-col-rtl {
            right: unset;
            left: 62.5%
        }

        .arco-col-sm-pull-16 {
            right: 66.6667%
        }

        .arco-col-sm-pull-16.arco-col-rtl {
            right: unset;
            left: 66.6667%
        }

        .arco-col-sm-pull-17 {
            right: 70.8333%
        }

        .arco-col-sm-pull-17.arco-col-rtl {
            right: unset;
            left: 70.8333%
        }

        .arco-col-sm-pull-18 {
            right: 75%
        }

        .arco-col-sm-pull-18.arco-col-rtl {
            right: unset;
            left: 75%
        }

        .arco-col-sm-pull-19 {
            right: 79.1667%
        }

        .arco-col-sm-pull-19.arco-col-rtl {
            right: unset;
            left: 79.1667%
        }

        .arco-col-sm-pull-20 {
            right: 83.3333%
        }

        .arco-col-sm-pull-20.arco-col-rtl {
            right: unset;
            left: 83.3333%
        }

        .arco-col-sm-pull-21 {
            right: 87.5%
        }

        .arco-col-sm-pull-21.arco-col-rtl {
            right: unset;
            left: 87.5%
        }

        .arco-col-sm-pull-22 {
            right: 91.6667%
        }

        .arco-col-sm-pull-22.arco-col-rtl {
            right: unset;
            left: 91.6667%
        }

        .arco-col-sm-pull-23 {
            right: 95.8333%
        }

        .arco-col-sm-pull-23.arco-col-rtl {
            right: unset;
            left: 95.8333%
        }

        .arco-col-sm-pull-24 {
            right: 100%
        }

        .arco-col-sm-pull-24.arco-col-rtl {
            right: unset;
            left: 100%
        }

        .arco-col-sm-push-0 {
            left: 0%
        }

        .arco-col-sm-push-0.arco-col-rtl {
            left: unset;
            right: 0%
        }

        .arco-col-sm-push-1 {
            left: 4.16667%
        }

        .arco-col-sm-push-1.arco-col-rtl {
            left: unset;
            right: 4.16667%
        }

        .arco-col-sm-push-2 {
            left: 8.33333%
        }

        .arco-col-sm-push-2.arco-col-rtl {
            left: unset;
            right: 8.33333%
        }

        .arco-col-sm-push-3 {
            left: 12.5%
        }

        .arco-col-sm-push-3.arco-col-rtl {
            left: unset;
            right: 12.5%
        }

        .arco-col-sm-push-4 {
            left: 16.6667%
        }

        .arco-col-sm-push-4.arco-col-rtl {
            left: unset;
            right: 16.6667%
        }

        .arco-col-sm-push-5 {
            left: 20.8333%
        }

        .arco-col-sm-push-5.arco-col-rtl {
            left: unset;
            right: 20.8333%
        }

        .arco-col-sm-push-6 {
            left: 25%
        }

        .arco-col-sm-push-6.arco-col-rtl {
            left: unset;
            right: 25%
        }

        .arco-col-sm-push-7 {
            left: 29.1667%
        }

        .arco-col-sm-push-7.arco-col-rtl {
            left: unset;
            right: 29.1667%
        }

        .arco-col-sm-push-8 {
            left: 33.3333%
        }

        .arco-col-sm-push-8.arco-col-rtl {
            left: unset;
            right: 33.3333%
        }

        .arco-col-sm-push-9 {
            left: 37.5%
        }

        .arco-col-sm-push-9.arco-col-rtl {
            left: unset;
            right: 37.5%
        }

        .arco-col-sm-push-10 {
            left: 41.6667%
        }

        .arco-col-sm-push-10.arco-col-rtl {
            left: unset;
            right: 41.6667%
        }

        .arco-col-sm-push-11 {
            left: 45.8333%
        }

        .arco-col-sm-push-11.arco-col-rtl {
            left: unset;
            right: 45.8333%
        }

        .arco-col-sm-push-12 {
            left: 50%
        }

        .arco-col-sm-push-12.arco-col-rtl {
            left: unset;
            right: 50%
        }

        .arco-col-sm-push-13 {
            left: 54.1667%
        }

        .arco-col-sm-push-13.arco-col-rtl {
            left: unset;
            right: 54.1667%
        }

        .arco-col-sm-push-14 {
            left: 58.3333%
        }

        .arco-col-sm-push-14.arco-col-rtl {
            left: unset;
            right: 58.3333%
        }

        .arco-col-sm-push-15 {
            left: 62.5%
        }

        .arco-col-sm-push-15.arco-col-rtl {
            left: unset;
            right: 62.5%
        }

        .arco-col-sm-push-16 {
            left: 66.6667%
        }

        .arco-col-sm-push-16.arco-col-rtl {
            left: unset;
            right: 66.6667%
        }

        .arco-col-sm-push-17 {
            left: 70.8333%
        }

        .arco-col-sm-push-17.arco-col-rtl {
            left: unset;
            right: 70.8333%
        }

        .arco-col-sm-push-18 {
            left: 75%
        }

        .arco-col-sm-push-18.arco-col-rtl {
            left: unset;
            right: 75%
        }

        .arco-col-sm-push-19 {
            left: 79.1667%
        }

        .arco-col-sm-push-19.arco-col-rtl {
            left: unset;
            right: 79.1667%
        }

        .arco-col-sm-push-20 {
            left: 83.3333%
        }

        .arco-col-sm-push-20.arco-col-rtl {
            left: unset;
            right: 83.3333%
        }

        .arco-col-sm-push-21 {
            left: 87.5%
        }

        .arco-col-sm-push-21.arco-col-rtl {
            left: unset;
            right: 87.5%
        }

        .arco-col-sm-push-22 {
            left: 91.6667%
        }

        .arco-col-sm-push-22.arco-col-rtl {
            left: unset;
            right: 91.6667%
        }

        .arco-col-sm-push-23 {
            left: 95.8333%
        }

        .arco-col-sm-push-23.arco-col-rtl {
            left: unset;
            right: 95.8333%
        }

        .arco-col-sm-push-24 {
            left: 100%
        }

        .arco-col-sm-push-24.arco-col-rtl {
            left: unset;
            right: 100%
        }
    }

    @media (min-width:768px) {
        .arco-col-md-0 {
            display: none
        }

        .arco-col-md-1 {
            flex: 0 0 4.16667%;
            width: 4.16667%;
            display: block
        }

        .arco-col-md-2 {
            flex: 0 0 8.33333%;
            width: 8.33333%;
            display: block
        }

        .arco-col-md-3 {
            flex: 0 0 12.5%;
            width: 12.5%;
            display: block
        }

        .arco-col-md-4 {
            flex: 0 0 16.6667%;
            width: 16.6667%;
            display: block
        }

        .arco-col-md-5 {
            flex: 0 0 20.8333%;
            width: 20.8333%;
            display: block
        }

        .arco-col-md-6 {
            flex: 0 0 25%;
            width: 25%;
            display: block
        }

        .arco-col-md-7 {
            flex: 0 0 29.1667%;
            width: 29.1667%;
            display: block
        }

        .arco-col-md-8 {
            flex: 0 0 33.3333%;
            width: 33.3333%;
            display: block
        }

        .arco-col-md-9 {
            flex: 0 0 37.5%;
            width: 37.5%;
            display: block
        }

        .arco-col-md-10 {
            flex: 0 0 41.6667%;
            width: 41.6667%;
            display: block
        }

        .arco-col-md-11 {
            flex: 0 0 45.8333%;
            width: 45.8333%;
            display: block
        }

        .arco-col-md-12 {
            flex: 0 0 50%;
            width: 50%;
            display: block
        }

        .arco-col-md-13 {
            flex: 0 0 54.1667%;
            width: 54.1667%;
            display: block
        }

        .arco-col-md-14 {
            flex: 0 0 58.3333%;
            width: 58.3333%;
            display: block
        }

        .arco-col-md-15 {
            flex: 0 0 62.5%;
            width: 62.5%;
            display: block
        }

        .arco-col-md-16 {
            flex: 0 0 66.6667%;
            width: 66.6667%;
            display: block
        }

        .arco-col-md-17 {
            flex: 0 0 70.8333%;
            width: 70.8333%;
            display: block
        }

        .arco-col-md-18 {
            flex: 0 0 75%;
            width: 75%;
            display: block
        }

        .arco-col-md-19 {
            flex: 0 0 79.1667%;
            width: 79.1667%;
            display: block
        }

        .arco-col-md-20 {
            flex: 0 0 83.3333%;
            width: 83.3333%;
            display: block
        }

        .arco-col-md-21 {
            flex: 0 0 87.5%;
            width: 87.5%;
            display: block
        }

        .arco-col-md-22 {
            flex: 0 0 91.6667%;
            width: 91.6667%;
            display: block
        }

        .arco-col-md-23 {
            flex: 0 0 95.8333%;
            width: 95.8333%;
            display: block
        }

        .arco-col-md-24 {
            flex: 0 0 100%;
            width: 100%;
            display: block
        }

        .arco-col-md-offset-0 {
            margin-left: 0%
        }

        .arco-col-md-offset-0.arco-col-rtl {
            margin-left: 0;
            margin-right: 0%
        }

        .arco-col-md-offset-1 {
            margin-left: 4.16667%
        }

        .arco-col-md-offset-1.arco-col-rtl {
            margin-left: 0;
            margin-right: 4.16667%
        }

        .arco-col-md-offset-2 {
            margin-left: 8.33333%
        }

        .arco-col-md-offset-2.arco-col-rtl {
            margin-left: 0;
            margin-right: 8.33333%
        }

        .arco-col-md-offset-3 {
            margin-left: 12.5%
        }

        .arco-col-md-offset-3.arco-col-rtl {
            margin-left: 0;
            margin-right: 12.5%
        }

        .arco-col-md-offset-4 {
            margin-left: 16.6667%
        }

        .arco-col-md-offset-4.arco-col-rtl {
            margin-left: 0;
            margin-right: 16.6667%
        }

        .arco-col-md-offset-5 {
            margin-left: 20.8333%
        }

        .arco-col-md-offset-5.arco-col-rtl {
            margin-left: 0;
            margin-right: 20.8333%
        }

        .arco-col-md-offset-6 {
            margin-left: 25%
        }

        .arco-col-md-offset-6.arco-col-rtl {
            margin-left: 0;
            margin-right: 25%
        }

        .arco-col-md-offset-7 {
            margin-left: 29.1667%
        }

        .arco-col-md-offset-7.arco-col-rtl {
            margin-left: 0;
            margin-right: 29.1667%
        }

        .arco-col-md-offset-8 {
            margin-left: 33.3333%
        }

        .arco-col-md-offset-8.arco-col-rtl {
            margin-left: 0;
            margin-right: 33.3333%
        }

        .arco-col-md-offset-9 {
            margin-left: 37.5%
        }

        .arco-col-md-offset-9.arco-col-rtl {
            margin-left: 0;
            margin-right: 37.5%
        }

        .arco-col-md-offset-10 {
            margin-left: 41.6667%
        }

        .arco-col-md-offset-10.arco-col-rtl {
            margin-left: 0;
            margin-right: 41.6667%
        }

        .arco-col-md-offset-11 {
            margin-left: 45.8333%
        }

        .arco-col-md-offset-11.arco-col-rtl {
            margin-left: 0;
            margin-right: 45.8333%
        }

        .arco-col-md-offset-12 {
            margin-left: 50%
        }

        .arco-col-md-offset-12.arco-col-rtl {
            margin-left: 0;
            margin-right: 50%
        }

        .arco-col-md-offset-13 {
            margin-left: 54.1667%
        }

        .arco-col-md-offset-13.arco-col-rtl {
            margin-left: 0;
            margin-right: 54.1667%
        }

        .arco-col-md-offset-14 {
            margin-left: 58.3333%
        }

        .arco-col-md-offset-14.arco-col-rtl {
            margin-left: 0;
            margin-right: 58.3333%
        }

        .arco-col-md-offset-15 {
            margin-left: 62.5%
        }

        .arco-col-md-offset-15.arco-col-rtl {
            margin-left: 0;
            margin-right: 62.5%
        }

        .arco-col-md-offset-16 {
            margin-left: 66.6667%
        }

        .arco-col-md-offset-16.arco-col-rtl {
            margin-left: 0;
            margin-right: 66.6667%
        }

        .arco-col-md-offset-17 {
            margin-left: 70.8333%
        }

        .arco-col-md-offset-17.arco-col-rtl {
            margin-left: 0;
            margin-right: 70.8333%
        }

        .arco-col-md-offset-18 {
            margin-left: 75%
        }

        .arco-col-md-offset-18.arco-col-rtl {
            margin-left: 0;
            margin-right: 75%
        }

        .arco-col-md-offset-19 {
            margin-left: 79.1667%
        }

        .arco-col-md-offset-19.arco-col-rtl {
            margin-left: 0;
            margin-right: 79.1667%
        }

        .arco-col-md-offset-20 {
            margin-left: 83.3333%
        }

        .arco-col-md-offset-20.arco-col-rtl {
            margin-left: 0;
            margin-right: 83.3333%
        }

        .arco-col-md-offset-21 {
            margin-left: 87.5%
        }

        .arco-col-md-offset-21.arco-col-rtl {
            margin-left: 0;
            margin-right: 87.5%
        }

        .arco-col-md-offset-22 {
            margin-left: 91.6667%
        }

        .arco-col-md-offset-22.arco-col-rtl {
            margin-left: 0;
            margin-right: 91.6667%
        }

        .arco-col-md-offset-23 {
            margin-left: 95.8333%
        }

        .arco-col-md-offset-23.arco-col-rtl {
            margin-left: 0;
            margin-right: 95.8333%
        }

        .arco-col-md-order-0 {
            order: 0
        }

        .arco-col-md-order-1 {
            order: 1
        }

        .arco-col-md-order-2 {
            order: 2
        }

        .arco-col-md-order-3 {
            order: 3
        }

        .arco-col-md-order-4 {
            order: 4
        }

        .arco-col-md-order-5 {
            order: 5
        }

        .arco-col-md-order-6 {
            order: 6
        }

        .arco-col-md-order-7 {
            order: 7
        }

        .arco-col-md-order-8 {
            order: 8
        }

        .arco-col-md-order-9 {
            order: 9
        }

        .arco-col-md-order-10 {
            order: 10
        }

        .arco-col-md-order-11 {
            order: 11
        }

        .arco-col-md-order-12 {
            order: 12
        }

        .arco-col-md-order-13 {
            order: 13
        }

        .arco-col-md-order-14 {
            order: 14
        }

        .arco-col-md-order-15 {
            order: 15
        }

        .arco-col-md-order-16 {
            order: 16
        }

        .arco-col-md-order-17 {
            order: 17
        }

        .arco-col-md-order-18 {
            order: 18
        }

        .arco-col-md-order-19 {
            order: 19
        }

        .arco-col-md-order-20 {
            order: 20
        }

        .arco-col-md-order-21 {
            order: 21
        }

        .arco-col-md-order-22 {
            order: 22
        }

        .arco-col-md-order-23 {
            order: 23
        }

        .arco-col-md-order-24 {
            order: 24
        }

        .arco-col-md-pull-0 {
            right: 0%
        }

        .arco-col-md-pull-0.arco-col-rtl {
            right: unset;
            left: 0%
        }

        .arco-col-md-pull-1 {
            right: 4.16667%
        }

        .arco-col-md-pull-1.arco-col-rtl {
            right: unset;
            left: 4.16667%
        }

        .arco-col-md-pull-2 {
            right: 8.33333%
        }

        .arco-col-md-pull-2.arco-col-rtl {
            right: unset;
            left: 8.33333%
        }

        .arco-col-md-pull-3 {
            right: 12.5%
        }

        .arco-col-md-pull-3.arco-col-rtl {
            right: unset;
            left: 12.5%
        }

        .arco-col-md-pull-4 {
            right: 16.6667%
        }

        .arco-col-md-pull-4.arco-col-rtl {
            right: unset;
            left: 16.6667%
        }

        .arco-col-md-pull-5 {
            right: 20.8333%
        }

        .arco-col-md-pull-5.arco-col-rtl {
            right: unset;
            left: 20.8333%
        }

        .arco-col-md-pull-6 {
            right: 25%
        }

        .arco-col-md-pull-6.arco-col-rtl {
            right: unset;
            left: 25%
        }

        .arco-col-md-pull-7 {
            right: 29.1667%
        }

        .arco-col-md-pull-7.arco-col-rtl {
            right: unset;
            left: 29.1667%
        }

        .arco-col-md-pull-8 {
            right: 33.3333%
        }

        .arco-col-md-pull-8.arco-col-rtl {
            right: unset;
            left: 33.3333%
        }

        .arco-col-md-pull-9 {
            right: 37.5%
        }

        .arco-col-md-pull-9.arco-col-rtl {
            right: unset;
            left: 37.5%
        }

        .arco-col-md-pull-10 {
            right: 41.6667%
        }

        .arco-col-md-pull-10.arco-col-rtl {
            right: unset;
            left: 41.6667%
        }

        .arco-col-md-pull-11 {
            right: 45.8333%
        }

        .arco-col-md-pull-11.arco-col-rtl {
            right: unset;
            left: 45.8333%
        }

        .arco-col-md-pull-12 {
            right: 50%
        }

        .arco-col-md-pull-12.arco-col-rtl {
            right: unset;
            left: 50%
        }

        .arco-col-md-pull-13 {
            right: 54.1667%
        }

        .arco-col-md-pull-13.arco-col-rtl {
            right: unset;
            left: 54.1667%
        }

        .arco-col-md-pull-14 {
            right: 58.3333%
        }

        .arco-col-md-pull-14.arco-col-rtl {
            right: unset;
            left: 58.3333%
        }

        .arco-col-md-pull-15 {
            right: 62.5%
        }

        .arco-col-md-pull-15.arco-col-rtl {
            right: unset;
            left: 62.5%
        }

        .arco-col-md-pull-16 {
            right: 66.6667%
        }

        .arco-col-md-pull-16.arco-col-rtl {
            right: unset;
            left: 66.6667%
        }

        .arco-col-md-pull-17 {
            right: 70.8333%
        }

        .arco-col-md-pull-17.arco-col-rtl {
            right: unset;
            left: 70.8333%
        }

        .arco-col-md-pull-18 {
            right: 75%
        }

        .arco-col-md-pull-18.arco-col-rtl {
            right: unset;
            left: 75%
        }

        .arco-col-md-pull-19 {
            right: 79.1667%
        }

        .arco-col-md-pull-19.arco-col-rtl {
            right: unset;
            left: 79.1667%
        }

        .arco-col-md-pull-20 {
            right: 83.3333%
        }

        .arco-col-md-pull-20.arco-col-rtl {
            right: unset;
            left: 83.3333%
        }

        .arco-col-md-pull-21 {
            right: 87.5%
        }

        .arco-col-md-pull-21.arco-col-rtl {
            right: unset;
            left: 87.5%
        }

        .arco-col-md-pull-22 {
            right: 91.6667%
        }

        .arco-col-md-pull-22.arco-col-rtl {
            right: unset;
            left: 91.6667%
        }

        .arco-col-md-pull-23 {
            right: 95.8333%
        }

        .arco-col-md-pull-23.arco-col-rtl {
            right: unset;
            left: 95.8333%
        }

        .arco-col-md-pull-24 {
            right: 100%
        }

        .arco-col-md-pull-24.arco-col-rtl {
            right: unset;
            left: 100%
        }

        .arco-col-md-push-0 {
            left: 0%
        }

        .arco-col-md-push-0.arco-col-rtl {
            left: unset;
            right: 0%
        }

        .arco-col-md-push-1 {
            left: 4.16667%
        }

        .arco-col-md-push-1.arco-col-rtl {
            left: unset;
            right: 4.16667%
        }

        .arco-col-md-push-2 {
            left: 8.33333%
        }

        .arco-col-md-push-2.arco-col-rtl {
            left: unset;
            right: 8.33333%
        }

        .arco-col-md-push-3 {
            left: 12.5%
        }

        .arco-col-md-push-3.arco-col-rtl {
            left: unset;
            right: 12.5%
        }

        .arco-col-md-push-4 {
            left: 16.6667%
        }

        .arco-col-md-push-4.arco-col-rtl {
            left: unset;
            right: 16.6667%
        }

        .arco-col-md-push-5 {
            left: 20.8333%
        }

        .arco-col-md-push-5.arco-col-rtl {
            left: unset;
            right: 20.8333%
        }

        .arco-col-md-push-6 {
            left: 25%
        }

        .arco-col-md-push-6.arco-col-rtl {
            left: unset;
            right: 25%
        }

        .arco-col-md-push-7 {
            left: 29.1667%
        }

        .arco-col-md-push-7.arco-col-rtl {
            left: unset;
            right: 29.1667%
        }

        .arco-col-md-push-8 {
            left: 33.3333%
        }

        .arco-col-md-push-8.arco-col-rtl {
            left: unset;
            right: 33.3333%
        }

        .arco-col-md-push-9 {
            left: 37.5%
        }

        .arco-col-md-push-9.arco-col-rtl {
            left: unset;
            right: 37.5%
        }

        .arco-col-md-push-10 {
            left: 41.6667%
        }

        .arco-col-md-push-10.arco-col-rtl {
            left: unset;
            right: 41.6667%
        }

        .arco-col-md-push-11 {
            left: 45.8333%
        }

        .arco-col-md-push-11.arco-col-rtl {
            left: unset;
            right: 45.8333%
        }

        .arco-col-md-push-12 {
            left: 50%
        }

        .arco-col-md-push-12.arco-col-rtl {
            left: unset;
            right: 50%
        }

        .arco-col-md-push-13 {
            left: 54.1667%
        }

        .arco-col-md-push-13.arco-col-rtl {
            left: unset;
            right: 54.1667%
        }

        .arco-col-md-push-14 {
            left: 58.3333%
        }

        .arco-col-md-push-14.arco-col-rtl {
            left: unset;
            right: 58.3333%
        }

        .arco-col-md-push-15 {
            left: 62.5%
        }

        .arco-col-md-push-15.arco-col-rtl {
            left: unset;
            right: 62.5%
        }

        .arco-col-md-push-16 {
            left: 66.6667%
        }

        .arco-col-md-push-16.arco-col-rtl {
            left: unset;
            right: 66.6667%
        }

        .arco-col-md-push-17 {
            left: 70.8333%
        }

        .arco-col-md-push-17.arco-col-rtl {
            left: unset;
            right: 70.8333%
        }

        .arco-col-md-push-18 {
            left: 75%
        }

        .arco-col-md-push-18.arco-col-rtl {
            left: unset;
            right: 75%
        }

        .arco-col-md-push-19 {
            left: 79.1667%
        }

        .arco-col-md-push-19.arco-col-rtl {
            left: unset;
            right: 79.1667%
        }

        .arco-col-md-push-20 {
            left: 83.3333%
        }

        .arco-col-md-push-20.arco-col-rtl {
            left: unset;
            right: 83.3333%
        }

        .arco-col-md-push-21 {
            left: 87.5%
        }

        .arco-col-md-push-21.arco-col-rtl {
            left: unset;
            right: 87.5%
        }

        .arco-col-md-push-22 {
            left: 91.6667%
        }

        .arco-col-md-push-22.arco-col-rtl {
            left: unset;
            right: 91.6667%
        }

        .arco-col-md-push-23 {
            left: 95.8333%
        }

        .arco-col-md-push-23.arco-col-rtl {
            left: unset;
            right: 95.8333%
        }

        .arco-col-md-push-24 {
            left: 100%
        }

        .arco-col-md-push-24.arco-col-rtl {
            left: unset;
            right: 100%
        }
    }

    @media (min-width:992px) {
        .arco-col-lg-0 {
            display: none
        }

        .arco-col-lg-1 {
            flex: 0 0 4.16667%;
            width: 4.16667%;
            display: block
        }

        .arco-col-lg-2 {
            flex: 0 0 8.33333%;
            width: 8.33333%;
            display: block
        }

        .arco-col-lg-3 {
            flex: 0 0 12.5%;
            width: 12.5%;
            display: block
        }

        .arco-col-lg-4 {
            flex: 0 0 16.6667%;
            width: 16.6667%;
            display: block
        }

        .arco-col-lg-5 {
            flex: 0 0 20.8333%;
            width: 20.8333%;
            display: block
        }

        .arco-col-lg-6 {
            flex: 0 0 25%;
            width: 25%;
            display: block
        }

        .arco-col-lg-7 {
            flex: 0 0 29.1667%;
            width: 29.1667%;
            display: block
        }

        .arco-col-lg-8 {
            flex: 0 0 33.3333%;
            width: 33.3333%;
            display: block
        }

        .arco-col-lg-9 {
            flex: 0 0 37.5%;
            width: 37.5%;
            display: block
        }

        .arco-col-lg-10 {
            flex: 0 0 41.6667%;
            width: 41.6667%;
            display: block
        }

        .arco-col-lg-11 {
            flex: 0 0 45.8333%;
            width: 45.8333%;
            display: block
        }

        .arco-col-lg-12 {
            flex: 0 0 50%;
            width: 50%;
            display: block
        }

        .arco-col-lg-13 {
            flex: 0 0 54.1667%;
            width: 54.1667%;
            display: block
        }

        .arco-col-lg-14 {
            flex: 0 0 58.3333%;
            width: 58.3333%;
            display: block
        }

        .arco-col-lg-15 {
            flex: 0 0 62.5%;
            width: 62.5%;
            display: block
        }

        .arco-col-lg-16 {
            flex: 0 0 66.6667%;
            width: 66.6667%;
            display: block
        }

        .arco-col-lg-17 {
            flex: 0 0 70.8333%;
            width: 70.8333%;
            display: block
        }

        .arco-col-lg-18 {
            flex: 0 0 75%;
            width: 75%;
            display: block
        }

        .arco-col-lg-19 {
            flex: 0 0 79.1667%;
            width: 79.1667%;
            display: block
        }

        .arco-col-lg-20 {
            flex: 0 0 83.3333%;
            width: 83.3333%;
            display: block
        }

        .arco-col-lg-21 {
            flex: 0 0 87.5%;
            width: 87.5%;
            display: block
        }

        .arco-col-lg-22 {
            flex: 0 0 91.6667%;
            width: 91.6667%;
            display: block
        }

        .arco-col-lg-23 {
            flex: 0 0 95.8333%;
            width: 95.8333%;
            display: block
        }

        .arco-col-lg-24 {
            flex: 0 0 100%;
            width: 100%;
            display: block
        }

        .arco-col-lg-offset-0 {
            margin-left: 0%
        }

        .arco-col-lg-offset-0.arco-col-rtl {
            margin-left: 0;
            margin-right: 0%
        }

        .arco-col-lg-offset-1 {
            margin-left: 4.16667%
        }

        .arco-col-lg-offset-1.arco-col-rtl {
            margin-left: 0;
            margin-right: 4.16667%
        }

        .arco-col-lg-offset-2 {
            margin-left: 8.33333%
        }

        .arco-col-lg-offset-2.arco-col-rtl {
            margin-left: 0;
            margin-right: 8.33333%
        }

        .arco-col-lg-offset-3 {
            margin-left: 12.5%
        }

        .arco-col-lg-offset-3.arco-col-rtl {
            margin-left: 0;
            margin-right: 12.5%
        }

        .arco-col-lg-offset-4 {
            margin-left: 16.6667%
        }

        .arco-col-lg-offset-4.arco-col-rtl {
            margin-left: 0;
            margin-right: 16.6667%
        }

        .arco-col-lg-offset-5 {
            margin-left: 20.8333%
        }

        .arco-col-lg-offset-5.arco-col-rtl {
            margin-left: 0;
            margin-right: 20.8333%
        }

        .arco-col-lg-offset-6 {
            margin-left: 25%
        }

        .arco-col-lg-offset-6.arco-col-rtl {
            margin-left: 0;
            margin-right: 25%
        }

        .arco-col-lg-offset-7 {
            margin-left: 29.1667%
        }

        .arco-col-lg-offset-7.arco-col-rtl {
            margin-left: 0;
            margin-right: 29.1667%
        }

        .arco-col-lg-offset-8 {
            margin-left: 33.3333%
        }

        .arco-col-lg-offset-8.arco-col-rtl {
            margin-left: 0;
            margin-right: 33.3333%
        }

        .arco-col-lg-offset-9 {
            margin-left: 37.5%
        }

        .arco-col-lg-offset-9.arco-col-rtl {
            margin-left: 0;
            margin-right: 37.5%
        }

        .arco-col-lg-offset-10 {
            margin-left: 41.6667%
        }

        .arco-col-lg-offset-10.arco-col-rtl {
            margin-left: 0;
            margin-right: 41.6667%
        }

        .arco-col-lg-offset-11 {
            margin-left: 45.8333%
        }

        .arco-col-lg-offset-11.arco-col-rtl {
            margin-left: 0;
            margin-right: 45.8333%
        }

        .arco-col-lg-offset-12 {
            margin-left: 50%
        }

        .arco-col-lg-offset-12.arco-col-rtl {
            margin-left: 0;
            margin-right: 50%
        }

        .arco-col-lg-offset-13 {
            margin-left: 54.1667%
        }

        .arco-col-lg-offset-13.arco-col-rtl {
            margin-left: 0;
            margin-right: 54.1667%
        }

        .arco-col-lg-offset-14 {
            margin-left: 58.3333%
        }

        .arco-col-lg-offset-14.arco-col-rtl {
            margin-left: 0;
            margin-right: 58.3333%
        }

        .arco-col-lg-offset-15 {
            margin-left: 62.5%
        }

        .arco-col-lg-offset-15.arco-col-rtl {
            margin-left: 0;
            margin-right: 62.5%
        }

        .arco-col-lg-offset-16 {
            margin-left: 66.6667%
        }

        .arco-col-lg-offset-16.arco-col-rtl {
            margin-left: 0;
            margin-right: 66.6667%
        }

        .arco-col-lg-offset-17 {
            margin-left: 70.8333%
        }

        .arco-col-lg-offset-17.arco-col-rtl {
            margin-left: 0;
            margin-right: 70.8333%
        }

        .arco-col-lg-offset-18 {
            margin-left: 75%
        }

        .arco-col-lg-offset-18.arco-col-rtl {
            margin-left: 0;
            margin-right: 75%
        }

        .arco-col-lg-offset-19 {
            margin-left: 79.1667%
        }

        .arco-col-lg-offset-19.arco-col-rtl {
            margin-left: 0;
            margin-right: 79.1667%
        }

        .arco-col-lg-offset-20 {
            margin-left: 83.3333%
        }

        .arco-col-lg-offset-20.arco-col-rtl {
            margin-left: 0;
            margin-right: 83.3333%
        }

        .arco-col-lg-offset-21 {
            margin-left: 87.5%
        }

        .arco-col-lg-offset-21.arco-col-rtl {
            margin-left: 0;
            margin-right: 87.5%
        }

        .arco-col-lg-offset-22 {
            margin-left: 91.6667%
        }

        .arco-col-lg-offset-22.arco-col-rtl {
            margin-left: 0;
            margin-right: 91.6667%
        }

        .arco-col-lg-offset-23 {
            margin-left: 95.8333%
        }

        .arco-col-lg-offset-23.arco-col-rtl {
            margin-left: 0;
            margin-right: 95.8333%
        }

        .arco-col-lg-order-0 {
            order: 0
        }

        .arco-col-lg-order-1 {
            order: 1
        }

        .arco-col-lg-order-2 {
            order: 2
        }

        .arco-col-lg-order-3 {
            order: 3
        }

        .arco-col-lg-order-4 {
            order: 4
        }

        .arco-col-lg-order-5 {
            order: 5
        }

        .arco-col-lg-order-6 {
            order: 6
        }

        .arco-col-lg-order-7 {
            order: 7
        }

        .arco-col-lg-order-8 {
            order: 8
        }

        .arco-col-lg-order-9 {
            order: 9
        }

        .arco-col-lg-order-10 {
            order: 10
        }

        .arco-col-lg-order-11 {
            order: 11
        }

        .arco-col-lg-order-12 {
            order: 12
        }

        .arco-col-lg-order-13 {
            order: 13
        }

        .arco-col-lg-order-14 {
            order: 14
        }

        .arco-col-lg-order-15 {
            order: 15
        }

        .arco-col-lg-order-16 {
            order: 16
        }

        .arco-col-lg-order-17 {
            order: 17
        }

        .arco-col-lg-order-18 {
            order: 18
        }

        .arco-col-lg-order-19 {
            order: 19
        }

        .arco-col-lg-order-20 {
            order: 20
        }

        .arco-col-lg-order-21 {
            order: 21
        }

        .arco-col-lg-order-22 {
            order: 22
        }

        .arco-col-lg-order-23 {
            order: 23
        }

        .arco-col-lg-order-24 {
            order: 24
        }

        .arco-col-lg-pull-0 {
            right: 0%
        }

        .arco-col-lg-pull-0.arco-col-rtl {
            right: unset;
            left: 0%
        }

        .arco-col-lg-pull-1 {
            right: 4.16667%
        }

        .arco-col-lg-pull-1.arco-col-rtl {
            right: unset;
            left: 4.16667%
        }

        .arco-col-lg-pull-2 {
            right: 8.33333%
        }

        .arco-col-lg-pull-2.arco-col-rtl {
            right: unset;
            left: 8.33333%
        }

        .arco-col-lg-pull-3 {
            right: 12.5%
        }

        .arco-col-lg-pull-3.arco-col-rtl {
            right: unset;
            left: 12.5%
        }

        .arco-col-lg-pull-4 {
            right: 16.6667%
        }

        .arco-col-lg-pull-4.arco-col-rtl {
            right: unset;
            left: 16.6667%
        }

        .arco-col-lg-pull-5 {
            right: 20.8333%
        }

        .arco-col-lg-pull-5.arco-col-rtl {
            right: unset;
            left: 20.8333%
        }

        .arco-col-lg-pull-6 {
            right: 25%
        }

        .arco-col-lg-pull-6.arco-col-rtl {
            right: unset;
            left: 25%
        }

        .arco-col-lg-pull-7 {
            right: 29.1667%
        }

        .arco-col-lg-pull-7.arco-col-rtl {
            right: unset;
            left: 29.1667%
        }

        .arco-col-lg-pull-8 {
            right: 33.3333%
        }

        .arco-col-lg-pull-8.arco-col-rtl {
            right: unset;
            left: 33.3333%
        }

        .arco-col-lg-pull-9 {
            right: 37.5%
        }

        .arco-col-lg-pull-9.arco-col-rtl {
            right: unset;
            left: 37.5%
        }

        .arco-col-lg-pull-10 {
            right: 41.6667%
        }

        .arco-col-lg-pull-10.arco-col-rtl {
            right: unset;
            left: 41.6667%
        }

        .arco-col-lg-pull-11 {
            right: 45.8333%
        }

        .arco-col-lg-pull-11.arco-col-rtl {
            right: unset;
            left: 45.8333%
        }

        .arco-col-lg-pull-12 {
            right: 50%
        }

        .arco-col-lg-pull-12.arco-col-rtl {
            right: unset;
            left: 50%
        }

        .arco-col-lg-pull-13 {
            right: 54.1667%
        }

        .arco-col-lg-pull-13.arco-col-rtl {
            right: unset;
            left: 54.1667%
        }

        .arco-col-lg-pull-14 {
            right: 58.3333%
        }

        .arco-col-lg-pull-14.arco-col-rtl {
            right: unset;
            left: 58.3333%
        }

        .arco-col-lg-pull-15 {
            right: 62.5%
        }

        .arco-col-lg-pull-15.arco-col-rtl {
            right: unset;
            left: 62.5%
        }

        .arco-col-lg-pull-16 {
            right: 66.6667%
        }

        .arco-col-lg-pull-16.arco-col-rtl {
            right: unset;
            left: 66.6667%
        }

        .arco-col-lg-pull-17 {
            right: 70.8333%
        }

        .arco-col-lg-pull-17.arco-col-rtl {
            right: unset;
            left: 70.8333%
        }

        .arco-col-lg-pull-18 {
            right: 75%
        }

        .arco-col-lg-pull-18.arco-col-rtl {
            right: unset;
            left: 75%
        }

        .arco-col-lg-pull-19 {
            right: 79.1667%
        }

        .arco-col-lg-pull-19.arco-col-rtl {
            right: unset;
            left: 79.1667%
        }

        .arco-col-lg-pull-20 {
            right: 83.3333%
        }

        .arco-col-lg-pull-20.arco-col-rtl {
            right: unset;
            left: 83.3333%
        }

        .arco-col-lg-pull-21 {
            right: 87.5%
        }

        .arco-col-lg-pull-21.arco-col-rtl {
            right: unset;
            left: 87.5%
        }

        .arco-col-lg-pull-22 {
            right: 91.6667%
        }

        .arco-col-lg-pull-22.arco-col-rtl {
            right: unset;
            left: 91.6667%
        }

        .arco-col-lg-pull-23 {
            right: 95.8333%
        }

        .arco-col-lg-pull-23.arco-col-rtl {
            right: unset;
            left: 95.8333%
        }

        .arco-col-lg-pull-24 {
            right: 100%
        }

        .arco-col-lg-pull-24.arco-col-rtl {
            right: unset;
            left: 100%
        }

        .arco-col-lg-push-0 {
            left: 0%
        }

        .arco-col-lg-push-0.arco-col-rtl {
            left: unset;
            right: 0%
        }

        .arco-col-lg-push-1 {
            left: 4.16667%
        }

        .arco-col-lg-push-1.arco-col-rtl {
            left: unset;
            right: 4.16667%
        }

        .arco-col-lg-push-2 {
            left: 8.33333%
        }

        .arco-col-lg-push-2.arco-col-rtl {
            left: unset;
            right: 8.33333%
        }

        .arco-col-lg-push-3 {
            left: 12.5%
        }

        .arco-col-lg-push-3.arco-col-rtl {
            left: unset;
            right: 12.5%
        }

        .arco-col-lg-push-4 {
            left: 16.6667%
        }

        .arco-col-lg-push-4.arco-col-rtl {
            left: unset;
            right: 16.6667%
        }

        .arco-col-lg-push-5 {
            left: 20.8333%
        }

        .arco-col-lg-push-5.arco-col-rtl {
            left: unset;
            right: 20.8333%
        }

        .arco-col-lg-push-6 {
            left: 25%
        }

        .arco-col-lg-push-6.arco-col-rtl {
            left: unset;
            right: 25%
        }

        .arco-col-lg-push-7 {
            left: 29.1667%
        }

        .arco-col-lg-push-7.arco-col-rtl {
            left: unset;
            right: 29.1667%
        }

        .arco-col-lg-push-8 {
            left: 33.3333%
        }

        .arco-col-lg-push-8.arco-col-rtl {
            left: unset;
            right: 33.3333%
        }

        .arco-col-lg-push-9 {
            left: 37.5%
        }

        .arco-col-lg-push-9.arco-col-rtl {
            left: unset;
            right: 37.5%
        }

        .arco-col-lg-push-10 {
            left: 41.6667%
        }

        .arco-col-lg-push-10.arco-col-rtl {
            left: unset;
            right: 41.6667%
        }

        .arco-col-lg-push-11 {
            left: 45.8333%
        }

        .arco-col-lg-push-11.arco-col-rtl {
            left: unset;
            right: 45.8333%
        }

        .arco-col-lg-push-12 {
            left: 50%
        }

        .arco-col-lg-push-12.arco-col-rtl {
            left: unset;
            right: 50%
        }

        .arco-col-lg-push-13 {
            left: 54.1667%
        }

        .arco-col-lg-push-13.arco-col-rtl {
            left: unset;
            right: 54.1667%
        }

        .arco-col-lg-push-14 {
            left: 58.3333%
        }

        .arco-col-lg-push-14.arco-col-rtl {
            left: unset;
            right: 58.3333%
        }

        .arco-col-lg-push-15 {
            left: 62.5%
        }

        .arco-col-lg-push-15.arco-col-rtl {
            left: unset;
            right: 62.5%
        }

        .arco-col-lg-push-16 {
            left: 66.6667%
        }

        .arco-col-lg-push-16.arco-col-rtl {
            left: unset;
            right: 66.6667%
        }

        .arco-col-lg-push-17 {
            left: 70.8333%
        }

        .arco-col-lg-push-17.arco-col-rtl {
            left: unset;
            right: 70.8333%
        }

        .arco-col-lg-push-18 {
            left: 75%
        }

        .arco-col-lg-push-18.arco-col-rtl {
            left: unset;
            right: 75%
        }

        .arco-col-lg-push-19 {
            left: 79.1667%
        }

        .arco-col-lg-push-19.arco-col-rtl {
            left: unset;
            right: 79.1667%
        }

        .arco-col-lg-push-20 {
            left: 83.3333%
        }

        .arco-col-lg-push-20.arco-col-rtl {
            left: unset;
            right: 83.3333%
        }

        .arco-col-lg-push-21 {
            left: 87.5%
        }

        .arco-col-lg-push-21.arco-col-rtl {
            left: unset;
            right: 87.5%
        }

        .arco-col-lg-push-22 {
            left: 91.6667%
        }

        .arco-col-lg-push-22.arco-col-rtl {
            left: unset;
            right: 91.6667%
        }

        .arco-col-lg-push-23 {
            left: 95.8333%
        }

        .arco-col-lg-push-23.arco-col-rtl {
            left: unset;
            right: 95.8333%
        }

        .arco-col-lg-push-24 {
            left: 100%
        }

        .arco-col-lg-push-24.arco-col-rtl {
            left: unset;
            right: 100%
        }
    }

    @media (min-width:1200px) {
        .arco-col-xl-0 {
            display: none
        }

        .arco-col-xl-1 {
            flex: 0 0 4.16667%;
            width: 4.16667%;
            display: block
        }

        .arco-col-xl-2 {
            flex: 0 0 8.33333%;
            width: 8.33333%;
            display: block
        }

        .arco-col-xl-3 {
            flex: 0 0 12.5%;
            width: 12.5%;
            display: block
        }

        .arco-col-xl-4 {
            flex: 0 0 16.6667%;
            width: 16.6667%;
            display: block
        }

        .arco-col-xl-5 {
            flex: 0 0 20.8333%;
            width: 20.8333%;
            display: block
        }

        .arco-col-xl-6 {
            flex: 0 0 25%;
            width: 25%;
            display: block
        }

        .arco-col-xl-7 {
            flex: 0 0 29.1667%;
            width: 29.1667%;
            display: block
        }

        .arco-col-xl-8 {
            flex: 0 0 33.3333%;
            width: 33.3333%;
            display: block
        }

        .arco-col-xl-9 {
            flex: 0 0 37.5%;
            width: 37.5%;
            display: block
        }

        .arco-col-xl-10 {
            flex: 0 0 41.6667%;
            width: 41.6667%;
            display: block
        }

        .arco-col-xl-11 {
            flex: 0 0 45.8333%;
            width: 45.8333%;
            display: block
        }

        .arco-col-xl-12 {
            flex: 0 0 50%;
            width: 50%;
            display: block
        }

        .arco-col-xl-13 {
            flex: 0 0 54.1667%;
            width: 54.1667%;
            display: block
        }

        .arco-col-xl-14 {
            flex: 0 0 58.3333%;
            width: 58.3333%;
            display: block
        }

        .arco-col-xl-15 {
            flex: 0 0 62.5%;
            width: 62.5%;
            display: block
        }

        .arco-col-xl-16 {
            flex: 0 0 66.6667%;
            width: 66.6667%;
            display: block
        }

        .arco-col-xl-17 {
            flex: 0 0 70.8333%;
            width: 70.8333%;
            display: block
        }

        .arco-col-xl-18 {
            flex: 0 0 75%;
            width: 75%;
            display: block
        }

        .arco-col-xl-19 {
            flex: 0 0 79.1667%;
            width: 79.1667%;
            display: block
        }

        .arco-col-xl-20 {
            flex: 0 0 83.3333%;
            width: 83.3333%;
            display: block
        }

        .arco-col-xl-21 {
            flex: 0 0 87.5%;
            width: 87.5%;
            display: block
        }

        .arco-col-xl-22 {
            flex: 0 0 91.6667%;
            width: 91.6667%;
            display: block
        }

        .arco-col-xl-23 {
            flex: 0 0 95.8333%;
            width: 95.8333%;
            display: block
        }

        .arco-col-xl-24 {
            flex: 0 0 100%;
            width: 100%;
            display: block
        }

        .arco-col-xl-offset-0 {
            margin-left: 0%
        }

        .arco-col-xl-offset-0.arco-col-rtl {
            margin-left: 0;
            margin-right: 0%
        }

        .arco-col-xl-offset-1 {
            margin-left: 4.16667%
        }

        .arco-col-xl-offset-1.arco-col-rtl {
            margin-left: 0;
            margin-right: 4.16667%
        }

        .arco-col-xl-offset-2 {
            margin-left: 8.33333%
        }

        .arco-col-xl-offset-2.arco-col-rtl {
            margin-left: 0;
            margin-right: 8.33333%
        }

        .arco-col-xl-offset-3 {
            margin-left: 12.5%
        }

        .arco-col-xl-offset-3.arco-col-rtl {
            margin-left: 0;
            margin-right: 12.5%
        }

        .arco-col-xl-offset-4 {
            margin-left: 16.6667%
        }

        .arco-col-xl-offset-4.arco-col-rtl {
            margin-left: 0;
            margin-right: 16.6667%
        }

        .arco-col-xl-offset-5 {
            margin-left: 20.8333%
        }

        .arco-col-xl-offset-5.arco-col-rtl {
            margin-left: 0;
            margin-right: 20.8333%
        }

        .arco-col-xl-offset-6 {
            margin-left: 25%
        }

        .arco-col-xl-offset-6.arco-col-rtl {
            margin-left: 0;
            margin-right: 25%
        }

        .arco-col-xl-offset-7 {
            margin-left: 29.1667%
        }

        .arco-col-xl-offset-7.arco-col-rtl {
            margin-left: 0;
            margin-right: 29.1667%
        }

        .arco-col-xl-offset-8 {
            margin-left: 33.3333%
        }

        .arco-col-xl-offset-8.arco-col-rtl {
            margin-left: 0;
            margin-right: 33.3333%
        }

        .arco-col-xl-offset-9 {
            margin-left: 37.5%
        }

        .arco-col-xl-offset-9.arco-col-rtl {
            margin-left: 0;
            margin-right: 37.5%
        }

        .arco-col-xl-offset-10 {
            margin-left: 41.6667%
        }

        .arco-col-xl-offset-10.arco-col-rtl {
            margin-left: 0;
            margin-right: 41.6667%
        }

        .arco-col-xl-offset-11 {
            margin-left: 45.8333%
        }

        .arco-col-xl-offset-11.arco-col-rtl {
            margin-left: 0;
            margin-right: 45.8333%
        }

        .arco-col-xl-offset-12 {
            margin-left: 50%
        }

        .arco-col-xl-offset-12.arco-col-rtl {
            margin-left: 0;
            margin-right: 50%
        }

        .arco-col-xl-offset-13 {
            margin-left: 54.1667%
        }

        .arco-col-xl-offset-13.arco-col-rtl {
            margin-left: 0;
            margin-right: 54.1667%
        }

        .arco-col-xl-offset-14 {
            margin-left: 58.3333%
        }

        .arco-col-xl-offset-14.arco-col-rtl {
            margin-left: 0;
            margin-right: 58.3333%
        }

        .arco-col-xl-offset-15 {
            margin-left: 62.5%
        }

        .arco-col-xl-offset-15.arco-col-rtl {
            margin-left: 0;
            margin-right: 62.5%
        }

        .arco-col-xl-offset-16 {
            margin-left: 66.6667%
        }

        .arco-col-xl-offset-16.arco-col-rtl {
            margin-left: 0;
            margin-right: 66.6667%
        }

        .arco-col-xl-offset-17 {
            margin-left: 70.8333%
        }

        .arco-col-xl-offset-17.arco-col-rtl {
            margin-left: 0;
            margin-right: 70.8333%
        }

        .arco-col-xl-offset-18 {
            margin-left: 75%
        }

        .arco-col-xl-offset-18.arco-col-rtl {
            margin-left: 0;
            margin-right: 75%
        }

        .arco-col-xl-offset-19 {
            margin-left: 79.1667%
        }

        .arco-col-xl-offset-19.arco-col-rtl {
            margin-left: 0;
            margin-right: 79.1667%
        }

        .arco-col-xl-offset-20 {
            margin-left: 83.3333%
        }

        .arco-col-xl-offset-20.arco-col-rtl {
            margin-left: 0;
            margin-right: 83.3333%
        }

        .arco-col-xl-offset-21 {
            margin-left: 87.5%
        }

        .arco-col-xl-offset-21.arco-col-rtl {
            margin-left: 0;
            margin-right: 87.5%
        }

        .arco-col-xl-offset-22 {
            margin-left: 91.6667%
        }

        .arco-col-xl-offset-22.arco-col-rtl {
            margin-left: 0;
            margin-right: 91.6667%
        }

        .arco-col-xl-offset-23 {
            margin-left: 95.8333%
        }

        .arco-col-xl-offset-23.arco-col-rtl {
            margin-left: 0;
            margin-right: 95.8333%
        }

        .arco-col-xl-order-0 {
            order: 0
        }

        .arco-col-xl-order-1 {
            order: 1
        }

        .arco-col-xl-order-2 {
            order: 2
        }

        .arco-col-xl-order-3 {
            order: 3
        }

        .arco-col-xl-order-4 {
            order: 4
        }

        .arco-col-xl-order-5 {
            order: 5
        }

        .arco-col-xl-order-6 {
            order: 6
        }

        .arco-col-xl-order-7 {
            order: 7
        }

        .arco-col-xl-order-8 {
            order: 8
        }

        .arco-col-xl-order-9 {
            order: 9
        }

        .arco-col-xl-order-10 {
            order: 10
        }

        .arco-col-xl-order-11 {
            order: 11
        }

        .arco-col-xl-order-12 {
            order: 12
        }

        .arco-col-xl-order-13 {
            order: 13
        }

        .arco-col-xl-order-14 {
            order: 14
        }

        .arco-col-xl-order-15 {
            order: 15
        }

        .arco-col-xl-order-16 {
            order: 16
        }

        .arco-col-xl-order-17 {
            order: 17
        }

        .arco-col-xl-order-18 {
            order: 18
        }

        .arco-col-xl-order-19 {
            order: 19
        }

        .arco-col-xl-order-20 {
            order: 20
        }

        .arco-col-xl-order-21 {
            order: 21
        }

        .arco-col-xl-order-22 {
            order: 22
        }

        .arco-col-xl-order-23 {
            order: 23
        }

        .arco-col-xl-order-24 {
            order: 24
        }

        .arco-col-xl-pull-0 {
            right: 0%
        }

        .arco-col-xl-pull-0.arco-col-rtl {
            right: unset;
            left: 0%
        }

        .arco-col-xl-pull-1 {
            right: 4.16667%
        }

        .arco-col-xl-pull-1.arco-col-rtl {
            right: unset;
            left: 4.16667%
        }

        .arco-col-xl-pull-2 {
            right: 8.33333%
        }

        .arco-col-xl-pull-2.arco-col-rtl {
            right: unset;
            left: 8.33333%
        }

        .arco-col-xl-pull-3 {
            right: 12.5%
        }

        .arco-col-xl-pull-3.arco-col-rtl {
            right: unset;
            left: 12.5%
        }

        .arco-col-xl-pull-4 {
            right: 16.6667%
        }

        .arco-col-xl-pull-4.arco-col-rtl {
            right: unset;
            left: 16.6667%
        }

        .arco-col-xl-pull-5 {
            right: 20.8333%
        }

        .arco-col-xl-pull-5.arco-col-rtl {
            right: unset;
            left: 20.8333%
        }

        .arco-col-xl-pull-6 {
            right: 25%
        }

        .arco-col-xl-pull-6.arco-col-rtl {
            right: unset;
            left: 25%
        }

        .arco-col-xl-pull-7 {
            right: 29.1667%
        }

        .arco-col-xl-pull-7.arco-col-rtl {
            right: unset;
            left: 29.1667%
        }

        .arco-col-xl-pull-8 {
            right: 33.3333%
        }

        .arco-col-xl-pull-8.arco-col-rtl {
            right: unset;
            left: 33.3333%
        }

        .arco-col-xl-pull-9 {
            right: 37.5%
        }

        .arco-col-xl-pull-9.arco-col-rtl {
            right: unset;
            left: 37.5%
        }

        .arco-col-xl-pull-10 {
            right: 41.6667%
        }

        .arco-col-xl-pull-10.arco-col-rtl {
            right: unset;
            left: 41.6667%
        }

        .arco-col-xl-pull-11 {
            right: 45.8333%
        }

        .arco-col-xl-pull-11.arco-col-rtl {
            right: unset;
            left: 45.8333%
        }

        .arco-col-xl-pull-12 {
            right: 50%
        }

        .arco-col-xl-pull-12.arco-col-rtl {
            right: unset;
            left: 50%
        }

        .arco-col-xl-pull-13 {
            right: 54.1667%
        }

        .arco-col-xl-pull-13.arco-col-rtl {
            right: unset;
            left: 54.1667%
        }

        .arco-col-xl-pull-14 {
            right: 58.3333%
        }

        .arco-col-xl-pull-14.arco-col-rtl {
            right: unset;
            left: 58.3333%
        }

        .arco-col-xl-pull-15 {
            right: 62.5%
        }

        .arco-col-xl-pull-15.arco-col-rtl {
            right: unset;
            left: 62.5%
        }

        .arco-col-xl-pull-16 {
            right: 66.6667%
        }

        .arco-col-xl-pull-16.arco-col-rtl {
            right: unset;
            left: 66.6667%
        }

        .arco-col-xl-pull-17 {
            right: 70.8333%
        }

        .arco-col-xl-pull-17.arco-col-rtl {
            right: unset;
            left: 70.8333%
        }

        .arco-col-xl-pull-18 {
            right: 75%
        }

        .arco-col-xl-pull-18.arco-col-rtl {
            right: unset;
            left: 75%
        }

        .arco-col-xl-pull-19 {
            right: 79.1667%
        }

        .arco-col-xl-pull-19.arco-col-rtl {
            right: unset;
            left: 79.1667%
        }

        .arco-col-xl-pull-20 {
            right: 83.3333%
        }

        .arco-col-xl-pull-20.arco-col-rtl {
            right: unset;
            left: 83.3333%
        }

        .arco-col-xl-pull-21 {
            right: 87.5%
        }

        .arco-col-xl-pull-21.arco-col-rtl {
            right: unset;
            left: 87.5%
        }

        .arco-col-xl-pull-22 {
            right: 91.6667%
        }

        .arco-col-xl-pull-22.arco-col-rtl {
            right: unset;
            left: 91.6667%
        }

        .arco-col-xl-pull-23 {
            right: 95.8333%
        }

        .arco-col-xl-pull-23.arco-col-rtl {
            right: unset;
            left: 95.8333%
        }

        .arco-col-xl-pull-24 {
            right: 100%
        }

        .arco-col-xl-pull-24.arco-col-rtl {
            right: unset;
            left: 100%
        }

        .arco-col-xl-push-0 {
            left: 0%
        }

        .arco-col-xl-push-0.arco-col-rtl {
            left: unset;
            right: 0%
        }

        .arco-col-xl-push-1 {
            left: 4.16667%
        }

        .arco-col-xl-push-1.arco-col-rtl {
            left: unset;
            right: 4.16667%
        }

        .arco-col-xl-push-2 {
            left: 8.33333%
        }

        .arco-col-xl-push-2.arco-col-rtl {
            left: unset;
            right: 8.33333%
        }

        .arco-col-xl-push-3 {
            left: 12.5%
        }

        .arco-col-xl-push-3.arco-col-rtl {
            left: unset;
            right: 12.5%
        }

        .arco-col-xl-push-4 {
            left: 16.6667%
        }

        .arco-col-xl-push-4.arco-col-rtl {
            left: unset;
            right: 16.6667%
        }

        .arco-col-xl-push-5 {
            left: 20.8333%
        }

        .arco-col-xl-push-5.arco-col-rtl {
            left: unset;
            right: 20.8333%
        }

        .arco-col-xl-push-6 {
            left: 25%
        }

        .arco-col-xl-push-6.arco-col-rtl {
            left: unset;
            right: 25%
        }

        .arco-col-xl-push-7 {
            left: 29.1667%
        }

        .arco-col-xl-push-7.arco-col-rtl {
            left: unset;
            right: 29.1667%
        }

        .arco-col-xl-push-8 {
            left: 33.3333%
        }

        .arco-col-xl-push-8.arco-col-rtl {
            left: unset;
            right: 33.3333%
        }

        .arco-col-xl-push-9 {
            left: 37.5%
        }

        .arco-col-xl-push-9.arco-col-rtl {
            left: unset;
            right: 37.5%
        }

        .arco-col-xl-push-10 {
            left: 41.6667%
        }

        .arco-col-xl-push-10.arco-col-rtl {
            left: unset;
            right: 41.6667%
        }

        .arco-col-xl-push-11 {
            left: 45.8333%
        }

        .arco-col-xl-push-11.arco-col-rtl {
            left: unset;
            right: 45.8333%
        }

        .arco-col-xl-push-12 {
            left: 50%
        }

        .arco-col-xl-push-12.arco-col-rtl {
            left: unset;
            right: 50%
        }

        .arco-col-xl-push-13 {
            left: 54.1667%
        }

        .arco-col-xl-push-13.arco-col-rtl {
            left: unset;
            right: 54.1667%
        }

        .arco-col-xl-push-14 {
            left: 58.3333%
        }

        .arco-col-xl-push-14.arco-col-rtl {
            left: unset;
            right: 58.3333%
        }

        .arco-col-xl-push-15 {
            left: 62.5%
        }

        .arco-col-xl-push-15.arco-col-rtl {
            left: unset;
            right: 62.5%
        }

        .arco-col-xl-push-16 {
            left: 66.6667%
        }

        .arco-col-xl-push-16.arco-col-rtl {
            left: unset;
            right: 66.6667%
        }

        .arco-col-xl-push-17 {
            left: 70.8333%
        }

        .arco-col-xl-push-17.arco-col-rtl {
            left: unset;
            right: 70.8333%
        }

        .arco-col-xl-push-18 {
            left: 75%
        }

        .arco-col-xl-push-18.arco-col-rtl {
            left: unset;
            right: 75%
        }

        .arco-col-xl-push-19 {
            left: 79.1667%
        }

        .arco-col-xl-push-19.arco-col-rtl {
            left: unset;
            right: 79.1667%
        }

        .arco-col-xl-push-20 {
            left: 83.3333%
        }

        .arco-col-xl-push-20.arco-col-rtl {
            left: unset;
            right: 83.3333%
        }

        .arco-col-xl-push-21 {
            left: 87.5%
        }

        .arco-col-xl-push-21.arco-col-rtl {
            left: unset;
            right: 87.5%
        }

        .arco-col-xl-push-22 {
            left: 91.6667%
        }

        .arco-col-xl-push-22.arco-col-rtl {
            left: unset;
            right: 91.6667%
        }

        .arco-col-xl-push-23 {
            left: 95.8333%
        }

        .arco-col-xl-push-23.arco-col-rtl {
            left: unset;
            right: 95.8333%
        }

        .arco-col-xl-push-24 {
            left: 100%
        }

        .arco-col-xl-push-24.arco-col-rtl {
            left: unset;
            right: 100%
        }
    }

    @media (min-width:1600px) {
        .arco-col-xxl-0 {
            display: none
        }

        .arco-col-xxl-1 {
            flex: 0 0 4.16667%;
            width: 4.16667%;
            display: block
        }

        .arco-col-xxl-2 {
            flex: 0 0 8.33333%;
            width: 8.33333%;
            display: block
        }

        .arco-col-xxl-3 {
            flex: 0 0 12.5%;
            width: 12.5%;
            display: block
        }

        .arco-col-xxl-4 {
            flex: 0 0 16.6667%;
            width: 16.6667%;
            display: block
        }

        .arco-col-xxl-5 {
            flex: 0 0 20.8333%;
            width: 20.8333%;
            display: block
        }

        .arco-col-xxl-6 {
            flex: 0 0 25%;
            width: 25%;
            display: block
        }

        .arco-col-xxl-7 {
            flex: 0 0 29.1667%;
            width: 29.1667%;
            display: block
        }

        .arco-col-xxl-8 {
            flex: 0 0 33.3333%;
            width: 33.3333%;
            display: block
        }

        .arco-col-xxl-9 {
            flex: 0 0 37.5%;
            width: 37.5%;
            display: block
        }

        .arco-col-xxl-10 {
            flex: 0 0 41.6667%;
            width: 41.6667%;
            display: block
        }

        .arco-col-xxl-11 {
            flex: 0 0 45.8333%;
            width: 45.8333%;
            display: block
        }

        .arco-col-xxl-12 {
            flex: 0 0 50%;
            width: 50%;
            display: block
        }

        .arco-col-xxl-13 {
            flex: 0 0 54.1667%;
            width: 54.1667%;
            display: block
        }

        .arco-col-xxl-14 {
            flex: 0 0 58.3333%;
            width: 58.3333%;
            display: block
        }

        .arco-col-xxl-15 {
            flex: 0 0 62.5%;
            width: 62.5%;
            display: block
        }

        .arco-col-xxl-16 {
            flex: 0 0 66.6667%;
            width: 66.6667%;
            display: block
        }

        .arco-col-xxl-17 {
            flex: 0 0 70.8333%;
            width: 70.8333%;
            display: block
        }

        .arco-col-xxl-18 {
            flex: 0 0 75%;
            width: 75%;
            display: block
        }

        .arco-col-xxl-19 {
            flex: 0 0 79.1667%;
            width: 79.1667%;
            display: block
        }

        .arco-col-xxl-20 {
            flex: 0 0 83.3333%;
            width: 83.3333%;
            display: block
        }

        .arco-col-xxl-21 {
            flex: 0 0 87.5%;
            width: 87.5%;
            display: block
        }

        .arco-col-xxl-22 {
            flex: 0 0 91.6667%;
            width: 91.6667%;
            display: block
        }

        .arco-col-xxl-23 {
            flex: 0 0 95.8333%;
            width: 95.8333%;
            display: block
        }

        .arco-col-xxl-24 {
            flex: 0 0 100%;
            width: 100%;
            display: block
        }

        .arco-col-xxl-offset-0 {
            margin-left: 0%
        }

        .arco-col-xxl-offset-0.arco-col-rtl {
            margin-left: 0;
            margin-right: 0%
        }

        .arco-col-xxl-offset-1 {
            margin-left: 4.16667%
        }

        .arco-col-xxl-offset-1.arco-col-rtl {
            margin-left: 0;
            margin-right: 4.16667%
        }

        .arco-col-xxl-offset-2 {
            margin-left: 8.33333%
        }

        .arco-col-xxl-offset-2.arco-col-rtl {
            margin-left: 0;
            margin-right: 8.33333%
        }

        .arco-col-xxl-offset-3 {
            margin-left: 12.5%
        }

        .arco-col-xxl-offset-3.arco-col-rtl {
            margin-left: 0;
            margin-right: 12.5%
        }

        .arco-col-xxl-offset-4 {
            margin-left: 16.6667%
        }

        .arco-col-xxl-offset-4.arco-col-rtl {
            margin-left: 0;
            margin-right: 16.6667%
        }

        .arco-col-xxl-offset-5 {
            margin-left: 20.8333%
        }

        .arco-col-xxl-offset-5.arco-col-rtl {
            margin-left: 0;
            margin-right: 20.8333%
        }

        .arco-col-xxl-offset-6 {
            margin-left: 25%
        }

        .arco-col-xxl-offset-6.arco-col-rtl {
            margin-left: 0;
            margin-right: 25%
        }

        .arco-col-xxl-offset-7 {
            margin-left: 29.1667%
        }

        .arco-col-xxl-offset-7.arco-col-rtl {
            margin-left: 0;
            margin-right: 29.1667%
        }

        .arco-col-xxl-offset-8 {
            margin-left: 33.3333%
        }

        .arco-col-xxl-offset-8.arco-col-rtl {
            margin-left: 0;
            margin-right: 33.3333%
        }

        .arco-col-xxl-offset-9 {
            margin-left: 37.5%
        }

        .arco-col-xxl-offset-9.arco-col-rtl {
            margin-left: 0;
            margin-right: 37.5%
        }

        .arco-col-xxl-offset-10 {
            margin-left: 41.6667%
        }

        .arco-col-xxl-offset-10.arco-col-rtl {
            margin-left: 0;
            margin-right: 41.6667%
        }

        .arco-col-xxl-offset-11 {
            margin-left: 45.8333%
        }

        .arco-col-xxl-offset-11.arco-col-rtl {
            margin-left: 0;
            margin-right: 45.8333%
        }

        .arco-col-xxl-offset-12 {
            margin-left: 50%
        }

        .arco-col-xxl-offset-12.arco-col-rtl {
            margin-left: 0;
            margin-right: 50%
        }

        .arco-col-xxl-offset-13 {
            margin-left: 54.1667%
        }

        .arco-col-xxl-offset-13.arco-col-rtl {
            margin-left: 0;
            margin-right: 54.1667%
        }

        .arco-col-xxl-offset-14 {
            margin-left: 58.3333%
        }

        .arco-col-xxl-offset-14.arco-col-rtl {
            margin-left: 0;
            margin-right: 58.3333%
        }

        .arco-col-xxl-offset-15 {
            margin-left: 62.5%
        }

        .arco-col-xxl-offset-15.arco-col-rtl {
            margin-left: 0;
            margin-right: 62.5%
        }

        .arco-col-xxl-offset-16 {
            margin-left: 66.6667%
        }

        .arco-col-xxl-offset-16.arco-col-rtl {
            margin-left: 0;
            margin-right: 66.6667%
        }

        .arco-col-xxl-offset-17 {
            margin-left: 70.8333%
        }

        .arco-col-xxl-offset-17.arco-col-rtl {
            margin-left: 0;
            margin-right: 70.8333%
        }

        .arco-col-xxl-offset-18 {
            margin-left: 75%
        }

        .arco-col-xxl-offset-18.arco-col-rtl {
            margin-left: 0;
            margin-right: 75%
        }

        .arco-col-xxl-offset-19 {
            margin-left: 79.1667%
        }

        .arco-col-xxl-offset-19.arco-col-rtl {
            margin-left: 0;
            margin-right: 79.1667%
        }

        .arco-col-xxl-offset-20 {
            margin-left: 83.3333%
        }

        .arco-col-xxl-offset-20.arco-col-rtl {
            margin-left: 0;
            margin-right: 83.3333%
        }

        .arco-col-xxl-offset-21 {
            margin-left: 87.5%
        }

        .arco-col-xxl-offset-21.arco-col-rtl {
            margin-left: 0;
            margin-right: 87.5%
        }

        .arco-col-xxl-offset-22 {
            margin-left: 91.6667%
        }

        .arco-col-xxl-offset-22.arco-col-rtl {
            margin-left: 0;
            margin-right: 91.6667%
        }

        .arco-col-xxl-offset-23 {
            margin-left: 95.8333%
        }

        .arco-col-xxl-offset-23.arco-col-rtl {
            margin-left: 0;
            margin-right: 95.8333%
        }

        .arco-col-xxl-order-0 {
            order: 0
        }

        .arco-col-xxl-order-1 {
            order: 1
        }

        .arco-col-xxl-order-2 {
            order: 2
        }

        .arco-col-xxl-order-3 {
            order: 3
        }

        .arco-col-xxl-order-4 {
            order: 4
        }

        .arco-col-xxl-order-5 {
            order: 5
        }

        .arco-col-xxl-order-6 {
            order: 6
        }

        .arco-col-xxl-order-7 {
            order: 7
        }

        .arco-col-xxl-order-8 {
            order: 8
        }

        .arco-col-xxl-order-9 {
            order: 9
        }

        .arco-col-xxl-order-10 {
            order: 10
        }

        .arco-col-xxl-order-11 {
            order: 11
        }

        .arco-col-xxl-order-12 {
            order: 12
        }

        .arco-col-xxl-order-13 {
            order: 13
        }

        .arco-col-xxl-order-14 {
            order: 14
        }

        .arco-col-xxl-order-15 {
            order: 15
        }

        .arco-col-xxl-order-16 {
            order: 16
        }

        .arco-col-xxl-order-17 {
            order: 17
        }

        .arco-col-xxl-order-18 {
            order: 18
        }

        .arco-col-xxl-order-19 {
            order: 19
        }

        .arco-col-xxl-order-20 {
            order: 20
        }

        .arco-col-xxl-order-21 {
            order: 21
        }

        .arco-col-xxl-order-22 {
            order: 22
        }

        .arco-col-xxl-order-23 {
            order: 23
        }

        .arco-col-xxl-order-24 {
            order: 24
        }

        .arco-col-xxl-pull-0 {
            right: 0%
        }

        .arco-col-xxl-pull-0.arco-col-rtl {
            right: unset;
            left: 0%
        }

        .arco-col-xxl-pull-1 {
            right: 4.16667%
        }

        .arco-col-xxl-pull-1.arco-col-rtl {
            right: unset;
            left: 4.16667%
        }

        .arco-col-xxl-pull-2 {
            right: 8.33333%
        }

        .arco-col-xxl-pull-2.arco-col-rtl {
            right: unset;
            left: 8.33333%
        }

        .arco-col-xxl-pull-3 {
            right: 12.5%
        }

        .arco-col-xxl-pull-3.arco-col-rtl {
            right: unset;
            left: 12.5%
        }

        .arco-col-xxl-pull-4 {
            right: 16.6667%
        }

        .arco-col-xxl-pull-4.arco-col-rtl {
            right: unset;
            left: 16.6667%
        }

        .arco-col-xxl-pull-5 {
            right: 20.8333%
        }

        .arco-col-xxl-pull-5.arco-col-rtl {
            right: unset;
            left: 20.8333%
        }

        .arco-col-xxl-pull-6 {
            right: 25%
        }

        .arco-col-xxl-pull-6.arco-col-rtl {
            right: unset;
            left: 25%
        }

        .arco-col-xxl-pull-7 {
            right: 29.1667%
        }

        .arco-col-xxl-pull-7.arco-col-rtl {
            right: unset;
            left: 29.1667%
        }

        .arco-col-xxl-pull-8 {
            right: 33.3333%
        }

        .arco-col-xxl-pull-8.arco-col-rtl {
            right: unset;
            left: 33.3333%
        }

        .arco-col-xxl-pull-9 {
            right: 37.5%
        }

        .arco-col-xxl-pull-9.arco-col-rtl {
            right: unset;
            left: 37.5%
        }

        .arco-col-xxl-pull-10 {
            right: 41.6667%
        }

        .arco-col-xxl-pull-10.arco-col-rtl {
            right: unset;
            left: 41.6667%
        }

        .arco-col-xxl-pull-11 {
            right: 45.8333%
        }

        .arco-col-xxl-pull-11.arco-col-rtl {
            right: unset;
            left: 45.8333%
        }

        .arco-col-xxl-pull-12 {
            right: 50%
        }

        .arco-col-xxl-pull-12.arco-col-rtl {
            right: unset;
            left: 50%
        }

        .arco-col-xxl-pull-13 {
            right: 54.1667%
        }

        .arco-col-xxl-pull-13.arco-col-rtl {
            right: unset;
            left: 54.1667%
        }

        .arco-col-xxl-pull-14 {
            right: 58.3333%
        }

        .arco-col-xxl-pull-14.arco-col-rtl {
            right: unset;
            left: 58.3333%
        }

        .arco-col-xxl-pull-15 {
            right: 62.5%
        }

        .arco-col-xxl-pull-15.arco-col-rtl {
            right: unset;
            left: 62.5%
        }

        .arco-col-xxl-pull-16 {
            right: 66.6667%
        }

        .arco-col-xxl-pull-16.arco-col-rtl {
            right: unset;
            left: 66.6667%
        }

        .arco-col-xxl-pull-17 {
            right: 70.8333%
        }

        .arco-col-xxl-pull-17.arco-col-rtl {
            right: unset;
            left: 70.8333%
        }

        .arco-col-xxl-pull-18 {
            right: 75%
        }

        .arco-col-xxl-pull-18.arco-col-rtl {
            right: unset;
            left: 75%
        }

        .arco-col-xxl-pull-19 {
            right: 79.1667%
        }

        .arco-col-xxl-pull-19.arco-col-rtl {
            right: unset;
            left: 79.1667%
        }

        .arco-col-xxl-pull-20 {
            right: 83.3333%
        }

        .arco-col-xxl-pull-20.arco-col-rtl {
            right: unset;
            left: 83.3333%
        }

        .arco-col-xxl-pull-21 {
            right: 87.5%
        }

        .arco-col-xxl-pull-21.arco-col-rtl {
            right: unset;
            left: 87.5%
        }

        .arco-col-xxl-pull-22 {
            right: 91.6667%
        }

        .arco-col-xxl-pull-22.arco-col-rtl {
            right: unset;
            left: 91.6667%
        }

        .arco-col-xxl-pull-23 {
            right: 95.8333%
        }

        .arco-col-xxl-pull-23.arco-col-rtl {
            right: unset;
            left: 95.8333%
        }

        .arco-col-xxl-pull-24 {
            right: 100%
        }

        .arco-col-xxl-pull-24.arco-col-rtl {
            right: unset;
            left: 100%
        }

        .arco-col-xxl-push-0 {
            left: 0%
        }

        .arco-col-xxl-push-0.arco-col-rtl {
            left: unset;
            right: 0%
        }

        .arco-col-xxl-push-1 {
            left: 4.16667%
        }

        .arco-col-xxl-push-1.arco-col-rtl {
            left: unset;
            right: 4.16667%
        }

        .arco-col-xxl-push-2 {
            left: 8.33333%
        }

        .arco-col-xxl-push-2.arco-col-rtl {
            left: unset;
            right: 8.33333%
        }

        .arco-col-xxl-push-3 {
            left: 12.5%
        }

        .arco-col-xxl-push-3.arco-col-rtl {
            left: unset;
            right: 12.5%
        }

        .arco-col-xxl-push-4 {
            left: 16.6667%
        }

        .arco-col-xxl-push-4.arco-col-rtl {
            left: unset;
            right: 16.6667%
        }

        .arco-col-xxl-push-5 {
            left: 20.8333%
        }

        .arco-col-xxl-push-5.arco-col-rtl {
            left: unset;
            right: 20.8333%
        }

        .arco-col-xxl-push-6 {
            left: 25%
        }

        .arco-col-xxl-push-6.arco-col-rtl {
            left: unset;
            right: 25%
        }

        .arco-col-xxl-push-7 {
            left: 29.1667%
        }

        .arco-col-xxl-push-7.arco-col-rtl {
            left: unset;
            right: 29.1667%
        }

        .arco-col-xxl-push-8 {
            left: 33.3333%
        }

        .arco-col-xxl-push-8.arco-col-rtl {
            left: unset;
            right: 33.3333%
        }

        .arco-col-xxl-push-9 {
            left: 37.5%
        }

        .arco-col-xxl-push-9.arco-col-rtl {
            left: unset;
            right: 37.5%
        }

        .arco-col-xxl-push-10 {
            left: 41.6667%
        }

        .arco-col-xxl-push-10.arco-col-rtl {
            left: unset;
            right: 41.6667%
        }

        .arco-col-xxl-push-11 {
            left: 45.8333%
        }

        .arco-col-xxl-push-11.arco-col-rtl {
            left: unset;
            right: 45.8333%
        }

        .arco-col-xxl-push-12 {
            left: 50%
        }

        .arco-col-xxl-push-12.arco-col-rtl {
            left: unset;
            right: 50%
        }

        .arco-col-xxl-push-13 {
            left: 54.1667%
        }

        .arco-col-xxl-push-13.arco-col-rtl {
            left: unset;
            right: 54.1667%
        }

        .arco-col-xxl-push-14 {
            left: 58.3333%
        }

        .arco-col-xxl-push-14.arco-col-rtl {
            left: unset;
            right: 58.3333%
        }

        .arco-col-xxl-push-15 {
            left: 62.5%
        }

        .arco-col-xxl-push-15.arco-col-rtl {
            left: unset;
            right: 62.5%
        }

        .arco-col-xxl-push-16 {
            left: 66.6667%
        }

        .arco-col-xxl-push-16.arco-col-rtl {
            left: unset;
            right: 66.6667%
        }

        .arco-col-xxl-push-17 {
            left: 70.8333%
        }

        .arco-col-xxl-push-17.arco-col-rtl {
            left: unset;
            right: 70.8333%
        }

        .arco-col-xxl-push-18 {
            left: 75%
        }

        .arco-col-xxl-push-18.arco-col-rtl {
            left: unset;
            right: 75%
        }

        .arco-col-xxl-push-19 {
            left: 79.1667%
        }

        .arco-col-xxl-push-19.arco-col-rtl {
            left: unset;
            right: 79.1667%
        }

        .arco-col-xxl-push-20 {
            left: 83.3333%
        }

        .arco-col-xxl-push-20.arco-col-rtl {
            left: unset;
            right: 83.3333%
        }

        .arco-col-xxl-push-21 {
            left: 87.5%
        }

        .arco-col-xxl-push-21.arco-col-rtl {
            left: unset;
            right: 87.5%
        }

        .arco-col-xxl-push-22 {
            left: 91.6667%
        }

        .arco-col-xxl-push-22.arco-col-rtl {
            left: unset;
            right: 91.6667%
        }

        .arco-col-xxl-push-23 {
            left: 95.8333%
        }

        .arco-col-xxl-push-23.arco-col-rtl {
            left: unset;
            right: 95.8333%
        }

        .arco-col-xxl-push-24 {
            left: 100%
        }

        .arco-col-xxl-push-24.arco-col-rtl {
            left: unset;
            right: 100%
        }
    }

    @media (min-width:2000px) {
        .arco-col-xxxl-0 {
            display: none
        }

        .arco-col-xxxl-1 {
            flex: 0 0 4.16667%;
            width: 4.16667%;
            display: block
        }

        .arco-col-xxxl-2 {
            flex: 0 0 8.33333%;
            width: 8.33333%;
            display: block
        }

        .arco-col-xxxl-3 {
            flex: 0 0 12.5%;
            width: 12.5%;
            display: block
        }

        .arco-col-xxxl-4 {
            flex: 0 0 16.6667%;
            width: 16.6667%;
            display: block
        }

        .arco-col-xxxl-5 {
            flex: 0 0 20.8333%;
            width: 20.8333%;
            display: block
        }

        .arco-col-xxxl-6 {
            flex: 0 0 25%;
            width: 25%;
            display: block
        }

        .arco-col-xxxl-7 {
            flex: 0 0 29.1667%;
            width: 29.1667%;
            display: block
        }

        .arco-col-xxxl-8 {
            flex: 0 0 33.3333%;
            width: 33.3333%;
            display: block
        }

        .arco-col-xxxl-9 {
            flex: 0 0 37.5%;
            width: 37.5%;
            display: block
        }

        .arco-col-xxxl-10 {
            flex: 0 0 41.6667%;
            width: 41.6667%;
            display: block
        }

        .arco-col-xxxl-11 {
            flex: 0 0 45.8333%;
            width: 45.8333%;
            display: block
        }

        .arco-col-xxxl-12 {
            flex: 0 0 50%;
            width: 50%;
            display: block
        }

        .arco-col-xxxl-13 {
            flex: 0 0 54.1667%;
            width: 54.1667%;
            display: block
        }

        .arco-col-xxxl-14 {
            flex: 0 0 58.3333%;
            width: 58.3333%;
            display: block
        }

        .arco-col-xxxl-15 {
            flex: 0 0 62.5%;
            width: 62.5%;
            display: block
        }

        .arco-col-xxxl-16 {
            flex: 0 0 66.6667%;
            width: 66.6667%;
            display: block
        }

        .arco-col-xxxl-17 {
            flex: 0 0 70.8333%;
            width: 70.8333%;
            display: block
        }

        .arco-col-xxxl-18 {
            flex: 0 0 75%;
            width: 75%;
            display: block
        }

        .arco-col-xxxl-19 {
            flex: 0 0 79.1667%;
            width: 79.1667%;
            display: block
        }

        .arco-col-xxxl-20 {
            flex: 0 0 83.3333%;
            width: 83.3333%;
            display: block
        }

        .arco-col-xxxl-21 {
            flex: 0 0 87.5%;
            width: 87.5%;
            display: block
        }

        .arco-col-xxxl-22 {
            flex: 0 0 91.6667%;
            width: 91.6667%;
            display: block
        }

        .arco-col-xxxl-23 {
            flex: 0 0 95.8333%;
            width: 95.8333%;
            display: block
        }

        .arco-col-xxxl-24 {
            flex: 0 0 100%;
            width: 100%;
            display: block
        }

        .arco-col-xxxl-offset-0 {
            margin-left: 0%
        }

        .arco-col-xxxl-offset-0.arco-col-rtl {
            margin-left: 0;
            margin-right: 0%
        }

        .arco-col-xxxl-offset-1 {
            margin-left: 4.16667%
        }

        .arco-col-xxxl-offset-1.arco-col-rtl {
            margin-left: 0;
            margin-right: 4.16667%
        }

        .arco-col-xxxl-offset-2 {
            margin-left: 8.33333%
        }

        .arco-col-xxxl-offset-2.arco-col-rtl {
            margin-left: 0;
            margin-right: 8.33333%
        }

        .arco-col-xxxl-offset-3 {
            margin-left: 12.5%
        }

        .arco-col-xxxl-offset-3.arco-col-rtl {
            margin-left: 0;
            margin-right: 12.5%
        }

        .arco-col-xxxl-offset-4 {
            margin-left: 16.6667%
        }

        .arco-col-xxxl-offset-4.arco-col-rtl {
            margin-left: 0;
            margin-right: 16.6667%
        }

        .arco-col-xxxl-offset-5 {
            margin-left: 20.8333%
        }

        .arco-col-xxxl-offset-5.arco-col-rtl {
            margin-left: 0;
            margin-right: 20.8333%
        }

        .arco-col-xxxl-offset-6 {
            margin-left: 25%
        }

        .arco-col-xxxl-offset-6.arco-col-rtl {
            margin-left: 0;
            margin-right: 25%
        }

        .arco-col-xxxl-offset-7 {
            margin-left: 29.1667%
        }

        .arco-col-xxxl-offset-7.arco-col-rtl {
            margin-left: 0;
            margin-right: 29.1667%
        }

        .arco-col-xxxl-offset-8 {
            margin-left: 33.3333%
        }

        .arco-col-xxxl-offset-8.arco-col-rtl {
            margin-left: 0;
            margin-right: 33.3333%
        }

        .arco-col-xxxl-offset-9 {
            margin-left: 37.5%
        }

        .arco-col-xxxl-offset-9.arco-col-rtl {
            margin-left: 0;
            margin-right: 37.5%
        }

        .arco-col-xxxl-offset-10 {
            margin-left: 41.6667%
        }

        .arco-col-xxxl-offset-10.arco-col-rtl {
            margin-left: 0;
            margin-right: 41.6667%
        }

        .arco-col-xxxl-offset-11 {
            margin-left: 45.8333%
        }

        .arco-col-xxxl-offset-11.arco-col-rtl {
            margin-left: 0;
            margin-right: 45.8333%
        }

        .arco-col-xxxl-offset-12 {
            margin-left: 50%
        }

        .arco-col-xxxl-offset-12.arco-col-rtl {
            margin-left: 0;
            margin-right: 50%
        }

        .arco-col-xxxl-offset-13 {
            margin-left: 54.1667%
        }

        .arco-col-xxxl-offset-13.arco-col-rtl {
            margin-left: 0;
            margin-right: 54.1667%
        }

        .arco-col-xxxl-offset-14 {
            margin-left: 58.3333%
        }

        .arco-col-xxxl-offset-14.arco-col-rtl {
            margin-left: 0;
            margin-right: 58.3333%
        }

        .arco-col-xxxl-offset-15 {
            margin-left: 62.5%
        }

        .arco-col-xxxl-offset-15.arco-col-rtl {
            margin-left: 0;
            margin-right: 62.5%
        }

        .arco-col-xxxl-offset-16 {
            margin-left: 66.6667%
        }

        .arco-col-xxxl-offset-16.arco-col-rtl {
            margin-left: 0;
            margin-right: 66.6667%
        }

        .arco-col-xxxl-offset-17 {
            margin-left: 70.8333%
        }

        .arco-col-xxxl-offset-17.arco-col-rtl {
            margin-left: 0;
            margin-right: 70.8333%
        }

        .arco-col-xxxl-offset-18 {
            margin-left: 75%
        }

        .arco-col-xxxl-offset-18.arco-col-rtl {
            margin-left: 0;
            margin-right: 75%
        }

        .arco-col-xxxl-offset-19 {
            margin-left: 79.1667%
        }

        .arco-col-xxxl-offset-19.arco-col-rtl {
            margin-left: 0;
            margin-right: 79.1667%
        }

        .arco-col-xxxl-offset-20 {
            margin-left: 83.3333%
        }

        .arco-col-xxxl-offset-20.arco-col-rtl {
            margin-left: 0;
            margin-right: 83.3333%
        }

        .arco-col-xxxl-offset-21 {
            margin-left: 87.5%
        }

        .arco-col-xxxl-offset-21.arco-col-rtl {
            margin-left: 0;
            margin-right: 87.5%
        }

        .arco-col-xxxl-offset-22 {
            margin-left: 91.6667%
        }

        .arco-col-xxxl-offset-22.arco-col-rtl {
            margin-left: 0;
            margin-right: 91.6667%
        }

        .arco-col-xxxl-offset-23 {
            margin-left: 95.8333%
        }

        .arco-col-xxxl-offset-23.arco-col-rtl {
            margin-left: 0;
            margin-right: 95.8333%
        }

        .arco-col-xxxl-order-0 {
            order: 0
        }

        .arco-col-xxxl-order-1 {
            order: 1
        }

        .arco-col-xxxl-order-2 {
            order: 2
        }

        .arco-col-xxxl-order-3 {
            order: 3
        }

        .arco-col-xxxl-order-4 {
            order: 4
        }

        .arco-col-xxxl-order-5 {
            order: 5
        }

        .arco-col-xxxl-order-6 {
            order: 6
        }

        .arco-col-xxxl-order-7 {
            order: 7
        }

        .arco-col-xxxl-order-8 {
            order: 8
        }

        .arco-col-xxxl-order-9 {
            order: 9
        }

        .arco-col-xxxl-order-10 {
            order: 10
        }

        .arco-col-xxxl-order-11 {
            order: 11
        }

        .arco-col-xxxl-order-12 {
            order: 12
        }

        .arco-col-xxxl-order-13 {
            order: 13
        }

        .arco-col-xxxl-order-14 {
            order: 14
        }

        .arco-col-xxxl-order-15 {
            order: 15
        }

        .arco-col-xxxl-order-16 {
            order: 16
        }

        .arco-col-xxxl-order-17 {
            order: 17
        }

        .arco-col-xxxl-order-18 {
            order: 18
        }

        .arco-col-xxxl-order-19 {
            order: 19
        }

        .arco-col-xxxl-order-20 {
            order: 20
        }

        .arco-col-xxxl-order-21 {
            order: 21
        }

        .arco-col-xxxl-order-22 {
            order: 22
        }

        .arco-col-xxxl-order-23 {
            order: 23
        }

        .arco-col-xxxl-order-24 {
            order: 24
        }

        .arco-col-xxxl-pull-0 {
            right: 0%
        }

        .arco-col-xxxl-pull-0.arco-col-rtl {
            right: unset;
            left: 0%
        }

        .arco-col-xxxl-pull-1 {
            right: 4.16667%
        }

        .arco-col-xxxl-pull-1.arco-col-rtl {
            right: unset;
            left: 4.16667%
        }

        .arco-col-xxxl-pull-2 {
            right: 8.33333%
        }

        .arco-col-xxxl-pull-2.arco-col-rtl {
            right: unset;
            left: 8.33333%
        }

        .arco-col-xxxl-pull-3 {
            right: 12.5%
        }

        .arco-col-xxxl-pull-3.arco-col-rtl {
            right: unset;
            left: 12.5%
        }

        .arco-col-xxxl-pull-4 {
            right: 16.6667%
        }

        .arco-col-xxxl-pull-4.arco-col-rtl {
            right: unset;
            left: 16.6667%
        }

        .arco-col-xxxl-pull-5 {
            right: 20.8333%
        }

        .arco-col-xxxl-pull-5.arco-col-rtl {
            right: unset;
            left: 20.8333%
        }

        .arco-col-xxxl-pull-6 {
            right: 25%
        }

        .arco-col-xxxl-pull-6.arco-col-rtl {
            right: unset;
            left: 25%
        }

        .arco-col-xxxl-pull-7 {
            right: 29.1667%
        }

        .arco-col-xxxl-pull-7.arco-col-rtl {
            right: unset;
            left: 29.1667%
        }

        .arco-col-xxxl-pull-8 {
            right: 33.3333%
        }

        .arco-col-xxxl-pull-8.arco-col-rtl {
            right: unset;
            left: 33.3333%
        }

        .arco-col-xxxl-pull-9 {
            right: 37.5%
        }

        .arco-col-xxxl-pull-9.arco-col-rtl {
            right: unset;
            left: 37.5%
        }

        .arco-col-xxxl-pull-10 {
            right: 41.6667%
        }

        .arco-col-xxxl-pull-10.arco-col-rtl {
            right: unset;
            left: 41.6667%
        }

        .arco-col-xxxl-pull-11 {
            right: 45.8333%
        }

        .arco-col-xxxl-pull-11.arco-col-rtl {
            right: unset;
            left: 45.8333%
        }

        .arco-col-xxxl-pull-12 {
            right: 50%
        }

        .arco-col-xxxl-pull-12.arco-col-rtl {
            right: unset;
            left: 50%
        }

        .arco-col-xxxl-pull-13 {
            right: 54.1667%
        }

        .arco-col-xxxl-pull-13.arco-col-rtl {
            right: unset;
            left: 54.1667%
        }

        .arco-col-xxxl-pull-14 {
            right: 58.3333%
        }

        .arco-col-xxxl-pull-14.arco-col-rtl {
            right: unset;
            left: 58.3333%
        }

        .arco-col-xxxl-pull-15 {
            right: 62.5%
        }

        .arco-col-xxxl-pull-15.arco-col-rtl {
            right: unset;
            left: 62.5%
        }

        .arco-col-xxxl-pull-16 {
            right: 66.6667%
        }

        .arco-col-xxxl-pull-16.arco-col-rtl {
            right: unset;
            left: 66.6667%
        }

        .arco-col-xxxl-pull-17 {
            right: 70.8333%
        }

        .arco-col-xxxl-pull-17.arco-col-rtl {
            right: unset;
            left: 70.8333%
        }

        .arco-col-xxxl-pull-18 {
            right: 75%
        }

        .arco-col-xxxl-pull-18.arco-col-rtl {
            right: unset;
            left: 75%
        }

        .arco-col-xxxl-pull-19 {
            right: 79.1667%
        }

        .arco-col-xxxl-pull-19.arco-col-rtl {
            right: unset;
            left: 79.1667%
        }

        .arco-col-xxxl-pull-20 {
            right: 83.3333%
        }

        .arco-col-xxxl-pull-20.arco-col-rtl {
            right: unset;
            left: 83.3333%
        }

        .arco-col-xxxl-pull-21 {
            right: 87.5%
        }

        .arco-col-xxxl-pull-21.arco-col-rtl {
            right: unset;
            left: 87.5%
        }

        .arco-col-xxxl-pull-22 {
            right: 91.6667%
        }

        .arco-col-xxxl-pull-22.arco-col-rtl {
            right: unset;
            left: 91.6667%
        }

        .arco-col-xxxl-pull-23 {
            right: 95.8333%
        }

        .arco-col-xxxl-pull-23.arco-col-rtl {
            right: unset;
            left: 95.8333%
        }

        .arco-col-xxxl-pull-24 {
            right: 100%
        }

        .arco-col-xxxl-pull-24.arco-col-rtl {
            right: unset;
            left: 100%
        }

        .arco-col-xxxl-push-0 {
            left: 0%
        }

        .arco-col-xxxl-push-0.arco-col-rtl {
            left: unset;
            right: 0%
        }

        .arco-col-xxxl-push-1 {
            left: 4.16667%
        }

        .arco-col-xxxl-push-1.arco-col-rtl {
            left: unset;
            right: 4.16667%
        }

        .arco-col-xxxl-push-2 {
            left: 8.33333%
        }

        .arco-col-xxxl-push-2.arco-col-rtl {
            left: unset;
            right: 8.33333%
        }

        .arco-col-xxxl-push-3 {
            left: 12.5%
        }

        .arco-col-xxxl-push-3.arco-col-rtl {
            left: unset;
            right: 12.5%
        }

        .arco-col-xxxl-push-4 {
            left: 16.6667%
        }

        .arco-col-xxxl-push-4.arco-col-rtl {
            left: unset;
            right: 16.6667%
        }

        .arco-col-xxxl-push-5 {
            left: 20.8333%
        }

        .arco-col-xxxl-push-5.arco-col-rtl {
            left: unset;
            right: 20.8333%
        }

        .arco-col-xxxl-push-6 {
            left: 25%
        }

        .arco-col-xxxl-push-6.arco-col-rtl {
            left: unset;
            right: 25%
        }

        .arco-col-xxxl-push-7 {
            left: 29.1667%
        }

        .arco-col-xxxl-push-7.arco-col-rtl {
            left: unset;
            right: 29.1667%
        }

        .arco-col-xxxl-push-8 {
            left: 33.3333%
        }

        .arco-col-xxxl-push-8.arco-col-rtl {
            left: unset;
            right: 33.3333%
        }

        .arco-col-xxxl-push-9 {
            left: 37.5%
        }

        .arco-col-xxxl-push-9.arco-col-rtl {
            left: unset;
            right: 37.5%
        }

        .arco-col-xxxl-push-10 {
            left: 41.6667%
        }

        .arco-col-xxxl-push-10.arco-col-rtl {
            left: unset;
            right: 41.6667%
        }

        .arco-col-xxxl-push-11 {
            left: 45.8333%
        }

        .arco-col-xxxl-push-11.arco-col-rtl {
            left: unset;
            right: 45.8333%
        }

        .arco-col-xxxl-push-12 {
            left: 50%
        }

        .arco-col-xxxl-push-12.arco-col-rtl {
            left: unset;
            right: 50%
        }

        .arco-col-xxxl-push-13 {
            left: 54.1667%
        }

        .arco-col-xxxl-push-13.arco-col-rtl {
            left: unset;
            right: 54.1667%
        }

        .arco-col-xxxl-push-14 {
            left: 58.3333%
        }

        .arco-col-xxxl-push-14.arco-col-rtl {
            left: unset;
            right: 58.3333%
        }

        .arco-col-xxxl-push-15 {
            left: 62.5%
        }

        .arco-col-xxxl-push-15.arco-col-rtl {
            left: unset;
            right: 62.5%
        }

        .arco-col-xxxl-push-16 {
            left: 66.6667%
        }

        .arco-col-xxxl-push-16.arco-col-rtl {
            left: unset;
            right: 66.6667%
        }

        .arco-col-xxxl-push-17 {
            left: 70.8333%
        }

        .arco-col-xxxl-push-17.arco-col-rtl {
            left: unset;
            right: 70.8333%
        }

        .arco-col-xxxl-push-18 {
            left: 75%
        }

        .arco-col-xxxl-push-18.arco-col-rtl {
            left: unset;
            right: 75%
        }

        .arco-col-xxxl-push-19 {
            left: 79.1667%
        }

        .arco-col-xxxl-push-19.arco-col-rtl {
            left: unset;
            right: 79.1667%
        }

        .arco-col-xxxl-push-20 {
            left: 83.3333%
        }

        .arco-col-xxxl-push-20.arco-col-rtl {
            left: unset;
            right: 83.3333%
        }

        .arco-col-xxxl-push-21 {
            left: 87.5%
        }

        .arco-col-xxxl-push-21.arco-col-rtl {
            left: unset;
            right: 87.5%
        }

        .arco-col-xxxl-push-22 {
            left: 91.6667%
        }

        .arco-col-xxxl-push-22.arco-col-rtl {
            left: unset;
            right: 91.6667%
        }

        .arco-col-xxxl-push-23 {
            left: 95.8333%
        }

        .arco-col-xxxl-push-23.arco-col-rtl {
            left: unset;
            right: 95.8333%
        }

        .arco-col-xxxl-push-24 {
            left: 100%
        }

        .arco-col-xxxl-push-24.arco-col-rtl {
            left: unset;
            right: 100%
        }
    }

    .arco-grid {
        display: grid
    }

    .arco-grid-rtl {
        direction: rtl
    }
}


@layer base {
    .arco-form {
        flex-direction: column;
        width: 100%;
        display: flex
    }

    .arco-form-inline {
        flex-flow: wrap
    }

    .arco-form-inline .arco-form-item {
        width: auto;
        margin-bottom: 8px
    }

    .arco-form-item {
        justify-content: flex-start;
        align-items: flex-start;
        width: 100%;
        margin-bottom: 20px;
        display: flex
    }

    .arco-form-item.arco-form-item-hidden {
        display: none
    }

    .arco-form-item>.arco-form-label-item {
        padding-right: 16px
    }

    .arco-form-item.arco-form-item-error {
        margin-bottom: 0
    }

    .arco-form-item-wrapper-flex.arco-col {
        flex: 1
    }

    .arco-form-size-mini .arco-form-label-item {
        font-size: 12px;
        line-height: 24px
    }

    .arco-form-size-mini .arco-form-label-item>label {
        font-size: 12px
    }

    .arco-form-size-mini .arco-form-item-control {
        min-height: 24px
    }

    .arco-form-size-small .arco-form-label-item {
        line-height: 28px
    }

    .arco-form-size-small .arco-form-label-item>label {
        font-size: 14px
    }

    .arco-form-size-small .arco-form-item-control {
        min-height: 28px
    }

    .arco-form-size-large .arco-form-label-item {
        line-height: 36px
    }

    .arco-form-size-large .arco-form-label-item>label {
        font-size: 14px
    }

    .arco-form-size-large .arco-form-item-control {
        min-height: 36px
    }

    .arco-form-extra {
        color: var(--color-text-3);
        margin-top: 4px;
        font-size: 12px
    }

    .arco-form-message {
        color: rgb(var(--danger-6));
        min-height: 20px;
        font-size: 12px;
        line-height: 20px
    }

    .arco-form-message-help {
        color: var(--color-text-3)
    }

    .arco-form-message+.arco-form-extra {
        margin-top: 0;
        margin-bottom: 4px
    }

    .arco-form-layout-vertical {
        display: block
    }

    .arco-form-layout-vertical>.arco-form-label-item {
        white-space: normal;
        text-align: left;
        margin-bottom: 8px;
        padding: 0;
        line-height: 1.5715
    }

    .arco-form-layout-inline {
        margin-right: 24px
    }

    .arco-form-label-item {
        text-align: right;
        white-space: nowrap;
        line-height: 32px
    }

    .arco-form-label-item-flex.arco-col {
        flex: 0
    }

    .arco-form-label-item-flex.arco-col>label {
        white-space: nowrap
    }

    .arco-form-label-item>label {
        white-space: normal;
        color: var(--color-text-2);
        font-size: 14px
    }

    .arco-form-label-item .arco-form-item-tooltip {
        color: var(--color-text-4);
        margin-left: 4px
    }

    .arco-form-label-item .arco-form-item-symbol {
        color: rgb(var(--danger-6));
        font-size: 12px;
        line-height: 1
    }

    .arco-form-label-item .arco-form-item-symbol svg {
        transform: scale(.5)
    }

    .arco-form-label-item-left {
        text-align: left
    }

    .arco-form-item-control {
        align-items: center;
        width: 100%;
        min-height: 32px;
        display: flex
    }

    .arco-form-item-control-children {
        flex: 1;
        width: 100%
    }

    .arco-form-item-control-wrapper {
        flex-direction: column;
        align-items: flex-start;
        width: 100%;
        display: flex
    }

    .arco-form .arco-slider {
        display: block
    }

    .arco-form-item-status-validating .arco-input:not(.arco-input-disabled),
    .arco-form-item-status-validating .arco-input-inner-wrapper:not(.arco-input-inner-wrapper-disabled),
    .arco-form-item-status-validating .arco-textarea:not(.arco-textarea-disabled) {
        background-color: var(--color-fill-2);
        border-color: transparent
    }

    .arco-form-item-status-validating .arco-input:not(.arco-input-disabled):hover,
    .arco-form-item-status-validating .arco-input-inner-wrapper:not(.arco-input-inner-wrapper-disabled):hover,
    .arco-form-item-status-validating .arco-textarea:not(.arco-textarea-disabled):hover {
        background-color: var(--color-fill-3);
        border-color: transparent
    }

    .arco-form-item-status-validating .arco-input-inner-wrapper.arco-input-inner-wrapper-focus,
    .arco-form-item-status-validating .arco-input-inner-wrapper.arco-textarea-focus,
    .arco-form-item-status-validating .arco-textarea.arco-input-inner-wrapper-focus,
    .arco-form-item-status-validating .arco-textarea.arco-textarea-focus,
    .arco-form-item-status-validating .arco-input-inner-wrapper.arco-input-inner-wrapper-focus:hover,
    .arco-form-item-status-validating .arco-input-inner-wrapper.arco-textarea-focus:hover,
    .arco-form-item-status-validating .arco-textarea.arco-input-inner-wrapper-focus:hover,
    .arco-form-item-status-validating .arco-textarea.arco-textarea-focus:hover,
    .arco-form-item-status-validating .arco-input:focus,
    .arco-form-item-status-validating .arco-input:focus:hover {
        border-color: rgb(var(--primary-6));
        background-color: var(--color-bg-2);
        box-shadow: 0 0 0 0 var(--color-primary-light-2)
    }

    .arco-form-item-status-validating .arco-input-inner-wrapper .arco-input,
    .arco-form-item-status-validating .arco-input-inner-wrapper .arco-input:hover {
        box-shadow: none;
        background: 0 0
    }

    .arco-form-item-status-validating .arco-select:not(.arco-select-disabled) .arco-select-view {
        background-color: var(--color-fill-2);
        border-color: transparent
    }

    .arco-form-item-status-validating .arco-select:not(.arco-select-disabled):hover .arco-select-view {
        background-color: var(--color-fill-3);
        border-color: transparent
    }

    .arco-form-item-status-validating .arco-select:not(.arco-select-disabled).arco-select-focused .arco-select-view {
        background-color: var(--color-bg-2);
        border-color: rgb(var(--primary-6));
        box-shadow: 0 0 0 0 var(--color-primary-light-2)
    }

    .arco-form-item-status-validating .arco-cascader:not(.arco-cascader-disabled) .arco-cascader-view {
        background-color: var(--color-fill-2);
        border-color: transparent
    }

    .arco-form-item-status-validating .arco-cascader:not(.arco-cascader-disabled):hover .arco-cascader-view {
        background-color: var(--color-fill-3);
        border-color: transparent
    }

    .arco-form-item-status-validating .arco-cascader:not(.arco-cascader-disabled).arco-cascader-focused .arco-cascader-view {
        background-color: var(--color-bg-2);
        border-color: rgb(var(--primary-6));
        box-shadow: 0 0 0 0 var(--color-primary-light-2)
    }

    .arco-form-item-status-validating .arco-tree-select:not(.arco-tree-select-disabled) .arco-tree-select-view {
        background-color: var(--color-fill-2);
        border-color: transparent
    }

    .arco-form-item-status-validating .arco-tree-select:not(.arco-tree-select-disabled):hover .arco-tree-select-view {
        background-color: var(--color-fill-3);
        border-color: transparent
    }

    .arco-form-item-status-validating .arco-tree-select:not(.arco-tree-select-disabled).arco-tree-select-focused .arco-tree-select-view {
        background-color: var(--color-bg-2);
        border-color: rgb(var(--primary-6));
        box-shadow: 0 0 0 0 var(--color-primary-light-2)
    }

    .arco-form-item-status-validating .arco-picker:not(.arco-picker-disabled) {
        background-color: var(--color-fill-2);
        border-color: transparent
    }

    .arco-form-item-status-validating .arco-picker:not(.arco-picker-disabled):hover {
        background-color: var(--color-fill-3);
        border-color: transparent
    }

    .arco-form-item-status-validating .arco-picker-focused:not(.arco-picker-disabled),
    .arco-form-item-status-validating .arco-picker-focused:not(.arco-picker-disabled):hover {
        border-color: rgb(var(--primary-6));
        background-color: var(--color-bg-2);
        box-shadow: 0 0 0 0 var(--color-primary-light-2)
    }

    .arco-form-item-status-validating .arco-input-tag {
        background-color: var(--color-fill-2);
        border-color: transparent
    }

    .arco-form-item-status-validating .arco-input-tag:hover {
        background-color: var(--color-fill-3);
        border-color: transparent
    }

    .arco-form-item-status-validating .arco-input-tag.arco-input-tag-focus {
        border-color: rgb(var(--primary-6));
        background-color: var(--color-bg-2);
        box-shadow: 0 0 0 0 var(--color-primary-light-2)
    }

    .arco-form-item-status-validating .arco-form-message-help {
        color: rgb(var(--primary-6))
    }

    .arco-form-item-status-validating .arco-form-message-help .arco-form-message-help-warning {
        color: rgb(var(--warning-6))
    }

    .arco-form-item-feedback-validating {
        color: rgb(var(--primary-6))
    }

    .arco-form-item-status-success .arco-input:not(.arco-input-disabled),
    .arco-form-item-status-success .arco-input-inner-wrapper:not(.arco-input-inner-wrapper-disabled),
    .arco-form-item-status-success .arco-textarea:not(.arco-textarea-disabled) {
        background-color: var(--color-fill-2);
        border-color: transparent
    }

    .arco-form-item-status-success .arco-input:not(.arco-input-disabled):hover,
    .arco-form-item-status-success .arco-input-inner-wrapper:not(.arco-input-inner-wrapper-disabled):hover,
    .arco-form-item-status-success .arco-textarea:not(.arco-textarea-disabled):hover {
        background-color: var(--color-fill-3);
        border-color: transparent
    }

    .arco-form-item-status-success .arco-input-inner-wrapper.arco-input-inner-wrapper-focus,
    .arco-form-item-status-success .arco-input-inner-wrapper.arco-textarea-focus,
    .arco-form-item-status-success .arco-textarea.arco-input-inner-wrapper-focus,
    .arco-form-item-status-success .arco-textarea.arco-textarea-focus,
    .arco-form-item-status-success .arco-input-inner-wrapper.arco-input-inner-wrapper-focus:hover,
    .arco-form-item-status-success .arco-input-inner-wrapper.arco-textarea-focus:hover,
    .arco-form-item-status-success .arco-textarea.arco-input-inner-wrapper-focus:hover,
    .arco-form-item-status-success .arco-textarea.arco-textarea-focus:hover,
    .arco-form-item-status-success .arco-input:focus,
    .arco-form-item-status-success .arco-input:focus:hover {
        border-color: rgb(var(--success-6));
        background-color: var(--color-bg-2);
        box-shadow: 0 0 0 0 var(--color-success-light-2)
    }

    .arco-form-item-status-success .arco-input-inner-wrapper .arco-input,
    .arco-form-item-status-success .arco-input-inner-wrapper .arco-input:hover {
        box-shadow: none;
        background: 0 0
    }

    .arco-form-item-status-success .arco-select:not(.arco-select-disabled) .arco-select-view {
        background-color: var(--color-fill-2);
        border-color: transparent
    }

    .arco-form-item-status-success .arco-select:not(.arco-select-disabled):hover .arco-select-view {
        background-color: var(--color-fill-3);
        border-color: transparent
    }

    .arco-form-item-status-success .arco-select:not(.arco-select-disabled).arco-select-focused .arco-select-view {
        background-color: var(--color-bg-2);
        border-color: rgb(var(--success-6));
        box-shadow: 0 0 0 0 var(--color-success-light-2)
    }

    .arco-form-item-status-success .arco-cascader:not(.arco-cascader-disabled) .arco-cascader-view {
        background-color: var(--color-fill-2);
        border-color: transparent
    }

    .arco-form-item-status-success .arco-cascader:not(.arco-cascader-disabled):hover .arco-cascader-view {
        background-color: var(--color-fill-3);
        border-color: transparent
    }

    .arco-form-item-status-success .arco-cascader:not(.arco-cascader-disabled).arco-cascader-focused .arco-cascader-view {
        background-color: var(--color-bg-2);
        border-color: rgb(var(--success-6));
        box-shadow: 0 0 0 0 var(--color-success-light-2)
    }

    .arco-form-item-status-success .arco-tree-select:not(.arco-tree-select-disabled) .arco-tree-select-view {
        background-color: var(--color-fill-2);
        border-color: transparent
    }

    .arco-form-item-status-success .arco-tree-select:not(.arco-tree-select-disabled):hover .arco-tree-select-view {
        background-color: var(--color-fill-3);
        border-color: transparent
    }

    .arco-form-item-status-success .arco-tree-select:not(.arco-tree-select-disabled).arco-tree-select-focused .arco-tree-select-view {
        background-color: var(--color-bg-2);
        border-color: rgb(var(--success-6));
        box-shadow: 0 0 0 0 var(--color-success-light-2)
    }

    .arco-form-item-status-success .arco-picker:not(.arco-picker-disabled) {
        background-color: var(--color-fill-2);
        border-color: transparent
    }

    .arco-form-item-status-success .arco-picker:not(.arco-picker-disabled):hover {
        background-color: var(--color-fill-3);
        border-color: transparent
    }

    .arco-form-item-status-success .arco-picker-focused:not(.arco-picker-disabled),
    .arco-form-item-status-success .arco-picker-focused:not(.arco-picker-disabled):hover {
        border-color: rgb(var(--success-6));
        background-color: var(--color-bg-2);
        box-shadow: 0 0 0 0 var(--color-success-light-2)
    }

    .arco-form-item-status-success .arco-input-tag {
        background-color: var(--color-fill-2);
        border-color: transparent
    }

    .arco-form-item-status-success .arco-input-tag:hover {
        background-color: var(--color-fill-3);
        border-color: transparent
    }

    .arco-form-item-status-success .arco-input-tag.arco-input-tag-focus {
        border-color: rgb(var(--success-6));
        background-color: var(--color-bg-2);
        box-shadow: 0 0 0 0 var(--color-success-light-2)
    }

    .arco-form-item-status-success .arco-form-message-help {
        color: rgb(var(--success-6))
    }

    .arco-form-item-status-success .arco-form-message-help .arco-form-message-help-warning {
        color: rgb(var(--warning-6))
    }

    .arco-form-item-feedback-success {
        color: rgb(var(--success-6))
    }

    .arco-form-item-status-warning .arco-input:not(.arco-input-disabled),
    .arco-form-item-status-warning .arco-input-inner-wrapper:not(.arco-input-inner-wrapper-disabled),
    .arco-form-item-status-warning .arco-textarea:not(.arco-textarea-disabled) {
        background-color: var(--color-warning-light-1);
        border-color: transparent
    }

    .arco-form-item-status-warning .arco-input:not(.arco-input-disabled):hover,
    .arco-form-item-status-warning .arco-input-inner-wrapper:not(.arco-input-inner-wrapper-disabled):hover,
    .arco-form-item-status-warning .arco-textarea:not(.arco-textarea-disabled):hover {
        background-color: var(--color-warning-light-2);
        border-color: transparent
    }

    .arco-form-item-status-warning .arco-input-inner-wrapper.arco-input-inner-wrapper-focus,
    .arco-form-item-status-warning .arco-input-inner-wrapper.arco-textarea-focus,
    .arco-form-item-status-warning .arco-textarea.arco-input-inner-wrapper-focus,
    .arco-form-item-status-warning .arco-textarea.arco-textarea-focus,
    .arco-form-item-status-warning .arco-input-inner-wrapper.arco-input-inner-wrapper-focus:hover,
    .arco-form-item-status-warning .arco-input-inner-wrapper.arco-textarea-focus:hover,
    .arco-form-item-status-warning .arco-textarea.arco-input-inner-wrapper-focus:hover,
    .arco-form-item-status-warning .arco-textarea.arco-textarea-focus:hover,
    .arco-form-item-status-warning .arco-input:focus,
    .arco-form-item-status-warning .arco-input:focus:hover {
        border-color: rgb(var(--warning-6));
        background-color: var(--color-bg-2);
        box-shadow: 0 0 0 0 var(--color-warning-light-2)
    }

    .arco-form-item-status-warning .arco-input-inner-wrapper .arco-input,
    .arco-form-item-status-warning .arco-input-inner-wrapper .arco-input:hover {
        box-shadow: none;
        background: 0 0
    }

    .arco-form-item-status-warning .arco-select:not(.arco-select-disabled) .arco-select-view {
        background-color: var(--color-warning-light-1);
        border-color: transparent
    }

    .arco-form-item-status-warning .arco-select:not(.arco-select-disabled):hover .arco-select-view {
        background-color: var(--color-warning-light-2);
        border-color: transparent
    }

    .arco-form-item-status-warning .arco-select:not(.arco-select-disabled).arco-select-focused .arco-select-view {
        background-color: var(--color-bg-2);
        border-color: rgb(var(--warning-6));
        box-shadow: 0 0 0 0 var(--color-warning-light-2)
    }

    .arco-form-item-status-warning .arco-cascader:not(.arco-cascader-disabled) .arco-cascader-view {
        background-color: var(--color-warning-light-1);
        border-color: transparent
    }

    .arco-form-item-status-warning .arco-cascader:not(.arco-cascader-disabled):hover .arco-cascader-view {
        background-color: var(--color-warning-light-2);
        border-color: transparent
    }

    .arco-form-item-status-warning .arco-cascader:not(.arco-cascader-disabled).arco-cascader-focused .arco-cascader-view {
        background-color: var(--color-bg-2);
        border-color: rgb(var(--warning-6));
        box-shadow: 0 0 0 0 var(--color-warning-light-2)
    }

    .arco-form-item-status-warning .arco-tree-select:not(.arco-tree-select-disabled) .arco-tree-select-view {
        background-color: var(--color-warning-light-1);
        border-color: transparent
    }

    .arco-form-item-status-warning .arco-tree-select:not(.arco-tree-select-disabled):hover .arco-tree-select-view {
        background-color: var(--color-warning-light-2);
        border-color: transparent
    }

    .arco-form-item-status-warning .arco-tree-select:not(.arco-tree-select-disabled).arco-tree-select-focused .arco-tree-select-view {
        background-color: var(--color-bg-2);
        border-color: rgb(var(--warning-6));
        box-shadow: 0 0 0 0 var(--color-warning-light-2)
    }

    .arco-form-item-status-warning .arco-picker:not(.arco-picker-disabled) {
        background-color: var(--color-warning-light-1);
        border-color: transparent
    }

    .arco-form-item-status-warning .arco-picker:not(.arco-picker-disabled):hover {
        background-color: var(--color-warning-light-2);
        border-color: transparent
    }

    .arco-form-item-status-warning .arco-picker-focused:not(.arco-picker-disabled),
    .arco-form-item-status-warning .arco-picker-focused:not(.arco-picker-disabled):hover {
        border-color: rgb(var(--warning-6));
        background-color: var(--color-bg-2);
        box-shadow: 0 0 0 0 var(--color-warning-light-2)
    }

    .arco-form-item-status-warning .arco-input-tag {
        background-color: var(--color-warning-light-1);
        border-color: transparent
    }

    .arco-form-item-status-warning .arco-input-tag:hover {
        background-color: var(--color-warning-light-2);
        border-color: transparent
    }

    .arco-form-item-status-warning .arco-input-tag.arco-input-tag-focus {
        border-color: rgb(var(--warning-6));
        background-color: var(--color-bg-2);
        box-shadow: 0 0 0 0 var(--color-warning-light-2)
    }

    .arco-form-item-status-warning .arco-form-message-help,
    .arco-form-item-status-warning .arco-form-message-help .arco-form-message-help-warning,
    .arco-form-item-feedback-warning {
        color: rgb(var(--warning-6))
    }

    .arco-form-item-status-error .arco-input:not(.arco-input-disabled),
    .arco-form-item-status-error .arco-input-inner-wrapper:not(.arco-input-inner-wrapper-disabled),
    .arco-form-item-status-error .arco-textarea:not(.arco-textarea-disabled) {
        background-color: var(--color-danger-light-1);
        border-color: transparent
    }

    .arco-form-item-status-error .arco-input:not(.arco-input-disabled):hover,
    .arco-form-item-status-error .arco-input-inner-wrapper:not(.arco-input-inner-wrapper-disabled):hover,
    .arco-form-item-status-error .arco-textarea:not(.arco-textarea-disabled):hover {
        background-color: var(--color-danger-light-2);
        border-color: transparent
    }

    .arco-form-item-status-error .arco-input-inner-wrapper.arco-input-inner-wrapper-focus,
    .arco-form-item-status-error .arco-input-inner-wrapper.arco-textarea-focus,
    .arco-form-item-status-error .arco-textarea.arco-input-inner-wrapper-focus,
    .arco-form-item-status-error .arco-textarea.arco-textarea-focus,
    .arco-form-item-status-error .arco-input-inner-wrapper.arco-input-inner-wrapper-focus:hover,
    .arco-form-item-status-error .arco-input-inner-wrapper.arco-textarea-focus:hover,
    .arco-form-item-status-error .arco-textarea.arco-input-inner-wrapper-focus:hover,
    .arco-form-item-status-error .arco-textarea.arco-textarea-focus:hover,
    .arco-form-item-status-error .arco-input:focus,
    .arco-form-item-status-error .arco-input:focus:hover {
        border-color: rgb(var(--danger-6));
        background-color: var(--color-bg-2);
        box-shadow: 0 0 0 0 var(--color-danger-light-2)
    }

    .arco-form-item-status-error .arco-input-inner-wrapper .arco-input,
    .arco-form-item-status-error .arco-input-inner-wrapper .arco-input:hover {
        box-shadow: none;
        background: 0 0
    }

    .arco-form-item-status-error .arco-select:not(.arco-select-disabled) .arco-select-view {
        background-color: var(--color-danger-light-1);
        border-color: transparent
    }

    .arco-form-item-status-error .arco-select:not(.arco-select-disabled):hover .arco-select-view {
        background-color: var(--color-danger-light-2);
        border-color: transparent
    }

    .arco-form-item-status-error .arco-select:not(.arco-select-disabled).arco-select-focused .arco-select-view {
        background-color: var(--color-bg-2);
        border-color: rgb(var(--danger-6));
        box-shadow: 0 0 0 0 var(--color-danger-light-2)
    }

    .arco-form-item-status-error .arco-cascader:not(.arco-cascader-disabled) .arco-cascader-view {
        background-color: var(--color-danger-light-1);
        border-color: transparent
    }

    .arco-form-item-status-error .arco-cascader:not(.arco-cascader-disabled):hover .arco-cascader-view {
        background-color: var(--color-danger-light-2);
        border-color: transparent
    }

    .arco-form-item-status-error .arco-cascader:not(.arco-cascader-disabled).arco-cascader-focused .arco-cascader-view {
        background-color: var(--color-bg-2);
        border-color: rgb(var(--danger-6));
        box-shadow: 0 0 0 0 var(--color-danger-light-2)
    }

    .arco-form-item-status-error .arco-tree-select:not(.arco-tree-select-disabled) .arco-tree-select-view {
        background-color: var(--color-danger-light-1);
        border-color: transparent
    }

    .arco-form-item-status-error .arco-tree-select:not(.arco-tree-select-disabled):hover .arco-tree-select-view {
        background-color: var(--color-danger-light-2);
        border-color: transparent
    }

    .arco-form-item-status-error .arco-tree-select:not(.arco-tree-select-disabled).arco-tree-select-focused .arco-tree-select-view {
        background-color: var(--color-bg-2);
        border-color: rgb(var(--danger-6));
        box-shadow: 0 0 0 0 var(--color-danger-light-2)
    }

    .arco-form-item-status-error .arco-picker:not(.arco-picker-disabled) {
        background-color: var(--color-danger-light-1);
        border-color: transparent
    }

    .arco-form-item-status-error .arco-picker:not(.arco-picker-disabled):hover {
        background-color: var(--color-danger-light-2);
        border-color: transparent
    }

    .arco-form-item-status-error .arco-picker-focused:not(.arco-picker-disabled),
    .arco-form-item-status-error .arco-picker-focused:not(.arco-picker-disabled):hover {
        border-color: rgb(var(--danger-6));
        background-color: var(--color-bg-2);
        box-shadow: 0 0 0 0 var(--color-danger-light-2)
    }

    .arco-form-item-status-error .arco-input-tag {
        background-color: var(--color-danger-light-1);
        border-color: transparent
    }

    .arco-form-item-status-error .arco-input-tag:hover {
        background-color: var(--color-danger-light-2);
        border-color: transparent
    }

    .arco-form-item-status-error .arco-input-tag.arco-input-tag-focus {
        border-color: rgb(var(--danger-6));
        background-color: var(--color-bg-2);
        box-shadow: 0 0 0 0 var(--color-danger-light-2)
    }

    .arco-form-item-status-error .arco-form-message-help {
        color: rgb(var(--danger-6))
    }

    .arco-form-item-status-error .arco-form-message-help .arco-form-message-help-warning {
        color: rgb(var(--warning-6))
    }

    .arco-form-item-feedback-error {
        color: rgb(var(--danger-6))
    }

    .arco-form-item-control-children {
        position: relative
    }

    .arco-form-item-feedback {
        font-size: 14px;
        position: absolute;
        top: 50%;
        right: 9px;
        transform: translateY(-50%)
    }

    .arco-form-item-feedback .arco-icon-loading {
        font-size: 12px
    }

    .arco-form-item-has-feedback .arco-input,
    .arco-form-item-has-feedback .arco-input-inner-wrapper,
    .arco-form-item-has-feedback .arco-textarea,
    .arco-form-item-has-feedback .arco-select.arco-select-multiple .arco-select-view,
    .arco-form-item-has-feedback .arco-select.arco-select-single .arco-select-view {
        padding-right: 28px
    }

    .arco-form-item-has-feedback .arco-select.arco-select-multiple .arco-select-suffix {
        padding-right: 0
    }

    .arco-form-item-has-feedback .arco-cascader.arco-cascader-multiple .arco-cascader-view,
    .arco-form-item-has-feedback .arco-cascader.arco-cascader-single .arco-cascader-view {
        padding-right: 28px
    }

    .arco-form-item-has-feedback .arco-cascader.arco-cascader-multiple .arco-cascader-suffix {
        padding-right: 0
    }

    .arco-form-item-has-feedback .arco-tree-select.arco-tree-select-multiple .arco-tree-select-view,
    .arco-form-item-has-feedback .arco-tree-select.arco-tree-select-single .arco-tree-select-view {
        padding-right: 28px
    }

    .arco-form-item-has-feedback .arco-tree-select.arco-tree-select-multiple .arco-tree-select-suffix {
        padding-right: 0
    }

    .arco-form-item-has-feedback .arco-picker {
        padding-right: 28px
    }

    .arco-form-item-has-feedback .arco-picker-suffix .arco-picker-suffix-icon,
    .arco-form-item-has-feedback .arco-picker-suffix .arco-picker-clear-icon {
        margin-left: 0;
        margin-right: 0
    }

    .arco-form-item-has-feedback .arco-input-tag {
        padding-right: 23px
    }

    .arco-form-item-has-feedback .arco-input-tag-suffix {
        padding-right: 0
    }

    .arco-form-rtl .arco-form-item-feedback {
        right: unset;
        left: 9px
    }

    .arco-form-rtl .arco-form-item-has-feedback .arco-input,
    .arco-form-rtl .arco-form-item-has-feedback .arco-input-inner-wrapper,
    .arco-form-rtl .arco-form-item-has-feedback .arco-textarea,
    .arco-form-rtl .arco-form-item-has-feedback .arco-select.arco-select-multiple .arco-select-view,
    .arco-form-rtl .arco-form-item-has-feedback .arco-select.arco-select-single .arco-select-view {
        padding-left: 28px
    }

    .arco-form-rtl .arco-form-item-has-feedback .arco-select.arco-select-multiple .arco-select-suffix {
        padding-left: 0
    }

    .arco-form-rtl .arco-form-item-has-feedback .arco-cascader.arco-cascader-multiple .arco-cascader-view,
    .arco-form-rtl .arco-form-item-has-feedback .arco-cascader.arco-cascader-single .arco-cascader-view {
        padding-left: 28px
    }

    .arco-form-rtl .arco-form-item-has-feedback .arco-cascader.arco-cascader-multiple .arco-cascader-suffix {
        padding-left: 0
    }

    .arco-form-rtl .arco-form-item-has-feedback .arco-tree-select.arco-tree-select-multiple .arco-tree-select-view,
    .arco-form-rtl .arco-form-item-has-feedback .arco-tree-select.arco-tree-select-single .arco-tree-select-view {
        padding-left: 28px
    }

    .arco-form-rtl .arco-form-item-has-feedback .arco-tree-select.arco-tree-select-multiple .arco-tree-select-suffix {
        padding-left: 0
    }

    .arco-form-rtl .arco-form-item-has-feedback .arco-picker {
        padding-left: 28px
    }

    .arco-form-rtl .arco-form-item-has-feedback .arco-picker-suffix .arco-picker-suffix-icon,
    .arco-form-rtl .arco-form-item-has-feedback .arco-picker-suffix .arco-picker-clear-icon {
        margin-left: 0;
        margin-right: 0
    }

    .arco-form-rtl .arco-form-item-has-feedback .arco-input-tag {
        padding-left: 23px
    }

    .arco-form-rtl .arco-form-item-has-feedback .arco-input-tag-suffix {
        padding-left: 0
    }

    .formblink-enter,
    .formblink-appear {
        opacity: 0
    }

    .formblink-enter-active,
    .formblink-appear-active {
        opacity: 1;
        transition: opacity .3s cubic-bezier(0, 0, 1, 1)
    }

    .formblink-enter-done {
        animation: .5s cubic-bezier(0, 0, 1, 1) arco-form-blink
    }

    @keyframes arco-form-blink {
        0% {
            opacity: 1
        }

        50% {
            opacity: .2
        }

        to {
            opacity: 1
        }
    }

    .arco-form-rtl {
        direction: rtl
    }

    .arco-form-rtl .arco-form-item>.arco-form-label-item {
        padding-left: 16px;
        padding-right: 0
    }

    .arco-form-rtl .arco-form-label-item {
        text-align: left
    }

    .arco-form-rtl .arco-form-layout-vertical>.arco-form-label-item {
        text-align: right
    }

    .arco-form-rtl .arco-form-layout-inline {
        margin-left: 24px;
        margin-right: 0
    }
}


@layer base {
    @keyframes arco-carousel-slide-x-in {
        0% {
            transform: translate(100%)
        }

        to {
            transform: translate(0)
        }
    }

    @keyframes arco-carousel-slide-x-out {
        0% {
            transform: translate(0)
        }

        to {
            transform: translate(-100%)
        }
    }

    @keyframes arco-carousel-slide-x-in-reverse {
        0% {
            transform: translate(-100%)
        }

        to {
            transform: translate(0)
        }
    }

    @keyframes arco-carousel-slide-x-out-reverse {
        0% {
            transform: translate(0)
        }

        to {
            transform: translate(100%)
        }
    }

    @keyframes arco-carousel-slide-y-in {
        0% {
            transform: translateY(100%)
        }

        to {
            transform: translateY(0)
        }
    }

    @keyframes arco-carousel-slide-y-out {
        0% {
            transform: translateY(0)
        }

        to {
            transform: translateY(-100%)
        }
    }

    @keyframes arco-carousel-slide-y-in-reverse {
        0% {
            transform: translateY(-100%)
        }

        to {
            transform: translateY(0)
        }
    }

    @keyframes arco-carousel-slide-y-out-reverse {
        0% {
            transform: translateY(0)
        }

        to {
            transform: translateY(100%)
        }
    }

    @keyframes arco-carousel-card-bottom-to-middle {
        0% {
            opacity: 0;
            transform: translate(0%)translateZ(-400px)
        }

        to {
            opacity: .4;
            transform: translate(0%)translateZ(-200px)
        }
    }

    @keyframes arco-carousel-card-middle-to-bottom {
        0% {
            opacity: .4;
            transform: translate(-100%)translateZ(-200px)
        }

        to {
            opacity: 0;
            transform: translate(-100%)translateZ(-400px)
        }
    }

    @keyframes arco-carousel-card-middle-to-bottom-rtl {
        0% {
            opacity: .4;
            transform: translate(100%)translateZ(-200px)
        }

        to {
            opacity: 0;
            transform: translate(100%)translateZ(-400px)
        }
    }

    @keyframes arco-carousel-card-top-to-middle {
        0% {
            opacity: 1;
            transform: translate(-50%)translateZ(0)
        }

        to {
            opacity: .4;
            transform: translate(-100%)translateZ(-200px)
        }
    }

    @keyframes arco-carousel-card-top-to-middle-rtl {
        0% {
            opacity: 1;
            transform: translate(50%)translateZ(0)
        }

        to {
            opacity: .4;
            transform: translate(100%)translateZ(-200px)
        }
    }

    @keyframes arco-carousel-card-middle-to-top {
        0% {
            opacity: .4;
            transform: translate(0)translateZ(-200px)
        }

        to {
            opacity: 1;
            transform: translate(-50%)translateZ(0)
        }
    }

    @keyframes arco-carousel-card-middle-to-top-rtl {
        0% {
            opacity: .4;
            transform: translate(0)translateZ(-200px)
        }

        to {
            opacity: 1;
            transform: translate(50%)translateZ(0)
        }
    }

    @keyframes arco-carousel-card-bottom-to-middle-reverse {
        0% {
            opacity: 0;
            transform: translate(-100%)translateZ(-400px)
        }

        to {
            opacity: .4;
            transform: translate(-100%)translateZ(-200px)
        }
    }

    @keyframes arco-carousel-card-bottom-to-middle-reverse-rtl {
        0% {
            opacity: 0;
            transform: translate(100%)translateZ(-400px)
        }

        to {
            opacity: .4;
            transform: translate(100%)translateZ(-200px)
        }
    }

    @keyframes arco-carousel-card-middle-to-bottom-reverse {
        0% {
            opacity: .4;
            transform: translate(0%)translateZ(-200px)
        }

        to {
            opacity: 0;
            transform: translate(0%)translateZ(-400px)
        }
    }

    @keyframes arco-carousel-card-top-to-middle-reverse {
        0% {
            opacity: 1;
            transform: translate(-50%)translateZ(0)
        }

        to {
            opacity: .4;
            transform: translate(0%)translateZ(-200px)
        }
    }

    @keyframes arco-carousel-card-top-to-middle-reverse-rtl {
        0% {
            opacity: 1;
            transform: translate(50%)translateZ(0)
        }

        to {
            opacity: .4;
            transform: translate(0%)translateZ(-200px)
        }
    }

    @keyframes arco-carousel-card-middle-to-top-reverse {
        0% {
            opacity: .4;
            transform: translate(-100%)translateZ(-200px)
        }

        to {
            opacity: 1;
            transform: translate(-50%)translateZ(0)
        }
    }

    @keyframes arco-carousel-card-middle-to-top-reverse-rtl {
        0% {
            opacity: .4;
            transform: translate(100%)translateZ(-200px)
        }

        to {
            opacity: 1;
            transform: translate(50%)translateZ(0)
        }
    }

    @keyframes arco-carousel-card-right-to-middle {
        0% {
            opacity: 0;
            transform: translate(-50%)translateY(0%)translateZ(-400px)
        }

        to {
            opacity: .4;
            transform: translate(-50%)translateY(0%)translateZ(-200px)
        }
    }

    @keyframes arco-carousel-card-middle-to-right {
        0% {
            opacity: .4;
            transform: translate(-50%)translateY(-100%)translateZ(-200px)
        }

        to {
            opacity: 0;
            transform: translate(-50%)translateY(-100%)translateZ(-400px)
        }
    }

    @keyframes arco-carousel-card-left-to-middle {
        0% {
            opacity: 1;
            transform: translate(-50%)translateY(-50%)translateZ(0)
        }

        to {
            opacity: .4;
            transform: translate(-50%)translateY(-100%)translateZ(-200px)
        }
    }

    @keyframes arco-carousel-card-middle-to-left {
        0% {
            opacity: .4;
            transform: translate(-50%)translateY(0)translateZ(-200px)
        }

        to {
            opacity: 1;
            transform: translate(-50%)translateY(-50%)translateZ(0)
        }
    }

    @keyframes arco-carousel-card-right-to-middle-reverse {
        0% {
            opacity: 0;
            transform: translate(-50%)translateY(-100%)translateZ(-400px)
        }

        to {
            opacity: .4;
            transform: translate(-50%)translateY(-100%)translateZ(-200px)
        }
    }

    @keyframes arco-carousel-card-middle-to-right-reverse {
        0% {
            opacity: .4;
            transform: translate(-50%)translateY(0%)translateZ(-200px)
        }

        to {
            opacity: 0;
            transform: translate(-50%)translateY(0%)translateZ(-400px)
        }
    }

    @keyframes arco-carousel-card-left-to-middle-reverse {
        0% {
            opacity: 1;
            transform: translate(-50%)translateY(-50%)translateZ(0)
        }

        to {
            opacity: .4;
            transform: translate(-50%)translateY(0%)translateZ(-200px)
        }
    }

    @keyframes arco-carousel-card-middle-to-left-reverse {
        0% {
            opacity: .4;
            transform: translate(-50%)translateY(-100%)translateZ(-200px)
        }

        to {
            opacity: 1;
            transform: translate(-50%)translateY(-50%)translateZ(0)
        }
    }

    .arco-carousel {
        position: relative
    }

    .arco-carousel-indicator-position-outer {
        margin-bottom: 30px
    }

    .arco-carousel-slide,
    .arco-carousel-card,
    .arco-carousel-fade {
        width: 100%;
        height: 100%;
        position: relative;
        overflow: hidden
    }

    .arco-carousel-slide>*,
    .arco-carousel-card>*,
    .arco-carousel-fade>* {
        width: 100%;
        height: 100%;
        position: absolute;
        top: 0;
        left: 0;
        overflow: hidden
    }

    .arco-carousel-item-current {
        z-index: 1;
        position: relative
    }

    .arco-carousel-slide>:not(.arco-carousel-item-current) {
        visibility: hidden
    }

    .arco-carousel-slide.arco-carousel-horizontal .arco-carousel-item-slide-out {
        animation: arco-carousel-slide-x-out;
        display: block
    }

    .arco-carousel-slide.arco-carousel-horizontal .arco-carousel-item-slide-in {
        animation: arco-carousel-slide-x-in;
        display: block
    }

    .arco-carousel-slide.arco-carousel-horizontal.arco-carousel-negative .arco-carousel-item-slide-out {
        animation: arco-carousel-slide-x-out-reverse
    }

    .arco-carousel-slide.arco-carousel-horizontal.arco-carousel-negative .arco-carousel-item-slide-in {
        animation: arco-carousel-slide-x-in-reverse
    }

    .arco-carousel-slide.arco-carousel-vertical .arco-carousel-item-slide-out {
        animation: arco-carousel-slide-y-out;
        display: block
    }

    .arco-carousel-slide.arco-carousel-vertical .arco-carousel-item-slide-in {
        animation: arco-carousel-slide-y-in;
        display: block
    }

    .arco-carousel-slide.arco-carousel-vertical.arco-carousel-negative .arco-carousel-item-slide-out {
        animation: arco-carousel-slide-y-out-reverse
    }

    .arco-carousel-slide.arco-carousel-vertical.arco-carousel-negative .arco-carousel-item-slide-in {
        animation: arco-carousel-slide-y-in-reverse
    }

    .arco-carousel-card {
        perspective: 800px
    }

    .arco-carousel-card.arco-carousel-horizontal>* {
        opacity: 0;
        animation: arco-carousel-card-middle-to-bottom;
        left: 50%;
        transform: translate(-50%)translateZ(-400px)
    }

    .arco-carousel-rtl .arco-carousel-card.arco-carousel-horizontal>* {
        left: unset;
        animation: arco-carousel-card-middle-to-bottom-rtl;
        right: 50%
    }

    .arco-carousel-card.arco-carousel-horizontal .arco-carousel-item-prev {
        opacity: .4;
        animation: arco-carousel-card-top-to-middle;
        transform: translate(-100%)translateZ(-200px)
    }

    .arco-carousel-rtl .arco-carousel-card.arco-carousel-horizontal .arco-carousel-item-prev {
        animation: arco-carousel-card-top-to-middle-rtl;
        transform: translate(100%)translateZ(-200px)
    }

    .arco-carousel-card.arco-carousel-horizontal .arco-carousel-item-next {
        opacity: .4;
        animation: arco-carousel-card-bottom-to-middle;
        transform: translate(0%)translateZ(-200px)
    }

    .arco-carousel-card.arco-carousel-horizontal .arco-carousel-item-current {
        opacity: 1;
        animation: arco-carousel-card-middle-to-top;
        transform: translate(-50%)translateZ(0)
    }

    .arco-carousel-rtl .arco-carousel-card.arco-carousel-horizontal .arco-carousel-item-current {
        animation: arco-carousel-card-middle-to-top-rtl;
        transform: translate(50%)translateZ(0)
    }

    .arco-carousel-card.arco-carousel-horizontal.arco-carousel-negative>* {
        animation: arco-carousel-card-middle-to-bottom-reverse
    }

    .arco-carousel-card.arco-carousel-horizontal.arco-carousel-negative .arco-carousel-item-prev {
        animation: arco-carousel-card-bottom-to-middle-reverse
    }

    .arco-carousel-rtl .arco-carousel-card.arco-carousel-horizontal.arco-carousel-negative .arco-carousel-item-prev {
        animation: arco-carousel-card-bottom-to-middle-reverse-rtl
    }

    .arco-carousel-card.arco-carousel-horizontal.arco-carousel-negative .arco-carousel-item-next {
        animation: arco-carousel-card-top-to-middle-reverse
    }

    .arco-carousel-rtl .arco-carousel-card.arco-carousel-horizontal.arco-carousel-negative .arco-carousel-item-next {
        animation: arco-carousel-card-top-to-middle-reverse-rtl
    }

    .arco-carousel-card.arco-carousel-horizontal.arco-carousel-negative .arco-carousel-item-current {
        animation: arco-carousel-card-middle-to-top-reverse
    }

    .arco-carousel-rtl .arco-carousel-card.arco-carousel-horizontal.arco-carousel-negative .arco-carousel-item-current {
        animation: arco-carousel-card-middle-to-top-reverse-rtl
    }

    .arco-carousel-card.arco-carousel-vertical>* {
        opacity: 0;
        justify-content: center;
        animation: arco-carousel-card-middle-to-right;
        display: flex;
        top: 50%;
        left: 50%;
        transform: translate(-50%)translateY(-50%)translateZ(-400px)
    }

    .arco-carousel-card.arco-carousel-vertical .arco-carousel-item-prev {
        opacity: .4;
        animation: arco-carousel-card-left-to-middle;
        transform: translate(-50%)translateY(-100%)translateZ(-200px)
    }

    .arco-carousel-card.arco-carousel-vertical .arco-carousel-item-next {
        opacity: .4;
        animation: arco-carousel-card-right-to-middle;
        transform: translate(-50%)translateY(0%)translateZ(-200px)
    }

    .arco-carousel-card.arco-carousel-vertical .arco-carousel-item-current {
        opacity: 1;
        animation: arco-carousel-card-middle-to-left;
        transform: translate(-50%)translateY(-50%)translateZ(0)
    }

    .arco-carousel-card.arco-carousel-negative>* {
        animation: arco-carousel-card-middle-to-right-reverse
    }

    .arco-carousel-card.arco-carousel-negative .arco-carousel-item-prev {
        animation: arco-carousel-card-right-to-middle-reverse
    }

    .arco-carousel-card.arco-carousel-negative .arco-carousel-item-next {
        animation: arco-carousel-card-left-to-middle-reverse
    }

    .arco-carousel-card.arco-carousel-negative .arco-carousel-item-current {
        animation: arco-carousel-card-middle-to-left-reverse
    }

    .arco-carousel-fade>* {
        opacity: 0;
        left: 50%;
        transform: translate(-50%)
    }

    .arco-carousel-fade .arco-carousel-item-current {
        opacity: 1
    }

    .arco-carousel-indicator {
        margin: 0;
        padding: 0;
        display: flex;
        position: absolute
    }

    .arco-carousel-indicator-wrapper {
        z-index: 2;
        position: absolute
    }

    .arco-carousel-indicator-wrapper-top {
        background: linear-gradient(rgba(0, 0, 0, .15) 0%, transparent 87%);
        height: 48px;
        top: 0;
        left: 0;
        right: 0
    }

    .arco-carousel-indicator-wrapper-bottom {
        background: linear-gradient(transparent 13%, rgba(0, 0, 0, .15) 100%);
        height: 48px;
        bottom: 0;
        left: 0;
        right: 0
    }

    .arco-carousel-indicator-wrapper-left {
        background: linear-gradient(90deg, rgba(0, 0, 0, .15) 0%, transparent 87%);
        width: 48px;
        height: 100%;
        top: 0;
        left: 0
    }

    .arco-carousel-indicator-wrapper-right {
        background: linear-gradient(90deg, transparent 13%, rgba(0, 0, 0, .15) 100%);
        width: 48px;
        height: 100%;
        top: 0;
        right: 0
    }

    .arco-carousel-indicator-wrapper-outer {
        background: 0 0;
        left: 0;
        right: 0
    }

    .arco-carousel-indicator-wrapper-outer-right {
        width: 20px;
        height: 100%;
        top: 0;
        right: 0
    }

    .arco-carousel-indicator-bottom {
        bottom: 12px;
        left: 50%;
        transform: translate(-50%)
    }

    .arco-carousel-indicator-top {
        top: 12px;
        left: 50%;
        transform: translate(-50%)
    }

    .arco-carousel-indicator-left {
        top: 50%;
        left: 12px;
        transform: translate(-50%, -50%)rotate(90deg)
    }

    .arco-carousel-indicator-right {
        top: 50%;
        right: 12px;
        transform: translate(50%, -50%)rotate(90deg)
    }

    .arco-carousel-indicator-outer {
        background-color: transparent;
        border-radius: 20px;
        padding: 4px;
        left: 50%;
        transform: translate(-50%)
    }

    .arco-carousel-indicator-outer.arco-carousel-indicator-dot {
        bottom: -22px
    }

    .arco-carousel-indicator-outer.arco-carousel-indicator-line {
        bottom: -20px
    }

    .arco-carousel-indicator-outer.arco-carousel-indicator-slider {
        background-color: rgba(var(--gray-4), .5);
        padding: 0;
        bottom: -16px
    }

    .arco-carousel-indicator-outer .arco-carousel-indicator-item {
        background-color: rgba(var(--gray-4), .5)
    }

    .arco-carousel-indicator-outer .arco-carousel-indicator-item:hover,
    .arco-carousel-indicator-outer .arco-carousel-indicator-item-active {
        background-color: var(--color-fill-4)
    }

    .arco-carousel-indicator-outer-right {
        background-color: transparent;
        border-radius: 20px;
        padding: 4px;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%)rotate(90deg)
    }

    .arco-carousel-indicator-outer-right.arco-carousel-indicator-slider {
        background-color: rgba(var(--gray-4), .5);
        padding: 0
    }

    .arco-carousel-indicator-outer-right .arco-carousel-indicator-item {
        background-color: rgba(var(--gray-4), .5)
    }

    .arco-carousel-indicator-outer-right .arco-carousel-indicator-item:hover,
    .arco-carousel-indicator-outer-right .arco-carousel-indicator-item-active {
        background-color: var(--color-fill-4)
    }

    .arco-carousel-indicator-item {
        border-radius: var(--border-radius-medium);
        cursor: pointer;
        background-color: rgba(255, 255, 255, .3);
        display: inline-block
    }

    .arco-carousel-indicator-item:hover,
    .arco-carousel-indicator-item-active {
        background-color: var(--color-white)
    }

    .arco-carousel-indicator-dot .arco-carousel-indicator-item {
        border-radius: 50%;
        width: 6px;
        height: 6px
    }

    .arco-carousel-indicator-dot .arco-carousel-indicator-item:not(:last-child) {
        margin-right: 8px
    }

    .arco-carousel-indicator-line .arco-carousel-indicator-item {
        width: 12px;
        height: 4px
    }

    .arco-carousel-indicator-line .arco-carousel-indicator-item:not(:last-child) {
        margin-right: 8px
    }

    .arco-carousel-indicator-slider {
        border-radius: var(--border-radius-medium);
        cursor: pointer;
        background-color: rgba(255, 255, 255, .3);
        width: 48px;
        height: 4px
    }

    .arco-carousel-indicator-slider .arco-carousel-indicator-item {
        height: 100%;
        transition: left .3s;
        position: absolute;
        top: 0
    }

    .arco-carousel-arrow>div {
        width: 24px;
        height: 24px;
        color: var(--color-white);
        cursor: pointer;
        z-index: 2;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        background-color: rgba(255, 255, 255, .3);
        border-radius: 50%;
        justify-content: center;
        align-items: center;
        display: flex;
        position: absolute
    }

    .arco-carousel-arrow>div:focus-visible {
        box-shadow: 0 0 0 2px var(--color-primary-light-3)
    }

    .arco-carousel-arrow>div>svg {
        color: var(--color-white);
        font-size: 14px
    }

    .arco-carousel-arrow>div:hover {
        background-color: rgba(255, 255, 255, .5)
    }

    .arco-carousel-arrow-left {
        top: 50%;
        left: 12px;
        transform: translateY(-50%)
    }

    .arco-carousel-arrow-right {
        top: 50%;
        right: 12px;
        transform: translateY(-50%)
    }

    .arco-carousel-arrow-top {
        top: 12px;
        left: 50%;
        transform: translate(-50%)
    }

    .arco-carousel-arrow-bottom {
        bottom: 12px;
        left: 50%;
        transform: translate(-50%)
    }

    .arco-carousel-arrow-hover div {
        opacity: 0;
        transition: all .3s
    }

    .arco-carousel:hover .arco-carousel-arrow-hover div {
        opacity: 1
    }

    .arco-carousel-rtl {
        direction: rtl
    }

    .arco-carousel-rtl .arco-carousel-indicator-dot .arco-carousel-indicator-item:not(:last-child),
    .arco-carousel-rtl .arco-carousel-indicator-line .arco-carousel-indicator-item:not(:last-child) {
        margin-left: 8px;
        margin-right: 0
    }

    body[arco-theme=dark] .arco-carousel-arrow>div {
        background-color: rgba(var(--gray-1), .3)
    }

    body[arco-theme=dark] .arco-carousel-arrow>div:hover {
        background-color: rgba(var(--gray-1), .5)
    }

    body[arco-theme=dark] .arco-carousel-indicator-item,
    body[arco-theme=dark] .arco-carousel-indicator-slider {
        background-color: rgba(var(--gray-1), .3)
    }

    body[arco-theme=dark] .arco-carousel-indicator-item-active,
    body[arco-theme=dark] .arco-carousel-indicator-item:hover {
        background-color: var(--color-white)
    }

    body[arco-theme=dark] .arco-carousel-indicator-outer.arco-carousel-indicator-slider {
        background-color: rgba(var(--gray-4), .5)
    }

    body[arco-theme=dark] .arco-carousel-indicator-outer .arco-carousel-indicator-item:hover,
    body[arco-theme=dark] .arco-carousel-indicator-outer .arco-carousel-indicator-item-active {
        background-color: var(--color-fill-4)
    }
}


@layer base {
    .arco-upload {
        max-width: 100%;
        display: inline-block
    }

    .arco-upload-type-picture-card {
        vertical-align: top
    }

    .arco-upload-drag {
        width: 100%
    }

    .arco-upload-hide {
        display: none
    }

    .arco-upload-disabled .arco-upload-trigger-picture,
    .arco-upload-disabled .arco-upload-trigger-picture:hover {
        cursor: not-allowed;
        border-color: var(--color-neutral-4);
        background-color: var(--color-fill-1);
        color: var(--color-text-4)
    }

    .arco-upload-disabled .arco-upload-trigger-drag,
    .arco-upload-disabled .arco-upload-trigger-drag:hover {
        cursor: not-allowed;
        border-color: var(--color-text-4);
        background-color: var(--color-fill-1)
    }

    .arco-upload-disabled .arco-upload-trigger-drag .arco-icon-plus,
    .arco-upload-disabled .arco-upload-trigger-drag:hover .arco-icon-plus,
    .arco-upload-disabled .arco-upload-trigger-drag .arco-upload-trigger-drag-text,
    .arco-upload-disabled .arco-upload-trigger-drag:hover .arco-upload-trigger-drag-text,
    .arco-upload-disabled .arco-upload-trigger-tip {
        color: var(--color-text-4)
    }

    .arco-upload-trigger {
        cursor: pointer;
        vertical-align: top;
        width: 100%;
        display: inline-block
    }

    .arco-upload-trigger-tip {
        color: var(--color-text-3);
        white-space: nowrap;
        text-overflow: ellipsis;
        margin-top: 4px;
        font-size: 12px;
        line-height: 1.5;
        overflow: hidden
    }

    .arco-upload-trigger-picture {
        min-width: 80px;
        height: 80px;
        color: var(--color-text-2);
        text-align: center;
        background: var(--color-fill-2);
        border-radius: var(--border-radius-small);
        border: 1px dashed var(--color-neutral-3);
        margin-bottom: 0;
        transition: all .1s cubic-bezier(0, 0, 1, 1)
    }

    .arco-upload-trigger-picture:hover {
        border-color: var(--color-neutral-4);
        background-color: var(--color-fill-3);
        color: var(--color-text-2)
    }

    .arco-upload-trigger-picture:focus-visible {
        box-shadow: 0 0 0 2px var(--color-primary-light-3)
    }

    .arco-upload-trigger-picture-text {
        position: relative;
        top: 50%;
        transform: translateY(-50%)
    }

    .arco-upload-trigger-drag {
        border-radius: var(--border-radius-small);
        border: 1px dashed var(--color-neutral-3);
        background-color: var(--color-fill-1);
        text-align: center;
        width: 100%;
        color: var(--color-text-1);
        padding: 50px 0;
        transition: all .2s
    }

    .arco-upload-trigger-drag .arco-icon-plus {
        color: var(--color-text-2);
        margin-bottom: 24px;
        font-size: 14px
    }

    .arco-upload-trigger-drag:hover {
        border-color: var(--color-neutral-4);
        background-color: var(--color-fill-3)
    }

    .arco-upload-trigger-drag:hover .arco-upload-trigger-drag-text {
        color: var(--color-text-1)
    }

    .arco-upload-trigger-drag:hover .arco-icon-plus {
        color: var(--color-text-2)
    }

    .arco-upload-trigger-drag:focus-visible {
        box-shadow: 0 0 0 2px var(--color-primary-light-3)
    }

    .arco-upload-trigger-drag-active {
        border-color: rgb(var(--primary-6));
        color: var(--color-text-1);
        background-color: var(--color-primary-light-1)
    }

    .arco-upload-trigger-drag-active .arco-upload-trigger-drag-text {
        color: var(--color-text-1)
    }

    .arco-upload-trigger-drag-active .arco-icon-plus {
        color: rgb(var(--primary-6))
    }

    .arco-upload-trigger-drag .arco-upload-trigger-tip {
        margin-top: 0
    }

    .arco-upload-trigger-drag-text {
        color: var(--color-text-1);
        font-size: 14px;
        line-height: 1.5
    }

    .arco-upload-hide+.arco-upload-list .arco-upload-list-item:first-of-type {
        margin-top: 0
    }

    .arco-upload-list {
        width: 100%
    }

    .arco-upload-list-type-text .arco-upload-list-item:first-of-type,
    .arco-upload-list-type-picture-list .arco-upload-list-item:first-of-type {
        margin-top: 24px
    }

    .arco-upload-list-file-icon {
        color: rgb(var(--primary-6));
        margin-right: 12px;
        font-size: 16px;
        line-height: 16px
    }

    .arco-upload-list-preview-icon {
        cursor: pointer
    }

    .arco-upload-list-error-icon {
        cursor: pointer;
        color: rgb(var(--danger-6));
        margin-left: 4px;
        font-size: 14px
    }

    .arco-upload-list-success-icon {
        cursor: pointer;
        color: rgb(var(--success-6));
        font-size: 14px;
        line-height: 14px
    }

    .arco-upload-list-remove-icon {
        cursor: pointer;
        font-size: 14px;
        position: relative
    }

    .arco-upload-list-start-icon,
    .arco-upload-list-cancel-icon {
        color: var(--color-white);
        font-size: 12px;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%)translateY(-50%)
    }

    .arco-upload-list-start-icon:focus-visible {
        color: rgb(var(--primary-6))
    }

    .arco-upload-list-cancel-icon:focus-visible {
        color: rgb(var(--primary-6))
    }

    .arco-upload-list-reupload-icon {
        cursor: pointer;
        color: rgb(var(--primary-6));
        font-size: 14px;
        transition: all .2s
    }

    .arco-upload-list-reupload-icon:active,
    .arco-upload-list-reupload-icon:hover {
        color: rgb(var(--primary-7))
    }

    .arco-upload-list-reupload-icon:focus-visible {
        box-shadow: inset 0 0 0 2px var(--color-primary-light-3)
    }

    .arco-upload-list-status {
        cursor: pointer;
        line-height: 12px;
        position: relative
    }

    .arco-upload-list-status:hover .arco-progress-circle-mask {
        stroke: rgba(var(--gray-10), .2)
    }

    .arco-upload-list-status:hover .arco-progress-circle-path {
        stroke: rgb(var(--primary-7))
    }

    .arco-upload-list-item-done .arco-upload-list-file-icon {
        color: rgb(var(--primary-6))
    }

    .arco-upload-list-item {
        box-sizing: border-box;
        margin-top: 12px;
        padding-right: 24px;
        position: relative
    }

    .arco-upload-list-item-operation {
        color: var(--color-text-2);
        font-size: 12px;
        position: absolute;
        top: 50%;
        right: 0;
        transform: translateY(-50%)
    }

    .arco-upload-list-item-operation .arco-upload-list-remove-icon-hover:focus-visible:before {
        box-shadow: 0 0 0 2px rgb(var(--primary-6))
    }

    .arco-upload-list-item-operation .arco-upload-list-remove-icon {
        font-size: inherit
    }

    .arco-upload-list-item-text {
        border-radius: var(--border-radius-small);
        box-sizing: border-box;
        background-color: var(--color-fill-1);
        flex-wrap: nowrap;
        align-items: center;
        width: 100%;
        padding: 8px 10px 8px 12px;
        font-size: 14px;
        display: flex
    }

    .arco-upload-list-item-text-content {
        text-overflow: ellipsis;
        white-space: nowrap;
        flex-wrap: nowrap;
        flex: 1;
        justify-content: space-between;
        align-items: center;
        transition: background-color .1s cubic-bezier(0, 0, 1, 1);
        display: flex;
        overflow: hidden
    }

    .arco-upload-list-item-text-thumbnail {
        flex-shrink: 0;
        width: 40px;
        height: 40px;
        margin-right: 12px
    }

    .arco-upload-list-item-text-thumbnail img {
        width: 100%;
        height: 100%
    }

    .arco-upload-list-item-text-name {
        white-space: nowrap;
        color: var(--color-text-1);
        text-overflow: ellipsis;
        flex-grow: 1;
        flex-shrink: 1;
        align-items: center;
        margin-right: 10px;
        font-size: 14px;
        line-height: 1.4286;
        display: flex;
        overflow: hidden
    }

    .arco-upload-list-item-text-name-link {
        cursor: pointer;
        color: rgb(var(--link-6));
        text-overflow: ellipsis;
        text-decoration: none;
        overflow: hidden
    }

    .arco-upload-list-item-text-name-text {
        text-overflow: ellipsis;
        overflow: hidden
    }

    .arco-upload-list-item-error .arco-upload-list-status,
    .arco-upload-list-item-done .arco-upload-list-status {
        display: none
    }

    .arco-upload-list-type-text .arco-upload-list-item-error .arco-upload-list-item-text-name-link,
    .arco-upload-list-type-text .arco-upload-list-item-error .arco-upload-list-item-text-name {
        color: rgb(var(--danger-6))
    }

    .arco-upload-list.arco-upload-list-type-picture-card {
        vertical-align: top;
        display: inline
    }

    .arco-upload-list.arco-upload-list-type-picture-card .arco-upload-list-status {
        margin-left: 0;
        top: 50%;
        transform: translateY(-50%)
    }

    .arco-upload-list-type-picture-card .arco-upload-list-item {
        vertical-align: top;
        margin-top: 0;
        margin-bottom: 8px;
        margin-right: 8px;
        padding-right: 0;
        transition: all .2s cubic-bezier(.34, .69, .1, 1);
        display: inline-block;
        overflow: hidden
    }

    .arco-upload-list-type-picture-card .arco-upload-list-item-error .arco-upload-list-item-picture-mask {
        opacity: 1
    }

    .arco-upload-list-item-picture {
        border-radius: var(--border-radius-small);
        box-sizing: border-box;
        text-align: center;
        vertical-align: top;
        background-color: var(--color-fill-2);
        width: 80px;
        height: 80px;
        position: relative;
        overflow: hidden
    }

    .arco-upload-list-item-picture img {
        width: 100%;
        height: 100%
    }

    .arco-upload-list-item-picture-mask {
        cursor: pointer;
        text-align: center;
        color: var(--color-white);
        opacity: 0;
        background: rgba(0, 0, 0, .5);
        font-size: 16px;
        line-height: 80px;
        transition: opacity .1s cubic-bezier(0, 0, 1, 1);
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0
    }

    .arco-upload-list-item-picture-operation {
        font-size: 14px
    }

    .arco-upload-list-item-picture-operation .arco-upload-list-reupload-icon {
        color: var(--color-white)
    }

    .arco-upload-list-item-picture-operation .arco-upload-list-reupload-icon+.arco-upload-list-remove-icon,
    .arco-upload-list-item-picture-operation .arco-upload-list-preview-icon+.arco-upload-list-remove-icon {
        margin-left: 20px
    }

    .arco-upload-list-item-picture-operation .arco-upload-list-reupload-icon:focus-visible {
        box-shadow: 0 0 0 2px var(--color-primary-light-3);
        border-radius: 2px
    }

    .arco-upload-list-item-picture-operation .arco-upload-list-preview-icon:focus-visible {
        box-shadow: 0 0 0 2px var(--color-primary-light-3);
        border-radius: 2px
    }

    .arco-upload-list-item-picture-operation .arco-upload-list-remove-icon:focus-visible {
        box-shadow: 0 0 0 2px var(--color-primary-light-3);
        border-radius: 2px
    }

    .arco-upload-list-item-picture-error-tip .arco-upload-list-item-picture-operation {
        opacity: 0;
        width: 0;
        height: 0
    }

    .arco-upload-list-item-picture-error-tip .arco-upload-list-error-icon {
        color: var(--color-white);
        font-size: 26px
    }

    .arco-upload-list-item-picture-mask:hover,
    .arco-upload-list-item-picture-mask:hover .arco-upload-list-item-picture-operation {
        opacity: 1;
        display: block
    }

    .arco-upload-list-item-picture-mask:focus-within {
        opacity: 1;
        display: block
    }

    .arco-upload-list-item-picture-mask:focus-within .arco-upload-list-item-picture-operation {
        opacity: 1;
        display: block
    }

    .arco-upload-list-item-picture-mask:hover .arco-upload-list-item-picture-error-tip {
        display: none
    }

    .arco-upload-list-item-picture-mask:focus-within .arco-upload-list-item-picture-error-tip {
        display: none
    }

    .arco-upload-list-type-picture-list .arco-upload-list-item-text {
        padding-top: 8px;
        padding-bottom: 8px
    }

    .arco-upload-list-type-picture-list .arco-upload-list-item-error .arco-upload-list-item-text {
        background-color: var(--color-danger-light-1)
    }

    .arco-upload-list-type-picture-list .arco-upload-list-item-error .arco-upload-list-item-text-name-link,
    .arco-upload-list-type-picture-list .arco-upload-list-item-error .arco-upload-list-item-text-name {
        color: rgb(var(--danger-6))
    }

    .arco-upload-slide-up-enter {
        opacity: 0
    }

    .arco-upload-slide-up-enter-active {
        opacity: 1;
        transition: opacity .2s cubic-bezier(.34, .69, .1, 1)
    }

    .arco-upload-slide-up-exit {
        opacity: 1
    }

    .arco-upload-slide-up-exit-active {
        opacity: 0;
        margin: 0;
        transition: opacity .1s cubic-bezier(0, 0, 1, 1), height .3s cubic-bezier(.34, .69, .1, 1) .1s, margin .3s cubic-bezier(.34, .69, .1, 1) .1s;
        overflow: hidden
    }

    .arco-upload-list-item.arco-upload-slide-inline-enter {
        opacity: 0
    }

    .arco-upload-list-item.arco-upload-slide-inline-enter-active {
        opacity: 1;
        transition: opacity .2s cubic-bezier(0, 0, 1, 1)
    }

    .arco-upload-list-item.arco-upload-slide-inline-exit {
        opacity: 1
    }

    .arco-upload-list-item.arco-upload-slide-inline-exit-active {
        opacity: 0;
        margin: 0;
        transition: opacity .1s cubic-bezier(0, 0, 1, 1), width .3s cubic-bezier(.34, .69, .1, 1) .1s, margin .3s cubic-bezier(.34, .69, .1, 1) .1s;
        overflow: hidden
    }

    .arco-upload-rtl,
    .arco-upload-list-rtl {
        direction: rtl
    }

    .arco-upload-list-rtl .arco-upload-list-file-icon {
        margin-left: 12px;
        margin-right: 0
    }

    .arco-upload-list-rtl .arco-upload-list-error-icon {
        margin-left: 0;
        margin-right: 4px
    }

    .arco-upload-list-rtl .arco-upload-list-item {
        padding-left: 24px;
        padding-right: 0
    }

    .arco-upload-list-rtl .arco-upload-list-item-operation {
        right: initial;
        left: 0
    }

    .arco-upload-list-rtl .arco-upload-list-item-text {
        padding-left: 10px;
        padding-right: 12px
    }

    .arco-upload-list-rtl .arco-upload-list-item-text-thumbnail {
        margin-left: 12px;
        margin-right: 0
    }

    .arco-upload-list-rtl .arco-upload-list-item-text-name {
        margin-left: 10px;
        margin-right: 0
    }

    .arco-upload-list-rtl .arco-upload-list-item-picture-operation .arco-upload-list-reupload-icon+.arco-upload-list-remove-icon,
    .arco-upload-list-rtl .arco-upload-list-item-picture-operation .arco-upload-list-preview-icon+.arco-upload-list-remove-icon {
        margin-left: 0;
        margin-right: 20px
    }

    .arco-upload-list-rtl.arco-upload-list-type-picture-card .arco-upload-list-status {
        margin-left: initial;
        margin-right: 0
    }

    .arco-upload-list-rtl.arco-upload-list-type-picture-card .arco-upload-list-item {
        margin-left: 8px;
        margin-right: 0;
        padding-left: 0
    }
}


@layer base {
    .arco-backtop {
        z-index: 100;
        cursor: pointer;
        position: fixed;
        bottom: 24px;
        right: 24px
    }

    .arco-backtop-button {
        text-align: center;
        background-color: rgb(var(--primary-6));
        border-radius: var(--border-radius-circle);
        width: 40px;
        height: 40px;
        color: var(--color-white);
        cursor: pointer;
        border: none;
        outline: none;
        font-size: 12px;
        transition: all .2s cubic-bezier(0, 0, 1, 1)
    }

    .arco-backtop-button:focus-visible {
        box-shadow: 0 0 0 2px var(--color-primary-light-3)
    }

    .arco-backtop-button:hover {
        background-color: rgb(var(--primary-5))
    }

    .arco-backtop-button svg {
        font-size: 14px
    }
}


@layer base {
    .arco-avatar {
        background-color: var(--color-fill-4);
        white-space: nowrap;
        color: var(--color-white);
        box-sizing: border-box;
        vertical-align: middle;
        align-items: center;
        width: 40px;
        height: 40px;
        font-size: 20px;
        display: inline-flex;
        position: relative
    }

    .arco-avatar-circle {
        border-radius: var(--border-radius-circle)
    }

    .arco-avatar-circle .arco-avatar-image {
        border-radius: var(--border-radius-circle);
        overflow: hidden
    }

    .arco-avatar-square {
        border-radius: var(--border-radius-medium)
    }

    .arco-avatar-square .arco-avatar-image {
        border-radius: var(--border-radius-medium);
        overflow: hidden
    }

    .arco-avatar-text {
        transform-origin: 0;
        font-weight: 500;
        line-height: 1;
        position: absolute;
        left: 50%;
        transform: translate(-50%)
    }

    .arco-avatar-image {
        width: 100%;
        height: 100%;
        display: inline-flex
    }

    .arco-avatar-image img,
    .arco-avatar-image picture {
        width: 100%;
        height: 100%
    }

    .arco-avatar-trigger-icon-button {
        color: var(--color-fill-4);
        border-radius: var(--border-radius-circle);
        background-color: var(--color-neutral-2);
        z-index: 1;
        justify-content: center;
        align-items: center;
        width: 20px;
        height: 20px;
        font-size: 12px;
        line-height: 20px;
        transition: background-color .1s cubic-bezier(0, 0, 1, 1);
        display: inline-flex;
        position: absolute;
        bottom: -4px;
        right: -4px
    }

    .arco-avatar-trigger-icon-mask {
        opacity: 0;
        z-index: 0;
        border-radius: var(--border-radius-medium);
        width: 100%;
        height: 100%;
        color: var(--color-white);
        background-color: rgba(29, 33, 41, .6);
        justify-content: center;
        align-items: center;
        font-size: 16px;
        transition: all .1s cubic-bezier(0, 0, 1, 1);
        display: flex;
        position: absolute;
        top: 0;
        left: 0
    }

    .arco-avatar-circle .arco-avatar-trigger-icon-mask {
        border-radius: var(--border-radius-circle)
    }

    .arco-avatar-with-trigger-icon {
        cursor: pointer
    }

    .arco-avatar-with-trigger-icon:hover .arco-avatar-trigger-icon-mask {
        z-index: 2;
        opacity: 1
    }

    .arco-avatar-with-trigger-icon:hover .arco-avatar-trigger-icon-button {
        background-color: var(--color-neutral-3)
    }

    .arco-avatar-rtl {
        direction: rtl
    }

    .arco-avatar-rtl .arco-avatar-trigger-icon-button {
        right: unset;
        left: -4px
    }

    .arco-avatar-group {
        line-height: 0;
        display: inline-block
    }

    .arco-avatar-group-max-count-avatar {
        cursor: default;
        color: var(--color-white);
        font-size: 20px
    }

    .arco-avatar-group-rtl {
        direction: rtl
    }

    .arco-avatar-group .arco-avatar {
        border: 2px solid var(--color-bg-2)
    }

    .arco-avatar-group .arco-avatar:not(:first-child) {
        margin-left: -10px
    }

    .arco-avatar-group-popover .arco-avatar:not(:first-child) {
        margin-left: 4px
    }
}


@layer base {
    .arco-popconfirm-content {
        box-sizing: border-box;
        padding: 16px
    }

    .arco-popconfirm-title {
        color: var(--color-text-1);
        align-items: flex-start;
        margin-bottom: 16px;
        font-size: 14px;
        display: flex;
        position: relative
    }

    .arco-popconfirm-title-icon {
        align-items: center;
        height: 22.001px;
        margin-right: 8px;
        font-size: 18px;
        display: inline-flex
    }

    .arco-popconfirm-title-icon .arco-icon-exclamation-circle-fill {
        color: rgb(var(--warning-6))
    }

    .arco-popconfirm-has-content .arco-popconfirm-title {
        margin-bottom: 0;
        font-weight: 500
    }

    .arco-popconfirm-inner-content {
        margin-top: 4px;
        margin-bottom: 16px;
        padding-left: 26px
    }

    .arco-popconfirm .arco-popconfirm-btn {
        text-align: right
    }

    .arco-popconfirm .arco-popconfirm-btn>button {
        margin-left: 8px
    }

    .arco-popconfirm-rtl .arco-popconfirm-title-icon {
        margin-left: 8px;
        margin-right: 0
    }

    .arco-popconfirm-rtl .arco-popconfirm-inner-content {
        padding-left: 0;
        padding-right: 26px
    }

    .arco-popconfirm-rtl .arco-popconfirm-btn {
        text-align: left
    }

    .arco-popconfirm-rtl .arco-popconfirm-btn>button {
        margin-left: 0;
        margin-right: 8px
    }
}


@layer base {
    .arco-pagination {
        align-items: center;
        font-size: 14px;
        display: flex
    }

    .arco-pagination-list {
        margin: 0;
        padding: 0;
        list-style: none;
        display: inline-block
    }

    .arco-pagination-item {
        text-align: center;
        vertical-align: middle;
        box-sizing: border-box;
        cursor: pointer;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        border-radius: var(--border-radius-small);
        color: var(--color-text-2);
        background-color: transparent;
        border: 0 solid transparent;
        outline: 0;
        min-width: 32px;
        height: 32px;
        font-size: 14px;
        line-height: 32px;
        list-style: none;
        display: inline-block
    }

    .arco-pagination-item-prev,
    .arco-pagination-item-next {
        font-size: 12px
    }

    .arco-pagination-item-disabled {
        cursor: not-allowed;
        color: var(--color-text-4);
        background-color: transparent;
        border-color: transparent
    }

    .arco-pagination-item:not(.arco-pagination-item-disabled):not(.arco-pagination-item-active):hover {
        background-color: var(--color-fill-1);
        color: var(--color-text-2);
        border-color: transparent
    }

    .arco-pagination-item-active {
        color: rgb(var(--primary-6));
        background-color: var(--color-primary-light-1);
        border-color: transparent;
        transition: color .2s cubic-bezier(0, 0, 1, 1), background-color .2s cubic-bezier(0, 0, 1, 1)
    }

    .arco-pagination-item:not(:last-child) {
        margin-right: 8px
    }

    .arco-pagination-item:focus-visible {
        box-shadow: 0 0 0 2px var(--color-primary-light-3)
    }

    .arco-pagination-item-prev,
    .arco-pagination-item-next {
        color: var(--color-text-2);
        background-color: transparent;
        font-size: 12px
    }

    .arco-pagination-item-prev:not(.arco-pagination-item-disabled):hover,
    .arco-pagination-item-next:not(.arco-pagination-item-disabled):hover {
        background-color: var(--color-fill-1);
        color: rgb(var(--primary-6))
    }

    .arco-pagination-item-prev:after,
    .arco-pagination-item-next:after {
        content: ".";
        vertical-align: middle;
        font-size: 0;
        display: inline-block
    }

    .arco-pagination .arco-pagination-item-prev.arco-pagination-item-disabled,
    .arco-pagination .arco-pagination-item-next.arco-pagination-item-disabled {
        color: var(--color-text-4);
        background-color: transparent
    }

    .arco-pagination-item-jumper {
        justify-content: center;
        align-items: center;
        font-size: 16px;
        display: inline-flex
    }

    .arco-pagination-jumper {
        margin-left: 8px
    }

    .arco-pagination-jumper>span {
        font-size: 14px
    }

    .arco-pagination-jumper-text-goto,
    .arco-pagination-jumper-text-goto-suffix {
        color: var(--color-text-2)
    }

    .arco-pagination .arco-pagination-jumper-input {
        text-align: center;
        width: 40px;
        margin-left: 8px;
        margin-right: 8px;
        padding-left: 2px;
        padding-right: 2px
    }

    .arco-pagination-option {
        text-align: center;
        vertical-align: middle;
        min-width: 0;
        height: 32px;
        margin-left: 8px;
        font-size: 14px;
        line-height: 0;
        display: inline-block;
        position: relative
    }

    .arco-pagination-option .arco-select {
        width: auto
    }

    .arco-pagination-option .arco-select-view-value {
        overflow: inherit;
        padding-right: 6px
    }

    .arco-pagination-total-text {
        height: 100%;
        color: var(--color-text-1);
        margin-right: 8px;
        font-size: 14px;
        line-height: 32px;
        display: inline-block
    }

    .arco-pagination-item-simple-pager {
        vertical-align: middle;
        margin: 0 12px 0 4px;
        display: inline-block
    }

    .arco-pagination-item-simple-pager .arco-pagination-jumper-separator {
        padding: 0 12px
    }

    .arco-pagination-simple .arco-pagination-item {
        margin-right: 0
    }

    .arco-pagination-simple .arco-pagination-jumper {
        color: var(--color-text-1);
        margin-left: 0
    }

    .arco-pagination-simple .arco-pagination-jumper .arco-pagination-jumper-input {
        width: 40px;
        margin-left: 0
    }

    .arco-pagination-simple .arco-pagination-item-prev,
    .arco-pagination-simple .arco-pagination-item-next {
        color: var(--color-text-2);
        background-color: transparent
    }

    .arco-pagination-simple .arco-pagination-item-prev:not(.arco-pagination-item-disabled):hover,
    .arco-pagination-simple .arco-pagination-item-next:not(.arco-pagination-item-disabled):hover {
        background-color: var(--color-fill-1);
        color: rgb(var(--primary-6))
    }

    .arco-pagination-simple .arco-pagination-item-prev.arco-pagination-item-disabled,
    .arco-pagination-simple .arco-pagination-item-next.arco-pagination-item-disabled {
        color: var(--color-text-4);
        background-color: transparent
    }

    .arco-pagination-disabled {
        cursor: not-allowed
    }

    .arco-pagination-disabled .arco-pagination-item,
    .arco-pagination-disabled .arco-pagination-item:not(.arco-pagination-item-disabled):not(.arco-pagination-item-active):hover {
        cursor: not-allowed;
        color: var(--color-text-4);
        background-color: transparent;
        border-color: transparent
    }

    .arco-pagination.arco-pagination-disabled .arco-pagination-item-active {
        background-color: var(--color-fill-1);
        color: var(--color-primary-light-3);
        border-color: transparent
    }

    .arco-pagination-size-mini .arco-pagination-item {
        min-width: 24px;
        height: 24px;
        font-size: 12px;
        line-height: 24px
    }

    .arco-pagination-size-mini .arco-pagination-item-prev,
    .arco-pagination-size-mini .arco-pagination-item-next {
        font-size: 12px
    }

    .arco-pagination-size-mini .arco-pagination-total-text {
        font-size: 12px;
        line-height: 24px
    }

    .arco-pagination-size-mini .arco-pagination-option {
        height: 24px;
        font-size: 12px;
        line-height: 0
    }

    .arco-pagination-size-mini .arco-pagination-jumper>span {
        font-size: 12px
    }

    .arco-pagination-size-small .arco-pagination-item {
        min-width: 28px;
        height: 28px;
        font-size: 14px;
        line-height: 28px
    }

    .arco-pagination-size-small .arco-pagination-item-prev,
    .arco-pagination-size-small .arco-pagination-item-next {
        font-size: 12px
    }

    .arco-pagination-size-small .arco-pagination-total-text {
        font-size: 14px;
        line-height: 28px
    }

    .arco-pagination-size-small .arco-pagination-option {
        height: 28px;
        font-size: 14px;
        line-height: 0
    }

    .arco-pagination-size-small .arco-pagination-jumper>span {
        font-size: 14px
    }

    .arco-pagination-size-large .arco-pagination-item {
        min-width: 36px;
        height: 36px;
        font-size: 14px;
        line-height: 36px
    }

    .arco-pagination-size-large .arco-pagination-item-prev,
    .arco-pagination-size-large .arco-pagination-item-next {
        font-size: 14px
    }

    .arco-pagination-size-large .arco-pagination-total-text {
        font-size: 14px;
        line-height: 36px
    }

    .arco-pagination-size-large .arco-pagination-option {
        height: 36px;
        font-size: 14px;
        line-height: 0
    }

    .arco-pagination-size-large .arco-pagination-jumper>span {
        font-size: 14px
    }

    .arco-pagination-rtl {
        direction: rtl
    }

    .arco-pagination-rtl .arco-pagination-item:not(:last-child) {
        margin-left: 8px;
        margin-right: 0
    }

    .arco-pagination-rtl .arco-pagination-item-simple-pager {
        margin: 0 4px 0 12px
    }

    .arco-pagination-rtl .arco-pagination-item-simple-pager .arco-pagination-jumper-separator {
        padding: 0 12px
    }

    .arco-pagination-rtl .arco-pagination-jumper,
    .arco-pagination-rtl .arco-pagination-jumper-input,
    .arco-pagination-rtl .arco-pagination-option {
        margin-left: 0;
        margin-right: 8px
    }

    .arco-pagination-rtl .arco-pagination-option .arco-select-view-value {
        padding-left: 6px;
        padding-right: 0
    }

    .arco-pagination-rtl .arco-pagination-total-text {
        margin-left: 8px;
        margin-right: 0
    }

    .arco-pagination-rtl.arco-pagination-simple .arco-pagination-item,
    .arco-pagination-rtl.arco-pagination-simple .arco-pagination-jumper,
    .arco-pagination-rtl.arco-pagination-simple .arco-pagination-jumper-input {
        margin-right: 0
    }
}


@layer base {
    .arco-table-filters-popup {
        background: var(--color-bg-5);
        border: 1px solid var(--color-neutral-3);
        border-radius: var(--border-radius-medium);
        box-sizing: border-box;
        min-width: 100px;
        box-shadow: 0 2px 5px rgba(0, 0, 0, .1)
    }

    .arco-table-filters-list {
        max-height: 200px;
        padding: 4px 0;
        overflow-y: auto
    }

    .arco-table-filters-item {
        width: 100%;
        height: 32px;
        font-size: 14px;
        line-height: 32px;
        overflow: hidden
    }

    .arco-table-filters-item .arco-checkbox,
    .arco-table-filters-item .arco-radio {
        white-space: nowrap;
        width: 100%;
        padding: 0 12px
    }

    .arco-table-filters-btn {
        border-top: 1px solid var(--color-neutral-3);
        box-sizing: border-box;
        justify-content: space-between;
        align-items: center;
        height: 38px;
        padding: 0 12px;
        line-height: 38px;
        display: flex;
        overflow: hidden
    }

    .arco-table-th-item {
        padding: 9px 16px
    }

    .arco-table-th-item.arco-table-col-has-filter {
        padding-right: 28px
    }

    .arco-table-col-has-sorter.arco-table-col-has-filter {
        padding-right: 0
    }

    .arco-table-col-has-sorter.arco-table-col-has-filter .arco-table-cell-with-sorter {
        padding-right: 28px
    }

    .arco-table-col-has-sorter {
        padding: 0
    }

    .arco-table-col-has-sorter .arco-table-cell-with-sorter {
        cursor: pointer;
        padding: 9px 16px
    }

    .arco-table-rtl .arco-table-th-item.arco-table-col-has-filter {
        padding-left: 28px;
        padding-right: 16px
    }

    .arco-table-rtl .arco-table-col-has-sorter.arco-table-col-has-filter {
        padding-left: 0;
        padding-right: 0
    }

    .arco-table-rtl .arco-table-col-has-sorter.arco-table-col-has-filter .arco-table-cell-with-sorter {
        padding-right: 16px
    }

    .arco-table-td {
        padding: 9px 16px;
        font-size: 14px
    }

    .arco-table-th {
        font-size: 14px
    }

    .arco-table-footer {
        padding: 9px 16px
    }

    .arco-table-expand-fixed-row {
        margin: -9px -17px;
        padding: 9px 16px
    }

    .arco-table-expand-content .arco-table-td .arco-table {
        margin: -9px -16px -10px
    }

    .arco-table-editable-row .arco-table-cell-wrap-value {
        padding: 9px 16px
    }

    .arco-table-size-middle .arco-table-th-item {
        padding: 7px 16px
    }

    .arco-table-size-middle .arco-table-th-item.arco-table-col-has-filter {
        padding-right: 28px
    }

    .arco-table-size-middle .arco-table-col-has-sorter.arco-table-col-has-filter {
        padding-right: 0
    }

    .arco-table-size-middle .arco-table-col-has-sorter.arco-table-col-has-filter .arco-table-cell-with-sorter {
        padding-right: 28px
    }

    .arco-table-size-middle .arco-table-col-has-sorter {
        padding: 0
    }

    .arco-table-size-middle .arco-table-col-has-sorter .arco-table-cell-with-sorter {
        cursor: pointer;
        padding: 7px 16px
    }

    .arco-table-size-middle .arco-table-rtl .arco-table-th-item.arco-table-col-has-filter {
        padding-left: 28px;
        padding-right: 16px
    }

    .arco-table-size-middle .arco-table-rtl .arco-table-col-has-sorter.arco-table-col-has-filter {
        padding-left: 0;
        padding-right: 0
    }

    .arco-table-size-middle .arco-table-rtl .arco-table-col-has-sorter.arco-table-col-has-filter .arco-table-cell-with-sorter {
        padding-right: 16px
    }

    .arco-table-size-middle .arco-table-td {
        padding: 7px 16px;
        font-size: 14px
    }

    .arco-table-size-middle .arco-table-th {
        font-size: 14px
    }

    .arco-table-size-middle .arco-table-footer {
        padding: 7px 16px
    }

    .arco-table-size-middle .arco-table-expand-fixed-row {
        margin: -7px -17px;
        padding: 7px 16px
    }

    .arco-table-size-middle .arco-table-expand-content .arco-table-td .arco-table {
        margin: -7px -16px -8px
    }

    .arco-table-size-middle .arco-table-editable-row .arco-table-cell-wrap-value {
        padding: 7px 16px
    }

    .arco-table-size-small .arco-table-th-item {
        padding: 5px 16px
    }

    .arco-table-size-small .arco-table-th-item.arco-table-col-has-filter {
        padding-right: 28px
    }

    .arco-table-size-small .arco-table-col-has-sorter.arco-table-col-has-filter {
        padding-right: 0
    }

    .arco-table-size-small .arco-table-col-has-sorter.arco-table-col-has-filter .arco-table-cell-with-sorter {
        padding-right: 28px
    }

    .arco-table-size-small .arco-table-col-has-sorter {
        padding: 0
    }

    .arco-table-size-small .arco-table-col-has-sorter .arco-table-cell-with-sorter {
        cursor: pointer;
        padding: 5px 16px
    }

    .arco-table-size-small .arco-table-rtl .arco-table-th-item.arco-table-col-has-filter {
        padding-left: 28px;
        padding-right: 16px
    }

    .arco-table-size-small .arco-table-rtl .arco-table-col-has-sorter.arco-table-col-has-filter {
        padding-left: 0;
        padding-right: 0
    }

    .arco-table-size-small .arco-table-rtl .arco-table-col-has-sorter.arco-table-col-has-filter .arco-table-cell-with-sorter {
        padding-right: 16px
    }

    .arco-table-size-small .arco-table-td {
        padding: 5px 16px;
        font-size: 14px
    }

    .arco-table-size-small .arco-table-th {
        font-size: 14px
    }

    .arco-table-size-small .arco-table-footer {
        padding: 5px 16px
    }

    .arco-table-size-small .arco-table-expand-fixed-row {
        margin: -5px -17px;
        padding: 5px 16px
    }

    .arco-table-size-small .arco-table-expand-content .arco-table-td .arco-table {
        margin: -5px -16px -6px
    }

    .arco-table-size-small .arco-table-editable-row .arco-table-cell-wrap-value {
        padding: 5px 16px
    }

    .arco-table-size-mini .arco-table-th-item {
        padding: 2px 16px
    }

    .arco-table-size-mini .arco-table-th-item.arco-table-col-has-filter {
        padding-right: 28px
    }

    .arco-table-size-mini .arco-table-col-has-sorter.arco-table-col-has-filter {
        padding-right: 0
    }

    .arco-table-size-mini .arco-table-col-has-sorter.arco-table-col-has-filter .arco-table-cell-with-sorter {
        padding-right: 28px
    }

    .arco-table-size-mini .arco-table-col-has-sorter {
        padding: 0
    }

    .arco-table-size-mini .arco-table-col-has-sorter .arco-table-cell-with-sorter {
        cursor: pointer;
        padding: 2px 16px
    }

    .arco-table-size-mini .arco-table-rtl .arco-table-th-item.arco-table-col-has-filter {
        padding-left: 28px;
        padding-right: 16px
    }

    .arco-table-size-mini .arco-table-rtl .arco-table-col-has-sorter.arco-table-col-has-filter {
        padding-left: 0;
        padding-right: 0
    }

    .arco-table-size-mini .arco-table-rtl .arco-table-col-has-sorter.arco-table-col-has-filter .arco-table-cell-with-sorter {
        padding-right: 16px
    }

    .arco-table-size-mini .arco-table-td {
        padding: 2px 16px;
        font-size: 12px
    }

    .arco-table-size-mini .arco-table-th {
        font-size: 12px
    }

    .arco-table-size-mini .arco-table-footer {
        padding: 2px 16px
    }

    .arco-table-size-mini .arco-table-expand-fixed-row {
        margin: -2px -17px;
        padding: 2px 16px
    }

    .arco-table-size-mini .arco-table-expand-content .arco-table-td .arco-table {
        margin: -2px -16px -3px
    }

    .arco-table-size-mini .arco-table-editable-row .arco-table-cell-wrap-value {
        padding: 2px 16px
    }

    .arco-table {
        position: relative
    }

    .arco-table .arco-spin {
        display: block
    }

    .arco-table>.arco-spin>.arco-spin-children:after {
        z-index: 2
    }

    .arco-table-footer {
        border-radius: 0 0 var(--border-radius-medium)var(--border-radius-medium)
    }

    .arco-table-scroll-position-right .arco-table-col-fixed-left-last:after,
    .arco-table-scroll-position-middle .arco-table-col-fixed-left-last:after {
        box-shadow: inset 6px 0 8px -3px rgba(0, 0, 0, .15)
    }

    .arco-table-scroll-position-left .arco-table-col-fixed-right-first:after,
    .arco-table-scroll-position-middle .arco-table-col-fixed-right-first:after {
        box-shadow: inset -6px 0 8px -3px rgba(0, 0, 0, .15)
    }

    .arco-table:not(.arco-table-has-fixed-col-left).arco-table-scroll-position-right .arco-table-content-scroll:before,
    .arco-table:not(.arco-table-has-fixed-col-left).arco-table-scroll-position-middle .arco-table-content-scroll:before {
        box-shadow: inset 6px 0 8px -3px rgba(0, 0, 0, .15)
    }

    .arco-table:not(.arco-table-has-fixed-col-right).arco-table-scroll-position-left .arco-table-content-scroll:after,
    .arco-table:not(.arco-table-has-fixed-col-right).arco-table-scroll-position-middle .arco-table-content-scroll:after {
        box-shadow: inset -6px 0 8px -3px rgba(0, 0, 0, .15)
    }

    .arco-table-layout-fixed .arco-table-content-inner {
        overflow-x: auto;
        overflow-y: hidden
    }

    .arco-table-layout-fixed table {
        table-layout: fixed
    }

    thead>.arco-table-tr>.arco-table-th {
        border-bottom: 1px solid var(--color-neutral-3)
    }

    thead>.arco-table-tr:not(:last-child)>.arco-table-th[colspan] {
        border-bottom: 0
    }

    .arco-table table {
        border-spacing: 0;
        border-collapse: separate;
        width: 100%;
        min-width: 100%;
        margin: 0
    }

    .arco-table table thead tr:first-child th:first-child {
        border-radius: var(--border-radius-medium)0 0 0
    }

    .arco-table table thead tr:first-child th:last-child {
        border-radius: 0 var(--border-radius-medium)0 0
    }

    .arco-table-th {
        box-sizing: border-box;
        text-align: left;
        color: rgb(var(--gray-10));
        background-color: var(--color-neutral-2);
        font-weight: 500;
        line-height: 1.5715
    }

    .arco-table-th[colspan] {
        text-align: center
    }

    .arco-table-td {
        box-sizing: border-box;
        text-align: left;
        color: rgb(var(--gray-10));
        background-color: var(--color-bg-2);
        border-bottom: 1px solid var(--color-neutral-3);
        line-height: 1.5715
    }

    .arco-table-th.arco-table-col-sorted {
        background-color: var(--color-neutral-3)
    }

    .arco-table-td.arco-table-col-sorted {
        background-color: var(--color-fill-1)
    }

    .arco-table-col-fixed-left,
    .arco-table-col-fixed-right {
        z-index: 1;
        position: -webkit-sticky;
        position: sticky
    }

    .arco-table-col-fixed-left-last:after,
    .arco-table-col-fixed-right-first:after {
        content: "";
        pointer-events: none;
        width: 10px;
        box-shadow: none;
        transition: box-shadow .1s cubic-bezier(0, 0, 1, 1);
        position: absolute;
        top: 0;
        bottom: -1px;
        left: 0;
        transform: translate(-100%)
    }

    .arco-table-col-fixed-left-last:after {
        left: unset;
        right: 0;
        transform: translate(100%)
    }

    .arco-table-cell-text-ellipsis {
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow: hidden
    }

    .arco-table-cell-text-ellipsis .arco-table-cell-with-sorter {
        align-items: center;
        display: flex
    }

    .arco-table-cell-text-ellipsis .arco-table-th-item-title {
        white-space: nowrap;
        text-overflow: ellipsis;
        flex: 1;
        overflow: hidden
    }

    .arco-table-editable-row .arco-table-cell-wrap-value {
        border: 1px solid var(--color-white);
        border-radius: var(--border-radius-medium);
        cursor: pointer;
        transition: all .1s cubic-bezier(0, 0, 1, 1)
    }

    .arco-table-editable-row:hover .arco-table-cell-wrap-value {
        border: 1px solid var(--color-neutral-3)
    }

    .arco-table-cell {
        word-break: break-all;
        width: 100%
    }

    .arco-table-cell:has(>.arco-table-cell-indent):after {
        content: "";
        clear: both;
        display: block
    }

    .arco-table-cell-indent {
        float: left;
        height: 1px
    }

    .arco-table-cell-indent+.arco-table-cell-wrap-value {
        float: left
    }

    .arco-table-expand-icon-cell button {
        background-color: var(--color-neutral-3);
        width: 14px;
        height: 14px;
        color: var(--color-text-2);
        cursor: pointer;
        box-sizing: border-box;
        border: 1px solid transparent;
        border-radius: 2px;
        outline: none;
        justify-content: center;
        align-items: center;
        padding: 0;
        font-size: 12px;
        line-height: 14px;
        transition: background-color .1s cubic-bezier(0, 0, 1, 1);
        display: inline-flex
    }

    .arco-table-expand-icon-cell button:hover {
        background-color: var(--color-neutral-4);
        color: var(--color-text-1);
        border-color: transparent
    }

    div.arco-table-expand-icon-cell {
        justify-content: center
    }

    .arco-table-cell-expand-icon {
        float: left
    }

    .arco-table-cell-expand-icon button {
        background-color: var(--color-neutral-3);
        width: 14px;
        height: 14px;
        color: var(--color-text-2);
        cursor: pointer;
        box-sizing: border-box;
        border: 1px solid transparent;
        border-radius: 2px;
        outline: none;
        justify-content: center;
        align-items: center;
        margin-right: 4px;
        padding: 0;
        font-size: 12px;
        line-height: 14px;
        transition: background-color .1s cubic-bezier(0, 0, 1, 1);
        display: inline-flex
    }

    .arco-table-cell-expand-icon button:hover {
        background-color: var(--color-neutral-4);
        color: var(--color-text-1);
        border-color: transparent
    }

    .arco-table-cell-expand-icon-hidden {
        width: 14px;
        height: 14px;
        margin-right: 4px;
        display: inline-block
    }

    .arco-table-expand-content .arco-table-td {
        background-color: var(--color-fill-1)
    }

    .arco-table-expand-fixed-row {
        box-sizing: border-box;
        position: -webkit-sticky;
        position: sticky;
        left: 0
    }

    .arco-table-expand-content .arco-table-td .arco-table .arco-table-container {
        border: none
    }

    .arco-table-expand-content .arco-table-td .arco-table .arco-table-th {
        border-bottom: 1px solid var(--color-neutral-3)
    }

    .arco-table-expand-content .arco-table-td .arco-table .arco-table-th,
    .arco-table-expand-content .arco-table-td .arco-table .arco-table-td {
        background-color: var(--color-fill-1)
    }

    .arco-table-expand-content .arco-table-td .arco-table .arco-table-pagination {
        margin-bottom: 12px
    }

    .arco-table-th.arco-table-operation .arco-table-th-item,
    .arco-table-td.arco-table-operation {
        text-align: center;
        padding: 0
    }

    .arco-table-radio,
    .arco-table-checkbox {
        justify-content: center
    }

    .arco-table-checkbox .arco-checkbox,
    .arco-table-radio .arco-radio {
        padding-left: 0
    }

    .arco-table-selection-col,
    .arco-table-expand-icon-col {
        width: 40px
    }

    .arco-table-radio .arco-table-th-item,
    .arco-table-checkbox .arco-table-th-item,
    div.arco-table-selection-col .arco-table-th-item,
    div.arco-table-expand-icon-col .arco-table-th-item {
        padding: 0
    }

    .arco-table-th-item {
        transition: background-color .1s cubic-bezier(0, 0, 1, 1);
        position: relative
    }

    .arco-table-cell-mouseenter {
        background-color: rgba(var(--gray-4), .5)
    }

    .arco-table-cell-next-ascend .arco-table-sorter-icon .arco-icon-caret-up,
    .arco-table-cell-next-descend .arco-table-sorter-icon .arco-icon-caret-down {
        color: var(--color-neutral-6)
    }

    .arco-table-sorter {
        vertical-align: -3px;
        margin-left: 8px;
        display: inline-block
    }

    .arco-table-sorter.arco-table-sorter-direction-one {
        vertical-align: 0
    }

    .arco-table-sorter-icon {
        width: 12px;
        height: 8px;
        line-height: 8px;
        position: relative;
        overflow: hidden
    }

    .arco-table-sorter-icon .arco-icon-caret-up,
    .arco-table-sorter-icon .arco-icon-caret-down {
        color: var(--color-neutral-5);
        font-size: 12px;
        transition: all .1s cubic-bezier(0, 0, 1, 1);
        position: absolute;
        top: 50%
    }

    .arco-table-sorter-icon .arco-icon-caret-up {
        top: -2px;
        left: 0
    }

    .arco-table-sorter-icon .arco-icon-caret-down {
        top: -3px;
        left: 0
    }

    .arco-table-sorter-icon.arco-table-sorter-icon-active svg {
        color: rgb(var(--primary-6))
    }

    .arco-table-filters {
        vertical-align: 0;
        cursor: pointer;
        background-color: transparent;
        justify-content: center;
        align-items: center;
        width: 24px;
        height: 100%;
        line-height: 1;
        transition: all .1s cubic-bezier(0, 0, 1, 1);
        display: flex;
        position: absolute;
        top: 0;
        right: 0
    }

    .arco-table-filters:hover,
    .arco-table-filters-open {
        background-color: var(--color-neutral-4)
    }

    .arco-table-filters svg {
        color: var(--color-text-2);
        font-size: 16px;
        transition: all .1s cubic-bezier(0, 0, 1, 1)
    }

    .arco-table-filters-active svg {
        color: rgb(var(--primary-6))
    }

    .arco-table-container {
        border-radius: var(--border-radius-medium)var(--border-radius-medium)0 0;
        position: relative
    }

    .arco-table-header {
        border-radius: var(--border-radius-medium)var(--border-radius-medium)0 0
    }

    .arco-table-content-scroll {
        width: 100%;
        overflow: hidden
    }

    .arco-table-content-scroll .arco-table-content-inner {
        width: auto
    }

    .arco-table-content-scroll:before,
    .arco-table-content-scroll:after {
        content: "";
        width: 10px;
        height: 100%;
        box-shadow: none;
        pointer-events: none;
        z-index: 1;
        transition: box-shadow .1s cubic-bezier(0, 0, 1, 1);
        position: absolute;
        top: -1px;
        bottom: -1px
    }

    .arco-table-content-scroll:before {
        border-top-left-radius: var(--border-radius-medium);
        left: 0
    }

    .arco-table-content-scroll:after {
        border-top-right-radius: var(--border-radius-medium);
        right: 0
    }

    .arco-table-header {
        scrollbar-color: inherit;
        background-color: var(--color-neutral-2);
        overflow-x: scroll;
        overflow-y: hidden
    }

    .arco-table-header::-webkit-scrollbar {
        background-color: transparent
    }

    .arco-table-body {
        background-color: var(--color-bg-2);
        z-index: 1;
        position: relative;
        overflow: auto
    }

    .arco-table-no-data {
        box-sizing: border-box;
        text-align: center;
        padding: 20px;
        font-size: 14px;
        line-height: 40px
    }

    .arco-table-border.arco-table-fixed-column .arco-table-empty-row .arco-table-td:first-child {
        border-bottom: 0;
        border-left: 0
    }

    .arco-table-border .arco-table-container {
        border-right: 1px solid var(--color-neutral-3);
        border-top: 1px solid var(--color-neutral-3)
    }

    .arco-table-border .arco-table-container:before {
        content: "";
        background-color: var(--color-neutral-3);
        z-index: 2;
        width: 100%;
        height: 1px;
        position: absolute;
        bottom: 0;
        left: 0
    }

    .arco-table-border .arco-table-th:first-child,
    .arco-table-border .arco-table-td:first-child,
    .arco-table-border .arco-table-expand-fixed-row {
        border-left: 1px solid var(--color-neutral-3)
    }

    .arco-table-border .arco-table-footer {
        border: 1px solid var(--color-neutral-3);
        border-top: 0
    }

    .arco-table-border-cell .arco-table-th,
    .arco-table-border-cell .arco-table-td {
        border-left: 1px solid var(--color-neutral-3)
    }

    .arco-table-border-cell thead>.arco-table-tr:not(:last-child)>.arco-table-th[colspan] {
        border-bottom: 1px solid var(--color-neutral-3)
    }

    .arco-table-border-header-cell .arco-table-th {
        border-left: 1px solid var(--color-neutral-3)
    }

    .arco-table-border-header-cell thead>.arco-table-tr:not(:last-child)>.arco-table-th[colspan] {
        border-bottom: 1px solid var(--color-neutral-3)
    }

    .arco-table-border-body-cell .arco-table-td {
        border-left: 1px solid var(--color-neutral-3)
    }

    .arco-table-border-cell:not(.arco-table-border) .arco-table-th:first-child,
    .arco-table-border-cell:not(.arco-table-border) .arco-table-td:first-child {
        border-left: 0
    }

    .arco-table-stripe .arco-table-tr:nth-child(2n) .arco-table-td,
    .arco-table-hover .arco-table-tr:not(.arco-table-empty-row):hover .arco-table-td:not(.arco-table-col-fixed-left):not(.arco-table-col-fixed-right) {
        background-color: var(--color-fill-1)
    }

    .arco-table-hover .arco-table-tr:not(.arco-table-empty-row):hover .arco-table-td.arco-table-col-fixed-left:before,
    .arco-table-hover .arco-table-tr:not(.arco-table-empty-row):hover .arco-table-td.arco-table-col-fixed-right:before {
        content: "";
        background-color: var(--color-fill-1);
        z-index: -1;
        width: 100%;
        height: 100%;
        position: absolute;
        top: 0;
        left: 0
    }

    .arco-table-hover .arco-table-expand-content:not(.arco-table-empty-row):hover .arco-table-td:not(.arco-table-col-fixed-left):not(.arco-table-col-fixed-right) {
        background-color: var(--color-fill-1)
    }

    .arco-table-expand-content .arco-table-td .arco-table-hover .arco-table-tr:not(.arco-table-empty-row) .arco-table-td:not(.arco-table-col-fixed-left):not(.arco-table-col-fixed-right),
    .arco-table-expand-content .arco-table-td .arco-table-hover .arco-table-tr:not(.arco-table-empty-row) .arco-table-td.arco-table-col-fixed-left:before,
    .arco-table-expand-content .arco-table-td .arco-table-hover .arco-table-tr:not(.arco-table-empty-row) .arco-table-td.arco-table-col-fixed-right:before {
        background-color: transparent
    }

    .arco-table-type-radio .arco-table-row-checked.arco-table-tr .arco-table-td {
        background-color: var(--color-fill-1)
    }

    .arco-table-virtualized table {
        table-layout: fixed
    }

    .arco-table-virtualized div.arco-table-body div.arco-table-tr {
        display: flex
    }

    .arco-table-virtualized div.arco-table-body div.arco-table-td {
        flex: 1;
        align-items: center;
        display: flex
    }

    .arco-table-virtualized .arco-table-selection-col,
    .arco-table-virtualized .arco-table-expand-icon-col {
        max-width: 40px
    }

    div.arco-table-tfoot {
        background-color: var(--color-neutral-2);
        scrollbar-color: inherit;
        z-index: 1;
        width: 100%;
        box-shadow: 0 -1px 0 var(--color-neutral-3);
        position: relative;
        overflow-x: scroll
    }

    div.arco-table-tfoot::-webkit-scrollbar {
        background-color: transparent
    }

    .arco-table-tfoot .arco-table-td {
        background-color: var(--color-neutral-2)
    }

    .arco-table-pagination {
        justify-content: flex-end;
        display: flex
    }

    .arco-table-pagination-left {
        justify-content: flex-start
    }

    .arco-table-pagination-center {
        justify-content: center
    }

    .arco-table-pagination-top {
        margin-top: 0;
        margin-bottom: 12px
    }

    .arco-table-pagination .arco-pagination {
        margin-top: 12px
    }

    .arco-table-rtl {
        direction: rtl
    }

    .arco-table-rtl.arco-table-border .arco-table-th:first-child,
    .arco-table-rtl.arco-table-border .arco-table-td:first-child {
        border-left: 0;
        border-right: 1px solid var(--color-neutral-3)
    }

    .arco-table-rtl.arco-table-border-cell .arco-table-th,
    .arco-table-rtl.arco-table-border-cell .arco-table-td {
        border-left: 1px solid var(--color-neutral-3)
    }

    .arco-table-rtl table thead tr:first-child th:first-child {
        border-radius: 0 var(--border-radius-medium)0 0
    }

    .arco-table-rtl table thead tr:first-child th:last-child {
        border-radius: var(--border-radius-medium)0 0 0
    }

    .arco-table-rtl .arco-table-th,
    .arco-table-rtl .arco-table-td {
        text-align: right
    }

    .arco-table-rtl .arco-table-th.arco-table-operation .arco-table-th-item,
    .arco-table-rtl .arco-table-td.arco-table-operation {
        text-align: center
    }

    .arco-table-rtl.arco-table-border .arco-table-container {
        border-left: 1px solid var(--color-neutral-3);
        border-right: 0
    }

    .arco-table-rtl.arco-table-border-cell .arco-table-th,
    .arco-table-rtl.arco-table-border-cell .arco-table-td,
    .arco-table-rtl.arco-table-border-header-cell .arco-table-th,
    .arco-table-rtl.arco-table-border-body-cell .arco-table-td {
        border-left: 0;
        border-right: 1px solid var(--color-neutral-3)
    }

    .arco-table-rtl.arco-table-border-cell:not(.arco-table-border) .arco-table-th:first-child,
    .arco-table-rtl.arco-table-border-cell:not(.arco-table-border) .arco-table-td:first-child {
        border-right: 0
    }

    .arco-table-rtl .arco-table-cell-indent,
    .arco-table-rtl .arco-table-cell-expand-icon {
        float: right
    }

    .arco-table-rtl .arco-table-cell-expand-icon button,
    .arco-table-rtl .arco-table-cell-expand-icon-hidden {
        margin-left: 4px;
        margin-right: 0
    }

    .arco-table-rtl .arco-table-filters {
        left: 0;
        right: unset
    }

    .arco-table-rtl .arco-table-sorter {
        margin-left: 0;
        margin-right: 8px
    }

    .arco-table-rtl .arco-table-col-fixed-left-last:after,
    .arco-table-rtl .arco-table-col-fixed-right-first:after {
        left: unset;
        right: -20px
    }

    .arco-table-rtl .arco-table-col-fixed-left-last:after {
        left: -20px;
        right: unset
    }

    .arco-table-rtl.arco-table-scroll-position-right .arco-table-col-fixed-left-last:after {
        box-shadow: none
    }

    .arco-table-rtl.arco-table-scroll-position-right .arco-table-col-fixed-right-first:after,
    .arco-table-rtl.arco-table-scroll-position-middle .arco-table-col-fixed-right-first:after {
        box-shadow: inset 6px 0 8px -3px rgba(0, 0, 0, .15)
    }

    .arco-table-rtl.arco-table-scroll-position-left .arco-table-col-fixed-right-first:after {
        box-shadow: none
    }

    .arco-table-rtl.arco-table-scroll-position-left .arco-table-col-fixed-left-last:after,
    .arco-table-rtl.arco-table-scroll-position-middle .arco-table-col-fixed-left-last:after {
        box-shadow: inset -6px 0 8px -3px rgba(0, 0, 0, .15)
    }

    .arco-table-rtl.arco-table:not(.arco-table-has-fixed-col-left).arco-table-scroll-position-right .arco-table-content-scroll:before,
    .arco-table-rtl.arco-table:not(.arco-table-has-fixed-col-left).arco-table-scroll-position-middle .arco-table-content-scroll:before {
        box-shadow: none
    }

    .arco-table-rtl.arco-table:not(.arco-table-has-fixed-col-left).arco-table-scroll-position-right .arco-table-content-scroll:after,
    .arco-table-rtl.arco-table:not(.arco-table-has-fixed-col-left).arco-table-scroll-position-middle .arco-table-content-scroll:after {
        box-shadow: inset -6px 0 8px -3px rgba(0, 0, 0, .15)
    }

    .arco-table-rtl.arco-table:not(.arco-table-has-fixed-col-right).arco-table-scroll-position-left .arco-table-content-scroll:before,
    .arco-table-rtl.arco-table:not(.arco-table-has-fixed-col-right).arco-table-scroll-position-middle .arco-table-content-scroll:before {
        box-shadow: inset 6px 0 8px -3px rgba(0, 0, 0, .15)
    }

    .arco-table-rtl.arco-table:not(.arco-table-has-fixed-col-right).arco-table-scroll-position-left .arco-table-content-scroll:after,
    .arco-table-rtl.arco-table:not(.arco-table-has-fixed-col-right).arco-table-scroll-position-middle .arco-table-content-scroll:after {
        box-shadow: none
    }

    body[arco-theme=dark] .arco-table-stripe .arco-table-tr:nth-child(2n) .arco-table-td {
        background-color: var(--color-bg-3)
    }
}


@layer base {
    .arco-cascader .arco-cascader-view {
        color: var(--color-text-1);
        background-color: var(--color-fill-2);
        border: 1px solid transparent
    }

    .arco-cascader:hover .arco-cascader-view {
        background-color: var(--color-fill-3);
        border-color: transparent
    }

    .arco-cascader.arco-cascader-focused .arco-cascader-view {
        color: var(--color-text-1);
        background-color: var(--color-bg-2);
        border-color: rgb(var(--primary-6));
        box-shadow: 0 0 0 0 var(--color-primary-light-2)
    }

    .arco-cascader .arco-cascader-suffix-icon,
    .arco-cascader .arco-cascader-loading-icon,
    .arco-cascader .arco-cascader-search-icon,
    .arco-cascader .arco-cascader-clear-icon,
    .arco-cascader .arco-cascader-arrow-icon,
    .arco-cascader .arco-cascader-expand-icon {
        color: var(--color-text-2)
    }

    .arco-cascader-error .arco-cascader-view {
        background-color: var(--color-danger-light-1);
        border: 1px solid transparent
    }

    .arco-cascader-error:hover .arco-cascader-view {
        background-color: var(--color-danger-light-2);
        border-color: transparent
    }

    .arco-cascader-error.arco-cascader-focused .arco-cascader-view {
        color: var(--color-text-1);
        background-color: var(--color-bg-2);
        border-color: rgb(var(--danger-6));
        box-shadow: 0 0 0 0 var(--color-danger-light-2)
    }

    .arco-cascader-warning .arco-cascader-view {
        background-color: var(--color-warning-light-1);
        border: 1px solid transparent
    }

    .arco-cascader-warning:hover .arco-cascader-view {
        background-color: var(--color-warning-light-2);
        border-color: transparent
    }

    .arco-cascader-warning.arco-cascader-focused .arco-cascader-view {
        color: var(--color-text-1);
        background-color: var(--color-bg-2);
        border-color: rgb(var(--warning-6));
        box-shadow: 0 0 0 0 var(--color-warning-light-2)
    }

    .arco-cascader-disabled .arco-cascader-view {
        color: var(--color-text-4);
        background-color: var(--color-fill-2);
        border: 1px solid transparent
    }

    .arco-cascader-disabled:hover .arco-cascader-view {
        background-color: var(--color-fill-2);
        border-color: transparent
    }

    .arco-cascader-disabled .arco-cascader-suffix-icon,
    .arco-cascader-disabled .arco-cascader-loading-icon,
    .arco-cascader-disabled .arco-cascader-search-icon,
    .arco-cascader-disabled .arco-cascader-clear-icon,
    .arco-cascader-disabled .arco-cascader-arrow-icon,
    .arco-cascader-disabled .arco-cascader-expand-icon {
        color: var(--color-text-4)
    }

    .arco-cascader-no-border .arco-cascader-view {
        background: 0 0 !important;
        border: none !important
    }

    .arco-cascader-size-mini.arco-cascader-multiple .arco-cascader-view {
        height: auto;
        padding: 0 3px;
        font-size: 12px;
        line-height: 0
    }

    .arco-cascader-size-mini.arco-cascader-multiple .arco-input-tag-has-placeholder input,
    .arco-cascader-size-mini.arco-cascader-multiple .arco-input-tag-has-placeholder .arco-input-tag-input-mirror {
        box-sizing: border-box;
        padding-left: 4px
    }

    .arco-cascader-size-mini.arco-cascader-multiple .arco-cascader-suffix {
        padding-right: 4px
    }

    .arco-cascader-size-mini.arco-cascader-multiple input {
        font-size: 12px
    }

    .arco-cascader-size-mini.arco-cascader-single .arco-cascader-view {
        height: 24px;
        padding: 0 7px;
        font-size: 12px;
        line-height: 22px
    }

    .arco-cascader-size-mini.arco-cascader-single input {
        font-size: 12px
    }

    .arco-cascader-size-mini.arco-cascader-multiple .arco-cascader-view-with-prefix {
        padding-left: 7px
    }

    .arco-cascader-size-small.arco-cascader-multiple .arco-cascader-view {
        height: auto;
        padding: 0 3px;
        font-size: 14px;
        line-height: 0
    }

    .arco-cascader-size-small.arco-cascader-multiple .arco-input-tag-has-placeholder input,
    .arco-cascader-size-small.arco-cascader-multiple .arco-input-tag-has-placeholder .arco-input-tag-input-mirror {
        box-sizing: border-box;
        padding-left: 8px
    }

    .arco-cascader-size-small.arco-cascader-multiple .arco-cascader-suffix {
        padding-right: 8px
    }

    .arco-cascader-size-small.arco-cascader-multiple input {
        font-size: 14px
    }

    .arco-cascader-size-small.arco-cascader-single .arco-cascader-view {
        height: 28px;
        padding: 0 11px;
        font-size: 14px;
        line-height: 26px
    }

    .arco-cascader-size-small.arco-cascader-single input {
        font-size: 14px
    }

    .arco-cascader-size-small.arco-cascader-multiple .arco-cascader-view-with-prefix {
        padding-left: 11px
    }

    .arco-cascader-size-default.arco-cascader-multiple .arco-cascader-view {
        height: auto;
        padding: 0 3px;
        font-size: 14px;
        line-height: 0
    }

    .arco-cascader-size-default.arco-cascader-multiple .arco-input-tag-has-placeholder input,
    .arco-cascader-size-default.arco-cascader-multiple .arco-input-tag-has-placeholder .arco-input-tag-input-mirror {
        box-sizing: border-box;
        padding-left: 8px
    }

    .arco-cascader-size-default.arco-cascader-multiple .arco-cascader-suffix {
        padding-right: 8px
    }

    .arco-cascader-size-default.arco-cascader-multiple input {
        font-size: 14px
    }

    .arco-cascader-size-default.arco-cascader-single .arco-cascader-view {
        height: 32px;
        padding: 0 11px;
        font-size: 14px;
        line-height: 30px
    }

    .arco-cascader-size-default.arco-cascader-single input {
        font-size: 14px
    }

    .arco-cascader-size-default.arco-cascader-multiple .arco-cascader-view-with-prefix {
        padding-left: 11px
    }

    .arco-cascader-size-large.arco-cascader-multiple .arco-cascader-view {
        height: auto;
        padding: 0 3px;
        font-size: 14px;
        line-height: 0
    }

    .arco-cascader-size-large.arco-cascader-multiple .arco-input-tag-has-placeholder input,
    .arco-cascader-size-large.arco-cascader-multiple .arco-input-tag-has-placeholder .arco-input-tag-input-mirror {
        box-sizing: border-box;
        padding-left: 12px
    }

    .arco-cascader-size-large.arco-cascader-multiple .arco-cascader-suffix {
        padding-right: 12px
    }

    .arco-cascader-size-large.arco-cascader-multiple input {
        font-size: 14px
    }

    .arco-cascader-size-large.arco-cascader-single .arco-cascader-view {
        height: 36px;
        padding: 0 15px;
        font-size: 14px;
        line-height: 34px
    }

    .arco-cascader-size-large.arco-cascader-single input {
        font-size: 14px
    }

    .arco-cascader-size-large.arco-cascader-multiple .arco-cascader-view-with-prefix {
        padding-left: 15px
    }

    .arco-cascader {
        box-sizing: border-box;
        cursor: pointer;
        width: 100%;
        display: inline-block;
        position: relative
    }

    .arco-cascader-view {
        box-sizing: border-box;
        border-radius: var(--border-radius-small);
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        text-align: left;
        outline: none;
        width: 100%;
        transition: all .1s cubic-bezier(0, 0, 1, 1), padding linear;
        display: flex;
        position: relative
    }

    .arco-cascader-view input {
        color: inherit;
        cursor: inherit
    }

    .arco-cascader-view input::placeholder {
        color: var(--color-text-3)
    }

    .arco-cascader-view input::placeholder {
        color: var(--color-text-3)
    }

    .arco-cascader-view input::placeholder {
        color: var(--color-text-3)
    }

    .arco-cascader-view input[disabled] {
        pointer-events: none
    }

    .arco-cascader-multiple,
    .arco-cascader-show-search {
        cursor: text
    }

    .arco-cascader-disabled {
        cursor: not-allowed
    }

    .arco-cascader-disabled .arco-cascader-view input::placeholder {
        color: var(--color-text-4)
    }

    .arco-cascader-disabled .arco-cascader-view input::placeholder {
        color: var(--color-text-4)
    }

    .arco-cascader-disabled .arco-cascader-view input::placeholder {
        color: var(--color-text-4)
    }

    .arco-cascader-single .arco-cascader-view-input {
        box-sizing: border-box;
        white-space: nowrap;
        text-overflow: ellipsis;
        background: 0 0;
        border: none;
        outline: none;
        width: 100%;
        padding: 0;
        overflow: hidden
    }

    .arco-cascader-single .arco-cascader-view-selector {
        box-sizing: border-box;
        width: 100%;
        display: inline-flex;
        position: relative;
        overflow: hidden
    }

    .arco-cascader-single .arco-cascader-view-selector .arco-cascader-view-input {
        z-index: 1;
        position: absolute;
        top: 50%;
        left: 0;
        right: 0;
        transform: translateY(-50%)
    }

    .arco-cascader-single .arco-cascader-view-selector .arco-cascader-view-value-mirror {
        opacity: 0
    }

    .arco-cascader-single .arco-cascader-view-value,
    .arco-cascader-single .arco-cascader-view-value-mirror {
        box-sizing: border-box;
        white-space: nowrap;
        text-overflow: ellipsis;
        width: 100%;
        display: inline-block;
        overflow: hidden
    }

    .arco-cascader-single .arco-cascader-view-value:after,
    .arco-cascader-single .arco-cascader-view-value-mirror:after {
        content: ".";
        visibility: hidden;
        font-size: 0;
        line-height: 0
    }

    .arco-cascader-single .arco-cascader-view .arco-cascader-hidden {
        opacity: 0;
        z-index: -1;
        position: absolute
    }

    .arco-cascader-multiple {
        vertical-align: top
    }

    .arco-cascader-multiple .arco-cascader-view {
        padding: 0 4px;
        line-height: 0
    }

    .arco-cascader-multiple .arco-cascader-view-with-prefix {
        padding-left: 12px
    }

    .arco-cascader-multiple .arco-input-tag {
        flex: 1;
        padding: 0;
        overflow: hidden;
        box-shadow: none !important;
        background: 0 0 !important;
        border: none !important
    }

    .arco-cascader-multiple .arco-tag {
        max-width: 100%
    }

    .arco-cascader-multiple:not(.arco-cascader-focused) .arco-input-tag input:not(:first-child)[value=""] {
        opacity: 0;
        z-index: -1;
        position: absolute
    }

    .arco-cascader-prefix {
        white-space: nowrap;
        color: var(--color-text-2);
        align-items: center;
        margin-right: 12px;
        display: flex
    }

    .arco-cascader-suffix {
        align-items: center;
        margin-left: 4px;
        display: flex
    }

    .arco-cascader-suffix-icon,
    .arco-cascader-search-icon,
    .arco-cascader-loading-icon,
    .arco-cascader-expand-icon,
    .arco-cascader-clear-icon {
        font-size: 12px;
        transition: all .1s cubic-bezier(0, 0, 1, 1)
    }

    .arco-cascader-arrow-icon {
        font-size: 12px
    }

    .arco-cascader-open .arco-cascader-arrow-icon svg {
        transform: rotate(180deg)
    }

    .arco-cascader .arco-cascader-clear-icon {
        cursor: pointer;
        display: none
    }

    .arco-cascader .arco-cascader-clear-icon>svg {
        transition: all .1s cubic-bezier(0, 0, 1, 1);
        position: relative
    }

    .arco-cascader:hover .arco-cascader-clear-icon {
        display: block
    }

    .arco-cascader:hover .arco-cascader-clear-icon~* {
        display: none
    }

    .arco-cascader-wrapper {
        align-items: stretch;
        width: 100%;
        display: inline-flex
    }

    .arco-cascader-wrapper .arco-cascader {
        min-width: 0
    }

    .arco-cascader-wrapper .arco-cascader:not(.arco-cascader-focused):not(:first-child) .arco-cascader-view {
        border-top-left-radius: 0;
        border-bottom-left-radius: 0
    }

    .arco-cascader-wrapper .arco-cascader:not(.arco-cascader-focused):not(:last-child) .arco-cascader-view {
        border-top-right-radius: 0;
        border-bottom-right-radius: 0
    }

    .arco-cascader-addbefore {
        color: var(--color-text-1);
        background-color: var(--color-fill-2);
        white-space: nowrap;
        border: 1px solid transparent;
        border-right: 1px solid var(--color-border-2);
        border-top-left-radius: var(--border-radius-small);
        border-bottom-left-radius: var(--border-radius-small);
        align-items: center;
        padding: 0 12px;
        display: flex
    }

    .arco-cascader-rtl.arco-cascader-size-mini.arco-cascader-multiple .arco-cascader-view-with-prefix {
        padding-left: 0;
        padding-right: 7px
    }

    .arco-cascader-rtl.arco-cascader-size-mini.arco-cascader-multiple .arco-cascader-suffix {
        padding-left: 4px;
        padding-right: 0
    }

    .arco-cascader-rtl.arco-cascader-size-mini.arco-cascader-multiple .arco-input-tag-has-placeholder input,
    .arco-cascader-rtl.arco-cascader-size-mini.arco-cascader-multiple .arco-input-tag-has-placeholder .arco-input-tag-input-mirror {
        padding-left: 0;
        padding-right: 4px
    }

    .arco-cascader-rtl.arco-cascader-size-small.arco-cascader-multiple .arco-cascader-view-with-prefix {
        padding-left: 0;
        padding-right: 11px
    }

    .arco-cascader-rtl.arco-cascader-size-small.arco-cascader-multiple .arco-cascader-suffix {
        padding-left: 8px;
        padding-right: 0
    }

    .arco-cascader-rtl.arco-cascader-size-small.arco-cascader-multiple .arco-input-tag-has-placeholder input,
    .arco-cascader-rtl.arco-cascader-size-small.arco-cascader-multiple .arco-input-tag-has-placeholder .arco-input-tag-input-mirror {
        padding-left: 0;
        padding-right: 8px
    }

    .arco-cascader-rtl.arco-cascader-size-default.arco-cascader-multiple .arco-cascader-view-with-prefix {
        padding-left: 0;
        padding-right: 11px
    }

    .arco-cascader-rtl.arco-cascader-size-default.arco-cascader-multiple .arco-cascader-suffix {
        padding-left: 8px;
        padding-right: 0
    }

    .arco-cascader-rtl.arco-cascader-size-default.arco-cascader-multiple .arco-input-tag-has-placeholder input,
    .arco-cascader-rtl.arco-cascader-size-default.arco-cascader-multiple .arco-input-tag-has-placeholder .arco-input-tag-input-mirror {
        padding-left: 0;
        padding-right: 8px
    }

    .arco-cascader-rtl.arco-cascader-size-large.arco-cascader-multiple .arco-cascader-view-with-prefix {
        padding-left: 0;
        padding-right: 15px
    }

    .arco-cascader-rtl.arco-cascader-size-large.arco-cascader-multiple .arco-cascader-suffix {
        padding-left: 12px;
        padding-right: 0
    }

    .arco-cascader-rtl.arco-cascader-size-large.arco-cascader-multiple .arco-input-tag-has-placeholder input,
    .arco-cascader-rtl.arco-cascader-size-large.arco-cascader-multiple .arco-input-tag-has-placeholder .arco-input-tag-input-mirror {
        padding-left: 0;
        padding-right: 12px
    }

    .arco-cascader-wrapper-rtl .arco-cascader-addbefore {
        border-right: unset;
        border-left: 1px solid var(--color-border-2)
    }

    .arco-cascader-rtl .arco-cascader-view {
        text-align: right
    }

    .arco-cascader-rtl .arco-cascader-multiple .arco-cascader-view-with-prefix {
        padding-left: 0;
        padding-right: 12px
    }

    .arco-cascader-rtl .arco-cascader-prefix {
        margin-left: 12px;
        margin-right: 0
    }

    .arco-cascader-rtl .arco-cascader-suffix {
        margin-left: 0;
        margin-right: 4px
    }

    .arco-cascader-popup {
        box-sizing: border-box;
        border: 1px solid var(--color-fill-3);
        border-radius: var(--border-radius-medium);
        background-color: var(--color-bg-popup);
        top: 4px;
        overflow: hidden;
        box-shadow: 0 4px 10px rgba(0, 0, 0, .1)
    }

    .arco-cascader-popup-trigger-hover .arco-cascader-list-item {
        transition: font-weight
    }

    .arco-cascader-popup .arco-cascader-popup-inner {
        white-space: nowrap;
        width: 100%;
        height: 200px;
        list-style: none
    }

    .arco-cascader-highlight {
        font-weight: 500
    }

    .arco-cascader-list-column {
        vertical-align: top;
        background-color: var(--color-bg-popup);
        height: 100%;
        display: inline-block;
        position: relative
    }

    .arco-cascader-list-column-virtual {
        width: 120px
    }

    .arco-cascader-list-column:not(:last-of-type) {
        border-right: 1px solid var(--color-fill-3)
    }

    .arco-cascader-list-wrapper {
        white-space: nowrap;
        box-sizing: border-box;
        flex-direction: column;
        height: 100%;
        padding: 4px 0;
        display: flex;
        position: relative
    }

    .arco-cascader-list-wrapper-with-footer {
        padding-bottom: 0
    }

    .arco-cascader-list-empty {
        align-items: center;
        height: 100%;
        display: flex
    }

    .arco-cascader-list {
        box-sizing: border-box;
        flex: 1;
        margin: 0;
        padding: 0;
        list-style: none;
        overflow-y: auto
    }

    .arco-cascader-list-item,
    .arco-cascader-list-search-item {
        min-width: 100px;
        height: 36px;
        color: var(--color-text-1);
        box-sizing: border-box;
        cursor: pointer;
        background-color: transparent;
        font-size: 14px;
        line-height: 36px;
        display: flex;
        position: relative
    }

    .arco-cascader-list-item-label,
    .arco-cascader-list-search-item-label {
        flex-grow: 1;
        padding-left: 12px;
        padding-right: 34px
    }

    .arco-cascader-list-item .arco-icon-right,
    .arco-cascader-list-search-item .arco-icon-right,
    .arco-cascader-list-item .arco-icon-check,
    .arco-cascader-list-search-item .arco-icon-check {
        color: var(--color-text-2);
        font-size: 12px;
        position: absolute;
        top: 50%;
        right: 10px;
        transform: translateY(-50%)
    }

    .arco-cascader-list-item .arco-icon-check,
    .arco-cascader-list-search-item .arco-icon-check {
        color: rgb(var(--primary-6))
    }

    .arco-cascader-list-item .arco-icon-loading,
    .arco-cascader-list-search-item .arco-icon-loading {
        color: rgb(var(--primary-6));
        margin-top: -6px;
        font-size: 12px;
        position: absolute;
        top: 50%;
        right: 10px
    }

    .arco-cascader-list-item:hover,
    .arco-cascader-list-search-item-hover {
        color: var(--color-text-1);
        background-color: var(--color-fill-2)
    }

    .arco-cascader-list-item:hover .arco-checkbox input,
    .arco-cascader-list-search-item-hover .arco-checkbox input {
        display: none
    }

    .arco-cascader-list-item:hover .arco-checkbox:not(.arco-checkbox-disabled):not(.arco-checkbox-checked):hover .arco-checkbox-icon-hover:before,
    .arco-cascader-list-search-item-hover .arco-checkbox:not(.arco-checkbox-disabled):not(.arco-checkbox-checked):hover .arco-checkbox-icon-hover:before {
        background-color: var(--color-fill-3)
    }

    .arco-cascader-list-item-disabled,
    .arco-cascader-list-search-item-disabled,
    .arco-cascader-list-item-disabled:hover,
    .arco-cascader-list-search-item-disabled:hover {
        cursor: not-allowed;
        color: var(--color-text-4);
        background-color: transparent
    }

    .arco-cascader-list-item-disabled .arco-icon-right,
    .arco-cascader-list-search-item-disabled .arco-icon-right,
    .arco-cascader-list-item-disabled:hover .arco-icon-right,
    .arco-cascader-list-search-item-disabled:hover .arco-icon-right {
        color: inherit
    }

    .arco-cascader-list-item-disabled .arco-icon-check,
    .arco-cascader-list-search-item-disabled .arco-icon-check,
    .arco-cascader-list-item-disabled:hover .arco-icon-check,
    .arco-cascader-list-search-item-disabled:hover .arco-icon-check {
        color: var(--color-primary-light-3)
    }

    .arco-cascader-list-item-active {
        background-color: var(--color-fill-2);
        color: var(--color-text-1);
        font-weight: 500;
        transition: all .2s cubic-bezier(0, 0, 1, 1)
    }

    .arco-cascader-list-item-active:hover {
        background-color: var(--color-fill-2);
        color: var(--color-text-1);
        font-weight: 500
    }

    .arco-cascader-list-item-active.arco-cascader-list-item-disabled,
    .arco-cascader-list-item-active.arco-cascader-list-item-disabled:hover {
        background-color: var(--color-fill-2);
        color: var(--color-text-4);
        font-weight: 500
    }

    .arco-cascader-list-multiple .arco-cascader-list-item-label {
        padding-left: 0
    }

    .arco-cascader-list-multiple .arco-cascader-list-item,
    .arco-cascader-list-multiple .arco-cascader-list-search-item {
        padding-left: 12px
    }

    .arco-cascader-list-multiple .arco-cascader-list-item .arco-checkbox,
    .arco-cascader-list-multiple .arco-cascader-list-search-item .arco-checkbox {
        margin-right: 8px;
        padding-left: 0
    }

    .arco-cascader-list-search.arco-cascader-list-multiple .arco-cascader-list-item-label {
        padding-right: 12px
    }

    .arco-cascader-list-footer {
        border-top: 1px solid var(--color-fill-3);
        box-sizing: border-box;
        height: 36px;
        padding-left: 12px;
        line-height: 36px
    }

    .cascaderSlide-enter-active,
    .cascaderSlide-appear-active {
        transition: margin .3s cubic-bezier(.34, .69, .1, 1)
    }

    .arco-cascader-list-column-rtl {
        direction: rtl
    }

    .arco-cascader-list-column-rtl:not(:last-of-type) {
        border-left: 1px solid var(--color-fill-3);
        border-right: none
    }

    .arco-cascader-list-rtl .arco-cascader-list-item-label,
    .arco-cascader-list-rtl .arco-cascader-list-search-item-label {
        padding-left: 34px;
        padding-right: 12px
    }

    .arco-cascader-list-rtl .arco-cascader-list-item .arco-icon-left,
    .arco-cascader-list-rtl .arco-cascader-list-search-item .arco-icon-left,
    .arco-cascader-list-rtl .arco-cascader-list-item .arco-icon-check,
    .arco-cascader-list-rtl .arco-cascader-list-search-item .arco-icon-check {
        color: var(--color-text-2);
        top: 50%;
        right: initial;
        font-size: 12px;
        position: absolute;
        left: 10px;
        transform: translateY(-50%)
    }

    .arco-cascader-list-rtl .arco-cascader-list-footer {
        padding-left: 0;
        padding-right: 12px
    }

    .arco-cascader-list-rtl.arco-cascader-multiple .arco-cascader-list-item-label {
        padding-right: 0
    }

    .arco-cascader-list-rtl.arco-cascader-multiple .arco-cascader-list-item,
    .arco-cascader-list-rtl.arco-cascader-multiple .arco-cascader-list-search-item {
        padding-right: 12px
    }

    .arco-cascader-list-rtl.arco-cascader-multiple .arco-cascader-list-item .arco-checkbox,
    .arco-cascader-list-rtl.arco-cascader-multiple .arco-cascader-list-search-item .arco-checkbox {
        margin-left: 8px;
        padding-right: 0
    }

    .arco-cascader-list-rtl.arco-cascader-multiple.arco-cascader-list-search .arco-cascader-list-item-label {
        padding-left: 12px;
        padding-right: 0
    }
}


@layer base {
    .arco-breadcrumb {
        color: var(--color-text-2);
        font-size: 14px;
        display: inline-block
    }

    .arco-breadcrumb-icon {
        color: var(--color-text-2)
    }

    .arco-breadcrumb-item {
        vertical-align: middle;
        color: var(--color-text-2);
        align-items: center;
        padding: 0 4px;
        line-height: 24px;
        display: inline-flex
    }

    .arco-breadcrumb-item>.arco-icon {
        color: var(--color-text-3)
    }

    .arco-breadcrumb-item a,
    .arco-breadcrumb-item[href] {
        border-radius: var(--border-radius-small);
        color: var(--color-text-2);
        background-color: transparent;
        margin: 0 -4px;
        padding: 0 4px;
        text-decoration: none;
        display: inline-block
    }

    .arco-breadcrumb-item a:hover,
    .arco-breadcrumb-item[href]:hover {
        background-color: var(--color-fill-2);
        color: rgb(var(--link-6))
    }

    .arco-breadcrumb-item a:focus-visible {
        box-shadow: 0 0 0 2px rgb(var(--primary-6))
    }

    .arco-breadcrumb-item[href]:focus-visible {
        box-shadow: 0 0 0 2px rgb(var(--primary-6))
    }

    .arco-breadcrumb-item:last-child {
        color: var(--color-text-1);
        font-weight: 500
    }

    .arco-breadcrumb-item-ellipses {
        color: var(--color-text-2);
        padding: 0 4px;
        display: inline-block;
        position: relative;
        top: -3px
    }

    .arco-breadcrumb-item-separator {
        vertical-align: middle;
        color: var(--color-text-4);
        margin: 0 4px;
        line-height: 24px;
        display: inline-block
    }

    .arco-breadcrumb-item-with-dropdown {
        cursor: pointer
    }

    .arco-breadcrumb-item-dropdown-icon {
        color: var(--color-text-2);
        margin-left: 4px;
        font-size: 12px
    }

    .arco-breadcrumb-item-dropdown-icon-active svg {
        transform: rotate(180deg)
    }

    .arco-breadcrumb-rtl .arco-breadcrumb-item-dropdown-icon {
        margin-left: 0;
        margin-right: 4px
    }
}


@layer base {
    .arco-icon-hover.arco-tabs-icon-hover:before {
        width: 16px;
        height: 16px
    }

    .arco-tabs .arco-tabs-icon-hover {
        color: var(--color-text-2);
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        font-size: 12px
    }

    .arco-tabs-dropdown-icon {
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        margin-left: 6px;
        font-size: 12px
    }

    .arco-tabs-close-icon {
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        margin-left: 8px
    }

    .arco-tabs-close-icon:focus-visible .arco-icon-hover:before {
        box-shadow: 0 0 0 2px var(--color-primary-light-3)
    }

    .arco-tabs-add-icon {
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        justify-content: center;
        align-items: center;
        padding: 0 8px;
        font-size: 12px;
        display: inline-flex
    }

    .arco-tabs-add-icon:focus-visible .arco-icon-hover:before {
        box-shadow: 0 0 0 2px var(--color-primary-light-3)
    }

    .arco-tabs-add {
        position: relative
    }

    .arco-tabs-left-icon {
        margin-left: 10px;
        margin-right: 6px
    }

    .arco-tabs-right-icon {
        margin-left: 6px;
        margin-right: 10px
    }

    .arco-tabs-up-icon {
        margin-bottom: 10px
    }

    .arco-tabs-down-icon {
        margin-top: 10px
    }

    .arco-tabs .arco-tabs-nav-icon-disabled {
        cursor: not-allowed;
        color: var(--color-text-4)
    }

    .arco-tabs {
        position: relative;
        overflow: hidden
    }

    .arco-tabs-header-nav {
        position: relative
    }

    .arco-tabs-header-nav:before {
        content: "";
        clear: both;
        background-color: var(--color-neutral-3);
        height: 1px;
        display: block;
        position: absolute;
        bottom: 0;
        left: 0;
        right: 0
    }

    .arco-tabs-header-nav-bottom:before,
    .arco-tabs-header-nav-bottom .arco-tabs-header-ink {
        top: 0
    }

    .arco-tabs-header-nav-bottom .arco-tabs-header-ink .arco-tabs-header-ink-inner {
        bottom: unset;
        top: 0
    }

    .arco-tabs-header-wrapper {
        flex: 1;
        display: flex;
        overflow: hidden
    }

    .arco-tabs-header {
        white-space: nowrap;
        transition: transform .2s cubic-bezier(.34, .69, .1, 1);
        display: inline-block;
        position: relative
    }

    .arco-tabs-header-extra {
        flex-shrink: 0;
        align-items: center;
        width: auto;
        line-height: 32px;
        display: flex
    }

    .arco-tabs-header-extra .arco-tabs-add-icon {
        padding-left: 0
    }

    .arco-tabs-header-title {
        box-sizing: border-box;
        cursor: pointer;
        color: var(--color-text-2);
        align-items: center;
        padding: 4px 0;
        font-size: 14px;
        line-height: 1.5715;
        transition: color .2s cubic-bezier(0, 0, 1, 1);
        display: inline-flex
    }

    .arco-tabs-header-title-text {
        display: inline-block
    }

    .arco-tabs-header-title:hover {
        color: var(--color-text-2);
        font-weight: 400
    }

    .arco-tabs-header-title-disabled,
    .arco-tabs-header-title-disabled:hover {
        color: var(--color-text-4);
        cursor: not-allowed
    }

    .arco-tabs-header-title-active,
    .arco-tabs-header-title-active:hover {
        color: rgb(var(--primary-6));
        font-weight: 500
    }

    .arco-tabs-header-title-active.arco-tabs-header-title-disabled,
    .arco-tabs-header-title-active:hover.arco-tabs-header-title-disabled {
        color: var(--color-primary-light-3)
    }

    .arco-tabs-header-ink {
        bottom: 0;
        right: initial;
        top: initial;
        background-color: rgb(var(--primary-6));
        height: 2px;
        transition: left .2s cubic-bezier(.34, .69, .1, 1), width .2s cubic-bezier(.34, .69, .1, 1);
        position: absolute
    }

    .arco-tabs-header-ink.arco-tabs-header-ink-no-animation {
        transition: none
    }

    .arco-tabs-header-ink.arco-tabs-header-ink-custom {
        background-color: transparent
    }

    .arco-tabs-header-ink.arco-tabs-header-ink-custom .arco-tabs-header-ink-inner {
        background-color: rgb(var(--primary-6));
        width: 100%;
        height: 100%;
        position: absolute;
        bottom: 0;
        left: 50%;
        transform: translate(-50%)
    }

    .arco-tabs-header-ink-disabled {
        background-color: var(--color-primary-light-3)
    }

    .arco-tabs-header-nav-line .arco-tabs-header-extra {
        line-height: 40px
    }

    .arco-tabs-header-nav-line .arco-tabs-header-title {
        margin: 0 16px;
        padding: 8px 0;
        line-height: 1.5715
    }

    .arco-tabs-header-nav-line .arco-tabs-header-title-text {
        padding: 1px 0;
        display: inline-block;
        position: relative
    }

    .arco-tabs-header-nav-line .arco-tabs-header-title-text:before {
        content: "";
        z-index: -1;
        opacity: 1;
        border-radius: var(--border-radius-small);
        background-color: transparent;
        transition: all .2s cubic-bezier(0, 0, 1, 1);
        position: absolute;
        top: 0;
        bottom: 0;
        left: -8px;
        right: -8px
    }

    .arco-tabs-header-nav-line .arco-tabs-header-title:hover .arco-tabs-header-title-text:before {
        background-color: var(--color-fill-2)
    }

    .arco-tabs-header-nav-line .arco-tabs-header-title:focus-visible .arco-tabs-header-title-text:before {
        box-shadow: inset 0 0 0 2px var(--color-primary-light-3)
    }

    .arco-tabs-header-nav-line .arco-tabs-header-title-active .arco-tabs-header-title-text:before,
    .arco-tabs-header-nav-line .arco-tabs-header-title-active:hover .arco-tabs-header-title-text:before {
        background-color: transparent
    }

    .arco-tabs-header-nav-line .arco-tabs-header-title-disabled .arco-tabs-header-title-text:before,
    .arco-tabs-header-nav-line .arco-tabs-header-title-disabled:hover .arco-tabs-header-title-text:before {
        opacity: 0
    }

    .arco-tabs-header-nav-line.arco-tabs-header-nav-horizontal>.arco-tabs-header-scroll .arco-tabs-header-title:first-of-type {
        margin-left: 16px
    }

    .arco-tabs-header-nav-line.arco-tabs-header-nav-horizontal .arco-tabs-header-no-padding>.arco-tabs-header-title:first-of-type,
    .arco-tabs-header-nav-text.arco-tabs-header-nav-horizontal .arco-tabs-header-no-padding>.arco-tabs-header-title:first-of-type {
        margin-left: 0
    }

    .arco-tabs-header-nav-card .arco-tabs-header-title,
    .arco-tabs-header-nav-card-gutter .arco-tabs-header-title {
        border: 1px solid var(--color-neutral-3);
        padding: 4px 16px;
        font-size: 14px;
        transition: padding .2s cubic-bezier(0, 0, 1, 1), color .2s cubic-bezier(0, 0, 1, 1)
    }

    .arco-tabs-header-nav-card .arco-tabs-header-title:focus-visible {
        box-shadow: inset 0 0 0 2px var(--color-primary-light-3)
    }

    .arco-tabs-header-nav-card-gutter .arco-tabs-header-title:focus-visible {
        box-shadow: inset 0 0 0 2px var(--color-primary-light-3)
    }

    .arco-tabs-header-nav-card .arco-tabs-header-title-editable,
    .arco-tabs-header-nav-card-gutter .arco-tabs-header-title-editable {
        padding-right: 12px
    }

    .arco-tabs-header-nav-card .arco-tabs-header-title-editable:not(.arco-tabs-header-title-active):hover .arco-icon-hover:hover:before,
    .arco-tabs-header-nav-card-gutter .arco-tabs-header-title-editable:not(.arco-tabs-header-title-active):hover .arco-icon-hover:hover:before {
        background-color: var(--color-fill-4)
    }

    .arco-tabs-header-nav-card .arco-tabs-add-icon,
    .arco-tabs-header-nav-card-gutter .arco-tabs-add-icon {
        color: var(--color-text-2);
        height: 32px
    }

    .arco-tabs-header-nav-card .arco-tabs-header-title {
        background-color: transparent;
        border-right: none
    }

    .arco-tabs-header-nav-card .arco-tabs-header-title:last-child {
        border-right: 1px solid var(--color-neutral-3);
        border-top-right-radius: var(--border-radius-small)
    }

    .arco-tabs-header-nav-card .arco-tabs-header-title:first-child {
        border-top-left-radius: var(--border-radius-small)
    }

    .arco-tabs-header-nav-card .arco-tabs-header-title:hover {
        background-color: var(--color-fill-3)
    }

    .arco-tabs-header-nav-card .arco-tabs-header-title-disabled,
    .arco-tabs-header-nav-card .arco-tabs-header-title-disabled:hover {
        background-color: transparent
    }

    .arco-tabs-header-nav-card .arco-tabs-header-title-active,
    .arco-tabs-header-nav-card .arco-tabs-header-title-active:hover {
        border-bottom-color: var(--color-bg-2);
        background-color: transparent
    }

    .arco-tabs-header-nav-card.arco-tabs-header-nav-bottom .arco-tabs-header-title-active,
    .arco-tabs-header-nav-card.arco-tabs-header-nav-bottom .arco-tabs-header-title-active:hover {
        border-top-color: var(--color-bg-2);
        border-bottom-color: var(--color-neutral-3)
    }

    .arco-tabs-header-nav-card-gutter .arco-tabs-header-title {
        border-right: 1px solid var(--color-neutral-3);
        background-color: var(--color-fill-1);
        border-radius: var(--border-radius-small)var(--border-radius-small)0 0;
        margin-left: 4px
    }

    .arco-tabs-header-nav-card-gutter .arco-tabs-header-title:hover {
        background-color: var(--color-fill-3)
    }

    .arco-tabs-header-nav-card-gutter .arco-tabs-header-title-disabled,
    .arco-tabs-header-nav-card-gutter .arco-tabs-header-title-disabled:hover {
        background-color: var(--color-fill-1)
    }

    .arco-tabs-header-nav-card-gutter .arco-tabs-header-title-active,
    .arco-tabs-header-nav-card-gutter .arco-tabs-header-title-active:hover {
        border-bottom-color: var(--color-bg-2);
        background-color: transparent
    }

    .arco-tabs-header-nav-card-gutter .arco-tabs-header-title:first-child {
        margin-left: 0
    }

    .arco-tabs-header-nav-card-gutter.arco-tabs-header-nav-bottom .arco-tabs-header-title-active,
    .arco-tabs-header-nav-card-gutter.arco-tabs-header-nav-bottom .arco-tabs-header-title-active:hover {
        border-top-color: var(--color-bg-2);
        border-bottom-color: var(--color-neutral-3)
    }

    .arco-tabs-header-nav-text:before {
        display: none
    }

    .arco-tabs-header-nav-text .arco-tabs-header-title {
        margin: 0 9px;
        padding: 5px 0;
        font-size: 14px;
        line-height: 1.5715;
        position: relative
    }

    .arco-tabs-header-nav-text .arco-tabs-header-title:not(:first-of-type):before {
        background-color: var(--color-fill-3);
        content: "";
        width: 2px;
        height: 12px;
        display: block;
        position: absolute;
        top: 50%;
        left: -9px;
        transform: translateY(-50%)
    }

    .arco-tabs-header-nav-text .arco-tabs-header-title-text {
        background-color: transparent;
        padding-left: 8px;
        padding-right: 8px
    }

    .arco-tabs-header-nav-text .arco-tabs-header-title-text:hover {
        background-color: var(--color-fill-2)
    }

    .arco-tabs-header-nav-text .arco-tabs-header-title:focus-visible .arco-tabs-header-title-text {
        box-shadow: inset 0 0 0 2px var(--color-primary-light-3)
    }

    .arco-tabs-header-nav-text .arco-tabs-header-title-active .arco-tabs-header-title-text,
    .arco-tabs-header-nav-text .arco-tabs-header-title-active .arco-tabs-header-title-text:hover,
    .arco-tabs-header-nav-text .arco-tabs-header-title-disabled .arco-tabs-header-title-text,
    .arco-tabs-header-nav-text .arco-tabs-header-title-disabled .arco-tabs-header-title-text:hover {
        background-color: transparent
    }

    .arco-tabs-header-nav-text .arco-tabs-header-title-active.arco-tabs-header-nav-text .arco-tabs-header-title-disabled .arco-tabs-header-title-text,
    .arco-tabs-header-nav-text .arco-tabs-header-title-active.arco-tabs-header-nav-text .arco-tabs-header-title-disabled .arco-tabs-header-title-text:hover {
        background-color: var(--color-primary-light-3)
    }

    .arco-tabs-header-nav-rounded:before {
        display: none
    }

    .arco-tabs-header-nav-rounded .arco-tabs-header-title {
        background-color: transparent;
        border-radius: 32px;
        margin: 0 6px;
        padding: 5px 16px;
        font-size: 14px
    }

    .arco-tabs-header-nav-rounded .arco-tabs-header-title:hover {
        background-color: var(--color-fill-2)
    }

    .arco-tabs-header-nav-rounded .arco-tabs-header-title:focus-visible {
        box-shadow: inset 0 0 0 2px var(--color-primary-light-3)
    }

    .arco-tabs-header-nav-rounded .arco-tabs-header-title-disabled:hover {
        background-color: transparent
    }

    .arco-tabs-header-nav-rounded .arco-tabs-header-title-active,
    .arco-tabs-header-nav-rounded .arco-tabs-header-title-active:hover {
        background-color: var(--color-fill-2)
    }

    .arco-tabs-header-nav-capsule:before {
        display: none
    }

    .arco-tabs-header-nav-capsule .arco-tabs-header-wrapper {
        justify-content: flex-end
    }

    .arco-tabs-header-nav-capsule .arco-tabs-header {
        background-color: var(--color-fill-2);
        border-radius: var(--border-radius-small);
        padding: 3px;
        line-height: 1
    }

    .arco-tabs-header-nav-capsule .arco-tabs-header-title {
        border-radius: var(--border-radius-small);
        background-color: transparent;
        padding: 0 12px;
        font-size: 14px;
        line-height: 26px;
        position: relative
    }

    .arco-tabs-header-nav-capsule .arco-tabs-header-title:focus-visible {
        box-shadow: inset 0 0 0 2px var(--color-primary-light-3)
    }

    .arco-tabs-header-nav-capsule .arco-tabs-header-title:hover {
        background-color: var(--color-bg-2)
    }

    .arco-tabs-header-nav-capsule .arco-tabs-header-title-disabled:hover {
        background-color: unset
    }

    .arco-tabs-header-nav-capsule .arco-tabs-header-title-active,
    .arco-tabs-header-nav-capsule .arco-tabs-header-title-active:hover {
        background-color: var(--color-bg-2)
    }

    .arco-tabs-header-nav-capsule .arco-tabs-header-title-active:before,
    .arco-tabs-header-nav-capsule .arco-tabs-header-title-active:hover:before,
    .arco-tabs-header-nav-capsule .arco-tabs-header-title-active+.arco-tabs-header-title:before,
    .arco-tabs-header-nav-capsule .arco-tabs-header-title-active:hover+.arco-tabs-header-title:before {
        opacity: 0
    }

    .arco-tabs-header-nav-capsule.arco-tabs-header-nav-horizontal .arco-tabs-header-title:not(:first-of-type) {
        margin-left: 3px
    }

    .arco-tabs-header-nav-capsule.arco-tabs-header-nav-horizontal .arco-tabs-header-title:not(:first-of-type):before {
        background-color: var(--color-fill-3);
        content: "";
        width: 1px;
        height: 14px;
        transition: all .2s cubic-bezier(0, 0, 1, 1);
        display: block;
        position: absolute;
        top: 50%;
        left: -2px;
        transform: translateY(-50%)
    }

    .arco-tabs-header-scroll {
        align-items: center;
        display: flex;
        position: relative;
        overflow: hidden
    }

    .arco-tabs-content {
        box-sizing: border-box;
        width: 100%;
        padding-top: 16px;
        overflow: hidden
    }

    .arco-tabs-content .arco-tabs-content-inner {
        width: 100%;
        display: flex
    }

    .arco-tabs-content .arco-tabs-content-item {
        flex-shrink: 0;
        width: 100%;
        height: 0;
        overflow: hidden
    }

    .arco-tabs-content .arco-tabs-content-item.arco-tabs-content-item-active {
        height: auto
    }

    .arco-tabs-card>.arco-tabs-content,
    .arco-tabs-card-gutter>.arco-tabs-content {
        border: 1px solid var(--color-neutral-3);
        border-top: none
    }

    .arco-tabs-card.arco-tabs-bottom>.arco-tabs-content,
    .arco-tabs-card-gutter.arco-tabs-bottom>.arco-tabs-content {
        border-top: 1px solid var(--color-neutral-3);
        border-bottom: none
    }

    .arco-tabs-animation.arco-tabs-content-inner {
        transition: all .2s cubic-bezier(.34, .69, .1, 1)
    }

    .arco-tabs-horizontal.arco-tabs-justify {
        flex-direction: column;
        height: 100%;
        display: flex
    }

    .arco-tabs-horizontal.arco-tabs-justify .arco-tabs-content,
    .arco-tabs-horizontal.arco-tabs-justify .arco-tabs-content-inner,
    .arco-tabs-horizontal.arco-tabs-justify .arco-tabs-pane {
        height: 100%
    }

    .arco-tabs-header-size-mini.arco-tabs-header-nav-line .arco-tabs-header-title {
        padding-top: 6px;
        padding-bottom: 6px;
        font-size: 12px
    }

    .arco-tabs-header-size-mini.arco-tabs-header-nav-line .arco-tabs-header-extra {
        font-size: 12px;
        line-height: 32px
    }

    .arco-tabs-header-size-mini.arco-tabs-header-nav-card .arco-tabs-header-title,
    .arco-tabs-header-size-mini.arco-tabs-header-nav-card-gutter .arco-tabs-header-title {
        padding-top: 2px;
        padding-bottom: 2px;
        font-size: 12px
    }

    .arco-tabs-header-size-mini.arco-tabs-header-nav-card .arco-tabs-header-extra,
    .arco-tabs-header-size-mini.arco-tabs-header-nav-card-gutter .arco-tabs-header-extra {
        font-size: 12px;
        line-height: 24px
    }

    .arco-tabs-header-size-mini.arco-tabs-header-nav-card .arco-tabs-add-icon,
    .arco-tabs-header-size-mini.arco-tabs-header-nav-card-gutter .arco-tabs-add-icon {
        height: 24px
    }

    .arco-tabs-header-size-mini.arco-tabs-header-nav-capsule .arco-tabs-header-title {
        font-size: 12px;
        line-height: 18px
    }

    .arco-tabs-header-size-mini.arco-tabs-header-nav-capsule .arco-tabs-header-extra {
        font-size: 12px;
        line-height: 24px
    }

    .arco-tabs-header-size-mini.arco-tabs-header-nav-rounded .arco-tabs-header-title {
        padding-top: 3px;
        padding-bottom: 3px;
        font-size: 12px
    }

    .arco-tabs-header-size-mini.arco-tabs-header-nav-rounded .arco-tabs-header-extra {
        font-size: 12px;
        line-height: 24px
    }

    .arco-tabs-header-size-small.arco-tabs-header-nav-line .arco-tabs-header-title {
        padding-top: 6px;
        padding-bottom: 6px;
        font-size: 14px
    }

    .arco-tabs-header-size-small.arco-tabs-header-nav-line .arco-tabs-header-extra {
        font-size: 14px;
        line-height: 36px
    }

    .arco-tabs-header-size-small.arco-tabs-header-nav-card .arco-tabs-header-title,
    .arco-tabs-header-size-small.arco-tabs-header-nav-card-gutter .arco-tabs-header-title {
        padding-top: 2px;
        padding-bottom: 2px;
        font-size: 14px
    }

    .arco-tabs-header-size-small.arco-tabs-header-nav-card .arco-tabs-header-extra,
    .arco-tabs-header-size-small.arco-tabs-header-nav-card-gutter .arco-tabs-header-extra {
        font-size: 14px;
        line-height: 28px
    }

    .arco-tabs-header-size-small.arco-tabs-header-nav-card .arco-tabs-add-icon,
    .arco-tabs-header-size-small.arco-tabs-header-nav-card-gutter .arco-tabs-add-icon {
        height: 28px
    }

    .arco-tabs-header-size-small.arco-tabs-header-nav-capsule .arco-tabs-header-title {
        font-size: 14px;
        line-height: 22px
    }

    .arco-tabs-header-size-small.arco-tabs-header-nav-capsule .arco-tabs-header-extra {
        font-size: 14px;
        line-height: 28px
    }

    .arco-tabs-header-size-small.arco-tabs-header-nav-rounded .arco-tabs-header-title {
        padding-top: 3px;
        padding-bottom: 3px;
        font-size: 14px
    }

    .arco-tabs-header-size-small.arco-tabs-header-nav-rounded .arco-tabs-header-extra {
        font-size: 14px;
        line-height: 28px
    }

    .arco-tabs-header-size-large.arco-tabs-header-nav-line .arco-tabs-header-title {
        padding-top: 10px;
        padding-bottom: 10px;
        font-size: 14px
    }

    .arco-tabs-header-size-large.arco-tabs-header-nav-line .arco-tabs-header-extra {
        font-size: 14px;
        line-height: 44px
    }

    .arco-tabs-header-size-large.arco-tabs-header-nav-card .arco-tabs-header-title,
    .arco-tabs-header-size-large.arco-tabs-header-nav-card-gutter .arco-tabs-header-title {
        padding-top: 6px;
        padding-bottom: 6px;
        font-size: 14px
    }

    .arco-tabs-header-size-large.arco-tabs-header-nav-card .arco-tabs-header-extra,
    .arco-tabs-header-size-large.arco-tabs-header-nav-card-gutter .arco-tabs-header-extra {
        font-size: 14px;
        line-height: 36px
    }

    .arco-tabs-header-size-large.arco-tabs-header-nav-card .arco-tabs-add-icon,
    .arco-tabs-header-size-large.arco-tabs-header-nav-card-gutter .arco-tabs-add-icon {
        height: 36px
    }

    .arco-tabs-header-size-large.arco-tabs-header-nav-capsule .arco-tabs-header-title {
        font-size: 14px;
        line-height: 30px
    }

    .arco-tabs-header-size-large.arco-tabs-header-nav-capsule .arco-tabs-header-extra {
        font-size: 14px;
        line-height: 36px
    }

    .arco-tabs-header-size-large.arco-tabs-header-nav-rounded .arco-tabs-header-title {
        padding-top: 7px;
        padding-bottom: 7px;
        font-size: 14px
    }

    .arco-tabs-header-size-large.arco-tabs-header-nav-rounded .arco-tabs-header-extra {
        font-size: 14px;
        line-height: 36px
    }

    .arco-tabs-right {
        flex-direction: row-reverse
    }

    .arco-tabs-vertical {
        flex-wrap: nowrap;
        display: flex
    }

    .arco-tabs-header-nav-vertical {
        flex-grow: 0;
        flex-shrink: 0
    }

    .arco-tabs-header-nav-vertical:before {
        left: initial;
        clear: both;
        width: 1px;
        height: 100%;
        position: absolute;
        top: 0;
        bottom: 0;
        right: 0
    }

    .arco-tabs-header-nav-vertical .arco-tabs-add-icon {
        height: auto;
        margin-top: 8px;
        margin-left: 0;
        padding: 0 16px
    }

    .arco-tabs-header-nav-vertical .arco-tabs-header {
        height: auto
    }

    .arco-tabs-header-nav-vertical .arco-tabs-header-scroll {
        flex-direction: column
    }

    .arco-tabs-header-nav-vertical .arco-tabs-header-overflow-scroll {
        padding: 6px 0
    }

    .arco-tabs-header-nav-vertical .arco-tabs-header-wrapper {
        flex-direction: column;
        height: 100%
    }

    .arco-tabs-header-nav-vertical .arco-tabs-header-ink {
        left: initial;
        right: 0;
        bottom: initial;
        width: 2px;
        transition: top .2s cubic-bezier(.34, .69, .1, 1), height .2s cubic-bezier(.34, .69, .1, 1);
        position: absolute
    }

    .arco-tabs-header-nav-vertical .arco-tabs-header-ink.arco-tabs-header-ink-custom .arco-tabs-header-ink-inner {
        left: unset;
        bottom: unset;
        top: 50%;
        right: 0;
        transform: translateY(-50%)
    }

    .arco-tabs-header-nav-vertical .arco-tabs-header-title {
        white-space: nowrap;
        margin: 12px 0 0;
        display: block
    }

    .arco-tabs-header-nav-vertical .arco-tabs-header-title:first-of-type {
        margin-top: 0
    }

    .arco-tabs-header-nav-right:before {
        right: unset;
        left: 0
    }

    .arco-tabs-header-nav-right .arco-tabs-header-ink,
    .arco-tabs-header-nav-right .arco-tabs-header-ink .arco-tabs-header-ink-inner {
        left: 0;
        right: unset
    }

    .arco-tabs-header-nav-vertical .arco-tabs-header-scroll {
        box-sizing: border-box;
        height: 100%;
        position: relative
    }

    .arco-tabs-header-nav-line.arco-tabs-header-nav-vertical .arco-tabs-header-title {
        padding: 0 20px
    }

    .arco-tabs-header-nav-vertical.arco-tabs-header-nav-card .arco-tabs-header-title {
        border: 1px solid var(--color-neutral-3);
        border-bottom-color: transparent;
        margin: 0;
        position: relative
    }

    .arco-tabs-header-nav-vertical.arco-tabs-header-nav-card .arco-tabs-header-title:first-child {
        border-top-left-radius: var(--border-radius-small)
    }

    .arco-tabs-header-nav-vertical.arco-tabs-header-nav-card .arco-tabs-header-title-active,
    .arco-tabs-header-nav-vertical.arco-tabs-header-nav-card .arco-tabs-header-title-active:hover {
        border-bottom-color: transparent;
        border-right-color: var(--color-bg-2)
    }

    .arco-tabs-header-nav-vertical.arco-tabs-header-nav-card .arco-tabs-header-title:last-child {
        border-bottom: 1px solid var(--color-neutral-3);
        border-bottom-left-radius: var(--border-radius-small)
    }

    .arco-tabs-header-nav-vertical.arco-tabs-header-nav-card.arco-tabs-header-nav-right .arco-tabs-header-title-active,
    .arco-tabs-header-nav-vertical.arco-tabs-header-nav-card.arco-tabs-header-nav-right .arco-tabs-header-title-active:hover {
        border-right-color: var(--color-neutral-3);
        border-left-color: var(--color-bg-2)
    }

    .arco-tabs-header-nav-vertical.arco-tabs-header-nav-card-gutter .arco-tabs-header-title {
        border-radius: var(--border-radius-small)0 0 var(--border-radius-small);
        margin-left: 0;
        position: relative
    }

    .arco-tabs-header-nav-vertical.arco-tabs-header-nav-card-gutter .arco-tabs-header-title:not(:first-of-type) {
        margin-top: 4px
    }

    .arco-tabs-header-nav-vertical.arco-tabs-header-nav-card-gutter .arco-tabs-header-title-active,
    .arco-tabs-header-nav-vertical.arco-tabs-header-nav-card-gutter .arco-tabs-header-title-active:hover {
        border-right-color: var(--color-bg-2);
        border-bottom-color: var(--color-neutral-3)
    }

    .arco-tabs-header-nav-vertical.arco-tabs-header-nav-card-gutter.arco-tabs-header-nav-right .arco-tabs-header-title-active,
    .arco-tabs-header-nav-vertical.arco-tabs-header-nav-card-gutter.arco-tabs-header-nav-right .arco-tabs-header-title-active:hover {
        border-right-color: var(--color-neutral-3);
        border-left-color: var(--color-bg-2)
    }

    .arco-tabs-content-vertical {
        flex: auto;
        width: auto;
        height: 100%;
        padding: 0
    }

    .arco-tabs-right .arco-tabs-content-vertical {
        padding-right: 16px
    }

    .arco-tabs-left .arco-tabs-content-vertical {
        padding-left: 16px
    }

    .arco-tabs-card>.arco-tabs-content-vertical,
    .arco-tabs-card-gutter>.arco-tabs-content-vertical {
        border: 1px solid var(--color-neutral-3);
        border-left: none
    }

    .arco-tabs-card.arco-tabs-right>.arco-tabs-content-vertical,
    .arco-tabs-card-gutter.arco-tabs-right>.arco-tabs-content-vertical {
        border-left: 1px solid var(--color-neutral-3);
        border-right: none
    }

    .arco-tabs-rtl {
        direction: rtl
    }

    .arco-tabs-rtl.arco-tabs-left {
        flex-direction: row-reverse
    }

    .arco-tabs-rtl.arco-tabs-right {
        flex-direction: row
    }

    .arco-tabs-rtl .arco-tabs-close-icon {
        margin-left: 0;
        margin-right: 8px
    }

    .arco-tabs-rtl .arco-tabs-left-icon,
    .arco-tabs-rtl .arco-tabs-right-icon {
        margin-left: 6px;
        margin-right: 10px
    }

    .arco-tabs-rtl .arco-tabs-header-nav-line>.arco-tabs-header-nav-horizontal .arco-tabs-header-scroll>.arco-tabs-header-title:first-of-type,
    .arco-tabs-rtl .arco-tabs-header-nav-line>.arco-tabs-header-nav-horizontal .arco-tabs-header-no-padding>.arco-tabs-header-title:first-of-type,
    .arco-tabs-rtl .arco-tabs-header-nav-text>.arco-tabs-header-nav-horizontal .arco-tabs-header-no-padding>.arco-tabs-header-title:first-of-type {
        margin-right: 0
    }

    .arco-tabs-rtl .arco-tabs-header-nav-card .arco-tabs-header-title-editable,
    .arco-tabs-rtl .arco-tabs-header-nav-card-gutter .arco-tabs-header-title-editable {
        padding-left: 12px;
        padding-right: 16px
    }

    .arco-tabs-rtl .arco-tabs-header-nav-card .arco-tabs-header-title {
        border-right: 1px solid var(--color-neutral-3);
        border-left: none
    }

    .arco-tabs-rtl .arco-tabs-header-nav-card .arco-tabs-header-title:last-child {
        border-left: 1px solid var(--color-neutral-3);
        border-top-left-radius: var(--border-radius-small);
        border-top-right-radius: 0
    }

    .arco-tabs-rtl .arco-tabs-header-nav-card .arco-tabs-header-title:first-child {
        border-top-left-radius: 0;
        border-top-right-radius: var(--border-radius-small)
    }

    .arco-tabs-rtl .arco-tabs-header-nav-card-gutter .arco-tabs-header-title {
        margin-right: 4px
    }

    .arco-tabs-rtl .arco-tabs-header-nav-card-gutter .arco-tabs-header-title:first-child {
        margin-right: 0
    }

    .arco-tabs-rtl .arco-tabs-header-nav-text .arco-tabs-header-title:not(:first-of-type):before {
        left: initial;
        right: -9px
    }

    .arco-tabs-rtl .arco-tabs-header-nav-capsule.arco-tabs-header-nav-horizontal .arco-tabs-header-title:not(:first-of-type) {
        margin-left: 0;
        margin-right: 3px
    }

    .arco-tabs-rtl .arco-tabs-header-nav-capsule.arco-tabs-header-nav-horizontal .arco-tabs-header-title:not(:first-of-type):before {
        right: -2px;
        left: initial
    }

    body[arco-theme=dark] .arco-tabs-header-nav-capsule .arco-tabs-header-title-active,
    body[arco-theme=dark] .arco-tabs-header-nav-capsule .arco-tabs-header-title:not(body[arco-theme=dark] .arco-tabs-header-nav-capsule .arco-tabs-header-title-disabled):hover {
        background-color: var(--color-fill-3)
    }
}


@layer base {
    .arco-drawer-mask {
        background-color: var(--color-mask-bg);
        width: 100%;
        height: 100%;
        position: absolute;
        top: 0;
        left: 0
    }

    .arco-drawer-no-mask {
        pointer-events: none
    }

    .arco-drawer-no-mask .arco-drawer {
        pointer-events: auto
    }

    .arco-drawer-wrapper {
        z-index: 1001;
        width: 100%;
        height: 100%;
        position: fixed;
        top: 0;
        left: 0
    }

    .arco-drawer-wrapper-hide {
        display: none
    }

    .arco-drawer {
        background-color: var(--color-bg-3);
        width: 100%;
        height: 100%;
        line-height: 1.5715;
        position: absolute
    }

    .arco-drawer-wrapper {
        height: 100%;
        position: relative
    }

    .arco-drawer-fixed {
        z-index: 1001;
        position: fixed;
        top: 0
    }

    .arco-drawer-inner {
        height: 100%;
        overflow: hidden
    }

    .arco-drawer-scroll {
        flex-direction: column;
        height: 100%;
        display: flex;
        overflow: auto
    }

    .arco-drawer-header {
        box-sizing: border-box;
        border-bottom: 1px solid var(--color-neutral-3);
        flex-shrink: 0;
        align-items: center;
        width: 100%;
        height: 48px;
        padding: 0 16px;
        display: flex
    }

    .arco-drawer-header-title {
        color: var(--color-text-1);
        text-align: left;
        font-size: 16px;
        font-weight: 500
    }

    .arco-drawer-footer {
        box-sizing: border-box;
        border-top: 1px solid var(--color-neutral-3);
        text-align: right;
        flex-shrink: 0;
        padding: 16px
    }

    .arco-drawer-footer>.arco-btn {
        margin-left: 12px
    }

    .arco-drawer .arco-drawer-close-icon {
        cursor: pointer;
        z-index: 1;
        color: var(--color-text-1);
        font-size: 12px;
        position: absolute;
        top: 18px;
        right: 20px
    }

    .arco-drawer-content {
        height: 100%;
        color: var(--color-text-1);
        box-sizing: border-box;
        flex: 1;
        padding: 12px 16px;
        position: relative;
        overflow: auto
    }

    .arco-drawer-rtl {
        direction: rtl
    }

    .arco-drawer-rtl .arco-drawer-close-icon {
        right: initial;
        left: 20px
    }

    .arco-drawer-rtl .arco-drawer-footer {
        text-align: left
    }
}


@media (max-width:640px) {
    .grid-cols-1-CSYMx7 {
        grid-template-columns: repeat(1, minmax(0, 1fr));
        display: grid
    }
}


body {
    --semi-transition_duration-slowest: 0s;
    --semi-transition_duration-slower: 0s;
    --semi-transition_duration-slow: 0s;
    --semi-transition_duration-normal: 0s;
    --semi-transition_duration-fast: 0s;
    --semi-transition_duration-faster: 0s;
    --semi-transition_duration-fastest: 0s;
    --semi-transition_duration-none: 0s;
    --semi-transition_function-linear: linear;
    --semi-transition_function-ease: ease;
    --semi-transition_function-easeIn: ease-in;
    --semi-transition_function-easeOut: ease-out;
    --semi-transition_function-easeInIOut: ease-in-out;
    --semi-transition_delay-none: 0s;
    --semi-transition_delay-slowest: 0s;
    --semi-transition_delay-slower: 0s;
    --semi-transition_delay-slow: 0s;
    --semi-transition_delay-normal: 0s;
    --semi-transition_delay-fast: 0s;
    --semi-transition_delay-faster: 0s;
    --semi-transition_delay-fastest: 0s;
    --semi-transform_scale-none: scale(1, 1);
    --semi-transform_scale-small: scale(1, 1);
    --semi-transform_scale-medium: scale(1, 1);
    --semi-transform_scale-large: scale(1, 1);
    --semi-transform-rotate-none: rotate(0deg);
    --semi-transform_rotate-clockwise90deg: rotate(90deg);
    --semi-transform_rotate-clockwise180deg: rotate(180deg);
    --semi-transform_rotate-clockwise270deg: rotate(270deg);
    --semi-transform_rotate-clockwise360deg: rotate(360deg);
    --semi-transform_rotate-anticlockwise90deg: rotate(-90deg);
    --semi-transform_rotate-anticlockwise180deg: rotate(-180deg);
    --semi-transform_rotate-anticlockwise270deg: rotate(-270deg);
    --semi-transform_rotate-anticlockwise360deg: rotate(-360deg)
}

:host {
    --semi-transition_duration-slowest: 0s;
    --semi-transition_duration-slower: 0s;
    --semi-transition_duration-slow: 0s;
    --semi-transition_duration-normal: 0s;
    --semi-transition_duration-fast: 0s;
    --semi-transition_duration-faster: 0s;
    --semi-transition_duration-fastest: 0s;
    --semi-transition_duration-none: 0s;
    --semi-transition_function-linear: linear;
    --semi-transition_function-ease: ease;
    --semi-transition_function-easeIn: ease-in;
    --semi-transition_function-easeOut: ease-out;
    --semi-transition_function-easeInIOut: ease-in-out;
    --semi-transition_delay-none: 0s;
    --semi-transition_delay-slowest: 0s;
    --semi-transition_delay-slower: 0s;
    --semi-transition_delay-slow: 0s;
    --semi-transition_delay-normal: 0s;
    --semi-transition_delay-fast: 0s;
    --semi-transition_delay-faster: 0s;
    --semi-transition_delay-fastest: 0s;
    --semi-transform_scale-none: scale(1, 1);
    --semi-transform_scale-small: scale(1, 1);
    --semi-transform_scale-medium: scale(1, 1);
    --semi-transform_scale-large: scale(1, 1);
    --semi-transform-rotate-none: rotate(0deg);
    --semi-transform_rotate-clockwise90deg: rotate(90deg);
    --semi-transform_rotate-clockwise180deg: rotate(180deg);
    --semi-transform_rotate-clockwise270deg: rotate(270deg);
    --semi-transform_rotate-clockwise360deg: rotate(360deg);
    --semi-transform_rotate-anticlockwise90deg: rotate(-90deg);
    --semi-transform_rotate-anticlockwise180deg: rotate(-180deg);
    --semi-transform_rotate-anticlockwise270deg: rotate(-270deg);
    --semi-transform_rotate-anticlockwise360deg: rotate(-360deg)
}

body,
body .semi-always-light {
    --semi-amber-0: 254, 251, 235;
    --semi-amber-1: 252, 245, 206;
    --semi-amber-2: 249, 232, 158;
    --semi-amber-3: 246, 216, 111;
    --semi-amber-4: 243, 198, 65;
    --semi-amber-5: 240, 177, 20;
    --semi-amber-6: 200, 138, 15;
    --semi-amber-7: 160, 102, 10;
    --semi-amber-8: 120, 70, 6;
    --semi-amber-9: 80, 43, 3;
    --semi-black: 0, 0, 0;
    --semi-blue-0: 234, 245, 255;
    --semi-blue-1: 203, 231, 254;
    --semi-blue-2: 152, 205, 253;
    --semi-blue-3: 101, 178, 252;
    --semi-blue-4: 50, 149, 251;
    --semi-blue-5: 0, 100, 250;
    --semi-blue-6: 0, 98, 214;
    --semi-blue-7: 0, 79, 179;
    --semi-blue-8: 0, 61, 143;
    --semi-blue-9: 0, 44, 107;
    --semi-cyan-0: 229, 247, 248;
    --semi-cyan-1: 194, 239, 240;
    --semi-cyan-2: 138, 221, 226;
    --semi-cyan-3: 88, 203, 211;
    --semi-cyan-4: 44, 184, 197;
    --semi-cyan-5: 5, 164, 182;
    --semi-cyan-6: 3, 134, 152;
    --semi-cyan-7: 1, 105, 121;
    --semi-cyan-8: 0, 77, 91;
    --semi-cyan-9: 0, 50, 61;
    --semi-green-0: 236, 247, 236;
    --semi-green-1: 208, 240, 209;
    --semi-green-2: 164, 224, 167;
    --semi-green-3: 125, 209, 130;
    --semi-green-4: 90, 194, 98;
    --semi-green-5: 59, 179, 70;
    --semi-green-6: 48, 149, 59;
    --semi-green-7: 37, 119, 47;
    --semi-green-8: 27, 89, 36;
    --semi-green-9: 17, 60, 24;
    --semi-grey-0: 249, 249, 249;
    --semi-grey-1: 230, 232, 234;
    --semi-grey-2: 198, 202, 205;
    --semi-grey-3: 167, 171, 176;
    --semi-grey-4: 136, 141, 146;
    --semi-grey-5: 107, 112, 117;
    --semi-grey-6: 85, 91, 97;
    --semi-grey-7: 65, 70, 76;
    --semi-grey-8: 46, 50, 56;
    --semi-grey-9: 28, 31, 35;
    --semi-indigo-0: 236, 239, 248;
    --semi-indigo-1: 209, 216, 240;
    --semi-indigo-2: 167, 179, 225;
    --semi-indigo-3: 128, 144, 211;
    --semi-indigo-4: 94, 111, 196;
    --semi-indigo-5: 63, 81, 181;
    --semi-indigo-6: 51, 66, 161;
    --semi-indigo-7: 40, 52, 140;
    --semi-indigo-8: 31, 40, 120;
    --semi-indigo-9: 23, 29, 99;
    --semi-light-blue-0: 233, 247, 253;
    --semi-light-blue-1: 201, 236, 252;
    --semi-light-blue-2: 149, 216, 248;
    --semi-light-blue-3: 98, 195, 245;
    --semi-light-blue-4: 48, 172, 241;
    --semi-light-blue-5: 0, 149, 238;
    --semi-light-blue-6: 0, 123, 202;
    --semi-light-blue-7: 0, 99, 167;
    --semi-light-blue-8: 0, 75, 131;
    --semi-light-blue-9: 0, 53, 95;
    --semi-light-green-0: 243, 248, 236;
    --semi-light-green-1: 227, 240, 208;
    --semi-light-green-2: 200, 226, 165;
    --semi-light-green-3: 173, 211, 126;
    --semi-light-green-4: 147, 197, 91;
    --semi-light-green-5: 123, 182, 60;
    --semi-light-green-6: 100, 152, 48;
    --semi-light-green-7: 78, 121, 38;
    --semi-light-green-8: 57, 91, 27;
    --semi-light-green-9: 37, 61, 18;
    --semi-lime-0: 242, 250, 230;
    --semi-lime-1: 227, 246, 197;
    --semi-lime-2: 203, 237, 142;
    --semi-lime-3: 183, 227, 91;
    --semi-lime-4: 167, 218, 44;
    --semi-lime-5: 155, 209, 0;
    --semi-lime-6: 126, 174, 0;
    --semi-lime-7: 99, 139, 0;
    --semi-lime-8: 72, 104, 0;
    --semi-lime-9: 47, 70, 0;
    --semi-orange-0: 255, 248, 234;
    --semi-orange-1: 254, 238, 204;
    --semi-orange-2: 254, 217, 152;
    --semi-orange-3: 253, 193, 101;
    --semi-orange-4: 253, 166, 51;
    --semi-orange-5: 252, 136, 0;
    --semi-orange-6: 210, 103, 0;
    --semi-orange-7: 168, 74, 0;
    --semi-orange-8: 126, 49, 0;
    --semi-orange-9: 84, 29, 0;
    --semi-pink-0: 253, 236, 239;
    --semi-pink-1: 251, 207, 216;
    --semi-pink-2: 246, 160, 181;
    --semi-pink-3: 242, 115, 150;
    --semi-pink-4: 237, 72, 123;
    --semi-pink-5: 233, 30, 99;
    --semi-pink-6: 197, 19, 86;
    --semi-pink-7: 162, 11, 72;
    --semi-pink-8: 126, 5, 58;
    --semi-pink-9: 90, 1, 43;
    --semi-purple-0: 247, 233, 247;
    --semi-purple-1: 239, 202, 240;
    --semi-purple-2: 221, 155, 224;
    --semi-purple-3: 201, 111, 209;
    --semi-purple-4: 180, 73, 194;
    --semi-purple-5: 158, 40, 179;
    --semi-purple-6: 135, 30, 158;
    --semi-purple-7: 113, 22, 138;
    --semi-purple-8: 92, 15, 117;
    --semi-purple-9: 73, 10, 97;
    --semi-red-0: 254, 242, 237;
    --semi-red-1: 254, 221, 210;
    --semi-red-2: 253, 183, 165;
    --semi-red-3: 251, 144, 120;
    --semi-red-4: 250, 102, 76;
    --semi-red-5: 249, 57, 32;
    --semi-red-6: 213, 37, 21;
    --semi-red-7: 178, 20, 12;
    --semi-red-8: 142, 8, 5;
    --semi-red-9: 106, 1, 3;
    --semi-teal-0: 228, 247, 244;
    --semi-teal-1: 192, 240, 232;
    --semi-teal-2: 135, 224, 211;
    --semi-teal-3: 84, 209, 193;
    --semi-teal-4: 39, 194, 176;
    --semi-teal-5: 0, 179, 161;
    --semi-teal-6: 0, 149, 137;
    --semi-teal-7: 0, 119, 111;
    --semi-teal-8: 0, 89, 85;
    --semi-teal-9: 0, 60, 58;
    --semi-violet-0: 243, 237, 249;
    --semi-violet-1: 226, 209, 244;
    --semi-violet-2: 196, 167, 233;
    --semi-violet-3: 166, 127, 221;
    --semi-violet-4: 136, 91, 210;
    --semi-violet-5: 106, 58, 199;
    --semi-violet-6: 87, 47, 179;
    --semi-violet-7: 70, 37, 158;
    --semi-violet-8: 54, 28, 138;
    --semi-violet-9: 40, 20, 117;
    --semi-white: 255, 255, 255;
    --semi-yellow-0: 255, 253, 234;
    --semi-yellow-1: 254, 251, 203;
    --semi-yellow-2: 253, 243, 152;
    --semi-yellow-3: 252, 232, 101;
    --semi-yellow-4: 251, 218, 50;
    --semi-yellow-5: 250, 200, 0;
    --semi-yellow-6: 208, 170, 0;
    --semi-yellow-7: 167, 139, 0;
    --semi-yellow-8: 125, 106, 0;
    --semi-yellow-9: 83, 72, 0;
    --semi-ai-purple-0: 248, 237, 255;
    --semi-ai-purple-1: 242, 218, 255;
    --semi-ai-purple-2: 227, 181, 255;
    --semi-ai-purple-3: 209, 145, 255;
    --semi-ai-purple-4: 189, 108, 255;
    --semi-ai-purple-5: 166, 71, 255;
    --semi-ai-purple-6: 134, 54, 219;
    --semi-ai-purple-7: 105, 40, 184;
    --semi-ai-purple-8: 78, 28, 148;
    --semi-ai-purple-9: 54, 18, 112;
    --semi-ai-general-0-3: 239, 247, 255;
    --semi-ai-general-0-2: 244, 244, 255;
    --semi-ai-general-0-1: 248, 237, 255;
    --semi-ai-general-0-0: 255, 242, 255;
    --semi-ai-general-1-3: 213, 235, 255;
    --semi-ai-general-1-2: 223, 224, 255;
    --semi-ai-general-1-1: 242, 218, 255;
    --semi-ai-general-1-0: 255, 218, 254;
    --semi-ai-general-2-3: 171, 213, 255;
    --semi-ai-general-2-2: 193, 192, 255;
    --semi-ai-general-2-1: 227, 181, 255;
    --semi-ai-general-2-0: 254, 181, 255;
    --semi-ai-general-3-3: 130, 190, 255;
    --semi-ai-general-3-2: 163, 160, 255;
    --semi-ai-general-3-1: 209, 145, 255;
    --semi-ai-general-3-0: 249, 143, 255;
    --semi-ai-general-4-3: 88, 166, 255;
    --semi-ai-general-4-2: 134, 129, 255;
    --semi-ai-general-4-1: 189, 108, 255;
    --semi-ai-general-4-0: 242, 106, 255;
    --semi-ai-general-5-3: 46, 140, 255;
    --semi-ai-general-5-2: 107, 97, 255;
    --semi-ai-general-5-1: 166, 71, 255;
    --semi-ai-general-5-0: 233, 69, 255;
    --semi-ai-general-6-3: 33, 114, 219;
    --semi-ai-general-6-2: 88, 77, 219;
    --semi-ai-general-6-1: 134, 54, 219;
    --semi-ai-general-6-0: 194, 53, 219;
    --semi-ai-general-7-3: 22, 89, 184;
    --semi-ai-general-7-2: 71, 59, 184;
    --semi-ai-general-7-1: 105, 40, 184;
    --semi-ai-general-7-0: 157, 39, 184;
    --semi-ai-general-8-3: 13, 67, 148;
    --semi-ai-general-8-2: 55, 43, 148;
    --semi-ai-general-8-1: 78, 28, 148;
    --semi-ai-general-8-0: 121, 27, 148;
    --semi-ai-general-9-3: 7, 47, 112;
    --semi-ai-general-9-2: 40, 29, 112;
    --semi-ai-general-9-1: 54, 18, 112;
    --semi-ai-general-9-0: 88, 17, 112;
    --semi-ai-general-0: linear-gradient(278deg, rgba(var(--semi-ai-general-0-0))0%, rgba(var(--semi-ai-general-0-1))30%, rgba(var(--semi-ai-general-0-2))60%, rgba(var(--semi-ai-general-0-3))100%);
    --semi-ai-general-1: linear-gradient(278deg, rgba(var(--semi-ai-general-1-0))0%, rgba(var(--semi-ai-general-1-1))30%, rgba(var(--semi-ai-general-1-2))60%, rgba(var(--semi-ai-general-1-3))100%);
    --semi-ai-general-2: linear-gradient(278deg, rgba(var(--semi-ai-general-2-0))0%, rgba(var(--semi-ai-general-2-1))30%, rgba(var(--semi-ai-general-2-2))60%, rgba(var(--semi-ai-general-2-3))100%);
    --semi-ai-general-3: linear-gradient(278deg, rgba(var(--semi-ai-general-3-0))0%, rgba(var(--semi-ai-general-3-1))30%, rgba(var(--semi-ai-general-3-2))60%, rgba(var(--semi-ai-general-3-3))100%);
    --semi-ai-general-4: linear-gradient(278deg, rgba(var(--semi-ai-general-4-0))0%, rgba(var(--semi-ai-general-4-1))30%, rgba(var(--semi-ai-general-4-2))60%, rgba(var(--semi-ai-general-4-3))100%);
    --semi-ai-general-5: linear-gradient(278deg, rgba(var(--semi-ai-general-5-0))0%, rgba(var(--semi-ai-general-5-1))30%, rgba(var(--semi-ai-general-5-2))60%, rgba(var(--semi-ai-general-5-3))100%);
    --semi-ai-general-6: linear-gradient(278deg, rgba(var(--semi-ai-general-6-0))0%, rgba(var(--semi-ai-general-6-1))30%, rgba(var(--semi-ai-general-6-2))60%, rgba(var(--semi-ai-general-6-3))100%);
    --semi-ai-general-7: linear-gradient(278deg, rgba(var(--semi-ai-general-7-0))0%, rgba(var(--semi-ai-general-7-1))30%, rgba(var(--semi-ai-general-7-2))60%, rgba(var(--semi-ai-general-7-3))100%);
    --semi-ai-general-8: linear-gradient(278deg, rgba(var(--semi-ai-general-8-0))0%, rgba(var(--semi-ai-general-8-1))30%, rgba(var(--semi-ai-general-8-2))60%, rgba(var(--semi-ai-general-8-3))100%);
    --semi-ai-general-9: linear-gradient(278deg, rgba(var(--semi-ai-general-9-0))0%, rgba(var(--semi-ai-general-9-1))30%, rgba(var(--semi-ai-general-9-2))60%, rgba(var(--semi-ai-general-9-3))100%)
}

:host {
    --semi-amber-0: 254, 251, 235;
    --semi-amber-1: 252, 245, 206;
    --semi-amber-2: 249, 232, 158;
    --semi-amber-3: 246, 216, 111;
    --semi-amber-4: 243, 198, 65;
    --semi-amber-5: 240, 177, 20;
    --semi-amber-6: 200, 138, 15;
    --semi-amber-7: 160, 102, 10;
    --semi-amber-8: 120, 70, 6;
    --semi-amber-9: 80, 43, 3;
    --semi-black: 0, 0, 0;
    --semi-blue-0: 234, 245, 255;
    --semi-blue-1: 203, 231, 254;
    --semi-blue-2: 152, 205, 253;
    --semi-blue-3: 101, 178, 252;
    --semi-blue-4: 50, 149, 251;
    --semi-blue-5: 0, 100, 250;
    --semi-blue-6: 0, 98, 214;
    --semi-blue-7: 0, 79, 179;
    --semi-blue-8: 0, 61, 143;
    --semi-blue-9: 0, 44, 107;
    --semi-cyan-0: 229, 247, 248;
    --semi-cyan-1: 194, 239, 240;
    --semi-cyan-2: 138, 221, 226;
    --semi-cyan-3: 88, 203, 211;
    --semi-cyan-4: 44, 184, 197;
    --semi-cyan-5: 5, 164, 182;
    --semi-cyan-6: 3, 134, 152;
    --semi-cyan-7: 1, 105, 121;
    --semi-cyan-8: 0, 77, 91;
    --semi-cyan-9: 0, 50, 61;
    --semi-green-0: 236, 247, 236;
    --semi-green-1: 208, 240, 209;
    --semi-green-2: 164, 224, 167;
    --semi-green-3: 125, 209, 130;
    --semi-green-4: 90, 194, 98;
    --semi-green-5: 59, 179, 70;
    --semi-green-6: 48, 149, 59;
    --semi-green-7: 37, 119, 47;
    --semi-green-8: 27, 89, 36;
    --semi-green-9: 17, 60, 24;
    --semi-grey-0: 249, 249, 249;
    --semi-grey-1: 230, 232, 234;
    --semi-grey-2: 198, 202, 205;
    --semi-grey-3: 167, 171, 176;
    --semi-grey-4: 136, 141, 146;
    --semi-grey-5: 107, 112, 117;
    --semi-grey-6: 85, 91, 97;
    --semi-grey-7: 65, 70, 76;
    --semi-grey-8: 46, 50, 56;
    --semi-grey-9: 28, 31, 35;
    --semi-indigo-0: 236, 239, 248;
    --semi-indigo-1: 209, 216, 240;
    --semi-indigo-2: 167, 179, 225;
    --semi-indigo-3: 128, 144, 211;
    --semi-indigo-4: 94, 111, 196;
    --semi-indigo-5: 63, 81, 181;
    --semi-indigo-6: 51, 66, 161;
    --semi-indigo-7: 40, 52, 140;
    --semi-indigo-8: 31, 40, 120;
    --semi-indigo-9: 23, 29, 99;
    --semi-light-blue-0: 233, 247, 253;
    --semi-light-blue-1: 201, 236, 252;
    --semi-light-blue-2: 149, 216, 248;
    --semi-light-blue-3: 98, 195, 245;
    --semi-light-blue-4: 48, 172, 241;
    --semi-light-blue-5: 0, 149, 238;
    --semi-light-blue-6: 0, 123, 202;
    --semi-light-blue-7: 0, 99, 167;
    --semi-light-blue-8: 0, 75, 131;
    --semi-light-blue-9: 0, 53, 95;
    --semi-light-green-0: 243, 248, 236;
    --semi-light-green-1: 227, 240, 208;
    --semi-light-green-2: 200, 226, 165;
    --semi-light-green-3: 173, 211, 126;
    --semi-light-green-4: 147, 197, 91;
    --semi-light-green-5: 123, 182, 60;
    --semi-light-green-6: 100, 152, 48;
    --semi-light-green-7: 78, 121, 38;
    --semi-light-green-8: 57, 91, 27;
    --semi-light-green-9: 37, 61, 18;
    --semi-lime-0: 242, 250, 230;
    --semi-lime-1: 227, 246, 197;
    --semi-lime-2: 203, 237, 142;
    --semi-lime-3: 183, 227, 91;
    --semi-lime-4: 167, 218, 44;
    --semi-lime-5: 155, 209, 0;
    --semi-lime-6: 126, 174, 0;
    --semi-lime-7: 99, 139, 0;
    --semi-lime-8: 72, 104, 0;
    --semi-lime-9: 47, 70, 0;
    --semi-orange-0: 255, 248, 234;
    --semi-orange-1: 254, 238, 204;
    --semi-orange-2: 254, 217, 152;
    --semi-orange-3: 253, 193, 101;
    --semi-orange-4: 253, 166, 51;
    --semi-orange-5: 252, 136, 0;
    --semi-orange-6: 210, 103, 0;
    --semi-orange-7: 168, 74, 0;
    --semi-orange-8: 126, 49, 0;
    --semi-orange-9: 84, 29, 0;
    --semi-pink-0: 253, 236, 239;
    --semi-pink-1: 251, 207, 216;
    --semi-pink-2: 246, 160, 181;
    --semi-pink-3: 242, 115, 150;
    --semi-pink-4: 237, 72, 123;
    --semi-pink-5: 233, 30, 99;
    --semi-pink-6: 197, 19, 86;
    --semi-pink-7: 162, 11, 72;
    --semi-pink-8: 126, 5, 58;
    --semi-pink-9: 90, 1, 43;
    --semi-purple-0: 247, 233, 247;
    --semi-purple-1: 239, 202, 240;
    --semi-purple-2: 221, 155, 224;
    --semi-purple-3: 201, 111, 209;
    --semi-purple-4: 180, 73, 194;
    --semi-purple-5: 158, 40, 179;
    --semi-purple-6: 135, 30, 158;
    --semi-purple-7: 113, 22, 138;
    --semi-purple-8: 92, 15, 117;
    --semi-purple-9: 73, 10, 97;
    --semi-red-0: 254, 242, 237;
    --semi-red-1: 254, 221, 210;
    --semi-red-2: 253, 183, 165;
    --semi-red-3: 251, 144, 120;
    --semi-red-4: 250, 102, 76;
    --semi-red-5: 249, 57, 32;
    --semi-red-6: 213, 37, 21;
    --semi-red-7: 178, 20, 12;
    --semi-red-8: 142, 8, 5;
    --semi-red-9: 106, 1, 3;
    --semi-teal-0: 228, 247, 244;
    --semi-teal-1: 192, 240, 232;
    --semi-teal-2: 135, 224, 211;
    --semi-teal-3: 84, 209, 193;
    --semi-teal-4: 39, 194, 176;
    --semi-teal-5: 0, 179, 161;
    --semi-teal-6: 0, 149, 137;
    --semi-teal-7: 0, 119, 111;
    --semi-teal-8: 0, 89, 85;
    --semi-teal-9: 0, 60, 58;
    --semi-violet-0: 243, 237, 249;
    --semi-violet-1: 226, 209, 244;
    --semi-violet-2: 196, 167, 233;
    --semi-violet-3: 166, 127, 221;
    --semi-violet-4: 136, 91, 210;
    --semi-violet-5: 106, 58, 199;
    --semi-violet-6: 87, 47, 179;
    --semi-violet-7: 70, 37, 158;
    --semi-violet-8: 54, 28, 138;
    --semi-violet-9: 40, 20, 117;
    --semi-white: 255, 255, 255;
    --semi-yellow-0: 255, 253, 234;
    --semi-yellow-1: 254, 251, 203;
    --semi-yellow-2: 253, 243, 152;
    --semi-yellow-3: 252, 232, 101;
    --semi-yellow-4: 251, 218, 50;
    --semi-yellow-5: 250, 200, 0;
    --semi-yellow-6: 208, 170, 0;
    --semi-yellow-7: 167, 139, 0;
    --semi-yellow-8: 125, 106, 0;
    --semi-yellow-9: 83, 72, 0;
    --semi-ai-purple-0: 248, 237, 255;
    --semi-ai-purple-1: 242, 218, 255;
    --semi-ai-purple-2: 227, 181, 255;
    --semi-ai-purple-3: 209, 145, 255;
    --semi-ai-purple-4: 189, 108, 255;
    --semi-ai-purple-5: 166, 71, 255;
    --semi-ai-purple-6: 134, 54, 219;
    --semi-ai-purple-7: 105, 40, 184;
    --semi-ai-purple-8: 78, 28, 148;
    --semi-ai-purple-9: 54, 18, 112;
    --semi-ai-general-0-3: 239, 247, 255;
    --semi-ai-general-0-2: 244, 244, 255;
    --semi-ai-general-0-1: 248, 237, 255;
    --semi-ai-general-0-0: 255, 242, 255;
    --semi-ai-general-1-3: 213, 235, 255;
    --semi-ai-general-1-2: 223, 224, 255;
    --semi-ai-general-1-1: 242, 218, 255;
    --semi-ai-general-1-0: 255, 218, 254;
    --semi-ai-general-2-3: 171, 213, 255;
    --semi-ai-general-2-2: 193, 192, 255;
    --semi-ai-general-2-1: 227, 181, 255;
    --semi-ai-general-2-0: 254, 181, 255;
    --semi-ai-general-3-3: 130, 190, 255;
    --semi-ai-general-3-2: 163, 160, 255;
    --semi-ai-general-3-1: 209, 145, 255;
    --semi-ai-general-3-0: 249, 143, 255;
    --semi-ai-general-4-3: 88, 166, 255;
    --semi-ai-general-4-2: 134, 129, 255;
    --semi-ai-general-4-1: 189, 108, 255;
    --semi-ai-general-4-0: 242, 106, 255;
    --semi-ai-general-5-3: 46, 140, 255;
    --semi-ai-general-5-2: 107, 97, 255;
    --semi-ai-general-5-1: 166, 71, 255;
    --semi-ai-general-5-0: 233, 69, 255;
    --semi-ai-general-6-3: 33, 114, 219;
    --semi-ai-general-6-2: 88, 77, 219;
    --semi-ai-general-6-1: 134, 54, 219;
    --semi-ai-general-6-0: 194, 53, 219;
    --semi-ai-general-7-3: 22, 89, 184;
    --semi-ai-general-7-2: 71, 59, 184;
    --semi-ai-general-7-1: 105, 40, 184;
    --semi-ai-general-7-0: 157, 39, 184;
    --semi-ai-general-8-3: 13, 67, 148;
    --semi-ai-general-8-2: 55, 43, 148;
    --semi-ai-general-8-1: 78, 28, 148;
    --semi-ai-general-8-0: 121, 27, 148;
    --semi-ai-general-9-3: 7, 47, 112;
    --semi-ai-general-9-2: 40, 29, 112;
    --semi-ai-general-9-1: 54, 18, 112;
    --semi-ai-general-9-0: 88, 17, 112;
    --semi-ai-general-0: linear-gradient(278deg, rgba(var(--semi-ai-general-0-0))0%, rgba(var(--semi-ai-general-0-1))30%, rgba(var(--semi-ai-general-0-2))60%, rgba(var(--semi-ai-general-0-3))100%);
    --semi-ai-general-1: linear-gradient(278deg, rgba(var(--semi-ai-general-1-0))0%, rgba(var(--semi-ai-general-1-1))30%, rgba(var(--semi-ai-general-1-2))60%, rgba(var(--semi-ai-general-1-3))100%);
    --semi-ai-general-2: linear-gradient(278deg, rgba(var(--semi-ai-general-2-0))0%, rgba(var(--semi-ai-general-2-1))30%, rgba(var(--semi-ai-general-2-2))60%, rgba(var(--semi-ai-general-2-3))100%);
    --semi-ai-general-3: linear-gradient(278deg, rgba(var(--semi-ai-general-3-0))0%, rgba(var(--semi-ai-general-3-1))30%, rgba(var(--semi-ai-general-3-2))60%, rgba(var(--semi-ai-general-3-3))100%);
    --semi-ai-general-4: linear-gradient(278deg, rgba(var(--semi-ai-general-4-0))0%, rgba(var(--semi-ai-general-4-1))30%, rgba(var(--semi-ai-general-4-2))60%, rgba(var(--semi-ai-general-4-3))100%);
    --semi-ai-general-5: linear-gradient(278deg, rgba(var(--semi-ai-general-5-0))0%, rgba(var(--semi-ai-general-5-1))30%, rgba(var(--semi-ai-general-5-2))60%, rgba(var(--semi-ai-general-5-3))100%);
    --semi-ai-general-6: linear-gradient(278deg, rgba(var(--semi-ai-general-6-0))0%, rgba(var(--semi-ai-general-6-1))30%, rgba(var(--semi-ai-general-6-2))60%, rgba(var(--semi-ai-general-6-3))100%);
    --semi-ai-general-7: linear-gradient(278deg, rgba(var(--semi-ai-general-7-0))0%, rgba(var(--semi-ai-general-7-1))30%, rgba(var(--semi-ai-general-7-2))60%, rgba(var(--semi-ai-general-7-3))100%);
    --semi-ai-general-8: linear-gradient(278deg, rgba(var(--semi-ai-general-8-0))0%, rgba(var(--semi-ai-general-8-1))30%, rgba(var(--semi-ai-general-8-2))60%, rgba(var(--semi-ai-general-8-3))100%);
    --semi-ai-general-9: linear-gradient(278deg, rgba(var(--semi-ai-general-9-0))0%, rgba(var(--semi-ai-general-9-1))30%, rgba(var(--semi-ai-general-9-2))60%, rgba(var(--semi-ai-general-9-3))100%)
}

:host .semi-always-light {
    --semi-amber-0: 254, 251, 235;
    --semi-amber-1: 252, 245, 206;
    --semi-amber-2: 249, 232, 158;
    --semi-amber-3: 246, 216, 111;
    --semi-amber-4: 243, 198, 65;
    --semi-amber-5: 240, 177, 20;
    --semi-amber-6: 200, 138, 15;
    --semi-amber-7: 160, 102, 10;
    --semi-amber-8: 120, 70, 6;
    --semi-amber-9: 80, 43, 3;
    --semi-black: 0, 0, 0;
    --semi-blue-0: 234, 245, 255;
    --semi-blue-1: 203, 231, 254;
    --semi-blue-2: 152, 205, 253;
    --semi-blue-3: 101, 178, 252;
    --semi-blue-4: 50, 149, 251;
    --semi-blue-5: 0, 100, 250;
    --semi-blue-6: 0, 98, 214;
    --semi-blue-7: 0, 79, 179;
    --semi-blue-8: 0, 61, 143;
    --semi-blue-9: 0, 44, 107;
    --semi-cyan-0: 229, 247, 248;
    --semi-cyan-1: 194, 239, 240;
    --semi-cyan-2: 138, 221, 226;
    --semi-cyan-3: 88, 203, 211;
    --semi-cyan-4: 44, 184, 197;
    --semi-cyan-5: 5, 164, 182;
    --semi-cyan-6: 3, 134, 152;
    --semi-cyan-7: 1, 105, 121;
    --semi-cyan-8: 0, 77, 91;
    --semi-cyan-9: 0, 50, 61;
    --semi-green-0: 236, 247, 236;
    --semi-green-1: 208, 240, 209;
    --semi-green-2: 164, 224, 167;
    --semi-green-3: 125, 209, 130;
    --semi-green-4: 90, 194, 98;
    --semi-green-5: 59, 179, 70;
    --semi-green-6: 48, 149, 59;
    --semi-green-7: 37, 119, 47;
    --semi-green-8: 27, 89, 36;
    --semi-green-9: 17, 60, 24;
    --semi-grey-0: 249, 249, 249;
    --semi-grey-1: 230, 232, 234;
    --semi-grey-2: 198, 202, 205;
    --semi-grey-3: 167, 171, 176;
    --semi-grey-4: 136, 141, 146;
    --semi-grey-5: 107, 112, 117;
    --semi-grey-6: 85, 91, 97;
    --semi-grey-7: 65, 70, 76;
    --semi-grey-8: 46, 50, 56;
    --semi-grey-9: 28, 31, 35;
    --semi-indigo-0: 236, 239, 248;
    --semi-indigo-1: 209, 216, 240;
    --semi-indigo-2: 167, 179, 225;
    --semi-indigo-3: 128, 144, 211;
    --semi-indigo-4: 94, 111, 196;
    --semi-indigo-5: 63, 81, 181;
    --semi-indigo-6: 51, 66, 161;
    --semi-indigo-7: 40, 52, 140;
    --semi-indigo-8: 31, 40, 120;
    --semi-indigo-9: 23, 29, 99;
    --semi-light-blue-0: 233, 247, 253;
    --semi-light-blue-1: 201, 236, 252;
    --semi-light-blue-2: 149, 216, 248;
    --semi-light-blue-3: 98, 195, 245;
    --semi-light-blue-4: 48, 172, 241;
    --semi-light-blue-5: 0, 149, 238;
    --semi-light-blue-6: 0, 123, 202;
    --semi-light-blue-7: 0, 99, 167;
    --semi-light-blue-8: 0, 75, 131;
    --semi-light-blue-9: 0, 53, 95;
    --semi-light-green-0: 243, 248, 236;
    --semi-light-green-1: 227, 240, 208;
    --semi-light-green-2: 200, 226, 165;
    --semi-light-green-3: 173, 211, 126;
    --semi-light-green-4: 147, 197, 91;
    --semi-light-green-5: 123, 182, 60;
    --semi-light-green-6: 100, 152, 48;
    --semi-light-green-7: 78, 121, 38;
    --semi-light-green-8: 57, 91, 27;
    --semi-light-green-9: 37, 61, 18;
    --semi-lime-0: 242, 250, 230;
    --semi-lime-1: 227, 246, 197;
    --semi-lime-2: 203, 237, 142;
    --semi-lime-3: 183, 227, 91;
    --semi-lime-4: 167, 218, 44;
    --semi-lime-5: 155, 209, 0;
    --semi-lime-6: 126, 174, 0;
    --semi-lime-7: 99, 139, 0;
    --semi-lime-8: 72, 104, 0;
    --semi-lime-9: 47, 70, 0;
    --semi-orange-0: 255, 248, 234;
    --semi-orange-1: 254, 238, 204;
    --semi-orange-2: 254, 217, 152;
    --semi-orange-3: 253, 193, 101;
    --semi-orange-4: 253, 166, 51;
    --semi-orange-5: 252, 136, 0;
    --semi-orange-6: 210, 103, 0;
    --semi-orange-7: 168, 74, 0;
    --semi-orange-8: 126, 49, 0;
    --semi-orange-9: 84, 29, 0;
    --semi-pink-0: 253, 236, 239;
    --semi-pink-1: 251, 207, 216;
    --semi-pink-2: 246, 160, 181;
    --semi-pink-3: 242, 115, 150;
    --semi-pink-4: 237, 72, 123;
    --semi-pink-5: 233, 30, 99;
    --semi-pink-6: 197, 19, 86;
    --semi-pink-7: 162, 11, 72;
    --semi-pink-8: 126, 5, 58;
    --semi-pink-9: 90, 1, 43;
    --semi-purple-0: 247, 233, 247;
    --semi-purple-1: 239, 202, 240;
    --semi-purple-2: 221, 155, 224;
    --semi-purple-3: 201, 111, 209;
    --semi-purple-4: 180, 73, 194;
    --semi-purple-5: 158, 40, 179;
    --semi-purple-6: 135, 30, 158;
    --semi-purple-7: 113, 22, 138;
    --semi-purple-8: 92, 15, 117;
    --semi-purple-9: 73, 10, 97;
    --semi-red-0: 254, 242, 237;
    --semi-red-1: 254, 221, 210;
    --semi-red-2: 253, 183, 165;
    --semi-red-3: 251, 144, 120;
    --semi-red-4: 250, 102, 76;
    --semi-red-5: 249, 57, 32;
    --semi-red-6: 213, 37, 21;
    --semi-red-7: 178, 20, 12;
    --semi-red-8: 142, 8, 5;
    --semi-red-9: 106, 1, 3;
    --semi-teal-0: 228, 247, 244;
    --semi-teal-1: 192, 240, 232;
    --semi-teal-2: 135, 224, 211;
    --semi-teal-3: 84, 209, 193;
    --semi-teal-4: 39, 194, 176;
    --semi-teal-5: 0, 179, 161;
    --semi-teal-6: 0, 149, 137;
    --semi-teal-7: 0, 119, 111;
    --semi-teal-8: 0, 89, 85;
    --semi-teal-9: 0, 60, 58;
    --semi-violet-0: 243, 237, 249;
    --semi-violet-1: 226, 209, 244;
    --semi-violet-2: 196, 167, 233;
    --semi-violet-3: 166, 127, 221;
    --semi-violet-4: 136, 91, 210;
    --semi-violet-5: 106, 58, 199;
    --semi-violet-6: 87, 47, 179;
    --semi-violet-7: 70, 37, 158;
    --semi-violet-8: 54, 28, 138;
    --semi-violet-9: 40, 20, 117;
    --semi-white: 255, 255, 255;
    --semi-yellow-0: 255, 253, 234;
    --semi-yellow-1: 254, 251, 203;
    --semi-yellow-2: 253, 243, 152;
    --semi-yellow-3: 252, 232, 101;
    --semi-yellow-4: 251, 218, 50;
    --semi-yellow-5: 250, 200, 0;
    --semi-yellow-6: 208, 170, 0;
    --semi-yellow-7: 167, 139, 0;
    --semi-yellow-8: 125, 106, 0;
    --semi-yellow-9: 83, 72, 0;
    --semi-ai-purple-0: 248, 237, 255;
    --semi-ai-purple-1: 242, 218, 255;
    --semi-ai-purple-2: 227, 181, 255;
    --semi-ai-purple-3: 209, 145, 255;
    --semi-ai-purple-4: 189, 108, 255;
    --semi-ai-purple-5: 166, 71, 255;
    --semi-ai-purple-6: 134, 54, 219;
    --semi-ai-purple-7: 105, 40, 184;
    --semi-ai-purple-8: 78, 28, 148;
    --semi-ai-purple-9: 54, 18, 112;
    --semi-ai-general-0-3: 239, 247, 255;
    --semi-ai-general-0-2: 244, 244, 255;
    --semi-ai-general-0-1: 248, 237, 255;
    --semi-ai-general-0-0: 255, 242, 255;
    --semi-ai-general-1-3: 213, 235, 255;
    --semi-ai-general-1-2: 223, 224, 255;
    --semi-ai-general-1-1: 242, 218, 255;
    --semi-ai-general-1-0: 255, 218, 254;
    --semi-ai-general-2-3: 171, 213, 255;
    --semi-ai-general-2-2: 193, 192, 255;
    --semi-ai-general-2-1: 227, 181, 255;
    --semi-ai-general-2-0: 254, 181, 255;
    --semi-ai-general-3-3: 130, 190, 255;
    --semi-ai-general-3-2: 163, 160, 255;
    --semi-ai-general-3-1: 209, 145, 255;
    --semi-ai-general-3-0: 249, 143, 255;
    --semi-ai-general-4-3: 88, 166, 255;
    --semi-ai-general-4-2: 134, 129, 255;
    --semi-ai-general-4-1: 189, 108, 255;
    --semi-ai-general-4-0: 242, 106, 255;
    --semi-ai-general-5-3: 46, 140, 255;
    --semi-ai-general-5-2: 107, 97, 255;
    --semi-ai-general-5-1: 166, 71, 255;
    --semi-ai-general-5-0: 233, 69, 255;
    --semi-ai-general-6-3: 33, 114, 219;
    --semi-ai-general-6-2: 88, 77, 219;
    --semi-ai-general-6-1: 134, 54, 219;
    --semi-ai-general-6-0: 194, 53, 219;
    --semi-ai-general-7-3: 22, 89, 184;
    --semi-ai-general-7-2: 71, 59, 184;
    --semi-ai-general-7-1: 105, 40, 184;
    --semi-ai-general-7-0: 157, 39, 184;
    --semi-ai-general-8-3: 13, 67, 148;
    --semi-ai-general-8-2: 55, 43, 148;
    --semi-ai-general-8-1: 78, 28, 148;
    --semi-ai-general-8-0: 121, 27, 148;
    --semi-ai-general-9-3: 7, 47, 112;
    --semi-ai-general-9-2: 40, 29, 112;
    --semi-ai-general-9-1: 54, 18, 112;
    --semi-ai-general-9-0: 88, 17, 112;
    --semi-ai-general-0: linear-gradient(278deg, rgba(var(--semi-ai-general-0-0))0%, rgba(var(--semi-ai-general-0-1))30%, rgba(var(--semi-ai-general-0-2))60%, rgba(var(--semi-ai-general-0-3))100%);
    --semi-ai-general-1: linear-gradient(278deg, rgba(var(--semi-ai-general-1-0))0%, rgba(var(--semi-ai-general-1-1))30%, rgba(var(--semi-ai-general-1-2))60%, rgba(var(--semi-ai-general-1-3))100%);
    --semi-ai-general-2: linear-gradient(278deg, rgba(var(--semi-ai-general-2-0))0%, rgba(var(--semi-ai-general-2-1))30%, rgba(var(--semi-ai-general-2-2))60%, rgba(var(--semi-ai-general-2-3))100%);
    --semi-ai-general-3: linear-gradient(278deg, rgba(var(--semi-ai-general-3-0))0%, rgba(var(--semi-ai-general-3-1))30%, rgba(var(--semi-ai-general-3-2))60%, rgba(var(--semi-ai-general-3-3))100%);
    --semi-ai-general-4: linear-gradient(278deg, rgba(var(--semi-ai-general-4-0))0%, rgba(var(--semi-ai-general-4-1))30%, rgba(var(--semi-ai-general-4-2))60%, rgba(var(--semi-ai-general-4-3))100%);
    --semi-ai-general-5: linear-gradient(278deg, rgba(var(--semi-ai-general-5-0))0%, rgba(var(--semi-ai-general-5-1))30%, rgba(var(--semi-ai-general-5-2))60%, rgba(var(--semi-ai-general-5-3))100%);
    --semi-ai-general-6: linear-gradient(278deg, rgba(var(--semi-ai-general-6-0))0%, rgba(var(--semi-ai-general-6-1))30%, rgba(var(--semi-ai-general-6-2))60%, rgba(var(--semi-ai-general-6-3))100%);
    --semi-ai-general-7: linear-gradient(278deg, rgba(var(--semi-ai-general-7-0))0%, rgba(var(--semi-ai-general-7-1))30%, rgba(var(--semi-ai-general-7-2))60%, rgba(var(--semi-ai-general-7-3))100%);
    --semi-ai-general-8: linear-gradient(278deg, rgba(var(--semi-ai-general-8-0))0%, rgba(var(--semi-ai-general-8-1))30%, rgba(var(--semi-ai-general-8-2))60%, rgba(var(--semi-ai-general-8-3))100%);
    --semi-ai-general-9: linear-gradient(278deg, rgba(var(--semi-ai-general-9-0))0%, rgba(var(--semi-ai-general-9-1))30%, rgba(var(--semi-ai-general-9-2))60%, rgba(var(--semi-ai-general-9-3))100%)
}

body[theme-mode=dark],
body .semi-always-dark {
    --semi-red-0: 108, 9, 11;
    --semi-red-1: 144, 17, 16;
    --semi-red-2: 180, 32, 25;
    --semi-red-3: 215, 51, 36;
    --semi-red-4: 251, 73, 50;
    --semi-red-5: 252, 114, 90;
    --semi-red-6: 253, 153, 131;
    --semi-red-7: 253, 190, 172;
    --semi-red-8: 254, 224, 213;
    --semi-red-9: 255, 243, 239;
    --semi-pink-0: 92, 7, 48;
    --semi-pink-1: 128, 14, 65;
    --semi-pink-2: 164, 23, 81;
    --semi-pink-3: 199, 34, 97;
    --semi-pink-4: 235, 47, 113;
    --semi-pink-5: 239, 86, 134;
    --semi-pink-6: 243, 126, 159;
    --semi-pink-7: 247, 168, 188;
    --semi-pink-8: 251, 211, 220;
    --semi-pink-9: 253, 238, 241;
    --semi-purple-0: 74, 16, 97;
    --semi-purple-1: 94, 23, 118;
    --semi-purple-2: 115, 31, 138;
    --semi-purple-3: 137, 40, 159;
    --semi-purple-4: 160, 51, 179;
    --semi-purple-5: 181, 83, 194;
    --semi-purple-6: 202, 120, 209;
    --semi-purple-7: 221, 160, 225;
    --semi-purple-8: 239, 206, 240;
    --semi-purple-9: 247, 235, 247;
    --semi-violet-0: 64, 27, 119;
    --semi-violet-1: 76, 36, 140;
    --semi-violet-2: 88, 46, 160;
    --semi-violet-3: 100, 57, 181;
    --semi-violet-4: 114, 70, 201;
    --semi-violet-5: 136, 101, 212;
    --semi-violet-6: 162, 136, 223;
    --semi-violet-7: 190, 173, 233;
    --semi-violet-8: 221, 212, 244;
    --semi-violet-9: 241, 238, 250;
    --semi-indigo-0: 23, 30, 101;
    --semi-indigo-1: 32, 41, 122;
    --semi-indigo-2: 41, 54, 142;
    --semi-indigo-3: 52, 68, 163;
    --semi-indigo-4: 64, 83, 183;
    --semi-indigo-5: 95, 113, 197;
    --semi-indigo-6: 129, 145, 212;
    --semi-indigo-7: 167, 180, 226;
    --semi-indigo-8: 209, 216, 241;
    --semi-indigo-9: 237, 239, 248;
    --semi-blue-0: 5, 49, 112;
    --semi-blue-1: 10, 70, 148;
    --semi-blue-2: 19, 92, 184;
    --semi-blue-3: 29, 117, 219;
    --semi-blue-4: 41, 144, 255;
    --semi-blue-5: 84, 169, 255;
    --semi-blue-6: 127, 193, 255;
    --semi-blue-7: 169, 215, 255;
    --semi-blue-8: 212, 236, 255;
    --semi-blue-9: 239, 248, 255;
    --semi-light-blue-0: 0, 55, 97;
    --semi-light-blue-1: 0, 77, 133;
    --semi-light-blue-2: 3, 102, 169;
    --semi-light-blue-3: 10, 129, 204;
    --semi-light-blue-4: 19, 159, 240;
    --semi-light-blue-5: 64, 180, 243;
    --semi-light-blue-6: 110, 200, 246;
    --semi-light-blue-7: 157, 220, 249;
    --semi-light-blue-8: 206, 238, 252;
    --semi-light-blue-9: 235, 248, 254;
    --semi-cyan-0: 4, 52, 61;
    --semi-cyan-1: 7, 79, 92;
    --semi-cyan-2: 10, 108, 123;
    --semi-cyan-3: 14, 137, 153;
    --semi-cyan-4: 19, 168, 184;
    --semi-cyan-5: 56, 187, 198;
    --semi-cyan-6: 98, 205, 212;
    --semi-cyan-7: 145, 223, 227;
    --semi-cyan-8: 198, 239, 241;
    --semi-cyan-9: 231, 247, 248;
    --semi-teal-0: 2, 60, 57;
    --semi-teal-1: 4, 90, 85;
    --semi-teal-2: 7, 119, 111;
    --semi-teal-3: 10, 149, 136;
    --semi-teal-4: 14, 179, 161;
    --semi-teal-5: 51, 194, 176;
    --semi-teal-6: 94, 209, 193;
    --semi-teal-7: 142, 225, 211;
    --semi-teal-8: 196, 240, 232;
    --semi-teal-9: 230, 247, 244;
    --semi-green-0: 18, 60, 25;
    --semi-green-1: 28, 90, 37;
    --semi-green-2: 39, 119, 49;
    --semi-green-3: 50, 149, 61;
    --semi-green-4: 62, 179, 73;
    --semi-green-5: 93, 194, 100;
    --semi-green-6: 127, 209, 132;
    --semi-green-7: 166, 225, 168;
    --semi-green-8: 208, 240, 209;
    --semi-green-9: 236, 247, 236;
    --semi-light-green-0: 38, 61, 19;
    --semi-light-green-1: 59, 92, 29;
    --semi-light-green-2: 81, 123, 40;
    --semi-light-green-3: 103, 153, 52;
    --semi-light-green-4: 127, 184, 64;
    --semi-light-green-5: 151, 198, 95;
    --semi-light-green-6: 176, 212, 129;
    --semi-light-green-7: 201, 227, 167;
    --semi-light-green-8: 228, 241, 209;
    --semi-light-green-9: 243, 248, 237;
    --semi-lime-0: 49, 70, 3;
    --semi-lime-1: 75, 105, 5;
    --semi-lime-2: 103, 141, 9;
    --semi-lime-3: 132, 176, 12;
    --semi-lime-4: 162, 211, 17;
    --semi-lime-5: 174, 220, 58;
    --semi-lime-6: 189, 229, 102;
    --semi-lime-7: 207, 237, 150;
    --semi-lime-8: 229, 246, 201;
    --semi-lime-9: 243, 251, 233;
    --semi-yellow-0: 84, 73, 3;
    --semi-yellow-1: 126, 108, 6;
    --semi-yellow-2: 168, 142, 10;
    --semi-yellow-3: 210, 175, 15;
    --semi-yellow-4: 252, 206, 20;
    --semi-yellow-5: 253, 222, 67;
    --semi-yellow-6: 253, 235, 113;
    --semi-yellow-7: 254, 245, 160;
    --semi-yellow-8: 254, 251, 208;
    --semi-yellow-9: 255, 254, 236;
    --semi-amber-0: 81, 46, 9;
    --semi-amber-1: 121, 75, 15;
    --semi-amber-2: 161, 107, 22;
    --semi-amber-3: 202, 143, 30;
    --semi-amber-4: 242, 183, 38;
    --semi-amber-5: 245, 202, 80;
    --semi-amber-6: 247, 219, 122;
    --semi-amber-7: 250, 234, 166;
    --semi-amber-8: 252, 246, 210;
    --semi-amber-9: 254, 251, 237;
    --semi-orange-0: 85, 31, 3;
    --semi-orange-1: 128, 53, 6;
    --semi-orange-2: 170, 80, 10;
    --semi-orange-3: 213, 111, 15;
    --semi-orange-4: 255, 146, 20;
    --semi-orange-5: 255, 174, 67;
    --semi-orange-6: 255, 199, 114;
    --semi-orange-7: 255, 221, 161;
    --semi-orange-8: 255, 239, 208;
    --semi-orange-9: 255, 249, 237;
    --semi-grey-0: 28, 31, 35;
    --semi-grey-1: 46, 50, 56;
    --semi-grey-2: 65, 70, 76;
    --semi-grey-3: 85, 91, 97;
    --semi-grey-4: 107, 112, 117;
    --semi-grey-5: 136, 141, 146;
    --semi-grey-6: 167, 171, 176;
    --semi-grey-7: 198, 202, 205;
    --semi-grey-8: 230, 232, 234;
    --semi-grey-9: 249, 249, 249;
    --semi-white: 255, 255, 255;
    --semi-black: 0, 0, 0;
    --semi-ai-purple-0: 58, 23, 112;
    --semi-ai-purple-1: 83, 35, 148;
    --semi-ai-purple-2: 111, 49, 184;
    --semi-ai-purple-3: 141, 65, 219;
    --semi-ai-purple-4: 167, 68, 255;
    --semi-ai-purple-5: 195, 117, 255;
    --semi-ai-purple-6: 213, 152, 255;
    --semi-ai-purple-7: 229, 186, 255;
    --semi-ai-purple-8: 243, 221, 255;
    --semi-ai-purple-9: 251, 243, 255;
    --semi-ai-general-0-0: 9, 44, 100;
    --semi-ai-general-0-1: 39, 29, 108;
    --semi-ai-general-0-2: 58, 23, 112;
    --semi-ai-general-0-3: 80, 18, 101;
    --semi-ai-general-1-0: 17, 64, 136;
    --semi-ai-general-1-1: 54, 43, 144;
    --semi-ai-general-1-2: 83, 35, 148;
    --semi-ai-general-1-3: 113, 28, 137;
    --semi-ai-general-2-0: 26, 86, 172;
    --semi-ai-general-2-1: 70, 59, 180;
    --semi-ai-general-2-2: 111, 49, 184;
    --semi-ai-general-2-3: 148, 41, 173;
    --semi-ai-general-3-0: 38, 111, 207;
    --semi-ai-general-3-1: 88, 78, 215;
    --semi-ai-general-3-2: 141, 65, 219;
    --semi-ai-general-3-3: 185, 55, 208;
    --semi-ai-general-4-0: 35, 127, 240;
    --semi-ai-general-4-1: 94, 84, 248;
    --semi-ai-general-4-2: 167, 68, 255;
    --semi-ai-general-4-3: 219, 56, 241;
    --semi-ai-general-5-0: 91, 162, 245;
    --semi-ai-general-5-1: 134, 129, 252;
    --semi-ai-general-5-2: 195, 117, 255;
    --semi-ai-general-5-3: 234, 107, 246;
    --semi-ai-general-6-0: 131, 187, 248;
    --semi-ai-general-6-1: 163, 160, 253;
    --semi-ai-general-6-2: 213, 152, 255;
    --semi-ai-general-6-3: 243, 143, 248;
    --semi-ai-general-7-0: 172, 210, 250;
    --semi-ai-general-7-1: 192, 192, 253;
    --semi-ai-general-7-2: 229, 186, 255;
    --semi-ai-general-7-3: 249, 180, 251;
    --semi-ai-general-8-0: 213, 233, 253;
    --semi-ai-general-8-1: 223, 223, 254;
    --semi-ai-general-8-2: 243, 221, 255;
    --semi-ai-general-8-3: 253, 217, 252;
    --semi-ai-general-9-0: 239, 247, 254;
    --semi-ai-general-9-1: 244, 244, 255;
    --semi-ai-general-9-2: 251, 243, 255;
    --semi-ai-general-9-3: 254, 241, 254;
    --semi-ai-general-0: linear-gradient(278deg, rgba(var(--semi-ai-general-0-0))0%, rgba(var(--semi-ai-general-0-1))30%, rgba(var(--semi-ai-general-0-2))60%, rgba(var(--semi-ai-general-0-3))100%);
    --semi-ai-general-1: linear-gradient(278deg, rgba(var(--semi-ai-general-1-0))0%, rgba(var(--semi-ai-general-1-1))30%, rgba(var(--semi-ai-general-1-2))60%, rgba(var(--semi-ai-general-1-3))100%);
    --semi-ai-general-2: linear-gradient(278deg, rgba(var(--semi-ai-general-2-0))0%, rgba(var(--semi-ai-general-2-1))30%, rgba(var(--semi-ai-general-2-2))60%, rgba(var(--semi-ai-general-2-3))100%);
    --semi-ai-general-3: linear-gradient(278deg, rgba(var(--semi-ai-general-3-0))0%, rgba(var(--semi-ai-general-3-1))30%, rgba(var(--semi-ai-general-3-2))60%, rgba(var(--semi-ai-general-3-3))100%);
    --semi-ai-general-4: linear-gradient(278deg, rgba(var(--semi-ai-general-4-0))0%, rgba(var(--semi-ai-general-4-1))30%, rgba(var(--semi-ai-general-4-2))60%, rgba(var(--semi-ai-general-4-3))100%);
    --semi-ai-general-5: linear-gradient(278deg, rgba(var(--semi-ai-general-5-0))0%, rgba(var(--semi-ai-general-5-1))30%, rgba(var(--semi-ai-general-5-2))60%, rgba(var(--semi-ai-general-5-3))100%);
    --semi-ai-general-6: linear-gradient(278deg, rgba(var(--semi-ai-general-6-0))0%, rgba(var(--semi-ai-general-6-1))30%, rgba(var(--semi-ai-general-6-2))60%, rgba(var(--semi-ai-general-6-3))100%);
    --semi-ai-general-7: linear-gradient(278deg, rgba(var(--semi-ai-general-7-0))0%, rgba(var(--semi-ai-general-7-1))30%, rgba(var(--semi-ai-general-7-2))60%, rgba(var(--semi-ai-general-7-3))100%);
    --semi-ai-general-8: linear-gradient(278deg, rgba(var(--semi-ai-general-8-0))0%, rgba(var(--semi-ai-general-8-1))30%, rgba(var(--semi-ai-general-8-2))60%, rgba(var(--semi-ai-general-8-3))100%);
    --semi-ai-general-9: linear-gradient(278deg, rgba(var(--semi-ai-general-9-0))0%, rgba(var(--semi-ai-general-9-1))30%, rgba(var(--semi-ai-general-9-2))60%, rgba(var(--semi-ai-general-9-3))100%)
}

:host([theme-mode=dark]) {
    --semi-red-0: 108, 9, 11;
    --semi-red-1: 144, 17, 16;
    --semi-red-2: 180, 32, 25;
    --semi-red-3: 215, 51, 36;
    --semi-red-4: 251, 73, 50;
    --semi-red-5: 252, 114, 90;
    --semi-red-6: 253, 153, 131;
    --semi-red-7: 253, 190, 172;
    --semi-red-8: 254, 224, 213;
    --semi-red-9: 255, 243, 239;
    --semi-pink-0: 92, 7, 48;
    --semi-pink-1: 128, 14, 65;
    --semi-pink-2: 164, 23, 81;
    --semi-pink-3: 199, 34, 97;
    --semi-pink-4: 235, 47, 113;
    --semi-pink-5: 239, 86, 134;
    --semi-pink-6: 243, 126, 159;
    --semi-pink-7: 247, 168, 188;
    --semi-pink-8: 251, 211, 220;
    --semi-pink-9: 253, 238, 241;
    --semi-purple-0: 74, 16, 97;
    --semi-purple-1: 94, 23, 118;
    --semi-purple-2: 115, 31, 138;
    --semi-purple-3: 137, 40, 159;
    --semi-purple-4: 160, 51, 179;
    --semi-purple-5: 181, 83, 194;
    --semi-purple-6: 202, 120, 209;
    --semi-purple-7: 221, 160, 225;
    --semi-purple-8: 239, 206, 240;
    --semi-purple-9: 247, 235, 247;
    --semi-violet-0: 64, 27, 119;
    --semi-violet-1: 76, 36, 140;
    --semi-violet-2: 88, 46, 160;
    --semi-violet-3: 100, 57, 181;
    --semi-violet-4: 114, 70, 201;
    --semi-violet-5: 136, 101, 212;
    --semi-violet-6: 162, 136, 223;
    --semi-violet-7: 190, 173, 233;
    --semi-violet-8: 221, 212, 244;
    --semi-violet-9: 241, 238, 250;
    --semi-indigo-0: 23, 30, 101;
    --semi-indigo-1: 32, 41, 122;
    --semi-indigo-2: 41, 54, 142;
    --semi-indigo-3: 52, 68, 163;
    --semi-indigo-4: 64, 83, 183;
    --semi-indigo-5: 95, 113, 197;
    --semi-indigo-6: 129, 145, 212;
    --semi-indigo-7: 167, 180, 226;
    --semi-indigo-8: 209, 216, 241;
    --semi-indigo-9: 237, 239, 248;
    --semi-blue-0: 5, 49, 112;
    --semi-blue-1: 10, 70, 148;
    --semi-blue-2: 19, 92, 184;
    --semi-blue-3: 29, 117, 219;
    --semi-blue-4: 41, 144, 255;
    --semi-blue-5: 84, 169, 255;
    --semi-blue-6: 127, 193, 255;
    --semi-blue-7: 169, 215, 255;
    --semi-blue-8: 212, 236, 255;
    --semi-blue-9: 239, 248, 255;
    --semi-light-blue-0: 0, 55, 97;
    --semi-light-blue-1: 0, 77, 133;
    --semi-light-blue-2: 3, 102, 169;
    --semi-light-blue-3: 10, 129, 204;
    --semi-light-blue-4: 19, 159, 240;
    --semi-light-blue-5: 64, 180, 243;
    --semi-light-blue-6: 110, 200, 246;
    --semi-light-blue-7: 157, 220, 249;
    --semi-light-blue-8: 206, 238, 252;
    --semi-light-blue-9: 235, 248, 254;
    --semi-cyan-0: 4, 52, 61;
    --semi-cyan-1: 7, 79, 92;
    --semi-cyan-2: 10, 108, 123;
    --semi-cyan-3: 14, 137, 153;
    --semi-cyan-4: 19, 168, 184;
    --semi-cyan-5: 56, 187, 198;
    --semi-cyan-6: 98, 205, 212;
    --semi-cyan-7: 145, 223, 227;
    --semi-cyan-8: 198, 239, 241;
    --semi-cyan-9: 231, 247, 248;
    --semi-teal-0: 2, 60, 57;
    --semi-teal-1: 4, 90, 85;
    --semi-teal-2: 7, 119, 111;
    --semi-teal-3: 10, 149, 136;
    --semi-teal-4: 14, 179, 161;
    --semi-teal-5: 51, 194, 176;
    --semi-teal-6: 94, 209, 193;
    --semi-teal-7: 142, 225, 211;
    --semi-teal-8: 196, 240, 232;
    --semi-teal-9: 230, 247, 244;
    --semi-green-0: 18, 60, 25;
    --semi-green-1: 28, 90, 37;
    --semi-green-2: 39, 119, 49;
    --semi-green-3: 50, 149, 61;
    --semi-green-4: 62, 179, 73;
    --semi-green-5: 93, 194, 100;
    --semi-green-6: 127, 209, 132;
    --semi-green-7: 166, 225, 168;
    --semi-green-8: 208, 240, 209;
    --semi-green-9: 236, 247, 236;
    --semi-light-green-0: 38, 61, 19;
    --semi-light-green-1: 59, 92, 29;
    --semi-light-green-2: 81, 123, 40;
    --semi-light-green-3: 103, 153, 52;
    --semi-light-green-4: 127, 184, 64;
    --semi-light-green-5: 151, 198, 95;
    --semi-light-green-6: 176, 212, 129;
    --semi-light-green-7: 201, 227, 167;
    --semi-light-green-8: 228, 241, 209;
    --semi-light-green-9: 243, 248, 237;
    --semi-lime-0: 49, 70, 3;
    --semi-lime-1: 75, 105, 5;
    --semi-lime-2: 103, 141, 9;
    --semi-lime-3: 132, 176, 12;
    --semi-lime-4: 162, 211, 17;
    --semi-lime-5: 174, 220, 58;
    --semi-lime-6: 189, 229, 102;
    --semi-lime-7: 207, 237, 150;
    --semi-lime-8: 229, 246, 201;
    --semi-lime-9: 243, 251, 233;
    --semi-yellow-0: 84, 73, 3;
    --semi-yellow-1: 126, 108, 6;
    --semi-yellow-2: 168, 142, 10;
    --semi-yellow-3: 210, 175, 15;
    --semi-yellow-4: 252, 206, 20;
    --semi-yellow-5: 253, 222, 67;
    --semi-yellow-6: 253, 235, 113;
    --semi-yellow-7: 254, 245, 160;
    --semi-yellow-8: 254, 251, 208;
    --semi-yellow-9: 255, 254, 236;
    --semi-amber-0: 81, 46, 9;
    --semi-amber-1: 121, 75, 15;
    --semi-amber-2: 161, 107, 22;
    --semi-amber-3: 202, 143, 30;
    --semi-amber-4: 242, 183, 38;
    --semi-amber-5: 245, 202, 80;
    --semi-amber-6: 247, 219, 122;
    --semi-amber-7: 250, 234, 166;
    --semi-amber-8: 252, 246, 210;
    --semi-amber-9: 254, 251, 237;
    --semi-orange-0: 85, 31, 3;
    --semi-orange-1: 128, 53, 6;
    --semi-orange-2: 170, 80, 10;
    --semi-orange-3: 213, 111, 15;
    --semi-orange-4: 255, 146, 20;
    --semi-orange-5: 255, 174, 67;
    --semi-orange-6: 255, 199, 114;
    --semi-orange-7: 255, 221, 161;
    --semi-orange-8: 255, 239, 208;
    --semi-orange-9: 255, 249, 237;
    --semi-grey-0: 28, 31, 35;
    --semi-grey-1: 46, 50, 56;
    --semi-grey-2: 65, 70, 76;
    --semi-grey-3: 85, 91, 97;
    --semi-grey-4: 107, 112, 117;
    --semi-grey-5: 136, 141, 146;
    --semi-grey-6: 167, 171, 176;
    --semi-grey-7: 198, 202, 205;
    --semi-grey-8: 230, 232, 234;
    --semi-grey-9: 249, 249, 249;
    --semi-white: 255, 255, 255;
    --semi-black: 0, 0, 0;
    --semi-ai-purple-0: 58, 23, 112;
    --semi-ai-purple-1: 83, 35, 148;
    --semi-ai-purple-2: 111, 49, 184;
    --semi-ai-purple-3: 141, 65, 219;
    --semi-ai-purple-4: 167, 68, 255;
    --semi-ai-purple-5: 195, 117, 255;
    --semi-ai-purple-6: 213, 152, 255;
    --semi-ai-purple-7: 229, 186, 255;
    --semi-ai-purple-8: 243, 221, 255;
    --semi-ai-purple-9: 251, 243, 255;
    --semi-ai-general-0-0: 9, 44, 100;
    --semi-ai-general-0-1: 39, 29, 108;
    --semi-ai-general-0-2: 58, 23, 112;
    --semi-ai-general-0-3: 80, 18, 101;
    --semi-ai-general-1-0: 17, 64, 136;
    --semi-ai-general-1-1: 54, 43, 144;
    --semi-ai-general-1-2: 83, 35, 148;
    --semi-ai-general-1-3: 113, 28, 137;
    --semi-ai-general-2-0: 26, 86, 172;
    --semi-ai-general-2-1: 70, 59, 180;
    --semi-ai-general-2-2: 111, 49, 184;
    --semi-ai-general-2-3: 148, 41, 173;
    --semi-ai-general-3-0: 38, 111, 207;
    --semi-ai-general-3-1: 88, 78, 215;
    --semi-ai-general-3-2: 141, 65, 219;
    --semi-ai-general-3-3: 185, 55, 208;
    --semi-ai-general-4-0: 35, 127, 240;
    --semi-ai-general-4-1: 94, 84, 248;
    --semi-ai-general-4-2: 167, 68, 255;
    --semi-ai-general-4-3: 219, 56, 241;
    --semi-ai-general-5-0: 91, 162, 245;
    --semi-ai-general-5-1: 134, 129, 252;
    --semi-ai-general-5-2: 195, 117, 255;
    --semi-ai-general-5-3: 234, 107, 246;
    --semi-ai-general-6-0: 131, 187, 248;
    --semi-ai-general-6-1: 163, 160, 253;
    --semi-ai-general-6-2: 213, 152, 255;
    --semi-ai-general-6-3: 243, 143, 248;
    --semi-ai-general-7-0: 172, 210, 250;
    --semi-ai-general-7-1: 192, 192, 253;
    --semi-ai-general-7-2: 229, 186, 255;
    --semi-ai-general-7-3: 249, 180, 251;
    --semi-ai-general-8-0: 213, 233, 253;
    --semi-ai-general-8-1: 223, 223, 254;
    --semi-ai-general-8-2: 243, 221, 255;
    --semi-ai-general-8-3: 253, 217, 252;
    --semi-ai-general-9-0: 239, 247, 254;
    --semi-ai-general-9-1: 244, 244, 255;
    --semi-ai-general-9-2: 251, 243, 255;
    --semi-ai-general-9-3: 254, 241, 254;
    --semi-ai-general-0: linear-gradient(278deg, rgba(var(--semi-ai-general-0-0))0%, rgba(var(--semi-ai-general-0-1))30%, rgba(var(--semi-ai-general-0-2))60%, rgba(var(--semi-ai-general-0-3))100%);
    --semi-ai-general-1: linear-gradient(278deg, rgba(var(--semi-ai-general-1-0))0%, rgba(var(--semi-ai-general-1-1))30%, rgba(var(--semi-ai-general-1-2))60%, rgba(var(--semi-ai-general-1-3))100%);
    --semi-ai-general-2: linear-gradient(278deg, rgba(var(--semi-ai-general-2-0))0%, rgba(var(--semi-ai-general-2-1))30%, rgba(var(--semi-ai-general-2-2))60%, rgba(var(--semi-ai-general-2-3))100%);
    --semi-ai-general-3: linear-gradient(278deg, rgba(var(--semi-ai-general-3-0))0%, rgba(var(--semi-ai-general-3-1))30%, rgba(var(--semi-ai-general-3-2))60%, rgba(var(--semi-ai-general-3-3))100%);
    --semi-ai-general-4: linear-gradient(278deg, rgba(var(--semi-ai-general-4-0))0%, rgba(var(--semi-ai-general-4-1))30%, rgba(var(--semi-ai-general-4-2))60%, rgba(var(--semi-ai-general-4-3))100%);
    --semi-ai-general-5: linear-gradient(278deg, rgba(var(--semi-ai-general-5-0))0%, rgba(var(--semi-ai-general-5-1))30%, rgba(var(--semi-ai-general-5-2))60%, rgba(var(--semi-ai-general-5-3))100%);
    --semi-ai-general-6: linear-gradient(278deg, rgba(var(--semi-ai-general-6-0))0%, rgba(var(--semi-ai-general-6-1))30%, rgba(var(--semi-ai-general-6-2))60%, rgba(var(--semi-ai-general-6-3))100%);
    --semi-ai-general-7: linear-gradient(278deg, rgba(var(--semi-ai-general-7-0))0%, rgba(var(--semi-ai-general-7-1))30%, rgba(var(--semi-ai-general-7-2))60%, rgba(var(--semi-ai-general-7-3))100%);
    --semi-ai-general-8: linear-gradient(278deg, rgba(var(--semi-ai-general-8-0))0%, rgba(var(--semi-ai-general-8-1))30%, rgba(var(--semi-ai-general-8-2))60%, rgba(var(--semi-ai-general-8-3))100%);
    --semi-ai-general-9: linear-gradient(278deg, rgba(var(--semi-ai-general-9-0))0%, rgba(var(--semi-ai-general-9-1))30%, rgba(var(--semi-ai-general-9-2))60%, rgba(var(--semi-ai-general-9-3))100%)
}

:host .semi-always-dark {
    --semi-red-0: 108, 9, 11;
    --semi-red-1: 144, 17, 16;
    --semi-red-2: 180, 32, 25;
    --semi-red-3: 215, 51, 36;
    --semi-red-4: 251, 73, 50;
    --semi-red-5: 252, 114, 90;
    --semi-red-6: 253, 153, 131;
    --semi-red-7: 253, 190, 172;
    --semi-red-8: 254, 224, 213;
    --semi-red-9: 255, 243, 239;
    --semi-pink-0: 92, 7, 48;
    --semi-pink-1: 128, 14, 65;
    --semi-pink-2: 164, 23, 81;
    --semi-pink-3: 199, 34, 97;
    --semi-pink-4: 235, 47, 113;
    --semi-pink-5: 239, 86, 134;
    --semi-pink-6: 243, 126, 159;
    --semi-pink-7: 247, 168, 188;
    --semi-pink-8: 251, 211, 220;
    --semi-pink-9: 253, 238, 241;
    --semi-purple-0: 74, 16, 97;
    --semi-purple-1: 94, 23, 118;
    --semi-purple-2: 115, 31, 138;
    --semi-purple-3: 137, 40, 159;
    --semi-purple-4: 160, 51, 179;
    --semi-purple-5: 181, 83, 194;
    --semi-purple-6: 202, 120, 209;
    --semi-purple-7: 221, 160, 225;
    --semi-purple-8: 239, 206, 240;
    --semi-purple-9: 247, 235, 247;
    --semi-violet-0: 64, 27, 119;
    --semi-violet-1: 76, 36, 140;
    --semi-violet-2: 88, 46, 160;
    --semi-violet-3: 100, 57, 181;
    --semi-violet-4: 114, 70, 201;
    --semi-violet-5: 136, 101, 212;
    --semi-violet-6: 162, 136, 223;
    --semi-violet-7: 190, 173, 233;
    --semi-violet-8: 221, 212, 244;
    --semi-violet-9: 241, 238, 250;
    --semi-indigo-0: 23, 30, 101;
    --semi-indigo-1: 32, 41, 122;
    --semi-indigo-2: 41, 54, 142;
    --semi-indigo-3: 52, 68, 163;
    --semi-indigo-4: 64, 83, 183;
    --semi-indigo-5: 95, 113, 197;
    --semi-indigo-6: 129, 145, 212;
    --semi-indigo-7: 167, 180, 226;
    --semi-indigo-8: 209, 216, 241;
    --semi-indigo-9: 237, 239, 248;
    --semi-blue-0: 5, 49, 112;
    --semi-blue-1: 10, 70, 148;
    --semi-blue-2: 19, 92, 184;
    --semi-blue-3: 29, 117, 219;
    --semi-blue-4: 41, 144, 255;
    --semi-blue-5: 84, 169, 255;
    --semi-blue-6: 127, 193, 255;
    --semi-blue-7: 169, 215, 255;
    --semi-blue-8: 212, 236, 255;
    --semi-blue-9: 239, 248, 255;
    --semi-light-blue-0: 0, 55, 97;
    --semi-light-blue-1: 0, 77, 133;
    --semi-light-blue-2: 3, 102, 169;
    --semi-light-blue-3: 10, 129, 204;
    --semi-light-blue-4: 19, 159, 240;
    --semi-light-blue-5: 64, 180, 243;
    --semi-light-blue-6: 110, 200, 246;
    --semi-light-blue-7: 157, 220, 249;
    --semi-light-blue-8: 206, 238, 252;
    --semi-light-blue-9: 235, 248, 254;
    --semi-cyan-0: 4, 52, 61;
    --semi-cyan-1: 7, 79, 92;
    --semi-cyan-2: 10, 108, 123;
    --semi-cyan-3: 14, 137, 153;
    --semi-cyan-4: 19, 168, 184;
    --semi-cyan-5: 56, 187, 198;
    --semi-cyan-6: 98, 205, 212;
    --semi-cyan-7: 145, 223, 227;
    --semi-cyan-8: 198, 239, 241;
    --semi-cyan-9: 231, 247, 248;
    --semi-teal-0: 2, 60, 57;
    --semi-teal-1: 4, 90, 85;
    --semi-teal-2: 7, 119, 111;
    --semi-teal-3: 10, 149, 136;
    --semi-teal-4: 14, 179, 161;
    --semi-teal-5: 51, 194, 176;
    --semi-teal-6: 94, 209, 193;
    --semi-teal-7: 142, 225, 211;
    --semi-teal-8: 196, 240, 232;
    --semi-teal-9: 230, 247, 244;
    --semi-green-0: 18, 60, 25;
    --semi-green-1: 28, 90, 37;
    --semi-green-2: 39, 119, 49;
    --semi-green-3: 50, 149, 61;
    --semi-green-4: 62, 179, 73;
    --semi-green-5: 93, 194, 100;
    --semi-green-6: 127, 209, 132;
    --semi-green-7: 166, 225, 168;
    --semi-green-8: 208, 240, 209;
    --semi-green-9: 236, 247, 236;
    --semi-light-green-0: 38, 61, 19;
    --semi-light-green-1: 59, 92, 29;
    --semi-light-green-2: 81, 123, 40;
    --semi-light-green-3: 103, 153, 52;
    --semi-light-green-4: 127, 184, 64;
    --semi-light-green-5: 151, 198, 95;
    --semi-light-green-6: 176, 212, 129;
    --semi-light-green-7: 201, 227, 167;
    --semi-light-green-8: 228, 241, 209;
    --semi-light-green-9: 243, 248, 237;
    --semi-lime-0: 49, 70, 3;
    --semi-lime-1: 75, 105, 5;
    --semi-lime-2: 103, 141, 9;
    --semi-lime-3: 132, 176, 12;
    --semi-lime-4: 162, 211, 17;
    --semi-lime-5: 174, 220, 58;
    --semi-lime-6: 189, 229, 102;
    --semi-lime-7: 207, 237, 150;
    --semi-lime-8: 229, 246, 201;
    --semi-lime-9: 243, 251, 233;
    --semi-yellow-0: 84, 73, 3;
    --semi-yellow-1: 126, 108, 6;
    --semi-yellow-2: 168, 142, 10;
    --semi-yellow-3: 210, 175, 15;
    --semi-yellow-4: 252, 206, 20;
    --semi-yellow-5: 253, 222, 67;
    --semi-yellow-6: 253, 235, 113;
    --semi-yellow-7: 254, 245, 160;
    --semi-yellow-8: 254, 251, 208;
    --semi-yellow-9: 255, 254, 236;
    --semi-amber-0: 81, 46, 9;
    --semi-amber-1: 121, 75, 15;
    --semi-amber-2: 161, 107, 22;
    --semi-amber-3: 202, 143, 30;
    --semi-amber-4: 242, 183, 38;
    --semi-amber-5: 245, 202, 80;
    --semi-amber-6: 247, 219, 122;
    --semi-amber-7: 250, 234, 166;
    --semi-amber-8: 252, 246, 210;
    --semi-amber-9: 254, 251, 237;
    --semi-orange-0: 85, 31, 3;
    --semi-orange-1: 128, 53, 6;
    --semi-orange-2: 170, 80, 10;
    --semi-orange-3: 213, 111, 15;
    --semi-orange-4: 255, 146, 20;
    --semi-orange-5: 255, 174, 67;
    --semi-orange-6: 255, 199, 114;
    --semi-orange-7: 255, 221, 161;
    --semi-orange-8: 255, 239, 208;
    --semi-orange-9: 255, 249, 237;
    --semi-grey-0: 28, 31, 35;
    --semi-grey-1: 46, 50, 56;
    --semi-grey-2: 65, 70, 76;
    --semi-grey-3: 85, 91, 97;
    --semi-grey-4: 107, 112, 117;
    --semi-grey-5: 136, 141, 146;
    --semi-grey-6: 167, 171, 176;
    --semi-grey-7: 198, 202, 205;
    --semi-grey-8: 230, 232, 234;
    --semi-grey-9: 249, 249, 249;
    --semi-white: 255, 255, 255;
    --semi-black: 0, 0, 0;
    --semi-ai-purple-0: 58, 23, 112;
    --semi-ai-purple-1: 83, 35, 148;
    --semi-ai-purple-2: 111, 49, 184;
    --semi-ai-purple-3: 141, 65, 219;
    --semi-ai-purple-4: 167, 68, 255;
    --semi-ai-purple-5: 195, 117, 255;
    --semi-ai-purple-6: 213, 152, 255;
    --semi-ai-purple-7: 229, 186, 255;
    --semi-ai-purple-8: 243, 221, 255;
    --semi-ai-purple-9: 251, 243, 255;
    --semi-ai-general-0-0: 9, 44, 100;
    --semi-ai-general-0-1: 39, 29, 108;
    --semi-ai-general-0-2: 58, 23, 112;
    --semi-ai-general-0-3: 80, 18, 101;
    --semi-ai-general-1-0: 17, 64, 136;
    --semi-ai-general-1-1: 54, 43, 144;
    --semi-ai-general-1-2: 83, 35, 148;
    --semi-ai-general-1-3: 113, 28, 137;
    --semi-ai-general-2-0: 26, 86, 172;
    --semi-ai-general-2-1: 70, 59, 180;
    --semi-ai-general-2-2: 111, 49, 184;
    --semi-ai-general-2-3: 148, 41, 173;
    --semi-ai-general-3-0: 38, 111, 207;
    --semi-ai-general-3-1: 88, 78, 215;
    --semi-ai-general-3-2: 141, 65, 219;
    --semi-ai-general-3-3: 185, 55, 208;
    --semi-ai-general-4-0: 35, 127, 240;
    --semi-ai-general-4-1: 94, 84, 248;
    --semi-ai-general-4-2: 167, 68, 255;
    --semi-ai-general-4-3: 219, 56, 241;
    --semi-ai-general-5-0: 91, 162, 245;
    --semi-ai-general-5-1: 134, 129, 252;
    --semi-ai-general-5-2: 195, 117, 255;
    --semi-ai-general-5-3: 234, 107, 246;
    --semi-ai-general-6-0: 131, 187, 248;
    --semi-ai-general-6-1: 163, 160, 253;
    --semi-ai-general-6-2: 213, 152, 255;
    --semi-ai-general-6-3: 243, 143, 248;
    --semi-ai-general-7-0: 172, 210, 250;
    --semi-ai-general-7-1: 192, 192, 253;
    --semi-ai-general-7-2: 229, 186, 255;
    --semi-ai-general-7-3: 249, 180, 251;
    --semi-ai-general-8-0: 213, 233, 253;
    --semi-ai-general-8-1: 223, 223, 254;
    --semi-ai-general-8-2: 243, 221, 255;
    --semi-ai-general-8-3: 253, 217, 252;
    --semi-ai-general-9-0: 239, 247, 254;
    --semi-ai-general-9-1: 244, 244, 255;
    --semi-ai-general-9-2: 251, 243, 255;
    --semi-ai-general-9-3: 254, 241, 254;
    --semi-ai-general-0: linear-gradient(278deg, rgba(var(--semi-ai-general-0-0))0%, rgba(var(--semi-ai-general-0-1))30%, rgba(var(--semi-ai-general-0-2))60%, rgba(var(--semi-ai-general-0-3))100%);
    --semi-ai-general-1: linear-gradient(278deg, rgba(var(--semi-ai-general-1-0))0%, rgba(var(--semi-ai-general-1-1))30%, rgba(var(--semi-ai-general-1-2))60%, rgba(var(--semi-ai-general-1-3))100%);
    --semi-ai-general-2: linear-gradient(278deg, rgba(var(--semi-ai-general-2-0))0%, rgba(var(--semi-ai-general-2-1))30%, rgba(var(--semi-ai-general-2-2))60%, rgba(var(--semi-ai-general-2-3))100%);
    --semi-ai-general-3: linear-gradient(278deg, rgba(var(--semi-ai-general-3-0))0%, rgba(var(--semi-ai-general-3-1))30%, rgba(var(--semi-ai-general-3-2))60%, rgba(var(--semi-ai-general-3-3))100%);
    --semi-ai-general-4: linear-gradient(278deg, rgba(var(--semi-ai-general-4-0))0%, rgba(var(--semi-ai-general-4-1))30%, rgba(var(--semi-ai-general-4-2))60%, rgba(var(--semi-ai-general-4-3))100%);
    --semi-ai-general-5: linear-gradient(278deg, rgba(var(--semi-ai-general-5-0))0%, rgba(var(--semi-ai-general-5-1))30%, rgba(var(--semi-ai-general-5-2))60%, rgba(var(--semi-ai-general-5-3))100%);
    --semi-ai-general-6: linear-gradient(278deg, rgba(var(--semi-ai-general-6-0))0%, rgba(var(--semi-ai-general-6-1))30%, rgba(var(--semi-ai-general-6-2))60%, rgba(var(--semi-ai-general-6-3))100%);
    --semi-ai-general-7: linear-gradient(278deg, rgba(var(--semi-ai-general-7-0))0%, rgba(var(--semi-ai-general-7-1))30%, rgba(var(--semi-ai-general-7-2))60%, rgba(var(--semi-ai-general-7-3))100%);
    --semi-ai-general-8: linear-gradient(278deg, rgba(var(--semi-ai-general-8-0))0%, rgba(var(--semi-ai-general-8-1))30%, rgba(var(--semi-ai-general-8-2))60%, rgba(var(--semi-ai-general-8-3))100%);
    --semi-ai-general-9: linear-gradient(278deg, rgba(var(--semi-ai-general-9-0))0%, rgba(var(--semi-ai-general-9-1))30%, rgba(var(--semi-ai-general-9-2))60%, rgba(var(--semi-ai-general-9-3))100%)
}

body,
body[theme-mode=dark] .semi-always-light {
    -webkit-font-smoothing: antialiased;
    --semi-color-white: rgba(var(--semi-white), 1);
    --semi-color-black: rgba(var(--semi-black), 1);
    --semi-color-primary: rgba(var(--semi-blue-5), 1);
    --semi-color-primary-hover: rgba(var(--semi-blue-6), 1);
    --semi-color-primary-active: rgba(var(--semi-blue-7), 1);
    --semi-color-primary-disabled: rgba(var(--semi-blue-2), 1);
    --semi-color-primary-light-default: rgba(var(--semi-blue-0), 1);
    --semi-color-primary-light-hover: rgba(var(--semi-blue-1), 1);
    --semi-color-primary-light-active: rgba(var(--semi-blue-2), 1);
    --semi-color-secondary: rgba(var(--semi-light-blue-5), 1);
    --semi-color-secondary-hover: rgba(var(--semi-light-blue-6), 1);
    --semi-color-secondary-active: rgba(var(--semi-light-blue-7), 1);
    --semi-color-secondary-disabled: rgba(var(--semi-light-blue-2), 1);
    --semi-color-secondary-light-default: rgba(var(--semi-light-blue-0), 1);
    --semi-color-secondary-light-hover: rgba(var(--semi-light-blue-1), 1);
    --semi-color-secondary-light-active: rgba(var(--semi-light-blue-2), 1);
    --semi-color-tertiary: rgba(var(--semi-grey-5), 1);
    --semi-color-tertiary-hover: rgba(var(--semi-grey-6), 1);
    --semi-color-tertiary-active: rgba(var(--semi-grey-7), 1);
    --semi-color-tertiary-light-default: rgba(var(--semi-grey-0), 1);
    --semi-color-tertiary-light-hover: rgba(var(--semi-grey-1), 1);
    --semi-color-tertiary-light-active: rgba(var(--semi-grey-2), 1);
    --semi-color-default: rgba(var(--semi-grey-0), 1);
    --semi-color-default-hover: rgba(var(--semi-grey-1), 1);
    --semi-color-default-active: rgba(var(--semi-grey-2), 1);
    --semi-color-info: rgba(var(--semi-blue-5), 1);
    --semi-color-info-hover: rgba(var(--semi-blue-6), 1);
    --semi-color-info-active: rgba(var(--semi-blue-7), 1);
    --semi-color-info-disabled: rgba(var(--semi-blue-2), 1);
    --semi-color-info-light-default: rgba(var(--semi-blue-0), 1);
    --semi-color-info-light-hover: rgba(var(--semi-blue-1), 1);
    --semi-color-info-light-active: rgba(var(--semi-blue-2), 1);
    --semi-color-success: rgba(var(--semi-green-5), 1);
    --semi-color-success-hover: rgba(var(--semi-green-6), 1);
    --semi-color-success-active: rgba(var(--semi-green-7), 1);
    --semi-color-success-disabled: rgba(var(--semi-green-2), 1);
    --semi-color-success-light-default: rgba(var(--semi-green-0), 1);
    --semi-color-success-light-hover: rgba(var(--semi-green-1), 1);
    --semi-color-success-light-active: rgba(var(--semi-green-2), 1);
    --semi-color-danger: rgba(var(--semi-red-5), 1);
    --semi-color-danger-hover: rgba(var(--semi-red-6), 1);
    --semi-color-danger-active: rgba(var(--semi-red-7), 1);
    --semi-color-danger-light-default: rgba(var(--semi-red-0), 1);
    --semi-color-danger-light-hover: rgba(var(--semi-red-1), 1);
    --semi-color-danger-light-active: rgba(var(--semi-red-2), 1);
    --semi-color-warning: rgba(var(--semi-orange-5), 1);
    --semi-color-warning-hover: rgba(var(--semi-orange-6), 1);
    --semi-color-warning-active: rgba(var(--semi-orange-7), 1);
    --semi-color-warning-light-default: rgba(var(--semi-orange-0), 1);
    --semi-color-warning-light-hover: rgba(var(--semi-orange-1), 1);
    --semi-color-warning-light-active: rgba(var(--semi-orange-2), 1);
    --semi-color-focus-border: rgba(var(--semi-blue-5), 1);
    --semi-color-disabled-text: rgba(var(--semi-grey-9), .35);
    --semi-color-disabled-border: rgba(var(--semi-grey-1), 1);
    --semi-color-disabled-bg: rgba(var(--semi-grey-1), 1);
    --semi-color-disabled-fill: rgba(var(--semi-grey-8), .04);
    --semi-color-shadow: rgba(var(--semi-black), .04);
    --semi-color-link: rgba(var(--semi-blue-5), 1);
    --semi-color-link-hover: rgba(var(--semi-blue-6), 1);
    --semi-color-link-active: rgba(var(--semi-blue-7), 1);
    --semi-color-link-visited: rgba(var(--semi-blue-5), 1);
    --semi-color-border: rgba(var(--semi-grey-9), .08);
    --semi-color-nav-bg: rgba(var(--semi-white), 1);
    --semi-color-overlay-bg: rgba(22, 22, 26, .6);
    --semi-color-fill-0: rgba(var(--semi-grey-8), .05);
    --semi-color-fill-1: rgba(var(--semi-grey-8), .09);
    --semi-color-fill-2: rgba(var(--semi-grey-8), .13);
    --semi-color-bg-0: rgba(var(--semi-white), 1);
    --semi-color-bg-1: rgba(var(--semi-white), 1);
    --semi-color-bg-2: rgba(var(--semi-white), 1);
    --semi-color-bg-3: rgba(var(--semi-white), 1);
    --semi-color-bg-4: rgba(var(--semi-white), 1);
    --semi-color-text-0: rgba(var(--semi-grey-9), 1);
    --semi-color-text-1: rgba(var(--semi-grey-9), .8);
    --semi-color-text-2: rgba(var(--semi-grey-9), .62);
    --semi-color-text-3: rgba(var(--semi-grey-9), .35);
    --semi-shadow-elevated: 0 0 1px rgba(0, 0, 0, .3), 0 4px 14px rgba(0, 0, 0, .1);
    --semi-border-radius-extra-small: 3px;
    --semi-border-radius-small: 3px;
    --semi-border-radius-medium: 6px;
    --semi-border-radius-large: 12px;
    --semi-border-radius-circle: 50%;
    --semi-border-radius-full: 9999px;
    --semi-color-highlight-bg: rgba(var(--semi-yellow-4), 1);
    --semi-color-highlight: rgba(var(--semi-black), 1);
    --semi-color-data-0: #5769ff;
    --semi-color-data-1: #8ed4e7;
    --semi-color-data-2: #f58700;
    --semi-color-data-3: #dcb7fc;
    --semi-color-data-4: #4a9cf7;
    --semi-color-data-5: #f3cc35;
    --semi-color-data-6: #fe8090;
    --semi-color-data-7: #8bd7d2;
    --semi-color-data-8: #83b023;
    --semi-color-data-9: #e9a5e5;
    --semi-color-data-10: #30a7ce;
    --semi-color-data-11: #f9c064;
    --semi-color-data-12: #b171f9;
    --semi-color-data-13: #77b6f9;
    --semi-color-data-14: #c88f02;
    --semi-color-data-15: #ffaab2;
    --semi-color-data-16: #33b0ab;
    --semi-color-data-17: #b6d781;
    --semi-color-data-18: #d458d4;
    --semi-color-data-19: #bcc6ff;
    --semi-color-ai-general: var(--semi-ai-general-5);
    --semi-color-ai-general-hover: var(--semi-ai-general-6);
    --semi-color-ai-general-active: var(--semi-ai-general-7);
    --semi-color-ai-general-disabled: var(--semi-ai-general-2);
    --semi-color-ai-purple: rgba(var(--semi-ai-purple-5));
    --semi-color-ai-purple-hover: rgba(var(--semi-ai-purple-6));
    --semi-color-ai-purple-active: rgba(var(--semi-ai-purple-7));
    --semi-color-ai-purple-disabled: rgba(var(--semi-ai-purple-2));
    --semi-color-ai-background-bottom: linear-gradient(201.15deg, rgba(255, 255, 255, .04) 6.58%, rgba(255, 226, 138, .04) 32.88%, rgba(231, 45, 255, .04) 67.93%, rgba(0, 115, 255, .04) 94.23%);
    --semi-color-ai-background-bottom-hover: linear-gradient(201.15deg, rgba(255, 255, 255, .08) 6.58%, rgba(255, 226, 138, .08) 32.88%, rgba(231, 45, 255, .08) 67.93%, rgba(0, 115, 255, .08) 94.23%);
    --semi-color-ai-background-bottom-active: linear-gradient(201.15deg, rgba(255, 255, 255, .12) 6.58%, rgba(255, 226, 138, .12) 32.88%, rgba(231, 45, 255, .12) 67.93%, rgba(0, 115, 255, .12) 94.23%);
    --semi-color-ai-background-top: linear-gradient(201.15deg, rgba(83, 56, 255, .16) 6.58%, rgba(176, 48, 240, .094) 32.88%, rgba(231, 45, 255, .047) 59.17%, rgba(255, 255, 255, 0) 94.23%);
    --semi-color-ai-background-top-hover: linear-gradient(201.15deg, rgba(83, 56, 255, .32) 6.58%, rgba(176, 48, 240, .192) 32.88%, rgba(231, 45, 255, .094) 59.17%, rgba(255, 255, 255, 0) 94.23%);
    font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif
}

:host {
    -webkit-font-smoothing: antialiased;
    --semi-color-white: rgba(var(--semi-white), 1);
    --semi-color-black: rgba(var(--semi-black), 1);
    --semi-color-primary: rgba(var(--semi-blue-5), 1);
    --semi-color-primary-hover: rgba(var(--semi-blue-6), 1);
    --semi-color-primary-active: rgba(var(--semi-blue-7), 1);
    --semi-color-primary-disabled: rgba(var(--semi-blue-2), 1);
    --semi-color-primary-light-default: rgba(var(--semi-blue-0), 1);
    --semi-color-primary-light-hover: rgba(var(--semi-blue-1), 1);
    --semi-color-primary-light-active: rgba(var(--semi-blue-2), 1);
    --semi-color-secondary: rgba(var(--semi-light-blue-5), 1);
    --semi-color-secondary-hover: rgba(var(--semi-light-blue-6), 1);
    --semi-color-secondary-active: rgba(var(--semi-light-blue-7), 1);
    --semi-color-secondary-disabled: rgba(var(--semi-light-blue-2), 1);
    --semi-color-secondary-light-default: rgba(var(--semi-light-blue-0), 1);
    --semi-color-secondary-light-hover: rgba(var(--semi-light-blue-1), 1);
    --semi-color-secondary-light-active: rgba(var(--semi-light-blue-2), 1);
    --semi-color-tertiary: rgba(var(--semi-grey-5), 1);
    --semi-color-tertiary-hover: rgba(var(--semi-grey-6), 1);
    --semi-color-tertiary-active: rgba(var(--semi-grey-7), 1);
    --semi-color-tertiary-light-default: rgba(var(--semi-grey-0), 1);
    --semi-color-tertiary-light-hover: rgba(var(--semi-grey-1), 1);
    --semi-color-tertiary-light-active: rgba(var(--semi-grey-2), 1);
    --semi-color-default: rgba(var(--semi-grey-0), 1);
    --semi-color-default-hover: rgba(var(--semi-grey-1), 1);
    --semi-color-default-active: rgba(var(--semi-grey-2), 1);
    --semi-color-info: rgba(var(--semi-blue-5), 1);
    --semi-color-info-hover: rgba(var(--semi-blue-6), 1);
    --semi-color-info-active: rgba(var(--semi-blue-7), 1);
    --semi-color-info-disabled: rgba(var(--semi-blue-2), 1);
    --semi-color-info-light-default: rgba(var(--semi-blue-0), 1);
    --semi-color-info-light-hover: rgba(var(--semi-blue-1), 1);
    --semi-color-info-light-active: rgba(var(--semi-blue-2), 1);
    --semi-color-success: rgba(var(--semi-green-5), 1);
    --semi-color-success-hover: rgba(var(--semi-green-6), 1);
    --semi-color-success-active: rgba(var(--semi-green-7), 1);
    --semi-color-success-disabled: rgba(var(--semi-green-2), 1);
    --semi-color-success-light-default: rgba(var(--semi-green-0), 1);
    --semi-color-success-light-hover: rgba(var(--semi-green-1), 1);
    --semi-color-success-light-active: rgba(var(--semi-green-2), 1);
    --semi-color-danger: rgba(var(--semi-red-5), 1);
    --semi-color-danger-hover: rgba(var(--semi-red-6), 1);
    --semi-color-danger-active: rgba(var(--semi-red-7), 1);
    --semi-color-danger-light-default: rgba(var(--semi-red-0), 1);
    --semi-color-danger-light-hover: rgba(var(--semi-red-1), 1);
    --semi-color-danger-light-active: rgba(var(--semi-red-2), 1);
    --semi-color-warning: rgba(var(--semi-orange-5), 1);
    --semi-color-warning-hover: rgba(var(--semi-orange-6), 1);
    --semi-color-warning-active: rgba(var(--semi-orange-7), 1);
    --semi-color-warning-light-default: rgba(var(--semi-orange-0), 1);
    --semi-color-warning-light-hover: rgba(var(--semi-orange-1), 1);
    --semi-color-warning-light-active: rgba(var(--semi-orange-2), 1);
    --semi-color-focus-border: rgba(var(--semi-blue-5), 1);
    --semi-color-disabled-text: rgba(var(--semi-grey-9), .35);
    --semi-color-disabled-border: rgba(var(--semi-grey-1), 1);
    --semi-color-disabled-bg: rgba(var(--semi-grey-1), 1);
    --semi-color-disabled-fill: rgba(var(--semi-grey-8), .04);
    --semi-color-shadow: rgba(var(--semi-black), .04);
    --semi-color-link: rgba(var(--semi-blue-5), 1);
    --semi-color-link-hover: rgba(var(--semi-blue-6), 1);
    --semi-color-link-active: rgba(var(--semi-blue-7), 1);
    --semi-color-link-visited: rgba(var(--semi-blue-5), 1);
    --semi-color-border: rgba(var(--semi-grey-9), .08);
    --semi-color-nav-bg: rgba(var(--semi-white), 1);
    --semi-color-overlay-bg: rgba(22, 22, 26, .6);
    --semi-color-fill-0: rgba(var(--semi-grey-8), .05);
    --semi-color-fill-1: rgba(var(--semi-grey-8), .09);
    --semi-color-fill-2: rgba(var(--semi-grey-8), .13);
    --semi-color-bg-0: rgba(var(--semi-white), 1);
    --semi-color-bg-1: rgba(var(--semi-white), 1);
    --semi-color-bg-2: rgba(var(--semi-white), 1);
    --semi-color-bg-3: rgba(var(--semi-white), 1);
    --semi-color-bg-4: rgba(var(--semi-white), 1);
    --semi-color-text-0: rgba(var(--semi-grey-9), 1);
    --semi-color-text-1: rgba(var(--semi-grey-9), .8);
    --semi-color-text-2: rgba(var(--semi-grey-9), .62);
    --semi-color-text-3: rgba(var(--semi-grey-9), .35);
    --semi-shadow-elevated: 0 0 1px rgba(0, 0, 0, .3), 0 4px 14px rgba(0, 0, 0, .1);
    --semi-border-radius-extra-small: 3px;
    --semi-border-radius-small: 3px;
    --semi-border-radius-medium: 6px;
    --semi-border-radius-large: 12px;
    --semi-border-radius-circle: 50%;
    --semi-border-radius-full: 9999px;
    --semi-color-highlight-bg: rgba(var(--semi-yellow-4), 1);
    --semi-color-highlight: rgba(var(--semi-black), 1);
    --semi-color-data-0: #5769ff;
    --semi-color-data-1: #8ed4e7;
    --semi-color-data-2: #f58700;
    --semi-color-data-3: #dcb7fc;
    --semi-color-data-4: #4a9cf7;
    --semi-color-data-5: #f3cc35;
    --semi-color-data-6: #fe8090;
    --semi-color-data-7: #8bd7d2;
    --semi-color-data-8: #83b023;
    --semi-color-data-9: #e9a5e5;
    --semi-color-data-10: #30a7ce;
    --semi-color-data-11: #f9c064;
    --semi-color-data-12: #b171f9;
    --semi-color-data-13: #77b6f9;
    --semi-color-data-14: #c88f02;
    --semi-color-data-15: #ffaab2;
    --semi-color-data-16: #33b0ab;
    --semi-color-data-17: #b6d781;
    --semi-color-data-18: #d458d4;
    --semi-color-data-19: #bcc6ff;
    --semi-color-ai-general: var(--semi-ai-general-5);
    --semi-color-ai-general-hover: var(--semi-ai-general-6);
    --semi-color-ai-general-active: var(--semi-ai-general-7);
    --semi-color-ai-general-disabled: var(--semi-ai-general-2);
    --semi-color-ai-purple: rgba(var(--semi-ai-purple-5));
    --semi-color-ai-purple-hover: rgba(var(--semi-ai-purple-6));
    --semi-color-ai-purple-active: rgba(var(--semi-ai-purple-7));
    --semi-color-ai-purple-disabled: rgba(var(--semi-ai-purple-2));
    --semi-color-ai-background-bottom: linear-gradient(201.15deg, rgba(255, 255, 255, .04) 6.58%, rgba(255, 226, 138, .04) 32.88%, rgba(231, 45, 255, .04) 67.93%, rgba(0, 115, 255, .04) 94.23%);
    --semi-color-ai-background-bottom-hover: linear-gradient(201.15deg, rgba(255, 255, 255, .08) 6.58%, rgba(255, 226, 138, .08) 32.88%, rgba(231, 45, 255, .08) 67.93%, rgba(0, 115, 255, .08) 94.23%);
    --semi-color-ai-background-bottom-active: linear-gradient(201.15deg, rgba(255, 255, 255, .12) 6.58%, rgba(255, 226, 138, .12) 32.88%, rgba(231, 45, 255, .12) 67.93%, rgba(0, 115, 255, .12) 94.23%);
    --semi-color-ai-background-top: linear-gradient(201.15deg, rgba(83, 56, 255, .16) 6.58%, rgba(176, 48, 240, .094) 32.88%, rgba(231, 45, 255, .047) 59.17%, rgba(255, 255, 255, 0) 94.23%);
    --semi-color-ai-background-top-hover: linear-gradient(201.15deg, rgba(83, 56, 255, .32) 6.58%, rgba(176, 48, 240, .192) 32.88%, rgba(231, 45, 255, .094) 59.17%, rgba(255, 255, 255, 0) 94.23%);
    font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif
}

:host .semi-always-light {
    -webkit-font-smoothing: antialiased;
    --semi-color-white: rgba(var(--semi-white), 1);
    --semi-color-black: rgba(var(--semi-black), 1);
    --semi-color-primary: rgba(var(--semi-blue-5), 1);
    --semi-color-primary-hover: rgba(var(--semi-blue-6), 1);
    --semi-color-primary-active: rgba(var(--semi-blue-7), 1);
    --semi-color-primary-disabled: rgba(var(--semi-blue-2), 1);
    --semi-color-primary-light-default: rgba(var(--semi-blue-0), 1);
    --semi-color-primary-light-hover: rgba(var(--semi-blue-1), 1);
    --semi-color-primary-light-active: rgba(var(--semi-blue-2), 1);
    --semi-color-secondary: rgba(var(--semi-light-blue-5), 1);
    --semi-color-secondary-hover: rgba(var(--semi-light-blue-6), 1);
    --semi-color-secondary-active: rgba(var(--semi-light-blue-7), 1);
    --semi-color-secondary-disabled: rgba(var(--semi-light-blue-2), 1);
    --semi-color-secondary-light-default: rgba(var(--semi-light-blue-0), 1);
    --semi-color-secondary-light-hover: rgba(var(--semi-light-blue-1), 1);
    --semi-color-secondary-light-active: rgba(var(--semi-light-blue-2), 1);
    --semi-color-tertiary: rgba(var(--semi-grey-5), 1);
    --semi-color-tertiary-hover: rgba(var(--semi-grey-6), 1);
    --semi-color-tertiary-active: rgba(var(--semi-grey-7), 1);
    --semi-color-tertiary-light-default: rgba(var(--semi-grey-0), 1);
    --semi-color-tertiary-light-hover: rgba(var(--semi-grey-1), 1);
    --semi-color-tertiary-light-active: rgba(var(--semi-grey-2), 1);
    --semi-color-default: rgba(var(--semi-grey-0), 1);
    --semi-color-default-hover: rgba(var(--semi-grey-1), 1);
    --semi-color-default-active: rgba(var(--semi-grey-2), 1);
    --semi-color-info: rgba(var(--semi-blue-5), 1);
    --semi-color-info-hover: rgba(var(--semi-blue-6), 1);
    --semi-color-info-active: rgba(var(--semi-blue-7), 1);
    --semi-color-info-disabled: rgba(var(--semi-blue-2), 1);
    --semi-color-info-light-default: rgba(var(--semi-blue-0), 1);
    --semi-color-info-light-hover: rgba(var(--semi-blue-1), 1);
    --semi-color-info-light-active: rgba(var(--semi-blue-2), 1);
    --semi-color-success: rgba(var(--semi-green-5), 1);
    --semi-color-success-hover: rgba(var(--semi-green-6), 1);
    --semi-color-success-active: rgba(var(--semi-green-7), 1);
    --semi-color-success-disabled: rgba(var(--semi-green-2), 1);
    --semi-color-success-light-default: rgba(var(--semi-green-0), 1);
    --semi-color-success-light-hover: rgba(var(--semi-green-1), 1);
    --semi-color-success-light-active: rgba(var(--semi-green-2), 1);
    --semi-color-danger: rgba(var(--semi-red-5), 1);
    --semi-color-danger-hover: rgba(var(--semi-red-6), 1);
    --semi-color-danger-active: rgba(var(--semi-red-7), 1);
    --semi-color-danger-light-default: rgba(var(--semi-red-0), 1);
    --semi-color-danger-light-hover: rgba(var(--semi-red-1), 1);
    --semi-color-danger-light-active: rgba(var(--semi-red-2), 1);
    --semi-color-warning: rgba(var(--semi-orange-5), 1);
    --semi-color-warning-hover: rgba(var(--semi-orange-6), 1);
    --semi-color-warning-active: rgba(var(--semi-orange-7), 1);
    --semi-color-warning-light-default: rgba(var(--semi-orange-0), 1);
    --semi-color-warning-light-hover: rgba(var(--semi-orange-1), 1);
    --semi-color-warning-light-active: rgba(var(--semi-orange-2), 1);
    --semi-color-focus-border: rgba(var(--semi-blue-5), 1);
    --semi-color-disabled-text: rgba(var(--semi-grey-9), .35);
    --semi-color-disabled-border: rgba(var(--semi-grey-1), 1);
    --semi-color-disabled-bg: rgba(var(--semi-grey-1), 1);
    --semi-color-disabled-fill: rgba(var(--semi-grey-8), .04);
    --semi-color-shadow: rgba(var(--semi-black), .04);
    --semi-color-link: rgba(var(--semi-blue-5), 1);
    --semi-color-link-hover: rgba(var(--semi-blue-6), 1);
    --semi-color-link-active: rgba(var(--semi-blue-7), 1);
    --semi-color-link-visited: rgba(var(--semi-blue-5), 1);
    --semi-color-border: rgba(var(--semi-grey-9), .08);
    --semi-color-nav-bg: rgba(var(--semi-white), 1);
    --semi-color-overlay-bg: rgba(22, 22, 26, .6);
    --semi-color-fill-0: rgba(var(--semi-grey-8), .05);
    --semi-color-fill-1: rgba(var(--semi-grey-8), .09);
    --semi-color-fill-2: rgba(var(--semi-grey-8), .13);
    --semi-color-bg-0: rgba(var(--semi-white), 1);
    --semi-color-bg-1: rgba(var(--semi-white), 1);
    --semi-color-bg-2: rgba(var(--semi-white), 1);
    --semi-color-bg-3: rgba(var(--semi-white), 1);
    --semi-color-bg-4: rgba(var(--semi-white), 1);
    --semi-color-text-0: rgba(var(--semi-grey-9), 1);
    --semi-color-text-1: rgba(var(--semi-grey-9), .8);
    --semi-color-text-2: rgba(var(--semi-grey-9), .62);
    --semi-color-text-3: rgba(var(--semi-grey-9), .35);
    --semi-shadow-elevated: 0 0 1px rgba(0, 0, 0, .3), 0 4px 14px rgba(0, 0, 0, .1);
    --semi-border-radius-extra-small: 3px;
    --semi-border-radius-small: 3px;
    --semi-border-radius-medium: 6px;
    --semi-border-radius-large: 12px;
    --semi-border-radius-circle: 50%;
    --semi-border-radius-full: 9999px;
    --semi-color-highlight-bg: rgba(var(--semi-yellow-4), 1);
    --semi-color-highlight: rgba(var(--semi-black), 1);
    --semi-color-data-0: #5769ff;
    --semi-color-data-1: #8ed4e7;
    --semi-color-data-2: #f58700;
    --semi-color-data-3: #dcb7fc;
    --semi-color-data-4: #4a9cf7;
    --semi-color-data-5: #f3cc35;
    --semi-color-data-6: #fe8090;
    --semi-color-data-7: #8bd7d2;
    --semi-color-data-8: #83b023;
    --semi-color-data-9: #e9a5e5;
    --semi-color-data-10: #30a7ce;
    --semi-color-data-11: #f9c064;
    --semi-color-data-12: #b171f9;
    --semi-color-data-13: #77b6f9;
    --semi-color-data-14: #c88f02;
    --semi-color-data-15: #ffaab2;
    --semi-color-data-16: #33b0ab;
    --semi-color-data-17: #b6d781;
    --semi-color-data-18: #d458d4;
    --semi-color-data-19: #bcc6ff;
    --semi-color-ai-general: var(--semi-ai-general-5);
    --semi-color-ai-general-hover: var(--semi-ai-general-6);
    --semi-color-ai-general-active: var(--semi-ai-general-7);
    --semi-color-ai-general-disabled: var(--semi-ai-general-2);
    --semi-color-ai-purple: rgba(var(--semi-ai-purple-5));
    --semi-color-ai-purple-hover: rgba(var(--semi-ai-purple-6));
    --semi-color-ai-purple-active: rgba(var(--semi-ai-purple-7));
    --semi-color-ai-purple-disabled: rgba(var(--semi-ai-purple-2));
    --semi-color-ai-background-bottom: linear-gradient(201.15deg, rgba(255, 255, 255, .04) 6.58%, rgba(255, 226, 138, .04) 32.88%, rgba(231, 45, 255, .04) 67.93%, rgba(0, 115, 255, .04) 94.23%);
    --semi-color-ai-background-bottom-hover: linear-gradient(201.15deg, rgba(255, 255, 255, .08) 6.58%, rgba(255, 226, 138, .08) 32.88%, rgba(231, 45, 255, .08) 67.93%, rgba(0, 115, 255, .08) 94.23%);
    --semi-color-ai-background-bottom-active: linear-gradient(201.15deg, rgba(255, 255, 255, .12) 6.58%, rgba(255, 226, 138, .12) 32.88%, rgba(231, 45, 255, .12) 67.93%, rgba(0, 115, 255, .12) 94.23%);
    --semi-color-ai-background-top: linear-gradient(201.15deg, rgba(83, 56, 255, .16) 6.58%, rgba(176, 48, 240, .094) 32.88%, rgba(231, 45, 255, .047) 59.17%, rgba(255, 255, 255, 0) 94.23%);
    --semi-color-ai-background-top-hover: linear-gradient(201.15deg, rgba(83, 56, 255, .32) 6.58%, rgba(176, 48, 240, .192) 32.88%, rgba(231, 45, 255, .094) 59.17%, rgba(255, 255, 255, 0) 94.23%);
    font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif
}

body[theme-mode=dark],
body .semi-always-dark {
    -webkit-font-smoothing: antialiased;
    --semi-color-white: #e4e7f5;
    --semi-color-black: rgba(var(--semi-black), 1);
    --semi-color-primary: rgba(var(--semi-blue-5), 1);
    --semi-color-primary-hover: rgba(var(--semi-blue-6), 1);
    --semi-color-primary-active: rgba(var(--semi-blue-7), 1);
    --semi-color-primary-disabled: rgba(var(--semi-blue-2), 1);
    --semi-color-primary-light-default: rgba(var(--semi-blue-5), .2);
    --semi-color-primary-light-hover: rgba(var(--semi-blue-5), .3);
    --semi-color-primary-light-active: rgba(var(--semi-blue-5), .4);
    --semi-color-secondary: rgba(var(--semi-light-blue-5), 1);
    --semi-color-secondary-hover: rgba(var(--semi-light-blue-6), 1);
    --semi-color-secondary-active: rgba(var(--semi-light-blue-7), 1);
    --semi-color-secondary-disabled: rgba(var(--semi-light-blue-2), 1);
    --semi-color-secondary-light-default: rgba(var(--semi-light-blue-5), .2);
    --semi-color-secondary-light-hover: rgba(var(--semi-light-blue-5), .3);
    --semi-color-secondary-light-active: rgba(var(--semi-light-blue-5), .4);
    --semi-color-tertiary: rgba(var(--semi-grey-5), 1);
    --semi-color-tertiary-hover: rgba(var(--semi-grey-6), 1);
    --semi-color-tertiary-active: rgba(var(--semi-grey-7), 1);
    --semi-color-tertiary-light-default: rgba(var(--semi-grey-5), .2);
    --semi-color-tertiary-light-hover: rgba(var(--semi-grey-5), .3);
    --semi-color-tertiary-light-active: rgba(var(--semi-grey-5), .4);
    --semi-color-default: rgba(var(--semi-grey-0), 1);
    --semi-color-default-hover: rgba(var(--semi-grey-1), 1);
    --semi-color-default-active: rgba(var(--semi-grey-2), 1);
    --semi-color-info: rgba(var(--semi-blue-5), 1);
    --semi-color-info-hover: rgba(var(--semi-blue-6), 1);
    --semi-color-info-active: rgba(var(--semi-blue-7), 1);
    --semi-color-info-disabled: rgba(var(--semi-blue-2), 1);
    --semi-color-info-light-default: rgba(var(--semi-blue-5), .2);
    --semi-color-info-light-hover: rgba(var(--semi-blue-5), .3);
    --semi-color-info-light-active: rgba(var(--semi-blue-5), .4);
    --semi-color-success: rgba(var(--semi-green-5), 1);
    --semi-color-success-hover: rgba(var(--semi-green-6), 1);
    --semi-color-success-active: rgba(var(--semi-green-7), 1);
    --semi-color-success-disabled: rgba(var(--semi-green-2), 1);
    --semi-color-success-light-default: rgba(var(--semi-green-5), .2);
    --semi-color-success-light-hover: rgba(var(--semi-green-5), .3);
    --semi-color-success-light-active: rgba(var(--semi-green-5), .4);
    --semi-color-danger: rgba(var(--semi-red-5), 1);
    --semi-color-danger-hover: rgba(var(--semi-red-6), 1);
    --semi-color-danger-active: rgba(var(--semi-red-7), 1);
    --semi-color-danger-light-default: rgba(var(--semi-red-5), .2);
    --semi-color-danger-light-hover: rgba(var(--semi-red-5), .3);
    --semi-color-danger-light-active: rgba(var(--semi-red-5), .4);
    --semi-color-warning: rgba(var(--semi-orange-5), 1);
    --semi-color-warning-hover: rgba(var(--semi-orange-6), 1);
    --semi-color-warning-active: rgba(var(--semi-orange-7), 1);
    --semi-color-warning-light-default: rgba(var(--semi-orange-5), .2);
    --semi-color-warning-light-hover: rgba(var(--semi-orange-5), .3);
    --semi-color-warning-light-active: rgba(var(--semi-orange-5), .4);
    --semi-color-focus-border: rgba(var(--semi-blue-5), 1);
    --semi-color-disabled-text: rgba(var(--semi-grey-9), .35);
    --semi-color-disabled-border: rgba(var(--semi-grey-1), 1);
    --semi-color-disabled-bg: rgba(var(--semi-grey-1), 1);
    --semi-color-disabled-fill: rgba(var(--semi-grey-8), .04);
    --semi-color-link: rgba(var(--semi-blue-5), 1);
    --semi-color-link-hover: rgba(var(--semi-blue-6), 1);
    --semi-color-link-active: rgba(var(--semi-blue-7), 1);
    --semi-color-link-visited: rgba(var(--semi-blue-5), 1);
    --semi-color-nav-bg: #232429;
    --semi-shadow-elevated: inset 0 0 0 1px rgba(255, 255, 255, .1), 0 4px 14px rgba(0, 0, 0, .25);
    --semi-color-overlay-bg: rgba(22, 22, 26, .6);
    --semi-color-fill-0: rgba(var(--semi-white), .12);
    --semi-color-fill-1: rgba(var(--semi-white), .16);
    --semi-color-fill-2: rgba(var(--semi-white), .2);
    --semi-color-border: rgba(var(--semi-white), .08);
    --semi-color-shadow: rgba(var(--semi-black), .04);
    --semi-color-bg-0: #16161a;
    --semi-color-bg-1: #232429;
    --semi-color-bg-2: #35363c;
    --semi-color-bg-3: #43444a;
    --semi-color-bg-4: #4f5159;
    --semi-color-text-0: rgba(var(--semi-grey-9), 1);
    --semi-color-text-1: rgba(var(--semi-grey-9), .8);
    --semi-color-text-2: rgba(var(--semi-grey-9), .6);
    --semi-color-text-3: rgba(var(--semi-grey-9), .35);
    --semi-border-radius-extra-small: 3px;
    --semi-border-radius-small: 3px;
    --semi-border-radius-medium: 6px;
    --semi-border-radius-large: 12px;
    --semi-border-radius-circle: 50%;
    --semi-border-radius-full: 9999px;
    --semi-color-highlight-bg: rgba(var(--semi-yellow-2), 1);
    --semi-color-highlight: rgba(var(--semi-white), 1);
    --semi-color-data-0: #5e6dc2;
    --semi-color-data-1: #086878;
    --semi-color-data-2: #faad3f;
    --semi-color-data-3: #4c2b9c;
    --semi-color-data-4: #107df8;
    --semi-color-data-5: #f8ca10;
    --semi-color-data-6: #c31e57;
    --semi-color-data-7: #057773;
    --semi-color-data-8: #9acf0d;
    --semi-color-data-9: #751d8a;
    --semi-color-data-10: #10a2b4;
    --semi-color-data-11: #d06e0b;
    --semi-color-data-12: #7142c5;
    --semi-color-data-13: #0764d4;
    --semi-color-data-14: #fbe86e;
    --semi-color-data-15: #a01349;
    --semi-color-data-16: #0bb3a7;
    --semi-color-data-17: #628a06;
    --semi-color-data-18: #a230b3;
    --semi-color-data-19: #28338a;
    --semi-color-ai-general: var(--semi-ai-general-5);
    --semi-color-ai-general-hover: var(--semi-ai-general-6);
    --semi-color-ai-general-active: var(--semi-ai-general-7);
    --semi-color-ai-general-disabled: var(--semi-ai-general-2);
    --semi-color-ai-purple: rgba(var(--semi-ai-purple-5));
    --semi-color-ai-purple-hover: rgba(var(--semi-ai-purple-6));
    --semi-color-ai-purple-active: rgba(var(--semi-ai-purple-7));
    --semi-color-ai-purple-disabled: rgba(var(--semi-ai-purple-2));
    --semi-color-ai-background-bottom: linear-gradient(201.15deg, rgba(255, 226, 138, .2) 6.58%, rgba(231, 45, 255, .2) 50.4%, rgba(0, 115, 255, .2) 94.23%);
    --semi-color-ai-background-bottom-hover: linear-gradient(201.15deg, rgba(255, 226, 138, .3) 6.58%, rgba(231, 45, 255, .3) 50.4%, rgba(0, 115, 255, .3) 94.23%);
    --semi-color-ai-background-bottom-active: linear-gradient(201.15deg, rgba(255, 226, 138, .4) 6.58%, rgba(231, 45, 255, .4) 50.4%, rgba(0, 115, 255, .4) 94.23%);
    --semi-color-ai-background-top: linear-gradient(201.15deg, rgba(83, 56, 255, .36) 6.58%, rgba(176, 48, 240, .216) 32.88%, rgba(154, 0, 174, .11) 59.17%, transparent 94.23%);
    --semi-color-ai-background-top-hover: linear-gradient(201.15deg, rgba(83, 56, 255, .72) 6.58%, rgba(176, 48, 240, .43) 32.88%, rgba(154, 0, 174, .216) 59.17%, transparent 94.23%);
    font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif
}

:host([theme-mode=dark]) {
    -webkit-font-smoothing: antialiased;
    --semi-color-white: #e4e7f5;
    --semi-color-black: rgba(var(--semi-black), 1);
    --semi-color-primary: rgba(var(--semi-blue-5), 1);
    --semi-color-primary-hover: rgba(var(--semi-blue-6), 1);
    --semi-color-primary-active: rgba(var(--semi-blue-7), 1);
    --semi-color-primary-disabled: rgba(var(--semi-blue-2), 1);
    --semi-color-primary-light-default: rgba(var(--semi-blue-5), .2);
    --semi-color-primary-light-hover: rgba(var(--semi-blue-5), .3);
    --semi-color-primary-light-active: rgba(var(--semi-blue-5), .4);
    --semi-color-secondary: rgba(var(--semi-light-blue-5), 1);
    --semi-color-secondary-hover: rgba(var(--semi-light-blue-6), 1);
    --semi-color-secondary-active: rgba(var(--semi-light-blue-7), 1);
    --semi-color-secondary-disabled: rgba(var(--semi-light-blue-2), 1);
    --semi-color-secondary-light-default: rgba(var(--semi-light-blue-5), .2);
    --semi-color-secondary-light-hover: rgba(var(--semi-light-blue-5), .3);
    --semi-color-secondary-light-active: rgba(var(--semi-light-blue-5), .4);
    --semi-color-tertiary: rgba(var(--semi-grey-5), 1);
    --semi-color-tertiary-hover: rgba(var(--semi-grey-6), 1);
    --semi-color-tertiary-active: rgba(var(--semi-grey-7), 1);
    --semi-color-tertiary-light-default: rgba(var(--semi-grey-5), .2);
    --semi-color-tertiary-light-hover: rgba(var(--semi-grey-5), .3);
    --semi-color-tertiary-light-active: rgba(var(--semi-grey-5), .4);
    --semi-color-default: rgba(var(--semi-grey-0), 1);
    --semi-color-default-hover: rgba(var(--semi-grey-1), 1);
    --semi-color-default-active: rgba(var(--semi-grey-2), 1);
    --semi-color-info: rgba(var(--semi-blue-5), 1);
    --semi-color-info-hover: rgba(var(--semi-blue-6), 1);
    --semi-color-info-active: rgba(var(--semi-blue-7), 1);
    --semi-color-info-disabled: rgba(var(--semi-blue-2), 1);
    --semi-color-info-light-default: rgba(var(--semi-blue-5), .2);
    --semi-color-info-light-hover: rgba(var(--semi-blue-5), .3);
    --semi-color-info-light-active: rgba(var(--semi-blue-5), .4);
    --semi-color-success: rgba(var(--semi-green-5), 1);
    --semi-color-success-hover: rgba(var(--semi-green-6), 1);
    --semi-color-success-active: rgba(var(--semi-green-7), 1);
    --semi-color-success-disabled: rgba(var(--semi-green-2), 1);
    --semi-color-success-light-default: rgba(var(--semi-green-5), .2);
    --semi-color-success-light-hover: rgba(var(--semi-green-5), .3);
    --semi-color-success-light-active: rgba(var(--semi-green-5), .4);
    --semi-color-danger: rgba(var(--semi-red-5), 1);
    --semi-color-danger-hover: rgba(var(--semi-red-6), 1);
    --semi-color-danger-active: rgba(var(--semi-red-7), 1);
    --semi-color-danger-light-default: rgba(var(--semi-red-5), .2);
    --semi-color-danger-light-hover: rgba(var(--semi-red-5), .3);
    --semi-color-danger-light-active: rgba(var(--semi-red-5), .4);
    --semi-color-warning: rgba(var(--semi-orange-5), 1);
    --semi-color-warning-hover: rgba(var(--semi-orange-6), 1);
    --semi-color-warning-active: rgba(var(--semi-orange-7), 1);
    --semi-color-warning-light-default: rgba(var(--semi-orange-5), .2);
    --semi-color-warning-light-hover: rgba(var(--semi-orange-5), .3);
    --semi-color-warning-light-active: rgba(var(--semi-orange-5), .4);
    --semi-color-focus-border: rgba(var(--semi-blue-5), 1);
    --semi-color-disabled-text: rgba(var(--semi-grey-9), .35);
    --semi-color-disabled-border: rgba(var(--semi-grey-1), 1);
    --semi-color-disabled-bg: rgba(var(--semi-grey-1), 1);
    --semi-color-disabled-fill: rgba(var(--semi-grey-8), .04);
    --semi-color-link: rgba(var(--semi-blue-5), 1);
    --semi-color-link-hover: rgba(var(--semi-blue-6), 1);
    --semi-color-link-active: rgba(var(--semi-blue-7), 1);
    --semi-color-link-visited: rgba(var(--semi-blue-5), 1);
    --semi-color-nav-bg: #232429;
    --semi-shadow-elevated: inset 0 0 0 1px rgba(255, 255, 255, .1), 0 4px 14px rgba(0, 0, 0, .25);
    --semi-color-overlay-bg: rgba(22, 22, 26, .6);
    --semi-color-fill-0: rgba(var(--semi-white), .12);
    --semi-color-fill-1: rgba(var(--semi-white), .16);
    --semi-color-fill-2: rgba(var(--semi-white), .2);
    --semi-color-border: rgba(var(--semi-white), .08);
    --semi-color-shadow: rgba(var(--semi-black), .04);
    --semi-color-bg-0: #16161a;
    --semi-color-bg-1: #232429;
    --semi-color-bg-2: #35363c;
    --semi-color-bg-3: #43444a;
    --semi-color-bg-4: #4f5159;
    --semi-color-text-0: rgba(var(--semi-grey-9), 1);
    --semi-color-text-1: rgba(var(--semi-grey-9), .8);
    --semi-color-text-2: rgba(var(--semi-grey-9), .6);
    --semi-color-text-3: rgba(var(--semi-grey-9), .35);
    --semi-border-radius-extra-small: 3px;
    --semi-border-radius-small: 3px;
    --semi-border-radius-medium: 6px;
    --semi-border-radius-large: 12px;
    --semi-border-radius-circle: 50%;
    --semi-border-radius-full: 9999px;
    --semi-color-highlight-bg: rgba(var(--semi-yellow-2), 1);
    --semi-color-highlight: rgba(var(--semi-white), 1);
    --semi-color-data-0: #5e6dc2;
    --semi-color-data-1: #086878;
    --semi-color-data-2: #faad3f;
    --semi-color-data-3: #4c2b9c;
    --semi-color-data-4: #107df8;
    --semi-color-data-5: #f8ca10;
    --semi-color-data-6: #c31e57;
    --semi-color-data-7: #057773;
    --semi-color-data-8: #9acf0d;
    --semi-color-data-9: #751d8a;
    --semi-color-data-10: #10a2b4;
    --semi-color-data-11: #d06e0b;
    --semi-color-data-12: #7142c5;
    --semi-color-data-13: #0764d4;
    --semi-color-data-14: #fbe86e;
    --semi-color-data-15: #a01349;
    --semi-color-data-16: #0bb3a7;
    --semi-color-data-17: #628a06;
    --semi-color-data-18: #a230b3;
    --semi-color-data-19: #28338a;
    --semi-color-ai-general: var(--semi-ai-general-5);
    --semi-color-ai-general-hover: var(--semi-ai-general-6);
    --semi-color-ai-general-active: var(--semi-ai-general-7);
    --semi-color-ai-general-disabled: var(--semi-ai-general-2);
    --semi-color-ai-purple: rgba(var(--semi-ai-purple-5));
    --semi-color-ai-purple-hover: rgba(var(--semi-ai-purple-6));
    --semi-color-ai-purple-active: rgba(var(--semi-ai-purple-7));
    --semi-color-ai-purple-disabled: rgba(var(--semi-ai-purple-2));
    --semi-color-ai-background-bottom: linear-gradient(201.15deg, rgba(255, 226, 138, .2) 6.58%, rgba(231, 45, 255, .2) 50.4%, rgba(0, 115, 255, .2) 94.23%);
    --semi-color-ai-background-bottom-hover: linear-gradient(201.15deg, rgba(255, 226, 138, .3) 6.58%, rgba(231, 45, 255, .3) 50.4%, rgba(0, 115, 255, .3) 94.23%);
    --semi-color-ai-background-bottom-active: linear-gradient(201.15deg, rgba(255, 226, 138, .4) 6.58%, rgba(231, 45, 255, .4) 50.4%, rgba(0, 115, 255, .4) 94.23%);
    --semi-color-ai-background-top: linear-gradient(201.15deg, rgba(83, 56, 255, .36) 6.58%, rgba(176, 48, 240, .216) 32.88%, rgba(154, 0, 174, .11) 59.17%, transparent 94.23%);
    --semi-color-ai-background-top-hover: linear-gradient(201.15deg, rgba(83, 56, 255, .72) 6.58%, rgba(176, 48, 240, .43) 32.88%, rgba(154, 0, 174, .216) 59.17%, transparent 94.23%);
    font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif
}

:host .semi-always-dark {
    -webkit-font-smoothing: antialiased;
    --semi-color-white: #e4e7f5;
    --semi-color-black: rgba(var(--semi-black), 1);
    --semi-color-primary: rgba(var(--semi-blue-5), 1);
    --semi-color-primary-hover: rgba(var(--semi-blue-6), 1);
    --semi-color-primary-active: rgba(var(--semi-blue-7), 1);
    --semi-color-primary-disabled: rgba(var(--semi-blue-2), 1);
    --semi-color-primary-light-default: rgba(var(--semi-blue-5), .2);
    --semi-color-primary-light-hover: rgba(var(--semi-blue-5), .3);
    --semi-color-primary-light-active: rgba(var(--semi-blue-5), .4);
    --semi-color-secondary: rgba(var(--semi-light-blue-5), 1);
    --semi-color-secondary-hover: rgba(var(--semi-light-blue-6), 1);
    --semi-color-secondary-active: rgba(var(--semi-light-blue-7), 1);
    --semi-color-secondary-disabled: rgba(var(--semi-light-blue-2), 1);
    --semi-color-secondary-light-default: rgba(var(--semi-light-blue-5), .2);
    --semi-color-secondary-light-hover: rgba(var(--semi-light-blue-5), .3);
    --semi-color-secondary-light-active: rgba(var(--semi-light-blue-5), .4);
    --semi-color-tertiary: rgba(var(--semi-grey-5), 1);
    --semi-color-tertiary-hover: rgba(var(--semi-grey-6), 1);
    --semi-color-tertiary-active: rgba(var(--semi-grey-7), 1);
    --semi-color-tertiary-light-default: rgba(var(--semi-grey-5), .2);
    --semi-color-tertiary-light-hover: rgba(var(--semi-grey-5), .3);
    --semi-color-tertiary-light-active: rgba(var(--semi-grey-5), .4);
    --semi-color-default: rgba(var(--semi-grey-0), 1);
    --semi-color-default-hover: rgba(var(--semi-grey-1), 1);
    --semi-color-default-active: rgba(var(--semi-grey-2), 1);
    --semi-color-info: rgba(var(--semi-blue-5), 1);
    --semi-color-info-hover: rgba(var(--semi-blue-6), 1);
    --semi-color-info-active: rgba(var(--semi-blue-7), 1);
    --semi-color-info-disabled: rgba(var(--semi-blue-2), 1);
    --semi-color-info-light-default: rgba(var(--semi-blue-5), .2);
    --semi-color-info-light-hover: rgba(var(--semi-blue-5), .3);
    --semi-color-info-light-active: rgba(var(--semi-blue-5), .4);
    --semi-color-success: rgba(var(--semi-green-5), 1);
    --semi-color-success-hover: rgba(var(--semi-green-6), 1);
    --semi-color-success-active: rgba(var(--semi-green-7), 1);
    --semi-color-success-disabled: rgba(var(--semi-green-2), 1);
    --semi-color-success-light-default: rgba(var(--semi-green-5), .2);
    --semi-color-success-light-hover: rgba(var(--semi-green-5), .3);
    --semi-color-success-light-active: rgba(var(--semi-green-5), .4);
    --semi-color-danger: rgba(var(--semi-red-5), 1);
    --semi-color-danger-hover: rgba(var(--semi-red-6), 1);
    --semi-color-danger-active: rgba(var(--semi-red-7), 1);
    --semi-color-danger-light-default: rgba(var(--semi-red-5), .2);
    --semi-color-danger-light-hover: rgba(var(--semi-red-5), .3);
    --semi-color-danger-light-active: rgba(var(--semi-red-5), .4);
    --semi-color-warning: rgba(var(--semi-orange-5), 1);
    --semi-color-warning-hover: rgba(var(--semi-orange-6), 1);
    --semi-color-warning-active: rgba(var(--semi-orange-7), 1);
    --semi-color-warning-light-default: rgba(var(--semi-orange-5), .2);
    --semi-color-warning-light-hover: rgba(var(--semi-orange-5), .3);
    --semi-color-warning-light-active: rgba(var(--semi-orange-5), .4);
    --semi-color-focus-border: rgba(var(--semi-blue-5), 1);
    --semi-color-disabled-text: rgba(var(--semi-grey-9), .35);
    --semi-color-disabled-border: rgba(var(--semi-grey-1), 1);
    --semi-color-disabled-bg: rgba(var(--semi-grey-1), 1);
    --semi-color-disabled-fill: rgba(var(--semi-grey-8), .04);
    --semi-color-link: rgba(var(--semi-blue-5), 1);
    --semi-color-link-hover: rgba(var(--semi-blue-6), 1);
    --semi-color-link-active: rgba(var(--semi-blue-7), 1);
    --semi-color-link-visited: rgba(var(--semi-blue-5), 1);
    --semi-color-nav-bg: #232429;
    --semi-shadow-elevated: inset 0 0 0 1px rgba(255, 255, 255, .1), 0 4px 14px rgba(0, 0, 0, .25);
    --semi-color-overlay-bg: rgba(22, 22, 26, .6);
    --semi-color-fill-0: rgba(var(--semi-white), .12);
    --semi-color-fill-1: rgba(var(--semi-white), .16);
    --semi-color-fill-2: rgba(var(--semi-white), .2);
    --semi-color-border: rgba(var(--semi-white), .08);
    --semi-color-shadow: rgba(var(--semi-black), .04);
    --semi-color-bg-0: #16161a;
    --semi-color-bg-1: #232429;
    --semi-color-bg-2: #35363c;
    --semi-color-bg-3: #43444a;
    --semi-color-bg-4: #4f5159;
    --semi-color-text-0: rgba(var(--semi-grey-9), 1);
    --semi-color-text-1: rgba(var(--semi-grey-9), .8);
    --semi-color-text-2: rgba(var(--semi-grey-9), .6);
    --semi-color-text-3: rgba(var(--semi-grey-9), .35);
    --semi-border-radius-extra-small: 3px;
    --semi-border-radius-small: 3px;
    --semi-border-radius-medium: 6px;
    --semi-border-radius-large: 12px;
    --semi-border-radius-circle: 50%;
    --semi-border-radius-full: 9999px;
    --semi-color-highlight-bg: rgba(var(--semi-yellow-2), 1);
    --semi-color-highlight: rgba(var(--semi-white), 1);
    --semi-color-data-0: #5e6dc2;
    --semi-color-data-1: #086878;
    --semi-color-data-2: #faad3f;
    --semi-color-data-3: #4c2b9c;
    --semi-color-data-4: #107df8;
    --semi-color-data-5: #f8ca10;
    --semi-color-data-6: #c31e57;
    --semi-color-data-7: #057773;
    --semi-color-data-8: #9acf0d;
    --semi-color-data-9: #751d8a;
    --semi-color-data-10: #10a2b4;
    --semi-color-data-11: #d06e0b;
    --semi-color-data-12: #7142c5;
    --semi-color-data-13: #0764d4;
    --semi-color-data-14: #fbe86e;
    --semi-color-data-15: #a01349;
    --semi-color-data-16: #0bb3a7;
    --semi-color-data-17: #628a06;
    --semi-color-data-18: #a230b3;
    --semi-color-data-19: #28338a;
    --semi-color-ai-general: var(--semi-ai-general-5);
    --semi-color-ai-general-hover: var(--semi-ai-general-6);
    --semi-color-ai-general-active: var(--semi-ai-general-7);
    --semi-color-ai-general-disabled: var(--semi-ai-general-2);
    --semi-color-ai-purple: rgba(var(--semi-ai-purple-5));
    --semi-color-ai-purple-hover: rgba(var(--semi-ai-purple-6));
    --semi-color-ai-purple-active: rgba(var(--semi-ai-purple-7));
    --semi-color-ai-purple-disabled: rgba(var(--semi-ai-purple-2));
    --semi-color-ai-background-bottom: linear-gradient(201.15deg, rgba(255, 226, 138, .2) 6.58%, rgba(231, 45, 255, .2) 50.4%, rgba(0, 115, 255, .2) 94.23%);
    --semi-color-ai-background-bottom-hover: linear-gradient(201.15deg, rgba(255, 226, 138, .3) 6.58%, rgba(231, 45, 255, .3) 50.4%, rgba(0, 115, 255, .3) 94.23%);
    --semi-color-ai-background-bottom-active: linear-gradient(201.15deg, rgba(255, 226, 138, .4) 6.58%, rgba(231, 45, 255, .4) 50.4%, rgba(0, 115, 255, .4) 94.23%);
    --semi-color-ai-background-top: linear-gradient(201.15deg, rgba(83, 56, 255, .36) 6.58%, rgba(176, 48, 240, .216) 32.88%, rgba(154, 0, 174, .11) 59.17%, transparent 94.23%);
    --semi-color-ai-background-top-hover: linear-gradient(201.15deg, rgba(83, 56, 255, .72) 6.58%, rgba(176, 48, 240, .43) 32.88%, rgba(154, 0, 174, .216) 59.17%, transparent 94.23%);
    font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif
}

.semi-light-scrollbar::-webkit-scrollbar {
    width: 8px;
    height: 8px
}

.semi-light-scrollbar ::-webkit-scrollbar {
    width: 8px;
    height: 8px
}

.semi-light-scrollbar::-webkit-scrollbar-track {
    background: 0 0
}

.semi-light-scrollbar ::-webkit-scrollbar-track {
    background: 0 0
}

.semi-light-scrollbar::-webkit-scrollbar-corner {
    background-color: transparent
}

.semi-light-scrollbar ::-webkit-scrollbar-corner {
    background-color: transparent
}

.semi-light-scrollbar::-webkit-scrollbar-thumb {
    background: 0 0;
    border-radius: 6px;
    transition: all 1s
}

.semi-light-scrollbar ::-webkit-scrollbar-thumb {
    background: 0 0;
    border-radius: 6px;
    transition: all 1s
}

.semi-light-scrollbar:hover::-webkit-scrollbar-thumb {
    background: var(--semi-color-fill-2)
}

.semi-light-scrollbar :hover::-webkit-scrollbar-thumb {
    background: var(--semi-color-fill-2)
}

.semi-light-scrollbar::-webkit-scrollbar-thumb:hover {
    background: var(--semi-color-fill-1)
}

.semi-light-scrollbar ::-webkit-scrollbar-thumb:hover {
    background: var(--semi-color-fill-1)
}


@layer base {
    .semi-button-split {
        display: inline-block
    }

    .semi-button-split .semi-button {
        border-radius: 0;
        margin-right: 1px
    }

    .semi-button-split .semi-button-first {
        border-top-left-radius: var(--semi-border-radius-small);
        border-bottom-left-radius: var(--semi-border-radius-small)
    }

    .semi-button-split .semi-button-last {
        border-top-right-radius: var(--semi-border-radius-small);
        border-bottom-right-radius: var(--semi-border-radius-small);
        margin-right: unset
    }

    .semi-button-split:hover .semi-button-borderless:active {
        background-color: var(--semi-color-fill-1)
    }

    .semi-button {
        --semi-button-colorful-multiple-fill-0: rgba(var(--semi-ai-general-5-3));
        --semi-button-colorful-multiple-fill-1: rgba(var(--semi-ai-general-5-2));
        --semi-button-colorful-multiple-fill-2: rgba(var(--semi-ai-general-5-1));
        --semi-button-colorful-multiple-fill-3: rgba(var(--semi-ai-general-5-0));
        --semi-button-colorful-disabled-fill: var(--semi-color-disabled-text);
        --semi-button-colorful-fill-primary: var(--semi-color-ai-purple);
        --semi-button-colorful-fill-secondary: var(--semi-color-text-0);
        box-shadow: none;
        cursor: pointer;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        border-radius: var(--semi-border-radius-small);
        vertical-align: middle;
        white-space: nowrap;
        border: 0 solid transparent;
        outline: none;
        justify-content: center;
        align-items: center;
        height: 32px;
        padding: 6px 12px;
        font-size: 14px;
        font-weight: 600;
        line-height: 20px;
        display: inline-flex
    }

    .semi-button.semi-button-primary:focus-visible {
        outline: 2px solid var(--semi-color-primary-light-active)
    }

    .semi-button.semi-button-secondary:focus-visible {
        outline: 2px solid var(--semi-color-primary-light-active)
    }

    .semi-button.semi-button-tertiary:focus-visible {
        outline: 2px solid var(--semi-color-primary-light-active)
    }

    .semi-button.semi-button-warning:focus-visible {
        outline: 2px solid var(--semi-color-primary-light-active)
    }

    .semi-button.semi-button-danger:focus-visible {
        outline: 2px solid var(--semi-color-primary-light-active)
    }

    .semi-button-content {
        align-items: center;
        display: flex
    }

    .semi-button-danger {
        background-color: var(--semi-color-danger);
        color: rgba(var(--semi-white), 1);
        transition: background-color var(--semi-transition_duration-none)var(--semi-transition_function-easeIn)var(--semi-transition_delay-none), border var(--semi-transition_duration-none)var(--semi-transition_function-easeIn)var(--semi-transition_delay-none);
        transform: scale(var(--semi-transform_scale-none))
    }

    .semi-button-danger-disabled {
        background-color: var(--semi-color-disabled-bg)
    }

    .semi-button-danger-disabled.semi-button-outline {
        border: 1px solid var(--semi-color-border);
        background-color: transparent
    }

    .semi-button-danger-disabled.semi-button-light {
        background-color: var(--semi-color-fill-0)
    }

    .semi-button-danger:hover {
        background-color: var(--semi-color-danger-hover)
    }

    .semi-button-danger:active {
        background-color: var(--semi-color-danger-active)
    }

    .semi-button-danger.semi-button-outline {
        border: 1px solid var(--semi-color-danger);
        background-color: transparent
    }

    .semi-button-danger.semi-button-light,
    .semi-button-danger.semi-button-outline,
    .semi-button-danger.semi-button-borderless {
        color: var(--semi-color-danger)
    }

    .semi-button-danger:not(.semi-button-borderless):not(.semi-button-light):focus-visible {
        outline: 2px solid var(--semi-color-danger-light-active)
    }

    .semi-button-warning {
        background-color: var(--semi-color-warning);
        color: rgba(var(--semi-white), 1);
        transition: background-color var(--semi-transition_duration-none)var(--semi-transition_function-easeIn)var(--semi-transition_delay-none), border var(--semi-transition_duration-none)var(--semi-transition_function-easeIn)var(--semi-transition_delay-none);
        transform: scale(var(--semi-transform_scale-none))
    }

    .semi-button-warning-disabled {
        background-color: var(--semi-color-disabled-bg)
    }

    .semi-button-warning-disabled.semi-button-outline {
        border: 1px solid var(--semi-color-border);
        background-color: transparent
    }

    .semi-button-warning-disabled.semi-button-light {
        background-color: var(--semi-color-fill-0)
    }

    .semi-button-warning:hover {
        background-color: var(--semi-color-warning-hover)
    }

    .semi-button-warning:active {
        background-color: var(--semi-color-warning-active)
    }

    .semi-button-warning.semi-button-outline {
        border: 1px solid var(--semi-color-warning);
        background-color: transparent
    }

    .semi-button-warning.semi-button-light,
    .semi-button-warning.semi-button-outline,
    .semi-button-warning.semi-button-borderless {
        color: var(--semi-color-warning)
    }

    .semi-button-warning:not(.semi-button-borderless):not(.semi-button-light):focus-visible {
        outline: 2px solid var(--semi-color-warning-light-active)
    }

    .semi-button-tertiary {
        background-color: var(--semi-color-tertiary);
        color: rgba(var(--semi-white), 1);
        transition: background-color var(--semi-transition_duration-none)var(--semi-transition_function-easeIn)var(--semi-transition_delay-none), border var(--semi-transition_duration-none)var(--semi-transition_function-easeIn)var(--semi-transition_delay-none);
        transform: scale(var(--semi-transform_scale-none))
    }

    .semi-button-tertiary.semi-button-colorful.semi-button-solid {
        background: var(--semi-ai-general-0)
    }

    .semi-button-tertiary.semi-button-colorful.semi-button-solid:hover {
        background: var(--semi-ai-general-1)
    }

    .semi-button-tertiary.semi-button-colorful.semi-button-solid:active {
        background: var(--semi-ai-general-2)
    }

    .semi-button-tertiary.semi-button-colorful.semi-button-solid .semi-button-content-right {
        background: var(--semi-color-ai-general);
        color: transparent;
        -webkit-background-clip: text;
        background-clip: text
    }

    .semi-button-tertiary.semi-button-colorful.semi-button-solid .semi-button-content:not(:has(>.semi-button-content-right)) {
        background: var(--semi-color-ai-general);
        color: transparent;
        -webkit-background-clip: text;
        background-clip: text
    }

    .semi-button-tertiary-disabled {
        background-color: var(--semi-color-disabled-bg)
    }

    .semi-button-tertiary-disabled.semi-button-outline {
        border: 1px solid var(--semi-color-border);
        background-color: transparent
    }

    .semi-button-tertiary-disabled.semi-button-light {
        background-color: var(--semi-color-fill-0)
    }

    .semi-button-tertiary:hover {
        background-color: var(--semi-color-tertiary-hover)
    }

    .semi-button-tertiary:active {
        background-color: var(--semi-color-tertiary-active)
    }

    .semi-button-tertiary.semi-button-outline {
        border: 1px solid var(--semi-color-border);
        background-color: transparent
    }

    .semi-button-tertiary.semi-button-light,
    .semi-button-tertiary.semi-button-outline,
    .semi-button-tertiary.semi-button-borderless {
        color: var(--semi-color-text-1)
    }

    .semi-button-primary {
        background-color: var(--semi-color-primary);
        color: rgba(var(--semi-white), 1);
        transition: background-color var(--semi-transition_duration-none)var(--semi-transition_function-easeIn)var(--semi-transition_delay-none), border var(--semi-transition_duration-none)var(--semi-transition_function-easeIn)var(--semi-transition_delay-none);
        transform: scale(var(--semi-transform_scale-none))
    }

    .semi-button-primary.semi-button-colorful.semi-button-solid {
        background: var(--semi-color-ai-general)
    }

    .semi-button-primary.semi-button-colorful.semi-button-solid:not(.semi-button-borderless):not(.semi-button-light):not(.semi-button-outline):hover {
        background: var(--semi-color-ai-general-hover)
    }

    .semi-button-primary.semi-button-colorful.semi-button-solid:not(.semi-button-borderless):not(.semi-button-light):not(.semi-button-outline):active {
        background: var(--semi-color-ai-general-active)
    }

    .semi-button-primary.semi-button-colorful.semi-button-light .semi-button-content-right {
        background: var(--semi-color-ai-general);
        color: transparent;
        -webkit-background-clip: text;
        background-clip: text
    }

    .semi-button-primary.semi-button-colorful.semi-button-light .semi-button-content:not(:has(>.semi-button-content-right)) {
        background: var(--semi-color-ai-general);
        color: transparent;
        -webkit-background-clip: text;
        background-clip: text
    }

    .semi-button-primary.semi-button-colorful.semi-button-outline {
        color: var(--semi-color-ai-purple);
        border-color: var(--semi-color-ai-purple)
    }

    .semi-button-primary.semi-button-colorful.semi-button-borderless .semi-button-content-right {
        background: var(--semi-color-ai-general);
        color: transparent;
        -webkit-background-clip: text;
        background-clip: text
    }

    .semi-button-primary.semi-button-colorful.semi-button-borderless .semi-button-content:not(:has(>.semi-button-content-right)) {
        background: var(--semi-color-ai-general);
        color: transparent;
        -webkit-background-clip: text;
        background-clip: text
    }

    .semi-button-primary-disabled {
        background-color: var(--semi-color-disabled-bg)
    }

    .semi-button-primary-disabled.semi-button-light {
        background: var(--semi-color-fill-0)
    }

    .semi-button-primary-disabled.semi-button-outline {
        border: 1px solid var(--semi-color-border);
        background-color: transparent
    }

    .semi-button-primary:not(.semi-button-borderless):not(.semi-button-light):not(.semi-button-outline):hover {
        background-color: var(--semi-color-primary-hover)
    }

    .semi-button-primary.semi-button-outline {
        border: 1px solid var(--semi-color-border);
        background-color: transparent
    }

    .semi-button-primary:not(.semi-button-borderless):not(.semi-button-light):not(.semi-button-outline):active {
        background-color: var(--semi-color-primary-active)
    }

    .semi-button-primary.semi-button-light,
    .semi-button-primary.semi-button-outline,
    .semi-button-primary.semi-button-borderless {
        color: var(--semi-color-primary)
    }

    .semi-button-secondary {
        background-color: var(--semi-color-secondary);
        outline-color: var(--semi-color-secondary);
        color: rgba(var(--semi-white), 1);
        transition: background-color var(--semi-transition_duration-none)var(--semi-transition_function-easeIn)var(--semi-transition_delay-none), border var(--semi-transition_duration-none)var(--semi-transition_function-easeIn)var(--semi-transition_delay-none);
        transform: scale(var(--semi-transform_scale-none))
    }

    .semi-button-secondary-disabled {
        background-color: var(--semi-color-disabled-bg)
    }

    .semi-button-secondary-disabled.semi-button-outline {
        border: 1px solid var(--semi-color-border);
        background-color: transparent
    }

    .semi-button-secondary-disabled.semi-button-light {
        background-color: var(--semi-color-fill-0)
    }

    .semi-button-secondary.semi-button-outline {
        border: 1px solid var(--semi-color-border);
        background-color: transparent
    }

    .semi-button-secondary:hover {
        background-color: var(--semi-color-secondary-hover)
    }

    .semi-button-secondary:active {
        background-color: var(--semi-color-secondary-active)
    }

    .semi-button-secondary.semi-button-light,
    .semi-button-secondary.semi-button-outline,
    .semi-button-secondary.semi-button-borderless {
        color: var(--semi-color-secondary)
    }

    .semi-button-disabled {
        color: var(--semi-color-disabled-text);
        cursor: not-allowed
    }

    .semi-button-disabled:not(.semi-button-borderless):not(.semi-button-light):not(.semi-button-outline):hover,
    .semi-button-disabled.semi-button-light,
    .semi-button-disabled.semi-button-borderless,
    .semi-button-disabled.semi-button-outline {
        color: var(--semi-color-disabled-text)
    }

    .semi-button-borderless {
        transition: background-color var(--semi-transition_duration-none)var(--semi-transition_function-easeIn)var(--semi-transition_delay-none);
        transform: scale(var(--semi-transform_scale-none));
        background-color: transparent;
        border: 0 solid transparent
    }

    .semi-button-borderless:not(.semi-button-disabled):hover {
        background-color: var(--semi-color-fill-0);
        border: 0 solid transparent
    }

    .semi-button-borderless:not(.semi-button-disabled):active {
        background-color: var(--semi-color-fill-1);
        border: 0 solid transparent
    }

    .semi-button-outline {
        background-color: transparent
    }

    .semi-button-outline:not(.semi-button-disabled):hover {
        background-color: var(--semi-color-fill-0)
    }

    .semi-button-outline:not(.semi-button-disabled):active {
        background-color: var(--semi-color-fill-1)
    }

    .semi-button-light {
        background-color: var(--semi-color-fill-0);
        transition: background-color var(--semi-transition_duration-none)var(--semi-transition_function-easeIn)var(--semi-transition_delay-none), border var(--semi-transition_duration-none)var(--semi-transition_function-easeIn)var(--semi-transition_delay-none);
        transform: scale(var(--semi-transform_scale-none));
        border: 0 solid transparent
    }

    .semi-button-light:not(.semi-button-disabled):hover {
        background-color: var(--semi-color-fill-1);
        border: 0 solid transparent
    }

    .semi-button-light:not(.semi-button-disabled):active {
        background-color: var(--semi-color-fill-2);
        border: 0 solid transparent
    }

    .semi-button-size-small {
        height: 24px;
        padding: 2px 12px;
        font-size: 14px;
        font-weight: 600;
        line-height: 20px
    }

    .semi-button-size-large {
        height: 40px;
        padding: 10px 16px;
        font-size: 14px;
        font-weight: 600;
        line-height: 20px
    }

    .semi-button-block {
        width: 100%
    }

    .semi-button-group {
        flex-wrap: wrap;
        display: flex
    }

    .semi-button-group>.semi-button {
        border-radius: 0;
        margin: 0;
        padding-left: 0;
        padding-right: 0
    }

    .semi-button-group>.semi-button .semi-button-content {
        padding-left: 12px;
        padding-right: 12px
    }

    .semi-button-group>.semi-button-size-large .semi-button-content {
        padding-left: 16px;
        padding-right: 16px
    }

    .semi-button-group>.semi-button-size-small .semi-button-content {
        padding-left: 12px;
        padding-right: 12px
    }

    .semi-button-group>.semi-button.semi-button-with-icon-only {
        padding-left: 0;
        padding-right: 0
    }

    .semi-button-group>.semi-button.semi-button-with-icon-only .semi-button-content {
        padding-left: 8px;
        padding-right: 8px
    }

    .semi-button-group>.semi-button.semi-button-with-icon-only.semi-button-size-small .semi-button-content {
        padding-left: 4px;
        padding-right: 4px
    }

    .semi-button-group>.semi-button.semi-button-with-icon-only.semi-button-size-large .semi-button-content {
        padding-left: 12px;
        padding-right: 12px
    }

    .semi-button-group>.semi-button:first-child {
        border-top-left-radius: var(--semi-border-radius-small);
        border-bottom-left-radius: var(--semi-border-radius-small)
    }

    .semi-button-group>.semi-button:last-child {
        border-top-right-radius: var(--semi-border-radius-small);
        border-bottom-right-radius: var(--semi-border-radius-small)
    }

    .semi-button-group>.semi-button-outline:not(:last-child) {
        border-right-color: transparent;
        margin-right: -1px
    }

    .semi-button-group-line {
        background-color: var(--semi-color-border);
        align-items: center;
        display: inline-flex
    }

    .semi-button-group-line-primary {
        background-color: var(--semi-color-primary)
    }

    .semi-button-group-line-secondary {
        background-color: var(--semi-color-secondary)
    }

    .semi-button-group-line-tertiary {
        background-color: var(--semi-color-tertiary)
    }

    .semi-button-group-line-warning {
        background-color: var(--semi-color-warning)
    }

    .semi-button-group-line-danger {
        background-color: var(--semi-color-danger)
    }

    .semi-button-group-line-disabled {
        background-color: var(--semi-color-disabled-bg)
    }

    .semi-button-group-line-light {
        background-color: var(--semi-color-fill-0)
    }

    .semi-button-group-line-borderless {
        background-color: transparent
    }

    .semi-button-group-line:before {
        content: "";
        background-color: var(--semi-color-border);
        width: 1px;
        height: 20px;
        display: block
    }

    .semi-rtl .semi-button,
    .semi-portal-rtl .semi-button {
        direction: rtl;
        padding-left: 12px;
        padding-right: 12px
    }

    .semi-rtl .semi-button-size-small,
    .semi-portal-rtl .semi-button-size-small {
        padding-left: 12px;
        padding-right: 12px
    }

    .semi-rtl .semi-button-size-large,
    .semi-portal-rtl .semi-button-size-large {
        padding-left: 16px;
        padding-right: 16px
    }

    .semi-rtl .semi-button-group,
    .semi-portal-rtl .semi-button-group {
        direction: rtl
    }

    .semi-rtl .semi-button-group>.semi-button,
    .semi-portal-rtl .semi-button-group>.semi-button {
        padding-left: 0;
        padding-right: 0
    }

    .semi-rtl .semi-button-group>.semi-button .semi-button-content,
    .semi-portal-rtl .semi-button-group>.semi-button .semi-button-content {
        padding-left: 12px;
        padding-right: 12px
    }

    .semi-rtl .semi-button-group>.semi-button-size-large .semi-button-content,
    .semi-portal-rtl .semi-button-group>.semi-button-size-large .semi-button-content {
        padding-left: 16px;
        padding-right: 16px
    }

    .semi-rtl .semi-button-group>.semi-button-size-small .semi-button-content,
    .semi-portal-rtl .semi-button-group>.semi-button-size-small .semi-button-content {
        padding-left: 12px;
        padding-right: 12px
    }

    .semi-rtl .semi-button-group>.semi-button.semi-button-with-icon-only,
    .semi-portal-rtl .semi-button-group>.semi-button.semi-button-with-icon-only {
        padding-left: 0;
        padding-right: 0
    }

    .semi-rtl .semi-button-group>.semi-button.semi-button-with-icon-only .semi-button-content,
    .semi-portal-rtl .semi-button-group>.semi-button.semi-button-with-icon-only .semi-button-content {
        padding-left: 8px;
        padding-right: 8px
    }

    .semi-rtl .semi-button-group>.semi-button.semi-button-with-icon-only.semi-button-size-small .semi-button-content,
    .semi-portal-rtl .semi-button-group>.semi-button.semi-button-with-icon-only.semi-button-size-small .semi-button-content {
        padding-left: 4px;
        padding-right: 4px
    }

    .semi-rtl .semi-button-group>.semi-button.semi-button-with-icon-only.semi-button-size-large .semi-button-content,
    .semi-portal-rtl .semi-button-group>.semi-button.semi-button-with-icon-only.semi-button-size-large .semi-button-content {
        padding-left: 12px;
        padding-right: 12px
    }

    .semi-rtl .semi-button-group>.semi-button:first-child,
    .semi-portal-rtl .semi-button-group>.semi-button:first-child {
        border-top-left-radius: 0;
        border-bottom-left-radius: 0;
        border-top-right-radius: var(--semi-border-radius-small);
        border-bottom-right-radius: var(--semi-border-radius-small)
    }

    .semi-rtl .semi-button-group>.semi-button:not(:last-child) .semi-button-content,
    .semi-portal-rtl .semi-button-group>.semi-button:not(:last-child) .semi-button-content {
        border-left: 1px var(--semi-color-border)solid;
        border-right: 0
    }

    .semi-rtl .semi-button-group>.semi-button:last-child,
    .semi-portal-rtl .semi-button-group>.semi-button:last-child {
        border-top-right-radius: 0;
        border-bottom-right-radius: 0;
        border-top-left-radius: var(--semi-border-radius-small);
        border-bottom-left-radius: var(--semi-border-radius-small)
    }

    .semi-rtl .semi-button.semi-button-with-icon-only,
    .semi-portal-rtl .semi-button.semi-button-with-icon-only {
        padding-left: 8px;
        padding-right: 8px
    }

    .semi-rtl .semi-button.semi-button-with-icon-only.semi-button-size-small,
    .semi-portal-rtl .semi-button.semi-button-with-icon-only.semi-button-size-small {
        padding-left: 4px;
        padding-right: 4px
    }

    .semi-rtl .semi-button.semi-button-with-icon-only.semi-button-size-large,
    .semi-portal-rtl .semi-button.semi-button-with-icon-only.semi-button-size-large {
        padding-left: 12px;
        padding-right: 12px
    }

    .semi-rtl .semi-button-content-left,
    .semi-portal-rtl .semi-button-content-left {
        margin-left: 8px;
        margin-right: 0
    }

    .semi-rtl .semi-button-content-right,
    .semi-portal-rtl .semi-button-content-right {
        margin-left: 0;
        margin-right: 8px
    }
}


.semi-icon {
    text-align: center;
    text-transform: none;
    text-rendering: optimizeLegibility;
    fill: currentColor;
    font-style: normal;
    line-height: 0;
    display: inline-block
}

.semi-icon-extra-small {
    font-size: 8px
}

.semi-icon-small {
    font-size: 12px
}

.semi-icon-default {
    font-size: 16px
}

.semi-icon-large {
    font-size: 20px
}

.semi-icon-extra-large {
    font-size: 24px
}

.semi-icon-spinning {
    animation: .6s linear infinite forwards semi-icon-animation-rotate
}

@keyframes semi-icon-animation-rotate {
    0% {
        transform: rotate(0)
    }

    to {
        transform: rotate(360deg)
    }
}


@layer base {
    @keyframes semi-animation-rotate {
        0% {
            transform: rotate(0)
        }

        to {
            transform: rotate(360deg)
        }
    }

    .semi-button.semi-button-with-icon {
        align-items: center;
        display: inline-flex
    }

    .semi-button.semi-button-with-icon .semi-button-content {
        justify-content: center;
        align-items: center;
        display: flex
    }

    .semi-button.semi-button-loading {
        pointer-events: none;
        cursor: not-allowed
    }

    .semi-button.semi-button-loading .semi-button-content>svg,
    .semi-button.semi-button-loading .semi-button-content-loading-icon {
        width: 16px;
        height: 16px;
        animation: .6s linear infinite forwards semi-animation-rotate
    }

    .semi-button.semi-button-with-icon-only {
        justify-content: center;
        align-items: center;
        width: 32px;
        height: 32px;
        padding: 8px
    }

    .semi-button.semi-button-with-icon-only.semi-button-size-small {
        width: 24px;
        height: 24px;
        padding: 4px
    }

    .semi-button.semi-button-with-icon-only.semi-button-size-large {
        width: 40px;
        height: 40px;
        padding: 12px
    }

    .semi-button-content-left {
        align-items: center;
        margin-right: 8px;
        display: flex
    }

    .semi-button-content-right {
        align-items: center;
        margin-left: 8px;
        display: flex
    }

    .semi-rtl .semi-button,
    .semi-portal-rtl .semi-button {
        direction: rtl;
        padding-left: 12px;
        padding-right: 12px
    }

    .semi-rtl .semi-button-size-small,
    .semi-portal-rtl .semi-button-size-small {
        padding-left: 12px;
        padding-right: 12px
    }

    .semi-rtl .semi-button-size-large,
    .semi-portal-rtl .semi-button-size-large {
        padding-left: 16px;
        padding-right: 16px
    }

    .semi-rtl .semi-button-group,
    .semi-portal-rtl .semi-button-group {
        direction: rtl
    }

    .semi-rtl .semi-button-group>.semi-button,
    .semi-portal-rtl .semi-button-group>.semi-button {
        padding-left: 0;
        padding-right: 0
    }

    .semi-rtl .semi-button-group>.semi-button .semi-button-content,
    .semi-portal-rtl .semi-button-group>.semi-button .semi-button-content {
        padding-left: 12px;
        padding-right: 12px
    }

    .semi-rtl .semi-button-group>.semi-button-size-large .semi-button-content,
    .semi-portal-rtl .semi-button-group>.semi-button-size-large .semi-button-content {
        padding-left: 16px;
        padding-right: 16px
    }

    .semi-rtl .semi-button-group>.semi-button-size-small .semi-button-content,
    .semi-portal-rtl .semi-button-group>.semi-button-size-small .semi-button-content {
        padding-left: 12px;
        padding-right: 12px
    }

    .semi-rtl .semi-button-group>.semi-button.semi-button-with-icon-only,
    .semi-portal-rtl .semi-button-group>.semi-button.semi-button-with-icon-only {
        padding-left: 0;
        padding-right: 0
    }

    .semi-rtl .semi-button-group>.semi-button.semi-button-with-icon-only .semi-button-content,
    .semi-portal-rtl .semi-button-group>.semi-button.semi-button-with-icon-only .semi-button-content {
        padding-left: 8px;
        padding-right: 8px
    }

    .semi-rtl .semi-button-group>.semi-button.semi-button-with-icon-only.semi-button-size-small .semi-button-content,
    .semi-portal-rtl .semi-button-group>.semi-button.semi-button-with-icon-only.semi-button-size-small .semi-button-content {
        padding-left: 4px;
        padding-right: 4px
    }

    .semi-rtl .semi-button-group>.semi-button.semi-button-with-icon-only.semi-button-size-large .semi-button-content,
    .semi-portal-rtl .semi-button-group>.semi-button.semi-button-with-icon-only.semi-button-size-large .semi-button-content {
        padding-left: 12px;
        padding-right: 12px
    }

    .semi-rtl .semi-button-group>.semi-button:first-child,
    .semi-portal-rtl .semi-button-group>.semi-button:first-child {
        border-top-left-radius: 0;
        border-bottom-left-radius: 0;
        border-top-right-radius: var(--semi-border-radius-small);
        border-bottom-right-radius: var(--semi-border-radius-small)
    }

    .semi-rtl .semi-button-group>.semi-button:not(:last-child) .semi-button-content,
    .semi-portal-rtl .semi-button-group>.semi-button:not(:last-child) .semi-button-content {
        border-left: 1px var(--semi-color-border)solid;
        border-right: 0
    }

    .semi-rtl .semi-button-group>.semi-button:last-child,
    .semi-portal-rtl .semi-button-group>.semi-button:last-child {
        border-top-right-radius: 0;
        border-bottom-right-radius: 0;
        border-top-left-radius: var(--semi-border-radius-small);
        border-bottom-left-radius: var(--semi-border-radius-small)
    }

    .semi-rtl .semi-button.semi-button-with-icon-only,
    .semi-portal-rtl .semi-button.semi-button-with-icon-only {
        padding-left: 8px;
        padding-right: 8px
    }

    .semi-rtl .semi-button.semi-button-with-icon-only.semi-button-size-small,
    .semi-portal-rtl .semi-button.semi-button-with-icon-only.semi-button-size-small {
        padding-left: 4px;
        padding-right: 4px
    }

    .semi-rtl .semi-button.semi-button-with-icon-only.semi-button-size-large,
    .semi-portal-rtl .semi-button.semi-button-with-icon-only.semi-button-size-large {
        padding-left: 12px;
        padding-right: 12px
    }

    .semi-rtl .semi-button-content-left,
    .semi-portal-rtl .semi-button-content-left {
        margin-left: 8px;
        margin-right: 0
    }

    .semi-rtl .semi-button-content-right,
    .semi-portal-rtl .semi-button-content-right {
        margin-left: 0;
        margin-right: 8px
    }
}


.button-min-width-KOnE_l:not(.semi-button-with-icon-only) {
    min-width: 96px
}

.button-JYnJWZ.button-size-small-pxz7z1 {
    border-radius: 6px
}

.button-JYnJWZ.button-size-small-pxz7z1 .semi-button-content-right {
    margin-left: 4px
}

.button-JYnJWZ.button-size-default-D3n_rk {
    border-radius: 8px
}

.button-JYnJWZ.button-size-default-D3n_rk .semi-button-content-right {
    margin-left: 8px
}


.footer-container-Dsl4Vk {
    text-align: center;
    padding: 12px 0 28px
}

.footer-container-Dsl4Vk * {
    vertical-align: middle
}

.footer-container-Dsl4Vk .loading-bja881,
.footer-container-Dsl4Vk .error-retry-tnuTtd {
    color: var(--semi-color-text-3, rgba(29, 28, 35, .35));
    margin-left: 10px;
    line-height: 20px
}

.footer-container-Dsl4Vk .error-retry-tnuTtd {
    cursor: pointer;
    color: var(--semi-color-focus-border, #4d53e8)
}

.footer-container-Dsl4Vk .semi-spin-middle>.semi-spin-wrapper {
    height: 16px
}

.footer-container-Dsl4Vk .semi-spin-middle>.semi-spin-wrapper svg {
    width: 16px;
    height: 16px
}

.footer-container-Dsl4Vk .load-more-btn-awMN2x {
    background: #fff;
    border-radius: 40px;
    font-weight: 600
}

.footer-container-Dsl4Vk .load-more-btn-awMN2x span {
    color: #1d1c23
}

.footer-container-Dsl4Vk .load-more-btn-awMN2x:hover {
    background: #fff;
    border: none
}

.footer-container-Dsl4Vk.responsive-foot-container-KkaQLb {
    padding: 0 0 16px
}

.footer-container-Dsl4Vk.responsive-foot-container-KkaQLb .load-more-btn-awMN2x {
    height: 40px;
    padding: 16px 24px
}


.ui-empty-drwvPc {
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
    padding-bottom: 5%;
    display: flex
}

.ui-empty-drwvPc .semi-empty-content {
    margin-top: 16px
}

.ui-empty-drwvPc .semi-empty-title {
    font-size: 16px !important
}

.ui-empty-drwvPc .semi-empty-description {
    font-size: 14px
}

.ui-empty-drwvPc .semi-empty-title+.semi-empty-description {
    margin-top: 4px
}

.ui-empty-drwvPc .semi-empty-footer {
    justify-content: center;
    display: flex
}


.empty-JCGD7N {
    height: 100%;
    overflow: visible
}

.empty-JCGD7N .spin-CEHI0h {
    width: 100%;
    height: 100%;
    display: block
}

.empty-JCGD7N .spin-CEHI0h .semi-spin-wrapper {
    justify-content: center;
    display: flex;
    position: absolute
}

.empty-JCGD7N .spin-CEHI0h .semi-spin-wrapper svg {
    width: 24px;
    height: 24px
}

.empty-JCGD7N .spin-CEHI0h .semi-tabs-content {
    padding: 0
}

.empty-JCGD7N .spin-CEHI0h .semi-spin-children {
    height: 100%
}

.empty-JCGD7N .spin-CEHI0h .loading-text-O07uXS {
    color: var(--semi-color-text-3, rgba(29, 28, 35, .35));
    margin-left: 8px;
    font-size: 16px;
    font-weight: 400;
    line-height: 22px
}


.height-whole-100-lAOZbr {
    height: 100%;
    overflow: visible
}


.coz-empty-state .semi-empty-image svg {
    color: rgba(var(--coze-fg-1), var(--coze-fg-1-alpha))
}

.coz-empty-state .semi-empty-content {
    margin-top: var(--coze-8)
}

.coz-empty-state .semi-empty-content .semi-empty-title {
    color: rgba(var(--coze-fg-3), var(--coze-fg-3-alpha));
    font-weight: 500
}

.coz-empty-state .semi-empty-content .semi-empty-description {
    color: rgba(var(--coze-fg-1), var(--coze-fg-1-alpha));
    margin-top: 0
}

.coz-empty-state .semi-empty-content .semi-empty-footer {
    margin-top: var(--coze-16);
    flex-direction: column;
    align-items: center;
    display: flex
}

.coz-empty-state.coz-empty-state-full_screen {
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%
}

.coz-empty-state.coz-empty-state-full_screen .semi-empty-image {
    height: var(--coze-160);
    width: var(--coze-160)
}

.coz-empty-state.coz-empty-state-full_screen .semi-empty-image>.illustration-icon {
    width: 100%;
    height: 100%
}

.coz-empty-state.coz-empty-state-full_screen .semi-empty-content {
    max-width: 400px
}

.coz-empty-state.coz-empty-state-full_screen .semi-empty-content .semi-empty-title {
    font-size: 20px;
    line-height: 1.75rem
}

.coz-empty-state.coz-empty-state-full_screen .semi-empty-content .semi-empty-description {
    font-size: var(--coze-14);
    left: 1.25rem
}

.coz-empty-state.coz-empty-state-large .semi-empty-image svg {
    font-size: 48px
}

.coz-empty-state.coz-empty-state-large .semi-empty-content .semi-empty-title {
    font-size: 16px;
    line-height: 22px
}

.coz-empty-state.coz-empty-state-large .semi-empty-content .semi-empty-description {
    font-size: var(--coze-12);
    line-height: 1rem
}

.coz-empty-state.coz-empty-state-default .semi-empty-image svg {
    font-size: 32px
}

.coz-empty-state.coz-empty-state-default .semi-empty-content {
    margin-top: var(--coze-4)
}

.coz-empty-state.coz-empty-state-default .semi-empty-content .semi-empty-title {
    font-size: var(--coze-14);
    line-height: 1.25rem
}

.coz-empty-state.coz-empty-state-default .semi-empty-content .semi-empty-description {
    font-size: var(--coze-12);
    line-height: 1rem
}

.coz-empty-state.coz-empty-state-default .semi-empty-content .semi-empty-footer {
    margin-top: var(--coze-12)
}


.coz-loading-wrapper.coz-loading-large,
.coz-loading-wrapper.coz-loading-large .semi-spin-wrapper svg {
    height: var(--coze-32);
    width: var(--coze-32)
}

.coz-loading-wrapper.coz-loading-middle,
.coz-loading-wrapper.coz-loading-middle .semi-spin-wrapper svg {
    height: var(--coze-24);
    width: var(--coze-24)
}

.coz-loading-wrapper.coz-loading-normal,
.coz-loading-wrapper.coz-loading-normal .semi-spin-wrapper svg {
    height: var(--coze-20);
    width: var(--coze-20)
}

.coz-loading-wrapper.coz-loading-small,
.coz-loading-wrapper.coz-loading-small .semi-spin-wrapper svg {
    height: var(--coze-14);
    width: var(--coze-14)
}

.coz-loading-wrapper.semi-spin-block {
    width: 100%
}

.coz-loading-wrapper .semi-spin-animate {
    animation-duration: 1.3s
}


.coz-input {
    padding-left: var(--coze-4);
    padding-right: var(--coze-4)
}

.coz-input input {
    display: inline-block
}

.coz-input input::placeholder {
    color: rgba(var(--coze-fg-1), var(--coze-fg-1-alpha))
}

.coz-input input::placeholder {
    color: rgba(var(--coze-fg-1), var(--coze-fg-1-alpha))
}

.coz-input input::placeholder {
    color: rgba(var(--coze-fg-1), var(--coze-fg-1-alpha))
}

.coz-input input:focus {
    --tw-ring-color: transparent
}

.coz-input.semi-input-wrapper {
    border-radius: var(--coze-8);
    height: var(--coze-32);
    border-color: rgba(var(--coze-stroke-6), var(--coze-stroke-6-alpha));
    background-color: transparent
}

.coz-input.semi-input-wrapper:hover {
    background-color: rgba(var(--coze-bg-5), var(--coze-bg-5-alpha))
}

.coz-input.semi-input-wrapper:active {
    background-color: rgba(var(--coze-bg-6), var(--coze-bg-6-alpha))
}

.coz-input.semi-input-wrapper.semi-input-wrapper-focus {
    border-color: rgba(var(--coze-brand-5), 1);
    background-color: transparent
}

.coz-input.semi-input-wrapper.coz-input-error,
.coz-input.semi-input-wrapper.semi-input-wrapper-error {
    border-color: rgba(var(--coze-red-5), 1)
}

.coz-input.semi-input-wrapper-disabled,
.coz-input.semi-input-wrapper-disabled:hover {
    background-color: rgba(var(--coze-bg-5), var(--coze-bg-5-alpha))
}

.coz-input.semi-input-wrapper-disabled {
    border-color: rgba(var(--coze-stroke-5), var(--coze-stroke-5-alpha))
}

.coz-input.semi-input-wrapper-default>input {
    font-size: var(--coze-14)
}

.coz-input.semi-input-wrapper-focus.semi-input-wrapper-small {
    border-color: rgba(var(--coze-brand-5), 1);
    background-color: transparent
}

.coz-input.semi-input-wrapper-small>input {
    font-size: var(--coze-12);
    padding-left: var(--coze-2);
    padding-right: var(--coze-2)
}

.coz-input.semi-input-wrapper-large {
    border-radius: var(--coze-10);
    height: var(--coze-40)
}

.coz-input.semi-input-wrapper-large>input {
    font-size: var(--coze-16);
    padding-left: var(--coze-4);
    padding-right: var(--coze-4)
}

.coz-input.semi-input-wrapper-small {
    border-radius: var(--coze-6);
    height: var(--coze-24)
}

.coz-input .semi-input {
    color: rgba(var(--coze-fg-3), var(--coze-fg-3-alpha));
    caret-color: rgba(var(--coze-brand-5), 1);
    background-color: transparent
}

.coz-input .semi-input ::-moz-selection {
    background-color: rgba(var(--coze-brand-3), var(--coze-brand-3-alpha))
}

.coz-input .semi-input ::selection {
    background-color: rgba(var(--coze-brand-3), var(--coze-brand-3-alpha))
}

.coz-input .semi-input::-moz-selection {
    background-color: rgba(var(--coze-brand-3), var(--coze-brand-3-alpha))
}

.coz-input .semi-input::selection {
    background-color: rgba(var(--coze-brand-3), var(--coze-brand-3-alpha))
}

.coz-input .semi-input-disabled {
    cursor: not-allowed;
    color: rgba(var(--coze-fg-1), var(--coze-fg-1-alpha))
}

.coz-input .semi-input-default {
    --tw-shadow: 0 0 transparent;
    --tw-shadow-colored: 0 0 transparent;
    box-shadow: var(--tw-ring-offset-shadow, 0 0 transparent), var(--tw-ring-shadow, 0 0 transparent), var(--tw-shadow);
    --tw-ring-offset-shadow: var(--tw-ring-inset)0 0 0 var(--tw-ring-offset-width)var(--tw-ring-offset-color);
    --tw-ring-shadow: var(--tw-ring-inset)0 0 0 calc(0px + var(--tw-ring-offset-width))var(--tw-ring-color);
    box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 transparent);
    height: var(--coze-24);
    padding-left: var(--coze-4);
    padding-right: var(--coze-4);
    padding-top: var(--coze-2);
    padding-bottom: var(--coze-2);
    font-size: .875rem;
    line-height: 1.25rem
}

.coz-input .semi-input-default::placeholder {
    color: rgba(var(--coze-fg-1), var(--coze-fg-1-alpha))
}

.coz-input .semi-input-default::placeholder {
    color: rgba(var(--coze-fg-1), var(--coze-fg-1-alpha))
}

.coz-input .semi-input-default::placeholder {
    color: rgba(var(--coze-fg-1), var(--coze-fg-1-alpha))
}

.coz-input .semi-input-small {
    --tw-shadow: 0 0 transparent;
    --tw-shadow-colored: 0 0 transparent;
    box-shadow: var(--tw-ring-offset-shadow, 0 0 transparent), var(--tw-ring-shadow, 0 0 transparent), var(--tw-shadow);
    --tw-ring-offset-shadow: var(--tw-ring-inset)0 0 0 var(--tw-ring-offset-width)var(--tw-ring-offset-color);
    --tw-ring-shadow: var(--tw-ring-inset)0 0 0 calc(0px + var(--tw-ring-offset-width))var(--tw-ring-color);
    box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 transparent);
    font-size: .875rem;
    line-height: 1.25rem
}

.coz-input .semi-input-small::placeholder {
    color: rgba(var(--coze-fg-1), var(--coze-fg-1-alpha))
}

.coz-input .semi-input-small::placeholder {
    color: rgba(var(--coze-fg-1), var(--coze-fg-1-alpha))
}

.coz-input .semi-input-small::placeholder {
    color: rgba(var(--coze-fg-1), var(--coze-fg-1-alpha))
}

.coz-input.semi-input-wrapper__with-prefix .semi-input,
.coz-input.semi-input-wrapper__with-suffix .semi-input {
    padding-left: var(--coze-4);
    padding-right: var(--coze-4)
}

.coz-input .semi-input-prefix,
.coz-input .semi-input-suffix {
    margin-left: var(--coze-4);
    margin-right: var(--coze-4);
    color: rgba(var(--coze-fg-2), var(--coze-fg-2-alpha));
    font-size: .75rem;
    font-weight: 400;
    line-height: 1rem
}

.coz-input .semi-spin-wrapper {
    height: var(--coze-14)
}


.semi-select.coz-select:not(.does-not-exist),
.semi-select.coz-select-tag-popover.semi-popover-wrapper {
    color: rgba(var(--coze-fg-3), var(--coze-fg-3-alpha));
    border-color: rgba(var(--coze-stroke-6), var(--coze-stroke-6-alpha));
    border-radius: var(--coze-8);
    height: var(--coze-32);
    background-color: transparent
}

.semi-select.coz-select:not(.does-not-exist):hover,
.semi-select.coz-select-tag-popover.semi-popover-wrapper:hover {
    background-color: rgba(var(--coze-bg-5), var(--coze-bg-5-alpha))
}

.semi-select.coz-select:not(.does-not-exist):active,
.semi-select.coz-select-tag-popover.semi-popover-wrapper:active {
    background-color: rgba(var(--coze-bg-6), var(--coze-bg-6-alpha))
}

.semi-select-small.coz-select:not(.does-not-exist),
.semi-select-small.coz-select-tag-popover.semi-popover-wrapper {
    border-radius: var(--coze-6);
    height: var(--coze-24)
}

.semi-select-small.coz-select:not(.does-not-exist) .semi-select-selection,
.semi-select-small.coz-select-tag-popover.semi-popover-wrapper .semi-select-selection {
    margin-left: var(--coze-4)
}

.semi-select-small.coz-select:not(.does-not-exist) .semi-select-selection-text,
.semi-select-small.coz-select-tag-popover.semi-popover-wrapper .semi-select-selection-text {
    font-size: var(--coze-12);
    color: rgba(var(--coze-fg-3), var(--coze-fg-3-alpha))
}

.semi-select-small.coz-select:not(.does-not-exist) .semi-select-clear,
.semi-select-small.coz-select-tag-popover.semi-popover-wrapper .semi-select-clear {
    margin-top: var(--coze-1);
    margin-right: var(--coze-1)
}

.semi-select-large.coz-select:not(.does-not-exist),
.semi-select-large.coz-select-tag-popover.semi-popover-wrapper {
    border-radius: var(--coze-10);
    height: var(--coze-40)
}

.semi-select-error.coz-select:not(.does-not-exist),
.semi-select-error.coz-select-tag-popover.semi-popover-wrapper {
    border-color: rgba(var(--coze-red-5), 1)
}

.semi-select-warning.coz-select:not(.does-not-exist),
.semi-select-warning.coz-select-tag-popover.semi-popover-wrapper {
    border-color: rgba(var(--coze-yellow-5), 1)
}

.semi-select-open.coz-select:not(.does-not-exist),
.semi-select-open.coz-select-tag-popover.semi-popover-wrapper {
    border-color: rgba(var(--coze-brand-5), 1)
}

.semi-select-multiple.coz-select:not(.does-not-exist),
.semi-select-multiple.coz-select-tag-popover.semi-popover-wrapper {
    height: var(--coze-32)
}

.semi-select-multiple.coz-select:not(.does-not-exist) .semi-select-content-wrapper,
.semi-select-multiple.coz-select-tag-popover.semi-popover-wrapper .semi-select-content-wrapper {
    flex-wrap: nowrap
}

.coz-select:not(.does-not-exist) .semi-select-selection,
.coz-select-tag-popover.semi-popover-wrapper .semi-select-selection {
    margin-left: var(--coze-8)
}

.coz-select:not(.does-not-exist) .semi-select-selection .semi-select-selection-text,
.coz-select-tag-popover.semi-popover-wrapper .semi-select-selection .semi-select-selection-text {
    font-size: var(--coze-14);
    color: rgba(var(--coze-fg-3), var(--coze-fg-3-alpha));
    font-weight: 400
}

.coz-select:not(.does-not-exist) .semi-select-selection .semi-select-selection-placeholder,
.coz-select-tag-popover.semi-popover-wrapper .semi-select-selection .semi-select-selection-placeholder {
    color: rgba(var(--coze-fg-1), var(--coze-fg-1-alpha))
}

.coz-select:not(.does-not-exist) .semi-select-selection .semi-select-selection-text-inactive,
.coz-select-tag-popover.semi-popover-wrapper .semi-select-selection .semi-select-selection-text-inactive {
    opacity: .3
}

.coz-select:not(.does-not-exist) .semi-tag-closable,
.coz-select-tag-popover.semi-popover-wrapper .semi-tag-closable {
    border-width: var(--coze-1);
    background-color: rgba(var(--coze-bg-4), var(--coze-bg-4-alpha));
    border-color: rgba(var(--coze-stroke-5), var(--coze-stroke-5-alpha))
}

.coz-select:not(.does-not-exist) .semi-select-arrow,
.coz-select-tag-popover.semi-popover-wrapper .semi-select-arrow {
    width: -moz-fit-content;
    width: fit-content;
    padding-left: var(--coze-4);
    padding-right: var(--coze-4);
    margin-right: var(--coze-3)
}

.coz-select:not(.does-not-exist) .semi-select-clear,
.coz-select-tag-popover.semi-popover-wrapper .semi-select-clear {
    padding-left: var(--coze-2);
    padding-right: var(--coze-2);
    padding-top: var(--coze-2);
    padding-bottom: var(--coze-2);
    width: var(--coze-20);
    height: var(--coze-20);
    border-radius: var(--coze-4);
    margin-top: var(--coze-5);
    margin-right: var(--coze-4)
}

.coz-select:not(.does-not-exist) .semi-select-clear:hover,
.coz-select-tag-popover.semi-popover-wrapper .semi-select-clear:hover {
    color: rgba(var(--coze-fg-2), var(--coze-fg-2-alpha));
    background-color: rgba(var(--coze-bg-5), var(--coze-bg-5-alpha))
}

.coz-select:not(.does-not-exist) .semi-input.semi-input-default:focus,
.coz-select-tag-popover.semi-popover-wrapper .semi-input.semi-input-default:focus {
    --tw-shadow: 0 0 transparent;
    --tw-shadow-colored: 0 0 transparent;
    box-shadow: var(--tw-ring-offset-shadow, 0 0 transparent), var(--tw-ring-shadow, 0 0 transparent), var(--tw-shadow);
    --tw-ring-offset-shadow: var(--tw-ring-inset)0 0 0 var(--tw-ring-offset-width)var(--tw-ring-offset-color);
    --tw-ring-shadow: var(--tw-ring-inset)0 0 0 calc(0px + var(--tw-ring-offset-width))var(--tw-ring-color);
    box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 transparent);
    border-style: none
}

.coz-select:not(.does-not-exist) .semi-input.semi-input-default,
.coz-select-tag-popover.semi-popover-wrapper .semi-input.semi-input-default {
    background-color: transparent
}

.coz-select-tag-popover.semi-popover-wrapper {
    background-color: rgba(var(--coze-bg-3), var(--coze-bg-3-alpha));
    padding: var(--coze-4)
}

.coz-select-tag-popover.semi-popover-wrapper .semi-popover-icon-arrow {
    color: rgba(var(--coze-bg-3), var(--coze-bg-3-alpha))
}

.coz-select-tag-popover.semi-popover-wrapper .semi-popover-icon-arrow path {
    fill: currentColor
}

.coz-select-dropdown.semi-select-option-list-wrapper {
    background-color: rgba(var(--coze-bg-3), var(--coze-bg-3-alpha));
    border-radius: var(--coze-8);
    border-width: var(--coze-1);
    padding: var(--coze-4);
    border-style: solid;
    border-color: rgba(var(--coze-stroke-5), var(--coze-stroke-5-alpha))
}

.coz-select-dropdown.semi-select-option-list-wrapper .semi-select-option-list {
    gap: var(--coze-2);
    flex-direction: column;
    display: flex
}

.coz-select-dropdown.semi-select-option-list-wrapper .semi-select-group {
    padding-top: var(--coze-4);
    padding-bottom: var(--coze-4);
    padding-left: var(--coze-8);
    padding-right: var(--coze-8);
    color: rgba(var(--coze-fg-2), var(--coze-fg-2-alpha))
}

.coz-select-dropdown.semi-select-option-list-wrapper.showTick .semi-select-group {
    padding-left: 32px
}

.coz-select-dropdown.semi-select-option-list-wrapper .coz-select-option-item {
    cursor: pointer;
    vertical-align: middle;
    border-radius: var(--coze-4);
    align-items: center;
    display: flex
}

.coz-select-dropdown.semi-select-option-list-wrapper .coz-select-option-item:active {
    background-color: rgba(var(--coze-bg-6), var(--coze-bg-6-alpha))
}

.coz-select-dropdown.semi-select-option-list-wrapper .coz-select-option-item:hover {
    background-color: rgba(var(--coze-bg-5), var(--coze-bg-5-alpha))
}

.coz-select-dropdown.semi-select-option-list-wrapper .coz-select-option-item .option-prefix-icon {
    width: var(--coze-24);
    min-width: var(--coze-24);
    min-height: var(--coze-32);
    padding: var(--coze-8);
    align-items: center;
    padding-right: 0;
    display: flex
}

.coz-select-dropdown.semi-select-option-list-wrapper .coz-select-option-item .option-text-wrapper {
    min-height: var(--coze-32);
    flex: 1;
    align-items: center;
    display: flex
}

.coz-select-dropdown.semi-select-option-list-wrapper .coz-select-option-item .option-text {
    line-height: var(--coze-16);
    color: rgba(var(--coze-fg-4), var(--coze-fg-4-alpha));
    padding-left: var(--coze-8);
    padding-right: var(--coze-8)
}

.coz-select-dropdown.semi-select-option-list-wrapper .coz-select-option-item.disabled {
    cursor: not-allowed
}

.coz-select-dropdown.semi-select-option-list-wrapper .coz-select-option-item.disabled .option-text,
.coz-select-dropdown.semi-select-option-list-wrapper .coz-select-option-item.disabled .coz-select-option-item-icon-selected {
    color: rgba(var(--coze-fg-1), var(--coze-fg-1-alpha))
}

.coz-select-dropdown.semi-select-option-list-wrapper .coz-select-option-item.disabled .coz-select-option-item-icon-multiple-selected {
    color: rgba(var(--coze-stroke-5), var(--coze-stroke-5-alpha));
    fill: currentColor;
    background-color: rgba(var(--coze-bg-4), var(--coze-bg-4-alpha));
    border-color: rgba(var(--coze-stroke-5), var(--coze-stroke-5-alpha));
    border-width: var(--coze-1);
    border-radius: var(--coze-4);
    border-style: solid
}

.coz-select-dropdown.semi-select-option-list-wrapper .coz-select-option-item.disabled .coz-select-option-item-icon-multiple-unselected {
    width: var(--coze-16);
    height: var(--coze-16);
    background-color: rgba(var(--coze-bg-4), var(--coze-bg-4-alpha));
    border-color: rgba(var(--coze-stroke-5), var(--coze-stroke-5-alpha));
    border-width: var(--coze-1);
    border-radius: var(--coze-4);
    border-style: solid
}

.coz-select-dropdown.semi-select-option-list-wrapper .coz-select-option-item .coz-select-option-item-icon-selected {
    color: rgba(var(--coze-brand-6), 1)
}

.coz-select-dropdown.semi-select-option-list-wrapper .coz-select-option-item .coz-select-option-item-icon-multiple-selected {
    color: rgb(var(--white-1));
    fill: currentColor;
    background-color: rgba(var(--coze-brand-6), 1);
    border-color: rgba(var(--coze-brand-6), 1);
    border-width: var(--coze-1);
    border-radius: var(--coze-4);
    border-style: solid
}

.coz-select-dropdown.semi-select-option-list-wrapper .coz-select-option-item .coz-select-option-item-icon-multiple-unselected {
    width: var(--coze-16);
    height: var(--coze-16);
    border-color: rgba(var(--coze-stroke-5), var(--coze-stroke-5-alpha));
    border-width: var(--coze-1);
    border-radius: var(--coze-4);
    background-color: transparent;
    border-style: solid
}

.semi-input-group .coz-select.semi-select:after {
    display: none
}

.semi-input-group .coz-select.semi-select:first-child {
    border-top-left-radius: var(--coze-8);
    border-bottom-left-radius: var(--coze-8);
    border-top-right-radius: 0;
    border-bottom-right-radius: 0
}

.semi-input-group .coz-select.semi-select:last-child {
    border-top-right-radius: var(--coze-8);
    border-bottom-right-radius: var(--coze-8);
    border-top-left-radius: 0;
    border-bottom-left-radius: 0
}

.semi-input-group .coz-select.semi-select:not(:first-child) {
    border-left-width: 0
}

.semi-input-group .coz-select.semi-select.semi-select-focus:not(:first-child) {
    border-width: var(--coze-1);
    border-color: rgba(var(--coze-brand-5), 1);
    margin-left: -1px
}

div[class~=semi-popover-wrapper] {
    --tw-shadow: 0 4px 12px 0px rgba(var(--coze-shadow-0), .08), 0px 8px 24px 0px rgba(var(--coze-shadow-0), .04);
    --tw-shadow-colored: 0 4px 12px 0px var(--tw-shadow-color), 0px 8px 24px 0px var(--tw-shadow-color);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 transparent), var(--tw-ring-shadow, 0 0 transparent), var(--tw-shadow);
    background-color: rgba(var(--coze-bg-3), var(--coze-bg-3-alpha))
}

.coz-select-chip-mode.semi-select.coz-select {
    border-color: transparent
}

.coz-select-chip-mode.semi-select.semi-select-open {
    border-color: rgba(var(--coze-brand-5), 1)
}


.chip-icon {
    align-items: center;
    display: inline-flex
}

.chip-delete-icon {
    transition: all .2s
}

@keyframes spin {
    0% {
        transform: rotate(0)
    }

    to {
        transform: rotate(360deg)
    }
}

.animate-spin {
    animation: 1s linear infinite spin
}


.coz-doc-page-m2ceOD {
    -webkit-user-select: text;
    -moz-user-select: text;
    -ms-user-select: text;
    user-select: text;
    width: 100%;
    height: 100%;
    overflow-y: auto
}

.coz-doc-page-m2ceOD .icon-link {
    vertical-align: text-top;
    margin-left: 8px;
    line-height: 1;
    display: none
}

.coz-doc-page-m2ceOD .icon-link.icon-link-hover {
    display: inline-block
}

.coz-doc-page-m2ceOD .title-icon-link {
    text-align: center;
    margin-bottom: -2px;
    margin-left: 8px;
    display: none
}

.coz-doc-page-m2ceOD .title-icon-link.icon-link-hover {
    display: inline-flex
}

.coz-doc-page-m2ceOD .icon-link>div {
    display: inline
}

.coz-doc-page-m2ceOD .arco-anchor-link {
    display: flex
}

.coz-doc-page-m2ceOD .arco-anchor-link .icon-link {
    align-self: center;
    line-height: normal
}

.coz-doc-page-m2ceOD .arco-anchor-link .with-icon-link {
    color: var(--coz-fg-hglt)
}

.coz-doc-page-m2ceOD .doc-anchor>.doc-anchor-list .with-icon-link {
    max-width: 204px
}

.coz-doc-page-m2ceOD .arco-anchor-line-slider {
    background-color: var(--coz-fg-hglt);
    margin-top: 6px
}

.coz-doc-page-m2ceOD .arco-anchor-link-title {
    color: rgba(var(--coze-fg-2), var(--coze-fg-2-alpha));
    padding: 2px 6px;
    line-height: 20px
}

.coz-doc-page-m2ceOD .arco-anchor-link-title:hover {
    background-color: inherit;
    color: rgba(var(--coze-fg-3), var(--coze-fg-3-alpha))
}

.coz-doc-page-m2ceOD .arco-anchor-link-active>.arco-anchor-link-title {
    color: var(--coz-fg-hglt)
}

.coz-doc-page-m2ceOD .editor-kit-code-block .code-block-content .code-block-zone-container {
    margin-left: 0
}

.coz-doc-page-m2ceOD .render-container .doc-content {
    min-width: 656px;
    max-width: inherit;
    padding: 0
}

.coz-doc-page-m2ceOD .editor-css-container .docPageHeader {
    padding: 24px 24px 0
}

.coz-doc-page-m2ceOD .doc-anchor>.doc-anchor-list {
    margin-top: 102px
}

.coz-doc-page-m2ceOD .docSwitch .arco-btn {
    color: rgba(var(--coze-fg-3), var(--coze-fg-3-alpha));
    padding: 0;
    font-size: 16px;
    font-weight: 500;
    line-height: 22px;
    right: 0
}

.coz-doc-page-m2ceOD .docSwitch .arco-btn:hover {
    color: var(--coz-mg-hglt-plus-hovered);
    background-color: inherit
}

.coz-doc-page-m2ceOD .docSwitch .jumpLeft {
    color: rgba(var(--coze-fg-2), var(--coze-fg-2-alpha));
    padding: 0;
    font-size: 14px;
    font-weight: 500;
    line-height: 20px
}

.coz-doc-page-m2ceOD .docSwitch .jumpRight {
    color: rgba(var(--coze-fg-2), var(--coze-fg-2-alpha));
    padding: 0;
    font-size: 14px;
    font-weight: 500;
    line-height: 20px
}

@media screen and (max-width:960px) {
    .coz-doc-page-m2ceOD .doc-local-nav .doc-local-nav-item.left-menu {
        display: none
    }
}

@media screen and (min-width:1281px) {
    .coz-doc-page-m2ceOD .doc-sider {
        margin-right: 24px
    }

    .coz-doc-page-m2ceOD .doc-sider .arco-anchor {
        width: 240px
    }
}

.helpful-panel-PjG3e_ {
    z-index: 10;
    flex-direction: column;
    width: 240px;
    display: flex;
    position: fixed;
    top: 80px;
    right: 24px
}

@media screen and (max-width:1280px) {

    .helpful-panel-PjG3e_,
    .search-wrapper-ihZBd0 {
        display: none
    }
}

.search-wrapper-ihZBd0 {
    z-index: 11;
    width: 240px;
    position: fixed;
    top: 24px;
    right: 24px
}

.search-wrapper-ihZBd0 .semi-list-item {
    border-radius: 8px;
    padding: 8px 10px
}

.search-wrapper-ihZBd0 .semi-list-item:hover {
    background-color: rgba(var(--coze-bg-5), var(--coze-bg-5-alpha))
}

.search-wrapper-ihZBd0 .semi-tabs-content {
    padding: 8px 0
}

.search-wrapper-ihZBd0 .coz-tab-bar .coz-tab-bar-button .semi-tabs-bar-button .semi-tabs-tab-button.semi-tabs-tab {
    text-align: center;
    min-width: 42px;
    padding-left: 5px;
    padding-right: 5px
}

.search-wrapper-ihZBd0 .search-list-wrapper-GNmUiv {
    border-color: rgba(var(--coze-stroke-5), var(--coze-stroke-5-alpha));
    background-color: rgba(var(--coze-bg-3), var(--coze-bg-3-alpha));
    border-radius: 8px;
    width: 420px;
    min-height: 240px;
    margin-top: 8px;
    padding: 16px 8px 0;
    box-shadow: 0 8px 24px rgba(0, 0, 0, .16), 0 16px 48px rgba(0, 0, 0, .08)
}

.search-wrapper-ihZBd0 .search-list-dNWtM2 {
    min-height: 174px;
    max-height: 426px;
    overflow-y: auto
}

.search-wrapper-ihZBd0 .search-list-dNWtM2 .semi-list-footer {
    display: none
}

.search-wrapper-ihZBd0 .search-list-dNWtM2 .highlight-word {
    color: rgba(var(--coze-brand-5), 1)
}

.search-wrapper-ihZBd0 .search-list-loading-GSccs6 .semi-list-footer {
    display: block !important
}

.search-wrapper-ihZBd0 .search-item-ZDZF3I {
    justify-content: space-between;
    align-items: center;
    width: 100%;
    display: flex
}

.search-wrapper-ihZBd0 .search-item-content-vV7h8V {
    text-overflow: ellipsis;
    flex: 1;
    display: flex;
    overflow: hidden
}

.search-wrapper-focus-cwCuhf {
    width: 420px
}

.back-top-SWA5V9 {
    background-color: rgba(var(--coze-bg-3), var(--coze-bg-3-alpha));
    color: rgba(var(--coze-fg-3), var(--coze-fg-3-alpha));
    border-radius: 20px;
    justify-content: center;
    align-items: center;
    width: 40px;
    height: 40px;
    display: flex;
    bottom: 40px;
    right: 24px;
    box-shadow: 0 3.333px 10px rgba(0, 0, 0, .08), 0 6.667px 20px rgba(0, 0, 0, .04)
}


.coz-toast.semi-toast {
    margin: var(--coze-4);
    white-space: nowrap;
    border-radius: var(--coze-6);
    border-width: 0
}

.coz-toast.semi-toast .semi-toast-content {
    pointer-events: auto;
    border-radius: var(--coze-6);
    padding-left: var(--coze-16);
    padding-right: var(--coze-16);
    padding-top: var(--coze-14);
    padding-bottom: var(--coze-14);
    background-color: rgba(var(--coze-bg-3), var(--coze-bg-3-alpha));
    border-width: 0;
    justify-content: center;
    align-items: center;
    margin: 0;
    display: inline-flex
}

.coz-toast.semi-toast .semi-toast-content .semi-toast-content-text {
    margin-left: var(--coze-6);
    margin-right: var(--coze-6);
    color: rgba(var(--coze-fg-4), var(--coze-fg-4-alpha))
}

.coz-toast.semi-toast .semi-toast-close-button {
    height: var(--coze-24);
    margin-top: 0
}

.coz-toast.semi-toast .semi-toast-close-button .semi-button-borderless:not(.semi-button-disabled):hover {
    border-radius: var(--coze-4);
    background-image: none
}

.coz-toast.semi-toast.coz-toast-info .semi-toast-content {
    border-width: var(--coze-1);
    border-style: solid;
    border-color: rgba(var(--coze-brand-5), 1);
    background: linear-gradient(180deg, rgba(var(--coze-brand-1), var(--coze-brand-1-alpha))0%, rgba(var(--coze-brand-5), 0)100%), rgba(var(--coze-bg-3), var(--coze-bg-3-alpha))
}

.coz-toast.semi-toast.coz-toast-warning .semi-toast-content {
    border-width: var(--coze-1);
    border-style: solid;
    border-color: rgba(var(--coze-yellow-5), 1);
    background: linear-gradient(180deg, rgba(var(--coze-yellow-1), var(--coze-yellow-1-alpha))0%, rgba(var(--coze-yellow-5), 0)100%), rgba(var(--coze-bg-3), var(--coze-bg-3-alpha))
}

.coz-toast.semi-toast.coz-toast-success .semi-toast-content {
    border-width: var(--coze-1);
    border-style: solid;
    border-color: rgba(var(--coze-green-5), 1);
    background: linear-gradient(180deg, rgba(var(--coze-green-1), var(--coze-green-1-alpha))0%, rgba(var(--coze-green-5), 0)100%), rgba(var(--coze-bg-3), var(--coze-bg-3-alpha))
}

.coz-toast.semi-toast.coz-toast-error .semi-toast-content {
    border-width: var(--coze-1);
    border-style: solid;
    border-color: rgba(var(--coze-red-5), 1);
    background: linear-gradient(180deg, rgba(var(--coze-red-1), var(--coze-red-1-alpha))0%, rgba(var(--coze-red-5), 0)100%), rgba(var(--coze-bg-3), var(--coze-bg-3-alpha))
}


@layer properties {
    @supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))) {

        *,
        :before,
        :after {
            --tw-rotate-x: initial;
            --tw-rotate-y: initial;
            --tw-rotate-z: initial;
            --tw-skew-x: initial;
            --tw-skew-y: initial;
            --tw-border-style: solid;
            --tw-leading: initial;
            --tw-font-weight: initial;
            --tw-backdrop-blur: initial;
            --tw-backdrop-brightness: initial;
            --tw-backdrop-contrast: initial;
            --tw-backdrop-grayscale: initial;
            --tw-backdrop-hue-rotate: initial;
            --tw-backdrop-invert: initial;
            --tw-backdrop-opacity: initial;
            --tw-backdrop-saturate: initial;
            --tw-backdrop-sepia: initial;
            --tw-ease: initial
        }

        ::-ms-backdrop {
            --tw-rotate-x: initial;
            --tw-rotate-y: initial;
            --tw-rotate-z: initial;
            --tw-skew-x: initial;
            --tw-skew-y: initial;
            --tw-border-style: solid;
            --tw-leading: initial;
            --tw-font-weight: initial;
            --tw-backdrop-blur: initial;
            --tw-backdrop-brightness: initial;
            --tw-backdrop-contrast: initial;
            --tw-backdrop-grayscale: initial;
            --tw-backdrop-hue-rotate: initial;
            --tw-backdrop-invert: initial;
            --tw-backdrop-opacity: initial;
            --tw-backdrop-saturate: initial;
            --tw-backdrop-sepia: initial;
            --tw-ease: initial
        }

        ::backdrop {
            --tw-rotate-x: initial;
            --tw-rotate-y: initial;
            --tw-rotate-z: initial;
            --tw-skew-x: initial;
            --tw-skew-y: initial;
            --tw-border-style: solid;
            --tw-leading: initial;
            --tw-font-weight: initial;
            --tw-backdrop-blur: initial;
            --tw-backdrop-brightness: initial;
            --tw-backdrop-contrast: initial;
            --tw-backdrop-grayscale: initial;
            --tw-backdrop-hue-rotate: initial;
            --tw-backdrop-invert: initial;
            --tw-backdrop-opacity: initial;
            --tw-backdrop-saturate: initial;
            --tw-backdrop-sepia: initial;
            --tw-ease: initial
        }
    }
}

@layer theme {
    :root {
        --font-sans: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
        --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
        --text-sm: .875rem;
        --text-sm--line-height: calc(1.25/.875);
        --text-base--line-height: calc(1.5/1);
        --text-lg--line-height: calc(1.75/1.125);
        --font-weight-medium: 500;
        --ease-out: cubic-bezier(0, 0, .2, 1);
        --default-transition-duration: .15s;
        --default-transition-timing-function: cubic-bezier(.4, 0, .2, 1);
        --default-font-family: var(--font-sans);
        --default-mono-font-family: var(--font-mono)
    }

    :host {
        --font-sans: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
        --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
        --text-sm: .875rem;
        --text-sm--line-height: calc(1.25/.875);
        --text-base--line-height: calc(1.5/1);
        --text-lg--line-height: calc(1.75/1.125);
        --font-weight-medium: 500;
        --ease-out: cubic-bezier(0, 0, .2, 1);
        --default-transition-duration: .15s;
        --default-transition-timing-function: cubic-bezier(.4, 0, .2, 1);
        --default-font-family: var(--font-sans);
        --default-mono-font-family: var(--font-mono)
    }
}

@layer base {

    *,
    :after,
    :before {
        box-sizing: border-box;
        border: 0 solid;
        margin: 0;
        padding: 0
    }

    ::-ms-backdrop {
        box-sizing: border-box;
        border: 0 solid;
        margin: 0;
        padding: 0
    }

    ::backdrop {
        box-sizing: border-box;
        border: 0 solid;
        margin: 0;
        padding: 0
    }

    ::-webkit-file-upload-button {
        box-sizing: border-box;
        border: 0 solid;
        margin: 0;
        padding: 0
    }

    ::-ms-browse {
        box-sizing: border-box;
        border: 0 solid;
        margin: 0;
        padding: 0
    }

    ::file-selector-button {
        box-sizing: border-box;
        border: 0 solid;
        margin: 0;
        padding: 0
    }

    html {
        -webkit-text-size-adjust: 100%;
        -moz-tab-size: 4;
        tab-size: 4;
        line-height: 1.5;
        font-family: var(--default-font-family, ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");
        font-feature-settings: var(--default-font-feature-settings, normal);
        font-variation-settings: var(--default-font-variation-settings, normal);
        -webkit-tap-highlight-color: transparent
    }

    :host {
        -webkit-text-size-adjust: 100%;
        -moz-tab-size: 4;
        tab-size: 4;
        line-height: 1.5;
        font-family: var(--default-font-family, ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");
        font-feature-settings: var(--default-font-feature-settings, normal);
        font-variation-settings: var(--default-font-variation-settings, normal);
        -webkit-tap-highlight-color: transparent
    }

    hr {
        height: 0;
        color: inherit;
        border-top-width: 1px
    }

    abbr:where([title]) {
        -webkit-text-decoration: underline dotted;
        text-decoration: underline dotted
    }

    h1,
    h2,
    h3,
    h4,
    h5,
    h6 {
        font-size: inherit;
        font-weight: inherit
    }

    a {
        color: inherit;
        -webkit-text-decoration: inherit;
        -webkit-text-decoration: inherit;
        -webkit-text-decoration: inherit;
        -webkit-text-decoration: inherit;
        text-decoration: inherit
    }

    b,
    strong {
        font-weight: bolder
    }

    code,
    kbd,
    samp,
    pre {
        font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);
        font-feature-settings: var(--default-mono-font-feature-settings, normal);
        font-variation-settings: var(--default-mono-font-variation-settings, normal);
        font-size: 1em
    }

    small {
        font-size: 80%
    }

    sub,
    sup {
        vertical-align: baseline;
        font-size: 75%;
        line-height: 0;
        position: relative
    }

    sub {
        bottom: -.25em
    }

    sup {
        top: -.5em
    }

    table {
        text-indent: 0;
        border-color: inherit;
        border-collapse: collapse
    }

    :-moz-focusring {
        outline: auto
    }

    progress {
        vertical-align: baseline
    }

    summary {
        display: list-item
    }

    ol,
    ul,
    menu {
        list-style: none
    }

    img,
    svg,
    video,
    canvas,
    audio,
    iframe,
    embed,
    object {
        vertical-align: middle;
        display: block
    }

    img,
    video {
        max-width: 100%;
        height: auto
    }

    button,
    input,
    select,
    optgroup,
    textarea {
        font: inherit;
        font-feature-settings: inherit;
        font-variation-settings: inherit;
        letter-spacing: inherit;
        color: inherit;
        opacity: 1;
        background-color: transparent;
        border-radius: 0
    }

    ::-webkit-file-upload-button {
        font: inherit;
        font-feature-settings: inherit;
        font-variation-settings: inherit;
        letter-spacing: inherit;
        color: inherit;
        opacity: 1;
        background-color: transparent;
        border-radius: 0
    }

    ::-ms-browse {
        font: inherit;
        font-feature-settings: inherit;
        font-variation-settings: inherit;
        letter-spacing: inherit;
        color: inherit;
        opacity: 1;
        background-color: transparent;
        border-radius: 0
    }

    ::file-selector-button {
        font: inherit;
        font-feature-settings: inherit;
        font-variation-settings: inherit;
        letter-spacing: inherit;
        color: inherit;
        opacity: 1;
        background-color: transparent;
        border-radius: 0
    }

    :where(select[multiple]) optgroup {
        font-weight: bolder
    }

    :where(select[size]) optgroup {
        font-weight: bolder
    }

    :where(select[multiple]) optgroup option:not(:-webkit-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
        padding-left: 20px
    }

    :where(select[multiple]) optgroup option:not(:-moz-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
        padding-left: 20px
    }

    :where(select[multiple]) optgroup option:not(:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
        padding-left: 20px
    }

    :where(select[multiple]) optgroup option:-webkit-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
        padding-right: 20px
    }

    :where(select[multiple]) optgroup option:-moz-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
        padding-right: 20px
    }

    :where(select[multiple]) optgroup option:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
        padding-right: 20px
    }

    :where(select[size]) optgroup option:not(:-webkit-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
        padding-left: 20px
    }

    :where(select[size]) optgroup option:not(:-moz-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
        padding-left: 20px
    }

    :where(select[size]) optgroup option:not(:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
        padding-left: 20px
    }

    :where(select[size]) optgroup option:-webkit-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
        padding-right: 20px
    }

    :where(select[size]) optgroup option:-moz-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
        padding-right: 20px
    }

    :where(select[size]) optgroup option:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
        padding-right: 20px
    }

    :not(:-webkit-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)))::-webkit-file-upload-button {
        margin-right: 4px
    }

    :not(:-moz-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)))::file-selector-button {
        margin-right: 4px
    }

    :not(:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)))::-ms-browse {
        margin-right: 4px
    }

    :not(:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)))::file-selector-button {
        margin-right: 4px
    }

    :-webkit-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))::-webkit-file-upload-button {
        margin-left: 4px
    }

    :-moz-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))::file-selector-button {
        margin-left: 4px
    }

    :is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))::-ms-browse {
        margin-left: 4px
    }

    :is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))::file-selector-button {
        margin-left: 4px
    }

    ::placeholder {
        opacity: 1
    }

    ::placeholder {
        opacity: 1
    }

    ::placeholder {
        opacity: 1
    }

    @supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px) {
        ::placeholder {
            color: currentColor
        }

        ::placeholder {
            color: currentColor
        }

        ::placeholder {
            color: currentColor
        }

        @supports (color:color-mix(in lab, red, red)) {
            ::placeholder {
                color: color-mix(in oklab, currentcolor 50%, transparent)
            }

            ::placeholder {
                color: color-mix(in oklab, currentcolor 50%, transparent)
            }

            ::placeholder {
                color: color-mix(in oklab, currentcolor 50%, transparent)
            }
        }
    }

    textarea {
        resize: vertical
    }

    ::-webkit-search-decoration {
        -webkit-appearance: none
    }

    ::-webkit-date-and-time-value {
        min-height: 1lh;
        text-align: inherit
    }

    ::-webkit-datetime-edit {
        display: inline-flex
    }

    ::-webkit-datetime-edit-fields-wrapper {
        padding: 0
    }

    ::-webkit-datetime-edit {
        padding-top: 0;
        padding-bottom: 0
    }

    ::-webkit-datetime-edit-year-field {
        padding-top: 0;
        padding-bottom: 0
    }

    ::-webkit-datetime-edit-month-field {
        padding-top: 0;
        padding-bottom: 0
    }

    ::-webkit-datetime-edit-day-field {
        padding-top: 0;
        padding-bottom: 0
    }

    ::-webkit-datetime-edit-hour-field {
        padding-top: 0;
        padding-bottom: 0
    }

    ::-webkit-datetime-edit-minute-field {
        padding-top: 0;
        padding-bottom: 0
    }

    ::-webkit-datetime-edit-second-field {
        padding-top: 0;
        padding-bottom: 0
    }

    ::-webkit-datetime-edit-millisecond-field {
        padding-top: 0;
        padding-bottom: 0
    }

    ::-webkit-datetime-edit-meridiem-field {
        padding-top: 0;
        padding-bottom: 0
    }

    ::-webkit-calendar-picker-indicator {
        line-height: 1
    }

    :-moz-ui-invalid {
        box-shadow: none
    }

    button {
        -webkit-appearance: button;
        -moz-appearance: button;
        -ms-appearance: button;
        appearance: button
    }

    input:where([type=button], [type=reset], [type=submit]) {
        -webkit-appearance: button;
        -moz-appearance: button;
        -ms-appearance: button;
        appearance: button
    }

    ::-webkit-file-upload-button {
        -webkit-appearance: button;
        -moz-appearance: button;
        -ms-appearance: button;
        appearance: button
    }

    ::-ms-browse {
        -webkit-appearance: button;
        -moz-appearance: button;
        -ms-appearance: button;
        appearance: button
    }

    ::file-selector-button {
        -webkit-appearance: button;
        -moz-appearance: button;
        -ms-appearance: button;
        appearance: button
    }

    ::-webkit-inner-spin-button {
        height: auto
    }

    ::-webkit-outer-spin-button {
        height: auto
    }

    [hidden]:where(:not([hidden=until-found])) {
        display: none !important
    }

    .doc-anchor-list {
        max-height: calc(100vh - 240px);
        margin-top: 150px;
        position: fixed;
        overflow: auto
    }

    .doc-anchor-list::-webkit-scrollbar {
        display: none
    }

    .editor-css-container .toolbar-dropdown-list button {
        font-size: 16px
    }

    .editor-css-container blockquote {
        color: #aaa;
        border-left: 2px solid #ddd;
        margin-left: 0;
        margin-right: 0;
        padding-left: 10px;
        font-style: italic
    }

    .editor-css-container code {
        background-color: #eee;
        font-family: source-code-pro, Menlo, Monaco, Consolas, Courier New, monospace
    }

    .editor-css-container .arco-popover-content {
        padding: 5px 11px !important
    }

    .editor-css-container .arco-popover-content button {
        margin: 0 3px;
        width: 24px !important;
        height: 24px !important
    }

    .editor-css-container .arco-dropdown-menu-item:hover,
    .editor-css-container .arco-popover-content button:hover {
        background: #f2f3f5 !important
    }

    .editor-css-container .arco-dropdown-menu {
        max-height: unset !important;
        border: 0 !important;
        padding: 2px 0 !important;
        box-shadow: 0 0 4px rgba(0, 0, 0, .1) !important
    }

    .editor-css-container .link {
        background: #fff;
        border-radius: 2px;
        width: 350px;
        margin-left: -62px;
        padding: 14px;
        box-shadow: 0 0 4px rgba(0, 0, 0, .1)
    }

    .editor-css-container .link .input-wrapper {
        justify-content: space-between;
        margin-top: 6px;
        display: flex
    }

    .editor-css-container .link .input-wrapper .input {
        background-color: #fff;
        border: 1px solid
    }

    .editor-css-container .link .input-wrapper .save {
        border-radius: 2px;
        margin-left: 8px
    }

    .editor-css-container .link .newpage {
        align-items: center;
        height: 24px;
        margin-top: 12px;
        display: flex
    }

    .editor-css-container .link .switch {
        margin-right: 10px
    }

    .editor-css-container .react-grid-item h1,
    .editor-css-container .react-grid-item h2,
    .editor-css-container .react-grid-item h3 {
        margin: 0
    }

    .editor-css-container .arco-dropdown-menu-item .block-btn,
    .editor-css-container .arco-dropdown-menu-item .format-btn {
        justify-content: center;
        align-items: center;
        display: flex
    }

    .editor-kit-wrapper-container.adit-wrapper-container {
        border-radius: 4px;
        display: none;
        transform: translate(-50%, -38px);
        box-shadow: 0 0 4px rgba(0, 0, 0, .1);
        z-index: 99 !important;
        border: none !important;
        min-width: auto !important;
        position: absolute !important
    }

    .editor-kit-wrapper-container.adit-wrapper-container .adit-format-button {
        border-radius: 2px !important
    }

    .editor-kit-wrapper-container.adit-wrapper-container .adit-format-button:hover:not([adit-disabled]) {
        background-color: #f2f3f5 !important
    }

    .editor-kit-wrapper-container.adit-wrapper-container .adit-format-button:not(.adit-color-picker-btn) svg {
        width: 22px !important;
        height: 22px !important
    }

    .editor-kit-wrapper-container.adit-wrapper-container .adit-dropdown .adit-format-button {
        height: 22px !important
    }

    .editor-kit-wrapper-container.adit-wrapper-container .adit-format-button:not(.adit-color-picker-btn) svg path {
        transform: scale(.7)translate(4px, 4px) !important
    }

    .editor-kit-wrapper-container.adit-wrapper-container .adit-dropdown-pivot .adit-format-button>svg>path {
        transform: translate(3.5px, 6.5px) !important
    }

    .editor-kit-wrapper-container.adit-wrapper-container [adit-enable-default] [adit-default]:not([adit-disable-selected]),
    .editor-kit-wrapper-container.adit-wrapper-container [adit-selected]:not([adit-disable-selected]) {
        fill: inherit !important;
        color: inherit !important;
        background-color: #eee !important
    }

    .editor-kit-wrapper-container.adit-wrapper-container .adit-format-align .menu-icon {
        border-radius: 2px !important
    }

    .editor-kit-wrapper-container .adit-wrapper {
        padding: 6px 14px !important
    }

    .render-container .adit-popup-container {
        display: none !important
    }

    .adit-popup-container .link-modify-popup,
    .adit-popup-container .link-noty-popup,
    .adit-popup-container .link-popup {
        border-radius: 0 !important
    }

    .adit-popup-container .link-popup .link-submit,
    .adit-popup-container .link-popup .link-submit:active {
        background-color: #212227 !important;
        border-radius: 0 !important
    }

    .adit-popup-container .link-modify-popup .link-popup__input-group .link-row button:hover {
        border-radius: 2px !important
    }

    .adit-popup-container .link-row-input {
        border-color: #212227 !important;
        border-radius: 0 !important
    }

    .adit-tooltip-box {
        border-radius: 0 !important
    }

    .editor-kit-container {
        display: flow-root;
        font-size: inherit !important;
        line-height: inherit !important;
        min-height: unset !important;
        border-top: 0 !important
    }

    .editor-kit-container:before {
        left: 4px !important
    }

    .editor-kit-container .ace-line {
        margin-top: 8px;
        margin-bottom: 8px
    }

    .editor-kit-container .heading-h1 {
        margin: 26px 0 10px !important;
        font-size: 26px !important;
        font-weight: 700 !important;
        line-height: 36px !important
    }

    .editor-kit-container .heading-h2 {
        margin: 22px 0 8px !important;
        font-size: 22px !important;
        font-weight: 700 !important;
        line-height: 30px !important
    }

    .editor-kit-container .heading-h3 {
        margin: 20px 0 8px !important;
        font-size: 20px !important;
        font-weight: 700 !important;
        line-height: 28px !important
    }

    .editor-kit-container ol.r-list-number li:before,
    .editor-kit-container ul.r-list-bullet li:before,
    .editor-kit-container ul.r-list-indent li:before,
    .editor-kit-container ul.r-list-number li:before {
        margin-top: -1px;
        font-style: normal;
        font-weight: 400;
        color: #337aff !important
    }

    .editor-kit-container .heading-h1 ol.r-list-number li,
    .editor-kit-container .heading-h2 ol.r-list-number li,
    .editor-kit-container .heading-h3 ol.r-list-number li {
        padding-left: 22px
    }

    .editor-kit-container .heading-h1 ol.r-list-number li:before,
    .editor-kit-container .heading-h2 ol.r-list-number li:before,
    .editor-kit-container .heading-h3 ol.r-list-number li:before {
        margin-left: -22px;
        margin-right: 4px
    }

    .editor-kit-container .heading-h1 ul.r-list-bullet li,
    .editor-kit-container .heading-h2 ul.r-list-bullet li,
    .editor-kit-container .heading-h3 ul.r-list-bullet li {
        padding-left: 22px
    }

    .editor-kit-container .heading-h1 ul.r-list-bullet li:before,
    .editor-kit-container .heading-h2 ul.r-list-bullet li:before,
    .editor-kit-container .heading-h3 ul.r-list-bullet li:before {
        margin-left: -20px;
        margin-right: 20px
    }

    .editor-kit-container .editor-kit-code-block .code-block-content {
        min-height: 47px
    }

    .editor-kit-container .editor-kit-code-block .code-block-content .code-block-zone-container {
        padding-bottom: 16px
    }

    .text-plus-trigger {
        z-index: 99;
        padding: 4px;
        line-height: 1;
        position: fixed;
        top: 0;
        left: 0
    }

    .text-plus-trigger .icon {
        color: #646a73;
        cursor: pointer
    }

    .text-plus-trigger .icon :hover {
        color: #337aff
    }

    .slice:hover {
        opacity: 1
    }

    .slice {
        opacity: 0;
        background-color: #212227;
        width: calc(100% - 20px);
        height: 2px;
        margin: 0 10px;
        transition: opacity .2s;
        position: relative
    }

    .slice .slice-btn {
        color: #fff;
        cursor: pointer;
        background-color: #212227;
        border-radius: 50%;
        padding: 2px;
        font-size: 10px;
        position: absolute;
        top: -7px;
        left: calc(50% - 7px)
    }

    .slice-popover {
        width: 132px;
        height: 36px
    }

    .slice-popover .arco-popover-content {
        background: #fff;
        border: none;
        border-radius: 18px;
        box-shadow: 0 2px 4px rgba(0, 0, 0, .1);
        padding: 8px 17px !important
    }

    .slice-popover .arco-popover-inner-content {
        justify-content: space-between;
        align-items: center;
        display: flex
    }

    .slice-popover .arco-trigger-arrow-container {
        display: none
    }

    .slice-popover .icon-btn {
        cursor: pointer;
        width: 20px;
        height: 20px
    }

    .slice-popover .icon-btn:hover {
        background-color: #f2f2f2
    }

    .custom-component-text {
        font-size: 16px;
        line-height: 26px
    }

    .custom-component-text .doc-blank-block {
        cursor: text;
        height: 100px
    }

    .text-mount-ref>div {
        z-index: 999;
        position: absolute
    }

    .zone-container>.ace-line>div[data-line-wrapper] {
        direction: ltr
    }

    .doc-rich-text {
        position: relative
    }

    .doc-rich-text .table-float-toolbar {
        margin-top: 30px
    }

    .arcosite-feedback-sideBtn {
        cursor: pointer;
        z-index: 11;
        background-color: #fff;
        border: 1px solid #dee0e3;
        border-radius: 50%;
        justify-content: center;
        align-items: center;
        width: 40px;
        height: 40px;
        font-size: 22px;
        display: flex;
        position: fixed;
        bottom: 200px;
        right: 24px
    }

    .arcosite-feedback-invalid {
        text-align: center;
        border: 1px dashed #e5e6eb;
        width: 100%;
        padding: 20px
    }

    .arcosite-feedback-screenshot {
        background-color: #f2f3f5;
        border: 1px dashed #e5e6eb;
        width: 100%;
        height: 100px;
        display: flex;
        overflow: hidden
    }

    .arcosite-feedback-preview .arco-image-preview-img-container .arco-image-preview-img {
        max-width: 80%
    }

    .arco-trigger,
    .carousel-editor,
    .doc-menu-next-line,
    .editor-kit-container,
    .editor-var,
    .float-toolbar-container,
    .header-upload-box,
    .mention-anchor-suggest {
        --color-fill-1: #f7f8fa;
        --color-fill-2: #f2f3f5;
        --color-fill-3: #e5e6eb;
        --color-fill-4: #c9cdd4;
        --color-border-2: #e5e6eb
    }

    .render-container.editor-canvas.dark-mode {
        --color-white: rgba(255, 255, 255, .9);
        --color-black: #000;
        --color-border: #333335;
        --color-bg-1: #17171a;
        --color-bg-2: #232324;
        --color-bg-3: #2a2a2b;
        --color-bg-4: #313132;
        --color-bg-5: #373739;
        --color-bg-white: #f6f6f6;
        --color-text-1: rgba(255, 255, 255, .9);
        --color-text-2: rgba(255, 255, 255, .7);
        --color-text-3: rgba(255, 255, 255, .5);
        --color-text-4: rgba(255, 255, 255, .3);
        --color-fill-1: rgba(255, 255, 255, .04);
        --color-fill-2: rgba(255, 255, 255, .08);
        --color-fill-3: rgba(255, 255, 255, .12);
        --color-fill-4: rgba(255, 255, 255, .16);
        --color-primary-light-1: rgba(var(--primary-6), .2);
        --color-primary-light-2: rgba(var(--primary-6), .35);
        --color-primary-light-3: rgba(var(--primary-6), .5);
        --color-primary-light-4: rgba(var(--primary-6), .65);
        --color-secondary: rgba(var(--gray-9), .08);
        --color-secondary-hover: rgba(var(--gray-8), .16);
        --color-secondary-active: rgba(var(--gray-7), .24);
        --color-secondary-disabled: rgba(var(--gray-9), .08);
        --color-danger-light-1: rgba(var(--danger-6), .2);
        --color-danger-light-2: rgba(var(--danger-6), .35);
        --color-danger-light-3: rgba(var(--danger-6), .5);
        --color-danger-light-4: rgba(var(--danger-6), .65);
        --color-success-light-1: rgba(var(--success-6), .2);
        --color-success-light-2: rgba(var(--success-6), .35);
        --color-success-light-3: rgba(var(--success-6), .5);
        --color-success-light-4: rgba(var(--success-6), .65);
        --color-warning-light-1: rgba(var(--warning-6), .2);
        --color-warning-light-2: rgba(var(--warning-6), .35);
        --color-warning-light-3: rgba(var(--warning-6), .5);
        --color-warning-light-4: rgba(var(--warning-6), .65);
        --color-link-light-1: rgba(var(--link-6), .2);
        --color-link-light-2: rgba(var(--link-6), .35);
        --color-link-light-3: rgba(var(--link-6), .5);
        --color-link-light-4: rgba(var(--link-6), .65);
        --color-tooltip-bg: #373739;
        --color-spin-layer-bg: rgba(51, 51, 51, .6);
        --color-menu-dark-bg: #232324;
        --color-menu-light-bg: #232324;
        --color-menu-dark-hover: var(--color-fill-2);
        --color-mask-bg: rgba(23, 23, 26, .6)
    }

    .render-container.editor-canvas {
        background-color: var(--color-bg-1);
        color: var(--color-text-1)
    }

    .docMenu {
        box-sizing: border-box;
        width: 240px;
        overflow-y: auto
    }

    .docMenu :global .arco-menu-item.arco-menu-selected {
        color: #165dff;
        background-color: #fff
    }

    @media screen and (min-width:1281px) {
        .docMenu {
            width: auto;
            max-width: 38vw
        }
    }

    .doc-sr-popup {
        background: var(--color-bg-1);
        border: 1px solid var(--color-border-2);
        box-shadow: 0 0 4px var(--color-border-1);
        box-sizing: border-box;
        z-index: 999999;
        border-radius: 5px;
        width: 330px;
        padding: 3px 10px;
        font-size: 14px;
        position: fixed;
        top: 5px;
        right: 5px
    }

    .doc-sr-popup .doc-sr-popup-header {
        cursor: move;
        border-bottom: 1px solid #eee;
        justify-content: space-between;
        align-items: center;
        padding: 10px 5px;
        display: flex
    }

    .doc-sr-popup .doc-sr-popup-close {
        cursor: pointer
    }

    .doc-sr-popup .doc-sr-popup-body {
        padding: 1px 5px 5px
    }

    .doc-sr-popup .doc-sr-popup-body .doc-sr-popup-body-title {
        justify-content: space-between;
        align-items: center;
        margin: 7px 0 5px;
        display: flex
    }

    .doc-sr-popup .doc-sr-popup-body .doc-sr-popup-body-tip {
        color: var(--color-text-2);
        font-size: 12px
    }

    .doc-sr-popup .doc-sr-popup-body .doc-sr-popup-body-tip>a {
        color: inherit;
        margin: 0 2px
    }

    .doc-sr-popup .doc-sr-popup-body .doc-sr-popup-body-button-group {
        justify-content: space-between;
        margin: 13px 0 7px;
        display: flex
    }

    .rs-editable-placeholder {
        position: relative
    }

    .doc-rs-popup-tooltip.arco-trigger.arco-tooltip {
        z-index: 1000000 !important
    }

    .float-toolbar-container {
        background: var(--color-bg-1);
        border: 1px solid var(--color-border-2);
        box-shadow: 0 0 4px var(--color-border-1);
        box-sizing: border-box;
        opacity: 1;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        z-index: 200;
        border-radius: 3px;
        align-items: center;
        padding: 0 5px;
        transition: opacity .35s;
        display: flex;
        position: absolute
    }

    div.float-toolbar-cut:last-child {
        display: none
    }

    body.css-bridge-body .css-bridge-hide-target {
        opacity: 0;
        pointer-events: none;
        visibility: hidden
    }

    a[data-type=Button] {
        display: inline-flex
    }

    .carousel-editor {
        color: var(--color-text-2);
        font-size: 12px
    }

    .carousel-editor .image-card {
        background-color: var(--color-fill-1);
        border-radius: 3px;
        margin: 10px 0;
        padding: 10px
    }

    .carousel-editor .image-card .arco-btn-group {
        flex-shrink: 0;
        margin-left: 5px
    }

    .carousel-editor .image-card .image-preview {
        align-items: center;
        display: flex
    }

    .carousel-editor .image-card .image-preview .name {
        text-overflow: ellipsis;
        white-space: nowrap;
        margin-left: 10px;
        overflow: hidden
    }

    .carousel-editor .image-card .image-preview .arco-image-img {
        width: 30px;
        height: 30px
    }

    .carousel-editor .image-card .image-link .link-title {
        margin: 10px 0 5px
    }

    .carousel-editor .image-card .image-link .arco-input {
        background-color: var(--color-bg-1)
    }

    .carousel-editor .image-card .image-link .arco-form-item {
        margin-bottom: 5px
    }

    .carousel-editor .image-card .image-link .blank-switch {
        justify-content: space-between;
        align-items: center;
        margin-bottom: 10px;
        display: flex
    }

    .carousel-editor .image-card .image-link .blank-switch .arco-form-item {
        width: auto
    }

    .carousel-editor .image-card .button-group {
        justify-content: space-between;
        display: flex
    }

    .carousel-editor .image-card .button-group .arco-btn {
        width: 60px
    }

    .carousel-editor .upload-button {
        width: 100%
    }

    .arco-carousel-container {
        width: 100%;
        height: 100%
    }

    .arco-carousel-container a {
        display: block
    }

    .arco-carousel-container div:is(.grid-overlap div) {
        z-index: unset !important
    }

    .arco-carousel-container img {
        -o-object-fit: cover;
        object-fit: cover;
        width: 100%;
        height: 100%
    }

    .arco-pretty-scrollbar::-webkit-scrollbar {
        width: 8px;
        height: 8px
    }

    .arco-pretty-scrollbar::-webkit-scrollbar-track {
        background: 0 0
    }

    .arco-pretty-scrollbar::-webkit-scrollbar-corner {
        background-color: transparent
    }

    .arco-pretty-scrollbar::-webkit-scrollbar-thumb {
        border-radius: 6px;
        transition: all 1s
    }

    .arco-pretty-scrollbar::-webkit-scrollbar-thumb:hover {
        background: var(--color-fill-4)
    }

    .arco-pretty-scrollbar:hover::-webkit-scrollbar-thumb {
        background: var(--color-fill-4)
    }

    .doc-container {
        flex-direction: row;
        display: flex
    }

    .doc-sider {
        z-index: 10;
        flex-shrink: 0;
        width: 240px
    }

    .doc-sider :global .arco-menu-item.arco-menu-selected {
        background-color: var(--color-bg-3) !important;
        color: #165dff !important
    }

    .doc-sider .arco-anchor {
        width: 180px
    }

    .doc-sider-fixed {
        height: 100%;
        position: fixed
    }

    .doc-sider-box-shadow {
        box-shadow: 0 2px 5px #f2f3f5
    }

    .doc-sider .arco-menu-inline-header,
    .doc-sider .arco-menu-item,
    .doc-sider .arco-menu.arco-menu-light {
        background-color: transparent
    }

    .doc-menu {
        z-index: 12
    }

    .doc-sider-business-container {
        padding: 20px 20px 10px
    }

    .doc-sider-business-title {
        text-overflow: ellipsis;
        white-space: nowrap;
        max-width: 200px;
        margin-top: 20px;
        margin-bottom: 10px;
        font-size: 16px;
        font-weight: 700;
        overflow: hidden
    }

    .doc-sider-business-select {
        border: 1px solid #dde2e9;
        border-radius: 4px;
        font-size: 12px
    }

    .doc-sider-business-select.arco-select-size-default.arco-select-single .arco-select-view {
        background-color: #f6f8fa;
        border-radius: 4px;
        height: 24px;
        font-size: 12px;
        line-height: 22px
    }

    .doc-sider-business-dropdown .arco-select-option {
        font-size: 12px
    }

    @media screen and (max-width:960px) {
        .doc-menu {
            position: fixed;
            left: -240px
        }

        .doc-menu .doc-sider-fixed .docMenu {
            padding-top: 0 !important
        }

        .doc-menu.open {
            width: 240px;
            left: 0
        }
    }

    @media screen and (max-width:1280px) {
        .doc-anchor {
            opacity: 0;
            width: 0;
            max-width: 0
        }

        .doc-sider-business-container {
            padding-top: 0
        }
    }

    .doc-content {
        box-sizing: border-box;
        flex: 1;
        width: 100%;
        padding: 15px
    }

    .doc-local-nav {
        background-color: var(--color-bg-1);
        border-bottom: 1px solid var(--color-neutral-3);
        z-index: 100;
        justify-content: space-between;
        align-items: center;
        width: 100%;
        height: 48px;
        font-size: 16px;
        transition: border-color .5s, background-color .5s;
        display: none;
        position: -webkit-sticky;
        position: sticky;
        top: 0;
        left: 0
    }

    .doc-local-nav .doc-local-nav-item {
        height: 40px;
        line-height: 40px;
        overflow: hidden
    }

    .doc-local-nav .doc-local-nav-item.left-menu {
        padding: 0 30px
    }

    .doc-local-nav .doc-local-nav-item.right-menu {
        padding: 0 20px
    }

    @media screen and (max-width:1280px) {
        .doc-local-nav {
            display: flex
        }

        .doc-local-nav .doc-local-nav-item.left-menu {
            opacity: 0;
            z-index: -1;
            padding: 0 15px
        }
    }

    @media screen and (max-width:960px) {
        .doc-local-nav .doc-local-nav-item.left-menu {
            opacity: 1;
            z-index: 10;
            padding: 0 15px
        }
    }

    .render-container .doc-content {
        max-width: 960px;
        margin: 0 auto
    }

    #root:has(.xgplayer-is-cssfullscreen) .render-container .doc-content {
        z-index: 130
    }

    #root:has(.xgplayer-is-cssfullscreen) .arcosite-container>div>div>div {
        z-index: 0 !important
    }

    #root:has(.xgplayer-is-cssfullscreen) .doc-sider {
        display: none
    }

    #root:has(.xgplayer-is-cssfullscreen) #doc-container.doc-container {
        position: fixed
    }

    #root:has(.xgplayer-is-cssfullscreen) .doc-local-nav {
        display: none
    }

    #root:has(.xgplayer-is-cssfullscreen) .as-helpful-panel {
        display: none
    }

    .editor-css-container :global(.arco-layout) {
        flex-direction: row !important
    }

    .arcosite-doc-mask {
        z-index: 11;
        background-color: rgba(0, 0, 0, .6);
        flex-direction: row;
        width: 100%;
        height: 100%;
        display: flex;
        position: fixed;
        top: 0;
        left: 0
    }

    .arcosite-doc-mask .left-white-background {
        background-color: var(--color-bg-1);
        width: 240px;
        height: 100%
    }

    .doc-popover-anchor-box {
        background-color: var(--color-bg-1);
        border: 1px solid var(--color-neutral-3);
        z-index: 100;
        border-radius: 8px;
        max-height: calc(100vh - 86px);
        padding: 4px 10px 16px;
        position: fixed;
        top: 64px;
        left: 20px;
        right: 20px;
        overflow-x: hidden;
        overflow-y: auto;
        box-shadow: 0 12px 32px rgba(0, 0, 0, .1), 0 2px 6px rgba(0, 0, 0, .08)
    }

    .doc-popover-anchor-box .top-link {
        border-bottom: 1px solid var(--color-neutral-3);
        margin: 0 13px 10px;
        padding: 6px 0 6px 14px;
        font-size: 15px;
        font-weight: 500;
        text-decoration: none;
        display: block
    }

    .doc-popover-anchor-box .doc-popover-anchor {
        padding-left: 13px
    }

    .doc-popover-anchor-box .doc-anchor-list {
        position: inherit;
        margin-top: 0
    }

    @media screen and (min-width:1281px) {
        .doc-container .panel-wrap {
            overflow: visible !important
        }

        .doc-container .panel-wrap .left-panel {
            flex: 19 0 auto;
            height: 100%;
            flex-shrink: 0 !important;
            overflow: visible !important
        }

        .doc-container .panel-wrap .panel-resize-line {
            cursor: ew-resize;
            -webkit-user-select: none;
            -moz-user-select: none;
            -ms-user-select: none;
            user-select: none;
            z-index: 12;
            border-left: 1px solid #eaedf1;
            margin-right: -11px;
            position: relative;
            flex: 0 0 12px !important
        }

        .doc-container .panel-wrap .panel-resize-line .panel-resize-icon {
            cursor: pointer;
            opacity: 0;
            will-change: opacity;
            background-color: #fff;
            border: 1px solid #e7e9e8;
            border-radius: 8px;
            justify-content: center;
            align-items: center;
            width: 14px;
            height: 44px;
            transition: opacity .2s;
            display: flex;
            position: absolute;
            top: 220px;
            left: -7px;
            transform: translateY(-50%);
            box-shadow: 0 2px 8px rgba(0, 0, 0, .06)
        }

        .doc-container .panel-wrap .panel-resize-line .panel-resize-icon:hover {
            background-color: #eff0f0
        }

        .doc-container .panel-wrap .panel-resize-line .panel-resize-icon:after {
            content: "";
            border: 5px solid transparent;
            border-left-color: #262626;
            align-self: center;
            margin-left: -5px;
            display: inline-block;
            transform: rotate(180deg)
        }

        .doc-container .panel-wrap .panel-resize-line:hover {
            border-color: #e0e1e5
        }

        .doc-container .panel-wrap .panel-resize-line:hover .panel-resize-icon {
            opacity: 1
        }

        .doc-container .panel-wrap.left-collapse .left-panel {
            min-width: 0;
            display: none;
            flex: 0 1 0 !important
        }

        .doc-container .panel-wrap.left-collapse .panel-resize-line {
            transform: translate(-1px);
            cursor: default !important
        }

        .doc-container .panel-wrap.left-collapse .panel-resize-line .panel-resize-icon {
            opacity: 1;
            border-top-left-radius: 0;
            border-bottom-left-radius: 0;
            left: 0
        }

        .doc-container .panel-wrap.left-collapse .panel-resize-line .panel-resize-icon:after {
            border-color: transparent #262626 transparent transparent;
            margin-left: 4px
        }

        .doc-container .panel-wrap .left-panel:hover+.panel-resize-line .panel-resize-icon {
            opacity: 1
        }

        .doc-container .panel-wrap .doc-content-wrap {
            overflow: visible !important
        }

        .doc-sider {
            width: auto;
            min-width: 240px
        }

        .doc-sider-business-title {
            max-width: unset
        }
    }

    .file-container {
        box-sizing: border-box;
        background: #fff;
        border: 1px solid #e5e6e8;
        border-radius: 2px;
        justify-content: space-between;
        align-items: center;
        width: 100%;
        height: 100%;
        padding: 0 16px;
        display: flex;
        box-shadow: 0 4px 10px #f2f3f5
    }

    .file-container a:hover {
        cursor: pointer
    }

    .file-container .filename-container {
        align-items: center;
        display: flex;
        overflow: hidden
    }

    .file-container .filename-container .file-icon {
        margin-right: 8px
    }

    .file-container .filename-container span {
        text-overflow: ellipsis;
        white-space: nowrap;
        word-break: break-all;
        line-height: 1.2;
        overflow: hidden
    }

    .lang-switcher-btn {
        flex: none;
        margin-right: 8px;
        transition: width .3s
    }

    .lang-switcher-btn.arco-btn-text:not(.arco-btn-disabled) {
        color: currentColor
    }

    .lang-switcher-btn.arco-btn-icon-only {
        align-items: center;
        margin-left: -4px;
        display: flex
    }

    .lang-switch-current {
        font-weight: 700
    }

    .header-container {
        align-items: center;
        height: 100%;
        min-height: 58px;
        display: flex
    }

    @media screen and (max-width:960px) {
        .header-container .header-menu.arco-menu {
            margin: 0
        }
    }

    .header-container .arco-menu {
        flex-grow: 1;
        margin: 0 60px;
        background-color: transparent !important
    }

    .header-container .arco-menu .arco-menu-overflow-wrap {
        display: flex
    }

    .header-container .arco-menu-item,
    .header-container .arco-menu-pop {
        color: inherit !important;
        background-color: transparent !important
    }

    .header-container .header-menu-left .arco-menu-overflow-wrap {
        justify-content: start
    }

    .header-container .header-menu-center .arco-menu-overflow-wrap {
        justify-content: center
    }

    .header-container .header-menu-right .arco-menu-overflow-wrap {
        justify-content: end
    }

    .header-container .header-menu-trigger {
        justify-content: flex-end;
        align-items: center;
        width: 25px;
        padding-right: 12px;
        display: flex
    }

    .header-container .header-menu-trigger.no-padding {
        padding-right: 0
    }

    .header-container .header-menu-trigger .arcosite-menu-container {
        cursor: pointer;
        width: 16px;
        height: 14px;
        position: relative;
        overflow: hidden
    }

    .header-container .header-menu-trigger .arcosite-menu-container .arcosite-menu-top {
        background-color: #3c3c43;
        width: 16px;
        height: 2px;
        position: absolute;
        top: 0;
        left: 0;
        transform: translate(4px)
    }

    .header-container .header-menu-trigger .arcosite-menu-container .arcosite-menu-middle {
        background-color: #3c3c43;
        width: 16px;
        height: 2px;
        position: absolute;
        top: 6px;
        left: 0;
        transform: translate(0)
    }

    .header-container .header-menu-trigger .arcosite-menu-container .arcosite-menu-bottom {
        background-color: #3c3c43;
        width: 16px;
        height: 2px;
        position: absolute;
        top: 12px;
        left: 0;
        transform: translate(8px)
    }

    .header-container .header-menu-trigger svg {
        font-size: 20px
    }

    .header-fixed {
        z-index: 999;
        position: -webkit-sticky;
        position: sticky;
        top: 0
    }

    .header-logo {
        cursor: pointer;
        justify-content: center;
        align-items: center;
        display: flex
    }

    .header-logo .name {
        margin-left: 16px;
        font-size: 16px;
        font-weight: 500
    }

    .header-logo .arcosite-header-title {
        text-overflow: ellipsis;
        height: 24px;
        margin-left: 8px;
        line-height: 24px;
        overflow: hidden
    }

    .header-menu {
        background: 0 0;
        flex-grow: 1;
        margin: 0 60px
    }

    .header-search {
        margin-right: 12px;
        display: flex
    }

    .header-search .arco-input-inner-wrapper {
        border-radius: 100px !important;
        width: 72px !important;
        transition: width .3s !important
    }

    .header-search .arco-input-inner-wrapper-focus {
        width: 160px !important
    }

    @media screen and (max-width:375px) {
        .header-search:has(.arco-input-inner-wrapper-focus)~.lang-switcher-btn {
            width: 0;
            overflow: hidden
        }
    }

    .header-user {
        display: flex
    }

    .iframe-container {
        box-sizing: border-box;
        background: #fff;
        border: 1px solid #e5e6e8;
        border-radius: 2px;
        justify-content: space-between;
        align-items: center;
        width: 100%;
        height: 100%;
        display: flex;
        box-shadow: 0 4px 10px #f2f3f5
    }

    .iframe-container iframe {
        max-width: 100%
    }

    .iframe-container .filename-container {
        text-overflow: ellipsis;
        white-space: nowrap;
        word-break: break-all;
        width: 60%;
        overflow: hidden
    }

    .iframe-container .filename-container .file-icon {
        margin-right: 8px
    }

    .search-container {
        height: calc(100vh - 60px);
        position: relative;
        overflow: auto
    }

    .search-container .arco-spin-loading .arco-spin-loading-layer-inner {
        top: 200px !important
    }

    .search-placeholder {
        z-index: -1;
        position: absolute;
        top: 0;
        left: 0;
        right: 0
    }

    .search-header {
        width: 800px;
        margin: 0 auto;
        padding: 32px 0
    }

    .search-header .search-input .arco-input-inner-wrapper {
        border-radius: 4px 0 0 4px
    }

    .search-header .search-input .arco-input-group-addafter button {
        border-radius: 0 4px 4px 0
    }

    .search-result {
        color: #737a87;
        padding: 16px 0
    }

    .search-item {
        width: 800px;
        margin: 0 auto;
        padding-bottom: 48px
    }

    @media screen and (max-width:640px) {

        .search-header,
        .search-item {
            box-sizing: border-box;
            width: 100%;
            margin: auto;
            padding: 20px
        }

        .search-item {
            word-break: break-all
        }
    }

    .search-title {
        cursor: pointer;
        font-size: 18px;
        font-weight: 500;
        line-height: 26px
    }

    .search-detail {
        -webkit-line-clamp: 2;
        color: #737a87;
        -webkit-box-orient: vertical;
        display: -webkit-box;
        overflow: hidden
    }

    .search-source {
        color: #737a87;
        justify-content: space-between;
        align-items: center;
        display: flex
    }

    .search-source-mobile {
        align-items: unset;
        flex-direction: column
    }

    .search-source-label {
        vertical-align: middle
    }

    .search-source-item {
        text-overflow: ellipsis;
        white-space: nowrap;
        max-width: 160px;
        font-weight: 400;
        overflow: hidden
    }

    .search-empty {
        color: var(--color-text-3);
        text-align: center;
        flex-direction: column;
        max-width: 400px;
        margin: 0 auto;
        display: flex
    }

    .search-footer {
        justify-content: center;
        align-items: center;
        padding-bottom: 32px;
        display: flex
    }

    .search-filter-container {
        background-color: #f6f8fa;
        border-radius: 4px;
        padding: 20px
    }

    .search-filter-container .arco-select-addbefore {
        border: 1px solid var(--color-border-2);
        background-color: #fff;
        border-right: 0;
        border-radius: 4px 0 0 4px
    }

    .search-filter-container .arco-select .arco-select-view {
        border: 1px solid var(--color-border-2);
        background-color: #fff;
        border-radius: 0 4px 4px 0
    }

    .search-filter-container .arco-btn-secondary:not(.arco-btn-disabled) {
        background-color: #f6f8fa;
        border: 1px solid #dde2e9;
        border-radius: 4px;
        box-shadow: 0 1px 1px rgba(0, 0, 0, .08)
    }

    .search-filter-container-mobile .arco-select-size-small.arco-select-single .arco-select-view {
        padding: 0 10px
    }

    .search-filter-container-mobile .search-filter-title {
        color: #737a87;
        height: 18px;
        margin-bottom: 2px;
        display: block
    }

    .highlight-word {
        color: #165dff;
        font-weight: 500
    }

    .search-modal {
        z-index: 1;
        background: #fff;
        border-radius: 4px;
        min-width: 160px;
        margin-top: 6px;
        padding: 4px 0;
        box-shadow: 0 0 4px rgba(0, 0, 0, .25)
    }

    @media screen and (max-width:640px) {
        .search-modal {
            max-width: 200px
        }
    }

    .search-modal-empty {
        color: gray;
        text-align: center;
        padding: 24px;
        text-decoration: underline
    }

    .search-modal-empty div {
        margin-top: 12px
    }

    .search-modal-empty .ai-pendant-empty {
        cursor: pointer;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        justify-content: center;
        align-items: center;
        margin-top: 5px;
        text-decoration: none;
        display: flex
    }

    .search-modal-empty .ai-pendant-empty svg {
        width: 1em;
        height: 1em;
        margin-right: 5px
    }

    .search-modal-item {
        cursor: pointer;
        align-items: center;
        padding: 0 10px;
        display: flex
    }

    .search-modal-item:hover {
        background: #f2f3f5
    }

    .search-modal-item-content {
        text-overflow: ellipsis;
        white-space: nowrap;
        word-break: break-word;
        width: 100%;
        line-height: 36px;
        overflow: hidden
    }

    .search-modal-item-content.all-result {
        text-align: center
    }

    .search-modal-item-content.divider {
        border-top: 1px solid #f3f4f4
    }

    .search-modal-item.ai-pendant {
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none
    }

    .search-modal-item.ai-pendant svg {
        margin-right: 10px
    }

    .search-modal-item.ai-pendant path {
        fill-opacity: initial
    }

    .metaInfo {
        margin-top: 14px
    }

    .metaInfo .docMetaTag {
        color: #3973e5;
        border: 1px solid #d7e3fa;
        border-radius: 14px;
        margin-right: 8px;
        padding: 2px 7px
    }

    .editor-tabs-component {
        flex-direction: column;
        width: 100%;
        min-height: 100%;
        display: flex
    }

    .editor-tabs-component.tabs-vertical {
        flex-direction: row
    }

    .editor-tabs-component .tabs-row {
        flex-shrink: 0
    }

    .editor-tabs-component .tabs-row .arco-tabs {
        height: 100%
    }

    .editor-tabs-component .grid-base-container,
    .editor-tabs-component .grid-base-layout {
        min-width: unset;
        flex: 1
    }

    .editor-tabs-component .tab-empty-tips {
        color: var(--color-text-3);
        text-align: center;
        margin: 15px 10px
    }

    .tabs-editor .tabs-group {
        box-shadow: 0 0 4px var(--color-border-2);
        box-sizing: border-box;
        margin-top: -10px;
        padding: 0 5px;
        font-size: 12px
    }

    .tabs-editor .tabs-group .arco-icon {
        font-size: 13px
    }

    .tabs-editor .tabs-group .tabs-content-item,
    .tabs-editor .tabs-group .tabs-header {
        justify-content: space-between;
        align-items: center;
        padding: 7px 3px;
        display: flex
    }

    .tabs-editor .tabs-group .tabs-content-item {
        border-top: 1px solid var(--color-border-2)
    }

    .tabs-editor .tabs-group .tabs-content-item>.tabs-item-name {
        text-overflow: ellipsis;
        white-space: nowrap;
        word-break: break-all;
        overflow: hidden
    }

    .tabs-editor .tabs-group .tabs-content-item .operate-group {
        flex-shrink: 0
    }

    .grid-base-container,
    .grid-base-layout {
        min-width: 100%;
        min-height: 100%
    }

    .component-container {
        width: 100%;
        height: 100%
    }

    .grid-item-add-btn {
        display: none;
        position: absolute;
        bottom: 0;
        left: 50%;
        transform: translate(-50%, 50%)
    }

    .dragDot {
        color: rgb(var(--primary-6));
        z-index: 999;
        margin-left: 50%;
        font-size: 14px;
        position: absolute;
        top: 0;
        transform: translate(-50%);
        display: none !important
    }

    .dragDot svg:hover {
        cursor: move
    }

    .editor-css-container .arco-icon {
        font-size: 14px
    }

    .react-grid-item.hovered>.dragDot,
    .react-grid-item.selected>.dragDot {
        justify-content: center;
        display: flex !important
    }

    .grid-item-delete {
        color: red;
        cursor: pointer;
        z-index: 11;
        display: none;
        position: absolute;
        top: 0;
        right: 0;
        transform: translate(50%, -50%)
    }

    .box {
        color: gray;
        cursor: pointer;
        letter-spacing: 6px;
        text-shadow: 3px 3px 3px gray;
        justify-content: center;
        align-items: center;
        display: flex
    }

    .layout {
        height: 100%;
        min-height: 400px
    }

    .react-resizable-handle {
        opacity: 0
    }

    .hovered.react-grid-item>.react-resizable-handle,
    .selected.react-grid-item>.react-resizable-handle {
        opacity: 1;
        z-index: 1000
    }

    .layout .react-grid-item.react-grid-placeholder {
        background: #165dff
    }

    .xgplayer+.dragDot {
        color: gray
    }

    .xgplayer~.react-resizable-handle.react-resizable-handle-se:after {
        border-bottom: 2px solid gray;
        border-right: 2px solid gray
    }

    .mask {
        z-index: 9;
        background: rgba(255, 255, 255, 0);
        width: 100%;
        height: 100%;
        position: absolute;
        top: 0;
        left: 0
    }

    .react-grid-layout.layout {
        width: 100%;
        transition: none !important
    }

    .doc-comment {
        border-bottom: 2px solid var(--color-warning-light-4)
    }

    .doc-comment.active {
        background-color: var(--color-warning-light-2)
    }

    .reuse-doc-wrapper {
        position: relative
    }

    .reuse-doc-wrapper.edit-mode {
        border: 1px dashed #a4c2fa;
        border-radius: 3px
    }

    .reuse-doc-wrapper .reuse-doc-actions {
        z-index: 999;
        justify-content: space-between;
        align-items: center;
        font-size: 12px;
        display: none;
        position: absolute;
        top: 5px;
        right: 5px
    }

    .reuse-doc-wrapper .reuse-doc-actions .reuse-doc-action-item {
        margin-left: 5px
    }

    .reuse-doc-wrapper .reuse-doc-actions .reuse-doc-action-item button {
        color: #3e7bff;
        background-color: #fff;
        border: 1px solid #3e7bff;
        border-radius: 3px
    }

    .reuse-doc-wrapper .reuse-doc-actions .reuse-doc-action-item-disabled button {
        color: #c9cdd4;
        background-color: #f7f8fa;
        border: none
    }

    .reuse-doc-wrapper .reuse-doc-comment-tips {
        color: #444;
        background-color: rgba(255, 255, 255, .4);
        padding: 0 5px
    }

    .reuse-doc-wrapper .reuse-doc-loading {
        color: var(--color-text-2);
        z-index: 9999;
        font-size: 12px;
        position: absolute;
        top: 3px;
        right: 6px
    }

    .reuse-doc-wrapper .reuse-doc-loading>span {
        margin-left: 3px
    }

    .reuse-doc-wrapper:hover .reuse-doc-actions {
        display: flex
    }

    .reuse-doc-wrapper:hover .reuse-doc-mask {
        z-index: 998;
        background-color: rgba(202, 220, 242, .2);
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0
    }

    .doc-comment .reuse-comment {
        background-color: var(--color-warning-light-4);
        width: 100%;
        height: 2px
    }

    .reuse-doc-wrapper.edit-mode .doc-block-selected {
        box-shadow: none !important
    }

    .reuse-doc-wrapper.edit-mode .image-wrapper.selected {
        border-color: transparent
    }

    .reuse-doc-wrapper.edit-mode .image-wrapper.selected .point.n-icon-dragable {
        display: none
    }

    .reuse-doc-checking-spin {
        display: block
    }

    .reuse-doc-checking {
        border: 1px solid var(--color-border-2);
        border-radius: 6px;
        justify-content: center;
        align-items: center;
        height: 100px;
        display: flex
    }

    .diff-insert {
        color: #00b42a;
        background-color: rgba(0, 180, 42, .2)
    }

    .diff-delete {
        color: red;
        background-color: rgba(255, 0, 0, .2);
        text-decoration: line-through
    }

    .diff-style {
        color: #8d4eda;
        background-color: rgba(141, 78, 218, .2)
    }

    .diff-insert-embed {
        border-bottom: 3px solid rgba(0, 180, 42, .2)
    }

    .diff-delete-embed {
        border-bottom: 3px solid rgba(255, 0, 0, .2)
    }

    .diff-style-embed {
        border-bottom: 3px solid rgba(141, 78, 218, .2)
    }

    .arco-trigger.doc-menu-icon-trigger {
        padding: 4px;
        z-index: 99 !important
    }

    .arco-trigger.doc-menu-icon-trigger .doc-menu-icon {
        background-color: var(--color-bg-1);
        border: 1px solid var(--color-border-2);
        box-sizing: content-box;
        cursor: pointer;
        border-radius: 4px;
        justify-content: center;
        align-items: center;
        width: 26px;
        height: 25px;
        display: flex !important
    }

    .arco-trigger.doc-menu-icon-trigger .doc-menu-icon .dynamic-icon {
        align-items: center;
        margin: 0 3px;
        font-size: 14px;
        font-weight: 700;
        display: flex;
        color: #165dff !important
    }

    .arco-trigger.doc-menu-icon-trigger .doc-menu-icon:hover {
        background-color: var(--color-fill-1)
    }

    .arco-trigger.doc-sub-menu-trigger .arco-icon {
        color: var(--color-text-1);
        margin-right: 8px
    }

    .doc-menu-triggered-line {
        background-color: rgb(var(--blue-6), .2);
        border-radius: 3px
    }

    .arco-tag.doc-toolbar-new {
        zoom: .9;
        border-radius: 10px;
        height: 18px;
        margin-left: 10px;
        font-size: 10px;
        line-height: 1
    }

    .editor-kit-container .ace-line.heading-h4 {
        margin: 18px 0 8px;
        font-size: 18px;
        font-weight: 700;
        line-height: 26px
    }

    .editor-kit-container .ace-line.heading-h5 {
        margin: 14px 0 8px;
        font-size: 16px;
        font-weight: 700;
        line-height: 22px
    }

    .editor-kit-container .ace-line.heading-h6 {
        margin: 12px 0 8px;
        font-size: 16px;
        font-weight: 700;
        line-height: 18px
    }

    .editor-kit-container .doc-heading ol.r-list-number li:before,
    .editor-kit-container .doc-heading ul.r-list-bullet li:before,
    .editor-kit-container .doc-heading ul.r-list-indent li:before,
    .editor-kit-container .doc-heading ul.r-list-number li:before {
        font-weight: 700
    }

    .editor-kit-container .highlight-block-wrapper {
        color: var(--color-text-1);
        margin: 8px 0;
        position: relative
    }

    .editor-kit-container .highlight-block-wrapper div {
        margin-top: 0 !important;
        margin-bottom: 0 !important
    }

    .editor-kit-container .highlight-block-wrapper:hover>div:first-child .highlight-block-base .highlight-block-switch {
        z-index: 999;
        display: block;
        position: absolute;
        top: 0;
        right: 0;
        transform: translateY(-100%)
    }

    .editor-kit-container .highlight-block-wrapper:hover>div:first-child .highlight-block-base .highlight-block-switch .color-block-group {
        background-color: var(--color-bg-1);
        align-items: center;
        padding: 5px;
        display: flex;
        box-shadow: 0 0 4px rgba(0, 0, 0, .1)
    }

    .editor-kit-container .highlight-block-wrapper:hover>div:first-child .highlight-block-base .highlight-block-switch .color-block-group .color-block {
        cursor: pointer;
        border: 1px solid;
        width: 20px;
        height: 20px;
        margin: 0 6px
    }

    .editor-kit-container .highlight-block-wrapper .highlight-block-base {
        border-left: 1px solid;
        border-right: 1px solid;
        padding: 0 10px
    }

    .editor-kit-container .highlight-block-wrapper .highlight-block-base .ace-line {
        margin-top: 0 !important;
        margin-bottom: 0 !important
    }

    .editor-kit-container .highlight-block-wrapper .highlight-block-base .highlight-block-switch {
        display: none
    }

    .editor-kit-container .highlight-block-wrapper>div:first-child .highlight-block-base {
        border-top: 1px solid;
        border-top-left-radius: 5px;
        border-top-right-radius: 5px;
        padding-top: 10px
    }

    .editor-kit-container .highlight-block-wrapper>div:last-child .highlight-block-base {
        border-bottom: 1px solid;
        border-bottom-right-radius: 5px;
        border-bottom-left-radius: 5px;
        padding-bottom: 10px
    }

    .editor-kit-container .highlight-block-wrapper .color-block.default,
    .editor-kit-container .highlight-block-wrapper .highlight-block-base.default {
        background-color: rgba(var(--blue-6), .3);
        border-color: rgb(var(--blue-6)) !important
    }

    .editor-kit-container .highlight-block-wrapper .color-block.warning,
    .editor-kit-container .highlight-block-wrapper .highlight-block-base.warning {
        background-color: rgba(var(--warning-2), .8);
        border-color: rgb(var(--warning-6)) !important
    }

    .editor-kit-container .highlight-block-wrapper .color-block.danger,
    .editor-kit-container .highlight-block-wrapper .highlight-block-base.danger {
        background-color: rgba(var(--danger-2), .8);
        border-color: rgb(var(--danger-6)) !important
    }

    .editor-kit-container .image-wrapper.selected {
        outline: none !important
    }

    .editor-kit-container .image-container,
    .editor-kit-container .image-wrapper {
        max-width: 100%
    }

    .editor-kit-container .image-container .n-icon-dragable-disabled,
    .editor-kit-container .image-wrapper .n-icon-dragable-disabled {
        cursor: not-allowed !important;
        background-color: #ccc !important
    }

    .editor-kit-container .image-container .doc-image,
    .editor-kit-container .image-wrapper .doc-image {
        -o-object-fit: contain;
        object-fit: contain;
        max-width: 100%;
        height: auto;
        max-height: 100%;
        display: block
    }

    .editor-kit-container .image-spin {
        width: auto !important
    }

    .tool-trigger-images-preview {
        z-index: 999999 !important
    }

    .tool-trigger-images-preview .arco-image-preview-img-container .arco-image-preview-loading {
        color: var(--color-fill-1)
    }

    .tool-trigger-images-preview .arco-image-preview-img-container .arco-image-preview-img {
        background-color: #fff
    }

    .tool-trigger-images-container {
        cursor: zoom-in
    }

    .doc-image-link {
        background-color: var(--color-bg-1);
        box-shadow: 0 0 4px var(--color-border-2);
        padding: 15px
    }

    .doc-image-link .link-blank-wrapper,
    .doc-image-link .link-blank-wrapper>.blank-config,
    .doc-image-link .link-input-wrapper {
        align-items: center;
        display: flex
    }

    .doc-image-link .link-input-wrapper {
        width: 270px
    }

    .doc-image-link .link-input-wrapper .arco-btn {
        margin-left: 10px
    }

    .doc-image-link .link-blank-wrapper {
        justify-content: space-between;
        margin-top: 10px
    }

    .doc-image-link .link-blank-wrapper>.blank-config>span {
        margin-left: 10px
    }

    .link-popup .link-plugin-row {
        color: #000;
        justify-content: space-between;
        align-items: center;
        display: flex;
        padding: 5px 0 !important
    }

    .link-popup .link-plugin-row .link-plugin-row-switch {
        margin-right: 10px
    }

    .link-popup .link-plugin-row .arco-switch {
        background-color: var(--color-fill-4) !important
    }

    .link-popup .link-plugin-row .arco-switch-checked {
        background-color: rgb(var(--primary-6)) !important
    }

    .link-popup .link-row {
        margin-bottom: 3px !important
    }

    .inline-code {
        word-spacing: normal;
        background-color: #f5f6f7;
        border-radius: 4px;
        line-height: 1.6;
        padding-top: 0 !important;
        padding-bottom: 0 !important
    }

    .inline-code_start {
        padding-left: 2px
    }

    .inline-code_end {
        padding-right: 2px
    }

    .multi-cols-container {
        display: flex
    }

    .multi-cols-container>.multi-col-editable-container {
        box-sizing: border-box;
        background-color: transparent;
        border-radius: 6px;
        flex-grow: 0;
        flex-shrink: 0;
        transition: background-color .3s, box-shadow .2s
    }

    .multi-cols-container>.multi-col-editable-container>.zone-container>.ace-line {
        margin-top: 8px;
        margin-bottom: 0
    }

    .multi-cols-container>.multi-col-editable-container>.zone-container>.ace-line:first-child {
        margin-top: 0;
        margin-bottom: 0
    }

    .multi-cols-container.is-active>.multi-col-editable-container,
    .multi-cols-container.is-editable-mode:hover>.multi-col-editable-container {
        background-color: var(--color-fill-1);
        box-shadow: 0 0 0 2px var(--color-fill-1)
    }

    .multi-cols-container .multi-col-op {
        box-sizing: border-box;
        cursor: col-resize;
        justify-content: center;
        width: 10px;
        height: 100%;
        margin: 0 3px;
        display: flex;
        position: relative
    }

    .multi-cols-container .multi-col-op .multi-col-op-dragger {
        box-sizing: border-box;
        background-color: transparent;
        border-radius: 6px;
        width: 2px;
        margin: 7px 0 5px;
        transition: background-color .2s
    }

    .multi-cols-container .multi-col-op.is-dragging .multi-col-op-dragger,
    .multi-cols-container .multi-col-op:hover .multi-col-op-dragger {
        background-color: rgba(22, 93, 255, .6)
    }

    .multi-cols-container .multi-col-op>.multi-col-scaler-adder {
        background-color: var(--color-fill-3);
        box-sizing: border-box;
        cursor: pointer;
        z-index: 10;
        border-radius: 50%;
        justify-content: center;
        align-items: center;
        width: 0;
        height: 0;
        transition: all .2s;
        display: flex;
        position: absolute;
        top: 0;
        overflow: hidden
    }

    .multi-cols-container .multi-col-op>.multi-col-scaler-adder>.multi-col-scaler-icon {
        opacity: 0;
        visibility: hidden
    }

    .multi-cols-container .multi-col-op:hover>.multi-col-scaler-adder {
        width: 6px;
        height: 6px
    }

    .multi-cols-container .multi-col-op:hover>.multi-col-scaler-adder>.multi-col-scaler-icon {
        box-sizing: border-box;
        color: #fff;
        justify-content: center;
        align-items: center;
        width: 16px;
        height: 16px;
        padding: 2px;
        display: flex
    }

    .multi-cols-container .multi-col-op:hover>.multi-col-scaler-adder:hover {
        background-color: #165dff;
        width: 16px;
        height: 16px
    }

    .multi-cols-container .multi-col-op:hover>.multi-col-scaler-adder:hover>.multi-col-scaler-icon {
        opacity: 1;
        visibility: visible
    }

    .multi-cols-container .multi-col-scaler {
        background-color: var(--color-fill-4);
        color: #fff;
        z-index: 99;
        border-radius: 3px;
        padding: 3px;
        font-size: 10px;
        line-height: 1;
        position: absolute;
        top: 1px;
        right: 1px
    }

    .multi-col-editable-container .highlight-block-v2 {
        margin: 0
    }

    .multi-col-editable-container .highlight-block-v2 .doc-heading {
        margin: 10px 0 !important
    }

    .doc-tabs-container {
        box-sizing: border-box;
        width: 100%;
        padding: 5px 0
    }

    .doc-tabs-container .doc-tabs-editable-container {
        position: relative
    }

    .doc-tabs-container .doc-tabs-title-container {
        display: flex
    }

    .doc-tabs-container .doc-tabs-title-container>.doc-tabs-title-op {
        color: var(--color-text-2);
        cursor: pointer;
        flex-shrink: 0;
        justify-content: center;
        align-items: center;
        width: 22px;
        display: flex
    }

    .doc-tabs-container .doc-tabs-title-container>.doc-tabs-title-op.disabled {
        color: var(--color-text-4);
        cursor: not-allowed
    }

    .doc-tabs-container .doc-tabs-title-container>.doc-tabs-title-op:hover {
        background-color: var(--color-fill-1)
    }

    .doc-tabs-container .doc-tabs-add-btn {
        cursor: pointer;
        flex-shrink: 0;
        align-items: center;
        display: flex
    }

    .doc-tabs-container .doc-tabs-title-wrapper {
        -ms-overflow-style: none;
        overflow: -moz-scrollbars-none;
        scrollbar-width: none;
        margin-bottom: -1px;
        overflow-x: auto
    }

    .doc-tabs-container .doc-tabs-title-wrapper::-webkit-scrollbar {
        display: none;
        width: 0 !important
    }

    .doc-tabs-container .doc-tabs-title {
        color: #41464f;
        height: 34px;
        font-size: 14px;
        display: flex
    }

    .doc-tabs-container .doc-tabs-title .doc-tabs-title-item {
        cursor: pointer;
        background-color: #f6f8fa;
        border-bottom: none;
        border-radius: 4px 4px 0 0;
        flex-shrink: 0;
        align-items: center;
        height: 100%;
        margin-right: 8px;
        padding: 0 16px;
        display: flex;
        position: relative;
        box-shadow: inset 0 0 0 1px #eaedf1
    }

    .doc-tabs-container .doc-tabs-title .doc-tabs-title-item.active {
        color: #006eff;
        background-color: #fff;
        box-shadow: inset 0 2px #006eff, inset -1px 0 #eaedf1, inset 1px 0 #eaedf1
    }

    .doc-tabs-container .doc-tabs-editable {
        border: 1px solid #eaedf1;
        padding: 12px 10px 5px
    }

    .doc-tabs-trigger {
        background: var(--color-bg-1);
        border: 1px solid var(--color-border-2);
        box-shadow: 0 0 4px var(--color-border-1);
        border-radius: 3px;
        justify-content: space-between;
        width: 132px;
        height: 36px;
        padding: 5px;
        font-size: 12px
    }

    .doc-tabs-trigger,
    .doc-tabs-trigger .doc-tabs-btn-container,
    .doc-tabs-trigger button.doc-tabs-item-btn {
        box-sizing: border-box;
        align-items: center;
        display: flex
    }

    .doc-tabs-trigger button.doc-tabs-item-btn {
        color: var(--color-text-1);
        justify-content: center;
        padding: 0 3px
    }

    .doc-tabs-trigger button.doc-tabs-item-btn.arco-btn-disabled {
        color: var(--color-text-4)
    }

    .editor-kit-code-block.code-block .code-block-content {
        -ms-overflow-style: none;
        overflow: -moz-scrollbars-none;
        scrollbar-width: none;
        flex-direction: column
    }

    .editor-kit-code-block.code-block .code-block-content::-webkit-scrollbar {
        display: none
    }

    .editor-kit-code-block.code-block .code-block-content .code-block-zone-container {
        overflow: unset;
        margin-left: 0;
        padding-left: 57px
    }

    .editor-kit-code-block.code-block .code-block-content .code-line-wrapper:before {
        background-color: #f5f6f7
    }

    .react-grid-item .CodeMirror {
        height: auto !important
    }

    .code-block-wrapper {
        border: 2px solid transparent;
        width: 100%;
        display: inline-block;
        position: relative
    }

    .code-block-wrapper:not(.selected):hover {
        box-shadow: 0 0 0 2px #bacefd
    }

    .code-block-wrapper:not(.selected):hover .edit-btn {
        display: block !important
    }

    .code-block-wrapper.selected {
        border-color: #3370ff;
        outline: none !important
    }

    .code-block-wrapper.selected .edit-btn {
        display: block !important
    }

    .code-block-wrapper .edit-btn {
        z-index: 9;
        border-radius: 4px;
        top: -34px;
        left: -2px;
        box-shadow: 0 0 4px rgba(0, 0, 0, .1);
        background: #fff !important;
        display: none !important;
        position: absolute !important
    }

    .block-code-container {
        position: relative
    }

    .block-code-container .copy-button {
        z-index: 1;
        display: none;
        position: absolute;
        top: 5px;
        right: 10px
    }

    .block-code-container:hover .copy-button {
        display: block
    }

    .code-block-edit-model .editor-operate {
        justify-content: space-between;
        align-items: center;
        margin-bottom: 12px;
        display: flex
    }

    .code-block-edit-model .editor-operate .arco-select {
        width: 200px
    }

    .block-code-container .CodeMirror-line,
    .code-block-edit-model .CodeMirror-line {
        word-break: break-all !important
    }

    .highlight-block-v2 {
        border-radius: 3px;
        padding: 3px 10px
    }

    .highlight-block-v2 .zone-container .ace-line:first-child {
        margin-top: 8px
    }

    .highlight-block-v2 .highlight-block-present-title {
        align-items: center;
        margin-top: 6px;
        font-weight: 700;
        display: flex
    }

    .arco-trigger.highlight-block-present-trigger .title-edit-icon {
        color: var(--color-text-2);
        cursor: pointer;
        margin-top: 5px;
        padding-left: 3px;
        font-size: 15px
    }

    .highlight-block-present-input-trigger .arco-input {
        background-color: var(--color-bg-1);
        border: 1px solid var(--color-border-1)
    }

    .highlight-block-color-picker {
        background: var(--color-bg-1);
        border: 1px solid var(--color-border-2);
        box-shadow: 0 0 4px var(--color-border-1);
        padding: 5px 10px
    }

    .highlight-block-color-picker .picker-title {
        color: var(--color-text-1);
        margin-top: 5px;
        font-size: 12px
    }

    .highlight-block-color-picker .picker-group {
        flex-wrap: wrap;
        width: 250px;
        margin-top: 10px;
        display: flex
    }

    .highlight-block-color-picker .picker-group .picker-item {
        cursor: pointer;
        border: 2px solid transparent;
        border-radius: 3px;
        margin: 0 2px 10px
    }

    .highlight-block-color-picker .picker-group .picker-item.active {
        border: 2px solid rgb(var(--blue-6))
    }

    .highlight-block-color-picker .picker-group .picker-item .picker-color {
        box-sizing: border-box;
        border: 1px solid transparent;
        width: 23px;
        height: 23px
    }

    .highlight-block-color-picker .picker-group .picker-item .picker-color.transparent {
        border: 1px solid var(--color-border-2);
        position: relative
    }

    .highlight-block-color-picker .picker-group .picker-item .picker-color.transparent:after {
        content: "";
        transform-origin: -1px -1px;
        background-color: #8f959e;
        width: 1px;
        height: 56px;
        position: absolute;
        top: 0;
        left: 22px;
        transform: rotate(45deg)scale(.5)
    }

    .highlight-block-normal {
        position: relative
    }

    .highlight-block-normal .emoji-block {
        justify-content: center;
        align-items: center;
        display: flex;
        position: absolute;
        top: 0;
        left: 3px
    }

    .highlight-block-normal .emoji-block.for-heading-h1 {
        margin-top: 4px
    }

    .highlight-block-normal .emoji-block.for-heading-h2 {
        margin-top: 3px
    }

    .highlight-block-normal .emoji-block.for-heading-h3 {
        margin-top: 1px
    }

    .highlight-block-normal .emoji-block.for-heading-h6 {
        margin-top: -3px
    }

    .highlight-block-normal .editor-block {
        margin-left: 30px
    }

    .highlight-block-normal .editor-block.no-emoji {
        margin-left: 0
    }

    .editor-kit-container .text-indent .highlight-block-v2 ol.r-list-number li:before,
    .editor-kit-container .text-indent .highlight-block-v2 ul.r-list-number li:before {
        margin-left: -22px;
        padding-right: 2px
    }

    .editor-kit-container .text-indent .highlight-block-v2 ol.r-list-bullet li:before,
    .editor-kit-container .text-indent .highlight-block-v2 ul.r-list-bullet li:before {
        text-indent: 0
    }

    .editor-kit-container .ace-table .highlight-block-body {
        margin: 8px 0
    }

    .editor-kit-container .arco-spin-loading .xgplayer-skin-default.xgplayer-pause .xgplayer-start {
        display: none
    }

    .editor-kit-container .align-center .video-container {
        text-align: center
    }

    .editor-kit-container .align-left .video-container {
        text-align: left
    }

    .editor-kit-container .align-right .video-container {
        text-align: right
    }

    .editor-kit-container .video-container,
    .editor-kit-container .video-spin {
        max-width: 730px
    }

    .editor-kit-container .video-container {
        color: transparent
    }

    .editor-kit-container .video-container .video-wrapper {
        box-sizing: border-box;
        border: 2px solid transparent;
        width: 100%;
        height: 410px;
        max-height: 410px;
        line-height: 0;
        display: inline-block;
        position: relative
    }

    .editor-kit-container .video-container .video-wrapper:not(.selected):hover {
        box-shadow: 0 0 0 2px #bacefd
    }

    .editor-kit-container .video-container .video-wrapper video {
        -webkit-user-drag: none;
        max-width: 100%;
        display: block
    }

    .editor-kit-container .video-container .video-wrapper .point {
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        background-color: #3370ff;
        border: 2px solid #fff;
        width: 18px;
        height: 18px;
        font-size: 14px;
        display: none;
        position: absolute
    }

    .editor-kit-container .video-container .video-wrapper .point.n-icon-dragable {
        background: #3370ff;
        border-radius: 50%;
        width: 16px;
        height: 16px
    }

    .editor-kit-container .video-container .video-wrapper.selected {
        border-color: #3370ff;
        outline: none !important
    }

    .editor-kit-container .video-container .video-wrapper.selected .point.n-icon-dragable {
        display: block
    }

    .editor-kit-container .video-container .xgplayer-time {
        display: flex !important
    }

    .editor-kit-container .video-container .xg-tips {
        box-sizing: border-box;
        padding: 8px 6px
    }

    .editor-kit-container .video-container.unresize .video-wrapper {
        border: 0
    }

    .editor-kit-container .video-container.unresize .video-wrapper:hover {
        box-shadow: none
    }

    .editor-kit-container .video-container.unresize .video-wrapper .point.n-icon-dragable {
        display: none
    }

    .tool-tips-title {
        box-sizing: border-box;
        color: #fff;
        z-index: 99999;
        background: #484747;
        border-radius: 3px;
        max-width: 300px;
        padding: 3px;
        font-size: 10px;
        display: inline-block;
        position: fixed;
        top: -1000px;
        left: -1000px
    }

    .doc-tags-dom {
        transition: background-color .1s
    }

    .doc-tags-dom:hover {
        background-color: var(--doc-tags-color)
    }

    .uploadItem .arco-input-group-addafter,
    .uploadItem .arco-input-group-addbefore {
        padding: 0 !important
    }

    .CodeMirror-placeholder {
        color: #aaa;
        margin: 0 5px
    }

    .render-container .CodeMirror-cursors {
        display: none
    }

    #graphContainer {
        background-color: #fff
    }

    #graphContainer .geMenubarContainer {
        justify-content: space-between;
        align-items: center;
        display: flex
    }

    #graphContainer .geMenubarContainer .geMenubar {
        align-items: center;
        width: auto;
        display: flex
    }

    #graphContainer .geMenubarContainer .geMenubar .geItem {
        margin: 0 15px
    }

    #graphContainer .geMenubarContainer .geMenubar .geItem.geStatus {
        display: none
    }

    .float-toolbar-container .float-toolbar-cut {
        background-color: var(--color-border-2);
        width: 1px;
        height: 30px;
        max-height: 100%;
        margin: 0 3px
    }

    .float-toolbar-container .float-toolbar-item {
        box-sizing: content-box;
        cursor: pointer;
        align-items: center;
        margin: 6px 3px;
        padding: 6px 7px;
        display: flex
    }

    .float-toolbar-container .float-toolbar-item svg {
        font-size: 16px;
        font-weight: 700
    }

    .float-toolbar-container .float-toolbar-item.style-selected,
    .float-toolbar-container .float-toolbar-item:hover {
        background-color: var(--color-fill-2)
    }

    .float-toolbar-container .float-toolbar-item .float-toolbar-dropdown {
        align-items: center;
        line-height: 1;
        display: flex
    }

    .float-toolbar-container .float-toolbar-item .float-toolbar-dropdown .float-toolbar-arrow {
        margin-left: 4px;
        font-size: 13px
    }

    .float-toolbar-color-picker {
        background: var(--color-bg-1);
        border: 1px solid var(--color-border-2);
        box-shadow: 0 0 4px var(--color-border-1);
        border-radius: 5px;
        padding: 5px 10px
    }

    .float-toolbar-color-picker .picker-title {
        color: var(--color-text-1);
        margin-top: 5px;
        font-size: 12px
    }

    .float-toolbar-color-picker .picker-group {
        flex-wrap: wrap;
        width: 250px;
        margin-top: 10px;
        display: flex
    }

    .float-toolbar-color-picker .picker-group .picker-item {
        cursor: pointer;
        border: 2px solid transparent;
        border-radius: 3px;
        margin: 0 2px 10px
    }

    .float-toolbar-color-picker .picker-group .picker-item.active {
        border: 2px solid rgb(var(--blue-6))
    }

    .float-toolbar-color-picker .picker-group .picker-item .picker-color {
        box-sizing: border-box;
        border: 1px solid transparent;
        width: 23px;
        height: 23px
    }

    .float-toolbar-color-picker .picker-group .picker-item .picker-color-font {
        border: 1px solid #eee;
        justify-content: center;
        align-items: center;
        font-size: 16px;
        display: flex
    }

    .float-toolbar-color-picker .picker-group .picker-item .picker-color.transparent {
        border: 1px solid var(--color-border-2);
        position: relative
    }

    .float-toolbar-color-picker .picker-group .picker-item .picker-color.transparent:after {
        content: "";
        transform-origin: -1px -1px;
        background-color: #8f959e;
        width: 1px;
        height: 56px;
        position: absolute;
        top: 0;
        left: 22px;
        transform: rotate(45deg)scale(.5)
    }

    .float-toolbar-dropdown-list,
    .float-toolbar-dropdown-list-third {
        background: var(--color-bg-1);
        border: 1px solid var(--color-border-2);
        box-shadow: 0 0 4px var(--color-border-1);
        border-radius: 5px;
        padding: 5px;
        font-size: 13px
    }

    .float-toolbar-dropdown-list .dropdown-list-item,
    .float-toolbar-dropdown-list-third .dropdown-list-item {
        box-sizing: content-box;
        cursor: pointer;
        align-items: center;
        width: 100px;
        height: 30px;
        margin: 5px 0;
        padding: 0 10px;
        display: flex
    }

    .float-toolbar-dropdown-list .dropdown-list-item .arco-icon,
    .float-toolbar-dropdown-list .dropdown-list-item .svg-icon,
    .float-toolbar-dropdown-list-third .dropdown-list-item .arco-icon,
    .float-toolbar-dropdown-list-third .dropdown-list-item .svg-icon {
        margin-right: 6px;
        font-size: 16px;
        font-weight: 700
    }

    .float-toolbar-dropdown-list .dropdown-list-item:hover,
    .float-toolbar-dropdown-list-third .dropdown-list-item:hover {
        background-color: var(--color-fill-1)
    }

    .float-toolbar-dropdown-list-third.wide-list-mode .dropdown-list-item,
    .float-toolbar-dropdown-list.wide-list-mode .dropdown-list-item {
        width: 150px
    }

    @keyframes loading-circle {
        to {
            transform: rotate(1turn)
        }
    }

    .doc-virtual-container {
        box-sizing: border-box
    }

    .doc-virtual-container.virtual-loading {
        border: 1px solid var(--color-border-2);
        border-radius: 6px;
        justify-content: center;
        align-items: center;
        display: flex
    }

    .doc-virtual-container.virtual-loading .virtual-loading-icon {
        color: var(--color-border-4);
        font-size: 20px;
        animation: 1.2s linear infinite loading-circle
    }

    .indent-trigger-menu-container {
        background: #fff;
        padding: 5px;
        display: flex;
        box-shadow: 0 0 4px rgba(0, 0, 0, .1)
    }

    .arco-trigger.indent-trigger-menu {
        z-index: 99
    }

    .arco-trigger.indent-trigger-menu button {
        color: var(--color-text-1);
        min-width: 30px;
        height: 30px;
        margin: 0 3px;
        padding: 0;
        font-size: 16px
    }

    .arco-trigger.indent-trigger-menu button:hover {
        background: #f2f3f5
    }

    .arco-trigger.indent-trigger-menu button.arco-btn-disabled {
        color: #ccc
    }

    .arco-trigger.indent-trigger-menu>.dividing-line {
        background-color: #ddd;
        width: 1px;
        margin: 5px 0
    }

    .doc-flow-chart {
        border: 1px solid var(--color-border-2);
        box-sizing: border-box;
        border-radius: 6px;
        min-height: 100px;
        padding: 20px;
        position: relative
    }

    .doc-flow-chart .arco-spin {
        display: block
    }

    .doc-flow-chart .chart-content {
        justify-content: center;
        align-items: center;
        min-height: 100px;
        display: flex
    }

    .doc-flow-chart .chart-content .arco-icon.arco-icon-image {
        height: 1em;
        display: inline-block
    }

    .doc-flow-chart .chart-content svg {
        max-width: 100%;
        height: auto;
        display: block
    }

    .doc-flow-chart .chart-content svg,
    .doc-flow-chart .chart-content svg div {
        word-break: normal;
        line-height: normal
    }

    .doc-flow-chart .chart-content svg ol,
    .doc-flow-chart .chart-content svg ul {
        -webkit-margin-before: 1em;
        -webkit-margin-after: 1em;
        -webkit-margin-start: 0;
        -webkit-margin-end: 0;
        -webkit-padding-start: 40px;
        margin-top: 1em;
        margin-bottom: 1em;
        margin-left: 0;
        margin-right: 0
    }

    .doc-flow-chart .chart-content svg ol:not(:-webkit-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
        padding-left: 40px
    }

    .doc-flow-chart .chart-content svg ol:not(:-moz-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
        padding-left: 40px
    }

    .doc-flow-chart .chart-content svg ol:not(:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
        padding-left: 40px
    }

    .doc-flow-chart .chart-content svg ul:not(:-webkit-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
        padding-left: 40px
    }

    .doc-flow-chart .chart-content svg ul:not(:-moz-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
        padding-left: 40px
    }

    .doc-flow-chart .chart-content svg ul:not(:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
        padding-left: 40px
    }

    .doc-flow-chart .chart-content svg ol:-webkit-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
        padding-right: 40px
    }

    .doc-flow-chart .chart-content svg ol:-moz-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
        padding-right: 40px
    }

    .doc-flow-chart .chart-content svg ol:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
        padding-right: 40px
    }

    .doc-flow-chart .chart-content svg ul:-webkit-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
        padding-right: 40px
    }

    .doc-flow-chart .chart-content svg ul:-moz-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
        padding-right: 40px
    }

    .doc-flow-chart .chart-content svg ul:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
        padding-right: 40px
    }

    .doc-flow-chart div {
        line-height: 1.5
    }

    .doc-flow-chart .chart-title {
        opacity: 0;
        z-index: 9;
        align-items: center;
        transition: all .3s;
        display: flex;
        position: absolute;
        top: 7px;
        left: 9px
    }

    .doc-flow-chart .chart-title>svg>path {
        fill: rgb(var(--blue-7))
    }

    .doc-flow-chart .chart-title>span {
        margin-left: 5px;
        font-size: 14px
    }

    .doc-flow-chart:hover>.chart-title {
        opacity: 1
    }

    .doc-flow-chart.is-selected {
        cursor: zoom-in
    }

    .arco-image-preview-img-container .arco-image-preview-img {
        background-color: #fff
    }

    .arco-trigger.indent-trigger-menu .arco-btn.flow-chart-edit-btn {
        align-items: center;
        padding: 0 3px;
        display: flex
    }

    .arco-trigger.indent-trigger-menu .arco-btn.flow-chart-edit-btn span {
        font-size: 14px
    }

    .blank-reference-line {
        border: 1px solid transparent;
        height: 100%
    }

    .blank-reference-line.enable {
        background-image: radial-gradient(circle, #999 .8px, transparent 0)
    }

    .editor-kit-container .file-spin {
        width: auto !important
    }

    .editor-kit-container .file-plugin-container .file-wrapper {
        border: 2px solid transparent;
        line-height: 0;
        display: inline-block;
        position: relative
    }

    .editor-kit-container .file-plugin-container .file-wrapper:not(.selected):hover {
        box-shadow: 0 0 0 2px #bacefd
    }

    .editor-kit-container .file-plugin-container .file-wrapper.selected {
        border-color: #3370ff;
        outline: none !important
    }

    .editor-kit-container .file-plugin-container .file-wrapper.selected .file-container {
        box-shadow: none
    }

    .editor-kit-container .file-plugin-container .file-wrapper.selected .point.n-icon-dragable {
        display: block
    }

    .editor-kit-container .iframe-wrapper {
        border: 2px solid transparent;
        max-width: 100%;
        line-height: 0;
        display: inline-block;
        position: relative
    }

    .editor-kit-container .iframe-wrapper .iframe-container {
        max-width: 100%
    }

    .editor-kit-container .iframe-wrapper:not(.selected):hover {
        box-shadow: 0 0 0 2px #bacefd
    }

    .editor-kit-container .iframe-wrapper.selected {
        border-color: #3370ff;
        outline: none !important
    }

    .editor-kit-container .iframe-wrapper.selected .point.n-icon-dragable {
        display: block
    }

    .editor-kit-container .iframe-wrapper .point {
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        background-color: #3370ff;
        border: 2px solid #fff;
        width: 18px;
        height: 18px;
        font-size: 14px;
        display: none;
        position: absolute
    }

    .editor-kit-container .iframe-wrapper .point.n-icon-dragable {
        background: #3370ff;
        border-radius: 50%;
        width: 16px;
        height: 16px
    }

    .editor-kit-container .iframe-wrapper .tl {
        cursor: nwse-resize;
        top: -10px;
        left: -10px
    }

    .editor-kit-container .iframe-wrapper .tc {
        cursor: n-resize;
        margin-left: -10px;
        top: -10px;
        left: 50%
    }

    .editor-kit-container .iframe-wrapper .tr {
        cursor: nesw-resize;
        top: -10px;
        right: -10px
    }

    .editor-kit-container .iframe-wrapper .rc {
        cursor: e-resize;
        margin-top: -10px;
        top: 50%;
        right: -10px
    }

    .editor-kit-container .iframe-wrapper .br {
        cursor: nwse-resize;
        bottom: -10px;
        right: -10px
    }

    .editor-kit-container .iframe-wrapper .bc {
        cursor: s-resize;
        margin-left: -10px;
        bottom: -10px;
        left: 50%
    }

    .editor-kit-container .iframe-wrapper .bl {
        cursor: nesw-resize;
        bottom: -10px;
        left: -10px
    }

    .editor-kit-container .iframe-wrapper .lc {
        cursor: w-resize;
        margin-top: -10px;
        top: 50%;
        left: -10px
    }

    .editor-kit-container .iframe-wrapper .n-icon-dragable-disabled {
        cursor: not-allowed !important;
        background-color: #ccc !important
    }

    .editor-kit-container.unresize .image-wrapper {
        border: 0
    }

    .editor-kit-container.unresize .image-wrapper:hover {
        box-shadow: none
    }

    .editor-kit-container.unresize .image-wrapper .point.n-icon-dragable {
        display: none
    }

    .render-container .editor-kit-container .code-block-wrapper:not(.selected):hover,
    .render-container .editor-kit-container .file-wrapper:not(.selected):hover,
    .render-container .editor-kit-container .group-wrapper:not(.selected):hover,
    .render-container .editor-kit-container .iframe-wrapper:not(.selected):hover,
    .render-container .editor-kit-container .image-wrapper:not(.selected):hover,
    .render-container .editor-kit-container .video-wrapper:not(.selected):hover {
        box-shadow: none
    }

    .render-container .editor-kit-container .code-block-wrapper.selected,
    .render-container .editor-kit-container .file-wrapper.selected,
    .render-container .editor-kit-container .group-wrapper.selected,
    .render-container .editor-kit-container .iframe-wrapper.selected,
    .render-container .editor-kit-container .image-wrapper.selected,
    .render-container .editor-kit-container .video-wrapper.selected {
        border-color: transparent;
        outline: none !important
    }

    .render-container .editor-kit-container .embed-plugin-container-mask {
        display: none
    }

    .embed-plugin-container-mask {
        z-index: 116;
        width: 100%;
        height: 100%;
        position: absolute
    }

    .fast-input-container {
        -ms-overflow-style: none;
        background: var(--color-bg-1);
        background-color: var(--color-bg-1);
        border: 1px solid var(--color-border-2);
        box-shadow: 0 0 4px var(--color-border-1);
        box-sizing: content-box;
        max-height: 300px;
        overflow: -moz-scrollbars-none;
        scrollbar-width: none;
        z-index: 100;
        border-radius: 3px;
        width: 160px;
        padding: 8px 6px;
        position: fixed;
        overflow-y: auto
    }

    .fast-input-container::-webkit-scrollbar {
        display: none
    }

    .fast-input-container .fast-input-item {
        box-sizing: border-box;
        color: var(--color-text-2);
        cursor: pointer;
        align-items: center;
        padding: 6px 7px;
        display: flex
    }

    .fast-input-container .fast-input-item .fast-input-item-icon {
        color: rgba(var(--blue-7), .9);
        align-items: center;
        margin-right: 7px;
        font-size: 16px;
        display: flex
    }

    .fast-input-container .fast-input-item .fast-input-item-icon>span {
        align-items: center;
        display: flex
    }

    .fast-input-container .fast-input-item .fast-input-item-title {
        font-size: 14px
    }

    .fast-input-container .fast-input-item.active {
        background-color: var(--color-fill-2)
    }

    .editor-kit-container .fast-input-placeholder {
        position: relative
    }

    .editor-kit-container .fast-input-placeholder.fast-input-placeholder-hide:after {
        display: none
    }

    .editor-kit-container .fast-input-placeholder:after {
        color: var(--color-text-4);
        content: attr(data-placeholder);
        cursor: text;
        text-overflow: ellipsis;
        vertical-align: middle;
        white-space: nowrap;
        max-width: calc(100% - 1em);
        display: inline;
        position: absolute;
        top: 1px;
        left: 6px;
        overflow: hidden
    }

    .header-upload-box {
        background: var(--color-fill-2);
        border: 1px dashed var(--color-neutral-3);
        border-radius: var(--border-radius-small);
        color: var(--color-text-2);
        justify-content: center;
        align-items: center;
        width: 216px;
        height: 58px;
        display: flex;
        position: relative
    }

    .header-upload-box:hover {
        background-color: var(--color-fill-3);
        border-color: var(--color-neutral-4);
        color: var(--color-text-2)
    }

    .header-menu-modal .arco-modal-header {
        border-bottom: none
    }

    .header-menu-modal .arco-modal-footer {
        border-top: none
    }

    .header-menu-modal .drop-over-downward td {
        border-bottom: 1px dashed #212227
    }

    .header-menu-modal .drop-over-upward td {
        border-top: 1px dashed #212227
    }

    .header-menu-modal .drop-over td {
        background-color: #f8f8ff
    }

    .header-menu-modal .editable-cell {
        padding: 1px 7px;
        display: inline-block
    }

    .header-menu-modal .editable-cell:hover:not(.disabled) {
        border: 1px solid var(--color-border);
        border-radius: 4px;
        padding: 0 6px
    }

    .header-menu-modal .arco-table-cell-expand-icon {
        padding: 1px 0
    }

    .header-menu-modal .arco-table-td {
        padding: 12px 16px
    }

    .header-menu-modal .arco-form-message {
        min-height: 12px;
        line-height: 12px;
        position: absolute
    }

    .header-menu-modal .icon-hover {
        transition: color .1s linear
    }

    .header-menu-modal .icon-hover:hover {
        color: #8b8f98
    }

    .header-menu-modal .arco-cascader-list-item-label {
        text-overflow: ellipsis;
        white-space: nowrap;
        max-width: 360px;
        overflow: hidden
    }

    .collapse-table-container {
        background-color: var(--color-bg-1);
        border: 1px dashed var(--color-border-3);
        box-sizing: border-box;
        display: flex;
        position: relative
    }

    .collapse-table-container>.collapse-table-editor,
    .collapse-table-container>.collapse-table-preview {
        box-sizing: border-box;
        flex-shrink: 0;
        width: 50%
    }

    .collapse-table-container>.collapse-table-editor.full-panel,
    .collapse-table-container>.collapse-table-preview.full-panel {
        border-right: none;
        width: 100%;
        max-width: 100%
    }

    .collapse-table-container>.collapse-table-editor .with-error,
    .collapse-table-container>.collapse-table-preview .with-error {
        opacity: 0;
        visibility: hidden
    }

    .collapse-table-container .collapse-table-preview {
        font-size: 14px
    }

    .collapse-table-container .collapse-table-preview.loading {
        visibility: hidden;
        position: fixed
    }

    .collapse-table-container.is-render {
        border: none
    }

    .collapse-table-container.is-render>.collapse-table-preview {
        max-width: 100%
    }

    .collapse-table-container .loading-placeholder {
        border: 1px solid #eee;
        border-radius: 3px;
        width: 100%
    }

    .collapse-table-container .collapse-table-editor {
        border-right: 1px dashed #eee
    }

    .collapse-table-container:-webkit-full-screen .collapse-table-editor {
        max-height: 100vh;
        overflow-y: auto
    }

    .collapse-table-container:-moz-full-screen .collapse-table-editor {
        max-height: 100vh;
        overflow-y: auto
    }

    .collapse-table-container:fullscreen .collapse-table-editor {
        max-height: 100vh;
        overflow-y: auto
    }

    .collapse-table-container:-webkit-full-screen .collapse-table-preview {
        max-height: 100vh;
        overflow-y: auto
    }

    .collapse-table-container:-moz-full-screen .collapse-table-preview {
        max-height: 100vh;
        overflow-y: auto
    }

    .collapse-table-container:fullscreen .collapse-table-preview {
        max-height: 100vh;
        overflow-y: auto
    }

    .collapse-table-container .collapse-table-operation {
        border: 1px solid var(--color-border-2);
        color: var(--color-text-2);
        background-color: #fff;
        border-radius: 3px;
        padding: 5px;
        display: none;
        position: absolute;
        top: 0;
        right: 0;
        transform: translateY(-105%)
    }

    .collapse-table-container .collapse-table-operation .arco-icon {
        cursor: pointer;
        border-radius: 3px;
        margin: 0 2px;
        padding: 2px
    }

    .collapse-table-container .collapse-table-operation .arco-icon.active,
    .collapse-table-container .collapse-table-operation .arco-icon:hover {
        background-color: #eee
    }

    .collapse-table-container:hover .collapse-table-operation {
        display: flex
    }

    .editor-css-container .docSwitch {
        padding: 0 32px 40px;
        display: flow-root
    }

    .editor-css-container .switch {
        width: 100%;
        display: flex
    }

    .editor-css-container .switch :global .arco-btn-text:not(.arco-btn-disabled) {
        color: #1a2233 !important
    }

    .editor-css-container .left {
        cursor: pointer;
        flex-grow: 1;
        align-self: flex-start
    }

    .editor-css-container .left span {
        font-size: 18px;
        font-weight: 500
    }

    .editor-css-container .right {
        cursor: pointer;
        flex-grow: 1;
        align-self: flex-end
    }

    .editor-css-container .right:not(:-webkit-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
        text-align: right
    }

    .editor-css-container .right:not(:-moz-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
        text-align: right
    }

    .editor-css-container .right:not(:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
        text-align: right
    }

    .editor-css-container .right:-webkit-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
        text-align: left
    }

    .editor-css-container .right:-moz-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
        text-align: left
    }

    .editor-css-container .right:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
        text-align: left
    }

    .editor-css-container .right span {
        font-size: 18px;
        font-weight: 500
    }

    .editor-css-container .jumpLeft {
        padding-left: 16px
    }

    .editor-css-container .jumpLeft,
    .editor-css-container .jumpRight {
        color: #86909c;
        font-size: 14px;
        font-style: normal;
        font-weight: 400;
        line-height: 22px
    }

    .editor-css-container .jumpRight {
        padding-right: 16px
    }

    .editor-css-container .switch-title {
        box-sizing: border-box;
        text-align: left;
        text-overflow: ellipsis;
        white-space: nowrap;
        max-width: 300px;
        margin-top: 8px;
        font-size: 14px;
        font-style: normal;
        font-weight: 400;
        line-height: 22px;
        overflow: hidden
    }

    .editor-css-container .switch-title.arco-btn-size-default {
        border: none
    }

    .editor-css-container .switch-title.right {
        text-align: right
    }

    @media screen and (max-width:300px) {
        .editor-css-container .switch-title {
            max-width: 230px
        }
    }

    .editor-css-container .divider {
        margin: 35px 0
    }

    @media screen and (max-width:640px) {
        .editor-css-container .docSwitch {
            padding: 0
        }

        .editor-css-container .switch {
            flex-direction: column;
            display: flex
        }

        .editor-css-container .switch .item {
            border: 1px solid var(--color-border);
            box-sizing: border-box;
            border-radius: 8px;
            width: 100%;
            height: 100%;
            padding: 11px 16px 13px;
            transition: border-color .25s;
            display: block
        }

        .editor-css-container .switch .item .jumpLeft,
        .editor-css-container .switch .item .jumpRight {
            padding: 0;
            font-size: 12px;
            line-height: 20px
        }

        .editor-css-container .switch .item.right {
            margin-top: 8px
        }

        .editor-css-container .switch .item.left span,
        .editor-css-container .switch .item.right span {
            font-size: 16px
        }

        .editor-css-container .switch .switch-title {
            margin: 0;
            padding: 0;
            font-size: 16px
        }

        .editor-css-container .divider {
            margin: 20px 0
        }
    }

    .tab-item-editor .arco-breadcrumb-item,
    .tab-item-editor .arco-link {
        padding: 0
    }

    .tab-item-editor .tab-item-title {
        margin-bottom: 10px
    }

    .tab-item-editor .form-item-align-right .arco-form-item-control-children {
        flex-direction: row-reverse;
        display: flex
    }

    .editor-kit-container .list-button.arco-btn-secondary:not(.arco-btn-disabled) {
        box-shadow: none;
        color: #337aff;
        white-space: nowrap;
        background-color: transparent;
        border: none;
        min-width: 20px;
        height: 26px;
        margin: 0 6px 0 -4px;
        padding: 0 2px;
        font-size: 16px;
        line-height: 26px
    }

    .editor-kit-container .list-button.arco-btn-secondary:not(.arco-btn-disabled):hover {
        color: #337aff
    }

    .editor-kit-container .list-button-render.arco-btn-secondary:not(.arco-btn-disabled) {
        cursor: default
    }

    .editor-kit-container .list-button-render.arco-btn-secondary:not(.arco-btn-disabled):hover {
        background-color: transparent
    }

    .doc-list-trigger {
        background: var(--color-bg-1);
        background-color: var(--color-bg-1);
        border: 1px solid var(--color-border-2);
        box-shadow: 0 0 4px var(--color-border-1);
        border-radius: 3px;
        padding: 5px
    }

    .doc-list-trigger .doc-list-menu .arco-menu-inner {
        padding: 0
    }

    .doc-list-trigger .doc-list-menu .arco-menu-item {
        height: 30px;
        padding: 0 10px;
        line-height: 30px
    }

    .doc-list-trigger .doc-list-menu .arco-menu-item:last-child {
        margin: 0
    }

    .r-list.r-list-number {
        display: flex
    }

    .r-list.r-list-number .list-button {
        flex-shrink: 0
    }

    .r-list.r-list-number .ordered-list-content {
        word-break: break-word;
        flex: 1 0
    }

    .float-toolbar-dropdown-list.tags-dropdown-list {
        padding: 0
    }

    .float-toolbar-dropdown-list.tags-dropdown-list .tags-dropdown-scroll {
        -ms-overflow-style: none;
        max-height: 300px;
        overflow: -moz-scrollbars-none;
        scrollbar-width: none;
        padding: 4px 6px
    }

    .float-toolbar-dropdown-list.tags-dropdown-list .tags-dropdown-scroll::-webkit-scrollbar {
        display: none
    }

    .float-toolbar-dropdown-list.tags-dropdown-list .tags-row {
        box-sizing: border-box;
        cursor: pointer;
        text-overflow: ellipsis;
        white-space: nowrap;
        border-radius: 4px;
        align-items: center;
        width: 220px;
        height: 32px;
        padding: 0 12px;
        display: flex;
        overflow: hidden
    }

    .float-toolbar-dropdown-list.tags-dropdown-list .tags-row>span {
        text-overflow: ellipsis;
        white-space: nowrap;
        overflow: hidden
    }

    .float-toolbar-dropdown-list.tags-dropdown-list .tags-row.active {
        color: rgba(var(--primary-6));
        letter-spacing: .003em;
        background: #f6f8fa;
        font-weight: 500
    }

    .float-toolbar-dropdown-list.tags-dropdown-list .dropdown-list-tag-color {
        color: #fff;
        border-radius: 50%;
        flex-shrink: 0;
        justify-content: center;
        align-items: center;
        width: 12px;
        height: 12px;
        margin-right: 7px;
        display: flex
    }

    .float-toolbar-dropdown-list.tags-dropdown-list .dropdown-list-tag-color .arco-icon {
        margin: 2px
    }

    .float-toolbar-dropdown-list.tags-dropdown-list .tags-edit-page {
        box-sizing: content-box;
        cursor: pointer;
        border-top: 1px solid #eaedf1;
        align-items: center;
        height: 32px;
        padding: 4px 6px;
        display: flex
    }

    .float-toolbar-dropdown-list.tags-dropdown-list .tags-edit-page>div {
        box-sizing: border-box;
        border-radius: 4px;
        align-items: center;
        width: 100%;
        height: 100%;
        padding: 0 12px;
        display: flex
    }

    .float-toolbar-dropdown-list.tags-dropdown-list .tags-edit-page>div:hover {
        background-color: var(--color-fill-1)
    }

    .float-toolbar-item.tags-toolbar-item {
        margin-left: 0;
        padding-left: 0
    }

    .geEditor {
        z-index: 9999;
        border: none;
        margin: 0;
        font-size: 14px;
        position: fixed;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0
    }

    .geEditor input[type=text]::-ms-clear {
        display: none
    }

    .geEditor input,
    button,
    select,
    textarea {
        font-size: inherit
    }

    .geEditor select {
        border-width: 1px
    }

    .geEditor div.mxTooltip {
        color: #000;
        background: #f5f5f5;
        border-color: #d3d3d3;
        padding: 6px;
        font-size: 11px
    }

    .geMenubarContainer .geItem,
    .geToolbar .geButton,
    .geToolbar .geLabel {
        cursor: pointer !important
    }

    .geSidebarContainer .geTitle {
        cursor: default !important
    }

    .geBackgroundPage {
        box-shadow: 0 0 2px 1px #d1d1d1
    }

    .geMenubarContainer a,
    .geSidebarContainer a,
    .geToolbar a {
        color: #000;
        text-decoration: none
    }

    .geDiagramContainer,
    .geFooterContainer,
    .geHsplit,
    .geMenubarContainer,
    .geSidebarContainer,
    .geToolbarContainer,
    .geVsplit {
        cursor: default;
        position: absolute;
        overflow: hidden
    }

    .geFormatContainer {
        border-left: 1px solid #dadce0;
        font-size: 12px;
        overflow-x: hidden !important;
        overflow-y: auto !important
    }

    .geSidebarFooter {
        border-top: 1px solid #dadce0
    }

    .geFormatSection {
        border-color: #dadce0;
        border-bottom-style: solid;
        border-bottom-width: 1px
    }

    .geDiagramContainer {
        background-color: #fff;
        outline: none;
        font-size: 0
    }

    .geMenubar,
    .geToolbar {
        white-space: nowrap;
        width: 100%;
        display: block
    }

    .geMenubarContainer .geItem,
    .geSidebar,
    .geSidebar .geItem,
    .geSidebarContainer .geTitle,
    .geToolbar .geButton,
    .geToolbar .geLabel,
    .mxPopupMenuItem {
        transition: all .1s ease-in-out
    }

    .geHint {
        -webkit-filter: alpha(opacity=80);
        filter: alpha(opacity=80);
        opacity: .8;
        background-color: #fff;
        border: 1px solid gray;
        border-radius: 3px;
        padding: 4px 16px;
        font-size: 9pt;
        box-shadow: 1px 1px 2px #ddd
    }

    .geStatusAlert {
        white-space: nowrap;
        background-color: #f2dede;
        border: 1px solid #ebccd1;
        border-radius: 3px;
        margin-top: -5px;
        padding: 4px 6px;
        font-size: 12px;
        color: #a94442 !important
    }

    .geStatusAlert:hover {
        background-color: #f1d8d8;
        border-color: #d6b2b8
    }

    .geStatusMessage {
        white-space: nowrap;
        background: linear-gradient(#dff0d8, #c8e5bc) repeat-x;
        border: 1px solid #b2dba1;
        border-radius: 3px;
        margin-top: -5px;
        padding: 4px 6px;
        font-size: 12px;
        color: #3c763d !important
    }

    .geAlert {
        color: #a94442;
        white-space: nowrap;
        background-color: #f2dede;
        border: 1px solid #ebccd1;
        border-radius: 3px;
        padding: 14px;
        position: absolute;
        box-shadow: 2px 2px 3px #ddd
    }

    .geBtn,
    .mxWindow .geBtn {
        color: #333;
        cursor: default;
        cursor: pointer;
        letter-spacing: .25px;
        background-color: #f5f5f5;
        background-image: none;
        border: 1px solid #d8d8d8;
        border-radius: 2px;
        outline: 0;
        min-width: 72px;
        height: 29px;
        margin: 0 0 0 8px;
        padding: 0 8px;
        font-size: 13px;
        font-weight: 500;
        line-height: 27px
    }

    .geBtn:focus,
    .geBtn:hover {
        color: #111;
        background-color: #f8f8f8;
        background-image: linear-gradient(#f8f8f8, #f1f1f1);
        border: 1px solid #c6c6c6;
        box-shadow: 0 1px 1px rgba(0, 0, 0, .1)
    }

    .geBtn:active,
    .geStatus:active {
        opacity: .7
    }

    .geBtn:disabled,
    .geToolbarContainer>.geToolbar>div>a:active {
        opacity: .5
    }

    .geBtnUp {
        background-image: url(data:image/gif;base64,R0lGODlhCgAGAJECAGZmZtXV1f///wAAACH/C1hNUCBEYXRhWE1QPD94cGFja2V0IGJlZ2luPSLvu78iIGlkPSJXNU0wTXBDZWhpSHpyZVN6TlRjemtjOWQiPz4gPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iQWRvYmUgWE1QIENvcmUgNS4wLWMwNjAgNjEuMTM0Nzc3LCAyMDEwLzAyLzEyLTE3OjMyOjAwICAgICAgICAiPiA8cmRmOlJERiB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiPiA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtbG5zOnhtcE1NPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvbW0vIiB4bWxuczpzdFJlZj0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL3NUeXBlL1Jlc291cmNlUmVmIyIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ1M1IE1hY2ludG9zaCIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDo0QzM3ODJERjg4NUQxMUU0OTFEQ0E2MzRGQzcwNUY3NCIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDo0QzM3ODJFMDg4NUQxMUU0OTFEQ0E2MzRGQzcwNUY3NCI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjRDMzc4MkREODg1RDExRTQ5MURDQTYzNEZDNzA1Rjc0IiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjRDMzc4MkRFODg1RDExRTQ5MURDQTYzNEZDNzA1Rjc0Ii8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+Af/+/fz7+vn49/b19PPy8fDv7u3s6+rp6Ofm5eTj4uHg397d3Nva2djX1tXU09LR0M/OzczLysnIx8bFxMPCwcC/vr28u7q5uLe2tbSzsrGwr66trKuqqainpqWko6KhoJ+enZybmpmYl5aVlJOSkZCPjo2Mi4qJiIeGhYSDgoGAf359fHt6eXh3dnV0c3JxcG9ubWxramloZ2ZlZGNiYWBfXl1cW1pZWFdWVVRTUlFQT05NTEtKSUhHRkVEQ0JBQD8+PTw7Ojk4NzY1NDMyMTAvLi0sKyopKCcmJSQjIiEgHx4dHBsaGRgXFhUUExIREA8ODQwLCgkIBwYFBAMCAQAAIfkEAQAAAgAsAAAAAAoABgAAAg6UjwiQBhGYglCKhXFLBQA7);
        background-position: 50%;
        background-repeat: no-repeat
    }

    .geBtnUp:active {
        background-color: #4d90fe;
        background-image: linear-gradient(#4d90fe, #357ae8)
    }

    .geBtnDown {
        background-image: url(data:image/gif;base64,R0lGODlhCgAGAJECANXV1WZmZv///wAAACH/C1hNUCBEYXRhWE1QPD94cGFja2V0IGJlZ2luPSLvu78iIGlkPSJXNU0wTXBDZWhpSHpyZVN6TlRjemtjOWQiPz4gPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iQWRvYmUgWE1QIENvcmUgNS4wLWMwNjAgNjEuMTM0Nzc3LCAyMDEwLzAyLzEyLTE3OjMyOjAwICAgICAgICAiPiA8cmRmOlJERiB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiPiA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtbG5zOnhtcE1NPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvbW0vIiB4bWxuczpzdFJlZj0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL3NUeXBlL1Jlc291cmNlUmVmIyIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ1M1IE1hY2ludG9zaCIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDo0QzM3ODJEQjg4NUQxMUU0OTFEQ0E2MzRGQzcwNUY3NCIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDo0QzM3ODJEQzg4NUQxMUU0OTFEQ0E2MzRGQzcwNUY3NCI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjRDMzc4MkQ5ODg1RDExRTQ5MURDQTYzNEZDNzA1Rjc0IiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjRDMzc4MkRBODg1RDExRTQ5MURDQTYzNEZDNzA1Rjc0Ii8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+Af/+/fz7+vn49/b19PPy8fDv7u3s6+rp6Ofm5eTj4uHg397d3Nva2djX1tXU09LR0M/OzczLysnIx8bFxMPCwcC/vr28u7q5uLe2tbSzsrGwr66trKuqqainpqWko6KhoJ+enZybmpmYl5aVlJOSkZCPjo2Mi4qJiIeGhYSDgoGAf359fHt6eXh3dnV0c3JxcG9ubWxramloZ2ZlZGNiYWBfXl1cW1pZWFdWVVRTUlFQT05NTEtKSUhHRkVEQ0JBQD8+PTw7Ojk4NzY1NDMyMTAvLi0sKyopKCcmJSQjIiEgHx4dHBsaGRgXFhUUExIREA8ODQwLCgkIBwYFBAMCAQAAIfkEAQAAAgAsAAAAAAoABgAAAg6UjxLLewEiCAnOZBzeBQA7);
        background-position: 50%;
        background-repeat: no-repeat
    }

    .geBtnDown:active {
        background-color: #4d90fe;
        background-image: linear-gradient(#4d90fe, #357ae8)
    }

    .geColorBtn {
        color: #333;
        cursor: default;
        cursor: pointer;
        background-color: #f5f5f5;
        background-image: linear-gradient(#f5f5f5, #e1e1e1);
        border: 1px solid rgba(0, 0, 0, .5);
        border-radius: 4px;
        outline: 0;
        margin: 0;
        padding: 0
    }

    .geColorBtn:hover {
        border: 1px solid rgba(0, 0, 0, .7);
        box-shadow: 0 1px 1px rgba(0, 0, 0, .1)
    }

    .geColorBtn:active {
        color: #fff;
        background-color: #4d90fe;
        background-image: linear-gradient(#4d90fe, #357ae8);
        border: 1px solid #2f5bb7
    }

    .geColorBtn:disabled {
        opacity: .5
    }

    .gePrimaryBtn,
    .mxWindow .gePrimaryBtn {
        color: #fff;
        background-color: #4d90fe;
        background-image: linear-gradient(#4d90fe, #4787ed);
        border: 1px solid #3079ed
    }

    .gePrimaryBtn:focus,
    .gePrimaryBtn:hover {
        color: #fff;
        background-color: #357ae8;
        background-image: linear-gradient(#4d90fe, #357ae8);
        border: 1px solid #2f5bb7
    }

    .gePrimaryBtn:disabled {
        opacity: .5
    }

    .geAlertLink {
        color: #843534;
        font-weight: 700;
        text-decoration: none
    }

    .geActivePage {
        font-weight: 700;
        color: #188038 !important
    }

    .geHsplit,
    .geMenubarContainer,
    .geToolbarContainer,
    .geVsplit {
        background-color: #fbfbfb
    }

    .geMenubar {
        vertical-align: middle;
        padding: 0 2px
    }

    .geMenubarContainer .geItem,
    .geToolbar .geItem {
        cursor: default;
        padding: 6px 6px 6px 9px
    }

    .geMenubarContainer .geItem:hover {
        background: #eee;
        border-radius: 2px
    }

    .geMenubarContainer .geItem:active {
        background: #f8c382
    }

    .geToolbarContainer .geButton:hover {
        opacity: 1;
        background: #eee;
        border-radius: 2px
    }

    .geToolbarContainer .geButton:active,
    .geToolbarContainer .geLabel:active {
        background: #f8c382
    }

    .geToolbarContainer .geLabel:hover {
        background: #eee;
        border-radius: 2px
    }

    .geToolbarButton {
        opacity: .6
    }

    .geToolbarButton:active {
        opacity: .2
    }

    .mxDisabled:hover {
        background: inherit !important
    }

    .geMenubar a.geStatus {
        color: #888;
        padding-left: 12px;
        display: inline-block;
        cursor: default !important
    }

    .geMenubar a.geStatus:hover {
        background: 0 0
    }

    .geToolbarContainer {
        border-bottom: 1px solid #dadce0
    }

    .geSidebarContainer .geToolbarContainer {
        background: 0 0;
        border-bottom: none
    }

    .geSidebarContainer button {
        text-overflow: ellipsis;
        overflow: hidden
    }

    .geToolbar {
        border-top: 1px solid #dadce0;
        padding: 5px 0 0 6px;
        box-shadow: inset 0 1px #fff
    }

    .geToolbarContainer .geSeparator {
        float: left;
        background: #e5e5e5;
        width: 1px;
        height: 20px;
        margin-top: 4px;
        margin-left: 6px;
        margin-right: 6px
    }

    .geToolbarContainer .geButton {
        cursor: pointer;
        float: left;
        opacity: .6;
        border: 1px solid transparent;
        width: 20px;
        height: 20px;
        margin: 2px;
        padding: 0 2px 4px
    }

    div.mxWindow .geButton {
        margin: -1px 2px 2px;
        padding: 1px 2px 2px 1px
    }

    .geToolbarContainer .geLabel {
        cursor: pointer;
        float: left;
        border: 1px solid transparent;
        margin: 2px;
        padding: 3px 5px
    }

    .geToolbarContainer .mxDisabled:hover {
        opacity: .2 !important;
        border: 1px solid transparent !important
    }

    .geDiagramBackdrop {
        background-color: #f8f9fa
    }

    .geSidebarContainer {
        background: #fbfbfb;
        position: absolute;
        overflow: auto
    }

    .geSidebarContainer.geFormatContainer>div {
        width: 240px
    }

    .geTabContainer {
        background-color: #f1f3f4;
        border-top: 1px solid #e5e5e5
    }

    .geSidebar {
        padding: 6px 6px 6px 10px
    }

    .geSidebar,
    .geSidebarContainer .geTitle {
        border-bottom: 1px solid #e5e5e5;
        overflow: hidden
    }

    .geSidebarContainer .geTitle {
        cursor: default;
        text-overflow: ellipsis;
        white-space: nowrap;
        margin: 0;
        padding: 8px 0 8px 14px;
        font-size: 13px;
        font-weight: 500;
        line-height: 1.4em;
        display: block
    }

    .geSidebarContainer .geTitle:hover {
        background: #eee;
        border-radius: 2px
    }

    .geSidebarContainer .geTitle:active {
        background-color: #f8c382
    }

    .geSidebarContainer .geDropTarget {
        color: #a0a0a0;
        text-align: center;
        border: 2px dotted #b0b0b0;
        border-radius: 10px;
        margin: 6px;
        padding: 6px
    }

    .geTitle img {
        opacity: .5
    }

    .geTitle img:hover {
        opacity: 1
    }

    .geTitle .geButton {
        border: 1px solid transparent;
        border-radius: 2px;
        padding: 3px
    }

    .geTitle .geButton:hover {
        border: 1px solid gray
    }

    .geSidebar .geItem {
        background-position: 50%;
        background-repeat: no-repeat;
        border-radius: 8px;
        display: inline-block
    }

    .geSidebar .geItem:hover {
        background-color: #e0e0e0
    }

    .geItem {
        vertical-align: top;
        display: inline-block
    }

    .geSidebarTooltip {
        background: #fbfbfb;
        border-radius: 6px;
        position: absolute;
        overflow: hidden;
        box-shadow: 0 2px 6px 2px rgba(60, 64, 67, .15)
    }

    .geFooterContainer {
        background: #e5e5e5;
        border-top: 1px solid silver
    }

    .geFooterContainer a {
        box-sizing: border-box;
        color: #235695;
        white-space: nowrap;
        width: 100%;
        font-size: 14px;
        font-weight: 700;
        text-decoration: none;
        display: inline-block
    }

    .geFooterContainer table {
        border-collapse: collapse;
        margin: 0 auto
    }

    .geFooterContainer td {
        border-left: 1px solid silver;
        border-right: 1px solid silver
    }

    .geFooterContainer td:hover {
        background-color: #b3b3b3
    }

    .geHsplit {
        cursor: col-resize;
        background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAAHBAMAAADdS/HjAAAAGFBMVEUzMzP///9tbW1QUFCKiopBQUF8fHxfX1/IXlmXAAAAHUlEQVQImWMQEGAQFWUQFmYQF2cQEmIQE2MQEQEACy4BF67hpEwAAAAASUVORK5CYII=)
    }

    .geHsplit,
    .geVsplit {
        background-position: 50%;
        background-repeat: no-repeat
    }

    .geVsplit {
        cursor: row-resize;
        background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAcAAAAEBAMAAACw6DhOAAAAGFBMVEUzMzP///9tbW1QUFCKiopBQUF8fHxfX1/IXlmXAAAAFElEQVQImWNgNVdzYBAUFBRggLMAEzYBy29kEPgAAAAASUVORK5CYII=);
        font-size: 1pt
    }

    .geHsplit {
        border-left: 1px solid #e5e5e5;
        border-right: 1px solid #e5e5e5
    }

    .geVSplit {
        border-top: 1px solid #e5e5e5;
        border-bottom: 1px solid #e5e5e5
    }

    .geHsplit:hover,
    .geVsplit:hover {
        background-color: #e0e0e0
    }

    .geDialog {
        background: #fff;
        border: 1px solid #acacac;
        line-height: 1em;
        box-shadow: 0 0 2px 2px #d5d5d5
    }

    .geDialog,
    .geTransDialog {
        z-index: 2;
        padding: 30px;
        position: absolute;
        overflow: hidden
    }

    .geDialogClose {
        cursor: pointer;
        opacity: .5;
        width: 9px;
        height: 9px;
        position: absolute
    }

    .geDialogClose:hover {
        opacity: 1
    }

    .geDialogTitle {
        color: #235695;
        text-align: center;
        background: #e5e5e5;
        border-bottom: 1px solid silver;
        font-size: 15px;
        font-weight: 700
    }

    .geDialogFooter,
    .geDialogTitle {
        box-sizing: border-box;
        white-space: nowrap
    }

    .geDialogFooter {
        color: #a9a9a9;
        text-align: right;
        background: #f5f5f5;
        border-top: 1px solid #e5e5e5
    }

    .geSprite {
        background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABUAABeQCAMAAAByzXKPAAAA1VBMVEUAAAAzMzIzMzIzMzE1NTUzMzIzMzIzMzEzMzIyMjIzMzIzMzIzMzIzMzE6OjoyMjIzMzIzMzIzMzEzMzI0NDA0NDIwMDAyMjEzMzIzMzEzMzE0NDAzMzMzMzIyMjIzMzI0NDE0NDQyMjIzMzIzMzIzMzIzMzM5OTkAAAC1tbX///9mZmYwMDAQEBAmJiZTiPJ7e3v/Z2RwcHAgICB+fn5hYWFzc3NAQECoqKiampqMjIxTU1NGRkY3NzcbGxsNDQ3w8PBQUFDg4ODAwMCwsLCgoKBPT09W+xp5AAAAKHRSTlMAh4DDEd187+mljnhvVge5nmhMQi4hA8uxk2IlHOOYc102M/jW088J/2liTQAACt5JREFUeNrs3O1um0AQheG5nIPCoIq1Q7+r/Mn9X1K9xtEAM9RLQmODzyO1cV+NtzjShhjHkRkAgn9DMCaYnRXIGOQdtWmk1zRWm0vNN6az+Y+v2fXZ5iTX/kZ4ZGvUNT6/RJuCM/VVRKFB7YBwtnY1k3h2wboaHy8RFQC2VGuc1D730WWLS2GIZ27aM4yUT+9tXaLNw9m0mI9uokepRLeC+ZyCfFCoqwckqV3WBHFZaxHLFrNxVpgUVRWjg/jli2WbfH4WyxYnWcVV0Rz7FYj26X9ezQcuE3VYkXzFSYpm9eq6pqSiuNYAaj+r0GiFxKv5tEOqxVfV0utrCkZF/HCXTuOdGz2IHKbDR5wdJ6PdeRmIsfviED0C5ZV7ojf487v59fPHsT18//a1Yn1HJdoSjIUXBG5XgaBejhMYVmT9B1dRUONj4KtyRHNmNkULDYeD2CGVjiZ0paOK1jVuYKIpjJTO7m9dovvEn3bz/DH4440f2+d9fvlVh+4LLuK6cM8GVcKKkmq3ZqqBfbhaef4n+pijBudNZH3H+OW3No+rbTmVXjfciPbs/GVQ7QU6tWqUW5lonefHfn5f6xI9DAxdqQU3n55uU821mj2ZuUq0SYo2ivA5tThxk3rK6u+urYtZiqKuGiWMEkbp4/OFLITIvyrfekt35WGvjvP6OlERwP6+VU39z+ansp+0SThP8jk+0SeoAehRjObmdha0f2YwfucMss7uaPVF3rThN/EH6fH3YhEt3bD1zMlwGtu8/8a5zrHJuR6NyrkKMK5N5qqf9ev6Y4hfGfSPrc7ZWZqPQrQPa+x5Cfe8FO55m3Xrcs8T3TFUYQ0zqj5jTPoMmagQz4brFh8D3x5L9OngyRy+IEa0JgBRlaBWAIJYyVYjYDF47PwNV/TwAIRfB+BiFcyeolchija6+P7xd//IveI+JlpwnrdZP7xexdD6/4N/PDzP06NZdc8vP4H7WKFXLbqjQcU9T7QZvFhHdN/+sndmy6lCQRQ9KOA8Ro1TxjttYuUlX5BK5f+/6YJIWjlNFREkpLJXGQuWO01e2mPaU4pA17qH7iEeKfRsrrqh4/t0hJQPEJSokULPFpJse0Iu0PNQNVSNnOu8ZHPWZc8TUhkBgECRikZMrp4Xq9W1NPubkIIUm4hnrtyikSIjq+jck3bOBQkpnSBrkU97ALl73pJqXfFc5AlJqN3cXvoTEKIzJcu5PSEFqHiGp6ahz+33Z3rWtpzhEfK16DO8XXi3S2vIvfUCHnpWrcsZHiHVAFUG0KQJoEgjGjGRFG1l9bq25gyPkIoANBcEab9DEPf27iCk40VbWa0uP86WkMsTQHPQHBSnJJHCytp1dW9Uz2cBQoo0PEqVes/r2bM0131CLtLzUCVUidw9n6uuaPY8IdnUYMet2BTccUtIfShnz60mBe65JaTunL/tVqTAbbeE1ImCc3vl16McIEiWc3tCClD5DM9Ak7ZFZCBkZEVzhkfI5/n6Hbdp+wF33BJSH8rZc6vISB/gnltCas/Z225FStdz2y0hZXE19lrt5p177NyR11+OHb/THhzJP86wP2uYrjvz1h92eTseNEzDbB2nd/OY1Py9WNw6/qjnN+fmvnmwnYkxjf1t+mAW7XlsbzaJ3a7DzH1sf3Udp7m/dcOf615sW26SdfvGrCaxbV4l9nEan0X0xqEaRrbvmnlrGFu3PTN3ndUoLOuapW8ODLzudLVomMHA71z/MwmT9mTmN+bOZnS9NcJDs+V53t+WPzQnbNa9/nRoCPl2AKqObKFvltEBoPvcVwNwmavxOy3IDwFAlkWCWPBqhJDC8GtsCPlGYI8ciQyRI+3/CLHHscysXvf0ynzWIOQsPr3wWllkxNQskD+b82/Ihi8qCCm150XpObXnc2RFs+cJqRhAE5AHpI8BOZbH5TQdlXB8JAUEIC4AvkFPSMEl/dQ+v74+2/bl6enFtm/v72+W/c/eHSW3CUNRGNZyjgiZNHE6fW2b6f63VGScCHSvI7CxjfH/tYnTU43CywFiAfnT/On+lunH3274R5G2zbv03rTj9F+z92+U7pqPX52PZjdM35uf6vxs3ofp799Kulf2B8CEc2JVjvJm6OIT5CO9PekvD/8T767XgTc2z1umnEdggyT5eX2s+k9yGpvH1kqvI523IVfSAzdlW2gbu3zn5+6j/JFcfIft0lBOi4/J6cbmBTZJTdPo9fV1/3pamqTUFCalOVkunVdNTU5bSa2Nn7ULjl0A7o5/aGt6Z6TKUpVC7/VLSrWzqTo7b+yzO+9i28shHtugl5cXXS9NLnyYHVZ+Nz79UG7y4in7Aqza9po+tBsXP1B8wCW3m01yVqq9G3w3q/X+/1lpZ5WEbKdOTnNsxiYtd+ngjl28Fw+zhwGwLA0/mDeIS46AxWnO2MVnUFD627+sasuAxyJpTsp3A+6WgnplGpILpL1JR21lZt5k2ZSrFPE41AteEy+Q9qrn58qW77lNM877sXXq+fcGLp/2giETZO5tTYumHObxKDQ0aezhxb2feNE0MWlvqZS1SzwsJZdslu3x9fYae8HFXYeAKcIVejxwzgwc0YE6jTzuWOAuqOS+GTY3rc+rmDxAKn7VEPAt+amm/7Yu8ev0gfnkHckljT8nSoaf/RkeNgUejaKburGiYt696FNIcXrt/3yJh8Qba+advg0BwJCk66Qamp3WvxtX1gMzSDZya+BU8y2OR+ogyk7w5h+Nox+/6S04pNunwKqpt9Db9yemA2GokjqThGR+ms1JeYMe92hu5y2Zbs5O5be7mkru2Hlpgc5j434M1NPiq0qqgXoaDkwqTU21V0s7dgY/TfLX9XMT1udx56RJqTqf5aqlR3vVqtOWaYpbp4NtW2tmPaXbwAZI0U1zroI/tiRW9oBVOtL5QT6uu2TH0nlgnXRSqsLkGXg+JnBTCjopVeGceXk2FnAtColkUynGMn1SrHXejq3Py4U5wHXZvtluJtXO27H+vFyMB9xElFIxNQ6fUmFj9Xm6Sr67SrA6b94Gfp4HLsb2rSM53VSMpseK1c7bsXbechs4zgO3EiUvs6kK7tgsUmlglaLkZiZVStzOBzoPrJHOS1VgVR5YuTPXz1VgXR5YM/+u9xglkyZRT2WqghlbnVc8CA+4mtxRp5vB7XxW7bw3LwvywI0pr5MN6HNNrUi/fUZO4o6tzxuiuO0GuLzUUdu3GOV3M6raeTu2Nm8aR+eBlVD1BnoVjowt0HBgnY51PrqdT/9yxtJ5YHWkeGKswoxJuMcGuIYoKdowKOQ4Xxov+4Zb/khU8Mf681a3gZ/0gYt1PjGdV1J2/mBS5z/58zrbQOeBE6zpGZgA7smRzgc6D2xKlORlCiUVKrfSslMAVulI56PX+XHv81g6D6yPFM+MVWCJDliLJdfoMhVYowPWYsk1ukwF1uiAu1R/Hh5v2wNb8r+9O0pBGAaiKLqdm/1vUCiFSCdhTIjWhntAwefY5sMxRW1ToJnZ89KjQTnuGzGUWB1DLkJtul0ofocn3SOf5wMu3mu97q30GN2e99he2gKEpj6Dkvwjj4tebb5d8EBAuhuUJJ87f96f4aT/1OlNz7GRfgg+WheCUFsfE16cpEFNx5exIUmHx09zd34AaRdACCDp+TVLSlFv1blzgKR2egx5zx/see0pn+djbR4FIVofz4/UeV67G3+vr3niC+H04Oz/nbwA7lqtm+wByfQAAAAASUVORK5CYII=) no-repeat;
        width: 21px;
        height: 21px
    }

    .geBaseButton {
        cursor: pointer;
        background-color: #ececec;
        background-image: linear-gradient(#ececec, #fcfcfc);
        border: 1px solid silver;
        border-radius: 6px;
        padding: 10px
    }

    .geBaseButton:hover {
        background: #ececec
    }

    .geBigButton {
        color: #fff;
        cursor: pointer;
        text-overflow: ellipsis;
        -o-transition: background-color .1s ease-out;
        white-space: nowrap;
        background-color: #0052cc;
        border: none;
        border-radius: 3px;
        padding: 4px 10px;
        font-size: 14px;
        transition: background-color .1s ease-out;
        overflow: hidden
    }

    .geBigButton:hover {
        background-color: #0065ff
    }

    .geBigButton:active {
        background-color: #0747a6
    }

    html body .geBigStandardButton {
        color: #344563;
        background-color: rgba(9, 30, 66, .08)
    }

    html body .geBigStandardButton:hover {
        background-color: rgba(9, 30, 66, .13)
    }

    html body .geBigStandardButton:active {
        color: #600000;
        background-color: #f8c382
    }

    @media print {
        div.geNoPrint {
            display: none !important
        }
    }

    .geSprite-actualsize {
        background-position: 0 0
    }

    .geSprite-bold {
        background-position: 0 -46px
    }

    .geSprite-bottom {
        background-position: 0 -92px
    }

    .geSprite-center {
        background-position: 0 -138px
    }

    .geSprite-delete {
        background-position: 0 -184px
    }

    .geSprite-fillcolor {
        background-position: 0 -229px
    }

    .geSprite-fit {
        background-position: 0 -277px
    }

    .geSprite-fontcolor {
        background-position: 0 -322px
    }

    .geSprite-gradientcolor {
        background-position: 0 -368px
    }

    .geSprite-image {
        background-position: 0 -414px
    }

    .geSprite-italic {
        background-position: 0 -460px
    }

    .geSprite-left {
        background-position: 0 -505px
    }

    .geSprite-middle {
        background-position: 0 -552px
    }

    .geSprite-print {
        background-position: 0 -598px
    }

    .geSprite-redo {
        background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACgAAAAoCAYAAACM/rhtAAAACXBIWXMAABYlAAAWJQFJUiTwAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAEESURBVHgB7ZTRDYIwFEWvif8yQkdwAzsCG8AIboBOoBvoCk6ATqAb6AZsIL6GGgsCtqVKYt5JzkdT+nrz2gIwDMMwDDMmE/gTkVK70GNhzF/IG3kkT3r8EwS5JQuydPBMJhb151pnVIc2jqHavKLqele4ome+k7kuXAY06whXugZM8H6caqyOOUb93kV6o5TMLULmxhpzDwlLYtgfTxuC3OPz3Ww2QNoWNxeqjkXwQ8DtikibombBJYYjUHUrSMDM+HiFcKgTsOmk7CsijCI7hCfGwIApXg9CICzN1+oV8Nm9BOOEqwWcthRakzPygLDhcvj/Bb6KS+fuWgmGYRiGYZi/4AF6HLxjfGAzmAAAAABJRU5ErkJggg==) 0 0/cover
    }

    .geSprite-right {
        background-position: 0 -689px
    }

    .geSprite-shadow {
        background-position: 0 -735px
    }

    .geSprite-strokecolor {
        background-position: 0 -782px
    }

    .geSprite-top {
        background-position: 0 -828px
    }

    .geSprite-underline {
        background-position: 0 -874px
    }

    .geSprite-undo {
        background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACgAAAAoCAYAAACM/rhtAAAACXBIWXMAABYlAAAWJQFJUiTwAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAADqSURBVHgB7ZSNDcIgEIXPDToCI3QENtEN7AZ1I92AOIEj6Aa6AR7hSDDB9io0Tcz7kpc0BI6Pn0IEAAAAgC3ZUR0dZ8/pJUbaAi/OQ3LhXOW7mlHRx3Icxy/MWcZW4SckzY9iJVFDFYIlySPn2UAuJdQaqEIwlxwVEzrOieIRmqxeJ21hgbfCOM2V+iqYJp4Ts6THFmouklz9iISBPq+MupZG7k7xWamll1ppwUYzSLNzLeRyybSTTjNA80S0Zsjq27nOmiMeqT2OlLuo/UlaS9qsdjfV0dN2kgeK72UzwbWOGwAAAADgT3gDsQHIelW/AxMAAAAASUVORK5CYII=) 0 0/cover
    }

    .geSprite-zoomin {
        background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACgAAAAoCAYAAACM/rhtAAAACXBIWXMAABYlAAAWJQFJUiTwAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAG5SURBVHgB7ZeLbcIwEIZ/UAdghBuBDUgnaDeATgAb4E4CnQAxQdIJqk4AG9AJmvqELS4PjJ0XqcgnneQn+XVnnw9gYGDgMZloW2uLtR20pcZOZmypjXAHyAhIPW2DDoWyV07wFye9ukLLrEs+zJ5cIOuhqRnblaxfoyWWuQ/xmYs89hGy55OtcU8SsmH9wvmC+DIxe2S4CQ2yRdZzZeKUWKNQLlJ6MkYAY8ccaZuL/rO2H4TDe95EP0JAFFwCX0V7r+2I6iTGLN5n0SXwRbR3qM+HaM/gyZNjbira36KtcutmuXZ+3vYTMUbwZOSYS6+sSxHGyOM3rzJGz3GF+IhLKAiXS/KeW8dhjUw70faJcuSRqZINCnC+srlr4Vin4M6DlgUq5EJXiKUn5qiPzAp7NAAnU/mORlfWKdz2IOV+i+CJy4N8ThLR3yDsHbbwHhnSLeol/QyEnhcLzArFcos89kUolltBhUIICsUClJ8/vjwyfRDOtzWG+29AK7Anq5b8u65EErI14i2LcTkOqiuRVujSCJBePZgxhdvFrRXp9SZ3icI/Fdk7FM7ifuF+6++KQo/FDQwMNMEf2szNtggBywwAAAAASUVORK5CYII=) 0 0/cover
    }

    .geSprite-zoomout {
        background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACgAAAAoCAYAAACM/rhtAAAACXBIWXMAABYlAAAWJQFJUiTwAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAGGSURBVHgB7ZeBUcMwDEV/ewzQETRCNyAbMALZIN0gZpLCBIEJAhNwTFA2KBMQ4otzlZvUKI4TwtXvTlfXjp1fyZJdIBKJXCeb2vLaytoOtVXGjqYvq43wB5ARUAltjxmFaq8cIRfHvbrDxOQ9L9aeTGF7aGv6ip7nc0xEdvYivecSwTyCvT+1BfckwQ7rO5oEkbIxc3i4CQF5hO25IeJaNrA9WSIQBDs8BH+Ss7V8fmiHHVvwGeMp2XpKOmntGLtj7QLjeWLtWwi5cYxtWfuDtRWGocznK+sjCFk5xqoLz1UYxkqw5kXWWDiuEH/iFAoy3zUP8INvmS8EgGddivGk8KiFrhC/sfY9xsOrwgsCoIspL64J/CGEK/oWPMyhjro9AkJY+GVBw4+81pMkmJege90SJ8dQFLoXUH386eTh5YPQZGsJ99+ASdCe9L3yF3OJJNh3xN+sxGk7qLlEtkIzI4B79WD6FPqTSfWIFJ3Jc6LwT0UuDoVG3DfCnPWToLBgcZFIJAQ/ZcbKBYprvmYAAAAASUVORK5CYII=) 0 0/cover
    }

    .geSprite-arrow {
        background-position: 0 -1059px
    }

    .geSprite-linkedge {
        background-position: 0 -1105px
    }

    .geSprite-straight {
        background-position: 0 -1150px
    }

    .geSprite-entity {
        background-position: 0 -1196px
    }

    .geSprite-orthogonal {
        background-position: 0 -1242px
    }

    .geSprite-curved {
        background-position: 0 -1288px
    }

    .geSprite-noarrow {
        background-position: 0 -1334px
    }

    .geSprite-endclassic {
        background-position: 0 -1380px
    }

    .geSprite-endopen {
        background-position: 0 -1426px
    }

    .geSprite-endblock {
        background-position: 0 -1472px
    }

    .geSprite-endoval {
        background-position: 0 -1518px
    }

    .geSprite-enddiamond {
        background-position: 0 -1564px
    }

    .geSprite-endthindiamond {
        background-position: 0 -1610px
    }

    .geSprite-endclassictrans {
        background-position: 0 -1656px
    }

    .geSprite-endblocktrans {
        background-position: 0 -1702px
    }

    .geSprite-endovaltrans {
        background-position: 0 -1748px
    }

    .geSprite-enddiamondtrans {
        background-position: 0 -1794px
    }

    .geSprite-endthindiamondtrans {
        background-position: 0 -1840px
    }

    .geSprite-startclassic {
        background-position: 0 -1886px
    }

    .geSprite-startopen {
        background-position: 0 -1932px
    }

    .geSprite-startblock {
        background-position: 0 -1978px
    }

    .geSprite-startoval {
        background-position: 0 -2024px
    }

    .geSprite-startdiamond {
        background-position: 0 -2070px
    }

    .geSprite-startthindiamond {
        background-position: 0 -2116px
    }

    .geSprite-startclassictrans {
        background-position: 0 -2162px
    }

    .geSprite-startblocktrans {
        background-position: 0 -2208px
    }

    .geSprite-startovaltrans {
        background-position: 0 -2254px
    }

    .geSprite-startdiamondtrans {
        background-position: 0 -2300px
    }

    .geSprite-startthindiamondtrans {
        background-position: 0 -2346px
    }

    .geSprite-globe {
        background-position: 0 -2392px
    }

    .geSprite-orderedlist {
        background-position: 0 -2438px
    }

    .geSprite-unorderedlist {
        background-position: 0 -2484px
    }

    .geSprite-horizontalrule {
        background-position: 0 -2530px
    }

    .geSprite-link {
        background-position: 0 -2576px
    }

    .geSprite-indent {
        background-position: 0 -2622px
    }

    .geSprite-outdent {
        background-position: 0 -2668px
    }

    .geSprite-code {
        background-position: 0 -2714px
    }

    .geSprite-fontbackground {
        background-position: 0 -2760px
    }

    .geSprite-removeformat {
        background-position: 0 -2806px
    }

    .geSprite-superscript {
        background-position: 0 -2852px
    }

    .geSprite-subscript {
        background-position: 0 -2898px
    }

    .geSprite-table {
        background-position: 0 -2944px
    }

    .geSprite-deletecolumn {
        background-position: 0 -2990px
    }

    .geSprite-deleterow {
        background-position: 0 -3036px
    }

    .geSprite-insertcolumnafter {
        background-position: 0 -3082px
    }

    .geSprite-insertcolumnbefore {
        background-position: 0 -3128px
    }

    .geSprite-insertrowafter {
        background-position: 0 -3174px
    }

    .geSprite-insertrowbefore {
        background-position: 0 -3220px
    }

    .geSprite-grid {
        background-position: 0 -3272px
    }

    .geSprite-guides {
        background-position: 0 -3324px
    }

    .geSprite-dots {
        background-position: 0 -3370px
    }

    .geSprite-alignleft {
        background-position: 0 -3416px
    }

    .geSprite-alignright {
        background-position: 0 -3462px
    }

    .geSprite-aligncenter {
        background-position: 0 -3508px
    }

    .geSprite-aligntop {
        background-position: 0 -3554px
    }

    .geSprite-alignbottom {
        background-position: 0 -3600px
    }

    .geSprite-alignmiddle {
        background-position: 0 -3646px
    }

    .geSprite-justifyfull {
        background-position: 0 -3692px
    }

    .geSprite-formatpanel {
        background-position: 0 -3738px
    }

    .geSprite-connection {
        background-position: 0 -3784px
    }

    .geSprite-vertical {
        background-position: 0 -3830px
    }

    .geSprite-simplearrow {
        background-position: 0 -3876px
    }

    .geSprite-plus {
        background-position: 0 -3922px
    }

    .geSprite-rounded {
        background-position: 0 -3968px
    }

    .geSprite-toback {
        background-position: 0 -4014px
    }

    .geSprite-tofront {
        background-position: 0 -4060px
    }

    .geSprite-duplicate {
        background-position: 0 -4106px
    }

    .geSprite-insert {
        background-position: 0 -4152px
    }

    .geSprite-endblockthin {
        background-position: 0 -4201px
    }

    .geSprite-endblockthintrans {
        background-position: 0 -4247px
    }

    .geSprite-enderone {
        background-position: 0 -4293px
    }

    .geSprite-enderonetoone {
        background-position: 0 -4339px
    }

    .geSprite-enderonetomany {
        background-position: 0 -4385px
    }

    .geSprite-endermany {
        background-position: 0 -4431px
    }

    .geSprite-enderoneopt {
        background-position: 0 -4477px
    }

    .geSprite-endermanyopt {
        background-position: 0 -4523px
    }

    .geSprite-endclassicthin {
        background-position: 0 -4938px
    }

    .geSprite-endclassicthintrans {
        background-position: 0 -4984px
    }

    .geSprite-enddash {
        background-position: 0 -5029px
    }

    .geSprite-endcircleplus {
        background-position: 0 -5075px
    }

    .geSprite-endcircle {
        background-position: 0 -5121px
    }

    .geSprite-endasync {
        background-position: 0 -5167px
    }

    .geSprite-endasynctrans {
        background-position: 0 -5213px
    }

    .geSprite-startblockthin {
        background-position: 0 -4569px
    }

    .geSprite-startblockthintrans {
        background-position: 0 -4615px
    }

    .geSprite-starterone {
        background-position: 0 -4661px
    }

    .geSprite-starteronetoone {
        background-position: 0 -4707px
    }

    .geSprite-starteronetomany {
        background-position: 0 -4753px
    }

    .geSprite-startermany {
        background-position: 0 -4799px
    }

    .geSprite-starteroneopt {
        background-position: 0 -4845px
    }

    .geSprite-startermanyopt {
        background-position: 0 -4891px
    }

    .geSprite-startclassicthin {
        background-position: 0 -5259px
    }

    .geSprite-startclassicthintrans {
        background-position: 0 -5305px
    }

    .geSprite-startdash {
        background-position: 0 -5351px
    }

    .geSprite-startcircleplus {
        background-position: 0 -5397px
    }

    .geSprite-startcircle {
        background-position: 0 -5443px
    }

    .geSprite-startasync {
        background-position: 0 -5489px
    }

    .geSprite-startasynctrans {
        background-position: 0 -5535px
    }

    .geSprite-startcross {
        background-position: 0 -5581px
    }

    .geSprite-startopenthin {
        background-position: 0 -5627px
    }

    .geSprite-startopenasync {
        background-position: 0 -5673px
    }

    .geSprite-endcross {
        background-position: 0 -5719px
    }

    .geSprite-endopenthin {
        background-position: 0 -5765px
    }

    .geSprite-endopenasync {
        background-position: 0 -5811px
    }

    .geSprite-verticalelbow {
        background-position: 0 -5857px
    }

    .geSprite-horizontalelbow {
        background-position: 0 -5903px
    }

    .geSprite-horizontalisometric {
        background-position: 0 -5949px
    }

    .geSprite-verticalisometric {
        background-position: 0 -5995px
    }

    .geSvgSprite {
        background-position: 50%
    }

    .geFlipSprite {
        transform: scaleX(-1)
    }

    .geSprite-box {
        background-image: url("data:image/svg+xml;utf8,<svg xmlns=%27http://www.w3.org/2000/svg%27 width=%2720%27 height=%2710%27 transform=%27translate%280.5,0.5%29%27><rect stroke=%27black%27 fill=%27none%27 x=%272%27 y=%272%27 width=%276%27 height=%276%27/><path stroke=%27black%27 d=%27M8 5 L 18 5%27/></svg>")
    }

    .geSprite-halfCircle {
        background-image: url("data:image/svg+xml;utf8,<svg xmlns=%27http://www.w3.org/2000/svg%27 width=%2720%27 height=%2710%27 transform=%27translate%280.5,0.5%29%27><path stroke=%27black%27 fill=%27none%27 d=%27M 2 2 Q 6 2 6 5 Q 6 8 2 8 M 6 5 L 18 5%27/></svg>")
    }

    html div.mxRubberband {
        background: #9cf;
        border-color: #00d
    }

    td.mxPopupMenuIcon div {
        width: 16px;
        height: 16px
    }

    .geEditor div.mxPopupMenu {
        background: #fff;
        border: none;
        border-radius: 4px;
        padding: 3px;
        box-shadow: 0 2px 6px 2px rgba(60, 64, 67, .15)
    }

    html table.mxPopupMenu {
        border-collapse: collapse;
        margin: 0
    }

    html td.mxPopupMenuItem {
        padding: 7px 30px;
        font-size: 10pt
    }

    html td.mxPopupMenuIcon {
        background-color: #fff;
        padding: 0
    }

    td.mxPopupMenuIcon .geIcon {
        opacity: .5;
        border: 1px solid transparent;
        margin: 2px;
        padding: 2px 2px 4px
    }

    td.mxPopupMenuIcon .geIcon:hover {
        opacity: 1;
        border: 1px solid gray;
        border-radius: 2px
    }

    html tr.mxPopupMenuItemHover {
        color: #000;
        background-color: #eee
    }

    table.mxPopupMenu hr {
        color: #ccc;
        background-color: #ccc;
        border: none;
        height: 1px
    }

    table.mxPopupMenu tr {
        font-size: 4pt
    }

    html td.mxWindowTitle {
        color: #707070;
        text-align: left;
        padding: 4px;
        font-size: 12px
    }

    .gePropHeader,
    .gePropRow {
        border: 1px solid #e9e9e9
    }

    .gePropRowDark {
        border: 1px solid #4472c4
    }

    .gePropHeader>.gePropHeaderCell {
        text-align: left;
        border-top: 0;
        border-bottom: 0;
        width: 50%
    }

    .gePropHeader>.gePropHeaderCell:first-child {
        border-left: none
    }

    .gePropHeader>.gePropHeaderCell:last-child {
        border-right: none
    }

    .gePropHeader {
        color: #000;
        background: #e5e5e5
    }

    .gePropRowCell {
        border-left: 1px solid #f3f3f3;
        width: 50%
    }

    .gePropRow>.gePropRowCell {
        background: #fff
    }

    .gePropRowAlt>.gePropRowCell {
        background: #fcfcfc
    }

    .gePropRowDark>.gePropRowCell {
        color: #305496;
        background: #fff;
        font-weight: 700
    }

    .gePropRowDarkAlt>.gePropRowCell {
        color: #305496;
        background: #d9e1f2;
        font-weight: 700
    }

    .gePropEditor input:invalid {
        border: 1px solid red
    }

    .geTemplateDlg {
        width: 987px;
        height: 712px
    }

    .geTemplateDlg ::-webkit-scrollbar {
        width: 12px;
        height: 12px
    }

    .geTemplateDlg ::-webkit-scrollbar-track {
        background: #f5f5f5;
        -webkit-box-shadow: inset 0 0 4px rgba(0, 0, 0, .1)
    }

    .geTemplateDlg ::-webkit-scrollbar-thumb {
        background: #c5c5c5;
        border: 3px solid #f5f5f5;
        border-radius: 10px
    }

    .geTemplateDlg ::-webkit-scrollbar-thumb:hover {
        background: #b5b5b5
    }

    .geTempDlgHeader {
        box-sizing: border-box;
        background-color: #f5f5f5;
        border: 1px solid #ccc;
        border-radius: 5px 5px 0 0;
        width: 100%;
        height: 62px
    }

    .geTempDlgHeaderLogo {
        height: 34px;
        margin: 14px 14px 14px 20px
    }

    .geTempDlgSearchBox {
        color: #888;
        float: right;
        text-shadow: 1px 1px #fff;
        background-color: #fff;
        background-position: 15px;
        border: 1px solid #ccc;
        border-radius: 3px;
        outline: none;
        width: 40%;
        max-width: 400px;
        height: 40px;
        margin: 11px 36px 0 0;
        padding: 0 0 0 36px;
        font-size: 15px;
        line-height: 36px
    }

    .geTemplatesList {
        float: left;
        width: 20%
    }

    .geTempDlgContent,
    .geTemplatesList {
        box-sizing: border-box;
        background-color: #fff;
        border: 1px solid #ccc;
        height: calc(100% - 118px);
        display: inline-block;
        overflow-x: hidden;
        overflow-y: auto
    }

    .geTempDlgContent {
        float: right;
        width: 80%;
        position: relative
    }

    .geTempDlgFooter {
        box-sizing: border-box;
        text-align: right;
        background-color: #f5f5f5;
        border: 1px solid #ccc;
        border-radius: 0 0 5px 5px;
        width: 100%;
        height: 52px;
        padding-top: 11px;
        font-size: 14px;
        line-height: 17px
    }

    .geTempDlgCreateBtn {
        color: #fff;
        background-color: #3d72ad;
        border-radius: 3px
    }

    .geTempDlgCancelBtn,
    .geTempDlgCreateBtn {
        cursor: pointer;
        text-align: center;
        width: 67px;
        padding: 6px;
        display: inline-block
    }

    .geTempDlgCancelBtn {
        color: #3d72ad
    }

    .geTempDlgCancelBtn:active,
    .geTempDlgCreateBtn:active,
    .geTempDlgShowAllBtn:active {
        transform: translateY(2px)
    }

    .geTempDlgCreateBtnDisabled {
        background-color: #9fbddd
    }

    .geTempDlgCreateBtnDisabled:active {
        transform: translateY(0)
    }

    .geTempDlgCreateBtnBusy {
        background-position: 62px 7px;
        background-repeat: no-repeat
    }

    .geTempDlgNewDiagramlbl {
        color: #333;
        cursor: pointer;
        height: 17px;
        padding: 25px 0 0 20px;
        font-size: 14px;
        font-weight: 700;
        line-height: 17px
    }

    .geTempDlgHLine {
        background-color: #ccc;
        width: calc(100% - 22px);
        height: 1px;
        margin: 20px 0 0 11px
    }

    .geTemplatesLbl {
        color: #6d6d6d;
        text-transform: uppercase;
        margin: 20px 0 3px 20px;
        font-weight: 700
    }

    .geTemplateCatLink,
    .geTemplatesLbl {
        height: 17px;
        font-size: 14px;
        line-height: 17px
    }

    .geTemplateCatLink {
        color: #3d72ad;
        cursor: pointer;
        margin: 12px 0 0 20px
    }

    .geTempDlgNewDiagramCat {
        background-color: #555;
        width: 100%;
        height: 280px
    }

    .geTempDlgNewDiagramCatLbl {
        color: #fff;
        text-transform: uppercase;
        height: 17px;
        padding: 25px 0 0 20px;
        font-size: 14px;
        font-weight: 700;
        line-height: 17px
    }

    .geTempDlgNewDiagramCatList {
        box-sizing: border-box;
        width: 100%;
        height: 190px;
        padding-left: 9px;
        overflow-x: hidden;
        overflow-y: auto
    }

    .geTempDlgNewDiagramCatFooter {
        width: 100%
    }

    .geTempDlgShowAllBtn {
        color: #ddd;
        cursor: pointer;
        float: right;
        text-align: center;
        border: 1px solid #777;
        border-radius: 3px;
        width: 78px;
        margin-right: 30px;
        padding: 4px;
        font-size: 14px;
        line-height: 17px
    }

    .geTempDlgNewDiagramCatItem {
        width: 134px;
        height: 155px;
        padding: 18px 6px 0 9px;
        display: inline-block
    }

    .geTempDlgNewDiagramCatItemImg {
        box-sizing: border-box;
        cursor: pointer;
        text-align: center;
        vertical-align: middle;
        background-color: #fff;
        border: 1px solid #ccc;
        border-radius: 3px;
        width: 134px;
        height: 134px;
        display: table-cell
    }

    .geTempDlgNewDiagramCatItemActive>.geTempDlgNewDiagramCatItemImg {
        border: 4px solid #3d72ad
    }

    .geTempDlgNewDiagramCatItemLbl {
        color: #fff;
        cursor: pointer;
        text-align: center;
        width: 100%;
        height: 17px;
        padding-top: 4px;
        font-size: 14px;
        line-height: 17px
    }

    .geTempDlgDiagramsList {
        background-color: #e5e5e5;
        min-height: calc(100% - 280px);
        padding-left: 9px
    }

    .geTempDlgDiagramsList,
    .geTempDlgDiagramsListHeader {
        box-sizing: border-box;
        width: 100%
    }

    .geTempDlgDiagramsListHeader {
        height: 45px;
        padding: 18px 20px 0 11px
    }

    .geTempDlgDiagramsListTitle {
        box-sizing: border-box;
        color: #666;
        text-transform: uppercase;
        height: 17px;
        padding-top: 5px;
        font-size: 14px;
        font-weight: 700;
        line-height: 17px;
        display: inline-block
    }

    .geTempDlgDiagramsListBtns {
        float: right;
        margin-top: -9px
    }

    .geTempDlgRadioBtn {
        box-sizing: border-box;
        color: #fff;
        cursor: pointer;
        text-align: center;
        background-color: #555;
        border: 1px solid #ccc;
        border-radius: 3px;
        padding: 4px;
        font-size: 14px;
        line-height: 17px;
        display: inline-block
    }

    .geTempDlgRadioBtnActive {
        color: #333;
        background-color: #fff
    }

    .geTempDlgRadioBtnLarge {
        width: 120px;
        height: 27px
    }

    .geTempDlgRadioBtnSmall {
        width: 27px;
        height: 27px;
        position: relative;
        top: 9px
    }

    .geTempDlgRadioBtnSmall img {
        width: 13px;
        height: 13px;
        position: absolute;
        top: 6px;
        left: 6px
    }

    .geTempDlgSpacer {
        width: 10px;
        display: inline-block
    }

    .geTempDlgDiagramsListGrid {
        border-spacing: 0;
        box-sizing: border-box;
        white-space: nowrap;
        width: 100%;
        padding: 0 20px 20px 10px;
        font-size: 13px
    }

    .geTempDlgDiagramsListGrid tr {
        height: 40px
    }

    .geTempDlgDiagramsListGrid th {
        color: #8e8e8e;
        text-align: left;
        background-color: #e5e5e5;
        border-bottom: 1px solid #ccc;
        padding: 5px;
        font-size: 14px;
        font-weight: 700
    }

    .geTempDlgDiagramsListGrid td {
        color: #888;
        background-color: #fff;
        border-bottom: 1px solid #ccc;
        padding: 5px;
        overflow: hidden
    }

    .geTempDlgDiagramsListGridActive td {
        border-top: 2px solid #3d72ad;
        border-bottom: 2px solid #3d72ad
    }

    .geTempDlgDiagramsListGridActive td:first-child {
        border-left: 2px solid #3d72ad
    }

    .geTempDlgDiagramsListGridActive td:last-child {
        border-right: 2px solid #3d72ad
    }

    .geTempDlgDiagramTitle {
        font-weight: 700;
        color: #666 !important
    }

    .geTempDlgDiagramsTiles {
        min-height: 100px;
        position: relative
    }

    .geTempDlgDiagramTile {
        width: 130px;
        height: 152px;
        padding: 20px 7px 0 10px;
        display: inline-block;
        position: relative
    }

    .geTempDlgDiagramTileImg {
        box-sizing: border-box;
        text-align: center;
        vertical-align: middle;
        background-color: #fff;
        border: 1px solid #ccc;
        border-radius: 3px;
        width: 130px;
        height: 130px;
        display: table-cell
    }

    .geTempDlgDiagramTileImgError,
    .geTempDlgDiagramTileImgLoading {
        background-position: 50%;
        background-repeat: no-repeat
    }

    .geTempDlgDiagramTileImgError {
        background-color: #be3730
    }

    .geTempDlgDiagramTileImg img {
        cursor: pointer;
        max-width: 117px;
        max-height: 117px
    }

    .geTempDlgDiagramTileActive>.geTempDlgDiagramTileImg {
        border: 4px solid #3d72ad
    }

    .geTempDlgDiagramTileLbl {
        color: #333;
        cursor: pointer;
        text-align: center;
        width: 100%;
        height: 17px;
        padding-top: 5px;
        font-size: 14px;
        line-height: 17px
    }

    .geTempDlgDiagramPreviewBtn {
        cursor: pointer;
        position: absolute;
        top: 28px;
        right: 15px
    }

    .geTempDlgDiagramListPreviewBtn {
        cursor: pointer;
        padding-left: 5px;
        padding-right: 15px
    }

    .geTempDlgDiagramPreviewBox {
        box-sizing: border-box;
        text-align: center;
        vertical-align: middle;
        z-index: 2;
        background: #fff;
        border: 4px solid #3d72ad;
        border-radius: 6px;
        width: 80%;
        height: 94%;
        display: table-cell;
        position: absolute;
        top: 3%;
        left: 10%
    }

    .geTempDlgDialogMask {
        z-index: 1;
        width: 100%;
        height: 100%;
        position: absolute;
        top: 0;
        left: 0
    }

    .geTempDlgDiagramPreviewBox img {
        vertical-align: middle;
        max-width: 95%;
        max-height: 95%
    }

    .geTempDlgPreviewCloseBtn {
        cursor: pointer;
        position: absolute;
        top: 5px;
        right: 5px
    }

    .geTempDlgLinkToDiagramHint {
        color: #555
    }

    .geTempDlgLinkToDiagramBtn {
        color: #555;
        height: 27px;
        margin: 0 10px;
        font-size: 14px
    }

    .geCommentsWin {
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        border: 1px solid #f5f5f5;
        height: 100%;
        margin-bottom: 10px;
        overflow: auto
    }

    .geCommentsToolbar {
        white-space: nowrap;
        border: 0 solid #c3c3c3;
        border-top-width: 1px;
        display: block;
        position: absolute;
        bottom: 0;
        left: 0;
        right: 0;
        overflow: hidden
    }

    .geCommentsList {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        overflow: auto
    }

    .geCommentContainer {
        color: #3c4043;
        white-space: nowrap;
        background-color: #fff;
        border: 0 solid #c3c3c3;
        border-bottom-width: 1px;
        border-radius: 10px;
        min-height: 50px;
        margin: 5px;
        padding: 12px;
        display: block;
        position: relative;
        box-shadow: 2px 2px 6px rgba(60, 64, 67, .15)
    }

    .geCommentHeader {
        width: 100%;
        height: 32px
    }

    .geCommentUserImg {
        float: left;
        background-color: #f5f5f5;
        border-radius: 50%;
        width: 32px;
        height: 32px
    }

    .geCommentHeaderTxt {
        height: 32px;
        padding-left: 5px;
        overflow: hidden
    }

    .geCommentUsername {
        height: 18px;
        font-size: 15px;
        font-weight: 700
    }

    .geCommentDate,
    .geCommentUsername {
        text-overflow: ellipsis;
        overflow: hidden
    }

    .geCommentDate {
        color: #707070;
        height: 14px;
        font-size: 11px
    }

    .geCommentDate:first-letter {
        text-transform: uppercase
    }

    .geCommentTxt {
        white-space: normal;
        min-height: 12px;
        padding-top: 5px;
        font-size: 14px
    }

    .geCommentEditTxtArea {
        min-width: 100%;
        max-width: 100%;
        min-height: 12px;
        margin-top: 5px;
        font-size: 14px !important
    }

    .geCommentEditBtns,
    .geCommentEditTxtArea {
        box-sizing: border-box;
        width: 100%
    }

    .geCommentEditBtns {
        height: 20px;
        padding-top: 5px
    }

    .geCommentEditBtn {
        margin-left: 5px;
        float: right !important;
        padding: 3px 8px !important
    }

    .geCommentActions {
        color: #707070;
        font-size: 12px
    }

    .geCommentActionsList {
        margin: 0;
        padding: 10px 0 0;
        list-style-type: disc
    }

    .geCommentAction {
        padding: 0;
        display: inline-block
    }

    .geCommentAction:before {
        content: "•";
        padding: 5px
    }

    .geCommentAction:first-child:before {
        content: "";
        padding: 0
    }

    .geCommentActionLnk {
        color: #707070;
        cursor: pointer;
        text-decoration: none
    }

    .geCommentActionLnk:hover {
        text-decoration: underline
    }

    .geCheckedBtn {
        background-color: #ccc;
        border-top: 1px solid #000 !important;
        border-left: 1px solid #000 !important
    }

    .geCommentBusyImg {
        position: absolute;
        top: 5px;
        right: 5px
    }

    .geAspectDlgListItem {
        border: 3px solid #f0f0f0;
        border-radius: 5px;
        width: 120px;
        height: 120px;
        margin: 2px 2px 20px;
        padding: 5px;
        display: inline-block
    }

    .geAspectDlgListItem:hover {
        border: 3px solid #c5c5c5
    }

    .geAspectDlgListItemSelected {
        border: 3px solid #3b73af
    }

    .geAspectDlgListItemSelected:hover {
        border: 3px solid #405a86
    }

    .geAspectDlgListItemText {
        text-align: center;
        text-overflow: ellipsis;
        max-width: 100%;
        min-height: 2em;
        margin-top: 10px;
        overflow: hidden
    }

    .geAspectDlgList {
        white-space: nowrap;
        min-height: 184px;
        overflow-x: auto;
        overflow-y: hidden
    }

    div.mxRubberband {
        background: #07f;
        border: 1px solid #00f;
        position: absolute;
        overflow: hidden
    }

    .mxCellEditor {
        word-wrap: normal;
        resize: none;
        background: url(data:image/gif;base64,R0lGODlhMAAwAIAAAP///wAAACH5BAEAAAAALAAAAAAwADAAAAIxhI+py+0Po5y02ouz3rz7D4biSJbmiabqyrbuC8fyTNf2jef6zvf+DwwKh8Si8egpAAA7);
        border: 0 solid transparent;
        min-width: 1px;
        display: inline-block;
        position: absolute;
        overflow: visible
    }

    .mxCellEditor,
    .mxPlainTextEditor * {
        margin: 0;
        padding: 0
    }

    div.mxWindow {
        z-index: 1;
        background: url(data:image/gif;base64,R0lGODlhGgAUAIAAAOzs7PDw8CH5BAAAAAAALAAAAAAaABQAAAIijI+py70Ao5y02lud3lzhD4ZUR5aPiKajyZbqq7YyB9dhAQA7);
        border: 1px solid #c3c3c3;
        position: absolute;
        overflow: hidden;
        box-shadow: 3px 3px 12px silver
    }

    table.mxWindow {
        border-collapse: collapse;
        table-layout: fixed;
        font-size: 8pt
    }

    td.mxWindowTitle {
        color: #000;
        text-align: center;
        text-overflow: ellipsis;
        white-space: nowrap;
        background: url(data:image/gif;base64,R0lGODlhFwAXAMQAANfX18rKyuHh4c7OzsDAwMHBwc/Pz+Li4uTk5NHR0dvb2+jo6O/v79/f3/n5+dnZ2dbW1uPj44yMjNPT0+Dg4N3d3ebm5szMzAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAAAAAAALAAAAAAXABcAAAWQICESxWiW5Ck6bOu+MMvMdG3f86LvfO/rlqBwSCwaj8ikUohoOp/QaDNCrVqvWKpgezhsv+AwmEIum89ocmPNbrvf64p8Tq/b5Yq8fs/v5x+AgYKDhIAAh4iJiouHEI6PkJGSjhOVlpeYmZUJnJ2en6CcBqMDpaanqKgXq6ytrq+rAbKztLW2shK5uru8vbkhADs=) repeat-x;
        height: 13px;
        padding: 4px 2px 6px;
        font-weight: 700;
        overflow: hidden
    }

    td.mxWindowPane {
        vertical-align: top;
        padding: 0
    }

    div.mxWindowPane {
        position: relative;
        overflow: hidden
    }

    td.mxWindowPane td {
        font-size: 8pt
    }

    td.mxWindowPane input,
    td.mxWindowPane radio,
    td.mxWindowPane select,
    td.mxWindowPane textarea {
        border: 1px solid #8c8c8c;
        padding: 1px;
        font-size: 8pt
    }

    td.mxWindowPane button {
        float: left;
        background: url(data:image/gif;base64,R0lGODlhCgATALMAAP7+/t7e3vj4+Ojo6OXl5e/v7/n5+fb29vPz8/39/e3t7fHx8e7u7v///wAAAAAAACH5BAAAAAAALAAAAAAKABMAAAQ2MMlJhb0Y6c2X/2AhjiRjnqiirizqMkEsz0Rt30Ou7y8K/ouDcEg0GI9IgHLJbDif0Kh06owAADs=) repeat-x;
        padding: 2px;
        font-size: 8pt
    }

    img.mxToolbarItem {
        border-width: 1px;
        margin-bottom: 6px;
        margin-right: 6px
    }

    select.mxToolbarCombo {
        vertical-align: top;
        border-style: inset;
        border-width: 2px
    }

    div.mxToolbarComboContainer {
        padding: 2px
    }

    img.mxToolbarMode {
        border-width: 0;
        margin: 2px 4px 4px 2px
    }

    img.mxToolbarModeSelected {
        border-style: inset;
        border-width: 2px;
        margin: 0 2px 2px 0
    }

    div.mxTooltip {
        color: #000;
        cursor: default;
        background: #ffc;
        padding: 4px;
        font-size: 8pt
    }

    div.mxPopupMenu,
    div.mxTooltip {
        border: 1px solid #000;
        position: absolute;
        box-shadow: 3px 3px 12px silver
    }

    div.mxPopupMenu {
        background: url(data:image/gif;base64,R0lGODlhGgAUAIAAAOzs7PDw8CH5BAAAAAAALAAAAAAaABQAAAIijI+py70Ao5y02lud3lzhD4ZUR5aPiKajyZbqq7YyB9dhAQA7)
    }

    table.mxPopupMenu {
        border-collapse: collapse;
        margin-top: 1px;
        margin-bottom: 1px
    }

    tr.mxPopupMenuItem {
        color: #000;
        cursor: pointer
    }

    tr.mxPopupMenuItemHover {
        color: #fff;
        cursor: pointer;
        background-color: #006
    }

    td.mxPopupMenuItem {
        white-space: nowrap;
        padding: 2px 30px 2px 10px;
        font-size: 8pt
    }

    td.mxPopupMenuIcon {
        background-color: #d0d0d0;
        padding: 2px 4px
    }

    .mxDisabled {
        cursor: default !important;
        opacity: .2 !important
    }

    #graphContainer .geFormatContainer .geFormatSection {
        position: relative
    }

    #graphContainer .geFormatContainer .geFormatSection button.setFormatBtn {
        box-sizing: border-box;
        cursor: default;
        background-color: #efefef;
        border: 1px solid #767676;
        border-radius: 3px
    }

    #graphContainer .geFormatContainer .geFormatSection button.setFormatBtn:hover {
        background-color: #e1e1e1
    }

    #graphContainer .geFormatContainer .geFormatSection button.setFormatBtn:active {
        background-color: #f5f5f5
    }

    #graphContainer .geFormatContainer input {
        padding: 1px 2px
    }

    #graphContainer table.mxPopupMenu td td {
        padding: 8px
    }

    #graphContainer *,
    .diagram-block_svg *,
    .docx-diagram-displayer_svg * {
        box-sizing: content-box
    }

    #graphContainer .mxCellEditor td,
    #graphContainer g td,
    .diagram-block_svg .mxCellEditor td,
    .diagram-block_svg g td,
    .docx-diagram-displayer_svg .mxCellEditor td,
    .docx-diagram-displayer_svg g td {
        padding: 2px
    }

    #graphContainer .mxCellEditor hr,
    #graphContainer g hr,
    .diagram-block_svg .mxCellEditor hr,
    .diagram-block_svg g hr,
    .docx-diagram-displayer_svg .mxCellEditor hr,
    .docx-diagram-displayer_svg g hr {
        -webkit-margin-before: .5em;
        -webkit-margin-after: .5em;
        -webkit-margin-start: auto;
        -webkit-margin-end: auto;
        unicode-bidi: isolate;
        border-style: inset;
        border-width: 1px 1px 0;
        margin-top: .5em;
        margin-bottom: .5em;
        margin-left: auto;
        margin-right: auto;
        display: block;
        overflow: hidden
    }

    #graphContainer .mxCellEditor h1,
    #graphContainer g h1,
    .diagram-block_svg .mxCellEditor h1,
    .diagram-block_svg g h1,
    .docx-diagram-displayer_svg .mxCellEditor h1,
    .docx-diagram-displayer_svg g h1 {
        -webkit-margin-before: .67em;
        -webkit-margin-after: .67em;
        -webkit-margin-start: 0;
        -webkit-margin-end: 0;
        margin-top: .67em;
        margin-bottom: .67em;
        margin-left: 0;
        margin-right: 0;
        font-size: 2em;
        font-weight: 700;
        display: block
    }

    #graphContainer .mxCellEditor h2,
    #graphContainer g h2,
    .diagram-block_svg .mxCellEditor h2,
    .diagram-block_svg g h2,
    .docx-diagram-displayer_svg .mxCellEditor h2,
    .docx-diagram-displayer_svg g h2 {
        -webkit-margin-before: .83em;
        -webkit-margin-after: .83em;
        -webkit-margin-start: 0;
        -webkit-margin-end: 0;
        margin-top: .83em;
        margin-bottom: .83em;
        margin-left: 0;
        margin-right: 0;
        font-size: 1.5em;
        font-weight: 700;
        display: block
    }

    #graphContainer .mxCellEditor h3,
    #graphContainer g h3,
    .diagram-block_svg .mxCellEditor h3,
    .diagram-block_svg g h3,
    .docx-diagram-displayer_svg .mxCellEditor h3,
    .docx-diagram-displayer_svg g h3 {
        -webkit-margin-before: 1em;
        -webkit-margin-after: 1em;
        -webkit-margin-start: 0;
        -webkit-margin-end: 0;
        margin-top: 1em;
        margin-bottom: 1em;
        margin-left: 0;
        margin-right: 0;
        font-size: 1.17em;
        font-weight: 700;
        display: block
    }

    #graphContainer .mxCellEditor h4,
    #graphContainer g h4,
    .diagram-block_svg .mxCellEditor h4,
    .diagram-block_svg g h4,
    .docx-diagram-displayer_svg .mxCellEditor h4,
    .docx-diagram-displayer_svg g h4 {
        -webkit-margin-before: 1.33em;
        -webkit-margin-after: 1.33em;
        -webkit-margin-start: 0;
        -webkit-margin-end: 0;
        margin-top: 1.33em;
        margin-bottom: 1.33em;
        margin-left: 0;
        margin-right: 0;
        font-weight: 700;
        display: block
    }

    #graphContainer .mxCellEditor h5,
    #graphContainer g h5,
    .diagram-block_svg .mxCellEditor h5,
    .diagram-block_svg g h5,
    .docx-diagram-displayer_svg .mxCellEditor h5,
    .docx-diagram-displayer_svg g h5 {
        -webkit-margin-before: 1.67em;
        -webkit-margin-after: 1.67em;
        -webkit-margin-start: 0;
        -webkit-margin-end: 0;
        margin-top: 1.67em;
        margin-bottom: 1.67em;
        margin-left: 0;
        margin-right: 0;
        font-size: .83em;
        font-weight: 700;
        display: block
    }

    #graphContainer .mxCellEditor h6,
    #graphContainer g h6,
    .diagram-block_svg .mxCellEditor h6,
    .diagram-block_svg g h6,
    .docx-diagram-displayer_svg .mxCellEditor h6,
    .docx-diagram-displayer_svg g h6 {
        -webkit-margin-before: 2.33em;
        -webkit-margin-after: 2.33em;
        -webkit-margin-start: 0;
        -webkit-margin-end: 0;
        margin-top: 2.33em;
        margin-bottom: 2.33em;
        margin-left: 0;
        margin-right: 0;
        font-size: .67em;
        font-weight: 700;
        display: block
    }

    #graphContainer .mxCellEditor p,
    #graphContainer g p,
    .diagram-block_svg .mxCellEditor p,
    .diagram-block_svg g p,
    .docx-diagram-displayer_svg .mxCellEditor p,
    .docx-diagram-displayer_svg g p {
        -webkit-margin-before: 1em;
        -webkit-margin-after: 1em;
        -webkit-margin-start: 0;
        -webkit-margin-end: 0;
        margin-top: 1em;
        margin-bottom: 1em;
        margin-left: 0;
        margin-right: 0;
        display: block;
        overflow: visible
    }

    #graphContainer .mxCellEditor ul,
    #graphContainer g ul,
    .diagram-block_svg .mxCellEditor ul,
    .diagram-block_svg g ul,
    .docx-diagram-displayer_svg .mxCellEditor ul,
    .docx-diagram-displayer_svg g ul {
        -webkit-margin-before: 1em;
        -webkit-margin-after: 1em;
        -webkit-margin-start: 0;
        -webkit-margin-end: 0;
        -webkit-padding-start: 40px;
        margin-top: 1em;
        margin-bottom: 1em;
        margin-left: 0;
        margin-right: 0;
        list-style-type: disc;
        display: block
    }

    #graphContainer .mxCellEditor ul:not(:-webkit-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
        padding-left: 40px
    }

    #graphContainer .mxCellEditor ul:not(:-moz-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
        padding-left: 40px
    }

    #graphContainer .mxCellEditor ul:not(:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
        padding-left: 40px
    }

    #graphContainer g ul:not(:-webkit-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
        padding-left: 40px
    }

    #graphContainer g ul:not(:-moz-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
        padding-left: 40px
    }

    #graphContainer g ul:not(:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
        padding-left: 40px
    }

    .diagram-block_svg .mxCellEditor ul:not(:-webkit-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
        padding-left: 40px
    }

    .diagram-block_svg .mxCellEditor ul:not(:-moz-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
        padding-left: 40px
    }

    .diagram-block_svg .mxCellEditor ul:not(:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
        padding-left: 40px
    }

    .diagram-block_svg g ul:not(:-webkit-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
        padding-left: 40px
    }

    .diagram-block_svg g ul:not(:-moz-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
        padding-left: 40px
    }

    .diagram-block_svg g ul:not(:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
        padding-left: 40px
    }

    .docx-diagram-displayer_svg .mxCellEditor ul:not(:-webkit-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
        padding-left: 40px
    }

    .docx-diagram-displayer_svg .mxCellEditor ul:not(:-moz-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
        padding-left: 40px
    }

    .docx-diagram-displayer_svg .mxCellEditor ul:not(:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
        padding-left: 40px
    }

    .docx-diagram-displayer_svg g ul:not(:-webkit-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
        padding-left: 40px
    }

    .docx-diagram-displayer_svg g ul:not(:-moz-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
        padding-left: 40px
    }

    .docx-diagram-displayer_svg g ul:not(:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
        padding-left: 40px
    }

    #graphContainer .mxCellEditor ul:-webkit-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
        padding-right: 40px
    }

    #graphContainer .mxCellEditor ul:-moz-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
        padding-right: 40px
    }

    #graphContainer .mxCellEditor ul:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
        padding-right: 40px
    }

    #graphContainer g ul:-webkit-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
        padding-right: 40px
    }

    #graphContainer g ul:-moz-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
        padding-right: 40px
    }

    #graphContainer g ul:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
        padding-right: 40px
    }

    .diagram-block_svg .mxCellEditor ul:-webkit-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
        padding-right: 40px
    }

    .diagram-block_svg .mxCellEditor ul:-moz-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
        padding-right: 40px
    }

    .diagram-block_svg .mxCellEditor ul:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
        padding-right: 40px
    }

    .diagram-block_svg g ul:-webkit-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
        padding-right: 40px
    }

    .diagram-block_svg g ul:-moz-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
        padding-right: 40px
    }

    .diagram-block_svg g ul:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
        padding-right: 40px
    }

    .docx-diagram-displayer_svg .mxCellEditor ul:-webkit-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
        padding-right: 40px
    }

    .docx-diagram-displayer_svg .mxCellEditor ul:-moz-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
        padding-right: 40px
    }

    .docx-diagram-displayer_svg .mxCellEditor ul:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
        padding-right: 40px
    }

    .docx-diagram-displayer_svg g ul:-webkit-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
        padding-right: 40px
    }

    .docx-diagram-displayer_svg g ul:-moz-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
        padding-right: 40px
    }

    .docx-diagram-displayer_svg g ul:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
        padding-right: 40px
    }

    #graphContainer .mxCellEditor ol,
    #graphContainer g ol,
    .diagram-block_svg .mxCellEditor ol,
    .diagram-block_svg g ol,
    .docx-diagram-displayer_svg .mxCellEditor ol,
    .docx-diagram-displayer_svg g ol {
        -webkit-margin-before: 1em;
        -webkit-margin-after: 1em;
        -webkit-margin-start: 0;
        -webkit-margin-end: 0;
        -webkit-padding-start: 40px;
        margin-top: 1em;
        margin-bottom: 1em;
        margin-left: 0;
        margin-right: 0;
        list-style-type: decimal;
        display: block
    }

    #graphContainer .mxCellEditor ol:not(:-webkit-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
        padding-left: 40px
    }

    #graphContainer .mxCellEditor ol:not(:-moz-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
        padding-left: 40px
    }

    #graphContainer .mxCellEditor ol:not(:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
        padding-left: 40px
    }

    #graphContainer g ol:not(:-webkit-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
        padding-left: 40px
    }

    #graphContainer g ol:not(:-moz-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
        padding-left: 40px
    }

    #graphContainer g ol:not(:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
        padding-left: 40px
    }

    .diagram-block_svg .mxCellEditor ol:not(:-webkit-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
        padding-left: 40px
    }

    .diagram-block_svg .mxCellEditor ol:not(:-moz-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
        padding-left: 40px
    }

    .diagram-block_svg .mxCellEditor ol:not(:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
        padding-left: 40px
    }

    .diagram-block_svg g ol:not(:-webkit-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
        padding-left: 40px
    }

    .diagram-block_svg g ol:not(:-moz-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
        padding-left: 40px
    }

    .diagram-block_svg g ol:not(:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
        padding-left: 40px
    }

    .docx-diagram-displayer_svg .mxCellEditor ol:not(:-webkit-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
        padding-left: 40px
    }

    .docx-diagram-displayer_svg .mxCellEditor ol:not(:-moz-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
        padding-left: 40px
    }

    .docx-diagram-displayer_svg .mxCellEditor ol:not(:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
        padding-left: 40px
    }

    .docx-diagram-displayer_svg g ol:not(:-webkit-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
        padding-left: 40px
    }

    .docx-diagram-displayer_svg g ol:not(:-moz-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
        padding-left: 40px
    }

    .docx-diagram-displayer_svg g ol:not(:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
        padding-left: 40px
    }

    #graphContainer .mxCellEditor ol:-webkit-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
        padding-right: 40px
    }

    #graphContainer .mxCellEditor ol:-moz-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
        padding-right: 40px
    }

    #graphContainer .mxCellEditor ol:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
        padding-right: 40px
    }

    #graphContainer g ol:-webkit-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
        padding-right: 40px
    }

    #graphContainer g ol:-moz-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
        padding-right: 40px
    }

    #graphContainer g ol:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
        padding-right: 40px
    }

    .diagram-block_svg .mxCellEditor ol:-webkit-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
        padding-right: 40px
    }

    .diagram-block_svg .mxCellEditor ol:-moz-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
        padding-right: 40px
    }

    .diagram-block_svg .mxCellEditor ol:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
        padding-right: 40px
    }

    .diagram-block_svg g ol:-webkit-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
        padding-right: 40px
    }

    .diagram-block_svg g ol:-moz-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
        padding-right: 40px
    }

    .diagram-block_svg g ol:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
        padding-right: 40px
    }

    .docx-diagram-displayer_svg .mxCellEditor ol:-webkit-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
        padding-right: 40px
    }

    .docx-diagram-displayer_svg .mxCellEditor ol:-moz-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
        padding-right: 40px
    }

    .docx-diagram-displayer_svg .mxCellEditor ol:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
        padding-right: 40px
    }

    .docx-diagram-displayer_svg g ol:-webkit-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
        padding-right: 40px
    }

    .docx-diagram-displayer_svg g ol:-moz-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
        padding-right: 40px
    }

    .docx-diagram-displayer_svg g ol:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
        padding-right: 40px
    }

    #graphContainer .mxCellEditor pre,
    #graphContainer g pre,
    .diagram-block_svg .mxCellEditor pre,
    .diagram-block_svg g pre,
    .docx-diagram-displayer_svg .mxCellEditor pre,
    .docx-diagram-displayer_svg g pre {
        white-space: pre;
        margin: 1em 0;
        font-family: monospace;
        display: block
    }

    .embed-code-block {
        font-size: 13px;
        line-height: 1.2
    }

    .embed-code-block .ace-line {
        margin-top: 1px;
        margin-bottom: 1px
    }

    .highlight-block-v2-toolbar.no-emoji {
        opacity: .5
    }

    .diagram-title {
        color: var(--color-text-1);
        cursor: pointer;
        align-items: center;
        margin-left: 12px;
        display: flex
    }

    .diagram-title>span {
        margin-left: 6px
    }

    .editor-css-container .docPageHeader {
        box-sizing: border-box;
        padding: 36px 32px 0;
        position: relative
    }

    @media screen and (max-width:960px) {
        .editor-css-container .docPageHeader {
            padding: 0
        }
    }

    .editor-css-container .docPageHeader .title {
        color: var(--color-text-1);
        letter-spacing: .1125px;
        font-size: 34px;
        font-style: normal;
        font-weight: 500;
        line-height: 34px
    }

    @media screen and (max-width:640px) {
        .editor-css-container .docPageHeader .title {
            font-size: 24px;
            line-height: 24px
        }
    }

    .editor-css-container .docPageHeader .sub-title {
        justify-content: space-between;
        align-items: center;
        display: flex
    }

    .editor-css-container .docPageHeader .publishInfo {
        color: #86909c;
        letter-spacing: .3px;
        text-align: justify;
        margin-top: 8px;
        margin-right: 10px;
        font-size: 14px;
        font-style: normal;
        font-weight: 400;
        line-height: 22px
    }

    .editor-css-container .docPageHeader .publishInfo span {
        color: #165dff;
        cursor: pointer
    }

    .editor-css-container .docPageHeader .hover {
        cursor: pointer;
        text-decoration: none
    }

    .editor-css-container .docPageHeader .divider {
        margin: 32px 0
    }

    @media screen and (max-width:640px) {
        .editor-css-container .docPageHeader .divider {
            margin: 20px 0
        }
    }

    .editor-css-container .docPageHeader .edit-mask-container {
        min-height: 500px;
        position: relative
    }

    .editor-css-container .docPageHeader .edit-mask {
        background-color: var(--color-mask-bg);
        z-index: 1001;
        justify-content: center;
        display: flex;
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0
    }

    .editor-css-container .docPageHeader .doc-lang-switcher {
        position: absolute;
        top: 40px;
        right: 34px
    }

    @media screen and (max-width:640px) {
        .editor-css-container .docPageHeader .doc-lang-switcher {
            margin-top: 8px;
            position: static
        }
    }

    .editor-css-container .docPageHeader .doc-lang-switcher .arco-select-view {
        border-radius: 2px;
        width: 96px;
        font-weight: 400;
        color: #020814 !important;
        background-color: #fff !important;
        height: 26px !important;
        font-size: 12px !important;
        line-height: 26px !important
    }

    .editor-css-container .metaInfo {
        margin-top: 14px
    }

    .editor-css-container .metaInfo .docMetaTag {
        color: #3973e5;
        border: 1px solid #d7e3fa;
        border-radius: 14px;
        margin-right: 8px;
        padding: 2px 7px
    }

    .lang-desc-banner.arco-alert-info {
        color: var(--color-text-3);
        align-items: center;
        margin-bottom: 20px;
        font-size: 14px;
        display: flex
    }

    .lang-desc-banner.arco-alert-info .arco-alert-icon-wrapper svg {
        color: #165dff;
        margin-right: 5px
    }

    .doc-image-width {
        border-left: 1px solid var(--color-fill-3);
        align-items: center;
        margin: 3px 0;
        padding: 0 8px;
        display: flex
    }

    .doc-image-width>span {
        flex-shrink: 0
    }

    .doc-image-width>.arco-input-number {
        width: 70px;
        margin-left: 5px
    }

    .doc-menu-sub-popup {
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none
    }

    .doc-menu-sub-popup .doc-menu-sub-item {
        cursor: pointer;
        align-items: center;
        width: 130px;
        height: 30px;
        margin: 3px 0;
        padding: 0 10px;
        display: flex
    }

    .doc-menu-sub-popup .doc-menu-sub-item .arco-icon,
    .doc-menu-sub-popup .doc-menu-sub-item .svg-icon {
        margin-right: 10px;
        font-size: 16px
    }

    .doc-menu-sub-popup .doc-menu-sub-item span:first-child {
        align-items: center;
        display: flex
    }

    .doc-menu-sub-popup .doc-menu-sub-item:hover {
        background-color: var(--color-fill-1)
    }

    .doc-menu-sub-popup .doc-menu-sub-multi-col {
        box-sizing: border-box;
        width: 130px;
        font-size: 12px
    }

    .doc-menu-sub-popup .doc-menu-sub-multi-col .doc-menu-sub-multi-col-captain {
        justify-content: space-between;
        align-items: center;
        display: flex
    }

    .doc-menu-sub-popup .doc-menu-sub-multi-col .doc-menu-sub-multi-col-body {
        justify-content: space-between;
        width: 100%;
        margin-top: 6px;
        display: flex
    }

    .doc-menu-sub-popup .doc-menu-sub-multi-col .doc-menu-sub-multi-col-selector {
        cursor: pointer;
        width: 100%;
        height: 70px
    }

    .doc-menu-sub-popup .doc-menu-sub-multi-col .doc-menu-sub-multi-col-selector.disable {
        cursor: not-allowed
    }

    .doc-menu-sub-popup .doc-menu-sub-multi-col .doc-menu-sub-multi-col-selector>div {
        background-color: var(--color-fill-2);
        width: 20px;
        height: 100%
    }

    .doc-menu-sub-popup .doc-menu-sub-multi-col .doc-menu-sub-multi-col-selector.active>div {
        background-color: rgba(22, 93, 255, .6)
    }

    .doc-menu-sub-popup-wrapper .arco-popover-content {
        padding: 6px 8px
    }

    .doc-menu-next-line .arco-popover-content {
        box-shadow: none;
        border: none;
        padding: 0
    }

    .doc-tags-popover {
        -ms-overflow-style: none;
        background: var(--color-bg-1);
        border: 1px solid var(--color-border-2);
        box-shadow: 0 0 4px var(--color-border-1);
        overflow: -moz-scrollbars-none;
        scrollbar-width: none;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        border-radius: 4px;
        width: 220px;
        padding: 0;
        font-size: 13px
    }

    .doc-tags-popover::-webkit-scrollbar {
        display: none
    }

    .doc-tags-popover .doc-tags-popover-list {
        padding: 4px 6px
    }

    .doc-tags-popover .doc-tags-popover-row {
        box-sizing: border-box;
        border-radius: 4px;
        justify-content: space-between;
        align-items: center;
        height: 32px;
        margin: 4px 0;
        padding: 0 12px;
        display: flex
    }

    .doc-tags-popover .doc-tags-popover-row.active {
        color: rgba(var(--primary-6));
        letter-spacing: .003em;
        background: #f6f8fa;
        font-weight: 500
    }

    .doc-tags-popover .doc-tags-popover-row.inactive {
        cursor: pointer
    }

    .doc-tags-popover .doc-tags-popover-row.inactive:hover {
        background: #f6f8fa
    }

    .doc-tags-popover .doc-tags-popover-row-left,
    .doc-tags-popover .doc-tags-popover-row-right {
        text-overflow: ellipsis;
        white-space: nowrap;
        align-items: center;
        display: flex;
        overflow: hidden
    }

    .doc-tags-popover .doc-tags-popover-row-left>span {
        text-overflow: ellipsis;
        white-space: nowrap;
        overflow: hidden
    }

    .doc-tags-popover .doc-tags-popover-row-right {
        flex-shrink: 0;
        margin-left: 3px
    }

    .doc-tags-popover .doc-tags-popover-row-right .svg-unlink {
        box-sizing: content-box;
        cursor: pointer;
        border-radius: 3px;
        padding: 3px
    }

    .doc-tags-popover .doc-tags-popover-row-right .svg-unlink:hover {
        background-color: var(--color-fill-2);
        color: rgb(var(--primary-6))
    }

    .doc-tags-popover .doc-tags-popover-tag-color {
        color: #fff;
        border-radius: 50%;
        flex-shrink: 0;
        justify-content: center;
        align-items: center;
        width: 12px;
        height: 12px;
        margin-right: 8px;
        display: flex
    }

    .doc-tags-popover .doc-tags-submit {
        border-top: 1px solid var(--color-border-2);
        box-sizing: content-box;
        color: rgb(var(--primary-6));
        cursor: pointer;
        align-items: center;
        height: 32px;
        padding: 3px 6px;
        font-size: 13px;
        display: flex
    }

    .doc-tags-popover .doc-tags-submit>div {
        box-sizing: border-box;
        border-radius: 4px;
        align-items: center;
        width: 100%;
        height: 100%;
        padding: 0 12px;
        display: flex
    }

    .doc-tags-popover .doc-tags-submit>div:hover {
        background-color: var(--color-fill-1)
    }

    .doc-menu-container {
        -ms-overflow-style: none;
        background: var(--color-bg-1);
        background-color: var(--color-bg-1);
        border: 1px solid var(--color-border-2);
        box-shadow: 0 0 4px var(--color-border-1);
        box-sizing: content-box;
        overflow: -moz-scrollbars-none;
        scrollbar-width: none;
        border-radius: 3px;
        width: 240px;
        padding: 5px;
        overflow-y: auto
    }

    .doc-menu-container::-webkit-scrollbar {
        display: none
    }

    .doc-menu-container .doc-menu-base-cut {
        background-color: var(--color-border-2);
        box-sizing: border-box;
        width: 100%;
        height: 1px;
        margin: 5px 0 7px;
        padding: 0 5px;
        display: flex
    }

    .doc-menu-container .arco-icon,
    .doc-menu-container .svg-icon {
        color: var(--color-text-2);
        font-size: 16px;
        font-weight: 700
    }

    .doc-menu-base-style {
        flex-wrap: wrap;
        display: flex
    }

    .doc-menu-base-style .doc-menu-base-item {
        cursor: pointer;
        justify-content: center;
        align-items: center;
        width: 27px;
        height: 27px;
        margin: 6px;
        display: flex
    }

    .doc-menu-base-style .doc-menu-base-item:hover {
        background-color: var(--color-fill-1)
    }

    .doc-menu-slice-style .doc-menu-slice-item {
        box-sizing: content-box;
        cursor: pointer;
        justify-content: space-between;
        align-items: center;
        height: 30px;
        margin: 5px 0;
        padding: 0 10px;
        display: flex;
        position: relative
    }

    .doc-menu-slice-style .doc-menu-slice-item:hover {
        background-color: var(--color-fill-1)
    }

    .doc-menu-slice-style .doc-menu-slice-item span:first-child {
        align-items: center;
        display: flex
    }

    .doc-menu-slice-style .doc-menu-slice-item .arco-icon,
    .doc-menu-slice-style .doc-menu-slice-item .svg-icon {
        margin-right: 10px
    }

    .doc-menu-slice-style .doc-menu-slice-item .arco-icon-right {
        margin-right: 0
    }

    @keyframes fade-out {
        0% {
            opacity: 0
        }

        to {
            opacity: 1
        }
    }

    .doc-profile {
        background-color: #fff;
        animation: .3s fade-out
    }

    .doc-profile .doc-profile-header {
        z-index: 0;
        height: 200px;
        position: relative
    }

    .doc-profile .header-mask {
        opacity: .6;
        z-index: 2;
        background-image: linear-gradient(-180deg, transparent, #000);
        transition: all .2s
    }

    .doc-profile .header-mask,
    .doc-profile .profile-header-background {
        width: 100%;
        height: 100%;
        position: absolute;
        top: 0;
        left: 0
    }

    .doc-profile .profile-header-background {
        z-index: 1;
        background-position: 50%;
        background-size: cover;
        transition: all .1s ease-in
    }

    .doc-profile .profile-header-content {
        color: #fff;
        z-index: 3;
        position: absolute;
        bottom: 15px;
        left: 13px
    }

    .doc-profile .profile-header-content .profile-name {
        font-size: 20px;
        font-weight: 700
    }

    .doc-profile .profile-header-content .profile-button {
        box-sizing: content-box;
        cursor: pointer;
        background-color: rgba(255, 255, 255, .4);
        border-radius: 15px;
        justify-content: center;
        align-items: center;
        width: 15px;
        height: 15px;
        margin-top: 10px;
        padding: 7px;
        display: flex
    }

    .doc-profile .profile-header-content .profile-button:hover {
        background-color: rgba(22, 93, 255, .7)
    }

    .doc-profile .doc-profile-body {
        color: var(--color-text-2);
        padding: 0 10px;
        font-size: 10px
    }

    .doc-profile .doc-profile-body .doc-profile-list-item {
        justify-content: space-between;
        align-items: center;
        margin: 10px 0;
        display: flex
    }

    .doc-profile .doc-profile-body .doc-profile-list-item>div {
        flex-shrink: 0
    }

    .doc-profile .doc-profile-body .profile-list-title {
        color: var(--color-text-3);
        width: 35px
    }

    .doc-profile .doc-profile-body .profile-list-content {
        text-overflow: ellipsis;
        white-space: nowrap;
        width: 150px;
        overflow: hidden
    }

    .doc-profile .doc-profile-body .profile-list-content>a {
        color: #165dff;
        cursor: pointer
    }

    .align-trigger-menu-container {
        background: #fff;
        padding: 5px;
        display: flex;
        box-shadow: 0 0 4px rgba(0, 0, 0, .1)
    }

    .arco-trigger.align-trigger-menu {
        z-index: 99
    }

    .arco-trigger.align-trigger-menu button {
        color: var(--color-text-1);
        width: 30px;
        height: 30px;
        margin: 0 5px;
        padding: 0;
        font-size: 16px
    }

    .arco-trigger.align-trigger-menu button:hover {
        background: #f2f3f5
    }

    .arco-trigger.align-trigger-menu>.dividing-line {
        background-color: #ddd;
        width: 1px;
        margin: 5px 0
    }

    .arco-trigger.emoji-picker-trigger {
        width: 352px
    }

    .emoji-container {
        background-color: transparent;
        width: 26px;
        height: 26px;
        font-size: 20px
    }

    .emoji-container.can-pick {
        cursor: pointer
    }

    .emoji-container .arco-icon-loading {
        color: var(--color-text-2);
        font-size: 18px
    }

    .aigc-toolbar .plain-text {
        color: var(--color-text-3);
        padding: 6px 7px;
        font-size: 12px
    }

    .aigc-toolbar .dropdown-list-item {
        color: var(--color-text-2);
        justify-content: space-between;
        align-items: center;
        font-size: 13px;
        display: flex
    }

    .aigc-toolbar .dropdown-list-item>div {
        align-items: center;
        display: flex
    }

    .aigc-toolbar .dropdown-list-item .arco-icon-right {
        margin-right: 0
    }

    .float-toolbar-dropdown-list-third {
        background: var(--color-bg-1);
        background-color: var(--color-bg-2);
        border: 1px solid var(--color-border-2);
        box-shadow: 0 0 4px var(--color-border-1);
        border-radius: 5px;
        padding: 5px
    }

    .editor-kit-container .group-plugin-container .group-wrapper {
        border: 2px solid transparent;
        width: 100%;
        max-width: 360px;
        line-height: 0;
        display: inline-block;
        position: relative;
        overflow: hidden
    }

    .editor-kit-container .group-plugin-container .group-wrapper .group-container {
        background: var(--color-fill-1);
        border: 1px solid var(--color-border-2);
        box-sizing: border-box;
        border-radius: 5px;
        justify-content: space-between;
        align-items: center;
        height: 70px;
        padding: 0 16px;
        display: flex;
        box-shadow: 0 4px 10px #f2f3f5
    }

    .editor-kit-container .group-plugin-container .group-wrapper .group-container .groupname-container {
        align-items: center;
        font-weight: 400;
        display: flex;
        overflow: hidden
    }

    .editor-kit-container .group-plugin-container .group-wrapper .group-container .groupname-container .group-image-wrapper {
        box-sizing: border-box;
        border-radius: 100%;
        flex-shrink: 0;
        margin-right: 10px;
        overflow: hidden
    }

    .editor-kit-container .group-plugin-container .group-wrapper .group-container .groupname-container .group-icon {
        width: 37px;
        height: 37px
    }

    .editor-kit-container .group-plugin-container .group-wrapper .group-container .groupname-container .group-name-text {
        text-overflow: ellipsis;
        white-space: nowrap;
        word-break: break-all;
        font-size: 14px;
        line-height: 100%;
        overflow: hidden
    }

    .editor-kit-container .group-plugin-container .group-wrapper .group-container .group-open-button {
        background: var(--color-fill-3);
        color: rgb(var(--blue-7), .9)
    }

    .editor-kit-container .group-plugin-container .group-wrapper .group-container .group-text {
        text-decoration: none
    }

    .doc-menu-sub-popup.tags-dropdown-list {
        padding: 0
    }

    .doc-menu-sub-popup.tags-dropdown-list .tags-dropdown-scroll {
        -ms-overflow-style: none;
        max-height: 300px;
        overflow: -moz-scrollbars-none;
        scrollbar-width: none;
        padding: 4px 6px
    }

    .doc-menu-sub-popup.tags-dropdown-list .tags-dropdown-scroll::-webkit-scrollbar {
        display: none
    }

    .doc-menu-sub-popup.tags-dropdown-list .tags-row {
        box-sizing: border-box;
        cursor: pointer;
        border-radius: 4px;
        align-items: center;
        width: 220px;
        height: 32px;
        padding: 0 12px;
        display: flex
    }

    .doc-menu-sub-popup.tags-dropdown-list .tags-row,
    .doc-menu-sub-popup.tags-dropdown-list .tags-row>span {
        text-overflow: ellipsis;
        white-space: nowrap;
        overflow: hidden
    }

    .doc-menu-sub-popup.tags-dropdown-list .tags-row.active {
        color: rgba(var(--primary-6));
        letter-spacing: .003em;
        background: #f6f8fa;
        font-weight: 500
    }

    .doc-menu-sub-popup.tags-dropdown-list .dropdown-list-tag-color {
        color: #fff;
        border-radius: 50%;
        flex-shrink: 0;
        justify-content: center;
        align-items: center;
        width: 12px;
        height: 12px;
        margin-right: 7px;
        display: flex
    }

    .doc-menu-sub-popup.tags-dropdown-list .dropdown-list-tag-color .arco-icon {
        margin: 2px
    }

    .doc-menu-sub-popup.tags-dropdown-list .tags-edit-page {
        box-sizing: content-box;
        cursor: pointer;
        border-top: 1px solid #eaedf1;
        align-items: center;
        height: 32px;
        padding: 4px 6px;
        display: flex
    }

    .doc-menu-sub-popup.tags-dropdown-list .tags-edit-page>div {
        box-sizing: border-box;
        border-radius: 4px;
        align-items: center;
        width: 100%;
        height: 100%;
        padding: 0 12px;
        display: flex
    }

    .doc-menu-sub-popup.tags-dropdown-list .tags-edit-page>div:hover {
        background-color: var(--color-fill-1)
    }

    .doc-menu-sub-popup-wrapper.tags-dropdown-popover .arco-popover-content {
        padding: 0
    }

    .editor-kit-mention-item {
        position: relative
    }

    .editor-kit-mention-item .editor-kit-mention-expand {
        cursor: pointer;
        border-radius: 5px;
        padding: 3px;
        position: absolute;
        top: 50%;
        right: 10px;
        transform: translateY(-50%)
    }

    .editor-kit-mention-item .editor-kit-mention-expand:hover {
        color: var(--color-text-3)
    }

    .editor-kit-mention-item:hover {
        background-color: #eff0f1
    }

    .mention-footer>span {
        color: var(--color-text-2);
        margin-left: 10px;
        font-size: 12px
    }

    .at-doc {
        color: rgba(var(--gray-6), .7);
        cursor: pointer;
        padding: 0 2px 0 0
    }

    .at-doc.is-active {
        color: #3370ff
    }

    .mention-aside-item {
        box-sizing: border-box;
        margin: 2px 0 0 2px;
        font-size: 12px
    }

    .mention-aside-item.active {
        color: #165dff
    }

    .mention-aside-item .mention-aside-item-name {
        box-sizing: border-box;
        justify-content: center;
        align-items: center;
        width: 40px;
        padding: 7px 5px;
        display: flex
    }

    .mention-aside-item .mention-aside-item-footer {
        box-sizing: border-box;
        background-color: transparent;
        height: 2px
    }

    .mention-aside-item .mention-aside-item-footer.active {
        background-color: #165dff
    }

    @keyframes blink {
        0% {
            opacity: 1
        }

        50% {
            opacity: 0
        }

        to {
            opacity: 1
        }
    }

    .text-mount-ref .aigc-panel {
        box-sizing: border-box;
        background: linear-gradient(95.32deg, #2e73ff 25.41%, #7b4dff 87.96%, #db76ff), linear-gradient(#fff, #fff);
        border-radius: 6px;
        padding: 1px
    }

    .text-mount-ref .aigc-panel>.aigc-main {
        -ms-overflow-style: none;
        box-sizing: border-box;
        height: 100%;
        overflow: -moz-scrollbars-none;
        scrollbar-width: none;
        background-color: #fff;
        border-radius: 5px;
        width: 100%;
        padding: 10px
    }

    .text-mount-ref .aigc-panel>.aigc-main::-webkit-scrollbar {
        display: none
    }

    .text-mount-ref .aigc-panel>.aigc-main .aigc-captain {
        justify-content: space-between;
        align-items: center;
        display: flex
    }

    .text-mount-ref .aigc-panel>.aigc-main .aigc-captain>.arco-icon {
        cursor: pointer
    }

    .text-mount-ref .aigc-panel>.aigc-main .aigc-captain .aigc-captain-right {
        align-items: center;
        display: flex
    }

    .text-mount-ref .aigc-panel>.aigc-main .aigc-captain .aigc-captain-bits-ai {
        text-align: right;
        margin-right: 5px;
        font-size: 12px
    }

    .text-mount-ref .aigc-panel>.aigc-main .aigc-captain .aigc-captain-bits-ai a {
        color: rgb(var(--arcoblue-6))
    }

    .text-mount-ref .aigc-panel>.aigc-main .aigc-captain-title {
        align-items: center;
        font-size: 18px;
        font-weight: 700;
        display: flex
    }

    .text-mount-ref .aigc-panel>.aigc-main .aigc-captain-title>svg {
        margin-top: 2px;
        margin-right: 10px
    }

    .text-mount-ref .aigc-panel>.aigc-main .aigc-captain-title .aigc-captain-selector {
        width: 100px;
        margin-left: 10px
    }

    .text-mount-ref .aigc-panel>.aigc-main .aigc-captain-title .aigc-captain-selector .arco-select-arrow-icon {
        color: #4e5969
    }

    .text-mount-ref .aigc-panel>.aigc-main .aigc-content {
        -ms-overflow-style: none;
        background-color: var(--color-fill-1);
        border: 1px solid var(--color-border-1);
        box-sizing: border-box;
        min-height: 50px;
        max-height: 200px;
        overflow: -moz-scrollbars-none;
        scrollbar-width: none;
        word-break: break-word;
        border-radius: 4px;
        margin-top: 10px;
        padding: 10px;
        overflow-y: auto
    }

    .text-mount-ref .aigc-panel>.aigc-main .aigc-content::-webkit-scrollbar {
        display: none
    }

    .text-mount-ref .aigc-panel>.aigc-main .aigc-content.loading {
        justify-content: center;
        align-items: center;
        display: flex
    }

    .text-mount-ref .aigc-panel>.aigc-main .aigc-content .bouncing-loader {
        justify-content: center;
        padding: 10px 0;
        display: flex;
        transform: translateY(3px)
    }

    @keyframes bouncing-loader {
        to {
            opacity: .1;
            transform: translateY(-5px)
        }
    }

    .text-mount-ref .aigc-panel>.aigc-main .aigc-content .bouncing-loader>div {
        background: #8385aa;
        border-radius: 50%;
        width: 5px;
        height: 5px;
        margin: 0 3px;
        animation: .6s infinite alternate bouncing-loader
    }

    .text-mount-ref .aigc-panel>.aigc-main .aigc-content .bouncing-loader>div:nth-child(2) {
        animation-delay: .2s
    }

    .text-mount-ref .aigc-panel>.aigc-main .aigc-content .bouncing-loader>div:nth-child(3) {
        animation-delay: .4s
    }

    .text-mount-ref .aigc-panel>.aigc-main .aigc-content .aigc-content-reveal {
        color: var(--color-text-1);
        font-size: 14px
    }

    .text-mount-ref .aigc-panel>.aigc-main .aigc-content .aigc-content-reveal ol:not(:-webkit-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
        padding-left: 20px
    }

    .text-mount-ref .aigc-panel>.aigc-main .aigc-content .aigc-content-reveal ol:not(:-moz-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
        padding-left: 20px
    }

    .text-mount-ref .aigc-panel>.aigc-main .aigc-content .aigc-content-reveal ol:not(:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
        padding-left: 20px
    }

    .text-mount-ref .aigc-panel>.aigc-main .aigc-content .aigc-content-reveal ul:not(:-webkit-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
        padding-left: 20px
    }

    .text-mount-ref .aigc-panel>.aigc-main .aigc-content .aigc-content-reveal ul:not(:-moz-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
        padding-left: 20px
    }

    .text-mount-ref .aigc-panel>.aigc-main .aigc-content .aigc-content-reveal ul:not(:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
        padding-left: 20px
    }

    .text-mount-ref .aigc-panel>.aigc-main .aigc-content .aigc-content-reveal ol:-webkit-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
        padding-right: 20px
    }

    .text-mount-ref .aigc-panel>.aigc-main .aigc-content .aigc-content-reveal ol:-moz-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
        padding-right: 20px
    }

    .text-mount-ref .aigc-panel>.aigc-main .aigc-content .aigc-content-reveal ol:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
        padding-right: 20px
    }

    .text-mount-ref .aigc-panel>.aigc-main .aigc-content .aigc-content-reveal ul:-webkit-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
        padding-right: 20px
    }

    .text-mount-ref .aigc-panel>.aigc-main .aigc-content .aigc-content-reveal ul:-moz-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
        padding-right: 20px
    }

    .text-mount-ref .aigc-panel>.aigc-main .aigc-content .aigc-content-reveal ul:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
        padding-right: 20px
    }

    .text-mount-ref .aigc-panel>.aigc-main .aigc-content .aigc-content-generating>:last-child:not(ol):not(ul):after,
    .text-mount-ref .aigc-panel>.aigc-main .aigc-content .aigc-content-generating>ol:last-child>li:last-child:after,
    .text-mount-ref .aigc-panel>.aigc-main .aigc-content .aigc-content-generating>ul:last-child>li:last-child:after {
        background-color: var(--color-text-1);
        content: "";
        vertical-align: middle;
        width: 1px;
        height: 1em;
        margin-top: -2px;
        margin-left: 1px;
        animation: 1s infinite blink;
        display: inline-block
    }

    .text-mount-ref .aigc-panel>.aigc-main .arco-divider {
        margin: 10px 0
    }

    .text-mount-ref .aigc-panel>.aigc-main .aigc-operation {
        justify-content: space-between;
        align-items: center;
        margin-top: -3px;
        display: flex
    }

    .text-mount-ref .aigc-panel>.aigc-main .aigc-operation>.aigc-operation-group .arco-btn {
        border: 1px solid var(--color-border-2);
        color: var(--color-text-2);
        border-radius: 4px;
        margin-right: 5px
    }

    .text-mount-ref .aigc-panel>.aigc-main .aigc-operation>.aigc-operation-group .arco-btn:hover {
        background-color: var(--color-fill-1)
    }

    .text-mount-ref .aigc-panel>.aigc-main .aigc-operation .hyper-link {
        color: var(--color-text-3);
        font-size: 12px
    }

    .text-mount-ref .aigc-panel>.aigc-main .aigc-operation .hyper-link>span {
        color: rgb(var(--arcoblue-6));
        cursor: pointer
    }

    .text-ellipsis-global {
        text-overflow: ellipsis;
        white-space: nowrap;
        overflow: hidden
    }

    .box-shadow-global {
        background: var(--color-bg-1);
        border: 1px solid var(--color-border-2);
        box-shadow: 0 0 4px var(--color-border-1);
        padding: 5px
    }

    .no-scroll-bar {
        -ms-overflow-style: none;
        overflow: -moz-scrollbars-none;
        scrollbar-width: none
    }

    .no-scroll-bar::-webkit-scrollbar {
        display: none
    }

    .mention-anchor-suggest {
        -ms-overflow-style: none;
        background: var(--color-bg-1);
        border: 1px solid var(--color-border-2);
        box-shadow: 0 0 4px var(--color-border-1);
        height: 300px;
        overflow: -moz-scrollbars-none;
        scrollbar-width: none;
        border-radius: 3px;
        width: 210px;
        margin: 0 5px;
        padding: 10px;
        position: absolute;
        left: 100%;
        overflow-y: auto
    }

    .mention-anchor-suggest::-webkit-scrollbar {
        display: none
    }

    .mention-anchor-suggest .mention-anchor-item {
        box-sizing: border-box;
        cursor: pointer;
        justify-content: space-between;
        align-items: center;
        height: 40px;
        padding: 5px 7px;
        display: flex
    }

    .mention-anchor-suggest .mention-anchor-item>span {
        text-overflow: ellipsis;
        white-space: nowrap;
        overflow: hidden
    }

    .mention-anchor-suggest .mention-anchor-item.active {
        background-color: var(--color-fill-2)
    }

    .mention-anchor-suggest .mention-anchor-item:hover {
        background-color: var(--color-fill-1)
    }

    .mention-anchor-suggest .mention-anchor-item .arco-icon {
        color: var(--color-text-3);
        flex-shrink: 0;
        margin: 0 10px;
        font-size: 16px;
        font-weight: 700
    }

    :root {
        --background: 255, 255, 255;
        --foreground: 28, 28, 35;
        --icon: 221, 0%, 10%;
        --icon-dark: 221, 0%, 10%;
        --icon-gray: 221, 0%, 90%;
        --black-7: 0, 0, 0;
        --black-6: 16, 16, 16;
        --black-5: 54, 61, 77;
        --black-4: 102, 102, 104;
        --black-3: 149, 149, 151;
        --black-2: 173, 173, 175;
        --black-1: 220, 220, 222;
        --white-6: 209, 209, 211;
        --white-5: 219, 219, 220;
        --white-4: 228, 228, 230;
        --white-3: 238, 238, 239;
        --white-2: 248, 248, 248;
        --white-1: 255, 255, 255;
        --coze-fg-revert: 255, 255, 255;
        --coze-fg-white: 255, 255, 255;
        --coze-fg-7: 255, 255, 255;
        --coze-fg-6: 255, 255, 255;
        --coze-fg-5: 255, 255, 255;
        --coze-fg-4: 8, 13, 30;
        --coze-fg-3: 15, 21, 40;
        --coze-fg-2: 32, 41, 69;
        --coze-fg-1: 55, 67, 106;
        --coze-bg-9: 6, 7, 9;
        --coze-bg-8: 68, 83, 130;
        --coze-bg-7: 75, 90, 140;
        --coze-bg-6: 82, 100, 154;
        --coze-bg-5: 87, 104, 161;
        --coze-bg-4: 90, 108, 167;
        --coze-bg-3: 255, 255, 255;
        --coze-bg-2: 252, 252, 255;
        --coze-bg-1: 247, 247, 252;
        --coze-bg-0: 240, 240, 247;
        --coze-stroke-5: 82, 100, 154;
        --coze-stroke-6: 68, 83, 130;
        --coze-stroke-7: 55, 67, 106;
        --coze-stroke-opaque: 226, 228, 239;
        --coze-mask-5: 0, 0, 0;
        --coze-shadow-0: 0, 0, 0;
        --coze-brand-50: 102, 108, 255;
        --coze-brand-30: 163, 166, 255;
        --coze-brand-7: 65, 43, 255;
        --coze-brand-6: 69, 56, 255;
        --coze-brand-5: 81, 71, 255;
        --coze-brand-3: 150, 159, 255;
        --coze-brand-2: 161, 170, 255;
        --coze-brand-1: 171, 181, 255;
        --coze-brand-0: 181, 191, 255;
        --coze-red-7: 222, 22, 39;
        --coze-red-6: 227, 36, 52;
        --coze-red-5: 229, 50, 65;
        --coze-red-3: 250, 138, 148;
        --coze-red-2: 252, 149, 157;
        --coze-red-1: 255, 163, 171;
        --coze-red-0: 255, 173, 180;
        --coze-yellow-50: 242, 182, 0;
        --coze-yellow-30: 245, 184, 0;
        --coze-yellow-7: 229, 104, 0;
        --coze-yellow-6: 242, 109, 0;
        --coze-yellow-5: 255, 115, 0;
        --coze-yellow-3: 242, 161, 94;
        --coze-yellow-2: 242, 169, 109;
        --coze-yellow-1: 240, 174, 120;
        --coze-yellow-0: 239, 179, 130;
        --coze-green-7: 0, 161, 54;
        --coze-green-6: 0, 168, 56;
        --coze-green-5: 0, 178, 60;
        --coze-green-3: 79, 201, 120;
        --coze-green-2: 93, 207, 131;
        --coze-green-1: 105, 209, 140;
        --coze-green-0: 116, 212, 149;
        --coze-orange-5: 199, 66, 0;
        --coze-orange-3: 242, 148, 65;
        --coze-emerald-5: 0, 128, 74;
        --coze-emerald-3: 41, 204, 114;
        --coze-emerald-50: 0, 184, 122;
        --coze-emerald-30: 54, 209, 158;
        --coze-emerald-20: 66, 214, 165;
        --coze-emerald-10: 103, 229, 188;
        --coze-cyan-5: 0, 124, 135;
        --coze-cyan-3: 47, 196, 189;
        --coze-cyan-50: 0, 163, 163;
        --coze-cyan-30: 62, 199, 199;
        --coze-cyan-20: 73, 204, 204;
        --coze-cyan-10: 84, 209, 209;
        --coze-blue-5: 43, 87, 217;
        --coze-blue-3: 120, 170, 250;
        --coze-blue-50: 61, 121, 242;
        --coze-blue-30: 131, 172, 252;
        --coze-blue-20: 141, 178, 252;
        --coze-blue-10: 153, 187, 255;
        --coze-purple-7: 148, 0, 222;
        --coze-purple-6: 157, 0, 235;
        --coze-purple-5: 167, 0, 250;
        --coze-purple-3: 213, 128, 255;
        --coze-purple-2: 218, 145, 255;
        --coze-purple-1: 224, 163, 255;
        --coze-purple-50: 192, 66, 255;
        --coze-purple-30: 217, 143, 255;
        --coze-purple-20: 221, 153, 255;
        --coze-purple-10: 224, 163, 255;
        --coze-magenta-5: 209, 0, 157;
        --coze-magenta-3: 245, 120, 197;
        --coze-magenta-50: 242, 48, 177;
        --coze-magenta-30: 252, 134, 213;
        --coze-magenta-20: 252, 144, 216;
        --coze-magenta-10: 255, 158, 222;
        --coze-alternative-50: 191, 229, 0;
        --coze-alternative-30: 175, 209, 0;
        --coze-1080: 1080px;
        --coze-800: 800px;
        --coze-640: 640px;
        --coze-480: 480px;
        --coze-320: 320px;
        --coze-240: 240px;
        --coze-200: 200px;
        --coze-160: 160px;
        --coze-120: 120px;
        --coze-96: 96px;
        --coze-80: 80px;
        --coze-64: 64px;
        --coze-48: 48px;
        --coze-40: 40px;
        --coze-38: 38px;
        --coze-36: 36px;
        --coze-32: 32px;
        --coze-30: 30px;
        --coze-28: 28px;
        --coze-26: 26px;
        --coze-24: 24px;
        --coze-22: 22px;
        --coze-20: 20px;
        --coze-18: 18px;
        --coze-16: 16px;
        --coze-15: 15px;
        --coze-14: 14px;
        --coze-12: 12px;
        --coze-10: 10px;
        --coze-9: 9px;
        --coze-8: 8px;
        --coze-6: 6px;
        --coze-5: 5px;
        --coze-4: 4px;
        --coze-3: 3px;
        --coze-2: 2px;
        --coze-1: 1px;
        --coze-0-5: .5px;
        --coze-fg-1-alpha: .38;
        --coze-fg-2-alpha: .62;
        --coze-fg-3-alpha: .82;
        --coze-fg-4-alpha: .9;
        --coze-fg-5-alpha: 1;
        --coze-fg-6-alpha: 1;
        --coze-fg-7-alpha: 1;
        --coze-fg-revert-alpha: 1;
        --coze-fg-white-alpha: 1;
        --coze-bg-0-alpha: 1;
        --coze-bg-1-alpha: 1;
        --coze-bg-2-alpha: 1;
        --coze-bg-3-alpha: 1;
        --coze-bg-4-alpha: .04;
        --coze-bg-5-alpha: .08;
        --coze-bg-6-alpha: .13;
        --coze-bg-7-alpha: .19;
        --coze-bg-8-alpha: .25;
        --coze-bg-9-alpha: .16;
        --coze-stroke-5-alpha: .13;
        --coze-stroke-6-alpha: .25;
        --coze-stroke-7-alpha: .38;
        --coze-brand-0-alpha: .23;
        --coze-brand-1-alpha: .3;
        --coze-brand-2-alpha: .38;
        --coze-brand-3-alpha: .45;
        --coze-brand-5-alpha: 1;
        --coze-brand-6-alpha: 1;
        --coze-brand-7-alpha: 1;
        --coze-brand-30-alpha: .45;
        --coze-brand-50-alpha: 1;
        --coze-red-0-alpha: .23;
        --coze-red-1-alpha: .3;
        --coze-red-2-alpha: .38;
        --coze-red-3-alpha: .45;
        --coze-yellow-50-alpha: 1;
        --coze-yellow-30-alpha: .45;
        --coze-yellow-0-alpha: .23;
        --coze-yellow-1-alpha: .3;
        --coze-yellow-2-alpha: .38;
        --coze-yellow-3-alpha: .45;
        --coze-yellow-5-alpha: 1;
        --coze-yellow-6-alpha: 1;
        --coze-yellow-7-alpha: 1;
        --coze-green-0-alpha: .23;
        --coze-green-1-alpha: .3;
        --coze-green-2-alpha: .38;
        --coze-green-3-alpha: .45;
        --coze-green-5-alpha: 1;
        --coze-green-6-alpha: 1;
        --coze-green-7-alpha: 1;
        --coze-orange-5-alpha: 1;
        --coze-orange-3-alpha: .45;
        --coze-emerald-5-alpha: 1;
        --coze-emerald-3-alpha: .45;
        --coze-emerald-50-alpha: 1;
        --coze-emerald-30-alpha: .55;
        --coze-emerald-20-alpha: .45;
        --coze-emerald-10-alpha: .2;
        --coze-cyan-5-alpha: 1;
        --coze-cyan-3-alpha: .45;
        --coze-cyan-50-alpha: 1;
        --coze-cyan-30-alpha: .45;
        --coze-cyan-20-alpha: .38;
        --coze-cyan-10-alpha: .3;
        --coze-blue-5-alpha: 1;
        --coze-blue-3-alpha: .45;
        --coze-blue-50-alpha: 1;
        --coze-blue-30-alpha: .45;
        --coze-blue-20-alpha: .38;
        --coze-blue-10-alpha: .3;
        --coze-purple-7-alpha: 1;
        --coze-purple-6-alpha: 1;
        --coze-purple-5-alpha: 1;
        --coze-purple-3-alpha: .45;
        --coze-purple-2-alpha: .38;
        --coze-purple-1-alpha: .3;
        --coze-purple-50-alpha: 1;
        --coze-purple-30-alpha: .45;
        --coze-purple-20-alpha: .38;
        --coze-purple-10-alpha: .3;
        --coze-magenta-5-alpha: 1;
        --coze-magenta-3-alpha: .45;
        --coze-magenta-50-alpha: 1;
        --coze-magenta-30-alpha: .45;
        --coze-magenta-20-alpha: .38;
        --coze-magenta-10-alpha: .3;
        --coze-alternative-30-alpha: .45;
        --coze-alternative-50-alpha: 1
    }

    .dark {
        --background: 2, 8, 23;
        --foreground: 249, 249, 249;
        --icon: 221, 0%, 90%;
        --icon-dark: 221, 0%, 10%;
        --icon-gray: 221, 0%, 100%;
        --coze-fg-revert: 0, 0, 0;
        --coze-fg-white: 255, 255, 255;
        --coze-fg-7: 255, 255, 255;
        --coze-fg-6: 0, 0, 0;
        --coze-fg-5: 0, 0, 0;
        --coze-fg-4: 255, 255, 255;
        --coze-fg-3: 255, 255, 255;
        --coze-fg-2: 255, 255, 255;
        --coze-fg-1: 255, 255, 255;
        --coze-bg-9: 255, 255, 255;
        --coze-bg-8: 237, 240, 255;
        --coze-bg-7: 237, 240, 255;
        --coze-bg-6: 237, 240, 255;
        --coze-bg-5: 241, 243, 255;
        --coze-bg-4: 241, 243, 255;
        --coze-bg-3: 39, 43, 58;
        --coze-bg-2: 28, 32, 48;
        --coze-bg-1: 24, 28, 43;
        --coze-bg-0: 20, 24, 37;
        --coze-stroke-5: 153, 182, 255;
        --coze-stroke-6: 153, 182, 255;
        --coze-stroke-7: 233, 237, 255;
        --coze-stroke-opaque: 41, 45, 60;
        --coze-mask-5: 0, 0, 0;
        --coze-shadow-0: 0, 0, 0;
        --coze-brand-50: 85, 91, 255;
        --coze-brand-30: 66, 88, 255;
        --coze-brand-7: 194, 194, 255;
        --coze-brand-6: 184, 184, 255;
        --coze-brand-5: 166, 166, 255;
        --coze-brand-3: 94, 94, 255;
        --coze-brand-2: 89, 89, 255;
        --coze-brand-1: 76, 76, 255;
        --coze-brand-0: 76, 76, 255;
        --coze-red-7: 255, 97, 110;
        --coze-red-6: 255, 82, 96;
        --coze-red-5: 255, 38, 56;
        --coze-red-3: 245, 37, 54;
        --coze-red-2: 245, 37, 54;
        --coze-red-1: 242, 36, 53;
        --coze-yellow-50: 255, 191, 0;
        --coze-yellow-30: 156, 117, 0;
        --coze-yellow-7: 255, 161, 84;
        --coze-yellow-6: 255, 148, 61;
        --coze-yellow-5: 255, 122, 13;
        --coze-yellow-3: 194, 88, 2;
        --coze-yellow-2: 191, 87, 2;
        --coze-yellow-1: 178, 80, 0;
        --coze-green-7: 0, 219, 69;
        --coze-green-6: 0, 209, 66;
        --coze-green-5: 0, 191, 64;
        --coze-green-3: 0, 133, 53;
        --coze-green-2: 0, 128, 51;
        --coze-green-1: 0, 122, 41;
        --coze-orange-5: 251, 173, 115;
        --coze-orange-3: 199, 93, 18;
        --coze-emerald-5: 48, 242, 161;
        --coze-emerald-3: 6, 140, 102;
        --coze-emerald-50: 0, 191, 128;
        --coze-emerald-30: 0, 133, 88;
        --coze-emerald-20: 0, 128, 85;
        --coze-emerald-10: 0, 115, 76;
        --coze-cyan-5: 57, 215, 229;
        --coze-cyan-3: 8, 130, 163;
        --coze-cyan-50: 0, 170, 204;
        --coze-cyan-30: 0, 125, 150;
        --coze-cyan-20: 0, 121, 145;
        --coze-cyan-10: 0, 110, 133;
        --coze-blue-5: 120, 176, 255;
        --coze-blue-3: 60, 111, 229;
        --coze-blue-50: 64, 128, 255;
        --coze-blue-30: 23, 100, 255;
        --coze-blue-20: 18, 97, 255;
        --coze-blue-10: 8, 91, 255;
        --coze-purple-7: 233, 189, 255;
        --coze-purple-6: 229, 176, 255;
        --coze-purple-5: 221, 153, 255;
        --coze-purple-3: 189, 56, 255;
        --coze-purple-2: 187, 51, 255;
        --coze-purple-1: 181, 33, 255;
        --coze-purple-50: 202, 97, 255;
        --coze-purple-30: 185, 46, 255;
        --coze-purple-20: 184, 41, 255;
        --coze-purple-10: 180, 31, 255;
        --coze-magenta-5: 255, 148, 210;
        --coze-magenta-3: 250, 30, 188;
        --coze-magenta-50: 255, 77, 195;
        --coze-magenta-30: 255, 15, 175;
        --coze-magenta-20: 255, 10, 173;
        --coze-magenta-10: 255, 0, 169;
        --coze-alternative-50: 202, 242, 0;
        --coze-alternative-30: 111, 133, 0;
        --coze-fg-1-alpha: .22;
        --coze-fg-2-alpha: .39;
        --coze-fg-3-alpha: .79;
        --coze-fg-4-alpha: 1;
        --coze-fg-5-alpha: 1;
        --coze-fg-6-alpha: .22;
        --coze-fg-7-alpha: 1;
        --coze-fg-revert-alpha: 1;
        --coze-fg-white-alpha: .22;
        --coze-bg-0-alpha: 1;
        --coze-bg-1-alpha: 1;
        --coze-bg-2-alpha: 1;
        --coze-bg-3-alpha: 1;
        --coze-bg-4-alpha: .02;
        --coze-bg-5-alpha: .05;
        --coze-bg-6-alpha: .08;
        --coze-bg-7-alpha: .11;
        --coze-bg-8-alpha: .14;
        --coze-bg-9-alpha: .17;
        --coze-stroke-5-alpha: .12;
        --coze-stroke-6-alpha: .17;
        --coze-stroke-7-alpha: .21;
        --coze-brand-0-alpha: .2;
        --coze-brand-1-alpha: .2;
        --coze-brand-2-alpha: .32;
        --coze-brand-3-alpha: .37;
        --coze-brand-30-alpha: .41;
        --coze-brand-50-alpha: 1;
        --coze-red-1-alpha: .2;
        --coze-red-2-alpha: .33;
        --coze-red-3-alpha: .39;
        --coze-yellow-50-alpha: 1;
        --coze-yellow-30-alpha: .36;
        --coze-yellow-1-alpha: .2;
        --coze-yellow-2-alpha: .32;
        --coze-yellow-3-alpha: .37;
        --coze-green-1-alpha: .2;
        --coze-green-2-alpha: .34;
        --coze-green-3-alpha: .39;
        --coze-orange-3-alpha: .36;
        --coze-orange-5-alpha: .36;
        --coze-emerald-5-alpha: 1;
        --coze-emerald-3-alpha: .35;
        --coze-emerald-50-alpha: 1;
        --coze-emerald-30-alpha: .38;
        --coze-emerald-20-alpha: .33;
        --coze-emerald-10-alpha: .2;
        --coze-cyan-5-alpha: 1;
        --coze-cyan-3-alpha: .36;
        --coze-cyan-50-alpha: 1;
        --coze-cyan-30-alpha: .39;
        --coze-cyan-20-alpha: .33;
        --coze-cyan-10-alpha: .2;
        --coze-blue-5-alpha: 1;
        --coze-blue-3-alpha: .37;
        --coze-blue-50-alpha: 1;
        --coze-blue-30-alpha: .4;
        --coze-blue-20-alpha: .34;
        --coze-blue-10-alpha: .2;
        --coze-purple-7-alpha: 1;
        --coze-purple-6-alpha: 1;
        --coze-purple-5-alpha: 1;
        --coze-purple-3-alpha: .36;
        --coze-purple-2-alpha: .31;
        --coze-purple-1-alpha: .2;
        --coze-purple-50-alpha: 1;
        --coze-purple-30-alpha: .38;
        --coze-purple-20-alpha: .33;
        --coze-purple-10-alpha: .2;
        --coze-magenta-5-alpha: 1;
        --coze-magenta-3-alpha: .35;
        --coze-magenta-50-alpha: 1;
        --coze-magenta-30-alpha: .36;
        --coze-magenta-20-alpha: .31;
        --coze-magenta-10-alpha: .2;
        --coze-alternative-30-alpha: .34
    }

    :root {
        --coz-fg-hglt-plus: rgba(var(--coze-fg-5), var(--coze-fg-5-alpha));
        --coz-fg-hglt-plus-dim: rgba(var(--coze-fg-5), var(--coze-fg-5-alpha));
        --coz-fg-hglt: rgba(var(--coze-brand-5), 1);
        --coz-fg-hglt-dim: rgba(var(--coze-brand-3), var(--coze-brand-3-alpha));
        --coz-fg-plus: rgba(var(--coze-fg-4), var(--coze-fg-4-alpha));
        --coz-fg: rgba(var(--coze-fg-3), var(--coze-fg-3-alpha));
        --coz-fg-primary: rgba(var(--coze-fg-3), var(--coze-fg-3-alpha));
        --coz-fg-secondary: rgba(var(--coze-fg-2), var(--coze-fg-2-alpha));
        --coz-fg-dim: rgba(var(--coze-fg-1), var(--coze-fg-1-alpha));
        --coz-fg-white: rgba(var(--coze-fg-7), 1);
        --coz-fg-white-dim: rgba(var(--coze-fg-white), var(--coze-fg-white-alpha));
        --coz-fg-hglt-ai: rgba(var(--coze-purple-5), 1);
        --coz-fg-hglt-ai-dim: rgba(var(--coze-purple-3), var(--coze-purple-3-alpha));
        --coz-fg-hglt-red: rgba(var(--coze-red-5), 1);
        --coz-fg-hglt-red-dim: rgba(var(--coze-red-3), var(--coze-red-3-alpha));
        --coz-fg-hglt-yellow: rgba(var(--coze-yellow-5), 1);
        --coz-fg-hglt-yellow-dim: rgba(var(--coze-yellow-3), var(--coze-yellow-3-alpha));
        --coz-fg-hglt-green: rgba(var(--coze-green-5), 1);
        --coz-fg-hglt-green-dim: rgba(var(--coze-green-3), var(--coze-green-3-alpha));
        --coz-fg-color-orange: rgba(var(--coze-yellow-5), 1);
        --coz-fg-color-orange-dim: rgba(var(--coze-yellow-3), var(--coze-yellow-3-alpha));
        --coz-fg-color-emerald: rgba(var(--coze-green-5), 1);
        --coz-fg-color-emerald-dim: rgba(var(--coze-green-3), var(--coze-green-3-alpha));
        --coz-fg-color-cyan: rgba(var(--coze-cyan-50), var(--coze-cyan-50-alpha));
        --coz-fg-color-cyan-dim: rgba(var(--coze-cyan-30), var(--coze-cyan-30-alpha));
        --coz-fg-color-blue: rgba(var(--coze-blue-50), var(--coze-blue-50-alpha));
        --coz-fg-color-blue-dim: rgba(var(--coze-blue-30), var(--coze-blue-30-alpha));
        --coz-fg-color-purple: rgba(var(--coze-purple-50), var(--coze-purple-50-alpha));
        --coz-fg-color-purple-dim: rgba(var(--coze-purple-30), var(--coze-purple-30-alpha));
        --coz-fg-color-magenta: rgba(var(--coze-magenta-50), var(--coze-magenta-50-alpha));
        --coz-fg-color-magenta-dim: rgba(var(--coze-magenta-3), var(--coze-magenta-3-alpha));
        --coz-fg-color-yellow: rgba(var(--coze-yellow-50), var(--coze-yellow-50-alpha));
        --coz-fg-color-yellow-dim: rgba(var(--coze-yellow-30), var(--coze-yellow-30-alpha));
        --coz-fg-hglt-orange: rgba(var(--coze-orange-5), 1);
        --coz-fg-hglt-orange-dim: rgba(var(--coze-orange-3), var(--coze-orange-3-alpha));
        --coz-fg-hglt-emerald: rgba(var(--coze-emerald-5), 1);
        --coz-fg-hglt-emerald-dim: rgba(var(--coze-emerald-3), var(--coze-emerald-3-alpha));
        --coz-fg-hglt-cyan: rgba(var(--coze-cyan-5), 1);
        --coz-fg-hglt-cyan-dim: rgba(var(--coze-cyan-3), var(--coze-cyan-3-alpha));
        --coz-fg-hglt-blue: rgba(var(--coze-blue-5), var(--coze-blue-5-alpha));
        --coz-fg-hglt-blue-dim: rgba(var(--coze-blue-3), var(--coze-blue-3-alpha));
        --coz-fg-hglt-purple: rgba(var(--coze-purple-5), 1);
        --coz-fg-hglt-purple-dim: rgba(var(--coze-purple-3), var(--coze-purple-3-alpha));
        --coz-fg-hglt-magenta: rgba(var(--coze-magenta-5), 1);
        --coz-fg-hglt-magenta-dim: rgba(var(--coze-magenta-3), var(--coze-magenta-3-alpha));
        --coz-fg-color-brand: rgba(var(--coze-brand-50), var(--coze-brand-50-alpha));
        --coz-fg-color-brand-dim: rgba(var(--coze-brand-30), var(--coze-brand-30-alpha));
        --coz-fg-color-alternative: rgba(var(--coze-alternative-50), 1);
        --coz-fg-color-alternative-dim: rgba(var(--coze-alternative-30), var(--coze-alternative-30-alpha));
        --coz-mg-hglt-plus-pressed: rgba(var(--coze-brand-7), 1);
        --coz-mg-hglt-plus-hovered: rgba(var(--coze-brand-6), 1);
        --coz-mg-hglt-plus: rgba(var(--coze-brand-5), 1);
        --coz-mg-hglt-plus-dim: rgba(var(--coze-brand-3), var(--coze-brand-3-alpha));
        --coz-mg-hglt-secondary-pressed: rgba(var(--coze-brand-2), var(--coze-brand-2-alpha));
        --coz-mg-hglt-secondary-hovered: rgba(var(--coze-brand-1), var(--coze-brand-1-alpha));
        --coz-mg-hglt-secondary: rgba(var(--coze-brand-0), var(--coze-brand-0-alpha));
        --coz-mg-hglt-secondary-red: rgba(var(--coze-red-0), var(--coze-red-0-alpha));
        --coz-mg-hglt-secondary-yellow: rgba(var(--coze-yellow-0), var(--coze-yellow-0-alpha));
        --coz-mg-hglt-secondary-green: rgba(var(--coze-green-0), var(--coze-green-0-alpha));
        --coz-mg-plus-pressed: rgba(var(--coze-bg-8), var(--coze-bg-8-alpha));
        --coz-mg-plus-hovered: rgba(var(--coze-bg-7), var(--coze-bg-7-alpha));
        --coz-mg-plus: rgba(var(--coze-bg-6), var(--coze-bg-6-alpha));
        --coz-mg-hglt-pressed: rgba(var(--coze-brand-3), var(--coze-brand-3-alpha));
        --coz-mg-hglt-hovered: rgba(var(--coze-brand-2), var(--coze-brand-2-alpha));
        --coz-mg-hglt-plus-ai-pressed: rgba(var(--coze-purple-7), 1);
        --coz-mg-hglt-plus-ai-hovered: rgba(var(--coze-purple-6), 1);
        --coz-mg-hglt-plus-ai: rgba(var(--coze-purple-5), 1);
        --coz-mg-hglt-plus-ai-dim: rgba(var(--coze-purple-3), var(--coze-purple-3-alpha));
        --coz-mg-hglt: rgba(var(--coze-brand-1), var(--coze-brand-1-alpha));
        --coz-mg-hglt-ai-pressed: rgba(var(--coze-purple-3), var(--coze-purple-3-alpha));
        --coz-mg-hglt-ai-hovered: rgba(var(--coze-purple-2), var(--coze-purple-2-alpha));
        --coz-mg-hglt-ai: rgba(var(--coze-purple-1), var(--coze-purple-1-alpha));
        --coz-mg-hglt-plus-red-pressed: rgba(var(--coze-red-7), 1);
        --coz-mg-hglt-plus-red-hovered: rgba(var(--coze-red-6), 1);
        --coz-mg-hglt-plus-red: rgba(var(--coze-red-5), 1);
        --coz-mg-hglt-plus-red-dim: rgba(var(--coze-red-3), var(--coze-red-3-alpha));
        --coz-mg-hglt-plus-yellow-pressed: rgba(var(--coze-yellow-7), 1);
        --coz-mg-hglt-plus-yellow-hovered: rgba(var(--coze-yellow-6), 1);
        --coz-mg-hglt-plus-yellow: rgba(var(--coze-yellow-5), 1);
        --coz-mg-hglt-plus-yellow-dim: rgba(var(--coze-yellow-3), var(--coze-yellow-3-alpha));
        --coz-mg-hglt-plus-green-pressed: rgba(var(--coze-green-7), 1);
        --coz-mg-hglt-plus-green-hovered: rgba(var(--coze-green-6), 1);
        --coz-mg-hglt-plus-green: rgba(var(--coze-green-5), 1);
        --coz-mg-hglt-plus-green-dim: rgba(var(--coze-green-3), var(--coze-green-3-alpha));
        --coz-mg-hglt-red-pressed: rgba(var(--coze-red-3), var(--coze-red-3-alpha));
        --coz-mg-hglt-red-hovered: rgba(var(--coze-red-2), var(--coze-red-2-alpha));
        --coz-mg-hglt-red: rgba(var(--coze-red-1), var(--coze-red-1-alpha));
        --coz-mg-hglt-yellow-pressed: rgba(var(--coze-yellow-3), var(--coze-yellow-3-alpha));
        --coz-mg-hglt-yellow-hovered: rgba(var(--coze-yellow-2), var(--coze-yellow-2-alpha));
        --coz-mg-hglt-yellow: rgba(var(--coze-yellow-1), var(--coze-yellow-1-alpha));
        --coz-mg-hglt-green-pressed: rgba(var(--coze-green-3), var(--coze-green-3-alpha));
        --coz-mg-hglt-green-hovered: rgba(var(--coze-green-2), var(--coze-green-2-alpha));
        --coz-mg-hglt-green: rgba(var(--coze-green-1), var(--coze-green-1-alpha));
        --coz-mg-color-plus-orange: rgba(var(--coze-yellow-5), 1);
        --coz-mg-color-plus-emerald: rgba(var(--coze-green-5), 1);
        --coz-mg-color-plus-cyan: rgba(var(--coze-cyan-50), var(--coze-cyan-50-alpha));
        --coz-mg-color-plus-blue: rgba(var(--coze-blue-50), var(--coze-blue-50-alpha));
        --coz-mg-color-plus-purple: rgba(var(--coze-purple-50), var(--coze-purple-50-alpha));
        --coz-mg-color-plus-magenta: rgba(var(--coze-magenta-50), var(--coze-magenta-50-alpha));
        --coz-mg-color-plus-yellow: rgba(var(--coze-yellow-50), var(--coze-yellow-50-alpha));
        --coz-mg-color-orange-pressed: rgba(var(--coze-yellow-3), var(--coze-yellow-3-alpha));
        --coz-mg-color-orange-hovered: rgba(var(--coze-yellow-2), var(--coze-yellow-2-alpha));
        --coz-mg-color-orange: rgba(var(--coze-yellow-1), var(--coze-yellow-1-alpha));
        --coz-mg-color-emerald-pressed: rgba(var(--coze-green-3), var(--coze-green-3-alpha));
        --coz-mg-color-emerald-hovered: rgba(var(--coze-green-2), var(--coze-green-2-alpha));
        --coz-mg-color-emerald: rgba(var(--coze-green-1), var(--coze-green-1-alpha));
        --coz-mg-color-cyan-pressed: rgba(var(--coze-cyan-30), var(--coze-cyan-30-alpha));
        --coz-mg-color-cyan-hovered: rgba(var(--coze-cyan-20), var(--coze-cyan-20-alpha));
        --coz-mg-color-cyan: rgba(var(--coze-cyan-10), var(--coze-cyan-10-alpha));
        --coz-mg-color-blue-pressed: rgba(var(--coze-blue-30), var(--coze-blue-30-alpha));
        --coz-mg-color-blue-hovered: rgba(var(--coze-blue-20), var(--coze-blue-20-alpha));
        --coz-mg-color-blue: rgba(var(--coze-blue-10), var(--coze-blue-10-alpha));
        --coz-mg-color-purple-pressed: rgba(var(--coze-purple-30), var(--coze-purple-30-alpha));
        --coz-mg-color-purple-hovered: rgba(var(--coze-purple-20), var(--coze-purple-20-alpha));
        --coz-mg-color-purple: rgba(var(--coze-purple-10), var(--coze-purple-10-alpha));
        --coz-mg-color-magenta-pressed: rgba(var(--coze-magenta-30), var(--coze-magenta-30-alpha));
        --coz-mg-color-magenta-hovered: rgba(var(--coze-magenta-20), var(--coze-magenta-20-alpha));
        --coz-mg-color-magenta: rgba(var(--coze-magenta-10), var(--coze-magenta-10-alpha));
        --coz-mg-primary-pressed: rgba(var(--coze-bg-7), var(--coze-bg-7-alpha));
        --coz-mg-primary-hovered: rgba(var(--coze-bg-6), var(--coze-bg-6-alpha));
        --coz-mg-primary: rgba(var(--coze-bg-5), var(--coze-bg-5-alpha));
        --coz-mg-secondary-pressed: rgba(var(--coze-bg-6), var(--coze-bg-6-alpha));
        --coz-mg-secondary-hovered: rgba(var(--coze-bg-5), var(--coze-bg-5-alpha));
        --coz-mg-secondary: rgba(var(--coze-bg-4), var(--coze-bg-4-alpha));
        --coz-mg: rgba(var(--coze-bg-4), var(--coze-bg-4-alpha));
        --coz-mg-mask: rgba(var(--coze-mask-5), .4);
        --coz-mg-table-fixed-hovered: rgba(var(--coze-bg-0), 1);
        --coz-mg-card-pressed: rgba(var(--coze-bg-3), var(--coze-bg-3-alpha));
        --coz-mg-card-hovered: rgba(var(--coze-bg-3), var(--coze-bg-3-alpha));
        --coz-mg-card: rgba(var(--coze-bg-3), var(--coze-bg-3-alpha));
        --coz-mg-color-plus-brand: rgba(var(--coze-brand-50), var(--coze-brand-50-alpha));
        --coz-bg-max: rgba(var(--coze-bg-3), var(--coze-bg-3-alpha));
        --coz-bg-plus: rgba(var(--coze-bg-2), var(--coze-bg-2-alpha));
        --coz-bg-primary: rgba(var(--coze-bg-1), var(--coze-bg-1-alpha));
        --coz-bg: rgba(var(--coze-bg-1), var(--coze-bg-1-alpha));
        --coz-bg-secondary: rgba(var(--coze-bg-0), 1);
        --coz-stroke-hglt: rgba(var(--coze-brand-5), 1);
        --coz-stroke-plus: rgba(var(--coze-stroke-6), var(--coze-stroke-6-alpha));
        --coz-stroke-primary: rgba(var(--coze-stroke-5), var(--coze-stroke-5-alpha));
        --coz-stroke-hglt-red: rgba(var(--coze-red-5), 1);
        --coz-stroke-hglt-yellow: rgba(var(--coze-yellow-5), 1);
        --coz-stroke-hglt-green: rgba(var(--coze-green-5), 1);
        --coz-stroke-color-orange: rgba(var(--coze-yellow-5), 1);
        --coz-stroke-color-emerald: rgba(var(--coze-green-5), 1);
        --coz-stroke-color-cyan: rgba(var(--coze-cyan-50), var(--coze-cyan-50-alpha));
        --coz-stroke-color-blue: rgba(var(--coze-blue-50), var(--coze-blue-50-alpha));
        --coz-stroke-color-purple: rgba(var(--coze-purple-50), var(--coze-purple-50-alpha));
        --coz-stroke-color-magenta: rgba(var(--coze-magenta-50), var(--coze-magenta-50-alpha));
        --coz-stroke-color-yellow: rgba(var(--coze-yellow-50), var(--coze-yellow-50-alpha));
        --coz-stroke-color-brand: rgba(var(--coze-brand-50), var(--coze-brand-50-alpha));
        --coz-stroke-opaque: rgb(var(--coze-stroke-opaque));
        --coz-stroke-max: rgba(var(--coze-stroke-7), var(--coze-stroke-7-alpha));
        --coz-shadow: 0 4px 12px 0px rgba(var(--coze-shadow-0), .08), 0px 8px 24px 0px rgba(var(--coze-shadow-0), .04);
        --coz-shadow-large: 0px 8px 24px 0px rgba(var(--coze-shadow-0), .16), 0px 16px 48px 0px rgba(var(--coze-shadow-0), .08);
        --coz-shadow-default: 0 4px 12px 0px rgba(var(--coze-shadow-0), .08), 0px 8px 24px 0px rgba(var(--coze-shadow-0), .04);
        --coz-shadow-small: 0px 2px 6px 0px rgba(var(--coze-shadow-0), .04), 0px 4px 12px 0px rgba(var(--coze-shadow-0), .02);
        --coz-btn-rounded-large: var(--coze-10);
        --coz-btn-rounded-normal: var(--coze-8);
        --coz-btn-rounded-small: var(--coze-5);
        --coz-btn-rounded-mini: var(--coze-4);
        --coz-input-rounded-large: var(--coze-10);
        --coz-input-rounded-normal: var(--coze-8);
        --coz-input-rounded-small: var(--coze-6);
        --coz-input-height-large: var(--coze-40);
        --coz-input-height-normal: var(--coze-32);
        --coz-input-height-small: var(--coze-24)
    }
}

@layer components;

@layer utilities {
    .visible {
        visibility: visible
    }

    .absolute {
        position: absolute
    }

    .fixed {
        position: fixed
    }

    .relative {
        position: relative
    }

    .static {
        position: static
    }

    .top-0 {
        top: calc(var(--coze-8)*0)
    }

    .left-0 {
        left: calc(var(--coze-8)*0)
    }

    .z-10 {
        z-index: 10
    }

    .mb-\[12px\] {
        margin-bottom: 12px
    }

    .block {
        display: block
    }

    .contents {
        display: contents
    }

    .flex {
        display: flex
    }

    .grid {
        display: grid
    }

    .inline-flex {
        display: inline-flex
    }

    .\!h-\[30px\] {
        height: 30px !important
    }

    .coz-input-height-large {
        height: var(--coze-40);
        height: var(--coze-40)
    }

    .coz-input-height-normal {
        height: var(--coze-32);
        height: var(--coze-32)
    }

    .coz-input-height-small {
        height: var(--coze-24);
        height: var(--coze-24)
    }

    .h-\[3px\] {
        height: 3px
    }

    .h-\[16px\] {
        height: 16px
    }

    .h-\[174px\] {
        height: 174px
    }

    .h-full {
        height: 100%
    }

    .h-screen {
        height: 100vh
    }

    .max-h-\[60\%\] {
        max-height: 60%
    }

    .\!w-\[30px\] {
        width: 30px !important
    }

    .w-\[16px\] {
        width: 16px
    }

    .w-\[240px\] {
        width: 240px
    }

    .w-fit {
        width: -moz-fit-content;
        width: fit-content
    }

    .w-full {
        width: 100%
    }

    .w-screen {
        width: 100vw
    }

    .min-w-\[8px\] {
        min-width: 8px
    }

    .flex-1 {
        flex: 1
    }

    .flex-shrink-0,
    .shrink-0 {
        flex-shrink: 0
    }

    .flex-grow-0 {
        flex-grow: 0
    }

    .transform {
        transform: var(--tw-rotate-x, )var(--tw-rotate-y, )var(--tw-rotate-z, )var(--tw-skew-x, )var(--tw-skew-y, )
    }

    .cursor-pointer {
        cursor: pointer
    }

    .resize {
        resize: both
    }

    .grid-cols-1 {
        grid-template-columns: repeat(1, minmax(0, 1fr))
    }

    .flex-col {
        flex-direction: column
    }

    .flex-col-reverse {
        flex-direction: column-reverse
    }

    .items-center {
        align-items: center
    }

    .items-stretch {
        align-items: stretch
    }

    .justify-between {
        justify-content: space-between
    }

    .justify-center {
        justify-content: center
    }

    .justify-items-center {
        justify-items: center
    }

    .gap-\[8px\] {
        gap: 8px
    }

    .overflow-hidden {
        overflow: hidden
    }

    .overflow-y-auto {
        overflow-y: auto
    }

    .overflow-y-hidden {
        overflow-y: hidden
    }

    .coz-btn-rounded-large {
        border-radius: var(--coze-10);
        border-radius: var(--coze-10)
    }

    .coz-btn-rounded-mini {
        border-radius: var(--coze-4);
        border-radius: var(--coze-4)
    }

    .coz-btn-rounded-normal {
        border-radius: var(--coze-8);
        border-radius: var(--coze-8)
    }

    .coz-btn-rounded-small {
        border-radius: var(--coze-5);
        border-radius: var(--coze-5)
    }

    .coz-input-rounded-large {
        border-radius: var(--coze-10);
        border-radius: var(--coze-10)
    }

    .coz-input-rounded-normal {
        border-radius: var(--coze-8);
        border-radius: var(--coze-8)
    }

    .coz-input-rounded-small {
        border-radius: var(--coze-6);
        border-radius: var(--coze-6)
    }

    .rounded {
        border-radius: var(--coze-8)
    }

    .rounded-\[1px\] {
        border-radius: 1px
    }

    .rounded-normal {
        border-radius: var(--coze-8)
    }

    .border {
        border-style: var(--tw-border-style);
        border-width: 1px
    }

    .border-0 {
        border-style: var(--tw-border-style);
        border-width: 0
    }

    .border-r-\[1px\] {
        border-right-style: var(--tw-border-style);
        border-right-width: 1px
    }

    .border-solid {
        --tw-border-style: solid;
        border-style: solid
    }

    .coz-stroke-color-blue {
        border-color: rgba(var(--coze-blue-50), var(--coze-blue-50-alpha));
        border-color: rgba(var(--coze-blue-50), var(--coze-blue-50-alpha))
    }

    .coz-stroke-color-brand {
        border-color: rgba(var(--coze-brand-50), var(--coze-brand-50-alpha));
        border-color: rgba(var(--coze-brand-50), var(--coze-brand-50-alpha))
    }

    .coz-stroke-color-cyan {
        border-color: rgba(var(--coze-cyan-50), var(--coze-cyan-50-alpha));
        border-color: rgba(var(--coze-cyan-50), var(--coze-cyan-50-alpha))
    }

    .coz-stroke-color-emerald {
        border-color: rgba(var(--coze-green-5), 1);
        border-color: rgba(var(--coze-green-5), 1)
    }

    .coz-stroke-color-magenta {
        border-color: rgba(var(--coze-magenta-50), var(--coze-magenta-50-alpha));
        border-color: rgba(var(--coze-magenta-50), var(--coze-magenta-50-alpha))
    }

    .coz-stroke-color-orange {
        border-color: rgba(var(--coze-yellow-5), 1);
        border-color: rgba(var(--coze-yellow-5), 1)
    }

    .coz-stroke-color-purple {
        border-color: rgba(var(--coze-purple-50), var(--coze-purple-50-alpha));
        border-color: rgba(var(--coze-purple-50), var(--coze-purple-50-alpha))
    }

    .coz-stroke-color-yellow {
        border-color: rgba(var(--coze-yellow-50), var(--coze-yellow-50-alpha));
        border-color: rgba(var(--coze-yellow-50), var(--coze-yellow-50-alpha))
    }

    .coz-stroke-hglt {
        border-color: rgba(var(--coze-brand-5), 1);
        border-color: rgba(var(--coze-brand-5), 1)
    }

    .coz-stroke-hglt-green {
        border-color: rgba(var(--coze-green-5), 1);
        border-color: rgba(var(--coze-green-5), 1)
    }

    .coz-stroke-hglt-red {
        border-color: rgba(var(--coze-red-5), 1);
        border-color: rgba(var(--coze-red-5), 1)
    }

    .coz-stroke-hglt-yellow {
        border-color: rgba(var(--coze-yellow-5), 1);
        border-color: rgba(var(--coze-yellow-5), 1)
    }

    .coz-stroke-max {
        border-color: rgba(var(--coze-stroke-7), var(--coze-stroke-7-alpha));
        border-color: rgba(var(--coze-stroke-7), var(--coze-stroke-7-alpha))
    }

    .coz-stroke-opaque {
        border-color: rgb(var(--coze-stroke-opaque));
        border-color: rgb(var(--coze-stroke-opaque))
    }

    .coz-stroke-plus {
        border-color: rgba(var(--coze-stroke-6), var(--coze-stroke-6-alpha));
        border-color: rgba(var(--coze-stroke-6), var(--coze-stroke-6-alpha))
    }

    .coz-stroke-primary {
        border-color: rgba(var(--coze-stroke-5), var(--coze-stroke-5-alpha));
        border-color: rgba(var(--coze-stroke-5), var(--coze-stroke-5-alpha))
    }

    .\!coz-bg-plus {
        background-color: rgba(var(--coze-bg-2), var(--coze-bg-2-alpha)) !important;
        background-color: rgba(var(--coze-bg-2), var(--coze-bg-2-alpha)) !important
    }

    .bg-\[\#F7F7FCE5\] {
        background-color: rgba(247, 247, 252, .898)
    }

    .coz-bg {
        background-color: rgba(var(--coze-bg-1), var(--coze-bg-1-alpha));
        background-color: rgba(var(--coze-bg-1), var(--coze-bg-1-alpha))
    }

    .coz-bg-max {
        background-color: rgba(var(--coze-bg-3), var(--coze-bg-3-alpha));
        background-color: rgba(var(--coze-bg-3), var(--coze-bg-3-alpha))
    }

    .coz-bg-plus {
        background-color: rgba(var(--coze-bg-2), var(--coze-bg-2-alpha));
        background-color: rgba(var(--coze-bg-2), var(--coze-bg-2-alpha))
    }

    .coz-bg-primary {
        background-color: rgba(var(--coze-bg-1), var(--coze-bg-1-alpha));
        background-color: rgba(var(--coze-bg-1), var(--coze-bg-1-alpha))
    }

    .coz-bg-secondary {
        background-color: rgba(var(--coze-bg-0), 1);
        background-color: rgba(var(--coze-bg-0), 1)
    }

    .coz-mg {
        background-color: rgba(var(--coze-bg-4), var(--coze-bg-4-alpha));
        background-color: rgba(var(--coze-bg-4), var(--coze-bg-4-alpha))
    }

    .coz-mg-card,
    .coz-mg-card-hovered,
    .coz-mg-card-pressed {
        background-color: rgba(var(--coze-bg-3), var(--coze-bg-3-alpha));
        background-color: rgba(var(--coze-bg-3), var(--coze-bg-3-alpha))
    }

    .coz-mg-color-blue {
        background-color: rgba(var(--coze-blue-10), var(--coze-blue-10-alpha));
        background-color: rgba(var(--coze-blue-10), var(--coze-blue-10-alpha))
    }

    .coz-mg-color-blue-hovered {
        background-color: rgba(var(--coze-blue-20), var(--coze-blue-20-alpha));
        background-color: rgba(var(--coze-blue-20), var(--coze-blue-20-alpha))
    }

    .coz-mg-color-blue-pressed {
        background-color: rgba(var(--coze-blue-30), var(--coze-blue-30-alpha));
        background-color: rgba(var(--coze-blue-30), var(--coze-blue-30-alpha))
    }

    .coz-mg-color-cyan {
        background-color: rgba(var(--coze-cyan-10), var(--coze-cyan-10-alpha));
        background-color: rgba(var(--coze-cyan-10), var(--coze-cyan-10-alpha))
    }

    .coz-mg-color-cyan-hovered {
        background-color: rgba(var(--coze-cyan-20), var(--coze-cyan-20-alpha));
        background-color: rgba(var(--coze-cyan-20), var(--coze-cyan-20-alpha))
    }

    .coz-mg-color-cyan-pressed {
        background-color: rgba(var(--coze-cyan-30), var(--coze-cyan-30-alpha));
        background-color: rgba(var(--coze-cyan-30), var(--coze-cyan-30-alpha))
    }

    .coz-mg-color-emerald {
        background-color: rgba(var(--coze-green-1), var(--coze-green-1-alpha));
        background-color: rgba(var(--coze-green-1), var(--coze-green-1-alpha))
    }

    .coz-mg-color-emerald-hovered {
        background-color: rgba(var(--coze-green-2), var(--coze-green-2-alpha));
        background-color: rgba(var(--coze-green-2), var(--coze-green-2-alpha))
    }

    .coz-mg-color-emerald-pressed {
        background-color: rgba(var(--coze-green-3), var(--coze-green-3-alpha));
        background-color: rgba(var(--coze-green-3), var(--coze-green-3-alpha))
    }

    .coz-mg-color-magenta {
        background-color: rgba(var(--coze-magenta-10), var(--coze-magenta-10-alpha));
        background-color: rgba(var(--coze-magenta-10), var(--coze-magenta-10-alpha))
    }

    .coz-mg-color-magenta-hovered {
        background-color: rgba(var(--coze-magenta-20), var(--coze-magenta-20-alpha));
        background-color: rgba(var(--coze-magenta-20), var(--coze-magenta-20-alpha))
    }

    .coz-mg-color-magenta-pressed {
        background-color: rgba(var(--coze-magenta-30), var(--coze-magenta-30-alpha));
        background-color: rgba(var(--coze-magenta-30), var(--coze-magenta-30-alpha))
    }

    .coz-mg-color-orange {
        background-color: rgba(var(--coze-yellow-1), var(--coze-yellow-1-alpha));
        background-color: rgba(var(--coze-yellow-1), var(--coze-yellow-1-alpha))
    }

    .coz-mg-color-orange-hovered {
        background-color: rgba(var(--coze-yellow-2), var(--coze-yellow-2-alpha));
        background-color: rgba(var(--coze-yellow-2), var(--coze-yellow-2-alpha))
    }

    .coz-mg-color-orange-pressed {
        background-color: rgba(var(--coze-yellow-3), var(--coze-yellow-3-alpha));
        background-color: rgba(var(--coze-yellow-3), var(--coze-yellow-3-alpha))
    }

    .coz-mg-color-plus-blue {
        background-color: rgba(var(--coze-blue-50), var(--coze-blue-50-alpha));
        background-color: rgba(var(--coze-blue-50), var(--coze-blue-50-alpha))
    }

    .coz-mg-color-plus-brand {
        background-color: rgba(var(--coze-brand-50), var(--coze-brand-50-alpha));
        background-color: rgba(var(--coze-brand-50), var(--coze-brand-50-alpha))
    }

    .coz-mg-color-plus-cyan {
        background-color: rgba(var(--coze-cyan-50), var(--coze-cyan-50-alpha));
        background-color: rgba(var(--coze-cyan-50), var(--coze-cyan-50-alpha))
    }

    .coz-mg-color-plus-emerald {
        background-color: rgba(var(--coze-green-5), 1);
        background-color: rgba(var(--coze-green-5), 1)
    }

    .coz-mg-color-plus-magenta {
        background-color: rgba(var(--coze-magenta-50), var(--coze-magenta-50-alpha));
        background-color: rgba(var(--coze-magenta-50), var(--coze-magenta-50-alpha))
    }

    .coz-mg-color-plus-orange {
        background-color: rgba(var(--coze-yellow-5), 1);
        background-color: rgba(var(--coze-yellow-5), 1)
    }

    .coz-mg-color-plus-purple {
        background-color: rgba(var(--coze-purple-50), var(--coze-purple-50-alpha));
        background-color: rgba(var(--coze-purple-50), var(--coze-purple-50-alpha))
    }

    .coz-mg-color-plus-yellow {
        background-color: rgba(var(--coze-yellow-50), var(--coze-yellow-50-alpha));
        background-color: rgba(var(--coze-yellow-50), var(--coze-yellow-50-alpha))
    }

    .coz-mg-color-purple {
        background-color: rgba(var(--coze-purple-10), var(--coze-purple-10-alpha));
        background-color: rgba(var(--coze-purple-10), var(--coze-purple-10-alpha))
    }

    .coz-mg-color-purple-hovered {
        background-color: rgba(var(--coze-purple-20), var(--coze-purple-20-alpha));
        background-color: rgba(var(--coze-purple-20), var(--coze-purple-20-alpha))
    }

    .coz-mg-color-purple-pressed {
        background-color: rgba(var(--coze-purple-30), var(--coze-purple-30-alpha));
        background-color: rgba(var(--coze-purple-30), var(--coze-purple-30-alpha))
    }

    .coz-mg-hglt {
        background-color: rgba(var(--coze-brand-1), var(--coze-brand-1-alpha));
        background-color: rgba(var(--coze-brand-1), var(--coze-brand-1-alpha))
    }

    .coz-mg-hglt-ai {
        background-color: rgba(var(--coze-purple-1), var(--coze-purple-1-alpha));
        background-color: rgba(var(--coze-purple-1), var(--coze-purple-1-alpha))
    }

    .coz-mg-hglt-ai-hovered {
        background-color: rgba(var(--coze-purple-2), var(--coze-purple-2-alpha));
        background-color: rgba(var(--coze-purple-2), var(--coze-purple-2-alpha))
    }

    .coz-mg-hglt-ai-pressed {
        background-color: rgba(var(--coze-purple-3), var(--coze-purple-3-alpha));
        background-color: rgba(var(--coze-purple-3), var(--coze-purple-3-alpha))
    }

    .coz-mg-hglt-green {
        background-color: rgba(var(--coze-green-1), var(--coze-green-1-alpha));
        background-color: rgba(var(--coze-green-1), var(--coze-green-1-alpha))
    }

    .coz-mg-hglt-green-hovered {
        background-color: rgba(var(--coze-green-2), var(--coze-green-2-alpha));
        background-color: rgba(var(--coze-green-2), var(--coze-green-2-alpha))
    }

    .coz-mg-hglt-green-pressed {
        background-color: rgba(var(--coze-green-3), var(--coze-green-3-alpha));
        background-color: rgba(var(--coze-green-3), var(--coze-green-3-alpha))
    }

    .coz-mg-hglt-hovered {
        background-color: rgba(var(--coze-brand-2), var(--coze-brand-2-alpha));
        background-color: rgba(var(--coze-brand-2), var(--coze-brand-2-alpha))
    }

    .coz-mg-hglt-plus {
        background-color: rgba(var(--coze-brand-5), 1);
        background-color: rgba(var(--coze-brand-5), 1)
    }

    .coz-mg-hglt-plus-ai {
        background-color: rgba(var(--coze-purple-5), 1);
        background-color: rgba(var(--coze-purple-5), 1)
    }

    .coz-mg-hglt-plus-ai-dim {
        background-color: rgba(var(--coze-purple-3), var(--coze-purple-3-alpha));
        background-color: rgba(var(--coze-purple-3), var(--coze-purple-3-alpha))
    }

    .coz-mg-hglt-plus-ai-hovered {
        background-color: rgba(var(--coze-purple-6), 1);
        background-color: rgba(var(--coze-purple-6), 1)
    }

    .coz-mg-hglt-plus-ai-pressed {
        background-color: rgba(var(--coze-purple-7), 1);
        background-color: rgba(var(--coze-purple-7), 1)
    }

    .coz-mg-hglt-plus-dim {
        background-color: rgba(var(--coze-brand-3), var(--coze-brand-3-alpha));
        background-color: rgba(var(--coze-brand-3), var(--coze-brand-3-alpha))
    }

    .coz-mg-hglt-plus-green {
        background-color: rgba(var(--coze-green-5), 1);
        background-color: rgba(var(--coze-green-5), 1)
    }

    .coz-mg-hglt-plus-green-dim {
        background-color: rgba(var(--coze-green-3), var(--coze-green-3-alpha));
        background-color: rgba(var(--coze-green-3), var(--coze-green-3-alpha))
    }

    .coz-mg-hglt-plus-green-hovered {
        background-color: rgba(var(--coze-green-6), 1);
        background-color: rgba(var(--coze-green-6), 1)
    }

    .coz-mg-hglt-plus-green-pressed {
        background-color: rgba(var(--coze-green-7), 1);
        background-color: rgba(var(--coze-green-7), 1)
    }

    .coz-mg-hglt-plus-hovered {
        background-color: rgba(var(--coze-brand-6), 1);
        background-color: rgba(var(--coze-brand-6), 1)
    }

    .coz-mg-hglt-plus-pressed {
        background-color: rgba(var(--coze-brand-7), 1);
        background-color: rgba(var(--coze-brand-7), 1)
    }

    .coz-mg-hglt-plus-red {
        background-color: rgba(var(--coze-red-5), 1);
        background-color: rgba(var(--coze-red-5), 1)
    }

    .coz-mg-hglt-plus-red-dim {
        background-color: rgba(var(--coze-red-3), var(--coze-red-3-alpha));
        background-color: rgba(var(--coze-red-3), var(--coze-red-3-alpha))
    }

    .coz-mg-hglt-plus-red-hovered {
        background-color: rgba(var(--coze-red-6), 1);
        background-color: rgba(var(--coze-red-6), 1)
    }

    .coz-mg-hglt-plus-red-pressed {
        background-color: rgba(var(--coze-red-7), 1);
        background-color: rgba(var(--coze-red-7), 1)
    }

    .coz-mg-hglt-plus-yellow {
        background-color: rgba(var(--coze-yellow-5), 1);
        background-color: rgba(var(--coze-yellow-5), 1)
    }

    .coz-mg-hglt-plus-yellow-dim {
        background-color: rgba(var(--coze-yellow-3), var(--coze-yellow-3-alpha));
        background-color: rgba(var(--coze-yellow-3), var(--coze-yellow-3-alpha))
    }

    .coz-mg-hglt-plus-yellow-hovered {
        background-color: rgba(var(--coze-yellow-6), 1);
        background-color: rgba(var(--coze-yellow-6), 1)
    }

    .coz-mg-hglt-plus-yellow-pressed {
        background-color: rgba(var(--coze-yellow-7), 1);
        background-color: rgba(var(--coze-yellow-7), 1)
    }

    .coz-mg-hglt-pressed {
        background-color: rgba(var(--coze-brand-3), var(--coze-brand-3-alpha));
        background-color: rgba(var(--coze-brand-3), var(--coze-brand-3-alpha))
    }

    .coz-mg-hglt-red {
        background-color: rgba(var(--coze-red-1), var(--coze-red-1-alpha));
        background-color: rgba(var(--coze-red-1), var(--coze-red-1-alpha))
    }

    .coz-mg-hglt-red-hovered {
        background-color: rgba(var(--coze-red-2), var(--coze-red-2-alpha));
        background-color: rgba(var(--coze-red-2), var(--coze-red-2-alpha))
    }

    .coz-mg-hglt-red-pressed {
        background-color: rgba(var(--coze-red-3), var(--coze-red-3-alpha));
        background-color: rgba(var(--coze-red-3), var(--coze-red-3-alpha))
    }

    .coz-mg-hglt-secondary {
        background-color: rgba(var(--coze-brand-0), var(--coze-brand-0-alpha));
        background-color: rgba(var(--coze-brand-0), var(--coze-brand-0-alpha))
    }

    .coz-mg-hglt-secondary-green {
        background-color: rgba(var(--coze-green-0), var(--coze-green-0-alpha));
        background-color: rgba(var(--coze-green-0), var(--coze-green-0-alpha))
    }

    .coz-mg-hglt-secondary-hovered {
        background-color: rgba(var(--coze-brand-1), var(--coze-brand-1-alpha));
        background-color: rgba(var(--coze-brand-1), var(--coze-brand-1-alpha))
    }

    .coz-mg-hglt-secondary-pressed {
        background-color: rgba(var(--coze-brand-2), var(--coze-brand-2-alpha));
        background-color: rgba(var(--coze-brand-2), var(--coze-brand-2-alpha))
    }

    .coz-mg-hglt-secondary-red {
        background-color: rgba(var(--coze-red-0), var(--coze-red-0-alpha));
        background-color: rgba(var(--coze-red-0), var(--coze-red-0-alpha))
    }

    .coz-mg-hglt-secondary-yellow {
        background-color: rgba(var(--coze-yellow-0), var(--coze-yellow-0-alpha));
        background-color: rgba(var(--coze-yellow-0), var(--coze-yellow-0-alpha))
    }

    .coz-mg-hglt-yellow {
        background-color: rgba(var(--coze-yellow-1), var(--coze-yellow-1-alpha));
        background-color: rgba(var(--coze-yellow-1), var(--coze-yellow-1-alpha))
    }

    .coz-mg-hglt-yellow-hovered {
        background-color: rgba(var(--coze-yellow-2), var(--coze-yellow-2-alpha));
        background-color: rgba(var(--coze-yellow-2), var(--coze-yellow-2-alpha))
    }

    .coz-mg-hglt-yellow-pressed {
        background-color: rgba(var(--coze-yellow-3), var(--coze-yellow-3-alpha));
        background-color: rgba(var(--coze-yellow-3), var(--coze-yellow-3-alpha))
    }

    .coz-mg-mask {
        background-color: rgba(var(--coze-mask-5), .4);
        background-color: rgba(var(--coze-mask-5), .4)
    }

    .coz-mg-plus {
        background-color: rgba(var(--coze-bg-6), var(--coze-bg-6-alpha));
        background-color: rgba(var(--coze-bg-6), var(--coze-bg-6-alpha))
    }

    .coz-mg-plus-hovered {
        background-color: rgba(var(--coze-bg-7), var(--coze-bg-7-alpha));
        background-color: rgba(var(--coze-bg-7), var(--coze-bg-7-alpha))
    }

    .coz-mg-plus-pressed {
        background-color: rgba(var(--coze-bg-8), var(--coze-bg-8-alpha));
        background-color: rgba(var(--coze-bg-8), var(--coze-bg-8-alpha))
    }

    .coz-mg-primary {
        background-color: rgba(var(--coze-bg-5), var(--coze-bg-5-alpha));
        background-color: rgba(var(--coze-bg-5), var(--coze-bg-5-alpha))
    }

    .coz-mg-primary-hovered {
        background-color: rgba(var(--coze-bg-6), var(--coze-bg-6-alpha));
        background-color: rgba(var(--coze-bg-6), var(--coze-bg-6-alpha))
    }

    .coz-mg-primary-pressed {
        background-color: rgba(var(--coze-bg-7), var(--coze-bg-7-alpha));
        background-color: rgba(var(--coze-bg-7), var(--coze-bg-7-alpha))
    }

    .coz-mg-secondary {
        background-color: rgba(var(--coze-bg-4), var(--coze-bg-4-alpha));
        background-color: rgba(var(--coze-bg-4), var(--coze-bg-4-alpha))
    }

    .coz-mg-secondary-hovered {
        background-color: rgba(var(--coze-bg-5), var(--coze-bg-5-alpha));
        background-color: rgba(var(--coze-bg-5), var(--coze-bg-5-alpha))
    }

    .coz-mg-secondary-pressed {
        background-color: rgba(var(--coze-bg-6), var(--coze-bg-6-alpha));
        background-color: rgba(var(--coze-bg-6), var(--coze-bg-6-alpha))
    }

    .coz-mg-table-fixed-hovered {
        background-color: rgba(var(--coze-bg-0), 1);
        background-color: rgba(var(--coze-bg-0), 1)
    }

    .px-6 {
        padding-inline: calc(var(--coze-8)*6)
    }

    .px-\[8px\] {
        padding-left: 8px;
        padding-right: 8px
    }

    .px-\[12px\] {
        padding-left: 12px;
        padding-right: 12px
    }

    .py-3 {
        padding-block: calc(var(--coze-8)*3)
    }

    .py-\[6px\] {
        padding-top: 6px;
        padding-bottom: 6px
    }

    .pt-\[24px\] {
        padding-top: 24px
    }

    .pr-\[8px\] {
        padding-right: 8px
    }

    .pb-\[14px\] {
        padding-bottom: 14px
    }

    .pb-\[24px\] {
        padding-bottom: 24px
    }

    .pl-\[24px\] {
        padding-left: 24px
    }

    .text-base {
        font-size: var(--coze-12);
        line-height: var(--tw-leading, var(--text-base--line-height))
    }

    .text-lg {
        font-size: var(--coze-14);
        line-height: var(--tw-leading, var(--text-lg--line-height))
    }

    .text-sm {
        font-size: var(--text-sm);
        line-height: var(--tw-leading, var(--text-sm--line-height))
    }

    .text-xxl {
        font-size: var(--coze-16)
    }

    .leading-\[16px\] {
        --tw-leading: 16px;
        line-height: 16px
    }

    .leading-\[20px\] {
        --tw-leading: 20px;
        line-height: 20px
    }

    .font-medium {
        --tw-font-weight: var(--font-weight-medium);
        font-weight: var(--font-weight-medium)
    }

    .coz-fg {
        color: rgba(var(--coze-fg-3), var(--coze-fg-3-alpha))
    }

    .coz-fg-color-alternative {
        color: rgba(var(--coze-alternative-50), 1)
    }

    .coz-fg-color-alternative-dim {
        color: rgba(var(--coze-alternative-30), var(--coze-alternative-30-alpha))
    }

    .coz-fg-color-blue {
        color: rgba(var(--coze-blue-50), var(--coze-blue-50-alpha))
    }

    .coz-fg-color-blue-dim {
        color: rgba(var(--coze-blue-30), var(--coze-blue-30-alpha))
    }

    .coz-fg-color-brand {
        color: rgba(var(--coze-brand-50), var(--coze-brand-50-alpha))
    }

    .coz-fg-color-brand-dim {
        color: rgba(var(--coze-brand-30), var(--coze-brand-30-alpha))
    }

    .coz-fg-color-cyan {
        color: rgba(var(--coze-cyan-50), var(--coze-cyan-50-alpha))
    }

    .coz-fg-color-cyan-dim {
        color: rgba(var(--coze-cyan-30), var(--coze-cyan-30-alpha))
    }

    .coz-fg-color-emerald {
        color: rgba(var(--coze-green-5), 1)
    }

    .coz-fg-color-emerald-dim {
        color: rgba(var(--coze-green-3), var(--coze-green-3-alpha))
    }

    .coz-fg-color-magenta {
        color: rgba(var(--coze-magenta-50), var(--coze-magenta-50-alpha))
    }

    .coz-fg-color-magenta-dim {
        color: rgba(var(--coze-magenta-3), var(--coze-magenta-3-alpha))
    }

    .coz-fg-color-orange {
        color: rgba(var(--coze-yellow-5), 1)
    }

    .coz-fg-color-orange-dim {
        color: rgba(var(--coze-yellow-3), var(--coze-yellow-3-alpha))
    }

    .coz-fg-color-purple {
        color: rgba(var(--coze-purple-50), var(--coze-purple-50-alpha))
    }

    .coz-fg-color-purple-dim {
        color: rgba(var(--coze-purple-30), var(--coze-purple-30-alpha))
    }

    .coz-fg-color-yellow {
        color: rgba(var(--coze-yellow-50), var(--coze-yellow-50-alpha))
    }

    .coz-fg-color-yellow-dim {
        color: rgba(var(--coze-yellow-30), var(--coze-yellow-30-alpha))
    }

    .coz-fg-dim {
        color: rgba(var(--coze-fg-1), var(--coze-fg-1-alpha))
    }

    .coz-fg-hglt {
        color: rgba(var(--coze-brand-5), 1)
    }

    .coz-fg-hglt-ai {
        color: rgba(var(--coze-purple-5), 1)
    }

    .coz-fg-hglt-ai-dim {
        color: rgba(var(--coze-purple-3), var(--coze-purple-3-alpha))
    }

    .coz-fg-hglt-blue {
        color: rgba(var(--coze-blue-5), var(--coze-blue-5-alpha))
    }

    .coz-fg-hglt-blue-dim {
        color: rgba(var(--coze-blue-3), var(--coze-blue-3-alpha))
    }

    .coz-fg-hglt-cyan {
        color: rgba(var(--coze-cyan-5), 1)
    }

    .coz-fg-hglt-cyan-dim {
        color: rgba(var(--coze-cyan-3), var(--coze-cyan-3-alpha))
    }

    .coz-fg-hglt-dim {
        color: rgba(var(--coze-brand-3), var(--coze-brand-3-alpha))
    }

    .coz-fg-hglt-emerald {
        color: rgba(var(--coze-emerald-5), 1)
    }

    .coz-fg-hglt-emerald-dim {
        color: rgba(var(--coze-emerald-3), var(--coze-emerald-3-alpha))
    }

    .coz-fg-hglt-green {
        color: rgba(var(--coze-green-5), 1)
    }

    .coz-fg-hglt-green-dim {
        color: rgba(var(--coze-green-3), var(--coze-green-3-alpha))
    }

    .coz-fg-hglt-magenta {
        color: rgba(var(--coze-magenta-5), 1)
    }

    .coz-fg-hglt-magenta-dim {
        color: rgba(var(--coze-magenta-3), var(--coze-magenta-3-alpha))
    }

    .coz-fg-hglt-orange {
        color: rgba(var(--coze-orange-5), 1)
    }

    .coz-fg-hglt-orange-dim {
        color: rgba(var(--coze-orange-3), var(--coze-orange-3-alpha))
    }

    .coz-fg-hglt-plus,
    .coz-fg-hglt-plus-dim,
    .coz-fg-hglt-plus-dim {
        color: rgba(var(--coze-fg-5), var(--coze-fg-5-alpha))
    }

    .coz-fg-hglt-purple {
        color: rgba(var(--coze-purple-5), 1)
    }

    .coz-fg-hglt-purple-dim {
        color: rgba(var(--coze-purple-3), var(--coze-purple-3-alpha))
    }

    .coz-fg-hglt-red {
        color: rgba(var(--coze-red-5), 1)
    }

    .coz-fg-hglt-red-dim {
        color: rgba(var(--coze-red-3), var(--coze-red-3-alpha))
    }

    .coz-fg-hglt-yellow {
        color: rgba(var(--coze-yellow-5), 1)
    }

    .coz-fg-hglt-yellow-dim {
        color: rgba(var(--coze-yellow-3), var(--coze-yellow-3-alpha))
    }

    .coz-fg-plus {
        color: rgba(var(--coze-fg-4), var(--coze-fg-4-alpha))
    }

    .coz-fg-primary {
        color: rgba(var(--coze-fg-3), var(--coze-fg-3-alpha))
    }

    .coz-fg-secondary {
        color: rgba(var(--coze-fg-2), var(--coze-fg-2-alpha))
    }

    .coz-fg-white {
        color: rgba(var(--coze-fg-7), 1)
    }

    .coz-fg-white-dim {
        color: rgba(var(--coze-fg-white), var(--coze-fg-white-alpha))
    }

    .text-inherit {
        color: inherit
    }

    .no-underline {
        -webkit-text-decoration-line: none;
        text-decoration-line: none
    }

    .underline {
        -webkit-text-decoration-line: underline;
        text-decoration-line: underline
    }

    .coz-shadow,
    .coz-shadow-default {
        box-shadow: 0 4px 12px 0px rgba(var(--coze-shadow-0), .08), 0px 8px 24px 0px rgba(var(--coze-shadow-0), .04);
        box-shadow: 0 4px 12px 0px rgba(var(--coze-shadow-0), .08), 0px 8px 24px 0px rgba(var(--coze-shadow-0), .04)
    }

    .coz-shadow-large {
        box-shadow: 0px 8px 24px 0px rgba(var(--coze-shadow-0), .16), 0px 16px 48px 0px rgba(var(--coze-shadow-0), .08);
        box-shadow: 0px 8px 24px 0px rgba(var(--coze-shadow-0), .16), 0px 16px 48px 0px rgba(var(--coze-shadow-0), .08)
    }

    .coz-shadow-small {
        box-shadow: 0px 2px 6px 0px rgba(var(--coze-shadow-0), .04), 0px 4px 12px 0px rgba(var(--coze-shadow-0), .02);
        box-shadow: 0px 2px 6px 0px rgba(var(--coze-shadow-0), .04), 0px 4px 12px 0px rgba(var(--coze-shadow-0), .02)
    }

    .backdrop-blur-\[72px\] {
        --tw-backdrop-blur: blur(72px);
        -webkit-backdrop-filter: var(--tw-backdrop-blur, )var(--tw-backdrop-brightness, )var(--tw-backdrop-contrast, )var(--tw-backdrop-grayscale, )var(--tw-backdrop-hue-rotate, )var(--tw-backdrop-invert, )var(--tw-backdrop-opacity, )var(--tw-backdrop-saturate, )var(--tw-backdrop-sepia, );
        backdrop-filter: var(--tw-backdrop-blur, )var(--tw-backdrop-brightness, )var(--tw-backdrop-contrast, )var(--tw-backdrop-grayscale, )var(--tw-backdrop-hue-rotate, )var(--tw-backdrop-invert, )var(--tw-backdrop-opacity, )var(--tw-backdrop-saturate, )var(--tw-backdrop-sepia, )
    }

    .transition {
        transition-property: color, background-color, border-color, outline-color, -webkit-text-decoration-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, -webkit-filter, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events;
        transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
        transition-duration: var(--tw-duration, var(--default-transition-duration))
    }

    .ease-out {
        --tw-ease: var(--ease-out);
        transition-timing-function: var(--ease-out)
    }

    @media (hover:hover) {
        .hover\:coz-mg-secondary-hovered:hover {
            background-color: rgba(var(--coze-bg-5), var(--coze-bg-5-alpha));
            background-color: rgba(var(--coze-bg-5), var(--coze-bg-5-alpha))
        }
    }

    @media (min-width:40rem) {
        .sm\:flex-col {
            flex-direction: column
        }

        .sm\:flex-col-reverse {
            flex-direction: column-reverse
        }
    }

    @media (min-width:48rem) {
        .md\:flex-row {
            flex-direction: row
        }

        .md\:flex-row-reverse {
            flex-direction: row-reverse
        }
    }

    @media (min-width:64rem) {
        .lg\:flex-row {
            flex-direction: row
        }

        .lg\:flex-row-reverse {
            flex-direction: row-reverse
        }
    }
}

#root {
    width: 100%;
    height: 100vh
}

p {
    margin: 0
}

* {
    box-sizing: border-box;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-family: PingFang SC, Noto Sans SC, sans-serif
}

a:focus,
input:focus,
p:focus,
li:focus,
div:focus,
svg:focus {
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0%/0);
    outline: none
}

a:focus-visible {
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0%/0);
    outline: none
}

input:focus-visible {
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0%/0);
    outline: none
}

p:focus-visible {
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0%/0);
    outline: none
}

li:focus-visible {
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0%/0);
    outline: none
}

div:focus-visible {
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0%/0);
    outline: none
}

.global-layout {
    width: 100%;
    height: 100%
}

@property --tw-rotate-x {
    syntax: "*";
    inherits: false
}

@property --tw-rotate-y {
    syntax: "*";
    inherits: false
}

@property --tw-rotate-z {
    syntax: "*";
    inherits: false
}

@property --tw-skew-x {
    syntax: "*";
    inherits: false
}

@property --tw-skew-y {
    syntax: "*";
    inherits: false
}

@property --tw-border-style {
    syntax: "*";
    inherits: false;
    initial-value: solid
}

@property --tw-leading {
    syntax: "*";
    inherits: false
}

@property --tw-font-weight {
    syntax: "*";
    inherits: false
}

@property --tw-backdrop-blur {
    syntax: "*";
    inherits: false
}

@property --tw-backdrop-brightness {
    syntax: "*";
    inherits: false
}

@property --tw-backdrop-contrast {
    syntax: "*";
    inherits: false
}

@property --tw-backdrop-grayscale {
    syntax: "*";
    inherits: false
}

@property --tw-backdrop-hue-rotate {
    syntax: "*";
    inherits: false
}

@property --tw-backdrop-invert {
    syntax: "*";
    inherits: false
}

@property --tw-backdrop-opacity {
    syntax: "*";
    inherits: false
}

@property --tw-backdrop-saturate {
    syntax: "*";
    inherits: false
}

@property --tw-backdrop-sepia {
    syntax: "*";
    inherits: false
}

@property --tw-ease {
    syntax: "*";
    inherits: false
}




@font-face {
    font-weight: 400;
    font-family: SourceCodeProMac;
    font-style: normal;
    src: url(https://lf3-cdn-tos.huoshanstatic.com/obj/arcosites/SourceCodePro2.woff2) format('woff2');
    unicode-range: U+00??, U+0131, U+0152-0153, U+02bb-02bc, U+02c6, U+02da, U+02dc, U+2000-206f, U+2074, U+20ac, U+2122, U+2191, U+2193, U+2212, U+2215, U+feff, U+fffd;
}