.flow-piece{position:absolute;transform:translate(-50%,-50%) rotate(var(--piece-rotation));transform-origin:center;filter:drop-shadow(0 .45rem .4rem rgba(18,34,39,.28))}
.flow-piece.pixi-backed{border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;filter:none!important}.flow-piece.pixi-backed::before,.flow-piece.pixi-backed::after{display:none!important}
.flow-piece>small{display:none;position:absolute;left:50%;top:105%;translate:-50% 0;padding:.12rem .24rem;border-radius:.22rem;background:#263845;color:#fff;font-size:.4rem;font-weight:900;white-space:nowrap}
.piece-wall{border:.16rem solid #4f4d48;border-radius:.3rem;background:linear-gradient(#a99e8d 0 22%,#625e57 23%);box-shadow:inset 0 .2rem rgba(255,255,255,.3)}.piece-wall>i{position:absolute;inset:30% 4% 8%;background:repeating-linear-gradient(90deg,transparent 0 14%,rgba(29,35,35,.18) 15% 16%)}
.piece-ramp{overflow:visible;border:.16rem solid #31464a;border-radius:.42rem;background:linear-gradient(180deg,#ffe378 0 18%,#e7b83f 19% 48%,#815d28 49% 72%,#2f4246 73%);box-shadow:inset 0 .18rem rgba(255,255,255,.65),0 .36rem 0 #172d32,0 .6rem .65rem rgba(10,31,38,.32)}.piece-ramp::before,.piece-ramp::after{content:"";position:absolute;top:26%;width:7%;height:48%;border-radius:50%;background:#263b40;box-shadow:inset 0 .08rem rgba(255,255,255,.25)}.piece-ramp::before{left:8%}.piece-ramp::after{right:8%}
.piece-wall.prop-support-column{border:.18rem solid #34464a;border-radius:.25rem;background:repeating-linear-gradient(0deg,#617277 0 12%,#415358 13% 17%);box-shadow:inset .18rem 0 rgba(255,255,255,.18),inset -.2rem 0 rgba(12,29,34,.28)}.piece-wall.prop-support-column>i{inset:0 31%;background:linear-gradient(90deg,#263b40,#839196,#263b40)}
.piece-wall.prop-pipe-horizontal,.piece-wall.prop-pipe-vertical{border:.18rem solid #263b40;background:linear-gradient(180deg,#d8e2df 0 13%,#899b98 18% 45%,#526966 52% 76%,#263e3c 82%);box-shadow:inset 0 .15rem rgba(255,255,255,.72),inset 0 -.16rem rgba(13,34,35,.34),0 .36rem .5rem rgba(11,30,35,.3)}.piece-wall.prop-pipe-horizontal{border-radius:.34rem}.piece-wall.prop-pipe-horizontal>i{inset:12% 2%;border:0;border-radius:.18rem;background:linear-gradient(180deg,rgba(255,255,255,.34),transparent 45%,rgba(12,34,35,.18))}.piece-wall.prop-pipe-vertical{border-radius:.34rem;background:linear-gradient(90deg,#2c4442 0 13%,#607773 20% 48%,#a9b8b4 55% 72%,#405753 80%)}.piece-wall.prop-pipe-vertical>i{inset:2% 12%;border:0;border-radius:.18rem;background:linear-gradient(90deg,rgba(10,32,33,.22),transparent 42%,rgba(255,255,255,.32))}.piece-wall.prop-pipe-horizontal::before,.piece-wall.prop-pipe-horizontal::after,.piece-wall.prop-pipe-vertical::before,.piece-wall.prop-pipe-vertical::after{content:"";position:absolute;z-index:2;border:.16rem solid #263b40;background:linear-gradient(#aebbb8,#526965);box-shadow:inset .1rem .08rem rgba(255,255,255,.35)}.piece-wall.prop-pipe-horizontal::before,.piece-wall.prop-pipe-horizontal::after{top:-14%;width:3.2%;height:128%;border-radius:.22rem}.piece-wall.prop-pipe-horizontal::before{left:-1%}.piece-wall.prop-pipe-horizontal::after{right:-1%}.piece-wall.prop-pipe-vertical::before,.piece-wall.prop-pipe-vertical::after{left:-14%;width:128%;height:3.2%;border-radius:.22rem}.piece-wall.prop-pipe-vertical::before{top:-1%}.piece-wall.prop-pipe-vertical::after{bottom:-1%}
.piece-wall.prop-pipe-horizontal.pipe-flowing>i{background:linear-gradient(180deg,rgba(255,255,255,.38),rgba(70,205,235,.72) 45%,rgba(20,123,169,.8))}.piece-wall.prop-pipe-vertical.pipe-flowing>i{background:linear-gradient(90deg,rgba(20,92,126,.8),rgba(76,213,240,.72) 48%,rgba(255,255,255,.38))}
.piece-pipe-starter,.piece-pipe-straight{border:.16rem solid #263b40;border-radius:.32rem;background:linear-gradient(180deg,#d7e1de 0 13%,#8da09c 18% 45%,#526966 52% 76%,#263e3c 82%);box-shadow:inset 0 .13rem rgba(255,255,255,.7),inset 0 -.15rem rgba(13,34,35,.34),0 .32rem .45rem rgba(11,30,35,.28)}.piece-pipe-starter>i,.piece-pipe-straight>i{position:absolute;inset:18% 2%;border-radius:999px;background:linear-gradient(180deg,rgba(255,255,255,.3),transparent 43%,rgba(10,31,33,.25))}.piece-pipe-starter::after,.piece-pipe-straight::before,.piece-pipe-straight::after{content:"";position:absolute;z-index:3;top:-13%;width:6%;height:126%;border:.14rem solid #263b40;border-radius:.18rem;background:linear-gradient(#bdcac6,#536c68);box-shadow:inset .08rem .08rem rgba(255,255,255,.35)}.piece-pipe-starter::after,.piece-pipe-straight::after{right:-3%}.piece-pipe-straight::before{left:-3%}.piece-pipe-starter>b{position:absolute;left:-12%;top:8%;width:20%;height:84%;border:.16rem solid #263b40;border-radius:.18rem;background:linear-gradient(90deg,#4b625f,#aebcb8 55%,#405754)}
.piece-pipe-curve{border:0;background:transparent;box-shadow:none}.piece-pipe-curve::before{content:"";position:absolute;inset:0;border:.44rem solid #263b40;border-right-color:transparent;border-top-color:transparent;border-radius:0 0 0 100%}.piece-pipe-curve::after{content:"";position:absolute;inset:.14rem;border:.22rem solid #81938f;border-right-color:transparent;border-top-color:transparent;border-radius:0 0 0 100%;box-shadow:inset .1rem -.1rem rgba(255,255,255,.55)}.piece-pipe-curve>i{position:absolute;left:-7%;top:34%;z-index:3;width:20%;height:32%;border:.13rem solid #263b40;border-radius:.18rem;background:#718783}
.piece-pipe-starter.active>i,.piece-pipe-straight.active>i,.piece-pipe-curve.active::after{filter:drop-shadow(0 0 .35rem #58d8ef);background-color:#55cce8}.piece-pipe-starter.flow-fire>i,.piece-pipe-straight.flow-fire>i,.piece-pipe-curve.flow-fire::after{filter:drop-shadow(0 0 .35rem #ff8a39);background-color:#ff7a36}
.piece-pipe-crack{z-index:7;border:0;background:transparent;filter:drop-shadow(0 .18rem .12rem rgba(7,20,23,.7))}.piece-pipe-crack>i{position:absolute;left:24%;top:2%;width:52%;height:96%;clip-path:polygon(45% 0,70% 27%,53% 40%,83% 53%,58% 62%,72% 100%,42% 72%,18% 84%,35% 55%,6% 43%,38% 32%);background:#07191b}.piece-pipe-crack.active>i{width:82%;left:9%;clip-path:none;border-radius:48%;background:radial-gradient(circle at 30% 25%,#b3fa76,#55cf42 55%,#208c37);filter:drop-shadow(0 0 .55rem #6ee95e)}
.piece-pipe-break{border:0;background:transparent;filter:drop-shadow(0 .35rem .4rem rgba(10,28,30,.42))}.piece-pipe-break>i{position:absolute;top:35%;width:46%;height:30%;border:.18rem solid #263b40;background:linear-gradient(180deg,#d8e2df 0 15%,#839692 22% 48%,#506663 56% 78%,#263d3b 85%);box-shadow:inset 0 .12rem rgba(255,255,255,.55)}.piece-pipe-break>i:first-child{right:57%;clip-path:polygon(0 0,100% 0,88% 25%,100% 48%,82% 70%,94% 100%,0 100%);border-radius:.32rem 0 0 .32rem}.piece-pipe-break>i:nth-child(2){left:57%;clip-path:polygon(0 0,100% 0,100% 100%,0 100%,12% 72%,0 50%,15% 28%);border-radius:0 .32rem .32rem 0}.piece-pipe-break>b{position:absolute;left:50%;top:50%;width:36%;aspect-ratio:1;translate:-50% -50%;clip-path:polygon(50% 0,63% 17%,83% 8%,86% 31%,100% 45%,82% 59%,91% 81%,67% 82%,53% 100%,39% 82%,15% 91%,17% 65%,0 52%,18% 36%,8% 15%,34% 17%);background:radial-gradient(circle,#07191b 0 43%,#a9b7b3 45% 62%,#253f3b 64%)}.piece-pipe-break.active>b{background:radial-gradient(circle,#55cf42 0 48%,#238f38 50% 64%,#173d32 66%);filter:drop-shadow(0 0 .7rem rgba(99,239,88,.72))}
.piece-water-source,.piece-fire-source{border:.18rem solid #314d4d;border-radius:44% 44% 25% 25%;background:linear-gradient(90deg,#406e6c,#87aba4 48%,#365d5b);box-shadow:inset .25rem .22rem rgba(255,255,255,.25)}
.piece-water-source>i,.piece-fire-source>i{position:absolute;inset:16% 24% 26%;border:.13rem solid rgba(255,255,255,.72);border-radius:50%;background:radial-gradient(circle at 35% 25%,#c9f8ff,#38c7ec 48%,#1887bd)}.piece-fire-source>i{background:radial-gradient(circle at 48% 65%,#fff3a5,#ffb52d 35%,#f05b2e 68%,#7a3029 70%)}
.piece-water-source>b,.piece-fire-source>b,.piece-funnel>b,.piece-button>b,.piece-water-container>b,.piece-gate>b{position:absolute;left:50%;top:104%;translate:-50% 0;padding:.16rem .3rem;border-radius:.3rem;background:rgba(23,40,59,.88);color:#fff;font-size:clamp(.28rem,.55vw,.5rem);font-weight:950;white-space:nowrap}.piece-water-source>em,.piece-fire-source>em{position:absolute;right:-12%;top:-13%;display:grid;place-items:center;width:30%;aspect-ratio:1;border:.1rem solid #fff;border-radius:50%;background:#2b9ac8;color:#fff;font-size:clamp(.42rem,1vw,.8rem);font-style:normal}.piece-fire-source>em{background:#ef6533}.piece-water-source.occupied,.piece-fire-source.occupied{filter:drop-shadow(0 0 1rem rgba(255,241,145,.9)) brightness(1.12)}
.piece-funnel{clip-path:polygon(5% 5%,95% 5%,64% 58%,64% 100%,36% 100%,36% 58%);border:.18rem solid #435654;background:linear-gradient(90deg,#718a84,#c1d0c6 45%,#566f6b)}.piece-funnel>i{position:absolute;left:20%;top:14%;width:60%;height:12%;border-radius:50%;background:#293f40}.piece-funnel>b{top:94%}
.piece-straight-channel{border:.16rem solid #465956;border-radius:999px;background:linear-gradient(#91a9a2,#405f5a 45%,#263f3d);box-shadow:inset 0 .14rem rgba(255,255,255,.3)}.piece-straight-channel>i{position:absolute;left:5%;right:5%;top:35%;height:30%;border-radius:999px;background:#203838}
.piece-corner-channel{border:.7rem solid #536e68;border-left-color:transparent;border-top-color:transparent;border-radius:0 0 90% 0;box-shadow:inset -.14rem -.14rem rgba(255,255,255,.25)}.piece-corner-channel>i{position:absolute;inset:18%;border:.22rem solid #213d3b;border-left-color:transparent;border-top-color:transparent;border-radius:0 0 90% 0}
.piece-splitter{clip-path:polygon(0 38%,42% 38%,100% 0,100% 25%,58% 50%,100% 75%,100% 100%,42% 62%,0 62%);background:linear-gradient(#9bafa9,#3e5c58);border:.15rem solid #415753}
.piece-funnel.active,.piece-straight-channel.active,.piece-corner-channel.active,.piece-splitter.active{filter:drop-shadow(0 0 .8rem #61d9f2) brightness(1.15)}
.piece-wheel{border:.25rem solid #56432f;border-radius:50%;background:radial-gradient(circle,#d1ae61 0 13%,#405653 14% 24%,transparent 25%)}.piece-wheel>i{position:absolute;left:47%;top:5%;width:6%;height:90%;border-radius:999px;background:linear-gradient(90deg,#6b4a2d,#ca9650,#68432a);transform-origin:50% 50%}.piece-wheel>i:nth-child(2){rotate:45deg}.piece-wheel>i:nth-child(3){rotate:90deg}.piece-wheel>i:nth-child(4){rotate:135deg}.piece-wheel>i:nth-child(5){rotate:22.5deg}.piece-wheel>i:nth-child(6){rotate:67.5deg}.piece-wheel>i:nth-child(7){rotate:112.5deg}.piece-wheel>i:nth-child(8){rotate:157.5deg}.piece-wheel>b{position:absolute;inset:36%;border:.15rem solid #4b3a2c;border-radius:50%;background:#dfb95f}.piece-wheel.active{animation:kit-wheel-spin var(--wheel-speed,1s) linear infinite;filter:drop-shadow(0 0 .8rem #52d7ef)}@keyframes kit-wheel-spin{to{rotate:360deg}}
.piece-button{border:.18rem solid #4b4540;border-radius:50%;background:radial-gradient(circle,#e15b43 0 48%,#843b34 50% 65%,#414947 67%);transition:.2s}.piece-button>i{position:absolute;inset:30%;border-radius:50%;background:#ffb045}.piece-button.active{transform:translate(-50%,-50%) rotate(var(--piece-rotation)) scale(.82);filter:drop-shadow(0 0 1rem #ff8b36) brightness(1.25)}.piece-button>b{top:112%}
.piece-water-container{--container-fill:0%;--container-color:#43c9ee;border:.22rem solid #355a63;border-top:.48rem solid #263f47;border-radius:.4rem .4rem 1.1rem 1.1rem;background:linear-gradient(90deg,rgba(215,249,255,.7),rgba(110,200,220,.3) 48%,rgba(225,252,255,.74));box-shadow:inset .3rem .18rem rgba(255,255,255,.68),0 .7rem .85rem rgba(16,42,51,.28)}.piece-water-container .container-water{position:absolute;left:7%;right:7%;top:calc(100% - var(--container-fill));bottom:5%;border-radius:.18rem .18rem .75rem .75rem;background:linear-gradient(180deg,color-mix(in srgb,var(--container-color),white 48%),var(--container-color) 52%,color-mix(in srgb,var(--container-color),black 28%));box-shadow:inset 0 .24rem rgba(255,255,255,.62);transition:top .15s linear,background .2s}.piece-water-container .container-glass{position:absolute;inset:7%;border:.1rem solid rgba(255,255,255,.72);border-radius:.18rem .18rem .75rem .75rem;box-shadow:inset .4rem 0 rgba(255,255,255,.2)}.piece-water-container.active{filter:drop-shadow(0 0 1rem var(--container-color)) brightness(1.08)}
.piece-gate{overflow:hidden;border:.22rem solid #2f4b49;border-radius:1.2rem 1.2rem .25rem .25rem;background:rgba(28,57,55,.32);box-shadow:inset .2rem .2rem rgba(255,255,255,.14)}.piece-gate>i{position:absolute;top:0;width:17%;height:100%;border-radius:.2rem;background:linear-gradient(90deg,#294b48,#4e7b74,#264440);transition:transform .75s cubic-bezier(.2,.8,.2,1)}.piece-gate>i:nth-child(1){left:6%}.piece-gate>i:nth-child(2){left:29%}.piece-gate>i:nth-child(3){left:54%}.piece-gate>i:nth-child(4){left:77%}.piece-gate>b{top:8%}.piece-gate.active>i{transform:translateY(-108%)}.piece-gate.active{filter:drop-shadow(0 0 .8rem #8bf083)}
.piece-water-source[class*="source-prop-"]{border:0;border-radius:0;background:transparent;box-shadow:none}.piece-water-source[class*="source-prop-"]>em{display:none}.piece-water-source[class*="source-prop-"]>i{inset:auto;border:0;box-shadow:none}.piece-water-source.source-prop-broken-pipe>i{left:-12%;top:7%;width:112%;height:38%;border:.16rem solid #334b4b;border-radius:999px 0 0 999px;background:linear-gradient(#9bb0aa,#496965 48%,#294b48);box-shadow:inset 0 .12rem rgba(255,255,255,.35)}.piece-water-source.source-prop-broken-pipe>i::after{content:"";position:absolute;right:-13%;top:-28%;width:24%;height:156%;border:.15rem solid #2b4545;border-radius:.2rem;background:linear-gradient(90deg,#42635f,#9aada5 48%,#3d5d59)}.piece-water-source.source-prop-waterfall>i{left:0;top:0;width:100%;height:48%;border-radius:60% 45% 18% 20%;background:radial-gradient(circle at 25% 25%,#a5a99a,#59625c 66%);box-shadow:inset 0 .15rem rgba(255,255,255,.2)}.piece-water-source.source-prop-waterfall>i::after{content:"";position:absolute;left:38%;top:72%;width:28%;height:95%;border-radius:0 0 45% 45%;background:linear-gradient(90deg,#52cbe8,#baf5fa 45%,#2799c4);opacity:.8}.piece-water-source.source-prop-rain-cloud>i{left:4%;top:4%;width:92%;height:52%;border-radius:999px;background:radial-gradient(circle at 26% 30%,#f7fbfc 0 22%,transparent 23%),radial-gradient(circle at 53% 18%,#eef6f8 0 30%,transparent 31%),radial-gradient(circle at 78% 38%,#d7e5e8 0 25%,transparent 26%),linear-gradient(#f7fbfc,#aebfc4);filter:drop-shadow(0 .18rem .15rem rgba(24,49,58,.25))}.piece-water-source.source-prop-fire-sprinkler>i{left:34%;top:-8%;width:32%;height:52%;border:.13rem solid #4a5553;border-radius:.2rem .2rem 45% 45%;background:linear-gradient(90deg,#8c9591,#d2d6cf 48%,#5e6966)}.piece-water-source.source-prop-fire-sprinkler>i::after{content:"";position:absolute;left:-55%;bottom:-30%;width:210%;height:22%;border:.12rem solid #495552;border-radius:999px;background:#a9b1ac}
.piece-water-source.source-prop-broken-pipe>img{position:absolute;left:-289%;top:16%;width:390%;height:180%;object-fit:fill;filter:drop-shadow(0 .4rem .34rem rgba(13,34,39,.4))}.piece-wall:has(>img){border:0;background:transparent;box-shadow:none}.piece-wall>img{position:absolute;inset:0;width:100%;height:100%;object-fit:fill;filter:drop-shadow(0 .45rem .35rem rgba(11,28,30,.38))}

/* A true 90-degree version of the straight pipe: same shell, metal, highlight and cuffs. */
.piece-pipe-curve{overflow:visible;border:0;background:transparent;box-shadow:none}
.piece-pipe-curve::before,.piece-pipe-curve::after{display:none}
.piece-pipe-curve>svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.piece-pipe-curve .pipe-shell{fill:none;stroke:#263b40;stroke-width:50;stroke-linecap:butt}
.piece-pipe-curve .pipe-metal{fill:none;stroke:#8da09c;stroke-width:42;stroke-linecap:butt}
.piece-pipe-curve .pipe-highlight{fill:none;stroke:rgba(255,255,255,.44);stroke-width:7;stroke-linecap:round;transform:translate(-2px,-3px)}
.piece-pipe-curve .pipe-flange{fill:none;stroke-linecap:butt}
.piece-pipe-curve .pipe-flange.shell{stroke:#263b40;stroke-width:14}
.piece-pipe-curve .pipe-flange.metal{stroke:#aebbb8;stroke-width:8}
.piece-pipe-curve.active .pipe-metal{stroke:#55cce8;filter:drop-shadow(0 0 .35rem #58d8ef)}
.piece-pipe-curve.flow-fire .pipe-metal{stroke:#ff7a36;filter:drop-shadow(0 0 .35rem #ff8a39)}
.piece-floor,.piece-wall.prop-waterworks-floor{overflow:hidden;border:.16rem solid #172e2d;border-radius:.22rem;background:#263d3b url("assets/adventure/prop-waterworks-floor.svg") left center/auto 100% repeat-x;box-shadow:inset 0 .18rem rgba(255,255,255,.2),0 .4rem .35rem rgba(11,28,30,.3)}
.piece-floor>.floor-surface,.piece-wall.prop-waterworks-floor>.floor-surface{display:none}
.piece-scaffolding{overflow:visible;border:0;background:transparent;box-shadow:none}
.piece-scaffolding>.scaffold-frame{position:absolute;inset:9% 7% 5%;border:.22rem solid #40565a;border-radius:.12rem;background:linear-gradient(34deg,transparent 0 48%,#60767a 49% 51%,transparent 52% 100%),linear-gradient(-34deg,transparent 0 48%,#60767a 49% 51%,transparent 52% 100%);box-shadow:0 .25rem .28rem rgba(10,28,31,.22)}
.piece-scaffolding>.scaffold-frame::before{content:"";position:absolute;left:0;right:0;top:50%;height:.16rem;translate:0 -50%;background:#40565a}
.piece-scaffolding>.scaffold-frame::after{display:none}
.piece-scaffolding>.scaffold-deck{position:absolute;left:1%;right:1%;top:0;height:12%;border:.14rem solid #3b4140;border-radius:.14rem;background:#d9aa49;box-shadow:inset 0 .12rem rgba(255,255,255,.32),0 .17rem 0 #2c4144}
.piece-scaffolding>.scaffold-feet{position:absolute;left:5%;right:5%;bottom:1%;height:5%;border-radius:.12rem;background:linear-gradient(90deg,#30464a 0 12%,transparent 12% 88%,#30464a 88%);box-shadow:none}
