:root{--font: Fredoka, "Nunito", system-ui, sans-serif;--sky: #7ec6f0;--gold: #f7c948;--ink: #24191a;--cream: #fff7e6;--wood: #d9a066;--wood-dark: #a8723f;--wood-ink: #4a2e17;--seeds: #3d8ee6;--birds: #e0402f;--orders: #b06be0;--build: #e08a3c;--garden: #4bb24a;--ok: #66e07a;--warn: #f0a06a;--stroke: -2px -2px 0 var(--ink), 2px -2px 0 var(--ink), -2px 2px 0 var(--ink), 2px 2px 0 var(--ink), 0 3px 0 var(--ink);--safe-t: max(12px, env(safe-area-inset-top));--safe-b: max(14px, env(safe-area-inset-bottom));--safe-l: max(12px, env(safe-area-inset-left));--safe-r: max(12px, env(safe-area-inset-right));--press: .15s cubic-bezier(.22, 1, .36, 1)}*{box-sizing:border-box}html,body{margin:0;height:100%;overflow:hidden;background:var(--sky);touch-action:none;overscroll-behavior:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent}#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}body:after{content:"";position:fixed;inset:0;pointer-events:none;z-index:1;background:radial-gradient(120% 95% at 50% 42%,transparent 52%,var(--vig) 100%)}body{--vig: rgba(20, 30, 45, .26)}body.isl-lava{--vig: rgba(40, 6, 10, .3);--sky: #3b1524}#hud{z-index:2}#hud button,#hud .modal{pointer-events:auto}[hidden]{display:none!important}.btn{font:700 15px/1.15 var(--font);padding:11px 16px;min-height:44px;border-radius:12px;border:3px solid var(--ink);background:var(--cream);color:var(--ink);cursor:pointer;box-shadow:inset 0 2px #fff9,0 3px 0 var(--ink);transition:transform var(--press),box-shadow var(--press)}.btn:active{transform:translateY(2px);box-shadow:inset 0 2px #fff9,0 1px 0 var(--ink)}.btn:focus-visible,.tab:focus-visible,.action:focus-visible{outline:3px solid #fff;outline-offset:2px}.btn.primary{background:linear-gradient(#ffe27a,var(--gold))}.btn[disabled]{opacity:.6;cursor:default;background:#e9e1d2;transform:none}.btn.big{font-size:20px;padding:14px 40px}.tab{font:700 clamp(15px,2.4vw,24px)/1 var(--font);letter-spacing:.04em;color:#fff;padding:10px 22px;min-height:44px;border:3px solid var(--ink);border-radius:12px;box-shadow:inset 0 3px #ffffff59,0 4px 0 var(--ink);cursor:pointer;text-shadow:var(--stroke);transition:transform var(--press),box-shadow var(--press)}.tab:active{transform:translateY(3px);box-shadow:inset 0 3px #ffffff59,0 1px 0 var(--ink)}.tab.seeds{background:var(--seeds)}.tab.birds{background:var(--birds)}.tab.orders{background:var(--orders)}.tab.build{background:var(--build)}.tab.garden{background:var(--garden)}.grain{width:.8em;height:.8em;border-radius:50%/60% 60% 40% 40%;background:radial-gradient(circle at 35% 30%,#fff1b8,var(--gold) 55%,#b8841a);border:2px solid var(--ink);box-shadow:0 2px 0 var(--ink)}.seed{width:.7em;height:.9em;border-radius:50%/30% 30% 70% 70%;background:radial-gradient(circle at 35% 30%,#fff7d0,#f2d24b 50%,#b8841a);border:2px solid var(--ink);box-shadow:0 2px 0 var(--ink);transform:rotate(-20deg)}.swatch{width:44px;height:44px;border-radius:12px;border:3px solid var(--ink);background:radial-gradient(circle at 35% 30%,#fff8,var(--c) 45%,color-mix(in srgb,var(--c),#000 30%));flex:none}.meter{width:90px;height:12px;border-radius:6px;background:#e9e1d2;border:2px solid var(--ink);overflow:hidden}.meter i{display:block;height:100%;background:linear-gradient(90deg,#8b5a2b,#c98b4b)}.hud-top{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;gap:8px;padding-top:var(--safe-t);pointer-events:none}.top{display:flex;gap:10px}.farm-name{font:700 clamp(14px,2vw,20px)/1 var(--font);color:var(--gold);text-shadow:var(--stroke)}.status-row{display:contents}.wallet{position:absolute;left:var(--safe-l);bottom:var(--safe-b);display:flex;flex-direction:column;gap:4px;font:700 clamp(20px,3vw,30px)/1 var(--font);text-shadow:var(--stroke);font-variant-numeric:tabular-nums}.wallet .gold{display:flex;align-items:center;gap:8px;font-size:1.15em}.wallet .seeds-count,.wallet .level{display:flex;align-items:center;gap:8px;font-size:.75em}.level{color:#cfe9ff}.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}.order-chip{position:absolute;left:var(--safe-l);top:var(--safe-t);display:flex;align-items:center;gap:8px;font:700 14px/1.15 var(--font);color:var(--ink);background:var(--cream);border:3px solid var(--ink);border-radius:12px;padding:8px 12px 8px 8px;min-height:44px;box-shadow:0 3px 0 var(--ink);cursor:pointer;text-align:left}.order-chip .swatch{width:24px;height:24px;border-radius:7px;border-width:2px}.map-btn{position:absolute;right:var(--safe-r);top:var(--safe-t);display:flex;align-items:center;gap:6px;font:700 14px/1 var(--font);color:var(--ink);background:var(--cream);border:3px solid var(--ink);border-radius:12px;padding:8px 12px 8px 8px;min-height:44px;box-shadow:0 3px 0 var(--ink);cursor:pointer;transition:transform var(--press),box-shadow var(--press)}.map-btn:active{transform:translateY(2px);box-shadow:0 1px 0 var(--ink)}.map-btn svg{flex:none}.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:700 clamp(15px,2.2vw,20px)/1.35 var(--font);color:var(--cream);background:repeating-linear-gradient(0deg,transparent 0 9px,rgba(0,0,0,.06) 9px 10px),linear-gradient(#e0a86e,#c98b4b);border:3px solid var(--wood-ink);padding:12px 20px;border-radius:10px;box-shadow:inset 0 0 0 3px #f0c48a,0 5px 0 var(--wood-ink);text-shadow:0 2px 0 rgba(0,0,0,.35);text-wrap:balance}.toasts{position:absolute;left:10vw;width:80vw;top:22%;display:flex;flex-direction:column;gap:8px;align-items:center;pointer-events:none}.toast{background:var(--cream);color:var(--ink);padding:12px 22px;border-radius:14px;font:700 clamp(16px,2.4vw,22px)/1.2 var(--font);border:3px solid var(--ink);box-shadow:0 4px 0 var(--ink);animation:pop .2s cubic-bezier(.22,1,.36,1);text-align:center;max-width:100%}.toast.gold{background:linear-gradient(#ffe27a,var(--gold))}.toast.warn{background:var(--warn)}.toast.out{opacity:0;transition:opacity .4s}@keyframes pop{0%{transform:scale(.85);opacity:0}to{transform:scale(1);opacity:1}}.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:var(--ink);background:linear-gradient(#ffe27a,var(--gold));border:3px solid var(--ink);border-radius:16px;padding:14px 28px;min-height:48px;box-shadow:inset 0 3px #ffffff80,0 5px 0 var(--ink),0 8px 16px #00000040;cursor:pointer;white-space:nowrap;transition:transform var(--press),box-shadow var(--press)}.action:active{transform:translate(-50%,4px);box-shadow:inset 0 3px #ffffff80,0 1px 0 var(--ink)}.action.disabled{background:linear-gradient(#efe9dc,#cfc6b4);color:#6b5a44}.action.ok{background:linear-gradient(#a8f0a8,var(--ok))}.build-bar{position:absolute;left:50%;bottom:max(90px,calc(env(safe-area-inset-bottom) + 80px));transform:translate(-50%);display:flex;gap:10px}.build-bar .btn{font-size:17px;padding:12px 20px}.move{position:absolute;left:50%;bottom:max(90px,calc(env(safe-area-inset-bottom) + 80px));transform:translate(-50%);display:inline-flex;align-items:center;gap:8px;font-size:17px;padding:12px 20px}.move:active{transform:translate(-50%,2px)}.jump{position:absolute;right:max(24px,env(safe-area-inset-right));bottom:max(24px,env(safe-area-inset-bottom));width:96px;height:96px;border-radius:50%;font:700 18px/1 var(--font);color:#fff;background:#ffffff47;border:3px solid var(--ink);box-shadow:inset 0 3px #fff6,0 4px 0 var(--ink);text-shadow:var(--stroke);transition:transform var(--press),box-shadow var(--press)}.jump:active{transform:translateY(3px);box-shadow:inset 0 3px #fff6,0 1px 0 var(--ink)}.hint{position:absolute;right:var(--safe-r);bottom:var(--safe-b);font:600 14px/1.3 var(--font);color:var(--ink);background:var(--cream);border:2px solid var(--ink);padding:8px 12px;border-radius:10px;max-width:46vw;transition:opacity 1s}.hint.fade{opacity:0;pointer-events:none}body.touch .hud-top{gap:8px;padding-left:var(--safe-l);padding-right:var(--safe-r)}body.touch .top{width:100%;gap:6px}body.touch .top .tab{flex:1 1 0;font-size:13px;letter-spacing:0;padding:10px 4px;border-radius:10px}body.touch .farm-name{display:none}body.touch .status-row{display:flex;width:100%;justify-content:space-between;align-items:flex-start;gap:8px}body.touch .wallet{position:static;font-size:19px;gap:3px}body.touch .map-btn{position:static;padding:8px 10px 8px 8px}body.touch .map-btn span{display:none}body.touch .order-chip{position:static;flex:1 1 auto;min-width:0;max-width:46%;margin-left:auto;font-size:13px;padding:7px 10px 7px 7px}body.touch .order-chip .text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}body.touch .subtitle{position:static;transform:none;max-width:100%;font-size:15px;padding:10px 14px}body.touch .toasts{position:static;width:100%}body.touch .toast{font-size:15px;padding:10px 14px}body.touch .hint{display:none}body.touch .jump{right:var(--safe-r);bottom:var(--safe-b)}body.touch .action{left:auto;right:var(--safe-r);bottom:calc(var(--safe-b) + 96px + 14px);transform:none;width:120px;height:120px;border-radius:50%;padding:10px;white-space:normal;line-height:1.15;font-size:17px;box-shadow:inset 0 3px #ffffff80,0 6px 0 var(--ink),0 10px 20px #0000004d}body.touch .action:active{transform:translateY(4px);box-shadow:inset 0 3px #ffffff80,0 2px 0 var(--ink)}body.touch .build-bar{left:auto;right:var(--safe-r);bottom:calc(var(--safe-b) + 96px + 14px + 120px + 12px);transform:none;flex-direction:column;align-items:stretch;width:120px}body.touch .build-bar .btn{font-size:15px;padding:10px 12px}body.touch .move{left:auto;right:var(--safe-r);bottom:calc(var(--safe-b) + 96px + 14px + 120px + 12px);transform:none;width:120px;justify-content:center;font-size:15px;padding:10px 12px}body.touch .move:active{transform:translateY(2px)}#joystick{position:fixed;width:130px;height:130px;pointer-events:none;z-index:5;transition:left .15s,top .15s}#joystick .base{position:absolute;inset:0;border-radius:50%;background:#00000038;border:3px solid rgba(36,25,26,.6);box-shadow:inset 0 0 0 12px #ffffff14}#joystick .knob{position:absolute;left:50%;top:50%;width:62px;height:62px;margin:-31px 0 0 -31px;border-radius:50%;background:radial-gradient(circle at 40% 35%,#fff,#e6e6e6 70%);border:3px solid var(--ink);box-shadow:0 4px 0 var(--ink),0 6px 14px #00000040}#joystick.on{transition:none}#joystick.on .base{background:#0000004d;border-color:#ffffffb3}.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{position:relative;background:repeating-linear-gradient(90deg,transparent 0 88px,rgba(0,0,0,.07) 88px 91px),repeating-linear-gradient(0deg,transparent 0 7px,rgba(0,0,0,.04) 7px 8px),linear-gradient(#dfa76c,#cf9459);border:4px solid var(--wood-ink);border-radius:18px;box-shadow:inset 0 0 0 4px #efc48d,0 8px 0 var(--wood-ink),0 16px 30px #0000004d;width:min(720px,100%);max-height:90vh;max-height:90dvh;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;touch-action:pan-y;padding:18px 20px 22px}.modal h1{margin:8px 0 4px;font-size:clamp(22px,4vw,32px);color:var(--cream);text-shadow:var(--stroke)}.modal h2{margin:6px 0 2px;font-size:20px;color:var(--ink)}.modal h3{margin:18px 0 8px;font-size:16px;color:var(--cream);text-shadow:0 2px 0 var(--wood-ink);text-transform:uppercase;letter-spacing:.05em}.modal .sub{margin:0 0 12px;color:var(--cream);font-weight:600;font-size:15px;text-shadow:0 1px 0 var(--wood-ink)}.modal .tabs{display:flex;flex-wrap:wrap;gap:8px;align-items:center}.modal .tabs .tab{font-size:15px;padding:8px 16px;opacity:.6}.modal .tabs .tab.on{opacity:1}.modal .close{margin-left:auto;width:44px;padding:0}.rows{display:flex;flex-direction:column;gap:8px}.row{display:grid;grid-template-columns:48px minmax(0,1fr) auto;align-items:center;gap:12px;background:var(--cream);border:3px solid var(--ink);border-radius:14px;padding:8px 12px;box-shadow:0 3px 0 var(--ink)}.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}.row.order{grid-template-columns:48px minmax(0,1fr) 90px}.avatar{--s: 96px;width:var(--s);height:var(--s);margin:0 auto 8px;border-radius:50%;background:linear-gradient(var(--c) 62%,var(--c2) 62%);border:3px solid var(--ink);position:relative;flex:none}.avatar .eye{position:absolute;top:22%;width:36%;height:36%;border-radius:50%;background:radial-gradient(circle at 60% 55%,var(--ink) 0 26%,#fff 28%);border:3px solid var(--ink)}.avatar .eye.l{left:10%}.avatar .eye.r{left:52%;top:18%;width:40%;height:40%}.avatar .beak{position:absolute;left:44%;top:58%;width:0;height:0;border-left:8px solid transparent;border-right:8px solid transparent;border-top:14px solid var(--b);filter:drop-shadow(0 2px 0 var(--ink))}.avatar.small{--s: 44px;margin:0;border-width:2px}.avatar.small .eye{border-width:2px}.avatar.small .beak{border-left-width:4px;border-right-width:4px;border-top-width:7px}.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:var(--cream);border:3px solid var(--ink);box-shadow:0 4px 0 var(--ink);border-radius:16px;padding:16px 14px;display:flex;flex-direction:column;gap:6px}.picker .card p{margin:0;font-size:14px;color:#5a4a3a;min-height:2.6em}.picker .stats{list-style:none;margin:0 0 8px;padding:0;font-size:13px;color:#7a6a5a}.picker .card .btn{margin-top:auto}.farmers{display:flex;gap:12px;justify-content:center;margin:6px 0 18px}.farmer{display:flex;flex-direction:column;align-items:center;gap:8px;font:700 16px/1 var(--font);color:var(--ink);background:var(--cream);border:3px solid var(--ink);border-radius:16px;padding:12px 18px;box-shadow:0 4px 0 var(--ink);cursor:pointer;opacity:.6}.farmer.on{opacity:1;background:linear-gradient(#ffe27a,var(--gold))}.face{width:64px;height:64px;border-radius:50%;background:#f6cfa9;border:3px solid var(--ink);position:relative;overflow:hidden}.face:before{content:"";position:absolute;left:-10%;top:-6px;width:120%;height:26px;background:#e6c27f;border-bottom:3px solid var(--ink)}.face:after{content:"";position:absolute;left:14px;top:28px;width:10px;height:10px;border-radius:50%;background:var(--ink);box-shadow:20px 0 0 var(--ink)}.face.woman:before{background:#c9782e;height:22px}.map .panel{width:min(640px,100%)}.map .tabs h1{margin:0}.map .board{position:relative;margin:8px 0 12px;background:linear-gradient(#7ec6f0,#a9dcf7);border:3px solid var(--ink);border-radius:16px;overflow:hidden}.map .board svg{display:block;width:100%;height:auto}.map .isl-label{position:absolute;transform:translate(-50%);display:flex;flex-direction:column;align-items:center;gap:1px;font-size:11px;line-height:1.1;color:var(--ink);text-align:center;pointer-events:none}.map .isl-label b{background:var(--cream);border:2px solid var(--ink);border-radius:8px;padding:3px 6px;box-shadow:0 2px 0 var(--ink);white-space:nowrap}.map .isl-label span{font-weight:700;color:#fff;text-shadow:var(--stroke);font-size:11px}.map .isl-label .peek{pointer-events:auto;margin-top:2px;min-height:26px;padding:3px 10px;font-size:11px;border-width:2px;border-radius:8px;box-shadow:inset 0 1px #fff9,0 2px 0 var(--ink);background:linear-gradient(#ffe27a,var(--gold))}.map .isl.here path:first-of-type{filter:drop-shadow(0 0 0 #fff)}.map .row.progress{grid-template-columns:48px minmax(0,1fr) 90px}.map .row.progress .meter{width:90px}.daily .panel{width:min(640px,100%);text-align:center}.daily .days{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;margin:10px 0 16px}.daily .day{background:var(--cream);border:3px solid var(--ink);border-radius:12px;padding:8px 4px;display:flex;flex-direction:column;gap:6px;align-items:center;font-size:13px;opacity:.55}.daily .day b{font-size:12px}.daily .day span{display:flex;align-items:center;gap:3px;font-weight:700}.daily .day i{display:inline-block;width:12px;height:12px;border-radius:50%;border:2px solid var(--ink);background:radial-gradient(circle at 35% 30%,#fff1b8,var(--gold) 55%,#b8841a)}.daily .day i.seed{border-radius:50%/30% 30% 70% 70%;background:radial-gradient(circle at 35% 30%,#fff7d0,#f2d24b 50%,#b8841a)}.daily .day.done{opacity:.9;background:#e9e1d2}.daily .day.today{opacity:1;background:linear-gradient(#ffe27a,var(--gold));transform:scale(1.08);box-shadow:0 4px 0 var(--ink)}@media(max-width:640px){.modal{padding:0;align-items:flex-end}.modal .panel{width:100%;max-height:88vh;max-height:88dvh;border-radius:20px 20px 0 0;border-bottom:0;box-shadow:inset 0 0 0 4px #efc48d;padding:14px 14px calc(16px + env(safe-area-inset-bottom))}.modal .tabs .tab{font-size:13px;padding:9px 12px}.row{grid-template-columns:44px minmax(0,1fr);gap:8px 10px}.row .swatch,.row .avatar.small{width:40px;height:40px}.row>.btn,.row>.meter{grid-column:1 / -1;width:100%}.row>.btn{white-space:normal}.row.order,.map .row.progress{grid-template-columns:44px minmax(0,1fr)}.map .isl-label{font-size:10px}.map .isl-label b{white-space:normal;max-width:84px}.daily .days{grid-template-columns:repeat(4,1fr)}.daily .day.today{transform:none}.picker .cards{grid-template-columns:1fr}.picker .card p{min-height:0}.farmer{padding:10px 14px}}@media(max-height:460px)and (pointer:coarse){.hud-top{gap:6px}body.touch .top .tab{min-height:38px;padding:7px 4px}body.touch .wallet{flex-direction:row;gap:14px;font-size:17px}body.touch .action{width:96px;height:96px;font-size:15px;bottom:calc(var(--safe-b) + 72px + 10px)}body.touch .jump{width:72px;height:72px;font-size:15px}body.touch .build-bar,body.touch .move{bottom:calc(var(--safe-b) + 72px + 10px + 96px + 10px);width:96px}}@media(prefers-reduced-motion:reduce){.toast{animation:none}.btn,.tab,.action,.jump,#joystick{transition:none}}
