.book-loader{--cycle:2.5s;--pages:5;--step:calc(var(--cycle) / var(--pages));--paper:#f7f6ee;--paper-back:#ebe9db;--ink:#2b2b2b;perspective:32em;background:linear-gradient(90deg, var(--paper-back) 0 calc(50% - 1px), #2b2b2b38 calc(50% - 1px) calc(50% + 1px), var(--paper) calc(50% + 1px) 100%);width:6em;height:4em;box-shadow:0 0 0 .18em var(--ink);border-radius:.25em;position:relative}.book-loader__pg-shadow{pointer-events:none;background:radial-gradient(closest-side,#2b2b2b47,#0000);border-radius:50%;width:84%;height:.6em;position:absolute;bottom:-1.1em;left:8%}.book-loader__pg{--i:0;transform-origin:0;background:repeating-linear-gradient(180deg, transparent 0 .5em, #2b2b2b1f .5em calc(.5em + 1px)) .5em .6em / calc(100% - 1em) calc(100% - 1.2em) no-repeat, var(--paper);width:50%;height:100%;animation:book-flip var(--cycle) linear infinite;animation-delay:calc(var(--step) * var(--i) - var(--cycle));z-index:calc(var(--pages) - var(--i));will-change:transform, opacity;backface-visibility:visible;border-radius:0 .25em .25em 0;position:absolute;top:0;left:50%}.book-loader__pg:after{content:"";border-radius:inherit;background:var(--ink);opacity:0;animation:book-shade var(--cycle) linear infinite;animation-delay:inherit;position:absolute;inset:0}.book-loader__pg--2{--i:1}.book-loader__pg--3{--i:2}.book-loader__pg--4{--i:3}.book-loader__pg--5{--i:4}@keyframes book-flip{0%{opacity:1;animation-timing-function:cubic-bezier(.55,.05,.35,1);transform:rotateY(0)}28%{opacity:1;transform:rotateY(-180deg)}32%{opacity:0;transform:rotateY(-180deg)}99.9%{opacity:0;transform:rotateY(-180deg)}to{opacity:0;transform:rotateY(0)}}@keyframes book-shade{0%{opacity:0;animation-timing-function:ease-in-out}14%{opacity:.16;animation-timing-function:ease-in-out}28%{opacity:0}to{opacity:0}}@media (prefers-reduced-motion:reduce){.book-loader{animation:2s ease-in-out infinite book-pulse}.book-loader__pg,.book-loader__pg:after{opacity:0;animation:none}}@keyframes book-pulse{0%,to{opacity:.55}50%{opacity:1}}