:root{--baseline: 12px;--page-height: 31vw;--page-width: 31vw;--page-aspect: 1 / 1}.container{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:space-evenly;padding:.5rem}.book-container{background-color:#fcd7bc;height:calc(1.1 * var(--page-height));display:flex;align-items:center;justify-content:center;position:relative;perspective:calc(4 * var(--page-height));transform:translate(calc(var(--page-width) * .5))}.page-pair{display:flex;position:absolute;height:var(--page-height);width:var(--page-width);backface-visibility:hidden;transform-origin:0;transform-style:preserve-3d;transition-duration:1.8s}.page-pair.left{transform:rotateY(-180deg)}.top{z-index:1}.page-pair:not(.top){z-index:-2}.page{position:absolute;height:100%;width:100%;display:flex;justify-content:center;align-items:center;background-color:#f0f8ff;backface-visibility:hidden;overflow:hidden;transform-style:preserve-3d}.page-b{transform:rotateY(180deg)}.page-pair:not(:first-child) .page-a:before{position:absolute;content:"";height:100%;width:100%;box-shadow:inset 80px 0 80px -110px #0006}.page-pair:not(:last-child) .page-b:after{position:absolute;content:"";height:100%;width:100%;box-shadow:inset -20px 0 35px -30px #0006}.page img{height:var(--page-width);width:var(--page-width);margin:0}.controls{padding:.7rem 1rem;display:flex;justify-content:center;align-items:center;margin-inline:auto;width:calc(50vw - 2rem);gap:1rem}.controls button{border-radius:50%;border:none;padding:.3vw;display:flex;justify-content:center;align-items:center}.playPause{width:3vw;height:auto}.btnNext,.btnPrev{width:2.2vw;height:auto}.highlighted.bold{font-weight:bolder}.highlighted.red-underline{text-decoration:underline}.highlighted.red-highlight{color:#ff6464;transition-property:all;transition-duration:.1s}.font-outline{-webkit-text-stroke:.125rem #292929}@font-face{font-family:NotoSansTC;src:url(/fonts/NotoSansTC-VariableFont_wght.ttf) format("ttf");font-weight:700;font-display:swap}.subtitle{font-family:NotoSansTC,sans-serif}