*{margin:0;padding:0;box-sizing:border-box}body{font-family:Segoe UI,system-ui,sans-serif;background:#0f1a0f;color:#e8f0e8;height:100vh;height:100dvh;overflow:hidden;-webkit-tap-highlight-color:transparent;touch-action:manipulation}#app{display:flex;flex-direction:column;height:100vh;height:100dvh}.header{display:flex;align-items:center;justify-content:space-between;padding:8px 16px;background:#1a2e1a;border-bottom:2px solid #4CAF50}.header h1{font-size:1.4rem;color:#81c784}.stats-bar{display:flex;gap:16px;flex-wrap:wrap}.stat{font-size:.85rem;background:#2d4a2d;padding:4px 10px;border-radius:12px}.main{display:flex;flex:1;overflow:hidden}.panel{width:220px;padding:12px;background:#1a2e1a;overflow-y:auto;font-size:.85rem}.panel h3{color:#81c784;margin-bottom:8px;font-size:.95rem}.panel h4{color:#a5d6a7;font-size:.8rem;margin:8px 0 4px}.game-area{flex:1;position:relative;background:#0a150a;min-width:0;min-height:0;z-index:5}#game-canvas{width:100%;height:100%;display:block;cursor:crosshair;touch-action:none;position:relative;z-index:10}.mobile-nav{display:none}.selection-hint{display:none;position:absolute;left:50%;bottom:12px;transform:translate(-50%);z-index:15;padding:8px 14px;background:#1a2e1aeb;border:1px solid #4CAF50;border-radius:999px;font-size:.8rem;color:#e8f0e8;white-space:nowrap;pointer-events:none;box-shadow:0 4px 16px #00000059}.selection-hint:not([hidden]){display:block}.map-zoom-controls{display:none;position:absolute;top:8px;right:8px;z-index:16;align-items:center;gap:4px;padding:4px;background:#1a2e1aeb;border:1px solid #4CAF50;border-radius:10px;box-shadow:0 4px 16px #00000059}.map-zoom-controls:not([hidden]){display:flex}.zoom-btn{width:36px;height:36px;border:1px solid #4CAF50;border-radius:8px;background:#2d4a2d;color:#e8f0e8;font-size:1.2rem;line-height:1;cursor:pointer}.zoom-btn.zoom-reset{font-size:1rem;width:32px}.zoom-level{min-width:42px;text-align:center;font-size:.75rem;color:#a5d6a7}.building-list{display:flex;flex-direction:column;gap:4px}.build-btn{display:flex;align-items:center;gap:6px;padding:6px 8px;background:#2d4a2d;border:1px solid #3d5a3d;border-radius:6px;color:#e8f0e8;cursor:pointer;font-size:.8rem;text-align:left;transition:all .15s}.build-btn:hover:not(:disabled){background:#3d6a3d;border-color:#4caf50}.build-btn.selected{background:#4caf50;color:#0f1a0f;border-color:#81c784}.build-btn.locked{opacity:.4}.build-btn.expensive:not(.locked){opacity:.7}.build-btn .icon{font-size:1.1rem}.build-btn .icon svg{display:block;margin:0 auto}.build-btn .price{margin-left:auto;font-size:.75rem;opacity:.8}.demolish-btn{width:100%;margin-top:12px;padding:8px;background:#5d2020;border:1px solid #8d3030;border-radius:6px;color:#ffcdd2;cursor:pointer}.demolish-btn.active{background:#c62828;color:#fff}.demolish-refund{color:#ffc107;font-size:.82rem;margin-top:6px}.footer{display:flex;justify-content:space-between;align-items:center;padding:8px 16px;background:#1a2e1a;border-top:1px solid #2d4a2d;gap:16px;flex-wrap:wrap}.tax-controls{display:flex;gap:16px;flex-wrap:wrap;font-size:.8rem}.tax-controls label{display:flex;align-items:center;gap:6px}.tax-controls input[type=range]{width:80px}.game-controls{display:flex;gap:8px}.game-controls button{padding:6px 12px;background:#2d4a2d;border:1px solid #4CAF50;border-radius:6px;color:#e8f0e8;cursor:pointer;font-size:.8rem}.game-controls button:hover{background:#3d6a3d}.install-btn{border-color:#81c784!important;background:#1b3a1b!important}.mission-list,.citizen-list{list-style:none;margin-bottom:12px}.tutorial-box{background:#1a3a2a;border:2px solid #4CAF50;border-radius:10px;padding:12px;margin-bottom:16px}.tutorial-box h3{color:#81c784;margin-bottom:8px}.tutorial-intro{font-size:.82rem;opacity:.9;margin-bottom:10px}.tutorial-steps{list-style:none;margin:0 0 10px;padding:0}.tutorial-step{display:flex;gap:8px;padding:8px 6px;border-radius:6px;font-size:.82rem;opacity:.55}.tutorial-step.active{background:#2d5a3d;opacity:1;border-left:3px solid #FFC107}.tutorial-step.done{opacity:.75}.tutorial-status{flex-shrink:0;width:1.2rem}.tutorial-hint{margin-top:4px;font-size:.78rem;color:#a5d6a7;line-height:1.35}.tutorial-progress{font-size:.8rem;color:#ffc107;margin-bottom:4px}.tutorial-reward{font-size:.78rem;color:#81c784}.mission-list li{padding:6px;background:#2d4a2d;border-radius:4px;margin-bottom:4px;font-size:.8rem}.tech-list{display:flex;flex-direction:column;gap:4px}.tech-btn{padding:6px 8px;background:#1a3a5c;border:1px solid #2196F3;border-radius:4px;color:#e8f0e8;cursor:pointer;font-size:.8rem;text-align:left}.tech-btn:hover{background:#2a5a8c}.event-active{color:#ffab40}.notifications{position:absolute;top:8px;right:8px;display:flex;flex-direction:column;gap:4px;max-width:300px;pointer-events:none}.mission-alert{position:absolute;top:8px;left:50%;transform:translate(-50%);z-index:20;pointer-events:auto}.mission-alert-btn{display:flex;align-items:center;gap:8px;padding:8px 14px;background:#1a3c1a;border:2px solid #4CAF50;border-radius:999px;color:#e8f0e8;cursor:pointer;font-size:.85rem;box-shadow:0 4px 16px #00000059;animation:missionPulse 2s ease-in-out infinite}.mission-alert-btn:hover{background:#2d5a2d}.mission-alert-icon{font-size:1.1rem}.mission-alert-action{color:#81c784;font-weight:600}.mission-modal{position:absolute;top:0;right:0;bottom:0;left:0;z-index:30;display:flex;align-items:center;justify-content:center}.mission-modal-backdrop{position:absolute;top:0;right:0;bottom:0;left:0;background:#0000008c}.mission-modal-card{position:relative;width:min(90%,360px);max-height:70%;overflow-y:auto;background:#1a2e1a;border:2px solid #4CAF50;border-radius:12px;padding:16px;box-shadow:0 8px 32px #00000073}.mission-modal-card h3{color:#81c784;margin-bottom:12px}.mission-modal-list{list-style:none;margin-bottom:16px}.mission-modal-item{padding:10px;margin-bottom:8px;background:#2d4a2d;border-radius:8px;font-size:.85rem}.mission-modal-item p{margin:6px 0;opacity:.9}.mission-modal-item em{color:#ffc107}.mission-modal-close{width:100%;padding:10px;background:#4caf50;border:none;border-radius:8px;color:#0f1a0f;font-weight:600;cursor:pointer}.mission-modal-close:hover{background:#81c784}@keyframes missionPulse{0%,to{box-shadow:0 4px 16px #4caf5040}50%{box-shadow:0 4px 24px #4caf508c}}.notification{padding:8px 12px;border-radius:6px;font-size:.8rem;animation:slideIn .3s ease}.notification.info{background:#1a3a5c;border-left:3px solid #2196F3}.notification.success{background:#1a3c1a;border-left:3px solid #4CAF50}.notification.warning{background:#3e2723;border-left:3px solid #FF9800}.notification.danger{background:#4a1010;border-left:3px solid #F44336}@keyframes slideIn{0%{transform:translate(100%);opacity:0}to{transform:translate(0);opacity:1}}@media (max-width: 900px){.header{padding:6px 10px;padding-top:max(6px,env(safe-area-inset-top));flex-wrap:wrap;gap:4px}.header h1{font-size:1.1rem;width:100%;text-align:center}.stats-bar{width:100%;gap:6px;flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding-bottom:2px}.stats-bar::-webkit-scrollbar{display:none}.stat{font-size:.75rem;padding:4px 8px;white-space:nowrap;flex-shrink:0}.main{flex-direction:column;position:relative}.panel{position:fixed;left:0;right:0;bottom:calc(56px + env(safe-area-inset-bottom));width:100%;max-height:55vh;z-index:40;border-radius:16px 16px 0 0;border-top:2px solid #4CAF50;box-shadow:0 -8px 32px #00000073;transform:translateY(110%);transition:transform .25s ease;padding-bottom:12px;pointer-events:none}.build-panel.open,.info-panel.open{transform:translateY(0);pointer-events:auto}.footer{position:fixed;left:0;right:0;bottom:calc(56px + env(safe-area-inset-bottom));z-index:40;flex-direction:column;align-items:stretch;gap:12px;padding:16px;max-height:60vh;overflow-y:auto;border-radius:16px 16px 0 0;border-top:2px solid #4CAF50;box-shadow:0 -8px 32px #00000073;transform:translateY(110%);transition:transform .25s ease;pointer-events:none}.footer.open{transform:translateY(0);pointer-events:auto}.tax-controls{flex-direction:column;gap:10px}.tax-controls label{justify-content:space-between}.tax-controls input[type=range]{width:120px;flex:1;max-width:160px}.game-controls{flex-wrap:wrap;justify-content:center}.game-controls button{min-height:44px;padding:10px 14px;font-size:.85rem;flex:1 1 calc(50% - 4px)}.build-btn,.demolish-btn,.tech-btn{min-height:44px;padding:10px;font-size:.85rem}.build-btn .name{display:inline}.mobile-nav{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:50;background:#1a2e1a;border-top:2px solid #4CAF50;padding-bottom:env(safe-area-inset-bottom)}.mobile-nav-btn{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;min-height:56px;padding:6px 4px;background:transparent;border:none;color:#a5d6a7;font-size:.65rem;cursor:pointer;transition:background .15s,color .15s}.mobile-nav-btn span{font-size:.65rem}.mobile-nav-btn.active{background:#2d4a2d;color:#81c784}.notifications{top:4px;right:4px;left:4px;max-width:none}.notification{font-size:.75rem;padding:6px 10px}.mission-alert{top:auto;bottom:64px;width:calc(100% - 16px)}.mission-alert-btn{width:100%;justify-content:center;font-size:.8rem;padding:10px 12px}.mission-modal-card{width:min(94%,360px);max-height:80%}.selection-hint{bottom:68px;white-space:normal;max-width:calc(100% - 24px);text-align:center;line-height:1.3}.map-zoom-controls{top:4px;right:4px}}