// 基础选择器合并（解决重复定义问题）
.e-loading {
    // 共享基础样式
    position: relative;
    box-sizing: border-box;

    // 显示与颜色样式
    display: block;

    // 基础尺寸样式
    width: 64px;
    height: 64px;
    font-size: 0;
    color: var(--epic-primary-color);
}
.e-loading > div {
    // 共享基础样式（position 会被后续定义覆盖，保持原逻辑）
    position: relative;

    // 定位与动画样式（覆盖上方的 position: relative）
    position: absolute;
    top: 0;
    left: 0;
    box-sizing: border-box;

    // 显示与背景样式
    display: inline-block;
    float: none;
    width: 64px;
    height: 64px;
    background-color: currentColor;
    border: 0 solid currentColor;
    border-radius: 100%;
    opacity: 0;
    animation: ball-scale-multiple 1s 0s linear infinite;
}

// 衍生样式（无重复，保持原样）
.e-loading.la-dark {
    color: #333333;
}
.e-loading > div:nth-child(2) {
    animation-delay: 0.2s;
}
.e-loading > div:nth-child(3) {
    animation-delay: 0.4s;
}

// 尺寸变体样式
.e-loading.la-sm {
    width: 32px;
    height: 32px;
}
.e-loading.la-sm > div {
    width: 32px;
    height: 32px;
}
.e-loading.la-2x {
    width: 128px;
    height: 128px;
}
.e-loading.la-2x > div {
    width: 128px;
    height: 128px;
}
.e-loading.la-3x {
    width: 192px;
    height: 192px;
}
.e-loading.la-3x > div {
    width: 192px;
    height: 192px;
}

// 动画定义
@keyframes ball-scale-multiple {
    0% {
        opacity: 0;
        transform: scale(0);
    }
    5% {
        opacity: 0.75;
    }
    100% {
        opacity: 0;
        transform: scale(1);
    }
}
