
/* Lenis Smooth Scroll Recommended Config */
html.lenis {
  height: auto;
}

.lenis.lenis-smooth {
  scroll-behavior: auto !important;
}

.lenis.lenis-smooth [data-lenis-prevent] {
  overscroll-behavior: contain;
}

.lenis.lenis-stopped {
  overflow: hidden;
}

.lenis.lenis-scrolling iframe {
  pointer-events: none;
}

/* Premium Glassmorphism 2.0 */
.glass-card {
    background: rgba(255, 255, 255, 0.5);
    backdrop-filter: blur(25px) saturate(200%);
    -webkit-backdrop-filter: blur(25px) saturate(200%);
    border: 1px solid rgba(255, 255, 255, 0.4);
    box-shadow: 
        0 10px 30px rgba(255, 107, 129, 0.1),
        inset 0 0 0 1px rgba(255, 255, 255, 0.2);
    border-radius: 2.5rem;
    transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1);
}

.glass-card:hover {
    background: rgba(255, 255, 255, 0.6);
    transform: translateY(-5px);
    box-shadow: 0 20px 40px rgba(255, 107, 129, 0.15);
}

/* 3D Heart Pulse */
@keyframes heartPulse3D {
    0% { transform: scale(1) translateZ(0); filter: drop-shadow(0 0 10px rgba(255, 107, 129, 0.3)); }
    50% { transform: scale(1.1) translateZ(20px); filter: drop-shadow(0 0 30px rgba(255, 107, 129, 0.6)); }
    100% { transform: scale(1) translateZ(0); filter: drop-shadow(0 0 10px rgba(255, 107, 129, 0.3)); }
}

.heart-3d {
    perspective: 1000px;
    transform-style: preserve-3d;
    animation: heartPulse3D 2s infinite ease-in-out;
}

/* Envelopes for Secret Letters */
.envelope {
    position: relative;
    width: 280px;
    height: 180px;
    background: #fdfdfd;
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.5s cubic-bezier(0.68, -0.55, 0.265, 1.55);
    transform-style: preserve-3d;
}

.envelope::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 0;
    height: 0;
    border-left: 140px solid transparent;
    border-right: 140px solid transparent;
    border-top: 100px solid #ffdae0;
    z-index: 5;
    transition: all 0.5s ease;
    transform-origin: top;
}

.envelope.open::before {
    transform: rotateX(180deg);
    z-index: 1;
}

.letter-content {
    position: absolute;
    top: 10px;
    left: 10px;
    right: 10px;
    bottom: 10px;
    background: white;
    padding: 1.5rem;
    font-family: 'Mali', cursive;
    text-align: center;
    transform: translateZ(-1px);
    transition: all 0.5s ease;
    border-radius: 4px;
    box-shadow: inset 0 0 10px rgba(0,0,0,0.05);
}

.envelope.open .letter-content {
    transform: translateY(-80px) translateZ(10px);
    z-index: 10;
}

/* Horizontal Scroll Utilities */
.horizontal-scroll-container {
    display: flex;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    gap: 2rem;
    padding: 2rem;
    -ms-overflow-style: none;
    scrollbar-width: none;
}

.horizontal-scroll-container::-webkit-scrollbar {
    display: none;
}

.snap-item {
    flex-shrink: 0;
    width: 300px;
    scroll-snap-align: center;
}

/* Heart Burst Bloom */
.heart-bloom {
    position: fixed;
    pointer-events: none;
    font-size: 1.5rem;
    z-index: 3000;
}

/* Floating Hearts Fix */
.floating-heart {
    position: absolute;
    pointer-events: none;
    z-index: -1;
    filter: drop-shadow(0 4px 10px rgba(255, 107, 129, 0.2));
}

/* Floating Quotes */
.floating-quote {
    position: absolute;
    font-family: 'Mali', cursive;
    font-size: 0.9rem;
    color: #ff6b81;
    opacity: 0.3;
    pointer-events: none;
    white-space: nowrap;
}

/* Custom Scrollbar Premium */
::-webkit-scrollbar {
    width: 8px;
}

::-webkit-scrollbar-track {
    background: rgba(255, 218, 224, 0.2);
}

::-webkit-scrollbar-thumb {
    background: linear-gradient(to bottom, #ffdae0, #ff6b81);
    border-radius: 10px;
}

/* Vault Cards */
.vault-card {
    background: rgba(255, 255, 255, 0.4);
    backdrop-filter: blur(10px);
    border: 2px solid rgba(255, 255, 255, 0.5);
    border-radius: 2rem;
    padding: 2rem;
    text-align: center;
    cursor: pointer;
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    position: relative;
    overflow: hidden;
}

.vault-card:hover {
    transform: translateY(-10px) rotate(2deg);
    background: rgba(255, 107, 129, 0.1);
    border-color: #ff6b81;
    box-shadow: 0 15px 30px rgba(255, 107, 129, 0.2);
}

.vault-card::before {
    content: "🔒";
    position: absolute;
    top: 1rem;
    right: 1rem;
    font-size: 1.2rem;
    opacity: 0.5;
}

/* Modal Animations */
@keyframes modalIn {
    from { opacity: 0; transform: scale(0.9) translateY(20px); }
    to { opacity: 1; transform: scale(1) translateY(0); }
}

.animate-modal-in {
    animation: modalIn 0.5s cubic-bezier(0.23, 1, 0.32, 1) forwards;
}

/* Wheel Canvas Scaling */
#wheel-canvas {
    transition: transform 5s cubic-bezier(0.1, 0, 0.1, 1);
}

/* Cursor Trail Particle */
.cursor-particle {
    position: fixed;
    top: 0;
    left: 0;
    pointer-events: none;
    z-index: 9999;
    font-size: 1.2rem;
    filter: drop-shadow(0 0 5px rgba(255, 107, 129, 0.5));
}

/* Mirror Heart Shape Refined */
#mirror-video {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) scaleX(-1);
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 50%;
    /* clip-path: url(#heart-mask); Removed for better stability, heart shape can be applied to container if needed */
}
