.ccv2-library-header { padding: 11px 13px; }
.ccv2-library-header h2 { margin: 2px 0 3px; font-size: 1.05rem; }
.ccv2-library-header p { margin: 0; color: #91a8ba; font-size: .68rem; line-height: 1.32; }
.ccv2-library-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 7px;
}
.ccv2-event-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.ccv2-library-card {
  position: relative;
  min-width: 0;
  min-height: 132px;
  overflow: hidden;
  padding: 9px;
  border: 1px solid rgba(104, 190, 255, .16);
  border-radius: 11px;
  background: linear-gradient(145deg, rgba(15, 36, 59, .92), rgba(7, 18, 31, .95));
  display: grid;
  grid-template-rows: auto 1fr auto;
  gap: 6px;
}
.ccv2-library-card.has-image::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image: linear-gradient(180deg, rgba(7, 17, 29, .38), rgba(7, 17, 29, .95) 78%), var(--library-image);
  background-size: cover;
  background-position: center;
  opacity: .58;
}
.ccv2-library-card > * { position: relative; z-index: 1; }
.ccv2-library-card-top { display: flex; justify-content: space-between; align-items: center; gap: 7px; }
.ccv2-library-icon {
  width: 29px;
  height: 29px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(111, 200, 255, .2);
  border-radius: 8px;
  background: rgba(22, 63, 98, .48);
  color: #83e5ff;
  font-size: .9rem;
}
.ccv2-library-status { padding: 3px 5px; border-radius: 999px; font-size: .48rem; font-weight: 900; letter-spacing: .04em; }
.ccv2-library-status.live { color: #81eeb9; background: rgba(30, 115, 76, .18); border: 1px solid rgba(120, 231, 179, .24); }
.ccv2-library-status.building { color: #80dfff; background: rgba(26, 93, 139, .18); border: 1px solid rgba(111, 200, 255, .24); }
.ccv2-library-status.next { color: #f5cf62; background: rgba(115, 85, 19, .18); border: 1px solid rgba(245, 207, 98, .24); }
.ccv2-library-status.planned { color: #99a8b5; background: rgba(90, 100, 112, .14); border: 1px solid rgba(155, 170, 185, .16); }
.ccv2-library-copy { align-self: end; min-width: 0; }
.ccv2-library-copy h3 { margin: 0 0 3px; font-size: .73rem; }
.ccv2-library-copy p { margin: 0; color: #8fa5b7; font-size: .54rem; line-height: 1.3; }
.ccv2-library-card button {
  justify-self: start;
  min-height: 27px;
  padding: 4px 8px;
  border: 1px solid rgba(111, 200, 255, .26);
  border-radius: 7px;
  background: rgba(21, 69, 106, .65);
  color: #dff7ff;
  font-size: .54rem;
  font-weight: 850;
}
.ccv2-library-pending { color: #7f919e; font-size: .49rem; }
@media (max-width: 1260px) {
  .ccv2-library-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .ccv2-event-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
  .ccv2-library-grid, .ccv2-event-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 500px) {
  .ccv2-library-grid, .ccv2-event-grid { grid-template-columns: 1fr; }
}