.zodiac-quiz-wrapper {
  max-width: 760px;
  margin: 18px auto;
  padding: 20px;
  background: linear-gradient(135deg, #a1c4fd 0%, #c2e9fb 100%);
  border-radius: 14px;
  box-shadow: 0 8px 24px rgba(10,10,20,0.08);
  font-family: Arial, sans-serif;
  color: #222;
}
.zodiac-card {
  background: #ffffff;
  border-radius: 12px;
  padding: 18px;
  margin-bottom: 18px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.06);
}
.zodiac-title { text-align:center; margin:0 0 10px 0; font-size:20px; }
.ad-label { font-size:12px; color:#7a7a7a; margin-bottom:6px; }
.zodiac-options { display:flex; flex-wrap:wrap; gap:10px; justify-content:center; }
.zodiac-btn, .zodiac-number-btn {
  background: #6c63ff;
  color: #fff;
  padding: 12px 16px;
  border-radius: 10px;
  text-decoration:none;
  display:inline-block;
  border:none;
  cursor:pointer;
  font-size:15px;
  min-width:120px;
  text-align:center;
}
.zodiac-btn:hover, .zodiac-number-btn:hover { background:#574bff; }
.zodiac-select, .zodiac-input { width:100%; padding:10px; border-radius:8px; border:1px solid #e6e6e6; font-size:15px; }
.result-sign { font-size:22px; font-weight:600; text-align:center; margin-bottom:8px; }
.result-number { font-size:18px; text-align:center; margin-bottom:12px; color:#333; }
.prediction-block { line-height:1.6; color:#333; }
.small-note { font-size:13px; color:#666; margin-top:12px; text-align:center; }

/* Responsive */
@media(max-width:600px) {
  .zodiac-quiz-wrapper { padding:14px; margin:10px; border-radius:10px; }
  .zodiac-btn, .zodiac-number-btn { min-width:100%; font-size:16px; padding:12px; }
  .zodiac-card { padding:14px; }
  .zodiac-title { font-size:18px; }
}