/* Page background (launch + letterbox areas) */
body{
  margin:0; padding:0;
  background:#0b0d12 url('TemplateData/arena-bg.png') center center / cover no-repeat fixed;
  -webkit-text-size-adjust:100%;
}

/* Fill viewport and center the game (footer won't affect centering) */
#unity-container{
  position:fixed; inset:0;
  display:grid; place-items:center;  /* centers the canvas only */
  box-sizing:border-box;
}

/* Canvas: perfectly centered, keep 16:9, avoid 100vw scrollbar bug */
#unity-canvas{
  background:transparent;
  aspect-ratio:16 / 9;
  width:min(100%, calc(100vh * 16 / 9));  /* fit by width unless height limits */
  height:auto;
  max-height:100vh;
  display:block;
  image-rendering:auto;
}

/* Desktop: lock to crisp 1920x1080 when there's room */
@media (min-width:1920px) and (min-height:1080px){
  #unity-canvas{ width:1920px; height:auto; max-height:none; }
}

/* Footer: overlay; keep only fullscreen button visible */
#unity-footer{
  position:absolute; right:12px; bottom:12px; top:auto;
  display:flex; gap:8px; align-items:center;
}

/* Hide Unity logo so it doesn't block your UI */
#unity-logo-title-footer{ display:none !important; }

/* Option: hide entire footer on mobile */
.unity-mobile #unity-footer{ display:none !important; }

/* Loading UI (Unity defaults) */
#unity-loading-bar{ position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); display:none; }
#unity-logo{ width:154px; height:130px; background:url('unity-logo-dark.png') no-repeat center; }
#unity-progress-bar-empty{ width:141px; height:18px; margin-top:10px; margin-left:6.5px; background:url('progress-bar-empty-dark.png') no-repeat center; }
#unity-progress-bar-full{ width:0%; height:18px; margin-top:10px; background:url('progress-bar-full-dark.png') no-repeat center; }
#unity-build-title{ float:right; margin-right:10px; line-height:38px; font-family:arial; font-size:18px; }
#unity-fullscreen-button{ cursor:pointer; float:right; width:38px; height:38px; background:url('fullscreen-button.png') no-repeat center; }
#unity-warning{ position:absolute; left:50%; top:5%; transform:translate(-50%); background:white; padding:10px; display:none; }