Upload Error State

<div class="nuda-uperr" role="alert">
  <div class="nuda-uperr__icon" aria-hidden="true">
    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
      <circle cx="12" cy="12" r="9" />
      <path d="M12 8v5M12 16.5v.5" stroke-linecap="round" />
    </svg>
  </div>
  <div class="nuda-uperr__meta">
    <p class="nuda-uperr__name">video-4k.mp4</p>
    <p class="nuda-uperr__msg">Upload failed — connection lost</p>
  </div>
  <button class="nuda-uperr__retry" type="button">
    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
         aria-hidden="true">
      <path d="M3 12a9 9 0 1 0 3-6.7" stroke-linecap="round" />
      <path d="M3 4v5h5" stroke-linecap="round" stroke-linejoin="round" />
    </svg>
    Retry
  </button>
</div>

/* Upload Error State
   Red-bordered card with a retry CTA. */

.nuda-uperr {
  --err: #ff5e7a;
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.75rem;
  background: rgba(255, 94, 122, 0.06);
  border: 1px solid var(--err);
  border-radius: 10px;
  min-width: 300px;
}

.nuda-uperr__icon {
  width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(255, 94, 122, 0.12);
  border-radius: 8px;
  color: var(--err);
  flex-shrink: 0;
}
.nuda-uperr__icon svg { width: 18px; height: 18px; }

.nuda-uperr__meta { flex: 1; min-width: 0; }

.nuda-uperr__name {
  margin: 0;
  font-size: 0.85rem;
  color: #fafafa;
  font-weight: 500;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.nuda-uperr__msg {
  margin: 0;
  font-size: 0.75rem;
  color: var(--err);
}

.nuda-uperr__retry {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  padding: 0.4rem 0.65rem;
  background: var(--err);
  color: #09090b;
  border: none;
  border-radius: 6px;
  font-size: 0.78rem;
  font-weight: 600;
  cursor: pointer;
  transition: filter 0.15s;
  flex-shrink: 0;
}

.nuda-uperr__retry:hover { filter: brightness(1.1); }
.nuda-uperr__retry svg { width: 13px; height: 13px; }

@media (prefers-reduced-motion: reduce) {
  .nuda-uperr__retry { transition: none; }
}