:root{--sky-blue: #87CEEB;--deep-forest-blue: #2E5984;--twilight-blue: #1a3a52;--sage: #8FBC8F;--emerald: #2E8B57;--moss: #6B8E23;--forest-dark: #1a4d2e;--golden-bone: #FFD700;--sunset-orange: #FF8C42;--warm-cream: #FFF8DC;--soft-pink: #FFB6C1;--cece-hair: #A0826D;--timmy-hair: #8B7355;--shelby-fur: #8B7355;--harley-brindle: #B8860B;--text-dark: #2C3E50;--text-light: #FDFEFE;--shadow: rgba(0, 0, 0, .3);--font-display: "Baloo 2", cursive;--font-body: "Quicksand", sans-serif;--touch-target: 48px}*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}html,body{width:100%;height:100%;overflow:hidden;background:var(--deep-forest-blue);font-family:var(--font-body);touch-action:none}#app{width:100%;height:100%;position:relative;overflow:hidden}#loading-screen{position:fixed;top:0;left:0;width:100%;height:100%;background:linear-gradient(180deg,var(--sky-blue) 0%,var(--deep-forest-blue) 100%);display:flex;align-items:center;justify-content:center;z-index:1000;transition:opacity .5s ease-out}#loading-screen.hidden{opacity:0;pointer-events:none}.loader-content{text-align:center;color:var(--warm-cream)}.loader-content h1{font-family:var(--font-display);font-size:clamp(1.5rem,5vw,2.5rem);margin:1rem 0;text-shadow:2px 2px 4px var(--shadow)}.paw-prints{display:flex;justify-content:center;gap:1rem}.paw{font-size:2.5rem;animation:pawBounce .6s ease-in-out infinite}.paw:nth-child(2){animation-delay:.2s}.paw:nth-child(3){animation-delay:.4s}@keyframes pawBounce{0%,to{transform:translateY(0) scale(1)}50%{transform:translateY(-15px) scale(1.1)}}.progress-bar{width:200px;height:12px;background:#fff3;border-radius:10px;overflow:hidden;margin:0 auto;border:2px solid var(--warm-cream)}.progress-fill{height:100%;background:linear-gradient(90deg,var(--golden-bone),var(--sunset-orange));border-radius:8px;width:0%;transition:width .3s ease-out}#game-canvas{position:absolute;top:0;left:0;width:100%;height:100%;display:block}#ui-layer{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none}#ui-layer>*{pointer-events:auto}.scene{position:absolute;top:0;left:0;width:100%;height:100%;opacity:0;pointer-events:none;visibility:hidden;transition:opacity .5s ease-in-out,visibility 0s linear .5s}.scene.active{opacity:1;pointer-events:auto;visibility:visible;transition:opacity .5s ease-in-out,visibility 0s linear 0s}.scene:not(.active) *{pointer-events:none!important}.landing-scene{background:transparent;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:2rem;overflow:hidden}.title-container{text-align:center;margin-bottom:2rem;animation:floatIn 1s ease-out}.main-title{font-family:var(--font-display);font-size:clamp(2rem,8vw,4rem);color:var(--warm-cream);text-shadow:3px 3px 0 var(--deep-forest-blue),6px 6px 10px var(--shadow);line-height:1.1}.subtitle{font-family:var(--font-body);font-size:clamp(1rem,3vw,1.5rem);color:var(--golden-bone);margin-top:.5rem;text-shadow:2px 2px 4px var(--shadow)}@keyframes floatIn{0%{opacity:0;transform:translateY(-50px)}to{opacity:1;transform:translateY(0)}}.characters-container{display:flex;justify-content:center;align-items:flex-end;gap:clamp(.5rem,3vw,2rem);margin-bottom:2rem;flex-wrap:wrap}.character{display:flex;flex-direction:column;align-items:center;animation:characterBounce 2s ease-in-out infinite}.character:nth-child(2){animation-delay:.3s}.character:nth-child(3){animation-delay:.6s}.character:nth-child(4){animation-delay:.9s}@keyframes characterBounce{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}.character-sprite{width:clamp(80px,20vw,150px);height:clamp(100px,25vw,180px);position:relative}.character-name{font-family:var(--font-display);font-size:clamp(.9rem,2.5vw,1.3rem);color:var(--warm-cream);text-shadow:2px 2px 4px var(--shadow);margin-top:.5rem;background:var(--deep-forest-blue);padding:.25rem .75rem;border-radius:20px}.start-button{font-family:var(--font-display);font-size:clamp(1.2rem,4vw,2rem);padding:clamp(.8rem,2vw,1.2rem) clamp(2rem,5vw,3rem);background:linear-gradient(180deg,var(--golden-bone) 0%,var(--sunset-orange) 100%);border:4px solid var(--warm-cream);border-radius:50px;color:var(--text-dark);cursor:pointer;box-shadow:0 6px #cc7a00,0 10px 20px var(--shadow);transition:all .15s ease;min-height:var(--touch-target);animation:buttonGlow 2s ease-in-out infinite}.start-button:active{transform:translateY(4px);box-shadow:0 2px #cc7a00,0 4px 10px var(--shadow)}@keyframes buttonGlow{0%,to{box-shadow:0 6px #cc7a00,0 10px 20px var(--shadow)}50%{box-shadow:0 6px #cc7a00,0 10px 30px var(--shadow),0 0 20px #ffd70080}}.map-scene{background:transparent}.map-container{width:100%;height:100%;position:relative;overflow:hidden}.map-title{position:absolute;top:1rem;left:50%;transform:translate(-50%);font-family:var(--font-display);font-size:clamp(1.5rem,5vw,2.5rem);color:var(--warm-cream);text-shadow:3px 3px 0 var(--forest-dark);z-index:10;text-align:center;white-space:nowrap}.location-marker{position:absolute;width:clamp(70px,15vw,120px);height:clamp(70px,15vw,120px);border-radius:50%;background:radial-gradient(circle,var(--golden-bone) 0%,var(--sunset-orange) 100%);border:4px solid var(--warm-cream);display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 4px #cc7a00,0 8px 15px var(--shadow);transition:all .2s ease;z-index:5}.location-marker:active{transform:scale(.95);box-shadow:0 2px #cc7a00,0 4px 8px var(--shadow)}.location-marker.found{background:radial-gradient(circle,#98D1A8 0%,var(--emerald) 100%)}.location-marker.shake{animation:markerShake .5s ease-in-out}@keyframes markerShake{0%,to{transform:translate(-50%,-50%) rotate(0)}20%{transform:translate(-50%,-50%) rotate(-10deg)}40%{transform:translate(-50%,-50%) rotate(10deg)}60%{transform:translate(-50%,-50%) rotate(-10deg)}80%{transform:translate(-50%,-50%) rotate(10deg)}}.coming-soon-toast{position:absolute;bottom:20%;left:50%;transform:translate(-50%);background:var(--deep-forest-blue);border:3px solid var(--golden-bone);border-radius:25px;padding:.8rem 1.5rem;display:flex;align-items:center;gap:.5rem;z-index:20;animation:toastSlideIn .3s ease-out;box-shadow:0 5px 20px var(--shadow)}.coming-soon-toast .toast-icon{font-size:1.5rem}.coming-soon-toast .toast-text{font-family:var(--font-display);font-size:clamp(1rem,3vw,1.2rem);color:var(--warm-cream)}.coming-soon-toast.fade-out{animation:toastFadeOut .3s ease-out forwards}@keyframes toastSlideIn{0%{opacity:0;transform:translate(-50%) translateY(20px)}to{opacity:1;transform:translate(-50%) translateY(0)}}@keyframes toastFadeOut{0%{opacity:1;transform:translate(-50%) translateY(0)}to{opacity:0;transform:translate(-50%) translateY(-20px)}}.location-marker .icon{font-size:clamp(1.5rem,4vw,2.5rem)}.location-marker .name{font-family:var(--font-display);font-size:clamp(.6rem,1.5vw,.9rem);color:var(--text-dark);text-align:center}.bone-counter{position:absolute;top:1rem;right:1rem;background:var(--deep-forest-blue);padding:.5rem 1rem;border-radius:25px;border:3px solid var(--golden-bone);display:flex;align-items:center;gap:.5rem;z-index:10}.bone-counter .bone-icon{font-size:1.5rem}.bone-counter .count{font-family:var(--font-display);font-size:1.2rem;color:var(--golden-bone)}.back-button{position:absolute;bottom:1rem;left:1rem;font-family:var(--font-display);font-size:clamp(.9rem,2.5vw,1.2rem);padding:.5rem 1rem;background:var(--deep-forest-blue);border:3px solid var(--warm-cream);border-radius:25px;color:var(--warm-cream);cursor:pointer;min-height:var(--touch-target);z-index:10;transition:all .15s ease}.back-button:active{transform:scale(.95)}.location-scene{background:transparent;display:flex;flex-direction:column}.scene-header{display:flex;justify-content:space-between;align-items:center;padding:1rem;z-index:10}.scene-title{font-family:var(--font-display);font-size:clamp(1.2rem,4vw,2rem);color:var(--warm-cream);text-shadow:2px 2px 0 var(--forest-dark)}.game-area{flex:1;position:relative;overflow:hidden}.parallax-layer{position:absolute;width:100%;height:100%;background-repeat:repeat-x;background-size:auto 100%}.layer-sky{z-index:0}.layer-mountains{z-index:1;bottom:30%}.layer-trees-far{z-index:2;bottom:20%}.layer-trees-mid{z-index:3;bottom:10%}.layer-ground{z-index:4;bottom:0;height:40%}.interactive-spot{position:absolute;cursor:pointer;z-index:6;transition:all .3s ease}.interactive-spot.hint{animation:sparkle 1.5s ease-in-out infinite}@keyframes sparkle{0%,to{filter:brightness(1) drop-shadow(0 0 5px transparent)}50%{filter:brightness(1.3) drop-shadow(0 0 15px var(--golden-bone))}}.interactive-spot:active{transform:scale(.9)}.scene-character{position:absolute;z-index:7;transition:all .5s ease}.dialog-box{position:absolute;bottom:10%;left:50%;transform:translate(-50%);background:var(--warm-cream);border:4px solid var(--deep-forest-blue);border-radius:20px;padding:1rem 1.5rem;max-width:90%;z-index:20;box-shadow:0 5px 20px var(--shadow)}.dialog-box p{font-family:var(--font-body);font-size:clamp(1rem,3vw,1.3rem);color:var(--text-dark);text-align:center}.dialog-box .speaker{font-family:var(--font-display);color:var(--deep-forest-blue);font-weight:700}.celebration-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:100;opacity:0;pointer-events:none;transition:opacity .3s ease}.celebration-overlay.active{opacity:1;pointer-events:auto}.celebration-content{background:linear-gradient(180deg,var(--golden-bone) 0%,var(--sunset-orange) 100%);padding:2rem 3rem;border-radius:30px;border:5px solid var(--warm-cream);text-align:center;animation:celebrationPop .5s ease-out;box-shadow:0 10px 40px var(--shadow)}@keyframes celebrationPop{0%{transform:scale(0) rotate(-10deg)}50%{transform:scale(1.1) rotate(5deg)}to{transform:scale(1) rotate(0)}}.celebration-content h2{font-family:var(--font-display);font-size:clamp(1.8rem,6vw,3rem);color:var(--text-dark);margin-bottom:.5rem}.celebration-content p{font-family:var(--font-body);font-size:clamp(1rem,3vw,1.3rem);color:var(--text-dark);margin-bottom:1rem}.celebration-content .bone-found{font-size:4rem;animation:boneSpin 1s ease-in-out infinite}@keyframes boneSpin{0%,to{transform:rotate(-10deg) scale(1)}50%{transform:rotate(10deg) scale(1.2)}}.continue-button{font-family:var(--font-display);font-size:clamp(1rem,3vw,1.3rem);padding:.8rem 2rem;background:var(--emerald);border:3px solid var(--warm-cream);border-radius:25px;color:var(--warm-cream);cursor:pointer;min-height:var(--touch-target);transition:all .15s ease}.continue-button:active{transform:scale(.95)}.confetti{position:fixed;width:10px;height:10px;z-index:101;pointer-events:none}.floating-leaf{position:absolute;font-size:1.5rem;animation:leafFloat 10s linear infinite;opacity:.7;z-index:5;pointer-events:none}@keyframes leafFloat{0%{transform:translate(-100%) translateY(0) rotate(0);opacity:0}10%{opacity:.7}90%{opacity:.7}to{transform:translate(100vw) translateY(100px) rotate(360deg);opacity:0}}.character-svg{width:100%;height:100%}.wave-arm{transform-origin:70% 50%;animation:wave .8s ease-in-out infinite}@keyframes wave{0%,to{transform:rotate(0)}50%{transform:rotate(-20deg)}}.tail-wag{transform-origin:30% 80%;animation:wag .3s ease-in-out infinite alternate}@keyframes wag{0%{transform:rotate(-15deg)}to{transform:rotate(15deg)}}.blink{animation:blink 3s ease-in-out infinite}@keyframes blink{0%,45%,55%,to{transform:scaleY(1)}50%{transform:scaleY(.1)}}@media (orientation: landscape){.characters-container{flex-direction:row;flex-wrap:nowrap}.location-marker{width:clamp(60px,12vw,100px);height:clamp(60px,12vw,100px)}}@media (max-height: 500px){.title-container{margin-bottom:1rem}.character-sprite{width:60px;height:80px}}