:root{color-scheme:light;box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}html{scroll-padding-top:env(safe-area-inset-top,0px)}body{margin:0;padding:0;font:14px -apple-system,BlinkMacSystemFont,sans-serif;background:#F5F0E6;color:#2A3A4F}img{max-width:100%}[hidden]:not([hidden=until-found i]){display:none!important}/* Hints disappear on focus; real entries remain untouched. */
input[placeholder]:focus::placeholder,textarea[placeholder]:focus::placeholder{color:transparent;opacity:0}


/* Layout: Liquid Glass. A soft, slowly blurred color field in the ELL palette sits behind everything; the nav, reader form, and info cards are frosted glass panels on top. Centered hero, one clear form, picks as cover rows. Single light theme by choice (ELL brand: #F5F0E6 ground). Old note: "Tell us about your reader" card up top builds a personal stack of picks; below it, genres as spines on a shelf open one genre at a time. A book opens in a detail sheet. Single light theme by choice (ELL brand: #F5F0E6 ground). */
:root{
  color-scheme:light;
  --paper:#F5F0E6; --ink:#2A3A4F; --muted:#6B7F9E; --line:#E6EEE8; --sand:#D8CDB8;
  --tint:#F5F0E6; --sage:#E6EEE8; --forest:#2A3A4F; --slate:#6B7F9E; --slate-ink:#6B7F9E; --mustard:#C99A3B; --mustard-ink:#A8502F;
  --brick:#A8502F; --brick-soft:#F5F0E6; --cloth-ink:#F5F0E6;
  --moss:#2A3A4F; --moss-hover:#2A3A4F; --la-tint:#F5F0E6; --teal:#2A3A4F;
  --display:"Lora", Georgia, "Times New Roman", serif;
  --sans:"Poppins", system-ui, -apple-system, "Segoe UI", sans-serif;
}
*{box-sizing:border-box}
[hidden]{display:none!important}
body{background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:15px;line-height:1.55;-webkit-font-smoothing:antialiased}
button,input,select{font:inherit;color:inherit}
button{cursor:pointer}
:focus-visible{outline:2px solid var(--mustard);outline-offset:2px}
.wrap{max-width:1140px;margin:0 auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}

/* masthead */
.mast{border-bottom:1px solid var(--line)}
.mast .wrap{display:flex;align-items:center;justify-content:space-between;gap:14px;padding-block:14px;flex-wrap:wrap}
.brand{display:flex;flex-direction:column;line-height:1.15}
.brand b{font-family:var(--display);font-weight:700;font-size:21px;letter-spacing:-.01em}
.brand span{font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.lookup{position:relative;flex:0 1 300px;min-width:0}
.lookup input{width:100%;border:1.5px solid var(--line);border-radius:999px;padding:8px 14px 8px 36px;font-size:14px;background:var(--paper)}
.lookup input:focus{outline:none;border-color:var(--ink)}
.lookup svg{position:absolute;left:12px;top:50%;transform:translateY(-50%);color:var(--muted)}
.pop{position:absolute;right:0;left:0;top:calc(100% + 6px);background:var(--paper);border:1px solid var(--line);border-radius:14px;box-shadow:0 12px 30px rgba(42,58,79,.16);z-index:15;padding:6px;max-height:360px;overflow:auto}
.pop button{display:block;width:100%;text-align:left;border:0;background:none;border-radius:9px;padding:8px 10px}
.pop button:hover,.pop button:focus-visible{background:var(--tint)}
.pop b{display:block;font-weight:500;font-size:14px;line-height:1.3}
.pop span{font-size:12px;color:var(--muted)}
.pop p{margin:0;padding:8px 10px;font-size:13px;color:var(--muted)}
@media (max-width:560px){.lookup{flex:1 1 100%}}

/* reader card */
.band{background:var(--la-tint)}
.hero{padding-block:30px 40px}
.crumb{margin:0 0 14px;font-size:12.5px;letter-spacing:.06em;color:var(--slate-ink)}
.crumb a{color:var(--moss);text-decoration:none;font-weight:500}
.crumb a:hover{text-decoration:underline}
.crumb b{color:var(--ink);font-weight:500}
.hero h1{font-family:var(--display);font-weight:600;font-size:clamp(28px,4.4vw,42px);line-height:1.12;margin:0 0 6px;text-wrap:balance}
.hero h1 em{font-style:italic;font-weight:500;color:var(--moss)}
.hero>p{margin:0 0 22px;color:var(--muted);max-width:60ch}
.reader{background:var(--paper);box-shadow:0 10px 30px rgba(42,58,79,.08);border:2px solid var(--moss);border-radius:18px;padding:22px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 28px;position:relative}
.reader::after{content:"";position:absolute;inset:5px;border:1px solid var(--sand);border-radius:13px;pointer-events:none}
@media (max-width:760px){.reader{grid-template-columns:1fr;padding:18px}}
.q{display:flex;flex-direction:column;gap:8px;min-width:0;position:relative;z-index:1}
.q.wide{grid-column:1/-1}
.q label,.q .lbl{font-family:var(--display);font-weight:600;font-size:17px}
.q .help{margin:-4px 0 0;font-size:13px;color:var(--muted)}
.row{display:flex;gap:8px;flex-wrap:wrap}
.inp{flex:1 1 180px;min-width:0;border:1.5px solid var(--line);border-radius:12px;padding:10px 12px;font-size:15px;background:var(--paper)}
.inp:focus{outline:none;border-color:var(--ink)}
select.inp{flex:0 1 auto}
.q>.inp{flex:none;width:100%}
.add{border:1.5px solid var(--moss);color:var(--moss);background:var(--paper);border-radius:12px;padding:9px 16px;font-weight:500}
.add:hover{background:var(--tint)}
.chosen{display:flex;gap:6px;flex-wrap:wrap}
.chosen:empty{display:none}
.chip{border:0;border-radius:999px;padding:5px 12px;font-size:13.5px;display:inline-flex;gap:6px;align-items:center;background:var(--tint)}
.chip.book{background:#F5F0E6}
.chip:hover{text-decoration:line-through}
.sugg{display:flex;gap:6px;flex-wrap:wrap}
.sugg button{border:1.5px dashed var(--sand);background:none;border-radius:999px;padding:4px 11px;font-size:13px;color:var(--muted)}
.sugg button:hover{border-color:var(--ink);color:var(--ink)}
.pills{display:flex;gap:7px;flex-wrap:wrap}
.pill{border:1.5px solid var(--line);background:var(--paper);border-radius:999px;padding:5px 13px;font-size:13.5px}
.pill:hover{border-color:var(--ink)}
.pill[aria-pressed="true"]{background:var(--moss);border-color:var(--moss);color:var(--cloth-ink)}
.pill[aria-pressed="true"]::before{content:"✓ ";opacity:.9}
.avoid{border:1.5px solid var(--line);border-radius:12px;background:var(--paper)}
.avoid summary{cursor:pointer;padding:10px 14px;font-size:15px;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:10px}
.avoid summary::-webkit-details-marker{display:none}
.avoid summary::after{content:"";width:8px;height:8px;border-right:2px solid var(--ink);border-bottom:2px solid var(--ink);transform:rotate(45deg);margin-top:-4px;flex:none}
.avoid[open] summary::after{transform:rotate(-135deg);margin-top:4px}
.avoid[open] summary{border-bottom:1px solid var(--line)}
.avoid .help{margin:12px 14px 10px}
.avoid .pills{padding:0 14px 14px}
.go{grid-column:1/-1;display:flex;gap:14px;align-items:center;flex-wrap:wrap;position:relative;z-index:1}
.primary{border:0;background:var(--moss);color:var(--cloth-ink);border-radius:999px;padding:13px 26px;font-weight:600;font-size:15.5px}
.primary:hover{background:var(--moss-hover)}
.linkbtn{border:0;background:none;text-decoration:underline;text-underline-offset:3px;color:var(--muted);padding:6px 0;font-size:14px}
.linkbtn:hover{color:var(--ink)}

/* picks */
.picks{padding-block:34px 4px}
.picks>h2{font-family:var(--display);font-weight:700;font-size:clamp(24px,3.4vw,32px);margin:0 0 4px;text-wrap:balance}
.picks>p{margin:0 0 6px;color:var(--muted);font-size:14px}
.stack{margin-top:26px}
.stack h3{font-family:var(--display);font-weight:600;font-size:19px;margin:0 0 4px;text-wrap:balance}
.stack h3 i{font-weight:500;color:var(--moss)}
.stack .why{margin:0 0 14px;font-size:13px;color:var(--muted)}
.kitline{margin:-4px 0 14px}

/* genre shelf */

.eyebrow{font-family:var(--display);font-weight:600;font-size:22px;margin:0 0 2px}
.sub{margin:0 0 6px;font-size:14px;color:var(--muted)}
.shelf{display:flex;align-items:flex-end;gap:5px;overflow-x:auto;padding:22px 4px 0;border-bottom:12px solid var(--sand);box-shadow:0 6px 0 -2px #D8CDB8;scrollbar-width:thin}
.spine{flex:0 0 auto;width:48px;border:0;border-radius:3px 3px 0 0;display:flex;flex-direction:column;align-items:center;justify-content:space-between;padding:12px 0 10px;color:var(--cloth-ink);position:relative;transition:transform .18s ease}
.spine::before,.spine::after{content:"";position:absolute;left:6px;right:6px;height:3px;border-top:1px solid currentColor;border-bottom:1px solid currentColor;opacity:.55}
.spine::before{top:7px}.spine::after{bottom:30px}
.spine .gt{writing-mode:vertical-rl;transform:rotate(180deg);font-family:var(--display);font-weight:600;font-size:14.5px;white-space:nowrap;margin-top:10px}
.spine .gn{font-size:11px;font-variant-numeric:tabular-nums;opacity:.85}
.spine:hover{transform:translateY(-6px)}
.spine[aria-pressed="true"]{transform:translateY(-16px)}
.spine.light{color:var(--ink)}
.genre{padding-top:26px}
.gbar{display:flex;justify-content:space-between;align-items:flex-end;gap:12px;flex-wrap:wrap;margin-bottom:18px}
.gbar h2{font-family:var(--display);font-weight:700;font-size:26px;margin:0}
.gbar p{margin:0;font-size:13.5px;color:var(--muted)}
.tools{display:flex;gap:8px;flex-wrap:wrap}
.tools select{border:1.5px solid var(--line);border-radius:999px;padding:7px 12px;background:var(--paper);font-size:14px}
.btn{border:1.5px solid var(--ink);background:var(--paper);border-radius:999px;padding:8px 18px;font-size:14px;font-weight:500}
.btn:hover{background:var(--tint)}
.more{display:flex;justify-content:center;padding-block:30px 0}

/* covers */
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:30px 20px}
@media (max-width:420px){.grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 14px}}
.card{border:0;background:none;padding:0;text-align:left;display:flex;flex-direction:column;gap:9px;min-width:0}
.card:hover .cover{transform:translateY(-4px) rotate(-.6deg);box-shadow:6px 10px 18px rgba(42,58,79,.22)}
.card h4{margin:0;font-family:var(--display);font-weight:600;font-size:15px;line-height:1.28;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.card .meta{font-size:12.5px;color:var(--muted);line-height:1.4}
.cover{position:relative;aspect-ratio:2/3;max-width:100%;border-radius:3px 7px 7px 3px;background:var(--c,var(--ink));color:var(--t,var(--cloth-ink));box-shadow:3px 5px 10px rgba(42,58,79,.16);padding:12px 12px 12px 18px;display:flex;flex-direction:column;transition:transform .2s ease,box-shadow .2s ease;overflow:hidden}
.cover::before{content:"";position:absolute;left:0;top:0;bottom:0;width:7px;background:rgba(42,58,79,.16);box-shadow:1px 0 0 rgba(245,240,230,.12)}
.frame{flex:1;border:1px solid currentColor;outline:1px solid currentColor;outline-offset:3px;margin:4px;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;gap:8px;padding:10px 6px;min-height:0}
.frame .ct{font-family:var(--display);font-weight:600;font-size:15px;line-height:1.2;text-wrap:balance;display:-webkit-box;-webkit-line-clamp:5;-webkit-box-orient:vertical;overflow:hidden}
.frame .rule{width:26px;border-top:1px solid currentColor;opacity:.7}
.frame .ca{font-size:11px;letter-spacing:.13em;text-transform:uppercase;line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:inherit;z-index:1;background:var(--c)}
.seal{z-index:2;position:absolute;right:8px;top:8px;width:40px;height:40px;border-radius:50%;background:var(--mustard);color:var(--ink);display:grid;place-items:center;text-align:center;font-size:11px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;line-height:1.1;box-shadow:0 0 0 2px var(--c,var(--ink)),0 0 0 3px var(--mustard)}
.seal.cal{background:#D8CDB8}
.ribbon{z-index:2;position:absolute;left:18px;top:0;background:var(--cloth-ink);color:var(--ink);box-shadow:0 1px 3px rgba(42,58,79,.25);font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;padding:3px 7px 5px;border-radius:0 0 4px 4px}
.lsel{flex-wrap:wrap}.lsel #resetListFilters{font-size:12px;min-height:44px;padding:9px 14px;white-space:nowrap}
.release-notice{margin:18px 0;padding:18px 22px;background:var(--cream);border-left:3px solid var(--gold);color:var(--ink);font-size:14px;line-height:1.7}.release-notice p{margin:0 0 10px}.release-notice button{margin:4px 10px 0 0}.release-notice[hidden]{display:none}
.empty{grid-column:1/-1;color:var(--muted);padding:12px 0;margin:0}

/* sheet */
.scrim{position:fixed;inset:0;background:rgba(42,58,79,.42);z-index:20;display:flex;justify-content:center;align-items:flex-end}
@media (min-width:760px){.scrim{align-items:center;padding:24px}}
.sheet{background:var(--paper);width:100%;max-width:820px;max-height:92vh;overflow:auto;border-radius:20px 20px 0 0;padding:22px max(18px,env(safe-area-inset-right,0px)) calc(22px + env(safe-area-inset-bottom,0px)) max(18px,env(safe-area-inset-left,0px));position:relative}
@media (min-width:760px){.sheet{border-radius:20px;padding:30px}}
.x{position:absolute;right:max(12px,env(safe-area-inset-right,0px));top:12px;border:0;background:var(--tint);width:36px;height:36px;border-radius:50%;font-size:20px;line-height:1;display:grid;place-items:center}
.detail{display:grid;grid-template-columns:200px minmax(0,1fr);gap:26px;align-items:start}
@media (max-width:620px){.detail{grid-template-columns:1fr}.detail .cover{width:150px}}
.detail .cover .ct{font-size:19px}
.detail h2{font-family:var(--display);font-weight:700;font-size:clamp(23px,3.4vw,30px);line-height:1.15;margin:0 40px 4px 0;text-wrap:balance}
.by{color:var(--muted);margin:0 0 12px;font-size:14px}
.tags{display:flex;gap:6px;flex-wrap:wrap;margin:0 0 14px}
.tag{font-size:12px;font-weight:500;padding:3px 10px;border-radius:999px;background:var(--tint);white-space:nowrap}
.tag.award{background:#F5F0E6;color:var(--mustard-ink)}
.tag.pd{background:var(--sage);color:var(--forest)}
.tag.ell{background:var(--sage);color:var(--slate-ink)}
.desc{margin:0 0 14px;font-size:15.5px;max-width:62ch}
.note{margin:0 0 6px;font-size:13.5px}
.note b{font-weight:600}
.snote{color:var(--mustard-ink)}
.contains{margin:0 0 14px;font-size:13.5px;color:var(--mustard-ink)}
.contains.clean{color:var(--forest)}
.buy{display:inline-flex;align-items:center;gap:8px;background:var(--mustard);color:var(--ink);text-decoration:none;font-weight:600;border-radius:999px;padding:11px 22px;font-size:15px;margin:4px 0 16px}
.buy:hover{background:#C99A3B}
.kits{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin:0;font-size:13px}
.kits>span{font-weight:600;color:var(--forest);margin-right:2px}
.kits a{background:var(--paper);border:1px solid #E6EEE8;color:var(--forest);text-decoration:none;border-radius:999px;padding:3px 11px;font-weight:500}
.kits a:hover{border-color:var(--forest)}
.kitbox{background:var(--sage);border-radius:12px;padding:12px 14px;margin:0 0 4px}
.like{margin-top:26px;border-top:1px solid var(--line);padding-top:20px}
.like h3{font-family:var(--display);font-weight:600;font-size:18px;margin:0 0 14px}
.likes{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
@media (max-width:620px){.likes{grid-template-columns:repeat(2,minmax(0,1fr))}}
.likes .frame .ct{font-size:13px}

footer{border-top:1px solid var(--line);margin-top:28px}
footer .wrap{padding-block:12px 24px}
footer p{margin:0;font-size:11px;line-height:1.5;color:var(--muted)}

/* weekly pick + talk about it */
.chair{margin-top:56px}
.chairbox{display:grid;grid-template-columns:150px minmax(0,1fr) minmax(0,1fr);gap:28px;align-items:start;background:var(--sage);border-radius:18px;padding:26px}
@media (max-width:860px){.chairbox{grid-template-columns:120px minmax(0,1fr)}.talk{grid-column:1/-1}}
@media (max-width:480px){.chairbox{grid-template-columns:1fr;padding:20px}.chairbox .card{width:130px}}
.chair .kick{margin:0 0 4px;font-size:11.5px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--forest)}
.chair h2{font-family:var(--display);font-weight:700;font-size:24px;line-height:1.2;margin:0 0 4px;text-wrap:balance}
.chair .by{margin:0 0 10px}
.chair .why{margin:0 0 14px;font-size:14.5px;max-width:52ch}
.chair .acts{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.chair .buy{margin:0;padding:9px 18px;font-size:14px}
.talk h3{font-family:var(--display);font-weight:600;font-size:18px;margin:0 0 10px}
.talk ol{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:10px;counter-reset:q}
.talk li{counter-increment:q;display:grid;grid-template-columns:26px 1fr;gap:8px;font-size:14.5px;line-height:1.45}
.talk li::before{content:counter(q);width:24px;height:24px;border-radius:50%;background:var(--paper);color:var(--forest);font-weight:600;font-size:12px;display:grid;place-items:center;margin-top:1px}

/* suggest a book */
.suggest{margin-top:28px}
.sbox{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.3fr);gap:24px 32px;border:1.5px dashed var(--sand);border-radius:18px;padding:24px}
@media (max-width:760px){.sbox{grid-template-columns:1fr;padding:20px}}
.sbox .kick{margin:0 0 4px;font-size:11.5px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--slate-ink)}
.sbox h2{font-family:var(--display);font-weight:700;font-size:23px;line-height:1.2;margin:0 0 6px;text-wrap:balance}
.sbox>div>p{margin:0;font-size:14px;color:var(--muted);max-width:42ch}
#sForm{display:flex;flex-direction:column;gap:10px;min-width:0}
#sForm .row .inp{flex:1 1 200px}
#sForm textarea{flex:none;resize:vertical;min-height:64px;font:inherit;font-size:14.5px}
#sForm .acts{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
#sForm .primary{padding:10px 20px;font-size:14.5px}
.sstat{margin:0;font-size:13.5px;color:var(--forest)}
.sstat.err{color:var(--brick)}
.slist{grid-column:1/-1;border-top:1px solid var(--line);padding-top:16px}
.slist h3{font-family:var(--display);font-weight:600;font-size:17px;margin:0 0 8px}
.slist ul{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:6px;font-size:14px}
.slist li span{color:var(--muted);font-size:12.5px}

/* ===== Liquid Glass layer ===== */
:root{--glass:rgba(245,240,230,.58);--glass-strong:rgba(245,240,230,.78);--glass-edge:rgba(245,240,230,.85);--glass-line:rgba(42,58,79,.09);--glass-shadow:0 1px 0 rgba(245,240,230,.9) inset,0 0 0 1px rgba(245,240,230,.55) inset,0 18px 50px rgba(42,58,79,.10),0 2px 6px rgba(42,58,79,.05)}
body{background:#F5F0E6}
.bgfx{position:fixed;inset:0;z-index:-1;overflow:hidden;pointer-events:none;background:#F5F0E6}
.bgfx i{position:absolute;border-radius:50%;filter:blur(70px);opacity:.55}
.bgfx i:nth-child(1){width:46vw;height:46vw;left:-12vw;top:-14vw;background:#D8CDB8}
.bgfx i:nth-child(2){width:40vw;height:40vw;right:-10vw;top:4vw;background:#D8CDB8}
.bgfx i:nth-child(3){width:34vw;height:34vw;left:28vw;top:30vh;background:#D8CDB8;opacity:.5}
.bgfx i:nth-child(4){width:38vw;height:38vw;right:-6vw;bottom:-14vw;background:#D8CDB8;opacity:.6}
.bgfx i:nth-child(5){width:30vw;height:30vw;left:-8vw;bottom:-8vw;background:#D8CDB8;opacity:.45}
@media (prefers-reduced-motion:no-preference){.bgfx i{animation:drift 26s ease-in-out infinite alternate}.bgfx i:nth-child(2){animation-duration:32s}.bgfx i:nth-child(3){animation-duration:38s}.bgfx i:nth-child(4){animation-duration:30s}}
@keyframes drift{to{transform:translate(4vw,3vh) scale(1.08)}}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:10;background:rgba(245,240,230,.7)}
.mast{position:sticky;top:env(safe-area-inset-top,0px);z-index:12;border:0;padding-top:12px;background:transparent}
.mast .wrap{background:var(--glass);-webkit-backdrop-filter:blur(22px) saturate(180%);backdrop-filter:blur(22px) saturate(180%);box-shadow:var(--glass-shadow);border-radius:999px;padding:10px 12px 10px 22px;max-width:1100px;width:calc(100% - 2*max(16px,env(safe-area-inset-left,0px)));padding-left:22px;padding-right:10px}
@media (max-width:560px){.mast .wrap{border-radius:24px;padding:12px 12px 12px 16px}}
.brand b{font-family:var(--sans);font-weight:600;font-size:17px;letter-spacing:-.01em}
.brand span{font-size:11px}
.lookup input{background:rgba(245,240,230,.7);border:1px solid var(--glass-line)}
.lookup input:focus{border-color:var(--moss);box-shadow:0 0 0 4px rgba(42,58,79,.14)}
.pop{background:var(--glass-strong);-webkit-backdrop-filter:blur(24px) saturate(180%);backdrop-filter:blur(24px) saturate(180%);border:1px solid var(--glass-edge);border-radius:18px}
.band{background:transparent}
.hero{padding-block:54px 30px;text-align:center}
.crumb{margin:0 0 16px}
.hero h1{font-family:var(--sans);font-weight:600;font-size:clamp(32px,5.2vw,56px);line-height:1.06;letter-spacing:-.03em;max-width:16ch;margin:0 auto 14px}
.hero h1 em{font-family:var(--display);font-style:italic;font-weight:500;letter-spacing:-.01em}
.hero>p{margin:0 auto 34px;max-width:52ch;font-size:16.5px}
.reader{text-align:left;max-width:920px;margin:0 auto;background:var(--glass);-webkit-backdrop-filter:blur(28px) saturate(170%);backdrop-filter:blur(28px) saturate(170%);border:0;box-shadow:var(--glass-shadow);border-radius:30px;padding:30px;gap:26px 30px}
.reader::after{display:none}
@media (max-width:760px){.reader{padding:20px;border-radius:24px}}
.q label,.q .lbl{font-family:var(--sans);font-weight:600;font-size:15.5px;letter-spacing:-.005em}
.inp{background:rgba(245,240,230,.72);border:1px solid var(--glass-line);border-radius:14px;padding:12px 14px;transition:box-shadow .15s ease,border-color .15s ease}
.inp:focus{border-color:var(--moss);box-shadow:0 0 0 4px rgba(42,58,79,.14)}
.add{background:rgba(245,240,230,.72);border:1px solid var(--glass-line);color:var(--moss);border-radius:999px;padding:10px 18px;font-weight:600}
.add:hover{background:#F5F0E6;border-color:rgba(42,58,79,.35)}
.chip{background:rgba(245,240,230,.8);border:1px solid var(--glass-line);border-radius:999px}
.chip.book{background:rgba(42,58,79,.10);border-color:rgba(42,58,79,.18);color:var(--moss)}
.sugg button{border:1px solid var(--glass-line);background:rgba(245,240,230,.45);border-style:solid}
.sugg button:hover{background:#F5F0E6}
.avoid{background:rgba(245,240,230,.6);border:1px solid var(--glass-line);border-radius:16px}
.pill{background:rgba(245,240,230,.75);border:1px solid var(--glass-line)}
.go{justify-content:flex-start;padding-top:4px}
.primary{box-shadow:0 1px 0 rgba(245,240,230,.25) inset,0 8px 20px rgba(42,58,79,.28);transition:transform .15s ease,box-shadow .15s ease}
.primary:hover{transform:translateY(-1px);box-shadow:0 1px 0 rgba(245,240,230,.25) inset,0 12px 26px rgba(42,58,79,.32)}
.primary:active{transform:scale(.98)}
.picks{padding-block:40px 4px}
.picks>h2{font-family:var(--sans);font-weight:600;letter-spacing:-.025em}
.stack{background:var(--glass);-webkit-backdrop-filter:blur(24px) saturate(160%);backdrop-filter:blur(24px) saturate(160%);box-shadow:var(--glass-shadow);border-radius:26px;padding:24px 24px 28px;margin-top:18px}
.stack h3{font-family:var(--sans);font-weight:600;font-size:18px;letter-spacing:-.01em}
.stack h3 i{font-family:var(--display);font-style:italic;font-weight:500}
@media (max-width:560px){.stack{padding:18px 16px 22px;border-radius:22px}}
.card h4{font-family:var(--sans);font-weight:600;font-size:14px;letter-spacing:-.005em}
.cover{border-radius:6px 12px 12px 6px}
.chairbox{background:var(--glass);-webkit-backdrop-filter:blur(26px) saturate(160%);backdrop-filter:blur(26px) saturate(160%);box-shadow:var(--glass-shadow);border-radius:28px}
.chair h2,.sbox h2{font-family:var(--sans);font-weight:600;letter-spacing:-.02em}
.chair .kick{color:var(--moss)}
.talk h3{font-family:var(--sans);font-weight:600}
.sbox{background:var(--glass);-webkit-backdrop-filter:blur(26px) saturate(160%);backdrop-filter:blur(26px) saturate(160%);box-shadow:var(--glass-shadow);border:0;border-radius:28px}
.scrim{background:rgba(42,58,79,.28);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.sheet{background:rgba(245,240,230,.86);-webkit-backdrop-filter:blur(30px) saturate(180%);backdrop-filter:blur(30px) saturate(180%);box-shadow:var(--glass-shadow)}
@media (min-width:760px){.sheet{border-radius:30px}}
.detail h2{font-family:var(--sans);font-weight:600;letter-spacing:-.025em}
.like h3{font-family:var(--sans);font-weight:600}
.x{background:rgba(42,58,79,.08)}
.hero>p.crumb{font-size:12.5px;margin:0 0 18px;max-width:none}
#picks,#suggest,#chair{scroll-margin-top:110px}
.medals{display:flex;flex-wrap:wrap;gap:4px;margin-top:-3px}
.medal{display:inline-flex;align-items:center;gap:4px;font-size:11px;font-weight:600;line-height:1;padding:4px 8px 4px 6px;border-radius:999px;white-space:nowrap}
.medal b{font-weight:500;opacity:.8}
.medal.new{background:#F5F0E6;color:#A8502F}
.medal.cal{background:#E6EEE8;color:#6B7F9E}
.medal svg{flex:none}
.medal.honor{background:transparent;box-shadow:inset 0 0 0 1px currentColor}
.picktools{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:14px 0 4px}
.btn2{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--glass-line);background:var(--glass-strong);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);box-shadow:var(--glass-shadow);color:var(--moss);border-radius:999px;padding:10px 18px;font-weight:600;font-size:14px}
.btn2:hover{background:#F5F0E6}
.dlnote{font-size:13px;color:var(--muted)}
.dlstat{font-size:13px;color:var(--moss);font-weight:500}
.dlstat.err{color:var(--brick)}
.seg{display:inline-flex;gap:4px;padding:4px;border-radius:999px;background:rgba(42,58,79,.06);align-self:flex-start;flex-wrap:wrap}
.seg button{border:0;background:transparent;border-radius:999px;padding:8px 16px;font-size:14px;font-weight:500;color:var(--muted)}
.seg button[aria-checked="true"]{background:#F5F0E6;color:var(--ink);box-shadow:0 1px 3px rgba(42,58,79,.14)}
#sGenre{flex:0 1 210px}
.tabs{display:inline-flex;gap:4px;padding:5px;border-radius:999px;background:var(--glass);-webkit-backdrop-filter:blur(20px) saturate(170%);backdrop-filter:blur(20px) saturate(170%);box-shadow:var(--glass-shadow);margin:0 auto 26px;flex-wrap:wrap;justify-content:center}
.tabs button{border:0;background:transparent;border-radius:999px;padding:10px 20px;font-size:14.5px;font-weight:600;color:var(--muted);transition:background .15s ease,color .15s ease}
.tabs button:hover{color:var(--ink)}
.tabs button[aria-selected="true"]{background:var(--moss);color:var(--cloth-ink);box-shadow:0 6px 16px rgba(42,58,79,.25)}
.tabs .ts{display:none}
@media (max-width:760px){.tabs{flex-wrap:nowrap;max-width:100%;overflow-x:auto;justify-content:flex-start;scrollbar-width:none}.tabs::-webkit-scrollbar{display:none}.tabs button{white-space:nowrap;flex:none}}
@media (max-width:480px){.tabs{flex-wrap:nowrap}.tabs button{padding:9px 12px;font-size:13.5px;white-space:nowrap}.tabs .tl{display:none}.tabs .ts{display:inline}}
.plist{padding-block:6px 4px}
.ltools{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:12px}
.lchips{display:flex;gap:6px;flex-wrap:wrap}
.lchips button{border:1px solid var(--glass-line);background:rgba(245,240,230,.6);border-radius:999px;padding:8px 14px;font-size:13.5px;font-weight:500;color:var(--ink)}
.lchips button[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:var(--cloth-ink)}
.lsel{display:flex;gap:8px}
.lsel select{border:1px solid var(--glass-line);background:rgba(245,240,230,.75);border-radius:999px;padding:9px 14px;font-size:14px}
.lcount{margin:0 0 4px;font-size:13.5px;color:var(--muted)}
.more{display:flex;justify-content:center;padding-top:22px}

/* ===== Apple layer: SF-style type, a light gray canvas, #F5F0E6 rounded sections, a segmented control. Plain header. ===== */
:root{--sans:-apple-system,BlinkMacSystemFont,"SF Pro Text","Inter","Helvetica Neue",Arial,sans-serif;--display:-apple-system,BlinkMacSystemFont,"SF Pro Display","Inter","Helvetica Neue",Arial,sans-serif;
  --canvas:#F5F0E6;--ink:#2A3A4F;--muted:#6B7F9E;--hair:rgba(42,58,79,.09);--field:#F5F0E6}
body{background:var(--canvas);color:var(--ink);font-family:var(--sans);font-size:16px;letter-spacing:-.011em}
.bgfx,body::before{display:none}
.mast{position:static;padding:0;background:#F5F0E6;border-bottom:1px solid var(--hair)}
.mast .wrap{background:transparent;-webkit-backdrop-filter:none;backdrop-filter:none;box-shadow:none;border-radius:0;width:auto;max-width:1140px;padding-block:12px;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
@media (max-width:560px){.mast .wrap{border-radius:0;padding-block:12px}}
.brand b{font-family:var(--display);font-weight:600;font-size:18px;letter-spacing:-.022em}
.brand span{font-size:12.5px;letter-spacing:-.005em;text-transform:none;color:var(--muted)}
.lookup input{background:var(--field);border:1px solid transparent;border-radius:10px;font-size:14.5px}
.lookup input:focus{background:#F5F0E6;border-color:var(--forest);box-shadow:0 0 0 4px rgba(42,58,79,.14)}
.pop{background:#F5F0E6;-webkit-backdrop-filter:none;backdrop-filter:none;border:1px solid var(--hair);border-radius:14px;box-shadow:0 16px 40px rgba(42,58,79,.14)}
.hero{padding-block:56px 34px;text-align:center}
.hero>p.crumb{font-size:13px;color:var(--muted);margin:0 0 22px}
.crumb a{color:var(--forest)}
.hero h1{font-family:var(--display);font-weight:700;font-size:clamp(36px,6vw,64px);line-height:1.05;letter-spacing:-.038em;max-width:17ch;margin:0 auto 16px;color:var(--ink)}
.hero h1 em{font-family:inherit;font-style:normal;font-weight:700;letter-spacing:inherit;color:var(--forest)}
.hero>p{font-size:clamp(17px,2vw,20px);line-height:1.45;color:var(--muted);max-width:44ch;margin:0 auto 34px;letter-spacing:-.016em}
.tabs{background:rgba(107,127,158,.12);-webkit-backdrop-filter:none;backdrop-filter:none;box-shadow:none;padding:3px;gap:2px;margin:0 auto 34px}
.tabs button{padding:8px 18px;font-size:14px;font-weight:500;color:var(--ink);letter-spacing:-.01em}
.tabs button:hover{color:var(--ink);background:rgba(245,240,230,.45)}
.tabs button[aria-selected="true"]{background:#F5F0E6;color:var(--ink);font-weight:600;box-shadow:0 3px 8px rgba(42,58,79,.12),0 0 0 .5px rgba(42,58,79,.05)}
.reader{background:#F5F0E6;-webkit-backdrop-filter:none;backdrop-filter:none;box-shadow:0 1px 2px rgba(42,58,79,.04);border-radius:28px;padding:36px;gap:28px 32px}
@media (max-width:760px){.reader{padding:22px;border-radius:22px}}
.q label,.q .lbl{font-family:var(--sans);font-weight:600;font-size:17px;letter-spacing:-.022em}
.q .help{font-size:14px;color:var(--muted)}
.inp{background:var(--field);border:1px solid transparent;border-radius:12px;padding:12px 14px;font-size:16px}
.inp:focus{background:#F5F0E6;border-color:var(--forest);box-shadow:0 0 0 4px rgba(42,58,79,.14)}
.add{background:var(--field);border:0;color:var(--forest);border-radius:999px;font-weight:600}
.add:hover{background:#E6EEE8;border:0}
.chip{background:var(--field);border:0}
.chip.book{background:rgba(42,58,79,.10);color:var(--forest);border:0}
.sugg button{background:#F5F0E6;border:1px solid var(--hair);color:var(--muted)}
.sugg button:hover{border-color:var(--ink);color:var(--ink);background:#F5F0E6}
.avoid{background:var(--field);border:0;border-radius:14px}
.avoid[open] summary{border-bottom:1px solid var(--hair)}
.pill{background:#F5F0E6;border:1px solid var(--hair)}
.pill[aria-pressed="true"]{background:var(--forest);border-color:var(--forest);color:#F5F0E6}
.primary{background:var(--forest);color:#F5F0E6;box-shadow:none;border-radius:999px;padding:13px 26px;font-size:17px;font-weight:500;letter-spacing:-.02em}
.primary:hover{background:var(--moss-hover);transform:none;box-shadow:none}
.linkbtn{color:var(--forest);text-decoration:none;font-size:15px}
.linkbtn:hover{color:var(--forest);text-decoration:underline}
.picks{padding-block:46px 4px}
.picks>h2{font-family:var(--display);font-weight:700;font-size:clamp(28px,4vw,40px);letter-spacing:-.035em;text-align:center}
.picks>p{text-align:center}
.picktools{justify-content:center}
.stack{background:#F5F0E6;-webkit-backdrop-filter:none;backdrop-filter:none;box-shadow:none;border-radius:28px;padding:28px 28px 32px;margin-top:20px}
@media (max-width:560px){.stack{padding:20px 16px 24px;border-radius:22px}}
.stack h3{font-family:var(--display);font-weight:700;font-size:22px;letter-spacing:-.028em}
.stack h3 i{font-family:inherit;font-style:normal;font-weight:700;color:var(--forest)}
.stack .why{font-size:14px}
.card h4{font-family:var(--sans);font-weight:600;font-size:14.5px;line-height:1.3;letter-spacing:-.016em}
.card .meta{font-size:13px;color:var(--muted)}
.cover{border-radius:10px;box-shadow:0 4px 14px rgba(42,58,79,.12)}
.cover::before{display:none}
.card:hover .cover{transform:translateY(-4px) scale(1.015);box-shadow:0 14px 30px rgba(42,58,79,.16)}
.frame .ct{font-family:var(--display);font-weight:700;letter-spacing:-.02em}
.ribbon{left:8px;top:8px;border-radius:999px;padding:4px 9px;font-size:11px;letter-spacing:-.005em;text-transform:none;background:rgba(245,240,230,.92);color:var(--ink);box-shadow:0 1px 4px rgba(42,58,79,.18)}
.ribbon.soon{background:var(--mustard);color:var(--ink)}
.chair{margin-top:60px}
.chairbox{background:#F5F0E6;-webkit-backdrop-filter:none;backdrop-filter:none;box-shadow:none;border-radius:28px;padding:32px}
.kick,.chair .kick,.sbox .kick{font-variant:normal;text-transform:none;letter-spacing:-.01em;font-size:15px;font-weight:600;color:var(--mustard-ink)}
.chair h2,.sbox h2{font-family:var(--display);font-weight:700;font-size:28px;letter-spacing:-.032em}
.talk h3{font-family:var(--display);font-weight:600;letter-spacing:-.02em}
.talk li::before{background:var(--canvas)}
.sbox{background:#F5F0E6;-webkit-backdrop-filter:none;backdrop-filter:none;box-shadow:none;border:0;border-radius:28px;padding:32px}
@media (max-width:760px){.chairbox,.sbox{padding:22px}}
.seg{background:rgba(107,127,158,.12)}
.scrim{background:rgba(42,58,79,.32);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.sheet{background:#F5F0E6;-webkit-backdrop-filter:none;backdrop-filter:none;box-shadow:0 30px 80px rgba(42,58,79,.25)}
.detail h2{font-family:var(--display);font-weight:700;letter-spacing:-.034em}
.like{border-top:1px solid var(--hair)}
.like h3{font-family:var(--display);font-weight:700;letter-spacing:-.025em}
.x{background:var(--field)}
.tag{background:var(--field)}
.buy{border-radius:999px;font-weight:600}
.btn2{background:#F5F0E6;-webkit-backdrop-filter:none;backdrop-filter:none;box-shadow:none;border:1px solid var(--hair);color:var(--forest)}
.btn2:hover{background:var(--field)}
.ltools{margin-bottom:16px}
.lchips button{background:#F5F0E6;border:1px solid var(--hair);font-weight:500;padding:8px 15px}
.lchips button:hover{border-color:rgba(42,58,79,.25)}
.lchips button[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:#F5F0E6}
.lsel select{background:#F5F0E6;border:1px solid var(--hair);font-weight:500}
.lcount{font-size:14px}
.mon{grid-column:1/-1;margin:14px 0 -12px;font-family:var(--display);font-weight:700;font-size:19px;letter-spacing:-.025em;color:var(--ink);padding-top:14px;border-top:1px solid var(--hair)}
.mon:first-child{margin-top:0;padding-top:0;border-top:0}
.mon span{font-weight:500;color:var(--muted);font-size:14px;margin-left:8px;letter-spacing:-.01em}
.rel{display:block;color:var(--mustard-ink);font-weight:600}
#picks,#suggest,#chair{scroll-margin-top:24px}
footer{border-top:0}
footer p{text-align:center;font-size:12px}
body{margin:0}
.frame{outline:none;border-color:color-mix(in srgb,currentColor 45%,transparent)}
.ltools{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center}
@media (max-width:760px){.ltools{grid-template-columns:1fr}}
@media (max-width:560px){.hero{padding-block:36px 26px}.hero>p{margin-bottom:26px}
  .lchips{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin-inline:-16px;padding:2px 16px}.lchips::-webkit-scrollbar{display:none}.lchips button{flex:none;white-space:nowrap}
  .lsel select{flex:1 1 0;min-width:0}.lsel{width:100%}}
/* ===== ELL layer: Lora headings, Poppins text, ELL colors on a #F5F0E6 ground ===== */
:root{--sans:"Poppins",system-ui,-apple-system,"Segoe UI",sans-serif;--display:"Lora",Georgia,"Times New Roman",serif;
  --ink:#2A3A4F;--muted:#6B7F9E;--canvas:#F5F0E6;--field:#F5F0E6;--hair:rgba(42,58,79,.12);--slate-tint:#E6EEE8;--sand-tint:#F5F0E6}
body{background:#F5F0E6;color:var(--ink);font-size:15px;letter-spacing:0}
.mast{background:var(--ink);border-bottom:0}
.brand b{font-family:var(--display);font-weight:600;font-size:20px;letter-spacing:0;color:#F5F0E6}
.brand span{color:#E6EEE8;font-size:12px;letter-spacing:.02em}
.lookup input{background:rgba(245,240,230,.12);color:#F5F0E6;border:1px solid rgba(245,240,230,.18)}
.lookup input::placeholder{color:#E6EEE8}
.lookup svg{color:#E6EEE8}
.lookup input:focus{background:#F5F0E6;color:var(--ink);border-color:var(--mustard);box-shadow:0 0 0 4px rgba(201,154,59,.25)}
.band{background:linear-gradient(180deg,var(--slate-tint) 0%,#F5F0E6 100%)}
.hero>p.crumb{color:var(--slate-ink)}
.hero h1{font-family:var(--display);font-weight:600;letter-spacing:-.015em;line-height:1.08;color:var(--ink)}
.hero h1 em{font-family:var(--display);font-style:italic;font-weight:500;letter-spacing:0;color:var(--forest)}
.hero>p{font-family:var(--sans);font-size:clamp(16px,1.8vw,18px);letter-spacing:0;color:var(--muted)}
.tabs{background:var(--sand-tint);box-shadow:inset 0 0 0 1px rgba(216,205,184,.7)}
.tabs button{font-family:var(--sans);font-weight:500;color:var(--ink);letter-spacing:0}
.tabs button:hover{background:rgba(245,240,230,.6)}
.tabs button[aria-selected="true"]{background:var(--forest);color:#F5F0E6;font-weight:600;box-shadow:0 4px 12px rgba(42,58,79,.28)}
.reader{background:#F5F0E6;box-shadow:0 1px 0 rgba(42,58,79,.04),0 18px 44px rgba(42,58,79,.09);border-top:4px solid var(--mustard)}
.q label,.q .lbl{font-family:var(--display);font-weight:600;font-size:18px;letter-spacing:0}
.inp{background:var(--field);font-size:15px}
.chip.book{background:rgba(42,58,79,.10)}
.chip{background:var(--sand-tint)}
.pill[aria-pressed="true"]{background:var(--forest);border-color:var(--forest)}
.primary{font-family:var(--sans);font-weight:600;font-size:15.5px;letter-spacing:0}
.picks>h2,.stack h3,.chair h2,.sbox h2,.detail h2,.like h3,.talk h3,.mon{font-family:var(--display);font-weight:600;letter-spacing:-.01em}
.stack h3 i{font-family:var(--display);font-style:italic;font-weight:500}
.stack{background:var(--slate-tint)}
.stack::before{content:"";display:block;width:36px;height:3px;border-radius:2px;background:var(--mustard);margin:0 0 14px}
.card h4{font-family:var(--display);font-weight:600;font-size:15px;letter-spacing:0}
.frame .ct{font-family:var(--display);font-weight:600;letter-spacing:0}
.ltools,.lcount{color:var(--ink)}
.lchips button{font-family:var(--sans)}
.lchips button[aria-pressed="true"]{background:var(--ink);border-color:var(--ink)}
.mon{color:var(--ink);border-top-color:rgba(216,205,184,.9)}
.mon span{font-family:var(--sans);color:var(--mustard-ink);font-weight:600}
.chairbox{background:var(--forest);color:#F5F0E6}
.chair .kick{color:#D8CDB8}
.chair h2,.chair .talk h3{color:#F5F0E6}
.chair .by,.chair .why{color:rgba(245,240,230,.82)}
.chairbox .medal.new{background:#F5F0E6}
.chairbox .medal.honor{color:#D8CDB8}
.chairbox .medal.cal{background:#E6EEE8}
.chair .linkbtn{color:#F5F0E6;text-decoration:underline;text-underline-offset:3px}
.talk li::before{background:rgba(245,240,230,.16);color:#F5F0E6}
.talk li{color:rgba(245,240,230,.92)}
.sbox{background:var(--sand-tint)}
.sbox .kick{color:var(--slate-ink)}
.sbox .inp{background:#F5F0E6}
.seg{background:rgba(42,58,79,.08)}
footer{background:var(--ink);margin-top:56px}
footer .wrap{padding-block:22px 28px}
footer p{color:#E6EEE8}
.chairbox .medal.honor{background:transparent;color:#D8CDB8}
.lstack::before{display:none}
.hero h1{max-width:20ch}
/* tabs: a static two-row grid on smaller screens, no sideways scroll */
@media (max-width:760px){
  .tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));width:100%;max-width:560px;overflow:visible;border-radius:22px;padding:4px;gap:4px}
  .tabs button{flex:none;white-space:normal;padding:10px 6px;line-height:1.2;text-align:center}
}
@media (max-width:480px){.tabs button{padding:10px 4px;font-size:13.5px}}
/* list filters: wrap, never scroll */
@media (max-width:560px){
  .lchips{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));overflow:visible;margin-inline:0;padding:0;gap:8px}
  .lchips button{white-space:normal;text-align:center;line-height:1.25}
}
/* suggest toggle: two equal halves that always sit side by side */
.seg{display:grid;grid-template-columns:1fr 1fr;width:100%;max-width:440px;flex-wrap:nowrap;border-radius:14px;padding:4px;gap:4px;background:rgba(42,58,79,.08)}
.seg button{border-radius:10px;padding:10px 8px;text-align:center;line-height:1.25;font-weight:500;color:var(--slate-ink)}
.seg button[aria-checked="true"]{background:#F5F0E6;color:var(--ink);font-weight:600;box-shadow:0 1px 4px rgba(42,58,79,.16)}
.slbl{margin:0;font-size:13px;font-weight:600;color:var(--slate-ink)}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}

/* The Literary Guide — editorial design system */
:root{--paper:#F5F0E6;--canvas:#F5F0E6;--ink:#2A3A4F;--muted:#6B7F9E;--forest:#2A3A4F;--moss:#2A3A4F;--moss-hover:#2A3A4F;--line:#E6EEE8;--sand:#D8CDB8;--mustard:#C99A3B;--field:#F5F0E6;--tint:#F5F0E6;--sage:#F5F0E6;--hair:#E6EEE8;--sans:Arial,Helvetica,sans-serif;--display:"Lora",Georgia,serif}
html{scroll-behavior:smooth}body{background:var(--canvas);font-family:var(--sans);font-size:15px;line-height:1.65;letter-spacing:0}.bgfx,body::before{display:none}.wrap{max-width:1240px;padding-inline:40px}.skip{position:fixed;top:-100px;left:16px;z-index:100;background:#F5F0E6;padding:12px 20px;color:var(--forest)}.skip:focus{top:12px}:focus-visible{outline:3px solid #A8502F;outline-offset:4px}button,a,input,select,summary,textarea{touch-action:manipulation}button{min-height:44px}
.mast{background:var(--paper);border-bottom:1px solid var(--line);position:relative;padding:0;z-index:15}.mast .wrap{max-width:1240px;width:100%;padding:24px 40px;background:none;box-shadow:none;border-radius:0;backdrop-filter:none;flex-wrap:nowrap}.brand{padding-left:52px;position:relative;gap:5px}.brand::before{content:"";position:absolute;left:0;top:3px;width:31px;height:32px;border:1.5px solid var(--forest);border-radius:2px 10px 2px 2px;transform:rotate(-8deg);background:linear-gradient(90deg,transparent 43%,var(--forest) 45%,var(--forest) 48%,transparent 50%)}.brand b{font-family:var(--display);font-size:24px;letter-spacing:-.6px;color:var(--ink);font-weight:600}.brand span{font-family:var(--sans);font-size:11px;letter-spacing:2.1px;text-transform:uppercase;color:var(--muted)}.lookup{flex-basis:300px}.lookup input{background:#F5F0E6;border:1px solid var(--line);color:var(--ink);padding:11px 12px 11px 38px;border-radius:7px;font-size:13px}.lookup input::placeholder{color:var(--muted)}.lookup svg{color:var(--muted)}.pop{background:var(--paper);border:1px solid var(--line);backdrop-filter:none}.pop button{padding:12px}
.band{background:var(--canvas)}.hero{padding-top:28px;padding-bottom:0;text-align:left;display:grid;grid-template-columns:minmax(0,1fr) minmax(330px,.85fr);gap:0 70px}.hero>p.crumb{grid-column:1/-1;font-size:11px;letter-spacing:.02em;margin:0 0 30px;color:var(--muted);max-width:none}.crumb a{color:var(--muted)}.intro{grid-column:1;align-self:center;padding-block:12px 42px}.intro .kicker,.formhead .kicker,.showcase .kicker{font:600 11px/1.4 var(--sans);letter-spacing:2.3px;text-transform:uppercase;color:var(--forest);margin:0 0 20px;display:flex;align-items:center;gap:12px}.intro .kicker::before{content:"";width:28px;height:1px;background:var(--mustard)}.hero h1{font-family:var(--display);font-weight:500;font-size:clamp(40px,4.3vw,62px);line-height:1.12;letter-spacing:-2.1px;max-width:14ch;margin:0 0 23px;color:var(--ink);text-wrap:balance}.hero h1 em{font-family:inherit;font-style:italic;font-weight:500;color:var(--forest)}#lede{max-width:48ch;font-size:15px;line-height:1.8;color:var(--muted);margin:0 0 25px}.intro-note{display:flex;gap:14px;align-items:center;color:var(--muted);font-size:11px}.intro-note span{width:30px;height:30px;display:grid;place-items:center;border:1px solid var(--sand);border-radius:50%;color:var(--forest);font-size:15px}.showcase{grid-column:2;grid-row:2;align-self:center;background:#E6EEE8;border:1px solid #E6EEE8;border-radius:140px 140px 10px 10px;padding:46px 34px 26px;text-align:center;position:relative;margin-bottom:35px}.showcase .kicker{justify-content:center;font-size:11px;margin-bottom:24px}.hero-books{display:flex;align-items:center;justify-content:center;gap:16px;min-height:206px}.hero-books .card{width:105px;flex:none;transform:rotate(-9deg)}.hero-books .card:nth-child(2){width:119px;transform:translateY(-10px);z-index:2}.hero-books .card:nth-child(3){transform:rotate(9deg)}.hero-books .cover{width:100%;border-radius:2px 5px 5px 2px;box-shadow:4px 10px 14px #2A3A4F25}.hero-books h4,.hero-books .meta,.hero-books .medals{display:none}.showcase>p:last-child{font-family:var(--display);font-size:17px;font-style:italic;margin:25px 0 0;color:var(--forest)}
.tabs{grid-column:1/-1;display:flex;justify-content:flex-start;gap:28px;padding:0;margin:0 0 32px;border-bottom:1px solid var(--line);border-radius:0;background:none;box-shadow:none;backdrop-filter:none;overflow:visible}.tabs button{position:relative;padding:17px 0;font:500 13px var(--sans);color:var(--muted);border-radius:0;white-space:nowrap;background:none}.tabs button:hover{background:none;color:var(--forest)}.tabs button[aria-selected=true]{background:none;color:var(--forest);box-shadow:none;font-weight:700}.tabs button[aria-selected=true]::after{content:"";position:absolute;height:3px;background:var(--forest);bottom:-1px;left:0;right:0}.tabs .ts{display:none}.tabs .tl{display:inline}
.reader{grid-column:1/-1;width:100%;max-width:none;background:var(--paper);border:1px solid var(--line);border-top:0;box-shadow:0 12px 35px #2A3A4F10;border-radius:12px;padding:30px 36px;gap:24px 36px;backdrop-filter:none;text-align:left}.reader::after{display:none}.formhead{grid-column:1/-1;padding-bottom:20px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;gap:24px}.formhead .kicker{margin:0 0 5px;font-size:11px}.formhead h2{font:500 27px/1.3 var(--display);margin:0}.formhead>p{max-width:30ch;font-size:12px;color:var(--muted);margin:0}.q label,.q .lbl{font:600 15px/1.5 var(--sans)}.q .help{font-size:12px;line-height:1.5}.inp{background:var(--field);border:1px solid var(--line);border-radius:6px;padding:11px 12px;font-size:14px;min-height:46px}.inp:focus{background:#F5F0E6;border-color:var(--forest);box-shadow:0 0 0 3px #2A3A4F12}.add{border:1px solid var(--line);border-radius:6px;background:var(--tint);font-size:13px;padding:9px 18px;color:var(--forest)}.sugg button{background:none;border:1px solid var(--line);font-size:11px;min-height:32px;padding:3px 12px;color:var(--muted)}.avoid{background:var(--field);border:1px solid var(--line);border-radius:6px}.avoid summary{font-size:13px;min-height:46px}.pill{font-size:12px;min-height:40px}.go{border-top:1px solid var(--line);padding-top:24px;gap:22px}.primary{border-radius:6px;font:600 13px var(--sans);padding:15px 23px;box-shadow:none;background:var(--forest);color:#F5F0E6}.primary:hover{box-shadow:none;transform:none}.go .primary::after{content:" ↗";padding-left:16px}.linkbtn{font-size:12px;color:var(--forest);text-decoration:underline;text-underline-offset:4px}.chip{font-size:12px;background:var(--tint)}
.picks{padding-top:48px}.picks>h2{text-align:left;font:500 36px/1.2 var(--display);letter-spacing:-1px}.picks>p{text-align:left}.picktools{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin:18px 0}.btn2{padding:12px 18px;border:1px solid var(--line);border-radius:6px;background:var(--paper);color:var(--forest);font-size:13px;box-shadow:none}.dlnote,.dlstat{font-size:12px}.stack{background:var(--paper);border:1px solid var(--line);box-shadow:none;backdrop-filter:none;border-radius:10px;padding:26px;margin-top:24px}.stack::before{display:none}.stack h3{font:500 26px var(--display);margin-bottom:8px}.stack h3 i{font-family:inherit;color:var(--forest)}.stack .why{font-size:13px;margin-bottom:24px}.grid{grid-template-columns:repeat(6,minmax(0,1fr));gap:28px 24px}.card{gap:10px;min-height:44px}.card h4{font:600 15px/1.4 var(--display)}.card .meta{font-size:11px}.cover{width:100%;border-radius:2px 6px 6px 2px;box-shadow:3px 5px 10px #2A3A4F20}.cover::before{display:block}.frame .ct{font-family:var(--display)}.card:hover .cover{transform:translateY(-5px);box-shadow:4px 12px 20px #2A3A4F30}.medals{display:flex;gap:4px;flex-wrap:wrap}.medal{display:inline-flex;align-items:center;gap:3px;font:600 11px var(--sans);padding:4px 6px;border-radius:3px;background:#F5F0E6;color:#A8502F}.medal svg{width:12px;height:12px}.medal.cal{background:#E6EEE8;color:#6B7F9E}.medal b{font-weight:400}.medal.honor{box-shadow:inset 0 0 0 1px #D8CDB8}.ribbon{border-radius:3px;font-size:11px}
.plist{padding-top:0}.ltools{display:flex;justify-content:space-between;gap:18px;flex-wrap:wrap;margin-bottom:18px}.lchips{display:flex;gap:7px;flex-wrap:wrap}.lchips button{border:1px solid var(--line);border-radius:5px;background:var(--paper);padding:9px 13px;font-size:12px}.lchips button[aria-pressed=true]{background:var(--forest);border-color:var(--forest);color:#F5F0E6}.lsel{display:flex;gap:8px}.lsel select{border:1px solid var(--line);background:var(--paper);border-radius:5px;padding:10px;font:12px var(--sans);min-height:44px}.lcount{color:var(--muted);font-size:12px}.lstack{margin-top:16px}.mon{grid-column:1/-1;font:500 25px var(--display);margin:16px 0 0}.mon span{font:12px var(--sans);color:var(--muted)}
.chair{margin-top:55px}.chairbox{background:var(--forest);color:#F5F0E6;border-radius:10px;padding:36px;gap:30px;grid-template-columns:140px 1fr 1fr;box-shadow:none;backdrop-filter:none}.chair .kick,.sbox .kick{font:600 11px var(--sans);text-transform:uppercase;letter-spacing:1.8px;margin-bottom:12px;color:#D8CDB8}.chair h2{font:500 30px/1.2 var(--display)}.chair .by,.chair .why{color:#E6EEE8;font-size:13px}.talk{padding-left:24px;border-left:1px solid #F5F0E630}.talk h3{font:500 21px var(--display);color:#F5F0E6}.talk li{font-size:12px;line-height:1.7;color:#E6EEE8}.talk li::before{background:#F5F0E616;color:#D8CDB8}.chair .linkbtn{color:#F5F0E6}.chair .buy{font-size:12px;border-radius:5px;padding:12px 18px}.suggest{margin-top:28px}.sbox{background:#F5F0E6;box-shadow:none;border:1px solid var(--line);border-radius:10px;padding:32px;backdrop-filter:none}.sbox .kick{color:var(--forest)}.sbox h2{font:500 29px/1.3 var(--display)}.sbox>div>p{font-size:13px;line-height:1.8}.seg{display:grid;grid-template-columns:1fr 1fr;background:#E6EEE8;padding:4px;border-radius:6px;max-width:440px;width:100%}.seg button{font:12px var(--sans);border:0;border-radius:4px;background:none;padding:10px;color:var(--muted)}.seg button[aria-checked=true]{background:var(--paper);color:var(--forest)}.slbl{font-size:12px;margin:0}.sbox .inp{background:var(--paper)}footer{background:none;border-top:1px solid var(--line);margin-top:50px}footer .wrap{padding-block:25px 35px}footer p{font-size:11px;color:var(--muted);text-align:left}.footer-brand{font:500 20px var(--display);margin-bottom:10px;color:var(--ink)}.scrim{background:#2A3A4Fc9;backdrop-filter:blur(5px)}.sheet{background:var(--paper);border-radius:12px;box-shadow:0 30px 80px #2A3A4F33}.detail h2{font:500 32px/1.2 var(--display)}.x{background:var(--tint);min-height:44px;width:44px}.desc{font-size:14px;line-height:1.8}.buy{border-radius:5px;font-size:13px}.like h3{font:500 24px var(--display)}.likes .card .cover{width:100%}#reader,#picks,#pList,#suggest,#chair{scroll-margin-top:24px}.slbl{color:var(--ink)}body.modal-open{overflow:hidden}
@media(min-width:1100px){.reader .q:nth-of-type(2),.reader .q:nth-of-type(3){grid-column:auto}}
@media(max-width:1050px){.hero{gap:0 35px}.hero-books{gap:10px}.hero-books .card{width:85px}.hero-books .card:nth-child(2){width:100px}.tabs{gap:22px}.tabs button{font-size:12px}.grid{grid-template-columns:repeat(4,minmax(0,1fr))}.chairbox{grid-template-columns:120px 1fr}.talk{grid-column:1/-1;border-left:0;border-top:1px solid #F5F0E630;padding:24px 0 0}.talk ol{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}}
@media(max-width:760px){.wrap{padding-inline:22px}.mast .wrap{padding:19px 22px;flex-wrap:wrap;gap:20px}.brand b{font-size:22px}.lookup{flex:1 1 100%}.hero{display:flex;flex-direction:column;padding-top:22px;gap:0}.hero>p.crumb{font-size:11px;margin-bottom:26px}.intro{padding:0 0 28px;width:100%}.intro .kicker{font-size:11px;margin-bottom:16px}.hero h1{font-size:47px;max-width:16ch;letter-spacing:-1.5px;margin-bottom:18px}#lede{font-size:14px;margin-bottom:18px}.showcase{display:none}.tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 16px;width:100%;max-width:none;border-radius:0;padding:0;margin-bottom:24px}.tabs button{white-space:normal;padding:14px 2px;font-size:12px;line-height:1.4;min-height:48px}.tabs .tl{display:inline}.tabs .ts{display:none}.reader{grid-template-columns:1fr;border-top:1px solid var(--line);padding:22px;gap:23px}.formhead{display:block;padding-bottom:18px}.formhead h2{font-size:26px}.formhead>p{max-width:none;margin-top:10px}.go{gap:14px}.go .primary{width:100%;padding:17px}.go .linkbtn{flex:1}.grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:25px 18px}.stack{padding:22px}.picks>h2{font-size:32px}.chairbox{padding:25px}.talk ol{display:flex}.sbox{grid-template-columns:1fr;padding:24px}.ltools{display:block}.lchips{margin-bottom:18px}.lsel{width:100%}.lsel select{flex:1;min-width:0}.lchips button{flex:0 1 auto}.lsel{margin-top:12px}.lcount{margin-top:15px}.detail h2{font-size:28px}}
@media(max-width:480px){.wrap{padding-inline:18px}.mast .wrap{padding-inline:18px}.hero h1{font-size:41px}.reader{padding:20px}.q .row{gap:8px;flex-wrap:nowrap}.q .row .inp{flex:1;min-width:0}.q .row .add{flex:none;padding:10px 14px}.grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:26px 18px}.stack{padding:18px}.card h4{font-size:14px}.chairbox{grid-template-columns:88px minmax(0,1fr);gap:20px}.chairbox .card{width:88px}.chair h2{font-size:24px}.chair .why{grid-column:1/-1}.chair .acts{gap:6px}.chair .by{font-size:11px}.talk{grid-column:1/-1}.sbox h2{font-size:26px}.sbox .row{flex-direction:column}.sbox .row .inp{flex:auto;width:100%}.sbox #sGenre{flex:auto}.sheet{border-radius:18px 18px 0 0;max-height:94dvh}.detail{gap:20px}.detail .cover{width:115px}.likes{gap:20px}.tabs button{font-size:11px}.lchips{display:flex;overflow:visible;margin-inline:0;padding:0}.lchips button{font-size:11px}.hero>p.crumb{line-height:1.8}}
/* Keep the entire original cover visible within the consistent book frame. */
.photo{object-fit:contain;object-position:center;padding:8px;background:#F5F0E6}
@media(max-width:480px){.photo{padding:6px}}
/* A quiet editorial feature: the cover carries the color, with subtle accents. */
.chairbox{background:#F5F0E6;color:var(--ink);border:1px solid #E6EEE8;box-shadow:0 5px 20px #2A3A4F05}
.chair .kick{color:#A8502F;letter-spacing:1.5px}
.chair h2,.chair .talk h3{color:var(--ink)}
.chair .by{color:var(--muted)}
.chair .why{color:#2A3A4F;line-height:1.85}
.chair .linkbtn{color:#2A3A4F;text-decoration-color:#D8CDB8}
.chair .linkbtn:hover{color:var(--forest);text-decoration-color:var(--forest)}
.chair .buy{background:#F5F0E6;color:var(--ink);border:1px solid #D8CDB8;box-shadow:none}
.chair .buy:hover{background:#E6EEE8;border-color:#D8CDB8}
.chairbox .medal.new,.chairbox .medal.honor{background:#F5F0E6;color:#A8502F;box-shadow:inset 0 0 0 1px #D8CDB8}
.chairbox .medal.cal{background:#E6EEE8;color:#2A3A4F}
.chair .talk{background:#F5F0E6;border:0;border-radius:8px;padding:22px 24px}
.chair .talk li{color:#2A3A4F;font-size:13px;line-height:1.8}
.chair .talk li::before{background:#E6EEE8;color:#2A3A4F;font-weight:600}
@media(max-width:1050px){.chair .talk{padding:24px;border-top:1px solid #E6EEE8}}
@media(max-width:480px){.chair .talk{padding:20px 16px}.chairbox{gap:24px 20px}}
/* Soft color blocks give the feature presence without a dark background. */
.chairbox{background:#E6EEE8;border-color:#E6EEE8;box-shadow:0 6px 22px #2A3A4F0a}
.chair .kick{color:#6B7F9E}
.chair h2,.chair .talk h3{color:#2A3A4F}
.chair .by{color:#6B7F9E}
.chair .why{color:#2A3A4F}
.chair .linkbtn{color:#2A3A4F;text-decoration-color:#6B7F9E}
.chair .linkbtn:hover{color:#2A3A4F;text-decoration-color:#2A3A4F}
.chair .buy{background:#D8CDB8;border-color:#C99A3B;color:#2A3A4F}
.chair .buy:hover{background:#D8CDB8;border-color:#C99A3B}
.chairbox .medal.new,.chairbox .medal.honor{background:#F5F0E6;color:#A8502F;box-shadow:inset 0 0 0 1px #D8CDB8}
.chairbox .medal.cal{background:#F5F0E6;color:#6B7F9E}
.chair .talk{background:#F5F0E6;border:1px solid #D8CDB8}
.chair .talk li{color:#2A3A4F}
.chair .talk li::before{background:#E6EEE8;color:#2A3A4F}
@media(max-width:1050px){.chair .talk{border-top-color:#D8CDB8}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}}

/* Approved Elevated Learning Lab palette. */
:root{--paper:#F5F0E6;--canvas:#F5F0E6;--ink:#2A3A4F;--muted:#2A3A4F;--line:#D8CDB8;--sand:#D8CDB8;--tint:#E6EEE8;--sage:#E6EEE8;--field:#F5F0E6;--hair:#D8CDB8;--forest:#2A3A4F;--moss:#2A3A4F;--moss-hover:#2A3A4F;--slate:#6B7F9E;--slate-ink:#2A3A4F;--mustard:#C99A3B;--mustard-ink:#2A3A4F;--brick:#A8502F;--brick-soft:#F5F0E6;--cloth-ink:#F5F0E6;--la-tint:#F5F0E6;--teal:#2A3A4F;--slate-tint:#E6EEE8;--sand-tint:#D8CDB8}
body,.band{background:var(--paper);color:var(--ink)}
:focus-visible{outline-color:var(--brick)}
.hero h1 em,.intro .kicker,.formhead .kicker{color:var(--brick)}
.mast{border-bottom:2px solid var(--sand)}
.lookup input,.inp,.avoid{background:var(--paper);color:var(--ink)}
.lookup input::placeholder,.inp::placeholder,textarea::placeholder{color:var(--ink);opacity:1}
.showcase{background:var(--sand);border-color:var(--sand)}
.showcase .kicker,.showcase>p:last-child{color:var(--ink)}
.reader{border:1px solid var(--sand);border-top:3px solid var(--slate)}
.tabs button[aria-selected=true]::after{background:var(--brick)}
.primary,.buy,.chair .buy{background:var(--mustard);color:var(--ink);border:1px solid var(--mustard)}
.primary:hover,.buy:hover,.chair .buy:hover{background:var(--sand);color:var(--ink);border-color:var(--ink)}
.pill[aria-pressed=true],.lchips button[aria-pressed=true]{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.chip,.chip.book,.tag,.tag.pd,.tag.ell,.kitbox,.add{background:var(--sage);color:var(--ink)}
.medal,.medal.cal,.medal.honor,.tag.award{background:var(--sand);color:var(--ink);box-shadow:none}
.contains,.contains.clean,.snote,.sstat,.sstat.err{color:var(--ink)}
.sstat.err{border-left:3px solid var(--brick);padding-left:10px}
.photo{background:var(--paper)}
.sbox{background:var(--sage);border-color:var(--sand);border-top:3px solid var(--slate)}
.seg{background:var(--sand)}
.seg button,.seg button[aria-checked=true],.sbox .kick{color:var(--ink)}
.seg button[aria-checked=true]{background:var(--paper)}
.chairbox{background:var(--sand);color:var(--ink);border:1px solid var(--sand);border-top:4px solid var(--slate);box-shadow:none}
.chair .kick{color:var(--brick)}
.chair h2,.chair .talk h3,.chair .by,.chair .why,.chair .talk li{color:var(--ink)}
.chair .linkbtn,.chair .linkbtn:hover{color:var(--ink);text-decoration-color:var(--slate)}
.chairbox .medal.new,.chairbox .medal.honor,.chairbox .medal.cal{background:var(--paper);color:var(--ink);box-shadow:none}
.chair .talk{background:var(--sage);border:1px solid var(--sage)}
.chair .talk li::before{background:var(--paper);color:var(--ink);border:1px solid var(--sand)}
.scrim{background:rgba(42,58,79,.65)}
@media(max-width:1050px){.chair .talk{border-top-color:var(--sage)}}

/* A bookshop rhythm: open shelves, readable details, and a few colored moments. */
body{font-size:16px;line-height:1.7}
.wrap{max-width:1200px;padding-inline:36px}
.mast .wrap{max-width:1200px;padding:23px 36px}
.brand b{font-size:26px}
.brand span{letter-spacing:1.5px}
.mast{border-bottom:1px solid var(--sand)}
.lookup{flex-basis:320px}.lookup input{font-size:14px;background:var(--sage);border-color:var(--sage)}
.hero{padding-top:22px;gap:0 48px;grid-template-columns:minmax(0,1.2fr) minmax(300px,.8fr)}
.hero>p.crumb{margin-bottom:20px;font-size:12px}
.intro{padding-block:12px 28px}
.intro .kicker{font-size:12px;letter-spacing:1.6px;margin-bottom:14px}
.hero h1{font-size:clamp(40px,4.6vw,62px);max-width:15ch;line-height:1.12;margin-bottom:18px}
#lede{font-size:17px;line-height:1.7;max-width:42ch;margin-bottom:0}
.intro-note{display:none}
.showcase{background:none;border:0;border-radius:0;padding:24px 10px 20px;margin-bottom:20px;isolation:isolate}
.showcase::before{content:"";position:absolute;inset:40px 0 42px;background:var(--sand);border-radius:50%;z-index:-1}
.showcase .kicker{display:none}
.showcase>p:last-child{font:12px var(--sans);letter-spacing:1.5px;text-transform:uppercase;margin-top:20px}
.hero-books{min-height:220px;gap:14px}
.hero-books .card{width:102px}.hero-books .card:nth-child(2){width:118px}
.hero-books .cover{box-shadow:4px 9px 16px rgba(42,58,79,.12)}
.tabs{gap:28px;margin-bottom:26px;border-bottom-color:var(--sand)}
.tabs button{font-size:14px;padding-block:15px}
.reader{position:relative;padding:28px 30px;border:1px solid var(--sand);border-top:0;border-radius:4px;box-shadow:none;gap:24px 32px}
.reader::before{content:"";height:3px;background:var(--slate);position:absolute;top:0;left:0;right:0}
.formhead{padding-bottom:18px;gap:20px}.formhead .kicker{display:none}
.formhead h2{font-size:29px}.formhead>p{font-size:14px;max-width:37ch;line-height:1.6}
.q label,.q .lbl{font-size:16px}.q .help{font-size:14px}
.inp{font-size:16px;min-height:48px}.add{font-size:14px}
.sugg button{font-size:13px;min-height:36px}.chip{font-size:14px}
.avoid summary,.avoid .help{font-size:14px}.pill{font-size:14px}
.go{gap:24px;padding-top:22px}.primary{font-size:15px;padding:15px 24px}.linkbtn{font-size:14px}
.picks{padding-top:48px}.picks>h2{font-size:40px;margin-bottom:12px}
.picks>p{font-size:15px;max-width:75ch;line-height:1.8}
.picktools{justify-content:flex-start;gap:12px;margin-block:22px 8px}
.btn2{font-size:14px;background:none}.dlnote,.dlstat{font-size:13px}
.stack{background:none;border:0;border-radius:0;box-shadow:none;padding:30px 0 8px;margin-top:30px;border-top:1px solid var(--sand)}
.stack h3{font-size:28px;margin-bottom:9px}.stack .why{font-size:15px;margin-bottom:24px}
#picks>.stack:first-of-type{border-top:3px solid var(--mustard);padding-top:26px;margin-top:26px}
#picks>.stack:first-of-type h3{font-size:34px}
.grid{grid-template-columns:repeat(6,minmax(0,1fr));gap:34px 22px;align-items:start}
.card{gap:10px;align-self:start}.card .cover{box-shadow:2px 4px 8px rgba(42,58,79,.10)}
.card h4{font-size:17px;line-height:1.45;display:block;overflow:visible;-webkit-line-clamp:unset;min-height:0}
.card .meta{font-size:14px;line-height:1.65}
.card .medals{margin-top:0}.medal{font-size:11px;line-height:1.45;padding:4px 6px;white-space:normal}
.cover{border-radius:2px 4px 4px 2px}.photo{padding:8px}
.ltools{padding-block:6px 18px;border-bottom:1px solid var(--sand)}
.lchips button,.lsel select{font-size:14px}.lcount{font-size:14px;margin-top:18px}
.lstack{padding-top:14px;border-top:0;margin-top:0}
.chair{margin-top:64px}
.chairbox{display:grid;grid-template-columns:160px minmax(0,1fr);gap:28px 34px;padding:30px;background:var(--paper);border:1px solid var(--sand);border-radius:5px;box-shadow:none;overflow:hidden}
.feature-head{grid-column:1/-1;margin:-30px -30px 0;padding:16px 30px;background:var(--slate)}
.chair .feature-head .kick{font:500 24px/1.3 var(--display);color:var(--paper);letter-spacing:0;text-transform:none;margin:0}
.chairbox>.card{grid-column:1;width:160px}
.readaloud-copy{grid-column:2;min-width:0;align-self:center}
.chair h2{font-size:36px;line-height:1.2;margin:0 0 6px}
.chair #chairNext{margin:4px 0 14px!important;font-size:14px;min-height:44px}
.chair .by{font-size:15px;margin-bottom:12px}
.chair .why{font-size:16px;line-height:1.8;max-width:62ch;margin-bottom:22px}
.chair .buy{font-size:14px;padding:12px 20px}
.chair .talk{grid-column:1/-1;background:var(--sage);border:0;border-radius:4px;padding:24px}
.chair .talk h3{font-size:25px;margin:0 0 20px}
.chair .talk ol{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.chair .talk li{font-size:15px;line-height:1.75;grid-template-columns:28px minmax(0,1fr);gap:10px}
.chair .talk li::before{width:28px;height:28px;font-size:13px;border:0;background:var(--paper)}
.sbox{background:none;border:0;border-top:1px solid var(--sand);border-radius:0;padding:34px 0 0;gap:28px 44px}
.sbox h2{font-size:29px}.sbox>div>p{font-size:15px}.sbox .kick{font-size:12px;letter-spacing:1.2px}
.slbl,.seg button{font-size:14px}.sstat{font-size:14px}
.sbox #sForm textarea{font-size:16px;min-height:88px}.sbox #sForm .primary{font-size:14px}
.detail h2{font-size:34px}.desc{font-size:16px}.by,.note,.contains{font-size:14px}
.tag{font-size:12px}.like h3{font-size:26px}.likes .card h4{font-size:16px}
footer{margin-top:44px}footer p{font-size:12px;line-height:1.8;max-width:95ch}
@media(max-width:1050px){
 .grid{grid-template-columns:repeat(4,minmax(0,1fr))}
 .hero{grid-template-columns:minmax(0,1fr) 300px;gap:0 30px}
 .hero-books .card{width:78px}.hero-books .card:nth-child(2){width:94px}
 .tabs{gap:22px}.tabs button{font-size:13px}
 .chairbox{grid-template-columns:150px minmax(0,1fr)}.chairbox>.card{width:150px}
 .chair .talk ol{grid-template-columns:1fr;gap:16px}
}
@media(max-width:760px){
 .wrap{padding-inline:22px}.mast .wrap{padding:20px 22px}
 .brand b{font-size:24px}.hero{display:flex;gap:0;padding-top:20px}
 .hero>p.crumb{margin-bottom:20px}.intro{padding:0 0 25px}
 .hero h1{font-size:46px;max-width:17ch}#lede{font-size:16px;max-width:48ch}
 .showcase{display:none}.tabs{gap:0 16px;margin-bottom:22px}.tabs button{font-size:13px;padding:13px 2px}
 .reader{padding:24px;gap:23px}.formhead{display:block}.formhead>p{max-width:none;margin-top:10px}
 .formhead h2{font-size:27px}.go{gap:14px}.go .primary{width:100%}
 .picks>h2{font-size:34px}.grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:30px 20px}
 .stack{padding:26px 0 4px}.stack h3{font-size:26px}#picks>.stack:first-of-type h3{font-size:30px}
 .chairbox{padding:24px;grid-template-columns:125px minmax(0,1fr);gap:24px}
 .feature-head{margin:-24px -24px 0;padding:15px 24px}
 .chairbox>.card{width:125px}.chair h2{font-size:30px}.chair .why{font-size:15px}
 .chair .talk{padding:22px}.sbox{grid-template-columns:1fr;padding:30px 0 0}
 .card h4{font-size:16px}.card .meta{font-size:14px}.ltools{display:block}
 .lsel select{min-width:0}.detail h2{font-size:29px}
}
@media(max-width:480px){
 .wrap{padding-inline:18px}.mast .wrap{padding:18px}
 .hero h1{font-size:40px;letter-spacing:-1.3px}.intro .kicker{font-size:11px}
 .tabs button{font-size:12px}.reader{padding:20px}.q .row{flex-wrap:nowrap}
 .grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 18px}
 .card h4{font-size:16px}.card .meta{font-size:14px}
 .chair{margin-top:48px}.chairbox{padding:22px;grid-template-columns:minmax(0,1fr);gap:22px}
 .feature-head{margin:-22px -22px 0;padding:15px 22px}
 .chair .feature-head .kick{font-size:24px}
 .chairbox>.card{grid-column:1;width:132px;justify-self:center}
 .readaloud-copy{grid-column:1}.chair h2{font-size:30px}.chair .by{font-size:14px}
 .chair .talk{padding:20px 16px;margin:0;grid-column:1}.chair .talk li{font-size:15px}
 .sbox h2{font-size:27px}.sbox .row{flex-direction:column}
 .detail .cover{width:135px}.desc{font-size:16px}
}

/* White breathing room, Sand companions, and Gold emphasis. */
:root{--paper:#FFFFFF;--canvas:#FFFFFF;--field:#FFFFFF;--slate:#D8CDB8;--slate-ink:#2A3A4F;--slate-tint:#F5F0E6}
body,.band,.mast{background:#FFFFFF}
.reader::before{background:var(--mustard)}
.reader{background:#FFFFFF;border-color:var(--sand)}
.showcase::before{background:var(--sand)}
.feature-head{background:var(--sand);border-bottom:3px solid var(--mustard)}
.chair .feature-head .kick{color:var(--ink)}
.chairbox{background:#FFFFFF}
.chair .linkbtn,.chair .linkbtn:hover{text-decoration-color:var(--mustard)}
.chair .talk{background:var(--sage)}
.chair .talk li::before{background:#FFFFFF}
.photo{background:#F5F0E6}
.seg{background:var(--sand)}
.seg button[aria-checked=true]{background:#FFFFFF}
.medal,.medal.cal,.medal.honor{background:var(--sand);color:var(--ink)}
/* Classic bookshop: restrained warm colors and two consistent type families. */
:root{--display:"Lora",serif;--sans:"Poppins",sans-serif;--sage:#F5F0E6;--tint:#F5F0E6;--slate-tint:#F5F0E6}
body,button,input,select,textarea{font-family:var(--sans)}
.brand b,.hero h1,.formhead h2,.stack h3,.card h4,.chair h2,.talk h3,.sbox h2,.detail h2,.like h3,.footer-brand,.frame .ct{font-family:var(--display)}
.brand span,.kicker,.kick,.meta,.medal,.tag,.by,.help,.sub,.linkbtn,.btn2{font-family:var(--sans)}
.lookup input,.add,.chip,.chip.book,.tag,.tag.pd,.tag.ell,.kitbox{background:#FFFFFF;border-color:var(--sand)}
.reader,.sheet,.chairbox{border-radius:3px}
.showcase::before{border-radius:3px;inset:54px 0 38px}
.chair .talk{background:#FFFFFF;border:1px solid var(--sand);border-left:3px solid var(--mustard);border-radius:2px}
.chair .talk li::before{background:var(--sand);border-radius:2px;color:var(--ink)}
.feature-head{background:var(--sand);border-bottom:1px solid var(--ink)}
.chair .feature-head .kick{font-family:var(--display)}
.sbox{background:#FFFFFF;border-top:1px solid var(--sand)}
.seg{background:var(--sand);border-radius:3px}.seg button{border-radius:2px}
.primary,.buy,.chair .buy,.btn2,.add{border-radius:3px}
.medal,.medal.cal,.medal.honor{background:#FFFFFF;border:1px solid var(--sand);border-radius:2px;box-shadow:none}
.chairbox .medal.new,.chairbox .medal.honor,.chairbox .medal.cal{background:#FFFFFF;border:1px solid var(--sand)}
.intro .kicker,.formhead .kicker,.chair .kick{color:var(--brick)}

.purchase-note{font:14px/1.7 var(--sans);color:var(--ink);margin:0 0 16px;max-width:60ch}
.brand::before{content:none}
.brand{padding-left:58px}
.brand-mark{position:absolute;left:0;top:2px;width:44px;height:44px;color:var(--ink)}
.showcase{padding:46px 20px 20px}
.showcase::before{inset:0 0 40px;border-radius:220px 220px 5px 5px;background:var(--sand)}
.chair #chairNext{display:inline-flex;align-items:center;justify-content:center;gap:9px;margin:14px 0 22px!important;padding:9px 15px;min-height:44px;border:1px solid var(--sand);border-radius:4px;background:var(--tint);color:var(--ink);font:500 14px/1.4 var(--sans);text-decoration:none;cursor:pointer}
.chair #chairNext svg{width:18px;height:18px;flex:none}
.chair #chairNext:hover{background:var(--sand);border-color:var(--mustard);color:var(--ink);text-decoration:none}
.chair #chairNext:focus-visible{outline:2px solid var(--ink);outline-offset:3px}
/* The secondary action belongs to the book cover. */
.readaloud-cover{grid-column:1;min-width:0;display:flex;flex-direction:column;align-items:center;gap:10px}
.readaloud-cover>.card{width:100%;padding:0}
.chair .readaloud-cover #chairNext{margin:0!important;padding:6px 10px;font-size:12px;gap:6px;min-height:36px;max-width:100%;white-space:nowrap}
.chair .readaloud-cover #chairNext svg{width:15px;height:15px}
@media(max-width:480px){.readaloud-cover{width:132px;justify-self:center}}
@media(pointer:coarse){.chair .readaloud-cover #chairNext{min-height:44px}}
/* A quiet dusty blue home for community book suggestions. */
.sbox{background:#CDD4D8;border:1px solid #6B7F9E;border-top:3px solid #6B7F9E;border-radius:5px;padding:32px;gap:28px 40px}
.sbox h2,.sbox .kick,.sbox>div>p,.sbox .slbl{color:var(--ink)}
.sbox .seg{background:var(--sand);border:1px solid var(--sand)}
.sbox .inp{background:#FFFFFF;border-color:#6B7F9E}
@media(max-width:760px){.sbox{padding:24px;gap:24px}}
@media(max-width:480px){.sbox{padding:22px 18px}}
/* An arched display niche, with the books nestled inside its outline. */
.showcase{padding:58px 30px 20px}
.showcase::before{inset:0 0 42px;background:#CDD4D8;border:1px solid #6B7F9E;border-radius:220px 220px 5px 5px}
.showcase .hero-books{gap:12px;min-height:220px;padding:8px 4px 14px;align-items:flex-end}
.showcase .hero-books .card{width:92px;transform:rotate(-8deg);transform-origin:center bottom}
.showcase .hero-books .card:nth-child(2){width:108px;transform:translateY(-12px);z-index:2}
.showcase .hero-books .card:nth-child(3){transform:rotate(8deg)}
.showcase .hero-books .cover{box-shadow:0 8px 12px #2A3A4F24;border:1px solid var(--sand)}
.showcase>p:last-child{margin-top:25px;color:var(--ink)}
@media(min-width:761px) and (max-width:1000px){.showcase{padding-inline:18px}.showcase .hero-books{gap:8px}.showcase .hero-books .card{width:76px}.showcase .hero-books .card:nth-child(2){width:90px}}
/* The original fox brand artwork, framed closely beside the wordmark. */
.brand{padding-left:62px}
.fox-mark{position:absolute;left:0;top:0;width:48px;height:52px;overflow:hidden;border-radius:4px}
.fox-mark img{position:absolute;width:78px;height:78px;max-width:none;left:-17px;top:-13px;object-fit:contain}
@media(max-width:480px){.brand{padding-left:52px}.fox-mark{width:40px;height:46px}.fox-mark img{width:68px;height:68px;left:-15px;top:-11px}}
/* Original full fox: keep the entire drawing and its natural proportions. */
.brand{padding-left:76px;min-height:55px;justify-content:center}
.fox-mark{left:0;top:50%;transform:translateY(-50%);width:62px;height:52px;overflow:visible;border-radius:0}
.fox-mark img{position:static;display:block;width:100%;height:100%;max-width:100%;object-fit:contain}
/* A compact shelf vignette, with real covers standing on a shared baseline. */
.showcase{padding:38px 22px 12px;margin-bottom:18px}
.showcase::before{inset:0 30px 54px;border:0;border-radius:180px 180px 3px 3px;background:#CDD4D8}
.showcase .hero-books{position:relative;gap:18px;min-height:0;padding:24px 8px 0;align-items:flex-end;isolation:isolate}
.showcase .hero-books::after{content:"";position:absolute;left:-12px;right:-12px;bottom:-11px;height:13px;background:linear-gradient(178deg,#D8CDB8 0%,#D8CDB8 45%,#C99A3B 49%,#D8CDB8 62%,#D8CDB8 100%);border-radius:40% 12% 25% 10% / 15% 25% 20% 20%;box-shadow:0 7px 9px #2A3A4F12;z-index:3}
.showcase .hero-books .card{width:96px;transform:none;transform-origin:center bottom;position:relative;z-index:2}
.showcase .hero-books .card:nth-child(2){width:112px;transform:none}
.showcase .hero-books .card:nth-child(3){transform:none}
.showcase .hero-books .cover{background:transparent;border:0;border-radius:1px;box-shadow:3px 3px 8px #2A3A4F24;overflow:hidden}
.showcase .hero-books .photo{padding:0;object-fit:contain;background:transparent;border-radius:0}
.showcase>p:last-child{margin:32px 0 0;font-size:11px;letter-spacing:1.4px}
@media(min-width:761px) and (max-width:1000px){.showcase{padding-inline:14px}.showcase .hero-books{gap:12px}.showcase .hero-books .card{width:76px}.showcase .hero-books .card:nth-child(2){width:90px}}
@media(max-width:480px){.brand{padding-left:62px}.fox-mark{width:50px;height:44px}.fox-mark img{width:100%;height:100%}}
/* A miniature library gallery: three framed covers hung on a white wall. */
.showcase{padding:38px 16px 12px}
.showcase::before,.showcase .hero-books::after{content:none}
.showcase .hero-books{gap:22px;padding:30px 6px 20px;min-height:246px;align-items:center}
.showcase .hero-books .card{width:96px;transform:translateY(10px) rotate(-3deg);overflow:visible}
.showcase .hero-books .card:nth-child(2){width:112px;transform:translateY(-14px) rotate(1deg)}
.showcase .hero-books .card:nth-child(3){transform:translateY(17px) rotate(3deg)}
.showcase .hero-books .card::before{content:"";position:absolute;left:27%;top:-22px;width:46%;height:40px;border-top:1px solid var(--ink);border-left:1px solid var(--ink);transform:rotate(45deg);opacity:.5;z-index:-1}
.showcase .hero-books .card::after{content:"";position:absolute;left:50%;top:-23px;width:4px;height:4px;border-radius:50%;background:var(--ink);transform:translateX(-50%)}
.showcase .hero-books .cover{padding:7px;border:4px solid var(--mustard);background:var(--paper);border-radius:2px;box-shadow:inset 0 0 0 1px var(--sand),0 0 0 1px var(--sand),3px 6px 9px #2A3A4F20;overflow:hidden}
.showcase .hero-books .card:nth-child(2) .cover{border-color:var(--sand);box-shadow:inset 0 0 0 1px var(--mustard),0 0 0 1px var(--mustard),3px 6px 9px #2A3A4F20}
.showcase .hero-books .card:nth-child(3) .cover{border-color:var(--brick)}
.showcase .hero-books .photo{position:absolute;inset:0;width:100%;height:100%;padding:10px;object-fit:contain;background:var(--tint)}
.showcase>p:last-child{margin:16px 0 0}
@media(min-width:761px) and (max-width:1000px){.showcase{padding-inline:8px}.showcase .hero-books{gap:16px;min-height:220px}.showcase .hero-books .card{width:76px}.showcase .hero-books .card:nth-child(2){width:90px}}
/* Textured antique molding replaces the flat drawn frame treatment. */
.showcase .hero-books{gap:18px;padding-top:12px;min-height:246px}
.showcase .hero-books .card::before,.showcase .hero-books .card::after{content:none}
.showcase .hero-books .card{width:106px;transform:translateY(11px) rotate(-2deg)}
.showcase .hero-books .card:nth-child(2){width:124px;transform:translateY(-10px)}
.showcase .hero-books .card:nth-child(3){transform:translateY(16px) rotate(2deg)}
.showcase .hero-books .card .cover{padding:0;border:0;background:#FFFFFF url('/assets/library/gallery-frame.webp') center/100% 100% no-repeat;border-radius:1px;box-shadow:2px 6px 9px #2A3A4F24}
.showcase .hero-books .card .cover::before{display:none}
.showcase .hero-books .card .photo{inset:10% 15%;width:70%;height:80%;padding:0;object-fit:contain;background:transparent;box-shadow:none}
.showcase .hero-books .frame{visibility:hidden}
@media(min-width:761px) and (max-width:1000px){.showcase .hero-books{gap:12px}.showcase .hero-books .card{width:84px}.showcase .hero-books .card:nth-child(2){width:98px}}
/* Restore the original deep blue footer treatment. */
footer{background:#2A3A4F;border-top:0;color:#F5F0E6;margin-top:50px}
footer .wrap{padding-block:28px 32px}
footer p{color:#D8DEE7;text-align:center;font-size:14px;line-height:1.8;max-width:1000px;margin-inline:auto}
footer .footer-brand{color:#F5F0E6;text-align:center;font-size:20px;margin-bottom:14px}
footer a{color:#F5F0E6;text-underline-offset:3px}
/* A concise editorial recommendation, rather than a discussion worksheet. */
.chair .talk{padding:16px 20px;display:block;grid-column:1/-1;margin:0;border:1px solid var(--sand);border-left:3px solid var(--mustard)}
.chair .talk h3{font:500 21px/1.3 var(--display);margin:0 0 7px}
.chair .talk p{font:14px/1.7 var(--sans);margin:0;color:var(--ink);max-width:85ch}
.chairbox{gap:22px 28px;position:relative}
@media(max-width:600px){
 .chairbox{grid-template-columns:86px minmax(0,1fr);gap:16px 14px;padding:20px}
 .chair .feature-head{grid-column:1/-1;margin:-20px -20px 0;padding:14px 140px 14px 20px;min-height:70px;display:flex;align-items:center}
 .chair .feature-head .kick{font-size:19px;line-height:1.35}
 .readaloud-cover{grid-column:1;grid-row:2;width:86px;justify-self:start;align-self:start}
 .chair .readaloud-cover #chairNext{position:absolute;top:12px;right:14px;min-height:44px;padding:6px 9px;font-size:11px;gap:5px;background:#FFFFFF}
 .chair .readaloud-cover #chairNext svg{width:14px;height:14px}
 .readaloud-copy{grid-column:2;grid-row:2;align-self:start}
 .chair h2{font-size:25px;line-height:1.2;margin:0 0 7px}
 .chair .by{font-size:13px;line-height:1.6;margin-bottom:10px}
 .chair .why{font-size:14px;line-height:1.7;margin-bottom:14px}
 .chair .buy{font-size:12px;padding:10px 12px;min-height:44px}
 .chair .talk{grid-column:1/-1;padding:14px 16px}
 .chair .talk h3{font-size:20px}.chair .talk p{font-size:14px;line-height:1.7}
}

.ell-library-nav{display:flex;justify-content:center;flex-wrap:wrap;gap:8px 24px;padding:10px 22px;border-bottom:1px solid #D8CDB8;font:13px/1.6 Poppins,sans-serif;background:#FFFFFF;color:#2A3A4F}.ell-library-nav a{display:inline-flex;align-items:center;min-height:44px;text-decoration:none;color:inherit}.ell-library-nav a[aria-current]{box-shadow:inset 0 -2px #C99A3B;font-weight:600}.ell-library-nav a:hover{text-decoration:underline;text-underline-offset:4px}@media(max-width:480px){.ell-library-nav{gap:0 16px;font-size:12px}}
/* Keep the rotation action in the header at every screen size. */
.chair .feature-head{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 30px;min-height:72px}
.chair .feature-head .kick{min-width:0;margin:0}
.chair .feature-head #chairNext{position:static;flex:none;margin:0!important;min-height:44px;padding:7px 12px;gap:7px;font-size:12px;background:#FFFFFF;border:1px solid var(--sand);white-space:nowrap}
.chair .feature-head #chairNext svg{width:16px;height:16px}
@media(max-width:760px){.chair .feature-head{padding:14px 24px}}
@media(max-width:600px){.chair .feature-head{padding:12px 16px;gap:12px;min-height:70px}.chair .feature-head .kick{font-size:19px}.chair .feature-head #chairNext{font-size:11px;padding:6px 9px;gap:5px}.chair .feature-head #chairNext svg{width:14px;height:14px}}

/* Focused reading-list preview, with explicit save and print actions. */
.list-preview{width:min(1040px,calc(100vw - 32px));max-width:none;height:min(92dvh,1000px);max-height:92dvh;padding:22px;border:1px solid #D8CDB8;border-radius:12px;color:#2A3A4F;background:#fff;box-shadow:0 20px 70px #0003}.list-preview::backdrop{background:rgba(42,58,79,.55)}.list-preview[open]{display:flex;flex-direction:column;gap:15px}.list-preview-head{display:flex;align-items:flex-start;justify-content:space-between;gap:15px}.list-preview-head h2{font:500 26px Lora,serif;margin:0 0 5px}.list-preview-head p,.list-preview-help{font:12px/1.6 Poppins,sans-serif;margin:0}.list-preview-actions{display:flex;gap:10px;flex-wrap:wrap;align-items:center}.list-preview-actions a{text-decoration:none;display:inline-flex;align-items:center;justify-content:center}.list-preview iframe{flex:1;min-height:220px;width:100%;border:1px solid #D8CDB8;border-radius:5px;background:#F5F0E6}.list-preview-head .btn2{flex-shrink:0}@media(max-width:600px){.list-preview{padding:16px;width:calc(100vw - 16px);height:94dvh;max-height:94dvh}.list-preview-head h2{font-size:22px}.list-preview-actions>*{flex:1;font-size:12px;white-space:nowrap}.list-preview-actions #listPreviewOpen{flex-basis:100%}.list-preview-head p{font-size:11px}}

/* The site header already carries the fox; the Library masthead is type only. */
.mast .brand .fox-mark{display:none!important}
.mast .brand{padding-left:0!important;min-height:0}