:root{--font: Fredoka, "Nunito", system-ui, sans-serif;--sky: #7ec6f0;--grass: #3ca34a;--gold: #f2b632;--brown: #7a4b2a;--seeds: #2f7fd8;--garden: #3ca34a;--sell: #e0402f}*{box-sizing:border-box}html,body{margin:0;height:100%;overflow:hidden;background:var(--sky);touch-action:none;overscroll-behavior:none}#game{position:fixed;inset:0;width:100%;height:100%;display:block}#hud{position:fixed;inset:0;pointer-events:none;font-family:var(--font);color:#fff;user-select:none;-webkit-user-select:none}#hud>*{pointer-events:auto}.top{position:absolute;top:max(12px,env(safe-area-inset-top));left:50%;transform:translate(-50%);display:flex;gap:10px}.tab{font:700 clamp(15px,2.4vw,24px)/1 var(--font);letter-spacing:.04em;color:#fff;padding:10px 22px;border:3px solid rgba(255,255,255,.85);border-radius:8px;box-shadow:0 4px #00000040;cursor:pointer;text-shadow:0 2px 0 rgba(0,0,0,.3);transition:transform .08s}.tab:active{transform:translateY(3px);box-shadow:0 1px #00000040}.tab.seeds{background:var(--seeds)}.tab.garden{background:var(--garden)}.tab.sell{background:var(--sell)}.farm-name{position:absolute;top:calc(max(12px,env(safe-area-inset-top)) + 58px);left:50%;transform:translate(-50%);font:700 clamp(14px,2vw,20px)/1 var(--font);color:var(--gold);text-shadow:0 2px 0 rgba(0,0,0,.35)}.gold{position:absolute;left:max(14px,env(safe-area-inset-left));bottom:max(14px,env(safe-area-inset-bottom));display:flex;align-items:center;gap:8px;font:700 clamp(22px,3.4vw,34px)/1 var(--font);text-shadow:0 2px 0 rgba(0,0,0,.35),0 0 12px rgba(0,0,0,.25);font-variant-numeric:tabular-nums}.grain{width:.8em;height:.8em;border-radius:50%/60% 60% 40% 40%;background:radial-gradient(circle at 35% 30%,#fff1b8,var(--gold) 55%,#b8841a);box-shadow:0 2px #0000004d}.hint{position:absolute;right:max(14px,env(safe-area-inset-right));bottom:max(14px,env(safe-area-inset-bottom));font:500 14px/1.3 var(--font);background:#00000059;padding:8px 12px;border-radius:8px;max-width:46vw;transition:opacity 1s}.hint.fade{opacity:0;pointer-events:none}.toast{position:absolute;left:50%;top:40%;transform:translate(-50%,-50%);background:#0009;padding:12px 20px;border-radius:10px;font:600 18px/1 var(--font)}#joystick{position:fixed;width:120px;height:120px;margin:-60px 0 0 -60px;border-radius:50%;background:#ffffff2e;border:2px solid rgba(255,255,255,.5);pointer-events:none;display:none}#joystick.on{display:block}#joystick .knob{position:absolute;left:50%;top:50%;width:56px;height:56px;margin:-28px 0 0 -28px;border-radius:50%;background:#ffffffbf;box-shadow:0 3px #00000040}.wallet{position:absolute;left:max(14px,env(safe-area-inset-left));bottom:max(14px,env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:4px;font:700 clamp(20px,3vw,30px)/1 var(--font);text-shadow:0 2px 0 rgba(0,0,0,.35),0 0 12px rgba(0,0,0,.25);font-variant-numeric:tabular-nums}.wallet .gold{position:static}.wallet .seeds-count,.wallet .level{display:flex;align-items:center;gap:8px;font-size:.75em}.seed{width:.7em;height:.9em;border-radius:50%/30% 30% 70% 70%;background:radial-gradient(circle at 35% 30%,#fff7d0,#f2d24b 50%,#b8841a);box-shadow:0 2px #0000004d;transform:rotate(-20deg)}.level{color:#cfe9ff}.action{position:absolute;left:50%;bottom:max(22px,calc(env(safe-area-inset-bottom) + 10px));transform:translate(-50%);font:700 clamp(18px,2.8vw,26px)/1 var(--font);color:#2b1d0e;background:linear-gradient(#ffe27a,var(--gold));border:3px solid #fff3c4;border-radius:14px;padding:14px 28px;box-shadow:0 5px #a8731b,0 8px 16px #00000040;cursor:pointer;white-space:nowrap}.action:active{transform:translate(-50%,4px);box-shadow:0 1px #a8731b}.action.disabled{background:linear-gradient(#e8e8e8,#bdbdbd);border-color:#f4f4f4;box-shadow:0 5px #8a8a8a;color:#555}.subtitle{position:absolute;left:50%;bottom:max(100px,calc(env(safe-area-inset-bottom) + 90px));transform:translate(-50%);max-width:min(80vw,560px);text-align:center;font:600 clamp(15px,2.2vw,20px)/1.35 var(--font);color:#fff;background:#1e2a20c7;border:2px solid rgba(255,255,255,.25);padding:10px 18px;border-radius:12px;text-wrap:balance}.tab.birds{background:#e0402f}.level{display:flex;align-items:center;gap:8px}.xpbar{display:inline-block;width:80px;height:8px;border-radius:4px;background:#00000059;overflow:hidden}.xpbar i{display:block;height:100%;width:0;background:linear-gradient(90deg,#8fd3ff,#cfe9ff);transition:width .3s}.toasts{position:absolute;left:10vw;width:80vw;top:22%;display:flex;flex-direction:column;gap:8px;align-items:center;pointer-events:none}.toast{background:#1e2a20d9;color:#fff;padding:12px 22px;border-radius:12px;font:700 clamp(16px,2.4vw,22px)/1.2 var(--font);border:2px solid rgba(255,255,255,.25);animation:pop .25s ease-out;text-align:center;max-width:80vw}.toast.gold{background:linear-gradient(#ffe27a,var(--gold));color:#2b1d0e;border-color:#fff3c4}.toast.warn{background:#8a4b2a}.toast.out{opacity:0;transition:opacity .4s}@keyframes pop{0%{transform:scale(.7);opacity:0}to{transform:scale(1);opacity:1}}.modal[hidden]{display:none}.modal{position:fixed;inset:0;background:#14281e8c;display:flex;align-items:center;justify-content:center;padding:16px;font-family:var(--font);color:#2b1d0e;z-index:10}.modal .panel{background:#fff9ec;border:4px solid #e8c37a;border-radius:18px;box-shadow:0 10px #0003;width:min(720px,100%);max-height:90vh;overflow:auto;padding:18px 20px 22px}.modal h1{margin:8px 0 4px;font-size:clamp(22px,4vw,32px);color:#7a4b2a}.modal h2{margin:6px 0 2px;font-size:20px}.modal h3{margin:18px 0 8px;font-size:16px;color:#7a4b2a;text-transform:uppercase;letter-spacing:.05em}.modal .sub{margin:0 0 12px;color:#6b5a44;font-size:15px}.modal .tabs{display:flex;gap:8px;align-items:center}.modal .tabs .tab{font-size:15px;padding:8px 16px;opacity:.55}.modal .tabs .tab.on{opacity:1}.modal .close{margin-left:auto}.btn{font:700 15px/1 var(--font);padding:10px 16px;border-radius:10px;border:2px solid #d8c39a;background:#f4ead6;color:#2b1d0e;cursor:pointer;box-shadow:0 3px #c9b184;white-space:nowrap}.btn:active{transform:translateY(2px);box-shadow:0 1px #c9b184}.btn.primary{background:linear-gradient(#ffe27a,var(--gold));border-color:#fff3c4;box-shadow:0 3px #a8731b}.btn[disabled]{opacity:.55;cursor:default}.rows{display:flex;flex-direction:column;gap:8px}.row{display:grid;grid-template-columns:44px 1fr auto;align-items:center;gap:12px;background:#fff;border:2px solid #eadcbf;border-radius:12px;padding:8px 12px}.row .info{display:flex;flex-direction:column;gap:2px;min-width:0}.row .info b{font-size:16px}.row .info b small{font-weight:500;color:#8a7a5a;font-size:12px;margin-left:6px}.row .info span{font-size:13px;color:#6b5a44}.swatch{width:40px;height:40px;border-radius:10px;background:radial-gradient(circle at 35% 30%,#fff8,var(--c) 45%,color-mix(in srgb,var(--c),#000 30%))}.avatar{width:96px;height:96px;margin:0 auto 8px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff5,var(--c) 45%,color-mix(in srgb,var(--c),#000 30%));position:relative;box-shadow:inset 0 -18px 0 var(--c2)}.avatar .beak{position:absolute;right:8px;top:40px;width:0;height:0;border-top:8px solid transparent;border-bottom:8px solid transparent;border-left:18px solid var(--b)}.avatar.small{width:40px;height:40px;margin:0;box-shadow:inset 0 -8px 0 var(--c2)}.meter{width:90px;height:10px;border-radius:5px;background:#eadcbf;overflow:hidden}.meter i{display:block;height:100%;background:linear-gradient(90deg,#8b5a2b,#c98b4b)}.picker .panel{width:min(900px,100%);text-align:center}.picker .cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px;margin-top:12px}.picker .card{background:#fff;border:2px solid #eadcbf;border-radius:14px;padding:16px 14px;display:flex;flex-direction:column;gap:6px}.picker .card p{margin:0;font-size:14px;color:#6b5a44;min-height:2.6em}.picker .stats{list-style:none;margin:0 0 8px;padding:0;font-size:13px;color:#8a7a5a}.picker .card .btn{margin-top:auto}