@font-face{font-family:'Jua';src:url('./assets/fonts/Jua-Regular.ttf') format('truetype');font-style:normal;font-weight:400;font-display:swap}
/* Swoopop map kit: one hierarchy, five palettes, four reusable props. */
body[data-screen=home]{background:#eee9df}
body[data-screen=home] .world{background:none}
body[data-screen=home] .game-shell{width:min(100%,500px);padding:0;margin:0 auto}
.home-screen{--map-bg:#fff0c6;--map-wash:#ffe4aa;--map-ink:#705b5e;--map-accent:#e76c98;--map-path:#e9c990;--map-node:#fff8e7;background:var(--map-bg);color:var(--map-ink);height:100svh;height:100dvh;min-height:480px;overflow:hidden}
.map-header{height:calc(68px + env(safe-area-inset-top));padding:calc(12px + env(safe-area-inset-top)) 20px 8px;background:none;border:0;box-shadow:none;display:flex;align-items:center;justify-content:space-between;gap:12px;z-index:5}
.mini-logo{flex:0;font-family:'Fredoka','Nunito',sans-serif;font-size:26px;font-weight:700;letter-spacing:-1.4px;color:var(--map-ink);line-height:1;transform:rotate(-3deg);margin-right:10px;opacity:.85}.mini-logo b{color:#e55f91}
.heart-meter{width:89px;height:41px;min-height:0;padding:3px 9px 4px 11px;grid-template-columns:25px auto;gap:0 6px;align-items:center;background:#fffdf2;border:2px solid #fff;box-shadow:0 3px 0 #c8a77930;border-radius:16px;color:#7f6670}
.heart-meter>span{font-size:29px;color:#e86491;line-height:1;filter:drop-shadow(0 2px #bc497352)}.heart-meter b{font-family:'Fredoka','Nunito',sans-serif;font-size:18px;line-height:18px}.heart-meter small{font-size:10px;line-height:12px;letter-spacing:0;color:#9a8585;font-weight:800;white-space:nowrap}
.map-header .round-button{width:39px;height:39px;border-radius:50%;border:2px solid #fff;box-shadow:0 3px 0 #c8a77930;background:#fffdf2;color:#a18d89}.map-header .round-button svg{width:22px;height:22px;stroke-width:2.2}
.map-heading{position:relative;display:flex;align-items:center;flex-direction:column;min-height:0;flex:none;padding:4px 16px 8px;background:none;border:0;gap:6px;text-align:center;z-index:3}
.region-select{display:flex;align-items:center;justify-content:center;gap:5px;max-width:100%;min-height:39px;background:none;padding:0 8px;color:var(--map-ink);font-family:'Jua','Fredoka',sans-serif;font-weight:400;letter-spacing:-.4px;font-size:29px;line-height:1.2}.region-select svg{width:22px;height:22px;stroke-width:2.5;opacity:.65;flex:none}.region-select:active{transform:translateY(1px)}
.chapter-reward{display:flex;align-items:center;justify-content:center;gap:9px;min-height:31px;background:#fffdf084;border:1.5px solid #ffffffaa;border-radius:20px;padding:4px 11px;font-size:14px;color:var(--map-ink);box-shadow:0 2px 0 #927b5c09}
.milestone-dots{display:flex;align-items:center;gap:4px}.milestone-dots i{width:7px;height:7px;border-radius:50%;background:var(--map-path);opacity:.65}.milestone-dots i.filled{background:var(--map-accent);opacity:1}.chapter-reward>b{font-family:'Fredoka','Nunito',sans-serif;font-size:13px;font-weight:600;line-height:1;white-space:nowrap}.chapter-reward>b>span{opacity:.45;margin-left:1px}.chapter-reward>svg{height:20px;width:20px;stroke-width:2;color:var(--map-accent)}
.map-scroll{position:relative;flex:1;min-height:0;padding:0;overflow-y:auto;overscroll-behavior:contain;background:var(--map-bg);scrollbar-width:none;scroll-behavior:auto;mask-image:linear-gradient(to bottom,transparent 0,#000 18px,#000 calc(100% - 18px),transparent 100%);-webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 18px,#000 calc(100% - 18px),transparent 100%)}
.map-trail{width:100%;min-height:0;position:relative;background:var(--map-bg);isolation:isolate;overflow:hidden}
.trail-line{position:absolute;inset:0;width:100%;height:100%;fill:none;stroke:none;filter:none;z-index:-1}.trail-line path{fill:none;stroke-linecap:round;stroke-linejoin:round}.trail-line .trail-bed{stroke:var(--map-wash);stroke-width:143;opacity:.9}.trail-line .route-ahead{stroke:#fffcf2;stroke-width:8;stroke-dasharray:1 18;opacity:.95}.trail-line .route-done{stroke:var(--map-accent);stroke-width:8;opacity:.5}
.map-prop{position:absolute;display:block;width:114px;height:114px;background-image:url('./assets/map-props.png');background-repeat:no-repeat;background-size:400% 133.3333%;background-position-y:50%;pointer-events:none;transform:translate(-50%,-50%) scale(var(--prop-scale,1));filter:drop-shadow(0 6px 2px #74604712);z-index:0}.prop-0{background-position-x:0%}.prop-1{background-position-x:33.33333%}.prop-2{background-position-x:66.66667%}.prop-3{background-position-x:100%}
.trail-node{position:absolute;display:grid;place-items:center;width:58px;height:54px;background:var(--map-node);border:3px solid #fffdf4;box-shadow:0 5px 0 #c5bda533,0 7px 7px #76605212;border-radius:44%;padding:0;color:var(--map-ink);transform:translate(-50%,-50%);isolation:auto;z-index:1;opacity:1!important}
.trail-node>b,.trail-node.cleared>b,.trail-node.current>b{position:static;background:none;border:0;border-radius:0;box-shadow:none;min-width:0;color:inherit;font-family:'Fredoka','Nunito',sans-serif;font-size:25px;font-weight:600;line-height:1;letter-spacing:-1px;text-shadow:none;z-index:1}
.trail-node:disabled{background:var(--map-node);border-color:#fffbefa3;color:#aa9c936e;box-shadow:0 4px 0 #ae957821;opacity:1}
.trail-node.cleared{color:#fffdf3;background:var(--map-accent);border-color:#fff4dc;box-shadow:0 5px 0 #ac76514a,0 7px 7px #76605212}
.trail-node.current{width:78px;height:70px;border-radius:43%;background:#ef719b;border:4px solid #fff8e4;box-shadow:0 6px 0 #bb4774,0 10px 15px #bd5a7730;color:white;z-index:3}
.trail-node.current>b{font-size:32px;text-shadow:0 2px 0 #b846745e}
.trail-node small{position:absolute;left:0;right:0;bottom:-13px;font-family:'Nunito',sans-serif;font-size:16px;font-weight:1000;color:#ffc848;letter-spacing:-1px;line-height:1;text-shadow:0 2px #b78546,1px 0 #fff7de,-1px 0 #fff7de;z-index:3}
.trail-node .trail-lumi{width:83px;height:83px;right:-44px;top:-56px;filter:drop-shadow(0 4px 0 #84693313);animation:map-lumi-bob 2.8s ease-in-out infinite;transform-origin:center bottom;z-index:4}
.trail-node em{position:absolute;top:-7px;right:-7px;bottom:auto;width:22px;height:22px;display:grid;place-items:center;border-radius:8px;background:#a894c7;color:white;border:2px solid #fff5eb;font-size:14px;font-style:normal;text-shadow:none}
.trail-node:active:not(:disabled){transform:translate(-50%,-47%) scale(.96)}
.trail-gift{position:absolute;left:50%;top:58px;transform:translateX(-50%) rotate(-7deg);width:57px;height:54px;border:3px solid #fff8de;border-radius:18px;background:#efba69;box-shadow:0 4px 0 #c090504d;color:#fff9e5;display:grid;place-items:center;z-index:1}.trail-gift svg{width:32px;height:32px;stroke-width:2}.trail-gift.earned{background:var(--map-accent)}.trail-gift:active{transform:translateX(-50%) rotate(-7deg) scale(.95)}
.map-dock{flex:none;position:relative;background:var(--map-bg);border:0;box-shadow:none;padding:8px 30px 19px;z-index:4}
.map-dock .home-play{width:100%;min-height:64px;max-width:340px;margin:0 auto;padding:8px 58px 9px 25px;border-radius:24px;border:3px solid #ffadd0;background:linear-gradient(#f47fa7,#ed6696);box-shadow:0 6px 0 #c14c79,0 9px 12px #b5537320;text-shadow:0 2px #ce4f7d40;color:#fff8f1}
.map-dock .home-play>span:first-child{font-family:'Jua','Fredoka',sans-serif;font-size:25px;font-weight:400;letter-spacing:0;line-height:1.1}.map-dock .home-play small{font-size:12px;font-weight:800;line-height:1.2;letter-spacing:0;color:#fff0f7;margin-top:4px}.map-dock .home-play .play-triangle{position:absolute;width:24px;height:28px;right:25px;top:15px;fill:#fff8f1;stroke:#fff8f1;stroke-width:2}
.bottom-tabs{height:calc(77px + env(safe-area-inset-bottom));padding:9px 19px calc(8px + env(safe-area-inset-bottom));background:#fffcf1;border-top:2px solid white;box-shadow:0 -5px 18px #69555008;gap:14px;border-radius:25px 25px 0 0;z-index:5}
.bottom-tabs button{border-radius:18px;background:none;color:#b2a0a1;gap:3px;padding:4px 7px;box-shadow:none}.bottom-tabs button>span{height:26px;font-size:0;display:block}.bottom-tabs svg{width:26px;height:26px;stroke-width:2.2}.bottom-tabs button b{font-family:'Jua','Fredoka',sans-serif;font-size:15px;line-height:1;font-weight:400}.bottom-tabs button.selected{background:#fbe1e9;box-shadow:inset 0 -3px #efc3d4;color:#b95b7d}
.home-screen .tab-page{background:var(--map-bg);padding-top:12px}.home-screen .tab-page h1{font-family:'Jua','Fredoka',sans-serif;font-size:31px;font-weight:400;color:var(--map-ink)}.home-screen .tab-page h2{font-family:'Jua','Fredoka',sans-serif;font-weight:400;color:var(--map-ink)}.home-screen .tab-page .primary{background:#ed759d;border-color:#ffb2ce;box-shadow:0 4px #c5577f}.home-screen .tab-page .secondary{background:#fffaf0;border-color:white;color:var(--map-ink);box-shadow:0 3px #b79c8130}.home-screen .shop-tool,.home-screen .garden-card{background:#fffaf0;border-color:#fff;box-shadow:0 4px #9d846323}.home-screen .coming-card{border-color:#bea9a355}.home-screen .reward-note{background:#fffaf0bd}
.region-modal h2,.region-reward-modal h2,.level-preview h2{font-family:'Jua','Fredoka',sans-serif;font-weight:400;color:#786276;font-size:27px}.region-modal{padding:25px 18px 20px}.region-list{display:flex;flex-direction:column;gap:10px}.region-option{display:flex;align-items:center;gap:13px;min-height:77px;padding:11px 14px;background:var(--option-bg);color:var(--option-ink);border:2px solid white;border-radius:19px;text-align:left;box-shadow:0 3px #6f5c7120}.region-option.chosen{outline:3px solid #e78dab;outline-offset:0}.region-option .map-prop{position:relative;inset:auto;transform:none;width:55px;height:55px;flex:none;filter:none}.region-option>span{flex:1}.region-option b{display:block;font-family:'Jua','Fredoka',sans-serif;font-size:20px;font-weight:400;line-height:1.3}.region-option small{display:block;font-family:'Fredoka','Nunito',sans-serif;font-size:13px;opacity:.65;margin-top:4px}.region-option em{font-style:normal;font-weight:800;font-size:14px}.region-option em svg{width:20px;height:20px;opacity:.6}.reward-symbol{display:grid;place-items:center;width:76px;height:76px;border-radius:26px;background:#fff0ce;color:#dda163;margin:5px auto 15px}.reward-symbol svg{height:44px;width:44px}.region-reward-modal .earned-tools{margin:20px 0;color:#806c7e}
.result-garden{background:#fff0cd!important;border-radius:25px 25px 40% 40%;position:relative}.garden-result h2{font-family:'Jua','Fredoka',sans-serif;font-weight:400}.result-garden:after{content:'';position:absolute;inset:auto 20% 9px;height:8px;border-radius:50%;background:#dcbe9a26;pointer-events:none}
@keyframes map-lumi-bob{0%,100%{transform:translateY(0) rotate(8deg)}50%{transform:translateY(-5px) rotate(3deg)}}.reduced .trail-node .trail-lumi{animation:none}
@media(max-width:350px){.map-header{padding-left:17px;padding-right:17px;gap:8px}.mini-logo{font-size:24px;margin:0}.heart-meter{width:80px}.region-select{font-size:27px}.map-dock{padding-left:22px;padding-right:22px}.map-dock .home-play{min-height:58px}.map-dock .home-play>span:first-child{font-size:23px}.bottom-tabs{gap:8px}.map-prop{width:100px;height:100px}}
@media(max-height:700px){.map-header{height:calc(55px + env(safe-area-inset-top));padding-top:calc(7px + env(safe-area-inset-top));padding-bottom:5px}.map-heading{padding-top:0;padding-bottom:4px;gap:0}.region-select{min-height:32px;font-size:26px}.chapter-reward{min-height:29px;padding-top:3px;padding-bottom:3px}.map-dock{padding-top:4px;padding-bottom:14px}.map-dock .home-play{min-height:56px;padding-top:7px;padding-bottom:6px}.map-dock .home-play>span:first-child{font-size:23px}.map-dock .home-play small{font-size:11px}.bottom-tabs{height:calc(67px + env(safe-area-inset-bottom));padding-top:6px;padding-bottom:calc(6px + env(safe-area-inset-bottom))}}

.map-header .mini-logo{position:absolute;left:50%;margin:0;transform:translateX(-50%) rotate(-3deg)}.trail-node:disabled{color:#9d8b7e}.trail-line .trail-bed{stroke-width:116}