/**
 * Love Page Templates CSS - 100 templates with unique visual designs
 * Each template has: unique decorations, card shape, text layout, animations
 */

/* ========== BASE ========== */
.love-page-content {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 40px 20px;
    position: relative;
    overflow: hidden;
}

.love-page-card {
    max-width: 700px;
    width: 100%;
    padding: 50px 40px;
    border-radius: 20px;
    position: relative;
    z-index: 2;
    text-align: center;
    animation: lp-card-appear 1s ease forwards;
}
@keyframes lp-card-appear {
    from { opacity: 0; transform: translateY(30px) scale(0.95); }
    to   { opacity: 1; transform: translateY(0) scale(1); }
}

.love-page-card .lp-title { font-size: 2.2em; font-weight: 700; margin-bottom: 10px; line-height: 1.3; }
.love-page-card .lp-subtitle { font-size: 1.3em; font-weight: 400; margin-bottom: 25px; opacity: 0.85; }
.love-page-card .lp-text { font-size: 1.15em; line-height: 1.8; margin-bottom: 25px; white-space: pre-line; }
.love-page-card .lp-sender { font-size: 1.1em; font-weight: 600; margin-top: 20px; opacity: 0.9; }
.love-page-card .lp-date-counter { margin-top: 20px; padding: 15px; border-radius: 12px; background: rgba(255,255,255,0.15); backdrop-filter: blur(5px); }
.love-page-card .lp-date-counter .counter-number { font-size: 2em; font-weight: 700; }
.love-page-card .lp-date-counter .counter-label { font-size: 0.9em; opacity: 0.8; }

/* Photos */
.love-page-card .lp-photos { display: flex; gap: 12px; justify-content: center; margin-bottom: 25px; flex-wrap: wrap; }
.love-page-card .lp-photos img { border-radius: 12px; object-fit: cover; box-shadow: 0 4px 15px rgba(0,0,0,0.2); max-width: 100%; }
.love-page-card .lp-photos.single-photo img { width: 100%; max-height: 400px; }
.love-page-card .lp-photos.two-photos img { width: calc(50% - 6px); max-height: 300px; }
.love-page-card .lp-photos.three-photos img { width: calc(33.33% - 8px); max-height: 250px; }

/* ========== LAYOUT VARIANTS ========== */
.layout-photo-top .lp-photos { margin-bottom: 30px; }

/* Photo Right */
.layout-photo-right .love-page-card { display: flex; gap: 25px; align-items: center; text-align: right; max-width: 900px; }
.layout-photo-right .lp-content-area { flex: 1; }
.layout-photo-right .lp-photos { flex: 0 0 280px; margin-bottom: 0; }
.layout-photo-right .lp-photos img { width: 280px; height: 300px; object-fit: cover; }

/* Photo Left */
.layout-photo-left .love-page-card { display: flex; flex-direction: row-reverse; gap: 25px; align-items: center; text-align: right; max-width: 900px; }
.layout-photo-left .lp-content-area { flex: 1; }
.layout-photo-left .lp-photos { flex: 0 0 280px; margin-bottom: 0; }
.layout-photo-left .lp-photos img { width: 280px; height: 300px; object-fit: cover; }

.layout-letter .love-page-card { max-width: 650px; padding: 60px 50px; text-align: right; border: 1px solid rgba(0,0,0,0.1); box-shadow: 0 10px 40px rgba(0,0,0,0.15); }
.layout-letter .lp-title { text-align: center; margin-bottom: 30px; padding-bottom: 20px; border-bottom: 2px solid currentColor; opacity: 0.7; }
.layout-letter .lp-text { font-size: 1.2em; line-height: 2; }
.layout-letter .lp-sender { text-align: left; margin-top: 30px; font-style: italic; }

.layout-story-timeline .love-page-card { max-width: 800px; text-align: right; }
.layout-story-timeline .lp-photos { position: relative; padding-right: 30px; }
.layout-story-timeline .lp-photos::before { content: ''; position: absolute; right: 10px; top: 0; bottom: 0; width: 3px; background: currentColor; opacity: 0.3; }

.layout-story-album .love-page-card { max-width: 850px; }
.layout-story-album .lp-photos img { border: 5px solid #fff; box-shadow: 0 4px 15px rgba(0,0,0,0.2); transform: rotate(var(--photo-rotation, 0deg)); }
.layout-story-album .lp-photos img:nth-child(1) { --photo-rotation: -3deg; }
.layout-story-album .lp-photos img:nth-child(2) { --photo-rotation: 2deg; }
.layout-story-album .lp-photos img:nth-child(3) { --photo-rotation: -1deg; }

/* Layout: photo-bottom */
.layout-photo-bottom .lp-photos {
    margin-top: 25px;
    margin-bottom: 0;
}

.layout-story-book .love-page-card { max-width: 700px; border: 1px solid rgba(0,0,0,0.08); box-shadow: 5px 5px 15px rgba(0,0,0,0.1), -2px -2px 10px rgba(0,0,0,0.05); text-align: right; }


/* ==========================================================================
   INDIVIDUAL TEMPLATE STYLES - each with unique visual identity
   ========================================================================== */

/* ===== LOVE (1-12) ===== */

/* 1: Sunset Romance - warm glow with animated sun rays */
.tpl-sunset-romance .love-page-card { background: rgba(0,0,0,0.25); backdrop-filter: blur(12px); border: 1px solid rgba(255,255,255,0.15); }
.tpl-sunset-romance::before { content: ''; position: absolute; top: -50%; left: -50%; width: 200%; height: 200%; background: conic-gradient(from 0deg, transparent, rgba(255,180,100,0.1), transparent, rgba(255,100,50,0.08), transparent); animation: tpl-sunray 15s linear infinite; z-index: 1; }
@keyframes tpl-sunray { to { transform: rotate(360deg); } }
.tpl-sunset-romance .lp-title { text-shadow: 0 2px 20px rgba(255,100,50,0.5); }

/* 2: Starry Night - animated twinkling stars + shooting star */
.tpl-starry-night .love-page-card { background: rgba(255,255,255,0.05); backdrop-filter: blur(5px); border: 1px solid rgba(255,255,255,0.1); border-radius: 30px; }
.tpl-starry-night::before { content: ''; position: absolute; inset: 0; z-index: 1; background: radial-gradient(1px 1px at 10% 20%, #fff, transparent), radial-gradient(2px 2px at 25% 60%, #ffd700, transparent), radial-gradient(1px 1px at 40% 15%, #fff, transparent), radial-gradient(2px 2px at 55% 75%, #fff, transparent), radial-gradient(1px 1px at 70% 35%, #ffd700, transparent), radial-gradient(2px 2px at 85% 55%, #fff, transparent), radial-gradient(1px 1px at 15% 85%, #fff, transparent), radial-gradient(2px 2px at 60% 45%, #ffd700, transparent), radial-gradient(1px 1px at 90% 15%, #fff, transparent), radial-gradient(1px 1px at 5% 50%, #fff, transparent); animation: tpl-twinkle 3s ease-in-out infinite alternate; pointer-events: none; }
.tpl-starry-night::after { content: ''; position: absolute; top: 20%; right: 10%; width: 100px; height: 2px; background: linear-gradient(90deg, #ffd700, transparent); transform: rotate(-30deg); animation: tpl-shoot 4s ease-in-out infinite; opacity: 0; z-index: 1; }
@keyframes tpl-twinkle { from { opacity: 0.4; } to { opacity: 1; } }
@keyframes tpl-shoot { 0%,90%,100% { opacity: 0; transform: rotate(-30deg) translateX(0); } 92% { opacity: 1; } 95% { opacity: 1; transform: rotate(-30deg) translateX(-200px); } 96% { opacity: 0; } }

/* 3: Roses & Hearts - floating hearts + petal border */
.tpl-roses-hearts .love-page-card { background: rgba(255,255,255,0.9); border: 3px solid transparent; border-image: repeating-linear-gradient(90deg, #f48fb1, #e91e63 10px, #f48fb1 20px) 3; border-radius: 0; box-shadow: 0 0 0 8px #fce4ec, 0 10px 40px rgba(233,30,99,0.15); }
.tpl-roses-hearts::before { content: '\2764\fe0f  \1f339  \2764\fe0f  \1f339  \2764\fe0f  \1f339  \2764\fe0f  \1f339  \2764\fe0f  \1f339'; position: absolute; top: 0; left: 0; right: 0; font-size: 1.5em; text-align: center; padding: 5px; z-index: 3; pointer-events: none; animation: tpl-marquee 20s linear infinite; white-space: nowrap; overflow: hidden; }
@keyframes tpl-marquee { from { transform: translateX(100%); } to { transform: translateX(-100%); } }

/* 4: Fire & Passion - pulsing ember glow */
.tpl-fire-passion .love-page-card { background: rgba(0,0,0,0.3); backdrop-filter: blur(8px); border: 2px solid rgba(255,82,82,0.4); animation: tpl-ember-glow 3s ease-in-out infinite alternate; }
@keyframes tpl-ember-glow { from { box-shadow: 0 0 20px rgba(255,82,82,0.3), 0 0 60px rgba(255,82,82,0.1); } to { box-shadow: 0 0 40px rgba(255,82,82,0.5), 0 0 100px rgba(255,82,82,0.2); } }
.tpl-fire-passion .lp-title { text-shadow: 0 0 20px rgba(255,82,82,0.8), 0 0 40px rgba(255,82,82,0.4); letter-spacing: 2px; }
.tpl-fire-passion .lp-text { border-right: 3px solid rgba(255,82,82,0.5); padding-right: 20px; text-align: right; }

/* 5: Ocean Love - wave animation at bottom */
.tpl-ocean-love .love-page-card { background: rgba(255,255,255,0.12); backdrop-filter: blur(10px); border: 1px solid rgba(255,255,255,0.2); border-radius: 25px; }
.tpl-ocean-love::after { content: ''; position: absolute; bottom: 0; left: 0; right: 0; height: 120px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 120'%3E%3Cpath fill='rgba(77,208,225,0.15)' d='M0,64L48,69.3C96,75,192,85,288,80C384,75,480,53,576,48C672,43,768,53,864,69.3C960,85,1056,107,1152,101.3C1248,96,1344,64,1392,48L1440,32L1440,120L0,120Z'/%3E%3C/svg%3E") no-repeat bottom; animation: tpl-wave 8s ease-in-out infinite alternate; z-index: 1; pointer-events: none; }
@keyframes tpl-wave { from { transform: translateX(-20px); } to { transform: translateX(20px); } }

/* 6: Wildflowers - decorative corner flourishes */
.tpl-wildflowers .love-page-card { background: rgba(255,255,255,0.92); border: 2px solid #81c784; border-radius: 5px; position: relative; }
.tpl-wildflowers .love-page-card::before,
.tpl-wildflowers .love-page-card::after { content: '\1f33c \1f33a \1f337'; position: absolute; font-size: 1.8em; opacity: 0.6; }
.tpl-wildflowers .love-page-card::before { top: 10px; right: 15px; }
.tpl-wildflowers .love-page-card::after { bottom: 10px; left: 15px; transform: scaleX(-1); }
.tpl-wildflowers .lp-title { color: #2e7d32; font-style: italic; }

/* 7: Gold Luxury - double gold border + embossed text */
.tpl-gold-luxury .love-page-card { background: rgba(10,10,30,0.6); border: 2px solid #ffd700; box-shadow: inset 0 0 0 5px rgba(10,10,30,0.8), inset 0 0 0 7px rgba(255,215,0,0.3), 0 20px 60px rgba(0,0,0,0.4); border-radius: 5px; }
.tpl-gold-luxury .lp-title { text-transform: uppercase; letter-spacing: 5px; font-size: 1.8em; text-shadow: 0 1px 0 #cda000, 0 2px 0 #b89500, 0 3px 5px rgba(0,0,0,0.3); }
.tpl-gold-luxury .lp-subtitle { letter-spacing: 8px; font-size: 0.9em; text-transform: uppercase; border-top: 1px solid rgba(255,215,0,0.3); border-bottom: 1px solid rgba(255,215,0,0.3); padding: 10px 0; display: inline-block; }

/* 8: Pink Clouds - floating cloud shapes */
.tpl-pink-clouds .love-page-card { background: rgba(255,255,255,0.75); backdrop-filter: blur(15px); border-radius: 40px; border: none; box-shadow: 0 20px 60px rgba(252,228,236,0.5); }
.tpl-pink-clouds::before,
.tpl-pink-clouds::after { content: ''; position: absolute; border-radius: 50%; background: rgba(255,255,255,0.3); z-index: 1; pointer-events: none; }
.tpl-pink-clouds::before { width: 200px; height: 80px; top: 10%; left: -5%; animation: tpl-cloud-float 12s ease-in-out infinite alternate; }
.tpl-pink-clouds::after { width: 150px; height: 60px; bottom: 15%; right: -3%; animation: tpl-cloud-float 10s ease-in-out infinite alternate-reverse; }
@keyframes tpl-cloud-float { from { transform: translateX(0); } to { transform: translateX(40px); } }

/* 9: Minimal White - clean with accent line */
.tpl-minimal-white .love-page-card { background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,0.08); border: none; border-radius: 0; padding: 60px 50px; }
.tpl-minimal-white .lp-title { font-weight: 300; font-size: 2.5em; letter-spacing: -1px; }
.tpl-minimal-white .lp-title::after { content: ''; display: block; width: 60px; height: 3px; background: #e91e63; margin: 15px auto 0; }
.tpl-minimal-white .lp-text { text-align: right; max-width: 500px; margin: 0 auto 25px; }
.tpl-minimal-white .lp-sender { font-weight: 300; letter-spacing: 2px; text-transform: uppercase; font-size: 0.9em; }

/* 10: Royal Purple - velvet curtain effect */
.tpl-royal-purple .love-page-card { background: rgba(74,20,140,0.3); backdrop-filter: blur(8px); border: 1px solid rgba(225,190,231,0.3); }
.tpl-royal-purple::before { content: ''; position: absolute; inset: 0; background: repeating-linear-gradient(90deg, rgba(74,20,140,0.03), rgba(74,20,140,0.06) 2px, transparent 2px, transparent 4px); z-index: 1; pointer-events: none; }
.tpl-royal-purple .lp-title { font-size: 2.5em; text-shadow: 0 2px 10px rgba(0,0,0,0.3); }
.tpl-royal-purple .lp-date-counter { background: rgba(156,39,176,0.3); border: 1px solid rgba(225,190,231,0.2); }

/* 11: Morning Love - warm glow circle */
.tpl-morning-love .love-page-card { background: rgba(255,255,255,0.7); backdrop-filter: blur(10px); border-radius: 50% 50% 30px 30px / 20% 20% 30px 30px; padding: 70px 40px 50px; }
.tpl-morning-love::before { content: ''; position: absolute; top: -60px; left: 50%; transform: translateX(-50%); width: 120px; height: 120px; background: radial-gradient(circle, rgba(255,200,0,0.4), rgba(255,150,0,0.2), transparent 70%); border-radius: 50%; z-index: 1; animation: tpl-sun-pulse 4s ease-in-out infinite; }
@keyframes tpl-sun-pulse { 0%,100% { transform: translateX(-50%) scale(1); opacity: 0.8; } 50% { transform: translateX(-50%) scale(1.2); opacity: 1; } }

/* 12: Floating Hearts - hearts rain animation */
.tpl-floating-hearts .love-page-card { background: rgba(255,255,255,0.88); border: 2px solid #f48fb1; border-radius: 20px; }
.tpl-floating-hearts::before,
.tpl-floating-hearts::after { content: ''; position: absolute; inset: 0; z-index: 1; pointer-events: none; }
.tpl-floating-hearts::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23e91e6322'%3E%3Cpath d='M12 21.35l-1.45-1.32C5.4 15.36 2 12.28 2 8.5 2 5.42 4.42 3 7.5 3c1.74 0 3.41.81 4.5 2.09C13.09 3.81 14.76 3 16.5 3 19.58 3 22 5.42 22 8.5c0 3.78-3.4 6.86-8.55 11.54L12 21.35z'/%3E%3C/svg%3E"); background-size: 35px; animation: tpl-hearts-fall 25s linear infinite; }
.tpl-floating-hearts::after { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23e91e6315'%3E%3Cpath d='M12 21.35l-1.45-1.32C5.4 15.36 2 12.28 2 8.5 2 5.42 4.42 3 7.5 3c1.74 0 3.41.81 4.5 2.09C13.09 3.81 14.76 3 16.5 3 19.58 3 22 5.42 22 8.5c0 3.78-3.4 6.86-8.55 11.54L12 21.35z'/%3E%3C/svg%3E"); background-size: 55px; animation: tpl-hearts-fall 35s linear infinite reverse; }
@keyframes tpl-hearts-fall { from { background-position: 0 -100px; } to { background-position: 80px 800px; } }


/* ===== PROPOSAL (13-22) ===== */

/* 13: Diamond Ring - sparkle burst + elegant frame */
.tpl-diamond-ring .love-page-card { background: rgba(255,255,255,0.06); border: 2px solid rgba(200,200,200,0.4); box-shadow: 0 0 0 1px rgba(255,255,255,0.1), 0 20px 60px rgba(0,0,0,0.3); }
.tpl-diamond-ring .lp-title::after { content: ' \1f48d'; }
.tpl-diamond-ring::before { content: '\2728'; position: absolute; top: 15%; right: 15%; font-size: 2em; animation: tpl-diamond-sparkle 2s ease-in-out infinite; z-index: 3; }
@keyframes tpl-diamond-sparkle { 0%,100% { opacity: 0.3; transform: scale(0.8) rotate(0deg); } 50% { opacity: 1; transform: scale(1.2) rotate(20deg); } }

/* 14: Stars Chuppah - golden arch + star field */
.tpl-stars-chuppah .love-page-card { background: rgba(255,215,0,0.06); border: 1px solid rgba(255,215,0,0.4); border-radius: 5px 5px 30px 30px; }
.tpl-stars-chuppah::before { content: ''; position: absolute; top: 0; left: 10%; right: 10%; height: 4px; background: linear-gradient(90deg, transparent, #ffd700, transparent); z-index: 3; }
.tpl-stars-chuppah .lp-title { text-shadow: 0 0 30px rgba(255,215,0,0.6); font-size: 2.5em; }

/* 15: Rose Garden - photo-top with petal rain */
.tpl-rose-garden .love-page-card { background: rgba(255,255,255,0.93); border: none; box-shadow: 0 10px 40px rgba(233,30,99,0.1); }
.tpl-rose-garden::before { content: '\1f339  \1f33a  \1f33b  \1f33c  \1f337'; position: absolute; top: 0; left: 0; right: 0; font-size: 2em; text-align: center; z-index: 3; pointer-events: none; filter: drop-shadow(0 2px 3px rgba(0,0,0,0.1)); }
.tpl-rose-garden .lp-title { margin-top: 15px; }

/* 16: Champagne Gold - bubbles rising */
.tpl-champagne-gold .love-page-card { background: rgba(255,255,255,0.88); border: 2px solid rgba(191,143,0,0.4); }
.tpl-champagne-gold::before { content: ''; position: absolute; inset: 0; background: radial-gradient(3px 3px at 20% 80%, rgba(255,215,0,0.4), transparent), radial-gradient(2px 2px at 40% 70%, rgba(255,215,0,0.3), transparent), radial-gradient(4px 4px at 60% 90%, rgba(255,215,0,0.35), transparent), radial-gradient(2px 2px at 80% 75%, rgba(255,215,0,0.3), transparent), radial-gradient(3px 3px at 30% 85%, rgba(255,215,0,0.4), transparent); animation: tpl-bubbles 6s ease-in-out infinite; z-index: 1; pointer-events: none; }
@keyframes tpl-bubbles { 0% { transform: translateY(0); opacity: 1; } 100% { transform: translateY(-100px); opacity: 0; } }

/* 17: Romantic Beach - sand texture at bottom */
.tpl-romantic-beach .love-page-card { background: rgba(255,255,255,0.85); backdrop-filter: blur(8px); border-radius: 20px 20px 0 0; border-bottom: 4px solid #d4a574; }
.tpl-romantic-beach::after { content: ''; position: absolute; bottom: 0; left: 0; right: 0; height: 60px; background: linear-gradient(180deg, transparent, rgba(210,165,116,0.3)); z-index: 1; pointer-events: none; }

/* 18: Classic White - neumorphism */
.tpl-classic-white .love-page-card { background: #f5f5f5; border: none; box-shadow: 8px 8px 16px rgba(0,0,0,0.1), -8px -8px 16px rgba(255,255,255,0.8); border-radius: 25px; }
.tpl-classic-white .lp-title::after { content: ''; display: block; width: 80px; height: 2px; background: #9c27b0; margin: 15px auto 0; }
.tpl-classic-white .lp-date-counter { box-shadow: inset 4px 4px 8px rgba(0,0,0,0.08), inset -4px -4px 8px rgba(255,255,255,0.6); background: #f0f0f0; }

/* 19: Enchanted Forest - firefly dots */
.tpl-enchanted-forest .love-page-card { background: rgba(0,0,0,0.25); backdrop-filter: blur(8px); border: 1px solid rgba(255,215,0,0.2); }
.tpl-enchanted-forest::before { content: ''; position: absolute; inset: 0; z-index: 1; pointer-events: none; background: radial-gradient(3px 3px at 15% 25%, rgba(255,255,100,0.6), transparent 20px), radial-gradient(3px 3px at 45% 65%, rgba(255,255,100,0.5), transparent 20px), radial-gradient(3px 3px at 75% 35%, rgba(255,255,100,0.6), transparent 20px), radial-gradient(3px 3px at 25% 80%, rgba(255,255,100,0.4), transparent 20px), radial-gradient(3px 3px at 85% 75%, rgba(255,255,100,0.5), transparent 20px); animation: tpl-firefly 4s ease-in-out infinite alternate; }
@keyframes tpl-firefly { from { opacity: 0.3; } to { opacity: 1; } }

/* 20: Paris Love - elegant with Eiffel silhouette hint */
.tpl-paris-love .love-page-card { background: #fff; box-shadow: 0 10px 40px rgba(0,0,0,0.1); border-right: 5px double #c62828; border-left: 5px double #c62828; border-radius: 0; }
.tpl-paris-love .lp-title { font-style: italic; letter-spacing: 1px; }
.tpl-paris-love .lp-sender::before { content: '\2764\fe0f  '; }

/* 21: Red Gold Royal - ornate corners */
.tpl-red-gold-royal .love-page-card { background: rgba(0,0,0,0.25); border: 3px double rgba(255,215,0,0.5); border-radius: 5px; }
.tpl-red-gold-royal .love-page-card::before,
.tpl-red-gold-royal .love-page-card::after { content: '\2726'; position: absolute; font-size: 2em; color: #ffd700; }
.tpl-red-gold-royal .love-page-card::before { top: 8px; right: 12px; }
.tpl-red-gold-royal .love-page-card::after { bottom: 8px; left: 12px; }

/* 22: Confetti Joy - scattered confetti dots */
.tpl-confetti-joy .love-page-card { background: rgba(255,255,255,0.93); border: none; border-radius: 25px; overflow: hidden; }
.tpl-confetti-joy::before { content: ''; position: absolute; inset: 0; z-index: 1; pointer-events: none; background: radial-gradient(4px 4px at 10% 15%, #e91e63, transparent), radial-gradient(3px 3px at 25% 8%, #ffd700, transparent), radial-gradient(4px 4px at 45% 12%, #4caf50, transparent), radial-gradient(3px 3px at 65% 5%, #2196f3, transparent), radial-gradient(4px 4px at 80% 10%, #ff9800, transparent), radial-gradient(3px 3px at 90% 18%, #9c27b0, transparent), radial-gradient(4px 4px at 15% 90%, #e91e63, transparent), radial-gradient(3px 3px at 35% 95%, #ffd700, transparent), radial-gradient(4px 4px at 55% 88%, #4caf50, transparent), radial-gradient(3px 3px at 75% 92%, #2196f3, transparent); }


/* ===== ANNIVERSARY (23-32) ===== */

/* 23: Classic Gold - glowing gold frame */
.tpl-classic-gold .love-page-card { background: rgba(10,10,30,0.5); border: 2px solid #ffd700; box-shadow: 0 0 15px rgba(255,215,0,0.2), inset 0 0 15px rgba(255,215,0,0.05); }
.tpl-classic-gold .lp-title { text-shadow: 0 0 10px rgba(255,215,0,0.5); letter-spacing: 3px; }

/* 24: Silver White - frosted glass with silver edge */
.tpl-silver-white .love-page-card { background: rgba(255,255,255,0.85); border: none; box-shadow: 0 0 0 2px #b0bec5, 0 0 0 5px rgba(176,190,197,0.3), 0 15px 35px rgba(0,0,0,0.1); border-radius: 15px; }
.tpl-silver-white .lp-photos img { border: 3px solid #cfd8dc; }

/* 25: Ruby Red - deep red glow */
.tpl-ruby-red .love-page-card { background: rgba(0,0,0,0.35); backdrop-filter: blur(8px); border: 1px solid rgba(255,82,82,0.3); box-shadow: 0 0 30px rgba(183,28,28,0.3); }
.tpl-ruby-red .lp-title { text-shadow: 0 0 20px rgba(255,205,210,0.5); }

/* 26: Sapphire Blue - elegant with top/bottom bars */
.tpl-sapphire-blue .love-page-card { background: rgba(255,255,255,0.08); border-top: 4px solid #ffd700; border-bottom: 4px solid #ffd700; border-left: 1px solid rgba(255,215,0,0.2); border-right: 1px solid rgba(255,215,0,0.2); border-radius: 0; }

/* 27: Years of Love - big number styling */
.tpl-years-of-love .love-page-card { background: rgba(255,255,255,0.9); border: 2px solid #e91e63; border-radius: 50% / 10%; }
.tpl-years-of-love .lp-date-counter { background: linear-gradient(135deg, #e91e63, #c2185b); color: #fff; border-radius: 20px; }
.tpl-years-of-love .lp-date-counter .counter-number { font-size: 3em; }

/* 28: Vintage Romance - aged paper effect */
.tpl-vintage-romance .love-page-card { background: linear-gradient(180deg, #efebe9, #d7ccc8); border: none; box-shadow: 3px 3px 10px rgba(0,0,0,0.2), -1px -1px 5px rgba(0,0,0,0.1); border-radius: 2px; position: relative; }
.tpl-vintage-romance .love-page-card::before { content: ''; position: absolute; inset: 0; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100'%3E%3Crect fill='%23d7ccc811' width='100' height='100'/%3E%3Crect fill='%23bcaaa411' x='25' y='25' width='50' height='50' rx='5'/%3E%3C/svg%3E"); opacity: 0.3; pointer-events: none; }
.tpl-vintage-romance .lp-title { font-style: italic; }
.tpl-vintage-romance .lp-photos img { filter: sepia(20%); border: 4px solid #fff; box-shadow: 2px 2px 8px rgba(0,0,0,0.3); }

/* 29: Emerald Green - jewel glow */
.tpl-emerald-green .love-page-card { background: rgba(0,0,0,0.2); backdrop-filter: blur(8px); border: 2px solid rgba(0,200,83,0.4); box-shadow: 0 0 20px rgba(0,137,123,0.2), inset 0 0 20px rgba(0,137,123,0.05); }

/* 30: Pearl White - soft with pearl shimmer */
.tpl-pearl-white .love-page-card { background: linear-gradient(135deg, #fafafa, #f5f0eb, #fafafa, #f0ebe5, #fafafa); background-size: 200% 200%; animation: tpl-pearl-shimmer 8s ease infinite; border: 1px solid #e0d8d0; box-shadow: 0 10px 30px rgba(0,0,0,0.06); }
@keyframes tpl-pearl-shimmer { 0% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } 100% { background-position: 0% 50%; } }

/* 31: Couple Sunset - warm with horizon line */
.tpl-couple-sunset .love-page-card { background: rgba(255,255,255,0.75); backdrop-filter: blur(10px); border-bottom: 4px solid #ff6f00; }
.tpl-couple-sunset::after { content: ''; position: absolute; bottom: 30%; left: 0; right: 0; height: 2px; background: linear-gradient(90deg, transparent, rgba(255,111,0,0.3), transparent); z-index: 1; pointer-events: none; }

/* 32: Pink Gold - gradient border */
.tpl-pink-gold .love-page-card { background: rgba(255,255,255,0.9); border: 3px solid transparent; background-clip: padding-box; box-shadow: 0 0 0 3px #fce4ec, 0 0 0 6px rgba(191,143,0,0.3); }


/* ===== BIRTHDAY (33-42) ===== */

/* 33: Colorful Balloons - floating circles */
.tpl-colorful-balloons .love-page-card { background: rgba(255,255,255,0.88); border-radius: 25px; border: none; box-shadow: 0 15px 40px rgba(0,0,0,0.1); }
.tpl-colorful-balloons::before { content: ''; position: absolute; z-index: 1; pointer-events: none; top: 0; left: 5%; width: 30px; height: 30px; background: #e91e63; border-radius: 50%; box-shadow: 40px -20px 0 15px #4caf50, 90px -10px 0 10px #ffd700, 150px -30px 0 20px #2196f3, 210px -15px 0 12px #ff9800, 270px -25px 0 18px #9c27b0; animation: tpl-balloon-float 6s ease-in-out infinite alternate; }
@keyframes tpl-balloon-float { from { transform: translateY(0); } to { transform: translateY(-15px); } }

/* 34: Birthday Cake - tiered cake look */
.tpl-birthday-cake .love-page-card { background: rgba(255,255,255,0.85); border-radius: 10px 10px 30px 30px; border: 2px solid #f48fb1; border-top: 6px solid #e91e63; }
.tpl-birthday-cake::before { content: '\1f382 \1f381 \1f388 \1f389'; position: absolute; top: -25px; left: 50%; transform: translateX(-50%); font-size: 2em; z-index: 3; text-shadow: 0 2px 5px rgba(0,0,0,0.2); }

/* 35: Shining Stars - rotating star field */
.tpl-shining-stars .love-page-card { background: rgba(255,255,255,0.06); border: 1px solid rgba(255,215,0,0.3); border-radius: 20px; }
.tpl-shining-stars::before { content: ''; position: absolute; inset: -50%; background: radial-gradient(2px 2px at 20% 30%, #ffd700, transparent), radial-gradient(3px 3px at 50% 60%, #fff, transparent), radial-gradient(2px 2px at 80% 20%, #ffd700, transparent), radial-gradient(2px 2px at 30% 80%, #fff, transparent), radial-gradient(3px 3px at 70% 50%, #ffd700, transparent); animation: tpl-star-rotate 30s linear infinite; z-index: 1; pointer-events: none; }
@keyframes tpl-star-rotate { to { transform: rotate(360deg); } }

/* 36: Gold Confetti - top confetti bar */
.tpl-gold-confetti .love-page-card { background: #fff; border: none; border-top: 3px solid #ffd700; box-shadow: 0 10px 30px rgba(0,0,0,0.08); }
.tpl-gold-confetti .lp-title::before { content: '\1f389 '; }
.tpl-gold-confetti .lp-title::after { content: ' \1f389'; }

/* 37: Rainbow - colorful border gradient */
.tpl-rainbow .love-page-card { background: rgba(0,0,0,0.25); backdrop-filter: blur(12px); border: 3px solid transparent; border-image: linear-gradient(135deg, #ff6b6b, #ffa726, #ffee58, #66bb6a, #42a5f5, #7e57c2) 1; border-radius: 0; }
.tpl-rainbow .lp-title { background: linear-gradient(90deg, #ff6b6b, #ffa726, #66bb6a, #42a5f5, #7e57c2); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; font-size: 2.5em; }

/* 38: Sweet Pink - dotted frame */
.tpl-sweet-pink .love-page-card { background: rgba(255,255,255,0.88); border: 3px dotted #f48fb1; border-radius: 30px; }

/* 39: Party Purple - rotating glow */
.tpl-party-purple .love-page-card { background: rgba(255,255,255,0.08); backdrop-filter: blur(8px); border: 1px solid rgba(255,215,0,0.3); }
.tpl-party-purple::before { content: ''; position: absolute; inset: -2px; background: conic-gradient(#9c27b0, #e91e63, #ffd700, #4caf50, #2196f3, #9c27b0); border-radius: 22px; z-index: -1; animation: tpl-rotate-border 6s linear infinite; filter: blur(8px); opacity: 0.5; }
@keyframes tpl-rotate-border { to { transform: rotate(360deg); } }

/* 40: Natural Green - leaf pattern */
.tpl-natural-green .love-page-card { background: rgba(255,255,255,0.88); border: 2px solid #a5d6a7; border-radius: 20px; }
.tpl-natural-green .love-page-card::before { content: '\1f33f'; position: absolute; top: 15px; right: 20px; font-size: 2.5em; opacity: 0.3; }
.tpl-natural-green .love-page-card::after { content: '\1f33f'; position: absolute; bottom: 15px; left: 20px; font-size: 2.5em; opacity: 0.3; transform: rotate(180deg); }

/* 41: Black & Gold - dramatic split */
.tpl-black-gold .love-page-card { background: linear-gradient(135deg, #212121 0%, #212121 50%, #1a1a1a 50%, #1a1a1a 100%); border: 2px solid #ffd700; box-shadow: 0 0 30px rgba(255,215,0,0.15); }
.tpl-black-gold .lp-title { font-size: 2.5em; text-shadow: 0 0 15px rgba(255,215,0,0.5); letter-spacing: 2px; }

/* 42: Blue Sky - gradient overlay with top clouds */
.tpl-blue-sky .love-page-card { background: rgba(255,255,255,0.8); backdrop-filter: blur(10px); border-radius: 25px; border: none; }
.tpl-blue-sky::before { content: '\2601\fe0f  \2601\fe0f  \2601\fe0f'; position: absolute; top: 5%; font-size: 3em; opacity: 0.15; width: 100%; text-align: center; z-index: 1; pointer-events: none; }


/* ===== APOLOGY (43-50) ===== */

/* 43: Gentle Rain - raindrop lines */
.tpl-gentle-rain .love-page-card { background: rgba(255,255,255,0.75); backdrop-filter: blur(10px); border: none; border-radius: 20px; }
.tpl-gentle-rain::before { content: ''; position: absolute; inset: 0; background: repeating-linear-gradient(180deg, transparent, transparent 20px, rgba(120,144,156,0.05) 20px, rgba(120,144,156,0.05) 21px); z-index: 1; pointer-events: none; animation: tpl-rain-fall 2s linear infinite; }
@keyframes tpl-rain-fall { from { background-position: 0 0; } to { background-position: 0 21px; } }

/* 44: After Rain - rainbow arc at top */
.tpl-after-rain .love-page-card { background: rgba(255,255,255,0.85); backdrop-filter: blur(8px); border-radius: 20px; border: none; }
.tpl-after-rain::before { content: ''; position: absolute; top: -40px; left: 10%; right: 10%; height: 80px; border-radius: 50% 50% 0 0; border: 4px solid transparent; border-top-color: transparent; background: linear-gradient(180deg, rgba(255,0,0,0.1), rgba(255,165,0,0.1), rgba(255,255,0,0.1), rgba(0,128,0,0.1), rgba(0,0,255,0.1)) border-box; -webkit-mask: linear-gradient(#fff 0 0) padding-box, linear-gradient(#fff 0 0); mask-composite: exclude; z-index: 3; pointer-events: none; opacity: 0.5; }

/* 45: Calm Lavender - soft blur circles */
.tpl-calm-lavender .love-page-card { background: rgba(255,255,255,0.85); border: 1px solid #9fa8da; border-radius: 25px; }
.tpl-calm-lavender::before,
.tpl-calm-lavender::after { content: ''; position: absolute; border-radius: 50%; filter: blur(40px); z-index: 0; pointer-events: none; }
.tpl-calm-lavender::before { width: 200px; height: 200px; top: -50px; right: -50px; background: rgba(159,168,218,0.3); }
.tpl-calm-lavender::after { width: 150px; height: 150px; bottom: -30px; left: -30px; background: rgba(206,147,216,0.2); }

/* 46: Olive Branch - centered olive branch icon + peace vibe */
.tpl-olive-branch .love-page-card { background: rgba(255,255,255,0.9); border: 2px solid #aed581; border-radius: 15px; }
.tpl-olive-branch .lp-title::before { content: '\1f54a\fe0f '; }
.tpl-olive-branch .lp-text { border-right: 3px solid #aed581; padding-right: 20px; text-align: right; }

/* 47: Quiet Blue - minimal with blue underline */
.tpl-quiet-blue .love-page-card { background: rgba(255,255,255,0.88); border: none; border-bottom: 4px solid #42a5f5; border-radius: 15px 15px 0 0; box-shadow: 0 10px 30px rgba(0,0,0,0.08); }

/* 48: Healing Heart - split mend effect */
.tpl-healing-heart .love-page-card { background: rgba(255,255,255,0.92); border: 1px solid #e0e0e0; border-radius: 20px; overflow: hidden; }
.tpl-healing-heart::before { content: ''; position: absolute; top: 0; left: 50%; bottom: 0; width: 2px; background: linear-gradient(180deg, transparent, rgba(233,30,99,0.3), rgba(233,30,99,0.5), rgba(233,30,99,0.3), transparent); z-index: 1; pointer-events: none; }

/* 49: New Dawn - gradient light beam */
.tpl-new-dawn .love-page-card { background: rgba(255,255,255,0.15); backdrop-filter: blur(10px); border: 1px solid rgba(255,255,255,0.2); border-radius: 20px; }
.tpl-new-dawn::before { content: ''; position: absolute; top: 0; left: 50%; transform: translateX(-50%); width: 60%; height: 100%; background: linear-gradient(180deg, rgba(255,204,128,0.15), transparent 50%); z-index: 1; pointer-events: none; }

/* 50: Soft Mist - blurred edges */
.tpl-soft-mist .love-page-card { background: rgba(255,255,255,0.95); box-shadow: 0 0 40px rgba(0,0,0,0.05); border: none; border-radius: 30px; }
.tpl-soft-mist .lp-title { font-weight: 300; font-size: 2.3em; }


/* ===== THANKS (51-58) ===== */

/* 51: Warm Sun - radial sun glow behind card */
.tpl-warm-sun .love-page-card { background: rgba(255,255,255,0.8); backdrop-filter: blur(8px); border-radius: 25px; border: none; }
.tpl-warm-sun::before { content: ''; position: absolute; top: -100px; left: 50%; transform: translateX(-50%); width: 400px; height: 400px; background: radial-gradient(circle, rgba(255,213,79,0.4), rgba(255,167,38,0.2), transparent 60%); border-radius: 50%; z-index: 0; pointer-events: none; }

/* 52: Garden Flowers - flower emoji corners */
.tpl-garden-flowers .love-page-card { background: rgba(255,255,255,0.88); border: 2px solid #a5d6a7; border-radius: 20px; }
.tpl-garden-flowers .love-page-card::before { content: '\1f33a \1f337 \1f33c'; position: absolute; top: 8px; right: 12px; font-size: 1.5em; }
.tpl-garden-flowers .love-page-card::after { content: '\1f33b \1f339 \1f338'; position: absolute; bottom: 8px; left: 12px; font-size: 1.5em; }

/* 53: Grateful Heart - centered large heart bg */
.tpl-grateful-heart .love-page-card { background: rgba(255,255,255,0.4); backdrop-filter: blur(10px); border-radius: 20px; border: none; }
.tpl-grateful-heart::before { content: '\2764\fe0f'; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); font-size: 15em; opacity: 0.04; z-index: 0; pointer-events: none; }

/* 54: Coffee Cup - warm dashes border */
.tpl-coffee-cup .love-page-card { background: rgba(255,255,255,0.85); border: 2px dashed #8d6e63; border-radius: 15px; }
.tpl-coffee-cup .lp-title::before { content: '\2615 '; }

/* 55: Grateful Green - left accent bar */
.tpl-grateful-green .love-page-card { background: rgba(255,255,255,0.88); border: none; border-right: 5px solid #4caf50; border-radius: 0 15px 15px 0; box-shadow: 0 10px 30px rgba(0,0,0,0.08); text-align: right; }

/* 56: Color Burst - multi-color shadow */
.tpl-color-burst .love-page-card { background: rgba(255,255,255,0.93); border: none; border-radius: 20px; box-shadow: 5px 5px 0 #fce4ec, -5px -5px 0 #e8f5e9, 5px -5px 0 #fff3e0, -5px 5px 0 #e1f5fe; }

/* 57: Gold Star - star-shaped glow */
.tpl-gold-star .love-page-card { background: rgba(255,215,0,0.06); border: 2px solid rgba(255,215,0,0.4); border-radius: 15px; }
.tpl-gold-star::before { content: '\2b50'; position: absolute; top: -15px; left: 50%; transform: translateX(-50%); font-size: 2em; z-index: 3; filter: drop-shadow(0 0 10px rgba(255,215,0,0.6)); }

/* 58: Warm Hug - rounded with warm gradient border */
.tpl-warm-hug .love-page-card { background: rgba(255,255,255,0.6); backdrop-filter: blur(10px); border: 3px solid transparent; background-clip: padding-box; box-shadow: 0 0 0 3px rgba(255,112,67,0.3); border-radius: 25px; }


/* ===== MISSING (59-66) ===== */

/* 59: Moon Night - moon glow + stars */
.tpl-moon-night .love-page-card { background: rgba(255,255,255,0.06); backdrop-filter: blur(8px); border: 1px solid rgba(255,215,0,0.2); border-radius: 20px; }
.tpl-moon-night::before { content: '\1f319'; position: absolute; top: 20px; left: 30px; font-size: 3em; z-index: 3; filter: drop-shadow(0 0 20px rgba(255,215,0,0.5)); pointer-events: none; }
.tpl-moon-night::after { content: ''; position: absolute; inset: 0; background: radial-gradient(1px 1px at 20% 30%, rgba(255,255,255,0.6), transparent), radial-gradient(1px 1px at 50% 70%, rgba(255,255,255,0.5), transparent), radial-gradient(1px 1px at 80% 20%, rgba(255,255,255,0.6), transparent), radial-gradient(1px 1px at 10% 60%, rgba(255,255,255,0.4), transparent), radial-gradient(1px 1px at 70% 80%, rgba(255,255,255,0.5), transparent); z-index: 1; pointer-events: none; }

/* 60: Star Distance - space void with connection line */
.tpl-star-distance .love-page-card { background: rgba(255,255,255,0.05); border: 1px solid rgba(100,181,246,0.3); border-radius: 15px; }
.tpl-star-distance::before { content: ''; position: absolute; top: 50%; left: 5%; right: 5%; height: 1px; background: linear-gradient(90deg, rgba(100,181,246,0.5), transparent 30%, transparent 70%, rgba(100,181,246,0.5)); z-index: 1; pointer-events: none; }
.tpl-star-distance .lp-title { letter-spacing: 5px; }

/* 61: Sea Longing - wave layers */
.tpl-sea-longing .love-page-card { background: rgba(255,255,255,0.12); backdrop-filter: blur(8px); border: none; border-radius: 20px; }
.tpl-sea-longing::after { content: ''; position: absolute; bottom: 0; left: 0; right: 0; height: 80px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 80'%3E%3Cpath fill='rgba(79,195,247,0.15)' d='M0,40L60,35C120,30,240,20,360,25C480,30,600,50,720,53C840,57,960,43,1080,38C1200,33,1320,37,1380,39L1440,40V80H0Z'/%3E%3C/svg%3E") no-repeat bottom; z-index: 1; pointer-events: none; }

/* 62: Rainy Window - droplet effect */
.tpl-rainy-window .love-page-card { background: rgba(255,255,255,0.1); backdrop-filter: blur(12px); border: 1px solid rgba(255,255,255,0.15); border-radius: 20px; }
.tpl-rainy-window::before { content: ''; position: absolute; inset: 0; background: radial-gradient(5px 5px at 15% 25%, rgba(255,255,255,0.15), transparent), radial-gradient(4px 4px at 35% 55%, rgba(255,255,255,0.12), transparent), radial-gradient(6px 6px at 55% 15%, rgba(255,255,255,0.1), transparent), radial-gradient(5px 5px at 75% 65%, rgba(255,255,255,0.13), transparent), radial-gradient(4px 4px at 25% 80%, rgba(255,255,255,0.11), transparent), radial-gradient(5px 5px at 85% 35%, rgba(255,255,255,0.14), transparent); z-index: 1; pointer-events: none; border-radius: 20px; }

/* 63: Long Road - vanishing perspective lines */
.tpl-long-road .love-page-card { background: rgba(255,255,255,0.8); backdrop-filter: blur(8px); border-radius: 20px; border: none; }
.tpl-long-road::before { content: ''; position: absolute; bottom: 0; left: 50%; width: 0; height: 0; border-left: 300px solid transparent; border-right: 300px solid transparent; border-bottom: 100px solid rgba(0,0,0,0.03); transform: translateX(-50%); z-index: 0; pointer-events: none; }

/* 64: Purple Longing - glowing purple edges */
.tpl-purple-longing .love-page-card { background: rgba(255,255,255,0.08); border: 1px solid rgba(206,147,216,0.4); border-radius: 20px; box-shadow: 0 0 20px rgba(123,31,162,0.2), inset 0 0 20px rgba(123,31,162,0.05); }

/* 65: Lonely Sunset - horizontal gradient band */
.tpl-lonely-sunset .love-page-card { background: rgba(0,0,0,0.2); backdrop-filter: blur(10px); border: none; border-radius: 20px; }
.tpl-lonely-sunset::before { content: ''; position: absolute; top: 40%; left: 0; right: 0; height: 3px; background: linear-gradient(90deg, transparent, rgba(255,200,0,0.5), rgba(255,100,0,0.5), transparent); z-index: 1; pointer-events: none; }

/* 66: Distant Hug - soft overlapping circles */
.tpl-distant-hug .love-page-card { background: rgba(255,255,255,0.75); border: 1px solid #ce93d8; border-radius: 20px; }
.tpl-distant-hug::before,
.tpl-distant-hug::after { content: ''; position: absolute; width: 120px; height: 120px; border-radius: 50%; border: 2px solid rgba(206,147,216,0.3); z-index: 1; pointer-events: none; }
.tpl-distant-hug::before { top: 10%; right: 8%; }
.tpl-distant-hug::after { bottom: 10%; left: 8%; }


/* ===== LETTER (67-78) ===== */

/* 67: Old Paper - realistic aged paper with torn edge */
.tpl-old-paper .love-page-card { background: linear-gradient(180deg, #f5e6d3 0%, #e8d5b7 100%); border: none; box-shadow: 3px 3px 15px rgba(0,0,0,0.2); border-radius: 2px; }
.tpl-old-paper .love-page-card::before { content: ''; position: absolute; inset: 0; background: url("data:image/svg+xml,%3Csvg width='200' height='200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence baseFrequency='0.65' numOctaves='3'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23n)' opacity='0.03'/%3E%3C/svg%3E"); pointer-events: none; border-radius: 2px; }
.tpl-old-paper .lp-text { line-height: 2.2; }
.tpl-old-paper .lp-photos img { border: 3px solid #e8d5b7; filter: sepia(15%); }

/* 68: Royal Letter - wax seal */
.tpl-royal-letter .love-page-card { background: linear-gradient(180deg, #fffde7, #fff9c4); border: 2px solid #bf8f00; border-radius: 3px; }
.tpl-royal-letter::before { content: ''; position: absolute; bottom: 20px; left: 50%; transform: translateX(-50%); width: 50px; height: 50px; background: radial-gradient(circle, #c62828, #8b0000); border-radius: 50%; z-index: 3; box-shadow: 0 2px 5px rgba(0,0,0,0.3); }
.tpl-royal-letter::after { content: '\2764\fe0f'; position: absolute; bottom: 30px; left: 50%; transform: translateX(-50%); font-size: 1.5em; z-index: 4; pointer-events: none; }
.tpl-royal-letter .lp-sender::before { content: '\2764\fe0f '; }

/* 69: Modern Letter - clean asymmetric */
.tpl-modern-letter .love-page-card { background: #fff; border: none; border-right: 6px solid #e91e63; box-shadow: 0 10px 40px rgba(0,0,0,0.08); border-radius: 0; text-align: right; padding: 50px; }
.tpl-modern-letter .lp-title { font-weight: 300; font-size: 2.5em; text-align: right; }
.tpl-modern-letter .lp-sender { border-top: 1px solid #eee; padding-top: 15px; }

/* 70: Ancient Scroll - scroll ends */
.tpl-ancient-scroll .love-page-card { background: linear-gradient(180deg, #c4b09a, #efebe9 8%, #f5e6d3 50%, #efebe9 92%, #c4b09a); border: none; box-shadow: 5px 5px 20px rgba(0,0,0,0.25); border-radius: 0; padding: 70px 50px; }
.tpl-ancient-scroll .lp-title { font-size: 1.8em; letter-spacing: 3px; border-bottom: 1px solid rgba(62,39,35,0.2); padding-bottom: 15px; }

/* 71: Ink Paper - handwritten feel */
.tpl-ink-paper .love-page-card { background: #f8f8f0; border: 1px solid #ccc; box-shadow: 0 5px 15px rgba(0,0,0,0.1); border-radius: 0; }
.tpl-ink-paper .love-page-card::before { content: ''; position: absolute; inset: 5px; border: 1px solid rgba(0,0,0,0.05); pointer-events: none; }
.tpl-ink-paper .lp-text { background: repeating-linear-gradient(transparent, transparent 28px, rgba(26,35,126,0.08) 28px, rgba(26,35,126,0.08) 29px); line-height: 29px; padding-top: 3px; }

/* 72: Bottle Sea - watermark effect */
.tpl-bottle-sea .love-page-card { background: linear-gradient(180deg, #e0f2f1, #f5e6d3 80%); border: none; box-shadow: 3px 3px 15px rgba(0,0,0,0.15); border-radius: 5px; }
.tpl-bottle-sea::before { content: '\1f30a'; position: absolute; bottom: 10px; right: 15px; font-size: 3em; opacity: 0.1; z-index: 0; pointer-events: none; }

/* 73: Pink Letter - heart stamp */
.tpl-pink-letter .love-page-card { background: linear-gradient(180deg, #fce4ec, #fff 50%, #fce4ec); border: 1px solid #f48fb1; border-radius: 5px; }
.tpl-pink-letter .love-page-card::before { content: '\1f48c'; position: absolute; top: 10px; left: 10px; font-size: 2em; z-index: 3; transform: rotate(-15deg); }

/* 74: Secret Letter - dark + sealed */
.tpl-secret-letter .love-page-card { background: rgba(255,255,255,0.06); border: 1px solid rgba(255,215,0,0.3); border-radius: 5px; }
.tpl-secret-letter .lp-title { letter-spacing: 5px; text-transform: uppercase; font-size: 1.5em; }
.tpl-secret-letter .lp-text { font-style: italic; }

/* 75: Postcard - stamp + postmark */
.tpl-postcard .love-page-card { background: #fff; border: 2px solid #ccc; box-shadow: 0 5px 20px rgba(0,0,0,0.15); border-radius: 5px; }
.tpl-postcard .love-page-card::before { content: '\1f4ee'; position: absolute; top: 10px; left: 10px; font-size: 2.5em; opacity: 0.2; }
.tpl-postcard .love-page-card::after { content: ''; position: absolute; top: 10px; right: 10px; width: 60px; height: 70px; border: 2px dashed #ccc; z-index: 1; pointer-events: none; }

/* 76: Formal Letter - embossed header line */
.tpl-formal-letter .love-page-card { background: #fffff8; border: 2px solid #1a237e; border-radius: 0; }
.tpl-formal-letter .lp-title { border-bottom: 3px double #1a237e; padding-bottom: 15px; letter-spacing: 2px; }

/* 77: Romantic Letter - rose watermark */
.tpl-romantic-letter .love-page-card { background: rgba(255,255,255,0.92); border: 2px solid #f48fb1; border-radius: 10px; }
.tpl-romantic-letter::before { content: '\1f339'; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); font-size: 12em; opacity: 0.04; z-index: 0; pointer-events: none; }

/* 78: Kraft Paper - rustic stitched border */
.tpl-kraft-paper .love-page-card { background: linear-gradient(180deg, #bcaaa4, #d7ccc8 15%, #efebe9 50%, #d7ccc8 85%, #bcaaa4); border: none; box-shadow: 3px 3px 15px rgba(0,0,0,0.15); border-radius: 3px; }
.tpl-kraft-paper .love-page-card::before { content: ''; position: absolute; inset: 8px; border: 2px dashed rgba(62,39,35,0.2); pointer-events: none; border-radius: 2px; }


/* ===== STORY (79-90) ===== */

/* 79: Romantic Timeline - vertical heart line */
.tpl-romantic-timeline .love-page-card { background: rgba(255,255,255,0.88); border: 2px solid #f48fb1; border-radius: 20px; }
.tpl-romantic-timeline .lp-text { border-right: 3px solid #f48fb1; padding-right: 25px; text-align: right; position: relative; }
.tpl-romantic-timeline .lp-text::before { content: '\2764\fe0f'; position: absolute; right: -12px; top: 0; z-index: 2; }

/* 80: Memory Album - polaroid style card */
.tpl-memory-album .love-page-card { background: #fff; border: 1px solid #d7ccc8; box-shadow: 0 3px 10px rgba(0,0,0,0.15); transform: rotate(-1deg); border-radius: 3px; padding: 15px 15px 50px; }
.tpl-memory-album .lp-photos img { border: none; border-radius: 0; box-shadow: none; }
.tpl-memory-album .lp-title { font-style: italic; margin-top: 15px; }

/* 81: Storybook - book page effect */
.tpl-storybook .love-page-card { background: #fff; border: 1px solid #e0e0e0; box-shadow: 5px 0 15px rgba(0,0,0,0.1), -2px 0 10px rgba(0,0,0,0.05); border-radius: 0 10px 10px 0; padding: 50px 50px 50px 60px; }
.tpl-storybook .love-page-card::before { content: ''; position: absolute; top: 0; left: 0; bottom: 0; width: 40px; background: linear-gradient(90deg, #e0e0e0, #f5f5f5); pointer-events: none; }
.tpl-storybook .lp-title::first-letter { font-size: 2em; color: #c62828; float: right; margin-left: 5px; line-height: 1; }

/* 82: Modern Clean - minimal card */
.tpl-modern-clean .love-page-card { background: #fff; box-shadow: 0 2px 10px rgba(0,0,0,0.06); border-radius: 12px; border: none; }
.tpl-modern-clean .lp-title { font-weight: 800; font-size: 2.5em; }
.tpl-modern-clean .lp-title::after { content: ''; display: block; width: 40px; height: 4px; background: #1565c0; margin: 12px auto 0; border-radius: 2px; }

/* 83: Movie Reel - film strip borders */
.tpl-movie-reel .love-page-card { background: rgba(255,255,255,0.06); border: 1px solid rgba(255,215,0,0.4); border-radius: 5px; }
.tpl-movie-reel .love-page-card::before,
.tpl-movie-reel .love-page-card::after { content: ''; position: absolute; top: 0; bottom: 0; width: 25px; background: repeating-linear-gradient(180deg, rgba(255,215,0,0.3), rgba(255,215,0,0.3) 10px, transparent 10px, transparent 15px); pointer-events: none; }
.tpl-movie-reel .love-page-card::before { right: 0; }
.tpl-movie-reel .love-page-card::after { left: 0; }

/* 84: Polaroid - scattered frames */
.tpl-polaroid .love-page-card { background: rgba(255,255,255,0.88); border-radius: 15px; border: none; box-shadow: 0 10px 30px rgba(0,0,0,0.1); }
.tpl-polaroid .lp-photos img { border: 8px solid #fff; border-bottom: 40px solid #fff; border-radius: 0; box-shadow: 0 3px 10px rgba(0,0,0,0.15); }

/* 85: Travel Diary - stamp/passport look */
.tpl-travel-diary .love-page-card { background: rgba(255,255,255,0.88); border: 2px solid #81c784; border-radius: 10px; }
.tpl-travel-diary .love-page-card::before { content: '\2708\fe0f \1f30d \2764\fe0f'; position: absolute; top: 10px; right: 15px; font-size: 1.5em; letter-spacing: 5px; }

/* 86: Cork Board - pushpin style */
.tpl-cork-board .love-page-card { background: rgba(255,255,255,0.8); border-radius: 5px; box-shadow: 2px 2px 8px rgba(0,0,0,0.15); }
.tpl-cork-board::before { content: '\1f4cc'; position: absolute; top: -5px; left: 50%; transform: translateX(-50%); font-size: 2em; z-index: 3; }
.tpl-cork-board .lp-photos img { transform: rotate(var(--photo-rotation, 0deg)); border: 3px solid #fff; box-shadow: 2px 2px 8px rgba(0,0,0,0.2); }

/* 87: Film Strip - dark cinema */
.tpl-film-strip .love-page-card { background: rgba(255,255,255,0.06); border: 2px solid rgba(255,255,255,0.2); border-radius: 5px; }
.tpl-film-strip .lp-title { text-transform: uppercase; letter-spacing: 5px; font-size: 1.8em; }
.tpl-film-strip .lp-photos img { border: 3px solid #333; }

/* 88: Secret Garden - foliage frame */
.tpl-secret-garden .love-page-card { background: rgba(0,0,0,0.25); backdrop-filter: blur(8px); border: 1px solid rgba(102,187,106,0.3); border-radius: 20px; }
.tpl-secret-garden .love-page-card::before { content: '\1f33f \1f343 \1f33f \1f343 \1f33f'; position: absolute; top: 5px; left: 0; right: 0; text-align: center; font-size: 1.5em; opacity: 0.4; }
.tpl-secret-garden .love-page-card::after { content: '\1f343 \1f33f \1f343 \1f33f \1f343'; position: absolute; bottom: 5px; left: 0; right: 0; text-align: center; font-size: 1.5em; opacity: 0.4; }

/* 89: Colorful Sky - gradient text */
.tpl-colorful-sky .love-page-card { background: rgba(0,0,0,0.2); backdrop-filter: blur(10px); border-radius: 25px; border: none; }
.tpl-colorful-sky .lp-title { background: linear-gradient(90deg, #fff, #ffd700, #fff); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; font-size: 2.5em; }

/* 90: Insta Story - phone frame */
.tpl-insta-story .love-page-card { background: rgba(0,0,0,0.25); backdrop-filter: blur(12px); border-radius: 35px; border: 3px solid rgba(255,255,255,0.2); max-width: 420px; padding: 40px 25px; }
.tpl-insta-story .lp-title { font-size: 1.8em; }
.tpl-insta-story .lp-photos img { border-radius: 15px; }


/* ===== CREATIVE (91-100) ===== */

/* 91: Minimalist Black - stark white text */
.tpl-minimalist-black .love-page-card { background: transparent; border: none; max-width: 600px; }
.tpl-minimalist-black .lp-title { font-size: 3em; font-weight: 100; letter-spacing: -1px; }
.tpl-minimalist-black .lp-text { font-size: 1.1em; line-height: 2; font-weight: 300; }
.tpl-minimalist-black .lp-sender { font-weight: 300; letter-spacing: 3px; text-transform: uppercase; }

/* 92: Urban Grunge - rough edges + accent line */
.tpl-urban-grunge .love-page-card { background: rgba(0,0,0,0.4); border: 2px solid rgba(255,110,64,0.5); border-radius: 0; clip-path: polygon(0 2%, 100% 0, 98% 100%, 2% 98%); padding: 60px 50px; }
.tpl-urban-grunge .lp-title { text-transform: uppercase; letter-spacing: 5px; font-size: 1.8em; }
.tpl-urban-grunge .lp-text { border-right: 3px solid rgba(255,110,64,0.5); padding-right: 20px; text-align: right; }

/* 93: Neon Night - glowing neon borders + text */
.tpl-neon-night .love-page-card { background: rgba(0,0,0,0.6); border: 2px solid rgba(0,229,255,0.5); border-radius: 15px; box-shadow: 0 0 15px rgba(0,229,255,0.2), 0 0 30px rgba(0,229,255,0.1), inset 0 0 15px rgba(0,229,255,0.05); }
.tpl-neon-night .lp-title { text-shadow: 0 0 10px rgba(0,229,255,0.8), 0 0 20px rgba(0,229,255,0.4), 0 0 40px rgba(0,229,255,0.2); animation: tpl-neon-flicker 3s ease-in-out infinite; }
@keyframes tpl-neon-flicker { 0%,100% { opacity: 1; } 92% { opacity: 1; } 93% { opacity: 0.8; } 94% { opacity: 1; } 96% { opacity: 0.9; } 97% { opacity: 1; } }
.tpl-neon-night .lp-sender { color: #ff4081; text-shadow: 0 0 10px rgba(255,64,129,0.5); }

/* 94: Watercolor - soft blobs */
.tpl-watercolor .love-page-card { background: rgba(255,255,255,0.88); border: none; box-shadow: 0 10px 40px rgba(0,0,0,0.08); border-radius: 25px; }
.tpl-watercolor::before,
.tpl-watercolor::after { content: ''; position: absolute; border-radius: 50%; filter: blur(50px); z-index: 0; pointer-events: none; opacity: 0.3; }
.tpl-watercolor::before { width: 250px; height: 250px; top: -80px; right: -60px; background: rgba(233,30,99,0.3); }
.tpl-watercolor::after { width: 200px; height: 200px; bottom: -50px; left: -40px; background: rgba(63,81,181,0.3); }

/* 95: Retro 80s - scanlines + glow */
.tpl-retro-80s .love-page-card { background: rgba(0,0,0,0.3); backdrop-filter: blur(8px); border: 2px solid rgba(255,235,59,0.5); border-radius: 5px; }
.tpl-retro-80s::before { content: ''; position: absolute; inset: 0; background: repeating-linear-gradient(0deg, transparent, transparent 2px, rgba(0,0,0,0.05) 2px, rgba(0,0,0,0.05) 4px); z-index: 3; pointer-events: none; }
.tpl-retro-80s .lp-title { text-shadow: 3px 3px 0 #ff6ec4, -1px -1px 0 #4adede; font-size: 2.5em; text-transform: uppercase; }

/* 96: Zen Japanese - minimal with accent line */
.tpl-zen-japanese .love-page-card { background: rgba(255,255,255,0.93); border: 1px solid #ccc; border-radius: 0; padding: 60px; }
.tpl-zen-japanese .lp-title { border-bottom: 3px solid #c62828; padding-bottom: 15px; display: inline-block; font-weight: 400; letter-spacing: 5px; }
.tpl-zen-japanese .lp-text { line-height: 2.2; }
.tpl-zen-japanese .love-page-card::before { content: ''; position: absolute; top: 20px; right: 20px; width: 50px; height: 2px; background: #c62828; }
.tpl-zen-japanese .love-page-card::after { content: ''; position: absolute; bottom: 20px; left: 20px; width: 50px; height: 2px; background: #c62828; }

/* 97: Galaxy - nebula effect */
.tpl-galaxy .love-page-card { background: rgba(255,255,255,0.05); backdrop-filter: blur(8px); border: 1px solid rgba(100,181,246,0.3); border-radius: 20px; }
.tpl-galaxy::before { content: ''; position: absolute; inset: 0; background: radial-gradient(ellipse at 30% 50%, rgba(100,50,200,0.15), transparent 50%), radial-gradient(ellipse at 70% 60%, rgba(50,100,200,0.1), transparent 50%); z-index: 0; pointer-events: none; border-radius: 20px; }

/* 98: Pop Art - bold halftone border */
.tpl-pop-art .love-page-card { background: rgba(0,0,0,0.25); backdrop-filter: blur(8px); border: 4px solid #fff; border-radius: 0; box-shadow: 8px 8px 0 rgba(26,35,126,0.5); }
.tpl-pop-art .lp-title { text-transform: uppercase; font-size: 2.5em; font-weight: 900; letter-spacing: 2px; -webkit-text-stroke: 1px rgba(255,255,255,0.3); }

/* 99: Desert Sand - warm layers */
.tpl-desert-sand .love-page-card { background: rgba(255,255,255,0.75); backdrop-filter: blur(8px); border-radius: 20px; border: none; }
.tpl-desert-sand::after { content: ''; position: absolute; bottom: 0; left: 0; right: 0; height: 50px; background: linear-gradient(180deg, transparent, rgba(210,140,80,0.15)); z-index: 1; pointer-events: none; border-radius: 0 0 20px 20px; }

/* 100: Geometric - angular design */
.tpl-geometric .love-page-card { background: rgba(255,255,255,0.06); border: 2px solid rgba(0,229,255,0.4); border-radius: 0; clip-path: polygon(20px 0, 100% 0, calc(100% - 20px) 100%, 0 100%); padding: 50px 60px; }
.tpl-geometric .lp-title { text-transform: uppercase; letter-spacing: 8px; font-size: 1.8em; }
.tpl-geometric .lp-sender { letter-spacing: 3px; }


/* ========== RESPONSIVE ========== */
@media (max-width: 768px) {
    .love-page-content { padding: 20px 15px; }
    .love-page-card { padding: 30px 20px; border-radius: 16px; }
    .love-page-card .lp-title { font-size: 1.7em; }
    .love-page-card .lp-subtitle { font-size: 1.1em; }
    .love-page-card .lp-text { font-size: 1.05em; }
    .love-page-card .lp-photos.three-photos img { width: 100%; max-height: 200px; }

    .layout-photo-right .love-page-card,
    .layout-photo-left .love-page-card { flex-direction: column; text-align: center; }
    .layout-photo-right .lp-photos,
    .layout-photo-left .lp-photos { flex: auto; }
    .layout-photo-right .lp-photos img,
    .layout-photo-left .lp-photos img { width: 100%; height: auto; max-height: 300px; }

    .layout-letter .love-page-card { padding: 30px 25px; }

    /* Fix clip-path on mobile */
    .tpl-urban-grunge .love-page-card,
    .tpl-geometric .love-page-card { clip-path: none; padding: 30px 20px; }

    /* Smaller decorations on mobile */
    .tpl-roses-hearts::before { font-size: 1em; }
    .tpl-insta-story .love-page-card { max-width: 100%; }
}