/* ---------- FRIDAY SERIES ---------- */
.friday .wrap{display:flex;flex-direction:column;gap:56px;padding:64px 48px}
.s-head{display:flex;align-items:flex-end;justify-content:space-between}
.s-head>div{display:flex;flex-direction:column;gap:8px}
.h2{font:140px/128px var(--display);letter-spacing:-.01em;margin:0;font-weight:400}
.acc{font:italic 40px/44px var(--serif);margin:0}
.s-note{width:340px;flex-shrink:0;padding-bottom:10px;font:15px/24px var(--mono);margin:0}

.posters{display:flex;justify-content:space-between;align-items:flex-start}
.poster{width:424px;flex-shrink:0;display:flex;flex-direction:column;gap:18px;rotate:var(--r);transition:rotate .6s var(--spring);animation:drop 1.4s var(--out) var(--d) both}
.poster:nth-child(1){--r:-2deg;--d:0s}
.poster:nth-child(2){--r:1.5deg;--d:.14s;padding-top:70px}
.poster:nth-child(3){--r:-1deg;--d:.28s;padding-top:20px}
@keyframes drop{from{transform:translateY(-70px) rotate(-6deg)}50%{transform:translateY(8px) rotate(2deg)}72%{transform:translateY(-3px) rotate(-1deg)}to{transform:none}}
.poster:hover{rotate:0deg}
.sheet{position:relative;width:424px;height:580px;background:var(--stock);overflow:clip;box-shadow:0 34px 40px -24px rgba(29,27,27,.38);transition:translate .5s var(--spring),box-shadow .5s}
.poster:hover .sheet{translate:0 -12px;box-shadow:0 54px 50px -28px rgba(29,27,27,.45)}
.edge{position:absolute;left:0;top:0;width:9px;height:100%;opacity:.8}
.sheet svg{position:absolute;left:0;top:18px;mix-blend-mode:multiply;transition:translate .5s var(--spring)}
.poster:hover .p2{translate:5px -4px}
.bill{position:absolute;left:28px;bottom:24px;width:368px;display:flex;flex-direction:column;gap:6px;z-index:6}
.bill-top{display:flex;justify-content:space-between;align-items:flex-end}
.bill-top>div{display:flex;flex-direction:column;gap:2px}
.prod{font:9px/12px var(--mono);letter-spacing:.2em}
.series{font:38px/38px var(--display)}
.stamp{width:58px;height:58px;border:2px solid currentColor;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;flex-shrink:0;transition:rotate .7s var(--spring)}
.poster:hover .stamp{rotate:-24deg}
.stamp b{font:400 28px/26px var(--display)}
.stamp small{font:9px/12px var(--mono);letter-spacing:.15em}
.act{font:30px/30px var(--display)}
.cap{font:13px/16px var(--mono);letter-spacing:.12em}

/* poster 31 — boat rocks, drops bob */
.boat{transform-box:view-box;transform-origin:212px 182px;animation:rock 3.4s ease-in-out infinite alternate}
@keyframes rock{from{transform:rotate(-3deg)}to{transform:rotate(3deg) translateY(5px)}}
.drop{animation:bob 2.6s ease-in-out infinite alternate;animation-delay:var(--d,0s)}
@keyframes bob{to{transform:translateY(12px)}}
/* poster 32 — suitcase jiggles, envelopes flutter, tag swings */
.case{animation:jiggle 2.6s ease-in-out infinite}
@keyframes jiggle{0%,68%,100%{transform:none}74%{transform:translateY(-8px) rotate(-2deg)}82%{transform:rotate(1.5deg)}}
.env{animation:flutter 3s ease-in-out infinite alternate;animation-delay:var(--d,0s)}
@keyframes flutter{from{transform:translateY(0) rotate(-7deg)}to{transform:translateY(-14px) rotate(7deg)}}
.tag{transform-box:view-box;transform-origin:226px 44px;animation:swing 2s ease-in-out infinite alternate}
@keyframes swing{from{transform:rotate(-9deg)}to{transform:rotate(7deg)}}
/* poster 33 — scales flow along the body, head sways, tongue flicks, grass sways */
.scales{animation:slither 1.1s linear infinite}
@keyframes slither{to{stroke-dashoffset:-32}}
.shead{transform-box:view-box;transform-origin:128px 88px;animation:sway 2.8s ease-in-out infinite alternate}
@keyframes sway{from{transform:rotate(-7deg)}to{transform:rotate(8deg) translateX(4px)}}
.tongue{transform-box:view-box;transform-origin:68px 96px;animation:flick 1.8s steps(1) infinite}
@keyframes flick{0%,55%{transform:scaleX(0)}58%,78%{transform:scaleX(1)}80%{transform:scaleX(0)}}
.grass{transform-origin:50% 100%;animation:grass 3s ease-in-out infinite alternate;animation-delay:var(--d,0s)}
@keyframes grass{from{transform:skewX(-8deg)}to{transform:skewX(8deg)}}
.sun{animation:sun 7s ease-in-out infinite alternate}
@keyframes sun{to{transform:translateY(12px)}}

/* ---------- IN RESIDENCE ---------- */
.res .wrap{display:flex;align-items:center;justify-content:center;gap:96px;padding:48px}
.r-art{position:relative;width:680px;height:907px;flex-shrink:0;touch-action:pan-y;cursor:pointer}
/* flower reacts to touch: petals lean away, stamens follow, tap shakes loose a petal + pollen */
.petal,.po{rotate:var(--pr,0deg);transition:rotate .6s var(--spring)}
.po{transform-box:view-box;transform-origin:300px 420px}
.spring{rotate:var(--sr,0deg);transition:rotate .5s var(--spring)}
.mag.shake{animation:shake .8s var(--spring)}
@keyframes shake{20%{transform:rotate(-4deg)}45%{transform:rotate(3deg)}70%{transform:rotate(-1.5deg)}}
.fly{position:absolute;width:64px;height:44px;pointer-events:none;z-index:4;animation:flyfall 3.4s ease-in forwards}
@keyframes flyfall{to{transform:translate(var(--fx),560px) rotate(var(--fr));opacity:0}}
.puff{position:absolute;width:9px;height:9px;border-radius:50%;background:var(--mari);mix-blend-mode:multiply;pointer-events:none;z-index:4;animation:puff 1.4s var(--out) forwards}
@keyframes puff{to{transform:translate(var(--fx),var(--fy)) scale(.3);opacity:0}}
.names .n1{translate:calc(var(--nx,0)*-16px) 0;transition:translate .6s var(--spring)}
.names .n2{translate:calc(var(--nx,0)*16px) 0;transition:translate .6s var(--spring)}
.aqua{position:absolute;left:-40px;top:0;width:720px;height:800px;background:url(assets/block-aqua.png) center/100% 100%;mix-blend-mode:multiply;animation:roll 1.6s var(--out) both}
@keyframes roll{from{clip-path:inset(0 0 100% 0)}to{clip-path:inset(0)}}
.mag{position:absolute;left:10px;top:70px;width:640px;height:740px;transform-origin:300px 720px;animation:magsway 8s ease-in-out 3.5s infinite alternate}
@keyframes magsway{from{rotate:-1.2deg}to{rotate:1.4deg}}
.mag svg{position:absolute;left:0;top:0;width:620px;height:720px}
.mag .m{mix-blend-mode:multiply}
.petal{transform-box:view-box;transform-origin:300px 420px;animation:open 1.2s var(--spring) both;animation-delay:calc(.7s + var(--i)*.1s)}
@keyframes open{from{transform:scale(.12) rotate(-24deg)}}
.loose{animation:fall 7s ease-in-out infinite alternate;animation-delay:var(--d,0s)}
@keyframes fall{to{transform:translate(-20px,40px) rotate(46deg)}}
.leaf{transform-origin:0% 50%;animation:unfurl 1.2s var(--spring) both;animation-delay:calc(1.3s + var(--i)*.12s)}
@keyframes unfurl{from{transform:scale(0) rotate(-30deg)}}
.trail circle{animation:dotup .6s var(--out) both}
.trail circle:nth-child(1){animation-delay:1.7s}.trail circle:nth-child(2){animation-delay:1.8s}.trail circle:nth-child(3){animation-delay:1.9s}.trail circle:nth-child(4){animation-delay:2s}.trail circle:nth-child(5){animation-delay:2.1s}
@keyframes dotup{from{opacity:0;transform:translateY(10px) scale(0)}}
.draw{stroke-dasharray:1;stroke-dashoffset:1;animation:draw 1.5s var(--out) both;animation-delay:var(--d,2s)}
@keyframes draw{to{stroke-dashoffset:0}}
.fade{animation:fadein 1s ease both;animation-delay:var(--d,3s)}
@keyframes fadein{from{opacity:0}}
.redline{animation:land 1.1s var(--spring) 3.6s both}
@keyframes land{from{transform:translate(-9px,-6px)}}
.spring{transform-box:view-box;transform-origin:300px 405px;animation:springout 1s var(--spring) both;animation-delay:var(--d,2.2s)}
@keyframes springout{from{transform:scale(0)}}
.pollen circle{animation:pollen 4.5s ease-in infinite}
.pollen circle:nth-child(2n){animation-delay:-1.5s}.pollen circle:nth-child(3n){animation-delay:-3s}
@keyframes pollen{from{transform:translateY(0);opacity:1}to{transform:translateY(-48px);opacity:0}}
.names{position:absolute;left:24px;top:575px;width:680px;height:340px}
.names span{position:absolute;font:206px/206px var(--display);letter-spacing:-.01em;mix-blend-mode:multiply;white-space:nowrap}
.names .n1{left:0;top:0;color:var(--red);animation:slL 1.4s var(--spring) .3s both}
.names .n2{left:160px;top:129px;color:var(--blue);animation:slR 1.4s var(--spring) .45s both}
@keyframes slL{from{transform:translateX(-100px)}}
@keyframes slR{from{transform:translateX(100px)}}

.r-copy{width:560px;flex-shrink:0;display:flex;flex-direction:column;gap:28px}
.quote{font:italic 40px/46px var(--serif);color:var(--blue);margin:0}
.dates{border-top:1.5px solid var(--ink);display:flex;flex-direction:column}
.row{position:relative;isolation:isolate;display:flex;padding-block:12px;border-bottom:1.5px solid var(--ink);font:700 13px/16px var(--mono);letter-spacing:.12em}
.row::before,.drow::before{content:"";position:absolute;inset:0;background:var(--pink);z-index:-1;transform:scaleX(0);transform-origin:left;transition:transform .5s var(--out)}
.row:hover::before,.drow:hover::before{transform:scaleX(1)}
.row .d{width:96px;flex-shrink:0;color:var(--red);transition:translate .35s var(--spring)}
.row .d.blue{color:var(--blue)}
.row:hover .d{translate:8px 0}
.run{display:flex;align-items:baseline;gap:10px;padding-top:18px}
.run i{font:italic 26px/32px var(--serif);color:var(--blue)}
.run b{font:400 36px/36px var(--display);color:var(--blue)}
.stats{border-top:1.5px solid var(--ink);display:flex;gap:28px;padding-top:8px}
.stat{display:flex;flex-direction:column;gap:6px;padding-top:16px}
.stat b{font:400 44px/44px var(--display)}
.stat span{font:12px/16px var(--mono);letter-spacing:.14em}