/* Shared look for multiplayer maps. Everything sits inside a fixed 1280px #map so every player,
   whatever their window size, gets the same layout and the same blocks. */
* { box-sizing: border-box; }
html { background: #0b0a12; }
body {
  margin: 0;
  font: 16px/1.35 Arial, Helvetica, sans-serif;
  color: #1b1e2b;
  overflow-x: hidden;
}
#map {
  position: relative;
  width: 1280px;
  height: 2400px;
  margin: 0 auto;
  /* The bottom of the page is the pit: touching it kills you. */
  background: linear-gradient(var(--page, #f7f8fa) calc(100% - 120px), #ff5a1f calc(100% - 120px), #8a1c0c 100%);
}
#map > * { position: absolute; margin: 0; }
[data-spawn] { display: block; width: 0; height: 0; }

/* building blocks */
.bar { background: #1b1e2b; color: #f7f8fa; display: flex; align-items: center; gap: 28px; padding: 0 28px; font-weight: 700; }
.bar b { font-size: 26px; letter-spacing: 1px; }
.card { background: #ffffff; border: 3px solid #1b1e2b; padding: 14px 16px; }
.card h3 { margin: 0 0 6px; font-size: 20px; }
.card p { margin: 0; font-size: 15px; color: #444a5c; }
.slab { color: #ffffff; font-weight: 700; display: flex; align-items: center; justify-content: center; text-align: center; }
.big { font-size: 46px; line-height: 1.05; font-weight: 900; }
.copy { font-size: 17px; line-height: 1.5; }
.pic { object-fit: cover; border: 3px solid #1b1e2b; }
.btnish { font: 700 16px Arial, Helvetica, sans-serif; color: #ffffff; background: #f26b1d; border: 0; padding: 10px 18px; }