*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none}:root{--green: #10b981;--green-light: #34d399;--green-glow: rgba(16, 185, 129, .5);--red: #f43f5e;--red-light: #fb7185;--red-glow: rgba(244, 63, 94, .5);--blue: #0ea5e9;--blue-light: #38bdf8;--blue-glow: rgba(14, 165, 233, .5);--yellow: #f59e0b;--yellow-light: #fbbf24;--yellow-glow: rgba(245, 158, 11, .5);--purple: #a855f7;--purple-light: #c084fc;--purple-glow: rgba(168, 85, 247, .5);--cyan: #06b6d4;--bg-primary: #0c0c1d;--bg-secondary: #12122b;--bg-tertiary: #1a1a3e;--bg-card: rgba(26, 26, 62, .7);--bg-glass: rgba(255, 255, 255, .03);--bg-glass-hover: rgba(255, 255, 255, .08);--text-primary: #f1f5f9;--text-secondary: #94a3b8;--text-muted: #64748b;--border-subtle: rgba(255, 255, 255, .08);--border-light: rgba(255, 255, 255, .15);--border-glow: rgba(16, 185, 129, .3);--shadow-sm: 0 2px 8px rgba(0, 0, 0, .3);--shadow-md: 0 4px 20px rgba(0, 0, 0, .4);--shadow-lg: 0 8px 40px rgba(0, 0, 0, .5);--shadow-glow: 0 0 30px var(--green-glow);--dark: #1a1a2e;--darker: #0f0f1a;--light: #e2e8f0;--dim: #64748b}html,body{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:var(--bg-primary);color:var(--text-primary);height:100%;height:100dvh;overflow:hidden;touch-action:manipulation;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}#app{width:100%;height:100%;display:flex;flex-direction:column}button:focus-visible,.option-btn:focus-visible,.unit-tab:focus-visible,.action-btn:focus-visible{outline:2px solid var(--green-light);outline-offset:2px;box-shadow:0 0 0 4px var(--green-glow)}button:focus:not(:focus-visible),.option-btn:focus:not(:focus-visible),.unit-tab:focus:not(:focus-visible),.action-btn:focus:not(:focus-visible){outline:none}.screen{position:fixed;top:0;right:0;bottom:0;left:0;display:none;flex-direction:column;background:var(--darker);z-index:100}.screen.active{display:flex}#menu{padding:24px;padding-top:max(24px,env(safe-area-inset-top));padding-bottom:max(40px,calc(env(safe-area-inset-bottom) + 24px));overflow-y:auto;-webkit-overflow-scrolling:touch;background:radial-gradient(ellipse at 50% 0%,rgba(16,185,129,.15) 0%,transparent 50%),radial-gradient(ellipse at 20% 80%,rgba(59,130,246,.1) 0%,transparent 40%),radial-gradient(ellipse at 80% 60%,rgba(168,85,247,.08) 0%,transparent 40%),linear-gradient(180deg,var(--bg-secondary) 0%,var(--bg-primary) 100%);justify-content:center;gap:20px}.menu-header{text-align:center;padding:30px 0 20px;position:relative}.menu-header:before{content:"⚔️";display:block;font-size:48px;margin-bottom:16px;filter:drop-shadow(0 4px 20px rgba(16,185,129,.4));animation:floatIcon 3s ease-in-out infinite}@keyframes floatIcon{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}.menu-title{font-size:clamp(36px,12vw,56px);font-weight:900;background:linear-gradient(135deg,var(--green-light) 0%,var(--green) 50%,var(--cyan) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;letter-spacing:-2px;text-shadow:0 4px 30px rgba(16,185,129,.3);position:relative}.menu-title:after{content:"TACTICAL COMBAT";display:block;font-size:11px;font-weight:600;letter-spacing:4px;color:var(--text-muted);margin-top:8px;-webkit-text-fill-color:var(--text-muted)}.menu-subtitle{display:none}.menu-section{margin-bottom:16px;background:var(--bg-glass);border:1px solid var(--border-subtle);border-radius:16px;padding:16px;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.menu-section:hover{transform:none;border-color:var(--border-light)}.menu-section h3{display:none}.option-grid{display:flex;gap:10px}.map-section{padding:16px}.map-options-row{display:flex;gap:20px;flex-wrap:wrap}.map-option-group{flex:1;min-width:120px}.map-option-group .section-label{margin-bottom:10px}.size-grid{display:flex;gap:8px}.size-grid .option-btn{flex:1;min-width:40px}.landscape-section{padding:12px 16px}.section-label{font-size:12px;color:var(--text-secondary);margin-bottom:8px;text-transform:uppercase;letter-spacing:.5px}.ai-config-grid{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}.ai-config-item{display:flex;flex-direction:column;align-items:center;gap:4px}.ai-config-item .player-badge{width:24px;height:24px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:600;color:#fff}.ai-config-item .type-toggle{padding:4px 8px;border-radius:4px;border:1px solid var(--border);background:var(--surface);color:var(--text-primary);font-size:11px;cursor:pointer;transition:all .2s ease;min-width:50px;text-align:center}.ai-config-item .type-toggle:hover{border-color:var(--primary)}.ai-config-item .type-toggle.ai{background:linear-gradient(135deg,#f9731633,#ea580c1a);border-color:var(--orange);color:var(--orange)}.ai-config-item .type-toggle.human{background:linear-gradient(135deg,#22c55e33,#16a34a1a);border-color:var(--green);color:var(--green)}#alliance-section{transition:all .3s ease}.alliance-info{font-size:11px;color:var(--text-secondary);margin-bottom:12px;text-align:center;line-height:1.4}.alliance-toggle-row{display:flex;gap:8px;justify-content:center;margin-bottom:12px}.alliance-mode-btn{flex:1;max-width:150px;padding:10px 12px;border-radius:8px;border:2px solid var(--border-light);background:var(--bg-glass);color:var(--text-secondary);font-size:12px;font-weight:600;cursor:pointer;transition:all .2s ease}.alliance-mode-btn:hover{background:var(--bg-glass-hover);border-color:var(--text-secondary)}.alliance-mode-btn.selected{background:linear-gradient(135deg,#10b98133,#10b9810d);border-color:var(--green);color:var(--green);box-shadow:0 0 15px var(--green-glow)}.alliance-config-grid{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;padding:12px;background:var(--bg-glass);border-radius:8px;border:1px solid var(--border-subtle)}.alliance-player-item{display:flex;flex-direction:column;align-items:center;gap:6px;padding:8px;border-radius:8px;background:var(--bg-glass);border:1px solid var(--border-subtle);transition:all .2s ease}.alliance-player-item .player-badge{width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:700;color:#fff;box-shadow:var(--shadow-sm)}.alliance-player-item .team-select{padding:4px 8px;border-radius:4px;border:1px solid var(--border-light);background:var(--bg-secondary);color:var(--text-primary);font-size:12px;cursor:pointer;min-width:70px;text-align:center}.alliance-player-item .team-select:focus{outline:none;border-color:var(--green)}.team-indicator{width:100%;height:3px;border-radius:2px;margin-top:4px}.team-indicator.team-0{background:var(--green)}.team-indicator.team-1{background:var(--red)}.team-indicator.team-2{background:var(--blue)}.team-indicator.team-3{background:var(--yellow)}.landscape-grid{display:flex;flex-wrap:wrap;gap:8px}.landscape-grid .option-btn{min-width:42px;font-size:18px;padding:8px 10px}.landscape-preview{display:flex;align-items:center;justify-content:center;gap:12px;margin-top:12px;padding:14px 20px;background:linear-gradient(135deg,#10b98126,#10b9810d);border:2px solid var(--green);border-radius:12px;box-shadow:0 0 20px var(--green-glow)}.landscape-preview-icon{font-size:28px;filter:drop-shadow(0 2px 4px rgba(0,0,0,.3))}.landscape-preview-name{font-size:16px;font-weight:700;color:var(--green-light);letter-spacing:.5px}.audio-section{padding:12px 16px}.audio-controls{display:flex;align-items:center;gap:12px}.audio-label{font-size:13px;color:var(--text-secondary);white-space:nowrap}.volume-slider{flex:1;height:6px;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:var(--bg-tertiary);border-radius:3px;cursor:pointer}.volume-slider::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:18px;height:18px;background:var(--green);border-radius:50%;cursor:pointer;box-shadow:0 2px 8px var(--green-glow);transition:transform .2s,box-shadow .2s}.volume-slider::-webkit-slider-thumb:hover{transform:scale(1.15);box-shadow:0 4px 12px var(--green-glow)}.volume-slider::-moz-range-thumb{width:18px;height:18px;background:var(--green);border-radius:50%;cursor:pointer;border:none;box-shadow:0 2px 8px var(--green-glow)}.mute-btn{width:40px;height:40px;background:var(--bg-glass);border:1px solid var(--border-subtle);border-radius:10px;font-size:18px;cursor:pointer;transition:all .2s;display:flex;align-items:center;justify-content:center}.mute-btn:hover{background:var(--bg-glass-hover);border-color:var(--border-light)}.mute-btn.muted{opacity:.5}.settings-section{padding:12px 16px}.setting-row{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px}.setting-row:last-child{margin-bottom:0}.setting-label{font-size:13px;color:var(--text-secondary)}.setting-buttons{display:flex;gap:4px}.setting-btn{padding:6px 12px;background:var(--bg-glass);border:1px solid var(--border-subtle);border-radius:8px;font-size:12px;color:var(--text-secondary);cursor:pointer;transition:all .2s}.setting-btn:hover{background:var(--bg-glass-hover);border-color:var(--border-light)}.setting-btn.active{background:var(--green-dark);border-color:var(--green);color:var(--green-light)}.tutorial-controls{display:flex;gap:8px;align-items:center}.tutorial-controls .setting-buttons{flex:1}.tutorial-reset-btn{background:linear-gradient(135deg,#3b82f633,#3b82f61a);border-color:var(--blue);color:var(--blue);padding:6px 10px!important;min-width:auto!important}.tutorial-reset-btn:hover{background:linear-gradient(135deg,#3b82f64d,#3b82f633)}.advanced-section{padding:0;overflow:hidden}.advanced-toggle{width:100%;display:flex;align-items:center;gap:10px;padding:14px 16px;background:transparent;border:none;cursor:pointer;color:var(--text-secondary);font-size:13px;transition:all .2s}.advanced-toggle:hover{color:var(--text-primary);background:var(--bg-glass-hover)}.toggle-icon{font-size:16px}.toggle-label{flex:1;text-align:left;font-weight:500}.toggle-arrow{font-size:10px;transition:transform .3s ease}.advanced-section:not(.collapsed) .toggle-arrow{transform:rotate(180deg)}.advanced-content{max-height:0;overflow:hidden;transition:max-height .3s ease,padding .3s ease;padding:0 16px}.advanced-section:not(.collapsed) .advanced-content{max-height:300px;padding:0 16px 16px}.advanced-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:1px solid var(--border-subtle)}.advanced-row:last-child{border-bottom:none}.advanced-label{font-size:13px;color:var(--text-secondary);white-space:nowrap}.advanced-row .audio-controls{flex:1;max-width:200px}.advanced-row .setting-buttons{flex-shrink:0}.effects-section{padding:12px 16px}.effects-controls{display:flex;align-items:center;gap:12px}.toggle-label{display:flex;align-items:center;gap:10px;cursor:pointer;-webkit-user-select:none;user-select:none}.toggle-checkbox{display:none}.toggle-slider{position:relative;width:44px;height:24px;background:var(--bg-tertiary);border-radius:12px;transition:all .3s ease;border:1px solid var(--border-subtle)}.toggle-slider:after{content:"";position:absolute;top:2px;left:2px;width:18px;height:18px;background:var(--text-secondary);border-radius:50%;transition:all .3s ease}.toggle-checkbox:checked+.toggle-slider{background:var(--red);border-color:var(--red)}.toggle-checkbox:checked+.toggle-slider:after{left:22px;background:#fff}.toggle-text{font-size:13px;color:var(--text-secondary);transition:color .3s}.toggle-checkbox:checked~.toggle-text{color:var(--red)}.toggle-hint{font-size:11px;color:var(--text-muted);opacity:.7}.option-btn{flex:1;padding:16px 12px;background:linear-gradient(135deg,rgba(255,255,255,.03) 0%,transparent 100%);border:2px solid var(--border-subtle);border-radius:14px;color:var(--text-secondary);font-size:14px;font-weight:600;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden}.option-btn:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(180deg,rgba(255,255,255,.05) 0%,transparent 50%);pointer-events:none}.option-btn:hover{border-color:var(--border-light);color:var(--text-primary);transform:translateY(-2px);box-shadow:0 8px 25px #0000004d}.option-btn.selected{border-color:var(--green);background:linear-gradient(135deg,#10b98133,#10b9810d);color:var(--green-light);box-shadow:0 0 25px var(--green-glow),inset 0 0 20px #10b9811a}.start-btn{width:100%;padding:18px;background:linear-gradient(135deg,var(--green) 0%,#059669 100%);border:none;border-radius:14px;color:#fff;font-size:18px;font-weight:800;cursor:pointer;margin-top:20px;transition:all .3s cubic-bezier(.4,0,.2,1);flex-shrink:0;box-shadow:0 4px 20px var(--green-glow);text-transform:uppercase;letter-spacing:2px;position:relative;overflow:hidden}.start-btn:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);transition:left .5s}.start-btn:hover:before{left:100%}.start-btn:hover{background:linear-gradient(135deg,var(--green-light) 0%,var(--green) 100%);transform:translateY(-3px);box-shadow:0 8px 35px var(--green-glow)}.start-btn:active{transform:scale(.98) translateY(0)}.how-to-play{text-align:left;padding:5px;color:var(--dim);font-size:13px;line-height:1.8}.how-to-play h4{color:var(--light);margin-bottom:12px;font-size:14px}.class-info{display:flex;align-items:center;gap:12px;padding:10px;background:#ffffff08;border-radius:10px;margin-bottom:8px}.class-info .icon{font-size:28px;width:44px;height:44px;display:flex;align-items:center;justify-content:center;background:#ffffff0d;border-radius:10px}.class-info .details{flex:1}.class-info .name{font-weight:700;color:var(--light);font-size:14px}.class-info .desc{font-size:11px;color:var(--dim)}#turn-screen{align-items:center;justify-content:center;text-align:center;padding:20px;background:radial-gradient(circle at center,rgba(34,197,94,.15) 0%,transparent 50%),linear-gradient(180deg,#0f0f1a,#0a0a12)}.turn-badge{width:120px;height:120px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:48px;font-weight:900;margin-bottom:24px;box-shadow:0 0 40px #22c55e80;animation:pulse 2s infinite;color:#fff}@keyframes pulse{0%,to{transform:scale(1);box-shadow:0 0 40px #22c55e80}50%{transform:scale(1.05);box-shadow:0 0 60px #22c55eb3}}.turn-title{font-size:32px;font-weight:800;margin-bottom:8px}.turn-hint{color:var(--dim);margin-bottom:20px;font-size:16px}.players-alive-container{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-bottom:30px;padding:12px;background:#0000004d;border-radius:12px;max-width:320px}.players-alive-container .player-status{display:flex;align-items:center;gap:6px;padding:6px 12px;border-radius:20px;font-size:13px;font-weight:600;transition:all .2s ease}.players-alive-container .player-status.alive{background:#10b98133;border:1px solid rgba(16,185,129,.5);color:var(--green)}.players-alive-container .player-status.eliminated{background:#f43f5e26;border:1px solid rgba(244,63,94,.3);color:var(--red);opacity:.6;text-decoration:line-through}.players-alive-container .player-status.current{background:#3b82f64d;border:1px solid rgba(59,130,246,.7);color:#93c5fd;box-shadow:0 0 10px #3b82f666}.players-alive-container .player-dot{width:10px;height:10px;border-radius:50%;flex-shrink:0}.ready-btn{padding:18px 80px;background:transparent;border:2px solid var(--green);border-radius:14px;color:var(--green);font-size:18px;font-weight:700;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1)}.ready-btn:hover{background:#10b98126;border-color:var(--green-light);color:var(--green-light);transform:translateY(-2px);box-shadow:0 6px 25px var(--green-glow)}.ready-btn:active{background:var(--green);color:#fff;transform:scale(.98)}#round-start-screen{align-items:center;justify-content:center;text-align:center;padding:20px;background:radial-gradient(circle at center,rgba(59,130,246,.15) 0%,transparent 50%),linear-gradient(180deg,#0f0f1a,#0a0a12)}.round-start-header{margin-bottom:16px}.round-start-title{font-size:36px;font-weight:800;color:var(--light);text-shadow:0 0 20px rgba(59,130,246,.5)}.round-start-commentary{max-width:420px;margin:0 auto 18px;padding:0;background:transparent;border-radius:0;border-left:none;font-size:14px;line-height:1.5;color:var(--light)}.round-start-commentary.is-quiet{color:var(--dim);font-style:italic}.round-start-players{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-bottom:20px;max-width:400px}.round-start-player{display:flex;align-items:center;gap:8px;padding:10px 14px;background:#0000004d;border-radius:10px;border:1px solid rgba(255,255,255,.1);min-width:140px}.round-start-player.leading{border-color:#22c55e99;background:#22c55e26}.round-start-player.trailing{border-color:#ef444466;background:#ef44441a}.round-start-player.eliminated{opacity:.5}.round-start-player-color{width:12px;height:12px;border-radius:50%;flex-shrink:0}.round-start-player-info{flex:1;text-align:left}.round-start-player-name{font-size:14px;font-weight:600;color:var(--light)}.round-start-player-units{font-size:12px;color:var(--dim)}.round-start-player-badge{font-size:12px;padding:2px 6px;border-radius:4px;font-weight:600}.round-start-player.leading .round-start-player-badge{background:#22c55e4d;color:var(--green)}.round-start-player.trailing .round-start-player-badge{background:#ef44444d;color:var(--red)}.round-start-zone{margin-bottom:16px;padding:12px 20px;border-radius:8px;font-size:14px;display:none}.round-start-zone.visible{display:flex;align-items:center;gap:10px}.round-start-zone.warning{background:#fbbf2433;border:1px solid rgba(251,191,36,.5);color:var(--yellow)}.round-start-zone.shrinking{background:#ef444433;border:1px solid rgba(239,68,68,.5);color:var(--red)}.round-start-zone.normal{background:#3b82f633;border:1px solid rgba(59,130,246,.4);color:var(--blue)}.round-start-zone-icon{font-size:20px}.round-start-event{margin-bottom:20px;padding:10px 16px;background:#a855f733;border:1px solid rgba(168,85,247,.5);border-radius:8px;display:none}.round-start-event.visible{display:flex;align-items:center;gap:10px}.round-start-event-icon{font-size:24px}.round-start-event-name{font-size:14px;font-weight:600;color:#c084fc}#round-start-ready-btn{margin-top:10px}#game-area{flex:1;display:flex;flex-direction:column;min-height:0;height:100%;overflow:hidden;background:radial-gradient(ellipse at center,var(--bg-tertiary) 0%,var(--bg-primary) 100%)}.top-bar{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:10px 18px;padding-top:max(12px,env(safe-area-inset-top));background:linear-gradient(180deg,#00000080,#0000004d);border-bottom:1px solid var(--border-subtle);flex-shrink:0;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);position:relative}.player-indicator{display:flex;align-items:center;gap:8px}.player-name{font-weight:700;font-size:15px;letter-spacing:.3px;white-space:nowrap;text-shadow:0 1px 3px rgba(0,0,0,.5)}.round-dropdown{position:absolute;top:calc(100% + 8px);right:12px;background:#0c0c1dfa;border:1px solid var(--border-light);border-radius:12px;padding:8px;z-index:200;opacity:0;visibility:hidden;transform:translateY(-10px);transition:all .2s ease;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);box-shadow:0 8px 32px #00000080}.round-dropdown.visible{opacity:1;visibility:visible;transform:translateY(0)}.dropdown-players-alive{display:flex;flex-wrap:wrap;gap:6px;padding:8px;margin-bottom:8px;background:#0000004d;border-radius:8px;max-width:280px}.dropdown-players-alive .player-status{display:flex;align-items:center;gap:4px;padding:4px 8px;border-radius:12px;font-size:11px;font-weight:600}.dropdown-players-alive .player-status.alive{background:#10b98133;border:1px solid rgba(16,185,129,.4);color:var(--green)}.dropdown-players-alive .player-status.eliminated{background:#f43f5e1a;border:1px solid rgba(244,63,94,.2);color:var(--red);opacity:.5;text-decoration:line-through}.dropdown-players-alive .player-status.current{background:#3b82f640;border:1px solid rgba(59,130,246,.5);color:#93c5fd}.dropdown-players-alive .player-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}.dropdown-give-up-btn{display:flex;align-items:center;gap:8px;padding:12px 20px;background:linear-gradient(135deg,#f43f5e33,#f43f5e1a);border:1px solid rgba(244,63,94,.5);border-radius:8px;color:#fca5a5;font-weight:600;font-size:14px;cursor:pointer;transition:all .2s ease;white-space:nowrap}.dropdown-give-up-btn:hover{background:linear-gradient(135deg,#f43f5e4d,#f43f5e33);border-color:var(--red);color:#fecaca}.dropdown-give-up-btn .give-up-icon{font-size:16px}.dropdown-menu-btn{display:flex;align-items:center;gap:8px;padding:12px 20px;background:linear-gradient(135deg,#3b82f633,#3b82f61a);border:1px solid rgba(59,130,246,.5);border-radius:8px;color:#93c5fd;font-weight:600;font-size:14px;cursor:pointer;transition:all .2s ease;white-space:nowrap;margin-top:8px}.dropdown-menu-btn:hover{background:linear-gradient(135deg,#3b82f64d,#3b82f633);border-color:var(--blue);color:#bfdbfe}.dropdown-menu-btn .menu-icon{font-size:16px}.round-badge{background:#0f172acc;border:1px solid rgba(148,163,184,.2);padding:6px 12px;border-radius:999px;font-size:12px;font-weight:600;letter-spacing:.3px}.ap-display{display:flex;align-items:center;gap:6px}.ap-pip{width:30px;height:30px;border-radius:10px;background:linear-gradient(135deg,var(--yellow-light) 0%,var(--yellow) 100%);display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:800;color:#000;box-shadow:0 4px 15px var(--yellow-glow),inset 0 1px #ffffff4d;transition:all .3s ease}.ap-pip.used{background:var(--bg-glass);color:var(--text-muted);box-shadow:none;border:1px solid var(--border-subtle)}.ap-pool-display{display:flex;align-items:center;gap:6px;padding:6px 12px;background:linear-gradient(135deg,#f59e0b2e,#f59e0b12);border:1px solid rgba(245,158,11,.55);border-radius:14px;box-shadow:inset 0 1px #ffffff14}.ap-pool-label{font-size:11px;font-weight:600;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.5px}.ap-pool-value{font-size:20px;font-weight:800;color:var(--yellow-light);text-shadow:0 0 10px var(--yellow-glow);min-width:30px;text-align:center}.ap-pool-max{font-size:12px;font-weight:600;color:var(--text-muted)}.ap-pool-icon{font-size:16px;margin-left:2px}.canvas-container{flex:1;position:relative;overflow:hidden;min-height:200px}#game-canvas{width:100%;height:100%;touch-action:none;display:block;cursor:grab}#game-canvas:active{cursor:grabbing}.scroll-hint{position:absolute;bottom:50px;left:50%;transform:translate(-50%);background:#000000b3;padding:8px 16px;border-radius:20px;font-size:12px;color:var(--dim);pointer-events:none;animation:fadeInOut 3s ease-in-out}@keyframes fadeInOut{0%,to{opacity:0}20%,80%{opacity:1}}.target-info{position:absolute;top:10px;right:10px;transform:none;background:#000000e6;border:2px solid rgba(239,68,68,.6);padding:10px 16px;border-radius:12px;display:none;text-align:center;z-index:50;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);pointer-events:none}.target-info.visible{display:block}.target-info .hit-chance{color:var(--green);font-weight:800;font-size:28px;text-shadow:0 0 10px rgba(34,197,94,.5)}.target-info .damage{color:var(--red);font-size:14px;margin-top:4px}.target-info .cover-info{font-size:11px;margin-top:6px;padding:4px 8px;border-radius:4px;font-weight:500}.target-info .cover-info.clear{color:#9ca3af}.target-info .cover-info.effective{color:#22c55e;background:#22c55e26}.target-info .cover-info.flanked{color:#fbbf24;background:#fbbf2426}.target-info .cover-info.bypassed{color:#f97316;background:#f9731626}.target-info .cover-info.obstacles{color:#a78bfa;background:#a78bfa26}.target-info .cover-info.guaranteed{color:#22c55e;background:#22c55e40;font-weight:600}.target-info .cover-info.hard-shot{color:#ef4444;background:#ef444433;font-weight:600;animation:pulseWarning 1s infinite ease-in-out}@keyframes pulseWarning{0%,to{opacity:.8}50%{opacity:1;box-shadow:0 0 10px #ef444480}}#hit-chance.shot-easy{color:#22c55e!important;text-shadow:0 0 10px rgba(34,197,94,.5)}#hit-chance.shot-medium{color:#fbbf24!important;text-shadow:0 0 10px rgba(251,191,36,.5)}#hit-chance.shot-hard{color:#ef4444!important;text-shadow:0 0 10px rgba(239,68,68,.5);animation:pulseWarning 1s infinite ease-in-out}#hit-chance.shot-impossible{color:#dc2626!important;text-shadow:0 0 15px rgba(220,38,38,.7)}.target-info .attack-hint{color:var(--yellow);font-size:11px;font-weight:600;margin-top:8px;padding-top:8px;border-top:1px solid rgba(255,255,255,.1);animation:pulseHint 1.5s infinite ease-in-out;text-transform:uppercase;letter-spacing:.5px}@keyframes pulseHint{0%,to{opacity:.7}50%{opacity:1}}.unit-panel{background:linear-gradient(0deg,#000c,#00000080);border-top:1px solid var(--border-subtle);padding:8px 12px;padding-bottom:max(8px,env(safe-area-inset-bottom));flex-shrink:0;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px)}.unit-tabs{display:flex;gap:6px;margin-bottom:8px}.unit-tab{flex:1;padding:8px 6px;background:var(--bg-glass);border:2px solid var(--border-subtle);border-radius:12px;cursor:pointer;text-align:center;transition:all .2s ease;position:relative;overflow:hidden}.unit-tab:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(180deg,rgba(255,255,255,.05) 0%,transparent 50%);pointer-events:none}.unit-tab.selected{border-color:var(--green);background:linear-gradient(135deg,#10b98126,#10b9810d);box-shadow:0 0 25px var(--green-glow),inset 0 0 15px #10b9811a;transform:translateY(-2px)}.unit-tab.dead{opacity:.5;pointer-events:none;filter:grayscale(1);position:relative;border-color:var(--red)!important}.unit-tab.dead:before{content:"TOT";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) rotate(-15deg);font-size:14px;font-weight:900;color:var(--red);text-shadow:0 0 10px var(--red-glow);z-index:10;letter-spacing:2px}.unit-tab.dead:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:#f43f5e26;border-radius:14px}.unit-tab .class-icon{font-size:24px;margin-bottom:4px;filter:drop-shadow(0 1px 2px rgba(0,0,0,.3))}.unit-tab .class-name{display:none}.unit-tab .hp-bar{height:6px;background:#0006;border-radius:4px;overflow:hidden;box-shadow:inset 0 1px 2px #0000004d}.unit-tab .hp-fill{height:100%;background:linear-gradient(90deg,var(--green) 0%,var(--green-light) 100%);transition:width .4s ease;border-radius:4px;box-shadow:0 0 10px var(--green-glow)}.unit-tab .hp-fill.medium{background:linear-gradient(90deg,var(--yellow) 0%,var(--yellow-light) 100%);box-shadow:0 0 10px var(--yellow-glow)}.unit-tab .hp-fill.low{background:linear-gradient(90deg,var(--red) 0%,var(--red-light) 100%);box-shadow:0 0 10px var(--red-glow);animation:lowHpPulse 1s infinite}@keyframes lowHpPulse{0%,to{opacity:1}50%{opacity:.7}}.unit-tab .ap-bar-container{display:flex;align-items:center;gap:4px;margin-top:4px}.unit-tab .ap-bar{flex:1;height:5px;background:#0006;border-radius:3px;overflow:hidden;box-shadow:inset 0 1px 2px #0000004d}.unit-tab .ap-fill{height:100%;background:linear-gradient(90deg,var(--yellow) 0%,var(--yellow-light) 100%);transition:width .3s ease;border-radius:3px;box-shadow:0 0 8px var(--yellow-glow)}.unit-tab .ap-fill.medium{background:linear-gradient(90deg,#f97316,#fb923c);box-shadow:0 0 8px #f9731680}.unit-tab .ap-fill.low{background:linear-gradient(90deg,var(--red) 0%,var(--red-light) 100%);box-shadow:0 0 8px var(--red-glow);animation:lowApPulse .8s infinite}@keyframes lowApPulse{0%,to{opacity:1}50%{opacity:.6}}.unit-tab .ap-number{font-size:11px;font-weight:700;color:var(--yellow-light);min-width:28px;text-align:right}.unit-tab .ap-number:has(+.ap-fill.low),.unit-tab.selected .ap-fill.low+.ap-number{color:var(--red-light)}.unit-tab .move-bar-container{display:flex;align-items:center;gap:4px;margin-top:4px}.unit-tab .move-bar{flex:1;height:5px;background:#0006;border-radius:3px;overflow:hidden;box-shadow:inset 0 1px 2px #0000004d}.unit-tab .move-fill{height:100%;background:linear-gradient(90deg,var(--cyan) 0%,var(--blue-light) 100%);transition:width .3s ease;border-radius:3px;box-shadow:0 0 8px var(--blue-glow)}.unit-tab .move-fill.medium{background:linear-gradient(90deg,#f97316,#fb923c);box-shadow:0 0 8px #f9731680}.unit-tab .move-fill.low{background:linear-gradient(90deg,var(--red) 0%,var(--red-light) 100%);box-shadow:0 0 8px var(--red-glow)}.unit-tab .move-fill.depleted{background:var(--bg-glass);box-shadow:none;width:0!important}.unit-tab .move-number{font-size:10px;font-weight:700;color:var(--blue-light);min-width:36px;text-align:right}.unit-tab .move-fill.low~.move-number,.unit-tab .move-fill.depleted~.move-number{color:var(--red-light)}.action-row{display:flex;gap:6px;flex-wrap:wrap}@media(max-width:480px){.action-row{gap:4px;flex-wrap:wrap}.action-btn{padding:8px;border-radius:10px;min-width:0}.action-btn .icon{font-size:18px}.action-btn .label{font-size:9px!important;max-width:70px}.action-btn.special-btn{flex:1 1 auto;min-width:90px;padding:8px 10px;gap:4px}.action-btn.special-btn .label{max-width:60px}.action-btn.overwatch-btn,.action-btn.ambush-btn,.action-btn.suppress-btn,.action-btn.coordinate-btn{flex:1 1 auto;min-width:80px;padding:6px 8px;gap:4px}.action-btn.waypoint-btn{flex:0 1 auto;min-width:80px;padding:6px 8px}.end-turn-btn{flex:1 1 100%;margin-top:4px;padding:12px 16px;font-size:11px}}@media(max-width:360px){.action-row{gap:3px;flex-wrap:wrap}.action-btn{padding:6px}.action-btn .icon{font-size:16px}.action-btn .label{font-size:8px!important;max-width:50px}.action-btn.special-btn{min-width:70px;padding:6px 8px}.action-btn.special-btn .label{max-width:45px}.action-btn.overwatch-btn,.action-btn.ambush-btn,.action-btn.suppress-btn,.action-btn.coordinate-btn{min-width:65px;padding:6px}.end-turn-btn{padding:10px 12px;font-size:10px}}.action-btn{flex:1;padding:10px;background:var(--bg-glass);border:2px solid var(--border-subtle);border-radius:12px;color:var(--text-primary);cursor:pointer;display:flex;align-items:center;justify-content:center;position:relative;transition:all .2s ease;overflow:hidden}.action-btn:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(180deg,rgba(255,255,255,.05) 0%,transparent 50%);pointer-events:none}.action-btn .icon{font-size:22px;filter:drop-shadow(0 1px 2px rgba(0,0,0,.2));transition:transform .2s ease;flex-shrink:0}.action-btn .label{font-size:10px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}.action-btn:hover .icon{transform:scale(1.1)}.action-btn.selected{border-color:var(--green);background:linear-gradient(135deg,#10b98133,#10b9811a);color:var(--green-light);box-shadow:0 0 25px var(--green-glow),inset 0 0 15px #10b9811a;transform:translateY(-2px)}.action-btn.disabled{opacity:.35;pointer-events:none;filter:grayscale(.6)}.action-btn.disabled:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:#0000004d;border-radius:12px}.action-btn .ap-cost{position:absolute;top:-6px;right:-6px;min-width:26px;height:26px;padding:0 8px;background:linear-gradient(135deg,var(--yellow-light) 0%,var(--yellow) 100%);color:#000;font-size:11px;font-weight:800;border-radius:14px;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 12px var(--yellow-glow);border:2px solid rgba(0,0,0,.1)}.action-btn.cover-btn{flex:1;gap:6px;padding:10px 12px;background:linear-gradient(135deg,#22c55e33,#16a34a1a);border-color:var(--green)}.action-btn.cover-btn:hover{background:linear-gradient(135deg,#22c55e4d,#16a34a33);transform:translateY(-2px);box-shadow:0 0 20px #22c55e4d}.action-btn.cover-btn .label{font-size:11px;font-weight:600;color:var(--green-light)}.action-btn.cover-btn.active{background:linear-gradient(135deg,#22c55e66,#16a34a4d);border-color:var(--green-light);box-shadow:0 0 20px var(--green-glow)}.action-btn.cover-btn.disabled{opacity:.4;pointer-events:none}.action-btn.special-btn{flex:1.5;gap:6px;padding:10px 14px;min-width:100px;background:linear-gradient(135deg,#a855f733,#8b5cf61a);border-color:var(--purple)}.action-btn.special-btn:hover{background:linear-gradient(135deg,#a855f74d,#8b5cf633);transform:translateY(-2px);box-shadow:0 0 20px #a855f74d}.action-btn.special-btn .label{font-size:11px;font-weight:600;color:var(--purple-light);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.action-btn.special-btn.disabled{opacity:.4;pointer-events:none}.action-btn.waypoint-btn{flex:1;gap:4px;padding:8px 12px;background:linear-gradient(135deg,#fb923c33,#ea580c1a);border-color:var(--orange, #f97316)}.action-btn.waypoint-btn:hover{background:linear-gradient(135deg,#fb923c4d,#ea580c33);transform:translateY(-2px);box-shadow:0 0 20px #fb923c4d}.action-btn.waypoint-btn .label{font-size:10px;font-weight:600;color:#fdba74}.action-btn.overwatch-btn{flex:1 1 auto;gap:4px;padding:8px 10px;min-width:90px;background:linear-gradient(135deg,#3b82f633,#2563eb1a);border-color:var(--blue, #3b82f6)}.action-btn.overwatch-btn:hover{background:linear-gradient(135deg,#3b82f64d,#2563eb33);transform:translateY(-2px);box-shadow:0 0 20px #3b82f64d}.action-btn.overwatch-btn .label{font-size:10px;font-weight:600;color:var(--blue-light, #93c5fd);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.action-btn.ambush-btn{flex:1 1 auto;gap:4px;padding:8px 10px;min-width:90px;background:linear-gradient(135deg,#eab30833,#ca8a041a);border-color:var(--yellow, #eab308)}.action-btn.ambush-btn:hover{background:linear-gradient(135deg,#eab3084d,#ca8a0433);transform:translateY(-2px);box-shadow:0 0 20px #eab3084d}.action-btn.ambush-btn .label{font-size:10px;font-weight:600;color:var(--yellow-light, #fde047);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.action-btn.suppress-btn{flex:1 1 auto;gap:4px;padding:8px 10px;min-width:100px;background:linear-gradient(135deg,#ef444433,#dc26261a);border-color:var(--red, #ef4444)}.action-btn.suppress-btn:hover{background:linear-gradient(135deg,#ef44444d,#dc262633);transform:translateY(-2px);box-shadow:0 0 20px #ef44444d}.action-btn.suppress-btn .label{font-size:10px;font-weight:600;color:var(--red-light, #fca5a5);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.action-btn.coordinate-btn{flex:1 1 auto;gap:4px;padding:8px 10px;min-width:100px;background:linear-gradient(135deg,#22c55e33,#16a34a1a);border-color:var(--green, #22c55e)}.action-btn.coordinate-btn:hover{background:linear-gradient(135deg,#22c55e4d,#16a34a33);transform:translateY(-2px);box-shadow:0 0 20px #22c55e4d}.action-btn.coordinate-btn .label{font-size:10px;font-weight:600;color:var(--green-light, #86efac);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.action-btn.suggested{animation:suggestPulse 1.5s ease-in-out infinite;border-color:#fbbf24!important;box-shadow:0 0 20px #fbbf2466}.action-btn.suggested:before{background:linear-gradient(180deg,rgba(251,191,36,.15) 0%,transparent 50%)}@keyframes suggestPulse{0%,to{transform:scale(1);box-shadow:0 0 15px #fbbf244d}50%{transform:scale(1.02);box-shadow:0 0 25px #fbbf2480}}.special-tip{font-size:9px;color:#fbbf24;margin-top:2px;opacity:.9;text-align:center}.end-turn-btn{flex:1;padding:14px 20px;background:linear-gradient(135deg,var(--red) 0%,#dc2626 100%);border:none;border-radius:14px;color:#fff;font-weight:700;font-size:12px;cursor:pointer;box-shadow:0 4px 15px var(--red-glow);transition:all .3s cubic-bezier(.4,0,.2,1);text-transform:uppercase;letter-spacing:.5px;position:relative;overflow:hidden}.end-turn-btn:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.15),transparent);transition:left .4s}.end-turn-btn:hover:before{left:100%}.end-turn-btn:hover{transform:translateY(-2px);box-shadow:0 8px 25px var(--red-glow)}.end-turn-btn:active{transform:translateY(0) scale(.98)}.give-up-btn{flex:.7;padding:12px 16px;background:linear-gradient(135deg,#334155f2,#1e293bf2);border:1px solid rgba(248,113,113,.55);border-radius:14px;color:#fca5a5;font-weight:700;font-size:11px;cursor:pointer;box-shadow:0 4px 12px #0f172a73;transition:all .3s cubic-bezier(.4,0,.2,1);text-transform:uppercase;letter-spacing:.6px;position:relative;overflow:hidden;display:inline-flex;align-items:center;justify-content:center;gap:6px}.give-up-btn:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.12),transparent);transition:left .4s}.give-up-btn:hover:before{left:100%}.give-up-btn:hover{transform:translateY(-2px);box-shadow:0 8px 18px #f8717140;border-color:#f87171cc;color:#fecaca}.give-up-btn:active{transform:translateY(0) scale(.98)}.give-up-icon{font-size:14px;filter:drop-shadow(0 1px 1px rgba(15,23,42,.45))}.give-up-label{line-height:1}@media(max-width:360px){.give-up-btn{flex:0 0 auto;padding:12px;min-width:44px}.give-up-label{display:none}.give-up-icon{margin:0}}.give-up-btn:disabled,.end-turn-btn:disabled{opacity:.5;cursor:not-allowed;box-shadow:none;transform:none}.bottom-safe{height:env(safe-area-inset-bottom);background:#00000080;flex-shrink:0}#gameover{align-items:center;justify-content:center;text-align:center;padding:20px;background:radial-gradient(ellipse 80% 50% at 50% 20%,rgba(251,191,36,.15) 0%,transparent 50%),radial-gradient(ellipse 60% 40% at 50% 80%,rgba(34,197,94,.08) 0%,transparent 50%),linear-gradient(180deg,rgba(15,23,42,.95) 0%,var(--darker) 100%);animation:victoryScreenFadeIn .8s ease-out;overflow-y:auto}@keyframes victoryScreenFadeIn{0%{opacity:0;background-position:0 -50px}to{opacity:1;background-position:0 0}}.winner-icon{font-size:72px;margin-bottom:8px;animation:trophyEntrance 1s cubic-bezier(.34,1.56,.64,1) forwards;filter:drop-shadow(0 8px 24px rgba(251,191,36,.4))}@keyframes trophyEntrance{0%{opacity:0;transform:scale(.3) translateY(-100px) rotate(-15deg)}50%{opacity:1;transform:scale(1.15) translateY(0) rotate(5deg)}70%{transform:scale(.95) rotate(-3deg)}to{transform:scale(1) rotate(0)}}.winner-text{font-size:28px;font-weight:800;margin-bottom:16px;background:linear-gradient(135deg,#fbbf24,#f59e0b,#fcd34d);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;animation:winnerTextReveal .6s ease-out .3s backwards;text-shadow:none;filter:drop-shadow(0 2px 4px rgba(0,0,0,.3))}@keyframes winnerTextReveal{0%{opacity:0;transform:translateY(20px) scale(.9);filter:blur(10px)}to{opacity:1;transform:translateY(0) scale(1);filter:blur(0)}}.awards-container{display:flex;flex-direction:column;align-items:center;gap:12px;max-width:420px;width:100%;max-height:55vh;overflow-y:auto;overflow-x:hidden;padding:8px 12px 16px;margin-bottom:16px;animation:containerSlideUp .5s ease-out .4s backwards}@keyframes containerSlideUp{0%{opacity:0;transform:translateY(40px)}to{opacity:1;transform:translateY(0)}}.awards-container::-webkit-scrollbar{width:4px}.awards-container::-webkit-scrollbar-track{background:#ffffff0d;border-radius:2px}.awards-container::-webkit-scrollbar-thumb{background:#fbbf244d;border-radius:2px}.awards-container::-webkit-scrollbar-thumb:hover{background:#fbbf2480}.award-card{display:flex;align-items:center;gap:10px;padding:10px 14px;background:linear-gradient(135deg,#1e1e3ce6,#14142de6);border:1px solid rgba(255,255,255,.15);border-radius:12px;min-width:200px;animation:awardSlideIn .4s ease-out backwards}.award-card:nth-child(1){animation-delay:.1s}.award-card:nth-child(2){animation-delay:.2s}.award-card:nth-child(3){animation-delay:.3s}.award-card:nth-child(4){animation-delay:.4s}.award-card:nth-child(5){animation-delay:.5s}.award-card:nth-child(6){animation-delay:.6s}.award-card:nth-child(7){animation-delay:.7s}.award-card:nth-child(8){animation-delay:.8s}@keyframes awardSlideIn{0%{opacity:0;transform:translateY(20px) scale(.9)}to{opacity:1;transform:translateY(0) scale(1)}}.award-icon{font-size:24px;flex-shrink:0}.award-content{display:flex;flex-direction:column;text-align:left}.award-title{font-size:12px;font-weight:700;color:#fbbf24;text-transform:uppercase;letter-spacing:.5px}.award-player{font-size:14px;font-weight:600;color:var(--light)}.award-value{font-size:11px;color:var(--dim)}.award-player .player-dot{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:6px}.victory-podium{display:flex;justify-content:center;align-items:flex-end;gap:12px;margin-bottom:20px;padding:0 12px}.podium-slot{display:flex;flex-direction:column;align-items:center;animation:podiumRise .6s ease-out backwards}.podium-slot.position-1{animation-delay:.2s}.podium-slot.position-2{animation-delay:.1s}.podium-slot.position-3{animation-delay:.3s}@keyframes podiumRise{0%{opacity:0;transform:translateY(40px)}to{opacity:1;transform:translateY(0)}}.podium-slot.empty{width:90px}.podium-slot.champion{transform:scale(1.05)}.podium-slot.champion .podium-medal-badge{animation:goldGlow 1.5s ease-in-out infinite alternate}@keyframes goldGlow{0%{filter:drop-shadow(0 0 8px rgba(251,191,36,.6))}to{filter:drop-shadow(0 0 16px rgba(251,191,36,.9))}}.podium-figure{display:flex;flex-direction:column;align-items:center;margin-bottom:8px}.podium-medal-badge{font-size:32px;margin-bottom:4px}.position-1 .podium-medal-badge{font-size:40px}.podium-unit{width:100px;height:100px;margin-bottom:4px}.podium-canvas{width:100%;height:100%}.podium-details{display:flex;flex-direction:column;align-items:center;gap:2px}.podium-player-name{font-size:14px;font-weight:700;text-shadow:0 1px 3px rgba(0,0,0,.5)}.podium-points{font-size:12px;color:var(--dim);font-weight:600}.podium-pedestal{width:95px;border-radius:10px 10px 0 0;background:linear-gradient(180deg,color-mix(in srgb,var(--player-color) 60%,white) 0%,var(--player-color) 30%,color-mix(in srgb,var(--player-color) 80%,black) 100%);display:flex;align-items:center;justify-content:center;box-shadow:inset 0 2px 4px #fff3,0 4px 12px #0000004d}.pedestal-rank{font-size:28px;font-weight:900;color:#fff6;text-shadow:0 2px 4px rgba(0,0,0,.3)}.mvp-section{margin-bottom:16px;padding:0 8px}.section-header{font-size:11px;color:var(--dim);text-transform:uppercase;letter-spacing:1.5px;margin-bottom:10px;text-align:center}.mvp-grid{display:flex;justify-content:center;gap:8px;flex-wrap:wrap}.mvp-card{display:flex;align-items:center;gap:8px;padding:8px 12px;background:linear-gradient(135deg,#1e1e32f2,#141428f2);border:1px solid color-mix(in srgb,var(--card-color) 40%,transparent);border-radius:10px;min-width:140px;animation:cardSlideIn .4s ease-out backwards}.mvp-card:nth-child(1){animation-delay:.4s}.mvp-card:nth-child(2){animation-delay:.5s}.mvp-card:nth-child(3){animation-delay:.6s}.mvp-card:nth-child(4){animation-delay:.7s}@keyframes cardSlideIn{0%{opacity:0;transform:translate(-20px)}to{opacity:1;transform:translate(0)}}.mvp-unit-sprite{width:64px;height:64px;flex-shrink:0}.mvp-canvas{width:100%;height:100%}.mvp-info{display:flex;flex-direction:column;gap:2px}.mvp-title{font-size:11px;font-weight:700;color:#fbbf24}.mvp-player{font-size:12px;font-weight:600}.mvp-stats{display:flex;gap:8px;font-size:10px;color:var(--dim)}.awards-section{margin-bottom:16px;padding:0 8px}.awards-grid{display:flex;justify-content:center;gap:8px;flex-wrap:wrap}.award-card{display:flex;align-items:center;gap:10px;padding:10px 14px;background:linear-gradient(135deg,#28233cf2,#19162df2);border:1px solid rgba(251,191,36,.2);border-radius:10px;min-width:160px;animation:awardSlideIn .4s ease-out backwards}.award-card:nth-child(1){animation-delay:.5s}.award-card:nth-child(2){animation-delay:.6s}.award-card:nth-child(3){animation-delay:.7s}.award-card:nth-child(4){animation-delay:.8s}.award-icon-large{font-size:26px;flex-shrink:0}.award-details{display:flex;flex-direction:column;text-align:left}.award-name{font-size:12px;font-weight:700;color:#fbbf24}.award-recipient{font-size:11px;font-weight:600}.award-value{font-size:10px;color:var(--dim)}.game-stats-section{padding:12px 8px;margin-top:8px;border-top:1px solid rgba(255,255,255,.08)}.stats-row{display:flex;justify-content:center;gap:16px;flex-wrap:wrap}.stat-item{display:flex;flex-direction:column;align-items:center;gap:2px;padding:8px 16px;background:#ffffff08;border-radius:8px;min-width:70px;animation:statFadeIn .5s ease-out backwards}.stat-item:nth-child(1){animation-delay:.7s}.stat-item:nth-child(2){animation-delay:.8s}.stat-item:nth-child(3){animation-delay:.9s}.stat-item:nth-child(4){animation-delay:1s}@keyframes statFadeIn{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}.stat-icon{font-size:18px}.stat-value{font-size:18px;font-weight:800;color:var(--light)}.stat-label{font-size:9px;color:var(--dim);text-transform:uppercase;letter-spacing:.5px}.podium-container{display:flex;justify-content:center;align-items:flex-end;gap:8px;margin-bottom:24px;padding:0 16px}.podium-spot{display:flex;flex-direction:column;align-items:center}.podium-spot.empty{width:90px}.podium-spot.winner{transform:scale(1.05)}.podium-player{display:flex;flex-direction:column;align-items:center;margin-bottom:8px}.podium-medal{font-size:28px;margin-bottom:4px}.position-1 .podium-medal{font-size:36px}.podium-sprite{width:80px;height:80px;margin-bottom:6px}.podium-name{font-size:14px;font-weight:700;text-align:center;margin-bottom:2px}.podium-score{font-size:12px;color:var(--dim);font-weight:600}.podium-block{width:90px;border-radius:8px 8px 0 0;display:flex;align-items:center;justify-content:center}.position-1 .podium-block{height:80px}.position-2 .podium-block{height:55px}.position-3 .podium-block{height:35px}.podium-position{font-size:24px;font-weight:800;color:#ffffff4d}.top-awards{margin-top:16px;padding-top:16px;border-top:1px solid rgba(255,255,255,.1)}.awards-title{font-size:12px;color:var(--dim);text-transform:uppercase;letter-spacing:1px;margin-bottom:12px}.awards-list{display:flex;justify-content:center;gap:16px;flex-wrap:wrap}.award-badge{display:flex;align-items:center;gap:8px;padding:8px 12px;background:#ffffff0d;border-radius:8px}.award-badge .award-icon{font-size:20px}.award-info{text-align:left}.award-badge .award-title{font-size:11px;color:#fbbf24;font-weight:600}.award-badge .award-player{font-size:12px;font-weight:500}.gameover-buttons{display:flex;gap:12px;flex-wrap:wrap;justify-content:center;animation:buttonsReveal .5s ease-out .8s backwards;padding-bottom:env(safe-area-inset-bottom,20px)}@keyframes buttonsReveal{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.go-btn{padding:14px 40px;border-radius:12px;font-size:15px;font-weight:700;cursor:pointer;margin:4px;transition:all .2s ease;text-transform:uppercase;letter-spacing:.5px}.go-btn.primary{background:linear-gradient(135deg,var(--green) 0%,#16a34a 100%);border:none;color:#fff;box-shadow:0 4px 16px #22c55e59}.go-btn.primary:hover{transform:translateY(-2px);box-shadow:0 6px 24px #22c55e80}.go-btn.primary:active{transform:translateY(0)}.go-btn.secondary{background:#ffffff0d;border:1px solid rgba(255,255,255,.2);color:var(--light)}.go-btn.secondary:hover{background:#ffffff1a;border-color:#ffffff4d}.toast{position:fixed;top:80px;left:50%;transform:translate(-50%);background:linear-gradient(135deg,#0c0c1dfa,#12122bfa);border:2px solid var(--border-light);padding:14px 28px;border-radius:14px;font-weight:700;font-size:16px;z-index:200;animation-name:toastAnim;animation-duration:3.5s;animation-fill-mode:forwards;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);box-shadow:var(--shadow-lg),0 0 40px #00000080;pointer-events:none}@keyframes toastAnim{0%{opacity:0;transform:translate(-50%) translateY(-20px) scale(.9)}10%{transform:translate(-50%) translateY(0) scale(1.02)}20%,75%{opacity:1;transform:translate(-50%) translateY(0) scale(1)}to{opacity:0;transform:translate(-50%) translateY(-10px) scale(.95)}}.toast.hit{border-color:var(--green);color:var(--green-light);box-shadow:var(--shadow-lg),0 0 40px var(--green-glow)}.toast.miss{border-color:var(--red);color:var(--red-light);box-shadow:var(--shadow-lg),0 0 40px var(--red-glow)}.toast.warning{border-color:var(--yellow);color:var(--yellow-light);box-shadow:var(--shadow-lg),0 0 40px var(--yellow-glow)}.toast.special{border-color:var(--purple);color:var(--purple-light);box-shadow:var(--shadow-lg),0 0 40px var(--purple-glow)}.fog-info{position:absolute;bottom:10px;right:10px;background:#000000b3;padding:8px 12px;border-radius:8px;font-size:11px;color:var(--dim);display:flex;gap:12px}.fog-info span{display:flex;align-items:center;gap:4px}.fog-info .dot{width:10px;height:10px;border-radius:2px}.fog-info .dot.visible{background:var(--green)}.fog-info .dot.explored{background:#444}.fog-info .dot.hidden{background:#111}.unit-tab .unit-level{display:inline-block;padding:2px 8px;border-radius:10px;font-size:9px;font-weight:700;color:#fff;margin-bottom:4px;text-shadow:0 1px 2px rgba(0,0,0,.3)}.unit-tab .xp-bar{height:3px;background:#ffffff1a;border-radius:2px;overflow:hidden;margin-top:4px}.unit-tab .xp-fill{height:100%;background:linear-gradient(90deg,var(--purple),#c084fc);transition:width .3s;border-radius:2px}.event-banner{position:fixed;bottom:100px;right:16px;transform:translate(120%);background:linear-gradient(135deg,#000000e6,#141428e6);border-left:4px solid var(--event-color, var(--purple));border-radius:8px;padding:12px 16px;display:flex;align-items:center;gap:12px;z-index:150;opacity:0;transition:all .4s cubic-bezier(.4,0,.2,1);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 4px 20px #0006;max-width:280px;pointer-events:none}.event-banner.show{opacity:1;transform:translate(0)}.event-banner .event-icon{font-size:28px;flex-shrink:0;animation:eventPulse 2s ease-in-out infinite}@keyframes eventPulse{0%,to{transform:scale(1);opacity:.9}50%{transform:scale(1.1);opacity:1}}.event-banner .event-content{text-align:left;min-width:0}.event-banner .event-title{font-size:14px;font-weight:700;color:var(--light);margin-bottom:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.event-banner .event-desc{font-size:12px;color:var(--dim);line-height:1.3}@media(max-width:600px){.event-banner{bottom:80px;right:50%;transform:translate(50%) translateY(100%);max-width:90%}.event-banner.show{transform:translate(50%) translateY(0)}}.round-start-screen{position:fixed;top:0;left:0;right:0;bottom:0;background:#000000d9;display:flex;justify-content:center;align-items:center;z-index:900;opacity:0;transition:opacity .3s ease;pointer-events:none}.round-start-screen.show{opacity:1}.round-start-content{text-align:center;padding:24px;max-width:400px;width:90%}.round-number{font-size:48px;font-weight:800;color:#fbbf24;text-transform:uppercase;letter-spacing:4px;margin-bottom:24px;text-shadow:0 0 20px rgba(251,191,36,.5);animation:roundPulse 1.5s ease-in-out infinite}@keyframes roundPulse{0%,to{transform:scale(1)}50%{transform:scale(1.03)}}.round-players{display:flex;flex-direction:column;gap:10px;margin-bottom:20px}.round-player{display:flex;align-items:center;gap:12px;padding:10px 16px;background:#ffffff0d;border-radius:10px;transition:all .3s ease}.round-player.current{background:#22c55e26;border:1px solid rgba(34,197,94,.3)}.round-player.eliminated{opacity:.4;background:#ef44441a}.round-player-color{width:12px;height:12px;border-radius:50%;flex-shrink:0}.round-player-info{flex:1;text-align:left}.round-player-name{font-size:14px;font-weight:600;color:var(--light)}.round-player-units{font-size:12px;color:var(--dim)}.round-player-turn{font-size:11px;font-weight:600;color:#22c55e;padding:4px 8px;background:#22c55e33;border-radius:12px;text-transform:uppercase;letter-spacing:.5px}.round-zone{display:flex;align-items:center;justify-content:center;gap:10px;padding:12px 16px;background:#ffffff0d;border-radius:10px;margin-bottom:12px}.round-zone.warning{background:#eab30826;border:1px solid rgba(234,179,8,.3)}.round-zone.shrinking{background:#ef444426;border:1px solid rgba(239,68,68,.3)}.round-zone-icon{font-size:20px}.round-zone-text{font-size:13px;color:var(--light)}.round-event{display:flex;align-items:center;justify-content:center;gap:8px;padding:10px 16px;background:#a855f726;border:1px solid rgba(168,85,247,.3);border-radius:10px}.round-event-icon{font-size:18px}.round-event-name{font-size:13px;font-weight:600;color:#a855f7}.toast.crit{border-color:var(--yellow);color:var(--yellow);background:#eab30826;animation-name:critAnim}@keyframes critAnim{0%{opacity:0;transform:translate(-50%) scale(.5)}10%{transform:translate(-50%) scale(1.1)}20%,75%{opacity:1;transform:translate(-50%) scale(1)}to{opacity:0;transform:translate(-50%) scale(.9)}}.toast.levelup{border-color:var(--purple);color:var(--purple);background:linear-gradient(135deg,#a855f733,#8b5cf61a);box-shadow:0 0 30px #a855f766}.toast.powerup{border-color:var(--blue);color:var(--blue);background:linear-gradient(135deg,#3b82f633,#2563eb1a)}.toast.info{border-color:#22d3d1;color:#22d3d1;background:linear-gradient(135deg,#22d3d126,#14b8a61a);box-shadow:var(--shadow-lg),0 0 30px #22d3d14d}.unit-shield{position:absolute;top:-10px;left:50%;transform:translate(-50%);font-size:16px;text-shadow:0 0 10px rgba(59,130,246,.8);animation:shieldPulse 2s infinite}@keyframes shieldPulse{0%,to{opacity:.8}50%{opacity:1}}.shake-light{animation:shakeLight .2s ease-out}.shake-heavy{animation:shakeHeavy .4s ease-out}@keyframes shakeLight{0%,to{transform:translate(0)}20%{transform:translate(-4px) rotate(-.5deg)}40%{transform:translate(4px) rotate(.5deg)}60%{transform:translate(-3px) rotate(-.3deg)}80%{transform:translate(2px) rotate(.2deg)}}@keyframes shakeHeavy{0%,to{transform:translate(0)}10%{transform:translate(-8px) rotate(-1deg)}20%{transform:translate(8px) rotate(1deg)}30%{transform:translate(-7px) rotate(-.8deg)}40%{transform:translate(7px) rotate(.8deg)}50%{transform:translate(-5px) rotate(-.5deg)}60%{transform:translate(5px) rotate(.5deg)}70%{transform:translate(-3px) rotate(-.3deg)}80%{transform:translate(3px) rotate(.3deg)}90%{transform:translate(-1px)}}.floating-damage{position:fixed;font-size:28px;font-weight:900;color:var(--red);text-shadow:0 0 10px rgba(244,63,94,.8),2px 2px 0 rgba(0,0,0,.5);z-index:300;pointer-events:none;animation:floatUp 1s ease-out forwards;transform:translate(-50%,-50%)}.floating-damage.crit{font-size:36px;color:var(--yellow);text-shadow:0 0 15px rgba(245,158,11,.9),0 0 30px rgba(245,158,11,.5),2px 2px 0 rgba(0,0,0,.5);animation:floatUpCrit 1s ease-out forwards}.floating-damage.heal{color:var(--green);text-shadow:0 0 10px rgba(16,185,129,.8),2px 2px 0 rgba(0,0,0,.5)}@keyframes floatUp{0%{opacity:1;transform:translate(-50%,-50%) scale(.5)}20%{opacity:1;transform:translate(-50%,-70%) scale(1.2)}to{opacity:0;transform:translate(-50%,-150%) scale(.8)}}@keyframes floatUpCrit{0%{opacity:1;transform:translate(-50%,-50%) scale(.3) rotate(-10deg)}15%{opacity:1;transform:translate(-50%,-60%) scale(1.5) rotate(5deg)}30%{transform:translate(-50%,-70%) scale(1.2) rotate(-3deg)}to{opacity:0;transform:translate(-50%,-180%) scale(.7) rotate(0)}}.hit-flash{position:fixed;top:0;right:0;bottom:0;left:0;background:radial-gradient(circle at center,rgba(244,63,94,.3) 0%,transparent 70%);pointer-events:none;z-index:250;animation:hitFlash .3s ease-out forwards}@keyframes hitFlash{0%{opacity:1}to{opacity:0}}#team-select{padding:16px;padding-top:max(16px,env(safe-area-inset-top));padding-bottom:max(20px,env(safe-area-inset-bottom));overflow:hidden;-webkit-overflow-scrolling:touch;background:radial-gradient(ellipse at 30% 20%,rgba(59,130,246,.15) 0%,transparent 50%),radial-gradient(ellipse at 70% 80%,rgba(168,85,247,.1) 0%,transparent 50%),linear-gradient(180deg,var(--bg-secondary) 0%,var(--bg-primary) 100%);position:relative}#team-select.active{display:flex;flex-direction:column}.back-btn{position:absolute;top:max(16px,env(safe-area-inset-top));left:16px;padding:12px 20px;background:linear-gradient(135deg,#ef444433,#b91c1c4d);border:2px solid rgba(239,68,68,.5);border-radius:12px;color:#fca5a5;font-size:15px;font-weight:700;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);z-index:100;text-transform:uppercase;letter-spacing:1px;box-shadow:0 4px 15px #ef444433,inset 0 1px #ffffff1a;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.back-btn:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(180deg,rgba(255,255,255,.08) 0%,transparent 50%);border-radius:10px;pointer-events:none}.back-btn:hover{border-color:#f87171cc;color:#fef2f2;background:linear-gradient(135deg,#ef444459,#b91c1c73);box-shadow:0 6px 25px #ef444459,inset 0 1px #ffffff26;transform:translateY(-2px)}.back-btn:active{transform:scale(.97) translateY(0);box-shadow:0 2px 10px #ef44444d}.team-select-header{text-align:center;padding:8px 0;display:flex;align-items:center;justify-content:center;gap:12px;margin-top:48px}.team-select-badge{width:48px;height:48px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:22px;font-weight:900;flex-shrink:0;box-shadow:0 0 20px #22c55e66;color:#fff}.team-select-title{font-size:20px;font-weight:800;margin:0}.team-select-hint{color:var(--dim);font-size:14px}.team-select-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin:12px 0}.unit-card{background:var(--bg-glass);border:2px solid var(--border-subtle);border-radius:12px;padding:12px;text-align:center;cursor:pointer;transition:all .3s ease;position:relative}.unit-card:hover{border-color:var(--border-light);transform:translateY(-2px)}.unit-card.selected{border-color:var(--green);background:#10b98126;box-shadow:0 0 20px var(--green-glow)}.unit-card .unit-icon{font-size:32px;margin-bottom:6px}.unit-card .unit-name{font-weight:700;font-size:14px;margin-bottom:3px}.unit-card .unit-stats{font-size:10px;color:var(--dim);line-height:1.5}.unit-card .unit-special{margin-top:6px;padding:4px 8px;background:#a855f733;border-radius:6px;font-size:9px;color:var(--purple-light)}.unit-card .select-count{position:absolute;top:-6px;right:-6px;width:24px;height:24px;background:var(--green);border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:12px;color:#fff;box-shadow:0 3px 10px var(--green-glow)}.team-select-preview{background:var(--bg-glass);border:1px solid var(--border-subtle);border-radius:12px;padding:12px;margin:8px 0;flex-shrink:0}.team-select-preview h3{display:none}.team-slot{width:52px;height:52px;background:var(--bg-tertiary);border:2px dashed var(--border-subtle);border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:24px;color:var(--dim);transition:all .3s ease}.team-slot.filled{border-style:solid;border-color:var(--green);background:#10b9811a}.team-slot.empty{font-size:18px}.budget-display{margin-bottom:10px;padding:10px;background:var(--bg-tertiary);border-radius:10px}.budget-bar{height:8px;background:var(--bg-secondary);border-radius:4px;overflow:hidden;margin-bottom:8px}.budget-fill{height:100%;border-radius:4px;transition:width .3s ease,background .3s ease}.budget-fill.budget-ok{background:linear-gradient(90deg,var(--green),#22c55e)}.budget-fill.budget-warning{background:linear-gradient(90deg,#eab308,#f59e0b)}.budget-fill.budget-over{background:linear-gradient(90deg,#ef4444,#dc2626)}.budget-text{display:flex;align-items:center;justify-content:center;gap:4px;font-size:14px;color:var(--text)}.budget-spent{font-weight:700;color:var(--green)}.budget-separator{color:var(--dim)}.budget-total{font-weight:600}.budget-label{margin-left:8px;color:var(--dim)}.budget-remaining{color:var(--dim);font-size:12px}.unit-cost{position:absolute;top:8px;right:8px;padding:4px 8px;border-radius:8px;font-size:12px;font-weight:700}.unit-cost.cost-cheap{background:#22c55e33;color:var(--green)}.unit-cost.cost-normal{background:#eab30833;color:#fbbf24}.unit-cost.cost-expensive{background:#ef444433;color:#f87171}.unit-elite-badge{position:absolute;top:8px;left:8px;padding:3px 6px;background:linear-gradient(135deg,#f59e0b,#eab308);color:#1a1a2e;font-size:9px;font-weight:800;letter-spacing:.5px;border-radius:4px;text-transform:uppercase}.unit-card.unaffordable{opacity:.5;filter:grayscale(.5)}.unit-card.unaffordable:hover{transform:none;border-color:var(--border-subtle)}.team-slot{width:48px;height:48px;background:var(--bg-tertiary);border:2px dashed var(--border-subtle);border-radius:10px;display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:20px;color:var(--dim);transition:all .3s ease;position:relative}.team-slot .slot-icon{font-size:20px}.team-slot .slot-cost{font-size:9px;color:var(--dim);margin-top:1px}.team-slot.filled{border-style:solid;border-color:var(--green);background:#10b9811a;cursor:pointer}.team-slot.filled:hover{border-color:var(--red);background:#ef44441a}.team-slot.filled:hover:after{content:"×";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:28px;font-weight:700;color:var(--red);background:#000c;width:100%;height:100%;display:flex;align-items:center;justify-content:center;border-radius:8px}.team-slot.empty{font-size:16px;color:var(--dim)}.shop-screen{flex-direction:column;height:100%;background:linear-gradient(180deg,var(--bg-primary) 0%,var(--bg-secondary) 100%);padding:0;overflow:hidden}.shop-header{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;background:#0000004d;border-bottom:1px solid var(--border-subtle);flex-shrink:0}.shop-player-info{display:flex;align-items:center;gap:10px}.shop-player-badge{width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:16px;font-weight:800;color:#fff;background-color:var(--green);box-shadow:0 0 15px #22c55e66}.shop-player-name{font-size:18px;font-weight:700;color:var(--text-primary)}.shop-budget{display:flex;align-items:center;gap:4px;padding:8px 14px;background:linear-gradient(135deg,#f59e0b26,#f59e0b0d);border:1px solid rgba(245,158,11,.4);border-radius:20px;font-weight:600}.shop-budget .budget-current{font-size:18px;color:var(--yellow)}.shop-budget .budget-divider{color:var(--text-muted);font-size:14px}.shop-budget .budget-max{color:var(--text-secondary);font-size:14px}.shop-budget .budget-icon{margin-left:4px}.shop-step{flex:1;display:flex;flex-direction:column;overflow:hidden;min-height:0}.shop-step-header{display:flex;align-items:center;gap:12px;padding:12px 16px;background:#0000004d;border-bottom:1px solid var(--border-subtle)}.shop-step-title{font-size:16px;font-weight:700;color:var(--text-primary);margin:0;flex:1}.shop-back-step{background:#ffffff1a;border:none;color:var(--text-secondary);padding:8px 14px;border-radius:8px;font-size:13px;cursor:pointer;transition:all .2s ease}.shop-back-step:hover{background:#fff3;color:var(--text-primary)}.shop-categories{flex:1;display:grid;grid-template-columns:repeat(2,1fr);gap:12px;padding:12px;overflow-y:auto;align-content:start}.category-card{background:linear-gradient(145deg,#1a1a3ef2,#12122bfa);border:2px solid var(--border-subtle);border-radius:14px;padding:14px;cursor:pointer;transition:all .2s ease;position:relative;display:flex;flex-direction:column;align-items:center;gap:10px}.category-card:hover{border-color:var(--green);transform:translateY(-3px);box-shadow:0 8px 24px #0006}.category-card:active{transform:scale(.97)}.category-elite-badge{position:absolute;top:8px;right:8px;background:linear-gradient(135deg,#fbbf24,#f59e0b);color:#1a1a2e;font-size:9px;font-weight:800;padding:3px 6px;border-radius:4px;letter-spacing:.5px}.category-cart-badge{position:absolute;top:8px;left:8px;background:var(--green);color:#fff;width:24px;height:24px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;box-shadow:0 2px 8px var(--green-glow)}.category-sprite-container{position:relative;width:80px;height:80px}.category-sprite-glow{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:50%;background:radial-gradient(circle,var(--player-color) 0%,transparent 70%);filter:blur(10px);opacity:.4}.category-sprite-canvas{position:relative;width:100%;height:100%;z-index:1}.category-info{text-align:center}.category-icon{font-size:24px;margin-bottom:4px}.category-name{font-size:15px;font-weight:700;color:var(--text-primary)}.category-special{font-size:11px;color:var(--purple-light);margin-top:4px}.category-variants{font-size:10px;color:var(--dim);margin-top:6px;padding:4px 10px;background:#ffffff0d;border-radius:10px}.shop-variants{flex:1;display:flex;flex-direction:column;gap:12px;padding:12px;overflow-y:auto}.variant-card-full{background:linear-gradient(145deg,#1a1a3ef2,#12122bfa);border:2px solid var(--border-subtle);border-radius:14px;padding:16px;display:flex;align-items:center;gap:16px;position:relative;transition:all .2s ease}.variant-card-full:hover{border-color:var(--border-light)}.variant-badge-large{position:absolute;top:10px;left:10px;font-size:18px;font-weight:700;color:var(--badge-color, #fff);text-shadow:0 0 8px var(--badge-color, #fff),0 2px 4px rgba(0,0,0,.5)}.variant-sprite-container{position:relative;width:70px;height:70px;flex-shrink:0}.variant-sprite-glow{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:50%;background:radial-gradient(circle,var(--player-color) 0%,transparent 70%);filter:blur(8px);opacity:.3}.variant-sprite-canvas{position:relative;width:100%;height:100%;z-index:1}.variant-info{flex:1;min-width:0}.variant-name{font-size:16px;font-weight:700;color:var(--text-primary)}.variant-cost{font-size:14px;color:var(--yellow);margin-top:2px}.variant-cost.cost-cheap{color:var(--green)}.variant-cost.cost-expensive{color:var(--red)}.variant-bonus-desc{font-size:11px;color:var(--green);margin-top:6px;padding:4px 8px;background:#22c55e26;border-radius:6px;display:inline-block}.variant-stats{display:flex;gap:8px;font-size:12px;color:var(--text-secondary)}.variant-cart-controls{display:flex;align-items:center;gap:8px;margin-left:auto}.variant-cart-btn{width:36px;height:36px;border-radius:50%;border:none;font-size:20px;font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .15s ease}.variant-cart-btn.add{background:var(--green);color:#fff;box-shadow:0 2px 8px var(--green-glow)}.variant-cart-btn.add:hover:not(:disabled){transform:scale(1.1)}.variant-cart-btn.remove{background:#ef4444cc;color:#fff}.variant-cart-btn.remove:hover:not(:disabled){background:#ef4444;transform:scale(1.1)}.variant-cart-btn:disabled,.variant-cart-btn.disabled{opacity:.3;cursor:not-allowed;transform:none}.variant-cart-count{min-width:24px;text-align:center;font-size:16px;font-weight:700;color:var(--text-primary)}.cart-body.collapsed{display:none}.cart-toggle-icon{font-size:12px;color:var(--dim);transition:transform .2s ease}.cart-header{cursor:pointer}.cart-header:hover{background:#0006}@media(max-width:399px){.variant-card-full{flex-direction:column;align-items:stretch;padding:12px;gap:10px}.variant-sprite-container{width:56px;height:56px;align-self:center}.variant-info{text-align:center}.variant-name{font-size:15px}.variant-cost{font-size:13px}.variant-bonus-desc{font-size:10px;margin-top:4px;padding:3px 6px}.variant-stats{justify-content:center;flex-wrap:wrap;gap:6px 12px;font-size:11px}.variant-cart-controls{justify-content:center;margin-left:0;padding-top:8px;border-top:1px solid var(--border-subtle)}.variant-cart-btn{width:40px;height:40px;font-size:22px}.variant-cart-count{min-width:32px;font-size:18px}.variant-badge-large{top:8px;left:8px;font-size:16px}}@media(min-width:400px)and (max-width:479px){.variant-card-full{padding:10px 12px;gap:10px}.variant-sprite-container{width:56px;height:56px}.variant-info{flex:1;min-width:0}.variant-name{font-size:14px}.variant-cost{font-size:12px}.variant-bonus-desc{font-size:9px;padding:2px 5px;margin-top:3px;max-width:100%;white-space:normal;line-height:1.3}.variant-stats{display:grid;grid-template-columns:repeat(2,auto);gap:2px 8px;font-size:10px}.variant-cart-controls{flex-direction:column;gap:4px;margin-left:8px}.variant-cart-btn{width:32px;height:32px;font-size:18px}.variant-cart-count{min-width:20px;font-size:14px}}@media(min-width:480px)and (max-width:767px){.shop-variants{padding:16px;gap:14px}.variant-card-full{padding:14px 16px;gap:14px}.variant-sprite-container{width:64px;height:64px}.variant-name{font-size:15px}.variant-cost{font-size:13px}.variant-bonus-desc{font-size:10px;max-width:150px;white-space:normal;line-height:1.3}.variant-stats{gap:10px;font-size:11px}.variant-cart-btn{width:34px;height:34px;font-size:18px}}@media(min-width:768px){.shop-variants{padding:20px;gap:16px;max-width:800px;margin:0 auto}.variant-card-full{padding:18px 20px;gap:20px}.variant-sprite-container{width:80px;height:80px}.variant-name{font-size:18px}.variant-cost{font-size:15px}.variant-bonus-desc{font-size:12px;padding:5px 10px}.variant-stats{gap:12px;font-size:13px}.variant-cart-btn{width:40px;height:40px;font-size:22px}.variant-cart-count{min-width:30px;font-size:18px}}@media(min-width:1024px){.shop-variants{max-width:900px;padding:24px;gap:18px}.variant-card-full{padding:20px 24px}.variant-sprite-container{width:90px;height:90px}.variant-name{font-size:20px}.variant-cost{font-size:16px}.variant-stats{gap:16px;font-size:14px}}.shop-grid-container,.shop-grid{display:none}.unit-class-group{background:#0003;border-radius:12px;padding:10px;border:1px solid var(--border-subtle)}.unit-class-header{display:flex;align-items:center;gap:8px;padding:6px 8px;margin-bottom:10px;border-bottom:1px solid var(--border-subtle)}.unit-class-header .class-icon{font-size:22px}.unit-class-header .class-name{font-size:14px;font-weight:700;color:var(--text-primary);flex:1}.unit-class-header .elite-tag{background:linear-gradient(135deg,#fbbf24,#f59e0b);color:#1a1a2e;font-size:9px;font-weight:800;padding:3px 8px;border-radius:4px;letter-spacing:1px;text-transform:uppercase}.unit-variants-row{display:flex;gap:10px;overflow-x:auto;padding-bottom:6px;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch}.unit-variants-row::-webkit-scrollbar{height:4px}.unit-variants-row::-webkit-scrollbar-track{background:#ffffff0d;border-radius:2px}.unit-variants-row::-webkit-scrollbar-thumb{background:var(--border-light);border-radius:2px}.unit-variants-row .unit-card{flex:0 0 140px;scroll-snap-align:start;min-height:180px}.shop-screen .unit-card{background:linear-gradient(145deg,#1a1a3ef2,#12122bfa);border:2px solid var(--border-subtle);border-radius:12px;padding:8px;cursor:pointer;transition:all .2s ease;position:relative;display:flex;flex-direction:column;gap:6px;min-height:160px;overflow:hidden}.shop-screen .unit-card:active{transform:scale(.97)}.shop-screen .unit-card.selected{border-color:var(--green);background:linear-gradient(145deg,#10b98133,#10b9811a);box-shadow:0 0 20px var(--green-glow),inset 0 0 30px #10b9811a}.shop-screen .unit-card.unaffordable{opacity:.45;filter:grayscale(.6)}.shop-screen .unit-card .unit-sprite-container{position:relative;height:56px;display:flex;align-items:center;justify-content:center;margin-bottom:2px}.shop-screen .unit-card .unit-sprite-canvas{width:52px;height:52px;border-radius:8px;background:radial-gradient(ellipse at center bottom,rgba(100,200,255,.15) 0%,transparent 70%)}.shop-screen .unit-card .unit-sprite-glow{position:absolute;width:48px;height:48px;border-radius:50%;background:radial-gradient(circle,var(--player-color, rgba(34, 197, 94, .3)) 0%,transparent 70%);filter:blur(8px);z-index:0}.shop-screen .unit-card .unit-sprite-canvas{position:relative;z-index:1}.shop-screen .unit-card .card-header{display:flex;align-items:center;justify-content:space-between;gap:6px;padding:0 2px}.shop-screen .unit-card .unit-icon{display:none}.shop-screen .unit-card .unit-name{font-size:13px;font-weight:700;flex:1;margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}.shop-screen .unit-card .unit-cost{flex-shrink:0;padding:2px 6px;font-size:11px;font-weight:600;border-radius:8px;white-space:nowrap}.shop-screen .unit-card .unit-stats{display:grid;grid-template-columns:1fr 1fr;gap:2px 4px;font-size:10px;color:var(--text-secondary);line-height:1.4;padding:0 2px}.shop-screen .unit-card .unit-stats .stat-item{display:flex;align-items:center;gap:2px}.shop-screen .unit-card .unit-special{margin-top:auto;padding:4px 6px;background:linear-gradient(135deg,#a855f740,#8b5cf626);border-radius:6px;font-size:9px;color:var(--purple-light);text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.shop-screen .unit-card .select-count{position:absolute;top:-8px;right:-8px;width:26px;height:26px;background:var(--green);border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:14px;color:#fff;box-shadow:0 3px 12px var(--green-glow);border:2px solid var(--bg-primary)}.shop-screen .unit-card .unit-elite-badge{position:absolute;top:-1px;left:50%;transform:translate(-50%);padding:2px 10px;background:linear-gradient(135deg,#f59e0b,#d97706);color:#1a1a2e;font-size:8px;font-weight:800;letter-spacing:1px;border-radius:0 0 6px 6px;text-transform:uppercase}.cart-controls{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:8px;padding-top:8px;border-top:1px solid var(--border-subtle)}.cart-btn{width:32px;height:32px;border-radius:50%;border:none;font-size:18px;font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .15s ease}.cart-btn.cart-add{background:var(--green);color:#fff;box-shadow:0 2px 8px var(--green-glow)}.cart-btn.cart-add:hover:not(:disabled){background:var(--green-light);transform:scale(1.1)}.cart-btn.cart-remove{background:#ef4444cc;color:#fff}.cart-btn.cart-remove:hover:not(:disabled){background:#ef4444;transform:scale(1.1)}.cart-btn:disabled,.cart-btn.disabled{opacity:.3;cursor:not-allowed;transform:none}.cart-count{min-width:28px;text-align:center;font-weight:700;font-size:16px;color:var(--text-secondary);transition:all .2s ease}.cart-count.has-items{color:var(--green);font-size:18px}.detail-cart-controls{display:flex;align-items:center;justify-content:center;gap:16px;margin-top:16px;padding:16px;background:#0000004d;border-radius:12px}.detail-cart-controls .cart-btn{width:48px;height:48px;font-size:24px}.detail-cart-controls .cart-count{min-width:48px;font-size:24px}.variant-badge{position:absolute;top:8px;left:8px;width:24px;height:24px;display:flex;align-items:center;justify-content:center;font-size:16px;font-weight:700;color:var(--badge-color, #fff);text-shadow:0 0 6px var(--badge-color, #fff),0 2px 4px rgba(0,0,0,.5);z-index:5}.variant-card{border:2px solid transparent;background:linear-gradient(135deg,#ffffff0d,#ffffff05)}.variant-card:hover{border-color:#ffffff4d}.variant-bonus{font-size:10px;color:var(--green);background:#22c55e26;padding:3px 6px;border-radius:4px;margin:4px 0;text-align:center;font-weight:600}.slot-variant-badge{position:absolute;top:-4px;left:-4px;font-size:14px;font-weight:700;text-shadow:0 0 4px currentColor,0 1px 2px rgba(0,0,0,.8);z-index:10}.detail-variant-badge{font-size:1.2em;margin-right:4px;text-shadow:0 0 8px currentColor}.shop-cart-panel{background:linear-gradient(180deg,#0f0f23fa,#0a0a19fc);border-top:1px solid var(--border-light);display:flex;flex-direction:column;max-height:40vh;flex-shrink:0}.cart-header{display:flex;justify-content:space-between;align-items:center;padding:10px 14px;background:#0000004d;border-bottom:1px solid var(--border-subtle)}.cart-title{font-size:14px;font-weight:700;color:var(--text-primary)}.cart-count-badge{background:var(--green);color:#fff;font-size:11px;font-weight:700;padding:3px 8px;border-radius:10px}.cart-items{flex:1;overflow-y:auto;padding:8px;display:flex;flex-direction:column;gap:6px;min-height:60px;max-height:150px}.cart-empty{color:var(--dim);text-align:center;padding:16px;font-size:13px;font-style:italic}.cart-item{display:flex;align-items:center;gap:10px;padding:8px 10px;background:#ffffff0d;border-radius:8px;border:1px solid var(--border-subtle)}.cart-item-icon{font-size:20px;width:28px;text-align:center}.cart-item-info{flex:1;min-width:0}.cart-item-name{font-size:13px;font-weight:600;color:var(--text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.cart-item-cost{font-size:11px;color:var(--dim)}.cart-item-qty{display:flex;align-items:center;gap:6px}.cart-qty-btn{width:26px;height:26px;border-radius:50%;border:none;font-size:16px;font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center;background:#ffffff1a;color:var(--text-primary);transition:all .15s ease}.cart-qty-btn:hover:not(:disabled){background:var(--green);transform:scale(1.1)}.cart-qty-btn:disabled,.cart-qty-btn.disabled{opacity:.3;cursor:not-allowed}.cart-qty-count{min-width:20px;text-align:center;font-weight:700;font-size:14px;color:var(--text-primary)}.cart-footer{padding:10px 14px;padding-bottom:max(10px,env(safe-area-inset-bottom));background:#0006;border-top:1px solid var(--border-subtle);display:flex;justify-content:space-between;align-items:center;gap:12px}.cart-total{display:flex;flex-direction:column;gap:2px}.cart-total-label{font-size:11px;color:var(--dim);text-transform:uppercase;letter-spacing:.5px}.cart-total-value{font-size:18px;font-weight:700;color:var(--green)}.cart-actions{display:flex;gap:8px}.cart-action-btn{padding:10px 18px;border-radius:8px;border:none;font-size:14px;font-weight:700;cursor:pointer;transition:all .2s ease}.cart-action-btn.secondary{background:#ffffff1a;color:var(--text-secondary)}.cart-action-btn.secondary:hover{background:#fff3}.cart-action-btn.primary{background:linear-gradient(135deg,var(--green) 0%,var(--green-dark) 100%);color:#fff;box-shadow:0 2px 10px var(--green-glow)}.cart-action-btn.primary:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 4px 15px var(--green-glow)}.cart-action-btn.primary:disabled{opacity:.5;cursor:not-allowed;transform:none}.shop-bottom-bar{display:flex;align-items:center;gap:8px;padding:10px 12px;padding-bottom:max(10px,env(safe-area-inset-bottom));background:#00000080;border-top:1px solid var(--border-subtle);flex-shrink:0;min-height:60px}.shop-selected-team{display:flex;gap:6px;flex:1;overflow-x:auto;overflow-y:hidden;padding:2px 0;min-width:0;-webkit-overflow-scrolling:touch}.shop-selected-team::-webkit-scrollbar{display:none}.shop-selected-team .team-slot{width:40px;height:40px;flex-shrink:0;font-size:16px;border-radius:8px;display:flex;align-items:center;justify-content:center;background:var(--bg-tertiary);border:2px solid var(--border-subtle);position:relative}.shop-selected-team .team-slot.filled{border-color:var(--green);background:linear-gradient(145deg,#10b98133,#10b9811a)}.shop-selected-team .team-slot.empty{color:var(--text-muted);font-size:20px;font-weight:300;opacity:.5}.shop-selected-team .team-slot canvas{width:100%;height:100%;border-radius:6px}.shop-actions{display:flex;gap:6px;flex-shrink:0}.shop-btn{padding:10px 16px;border:none;border-radius:10px;font-weight:700;font-size:15px;cursor:pointer;transition:all .2s ease}.shop-btn.primary{background:linear-gradient(135deg,var(--green),var(--green-light));color:#fff;box-shadow:0 4px 15px var(--green-glow);min-width:70px}.shop-btn.primary:disabled{opacity:.4;cursor:not-allowed;box-shadow:none}.shop-btn.primary:not(:disabled):active{transform:scale(.95)}.shop-btn.secondary{background:var(--bg-tertiary);color:var(--text-secondary);border:1px solid var(--border-subtle);padding:10px 14px}.shop-btn.secondary:active{transform:scale(.95)}@media(min-width:400px){.shop-grid{gap:10px}.shop-screen .unit-card{min-height:150px}.shop-screen .unit-card .unit-sprite-container{height:50px}.shop-screen .unit-card .unit-sprite-canvas{width:48px;height:48px}}.team-select-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin:12px 0;flex:1;min-height:0;overflow-y:auto;padding:4px}@media(min-width:480px){.team-select-grid{grid-template-columns:repeat(3,1fr)}}.team-preview-units{display:flex;gap:8px;justify-content:center;flex-wrap:wrap}.team-confirm-btn{margin-top:10px;padding:14px;font-size:16px}.team-confirm-btn:disabled{opacity:.4;cursor:not-allowed;transform:none;box-shadow:none}.shop-detail-overlay{position:absolute;top:0;left:0;right:0;bottom:0;background:#000000d9;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;z-index:100;opacity:0;visibility:hidden;transition:all .3s ease}.shop-detail-overlay.visible{opacity:1;visibility:visible}.shop-detail-panel{background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:16px;padding:20px;width:min(90vw,340px);max-height:85vh;overflow-y:auto;position:relative;box-shadow:0 10px 40px #00000080}.shop-detail-close{position:absolute;top:12px;right:12px;width:32px;height:32px;background:var(--bg-tertiary);border:1px solid var(--border-subtle);border-radius:8px;color:var(--text-secondary);font-size:20px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s ease}.shop-detail-close:hover{background:var(--red);color:#fff;border-color:var(--red)}.shop-detail-header{display:flex;gap:16px;align-items:center;margin-bottom:16px;padding-bottom:16px;border-bottom:1px solid var(--border-subtle)}.shop-detail-icon{font-size:48px;width:64px;height:64px;background:var(--bg-tertiary);border-radius:12px;display:flex;align-items:center;justify-content:center}.shop-detail-title h3{font-size:20px;margin:0 0 4px;color:var(--text-primary)}.shop-detail-cost{font-size:16px;color:var(--yellow);font-weight:600}.shop-detail-stats{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-bottom:16px}.shop-detail-stat{background:var(--bg-tertiary);border-radius:8px;padding:10px;display:flex;flex-direction:column;align-items:center}.shop-detail-stat .stat-icon{font-size:18px;margin-bottom:4px}.shop-detail-stat .stat-label{font-size:10px;color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px}.shop-detail-stat .stat-value{font-size:18px;font-weight:700;color:var(--text-primary)}.shop-detail-special,.shop-detail-description{margin-bottom:16px}.shop-detail-special h4,.shop-detail-description h4{font-size:12px;color:var(--cyan);text-transform:uppercase;letter-spacing:.5px;margin:0 0 8px}.shop-detail-special p,.shop-detail-description p{font-size:14px;color:var(--text-secondary);line-height:1.5;margin:0}.shop-detail-select{width:100%;padding:14px;font-size:16px;margin-top:8px}.shop-screen .unit-card .card-info-btn{position:absolute;top:8px;left:8px;width:20px;height:20px;background:#00000080;border:1px solid var(--border-subtle);border-radius:50%;color:var(--text-muted);font-size:11px;font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center;opacity:.8;transition:all .2s ease;z-index:5}.shop-screen .unit-card .card-info-btn:hover,.shop-screen .unit-card .card-info-btn:active{opacity:1;background:var(--cyan);color:#fff;border-color:var(--cyan);transform:scale(1.1)}.mode-btn{display:flex;flex-direction:column;align-items:center;gap:6px;padding:16px 12px}.mode-btn .mode-icon{font-size:24px}@keyframes slideDown{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}#players-section.hidden{display:none}.version-info{margin-top:24px;text-align:center;font-size:11px;color:var(--text-muted);padding:12px;background:var(--bg-glass);border:1px solid var(--border-subtle);border-radius:10px;font-family:SF Mono,Fira Code,Consolas,monospace;letter-spacing:.5px}.ai-thinking{position:fixed;bottom:calc(env(safe-area-inset-bottom,0px) + 20px);left:50%;transform:translate(-50%);background:#000000e6;border:2px solid var(--purple);padding:12px 24px;border-radius:12px;z-index:100;text-align:center;box-shadow:0 0 20px #a855f74d;display:flex;align-items:center;gap:12px}.ai-thinking .ai-icon{font-size:24px;animation:aiPulse 1s ease-in-out infinite}@keyframes aiPulse{0%,to{transform:scale(1);opacity:.8}50%{transform:scale(1.1);opacity:1}}.ai-thinking .ai-text{font-size:14px;font-weight:600;color:var(--purple-light)}.ai-thinking .ai-subtext{font-size:11px;color:var(--cyan);opacity:.8}.ai-thinking.spectator-mode{bottom:calc(env(safe-area-inset-bottom,0px) + 200px);left:20px;transform:none;padding:10px 16px;border-radius:10px;border-color:var(--cyan);background:#000000d9;box-shadow:0 0 15px #06b6d433;flex-direction:column;gap:4px}.ai-thinking.spectator-mode .ai-icon{font-size:20px}.ai-thinking.spectator-mode .ai-text{font-size:12px;color:var(--cyan)}.ai-thinking.spectator-mode .ai-subtext{font-size:10px}.ai-thought-bubble{position:fixed;bottom:calc(env(safe-area-inset-bottom,0px) + 120px);left:50%;transform:translate(-50%) translateY(20px);background:#000000d9;border:1px solid rgba(6,182,212,.4);border-radius:12px;padding:14px 24px;display:flex;align-items:center;justify-content:center;gap:12px;z-index:95;box-shadow:0 4px 24px #00000080,0 0 20px #06b6d426;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);opacity:0;transition:all .4s cubic-bezier(.4,0,.2,1);max-width:min(85vw,500px);text-align:center}.ai-thought-bubble.visible{opacity:1;transform:translate(-50%) translateY(0)}.ai-thought-bubble .thought-text{font-size:15px;font-weight:500;color:#f0f9ff;text-shadow:0 1px 4px rgba(0,0,0,.7);line-height:1.5;letter-spacing:.2px}.compass-indicator{position:fixed;top:80px;right:20px;background:linear-gradient(135deg,#f59e0b26,#f59e0b0d);border:2px solid var(--yellow);border-radius:16px;padding:16px 20px;display:flex;align-items:center;gap:12px;z-index:100;box-shadow:0 0 30px #f59e0b4d;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);opacity:0;transform:translate(20px);transition:all .3s ease}.compass-indicator.show{opacity:1;transform:translate(0)}.compass-arrow{font-size:36px;animation:compassPulse 2s ease-in-out infinite}@keyframes compassPulse{0%,to{transform:scale(1)}50%{transform:scale(1.15)}}.compass-text{display:flex;flex-direction:column;gap:4px}.compass-direction{font-size:14px;font-weight:700;color:var(--yellow-light)}.compass-info{font-size:12px;color:var(--text-secondary)}.compass-hint{font-size:11px;color:var(--text-muted);font-style:italic}@media(max-width:600px){.compass-indicator{top:auto;bottom:180px;right:10px;left:10px;justify-content:center}}.update-notification{position:fixed;top:20px;left:50%;transform:translate(-50%);background:linear-gradient(135deg,var(--bg-tertiary) 0%,var(--bg-secondary) 100%);border:1px solid var(--green);border-radius:12px;padding:12px 20px;display:flex;align-items:center;gap:16px;box-shadow:0 4px 20px #10b9814d,0 0 40px #10b9811a;z-index:10000;animation:slideDown .3s ease-out}@keyframes slideDown{0%{opacity:0;transform:translate(-50%) translateY(-20px)}to{opacity:1;transform:translate(-50%) translateY(0)}}.update-notification span{color:var(--text-primary);font-size:14px;font-weight:500}.update-notification button{background:var(--green);color:var(--bg-primary);border:none;border-radius:8px;padding:8px 16px;font-size:13px;font-weight:600;cursor:pointer;transition:all .2s ease}.update-notification button:hover{background:var(--green-light);transform:scale(1.02)}.update-notification button:active{transform:scale(.98)}.update-notification.fade-out{animation:fadeOut .3s ease-out forwards}@keyframes fadeOut{to{opacity:0;transform:translate(-50%) translateY(-20px)}}@media(max-width:600px){.update-notification{top:10px;left:10px;right:10px;transform:none;flex-direction:column;gap:10px;text-align:center}@keyframes slideDown{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}.update-notification.fade-out{animation:fadeOutMobile .3s ease-out forwards}@keyframes fadeOutMobile{to{opacity:0;transform:translateY(-20px)}}.update-notification button{width:100%}}.tutorial-overlay{position:fixed;left:0;right:0;display:none;justify-content:center;align-items:flex-end;padding:20px;z-index:2000;pointer-events:none;animation:tutorialFadeIn .3s ease-out}.tutorial-overlay.tutorial-center{top:0;bottom:0;align-items:center}.tutorial-overlay.tutorial-top{top:0;bottom:auto;align-items:flex-start;padding-top:80px}.tutorial-overlay.tutorial-bottom{top:auto;bottom:0;align-items:flex-end;padding-bottom:100px}@keyframes tutorialFadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.tutorial-hint{background:linear-gradient(135deg,#10b98126,#1a1a3ef2);border:1px solid rgba(16,185,129,.4);border-radius:16px;padding:16px 20px;max-width:400px;width:100%;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);box-shadow:0 8px 32px #0006,0 0 20px #10b98133,inset 0 1px #ffffff1a;pointer-events:all}.tutorial-hint-header{display:flex;align-items:center;gap:10px;margin-bottom:10px}.tutorial-hint-icon{font-size:24px;animation:tutorialPulse 2s ease-in-out infinite}@keyframes tutorialPulse{0%,to{transform:scale(1)}50%{transform:scale(1.1)}}.tutorial-hint-title{flex:1;font-size:16px;font-weight:600;color:var(--green-light)}.tutorial-close-btn{background:#ffffff1a;border:none;border-radius:50%;width:28px;height:28px;font-size:14px;color:var(--text-secondary);cursor:pointer;transition:all .2s ease}.tutorial-close-btn:hover{background:#fff3;color:var(--text-primary)}.tutorial-hint-message{font-size:14px;line-height:1.5;color:var(--text-primary);margin-bottom:14px}.tutorial-hint-actions{display:flex;gap:10px}.tutorial-btn{flex:1;padding:10px 16px;border:none;border-radius:8px;font-size:13px;font-weight:500;cursor:pointer;transition:all .2s ease}.tutorial-btn-ok{background:linear-gradient(135deg,var(--green),var(--green-light));color:#fff;box-shadow:0 2px 8px #10b9814d}.tutorial-btn-ok:hover{transform:translateY(-1px);box-shadow:0 4px 12px #10b98166}.tutorial-btn-dismiss{background:#ffffff1a;color:var(--text-secondary);border:1px solid var(--border-subtle)}.tutorial-btn-dismiss:hover{background:#ffffff26;color:var(--text-primary)}.tutorial-btn-more{background:linear-gradient(135deg,var(--blue),#3b82f6);color:#fff;box-shadow:0 2px 8px #3b82f64d}.tutorial-btn-more:hover{transform:translateY(-1px);box-shadow:0 4px 12px #3b82f666}.team-select-hint{background:linear-gradient(135deg,#3b82f626,#1a1a3ef2);border:1px solid rgba(59,130,246,.4)}.team-select-hint .tutorial-hint-message{line-height:1.6}.team-select-hint .tutorial-hint-message b{color:var(--yellow)}@media(max-width:480px){.tutorial-overlay{padding:12px}.tutorial-overlay.tutorial-bottom{padding-bottom:80px}.tutorial-overlay.tutorial-top{padding-top:60px}.tutorial-hint{padding:14px 16px;border-radius:12px}.tutorial-hint-title{font-size:15px}.tutorial-hint-message{font-size:13px}.tutorial-btn{padding:8px 12px;font-size:12px}}.menu-main-buttons{display:flex;flex-direction:column;gap:16px;max-width:320px;margin:0 auto;padding:40px 20px}.menu-big-btn{display:flex;align-items:center;justify-content:center;gap:16px;padding:24px 32px;border-radius:20px;border:2px solid var(--border-subtle);background:var(--bg-glass);color:var(--text-primary);font-size:20px;font-weight:700;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.menu-big-btn:hover{transform:translateY(-4px);border-color:var(--green);box-shadow:0 8px 30px var(--green-glow)}.menu-big-btn:active{transform:translateY(-2px) scale(.98)}.menu-big-btn .btn-icon{font-size:32px;filter:drop-shadow(0 2px 4px rgba(0,0,0,.3))}.menu-big-btn.start-game-btn{background:linear-gradient(135deg,#10b98133,#10b9810d);border-color:var(--green);box-shadow:0 4px 20px var(--green-glow)}.menu-big-btn.start-game-btn:hover{background:linear-gradient(135deg,#10b9814d,#10b9811a);box-shadow:0 12px 40px var(--green-glow)}.menu-big-btn.options-btn{background:var(--bg-glass)}.menu-big-btn.options-btn:hover{background:var(--bg-glass-hover)}#options-screen{padding:24px;padding-top:max(80px,calc(env(safe-area-inset-top) + 60px));overflow-y:auto;-webkit-overflow-scrolling:touch;background:radial-gradient(ellipse at 50% 0%,rgba(16,185,129,.15) 0%,transparent 50%),linear-gradient(180deg,var(--bg-secondary) 0%,var(--bg-primary) 100%)}.options-header{text-align:center;margin-bottom:32px}.options-title{font-size:28px;font-weight:800;color:var(--text-primary)}.options-content{max-width:480px;margin:0 auto}.option-section{background:var(--bg-glass);border:1px solid var(--border-subtle);border-radius:16px;padding:20px;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.option-row{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 0;border-bottom:1px solid var(--border-subtle)}.option-row:last-child{border-bottom:none}.option-label{font-size:14px;font-weight:600;color:var(--text-secondary)}.wizard-screen{display:none;flex-direction:column;padding:16px;padding-top:max(16px,env(safe-area-inset-top));padding-bottom:max(16px,env(safe-area-inset-bottom));overflow-y:auto;-webkit-overflow-scrolling:touch;background:radial-gradient(ellipse at 50% 0%,rgba(16,185,129,.12) 0%,transparent 50%),radial-gradient(ellipse at 80% 80%,rgba(59,130,246,.08) 0%,transparent 40%),linear-gradient(180deg,var(--bg-secondary) 0%,var(--bg-primary) 100%)}.wizard-screen.active{display:flex}.wizard-header{text-align:center;padding:16px 0;flex-shrink:0}.wizard-progress{display:flex;align-items:center;justify-content:center;gap:0;margin-bottom:20px}.wizard-step{width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:700;background:var(--bg-tertiary);border:2px solid var(--border-light);color:var(--text-muted);transition:all .3s ease}.wizard-step.active{background:linear-gradient(135deg,var(--green) 0%,var(--green-light) 100%);border-color:var(--green);color:#fff;box-shadow:0 0 20px var(--green-glow)}.wizard-step.completed{background:var(--green);border-color:var(--green);color:#fff}.wizard-step-line{width:40px;height:3px;background:var(--border-light);transition:all .3s ease}.wizard-step-line.completed{background:var(--green)}.wizard-title{font-size:24px;font-weight:800;color:var(--text-primary);margin:0}.wizard-content{flex:1;display:flex;flex-direction:column;gap:16px;max-width:600px;margin:0 auto;width:100%}.wizard-options{display:flex;gap:20px;flex-wrap:wrap}.wizard-option-group{flex:1;min-width:140px}.wizard-footer{display:flex;gap:12px;padding:16px 0;max-width:600px;margin:0 auto;width:100%;flex-shrink:0}.wizard-btn{flex:1;padding:16px 24px;border-radius:14px;font-size:16px;font-weight:700;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);border:2px solid transparent}.wizard-btn.primary{background:linear-gradient(135deg,var(--green) 0%,#059669 100%);border-color:var(--green);color:#fff;box-shadow:0 4px 15px var(--green-glow)}.wizard-btn.primary:hover{transform:translateY(-2px);box-shadow:0 8px 25px var(--green-glow)}.wizard-btn.primary:disabled{opacity:.5;cursor:not-allowed;transform:none;box-shadow:none}.wizard-btn.secondary{background:var(--bg-glass);border-color:var(--border-light);color:var(--text-secondary)}.wizard-btn.secondary:hover{background:var(--bg-glass-hover);border-color:var(--text-secondary);color:var(--text-primary)}.map-preview-container{position:relative;width:100%;max-width:360px;aspect-ratio:1;margin:0 auto;border-radius:16px;overflow:hidden;border:2px solid var(--border-light);background:var(--bg-tertiary);box-shadow:0 8px 30px #0000004d}.map-preview-canvas{width:100%;height:100%;display:block}.map-preview-overlay{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;background:#0009;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);transition:opacity .3s ease}.map-preview-overlay.hidden{opacity:0;pointer-events:none}.preview-loading{font-size:14px;color:var(--text-secondary);animation:pulse 1.5s ease-in-out infinite}@keyframes pulse{0%,to{opacity:.6}50%{opacity:1}}#team-select.wizard-screen{padding-top:max(16px,env(safe-area-inset-top))}#team-select .wizard-header{padding-bottom:8px}#team-select .team-select-header{margin-top:8px}#team-select .wizard-footer{margin-top:auto}.player-config-grid{display:flex;flex-direction:column;gap:10px}.player-config-item{display:flex;align-items:center;gap:10px;padding:8px 12px;background:var(--bg-glass);border:1px solid var(--border-subtle);border-radius:10px;transition:all .2s ease}.player-config-item:hover{border-color:var(--border-light)}.player-config-item .player-badge{width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:700;color:#fff;flex-shrink:0;box-shadow:var(--shadow-sm)}.player-name-container{flex:1;display:flex;align-items:center;gap:6px}.player-name-input{flex:1;padding:8px 12px;border-radius:8px;border:1px solid var(--border-subtle);background:var(--bg-secondary);color:var(--text-primary);font-size:14px;font-weight:500;min-width:80px;transition:all .2s ease}.player-name-input:focus{outline:none;border-color:var(--green);box-shadow:0 0 10px var(--green-glow)}.player-name-input::placeholder{color:var(--text-muted)}.name-refresh-btn{width:36px;height:36px;border-radius:8px;border:1px solid var(--border-subtle);background:var(--bg-glass);color:var(--text-primary);font-size:16px;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;justify-content:center;flex-shrink:0}.name-refresh-btn:hover{background:var(--bg-glass-hover);border-color:var(--green);transform:scale(1.05)}.name-refresh-btn:active{transform:scale(.95)}.player-config-item .type-toggle{padding:8px 12px;border-radius:8px;border:1px solid var(--border-subtle);background:var(--bg-glass);color:var(--text-primary);font-size:14px;font-weight:600;cursor:pointer;transition:all .2s ease;min-width:50px;flex-shrink:0}.player-config-item .type-toggle:hover{border-color:var(--text-secondary)}.player-config-item .type-toggle.ai{background:linear-gradient(135deg,#f9731633,#ea580c1a);border-color:var(--yellow);color:var(--yellow)}.player-config-item .type-toggle.human{background:linear-gradient(135deg,#22c55e33,#16a34a1a);border-color:var(--green);color:var(--green)}@media(max-width:400px){.player-config-item{gap:6px;padding:6px 8px}.player-config-item .player-badge{width:28px;height:28px;font-size:12px}.player-name-input{padding:6px 8px;font-size:13px}.name-refresh-btn{width:32px;height:32px;font-size:14px}.player-config-item .type-toggle{padding:6px 8px;font-size:12px;min-width:44px}}@media(max-width:480px){.wizard-step{width:32px;height:32px;font-size:12px}.wizard-step-line{width:30px}.wizard-title{font-size:20px}.wizard-btn{padding:14px 20px;font-size:14px}.map-preview-container{max-width:280px}.menu-big-btn{padding:20px 24px;font-size:18px}.menu-big-btn .btn-icon{font-size:28px}}@media(max-height:700px){#team-select.wizard-screen{padding:8px;padding-top:max(8px,env(safe-area-inset-top));padding-bottom:max(8px,env(safe-area-inset-bottom))}#team-select .wizard-header{padding:4px 0}#team-select .wizard-progress{margin-bottom:8px}#team-select .wizard-step{width:24px;height:24px;font-size:10px}#team-select .wizard-step-line{width:20px}#team-select .team-select-header{margin-top:0;padding:4px 0;gap:8px}#team-select .team-select-badge{width:32px;height:32px;font-size:14px}#team-select .team-select-title{font-size:16px}#team-select .team-select-grid{flex:1;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;margin:6px 0;padding-right:4px;max-height:none;scrollbar-width:thin;scrollbar-color:var(--green) var(--bg-tertiary)}#team-select .team-select-grid::-webkit-scrollbar{width:4px}#team-select .team-select-grid::-webkit-scrollbar-track{background:var(--bg-tertiary);border-radius:2px}#team-select .team-select-grid::-webkit-scrollbar-thumb{background:var(--green);border-radius:2px}#team-select .unit-card{padding:8px}#team-select .unit-card .unit-icon{font-size:24px;margin-bottom:4px}#team-select .unit-card .unit-name{font-size:12px;margin-bottom:2px}#team-select .unit-card .unit-stats{font-size:9px;line-height:1.3}#team-select .unit-card .unit-special{margin-top:4px;padding:2px 6px;font-size:8px}#team-select .unit-card .select-count{width:20px;height:20px;font-size:10px;top:-4px;right:-4px}#team-select .team-select-preview{padding:8px;margin:4px 0}#team-select .team-slot{width:40px;height:40px;font-size:18px}#team-select .wizard-footer{padding:8px 0;gap:8px}#team-select .wizard-btn{padding:10px 16px;font-size:13px;border-radius:10px}#team-select .budget-display{padding:6px;margin-bottom:6px}#team-select .budget-bar{height:6px;margin-bottom:4px}}@media(max-height:600px){#team-select.wizard-screen{padding:4px;padding-top:max(4px,env(safe-area-inset-top))}#team-select .wizard-progress{display:none}#team-select .team-select-badge{width:28px;height:28px;font-size:12px}#team-select .team-select-title{font-size:14px}#team-select .team-select-grid{grid-template-columns:repeat(3,1fr);gap:6px}#team-select .unit-card{padding:6px}#team-select .unit-card .unit-icon{font-size:20px;margin-bottom:2px}#team-select .unit-card .unit-name{font-size:10px}#team-select .unit-card .unit-stats{display:none}#team-select .unit-card .unit-special{font-size:7px;padding:2px 4px}#team-select .team-slot{width:36px;height:36px;font-size:16px}#team-select .wizard-btn{padding:8px 12px;font-size:12px}}.error-log-viewer{position:fixed;top:0;left:0;right:0;bottom:0;background:#000000f2;z-index:10000;display:flex;flex-direction:column;opacity:0;transition:opacity .3s ease;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)}.error-log-viewer.visible{opacity:1}.log-viewer-header{display:flex;align-items:center;gap:16px;padding:16px 20px;background:var(--surface-elevated);border-bottom:1px solid var(--border-color);flex-shrink:0}.log-viewer-header h3{margin:0;font-size:18px;color:var(--text-primary);flex:1}.log-stats{display:flex;gap:12px}.log-stat{font-size:12px;padding:4px 8px;border-radius:4px;background:var(--surface-overlay)}.log-stat.error{color:#ef4444;background:#ef444426}.log-stat.warn{color:#f59e0b;background:#f59e0b26}.log-stat.total{color:var(--text-secondary)}.log-close-btn{width:36px;height:36px;border-radius:8px;background:var(--surface-overlay);border:none;color:var(--text-secondary);font-size:18px;cursor:pointer;transition:all .2s}.log-close-btn:hover{background:var(--error-color);color:#fff}.log-viewer-content{flex:1;overflow-y:auto;padding:12px;font-family:SF Mono,Monaco,Courier New,monospace;font-size:12px}.log-empty{text-align:center;color:var(--text-muted);padding:40px 20px;font-size:14px}.log-entry{display:flex;flex-wrap:wrap;gap:8px;padding:8px 12px;margin-bottom:4px;border-radius:6px;background:var(--surface-elevated);border-left:3px solid var(--border-color)}.log-entry.error{border-left-color:#ef4444;background:#ef444414}.log-entry.warn{border-left-color:#f59e0b;background:#f59e0b14}.log-entry.info{border-left-color:#3b82f6}.log-entry.render{border-left-color:#8b5cf6}.log-entry.ai{border-left-color:#10b981}.log-time{color:var(--text-muted);font-size:11px;flex-shrink:0}.log-icon{flex-shrink:0}.log-message{color:var(--text-primary);flex:1;word-break:break-word}.log-details,.log-stack{width:100%;margin-top:4px;padding:8px;background:#0000004d;border-radius:4px;font-size:11px;color:var(--text-secondary);white-space:pre-wrap;word-break:break-all;max-height:150px;overflow-y:auto}.log-viewer-footer{display:flex;gap:12px;padding:12px 20px;background:var(--surface-elevated);border-top:1px solid var(--border-color);flex-shrink:0}.log-btn{flex:1;padding:12px 16px;border-radius:8px;border:none;background:var(--surface-overlay);color:var(--text-primary);font-size:14px;font-weight:600;cursor:pointer;transition:all .2s}.log-btn:hover{background:var(--accent-primary)}.log-btn.danger:hover{background:var(--error-color)}.debug-option-row{opacity:.6;border-top:1px dashed var(--border-color);padding-top:16px;margin-top:16px}.debug-option-row:hover{opacity:1}.debug-btn{padding:10px 16px;border-radius:8px;border:1px dashed var(--border-color);background:transparent;color:var(--text-muted);font-size:13px;cursor:pointer;transition:all .2s}.debug-btn:hover{border-color:var(--accent-primary);color:var(--text-primary);background:var(--surface-overlay)}.debug-btn.has-errors{border-color:#ef4444;color:#ef4444}.error-badge{display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:#ef4444;color:#fff;font-size:11px;font-weight:700;margin-left:8px}.log-location{font-size:10px;color:#6b7280;margin-top:2px;font-family:SF Mono,Monaco,Courier New,monospace}.log-stack details{margin-top:6px}.log-stack summary{cursor:pointer;color:#9ca3af;font-size:11px;-webkit-user-select:none;user-select:none}.log-stack summary:hover{color:var(--text-primary)}.log-stack pre{margin:6px 0 0;padding:8px;background:#0000004d;border-radius:4px;font-size:10px;white-space:pre-wrap;word-break:break-all;max-height:200px;overflow-y:auto}.manual-copy-dialog{position:fixed;top:0;left:0;right:0;bottom:0;background:#000c;display:flex;align-items:center;justify-content:center;z-index:10001;padding:20px}.manual-copy-content{background:var(--surface-elevated);border-radius:12px;padding:20px;max-width:90%;max-height:80%;display:flex;flex-direction:column;gap:12px}.manual-copy-content h4{margin:0;color:var(--text-primary)}.manual-copy-content p{margin:0;color:var(--text-secondary);font-size:13px}.manual-copy-content textarea{flex:1;min-height:200px;padding:12px;background:var(--surface-base);border:1px solid var(--border-color);border-radius:8px;color:var(--text-primary);font-family:SF Mono,Monaco,Courier New,monospace;font-size:11px;resize:none}.pause-btn{width:36px;height:36px;border-radius:10px;background:#1e293bcc;border:1px solid rgba(100,116,139,.4);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s ease;flex-shrink:0}.pause-btn:hover{background:#334155e6;border-color:#94a3b899}.pause-btn:active{transform:scale(.95)}.pause-icon{font-size:16px;line-height:1}.pause-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#000000d9;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);display:none;align-items:center;justify-content:center;z-index:1000;opacity:0;transition:opacity .25s ease}.pause-overlay.visible{display:flex;opacity:1}.pause-menu{background:linear-gradient(145deg,#1e293bfa,#0f172afa);border:2px solid rgba(100,116,139,.4);border-radius:20px;padding:28px 36px;text-align:center;box-shadow:0 20px 50px #00000080;transform:scale(.9);transition:transform .25s ease;min-width:280px}.pause-overlay.visible .pause-menu{transform:scale(1)}.pause-title{font-size:28px;font-weight:700;color:#f8fafc;margin:0 0 24px;letter-spacing:.5px}.pause-buttons{display:flex;flex-direction:column;gap:14px}.pause-menu-btn{display:flex;align-items:center;justify-content:center;gap:12px;padding:16px 28px;border-radius:12px;font-size:17px;font-weight:600;cursor:pointer;border:2px solid transparent;transition:all .2s ease}.pause-menu-btn .btn-icon{font-size:20px}.pause-menu-btn.resume-btn{background:linear-gradient(135deg,#10b981,#059669);color:#fff;border-color:#10b98166}.pause-menu-btn.resume-btn:hover{background:linear-gradient(135deg,#34d399,#10b981);transform:translateY(-2px);box-shadow:0 6px 20px #10b98166}.pause-menu-btn.quit-btn{background:#47556980;color:#e2e8f0;border-color:#64748b66}.pause-menu-btn.quit-btn:hover{background:#ef444433;border-color:#ef444480;color:#fca5a5;transform:translateY(-2px)}.pause-menu-btn:active{transform:translateY(0) scale(.98)}