             align-self: stretch;
             &-hidden {
                 position: absolute;
                 visibility: hidden;
                 pointer-events: none;
            }
        }
         .@{tab-prefix-cls}-nav-more {
             position: relative;
             padding: @tabs-card-horizontal-padding;
             background: transparent;
             border: 0;
             &::after {
                 position: absolute;
                 right: 0;
                 bottom: 0;
                 left: 0;
                 height: 5px;
                 transform: translateY(100%);
                 content: '';
            }
        }
         .@{tab-prefix-cls}-nav-add {
             min-width: @tabs-card-height;
             margin-left: @tabs-card-gutter;
             padding: 0 @padding-xs;
             background: @tabs-card-head-background;
             border: @border-width-base @border-style-base @neutral-stroke-2-normal;
             border-radius: @border-radius-base @border-radius-base 0 0;
             outline: none;
             cursor: pointer;
             transition: all @animation-duration-slow @ease-in-out;
             &:hover {
                 color: @brand-fg-1-hover;
            }
             &:active, &:focus {
                 color: @brand-fg-1-active;
            }
        }
    }
     &-extra-content {
         flex: none;
    }
     &-centered {
         > .@{tab-prefix-cls}-nav, > div > .@{tab-prefix-cls}-nav {
             .@{tab-prefix-cls}-nav-wrap {
                 &:not([class*='@{tab-prefix-cls}-nav-wrap-ping']) {
                     justify-content: center;
                }
            }
        }
    }
     &-ink-bar {
         position: absolute;
         background: @brand-stroke-1-normal;
         pointer-events: none;
    }
     &-tab {
         position: relative;
         display: inline-flex;
         align-items: center;
         padding: @tabs-horizontal-padding;
         font-size: @font-size-body-m;
         background: transparent;
         border: 0;
         outline: none;
         color: @neutral-fg-3-normal;
         cursor: pointer;
         &-btn, &-remove {
             &:focus, &:active {
                 color: @brand-fg-1-active;
            }
        }
         &-btn {
             outline: none;
             transition: all 0.3s;
        }
         &-remove {
             flex: none;
             margin-right: -@margin-xss;
             margin-left: @margin-xs;
             color: @neutral-fg-3-normal;
             font-size: @font-size-body-s;
             background: transparent;
             border: none;
             outline: none;
             cursor: pointer;
             transition: all @animation-duration-slow;
             &:hover {
                 color: @brand-bg-1-hover;
            }
        }
         &:hover {
             color: @brand-bg-1-hover;
        }
         &&-active &-btn {
             color: @brand-fg-1-normal;
             text-shadow: 0 0 0.25px currentcolor;
             &:hover {
                 color: @brand-bg-1-hover;
            }
        }
         &&-disabled {
             color: @neutral-fg-disabled;
             cursor: not-allowed;
        }
         &&-disabled &-btn, &&-disabled &-remove {
             &:focus, &:active {
                 color: @neutral-fg-disabled;
            }
        }
         & &-remove .@{iconfont-css-prefix}{
             margin: 0;
        }
         .@{iconfont-css-prefix}{
             margin-right: @margin-sm;
        }
    }
     &-tab + &-tab {
         margin: @tabs-horizontal-margin;
    }
     &-content {
         &-holder {
             flex: auto;
             min-width: 0;
             min-height: 0;
        }
         position: relative;
         width: 100%;
    }
     &-tabpane {
         outline: none;
         &-hidden {
             display: none;
        }
    }
     &-switch {
         &-appear, &-enter {
             transition: none;
             &-start {
                 opacity: 0;
            }
             &-active {
                 opacity: 1;
                 transition: opacity @animation-duration-slow;
            }
        }
         &-leave {
             position: absolute;
             transition: none;
             inset: 0;
             &-start {
                 opacity: 1;
            }
             &-active {
                 opacity: 0;
                 transition: opacity @animation-duration-slow;
            }
        }
    }
}
 @root-entry-name: default;
 @tag-prefix-cls: ~'@{ant-prefix}-tag';
 .@{tag-prefix-cls}{
     .reset-component();
     display: inline-block;
     height: auto;
     margin-right: 8px;
     padding: 0 8px;
     color: @neutral-fg-2-normal;
     font-size: @font-size-body-m;
     line-height: @tag-line-height;
     white-space: nowrap;
     background: @neutral-bg-disabled;
     border: @border-width-base @border-style-base @neutral-stroke-1-normal;
     border-radius: @radius-m;
     opacity: 1;
     transition: all 0.3s;
     &, a, a:hover {
         color: @neutral-fg-2-normal;
    }
     > a:first-child:last-child {
         display: inline-block;
         margin: 0 -8px;
         padding: 0 8px;
    }
     &-close-icon {
         margin-left: 8px;
         font-size: 12px;
         cursor: pointer;
         transition: all 0.3s;
    }
     &-has-color {
         border-color: transparent;
         &, a, a:hover {
             color: @text-color-inverse;
        }
    }
     &-checkable {
         background-color: transparent;
         border-color: transparent;
         cursor: pointer;
         &:not(&-checked):hover {
             color: @neutral-fg-2-normal;
        }
         &:not(&-checked):hover {
             background-color: @neutral-bg-1-hover-2;
        }
         &:active, &-checked {
             color: @brand-fg-1-normal;
             background-color: @brand-bg-2-normal;
             border: 1px solid @brand-stroke-3-normal;
        }
    }
     &-hidden {
         display: none;
    }
     &-blue {
         color: @brand-fg-1-normal;
         background: @brand-bg-2-normal;
         border-color: @brand-stroke-3-normal;
         &-inverse {
             color: @neutral-fg-on-color;
             background: @brand-bg-1-normal;
             border-color: @brand-bg-1-normal;
        }
    }
     &-red {
         color: @status-error-fg-1-normal;
         background: @status-error-bg-2-normal;
         border-color: @status-error-stroke-2-normal;
         &-inverse {
             color: @neutral-fg-on-color;
             background: @status-error-bg-1-normal;
             border-color: @status-error-bg-1-normal;
        }
    }
     &-green {
         color: @status-success-fg-1-normal;
         background: @status-success-bg-2-normal;
         border-color: @status-success-stroke-2-normal;
         &-inverse {
             color: @neutral-fg-on-color;
             background: @status-success-bg-1-normal;
             border-color: @status-success-bg-1-normal;
        }
    }
     &-orange {
         color: @status-warning-fg-1-normal;
         background: @status-warning-bg-2-normal;
         border-color: @status-warning-stroke-2-normal;
         &-inverse {
             color: @neutral-fg-on-color;
             background: @status-warning-bg-1-normal;
             border-color: @status-warning-bg-1-normal;
        }
    }
     .make-status-color-classes(@status, @cssVariableType) {
         @bgColor: 'status-@{cssVariableType}-bg-2-normal';
         @borderColor: 'status-@{cssVariableType}-stroke-2-normal';
         @textColor: 'status-@{cssVariableType}-fg-1-normal';
         &-@{status}{
             color: @@textColor;
             background: @@bgColor;
             border-color: @@borderColor;
        }
    }
     &-processing {
         color: @brand-fg-1-normal;
         background: @brand-bg-2-normal;
         border-color: @brand-stroke-3-normal;
    }
     .make-status-color-classes(success, success);
     .make-status-color-classes(error, error);
     .make-status-color-classes(warning, warning);
     > .@{iconfont-css-prefix}+ span, > span + .@{iconfont-css-prefix}{
         margin-left: 7px;
    }
}
 @tag-prefix-cls: ~'@{ant-prefix}-tag';
 .@{tag-prefix-cls}{
     &&-rtl {
         margin-right: 0;
         margin-left: 8px;
         direction: rtl;
         text-align: right;
    }
     &-close-icon {
         .@{tag-prefix-cls}-rtl & {
             margin-right: 3px;
             margin-left: 0;
        }
    }
     > .@{iconfont-css-prefix}+ span, > span + .@{iconfont-css-prefix}{
         .@{tag-prefix-cls}-rtl& {
             margin-right: 7px;
             margin-left: 0;
        }
    }
}
 @root-entry-name: default;
 @root-entry-name: default;
 @timeline-prefix-cls: ~'@{ant-prefix}-timeline';
 .@{timeline-prefix-cls}{
     .reset-component();
     margin: 0;
     padding: 0;
     list-style: none;
     &-item {
         position: relative;
         margin: 0;
         padding-bottom: @timeline-item-padding-bottom;
         font-size: @font-size-body-m;
         list-style: none;
         &-tail {
             position: absolute;
             top: 10px;
             left: 4px;
             height: calc(100% - 10px);
             border-left: @timeline-width solid @neutral-stroke-2-normal;
        }
         &-pending &-head {
             font-size: @font-size-body-s;
             background-color: transparent;
        }
         &-pending &-tail {
             display: none;
        }
         &-head {
             position: absolute;
             width: 10px;
             height: 10px;
             background-color: @neutral-bg-1-normal;
             border: @timeline-dot-border-width solid transparent;
             border-radius: 100px;
             &-blue {
                 color: @brand-fg-1-normal;
                 border-color: @brand-stroke-1-normal;
            }
             &-red {
                 color: @status-error-fg-1-normal;
                 border-color: @status-error-bg-1-normal;
            }
             &-green {
                 color: @status-success-fg-1-normal;
                 border-color: @status-success-bg-1-normal;
            }
             &-gray {
                 color: @neutral-fg-disabled;
                 border-color: @neutral-stroke-1-normal;
            }
        }
         &-head-custom {
             position: absolute;
             top: 5.5px;
             left: 5px;
             width: auto;
             height: auto;
             margin-top: 0;
             padding: 3px 1px;
             line-height: 1;
             text-align: center;
             border: 0;
             border-radius: 0;
             transform: translate(-50%, -50%);
        }
         &-content {
             position: relative;
             top: -(@font-size-body-m * @line-height-base - @font-size-body-m) + 1px;
             margin: 0 0 0 @margin-lg + 2px;
             word-break: break-word;
             color: @neutral-fg-3-normal;
             font-size: @font-size-body-s;
        }
         &-last {
             > .@{timeline-prefix-cls}-item-tail {
                 display: none;
            }
             > .@{timeline-prefix-cls}-item-content {
                 min-height: 48px;
            }
        }
    }
     &.@{timeline-prefix-cls}-alternate, &.@{timeline-prefix-cls}-right, &.@{timeline-prefix-cls}-label {
         .@{timeline-prefix-cls}-item {
             &-tail, &-head, &-head-custom {
                 left: 50%;
            }
             &-head {
                 margin-left: -4px;
                 &-custom {
                     margin-left: 1px;
                }
            }
             &-left {
                 .@{timeline-prefix-cls}-item-content {
                     left: calc(50% - 4px);
                     width: calc(50% - 14px);
                     text-align: left;
                }
            }
             &-right {
                 .@{timeline-prefix-cls}-item-content {
                     width: calc(50% - 12px);
                     margin: 0;
                     text-align: right;
                }
            }
        }
    }
     &.@{timeline-prefix-cls}-right {
         .@{timeline-prefix-cls}-item-right {
             .@{timeline-prefix-cls}-item-tail, .@{timeline-prefix-cls}-item-head, .@{timeline-prefix-cls}-item-head-custom {
                 left: calc(100% - 4px - @timeline-width);
            }
             .@{timeline-prefix-cls}-item-content {
                 width: calc(100% - 18px);
            }
        }
    }
     &&-pending &-item-last &-item-tail {
         display: block;
         height: calc(100% - 14px);
         border-left: 2px dotted @neutral-stroke-2-normal;
    }
     &&-reverse &-item-last &-item-tail {
         display: none;
    }
     &&-reverse &-item-pending {
         .@{timeline-prefix-cls}-item-tail {
             top: 15px;
             display: block;
             height: calc(100% - 15px);
             border-left: 2px dotted @neutral-stroke-2-normal;
        }
         .@{timeline-prefix-cls}-item-content {
             min-height: 48px;
        }
    }
     &.@{timeline-prefix-cls}-label {
         .@{timeline-prefix-cls}-item-label {
             position: absolute;
             top: -(@font-size-body-m * @line-height-base - @font-size-body-m) + 1px;
             width: calc(50% - 12px);
             text-align: right;
        }
         .@{timeline-prefix-cls}-item-right {
             .@{timeline-prefix-cls}-item-label {
                 left: calc(50% + 14px);
                 width: calc(50% - 14px);
                 text-align: left;
            }
        }
    }
}
 @timeline-prefix-cls: ~'@{ant-prefix}-timeline';
 .@{timeline-prefix-cls}{
     &-rtl {
         direction: rtl;
    }
     &-item {
         &-tail {
             .@{timeline-prefix-cls}-rtl & {
                 right: 4px;
                 left: auto;
                 border-right: @timeline-width solid @timeline-color;
                 border-left: none;
            }
        }
         &-head-custom {
             .@{timeline-prefix-cls}-rtl & {
                 right: 5px;
                 left: auto;
                 transform: translate(50%, -50%);
            }
        }
         &-content {
             .@{timeline-prefix-cls}-rtl & {
                 margin: 0 18px 0 0;
            }
        }
    }
     &.@{timeline-prefix-cls}-alternate, &.@{timeline-prefix-cls}-right, &.@{timeline-prefix-cls}-label {
         .@{timeline-prefix-cls}-item {
             &-tail, &-head, &-head-custom {
                 .@{timeline-prefix-cls}-rtl& {
                     right: 50%;
                     left: auto;
                }
            }
             &-head {
                 .@{timeline-prefix-cls}-rtl& {
                     margin-right: -4px;
                     margin-left: 0;
                }
                 &-custom {
                     .@{timeline-prefix-cls}-rtl& {
                         margin-right: 1px;
                         margin-left: 0;
                    }
                }
            }
             &-left {
                 .@{timeline-prefix-cls}-item-content {
                     .@{timeline-prefix-cls}-rtl& {
                         right: calc(50% - 4px);
                         left: auto;
                         text-align: right;
                    }
                }
            }
             &-right {
                 .@{timeline-prefix-cls}-item-content {
                     .@{timeline-prefix-cls}-rtl& {
                         text-align: left;
                    }
                }
            }
        }
    }
     &.@{timeline-prefix-cls}-right {
         .@{timeline-prefix-cls}-item-right {
             .@{timeline-prefix-cls}-item-tail, .@{timeline-prefix-cls}-item-head, .@{timeline-prefix-cls}-item-head-custom {
                 .@{timeline-prefix-cls}-rtl& {
                     right: 0;
                     left: auto;
                }
            }
             .@{timeline-prefix-cls}-item-content {
                 .@{timeline-prefix-cls}-rtl& {
                     width: 100%;
                     margin-right: 18px;
                     text-align: right;
                }
            }
        }
    }
     &&-pending &-item-last &-item-tail {
         .@{timeline-prefix-cls}-rtl& {
             border-right: 2px dotted @timeline-color;
             border-left: none;
        }
    }
     &&-reverse &-item-pending {
         .@{timeline-prefix-cls}-item-tail {
             .@{timeline-prefix-cls}-rtl& {
                 border-right: 2px dotted @timeline-color;
                 border-left: none;
            }
        }
    }
     &.@{timeline-prefix-cls}-label {
         .@{timeline-prefix-cls}-item-label {
             .@{timeline-prefix-cls}-rtl& {
                 text-align: left;
            }
        }
         .@{timeline-prefix-cls}-item-right {
             .@{timeline-prefix-cls}-item-label {
                 .@{timeline-prefix-cls}-rtl& {
                     right: calc(50% + 14px);
                     text-align: right;
                }
            }
        }
    }
}
 @root-entry-name: default;
 @tooltip-prefix-cls: ~'@{ant-prefix}-tooltip';
 @tooltip-arrow-shadow-width: 3px;
 @tooltip-arrow-rotate-width: sqrt(@tooltip-arrow-width * @tooltip-arrow-width * 2) + @tooltip-arrow-shadow-width * 2;
 @tooltip-arrow-offset-vertical: 5px;
 @tooltip-arrow-offset-horizontal: 13px;
 .@{tooltip-prefix-cls}{
     .reset-component();
     position: absolute;
     z-index: @zindex-tooltip;
     display: block;
     width: max-content;
     width: intrinsic;
     max-width: @tooltip-max-width;
     visibility: visible;
     &-content {
         position: relative;
    }
     &-hidden {
         display: none;
    }
     &-placement-top, &-placement-topLeft, &-placement-topRight {
         padding-bottom: @tooltip-distance;
    }
     &-placement-right, &-placement-rightTop, &-placement-rightBottom {
         padding-left: @tooltip-distance;
    }
     &-placement-bottom, &-placement-bottomLeft, &-placement-bottomRight {
         padding-top: @tooltip-distance;
    }
     &-placement-left, &-placement-leftTop, &-placement-leftBottom {
         padding-right: @tooltip-distance;
    }
     &-inner {
         min-width: 30px;
         min-height: 32px;
         padding: 8px 12px;
         color: @neutral-fg-on-color;
         text-align: left;
         text-decoration: none;
         word-wrap: break-word;
         background-color: @neutral-bg-inverted;
         border-radius: @radius-m;
         box-shadow: @box-shadow-base;
         font-size: @font-size-body-s;
    }
     &-arrow {
         position: absolute;
         z-index: 2;
         display: block;
         width: @tooltip-arrow-rotate-width;
         height: @tooltip-arrow-rotate-width;
         overflow: hidden;
         background: transparent;
         pointer-events: none;
         &-content {
             --antd-arrow-background-color: linear-gradient( to right bottom, @neutral-bg-inverted, @neutral-bg-inverted );
             position: absolute;
             top: 0;
             right: 0;
             bottom: 0;
             left: 0;
             display: block;
             width: @tooltip-arrow-width;
             height: @tooltip-arrow-width;
             margin: auto;
             content: '';
             pointer-events: auto;
             .roundedArrow(@tooltip-arrow-width, 5px);
        }
    }
     &-placement-top &-arrow, &-placement-topLeft &-arrow, &-placement-topRight &-arrow {
         bottom: 0;
         transform: translateY(100%);
         &-content {
             box-shadow: @shadow-3-down;
             transform: translateY((-@tooltip-arrow-rotate-width / 2)) rotate(45deg);
        }
    }
     &-placement-top &-arrow {
         left: 50%;
         transform: translateY(100%) translateX(-50%);
    }
     &-placement-topLeft &-arrow {
         left: @tooltip-arrow-offset-horizontal;
    }
     &-placement-topRight &-arrow {
         right: @tooltip-arrow-offset-horizontal;
    }
     &-placement-right &-arrow, &-placement-rightTop &-arrow, &-placement-rightBottom &-arrow {
         left: 0;
         transform: translateX(-100%);
         &-content {
             box-shadow: @shadow-3-left;
             transform: translateX((@tooltip-arrow-rotate-width / 2)) rotate(135deg);
        }
    }
     &-placement-right &-arrow {
         top: 50%;
         transform: translateX(-100%) translateY(-50%);
    }
     &-placement-rightTop &-arrow {
         top: @tooltip-arrow-offset-vertical;
    }
     &-placement-rightBottom &-arrow {
         bottom: @tooltip-arrow-offset-vertical;
    }
     &-placement-left &-arrow, &-placement-leftTop &-arrow, &-placement-leftBottom &-arrow {
         right: 0;
         transform: translateX(100%);
         &-content {
             box-shadow: @shadow-3-right;
             transform: translateX((-@tooltip-arrow-rotate-width / 2)) rotate(315deg);
        }
    }
     &-placement-left &-arrow {
         top: 50%;
         transform: translateX(100%) translateY(-50%);
    }
     &-placement-leftTop &-arrow {
         top: @tooltip-arrow-offset-vertical;
    }
     &-placement-leftBottom &-arrow {
         bottom: @tooltip-arrow-offset-vertical;
    }
     &-placement-bottom &-arrow, &-placement-bottomLeft &-arrow, &-placement-bottomRight &-arrow {
         top: 0;
         transform: translateY(-100%);
         &-content {
             box-shadow: @shadow-3-up;
             transform: translateY((@tooltip-arrow-rotate-width / 2)) rotate(225deg);
        }
    }
     &-placement-bottom &-arrow {
         left: 50%;
         transform: translateY(-100%) translateX(-50%);
    }
     &-placement-bottomLeft &-arrow {
         left: @tooltip-arrow-offset-horizontal;
    }
     &-placement-bottomRight &-arrow {
         right: @tooltip-arrow-offset-horizontal;
    }
}
 .generator-tooltip-preset-color(@i: length(@preset-colors)) when (@i > 0) {
     .generator-tooltip-preset-color(@i - 1);
     @color: extract(@preset-colors, @i);
     @lightColor: '@{color}-6';
     .@{tooltip-prefix-cls}-@{color}{
         .@{tooltip-prefix-cls}-inner {
             background-color: @@lightColor;
        }
         .@{tooltip-prefix-cls}-arrow {
             &-content::before {
                 background: @@lightColor;
            }
        }
    }
}
 .generator-tooltip-preset-color();
 @tooltip-prefix-cls: ~'@{ant-prefix}-tooltip';
 .@{tooltip-prefix-cls}{
     &-rtl {
         direction: rtl;
    }
     &-inner {
         .@{tooltip-prefix-cls}-rtl & {
             text-align: right;
        }
    }
}
 @root-entry-name: default;
 @transfer-prefix-cls: ~'@{ant-prefix}-transfer';
 @table-prefix-cls: ~'@{ant-prefix}-table';
 @input-prefix-cls: ~'@{ant-prefix}-input';
 .@{transfer-prefix-cls}-customize-list {
     .@{transfer-prefix-cls}-list {
         flex: 1 1 50%;
         width: auto;
         height: auto;
         min-height: @transfer-list-height;
    }
     .@{table-prefix-cls}-wrapper {
         .@{table-prefix-cls}-small {
             border: 0;
             border-radius: 0;
             .@{table-prefix-cls}-selection-column {
                 width: 40px;
                 min-width: 40px;
            }
             > .@{table-prefix-cls}-content {
                 > .@{table-prefix-cls}-body > table > .@{table-prefix-cls}-thead > tr > th {
                     background: @neutral-bg-1-hover-1;
                }
                 .@{table-prefix-cls}-row:last-child td {
                     border-bottom: @border-width-base @border-style-base @neutral-stroke-2-normal;
                }
            }
             .@{table-prefix-cls}-body {
                 margin: 0;
            }
        }
         .@{table-prefix-cls}-pagination.@{ant-prefix}-pagination {
             margin: 16px 0 4px;
        }
    }
     .@{input-prefix-cls}{
         &[disabled] {
             background-color: transparent;
        }
    }
}
 @transfer-prefix-cls: ~'@{ant-prefix}-transfer';
 .transfer-status-color(@color) {
     .@{transfer-prefix-cls}-list {
         border-color: @color;
         &-search:not([disabled]) {
             border-color: @input-border-color;
             &:hover {
                 .hover();
            }
             &:focus {
                 .active();
            }
        }
    }
}
 .@{transfer-prefix-cls}{
     &-status-error {
         .transfer-status-color(@error-color);
    }
     &-status-warning {
         .transfer-status-color(@warning-color);
    }
}
 @transfer-prefix-cls: ~'@{ant-prefix}-transfer';
 @transfer-header-vertical-padding: ceil( ((@transfer-header-height - 1px - @font-size-base * @line-height-base) / 2) );
 .@{transfer-prefix-cls}{
     .reset-component();
     position: relative;
     display: flex;
     align-items: stretch;
     &-disabled {
         .@{transfer-prefix-cls}-list {
             background: @component-background 
        }
    }
     &-list {
         display: flex;
         flex-direction: column;
         width: 180px;
         height: @transfer-list-height;
         border: @border-width-base @border-style-base @neutral-stroke-2-normal;
         border-radius: @radius-m;
         &-with-pagination {
             width: 250px;
             height: auto;
        }
         &-search {
             .anticon-search {
                 color: @neutral-fg-3-normal;
            }
        }
         &-checkall {
             width: 100%;
             height: 40px;
             padding: 6px 12px;
             transition: all .3s;
        }
         &-header {
             display: flex;
             flex: none;
             align-items: center;
             height: @transfer-header-height;
             padding: 8px 16px;
             color: @neutral-fg-1-normal;
             background: @neutral-bg-4-hover;
             border-bottom: @border-width-base @border-style-base @neutral-stroke-2-normal;
             border-radius: @radius-m @radius-m 0 0;
             font-weight: @font-weight-bold;
             position: relative;
             > *:not(:last-child) {
                 margin-right: 4px;
            }
             > * {
                 flex: none;
            }
             &-title {
                 overflow: hidden;
                 white-space: nowrap;
                 text-overflow: ellipsis;
            }
             &-dropdown {
                 font-size: 10px;
                 transform: translateY(10%);
                 cursor: pointer;
                 &[disabled] {
                     cursor: not-allowed;
                }
            }
             &-clearall {
                 min-width: 48px;
                 width: 48px;
                 height: 24px;
                 position: absolute;
                 right: 4px;
                 top: 10px 
            }
        }
         &-body {
             display: flex;
             flex: auto;
             flex-direction: column;
             overflow: hidden;
             font-size: @font-size-body-m;
             &-search-wrapper {
                 position: relative;
                 flex: none;
                 padding: @padding-sm;
            }
        }
         &-content {
             flex: auto;
             margin: 0;
             padding: 0;
             overflow: auto;
             list-style: none;
             &-item {
                 display: flex;
                 align-items: center;
                 min-height: @transfer-item-height;
                 padding: @transfer-item-padding-vertical @control-padding-horizontal;
                 line-height: @transfer-item-height - 2 * @transfer-item-padding-vertical;
                 transition: all 0.3s;
                 height: 40px;
                 > *:not(:last-child) {
                     margin-right: 8px;
                }
                 > * {
                     flex: none;
                }
                 &-text {
                     flex: auto;
                     overflow: hidden;
                     white-space: nowrap;
                     text-overflow: ellipsis;
                }
                 &-remove {
                     width: 16px;
                     height: 16px;
                     position: relative;
                     color: @neutral-fg-3-normal;
                     cursor: pointer;
                     transition: all 0.3s;
                     font-size: @font-size-body-m + 2px;
                     z-index:2;
                     svg {
                         fill: currentColor;
                    }
                     &::after {
                         position: absolute;
                         top: -@transfer-item-padding-vertical;
                         right: -50%;
                         bottom: -@transfer-item-padding-vertical;
                         left: -50%;
                         border-radius: 4px;
                         z-index: -1;
                         transition: opacity .3s;
                         content: '';
                    }
                }
            }
             &-item:not(&-item-disabled) {
                 &:hover {
                     background-color: @neutral-bg-1-hover-1;
                     cursor: pointer;
                }
                 &.@{transfer-prefix-cls}-list-content-item-checked:hover {
                     background-color: @neutral-bg-1-hover-1;
                }
            }
             &-item-disabled {
                 color: @neutral-fg-disabled;
                 cursor: not-allowed;
            }
        }
         &-pagination {
             padding: @padding-xs 0;
             text-align: right;
        }
         &-body-not-found {
             flex: none;
             width: 100%;
             margin: auto 0;
             text-align: center;
        }
    }
     &-operation {
         display: flex;
         flex: none;
         flex-direction: column;
         align-self: center;
         margin: 0 8px;
         vertical-align: middle;
         .@{ant-prefix}-btn {
             display: block;
             &:first-child {
                 margin-bottom: 4px;
            }
             .@{iconfont-css-prefix}{
                 font-size: 12px;
            }
        }
    }
     .@{ant-prefix}-empty-image {
         max-height: (@transfer-header-height / 2) - 22;
    }
}
 @transfer-prefix-cls: ~'@{ant-prefix}-transfer';
 .@{transfer-prefix-cls}{
     &-rtl {
         direction: rtl;
    }
     &-list {
         &-search {
             .@{transfer-prefix-cls}-rtl & {
                 padding-right: @control-padding-horizontal-sm;
                 padding-left: 24px;
            }
             &-action {
                 .@{transfer-prefix-cls}-rtl & {
                     right: auto;
                     left: 12px;
                }
            }
        }
         &-header {
             > *:not(:last-child) {
                 .@{transfer-prefix-cls}-rtl & {
                     margin-right: 0;
                     margin-left: 4px;
                }
            }
             .@{transfer-prefix-cls}-rtl & {
                 right: 0;
                 left: auto;
            }
             &-title {
                 .@{transfer-prefix-cls}-rtl & {
                     text-align: left;
                }
            }
        }
         &-content {
             &-item {
                 > *:not(:last-child) {
                     .@{transfer-prefix-cls}-rtl & {
                         margin-right: 0;
                         margin-left: 8px;
                    }
                }
            }
        }
         &-pagination {
             .@{transfer-prefix-cls}-rtl & {
                 text-align: left;
            }
        }
         &-footer {
             .@{transfer-prefix-cls}-rtl & {
                 right: 0;
                 left: auto;
            }
        }
    }
}
 @root-entry-name: default;
 @tree-prefix-cls: ~'@{ant-prefix}-tree';
 @select-tree-prefix-cls: ~'@{ant-prefix}-select-tree';
 @tree-motion: ~'@{ant-prefix}-motion-collapse';
 @tree-node-padding: (@padding-xs / 2);
 @tree-node-hightlight-color: inherit;
 @tree-node-highlight-color: @tree-node-hightlight-color;
 .antTreeSwitcherIcon(@type: 'tree-default-open-icon') {
     .@{tree-prefix-cls}-switcher-icon, .@{select-tree-prefix-cls}-switcher-icon {
         display: inline-block;
         font-size: 10px;
         vertical-align: baseline;
         svg {
             transition: transform 0.3s;
        }
    }
}
 .drop-indicator() {
     .@{tree-prefix-cls}-drop-indicator {
         position: absolute;
         z-index: 1;
         height: 2px;
         background-color: @primary-color;
         border-radius: 1px;
         pointer-events: none;
         &::after {
             position: absolute;
             top: -3px;
             left: -6px;
             width: 8px;
             height: 8px;
             background-color: transparent;
             border: 2px solid @primary-color;
             border-radius: 50%;
             content: '';
        }
    }
}
 .antTreeFn(@custom-tree-prefix-cls) {
     @custom-tree-node-prefix-cls: ~'@{custom-tree-prefix-cls}-treenode';
     .reset-component();
     background: @tree-bg;
     border-radius: @radius-m;
     transition: background-color 0.3s;
     &-focused:not(:hover):not(&-active-focused) {
         background: @primary-1;
    }
     &-list-holder-inner {
         align-items: flex-start;
    }
     &.@{custom-tree-prefix-cls}-block-node {
         .@{custom-tree-prefix-cls}-list-holder-inner {
             align-items: stretch;
             .@{custom-tree-prefix-cls}-node-content-wrapper {
                 flex: auto;
            }
             .@{custom-tree-node-prefix-cls}.dragging {
                 position: relative;
                 &::after {
                     position: absolute;
                     top: 0;
                     right: 0;
                     bottom: @tree-node-padding;
                     left: 0;
                     border: 1px solid @primary-color;
                     opacity: 0;
                     animation: ant-tree-node-fx-do-not-use 0.3s;
                     animation-play-state: running;
                     animation-fill-mode: forwards;
                     content: '';
                     pointer-events: none;
                }
            }
        }
    }
     .@{custom-tree-node-prefix-cls}{
         display: flex;
         align-items: flex-start;
         padding: 0 0 0 @tree-node-padding;
         outline: none;
         height: @tree-node-height;
         width:100%;
         box-sizing: border-box;
         margin-bottom: 4px;
         &-disabled {
             .@{custom-tree-prefix-cls}-node-content-wrapper {
                 color: @neutral-fg-disabled;
                 cursor: not-allowed;
                 &:hover {
                     background: transparent;
                }
            }
        }
         &-active .@{custom-tree-prefix-cls}-node-content-wrapper {
             background: @neutral-bg-1-hover-1;
        }
         &:not(&-disabled).filter-node .@{custom-tree-prefix-cls}-title {
             color: @neutral-fg-2-normal;
             font-weight: 500;
        }
         &-draggable {
             .@{custom-tree-prefix-cls}-draggable-icon {
                 width: @tree-title-height;
                 line-height: @tree-node-height;
                 text-align: center;
                 visibility: visible;
                 opacity: 0.2;
                 transition: opacity @animation-duration-slow;
                 .@{custom-tree-node-prefix-cls}:hover & {
                     opacity: 0.45;
                }
            }
             &.@{custom-tree-node-prefix-cls}-disabled {
                 .@{custom-tree-prefix-cls}-draggable-icon {
                     visibility: hidden;
                }
            }
        }
         &:hover {
             background: @neutral-bg-1-hover-1;
             .@{custom-tree-prefix-cls}-switcher {
                 background: none;
            }
        }
         &-selected {
             background: @brand-bg-2-selected !important;
             &:hover {
                 background: @neutral-bg-1-hover-1;
            }
        }
    }
     &-indent {
         align-self: stretch;
         white-space: nowrap;
         user-select: none;
         &-unit {
             display: inline-block;
             width: @tree-title-height;
        }
    }
     &-draggable-icon {
         visibility: hidden;
    }
     &-switcher {
         .antTreeSwitcherIcon();
         display: flex;
         align-items: center;
         position: relative;
         flex: none;
         align-self: stretch;
         margin: 0;
         line-height: @tree-node-height;
         text-align: center;
         cursor: pointer;
         user-select: none;
         height: @tree-node-height;
         color: @neutral-fg-3-normal;
         svg {
             fill: currentColor 
        }
         &-noop {
             width: 16px;
             cursor: default;
        }
         &_close {
             .@{custom-tree-prefix-cls}-switcher-icon {
                 svg {
                     transform: rotate(-90deg);
                }
            }
        }
         &-loading-icon {
             color: @primary-color;
        }
         &-leaf-line {
             position: relative;
             z-index: 1;
             display: inline-block;
             width: 100%;
             height: 100%;
             &::before {
                 position: absolute;
                 top: 0;
                 right: 12px;
                 bottom: -@tree-node-padding;
                 margin-left: -1px;
                 border-right: 1px solid @normal-color;
                 content: ' ';
            }
             &::after {
                 position: absolute;
                 width: @tree-title-height - 14px;
                 height: @tree-node-height - 10px;
                 border-bottom: 1px solid @normal-color;
                 content: ' ';
            }
        }
    }
     &-checkbox {
         top: initial;
         margin: ((@tree-node-height - @checkbox-size) / 2) 0 0 4px;
    }
     & &-node-content-wrapper {
         display: flex;
         position: relative;
         z-index: auto;
         min-height: @tree-node-height;
         margin: 0;
         padding: 0 4px;
         color: inherit;
         line-height: @tree-node-height;
         background: transparent;
         border-radius: @radius-m;
         cursor: pointer;
         transition: background-color 0.3s, border 0s, line-height 0s, box-shadow 0s;
         .@{custom-tree-prefix-cls}-iconEle {
             display: flex;
             height: @tree-node-height;
             align-items: center;
             padding-right: 4px;
             color: @neutral-fg-3-normal;
             svg {
                 fill: currentColor 
            }
             &:empty {
                 display: none;
            }
        }
    }
     &-unselectable &-node-content-wrapper:hover {
         background-color: transparent;
    }
     &-node-content-wrapper {
         line-height: @tree-node-height;
         user-select: none;
         .drop-indicator();
    }
     .@{custom-tree-node-prefix-cls}.drop-container {
         > [draggable] {
             box-shadow: 0 0 0 2px @primary-color;
        }
    }
     &-show-line {
         .@{custom-tree-prefix-cls}-indent {
             &-unit {
                 position: relative;
                 height: 100%;
                 &::before {
                     position: absolute;
                     top: 0;
                     right: (@tree-title-height / 2);
                     bottom: -@tree-node-padding;
                     border-right: 1px solid @neutral-stroke-2-normal;
                     content: '';
                }
                 &-end {
                     &::before {
                         display: none;
                    }
                }
            }
        }
         .@{custom-tree-prefix-cls}-switcher {
             background: @component-background;
             &-line-icon {
                 vertical-align: -0.15em;
            }
        }
    }
     .@{custom-tree-node-prefix-cls}-leaf-last {
         .@{custom-tree-prefix-cls}-switcher {
             &-leaf-line {
                 &::before {
                     top: auto !important;
                     bottom: auto !important;
                     height: @tree-node-height - 10px !important;
                }
            }
        }
    }
}
 @keyframes ant-tree-node-fx-do-not-use {
     0% {
         opacity: 0;
    }
     100% {
         opacity: 1;
    }
}
 @tree-select-prefix-cls: ~'@{ant-prefix}-tree-select';
 @select-tree-prefix-cls: ~'@{ant-prefix}-select-tree';
 .antCheckboxFn(@checkbox-prefix-cls: ~'@{select-tree-prefix-cls}-checkbox');
 .@{tree-select-prefix-cls}{
     &-dropdown {
         padding: @padding-xs (@padding-xs / 2);
         max-height: 280px !important;
         &-rtl {
             direction: rtl;
        }
         .@{select-tree-prefix-cls}{
             border-radius: 0;
             &-list-holder-inner {
                 align-items: stretch;
                 .@{select-tree-prefix-cls}-treenode {
                     .@{select-tree-prefix-cls}-node-content-wrapper {
                         flex: auto;
                    }
                }
            }
        }
    }
}
 .@{select-tree-prefix-cls}{
     .antTreeFn(@select-tree-prefix-cls);
     & &-switcher {
         &_close {
             .@{select-tree-prefix-cls}-switcher-icon {
                 svg {
                     .@{tree-select-prefix-cls}-dropdown-rtl & {
                         transform: rotate(90deg);
                    }
                }
            }
        }
         &-loading-icon {
             .@{tree-select-prefix-cls}-dropdown-rtl & {
                 transform: scaleY(-1);
            }
        }
    }
}
 @root-entry-name: default;
 @tree-prefix-cls: ~'@{ant-prefix}-tree';
 .@{tree-prefix-cls}.@{tree-prefix-cls}-directory {
     .@{tree-prefix-cls}-treenode {
         position: relative;
         &::before {
             position: absolute;
             top: 0;
             right: 0;
             bottom: 4px;
             left: 0;
             transition: background-color 0.3s;
             content: '';
             pointer-events: none;
             height: @tree-node-height;
        }
         > * {
             z-index: 1;
        }
         .@{tree-prefix-cls}-switcher {
             transition: all 0.3s;
        }
         .@{tree-prefix-cls}-node-content-wrapper {
             border-radius: 0;
             user-select: none;
             width: 100%;
             &:hover {
                 background: transparent;
            }
             &.@{tree-prefix-cls}-node-selected {
                 background: transparent;
            }
        }
         &-selected {
             .@{tree-prefix-cls}-node-content-wrapper {
                 background: transparent;
            }
             &::before {
                 background-color: transparent !important;
            }
        }
    }
}
 @tree-prefix-cls: ~'@{ant-prefix}-tree';
 @tree-node-prefix-cls: ~'@{tree-prefix-cls}-treenode';
 .antCheckboxFn(@checkbox-prefix-cls: ~'@{ant-prefix}-tree-checkbox');
 .@{tree-prefix-cls}{
     .antTreeFn(@tree-prefix-cls);
}
 @tree-prefix-cls: ~'@{ant-prefix}-tree';
 @select-tree-prefix-cls: ~'@{ant-prefix}-select-tree';
 @tree-node-prefix-cls: ~'@{tree-prefix-cls}-treenode';
 .@{tree-prefix-cls}{
     &-rtl {
         direction: rtl;
         .@{tree-prefix-cls}-node-content-wrapper[draggable='true'] {
             .@{tree-prefix-cls}-drop-indicator {
                 &::after {
                     right: -6px;
                     left: unset;
                }
            }
        }
    }
     .@{tree-node-prefix-cls}{
         &-rtl {
             direction: rtl;
        }
    }
     &-switcher {
         &_close {
             .@{tree-prefix-cls}-switcher-icon {
                 svg {
                     .@{tree-prefix-cls}-rtl & {
                         transform: rotate(90deg);
                    }
                }
            }
        }
    }
     &-show-line {
         .@{tree-prefix-cls}-indent {
             &-unit {
                 &::before {
                     .@{tree-prefix-cls}-rtl& {
                         right: auto;
                         left: -(@tree-title-height / 2) - 1px;
                         border-right: none;
                         border-left: 1px solid @border-color-base;
                    }
                }
            }
        }
    }
     &-checkbox {
         .@{tree-prefix-cls}-rtl & {
             margin: ((@tree-title-height - @checkbox-size) / 2) 0 0 8px;
        }
    }
}
 .@{select-tree-prefix-cls}{
     &-checkbox {
         .@{tree-prefix-cls}-select-dropdown-rtl & {
             margin: ((@tree-title-height - @checkbox-size) / 2) 0 0 8px;
        }
    }
}
 @root-entry-name: default;
 @typography-prefix-cls: ~'@{ant-prefix}-typography';
 .@{typography-prefix-cls}{
     color: @neutral-fg-2-normal;
     word-break: break-word;
     &&-secondary {
         color: @neutral-fg-3-normal;
    }
     &&-success {
         color: @status-success-fg-1-normal;
    }
     &&-warning {
         color: @status-warning-fg-1-normal;
    }
     &&-danger {
         color: @status-error-fg-1-normal;
         a&:active, a&:focus {
             color: @status-error-fg-1-active;
        }
         a&:hover {
             color: @status-error-fg-1-hover;
        }
    }
     &&-disabled {
         color: @neutral-fg-disabled;
         cursor: not-allowed;
         user-select: none;
    }
     div&, p {
         .typography-paragraph();
    }
     h1&, div&-h1, div&-h1 > textarea, h1 {
         .typography-title-1();
    }
     h2&, div&-h2, div&-h2 > textarea, h2 {
         .typography-title-2();
    }
     h3&, div&-h3, div&-h3 > textarea, h3 {
         .typography-title-3();
    }
     h4&, div&-h4, div&-h4 > textarea, h4 {
         .typography-title-4();
    }
     h5&, div&-h5, div&-h5 > textarea, h5 {
         .typography-title-5();
    }
     h1&, h2&, h3&, h4&, h5& {
         .@{typography-prefix-cls}+ & {
             margin-top: @typography-title-margin-top;
        }
    }
     div, ul, li, p, h1, h2, h3, h4, h5 {
         + h1, + h2, + h3, + h4, + h5 {
             margin-top: @typography-title-margin-top;
        }
    }
     a&-ellipsis, span&-ellipsis {
         display: inline-block;
         max-width: 100%;
    }
     a&, a {
         .operation-unit();
         text-decoration: @link-decoration;
         &:active, &:hover {
             text-decoration: @link-hover-decoration;
        }
         &[disabled], &.@{typography-prefix-cls}-disabled {
             color: @neutral-fg-disabled;
             cursor: not-allowed;
             &:active, &:hover {
                 color: @neutral-fg-disabled;
            }
             &:active {
                 pointer-events: none;
            }
        }
    }
     code {
         margin: 0 0.2em;
         padding: 0.2em 0.4em 0.1em;
         font-size: 85%;
         background: rgba(150, 150, 150, 0.1);
         border: 1px solid rgba(100, 100, 100, 0.2);
         border-radius: 3px;
    }
     kbd {
         margin: 0 0.2em;
         padding: 0.15em 0.4em 0.1em;
         font-size: 90%;
         background: rgba(150, 150, 150, 0.06);
         border: 1px solid rgba(100, 100, 100, 0.2);
         border-bottom-width: 2px;
         border-radius: 3px;
    }
     mark {
         padding: 0;
         background-color: @gold-3;
    }
     u, ins {
         text-decoration: underline;
         text-decoration-skip-ink: auto;
    }
     s, del {
         text-decoration: line-through;
    }
     strong {
         font-weight: 600;
    }
     &-expand, &-edit, &-copy {
         .operation-unit();
         margin-left: 4px;
    }
     &-copy-success {
         &, &:hover, &:focus {
             color: @success-color;
        }
    }
     &-edit-content {
         position: relative;
         div& {
             left: -@input-padding-horizontal - 1px;
             margin-top: -@input-padding-vertical-base - 1px;
             margin-bottom: calc(1em - @input-padding-vertical-base - 1px);
        }
         &-confirm {
             position: absolute;
             right: 10px;
             bottom: 8px;
             color: @neutral-fg-3-normal;
             font-weight: normal;
             font-size: @font-size-body-m;
             font-style: normal;
             pointer-events: none;
        }
         textarea {
             height: 1em;
             margin: 0 !important;
             -moz-transition: none;
        }
    }
     ul, ol {
         margin: 0 0 1em;
         padding: 0;
         li {
             margin: 0 0 0 20px;
             padding: 0 0 0 4px;
        }
    }
     ul {
         list-style-type: circle;
         ul {
             list-style-type: disc;
        }
    }
     ol {
         list-style-type: decimal;
    }
     pre, blockquote {
         margin: 1em 0;
    }
     pre {
         padding: 0.4em 0.6em;
         white-space: pre-wrap;
         word-wrap: break-word;
         background: rgba(150, 150, 150, 0.1);
         border: 1px solid rgba(100, 100, 100, 0.2);
         border-radius: 3px;
         code {
             display: inline;
             margin: 0;
             padding: 0;
             font-size: inherit;
             font-family: inherit;
             background: transparent;
             border: 0;
        }
    }
     blockquote {
         padding: 0 0 0 0.6em;
         border-left: 4px solid rgba(100, 100, 100, 0.2);
         opacity: 0.85;
    }
     &-single-line {
         white-space: nowrap;
    }
     &-ellipsis-single-line {
         overflow: hidden;
         text-overflow: ellipsis;
         a&, span& {
             vertical-align: bottom;
        }
    }
     &-ellipsis-multiple-line {
         display: -webkit-box;
         overflow: hidden;
         -webkit-line-clamp: 3;
         -webkit-box-orient: vertical;
    }
}
 @typography-prefix-cls: ~'@{ant-prefix}-typography';
 .@{typography-prefix-cls}{
     &-rtl {
         direction: rtl;
    }
     &-expand, &-edit, &-copy {
         .@{typography-prefix-cls}-rtl & {
             margin-right: 4px;
             margin-left: 0;
        }
    }
     &-expand {
         .@{typography-prefix-cls}-rtl & {
             float: left;
        }
    }
     &-edit-content {
         div& {
             &.@{typography-prefix-cls}-rtl {
                 right: -@input-padding-horizontal - 1px;
                 left: auto;
            }
        }
         &-confirm {
             .@{typography-prefix-cls}-rtl & {
                 right: auto;
                 left: 10px;
            }
        }
    }
     ul, ol {
         li {
             .@{typography-prefix-cls}-rtl& {
                 margin: 0 20px 0 0;
                 padding: 0 4px 0 0;
            }
        }
    }
}
 @root-entry-name: default;
 @upload-prefix-cls: ~'@{ant-prefix}-upload';
 @upload-item: ~'@{ant-prefix}-upload-list-item';
 @upload-picture-card-size: 104px;
 @upload-picture-card-border-style: @border-style-base;
 @btn-cls: ~'@{ant-prefix}-btn';
 .@{upload-prefix-cls}{
     .reset-component();
     outline: 0;
     p {
         margin: 0;
    }
     &-btn {
         display: block;
         width: 100%;
         outline: none;
    }
     input[type='file'] {
         cursor: pointer;
    }
     &&-select {
         display: inline-block;
         &:hover {
             .anticon-upload {
                 color: @neutral-fg-2-normal;
            }
        }
    }
     .@{btn-cls}{
         &:hover {
             .anticon-upload {
                 color: @brand-fg-1-hover;
            }
        }
    }
     &&-select-picture-card {
         width: @upload-picture-card-size;
         height: @upload-picture-card-size;
         margin-right: 8px;
         margin-bottom: 8px;
         text-align: center;
         vertical-align: top;
         background-color: @neutral-bg-2-normal;
         border: @border-width-base dashed @neutral-stroke-1-normal;
         border-radius: @radius-m;
         cursor: pointer;
         transition: border-color 0.3s;
         > .@{upload-prefix-cls}{
             display: flex;
             align-items: center;
             justify-content: center;
             height: 100%;
             text-align: center;
        }
         &:hover {
             border-color: @brand-stroke-1-hover;
        }
         &.@{upload-prefix-cls}-disabled {
             background-color: @neutral-bg-disabled;
             &:hover {
                 border-color: @neutral-stroke-disabled;
                 .anticon-upload {
                     color: @neutral-fg-disabled;
                }
            }
        }
    }
     &&-disabled,&&-disabled:hover {
         color: @neutral-fg-disabled;
         cursor: not-allowed;
    }
     &&-disabled {
         .@{btn-cls}, .@{btn-cls}:hover {
             cursor: not-allowed;
             background-color: @neutral-bg-disabled;
             color: @neutral-fg-disabled;
             border-color: @neutral-stroke-disabled;
             .anticon-upload {
                 color: @neutral-fg-disabled;
            }
        }
    }
     &&-drag {
         position: relative;
         width: 100%;
         height: 100%;
         text-align: center;
         background: @neutral-bg-2-normal;
         border: @border-width-base dashed @neutral-stroke-1-normal;
         border-radius: @radius-m;
         cursor: pointer;
         transition: border-color 0.3s;
         .@{upload-prefix-cls}{
             padding: @padding-md 0;
        }
         &.@{upload-prefix-cls}-drag-hover:not(.@{upload-prefix-cls}-disabled) {
             border-color: @brand-stroke-1-hover;
        }
         &.@{upload-prefix-cls}-disabled {
             cursor: not-allowed;
        }
         .@{upload-prefix-cls}-btn {
             display: table;
             height: 100%;
        }
         .@{upload-prefix-cls}-drag-container {
             display: table-cell;
             vertical-align: middle;
        }
         &:not(.@{upload-prefix-cls}-disabled):hover {
             border-color: @brand-stroke-1-hover;
        }
         p.@{upload-prefix-cls}-drag-icon {
             .@{iconfont-css-prefix}{
                 color: @brand-fg-1-normal;
                 font-size: 48px;
            }
             margin-bottom: 20px;
        }
         p.@{upload-prefix-cls}-text {
             margin: 0 0 4px;
             color: @neutral-fg-2-normal;
             font-size: @font-size-lg;
        }
         p.@{upload-prefix-cls}-hint {
             color: @neutral-fg-3-normal;
             font-size: @font-size-body-m;
        }
         .@{iconfont-css-prefix}-plus {
             color: @neutral-fg-disabled;
             font-size: 30px;
             transition: all 0.3s;
             &:hover {
                 color: @neutral-fg-3-normal;
            }
        }
         &:hover .@{iconfont-css-prefix}-plus {
             color: @neutral-fg-3-normal;
        }
    }
     &-picture-card-wrapper {
         .clearfix();
         display: inline-block;
         width: 100%;
    }
}
 .@{upload-prefix-cls}-list {
     .reset-component();
     .clearfix();
     line-height: @line-height-base;
     &-item {
         position: relative;
         height: 38px;
         margin-top: @margin-xs;
         font-size: @font-size-body-m;
         background-color: @neutral-bg-1-hover-1;
         padding: 0 16px;
         border-radius: 4px;
         &-name {
             display: inline-block;
             width: 100%;
             padding-left: @font-size-body-m + 8px;
             overflow: hidden;
             line-height: @line-height-base;
             white-space: nowrap;
             text-overflow: ellipsis;
        }
         &-card-actions {
             position: absolute;
             right: 0;
             &-btn {
                 opacity: 0;
            }
             &-btn.@{ant-prefix}-btn-sm {
                 height: @line-height-base * @font-size-body-m;
                 line-height: 1;
                 vertical-align: top;
            }
             &.picture {
                 top: 22px;
                 line-height: 0;
            }
             &-btn:focus, &.picture &-btn {
                 opacity: 1;
            }
             .@{iconfont-css-prefix}{
                 color: @neutral-fg-2-normal;
                 transition: all 0.3s;
            }
        }
         &-info {
             height: 100%;
             transition: background-color 0.3s;
             > span {
                 display: block;
                 width: 100%;
                 height: 100%;
            }
             .@{iconfont-css-prefix}-loading, .@{upload-prefix-cls}-text-icon {
                 .@{iconfont-css-prefix}{
                     position: absolute;
                     top: (@font-size-body-m / 2) - 2px;
                     color: @neutral-fg-3-normal;
                     font-size: @font-size-body-m;
                }
            }
        }
         &:hover &-info {
             background-color: @neutral-bg-1-hover-1;
        }
         &:hover &-card-actions-btn {
             opacity: 1;
        }
         &-error, &-error .@{upload-prefix-cls}-text-icon > .@{iconfont-css-prefix}, &-error &-name {
             color: @status-error-bg-1-normal;
        }
         &-error &-card-actions {
             .@{iconfont-css-prefix}{
                 color: @status-error-bg-1-normal;
            }
             &-btn {
                 opacity: 1;
            }
        }
         &-progress {
             position: absolute;
             bottom: 0px;
             left: 16px;
             width: ~'calc(100% - 32px)';
             font-size: @font-size-body-m;
             line-height: 0;
        }
    }
     &-item-uploading {
         height: 51px;
         .@{upload-item}-info {
             height: 36px;
        }
    }
     &-picture, &-picture-card {
         .@{upload-item}{
             position: relative;
             height: 66px;
             padding: 0 @padding-xs;
             border: @border-width-base @upload-picture-card-border-style @neutral-stroke-1-normal;
             border-radius: @radius-m;
             &:hover {
                 background: transparent;
            }
             &-error {
                 border-color: @neutral-stroke-disabled;
            }
        }
         .@{upload-item}-error {
             &:hover {
                 background: @neutral-bg-disabled;
            }
        }
         .@{upload-item}-info {
             padding: 0;
        }
         .@{upload-item}:hover .@{upload-item}-info {
             background: transparent;
        }
         .@{upload-item}-uploading {
             border-style: dashed;
        }
         .@{upload-item}-thumbnail {
             width: 48px;
             height: 48px;
             line-height: 60px;
             text-align: center;
             opacity: 0.8;
        }
         .@{upload-item}-error.@{upload-item}-list-type-picture-card .@{upload-item}-thumbnail {
             &-icon {
                 font-size: 30px;
            }
             line-height: 100px;
        }
         .@{upload-item}-error.@{upload-item}-list-type-picture .@{upload-item}-thumbnail {