html,body{margin:0;padding:0;width:100%;height:100%;background:#111;color:#fff;font-family:Arial,Helvetica,sans-serif;overflow:hidden}
.wrap{min-height:100%;display:flex;align-items:center;justify-content:center;padding:16px;box-sizing:border-box}
.webgl-content{position:relative;width:960px;max-width:100%;}
#gameContainer{width:960px;height:600px;max-width:100%;background:#222;box-shadow:0 10px 30px rgba(0,0,0,.35)}
.webgl-content .logo,.progress,.text{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%)}
.webgl-content .logo{background:url('y8-logo.png') no-repeat center/contain;width:206px;height:130px}
.webgl-content .progress{height:18px;width:160px;margin-top:80px;background:#000}
.webgl-content .progress .empty{background:#000;float:right;width:100%;height:100%;display:inline-block}
.webgl-content .progress .full{background:#d00;float:left;width:0;height:100%;display:inline-block}
.webgl-content .text{margin-top:110px;color:#fff;font-weight:700;font-size:16px;text-align:center;white-space:nowrap}
.webgl-content .spinner{vertical-align:middle}
.footer{display:flex;align-items:center;justify-content:space-between;height:40px;background:#222;margin:0}
.footer .badges{display:flex;align-items:center;gap:0}
.footer .unity,.footer .webgl{box-sizing:border-box;background-position:10px center;background-repeat:no-repeat;background-size:46px 18px;height:40px;padding:0 10px;width:66px;display:inline-block}
.footer .unity.disable{background-image:url('unity-disable.png')}
.footer .webgl.enable{background-image:url('webgl-enable.png')}
.footer .game-name{padding:0 12px;margin:0;color:#fff;font-size:18px;font-weight:normal;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media (max-width: 980px){.wrap{padding:0}.webgl-content{width:100%}#gameContainer{height:calc(100vw * 0.625)}.footer{display:none}}