/* theme/assets/css/quiz.css — scoped to .bmh-quiz-* ; loaded only on quiz-bearing pages */
.bmh-quiz { max-width: 600px; margin: 0 auto; border: 1px solid #e5e7eb; border-radius: 14px; padding: 1.75rem; background: #fff; box-shadow: 0 1px 3px rgba(15,23,42,.06); }
.bmh-quiz * { box-sizing: border-box; }
.bmh-quiz-progress { font-size: .75rem; font-weight: 600; letter-spacing: .03em; text-transform: uppercase; color: #0d9488; margin: 0 0 .6rem; }
.bmh-quiz-fallback { font-size: .9rem; margin: .5rem 0 0; } /* shown only when JS is off/failed */
.bmh-quiz-step:focus, .bmh-quiz-result:focus { outline: none; }
.bmh-quiz-q { font-size: 1.3rem; font-weight: 700; color: #0f172a; margin: 0 0 1.1rem; line-height: 1.3; }

/* Question options */
.bmh-quiz-options { display: grid; gap: .55rem; }
.bmh-quiz-opt { display: block; width: 100%; text-align: left; padding: .85rem 1rem; border: 1px solid #d1d5db; border-radius: 10px; background: #f9fafb; cursor: pointer; font: inherit; color: #0f172a; transition: border-color .12s, background .12s; }
.bmh-quiz-opt:hover, .bmh-quiz-opt:focus { border-color: #0d9488; background: #f0fdfa; outline: none; }

/* Result list — uniform, symmetric rows */
.bmh-quiz-matches { list-style: none; margin: 0 0 .25rem; padding: 0; }
.bmh-quiz-match { display: grid; grid-template-columns: 1.25rem 44px 1fr 118px; align-items: center; column-gap: .85rem; padding: .9rem 0; border-bottom: 1px solid #f1f5f9; }
.bmh-quiz-match:last-child { border-bottom: none; }
.bmh-quiz-match.is-top { background: linear-gradient(90deg,#f0fdfa 0%,transparent 70%); margin: 0 -.5rem; padding-left: .5rem; padding-right: .5rem; border-radius: 10px; }
.bmh-quiz-rank { text-align: center; font-weight: 800; font-size: 1rem; color: #0d9488; }
.bmh-quiz-avatar { width: 44px; height: 44px; border-radius: 9999px; background: #f0fdfa; display: flex; align-items: center; justify-content: center; overflow: hidden; }
.bmh-quiz-logo { width: 44px; height: 44px; object-fit: contain; }
.bmh-quiz-monogram { font-weight: 700; font-size: 1.2rem; line-height: 1; color: #0d9488; }
.bmh-quiz-match-body { min-width: 0; display: flex; flex-direction: column; gap: .15rem; }
.bmh-quiz-match-body strong { font-size: 1rem; color: #0f172a; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bmh-quiz-why { font-size: .8rem; color: #64748b; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bmh-quiz-cta { width: 118px; text-align: center; background: #0d9488; color: #fff; padding: .6rem 0; border-radius: 8px; text-decoration: none; font-weight: 600; font-size: .88rem; transition: background .12s; }
.bmh-quiz-cta:hover, .bmh-quiz-cta:focus { background: #0f766e; }
.bmh-quiz-restart { margin-top: 1.1rem; background: none; border: none; color: #0f766e; cursor: pointer; text-decoration: underline; font: inherit; padding: 0; }

@media (max-width: 480px) {
  .bmh-quiz { padding: 1.25rem; }
  .bmh-quiz-match { grid-template-columns: 1.25rem 40px 1fr; grid-template-areas: "rank avatar body" "cta cta cta"; row-gap: .6rem; }
  .bmh-quiz-rank { grid-area: rank; }
  .bmh-quiz-avatar { grid-area: avatar; width: 40px; height: 40px; }
  .bmh-quiz-match-body { grid-area: body; }
  .bmh-quiz-cta { grid-area: cta; width: 100%; }
}