:root{--paper: #fbf7ef;--paper-warm: #f1dfcf;--paper-edge: #d8c6b7;--ink: #2c302d;--muted: #6f6961;--sage-dark: #50654d;--seal: #a84f56;--shadow: 0 24px 80px rgba(52, 43, 35, .2);--serif: "Cormorant Garamond", "Iowan Old Style", "Palatino Linotype", Georgia, serif;--handwritten: "Dawning of a New Day", "Savoye LET", "Snell Roundhand", "Apple Chancery", cursive;--sans: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif}*{box-sizing:border-box}html{min-width:320px;background:#f3eee9}body{margin:0;min-width:320px;color:var(--ink);font-family:var(--sans)}button{font:inherit}.page{position:relative;display:grid;min-height:100svh;overflow:hidden;place-items:center;padding:clamp(22px,5vw,56px);background:radial-gradient(circle at 20% 16%,rgba(255,255,255,.65),transparent 28%),radial-gradient(circle at 82% 78%,rgba(80,101,77,.14),transparent 32%),linear-gradient(135deg,#f8f4ee,#edf3ed 48%,#f7eef0)}.texture{position:absolute;inset:0;opacity:.46;pointer-events:none;background-image:linear-gradient(90deg,rgba(120,108,92,.05) 1px,transparent 1px),linear-gradient(0deg,rgba(255,255,255,.42) 1px,transparent 1px);background-size:28px 28px,28px 28px;-webkit-mask-image:radial-gradient(circle at center,black 42%,transparent 84%);mask-image:radial-gradient(circle at center,black 42%,transparent 84%)}.invitation-shell{position:relative;z-index:1;display:grid;justify-items:center;width:min(100%,760px)}.paper-stage{position:relative;width:min(100%,650px);height:min(78svh,720px);min-height:530px;perspective:1400px}.envelope-button{position:absolute;inset:50% auto auto 50%;z-index:4;width:min(92vw,520px);aspect-ratio:1.48;padding:0;border:0;color:inherit;cursor:pointer;background:transparent;transform:translate(-50%,-46%);transition:transform .72s cubic-bezier(.22,.9,.28,1),opacity .28s ease .54s}.envelope-button:focus-visible{outline:3px solid rgba(80,101,77,.48);outline-offset:12px;border-radius:24px}.page--open .envelope-button{pointer-events:none;opacity:0;transform:translate(-50%,4%) scale(.9)}.envelope{position:relative;display:block;width:100%;height:100%}.envelope__shadow{position:absolute;right:8%;bottom:-12%;left:8%;height:22%;border-radius:50%;opacity:.3;background:radial-gradient(ellipse,rgba(57,45,35,.34),transparent 68%);filter:blur(8px)}.envelope__body,.envelope__flap,.envelope__card-peek{position:absolute;display:block}.envelope__body{inset:20% 0 0;z-index:1;overflow:hidden;border:1px solid rgba(122,97,76,.2);border-radius:9px;background:linear-gradient(28deg,transparent 49.6%,rgba(180,143,115,.18) 50%,transparent 50.4%) left bottom / 50% 100% no-repeat,linear-gradient(-28deg,transparent 49.6%,rgba(180,143,115,.18) 50%,transparent 50.4%) right bottom / 50% 100% no-repeat,linear-gradient(180deg,#fffaf4 0%,var(--paper-warm) 100%);box-shadow:var(--shadow)}.envelope__flap--back{inset:20% 0 0;z-index:3;border-radius:9px;background:linear-gradient(180deg,#fff6ed,#f1dcca);clip-path:polygon(0 0,100% 0,50% 58%)}.envelope__flap--front{inset:20% 0 0;z-index:2;border-radius:9px;background:linear-gradient(180deg,#fffbf51a,#e2cbbb73);clip-path:polygon(0 100%,50% 52%,100% 100%)}.envelope__card-peek{inset:28% 9% 32%;z-index:1;border:1px solid rgba(105,83,67,.12);border-radius:7px;opacity:.5;background:#fffaf4;transform:translateY(22px);transition:transform .76s cubic-bezier(.22,.9,.28,1)}.envelope-button:hover .envelope__card-peek,.envelope-button:focus-visible .envelope__card-peek{transform:translateY(10px)}.envelope-button:hover .wax-seal,.envelope-button:focus-visible .wax-seal{transform:translate(-50%,-50%) scale(1.04)}.wax-seal{position:absolute;top:49%;left:50%;z-index:5;display:grid;width:72px;aspect-ratio:1;place-items:center;border:1px solid rgba(100,47,45,.28);border-radius:50%;color:#fff8f1;background:radial-gradient(circle at 35% 32%,rgba(255,255,255,.24),transparent 16%),radial-gradient(circle at 68% 72%,rgba(122,50,53,.34),transparent 22%),var(--seal);box-shadow:0 10px 28px #67352b42;transform:translate(-50%,-50%);transition:transform .26s ease}.wax-seal span{font-family:var(--serif);font-size:2rem;font-weight:600;line-height:1}.open-copy{position:absolute;right:0;bottom:-48px;left:0;color:var(--sage-dark);font-size:.78rem;font-weight:700;letter-spacing:.18em;text-align:center;text-transform:uppercase}.opened-card{position:absolute;inset:50% 50% auto auto;z-index:3;width:min(90vw,430px);overflow:hidden;border:1px solid rgba(96,84,73,.18);border-radius:6px;background:linear-gradient(90deg,rgba(30,27,23,.05) 1px,transparent 1px) 0 0 / 9px 9px,linear-gradient(0deg,rgba(255,255,255,.44) 1px,transparent 1px) 0 0 / 11px 11px,#f6f0e7;box-shadow:0 28px 90px #372d233d;opacity:0;pointer-events:none;transform:translate(50%,-10%) rotateX(18deg) scale(.72);transform-origin:50% 92%;transition:opacity .18s ease .34s,transform .9s cubic-bezier(.18,.86,.22,1) .24s}.page--open .opened-card{opacity:1;pointer-events:auto;transform:translate(50%,-50%) rotateX(0) scale(1)}.fold{position:absolute;top:0;left:0;z-index:2;width:100%;height:78px;background:linear-gradient(180deg,#d9cbbcad,#f6f0e70f);clip-path:polygon(0 0,100% 0,50% 100%);transform:rotateX(0);transform-origin:50% 0;transition:transform .76s cubic-bezier(.2,.78,.22,1) .68s}.page--open .fold{transform:rotateX(-178deg)}.close-button{position:absolute;top:10px;right:10px;z-index:5;display:grid;width:30px;height:30px;place-items:center;border:1px solid rgba(60,52,44,.14);border-radius:50%;color:#2724219e;font-family:var(--sans);font-size:1.25rem;line-height:1;cursor:pointer;background:#fbf7efb8;box-shadow:0 8px 18px #372d2314;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);transition:color .18s ease,transform .18s ease,background-color .18s ease}.close-button:hover,.close-button:focus-visible{color:var(--ink);background:#fbf7efeb;transform:scale(1.04)}.opened-card__inner{position:relative;display:grid;gap:18px;padding:22px}.photo-frame{position:relative;width:100%;margin:0;overflow:hidden;border-radius:3px;background:#d9d4ca;box-shadow:inset 0 0 0 1px #25201b2e}.photo-frame:before,.photo-frame:after{position:absolute;inset:0;z-index:2;content:"";pointer-events:none}.photo-frame:before{opacity:.45;background:repeating-linear-gradient(90deg,rgba(255,255,255,.35) 0 1px,transparent 1px 5px),repeating-linear-gradient(0deg,rgba(40,35,30,.1) 0 1px,transparent 1px 6px);mix-blend-mode:overlay}.photo-frame:after{background:radial-gradient(circle at 28% 20%,rgba(255,255,255,.22),transparent 24%),linear-gradient(180deg,#f6f0e72e,#37302814);mix-blend-mode:soft-light}.photo-frame img{display:block;width:100%;aspect-ratio:4 / 5;object-fit:cover;filter:grayscale(1) contrast(.9) brightness(1.08);mix-blend-mode:multiply;opacity:.88}.message{display:grid;justify-items:center;padding:0 4px 7px;text-align:center}h1{max-width:100%;margin:0;color:#2c302dd1;font-family:var(--handwritten);font-size:clamp(1.58rem,3.6vw,1.95rem);font-style:normal;font-weight:400;line-height:1;letter-spacing:.015em;text-shadow:0 0 .35px rgba(44,48,45,.2);transform:rotate(-.8deg);white-space:nowrap}@media(max-width:680px){.page{padding:18px 14px}.paper-stage{height:min(82svh,760px);min-height:620px}.envelope-button{top:50%;width:min(94vw,430px)}.opened-card{width:min(100%,380px)}.opened-card__inner{gap:16px;padding:18px}}@media(max-width:400px){.opened-card{width:min(100%,356px)}h1{font-size:clamp(1.35rem,7vw,1.7rem)}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}