.bookshelf{--wall-row: 164px;--set-gap: 20px;--author-gap: 44px;margin:32px 0;overflow-x:clip}.bookshelf__shelf{display:flex;flex-wrap:wrap;align-items:flex-start;gap:28px var(--author-gap)}.bookshelf__author{display:flex;flex:none;flex-wrap:wrap;align-items:flex-start;gap:28px var(--set-gap);max-width:100%}.bookshelf__series{display:flex;flex:none;flex-wrap:wrap;max-width:100%;align-items:flex-end;align-content:flex-start;--book-row-gap: 18px;gap:var(--book-row-gap) 3px}.bookshelf__series:has(.bookshelf__series-name,.bookshelf__eyebrow:not(.bookshelf__eyebrow--blank)){min-width:7.5rem}.bookshelf__book{--spine-height: 140px;--spine-width: 34px;position:relative;display:flex;flex:none;min-width:var(--spine-width);height:var(--spine-height);margin-top:calc(var(--wall-row) - var(--spine-height));color:var(--spine-text);text-decoration:none;box-shadow:0 2px 6px rgba(0,0,0,.35);transition:transform .2s ease}.bookshelf__book:hover,.bookshelf__book:focus-visible{z-index:2;transform:translateY(-6px);color:var(--spine-text)}.bookshelf__book:focus-visible{outline:2px solid var(--focus);outline-offset:2px}.bookshelf__book--tone-0{--spine: #7d3434;--spine-text: #f6ecdc}.bookshelf__book--tone-1{--spine: #2f5d62;--spine-text: #eef6f2}.bookshelf__book--tone-2{--spine: #45488a;--spine-text: #eeeefa}.bookshelf__book--tone-3{--spine: #c19446;--spine-text: #2a1d08}.bookshelf__book--tone-4{--spine: #3f6b45;--spine-text: #eef6ec}.bookshelf__book--tone-5{--spine: #6b3f6b;--spine-text: #f7ecf7}.bookshelf__book--tone-6{--spine: #24344f;--spine-text: #e8eef8}.bookshelf__book--tone-7{--spine: #a0573a;--spine-text: #fbefe6}.bookshelf__book--height-0{--spine-height: 128px}.bookshelf__book--height-1{--spine-height: 140px}.bookshelf__book--height-2{--spine-height: 152px}.bookshelf__book--height-3{--spine-height: 164px}.bookshelf__book--narrow{--spine-width: 28px}.bookshelf__book--medium{--spine-width: 34px}.bookshelf__book--wide{--spine-width: 42px}.bookshelf__spine{position:relative;z-index:1;display:flex;flex:1;align-items:center;justify-content:center;padding:0 5px;border-radius:2px;overflow:hidden;isolation:isolate;background:var(--spine)}.bookshelf__spine::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(to right, rgba(0, 0, 0, 0.22), rgba(0, 0, 0, 0) 14%, rgba(0, 0, 0, 0) 86%, rgba(0, 0, 0, 0.26)),linear-gradient(to top, transparent 10px, color-mix(in srgb, var(--spine-text) 45%, transparent) 10px 12px, transparent 12px),linear-gradient(var(--spine-wash, transparent), var(--spine-wash, transparent))}.bookshelf__spine-title{display:block;writing-mode:vertical-rl;inline-size:calc(var(--spine-height) - 38px);max-block-size:3.3em;overflow:hidden;text-align:center;font-family:"Avenir Next Condensed","Roboto Condensed","Arial Narrow",sans-serif;font-size:.72rem;font-stretch:condensed;font-weight:600;letter-spacing:.09em;line-height:1.05;text-transform:uppercase}.bookshelf__series-label{display:block;flex:0 0 100%;contain:inline-size;position:relative;margin:calc(10px - var(--book-row-gap, 0px)) 0 0;padding-top:8px}.bookshelf__series-label::before{content:"";position:absolute;top:0;right:-100vw;left:-100vw;border-top:1px solid var(--border)}.bookshelf__series-label{color:var(--muted);font-size:.68rem;font-weight:600;letter-spacing:.06em;line-height:1.35;text-transform:uppercase;overflow-wrap:anywhere}.bookshelf__series-count{white-space:nowrap}.bookshelf__eyebrow{display:block;margin-bottom:2px;color:var(--accent);font-size:.62rem;font-weight:700;letter-spacing:.1em}.bookshelf__eyebrow--blank{visibility:hidden}.bookshelf__current{position:relative;display:flex;flex-direction:column;min-width:7.5rem;color:inherit;text-decoration:none}.bookshelf__current:focus-visible{outline:2px solid var(--focus);outline-offset:4px;border-radius:8px}.bookshelf__face-out{display:block;width:auto;height:var(--wall-row);border-radius:2px 4px 4px 2px;box-shadow:0 10px 18px -6px rgba(0,0,0,.6)}.bookshelf__face-out--blank{width:108px;background:var(--surface);border:1px solid var(--border)}.bookshelf__card{position:absolute;bottom:calc(100% + 10px);left:50%;z-index:5;display:flex;gap:12px;width:250px;max-width:calc(100vw - 16px);padding:12px;border:1px solid var(--border);border-radius:12px;background:var(--surface);color:var(--text);box-shadow:0 12px 30px rgba(0,0,0,.45);font-size:.85rem;line-height:1.35;text-align:left;translate:calc(-50% + var(--card-shift, 0px)) 0;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .15s ease,visibility .15s}:is(.bookshelf__book,.bookshelf__current):is(:hover,:focus-visible) .bookshelf__card{opacity:1;visibility:visible}.bookshelf__card-cover{flex:none;width:52px;height:78px;border-radius:3px;object-fit:cover}.bookshelf__card-text{display:flex;flex-direction:column;align-items:flex-start;gap:6px}.bookshelf__card-title{font-size:.95rem}.bookshelf__card-author{margin-top:-4px;color:var(--muted);font-size:.8rem}.bookshelf__card-series{padding:2px 8px;border-radius:999px;background:var(--accent-soft);color:var(--accent);font-size:.75rem}.bookshelf__sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}@media(prefers-reduced-motion: reduce){.bookshelf__book,.bookshelf__card{transition:none}}@media(max-width: 600px){.bookshelf{--wall-row: 140px}.bookshelf__book{--spine-width: 26px}.bookshelf__book--height-0{--spine-height: 104px}.bookshelf__book--height-1{--spine-height: 116px}.bookshelf__book--height-2{--spine-height: 128px}.bookshelf__book--height-3{--spine-height: 140px}}