#matchLoading[hidden]{display:none}
#matchLoading{position:fixed;inset:0;z-index:10000;background:#0c1824;display:grid;place-items:center;color:#111;font:13px Arial,sans-serif}
#matchLoading .matchLoadingPanel{position:relative;width:min(800px,96vw);aspect-ratio:800/150;background:url(menu/common/popup/bg_loading.png) center/100% 100% no-repeat;box-shadow:0 15px 65px #000c,0 0 36px #0696df44}
#matchLoadingTitle{position:absolute;left:9.25%;top:5%;font-size:clamp(10px,1.5vw,14px);letter-spacing:.6px;color:#052238}
#matchLoadingProgress{appearance:none;position:absolute;left:2.5%;top:32%;width:89.75%;height:27%;border:0;background:#40bad4;overflow:hidden}
#matchLoadingProgress::-webkit-progress-bar{background:repeating-linear-gradient(90deg,#40bad4 0 7px,#70cee0 7px 9px)}
#matchLoadingProgress::-webkit-progress-value{background:repeating-linear-gradient(90deg,#126278 0 7px,#76d8ee 7px 9px);box-shadow:0 0 14px #76d8eeaa;transition:width .16s ease-out}
#matchLoadingProgress:not([value]){opacity:.7}
#matchLoadingStatus{position:absolute;left:5%;right:5%;top:75%;margin:0;font-size:clamp(9px,1.3vw,12px);font-weight:bold;color:#072438}
#matchLoadingBack{position:absolute;right:2%;top:6%;width:20px;height:20px;padding:0;color:#111;background:#c9ccd0;border:1px solid #777;cursor:pointer}
body.match-loading #canvas,body.match-loading #gameHud,body.match-loading #gameFrontend{visibility:hidden!important}

/* A fresh match URL must not cover the login form required to start the engine. */
body.login-open:has(#gameLogin:not([data-loading="true"])) #matchLoading{display:none}

body.login-open.match-loading > #matchLoading,body.entry-pending.match-loading > #matchLoading{visibility:visible!important}
/* Splash composed from unmodified original LoginGui robots, menu logo, and Loading Shader. */
#matchLoading{background:radial-gradient(ellipse at 50% 35%,#263c53,#101722 70%);overflow:hidden}
#matchLoading .transitionArt{position:absolute;inset:0;pointer-events:none;overflow:hidden}
#matchLoading .loadingShaderCanvas{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.85;mix-blend-mode:screen}
/* Each original robot crop covers half the viewport, preserving image aspect ratio. */
#matchLoading .transitionBot{position:absolute;top:0;bottom:0;width:50%;height:100%;background-image:url(menu/login/bg_login.png);background-repeat:no-repeat;opacity:.82}
#matchLoading .transitionBot.left{left:0;background-size:max(320%,133.3334vh) auto;background-position:left center;mask-image:linear-gradient(to right,#000 60%,transparent)}
#matchLoading .transitionBot.right{right:0;background-size:max(380.9524%,133.3334vh) auto;background-position:right center;mask-image:linear-gradient(to left,#000 60%,transparent)}
#matchLoading .transitionLogo{position:absolute;top:20%;left:50%;width:174px;height:44px;transform:translateX(-50%) scale(2);background:url(menu/common/bg_menu_up.png) -12px -8px / 800px auto no-repeat;filter:drop-shadow(0 5px 10px #000)}
#matchLoading .matchLoadingPanel{margin-top:min(28vh,200px);width:min(640px,94vw)}
@media(max-width:600px){#matchLoading .transitionBot{opacity:.65}#matchLoading .transitionLogo{top:20%;transform:translateX(-50%) scale(1.6)}#matchLoading .matchLoadingPanel{margin-top:18vh}}
