.parcel-page{--paper:#fffdf7;--pk:#e78bb5;--hand:"Shantell Sans",cursive;background:radial-gradient(circle at center, #4c63e021 1.3px, transparent 1.4px) 0 0 / 24px 24px, var(--cream);margin-inline:calc(50% - 50vw);padding:6vmin max(20px,50vw - 430px) 12vh}.parcel-page .hand{font-family:var(--hand)}.parcel-page .masthead{text-align:center;margin-bottom:4vh}.parcel-page .kicker{font-family:var(--hand);color:var(--accent);margin:0;font-size:17px;display:inline-block;transform:rotate(-2deg)}.parcel-page .no{font-family:var(--font-display);letter-spacing:-.025em;margin:.05em 0 0;font-size:clamp(46px,9vw,88px);font-weight:800;line-height:1.02}.parcel-page .post{font-family:var(--font-serif);opacity:.8;margin:.2em 0 0;font-size:22px;font-style:italic}.parcel-page .post b{font-style:normal;font-family:var(--font-display);opacity:1;font-weight:600}.parcel-page .envelope{aspect-ratio:3/2;background:var(--paper);cursor:pointer;background-image:repeating-linear-gradient(45deg,var(--accent) 0 12px,transparent 12px 24px,var(--pk) 24px 36px,transparent 36px 48px);border-radius:8px;width:min(430px,84vw);margin:3vh auto 0;padding:8px;transition:transform .5s cubic-bezier(.2,.8,.2,1),opacity .5s;position:relative;box-shadow:0 30px 55px -24px #09103d80}.parcel-page .env-inner{background:var(--paper);border-radius:4px;position:absolute;inset:8px;overflow:hidden}.parcel-page .envelope:hover{transform:translateY(-6px)rotate(-1deg)}.parcel-page .flap{clip-path:polygon(0 0,100% 0,50% 100%);transform-origin:top;z-index:3;background:#f6efe0;border-radius:4px 4px 0 0;height:58%;transition:transform .6s;position:absolute;inset:8px 8px auto}.parcel-page .seal-w{z-index:4;background:radial-gradient(circle at 35% 30%,#6f83f2,var(--accent));color:#fff;border-radius:50%;place-items:center;width:58px;height:58px;font-size:24px;transition:opacity .3s;display:grid;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 4px 14px #4c63e099,inset 0 2px 4px #fff6}.parcel-page .env-label{text-align:center;color:var(--accent);z-index:2;font-family:var(--hand);font-size:16px;position:absolute;bottom:20px;left:0;right:0}.parcel-page .env-stamp{z-index:2;background:var(--pk);border-radius:4px;place-items:center;width:46px;height:56px;font-size:22px;display:grid;position:absolute;top:14px;right:16px;transform:rotate(6deg);box-shadow:0 2px 6px #0003}.parcel-page.opened .envelope{opacity:0;pointer-events:none;height:0;margin:0;padding:0;overflow:hidden;transform:translateY(-14px)scale(.94)rotate(-2deg)}.parcel-page.opened .flap{transform:rotateX(-168deg)}.parcel-page.opened .seal-w{opacity:0}.parcel-page .desk{grid-template-columns:repeat(3,1fr);place-items:start center;gap:24px;max-width:860px;margin:0 auto;padding:14px 0 0;list-style:none;display:grid}@media (width<=900px){.parcel-page .desk{grid-template-columns:repeat(2,1fr)}}@media (width<=560px){.parcel-page .desk{grid-template-columns:1fr;max-width:330px;margin:0 auto}}.parcel-page .obj{cursor:grab;touch-action:none;--dx:0px;--dy:0px;opacity:0;width:100%;max-width:300px;transform:translate(var(--dx),var(--dy)) translateY(-26px);filter:drop-shadow(0 14px 18px #09103d29);margin:0;transition:opacity .5s,transform .45s cubic-bezier(.2,.9,.3,1.2),box-shadow .3s;position:relative}.parcel-page.opened .obj{opacity:1;transform:translate(var(--dx),var(--dy)) var(--rest)}.parcel-page .obj:nth-child(3n+1){--rest:rotate(-2.6deg)}.parcel-page .obj:nth-child(3n+2){--rest:rotate(1.8deg) translateY(22px)}.parcel-page .obj:nth-child(3n+3){--rest:rotate(-1.4deg)}.parcel-page .obj:nth-child(6n+4){--rest:rotate(2.4deg)}.parcel-page .obj:nth-child(6n+6){--rest:rotate(2.2deg)}@media (width<=560px){.parcel-page .obj:nth-child(n){--rest:rotate(-1.5deg) translateY(0)}}.parcel-page.opened .obj:first-child{transition-delay:50ms}.parcel-page.opened .obj:nth-child(2){transition-delay:.12s}.parcel-page.opened .obj:nth-child(3){transition-delay:.19s}.parcel-page.opened .obj:nth-child(4){transition-delay:.26s}.parcel-page.opened .obj:nth-child(5){transition-delay:.33s}.parcel-page.opened .obj:nth-child(6){transition-delay:.4s}.parcel-page.opened .obj:nth-child(7){transition-delay:.47s}.parcel-page .obj:hover{transform:translate(var(--dx),var(--dy)) rotate(0) translateY(-8px) scale(1.03);z-index:10;filter:drop-shadow(0 22px 26px #09103d3d)}.parcel-page .obj.open{transform:translate(var(--dx),var(--dy)) rotate(0) scale(1.02);z-index:20;cursor:default;filter:drop-shadow(0 26px 34px #09103d47)}.parcel-page .obj.dragging{transform:translate(var(--dx),var(--dy)) rotate(-3deg) scale(1.05);z-index:30;cursor:grabbing;filter:drop-shadow(0 30px 40px #09103d57);transition:none}.parcel-page .obj--postcard:before,.parcel-page .obj--experiment:before,.parcel-page .obj--margin:before{content:"";z-index:5;background:#4c63e073;border-left:1px dashed #fff6;border-right:1px dashed #fff6;width:64px;height:24px;position:absolute;top:-12px;left:22%;transform:rotate(-8deg);box-shadow:0 1px 2px #0002}.parcel-page .obj--margin:before{background:#e78bb580;left:auto;right:20%;transform:rotate(7deg)}.parcel-page .f-letter,.parcel-page .f-page,.parcel-page .f-manila,.parcel-page .f-tag{background:var(--paper);border-radius:6px;padding:26px 22px;position:relative}.parcel-page .f-letter{flex-direction:column;justify-content:flex-end;gap:6px;min-height:150px;display:flex}.parcel-page .f-letter .crease{background:#09103d1f;height:1px;position:absolute;top:46%;left:0;right:0}.parcel-page .f-letter .seal{background:var(--pk);color:#fff;border-radius:50%;place-items:center;width:30px;height:30px;font-size:14px;display:grid;position:absolute;top:14px;left:50%;transform:translate(-50%);box-shadow:0 2px 5px #0003}.parcel-page .f-label{color:var(--ink);font-size:22px}.parcel-page .f-polaroid{background:#fff;border-radius:3px;padding:10px 10px 34px;box-shadow:0 2px 6px #0002}.parcel-page .f-polaroid img{object-fit:cover;border-radius:2px;width:100%;height:180px;display:block}.parcel-page .f-polaroid .f-cap{color:var(--ink);text-align:center;margin-top:10px;font-size:16px;line-height:1.15;display:block}.parcel-page .f-cassette{line-height:0;position:relative}.parcel-page .f-cassette img{width:100%;display:block}.parcel-page .f-cassette .cass-song{color:var(--ink);white-space:nowrap;text-overflow:ellipsis;background:#fffdf7;border-radius:2px;max-width:70%;padding:4px 12px;font-size:15px;line-height:1;position:absolute;top:26%;left:50%;overflow:hidden;transform:translate(-50%,-50%)rotate(-2deg);box-shadow:0 1px 3px #0003}.parcel-page .f-manila{background:#f3e2bd;flex-direction:column;justify-content:center;gap:8px;min-height:150px;display:flex}.parcel-page .f-manila .clip{background:0 0;border:3px solid #9aa0b5;border-radius:8px;width:16px;height:44px;position:absolute;top:-8px;left:26px}.parcel-page .f-manila .f-typed{letter-spacing:.14em;text-transform:uppercase;color:#8a7a4e;font-size:11px;font-weight:600}.parcel-page .f-manila .f-title{color:var(--ink);font-size:20px;line-height:1.1}.parcel-page .f-page{background:repeating-linear-gradient(transparent 0 26px,#09103d12 26px 27px),var(--paper);border:1px solid #09103d12;border-radius:6px;flex-direction:column;justify-content:center;gap:10px;min-height:150px;padding:22px;display:flex}.parcel-page .f-page .f-label{color:var(--accent);font-size:19px}.parcel-page .f-page .q{font-family:var(--font-serif);color:var(--ink);font-size:18px;font-style:italic;line-height:1.35}.parcel-page .f-tag{clip-path:polygon(14px 0,100% 0,100% 100%,0 100%,0 14px);flex-direction:column;justify-content:center;gap:4px;min-height:120px;display:flex}.parcel-page .f-tag .hole{background:var(--cream);border:2px solid #b9bccb;border-radius:50%;width:12px;height:12px;position:absolute;top:12px;left:12px}.parcel-page .f-tag .f-title{color:var(--ink);font-size:20px}.parcel-page .f-tag .f-sub{color:var(--accent);opacity:.8;font-size:14px}.parcel-page .f-sticker{line-height:0;position:relative}.parcel-page .f-sticker img{object-fit:contain;outline-offset:-1px;border-radius:14px;outline:5px solid #fff;width:100%;max-height:260px}.parcel-page .f-sticker .peel{clip-path:polygon(100% 0,100% 100%,0 100%);background:#fff;width:30px;height:30px;position:absolute;bottom:-2px;right:-2px;box-shadow:-2px -2px 4px #0002}.parcel-page .content{opacity:0;height:0;padding:0 4px;transition:opacity .35s;overflow:hidden}.parcel-page .obj.open .content{opacity:1;height:auto;padding:16px 6px 4px}.parcel-page .content h3{font-family:var(--font-display);letter-spacing:-.01em;margin:0 0 .4em;font-size:21px;font-weight:800}.parcel-page .content p{margin:.4em 0;font-size:15px;line-height:1.55}.parcel-page .content .lead{font-family:var(--hand);margin:.1em 0 .3em;font-size:19px}.parcel-page .content .src{font-family:var(--font-serif);opacity:.7;font-size:16px;font-style:italic}.parcel-page .content img{max-width:100%;height:auto;display:block}.parcel-page .quote{font-family:var(--font-serif);border-left:3px solid var(--accent);margin:.2em 0;padding-left:14px;font-size:23px;font-style:italic;line-height:1.4}.parcel-page .play{color:var(--accent);border-bottom:1px solid var(--accent);margin-top:6px;font-size:14px;font-weight:600;text-decoration:none;display:inline-block}.parcel-page .close{color:var(--accent);font-family:var(--hand);cursor:pointer;background:0 0;border:0;margin-top:16px;padding:0;font-size:15px;display:block}.parcel-page .back{text-align:center;color:var(--accent);font-family:var(--hand);margin-top:9vh;font-size:17px;text-decoration:none;display:block;transform:rotate(-1deg)}@media (prefers-reduced-motion:reduce){.parcel-page .obj{opacity:1;transform:var(--rest,none);transition:none}.parcel-page .envelope,.parcel-page .flap,.parcel-page .seal-w{transition:none}}
