:root {
    font-family: Inter, system-ui, Avenir, Helvetica, Arial, sans-serif;
    font-weight: 400;
    background-color: #000
  }

  * {
    -webkit-user-select: none;
    user-select: none
  }

  html body {
    --color-white: #ffffff;
    --color-black: #000000;
    --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: #f9f9f9;
    --color-neutral-2: rgba(188, 189, 194, .1);
    --color-neutral-3: #e9e9ec;
    --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-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-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));
    --border-radius-none: 0;
    --border-radius-small: 6px;
    --border-radius-medium: 8px;
    --border-radius-large: 10px;
    --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: #ffffff;
    --color-menu-dark-hover: rgba(255, 255, 255, .04);
    --color-mask-bg: rgba(29, 33, 41, .6);
    --arcoblue-1: 1, 27, 53 !important;
    --arcoblue-2: 2, 65, 18 !important;
    --arcoblue-3: 15, 94, 173 !important;
    --arcoblue-4: 32, 119, 205 !important;
    --arcoblue-5: 65, 105, 144 !important;
    --arcoblue-6: 89, 89, 89 !important;
    --arcoblue-7: 75, 120, 166 !important
  }

  body[arco-theme=dark] {
    background: transparent;
    --color-bg-popup: rgba(255, 255, 255, 0);
    --color-neutral-3: rgba(255, 255, 255, .05);
    --scrollbar-width: 12px;
    --scrollbar-color: #464646
  }

  body[arco-theme=dark] ::-webkit-scrollbar {
    width: var(--scrollbar-width);
    height: var(--scrollbar-width)
  }

  body[arco-theme=dark] ::-webkit-scrollbar-track {
    background: transparent
  }

  body[arco-theme=dark] ::-webkit-scrollbar-corner {
    background: #fbfbfb
  }

  body[arco-theme=dark] ::-webkit-scrollbar-thumb {
    background-color: var(--scrollbar-color);
    opacity: .2;
    border-radius: var(--scrollbar-width);
    border: 3px solid transparent;
    background-clip: content-box
  }

  body[arco-theme=dark] .arco-btn.arco-btn-primary {
    position: relative;
    border: 1px solid var(--Card-Border, hsla(0, 0%, 100%, .06));
    box-shadow: 0 1px 1px #00000040, inset 0 1px 1px #ffffff26;
    background: #4573e8;
    transition: all .15s ease-in-out;
    overflow: hidden
  }

  body[arco-theme=dark] .arco-btn.arco-btn-primary:active {
    opacity: .8
  }

  body[arco-theme=dark] .arco-btn.btn-d-b:hover {
    background: #ffffff20
  }

  body[arco-theme=dark] .arco-table-filters-content:before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    -webkit-backdrop-filter: blur(80px);
    backdrop-filter: blur(80px);
    transform: translateZ(0)
  }

  body[arco-theme=dark] .arco-select-dropdown:before,
  body[arco-theme=dark] .arco-dropdown:before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    -webkit-backdrop-filter: blur(80px);
    backdrop-filter: blur(80px);
    transform: translateZ(0)
  }

  body[arco-theme=dark] .akile-table-card .arco-table .arco-table-cell-with-sorter:hover {
    background-color: #ffffff0d
  }

  body[arco-theme=dark] .akile-table-card .arco-table .arco-table-th:first-child:before {
    content: unset
  }

  body[arco-theme=dark] .akile-table-card .arco-table .arco-table-th:before {
    content: "";
    height: 16px;
    width: 1px;
    display: block;
    position: absolute;
    background: #ffffff73;
    top: 12px
  }

  body[arco-theme=dark] .arco-table .arco-table-cell-with-sorter:hover {
    background-color: #ffffff0d
  }

  body[arco-theme=dark] .arco-table .arco-table-th:before {
    opacity: .2
  }

  body[arco-theme=dark] .arco-divider-horizontal {
    border-color: #ffffff0d
  }

  body[arco-theme=dark] .v-contextmenu:before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    -webkit-backdrop-filter: blur(80px);
    backdrop-filter: blur(80px);
    transform: translateZ(0)
  }

  body[arco-theme=dark] .v-contextmenu .v-contextmenu-item:hover {
    color: var(--color-text-1);
    background-color: var(--color-fill-2)
  }

  /*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
  html {
    line-height: 1.15;
    -webkit-text-size-adjust: 100%;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
  }

  h1 {
    margin: .67em 0
  }

  a {
    background-color: transparent
  }

  img {
    border-style: none
  }

  button {
    margin: 0;
    font-family: inherit
  }

  button {
    overflow: visible
  }

  button {
    text-transform: none
  }

  button::-moz-focus-inner,
  [type=button]::-moz-focus-inner,
  [type=reset]::-moz-focus-inner,
  [type=submit]::-moz-focus-inner {
    padding: 0;
    border-style: none
  }

  button:-moz-focusring,
  [type=button]:-moz-focusring,
  [type=reset]:-moz-focusring,
  [type=submit]:-moz-focusring {
    outline: 1px dotted ButtonText
  }

  [type=number]::-webkit-inner-spin-button,
  [type=number]::-webkit-outer-spin-button {
    height: auto
  }

  [type=search]::-webkit-search-decoration {
    -webkit-appearance: none
  }

  ::-webkit-file-upload-button {
    font: inherit;
    -webkit-appearance: button
  }

  template {
    display: none
  }

  @keyframes arco-loading-circle {
    0% {
      transform: rotate(0)
    }

    to {
      transform: rotate(360deg)
    }
  }

  .arco-icon-hover:before {
    position: absolute;
    display: block;
    box-sizing: border-box;
    background-color: transparent;
    border-radius: var(--border-radius-circle);
    transition: background-color .1s cubic-bezier(0, 0, 1, 1);
    content: ""
  }

  .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 {
    top: 50%;
    left: 50%;
    width: 20px;
    height: 20px;
    transform: translate(-50%, -50%)
  }

  .arco-icon-hover-size-mini:before {
    top: 50%;
    left: 50%;
    width: 20px;
    height: 20px;
    transform: translate(-50%, -50%)
  }

  .arco-icon-hover-size-small:before {
    top: 50%;
    left: 50%;
    width: 20px;
    height: 20px;
    transform: translate(-50%, -50%)
  }

  .arco-icon-hover-size-large:before {
    top: 50%;
    left: 50%;
    width: 24px;
    height: 24px;
    transform: translate(-50%, -50%)
  }

  .arco-icon-hover-size-huge:before {
    top: 50%;
    left: 50%;
    width: 24px;
    height: 24px;
    transform: translate(-50%, -50%)
  }

  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)
  }

  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)
  }

  body {
    --color-white: #ffffff;
    --color-black: #000000;
    --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-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-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));
    --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: #ffffff;
    --color-menu-dark-hover: rgba(255, 255, 255, .04);
    --color-mask-bg: rgba(29, 33, 41, .6)
  }

  body[arco-theme=dark] {
    --color-white: rgba(255, 255, 255, .9);
    --color-black: #000000;
    --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: rgb(var(--success-6), .2);
    --color-success-light-2: rgb(var(--success-6), .35);
    --color-success-light-3: rgb(var(--success-6), .5);
    --color-success-light-4: rgb(var(--success-6), .65);
    --color-warning-light-1: rgb(var(--warning-6), .2);
    --color-warning-light-2: rgb(var(--warning-6), .35);
    --color-warning-light-3: rgb(var(--warning-6), .5);
    --color-warning-light-4: rgb(var(--warning-6), .65);
    --color-link-light-1: rgb(var(--link-6), .2);
    --color-link-light-2: rgb(var(--link-6), .35);
    --color-link-light-3: rgb(var(--link-6), .5);
    --color-link-light-4: rgb(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)
  }

  body {
    font-size: 14px;
    font-family: Inter, -apple-system, BlinkMacSystemFont, PingFang SC, Hiragino Sans GB, noto sans, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif
  }

  .arco-input-label:hover {
    background-color: var(--color-fill-3);
    border-color: transparent
  }

  .arco-input-label:focus-within {
    z-index: 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-input-label.arco-input-label-disabled:hover {
    color: var(--color-text-4);
    background-color: var(--color-fill-2);
    border-color: transparent
  }

  .arco-input-label.arco-input-label-error:hover {
    background-color: var(--color-danger-light-2);
    border-color: transparent
  }

  .arco-input-label.arco-input-label-error:focus-within {
    z-index: 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-input-label:hover .arco-input-label-clear-btn {
    visibility: visible
  }

  .arco-input-label:not(.arco-input-label-focus) .arco-input-label-icon-hover:hover:before {
    background-color: var(--color-fill-4)
  }

  .arco-input-label .arco-input-label-input::placeholder {
    color: var(--color-text-3)
  }

  .arco-input-label .arco-input-label-input[disabled]::placeholder {
    color: var(--color-text-4)
  }

  .arco-input-label .arco-input-label-value:after {
    font-size: 0;
    line-height: 0;
    visibility: hidden;
    content: "."
  }

  .arco-picker input::placeholder {
    color: var(--color-text-3)
  }

  .arco-picker:hover {
    background-color: var(--color-fill-3);
    border-color: transparent
  }

  .arco-picker:not(.arco-picker-disabled):hover .arco-picker-clear-icon {
    display: inline-block
  }

  .arco-picker:not(.arco-picker-disabled):hover .arco-picker-suffix .arco-picker-clear-icon+span {
    display: none
  }

  .arco-picker input[disabled]::placeholder {
    color: var(--color-text-4)
  }

  .arco-picker-error:hover {
    background-color: var(--color-danger-light-2);
    border-color: transparent
  }

  .arco-picker-focused:hover {
    background-color: var(--color-bg-2);
    border-color: rgb(var(--primary-6))
  }

  .arco-picker-focused:hover .arco-picker-input-active input {
    background: var(--color-fill-2)
  }

  .arco-picker-disabled:hover {
    color: var(--color-text-4);
    background-color: var(--color-fill-2);
    border-color: transparent;
    cursor: not-allowed
  }

  .arco-picker-disabled:hover input[disabled] {
    color: var(--color-text-4);
    cursor: not-allowed
  }

  .arco-picker-disabled input[disabled]::placeholder,
  .arco-picker-disabled:hover input[disabled]::placeholder {
    color: var(--color-text-4)
  }

  .arco-select-view-single:hover {
    background-color: var(--color-fill-3);
    border-color: transparent
  }

  .arco-select-view-single:focus-within {
    z-index: 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-select-view-single.arco-select-view-disabled:hover {
    color: var(--color-text-4);
    background-color: var(--color-fill-2);
    border-color: transparent
  }

  .arco-select-view-single.arco-select-view-error:hover {
    background-color: var(--color-danger-light-2);
    border-color: transparent
  }

  .arco-select-view-single.arco-select-view-error:focus-within {
    z-index: 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-select-view-single:hover .arco-select-view-clear-btn {
    visibility: visible
  }

  .arco-select-view-single:not(.arco-select-view-focus) .arco-select-view-icon-hover:hover:before {
    background-color: var(--color-fill-4)
  }

  .arco-select-view-single .arco-select-view-input::placeholder {
    color: var(--color-text-3)
  }

  .arco-select-view-single .arco-select-view-input[disabled]::placeholder {
    color: var(--color-text-4)
  }

  .arco-select-view-single .arco-select-view-value:after {
    font-size: 0;
    line-height: 0;
    visibility: hidden;
    content: "."
  }

  .arco-select-view-multiple:hover {
    background-color: var(--color-fill-3);
    border-color: transparent
  }

  .arco-select-view-multiple:focus-within {
    z-index: 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-select-view-multiple.arco-select-view-disabled:hover {
    color: var(--color-text-4);
    background-color: var(--color-fill-2);
    border-color: transparent
  }

  .arco-select-view-multiple.arco-select-view-error:hover {
    background-color: var(--color-danger-light-2);
    border-color: transparent
  }

  .arco-select-view-multiple.arco-select-view-error:focus-within {
    z-index: 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-select-view-multiple:hover .arco-select-view-clear-btn {
    visibility: visible
  }

  .arco-select-view-multiple:not(.arco-select-view-focus) .arco-select-view-icon-hover:hover:before {
    background-color: var(--color-fill-4)
  }

  .arco-select-view-multiple .arco-select-view-inner .arco-select-view-tag .arco-icon-hover:hover:before {
    background-color: var(--color-fill-2)
  }

  .arco-select-view-multiple .arco-select-view-inner .arco-select-view-tag.arco-tag-custom-color .arco-icon-hover.arco-tag-icon-hover:hover:before {
    background-color: #fff3
  }

  .arco-select-view-multiple .arco-select-view-inner .arco-select-view-input::placeholder {
    color: var(--color-text-3)
  }

  .arco-select-view-multiple .arco-select-view-inner .arco-select-view-input[disabled]::placeholder {
    color: var(--color-text-4)
  }

  .arco-select-view-multiple.arco-select-view-focus .arco-select-view-tag .arco-icon-hover:hover:before {
    background-color: var(--color-fill-3)
  }

  .arco-select-view:hover .arco-select-view-clear-btn {
    display: block
  }

  .arco-select-view:hover .arco-select-view-clear-btn~* {
    display: none
  }

  .arco-alert-close-btn:hover {
    color: var(--color-text-1)
  }

  .arco-anchor-list:before {
    position: absolute;
    left: -4px;
    width: 2px;
    height: 100%;
    background-color: var(--color-fill-3);
    content: ""
  }

  .arco-anchor-link-item .arco-anchor-link:hover {
    color: var(--color-text-1);
    font-weight: 500;
    background-color: var(--color-fill-2)
  }

  .arco-anchor-line-less .arco-anchor-list:before {
    display: none
  }

  .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-back-top-btn:hover {
    background-color: rgb(var(--primary-5))
  }

  @keyframes arco-badge-scale {
    0% {
      transform: scale(0)
    }

    to {
      transform: scale(1)
    }
  }

  .arco-breadcrumb-item a:hover {
    color: rgb(var(--link-6));
    background-color: var(--color-fill-2)
  }

  .arco-btn {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    line-height: 1.5715;
    white-space: nowrap;
    outline: none;
    cursor: pointer;
    transition: all .1s cubic-bezier(0, 0, 1, 1);
    -webkit-appearance: none;
    -webkit-user-select: none;
    user-select: none
  }

  .arco-btn:active {
    transition: none
  }

  .arco-btn-link:hover {
    text-decoration: none
  }

  .arco-btn-loading:before {
    position: absolute;
    top: -1px;
    right: -1px;
    bottom: -1px;
    left: -1px;
    z-index: 1;
    display: block;
    background: #fff;
    border-radius: inherit;
    opacity: .4;
    transition: opacity .1s cubic-bezier(0, 0, 1, 1);
    content: "";
    pointer-events: none
  }

  .arco-btn-outline:hover,
  .arco-btn-outline[type=button]:hover,
  .arco-btn-outline[type=submit]:hover {
    color: rgb(var(--primary-5));
    background-color: transparent;
    border-color: rgb(var(--primary-5))
  }

  .arco-btn-outline:focus-visible,
  .arco-btn-outline[type=button]:focus-visible,
  .arco-btn-outline[type=submit]:focus-visible {
    box-shadow: 0 0 0 .25em rgb(var(--primary-3))
  }

  .arco-btn-outline:active,
  .arco-btn-outline[type=button]:active,
  .arco-btn-outline[type=submit]:active {
    color: rgb(var(--primary-7));
    background-color: transparent;
    border-color: rgb(var(--primary-7))
  }

  .arco-btn-outline.arco-btn-status-warning:hover {
    color: rgb(var(--warning-5));
    background-color: transparent;
    border-color: rgb(var(--warning-5))
  }

  .arco-btn-outline.arco-btn-status-warning:focus-visible {
    box-shadow: 0 0 0 .25em rgb(var(--warning-3))
  }

  .arco-btn-outline.arco-btn-status-warning:active {
    color: rgb(var(--warning-7));
    background-color: transparent;
    border-color: rgb(var(--warning-7))
  }

  .arco-btn-outline.arco-btn-status-danger:hover {
    color: rgb(var(--danger-5));
    background-color: transparent;
    border-color: rgb(var(--danger-5))
  }

  .arco-btn-outline.arco-btn-status-danger:focus-visible {
    box-shadow: 0 0 0 .25em rgb(var(--danger-3))
  }

  .arco-btn-outline.arco-btn-status-danger:active {
    color: rgb(var(--danger-7));
    background-color: transparent;
    border-color: rgb(var(--danger-7))
  }

  .arco-btn-outline.arco-btn-status-success:hover {
    color: rgb(var(--success-5));
    background-color: transparent;
    border-color: rgb(var(--success-5))
  }

  .arco-btn-outline.arco-btn-status-success:focus-visible {
    box-shadow: 0 0 0 .25em rgb(var(--success-3))
  }

  .arco-btn-outline.arco-btn-status-success:active {
    color: rgb(var(--success-7));
    background-color: transparent;
    border-color: rgb(var(--success-7))
  }

  .arco-btn-primary,
  .arco-btn-primary[type=button] {
    background-color: rgb(var(--primary-6))
  }

  .arco-btn-primary:hover,
  .arco-btn-primary[type=button]:hover,
  .arco-btn-primary[type=submit]:hover {
    color: #fff;
    background-color: rgb(var(--primary-5));
    border-color: transparent
  }

  .arco-btn-primary:focus-visible,
  .arco-btn-primary[type=button]:focus-visible,
  .arco-btn-primary[type=submit]:focus-visible {
    box-shadow: 0 0 0 .25em rgb(var(--primary-3))
  }

  .arco-btn-primary:active,
  .arco-btn-primary[type=button]:active,
  .arco-btn-primary[type=submit]:active {
    color: #fff;
    background-color: rgb(var(--primary-7));
    border-color: transparent
  }

  .arco-btn-primary.arco-btn-status-warning:hover {
    color: #fff;
    background-color: rgb(var(--warning-5));
    border-color: transparent
  }

  .arco-btn-primary.arco-btn-status-warning:focus-visible {
    box-shadow: 0 0 0 .25em rgb(var(--warning-3))
  }

  .arco-btn-primary.arco-btn-status-warning:active {
    color: #fff;
    background-color: rgb(var(--warning-7));
    border-color: transparent
  }

  .arco-btn-primary.arco-btn-status-danger:hover {
    color: #fff;
    background-color: rgb(var(--danger-5));
    border-color: transparent
  }

  .arco-btn-primary.arco-btn-status-danger:focus-visible {
    box-shadow: 0 0 0 .25em rgb(var(--danger-3))
  }

  .arco-btn-primary.arco-btn-status-danger:active {
    color: #fff;
    background-color: rgb(var(--danger-7));
    border-color: transparent
  }

  .arco-btn-primary.arco-btn-status-success:hover {
    color: #fff;
    background-color: rgb(var(--success-5));
    border-color: transparent
  }

  .arco-btn-primary.arco-btn-status-success:focus-visible {
    box-shadow: 0 0 0 .25em rgb(var(--success-3))
  }

  .arco-btn-primary.arco-btn-status-success:active {
    color: #fff;
    background-color: rgb(var(--success-7));
    border-color: transparent
  }

  .arco-btn-secondary:hover,
  .arco-btn-secondary[type=button]:hover,
  .arco-btn-secondary[type=submit]:hover {
    color: var(--color-text-2);
    background-color: var(--color-secondary-hover);
    border-color: transparent
  }

  .arco-btn-secondary:focus-visible,
  .arco-btn-secondary[type=button]:focus-visible,
  .arco-btn-secondary[type=submit]:focus-visible {
    box-shadow: 0 0 0 .25em var(--color-neutral-4)
  }

  .arco-btn-secondary:active,
  .arco-btn-secondary[type=button]:active,
  .arco-btn-secondary[type=submit]:active {
    color: var(--color-text-2);
    background-color: var(--color-secondary-active);
    border-color: transparent
  }

  .arco-btn-secondary.arco-btn-status-warning:hover {
    color: rgb(var(--warning-6));
    background-color: var(--color-warning-light-2);
    border-color: transparent
  }

  .arco-btn-secondary.arco-btn-status-warning:focus-visible {
    box-shadow: 0 0 0 .25em rgb(var(--warning-3))
  }

  .arco-btn-secondary.arco-btn-status-warning:active {
    color: rgb(var(--warning-6));
    background-color: var(--color-warning-light-3);
    border-color: transparent
  }

  .arco-btn-secondary.arco-btn-status-danger:hover {
    color: rgb(var(--danger-6));
    background-color: var(--color-danger-light-2);
    border-color: transparent
  }

  .arco-btn-secondary.arco-btn-status-danger:focus-visible {
    box-shadow: 0 0 0 .25em rgb(var(--danger-3))
  }

  .arco-btn-secondary.arco-btn-status-danger:active {
    color: rgb(var(--danger-6));
    background-color: var(--color-danger-light-3);
    border-color: transparent
  }

  .arco-btn-secondary.arco-btn-status-success:hover {
    color: rgb(var(--success-6));
    background-color: var(--color-success-light-2);
    border-color: transparent
  }

  .arco-btn-secondary.arco-btn-status-success:focus-visible {
    box-shadow: 0 0 0 .25em rgb(var(--success-3))
  }

  .arco-btn-secondary.arco-btn-status-success:active {
    color: rgb(var(--success-6));
    background-color: var(--color-success-light-3);
    border-color: transparent
  }

  .arco-btn-dashed:hover,
  .arco-btn-dashed[type=button]:hover,
  .arco-btn-dashed[type=submit]:hover {
    color: var(--color-text-2);
    background-color: var(--color-fill-3);
    border-color: var(--color-neutral-4)
  }

  .arco-btn-dashed:focus-visible,
  .arco-btn-dashed[type=button]:focus-visible,
  .arco-btn-dashed[type=submit]:focus-visible {
    box-shadow: 0 0 0 .25em var(--color-neutral-4)
  }

  .arco-btn-dashed:active,
  .arco-btn-dashed[type=button]:active,
  .arco-btn-dashed[type=submit]:active {
    color: var(--color-text-2);
    background-color: var(--color-fill-4);
    border-color: var(--color-neutral-5)
  }

  .arco-btn-dashed.arco-btn-status-warning:hover {
    color: rgb(var(--warning-6));
    background-color: var(--color-warning-light-2);
    border-color: var(--color-warning-light-3)
  }

  .arco-btn-dashed.arco-btn-status-warning:focus-visible {
    box-shadow: 0 0 0 .25em rgb(var(--warning-3))
  }

  .arco-btn-dashed.arco-btn-status-warning:active {
    color: rgb(var(--warning-6));
    background-color: var(--color-warning-light-3);
    border-color: var(--color-warning-light-4)
  }

  .arco-btn-dashed.arco-btn-status-danger:hover {
    color: rgb(var(--danger-6));
    background-color: var(--color-danger-light-2);
    border-color: var(--color-danger-light-3)
  }

  .arco-btn-dashed.arco-btn-status-danger:focus-visible {
    box-shadow: 0 0 0 .25em rgb(var(--danger-3))
  }

  .arco-btn-dashed.arco-btn-status-danger:active {
    color: rgb(var(--danger-6));
    background-color: var(--color-danger-light-3);
    border-color: var(--color-danger-light-4)
  }

  .arco-btn-dashed.arco-btn-status-success:hover {
    color: rgb(var(--success-6));
    background-color: var(--color-success-light-2);
    border-color: var(--color-success-light-3)
  }

  .arco-btn-dashed.arco-btn-status-success:focus-visible {
    box-shadow: 0 0 0 .25em rgb(var(--success-3))
  }

  .arco-btn-dashed.arco-btn-status-success:active {
    color: rgb(var(--success-6));
    background-color: var(--color-success-light-3);
    border-color: var(--color-success-light-4)
  }

  .arco-btn-text,
  .arco-btn-text[type=button] {
    background-color: transparent;
    border: 1px solid transparent
  }

  .arco-btn-text:hover,
  .arco-btn-text[type=button]:hover,
  .arco-btn-text[type=submit]:hover {
    color: rgb(var(--primary-6));
    background-color: var(--color-fill-2);
    border-color: transparent
  }

  .arco-btn-text:focus-visible,
  .arco-btn-text[type=button]:focus-visible,
  .arco-btn-text[type=submit]:focus-visible {
    box-shadow: 0 0 0 .25em var(--color-neutral-4)
  }

  .arco-btn-text:active,
  .arco-btn-text[type=button]:active,
  .arco-btn-text[type=submit]:active {
    color: rgb(var(--primary-6));
    background-color: var(--color-fill-3);
    border-color: transparent
  }

  .arco-btn-text.arco-btn-status-warning:hover {
    color: rgb(var(--warning-6));
    background-color: var(--color-fill-2);
    border-color: transparent
  }

  .arco-btn-text.arco-btn-status-warning:focus-visible {
    box-shadow: 0 0 0 .25em rgb(var(--warning-3))
  }

  .arco-btn-text.arco-btn-status-warning:active {
    color: rgb(var(--warning-6));
    background-color: var(--color-fill-3);
    border-color: transparent
  }

  .arco-btn-text.arco-btn-status-danger:hover {
    color: rgb(var(--danger-6));
    background-color: var(--color-fill-2);
    border-color: transparent
  }

  .arco-btn-text.arco-btn-status-danger:focus-visible {
    box-shadow: 0 0 0 .25em rgb(var(--danger-3))
  }

  .arco-btn-text.arco-btn-status-danger:active {
    color: rgb(var(--danger-6));
    background-color: var(--color-fill-3);
    border-color: transparent
  }

  .arco-btn-text.arco-btn-status-success:hover {
    color: rgb(var(--success-6));
    background-color: var(--color-fill-2);
    border-color: transparent
  }

  .arco-btn-text.arco-btn-status-success:focus-visible {
    box-shadow: 0 0 0 .25em rgb(var(--success-3))
  }

  .arco-btn-text.arco-btn-status-success:active {
    color: rgb(var(--success-6));
    background-color: var(--color-fill-3);
    border-color: transparent
  }

  .arco-btn-size-medium {
    height: 32px;
    padding: 0 15px;
    font-size: 14px;
    border-radius: var(--border-radius-small)
  }

  .arco-btn-size-medium.arco-btn-shape-round {
    border-radius: 16px
  }

  .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-calendar-header-icon:focus-visible {
    box-shadow: 0 0 0 2px var(--color-primary-light-3)
  }

  .arco-calendar-header-icon:not(.arco-calendar-header-icon-hidden):hover {
    background-color: var(--color-fill-3)
  }

  .arco-calendar-panel .arco-calendar-cell:not(.arco-calendar-cell-selected):not(.arco-calendar-cell-range-start):not(.arco-calendar-cell-range-end):not(.arco-calendar-cell-hover-range-start):not(.arco-calendar-cell-hover-range-end):not(.arco-calendar-cell-disabled):not(.arco-calendar-cell-week) .arco-calendar-date-value:hover {
    color: rgb(var(--primary-6));
    background-color: var(--color-primary-light-1);
    border-radius: 50%
  }

  .arco-calendar-panel.arco-calendar-mode-year .arco-calendar-cell:not(.arco-calendar-cell-selected):not(.arco-calendar-cell-range-start):not(.arco-calendar-cell-range-end):not(.arco-calendar-cell-hover-range-start):not(.arco-calendar-cell-hover-range-end):not(.arco-calendar-cell-disabled) .arco-calendar-date-value:hover {
    border-radius: 12px
  }

  .arco-calendar-panel .arco-calendar-cell-today:after {
    position: absolute;
    bottom: 0;
    left: 50%;
    display: block;
    width: 4px;
    height: 4px;
    margin-left: -2px;
    background-color: rgb(var(--primary-6));
    border-radius: 50%;
    content: ""
  }

  .arco-card-header-no-title:before {
    display: block;
    content: " "
  }

  .arco-card-actions:before {
    visibility: hidden;
    content: ""
  }

  .arco-card-actions-item:hover {
    color: rgb(var(--primary-6))
  }

  .arco-card-meta-footer-only-actions:before {
    visibility: hidden;
    content: ""
  }

  .arco-card-grid:before {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    transition: box-shadow .2s cubic-bezier(0, 0, 1, 1);
    content: "";
    pointer-events: none
  }

  .arco-card-grid-hoverable:hover {
    z-index: 1
  }

  .arco-card-grid-hoverable:hover:before {
    box-shadow: 0 4px 10px rgb(var(--gray-2))
  }

  .arco-card-hoverable:hover {
    box-shadow: 0 4px 10px rgb(var(--gray-2))
  }

  body[arco-theme=dark] .arco-card-grid-hoverable:hover:before,
  body[arco-theme=dark] .arco-card-hoverable:hover {
    box-shadow: 0 4px 10px rgba(var(--gray-1), 40%)
  }

  @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% {
      transform: translate(0) translateZ(-400px);
      opacity: 0
    }

    to {
      transform: translate(0) translateZ(-200px);
      opacity: .4
    }
  }

  @keyframes arco-carousel-card-middle-to-bottom {
    0% {
      transform: translate(-100%) translateZ(-200px);
      opacity: .4
    }

    to {
      transform: translate(-100%) translateZ(-400px);
      opacity: 0
    }
  }

  @keyframes arco-carousel-card-top-to-middle {
    0% {
      transform: translate(-50%) translateZ(0);
      opacity: 1
    }

    to {
      transform: translate(-100%) translateZ(-200px);
      opacity: .4
    }
  }

  @keyframes arco-carousel-card-middle-to-top {
    0% {
      transform: translate(0) translateZ(-200px);
      opacity: .4
    }

    to {
      transform: translate(-50%) translateZ(0);
      opacity: 1
    }
  }

  @keyframes arco-carousel-card-bottom-to-middle-reverse {
    0% {
      transform: translate(-100%) translateZ(-400px);
      opacity: 0
    }

    to {
      transform: translate(-100%) translateZ(-200px);
      opacity: .4
    }
  }

  @keyframes arco-carousel-card-middle-to-bottom-reverse {
    0% {
      transform: translate(0) translateZ(-200px);
      opacity: .4
    }

    to {
      transform: translate(0) translateZ(-400px);
      opacity: 0
    }
  }

  @keyframes arco-carousel-card-top-to-middle-reverse {
    0% {
      transform: translate(-50%) translateZ(0);
      opacity: 1
    }

    to {
      transform: translate(0) translateZ(-200px);
      opacity: .4
    }
  }

  @keyframes arco-carousel-card-middle-to-top-reverse {
    0% {
      transform: translate(-100%) translateZ(-200px);
      opacity: .4
    }

    to {
      transform: translate(-50%) translateZ(0);
      opacity: 1
    }
  }

  .arco-carousel-indicator-outer .arco-carousel-indicator-item:hover {
    background-color: var(--color-fill-4)
  }

  .arco-carousel-indicator-item:hover {
    background-color: var(--color-white)
  }

  .arco-carousel-arrow>div:hover {
    background-color: #ffffff80
  }

  .arco-carousel:hover .arco-carousel-arrow-hover div {
    opacity: 1
  }

  body[arco-theme=dark] .arco-carousel-arrow>div:hover {
    background-color: #17171a80
  }

  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-item:hover {
    background-color: var(--color-fill-4)
  }

  .arco-cascader-option:hover {
    color: var(--color-text-1);
    background-color: var(--color-fill-2)
  }

  .arco-cascader-option:hover .arco-checkbox:not(.arco-checkbox-disabled):not(.arco-checkbox-checked):hover .arco-checkbox-icon-hover:before,
  .arco-cascader-search-option-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-option:hover .arco-radio:not(.arco-radio-disabled):not(.arco-radio-checked):hover .arco-radio-icon-hover:before,
  .arco-cascader-search-option-hover .arco-radio:not(.arco-radio-disabled):not(.arco-radio-checked):hover .arco-radio-icon-hover:before {
    background-color: var(--color-fill-3)
  }

  .arco-cascader-option-disabled:hover,
  .arco-cascader-search-option-disabled:hover {
    color: var(--color-text-4);
    background-color: transparent;
    cursor: not-allowed
  }

  .arco-cascader-option-disabled:hover .arco-icon-right,
  .arco-cascader-search-option-disabled:hover .arco-icon-right {
    color: inherit
  }

  .arco-cascader-option-disabled:hover .arco-icon-check,
  .arco-cascader-search-option-disabled:hover .arco-icon-check {
    color: var(--color-primary-light-3)
  }

  .arco-cascader-option-active:hover {
    color: var(--color-text-1);
    background-color: var(--color-fill-2)
  }

  .arco-cascader-option-active.arco-cascader-option-disabled:hover {
    color: var(--color-text-4);
    background-color: var(--color-fill-2)
  }

  .arco-icon-hover.arco-checkbox-icon-hover:before {
    width: 24px;
    height: 24px
  }

  .arco-checkbox>input[type=checkbox]:focus-visible+.arco-checkbox-icon-hover:before {
    background-color: var(--color-fill-2)
  }

  .arco-checkbox:hover .arco-checkbox-icon-hover:before {
    background-color: var(--color-fill-2)
  }

  .arco-checkbox-icon:after {
    position: absolute;
    top: 50%;
    left: 50%;
    display: block;
    width: 6px;
    height: 2px;
    background: var(--color-white);
    border-radius: .5px;
    transform: translate(-50%) translateY(-50%) scale(0);
    content: ""
  }

  .arco-checkbox:hover .arco-checkbox-icon {
    border-color: var(--color-fill-4);
    transition: border-color .1s cubic-bezier(0, 0, 1, 1), transform .3s cubic-bezier(.3, 1.3, .3, 1)
  }

  .arco-checkbox-checked:hover .arco-checkbox-icon,
  .arco-checkbox-indeterminate:hover .arco-checkbox-icon {
    transition: transform .3s cubic-bezier(.3, 1.3, .3, 1)
  }

  .arco-checkbox-indeterminate .arco-checkbox-icon:after {
    transform: translate(-50%) translateY(-50%) scale(1);
    transition: transform .3s cubic-bezier(.3, 1.3, .3, 1)
  }

  .arco-checkbox.arco-checkbox-disabled:hover .arco-checkbox-mask {
    border-color: var(--color-fill-3)
  }

  .arco-checkbox-checked:hover .arco-checkbox-icon,
  .arco-checkbox-indeterminate:hover .arco-checkbox-icon {
    border-color: transparent
  }

  .arco-checkbox-disabled.arco-checkbox-checked:hover .arco-checkbox-icon {
    background-color: var(--color-primary-light-3);
    border-color: transparent
  }

  .arco-checkbox-disabled:hover .arco-checkbox-icon-hover:before,
  .arco-checkbox-checked:hover .arco-checkbox-icon-hover:before,
  .arco-checkbox-indeterminate:hover .arco-checkbox-icon-hover:before {
    background-color: transparent
  }

  .arco-checkbox-disabled:hover .arco-checkbox-icon {
    border-color: var(--color-fill-3)
  }

  .arco-icon-hover.arco-collapse-item-icon-hover:before {
    width: 16px;
    height: 16px
  }

  .arco-icon-hover.arco-collapse-item-icon-hover:hover:before {
    background-color: var(--color-fill-2)
  }

  .arco-collapse:after {
    display: table;
    clear: both;
    content: ""
  }

  .arco-color-picker:hover {
    background-color: var(--color-fill-3);
    cursor: pointer
  }

  .arco-color-picker-panel .arco-color-picker-panel-colors .arco-color-picker-color-block:hover {
    transform: scale(1.1)
  }

  .arco-color-picker-panel .arco-color-picker-control-bar .arco-color-picker-handler:before {
    display: block;
    width: 100%;
    height: 100%;
    background: var(--color-bg-white);
    border-radius: 50%;
    content: ""
  }

  .arco-color-picker-panel .arco-color-picker-control-bar .arco-color-picker-handler:after {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 8px;
    height: 8px;
    background: currentColor;
    border-radius: 50%;
    transform: translate(-50%, -50%);
    content: ""
  }

  .arco-picker-header-icon:not(.arco-picker-header-icon-hidden):hover {
    background-color: var(--color-fill-3)
  }

  .arco-picker-header-label:hover {
    background-color: var(--color-fill-3)
  }

  .arco-picker-cell-in-view:not(.arco-picker-cell-selected):not(.arco-picker-cell-range-start):not(.arco-picker-cell-range-end):not(.arco-picker-cell-disabled):not(.arco-picker-cell-week) .arco-picker-date-value:hover {
    color: var(--color-text-1);
    background-color: var(--color-fill-3)
  }

  .arco-picker-cell-today:after {
    position: absolute;
    bottom: -2px;
    left: 50%;
    display: block;
    width: 4px;
    height: 4px;
    margin-left: -2px;
    background-color: rgb(var(--primary-6));
    border-radius: 50%;
    content: ""
  }

  .arco-panel-date-timepicker .arco-timepicker-column::-webkit-scrollbar {
    width: 0
  }

  .arco-panel-date-timepicker .arco-timepicker ul:after {
    height: 244px
  }

  .arco-panel-date-with-view-tabs .arco-panel-date-timepicker .arco-timepicker-column::-webkit-scrollbar {
    width: 0
  }

  .arco-panel-month .arco-picker-cell:not(.arco-picker-cell-selected):not(.arco-picker-cell-range-start):not(.arco-picker-cell-range-end):not(.arco-picker-cell-disabled):not(.arco-picker-cell-week) .arco-picker-date-value:hover,
  .arco-panel-quarter .arco-picker-cell:not(.arco-picker-cell-selected):not(.arco-picker-cell-range-start):not(.arco-picker-cell-range-end):not(.arco-picker-cell-disabled):not(.arco-picker-cell-week) .arco-picker-date-value:hover,
  .arco-panel-year .arco-picker-cell:not(.arco-picker-cell-selected):not(.arco-picker-cell-range-start):not(.arco-picker-cell-range-end):not(.arco-picker-cell-disabled):not(.arco-picker-cell-week) .arco-picker-date-value:hover {
    border-radius: 24px
  }

  .arco-panel-week .arco-picker-row-week:hover .arco-picker-cell:not(.arco-picker-cell-week):not(.arco-picker-cell-selected):not(.arco-picker-cell-range-start):not(.arco-picker-cell-range-end) .arco-picker-date-value {
    background-color: var(--color-fill-3)
  }

  .arco-datepicker-shortcuts-wrapper>li:hover {
    color: rgb(var(--primary-6))
  }

  .arco-divider-horizontal {
    position: relative;
    clear: both;
    width: 100%;
    min-width: 100%;
    max-width: 100%;
    margin: 20px 0
  }

  .arco-dropdown-option:not(.arco-dropdown-option-disabled):hover {
    color: var(--color-text-1);
    background-color: var(--color-fill-2);
    transition: all .1s cubic-bezier(0, 0, 1, 1)
  }

  .arco-form-item-status-validating .arco-input-wrapper:not(.arco-input-disabled):hover,
  .arco-form-item-status-validating .arco-textarea-wrapper:not(.arco-textarea-disabled):hover {
    background-color: var(--color-fill-3);
    border-color: transparent
  }

  .arco-form-item-status-validating .arco-select-view:not(.arco-select-view-disabled):hover,
  .arco-form-item-status-validating .arco-input-tag:not(.arco-input-tag-disabled):hover {
    background-color: var(--color-fill-3);
    border-color: transparent
  }

  .arco-form-item-status-validating .arco-picker:not(.arco-picker-disabled):hover {
    border-color: transparent;
    background-color: var(--color-fill-3)
  }

  .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-success .arco-input-wrapper:not(.arco-input-disabled):hover,
  .arco-form-item-status-success .arco-textarea-wrapper:not(.arco-textarea-disabled):hover {
    background-color: var(--color-fill-3);
    border-color: transparent
  }

  .arco-form-item-status-success .arco-select-view:not(.arco-select-view-disabled):hover,
  .arco-form-item-status-success .arco-input-tag:not(.arco-input-tag-disabled):hover {
    background-color: var(--color-fill-3);
    border-color: transparent
  }

  .arco-form-item-status-success .arco-picker:not(.arco-picker-disabled):hover {
    border-color: transparent;
    background-color: var(--color-fill-3)
  }

  .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-warning .arco-input-wrapper:not(.arco-input-disabled):hover,
  .arco-form-item-status-warning .arco-textarea-wrapper:not(.arco-textarea-disabled):hover {
    background-color: var(--color-warning-light-2);
    border-color: transparent
  }

  .arco-form-item-status-warning .arco-select-view:not(.arco-select-view-disabled):hover,
  .arco-form-item-status-warning .arco-input-tag:not(.arco-input-tag-disabled):hover {
    background-color: var(--color-warning-light-2);
    border-color: transparent
  }

  .arco-form-item-status-warning .arco-picker:not(.arco-picker-disabled):hover {
    border-color: transparent;
    background-color: var(--color-warning-light-2)
  }

  .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-error .arco-input-wrapper:not(.arco-input-disabled):hover,
  .arco-form-item-status-error .arco-textarea-wrapper:not(.arco-textarea-disabled):hover {
    background-color: var(--color-danger-light-2);
    border-color: transparent
  }

  .arco-form-item-status-error .arco-select-view:not(.arco-select-view-disabled):hover,
  .arco-form-item-status-error .arco-input-tag:not(.arco-input-tag-disabled):hover {
    background-color: var(--color-danger-light-2);
    border-color: transparent
  }

  .arco-form-item-status-error .arco-picker:not(.arco-picker-disabled):hover {
    border-color: transparent;
    background-color: var(--color-danger-light-2)
  }

  .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)
  }

  @keyframes arco-form-blink {
    0% {
      opacity: 1
    }

    50% {
      opacity: .2
    }

    to {
      opacity: 1
    }
  }

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

  .arco-row-align-start {
    align-items: flex-start
  }

  .arco-row-align-center {
    align-items: center
  }

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

  .arco-row-justify-space-around {
    justify-content: space-around
  }

  .arco-row-justify-space-between {
    justify-content: space-between
  }

  .arco-col {
    box-sizing: border-box
  }

  .arco-col-xs-12 {
    flex: 0 0 50%;
    width: 50%
  }

  .arco-col-xs-24 {
    flex: 0 0 100%;
    width: 100%
  }

  @media (min-width:576px) {
    .arco-col-sm-12 {
      flex: 0 0 50%;
      width: 50%
    }

    .arco-col-sm-24 {
      flex: 0 0 100%;
      width: 100%
    }
  }

  @media (min-width:768px) {
    .arco-col-md-6 {
      flex: 0 0 25%;
      width: 25%
    }

    .arco-col-md-8 {
      flex: 0 0 33.33333333%;
      width: 33.33333333%
    }

    .arco-col-md-10 {
      flex: 0 0 41.66666667%;
      width: 41.66666667%
    }

    .arco-col-md-12 {
      flex: 0 0 50%;
      width: 50%
    }
  }

  @media (min-width:992px) {
    .arco-col-lg-6 {
      flex: 0 0 25%;
      width: 25%
    }

    .arco-col-lg-8 {
      flex: 0 0 33.33333333%;
      width: 33.33333333%
    }

    .arco-col-lg-10 {
      flex: 0 0 41.66666667%;
      width: 41.66666667%
    }

    .arco-col-lg-12 {
      flex: 0 0 50%;
      width: 50%
    }
  }

  @media (min-width:1200px) {
    .arco-col-xl-6 {
      flex: 0 0 25%;
      width: 25%
    }

    .arco-col-xl-8 {
      flex: 0 0 33.33333333%;
      width: 33.33333333%
    }

    .arco-col-xl-10 {
      flex: 0 0 41.66666667%;
      width: 41.66666667%
    }

    .arco-col-xl-12 {
      flex: 0 0 50%;
      width: 50%
    }
  }

  .arco-image-preview-img-container:before {
    display: inline-block;
    width: 0;
    height: 100%;
    vertical-align: middle;
    content: ""
  }

  .arco-image-preview-toolbar-action:hover {
    color: rgb(var(--primary-6));
    background-color: var(--color-neutral-2)
  }

  .arco-image-preview-toolbar-action-disabled:hover {
    color: var(--color-text-4);
    background-color: transparent;
    cursor: not-allowed
  }

  .arco-image-preview-arrow-left:hover,
  .arco-image-preview-arrow-right:hover {
    background-color: #ffffff80
  }

  .arco-image-preview-arrow-disabled:hover {
    background-color: #fff3
  }

  .arco-input-number-step-button:hover {
    background-color: var(--color-fill-3);
    border-color: var(--color-fill-3)
  }

  .arco-input-number-step-button:active {
    background-color: var(--color-fill-4);
    border-color: var(--color-fill-4)
  }

  .arco-input-number-step-button:disabled {
    color: var(--color-text-4);
    background-color: var(--color-fill-2);
    cursor: not-allowed
  }

  .arco-input-number-step-button:disabled:hover,
  .arco-input-number-step-button:disabled:active {
    background-color: var(--color-fill-2);
    border-color: var(--color-neutral-3)
  }

  .arco-input-number-mode-embed:not(.arco-input-disabled):not(.arco-input-outer-disabled):hover .arco-input-suffix:has(.arco-input-number-suffix),
  .arco-input-number-mode-embed:not(.arco-input-disabled):not(.arco-input-outer-disabled):focus-within .arco-input-suffix:has(.arco-input-number-suffix) {
    padding-left: 4px
  }

  .arco-input-number-mode-embed:not(.arco-input-disabled):not(.arco-input-outer-disabled):hover .arco-input-number-step,
  .arco-input-number-mode-embed:not(.arco-input-disabled):not(.arco-input-outer-disabled):focus-within .arco-input-number-step {
    opacity: 1
  }

  .arco-input-number-mode-embed:not(.arco-input-disabled):not(.arco-input-outer-disabled):hover .arco-input-number-suffix,
  .arco-input-number-mode-embed:not(.arco-input-disabled):not(.arco-input-outer-disabled):focus-within .arco-input-number-suffix {
    opacity: 0;
    pointer-events: none
  }

  .arco-input-number-mode-embed.arco-input-wrapper:not(.arco-input-focus) .arco-input-number-step-button:not(.arco-input-number-step-button-disabled):hover {
    background-color: var(--color-fill-4)
  }

  .arco-input-number-mode-button .arco-input-prepend .arco-input-number-step-button:not(.arco-input-number-mode-button .arco-input-prepend .arco-input-number-step-button:active) {
    border-right-color: var(--color-neutral-3)
  }

  .arco-input-number-mode-button .arco-input-append .arco-input-number-step-button:not(.arco-input-number-mode-button .arco-input-append .arco-input-number-step-button:active) {
    border-left-color: var(--color-neutral-3)
  }

  .arco-input-tag:hover {
    background-color: var(--color-fill-3);
    border-color: transparent
  }

  .arco-input-tag:focus-within {
    z-index: 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-input-tag.arco-input-tag-disabled:hover {
    color: var(--color-text-4);
    background-color: var(--color-fill-2);
    border-color: transparent
  }

  .arco-input-tag.arco-input-tag-error:hover {
    background-color: var(--color-danger-light-2);
    border-color: transparent
  }

  .arco-input-tag.arco-input-tag-error:focus-within {
    z-index: 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-input-tag:hover .arco-input-tag-clear-btn {
    visibility: visible
  }

  .arco-input-tag:not(.arco-input-tag-focus) .arco-input-tag-icon-hover:hover:before {
    background-color: var(--color-fill-4)
  }

  .arco-input-tag .arco-input-tag-inner .arco-input-tag-tag .arco-icon-hover:hover:before {
    background-color: var(--color-fill-2)
  }

  .arco-input-tag .arco-input-tag-inner .arco-input-tag-tag.arco-tag-custom-color .arco-icon-hover.arco-tag-icon-hover:hover:before {
    background-color: #fff3
  }

  .arco-input-tag .arco-input-tag-inner .arco-input-tag-input::placeholder {
    color: var(--color-text-3)
  }

  .arco-input-tag .arco-input-tag-inner .arco-input-tag-input[disabled]::placeholder {
    color: var(--color-text-4)
  }

  .arco-input-tag.arco-input-tag-focus .arco-input-tag-tag .arco-icon-hover:hover:before {
    background-color: var(--color-fill-3)
  }

  .arco-input-wrapper:hover {
    background-color: var(--color-fill-3);
    border-color: transparent
  }

  .arco-input-wrapper:focus-within {
    z-index: 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-input-wrapper.arco-input-disabled:hover {
    color: var(--color-text-4);
    background-color: var(--color-fill-2);
    border-color: transparent
  }

  .arco-input-wrapper.arco-input-error:hover {
    background-color: var(--color-danger-light-2);
    border-color: transparent
  }

  .arco-input-wrapper.arco-input-error:focus-within {
    z-index: 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-input-wrapper:hover .arco-input-clear-btn {
    visibility: visible
  }

  .arco-input-wrapper:not(.arco-input-focus) .arco-input-icon-hover:hover:before {
    background-color: var(--color-fill-4)
  }

  .arco-input-wrapper .arco-input::placeholder {
    color: var(--color-text-3)
  }

  .arco-input-wrapper .arco-input[disabled]::placeholder {
    color: var(--color-text-4)
  }

  .arco-input-group>.arco-input-wrapper:not(:last-child):focus-within,
  .arco-input-group>.arco-input-outer:not(:last-child):focus-within,
  .arco-input-group>.arco-input-tag:not(:last-child):focus-within,
  .arco-input-group>.arco-select-view:not(:last-child):focus-within {
    border-right-color: rgb(var(--primary-6))
  }

  .arco-input-group>.arco-input-wrapper.arco-input-error:not(:last-child):focus-within {
    border-right-color: rgb(var(--danger-6))
  }

  .arco-textarea-clear-wrapper:hover .arco-textarea-clear-icon {
    display: inline-block
  }

  .arco-layout-sider-collapsed .arco-layout-sider-children::-webkit-scrollbar {
    width: 0
  }

  .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.arco-link-hoverless:active,
  .arco-link.arco-link-hoverless:hover {
    background-color: unset
  }

  .arco-link-status-success:hover,
  .arco-link-status-success:active {
    color: rgb(var(--success-6))
  }

  .arco-link-status-danger:hover,
  .arco-link-status-danger:active {
    color: rgb(var(--danger-6))
  }

  .arco-link-status-warning:hover,
  .arco-link-status-warning:active {
    color: rgb(var(--warning-6))
  }

  .arco-list-hover .arco-list-item:hover {
    background-color: var(--color-fill-1)
  }

  .arco-list-pagination:after {
    display: block;
    clear: both;
    height: 0;
    overflow: hidden;
    visibility: hidden;
    content: ""
  }

  .arco-menu:focus-visible {
    outline: 3px solid var(--color-primary-light-2)
  }

  .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 {
    color: var(--color-text-2);
    background-color: var(--color-fill-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,
  .arco-menu-light .arco-menu-item:hover .arco-menu-icon,
  .arco-menu-light .arco-menu-group-title:hover .arco-menu-icon,
  .arco-menu-light .arco-menu-pop-header:hover .arco-menu-icon,
  .arco-menu-light .arco-menu-inline-header:hover .arco-menu-icon {
    color: var(--color-text-3)
  }

  .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: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-collapse-button:hover {
    background-color: var(--color-fill-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 {
    color: var(--color-text-4);
    background-color: var(--color-menu-dark-hover)
  }

  .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,
  .arco-menu-dark .arco-menu-item:hover .arco-menu-icon,
  .arco-menu-dark .arco-menu-group-title:hover .arco-menu-icon,
  .arco-menu-dark .arco-menu-pop-header:hover .arco-menu-icon,
  .arco-menu-dark .arco-menu-inline-header:hover .arco-menu-icon {
    color: var(--color-text-3)
  }

  .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: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-collapse-button:hover {
    background-color: rgb(var(--primary-7))
  }

  .arco-menu a:hover,
  .arco-menu a:focus,
  .arco-menu a:active {
    color: inherit;
    text-decoration: none;
    cursor: inherit
  }

  .arco-menu-horizontal .arco-menu-pop:after {
    position: absolute;
    bottom: -14px;
    left: 0;
    width: 100%;
    height: 14px;
    content: " "
  }

  .arco-menu-item-tooltip a:hover,
  .arco-menu-item-tooltip a:focus,
  .arco-menu-item-tooltip a:active {
    color: inherit
  }

  .arco-trigger-menu-item:hover,
  .arco-trigger-menu-pop-header:hover {
    color: var(--color-text-1);
    background-color: var(--color-fill-2)
  }

  .arco-trigger-menu-dark .arco-trigger-menu-item.arco-trigger-menu-selected:hover,
  .arco-trigger-menu-dark .arco-trigger-menu-pop-header.arco-trigger-menu-selected:hover {
    color: var(--color-white)
  }

  .arco-trigger-menu-dark .arco-trigger-menu-item:hover,
  .arco-trigger-menu-dark .arco-trigger-menu-pop-header:hover {
    color: var(--color-text-4);
    background-color: var(--color-menu-dark-hover)
  }

  .arco-message .arco-icon-hover.arco-message-icon-hover:before {
    width: 20px;
    height: 20px
  }

  @keyframes arco-msg-fade {
    0% {
      opacity: 0
    }

    to {
      opacity: 1
    }
  }

  @keyframes arco-msg-scale {
    0% {
      transform: scale(0)
    }

    to {
      transform: scale(1)
    }
  }

  .arco-modal-wrapper.arco-modal-wrapper-align-center:after {
    display: inline-block;
    width: 0;
    height: 100%;
    vertical-align: middle;
    content: ""
  }

  .arco-notification .arco-icon-hover.arco-notification-icon-hover:before {
    width: 20px;
    height: 20px
  }

  .arco-page-header .arco-icon-hover.arco-page-header-icon-hover:before {
    width: 30px;
    height: 30px
  }

  .arco-page-header .arco-icon-hover.arco-page-header-icon-hover:hover:before {
    background-color: var(--color-fill-2)
  }

  .arco-pagination-item:hover {
    color: var(--color-text-2);
    background-color: var(--color-fill-1);
    border-color: transparent
  }

  .arco-pagination-item-active:hover {
    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-disabled:hover {
    color: var(--color-text-4);
    background-color: transparent;
    border-color: transparent;
    cursor: not-allowed
  }

  .arco-pagination-item-previous:not(.arco-pagination-item-disabled):hover,
  .arco-pagination-item-next:not(.arco-pagination-item-disabled):hover {
    color: rgb(var(--primary-6));
    background-color: var(--color-fill-1)
  }

  .arco-pagination-item-previous:after,
  .arco-pagination-item-next:after {
    display: inline-block;
    font-size: 0;
    vertical-align: middle;
    content: "."
  }

  .arco-pagination-simple .arco-pagination-item-previous:not(.arco-pagination-item-disabled):hover,
  .arco-pagination-simple .arco-pagination-item-next:not(.arco-pagination-item-disabled):hover {
    color: rgb(var(--primary-6));
    background-color: var(--color-fill-1)
  }

  .arco-pagination-disabled .arco-pagination-item:not(.arco-pagination-item-disabled):not(.arco-pagination-item-active):hover {
    color: var(--color-text-4);
    background-color: transparent;
    border-color: transparent;
    cursor: not-allowed
  }

  .arco-progress-line-bar-animate:after {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, transparent 25%, rgba(255, 255, 255, .5) 50%, transparent 75%);
    background-size: 400% 100%;
    animation: arco-progress-loading 1.5s cubic-bezier(.34, .69, .1, 1) infinite
  }

  @keyframes arco-progress-loading {
    0% {
      background-position: 100% 50%
    }

    to {
      background-position: 0 50%
    }
  }

  .arco-radio>input[type=radio]:focus+.arco-radio-icon-hover:before,
  .arco-radio-button>input[type=radio]:focus+.arco-radio-icon-hover:before {
    background-color: var(--color-fill-2)
  }

  .arco-icon-hover.arco-radio-icon-hover:before {
    width: 24px;
    height: 24px
  }

  .arco-radio-icon:after {
    position: absolute;
    top: 0;
    left: 0;
    display: inline-block;
    box-sizing: border-box;
    width: 10px;
    height: 10px;
    background-color: var(--color-bg-2);
    border-radius: var(--border-radius-circle);
    transform: scale(1);
    transition: transform .3s cubic-bezier(.3, 1.3, .3, 1);
    content: ""
  }

  .arco-radio:hover .arco-radio-icon {
    border-color: var(--color-neutral-3)
  }

  .arco-radio-checked .arco-radio-icon:after {
    background-color: var(--color-white);
    transform: scale(.4)
  }

  .arco-radio-checked:hover .arco-radio-icon {
    border-color: rgb(var(--primary-6))
  }

  .arco-radio-disabled .arco-radio-icon:after {
    background-color: var(--color-fill-2)
  }

  .arco-radio-disabled:hover .arco-radio-icon {
    border-color: var(--color-neutral-3)
  }

  .arco-radio-checked.arco-radio-disabled:hover .arco-radio-icon {
    background-color: var(--color-primary-light-3);
    border-color: transparent
  }

  .arco-radio-checked.arco-radio-disabled .arco-radio-icon:after {
    background-color: var(--color-fill-2)
  }

  .arco-radio:hover .arco-radio-icon-hover:before {
    background-color: var(--color-fill-2)
  }

  .arco-radio-button:not(:first-of-type):before {
    position: absolute;
    top: 50%;
    left: -2px;
    display: block;
    width: 1px;
    height: 14px;
    background-color: var(--color-neutral-3);
    transform: translateY(-50%);
    transition: all .1s cubic-bezier(0, 0, 1, 1);
    content: ""
  }

  .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:hover {
    color: var(--color-text-1);
    background-color: var(--color-bg-5)
  }

  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-rate:not(.arco-rate-readonly):not(.arco-rate-disabled) .arco-rate-character:hover,
  .arco-rate:not(.arco-rate-readonly):not(.arco-rate-disabled) .arco-rate-character:focus {
    transform: scale(1.2)
  }

  @keyframes arco-rate-scale {
    0% {
      transform: scale(1)
    }

    50% {
      transform: scale(1.2)
    }

    to {
      transform: scale(1)
    }
  }

  .arco-scrollbar-container::-webkit-scrollbar {
    display: none
  }

  .arco-scrollbar-thumb:hover .arco-scrollbar-thumb-bar {
    background-color: var(--color-neutral-6)
  }

  .arco-scrollbar.arco-scrollbar-type-embed:hover .arco-scrollbar-thumb {
    opacity: .8
  }

  .arco-scrollbar.arco-scrollbar-type-track.arco-scrollbar-both .arco-scrollbar-track-direction-vertical:after {
    position: absolute;
    right: -1px;
    bottom: 0;
    display: block;
    box-sizing: border-box;
    width: 15px;
    height: 15px;
    background-color: var(--color-neutral-1);
    border-right: 1px solid var(--color-neutral-3);
    border-bottom: 1px solid var(--color-neutral-3);
    content: ""
  }

  .arco-select-dropdown .arco-select-option:not(.arco-select-dropdown .arco-select-option-disabled):hover {
    color: var(--color-text-1);
    background-color: var(--color-fill-2);
    transition: all .1s cubic-bezier(0, 0, 1, 1)
  }

  @keyframes arco-skeleton-circle {
    0% {
      background-position: 100% 50%
    }

    to {
      background-position: 0 50%
    }
  }

  .arco-slider-track:before {
    position: absolute;
    top: 50%;
    display: block;
    width: 100%;
    height: 2px;
    background-color: var(--color-fill-3);
    border-radius: 2px;
    transform: translateY(-50%);
    content: ""
  }

  .arco-slider-track.arco-slider-track-vertical:before {
    top: unset;
    left: 50%;
    width: 2px;
    height: 100%;
    transform: translate(-50%)
  }

  .arco-slider-track.arco-slider-track-disabled:before {
    background-color: var(--color-fill-2)
  }

  .arco-slider-track.arco-slider-track-disabled .arco-slider-btn:after {
    border-color: var(--color-fill-3)
  }

  .arco-slider-btn:after {
    position: absolute;
    top: 0;
    left: 0;
    display: inline-block;
    box-sizing: border-box;
    width: 12px;
    height: 12px;
    background: var(--color-bg-2);
    border: 2px solid rgb(var(--primary-6));
    border-radius: 50%;
    transition: all .3s cubic-bezier(.3, 1.3, .3, 1);
    content: ""
  }

  .arco-slider-btn.arco-slider-btn-active:after,
  .arco-slider-btn:hover:after {
    box-shadow: 0 2px 5px #0000001a;
    transform: scale(1.16666667)
  }

  .arco-space {
    display: inline-flex
  }

  .arco-space-horizontal .arco-space-item {
    display: flex;
    align-items: center
  }

  .arco-space-align-center {
    align-items: center
  }

  @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: translate3D(-280%, 0, 0) 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: translate3D(280%, 0, 0) 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)
    }
  }

  .arco-spin-loading .arco-spin-children:after {
    opacity: 1;
    pointer-events: auto
  }

  .arco-steps-label-horizontal .arco-steps-item:not(:last-child) .arco-steps-item-title:after {
    position: absolute;
    top: 13.5px;
    left: 100%;
    display: block;
    box-sizing: border-box;
    width: 5000px;
    height: 1px;
    background-color: var(--color-neutral-3);
    content: ""
  }

  .arco-steps-label-horizontal .arco-steps-item.arco-steps-item-process .arco-steps-item-title:after {
    background-color: var(--color-neutral-3)
  }

  .arco-steps-label-horizontal .arco-steps-item.arco-steps-item-finish .arco-steps-item-title:after {
    background-color: rgb(var(--primary-6))
  }

  .arco-steps-label-horizontal .arco-steps-item.arco-steps-item-next-error .arco-steps-item-title:after {
    background-color: rgb(var(--danger-6))
  }

  .arco-steps-item:not(:last-child) .arco-steps-item-tail:after {
    display: block;
    width: 100%;
    height: 100%;
    background-color: var(--color-neutral-3);
    content: ""
  }

  .arco-steps-vertical .arco-steps-item:not(:last-child) .arco-steps-item-tail:after {
    display: block;
    width: 100%;
    height: 100%;
    background-color: var(--color-neutral-3);
    content: ""
  }

  .arco-steps-item:not(:last-child).arco-steps-item-finish .arco-steps-item-tail:after {
    background-color: rgb(var(--primary-6))
  }

  .arco-steps-item:not(:last-child).arco-steps-item-next-error .arco-steps-item-tail:after {
    background-color: rgb(var(--danger-6))
  }

  .arco-steps-size-small.arco-steps-label-horizontal .arco-steps-item:not(:last-child) .arco-steps-item-title:after {
    top: 11.5px
  }

  .arco-steps-mode-dot.arco-steps-vertical .arco-steps-item:not(:last-child) .arco-steps-item-tail:after {
    display: block;
    width: 100%;
    height: 100%;
    background-color: var(--color-neutral-3);
    content: ""
  }

  .arco-steps-mode-dot.arco-steps-vertical .arco-steps-item:not(:last-child).arco-steps-item-process .arco-steps-item-tail:after {
    background-color: var(--color-neutral-3)
  }

  .arco-steps-mode-dot.arco-steps-vertical .arco-steps-item:not(:last-child).arco-steps-item-finish .arco-steps-item-tail:after {
    background-color: rgb(var(--primary-6))
  }

  .arco-steps-mode-dot.arco-steps-vertical .arco-steps-item:not(:last-child).arco-steps-item-next-error .arco-steps-item-tail:after {
    background-color: rgb(var(--danger-6))
  }

  .arco-steps-mode-arrow .arco-steps-item-title:after {
    display: none !important
  }

  .arco-steps-mode-arrow .arco-steps-item:not(:first-child):before {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    display: block;
    width: 0;
    height: 0;
    border-top: 36px solid transparent;
    border-bottom: 36px solid transparent;
    border-left: 36px solid var(--color-bg-2);
    content: ""
  }

  .arco-steps-mode-arrow .arco-steps-item:not(:last-child):after {
    position: absolute;
    top: 0;
    right: -36px;
    z-index: 2;
    display: block;
    clear: both;
    width: 0;
    height: 0;
    border-top: 36px solid transparent;
    border-bottom: 36px solid transparent;
    content: ""
  }

  .arco-steps-mode-arrow .arco-steps-item:not(:last-child).arco-steps-item-wait:after {
    border-left: 36px solid var(--color-fill-1)
  }

  .arco-steps-mode-arrow .arco-steps-item:not(:last-child).arco-steps-item-process:after {
    border-left: 36px solid rgb(var(--primary-6))
  }

  .arco-steps-mode-arrow .arco-steps-item:not(:last-child).arco-steps-item-error:after {
    border-left: 36px solid rgb(var(--danger-6))
  }

  .arco-steps-mode-arrow .arco-steps-item:not(:last-child).arco-steps-item-finish:after {
    border-left: 36px solid var(--color-primary-light-1)
  }

  .arco-steps-mode-arrow.arco-steps-size-small .arco-steps-item:not(:first-child):before {
    border-top: 20px solid transparent;
    border-bottom: 20px solid transparent;
    border-left: 20px solid var(--color-bg-2)
  }

  .arco-steps-mode-arrow.arco-steps-size-small .arco-steps-item:not(:last-child):after {
    right: -20px;
    border-top: 20px solid transparent;
    border-bottom: 20px solid transparent;
    border-left: 20px solid var(--color-fill-1)
  }

  .arco-steps-mode-arrow.arco-steps-size-small .arco-steps-item-error:not(:last-child):after {
    border-left: 20px solid rgb(var(--danger-6))
  }

  .arco-steps-mode-arrow.arco-steps-size-small .arco-steps-item:not(:last-child).arco-steps-item-wait:after {
    border-left: 20px solid var(--color-fill-1)
  }

  .arco-steps-mode-arrow.arco-steps-size-small .arco-steps-item:not(:last-child).arco-steps-item-process:after {
    border-left: 20px solid rgb(var(--primary-6))
  }

  .arco-steps-mode-arrow.arco-steps-size-small .arco-steps-item:not(:last-child).arco-steps-item-finish:after {
    border-left: 20px solid var(--color-primary-light-1)
  }

  .arco-steps-mode-navigation.arco-steps-label-horizontal .arco-steps-item:not(:last-child) .arco-steps-item-title:after {
    display: none
  }

  .arco-steps-mode-navigation .arco-steps-item-active:after {
    content: "";
    position: absolute;
    display: block;
    height: 2px;
    left: 0;
    right: 30px;
    bottom: 0;
    background-color: rgb(var(--primary-6))
  }

  .arco-steps-mode-navigation .arco-steps-item-active:last-child:after {
    width: 100%
  }

  .arco-steps-mode-navigation .arco-steps-item:not(:last-child) .arco-steps-item-content:after {
    position: absolute;
    top: 10px;
    right: 30px;
    display: inline-block;
    width: 6px;
    height: 6px;
    background-color: var(--color-bg-2);
    border: 2px solid var(--color-text-4);
    border-bottom: none;
    border-left: none;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    content: ""
  }

  .arco-steps-changeable .arco-steps-item:not(.arco-steps-item-active):not(.arco-steps-item-disabled):hover .arco-steps-item-content .arco-steps-item-title,
  .arco-steps-changeable .arco-steps-item:not(.arco-steps-item-active):not(.arco-steps-item-disabled):hover .arco-steps-item-content .arco-steps-item-description {
    color: rgb(var(--primary-6))
  }

  .arco-steps-line-less .arco-steps-item-title:after {
    display: none !important
  }

  .arco-steps-vertical .arco-steps-item-title:after {
    display: none !important
  }

  .arco-switch-type-line:after {
    display: block;
    width: 100%;
    height: 6px;
    background-color: var(--color-fill-4);
    border-radius: 3px;
    transition: background-color .2s cubic-bezier(.34, .69, .1, 1);
    content: ""
  }

  .arco-switch-type-line.arco-switch-checked:after {
    background-color: rgb(var(--primary-6))
  }

  .arco-switch-type-line.arco-switch-custom-color:after {
    background-color: var(--custom-color)
  }

  .arco-switch-type-line[disabled]:after {
    background-color: var(--color-fill-2)
  }

  .arco-switch-type-line[disabled].arco-switch-checked:after {
    background-color: var(--color-primary-light-3)
  }

  .arco-switch-type-line.arco-switch-loading:after {
    background-color: var(--color-fill-2)
  }

  .arco-switch-type-line.arco-switch-loading.arco-switch-checked:after {
    background-color: var(--color-primary-light-3)
  }

  .arco-table>.arco-spin>.arco-spin-children:after {
    z-index: 2
  }

  .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 #00000026
  }

  .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 #00000026
  }

  .arco-table-col-fixed-left-last:after,
  .arco-table-col-fixed-right-first:after {
    position: absolute;
    top: 0;
    bottom: -1px;
    left: 0;
    width: 10px;
    box-shadow: none;
    transform: translate(-100%);
    transition: box-shadow .1s cubic-bezier(0, 0, 1, 1);
    content: "";
    pointer-events: none
  }

  .arco-table-col-fixed-left-last:after {
    right: 0;
    left: unset;
    transform: translate(100%)
  }

  .arco-table-editable-row:hover .arco-table-cell-wrap-value {
    border: 1px solid var(--color-neutral-3)
  }

  .arco-table .arco-table-expand-btn:hover {
    color: var(--color-text-1);
    background-color: var(--color-neutral-4);
    border-color: transparent
  }

  .arco-table-cell-with-sorter:hover {
    background-color: rgba(var(--gray-4), .5)
  }

  .arco-table-filters:hover {
    background-color: var(--color-neutral-4)
  }

  .arco-table-filters-align-left:hover {
    background: none
  }

  .arco-table-filters-align-left:hover:before,
  .arco-table-filters-align-left.arco-table-filters-open:before {
    background: var(--color-fill-4)
  }

  .arco-table-container:before,
  .arco-table-container:after {
    position: absolute;
    z-index: 1;
    width: 10px;
    height: 100%;
    box-shadow: none;
    transition: box-shadow .1s cubic-bezier(0, 0, 1, 1);
    content: "";
    pointer-events: none
  }

  .arco-table-container:before {
    top: 0;
    left: 0;
    border-top-left-radius: var(--border-radius-medium)
  }

  .arco-table-container:after {
    top: 0;
    right: 0;
    border-top-right-radius: var(--border-radius-medium)
  }

  .arco-table-container:not(.arco-table-has-fixed-col-left).arco-table-scroll-position-right:before,
  .arco-table-container:not(.arco-table-has-fixed-col-left).arco-table-scroll-position-middle:before {
    box-shadow: inset 6px 0 8px -3px #00000026
  }

  .arco-table-container:not(.arco-table-has-fixed-col-right).arco-table-scroll-position-left:after,
  .arco-table-container:not(.arco-table-has-fixed-col-right).arco-table-scroll-position-middle:after {
    box-shadow: inset -6px 0 8px -3px #00000026
  }

  .arco-table:not(.arco-table-empty) .arco-table-header::-webkit-scrollbar {
    height: 0;
    background-color: transparent
  }

  .arco-table-border .arco-table-scroll-y .arco-table-body .arco-table-tr:last-of-type .arco-table-td.arco-table-col-fixed-left-last:after,
  .arco-table-border .arco-table-scroll-y tfoot .arco-table-tr:last-of-type .arco-table-td.arco-table-col-fixed-left-last:after,
  .arco-table-border .arco-table-scroll-y .arco-table-body .arco-table-tr:last-of-type .arco-table-td.arco-table-col-fixed-right-first:after,
  .arco-table-border .arco-table-scroll-y tfoot .arco-table-tr:last-of-type .arco-table-td.arco-table-col-fixed-right-first:after {
    bottom: 0
  }

  .arco-table-stripe:not(.arco-table-dragging) .arco-table-tr:not(.arco-table-tr-empty):not(.arco-table-tr-summary):nth-child(2n) .arco-table-td.arco-table-col-fixed-left:before,
  .arco-table-stripe .arco-table-tr-drag .arco-table-td.arco-table-col-fixed-left:before,
  .arco-table-stripe:not(.arco-table-dragging) .arco-table-tr:not(.arco-table-tr-empty):not(.arco-table-tr-summary):nth-child(2n) .arco-table-td.arco-table-col-fixed-right:before,
  .arco-table-stripe .arco-table-tr-drag .arco-table-td.arco-table-col-fixed-right:before {
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    width: 100%;
    height: 100%;
    background-color: var(--color-fill-1);
    content: ""
  }

  .arco-table-hover:not(.arco-table-dragging) .arco-table-tr:not(.arco-table-tr-empty):not(.arco-table-tr-summary):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:not(.arco-table-dragging) .arco-table-tr:not(.arco-table-tr-empty):not(.arco-table-tr-summary):hover .arco-table-td.arco-table-col-fixed-left:before,
  .arco-table-hover .arco-table-tr-drag .arco-table-td.arco-table-col-fixed-left:before,
  .arco-table-hover:not(.arco-table-dragging) .arco-table-tr:not(.arco-table-tr-empty):not(.arco-table-tr-summary):hover .arco-table-td.arco-table-col-fixed-right:before,
  .arco-table-hover .arco-table-tr-drag .arco-table-td.arco-table-col-fixed-right:before {
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    width: 100%;
    height: 100%;
    background-color: var(--color-fill-1);
    content: ""
  }

  .arco-table-hover .arco-table-tr-expand:not(.arco-table-tr-empty):hover .arco-table-td:not(.arco-table-col-fixed-left):not(.arco-table-col-fixed-right) {
    background-color: var(--color-fill-1)
  }

  .arco-table-tr-expand .arco-table-td .arco-table-hover .arco-table-tr:not(.arco-table-tr-empty) .arco-table-td.arco-table-col-fixed-left:before,
  .arco-table-tr-expand .arco-table-td .arco-table-hover .arco-table-tr:not(.arco-table-tr-empty) .arco-table-td.arco-table-col-fixed-right:before {
    background-color: transparent
  }

  .arco-table-tfoot::-webkit-scrollbar {
    height: 0;
    background-color: transparent
  }

  .arco-icon-hover.arco-tabs-icon-hover:before {
    width: 16px;
    height: 16px
  }

  .arco-tabs-nav:before {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    display: block;
    clear: both;
    height: 1px;
    background-color: var(--color-neutral-3);
    content: ""
  }

  .arco-tabs-tab:hover {
    color: var(--color-text-2);
    font-weight: 400
  }

  .arco-tabs-tab-disabled:hover {
    color: var(--color-text-4);
    cursor: not-allowed
  }

  .arco-tabs-tab-active:hover {
    color: rgb(var(--primary-6));
    font-weight: 500
  }

  .arco-tabs-tab-active:hover.arco-tabs-tab-disabled {
    color: var(--color-primary-light-3)
  }

  .arco-tabs-nav-type-line .arco-tabs-tab-title:before {
    position: absolute;
    top: 0;
    right: -8px;
    bottom: 0;
    left: -8px;
    z-index: -1;
    background-color: transparent;
    border-radius: var(--border-radius-small);
    opacity: 1;
    transition: background-color .2s cubic-bezier(0, 0, 1, 1), opacity .2s cubic-bezier(0, 0, 1, 1);
    content: ""
  }

  .arco-tabs-nav-type-line .arco-tabs-tab:hover .arco-tabs-tab-title:before {
    background-color: var(--color-fill-2)
  }

  .arco-tabs-nav-type-line .arco-tabs-tab-active .arco-tabs-tab-title:before,
  .arco-tabs-nav-type-line .arco-tabs-tab-active:hover .arco-tabs-tab-title:before {
    background-color: transparent
  }

  .arco-tabs-nav-type-line .arco-tabs-tab-disabled .arco-tabs-tab-title:before,
  .arco-tabs-nav-type-line .arco-tabs-tab-disabled:hover .arco-tabs-tab-title:before {
    opacity: 0
  }

  .arco-tabs-nav-type-line .arco-tabs-tab:focus-visible .arco-tabs-tab-title:before {
    border: 2px solid rgb(var(--primary-6))
  }

  .arco-tabs-nav-type-card .arco-tabs-tab-closable:not(.arco-tabs-tab-active):hover .arco-icon-hover:hover:before,
  .arco-tabs-nav-type-card-gutter .arco-tabs-tab-closable:not(.arco-tabs-tab-active):hover .arco-icon-hover:hover:before {
    background-color: var(--color-fill-4)
  }

  .arco-tabs-nav-type-card .arco-tabs-tab:focus-visible:before,
  .arco-tabs-nav-type-card-gutter .arco-tabs-tab:focus-visible:before {
    position: absolute;
    top: -1px;
    right: 0;
    bottom: -1px;
    left: -1px;
    border: 2px solid rgb(var(--primary-6));
    content: ""
  }

  .arco-tabs-nav-type-card .arco-tabs-tab:last-child:focus-visible:before,
  .arco-tabs-nav-type-card-gutter .arco-tabs-tab:last-child:focus-visible:before {
    right: -1px
  }

  .arco-tabs-nav-type-card .arco-tabs-tab:hover {
    background-color: var(--color-fill-3)
  }

  .arco-tabs-nav-type-card .arco-tabs-tab-disabled:hover {
    background-color: transparent
  }

  .arco-tabs-nav-type-card .arco-tabs-tab-active:hover {
    background-color: transparent;
    border-bottom-color: var(--color-bg-2)
  }

  .arco-tabs-nav-type-card-gutter .arco-tabs-tab:hover {
    background-color: var(--color-fill-3)
  }

  .arco-tabs-nav-type-card-gutter .arco-tabs-tab-disabled:hover {
    background-color: var(--color-fill-1)
  }

  .arco-tabs-nav-type-card-gutter .arco-tabs-tab-active:hover {
    background-color: transparent;
    border-bottom-color: var(--color-bg-2)
  }

  .arco-tabs-nav-type-text:before {
    display: none
  }

  .arco-tabs-nav-type-text .arco-tabs-tab:not(:first-of-type):before {
    position: absolute;
    top: 50%;
    left: -9px;
    display: block;
    width: 2px;
    height: 12px;
    background-color: var(--color-fill-3);
    transform: translateY(-50%);
    content: ""
  }

  .arco-tabs-nav-type-text .arco-tabs-tab-title:hover {
    background-color: var(--color-fill-2)
  }

  .arco-tabs-nav-type-text .arco-tabs-tab-active .arco-tabs-tab-title:hover,
  .arco-tabs-nav-type-text .arco-tabs-tab-disabled .arco-tabs-tab-title:hover {
    background-color: transparent
  }

  .arco-tabs-nav-type-text .arco-tabs-tab-active.arco-tabs-nav-type-text .arco-tabs-tab-disabled .arco-tabs-tab-title:hover {
    background-color: var(--color-primary-light-3)
  }

  .arco-tabs-nav-type-text .arco-tabs-tab:focus-visible .arco-tabs-tab-title {
    margin: -2px;
    border: 2px solid rgb(var(--primary-6))
  }

  .arco-tabs-nav-type-rounded:before {
    display: none
  }

  .arco-tabs-nav-type-rounded .arco-tabs-tab:hover {
    background-color: var(--color-fill-2)
  }

  .arco-tabs-nav-type-rounded .arco-tabs-tab-disabled:hover {
    background-color: transparent
  }

  .arco-tabs-nav-type-rounded .arco-tabs-tab-active:hover {
    background-color: var(--color-fill-2)
  }

  .arco-tabs-nav-type-rounded .arco-tabs-tab:focus-visible {
    border-color: rgb(var(--primary-6))
  }

  .arco-tabs-nav-type-capsule:before {
    display: none
  }

  .arco-tabs-nav-type-capsule .arco-tabs-tab:hover {
    background-color: var(--color-bg-2)
  }

  .arco-tabs-nav-type-capsule .arco-tabs-tab-disabled:hover {
    background-color: unset
  }

  .arco-tabs-nav-type-capsule .arco-tabs-tab-active:hover {
    background-color: var(--color-bg-2)
  }

  .arco-tabs-nav-type-capsule .arco-tabs-tab-active:before,
  .arco-tabs-nav-type-capsule .arco-tabs-tab-active:hover:before,
  .arco-tabs-nav-type-capsule .arco-tabs-tab-active+.arco-tabs-tab:before,
  .arco-tabs-nav-type-capsule .arco-tabs-tab-active:hover+.arco-tabs-tab:before {
    opacity: 0
  }

  .arco-tabs-nav-type-capsule .arco-tabs-tab:focus-visible {
    border-color: rgb(var(--primary-6))
  }

  .arco-tabs-nav-type-capsule.arco-tabs-nav-horizontal .arco-tabs-tab:not(:first-of-type):before {
    position: absolute;
    top: 50%;
    left: -4px;
    display: block;
    width: 1px;
    height: 14px;
    background-color: var(--color-fill-3);
    transform: translateY(-50%);
    transition: all .2s cubic-bezier(0, 0, 1, 1);
    content: ""
  }

  .arco-tabs-nav-vertical:before {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: initial;
    clear: both;
    width: 1px;
    height: 100%
  }

  .arco-tabs-nav-right:before {
    right: unset;
    left: 0
  }

  .arco-tabs-nav-vertical.arco-tabs-nav-type-card .arco-tabs-tab-active:hover {
    border-right-color: var(--color-bg-2);
    border-bottom-color: transparent
  }

  .arco-tabs-nav-vertical.arco-tabs-nav-type-card-gutter .arco-tabs-tab-active:hover {
    border-right-color: var(--color-bg-2);
    border-bottom-color: var(--color-neutral-3)
  }

  body[arco-theme=dark] .arco-tabs-nav-type-capsule .arco-tabs-tab:hover {
    background-color: var(--color-fill-3)
  }

  .arco-tag .arco-icon-hover.arco-tag-icon-hover:before {
    width: 16px;
    height: 16px
  }

  .arco-tag .arco-icon-hover.arco-tag-icon-hover:hover:before {
    background-color: var(--color-fill-3)
  }

  .arco-tag-checkable:hover {
    background-color: var(--color-fill-2)
  }

  .arco-tag-checkable.arco-tag-checked:hover {
    background-color: var(--color-fill-3);
    border-color: transparent
  }

  .arco-tag-checkable.arco-tag-checked.arco-tag-bordered:hover {
    border-color: var(--color-border-2)
  }

  .arco-tag.arco-tag-checked.arco-tag-red .arco-icon-hover.arco-tag-icon-hover:hover:before {
    background-color: rgb(var(--red-2))
  }

  .arco-tag.arco-tag-checkable.arco-tag-checked.arco-tag-red.arco-tag:hover {
    background-color: rgb(var(--red-2));
    border-color: transparent
  }

  .arco-tag-checked.arco-tag-red.arco-tag-bordered:hover {
    border-color: rgb(var(--red-6))
  }

  .arco-tag.arco-tag-checked.arco-tag-orangered .arco-icon-hover.arco-tag-icon-hover:hover:before {
    background-color: rgb(var(--orangered-2))
  }

  .arco-tag.arco-tag-checkable.arco-tag-checked.arco-tag-orangered.arco-tag:hover {
    background-color: rgb(var(--orangered-2));
    border-color: transparent
  }

  .arco-tag-checked.arco-tag-orangered.arco-tag-bordered:hover {
    border-color: rgb(var(--orangered-6))
  }

  .arco-tag.arco-tag-checked.arco-tag-orange .arco-icon-hover.arco-tag-icon-hover:hover:before {
    background-color: rgb(var(--orange-2))
  }

  .arco-tag.arco-tag-checkable.arco-tag-checked.arco-tag-orange.arco-tag:hover {
    background-color: rgb(var(--orange-2));
    border-color: transparent
  }

  .arco-tag-checked.arco-tag-orange.arco-tag-bordered:hover {
    border-color: rgb(var(--orange-6))
  }

  .arco-tag.arco-tag-checked.arco-tag-gold .arco-icon-hover.arco-tag-icon-hover:hover:before {
    background-color: rgb(var(--gold-2))
  }

  .arco-tag.arco-tag-checkable.arco-tag-checked.arco-tag-gold.arco-tag:hover {
    background-color: rgb(var(--gold-3));
    border-color: transparent
  }

  .arco-tag-checked.arco-tag-gold.arco-tag-bordered:hover {
    border-color: rgb(var(--gold-6))
  }

  .arco-tag.arco-tag-checked.arco-tag-lime .arco-icon-hover.arco-tag-icon-hover:hover:before {
    background-color: rgb(var(--lime-2))
  }

  .arco-tag.arco-tag-checkable.arco-tag-checked.arco-tag-lime.arco-tag:hover {
    background-color: rgb(var(--lime-2));
    border-color: transparent
  }

  .arco-tag-checked.arco-tag-lime.arco-tag-bordered:hover {
    border-color: rgb(var(--lime-6))
  }

  .arco-tag.arco-tag-checked.arco-tag-green .arco-icon-hover.arco-tag-icon-hover:hover:before {
    background-color: rgb(var(--green-2))
  }

  .arco-tag.arco-tag-checkable.arco-tag-checked.arco-tag-green.arco-tag:hover {
    background-color: rgb(var(--green-2));
    border-color: transparent
  }

  .arco-tag-checked.arco-tag-green.arco-tag-bordered:hover {
    border-color: rgb(var(--green-6))
  }

  .arco-tag.arco-tag-checked.arco-tag-cyan .arco-icon-hover.arco-tag-icon-hover:hover:before {
    background-color: rgb(var(--cyan-2))
  }

  .arco-tag.arco-tag-checkable.arco-tag-checked.arco-tag-cyan.arco-tag:hover {
    background-color: rgb(var(--cyan-2));
    border-color: transparent
  }

  .arco-tag-checked.arco-tag-cyan.arco-tag-bordered:hover {
    border-color: rgb(var(--cyan-6))
  }

  .arco-tag.arco-tag-checked.arco-tag-blue .arco-icon-hover.arco-tag-icon-hover:hover:before {
    background-color: rgb(var(--blue-2))
  }

  .arco-tag.arco-tag-checkable.arco-tag-checked.arco-tag-blue.arco-tag:hover {
    background-color: rgb(var(--blue-2));
    border-color: transparent
  }

  .arco-tag-checked.arco-tag-blue.arco-tag-bordered:hover {
    border-color: rgb(var(--blue-6))
  }

  .arco-tag.arco-tag-checked.arco-tag-arcoblue .arco-icon-hover.arco-tag-icon-hover:hover:before {
    background-color: rgb(var(--arcoblue-2))
  }

  .arco-tag.arco-tag-checkable.arco-tag-checked.arco-tag-arcoblue.arco-tag:hover {
    background-color: rgb(var(--arcoblue-2));
    border-color: transparent
  }

  .arco-tag-checked.arco-tag-arcoblue.arco-tag-bordered:hover {
    border-color: rgb(var(--arcoblue-6))
  }

  .arco-tag.arco-tag-checked.arco-tag-purple .arco-icon-hover.arco-tag-icon-hover:hover:before {
    background-color: rgb(var(--purple-2))
  }

  .arco-tag.arco-tag-checkable.arco-tag-checked.arco-tag-purple.arco-tag:hover {
    background-color: rgb(var(--purple-2));
    border-color: transparent
  }

  .arco-tag-checked.arco-tag-purple.arco-tag-bordered:hover {
    border-color: rgb(var(--purple-6))
  }

  .arco-tag.arco-tag-checked.arco-tag-pinkpurple .arco-icon-hover.arco-tag-icon-hover:hover:before {
    background-color: rgb(var(--pinkpurple-2))
  }

  .arco-tag.arco-tag-checkable.arco-tag-checked.arco-tag-pinkpurple.arco-tag:hover {
    background-color: rgb(var(--pinkpurple-2));
    border-color: transparent
  }

  .arco-tag-checked.arco-tag-pinkpurple.arco-tag-bordered:hover {
    border-color: rgb(var(--pinkpurple-6))
  }

  .arco-tag.arco-tag-checked.arco-tag-magenta .arco-icon-hover.arco-tag-icon-hover:hover:before {
    background-color: rgb(var(--magenta-2))
  }

  .arco-tag.arco-tag-checkable.arco-tag-checked.arco-tag-magenta.arco-tag:hover {
    background-color: rgb(var(--magenta-2));
    border-color: transparent
  }

  .arco-tag-checked.arco-tag-magenta.arco-tag-bordered:hover {
    border-color: rgb(var(--magenta-6))
  }

  .arco-tag.arco-tag-checked.arco-tag-gray .arco-icon-hover.arco-tag-icon-hover:hover:before {
    background-color: rgb(var(--gray-3))
  }

  .arco-tag.arco-tag-checkable.arco-tag-checked.arco-tag-gray.arco-tag:hover {
    background-color: rgb(var(--gray-3));
    border-color: transparent
  }

  .arco-tag-checked.arco-tag-gray.arco-tag-bordered:hover {
    border-color: rgb(var(--gray-6))
  }

  .arco-tag.arco-tag-custom-color .arco-icon-hover.arco-tag-icon-hover:hover:before {
    background-color: #fff3
  }

  body[arco-theme=dark] .arco-tag-checked.arco-tag-red .arco-icon-hover.arco-tag-icon-hover:hover:before {
    background-color: rgba(var(--red-6), .35)
  }

  body[arco-theme=dark] .arco-tag-checkable.arco-tag-checked.arco-tag-red:hover {
    background-color: rgba(var(--red-6), .35)
  }

  body[arco-theme=dark] .arco-tag-checked.arco-tag-orangered .arco-icon-hover.arco-tag-icon-hover:hover:before {
    background-color: rgba(var(--orangered-6), .35)
  }

  body[arco-theme=dark] .arco-tag-checkable.arco-tag-checked.arco-tag-orangered:hover {
    background-color: rgba(var(--orangered-6), .35)
  }

  body[arco-theme=dark] .arco-tag-checked.arco-tag-orange .arco-icon-hover.arco-tag-icon-hover:hover:before {
    background-color: rgba(var(--orange-6), .35)
  }

  body[arco-theme=dark] .arco-tag-checkable.arco-tag-checked.arco-tag-orange:hover {
    background-color: rgba(var(--orange-6), .35)
  }

  body[arco-theme=dark] .arco-tag-checked.arco-tag-gold .arco-icon-hover.arco-tag-icon-hover:hover:before {
    background-color: rgba(var(--gold-6), .35)
  }

  body[arco-theme=dark] .arco-tag-checkable.arco-tag-checked.arco-tag-gold:hover {
    background-color: rgba(var(--gold-6), .35)
  }

  body[arco-theme=dark] .arco-tag-checked.arco-tag-lime .arco-icon-hover.arco-tag-icon-hover:hover:before {
    background-color: rgba(var(--lime-6), .35)
  }

  body[arco-theme=dark] .arco-tag-checkable.arco-tag-checked.arco-tag-lime:hover {
    background-color: rgba(var(--lime-6), .35)
  }

  body[arco-theme=dark] .arco-tag-checked.arco-tag-green .arco-icon-hover.arco-tag-icon-hover:hover:before {
    background-color: rgba(var(--green-6), .35)
  }

  body[arco-theme=dark] .arco-tag-checkable.arco-tag-checked.arco-tag-green:hover {
    background-color: rgba(var(--green-6), .35)
  }

  body[arco-theme=dark] .arco-tag-checked.arco-tag-cyan .arco-icon-hover.arco-tag-icon-hover:hover:before {
    background-color: rgba(var(--cyan-6), .35)
  }

  body[arco-theme=dark] .arco-tag-checkable.arco-tag-checked.arco-tag-cyan:hover {
    background-color: rgba(var(--cyan-6), .35)
  }

  body[arco-theme=dark] .arco-tag-checked.arco-tag-blue .arco-icon-hover.arco-tag-icon-hover:hover:before {
    background-color: rgba(var(--blue-6), .35)
  }

  body[arco-theme=dark] .arco-tag-checkable.arco-tag-checked.arco-tag-blue:hover {
    background-color: rgba(var(--blue-6), .35)
  }

  body[arco-theme=dark] .arco-tag-checked.arco-tag-arcoblue .arco-icon-hover.arco-tag-icon-hover:hover:before {
    background-color: rgba(var(--arcoblue-6), .35)
  }

  body[arco-theme=dark] .arco-tag-checkable.arco-tag-checked.arco-tag-arcoblue:hover {
    background-color: rgba(var(--arcoblue-6), .35)
  }

  body[arco-theme=dark] .arco-tag-checked.arco-tag-purple .arco-icon-hover.arco-tag-icon-hover:hover:before {
    background-color: rgba(var(--purple-6), .35)
  }

  body[arco-theme=dark] .arco-tag-checkable.arco-tag-checked.arco-tag-purple:hover {
    background-color: rgba(var(--purple-6), .35)
  }

  body[arco-theme=dark] .arco-tag-checked.arco-tag-pinkpurple .arco-icon-hover.arco-tag-icon-hover:hover:before {
    background-color: rgba(var(--pinkpurple-6), .35)
  }

  body[arco-theme=dark] .arco-tag-checkable.arco-tag-checked.arco-tag-pinkpurple:hover {
    background-color: rgba(var(--pinkpurple-6), .35)
  }

  body[arco-theme=dark] .arco-tag-checked.arco-tag-magenta .arco-icon-hover.arco-tag-icon-hover:hover:before {
    background-color: rgba(var(--magenta-6), .35)
  }

  body[arco-theme=dark] .arco-tag-checkable.arco-tag-checked.arco-tag-magenta:hover {
    background-color: rgba(var(--magenta-6), .35)
  }

  body[arco-theme=dark] .arco-tag-checked.arco-tag-gray .arco-icon-hover.arco-tag-icon-hover:hover:before {
    background-color: rgba(var(--gray-6), .35)
  }

  body[arco-theme=dark] .arco-tag-checkable.arco-tag-checked.arco-tag-gray:hover {
    background-color: rgba(var(--gray-6), .35)
  }

  .arco-textarea-wrapper:hover {
    background-color: var(--color-fill-3);
    border-color: transparent
  }

  .arco-textarea-wrapper:focus-within {
    z-index: 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-textarea-wrapper.arco-textarea-disabled:hover {
    color: var(--color-text-4);
    background-color: var(--color-fill-2);
    border-color: transparent
  }

  .arco-textarea-wrapper.arco-textarea-error:hover {
    background-color: var(--color-danger-light-2);
    border-color: transparent
  }

  .arco-textarea-wrapper.arco-textarea-error:focus-within {
    z-index: 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-textarea-wrapper:hover .arco-textarea-clear-btn {
    visibility: visible
  }

  .arco-textarea-wrapper:not(.arco-textarea-focus) .arco-textarea-icon-hover:hover:before {
    background-color: var(--color-fill-4)
  }

  .arco-textarea-wrapper:hover .arco-textarea-clear-btn {
    display: block
  }

  .arco-textarea::placeholder {
    color: var(--color-text-3)
  }

  .arco-textarea[disabled]::placeholder {
    color: var(--color-text-4)
  }

  .arco-timepicker-column:hover {
    overflow-y: auto
  }

  .arco-timepicker-column ul:after {
    display: block;
    width: 100%;
    height: 192px;
    content: ""
  }

  .arco-timepicker-cell:not(.arco-timepicker-cell-selected):not(.arco-timepicker-cell-disabled):hover .arco-timepicker-cell-inner {
    background-color: var(--color-fill-2)
  }

  .arco-transfer-view-header-clear-btn:hover:before {
    background-color: var(--color-fill-3)
  }

  .arco-transfer-view .arco-checkbox .arco-icon-hover:hover:before {
    background-color: var(--color-fill-3)
  }

  .arco-transfer-list-item:not(.arco-transfer-list-item-disabled):hover {
    color: var(--color-text-1);
    background-color: var(--color-fill-2)
  }

  .arco-transfer-list-item-remove-btn:hover:before {
    background-color: var(--color-fill-3)
  }

  .arco-transfer-list-item-draggable:before {
    position: absolute;
    right: 0;
    left: 0;
    display: block;
    height: 2px;
    border-radius: 1px;
    content: ""
  }

  .arco-transfer-list-item-gap-bottom:before {
    bottom: -2px;
    background-color: rgb(var(--primary-6))
  }

  .arco-transfer-list-item-gap-top:before {
    top: -2px;
    background-color: rgb(var(--primary-6))
  }

  @keyframes arco-transfer-drag-item-blink {
    0% {
      background-color: var(--color-primary-light-1)
    }

    to {
      background-color: transparent
    }
  }

  .arco-icon-hover.arco-tree-node-icon-hover:before {
    width: 16px;
    height: 16px
  }

  .arco-tree-node-minus-icon:after,
  .arco-tree-node-plus-icon:after {
    position: absolute;
    top: 50%;
    left: 50%;
    display: block;
    width: 6px;
    height: 2px;
    margin-top: -1px;
    margin-left: -3px;
    color: var(--color-text-2);
    background-color: var(--color-text-2);
    border-radius: .5px;
    content: ""
  }

  .arco-tree-node-plus-icon:before {
    position: absolute;
    top: 50%;
    left: 50%;
    display: block;
    width: 2px;
    height: 6px;
    margin-top: -3px;
    margin-left: -1px;
    color: var(--color-text-2);
    background-color: var(--color-text-2);
    border-radius: .5px;
    content: ""
  }

  .arco-tree-node-selected .arco-tree-node-title:hover {
    color: rgb(var(--primary-6));
    transition: color .2s cubic-bezier(0, 0, 1, 1)
  }

  .arco-tree-node-disabled-selectable .arco-tree-node-title:hover,
  .arco-tree-node-disabled .arco-tree-node-title:hover {
    color: var(--color-text-4);
    background: none;
    cursor: not-allowed
  }

  .arco-tree-node-title:hover {
    color: var(--color-text-1);
    background-color: var(--color-fill-2)
  }

  .arco-tree-node-title:hover .arco-tree-node-drag-icon {
    opacity: 1
  }

  .arco-tree-node-title-draggable:before {
    position: absolute;
    top: -2px;
    right: 0;
    left: 0;
    display: block;
    height: 2px;
    border-radius: 1px;
    content: ""
  }

  .arco-tree-node-title-gap-bottom:before {
    top: unset;
    bottom: -2px;
    background-color: rgb(var(--primary-6))
  }

  .arco-tree-node-title-gap-top:before {
    background-color: rgb(var(--primary-6))
  }

  .arco-tree-node-title-dragging:hover {
    color: var(--color-text-4);
    background-color: var(--color-fill-1)
  }

  .arco-tree-show-line .arco-tree-node-indent-block:before {
    position: absolute;
    left: 50%;
    box-sizing: border-box;
    width: 1px;
    border-left: 1px solid var(--color-neutral-3);
    transform: translate(-50%);
    content: "";
    top: -5px;
    bottom: -5px
  }

  .arco-tree-show-line .arco-tree-node-is-leaf:not(.arco-tree-node-is-tail) .arco-tree-node-indent:after {
    position: absolute;
    right: -7px;
    box-sizing: border-box;
    width: 1px;
    border-left: 1px solid var(--color-neutral-3);
    transform: translate(50%);
    content: "";
    top: 27px;
    bottom: -5px
  }

  .arco-tree-show-line .arco-tree-node-indent-block-lineless:before {
    display: none
  }

  .arco-tree-size-mini .arco-tree-node-indent-block:after {
    top: 23px;
    bottom: -1px
  }

  .arco-tree-size-mini .arco-tree-node-is-leaf:not(.arco-tree-node-is-tail) .arco-tree-node-indent:before {
    top: -1px;
    bottom: -1px
  }

  .arco-tree-size-small .arco-tree-node-indent-block:after {
    top: 25px;
    bottom: -3px
  }

  .arco-tree-size-small .arco-tree-node-is-leaf:not(.arco-tree-node-is-tail) .arco-tree-node-indent:before {
    top: -3px;
    bottom: -3px
  }

  .arco-tree-size-large .arco-tree-node-indent-block:after {
    top: 29px;
    bottom: -7px
  }

  .arco-tree-size-large .arco-tree-node-is-leaf:not(.arco-tree-node-is-tail) .arco-tree-node-indent:before {
    top: -7px;
    bottom: -7px
  }

  .arco-typography-operation-copy:hover {
    color: var(--color-text-2);
    background-color: var(--color-fill-2)
  }

  .arco-typography-operation-edit:hover {
    color: var(--color-text-2);
    background-color: var(--color-fill-2)
  }

  .arco-typography-operation-expand:hover {
    color: rgb(var(--primary-5))
  }

  .arco-upload-picture-card:hover {
    color: var(--color-text-2);
    background-color: var(--color-fill-3);
    border-color: var(--color-neutral-4)
  }

  .arco-upload-drag:hover {
    background-color: var(--color-fill-3);
    border-color: var(--color-neutral-4)
  }

  .arco-upload-drag:hover .arco-upload-drag-text {
    color: var(--color-text-1)
  }

  .arco-upload-drag:hover .arco-icon-plus {
    color: var(--color-text-2)
  }

  .arco-upload-disabled .arco-upload-picture-card:hover {
    color: var(--color-text-4);
    background-color: var(--color-fill-1);
    border-color: var(--color-neutral-4);
    cursor: not-allowed
  }

  .arco-upload-disabled .arco-upload-drag:hover {
    background-color: var(--color-fill-1);
    border-color: var(--color-text-4);
    cursor: not-allowed
  }

  .arco-upload-disabled .arco-upload-drag:hover .arco-icon-plus,
  .arco-upload-disabled .arco-upload-drag:hover .arco-upload-drag-text {
    color: var(--color-text-4)
  }

  .arco-upload-icon-upload:active,
  .arco-upload-icon-upload:hover {
    color: rgb(var(--primary-7))
  }

  .arco-upload-list-item .arco-upload-progress:hover .arco-progress-circle-bg {
    stroke: rgba(var(--gray-10), .2)
  }

  .arco-upload-list-item .arco-upload-progress:hover .arco-progress-circle-bar {
    stroke: rgb(var(--primary-7))
  }

  .arco-upload-list-picture-mask:hover {
    opacity: 1
  }

  .arco-upload-list-picture-mask:hover .arco-upload-list-picture-operation {
    display: flex;
    justify-content: space-evenly
  }

  .arco-upload-list-picture-mask:hover .arco-upload-list-picture-error-tip {
    display: none
  }

  body {
    margin: 0
  }

  a {
    text-decoration: none
  }

  .max-container {
    margin: 0 auto;
    width: 100%;
    max-width: 1440px
  }

  @media screen and (max-width:1920px) {
    .max-container {
      max-width: 1440px
    }
  }

  @media screen and (max-width:1280px) {
    .max-container {
      max-width: 1140px
    }
  }

  @media screen and (max-width:992px) {
    .max-container {
      max-width: 960px
    }
  }

  @media screen and (max-width:768px) {
    .max-container {
      max-width: 720px
    }
  }

  @media screen and (max-width:576px) {
    .max-container {
      max-width: 540px
    }
  }

  header[data-v-5e0b1d9d] {
    padding: 18px 20px;
    position: fixed;
    top: 10px;
    left: 0;
    right: 0;
    background: linear-gradient(137deg, #111214bf 4.87%, #0c0d0fe6 75.88%);
    -webkit-backdrop-filter: blur(5px);
    backdrop-filter: blur(5px);
    transform: translateZ(0);
    border: 1px solid var(--Card-Border, hsla(0, 0%, 100%, .06));
    box-shadow: inset 0 1px 1px #ffffff26;
    border-radius: 16px;
    z-index: 100
  }

  header .header-wrapper[data-v-5e0b1d9d] {
    display: flex;
    align-items: center;
    justify-content: space-between
  }

  header .logo[data-v-5e0b1d9d] {
    display: flex;
    align-items: center;
    font-size: 20px;
    font-weight: 600;
    color: #fff;
    cursor: pointer;
    transition: transform .2s ease
  }

  header .logo[data-v-5e0b1d9d]:hover {
    transform: scale(1.02)
  }

  header .logo img[data-v-5e0b1d9d] {
    margin-right: 12px;
    height: 36px
  }

  header .nav-list[data-v-5e0b1d9d] {
    display: flex
  }

  header .nav-list .nav-item[data-v-5e0b1d9d] {
    margin-right: 45px
  }

  header .nav-list .nav-item a[data-v-5e0b1d9d] {
    color: #9c9c9d;
    font-size: 16px;
    font-weight: 500;
    text-decoration: none;
    transition: color .2s ease
  }

  header .nav-list .nav-item a[data-v-5e0b1d9d]:hover {
    color: #fff
  }

  header .nav-list .nav-item.TurboX a[data-v-5e0b1d9d] {
    font-weight: 800
  }

  header .actions .arco-btn[data-v-5e0b1d9d] {
    font-weight: 500;
    color: #fff
  }

  @media screen and (max-width:768px) {
    header[data-v-5e0b1d9d] {
      background: transparent;
      border: 0;
      box-shadow: none;
      top: 0;
      padding: 10px 20px;
      width: calc(100vw - 40px)
    }

    header .header-wrapper .logo[data-v-5e0b1d9d] {
      font-size: 18px
    }

    header .header-wrapper .nav-list[data-v-5e0b1d9d] {
      display: none
    }
  }

  .hero[data-v-aca0ac7a] {
    position: relative;
    margin: 10em 0 8em;
    padding: 4em 0;
    background: url(data:text/html;base64,PCFET0NUWVBFIGh0bWw+CjxodG1sIGxhbmc9ImVuIj4KICA8aGVhZD4KICAgIDxtZXRhIGNoYXJzZXQ9IlVURi04Ij4KICAgIDxsaW5rIHJlbD0iaWNvbiIgaHJlZj0iL2Zhdmljb24uaWNvIj4KICAgIDxtZXRhIG5hbWU9InZpZXdwb3J0IiBjb250ZW50PSJ3aWR0aD1kZXZpY2Utd2lkdGgsIGluaXRpYWwtc2NhbGU9MS4wIj4KICAgIDx0aXRsZT5BVGVybWluYWwgLSDkvaDnmoRTU0jmjbflvoTlt6XlhbfvvIzlv6vpgJ/ov57mjqXml6DpnIDnrYnlvoU8L3RpdGxlPgogICAgPG1ldGEgbmFtZT0iZGVzY3JpcHRpb24iIGNvbnRlbnQ9IuacgOWlveeUqOeahOWcqOe6v1NTSOOAgVNGVFDlt6XlhbfvvIzpmo/ml7bpmo/lnLDmiZPlvIDvvIzmlK/mjIHmlofku7blnKjnur/nvJbovpHjgIHnirbmgIHnm5HmjqfvvIzmlK/mjIHnp4HmnInpg6jnvbLnur/ot6/vvIznu5nkvaDmnIDlpKfnmoTmlbDmja7lronlhajkv53pmpwiPgogICAgPG1ldGEgbmFtZT0ia2V5d29yZHMiIGNvbnRlbnQ9ImF0ZXJtaW5hbCxhdGVybWluYWwubmV0LHRlcm1pbmFsLHNzaCxzZnRwLHNzaOW3peWFtyxzZnRw5bel5YW3LHNzaOe9kemhtSxzc2jov5znqIvlt6Xlhbcsc3No5a6i5oi356uvLHNzaOWcqOe6vyzov57mjqXov5znqIvmnI3liqHlmags5aaC5L2V6L+e5o6l5pyN5Yqh5ZmoLGxpbnV45pyN5Yqh5Zmo6L+e5o6lLOS/ruaUueacjeWKoeWZqOaWh+S7tiI+CiAgICA8c2NyaXB0IHR5cGU9Im1vZHVsZSIgc3JjPSJodHRwczovL3VucGtnLmNvbS9Ac3BsaW5ldG9vbC92aWV3ZXJAMS44LjEvYnVpbGQvc3BsaW5lLXZpZXdlci5qcyI+PC9zY3JpcHQ+CiAgICA8c2NyaXB0IHR5cGU9Im1vZHVsZSIgY3Jvc3NvcmlnaW4gc3JjPSIvYXNzZXRzL2luZGV4LUM3Zk1qYkYxLmpzIj48L3NjcmlwdD4KICAgIDxsaW5rIHJlbD0ic3R5bGVzaGVldCIgY3Jvc3NvcmlnaW4gaHJlZj0iL2Fzc2V0cy9pbmRleC1DdzViTWFWZS5jc3MiPgogIDwvaGVhZD4KICA8Ym9keSBhcmNvLXRoZW1lPSJkYXJrIj4KICAgIDxkaXYgaWQ9ImFwcCI+PC9kaXY+CiAgPC9ib2R5Pgo8L2h0bWw+Cg==)no-repeat center center;
    background-size: cover;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    -webkit-user-select: none;
    user-select: none
  }

  .hero__content[data-v-aca0ac7a] {
    margin-bottom: 10%;
    margin-top: 20%;
    color: #fff
  }

  .hero__title[data-v-aca0ac7a] {
    color: #fff;
    font-size: 46px;
    font-weight: 700;
    line-height: 1.3
  }

  .hero__description[data-v-aca0ac7a] {
    color: #fff9;
    font-size: 20px;
    font-weight: 400;
    line-height: 30px
  }

  .hero__actions[data-v-aca0ac7a] {
    margin-top: 36px;
    display: flex;
    gap: 1rem
  }

  .hero__action[data-v-aca0ac7a] {
    padding: .6rem 1rem;
    border-radius: .5rem;
    background: #fff;
    color: #000;
    font-size: 15px;
    font-weight: 500;
    text-decoration: none;
    display: flex;
    align-items: center;
    box-shadow: 0 0 0 2px #0000, 0 0 14px #ffffff30, inset 0-1px .4px #0003, inset 0 1px .4px #fff
  }

  .hero__action-text[data-v-aca0ac7a] {
    padding: .6rem 1rem;
    font-size: 15px;
    font-weight: 500;
    color: #fff;
    display: flex;
    align-items: center;
    text-decoration: none
  }

  .hero__cover[data-v-aca0ac7a] {
    right: -30px;
    width: 57rem;
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    transform: translateZ(0);
    background: #26262699;
    border-radius: 8px;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, .05)
  }

  .hero__cover img[data-v-aca0ac7a] {
    display: block;
    width: 100%
  }

  .hero-bg[data-v-aca0ac7a] {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: -1
  }

  @media screen and (max-width:768px) {
    .hero__cover[data-v-aca0ac7a] {
      right: -30px;
      width: 200vw
    }
  }

  .card-hover-effect[data-v-c7989cca] {
    margin: auto;
    height: auto;
    position: relative;
    transition: transform .1s ease;
    transform-style: preserve-3d;
    will-change: transform;
    border-radius: 8px;
    overflow: hidden
  }

  .card-hover-effect .hover-effect-shadow[data-v-c7989cca] {
    position: absolute;
    top: calc(var(--shadow-y) - 150px);
    left: calc(var(--shadow-x) - 150px);
    transition: opacity .1s ease;
    width: 300px;
    height: 300px;
    background-color: #bccfff10;
    filter: blur(100px);
    border-radius: 1000px
  }

  .feature-content[data-v-bf1d5e0d] {
    position: relative;
    margin: 0 10%
  }

  .feature-content img[data-v-bf1d5e0d] {
    display: block;
    margin: 0 auto;
    width: 100%
  }

  @media screen and (max-width:768px) {
    .feature-content[data-v-bf1d5e0d] {
      margin: 0
    }
  }

  .section-title[data-v-8599e09a],
  .section-subtitle[data-v-8599e09a] {
    text-align: left
  }

  .feature-content[data-v-8599e09a] {
    position: relative
  }

  .feature-content img[data-v-8599e09a] {
    width: 100%
  }

  @media screen and (max-width:768px) {
    .feature-content[data-v-8599e09a] {
      margin-bottom: 50px
    }
  }

  .section-title[data-v-6f747606],
  .section-subtitle[data-v-6f747606] {
    text-align: left
  }

  .feature-content[data-v-6f747606] {
    position: relative
  }

  .feature-content img[data-v-6f747606] {
    width: 100%
  }

  .section-title[data-v-a1ca9cb9],
  .section-subtitle[data-v-a1ca9cb9] {
    text-align: left
  }

  .feature-content[data-v-a1ca9cb9] {
    position: relative
  }

  .feature-content img[data-v-a1ca9cb9] {
    width: 100%
  }

  @media screen and (max-width:768px) {
    .feature-content[data-v-a1ca9cb9] {
      margin-bottom: 50px
    }
  }

  .section-title[data-v-db64a8ba],
  .section-subtitle[data-v-db64a8ba] {
    text-align: left
  }

  .feature-content[data-v-db64a8ba] {
    position: relative
  }

  .feature-content img[data-v-db64a8ba] {
    width: 100%
  }

  .lightning-bg[data-v-89617bab] {
    display: block;
    margin: 0 auto;
    margin-bottom: -20vw;
    width: 20vw;
    z-index: -1
  }

  footer[data-v-89617bab] {
    -webkit-backdrop-filter: blur(20px);
    backdrop-filter: blur(20px);
    border-top: 1px solid #1b1c1e;
    box-shadow: 0-4px 10px #0000001c;
    transform: translateZ(0);
    padding: 6em 20px 2em
  }

  footer .footer-logo[data-v-89617bab] {
    margin-bottom: 30px;
    display: flex;
    align-items: center;
    font-size: 20px;
    font-weight: 600;
    color: #fff
  }

  footer .footer-logo img[data-v-89617bab] {
    margin-right: 12px;
    height: 40px
  }

  footer .footer-item-list-title[data-v-89617bab] {
    font-size: 20px;
    font-weight: 600;
    color: #fff;
    margin-bottom: 32px
  }

  footer .footer-item[data-v-89617bab] {
    display: block;
    font-size: 16px;
    color: #fff;
    margin-bottom: 14px;
    opacity: .6;
    cursor: pointer;
    transition: all .15s ease-in-out
  }

  footer .footer-item[data-v-89617bab]:hover {
    opacity: 1
  }

  footer .footer-item[data-v-89617bab]:last-child {
    margin-bottom: 50px
  }

  footer .arco-divider[data-v-89617bab] {
    margin-top: 100px;
    border-bottom: 1px solid #1b1c1e
  }

  footer .footer-copyright[data-v-89617bab] {
    opacity: .6;
    color: #fff;
    line-height: 1.8
  }

  .section-title[data-v-c9783ff7],
  .section-subtitle[data-v-c9783ff7] {
    text-align: left
  }

  .feature-content[data-v-c9783ff7] {
    position: relative
  }

  .feature-content img[data-v-c9783ff7] {
    width: 100%
  }

  @media screen and (max-width:768px) {
    .feature-content[data-v-c9783ff7] {
      margin-bottom: 50px
    }
  }

  section {
    padding: 8em 0
  }

  section .section-title {
    margin-bottom: 30px;
    color: #fff;
    text-align: center;
    font-size: 38px;
    font-weight: 700
  }

  section .section-subtitle {
    margin-bottom: 80px;
    color: #fff;
    opacity: .8;
    text-align: center;
    font-size: 20px;
    font-weight: 400;
    line-height: 30px
  }

  @media screen and (max-width:768px) {
    section {
      padding-left: 20px !important;
      padding-right: 20px !important;
      width: calc(100% - 40px) !important
    }

    section .section-title {
      font-size: 28px
    }

    section .section-subtitle {
      font-size: 16px;
      line-height: 24px
    }
  }

  .session-now-item[data-v-1ff304b2]:hover,
  .session-item[data-v-1ff304b2]:hover {
    background: #343434
  }

  .session-now-item:hover .action[data-v-1ff304b2],
  .session-item:hover .action[data-v-1ff304b2] {
    display: block
  }

  .session-now-item .system .current[data-v-1ff304b2]:before,
  .session-item .system .current[data-v-1ff304b2]:before {
    position: relative;
    display: inline-block;
    content: "";
    width: 5px;
    height: 5px;
    border-radius: 5px;
    background: #35cc07;
    margin-right: 5px
  }

  .pro[data-v-c84a6407]:before {
    position: absolute;
    top: -14px;
    left: calc(50% - 24px);
    content: "热门";
    color: #fff;
    background: #2e90ff;
    padding: 4px 12px;
    border-radius: 35px;
    font-weight: 800
  }

  .pay-card[data-v-c84a6407]:hover {
    background: #ffffff08
  }

  .plan-banner[data-v-c84a6407]:before {
    content: "";
    position: absolute;
    top: -10px;
    left: -10px;
    right: -10px;
    bottom: -10px;
    background: url("../../assets/img/img11.jpg")no-repeat center center;
    background-size: cover;
    filter: blur(20px)
  }

  .buy-content-card .arco-radio-group[data-v-c84a6407] .arco-radio .arco-radio-icon-hover:before {
    width: 32px;
    height: 32px
  }

  .buy-content-card .arco-radio-group[data-v-c84a6407] .arco-radio .arco-radio-icon-hover .arco-radio-icon:after {
    width: 14px;
    height: 14px
  }

  .setting-sidebar[data-v-61a055c5] .sidebar-menu .arco-menu-inner .arco-menu-item:hover {
    background: #ffffff0d;
    font-weight: 600
  }

  .download-card[data-v-8d0923ea]:hover {
    background: #ffffff26;
    transform: scale(1.05)
  }