.vol{--H:calc(var(--vh) * 1rem * var(--s));--W:calc(var(--H) * .7);--a:calc(var(--vt) * .9rem * var(--s));--b:calc(var(--a) * .577);--cloth-t:oklch(from var(--cloth) calc(l + var(--tone) * .03) c calc(h + var(--tone) * 6));--weave:repeating-linear-gradient(90deg, color-mix(in oklab, var(--book-shade) 8%, transparent) 0 1px, transparent 1px 2px), repeating-linear-gradient(0deg, color-mix(in oklab, var(--book-light) 5%, transparent) 0 1px, transparent 1px 3px);width:calc(var(--a) + var(--W));height:calc(var(--b) + var(--H));vertical-align:bottom;flex:none;display:inline-block;position:relative}.vol[data-lang=grc]{--cloth:var(--spine-grc)}.vol[data-lang=la]{--cloth:var(--spine-la)}.vol-cover{left:var(--a);width:var(--W);height:var(--H);padding:calc(var(--H) * .17) calc(var(--W) * .16) calc(var(--H) * .1) calc(var(--W) * .2);border-radius:1px calc(1px + 3px * var(--s)) calc(1px + 3px * var(--s)) 1px;color:var(--gilt);text-align:center;background: radial-gradient(circle at 100% 0, color-mix(in oklab, var(--book-light) calc(var(--wear) * 18%), transparent), transparent calc(var(--W) * .12)), radial-gradient(circle at 100% 100%, color-mix(in oklab, var(--book-light) calc(var(--wear) * 14%), transparent), transparent calc(var(--W) * .1)),  linear-gradient(140deg, color-mix(in oklab, var(--book-light) 13%, transparent), transparent 42%, color-mix(in oklab, var(--book-shade) 26%, transparent)),  linear-gradient(90deg, color-mix(in oklab, var(--book-shade) 38%, transparent) 0, transparent 3%, color-mix(in oklab, var(--book-shade) 32%, transparent) 7%, color-mix(in oklab, var(--book-light) 12%, transparent) 8.5%, transparent 11%), var(--weave), var(--cloth-t);box-shadow:inset -1px -1px 0 color-mix(in oklab, var(--book-shade) 40%, transparent), inset 0 1px 0 color-mix(in oklab, var(--book-light) 14%, transparent);flex-direction:column;align-items:center;display:flex;position:absolute;bottom:0;overflow:hidden}.vol-frame{border:1px solid color-mix(in oklab, var(--book-shade) 30%, transparent);box-shadow:1px 1px 0 color-mix(in oklab, var(--book-light) 9%, transparent);outline:1px solid color-mix(in oklab, var(--book-shade) 18%, transparent);outline-offset:calc(2px + 2px * var(--s));pointer-events:none;position:absolute;inset:6% 7% 6% 13%}.vol-title{-webkit-line-clamp:3;font-family:var(--ff-display);font-weight:600;font-size:calc(var(--W) * .17);text-wrap:balance;text-shadow:0 1px 0 color-mix(in oklab, var(--book-shade) 50%, transparent);-webkit-box-orient:vertical;line-height:1.12;display:-webkit-box;overflow:hidden}.vol-title:lang(grc){font-family:var(--ff-greek);font-weight:400}.vol-rule{width:34%;height:1px;margin-block:calc(var(--H) * .05);opacity:.85;background:currentColor}.vol-author{font:600 calc(var(--W) * .075) / 1.2 var(--ff-display);letter-spacing:.18em;text-transform:uppercase;text-shadow:0 1px 0 color-mix(in oklab, var(--book-shade) 50%, transparent)}.vol-num{font:600 calc(var(--W) * .42) / 1 var(--ff-display);text-shadow:0 1px 0 color-mix(in oklab, var(--book-shade) 50%, transparent)}.vol-cap{margin-top:calc(var(--H) * .04);font:600 calc(var(--W) * .075) / 1.2 var(--ff-display);letter-spacing:.16em;text-transform:uppercase}.vol-device{width:calc(var(--W) * .32);filter:drop-shadow(0 1px 0 color-mix(in oklab, var(--book-shade) 45%, transparent));flex:none;margin-top:auto}.vol-spine{width:var(--a);height:var(--H);border-radius:calc(1px + 2px * var(--s)) 0 0 calc(1px + 2px * var(--s));transform-origin:100% 100%;color:var(--gilt);background: linear-gradient(var(--gilt) 0 0) 0 7% / 100% 1px no-repeat, linear-gradient(var(--gilt) 0 0) 0 calc(7% + 3px) / 100% 1px no-repeat, linear-gradient(var(--gilt) 0 0) 0 93% / 100% 1px no-repeat, linear-gradient(var(--gilt) 0 0) 0 calc(93% - 3px) / 100% 1px no-repeat,  linear-gradient(90deg, color-mix(in oklab, var(--book-shade) 30%, transparent) 0, color-mix(in oklab, var(--book-light) 16%, transparent) 28%, color-mix(in oklab, var(--book-light) 6%, transparent) 55%, color-mix(in oklab, var(--book-shade) 34%, transparent) 100%), var(--weave), var(--cloth-t);justify-content:center;align-items:center;display:flex;position:absolute;bottom:0;left:0;overflow:hidden;transform:skewY(30deg)}.vol-spine-title{writing-mode:vertical-rl;white-space:nowrap;text-overflow:ellipsis;max-block-size:72%;font-family:var(--ff-latin);font-weight:500;font-size:calc(var(--a) * .5);text-shadow:0 1px 0 color-mix(in oklab, var(--book-shade) 50%, transparent);line-height:1;overflow:hidden}.vol-spine-title:lang(grc){font-family:var(--ff-greek);font-weight:400}.vol-top{left:var(--a);bottom:var(--H);width:var(--W);height:var(--b);transform-origin:0 100%;background: linear-gradient(0deg, var(--cloth-t) 0 calc(1px + 1px * var(--s)), transparent 0 calc(100% - 1px - 1px * var(--s)), oklch(from var(--cloth-t) calc(l - .06) c h) 0),  linear-gradient(90deg, transparent calc(100% - 2px - 2px * var(--s)), oklch(from var(--cloth-t) calc(l - .03) c h) 0),  linear-gradient(90deg, color-mix(in oklab, var(--book-light) 20%, transparent), transparent 40%, color-mix(in oklab, var(--book-shade) 16%, transparent)), repeating-linear-gradient(0deg, transparent 0 1px, color-mix(in oklab, var(--book-shade) 10%, transparent) 1px 2px), var(--page-edge);position:absolute;transform:skew(60deg)}.vol-foot{left:calc(var(--a) * -.3);right:calc(var(--W) * -.12);background:var(--text);border-radius:1px;height:2px;position:absolute;bottom:-2px}:root[data-theme=dark] .vol-foot{background:var(--text-muted)}.vol-foot:before{content:"";left:calc(var(--a) * .6);right:calc(var(--W) * -.1);height:calc(var(--H) * .08);background:radial-gradient(closest-side, color-mix(in oklab, var(--book-shade) 30%, transparent), transparent);position:absolute;bottom:0;translate:0 40%}.vol[data-small] .vol-frame,.vol[data-small] .vol-foot{display:none}.vol[data-small] .vol-cover{padding:0 0 calc(var(--H) * .14)}.vol[data-small] .vol-device{width:46%}
