@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=DM+Sans:wght@400;500;600;700&family=Playfair+Display:ital,wght@0,500;0,600;0,700;1,500;1,600&display=swap');

:root {
    --paper: #f4f1e8;
    --paper-dark: #e9e5d8;
    --ink: #20251d;
    --muted: #75766c;
    --olive: #4f593f;
    --olive-dark: #30392d;
    --khaki: #c4b991;
    --line: #dcd8cb;
    --serif: "Playfair Display", Georgia, serif;
    --sans: "DM Sans", Arial, sans-serif;
    --mono: "DM Mono", monospace;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--ink); background: var(--paper); font-family: var(--sans); -webkit-font-smoothing: antialiased; }
a { color: inherit; text-decoration: none; }
button, input { font: inherit; }
.announcement-bar { height: 30px; display: flex; align-items: center; justify-content: center; gap: 9px; background: var(--olive-dark); color: #e6e1d4; font-family: var(--mono); font-size: 9px; letter-spacing: .12em; text-transform: uppercase; }
.status-dot { width: 5px; height: 5px; border-radius: 50%; background: #b7bd8e; }
.site-nav { min-height: 79px; background: var(--paper); border-bottom: 1px solid rgba(32,37,29,.1); z-index: 10; }
.brand-lockup { display: flex; align-items: center; gap: 11px; padding: 0; }
.brand-mark { width: 38px; height: 38px; display: grid; place-items: center; position: relative; border: 1px solid var(--olive); color: var(--olive); font: 600 12px var(--serif); letter-spacing: -.07em; }
.brand-mark span { color: #9b956c; font-size: 9px; }
.brand-name { color: var(--ink); font: 600 12px var(--sans); letter-spacing: .14em; line-height: 1.2; }
.brand-name > span { color: var(--olive); }
.brand-name small { display: block; margin-top: 5px; color: var(--muted); font: 8px var(--mono); letter-spacing: .12em; }
.navbar-nav { gap: 32px; }
.site-nav .nav-link { color: #54564d; padding: 11px 0 !important; font-size: 12px; }
.site-nav .nav-link:hover, .site-nav .nav-link.active { color: var(--olive-dark); }
.site-nav .nav-link.active::after { display: block; width: 15px; height: 1px; margin-top: 4px; background: var(--olive); content: ""; }
.nav-actions { display: flex; align-items: center; gap: 16px; }
.nav-text-button { padding: 0; border: 0; background: transparent; color: var(--ink); font-size: 11px; text-decoration: none; }
.nav-logout { display: inline-flex; align-items: center; }
.icon-button { width: 32px; height: 34px; display: inline-flex; align-items: center; justify-content: center; position: relative; border: 0; background: transparent; color: var(--olive-dark); }
.icon-button svg { width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-width: 1.35; stroke-linecap: round; stroke-linejoin: round; }
.cart-count { position: absolute; top: -2px; right: -5px; min-width: 15px; height: 15px; border-radius: 50%; background: var(--olive); color: white; font: 9px/15px var(--mono); text-align: center; }
.navbar-toggler { padding: 6px; border: 0; box-shadow: none !important; }
.navbar-toggler-icon { width: 21px; height: 21px; }

.hero-section { position: relative; overflow: hidden; background: #eae7dc; }
.hero-grid { min-height: 489px; display: grid; grid-template-columns: 1fr .98fr; align-items: center; gap: 8%; position: relative; padding-top: 24px; padding-bottom: 42px; }
.hero-copy { padding: 22px 0 10px 5.5%; }
.eyebrow { display: flex; align-items: center; gap: 9px; margin: 0 0 20px; color: #77796b; font: 9px var(--mono); letter-spacing: .14em; }
.eyebrow > span { width: 17px; height: 1px; display: inline-block; background: var(--olive); }
.hero-copy h1, .section-heading h2, .author-copy h2, .not-found-section h1 { margin: 0; font: 500 clamp(40px, 5vw, 63px)/1.13 var(--serif); letter-spacing: -.045em; }
.hero-copy h1 em, .section-heading h2 em, .author-copy h2 em, .not-found-section h1 em { color: var(--olive); font-weight: 500; }
.hero-description { max-width: 405px; margin: 20px 0 25px; color: #6c6d63; font-size: 13px; line-height: 1.8; }
.hero-actions { display: flex; align-items: center; gap: 25px; }
.button { min-height: 43px; display: inline-flex; align-items: center; justify-content: center; gap: 24px; padding: 0 17px; border: 1px solid transparent; font-size: 11px; transition: .2s ease; }
.button span { font-size: 15px; }
.button-dark { background: var(--olive-dark); color: #f4f1e8; }
.button-dark:hover { background: #4a5542; color: white; }
.text-link, .author-link { color: var(--olive-dark); font-size: 11px; }
.text-link span, .author-link span { margin-left: 8px; }
.hero-proof { display: flex; align-items: center; gap: 10px; margin-top: 51px; color: #8d8b7e; font: 8px var(--mono); letter-spacing: .12em; }
.proof-line { width: 29px; height: 1px; background: #a9a48c; }
.hero-film-wrap { width: 100%; max-width: 438px; justify-self: center; margin-top: 1px; position: relative; }
.film-frame { aspect-ratio: 1.36; position: relative; padding: 8px; background: #faf8f1; box-shadow: 0 14px 40px rgba(40,45,34,.1); transform: rotate(1.1deg); }
.film-scene { height: 100%; overflow: hidden; position: relative; background: linear-gradient(180deg,#b8b9a7 0%,#d0c9aa 47%,#8d9179 100%); }
.film-scene::before, .film-scene::after { position: absolute; inset: 0; content: ""; pointer-events: none; }
.film-scene::before { opacity: .26; background: repeating-linear-gradient(0deg,transparent 0 3px,rgba(34,37,29,.12) 4px); mix-blend-mode: multiply; }
.film-scene::after { background: linear-gradient(90deg,rgba(34,37,29,.13),transparent 45%,rgba(34,37,29,.12)); }
.film-sun { width: 104px; height: 104px; position: absolute; top: 16%; left: 55%; border-radius: 50%; background: #e4d5ad; opacity: .73; box-shadow: 0 0 38px rgba(235,214,163,.4); }
.film-ridge { position: absolute; right: -10%; bottom: 20%; left: -8%; height: 42%; clip-path: polygon(0 100%,0 68%,12% 57%,25% 69%,39% 42%,54% 59%,67% 30%,78% 56%,90% 39%,100% 56%,100% 100%); }
.film-ridge-back { bottom: 24%; background: #777e68; opacity: .76; }
.film-ridge-front { height: 34%; background: #505b48; clip-path: polygon(0 100%,0 55%,16% 72%,34% 35%,50% 61%,67% 26%,82% 51%,100% 38%,100% 100%); }
.film-grain { position: absolute; inset: 0; opacity: .1; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.4'/%3E%3C/svg%3E"); }
.film-caption { display: flex; justify-content: space-between; position: absolute; right: 15px; bottom: 12px; left: 15px; z-index: 1; color: rgba(250,248,238,.9); font: 8px var(--mono); letter-spacing: .1em; }
.play-button { width: 55px; height: 55px; display: grid; place-items: center; position: absolute; z-index: 2; top: 50%; left: 50%; border: 1px solid rgba(255,255,255,.75); border-radius: 50%; background: rgba(33,41,32,.58); transform: translate(-50%,-50%); transition: .2s; }
.play-button:hover { background: var(--olive-dark); transform: translate(-50%,-50%) scale(1.06); }
.play-triangle { width: 0; height: 0; margin-left: 4px; border-top: 7px solid transparent; border-bottom: 7px solid transparent; border-left: 10px solid white; }
.frame-index { position: absolute; right: 15px; top: 14px; z-index: 1; color: rgba(255,255,255,.85); font: 8px var(--mono); letter-spacing: .1em; }
.film-note { display: flex; align-items: center; gap: 9px; margin: 21px 0 0 1px; color: #77796b; font: 10px var(--serif); font-style: italic; }
.note-dash { width: 16px; height: 1px; background: #9a977e; }
.hero-side-note { position: absolute; top: 48%; right: 4px; color: #9c9b8f; font: 8px var(--mono); letter-spacing: .14em; writing-mode: vertical-rl; }
.hero-bottom-band { background: #dcdaca; }
.hero-bottom-band .container { min-height: 37px; display: flex; align-items: center; justify-content: space-between; color: #787b6b; font: 8px var(--mono); letter-spacing: .12em; }
.band-star { color: #85876e; font-size: 11px; }
.section-pad { padding: 73px 0 85px; }
.section-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: 34px; }
.section-heading .eyebrow { margin-bottom: 13px; }
.section-heading h2 { font-size: clamp(32px, 4vw, 43px); }
.section-intro { width: 245px; margin: 0 5px 5px 0; color: #77786e; font: 12px/1.7 var(--serif); }
.catalog-toolbar { display: flex; align-items: center; justify-content: space-between; padding: 14px 0; margin-bottom: 18px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); color: #828275; font: 8px var(--mono); letter-spacing: .12em; }
.catalog-count { color: var(--olive); }
.toolbar-divider { padding: 0 10px; color: #b5b09f; }
.search-box { width: 253px; height: 33px; display: flex; align-items: center; gap: 9px; padding: 0 9px; border: 1px solid #d9d5c8; background: rgba(255,255,255,.2); color: var(--olive); }
.search-box svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 1.4; }
.search-box input { width: 100%; min-width: 0; border: 0; outline: 0; background: transparent; color: var(--ink); font: 10px var(--sans); }
.search-box input::placeholder { color: #99988e; }
.search-box kbd { color: #a29f91; font: 11px var(--mono); }
.book-grid { row-gap: 28px !important; }
.book-column[hidden] { display: none !important; }
.book-card { border: 1px solid #e1ddd0; background: #f7f5ed; transition: transform .25s, box-shadow .25s; }
.book-card:hover { transform: translateY(-3px); box-shadow: 0 12px 26px rgba(43,47,36,.08); }
.book-cover-wrap { display: block; position: relative; padding: 17px 17px 0; background: #e9e6db; }
.book-cover { width: 100%; aspect-ratio: 1.53; overflow: hidden; display: flex; flex-direction: column; align-items: center; position: relative; padding: 15px 15px 12px; color: #f4f0e2; box-shadow: 4px 5px 12px rgba(37,40,31,.2); }
.cover-moss { background: #55634d; }
.cover-khaki { background: #968b69; }
.cover-charcoal { background: #3c4740; }
.cover-edition, .cover-label, .cover-author { position: relative; z-index: 2; font: 7px var(--mono); letter-spacing: .12em; text-align: center; }
.cover-edition { display: flex; width: 100%; justify-content: space-between; color: rgba(245,242,224,.7); font-size: 6px; }
.cover-edition span { opacity: .8; }
.cover-art { position: absolute; inset: 0; overflow: hidden; }
.cover-sun { width: 100px; height: 100px; position: absolute; top: 15%; left: 50%; border: 1px solid rgba(222,211,169,.5); border-radius: 50%; transform: translateX(-50%); }
.cover-sun::after { width: 70px; height: 70px; position: absolute; inset: 14px; border: 1px solid rgba(222,211,169,.24); border-radius: 50%; content: ""; }
.cover-mountain { position: absolute; right: -8%; bottom: 21%; left: -8%; height: 35%; background: rgba(35,45,34,.34); clip-path: polygon(0 100%,0 65%,18% 39%,31% 64%,53% 23%,68% 64%,82% 42%,100% 69%,100% 100%); }
.cover-ground { position: absolute; inset: 69% 0 0; background: rgba(28,36,28,.26); }
.cover-title { max-width: 92%; position: absolute; top: 39%; z-index: 2; color: #f4f0e2; font: 500 clamp(21px, 3vw, 31px)/1.08 var(--serif); letter-spacing: -.04em; text-align: center; text-shadow: 0 1px 8px rgba(20,23,19,.2); }
.cover-label { position: absolute; top: 68%; }
.cover-author { position: absolute; bottom: 15px; letter-spacing: .2em; }
.cover-open { width: 25px; height: 25px; display: grid; place-items: center; position: absolute; right: 26px; bottom: 11px; z-index: 2; border-radius: 50%; background: var(--paper); color: var(--olive-dark); font-size: 13px; opacity: 0; transition: opacity .2s; }
.book-card:hover .cover-open { opacity: 1; }
.book-card-body { padding: 17px 17px 15px; }
.book-meta { display: flex; justify-content: space-between; color: #838276; font: 8px var(--mono); letter-spacing: .1em; }
.book-price { color: #494c3e; font-size: 10px; letter-spacing: 0; }
.book-card h3 { margin: 11px 0 6px; font: 500 21px var(--serif); letter-spacing: -.02em; }
.book-card h3 a:hover { color: var(--olive); }
.book-card-body > p { min-height: 37px; margin: 0; color: #78796e; font-size: 10px; line-height: 1.65; }
.card-actions { display: flex; justify-content: space-between; align-items: center; margin-top: 16px; padding-top: 12px; border-top: 1px solid #e7e3d7; }
.details-link, .purchase-link { border: 0; background: transparent; color: var(--olive-dark); font-size: 10px; }
.details-link span, .purchase-link span { margin-left: 6px; }
.purchase-link { color: #77786e; }
.no-results { padding: 38px 15px; border: 1px dashed var(--line); color: var(--muted); font-size: 13px; text-align: center; }

.author-section { padding: 65px 0 67px; overflow: hidden; background: var(--olive-dark); color: #e8e5d9; }
.author-grid { display: grid; grid-template-columns: 170px 1fr 125px; align-items: center; gap: 48px; }
.author-monogram { width: 158px; height: 174px; display: flex; align-items: center; justify-content: center; position: relative; border: 1px solid rgba(236,233,215,.3); color: rgba(236,233,215,.8); font: 100px/.9 var(--serif); }

/*border: 1px solid rgba(236,233,215,.12);*/
.author-monogram::before { position: absolute; inset: 7px;  content: ""; }
.author-monogram i { margin: 28px 0 0 -30px; color: #b2b591; font: italic 69px var(--serif); }
.author-monogram small { position: absolute; bottom: 14px; left: 14px; color: #c4c3af; font: 7px/1.5 var(--mono); letter-spacing: .12em; }
.eyebrow-light { color: #c0c0ab; }
.eyebrow-light > span { background: #a9ac8d; }
.author-copy h2 { max-width: 545px; font-size: clamp(32px,4vw,43px); }
.author-copy h2 em { color: #c2c5a4; }
.author-copy > p:not(.eyebrow) { max-width: 530px; margin: 16px 0 18px; color: #c2c3b4; font-size: 11px; line-height: 1.9; }
.author-link { color: #dedecf; font-size: 10px; }
.author-index { height: 145px; display: flex; flex-direction: column; justify-content: space-between; align-items: flex-end; color: #b6b8a0; font: 7px var(--mono); letter-spacing: .11em; }
.author-index strong { color: rgba(235,232,214,.14); font: 55px var(--serif); letter-spacing: -.08em; }
.site-footer { padding: 23px 0 15px; background: #e9e6dc; }
.footer-inner { display: flex; justify-content: space-between; align-items: center; }
.footer-brand { font: 600 10px var(--sans); letter-spacing: .13em; }
.footer-brand span { color: var(--olive); }
.footer-inner p { margin: 0; color: #828276; font: italic 10px var(--serif); }
.copyright { color: #929184; font: 7px var(--mono); letter-spacing: .09em; }
.footer-phase { margin-top: 13px; padding-top: 11px; border-top: 1px solid #d9d5c9; color: #929184; font: 8px var(--mono); letter-spacing: .03em; text-align: center; }

.video-modal-content { overflow: hidden; border: 0; border-radius: 0; background: var(--paper); }
.video-modal-content .modal-header { padding: 21px 25px; border: 0; }
.video-modal-content .eyebrow { margin-bottom: 7px; font-size: 8px; }
.video-modal-content .modal-title { font: 500 24px var(--serif); }
.intro-video { width: 100%; max-height: 62vh; background: #20251d; }
.video-placeholder { min-height: 260px; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 35px; background: #e9e6da; color: #5d6353; text-align: center; }
.placeholder-icon { width: 43px; height: 43px; display: grid; place-items: center; margin-bottom: 14px; border: 1px solid #8b907c; border-radius: 50%; font-size: 13px; }
.video-placeholder p { margin-bottom: 7px; font: 19px var(--serif); }
.video-placeholder small { color: #77796b; font-size: 10px; }
.video-placeholder code { color: #4f593f; }
.site-toast { border: 1px solid #d5d2c5; border-radius: 0; background: #faf8f0; color: var(--ink); box-shadow: 0 4px 20px #20251d1c; }
.site-toast .toast-body { display: flex; align-items: center; gap: 9px; font-size: 12px; }
.toast-indicator { width: 6px; height: 6px; flex: 0 0 6px; border-radius: 50%; background: #829070; }
.detail-breadcrumb { display: flex; align-items: center; gap: 11px; padding-top: 24px; color: #88877a; font: 9px var(--mono); }
.detail-breadcrumb a:hover { color: var(--olive); }
.detail-breadcrumb span:last-child { color: #4e5144; }
.book-detail-section { padding: 45px 0 68px; }
.detail-grid { display: grid; grid-template-columns: minmax(260px, .78fr) 1.22fr; align-items: center; gap: 10%; max-width: 950px; }
.detail-cover-column { width: 100%; max-width: 325px; justify-self: center; }
.detail-cover { aspect-ratio: .73; padding: 19px 20px 17px; }
.detail-cover .cover-edition { font-size: 7px; }
.detail-cover .cover-sun { width: 172px; height: 172px; top: 18%; }
.detail-cover .cover-sun::after { width: 126px; height: 126px; inset: 22px; }
.detail-cover .cover-title { top: 40%; font-size: clamp(30px,4vw,40px); }
.detail-cover .cover-label { top: 69%; }
.detail-cover .cover-author { bottom: 20px; font-size: 8px; }
.cover-caption { display: flex; justify-content: space-between; margin-top: 13px; color: #898879; font: 7px var(--mono); letter-spacing: .1em; }
.detail-copy { padding: 4px 0; }
.detail-copy .eyebrow { margin-bottom: 15px; }
.detail-copy h1 { margin: 0; font: 500 clamp(42px,5vw,58px)/1.08 var(--serif); letter-spacing: -.05em; }
.title-amp { color: var(--olive); }
.detail-byline { margin: 13px 0 19px; color: #76776b; font-size: 12px; }
.detail-byline strong { color: #3e4338; font-weight: 500; }
.detail-rule { width: 100%; height: 1px; background: var(--line); }
.detail-description { max-width: 455px; margin: 21px 0 25px; color: #67695e; font-size: 13px; line-height: 1.85; }
.detail-price { font: 500 24px var(--serif); }
.detail-price span { display: block; margin-top: 4px; color: #969486; font: 7px var(--mono); letter-spacing: .1em; }
.detail-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 20px; }
.detail-actions .button { min-height: 45px; }
.button-outline { border-color: #b8b6a8; color: var(--olive-dark); }
.button-outline:hover { border-color: var(--olive-dark); background: #e8e5d9; color: var(--olive-dark); }
.secure-note { margin: 15px 0 0; color: #88877a; font-size: 9px; }
.secure-note span { margin-right: 5px; color: var(--olive); }
.preview-section { padding: 55px 0 66px; background: #eae7dc; }
.preview-heading { margin-bottom: 25px; }
.preview-heading h2 { font-size: 36px; }
.preview-limit { padding-bottom: 5px; color: #898879; font: 8px var(--mono); letter-spacing: .1em; }
.preview-pages { display: grid; grid-template-columns: 1fr 1fr; gap: 17px; }
.preview-page { min-height: 205px; display: flex; flex-direction: column; position: relative; padding: 26px 29px 18px; border: 1px solid #dcd8ca; background: #f8f6ef; }
.preview-page-index { color: #929082; font: 8px var(--mono); letter-spacing: .08em; }
.preview-page-index i { padding: 0 4px; color: #bbb6a5; font-style: normal; }
.preview-page p { max-width: 420px; margin: auto 0; color: #53564b; font: 16px/1.8 var(--serif); }
.preview-page-footer { display: flex; justify-content: space-between; margin-top: 20px; color: #969486; font: 7px var(--mono); letter-spacing: .1em; }
.preview-disclaimer { margin: 16px 0 0; color: #898879; font-size: 9px; text-align: center; }
.not-found-section { min-height: 55vh; display: flex; align-items: center; padding: 70px 0; }
.not-found-section h1 { font-size: clamp(42px, 6vw, 62px); }
.not-found-section > .container > p:not(.eyebrow) { margin: 17px 0 24px; color: var(--muted); font-size: 13px; }

.account-section { min-height: calc(100vh - 180px); display: flex; align-items: center; padding: 52px 0; background: #eae7dc; }
.account-layout { max-width: 990px; display: grid; grid-template-columns: .9fr 1.1fr; align-items: stretch; background: #f7f5ed; box-shadow: 0 10px 36px rgba(36,41,31,.07); }
.account-aside { min-height: 465px; display: flex; flex-direction: column; justify-content: center; position: relative; overflow: hidden; padding: 48px 42px; background: var(--olive-dark); color: #eeecdf; }
.account-aside::after { width: 310px; height: 310px; position: absolute; right: -112px; bottom: -130px; border: 1px solid rgba(231,229,208,.12); border-radius: 50%; box-shadow: 0 0 0 22px rgba(231,229,208,.035), 0 0 0 50px rgba(231,229,208,.025); content: ""; }
.account-aside .eyebrow { position: relative; z-index: 1; }
.account-aside h1, .checkout-aside h1 { position: relative; z-index: 1; margin: 0; font: 500 clamp(36px,4vw,49px)/1.13 var(--serif); letter-spacing: -.04em; }
.account-aside h1 em, .checkout-aside h1 em { color: #c1c5a4; font-weight: 500; }
.account-aside > p:not(.eyebrow), .checkout-aside > p:not(.eyebrow) { max-width: 290px; position: relative; z-index: 1; margin: 18px 0 0; color: #c8c9ba; font-size: 11px; line-height: 1.8; }
.account-aside-index { position: absolute; bottom: 23px; left: 42px; color: #aeb29b; font: 8px var(--mono); letter-spacing: .1em; }
.account-form-wrap { padding: 46px clamp(27px,5vw,60px); }
.account-form-wrap > .eyebrow { margin-bottom: 13px; }
.account-form-wrap h2, .checkout-panel h2 { margin: 0; font: 500 clamp(24px,3vw,31px)/1.2 var(--serif); letter-spacing: -.025em; }
.account-switch { margin: 11px 0 25px; color: #79796f; font-size: 10px; }
.account-switch a { color: var(--olive); text-decoration: underline; text-underline-offset: 3px; }
.account-form { display: flex; flex-direction: column; }
.account-form label { margin: 14px 0 7px; color: #55584d; font-size: 10px; }
.account-form label span { float: right; color: #949284; font: 8px var(--mono); }
.account-form input { min-height: 41px; padding: 9px 11px; border: 1px solid #d9d5c9; border-radius: 0; outline: none; background: #fbfaf5; color: var(--ink); font-size: 12px; }
.account-form input:focus { border-color: #7d876d; box-shadow: 0 0 0 2px rgba(79,89,63,.1); }
.account-submit { width: 100%; min-height: 45px; margin-top: 24px; }
.account-submit:disabled { cursor: not-allowed; opacity: .58; }
.account-footnote { margin: 14px 0 0; color: #929184; font-size: 9px; line-height: 1.65; }
.form-notice { margin: 16px 0; padding: 11px 13px; font-size: 10px; line-height: 1.6; }
.form-notice p { margin: 0; }
.form-notice p + p { margin-top: 4px; }
.form-error { border: 1px solid #d7b9a8; background: #f6ebe4; color: #713d2b; }
.form-success { border: 1px solid #c6cfb7; background: #eef1e8; color: #414a36; }
.checkout-section { padding-top: 40px; padding-bottom: 48px; }
.checkout-layout { max-width: 940px; display: grid; grid-template-columns: .95fr 1.05fr; background: #f7f5ed; box-shadow: 0 10px 36px rgba(36,41,31,.07); }
.checkout-aside { min-height: 480px; display: flex; flex-direction: column; align-items: flex-start; justify-content: center; position: relative; overflow: hidden; padding: 42px; background: var(--olive-dark); color: #eeecdf; }
.checkout-cover { width: 135px; aspect-ratio: .76; display: flex; align-items: center; justify-content: center; position: relative; overflow: hidden; margin: 14px 0 23px; padding: 12px; box-shadow: 3px 5px 14px rgba(14,17,13,.25); color: #f4f0e2; }
.checkout-cover .cover-edition { position: absolute; top: 10px; z-index: 2; }
.checkout-cover .cover-sun { width: 100px; height: 100px; }
.checkout-cover .cover-title { top: 39%; font-size: 19px; }
.checkout-cover .cover-label { top: 70%; }
.checkout-cover .cover-author { bottom: 11px; font-size: 6px; }
.checkout-aside h1 { font-size: 34px; }
.checkout-aside > p:not(.eyebrow) { margin-top: 12px; }
.checkout-panel { align-self: center; padding: 43px clamp(25px,4vw,51px); }
.checkout-panel > .eyebrow { margin-bottom: 13px; }
.checkout-author { margin: 8px 0 20px; color: #818174; font-size: 10px; }
.checkout-rule { height: 1px; margin: 17px 0; background: var(--line); }
.checkout-line, .checkout-total { display: flex; align-items: center; justify-content: space-between; padding: 9px 0; color: #77786e; font-size: 11px; }
.checkout-line strong { color: #4a4c41; font-weight: 500; }
.checkout-total { margin-top: 5px; padding: 15px 0 4px; border-top: 1px solid var(--line); color: var(--ink); }
.checkout-total strong { font: 500 23px var(--serif); }
.checkout-disclaimer { margin: 13px 0 0; color: #898879; font-size: 9px; line-height: 1.7; text-align: center; }
.checkout-error { margin: 12px 0 0; padding: 10px; border: 1px solid #d7b9a8; background: #f6ebe4; color: #713d2b; font-size: 10px; line-height: 1.6; }
.checkout-back { display: block; margin-top: 17px; color: #77786e; font-size: 10px; text-align: center; }
.checkout-back:hover { color: var(--olive); }
.checkout-panel > .form-notice { margin: 19px 0 0; }
.checkout-panel > .form-notice + .account-submit { margin-top: 12px; }
.library-section { min-height: calc(100vh - 180px); padding: 61px 0 75px; background: #eae7dc; }
.library-heading { display: flex; justify-content: space-between; align-items: flex-end; gap: 20px; margin-bottom: 32px; }
.library-heading .eyebrow { margin-bottom: 12px; }
.library-heading h1 { margin: 0; font: 500 clamp(39px,5vw,54px)/1.1 var(--serif); letter-spacing: -.04em; }
.library-heading h1 em { color: var(--olive); }
.library-welcome { margin: 12px 0 0; color: #77786e; font-size: 11px; }
.library-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 15px; }
.library-card { min-height: 145px; display: flex; align-items: center; gap: 17px; padding: 19px; border: 1px solid #dedacd; background: #f7f5ed; }
.library-card-mark { width: 70px; height: 94px; display: grid; flex: 0 0 70px; place-items: center; border: 1px solid #78806b; background: #58624e; color: #f1edde; font: 17px var(--serif); }
.library-card-mark span { color: #bab996; font-size: 12px; }
.library-card-copy { min-width: 0; flex: 1; }
.library-card-copy > span, .owned-status { color: #898879; font: 7px var(--mono); letter-spacing: .1em; }
.library-card-copy h2 { margin: 6px 0; font: 500 19px var(--serif); }
.library-card-copy p { margin: 0; color: #898879; font-size: 9px; }
.library-card-actions { display: flex; align-items: flex-end; gap: 10px; flex-direction: column; }
.owned-status { color: var(--olive); white-space: nowrap; }
.library-card-actions a { color: var(--olive-dark); font-size: 9px; white-space: nowrap; }
.library-card-actions a span { margin-left: 4px; }
.reader-notice { margin: 19px 0 0; color: #858476; font: 9px var(--mono); text-align: center; }
.library-empty { padding: 55px 20px; border: 1px solid #dedacd; background: #f7f5ed; text-align: center; }
.empty-mark { display: block; margin-bottom: 15px; color: #8e907b; font: 9px var(--mono); letter-spacing: .13em; }
.library-empty h2 { margin: 0; font: 500 clamp(25px,4vw,34px) var(--serif); }
.library-empty h2 em { color: var(--olive); }
.library-empty p { max-width: 420px; margin: 12px auto 20px; color: #77786e; font-size: 11px; line-height: 1.7; }
.admin-panel-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-bottom: 26px; }
.admin-stat { padding: 18px 20px; border: 1px solid #d9d4c8; background: #f8f5ee; }
.admin-stat-label { display: block; color: #7f7f74; font: 8px var(--mono); letter-spacing: .12em; text-transform: uppercase; }
.admin-stat strong { display: block; margin-top: 12px; color: var(--olive-dark); font: 500 23px var(--serif); letter-spacing: -.04em; }
.admin-panel-block { margin-top: 28px; padding: 24px 20px 12px; border: 1px solid #dad4ca; background: #f8f5ee; }
.admin-heading { margin-bottom: 20px; }
.admin-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 18px; }
.admin-table-wrap { overflow-x: auto; }
.admin-table { width: 100%; border-collapse: collapse; min-width: 520px; }
.admin-table th, .admin-table td { padding: 12px 10px; border-bottom: 1px solid #e2ded2; text-align: left; font-size: 11px; }
.admin-table th { color: #7a7a71; font: 8px var(--mono); letter-spacing: .12em; text-transform: uppercase; }
.admin-table td { color: #2b2f29; }
.admin-pill { display: inline-block; padding: 5px 9px; border: 1px solid #d9d1b8; background: #f0ecd9; color: #4d533f; font: 7px var(--mono); letter-spacing: .08em; }
.admin-pill.success { background: #e5f0dc; border-color: #b9d2ab; color: #3c5a30; }
.admin-pill.pending { background: #f7eada; border-color: #d9c1a8; color: #785631; }
.reader-placeholder { display: grid; grid-template-columns: .92fr 1.08fr; gap: 18px; margin-top: 20px; }
.reader-notice-box, .reader-preview-panel { border: 1px solid #ded5c8; background: #f7f4ee; }
.reader-notice-box { padding: 24px 22px; }
.reader-notice-box h2 { margin: 0 0 10px; font: 500 32px var(--serif); }
.reader-notice-box p, .reader-notice-box li { color: #606259; font-size: 12px; line-height: 1.8; }
.reader-notice-box ul { margin: 14px 0 0; padding-left: 18px; }
.reader-preview-panel { padding: 14px; }
.reader-page { padding: 18px 18px 12px; border: 1px solid #e5dfd3; background: #fffdf8; }
.reader-page + .reader-page { margin-top: 12px; }
.reader-page p { margin: 12px 0 0; color: #43453c; font-size: 15px; line-height: 1.8; }

@media (min-width: 1200px) {
    .hero-grid { min-height: 515px; }
    .book-cover { aspect-ratio: 1.63; }
}
@media (max-width: 991.98px) {
    .site-nav .navbar-collapse { padding: 13px 0 17px; }
    .navbar-nav { align-items: flex-start !important; gap: 2px; }
    .site-nav .nav-link.active::after { display: none; }
    .nav-actions { padding-top: 12px; border-top: 1px solid var(--line); }
    .hero-grid { min-height: 440px; grid-template-columns: 1fr 1fr; gap: 4%; }
    .hero-copy { padding-left: 0; }
    .hero-copy h1 { font-size: 46px; }
    .hero-side-note { right: -2px; }
    .author-grid { grid-template-columns: 135px 1fr; gap: 32px; }
    .author-monogram { width: 133px; height: 152px; }
    .author-index { display: none; }
    .detail-grid { gap: 7%; }
}
@media (max-width: 767.98px) {
    .announcement-bar { height: 27px; font-size: 8px; }
    .site-nav { min-height: 68px; }
    .brand-mark { width: 34px; height: 34px; }
    .hero-grid { min-height: auto; grid-template-columns: 1fr; gap: 30px; padding-top: 45px; padding-bottom: 33px; }
    .hero-copy { padding: 0; }
    .hero-copy h1 { font-size: clamp(42px, 11vw, 58px); }
    .hero-description { max-width: 380px; margin: 16px 0 20px; font-size: 12px; }
    .hero-proof { margin-top: 26px; }
    .hero-film-wrap { max-width: 500px; justify-self: start; margin: 0 12px 0 4px; }
    .film-frame { aspect-ratio: 1.55; }
    .hero-side-note { display: none; }
    .hero-bottom-band .container { min-height: 34px; justify-content: center; gap: 10px; font-size: 7px; }
    .hero-bottom-band .container span:nth-of-type(4), .hero-bottom-band .container span:nth-of-type(5) { display: none; }
    .section-pad { padding: 52px 0 58px; }
    .section-heading { align-items: flex-start; flex-direction: column; gap: 10px; margin-bottom: 25px; }
    .section-heading h2 { font-size: 36px; }
    .section-intro { width: auto; max-width: 300px; font-size: 11px; }
    .catalog-toolbar { align-items: flex-start; gap: 12px; flex-direction: column; padding: 13px 0; }
    .search-box { width: 100%; }
    .book-cover-wrap { padding: 13px 13px 0; }
    .book-cover { aspect-ratio: 1.65; }
    .book-card-body { padding: 14px; }
    .book-card h3 { font-size: 19px; }
    .author-section { padding: 45px 0; }
    .author-grid { grid-template-columns: 1fr; gap: 25px; }
    .author-monogram { width: 105px; height: 112px; font-size: 67px; }
    .author-monogram i { margin: 19px 0 0 -23px; font-size: 49px; }
    .author-monogram small { bottom: 8px; left: 8px; font-size: 6px; }
    .author-copy h2 { font-size: 35px; }
    .footer-inner { align-items: flex-start; gap: 8px; flex-direction: column; }
    .footer-inner p { font-size: 9px; }
    .copyright { margin-top: 5px; }
    .detail-breadcrumb { gap: 7px; overflow: hidden; white-space: nowrap; font-size: 8px; }
    .book-detail-section { padding: 29px 0 48px; }
    .detail-grid { grid-template-columns: 1fr; gap: 31px; }
    .detail-cover-column { max-width: 260px; }
    .detail-cover { aspect-ratio: .77; }
    .detail-copy h1 { font-size: 45px; }
    .detail-description { margin: 17px 0 21px; font-size: 12px; }
    .preview-section { padding: 42px 0 49px; }
    .preview-heading { gap: 8px; }
    .preview-heading h2 { font-size: 34px; }
    .preview-limit { font-size: 7px; }
    .preview-pages { grid-template-columns: 1fr; gap: 11px; }
    .preview-page { min-height: 185px; padding: 21px 22px 16px; }
    .preview-page p { font-size: 15px; }
    .account-section { min-height: auto; padding: 25px 0 35px; }
    .account-layout, .checkout-layout { grid-template-columns: 1fr; }
    .account-aside { min-height: 235px; padding: 29px 25px 38px; }
    .account-aside h1 { font-size: 38px; }
    .account-aside > p:not(.eyebrow) { max-width: 340px; margin-top: 11px; }
    .account-aside-index { right: 20px; bottom: 15px; left: auto; }
    .account-form-wrap { padding: 29px 25px 34px; }
    .account-switch { margin-bottom: 17px; }
    .checkout-section { padding: 20px 0 35px; }
    .checkout-aside { min-height: 305px; align-items: center; padding: 26px 24px; text-align: center; }
    .checkout-aside .eyebrow { align-self: flex-start; }
    .checkout-cover { width: 92px; margin: 4px 0 14px; }
    .checkout-cover .cover-sun { width: 70px; height: 70px; }
    .checkout-cover .cover-title { font-size: 14px; }
    .checkout-aside h1 { font-size: 29px; }
    .checkout-aside > p:not(.eyebrow) { margin-top: 7px; }
    .checkout-panel { padding: 30px 24px; }
    .library-section { min-height: auto; padding: 41px 0 53px; }
    .library-heading { align-items: flex-start; flex-direction: column; margin-bottom: 23px; }
    .library-grid { grid-template-columns: 1fr; }
    .library-card { gap: 12px; padding: 13px; }
    .library-card-mark { width: 58px; height: 80px; flex-basis: 58px; }
    .library-card-copy h2 { font-size: 16px; }
    .library-card-actions { gap: 8px; }
}
@media (max-width: 380px) {
    .brand-name { font-size: 10px; }
    .nav-actions { gap: 10px; }
    .nav-text-button { font-size: 10px; }
    .hero-actions { gap: 15px; }
    .button { gap: 13px; padding: 0 12px; }
    .hero-bottom-band .container { letter-spacing: .06em; }
}

.uploaded-book-cover { position: absolute; z-index: 1; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.book-cover .cover-edition, .book-cover .cover-title, .book-cover .cover-label, .book-cover .cover-author { z-index: 2; }
.has-uploaded-cover .cover-art, .has-uploaded-cover .cover-edition, .has-uploaded-cover .cover-title, .has-uploaded-cover .cover-label, .has-uploaded-cover .cover-author { display: none; }
.uploaded-preview-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 17px; margin: 20px 0; }
.uploaded-preview-page { margin: 0; padding: 10px; border: 1px solid #dedacd; background: #f8f6ef; }
.uploaded-preview-page img { display: block; width: 100%; max-height: 540px; object-fit: contain; background: #e9e5d8; }
.uploaded-preview-page figcaption { padding-top: 9px; color: #858476; font: 8px var(--mono); letter-spacing: .1em; }
.admin-book-form { display: block; }
.admin-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 15px; }
.admin-form-grid label, .admin-inline-form label { display: flex; min-width: 0; flex-direction: column; gap: 7px; color: #55584d; font-size: 10px; }
.admin-form-grid input, .admin-form-grid textarea, .admin-inline-form input[type="file"] { width: 100%; min-height: 40px; padding: 9px 10px; border: 1px solid #d9d5c9; border-radius: 0; background: #fbfaf5; color: var(--ink); font: 11px var(--sans); }
.admin-form-grid input[type="file"], .admin-inline-form input[type="file"] { min-height: 0; }
.admin-form-grid textarea { resize: vertical; }
.admin-form-wide { grid-column: 1 / -1; }
.admin-book-form > .admin-actions { margin: 18px 0 0; }
.admin-preview-list { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 18px; }
.admin-preview-list label { width: 120px; padding: 8px; border: 1px solid #dedacd; background: #f7f5ed; font-size: 9px; }
.admin-preview-list img { width: 100%; height: 115px; display: block; margin-bottom: 8px; object-fit: contain; background: #e9e5d8; }
.admin-preview-list input { margin-right: 4px; }
.admin-inline-form { display: flex; align-items: flex-end; gap: 14px; flex-wrap: wrap; }
.admin-inline-form label { flex: 1 1 280px; }
.admin-reconcile-form { margin: 0 0 16px; }
.admin-row-actions { white-space: nowrap; }
.admin-row-actions form { display: inline; margin-left: 8px; }
.admin-row-actions a, .admin-row-actions button { padding: 0; border: 0; background: transparent; color: var(--olive-dark); font-size: 10px; text-decoration: underline; text-underline-offset: 3px; }
.reader-shell { margin-top: 22px; border: 1px solid #d8d3c7; background: #f8f6ef; }
.reader-shell:fullscreen { display: flex; width: 100%; height: 100vh; height: 100dvh; flex-direction: column; margin: 0; overflow: hidden; border: 0; background: #f2eedc; }
.reader-shell:fullscreen .reader-toolbar, .reader-shell:fullscreen .reader-bottom-nav { flex: 0 0 auto; }
.reader-shell:fullscreen .reader-canvas-wrap { min-height: 0; flex: 1 1 auto; }
.reader-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 13px; border-bottom: 1px solid #dedacd; }
.reader-toolbar .button { min-height: 36px; gap: 8px; font-size: 10px; }
.reader-toolbar button:disabled { opacity: .45; cursor: not-allowed; }
.reader-toolbar [data-page-status] { color: #737468; font: 9px var(--mono); text-align: center; }
.reader-page-jump { display: flex; align-items: center; gap: 7px; margin: 0; }
.reader-page-jump input { width: 76px; min-height: 36px; padding: 0 8px; border: 1px solid #c9c3a2; background: #fffdf4; color: #1e2415; font: 10px var(--mono); }
.reader-page-jump input:focus { outline: 2px solid #8e3b26; outline-offset: 2px; }
.reader-page-jump .button { min-height: 36px; }
.reader-button-arrow { display: none; }
.reader-fullscreen-button { display: inline-flex; width: 36px; min-width: 36px; align-items: center; justify-content: center; padding: 0; }
.reader-fullscreen-button svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; }
.reader-fullscreen-button[aria-pressed="false"] .reader-fullscreen-exit-icon,
.reader-fullscreen-button[aria-pressed="true"] .reader-fullscreen-enter-icon { display: none; }
.reader-zoom-button { display: inline-flex; width: 36px; min-width: 36px; align-items: center; justify-content: center; padding: 0; }
.reader-zoom-button svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; }
.reader-canvas-wrap { min-height: 300px; display: flex; justify-content: center; overflow: auto; padding: 18px; background: #e7e4da; }
.reader-page-container { position: relative; flex: 0 0 auto; }
.reader-canvas-wrap canvas { display: block; height: auto; box-shadow: 0 5px 20px rgba(32,37,29,.15); background: white; }
.reader-shell[data-zoomed="true"] .reader-canvas-wrap { justify-content: flex-start; }
.reader-shell[data-zoomed="true"] .reader-page-container { margin: 0 auto; }
.reader-shell[data-zoomed="true"] .reader-canvas-wrap { touch-action: pan-x pan-y; }
.reader-link-layer { position: absolute; inset: 0; pointer-events: none; }
.reader-pdf-link { position: absolute; display: block; pointer-events: auto; }
.reader-pdf-link:focus-visible { outline: 2px solid #8e3b26; background: rgba(142,59,38,.12); }
.reader-disclaimer { margin: 0; padding: 12px 16px; color: #77786e; font-size: 9px; line-height: 1.6; }
.reader-error { margin: 0; padding: 12px 16px; color: #713d2b; font-size: 11px; }

@media (max-width: 767.98px) {
    .admin-panel-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .admin-panel-block { padding: 19px 13px 10px; }
    .admin-form-grid { grid-template-columns: 1fr; }
    .admin-form-wide { grid-column: auto; }
    .reader-toolbar { display: grid; grid-template-columns: 30px minmax(0, 1fr) 30px 26px 26px auto 30px; gap: 3px; padding: 7px; }
    .reader-toolbar > .button { width: 30px; min-width: 30px; min-height: 32px; justify-content: center; padding: 0; font-size: 14px; }
    .reader-toolbar [data-page-status] { min-width: 0; font-size: 8px; white-space: nowrap; }
    .reader-button-arrow { display: inline; }
    .reader-button-label { display: none; }
    .reader-page-jump { min-width: 0; align-items: center; gap: 4px; }
    .reader-page-jump input { box-sizing: border-box; width: 44px; min-width: 0; min-height: 32px; padding: 0 4px; font-size: 9px; }
    .reader-page-jump .button { width: auto; min-width: 25px; min-height: 32px; padding: 0 4px; font-size: 9px; }
    .reader-fullscreen-button { width: 30px; min-width: 30px; }
    .reader-zoom-button { width: 26px; min-width: 26px; }
    .reader-zoom-button svg { width: 16px; height: 16px; }
    .reader-canvas-wrap { min-height: 220px; padding: 10px; }
    .reader-canvas-wrap { touch-action: pan-y; }
}