/* Loading skeletons (shimmering placeholders shown while data loads). */

/* Skeleton */
.skeleton {
  display: block; position: relative; overflow: hidden;
  background: #EFE9DC; border-radius: 6px;
}
.skeleton::after {
  content: ""; position: absolute; inset: 0; transform: translateX(-100%);
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .7), transparent);
  animation: shimmer 1.3s infinite;
}
@keyframes shimmer { to { transform: translateX(100%); } }
.skeleton-event {
  display: grid; grid-template-columns: 20px 1fr 56px; gap: 14px;
  padding: 18px 16px; border: 1.5px solid var(--line); border-radius: var(--radius-md);
}
.skeleton--dot { width: 20px; height: 20px; border-radius: 50%; }
.skeleton--line { height: 12px; }
.skeleton--line + .skeleton--line { margin-top: 9px; }
/* Skeleton line widths */
.skeleton--w72 { width: 72%; }
.skeleton--w58 { width: 58%; }
.skeleton--w40 { width: 40%; }
.skeleton--w34 { width: 34%; }

.skeleton--title { display: inline-block; width: min(420px, 80%); height: 38px; border-radius: 10px; background: rgba(255,255,255,.12); }
.skeleton--title::after { background: linear-gradient(90deg, transparent, rgba(255,255,255,.18), transparent); }