.album-root{--book-d:34px;--book-ratio:1;--book-spine-color:#276dae;--book-display-scale:1.5625;isolation:isolate;background:#fff;width:100%;min-width:0;height:100%;min-height:0;position:relative;overflow:hidden;container-type:size}.album-root:after{content:"";z-index:100;pointer-events:none;opacity:0;background:#fff;animation:.45s both album-section-reveal;position:absolute;inset:0}@keyframes album-section-reveal{0%{opacity:1}to{opacity:0}}.album-return-veil{z-index:101;background:#fff;position:absolute;inset:0}.album-return-veil-out{animation:.22s both album-reader-fade-out}.album-return-veil-in{animation:.32s both album-section-reveal}@keyframes album-reader-fade-out{0%{opacity:0}to{opacity:1}}.album-scene-reader{background:var(--album-surface,#fafafa)}.album-scene-closing{animation:1.4s both album-close-background}.album-scene-closing .album-scroll{overflow:hidden}@keyframes album-close-background{0%,32%{background-color:var(--album-surface,#fafafa)}to{background-color:#fff}}.album-scroll{overscroll-behavior:contain;position:absolute;inset:0;overflow:hidden auto}.stage{perspective:1800px;perspective-origin:50% 46%;-webkit-user-select:none;user-select:none;touch-action:pan-y;justify-content:center;align-items:center;height:100cqh;display:flex;position:relative;overflow:hidden}.book-scene{width:min(46cqmin,380px);max-width:min(calc((100cqw - 32px) / var(--book-display-scale)), calc((100cqh - 32px) * var(--book-ratio) / var(--book-display-scale)));aspect-ratio:var(--book-ratio);transform-style:preserve-3d;cursor:grab;touch-action:none;position:relative}.book-scene.is-dragging{cursor:grabbing}.book-float,.book{width:100%;height:100%;transform-style:preserve-3d;position:relative}.book-float{transform:scale3d(var(--book-display-scale), var(--book-display-scale), var(--book-display-scale))}.book{will-change:transform}.stage-veil{z-index:3;pointer-events:none;background:var(--album-surface,#fafafa);opacity:0;transition:opacity .55s .45s;position:absolute;inset:0}.book-face{border-radius:var(--cover-radius);backface-visibility:hidden;background:#fff;position:absolute;inset:0;overflow:hidden}.book-face img{object-fit:contain;width:100%;height:100%}.book-front-hinge{transform:translateZ(calc(var(--book-d) / 2));transform-origin:0;transform-style:preserve-3d;transition:transform .9s cubic-bezier(.62,.02,.34,1);position:absolute;inset:0}.book-front{transform:translateZ(.1px);box-shadow:0 1px 4px #00000014}.book-front-inside{border-radius:var(--cover-radius);transform:translateZ(calc(0px - var(--cover-thickness))) rotateY(180deg);backface-visibility:hidden;background:#fff;position:absolute;inset:0}.book-front-sheen{pointer-events:none;background:linear-gradient(118deg,#fff3,#0000 38% 72%,#ffffff0f);position:absolute;inset:0}.book-back-hinge{transform:translateZ(calc(var(--book-d) / -2));transform-origin:0;transform-style:preserve-3d;transition:transform .9s cubic-bezier(.62,.02,.34,1);position:absolute;inset:0}.book-back{transform:rotateY(180deg)}.book-back-inside{border-radius:var(--cover-radius);transform:translateZ(var(--cover-thickness));backface-visibility:hidden;background:#fff;position:absolute;inset:0}.book-last-page{inset:var(--page-inset);transform:translateZ(calc(var(--paper-depth) / -2 + .1px)) rotateY(180deg);backface-visibility:hidden;background:#fff;position:absolute}.book-last-page img{object-fit:contain;width:100%;height:100%}.book-last-page.is-spread{display:flex;overflow:hidden}.book-last-page.is-spread img{flex:0 0 200%;width:200%;max-width:none;transform:translate(-50%)}.book-pages{inset:var(--page-inset);transform:translateZ(calc(var(--paper-depth) / 2 - .1px));backface-visibility:hidden;background:#f7f7f5;position:absolute}.book-spine{width:var(--book-d);transform-origin:0;height:100%;transform:translateZ(calc(var(--book-d) / -2)) rotateY(-90deg);background:var(--book-spine-color);position:absolute;top:0;left:0}.cover-rim,.cover-corner{height:var(--cover-thickness);background:#eceeeb;position:absolute}.cover-rim-top,.cover-rim-bottom{left:var(--cover-radius);width:calc(100% - var(--cover-radius) * 2)}.cover-rim-top{transform-origin:top;top:0;transform:rotateX(-90deg)}.cover-rim-bottom{transform-origin:bottom;bottom:0;transform:rotateX(90deg)}.cover-rim-left,.cover-rim-right{top:var(--cover-radius);width:var(--cover-thickness);height:calc(100% - var(--cover-radius) * 2)}.cover-rim-left{background:var(--book-spine-color);transform-origin:0;left:0;transform:rotateY(90deg)}.cover-rim-right{transform-origin:100%;right:0;transform:rotateY(-90deg)}.cover-corner{transform-origin:0 0}.book-back-hinge .cover-rim-top{transform:rotateX(90deg)}.book-back-hinge .cover-rim-bottom{transform:rotateX(-90deg)}.book-back-hinge .cover-rim-left{transform:rotateY(-90deg)}.book-back-hinge .cover-rim-right{transform:rotateY(90deg)}.book-fore-edge{top:var(--page-inset);bottom:var(--page-inset);right:var(--page-inset);width:0;transform-style:preserve-3d;position:absolute}.paper-edge-strip{transform-origin:0;background-image:linear-gradient(90deg,#605f5733 0 .3px,#0000 .5px);height:100%;position:absolute;top:0;left:0}.book-edge{left:var(--page-inset);width:calc(100% - var(--page-inset) * 2);height:var(--paper-depth);background-color:#f7f7f5;background-image:repeating-linear-gradient(to bottom, #605f572e 0 .3px, transparent .5px var(--paper-layer-step));clip-path:var(--paper-outline);position:absolute}.book-edge-top{top:var(--page-inset);transform-origin:top;transform:translateZ(calc(var(--paper-depth) / -2)) rotateX(90deg)}.book-edge-bottom{bottom:var(--page-inset);transform-origin:bottom;transform:translateZ(calc(var(--paper-depth) / -2)) rotateX(-90deg)}.stage-opening .book-front-hinge{transform:translateZ(calc(var(--book-d) / 2)) rotateY(-168deg)}.stage-aligning .book-scene,.stage-back-hold .book-scene,.stage-returning .book-scene,.stage-opening .book-scene{cursor:default}.stage-closing .book-scene{pointer-events:none;animation:1.4s cubic-bezier(.22,1,.36,1) both album-book-return}.stage-closing .book{animation:1.4s cubic-bezier(.22,1,.36,1) both album-book-settle}.stage-closing .book-back-hinge{animation:.85s cubic-bezier(.4,0,.2,1) .1s both album-back-close}.stage-from-back .book-back{box-shadow:0 3px 16px #00000012,0 1px 3px #0000000a}@keyframes album-book-return{0%,16%{transform:scale(var(--close-start-scale,1))}to{transform:scale(1)}}@keyframes album-book-settle{0%,16%{transform:rotateX(0)rotateY(180deg)}to{transform:rotateX(-1deg)rotateY(179deg)}}@keyframes album-back-close{0%{transform:translateZ(calc(var(--book-d) / -2)) rotateY(180deg)}to{transform:translateZ(calc(var(--book-d) / -2)) rotateY(0deg)}}.stage-opening .book-scene{animation:1s cubic-bezier(.5,0,.75,0) forwards album-book-open}.stage-opening .stage-veil{opacity:1}@keyframes album-book-open{0%{transform:scale(1)}to{transform:scale(2.35)translateZ(140px)}}.album-gallery{padding:clamp(10px,3vw,20px) clamp(12px,4vw,50px)}.album-gallery-inner,.album-gallery-col{gap:clamp(12px,1.6vw,20px);display:flex}.album-gallery-inner{align-items:flex-start}.album-gallery-col{flex-direction:column;flex:1 1 0;min-width:0}.album-gallery-item{width:100%;min-width:0;line-height:0;display:block;overflow:hidden}.album-gallery-item img{object-fit:contain;width:100%;height:auto;transition:transform .28s,opacity .2s}.album-gallery-item:hover img{transform:scale(1.04)}.album-gallery-item:active img{opacity:.75}.reader,.album-photo-screen{outline:none;position:absolute;inset:0}.reader{flex-direction:column;animation:.3s both album-page-in;display:flex}.album-return{z-index:5;min-width:60px;min-height:44px;color:var(--gray);font-size:12px;position:absolute;top:0;left:0}.album-return:hover{text-decoration:underline}.reader-stage{touch-action:pan-y pinch-zoom;overscroll-behavior:contain;flex:1;justify-content:center;align-items:center;min-height:0;margin:38px 0;display:flex;position:relative}.reader-sheet{background:#fff;flex:none;justify-content:center;align-items:center;max-width:100%;max-height:100%;animation:.3s both album-page-in;display:flex;position:relative;box-shadow:0 3px 16px #00000012,0 1px 3px #0000000a}.reader-sheet img{object-fit:contain;width:100%;height:100%}.reader-sheet.is-spread:after{content:"";pointer-events:none;background:#00000029;width:1px;position:absolute;top:0;bottom:0;left:50%;transform:translate(-50%)scaleX(.5)}.reader-sheet.is-half{justify-content:flex-start;overflow:hidden}.reader-sheet.is-half img{flex:0 0 200%;width:200%;max-width:none;height:100%}.reader-sheet.is-half.is-right img{transform:translate(-50%)}.reader-zone{z-index:4;width:25%;position:absolute;top:0;bottom:0}.reader-prev{cursor:w-resize;left:0}.reader-next{cursor:e-resize;right:0}.album-root .slide-counter{margin:0;bottom:0;right:0}@keyframes album-page-in{0%{opacity:0}to{opacity:1}}@container (max-width:800px){.stage{perspective:1200px}.book-scene{width:min(74cqw, calc(70cqh * var(--book-ratio)), 360px)}.album-gallery{padding:10px}.album-gallery-inner,.album-gallery-col{gap:10px}}@container (max-height:350px){.book-scene{width:min(54cqw, calc(66cqh * var(--book-ratio)), 240px)}}@media (hover:none){.album-gallery-item:hover img{transform:none}}@media (prefers-reduced-motion:reduce){.album-root:after{animation:none}.album-return-veil{animation-duration:.01ms}.stage-opening .book-scene,.reader,.reader-sheet{animation:none}.stage-closing .book-scene,.stage-closing .book,.stage-closing .book-back-hinge,.album-scene-closing{animation-duration:.01ms;animation-delay:0s}}
