:root{
  --cream:#fff4de;
  --cream2:#ffe6bd;
  --ink:#4c1d12;
  --blue:#2c84ff;
  --pink:#ff4fa3;
  --green:#64cc30;
  --gold:#ffbd2e;
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;width:100%;height:100%;overflow:hidden;font-family:Arial,Helvetica,sans-serif;background:#f5eef5;color:var(--ink)}
body{display:flex;align-items:center;justify-content:center}
button{font:inherit}
.phone{
  width:min(100vw,56.25vh);height:min(100svh,177.7778vw);aspect-ratio:9/16;
  position:relative;overflow:hidden;background:
  radial-gradient(circle at 12% 92%,rgba(255,106,171,.32),transparent 25%),
  radial-gradient(circle at 88% 87%,rgba(255,190,45,.30),transparent 25%),
  linear-gradient(180deg,#a9ddff 0%,#eaf7ff 21%,#fff7e9 63%,#ffe4bb 100%);
  box-shadow:0 22px 60px rgba(50,25,45,.24)
}
@media(min-width:700px){.phone{border-radius:30px}}
.phone:before,.phone:after{
  content:"";position:absolute;width:42%;height:18%;bottom:-4%;filter:blur(12px);opacity:.55;pointer-events:none
}
.phone:before{left:-10%;background:radial-gradient(circle,#ff546a 0 20%,#ffb429 22% 38%,transparent 42%)}
.phone:after{right:-12%;background:radial-gradient(circle,#8d55ff 0 20%,#3fa9ff 22% 38%,transparent 42%)}
.screen{position:absolute;inset:0;display:none;opacity:0;transform:translateX(14px);transition:opacity .24s ease,transform .24s ease}
.screen.active{display:flex;opacity:1;transform:none}
.decorLeaf{position:absolute;pointer-events:none;opacity:.92;filter:drop-shadow(0 5px 5px rgba(23,91,26,.14))}
.decorLeaf.a{width:39%;left:-13%;top:8%;transform:rotate(-20deg)}
.decorLeaf.b{width:35%;right:-13%;top:20%;transform:rotate(22deg) scaleX(-1)}
/* shared */
.glass{
  background:linear-gradient(180deg,rgba(255,255,255,.95),rgba(255,244,219,.97));
  border:2px solid rgba(255,255,255,.78);
  box-shadow:0 8px 20px rgba(106,66,45,.12),inset 0 -2px 0 rgba(221,155,84,.20);
}
.resourceMini{display:flex;gap:6px;align-items:center}
.resourcePill{
  min-width:72px;height:38px;border-radius:17px;padding:0 9px;display:flex;align-items:center;justify-content:center;gap:5px;
  background:linear-gradient(180deg,#814128,#5d291d);border:2px solid #f8c580;color:#fff;font-weight:900;font-size:13px;
  box-shadow:0 4px 10px rgba(83,39,28,.22)
}
.resourcePill .sym{font-size:17px}
.assetButton{border:0;background:none;padding:0;cursor:pointer;transition:transform .12s ease,filter .12s ease}
.assetButton:active{transform:scale(.92);filter:brightness(.95)}
/* HOME */
#home{flex-direction:column;align-items:center;padding:max(10px,env(safe-area-inset-top)) 12px max(13px,env(safe-area-inset-bottom));gap:7px}
.homeResources{width:100%;display:flex;justify-content:flex-end;gap:5px;position:relative;z-index:3}
.homeResources .resourcePill{min-width:88px}
.homeLogo{width:87%;height:auto;object-fit:contain;filter:drop-shadow(0 10px 8px rgba(90,38,18,.16));margin-top:-2px;position:relative;z-index:3}
.homeHero{
  width:100%;flex:1;min-height:0;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;
  border-radius:30px;padding:10px 12px 12px;background:linear-gradient(180deg,rgba(255,255,255,.35),rgba(255,250,238,.76));
  border:2px solid rgba(255,255,255,.55);box-shadow:0 16px 30px rgba(110,60,50,.12)
}
.homeSpark{position:absolute;width:60%;right:-10%;top:1%;opacity:.54;pointer-events:none}
.candyShowcase{width:100%;display:flex;align-items:center;justify-content:center;gap:0;margin:3px 0 4px;min-height:155px}
.candyShowcase img{width:27%;object-fit:contain;filter:drop-shadow(0 8px 7px rgba(63,40,32,.18));animation:floatCandy 3.1s ease-in-out infinite}
.candyShowcase img:nth-child(2){width:32%;animation-delay:.35s;transform:translateY(-7px)}
.candyShowcase img:nth-child(3){animation-delay:.7s}
@keyframes floatCandy{0%,100%{translate:0 0;rotate:0deg}50%{translate:0 -8px;rotate:1.4deg}}
.homeTag{font-weight:900;text-align:center;color:#7a341c;font-size:14px;margin:2px 12px 6px;text-shadow:0 1px white}
.playAsset{width:74%;max-height:116px;object-fit:contain;filter:drop-shadow(0 8px 8px rgba(37,108,20,.24))}
.mapTextBtn{width:72%;margin-top:2px;border:0;border-radius:18px;padding:11px;background:linear-gradient(180deg,#28b2ff,#087ddd);color:white;font-weight:1000;font-size:15px;border:3px solid #fff1c9;box-shadow:0 6px 0 #075ca6,0 10px 14px rgba(0,85,155,.20)}
.version{font-size:10px;font-weight:800;opacity:.55;margin-top:4px}
/* MAP */
#map{flex-direction:column;padding:max(9px,env(safe-area-inset-top)) 9px max(10px,env(safe-area-inset-bottom));gap:7px;background:linear-gradient(180deg,rgba(157,221,255,.35),rgba(255,246,225,.40))}
.mapTop{display:flex;align-items:center;gap:7px;z-index:3}
.backAsset{width:46px;height:46px;object-fit:contain}
.mapLogo{height:58px;flex:1;object-fit:contain;object-position:left center}
.mapArea{
  position:relative;flex:1;min-height:0;overflow:auto;border-radius:29px;padding:20px 12px 32px;
  background:linear-gradient(180deg,rgba(255,255,255,.86),rgba(255,238,203,.89));
  border:3px solid rgba(255,255,255,.78);box-shadow:0 12px 26px rgba(96,57,36,.13)
}
.pathArt{
  position:absolute;left:50%;top:28px;bottom:28px;width:74%;transform:translateX(-50%);
  background-image:none;opacity:0
}
.levelList{position:relative;display:flex;flex-direction:column;gap:25px;padding:8px 0 18px;z-index:2}
.levelRow{display:grid;grid-template-columns:1fr 96px 1fr;min-height:82px;align-items:center}
.levelRow.left .levelNode{grid-column:1;justify-self:end}.levelRow.center .levelNode{grid-column:2;justify-self:center}.levelRow.right .levelNode{grid-column:3;justify-self:start}
.levelNode{
  width:78px;height:78px;border-radius:50%;border:4px solid #fff1b1;position:relative;cursor:pointer;
  background:radial-gradient(circle at 35% 28%,#fff8a8 0 14%,#ffc742 42%,#f78a29 85%);
  color:#7c2c13;font-size:28px;font-weight:1000;text-shadow:0 2px #fff1b1;
  box-shadow:0 7px 0 #c35b1f,0 10px 18px rgba(109,57,35,.18);transition:transform .16s ease
}
.levelNode:active{transform:translateY(4px);box-shadow:0 3px 0 #c35b1f,0 7px 12px rgba(109,57,35,.15)}
.levelNode.locked{filter:grayscale(.45);background:linear-gradient(180deg,#d5d9e4,#a5adbf);border-color:#eef1f7;color:#6c7381;box-shadow:0 6px 0 #8e96a7}
.levelNode.current:before{content:"";position:absolute;inset:-18px;border-radius:50%;background:radial-gradient(circle,rgba(255,243,91,.88) 0 28%,rgba(255,196,53,.42) 36%,rgba(255,255,255,0) 70%);box-shadow:0 0 20px rgba(255,220,63,.7);z-index:-1;animation:activePulse 1.8s ease-in-out infinite}
@keyframes activePulse{50%{transform:scale(1.08);opacity:.72}}
.nodeStars{position:absolute;left:50%;bottom:-20px;transform:translateX(-50%);white-space:nowrap;font-size:13px}.nodeStars .off{filter:grayscale(1);opacity:.35}
.mapTitle{position:sticky;top:-16px;z-index:4;margin:-2px auto 8px;width:max-content;padding:7px 18px;border-radius:18px;color:#7a341c;font-size:14px;font-weight:1000;background:#fff8df;border:2px solid #f0b15e;box-shadow:0 4px 10px rgba(94,57,31,.12)}
/* GAME */
#game{flex-direction:column;padding:max(7px,env(safe-area-inset-top)) 7px max(7px,env(safe-area-inset-bottom));gap:5px;background:linear-gradient(180deg,rgba(235,249,255,.38),rgba(255,244,225,.30))}
.gameTop{
  height:74px;border-radius:25px;padding:7px 9px;display:grid;grid-template-columns:48px 1fr 70px 70px;gap:7px;align-items:center;
  background:linear-gradient(180deg,#fffef9,#ffefd5);border:3px solid white;box-shadow:0 8px 16px rgba(102,64,44,.13),inset 0 -2px 0 #e8b56d
}
.gameBack{width:45px;height:45px}
.levelInfo strong{display:block;font-size:20px;line-height:1;color:#5b1d0d;text-shadow:0 1px #fff}
.levelInfo span{font-size:10px;color:#80513d;font-weight:800}
.statBox{height:55px;border-radius:17px;display:flex;flex-direction:column;align-items:center;justify-content:center;border:2px solid white;box-shadow:inset 0 -2px 0 rgba(0,0,0,.08)}
.statBox.score{background:linear-gradient(180deg,#f4f9ff,#daeaff)}.statBox.moves{background:linear-gradient(180deg,#ffedf7,#ffb8d4)}
.statBox b{font-size:20px;line-height:1;color:#0c4d9f}.statBox.moves b{color:#8a142a}.statBox small{font-size:9px;font-weight:800;margin-bottom:2px}
.objectiveCard{
  height:60px;border-radius:23px;padding:7px 12px;display:grid;grid-template-columns:78px 1fr 40px;gap:8px;align-items:center;
  background:linear-gradient(180deg,#fffdf5,#ffe9c9);border:3px solid white;box-shadow:0 7px 14px rgba(103,65,42,.10),inset 0 -2px 0 #e7b269
}
.targetText{font-size:11px;font-weight:1000}.targetText b{display:block;font-size:16px;color:#74220f}
.progressWrap{position:relative;height:22px;border-radius:20px;background:#d4c0ac;border:3px solid #fff2d0;box-shadow:inset 0 2px 4px rgba(82,50,30,.18);overflow:visible}
.progressFill{height:100%;width:0;border-radius:16px;background:linear-gradient(180deg,#fff548,#ffb20a);box-shadow:inset 0 2px 2px white;transition:width .28s ease}
.progressStar{position:absolute;width:24px;height:24px;top:50%;translate:-50% -50%;filter:drop-shadow(0 2px 2px rgba(120,66,19,.22))}
.progressStar.s1{left:34%}.progressStar.s2{left:67%}.progressStar.s3{left:100%}
.pct{font-size:13px;font-weight:1000;text-align:center;color:#74220f}
.message{height:27px;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:1000;color:#63311e;text-shadow:0 1px white}
.boardShell{
  position:relative;width:100%;aspect-ratio:1/1;border-radius:27px;padding:10px;align-self:center;
  background:linear-gradient(145deg,#fff7c6 0%,#f5ad46 28%,#fff5be 52%,#ec8732 100%);
  border:3px solid white;box-shadow:0 12px 22px rgba(95,56,33,.18),inset 0 0 0 3px rgba(187,84,33,.28)
}
.boardShell:before{content:"";position:absolute;inset:7px;border-radius:20px;background:linear-gradient(180deg,#cae6ff,#d8eaff);box-shadow:inset 0 4px 10px rgba(43,93,150,.20)}
.boardLeaf{position:absolute;width:23%;z-index:0;pointer-events:none;opacity:.9}.boardLeaf.bl{left:-7%;bottom:-5%;transform:rotate(-22deg)}.boardLeaf.tr{right:-7%;top:-5%;transform:rotate(155deg)}
#board{position:relative;width:100%;height:100%;z-index:2;border-radius:17px;overflow:hidden;touch-action:none;background:
linear-gradient(90deg,rgba(255,255,255,.34) 1px,transparent 1px),
linear-gradient(rgba(255,255,255,.34) 1px,transparent 1px);
background-size:12.5% 12.5%}
.piece{
  position:absolute;width:12.5%;height:12.5%;display:flex;align-items:center;justify-content:center;will-change:left,top,transform,opacity;
  transition:left .32s cubic-bezier(.2,.82,.3,1),top .32s cubic-bezier(.2,.82,.3,1),transform .16s ease,opacity .16s ease,filter .16s ease;z-index:5
}
.pixiBoardCanvas{position:absolute;inset:0;width:100%!important;height:100%!important;z-index:5;pointer-events:none}
#board.pixiBoard .piece{opacity:0!important;animation:none!important;filter:none!important;will-change:auto}
.piece.spawnPending{visibility:hidden}
.piece img{width:104%;height:104%;object-fit:contain;pointer-events:none;filter:drop-shadow(0 3px 2px rgba(34,62,93,.14))}
.piece.selected{z-index:10}.piece.selected img{transform:scale(1.13);filter:drop-shadow(0 0 7px #fff) drop-shadow(0 3px 3px rgba(40,69,108,.26))}
.piece.invalid{animation:wobble .23s ease}@keyframes wobble{25%{transform:translateX(-4px)}75%{transform:translateX(4px)}}
.piece.dropBounce{animation:fruitDropBounce .43s linear both}
@keyframes fruitDropBounce{
  0%,68%{transform:translateY(0)}
  82%{transform:translateY(-2px)}
  100%{transform:translateY(0)}
}
.piece.pop{animation:pop .24s ease forwards}@keyframes pop{0%{scale:1}35%{scale:1.17;filter:brightness(1.5)}100%{scale:.05;opacity:0}}
.specialOverlay{position:absolute;inset:12%;border-radius:10px;pointer-events:none}
.stripedH .specialOverlay{background:repeating-linear-gradient(180deg,transparent 0 10%,rgba(255,255,255,.92) 10% 20%,transparent 20% 30%);mix-blend-mode:screen}
.stripedV .specialOverlay{background:repeating-linear-gradient(90deg,transparent 0 10%,rgba(255,255,255,.92) 10% 20%,transparent 20% 30%);mix-blend-mode:screen}
.wrapped .specialOverlay{border:3px dashed #ffe14a;box-shadow:0 0 10px #fff25e}
.colorBombBall{width:73%;height:73%;border-radius:50%;position:relative;background:radial-gradient(circle at 30% 25%,white,transparent 20%),radial-gradient(circle,#77401d,#3b1e08 75%);box-shadow:0 4px 6px rgba(0,0,0,.25)}
.spr{position:absolute;width:11%;height:11%;border-radius:50%}.spr:nth-child(1){background:#ff5c61;left:20%;top:23%}.spr:nth-child(2){background:#ffd65a;left:57%;top:18%}.spr:nth-child(3){background:#62d078;left:25%;top:58%}.spr:nth-child(4){background:#5ca8ff;left:62%;top:55%}.spr:nth-child(5){background:#d47cff;left:43%;top:39%}
.boosterDock{
  height:88px;display:flex;align-items:center;justify-content:space-around;padding:4px 7px 1px;border-radius:24px;
  background:linear-gradient(180deg,rgba(255,251,235,.93),rgba(255,224,183,.96));border:3px solid white;
  box-shadow:0 8px 16px rgba(93,57,34,.12),inset 0 -3px 0 #d99749
}
.booster{position:relative;width:22%;height:78px;border:0;background:none;padding:0;cursor:pointer;transition:transform .13s ease,filter .13s ease}
.booster img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 4px 4px rgba(50,54,71,.18))}
.booster:active{transform:scale(.91)}.booster.active{transform:translateY(-4px) scale(1.04);filter:drop-shadow(0 0 9px #fff54e)}
.countBadge{position:absolute;right:1px;bottom:2px;min-width:25px;height:25px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:linear-gradient(#ff3e8a,#d80a57);border:3px solid white;color:white;font-size:12px;font-weight:1000;box-shadow:0 2px 4px rgba(80,16,47,.28)}
.utilityDock{height:48px;display:flex;align-items:center;justify-content:center;gap:22px}
.utilityDock .assetButton img{width:43px;height:43px;object-fit:contain}
.fxImage{position:absolute;z-index:35;pointer-events:none;translate:-50% -50%;animation:fxPop .55s ease-out forwards}
@keyframes fxPop{0%{scale:.25;opacity:0}35%{scale:1;opacity:1}100%{scale:1.25;opacity:0}}
.particle{position:absolute;width:6px;height:6px;border-radius:50%;pointer-events:none;z-index:35;animation:particle .5s ease-out forwards}@keyframes particle{to{transform:translate(var(--dx),var(--dy)) scale(.2);opacity:0}}
.floatScore{position:absolute;z-index:39;font-size:14px;font-weight:1000;color:#9e2b08;text-shadow:0 2px white;pointer-events:none;animation:floatScore .72s ease-out forwards}@keyframes floatScore{0%{transform:translateY(0) scale(.7);opacity:0}25%{opacity:1;transform:translateY(-6px) scale(1.12)}100%{transform:translateY(-34px);opacity:0}}
.comboText{position:absolute;left:50%;top:45%;z-index:40;translate:-50% -50%;padding:7px 13px;border-radius:18px;font-size:25px;font-weight:1000;color:#fff;background:linear-gradient(180deg,#ff7ccc,#e72d8b);border:3px solid #fff08e;text-shadow:0 2px #9c145d;box-shadow:0 5px 16px rgba(186,39,119,.28);animation:combo .8s ease forwards;pointer-events:none}
@keyframes combo{0%{scale:.45;opacity:0}25%{scale:1.18;opacity:1}80%{opacity:1}100%{translate:-50% -75%;scale:1;opacity:0}}
.beam{position:absolute;z-index:32;pointer-events:none;background:linear-gradient(90deg,transparent,#fff,#ffd664,#fff,transparent);filter:drop-shadow(0 0 5px white);animation:beam .24s ease forwards}.beam.h{left:0;width:100%;height:8px}.beam.v{top:0;height:100%;width:8px;background:linear-gradient(180deg,transparent,#fff,#75c5ff,#fff,transparent)}@keyframes beam{0%{opacity:0;scale:.3}35%{opacity:1;scale:1}100%{opacity:0;scale:1.1}}
.lightning{position:absolute;height:3px;transform-origin:0 50%;background:linear-gradient(90deg,#fff,#ffe354,#fff);box-shadow:0 0 8px white;z-index:33;pointer-events:none;animation:zap .36s ease forwards}@keyframes zap{0%{opacity:0}20%{opacity:1}100%{opacity:0}}
#board.shake{animation:shake .16s linear}@keyframes shake{25%{transform:translate(-3px,2px)}50%{transform:translate(3px,-2px)}75%{transform:translate(-2px,-1px)}}
/* modals */
.overlay{position:absolute;inset:0;z-index:70;background:rgba(39,28,48,.48);display:none;align-items:center;justify-content:center;padding:20px}.overlay.show{display:flex}
.modalCard{position:relative;width:95%;max-width:430px;text-align:center;animation:modalIn .3s ease}.modalCard .panelArt{width:100%;display:block;filter:drop-shadow(0 14px 18px rgba(73,35,28,.25))}
.modalContent{position:absolute;left:8%;right:8%;top:20%;bottom:13%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px}
.resultBanner{width:72%;max-height:120px;object-fit:contain;filter:drop-shadow(0 5px 6px rgba(92,37,37,.2))}
.resultStars{width:76%;max-height:82px;object-fit:contain}
.resultText{font-weight:900;color:#743014;font-size:14px}
.resultButtons{display:flex;gap:6px;width:100%;justify-content:center;margin-top:4px}
.resultButtons .assetButton img{height:52px;max-width:160px;object-fit:contain}
.briefTitle{font-size:27px;font-weight:1000;color:#6b2815;text-shadow:0 2px white}.briefLine{font-size:14px;font-weight:900}.briefPlay{width:68%;margin-top:5px}
.shopCard{position:relative;width:min(96%,calc(96vh * .6625));aspect-ratio:1019/1538;max-height:96vh;padding:0;background:transparent;border:0;animation:settingsPanelIn .28s cubic-bezier(.2,1.12,.35,1);container-type:inline-size}
.shopPanelAsset{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 14px 18px rgba(73,35,28,.3));pointer-events:none;user-select:none}
.shopCard button{position:absolute;border:0;padding:0;background:transparent;cursor:pointer;-webkit-tap-highlight-color:transparent}.shopCard button:active{transform:scale(.94)}
.shopClose{left:87.4%;top:5.2%;width:11.2%;aspect-ratio:1;z-index:8}.shopClose img{display:block;width:100%;height:100%;object-fit:contain}
.shopSection{position:absolute;object-fit:contain;z-index:2;pointer-events:none}.shopItems{left:3%;top:13.8%;width:94%}.shopHearts{left:3.5%;top:41.5%;width:93%}.shopCoins{left:3%;top:67.3%;width:94%}
.shopPrice{position:absolute;z-index:5;aspect-ratio:390/81;min-height:0;background:url('ui/shop/price_bar.png') center/100% 100% no-repeat;color:#fff;font-weight:1000;text-shadow:0 2px 2px #6a210f;display:flex;align-items:center;justify-content:flex-end;box-sizing:border-box;letter-spacing:0;container-type:inline-size;overflow:hidden}.shopPrice::after{content:attr(data-price);display:block;max-width:58%;padding-right:12%;font-size:19cqw;line-height:1;white-space:nowrap;text-align:right;box-sizing:content-box}
.shopItemPrice{top:35%;width:19.9%}.shopItemPrice1{left:7.4%}.shopItemPrice2{left:29.2%}.shopItemPrice3{left:50.9%}.shopItemPrice4{left:72.7%}
.shopHeartPrice{top:59.2%;width:16.7%}.shopHeartPrice1{left:6.4%}.shopHeartPrice2{left:24%}.shopHeartPrice3{left:41.7%}.shopHeartPrice4{left:59.3%}.shopHeartPrice5{left:76.9%}
.shopBuy{position:absolute!important;z-index:6}.shopItemBuy,.shopHeartBuy{top:38.7%;width:19.9%;aspect-ratio:389/118;background:url('ui/shop/buy_button.png') center/100% 100% no-repeat!important}.shopItemBuy1{left:7.4%}.shopItemBuy2{left:29.2%}.shopItemBuy3{left:50.9%}.shopItemBuy4{left:72.7%}
.shopHeartBuy{top:62.6%;width:16.7%}.shopHeartBuy1{left:6.4%}.shopHeartBuy2{left:24%}.shopHeartBuy3{left:41.7%}.shopHeartBuy4{left:59.3%}.shopHeartBuy5{left:76.9%}
.shopCoinBuy{top:89.1%;width:17.3%;aspect-ratio:389/117;background:url('ui/shop/coin_button.png') center/100% 100% no-repeat!important;color:#fff;font-weight:1000;text-shadow:0 2px 2px #075414;letter-spacing:0;container-type:inline-size;overflow:hidden}.shopCoinBuy1{left:5.3%}.shopCoinBuy2{left:23.3%}.shopCoinBuy3{left:41.4%}.shopCoinBuy4{left:59.4%}.shopCoinBuy5{left:77.4%}.shopCoinBuy::after{content:attr(data-price);display:block;width:86%;margin:auto;white-space:nowrap;font-size:16cqw;line-height:1;text-align:center}
.settingsCard{position:relative;width:min(94%,calc(92vh * .6655));aspect-ratio:768/1154;max-height:92vh;padding:0;background:transparent;border:0;box-shadow:none;text-align:left;animation:settingsPanelIn .28s cubic-bezier(.2,1.12,.35,1)}
.settingsPanelAsset{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 14px 18px rgba(73,35,28,.28));pointer-events:none;user-select:none}
.settingsCard button{position:absolute;border:0;padding:0;background:transparent;cursor:pointer;-webkit-tap-highlight-color:transparent}
.settingsCard button:active{transform:scale(.94)}
.settingsCloseX{right:-1.2%;top:8.1%;z-index:8;width:12.5%;aspect-ratio:1}
.settingsCloseX img{display:block;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 3px 4px rgba(96,38,18,.34))}
.settingsProfile{position:static;color:#632612;font-weight:1000}
.settingsAvatar{position:absolute;left:10.8%;top:20.75%;width:27.2%;aspect-ratio:1;z-index:3}
.settingsAvatarFruit{position:absolute;inset:12%;width:76%;height:76%;object-fit:contain;border-radius:50%}
.settingsAvatarFrame{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}
.settingsEdit{right:-2%;bottom:0;width:29%;aspect-ratio:1;z-index:4}
.settingsEdit img{width:100%;height:100%;object-fit:contain;display:block}
.settingsPlayerName{position:absolute;left:41.2%;top:20.75%;width:48.8%;z-index:3;font-size:clamp(13px,3.2vw,21px);line-height:1.1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;letter-spacing:0}
.settingsLevelValue,.settingsScoreValue{position:absolute;left:63.6%;top:27.25%;width:24.8%;z-index:3;text-align:left;font-size:clamp(12px,3vw,18px);line-height:1;color:#087c2f;letter-spacing:0}
.settingsScoreValue{left:70%;top:34.5%;width:18.4%;font-size:clamp(10px,2.4vw,14px);color:#632612}
.settingsFacebook{left:14%;top:42.4%;width:72%;z-index:5}
.settingsFacebook img,.closeSettings img{display:block;width:100%;height:auto}
.settingsToggle{left:30.5%;width:13.2%;aspect-ratio:591/354;background-image:url('ui/settings/toggle_states.png')!important;background-size:200% 100%!important;background-position:100% 0!important;background-repeat:no-repeat!important;z-index:5}
.settingsToggle.on{background-position:0 0!important}
#sfx.settingsToggle{top:61.4%}#music.settingsToggle{top:68.6%}#voice.settingsToggle{top:75.8%}
.settingsRadio{left:84%;width:6.7%;aspect-ratio:342/336;background-image:url('ui/settings/radio_states.png')!important;background-size:200% 100%!important;background-position:100% 0!important;background-repeat:no-repeat!important;transform:translate(-7.6%,-5.4%);z-index:5}
.settingsRadio.selected{background-position:0 0!important;transform:translate(2.3%,-5.4%)}
.settingsRadio[data-quality="smooth"]{top:61.1%}.settingsRadio[data-quality="medium"]{top:68.3%}.settingsRadio[data-quality="high"]{top:75.4%}
.closeSettings{left:22%;bottom:1.2%;width:56%;z-index:6}
@keyframes settingsPanelIn{from{opacity:0;transform:translateY(20px) scale(.92)}to{opacity:1;transform:translateY(0) scale(1)}}
@media(max-height:620px){.settingsCard{width:min(88%,calc(96vh * .6655));max-height:96vh}}

/* v0.5.0 OBJECTIVES / BOARD SHAPES / BLOCKERS */
.objectiveCardV5{
  height:72px;grid-template-columns:118px 1fr 42px;padding:7px 10px;
}
.goalStack{min-width:0;align-self:stretch;display:flex;flex-direction:column;justify-content:center}
.goalLabel{font-size:9px;font-weight:1000;color:#9c4a1f;letter-spacing:.5px}
.objectiveSummary{
  margin-top:2px;font-size:9px;line-height:1.12;font-weight:1000;color:#63220f;
  max-height:32px;overflow:hidden
}
.starScore{min-width:0}
.starCaption{font-size:8px;font-weight:900;color:#825037;margin:0 2px 3px}
.starCaption b{font-size:10px;color:#69220f}
.briefGoals{
  width:88%;font-size:11px;line-height:1.25;font-weight:900;color:#743014;
  background:rgba(255,245,213,.78);border:2px solid rgba(231,174,91,.65);
  border-radius:13px;padding:6px 8px;margin:2px auto
}
#board{background:none}
.boardBaseLayer,.boardBlockerLayer{position:absolute;inset:0;pointer-events:none}
.boardBaseLayer{z-index:1}.boardBlockerLayer{z-index:7}
.cellBase{
  position:absolute;width:12.5%;height:12.5%;padding:2px;
}
.cellBase:before{
  content:"";position:absolute;inset:2px;border-radius:10px;
  background:linear-gradient(180deg,rgba(236,248,255,.92),rgba(188,220,255,.86));
  border:1px solid rgba(255,255,255,.8);
  box-shadow:inset 0 -2px 3px rgba(67,114,169,.10)
}
.cellBase.alt:before{background:linear-gradient(180deg,rgba(226,244,255,.95),rgba(174,210,251,.87))}
.cellBase.edge:before{box-shadow:inset 0 0 0 2px rgba(255,216,96,.22),inset 0 -2px 3px rgba(67,114,169,.10)}
.jellyBlock,.crateBlock,.chainBlock{
  position:absolute;width:12.5%;height:12.5%;pointer-events:none
}
.jellyBlock{z-index:2}
.jellyBlock:before{
  content:"";position:absolute;inset:5px;border-radius:11px;
  background:radial-gradient(circle at 35% 28%,rgba(255,255,255,.68),transparent 25%),
             linear-gradient(145deg,rgba(121,226,255,.38),rgba(105,126,255,.36));
  border:2px solid rgba(221,250,255,.84);
  box-shadow:inset 0 0 10px rgba(54,120,255,.28),0 0 7px rgba(121,219,255,.25)
}
.jellyBlock.layer2:before{
  inset:3px;border-width:3px;
  background:radial-gradient(circle at 35% 28%,rgba(255,255,255,.74),transparent 23%),
             linear-gradient(145deg,rgba(103,234,255,.49),rgba(115,94,255,.47));
  box-shadow:inset 0 0 12px rgba(57,85,255,.35),0 0 8px rgba(87,205,255,.38)
}
.crateBlock{z-index:9}
.crateBlock:before{
  content:"";position:absolute;inset:4px;border-radius:8px;
  background:
    linear-gradient(45deg,transparent 43%,rgba(105,48,15,.58) 44% 52%,transparent 53%),
    linear-gradient(-45deg,transparent 43%,rgba(105,48,15,.58) 44% 52%,transparent 53%),
    linear-gradient(180deg,#efad52,#bd6d28);
  border:3px solid #8d481b;
  box-shadow:inset 0 0 0 2px rgba(255,222,139,.45),0 3px 5px rgba(74,39,23,.25)
}
.crateBlock.layer2:after{
  content:"2";position:absolute;right:6px;bottom:5px;width:18px;height:18px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  background:#ffdf62;border:2px solid white;color:#7b3718;font-size:10px;font-weight:1000;
  box-shadow:0 2px 3px rgba(70,35,20,.25)
}
.chainBlock{z-index:8}
.chainBlock:before{
  content:"";position:absolute;inset:7px;border-radius:12px;
  border:4px solid rgba(225,235,247,.95);
  box-shadow:inset 0 0 0 2px rgba(90,109,135,.55),0 0 5px rgba(255,255,255,.65);
  transform:rotate(10deg)
}
.chainBlock:after{
  content:"";position:absolute;left:16%;right:16%;top:45%;height:8px;border-radius:8px;
  background:repeating-linear-gradient(90deg,#f5f8fc 0 8px,#78879d 8px 12px,#e8eef7 12px 20px);
  box-shadow:0 1px 2px rgba(44,56,76,.45);transform:rotate(-34deg)
}
.blockHit{animation:blockHit .28s ease}
@keyframes blockHit{0%{filter:brightness(1)}45%{filter:brightness(1.8);transform:scale(1.08)}100%{filter:brightness(1);transform:scale(1)}}
.piece.locked img{filter:drop-shadow(0 3px 2px rgba(34,62,93,.14)) saturate(.82)}
.shapeBadge{
  position:absolute;right:10px;bottom:8px;z-index:12;padding:4px 8px;border-radius:11px;
  background:rgba(62,80,111,.72);color:white;font-size:8px;font-weight:900;pointer-events:none
}

/* v0.5.1 SPECIAL CANDY VISUALS */
.piece.specialArt{
  filter:drop-shadow(0 4px 5px rgba(0,0,0,.14));
}
.piece.specialArt img{
  width:97%;
  height:97%;
  object-fit:contain;
}
.piece.stripedCandy{
  animation:specialFloat 1.9s ease-in-out infinite;
}
.piece.wrappedCandy{
  animation:specialFloat 1.6s ease-in-out infinite, specialPulse 2.2s ease-in-out infinite;
}
.piece.colorBombSprite{
  animation:specialFloat 1.8s ease-in-out infinite, specialPulse 2.5s ease-in-out infinite;
}
.piece.colorBombSprite img{
  width:100%;
  height:100%;
}
@keyframes specialFloat{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-2px)}
}
@keyframes specialPulse{
  0%,100%{filter:drop-shadow(0 0 0 rgba(255,255,255,0))}
  50%{filter:drop-shadow(0 0 10px rgba(255,255,255,.78))}
}


/* v0.6.1 COMBO POLISH PASS */
.screenFlash{
  position:absolute;inset:0;pointer-events:none;z-index:180;opacity:0;
  background:radial-gradient(circle at center,rgba(255,255,255,.9),rgba(255,255,255,0) 62%);
}
.screenFlash.popSmall{animation:flashSmall .26s ease-out}
.screenFlash.popMedium{animation:flashMedium .34s ease-out}
.screenFlash.popLarge{animation:flashLarge .42s ease-out}
@keyframes flashSmall{0%{opacity:0}25%{opacity:.28}100%{opacity:0}}
@keyframes flashMedium{0%{opacity:0}22%{opacity:.45}100%{opacity:0}}
@keyframes flashLarge{0%{opacity:0}18%{opacity:.62}100%{opacity:0}}

#board.shakeSmall{animation:shakeSmall .16s linear}
#board.shakeMedium{animation:shakeMedium .22s linear}
#board.shakeLarge{animation:shakeLarge .30s linear}
@keyframes shakeSmall{
  0%,100%{transform:translate(0)}
  25%{transform:translate(-3px,1px)}
  50%{transform:translate(3px,-2px)}
  75%{transform:translate(-2px,1px)}
}
@keyframes shakeMedium{
  0%,100%{transform:translate(0)}
  20%{transform:translate(-5px,2px)}
  40%{transform:translate(5px,-3px)}
  60%{transform:translate(-4px,-1px)}
  80%{transform:translate(4px,2px)}
}
@keyframes shakeLarge{
  0%,100%{transform:translate(0)}
  16%{transform:translate(-8px,3px)}
  32%{transform:translate(8px,-4px)}
  48%{transform:translate(-7px,-2px)}
  64%{transform:translate(7px,4px)}
  80%{transform:translate(-5px,1px)}
}

.comboText.mega{
  font-size:29px;padding:9px 16px;
  background:linear-gradient(180deg,#ff8bd3,#ee328f);
  box-shadow:0 8px 24px rgba(186,39,119,.36),0 0 24px rgba(255,255,255,.26);
  animation:comboMega .95s ease forwards;
}
.comboText.ultra{
  font-size:33px;padding:10px 18px;
  background:linear-gradient(180deg,#ffa9d7,#ff6c2e);
  border-color:#fff7b0;text-shadow:0 2px #8a174d, 0 0 10px rgba(255,255,255,.55);
  box-shadow:0 10px 28px rgba(255,127,70,.42),0 0 28px rgba(255,255,255,.34);
  animation:comboUltra 1.05s ease forwards;
}
.comboText.legend{
  font-size:36px;padding:12px 20px;
  background:linear-gradient(180deg,#fff2a8,#ff9e2f 42%,#ef2b8e 100%);
  border-color:#ffffff;color:#fff;
  text-shadow:0 2px #91225b, 0 0 12px rgba(255,255,255,.7);
  box-shadow:0 12px 34px rgba(255,122,64,.48),0 0 38px rgba(255,255,255,.4);
  animation:comboLegend 1.15s ease forwards;
}
@keyframes comboMega{
  0%{translate:-50% -50%;transform:scale(.55) rotate(-4deg);opacity:0}
  18%{opacity:1}
  55%{translate:-50% -50%;transform:scale(1.18) rotate(2deg);opacity:1}
  100%{translate:-50% -63%;transform:scale(1);opacity:0}
}
@keyframes comboUltra{
  0%{translate:-50% -50%;transform:scale(.5) rotate(-6deg);opacity:0}
  18%{opacity:1}
  56%{translate:-50% -50%;transform:scale(1.24) rotate(3deg);opacity:1}
  100%{translate:-50% -66%;transform:scale(1.03);opacity:0}
}
@keyframes comboLegend{
  0%{translate:-50% -50%;transform:scale(.45) rotate(-8deg);opacity:0}
  18%{opacity:1}
  56%{translate:-50% -50%;transform:scale(1.28) rotate(4deg);opacity:1}
  100%{translate:-50% -69%;transform:scale(1.05);opacity:0}
}
.comboEcho{
  position:absolute;left:50%;top:45%;translate:-50% -50%;z-index:38;width:90px;height:90px;border-radius:50%;
  border:5px solid rgba(255,255,255,.78);box-shadow:0 0 20px rgba(255,255,255,.45);pointer-events:none;
  animation:comboEcho 1s ease-out forwards;
}
@keyframes comboEcho{
  from{transform:scale(.25);opacity:.85}
  to{transform:scale(2.7);opacity:0}
}


/* v0.6.2 NAVIGATION / MAP / STATE POLISH */
.phone:after{display:none!important}
.resourceIcon{width:23px;height:23px;object-fit:contain;filter:drop-shadow(0 2px 2px rgba(0,0,0,.18))}
.resourcePill .sym{display:none}
.homeHero{justify-content:space-evenly;padding-top:16px;padding-bottom:18px}
.candyShowcase{min-height:185px;margin:0 0 3px}
.candyShowcase img{width:31%;margin:0 -2%;animation-duration:3.5s}
.candyShowcase img:nth-child(2){width:39%;z-index:2;transform:translateY(-8px)}
.candyShowcase img:nth-child(3){width:31%}
.playAsset{width:80%}
.mapTextBtn,.version{display:none!important}

.mapArea{scrollbar-width:none;-ms-overflow-style:none;overscroll-behavior:contain;scroll-behavior:smooth;padding:16px 10px 38px}
.mapArea::-webkit-scrollbar{display:none;width:0;height:0}
.pathArt{left:50%;top:62px;bottom:auto;width:88%;height:1160px;transform:translateX(-50%);background-image:none;opacity:0}
.levelList{gap:28px;padding:34px 0 46px;min-height:1200px;justify-content:flex-start}
.levelRow{min-height:88px;position:relative}
.levelNode{width:78px;height:78px}
.levelNode.locked{filter:saturate(.25) brightness(.92);background:radial-gradient(circle at 35% 28%,#f0f2f7 0 14%,#c4cad5 45%,#959dab 88%);border-color:#f4f6fa;color:#697383;box-shadow:0 6px 0 #7d8796,0 9px 14px rgba(65,73,86,.18)}
.levelNode.current:before{inset:-9px;background:transparent;border:3px solid rgba(255,210,61,.84);box-shadow:0 0 12px rgba(255,213,55,.46);animation:activePulseV62 1.8s ease-in-out infinite}
@keyframes activePulseV62{50%{transform:scale(1.05);opacity:.62}}
.nodeStars{bottom:-18px;font-size:12px;line-height:1}
.objectiveBadge{position:absolute;right:-13px;top:-9px;min-width:34px;padding:3px 5px;border-radius:8px;background:linear-gradient(#fff8df,#ffd987);border:2px solid white;box-shadow:0 2px 5px rgba(85,48,29,.18);font-size:6px;font-weight:1000;color:#713019;text-shadow:none;letter-spacing:.15px}
.mapTitle{display:flex;align-items:center;gap:7px;top:-12px;padding:6px 14px}
.mapTitle strong{font-size:14px}.mapTitle span{font-size:9px;opacity:.66;text-transform:uppercase;letter-spacing:.5px}

.overlay{background:rgba(31,24,42,.64);backdrop-filter:blur(1.7px) saturate(.72);-webkit-backdrop-filter:blur(1.7px) saturate(.72);z-index:140}
.overlay.show{pointer-events:auto}
.panelArt{pointer-events:none!important;user-select:none}
.modalContent{z-index:3;pointer-events:auto}
.modalContent button{position:relative;z-index:6;pointer-events:auto}
.briefCard{width:92%}
.briefContent{top:13%;bottom:9%;gap:7px}
.briefTitle{font-size:26px;letter-spacing:.3px}
.briefGoals{width:86%;font-size:12px;padding:7px 9px;margin:1px auto}
.briefMoves{font-size:11px;font-weight:1000;color:#7a341c}.briefMoves b{font-size:20px}
.briefStar{font-size:10px;font-weight:900;color:#87513a}
.briefPlay{width:70%;margin-top:0}
.modalTextButton{border:3px solid white;border-radius:17px;padding:8px 18px;min-width:135px;background:linear-gradient(180deg,#fff9e9,#ffdca1);color:#733018;font-size:11px;font-weight:1000;box-shadow:0 4px 0 #d49348,0 7px 12px rgba(94,54,33,.14);cursor:pointer}
.modalTextButton:active{transform:translateY(3px);box-shadow:0 1px 0 #d49348}
.resultCard{width:95%}
.resultContent{top:5%;bottom:5%;gap:4px}
.resultBanner{width:69%;max-height:103px}
.resultStars{width:67%;max-height:70px}
.resultText{font-size:12px;line-height:1.16}
.resultScore{font-size:15px}
.resultGoalText{font-size:10px;max-width:84%}
.resultButtons{margin-top:3px;gap:5px;position:relative;z-index:8}
.resultButtons .assetButton{pointer-events:auto}
.resultButtons .assetButton img{height:48px}
.mapResultButton{margin-top:3px;min-width:122px;background:linear-gradient(180deg,#fff8de,#ffc974)}
#endMap{pointer-events:auto!important;z-index:10!important}

.screen{transition:opacity .26s ease,transform .26s ease}
#home.active{animation:screenFadeIn .28s ease}
#map.active{animation:mapSlideIn .30s ease}
#game.active{animation:screenFadeIn .28s ease}
@keyframes screenFadeIn{from{opacity:0;transform:scale(.985)}to{opacity:1;transform:scale(1)}}
@keyframes mapSlideIn{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}


.modalCoverLeaf{position:absolute;z-index:2;pointer-events:none;width:31%;right:-1%;top:5%;transform:rotate(18deg);filter:drop-shadow(0 3px 3px rgba(50,100,30,.18))}
.resultLeafCover{width:28%;right:0;top:4%}

/* v0.6.3 CORE FOUR CANDY READABILITY */
.candyShowcase.fourCore img,
.candyShowcase img{flex:0 0 auto}
#heroCandy img{width:24%;margin:0 -1.2%}
#heroCandy img:nth-child(1){transform:rotate(-5deg) translateY(4px)}
#heroCandy img:nth-child(2){width:27%;z-index:3;transform:rotate(-2deg) translateY(-8px)}
#heroCandy img:nth-child(3){width:24%;z-index:2;transform:rotate(3deg) translateY(-2px)}
#heroCandy img:nth-child(4){width:24%;transform:rotate(5deg) translateY(5px);animation-delay:1.05s}


/* v0.6.4 SPECIAL FX UPGRADE */
.energyTendrilLayer{
  position:absolute;inset:0;width:100%;height:100%;z-index:46;
  pointer-events:none;overflow:visible;
}
.energyTendril{
  fill:none;stroke-linecap:round;
  stroke-width:4.5;
  filter:drop-shadow(0 0 4px currentColor);
  stroke-dasharray:18 10;
  animation:tendrilFlow .42s linear infinite;
}
.energyTendril.core{
  stroke-width:7.5;
  opacity:.32;
  stroke-dasharray:none;
  animation:none;
}
@keyframes tendrilFlow{
  to{stroke-dashoffset:-56}
}
.energyTargetPulse{
  position:absolute;width:18px;height:18px;border-radius:50%;
  translate:-50% -50%;z-index:47;pointer-events:none;
  background:radial-gradient(circle,#fff 0 18%,currentColor 20% 48%,transparent 52%);
  box-shadow:0 0 9px currentColor,0 0 18px currentColor;
  animation:targetPulse .46s ease-out forwards;
}
@keyframes targetPulse{
  0%{transform:scale(.25);opacity:0}
  35%{transform:scale(1.35);opacity:1}
  100%{transform:scale(.72);opacity:.25}
}

/* v0.6.15.33: compositor-only BEAM and static BIND for large boards. */
.liteBeam{
  position:absolute;
  display:block;
  pointer-events:none;
  will-change:transform,opacity;
  background:#fff7b0;
  box-shadow:0 0 2px #ffcf3c;
}
.spriteBeamSegment{
  position:absolute;
  display:block;
  overflow:hidden;
  pointer-events:none;
  will-change:transform,opacity;
}
.liteBind{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  overflow:visible;
  pointer-events:none;
  will-change:opacity;
}
.liteBindLine{
  fill:none;
  stroke-width:3;
  stroke-linecap:round;
  opacity:.84;
}
.energyTendril{
  stroke-width:3;
  stroke-dasharray:none;
  filter:none;
  animation:none;
  opacity:.82;
}
.energyTendril.core{
  stroke-width:5;
  opacity:.2;
  animation:none;
}
.colorBombCharge{
  position:absolute;width:12.5%;height:12.5%;pointer-events:none;z-index:49;
  display:flex;align-items:center;justify-content:center;
}
.colorBombCharge:before,
.colorBombCharge:after{
  content:"";position:absolute;border-radius:50%;border:4px solid rgba(255,255,255,.95);
  box-shadow:0 0 14px rgba(255,238,122,.9),0 0 24px rgba(255,97,211,.65);
  animation:chargeRing .8s ease-out forwards;
}
.colorBombCharge:after{animation-delay:.15s;border-color:rgba(112,226,255,.95)}
@keyframes chargeRing{
  0%{width:18%;height:18%;opacity:0;transform:rotate(0)}
  24%{opacity:1}
  100%{width:155%;height:155%;opacity:0;transform:rotate(160deg)}
}
.piece.colorBombForming{
  z-index:52;
  animation:colorBombForm .82s cubic-bezier(.2,.9,.2,1.2);
}
@keyframes colorBombForm{
  0%{transform:scale(.45) rotate(-18deg);filter:brightness(1.8) saturate(1.5)}
  35%{transform:scale(1.28) rotate(10deg);filter:brightness(1.5) saturate(1.5)}
  62%{transform:scale(.92) rotate(-4deg)}
  100%{transform:scale(1) rotate(0);filter:brightness(1)}
}
.wrappedTripleMarker{
  position:absolute;z-index:48;pointer-events:none;
  width:12.5%;height:12.5%;
}
.wrappedTripleMarker:before{
  content:"";position:absolute;left:50%;top:50%;translate:-50% -50%;
  width:18px;height:18px;border-radius:50%;
  border:5px solid rgba(255,232,103,.96);
  box-shadow:0 0 10px #fff,0 0 22px #ff9f43;
  animation:wrappedRing .42s ease-out forwards;
}
@keyframes wrappedRing{
  from{transform:scale(.25);opacity:1}
  to{transform:scale(5.4);opacity:0}
}


/* v0.6.6 SETTINGS ASSET + CRATE HOTFIX */
.homeSettingsBtn{
  width:58%;
  margin-top:4px;
  background:transparent;
  border:0;
  padding:0;
  box-shadow:none;
}
.homeSettingsAsset{
  width:100%;
  height:auto;
  display:block;
}
#game{padding:max(5px,env(safe-area-inset-top)) 5px max(5px,env(safe-area-inset-bottom));gap:4px}
.gameTop{
  height:68px;padding:6px 8px;grid-template-columns:44px 1fr 66px 66px;gap:6px;
}
.gameBack{width:42px;height:42px}
.levelInfo strong{font-size:18px}
.levelInfo span{font-size:9px}
.statBox{height:50px}
.statBox b{font-size:18px}
.objectiveCard,.objectiveCardV5{
  height:56px;padding:6px 10px;grid-template-columns:102px 1fr 38px;gap:6px;
}
.goalLabel{font-size:8px}
.objectiveSummary{font-size:9px;max-height:26px}
.starCaption{font-size:7px;margin-bottom:2px}
.starCaption b{font-size:9px}
.progressWrap{height:19px;border-width:2px}
.progressStar{width:22px;height:22px}
.pct{font-size:12px}
.message{height:22px;font-size:11px}
.boardShell{
  padding:8px;border-width:2px;border-radius:24px;
}
.boosterDock{
  height:74px;padding:3px 8px 2px;border-radius:22px;
}
.booster{height:64px}
.countBadge{min-width:23px;height:23px;font-size:11px;right:0;bottom:1px}
.utilityDock{display:none !important}

/* Crate art + placement fix */
.crateBlock{
  z-index:9;
  position:absolute;
  width:12.5%;
  height:12.5%;
  pointer-events:none;
  display:flex;
  align-items:center;
  justify-content:center;
}
.crateBlock:before,.crateBlock:after{display:none !important}
.crateArt{
  width:82%;
  height:82%;
  object-fit:contain;
  display:block;
  filter:drop-shadow(0 3px 4px rgba(74,39,23,.26));
}
.crateBadge{
  position:absolute;
  right:8px;
  bottom:7px;
  width:18px;
  height:18px;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  background:#ffdf62;
  border:2px solid white;
  color:#7b3718;
  font-size:10px;
  font-weight:1000;
  box-shadow:0 2px 3px rgba(70,35,20,.25)
}
.crateBlock.blockHit .crateArt{animation:crateShake .28s ease}
@keyframes crateShake{
  0%,100%{transform:translate(0,0)}
  20%{transform:translate(-2px,1px) rotate(-3deg)}
  40%{transform:translate(2px,-1px) rotate(3deg)}
  60%{transform:translate(-1px,-1px) rotate(-2deg)}
  80%{transform:translate(1px,1px) rotate(2deg)}
}
.crateFlash{
  position:absolute;
  width:12.5%;
  height:12.5%;
  pointer-events:none;
  z-index:12;
}
.crateFlash:before{
  content:"";
  position:absolute;
  left:50%;
  top:50%;
  translate:-50% -50%;
  width:22px;
  height:22px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(255,248,194,.96),rgba(255,226,114,.55),transparent 70%);
  animation:crateFlash .32s ease-out forwards;
}
@keyframes crateFlash{
  from{transform:scale(.4);opacity:.95}
  to{transform:scale(3.6);opacity:0}
}

/* Supplied blocker artwork */
.jellyBlock{
  z-index:2;
  background:url('ui/objectives/objective_jelly.png') center/75.2% 75.2% no-repeat;
  filter:drop-shadow(0 2px 2px rgba(46,105,167,.22));
}
.jellyBlock:before{display:none !important}
.jellyBlock.layer2{filter:drop-shadow(0 2px 3px rgba(46,105,167,.35)) saturate(1.12)}
.crateBlock{
  background-image:url('ui/objectives/objective_crate.png');
  background-repeat:no-repeat;
  background-size:500% 100%;
  background-position:25% 0;
  filter:drop-shadow(0 3px 4px rgba(74,39,23,.26));
}
.crateBlock.layer2{background-position:0 0}
.chainBlock:before,.chainBlock:after{display:none !important}
.piece.locked .specialOverlay{
  inset:0;
  border:0;
  border-radius:0;
  background-image:url('ui/objectives/objective_lock.png');
  background-repeat:no-repeat;
  background-size:500% 100%;
  background-position:0 0;
  filter:drop-shadow(0 2px 3px rgba(28,36,55,.32));
}
.blockerSpriteFx{
  position:absolute;
  width:12.5%;
  height:12.5%;
  z-index:15;
  pointer-events:none;
  background-repeat:no-repeat;
  background-size:500% 100%;
  animation:blockerSpriteSequence .4s steps(1,end) forwards;
}
.blockerSpriteFx-crate{background-image:url('ui/objectives/objective_crate.png')}
.blockerSpriteFx-chain{background-image:url('ui/objectives/objective_lock.png')}
@keyframes blockerSpriteSequence{
  0%,19.99%{background-position:0 0}
  20%,39.99%{background-position:25% 0}
  40%,59.99%{background-position:50% 0}
  60%,79.99%{background-position:75% 0}
  80%,100%{background-position:100% 0}
}



/* v0.6.7.1 LOADING CONTENT VISIBILITY FIX */
.phone.loading-active{
  background:#69caff url("loading/loading_bg.png?v=0.6.15.56-full-preload") center center / cover no-repeat !important;
}
.phone.loading-active:before,
.phone.loading-active:after{display:none !important}
.phone.loading-active > .decorLeaf{display:none !important}
#loading{
  z-index:500 !important;
  position:absolute !important;
  inset:0 !important;
  overflow:hidden !important;
  background:transparent !important;
  display:none;
}
#loading.active{display:block !important;opacity:1 !important;transform:none !important}
#loading .loadingBg{display:none !important}
#loading .loadingShade{display:none !important}
.floating_fruits{
  position:absolute !important;
  left:50% !important;
  top:29.5% !important;
  transform:translateX(-50%) !important;
  width:76% !important;
  height:34% !important;
  display:grid !important;
  grid-template-columns:1fr 1fr !important;
  grid-template-rows:1fr 1fr !important;
  gap:0 10px !important;
  align-items:center !important;
  justify-items:center !important;
  z-index:3 !important;
  pointer-events:none !important;
}
.floating_fruit{
  width:100% !important;
  max-width:160px !important;
  height:100% !important;
  max-height:160px !important;
  object-fit:contain !important;
  opacity:1 !important;
  transform-origin:center;
  filter:drop-shadow(0 8px 10px rgba(72,37,10,.18));
  visibility:visible !important;
}
.floating_fruit.floatA{animation:candyBobA 2.7s ease-in-out infinite !important}
.floating_fruit.floatB{animation:candyBobB 3.1s ease-in-out infinite !important}
.floating_fruit.floatC{animation:candyBobC 2.5s ease-in-out infinite !important}
.floating_fruit.floatD{animation:candyBobD 3.0s ease-in-out infinite !important}
@keyframes candyBobA{50%{transform:translateY(-6px) rotate(-2deg)}}
@keyframes candyBobB{50%{transform:translateY(-5px) rotate(2deg)}}
@keyframes candyBobC{50%{transform:translateY(-7px) rotate(1deg)}}
@keyframes candyBobD{50%{transform:translateY(-5px) rotate(-1.5deg)}}
.loadingLower{
  position:absolute !important;
  left:50% !important;
  bottom:20px !important;
  transform:translateX(-50%) !important;
  z-index:4 !important;
  width:88% !important;
  height:24% !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:flex-end !important;
  gap:5px !important;
  visibility:visible !important;
  opacity:1 !important;
}
.loadingBarFrame{
  width:100% !important;
  height:54px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  flex:0 0 54px !important;
}
#loadingBarImg{
  width:92% !important;
  height:100% !important;
  object-fit:contain !important;
  display:block !important;
  opacity:1 !important;
  visibility:visible !important;
}
.loadingTextFrame{
  width:100% !important;
  height:32px !important;
  flex:0 0 32px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  overflow:hidden !important;
}
#loadingTextImg{
  width:100% !important;
  height:100% !important;
  object-fit:contain !important;
  display:block !important;
  opacity:1 !important;
  visibility:visible !important;
}
.loadingTipFrame{
  width:100% !important;
  height:84px !important;
  flex:0 0 84px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
}
#loadingTipImg{
  width:100% !important;
  height:100% !important;
  object-fit:contain !important;
  display:block !important;
  opacity:1;
  visibility:visible !important;
  transition:opacity .15s ease;
}
.loadingFadeOut{animation:loadingFadeOut .34s ease forwards}
@keyframes loadingFadeOut{to{opacity:0}}
@media(max-height:760px){
  .objectiveCardV5{height:64px}
  .objectiveSummary{font-size:8px}
}

/* tiny screens */

/* v0.5.1 SPECIAL CANDY VISUALS */
.piece.specialArt{
  filter:drop-shadow(0 4px 5px rgba(0,0,0,.14));
}
.piece.specialArt img{
  width:97%;
  height:97%;
  object-fit:contain;
}
.piece.stripedCandy{
  animation:specialFloat 1.9s ease-in-out infinite;
}
.piece.wrappedCandy{
  animation:specialFloat 1.6s ease-in-out infinite, specialPulse 2.2s ease-in-out infinite;
}
.piece.colorBombSprite{
  animation:specialFloat 1.8s ease-in-out infinite, specialPulse 2.5s ease-in-out infinite;
}
.piece.colorBombSprite img{
  width:100%;
  height:100%;
}
@keyframes specialFloat{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-2px)}
}
@keyframes specialPulse{
  0%,100%{filter:drop-shadow(0 0 0 rgba(255,255,255,0))}
  50%{filter:drop-shadow(0 0 10px rgba(255,255,255,.78))}
}


/* v0.6.1 COMBO POLISH PASS */
.screenFlash{
  position:absolute;inset:0;pointer-events:none;z-index:180;opacity:0;
  background:radial-gradient(circle at center,rgba(255,255,255,.9),rgba(255,255,255,0) 62%);
}
.screenFlash.popSmall{animation:flashSmall .26s ease-out}
.screenFlash.popMedium{animation:flashMedium .34s ease-out}
.screenFlash.popLarge{animation:flashLarge .42s ease-out}
@keyframes flashSmall{0%{opacity:0}25%{opacity:.28}100%{opacity:0}}
@keyframes flashMedium{0%{opacity:0}22%{opacity:.45}100%{opacity:0}}
@keyframes flashLarge{0%{opacity:0}18%{opacity:.62}100%{opacity:0}}

#board.shakeSmall{animation:shakeSmall .16s linear}
#board.shakeMedium{animation:shakeMedium .22s linear}
#board.shakeLarge{animation:shakeLarge .30s linear}
@keyframes shakeSmall{
  0%,100%{transform:translate(0)}
  25%{transform:translate(-3px,1px)}
  50%{transform:translate(3px,-2px)}
  75%{transform:translate(-2px,1px)}
}
@keyframes shakeMedium{
  0%,100%{transform:translate(0)}
  20%{transform:translate(-5px,2px)}
  40%{transform:translate(5px,-3px)}
  60%{transform:translate(-4px,-1px)}
  80%{transform:translate(4px,2px)}
}
@keyframes shakeLarge{
  0%,100%{transform:translate(0)}
  16%{transform:translate(-8px,3px)}
  32%{transform:translate(8px,-4px)}
  48%{transform:translate(-7px,-2px)}
  64%{transform:translate(7px,4px)}
  80%{transform:translate(-5px,1px)}
}

.comboText.mega{
  font-size:29px;padding:9px 16px;
  background:linear-gradient(180deg,#ff8bd3,#ee328f);
  box-shadow:0 8px 24px rgba(186,39,119,.36),0 0 24px rgba(255,255,255,.26);
  animation:comboMega .95s ease forwards;
}
.comboText.ultra{
  font-size:33px;padding:10px 18px;
  background:linear-gradient(180deg,#ffa9d7,#ff6c2e);
  border-color:#fff7b0;text-shadow:0 2px #8a174d, 0 0 10px rgba(255,255,255,.55);
  box-shadow:0 10px 28px rgba(255,127,70,.42),0 0 28px rgba(255,255,255,.34);
  animation:comboUltra 1.05s ease forwards;
}
.comboText.legend{
  font-size:36px;padding:12px 20px;
  background:linear-gradient(180deg,#fff2a8,#ff9e2f 42%,#ef2b8e 100%);
  border-color:#ffffff;color:#fff;
  text-shadow:0 2px #91225b, 0 0 12px rgba(255,255,255,.7);
  box-shadow:0 12px 34px rgba(255,122,64,.48),0 0 38px rgba(255,255,255,.4);
  animation:comboLegend 1.15s ease forwards;
}
@keyframes comboMega{
  0%{translate:-50% -50%;transform:scale(.55) rotate(-4deg);opacity:0}
  18%{opacity:1}
  55%{translate:-50% -50%;transform:scale(1.18) rotate(2deg);opacity:1}
  100%{translate:-50% -63%;transform:scale(1);opacity:0}
}
@keyframes comboUltra{
  0%{translate:-50% -50%;transform:scale(.5) rotate(-6deg);opacity:0}
  18%{opacity:1}
  56%{translate:-50% -50%;transform:scale(1.24) rotate(3deg);opacity:1}
  100%{translate:-50% -66%;transform:scale(1.03);opacity:0}
}
@keyframes comboLegend{
  0%{translate:-50% -50%;transform:scale(.45) rotate(-8deg);opacity:0}
  18%{opacity:1}
  56%{translate:-50% -50%;transform:scale(1.28) rotate(4deg);opacity:1}
  100%{translate:-50% -69%;transform:scale(1.05);opacity:0}
}
.comboEcho{
  position:absolute;left:50%;top:45%;translate:-50% -50%;z-index:38;width:90px;height:90px;border-radius:50%;
  border:5px solid rgba(255,255,255,.78);box-shadow:0 0 20px rgba(255,255,255,.45);pointer-events:none;
  animation:comboEcho 1s ease-out forwards;
}
@keyframes comboEcho{
  from{transform:scale(.25);opacity:.85}
  to{transform:scale(2.7);opacity:0}
}


/* v0.6.2 NAVIGATION / MAP / STATE POLISH */
.phone:after{display:none!important}
.resourceIcon{width:23px;height:23px;object-fit:contain;filter:drop-shadow(0 2px 2px rgba(0,0,0,.18))}
.resourcePill .sym{display:none}
.homeHero{justify-content:space-evenly;padding-top:16px;padding-bottom:18px}
.candyShowcase{min-height:185px;margin:0 0 3px}
.candyShowcase img{width:31%;margin:0 -2%;animation-duration:3.5s}
.candyShowcase img:nth-child(2){width:39%;z-index:2;transform:translateY(-8px)}
.candyShowcase img:nth-child(3){width:31%}
.playAsset{width:80%}
.mapTextBtn,.version{display:none!important}

.mapArea{scrollbar-width:none;-ms-overflow-style:none;overscroll-behavior:contain;scroll-behavior:smooth;padding:16px 10px 38px}
.mapArea::-webkit-scrollbar{display:none;width:0;height:0}
.pathArt{left:50%;top:62px;bottom:auto;width:88%;height:1160px;transform:translateX(-50%);background-image:none;opacity:0}
.levelList{gap:28px;padding:34px 0 46px;min-height:1200px;justify-content:flex-start}
.levelRow{min-height:88px;position:relative}
.levelNode{width:78px;height:78px}
.levelNode.locked{filter:saturate(.25) brightness(.92);background:radial-gradient(circle at 35% 28%,#f0f2f7 0 14%,#c4cad5 45%,#959dab 88%);border-color:#f4f6fa;color:#697383;box-shadow:0 6px 0 #7d8796,0 9px 14px rgba(65,73,86,.18)}
.levelNode.current:before{inset:-9px;background:transparent;border:3px solid rgba(255,210,61,.84);box-shadow:0 0 12px rgba(255,213,55,.46);animation:activePulseV62 1.8s ease-in-out infinite}
@keyframes activePulseV62{50%{transform:scale(1.05);opacity:.62}}
.nodeStars{bottom:-18px;font-size:12px;line-height:1}
.objectiveBadge{position:absolute;right:-13px;top:-9px;min-width:34px;padding:3px 5px;border-radius:8px;background:linear-gradient(#fff8df,#ffd987);border:2px solid white;box-shadow:0 2px 5px rgba(85,48,29,.18);font-size:6px;font-weight:1000;color:#713019;text-shadow:none;letter-spacing:.15px}
.mapTitle{display:flex;align-items:center;gap:7px;top:-12px;padding:6px 14px}
.mapTitle strong{font-size:14px}.mapTitle span{font-size:9px;opacity:.66;text-transform:uppercase;letter-spacing:.5px}

.overlay{background:rgba(31,24,42,.64);backdrop-filter:blur(1.7px) saturate(.72);-webkit-backdrop-filter:blur(1.7px) saturate(.72);z-index:140}
.overlay.show{pointer-events:auto}
.panelArt{pointer-events:none!important;user-select:none}
.modalContent{z-index:3;pointer-events:auto}
.modalContent button{position:relative;z-index:6;pointer-events:auto}
.briefCard{width:92%}
.briefContent{top:13%;bottom:9%;gap:7px}
.briefTitle{font-size:26px;letter-spacing:.3px}
.briefGoals{width:86%;font-size:12px;padding:7px 9px;margin:1px auto}
.briefMoves{font-size:11px;font-weight:1000;color:#7a341c}.briefMoves b{font-size:20px}
.briefStar{font-size:10px;font-weight:900;color:#87513a}
.briefPlay{width:70%;margin-top:0}
.modalTextButton{border:3px solid white;border-radius:17px;padding:8px 18px;min-width:135px;background:linear-gradient(180deg,#fff9e9,#ffdca1);color:#733018;font-size:11px;font-weight:1000;box-shadow:0 4px 0 #d49348,0 7px 12px rgba(94,54,33,.14);cursor:pointer}
.modalTextButton:active{transform:translateY(3px);box-shadow:0 1px 0 #d49348}
.resultCard{width:95%}
.resultContent{top:5%;bottom:5%;gap:4px}
.resultBanner{width:69%;max-height:103px}
.resultStars{width:67%;max-height:70px}
.resultText{font-size:12px;line-height:1.16}
.resultScore{font-size:15px}
.resultGoalText{font-size:10px;max-width:84%}
.resultButtons{margin-top:3px;gap:5px;position:relative;z-index:8}
.resultButtons .assetButton{pointer-events:auto}
.resultButtons .assetButton img{height:48px}
.mapResultButton{margin-top:3px;min-width:122px;background:linear-gradient(180deg,#fff8de,#ffc974)}
#endMap{pointer-events:auto!important;z-index:10!important}

.screen{transition:opacity .26s ease,transform .26s ease}
#home.active{animation:screenFadeIn .28s ease}
#map.active{animation:mapSlideIn .30s ease}
#game.active{animation:screenFadeIn .28s ease}
@keyframes screenFadeIn{from{opacity:0;transform:scale(.985)}to{opacity:1;transform:scale(1)}}
@keyframes mapSlideIn{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}


.modalCoverLeaf{position:absolute;z-index:2;pointer-events:none;width:31%;right:-1%;top:5%;transform:rotate(18deg);filter:drop-shadow(0 3px 3px rgba(50,100,30,.18))}
.resultLeafCover{width:28%;right:0;top:4%}

/* v0.6.3 CORE FOUR CANDY READABILITY */
.candyShowcase.fourCore img,
.candyShowcase img{flex:0 0 auto}
#heroCandy img{width:24%;margin:0 -1.2%}
#heroCandy img:nth-child(1){transform:rotate(-5deg) translateY(4px)}
#heroCandy img:nth-child(2){width:27%;z-index:3;transform:rotate(-2deg) translateY(-8px)}
#heroCandy img:nth-child(3){width:24%;z-index:2;transform:rotate(3deg) translateY(-2px)}
#heroCandy img:nth-child(4){width:24%;transform:rotate(5deg) translateY(5px);animation-delay:1.05s}


/* v0.6.4 SPECIAL FX UPGRADE */
.energyTendrilLayer{
  position:absolute;inset:0;width:100%;height:100%;z-index:46;
  pointer-events:none;overflow:visible;
}
.energyTendril{
  fill:none;stroke-linecap:round;
  stroke-width:4.5;
  filter:drop-shadow(0 0 4px currentColor);
  stroke-dasharray:18 10;
  animation:tendrilFlow .42s linear infinite;
}
.energyTendril.core{
  stroke-width:7.5;
  opacity:.32;
  stroke-dasharray:none;
  animation:none;
}
@keyframes tendrilFlow{
  to{stroke-dashoffset:-56}
}
.energyTargetPulse{
  position:absolute;width:18px;height:18px;border-radius:50%;
  translate:-50% -50%;z-index:47;pointer-events:none;
  background:radial-gradient(circle,#fff 0 18%,currentColor 20% 48%,transparent 52%);
  box-shadow:0 0 9px currentColor,0 0 18px currentColor;
  animation:targetPulse .46s ease-out forwards;
}
@keyframes targetPulse{
  0%{transform:scale(.25);opacity:0}
  35%{transform:scale(1.35);opacity:1}
  100%{transform:scale(.72);opacity:.25}
}
.colorBombCharge{
  position:absolute;width:12.5%;height:12.5%;pointer-events:none;z-index:49;
  display:flex;align-items:center;justify-content:center;
}
.colorBombCharge:before,
.colorBombCharge:after{
  content:"";position:absolute;border-radius:50%;border:4px solid rgba(255,255,255,.95);
  box-shadow:0 0 14px rgba(255,238,122,.9),0 0 24px rgba(255,97,211,.65);
  animation:chargeRing .8s ease-out forwards;
}
.colorBombCharge:after{animation-delay:.15s;border-color:rgba(112,226,255,.95)}
@keyframes chargeRing{
  0%{width:18%;height:18%;opacity:0;transform:rotate(0)}
  24%{opacity:1}
  100%{width:155%;height:155%;opacity:0;transform:rotate(160deg)}
}
.piece.colorBombForming{
  z-index:52;
  animation:colorBombForm .82s cubic-bezier(.2,.9,.2,1.2);
}
@keyframes colorBombForm{
  0%{transform:scale(.45) rotate(-18deg);filter:brightness(1.8) saturate(1.5)}
  35%{transform:scale(1.28) rotate(10deg);filter:brightness(1.5) saturate(1.5)}
  62%{transform:scale(.92) rotate(-4deg)}
  100%{transform:scale(1) rotate(0);filter:brightness(1)}
}
.wrappedTripleMarker{
  position:absolute;z-index:48;pointer-events:none;
  width:12.5%;height:12.5%;
}
.wrappedTripleMarker:before{
  content:"";position:absolute;left:50%;top:50%;translate:-50% -50%;
  width:18px;height:18px;border-radius:50%;
  border:5px solid rgba(255,232,103,.96);
  box-shadow:0 0 10px #fff,0 0 22px #ff9f43;
  animation:wrappedRing .42s ease-out forwards;
}
@keyframes wrappedRing{
  from{transform:scale(.25);opacity:1}
  to{transform:scale(5.4);opacity:0}
}

@media(max-height:760px){
  .gameTop{height:62px}.objectiveCard{height:50px}.message{height:20px}.boosterDock{height:68px}.booster{height:58px}
}

/* v0.6.8.0 TROPICAL OPENING */
.openingSceneBg,.openingSceneForeground{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.openingSceneBg{object-fit:cover;z-index:0;animation:openingSceneDrift 9s ease-in-out infinite alternate}
.openingSceneForeground{object-fit:cover;z-index:2}
@keyframes openingSceneDrift{from{transform:scale(1.025) translateY(0)}to{transform:scale(1.065) translateY(-.7%)}}

.phone.loading-active{background:#62c8ff !important}
#loading:after{
  display:none
}
@keyframes openingGlow{to{opacity:.68;transform:scale(1.08)}}
.loadingLogo{
  position:absolute;z-index:4;left:50%;top:3.2%;width:66%;height:auto;transform:translateX(-50%);
  filter:drop-shadow(0 10px 8px rgba(82,40,12,.28));animation:loadingLogoDrop .75s cubic-bezier(.2,1.25,.35,1) both
}
@keyframes loadingLogoDrop{from{opacity:0;transform:translate(-50%,-22px) scale(.82)}to{opacity:1;transform:translate(-50%,0) scale(1)}}
.floating_fruits{top:28% !important;width:86% !important;height:37% !important;gap:-4px 3px !important;z-index:4 !important}
.floating_fruit{max-width:190px !important;max-height:180px !important;filter:drop-shadow(0 11px 8px rgba(72,37,10,.28))}
.floating_fruit.floatA{animation:floatingFruitReveal .7s .02s cubic-bezier(.2,1.25,.35,1) both,candyBobA 2.7s .8s ease-in-out infinite !important}
.floating_fruit.floatB{animation:floatingFruitReveal .7s .12s cubic-bezier(.2,1.25,.35,1) both,candyBobB 3.1s .9s ease-in-out infinite !important}
.floating_fruit.floatC{animation:floatingFruitReveal .7s .22s cubic-bezier(.2,1.25,.35,1) both,candyBobC 2.5s 1s ease-in-out infinite !important}
.floating_fruit.floatD{animation:floatingFruitReveal .7s .32s cubic-bezier(.2,1.25,.35,1) both,candyBobD 3s 1.1s ease-in-out infinite !important}
@keyframes floatingFruitReveal{from{opacity:0;transform:translateY(26px) scale(.64) rotate(-7deg)}to{opacity:1;transform:translateY(0) scale(1) rotate(0)}}
.loadingLower{bottom:1.5% !important;width:92% !important;height:28% !important;gap:1px !important;z-index:5 !important}
.loadingBarFrame{height:50px !important;flex-basis:50px !important;filter:drop-shadow(0 5px 5px rgba(89,43,12,.24))}
#loadingBarImg{display:none !important}
.loadingProgress{
  width:92%;height:38px;padding:5px;border-radius:22px;background:linear-gradient(180deg,#fff9df,#edc18d);
  border:3px solid rgba(255,255,255,.96);box-shadow:inset 0 2px 4px rgba(112,56,22,.24),0 3px 0 #b8672d;overflow:hidden
}
#loadingProgressFill{
  display:block;position:relative;width:10%;height:100%;border-radius:15px;overflow:hidden;
  background:linear-gradient(180deg,#fff76b 0%,#ffc51f 42%,#ff9618 100%);box-shadow:inset 0 2px 2px rgba(255,255,255,.75),0 0 10px rgba(255,222,54,.72);
  transition:width .18s ease
}
#loadingProgressFill:after{
  content:"";position:absolute;inset:2px auto 2px -28%;width:28%;transform:skewX(-18deg);
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.88),transparent);animation:progressShine .9s linear infinite
}
@keyframes progressShine{to{left:118%}}
.loadingTextFrame{height:29px !important;flex-basis:29px !important}
.loadingTextLabel{
  display:flex;align-items:baseline;justify-content:center;color:#fff8e9;font-size:clamp(16px,5vw,21px);font-weight:1000;
  line-height:1;letter-spacing:0;-webkit-text-stroke:1.4px #6b260e;text-shadow:0 2px 0 #6b260e,0 4px 7px rgba(85,38,10,.34)
}
.loadingDots{display:inline-flex;align-items:flex-end;gap:3px;margin-left:5px;-webkit-text-stroke:0}
.loadingDots i{width:5px;height:5px;border-radius:50%;background:#fff8e9;box-shadow:0 2px 0 #6b260e;animation:loadingDotBounce 1.05s ease-in-out infinite}
.loadingDots i:nth-child(2){animation-delay:.14s}.loadingDots i:nth-child(3){animation-delay:.28s}
@keyframes loadingDotBounce{0%,55%,100%{transform:translateY(0);opacity:.55}28%{transform:translateY(-5px);opacity:1}}
.loadingTipFrame{height:78px !important;flex-basis:78px !important;filter:drop-shadow(0 5px 6px rgba(89,43,12,.20))}
.loadingFadeOut{animation:loadingFadeOut .42s ease forwards}
@keyframes loadingFadeOut{to{opacity:0;transform:scale(1.035)}}

#home{padding:max(10px,env(safe-area-inset-top)) 10px max(14px,env(safe-area-inset-bottom));gap:2px;overflow:hidden}
#home.active{animation:homeReveal .52s ease both}
@keyframes homeReveal{from{opacity:0;transform:scale(1.04)}to{opacity:1;transform:scale(1)}}
.homeResources{justify-content:center;gap:4px;z-index:5}
.homeResources .resourcePill{min-width:0;flex:1;max-width:112px;height:34px;padding:0 6px;border-width:2px}
.homeResources .resourceIcon{width:24px;height:24px}
.homeLogo{width:70%;margin-top:2px;z-index:4;filter:drop-shadow(0 10px 8px rgba(82,40,12,.28));animation:homeLogoFloat 4s ease-in-out infinite}
@keyframes homeLogoFloat{50%{transform:translateY(-4px) rotate(.3deg)}}
.homeHero{z-index:3;width:100%;padding:0;background:none;border:0;box-shadow:none;border-radius:0;justify-content:flex-start;overflow:visible}
.homeSpark{width:88%;right:-18%;top:-7%;opacity:.75;animation:sparklePulse 2s ease-in-out infinite}
@keyframes sparklePulse{50%{opacity:.32;transform:scale(1.08) rotate(3deg)}}
.candyShowcase{
  width:88%;height:min(42vh,330px);min-height:0;margin:-7px auto -5px;display:grid;
  grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;gap:0;place-items:center
}
.candyShowcase img{width:clamp(138px,46vw,185px) !important;height:clamp(138px,46vw,185px) !important;max-width:none;max-height:none;object-fit:contain;margin:-10%;filter:drop-shadow(0 12px 9px rgba(63,40,32,.28));animation:homeCandyFloat 3.1s ease-in-out infinite}
.candyShowcase img:nth-child(2){width:clamp(138px,46vw,185px) !important;transform:none;animation-delay:.3s}
.candyShowcase img:nth-child(3){width:clamp(138px,46vw,185px) !important;animation-delay:.6s}
.candyShowcase img:nth-child(4){animation-delay:.9s}
@keyframes homeCandyFloat{0%,100%{translate:0 0;rotate:-.5deg}50%{translate:0 -7px;rotate:1.2deg}}
.homeTag{display:none}
#playBtn{width:94%;position:relative;z-index:5;animation:playBreath 2.2s ease-in-out infinite}
.playAsset{width:100%;max-height:112px;filter:drop-shadow(0 9px 7px rgba(25,96,15,.38))}
@keyframes playBreath{50%{transform:scale(1.035);filter:brightness(1.07) drop-shadow(0 0 10px rgba(255,247,101,.72))}}
#playBtn:active{animation:none;transform:scale(.92)}
.homeSettingsBtn{width:58%;position:relative;z-index:5;margin-top:-3px}
.homeSettingsAsset{width:100%;max-height:72px;object-fit:contain;filter:drop-shadow(0 6px 5px rgba(94,48,18,.25))}
@media(max-height:680px){
  .homeLogo{width:62%}.candyShowcase{height:min(38vh,250px)}.loadingLogo{width:58%}
  .floating_fruits{top:27% !important;height:35% !important}.loadingLower{height:27% !important}
}
@media(max-width:699px){
  body{display:block;background:#5bc6ff}
  .phone{width:100vw;height:100svh;aspect-ratio:auto;border-radius:0;box-shadow:none}
}

/* v0.6.8.1 MENU PRESENTATION */
#home.active .homeResources{animation:menuHudIn .55s .08s cubic-bezier(.2,1.2,.35,1) both}
#home.active .homeLogo{animation:menuLogoIn .7s .16s cubic-bezier(.2,1.22,.35,1) both,homeLogoFloat 4s 1s ease-in-out infinite}
#home.active .candyShowcase{animation:menuCandyClusterIn .72s .32s cubic-bezier(.2,1.18,.35,1) both}
#home.active #playBtn{animation:menuPlayIn .65s .48s cubic-bezier(.2,1.2,.35,1) both,playBreath 2.2s 1.25s ease-in-out infinite}
#home.active .homeSettingsBtn{animation:menuSettingsIn .55s .62s cubic-bezier(.2,1.1,.35,1) both}
@keyframes menuHudIn{from{opacity:0;transform:translateY(-24px)}to{opacity:1;transform:translateY(0)}}
@keyframes menuLogoIn{from{opacity:0;transform:translateY(-18px) scale(.78)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes menuCandyClusterIn{from{opacity:0;transform:scale(.72) translateY(28px)}to{opacity:1;transform:scale(1) translateY(0)}}
@keyframes menuPlayIn{from{opacity:0;transform:translateY(34px) scale(.82)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes menuSettingsIn{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:translateY(0)}}
.homeResources{padding:1px 2px 2px}
.homeResources .resourcePill{
  position:relative;height:38px;max-width:116px;border-radius:20px;border:2px solid #ffd26f;
  background:linear-gradient(180deg,#9b5031 0%,#71301f 54%,#552316 100%);
  box-shadow:inset 0 2px 0 rgba(255,255,255,.32),inset 0 -2px 0 rgba(65,20,8,.34),0 4px 8px rgba(66,27,14,.28);
  overflow:hidden;font-size:14px;text-shadow:0 2px 0 rgba(66,24,10,.52)
}
.homeResources .resourcePill:after{
  content:"";position:absolute;left:7%;right:7%;top:2px;height:33%;border-radius:50%;
  background:linear-gradient(180deg,rgba(255,255,255,.30),transparent);pointer-events:none
}
.homeResources .resourceIcon{width:27px;height:27px;filter:drop-shadow(0 2px 2px rgba(55,18,8,.45))}
.homeLogo{width:69%;margin-top:1px}
.homeHero:before{
  content:"";position:absolute;z-index:-1;left:4%;right:4%;top:1%;height:64%;pointer-events:none;
  background:radial-gradient(ellipse,rgba(255,248,150,.58),rgba(255,232,93,.16) 44%,transparent 72%);
  animation:menuGlow 2.8s ease-in-out infinite alternate
}
@keyframes menuGlow{to{opacity:.64;transform:scale(1.05)}}
.candyShowcase{position:relative;width:92%;margin:-9px auto -9px}
.candyShowcase img:nth-child(1){transform:rotate(-7deg) translate(5px,5px)}
.candyShowcase img:nth-child(2){transform:rotate(6deg) translate(-5px,-2px)}
.candyShowcase img:nth-child(3){transform:rotate(-5deg) translate(7px,-6px)}
.candyShowcase img:nth-child(4){transform:rotate(7deg) translate(-6px,-4px)}
.menuTwinkles{position:absolute;z-index:4;inset:19% 5% 29%;pointer-events:none}
.menuTwinkles i{position:absolute;width:11px;height:11px;background:#fff8a8;transform:rotate(45deg);filter:drop-shadow(0 0 5px #fff04f);animation:menuTwinkle 1.8s ease-in-out infinite}
.menuTwinkles i:after{content:"";position:absolute;inset:4px -5px;background:#fff8a8}
.menuTwinkles i:nth-child(1){left:8%;top:30%}.menuTwinkles i:nth-child(2){right:7%;top:15%;animation-delay:.55s}.menuTwinkles i:nth-child(3){left:48%;bottom:5%;animation-delay:1.05s}
@keyframes menuTwinkle{0%,100%{opacity:0;scale:.45}42%{opacity:1;scale:1.05}70%{opacity:0;scale:1.35}}
#playBtn{width:92%}
.homeSettingsBtn{width:55%}
@media(max-height:680px){
  .homeResources .resourcePill{height:33px}.homeResources .resourceIcon{width:23px;height:23px}
  .candyShowcase{margin:-12px auto -12px}.menuTwinkles{inset:18% 6% 28%}
}

/* v0.6.8.2 LIVELY LOADING CANDIES */
.floating_fruit_slot{
  position:relative;width:100%;height:100%;display:grid;place-items:center;opacity:0;
  transform:translateY(30px) scale(.62);transform-origin:center;isolation:isolate
}
.floating_fruit_slot:after{
  content:"";position:absolute;z-index:-1;width:82%;height:62%;border-radius:50%;pointer-events:none;
  background:radial-gradient(ellipse,rgba(255,247,130,.70),rgba(255,213,74,.24) 45%,transparent 72%);
  animation:floatingFruitGlow 1.7s ease-in-out infinite alternate
}
.floating_fruit_slot.ready{animation:floatingFruitSlotIn .86s cubic-bezier(.22,1,.36,1) forwards}
.floating_fruit_slot:nth-child(2).ready{animation-delay:.10s}.floating_fruit_slot:nth-child(3).ready{animation-delay:.20s}.floating_fruit_slot:nth-child(4).ready{animation-delay:.30s}
@keyframes floatingFruitSlotIn{0%{opacity:0;transform:translateY(24px) scale(.72)}72%{opacity:1;transform:translateY(-2px) scale(1.025)}100%{opacity:1;transform:translateY(0) scale(1)}}
@keyframes floatingFruitGlow{to{opacity:.52;transform:scale(1.13)}}
.floating_fruit.floatA{animation:floatingFruitA 3.6s .86s cubic-bezier(.45,0,.55,1) infinite !important}
.floating_fruit.floatB{animation:floatingFruitB 3.9s .96s cubic-bezier(.45,0,.55,1) infinite !important}
.floating_fruit.floatC{animation:floatingFruitC 3.75s 1.06s cubic-bezier(.45,0,.55,1) infinite !important}
.floating_fruit.floatD{animation:floatingFruitD 4.05s 1.16s cubic-bezier(.45,0,.55,1) infinite !important}
@keyframes floatingFruitA{0%,100%{transform:translate(0,1px) rotate(-4deg) scale(1);filter:brightness(1) drop-shadow(0 11px 8px rgba(72,37,10,.28))}50%{transform:translate(-2px,-7px) rotate(-2.8deg) scale(1.018);filter:brightness(1.045) drop-shadow(0 14px 10px rgba(72,37,10,.30))}}
@keyframes floatingFruitB{0%,100%{transform:translate(0,0) rotate(4deg) scale(1);filter:brightness(1) drop-shadow(0 11px 8px rgba(72,37,10,.28))}50%{transform:translate(2px,-7px) rotate(2.8deg) scale(1.018);filter:brightness(1.04) drop-shadow(0 14px 10px rgba(72,37,10,.30))}}
@keyframes floatingFruitC{0%,100%{transform:translate(1px,1px) rotate(-3.5deg) scale(1);filter:brightness(1) drop-shadow(0 11px 8px rgba(72,37,10,.28))}50%{transform:translate(2px,-8px) rotate(-2.3deg) scale(1.02);filter:brightness(1.045) drop-shadow(0 14px 10px rgba(72,37,10,.30))}}
@keyframes floatingFruitD{0%,100%{transform:translate(-1px,0) rotate(4.5deg) scale(1);filter:brightness(1) drop-shadow(0 11px 8px rgba(72,37,10,.28))}50%{transform:translate(-2px,-7px) rotate(3.2deg) scale(1.018);filter:brightness(1.04) drop-shadow(0 14px 10px rgba(72,37,10,.30))}}

/* v0.6.8.4 ILLUSTRATED RESOURCE HEADER */
.homeResources{
  display:grid;grid-template-columns:minmax(0,.86fr) minmax(0,1.24fr);align-items:center;
  width:min(100%,390px);gap:7px;padding:2px 4px 4px
}
.resourceCounter{
  position:relative;height:54px;min-width:0;display:flex;align-items:center;
  filter:drop-shadow(0 4px 4px rgba(78,30,10,.28));isolation:isolate
}
.resourceCounterBar{position:absolute;z-index:0;left:22px;right:18px;top:8px;width:calc(100% - 40px);height:39px;object-fit:fill}
.resourceCounterIcon{position:relative;z-index:2;width:51px;height:51px;flex:0 0 51px;object-fit:contain;filter:drop-shadow(0 2px 2px rgba(80,23,6,.34));animation:resourceIconFloat 3.8s ease-in-out infinite}
.resourceCounter.coinCounter .resourceCounterIcon{width:49px;height:49px;flex-basis:49px;animation-delay:.42s}
.assetDigits{
  position:relative;z-index:2;flex:1;min-width:0;height:29px;margin:0 1px 0 -1px;
  display:flex;align-items:center;justify-content:center;overflow:visible;
  color:#fff;font-family:Arial,Helvetica,sans-serif;font-size:25px;font-weight:900;line-height:1;letter-spacing:0;
  white-space:nowrap;text-shadow:0 2px 0 rgba(82,30,8,.68),0 2px 4px rgba(55,20,5,.35)
}
.assetDigit{display:block;height:25px;width:auto;object-fit:contain;filter:drop-shadow(0 2px 0 rgba(82,30,8,.56))}
.assetDigit.digit-1{margin-inline:-2px}.assetDigit.digit-comma{height:18px;align-self:flex-end;margin:0 -2px 3px -3px}
.resourceAdd{
  position:relative;z-index:3;width:42px;height:42px;flex:0 0 42px;margin-left:-5px;padding:0;border:0;background:transparent;
  cursor:pointer;filter:drop-shadow(0 2px 2px rgba(31,76,5,.38));transition:transform .16s ease,filter .16s ease
}
.resourceAdd img{display:block;width:100%;height:100%;object-fit:contain;animation:resourceAddGlow 2.8s ease-in-out infinite}
.resourceAdd:hover{filter:brightness(1.07) drop-shadow(0 3px 3px rgba(31,76,5,.42))}.resourceAdd:active{transform:scale(.9)}
@keyframes resourceIconFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-1.5px)}}
@keyframes resourceAddGlow{0%,100%{filter:brightness(1)}50%{filter:brightness(1.08)}}
.resourceMini{gap:5px}.resourceMini .resourceCounter{height:42px}.resourceMini .resourceCounterBar{left:18px;right:14px;top:6px;height:31px;width:calc(100% - 32px)}
.resourceMini .resourceCounterIcon{width:39px;height:39px;flex-basis:39px}.resourceMini .assetDigits{height:24px}.resourceMini .assetDigit{height:20px}.resourceMini .assetDigit.digit-comma{height:14px;margin-bottom:3px}
.resourceMini .resourceAdd{width:34px;height:34px;flex-basis:34px;margin-left:-5px}.resourceMini .resourceCounter{width:112px}.resourceMini .coinCounter{width:142px}
@media(max-width:370px){
  .homeResources{gap:3px;padding-inline:0}.resourceCounter{height:49px}.resourceCounterIcon{width:47px;height:47px;flex-basis:47px}.resourceCounter.coinCounter .resourceCounterIcon{width:45px;height:45px;flex-basis:45px}
  .resourceCounterBar{left:20px;right:17px;top:7px;height:35px}.resourceAdd{width:38px;height:38px;flex-basis:38px}.assetDigit{height:23px}
}
@media(max-height:680px){.homeResources{padding-top:0}.resourceCounter{height:47px}.resourceCounterIcon{width:45px;height:45px;flex-basis:45px}.resourceCounter.coinCounter .resourceCounterIcon{width:43px;height:43px;flex-basis:43px}.resourceAdd{width:37px;height:37px;flex-basis:37px}.resourceCounterBar{top:7px;height:34px}.assetDigit{height:22px}}

/* v0.6.10.0 MAP ASSET OVERHAUL */
#map{
  position:absolute;inset:0;padding:0;gap:0;overflow:hidden;background:#38b8f2
}
.mapTop{position:absolute;z-index:12;left:8px;right:8px;top:max(7px,env(safe-area-inset-top));display:grid;grid-template-columns:minmax(112px,140px) minmax(0,1fr);gap:5px;align-items:center;pointer-events:none}
.mapTop button,.mapTop .resourceCounter{pointer-events:auto}
.mapLogo{display:none!important}
.mapHeaderNav{position:relative;height:44px;display:grid;place-items:center}.mapHeaderNav>img{display:block;width:100%;height:44px;object-fit:fill;filter:drop-shadow(0 3px 3px rgba(103,47,9,.3))}
.mapHeaderArrow{position:absolute;top:50%;width:34px;height:34px;padding:0;border:0;background:transparent;cursor:pointer;transform:translateY(-50%);filter:drop-shadow(0 2px 2px rgba(22,85,13,.4));animation:mapHeaderArrowBob 1.15s ease-in-out infinite}
.mapHeaderArrow span{position:absolute;inset:0;display:block;background-image:url('ui/map/map-arrows.png');background-size:1000% 200%;background-position:0 0;background-repeat:no-repeat;animation:mapArrowFrames .72s steps(9,end) infinite}
.mapHeaderUp{left:5px}.mapHeaderDown{right:5px}.mapHeaderDown span{background-position-y:100%}
.mapHeaderArrow:active:not(:disabled){scale:.9}.mapHeaderArrow:disabled{opacity:.3;filter:grayscale(.5);cursor:default;animation-play-state:paused}.mapHeaderArrow:disabled span{animation-play-state:paused}
@keyframes mapArrowFrames{from{background-position-x:0}to{background-position-x:100%}}
@keyframes mapHeaderArrowBob{0%,100%{margin-top:-2px}50%{margin-top:2px}}
.mapTop .resourceMini{display:grid;grid-template-columns:minmax(72px,.82fr) minmax(92px,1.18fr);gap:2px;min-width:0}
.mapTop .resourceMini .resourceCounter{width:auto;min-width:0;height:38px}.mapTop .resourceMini .resourceCounterBar{left:15px;right:11px;top:5px;width:calc(100% - 26px);height:29px}
.mapTop .resourceMini .resourceCounterIcon{width:36px;height:36px;flex-basis:36px}.mapTop .resourceMini .coinCounter .resourceCounterIcon{width:35px;height:35px;flex-basis:35px}
.mapTop .resourceMini .resourceAdd{width:31px;height:31px;flex-basis:31px;margin-left:-6px}.mapTop .resourceMini .assetDigits{height:22px;margin-left:-4px;gap:0}
.mapTop .resourceMini .assetDigit{height:18px}.mapTop .resourceMini .assetDigit.digit-comma{height:12px;margin-inline:-3px}
.mapArea{position:absolute;inset:0;overflow:hidden;border:0;border-radius:0;padding:0;box-shadow:none}
.mapArea:before{content:"";position:absolute;inset:52px 0 0;z-index:3;pointer-events:none;background:linear-gradient(90deg,rgba(255,255,255,.08),transparent 24% 76%,rgba(255,255,255,.06))}
.mapTitle{display:none!important}
.pathArt{display:none}
.levelList{position:absolute;display:block;left:50%;top:50%;width:100%;height:auto;aspect-ratio:941/1672;min-height:0;padding:0;margin:0;transform:translate(-50%,-50%);background-position:center;background-size:100% 100%;background-repeat:no-repeat}
.levelRow{position:absolute;left:var(--map-x);top:var(--map-y);width:11.8%;aspect-ratio:1;min-height:0;display:block;transform:translate(-50%,-50%);z-index:2}
.map-position-1{--map-x:50.2%;--map-y:90.1%}.map-position-2{--map-x:70.2%;--map-y:77.5%}.map-position-3{--map-x:46.1%;--map-y:67.4%}
.map-position-4{--map-x:65.9%;--map-y:58.5%}.map-position-5{--map-x:44.2%;--map-y:48.8%}.map-position-6{--map-x:66.2%;--map-y:40.8%}
.map-position-7{--map-x:55.7%;--map-y:32.9%}.map-position-8{--map-x:75.3%;--map-y:25.3%}.map-position-9{--map-x:58.1%;--map-y:18.5%}.map-position-10{--map-x:68%;--map-y:12.1%}
.levelRow .levelNode{position:absolute;inset:0}
.levelNode{
  width:100%;height:100%;padding:0;border:0;border-radius:0;background:none!important;box-shadow:none!important;
  position:relative;display:grid;place-items:center;overflow:visible;isolation:isolate
}
.levelNode:active:not(:disabled){transform:scale(.94)}.levelNode.locked{filter:none!important;opacity:.94}
.levelNodeBase{position:absolute;z-index:0;inset:-8%;width:116%;height:116%;object-fit:contain;pointer-events:none;filter:drop-shadow(0 5px 4px rgba(79,41,14,.24))}
.levelNode.locked .levelNodeBase{inset:-2%;width:104%;height:104%;filter:drop-shadow(0 4px 4px rgba(53,52,61,.24))}
.levelNodeBase.suppliedNode{inset:-8%;width:116%;height:116%}
.mapLevelDigits{position:absolute;z-index:2;display:flex;align-items:center;justify-content:center;gap:1px;left:50%;top:16%;height:48%;transform:translateX(-50%);pointer-events:none}
.mapLevelDigit{display:block;width:auto;height:100%;object-fit:contain;filter:drop-shadow(0 2px 0 rgba(105,35,8,.72))}
.mapLevelDigits.two{top:20%;height:40%;gap:0}.mapLevelDigits.three{top:23%;height:33%;gap:0}
.levelNode.current:before{inset:-12px;z-index:-1;border:0;background:radial-gradient(circle,rgba(255,251,155,.95) 0 28%,rgba(255,208,34,.48) 40%,transparent 72%);box-shadow:0 0 17px rgba(255,224,52,.72);animation:activePulseV62 1.8s ease-in-out infinite}
.nodeStars,.objectiveBadge{display:none!important}
@media(max-aspect-ratio:941/1672){.levelList{width:auto;height:100%}}
@media(max-width:350px){
  .mapTop{grid-template-columns:108px minmax(0,1fr);gap:3px}.mapHeaderNav{height:40px}.mapHeaderNav>img{height:40px}.mapHeaderArrow{width:30px;height:30px}
  .mapTop .resourceMini .resourceCounter{height:35px}.mapTop .resourceMini .resourceCounterIcon{width:33px;height:33px;flex-basis:33px}.mapTop .resourceMini .coinCounter .resourceCounterIcon{width:32px;height:32px;flex-basis:32px}.mapTop .resourceMini .resourceAdd{width:28px;height:28px;flex-basis:28px}.mapTop .resourceMini .assetDigit{height:16px}
}

/* Keep both BIND implementations static; this override follows legacy duplicates. */
.energyTendril{
  stroke-width:3;
  stroke-dasharray:none;
  filter:none;
  animation:none;
  opacity:.82;
}
.energyTendril.core{
  stroke-width:5;
  opacity:.2;
  animation:none;
}

/* v0.6.15.16 RESOURCE COUNTER TEXT */
.resourceMini .assetDigits{font-size:20px}
.mapTop .resourceMini .assetDigits{font-size:18px}
.gameResources .assetDigits{font-size:21px}
@media(max-width:370px){.assetDigits{font-size:23px}}
@media(max-height:680px){.assetDigits{font-size:22px}}
@media(max-width:350px){
  .mapTop .resourceMini .assetDigits{font-size:16px}
  .gameResources .assetDigits{font-size:18px}
}

/* v0.6.11.3 MAP LAYOUT EDITOR */
.mapEditor{display:none;position:fixed;z-index:30;left:50%;right:auto;bottom:max(8px,env(safe-area-inset-bottom));width:min(389px,calc(100vw - 16px));transform:translateX(-50%);padding:9px;background:rgba(40,20,15,.92);border:2px solid #ffc84a;border-radius:8px;color:#fff;font:700 12px/1.2 Arial,sans-serif;box-shadow:0 5px 18px rgba(0,0,0,.4)}
.mapEditor.show{display:block}.mapEditorHead,.mapEditorReadout,.mapEditorActions,.mapEditorNudge{display:flex;align-items:center;gap:6px}.mapEditorHead{justify-content:space-between;margin-bottom:5px;color:#ffe276}.mapEditorHead strong{font-size:14px;cursor:move;touch-action:none;user-select:none;flex:1}.mapEditorHead strong span{margin-left:5px;padding:2px 4px;border:1px solid rgba(255,255,255,.45);border-radius:3px;font-size:8px;color:#fff}.mapEditor button{min-height:30px;padding:5px 8px;border:1px solid #fff2a8;border-radius:5px;background:#f29a16;color:#371600;font-weight:900;cursor:pointer}.mapEditorReadout{justify-content:space-between;padding:5px 7px;background:rgba(255,255,255,.13);border-radius:4px}.mapEditorHelp{margin:5px 0;color:#fff1cf;font-size:10px;font-weight:600}.mapEditorNudge{justify-content:center}.mapEditorNudge button{width:37px;padding:0;font-size:20px}.mapEditorActions{margin-top:6px;flex-wrap:wrap}.mapEditorActions button{flex:1 1 22%;font-size:10px}.mapEditorActions .mapEditorSave{background:#58c72f;color:#102e08;border-color:#d9ffab}.mapEditorStatus{min-height:12px;margin-top:5px;color:#ffe276;font-size:9px;text-align:center}.mapEditing .levelRow{z-index:14;touch-action:none;cursor:grab}.mapEditing .levelRow:active{cursor:grabbing}.mapEditing .levelNode{pointer-events:none}.mapEditing .levelRow.editorSelected:after{content:"";position:absolute;inset:-13%;border:2px dashed #ff3b30;border-radius:50%;animation:editorSelectPulse 1s ease-in-out infinite;pointer-events:none}.mapEditing .mapArea:after{content:"EDIT MODE";position:absolute;z-index:13;top:58px;left:50%;transform:translateX(-50%);padding:4px 8px;border-radius:4px;background:rgba(40,20,15,.78);color:#ffe276;font:900 11px Arial,sans-serif;pointer-events:none}@keyframes editorSelectPulse{50%{transform:scale(1.08);opacity:.7}}
@media(max-height:700px){.mapEditor{padding:6px}.mapEditorHelp,.mapEditorStatus{display:none}.mapEditor button{min-height:27px}.mapEditorActions{margin-top:4px}}
.mapEditorRestore{display:none;position:fixed;z-index:31;right:8px;top:58px;padding:6px 8px;border:2px solid #fff2a8;border-radius:5px;background:#58c72f;color:#102e08;font:900 9px Arial,sans-serif;box-shadow:0 3px 8px rgba(0,0,0,.35)}.mapEditorRestore.show{display:block}
.adminPinGate{position:fixed;z-index:10000;inset:0;display:grid;place-items:center;padding:20px;background:rgba(25,13,20,.88);backdrop-filter:blur(8px)}
.comboText.cascadeCallout{width:min(88%,390px);padding:0;background:none;border:0;border-radius:0;box-shadow:none;display:grid;place-items:center}
.comboText.cascadeCallout img{display:block;width:100%;height:auto;max-height:145px;object-fit:contain;opacity:.78;filter:drop-shadow(0 5px 5px rgba(76,24,8,.35))}
.comboText.cascadeCallout b{position:absolute;left:50%;top:82%;transform:translate(-50%,-50%);padding:2px 8px;color:#fff;font:900 clamp(17px,5vw,25px)/1 Arial,Helvetica,sans-serif;letter-spacing:0;white-space:nowrap;text-shadow:0 2px 0 #6f210b,0 0 5px rgba(0,0,0,.75)}
.comboText.specialComboCallout{z-index:52}
.adminPinGate.unlocked{display:none}
.adminPinCard{width:min(300px,100%);padding:22px 20px 20px;border:3px solid #ffd65d;border-radius:8px;background:linear-gradient(180deg,#fff6d7,#ffc86c);box-shadow:0 15px 40px rgba(0,0,0,.45);color:#67270f;text-align:center}
.adminPinCard strong,.adminPinCard label{display:block}.adminPinCard strong{font-size:22px}.adminPinCard label{margin:10px 0 6px;font-size:12px;font-weight:800}
.adminPinCard input{width:100%;height:48px;border:2px solid #d98627;border-radius:6px;background:#fffdf5;color:#5a210d;font:900 25px/1 Arial,sans-serif;text-align:center;letter-spacing:8px;outline:none}.adminPinCard input:focus{border-color:#58b72e;box-shadow:0 0 0 3px rgba(88,183,46,.2)}
.adminPinCard button{width:100%;height:43px;margin-top:10px;border:2px solid #fff;border-radius:6px;background:#50c92c;color:#143d08;font-size:14px;font-weight:1000;box-shadow:0 3px 0 #268714;cursor:pointer}.adminPinCard button:active{transform:translateY(2px);box-shadow:0 1px 0 #268714}
.adminPinCard small{display:block;min-height:15px;margin-top:7px;color:#b01818;font-weight:900}.adminPinGate.adminPinError .adminPinCard{animation:adminPinShake .25s linear}@keyframes adminPinShake{25%{transform:translateX(-5px)}75%{transform:translateX(5px)}}

/* v0.6.14.0 GAMEPLAY HUD */
#game{
  padding:max(18px,env(safe-area-inset-top)) 6px max(5px,env(safe-area-inset-bottom));
  gap:4px;background:url('scene/tropical_market_bg.png') center/cover no-repeat;
  grid-template-rows:58px auto minmax(0,1fr) 82px 50px;
  grid-template-columns:minmax(0,1fr)
}
#game.active{display:grid}
.gameResources{display:grid;grid-template-columns:40px minmax(0,.82fr) minmax(0,1.18fr);gap:3px;align-items:center;padding-top:10px;z-index:3}
.gameResources .gameBack{width:40px;height:40px}
.gameResources .resourceCounter{width:auto;height:44px;min-width:0}
.gameResources .resourceCounterBar{left:17px;right:12px;top:6px;width:calc(100% - 29px);height:33px}
.gameResources .resourceCounterIcon{width:42px;height:42px;flex-basis:42px}
.gameResources .coinCounter .resourceCounterIcon{width:41px;height:41px;flex-basis:41px}
.gameResources .resourceAdd{width:35px;height:35px;flex-basis:35px;margin-left:-7px}
.gameResources .assetDigits{height:24px;margin-left:-5px;gap:0}
.gameResources .assetDigit{height:21px}
.gameResources .assetDigit.digit-comma{height:14px;margin-inline:-3px;margin-bottom:3px}
.gameHudPanel{position:relative;width:100%;aspect-ratio:3.72/1;min-height:0;filter:drop-shadow(0 6px 7px rgba(91,48,25,.22));z-index:2}
.gameHudPanelAsset{position:absolute;inset:0;width:100%;height:100%;object-fit:fill;pointer-events:none}
.gameHudContent{position:absolute;inset:7% 5% 8%;display:grid;grid-template-rows:42% 22% 36%;min-width:0}
.gameHudTop{display:grid;grid-template-columns:minmax(0,1fr) 25% 25%;gap:2%;align-items:center}
.gameHudTop .levelInfo{height:100%;display:flex;align-items:center;padding:0 4% 0 7%;min-width:0;overflow:hidden}
.gameHudTop .levelInfo strong{display:flex;align-items:baseline;gap:.18em;max-width:100%;font-size:clamp(15.6px,4.08vw,19.2px);line-height:1;font-weight:900;color:#71351f;letter-spacing:0;white-space:nowrap;text-shadow:none}
.gameHudTop .levelInfo .levelLabel{font:inherit;color:inherit}
.gameHudTop .levelInfo #levelNo{font:inherit;color:inherit}
.gameHudContent.bossHudMode .gameHudTop .levelInfo{visibility:hidden}
.gameHudTop .statBox{height:100%;padding:0;border:0;border-radius:0;background:none;box-shadow:none}
.gameHudTop .statBox.score{transform:translate(28%,12%)}
.gameHudTop .statBox.moves{transform:translate(18%,12%)}
.gameHudTop .statBox small{font-size:9px}.gameHudTop .statBox b{font-size:clamp(18px,5vw,24px)}
.objectiveHeadline{display:flex;align-items:center;padding-left:2%;font-size:clamp(5.5px,1.7vw,8px);line-height:1;font-weight:400;color:#71351f;overflow:hidden;white-space:nowrap;transform:translateY(-6px)}
.objectiveTargets{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));align-items:stretch;gap:0;min-width:0}
.objectiveTargets.bossHealthMode{display:block;position:relative;overflow:visible;z-index:8}
.bossHealthBar{position:absolute;left:-3%;top:clamp(-48px,-11.5vw,-34px);width:106%;aspect-ratio:1968/512;pointer-events:none}
.bossHealthBar>img{position:absolute;inset:0;width:100%;height:100%;object-fit:fill;z-index:2}
.bossHealthFill{position:absolute;left:34.1%;top:51%;width:61.5%;height:24%;border-radius:999px;background:linear-gradient(#ff7681 0%,#f31e36 48%,#b60419 100%);box-shadow:inset 0 2px 2px #fff9,inset 0 -2px 2px #79000c99,0 0 6px #ff243ddd;transform-origin:left center;z-index:3;transition:transform .34s ease}
.bossHealthValue{position:absolute;left:55%;top:48%;width:35%;height:26%;display:flex;align-items:center;justify-content:center;color:#fff8d7;font-size:clamp(12px,3.4vw,17px);font-weight:1000;line-height:1;text-shadow:0 2px 2px #59120d,-1px 0 #59120d,1px 0 #59120d,0 0 4px #ffdf7c;z-index:4}
.objectiveTarget{min-width:0;display:flex;align-items:center;justify-content:center;gap:3%;padding:1% 4%;border:0;background:none;transform:translateY(-3px)}
.objectiveTarget img{width:auto;height:88%;max-width:49%;object-fit:contain;filter:drop-shadow(0 2px 2px rgba(74,46,24,.18))}
.objectiveSprite{display:block;flex:0 0 auto;width:min(49%,42px);height:88%;background-repeat:no-repeat;background-size:500% 100%;background-position:0 0;filter:drop-shadow(0 2px 2px rgba(74,46,24,.18))}
.objectiveSprite-crate{background-image:url('ui/objectives/objective_crate.png')}
.objectiveSprite-jelly{background-image:url('ui/objectives/objective_jelly.png');background-size:100% 100%}
.objectiveSprite-chain{background-image:url('ui/objectives/objective_lock.png')}
.objectiveTarget.objective-collect{transform:translateY(-3px) scale(1.1);transform-origin:center}
.objectiveTarget.objective-collect img{height:52.8%;max-width:29.4%}
.objectiveTarget.objective-collect b{font-size:clamp(12px,3.6vw,18px)}
.objectiveTarget.objective-delivery img{height:44%;max-width:24.5%}
.objectiveTarget span{display:flex;flex-direction:column;min-width:0;color:#71351f}.objectiveTarget small{font-size:7px;font-weight:800;line-height:1}.objectiveTarget b{font-size:clamp(10px,3vw,15px);line-height:1.1;white-space:nowrap}
.objectiveTarget.complete{filter:saturate(.72);opacity:.72}.objectiveTarget.complete:after{content:'✓';color:#3d9e21;font-weight:1000}

.modalTextButton.mapResultButton{
  width:122px;
  min-width:122px;
  aspect-ratio:512/171;
  margin-top:3px;
  padding:0;
  border:0;
  border-radius:0;
  background:transparent url('ui/gameplay/map_result_button.png') center/contain no-repeat;
  box-shadow:none;
  color:transparent;
  font-size:0;
}
.modalTextButton.mapResultButton:active{transform:translateY(2px);box-shadow:none}
.resultStars{
  width:160px;
  height:80px;
  max-height:none;
  background:transparent url('ui/gameplay/result_star_01234.png') 0 center/400% auto no-repeat;
}
.briefCard{width:92%;max-width:430px;container-type:inline-size}
.briefCard .panelArt{aspect-ratio:3/2;object-fit:contain}
@font-face{font-family:'PinoyCandyComplete';src:url('ui/fonts/PinoyCandyComplete.woff2?v=0.6.15.0-complete-font') format('woff2');font-display:swap}
@font-face{font-family:'Almendra';src:url('ui/fonts/Almendra-Bold.ttf?v=0.6.15.0') format('truetype');font-style:normal;font-weight:700;font-display:swap}
@font-face{font-family:'Fondamento';src:url('ui/fonts/Fondamento-Regular.ttf?v=0.6.15.0') format('truetype');font-style:normal;font-weight:400;font-display:swap}
.briefLevelTitle{position:absolute;z-index:2;left:50%;top:22.42%;height:auto;display:block;transform:translate(-50%,-50%);font-family:'PinoyCandyComplete',sans-serif;font-size:clamp(27px,10.42cqw,35px);line-height:1;letter-spacing:-.115em;white-space:nowrap;pointer-events:none}
.briefLevelTitle.isThreeDigit{font-size:clamp(25px,9.4cqw,32px)}
.briefContent{top:34%;bottom:auto;height:72%;justify-content:flex-start;gap:4px}
.briefGoals{margin-top:0;white-space:pre-line;text-align:left;line-height:1.25;padding-left:12%;transform:translateY(5px)}
#briefObjective{font-family:'Fondamento',Georgia,serif;font-weight:700}
.briefContent #beginLevel{position:absolute;left:0;right:0;top:55.45%;margin:0}
.briefPlay{width:70%;margin:0}
.briefContent #briefClose{position:absolute;left:50%;top:116.4%;margin:0;transform:translateX(-50%)}
.briefContent #briefClose:active{transform:translate(-50%,2px)}
.resultCard{width:96%;max-width:560px;container-type:inline-size}
.resultCard .resultBoard{width:100%;aspect-ratio:3/2;object-fit:contain}
.resultStats{position:absolute;inset:0;z-index:3;pointer-events:none}
.resultValue{position:absolute;left:67.4%;width:20.6%;transform:translateY(-50%);color:#79270f;font-family:'Almendra',"Trebuchet MS",serif;font-size:clamp(16px,5.3cqw,27px);font-weight:700;line-height:1;text-align:center;white-space:nowrap;text-shadow:0 1px 0 rgba(255,244,211,.8)}
.resultScore{top:50.4%}.resultBestScore{top:60.1%}.resultRank{top:69.4%}
.resultCard .resultButtons{position:absolute;z-index:6;left:15%;right:7%;bottom:6.5%;display:flex;width:auto;gap:2%;margin:0;align-items:center;justify-content:center}
.resultCard .resultButtons .assetButton{display:block;flex:1 1 0;min-width:0;margin:0;padding:0}
.resultCard .resultButtons .assetButton img{display:block;width:100%;height:auto;max-width:none;object-fit:contain}
.resultCard .resultButtons .assetButton:active{transform:translateY(2px) scale(.98)}
.objectiveSummary,.legacyProgress{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
#game .boardShell{height:100%;width:auto;max-width:100%;min-height:0;aspect-ratio:1;justify-self:center;align-self:center;padding:7px;border-radius:20px;border-width:2px;background:linear-gradient(145deg,#fff7e7,#e6c5ae);box-shadow:0 7px 13px rgba(73,47,35,.24),inset 0 0 0 2px rgba(190,137,104,.34)}
#game .boardShell:before{inset:5px;border-radius:15px;background:#f2e2d6;box-shadow:inset 0 2px 6px rgba(111,72,52,.12)}
#game #board{border-radius:12px}
#game .cellBase{padding:1px}#game .cellBase:before{inset:1px;border-radius:8px;background:linear-gradient(145deg,#fff8ef,#ead6c9);border:1px solid rgba(193,154,132,.24)}
#game .piece img{width:108%;height:108%;filter:drop-shadow(0 2px 2px rgba(55,42,29,.16))}
#game .boosterDock{position:relative;height:82px;padding:5px 7% 3px;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:1%;align-items:center;border:0;border-radius:0;background:none;box-shadow:none;overflow:visible}
.boosterDockAsset{position:absolute;inset:0;width:100%;height:100%;object-fit:fill;z-index:0;pointer-events:none;filter:drop-shadow(0 5px 4px rgba(91,48,25,.24))}
#game .booster{z-index:1;width:100%;height:70px}
#game .booster img{width:100%;height:100%;filter:drop-shadow(0 3px 3px rgba(50,54,71,.18))}
.wrappedBoosterIcon{position:relative;display:block;width:100%;height:100%;animation:wrappedBoosterPulse 1.8s ease-in-out infinite}
#game .booster .wrappedBoosterFruit{position:absolute;left:7%;top:7%;width:86%;height:86%;object-fit:contain;z-index:3;opacity:1;transition:opacity .12s ease,transform .12s ease;filter:drop-shadow(0 2px 3px rgba(24,52,105,.28))}
#game .booster .wrappedBoosterFruit.changing{opacity:0;transform:scale(.92)}
#game .booster .wrappedBoosterFrame{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;z-index:2;filter:drop-shadow(0 3px 3px rgba(50,54,71,.18))}
@keyframes wrappedBoosterPulse{0%,100%{filter:brightness(1)}50%{filter:brightness(1.12) drop-shadow(0 0 4px rgba(105,218,255,.72))}}
@media (prefers-reduced-motion:reduce){.wrappedBoosterIcon{animation:none}}
#game .countBadge{right:0;bottom:1px;min-width:23px;height:23px;font-size:11px}
#game .settingsBooster .countBadge{display:none}
.futureAd{width:320px;max-width:100%;height:50px;justify-self:center;align-self:end;display:grid;grid-template-columns:40px auto;grid-template-rows:1fr 1fr;column-gap:8px;align-items:center;padding:5px 14px;border:2px dashed #aab6c2;border-radius:8px;background:rgba(246,249,252,.94);color:#7b8b9d;box-shadow:0 3px 8px rgba(54,75,91,.12);letter-spacing:0}
.futureAdIcon{grid-row:1/3;width:31px;height:25px;border:3px solid #8293a5;border-radius:5px;position:relative}.futureAdIcon:before{content:'';position:absolute;left:5px;right:5px;bottom:4px;height:10px;background:linear-gradient(135deg,transparent 35%,#8293a5 36% 58%,transparent 59%),linear-gradient(45deg,transparent 38%,#8293a5 39% 62%,transparent 63%)}
.futureAd strong{align-self:end;font-size:12px;line-height:1}.futureAd small{align-self:start;font-size:7px;font-weight:900;line-height:1.2}
@media(max-width:350px){
  #game{grid-template-rows:54px auto minmax(0,1fr) 72px 45px;padding-inline:4px;gap:3px}
  .gameResources{grid-template-columns:36px minmax(0,.82fr) minmax(0,1.18fr)}.gameResources .gameBack{width:36px;height:36px}
  .gameResources .resourceCounter{height:40px}.gameResources .resourceCounterIcon{width:38px;height:38px;flex-basis:38px}.gameResources .coinCounter .resourceCounterIcon{width:37px;height:37px;flex-basis:37px}.gameResources .resourceAdd{width:31px;height:31px;flex-basis:31px}.gameResources .assetDigit{height:18px}
  #game .boosterDock{height:72px}#game .booster{height:61px}.futureAd{height:45px;width:288px}
}
/* v0.6.15.72 story conversations and placement editor */
.storyOverlay{z-index:180;background:#06192366;backdrop-filter:blur(5px) saturate(.88)}
.storyOverlay{padding:0;overflow:hidden}
.storyScene{--portrait-scale:1;position:relative;width:min(100vw,calc(100vh * .5626667));height:min(100vh,calc(100vw * 1.7772512));overflow:hidden;background:transparent;color:#fff;isolation:isolate;container-type:inline-size}
.storyBackdrop{position:absolute;inset:0;background:linear-gradient(180deg,#07202b14 45%,#03151d40 72%,#000b);z-index:-2;pointer-events:none}
.storySkip,.storyNext{border:0;padding:0;background:none;filter:drop-shadow(0 4px 5px #42230a80);cursor:pointer}
.storySkip{position:absolute;right:1.7%;top:3%;width:27%;z-index:7}
.storySkip img,.storyNext img{display:block;width:100%;height:auto}
.storySkip:active,.storyNext:active{transform:translateY(2px) scale(.98)}
.storyPortraitFrame{position:absolute;left:0;top:15%;width:66%;aspect-ratio:1/1;overflow:hidden;transform:scale(var(--portrait-scale));transform-origin:center bottom;filter:drop-shadow(0 10px 10px #1b180f80);z-index:1}
.storyPortrait{position:absolute;top:0;width:500%;height:100%;max-width:none;object-fit:fill;visibility:hidden}
.storyPortrait.is-active{visibility:visible}
.storyScene[data-portrait-side="right"] .storyPortraitFrame{transform:scaleX(-1) scale(var(--portrait-scale))}
.storyDialogue{position:absolute;left:3.5%;top:67.5%;width:93%;aspect-ratio:1079/664;padding:0;background:none;color:#51220d;border:0;box-shadow:none;z-index:3;container-type:inline-size}
.storyDialogueArt{position:absolute;inset:0;width:100%;height:100%;object-fit:fill;filter:drop-shadow(0 5px 6px #42230a66);z-index:-1}
.storyNameGroup{position:absolute;left:4.4%;top:65.6%;width:52.1%;aspect-ratio:714/228;z-index:4;container-type:inline-size}
.storyNameArt{position:absolute;inset:0;width:100%;height:100%;object-fit:fill;filter:drop-shadow(0 4px 4px #42230a55);z-index:1}
.storySpeakerRow{position:absolute;left:32%;right:6%;top:29%;height:58%;display:flex;align-items:center;justify-content:flex-start;overflow:hidden;z-index:2}
.storySpeakerRow strong{display:block;max-width:100%;overflow:hidden;color:#fffaf0;text-align:left;white-space:nowrap;text-shadow:0 2px 0 #542508,0 3px 3px #291000;font:900 10.5cqw/1 Arial,sans-serif;letter-spacing:0}
.storyDialogue p{position:absolute;left:9%;right:9%;top:32%;height:32%;margin:0;overflow:hidden;color:#52230f;text-align:left;text-wrap:pretty;overflow-wrap:break-word;hyphens:auto;text-shadow:0 1px 0 #fff9df;font:800 4.4cqw/1.25 Arial,sans-serif;letter-spacing:0}
.storyDialogue p[data-length="medium"]{font-size:4cqw}
.storyDialogue p[data-length="long"]{font-size:3.55cqw;line-height:1.2}
.storyProgress{position:absolute;left:9%;bottom:10%;color:#6a3519;font:900 3.05cqw/1 Arial,sans-serif}
.storyNext{position:absolute;left:55%;top:88%;width:40%;z-index:5}
.deliveryTarget{position:absolute;width:12.5%;height:12.5%;pointer-events:none;background-color:transparent;background-repeat:no-repeat;background-position:center;background-size:contain;z-index:4;filter:drop-shadow(0 2px 3px #43230a88)}
.deliveryTarget.delivered{opacity:.35;filter:saturate(.55)}
.piece.deliveryPiece{z-index:7;pointer-events:none}
#board.pixiBoard .piece.deliveryPiece{opacity:1!important}
.piece img.deliveryBasketSprite{display:block;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 5px 4px #2f1a0b80);transform:scale(.88);transform-origin:center bottom}
.piece.deliveryPiece.delivering .deliveryBasketSprite{transform:scale(1.05);opacity:.25;transition:transform .34s ease,opacity .34s ease}
.objectiveSprite-delivery{background-image:url('ui/objectives/delivery_baskets.png');background-size:400% 100%;background-position:0 50%}

/* v0.6.15.104 Level 10 Biraddali boss */
#board{--board-cols:8;--board-rows:8;background-size:calc(100% / var(--board-cols)) calc(100% / var(--board-rows))}
#board .piece,#board .cellBase,#board .jellyBlock,#board .crateBlock,#board .chainBlock,#board .crateFlash,#board .deliveryTarget{
  width:calc(100% / var(--board-cols));height:calc(100% / var(--board-rows));
}
#board.bossBoard.pixiBoard .piece{opacity:1!important;visibility:visible!important}
#board.bossBoard .pixiBoardCanvas{display:none!important}
.biraddaliBoss{position:absolute;left:33.3333%;top:33.3333%;width:33.3333%;height:33.3333%;z-index:18;pointer-events:none;display:grid;place-items:center;overflow:visible;filter:drop-shadow(0 3px 5px #30123d88)}
.biraddaliBoss img{position:relative;z-index:2;width:92%;height:92%;object-fit:contain;animation:biraddaliHover 2.2s ease-in-out infinite}
.biraddaliSprite{position:absolute;left:4%;top:4%;z-index:2;width:92%;height:92%;background-repeat:no-repeat;background-size:500% 500%;background-position:0 0;filter:drop-shadow(0 3px 4px #30123d99);opacity:0;transition:opacity .18s ease-in-out;will-change:opacity,background-position}
.biraddaliSprite.active{opacity:1}
.biraddaliShield{position:absolute;left:-17%;top:-17%;width:134%;height:134%;z-index:1;pointer-events:none;background:url('assets/boss/biraddali_shield_stages.png?v=0.6.15.150-biraddali-shield-defeat') 0 0/600% 100% no-repeat;filter:drop-shadow(0 0 7px #c05cffbb) drop-shadow(0 0 5px #ffd98988);transform-origin:center;animation:biraddaliShieldIdle 2.2s ease-in-out infinite}
.biraddaliBoss.shield-stage-4 .biraddaliShield{filter:brightness(1.12) drop-shadow(0 0 11px #f05dff) drop-shadow(0 0 8px #fff0aa)}
.biraddaliBoss.shield-stage-5 .biraddaliShield{animation:none;filter:brightness(1.2) drop-shadow(0 0 12px #f05dff) drop-shadow(0 0 9px #fff0aa)}
.biraddaliBoss.shield-stage-change .biraddaliShield{animation:biraddaliShieldStagePulse .72s ease-out both}
.biraddaliBoss.shield-impact .biraddaliShield{animation:biraddaliShieldHit .48s ease-out}
.biraddaliBoss.boss-defeated .biraddaliShield{animation:none;opacity:0;transition:opacity 7.2s ease-in-out}
.biraddaliBoss.boss-defeated .biraddaliSprite{animation:none!important}
body.bossLite #board.bossBoard .piece img,
body.bossLite #board.bossBoard .biraddaliBoss,
body.bossLite #board.bossBoard .biraddaliSprite,
body.bossLite #board.bossBoard .biraddaliChainHandShadow,
body.bossLite #board.bossBoard .biraddaliChainHandLinks,
body.bossLite #board.bossBoard .biraddaliHealFx{filter:none}
body.bossLite #board.bossBoard .piece.frozenRainbow .frozenRainbowShell{animation:none}
body.bossLite #board.bossBoard .biraddaliShield{filter:none!important}
.bossSkillActive{cursor:wait}
.biraddaliSkillShade{position:absolute;inset:0;z-index:16;pointer-events:auto;background:rgba(37,12,63,.3);animation:biraddaliShade 6.2s ease both}
.biraddaliChainHands{position:absolute;inset:0;width:100%;height:100%;z-index:26;overflow:visible;pointer-events:none;animation:biraddaliChainReach 1.4s ease-out both;transition:opacity .76s ease,transform .76s ease;transform-origin:center}
.biraddaliChainHands.retracting{opacity:0;transform:scale(.35)}
.biraddaliChainHandShadow,.biraddaliChainHandLinks{fill:none;stroke-linecap:round;stroke-linejoin:round}
.biraddaliChainHandShadow{stroke:#22042f;stroke-width:9;stroke-dasharray:5 7;filter:drop-shadow(0 0 6px #7413a6)}
.biraddaliChainHandLinks{stroke:#bc43f2;stroke-width:5;stroke-dasharray:5 7;filter:drop-shadow(0 0 3px #ffd4ff) drop-shadow(0 0 7px #9b25ce);animation:biraddaliChainHandCrawl .72s linear infinite}
.piece.transmutationTarget{z-index:25;animation:biraddaliTargetPulse 2.5s ease-in-out both}
.piece.transmutationTarget::before{content:"";position:absolute;inset:2%;z-index:0;border:2px solid #e190ff;border-radius:18%;background:rgba(144,35,199,.58);box-shadow:inset 0 0 12px #f3c9ff,0 0 10px #a52cdb;animation:biraddaliTileWarning 2.5s ease-in-out both}
.piece.transmutationTarget img{position:relative;z-index:1;filter:brightness(1.18) drop-shadow(0 0 5px #fff) drop-shadow(0 0 8px #e74dff)}
#board.bossBoard.pixiBoard .piece.transmutationSourceHidden{opacity:0!important;visibility:hidden!important}
.piece.transmutationGhost{z-index:27!important;pointer-events:none!important;transition:none!important;animation:none!important;filter:drop-shadow(0 0 6px #fff) drop-shadow(0 0 12px #c33fff)}
#board.bossBoard.pixiBoard .piece.transmutationGhost.awaitingPickup{opacity:0!important;visibility:hidden!important}
.piece.transmutationGhost.chainHeldFruit::after{content:"";position:absolute;inset:7%;z-index:9;border:4px dashed #be46f4;border-radius:50%;box-shadow:0 0 5px #fff,0 0 11px #8e20c3;animation:biraddaliChainGrip .84s linear infinite}
@keyframes biraddaliShade{0%,100%{opacity:0}18%,78%{opacity:1}}
@keyframes biraddaliChainReach{from{opacity:0;transform:scale(.72)}to{opacity:1;transform:scale(1)}}
@keyframes biraddaliChainHandCrawl{to{stroke-dashoffset:-24}}
@keyframes biraddaliChainGrip{to{transform:rotate(180deg)}}
@keyframes biraddaliTargetPulse{0%{transform:scale(1)}36%{transform:scale(1.18) translateY(-5%)}68%{transform:scale(1.12) translateY(-8%)}100%{transform:scale(1)}}
@keyframes biraddaliTileWarning{0%{opacity:0;transform:scale(.75)}25%,75%{opacity:1;transform:scale(1)}50%{background:rgba(195,65,244,.76);box-shadow:inset 0 0 16px #fff,0 0 15px #c641f4}100%{opacity:.88;transform:scale(1)}}
.biraddaliAura{position:absolute;inset:9%;border-radius:50%;background:radial-gradient(circle,#ffffff80 0 18%,#80eaff55 40%,#b018e044 58%,transparent 72%);animation:biraddaliAura 1.8s ease-in-out infinite}
.biraddaliBoss.hit .biraddaliSprite{animation:biraddaliHit .55s ease}
.biraddaliBoss.heal .biraddaliAura{background:radial-gradient(circle,#fff 0 12%,#71ff8bbb 38%,#21a94266 60%,transparent 73%)}
.biraddaliHealFx{position:absolute;left:27%;top:27%;width:46%;height:46%;z-index:29;pointer-events:none;background:url('assets/boss/biraddali_heal_fx.png?v=0.6.15.132-heal-spritesheet') 0 0/500% 400% no-repeat;filter:drop-shadow(0 0 7px #7fffd4) drop-shadow(0 0 12px #b83dff);will-change:background-position}
.bossHealthBar.healing .bossHealthFill{animation:bossHealFill 1.7s ease both}
.bossHealthBar.healing .bossHealthValue{animation:bossHealValue 1.7s ease both}
.bossCallout.healCallout{top:16%;padding:9px 16px;border-width:3px;border-color:#d9ffac;background:#137b52ed;color:#f3ffe8;font-size:clamp(22px,7vw,32px);line-height:1;box-shadow:0 0 8px #fff,0 0 18px #5dff9c,0 4px 9px #173d2c99}
.bossHealthBar.damaged .bossHealthFill{animation:bossDamageFill .58s ease both}
.bossHealthBar.damaged .bossHealthValue{animation:bossDamageValue .58s ease both}
.bossCallout.damageCallout{top:17%;padding:8px 15px;border-width:3px;border-color:#ffd2d2;background:#a80922ed;color:#fff;font-size:clamp(20px,6.4vw,30px);line-height:1;box-shadow:0 0 8px #fff,0 0 18px #ff294b,0 4px 9px #4b071499}
@keyframes bossHealFill{0%,100%{filter:none}22%,72%{background:linear-gradient(#d9ff83,#3ee779 50%,#079a58);filter:brightness(1.5) saturate(1.25);box-shadow:inset 0 2px 2px #fff,0 0 7px #fff,0 0 16px #55ff8f}}
@keyframes bossHealValue{0%,100%{transform:scale(1)}30%,65%{transform:scale(1.16);color:#d8ffae;text-shadow:0 0 5px #fff,0 0 10px #4cff87}}
@keyframes bossDamageFill{0%,100%{filter:none}28%,62%{filter:brightness(2.3) saturate(1.6);box-shadow:inset 0 2px 2px #fff,0 0 9px #fff,0 0 18px #ff263e}}
@keyframes bossDamageValue{0%,100%{transform:scale(1)}34%,65%{transform:scale(1.18);color:#fff;text-shadow:0 0 5px #fff,0 0 11px #ff1837}}
.biraddaliBoss.rage{filter:drop-shadow(0 0 7px #ff315c) drop-shadow(0 5px 8px #30123dcc)}
.biraddaliBoss.rage .biraddaliAura{background:radial-gradient(circle,#fff4b0aa 0 12%,#ff294b88 43%,#8715b777 62%,transparent 74%);animation-duration:1.15s}
.biraddaliCastFx{position:absolute;left:33.3333%;top:33.3333%;width:33.3333%;height:33.3333%;z-index:24;pointer-events:none;background-repeat:no-repeat;background-size:500% 500%;filter:drop-shadow(0 4px 7px #38124a99)}
.biraddaliCastFx.mirror{transform:scaleX(-1)}
@keyframes biraddaliHover{50%{transform:translateY(-4%) scale(1.035)}}
@keyframes biraddaliAura{50%{transform:scale(1.14);opacity:.72}}
@keyframes biraddaliHit{35%{transform:translateX(-7%) rotate(-4deg);filter:brightness(1.8)}}
@keyframes biraddaliShieldIdle{50%{transform:scale(1.025);opacity:.84}}
@keyframes biraddaliShieldHit{0%,100%{transform:scale(1);filter:drop-shadow(0 0 7px #c05cffbb)}24%{transform:scale(.94);filter:brightness(1.9) drop-shadow(0 0 13px #fff) drop-shadow(0 0 20px #d75cff)}62%{transform:scale(1.04);filter:brightness(1.45) drop-shadow(0 0 12px #ffe7a1)}}
@keyframes biraddaliShieldStagePulse{0%{transform:scale(.92);filter:brightness(2.3) drop-shadow(0 0 18px #fff)}55%{transform:scale(1.08);filter:brightness(1.65) drop-shadow(0 0 15px #f0a0ff)}100%{transform:scale(1);filter:brightness(1) drop-shadow(0 0 8px #d05cff)}}
#board.bossBoard .frozenRainbowShell{display:none;position:absolute;inset:-5%;z-index:5;border:0;background:url('assets/boss/frozen_rainbow_shell.png?v=0.6.15.128') center/100% 100% no-repeat;box-shadow:none;clip-path:none;pointer-events:none}
#board.bossBoard .frozenRainbowShell:before,#board.bossBoard .frozenRainbowShell:after{content:none}
#board.bossBoard .piece.frozenRainbow .frozenRainbowShell{display:block;animation:frozenGlow 1.1s ease-in-out infinite alternate}
.piece .frozenPlacementWarning{position:absolute;inset:-24%;z-index:12;pointer-events:none;border:4px solid #dffcff;border-radius:50%;background:radial-gradient(circle,#fff 0 8%,#88edff99 24%,#3caeff66 48%,transparent 70%);box-shadow:0 0 7px #fff,0 0 16px #67e8ff,0 0 24px #6c54ff;animation:frozenPlacementWarning .82s ease-in-out both}
.frozenTargetLine{position:absolute;inset:0;width:100%;height:100%;z-index:28;overflow:visible;pointer-events:none}
.frozenTargetLineGlow,.frozenTargetLineCore{fill:none;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:100;stroke-dashoffset:100;animation:frozenLineTravel .82s cubic-bezier(.18,.7,.25,1) both}
.frozenTargetLineGlow{stroke:#64dfff;stroke-width:12;opacity:.62;filter:drop-shadow(0 0 7px #4acfff) drop-shadow(0 0 13px #765cff)}
.frozenTargetLineCore{stroke:#efffff;stroke-width:4;filter:drop-shadow(0 0 3px #fff)}
.frozenTargetImpact{fill:#eaffffcc;stroke:#72e8ff;stroke-width:4;transform-box:fill-box;transform-origin:center;animation:frozenTargetImpact .82s ease-out both;filter:drop-shadow(0 0 7px #fff) drop-shadow(0 0 15px #58dfff)}
.piece.frozenPlacementTarget>img{animation:frozenPlacementFruit .82s ease-in-out both}
.piece.frozenArriving{animation:frozenArrival .52s ease-out both}
@keyframes frozenPlacementWarning{0%{opacity:0;transform:scale(.35) rotate(0)}25%{opacity:1;transform:scale(.9) rotate(45deg)}65%{opacity:1;transform:scale(1.2) rotate(120deg)}100%{opacity:.2;transform:scale(.72) rotate(180deg)}}
@keyframes frozenLineTravel{0%{stroke-dashoffset:100;opacity:0}15%{opacity:1}72%{stroke-dashoffset:0;opacity:1}100%{stroke-dashoffset:0;opacity:0}}
@keyframes frozenTargetImpact{0%,45%{opacity:0;transform:scale(.2)}68%{opacity:1;transform:scale(1.35)}100%{opacity:0;transform:scale(.72)}}
@keyframes frozenPlacementFruit{0%,100%{filter:none;transform:scale(1)}45%,75%{filter:brightness(1.65) saturate(.7) drop-shadow(0 0 7px #bdf7ff);transform:scale(1.13)}}
@keyframes frozenArrival{0%{filter:brightness(2.2);transform:scale(1.3)}55%{transform:scale(.9)}100%{filter:none;transform:scale(1)}}
.piece.frozenRainbow>img{filter:saturate(.72) brightness(1.12) drop-shadow(0 0 3px #bffaff)}
@keyframes frozenGlow{to{filter:hue-rotate(35deg) brightness(1.18);transform:scale(1.035)}}
.piece.transmuted{z-index:16;animation:transmuteFruit .88s cubic-bezier(.2,.85,.25,1)}
.piece.transmuted::after{content:"";position:absolute;inset:-13%;z-index:8;pointer-events:none;border:3px solid #fff7a8;border-radius:50%;box-shadow:0 0 5px #fff,0 0 12px #58eaff,0 0 19px #d44cff;animation:transmuteRing .88s ease-out forwards}
@keyframes transmuteFruit{0%{filter:brightness(1);transform:scale(1)}28%{filter:hue-rotate(85deg) brightness(2.2) saturate(1.7);transform:scale(.82) rotate(-8deg)}55%{filter:hue-rotate(190deg) brightness(1.75) saturate(1.5);transform:scale(1.22) rotate(5deg)}100%{filter:none;transform:scale(1)}}
@keyframes transmuteRing{0%{opacity:0;transform:scale(.25) rotate(0)}24%{opacity:1}100%{opacity:0;transform:scale(1.55) rotate(150deg)}}
.bossCallout{position:absolute;left:50%;top:21%;translate:-50% -50%;z-index:45;max-width:78%;padding:5px 9px;border:2px solid #fff3a6;border-radius:7px;background:#6a167ee8;color:#fff;font:900 11px/1.05 Arial,sans-serif;text-align:center;text-shadow:0 2px #391040;box-shadow:0 4px 9px #2d0e4677;pointer-events:none;animation:bossCallout .9s ease forwards}
@keyframes bossCallout{0%{opacity:0;transform:scale(.55)}20%,70%{opacity:1;transform:scale(1)}100%{opacity:0;transform:translateY(-18px)}}
.objectiveTarget.objective-boss img{object-fit:contain;transform:scale(1.28)}
@media(min-aspect-ratio:633/1125){.storyScene{height:100vh;width:calc(100vh * .5626667)}}
@media(max-aspect-ratio:633/1125){.storyScene{width:100vw;height:calc(100vw * 1.7772512)}}