/* Scoped account overlay only. Approved illustrated shell/art is unchanged. */
#book-account { text-align:left; overflow-y:auto; }
#book-account label { display:block; margin:12px 0; }
#book-account input { display:block; min-height:44px; font-size:16px; }
#book-account button { min-height:44px; padding:9px 12px; margin:4px; border:1px solid var(--rule); background:var(--paper); color:var(--ink); }
#book-account form > button { width:calc(100% - 8px); }

.release-notice{max-width:48rem;margin:1rem auto;padding:1rem;color:var(--ink,#29231c);background:#eee3ce;font-size:.85rem;line-height:1.5}
#profile:has(#hosted-link-controls:not([hidden])){overflow-y:auto;overscroll-behavior:contain}
#hosted-link-controls{height:auto;font-size:14px;line-height:1.45}
#hosted-link-controls output{display:block;overflow-wrap:anywhere;font-family:monospace;margin:8px 0}
#hosted-link-controls button{min-height:44px;margin:4px 0;max-width:100%;white-space:normal}
#hosted-link-controls textarea{box-sizing:border-box;width:100%;max-width:100%;font:inherit;resize:vertical}

/* Local viewport-fit candidate. Original 2:3 skins retain their proportions. */
body.viewport-fit{margin:0;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);box-sizing:border-box;min-height:100svh}
.viewport-fit .demo-bar{height:24px;box-sizing:border-box;padding:3px 8px;font-size:10px;letter-spacing:0;gap:4px;white-space:nowrap}
.viewport-fit #book-nav{height:48px;box-sizing:border-box;padding:0 2px;margin:0 auto;flex-wrap:nowrap;gap:0;max-width:720px}
.viewport-fit #book-nav a,.viewport-fit #book-nav button{min-height:44px;flex-direction:row;font-size:12px;padding:3px 7px;white-space:nowrap}
.viewport-fit .book,.viewport-fit .closed-book{width:min(720px,100%,calc(var(--book-height,600px)*2/3));margin:0 auto;aspect-ratio:2/3;box-shadow:none}
.viewport-fit #main,.viewport-fit #main:has(#spellbook:not([hidden])){top:10%;bottom:19%;padding:0;overflow:visible}
.viewport-fit #main>section{height:100%;min-height:0;overflow:visible}
.viewport-fit #main h1{font-size:24px;line-height:1.15;letter-spacing:0;margin:0 0 5px}
.viewport-fit #main>section>.eyebrow,.viewport-fit .heading>.eyebrow,.viewport-fit .heading>.intro{display:none}
.viewport-fit #spellbook{display:grid;grid-template-rows:auto auto auto auto minmax(0,1fr);gap:3px}
.viewport-fit .discovery{margin:0;padding:2px 0;gap:10px;min-height:24px}
.viewport-fit .discovery .eyebrow{display:none}.viewport-fit .discovery p{font-size:0}.viewport-fit .discovery strong{font-size:16px;white-space:nowrap}
.viewport-fit .progress-side label{font-size:12px;line-height:1.15}.viewport-fit .progress-side label span{display:inline}.viewport-fit .progress-side progress{margin:3px 0 0;height:4px}
.viewport-fit .catalog-tools{display:grid;grid-template-columns:1fr;gap:0}
.viewport-fit .search-wrap label{position:absolute;width:1px;height:1px;clip-path:inset(50%);overflow:hidden}
.viewport-fit .search-wrap input{height:44px;min-height:44px;font-size:16px;padding:5px 8px}
.viewport-fit .filters{margin:0}.viewport-fit .filters button{min-height:44px;padding:4px;font-size:14px}
.viewport-fit .catalog-caption{margin:0;font-size:12px;line-height:16px;letter-spacing:0;min-height:16px}
.viewport-fit #catalog.collection-strip{min-height:0;height:100%;scrollbar-width:none;padding:0;overflow-y:hidden}
.viewport-fit #catalog::-webkit-scrollbar{height:0}
.viewport-fit .collection-strip .strip-group{padding:0;gap:6px}
.viewport-fit .collection-strip .card{height:auto;min-height:0;padding:4px;justify-content:center}
.viewport-fit .collection-strip .art-wrap{height:clamp(52px,calc(var(--tile-height,140px) - 48px),112px);flex:0 1 auto;min-height:52px}
.viewport-fit .collection-strip .card img{height:100%;width:100%;max-width:112px;max-height:112px;min-height:52px}
.viewport-fit .collection-strip .card h2{font-size:14px;line-height:18px;margin:3px 0 0;flex:0 0 auto}
.viewport-fit .page-turner{top:82%;height:9%;left:18%;right:13%;gap:2px;flex-wrap:wrap;align-content:center;border-top:1px solid #89704480}
.viewport-fit .page-turner span{order:-1;flex-basis:100%;font-size:12px;line-height:16px;white-space:normal;max-width:none}
.viewport-fit .page-turner button{flex:1;font-size:14px;min-height:44px;padding:3px;border:0}
.viewport-fit .page-turner button::after{content:none!important}
.viewport-fit #privacy-open,.viewport-fit #privacy-page-open{position:absolute;top:91%;left:22%;width:61%;display:block;margin:0;min-height:44px;padding:4px;border:0;background:none;text-decoration:underline;font:italic 14px Georgia,serif}
.viewport-fit #privacy-open{color:#eee3ce}.viewport-fit #privacy-page-open{color:#213956}
#privacy-panel{text-align:left}#privacy-panel h2{font-size:24px}#privacy-panel .release-notice{padding:0;margin:0;font-size:16px;line-height:1.45}#privacy-close{min-height:44px}
.viewport-fit .guide-reference{position:static;height:auto;overflow:visible}
.viewport-fit .guide-reference .guide-lead,.viewport-fit .guide-reference .command-list p,.viewport-fit .guide-reference .note,.viewport-fit #recent .note,.viewport-fit #recent .intro{font-size:16px;line-height:1.35;margin:6px 0}
.viewport-fit .guide-reference .command-list{margin:0}.viewport-fit .guide-reference .command-list article{padding:8px 0}
.viewport-fit .profile-card{font-size:16px;line-height:1.35;margin:0;padding:0}.viewport-fit .profile-card h2{font-size:20px;line-height:1.2;margin:6px 0}
.viewport-fit .profile-card p{margin:6px 0}.viewport-fit #hosted-link-controls{font-size:16px;line-height:1.35}
.viewport-fit #hosted-link-controls button,.viewport-fit #hosted-link-controls input{min-height:44px;font-size:16px}
.viewport-fit #profile:has(#hosted-link-controls:not([hidden])){overflow:visible}
.fit-page-hidden{display:none!important}
.viewport-fit #main>.fit-long-page{overflow:auto}
/* Accessibility fallback: unusually short/narrow or enlarged layouts may scroll,
   instead of clipping text or disabling zoom. */
body.fit-accessible .book,body.fit-accessible .closed-book{width:min(720px,100%);min-width:0}
body.fit-accessible #main,body.fit-accessible #main:has(#spellbook:not([hidden])){overflow:auto}
body.fit-accessible #spellbook{min-height:520px;height:auto;grid-template-rows:auto auto auto auto 330px}


/* Sizing-only alternative: original raster composition, proportional cover fit.
   Decorative outer edges crop when the viewport aspect ratio differs. */
body.viewport-fit .book,body.viewport-fit .closed-book{width:100%;max-width:none;height:var(--book-height,calc(100dvh - 76px));aspect-ratio:auto;margin:0}
.viewport-fit #book-nav{max-width:none;width:100%}
.viewport-fit .book-skin{object-fit:cover;object-position:center}
body.fit-accessible .book,body.fit-accessible .closed-book{width:100%;min-height:520px}

/* Existing header controls become inscriptions inside the book. */
.viewport-fit #book-nav{position:absolute;z-index:3;left:5%;right:5%;top:28px;width:90%;max-width:none;height:48px;margin:0;color:var(--ink)}
.viewport-fit .demo-bar{position:absolute;z-index:3;left:8%;right:8%;top:4px;width:84%;height:20px;background:transparent;color:var(--ink);justify-content:space-between}
.viewport-fit .closed-book #book-nav,.viewport-fit .closed-book .demo-bar{color:#fff4d4;text-shadow:0 1px 3px #000}
.viewport-fit #book-nav a[aria-current]{color:inherit;font-weight:bold}
.viewport-fit #book-nav :is(a,button):focus-visible{outline:2px solid currentColor;outline-offset:-2px}
.viewport-fit #main,.viewport-fit #main:has(#spellbook:not([hidden])){top:max(90px,12%)}

/* Keep sign-out result within the cover, readable over the original artwork. */
.viewport-fit #close-signout-status{position:absolute;left:18%;right:13%;top:72%;bottom:10%;margin:0;padding:8px;box-sizing:border-box;overflow:auto;background:#17212bea;color:#fff4d4;font-size:14px;line-height:1.35;text-align:left}
.viewport-fit #close-signout-status:empty{display:none}

/* Detail art keeps original proportions; no changes to book framing. */
#detail-art{display:block;width:auto;height:auto;max-width:100%;max-height:min(256px,36dvh);object-fit:contain;margin:0 auto;image-rendering:auto}

/* Cover only; open-book navigation and framing remain unchanged. */
.closed-book #book-nav,.closed-book .demo-bar,.closed-book #preview-demo{display:none!important}
#cover-help{position:absolute;left:25%;right:20%;bottom:14%;width:55%;min-height:44px;z-index:4}
#cover-help-dialog{text-align:left}#cover-help-dialog .guide-reference{height:auto;max-height:none;overflow:visible}
#cover-help-dialog .command-list{display:block}#cover-help-dialog .command-list article{display:block;margin:12px 0}
#cover-help-dialog #privacy-open{position:static;display:block;margin:20px auto 0;min-height:44px}

.closed-book .cover-note{display:none}