:root{--bg:#1a2a1a;--bg-light:#243424;--bg-dark:#0f1a0f;--accent:#4a8;--accent-light:#6db;--gold:#fd0;--text:#e8e8d0;--text-dim:#8a8a70;--border:#3a4a3a;--danger:#c44;--success:#4a8}*{box-sizing:border-box;margin:0;padding:0}body{background:var(--bg);color:var(--text);height:100dvh;font-family:system-ui,-apple-system,Segoe UI,sans-serif;overflow:hidden}.app{flex-direction:column;height:100dvh;display:flex}.top-bar{background:var(--bg-dark);border-bottom:1px solid var(--border);flex-shrink:0;justify-content:space-between;align-items:center;gap:8px;padding:6px 12px;display:flex}.top-left,.top-right{align-items:center;gap:10px;display:flex}.top-center{color:var(--text-dim);gap:12px;font-size:.85rem;display:flex}.stat{font-size:.9rem;font-weight:600}.stat.gold{color:var(--gold)}.xp-bar{background:#222;border-radius:3px;width:60px;height:6px;overflow:hidden}.xp-fill{background:linear-gradient(90deg, var(--accent), var(--accent-light));border-radius:3px;height:100%;transition:width .3s}.speed-btn,.pause-btn{background:var(--bg-light);border:1px solid var(--border);color:var(--text-dim);cursor:pointer;border-radius:4px;padding:4px 10px;font-size:.8rem}.speed-btn.active{background:var(--accent);color:#000;border-color:var(--accent)}.main-content{flex:1;display:flex;overflow:hidden}.ranch-map{flex-direction:column;flex:1;display:flex;overflow:hidden}.map-container{background:radial-gradient(at 50% 80%,#2a4a2a 0%,#0000 60%),linear-gradient(#1a3020 0%,#0f1a0f 100%);flex-direction:row;flex:1;justify-content:center;align-items:stretch;padding:10px;display:flex;position:relative;overflow:hidden}.landscape{pointer-events:none;position:absolute;inset:0;overflow:hidden}.mountain{opacity:.15;font-size:6rem;position:absolute}.mountain-1{top:5%;left:10%}.mountain-2{font-size:3rem;top:8%;right:15%}.forest-left,.forest-right{opacity:.4;letter-spacing:-5px;font-size:2.5rem;position:absolute;top:15%}.forest-left{left:0}.forest-right{right:0}.ranch-center{z-index:2;gap:12px;margin-bottom:16px;display:flex}.building{border:1px solid var(--border);background:#0000004d;border-radius:8px;flex-direction:column;align-items:center;min-width:60px;padding:8px;font-size:2.5rem;display:flex}.building span,.building-label{color:var(--text-dim);margin-top:2px;font-size:.6rem}.plot-grid{z-index:2;grid-template-columns:repeat(8,1fr);gap:6px;width:100%;max-width:520px;display:grid}.plot-cell{aspect-ratio:1;border:2px solid var(--border);cursor:pointer;background:#223c2299;border-radius:6px;flex-direction:column;justify-content:center;align-items:center;padding:2px;transition:all .15s;display:flex;position:relative}.plot-cell:hover{border-color:var(--accent);background:#325032cc}.plot-cell.selected{border-color:var(--gold);background:#3c5028cc;box-shadow:0 0 8px #ffdc004d}.plot-cell.growing{border-color:#4a4}.plot-cell.ready{border-color:var(--gold);animation:1s infinite pulse-ready}.plot-cell.animal{border-color:#a64}.plot-cell.locked{opacity:.4;cursor:default}.plot-icon{font-size:1.4rem}.plot-label{color:var(--text-dim);text-align:center;margin-top:1px;font-size:.5rem;line-height:1.1}.plot-progress{background:#00000080;border-radius:2px;height:3px;position:absolute;bottom:2px;left:4px;right:4px}.plot-progress-fill{background:var(--accent);border-radius:2px;height:100%;transition:width .5s}@keyframes pulse-ready{0%,to{box-shadow:0 0 4px #ffdc004d}50%{box-shadow:0 0 12px #ffdc0099}}.plot-actions{background:var(--bg-dark);border-top:1px solid var(--border);flex-shrink:0;max-height:200px;padding:10px 12px;overflow-y:auto}.plot-actions h4{color:var(--accent-light);margin:6px 0 4px;font-size:.8rem}.action-btn{cursor:pointer;border:none;border-radius:6px;padding:10px 20px;font-size:1rem;font-weight:600;transition:all .15s}.action-btn.harvest{color:#fff;background:linear-gradient(135deg,#4a8,#2a6);box-shadow:0 2px 10px #46aa644d}.action-btn:active{transform:scale(.96)}.selector-grid{flex-wrap:wrap;gap:6px;display:flex}.selector-btn{background:var(--bg-light);border:1px solid var(--border);cursor:pointer;border-radius:6px;flex-direction:column;align-items:center;min-width:60px;padding:6px 8px;transition:all .15s;display:flex}.selector-btn:hover{border-color:var(--accent);background:#46aa6426}.selector-icon{font-size:1.2rem}.selector-name{color:var(--text);font-size:.65rem}.selector-cost{color:var(--gold);font-size:.6rem}.side-panel{background:var(--bg-dark);border-left:1px solid var(--border);flex-shrink:0;width:280px;padding:12px;overflow-y:auto}.side-panel h3{color:var(--accent-light);border-bottom:1px solid var(--border);margin-bottom:10px;padding-bottom:6px;font-size:1rem}.side-panel h4{color:var(--accent);margin:10px 0 6px;font-size:.8rem}.hint{color:var(--text-dim);font-size:.75rem;font-style:italic}.info-grid{gap:12px;margin-bottom:8px;font-size:.8rem;display:flex}.inventory-grid{grid-template-columns:repeat(4,1fr);gap:4px;display:grid}.inv-item{background:var(--bg-light);border-radius:4px;flex-direction:column;align-items:center;padding:4px;font-size:.65rem;display:flex}.shop-list{flex-direction:column;gap:4px;display:flex}.shop-item{background:var(--bg-light);border-radius:4px;justify-content:space-between;align-items:center;padding:6px 8px;font-size:.75rem;display:flex}.shop-item button{background:var(--accent);color:#000;cursor:pointer;border:none;border-radius:3px;padding:3px 8px;font-size:.65rem;font-weight:600}.order-list{flex-direction:column;gap:8px;display:flex}.order-card{background:var(--bg-light);border:1px solid var(--border);border-radius:6px;padding:10px}.order-card.expired{opacity:.15}.order-header{justify-content:space-between;margin-bottom:6px;font-size:.85rem;font-weight:600;display:flex}.order-timer{color:var(--danger);font-size:.75rem}.order-progress{justify-content:space-between;margin:6px 0;font-size:.75rem;display:flex}.order-reward{color:var(--gold)}.deliver-btn{background:var(--success);color:#fff;cursor:pointer;border:none;border-radius:4px;width:100%;padding:6px;font-size:.75rem;font-weight:600}.deliver-btn:disabled{color:#666;cursor:default;background:#333}.building-list{flex-direction:column;gap:8px;display:flex}.building-card{background:var(--bg-light);border:1px solid var(--border);border-radius:6px;padding:10px}.building-card.built{border-color:var(--accent)}.building-card.maxed{opacity:.6}.building-header{align-items:center;gap:8px;margin-bottom:4px;display:flex}.building-icon{font-size:1.5rem}.building-level{color:var(--text-dim);margin-left:6px;font-size:.65rem}.building-desc{color:var(--text-dim);margin-bottom:6px;font-size:.7rem}.building-effects{margin-bottom:6px;font-size:.65rem}.effect{color:var(--accent-light);display:block}.build-btn,.research-btn{background:var(--accent);color:#000;cursor:pointer;border:none;border-radius:4px;width:100%;padding:6px;font-size:.75rem;font-weight:600}.build-btn:disabled,.research-btn:disabled{color:#666;cursor:default;background:#333}.maxed-label{color:var(--success);font-size:.75rem;font-weight:600}.skill-list{flex-direction:column;gap:8px;display:flex}.skill-card{background:var(--bg-light);border:1px solid var(--border);border-radius:6px;padding:8px}.skill-header{align-items:center;gap:6px;margin-bottom:4px;display:flex}.skill-icon{font-size:1.2rem}.skill-level{color:var(--text-dim);margin-left:auto;font-size:.7rem}.skill-desc{color:var(--text-dim);margin-bottom:6px;font-size:.7rem}.skill-bar{background:#222;border-radius:2px;height:4px;margin-bottom:6px;overflow:hidden}.skill-fill{background:var(--accent);border-radius:2px;height:100%}.upgrade-btn{background:var(--accent);color:#000;cursor:pointer;border:none;border-radius:3px;width:100%;padding:4px;font-size:.7rem;font-weight:600}.upgrade-btn:disabled{color:#666;cursor:default;background:#333}.research-list{flex-direction:column;gap:8px;display:flex}.research-card{background:var(--bg-light);border:1px solid var(--border);border-radius:6px;padding:10px}.research-card.unlocked{border-color:var(--success);opacity:.7}.research-card.locked{opacity:.15}.research-header{align-items:center;gap:6px;margin-bottom:4px;display:flex}.research-icon{font-size:1.2rem}.research-status{margin-left:auto}.research-desc{color:var(--text-dim);margin-bottom:4px;font-size:.7rem}.research-cost{color:var(--gold);margin-bottom:4px;font-size:.7rem}.research-requires{color:var(--text-dim);margin-bottom:4px;font-size:.65rem}.bottom-nav{background:var(--bg-dark);border-top:1px solid var(--border);flex-shrink:0;display:flex}.nav-btn{color:var(--text-dim);cursor:pointer;background:0 0;border:none;flex-direction:column;flex:1;align-items:center;gap:2px;padding:8px 4px;transition:all .15s;display:flex}.nav-btn.active{color:var(--accent-light);background:#46aa641a}.nav-btn span:first-child{font-size:1.2rem}.nav-label{font-size:.6rem}.notification{background:var(--bg-dark);border:1px solid var(--accent);color:var(--text);z-index:1000;cursor:pointer;border-radius:8px;padding:10px 20px;font-size:.9rem;animation:3s forwards fadeInOut;position:fixed;top:50px;left:50%;transform:translate(-50%)}@keyframes fadeInOut{0%{opacity:0;transform:translate(-50%)translateY(-10px)}10%{opacity:1;transform:translate(-50%)translateY(0)}80%{opacity:1}to{opacity:0}}@media (width<=768px){.main-content{flex-direction:column}.side-panel{border-left:none;border-top:1px solid var(--border);width:100%;max-height:250px}.plot-grid{gap:4px;max-width:360px}.plot-icon{font-size:1.1rem}.plot-label{font-size:.45rem}.top-center{display:none}}@media (width>=1200px){.side-panel{width:340px}.plot-grid{gap:8px;max-width:600px}}.main-content.ranch-only{flex:1}.main-content.with-panel .ranch-map{flex:1;min-width:0}.side-buttons{flex-direction:column;flex-shrink:0;justify-content:center;align-items:center;gap:12px;padding:8px;display:flex}.side-btn{border:2px solid var(--border);cursor:pointer;text-align:center;background:#1e321ecc;border-radius:10px;flex-direction:column;justify-content:center;align-items:center;min-width:100px;padding:16px 12px;transition:all .2s;display:flex}.side-btn:hover{border-color:var(--accent);background:#284628e6}.side-btn.locked-btn{opacity:.6;cursor:default}.side-btn-icon{margin-bottom:6px;font-size:1.5rem}.side-btn-label{color:var(--text);font-size:.7rem;font-weight:600}.side-btn-progress{color:var(--text-dim);margin-top:2px;font-size:.6rem}.forest-btn{border-color:#4a6a4a!important}.axe-btn{border-color:#8a6a4a!important}.ranch-center-area{flex-direction:column;flex:1;justify-content:center;align-items:center;gap:10px;min-width:0;padding:10px;display:flex}.axe-offer{text-align:center;background:#8c642833;border:1px solid #a84;border-radius:8px;margin-bottom:12px;padding:12px}.buy-axe-btn{color:#fff;cursor:pointer;background:linear-gradient(135deg,#a84,#642);border:none;border-radius:6px;margin-top:8px;padding:8px 20px;font-size:.9rem;font-weight:600}.buy-axe-btn:disabled{color:#666;cursor:default;background:#333}.wip-content{flex-direction:column;align-items:center;gap:12px;padding:20px 0;display:flex}.wip-icon{font-size:3rem;animation:2s infinite wobble}@keyframes wobble{0%,to{transform:rotate(-3deg)}50%{transform:rotate(3deg)}}.wip-text{color:var(--accent-light);font-size:1.1rem;font-weight:600}.back-btn{background:var(--bg-light);border:1px solid var(--border);color:var(--text);cursor:pointer;border-radius:6px;padding:8px 16px;font-size:.8rem}@media (width<=768px){.side-buttons{flex-direction:row;gap:8px}.side-btn{min-width:80px;padding:10px 8px}.main-content.with-panel{flex-direction:column}.side-panel{width:100%;max-height:250px}}.sell-input{background:var(--bg-dark);border:1px solid var(--border);width:50px;color:var(--text);text-align:center;border-radius:4px;padding:4px;font-size:.75rem}.sell-input::-webkit-inner-spin-button{opacity:1}.inv-full{color:var(--danger);border:1px solid var(--danger)!important}.popup-overlay{z-index:1000;background:#0009;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.popup-modal{background:var(--bg-dark,#1a1a2e);border:2px solid var(--danger,#e74c3c);text-align:center;border-radius:12px;max-width:320px;padding:20px 28px;animation:.15s ease-out popIn}.popup-modal p{color:var(--text,#eee);margin-bottom:14px;font-size:.9rem}.popup-close{background:var(--danger,#e74c3c);color:#fff;cursor:pointer;border:none;border-radius:8px;padding:8px 28px;font-size:.85rem}.popup-close:hover{opacity:.85}@keyframes popIn{0%{opacity:0;transform:scale(.85)}to{opacity:1;transform:scale(1)}}.clicker-area{text-align:center;cursor:pointer;-webkit-user-select:none;user-select:none;padding:20px}.clicker-tree,.clicker-rock{font-size:4rem;transition:transform .1s;display:inline-block}.clicker-tree.shake,.clicker-rock.shake{transform:scale(1.1)rotate(-5deg)}.clicker-hint{color:var(--text-muted);margin-top:8px;font-size:.8rem}.clicker-stats{padding:8px 0;font-size:.85rem}.block-bar{background:var(--bg-dark);border-radius:4px;height:8px;margin-top:4px;overflow:hidden}.block-fill{background:var(--success,#2ecc71);border-radius:4px;height:100%;transition:width .2s}.mine-bar .block-fill{background:var(--warning,#f39c12)}.drop-display{text-align:center;padding:10px;font-size:1rem;animation:.15s ease-out popIn}.drop-icon{margin-right:6px;font-size:1.5rem}.lockout-screen{text-align:center;padding:20px}.lockout-icon{margin-bottom:10px;font-size:3rem;display:block}.lockout-event{color:var(--danger);margin-bottom:16px;font-size:1rem;font-weight:700}.lockout-timer{justify-content:center;align-items:center;gap:10px;display:flex}.lockout-bar{background:var(--bg-dark);border-radius:5px;flex:1;max-width:160px;height:10px;overflow:hidden}.lockout-fill{background:var(--danger);border-radius:5px;height:100%;transition:width .5s linear}.build-cost{color:var(--text-muted);margin-top:4px;font-size:.7rem;display:block}.resource-group{margin-bottom:12px}.resource-group h4{color:var(--accent);border-bottom:1px solid var(--border);margin:0 0 6px;padding-bottom:4px;font-size:.85rem}.resource-grid{flex-direction:column;gap:4px;display:flex}.resource-item{background:#ffffff08;border:1px solid #0000;border-radius:6px;align-items:center;gap:8px;padding:6px 8px;display:flex}.resource-icon{text-align:center;width:24px;font-size:1.1rem}.resource-info{flex-direction:column;flex:1;display:flex}.resource-name{font-size:.8rem;font-weight:600}.resource-desc{color:var(--text-muted);font-size:.65rem}.resource-count{text-align:right;min-width:40px;font-size:.85rem;font-weight:700}.castle-hp{margin:8px 0}.hp-bar{background:var(--bg-dark);border-radius:6px;height:12px;margin-top:4px;overflow:hidden}.hp-fill{border-radius:6px;height:100%;transition:width .3s}.castle-bonus{color:var(--success);margin:4px 0;font-weight:700}.castle-stats{flex-wrap:wrap;gap:12px;margin:8px 0;font-size:.8rem;display:flex}.castle-actions{gap:8px;margin:8px 0;display:flex}.castle-upgrade{margin:8px 0}.repair-btn{background:var(--warning,#f39c12);color:#000;cursor:pointer;border:none;border-radius:6px;padding:8px 12px;font-size:.8rem}.repair-btn:disabled{opacity:.5;cursor:default}.defence-field{border:1px solid var(--border);background:linear-gradient(#1a2a1a 0%,#0f1a0f 100%);border-radius:8px;width:100%;height:160px;margin:8px 0;position:relative;overflow:hidden}.castle-icon{font-size:2rem;position:absolute;bottom:10px;left:2%}.tower-slot{text-align:center;width:30px;position:absolute;bottom:10px}.tower-placed{font-size:1.5rem}.tower-empty{opacity:.3;font-size:1.2rem}.tower-picker{flex-direction:column;gap:2px;display:flex}.tower-option{border:1px solid var(--border);cursor:pointer;background:#ffffff1a;border-radius:4px;padding:2px;font-size:.9rem;line-height:1}.tower-option:disabled{opacity:.3;cursor:default}.tower-option:hover:not(:disabled){background:#fff3}.monster{text-align:center;width:30px;transition:left .1s linear;position:absolute;bottom:10px}.monster-icon{font-size:1.3rem}.monster-hp-bar{background:#333;border-radius:2px;width:24px;height:3px;margin:0 auto}.monster-hp-fill{background:#e74c3c;border-radius:2px;height:100%}.defence-controls{text-align:center;margin:8px 0}.tower-placed-info{flex-direction:column;align-items:center;gap:2px;display:flex}.tower-icon-big{font-size:1.5rem}.tower-level{color:var(--success);font-size:.6rem;font-weight:700}.tower-upgrade-btn{border:1px solid var(--success);cursor:pointer;background:#2ecc714d;border-radius:4px;padding:2px 6px;font-size:.7rem}.tower-upgrade-btn:disabled{opacity:.3;cursor:default}.tower-max{color:var(--gold);font-size:.5rem}.music-btn{background:var(--accent,#8b5cf6);cursor:pointer;border:none;border-radius:6px;padding:4px 10px;font-size:1rem;line-height:1}.xp-bar-container{align-items:center;gap:6px;display:flex}.xp-bar-wrap{align-items:center;gap:4px;display:flex}.xp-text{color:var(--text-dim);white-space:nowrap;font-size:.6rem}.cooldown-text{color:var(--warning,#f39c12);font-size:.75rem;font-weight:700}.sell-feedback{color:var(--success,#2ecc71);font-weight:700;animation:1.5s ease-out forwards fadeOut}@keyframes fadeOut{0%{opacity:1}70%{opacity:1}to{opacity:0}}.bulk-actions{flex-wrap:wrap;align-items:center;gap:8px;margin:8px 0;display:flex}.bulk-btn{cursor:pointer;white-space:nowrap;border:none;border-radius:6px;padding:6px 12px;font-size:.8rem;font-weight:700}.bulk-btn:disabled{opacity:.4;cursor:default}.harvest-all{background:var(--success,#2ecc71);color:#000}.plant-all{background:var(--accent,#8b5cf6);color:#fff}.bulk-plant{align-items:center;gap:4px;display:flex}.plant-select{background:var(--bg-dark,#1a1a2e);color:var(--text,#e0e0e0);border:1px solid var(--border,#333);border-radius:4px;padding:4px;font-size:.75rem}.ranch-buildings{flex-flow:wrap;justify-content:center;gap:6px;min-height:60px;display:flex}.building{border:1px solid var(--border);background:#0000004d;border-radius:8px;flex-direction:column;flex-shrink:0;align-items:center;min-width:50px;padding:4px 8px;font-size:1.8rem;display:flex}.ranch-center-area{min-height:400px}.plot-actions{width:100%;max-width:520px;min-height:80px;max-height:200px;overflow-y:auto}.bulk-actions{width:100%;max-width:520px;min-height:32px}
