.booklet-container{--dm-cover-width:200px;--dm-cover-height:280px;cursor:pointer;perspective:1000px}.booklet-title{margin:0 auto;width:var(--dm-cover-width)}.booklet-title-name{align-items:center;display:flex;height:3em;justify-content:center;line-height:1.5}.booklet-title-name>span{-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;display:-webkit-box;max-width:100%;overflow:hidden}.booklet{height:var(--dm-cover-height);margin:0 40px 40px;position:relative;transform-style:preserve-3d;transition:transform .3s cubic-bezier(.25,.46,.45,.94);width:var(--dm-cover-width)}.booklet:hover{transform:rotateX(5deg)}.book-spine{background:linear-gradient(90deg,#2c1810 0,#5d4037 20%,#6d4c41 80%,#3e2723);border-radius:2px 0 0 2px;box-shadow:inset 2px 0 4px rgba(0,0,0,.3),0 0 10px rgba(0,0,0,.2);left:-8px;position:absolute;top:0;transform:rotateY(-90deg);transform-origin:right center;width:16px}.book-front,.book-spine{height:var(--dm-cover-height)}.book-front{background-position:50%;background-repeat:no-repeat;background-size:cover;border:2px solid #fff;border-radius:4px;box-shadow:0 10px 30px rgba(0,0,0,.3),0 5px 15px rgba(0,0,0,.2);overflow:hidden;position:relative;transform-origin:left center;transition:transform .3s cubic-bezier(.25,.46,.45,.94);width:var(--dm-cover-width)}.book-front:before{background:linear-gradient(135deg,hsla(0,0%,100%,.1),hsla(0,0%,100%,.05) 30%,rgba(0,0,0,.05) 70%,rgba(0,0,0,.1));bottom:0;content:"";left:0;pointer-events:none;position:absolute;right:0;top:0}.booklet:hover .book-front{transform:rotateY(-25deg)}.book-pages{background:#fefefe;border-radius:0 4px 4px 0;box-shadow:inset -2px 0 4px rgba(0,0,0,.1),0 5px 15px rgba(0,0,0,.1);height:calc(var(--dm-cover-height) - 4px);position:absolute;right:-2px;top:2px;transform:translateZ(-1px);width:calc(var(--dm-cover-width) - 4px)}.book-pages:before{border-radius:2px;bottom:4px;content:"";left:4px;position:absolute;right:4px;top:4px}@media (max-width:996px){.booklet-container{align-items:center;display:flex;flex-direction:column}.booklet{margin:0 30px 30px}}@media (max-width:768px){.booklet-container{--dm-cover-width:220px;--dm-cover-height:260px}}