:root{--bg-gradient: linear-gradient(135deg, #f5f2eb 0%, #e6dfd3 100%);--wood-bg: radial-gradient(circle, #ecdcc4 0%, #c4a482 100%);--glass-bg: rgba(255, 255, 255, .4);--glass-border: rgba(255, 255, 255, .6);--glass-shadow: 0 8px 32px 0 rgba(142, 126, 98, .15);--primary-color: #8c6a5c;--secondary-color: #d4af37;--text-dark: #3e322d;--text-light: #fefcf9;--paper-bg: #fdfbf7;--paper-border: #f0eae1;--paper-lines: #e6dfd3;--paper-shadow: 0 10px 30px rgba(62, 50, 45, .15);--polaroid-shadow: 0 12px 24px rgba(62, 50, 45, .2);--wax-red: #a82e2e;--font-heading: "Dancing Script", cursive;--font-handwritten: "Caveat", cursive;--font-serif: "Playfair Display", serif;--font-sans: "Outfit", sans-serif;--transition-fast: .2s ease;--transition-normal: .4s cubic-bezier(.25, .8, .25, 1);--transition-slow: .8s cubic-bezier(.65, .05, .36, 1)}body.theme-midnight{--bg-gradient: linear-gradient(135deg, #0b071a 0%, #1e1338 100%);--wood-bg: radial-gradient(circle, #2d1847 0%, #0d0517 100%);--glass-bg: rgba(24, 15, 41, .6);--glass-border: rgba(234, 156, 255, .2);--glass-shadow: 0 8px 32px 0 rgba(0, 0, 0, .5);--primary-color: #ea9cff;--secondary-color: #ff5277;--text-dark: #f0e6ff;--text-light: #0b071a;--paper-bg: #1c152c;--paper-border: #2a1f42;--paper-lines: #352854;--paper-shadow: 0 10px 30px rgba(0, 0, 0, .4);--polaroid-shadow: 0 12px 24px rgba(0, 0, 0, .5);--wax-red: #ff3366}body.theme-pastel{--bg-gradient: linear-gradient(135deg, #fcddec 0%, #ccd3f8 100%);--wood-bg: radial-gradient(circle, #ffedf4 0%, #d5defc 100%);--glass-bg: rgba(255, 255, 255, .5);--glass-border: rgba(255, 255, 255, .8);--glass-shadow: 0 8px 32px 0 rgba(188, 168, 204, .2);--primary-color: #f77ca4;--secondary-color: #8da4f7;--text-dark: #4b4b7c;--text-light: #ffffff;--paper-bg: #ffffff;--paper-border: #f7e6f0;--paper-lines: #ebebf9;--paper-shadow: 0 10px 30px rgba(188, 168, 204, .25);--polaroid-shadow: 0 12px 24px rgba(188, 168, 204, .3);--wax-red: #ff6088}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-sans);background:var(--bg-gradient);color:var(--text-dark);min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;overflow-x:hidden;transition:background var(--transition-slow),color var(--transition-normal);position:relative}body:before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:var(--wood-bg);opacity:.15;z-index:-2;transition:background var(--transition-slow)}.heart-particles{position:fixed;top:0;left:0;width:100vw;height:100vh;pointer-events:none;z-index:-1;overflow:hidden}.heart-particle{position:absolute;bottom:-20px;color:var(--primary-color);font-size:20px;opacity:.6;animation:floatUp 8s linear infinite;pointer-events:none}@keyframes floatUp{0%{transform:translateY(0) rotate(0) scale(.6);opacity:0}10%{opacity:.6}90%{opacity:.6}to{transform:translateY(-105vh) rotate(360deg) scale(1.2);opacity:0}}.ambient-controls{position:fixed;top:20px;left:20px;display:flex;gap:12px;z-index:100}.control-btn{background:var(--glass-bg);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid var(--glass-border);color:var(--text-dark);padding:10px;border-radius:50%;cursor:pointer;box-shadow:var(--glass-shadow);display:flex;align-items:center;justify-content:center;transition:transform var(--transition-fast),background var(--transition-fast),box-shadow var(--transition-fast)}.control-btn:hover{transform:scale(1.15) rotate(5deg);background:#ffffffb3;box-shadow:0 10px 20px #0000001a}.control-btn:active{transform:scale(.95)}.control-btn .icon{width:20px;height:20px;transition:color var(--transition-fast)}.hidden{display:none!important}.welcome-screen{position:fixed;top:0;left:0;width:100vw;height:100vh;display:flex;align-items:center;justify-content:center;background:var(--bg-gradient);z-index:50;transition:opacity var(--transition-slow),visibility var(--transition-slow)}.welcome-screen.fade-out{opacity:0;visibility:hidden}.cover-card{background:var(--glass-bg);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid var(--glass-border);border-radius:24px;padding:40px;width:90%;max-width:480px;text-align:center;box-shadow:var(--glass-shadow);transform:translateY(0);animation:cardEntrance 1s cubic-bezier(.25,.8,.25,1) forwards}@keyframes cardEntrance{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.heart-seal{font-size:48px;margin-bottom:16px;animation:heartbeat 1.5s infinite;display:inline-block}@keyframes heartbeat{0%,to{transform:scale(1)}25%{transform:scale(1.15)}40%{transform:scale(1)}55%{transform:scale(1.1)}}.welcome-title{font-family:var(--font-heading);font-size:42px;color:var(--primary-color);margin-bottom:8px}.welcome-subtitle{font-size:16px;letter-spacing:2px;text-transform:uppercase;color:var(--text-dark);opacity:.7;margin-bottom:24px}.cover-image-container{border-radius:12px;overflow:hidden;box-shadow:var(--paper-shadow);margin-bottom:28px;border:8px solid white;transform:rotate(-2deg);transition:transform var(--transition-normal)}.cover-image-container:hover{transform:rotate(0) scale(1.03)}.cover-image-container img{width:100%;height:280px;object-fit:cover;display:block}.open-book-btn{background:var(--primary-color);color:var(--text-light);border:none;border-radius:50px;padding:14px 36px;font-family:var(--font-sans);font-weight:600;font-size:18px;cursor:pointer;box-shadow:0 6px 15px #00000026;transition:background var(--transition-fast),transform var(--transition-fast),box-shadow var(--transition-fast)}.open-book-btn:hover{background:#735144;transform:translateY(-2px);box-shadow:0 8px 20px #0003}.open-book-btn:active{transform:translateY(1px)}.scrapbook-container{display:flex;flex-direction:column;align-items:center;width:95%;max-width:1100px;z-index:10;transition:opacity var(--transition-normal)}.scrapbook-header{text-align:center;margin-bottom:20px;display:flex;justify-content:space-between;align-items:center;width:100%;padding:0 10px}.book-title{font-family:var(--font-heading);font-size:32px;color:var(--primary-color);text-shadow:1px 1px 0 rgba(255,255,255,.5)}.page-indicator{background:var(--glass-bg);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1px solid var(--glass-border);padding:6px 16px;border-radius:20px;font-size:14px;font-weight:600;box-shadow:var(--glass-shadow)}.book-viewport{width:100%;perspective:1500px;margin-bottom:20px;display:flex;justify-content:center}.book-outer{display:flex;background:#4a362c;padding:12px;border-radius:12px 24px 24px 12px;box-shadow:0 30px 60px #00000059;position:relative}.book-outer:before{content:"";position:absolute;left:0;top:0;width:25px;height:100%;background:linear-gradient(to right,#2b1f19,#4a362c 40%,#2b1f19);border-radius:12px 0 0 12px;z-index:2}.book-spine{width:24px;background:linear-gradient(to right,#0006,#0000 40%,#0000 60%,#0006);z-index:5;box-shadow:inset 1px 0 3px #0003,inset -1px 0 3px #0003}.book-body{display:flex;background:var(--paper-bg);border-radius:0 12px 12px 0;overflow:hidden;box-shadow:var(--paper-shadow);position:relative;transition:background var(--transition-slow)}.book-page{width:480px;height:640px;position:relative;display:flex;flex-direction:column;background:var(--paper-bg);transition:background var(--transition-slow)}.page-left{border-right:1px solid var(--paper-lines);box-shadow:inset -15px 0 30px #0000000d}.page-right{border-left:1px solid var(--paper-lines);box-shadow:inset 15px 0 30px #0000000d}.page-content-wrapper{width:100%;height:100%;display:flex;position:relative;padding:10px;align-items:center;justify-content:center;overflow:hidden;background:var(--paper-bg);transition:background var(--transition-slow)}.page-img{width:100%;height:100%;object-fit:contain;border-radius:6px;-webkit-user-select:none;user-select:none;-webkit-user-drag:none;transition:opacity var(--transition-normal)}.book-page:after{content:"";position:absolute;top:0;bottom:0;width:20px;pointer-events:none}.page-left:after{right:0;background:linear-gradient(to left,#0000000d,#0000)}.page-right:after{left:0;background:linear-gradient(to right,#0000000d,#0000)}.zoomable{cursor:zoom-in;transition:transform var(--transition-fast)}.zoomable:hover{transform:scale(1.02)}.page-overlay-number{position:absolute;bottom:12px;font-family:var(--font-serif);font-size:13px;opacity:.6}.page-left .page-overlay-number{left:16px}.page-right .page-overlay-number{right:16px}.polaroid-container{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;align-items:center;justify-content:center;pointer-events:none}.polaroid-card{background:#fff;padding:16px 16px 36px;width:80%;max-width:320px;box-shadow:var(--polaroid-shadow);border-radius:4px;transform:rotate(-3deg);transition:transform var(--transition-normal),box-shadow var(--transition-normal);pointer-events:auto;cursor:pointer;position:relative;border:1px solid rgba(0,0,0,.05)}.polaroid-card:hover{transform:rotate(0) scale(1.06);box-shadow:0 18px 36px #3e322d4d;z-index:10}.polaroid-pin{position:absolute;top:-15px;left:50%;transform:translate(-50%);font-size:24px;filter:drop-shadow(0 2px 4px rgba(0,0,0,.2));z-index:5;transition:transform var(--transition-fast)}.polaroid-card:hover .polaroid-pin{transform:translate(-50%) translateY(-2px) scale(1.1)}.polaroid-card:before{content:"";position:absolute;top:-12px;left:30%;width:90px;height:25px;background-color:#ffe6f080;-webkit-backdrop-filter:blur(1px);backdrop-filter:blur(1px);border:1px dashed rgba(255,255,255,.7);transform:rotate(-12deg);z-index:1;pointer-events:none;box-shadow:0 2px 5px #0000000d}.polaroid-card.tape-alt:before{left:auto;right:25%;background-color:#e6f0ff80;transform:rotate(8deg)}.polaroid-image-wrapper{width:100%;aspect-ratio:1 / 1;overflow:hidden;background:#eaeaea;border:1px solid #dfdfdf;border-radius:2px}.polaroid-image-wrapper img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s ease}.polaroid-card:hover .polaroid-image-wrapper img{transform:scale(1.05)}.polaroid-caption{font-family:var(--font-handwritten);font-size:24px;text-align:center;color:#3e322d;margin-top:16px;font-weight:700;line-height:1.2}.lock-page-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(135deg,#fdfbf7f5,#f7f2e9fa);display:flex;flex-direction:column;align-items:center;justify-content:flex-start;z-index:30;padding:20px 15px;box-shadow:inset 15px 0 30px #0000000d;transition:opacity var(--transition-slow),background var(--transition-slow);overflow-y:auto}body.theme-midnight .lock-page-overlay{background:linear-gradient(135deg,#1c152cf7,#150f22fc)}body.theme-pastel .lock-page-overlay{background:linear-gradient(135deg,#fffffff5,#f7e6f0fa)}.lock-content{width:100%;max-width:400px;text-align:center;display:flex;flex-direction:column;align-items:center;margin:auto 0}.lock-seal-container{margin-bottom:24px;position:relative}.wax-seal{width:80px;height:80px;background-color:var(--wax-red);border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 8px 16px #a82e2e4d,inset 0 -4px 10px #0003,inset 0 4px 10px #ffffff4d;position:relative;cursor:pointer;border:4px solid var(--wax-red);animation:waxWobble 4s ease-in-out infinite alternate}.wax-seal.unlocking{animation:waxBurst .8s cubic-bezier(.175,.885,.32,1.275) forwards}@keyframes waxWobble{0%{transform:scale(1) rotate(0)}50%{transform:scale(1.04) rotate(3deg)}to{transform:scale(1) rotate(-3deg)}}@keyframes waxBurst{0%{transform:scale(1)}50%{transform:scale(1.3);opacity:.8}to{transform:scale(0);opacity:0;visibility:hidden}}.wax-seal:after{content:"";position:absolute;top:8px;left:8px;right:8px;bottom:8px;border-radius:50%;border:2px dashed rgba(255,255,255,.4)}.seal-heart{color:#fff;font-size:32px;text-shadow:0 2px 4px rgba(0,0,0,.15)}.lock-title{font-family:var(--font-heading);font-size:32px;color:var(--primary-color);margin-bottom:6px}.lock-subtext{font-size:14px;opacity:.7;margin-bottom:24px}.countdown-wrapper{display:flex;gap:12px;margin-bottom:24px}.countdown-item{background:var(--glass-bg);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1px solid var(--glass-border);box-shadow:var(--glass-shadow);padding:12px 10px;border-radius:12px;min-width:68px;display:flex;flex-direction:column;align-items:center;transition:transform var(--transition-fast)}.countdown-item:hover{transform:translateY(-3px)}.countdown-num{font-family:var(--font-serif);font-size:26px;font-weight:700;color:var(--primary-color);line-height:1.1}.countdown-label{font-size:10px;text-transform:uppercase;letter-spacing:1px;opacity:.6;margin-top:4px}.lock-instructions{font-family:var(--font-serif);font-style:italic;font-size:15px;color:var(--wax-red);padding:8px 18px;background:#a82e2e14;border-radius:20px;animation:pulseMessage 2s infinite ease-in-out}@keyframes pulseMessage{0%,to{opacity:.7}50%{opacity:1;transform:scale(1.02)}}.unlocked-editor{width:100%;display:flex;flex-direction:column;align-items:center;animation:editorReveal .6s cubic-bezier(.25,.8,.25,1) forwards}@keyframes editorReveal{0%{opacity:0;transform:translateY(15px)}to{opacity:1;transform:translateY(0)}}.editor-title{font-family:var(--font-heading);font-size:26px;color:var(--primary-color);margin-bottom:4px}.editor-desc{font-size:13px;opacity:.8;margin-bottom:16px}#letterTextArea{width:100%;height:200px;background:var(--paper-bg);border:1px solid var(--paper-lines);border-radius:8px;padding:14px;font-family:var(--font-handwritten);font-size:22px;color:var(--text-dark);resize:none;box-shadow:inset 0 2px 8px #0000000d;margin-bottom:16px;line-height:1.4;outline:none}#letterTextArea:focus{border-color:var(--primary-color);box-shadow:inset 0 2px 8px #0000000d,0 0 0 2px #8c6a5c33}.editor-buttons{display:flex;align-items:center;justify-content:space-between;width:100%}.editor-btn{background:var(--primary-color);color:var(--text-light);border:none;padding:10px 22px;border-radius:20px;font-family:var(--font-sans);font-size:14px;font-weight:600;cursor:pointer;box-shadow:0 4px 10px #0000001a;transition:transform var(--transition-fast),background var(--transition-fast)}.editor-btn:hover{background:#735144;transform:translateY(-1px)}.save-status{font-size:13px;font-style:italic;opacity:.8;color:#2e7d32;transition:opacity .3s ease}.scrapbook-controls{display:flex;align-items:center;justify-content:space-between;width:100%;padding:0 10px;gap:20px}.nav-btn{background:var(--glass-bg);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1px solid var(--glass-border);color:var(--text-dark);width:50px;height:50px;border-radius:50%;cursor:pointer;box-shadow:var(--glass-shadow);display:flex;align-items:center;justify-content:center;transition:transform var(--transition-fast),background var(--transition-fast)}.nav-btn:hover:not(:disabled){transform:scale(1.1);background:#ffffffb3}.nav-btn:disabled{opacity:.3;cursor:not-allowed}.nav-icon{width:24px;height:24px}.slider-container{flex-grow:1;display:flex;flex-direction:column;gap:8px}.page-slider{-webkit-appearance:none;width:100%;height:6px;border-radius:3px;background:var(--glass-bg);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1px solid var(--glass-border);outline:none}.page-slider::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:20px;height:20px;border-radius:50%;background:var(--primary-color);cursor:pointer;border:2px solid #ffffff;box-shadow:0 2px 6px #00000026;transition:transform var(--transition-fast)}.page-slider::-webkit-slider-thumb:hover{transform:scale(1.2)}.slider-labels{display:flex;justify-content:space-between;font-size:11px;font-weight:600;opacity:.6;padding:0 4px}.extra-controls{display:flex;gap:16px;margin-top:10px}.action-btn{background:var(--glass-bg);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1px solid var(--glass-border);color:var(--text-dark);padding:8px 20px;border-radius:20px;font-family:var(--font-sans);font-size:13px;font-weight:600;cursor:pointer;box-shadow:var(--glass-shadow);transition:transform var(--transition-fast),background var(--transition-fast)}.action-btn:hover{transform:translateY(-2px);background:#ffffffb3}.secondary-btn{opacity:.7}.secondary-btn:hover{opacity:1}.zoom-modal{position:fixed;top:0;left:0;width:100vw;height:100vh;background:#000000e6;z-index:200;display:flex;align-items:center;justify-content:center;cursor:zoom-out}.close-zoom{position:absolute;top:20px;right:30px;color:#fff;font-size:44px;font-weight:700;cursor:pointer;z-index:210;transition:color .2s ease,transform var(--transition-fast)}.close-zoom:hover{color:var(--primary-color);transform:scale(1.1)}.zoom-content-wrapper{max-width:90%;max-height:90%;overflow:hidden;cursor:grab;position:relative}.zoom-content-wrapper:active{cursor:grabbing}.zoom-image{max-width:100%;max-height:90vh;object-fit:contain;border-radius:4px;transition:transform .1s ease}.zoom-tip{position:absolute;bottom:20px;color:#fff9;font-size:13px;pointer-events:none}.gallery-modal{position:fixed;top:0;left:0;width:100vw;height:100vh;background:#0b071af2;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);z-index:150;display:flex;align-items:center;justify-content:center;padding:40px 20px}.gallery-modal-content{background:var(--paper-bg);width:95%;max-width:900px;max-height:85vh;border-radius:20px;padding:30px;overflow-y:auto;box-shadow:0 20px 50px #00000080;border:1px solid var(--glass-border);position:relative;display:flex;flex-direction:column;transition:background var(--transition-slow)}.gallery-modal-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:4px}.gallery-modal-header h2{font-family:var(--font-heading);font-size:36px;color:var(--primary-color)}.close-gallery{font-size:36px;font-weight:700;cursor:pointer;color:var(--text-dark);transition:color .2s ease,transform var(--transition-fast)}.close-gallery:hover{color:var(--primary-color);transform:scale(1.1)}.gallery-subtitle{font-size:13px;opacity:.6;margin-bottom:20px}.gallery-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:16px;overflow-y:auto}.gallery-item{aspect-ratio:1 / 1;border-radius:8px;overflow:hidden;cursor:pointer;box-shadow:0 4px 10px #0000001a;border:4px solid white;transition:transform var(--transition-fast),box-shadow var(--transition-fast)}.gallery-item:hover{transform:scale(1.08) rotate(3deg);box-shadow:0 10px 20px #00000040;z-index:2}.gallery-item img{width:100%;height:100%;object-fit:cover;display:block}@media (max-width: 1024px){.book-page{width:400px;height:533px}.polaroid-card{max-width:260px}}@media (max-width: 850px){.book-body{flex-direction:column;border-radius:12px;width:100%}.book-spine{display:none}.book-outer:before{display:none}.book-outer{padding:6px;border-radius:12px;width:100%;max-width:460px}.book-page{width:100%;aspect-ratio:3 / 4;height:auto}.book-page.hidden-mobile{display:none!important}.book-title{font-size:24px}.welcome-title{font-size:28px}}@media (max-width: 480px){.polaroid-card{max-width:220px;padding:10px 10px 24px}.polaroid-caption{font-size:18px;margin-top:10px}.countdown-item{min-width:55px;padding:8px 6px}.countdown-num{font-size:20px}}