:root{font-family:Inter,system-ui,sans-serif;color:#342a27;background:#faf5ef}*{box-sizing:border-box}body{margin:0;min-width:320px}button{font:inherit}.site{min-height:100vh;padding:22px;background:radial-gradient(circle at 12% 10%,#e8aea02e,transparent 28%),radial-gradient(circle at 90% 80%,#ecd3b238,transparent 30%),#faf5ef;overflow:hidden}.site header,.progress,.screen{width:min(720px,100%);margin-left:auto;margin-right:auto}.site header{display:flex;justify-content:space-between;font-size:10px;letter-spacing:.18em;font-weight:800;color:#a17d74;margin-bottom:9px}.progress{height:2px;background:#a17d7428;margin-bottom:12px}.progress i{display:block;height:100%;background:#9b675e;transition:.6s}.screen{min-height:calc(100vh - 85px);display:flex;flex-direction:column;justify-content:center;animation:in .55s ease both}@keyframes in{0%{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}.label{font-size:10px;letter-spacing:.2em;font-weight:800;color:#a16f66;margin-bottom:21px}.hero h1{font-family:Georgia,serif;font-size:clamp(48px,9vw,82px);font-weight:400;letter-spacing:-.045em;line-height:1;margin:0}.hero h1 em,.finalScreen h1 em{color:#a56d64;font-style:italic}.screen>p{max-width:580px;color:#76645f;font-size:17px;line-height:1.75;margin:25px 0 32px}.primary{align-self:flex-start;border:0;border-radius:999px;padding:15px 22px;background:#8f5f57;color:#fff;cursor:pointer;box-shadow:0 10px 25px #8f5f5728;transition:.2s}.primary:hover{transform:translateY(-2px)}.primary:disabled{opacity:.55;cursor:wait}.primary b{margin-left:18px}.objectScreen{align-items:center;text-align:center}.objectScreen h2,.envelopeScreen h2,.letter h2{font-family:Georgia,serif;font-weight:400;font-size:clamp(40px,7vw,62px);letter-spacing:-.045em;line-height:1.02;margin:0}.objectScreen>p{margin-left:auto;margin-right:auto}.chocolateBox{position:relative;width:180px;height:145px;border:0;background:transparent;cursor:pointer;margin:5px 0 24px;transition:.35s}.boxBase{position:absolute;left:20px;right:20px;bottom:0;height:82px;background:#8f5f57;border-radius:8px 8px 14px 14px;color:#fff;font-size:42px;display:grid;place-items:center;box-shadow:0 18px 30px #6e423b22}.boxLid{position:absolute;z-index:2;left:10px;right:10px;top:23px;height:45px;border-radius:9px;background:#9d6b62;display:grid;place-items:center;font-size:26px;box-shadow:0 5px 10px #6e423b22;transition:.5s}.ribbon{position:absolute;background:#d4a36e;z-index:3}.ribbon.vertical{width:20px;height:120px;left:80px;top:15px}.ribbon.horizontal{height:20px;width:170px;left:5px;top:55px}.chocolateBox.opened .boxLid{transform:translateY(-55px) rotate(-4deg)}.hiddenMessage{max-width:500px;opacity:0;transform:translateY(8px);pointer-events:none;transition:.5s}.hiddenMessage.show{opacity:1;transform:none;pointer-events:auto}.hiddenMessage p{font-family:Georgia,serif;font-size:20px;line-height:1.65;color:#67534e}.link{border:0;background:transparent;color:#96665e;font-weight:700;padding:8px 0;border-bottom:1px solid #96665e55;cursor:pointer}.present{position:relative;width:180px;height:170px;border:0;background:transparent;cursor:pointer;margin:0 0 20px;transition:.3s}.presentBody{position:absolute;left:20px;right:20px;bottom:0;height:110px;background:#b77c72;border-radius:8px 8px 14px 14px;display:grid;place-items:center;color:#fff;font-size:35px;box-shadow:0 18px 30px #6e423b22}.presentBody i{position:absolute;width:22px;top:0;bottom:0;background:#d6a574}.presentLid{position:absolute;z-index:2;left:8px;right:8px;top:35px;height:48px;background:#a86c63;border-radius:9px;transition:.5s}.presentLid:after{content:"";position:absolute;left:72px;top:-15px;width:35px;height:30px;border:6px solid #d6a574;border-bottom:0;border-radius:30px 30px 0 0}.present.unwrapped .presentLid{transform:translateY(-65px) rotate(3deg)}.envelopes{display:grid;grid-template-columns:repeat(3,1fr);gap:13px;margin:28px 0}.envelope{min-height:210px;border:1px solid #8f5f5718;background:#fffdfb;border-radius:18px;padding:20px;text-align:left;cursor:pointer;display:flex;flex-direction:column;align-items:flex-start;transition:.25s}.envelope:hover{transform:translateY(-3px);border-color:#b88b82}.envelope.open{background:#fff1ea}.envIcon{font-size:30px;margin-bottom:auto}.envelope strong{font-family:Georgia,serif;font-size:22px;font-weight:400}.envelope small{margin-top:8px;color:#a27f77;font-size:10px;letter-spacing:.12em;text-transform:uppercase}.envelope p{font-size:14px;line-height:1.65;color:#715d58;margin:10px 0}.letterBody{max-width:610px;border-top:1px solid #8f5f5724;border-bottom:1px solid #8f5f5724;margin:18px 0 32px;padding:20px 0}.letterBody p{font-family:Georgia,serif;font-size:20px;line-height:1.75;color:#67534e}.error{color:#a14e47;font-size:13px}.final{display:flex;align-items:center;justify-content:center}.finalScreen{text-align:center;max-width:680px}.finalHeart{font-size:54px;color:#a56d64;margin-bottom:8px}.finalScreen h1{font-family:Georgia,serif;font-weight:400;font-size:clamp(48px,8vw,70px);line-height:1;letter-spacing:-.04em;margin:0}.finalIntro{max-width:500px;margin:25px auto;color:#76645f;line-height:1.7}.giftCard{max-width:470px;margin:30px auto;padding:30px;background:#fff0e8;border:1px dashed #bd8e85;border-radius:22px}.code{font:800 24px ui-monospace,monospace;margin:17px 0;overflow-wrap:anywhere}.giftCard p{font-size:13px;color:#806b65;line-height:1.6}.finalScreen small{color:#8b746d}@media(max-width:650px){.site{padding:17px}.screen{min-height:calc(100vh - 72px)}.envelopes{grid-template-columns:1fr}.envelope{min-height:150px}.hero h1{font-size:50px}}