/* Ёлка, искорки, снежинка «К ♡», погода, ночное небо, тайные сердечки */

/* ---------- ёлка ---------- */
.treebox{margin:9cqw 0 0;text-align:center;position:relative}
.treebox .ttl2{font-family:'Great Vibes','Marck Script',cursive;font-size:10cqw;color:var(--wine);line-height:1}
.treebox .cnt{font-weight:700;font-size:4.2cqw;margin-top:1cqw}
.treebox svg{width:74cqw;display:block;margin:2cqw auto 0}
.orn{transform-box:fill-box;transform-origin:center}
.orn.new{animation:ornPop .7s cubic-bezier(.2,.9,.3,1.6) both}
@keyframes ornPop{from{transform:scale(0) translateY(-6px)}}
.star{transition:fill .6s,filter .6s}
.star.on{fill:#ffd66b;filter:drop-shadow(0 0 6px #ffd66b) drop-shadow(0 0 14px #ffb84a)}

/* ---------- слои поверх страницы ---------- */
.fx-layer{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.fx-sparks{z-index:27}
.fx-kflake{z-index:6}

/* ---------- погода ---------- */
.weather{position:relative;display:flex;gap:3cqw;align-items:center;margin:0 6cqw 6cqw;padding:3.4cqw 8cqw 3.4cqw 4cqw;border-radius:4cqw;text-align:left;
  background:rgba(255,246,238,.88);border:1px solid rgba(107,31,38,.3);box-shadow:0 2cqw 4cqw rgba(60,25,15,.2);animation:wDrop .7s cubic-bezier(.2,.9,.3,1.3)}
@keyframes wDrop{from{transform:translateY(-8cqw);opacity:0}}
.weather.bye{transition:opacity .35s,transform .35s;opacity:0;transform:scale(.9)}
.weather .ic{font-size:10cqw;line-height:1}
.weather b{display:block;font-size:4.8cqw}
.weather span{font-size:4.1cqw;font-weight:600;line-height:1.3;display:block}
.weather .x{position:absolute;right:2.4cqw;top:1.6cqw;border:none;background:none;font-size:4.4cqw;color:var(--ink);opacity:.5;cursor:pointer;padding:1cqw}

/* ---------- ночь (00:00–06:00) ---------- */
.nightsky{position:absolute;left:0;right:0;top:0;height:95cqw;z-index:0;pointer-events:none;display:none;
  background:linear-gradient(#0e1330 0%,#24204a 35%,rgba(107,63,79,.85) 70%,rgba(207,163,139,0) 100%)}
.night .nightsky{display:block}
.nightsky canvas{position:absolute;inset:0;width:100%;height:100%}
.nightsky .moon{position:absolute;right:24cqw;top:2.5cqw;width:9cqw;height:9cqw;border-radius:50%;box-shadow:-2.2cqw 1.1cqw 0 0 #f6e3b0;filter:drop-shadow(0 0 3cqw rgba(246,227,176,.6))}
.night .garland{display:none}
.night h1{color:#f3d9a4;text-shadow:0 0 3cqw rgba(243,217,164,.45)}
.night h1 svg path{stroke:#f3d9a4}
/* ночью вместо подзаголовка и подводки — одна спокойная фраза */
.night .content>.sub:not(.nightmsg),.night .lead{display:none}
.night h1{text-shadow:0 0 3cqw rgba(243,217,164,.35),0 .4cqw 1.2cqw rgba(10,8,30,.6)}

/* ---------- тайные сердечки ---------- */
.hh{position:absolute;z-index:3;width:6.5cqw;opacity:.26;cursor:pointer;padding:2cqw;box-sizing:content-box;margin:-2cqw;animation:hhBreath 3s ease-in-out infinite}
.hh.found{opacity:.12;filter:grayscale(1);animation:none}
@keyframes hhBreath{50%{transform:scale(1.15)}}
.hpop{position:absolute;inset:0;background:rgba(40,18,12,.6);display:none;align-items:center;justify-content:center;padding:6cqw;z-index:31}
.hpop.on{display:flex}
.hcard{width:100%;background:#fbf2e6;padding:7cqw 6cqw;text-align:center;box-shadow:0 3cqw 8cqw rgba(0,0,0,.5);border-radius:2cqw;animation:hIn .5s cubic-bezier(.2,.9,.3,1.2)}
@keyframes hIn{from{transform:scale(.6);opacity:0}}
.hcard h3{font-family:'Great Vibes','Marck Script',cursive;font-weight:400;font-size:10cqw;color:var(--wine);margin:0 0 3cqw;line-height:1}
.hcard p{font-size:4.8cqw;font-weight:600;margin:0 0 4cqw;line-height:1.35}
.hcard .opts{display:grid;gap:2.4cqw}
.hcard .opts button,.hcard .ok{background:#f1dfd0;border:1px solid rgba(107,31,38,.35);border-radius:4cqw;padding:2.6cqw;font:700 4.4cqw 'Cormorant Garamond';color:var(--ink);cursor:pointer}
.hcard .opts button.bad{animation:hShake .35s;background:#f3cfcf}
@keyframes hShake{25%{transform:translateX(-2cqw)}75%{transform:translateX(2cqw)}}
.hcard .gift{border:2px dashed var(--wine);border-radius:3cqw;padding:3cqw;background:#f3dfd2;font-weight:700;font-size:4.6cqw;margin-bottom:4cqw}
.hcard .gift small{display:block;font-size:3.2cqw;letter-spacing:.2em;color:var(--wine);text-transform:uppercase}
.hcard .game{position:relative;height:70cqw;border-radius:3cqw;background:linear-gradient(#f3e3d4,#e8cdb8);overflow:hidden;margin-bottom:3cqw;touch-action:none}
.hcard .fall{position:absolute;font-size:8cqw;cursor:pointer;user-select:none;padding:1cqw}
.hcard .hold{width:28cqw;height:28cqw;margin:2cqw auto 4cqw;cursor:pointer;user-select:none;touch-action:none;-webkit-touch-callout:none}
.hcard .hold svg{width:100%;height:100%}
.nightmsg{font-weight:600;font-style:italic;font-size:4.8cqw;line-height:1.35;max-width:56cqw;margin:2cqw auto 7cqw;color:#f2dccb!important;text-shadow:0 .3cqw 1cqw rgba(10,8,30,.7)}

/* ---------- особый конверт: 9 декабря, 5 месяцев вместе ---------- */
.env.special{background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 110 100' preserveAspectRatio='none'%3E%3Cpath d='M4 4 Q30 40 55 52 Q80 40 106 4' fill='rgba(255,235,235,.35)' stroke='rgba(140,40,60,.5)' stroke-width='1.6'/%3E%3C/svg%3E") center/100% 100% no-repeat,
    radial-gradient(ellipse at 50% 40%,#f3c9c4,#dc9b98 80%);
  box-shadow:0 0 0 .5cqw #d98a92,0 0 4cqw rgba(232,120,140,.7),inset 0 0 2cqw rgba(140,40,60,.3)}
.env.special .n{color:#7a1d33;padding:0 0 3.4cqw}
.env.special::before{content:"5 мес ♡";position:absolute;left:50%;bottom:.6cqw;transform:translateX(-50%);z-index:6;white-space:nowrap;
  background:#a8373e;color:#fbe3dc;font:700 2.4cqw 'Cormorant Garamond';padding:.2cqw 1.2cqw;border-radius:1cqw;box-shadow:0 .4cqw .8cqw rgba(0,0,0,.3)}
.env.special:not(.lock){animation:specialBeat 1.6s ease-in-out infinite}
@keyframes specialBeat{0%,100%{transform:scale(1)}15%{transform:scale(1.08)}30%{transform:scale(1)}45%{transform:scale(1.05)}}
.fx-hearts{z-index:29}
.anniv{position:absolute;left:0;right:0;top:30%;z-index:29;text-align:center;pointer-events:none;font-family:'Great Vibes','Marck Script',cursive;
  font-size:13cqw;line-height:1.05;color:#fff2ec;text-shadow:0 0 3cqw rgba(200,60,90,.9),0 .5cqw 1.5cqw rgba(60,10,20,.6);animation:anniv 3.6s ease forwards}
@keyframes anniv{0%{opacity:0;transform:scale(.6)}15%{opacity:1;transform:scale(1)}80%{opacity:1}100%{opacity:0;transform:translateY(-6cqw)}}

/* ---------- пазл, свеча, банка ---------- */
.hcard p.small{font-size:4cqw;margin-bottom:3cqw}
.puz{display:grid;grid-template-columns:repeat(3,1fr);gap:1cqw;width:72cqw;margin:0 auto 2cqw;transition:gap .5s}
.puz .pc{aspect-ratio:1;background-size:300% 300%;border-radius:1cqw;cursor:pointer;box-shadow:0 .5cqw 1cqw rgba(0,0,0,.25);transition:transform .15s}
.puz .pc.sel{transform:scale(.9);outline:.8cqw solid #a8373e}
.puz.done{gap:0}.puz.done .pc{border-radius:0;box-shadow:none}
.hcard.dark{background:#140b06;padding:0;overflow:hidden;position:relative}
.hcard .ink{display:block;width:100%;height:150cqw;touch-action:none}
.hcard .ink-hint{position:absolute;left:0;right:0;bottom:4cqw;color:#e8c99a;font-style:italic;transition:opacity .6s;margin:0}
.hcard.dark .ok{position:absolute;left:50%;bottom:4cqw;transform:translateX(-50%);background:rgba(232,214,180,.9)}
.jar{width:40cqw;margin:0 auto;cursor:pointer}
.jar svg{width:100%;display:block}
.jar.shake{animation:jarShake .45s}
@keyframes jarShake{20%{transform:rotate(-10deg)}40%{transform:rotate(9deg)}60%{transform:rotate(-6deg)}80%{transform:rotate(4deg)}}
.hcard .note{min-height:14cqw;margin:3cqw 0 4cqw;padding:3cqw;background:#fbeede;border-radius:1.5cqw;box-shadow:0 1cqw 2cqw rgba(60,25,15,.2);
  font-family:'Marck Script','Great Vibes',cursive;font-size:6cqw;color:var(--wine);display:flex;align-items:center;justify-content:center}
.hcard .note.out{animation:noteOut .6s cubic-bezier(.2,.9,.3,1.3)}
@keyframes noteOut{from{transform:translateY(-14cqw) rotate(-8deg) scale(.5);opacity:0}}