:root{--jjs-pink:#CD3A8E;--jjs-pinklt:#FAB3F8;--jjs-purple:#4E217A;--jjs-lav:#B8A9E0;--jjs-yellow:#FDDD0F;--jjs-blue:#275B87;--jjs-sky:#8FC4F7;--jjs-ease:cubic-bezier(.22,.85,.3,1);--jjs-spine-h:258px;--jjs-cover:172px;--jjs-spine-w:46px}.jj-shelf{position:relative;width:100%;max-width:620px;margin:0 auto;padding-top:var(--jjs-cover);z-index:2}.jj-shelf__books{position:relative;display:flex;align-items:flex-end;justify-content:center;gap:5px;height:var(--jjs-spine-h);padding:0 8px}.jj-shelf__books:before,.jj-shelf__books:after{content:"";flex:0 0 11px;height:62%;align-self:flex-end;background:linear-gradient(180deg,var(--jjs-yellow),#e3c50c);border:2.5px solid var(--jjs-purple);border-radius:2px 2px 0 0;box-shadow:inset -3px 0 6px #00000024}.jj-shelf__book{position:relative;flex:0 0 auto;width:var(--jjs-spine-w);height:100%;display:block;text-decoration:none;transform-origin:bottom center;transition:transform .38s var(--jjs-ease),opacity .28s ease;will-change:transform}.jj-shelf__book--lean0{transform:rotate(0)}.jj-shelf__book--lean1{transform:rotate(-1.5deg)}.jj-shelf__book--lean2{transform:rotate(.9deg)}.jj-shelf__book--lean3{transform:rotate(-.7deg)}.jj-shelf__book--lean4{transform:rotate(1.3deg)}.jj-shelf__book--lean0 .jj-shelf__spine{height:100%}.jj-shelf__book--lean1 .jj-shelf__spine{height:96%}.jj-shelf__book--lean2 .jj-shelf__spine{height:99%}.jj-shelf__book--lean3 .jj-shelf__spine{height:93%}.jj-shelf__book--lean4 .jj-shelf__spine{height:97%}.jj-shelf__spine{position:absolute;left:0;right:0;bottom:0;border:2.5px solid var(--jjs-purple);border-radius:3px 3px 2px 2px;display:flex;flex-direction:column;align-items:center;justify-content:space-between;padding:11px 3px 9px;overflow:hidden;box-shadow:inset -6px 0 10px #00000029,inset 3px 0 6px #ffffff38;transition:box-shadow .38s var(--jjs-ease)}.jj-shelf__rules{display:block!important;flex:0 0 auto;width:60%;height:7px;min-height:7px;border-top:2px solid currentColor;border-bottom:2px solid currentColor;opacity:.5}.jj-shelf__spine-title{writing-mode:vertical-rl;text-orientation:mixed;transform:rotate(180deg);font-family:Libre Franklin,sans-serif;font-weight:800;font-size:10.5px;letter-spacing:.02em;line-height:1;text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-height:calc(var(--jjs-spine-h) - 76px);flex:1 1 auto;display:flex;align-items:center}.jj-shelf__spine-mark{flex:0 0 auto;width:20px;height:20px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--jjs-yellow);color:var(--jjs-purple);border:1.5px solid var(--jjs-purple);font-family:Libre Franklin,sans-serif;font-weight:900;font-size:8.5px;letter-spacing:-.02em;box-shadow:0 1px 3px #00000040}.jj-shelf__book--yellow .jj-shelf__spine-mark{background:var(--jjs-purple);color:var(--jjs-yellow);border-color:var(--jjs-yellow)}.jj-shelf__book--pink .jj-shelf__spine{background:var(--jjs-pink);color:#fff}.jj-shelf__book--purple .jj-shelf__spine{background:var(--jjs-purple);color:#fff}.jj-shelf__book--blue .jj-shelf__spine{background:var(--jjs-blue);color:#fff}.jj-shelf__book--lav .jj-shelf__spine{background:var(--jjs-lav);color:var(--jjs-purple)}.jj-shelf__book--sky .jj-shelf__spine{background:var(--jjs-sky);color:var(--jjs-purple)}.jj-shelf__book--pinklt .jj-shelf__spine{background:var(--jjs-pinklt);color:var(--jjs-purple)}.jj-shelf__book--yellow .jj-shelf__spine{background:var(--jjs-yellow);color:var(--jjs-purple)}.jj-shelf__cover{position:absolute;bottom:calc(100% + 14px);left:50%;width:var(--jjs-cover);margin-left:calc(var(--jjs-cover) / -2);border-radius:10px;overflow:hidden;border:3px solid var(--jjs-purple);background:#fff;box-shadow:0 22px 44px #4e217a57;opacity:0;transform:translateY(16px) scale(.92) rotate(-2deg);transform-origin:bottom center;transition:opacity .34s var(--jjs-ease),transform .34s var(--jjs-ease);pointer-events:none;display:block}.jj-shelf__cover-img{display:block;width:100%;height:auto;aspect-ratio:1/1;object-fit:cover}.jj-shelf__cover-name{display:block;padding:7px 8px 8px;background:var(--jjs-purple);color:#fff;font-family:Libre Franklin,sans-serif;font-weight:800;font-size:10.5px;line-height:1.2;text-transform:uppercase;letter-spacing:.03em;text-align:center}.jj-shelf__book:hover,.jj-shelf__book:focus-visible{transform:translateY(-14px) rotate(0);z-index:20;outline:none}.jj-shelf__book:hover .jj-shelf__spine,.jj-shelf__book:focus-visible .jj-shelf__spine{box-shadow:inset -6px 0 10px #00000029,inset 3px 0 6px #ffffff38,0 14px 26px #4e217a57}.jj-shelf__book:hover .jj-shelf__cover,.jj-shelf__book:focus-visible .jj-shelf__cover{opacity:1;transform:translateY(0) scale(1) rotate(0)}.jj-shelf__books:has(.jj-shelf__book:hover) .jj-shelf__book:not(:hover){opacity:.7}.jj-shelf__plank{display:flex!important;align-items:center;justify-content:center;position:relative;width:100%;height:26px;min-height:26px;border-radius:4px;background:linear-gradient(180deg,#7b47ab 0%,var(--jjs-purple) 46%,#3a1860 100%);border:2.5px solid var(--jjs-purple);box-shadow:0 8px #3a186073,inset 0 2px #fff3}.jj-shelf__plank:after{content:"JEN JENIVIVE";font-family:Libre Franklin,sans-serif;font-weight:900;font-size:9px;letter-spacing:.36em;text-indent:.36em;color:var(--jjs-yellow);opacity:.9;text-shadow:0 1px 0 rgba(0,0,0,.35)}.jj-shelf__shadow{display:block!important;width:78%;height:24px;min-height:24px;margin:30px auto 0;background:radial-gradient(ellipse at center,rgba(78,33,122,.28),transparent 72%)}@media(max-width:1100px){:root{--jjs-spine-h:230px;--jjs-cover:150px;--jjs-spine-w:42px }.jj-shelf__spine-title{font-size:9.5px}.jj-shelf__spine-mark{width:18px;height:18px;font-size:7.5px}}@media(max-width:749px){.jj-shelf{padding-top:0;max-width:100%}.jj-shelf__books{height:auto;justify-content:flex-start;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding:4px 4px 16px;min-width:0}.jj-shelf__books::-webkit-scrollbar{display:none}.jj-shelf__books:before,.jj-shelf__books:after{display:none}.jj-shelf__book{width:144px;height:auto;transform:none!important;scroll-snap-align:center}.jj-shelf__spine{display:none}.jj-shelf__cover{position:relative;bottom:auto;left:auto;margin:0;width:100%;opacity:1;transform:none;pointer-events:auto;box-shadow:0 8px 18px #4e217a3d}.jj-shelf__plank,.jj-shelf__shadow{display:none!important}.jj-hero__fan-hint{display:none}}@media(prefers-reduced-motion:reduce){.jj-shelf__book,.jj-shelf__cover{transition:opacity .2s ease!important}.jj-shelf__book:hover{transform:none}}
/*# sourceMappingURL=/cdn/shop/t/17/assets/jj-shelf.css.map */