body{background:radial-gradient(ellipse at top,#e5d0b3,#b6a39d 80%)}.intro{padding-top:25px}.intro h1{font-size:42px}.instruction{margin-bottom:8px}.intro .fine{max-width:800px;margin:auto}.book-stage{perspective:1800px;padding:10px 20px 35px}.comic{position:relative;max-width:1120px;gap:0;padding:0;border:0;background:#f9efd9;box-shadow:0 24px 40px #37263550,6px 7px 0 #c1ad90,9px 10px 0 #f0dfbd,12px 13px 0 #72605e;border-radius:3px 12px 12px 3px;transform-origin:left center}.comic:after{content:'';position:absolute;top:0;bottom:0;left:50%;width:35px;transform:translateX(-50%);background:linear-gradient(90deg,transparent,#36223027,transparent);pointer-events:none;z-index:3}.leaf{padding:20px 24px 13px;background:linear-gradient(90deg,#f9eed7,#fffaef 15%,#fff9eb 90%,#eadcc2);position:relative;min-width:0;display:flex;flex-direction:column}.leaf:nth-child(2){background:linear-gradient(90deg,#ddc9a5,#fff8e7 8%,#fff9eb 90%,#eee0c4)}.leaf-heading{display:flex;justify-content:space-between;font:9px Consolas,monospace;letter-spacing:1px;color:#7c6064;margin-bottom:12px}.leaf .frame{border:2px solid #37283c;flex:1;box-shadow:2px 3px 0 #c4ac95}.leaf .frame .caption{font-size:12px;min-height:55px;padding:10px 12px}.leaf .frame .bubble{font-size:16px;min-height:105px;margin-block:12px 26px;padding:14px 18px;background:#fffdf7}.leaf .frame .art{aspect-ratio:1.3}.leaf .frame .bottom-caption{font-size:12px;min-height:78px;padding:12px}.leaf .frame .loupe{font-size:11px;margin:12px;max-width:calc(100% - 24px);padding:8px 12px}.folio{text-align:center;font:11px Georgia,serif;margin:12px 0 0;color:#765b5b}.pager{max-width:1120px;margin:20px auto 8px}.pager button{min-height:44px}.book-tools{max-width:1000px;margin:0 auto 20px;display:flex;justify-content:center;gap:25px;align-items:center;font-size:11px;padding:0 15px;color:#49394f}.book-tools button{border:1px solid #6b536d;background:#f8ebd4;padding:7px 13px;border-radius:5px;font-size:11px}.book-tools label{display:flex;align-items:center;gap:6px}.book-tools input{width:17px;height:17px}.credits{background:#f4e5ce;border-radius:8px}.turn-next{animation:turnNext .38s ease-out}.turn-prev{animation:turnPrev .38s ease-out}@keyframes turnNext{0%{transform:rotateY(-9deg);filter:brightness(.85)}100%{transform:rotateY(0);filter:brightness(1)}}@keyframes turnPrev{0%{transform:rotateY(9deg);filter:brightness(.85)}100%{transform:rotateY(0);filter:brightness(1)}}#close{position:sticky;float:right;top:0;font-size:12px;background:#34233c;color:#fff1d4;padding:10px;border-radius:6px;z-index:5;margin-bottom:15px}dialog>.kicker{clear:both}#content video{display:block;width:100%;max-height:52vh;background:#17131d;border-radius:7px}#content .video-description{font-size:12px;border-left:3px solid #a282af;padding-left:12px}.no-motion .comic{animation:none!important}@media(max-width:700px){.intro h1{font-size:33px}.intro{padding-inline:15px}.book-stage{padding:5px 12px 25px}.comic{margin:0;grid-template-columns:1fr}.comic:after{display:none}.leaf,.leaf:nth-child(2){padding:15px 15px 10px;background:linear-gradient(90deg,#e9d8b8,#fff9eb 8%,#fff9eb 92%,#eddfc3)}.leaf .frame .bubble{font-size:17px;min-height:0}.leaf .frame .art{aspect-ratio:1.12}.leaf .frame .bottom-caption{font-size:13px;min-height:0}.leaf .frame .loupe{font-size:12px}.book-tools{gap:12px;flex-wrap:wrap}.pager{padding:0 14px}.pager button{font-size:11px}.leaf-heading{font-size:8px}}@media(prefers-reduced-motion:reduce){.comic{animation:none!important}}
