/*
 * .book-shelf / .book-card — the admin books index: one section per series
 * (plus Standalone) with a count badge, and cards with the 600×900 cover
 * variant on the left. The filter Stimulus controller only toggles [hidden];
 * everything visual lives here.
 * Structure: .book-shelf > .book-shelf__head + ul.book-cards > li.book-card
 */
@layer components {
  .book-shelf { margin-block-end: calc(var(--u-pad) * 2); }

  .book-shelf__head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: var(--u-pad);
    padding-block-end: calc(var(--u-pad) / 2);
    margin-block-end: var(--u-pad);
    border-block-end: var(--border-size-1) solid var(--line);
  }

  .book-shelf__title {
    margin: 0;
    font-size: var(--font-size-4);
  }

  .book-shelf__count {
    padding: calc(var(--u-pad) / 4) calc(var(--u-pad) / 2);
    background: var(--canvas);
    border-radius: var(--radius-ui);
    color: var(--ink-muted);
    font-size: var(--font-size-0);
    white-space: nowrap;
  }

  .book-shelf__blank {
    color: var(--ink-muted);
    text-align: center;
    padding-block: calc(var(--u-pad) * 2);
  }

  .book-cards {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: var(--u-pad);
  }

  .book-card {
    background: var(--canvas);
    border-radius: var(--radius-card);
    box-shadow: var(--elevation-card);
  }

  .book-card__link {
    display: grid;
    grid-template-columns: 8rem 1fr;
    gap: calc(var(--u-pad) * 1.5);
    padding: var(--u-pad);
    color: inherit;
    text-decoration: none;
  }

  .book-card__cover img,
  .book-card__cover-blank {
    display: block;
    inline-size: 100%;
    aspect-ratio: 2 / 3;
    object-fit: cover;
    border-radius: var(--radius-ui);
    box-shadow: var(--shadow-1);
  }

  /* No cover yet: a quiet accent slab with the title's initial. */
  .book-card__cover-blank {
    display: grid;
    place-items: center;
    background: var(--accent-soft);
    color: var(--ink-on-soft);
    font-size: var(--font-size-6);
  }

  .book-card__body {
    display: flex;
    flex-direction: column;
    min-inline-size: 0;
  }

  .book-card__title {
    margin: 0 0 calc(var(--u-pad) / 2);
    font-size: var(--font-size-3);
  }

  .book-card__excerpt {
    margin: 0;
    display: -webkit-box;
    -webkit-line-clamp: 7;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }

  /* Pinned to the card's bottom edge even when the excerpt is short. */
  .book-card__meta {
    margin-block-start: auto;
    padding-block-start: calc(var(--u-pad) / 2);
    display: flex;
    gap: var(--u-pad);
    color: var(--ink-muted);
    font-size: var(--font-size-0);
  }

  @media (max-width: 40rem) {
    .book-card__link { grid-template-columns: 5rem 1fr; }
    .book-card__excerpt { -webkit-line-clamp: 4; }
  }
}