.nh-skeleton-shell {
  width: 100%;
}

.card-grid > .nh-skeleton-shell,
.properties-grid > .nh-skeleton-shell,
.saved-grid > .nh-skeleton-shell {
  grid-column: 1 / -1;
}

.nh-skeleton-visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.nh-skeleton-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 1.25rem;
  width: 100%;
}

.nh-skeleton-card,
.nh-skeleton-detail,
.nh-skeleton-stat {
  overflow: hidden;
  border: 1px solid var(--hairline, rgba(16, 42, 84, 0.1));
  border-radius: var(--radius, 16px);
  background: var(--surface, #fff);
}

.nh-skeleton-card-body,
.nh-skeleton-detail-body {
  padding: 1rem;
}

.nh-skeleton-media {
  width: 100%;
  aspect-ratio: 16 / 10;
}

.nh-skeleton-line,
.nh-skeleton-media,
.nh-skeleton-chip,
.nh-skeleton-avatar,
.nh-skeleton-cell {
  position: relative;
  display: block;
  overflow: hidden;
  background: #e8e5df;
}

.nh-skeleton-line::after,
.nh-skeleton-media::after,
.nh-skeleton-chip::after,
.nh-skeleton-avatar::after,
.nh-skeleton-cell::after {
  content: '';
  position: absolute;
  inset: 0;
  transform: translateX(-120%);
  background: linear-gradient(105deg, transparent 25%, rgba(255,255,255,.78) 48%, transparent 72%);
  animation: nh-skeleton-shimmer 1.35s ease-in-out infinite;
}

.nh-skeleton-line {
  width: 100%;
  height: 12px;
  margin-top: .7rem;
  border-radius: 999px;
}

.nh-skeleton-line:first-child { margin-top: 0; }
.nh-skeleton-line.is-title { width: 78%; height: 20px; border-radius: 7px; }
.nh-skeleton-line.is-value { width: 42%; height: 34px; border-radius: 8px; }
.nh-skeleton-line.is-short { width: 48%; }
.nh-skeleton-line.is-medium { width: 68%; }

.nh-skeleton-chip {
  width: 74px;
  height: 27px;
  border-radius: 999px;
}

.nh-skeleton-meta {
  display: flex;
  gap: .5rem;
  margin-top: 1rem;
}

.nh-skeleton-table {
  width: 100%;
  overflow-x: auto;
}

.nh-skeleton-table table {
  width: 100%;
  border-collapse: collapse;
}

.nh-skeleton-table td {
  padding: .9rem 1rem;
  border-bottom: 1px solid var(--hairline, rgba(16, 42, 84, 0.08));
}

.nh-skeleton-cell {
  width: min(120px, 100%);
  height: 12px;
  border-radius: 999px;
}

.nh-skeleton-table td:first-child .nh-skeleton-cell { width: min(155px, 100%); }
.nh-skeleton-table tr:nth-child(even) .nh-skeleton-cell { width: min(95px, 86%); }

.nh-skeleton-stats {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 1rem;
  width: 100%;
}

.nh-skeleton-stat { padding: 1.2rem; }
.nh-skeleton-detail {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(260px, .65fr);
  min-height: 440px;
}

.nh-skeleton-detail .nh-skeleton-media { height: 100%; min-height: 440px; aspect-ratio: auto; }
.nh-skeleton-detail-body { padding: clamp(1.25rem, 3vw, 2.5rem); }

@keyframes nh-skeleton-shimmer {
  0% { transform: translateX(-120%); }
  65%, 100% { transform: translateX(120%); }
}

@media (max-width: 760px) {
  .nh-skeleton-detail { grid-template-columns: 1fr; min-height: 0; }
  .nh-skeleton-detail .nh-skeleton-media { min-height: 240px; }
}

@media (prefers-reduced-motion: reduce) {
  .nh-skeleton-line::after,
  .nh-skeleton-media::after,
  .nh-skeleton-chip::after,
  .nh-skeleton-avatar::after,
  .nh-skeleton-cell::after { animation: none; }
}