.personal-library { min-width: 0; padding-bottom: 8px; }
.library-now { display: grid; grid-template-columns: 80px minmax(0, 1fr); align-items: start; gap: 24px; margin: 25px 0 24px; padding-bottom: 25px; border-bottom: 1px solid var(--line); }
.library-now-cover { display: block; width: 80px; height: 120px; object-fit: contain; filter: drop-shadow(1px 3px 2px rgba(25, 31, 23, .15)); }
.library-now-copy { min-width: 0; }
.library-now-label { margin: 0 0 8px; font-size: 14px; line-height: 1.3; color: var(--green); }
.library-now-title { max-width: 400px; margin: 0; font-size: 25px; font-weight: 400; line-height: 1.2; text-wrap: balance; }
.library-club { display: flex; align-items: center; gap: 10px; margin-top: 16px; }
.library-club-art { position: relative; flex: none; display: block; width: 34px; height: 34px; overflow: hidden; border-radius: 4px; }
.library-club-art img { position: absolute; display: block; width: 109%; height: auto; max-width: none; left: -4.5%; top: -3%; }
.library-club-note { margin: 0; color: var(--muted); font-size: 15px; line-height: 1.4; text-wrap: pretty; }
.library-club-name { color: var(--ink); }
.library-switch { display: inline-flex; gap: 3px; padding: 3px; border: 1px solid var(--line); border-radius: 5px; }
.library-mode { display: inline-flex; align-items: center; justify-content: center; min-width: 78px; min-height: 44px; padding: 6px 13px; border-radius: 3px; color: var(--muted); font-size: 16px; line-height: 1.3; }
.library-mode[aria-current="page"] { color: var(--ink); background: var(--wash, var(--paper)); }
.library-mode:is(:hover, :focus-visible) { color: var(--ink); background: var(--accent-wash); }
.library-shelf-heading { margin: 24px 0 0; font-size: 18px; line-height: 1.4; font-weight: 400; color: var(--body); }
.library-shelf-heading:not([hidden]) + .library-shelf { margin-top: 10px; }
.library-shelf { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); align-items: end; column-gap: 15px; row-gap: 15px; margin-top: 26px; padding: 6px 2px 0; border-bottom: 1px solid var(--line); box-shadow: 0 3px 0 color-mix(in srgb, var(--line) 30%, transparent); }
.library-item { position: relative; display: flex; justify-content: center; align-items: flex-end; width: 100%; min-width: 0; padding: 10px 2px 19px; border-radius: 1px; }
.library-cover { display: block; width: 100%; max-width: 80px; aspect-ratio: 2 / 3; transform-origin: center bottom; transform: translateY(0); transition: transform 220ms cubic-bezier(.2,.7,.3,1); }
.library-cover img { display: block; width: 100%; height: 100%; object-fit: contain; object-position: bottom center; filter: drop-shadow(1px 3px 2px rgba(25, 31, 23, .15)); }
.library-item::after { content: ""; position: absolute; left: calc(50% - 2px); bottom: 7px; width: 4px; height: 4px; background: var(--accent-gradient); border-radius: 50%; opacity: 0; }
.library-item[aria-pressed="true"]::after { opacity: 1; }
.library-item[aria-pressed="true"] .library-cover { transform: translateY(-5px); }
.library-item:hover .library-cover, .library-item:focus-visible .library-cover { transform: translateY(-10px) rotate(-1deg); }
.library-detail { min-height: 175px; padding: 27px 0 0; }
.library-title { font-size: 25px; line-height: 1.2; font-weight: 400; letter-spacing: -.3px; margin: 0; }
.library-author { font-size: 16px; line-height: 1.45; color: var(--muted); margin: 5px 0 0; }
.library-description { max-width: 470px; font-size: 18px; line-height: 1.5; color: var(--body); margin: 13px 0 0; }
.library-link { display: inline-block; font-size: 16px; line-height: 1.4; color: var(--green); margin-top: 15px; padding: 3px 0; text-decoration: none; }
.personal-library[data-kind="podcasts"] .library-shelf { grid-template-columns: repeat(4, minmax(0, 1fr)); column-gap: 24px; }
.personal-library[data-kind="podcasts"] .library-now { display: none; }
.personal-library[data-kind="podcasts"] .library-cover { aspect-ratio: 1; max-width: 96px; }
.personal-library[data-kind="podcasts"] .library-cover img { border-radius: 2px; object-fit: cover; object-position: center 35%; }
.personal-library button:focus-visible, .personal-library a:focus-visible { outline: 2px solid var(--green); outline-offset: 4px; }
@media (max-width: 600px) {
  .library-mode, .library-link { min-height: 44px; }
  .library-link { display: inline-flex; align-items: center; }
  .library-now { grid-template-columns: 64px minmax(0, 1fr); gap: 18px; margin-top: 22px; padding-bottom: 22px; }
  .library-now-cover { width: 64px; height: 96px; }
  .library-now-title { font-size: 22px; }
  .library-club { margin-top: 13px; align-items: flex-start; }
  .library-shelf { grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: 22px; row-gap: 8px; margin-top: 22px; }
  .library-cover { max-width: 76px; }
  .personal-library[data-kind="podcasts"] .library-shelf { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 30px; }
  .personal-library[data-kind="podcasts"] .library-cover { max-width: 100px; }
  .library-detail { min-height: 185px; padding-top: 24px; }
  .library-title { font-size: 23px; }
  .library-description { font-size: 17px; }
}
@media (prefers-reduced-motion: reduce) {
  .library-cover { transition: none; }
  .library-item[aria-pressed="true"] .library-cover,
  .library-item:hover .library-cover,
  .library-item:focus-visible .library-cover { transform: none; }
}
@media (pointer: coarse) {
  .library-mode, .library-link { min-height: 44px; }
  .library-link { display: inline-flex; align-items: center; }
}
