.book-loader-wrapper{justify-content:center;align-items:center;padding:1rem;display:flex}.book-loader-wrapper.small{padding:0;font-size:.5em}.book-loader-wrapper.medium{font-size:1em}.book-loader-wrapper.large{font-size:1.5em}.book{background-color:var(--accent);box-shadow:0 .25em .5em #0000004d, 0 0 0 .25em var(--accent-light) inset;perspective:37.5em;width:8em;height:6em;transform-style:preserve-3d;border-radius:.25em;padding:.25em;position:relative;transform:translate(0,0)}.book,.book__pg-shadow,.book__pg{animation:5s ease-in-out infinite cover}.book__pg-shadow,.book__pg{width:calc(50% - .25em);position:absolute;left:.25em}.book__pg-shadow{filter:blur(.25em);transform-origin:100% 0;background-image:linear-gradient(-45deg,#0000 50%,#0000004d 50%);height:3.75em;animation-name:shadow;top:calc(100% - .25em);transform:scaleY(0)}.book__pg{background-color:var(--surface);transform-origin:100%;background-image:linear-gradient(90deg,#0000 87.5%,#0000001a);height:calc(100% - .5em);animation-name:pg1}.book__pg--2,.book__pg--3,.book__pg--4{background-image:repeating-linear-gradient(var(--text-3) 0 .125em, #0000 .125em .5em), linear-gradient(90deg, #0000 87.5%, #0000001a);background-position:50%;background-repeat:no-repeat;background-size:2.5em 4.125em,100% 100%}.book__pg--2{animation-name:pg2}.book__pg--3{animation-name:pg3}.book__pg--4{animation-name:pg4}.book__pg--5{animation-name:pg5}@keyframes cover{0%,5%,45%,55%,95%,to{background-color:var(--accent-light);animation-timing-function:ease-out}10%,40%,60%,90%{background-color:var(--accent);animation-timing-function:ease-in}}@keyframes shadow{0%,10.01%,20.01%,30.01%,40.01%{animation-timing-function:ease-in;transform:translateZ(1px)scaleY(0)rotateY(0)}5%,15%,25%,35%,45%,55%,65%,75%,85%,95%{animation-timing-function:ease-out;transform:translateZ(1px)scaleY(.2)rotateY(90deg)}10%,20%,30%,40%,50%,to{animation-timing-function:ease-out;transform:translateZ(1px)scaleY(0)rotateY(180deg)}50.01%,60.01%,70.01%,80.01%,90.01%{animation-timing-function:ease-in;transform:translateZ(1px)scaleY(0)rotateY(180deg)}60%,70%,80%,90%,to{animation-timing-function:ease-out;transform:translateZ(1px)scaleY(0)rotateY(0)}}@keyframes pg1{0%,to{background-color:var(--surface);animation-timing-function:ease-in-out;transform:translateZ(1px)rotateY(.4deg)}10%,15%{background-color:var(--surface);animation-timing-function:ease-out;transform:translateZ(1px)rotateY(180deg)}20%,80%{background-color:var(--surface-3);animation-timing-function:ease-in;transform:translateZ(1px)rotateY(180deg)}85%,90%{background-color:var(--surface);animation-timing-function:ease-in-out;transform:translateZ(1px)rotateY(180deg)}}@keyframes pg2{0%,to{background-color:var(--surface-3);animation-timing-function:ease-in;transform:translateZ(1px)rotateY(.3deg)}5%,10%{background-color:var(--surface);animation-timing-function:ease-in-out;transform:translateZ(1px)rotateY(.3deg)}20%,25%{background-color:var(--surface);animation-timing-function:ease-out;transform:translateZ(1px)rotateY(179.9deg)}30%,70%{background-color:var(--surface-3);animation-timing-function:ease-in;transform:translateZ(1px)rotateY(179.9deg)}75%,80%{background-color:var(--surface);animation-timing-function:ease-in-out;transform:translateZ(1px)rotateY(179.9deg)}90%,95%{background-color:var(--surface);animation-timing-function:ease-out;transform:translateZ(1px)rotateY(.3deg)}}@keyframes pg3{0%,10%,90%,to{background-color:var(--surface-3);animation-timing-function:ease-in;transform:translateZ(1px)rotateY(.2deg)}15%,20%{background-color:var(--surface);animation-timing-function:ease-in-out;transform:translateZ(1px)rotateY(.2deg)}30%,35%{background-color:var(--surface);animation-timing-function:ease-out;transform:translateZ(1px)rotateY(179.8deg)}40%,60%{background-color:var(--surface-3);animation-timing-function:ease-in;transform:translateZ(1px)rotateY(179.8deg)}65%,70%{background-color:var(--surface);animation-timing-function:ease-in-out;transform:translateZ(1px)rotateY(179.8deg)}80%,85%{background-color:var(--surface);animation-timing-function:ease-out;transform:translateZ(1px)rotateY(.2deg)}}@keyframes pg4{0%,20%,80%,to{background-color:var(--surface-3);animation-timing-function:ease-in;transform:translateZ(1px)rotateY(.1deg)}25%,30%{background-color:var(--surface);animation-timing-function:ease-in-out;transform:translateZ(1px)rotateY(.1deg)}40%,45%{background-color:var(--surface);animation-timing-function:ease-out;transform:translateZ(1px)rotateY(179.7deg)}50%{background-color:var(--surface-3);animation-timing-function:ease-in;transform:translateZ(1px)rotateY(179.7deg)}55%,60%{background-color:var(--surface);animation-timing-function:ease-in-out;transform:translateZ(1px)rotateY(179.7deg)}70%,75%{background-color:var(--surface);animation-timing-function:ease-out;transform:translateZ(1px)rotateY(.1deg)}}@keyframes pg5{0%,30%,70%,to{background-color:var(--surface-3);animation-timing-function:ease-in;transform:translateZ(1px)rotateY(0)}35%,40%{background-color:var(--surface);animation-timing-function:ease-in-out;transform:translateZ(1px)rotateY(0)}50%{background-color:var(--surface);animation-timing-function:ease-in-out;transform:translateZ(1px)rotateY(179.6deg)}60%,65%{background-color:var(--surface);animation-timing-function:ease-out;transform:translateZ(1px)rotateY(0)}}