/* === VeriQuiz Styles === */
.veriquiz-wrapper{
  font-family: system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;
  display:flex;
  justify-content:center;
  align-items:center;
  padding:1rem;
}

/* Card */
.vq-card{
  background:#ffffff;
  max-width:600px;
  width:100%;
  border-radius:12px;
  box-shadow:0 10px 25px rgba(0,0,0,0.1);
  padding:24px;
  margin:auto;
  animation:fadeIn 0.4s ease;
}

.vq-center{text-align:center;}

.vq-title{
  font-size:2rem;
  font-weight:700;
  margin-bottom:0.5rem;
}
.vq-subtitle{
  font-size:1.1rem;
  font-weight:600;
  margin-bottom:0.25rem;
}
.vq-text{
  font-size:0.95rem;
  color:#555;
  margin-bottom:1.2rem;
}

/* Buttons */
.vq-btn{
  display:inline-block;
  background:#0078d4;
  color:#fff;
  padding:12px 24px;
  border:none;
  border-radius:8px;
  font-size:1rem;
  font-weight:600;
  cursor:pointer;
  width:100%;
}
.vq-btn:hover{opacity:0.9;}
.vq-next{margin-top:1rem;}

/* Progress */
.vq-progress-wrap{
  background:#e5e7eb;
  height:10px;
  border-radius:6px;
  margin-bottom:1rem;
}
.vq-progress-bar{
  height:100%;
  border-radius:6px 0 0 6px;
  transition:width 0.3s ease;
}

/* Options */
.vq-option{
  width:100%;
  text-align:left;
  padding:12px;
  border:2px solid transparent;
  border-radius:8px;
  margin-bottom:0.75rem;
  background:#f9fafb;
  cursor:pointer;
  display:flex;
  justify-content:space-between;
  align-items:center;
}
.vq-option:hover{background:#f3f4f6;}
.vq-disabled{opacity:0.6; cursor:default;}
.vq-correct{background:#d1fae5;border-color:#34d399;color:#065f46;}
.vq-incorrect{background:#fee2e2;border-color:#ef4444;color:#991b1b;}

/* Explanation */
.vq-expl{
  background:#f3f4f6;
  border-radius:8px;
  padding:1rem;
  margin-top:1rem;
  font-size:0.95rem;
}
.vq-expl h4{font-weight:700;margin-bottom:0.5rem;}

/* Percentage */
.vq-percentage{
  font-size:3rem;
  font-weight:700;
  background:linear-gradient(90deg,#7b2ff7,#f107a3);
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  margin:0.5rem 0 1rem 0;
}

@keyframes fadeIn{
  from{opacity:0;transform:translateY(10px);}to{opacity:1;transform:translateY(0)}
}