:root{--bg-dark: #3a2530;--bg-deep: #2a1825;--bg-mid: #4a3340;--pink-box: #e8a0b4;--pink-light: #f0c4d0;--pink-dark: #c47a94;--ribbon: #d4708f;--gold: #c9956b;--cream: #fdf5ef;--cream-soft: #f5ebde;--text-dark: #3a2a2a;--text-mid: #5a4a4a;--text-light: #f0ece4;--text-muted: #9a8a8a;--particle-1: #f0c4d0;--particle-2: #c9956b;--particle-3: #b8c9a3;--lavender: #d4c4e0;--font-script: "Caveat", cursive;--font-serif: "Cormorant Garamond", Georgia, serif;--font-sans: "Inter", system-ui, -apple-system, sans-serif}*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}html,body{width:100vw;height:100vh;overflow:hidden;background:radial-gradient(ellipse at 25% 18%,rgba(255,255,255,.28) 0%,transparent 45%),radial-gradient(ellipse at 75% 72%,rgba(200,230,255,.3) 0%,transparent 55%),linear-gradient(180deg,#a8d5f0,#7fbfe6,#5ba5d4 70%,#3e87bd);color:var(--text-light);font-family:var(--font-sans);-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent;user-select:none;-webkit-user-select:none;overscroll-behavior:none}button{font-family:inherit}.screen{position:fixed;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;z-index:10}.screen.hidden{display:none}.hidden{display:none!important}#particles{position:fixed;top:0;right:0;bottom:0;left:0;z-index:1;pointer-events:none}.preloader{position:fixed;top:0;right:0;bottom:0;left:0;background:var(--bg-deep);display:flex;align-items:center;justify-content:center;z-index:1000;transition:opacity .6s ease}.preloader.hidden{opacity:0;pointer-events:none}.preloader-line{width:60px;height:1px;background:linear-gradient(90deg,transparent,var(--pink-light),transparent);animation:preloader-pulse 1.2s ease-in-out infinite}@keyframes preloader-pulse{0%,to{transform:scaleX(.3);opacity:.4}50%{transform:scaleX(1);opacity:1}}.start-btn{font-family:var(--font-serif);font-size:22px;font-weight:400;letter-spacing:.15em;text-transform:uppercase;color:var(--cream);background:transparent;border:1px solid rgba(240,196,208,.45);border-radius:80px;padding:18px 56px;cursor:pointer;transition:all .28s ease;position:relative;animation:startBtnPulse 2.8s ease-in-out infinite}.start-btn:before{content:"";position:absolute;top:-2px;right:-2px;bottom:-2px;left:-2px;border-radius:inherit;background:radial-gradient(circle,rgba(240,196,208,.2),transparent 70%);opacity:0;transition:opacity .4s ease;z-index:-1}.start-btn:hover{border-color:var(--pink-light);color:#fff;transform:scale(1.05)}.start-btn:hover:before{opacity:1}.start-btn:active{transform:scale(.97)}@keyframes startBtnPulse{0%,to{box-shadow:0 0 30px #f0c4d026}50%{box-shadow:0 0 60px #f0c4d04d}}#intro{flex-direction:column;padding:40px 24px;cursor:pointer}.intro-text{font-family:var(--font-serif);font-size:clamp(28px,4.5vw,56px);font-weight:300;color:var(--cream);text-align:center;line-height:1.35;max-width:900px;white-space:pre-line;letter-spacing:.005em;text-shadow:0 0 50px rgba(240,196,208,.15)}.intro-hint{position:absolute;bottom:40px;left:50%;transform:translate(-50%);font-family:var(--font-sans);font-size:11px;letter-spacing:.3em;text-transform:uppercase;color:var(--text-muted);opacity:0;transition:opacity .8s ease;pointer-events:none;animation:hintFloat 2.4s ease-in-out infinite}.intro-hint.visible{opacity:.7}@keyframes hintFloat{0%,to{transform:translate(-50%)}50%{transform:translate(-50%,-6px)}}@media(max-width:600px){.start-btn{font-size:18px;padding:16px 44px}.intro-hint{bottom:28px;font-size:10px}}.scene-canvas{position:fixed;top:0;right:0;bottom:0;left:0;width:100vw;height:100vh;display:block;z-index:5;cursor:grab;touch-action:none;opacity:0;pointer-events:none;transition:opacity .8s ease}.scene-canvas.hidden{opacity:0;pointer-events:none}.scene-canvas:not(.hidden){opacity:1;pointer-events:auto}.scene-canvas.grabbing{cursor:grabbing}.scene-canvas.pointer{cursor:pointer}.box-hint{position:fixed;bottom:56px;left:50%;transform:translate(-50%);font-family:var(--font-sans);font-size:14px;letter-spacing:.32em;text-transform:uppercase;color:#ffdce6eb;text-shadow:0 1px 12px rgba(0,0,0,.55);z-index:30;pointer-events:none;opacity:0;transition:opacity .8s ease;animation:hintFloat 2.4s ease-in-out infinite}.box-hint.visible{opacity:1}.counter{position:fixed;top:22px;right:22px;font-family:var(--font-sans);font-size:13px;letter-spacing:.22em;text-transform:uppercase;color:#fff0e6d9;text-shadow:0 1px 8px rgba(0,0,0,.55);z-index:30;font-weight:500;pointer-events:none;opacity:0;transition:opacity .8s ease}.counter.visible{opacity:1}.counter span{color:var(--pink-light);font-weight:600}.shuffle-btn,.mute-btn,.reset-btn{position:fixed;font-family:var(--font-sans);background:#281624a6;border:1px solid rgba(255,220,230,.45);border-radius:30px;color:#fff8f5;font-size:14px;font-weight:500;letter-spacing:.1em;cursor:pointer;z-index:30;display:flex;align-items:center;gap:8px;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);transition:all .24s ease;opacity:0}.shuffle-btn.visible,.mute-btn.visible,.reset-btn.visible{opacity:1}.shuffle-btn:hover,.mute-btn:hover,.reset-btn:hover{opacity:1;background:#d4708f52;border-color:var(--pink-light)}.shuffle-btn{bottom:22px;left:50%;transform:translate(-50%);padding:12px 26px;font-weight:500;text-transform:uppercase;letter-spacing:.18em}.mute-btn{top:22px;left:22px;width:36px;height:36px;padding:0;gap:0;justify-content:center;border-radius:50%}.reset-btn{bottom:22px;right:22px;width:36px;height:36px;padding:0;gap:0;justify-content:center;border-radius:50%;font-size:14px;color:#f0ece4b3}.reset-btn.confirm{background:#ff648259;border-color:var(--ribbon);color:#ffd0db;opacity:1!important;font-size:16px}.reset-btn:hover:after{content:"нажми ещё раз — сбросить";position:absolute;right:100%;top:50%;transform:translateY(-50%);margin-right:10px;font-size:10px;letter-spacing:.15em;text-transform:uppercase;color:#ffc8d7d9;white-space:nowrap;pointer-events:none}.reset-btn:not(.confirm):hover:after{content:"сброс"}.card-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#0f080cb8;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);display:flex;align-items:center;justify-content:center;z-index:50;padding:24px;opacity:0;transition:opacity .3s ease;pointer-events:none}.card-overlay.visible{opacity:1;pointer-events:auto}.card{position:relative;width:100%;max-width:520px;max-height:88vh;overflow-y:auto;background:var(--cream);color:var(--text-dark);border-radius:16px;padding:44px 38px 36px;transform:scale(.85) rotateX(-8deg);opacity:0;transform-origin:center top;transition:transform .42s cubic-bezier(.34,1.56,.64,1),opacity .36s ease;box-shadow:0 20px 60px #0000008c,inset 0 1px 2px #fff9;background-image:repeating-linear-gradient(135deg,rgba(0,0,0,.012) 0px,rgba(0,0,0,.012) 1px,transparent 1px,transparent 4px)}.card-overlay.visible .card{transform:scale(1) rotateX(0);opacity:1}.card-close{position:absolute;top:12px;right:14px;width:30px;height:30px;border-radius:50%;background:#3a2a2a14;border:none;color:var(--text-dark);font-size:22px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s ease}.card-close:hover{background:#3a2a2a2e;transform:scale(1.08)}.card-body{font-family:var(--font-serif);font-size:22px;line-height:1.55;color:var(--text-dark);text-align:center}.card-text{font-family:var(--font-script);font-size:26px;color:var(--text-dark);text-align:center;line-height:1.5;margin:16px 0}.card-date{font-family:var(--font-sans);font-size:12px;color:var(--text-muted);text-align:center;margin-top:8px;letter-spacing:.18em;text-transform:uppercase}.card-type-wish{text-align:center}.card-type-wish .card-icon{font-size:36px;color:var(--gold);margin-bottom:12px}.card-type-love{text-align:center}.card-type-love .card-label{font-family:var(--font-serif);font-size:13px;letter-spacing:.25em;text-transform:uppercase;color:var(--ribbon);margin-bottom:12px}.card-type-love .card-text{color:var(--ribbon)}.card-type-photo .card-photo-wrap{border-radius:8px;overflow:hidden;margin-bottom:16px;box-shadow:0 4px 12px #00000026;background:#0000000a}.card-type-photo .card-photo{width:100%;height:auto;display:block}.card-type-photo .card-text{font-family:var(--font-serif);font-style:italic;font-size:20px;color:var(--text-mid);margin:10px 0}.card.type-gift{background:linear-gradient(135deg,#fdf5ef,#f6e8d5)}.card-type-gift .card-gift-border{border:2px solid var(--gold);border-radius:12px;padding:28px 22px 22px;text-align:center}.card-type-gift .card-gift-title{font-family:var(--font-serif);font-size:14px;letter-spacing:.45em;color:var(--gold);margin-bottom:14px;font-weight:500}.card-type-gift .card-gift-divider{width:60px;height:1px;background:var(--gold);margin:14px auto}.card-type-gift .card-text{font-family:var(--font-serif);font-size:22px;font-weight:500;color:var(--text-dark);line-height:1.42}.card-type-gift .card-gift-footer{font-family:var(--font-sans);font-size:10px;color:#aaa;letter-spacing:.18em;text-transform:uppercase;margin-top:8px}.card-type-quote{text-align:center}.card-type-quote .card-quote-mark{font-family:var(--font-serif);font-size:48px;color:var(--ribbon);line-height:.5;margin:12px 0}.card-type-quote .card-quote-mark.right{text-align:right;margin-top:6px}.card-type-quote .card-quote-text{font-family:var(--font-serif);font-style:italic;font-size:22px;color:var(--text-dark);line-height:1.55}.card-type-quote .card-quote-author{font-family:var(--font-serif);font-size:16px;color:var(--ribbon);font-style:italic;margin-top:14px}@media(max-width:600px){.card{padding:36px 24px 28px;max-height:85vh}.card-body,.card.type-wish .card-text,.card.type-love .card-text{font-size:24px}.card.type-gift .card-text{font-size:22px}.shuffle-btn{padding:9px 18px;font-size:11px}.counter{font-size:10px;top:14px;right:14px}.mute-btn{top:14px;left:14px}.reset-btn{bottom:14px;right:14px}.shuffle-btn{bottom:14px}}#finale{flex-direction:column;padding:40px 24px;background:radial-gradient(ellipse at center,rgba(120,50,90,.4) 0%,transparent 70%)}.finale-content{text-align:center;max-width:720px}.finale-text{font-family:var(--font-serif);font-size:clamp(22px,3vw,32px);font-weight:300;color:var(--cream);line-height:1.55;white-space:pre-line;letter-spacing:.005em;margin-bottom:28px;opacity:0;transition:opacity 1.5s ease}.finale-text.visible{opacity:1}.finale-sign{font-family:var(--font-script);font-size:clamp(22px,3vw,32px);color:var(--pink-light);opacity:0;transition:opacity 1.5s ease}.finale-sign.visible{opacity:1}@keyframes noteFloat{0%,to{transform:translateY(0) rotate(0)}50%{transform:translateY(-4px) rotate(0)}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.fade-in-up{animation:fadeInUp .7s ease forwards}
