.upload-progress-box {
    margin-top: .55rem;
    display: none;
    border: 1px solid rgba(14, 165, 233, .22);
    border-radius: .75rem;
    background: rgba(248, 250, 252, .92);
    padding: .75rem;
    color: #334155;
    box-shadow: 0 8px 24px rgba(15, 23, 42, .06);
}

.dark .upload-progress-box {
    border-color: rgba(56, 189, 248, .24);
    background: rgba(30, 41, 59, .72);
    color: #cbd5e1;
}

.upload-progress-box.is-uploading {
    display: block;
    border-color: rgba(14, 165, 233, .38);
}

.upload-progress-box.is-success {
    display: block;
    border-color: rgba(34, 197, 94, .36);
    background: rgba(240, 253, 244, .9);
}

.dark .upload-progress-box.is-success {
    background: rgba(20, 83, 45, .22);
}

.upload-progress-box.is-error {
    display: block;
    border-color: rgba(239, 68, 68, .4);
    background: rgba(254, 242, 242, .94);
}

.dark .upload-progress-box.is-error {
    background: rgba(127, 29, 29, .22);
}

.upload-progress-title {
    font-size: .78rem;
    font-weight: 700;
    color: #0f172a;
}

.dark .upload-progress-title {
    color: #e2e8f0;
}

.upload-progress-bar-wrap {
    position: relative;
    height: .55rem;
    margin-top: .55rem;
    overflow: hidden;
    border-radius: 999px;
    background: rgba(148, 163, 184, .22);
}

.upload-progress-bar {
    width: 0;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, #0284c7, #22c55e);
    transition: width .22s ease;
}

.upload-progress-box.is-error .upload-progress-bar {
    background: linear-gradient(90deg, #ef4444, #f97316);
}

.upload-progress-box.is-success .upload-progress-bar {
    background: linear-gradient(90deg, #16a34a, #22c55e);
}

.upload-progress-info {
    display: flex;
    flex-wrap: wrap;
    gap: .35rem .7rem;
    margin-top: .55rem;
    font-size: .72rem;
    line-height: 1.35;
    color: #64748b;
}

.dark .upload-progress-info {
    color: #cbd5e1;
}

.upload-progress-info span:first-child {
    font-weight: 800;
    color: #0284c7;
}

.upload-progress-box.is-success .upload-progress-info span:first-child {
    color: #16a34a;
}

.upload-progress-box.is-error .upload-progress-info span:first-child {
    color: #dc2626;
}