* {
  box-sizing: border-box;
}

html,
body {
  width: 100%;
  min-height: 100%;
  margin: 0;
  background: #0a0d0e;
  color: #eaf2ef;
  font-family: Arial, "Microsoft YaHei", sans-serif;
}

body {
  display: grid;
  place-items: center;
  padding: 18px;
}

.phone-shell {
  width: min(432px, calc(100vw - 24px), calc((100vh - 36px) * 0.45));
  aspect-ratio: 9 / 20;
  background: #050606;
  border: 1px solid #243133;
  border-radius: 18px;
  box-shadow: 0 18px 60px rgba(0, 0, 0, 0.5);
  overflow: hidden;
}

canvas {
  width: 100%;
  height: 100%;
  display: block;
  touch-action: none;
}