#skydive-mp-chao-container {
  position: absolute;
  inset: 0;
  z-index: 3;
}

.sd-ring {
  position: absolute;
  width: 28px;
  height: 28px;
  border-radius: 999px;
  box-shadow: 0 0 0 3px rgba(255, 235, 160, 0.75) inset;
  background: rgba(255, 235, 160, 0.10);
}

.sd-haz {
  position: absolute;
  width: 36px;
  height: 36px;
  border-radius: 999px;
  box-shadow: 0 0 0 3px rgba(255, 120, 120, 0.65) inset;
  background: rgba(255, 80, 80, 0.08);
}

.sd-bull {
  position: absolute;
  width: 44px;
  height: 44px;
  border-radius: 999px;
  box-shadow:
    0 0 0 3px rgba(255,255,255,0.40) inset,
    0 0 0 10px rgba(255,255,255,0.10) inset;
  background: rgba(0,0,0,0.10);
}

.sd-chao,
.sd-fallback {
  position: absolute;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: rgba(255,255,255,0.70);
  border: 3px solid rgba(0,0,0,0.35);
  box-shadow: 0 6px 14px rgba(0,0,0,0.35);
  transform: translate(-50%, -50%);
}

/* ============================================================
   BOBSLED RUN (MP)
============================================================ */





.bs-finish {
  position: absolute;
  left: 50%;
  top: 190px;
  width: 600px;
  height: 10px;
  transform: translateX(-50%);
  border-radius: 8px;
  background: repeating-linear-gradient(
    90deg,
    rgba(255,255,255,0.65) 0,
    rgba(255,255,255,0.65) 14px,
    rgba(0,0,0,0.10) 14px,
    rgba(0,0,0,0.10) 28px
  );
  opacity: 0.55;
  pointer-events: none;
}

.bs-sled {
  position: absolute;
  top: 350px;
  width: 64px;
  height: 22px;
  border-radius: 14px;
  transform: translate(-50%, -50%);
  box-shadow: 0 10px 24px rgba(0,0,0,0.45);
  pointer-events: none;
}

.bs-sled-a {
  background: rgba(140, 220, 255, 0.70);
  border: 3px solid rgba(0,0,0,0.28);
}

.bs-sled-b {
  background: rgba(255, 170, 140, 0.70);
  border: 3px solid rgba(0,0,0,0.28);
}

#hotrope-mp-rope {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 560px;
  height: 6px;
  transform: translate(-50%, -50%) rotate(0deg);
  transform-origin: 50% 50%;
  background: linear-gradient(to right, rgba(0,0,0,0), rgba(245,245,245,0.92), rgba(0,0,0,0));
  filter: drop-shadow(0 1px 0 rgba(0,0,0,0.7));
  border-radius: 6px;
  pointer-events: none;
}



.rg-ring {
  position: absolute;
  width: 22px;
  height: 22px;
  transform: translate(-50%, -50%);
  background-image: url("../assets/ui/ui_ring.png");
  background-size: contain;
  background-repeat: no-repeat;
  image-rendering: pixelated;
  filter: drop-shadow(0 1px 0 rgba(0,0,0,0.6));
}

.tmp-floor {
  position: absolute;
  bottom: 12px;
  width: 100%;
  height: 8px;
  background: linear-gradient(#0000, #000c);
}

/* ============================================================
   BIG BLAST (MP)
============================================================ */



.bbg-stage {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 720px;
  height: 360px;
  transform: translate(-50%, -50%);
  border-radius: 26px;
  border: 6px solid rgba(210, 235, 255, 0.18);
  box-shadow:
    0 0 0 2px rgba(0,0,0,0.35) inset,
    0 12px 28px rgba(0,0,0,0.55);
  background:
    radial-gradient(circle at 30% 30%, rgba(255,255,255,0.10), rgba(0,0,0,0.18) 70%),
    linear-gradient(90deg, rgba(0,0,0,0.10), rgba(0,0,0,0.02) 40%, rgba(0,0,0,0.02) 60%, rgba(0,0,0,0.10));
  pointer-events: none;
}



.bbg-barrel {
  background: rgba(28, 40, 56, 0.92);
  border: 2px solid rgba(90, 130, 180, 0.40);
  border-radius: 12px;
  color: #e8f1ff;
  font-size: 22px;
  font-weight: 700;
  cursor: pointer;
  box-shadow: 0 10px 22px rgba(0,0,0,0.38);
}

.bbg-barrel:hover {
  filter: brightness(1.10);
}

.bbg-barrel.is-picked {
  outline: 4px solid rgba(140, 220, 255, 0.55);
}

.bbg-barrel.is-blast {
  outline: 4px solid rgba(255, 170, 140, 0.65);
  filter: brightness(1.15);
}

.bbg-barrel:disabled {
  opacity: 0.60;
  cursor: default;
}

.garden-shadow {
  position: absolute;
  width: 28px;
  height: 8px;
  background: radial-gradient(ellipse at center,
      rgba(0,0,0,0.32) 0%,
      rgba(0,0,0,0.12) 56%,
      rgba(0,0,0,0) 78%);
  pointer-events: none;
  z-index: 0;
  bottom: 3px;
  left: 50%;
  transform: translateX(-50%);
}

/* ============================================================
   MULTIPLAYER CHAT PANEL
============================================================ */

.mpchat-header {
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:10px 14px;
  background:#0d1c2b;
  border-bottom:2px solid #2a3d57;
}

.mpchat-title {
  font-size:20px;
  font-weight:bold;
  color:#fff;
}

.mpchat-close {
  width:30px;
  height:30px;
  background:#2b3e55;
  border:1px solid #3e587b;
  color:#eee;
  font-size:18px;
  border-radius:6px;
  cursor:pointer;
}

.mpchat-log {
  flex-grow:1;
  overflow-y:auto;
  padding:12px;
  background:#10202e;
  display:flex;
  flex-direction:column;
  gap:6px;
}

.mpchat-row {
  padding:6px 8px;
  background:#1a2d3e;
  border-radius:6px;
  border:1px solid #2f4560;
}

.mpchat-author {
  font-size:13px;
  font-weight:bold;
}

.mpchat-content {
  font-size:14px;
  margin-top:2px;
}

.mpchat-time {
  font-size:10px;
  opacity:0.6;
  margin-top:4px;
}

.mpchat-input-row {
  display:flex;
  gap:8px;
  padding:10px;
  background:#0d1c2b;
}

.mpchat-input {
  flex-grow:1;
  padding:8px;
  background:#0e1a29;
  border:1px solid #39526d;
  border-radius:6px;
  color:#fff;
}

.mpchat-send {
  padding:8px 12px;
  background:#3d79ff;
  border:1px solid #2c62dd;
  border-radius:6px;
  cursor:pointer;
  color:#fff;
  font-size:15px;
}