*{box-sizing:border-box;-webkit-tap-highlight-color:transparent;touch-action:manipulation}html,body{margin:0;height:100%;overflow:hidden;background:#3f7d34;overscroll-behavior:none;font-family:Trebuchet MS,Segoe UI,system-ui,sans-serif;color:#3b2a14;user-select:none;-webkit-user-select:none}#game{position:fixed;top:0;right:0;bottom:0;left:0;touch-action:none}#game canvas{display:block;touch-action:none}#ui{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;--st: env(safe-area-inset-top, 0px);--sb: env(safe-area-inset-bottom, 0px);--sl: env(safe-area-inset-left, 0px);--sr: env(safe-area-inset-right, 0px)}#ui>*{pointer-events:auto}.hidden{display:none!important}.title{position:fixed;top:0;right:0;bottom:0;left:0;z-index:50;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:20px;background:linear-gradient(#5fb0e8cc,#3f7d34ee);color:#fff;text-align:center;transition:opacity .4s}.title.done{opacity:0;pointer-events:none}.title .logo{font-size:84px;animation:bob 1s ease-in-out infinite}.title h1{margin:0;font-size:38px;text-shadow:0 3px 0 #2f6b22}.title p{margin:0;font-weight:700;text-shadow:0 2px 0 #2f6b22}.title .name{width:min(320px,100%);font:inherit;font-size:20px;font-weight:800;text-align:center;padding:10px 14px;color:#3b2a14;background:#fff3d1;border:4px solid #c98f3a;border-radius:14px;outline:none;user-select:text;-webkit-user-select:text}.title h2.farmname{margin:0;font-size:28px;text-shadow:0 3px 0 #2f6b22;overflow-wrap:anywhere}.title .btn{font-size:20px;padding:10px 26px}input.name.small{flex:1;min-width:0;font:inherit;font-weight:800;padding:6px 10px;color:#3b2a14;background:#fff;border:3px solid #c98f3a;border-radius:10px;user-select:text;-webkit-user-select:text}#hud{position:absolute;top:calc(6px + var(--st));left:calc(6px + var(--sl));right:calc(6px + var(--sr));display:flex;flex-direction:column;gap:6px;pointer-events:none}#hud .row{display:flex;gap:6px;align-items:center;flex-wrap:wrap}#hud .row>*{pointer-events:auto}.chip{background:#fff8e1;border:3px solid #c98f3a;border-radius:999px;padding:3px 12px;font-weight:700;font-size:15px;box-shadow:0 2px #9a6b22}.chip.click{cursor:pointer}.chip.warn{background:#ffcdd2;border-color:#e53935}.lvl{display:flex;align-items:center;background:#fff8e1;border:3px solid #c98f3a;border-radius:999px;box-shadow:0 2px #9a6b22;overflow:hidden}.lv{padding:3px 10px;font-weight:800;background:#ffd54f}.xpbar{position:relative;width:90px;height:24px;background:#e0cfa8}.xpbar i{position:absolute;left:0;top:0;bottom:0;background:#4fc3f7}.xpbar b{position:absolute;top:0;right:0;bottom:0;left:0;text-align:center;font-size:12px;line-height:24px;text-shadow:0 0 3px #fff}#toast{position:absolute;top:calc(90px + var(--st));left:50%;transform:translate(-50%,-10px);background:#3b2a14e6;color:#fff;padding:8px 16px;border-radius:999px;font-weight:700;opacity:0;transition:.25s;pointer-events:none;max-width:90vw;text-align:center;z-index:5}#toast.show{opacity:1;transform:translate(-50%)}#bar{position:absolute;bottom:calc(8px + var(--sb));left:var(--sl);right:var(--sr);display:flex;gap:8px;justify-content:center;pointer-events:none;padding:0 6px}#bar>*{pointer-events:auto}.bar-btn{position:relative;display:flex;flex-direction:column;align-items:center;min-width:62px;padding:6px 8px 4px;font:inherit;background:#fff8e1;border:3px solid #c98f3a;border-radius:16px;box-shadow:0 3px #9a6b22;cursor:pointer}.bar-btn:active{transform:translateY(2px);box-shadow:0 1px #9a6b22}.bar-btn .ic{font-size:26px;line-height:1}.bar-btn .lb{font-size:11px;font-weight:800}.bar-btn.on{background:#ffe082}.bar-btn.dim{opacity:.6}.bar-btn.pulse{animation:pulse 1s infinite}.badge{position:absolute;top:-8px;right:-6px;background:#e53935;color:#fff;border-radius:999px;min-width:22px;height:22px;font-size:13px;font-weight:800;display:grid;place-items:center;border:2px solid #fff}@keyframes pulse{50%{transform:scale(1.08)}}#tool{position:absolute;bottom:calc(84px + var(--sb));left:50%;transform:translate(-50%);width:max-content;max-width:96vw;pointer-events:auto;display:flex;gap:8px;align-items:center;flex-wrap:wrap;justify-content:center;background:#fff8e1f2;border:3px solid #c98f3a;border-radius:18px;padding:8px 10px}.hint{font-weight:700;font-size:14px}.crops{display:flex;gap:6px;flex-wrap:wrap;justify-content:center}.btn{font:inherit;font-weight:800;font-size:15px;padding:8px 14px;background:#ffe9b0;border:3px solid #c98f3a;border-radius:12px;color:#3b2a14;cursor:pointer;box-shadow:0 3px #9a6b22}.btn:active{transform:translateY(2px);box-shadow:0 1px #9a6b22}.btn.ok{background:#8bd36a;border-color:#4e9a2f;box-shadow:0 3px #3a7522}.btn.cancel{background:#ff9d8f;border-color:#c4493a;box-shadow:0 3px #9c352a}.btn.sel{background:#ffd54f;outline:3px solid #fff}.btn.small{padding:4px 10px;font-size:14px}.btn.round{padding:2px 10px;border-radius:999px;font-size:18px}.btn:disabled{opacity:.45;cursor:default}.overlay{position:fixed;top:0;right:0;bottom:0;left:0;padding-top:env(safe-area-inset-top,0px);background:#0006;display:flex;align-items:flex-end;justify-content:center;z-index:10}.sheet{width:min(640px,100%);max-height:86vh;display:flex;flex-direction:column;background:#fff3d1;border:4px solid #c98f3a;border-bottom:0;border-radius:22px 22px 0 0;box-shadow:0 -4px 20px #0005;animation:up .2s}@media (min-width: 700px){.overlay{align-items:center}.sheet{border-bottom:4px solid #c98f3a;border-radius:22px}}@keyframes up{0%{transform:translateY(40px);opacity:0}}.sheet header{display:flex;align-items:center;justify-content:space-between;padding:8px 14px;background:#f5c86a;border-radius:18px 18px 0 0}.sheet h2{margin:0;font-size:20px}.body{padding:12px 12px calc(12px + env(safe-area-inset-bottom,0px));overflow-y:auto;-webkit-overflow-scrolling:touch}h3{margin:12px 0 6px}.sub{font-size:13px;opacity:.75;margin:4px 0 8px}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(135px,1fr));gap:10px}.card{background:#fffaf0;border:3px solid #e0b868;border-radius:14px;padding:8px;display:flex;flex-direction:column;align-items:center;gap:4px;text-align:center;min-height:100px;justify-content:center}.card.click{cursor:pointer}.card.click:active{transform:scale(.97)}.card.ready{border-color:#4e9a2f;background:#eaffd9}.card.locked{opacity:.5}.card.empty{opacity:.8;border-style:dashed}.big{font-size:34px;line-height:1.1}.bigger{font-size:64px}.needs,.chips{display:flex;flex-wrap:wrap;gap:4px;justify-content:center}.need{background:#fff;border-radius:999px;padding:2px 8px;font-weight:700;font-size:13px;border:2px solid #ddd}.need.ok{border-color:#66bb6a}.need.no{border-color:#ef9a9a;color:#b71c1c}.reward{font-weight:700;font-size:14px}.actions{display:flex;gap:8px;align-items:center;justify-content:center;margin-top:8px;flex-wrap:wrap}.list{display:flex;flex-direction:column;gap:8px}.rowcard{display:flex;align-items:center;gap:10px;background:#fffaf0;border:3px solid #e0b868;border-radius:14px;padding:8px 10px}.rowcard.locked{opacity:.5}.grow{flex:1;display:flex;flex-direction:column;gap:2px}.slots{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}.slot{width:86px;padding:8px 4px;text-align:center;background:#fffaf0;border:3px solid #e0b868;border-radius:14px;display:flex;flex-direction:column;gap:2px}.slot.ready{border-color:#4e9a2f;background:#eaffd9}.slot.empty{opacity:.5;border-style:dashed}.tabs{display:flex;gap:6px;margin-bottom:10px;flex-wrap:wrap}.cap{position:relative;height:22px;background:#e0cfa8;border-radius:999px;overflow:hidden;margin:4px 0 8px}.cap i{position:absolute;inset:0 auto 0 0;background:#8bd36a}.cap b{position:absolute;top:0;right:0;bottom:0;left:0;text-align:center;font-size:13px;line-height:22px}.upgrade{display:flex;gap:6px;align-items:center;flex-wrap:wrap;margin-top:8px}.stepper{display:flex;align-items:center;gap:10px;margin:8px 0}.stepper span{width:90px;font-weight:700}.center{text-align:center;display:flex;flex-direction:column;align-items:center;gap:8px}small{font-size:12px;opacity:.8}.seasonbanner{position:fixed;top:22%;left:50%;z-index:40;display:flex;flex-direction:column;align-items:center;gap:2px;padding:14px 26px 16px;background:#fff8e1f2;color:#3b2a14;border:4px solid #e0b25a;border-radius:22px;box-shadow:0 8px 24px #0005;text-align:center;cursor:pointer;animation:seasonin .6s cubic-bezier(.2,1.6,.4,1) both,seasonout .5s ease-in 4s forwards}.seasonbanner .big{font-size:64px;line-height:1;animation:bob 1s ease-in-out infinite}.seasonbanner b{font-size:22px}.seasonbanner small{font-size:15px;font-weight:700;opacity:.8}@keyframes seasonin{0%{transform:translate(-50%,-40px) scale(.6);opacity:0}to{transform:translate(-50%) scale(1);opacity:1}}@keyframes seasonout{to{transform:translate(-50%,-20px) scale(.9);opacity:0}}