/* Card extras: meta enrichments, status badge, author row, stars, thumb gradients, ruler */

/* Grid loading state (subtle fade while fetching) */
.grid.loading{opacity:.6;pointer-events:none;transition:opacity .15s}

/* Active filter bar (shown above grid when any filter is set) */
.active-tag-filter{
  display:flex;align-items:center;gap:10px;flex-wrap:wrap;
  margin:0 0 18px;padding:10px 14px;
  border:1px solid var(--line-strong);border-radius:10px;
  background:linear-gradient(135deg, rgba(212,255,62,.08), rgba(212,255,62,.02));
}
.active-tag-filter .atf-label{
  font-family:"JetBrains Mono",monospace;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--ink-dim);font-weight:600;flex-shrink:0;
}
.active-tag-filter .atf-chip{
  display:inline-flex;align-items:center;gap:6px;
  font-family:"JetBrains Mono",monospace;font-size:11.5px;font-weight:700;
  padding:4px 6px 4px 12px;border-radius:999px;
  background:var(--accent);color:#0b0b0a;
}
.active-tag-filter .atf-chip .atf-key{
  font-size:10px;font-weight:600;opacity:.7;text-transform:uppercase;letter-spacing:.08em;
}
.active-tag-filter .atf-chip-x{
  width:18px;height:18px;border-radius:50%;padding:0;
  background:rgba(0,0,0,.18);color:#0b0b0a;border:0;cursor:pointer;
  font-family:inherit;font-size:12px;font-weight:700;line-height:1;
  display:grid;place-items:center;
  transition:background .12s;
}
.active-tag-filter .atf-chip-x:hover{background:rgba(0,0,0,.35)}
.active-tag-filter .atf-clear{
  margin-left:auto;display:inline-flex;align-items:center;gap:5px;
  padding:6px 12px;border-radius:6px;
  background:transparent;border:1px solid var(--line-strong);color:var(--ink-soft);
  font-family:inherit;font-size:12px;cursor:pointer;
  transition:background .12s, color .12s, border-color .12s;
}
.active-tag-filter .atf-clear:hover{color:var(--accent-2);border-color:var(--accent-2);background:rgba(255,92,41,.06)}
.active-tag-filter .atf-clear svg{width:12px;height:12px}

/* Rating inside meta row */
.card .meta .rating{
  display:inline-flex;align-items:center;gap:3px;color:var(--accent);font-weight:600;
}
.card .meta .rating svg{width:11px;height:11px}

/* 5-star display */
.card .meta .stars{
  display:inline-flex;align-items:center;gap:1px;color:var(--accent);
}
.card .meta .stars .star{width:11px;height:11px;flex-shrink:0}
.card .meta .stars .star.empty{color:var(--ink-dim);opacity:.5}
.card .meta .stars .stars-num{
  margin-left:5px;font-family:"JetBrains Mono",monospace;font-size:11px;font-weight:700;color:var(--accent);
}

.card .meta .dl{
  display:inline-flex;align-items:center;gap:4px;
}
.card .meta .dl svg{width:11px;height:11px}

/* Author + date row */
.card .author-row{
  display:flex;align-items:center;gap:8px;font-size:11.5px;color:var(--ink-dim);
  margin-top:2px;
}
.card .author-row .mini-avatar{
  width:18px;height:18px;border-radius:50%;flex-shrink:0;
  display:grid;place-items:center;
  font-family:"Fraunces",serif;font-weight:600;font-style:italic;font-size:9px;
  color:#0b0b0a;border:1px solid rgba(0,0,0,.3);
}
.card .author-row .mini-avatar.role-editor{background:linear-gradient(135deg,#00d4ff,#0099cc)}
.card .author-row .mini-avatar.role-chief{background:linear-gradient(135deg,#a594f7,#6c5ce7)}
.card .author-row .mini-avatar.role-admin{background:linear-gradient(135deg,#d4ff3e,#a8e018)}
.card .author-row .mini-avatar.role-member{background:linear-gradient(135deg,#b9b2a1,#7a7466)}
.card .author-row .author-name{color:var(--ink-soft);font-weight:500;transition:color .15s}
.card .author-row .author-name:hover{color:var(--accent)}
.card .author-row .dot-sep{color:var(--ink-dim);opacity:.5}
.card .author-row .date{font-family:"JetBrains Mono",monospace;font-size:10px;letter-spacing:.08em;text-transform:uppercase}

/* Status badge (editor uploads) */
.card .status-badge{
  display:inline-flex;align-items:center;gap:5px;
  padding:2px 7px;border-radius:5px;
  font-family:"JetBrains Mono",monospace;font-size:9px;letter-spacing:.12em;text-transform:uppercase;font-weight:700;
  margin-left:auto;
}
.card .status-badge::before{content:"";width:5px;height:5px;border-radius:50%;background:currentColor}
.status-draft{background:rgba(185,178,161,.12);color:#b9b2a1;border:1px solid rgba(185,178,161,.3)}
.status-pending{background:rgba(255,190,85,.12);color:#ffbe55;border:1px solid rgba(255,190,85,.3)}
.status-approved{background:rgba(212,255,62,.12);color:var(--accent);border:1px solid rgba(212,255,62,.3)}
.status-rejected{background:rgba(255,92,41,.12);color:var(--accent-2);border:1px solid rgba(255,92,41,.3)}
.status-published{background:rgba(0,212,255,.12);color:#00d4ff;border:1px solid rgba(0,212,255,.3)}

/* Meta row — enriched with views, comments, downloads, rating */
.card .meta{
  margin-top:auto;padding-top:10px;border-top:1px dashed var(--line);
  display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center;
  font-family:"JetBrains Mono",monospace;font-size:11px;color:var(--ink-dim);
}
.card .meta .stars{justify-self:center}
.card .meta .size{justify-self:end}
.card .meta .stats{display:inline-flex;gap:12px;align-items:center}
.card .meta .stat-ic{display:inline-flex;align-items:center;gap:4px;color:var(--ink-soft)}
.card .meta .stat-ic svg{width:11px;height:11px}
.card .meta .stat-ic.rating{color:var(--accent)}
.card .size{color:var(--ink-soft)}

/* Classic view: show author-row properly */
.grid.view-classic .card .author-row{margin-top:4px}

/* Titles view: hide author row + status */
.grid.view-titles .card .author-row,
.grid.view-titles .card .status-badge{display:none}

/* Thumbnail color variants - creative gradient backgrounds */
.thumb-1{background:radial-gradient(circle at 30% 30%, #ff5c29, transparent 55%), radial-gradient(circle at 70% 70%, #d4ff3e, transparent 55%), #1a1915}
.thumb-2{background:radial-gradient(circle at 20% 80%, #6c5ce7, transparent 60%), radial-gradient(circle at 80% 20%, #fd79a8, transparent 55%), #14141a}
.thumb-3{background:linear-gradient(135deg,#0b0b0a,#23221e),repeating-linear-gradient(45deg,transparent 0 10px,rgba(212,255,62,.08) 10px 11px)}
.thumb-4{background:radial-gradient(circle at 50% 40%, #ffbe55, transparent 50%), #1a1510}
.thumb-5{background:conic-gradient(from 180deg at 50% 50%, #d4ff3e, #ff5c29, #6c5ce7, #d4ff3e); filter:saturate(.75) brightness(.6)}
.thumb-6{background:linear-gradient(120deg,#1a1915 0%,#2a2620 40%,#d4ff3e 300%)}
.thumb-7{background:radial-gradient(circle at 25% 25%, #00d4ff, transparent 50%), radial-gradient(circle at 75% 75%, #ff006e, transparent 50%), #0c0c12}
.thumb-8{background:linear-gradient(135deg,#2a2620,#1a1915),radial-gradient(circle at 60% 40%,rgba(255,190,85,.3),transparent 50%)}
.thumb-9{background:repeating-conic-gradient(from 0deg at 50% 50%,#1a1915 0deg 15deg,#23221e 15deg 30deg)}

/* Decorative typographic thumbnails */
.typo-thumb{
  position:absolute;inset:0;display:grid;place-items:center;overflow:hidden;
}
.typo-thumb span{
  font-family:"Fraunces",serif;font-weight:300;font-style:italic;
  font-size:110px;color:var(--ink);letter-spacing:-0.05em;line-height:.8;
  mix-blend-mode:overlay;opacity:.85;
}
.typo-thumb.alt span{font-family:"JetBrains Mono",monospace;font-weight:700;font-style:normal;font-size:72px;letter-spacing:-0.03em}

/* Ruler on top of thumbs */
.ruler{
  position:absolute;left:10px;bottom:10px;z-index:2;
  font-family:"JetBrains Mono",monospace;font-size:9.5px;letter-spacing:.18em;
  color:var(--ink);opacity:.75;display:flex;gap:8px;align-items:center;
}
.ruler::before{content:"";width:18px;height:1px;background:var(--ink);opacity:.6}