/* The book is the purchase; the illustrated adaptation is an on-page preview. */
html { scrollbar-gutter:stable; }
.opening-actions { display:flex; flex-wrap:wrap; align-items:center; gap:12px 26px; margin-top:30px; }
.opening-actions .trailer-cta { margin:0; }
.preview-link { display:inline-flex; align-items:center; min-height:44px; gap:10px; padding:0; border:0; background:none; color:inherit; font:inherit; text-decoration:underline; text-underline-offset:6px; cursor:pointer; }
.opening-actions .preview-link { color:#ece5d7; font-size:1rem; }
.story-nav .preview-link { font-size:.9rem; text-decoration:none; }
.trailer-edition .inquiry { display:block; }
.trailer-edition .inquiry-copy { max-width:850px; margin:auto; }
.trailer-edition .inquiry h2 { font-size:clamp(2.8rem,5.2vw,5.5rem); }
.preview-gallery { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:clamp(18px,3vw,40px); max-width:1280px; margin:42px auto 0; text-align:left; }
.preview-card { display:block; min-width:0; padding:0; border:0; border-radius:0; background:none; color:#15242d; font:inherit; text-align:left; cursor:pointer; text-decoration:none; }
.preview-card img { width:100%; height:auto; aspect-ratio:16/9; object-fit:cover; }
.preview-card .preview-card-title { display:block; margin-top:14px; font:400 clamp(1.2rem,1.7vw,1.6rem)/1.2 var(--display); letter-spacing:-.02em; }
.preview-card:hover { color:#7d521f; }
.preview-card:hover img { filter:brightness(1.05); }
.preview-open,.preview-open body { overflow:hidden; overscroll-behavior:none; }
.illustrated-preview { position:fixed; inset:0; width:100%; height:100%; height:100dvh; max-width:none; max-height:none; margin:0; padding:0; border:0; border-radius:0; background:#0a151d; color:#f1e4c8; overflow:hidden; }
.illustrated-preview::backdrop { background:rgba(5,12,18,.92); }
.illustrated-preview[open] { display:grid; grid-template-rows:auto minmax(0,1fr) auto; }
.preview-toolbar { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:max(12px,env(safe-area-inset-top)) max(20px,env(safe-area-inset-right)) 8px max(20px,env(safe-area-inset-left)); }
.preview-label { margin:0; color:#b5c0bd; font-size:.875rem; }
.preview-tools { display:flex; align-items:center; gap:4px; }
.preview-icon { display:inline-flex; align-items:center; justify-content:center; flex:none; width:44px; height:44px; padding:0; border:0; border-radius:0; background:transparent; color:#d5d8ce; font:inherit; cursor:pointer; }
.preview-icon:hover { color:#efc58c; background:#ffffff09; }
.preview-icon:disabled { opacity:.24; cursor:default; }
.preview-icon:active { transform:none; }
.preview-icon svg { width:22px; height:22px; fill:none; stroke:currentColor; stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round; }
.preview-icon[aria-pressed=true] { color:#efc58c; }
.preview-content { min-height:0; display:grid; grid-template-columns:minmax(0,1.65fr) minmax(300px,.9fr); gap:clamp(24px,4vw,68px); align-items:stretch; padding:12px clamp(20px,3vw,48px) 12px; }
.preview-visual { align-self:center; min-width:0; min-height:0; max-height:100%; }
.preview-art { margin:0; }
.preview-canvas { position:relative; width:100%; aspect-ratio:16/9; max-height:calc(100dvh - 250px); }
.preview-canvas img { position:absolute; inset:0; width:100%; height:100%; object-fit:contain; }
.preview-art figcaption { padding:10px 0 0; font-size:.875rem; line-height:1.5; color:#b5c0bd; text-align:center; }
.preview-reading { align-self:center; max-height:100%; min-height:0; padding:12px 12px 24px 0; overflow-y:auto; overscroll-behavior:contain; scrollbar-width:thin; scrollbar-color:#60736f transparent; }
.preview-reading h2 { max-width:20ch; font-size:clamp(2rem,3.1vw,3.5rem); line-height:1.06; letter-spacing:-.035em; margin:0 0 25px; }
.preview-prose { max-width:45ch; color:#c7d0ca; font-size:1rem; line-height:1.75; }
.preview-prose p+p { margin-top:18px; }
.preview-quote { margin:25px 0 0; max-width:36ch; color:#dfb77c; font:400 clamp(1.35rem,1.9vw,1.85rem)/1.3 var(--display); }
.preview-last { margin-top:24px; color:#d3d8d0; font-size:1rem; }
.preview-last a { display:inline-flex; min-height:44px; align-items:center; text-underline-offset:6px; }
.preview-bottom { display:flex; justify-content:flex-end; align-items:center; padding:8px max(20px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) max(20px,env(safe-area-inset-left)); }
.preview-pager { display:flex; align-items:center; justify-content:center; gap:10px; margin-top:12px; }
.preview-position { color:#b5c0bd; min-width:54px; text-align:center; font-variant-numeric:tabular-nums; font-size:.875rem; }
.preview-purchase { justify-self:end; color:#d4ba91; text-decoration:none; font-size:.875rem; min-height:44px; display:inline-flex; align-items:center; gap:8px; }
.preview-message { position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:16px; text-align:center; color:#c7d0ca; padding:24px; }
.preview-message button { border:0; background:none; color:#dfb77c; padding:12px; text-underline-offset:5px; text-decoration:underline; }
.preview-art-only .preview-content { grid-template-columns:1fr; gap:0; }
.preview-art-only .preview-reading { display:none; }
.preview-art-only .preview-art figcaption { max-width:70ch; margin-inline:auto; }
.preview-sr { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
@media(max-width:900px) {
 .preview-content { grid-template-columns:minmax(0,1.1fr) minmax(280px,1fr); gap:24px; padding-inline:20px; }
 .preview-reading h2 { font-size:2.25rem; }
}
@media(max-width:650px) {
 .opening-actions { gap:10px 20px; }
 .preview-gallery { grid-template-columns:1fr; max-width:440px; gap:28px; }
 .preview-card .preview-card-title { font-size:1.4rem; margin-top:12px; }
 .preview-toolbar { padding-inline:12px; }
 .preview-label { font-size:.8125rem; }
 .preview-content { display:block; padding:0 0 12px; overflow-y:auto; overscroll-behavior:contain; }
 .preview-visual { padding-top:12px; }
 .preview-art figcaption { padding:8px 20px 0; font-size:.8125rem; }
 .preview-reading { max-height:none; overflow:visible; padding:28px 24px; }
 .preview-reading h2 { font-size:2.45rem; }
 .preview-prose { max-width:none; font-size:1.0625rem; line-height:1.65; }
 .preview-bottom { padding:4px 12px max(8px,env(safe-area-inset-bottom)); }
 .preview-purchase { font-size:.8125rem; }
 .preview-art-only .preview-content { display:grid; padding:0; overflow-y:auto; }
 .preview-art-only .preview-visual { padding-bottom:12px; }
 .preview-art-only .preview-reading { display:none; }
}