/* Public samples inherit the established paper, type, button and theme tokens. */
.demo-carousel-tools,.demo-reader-after,.demo-book-controls{display:flex;justify-content:space-between;align-items:center;gap:20px}.demo-carousel-tools{margin:0 0 18px;font:11px var(--ui);color:var(--ink3)}.demo-carousel-tools>div{display:flex;gap:8px}.demo-carousel-tools .pill{min-height:44px;min-width:48px}.demo-poetry-track{display:flex;gap:20px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;padding:8px 2px 22px;scrollbar-width:thin;scrollbar-color:var(--line2) transparent;cursor:grab}.demo-poetry-track.is-dragging{scroll-snap-type:none;cursor:grabbing;user-select:none}.demo-poem.pcard{flex:0 0 calc((100% - 80px)/3.5);min-width:0;display:flex;flex-direction:column;white-space:normal;text-align:left;color:var(--ink);background:var(--page);border:1px solid var(--line);border-radius:18px;overflow:hidden;padding:0;scroll-snap-align:start;transition:transform .25s,box-shadow .25s,border-color .25s}.demo-poem .pcov{height:235px;width:100%;overflow:hidden;background:var(--paper2);display:flex;justify-content:center;padding:18px}.demo-poem .pcov img{width:100%;height:100%;object-fit:contain;transition:transform .3s}.demo-poem .pbody{padding:22px;display:flex;flex:1;flex-direction:column;width:100%;box-sizing:border-box}.demo-poem h3{font:400 26px/1.15 var(--disp);margin:10px 0}.demo-poem .by{font:11px/1.6 var(--ui);color:var(--ink3)}.demo-poem .themes{display:flex;flex-wrap:wrap;gap:6px;margin:18px 0}.demo-poem .themes span{font:10px/1.5 var(--ui);padding:5px 8px;border:1px solid var(--line);border-radius:20px;color:var(--ink2);background:var(--paper)}.demo-poem-link{display:block;margin-top:auto;font:11px var(--ui);color:var(--clay);opacity:.65;transition:opacity .2s}.demo-poem:hover,.demo-poem:focus-visible{transform:translateY(-3px);box-shadow:var(--shadow);border-color:var(--line2)}.demo-poem:hover img{transform:scale(1.03)}.demo-poem:hover .demo-poem-link,.demo-poem:focus-visible .demo-poem-link{opacity:1}.demo-reader{overflow:visible}.demo-book-stage{position:relative;perspective:2200px;isolation:isolate;touch-action:pan-y;border-radius:0 0 22px 22px}.demo-book-spread{display:grid;grid-template-columns:1fr 1fr;height:680px;overflow:hidden;border-radius:0 0 22px 22px}.demo-leaf{height:680px;min-width:0;box-sizing:border-box;padding:40px 48px;display:flex;flex-direction:column;background:var(--page);color:var(--ink)}.demo-left{background:linear-gradient(90deg,var(--page) 94%,color-mix(in srgb,var(--ink) 7%,var(--page)));border-right:1px solid var(--line)}.demo-left h3{font:400 38px/1.13 var(--disp);margin:20px 0}.demo-prose p{font:18px/1.55 var(--body);margin:0 0 14px}.demo-prose blockquote{font:italic 30px/1.4 var(--disp);color:var(--clay);margin:25px 0}.demo-prose .demo-reader-note{font:12px/1.6 var(--ui);color:var(--ink3);margin-top:20px}.demo-left>small{margin-top:auto;font:8px var(--ui);letter-spacing:.13em;color:var(--ink3);padding-top:10px}.demo-right{background:linear-gradient(90deg,color-mix(in srgb,var(--ink) 6%,var(--page)),var(--page) 6%);justify-content:center}.demo-right figure{margin:0;display:flex;flex-direction:column;align-items:center;gap:24px}.demo-right img{width:100%;height:400px;object-fit:contain}.demo-right figcaption{font:10px var(--ui);letter-spacing:.08em;color:var(--ink3)}.demo-stationary{position:absolute;top:0;width:50%;z-index:3;pointer-events:none}.demo-stationary.demo-left{left:0}.demo-stationary.demo-right{right:0}.demo-book-edge{position:absolute;top:0;bottom:0;width:30px;font:24px var(--body);z-index:4;color:var(--ink3);opacity:.35}.demo-edge-prev{left:0}.demo-edge-next{right:0}.demo-edge-next:after{content:'';position:absolute;bottom:0;right:0;width:24px;height:24px;background:linear-gradient(135deg,transparent 48%,var(--paper2) 50%,var(--line) 53%,var(--page) 85%);transition:width .2s,height .2s;border-radius:0 0 20px 0}.demo-edge-next:hover:after{width:35px;height:35px}.demo-book-edge:hover,.demo-book-edge:focus-visible{opacity:1}.demo-book-controls{padding:20px 26px;border-top:1px solid var(--line);font:11px var(--ui);color:var(--ink3)}.demo-book-controls .pill{min-height:44px}.demo-reader-after{align-items:flex-start;margin-top:20px}.demo-reader-after .tour-fine{margin:0;max-width:65ch}.demo-reader-after .pill{flex-shrink:0}.public-techniques{display:grid;grid-template-columns:.8fr 1.2fr;gap:65px;align-items:start}.public-techniques>.tour-fine{grid-column:2}.demo-quiz{padding:32px;border:1px solid var(--line);border-radius:22px;background:var(--page);box-shadow:var(--shadow)}.demo-quiz-progress{display:flex;align-items:center;justify-content:space-between;font:10px var(--ui);color:var(--ink3)}.demo-quiz-progress>span:last-child{display:flex;gap:7px}.demo-quiz-progress i{width:6px;height:6px;border-radius:50%;border:1px solid var(--line2)}.demo-quiz-progress .filled{background:var(--clay);border-color:var(--clay)}.demo-quiz blockquote{font:400 30px/1.35 var(--disp);margin:30px 0 22px}.demo-quiz .demo-quiz-prompt{font:12px/1.6 var(--ui);margin:0 0 18px;color:var(--ink2)}.demo-answers{display:grid;grid-template-columns:1fr 1fr;gap:10px}.demo-answers button{display:flex;align-items:center;gap:12px;text-align:left;min-height:55px;background:var(--paper2);border:1px solid var(--line);border-radius:12px;padding:13px 15px;color:var(--ink);font:12px/1.4 var(--ui);transition:background .2s,border-color .2s}.demo-answers button>span:first-child{font-size:10px;color:var(--ink3)}.demo-answers button:hover:not(:disabled){border-color:var(--ink3)}.demo-answers button.correct{background:color-mix(in srgb,var(--sage) 13%,var(--page));border-color:var(--sage)}.demo-answers button.incorrect{background:color-mix(in srgb,var(--clay) 9%,var(--page));border-color:var(--clay)}.demo-answers button:disabled{opacity:1;cursor:default}.demo-answers b{margin-left:auto;color:var(--sage)}.demo-quiz-feedback{margin-top:22px;min-height:180px}.demo-quiz-feedback p{font:16px/1.6 var(--body);margin:0 0 12px}.demo-quiz-feedback .demo-quiz-hint{color:var(--ink3);font:12px/1.7 var(--ui)}.demo-tip .tour-kicker{display:block;margin:18px 0 8px;font-size:9px}.demo-quiz-result h3{font:400 36px/1.2 var(--disp);margin:22px 0}.demo-quiz-result p{font:18px/1.6 var(--body)}.demo-quiz-result .demo-score{font:64px var(--disp);color:var(--clay);margin:25px 0}.demo-score span{font-size:28px;color:var(--ink3)}.demo-quiz-result .pill{margin:8px 8px 8px 0}.public-landing :is(.demo-poetry-track,.demo-book-stage,.demo-poem,.demo-answers button):focus-visible{outline:2px solid var(--clay);outline-offset:5px}.public-landing [data-demo]:disabled{cursor:default}.demo-carousel-tools button:disabled,.demo-book-controls button:disabled,.demo-book-edge:disabled{opacity:.3}.demo-book-edge:disabled:after{display:none}
@media(max-width:1050px){.demo-poem.pcard{flex-basis:calc((100% - 60px)/2.5)}.demo-leaf{padding:32px}.demo-left h3{font-size:32px}.demo-prose p{font-size:17px}.public-techniques{gap:32px}.demo-answers{grid-template-columns:1fr}.demo-quiz{padding:25px}}
@media(max-width:700px){.demo-poem.pcard{flex-basis:88%}.demo-poem .pcov{height:240px}.demo-poetry-track{gap:20px}.demo-book-spread{display:block;height:920px}.demo-leaf{height:920px;padding:28px 30px}.demo-side-0 .demo-book-spread>.demo-right,.demo-side-1 .demo-book-spread>.demo-left{display:none}.demo-left h3{font-size:32px}.demo-prose p{font-size:18px;line-height:1.55}.demo-right img{height:490px}.demo-book-controls{padding:16px 12px;gap:8px}.demo-book-controls .pill{padding:11px 12px;font-size:10px}.demo-book-controls>span{font-size:10px}.demo-reader-after{display:block}.demo-reader-after .pill{margin-top:18px}.public-techniques{display:block}.public-techniques>.tour-fine{margin-top:20px}.demo-quiz blockquote{font-size:27px}.demo-quiz-feedback{min-height:0}.demo-book-stage{perspective:none}.demo-reader .tour-demo-bar{gap:10px}.demo-reader .tour-demo-bar>div{display:flex;gap:8px}.demo-reader .tour-demo-bar button{min-height:40px}.demo-book-edge{width:22px}.demo-answers{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){.demo-poem,.demo-poem img,.demo-poem-link,.demo-edge-next:after,.demo-answers button{transition:none}.demo-poem:hover,.demo-poem:hover img{transform:none}.demo-poetry-track{scroll-behavior:auto}}
/* Keep every source page on the paper at each reading width. */
@media(min-width:701px) and (max-width:1050px){.demo-book-spread,.demo-leaf{height:760px}}
@media(max-width:700px){.demo-right img{height:580px}}
@media(max-width:360px){.demo-book-spread,.demo-leaf{height:1080px}.demo-left h3{font-size:29px}}
.demo-book-stage.is-dragging{user-select:none}
