#canvasDiv {
  position: relative;
  display: inline-block !important;
  border: 0;
  margin: 12px 0;
}
body:has(#canvasDiv) { min-height: 0; }

/* mobile: don't let play gestures scroll/pull-to-refresh the page */
body {
  overscroll-behavior: none;
}
#canvasDiv, #virtual-gamepad {
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  user-select: none;
}
body.mobile-active #canvasDiv {
  touch-action: none;
  margin: 0;
}

/* 4:3 — !important 없이(모바일 규칙이 이겨야 함) */
canvas { width: 640px; height: 480px; }

/* 기본 규칙의 !important를 이기려면 여기도 !important */
#canvasDiv:fullscreen,
#canvasDiv:-webkit-full-screen {
  position: fixed; inset: 0; margin: 0; width: 100vw; height: 100vh;
  display: flex !important; align-items: center; justify-content: center; background: rgba(0, 0, 0, 1);
}
#canvasDiv:fullscreen canvas,
#canvasDiv:-webkit-full-screen canvas {
  width: min(100vw, 133.33vh);
  height: min(100vh, 75vw);
  image-rendering: pixelated;
}
#canvasDiv:fullscreen #toast,
#canvasDiv:-webkit-full-screen #toast {
  font-size: 2.4vmin; padding: 1.2vmin 2.4vmin; border-radius: 0.6vmin; bottom: 2.4vmin;
}
@media (max-width: 680px) {
  canvas { width: 100vw; height: calc(100vw * .75); }
  #canvasDiv { width: 100vw; }
}

#boot-cover {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  image-rendering: pixelated;
}
#boot-cover[hidden] { display: none; }

#boot-blink {
  position: absolute;
  left: 40%;
  top: 28.3333%;
  width: 16.25%;
  height: 18.3333%;
  image-rendering: pixelated;
}
#boot-blink[hidden] { display: none; }

#overlay #btn-start {
  position: relative;
  background: none;
  border: 0;
  padding: 0;
  width: 50%;
  max-width: 320px;
  cursor: pointer;
  transition: transform 0.15s, opacity 0.15s;
}
#overlay #btn-start:hover { background: none; }
#overlay #btn-start img { display: block; width: 100%; height: auto; image-rendering: pixelated; }
#overlay #btn-start:disabled { opacity: 0.5; cursor: default; }
#overlay #btn-start:not(:disabled):hover { transform: scale(1.04); }

#overlay #btn-start .btn-start-label {
  position: absolute;
  left: 50%;
  bottom: 7%;
  transform: translateX(-50%);
  white-space: nowrap;
  pointer-events: none;

  text-shadow: 1px 0 0 #000, -1px 0 0 #000, 0 1px 0 #000, 0 -1px 0 #000;
}

@media (orientation: landscape) and (pointer: coarse) {
  canvas { width: min(100vw, calc(100vh * 4 / 3)); height: min(100vh, calc(100vw * 3 / 4)); }
  #canvasDiv { width: auto; }

  .top-bar, .disk-panel { width: min(100vw, calc(100vh * 4 / 3)); }

  canvas { width: min(100vw, calc(100dvh * 4 / 3)); height: min(100dvh, calc(100vw * 3 / 4)); }
  .top-bar, .disk-panel { width: min(100vw, calc(100dvh * 4 / 3)); }
}

#maindiv, #divInstructions {
  display: none !important;
}

#virtual-gamepad .gamepad-buttons button.gamepad-btn-round {
  border-radius: 50%;
}