u

src/index.css

@@ -411,6 +411,41 @@ body {
   border: 1px solid rgba(131, 165, 152, 0.3);
 }
 
+.badge-success {
+  background: rgba(184, 187, 38, 0.15);
+  color: var(--green);
+  border: 1px solid rgba(184, 187, 38, 0.3);
+}
+
+/* ── Spinner & Skeleton Animations ─────────────────── */
+
+.spinner-gruvbox {
+  width: 18px;
+  height: 18px;
+  border: 2px solid rgba(250, 189, 47, 0.25);
+  border-top-color: var(--accent);
+  border-radius: 50%;
+  animation: spin-gruvbox 0.75s linear infinite;
+  display: inline-block;
+  flex-shrink: 0;
+}
+
+@keyframes spin-gruvbox {
+  to { transform: rotate(360deg); }
+}
+
+.skeleton-bar {
+  background: linear-gradient(90deg, var(--surface-1) 25%, var(--surface-2) 50%, var(--surface-1) 75%);
+  background-size: 200% 100%;
+  animation: skeleton-pulse 1.4s ease-in-out infinite;
+  border-radius: var(--r-sm);
+}
+
+@keyframes skeleton-pulse {
+  0% { background-position: 200% 0; }
+  100% { background-position: -200% 0; }
+}
+
 /* ── Buttons ───────────────────────────────────────── */
 
 .btn {