:root{--color-sky-top: #9fd4ef;--color-sky-mid: #c8e8c0;--color-ground: #5a9a4a;--color-ground-deep: #3f7a38;--color-title: #1e3d2f;--color-project: #2f5a40;--color-tagline: #355a3f;--color-mark: #e8a838;--shadow-soft: 0 8px 24px rgba(30, 61, 47, .12);--touch-min: 44px;font-family:Trebuchet MS,Segoe UI,Candara,sans-serif;line-height:1.4;font-weight:400;color:var(--color-title);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-tap-highlight-color:transparent;-webkit-text-size-adjust:100%;text-size-adjust:100%}*,*:before,*:after{box-sizing:border-box}html,body,#root{margin:0;min-height:100%;min-height:100dvh}body{min-width:320px;-webkit-user-select:none;user-select:none;touch-action:manipulation}.game{position:relative;display:flex;flex-direction:column;gap:.55rem;min-height:100dvh;min-height:100svh;padding:max(.55rem,env(safe-area-inset-top)) max(.55rem,env(safe-area-inset-right)) max(.55rem,env(safe-area-inset-bottom)) max(.55rem,env(safe-area-inset-left));background:linear-gradient(180deg,#6fa8c9,#87b56a 28%,#5f8f45);overflow:hidden}.topbar{display:flex;align-items:center;justify-content:space-between;gap:.75rem;flex-shrink:0}.brand-block{min-width:0;display:flex;align-items:center;gap:.65rem}.zoo-logo{width:clamp(5rem,14vw,7.5rem);height:auto;aspect-ratio:200 / 120;flex-shrink:0;border-radius:.85rem;background:#fff8e7d9;box-shadow:0 3px #0000001a;object-fit:contain;padding:.2rem .35rem;animation:logo-bob 2.8s ease-in-out infinite}.brand-text{min-width:0}@keyframes logo-bob{0%,to{transform:translateY(0)}50%{transform:translateY(-3px)}}.game-title{margin:0;font-family:Georgia,Palatino Linotype,Palatino,Times New Roman,serif;font-size:clamp(1.45rem,3.5vw,2rem);line-height:1.1;color:#1e3d2f;text-shadow:0 1px 0 rgba(255,255,255,.35)}.game-sub{margin:.1rem 0 0;font-size:.8rem;font-weight:600;color:#2f5a40}.money{margin:0;min-width:var(--touch-min);min-height:var(--touch-min);display:grid;place-items:center;padding:.45rem .8rem;border-radius:.85rem;background:#fff8e7;border:3px solid #c4a35a;font-size:1.2rem;font-weight:700;box-shadow:0 3px #50371433}.hint{margin:0;padding:.55rem .75rem;border-radius:.75rem;background:#fff8e7eb;border:2px solid rgba(30,61,47,.12);font-size:clamp(.95rem,2.2vw,1.1rem);min-height:var(--touch-min);display:flex;align-items:center}.income-line{margin:0;padding:.35rem .65rem;border-radius:.65rem;background:#1e3d2f24;font-size:.88rem;font-weight:600}.map-screen,.panel-screen{flex:1;display:flex;flex-direction:column;gap:.55rem;min-height:0;animation:fade-up .3s ease-out both}.park-grid{position:relative;flex:1;display:grid;grid-template-columns:repeat(var(--grid-cols, 10),minmax(0,1fr));grid-template-rows:repeat(var(--grid-rows, 6),minmax(0,1fr));gap:1px;min-height:0;padding:.3rem;border-radius:.85rem;background:#355f2b;border:4px solid #243f1d;box-shadow:inset 0 0 0 2px #ffffff0f,0 8px 18px #14281440;touch-action:none;overflow:hidden}.park-placing .tile.grass{outline:2px dashed rgba(255,248,231,.5);outline-offset:-3px}.tile{appearance:none;border:none;margin:0;padding:0;min-width:0;min-height:0;position:relative;display:grid;place-items:stretch;cursor:pointer;font:inherit;color:#1e3d2f;overflow:hidden}.tile.grass{background:radial-gradient(circle at 30% 30%,rgba(255,255,255,.12),transparent 40%),repeating-linear-gradient(90deg,#5f9a48 0 10px,#569043 10px 20px)}.tile-sheen{position:absolute;inset:0;pointer-events:none}.tile-buildable:active,.tile-drop{box-shadow:inset 0 0 0 3px #fff4a8;background:#7fbf5a}.tile.building{background:transparent;touch-action:none}.tile-ghost{opacity:.3}.td{display:block;width:100%;height:100%;position:relative}.td-path{background:repeating-linear-gradient(90deg,#c4a574 0 6px,#b08968 6px 12px),#a67c52;box-shadow:inset 0 0 0 1px #50321440}.td-river{background:linear-gradient(90deg,#38bdf8,#0ea5e9 40%,#0284c7 60%,#38bdf8);background-size:200% 100%;animation:flow 3.5s linear infinite}.td-lake{background:radial-gradient(circle at 50% 45%,#7dd3fc,#0ea5e9 45%,#0369a1);border-radius:40%;margin:4%;width:92%;height:92%}.td-tree{background:radial-gradient(circle at 50% 50%,#4ade80,#16a34a 55%,#166534);border-radius:50%;margin:8%;width:84%;height:84%;box-shadow:0 0 0 2px #14501e40}.td-tree:after{content:"";position:absolute;left:46%;top:55%;width:10%;height:22%;background:#7c4a1a;border-radius:2px}.td-log{background:linear-gradient(180deg,#a16207,#7c4a1a);border-radius:40%/50%;margin:28% 8%;width:84%;height:44%;box-shadow:inset 0 0 0 2px #00000026}.td-entrance{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.15rem;background:linear-gradient(180deg,#d6b07c,#b08968);border:2px solid #6b3f1d}.td-gate{width:70%;height:45%;border:3px solid #3b2a22;border-bottom:none;border-radius:60% 60% 0 0/100% 100% 0 0;background:#fff8e759}.td-building{display:flex;flex-direction:column;min-height:100%;background:color-mix(in srgb,var(--plot-color) 35%,#fff8e7);border:2px solid color-mix(in srgb,var(--plot-color) 70%,#1e1e1e)}.td-roof{height:42%;background:repeating-linear-gradient(90deg,color-mix(in srgb,var(--plot-color) 80%,#111) 0 8px,color-mix(in srgb,var(--plot-color) 65%,#333) 8px 16px);border-bottom:2px solid rgba(0,0,0,.18)}.td-footprint{flex:1;display:grid;place-items:center;padding:.1rem;background:linear-gradient(180deg,rgba(255,255,255,.2),transparent),color-mix(in srgb,var(--plot-color) 40%,#f5efe0)}.td-caption{font-size:clamp(.48rem,1vw,.7rem);font-weight:700;text-align:center;line-height:1.1;padding:.1rem .15rem;border-radius:.2rem;background:#fff8e7d9}.pen{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;min-height:100%;padding:.12rem;background:radial-gradient(circle at 50% 70%,rgba(255,255,255,.12),transparent 45%),repeating-linear-gradient(90deg,#7aaa4f 0 8px,#6f9f46 8px 16px);box-shadow:inset 0 0 0 3px #5a4030;overflow:hidden}.pen-filled{background:radial-gradient(circle at 50% 40%,rgba(255,248,231,.2),transparent 50%),repeating-linear-gradient(90deg,#6fa24a 0 8px,#628f40 8px 16px)}.gehege-target{box-shadow:inset 0 0 0 3px #ffe566;z-index:1}.pen-fence{position:absolute;inset:2px;border:2px dashed rgba(90,64,48,.5);pointer-events:none}.animal-row{flex:1;width:100%;min-height:0;display:flex;align-items:center;justify-content:center;gap:.1rem;padding:.1rem}.animal-art{width:92%;height:100%;max-height:70%;object-fit:contain;pointer-events:none;filter:drop-shadow(0 2px 1px rgba(0,0,0,.2))}.animal-row.count-2 .animal-art{width:48%}.pen-empty{flex:1;display:grid;place-items:center;font-size:.7rem;font-weight:700}.pen-label{width:100%;padding:.1rem .15rem;border-radius:.2rem;background:#fff8e7e6;font-size:clamp(.48rem,.95vw,.68rem);font-weight:700;line-height:1.15;text-align:center}.visitors-layer{position:absolute;inset:.3rem;pointer-events:none;z-index:3}.visitor{position:absolute;width:.7rem;height:.7rem;margin:-.35rem 0 0 -.35rem;border-radius:50%;background:radial-gradient(circle at 35% 30%,#ffe8c8,#c27a4a 60%,#6b3f1d);border:1.5px solid #3b2a22;box-shadow:0 1px #00000040;transition:left .65s linear,top .65s linear}.drag-ghost{position:absolute;z-index:5;width:calc(100% / var(--grid-cols, 10) * 1.35);max-width:7rem;aspect-ratio:1.4;transform:translate(-50%,-60%) scale(1.08);display:grid;place-items:center;padding:.25rem;border-radius:.45rem;background:#fff8e7f2;border:3px solid #5a4030;box-shadow:0 10px 18px #00000047;pointer-events:none}.drag-ghost img{width:100%;height:100%;object-fit:contain}.actions{display:flex;flex-wrap:wrap;gap:.45rem;flex-shrink:0}.big-btn{appearance:none;border:3px solid rgba(0,0,0,.12);min-height:var(--touch-min);min-width:var(--touch-min);padding:.7rem .85rem;border-radius:.85rem;font:inherit;font-size:1rem;font-weight:700;cursor:pointer;flex:1 1 auto;box-shadow:0 3px #0000001f}.shop-btn{background:#1e3d2f;color:#fff7e8}.accent-btn{background:#9a3412;color:#fff7e8}.ghost-btn{background:#fff8e7;color:#1e3d2f}.big-btn:active{transform:translateY(1px);box-shadow:0 1px #0000001f}.panel-head{display:flex;align-items:center;justify-content:space-between;gap:.75rem}.panel-head h2{margin:0;font-size:clamp(1.3rem,3vw,1.7rem)}.shop-grid,.care-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.55rem;overflow:auto;padding-bottom:.2rem}.shop-card,.care-btn{appearance:none;border:3px solid rgba(30,61,47,.15);border-radius:.9rem;min-height:5.2rem;padding:.7rem;display:flex;flex-direction:column;align-items:flex-start;justify-content:space-between;gap:.3rem;text-align:left;background:#fff8e7;color:#1e3d2f;cursor:pointer;font:inherit;box-shadow:0 3px #00000014}.shop-card{border-color:color-mix(in srgb,var(--plot-color) 50%,#1e3d2f)}.shop-card:active,.care-btn:active{transform:translateY(1px)}.shop-card-disabled{opacity:.45;cursor:not-allowed}.shop-badge{display:grid;place-items:center;width:2.2rem;height:2.2rem;border-radius:.55rem;background:color-mix(in srgb,var(--plot-color) 75%,#fff);color:#fff;font-weight:700}.shop-animal,.care-animal{width:100%;max-height:4.5rem;object-fit:contain;pointer-events:none}.care-animal{max-height:6rem;background:#fff8e7b3;border-radius:.75rem;padding:.35rem}.shop-name,.care-name{font-size:1.05rem;font-weight:700}.shop-price,.care-level,.care-cost,.care-summary{font-size:.95rem}.care-summary{margin:0;font-weight:600}@keyframes fade-up{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes flow{0%{background-position:0 0}to{background-position:200% 0}}
