body{background-color:#111;color:#e5e5e5;font-family:Segoe UI,Roboto,Helvetica,Arial,sans-serif;overflow:hidden;-webkit-user-select:none;user-select:none;height:100vh;display:flex;flex-direction:column;margin:0;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}#game-wrapper{position:relative;flex:1;overflow:hidden;background:#262626}canvas{display:block;width:100%;height:100%;position:absolute;top:0;left:0}#bgCanvas{z-index:5}#gameCanvas{z-index:15}.floater{position:absolute;color:#fff;font-weight:700;pointer-events:none;animation:floatUp 1s forwards;text-shadow:1px 1px 2px black;z-index:100}@keyframes floatUp{0%{transform:translateY(0);opacity:1}to{transform:translateY(-30px);opacity:0}}.turret-addon{position:absolute;top:-15px;left:50%;transform:translate(-50%);width:30px;height:15px;background-color:#4b5563;border:2px solid #9ca3af;border-radius:4px 4px 0 0;display:none;z-index:2}.turret-addon:after{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:8px;height:8px;background-color:#000;border-radius:50%}.has-turret .turret-addon{display:block}.hp-bar-container{position:absolute;top:-25px;width:120%;left:-10%;height:6px;background:#000000b3;border-radius:3px;overflow:hidden;border:1px solid rgba(255,255,255,.2)}.hp-bar-fill{height:100%;background:#22c55e;width:100%;transition:width .2s}.base-label{position:absolute;top:4px;z-index:3;text-shadow:1px 1px 2px black}.top-bar{position:absolute;top:0;left:0;right:0;display:flex;justify-content:space-between;align-items:flex-start;padding:10px 20px;pointer-events:none;z-index:20}.top-group{display:flex;flex-direction:column}.top-group.right{align-items:flex-end}.top-item{font-weight:700;font-size:1.2rem;text-shadow:1px 1px 2px black;line-height:1.2}.tech-status{font-family:monospace;font-size:.8rem;font-weight:700;margin-top:2px;text-shadow:1px 1px 1px black;opacity:.9;display:grid;grid-template-columns:1fr 1fr;gap:4px 8px}.text-blue{color:#60a5fa}.text-red{color:#f87171}.text-blue-light{color:#93c5fd}.text-red-light{color:#fca5a5}.tactics-bar{position:absolute;top:10px;left:50%;transform:translate(-50%);display:flex;gap:10px;z-index:30;pointer-events:auto}.tactic-btn{background:#1e1e1e99;border:1px solid #555;color:#ccc;padding:6px 16px;border-radius:20px;cursor:pointer;font-weight:700;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);transition:all .2s;font-size:.85rem}.tactic-btn:hover{background:#444;color:#fff}.tactic-btn.active{background:#fbbf24;color:#000;transform:scale(1.05);box-shadow:0 0 10px #fbbf2480}.key-hint{font-size:10px;background:#fff3;padding:1px 4px;border-radius:4px;margin-left:4px;vertical-align:middle;font-weight:700;color:#fffc}.tactic-btn.active .key-hint{background:#0003;color:#000000b3}.lane-toggle-btn{padding:0 10px;font-size:12px}.lane-controls{position:absolute;top:60px;left:50%;transform:translate(-50%);background:#000000e6;border:1px solid #334155;border-radius:8px;padding:10px;z-index:100;display:flex;flex-direction:column;gap:8px;width:320px}.lane-controls.hidden{display:none}.lane-row{display:flex;justify-content:space-between;align-items:center;color:#fff;font-size:14px}.lane-btn-group{display:flex;gap:4px}.lane-btn{background:#1e293b;color:#94a3b8;border:1px solid #334155;border-radius:4px;padding:4px 8px;font-size:14px;cursor:pointer;transition:all .2s}.lane-btn:hover{background:#334155;color:#fff}.lane-btn.active{background:#fbbf24;color:#000;border-color:#fbbf24;font-weight:700}.resource-widget{position:absolute;bottom:100px;left:20px;width:280px;background:#1f2937f2;border:1px solid #374151;border-radius:12px;padding:12px;box-shadow:0 10px 15px -3px #00000080;z-index:40;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}@media (max-height: 500px){.resource-widget{bottom:90px;left:10px;transform:scale(.9);transform-origin:bottom left}}.status-header{display:flex;justify-content:space-between;align-items:center;padding-bottom:8px;margin-bottom:8px;border-bottom:1px solid #4b5563;font-size:1rem}.status-group{display:flex;align-items:center;gap:6px}.icon-house{color:#f59e0b}.icon-sleep{color:#9ca3af}.pop-text{font-weight:700;font-family:monospace;transition:color .2s}.pop-text.warning{color:#ef4444;animation:pulse 1s infinite}.idle-text{color:#9ca3af;font-weight:700;font-family:monospace}.idle-text.warning{color:#ef4444;animation:pulse 1s infinite}@keyframes pulse{0%{opacity:1}50%{opacity:.5}to{opacity:1}}.res-grid{display:grid;grid-template-columns:20px 24px 1fr 24px 50px 24px;gap:4px;align-items:center;font-size:.9rem}.pin-btn{width:16px;height:16px;border-radius:50%;border:1px solid #555;cursor:pointer;background:#333;display:flex;justify-content:center;align-items:center;font-size:11px;color:#666;transition:all .2s}.pin-btn:hover{border-color:#888;color:#aaa}.pin-btn.active{background:#eab308;border-color:#ca8a04;color:#000;box-shadow:0 0 5px #eab30880}.res-icon{text-align:center;font-size:1rem}.res-val{font-family:monospace;text-align:right;padding-right:10px;color:#e5e5e5;font-weight:700}.worker-box{background:#0000004d;border-radius:4px;display:flex;align-items:center;justify-content:center;gap:4px;height:24px}.res-w-icon{color:#9ca3af;font-size:.7rem}.res-w-val{color:#60a5fa;font-family:monospace;font-weight:700}.tiny-btn{width:24px;height:24px;display:flex;align-items:center;justify-content:center;background:#374151;border:1px solid #4b5563;border-radius:4px;cursor:pointer;color:#ccc;font-size:.9rem;line-height:0;transition:background .1s}.tiny-btn:hover{background:#4b5563;color:#fff}.tiny-btn.disabled{opacity:.2;cursor:default;pointer-events:none}.dock-container{position:absolute;bottom:20px;left:50%;transform:translate(-50%);background:#ffffff0d;border:1px solid rgba(255,255,255,.1);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:8px;border-radius:16px;display:flex;gap:12px;z-index:50;box-shadow:0 4px 20px #00000080;max-width:95vw;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;-ms-overflow-style:none}.dock-container::-webkit-scrollbar{display:none}.dock-icon{width:56px;height:56px;background:#2d2d2d;border-radius:12px;display:flex;justify-content:center;align-items:center;font-size:28px;cursor:pointer;position:relative;transition:transform .2s;box-shadow:0 4px 6px #0000004d;border:1px solid #444;flex-shrink:0}.dock-icon:hover{transform:translateY(-5px) scale(1.1);background:#3d3d3d;z-index:60}.dock-icon.active{background:#333;box-shadow:0 0 0 2px #3b82f6;transform:translateY(-5px)}.dock-icon.build-icon{background:#eab308;color:#000;border-color:#ca8a04}.dock-icon.build-icon:hover{background:#facc15}.dock-icon.constructing{opacity:.7;border-style:dashed;background:#1f2937}.dock-icon.constructing .const-overlay{position:absolute;top:0;left:0;right:0;bottom:0;display:flex;justify-content:center;align-items:center;background:#0006;border-radius:12px;font-size:12px;color:#eab308;font-weight:700}.icon-progress-bg{position:absolute;bottom:0;left:0;right:0;height:4px;background:#0000004d;border-bottom-left-radius:12px;border-bottom-right-radius:12px;overflow:hidden;display:none}.icon-progress-fill{height:100%;width:0%;background:#3b82f6;transition:width linear .1s}.constructing .icon-progress-fill{background:#eab308}.dock-icon.researching .icon-progress-fill{background:#22c55e}.icon-badge{position:absolute;top:-5px;right:-5px;background:#ef4444;color:#fff;font-size:10px;font-weight:700;width:16px;height:16px;border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 1px 2px #000}.icon-badge.house-badge{background:#eab308;color:#000}.popover-menu{position:absolute;bottom:90px;left:50%;transform:translate(-50%);background:#1f2937f2;border:1px solid #4b5563;border-radius:8px;padding:10px;min-width:180px;display:none;flex-direction:column;gap:8px;z-index:60;box-shadow:0 10px 15px -3px #00000080;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.popover-menu:after{content:"";position:absolute;bottom:-6px;left:50%;transform:translate(-50%) rotate(45deg);width:12px;height:12px;background:#1f2937f2;border-right:1px solid #4b5563;border-bottom:1px solid #4b5563}.popover-title{font-size:.8rem;color:#9ca3af;text-transform:uppercase;border-bottom:1px solid #4b5563;padding-bottom:4px;margin-bottom:4px;text-align:center}.menu-btn{background:#374151;border:1px solid #4b5563;color:#fff;padding:10px;border-radius:6px;cursor:pointer;display:flex;align-items:center;gap:10px;font-size:.9rem;transition:all .1s;position:relative}.menu-btn:hover:not(:disabled){background:#4b5563}.menu-btn:disabled{opacity:.5;cursor:not-allowed;filter:grayscale(1)}.btn-icon{font-size:1.4rem}.btn-info{display:flex;flex-direction:column;line-height:1.2;text-align:left}.btn-cost{font-size:.75rem;color:#9ca3af}.menu-btn.tech-btn{border-color:#8b5cf6;background:#8b5cf61a}.menu-btn.tech-btn:hover:not(:disabled){background:#8b5cf64d}#game-over{position:absolute;top:0;left:0;right:0;bottom:0;background:#000000d9;display:flex;flex-direction:column;justify-content:center;align-items:center;z-index:100;display:none}#unit-tooltip{position:absolute;background:#111827f2;border:1px solid #4b5563;padding:8px 12px;border-radius:6px;pointer-events:none;display:none;z-index:1000;color:#fff;font-size:12px;box-shadow:0 4px 6px #00000080;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);min-width:140px}.tt-row{display:flex;justify-content:space-between;margin-bottom:2px}.tt-header{font-weight:700;color:#60a5fa;border-bottom:1px solid #4b5563;margin-bottom:4px;padding-bottom:2px;text-align:center}.tt-enemy .tt-header{color:#f87171}.tt-sub{color:#9ca3af;font-size:11px}.val-bonus{color:#22c55e;margin-left:2px}#toast-container{position:fixed;bottom:100px;right:20px;z-index:100;display:flex;flex-direction:column;align-items:flex-end;gap:10px;pointer-events:none;top:auto;left:auto;transform:none}.toast{color:#fff;padding:12px 24px;border-radius:8px;font-weight:700;font-family:Segoe UI,Roboto,monospace;box-shadow:0 4px 12px #00000080;background-color:#374151;pointer-events:auto;font-size:1rem;animation:toastSlideIn .3s ease-out forwards}@keyframes toastSlideIn{0%{opacity:0;transform:translate(20px)}to{opacity:1;transform:translate(0)}}.fixed{position:fixed}.absolute{position:absolute}.relative{position:relative}.flex{display:flex}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-center{justify-content:center}.hidden{display:none}*,:before,:after{--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1}.bg-gray-900{background-color:#111827}.bg-gray-800{background-color:#1f2937}.bg-blue-600,.hover\:bg-blue-600:hover{background-color:#2563eb}.border-gray-700{border-color:#374151}.hover\:border-blue-400:hover{border-color:#60a5fa}.rounded-xl{border-radius:.75rem}.shadow-lg{box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -2px #0000000d}.inset-0{top:0;right:0;bottom:0;left:0}.gap-4{gap:.6rem}.w-80{width:20rem}.px-8{padding-left:2rem;padding-right:2rem}.py-4{padding-top:1rem;padding-bottom:1rem}.border-2{border-width:2px}.transition-all{transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.duration-200{transition-duration:.2s}.transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.hover\:scale-105:hover{--tw-scale-x: 1.05;--tw-scale-y: 1.05;transform:scale(1.05)}.justify-between{justify-content:space-between}.mb-12{margin-bottom:3rem}.drop-shadow-lg{filter:drop-shadow(0 10px 8px rgb(0 0 0 / .04)) drop-shadow(0 4px 3px rgb(0 0 0 / .1))}.text-2xl{font-size:1.5rem;line-height:2rem}.mr-4{margin-right:1rem}.ml-4{margin-left:1rem}.tracking-wider{letter-spacing:.05em}.opacity-0{opacity:0}.group:hover .group-hover\:opacity-100{opacity:1}.group:hover .group-hover\:animate-bounce{animation:bounce 1s infinite}.transition-opacity{transition-property:opacity;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.mt-8{margin-top:2rem}@keyframes bounce{0%,to{transform:translateY(-25%);animation-timing-function:cubic-bezier(.8,0,1,1)}50%{transform:none;animation-timing-function:cubic-bezier(0,0,.2,1)}}.top-4{top:1rem}.left-1\/2{left:50%}.-translate-x-1\/2{--tw-translate-x: -50%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.z-50{z-index:50}.w-full{width:100%}.font-bold{font-weight:700}.text-center{text-align:center}.text-xs{font-size:.75rem;line-height:1rem}.text-sm{font-size:.875rem;line-height:1.25rem}.text-xl{font-size:1.25rem;line-height:1.75rem}.text-5xl{font-size:3rem;line-height:1}.mt-1{margin-top:.25rem}.mb-2{margin-bottom:.5rem}.mb-4{margin-bottom:1rem}.mb-8{margin-bottom:2rem}.p-2{padding:.5rem}.px-6{padding-left:1.5rem;padding-right:1.5rem}.py-3{padding-top:.75rem;padding-bottom:.75rem}.text-white{color:#fff}.text-red-500{color:#ef4444}.text-blue-400{color:#60a5fa}.text-green-500{color:#22c55e}.text-gray-300{color:#d1d5db}.text-gray-400{color:#9ca3af}.text-gray-500{color:#6b7280}.bg-blue-600{background-color:#2563eb}.bg-blue-600:hover{background-color:#1d4ed8}.rounded{border-radius:.25rem}.-top-3{top:-.75rem}.-right-3{right:-.75rem}.border{border-width:1px}.bg-yellow-500{background-color:#eab308}.text-black{color:#000}.px-2{padding-left:.5rem;padding-right:.5rem}.py-1{padding-top:.25rem;padding-bottom:.25rem}.rounded-full{border-radius:9999px}.shadow-md{box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f}.rotate-12{--tw-rotate: 12deg;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.border-yellow-300{border-color:#fde047}.block{display:block}.mt-2{margin-top:.5rem}