/* Small, local paper motions. Everything remains visible without JavaScript. */
.hero{background:#eaf6ff;position:relative}
.hero-inner{grid-template-columns:1.1fr 1fr;gap:44px;padding-top:64px;padding-bottom:54px}
.hero h1{font-size:clamp(3.25rem,5.8vw,5.1rem);line-height:1.04;max-width:650px}
.headline-spark{position:relative;z-index:0;display:inline-block}
.headline-spark:after{content:"";position:absolute;z-index:-1;left:1%;right:0;bottom:-3px;height:12px;border-radius:60% 30% 45% 50%;background:var(--yellow);transform:rotate(-2deg)}
.hero-copy>p:not(.eyebrow):not(.hero-facts){max-width:520px}
.hero-stage{position:relative;text-align:center;padding:14px 8px 0;isolation:isolate}
.release-heading{display:inline-flex;gap:9px;align-items:center;background:#fff;border:1px solid #bed8e6;border-radius:99px;padding:8px 14px;font-size:14px;font-weight:700;position:relative;z-index:2}
.release-dot{width:9px;height:9px;border-radius:50%;background:var(--orange)}
.hero-covers{gap:27px;padding:30px 12px 26px;position:relative;z-index:1;max-width:490px;margin:auto}
.floating-book a{display:block;filter:drop-shadow(7px 12px 0 #0b46751c);transition:transform 220ms ease}
.hero-covers .first-book a{transform:rotate(-7deg)}
.hero-covers .second-book a{transform:rotate(6deg) translateY(13px)}
.hero-covers a:hover,.hero-covers a:focus-visible{transform:translateY(-7px) rotate(0)}
.hero .hero-release-note{font-size:15px;margin:15px auto 8px;font-weight:600}
.hero .hero-stock-note{font-size:14px;margin:7px auto 0;color:#405b70}
.hero-stage>.textlink{font-size:15px}
.paper-confetti{position:absolute;inset:20px -7px 70px;pointer-events:none;z-index:-1}
.paper-confetti i{position:absolute;display:block;animation:confetti-wiggle 5s ease-in-out infinite;animation-play-state:paused}
.paper-confetti i:nth-child(1){width:52px;height:52px;border:9px solid #ffca4c;border-radius:50%;top:9%;left:1%;--turn:-10deg}
.paper-confetti i:nth-child(2){width:17px;height:48px;background:#ff936f;right:3%;top:23%;border-radius:3px;--turn:28deg;animation-delay:-2s}
.paper-confetti i:nth-child(3){width:30px;height:30px;background:#8cccaf;left:-2%;bottom:11%;border-radius:50%;--turn:10deg;animation-delay:-3s}
.paper-confetti i:nth-child(4){width:46px;height:12px;background:#80b8ef;right:0;bottom:16%;border-radius:10px;--turn:-27deg;animation-delay:-1s}
.paper-confetti i:nth-child(5){width:9px;height:9px;background:var(--orange);right:27%;top:3%;border-radius:50%;--turn:0deg}
.paper-confetti i:nth-child(6){width:10px;height:10px;background:#77afa5;left:39%;bottom:2%;--turn:35deg;animation-delay:-2s}
.floating-book{animation:paper-float 5.5s ease-in-out infinite;animation-play-state:paused}
.second-book{animation-delay:-2.7s}
html[data-motion="on"] [data-motion-scene].is-visible .floating-book,html[data-motion="on"] [data-motion-scene].is-visible .paper-confetti i{animation-play-state:running}
.play-ribbon{background:#fff9e6;border-top:1px solid #e8ddbc;border-bottom:1px solid #e8ddbc;overflow:hidden}
.play-ribbon>.wrap{display:flex;justify-content:center;align-items:center;gap:clamp(28px,6vw,92px);padding-top:15px;padding-bottom:15px}
.play-ribbon span{display:flex;gap:3px;font:500 24px/1.2 'Fredoka','Trebuchet MS',sans-serif;letter-spacing:.15em;color:var(--blue)}
.play-ribbon span:nth-of-type(2){color:#a44523}.play-ribbon span:nth-of-type(3){color:#21644e}
.play-ribbon b{font-weight:500;display:inline-block}
.play-ribbon i{width:9px;height:9px;background:var(--yellow);transform:rotate(45deg);flex-shrink:0}
html[data-motion="on"] .play-ribbon.is-visible b{animation:letter-pop 550ms ease both;animation-delay:calc(var(--letter-index,0)*65ms)}
.book-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:44px 30px}
.cover-link{position:relative;min-height:350px;padding:35px 26px;overflow:hidden}
.cover-link picture{max-width:215px}
.cover-link img{transition:transform 240ms ease}
.cover-link:hover img,.cover-link:focus-visible img{transform:translateY(-7px) rotate(-2deg)}
.book-card:nth-child(6n+1) .cover-link{background:#eaf3fa}
.book-card:nth-child(6n+2) .cover-link{background:#fff1d5}
.release-badge{position:absolute;top:13px;left:13px;font-size:14px;font-weight:700;background:var(--yellow);color:var(--ink);border-radius:99px;padding:3px 11px}
.book-card .stock-note{font-size:14px;color:#5c4b25;border-left:3px solid #e6b73f;padding-left:9px;margin:15px 0}
.index-note{background:#eff6ed;color:#345c30;border-radius:99px;padding:7px 13px;font-weight:600}
.button{transition:transform 180ms ease,background-color 180ms ease}
.button:hover{transform:translateY(-2px)}
.upcoming>.wrap{display:grid;grid-template-columns:1fr 1fr;gap:65px;align-items:center}
.upcoming .section-head{margin:0}.upcoming .book-grid{grid-template-columns:1fr}
.upcoming .book-card{display:grid;grid-template-columns:150px 1fr;gap:0 23px;align-items:start}
.upcoming .cover-link{grid-column:1;grid-row:1/7;margin:0;padding:14px;min-height:0}
.upcoming .book-card .card-actions{grid-column:2}
.motion-toggle{position:fixed;right:18px;bottom:18px;z-index:8;display:flex;align-items:center;gap:8px;padding:10px 13px;min-height:44px;border:1px solid #afc8d9;border-radius:99px;background:#fff;color:var(--ink);box-shadow:0 3px 14px #102d4314;font:600 14px/1.3 'DM Sans',Arial,sans-serif;cursor:pointer}
.motion-toggle[hidden]{display:none}.motion-toggle:focus-visible{outline:3px solid var(--orange);outline-offset:4px}
.motion-indicator{width:8px;height:8px;border-radius:50%;background:#357758}
.motion-toggle[aria-pressed="true"] .motion-indicator{background:#687d8b}
.motion-toggle:disabled{cursor:default}
.footer{padding-bottom:86px}
html[data-motion="on"] [data-reveal].is-visible{animation:page-arrive 500ms ease both;animation-delay:var(--reveal-delay,0ms)}
html[data-motion="off"]{scroll-behavior:auto}
html[data-motion="off"] .button,html[data-motion="off"] .cover-link img,html[data-motion="off"] .hero-covers a{transition:none}
html[data-motion="off"] .button:hover,html[data-motion="off"] .cover-link:hover img,html[data-motion="off"] .cover-link:focus-visible img{transform:none}
html[data-motion="off"] .hero-covers .first-book a:hover,html[data-motion="off"] .hero-covers .first-book a:focus-visible{transform:rotate(-7deg)}
html[data-motion="off"] .hero-covers .second-book a:hover,html[data-motion="off"] .hero-covers .second-book a:focus-visible{transform:rotate(6deg) translateY(13px)}
@keyframes paper-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-11px)}}
@keyframes confetti-wiggle{0%,100%{transform:translateY(0) rotate(var(--turn))}50%{transform:translateY(-8px) rotate(calc(var(--turn) + 15deg))}}
@keyframes letter-pop{0%{transform:translateY(0)}45%{transform:translateY(-7px) rotate(-5deg)}100%{transform:translateY(0)}}
@keyframes page-arrive{from{opacity:.5;transform:translateY(15px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:1000px){.hero-inner{gap:25px}.hero h1{font-size:clamp(3.1rem,6.4vw,4.5rem)}.hero-covers{gap:16px;padding-left:0;padding-right:0}.hero .hero-release-note{font-size:14px}.release-heading{font-size:13px}.book-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.related-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.upcoming>.wrap{gap:30px}.upcoming .book-card{grid-template-columns:120px 1fr;gap:0 16px}}
@media(max-width:680px){.hero-inner{grid-template-columns:1fr;padding-top:34px;padding-bottom:30px;gap:25px}.hero h1{font-size:clamp(2.85rem,9vw,3.8rem);max-width:460px}.headline-spark:after{height:9px;bottom:-2px}.hero-copy>p{font-size:17px}.hero-stage{padding:0 7px;width:100%;max-width:420px;justify-self:center}.hero-covers{max-width:340px;padding:29px 6px 16px;gap:22px}.hero .hero-release-note{margin-top:12px;font-size:14px}.hero .hero-stock-note{font-size:14px}.release-heading{font-size:14px}.play-ribbon>.wrap{gap:17px;padding-top:13px;padding-bottom:13px}.play-ribbon span{font-size:19px;letter-spacing:.075em;gap:1px}.play-ribbon i{width:7px;height:7px}.cover-link{min-height:0;padding:41px 13px 20px}.release-badge{top:9px;left:9px;font-size:12px;padding:3px 9px}.book-grid{gap:32px 18px}.index-note{display:inline-block;font-size:14px}.section-head{margin-bottom:27px}.book-card .stock-note{font-size:14px}.upcoming>.wrap{grid-template-columns:1fr;gap:27px}.upcoming .book-card{grid-template-columns:135px 1fr;gap:0 20px;max-width:480px}.upcoming .book-card .kind{font-size:14px}.related-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.motion-toggle{right:12px;bottom:12px;font-size:13px;padding:9px 12px}.sample-grid{grid-template-columns:1fr}.sample-card .cover-link{padding:7px}}
@media(max-width:370px){.book-grid,.related-grid{grid-template-columns:1fr}.play-ribbon>.wrap{gap:12px}.play-ribbon span{font-size:17px}.upcoming .book-card{grid-template-columns:105px 1fr;gap:0 14px}.hero h1{font-size:2.8rem}}
.engine-button{display:inline-flex;align-items:center;gap:8px;background:var(--yellow);color:var(--ink);border:2px solid var(--ink);border-radius:99px;padding:10px 20px;min-height:48px;font:700 16px/1.3 'DM Sans',Arial,sans-serif;cursor:pointer}
.engine-button[hidden]{display:none}
.engine-cover{height:38px;width:auto;border-radius:3px;box-shadow:2px 3px 0 #0b46752e;transform:rotate(-6deg)}
.engine-button:focus-visible{outline:3px solid var(--orange);outline-offset:4px}
.detail-cover{text-align:center}
.detail-cover .engine-button{margin-top:18px}
dialog.takeover{width:min(75vw,calc(75vh*16/9));max-width:none;max-height:none;padding:0;border:0;border-radius:18px;overflow:hidden;background:#000}
dialog.takeover video{display:block;width:100%;aspect-ratio:16/9;object-fit:cover}
dialog.takeover.is-portrait{width:min(92vw,calc(75vh*9/16))}
dialog.takeover.is-portrait video{aspect-ratio:9/16}
dialog.takeover::backdrop{background:#06263ecc}
.takeover-bar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;background:#06263e;color:#fff;font-size:14px;padding:10px 14px}
.takeover-note{margin:0;flex:1 1 200px}
.takeover-actions{display:flex;flex-wrap:wrap;gap:10px;flex-shrink:0}
.takeover-actions button,.takeover-actions .takeover-book{display:inline-flex;align-items:center;min-height:44px;padding:0 16px;border:1px solid #fff;border-radius:99px;background:transparent;color:#fff;font:600 14px/1.3 'DM Sans',Arial,sans-serif;cursor:pointer;text-decoration:none}
.takeover-actions button:focus-visible,.takeover-actions .takeover-book:focus-visible{outline:3px solid var(--orange);outline-offset:2px}
.takeover-book[hidden]{display:none}
@media(max-width:680px){dialog.takeover:not(.is-portrait){width:96vw}}
html[data-motion="on"] dialog.takeover[open]:not(.is-leaving){animation:takeover-in 260ms ease both}
html[data-motion="on"] dialog.takeover.is-leaving{animation:takeover-out 200ms ease forwards}
@keyframes takeover-in{from{transform:scale(.92);opacity:0}to{transform:scale(1);opacity:1}}
@keyframes takeover-out{from{transform:scale(1);opacity:1}to{transform:scale(.92);opacity:0}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}html{scroll-behavior:auto}.button:hover,.cover-link:hover img,.cover-link:focus-visible img{transform:none}}
@media(max-width:680px){.release-badge{font-size:14px}}