/* Approved ELL ink-and-watercolor artwork, displayed as independent clickable elements. */
.bookshelf{max-width:none;width:100%;margin:0;padding:48px 0 38px;border-top:1px solid var(--line)}
.bookshelf-intro{max-width:1200px;margin:0 auto 20px;padding:0 clamp(22px,5vw,72px)}
.bookshelf h2{font:500 clamp(30px,3.4vw,46px)/1.15 Lora,serif;margin:10px 0 14px;letter-spacing:-.02em}
.bookshelf-intro>p:last-child{font-size:14px;line-height:1.7;color:var(--mute);margin:0}
.book-kind{font-size:10px;letter-spacing:.13em;text-transform:uppercase;font-weight:500;color:var(--bloom);margin:0}
.bookshelf-layout{display:block}
.shelf-scroll{width:100%;overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:contain;scrollbar-width:thin;scrollbar-color:var(--sand) transparent;padding:10px 0 0}
.shelf-scroll:focus-visible{outline:2px solid var(--bloom);outline-offset:-2px}
.illustrated-stage{position:relative;width:100%;min-width:850px;aspect-ratio:1536 / 650;margin:auto;background:white}
.shelf-books{position:static}
.shelf-book,.shelf-decoration,.illustrated-board{position:absolute;display:block;overflow:hidden;border:0;padding:0;background:transparent}
.shelf-book img,.shelf-decoration img,.illustrated-board img{position:absolute;display:block;max-width:none;height:auto;user-select:none;pointer-events:none}
.illustrated-board{z-index:1}.shelf-decoration{z-index:2}.shelf-book{z-index:3;cursor:pointer;transition:opacity .22s ease;transform:none;opacity:.78}
.shelf-book:hover{transform:none;opacity:.9}
.shelf-book[aria-pressed=true]{transform:none;opacity:1;z-index:3}
.shelf-book:focus-visible{outline:2px solid var(--bloom);outline-offset:3px}
.shelf-hint{max-width:1200px;margin:2px auto 23px;padding:0 clamp(22px,5vw,72px);font-size:11px;text-align:center;color:var(--mute)}
.mobile-shelf-hint{display:none}
.book-card{max-width:1056px;margin:0 auto;border:0!important;border-top:1px solid var(--line)!important;border-bottom:1px solid var(--line)!important;background:white!important;min-height:173px}
.book-detail{padding:25px 0;min-height:173px;display:block}
.book-detail[hidden]{display:none}.book-preview{display:none}
.book-copy{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr) auto;column-gap:32px;align-items:center}
.book-copy .book-kind{display:none}
.book-copy h3{grid-column:1;grid-row:1;font:500 29px/1.2 Lora,serif;margin:0 0 9px}
.book-author{grid-column:1;grid-row:2;font-size:11px;color:var(--mute);margin:0}
.book-facts{grid-column:2;grid-row:1;font-size:12px;color:var(--ink);margin:0 0 9px}
.book-description{grid-column:2;grid-row:2;font-size:12px;line-height:1.7;color:var(--mute);margin:0}
.book-copy .pillbtn{grid-column:3;grid-row:1/3;font-size:11px;align-self:center;white-space:nowrap}
.bookshelf-all{display:block;width:fit-content;margin:23px auto 0;font-size:12px;color:var(--bloom);border-bottom:1px solid currentColor;padding-bottom:3px}
.visually-hidden{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(max-width:1200px){.book-card{margin-left:clamp(22px,5vw,72px);margin-right:clamp(22px,5vw,72px)}.book-copy{column-gap:24px}.book-copy h3{font-size:26px}}
@media(max-width:820px){.bookshelf{padding-top:35px}.bookshelf-intro{padding:0 22px}.mobile-shelf-hint{display:inline}.shelf-hint{padding:0 22px;margin-bottom:20px}.book-card{margin:0 22px}.book-detail{min-height:240px;padding:22px 0}.book-copy{grid-template-columns:1fr;gap:0}.book-copy h3{grid-column:1;grid-row:1;font-size:27px}.book-author{grid-column:1;grid-row:2}.book-facts{grid-column:1;grid-row:3;margin:13px 0 9px}.book-description{grid-column:1;grid-row:4}.book-copy .pillbtn{grid-column:1;grid-row:5;justify-self:start;margin-top:17px}.book-description-extra{display:none}.bookshelf-all{margin-left:22px;margin-right:22px;font-size:11px}}
@media(prefers-reduced-motion:reduce){.shelf-book{transition:none}}

/* Every selected spine, including a reselected Secret Garden, briefly fades on click. */
.shelf-book.is-switching{animation:book-selection-fade .42s ease}
@keyframes book-selection-fade{0%{opacity:.55}100%{opacity:1}}
.book-detail{display:grid;grid-template-columns:minmax(0,1fr) 82px minmax(0,1.25fr) auto;column-gap:28px;align-items:center;min-height:173px}
.book-detail[hidden]{display:none}
.book-copy{display:contents}
.book-preview{display:block;grid-column:2;grid-row:1/3}
.book-preview img{display:block;width:82px;height:110px;object-fit:contain}
.book-copy h3,.book-author{grid-column:1}
.book-facts,.book-description{grid-column:3}
.book-copy .pillbtn{grid-column:4;grid-row:1/3}
@media(max-width:1050px) and (min-width:821px){.book-detail{grid-template-columns:minmax(0,1fr) 70px minmax(0,1.1fr);column-gap:20px}.book-preview img{width:70px;height:96px}.book-copy .pillbtn{grid-column:3;grid-row:3;justify-self:start;margin-top:12px}}
@media(max-width:820px){
.book-detail{grid-template-columns:75px minmax(0,1fr);column-gap:18px;min-height:270px}
.book-preview{grid-column:1;grid-row:1/4;align-self:start}
.book-preview img{width:75px;height:102px}
.book-copy h3{grid-column:2;grid-row:1;margin:0 0 8px}
.book-author{grid-column:2;grid-row:2}
.book-facts{grid-column:2;grid-row:3;margin:10px 0 0;font-size:11px}
.book-description{grid-column:1/-1;grid-row:4;margin-top:15px}
.book-copy .pillbtn{grid-column:1/-1;grid-row:5;margin-top:15px}
}
@media(prefers-reduced-motion:reduce){.shelf-book.is-switching{animation:none}}

/* Selected and unselected books share the same visible hover treatment. */
.shelf-book{transition:opacity .22s ease,filter .22s ease}
.shelf-book:hover,.shelf-book[aria-pressed=true]:hover{opacity:.72;filter:saturate(.55)}
.book-preview{justify-self:center;align-self:center}
@media(min-width:1051px){.book-detail{grid-template-columns:max-content minmax(120px,1fr) minmax(0,1.55fr) auto;column-gap:24px}}
@media(min-width:821px) and (max-width:1050px){.book-detail{grid-template-columns:minmax(0,1fr) minmax(100px,.65fr) minmax(0,1.2fr)}}
@media(prefers-reduced-motion:reduce){.shelf-book{transition:none}}

/* A centered, smaller shelf composition on larger screens. */
@media(min-width:821px){.shelf-scroll{width:75%;margin-left:auto;margin-right:auto}.illustrated-stage{min-width:0}}

/* A small piece of children's artwork beside the collection link. */
.bookshelf-footer{display:flex;align-items:center;justify-content:center;gap:18px;width:fit-content;max-width:calc(100% - 44px);margin:20px auto 0}
.bookshelf-footer .bookshelf-all{margin:0}
.child-character{display:block;width:48px;height:66px;object-fit:contain;flex:none}
@media(max-width:600px){.bookshelf-footer{gap:12px}.bookshelf-footer .bookshelf-all{font-size:11px}.child-character{width:40px;height:56px}}

/* Emphasized Language Arts collection link and larger original child illustration. */
.bookshelf-footer{gap:24px;margin:30px auto 10px;max-width:calc(100% - 36px)}
.bookshelf-footer .bookshelf-all{display:inline-flex;align-items:center;justify-content:center;text-align:center;min-height:54px;padding:14px 25px;border:2px solid #b64f2e;border-radius:4px;background:#b64f2e;color:#fff;font-size:16px;font-weight:600;line-height:1.35;text-decoration:none;box-shadow:0 3px 0 rgba(42,58,79,.12);transition:background-color .2s ease,transform .2s ease}
.bookshelf-footer .bookshelf-all:hover,.bookshelf-footer .bookshelf-all:focus-visible{background:#913b22;border-color:#913b22;transform:translateY(-2px)}
.bookshelf-footer .bookshelf-all:focus-visible{outline:3px solid #2a3a4f;outline-offset:3px}
.bookshelf-footer .child-character{width:86px;height:112px;object-fit:contain}
@media(max-width:600px){.bookshelf-footer{gap:14px;margin-top:24px}.bookshelf-footer .bookshelf-all{font-size:13px!important;padding:12px 14px;min-height:48px}.bookshelf-footer .child-character{width:66px;height:90px}}
