/* ========== envelope.css · 开场信封 ========== */
.overlay{position:fixed;inset:0;z-index:50;display:flex;align-items:center;justify-content:center;
         height:100vh;height:100dvh;
         background:linear-gradient(165deg,rgba(253,250,244,.97),rgba(249,241,240,.96) 55%,rgba(243,237,246,.97));
         transition:opacity .9s ease}
.overlay.gone{opacity:0;pointer-events:none}
.env-stage{text-align:center;animation:float 5.5s ease-in-out infinite}
.envelope{position:relative;width:min(500px,86vw);aspect-ratio:10/6.6;border:0;background:transparent;
          cursor:pointer;perspective:1100px;
          filter:drop-shadow(0 26px 38px rgba(168,118,88,.25));transition:filter .4s}
.envelope:hover{filter:drop-shadow(0 30px 46px rgba(168,118,88,.35))}
.envelope:focus-visible{outline:2px solid var(--gold);outline-offset:8px;border-radius:12px}
.envelope>*{pointer-events:none}
.env-back{position:absolute;inset:0;background:linear-gradient(180deg,#faf3e8,#f4e9d9);
          border:1px solid rgba(190,150,95,.4);border-radius:12px;z-index:1}
.env-letter{position:absolute;left:6%;right:6%;top:9%;bottom:12%;z-index:2;
            background:linear-gradient(180deg,#fffdf8,#fdf8ee);border:1px solid rgba(190,150,95,.35);
            border-radius:8px;box-shadow:0 6px 18px rgba(150,110,70,.12);
            display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;
            transform:translateY(4%);
            transition:transform 1.15s cubic-bezier(.3,.7,.25,1) .95s}
.env-letter-title{font-family:'Ma Shan Zheng','KaiTi','STKaiti',cursive;color:#b98a44;
                  font-size:.95rem;letter-spacing:.25em;text-indent:.25em}
.env-letter i{display:block;height:1px;background:rgba(185,138,68,.28)}
.env-letter .l1{width:70%}
.env-letter .l2{width:44%}
.env-letter .l3{width:56%}
.env-heart{width:18px;height:18px;fill:rgba(201,138,146,.65);margin-bottom:2px}
.overlay.opening .env-letter{transform:translateY(-58%)}
.env-pocket{position:absolute;inset:0;z-index:3;border-radius:12px;
            background:linear-gradient(200deg,#f7ecdb,#f0e2cd);
            clip-path:polygon(0 0,50% 46%,100% 0,100% 100%,0 100%);
            box-shadow:inset 0 3px 12px rgba(150,105,60,.14)}
.env-flap{position:absolute;left:0;right:0;top:0;height:47%;z-index:4;border-radius:12px 12px 0 0;
          background:linear-gradient(180deg,#f8efe0,#f1e3cf);
          clip-path:polygon(0 0,100% 0,50% 100%);transform-origin:50% 0;
          transition:transform 1s cubic-bezier(.6,0,.25,1) .35s}
.overlay.opening .env-flap{transform:rotateX(-176deg);z-index:1}
.env-seal{position:absolute;left:50%;top:46%;width:66px;height:66px;z-index:5;border-radius:50%;
          transform:translate(-50%,-50%);
          background:radial-gradient(circle at 35% 30%,#dd97a0,#b25d68 70%,#9d4f5b);
          display:flex;align-items:center;justify-content:center;
          box-shadow:0 4px 12px rgba(150,70,80,.35),inset 0 2px 6px rgba(255,255,255,.25);
          transition:opacity .5s ease,transform .5s ease}
.env-seal svg{width:26px;height:26px;fill:rgba(255,248,244,.85)}
.overlay.opening .env-seal{opacity:0;transform:translate(-50%,-50%) scale(1.3) rotate(16deg)}
.sp{position:absolute;width:5px;height:5px;border-radius:50%;background:var(--gold-light);
    opacity:0;filter:blur(.4px);animation:tw 3.4s ease-in-out infinite}
.s1{left:-6%;top:18%}.s2{right:-8%;top:30%;animation-delay:.9s}
.s3{left:12%;bottom:-9%;animation-delay:1.7s}.s4{right:10%;bottom:-5%;animation-delay:2.4s}
.env-hint{margin-top:36px;font-size:.8rem;letter-spacing:.42em;text-indent:.42em;color:#a98f6d;
          animation:pulse 3s ease-in-out infinite;transition:opacity .5s}
.overlay.opening .env-hint{opacity:0}