body {
  margin:0;
  font-family: system-ui;
  background:#020617;
  color:white;
  display:flex;
  justify-content:center;
  align-items:center;
  height:100vh;
}

.circle {
  width:320px;
  height:320px;
  border-radius:50%;
  background: radial-gradient(circle,#ffd700,#f59e0b);
  position:relative;
  box-shadow:0 15px 40px rgba(0,0,0,0.7);
  transition: transform 0.3s;
}

.win {
  transform: scale(1.1);
}

.center {
  position:absolute;
  top:50%; left:50%;
  transform:translate(-50%,-50%);
  background:#dc2626;
  color:#22ff00;
  font-size:28px;
  padding:20px;
  border-radius:20px;
}

.op {
  position:absolute;
  width:70px; height:70px;
  border-radius:15px;
  border:none;
  font-size:24px;
}

.top { top:10px; left:50%; transform:translateX(-50%); }
.bottom { bottom:10px; left:50%; transform:translateX(-50%); }
.left { left:10px; top:50%; transform:translateY(-50%); }
.right { right:10px; top:50%; transform:translateY(-50%); }

.num {
  position:absolute;
  width:55px; height:55px;
  background:#1e293b;
  display:flex;
  justify-content:center;
  align-items:center;
  border-radius:12px;
}

.controls button {
  margin:10px;
  padding:15px;
  border-radius:12px;
  border:none;
  font-size:20px;
}