/* ==========================================================================
   The gift stage (shared) + each card's scenes
   ========================================================================== */
.gv{position:fixed;inset:0;z-index:70;overflow:hidden;background:var(--t-bg);color:var(--t-fg);font-family:var(--fb);-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;touch-action:manipulation;-webkit-tap-highlight-color:transparent}
.gv[hidden]{display:none}
.gv-bg{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.gv-scenes{position:absolute;inset:0;max-width:540px;margin:0 auto;container-type:size}
.gv-top{position:absolute;left:0;right:0;top:0;z-index:20;max-width:540px;height:64px;margin:0 auto;display:flex;align-items:center;justify-content:center;padding:0 16px;pointer-events:none}
.gv-top>*{pointer-events:auto}
.gv-dots{display:flex;gap:5px}
.gv-dots i{width:12px;height:4px;border-radius:4px;background:var(--t-chip);transition:width .5s var(--ease),background .4s}
.gv-dots i.done{background:var(--t-mut);opacity:.6}
.gv-dots i.on{width:26px;background:var(--t-acc)}
.gv-snd{position:absolute;right:14px;top:12px;display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:var(--t-chip);font-size:17px;transition:transform .3s var(--spring)}
.gv-snd:active{transform:scale(.9)}
.gv-badge{position:absolute;left:14px;top:20px;padding:4px 10px;border-radius:999px;background:#ffe066;color:#3a2a10;font:800 10px var(--fb);letter-spacing:.14em;text-transform:uppercase}

.sc{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;padding:76px 24px calc(48px + env(safe-area-inset-bottom));text-align:center;opacity:0;transform:scale(1.04);transition:opacity .8s var(--ease),transform 1s var(--ease);pointer-events:none;overflow:hidden}
.sc.in{opacity:1;transform:none;pointer-events:auto}
.sc.out{opacity:0;transform:scale(.96)}
.sc>*{position:relative;z-index:1}

.gv-eyebrow{font:800 11px var(--fb);letter-spacing:.24em;text-transform:uppercase;color:var(--t-mut)}
.gv-title{font:750 clamp(30px,10cqi,52px)/1.02 var(--fd);letter-spacing:-.035em;color:var(--t-fg);text-wrap:balance;overflow-wrap:anywhere}
.gv-title em{font-style:normal;color:var(--t-acc)}
.gv-name{font:700 clamp(46px,17cqi,92px)/.95 var(--fh);color:var(--t-acc);overflow-wrap:anywhere}
.gv-sub{max-width:32ch;font-size:clamp(15px,4.2cqi,18px);line-height:1.5;color:var(--t-mut);text-wrap:pretty}
.gv-hand{font:700 clamp(20px,6.2cqi,28px)/1.25 var(--fh);color:var(--t-acc)}
.gv-hint{position:absolute;left:0;right:0;bottom:calc(22px + env(safe-area-inset-bottom));z-index:3;font:700 20px var(--fh);color:var(--t-mut);animation:hintPulse 2.2s ease-in-out infinite;pointer-events:none;transition:opacity .3s}
.gv-hint.gone{opacity:0}
@keyframes hintPulse{50%{opacity:.45;transform:translateY(-3px)}}

.gv-actions{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:6px;transition:opacity .4s}
.gv-actions.used{opacity:0;pointer-events:none}
.gv-actions.gv-final.used{opacity:1;pointer-events:auto}
.gv-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:52px;padding:0 26px;border-radius:999px;background:var(--t-btn);color:var(--t-btn-fg);font:800 16px var(--fb);box-shadow:0 16px 30px -16px rgb(0 0 0 / .55);transition:transform .35s var(--spring),box-shadow .3s;animation:btnIn .6s var(--spring) both}
.gv-btn:hover{transform:translateY(-2px)}
.gv-btn:active{transform:scale(.95)}
.gv-btn.ghost{background:var(--t-chip);color:var(--t-fg);box-shadow:none}
@keyframes btnIn{from{opacity:0;transform:translateY(12px) scale(.9)}}
.gv-alt{margin-top:4px;padding:8px 12px;border-radius:999px;font:700 13.5px var(--fb);color:var(--t-mut);text-decoration:underline;text-underline-offset:3px}
.gv-alt:hover{color:var(--t-fg)}
.gv-make{margin-top:14px;font:600 13px var(--fb);color:var(--t-mut);text-decoration:underline;text-underline-offset:3px}

.gv-paper{position:relative;width:100%;max-width:440px;max-height:60cqh;overflow:auto;padding:26px 24px;border-radius:18px;background:#fffdf8;color:#2a2238;text-align:left;box-shadow:0 30px 60px -30px rgb(0 0 0 / .6);scrollbar-width:thin}
.gv-paper .to{font:700 26px var(--fh);color:#c2185b}
.gv-paper .body{margin-top:8px;font:600 21px/1.45 var(--fh);white-space:pre-wrap;overflow-wrap:anywhere;min-height:2em}
.gv-paper .sig{margin-top:14px;text-align:right;font:700 24px var(--fh);color:#c2185b}
.typing::after{content:"|";margin-left:1px;animation:blink 1s steps(1) infinite}

.gv-photo{margin:0;padding:10px 10px 12px;background:#fff;border-radius:6px;box-shadow:0 24px 44px -20px rgb(0 0 0 / .6)}
.gv-photo img{display:block;width:100%;aspect-ratio:1;object-fit:cover;border-radius:3px;pointer-events:none}
.gv-photo figcaption{margin-top:8px;font:700 20px/1.1 var(--fh);color:#2a2238;text-align:center}

.gv-count{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;width:100%;max-width:400px}
.gv-count div{display:flex;flex-direction:column;align-items:center;padding:14px 4px;border-radius:16px;background:var(--t-chip)}
.gv-count b{font:800 clamp(24px,8cqi,36px)/1 var(--fd);color:var(--t-fg);font-variant-numeric:tabular-nums}
.gv-count small{margin-top:4px;font:700 10px var(--fb);letter-spacing:.12em;text-transform:uppercase;color:var(--t-mut)}

.gv-drift{position:absolute;inset:0;z-index:0 !important;overflow:hidden;pointer-events:none}
.gv-drift i{position:absolute;top:-10%;font-style:normal;font-size:var(--sz);opacity:.8;animation:driftDown var(--dur) linear var(--delay) infinite}
.gv-drift.up i{top:auto;bottom:-10%;animation-name:driftUp}
@keyframes driftDown{to{transform:translate(var(--sway),118cqh) rotate(320deg)}}
@keyframes driftUp{to{transform:translate(var(--sway),-118cqh) rotate(-40deg);opacity:0}}
.gv-fw{position:absolute;inset:0;width:100%;height:100%;z-index:0 !important;pointer-events:none}

/* hold-to-open ring used by several cards */
.gv-holdring{position:relative;display:grid;place-items:center;width:150px;height:150px;border-radius:50%;cursor:pointer;touch-action:none}
.gv-holdring::before{content:"";position:absolute;inset:0;border-radius:50%;background:conic-gradient(var(--t-acc) calc(var(--hold,0) * 360deg),var(--t-chip) 0);-webkit-mask:radial-gradient(circle,transparent 63%,#000 64%);mask:radial-gradient(circle,transparent 63%,#000 64%)}
.gv-holdring.holding{animation:holdShake .3s linear infinite}
@keyframes holdShake{25%{transform:translate(1px,-1px) rotate(-1deg)}75%{transform:translate(-1px,1px) rotate(1deg)}}

@media (min-width:700px){
  .gv::before{content:"";position:absolute;inset:0;background:inherit;filter:brightness(.7)}
  .gv-scenes{box-shadow:0 0 120px rgb(0 0 0 / .35)}
  .gv-scenes::before{content:"";position:absolute;inset:0;background:var(--t-bg)}
}
@media (prefers-reduced-motion:reduce){
  .sc{transition:opacity .2s}
}

/* ==========================================================================
   Birthday
   ========================================================================== */
.c-choc{--ck1:#6b3d2a;--ck2:#43231a;--ice:#2e1a12}
.c-straw{--ck1:#ffc1d1;--ck2:#ff8fab;--ice:#fff0f5}
.c-vanilla{--ck1:#fde9c4;--ck2:#f4c77d;--ice:#fffaf0}
.c-rainbow{--ck1:#fff0f5;--ck2:#ffb6c9;--ice:#ffffff}
.mini-cake{position:relative;width:54px;height:46px}
.mini-cake::before{content:"";position:absolute;left:4px;right:4px;bottom:3px;height:24px;border-radius:7px 7px 5px 5px;background:linear-gradient(var(--ice) 0 30%,var(--ck1) 30% 66%,var(--ck2) 66% 74%,var(--ck1) 74%);box-shadow:0 3px 0 #e8dfe6}
.mini-cake::after{content:"";position:absolute;left:14px;right:14px;bottom:27px;height:15px;border-radius:5px 5px 3px 3px;background:linear-gradient(var(--ice) 0 42%,var(--ck1) 42%)}

.bd-box{position:relative;width:min(220px,54cqi);aspect-ratio:1;margin:14px 0 4px;cursor:pointer}
.bd-box:not(.open){animation:boxWiggle 2.8s ease-in-out 1s infinite}
@keyframes boxWiggle{0%,78%,100%{transform:rotate(0)}84%{transform:rotate(-4deg)}90%{transform:rotate(4deg)}95%{transform:rotate(-2deg)}}
.bd-body{position:absolute;left:8%;right:8%;bottom:0;height:64%;border-radius:12px;background:linear-gradient(90deg,transparent 43%,#ffe066 43% 57%,transparent 57%),linear-gradient(160deg,#ff5a8a,#E91E63);box-shadow:inset 0 -18px 30px rgb(0 0 0 / .14),0 30px 40px -20px rgb(0 0 0 / .55)}
.bd-lid{position:absolute;left:3%;right:3%;top:24%;z-index:2;height:17%;border-radius:9px;background:linear-gradient(90deg,transparent 43%,#ffe066 43% 57%,transparent 57%),linear-gradient(180deg,#ff7aa2,#f04078);box-shadow:0 7px 0 rgb(0 0 0 / .12);transition:transform 1s var(--spring)}
.bd-bow{position:absolute;left:50%;top:5%;z-index:3;width:50%;height:22%;transform:translateX(-50%);transition:transform 1s var(--spring),opacity .7s}
.bd-bow::before,.bd-bow::after{content:"";position:absolute;top:0;width:52%;height:100%;border:9px solid #ffe066;border-radius:50%}
.bd-bow::before{left:-2%;transform:rotate(-20deg)}
.bd-bow::after{right:-2%;transform:rotate(20deg)}
.bd-tail{position:absolute;left:62%;top:38%;z-index:4;width:15px;height:calc(76px + var(--pull,0px));border-radius:0 0 3px 3px;background:linear-gradient(90deg,#f7c948,#ffe066);cursor:grab;touch-action:none;transform:rotate(-8deg);transform-origin:top;transition:opacity .3s}
.bd-tail::after{content:"";position:absolute;bottom:-12px;left:0;width:15px;height:14px;background:#ffe066;clip-path:polygon(0 0,100% 0,100% 100%,50% 55%,0 100%)}
.bd-tail::before{content:"";position:absolute;inset:-14px -16px;border-radius:12px}
.bd-box.open{animation:none}
.bd-box.open .bd-lid{transform:translateY(-150%) rotate(-20deg)}
.bd-box.open .bd-bow{transform:translate(-50%,-280%) rotate(40deg);opacity:0}
.bd-box.open .bd-tail{opacity:0}
.bd-pull{animation:hintPulse 2s ease-in-out infinite}

.bd-cake{position:relative;width:min(260px,64cqi);aspect-ratio:1/.92;margin-top:34px}
.bd-cake .plate{position:absolute;left:-7%;right:-7%;bottom:0;height:10%;border-radius:50%;background:linear-gradient(#fff,#e2d7e0);box-shadow:0 16px 26px -12px rgb(0 0 0 / .55)}
.bd-half{position:absolute;inset:0;transition:transform 1s var(--spring)}
.bd-half.l{clip-path:inset(-20% 50% 0 -20%)}
.bd-half.r{clip-path:inset(-20% -20% 0 50%)}
.bd-cake .tier{position:absolute;left:50%;transform:translateX(-50%);overflow:hidden;box-shadow:inset -10px 0 0 rgb(0 0 0 / .06)}
.bd-cake .t1{bottom:6%;width:90%;height:42%;border-radius:16px 16px 10px 10px;background:linear-gradient(var(--ck1) 0 56%,var(--ck2) 56% 64%,var(--ck1) 64%)}
.bd-cake .t2{bottom:46%;width:64%;height:30%;border-radius:14px 14px 8px 8px;background:linear-gradient(var(--ck1) 0 54%,var(--ck2) 54% 64%,var(--ck1) 64%)}
.bd-cake .tier::before{content:"";position:absolute;left:0;right:0;top:0;height:30%;background:var(--ice)}
.bd-cake .tier::after{content:"";position:absolute;left:-4px;right:-4px;top:26%;height:16%;background:radial-gradient(circle at 50% 0,var(--ice) 58%,transparent 61%) 0 0/20px 100% repeat-x}
.bd-cake .drip{position:absolute;left:50%;bottom:62%;width:58%;height:12%;transform:translateX(-50%);display:none;background:radial-gradient(circle,#E91E63 1.6px,transparent 2.2px) 0 0/14px 9px,radial-gradient(circle,#2bb673 1.6px,transparent 2.2px) 7px 4px/14px 9px,radial-gradient(circle,#5ab8f0 1.6px,transparent 2.2px) 3px 2px/17px 11px}
.c-vanilla .drip,.c-rainbow .drip{display:block}
.bd-cake::after{content:"";position:absolute;left:50%;bottom:6%;z-index:0;width:0;height:70%;transform:translateX(-50%);background:linear-gradient(var(--ice) 0 8%,var(--ck1) 8% 44%,var(--ck2) 44% 52%,var(--ck1) 52%);transition:width 1s var(--spring)}
.c-rainbow::after{background:linear-gradient(#fff 0 8%,#ff6b6b 8% 23%,#ffb703 23% 38%,#ffe066 38% 53%,#2bb673 53% 68%,#5ab8f0 68% 84%,#9b51e0 84%)}
.bd-cake.cut::after{width:22px}
.bd-cake.cut .bd-half.l{transform:translateX(-16px) rotate(-3deg)}
.bd-cake.cut .bd-half.r{transform:translateX(16px) rotate(3deg)}
.bd-cake.cuttable{cursor:ns-resize;touch-action:none}
.bd-cake.cuttable:not(.cut)::before{content:"";position:absolute;left:50%;top:6%;bottom:8%;z-index:4;border-left:2px dashed var(--t-mut);opacity:.7;animation:hintPulse 1.6s ease-in-out infinite}
.bd-cake.glow{filter:drop-shadow(0 -14px 40px rgb(255 183 3 / .5))}
.bd-candles{position:absolute;left:50%;bottom:76%;z-index:3;display:flex;gap:clamp(6px,2.4cqi,12px);transform:translateX(-50%);transition:opacity .6s}
.bd-candles.gone{opacity:0;pointer-events:none}
.bd-candle{position:relative;width:13px;height:46px;border-radius:4px;background:repeating-linear-gradient(135deg,#fff 0 6px,#E91E63 6px 10px);box-shadow:inset -3px 0 0 rgb(0 0 0 / .08);cursor:pointer}
.bd-candle::before{content:"";position:absolute;left:50%;top:-8px;width:2px;height:8px;margin-left:-1px;background:#333}
.bd-candle::after{content:"";position:absolute;inset:-18px -8px -6px}
.bd-candle .flame{position:absolute;left:50%;bottom:calc(100% + 5px);width:15px;height:24px;margin-left:-7.5px;border-radius:50% 50% 50% 50%/60% 60% 40% 40%;background:radial-gradient(circle at 50% 72%,#fff 0 18%,#ffe066 34%,#ff9f43 68%,transparent 71%);opacity:0;transform:scale(.3);transform-origin:50% 100%;transition:opacity .2s,transform .35s var(--spring);filter:drop-shadow(0 0 10px #ffb703);pointer-events:none}
.bd-candle.lit .flame{opacity:1;transform:scale(1);animation:flick .45s ease-in-out infinite alternate}
.bd-candle.out .flame{opacity:0;transform:scale(.2) translateY(-8px);animation:none}
.bd-candle .smoke{position:absolute;left:50%;bottom:100%;width:10px;height:30px;margin-left:-5px;border-radius:50%;background:rgb(210 210 220 / .55);filter:blur(4px);opacity:0;pointer-events:none}
.bd-candle.out .smoke{animation:smoke 1.8s ease-out forwards}
.bd-candle:not(.lit)::before{box-shadow:0 0 0 3px rgb(255 224 102 / .0);animation:wickHint 1.4s ease-in-out infinite}
@keyframes wickHint{50%{box-shadow:0 0 8px 3px rgb(255 224 102 / .7)}}
@keyframes flick{to{transform:scale(1.06,1.14) rotate(3deg)}}
@keyframes smoke{0%{opacity:.85;transform:translateY(0) scale(.6)}100%{opacity:0;transform:translateY(-46px) scale(1.7)}}
.bd-topper{position:absolute;right:0;bottom:78%;z-index:3;font:800 36px/1 var(--fd);color:#ffe066;text-shadow:0 3px 0 #c2185b;transform:rotate(8deg);transition:opacity .6s}
.bd-topper.gone{opacity:0}

.bd-sky{position:relative;width:100%;height:36cqh;min-height:200px}
.bd-balloon{position:absolute;left:var(--x);top:var(--y);width:60px;height:74px;margin-left:-30px;border-radius:50% 50% 48% 48%/55% 55% 45% 45%;background:radial-gradient(circle at 32% 28%,rgb(255 255 255 / .55),transparent 22%),var(--c);box-shadow:inset -8px -10px 0 rgb(0 0 0 / .12);animation:bob 3.4s ease-in-out var(--d) infinite;transition:transform .18s,opacity .18s}
.bd-balloon::after{content:"";position:absolute;left:50%;bottom:-7px;width:12px;height:9px;margin-left:-6px;background:var(--c);clip-path:polygon(50% 0,100% 100%,0 100%)}
.bd-balloon::before{content:"";position:absolute;left:50%;top:calc(100% + 2px);width:1.5px;height:70px;background:var(--t-mut);opacity:.6}
.bd-balloon:hover{filter:brightness(1.08)}
.bd-balloon.popped{transform:scale(1.6);opacity:0;pointer-events:none}
.bd-reasons{display:grid;gap:8px;width:100%;max-width:400px;max-height:30cqh;overflow:auto;padding:2px}
.bd-reasons li{padding:10px 14px;border-radius:14px;background:var(--t-chip);font:700 21px/1.2 var(--fh);color:var(--t-fg);animation:pop .4s var(--spring)}

.bd-deck{position:relative;width:min(250px,62cqi);aspect-ratio:.84;margin:12px 0}
.bd-print{position:absolute;inset:0;transform:rotate(var(--r));transition:transform .45s var(--ease),opacity .5s;touch-action:none}
.bd-print.top{cursor:grab}
.bd-print.gone{opacity:0;pointer-events:none;transition:transform .7s var(--ease),opacity .7s}

.bd-env{position:relative;width:min(280px,70cqi);aspect-ratio:1.45;margin:16px 0;border-radius:12px;background:linear-gradient(160deg,#fff8f0,#f1dcc6);box-shadow:0 30px 50px -24px rgb(0 0 0 / .6);cursor:pointer;perspective:800px}
.bd-env::before{content:"";position:absolute;inset:0;z-index:1;border-radius:12px;background:linear-gradient(160deg,#fbefe2,#ecd2b8);clip-path:polygon(0 100%,50% 46%,100% 100%)}
.bd-env .flap{position:absolute;left:0;right:0;top:0;z-index:2;height:58%;background:linear-gradient(180deg,#f1dcc6,#e4c6a8);clip-path:polygon(0 0,100% 0,50% 100%);transform-origin:top;transition:transform .8s var(--ease)}
.bd-env .seal{position:absolute;left:50%;top:58%;z-index:3;display:grid;place-items:center;width:56px;height:56px;margin:-28px 0 0 -28px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#ff6b8b,#b0103e);color:#ffd1dc;font-size:22px;box-shadow:0 6px 14px rgb(0 0 0 / .35);animation:sealPulse 1.8s ease-in-out infinite;transition:transform .35s}
@keyframes sealPulse{50%{transform:scale(1.1)}}
.bd-env.open .flap{transform:rotateX(180deg)}
.bd-env.open .seal{transform:scale(0);animation:none}

/* ==========================================================================
   For her
   ========================================================================== */
.gf-sky{position:absolute;inset:0}
.gf-sky i{position:absolute;width:var(--s);height:var(--s);border-radius:50%;background:var(--t-acc);opacity:.5;animation:twinkle var(--tw) ease-in-out infinite}
.gv-girlfriend.t-rose .gf-sky i,.gv-girlfriend.t-blush .gf-sky i{background:#fff;opacity:.7}
@keyframes twinkle{50%{opacity:.08;transform:scale(.6)}}
.gf-ring{margin:18px 0 6px;color:var(--t-acc)}
.gf-heart{display:grid;place-items:center;width:104px;height:104px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#ff8fb1,#E91E63 60%,#a3124b);color:#fff;font-size:52px;line-height:1;box-shadow:0 0 0 0 rgb(233 30 99 / .5),0 20px 40px -14px rgb(233 30 99 / .8);animation:heartBeat 1.4s ease-in-out infinite;transition:transform .2s}
.gf-ring.holding .gf-heart{transform:scale(calc(1 + var(--hold,0) * .25));animation:none}
.gf-ring.burst .gf-heart{transform:scale(2.2);opacity:0;transition:transform .7s var(--ease),opacity .6s}
.gf-ring.burst::before{opacity:0;transition:opacity .3s}
@keyframes heartBeat{0%,100%{transform:scale(1)}14%{transform:scale(1.12)}28%{transform:scale(1)}42%{transform:scale(1.08)}}
.gf-big{max-width:14ch;font:700 clamp(40px,13cqi,64px)/1.08 var(--fh);color:var(--t-fg);text-wrap:balance}
.gf-from{font:700 24px var(--fh);color:var(--t-acc)}
.gf-num{font:800 clamp(72px,26cqi,130px)/.9 var(--fd);letter-spacing:-.05em;color:var(--t-acc);font-variant-numeric:tabular-nums}
.gf-field{position:relative;width:min(340px,86cqi);aspect-ratio:1;margin:4px 0}
.gf-field svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.gf-dust{position:absolute;width:3px;height:3px;margin:-1.5px 0 0 -1.5px;border-radius:50%;background:var(--t-mut);opacity:.35}
.gf-field polyline{fill:none;stroke:var(--t-acc);stroke-width:.7;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:120;stroke-dashoffset:120;animation:drawLine .9s var(--ease) forwards;filter:drop-shadow(0 0 1.5px var(--t-acc))}
@keyframes drawLine{to{stroke-dashoffset:0}}
.gf-field.done svg{filter:drop-shadow(0 0 6px var(--t-acc))}
.gf-field.done::after{content:"\2665";position:absolute;left:50%;top:44%;font-size:90px;line-height:1;color:var(--t-acc);opacity:0;transform:translate(-50%,-50%) scale(.4);animation:heartIn 1.2s var(--spring) .2s forwards}
@keyframes heartIn{to{opacity:.2;transform:translate(-50%,-50%) scale(1)}}
.gf-star{position:absolute;width:40px;height:40px;margin:-20px 0 0 -20px;border-radius:50%;display:grid;place-items:center}
.gf-star::before{content:"\2726";font-size:16px;line-height:1;color:var(--t-mut);opacity:.5;transition:transform .5s var(--spring),color .3s,opacity .3s,text-shadow .3s}
.gf-star.next::before{color:#fff;opacity:1;animation:starPulse 1.2s ease-in-out infinite;text-shadow:0 0 12px var(--t-acc),0 0 24px var(--t-acc)}
.gv-girlfriend.t-rose .gf-star.next::before,.gv-girlfriend.t-blush .gf-star.next::before{color:var(--t-acc)}
.gf-star.on::before{color:var(--t-acc);opacity:1;transform:scale(1.5);text-shadow:0 0 10px var(--t-acc);animation:none}
.gf-star:disabled{cursor:default}
@keyframes starPulse{50%{transform:scale(1.7)}}
.gf-cap{min-height:3.2em;max-width:30ch;font:700 clamp(21px,6.4cqi,27px)/1.2 var(--fh);color:var(--t-fg);opacity:0}
.gf-cap.show{animation:capIn .6s var(--ease) forwards}
@keyframes capIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.gf-print{width:min(260px,64cqi);transform:rotate(-2deg);cursor:grab;touch-action:none}
.gf-print img{filter:grayscale(calc(1 - var(--dev,0))) sepia(calc((1 - var(--dev,0)) * .6)) brightness(calc(.12 + .88 * var(--dev,0))) blur(calc((1 - var(--dev,0)) * 5px));transition:filter .25s}
.gf-print figcaption{opacity:var(--dev,0)}
.gf-print.developed{animation:printPop .6s var(--spring)}
@keyframes printPop{50%{transform:rotate(1deg) scale(1.05)}}
.gf-env .seal{font-size:26px;background:radial-gradient(circle at 35% 30%,#fff0f5,#ffd1dc)}
.gf-paper{background:#fffaf5 radial-gradient(#F5DDE5 1px,transparent 1px) 0 0/18px 18px}
.gf-proms{display:grid;gap:8px;width:100%;max-width:420px}
.gf-proms li{display:flex;align-items:center;gap:12px;padding:12px 12px 12px 16px;border-radius:16px;background:var(--t-chip);text-align:left;font:700 20px/1.2 var(--fh);color:var(--t-fg);animation:capIn .5s var(--ease) calc(var(--i) * .12s) both;transition:background .3s}
.gf-proms li span{flex:1}
.gf-proms li.done{background:rgb(233 30 99 / .2)}
.gf-pinky{flex:none;display:grid;place-items:center;width:46px;height:46px;border-radius:50%;background:var(--t-btn);color:var(--t-btn-fg);font-size:22px;transition:transform .35s var(--spring)}
.gf-pinky:hover{transform:rotate(-12deg) scale(1.08)}
.gf-pinky.done{background:#2bb673;color:#fff;font:800 18px var(--fb)}
.gf-stamp{display:flex;flex-direction:column;align-items:center;padding:10px 22px;border:3px double var(--t-acc);border-radius:12px;color:var(--t-acc);transform:rotate(-8deg);animation:stampIn .5s var(--spring)}
.gf-stamp b{font:800 26px var(--fd);letter-spacing:.1em;text-transform:uppercase}
.gf-stamp small{font:700 12px var(--fb)}
@keyframes stampIn{from{opacity:0;transform:rotate(-8deg) scale(2.2)}}

/* ==========================================================================
   Best friend (arcade)
   ========================================================================== */
.fr-grid{position:absolute;left:-20%;right:-20%;bottom:-10%;height:55%;background:linear-gradient(transparent 0 calc(100% - 1px),var(--t-acc) 0) 0 0/100% 34px,linear-gradient(90deg,transparent 0 calc(100% - 1px),var(--t-acc) 0) 0 0/34px 100%;opacity:.16;transform:perspective(300px) rotateX(58deg);transform-origin:50% 100%;animation:gridRun 2.4s linear infinite}
@keyframes gridRun{to{background-position:0 34px,0 0}}
.fr-screen{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;width:min(320px,80cqi);aspect-ratio:4/3;padding:18px;border-radius:22px;background:radial-gradient(circle at 50% 40%,#1d2b3a,#0a0f17);border:8px solid #2a2240;box-shadow:inset 0 0 40px rgb(80 220 255 / .15),0 30px 50px -24px rgb(0 0 0 / .7);color:#7df9ff;font-family:var(--fd)}
.fr-blink{font:800 13px var(--fb);letter-spacing:.24em;color:var(--t-acc);animation:blinkSlow 1.1s steps(1) infinite}
.fr-screen .fr-blink{color:#ffe066}
@keyframes blinkSlow{50%{opacity:.2}}
.fr-p2{font:800 clamp(28px,9cqi,40px)/1 var(--fd);letter-spacing:.04em;color:#7df9ff;text-shadow:0 0 12px rgb(125 249 255 / .7);overflow-wrap:anywhere}
.fr-small{font:600 12px var(--fb);color:#9fb3c8}
.fr-count{font:800 86px/1 var(--fd);color:#ffe066;text-shadow:0 0 20px rgb(255 224 102 / .7);animation:pop .4s var(--spring)}
.fr-slot{display:grid;place-items:center;width:150px;height:56px;border-radius:12px;background:#2a2240;box-shadow:inset 0 0 0 3px #3d3260}
.fr-slot span{position:relative;font:800 11px var(--fb);letter-spacing:.2em;color:#ff6b6b;animation:blinkSlow 1s steps(1) infinite}
.fr-slot::before{content:"";position:absolute;width:6px;height:30px;border-radius:3px;background:#0a0f17;transform:translateX(-58px)}
.fr-slot.lit span{color:#2bb673;animation:none}
.fr-coin{display:grid;place-items:center;width:62px;height:62px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff3b0,#E2B96B 55%,#a77b28);color:#7a5413;font-size:24px;box-shadow:inset 0 0 0 5px rgb(255 255 255 / .25),0 10px 18px -6px rgb(0 0 0 / .6);cursor:grab;touch-action:none;animation:coinSpin 2.4s ease-in-out infinite}
.fr-coin.in{transition:transform .4s var(--ease),opacity .4s;opacity:0;transform:scale(.3) !important}
@keyframes coinSpin{50%{transform:rotateY(180deg)}}
.fr-card{position:relative;width:min(260px,64cqi);aspect-ratio:.7;transform-style:preserve-3d;transform:perspective(900px) rotateX(var(--rx,0deg)) rotateY(calc(var(--ry,0deg) + var(--flip,0deg)));transition:transform .5s var(--ease);animation:cardIn 1s var(--spring)}
.fr-card.flipped{--flip:180deg}
@keyframes cardIn{from{transform:perspective(900px) rotateY(-540deg) scale(.4);opacity:0}}
.fr-face{position:absolute;inset:0;display:flex;flex-direction:column;gap:6px;padding:14px;border-radius:20px;backface-visibility:hidden;-webkit-backface-visibility:hidden;overflow:hidden;text-align:left;color:#1a1a2e}
.fr-front{background:linear-gradient(135deg,#ffe066,#ff8fb1 40%,#8ed1fc 70%,#b9f6ca);box-shadow:inset 0 0 0 6px rgb(255 255 255 / .55),0 30px 50px -20px rgb(0 0 0 / .6)}
.fr-front::after{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 30%,rgb(255 255 255 / .7) calc(var(--gx,50%) - 4%),transparent calc(var(--gx,50%) + 18%));mix-blend-mode:overlay;pointer-events:none}
.fr-back{transform:rotateY(180deg);align-items:center;justify-content:center;text-align:center;background:repeating-linear-gradient(45deg,#2a2240 0 12px,#33295a 12px 24px);color:#fff;box-shadow:inset 0 0 0 6px #ffe066}
.fr-back .gv-eyebrow{color:#ffe066}
.fr-top{display:flex;justify-content:space-between;font:800 10px var(--fb);letter-spacing:.14em}
.fr-art{position:relative;display:grid;place-items:center;height:40%;border-radius:12px;background:rgb(255 255 255 / .6)}
.fr-init{font:800 64px/1 var(--fd);color:#C2185B}
.fr-emo{position:absolute;right:8px;bottom:6px;font-size:28px}
.fr-name{font:800 22px/1 var(--fd);letter-spacing:-.02em;overflow-wrap:anywhere}
.fr-kind{font:700 11.5px var(--fb);color:#4A4A6A}
.fr-stats{display:grid;gap:4px;margin-top:auto}
.fr-stat{display:grid;grid-template-columns:86px 1fr 22px;align-items:center;gap:6px;font:700 10.5px var(--fb)}
.fr-stat i{height:6px;border-radius:6px;background:rgb(26 26 46 / .15);overflow:hidden}
.fr-stat i::after{content:"";display:block;height:100%;width:var(--v);background:#1a1a2e;border-radius:6px;animation:barIn 1.2s var(--ease) .6s both}
.fr-stat b{text-align:right}
.fr-move{max-width:18ch;font:700 26px/1.15 var(--fh)}
.fr-small2{margin-top:10px;font:600 11px var(--fb);color:#c9c9dc}
.fr-grid4{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;width:min(330px,86cqi)}
.fr-grid4.c3{grid-template-columns:repeat(3,1fr);width:min(260px,70cqi)}
.fr-tile{aspect-ratio:.8;perspective:500px}
.fr-tile-in{position:relative;display:block;width:100%;height:100%;transform-style:preserve-3d;transition:transform .45s var(--ease)}
.fr-tile.up .fr-tile-in{transform:rotateY(180deg)}
.fr-tile-back,.fr-tile-front{position:absolute;inset:0;display:grid;place-items:center;border-radius:12px;backface-visibility:hidden;-webkit-backface-visibility:hidden}
.fr-tile-back{background:var(--t-btn);color:var(--t-btn-fg);font:800 22px var(--fd);box-shadow:0 8px 14px -8px rgb(0 0 0 / .6)}
.fr-tile-front{transform:rotateY(180deg);background:#fff;font-size:28px}
.fr-tile.match .fr-tile-front{box-shadow:0 0 0 3px #2bb673;animation:pop .4s var(--spring)}
.fr-moves{font:700 13px var(--fb);color:var(--t-mut)}
.fr-facts{display:grid;gap:6px;width:100%;max-width:400px;max-height:24cqh;overflow:auto}
.fr-facts li{padding:9px 12px;border-radius:12px;background:var(--t-chip);font:700 19px/1.2 var(--fh);color:var(--t-fg);text-align:left;animation:pop .4s var(--spring)}
.fr-boothbox{position:relative;display:flex;flex-direction:column;align-items:center;height:58cqh;overflow:hidden}
.fr-slot2{position:relative;z-index:2;width:200px;height:16px;border-radius:8px;background:#1a1a2e;box-shadow:inset 0 4px 6px rgb(0 0 0 / .6)}
.fr-strip{display:flex;flex-direction:column;gap:8px;width:160px;margin-top:-6px;padding:10px 10px 14px;background:#fff;box-shadow:0 20px 30px -16px rgb(0 0 0 / .6);transform:translateY(-105%)}
.fr-strip.print{transition:transform 2s steps(14);transform:translateY(0)}
.fr-frame{padding:0;box-shadow:none}
.fr-frame img{filter:contrast(1.05) saturate(1.1)}
.fr-frame figcaption{font-size:16px;margin-top:2px}
.fr-strip-foot{font:700 14px var(--fh);color:#2a2238;text-align:center}
.fr-flash{position:fixed;inset:0;z-index:30 !important;background:#fff;opacity:0;pointer-events:none}
.fr-flash.go{animation:flash .35s ease-out}
@keyframes flash{0%{opacity:.9}100%{opacity:0}}
.fr-plane{width:120px;animation:planeIn 2.2s var(--ease) both;filter:drop-shadow(0 16px 14px rgb(0 0 0 / .35))}
.fr-plane svg{width:100%}
.fr-plane:not(.caught){animation:planeIn 2.2s var(--ease) both,planeHover 2s ease-in-out 2.2s infinite}
.fr-plane.caught{transition:transform .5s var(--ease),opacity .5s;transform:scale(2) rotate(20deg);opacity:0}
@keyframes planeIn{from{transform:translate(-120cqi,-30cqh) rotate(-20deg)}}
@keyframes planeHover{50%{transform:translateY(-10px) rotate(4deg)}}
.fr-paper{background:#fff repeating-linear-gradient(transparent 0 30px,#e3edf7 30px 31px)}
.fr-rulelist{display:grid;gap:8px;width:100%;max-width:420px}
.fr-rule{display:flex;align-items:center;gap:12px;width:100%;padding:12px 14px;border-radius:16px;background:var(--t-chip);color:var(--t-fg);text-align:left;font:700 19px/1.2 var(--fh);animation:capIn .5s var(--ease) calc(var(--i) * .1s) both}
.fr-box{flex:none;display:grid;place-items:center;width:26px;height:26px;border-radius:8px;box-shadow:inset 0 0 0 2.5px var(--t-mut);transition:background .2s}
.fr-rule.done .fr-box{background:#2bb673;box-shadow:none}
.fr-rule.done .fr-box::after{content:"\2713";color:#fff;font:800 15px var(--fb)}
.fr-pad{width:min(340px,86cqi);height:180px;border-radius:18px;background:#fffdf8 linear-gradient(transparent calc(100% - 46px),#c9c0d3 calc(100% - 46px) calc(100% - 44px),transparent 0);box-shadow:0 20px 40px -20px rgb(0 0 0 / .6);touch-action:none;cursor:crosshair}
.fr-pad.signed{animation:pop .4s var(--spring)}
.fr-cert{display:flex;flex-direction:column;align-items:center;gap:6px;width:min(340px,86cqi);padding:22px 18px;border-radius:18px;background:linear-gradient(160deg,#fff9fb,#ffe1ea);box-shadow:inset 0 0 0 4px #E91E63,inset 0 0 0 8px #fff,inset 0 0 0 9.5px #f5b8c9,0 30px 50px -24px rgb(0 0 0 / .6);color:#1a1a2e;animation:pop .6s var(--spring)}
.fr-cert-k{font:800 11px var(--fb);letter-spacing:.2em;text-transform:uppercase;color:#C2185B}
.fr-cert-n{font:800 26px/1.1 var(--fd);letter-spacing:-.02em;overflow-wrap:anywhere}
.fr-cert-t{font:600 13px var(--fb);color:#4A4A6A}
.fr-cert-sig{width:70%;max-height:70px;object-fit:contain;border-bottom:1.5px solid #1a1a2e}
.fr-cert-d{font:700 12px var(--fb);color:#8A8AA3}

/* ==========================================================================
   Anniversary
   ========================================================================== */
.an-deck{position:relative;width:min(290px,72cqi);aspect-ratio:1.15;margin:14px 0 4px;padding:8%;border-radius:22px;background:linear-gradient(160deg,#5a3a26,#3a2416);box-shadow:inset 0 0 0 3px rgb(255 255 255 / .06),0 30px 50px -24px rgb(0 0 0 / .7)}
.an-disc{position:relative;width:78%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,#111 0 18%,transparent 18.5%),repeating-radial-gradient(circle,#1b1b1b 0 2px,#262626 2px 4px);box-shadow:0 10px 20px rgb(0 0 0 / .5),inset 0 0 0 2px #000}
.an-disc::after{content:"";position:absolute;inset:0;border-radius:50%;background:conic-gradient(from 30deg,transparent 0 10%,rgb(255 255 255 / .12) 14%,transparent 20% 60%,rgb(255 255 255 / .08) 64%,transparent 70%)}
.an-label{position:absolute;inset:32%;z-index:1;display:flex;flex-direction:column;align-items:center;justify-content:center;border-radius:50%;background:radial-gradient(circle,#1a1a1a 0 7%,var(--t-acc) 8%);color:#3a1d0e;text-align:center}
.an-label b{font:800 clamp(12px,4cqi,17px)/1 var(--fd)}
.an-label small{font:700 8px var(--fb);letter-spacing:.1em;text-transform:uppercase}
.an-deck.playing .an-disc,.an-disc.spin{animation:spin 2.2s linear infinite}
.an-arm{position:absolute;right:9%;top:9%;width:16px;height:62%;border-radius:8px;background:linear-gradient(90deg,#d8d8d8,#9a9a9a);transform-origin:50% 8%;transform:rotate(var(--a,0deg));transition:transform .5s var(--spring);cursor:grab;touch-action:none;box-shadow:2px 4px 8px rgb(0 0 0 / .4)}
.an-arm::before{content:"";position:absolute;left:50%;top:-6px;width:30px;height:30px;margin-left:-15px;border-radius:50%;background:radial-gradient(circle,#eee,#888)}
.an-arm::after{content:"";position:absolute;left:-3px;bottom:-6px;width:22px;height:20px;border-radius:4px;background:#2a2a2a}
.an-disc.small{width:110px;margin-bottom:6px}
.an-grid{grid-template-columns:repeat(3,1fr)}
.an-facts{display:grid;gap:6px;width:100%;max-width:380px;margin-top:6px}
.an-facts p{padding:9px 14px;border-radius:14px;background:var(--t-chip);font-size:14px;color:var(--t-mut);text-align:left}
.an-facts b{font:800 17px var(--fd);color:var(--t-acc)}
.an-line{position:relative;display:grid;gap:14px;width:100%;max-width:400px;max-height:52cqh;overflow:auto;padding:4px 4px 4px 34px;text-align:left}
.an-line::before{content:"";position:absolute;left:14px;top:10px;bottom:10px;width:2px;background:var(--t-chip)}
.an-line::after{content:"";position:absolute;left:14px;top:10px;width:2px;height:calc(var(--fill,0%) - 10px);max-height:calc(100% - 20px);background:var(--t-acc);transition:height .8s var(--ease)}
.an-line li{position:relative;display:flex;flex-direction:column;gap:2px;padding:12px 14px;border-radius:14px;background:var(--t-chip);opacity:.25;transform:translateX(10px);transition:opacity .6s,transform .6s var(--ease)}
.an-line li.on{opacity:1;transform:none}
.an-line small{font:800 10.5px var(--fb);letter-spacing:.14em;text-transform:uppercase;color:var(--t-mut)}
.an-line b{font:700 22px/1.15 var(--fh);color:var(--t-fg)}
.an-dot{position:absolute;left:-26px;top:16px;width:12px;height:12px;border-radius:50%;background:var(--t-chip);box-shadow:0 0 0 3px var(--t-chip);transition:background .4s,box-shadow .4s}
.an-line li.on .an-dot{background:var(--t-acc);box-shadow:0 0 0 4px rgb(255 255 255 / .12),0 0 14px var(--t-acc)}
.an-film{position:relative;width:min(300px,76cqi);padding:22px 12px;background:#111;border-radius:6px;cursor:pointer;box-shadow:0 30px 50px -24px rgb(0 0 0 / .7)}
.an-film::before,.an-film::after{content:"";position:absolute;left:8px;right:8px;height:10px;background:repeating-linear-gradient(90deg,#e8e0d0 0 10px,transparent 10px 20px);opacity:.85}
.an-film::before{top:6px}
.an-film::after{bottom:6px}
.an-frame{aspect-ratio:1;overflow:hidden;border-radius:3px;background:#222}
.an-frame img{width:100%;height:100%;object-fit:cover;filter:sepia(.25) contrast(1.05);animation:kenBurns 7s ease-out both,filmIn .5s ease-out}
@keyframes kenBurns{from{transform:scale(1.12)}to{transform:scale(1)}}
@keyframes filmIn{from{opacity:0;filter:brightness(2) sepia(.25)}}
.an-cap{min-height:1.4em;font:700 24px var(--fh);color:var(--t-acc)}
.an-jar{position:relative;width:min(170px,44cqi);aspect-ratio:.8;margin:8px 0;border-radius:26px 26px 34px 34px;background:linear-gradient(90deg,rgb(255 255 255 / .22),rgb(255 255 255 / .06) 30%,rgb(255 255 255 / .02) 70%,rgb(255 255 255 / .16));box-shadow:inset 0 0 0 3px rgb(255 255 255 / .35),0 30px 40px -24px rgb(0 0 0 / .6);cursor:pointer;transition:transform .3s var(--spring)}
.an-jar:active{transform:rotate(-6deg) scale(.97)}
.an-lid{position:absolute;left:12%;right:12%;top:-12px;height:22px;border-radius:8px;background:linear-gradient(#E2B96B,#a77b28)}
.an-notes{position:absolute;left:10%;right:10%;bottom:8%;top:30%;display:flex;flex-wrap:wrap-reverse;align-content:flex-start;justify-content:center;gap:4px}
.an-notes i{width:34%;height:24%;border-radius:4px;background:hsl(calc(340 + var(--i) * 18) 85% 82%);transform:rotate(calc(var(--i) * 23deg - 30deg));box-shadow:0 2px 4px rgb(0 0 0 / .2)}
.an-jar.done{opacity:.6}
.an-note{min-height:3.4em;max-width:26ch;padding:14px 18px;border-radius:12px;background:#fffdf5;color:#2a2238;font:700 23px/1.2 var(--fh);box-shadow:0 20px 30px -20px rgb(0 0 0 / .6);opacity:0}
.an-note.show{animation:noteOut .6s var(--spring) forwards}
@keyframes noteOut{from{opacity:0;transform:translateY(-60px) scale(.4) rotate(-12deg)}to{opacity:1;transform:rotate(-1.5deg)}}
.an-glasses{display:flex;gap:16px;align-items:flex-end;margin:16px 0 4px}
.an-glass{position:relative;display:block;width:64px;height:140px;cursor:grab;touch-action:none;transition:transform .4s var(--spring)}
.an-glass::before{content:"";position:absolute;left:4px;right:4px;top:0;height:84px;border-radius:6px 6px 30px 30px;background:linear-gradient(transparent 0 28%,rgb(247 214 134 / .85) 28%);box-shadow:inset 0 0 0 2.5px rgb(255 255 255 / .55)}
.an-glass::after{content:"";position:absolute;left:50%;bottom:0;width:4px;height:56px;margin-left:-2px;background:rgb(255 255 255 / .6);box-shadow:0 54px 0 0 rgb(255 255 255 / .0);border-radius:2px}
.an-glass .bub{position:absolute;left:30%;top:40%;width:5px;height:5px;border-radius:50%;background:#fff;opacity:.8;animation:bubble 1.6s ease-in infinite}
.an-glass.l{transform:rotate(8deg)}
.an-glass.r{transform:rotate(-8deg);cursor:default}
.an-glasses.clink .an-glass.l{animation:clinkL .5s var(--spring)}
.an-glasses.clink .an-glass.r{animation:clinkR .5s var(--spring)}
@keyframes clinkL{50%{transform:translateX(16px) rotate(18deg)}}
@keyframes clinkR{50%{transform:translateX(-16px) rotate(-18deg)}}
@keyframes bubble{from{transform:translateY(20px);opacity:0}30%{opacity:.9}to{transform:translateY(-30px);opacity:0}}
.an-book{position:relative;width:min(320px,82cqi);height:min(420px,60cqh);perspective:1400px}
.an-page{position:absolute;inset:0;overflow:auto;padding:26px 22px;border-radius:6px 14px 14px 6px;background:#fffdf5;color:#2a2238;text-align:left;box-shadow:0 30px 50px -24px rgb(0 0 0 / .7),inset 12px 0 18px -12px rgb(0 0 0 / .2)}
.an-page .to{font:700 26px var(--fh);color:#a3124b}
.an-page .body{margin-top:8px;font:600 21px/1.45 var(--fh);white-space:pre-wrap;overflow-wrap:anywhere}
.an-page .sig{margin-top:14px;text-align:right;font:700 23px var(--fh);color:#a3124b}
.an-cover{position:absolute;inset:0;z-index:2;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:20px;border-radius:6px 14px 14px 6px;background:linear-gradient(135deg,#7a1036,#4a0820);color:#f3d9a0;transform-origin:0 50%;transition:transform 1.1s var(--ease);box-shadow:inset 0 0 0 6px rgb(226 185 107 / .5),0 30px 50px -24px rgb(0 0 0 / .7);backface-visibility:hidden;cursor:pointer}
.an-cover small{font:800 11px var(--fb);letter-spacing:.2em;text-transform:uppercase}
.an-cover b{font:750 28px/1.1 var(--fd);overflow-wrap:anywhere}
.an-cover span{font-size:30px}
.an-book.open .an-cover{transform:rotateY(-160deg)}
.an-capsule{display:flex;flex-direction:column;align-items:center;gap:4px;width:200px;padding:26px 16px;border-radius:999px;background:linear-gradient(90deg,#9a9a9a,#e9e9e9 40%,#bdbdbd);color:#2a2238;box-shadow:inset 0 0 0 3px rgb(255 255 255 / .5),0 30px 40px -24px rgb(0 0 0 / .7);animation:capsuleShake 3s ease-in-out infinite}
.an-capsule b{font:800 18px var(--fd)}
.an-capsule small{font:700 11px var(--fb);color:#4a4a6a}
.an-lock{font-size:28px}
@keyframes capsuleShake{0%,85%,100%{transform:rotate(0)}90%{transform:rotate(-3deg)}95%{transform:rotate(3deg)}}
.an-peek{max-height:30cqh}

/* ==========================================================================
   Proposal
   ========================================================================== */
.pr-dark{background:radial-gradient(circle at 50% 45%,rgb(0 0 0 / 0) 0,rgb(0 0 0 / .55) 70%)}
.pr-beat{width:14px;height:14px;border-radius:50%;background:var(--t-acc);box-shadow:0 0 24px 6px var(--t-acc);animation:heartBeat 1.3s ease-in-out infinite;margin-bottom:20px;transition:transform 1s var(--ease)}
.pr-beat.big{transform:scale(40);opacity:.15;transition:transform 1.2s var(--ease),opacity 1.2s}
.pr-whisper{font:700 clamp(34px,11cqi,52px)/1.1 var(--fh);color:var(--t-fg)}
.pr-whisper.small{font-size:clamp(24px,7.5cqi,34px);color:var(--t-mut)}
.pr-film{background:rgb(0 0 0 / .35)}
.pr-bgphoto{position:absolute !important;inset:-6%;z-index:0 !important;background:center/cover no-repeat;filter:blur(3px) brightness(.55) saturate(1.1);animation:kenBurns 9s ease-out both}
.pr-title{max-width:16ch;font:750 clamp(28px,9cqi,44px)/1.12 var(--fd);letter-spacing:-.03em;color:#fff;text-shadow:0 4px 20px rgb(0 0 0 / .5)}
.pr-film .gv-hint{color:rgb(255 255 255 / .75)}
.pr-box{position:relative;width:170px;height:150px;margin:18px 0 6px;perspective:700px}
.pr-base{position:absolute;left:0;right:0;bottom:0;height:62%;border-radius:12px 12px 18px 18px;background:linear-gradient(160deg,#c2185b,#7a1036);box-shadow:inset 0 10px 0 rgb(0 0 0 / .18),0 30px 40px -20px rgb(0 0 0 / .7)}
.pr-base::before{content:"";position:absolute;left:12%;right:12%;top:10%;height:42%;border-radius:40px 40px 10px 10px;background:linear-gradient(#4a0820,#7a1036)}
.pr-lid{position:absolute;left:-2%;right:-2%;bottom:52%;height:34%;border-radius:18px 18px 6px 6px;background:linear-gradient(160deg,#e0457e,#a3124b);transform-origin:50% 100%;transition:transform .9s var(--ease);box-shadow:inset 0 -6px 0 rgb(0 0 0 / .15)}
.pr-box:not(.open){animation:boxWiggle 2.6s ease-in-out 1s infinite}
.pr-box.open .pr-lid{transform:rotateX(110deg)}
.pr-ring{position:absolute;left:50%;bottom:40%;width:66px;height:66px;margin-left:-33px;border-radius:50%;border:8px solid #E2B96B;border-bottom-color:#a77b28;opacity:0;transform:translateY(16px) scale(.6);transition:opacity .5s .4s,transform .8s var(--spring) .4s}
.pr-gem{position:absolute;left:50%;top:-30px;width:30px;height:30px;margin-left:-15px;background:linear-gradient(135deg,#fff,#cfe8ff 45%,#8ed1fc);clip-path:polygon(50% 100%,0 35%,22% 0,78% 0,100% 35%);filter:drop-shadow(0 0 10px #fff)}
.pr-gem::after{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 40%,rgb(255 255 255 / .9) 50%,transparent 60%);background-size:250% 100%;animation:gemShine 2.4s ease-in-out infinite}
@keyframes gemShine{from{background-position:120% 0}to{background-position:-120% 0}}
.pr-box.open .pr-ring{opacity:1;transform:translateY(-34px) scale(1)}
.pr-q{max-width:16ch;margin-top:6px}
.pr-row{position:static !important;display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:14px;margin-top:10px}
.pr-yes{min-width:130px;transition:transform .45s var(--spring)}
.pr-no{transition:transform .3s var(--spring),left .35s var(--spring),top .35s var(--spring),opacity .3s}
.pr-no.loose{position:absolute !important;z-index:5 !important}
.pr-stamp{display:flex;flex-direction:column;align-items:center;padding:12px 26px;border:3px double var(--t-acc);border-radius:14px;color:var(--t-acc);transform:rotate(-4deg);animation:stampIn .6s var(--spring) .4s both}
.pr-stamp small{font:800 10px var(--fb);letter-spacing:.16em;text-transform:uppercase}
.pr-stamp b{font:800 24px var(--fd)}

/* ==========================================================================
   Apology
   ========================================================================== */
.ap-sky{position:absolute;inset:0}
.ap-sky::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,#9ed0ff,#ffe9b8);opacity:calc(var(--clear,0) * .85);transition:opacity .4s}
.ap-sun{position:absolute;right:12%;top:12%;width:120px;height:120px;border-radius:50%;background:radial-gradient(circle,#fff6c9,#ffd75e 55%,rgb(255 215 94 / 0) 72%);opacity:var(--clear,0);transform:scale(calc(.6 + var(--clear,0) * .5));transition:opacity .4s,transform .6s var(--ease)}
.ap-rainbow{position:absolute;left:-10%;right:-10%;bottom:-38%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,transparent 52%,#9b51e0 52.5% 54%,#5ab8f0 54% 55.5%,#2bb673 55.5% 57%,#ffe066 57% 58.5%,#ffb703 58.5% 60%,#ff6b6b 60% 61.5%,transparent 62%);opacity:calc((var(--clear,0) - .6) * 2);transition:opacity .5s}
.ap-clouds{position:absolute;left:-20%;right:-20%;top:-6%;height:34%;background:radial-gradient(60px 40px at 15% 60%,#6b7a90 98%,transparent),radial-gradient(90px 56px at 32% 50%,#5d6b80 98%,transparent),radial-gradient(70px 46px at 52% 62%,#6b7a90 98%,transparent),radial-gradient(100px 60px at 72% 48%,#5d6b80 98%,transparent),radial-gradient(70px 44px at 90% 58%,#6b7a90 98%,transparent);filter:blur(6px);opacity:calc(.85 - var(--clear,0) * .85);transform:translateX(calc(var(--clear,0) * -18%));transition:opacity .4s,transform .8s var(--ease);animation:cloudDrift 18s ease-in-out infinite alternate}
@keyframes cloudDrift{to{background-position:30px 0,-20px 0,15px 0,-30px 0,20px 0}}
.ap-rain{position:absolute;inset:0;width:100%;height:100%}
.ap-glass{position:relative;width:min(320px,80cqi);aspect-ratio:1.1;border-radius:22px;overflow:hidden;background:linear-gradient(160deg,#2b4a6f,#14263d);box-shadow:inset 0 0 0 10px #f2ede4,inset 0 0 0 12px #c9bfae,0 30px 50px -24px rgb(0 0 0 / .7)}
.ap-msg{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#fff;text-align:center;padding:20px}
.ap-msg b{font:750 clamp(34px,10cqi,46px)/1 var(--fd);letter-spacing:-.03em}
.ap-msg span{font:700 34px var(--fh);color:#ffd1dc}
.ap-fog{position:absolute;inset:0;z-index:2;width:100%;height:100%;touch-action:none;cursor:grab;transition:opacity 1s}
.ap-fog.gone{opacity:0;pointer-events:none}
.ap-glass.clear .ap-msg{animation:pop .6s var(--spring)}
.ap-paper{background:#fbfdff repeating-linear-gradient(transparent 0 31px,#e3edf7 31px 32px)}
.ap-lead{font:700 21px/1.4 var(--fh);color:#34506e}
.ap-pond{position:relative;width:100%;height:130px;margin:6px 0;border-radius:20px;background:linear-gradient(180deg,rgb(255 255 255 / .06),rgb(90 184 240 / .2));overflow:hidden}
.ap-pond::after{content:"";position:absolute;left:0;right:0;bottom:30px;height:2px;background:repeating-linear-gradient(90deg,rgb(255 255 255 / .35) 0 20px,transparent 20px 34px);animation:gridRun 3s linear infinite}
.ap-boat{position:absolute;left:-90px;top:calc(18px + var(--y));width:78px;animation:sail 9s linear var(--d) infinite;filter:drop-shadow(0 8px 6px rgb(0 0 0 / .25))}
.ap-boat svg{width:100%;animation:rock 1.6s ease-in-out infinite}
.ap-boat.done{animation-play-state:paused;opacity:.35}
@keyframes sail{to{left:calc(100% + 20px)}}
@keyframes rock{50%{transform:rotate(5deg) translateY(-2px)}}
.ap-read{display:grid;gap:6px;width:100%;max-width:400px}
.ap-read li{padding:10px 14px;border-radius:14px;background:var(--t-chip);font:700 20px/1.2 var(--fh);color:var(--t-fg);text-align:left;animation:pop .4s var(--spring)}
.ap-photos{display:flex;justify-content:center;gap:0;margin:10px 0}
.ap-ph{width:min(150px,36cqi);margin:0 -12px;transform:rotate(calc((var(--i) - 1) * 7deg)) translateY(calc(var(--i) * 6px));animation:capIn .7s var(--ease) calc(var(--i) * .2s) both}
.ap-meter{display:flex;flex-direction:column;align-items:center;gap:8px;width:100%;max-width:360px;margin-top:6px}
.ap-icons{display:flex;justify-content:space-between;width:100%;font-size:26px}
.ap-meter input{width:100%;height:44px;background:none;-webkit-appearance:none;appearance:none;cursor:pointer}
.ap-meter input::-webkit-slider-runnable-track{height:10px;border-radius:10px;background:linear-gradient(90deg,#5d6b80,#9ed0ff,#ffd75e)}
.ap-meter input::-moz-range-track{height:10px;border-radius:10px;background:linear-gradient(90deg,#5d6b80,#9ed0ff,#ffd75e)}
.ap-meter input::-webkit-slider-thumb{-webkit-appearance:none;width:34px;height:34px;margin-top:-12px;border-radius:50%;background:#fff;box-shadow:0 4px 12px rgb(0 0 0 / .35)}
.ap-meter input::-moz-range-thumb{width:34px;height:34px;border:0;border-radius:50%;background:#fff;box-shadow:0 4px 12px rgb(0 0 0 / .35)}
.ap-scale{font:700 22px var(--fh);color:var(--t-acc)}

/* ==========================================================================
   Photo puzzle
   ========================================================================== */
.pz-blur{position:absolute !important;inset:-8%;z-index:0 !important;background:center/cover no-repeat;filter:blur(26px) saturate(1.3) brightness(.85);opacity:.55}
.gv-puzzle.t-paper .pz-blur{opacity:.35}
.pz-level{padding:7px 14px;border-radius:999px;background:var(--t-chip);font:800 12px var(--fb);letter-spacing:.14em;text-transform:uppercase;color:var(--t-fg)}
.pz-hud{display:flex;align-items:center;justify-content:space-between;width:min(360px,90cqi)}
.pz-hud span{display:flex;flex-direction:column;align-items:center;min-width:64px}
.pz-hud small{font:800 10px var(--fb);letter-spacing:.14em;text-transform:uppercase;color:var(--t-mut)}
.pz-hud b{font:800 22px var(--fd);color:var(--t-fg);font-variant-numeric:tabular-nums}
.pz-peek{padding:9px 14px;border-radius:999px;background:var(--t-chip);font:700 13px var(--fb);color:var(--t-fg);touch-action:none}
.pz-board{position:relative;width:min(360px,90cqi,56cqh);aspect-ratio:1;border-radius:16px;background:rgb(0 0 0 / .18);box-shadow:0 30px 50px -24px rgb(0 0 0 / .6);--gap:3px}
.pz-ghost{position:absolute;inset:0;z-index:5;border-radius:16px;background:center/cover no-repeat;opacity:0;pointer-events:none;transition:opacity .25s}
.pz-board.peeking .pz-ghost{opacity:1}
.pz-tile{position:absolute;left:calc(var(--x) * 100% / var(--n));top:calc(var(--y) * 100% / var(--n));width:calc(100% / var(--n));height:calc(100% / var(--n));padding:0;border:var(--gap) solid transparent;background-clip:padding-box;border-radius:9px;transition:left .28s var(--ease),top .28s var(--ease),box-shadow .2s,transform .2s;cursor:pointer;touch-action:manipulation}
.pz-tile.home{box-shadow:inset 0 0 0 2px rgb(43 182 115 / .75)}
.pz-tile.sel{transform:scale(.92);box-shadow:inset 0 0 0 3px #fff,0 0 0 3px var(--t-acc);z-index:2}
.pz-tile.gap{opacity:0;pointer-events:none}
.pz-tile.nope{animation:shake .3s}
.pz-board.solved{--gap:0px}
.pz-board.solved .pz-tile{border-radius:0;box-shadow:none;cursor:default}
.pz-board.solved .pz-tile.gap{opacity:1;transition:opacity .6s .2s}
.pz-board.solved::after{content:"";position:absolute;inset:0;z-index:6;border-radius:16px;background:linear-gradient(115deg,transparent 35%,rgb(255 255 255 / .7) 50%,transparent 65%);background-size:250% 100%;animation:shine 1.1s ease-out .3s both;pointer-events:none}
@keyframes shine{from{background-position:130% 0}to{background-position:-130% 0}}
.pz-final{width:min(240px,60cqi);transform:rotate(-2deg);animation:pop .6s var(--spring)}
.pz-stats{display:flex;gap:10px}
.pz-stats span{padding:8px 14px;border-radius:999px;background:var(--t-chip);font:800 15px var(--fd);color:var(--t-fg)}
.pz-note{max-height:24cqh;font:700 21px/1.35 var(--fh)}

/* ==========================================================================
   Raksha Bandhan
   ========================================================================== */
.r-marigold{--rk1:#ff9f1c;--rk2:#ffd166;--rk3:#e85d04}
.r-peacock{--rk1:#0f9b8e;--rk2:#3a86ff;--rk3:#ffd166}
.r-pearl{--rk1:#f8f4ec;--rk2:#E2B96B;--rk3:#c9a35a}
.r-hero{--rk1:#e63946;--rk2:#ffd166;--rk3:#1d3557}
.mini-rakhi{position:relative;width:54px;height:46px}
.mini-rakhi::before{content:"";position:absolute;left:0;right:0;top:50%;height:4px;margin-top:-2px;border-radius:4px;background:repeating-linear-gradient(90deg,#c1121f 0 4px,#ffd166 4px 8px)}
.mini-rakhi::after{content:"";position:absolute;left:50%;top:50%;width:30px;height:30px;margin:-15px 0 0 -15px;border-radius:50%;background:radial-gradient(circle,var(--rk2) 0 26%,var(--rk3) 27% 34%,var(--rk1) 35%);box-shadow:0 0 0 3px var(--rk2)}
.rk-door-sc{transition:background 1.2s}
.rk-door-sc.warm{background:radial-gradient(circle at 50% 70%,rgb(255 183 3 / .25),transparent 60%)}
.rk-door{position:relative;margin-top:22px;width:min(230px,58cqi);aspect-ratio:.72;border-radius:110px 110px 6px 6px;background:radial-gradient(circle at 50% 60%,#ffe8a3,#ffb703 40%,#e85d04);box-shadow:0 0 0 10px #3a1d0e,0 0 0 13px #E2B96B,0 40px 60px -30px rgb(0 0 0 / .8);perspective:900px}
.rk-leaf{position:absolute;top:0;bottom:0;width:50%;background:linear-gradient(90deg,#6e4220,#5a3418);transition:transform 1.6s var(--ease);box-shadow:inset 0 0 0 6px #4a2810,inset 0 0 0 9px #8a5a2b}
.rk-leaf::after{content:"";position:absolute;top:52%;width:12px;height:12px;border-radius:50%;background:#E2B96B;box-shadow:0 0 0 3px #a77b28}
.rk-leaf.l{left:0;border-radius:110px 0 0 6px;transform-origin:0 50%}
.rk-leaf.l::after{right:12px}
.rk-leaf.r{right:0;border-radius:0 110px 6px 0;transform-origin:100% 50%}
.rk-leaf.r::after{left:12px}
.rk-door.open .rk-leaf.l{transform:rotateY(-108deg)}
.rk-door.open .rk-leaf.r{transform:rotateY(108deg)}
.rk-toran{position:absolute;left:-6%;right:-6%;top:-14px;z-index:2;height:34px;background:radial-gradient(circle at 50% 0,#ff9f1c 9px,transparent 10px) 0 0/26px 30px repeat-x,radial-gradient(circle at 50% 50%,#2bb673 6px,transparent 7px) 13px 12px/26px 30px repeat-x}
.rk-diya{position:relative;width:110px;height:80px;margin-top:-10px;cursor:pointer}
.rk-bowl{position:absolute;left:0;right:0;bottom:0;height:46px;border-radius:0 0 60px 60px;background:radial-gradient(circle at 50% 0,#d9480f,#9c2c0a);box-shadow:inset 0 6px 0 rgb(255 255 255 / .15),0 12px 20px -8px rgb(0 0 0 / .6)}
.rk-bowl::before{content:"";position:absolute;left:-6px;right:-6px;top:-6px;height:12px;border-radius:50%;background:#e8590c;box-shadow:inset 0 3px 0 #ffb703}
.rk-flame{position:absolute;left:50%;bottom:40px;width:22px;height:36px;margin-left:-11px;border-radius:50% 50% 50% 50%/60% 60% 40% 40%;background:radial-gradient(circle at 50% 72%,#fff 0 18%,#ffe066 34%,#ff9f43 68%,transparent 71%);transform:scale(0);transform-origin:50% 100%;filter:drop-shadow(0 0 18px #ffb703);transition:transform .5s var(--spring)}
.rk-diya.lit .rk-flame{transform:scale(1);animation:flick .45s ease-in-out .5s infinite alternate}
.rk-diya:not(.lit) .rk-bowl::after{content:"";position:absolute;left:50%;top:-14px;width:2px;height:10px;margin-left:-1px;background:#333;animation:wickHint 1.4s ease-in-out infinite}
.rk-diya.small{width:80px;height:60px;margin-bottom:8px}
.rk-diya.small .rk-bowl{height:34px}
.rk-diya.small .rk-flame{bottom:30px;width:16px;height:26px;margin-left:-8px}
.rk-stage{position:relative;width:min(340px,86cqi);height:300px}
.rk-wrist{position:absolute;left:-30%;right:22%;top:46px;height:84px;border-radius:0 46px 46px 0;background:linear-gradient(180deg,#e9b48f,#c98b63);box-shadow:inset 0 -10px 16px rgb(0 0 0 / .12),0 18px 30px -16px rgb(0 0 0 / .6)}
.rk-wrist::after{content:"";position:absolute;right:-26px;top:6px;width:70px;height:72px;border-radius:40%;background:linear-gradient(180deg,#eab994,#cc8f68)}
.rk-band{position:absolute;left:58%;top:-2px;bottom:-2px;width:14px;border-radius:6px;background:repeating-linear-gradient(0deg,#c1121f 0 5px,#ffd166 5px 10px);opacity:0;transform:scaleY(.2);transition:opacity .3s .3s,transform .6s var(--spring) .3s}
.rk-stage.tied .rk-band{opacity:1;transform:none}
.rk-stage.tied .rk-band::after{content:"";position:absolute;left:50%;top:50%;width:46px;height:46px;margin:-23px 0 0 -23px;border-radius:50%;background:radial-gradient(circle,var(--rk2) 0 22%,var(--rk3) 23% 30%,var(--rk1) 31% 62%,var(--rk3) 63% 68%,var(--rk2) 69%);box-shadow:0 0 0 3px var(--rk2),0 6px 10px rgb(0 0 0 / .3)}
.rk-rakhi{position:absolute;left:50%;top:190px;z-index:3;width:150px;height:60px;margin-left:-75px;cursor:grab;touch-action:none;transition:opacity .4s}
.rk-str{position:absolute;left:0;right:0;top:50%;height:5px;margin-top:-2.5px;border-radius:4px;background:repeating-linear-gradient(90deg,#c1121f 0 6px,#ffd166 6px 12px)}
.rk-medal{position:absolute;left:50%;top:50%;width:58px;height:58px;margin:-29px 0 0 -29px;border-radius:50%;background:radial-gradient(circle,var(--rk2) 0 22%,var(--rk3) 23% 30%,var(--rk1) 31% 62%,var(--rk3) 63% 68%,var(--rk2) 69%);box-shadow:0 0 0 4px var(--rk2),0 10px 16px -6px rgb(0 0 0 / .5)}
.rk-medal::after{content:"";position:absolute;inset:-12px;border-radius:50%;background:repeating-conic-gradient(var(--rk1) 0 10deg,transparent 10deg 30deg);-webkit-mask:radial-gradient(circle,transparent 55%,#000 56%);mask:radial-gradient(circle,transparent 55%,#000 56%)}
.r-hero .rk-medal{background:radial-gradient(circle,#ffd166 0 30%,#e63946 31% 62%,#1d3557 63%)}
.r-hero .rk-medal::before{content:"\2605";position:absolute;inset:0;display:grid;place-items:center;color:#fff;font-size:20px}
.rk-stage.tied .rk-rakhi{opacity:0;pointer-events:none}
.rk-thaali{position:absolute;left:50%;top:170px;width:230px;height:100px;margin-left:-115px;border-radius:50%;background:radial-gradient(circle,#ffd166,#E2B96B 60%,#a77b28);box-shadow:inset 0 0 0 8px rgb(255 255 255 / .2),0 20px 30px -16px rgb(0 0 0 / .6)}
.rk-thaali i{position:absolute;width:28px;height:28px;border-radius:50%}
.rk-thaali .roli{left:16%;top:20%;background:#c1121f;box-shadow:inset 0 0 0 4px rgb(255 255 255 / .2)}
.rk-thaali .rice{right:16%;top:22%;background:#fff8e7;box-shadow:inset 0 0 0 4px #e6d6b0}
.rk-thaali .sweet{left:24%;bottom:14%;width:22px;height:22px;background:#ffb703}
.rk-thaali .sweet.b{left:auto;right:26%;background:#f4a261}
.rk-stack{position:relative;width:min(280px,70cqi);aspect-ratio:1;cursor:pointer}
.rk-old{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;gap:10px;padding:26px 22px;background:#f1e3c6;background-image:radial-gradient(circle at 20% 20%,rgb(255 255 255 / .4),transparent 40%),radial-gradient(circle at 80% 90%,rgb(120 80 30 / .2),transparent 40%);color:#4a3418;border-radius:4px;box-shadow:inset 0 0 0 10px #fbf5e8,0 20px 30px -16px rgb(0 0 0 / .6);transform:rotate(var(--r));animation:oldIn .6s var(--spring) both;filter:sepia(.2)}
.rk-old p{font:700 26px/1.2 var(--fh)}
.rk-year{font:800 10px var(--fb);letter-spacing:.2em;text-transform:uppercase;color:#8a6a3a}
@keyframes oldIn{from{opacity:0;transform:translateY(40px) rotate(0deg) scale(.9)}}
.rk-paper{background:#fffaf0;box-shadow:inset 0 0 0 8px #fff,inset 0 0 0 10px #E2B96B,0 30px 60px -30px rgb(0 0 0 / .6)}
.rk-promise{max-width:16ch;font:700 clamp(32px,10cqi,46px)/1.12 var(--fh);color:var(--t-fg)}

/* in-scene set pieces */
.pz-board.intro .pz-tile{border-width:0;border-radius:0;box-shadow:none;transition:none}
.pz-board.intro .pz-tile.gap{opacity:1}
.pr-big{font-size:clamp(72px,26cqi,130px);line-height:.9}

/* birthday: sing-along, presents, lantern */
.bd-sing{position:relative;display:flex;flex-direction:column;align-items:center;gap:4px;width:100%;margin-top:6px;transition:opacity .5s}
.bd-sing.done{opacity:0}
.bd-line{font:700 clamp(18px,5.6cqi,24px)/1.3 var(--fd);letter-spacing:-.01em;color:var(--t-mut)}
.bd-line span{display:inline-block;margin:0 .12em;opacity:.45;transition:color .15s,opacity .15s,transform .2s var(--spring)}
.bd-line span.sung{opacity:.8}
.bd-line span.on{opacity:1;color:var(--t-acc);transform:translateY(-4px) scale(1.15)}
.bd-line span.target{text-decoration:underline;text-decoration-style:wavy;text-decoration-color:var(--t-acc);text-underline-offset:6px}
.bd-horn{margin-top:10px;display:grid;place-items:center;width:78px;height:78px;border-radius:50%;background:var(--t-btn);color:var(--t-btn-fg);font-size:36px;box-shadow:0 14px 26px -12px rgb(0 0 0 / .6);transition:transform .2s var(--spring)}
.bd-horn:active{transform:scale(.9)}
.bd-horn.toot{animation:toot .35s var(--spring)}
@keyframes toot{40%{transform:scale(1.18) rotate(-12deg)}}
.bd-fb{min-height:1.3em;font:700 22px var(--fh);color:var(--t-acc);opacity:0}
.bd-fb.show{animation:capIn .5s var(--ease) forwards}
.bd-shelf{display:flex;flex-wrap:wrap;justify-content:center;gap:16px;width:100%;margin:10px 0}
.bd-mini{position:relative;width:96px;height:96px;animation:giftBob 2.6s ease-in-out calc(var(--i) * .3s) infinite}
.bd-mini-box{position:absolute;left:8%;right:8%;bottom:0;height:64%;border-radius:10px;background:linear-gradient(90deg,transparent 42%,#fff6 42% 58%,transparent 58%),var(--w);box-shadow:0 16px 20px -12px rgb(0 0 0 / .55)}
.bd-mini-lid{position:absolute;left:2%;right:2%;top:24%;z-index:1;height:18%;border-radius:7px;background:linear-gradient(90deg,transparent 42%,#fff8 42% 58%,transparent 58%),var(--w);filter:brightness(1.12);transition:transform .5s var(--spring)}
.bd-mini-lid::before{content:"";position:absolute;left:50%;top:-14px;width:26px;height:16px;margin-left:-13px;border:5px solid #fff;border-bottom:0;border-radius:50% 50% 0 0}
.bd-mini.done .bd-mini-lid{transform:translateY(-60px) rotate(-25deg);opacity:0;transition:transform .5s var(--ease),opacity .4s}
.bd-coupon{position:relative;display:flex;flex-direction:column;gap:4px;width:min(290px,80cqi);padding:14px 18px;border-radius:12px;background:#fffdf5;color:#2a2238;text-align:left;box-shadow:0 16px 30px -18px rgb(0 0 0 / .6);-webkit-mask:radial-gradient(circle 9px at 0 50%,transparent 98%,#000) left/51% 100% no-repeat,radial-gradient(circle 9px at 100% 50%,transparent 98%,#000) right/51% 100% no-repeat;mask:radial-gradient(circle 9px at 0 50%,transparent 98%,#000) left/51% 100% no-repeat,radial-gradient(circle 9px at 100% 50%,transparent 98%,#000) right/51% 100% no-repeat;animation:pop .5s var(--spring)}
.bd-coupon small{font:800 9.5px var(--fb);letter-spacing:.18em;text-transform:uppercase;color:#C2185B}
.bd-coupon b{font:700 21px/1.2 var(--fh)}
.bd-redeem{align-self:flex-end;font:800 13px var(--fb);color:#C2185B;text-decoration:underline;text-underline-offset:3px}
.bd-lantern{position:relative;width:200px;height:240px;margin:12px 0;transition:transform 2.6s cubic-bezier(.4,0,.6,1),opacity 2.6s}
.bd-lantern-top{position:absolute;left:24%;right:24%;top:0;height:16px;border-radius:6px 6px 0 0;background:#a3124b}
.bd-wish{position:absolute;inset:14px 0 26px;width:100%;padding:44px 22px 20px;border:0;border-radius:40% 40% 18% 18%/30% 30% 14% 14%;background:radial-gradient(circle at 50% 70%,#fff4c2,#ffcf6e 55%,#ff9f43);color:#5a2a10;font:700 22px/1.25 var(--fh);text-align:center;resize:none;box-shadow:0 0 40px rgb(255 183 3 / .55),inset 0 -14px 24px rgb(194 24 91 / .2)}
.bd-wish::placeholder{color:rgb(90 42 16 / .55)}
.bd-wish:focus{outline:0;box-shadow:0 0 0 3px #fff,0 0 50px rgb(255 183 3 / .7)}
.bd-lantern-glow{position:absolute;left:30%;right:30%;bottom:0;height:22px;border-radius:0 0 12px 12px;background:#a3124b}
.bd-lantern.fly{transform:translateY(-75cqh) scale(.35) rotate(-6deg);opacity:.2}
.bd-lanterns i{position:absolute;left:var(--x);bottom:-10%;width:var(--sz);height:calc(var(--sz) * 1.25);border-radius:40% 40% 20% 20%;background:radial-gradient(circle at 50% 70%,#fff4c2,#ff9f43);box-shadow:0 0 14px #ffb703;animation:lanternUp 6s ease-in var(--d) forwards}
@keyframes lanternUp{to{transform:translateY(-120cqh) rotate(8deg);opacity:.3}}

/* for her: catch the hearts, open-when envelopes */
.gf-tally{font:800 30px var(--fd);color:var(--t-acc);font-variant-numeric:tabular-nums}
.gf-rain{position:relative;width:100%;height:44cqh;border-radius:24px;background:var(--t-chip);overflow:hidden;touch-action:manipulation}
.gf-rain{transition:height .6s var(--ease),opacity .5s}
.gf-rain.stop{height:0;opacity:0;pointer-events:none}
.gf-drop{position:absolute;top:-12%;display:grid;place-items:center;width:54px;height:54px;margin-left:-27px;font-size:34px;line-height:1;color:var(--t-acc);text-shadow:0 0 14px var(--t-acc);animation:heartFall var(--dur) linear forwards;cursor:pointer}
.gf-drop.got{animation:none;transform:scale(1.8);opacity:0;transition:transform .25s,opacity .25s}
@keyframes heartFall{to{top:105%;transform:translateX(var(--sway)) rotate(20deg)}}
.gf-secret{max-height:20cqh;font:700 22px/1.3 var(--fh);color:#2a2238;text-align:center}
.gf-envs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;width:100%;max-width:420px}
.gf-envb{position:relative;aspect-ratio:1.4;padding:30% 10px 10px;border-radius:12px;background:linear-gradient(160deg,#fff8f0,#f1dcc6);color:#5a2a10;box-shadow:0 16px 26px -16px rgb(0 0 0 / .6);overflow:hidden;animation:capIn .5s var(--ease) calc(var(--i) * .1s) both;transition:transform .3s var(--spring),opacity .3s}
.gf-envb:hover{transform:translateY(-3px) rotate(-1deg)}
.gf-envb-flap{position:absolute;left:0;right:0;top:0;height:52%;background:linear-gradient(180deg,#f1dcc6,#e4c6a8);clip-path:polygon(0 0,100% 0,50% 100%)}
.gf-envb-t{position:relative;display:block;font:700 18px/1.15 var(--fh)}
.gf-envb.done{opacity:.55}
.gf-envb.done::after{content:"opened";position:absolute;right:8px;bottom:6px;font:800 9px var(--fb);letter-spacing:.14em;text-transform:uppercase;color:#a3124b}
.gf-reader{position:absolute !important;inset:0;z-index:5 !important;display:grid;place-items:center;padding:24px;background:rgb(10 6 18 / .7);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);animation:capIn .35s var(--ease)}
.gf-reader[hidden]{display:none}
.gf-note .body{font:600 22px/1.4 var(--fh)}
.gf-close{margin-top:14px;font:700 12px var(--fb);color:#8A8AA3;text-align:center}

/* best friend: likely quiz, dare wheel */
.fr-qcard{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;width:100%;max-width:380px;min-height:150px;padding:20px;border-radius:22px;background:#fff;color:#1a1a2e;box-shadow:0 20px 40px -20px rgb(0 0 0 / .6)}
.fr-qcard.in{animation:pop .45s var(--spring)}
.fr-q{font:750 clamp(22px,7cqi,30px)/1.15 var(--fd);letter-spacing:-.02em}
.fr-verdict{font:700 20px var(--fh);animation:capIn .4s var(--ease)}
.fr-verdict.ok{color:#2bb673}
.fr-verdict.no{color:#C2185B}
.fr-score{font:800 64px/1 var(--fd);color:#C2185B}
.fr-wheelwrap{position:relative;width:min(280px,70cqi);aspect-ratio:1;margin:8px 0}
.fr-wheel{position:absolute;inset:0;border-radius:50%;box-shadow:0 0 0 8px #fff,0 0 0 12px #2a2240,0 30px 50px -20px rgb(0 0 0 / .7)}
.fr-wedge{position:absolute;left:50%;top:50%;font:800 20px var(--fd);color:#fff;text-shadow:0 2px 4px rgb(0 0 0 / .35);transform:rotate(var(--a)) translateY(-36cqi) rotate(calc(-1 * var(--a)));translate:-50% -50%}
.fr-wheelwrap .fr-wedge{transform:rotate(var(--a)) translateY(-100px) rotate(calc(-1 * var(--a)))}
.fr-pointer{position:absolute;left:50%;top:-14px;z-index:2;width:0;height:0;margin-left:-14px;border-left:14px solid transparent;border-right:14px solid transparent;border-top:26px solid #ffe066;filter:drop-shadow(0 3px 3px rgb(0 0 0 / .4))}
.fr-spin{position:absolute;left:50%;top:50%;z-index:2;width:78px;height:78px;margin:-39px 0 0 -39px;border-radius:50%;background:#1a1a2e;color:#ffe066;font:800 16px var(--fd);letter-spacing:.06em;box-shadow:0 0 0 5px #fff,0 10px 20px rgb(0 0 0 / .5);transition:transform .25s var(--spring)}
.fr-spin:active{transform:scale(.92)}
.fr-dare{display:flex;flex-direction:column;align-items:center;gap:8px;opacity:0}
.fr-dare.show{animation:capIn .5s var(--ease) forwards}
.fr-dare small{font:800 10.5px var(--fb);letter-spacing:.2em;text-transform:uppercase;color:var(--t-mut)}
.fr-dare b{max-width:22ch;font:700 26px/1.15 var(--fh);color:var(--t-fg)}

/* anniversary: then & now, places map */
.an-cmp{position:relative;width:min(320px,82cqi);aspect-ratio:1;border-radius:18px;overflow:hidden;box-shadow:0 30px 50px -24px rgb(0 0 0 / .7);touch-action:none;cursor:ew-resize}
.an-cmp img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;pointer-events:none}
.an-cmp>img{filter:sepia(.5) contrast(.95)}
.an-cmp-now{position:absolute;inset:0;clip-path:inset(0 0 0 calc(var(--k,.5) * 100%))}
.an-cmp-h{position:absolute;top:0;bottom:0;left:calc(var(--k,.5) * 100%);width:4px;margin-left:-2px;background:#fff;box-shadow:0 0 12px rgb(0 0 0 / .4)}
.an-cmp-h::after{content:"\2194";position:absolute;left:50%;top:50%;display:grid;place-items:center;width:40px;height:40px;margin:-20px 0 0 -20px;border-radius:50%;background:#fff;color:#1a1a2e;font:800 18px var(--fb);box-shadow:0 4px 12px rgb(0 0 0 / .35)}
.an-cmp-l{position:absolute;bottom:10px;padding:4px 10px;border-radius:999px;background:rgb(0 0 0 / .5);color:#fff;font:700 16px var(--fh)}
.an-cmp-l.then{left:10px}
.an-cmp-l.now{right:10px}
.an-map{position:relative;width:100%;max-width:400px;height:54cqh;border-radius:22px;background:radial-gradient(var(--t-chip) 1.5px,transparent 1.5px) 0 0/14px 14px,var(--t-chip);overflow:hidden}
.an-map svg{position:absolute;inset:0;width:100%;height:100%}
.an-map line{stroke:var(--t-acc);stroke-width:.6;stroke-dasharray:2 1.6;vector-effect:non-scaling-stroke;stroke-width:2.5}
.an-pin{position:absolute;width:36px;height:36px;margin:-34px 0 0 -18px;border-radius:50% 50% 50% 0;background:var(--t-chip);transform:rotate(-45deg);box-shadow:inset 0 0 0 3px var(--t-mut);transition:background .3s,box-shadow .3s}
.an-pin.next{background:var(--t-acc);box-shadow:0 0 0 6px rgb(255 255 255 / .12),0 0 18px var(--t-acc);animation:pinPulse 1.2s ease-in-out infinite}
.an-pin.done{background:var(--t-acc);box-shadow:none}
@keyframes pinPulse{50%{transform:rotate(-45deg) scale(1.15)}}
.an-pin-l{position:absolute;left:50%;top:100%;white-space:nowrap;padding:3px 9px;border-radius:999px;background:rgb(0 0 0 / .45);color:#fff;font:700 15px var(--fh);transform:rotate(45deg) translate(-10%,40%);transform-origin:0 0;opacity:.5;pointer-events:none}
.an-pin.next .an-pin-l,.an-pin.done .an-pin-l{opacity:1}
.an-plane{position:absolute;z-index:2;font-size:26px;line-height:1;transform:translate(-50%,-50%) rotate(var(--rot,90deg));transition:left .7s var(--ease),top .7s var(--ease),transform .3s;filter:drop-shadow(0 4px 4px rgb(0 0 0 / .3));pointer-events:none}

/* proposal: shell game, future postcards */
.pr-table{position:relative;width:min(330px,86cqi);height:170px;margin:14px 0;border-radius:20px;background:linear-gradient(180deg,transparent 60%,rgb(0 0 0 / .12))}
.pr-cup,.pr-hidden-ring{position:absolute;bottom:18px;left:calc(var(--x,0) * 33.33% + 16.66%);transition:left .32s cubic-bezier(.5,0,.3,1),transform .4s var(--spring)}
.pr-hidden-ring{z-index:0;font-size:34px;transform:translate(-50%,0)}
.pr-cup{z-index:1;width:84px;height:104px;margin-left:-42px;border-radius:14px 14px 6px 6px;background:linear-gradient(90deg,#a3124b,#E91E63 45%,#c2185b);clip-path:polygon(16% 0,84% 0,100% 100%,0 100%);box-shadow:inset 0 -10px 0 rgb(0 0 0 / .15)}
.pr-cup::after{content:"";position:absolute;left:18%;right:18%;top:10px;height:6px;border-radius:6px;background:rgb(255 255 255 / .35)}
.pr-cup:not(:disabled):hover{transform:translateY(-6px)}
.pr-table.peek .pr-cup,.pr-cup.lifted{transform:translateY(-78px)}
.pr-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;width:100%;max-width:400px}
.pr-post{position:relative;aspect-ratio:1.45;perspective:700px;animation:capIn .5s var(--ease) calc(var(--i) * .12s) both}
.pr-post-f,.pr-post-b{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;padding:10px;border-radius:10px;backface-visibility:hidden;-webkit-backface-visibility:hidden;transition:transform .6s var(--ease);box-shadow:0 16px 26px -16px rgb(0 0 0 / .6)}
.pr-post-f{background:repeating-linear-gradient(45deg,#fff 0 10px,#ffe1ea 10px 20px);color:#C2185B}
.pr-post-f b{font-size:34px}
.pr-post-f small,.pr-post-b small{font:800 9.5px var(--fb);letter-spacing:.18em;text-transform:uppercase}
.pr-post-b{background:#fffdf5;color:#2a2238;transform:rotateY(180deg)}
.pr-post-b small{color:#C2185B}
.pr-post-b em{font:700 19px/1.15 var(--fh);font-style:normal}
.pr-post.flip .pr-post-f{transform:rotateY(-180deg)}
.pr-post.flip .pr-post-b{transform:rotateY(0)}

/* apology: kintsugi heart, grow a flower */
.ap-heart{position:relative;width:min(230px,60cqi);aspect-ratio:1;margin:30px 0 20px}
.ap-piece{position:absolute;inset:0;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cdefs%3E%3ClinearGradient id='g' x1='0' y1='0' x2='1' y2='1'%3E%3Cstop offset='0' stop-color='%23ff7aa2'/%3E%3Cstop offset='1' stop-color='%23c2185b'/%3E%3C/linearGradient%3E%3C/defs%3E%3Cpath d='M50 92C22 72 2 54 8 32 13 14 38 10 50 28 62 10 87 14 92 32 98 54 78 72 50 92Z' fill='url(%23g)'/%3E%3C/svg%3E") center/contain no-repeat;cursor:grab;touch-action:none;transition:transform .45s var(--spring),filter .3s;filter:drop-shadow(0 10px 14px rgb(0 0 0 / .35))}
.ap-piece.drag{transition:none;cursor:grabbing;z-index:2}
.ap-piece.home{cursor:default}
.ap-seam{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible}
.ap-seam polyline{fill:none;stroke:#E2B96B;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:140;stroke-dashoffset:140;filter:drop-shadow(0 0 3px #ffd75e)}
.ap-heart.mended .ap-seam polyline{animation:drawLine 1.3s var(--ease) forwards}
.ap-heart.mended{animation:heartBeat 1.6s ease-in-out .9s 2}
.ap-pot{position:relative;width:170px;height:240px;margin:6px 0}
.ap-potbody{position:absolute;left:28px;right:28px;bottom:0;height:70px;background:linear-gradient(90deg,#b5542d,#d9734a 50%,#b5542d);clip-path:polygon(0 0,100% 0,88% 100%,12% 100%);border-radius:4px}
.ap-soil{position:absolute;left:30px;right:30px;bottom:62px;height:12px;border-radius:50%;background:#5a3418}
.ap-stem{position:absolute;left:50%;bottom:68px;width:6px;height:calc(14px + var(--g) * 120px);margin-left:-3px;border-radius:3px;background:#2bb673;transition:height .8s var(--spring)}
.ap-leaf{position:absolute;left:50%;bottom:calc(70px + var(--g) * 50px);width:34px;height:18px;border-radius:0 100% 0 100%;background:#2bb673;opacity:calc(var(--g) * 2);transition:bottom .8s var(--spring),opacity .5s}
.ap-leaf.l{margin-left:-36px;transform:rotate(-20deg) scaleX(-1)}
.ap-leaf.r{margin-left:2px;transform:rotate(-20deg)}
.ap-bloom{position:absolute;left:50%;bottom:calc(76px + var(--g) * 120px);width:64px;height:64px;margin-left:-32px;border-radius:50%;background:radial-gradient(circle,#ffd75e 0 22%,transparent 23%),conic-gradient(from 0deg,#ff8fb1 0 45deg,#ffd1dc 45deg 90deg,#ff8fb1 90deg 135deg,#ffd1dc 135deg 180deg,#ff8fb1 180deg 225deg,#ffd1dc 225deg 270deg,#ff8fb1 270deg 315deg,#ffd1dc 315deg);-webkit-mask:radial-gradient(circle,#000 62%,transparent 64%);mask:radial-gradient(circle,#000 62%,transparent 64%);transform:scale(0) rotate(-90deg);transition:transform .9s var(--spring),bottom .8s var(--spring)}
.ap-pot.bloomed .ap-bloom{transform:scale(1) rotate(0)}
.ap-tag{position:absolute;left:50%;bottom:20px;padding:4px 12px;border-radius:6px;background:#fffdf5;color:#5a3418;font:700 18px var(--fh);transform:translateX(-50%) rotate(-3deg);animation:pop .5s var(--spring);white-space:nowrap}
.ap-drops{position:absolute;left:50%;top:0;width:60px;height:80px;margin-left:-30px;background:radial-gradient(circle,#8ed1fc 2px,transparent 3px) 0 0/14px 18px;animation:dropsFall .9s linear forwards}
@keyframes dropsFall{from{transform:translateY(-20px);opacity:1}to{transform:translateY(90px);opacity:0}}
.ap-can{display:grid;place-items:center;width:72px;height:72px;border-radius:50%;background:var(--t-btn);color:var(--t-btn-fg);font-size:32px;box-shadow:0 14px 26px -12px rgb(0 0 0 / .6);transition:transform .25s var(--spring)}
.ap-can.pour{animation:pour .5s var(--ease)}
.ap-can:disabled{opacity:.4}
@keyframes pour{40%{transform:rotate(-30deg) translateY(-6px)}}

/* raksha bandhan: face (tilak + mithai), pick a gift; puzzle level card */
.rk-face{position:relative;width:200px;height:220px;margin:8px 0;--tilak:0}
.rk-face::before{content:"";position:absolute;left:10px;right:10px;top:20px;bottom:0;border-radius:46% 46% 44% 44%;background:radial-gradient(circle at 50% 40%,#f2c39e,#d99a6c);box-shadow:inset -10px -12px 0 rgb(0 0 0 / .06),0 20px 30px -16px rgb(0 0 0 / .6)}
.rk-hair{position:absolute;left:4px;right:4px;top:6px;height:86px;border-radius:50% 50% 30% 30%/70% 70% 30% 30%;background:#2b1a10}
.rk-eye{position:absolute;top:118px;width:14px;height:16px;border-radius:50%;background:#2b1a10}
.rk-eye.l{left:62px}
.rk-eye.r{right:62px}
.rk-face.happy .rk-eye{height:7px;border-radius:0 0 14px 14px;top:122px;background:none;border:3px solid #2b1a10;border-top:0}
.rk-cheek{position:absolute;top:142px;width:24px;height:12px;border-radius:50%;background:#ff8fab;opacity:.45}
.rk-cheek.l{left:40px}
.rk-cheek.r{right:40px}
.rk-mouth{position:absolute;left:50%;top:162px;width:34px;height:16px;margin-left:-17px;border-radius:0 0 20px 20px;background:#8a2b2b}
.rk-face.chomp .rk-mouth{animation:chomp .25s ease-in-out 4}
@keyframes chomp{50%{height:6px;top:166px}}
.rk-tilak{position:absolute;left:50%;top:84px;width:12px;height:30px;margin-left:-6px;border-radius:50% 50% 45% 45%;background:#d00000;opacity:var(--tilak);transform:scale(calc(.4 + var(--tilak) * .6));box-shadow:0 0 0 2px rgb(255 200 0 / calc(var(--tilak) * .6))}
.rk-forehead{position:absolute;left:50px;right:50px;top:70px;height:56px;border-radius:40%;cursor:pointer;touch-action:none}
.rk-sweet{width:56px;height:56px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#ffd166,#f4a261 60%,#d97706);box-shadow:inset 0 0 0 4px rgb(255 255 255 / .15),0 10px 16px -6px rgb(0 0 0 / .5);background-image:radial-gradient(circle at 35% 30%,#ffd166,#f4a261 60%,#d97706),radial-gradient(circle,#fff6 1.5px,transparent 2px);cursor:grab;touch-action:none}
.rk-sweet.eaten{transition:transform .3s,opacity .3s;opacity:0;transform:scale(.2) !important}
.rk-giftrow{display:flex;justify-content:center;gap:16px;margin:14px 0}
.rk-gift{position:relative;width:90px;height:100px;animation:giftBob 2.4s ease-in-out calc(var(--i) * .25s) infinite;transition:opacity .4s,transform .5s var(--spring)}
.rk-gift-box{position:absolute;left:8%;right:8%;bottom:0;height:62%;border-radius:10px;background:linear-gradient(90deg,transparent 42%,#ffd166 42% 58%,transparent 58%),var(--w);box-shadow:0 14px 20px -12px rgb(0 0 0 / .6)}
.rk-gift-lid{position:absolute;left:2%;right:2%;top:26%;z-index:1;height:16%;border-radius:7px;background:linear-gradient(90deg,transparent 42%,#ffd166 42% 58%,transparent 58%),var(--w);filter:brightness(1.15)}
.rk-gift-n{position:absolute;left:50%;bottom:16%;z-index:2;font:800 18px var(--fd);color:#fff;transform:translateX(-50%)}
.rk-gift.chosen{animation:none;transform:scale(1.15)}
.rk-gift.chosen .rk-gift-lid{transform:translateY(-40px) rotate(-20deg);opacity:0;transition:transform .5s var(--ease),opacity .4s}
.rk-gift.other{opacity:.3;animation:none}
.rk-won{display:flex;flex-direction:column;align-items:center;gap:8px;padding:16px 20px;border-radius:16px;background:var(--t-chip);animation:pop .5s var(--spring)}
.rk-won small{font:800 10.5px var(--fb);letter-spacing:.2em;text-transform:uppercase;color:var(--t-mut)}
.rk-won b{max-width:22ch;font:700 26px/1.15 var(--fh);color:var(--t-fg)}
.pz-cleared{font-size:14px}

/* ---------- cloud gifts: loading, voice note ---------- */
.gv-loading{justify-content:center}
.gv-spinner{width:42px;height:42px;border-radius:50%;border:3px solid rgb(255 255 255 / .2);border-top-color:#fff;animation:gvspin .8s linear infinite}
@keyframes gvspin{to{transform:rotate(360deg)}}
.gv-voice{--k:0;display:flex;align-items:center;gap:14px;width:min(340px,100%);margin:14px auto 4px;padding:12px 16px 12px 12px;border-radius:999px;background:var(--t-chip);box-shadow:0 14px 30px -18px rgb(0 0 0 / .6);animation:pop .5s var(--spring)}
.gv-voice-btn{flex:none;display:grid;place-items:center;width:54px;height:54px;border-radius:50%;background:var(--t-btn);color:var(--t-btn-fg);box-shadow:0 10px 20px -10px rgb(0 0 0 / .6);animation:heartBeat 1.6s ease-in-out infinite}
.gv-voice-btn::before{content:"";margin-left:4px;border-style:solid;border-width:10px 0 10px 16px;border-color:transparent transparent transparent currentColor}
.gv-voice.on .gv-voice-btn{animation:none}
.gv-voice.on .gv-voice-btn::before{width:14px;height:18px;margin:0;border:0;border-left:5px solid currentColor;border-right:5px solid currentColor}
.gv-voice-txt{display:flex;flex-direction:column;gap:6px;flex:1;min-width:0;text-align:left}
.gv-voice-txt b{font:700 14px var(--fb);color:var(--t-fg)}
.gv-voice-bars{display:flex;align-items:center;gap:3px;height:22px}
.gv-voice-bars i{flex:1;height:calc(var(--h) * 100%);border-radius:2px;background:var(--t-fg);opacity:.3;transition:opacity .2s}
.gv-voice-bars i:nth-child(-n+24){opacity:calc(.3 + .7 * clamp(0, (var(--k) * 24 - var(--i)) , 1))}
.gv-voice.on .gv-voice-bars i{animation:vbar .9s ease-in-out calc(var(--i) * -.07s) infinite alternate}
@keyframes vbar{to{transform:scaleY(.55)}}
.gv-voice-t{font:700 11px var(--fb);letter-spacing:.08em;color:var(--t-mut)}

/* more photos (cloud gifts) */
.fr-strip.two{display:grid;grid-template-columns:1fr 1fr;width:236px}
.fr-strip.two .fr-strip-foot{grid-column:1/-1}
.fr-strip.two .fr-frame figcaption{font-size:13px}
.ap-photos.many{flex-wrap:wrap;max-width:min(360px,92cqi);row-gap:14px}
.ap-photos.many .ap-ph{width:min(112px,29cqi);margin:0 -6px;animation-delay:calc(var(--d) * .15s)}
.ap-photos.many .ap-ph figcaption{font-size:13px}