*{margin:0;padding:0;box-sizing:border-box}:root{--panel-bg: rgba(41, 32, 21, .94);--panel-bg-light: rgba(58, 46, 30, .94);--panel-border: #55432a;--panel-border-light: #6d5735;--gold: #f0b23c;--gold-bright: #ffcf6b;--cream: #f3ecd9;--muted: #b3a385;--hp-green: #7cc94e;--rate-green: #9edb6a;--violet: #8e5bb5}html,body{width:100%;height:100%;overflow:hidden;font-family:Trebuchet MS,Segoe UI,system-ui,sans-serif;background:#1c2b16;user-select:none}#app{position:relative;width:100%;height:100%}#game-canvas{position:absolute;inset:0;width:100%;height:100%;display:block;touch-action:none}html,body{-webkit-touch-callout:none;overscroll-behavior:none}#ui-root{position:absolute;inset:0;pointer-events:none}#ui-root>*{pointer-events:auto}button{touch-action:manipulation}.topbar{position:absolute;top:10px;left:calc(12px + env(safe-area-inset-left,0px));right:calc(12px + env(safe-area-inset-right,0px));display:flex;align-items:center;justify-content:space-between;gap:10px;pointer-events:none!important}.topbar>*{pointer-events:auto}.logo{display:flex;flex-direction:column;line-height:.95;font-weight:900;font-size:21px;letter-spacing:1px;color:var(--gold-bright);background:var(--panel-bg);border:2px solid var(--panel-border);border-radius:12px;padding:6px 14px;text-shadow:0 2px 0 #5c3d12,0 3px 8px rgba(0,0,0,.5);box-shadow:0 4px 16px #00000059}.logo .logo-leaf{font-size:14px;vertical-align:top;text-shadow:none}.res-pill{display:flex;align-items:center;gap:18px;background:var(--panel-bg);border:2px solid var(--panel-border);border-radius:14px;padding:6px 20px;color:var(--cream);box-shadow:0 4px 16px #00000059}.res{display:flex;align-items:center;gap:7px}.res-icon{font-size:19px;filter:drop-shadow(0 1px 2px rgba(0,0,0,.5))}.res-col{display:flex;flex-direction:column;line-height:1.05}.res-val{font-size:15px;font-weight:800}.res-val.full{color:#ff7961}.res-rate{font-size:12.5px;font-weight:700;color:var(--rate-green)}.res-rate.negative{color:#ff8a70}.res.short .res-val{color:#ff7961}.res.short{animation:resShort .9s ease-in-out infinite}@keyframes resShort{0%,to{transform:none;filter:none}50%{transform:scale(1.12);filter:drop-shadow(0 0 6px rgba(255,82,82,.8))}}.res.flash-short{animation:resShake .45s ease-out}.res.flash-short .res-val{color:#ff7961}@keyframes resShake{0%,to{transform:none}20%{transform:translate(-4px)}40%{transform:translate(4px)}60%{transform:translate(-3px)}80%{transform:translate(3px)}}.pill-divider{width:1px;align-self:stretch;background:var(--panel-border-light);margin:2px}.top-buttons{display:flex;gap:8px}.icon-btn{width:40px;height:40px;border-radius:11px;background:var(--panel-bg);border:2px solid var(--panel-border);color:var(--cream);font-size:18px;font-family:inherit;cursor:pointer;box-shadow:0 4px 12px #00000059;transition:filter .12s,transform .06s}.icon-btn:hover{filter:brightness(1.25)}.icon-btn:active{transform:scale(.94)}.control-track{position:absolute;top:62px;left:50%;transform:translate(-50%);display:flex;flex-direction:column;align-items:center;gap:3px;background:var(--panel-bg);border:2px solid var(--panel-border);border-radius:12px;padding:5px 14px 7px;opacity:.7;transition:opacity .3s,box-shadow .3s;pointer-events:none!important}.control-track:not(.active) .control-bar,.control-track:not(.active) .control-label{display:none}.control-track.active{opacity:1;min-width:240px}.control-track.enemy-leading{box-shadow:0 0 14px #ff52528c}.zone-row{display:flex;align-items:center;gap:8px}.zone-title{font-size:12px;font-weight:800;letter-spacing:1.5px;color:var(--gold-bright);text-shadow:0 1px 2px rgba(0,0,0,.6);margin-right:4px}.zone-chip{font-size:15px;line-height:1;padding:3px 5px;border:2px solid rgba(255,255,255,.25);border-radius:8px;background:#00000040;transition:border-color .25s,box-shadow .25s}.zone-chip.held{background:#00000073}.control-bar{width:100%;height:7px;border-radius:4px;background:#00000073;border:1px solid rgba(255,255,255,.18);overflow:hidden}.control-fill{display:block;height:100%;width:0%;border-radius:3px;transition:width .3s linear}.control-label{font-size:13px;font-weight:700;color:#f3ead6;text-shadow:0 1px 2px rgba(0,0,0,.6)}.scoreboard{position:absolute;top:62px;right:calc(12px + env(safe-area-inset-right,0px));display:flex;flex-direction:column;gap:3px;min-width:168px;background:var(--panel-bg);border:2px solid var(--panel-border);border-radius:12px;padding:6px 10px 8px;opacity:.88;box-shadow:0 4px 16px #00000059}.score-title{order:0;font-size:12px;font-weight:800;letter-spacing:1.5px;text-align:center;color:var(--gold-bright);text-shadow:0 1px 2px rgba(0,0,0,.6);margin-bottom:2px}.score-row{display:flex;align-items:center;gap:7px;font-size:13px;color:var(--cream)}.score-dot{flex:none;width:9px;height:9px;border-radius:50%;box-shadow:0 0 4px #00000080}.score-name{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:700}.score-val{font-weight:800;font-variant-numeric:tabular-nums}.score-row.leader .score-val{color:var(--gold-bright)}.score-row.leader .score-name:after{content:" 👑"}.score-row.me .score-name{color:var(--gold-bright)}.score-row.dead{opacity:.45}.messages{position:absolute;top:148px;left:50%;transform:translate(-50%);display:flex;flex-direction:column;align-items:center;gap:6px;pointer-events:none!important}.messages .msg{background:var(--panel-bg);border:1px solid var(--panel-border-light);border-radius:10px;color:var(--gold-bright);padding:6px 16px;font-size:15px;font-weight:700;text-shadow:0 1px 2px rgba(0,0,0,.6);animation:msgIn .25s ease-out;transition:opacity .6s}@keyframes msgIn{0%{transform:translateY(-8px) scale(.9);opacity:0}to{transform:none;opacity:1}}.bottom-left{position:absolute;left:calc(12px + env(safe-area-inset-left,0px));bottom:calc(12px + env(safe-area-inset-bottom,0px));display:flex;gap:10px;align-items:flex-end}.minimap-frame{position:relative;background:var(--panel-bg);border:2px solid var(--panel-border);border-radius:12px;padding:5px;box-shadow:0 4px 16px #0006}.idle-badge{position:absolute;top:-46px;left:0;display:flex;align-items:center;gap:5px;padding:6px 11px;background:var(--panel-bg);border:2px solid var(--panel-border);border-radius:11px;color:var(--cream);font-family:inherit;font-size:16px;cursor:pointer;box-shadow:0 4px 12px #00000059;transition:filter .12s,transform .06s;animation:badge-in .18s ease-out}.idle-badge:hover{filter:brightness(1.25)}.idle-badge:active{transform:scale(.94)}.idle-badge.hidden{display:none}.map-rotate{position:absolute;top:-46px;right:0;padding:5px 12px;background:var(--panel-bg);border:2px solid var(--panel-border);border-radius:11px;color:var(--cream);font-family:inherit;font-size:19px;line-height:1.4;cursor:pointer;box-shadow:0 4px 12px #00000059;transition:filter .12s,transform .06s}.map-rotate:hover{filter:brightness(1.25)}.map-rotate:active{transform:scale(.94) rotate(20deg)}.idle-zzz{font-size:14px}.idle-count{font-size:15px;font-weight:700;color:var(--gold-bright)}@keyframes badge-in{0%{transform:translateY(6px);opacity:0}to{transform:none;opacity:1}}.minimap{display:block;width:170px;height:170px;border-radius:8px;background:#223317;cursor:crosshair;touch-action:none}.panel-box{background:var(--panel-bg);border:2px solid var(--panel-border);border-radius:14px;padding:12px;color:var(--cream);box-shadow:0 4px 16px #00000059}.selection-info{min-width:300px;max-width:380px}.selection-info.hidden{display:none}.sel-card{display:flex;gap:12px;align-items:flex-start}.sel-portrait{width:62px;height:62px;flex:none;display:flex;align-items:center;justify-content:center;font-size:34px;background:var(--panel-bg-light);border:2px solid var(--panel-border-light);border-radius:10px;box-shadow:inset 0 2px 8px #00000059}.sel-body{flex:1;min-width:0}.sel-name{font-weight:800;font-size:16px;color:#fff}.sel-faction{font-size:13px;font-weight:800;letter-spacing:.4px;color:var(--gold);margin-bottom:5px}.sel-hpbar{position:relative;height:16px;background:#241c11;border:1px solid var(--panel-border-light);border-radius:7px;overflow:hidden}.sel-hpfill{display:block;height:100%;background:linear-gradient(#96d968,#5fa832);border-radius:6px;transition:width .15s}.sel-hptext{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:800;font-style:normal;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.7)}.sel-stats{display:flex;gap:18px;margin-top:8px}.stat{display:flex;align-items:center;gap:6px}.stat-icon{font-size:15px}.stat-col{display:flex;flex-direction:column;line-height:1.05}.stat-col b{font-size:15px}.stat-col small{font-size:11px;font-weight:700;letter-spacing:.5px;color:var(--muted)}.sel-badge{margin-top:8px;font-size:13px;font-weight:700;color:var(--gold-bright)}.sel-flavor{font-size:13px;font-style:italic;color:var(--muted);margin-top:9px;padding-top:7px;border-top:1px solid rgba(109,87,53,.5);line-height:1.35}.unit-chips{display:flex;flex-wrap:wrap;gap:4px;margin-top:8px}.unit-chip{background:var(--panel-bg-light);border:1px solid var(--panel-border-light);border-radius:8px;padding:3px 8px;font-size:14px;font-weight:700}.queue-row{display:flex;flex-wrap:wrap;gap:4px;margin-top:8px}.queue-item{position:relative;overflow:hidden;background:var(--panel-bg-light);border:1px solid var(--panel-border-light);border-radius:6px;font-size:13px;padding:3px 7px;cursor:pointer}.queue-item.active{border-color:var(--gold)}.queue-item.queue-icon{padding:3px 5px;font-size:16px;line-height:1.2}.queue-fill{position:absolute;inset:0 auto 0 0;width:0%;background:#4fc3f747;pointer-events:none}.queue-label{position:relative}.queue-item.research-active .queue-fill{background:#b2ff5942}.research-list{display:flex;flex-direction:column;gap:4px;margin-top:8px}.research-item{display:flex;align-items:center;gap:8px;background:var(--panel-bg-light);border:1px solid var(--panel-border-light);border-radius:8px;padding:4px 8px;color:inherit;font:inherit;text-align:left;cursor:pointer}.research-item:hover:not(:disabled){border-color:var(--gold)}.research-item:disabled{opacity:.45;cursor:not-allowed}.research-icon{font-size:18px}.research-col{display:flex;flex-direction:column;line-height:1.2}.research-col b{font-size:14px}.research-col small{font-size:12.5px;color:var(--muted)}.unit-chip.research-done{border-color:#8bc34ab3}.auto-builder-toggle{display:flex;align-items:center;gap:8px;width:100%;margin-top:8px;background:var(--panel-bg-light);border:1px solid var(--panel-border-light);border-radius:8px;padding:4px 8px;color:inherit;font:inherit;text-align:left;cursor:pointer}.auto-builder-toggle:hover{border-color:var(--gold)}.auto-builder-toggle.on{border-color:#8bc34ab3;background:#8bc34a24}.auto-builder-toggle .research-col{flex:1}.auto-builder-toggle .toggle-pip{font-size:12px;font-weight:700;letter-spacing:.5px;padding:2px 8px;border-radius:999px;background:#ffffff1a;color:var(--muted)}.auto-builder-toggle.on .toggle-pip{background:#8bc34a59;color:#eaffea}.sel-progress{margin-top:4px;height:6px;border-radius:3px;background:#00000059;border:1px solid var(--panel-border-light);overflow:hidden}.sel-progress-fill{height:100%;width:0%;background:linear-gradient(90deg,#ffb74d,#ffd54f);border-radius:3px}.command-panel{position:absolute;right:calc(12px + env(safe-area-inset-right,0px));bottom:calc(12px + env(safe-area-inset-bottom,0px));max-width:min(560px,55vw);padding:0 10px 10px}.command-panel.collapsed .card-row{display:none}.tab-caret{display:none;font-size:10px;margin-left:5px;transition:transform .15s}.command-panel:not(.collapsed) .tab-caret{transform:rotate(180deg)}.tab-row{display:flex;gap:4px;padding:8px 2px}.tab{display:flex;align-items:center;gap:6px;background:transparent;border:2px solid transparent;border-radius:9px;color:var(--muted);font-family:inherit;font-size:14px;font-weight:800;letter-spacing:.6px;padding:6px 14px;cursor:pointer;transition:color .12s,background .12s}.tab .tab-icon{font-size:15px}.tab:hover{color:var(--cream)}.tab.active{background:var(--gold);border-color:var(--gold-bright);color:#3a2405;box-shadow:0 2px 8px #0000004d}.card-row{display:flex;flex-wrap:wrap;gap:6px;padding-bottom:2px}.card{flex:none;width:84px;display:flex;flex-direction:column;align-items:center;gap:3px;background:var(--panel-bg-light);border:2px solid var(--panel-border-light);border-radius:11px;color:var(--cream);font-family:inherit;padding:8px 4px 6px;cursor:pointer;text-align:center;transition:transform .06s,filter .12s,border-color .12s}.card:hover{filter:brightness(1.18)}.card:active{transform:scale(.96)}.card.unaffordable{filter:grayscale(.75) brightness(.65)}.card.placing{border-color:var(--gold-bright);box-shadow:0 0 14px #ffcf6b8c}.card-icon{font-size:24px;filter:drop-shadow(0 2px 3px rgba(0,0,0,.45))}.card-name{font-size:11.5px;font-weight:800;line-height:1.2;min-height:28px;display:flex;align-items:center}.card.ability{background:linear-gradient(#54346ef2,#38214cf2);border-color:var(--violet)}.card-tip .tip-cost{color:var(--gold-bright);font-weight:700}.card.ability.active{border-color:#e2c4ff;box-shadow:0 0 16px #be82ff8c}.floater-layer{position:fixed;inset:0;overflow:hidden;pointer-events:none;z-index:20}.floater{position:absolute;left:0;top:0;white-space:nowrap;font-weight:700;text-shadow:0 1px 2px rgba(0,0,0,.65);will-change:transform,opacity}.floater-gain{font-size:15px;color:var(--gold-bright)}.floater-dmg{font-size:13px;color:#ff6d5a}.overlay.game-menu{background:#0c090599;z-index:45;animation-duration:.12s}.menu-panel{display:flex;flex-direction:column;align-items:center;gap:14px;background:var(--panel-bg);border:2px solid var(--panel-border-light);border-radius:18px;padding:28px 40px;box-shadow:0 12px 48px #0009}.menu-title{font-size:26px;letter-spacing:2px;color:var(--gold-bright);text-shadow:0 2px 0 #5c3d12}.menu-panel .menu-btn-item{font-size:17px;padding:10px 36px;min-width:240px}.menu-panel .menu-btn-item.secondary{background:linear-gradient(#6d5735,#55432a);border-color:#8a7350;color:var(--cream);box-shadow:0 4px #3a2d1b,0 8px 18px #0006}.menu-panel .menu-btn-item.danger{background:linear-gradient(#8a4a3a,#6d3527);border-color:#b06a52;color:#ffd9cf;box-shadow:0 4px #45231a,0 8px 18px #0006}.menu-panel.pause-menu{gap:10px;min-width:400px;max-width:480px;max-height:92vh;max-height:92dvh;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:22px 34px 26px}.menu-panel.pause-menu .menu-btn-item{min-width:280px}.menu-note{font-size:14px;color:var(--muted);font-style:italic;text-align:center;max-width:340px}.menu-panel .settings-controls{width:100%;padding:10px 0 2px;border-top:1px solid var(--panel-border);border-bottom:1px solid var(--panel-border)}.settings-controls .settings-row label{min-width:128px}.settings-toggle{margin-left:auto;min-width:64px;padding:6px 14px;font-family:inherit;font-weight:800;font-size:15px;letter-spacing:1px;border-radius:10px;border:2px solid #8a7350;background:linear-gradient(#6d5735,#55432a);color:var(--muted);cursor:pointer}.settings-toggle.on{background:linear-gradient(#7a9a3f,#5d7a2c);border-color:#a3c163;color:#fff}.speed-group{margin-left:auto;display:flex;gap:6px}.speed-btn{padding:6px 10px;font-family:inherit;font-weight:800;font-size:15px;border-radius:10px;border:2px solid #8a7350;background:linear-gradient(#6d5735,#55432a);color:var(--muted);cursor:pointer}.speed-btn.on{background:linear-gradient(#f6c04f,#d99a26);border-color:var(--gold-bright);color:#3a2a10}.help-text{font-size:15px;color:var(--cream);text-align:center;line-height:1.8;max-width:520px}.hover-card{position:absolute;left:0;top:0;max-width:300px;background:var(--panel-bg);border:2px solid var(--panel-border-light);border-radius:10px;padding:8px 11px;color:var(--cream);box-shadow:0 4px 16px #00000073;pointer-events:none!important;z-index:35;opacity:0;transition:opacity .08s}.hover-card.visible{opacity:1}.place-hint{position:fixed;left:0;top:0;background:#400e08eb;border:2px solid #ff6f5e;border-radius:10px;padding:6px 12px;font-size:14px;font-weight:700;color:var(--cream);white-space:nowrap;text-shadow:0 1px 2px rgba(0,0,0,.6);box-shadow:0 4px 16px #00000073;pointer-events:none!important;z-index:36;opacity:0;transition:opacity .08s}.place-hint.visible{opacity:1}.place-hint b{color:#ff8a70}.hover-title{font-weight:800;font-size:15px;color:var(--gold-bright);display:flex;align-items:center;gap:6px}.hover-badge{background:var(--panel-bg-light);border-radius:7px;padding:1px 7px;font-size:12.5px;font-weight:700;color:var(--gold);white-space:nowrap}.hover-owner{font-size:13px;font-weight:700;color:var(--muted);margin-top:2px}.hover-health{height:6px;background:#241c11;border-radius:4px;overflow:hidden;margin-top:5px}.hover-health span{display:block;height:100%;background:linear-gradient(#8fd15e,#5fa832);border-radius:4px}.hover-meta{font-size:13px;color:var(--cream);margin-top:3px}.hover-flavor{font-size:13px;font-style:italic;color:var(--muted);margin-top:4px;line-height:1.35}.hover-hint{font-size:12.5px;color:#9c8c6b;margin-top:5px}.select-box{position:absolute;border:2px solid #7fff6e;background:#7fff6e1f;pointer-events:none!important;z-index:30}.touch-bar{position:absolute;right:calc(10px + env(safe-area-inset-right,0px));bottom:200px;display:flex;flex-direction:column;gap:10px;z-index:25}.touch-btn{width:52px;height:52px;border-radius:14px;background:var(--panel-bg);border:2px solid var(--panel-border-light);color:var(--cream);font-size:22px;font-family:inherit;box-shadow:0 4px 12px #00000059;cursor:pointer;touch-action:manipulation}.touch-btn:active{transform:scale(.94)}.touch-btn.hidden{display:none}.touch-btn.armed{border-color:var(--gold-bright);background:#54422af2;box-shadow:0 0 16px #ffcf6b99}@media (pointer: coarse){.card{width:88px;padding:10px 6px 8px}.card-name{font-size:12px}.tab{padding:9px 14px}.queue-item{padding:7px 9px}}@media (max-width: 900px),(max-height: 500px){.logo{font-size:15px;padding:4px 10px}.res-pill{gap:9px;padding:4px 10px}.res-val,.res-icon{font-size:15px}.icon-btn{width:34px;height:34px;font-size:15px}.minimap{width:110px;height:110px}.scoreboard{top:50px;min-width:128px;padding:4px 8px 6px}.score-row{font-size:12px}.score-title{font-size:11px}.selection-info{min-width:0;max-width:40vw;padding:9px}.sel-portrait{width:46px;height:46px;font-size:26px}.sel-name{font-size:15px}.sel-flavor{display:none}.command-panel{max-width:46vw;right:calc(70px + env(safe-area-inset-right,0px))}.card{width:76px}.card-name{font-size:11px;min-height:27px}.touch-bar{bottom:170px}.faction-cards{flex-wrap:wrap;justify-content:center;gap:10px}.faction-card{width:150px;padding:12px 10px}.overlay h1{font-size:42px}.hint{max-width:92%;font-size:13px}}.vignette-shade{position:absolute;inset:0;pointer-events:none;z-index:45;background:radial-gradient(ellipse at center,#0000 35%,#080c05d9);opacity:0;animation:vignette-in 2s ease-out forwards}@keyframes vignette-in{to{opacity:1}}.overlay{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;background:radial-gradient(ellipse at center,#1e2e12eb,#0c1408f7);z-index:50;color:var(--cream);animation:overlay-in .35s ease-out both}@keyframes overlay-in{0%{opacity:0}}.overlay h1{font-size:64px;letter-spacing:2px;color:var(--gold-bright);text-shadow:0 4px 0 #7a5c30,0 8px 24px rgba(0,0,0,.6);margin-bottom:4px}.overlay .subtitle{font-size:17px;color:#cfe8a8;margin-bottom:30px;font-style:italic}.faction-cards{display:flex;gap:16px;margin-bottom:26px}.faction-card{width:185px;background:#283a1aeb;border:3px solid #4a6b33;border-radius:16px;padding:16px 14px;cursor:pointer;text-align:center;transition:transform .12s,border-color .12s,box-shadow .12s}.faction-card:hover{transform:translateY(-4px)}.faction-card.selected{border-color:var(--gold-bright);box-shadow:0 0 24px #ffcf6b59;transform:translateY(-4px)}.faction-card .emoji{font-size:44px}.faction-card h3{margin:8px 0 6px;font-size:17px;color:var(--gold-bright)}.faction-card p{font-size:14px;color:#c9d6b2;line-height:1.4}.menu-row{display:flex;align-items:center;gap:12px;margin-bottom:26px;font-size:15px;font-weight:700}.menu-row select{font-family:inherit;font-size:15px;font-weight:700;padding:6px 10px;border-radius:8px;border:2px solid #6b8a4a;background:#2b3d1d;color:var(--cream)}.big-btn{background:linear-gradient(#ffb547,#e08b1d);border:3px solid var(--gold-bright);border-radius:16px;color:#3a2405;font-size:24px;font-weight:900;font-family:inherit;padding:14px 54px;cursor:pointer;box-shadow:0 6px #9c6510,0 10px 24px #0006;transition:transform .08s,box-shadow .08s}.big-btn:hover{filter:brightness(1.08)}.big-btn:active{transform:translateY(4px);box-shadow:0 2px #9c6510}.big-btn:disabled,.big-btn:disabled:hover{filter:grayscale(.55) brightness(.72);cursor:default}.big-btn:disabled:active{transform:none;box-shadow:0 6px #9c6510,0 10px 24px #0006}.hint{margin-top:22px;font-size:14px;color:#9fb586;max-width:640px;text-align:center;line-height:1.6}.gameover h1{font-size:54px}.gameover .stats{font-size:15px;margin-bottom:16px;color:#cfe8a8}.gameover .subtitle{margin-bottom:14px}.stats-wrap{max-width:94%;overflow-x:auto;margin-bottom:16px;border:3px solid #4a6b33;border-radius:14px;background:#1e2e12bf;padding:8px 14px}.stats-table{border-collapse:collapse;font-size:16px}.stats-table th,.stats-table td{padding:5px 14px;text-align:right;white-space:nowrap}.stats-table th:first-child,.stats-table td:first-child{text-align:left}.stats-table thead th{color:var(--gold-bright);border-bottom:2px solid #4a6b33;font-size:15px}.stats-table tbody tr:nth-child(odd){background:#283a1a80}.stats-table td.best{color:var(--gold-bright);font-weight:900}.gameover .highlights{font-size:15px;color:#cfe8a8;line-height:1.9;margin-bottom:20px;text-align:center;max-width:660px;padding:0 12px}@media (max-width: 700px){.scoreboard{top:104px}.gameover h1{font-size:38px}.stats-table{font-size:14px}.stats-table th,.stats-table td{padding:4px 8px}.gameover .highlights{font-size:14px;line-height:1.7}}.net-row{gap:8px;flex-wrap:wrap;justify-content:center}.net-btn{background:var(--panel-bg-light);border:2px solid var(--panel-border-light);color:var(--gold-bright);font-family:inherit;font-weight:700;font-size:16px;padding:8px 14px;border-radius:8px;cursor:pointer}.net-btn:hover{border-color:var(--gold)}.code-input{width:130px;background:var(--panel-bg);border:2px solid var(--panel-border);color:var(--cream);font-family:inherit;font-weight:700;font-size:15px;letter-spacing:3px;text-align:center;padding:8px 6px;border-radius:8px;text-transform:uppercase}.net-hint{max-width:560px}.room-code{font-size:18px;color:var(--muted);margin:4px 0 2px}.room-code b{color:var(--gold-bright);font-size:26px;letter-spacing:6px;margin-left:6px}.seat-list{display:flex;flex-direction:column;gap:6px;min-width:300px;margin:10px 0}.seat{display:flex;align-items:center;gap:10px;background:var(--panel-bg);border:2px solid var(--panel-border);border-radius:8px;padding:7px 12px;color:var(--cream)}.seat-fac{font-size:20px}.seat-name{font-weight:700;min-width:90px}.seat-role{color:var(--muted);margin-left:auto}.seat-team{font-family:inherit;font-size:12px;font-weight:700;color:var(--cream);background:#ffffff0f;border:2px solid var(--panel-border);border-radius:6px;padding:3px 8px;white-space:nowrap}button.seat-team{cursor:pointer}button.seat-team:hover{border-color:var(--cream)}.seat-team.team-0{color:var(--muted)}.seat-team.team-1{border-color:#4da3ff;color:#9fccff}.seat-team.team-2{border-color:#ff6a5e;color:#ffb0a8}.seat-team.team-3{border-color:#58d68d;color:#a9ecc6}.seat-team.team-4{border-color:#c39bd3;color:#e3cdf0}.seat-x{font-family:inherit;font-size:12px;font-weight:700;line-height:1;color:#ffb0a8;background:#ff6a5e1f;border:2px solid rgba(255,106,94,.5);border-radius:6px;padding:3px 8px;cursor:pointer}.seat-x:hover{background:#ff6a5e47;border-color:#ff6a5e;color:#fff}.seat.empty{border-style:dashed;opacity:.9}.seat.empty .seat-fac{opacity:.7}.seat.empty .seat-name{color:var(--muted);min-width:0}.seat-add{margin-left:auto;font-family:inherit;font-size:12px;font-weight:700;color:#a9ecc6;background:#58d68d1f;border:2px solid rgba(88,214,141,.5);border-radius:6px;padding:4px 10px;cursor:pointer}.seat-add:hover{background:#58d68d42;border-color:#58d68d;color:#fff}.fac-btn{background:var(--panel-bg);border:2px solid var(--panel-border);color:var(--cream);font-family:inherit;font-size:15px;padding:6px 10px;border-radius:8px;cursor:pointer}.fac-btn.selected{border-color:var(--gold);color:var(--gold-bright)}.fac-info{margin-top:10px;width:100%;background:#00000047;border:2px solid var(--panel-border);border-radius:10px;padding:10px 12px;box-sizing:border-box;text-align:left}.fac-info-head{display:flex;align-items:center;gap:8px;margin-bottom:2px}.fac-info-emoji{font-size:20px}.fac-info-name{font-weight:700;color:var(--gold-bright);font-size:16px}.fac-info-blurb{margin:2px 0 8px;font-size:13px;font-style:italic;color:#cbd8bb}.fac-info-cols{display:flex;gap:14px}.fac-info-pros,.fac-info-cons{flex:1;min-width:0}.fac-info-cols h5{margin:0 0 4px;font-size:13px;letter-spacing:.04em}.fac-info-pros h5{color:#8bd98b}.fac-info-cons h5{color:#e79b9b}.fac-info-cols ul{margin:0;padding-left:16px;font-size:12.5px;line-height:1.35;color:var(--cream)}.fac-info-cols li{margin-bottom:3px}.fac-info-ability{margin-top:8px;padding-top:7px;border-top:1px solid var(--panel-border);font-size:12.5px;line-height:1.35;color:#cbd8bb}.fac-info-ability b{color:var(--gold-bright)}.net-wait{position:fixed;top:64px;left:50%;transform:translate(-50%);background:var(--panel-bg);border:2px solid var(--gold);color:var(--gold-bright);font-weight:700;padding:8px 16px;border-radius:10px;z-index:60;pointer-events:none}.net-wait.catchup{top:110px;z-index:61}.invite-row{flex-wrap:wrap;justify-content:center}.invite-link{font-family:monospace;font-size:15px;background:#00000059;border:1px solid rgba(255,255,255,.15);border-radius:8px;padding:6px 10px;user-select:all;max-width:min(70vw,460px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.gameover-actions{justify-content:center;align-items:center;gap:14px}.overlay.home{justify-content:space-between;padding-top:22px;overflow-y:auto;background:radial-gradient(ellipse at 50% 28%,#344a1e80,#0a100600 60%),radial-gradient(ellipse at center,#0000 40%,#040702cc),linear-gradient(180deg,#17230d,#223313 45%,#0c1206)}.overlay.home:before{content:"";position:absolute;left:0;right:0;bottom:0;height:150px;pointer-events:none;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='150' viewBox='0 0 220 150'%3E%3Cg fill='%230d1706'%3E%3Cpath d='M0 150 Q8 60 14 52 Q17 95 26 150Z'/%3E%3Cpath d='M30 150 Q42 30 50 24 Q52 80 64 150Z'/%3E%3Cpath d='M70 150 Q76 84 82 78 Q86 110 94 150Z'/%3E%3Cpath d='M100 150 Q112 44 122 36 Q124 90 138 150Z'/%3E%3Cpath d='M144 150 Q150 92 156 86 Q160 116 168 150Z'/%3E%3Cpath d='M172 150 Q184 52 194 46 Q196 96 210 150Z'/%3E%3C/g%3E%3Cg fill='%23142309' opacity='0.85'%3E%3Cpath d='M16 150 Q26 76 34 70 Q36 108 46 150Z'/%3E%3Cpath d='M84 150 Q94 62 104 56 Q106 104 118 150Z'/%3E%3Cpath d='M156 150 Q168 70 178 64 Q180 108 194 150Z'/%3E%3C/g%3E%3C/svg%3E") repeat-x bottom;opacity:.9}.home-top{text-align:center;z-index:1}.home-flag{font-size:26px;margin-bottom:-6px;animation:flag-sway 3s ease-in-out infinite}@keyframes flag-sway{0%,to{transform:rotate(-4deg)}50%{transform:rotate(4deg)}}.overlay.home h1{font-size:62px;margin-bottom:8px;background:linear-gradient(180deg,#ffe49a 10%,#f0b23c,#c07d17);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;text-shadow:none;filter:drop-shadow(0 4px 0 rgba(74,47,12,.9)) drop-shadow(0 8px 18px rgba(0,0,0,.6))}.home-tagline{display:inline-block;font-size:16px;font-style:italic;color:var(--gold-bright);background:#141008b3;border:1px solid rgba(240,178,60,.35);border-radius:999px;padding:5px 22px;letter-spacing:.5px}.home-center{display:flex;flex-direction:column;align-items:center;z-index:1;padding:18px 12px}.overlay.home .faction-card{width:190px;padding:0 0 14px;overflow:hidden;background:#18140ceb;border:2px solid #7a5c30;border-radius:14px;box-shadow:0 6px 16px #00000073}.overlay.home .faction-card.selected{border-color:var(--gold-bright);box-shadow:0 0 26px #ffcf6b66,0 6px 16px #00000073}.card-portrait{position:relative;height:116px;display:flex;align-items:center;justify-content:center;margin-bottom:10px;border-bottom:2px solid rgba(240,178,60,.25)}.portrait-emoji{font-size:60px;filter:drop-shadow(0 4px 6px rgba(0,0,0,.6))}.portrait-model{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:drop-shadow(0 4px 6px rgba(0,0,0,.55));user-select:none;-webkit-user-select:none}.card-badge{position:absolute;top:7px;left:7px;width:26px;height:26px;display:flex;align-items:center;justify-content:center;font-size:15px;background:#0f0c06cc;border:1px solid rgba(240,178,60,.5);border-radius:50%}.overlay.home .faction-card h3{font-size:15px;letter-spacing:1px;text-transform:uppercase}.overlay.home .faction-card p{padding:0 12px;color:#b6ac91}.fac-rats .card-portrait{background:radial-gradient(ellipse at 50% 35%,#6b5233,#2c2113 75%)}.fac-rats h3{color:#ffcf6b}.fac-ants .card-portrait{background:radial-gradient(ellipse at 50% 35%,#46652c,#1c2a10 75%)}.fac-ants h3{color:#9edb6a}.fac-bees .card-portrait{background:radial-gradient(ellipse at 50% 35%,#8a5f14,#3a2908 75%)}.fac-bees h3{color:#ffb547}.fac-spiders .card-portrait{background:radial-gradient(ellipse at 50% 35%,#533064,#221230 75%)}.fac-spiders h3{color:#c58bf2}.overlay.skirmish{justify-content:flex-start;padding:4vh 16px;overflow-y:auto}.setup-cols{display:flex;flex-wrap:wrap;justify-content:center;align-items:flex-start;gap:20px;margin-bottom:22px}.lobby-panel{width:min(420px,94vw);background:#141008c7;border:1px solid rgba(240,178,60,.3);border-radius:18px;padding:14px 18px 16px;display:flex;flex-direction:column;align-items:center}.lobby-panel .menu-row{margin-bottom:8px}.lobby-panel .seat-list{width:100%;min-width:0}.lobby-panel .fac-row{flex-wrap:wrap;justify-content:center;gap:8px}.lobby-panel .setup-hint{text-align:center}.setup-panel{width:min(680px,94vw);background:#141008c7;border:1px solid rgba(240,178,60,.3);border-radius:18px;padding:18px 22px 10px;margin-bottom:22px}.setup-cols .setup-panel{width:min(600px,94vw);margin-bottom:0}.setup-row{padding:10px 0 12px;border-bottom:1px solid rgba(240,178,60,.12)}.setup-row:last-child{border-bottom:none}.setup-label{font-size:14px;font-weight:800;letter-spacing:1.5px;color:var(--muted);margin-bottom:8px}.setup-choices{display:flex;flex-wrap:wrap;gap:8px}.opt-btn{background:var(--panel-bg);border:2px solid var(--panel-border);color:var(--cream);font-family:inherit;font-size:15px;font-weight:700;letter-spacing:.5px;padding:7px 14px;border-radius:999px;cursor:pointer;transition:border-color .1s,color .1s,transform .06s}.opt-btn:hover{border-color:var(--gold)}.opt-btn:active{transform:translateY(1px)}.opt-btn.selected{background:linear-gradient(#ffb547,#e08b1d);border-color:var(--gold-bright);color:#3a2405}.setup-hint{margin-top:8px;font-size:14px;color:#9fb586;line-height:1.4;min-height:20px}.setup-actions{display:flex;align-items:center;gap:18px;margin-bottom:4vh}.overlay.home .net-row{margin:16px 0 0}.overlay.home .big-btn{box-shadow:0 6px #9c6510,0 14px 34px #f0b23c40}.overlay.home .start-row{margin:0;gap:16px;flex-wrap:wrap;justify-content:center}.ai-only-btn,.overlay.home .ai-only-btn{background:linear-gradient(#9ecbe8,#4a8ab5);border-color:#cfe8f7;color:#0d2334;font-size:19px;padding:14px 26px;box-shadow:0 6px #2d5c7d,0 14px 34px #6eafdc38}.ai-only-btn:active{box-shadow:0 2px #2d5c7d}.home-footer{position:relative;z-index:1;width:100%;display:flex;align-items:stretch;justify-content:center;gap:22px;padding:14px 24px 16px;background:linear-gradient(180deg,#100d07e0,#0a0804f2);border-top:2px solid #55432a;flex-wrap:wrap}.home-menu{display:flex;flex-direction:column;justify-content:center;gap:8px}.home-menu-btn{display:flex;align-items:center;gap:9px;min-width:150px;background:var(--panel-bg-light);border:2px solid var(--panel-border-light);border-radius:10px;color:var(--cream);font-family:inherit;font-weight:700;font-size:14px;letter-spacing:1px;padding:7px 12px;cursor:pointer;transition:border-color .12s,transform .08s}.home-menu-btn:hover{border-color:var(--gold);transform:translate(2px)}.home-menu-btn .btn-icon{font-size:15px}.home-panel{max-width:390px;padding:4px 0}.home-panel h4,.tip-body h4{color:var(--gold);font-size:13px;letter-spacing:2px;margin-bottom:7px}.cheat-line,.mp-line{font-size:13px;color:#9a8f74;line-height:1.75;white-space:nowrap}.home-mp{max-width:260px}.home-tip{display:flex;align-items:center;gap:12px;max-width:340px;background:#3a2a108c;border:1px solid rgba(240,178,60,.45);border-radius:12px;padding:10px 14px}.tip-icon{font-size:34px;filter:drop-shadow(0 0 10px rgba(255,207,107,.5))}.tip-text{font-size:13px;color:#e8d9b0;line-height:1.5;min-height:40px}.tip-dots{display:flex;gap:5px;margin-top:7px}.tip-dot{width:6px;height:6px;border-radius:50%;background:#5d4c2c;cursor:pointer;transition:background .15s,transform .15s}.tip-dot.active{background:var(--gold-bright);transform:scale(1.25)}.modal-shade{position:absolute;inset:0;z-index:60;display:flex;align-items:center;justify-content:center;background:#040602a6}.modal{width:min(540px,92vw);max-height:84vh;overflow-y:auto;background:var(--panel-bg);border:2px solid #7a5c30;border-radius:16px;box-shadow:0 18px 48px #0009;color:var(--cream)}.modal-head{display:flex;align-items:center;justify-content:space-between;padding:14px 18px;border-bottom:2px solid #55432a}.modal-head h2{font-size:20px;color:var(--gold-bright);letter-spacing:1px}.modal-close{background:none;border:2px solid var(--panel-border-light);border-radius:8px;color:var(--muted);font-family:inherit;font-weight:700;font-size:16px;width:30px;height:30px;cursor:pointer}.modal-close:hover{color:var(--cream);border-color:var(--gold)}.modal-body{padding:16px 20px 20px}.modal-body h4{color:var(--gold);font-size:15px;letter-spacing:1.5px;margin:14px 0 4px}.modal-body h4:first-child{margin-top:0}.modal-body p{font-size:15px;color:#cfc3a4;line-height:1.6}.settings-row{display:flex;align-items:center;gap:12px;margin-bottom:14px;font-size:16px;font-weight:700}.settings-row input[type=range]{flex:1;accent-color:var(--gold)}.settings-value{min-width:52px;text-align:right;color:var(--gold-bright)}.settings-note{margin-top:14px;font-size:13px;color:var(--muted);font-style:italic}@media (max-width: 1100px){.home-cheat{display:none}}@media (max-width: 760px){.overlay.home h1{font-size:42px}.overlay.home .faction-card{width:150px}.card-portrait{height:88px}.portrait-emoji{font-size:44px}.home-mp{display:none}.home-footer{gap:14px;padding:10px 14px 12px}.home-menu{flex-direction:row;flex-wrap:wrap;justify-content:center}.home-menu-btn{min-width:0}.home-tip{max-width:100%}}.splash{position:fixed;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:90;color:var(--cream);background:radial-gradient(ellipse at 50% 32%,#344a1e80,#0a100600 60%),linear-gradient(180deg,#17230d,#223313 45%,#0c1206);opacity:1;transition:opacity .55s ease}.splash.out{opacity:0;pointer-events:none}.splash-flag{font-size:54px;animation:splash-bob 2.2s ease-in-out infinite}@keyframes splash-bob{0%,to{transform:translateY(0) rotate(-4deg)}50%{transform:translateY(-8px) rotate(4deg)}}.splash-title{font-size:62px;font-weight:700;letter-spacing:3px;color:var(--gold-bright);text-shadow:0 4px 0 #7a5c30,0 8px 24px rgba(0,0,0,.6);margin-top:6px}.splash-tagline{font-size:16px;font-style:italic;color:#cfe8a8;margin-top:4px}.splash-loading{margin-top:34px;font-size:14px;color:var(--muted)}.splash-dots span{animation:splash-dot 1.2s infinite}.splash-dots span:nth-child(2){animation-delay:.2s}.splash-dots span:nth-child(3){animation-delay:.4s}@keyframes splash-dot{0%,60%,to{opacity:.25}30%{opacity:1}}.match-loader{position:fixed;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:26px;z-index:70;color:var(--cream);text-align:center;padding:20px;background:radial-gradient(ellipse at 50% 30%,var(--fac-glow) 0%,rgba(10,16,6,0) 62%),linear-gradient(180deg,#141d0c,#1c290f 45%,#0a0f05);animation:overlay-in .3s ease-out both;transition:opacity .75s ease}.match-loader.out{opacity:0;pointer-events:none}.match-loader.fac-rats{--fac-glow: rgba(141, 110, 99, .4);--fac-accent: #ffb74d}.match-loader.fac-ants{--fac-glow: rgba(216, 67, 21, .32);--fac-accent: #ffcc80}.match-loader.fac-bees{--fac-glow: rgba(251, 192, 45, .3);--fac-accent: #ffe082}.match-loader.fac-spiders{--fac-glow: rgba(106, 27, 154, .42);--fac-accent: #b2ff59}.loader-card{display:flex;flex-direction:column;align-items:center}.loader-portrait{font-size:110px;line-height:1.15;filter:drop-shadow(0 10px 22px rgba(0,0,0,.55));animation:loader-float 3s ease-in-out infinite}@keyframes loader-float{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}.loader-kicker{margin-top:10px;font-size:12px;letter-spacing:3px;color:var(--muted)}.loader-name{font-size:46px;letter-spacing:2px;color:var(--fac-accent, var(--gold-bright));text-shadow:0 4px 0 rgba(0,0,0,.45),0 8px 24px rgba(0,0,0,.6);margin-top:4px}.loader-blurb{font-size:16px;font-style:italic;color:#d9e9bb;margin-top:6px;max-width:520px}.loader-bar{width:260px;height:8px;margin-top:26px;border-radius:4px;background:#ffffff14;border:1px solid rgba(255,255,255,.12);overflow:hidden}.loader-bar-fill{width:40%;height:100%;border-radius:4px;background:var(--fac-accent, var(--gold));animation:loader-scan 1.4s ease-in-out infinite}@keyframes loader-scan{0%{transform:translate(-100%)}to{transform:translate(260%)}}.loader-status{margin-top:10px;font-size:13px;color:var(--muted)}.loader-tip{display:flex;align-items:center;gap:12px;max-width:640px;padding:12px 18px;border:1px solid rgba(255,255,255,.14);border-radius:12px;background:#00000052;font-size:15px;color:var(--cream)}.loader-tip-label{flex:0 0 auto;font-size:11px;font-weight:700;letter-spacing:2px;padding:3px 8px;border-radius:6px;color:#1c2b16;background:var(--fac-accent, var(--gold))}.loader-tip-text{text-align:left;transition:opacity .25s ease}.loader-tip-text.swap{opacity:0}.fade-shade{position:fixed;inset:0;z-index:85;pointer-events:none;background:#060a04;opacity:0;transition:opacity .26s ease-in}.fade-shade.in{opacity:1;pointer-events:all;transition:opacity .26s ease-in}.fade-shade:not(.in){transition:opacity .48s ease-out}@media (max-width: 700px){.splash-title{font-size:42px}.loader-portrait{font-size:84px}.loader-name{font-size:32px}.loader-tip{font-size:13px}}@media (pointer: coarse) and (max-height: 500px){.logo,.scoreboard{display:none}.topbar{top:6px}.res-pill{gap:9px;padding:3px 10px;border-radius:10px}.res-icon,.res-val{font-size:13px}.res-rate{font-size:10.5px}.control-track{top:46px;padding:3px 10px 5px}.zone-title{font-size:10px}.zone-chip{font-size:12px;padding:2px 4px}.control-label{font-size:11px}.messages{top:86px}.messages .msg{font-size:13px;padding:4px 12px}.minimap{width:96px;height:96px}.idle-badge,.map-rotate{top:-42px}.idle-badge{font-size:14px;padding:5px 9px}.map-rotate{font-size:16px;padding:4px 10px}.selection-info{max-width:42vw;max-height:calc(100vh - 76px);max-height:calc(100dvh - 76px);overflow-y:auto;-webkit-overflow-scrolling:touch;padding:8px 10px}.sel-portrait{width:42px;height:42px;font-size:24px}.sel-name{font-size:14px}.sel-stats{gap:12px;margin-top:6px}.command-panel{right:calc(64px + env(safe-area-inset-right,0px));display:flex;flex-direction:column-reverse;max-width:min(48vw,340px)}.command-panel .card-row{max-height:calc(100vh - 116px);max-height:calc(100dvh - 116px);overflow-y:auto;-webkit-overflow-scrolling:touch}.command-panel.collapsed{box-shadow:0 4px 12px #00000059}.tab{padding:9px 14px}.tab-caret{display:inline}.card{width:68px;padding:6px 3px 5px;border-radius:9px}.card-icon{font-size:19px}.card-name{font-size:9.5px;min-height:23px}.touch-bar{bottom:auto;top:50%;transform:translateY(-50%);gap:8px}.touch-btn{width:46px;height:46px;font-size:19px;border-radius:12px}.overlay{overflow-y:auto;-webkit-overflow-scrolling:touch;justify-content:flex-start;padding:12px 0}.menu-panel{margin:auto;padding:16px 24px;gap:8px}.menu-panel.pause-menu{min-width:min(400px,92vw);max-height:none;overflow-y:visible;padding:14px 22px 18px}.menu-title{font-size:20px}.menu-panel .menu-btn-item{font-size:15px;padding:9px 24px;min-width:230px}.help-text{font-size:13.5px;line-height:1.7}.overlay h1{font-size:34px}.gameover h1{font-size:30px}.overlay .subtitle{font-size:14px;margin-bottom:14px}.overlay.home{padding-top:10px}.overlay.home h1{font-size:32px;margin-bottom:4px}.home-flag{font-size:18px;margin-bottom:-2px}.home-tagline{font-size:12px;padding:3px 14px}.home-center{padding:10px 12px}.overlay.home .faction-card{width:130px}.card-portrait{height:64px;margin-bottom:6px}.portrait-emoji{font-size:34px}.overlay.home .faction-card p{font-size:12px}.big-btn{font-size:19px;padding:10px 40px}.home-tip{display:none}.loader-portrait{font-size:64px}.loader-name{font-size:26px}.loader-blurb{font-size:13px}}.rotate-overlay{position:fixed;inset:0;z-index:300;display:none;flex-direction:column;align-items:center;justify-content:center;gap:12px;text-align:center;padding:28px;color:var(--cream);background:radial-gradient(ellipse at 50% 32%,#344a1e80,#0a100600 60%),linear-gradient(180deg,#17230d,#223313 45%,#0c1206)}.rotate-phone{font-size:62px;animation:rotate-nudge 1.8s ease-in-out infinite}@keyframes rotate-nudge{0%,15%{transform:rotate(0)}55%,85%{transform:rotate(90deg)}to{transform:rotate(90deg)}}.rotate-title{font-size:24px;font-weight:900;letter-spacing:2px;color:var(--gold-bright);text-shadow:0 2px 0 #7a5c30,0 4px 16px rgba(0,0,0,.6)}.rotate-sub{font-size:15px;color:#cfe8a8;max-width:300px;line-height:1.5}@media (pointer: coarse) and (orientation: portrait) and (max-width: 620px){.rotate-overlay{display:flex}}.hero-mode .command-panel,.hero-mode .minimap-frame,.hero-mode .touch-bar,.hero-mode .topbar,.hero-mode .control-track{display:none!important}.tutorial-btn{background:linear-gradient(#57c9b0,#2f9c86);border-color:#8ef0da;color:#06322a;box-shadow:0 6px #1c6d5c,0 10px 24px #0006}.tutorial-btn:active{box-shadow:0 2px #1c6d5c}.tutorial-panel{position:absolute;left:50%;bottom:22px;transform:translate(-50%);width:min(560px,92vw);background:var(--panel-bg);border:3px solid #2f9c86;border-radius:16px;padding:14px 18px 12px;color:var(--cream);z-index:48;box-shadow:0 10px 30px #00000080,0 0 0 1px #8ef0da26;pointer-events:auto}.tutorial-panel.pop{animation:tut-pop .28s ease-out}@keyframes tut-pop{0%{transform:translate(-50%) translateY(10px) scale(.98);opacity:.4}to{transform:translate(-50%) translateY(0) scale(1);opacity:1}}.tut-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:6px}.tut-badge{font-size:12px;font-weight:900;letter-spacing:1px;color:#8ef0da}.tut-counter{font-size:12px;color:var(--muted)}.tut-title{margin:0 0 6px;font-size:19px;color:var(--gold-bright)}.tut-body{font-size:14px;line-height:1.5;color:var(--cream)}.tut-body b{color:var(--gold-bright)}.tut-objective{margin-top:8px;padding:6px 10px;background:#2f9c8629;border:1px solid rgba(142,240,218,.4);border-radius:8px;font-size:14px;color:#cdeee5}.tut-objective b{color:#eafff9}.tut-btns{display:flex;gap:8px;margin-top:10px;justify-content:flex-end}.tut-btn{font-family:inherit;font-weight:800;font-size:13px;padding:7px 14px;border-radius:9px;cursor:pointer;border:2px solid var(--panel-border-light);background:var(--panel-bg-light);color:var(--cream);transition:filter .08s}.tut-btn:hover{filter:brightness(1.12)}.tut-btn.primary{background:linear-gradient(#57c9b0,#2f9c86);border-color:#8ef0da;color:#06322a}.tut-btn.ghost{background:transparent;color:var(--muted)}.tutorial-highlight{outline:3px solid #8ef0da!important;outline-offset:2px;border-radius:10px;animation:tut-glow 1.4s ease-in-out infinite}@keyframes tut-glow{0%,to{box-shadow:0 0 #8ef0da8c}50%{box-shadow:0 0 18px 5px #8ef0da8c}}.overlay.tutorial-done{background:radial-gradient(ellipse at center,#14342cf0,#08120ef7)}.tut-done-card{background:var(--panel-bg);border:3px solid #2f9c86;border-radius:20px;padding:30px 36px;max-width:540px;text-align:center;box-shadow:0 16px 50px #0009}.tut-done-badge{font-size:56px;margin-bottom:6px}.tut-done-card h1{margin:0 0 12px;font-size:34px;color:var(--gold-bright)}.tut-done-card p{font-size:15px;line-height:1.6;color:var(--cream);margin:0 0 22px}.tut-done-btns{display:flex;flex-direction:column;gap:12px;align-items:center}.tut-done-btns .big-btn{font-size:18px;padding:12px 28px;width:100%}.big-btn.ghost-btn{background:linear-gradient(#3a2e1e,#2a2013);border-color:var(--panel-border-light);color:var(--cream);box-shadow:0 6px #1a140b,0 10px 24px #0006}.big-btn.ghost-btn:active{box-shadow:0 2px #1a140b}