@layer element{.element-ebook-cover{--depth: .075;inline-size:100%;block-size:100%;font-size:var(--ebook-font-size)}.element-ebook-cover.scene,.element-ebook-cover :is(.cover,.spine,.spine-text){inline-size:100%;block-size:100%}.element-ebook-cover :is(.book,.cover,.spine){position:absolute}.element-ebook-cover.scene{position:relative;display:flex;justify-content:center;align-items:center;perspective:2000px}.element-ebook-cover.scene .book{display:block;block-size:100%;max-block-size:100%;max-inline-size:100%;aspect-ratio:.70710678;transform-origin:center;transform:rotateY(0);transform-style:preserve-3d;transition:all .6s ease}:is(.element-ebook-cover.scene .book) .cover{transform:translateZ(calc(var(--ebook-depth) / 2));border-radius:0 .25em .25em 0;overflow:hidden}:is(:is(.element-ebook-cover.scene .book) .cover):before{content:"";position:absolute;inset-block:0;inset-inline-start:4%;width:.25%;background:#fff3}:is(:is(.element-ebook-cover.scene .book) .cover):after{content:"";position:absolute;inset-block:0;inset-inline-start:3%;width:.75%;background:#0003}:is(.element-ebook-cover.scene .book) .spine{inline-size:var(--ebook-depth);transform:rotateY(-90deg) translateZ(calc(var(--ebook-depth) / 2));background:#f2f2f2}:is(:is(.element-ebook-cover.scene .book) .spine) .spine-text{box-sizing:border-box;writing-mode:vertical-rl;display:flex;justify-content:space-between;align-items:center;font-size:var(--ebook-font-size);color:#2e2e2e;gap:1em;transform:rotate(180deg) translate(.1em);padding-inline:.5em;margin:0}:is(:is(:is(.element-ebook-cover.scene .book) .spine) .spine-text) span{white-space:nowrap}:is(:is(:is(.element-ebook-cover.scene .book) .spine) .spine-text) .title{font-family:GTAmericaCondensed,sans-serif;font-weight:600;overflow:hidden;text-overflow:ellipsis;display:inline-block}:is(:is(:is(.element-ebook-cover.scene .book) .spine) .spine-text) .type{font-family:GTAmericaCondensed,sans-serif;font-weight:700}.element-ebook-cover.perspective .book{transform:rotateY(30deg)}*:has(>.element-ebook-cover){container-type:size;display:flex;justify-content:center;align-items:center}@container (max-height: 800px){.element-ebook-cover{--ebook-depth: calc(800px * var(--depth));--ebook-font-size: 32x}}@container (max-height: 750px){.element-ebook-cover{--ebook-depth: calc(750px * var(--depth));--ebook-font-size: 30px}}@container (max-height: 700px){.element-ebook-cover{--ebook-depth: calc(700px * var(--depth));--ebook-font-size: 28px}}@container (max-height: 650px){.element-ebook-cover{--ebook-depth: calc(650px * var(--depth));--ebook-font-size: 26px}}@container (max-height: 600px){.element-ebook-cover{--ebook-depth: calc(600px * var(--depth));--ebook-font-size: 24px}}@container (max-height: 550px){.element-ebook-cover{--ebook-depth: calc(550px * var(--depth));--ebook-font-size: 22px}}@container (max-height: 500px){.element-ebook-cover{--ebook-depth: calc(500px * var(--depth));--ebook-font-size: 20px}}@container (max-height: 450px){.element-ebook-cover{--ebook-depth: calc(450px * var(--depth));--ebook-font-size: 18px}}@container (max-height: 400px){.element-ebook-cover{--ebook-depth: calc(400px * var(--depth));--ebook-font-size: 16px}}@container (max-height: 350px){.element-ebook-cover{--ebook-depth: calc(350px * var(--depth));--ebook-font-size: 14px}}@container (max-height: 300px){.element-ebook-cover{--ebook-depth: calc(300px * var(--depth));--ebook-font-size: 12px}}@container (max-height: 250px){.element-ebook-cover{--ebook-depth: calc(250px * var(--depth));--ebook-font-size: 10px}}@container (max-height: 200px){.element-ebook-cover{--ebook-depth: calc(200px * var(--depth));--ebook-font-size: 8px}}@container (max-height: 150px){.element-ebook-cover{--ebook-depth: calc(150px * var(--depth));--ebook-font-size: 6px}}@container (max-height: 100px){.element-ebook-cover{--ebook-depth: calc(100px * var(--depth));--ebook-font-size: 4px}}@container (max-height: 50px){.element-ebook-cover{--ebook-depth: calc(50px * var(--depth));--ebook-font-size: 2px}}@container (max-height: 799px){.element-ebook-cover img{content:var(--book-cover-image-799)}}@container (max-height: 699px){.element-ebook-cover img{content:var(--book-cover-image-699)}}@container (max-height: 599px){.element-ebook-cover img{content:var(--book-cover-image-599)}}@container (max-height: 499px){.element-ebook-cover img{content:var(--book-cover-image-499)}}@container (max-height: 399px){.element-ebook-cover img{content:var(--book-cover-image-399)}}@container (max-height: 299px){.element-ebook-cover img{content:var(--book-cover-image-299)}}@container (max-height: 199px){.element-ebook-cover img{content:var(--book-cover-image-199)}}@container (max-height: 99px){.element-ebook-cover img{content:var(--book-cover-image-99)}}@media (resolution >= 2dppx){@container (max-height: 799px){.element-ebook-cover img{content:var(--book-cover-image-799-2x)}}@container (max-height: 699px){.element-ebook-cover img{content:var(--book-cover-image-699-2x)}}@container (max-height: 599px){.element-ebook-cover img{content:var(--book-cover-image-599-2x)}}@container (max-height: 499px){.element-ebook-cover img{content:var(--book-cover-image-499-2x)}}@container (max-height: 399px){.element-ebook-cover img{content:var(--book-cover-image-399-2x)}}@container (max-height: 299px){.element-ebook-cover img{content:var(--book-cover-image-299-2x)}}@container (max-height: 199px){.element-ebook-cover img{content:var(--book-cover-image-199-2x)}}@container (max-height: 99px){.element-ebook-cover img{content:var(--book-cover-image-99-2x)}}}}