:root{--green-dark: #2d5a1e;--green-mid: #4a8c2a;--green-light: #6db840;--sky-top: #87ceeb;--sky-bottom: #b8e6ff;--bee-yellow: #f5c842;--bee-dark: #2a1a00;--bf-purple: #c084fc;--bf-pink: #f472b6;--flower-ground: #3b6b1e}*{box-sizing:border-box;margin:0;padding:0}html,body,#root{height:100%;overflow:hidden}body{font-family:Segoe UI,system-ui,-apple-system,sans-serif;background:var(--sky-top)}.game-root{display:flex;flex-direction:column;align-items:center;min-height:100vh;position:relative;overflow:hidden}.sky{position:fixed;top:0;right:0;bottom:0;left:0;background:linear-gradient(180deg,var(--sky-top) 0%,var(--sky-bottom) 50%,#d4f0c0 70%,var(--green-light) 100%);z-index:0}.sun{position:absolute;top:30px;right:80px;width:80px;height:80px;background:radial-gradient(circle,#fff7ae,#ffd54f 40%,transparent 70%);border-radius:50%;animation:sun-pulse 4s ease-in-out infinite}@keyframes sun-pulse{0%,to{transform:scale(1);opacity:.9}50%{transform:scale(1.08);opacity:1}}.cloud{position:absolute;background:#fffc;border-radius:50px;animation:cloud-drift linear infinite}.c1{width:120px;height:40px;top:40px;left:-120px;animation-duration:25s}.c2{width:90px;height:32px;top:90px;left:-90px;animation-duration:35s;animation-delay:8s}.c3{width:150px;height:45px;top:60px;left:-150px;animation-duration:30s;animation-delay:15s}@keyframes cloud-drift{0%{transform:translate(0)}to{transform:translate(calc(100vw + 200px))}}.scoreboard{position:relative;z-index:10;display:flex;align-items:center;gap:1.5rem;margin-top:1.2rem;margin-bottom:.8rem}.score{display:flex;align-items:center;gap:.6rem;background:#ffffffd9;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);padding:.5rem 1.2rem;border-radius:1rem;box-shadow:0 2px 12px #0000001a}.critter-icon{font-size:1.6rem}.score-label{font-weight:700;font-size:.85rem;letter-spacing:.08em;color:#333}.bee-score .score-label{color:#a16207}.bf-score .score-label{color:#7c3aed}.score-num{font-size:1.6rem;font-weight:800;min-width:2ch;text-align:center}.bee-score .score-num{color:#ca8a04}.bf-score .score-num{color:#8b5cf6}.vs-badge{font-weight:900;font-size:1.1rem;color:#ef4444;text-shadow:0 1px 4px rgba(0,0,0,.15);letter-spacing:.1em}.garden-wrapper{position:relative;z-index:5}.garden{position:relative;width:800px;height:500px;background:radial-gradient(ellipse at 20% 80%,#5fa83a 0%,transparent 50%),radial-gradient(ellipse at 70% 70%,#4a9e2b 0%,transparent 40%),radial-gradient(ellipse at 50% 90%,#3b7a1e 0%,transparent 60%),linear-gradient(180deg,#6db840,#4a8c2a 40%,#3b6b1e);border-radius:1rem;border:3px solid rgba(255,255,255,.3);box-shadow:0 8px 32px #00000026,inset 0 2px 20px #ffffff1a;overflow:hidden}.grass{position:absolute;bottom:0;width:80px;height:60px;background:radial-gradient(ellipse at 50% 100%,#2d5a1e 0%,transparent 70%);opacity:.5}.flower{position:absolute;font-size:1.8rem;transform:translate(-50%,-50%);animation:flower-sway 3s ease-in-out infinite;filter:drop-shadow(0 2px 4px rgba(0,0,0,.2));transition:opacity .3s}@keyframes flower-sway{0%,to{transform:translate(-50%,-50%) rotate(-3deg)}50%{transform:translate(-50%,-50%) rotate(3deg)}}.critter{position:absolute;pointer-events:none;z-index:20}.bee-body{position:relative;width:44px;height:44px}.bee-face{font-size:2.2rem;position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;z-index:2}.bee-wing{position:absolute;width:20px;height:14px;background:#fff9;border:1px solid rgba(255,255,255,.8);border-radius:50%;top:2px;z-index:1}.bee-wing-l{left:-4px;transform-origin:right center;animation:wing-flap-l .08s ease-in-out infinite alternate}.bee-wing-r{right:-4px;transform-origin:left center;animation:wing-flap-r .08s ease-in-out infinite alternate}@keyframes wing-flap-l{0%{transform:rotate(-20deg) scaleY(1)}to{transform:rotate(20deg) scaleY(.7)}}@keyframes wing-flap-r{0%{transform:rotate(20deg) scaleY(1)}to{transform:rotate(-20deg) scaleY(.7)}}.bf-body{position:relative;width:48px;height:48px}.bf-face{font-size:2.4rem;position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;z-index:2}.bf-wing{position:absolute;width:22px;height:18px;border-radius:50% 50% 50% 0;top:4px;z-index:1}.bf-wing-l{left:-2px;background:linear-gradient(135deg,var(--bf-purple),var(--bf-pink));transform-origin:right center;animation:bf-wing-l .4s ease-in-out infinite alternate}.bf-wing-r{right:-2px;background:linear-gradient(225deg,var(--bf-purple),var(--bf-pink));transform-origin:left center;animation:bf-wing-r .4s ease-in-out infinite alternate}@keyframes bf-wing-l{0%{transform:rotate(-15deg) scaleX(1)}to{transform:rotate(10deg) scaleX(.6)}}@keyframes bf-wing-r{0%{transform:rotate(15deg) scaleX(1)}to{transform:rotate(-10deg) scaleX(.6)}}.nectar-bars{position:relative;z-index:10;display:flex;align-items:center;gap:.8rem;margin-top:.8rem;width:800px}.nectar-bar{flex:1;height:12px;background:#ffffff4d;border-radius:6px;overflow:hidden;border:1px solid rgba(255,255,255,.2)}.nectar-fill{height:100%;background:linear-gradient(90deg,#f59e0b,#facc15);border-radius:6px;transition:width .4s ease}.bf-fill{background:linear-gradient(90deg,#8b5cf6,#c084fc)}.nectar-label{font-size:.7rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:#ffffffb3;white-space:nowrap}.overlay{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;background:#00000073;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);z-index:50;border-radius:1rem}.overlay-card{background:#fffffff2;padding:2.5rem 3rem;border-radius:1.2rem;text-align:center;box-shadow:0 12px 40px #00000040;max-width:400px}.overlay-card h1{font-size:2rem;font-weight:800;color:#1a1a1a;margin-bottom:.5rem}.overlay-card p{color:#555;font-size:1.05rem;margin-bottom:1.2rem}.win-card h1{font-size:1.8rem}.controls{display:flex;flex-direction:column;gap:.5rem;margin-bottom:1.5rem;font-size:.9rem;color:#444}kbd{display:inline-block;background:#e5e7eb;border:1px solid #d1d5db;border-radius:4px;padding:.1rem .4rem;font-family:ui-monospace,monospace;font-size:.8rem;margin:0 .1rem}button{background:linear-gradient(135deg,#f59e0b,#f97316);color:#fff;border:none;padding:.8rem 2.5rem;font-size:1.1rem;font-weight:700;border-radius:.6rem;cursor:pointer;transition:transform .15s,box-shadow .15s;box-shadow:0 4px 14px #f9731666}button:hover{transform:translateY(-2px);box-shadow:0 6px 20px #f9731680}button:active{transform:translateY(0)}