/* ======================================================== */
/* 📚 BESPOKE 3D ISOMETRIC HARDCOVER & LAYERED PAGE STACK   */
/* Ceiling: < 350 lines | Refined from Style 6.10           */
/* ======================================================== */

#storyCarouselContainer {
    perspective: 1100px;
    padding-top: 10px !important;
    padding-bottom: 18px !important;
}

#storyCarouselStage .vibe-book-cover {
    position: relative;
    width: calc(100% - 8px);
    aspect-ratio: 2 / 3;
    overflow: visible !important;
    background: transparent !important;
    box-shadow: none !important;
    filter: none !important;
    transform: rotateY(-14deg) rotateX(3.5deg) rotateZ(-0.35deg) !important;
    transform-style: preserve-3d;
    transition: transform 0.42s cubic-bezier(0.16, 1, 0.3, 1), filter 0.42s ease !important;
    user-select: none;
}

#storyCarouselStage .group:hover .vibe-book-cover {
    transform: rotateY(-6deg) rotateX(1.8deg) rotateZ(0deg) translateY(-6px) scale(1.02) !important;
}

#storyCarouselStage .group:active .vibe-book-cover {
    transform: rotateY(-10deg) rotateX(2.5deg) scale(0.98) !important;
}

/* Hide legacy unused layers */
#storyCarouselStage .vibe-book-cover::before,
#storyCarouselStage .vibe-book-cover::after,
#storyCarouselStage .vibe-book-crease,
#storyCarouselStage .vibe-book-headband-top,
#storyCarouselStage .vibe-book-headband-bottom,
#storyCarouselStage .vibe-book-pages-right,
#storyCarouselStage .vibe-book-pages-bottom,
#storyCarouselStage .vibe-book-ribbon {
    display: none !important;
}

/* 1. Back Hardcover Board Rim (Tầng 3: Bìa cứng sau đỡ xấp giấy) */
#storyCarouselStage .stack-layer-2 {
    position: absolute;
    top: 4.5px;
    left: 4px;
    right: -8.5px;
    bottom: -6.5px;
    z-index: 2;
    pointer-events: none;
    border-radius: 3px 13px 13px 4px;
    background-image: var(--book-bg);
    background-size: cover;
    background-position: center;
    filter: brightness(0.30) saturate(1.15);
    border-right: 1.5px solid rgba(212, 238, 127, 0.48);
    border-bottom: 1.5px solid rgba(212, 238, 127, 0.38);
    box-shadow:
        -4px 14px 26px rgba(0, 0, 0, 0.78),
        5px 10px 20px rgba(0, 0, 0, 0.65);
    transition: transform 0.42s cubic-bezier(0.16, 1, 0.3, 1);
}

/* 2. 3D Textured Paper Page Block (Tầng 2: Xấp trang giấy kem có vân giấy thật) */
#storyCarouselStage .stack-layer-1 {
    position: absolute;
    top: 2px;
    left: 4px;
    right: -5.5px;
    bottom: -4px;
    z-index: 5;
    pointer-events: none;
    border-radius: 2px 11px 10.5px 3px;
    background:
        linear-gradient(180deg, rgba(0, 0, 0, 0.16) 0%, transparent 7%, transparent 90%, rgba(0, 0, 0, 0.22) 100%),
        repeating-linear-gradient(90deg,
            #FCF9F2 0px,
            #E3DAC4 1.2px,
            #F7F2E6 2.4px,
            #CFC2A6 3.6px
        );
    border-right: 1px solid rgba(214, 202, 176, 0.85);
    border-bottom: 1px solid rgba(190, 176, 146, 0.85);
    box-shadow:
        inset -2.5px -2.5px 5px rgba(0, 0, 0, 0.20),
        inset 0 2px 3px rgba(0, 0, 0, 0.18),
        1.5px 2px 4px rgba(0, 0, 0, 0.58);
    transition: transform 0.42s cubic-bezier(0.16, 1, 0.3, 1);
}

/* 3. Front Hardcover Artwork Board (Tầng 1: Bìa cứng chính đổ bóng lên trang giấy) */
#storyCarouselStage .vibe-book-cover > img {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    border-radius: 4px 11px 11px 4px !important;
    z-index: 10 !important;
    transform: none !important;
    box-shadow:
        2.5px 3px 6px rgba(0, 0, 0, 0.72),
        1px 1px 0 rgba(0, 0, 0, 0.48) !important;
}

/* 4. Natural Translucent Hardcover Spine & French Hinge Groove */
#storyCarouselStage .vibe-book-spine {
    display: block !important;
    position: absolute;
    inset: 0 auto 0 0;
    width: 13px;
    border-radius: 4px 0 0 4px;
    z-index: 16;
    pointer-events: none;
    background: linear-gradient(90deg,
        rgba(0, 0, 0, 0.28) 0%,
        rgba(255, 255, 255, 0.34) 15%,
        rgba(255, 255, 255, 0.08) 42%,
        rgba(0, 0, 0, 0.26) 72%,
        rgba(0, 0, 0, 0.48) 84%,
        rgba(255, 255, 255, 0.28) 93%,
        transparent 100%
    ) !important;
}

/* 5. Crisp Hardcover Perimeter Bevel Highlight */
#storyCarouselStage .vibe-book-foil-frame {
    display: block !important;
    position: absolute;
    inset: 0;
    border-radius: 4px 11px 11px 4px;
    border: 1px solid rgba(255, 255, 255, 0.18) !important;
    box-shadow:
        inset 0 1.5px 0 rgba(255, 255, 255, 0.38),
        inset -1px 0 0 rgba(255, 255, 255, 0.22),
        inset 0 -1px 0 rgba(0, 0, 0, 0.48) !important;
    z-index: 18;
    pointer-events: none;
}

/* 6. Diagonal Matte Lamination Specular Sheen */
#storyCarouselStage .vibe-book-sheen {
    display: block !important;
    position: absolute;
    inset: 0;
    border-radius: 4px 11px 11px 4px;
    z-index: 17;
    pointer-events: none;
    background: linear-gradient(126deg,
        rgba(255, 255, 255, 0.22) 0%,
        rgba(255, 255, 255, 0.05) 34%,
        transparent 58%,
        rgba(0, 0, 0, 0.22) 100%
    ) !important;
}