html, body {
  margin: 0;
  padding: 0;
  width: 100%;
  height: 100%;
  width: 100dvw;
  height: 100dvh;
  overflow: hidden;
  background: #0c0a08;
  color: #f3e6c9;
  font-family: "Press Start 2P", ui-monospace, monospace;
}
#game-root, main {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  background: #0c0a08;
}
canvas {
  image-rendering: auto;
  display: block;
}
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0;
}
.tvm-splash {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  background-color: #0c0a08;
  background-image: url(/game/bg/paper-camp-lq.jpg?v=lq1);
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  color: #f3e6c9;
  font-family: "Press Start 2P", ui-monospace, monospace;
  text-align: center;
}
.tvm-splash::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(12, 14, 22, 0.35);
  pointer-events: none;
}
.tvm-splash > * { position: relative; }
.tvm-splash-kicker {
  letter-spacing: 0.12em;
  font-size: clamp(10px, 2.2vmin, 18px);
  text-shadow: 0 2px 0 #1c1710;
}
.tvm-splash-title {
  margin-top: 8px;
  letter-spacing: 0.14em;
  color: #c4a35a;
  font-size: clamp(18px, 4.2vmin, 36px);
  text-shadow: 0 2px 0 #1c1710;
}
.tvm-splash-sub {
  margin-top: 28px;
  letter-spacing: 0.2em;
  font-size: clamp(8px, 1.6vmin, 12px);
}
.tvm-splash-bar {
  width: min(168px, 42vw);
  height: 10px;
  margin-top: 18px;
  background: #1c1710;
  border: 2px solid #6b4216;
  overflow: hidden;
  box-shadow: 3px 3px 0 rgba(28, 23, 16, 0.45);
}
.tvm-splash-bar > i {
  display: block;
  height: 100%;
  width: 36%;
  background: #c9a36a;
  animation: tvm-load 1.15s ease-in-out infinite;
}
@keyframes tvm-load {
  0% { transform: translateX(-120%); }
  100% { transform: translateX(380%); }
}
