/* Larger, more expressive typography across the storefront and reader. */
body{font-size:18px;line-height:1.8}
header{min-height:112px;height:auto;padding:18px 0;gap:24px}
nav{font-size:16px;font-weight:600;gap:26px}
nav a{padding:8px 0}
.brand-small{font-size:10px;letter-spacing:1.2px}
.button,.button.small,.hero-actions .button{font-family:'Playfair Display',Georgia,serif;font-size:21px;font-weight:600;line-height:1.3;letter-spacing:.1px;padding:17px 25px;min-height:58px;border-radius:7px;gap:22px}
.button.small{font-size:19px;padding:14px 21px;min-height:52px}
.button span{font-family:'DM Sans',sans-serif;font-size:23px}
.text-button{font-size:17px;font-weight:600;line-height:1.5;padding:10px 0;border-bottom-width:2px}
.hero-actions{gap:18px 24px;align-items:center}
.intro{font-size:18px;line-height:1.85;max-width:480px}
.eyebrow,.hero-copy .eyebrow{font-size:12px;letter-spacing:1.6px}
.hero-meta{font-size:12px;letter-spacing:.7px}
.edition{font-size:11px;letter-spacing:1.2px}
.ribbon{font-size:14px;gap:25px;line-height:1.5}
.story-copy p{font-size:18px;line-height:1.85;max-width:490px}
.image-label{font-size:14px}
blockquote{font-size:27px}
.quote-source{font-size:11px;letter-spacing:1.1px}
.section-top p{font-size:17px;line-height:1.8}
.sample>span{font-size:12px;line-height:1.6;letter-spacing:.6px;gap:12px}
.sample b{font-size:21px}
.book-display p{font-size:11px;letter-spacing:1.1px}
.book-subtitle{font-size:18px}
.price-label{display:inline-block;margin-top:20px;padding:5px 12px;border:1px solid #c49b67;border-radius:30px;background:#f4ead4;color:#754b29;font-size:12px;font-weight:700;letter-spacing:1.4px}
.price{font-size:60px;line-height:1.3;margin:10px 0 24px;display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.price span{font-size:14px;line-height:1.6;margin-left:0}
.includes{font-size:17px;line-height:1.8;margin:24px 0}
.includes li{padding:5px 0}
.checkout-status{font-size:14px}
.format-note{font-size:14px;line-height:1.85}
summary{font-size:18px;padding:23px 0;line-height:1.6;gap:20px}
summary span{font-size:26px}
details p{font-size:17px;line-height:1.8}
footer>span{font-size:12px}
footer p{font-size:18px}
.dialog-head{font-size:12px;letter-spacing:.6px}
.dialog-head small{font-size:11px}
.icon-button{width:46px;height:46px;font-size:25px}
.page-controls>span,.reader-controls span{font-size:15px}
.sample-note{font-size:13px}
.buy-dialog p{font-size:17px}
.reader-intro{font-size:18px}
.file-picker input,.reader-status{font-size:16px}
@media(max-width:1100px) and (min-width:681px){
 header{flex-wrap:wrap;justify-content:space-between}
 header nav{order:3;width:100%;justify-content:center;font-size:16px}
 .hero{gap:4%}
 .button,.hero-actions .button{font-size:20px;padding:16px 20px}
 .hero-actions{align-items:flex-start;flex-direction:column}
 .ribbon{flex-wrap:wrap;font-size:13px;gap:14px 22px}
 .purchase{gap:7%}
 .price{gap:8px 15px}
 .price span{font-size:13px}
}
@media(max-width:680px){
 header{padding:17px 0 12px;gap:15px 10px;flex-wrap:wrap;min-height:90px;height:auto}
 header .brand{font-size:25px}
 .brand-small{display:none}
 header .button.small{font-size:17px;min-height:48px;padding:12px 14px;gap:12px}
 header .button span{font-size:20px}
 header nav{display:flex;order:3;width:100%;justify-content:space-between;gap:12px;font-size:14px}
 .hero{padding-top:32px}
 .hero-copy .eyebrow{font-size:10px;letter-spacing:1.2px}
 h1{font-size:56px}
 .intro{font-size:18px;max-width:100%;line-height:1.8}
 .hero-actions{flex-direction:column;align-items:stretch;gap:16px;margin:28px 0}
 .button,.hero-actions .button{font-size:20px;min-height:58px;padding:16px 19px;gap:15px}
 .hero-actions .text-button{align-self:flex-start}
 .text-button{font-size:17px}
 .hero-meta{font-size:11px;gap:14px;flex-wrap:wrap}
 .hero-meta>span+span{padding-left:14px}
 .eyebrow,.closing .eyebrow{font-size:11px}
 .edition{font-size:9px}
 .ribbon{font-size:12px;gap:12px 16px}
 .story-copy p{font-size:18px}
 .image-label{font-size:13px;left:18px;bottom:18px}
 blockquote{font-size:25px}
 .quote-source{font-size:10px}
 .section-top p{font-size:17px}
 .sample-grid{display:grid;grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:min(80vw,310px);gap:20px;overflow-x:auto;scroll-snap-type:x mandatory;padding:8px 2px 18px;margin:26px -2px 14px}
 .sample{scroll-snap-align:start}
 .sample>span{font-size:12px;margin-top:16px;line-height:1.6}
 .sample b{font-size:21px}
 .book-subtitle{font-size:18px}
 .price{font-size:58px;gap:14px}
 .price span{font-size:13px}
 .includes{font-size:17px}
 .checkout-status,.format-note{font-size:14px}
 .book-display p{font-size:10px}
 summary{font-size:17px}
 details p{font-size:17px}
 footer{gap:12px 20px}
 footer p{font-size:16px}
 footer>span{font-size:11px}
 .dialog-head{font-size:11px}
 .dialog-head small{font-size:10px}
 .page-controls{gap:12px}
 .page-controls>span{min-width:150px;font-size:13px}
 .sample-note{font-size:12px}
 .reader-controls span{font-size:15px}
}
@media(max-width:380px){
 header .brand{font-size:20px}
 .brand-star{font-size:26px;margin-right:3px}
 .brand-small{display:none}
 header .button.small{font-size:15px;padding:11px 10px;gap:7px}
 header nav{font-size:13px;gap:10px}
 h1{font-size:49px}
 .button,.hero-actions .button{font-size:18px;padding:16px}
 .hero-meta{font-size:10px;gap:10px}
 .hero-meta>span+span{padding-left:10px}
 .page-controls{gap:8px}
 .page-controls>span{min-width:130px;font-size:12px}
}

/* Transparent planned price next to the current launch price. */
.price .planned-price{display:flex;flex-direction:column;gap:3px;align-items:flex-start;line-height:1.15;color:var(--muted)}
.price .planned-price small{font:500 12px/1.4 'DM Sans',sans-serif;letter-spacing:.2px}
.price .planned-price s{font-size:32px;text-decoration-thickness:2px;text-decoration-color:var(--coral)}
.price>strong{font-weight:500}
@media(max-width:680px){.price .planned-price s{font-size:27px}.price .planned-price small{font-size:11px}}
