.bq-wrap{max-width:780px;margin:0 auto;font-size:16px}
.bq-intro{text-align:center}
.bq-intro .bq-start{margin-top:8px}
.bq-progress{height:8px;background:#f0f0f0;border-radius:999px;overflow:hidden;margin:16px 0}
.bq-bar{display:block;height:8px;transition:width .25s}
.bq-step{border:1px solid #eee;border-radius:12px;padding:16px;margin:8px 0}
.bq-q{font-weight:600;margin-bottom:8px}
.bq-options label{display:block;padding:8px;border-radius:8px;border:1px solid #e7e7e7;margin-bottom:8px;cursor:pointer}
.bq-options input{margin-right:8px}
.bq-nav{display:flex;gap:8px;justify-content:flex-end;margin-top:8px}
.bq-result h3{margin-top:0}
.bq-result .bq-share{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}
.bq-result .bq-share a,.bq-result .bq-share button{border:1px solid #e7e7e7;border-radius:8px;padding:6px 10px}
.bq-result .bq-result-image{max-width:100%;height:auto;border-radius:12px;margin-top:8px;border:1px solid #eee}


/* ---- Simple, tasteful pop-in animation for the result ---- */
@media (prefers-reduced-motion: no-preference) {
  .bq-result.bq-anim-pop { animation: bq-pop-in 480ms cubic-bezier(.2,.7,.2,1) both; }
  .bq-result .bq-result-image { animation: bq-fade 600ms ease-out both; animation-delay: 120ms; }
}
@keyframes bq-pop-in {
  0%   { opacity: 0; transform: translateY(12px) scale(.98); }
  60%  { opacity: 1; transform: translateY(0) scale(1.02); }
  100% { transform: translateY(0) scale(1); }
}
@keyframes bq-fade {
  from { opacity: 0; transform: translateY(6px); }
  to   { opacity: 1; transform: translateY(0); }
}