:root{color-scheme:light;font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;line-height:1.5}*{box-sizing:border-box;margin:0;padding:0}html,body,#root{margin:0;width:100%;height:100vh;overflow:hidden;background:#0a1a0a;color:#fafafa}.title-screen{width:100%;height:100vh;background:linear-gradient(135deg,#0a2a0a,#1a3a1a 30%,#0a1a2a 70%,#0a0a1a);display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}.title-bg{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.title-leaf{position:absolute;font-size:2rem;opacity:.3;animation:leafFall linear infinite}@keyframes leafFall{0%{transform:translateY(-50px) rotate(0);opacity:0}10%{opacity:.3}90%{opacity:.3}to{transform:translateY(100vh) rotate(360deg);opacity:0}}.title-content{text-align:center;z-index:1;display:flex;flex-direction:column;align-items:center;gap:1.5rem}.title-elephant{width:80px;height:80px;display:flex;align-items:center;justify-content:center;animation:elephantFloat 3s ease-in-out infinite}@keyframes elephantFloat{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}.title-text{display:flex;flex-direction:column;gap:.25rem}.title-word{display:block;font-size:3.5rem;font-weight:900;text-transform:uppercase;letter-spacing:.05em;text-shadow:0 4px 12px rgba(0,0,0,.5)}.title-word-1{background:linear-gradient(135deg,gold,orange,tomato);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.title-word-2{background:linear-gradient(135deg,#32cd32,#00ced1,#4169e1);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;font-size:4rem}.title-subtitle{font-size:1.1rem;color:#ffffffb3;max-width:400px;line-height:1.6}.title-btn{display:inline-flex;align-items:center;gap:.75rem;padding:1rem 2.5rem;font-size:1.2rem;font-weight:700;border:none;border-radius:50px;cursor:pointer;background:linear-gradient(135deg,#32cd32,#228b22);color:#fff;box-shadow:0 4px 20px #32cd3266;transition:all .2s;text-transform:uppercase;letter-spacing:.05em}.title-btn:hover{transform:translateY(-2px);box-shadow:0 6px 25px #32cd3299}.title-btn:active{transform:translateY(0)}.title-btn.secondary{background:linear-gradient(135deg,#666,#444);box-shadow:0 4px 20px #6464644d;font-size:1rem;padding:.75rem 1.5rem}.btn-icon{font-size:1.4rem}.title-features{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem;margin-top:1rem}.feature{display:flex;align-items:center;gap:.5rem;padding:.5rem 1rem;background:#ffffff0d;border-radius:12px;font-size:.9rem;color:#fffc;border:1px solid rgba(255,255,255,.1)}.feature span:first-child{font-size:1.3rem}.game-container{width:100%;height:100vh;position:relative;overflow:hidden}.game-world{position:absolute;transition:transform .1s linear}.tile{position:absolute;display:flex;align-items:center;justify-content:center}.item{position:absolute;transform:translate(-50%,-50%);z-index:5;pointer-events:none}.item-emoji{font-size:1.5rem;filter:drop-shadow(0 2px 4px rgba(0,0,0,.3));position:relative;z-index:2}.item-glow{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:30px;height:30px;background:radial-gradient(circle,rgba(255,215,0,.3),transparent);border-radius:50%;z-index:1}.elephant{position:absolute;width:44px;height:44px;z-index:10;transition:left .08s linear,top .08s linear}.elephant.invincible{animation:invincibleFlash .15s infinite}@keyframes invincibleFlash{0%,to{opacity:1}50%{opacity:.4}}.ability-effect{position:absolute;top:-20px;left:50%;transform:translate(-50%);font-size:1.5rem;animation:abilityPop .5s ease-out}@keyframes abilityPop{0%{transform:translate(-50%) scale(.5);opacity:1}to{transform:translate(-50%) scale(2) translateY(-20px);opacity:0}}.particle{position:absolute;border-radius:50%;pointer-events:none;z-index:15;display:flex;align-items:center;justify-content:center}.particle span{font-size:.8rem}.hud{position:fixed;top:0;left:0;right:0;z-index:100;pointer-events:none}.hud-top{display:flex;justify-content:space-between;align-items:flex-start;padding:1rem;background:linear-gradient(180deg,rgba(0,0,0,.7),transparent)}.hud-stats{display:flex;gap:1.5rem;align-items:center}.stat{display:flex;flex-direction:column;gap:.2rem}.stat-label{font-size:.65rem;text-transform:uppercase;letter-spacing:.1em;color:#fff9}.stat-value{font-size:1.3rem;font-weight:800;color:gold;text-shadow:0 2px 4px rgba(0,0,0,.5)}.hp-bar,.xp-bar{width:100px;height:8px;background:#00000080;border-radius:4px;overflow:hidden;border:1px solid rgba(255,255,255,.2)}.hp-fill{height:100%;background:linear-gradient(90deg,#f44,#ff6b6b);border-radius:4px;transition:width .3s}.xp-fill{height:100%;background:linear-gradient(90deg,#4169e1,#00ced1);border-radius:4px;transition:width .3s}.hud-level-name{font-size:1rem;font-weight:700;color:#ffffffe6;text-shadow:0 2px 4px rgba(0,0,0,.5);background:#0000004d;padding:.4rem 1rem;border-radius:20px}.hud-missions{display:flex;gap:.75rem;padding:0 1rem;flex-wrap:wrap}.mission{display:flex;align-items:center;gap:.4rem;padding:.3rem .75rem;background:#00000080;border-radius:20px;font-size:.8rem;color:#fffc;border:1px solid rgba(255,255,255,.1);pointer-events:auto}.mission.completed{background:#32cd3233;border-color:#32cd3266;color:#90ee90}.mission-check{font-size:.9rem}.hud-abilities{display:flex;gap:.5rem;padding:.5rem 1rem}.ability-btn{display:flex;align-items:center;gap:.4rem;padding:.4rem .8rem;background:#0009;border:2px solid rgba(255,215,0,.3);border-radius:12px;color:#fff;cursor:pointer;font-size:.8rem;transition:all .2s;pointer-events:auto}.ability-btn:hover{border-color:gold;background:#ffd70026}.ability-btn.active{border-color:gold;background:#ffd7004d;animation:abilityPulse .3s ease-in-out}@keyframes abilityPulse{0%{transform:scale(1)}50%{transform:scale(1.1)}to{transform:scale(1)}}.ability-emoji{font-size:1.1rem}.ability-name{font-weight:600}.hud-controls{position:fixed;bottom:1rem;left:1rem;display:flex;flex-direction:column;gap:.25rem}.control-hint{font-size:.7rem;color:#fff6;background:#0000004d;padding:.2rem .5rem;border-radius:4px}.mobile-controls{position:fixed;bottom:2rem;right:2rem;display:none;flex-direction:column;align-items:center;gap:.5rem;z-index:100}@media(max-width:768px){.mobile-controls{display:flex}}.mobile-row{display:flex;gap:.5rem}.mobile-btn{width:60px;height:60px;border-radius:50%;background:#0009;border:2px solid rgba(255,255,255,.3);color:#fff;font-size:1.5rem;display:flex;align-items:center;justify-content:center;cursor:pointer;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none;touch-action:manipulation}.mobile-btn:active{background:#32cd3266;border-color:#32cd32}.overlay-screen{position:fixed;top:0;right:0;bottom:0;left:0;background:#000c;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;z-index:200;animation:fadeIn .3s ease-out}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.overlay-card{background:linear-gradient(135deg,#1a2a1a,#0a1a0a);border:2px solid rgba(50,205,50,.3);border-radius:24px;padding:3rem;text-align:center;max-width:500px;width:90%;box-shadow:0 20px 60px #00000080}.overlay-card h2{font-size:2rem;margin-bottom:1rem;background:linear-gradient(135deg,gold,orange);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.complete-score{font-size:1.5rem;font-weight:800;color:gold;margin:1rem 0}.complete-msg{color:#ffffffb3;margin-bottom:1.5rem;font-size:1.1rem}.complete-missions{display:flex;flex-direction:column;gap:.75rem;margin:1.5rem 0}.complete-mission{display:flex;align-items:center;gap:.75rem;padding:.75rem 1rem;background:#ffffff0d;border-radius:12px;font-size:.95rem}.complete-mission.done{background:#32cd321a;border:1px solid rgba(50,205,50,.2)}.reward-badge{margin-left:auto;padding:.25rem .5rem;background:#ffd70033;border-radius:8px;font-size:.8rem;color:gold}.overlay-buttons{display:flex;flex-direction:column;gap:.75rem;margin-top:1.5rem}@media(max-width:600px){.title-word{font-size:2.5rem}.title-word-2{font-size:2.8rem}.title-features{grid-template-columns:1fr}.hud-stats{gap:.75rem;flex-wrap:wrap}.hp-bar,.xp-bar{width:70px}.overlay-card{padding:2rem}}
