:root{color-scheme:light;box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}html{scroll-padding-top:env(safe-area-inset-top,0px)}body{margin:0;padding:0;font:14px -apple-system,BlinkMacSystemFont,sans-serif;background:#fff;color:#000}img{max-width:100%}[hidden]:not([hidden=until-found i]){display:none!important}


:root{color-scheme:dark;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
*{box-sizing:border-box;user-select:none;margin:0;padding:0}
html,body{height:100%}
body{background:#05080b;color:#7cf5c0;font:13px 'Courier New',monospace;overflow:hidden;display:flex;flex-direction:column}
#top{height:34px;background:linear-gradient(#1b2a30,#0e171b);border-bottom:2px solid #36535c;display:flex;align-items:center;gap:24px;padding:0 14px;font-weight:bold;white-space:nowrap;overflow:hidden}
#top .m{color:#5ff}#top .g{color:#7f7}#top .s{color:#fc4}#top .w{color:#f66;margin-left:auto}#top .h{color:#789;font-weight:normal}
#gc{flex:1;position:relative;min-height:0}
#cv{position:absolute;inset:0;cursor:crosshair}
#bot{height:164px;background:linear-gradient(#0f1a1f,#080d10);border-top:2px solid #36535c;display:flex;gap:8px;padding:6px}
#mm{border:2px solid #36535c;background:#000;width:192px;height:128px;align-self:center;cursor:pointer}
#sel{width:240px;border:1px solid #28424a;background:#071014;padding:8px;line-height:1.5;overflow:auto;color:#cfe}
#card{flex:1;display:flex;flex-wrap:wrap;gap:6px;align-content:flex-start;overflow:auto}
.b{background:#13262c;color:#7cf5c0;border:1px solid #2f8a78;padding:6px 8px;font:inherit;text-align:left;cursor:pointer;min-width:132px;height:50px}
.b:hover{background:#7cf5c0;color:#06100f}.b small{display:block;color:#5cd;margin-top:2px}.b:hover small{color:#06100f}
.b.x{opacity:.35}
#ov{position:absolute;inset:0;background:rgba(2,6,8,.86);display:flex;align-items:center;justify-content:center;flex-direction:column;z-index:5;text-align:center;padding:20px;gap:14px}
#ov h1{font-size:38px;letter-spacing:2px}#ov p{max-width:560px;color:#9bb;line-height:1.5}
#ov button{padding:12px 26px;font:bold 17px inherit;font-family:inherit;background:#7cf5c0;border:0;cursor:pointer}
.row{display:flex;gap:12px;flex-wrap:wrap;justify-content:center}.c{width:236px;padding:10px 12px;border:1px solid #2f8a78;border-radius:8px;background:#0f1d22;cursor:pointer;color:#dfe;font-size:12px;text-shadow:0 1px 2px #000;line-height:1.4}.c.on{border-color:#7cf5c0;box-shadow:0 0 14px #7cf5c0}#ov h3{color:#5cd;letter-spacing:3px;font-size:12px}#ov{overflow:auto}#ov h1{font-size:30px}#ov button{border-radius:8px}.b,#sel{border-radius:6px}
#ov{background:radial-gradient(ellipse at 50% 15%,rgba(13,47,66,.94),rgba(2,5,9,.97));justify-content:flex-start;box-shadow:inset 0 0 140px #000}#sf{position:absolute;inset:0;pointer-events:none;z-index:-1}
#lg{margin-top:auto;text-align:center}#ov button{margin-bottom:auto}
.lt{font:900 clamp(26px,6.2vw,80px)/1 Impact,'Arial Black',sans-serif;letter-spacing:.14em;padding-left:.14em;background:linear-gradient(180deg,#f4fbff 0,#9fd8ff 38%,#2f7bc4 52%,#b8e6ff 58%,#3a6f9a 100%);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 0 14px rgba(70,170,255,.65)) drop-shadow(0 3px 0 #06121c);position:relative}
.lt::after{content:attr(data-t);position:absolute;inset:0;padding-left:.14em;background:linear-gradient(105deg,transparent 42%,rgba(255,255,255,.95) 50%,transparent 58%) 0 0/250% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:shn 4.5s ease-in-out infinite}
@keyframes shn{0%{background-position:150% 0}55%,100%{background-position:-60% 0}}
#lgs,#in2{letter-spacing:.5em;padding-left:.5em;font-weight:bold;color:#7cf5c0;font-size:clamp(11px,2vw,17px);margin-top:4px;text-shadow:0 0 12px #7cf5c0}
#ov #ot{font-size:clamp(15px,2.6vw,24px);letter-spacing:.3em;font-weight:normal;color:#cfe;text-shadow:0 0 10px rgba(124,245,192,.4)}
#ov h3{display:flex;align-items:center;gap:12px;width:min(560px,92%)}#ov h3::before,#ov h3::after{content:'';flex:1;height:1px;background:linear-gradient(90deg,transparent,#2f8a78)}#ov h3::after{transform:scaleX(-1)}
.c{background:linear-gradient(160deg,rgba(20,44,52,.9),rgba(8,18,22,.9));transition:transform .15s,box-shadow .15s,border-color .15s}.c:hover{transform:translateY(-3px);border-color:#7cf5c0}.c.on{box-shadow:0 0 18px #7cf5c0,inset 0 0 14px rgba(124,245,192,.25)}.c.on b::before{content:'\25C6 ';color:#7cf5c0}
#ov button{background:linear-gradient(#a6ffdc,#3fcf9a);color:#04140e;letter-spacing:4px;text-transform:uppercase;box-shadow:0 0 22px rgba(124,245,192,.5);animation:pls 2s ease-in-out infinite;transition:transform .15s}#ov button:hover{transform:scale(1.06)}@keyframes pls{50%{box-shadow:0 0 38px rgba(124,245,192,.95)}}
#intro{position:absolute;inset:0;z-index:9;background:radial-gradient(ellipse at center,#06141f 0,#000 70%);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;cursor:pointer;animation:inf .9s ease 4s forwards}
#intro::before{content:'';position:absolute;left:0;right:0;top:50%;height:3px;background:linear-gradient(90deg,transparent,#5cf,#fff,#5cf,transparent);box-shadow:0 0 30px 8px #3af;animation:flr 1.8s ease-out .1s both}
#in1{animation:inl 2s cubic-bezier(.15,.8,.2,1) .8s both}#in2{animation:inb 2s ease 1.9s both}#in3{position:absolute;bottom:22px;color:#567;font-size:11px;letter-spacing:3px;animation:blk 1.4s ease-in-out infinite}
@keyframes flr{0%{transform:scaleX(0);opacity:1}55%{transform:scaleX(1);opacity:1}100%{transform:scaleX(1);opacity:0}}
@keyframes inl{0%{opacity:0;transform:scale(2.6);filter:blur(20px) brightness(3)}100%{opacity:1;transform:none}}
@keyframes inb{0%{opacity:0;letter-spacing:1.6em}100%{opacity:1;letter-spacing:.5em}}
@keyframes inf{to{opacity:0;visibility:hidden}}@keyframes blk{50%{opacity:.25}}#hp{position:absolute;inset:0;z-index:6;background:rgba(2,6,8,.92);overflow:auto;padding:18px;display:flex;justify-content:center;align-items:flex-start;cursor:pointer}
#hp[hidden]{display:none}
#hp .in{max-width:780px;width:100%;color:#cfe;line-height:1.55}
#hp h2{color:#7cf5c0;letter-spacing:.3em;font-size:16px;margin-bottom:6px}
#hp h4{color:#5cd;letter-spacing:.2em;font-size:11px;margin:14px 0 4px}
#hp .g{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:0 24px}
#hp b{color:#ffd24a}#hp p{margin-top:16px;color:#789}



:root{--c:#3ee0ff;--ln:#1d4766}
html,body{font-family:Rajdhani,'Segoe UI',system-ui,sans-serif}body{background:#02050a;color:#cfe9ff;font-size:15px}
#top{position:absolute;top:0;left:0;right:0;height:0;z-index:4;padding:0;border:0;background:none;box-shadow:none;overflow:visible;pointer-events:none;display:block}#top>div{pointer-events:auto;position:absolute;top:10px;display:flex;align-items:center;gap:8px}
#top .mn{left:12px}#top .res{right:12px;gap:0;background:linear-gradient(180deg,rgba(16,36,60,.9),rgba(4,10,20,.92));border:1px solid var(--ln);border-top-color:#3a86b8;border-radius:3px;box-shadow:0 0 16px rgba(62,224,255,.22),inset 0 0 12px rgba(0,0,0,.6)}
#top .ri{display:flex;align-items:center;gap:9px;padding:7px 16px;min-width:104px;border-left:1px solid rgba(62,224,255,.16)}#top .ri:first-child{border:0}#top .ri i{width:18px;height:18px;flex:none;filter:drop-shadow(0 0 5px currentColor)}
#top .rm i{color:#3ee0ff;background:linear-gradient(135deg,#d6faff,#2aa8ff);clip-path:polygon(50% 0,100% 38%,76% 100%,24% 100%,0 38%)}#top .rg i{color:#4dff88;background:radial-gradient(circle at 35% 30%,#e0ffd8,#2fd05a);clip-path:polygon(25% 5%,75% 5%,100% 50%,75% 95%,25% 95%,0 50%)}#top .rs i{color:#ffc233;background:linear-gradient(#fff0b8,#e0a020);clip-path:polygon(0 100%,0 42%,50% 0,100% 42%,100% 100%)}
#top .ri b{min-width:0;text-align:left;font:700 19px Orbitron,Rajdhani,sans-serif;color:#fff;text-shadow:0 0 8px currentColor}#top .rm b{color:#9ff0ff}#top .rg b{color:#9dffb8}#top .rs b{color:#ffe08a}
#top #w,#zmenu{font:600 14px Rajdhani,sans-serif;letter-spacing:2px;color:#9fe6ff;background:linear-gradient(180deg,rgba(16,36,60,.9),rgba(4,10,20,.92));border:1px solid var(--ln);border-radius:3px;padding:8px 14px;margin:0;box-shadow:0 0 12px rgba(62,224,255,.15)}#zmenu{cursor:pointer}#zmenu:hover{border-color:var(--c);color:#fff;box-shadow:0 0 14px rgba(62,224,255,.5)}
#bot{position:relative;height:204px;padding:0;gap:0;display:grid;grid-template-columns:236px 1fr 372px;background:linear-gradient(180deg,#10243b 0,#08131f 24%,#050b14 100%);border:0;border-top:2px solid #2a6a9a;box-shadow:none;clip-path:polygon(0 16px,30px 0,calc(100% - 30px) 0,100% 16px,100% 100%,0 100%)}
#bot::before{content:'';position:absolute;inset:0;pointer-events:none;z-index:3;background:repeating-linear-gradient(0deg,rgba(255,255,255,.018) 0 1px,transparent 1px 3px)}#bot::after{content:'';position:absolute;top:0;left:30px;right:30px;height:2px;background:linear-gradient(90deg,transparent,#3ee0ff,transparent);box-shadow:0 0 14px #3ee0ff;pointer-events:none}
#mmw{position:relative;display:flex;align-items:center;justify-content:center;padding:14px 10px 18px;border-right:1px solid #17384f;background:radial-gradient(circle at 50% 40%,#0c2238,#050b14)}#mmw::after{content:'SECTOR KORHAL';position:absolute;bottom:3px;left:0;right:0;text-align:center;font:600 9px Orbitron,sans-serif;letter-spacing:4px;color:#3a7aa8}
#mm{width:192px;height:128px;align-self:auto;border:2px solid #2a6a9a;border-radius:3px;box-shadow:0 0 0 3px #08121f,0 0 0 4px #1d4766,0 0 20px rgba(62,224,255,.35),inset 0 0 14px #000}
#sel{width:auto;min-width:0;border:0;border-radius:0;box-shadow:none;padding:14px 18px;gap:12px;background:linear-gradient(180deg,rgba(24,52,84,.35),rgba(5,12,22,0));color:#cfe9ff;overflow:visible}
#sel .zn{color:#6aa8cc;letter-spacing:2px}#sel .zn b{color:#9fe6ff;font:600 15px Orbitron,sans-serif}#sel small{color:#4a86aa}
.pw{flex:none}.pt{width:104px;height:104px;border:2px solid #2a6a9a;background:#030a12;box-shadow:inset 0 0 18px #000,0 0 16px rgba(62,224,255,.28);clip-path:polygon(12px 0,100% 0,100% calc(100% - 12px),calc(100% - 12px) 100%,0 100%,0 12px)}.pt canvas{width:100%;height:100%;display:block;image-rendering:auto}
.zi{flex:1;min-width:0;font-size:14px}.zi .nm{font:700 19px Orbitron,sans-serif;color:#fff;letter-spacing:2px;text-shadow:0 0 10px rgba(62,224,255,.6);margin-bottom:6px}.zi .nm small{font:600 11px Rajdhani;color:#ffc233;letter-spacing:2px}
.hp{position:relative;height:18px;background:#031018;border:1px solid #1d4766;clip-path:polygon(7px 0,100% 0,calc(100% - 7px) 100%,0 100%)}.hp i{position:absolute;left:0;top:0;bottom:0;box-shadow:inset 0 -5px 0 rgba(0,0,0,.28)}.hp span{position:relative;display:block;text-align:center;font:700 11px Orbitron,sans-serif;line-height:17px;color:#fff;text-shadow:0 1px 2px #000}
.st{display:flex;gap:14px;margin:8px 0 4px}.st span{color:#fff;font-weight:700}.st em{font-style:normal;color:#4a9acb;font-size:11px;letter-spacing:2px;margin-right:4px}.chip{display:inline-block;margin:2px 6px 0 0;padding:1px 8px;font-size:11px;letter-spacing:2px;font-weight:700;color:#04121c;background:#ffc233;clip-path:polygon(5px 0,100% 0,calc(100% - 5px) 100%,0 100%)}
.zg{display:grid;grid-template-columns:repeat(8,44px);gap:5px;flex-basis:100%}.ui{width:44px;border:1px solid #1d4766;background:#06121d;cursor:pointer;position:relative}.ui:hover{border-color:var(--c);box-shadow:0 0 10px rgba(62,224,255,.5)}.ui canvas{width:42px;height:42px;display:block}.mh{height:4px;background:#1a0606}.mh i{display:block;height:100%}
.zc{flex-basis:100%;color:#8cc4e0;font-size:13px;letter-spacing:1px}.zc b{color:#fff;font:700 15px Orbitron,sans-serif}.zq{display:flex;gap:4px;margin-top:6px}.zq span{position:relative;width:38px;height:24px;background:#06121d;border:1px solid #2a6a9a;font-size:10px;line-height:22px;text-align:center;overflow:hidden;color:#9fe6ff}.zq i{position:absolute;left:0;bottom:0;height:3px;background:var(--c);box-shadow:0 0 6px var(--c)}
#card{padding:14px 18px;display:grid;grid-template-columns:repeat(5,64px);grid-auto-rows:64px;gap:5px;align-content:start;justify-content:end;overflow:visible;border-left:1px solid #17384f;background:radial-gradient(circle at 70% 30%,rgba(24,60,96,.25),transparent 70%)}
.b{width:64px;height:64px;min-width:0;padding:0;border:1px solid #2a6a9a;border-radius:3px;background:linear-gradient(160deg,#17355a,#091628);color:#cfe9ff;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;box-shadow:inset 0 0 0 1px rgba(120,220,255,.08),0 2px 6px #000;transition:transform .08s,box-shadow .12s,border-color .12s}
.b .ic{font-style:normal;font-size:24px;line-height:26px;color:#5fe3ff;text-shadow:0 0 10px rgba(62,224,255,.8)}.b .lb{font-size:10px;line-height:11px;max-width:58px;max-height:22px;overflow:hidden;color:#a9d6ee;margin-top:2px;letter-spacing:.5px}
.b .hk{position:absolute;top:2px;right:3px;font:700 10px Orbitron,sans-serif;color:#ffc233;background:none;border:0;padding:0;margin:0}
.b:hover{border-color:var(--c);color:#fff;background:linear-gradient(160deg,#235486,#0e2442);box-shadow:0 0 16px rgba(62,224,255,.55),inset 0 0 12px rgba(62,224,255,.2)}.b:hover .ic{color:#fff}.b:active{transform:translateY(1px) scale(.97)}.b.x{opacity:.38;filter:grayscale(.85)}
#tip{position:fixed;display:none;z-index:50;pointer-events:none;min-width:150px;max-width:260px;padding:9px 13px;background:linear-gradient(180deg,rgba(14,34,58,.97),rgba(4,10,20,.98));border:1px solid #3a86b8;box-shadow:0 0 20px rgba(62,224,255,.3);font-size:13px;color:#cfe9ff}#tip b{font:700 14px Orbitron,sans-serif;color:#fff;letter-spacing:1px}#tip span{float:right;margin-left:12px;color:#ffc233;font:700 12px Orbitron,sans-serif}#tip div{margin-top:5px;color:#7fe6ff}
#qb{position:absolute;left:14px;bottom:16px;z-index:2;display:flex;gap:8px}#qb button{display:flex;align-items:center;gap:8px;padding:7px 12px;font:700 13px Rajdhani,sans-serif;letter-spacing:2px;color:#9fe6ff;background:linear-gradient(180deg,rgba(16,36,60,.92),rgba(4,10,20,.94));border:1px solid var(--ln);border-radius:3px;cursor:pointer}#qb i{font-style:normal;font-size:16px;color:#5fe3ff}#qb button:hover{border-color:var(--c);color:#fff;box-shadow:0 0 14px rgba(62,224,255,.5)}#qb button.on{border-color:#ffc233;color:#ffe08a;animation:qpl 1.2s ease-in-out infinite}@keyframes qpl{50%{box-shadow:0 0 16px rgba(255,194,51,.7)}}
#ov{font-family:Rajdhani,sans-serif;background:radial-gradient(ellipse at 50% 0,rgba(24,70,120,.55),rgba(3,8,16,.97) 70%)}.lt{font-family:Orbitron,Impact,sans-serif;font-weight:900}#ov #ot{font:600 16px Orbitron,sans-serif;letter-spacing:.4em;color:#9fe6ff}#ov p{font-size:16px;color:#8cc4e0}#ov h3{font:600 12px Orbitron,sans-serif;letter-spacing:.35em;color:#4a9acb}
#ov .c{width:250px;border:0;border-left:3px solid #1d4766;border-radius:0;font-size:14px;background:linear-gradient(160deg,rgba(26,60,96,.75),rgba(8,18,32,.85));clip-path:polygon(12px 0,100% 0,100% calc(100% - 12px),calc(100% - 12px) 100%,0 100%,0 12px)}#ov .c:hover{transform:translateY(-3px);background:linear-gradient(160deg,rgba(36,90,140,.85),rgba(10,30,52,.9))}#ov .c.on{border-left-color:#3ee0ff;background:linear-gradient(160deg,rgba(42,128,190,.9),rgba(10,40,72,.92));box-shadow:none}
#ov button{font:700 17px Orbitron,sans-serif;letter-spacing:6px;color:#021018;background:linear-gradient(180deg,#5fe9ff,#1b8cff);border-radius:3px;padding:16px 60px;box-shadow:0 0 26px rgba(62,224,255,.6),inset 0 1px 0 rgba(255,255,255,.6);animation:none}#ov button:hover{filter:brightness(1.15);transform:scale(1.04)}

/* v14: keep the tactical command card inside the fixed HUD height. */
#bot{overflow:hidden;min-height:204px;max-height:204px;flex:none}
#sel{min-height:0;overflow:hidden}
#card{grid-template-columns:repeat(5,53px);grid-auto-rows:53px;gap:4px;padding:8px 12px;min-width:0;min-height:0;overflow:hidden;align-content:start}
.b{width:53px;height:53px;min-width:0}
.b .ic{font-size:19px;line-height:21px}
.b .lb{font-size:9px;line-height:10px;max-width:52px;max-height:20px}
.b .hk{font-size:9px}
#mmw{min-height:0;overflow:hidden}

/* v15: ensure cinematic result titles never wrap into oversized rows */
#ov.result-v15 #ot,body.result-victory #ot,body.result-defeat #ot{font-size:clamp(17px,2.2vw,30px)!important;letter-spacing:.09em!important;line-height:1.24!important;max-width:min(96vw,880px);text-wrap:balance;overflow-wrap:normal;}

/* v19: unobtrusive home-only creator credit */
#ov #korhalCredits{position:absolute;bottom:16px;left:50%;transform:translateX(-50%);width:max-content;max-width:90%;font:600 11px Rajdhani,'Segoe UI',sans-serif;letter-spacing:.17em;color:#87b4cb;text-shadow:0 1px 8px rgba(4,22,37,.7);opacity:.86;pointer-events:none}
#ov #korhalCredits[hidden]{display:none}
@media(max-height:660px){#ov #korhalCredits{position:relative;bottom:auto;left:auto;transform:none;margin:8px auto 0}}

/* v21: menus and mission briefings must not reveal the abandoned battlefield.
   Results deliberately retain the canvas for their cinematic camera movement. */
body.outside-match:not(.result-victory):not(.result-defeat) #cv{visibility:hidden!important}

/* v26: legacy command-tip copy must not bleed out behind the campaign Objectives HUD. */
body:has(#missionHud:not([hidden])) #tut{display:none!important}


/* v27: no wave countdown in Terran-versus-Terran multiplayer. */
body.net-1v1 #w{display:none!important}