:root{--wine:#60372e;--ink:#3c342c;--forest:#536e55;--paper:#fff9ef}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#faf4e7;color:var(--ink);font-family:Georgia,'Times New Roman',serif}button{font:inherit;cursor:pointer}button:disabled{opacity:.3;cursor:default}a{color:var(--wine)}button:focus-visible,a:focus-visible{outline:3px solid #247f87;outline-offset:3px}.skip{position:absolute;top:-100px;left:15px;padding:12px;background:#fff;z-index:30}.skip:focus{top:8px}.sitebar{min-height:72px;background:#fffcf3;display:flex;align-items:center;gap:20px;padding:12px clamp(12px,4vw,58px);border-bottom:1px solid #eadbc1}.brand{text-decoration:none;font-weight:bold;font-size:22px;white-space:nowrap}.crumb{font-style:italic;font-size:14px;color:#85725a}.sitebar nav{margin-left:auto;display:flex;gap:18px;white-space:nowrap;font-size:14px}.reader{position:relative;text-align:center;overflow:hidden;min-height:640px;padding:20px 14px 28px;background:radial-gradient(ellipse at 50% 40%,#f9f0d5 0%,#d6dbc4 65%,#b1c2a6 100%)}.reader:before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.17;background:repeating-linear-gradient(14deg,transparent,transparent 15px,#ffffff64 16px,#ffffff64 17px)}.reader-toolbar{position:relative;z-index:1;max-width:1290px;margin:auto;display:flex;align-items:center;justify-content:space-between;gap:12px}.pill{padding:11px 18px;border:1px solid #ffffffa0;background:#fffaf0c9;border-radius:30px;color:#6e5139;font-size:14px}.controls{display:flex;gap:5px;border-radius:17px;background:#fff9ecdd;padding:4px;box-shadow:0 2px 12px #46362218}.controls button{border:0;background:none;padding:8px 12px;color:#5e3b2d;border-radius:10px;font-size:18px}.controls button:hover{background:#f0e5d2}.controls #read-aloud{font-size:13px;font-weight:bold}.controls #read-aloud[aria-pressed=true]{background:#506b52;color:#fff}.turner{max-width:1340px;min-height:520px;margin:0 auto;display:grid;grid-template-columns:62px minmax(0,1fr) 62px;align-items:center;gap:12px;touch-action:pan-y}.arrow{width:58px;height:58px;border-radius:50%;border:2px solid #d9b897;color:#673b2a;background:#fffaf0e8;font-size:54px;line-height:40px;display:grid;place-items:center;box-shadow:0 4px 12px #5b3e2b33}.arrow:hover:not(:disabled){background:white}.frame{justify-self:center;display:flex;align-items:center;justify-content:center;max-width:min(900px,100%);width:fit-content;max-height:535px;overflow:hidden;border:8px solid #fff7df;outline:2px solid #a88154;background:#fff8e7;box-shadow:5px 5px #a98a5e,8px 8px #75583b,0 18px 40px #482b2659;transition:transform .22s}.frame img{max-height:515px;max-width:100%;display:block;object-fit:contain;cursor:zoom-in;user-select:none}.frame.zoomed{overflow:auto;justify-content:flex-start;align-items:flex-start;max-width:min(900px,100%);max-height:535px;cursor:grab;touch-action:pan-x pan-y}.frame.zoomed img{max-width:none;max-height:none;cursor:grab}.status{position:relative;z-index:1;display:inline-flex;gap:9px;align-items:center;border:1px solid #d4b99c;border-radius:28px;background:#fffaf0e5;padding:10px 20px;box-shadow:0 3px 8px #553a2520}.status strong{font-size:13px}.hint{font-size:13px;color:#6b5341;font-style:italic}.progress{height:5px;width:min(490px,70%);background:#f4ecd1;border-radius:20px;margin:14px auto 0;overflow:hidden}.progress span{display:block;height:100%;width:5.26%;background:#967345;transition:width .2s}.narration{position:relative;z-index:1;max-width:760px;margin:0 auto 14px;padding:10px 18px;border:1px solid #d8c19c;border-radius:16px;background:#fffcf6ed;text-align:left}.narration p{font-size:16px;line-height:1.5}.narration button,.rail-actions button,.afterword button{background:#fffaf0;border:1px solid #c9ad8c;padding:9px 15px;border-radius:12px;color:#553829}.page-rail{background:#fffaf0;padding:26px clamp(14px,4vw,70px) 33px}.rail-header{display:flex;align-items:center;justify-content:space-between;gap:14px;max-width:1350px;margin:auto}.rail-header h2{font-size:21px;color:#65462f}.rail-actions{display:flex;gap:9px}.thumbnails{max-width:1350px;margin:14px auto;display:flex;gap:13px;overflow-x:auto;padding:7px 4px 16px;scroll-snap-type:x proximity}.thumbnail{border:0;background:none;display:flex;flex:0 0 105px;align-items:center;flex-direction:column;gap:6px;padding:4px;scroll-snap-align:center;color:#5a4231;font-size:11px}.thumbnail img{height:85px;max-width:115px;width:auto;object-fit:contain;border-radius:4px;border:3px solid #fff;box-shadow:0 3px 8px #38281e35}.thumbnail[aria-current=page] img{border-color:#b78148;box-shadow:0 0 0 2px #efcc7f}.transcript{max-width:870px;background:white;padding:24px 30px;border-radius:16px;border:1px solid #eddec7;margin:18px auto}.transcript p{line-height:1.7}.transcript small{color:#786e64}.afterword{max-width:1180px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:25px;padding:55px 22px}.afterword>div{border:1px solid #e6d9c4;border-radius:20px;padding:27px;background:#fffdf5}.afterword .kicker{font-size:11px;text-transform:uppercase;letter-spacing:.17em;color:#7a6f50}.afterword h2{color:#684333;font-size:27px}.afterword p{line-height:1.75}.afterword a{display:inline-block;margin-top:9px}footer{background:#f1e8d6;display:flex;justify-content:space-between;gap:12px;align-items:center;padding:22px clamp(15px,4vw,65px);font-size:12px}.reader.full{position:fixed;inset:0;z-index:100;overflow-y:auto;display:flex;flex-direction:column;justify-content:center;min-height:0;max-height:100dvh}.reader.full .turner{width:100%;flex:1;min-height:0}.reader.full .frame,.reader.full .frame img{max-height:calc(100dvh - 170px)}body.full-mode{overflow:hidden}@media(max-width:750px){.sitebar{flex-wrap:wrap;gap:5px 14px}.brand{font-size:17px}.crumb{font-size:12px}.sitebar nav{width:100%;justify-content:space-between;font-size:12px}.reader{min-height:490px;padding:13px 6px 21px}.reader-toolbar{padding:0 5px}.pill{font-size:10px;padding:8px}.controls button{padding:7px;font-size:17px}.controls #read-aloud{font-size:11px}.turner{grid-template-columns:37px minmax(0,1fr) 37px;min-height:365px;gap:1px}.arrow{width:34px;height:38px;font-size:36px;line-height:28px}.frame{max-height:345px;border-width:4px;outline-width:1px}.frame img{max-height:337px}.frame.zoomed{max-height:345px}.hint{font-size:11px}.rail-header{align-items:flex-start;flex-direction:column}.afterword{grid-template-columns:1fr}footer{flex-wrap:wrap}.thumbnail{flex-basis:78px}.thumbnail img{height:60px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition:none!important;scroll-behavior:auto!important}}
/* Family Time game: link beside the check-in button, and the section with the game inside the book. */
.family-links{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px}.family-play{display:inline-block;padding:11px 20px;border-radius:999px;background:#4f6b51;color:#fffaf0;font-weight:bold;text-decoration:none;min-height:44px}.family-play:hover{background:#3b523d}.afterword .family-links a.family-play{margin-top:0}
.family-game-section{max-width:1136px;margin:0 auto 50px;padding:clamp(18px,3vw,34px);background:#fffdf5;border:1px solid #e6d9c4;border-radius:20px}.family-game-heading{max-width:780px}.family-game-section .kicker{font-size:11px;text-transform:uppercase;letter-spacing:.17em;color:#7a6f50}.family-game-heading h2{color:#684333;font-size:clamp(24px,3.6vw,34px);margin:6px 0 12px}.family-game-heading p{line-height:1.75}
.family-game-inline{margin-top:24px;border-top:1px solid #eadbc1;padding-top:16px}.family-game-inline summary{cursor:pointer;color:#4f6b51;font-weight:bold;font-size:17px}.family-game-inline summary:focus-visible{outline:3px solid #247f87;outline-offset:3px}.family-game-inline iframe{border:1px solid #e0cdae;border-radius:16px;width:100%;height:855px;margin-top:16px;background:#faf3e6;display:block}
@media(max-width:750px){.family-game-section{margin:0 12px 34px;padding:18px}.family-game-inline iframe{height:1140px}}