@font-face{font-family:arco;src:url('../assets/fonts/arco.ttf') format('truetype');font-display:swap}
:root{--safe-t:env(safe-area-inset-top,0px);--safe-b:env(safe-area-inset-bottom,0px);--safe-l:env(safe-area-inset-left,0px);--safe-r:env(safe-area-inset-right,0px);--stage-w:min(100vw,calc(100dvh * .5625));--pink:#ff61bd;--hot:#ff2f99;--gold:#ffe584;--mint:#54f0b6;--ink:#23142f;--panel:rgba(35,25,48,.76)}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{width:100%;height:100%;margin:0;overflow:hidden;background:#1b1025;color:#fff;font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;overscroll-behavior:none}
button,select{font:inherit}button{cursor:pointer;border:0;touch-action:manipulation}img{display:block;max-width:100%;pointer-events:none;user-drag:none;-webkit-user-drag:none}.app{position:fixed;inset:0;width:100vw;height:100vh;height:100dvh;overflow:hidden;background:radial-gradient(circle at 50% 20%,#4a285f,#1b1025 55%,#0b0710)}
.screen{position:absolute;inset:0;display:none;overflow:hidden;margin:auto;width:var(--stage-w);max-width:100vw;height:100dvh;background:#111}.screen.active{display:block;animation:screenIn .24s ease both}@keyframes screenIn{from{opacity:.55;transform:scale(1.015)}to{opacity:1;transform:none}}
.screen-home{background:linear-gradient(180deg,rgba(26,17,44,.18),rgba(10,5,17,.2)),url('../assets/images/backgrounds/home-bg.webp') center/cover no-repeat}.screen-home::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(0,0,0,.05) 52%,rgba(0,0,0,.26));pointer-events:none}.sky-sparkles{position:absolute;inset:0;background:radial-gradient(circle at 18% 18%,rgba(255,236,135,.95) 0 2px,transparent 3px),radial-gradient(circle at 82% 12%,rgba(255,236,135,.8) 0 2px,transparent 3px),radial-gradient(circle at 65% 42%,rgba(255,255,255,.75) 0 2px,transparent 3px),radial-gradient(circle at 38% 55%,rgba(255,255,255,.7) 0 2px,transparent 3px);animation:twinkle 3s ease-in-out infinite;opacity:.8}.home-top{position:absolute;z-index:5;left:12px;right:12px;top:calc(var(--safe-t) + 10px);display:flex;align-items:center;justify-content:space-between;gap:8px}.brand-badge,.language-select,.coin-pill,.top-title{border:2px solid rgba(255,255,255,.55);background:rgba(35,25,48,.72);color:#fff7ad;border-radius:999px;box-shadow:0 10px 24px rgba(0,0,0,.22);backdrop-filter:blur(6px)}.brand-badge{font-family:arco,system-ui;font-size:18px;padding:8px 14px;text-shadow:0 2px 1px #8c3564}.language-select{min-width:126px;padding:9px 12px;font-weight:900;outline:0}.hero-wrap{position:absolute;z-index:2;left:3%;right:3%;top:11%;height:52%;display:grid;place-items:center}.hero-board{position:absolute;width:min(104%,520px);filter:drop-shadow(0 18px 24px rgba(0,0,0,.35));transform:translateY(3%)}.hero-copy{position:absolute;z-index:2;left:20%;right:8%;top:25%;text-align:center;color:#7a4a25}.hero-copy h1{font-family:arco,system-ui;font-size:clamp(32px,10vw,54px);line-height:.9;margin:0 0 10px;color:#ff71ba;text-shadow:0 4px 0 #fff0a3,0 8px 0 rgba(159,65,89,.36)}.hero-copy p{margin:0 auto;max-width:320px;font-weight:900;font-size:clamp(13px,3.4vw,18px);line-height:1.25;color:#6b4a2a}.hero-friend{position:absolute;z-index:3;filter:drop-shadow(0 10px 12px rgba(0,0,0,.28));animation:floaty 3s ease-in-out infinite}.hero-friend-a{width:min(35vw,170px);left:0;bottom:3%;animation-delay:.1s}.hero-friend-b{width:min(31vw,145px);right:1%;top:7%;animation-delay:1s}.home-actions{position:absolute;z-index:6;left:0;right:0;bottom:max(6vh,54px);display:grid;justify-items:center;gap:10px;padding:0 18px}.big-btn,.tool-btn{border-radius:999px;font-weight:1000;color:#fff;text-shadow:0 2px 2px rgba(0,0,0,.25);box-shadow:0 9px 0 rgba(106,50,26,.48),0 16px 28px rgba(0,0,0,.32);border:3px solid rgba(255,255,255,.86)}.big-btn{min-width:min(78vw,300px);padding:14px 24px;font-size:clamp(17px,5vw,23px)}.big-btn.primary{background:linear-gradient(#ffd875,#ff8f2c)}.big-btn.secondary{background:linear-gradient(#78dbff,#328cf0)}.big-btn.reward{min-width:min(68vw,250px);padding:10px 18px;display:flex;align-items:center;justify-content:center;gap:12px;background:linear-gradient(#ff7cca,#cb3afb)}.big-btn.reward b{background:#fff9af;color:#9b2b71;border-radius:999px;padding:3px 9px;text-shadow:none}.small-link{background:rgba(255,255,255,.86);color:#6b3b1c;border-radius:999px;padding:8px 16px;font-weight:900;border:2px solid rgba(255,255,255,.9)}.big-btn:active,.tool-btn:active,.round-btn:active,.level-btn:active{transform:translateY(3px) scale(.97);box-shadow:0 4px 0 rgba(106,50,26,.45),0 8px 16px rgba(0,0,0,.28)}
.top-bar{position:absolute;z-index:20;left:0;right:0;top:0;padding:calc(var(--safe-t) + 10px) 12px 8px;display:grid;grid-template-columns:50px 1fr auto;gap:8px;align-items:center;pointer-events:none}.top-bar>*{pointer-events:auto}.round-btn{width:48px;height:48px;border-radius:18px;border:3px solid rgba(255,255,255,.82);color:#fff;font-size:34px;line-height:1;font-weight:1000;display:grid;place-items:center;box-shadow:0 7px 0 rgba(0,0,0,.35),0 12px 18px rgba(0,0,0,.3)}.round-btn.green{background:linear-gradient(#31e49a,#00a76f)}.round-btn.blue{background:linear-gradient(#32d3ff,#1682db);font-size:44px;padding-bottom:5px}.top-title{justify-self:center;padding:8px 18px;font-weight:1000;color:#fff9b4}.coin-pill{display:flex;align-items:center;gap:5px;padding:8px 12px;font-weight:1000}.coin-pill span{color:#ffe35d}.screen-map{background:#101015}.map-scroller{position:absolute;inset:0;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;scrollbar-width:none;touch-action:pan-y}.map-scroller::-webkit-scrollbar{display:none}.map-content{position:relative;width:100%;min-height:calc(var(--stage-w) * 2.166);background:#050505}.map-bg{width:100%;height:auto;display:block}.level-layer{position:absolute;inset:0}.level-btn{position:absolute;width:clamp(48px,12vw,62px);height:clamp(48px,12vw,62px);transform:translate(-50%,-50%);border-radius:50%;background:transparent var(--level-open-img,url('../assets/images/ui/level-open.png')) center/contain no-repeat;color:#fff;font-family:arco,system-ui,sans-serif;font-size:clamp(18px,4.6vw,24px);font-weight:1000;text-shadow:0 2px 2px #9c3479;display:grid;place-items:center;filter:drop-shadow(0 6px 2px rgba(0,0,0,.3));transition:filter .15s,transform .15s}.level-btn.locked{background-image:var(--level-locked-img,url('../assets/images/ui/level-locked.png'));color:#fff;filter:grayscale(.2) drop-shadow(0 5px 2px rgba(0,0,0,.35));opacity:.96;text-shadow:0 2px 0 #333,0 0 7px #fff}.level-btn.done::after{content:"✓";position:absolute;right:-3px;top:-5px;width:22px;height:22px;border-radius:50%;background:#33d079;color:white;font-family:system-ui;font-size:16px;line-height:22px;text-align:center;border:2px solid white}.level-stars{position:absolute;bottom:-7px;left:50%;transform:translateX(-50%);font-size:12px;letter-spacing:-2px;color:#ffe66d;text-shadow:0 1px 1px #7a3c00}.level-btn.current{animation:pulse 1.25s ease-in-out infinite}.map-doll{position:absolute;z-index:2;width:18%;max-width:105px;filter:drop-shadow(0 8px 10px rgba(0,0,0,.28));animation:floaty 3.4s ease-in-out infinite}.doll-chef{left:8%;top:22%}.doll-witch{left:3%;top:69%;width:20%;animation-delay:.4s}.doll-farmer{right:5%;top:65%;width:19%;animation-delay:.8s}.doll-mouse{right:7%;top:37%;width:17%;animation-delay:1.2s}.guide-bubble{position:absolute;z-index:30;left:12px;right:12px;bottom:calc(var(--safe-b) + 12px);display:flex;align-items:center;gap:8px;padding:8px 12px;border-radius:22px;background:rgba(255,255,255,.9);color:#624018;box-shadow:0 12px 28px rgba(0,0,0,.28);border:2px solid #fff;transition:transform .25s,opacity .25s}.guide-bubble img{width:54px;height:54px;object-fit:contain}.guide-bubble p{margin:0;font-weight:900;font-size:13px;line-height:1.2}.guide-bubble.hide{opacity:0;transform:translateY(120%)}
.screen-game{background:#111}.game-bg{position:absolute;inset:0;background:linear-gradient(rgba(0,0,0,.06),rgba(0,0,0,.26)),url('../assets/images/backgrounds/game-bg.webp') center/cover no-repeat}.game-header{position:absolute;z-index:5;left:0;right:0;top:0;padding:calc(var(--safe-t) + 8px) 10px 6px;display:grid;grid-template-columns:46px repeat(3,1fr);gap:7px;align-items:center}.stat{height:56px;border-radius:18px;background:rgba(33,31,45,.76);border:2px solid rgba(255,255,255,.58);display:grid;place-items:center;padding:4px 3px;backdrop-filter:blur(6px);box-shadow:0 8px 18px rgba(0,0,0,.24)}.stat span{font-size:11px;font-weight:900;opacity:.92}.stat b{font-size:23px;line-height:1;color:#fff4a6}.goal-card{position:absolute;z-index:4;top:calc(var(--safe-t) + 72px);left:10px;right:10px;display:grid;grid-template-columns:1fr 105px;gap:8px;align-items:center;padding:9px 10px;border-radius:22px;background:rgba(255,255,255,.78);color:#52311d;border:2px solid rgba(255,255,255,.85);box-shadow:0 10px 26px rgba(0,0,0,.24);backdrop-filter:blur(5px)}.goal-left{display:flex;align-items:center;gap:8px;min-width:0}.goal-left img{width:42px;height:42px;object-fit:contain;filter:drop-shadow(0 5px 3px rgba(0,0,0,.25))}.goal-copy{font-weight:1000;font-size:13px;line-height:1.1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.combo-text{font-weight:900;color:#d83d8b;font-size:12px;margin-top:2px}.star-meter{position:relative;height:20px;border-radius:999px;background:rgba(89,49,51,.28);border:2px solid rgba(109,78,48,.18);overflow:hidden}.star-meter i{position:absolute;inset:0 auto 0 0;width:0;background:linear-gradient(90deg,#ff5cbb,#ffe66d,#64f5ff);transition:width .22s ease}.star-meter span{position:absolute;inset:0;display:grid;place-items:center;font-size:12px;color:#fff;text-shadow:0 1px 2px #8b4b16;letter-spacing:3px}.board-wrap{position:absolute;left:0;right:0;top:calc(var(--safe-t) + 132px);bottom:calc(var(--safe-b) + 78px);display:grid;place-items:center;padding:8px}.board{--gap:5px;width:min(92%,calc((100dvh - var(--safe-t) - var(--safe-b) - 220px)),560px);aspect-ratio:1;display:grid;grid-template-columns:repeat(8,1fr);grid-template-rows:repeat(8,1fr);gap:var(--gap);padding:10px;border-radius:28px;background:rgba(30,16,35,.72);border:3px solid rgba(255,242,177,.92);box-shadow:inset 0 0 0 2px rgba(255,255,255,.18),0 20px 45px rgba(0,0,0,.38);backdrop-filter:blur(5px);touch-action:none}.cell{min-width:0;min-height:0;border-radius:14px;background:linear-gradient(145deg,rgba(255,255,255,.28),rgba(30,20,35,.48));box-shadow:inset 0 2px 5px rgba(255,255,255,.18),inset 0 -4px 7px rgba(0,0,0,.24);display:grid;place-items:center;position:relative;overflow:hidden;padding:0;touch-action:none}.cell.blocker{background:linear-gradient(145deg,#a27865,#554044)}.cell::before{content:"";position:absolute;inset:1px;border-radius:inherit;background:radial-gradient(circle at 35% 25%,rgba(255,255,255,.24),transparent 50%);pointer-events:none}.gem{position:relative;z-index:1;width:88%;height:88%;object-fit:contain;filter:drop-shadow(0 7px 5px rgba(0,0,0,.3));transition:transform .13s ease,opacity .13s ease}.cell.selected{outline:3px solid #fff06d;outline-offset:-3px;background:rgba(255,238,104,.28)}.cell.hint{animation:hint .6s ease-in-out 2}.cell.pop .gem{transform:scale(.05) rotate(16deg);opacity:0}.cell.blast{animation:blast .3s ease}.float-layer{position:absolute;inset:0;pointer-events:none;overflow:visible}.floating-score{position:absolute;font-family:arco,system-ui;font-size:22px;color:#fff681;text-shadow:0 3px 0 #d35091,0 4px 8px rgba(0,0,0,.3);animation:scoreUp .8s ease forwards}.spark{position:absolute;width:10px;height:10px;border-radius:50%;background:#fff06b;box-shadow:0 0 10px #fff06b;animation:spark .55s ease-out forwards}.game-footer{position:absolute;z-index:5;left:0;right:0;bottom:0;padding:8px 10px calc(var(--safe-b) + 10px);display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.tool-btn{position:relative;min-height:56px;padding:7px 4px;background:linear-gradient(#fff8c9,#ffb449);color:#704013;text-shadow:none;border-color:#fff}.tool-btn span{display:block;font-size:20px;line-height:1}.tool-btn b{display:block;font-size:12px}.tool-btn em{position:absolute;right:5px;top:-7px;min-width:22px;height:22px;border-radius:50%;background:#ff4aa9;color:#fff;font-style:normal;font-size:12px;line-height:22px;border:2px solid white}.modal{position:absolute;z-index:100;inset:0;display:grid;place-items:center;background:rgba(20,10,30,.58);backdrop-filter:blur(4px);padding:22px}.modal.hidden,.toast.hidden{display:none}.modal-card{position:relative;width:min(90vw,340px);padding:70px 20px 20px;border-radius:30px;background:linear-gradient(#fff6dc,#ffd9a5);color:#5a331d;text-align:center;border:4px solid #fff;box-shadow:0 25px 70px rgba(0,0,0,.45)}.modal-mascot{position:absolute;left:50%;top:0;width:120px;transform:translate(-50%,-58%);filter:drop-shadow(0 12px 10px rgba(0,0,0,.22))}.modal-card h2{margin:0 0 8px;font-family:arco,system-ui;font-size:32px;color:#ff56ad;text-shadow:0 3px 0 #fff}.modal-card p{font-weight:900;margin:6px 0 14px}.modal-stars{font-size:34px;letter-spacing:2px;color:#ffcd30;text-shadow:0 2px 0 #b36d00,0 3px 8px rgba(0,0,0,.15);min-height:40px}.modal-card .big-btn{min-width:100%;margin-top:9px}.toast{position:absolute;z-index:120;left:50%;bottom:calc(var(--safe-b) + 95px);transform:translateX(-50%);max-width:86%;padding:10px 16px;border-radius:999px;background:rgba(35,25,48,.88);border:2px solid rgba(255,255,255,.8);color:#fff9b4;font-weight:1000;box-shadow:0 12px 30px rgba(0,0,0,.35);animation:toastIn .25s ease both}
@keyframes floaty{0%,100%{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(-8px) rotate(1deg)}}@keyframes twinkle{0%,100%{opacity:.55}50%{opacity:1}}@keyframes pulse{0%,100%{transform:translate(-50%,-50%) scale(1)}50%{transform:translate(-50%,-50%) scale(1.13)}}@keyframes hint{0%,100%{transform:scale(1)}50%{transform:scale(1.12);filter:brightness(1.25)}}@keyframes blast{0%{filter:brightness(1)}50%{filter:brightness(1.8)}100%{filter:brightness(1)}}@keyframes scoreUp{0%{opacity:0;transform:translate(-50%,0) scale(.7)}25%{opacity:1}100%{opacity:0;transform:translate(-50%,-52px) scale(1.15)}}@keyframes spark{0%{opacity:1;transform:translate(0,0) scale(1)}100%{opacity:0;transform:translate(var(--dx),var(--dy)) scale(.1)}}@keyframes toastIn{from{opacity:0;transform:translate(-50%,18px)}to{opacity:1;transform:translate(-50%,0)}}
@media (max-height:680px){.hero-wrap{top:8%;height:48%}.home-actions{bottom:max(4vh,40px)}.big-btn{padding:11px 20px}.game-header{grid-template-columns:42px repeat(3,1fr)}.stat{height:48px}.stat b{font-size:20px}.round-btn{width:42px;height:42px}.goal-card{top:calc(var(--safe-t) + 62px);padding:7px}.board-wrap{top:calc(var(--safe-t) + 116px);bottom:calc(var(--safe-b) + 66px)}.board{padding:8px;--gap:4px}.game-footer{padding-bottom:calc(var(--safe-b) + 8px)}.tool-btn{min-height:50px}.guide-bubble{display:none}}
@media (min-width:900px){.screen{box-shadow:0 0 0 1px rgba(255,255,255,.08),0 0 80px rgba(0,0,0,.35)}}

/* v4 interaction/admin refinements */
.home-actions{gap:8px}.admin-link{background:rgba(255,245,176,.9);color:#8b3d1c}.game-header{grid-template-columns:46px repeat(3,1fr) 42px}.sound-btn{width:42px;height:42px;border-radius:16px;border:3px solid rgba(255,255,255,.82);background:linear-gradient(#fff3a5,#ff9e39);box-shadow:0 7px 0 rgba(0,0,0,.35),0 12px 18px rgba(0,0,0,.3);font-size:20px;display:grid;place-items:center}.sound-btn.off{filter:grayscale(.75);opacity:.78}.map-content{min-height:calc(var(--stage-w) * 3.52)}.level-btn{width:clamp(36px,8.9vw,48px);height:clamp(36px,8.9vw,48px);font-size:clamp(13px,3.4vw,20px)}
.admin-panel{position:absolute;z-index:140;inset:0;display:grid;place-items:center;background:rgba(16,8,25,.68);backdrop-filter:blur(5px);padding:16px}.admin-panel.hidden{display:none}.admin-card{position:relative;width:min(94vw,390px);max-height:92dvh;overflow:auto;padding:22px 16px 18px;border-radius:28px;background:linear-gradient(#fff8e9,#ffddaf);color:#563219;border:4px solid #fff;box-shadow:0 25px 75px rgba(0,0,0,.48)}.admin-card h2{margin:0 34px 6px 0;font-family:arco,system-ui;font-size:27px;color:#ff56ad;text-shadow:0 3px 0 #fff}.admin-tip{font-weight:900;font-size:12px;line-height:1.35;margin:0 0 12px;color:#7a4b25}.admin-close{position:absolute;right:12px;top:10px;width:36px;height:36px;border-radius:50%;background:#ff4aa9;color:#fff;font-size:28px;font-weight:1000;border:2px solid #fff;box-shadow:0 5px 0 rgba(112,40,79,.35)}.admin-card label{display:grid;gap:5px;margin:9px 0;font-weight:1000;font-size:12px}.admin-card input,.admin-card textarea{width:100%;border:2px solid rgba(136,78,36,.28);border-radius:14px;background:rgba(255,255,255,.85);padding:10px;color:#4b2a18;outline:0;font-size:13px;user-select:text;-webkit-user-select:text}.admin-card textarea{resize:vertical}.admin-actions{display:grid;gap:9px;margin-top:12px}.admin-actions .big-btn{min-width:100%;font-size:16px;padding:10px 16px}.tool-btn em#hintCost,.tool-btn em#shuffleCost{background:#42c275}
@media (max-height:680px){.game-header{grid-template-columns:42px repeat(3,1fr) 38px}.sound-btn{width:38px;height:38px;border-radius:14px}.admin-card{max-height:96dvh}.level-btn{width:42px;height:42px}}

/* v5 map/admin split */
.home-actions .admin-link{display:none!important}
.level-btn.locked::before{content:"";position:absolute;inset:13%;border-radius:50%;background:rgba(35,35,35,.24);z-index:-1}
.level-btn.milestone{width:clamp(48px,11.6vw,62px);height:clamp(48px,11.6vw,62px);font-size:clamp(17px,4.2vw,25px);background:linear-gradient(#ffd868,#f06f13);border:3px solid #fff3b9;box-shadow:0 5px 0 rgba(114,43,0,.45),0 10px 14px rgba(0,0,0,.28)}
.level-btn.milestone.locked{background:linear-gradient(#c7c7c7,#737373);border-color:#eee;color:#fff;filter:drop-shadow(0 5px 2px rgba(0,0,0,.35))}
.level-btn.milestone::after{content:"🎁";position:absolute;right:-11px;top:-12px;font-size:20px;filter:drop-shadow(0 2px 1px rgba(0,0,0,.35))}
.level-btn.milestone.done::after{content:"✓";right:-3px;top:-5px;font-size:16px}
.cell:nth-child(odd){background-image:var(--tile-1-img,url('../assets/images/ui/tile-1.png'))}.cell:nth-child(even){background-image:var(--tile-2-img,url('../assets/images/ui/tile-2.png'))}

/* v6 user map + stable match view */
#gameScreen.screen.active{animation:none}.screen.active{animation:screenFade .18s ease both}@keyframes screenFade{from{opacity:.75}to{opacity:1}}
.map-content{min-height:calc(var(--stage-w) * 3.0029);background:#090815}.map-bg{width:100%;height:auto;display:block}.level-layer{inset:0 0 0 0}
.level-btn{width:clamp(30px,7.6vw,40px);height:clamp(30px,7.6vw,40px);background:radial-gradient(circle at 34% 25%,#fff8b6 0 20%,#ffb93e 48%,#f26b22 100%)!important;border:2px solid rgba(255,255,255,.96);box-shadow:0 3px 0 rgba(125,60,8,.62),0 7px 10px rgba(0,0,0,.30);color:#fff;font-family:arco,system-ui,sans-serif;font-size:clamp(11px,2.75vw,17px);line-height:1;text-shadow:0 1px 0 #782d00,0 0 5px rgba(0,0,0,.65);-webkit-text-stroke:.35px rgba(70,32,0,.65);filter:none;z-index:5}.level-btn.locked{background:linear-gradient(#d7d7d7,#777)!important;color:#fff;opacity:.98;text-shadow:0 1px 0 #111,0 0 5px #000;-webkit-text-stroke:.35px rgba(0,0,0,.8);filter:none}.level-btn.locked::before{display:none}.level-btn.done::after{right:-7px;top:-8px;width:18px;height:18px;line-height:18px;font-size:12px}.level-stars{bottom:-8px;font-size:9px;letter-spacing:-1px}.level-btn.current{z-index:9}.level-btn.milestone{width:clamp(38px,9.5vw,52px);height:clamp(38px,9.5vw,52px);font-size:clamp(14px,3.45vw,21px)}.level-btn.milestone::after{right:-10px;top:-12px;font-size:17px}.guide-bubble{max-width:calc(var(--stage-w) - 24px);margin:auto}
.board-wrap,.board{transform:none!important;contain:layout paint}.board{will-change:auto;touch-action:none}.cell,.gem{will-change:auto}.cell.pop .gem{transform:scale(.08);opacity:0}.cell.blast{animation:none}.cell.hint{animation:hint .45s ease-in-out 1}@media (max-height:680px){.level-btn{width:34px;height:34px}.level-btn.milestone{width:44px;height:44px}}


/* v7 road-aligned 100-level map + polished level badges */
.map-content{min-height:calc(var(--stage-w) * 3.0476)}
.level-btn{
  width:clamp(32px,8.1vw,44px)!important;
  height:clamp(32px,8.1vw,44px)!important;
  border-radius:50%!important;
  background:
    radial-gradient(circle at 33% 24%, rgba(255,255,255,.98) 0 9%, rgba(255,255,255,.38) 10% 18%, transparent 19%),
    radial-gradient(circle at 58% 67%, #ff7843 0 23%, #ffb739 47%, #ffe66e 73%, #fff6a9 100%)!important;
  border:2.5px solid #fff7c8!important;
  box-shadow:0 3px 0 #9d4a14,0 6px 10px rgba(42,18,5,.36),inset 0 1px 0 rgba(255,255,255,.9),inset 0 -4px 0 rgba(176,63,10,.22)!important;
  color:#fff!important;
  font-family:arco,system-ui,sans-serif!important;
  font-size:clamp(11px,2.85vw,17px)!important;
  line-height:1!important;
  letter-spacing:-.5px;
  text-shadow:0 1px 0 #702600,0 2px 3px rgba(0,0,0,.68),0 0 4px rgba(114,34,0,.45)!important;
  -webkit-text-stroke:.35px rgba(92,38,0,.72);
  outline:2px solid rgba(255,178,60,.34);
  outline-offset:1px;
}
.level-btn::before{content:"";position:absolute;inset:-5px;border-radius:50%;background:conic-gradient(from 20deg,rgba(255,255,255,.92),rgba(255,204,67,.9),rgba(255,125,62,.86),rgba(255,255,255,.9));z-index:-1;filter:drop-shadow(0 2px 2px rgba(0,0,0,.18));}
.level-btn.locked{
  background:
    radial-gradient(circle at 33% 24%, rgba(255,255,255,.75) 0 10%, transparent 20%),
    linear-gradient(145deg,#f1f1f1,#a7a7a7 54%,#636363)!important;
  border-color:#fff!important;
  outline-color:rgba(255,255,255,.34);
  box-shadow:0 3px 0 #555,0 6px 10px rgba(0,0,0,.35),inset 0 1px 0 rgba(255,255,255,.8),inset 0 -4px 0 rgba(0,0,0,.16)!important;
  color:#fff!important;text-shadow:0 1px 0 #111,0 2px 3px rgba(0,0,0,.9)!important;
  -webkit-text-stroke:.35px rgba(0,0,0,.9);
}
.level-btn.locked::before{display:block;background:conic-gradient(from 20deg,#fff,#d7d7d7,#898989,#fff)}
.level-btn.done::after{content:"✓";right:-7px;top:-9px;width:20px;height:20px;border-radius:50%;background:linear-gradient(#78ffba,#17be72);color:white;font-family:system-ui;font-size:13px;font-weight:1000;line-height:20px;text-align:center;border:2px solid white;box-shadow:0 2px 4px rgba(0,0,0,.22)}
.level-btn.milestone{width:clamp(40px,10vw,56px)!important;height:clamp(40px,10vw,56px)!important;background:radial-gradient(circle at 32% 22%,#fff 0 10%,transparent 19%),linear-gradient(145deg,#fff071,#ff9f1f 52%,#e95b25)!important;border-color:#fff8bd!important;}
.level-btn.milestone::after{content:"★";right:-8px;top:-10px;font-size:18px;color:#fff27a;text-shadow:0 2px 2px rgba(72,34,0,.6);background:none;border:0;box-shadow:none;width:auto;height:auto;line-height:1}
.level-btn.milestone.done::after{content:"✓";right:-7px;top:-9px;width:20px;height:20px;line-height:20px;background:linear-gradient(#78ffba,#17be72);border:2px solid #fff;box-shadow:0 2px 4px rgba(0,0,0,.22);color:white;font-size:13px}
.level-stars{bottom:-10px;font-size:10px;letter-spacing:-1px;text-shadow:0 1px 1px #7a3c00,0 0 4px rgba(0,0,0,.45)}
@media(max-width:430px){.level-btn{width:32px!important;height:32px!important;font-size:11px!important}.level-btn.milestone{width:39px!important;height:39px!important}}


/* v8: new route map, no board/window shake, clearer road badges */
.map-content{min-height:calc(var(--stage-w) * 3.0029)!important;background:#090815!important}
.level-btn:active{transform:translate(-50%,-50%) scale(.96)!important;box-shadow:0 3px 0 rgba(125,60,8,.58),0 7px 10px rgba(0,0,0,.25)!important}
.board-wrap,.board,.screen-game{transform:none!important;contain:layout paint;overflow:hidden}
.cell.pop .gem{transform:scale(.10)!important;opacity:0!important}
.cell.blast{animation:none!important}
.level-btn{background:radial-gradient(circle at 32% 24%,#fff7d1 0 13%,#ffe47a 14% 30%,#ff9a2c 55%,#e84a56 100%)!important;border:2px solid #fff8d8!important;box-shadow:0 3px 0 rgba(113,52,12,.62),0 8px 12px rgba(0,0,0,.30),inset 0 2px 4px rgba(255,255,255,.55)!important;color:#fff!important;text-shadow:0 1px 0 #743000,0 0 5px rgba(0,0,0,.72)!important}
.level-btn.locked{background:linear-gradient(145deg,#e5e5e5,#797979)!important;color:#fff!important;text-shadow:0 1px 0 #111,0 0 6px #000!important;opacity:.96!important}
.level-btn.current{outline:3px solid rgba(255,249,155,.95);outline-offset:2px}


/* v9: smaller normal nodes + treasure/crown milestones + speed/stability pass */
.screen-home{background-image:linear-gradient(180deg,rgba(26,17,44,.18),rgba(10,5,17,.2)),url('../assets/images/backgrounds/home-bg.webp')}
.game-bg{background-image:linear-gradient(rgba(0,0,0,.06),rgba(0,0,0,.26)),url('../assets/images/backgrounds/game-bg.webp')}
.map-scroller{overscroll-behavior:contain;scroll-behavior:smooth;contain:strict;will-change:scroll-position}.map-content{min-height:calc(var(--stage-w) * 3.0029)!important;contain:layout paint style}.map-bg{content-visibility:auto;contain-intrinsic-size:682px 2048px}.level-layer{pointer-events:none;contain:layout paint style}.level-btn{pointer-events:auto;width:clamp(25px,6.35vw,34px)!important;height:clamp(25px,6.35vw,34px)!important;font-size:clamp(9px,2.25vw,14px)!important;letter-spacing:-.7px!important;border-width:2px!important;background:radial-gradient(circle at 34% 23%,#fff9dc 0 12%,#ffe884 13% 31%,#ff9c35 57%,#e84b59 100%)!important;box-shadow:0 2px 0 rgba(102,45,10,.66),0 5px 8px rgba(0,0,0,.24),inset 0 1px 3px rgba(255,255,255,.64)!important;outline:1.5px solid rgba(255,232,130,.55)!important;transition:transform .08s ease,filter .08s ease!important;backface-visibility:hidden;transform:translate3d(-50%,-50%,0)}
.level-btn::before{inset:-3px!important;filter:none!important}.level-stars{display:none!important}.level-btn.current{outline:3px solid rgba(255,249,155,.96)!important;outline-offset:2px!important;animation:levelPulse 1.05s ease-in-out infinite!important}.level-btn.done:not(.milestone)::after{right:-5px!important;top:-6px!important;width:15px!important;height:15px!important;line-height:15px!important;font-size:10px!important}.level-btn.locked{background:linear-gradient(145deg,#e8e8e8,#838383)!important;box-shadow:0 2px 0 #5a5a5a,0 5px 8px rgba(0,0,0,.26),inset 0 1px 2px rgba(255,255,255,.75)!important;opacity:.92!important}.level-btn.milestone{width:clamp(39px,9.7vw,52px)!important;height:clamp(39px,9.7vw,52px)!important;font-size:clamp(13px,3.25vw,19px)!important;background:radial-gradient(circle at 30% 19%,#fff 0 9%,transparent 18%),linear-gradient(145deg,#fff17d,#ffae24 52%,#e74d25)!important;border:3px solid #fff5b6!important;box-shadow:0 4px 0 rgba(111,46,0,.62),0 9px 13px rgba(0,0,0,.30),inset 0 2px 4px rgba(255,255,255,.65)!important;z-index:7!important}.level-btn.milestone[data-badge="crown"]{background:radial-gradient(circle at 30% 19%,#fff 0 9%,transparent 18%),linear-gradient(145deg,#fffbb1,#ffd235 48%,#ff7a1e)!important}.milestone-icon{position:absolute;right:-12px;top:-14px;font-size:18px;line-height:1;filter:drop-shadow(0 2px 2px rgba(0,0,0,.36));z-index:3;pointer-events:none}.level-btn.milestone.done::after{right:-6px!important;top:-7px!important;width:17px!important;height:17px!important;line-height:17px!important;font-size:11px!important}.level-btn.milestone.done .milestone-icon{right:-13px;top:22px;font-size:15px}.level-btn:active{transform:translate3d(-50%,-50%,0) scale(.96)!important}.board-wrap,.board,.screen-game{transform:none!important;contain:layout paint!important;will-change:auto!important}.board{touch-action:none;backface-visibility:hidden}.cell,.gem{will-change:transform,opacity}.cell.blast{animation:none!important}.cell.pop .gem{transform:scale(.12)!important;opacity:0!important}@keyframes levelPulse{0%,100%{filter:drop-shadow(0 0 0 rgba(255,242,97,0));transform:translate3d(-50%,-50%,0) scale(1)}50%{filter:drop-shadow(0 0 8px rgba(255,242,97,.85));transform:translate3d(-50%,-50%,0) scale(1.06)}}@media(max-width:430px){.level-btn{width:27px!important;height:27px!important;font-size:9.5px!important}.level-btn.milestone{width:42px!important;height:42px!important;font-size:14px!important}.milestone-icon{font-size:16px;right:-10px;top:-12px}}@media(prefers-reduced-motion:reduce){.screen.active,.sky-sparkles,.level-btn.current,.cell.hint{animation:none!important}.map-scroller{scroll-behavior:auto}}

/* v10: 80-level cleaner route, app-safe map home button, tool cleanup */
.map-top-centered{grid-template-columns:58px 1fr auto!important;padding-top:calc(var(--safe-t) + 12px)!important}.map-top-spacer{width:50px;height:1px;pointer-events:none!important}.home-title-btn{border:2px solid rgba(255,255,255,.64);background:linear-gradient(180deg,rgba(70,45,86,.88),rgba(34,23,51,.88));display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:42px;cursor:pointer;font-family:inherit;line-height:1}.home-title-icon{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(#52f2b3,#0fb977);box-shadow:inset 0 1px 0 rgba(255,255,255,.75),0 2px 5px rgba(0,0,0,.24);font-size:15px}.map-content{min-height:calc(var(--stage-w) * 3.0029)!important}.level-btn{width:clamp(22px,5.45vw,30px)!important;height:clamp(22px,5.45vw,30px)!important;font-size:clamp(8px,2vw,12px)!important;border-radius:50%!important;border:1.8px solid rgba(255,255,255,.96)!important;background:radial-gradient(circle at 35% 24%,#fff 0 12%,#fff7c8 13% 26%,#ffd86c 27% 48%,#ff9d3b 72%,#e9605e 100%)!important;box-shadow:0 1.5px 0 rgba(93,42,12,.55),0 4px 7px rgba(0,0,0,.20),inset 0 1px 2px rgba(255,255,255,.7),inset 0 -2px 4px rgba(179,63,15,.18)!important;outline:none!important;color:#fff!important;text-shadow:0 1px 0 #743000,0 1px 3px rgba(0,0,0,.58)!important;-webkit-text-stroke:.2px rgba(88,42,0,.55);filter:none!important;letter-spacing:-.45px!important}.level-btn::before{display:none!important}.level-btn.locked{background:radial-gradient(circle at 35% 24%,#fff 0 12%,#e5e5e5 14% 38%,#a4a4a4 70%,#737373 100%)!important;color:#fff!important;text-shadow:0 1px 0 #222,0 1px 3px rgba(0,0,0,.82)!important;opacity:.9!important}.level-btn.done:not(.milestone)::after{content:"✓";right:-2px!important;top:-3px!important;width:12px!important;height:12px!important;line-height:12px!important;font-size:8px!important;border:1.5px solid #fff!important;background:linear-gradient(#7dffbf,#13bd72)!important}.level-btn.current{outline:2px solid rgba(255,246,126,.96)!important;outline-offset:2px!important;animation:levelPulseSoft 1.15s ease-in-out infinite!important}.level-btn.milestone{width:clamp(31px,7.6vw,41px)!important;height:clamp(31px,7.6vw,41px)!important;font-size:clamp(11px,2.65vw,16px)!important;border:2.3px solid #fff5c7!important;background:radial-gradient(circle at 32% 20%,#fff 0 10%,transparent 19%),linear-gradient(145deg,#fff49a,#ffbd35 50%,#f07227)!important;box-shadow:0 2.5px 0 rgba(100,42,0,.58),0 6px 9px rgba(0,0,0,.25),inset 0 1px 3px rgba(255,255,255,.68)!important}.level-btn.milestone[data-badge="crown"]{background:radial-gradient(circle at 32% 20%,#fff 0 10%,transparent 19%),linear-gradient(145deg,#fffec4,#ffd847 48%,#ff842a)!important}.milestone-icon{right:-7px!important;top:-9px!important;font-size:13px!important;filter:drop-shadow(0 1px 1px rgba(0,0,0,.3))!important}.level-btn.milestone.done .milestone-icon{right:-8px!important;top:18px!important;font-size:11px!important}.level-btn.milestone.done::after{right:-3px!important;top:-4px!important;width:13px!important;height:13px!important;line-height:13px!important;font-size:8px!important}.tool-btn{min-height:54px}.tool-btn em:empty{display:none}.tool-btn b{margin-top:2px}.board-wrap,.board,.screen-game,.app{transform:none!important}.cell.pop .gem{transform:scale(.10)!important;opacity:0!important}.cell.blast{animation:none!important}@keyframes levelPulseSoft{0%,100%{filter:drop-shadow(0 0 0 rgba(255,242,97,0));transform:translate3d(-50%,-50%,0) scale(1)}50%{filter:drop-shadow(0 0 5px rgba(255,242,97,.75));transform:translate3d(-50%,-50%,0) scale(1.045)}}@media(max-width:430px){.level-btn{width:23px!important;height:23px!important;font-size:8.2px!important}.level-btn.milestone{width:33px!important;height:33px!important;font-size:12px!important}.home-title-btn{min-height:40px;padding:7px 14px}.home-title-icon{width:24px;height:24px;font-size:14px}}


/* v11: user supplied garden-road map + larger accessible level touch targets */
.map-content{min-height:calc(var(--stage-w) * 3.0029)!important;background:#080616!important}
.map-bg{width:100%!important;height:auto!important;display:block!important;object-fit:contain!important}
.level-layer{pointer-events:none!important}
.level-btn{
  pointer-events:auto!important;
  width:clamp(42px,10.2vw,54px)!important;
  height:clamp(42px,10.2vw,54px)!important;
  background:transparent!important;
  border:0!important;
  outline:none!important;
  color:#ffffff!important;
  font-size:clamp(12px,3vw,18px)!important;
  font-weight:1000!important;
  -webkit-text-stroke:.35px rgba(91,42,0,.8)!important;
  text-shadow:0 1px 0 #743000,0 2px 4px rgba(0,0,0,.72)!important;
  filter:drop-shadow(0 6px 8px rgba(0,0,0,.26))!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  line-height:1!important;
  z-index:5!important;
  isolation:isolate!important;
  touch-action:manipulation!important;
}
.level-btn::before{
  content:""!important;
  display:block!important;
  position:absolute!important;
  inset:5px!important;
  z-index:-1!important;
  border-radius:50%!important;
  border:2.5px solid rgba(255,255,255,.98)!important;
  background:radial-gradient(circle at 34% 23%,#fff 0 10%,#fff6bf 12% 25%,#ffd75d 29% 50%,#ff982e 72%,#ee5566 100%)!important;
  box-shadow:0 3px 0 rgba(99,43,7,.58),0 7px 10px rgba(0,0,0,.28),inset 0 2px 3px rgba(255,255,255,.76),inset 0 -3px 5px rgba(150,45,10,.22)!important;
}
.level-btn.locked::before{
  background:radial-gradient(circle at 34% 23%,#fff 0 10%,#ececec 13% 34%,#aaa 68%,#737373 100%)!important;
  border-color:rgba(255,255,255,.9)!important;
  box-shadow:0 3px 0 rgba(82,82,82,.65),0 7px 9px rgba(0,0,0,.28),inset 0 2px 3px rgba(255,255,255,.65)!important;
}
.level-btn.current::before{border-color:#fff59d!important;box-shadow:0 0 0 3px rgba(255,242,72,.35),0 4px 0 rgba(99,43,7,.58),0 0 16px rgba(255,235,74,.86),inset 0 2px 3px rgba(255,255,255,.76)!important}
.level-btn.milestone{width:clamp(50px,12vw,64px)!important;height:clamp(50px,12vw,64px)!important;font-size:clamp(15px,3.5vw,22px)!important;z-index:8!important}
.level-btn.milestone::before{inset:4px!important;border-width:3px!important;background:radial-gradient(circle at 32% 19%,#fff 0 9%,transparent 18%),linear-gradient(145deg,#fff6a3,#ffc236 52%,#f06d24)!important}
.level-btn.milestone[data-badge="crown"]::before{background:radial-gradient(circle at 32% 19%,#fff 0 9%,transparent 18%),linear-gradient(145deg,#fffec4,#ffdc48 48%,#ff8329)!important}
.level-btn.done:not(.milestone)::after{right:2px!important;top:2px!important;width:15px!important;height:15px!important;line-height:15px!important;font-size:10px!important;border:2px solid #fff!important;z-index:4!important}
.level-btn.milestone.done::after{right:3px!important;top:2px!important;width:17px!important;height:17px!important;line-height:17px!important;font-size:11px!important;z-index:4!important}
.milestone-icon{right:1px!important;top:0!important;font-size:16px!important;z-index:4!important}
.level-btn.milestone.done .milestone-icon{right:0!important;top:33px!important;font-size:14px!important}
@media(max-width:430px){
  .level-btn{width:44px!important;height:44px!important;font-size:12px!important}
  .level-btn::before{inset:6px!important}
  .level-btn.milestone{width:52px!important;height:52px!important;font-size:15px!important}
}


/* v12: compact beautiful garden-road level markers + 50 clearer levels */
.map-content{min-height:calc(var(--stage-w) * 3.0029)!important;background:#080616!important}
.level-layer{pointer-events:none!important;contain:layout paint style!important}
.level-btn{
  pointer-events:auto!important;
  width:46px!important;
  height:46px!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
  box-shadow:none!important;
  outline:none!important;
  overflow:visible!important;
  position:absolute!important;
  display:grid!important;
  place-items:center!important;
  transform:translate3d(-50%,-50%,0)!important;
  z-index:5!important;
  touch-action:manipulation!important;
  filter:none!important;
}
.level-btn::before{
  content:""!important;
  position:absolute!important;
  left:50%!important;
  top:50%!important;
  width:19px!important;
  height:19px!important;
  margin:-9.5px 0 0 -9.5px!important;
  border-radius:52% 48% 55% 45%!important;
  border:1.6px solid rgba(255,255,255,.95)!important;
  background:radial-gradient(circle at 32% 24%,#fff 0 14%,#fff0a8 15% 30%,#ffb83d 52%,#ff6f8f 100%)!important;
  box-shadow:0 2px 0 rgba(99,42,6,.52),0 4px 7px rgba(0,0,0,.26),inset 0 1px 2px rgba(255,255,255,.74)!important;
  z-index:0!important;
}
.level-btn::after{
  content:""!important;
  position:absolute!important;
  left:50%!important;
  top:50%!important;
  width:5px!important;
  height:5px!important;
  margin:-8px 0 0 -6px!important;
  border-radius:50%!important;
  background:rgba(255,255,255,.86)!important;
  z-index:1!important;
  box-shadow:none!important;
}
.level-num{
  position:absolute!important;
  left:50%!important;
  top:50%!important;
  transform:translate(-50%,8px)!important;
  min-width:17px!important;
  height:13px!important;
  padding:0 3px!important;
  border-radius:999px!important;
  display:grid!important;
  place-items:center!important;
  background:rgba(42,22,67,.74)!important;
  border:1px solid rgba(255,255,255,.62)!important;
  color:#fff9c9!important;
  font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important;
  font-size:8.5px!important;
  font-weight:900!important;
  line-height:1!important;
  letter-spacing:-.3px!important;
  text-shadow:0 1px 2px rgba(0,0,0,.66)!important;
  z-index:3!important;
  pointer-events:none!important;
}
.level-stars{display:none!important}
.level-btn.locked::before{
  background:radial-gradient(circle at 32% 24%,#fff 0 13%,#e1e1e1 16% 38%,#9a9a9a 70%,#6f6f6f 100%)!important;
  border-color:rgba(255,255,255,.72)!important;
  box-shadow:0 2px 0 rgba(70,70,70,.6),0 4px 7px rgba(0,0,0,.24),inset 0 1px 2px rgba(255,255,255,.55)!important;
}
.level-btn.locked .level-num{background:rgba(54,54,60,.74)!important;color:#f2f2f2!important;border-color:rgba(255,255,255,.45)!important}
.level-btn.done:not(.milestone)::after{
  content:"✓"!important;
  left:auto!important;
  top:9px!important;
  right:9px!important;
  width:12px!important;
  height:12px!important;
  margin:0!important;
  border-radius:50%!important;
  background:linear-gradient(#8dffd0,#16c978)!important;
  color:#fff!important;
  border:1.3px solid #fff!important;
  font-size:8px!important;
  line-height:10px!important;
  text-align:center!important;
  font-weight:1000!important;
  z-index:4!important;
}
.level-btn.current::before{
  width:24px!important;
  height:24px!important;
  margin:-12px 0 0 -12px!important;
  border-color:#fff49b!important;
  box-shadow:0 0 0 3px rgba(255,241,91,.30),0 0 14px rgba(255,230,77,.88),0 2px 0 rgba(99,42,6,.52),inset 0 1px 2px rgba(255,255,255,.74)!important;
  animation:levelPulseV12 1.2s ease-in-out infinite!important;
}
.level-btn.current .level-num{background:rgba(108,54,20,.82)!important;color:#fff7aa!important;transform:translate(-50%,12px)!important}
.level-btn.checkpoint::before{background:radial-gradient(circle at 32% 24%,#fff 0 13%,#d6fff6 16% 32%,#70e9c9 52%,#2fa7ff 100%)!important}
.level-btn.milestone{width:54px!important;height:54px!important;z-index:8!important}
.level-btn.milestone::before{
  width:31px!important;
  height:31px!important;
  margin:-15.5px 0 0 -15.5px!important;
  border-radius:13px 13px 15px 15px!important;
  border:2px solid #fff7bf!important;
  background:radial-gradient(circle at 32% 20%,#fff 0 9%,transparent 18%),linear-gradient(145deg,#fff39a,#ffc13a 50%,#ff7a35 100%)!important;
  box-shadow:0 3px 0 rgba(100,42,0,.55),0 7px 10px rgba(0,0,0,.26),inset 0 1px 3px rgba(255,255,255,.72)!important;
}
.level-btn.milestone::after{display:none!important}
.level-btn.milestone .level-num{
  transform:translate(-50%,18px)!important;
  height:15px!important;
  min-width:22px!important;
  font-size:9.5px!important;
  background:rgba(91,45,16,.82)!important;
  color:#fff8b7!important;
}
.milestone-icon{
  position:absolute!important;
  left:50%!important;
  top:50%!important;
  transform:translate(-50%,-52%)!important;
  right:auto!important;
  font-size:16px!important;
  line-height:1!important;
  z-index:3!important;
  filter:drop-shadow(0 1px 1px rgba(0,0,0,.32))!important;
  pointer-events:none!important;
}
.level-btn.milestone.done::after{
  display:block!important;
  content:"✓"!important;
  left:auto!important;
  top:6px!important;
  right:6px!important;
  width:13px!important;
  height:13px!important;
  margin:0!important;
  border-radius:50%!important;
  background:linear-gradient(#8dffd0,#16c978)!important;
  color:#fff!important;
  border:1.5px solid #fff!important;
  font-size:8px!important;
  line-height:11px!important;
  text-align:center!important;
  z-index:5!important;
}
.level-btn:active{transform:translate3d(-50%,-50%,0) scale(.94)!important}
@keyframes levelPulseV12{0%,100%{filter:drop-shadow(0 0 0 rgba(255,242,97,0));transform:scale(1)}50%{filter:drop-shadow(0 0 8px rgba(255,242,97,.9));transform:scale(1.07)}}
@media(max-width:430px){
  .level-btn{width:42px!important;height:42px!important}
  .level-btn::before{width:17px!important;height:17px!important;margin:-8.5px 0 0 -8.5px!important}
  .level-num{font-size:8px!important;height:12px!important;min-width:16px!important;transform:translate(-50%,7px)!important}
  .level-btn.current::before{width:22px!important;height:22px!important;margin:-11px 0 0 -11px!important}
  .level-btn.milestone{width:50px!important;height:50px!important}
  .level-btn.milestone::before{width:29px!important;height:29px!important;margin:-14.5px 0 0 -14.5px!important}
  .milestone-icon{font-size:15px!important}
}


/* v13: slimmer jewel route markers + top guide bubble */
.screen-map{position:relative;overflow:hidden}
.guide-bubble.guide-bubble-top{
  position:absolute!important;
  z-index:31!important;
  left:50%!important;
  right:auto!important;
  top:calc(var(--safe-t) + 66px)!important;
  bottom:auto!important;
  transform:translateX(-50%);
  width:min(calc(100% - 28px), 420px);
  padding:8px 12px!important;
  gap:10px!important;
  border-radius:18px!important;
  background:rgba(255,255,255,.94)!important;
  box-shadow:0 10px 24px rgba(0,0,0,.20)!important;
  border:2px solid rgba(255,255,255,.95)!important;
  pointer-events:none!important;
}
.guide-bubble.guide-bubble-top img{width:38px!important;height:38px!important;flex:0 0 38px}
.guide-bubble.guide-bubble-top p{font-size:12px!important;line-height:1.25!important}
.guide-bubble.guide-bubble-top.hide{opacity:0;transform:translateX(-50%) translateY(-18px)!important}

.level-layer{pointer-events:none!important;contain:layout paint style!important}
.level-btn{
  pointer-events:auto!important;
  width:44px!important;
  height:44px!important;
  position:absolute!important;
  transform:translate3d(-50%,-50%,0)!important;
  display:grid!important;
  place-items:center!important;
  border:0!important;
  background:transparent!important;
  box-shadow:none!important;
  padding:0!important;
  overflow:visible!important;
  touch-action:manipulation!important;
  isolation:isolate!important;
}
.level-btn::before{
  content:""!important;
  position:absolute!important;
  left:50%!important;
  top:50%!important;
  width:18px!important;
  height:18px!important;
  margin:-9px 0 0 -9px!important;
  border-radius:4px!important;
  transform:rotate(45deg)!important;
  background:linear-gradient(135deg,#fff7fb 5%,#ff7dc8 35%,#ff4e83 68%,#d62961 100%)!important;
  border:2px solid rgba(255,255,255,.94)!important;
  box-shadow:0 2px 0 rgba(106,22,57,.5),0 4px 8px rgba(0,0,0,.24),inset 0 1px 0 rgba(255,255,255,.75)!important;
  z-index:1!important;
}
.level-btn::after{
  content:""!important;
  position:absolute!important;
  left:50%!important;
  top:50%!important;
  width:8px!important;
  height:8px!important;
  margin:-12px 0 0 -2px!important;
  border-radius:50%!important;
  background:rgba(255,255,255,.72)!important;
  filter:blur(.2px)!important;
  z-index:2!important;
}
.level-btn .level-num{
  position:absolute!important;
  left:50%!important;
  top:50%!important;
  transform:translate(-50%,11px)!important;
  min-width:18px!important;
  height:13px!important;
  padding:0 4px!important;
  border-radius:999px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  font-family:system-ui,-apple-system,sans-serif!important;
  font-size:8px!important;
  font-weight:900!important;
  letter-spacing:-.1px!important;
  color:#fffdf4!important;
  background:rgba(83,36,54,.86)!important;
  border:1px solid rgba(255,255,255,.66)!important;
  box-shadow:0 2px 4px rgba(0,0,0,.22)!important;
  z-index:3!important;
}
.level-stars{display:none!important}
.level-btn[data-theme="mint"]::before{background:linear-gradient(135deg,#f0fffd 8%,#8bffe1 34%,#42d7b1 70%,#149a82 100%)!important;box-shadow:0 2px 0 rgba(12,102,85,.46),0 4px 8px rgba(0,0,0,.24),inset 0 1px 0 rgba(255,255,255,.76)!important}
.level-btn[data-theme="violet"]::before{background:linear-gradient(135deg,#fbf7ff 8%,#c794ff 34%,#8d5bff 70%,#5a31d2 100%)!important;box-shadow:0 2px 0 rgba(66,37,135,.46),0 4px 8px rgba(0,0,0,.24),inset 0 1px 0 rgba(255,255,255,.76)!important}
.level-btn[data-theme="amber"]::before{background:linear-gradient(135deg,#fff8e7 8%,#ffd97d 34%,#ffb13f 70%,#e36a1d 100%)!important;box-shadow:0 2px 0 rgba(121,62,17,.46),0 4px 8px rgba(0,0,0,.24),inset 0 1px 0 rgba(255,255,255,.76)!important}
.level-btn[data-theme="checkpoint"]::before{
  width:22px!important;height:22px!important;margin:-11px 0 0 -11px!important;border-radius:50%!important;transform:none!important;
  background:radial-gradient(circle at 32% 28%,#ffffff 0 16%,#d7fff7 18% 32%,#6ee7c5 52%,#28b3ff 100%)!important;
  border-width:2px!important;
  box-shadow:0 2px 0 rgba(29,83,124,.44),0 5px 9px rgba(0,0,0,.24),inset 0 1px 2px rgba(255,255,255,.8)!important;
}
.level-btn[data-theme="treasure"]{
  width:48px!important;height:48px!important;z-index:8!important;
}
.level-btn[data-theme="treasure"]::before{
  width:26px!important;height:26px!important;margin:-13px 0 0 -13px!important;border-radius:50%!important;transform:none!important;
  background:radial-gradient(circle at 34% 26%,#fffef0 0 14%,#ffe07a 18% 34%,#ffb93b 55%,#ff8430 100%)!important;
  border:2px solid #fff7cc!important;
  box-shadow:0 3px 0 rgba(128,71,0,.5),0 7px 10px rgba(0,0,0,.26),inset 0 1px 2px rgba(255,255,255,.82)!important;
}
.level-btn.checkpoint .level-num{background:rgba(20,83,106,.88)!important}
.level-btn.milestone .level-num{background:rgba(116,59,0,.90)!important;color:#fff8de!important;min-width:22px!important;height:14px!important;font-size:8px!important;transform:translate(-50%,13px)!important}
.milestone-icon{
  position:absolute!important;
  right:-1px!important;
  top:-4px!important;
  font-size:13px!important;
  line-height:1!important;
  z-index:4!important;
  filter:drop-shadow(0 1px 2px rgba(0,0,0,.3))!important;
  pointer-events:none!important;
}
.level-btn.locked::before{
  background:linear-gradient(135deg,#fbfbfb 10%,#d7d7d7 35%,#a9a9a9 70%,#818181 100%)!important;
  box-shadow:0 2px 0 rgba(82,82,82,.55),0 4px 8px rgba(0,0,0,.24),inset 0 1px 0 rgba(255,255,255,.74)!important;
}
.level-btn.locked .level-num{background:rgba(66,66,72,.82)!important;color:#f4f4f4!important}
.level-btn.done:not(.milestone)::after,
.level-btn.milestone.done::after{
  content:"✓"!important;
  position:absolute!important;
  right:1px!important;
  top:1px!important;
  width:13px!important;
  height:13px!important;
  line-height:13px!important;
  border-radius:50%!important;
  text-align:center!important;
  font-size:9px!important;
  font-weight:900!important;
  color:#fff!important;
  background:linear-gradient(#8df8bb,#12ba72)!important;
  border:1.5px solid #fff!important;
  box-shadow:0 2px 4px rgba(0,0,0,.2)!important;
  z-index:5!important;
}
.level-btn.current::before{
  box-shadow:0 0 0 4px rgba(255,240,124,.32),0 0 14px rgba(255,222,78,.92),0 2px 0 rgba(106,22,57,.5),0 4px 8px rgba(0,0,0,.24),inset 0 1px 0 rgba(255,255,255,.75)!important;
}
.level-btn.current{animation:levelPulseV13 1.15s ease-in-out infinite!important;z-index:9!important}
.level-btn.current .level-num{background:rgba(96,54,12,.92)!important;color:#fff2a3!important}
.level-btn:active{transform:translate3d(-50%,-50%,0) scale(.94)!important}

@keyframes levelPulseV13{0%,100%{filter:drop-shadow(0 0 0 rgba(255,242,97,0));transform:translate3d(-50%,-50%,0) scale(1)}50%{filter:drop-shadow(0 0 8px rgba(255,239,119,.86));transform:translate3d(-50%,-50%,0) scale(1.06)}}

@media (max-width:430px){
  .guide-bubble.guide-bubble-top{top:calc(var(--safe-t) + 62px)!important;width:min(calc(100% - 20px), 380px)!important;padding:7px 10px!important}
  .guide-bubble.guide-bubble-top img{width:34px!important;height:34px!important}
  .guide-bubble.guide-bubble-top p{font-size:11px!important}
  .level-btn{width:40px!important;height:40px!important}
  .level-btn::before{width:16px!important;height:16px!important;margin:-8px 0 0 -8px!important}
  .level-btn[data-theme="checkpoint"]::before{width:20px!important;height:20px!important;margin:-10px 0 0 -10px!important}
  .level-btn[data-theme="treasure"]{width:44px!important;height:44px!important}
  .level-btn[data-theme="treasure"]::before{width:24px!important;height:24px!important;margin:-12px 0 0 -12px!important}
  .level-btn .level-num{font-size:7px!important;height:12px!important;min-width:16px!important;transform:translate(-50%,10px)!important}
  .level-btn.milestone .level-num{transform:translate(-50%,11px)!important}
  .milestone-icon{font-size:12px!important;right:0!important;top:-3px!important}
}


/* v14: advanced animated magic-map effects */
.map-content{
  --map-scroll-ratio:0;
  overflow:hidden!important;
}
.map-bg{
  transform-origin:center top!important;
  transform:translateY(calc(var(--map-scroll-ratio) * -10px)) scale(1.012)!important;
  filter:saturate(1.06) contrast(1.03)!important;
  transition:transform .08s linear!important;
}
.map-content::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:1;
  pointer-events:none;
  background:
    radial-gradient(circle at 50% calc(98% - var(--map-scroll-ratio) * 55%), rgba(255,244,162,.18), transparent 18%),
    radial-gradient(circle at 45% calc(72% - var(--map-scroll-ratio) * 42%), rgba(120,255,218,.10), transparent 16%),
    linear-gradient(180deg, rgba(26,12,53,.15), transparent 18%, transparent 82%, rgba(4,7,20,.20));
  mix-blend-mode:screen;
  animation:mapDreamLight 7s ease-in-out infinite;
}
.map-effects{
  position:absolute!important;
  inset:0!important;
  z-index:2!important;
  pointer-events:none!important;
  contain:layout paint style!important;
}
.level-layer{z-index:5!important}
.route-glow-dot,.path-mote,.current-aura,.current-arrow,.map-firefly{
  position:absolute;
  left:0;
  top:0;
  pointer-events:none;
  transform:translate(-50%,-50%);
  will-change:transform,opacity,filter;
}
.route-glow-dot{
  width:6px;
  height:6px;
  border-radius:50%;
  background:#fff4a7;
  box-shadow:0 0 8px rgba(255,234,92,.78),0 0 16px rgba(255,172,60,.35);
  opacity:.42;
  animation:routeDotTwinkle 2.7s ease-in-out infinite;
}
.path-mote{
  width:8px;
  height:8px;
  border-radius:50%;
  background:radial-gradient(circle,#fff 0 18%,#fff1a0 28%,rgba(255,197,75,.18) 72%,transparent 100%);
  filter:drop-shadow(0 0 8px rgba(255,234,108,.82));
  opacity:0;
  animation:pathMoteFloat 3.8s ease-in-out infinite;
}
.current-aura{
  width:56px;
  height:56px;
  border-radius:50%;
  border:2px solid rgba(255,244,137,.72);
  box-shadow:0 0 0 5px rgba(255,224,83,.10),0 0 20px rgba(255,218,90,.58), inset 0 0 18px rgba(255,240,160,.22);
  animation:currentAuraPulse 1.7s ease-in-out infinite;
}
.current-arrow{
  width:0;
  height:0;
  margin-top:-36px;
  border-left:9px solid transparent;
  border-right:9px solid transparent;
  border-top:0;
  border-bottom:15px solid #fff09a;
  filter:drop-shadow(0 0 8px rgba(255,222,75,.88)) drop-shadow(0 2px 2px rgba(0,0,0,.28));
  animation:currentArrowBob 1.05s ease-in-out infinite;
}
.map-firefly{
  width:5px;
  height:5px;
  border-radius:50%;
  background:#fff7bd;
  box-shadow:0 0 8px rgba(255,238,114,.9),0 0 18px rgba(255,173,72,.42);
  opacity:.58;
  animation:fireflyDrift 5.8s ease-in-out infinite;
}
.map-firefly.big{
  width:7px;
  height:7px;
  animation-duration:7.2s;
}
.level-btn.done::before{filter:saturate(1.12) brightness(1.08)!important}
.level-btn.current{animation:levelPulseV14 1.1s ease-in-out infinite!important}
.level-btn.current::after{animation:markerShine 1.4s ease-in-out infinite!important}
.level-btn:not(.locked):hover::before{filter:brightness(1.14) saturate(1.12)!important}

@keyframes mapDreamLight{0%,100%{opacity:.55;filter:hue-rotate(0deg)}50%{opacity:.82;filter:hue-rotate(8deg)}}
@keyframes routeDotTwinkle{0%,100%{opacity:.24;transform:translate(-50%,-50%) scale(.74)}45%{opacity:.82;transform:translate(-50%,-50%) scale(1.15)}}
@keyframes pathMoteFloat{0%{opacity:0;transform:translate(-50%,8px) scale(.65)}18%{opacity:.95}72%{opacity:.82}100%{opacity:0;transform:translate(calc(-50% + 9px),calc(-50% - 20px)) scale(1.15)}}
@keyframes currentAuraPulse{0%,100%{opacity:.5;transform:translate(-50%,-50%) scale(.78)}50%{opacity:1;transform:translate(-50%,-50%) scale(1.08)}}
@keyframes currentArrowBob{0%,100%{opacity:.86;transform:translate(-50%,-50%) translateY(0)}50%{opacity:1;transform:translate(-50%,-50%) translateY(-7px)}}
@keyframes fireflyDrift{0%,100%{opacity:.32;transform:translate(-50%,-50%) translate3d(0,0,0) scale(.82)}30%{opacity:.92;transform:translate(-50%,-50%) translate3d(7px,-12px,0) scale(1.08)}65%{opacity:.58;transform:translate(-50%,-50%) translate3d(-9px,-4px,0) scale(.92)}}
@keyframes markerShine{0%,100%{opacity:.58;transform:translate(-50%,-50%) translateY(-3px) scale(.85)}50%{opacity:1;transform:translate(-50%,-50%) translateY(-5px) scale(1.12)}}
@keyframes levelPulseV14{0%,100%{filter:drop-shadow(0 0 0 rgba(255,242,97,0));transform:translate3d(-50%,-50%,0) scale(1)}50%{filter:drop-shadow(0 0 10px rgba(255,242,97,.95));transform:translate3d(-50%,-50%,0) scale(1.07)}}

@media (prefers-reduced-motion:reduce){
  .map-bg,.map-content::before,.route-glow-dot,.path-mote,.current-aura,.current-arrow,.map-firefly,.level-btn.current,.level-btn.current::after{animation:none!important;transition:none!important}
}
@media (max-width:430px){
  .route-glow-dot{width:5px;height:5px}
  .path-mote{width:7px;height:7px}
  .current-aura{width:48px;height:48px}
  .current-arrow{margin-top:-31px;border-left-width:8px;border-right-width:8px;border-bottom-width:13px}
}


/* v15: refined pastel level markers, more coordinated with candy garden */
.level-btn{
  width:42px!important;
  height:42px!important;
  filter:none!important;
  overflow:visible!important;
}
.level-btn::before{
  content:""!important;
  position:absolute!important;
  left:50%!important;
  top:50%!important;
  width:20px!important;
  height:20px!important;
  margin:-10px 0 0 -10px!important;
  border-radius:50%!important;
  border:1.8px solid rgba(255,255,255,.96)!important;
  background:
    radial-gradient(circle at 35% 28%, rgba(255,255,255,.95) 0 15%, rgba(255,255,255,0) 16%),
    radial-gradient(circle at 50% 62%, rgba(255,255,255,.18) 0 38%, rgba(255,255,255,0) 39%),
    linear-gradient(145deg,#ffbdd8 0%,#ff7db8 38%,#ff6798 66%,#d84c8a 100%)!important;
  box-shadow:0 2px 0 rgba(135,47,91,.35),0 4px 9px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.9)!important;
  transform:none!important;
  z-index:1!important;
}
.level-btn::after{
  content:""!important;
  position:absolute!important;
  left:50%!important;
  top:50%!important;
  width:7px!important;
  height:7px!important;
  margin:-9px 0 0 1px!important;
  border-radius:50%!important;
  background:rgba(255,255,255,.68)!important;
  filter:blur(.15px)!important;
  box-shadow:none!important;
  z-index:2!important;
}
.level-btn .level-num{
  position:absolute!important;
  left:50%!important;
  top:50%!important;
  transform:translate(-50%,11px)!important;
  min-width:18px!important;
  height:13px!important;
  padding:0 4px!important;
  border-radius:999px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  font-family:system-ui,-apple-system,sans-serif!important;
  font-size:8px!important;
  font-weight:900!important;
  letter-spacing:0!important;
  color:#fffdf8!important;
  text-shadow:none!important;
  background:rgba(92,47,62,.86)!important;
  border:1px solid rgba(255,255,255,.72)!important;
  box-shadow:0 2px 5px rgba(0,0,0,.18)!important;
  z-index:3!important;
}
.level-stars,.milestone-icon{display:none!important}

.level-btn[data-theme="mint"]::before{
  background:
    radial-gradient(circle at 35% 28%, rgba(255,255,255,.95) 0 15%, rgba(255,255,255,0) 16%),
    radial-gradient(circle at 50% 62%, rgba(255,255,255,.18) 0 38%, rgba(255,255,255,0) 39%),
    linear-gradient(145deg,#cbfff2 0%,#7ef0d3 40%,#43cdaa 68%,#27a18d 100%)!important;
  box-shadow:0 2px 0 rgba(26,111,91,.35),0 4px 9px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.92)!important;
}
.level-btn[data-theme="violet"]::before{
  background:
    radial-gradient(circle at 35% 28%, rgba(255,255,255,.95) 0 15%, rgba(255,255,255,0) 16%),
    radial-gradient(circle at 50% 62%, rgba(255,255,255,.18) 0 38%, rgba(255,255,255,0) 39%),
    linear-gradient(145deg,#eedbff 0%,#c59dfd 38%,#9b72ea 66%,#7652ca 100%)!important;
  box-shadow:0 2px 0 rgba(74,54,132,.35),0 4px 9px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.9)!important;
}
.level-btn[data-theme="amber"]::before{
  background:
    radial-gradient(circle at 35% 28%, rgba(255,255,255,.95) 0 15%, rgba(255,255,255,0) 16%),
    radial-gradient(circle at 50% 62%, rgba(255,255,255,.18) 0 38%, rgba(255,255,255,0) 39%),
    linear-gradient(145deg,#fff0ba 0%,#ffd176 38%,#ffad49 66%,#f08d3b 100%)!important;
  box-shadow:0 2px 0 rgba(144,86,26,.35),0 4px 9px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.9)!important;
}
.level-btn[data-theme="checkpoint"]::before,
.level-btn.checkpoint::before{
  width:22px!important;
  height:22px!important;
  margin:-11px 0 0 -11px!important;
  background:
    radial-gradient(circle at 35% 28%, rgba(255,255,255,.97) 0 16%, rgba(255,255,255,0) 17%),
    radial-gradient(circle at 50% 62%, rgba(255,255,255,.16) 0 40%, rgba(255,255,255,0) 41%),
    linear-gradient(145deg,#d8fffb 0%,#9ff2ff 36%,#6bcbff 68%,#4c9eff 100%)!important;
  box-shadow:0 2px 0 rgba(44,103,160,.34),0 5px 10px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.95)!important;
}
.level-btn.checkpoint .level-num{background:rgba(42,92,122,.86)!important}

.level-btn.milestone,
.level-btn[data-theme="treasure"]{
  width:46px!important;
  height:46px!important;
  z-index:8!important;
}
.level-btn.milestone::before,
.level-btn[data-theme="treasure"]::before{
  width:26px!important;
  height:26px!important;
  margin:-13px 0 0 -13px!important;
  border-radius:30% 30% 45% 45%!important;
  clip-path:polygon(50% 0%, 66% 12%, 86% 14%, 88% 34%, 100% 50%, 88% 66%, 86% 86%, 66% 88%, 50% 100%, 34% 88%, 14% 86%, 12% 66%, 0% 50%, 12% 34%, 14% 14%, 34% 12%)!important;
  background:
    radial-gradient(circle at 35% 28%, rgba(255,255,255,.98) 0 15%, rgba(255,255,255,0) 16%),
    radial-gradient(circle at 50% 62%, rgba(255,255,255,.18) 0 40%, rgba(255,255,255,0) 41%),
    linear-gradient(145deg,#fff7cb 0%,#ffd96d 34%,#ffb36d 62%,#ff8b93 100%)!important;
  border:2px solid rgba(255,250,230,.98)!important;
  box-shadow:0 3px 0 rgba(153,93,34,.35),0 6px 12px rgba(0,0,0,.25), inset 0 1px 0 rgba(255,255,255,.96)!important;
}
.level-btn.milestone .level-num,
.level-btn[data-theme="treasure"] .level-num{
  transform:translate(-50%,13px)!important;
  min-width:21px!important;
  height:14px!important;
  background:rgba(124,80,40,.88)!important;
  color:#fff9eb!important;
}

.level-btn.locked::before{
  background:
    radial-gradient(circle at 35% 28%, rgba(255,255,255,.93) 0 15%, rgba(255,255,255,0) 16%),
    radial-gradient(circle at 50% 62%, rgba(255,255,255,.15) 0 38%, rgba(255,255,255,0) 39%),
    linear-gradient(145deg,#f3f3f3 0%,#d4d4d4 38%,#b2b2b2 66%,#8c8c8c 100%)!important;
  box-shadow:0 2px 0 rgba(93,93,93,.34),0 4px 9px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.92)!important;
}
.level-btn.locked .level-num{
  background:rgba(74,74,78,.82)!important;
  border-color:rgba(255,255,255,.62)!important;
  color:#f7f7f7!important;
}

.level-btn.done::before{filter:saturate(1.05) brightness(1.03)!important}
.level-btn.done::after{
  content:"✓"!important;
  left:auto!important;
  top:2px!important;
  right:1px!important;
  margin:0!important;
  width:12px!important;
  height:12px!important;
  border-radius:50%!important;
  font-size:9px!important;
  line-height:12px!important;
  text-align:center!important;
  color:#fff!important;
  background:linear-gradient(#98f7be,#20be75)!important;
  border:1.5px solid #fff!important;
  box-shadow:0 2px 4px rgba(0,0,0,.16)!important;
}

.level-btn.current::before{
  box-shadow:0 0 0 4px rgba(255,239,160,.28),0 0 16px rgba(255,237,157,.72),0 2px 0 rgba(135,47,91,.35),0 4px 9px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.9)!important;
}
.level-btn.current .level-num{
  background:rgba(110,74,28,.9)!important;
  color:#fff5bf!important;
}
.level-btn:not(.locked):hover::before{filter:brightness(1.05) saturate(1.03)!important}

@media (max-width:430px){
  .level-btn{width:40px!important;height:40px!important}
  .level-btn::before{width:18px!important;height:18px!important;margin:-9px 0 0 -9px!important}
  .level-btn[data-theme="checkpoint"]::before,.level-btn.checkpoint::before{width:20px!important;height:20px!important;margin:-10px 0 0 -10px!important}
  .level-btn.milestone::before,.level-btn[data-theme="treasure"]::before{width:24px!important;height:24px!important;margin:-12px 0 0 -12px!important}
  .level-btn .level-num{font-size:7px!important;min-width:16px!important;height:12px!important;transform:translate(-50%,10px)!important}
  .level-btn.milestone .level-num,.level-btn[data-theme="treasure"] .level-num{transform:translate(-50%,11px)!important}
}


/* v16: carefully redesigned map level icons using custom candy-badge SVG assets */
.level-btn{
  width:44px!important;
  height:44px!important;
  position:absolute!important;
  transform:translate3d(-50%,-50%,0)!important;
  border:0!important;
  border-radius:50%!important;
  background:transparent url('../assets/images/ui/level-icons/level-unlocked.svg') center/30px 30px no-repeat!important;
  box-shadow:none!important;
  filter:none!important;
  overflow:visible!important;
  display:block!important;
  padding:0!important;
  touch-action:manipulation!important;
  isolation:isolate!important;
}
.level-btn::before{
  content:""!important;
  position:absolute!important;
  left:50%!important;
  top:50%!important;
  width:34px!important;
  height:34px!important;
  transform:translate(-50%,-50%) scale(.78)!important;
  border-radius:50%!important;
  border:2px solid rgba(255,239,171,0)!important;
  box-shadow:0 0 0 rgba(255,240,144,0)!important;
  opacity:0!important;
  transition:opacity .18s ease, transform .18s ease!important;
  pointer-events:none!important;
  z-index:0!important;
}
.level-btn::after{display:none!important;content:none!important}
.level-btn .level-num{
  position:absolute!important;
  left:50%!important;
  top:50%!important;
  transform:translate(-50%,-50%)!important;
  min-width:auto!important;
  height:auto!important;
  padding:0!important;
  border:0!important;
  background:none!important;
  box-shadow:none!important;
  font-family:arco, system-ui, sans-serif!important;
  font-size:11px!important;
  line-height:1!important;
  font-weight:1000!important;
  color:#fffdf2!important;
  text-shadow:0 1px 0 rgba(122,73,27,.95), 0 0 6px rgba(0,0,0,.28)!important;
  letter-spacing:-.15px!important;
  z-index:3!important;
}
.level-stars,
.milestone-icon{display:none!important}
.level-btn.locked{
  background-image:url('../assets/images/ui/level-icons/level-locked.svg')!important;
}
.level-btn.locked .level-num{
  color:#ffffff!important;
  text-shadow:0 1px 0 rgba(90,90,90,.95), 0 0 6px rgba(0,0,0,.18)!important;
}
.level-btn.checkpoint,
.level-btn[data-theme="checkpoint"]{
  background-image:url('../assets/images/ui/level-icons/level-checkpoint.svg')!important;
  background-size:31px 31px!important;
}
.level-btn.milestone,
.level-btn[data-theme="treasure"]{
  width:48px!important;
  height:48px!important;
  background-image:url('../assets/images/ui/level-icons/level-milestone.svg')!important;
  background-size:36px 36px!important;
  z-index:8!important;
}
.level-btn.milestone .level-num,
.level-btn[data-theme="treasure"] .level-num{
  font-size:11px!important;
  color:#fff9ee!important;
  text-shadow:0 1px 0 rgba(132,86,40,.95), 0 0 6px rgba(0,0,0,.20)!important;
}
.level-btn.done{
  filter:saturate(1.05) brightness(1.03)!important;
}
.level-btn.done::after{
  display:grid!important;
  content:"✓"!important;
  position:absolute!important;
  right:2px!important;
  bottom:3px!important;
  width:14px!important;
  height:14px!important;
  place-items:center!important;
  border-radius:50%!important;
  background:linear-gradient(180deg,#98f6bb,#22bf74)!important;
  color:#fff!important;
  font-family:system-ui,sans-serif!important;
  font-size:10px!important;
  line-height:1!important;
  font-weight:1000!important;
  border:1.6px solid #fff!important;
  box-shadow:0 2px 4px rgba(0,0,0,.14)!important;
  z-index:4!important;
}
.level-btn.current::before{
  opacity:1!important;
  transform:translate(-50%,-50%) scale(1)!important;
  border-color:rgba(255,240,171,.95)!important;
  box-shadow:0 0 0 3px rgba(255,240,171,.24), 0 0 16px rgba(255,233,141,.55)!important;
}
.level-btn.current{
  animation:levelPulseV16 1.15s ease-in-out infinite!important;
}
.level-btn.current .level-num{
  color:#fff8de!important;
}
.level-btn:not(.locked):hover{
  transform:translate3d(-50%,-50%,0) scale(1.04)!important;
}

@keyframes levelPulseV16{
  0%,100%{filter:drop-shadow(0 0 0 rgba(255,240,171,0));}
  50%{filter:drop-shadow(0 0 8px rgba(255,234,142,.35));}
}

@media (max-width:430px){
  .level-btn{width:42px!important;height:42px!important;background-size:28px 28px!important}
  .level-btn .level-num{font-size:10px!important}
  .level-btn.checkpoint,.level-btn[data-theme="checkpoint"]{background-size:29px 29px!important}
  .level-btn.milestone,.level-btn[data-theme="treasure"]{width:46px!important;height:46px!important;background-size:34px 34px!important}
  .level-btn::before{width:32px!important;height:32px!important}
}