body {
  margin: 0;
  padding: 0;
  background: #00000000;
  color: #fff;
  font-family: Arial, sans-serif;
}

.bobr-header {
  background: linear-gradient(90deg, #00000000 60%, #00000000 95%, #00000000 100%);
  padding: 0px 0 0px 0;
  text-align: center;
  border-bottom: 3px solid #f47920;
}

.bobr-coin-logo {
  width: 64px;
  height: 64px;
  margin-bottom: 10px;
  border-radius: 50%;
  box-shadow: 0 2px 16px #ff8c4280;
}

.bobr-gradient {
  background: linear-gradient(90deg, #f47920, #ff8c42 90%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  font-weight: bold;
}

.bobr-subtitle {
  color: #ffa35b;
  font-size: 18px;
  margin: 0 0 10px 0;
}

.bobr-link {
  color: #ffa35b;
  text-decoration: none;
  font-weight: bold;
  margin: 0 10px;
}

.bobr-link:hover { color: #fff; text-shadow: 0 1px 12px #f4792070; }

.wheel-container {
  max-width: 430px;
  margin: 32px auto 18px auto;
  padding: 10px 0;
  background: #00000000;
  border-radius: 100px;
  box-shadow: 0 6px 36px #00000000;
  position: relative;
}

#wheel-canvas {
  display: block;
  margin: 0 auto 20px auto;
  border-radius: 80%;
  background: radial-gradient(circle, #323232 60%, #f47920 110%);
  box-shadow: 0 2px 1px #f4792055;
}

.wheel-btns {
  display: flex;
  justify-content: center;
  margin-bottom: 0px;
}

#winner-announcement {
  font-size: 21px;
  color: #f47920;
  text-align: center;
  font-weight: bold;
  padding: 9px 0;
}

#bobr-confetti {
  pointer-events: none;
  position: fixed;
  left: 0; right: 0; top: 0; bottom: 0;
  z-index: 80;
  width: 100vw; height: 100vh;
  overflow: visible;
  display: none;
}

.bobr-history-block {
  margin: 24px auto 18px auto;
  max-width: 440px;
  background: #232323ef;
  border-radius: 12px;
  padding: 15px 12px 15px 16px;
  box-shadow: 0 2px 16px #ffa35b1c;
}
.bobr-history-block h2 {
  font-size: 20px;
  color: #ffa35b;
  margin: 0 0 6px 0;
}
#history-list {
  list-style: none;
  padding: 0;
  margin: 0;
}
#history-list li {
  border-bottom: 1px solid #ffa35b35;
  padding: 7px 0;
  font-size: 15px;
  color: #eee;
}
#history-list li:last-child { border-bottom: none; }

footer {
  text-align: center;
  padding: 28px 0 18px 0;
  font-size: 15px;
  color: #bbb;
}

/* ——— Responsive ——— */
@media (max-width: 500px) {
  .bobr-header, .bobr-history-block, .wheel-container {
    max-width: 99vw;
    border-radius: 0;
  }
  #wheel-canvas {
    width: 98vw !important;
    height: 98vw !important;
    max-width: 99vw !important;
    max-height: 99vw !important;
  }
  .wheel-container { margin: 10px 0; }
}