/* Shared Szipka artwork and smoke: Battle V3, v2.1 showcase, skin shop. */
.puk-pipe-art{position:relative;display:inline-block;width:100px;height:100px;isolation:isolate;overflow:visible}
.puk-pipe-art>img{position:relative;z-index:2;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 0 9px var(--puk-c2));animation:pukPipeFloat 5s ease-in-out infinite}
.puk-smoke{position:absolute;inset:0;pointer-events:none;overflow:visible}
.puk-smoke i{position:absolute;left:18%;top:29%;width:32%;height:39%;border-radius:42% 58% 62% 38%;background:radial-gradient(ellipse,var(--puk-c2),transparent 68%);filter:blur(5px);opacity:0;animation:pukSmokeRise 5.6s linear infinite;animation-delay:calc(var(--smoke-i)*-.7s)}
.puk-smoke i:nth-child(even){background:radial-gradient(ellipse,var(--puk-c1),transparent 70%);animation-name:pukSmokeCurl}
@keyframes pukPipeFloat{50%{transform:translateY(-3px) rotate(-2deg)}}
@keyframes pukSmokeRise{0%{opacity:0;transform:translate(0,0) scale(.25)}18%{opacity:.7}65%{opacity:.28;transform:translate(-14px,-64px) scale(1.8) rotate(80deg)}100%{opacity:0;transform:translate(26px,-110px) scale(2.8) rotate(135deg)}}
@keyframes pukSmokeCurl{0%{opacity:0;transform:translate(0,0) scale(.2)}22%{opacity:.65}65%{opacity:.32;transform:translate(20px,-65px) scale(2) rotate(-70deg)}100%{opacity:0;transform:translate(-24px,-115px) scale(2.6) rotate(-130deg)}}
.puk-pipe-meter{position:absolute;left:22px;bottom:-4px;z-index:35;isolation:isolate;width:132px;height:118px;margin:0;cursor:help;outline-offset:5px;pointer-events:auto}
.puk-pipe-meter .puk-pipe-art{position:absolute;left:0;bottom:0;width:118px;height:118px}
.puk-pipe-meter .puk-pipe-art::before{content:"";position:absolute;z-index:0;inset:8px 3px 3px;border-radius:50%;pointer-events:none;background:radial-gradient(ellipse at 38% 62%,color-mix(in srgb,var(--puk-c1) 70%,white) 0%,color-mix(in srgb,var(--puk-c1) 48%,transparent) 28%,transparent 67%),radial-gradient(ellipse at 65% 42%,color-mix(in srgb,var(--puk-c2) 78%,white) 0%,color-mix(in srgb,var(--puk-c2) 58%,transparent) 32%,transparent 72%);filter:blur(10px);opacity:.85}
.puk-pipe-meter .puk-pipe-art>img{filter:drop-shadow(0 0 3px color-mix(in srgb,var(--puk-c2) 50%,white)) drop-shadow(0 0 10px var(--puk-c2))}
.puk-card-smoke{position:absolute;inset:0;z-index:12;pointer-events:none;overflow:visible;border-radius:inherit;isolation:isolate}
.puk-pipe-meter .puk-smoke{display:none}
.puk-pipe-meter .puk-pipe-art>img{animation:none}
.puk-card-smoke-source,.puk-smoke-trail{position:absolute;inset:0;pointer-events:none;overflow:visible}
.puk-card-smoke-source{z-index:2}
.puk-card-smoke-source i{position:absolute;left:var(--puk-source-x);top:var(--puk-source-y);width:30px;height:48px;border-radius:48% 52% 61% 39%;background:radial-gradient(ellipse at 50% 78%,color-mix(in srgb,var(--puk-c2) 96%,white),color-mix(in srgb,var(--puk-c2) 60%,transparent) 44%,transparent 73%);filter:blur(4px);opacity:0;animation:pukPipeSourcePlume 4.8s ease-out infinite;animation-delay:calc(var(--puk-smoke-i)*-.48s)}
.puk-card-smoke-source i:nth-child(even){width:36px;height:55px;background:radial-gradient(ellipse at 50% 78%,color-mix(in srgb,var(--puk-c1) 96%,white),color-mix(in srgb,var(--puk-c1) 62%,transparent) 46%,transparent 74%);filter:blur(5px);animation-name:pukPipeSourcePlumeAlt}
.puk-card-smoke-source::before,.puk-card-smoke-source::after{position:absolute;left:calc(var(--puk-source-x) - 4px);top:calc(var(--puk-source-y) - 7px);width:34px;height:55px;border:3px solid color-mix(in srgb,var(--puk-c2) 82%,transparent);border-right-color:transparent;border-bottom-color:transparent;border-radius:50%;opacity:0;filter:blur(2px) drop-shadow(0 0 7px var(--puk-c2));content:"";animation:pukPipeSmokeRibbon 4s ease-out infinite}
.puk-card-smoke-source::after{border-color:color-mix(in srgb,var(--puk-c1) 84%,transparent);border-left-color:transparent;border-bottom-color:transparent;filter:blur(3px) drop-shadow(0 0 7px var(--puk-c1));animation-delay:-2s;animation-name:pukPipeSmokeRibbonAlt}
.puk-smoke-trail{z-index:1;filter:blur(5px);clip-path:inset(-100px -100px 0 -100px)}
/* Let V3 smoke's blurred edges dissipate below the frame without a hard cut. */
body.v3-body .puk-smoke-trail{clip-path:none}
.puk-smoke-trail>i{position:absolute;left:0;top:0;width:74px;height:46px;offset-path:var(--puk-smoke-path);offset-anchor:50% 50%;offset-rotate:auto;opacity:0;animation:pukSmokeTravel 22s linear infinite;animation-delay:calc(var(--puk-smoke-i)*-22s/72)}
.puk-smoke-trail b{display:block;width:100%;height:100%;border-radius:46% 54% 39% 61%;background:radial-gradient(ellipse at 36% 48%,var(--puk-c2),transparent 69%);animation:pukSmokeDrift 4.8s ease-in-out infinite alternate;animation-delay:calc(var(--puk-smoke-i)*-.43s)}
.puk-smoke-trail>i:nth-child(even) b{background:radial-gradient(ellipse at 64% 52%,var(--puk-c1),transparent 69%);animation-direction:alternate-reverse}
.puk-smoke-trail>i:nth-child(3n){width:88px;height:54px}
@keyframes pukSmokeTravel{0%{offset-distance:0%;opacity:0;scale:.35}8%{opacity:.24;scale:.8}20%{opacity:.36;scale:1}72%{opacity:.28;scale:1.1}90%{opacity:.18}100%{offset-distance:100%;opacity:0;scale:1.25}}
@keyframes pukSmokeDrift{from{transform:translateY(-7px) rotate(-9deg) scaleY(.85)}to{transform:translateY(7px) rotate(9deg) scaleY(1.2)}}
@keyframes pukPipeSourcePlume{0%{opacity:0;transform:translate(0,0) scale(.2) rotate(0)}14%{opacity:.92}54%{opacity:.66;transform:translate(-9px,-54px) scale(1.25) rotate(52deg)}100%{opacity:0;transform:translate(14px,-112px) scale(2.05) rotate(132deg)}}
@keyframes pukPipeSourcePlumeAlt{0%{opacity:0;transform:translate(0,0) scale(.2) rotate(0)}16%{opacity:.9}56%{opacity:.64;transform:translate(13px,-58px) scale(1.32) rotate(-56deg)}100%{opacity:0;transform:translate(-12px,-118px) scale(2.12) rotate(-138deg)}}
@keyframes pukPipeSmokeRibbonAlt{0%{opacity:0;transform:translate(0,0) scale(.35) rotate(0)}18%{opacity:.82}58%{opacity:.58;transform:translate(8px,-62px) scale(1.35) rotate(-105deg)}100%{opacity:0;transform:translate(-7px,-128px) scale(2.1) rotate(-230deg)}}
@keyframes pukPipeSmokeRibbon{0%{opacity:0;transform:translate(0,0) scale(.35) rotate(0)}18%{opacity:.82}58%{opacity:.58;transform:translate(-5px,-58px) scale(1.35) rotate(100deg)}100%{opacity:0;transform:translate(9px,-124px) scale(2.1) rotate(225deg)}}
@media(prefers-reduced-motion:reduce){.puk-card-smoke-source i,.puk-card-smoke-source::before,.puk-card-smoke-source::after,.puk-smoke-trail>i,.puk-smoke-trail b{animation:none!important}.puk-smoke-trail>i{offset-distance:calc(var(--puk-smoke-i)*100%/72);opacity:.2}.puk-card-smoke-source i:first-child{opacity:.5;transform:translate(-4px,-46px) scale(1.25)}.puk-card-smoke-source i:nth-child(2){opacity:.45;transform:translate(9px,-72px) scale(1.5)}}
body.v3-body>.item-tooltip-floating[class*="v3-tooltip-tone-puk-"]:has(.puk-tooltip){width:min(430px,calc(100vw - 20px));max-height:calc(100vh - 20px);padding:0;overflow:hidden;border:1px solid color-mix(in srgb,var(--puk-tip-accent) 72%,var(--puk-tip-light));border-radius:18px;--v3-tooltip-accent:var(--puk-tip-accent);--v3-tooltip-value:var(--puk-tip-light);background:linear-gradient(145deg,color-mix(in srgb,var(--puk-tip-dark) 91%,#050509),color-mix(in srgb,var(--puk-tip-accent) 12%,#050509));box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--puk-tip-light) 10%,transparent),inset 0 1px color-mix(in srgb,var(--puk-tip-light) 24%,transparent),0 22px 60px rgba(0,0,0,.82),0 0 31px color-mix(in srgb,var(--puk-tip-accent) 25%,transparent)}
body.v3-body>.item-tooltip-floating.v3-tooltip-tone-puk-alap{--puk-tip-dark:#23351e;--puk-tip-accent:#a51d79;--puk-tip-light:#ff81bc}
body.v3-body>.item-tooltip-floating.v3-tooltip-tone-puk-kristaly{--puk-tip-dark:#26305b;--puk-tip-accent:#b278d8;--puk-tip-light:#fbfafb}
body.v3-body>.item-tooltip-floating.v3-tooltip-tone-puk-jeg{--puk-tip-dark:#071731;--puk-tip-accent:#5a8cef;--puk-tip-light:#b9d6ff}
body.v3-body>.item-tooltip-floating.v3-tooltip-tone-puk-rem{--puk-tip-dark:#121126;--puk-tip-accent:#8350c5;--puk-tip-light:#d2bbf5}
body.v3-body>.item-tooltip-floating.v3-tooltip-tone-puk-mese{--puk-tip-dark:#1d2d28;--puk-tip-accent:#f172d3;--puk-tip-light:#fdd4e0}
body.v3-body>.item-tooltip-floating.v3-tooltip-tone-puk-vip{--puk-tip-dark:#322419;--puk-tip-accent:#f3b772;--puk-tip-light:#f8eee1}
body.v3-body>.item-tooltip-floating.v3-tooltip-tone-puk-rend:has(.puk-tooltip){--puk-tip-dark:#1C1315;--puk-tip-accent:#B41D26;--puk-tip-light:#B1695E}
body.v3-body>.item-tooltip-floating[class*="v3-tooltip-tone-puk-"]:has(.puk-tooltip)::before{right:28px;left:28px;height:2px;background:linear-gradient(90deg,transparent,var(--puk-tip-accent),var(--puk-tip-light),var(--puk-tip-accent),transparent);box-shadow:0 0 16px var(--puk-tip-accent)}
body.v3-body>.item-tooltip-floating[class*="v3-tooltip-tone-puk-"]:has(.puk-tooltip)::after{border-color:color-mix(in srgb,var(--puk-tip-accent) 75%,transparent);background:color-mix(in srgb,var(--puk-tip-dark) 76%,#050509)}
body.v3-body>.item-tooltip-floating .item-tooltip-desc:has(.puk-tooltip){margin:0;padding:0;color:inherit;font:inherit;line-height:inherit}
.puk-tooltip{position:relative;isolation:isolate;overflow:hidden;padding:14px;color:#f7edf9;font:500 .76rem/1.3 "Outfit",sans-serif;background:radial-gradient(ellipse at 5% 0,color-mix(in srgb,var(--puk-c2) 30%,transparent),transparent 58%),radial-gradient(ellipse at 100% 100%,color-mix(in srgb,var(--puk-c3) 16%,transparent),transparent 52%),linear-gradient(145deg,color-mix(in srgb,var(--puk-c1) 20%,#0b080e),#08060d)}
.puk-tooltip-mist{position:absolute;z-index:-1;inset:-40%;opacity:.22;background:repeating-conic-gradient(from 30deg,transparent 0 27deg,var(--puk-c1) 35deg,transparent 48deg,var(--puk-c2) 68deg,transparent 90deg);filter:blur(20px);animation:pukTooltipMist 22s linear infinite}
@keyframes pukTooltipMist{to{transform:rotate(360deg) scale(1.15)}}
.puk-tooltip header{position:relative;z-index:2;display:grid;grid-template-columns:58px minmax(0,1fr) auto;gap:10px;align-items:center;padding-bottom:10px;border-bottom:1px solid color-mix(in srgb,var(--puk-c4) 28%,transparent)}
.puk-tooltip header .puk-pipe-art{width:54px;height:54px}
.puk-tooltip header small,.puk-tooltip header strong,.puk-tooltip header em{display:block}
.puk-tooltip header small{font-size:.61rem;font-weight:900;letter-spacing:.14em;color:color-mix(in srgb,var(--puk-c4) 82%,white)}
.puk-tooltip header strong{margin-top:2px;font-size:1.08rem;line-height:1.12;color:#fff;text-shadow:0 0 14px color-mix(in srgb,var(--puk-c2) 62%,transparent)}
.puk-tooltip header em{margin-top:3px;font-size:.66rem;font-style:normal;color:#dccfe4}
.puk-tooltip header>b{padding:5px 8px;border:1px solid color-mix(in srgb,var(--puk-c4) 54%,transparent);border-radius:999px;background:color-mix(in srgb,var(--puk-c2) 16%,#08060dcc);color:color-mix(in srgb,var(--puk-c4) 76%,white);font-size:.78rem;box-shadow:0 0 10px color-mix(in srgb,var(--puk-c2) 24%,transparent)}
.puk-depth-guide{position:relative;z-index:2;display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-top:9px}
.puk-depth-guide>div{display:grid;grid-template-columns:31px minmax(0,1fr);align-items:center;gap:6px;min-height:62px;padding:6px;border:1px solid color-mix(in srgb,var(--puk-c4) 15%,transparent);border-radius:9px;background:linear-gradient(110deg,color-mix(in srgb,var(--puk-c2) 9%,transparent),#05040955)}
.puk-depth-guide img{width:29px;height:29px;object-fit:contain;filter:drop-shadow(0 0 5px color-mix(in srgb,var(--puk-c2) 62%,transparent))}
.puk-depth-guide span{min-width:0}.puk-depth-guide small,.puk-depth-guide b,.puk-depth-guide em{display:block}.puk-depth-guide small{color:var(--puk-c4);font-size:.49rem;font-weight:900;letter-spacing:.06em}.puk-depth-guide b{margin-top:1px;color:#fff;font-size:.63rem}.puk-depth-guide em{margin-top:2px;color:#cfc2d7;font-size:.52rem;font-style:normal;line-height:1.18}
.puk-tooltip h4{position:relative;z-index:2;margin:10px 0 6px;color:color-mix(in srgb,var(--puk-c4) 68%,white);font-size:.58rem;letter-spacing:.14em}
.puk-enemies{position:relative;z-index:2;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:5px}
.puk-enemies>div{display:grid;grid-template-columns:28px minmax(0,1fr) auto;align-items:center;gap:7px;min-height:43px;padding:6px 7px;border:1px solid #ffffff10;border-radius:8px;background:#05040966}
.puk-enemies>div.is-affected{border-color:color-mix(in srgb,var(--puk-c2) 30%,transparent);background:linear-gradient(100deg,color-mix(in srgb,var(--puk-c2) 11%,transparent),#05040966)}
.puk-enemies img{width:27px;height:27px;border:1px solid color-mix(in srgb,var(--puk-c4) 24%,transparent);border-radius:50%;object-fit:cover}
.puk-enemies span{min-width:0}.puk-enemies strong,.puk-enemies small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.puk-enemies strong{color:#fff;font-size:.66rem}.puk-enemies small{margin-top:2px;color:#bfaec9;font-size:.54rem}.puk-enemies>div>b{color:var(--puk-c4);font-size:.7rem}.puk-enemies>div.is-clear>b{color:#887f8c}.puk-enemies>em{grid-column:1/-1;padding:8px;color:#bfaec9;text-align:center}
.puk-tooltip>p{position:relative;z-index:2;margin:8px 0 0;padding:7px 8px;border:1px solid color-mix(in srgb,var(--puk-c4) 11%,transparent);border-radius:8px;background:#05040955;color:#cbbdd3;font-size:.57rem;line-height:1.3}.puk-tooltip>p b{color:color-mix(in srgb,var(--puk-c4) 75%,white)}
.puk-tooltip footer{position:relative;z-index:2;display:grid;grid-template-columns:1fr 1fr;gap:5px;margin-top:6px;padding-top:6px;border-top:1px solid #ffffff16;font-size:.56rem}
.puk-tooltip footer span{display:grid;grid-template-columns:25px 1fr;align-items:center;gap:6px;padding:5px 6px;border-radius:8px;background:#ffffff08;color:#d3c4da}.puk-tooltip footer img{width:23px;height:23px;object-fit:contain;filter:drop-shadow(0 0 5px var(--puk-c2))}
@media(max-width:390px){body.v3-body>.item-tooltip-floating[class*="v3-tooltip-tone-puk-"]:has(.puk-tooltip){width:calc(100vw - 12px)}.puk-tooltip{padding:10px}.puk-depth-guide{gap:3px}.puk-depth-guide>div{display:flex;flex-direction:column;align-items:flex-start}.puk-enemies{grid-template-columns:1fr}.puk-tooltip footer{grid-template-columns:1fr}}
/* Each skin changes both the palette and the shape/motion of its tooltip. */
[data-puk-theme="kristaly"]>.puk-tooltip-mist{filter:blur(2px);opacity:.13;clip-path:polygon(0 0,100% 18%,76% 100%,0 75%);animation-duration:30s}
[data-puk-theme="jeg"]>.puk-tooltip-mist{background:repeating-linear-gradient(115deg,transparent 0 27px,var(--puk-c5) 28px 30px,transparent 31px 65px);filter:blur(3px);animation:pukIceMist 8s ease-in-out infinite alternate}
@keyframes pukIceMist{to{transform:translateY(55px);opacity:.1}}
[data-puk-theme="rem"]>.puk-tooltip-mist{background:repeating-radial-gradient(ellipse at center,transparent 0 25px,var(--puk-c2) 27px,transparent 34px);filter:blur(5px);animation-duration:12s}
[data-puk-theme="mese"]>.puk-tooltip-mist{background:radial-gradient(circle at 25% 25%,var(--puk-c4),transparent 22%),radial-gradient(circle at 75% 60%,var(--puk-c3),transparent 28%),radial-gradient(circle at 35% 85%,var(--puk-c2),transparent 20%);filter:blur(9px);animation-duration:16s}
[data-puk-theme="vip"]>.puk-tooltip-mist{background:repeating-conic-gradient(transparent 0 29deg,var(--puk-c1) 30deg,transparent 31deg 60deg);filter:blur(1px);animation-duration:38s;opacity:.2}
.puk-copy-identity{position:absolute;z-index:14;top:15px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:6px;padding:4px 12px;border-radius:20px;background:#180e24cc;color:#fff;font-weight:700;pointer-events:none}
.puk-copy-identity img{width:25px;height:25px;border-radius:50%;object-fit:cover}
.puk-copy-card .v3-badge-row>:not(.puk-pipe-meter){display:none!important}
.puk-copy-card .v3-skin-effect:not(.puk-copy-skin-effect){visibility:hidden}
.puk-copy-card>:is(.nitocris-card-fx,.laguna-card-star-fx,.furiel-card-spore-fx,.dora-card-psy-fx,.cloe-koi-orbit,.zakura-orbit-field,.deborah-meteor-field){visibility:hidden}
.v21-puk-skins{border-color:color-mix(in srgb,#a51d79 36%,transparent);background:radial-gradient(circle at 10% 0,rgba(165,29,121,.13),transparent 28rem),radial-gradient(circle at 94% 100%,rgba(105,137,90,.13),transparent 25rem),var(--v21-panel)}
.v21-puk-skins>header small{color:#ff81bc}
.v21-puk-pipe-stage{display:grid;place-items:center}
.v21-puk-pipe-stage::before{inset:-4%;background:radial-gradient(circle,color-mix(in srgb,var(--puk-c2) 38%,transparent),color-mix(in srgb,var(--puk-c1) 18%,transparent) 43%,transparent 70%)}
.v21-puk-pipe-stage>i{inset:3%;border-color:color-mix(in srgb,var(--puk-c4) 74%,transparent);box-shadow:0 0 18px var(--puk-c2),inset 0 0 24px color-mix(in srgb,var(--puk-c1) 35%,transparent)}
.v21-puk-pipe-stage .puk-pipe-art{width:92%;height:92%;filter:drop-shadow(0 15px 18px rgba(0,0,0,.72))}
.v21-puk-pipe-stage .puk-pipe-art>img{filter:drop-shadow(0 0 10px var(--puk-c2)) drop-shadow(0 0 24px var(--puk-c1))}
.v21-puk-pipe-stage .puk-smoke{z-index:4;inset:-12% -18% -6%;mix-blend-mode:screen;filter:drop-shadow(0 0 9px color-mix(in srgb,var(--puk-c2) 78%,transparent))}
.v21-puk-pipe-stage .puk-smoke::before,.v21-puk-pipe-stage .puk-smoke::after{position:absolute;left:27%;top:39%;width:23%;height:25%;border:3px solid color-mix(in srgb,var(--puk-c2) 76%,transparent);border-right-color:transparent;border-bottom-color:transparent;border-radius:50%;filter:blur(3px) drop-shadow(0 0 8px var(--puk-c2));opacity:0;content:"";animation:v21PukSmokeRibbon 4.8s ease-out infinite}
.v21-puk-pipe-stage .puk-smoke::after{border-color:color-mix(in srgb,var(--puk-c1) 82%,transparent);border-left-color:transparent;border-bottom-color:transparent;animation-delay:-2.4s;filter:blur(4px) drop-shadow(0 0 9px var(--puk-c1))}
.v21-puk-pipe-stage .puk-smoke i{z-index:2;left:29%;top:43%;width:24%;height:31%;background:radial-gradient(ellipse at 50% 78%,color-mix(in srgb,var(--puk-c2) 94%,white),color-mix(in srgb,var(--puk-c2) 54%,transparent) 42%,transparent 72%);filter:blur(5px);mix-blend-mode:screen;animation-name:v21PukShowcaseSmoke;animation-duration:6.4s;animation-timing-function:ease-out;animation-delay:calc(var(--smoke-i)*-.8s)}
.v21-puk-pipe-stage .puk-smoke i:nth-child(even){background:radial-gradient(ellipse at 50% 78%,color-mix(in srgb,var(--puk-c1) 94%,white),color-mix(in srgb,var(--puk-c1) 58%,transparent) 44%,transparent 73%);animation-name:v21PukShowcaseSmokeAlt}
.v21-puk-pipe-stage .puk-smoke i:nth-child(3n){width:31%;height:38%;filter:blur(8px)}
.v21-puk-skin-card .v21-bunny-banner-art{filter:saturate(.95) brightness(.72)}
.v21-puk-skin-card:hover .v21-bunny-banner-art{filter:saturate(1.08) brightness(.84)}
@keyframes v21PukShowcaseSmoke{0%{opacity:0;transform:translate(0,0) scale(.18) rotate(0)}14%{opacity:.92}48%{opacity:.72;transform:translate(-15px,-72px) scale(1.3) rotate(48deg)}78%{opacity:.34;transform:translate(22px,-132px) scale(2.05) rotate(104deg)}100%{opacity:0;transform:translate(-8px,-188px) scale(2.8) rotate(155deg)}}
@keyframes v21PukShowcaseSmokeAlt{0%{opacity:0;transform:translate(0,0) scale(.2) rotate(0)}16%{opacity:.88}52%{opacity:.7;transform:translate(20px,-78px) scale(1.4) rotate(-52deg)}80%{opacity:.3;transform:translate(-19px,-139px) scale(2.15) rotate(-112deg)}100%{opacity:0;transform:translate(17px,-194px) scale(2.9) rotate(-165deg)}}
@keyframes v21PukSmokeRibbon{0%{opacity:0;transform:translate(0,0) scale(.35) rotate(0)}18%{opacity:.85}55%{opacity:.62;transform:translate(4px,-72px) scale(1.3) rotate(95deg)}100%{opacity:0;transform:translate(-8px,-172px) scale(2.15) rotate(215deg)}}
.v21-puk-skin-card:hover .puk-smoke i{animation-duration:4.8s}
.v21-puk-skin-card:hover .puk-smoke::before,.v21-puk-skin-card:hover .puk-smoke::after{animation-duration:3.8s}
.vshop-skin-effect-preview.is-puk-pipe{overflow:visible;border-color:color-mix(in srgb,var(--puk-c2) 72%,var(--puk-c4));background:radial-gradient(circle at 42% 34%,color-mix(in srgb,var(--puk-c2) 34%,transparent),color-mix(in srgb,var(--puk-c1) 28%,#06070d) 72%);box-shadow:0 4px 13px #000c,0 0 20px color-mix(in srgb,var(--puk-c2) 52%,transparent)}
.vshop-skin-effect-preview.is-puk-pipe .puk-pipe-art{width:100%;height:100%}
@media(prefers-reduced-motion:reduce){.puk-pipe-art>img,.puk-smoke i,.puk-tooltip-mist,.puk-smoke::before,.puk-smoke::after{animation:none!important}.puk-smoke i:first-child{opacity:.48;transform:translate(-5px,-48px) scale(1.35)}.v21-puk-pipe-stage .puk-smoke::before{opacity:.48;transform:translate(2px,-80px) scale(1.4) rotate(90deg)}}

/* Rend's pipe treatment is shared by the live meter, tooltip and shop preview. */
.puk-pipe-art[data-puk-theme="rend"]>img{filter:drop-shadow(0 0 5px #B41D26) drop-shadow(0 0 12px #4F0008)}
[data-puk-theme="rend"] .puk-smoke i:nth-child(odd),[data-puk-theme="rend"] .puk-smoke-trail>i:nth-child(odd) b{background:radial-gradient(ellipse,#B41D26bb,transparent 69%)}
[data-puk-theme="rend"] .puk-card-smoke-source i:nth-child(odd){background:radial-gradient(ellipse at 50% 78%,#B41D26,#4F000888 44%,transparent 73%)}
.puk-tooltip[data-puk-theme="rend"]{border:1px solid #B41D2666;background:radial-gradient(ellipse at 95% 0,#4F000888,transparent 60%),linear-gradient(145deg,#1C1315,#120d11)}
.puk-tooltip[data-puk-theme="rend"]>.puk-tooltip-mist{background:radial-gradient(circle at 70% 30%,#B41D26 0 7%,#1C1315 8% 14%,#B41D26 14.5% 15%,transparent 16%),repeating-conic-gradient(from 20deg,transparent 0 24deg,#B41D2677 29deg,transparent 34deg 60deg);filter:blur(1px);opacity:.17;animation-duration:48s}
.puk-tooltip[data-puk-theme="rend"] :is(.puk-depth-guide small,.puk-enemies>div>b,header small){color:#B1695E}
.puk-tooltip[data-puk-theme="rend"] .puk-depth-guide>div{border-color:#B41D2644;background:linear-gradient(120deg,#2D000088,#1C1315)}
.puk-tooltip[data-puk-theme="rend"] header{border-bottom-color:#B41D2655}
.puk-rend-pipe-motifs{position:absolute;inset:0;pointer-events:none;z-index:3}
.puk-rend-pipe-motifs i{position:absolute;left:calc(12% + var(--rend-i)*24%);top:calc(8% + var(--rend-i)*12%);width:23%;height:23%;animation:pukRendMoth 6s ease-in-out infinite;animation-delay:calc(var(--rend-i)*-2s)}
.puk-rend-pipe-motifs svg{width:100%;height:100%;fill:#4F000844;stroke:#dca0a6;stroke-width:1.6;filter:drop-shadow(0 0 4px #B41D26)}
.vshop-skin-effect-preview.is-puk-pipe:has([data-puk-theme="rend"]){border-color:#B41D26;background:radial-gradient(circle at 42% 34%,#B41D2644,#1C1315 72%);box-shadow:0 4px 13px #000c,0 0 20px #B41D2655}
@keyframes pukRendMoth{0%,100%{opacity:.3;transform:translateY(2px) rotate(-8deg)}50%{opacity:.95;transform:translateY(-10px) rotate(8deg)}}
@media(prefers-reduced-motion:reduce){.puk-rend-pipe-motifs i{animation:none;opacity:.7}}