/* The quiz is inline: the page itself remains the only scroll container. */
.quiz-dialog {
  --quiz-ink: #202b40;
  --quiz-paper: #fdfbf7;
  --quiz-muted: #5d6471;
  --quiz-gold: #815f2a;
  --quiz-vermilion: #c94b1b;
  box-sizing: border-box;
  position: relative;
  width: min(100%, 760px);
  height: auto;
  margin: 0 auto;
  padding: 0;
  scroll-margin-top: 90px;
  border: 1px solid #e6e2db;
  border-radius: 24px;
  background: var(--quiz-paper);
  color: var(--quiz-ink);
  box-shadow: 0 18px 55px rgba(32, 43, 64, .08);
  font-family: 'Inter', Arial, sans-serif;
  color-scheme: light;
}
.quiz-dialog *, .quiz-dialog *::before, .quiz-dialog *::after { box-sizing: border-box; }
.quiz-frame { display: flex; flex-direction: column; }
.quiz-header { min-height: 68px; display: grid; grid-template-columns: 74px 1fr 74px; align-items: center; padding: 10px 20px; border-bottom: 1px solid #ebe8e1; border-radius: 24px 24px 0 0; background: #fffdfa; }
.quiz-header::after { content: ''; }
.quiz-header-brand { display: flex; align-items: center; justify-content: center; gap: 8px; font-size: 11px; letter-spacing: .13em; font-weight: 700; text-align: center; white-space: nowrap; }
.quiz-header-wheel { color: var(--quiz-gold); font-size: 23px; line-height: 1; }
.quiz-back { min-height: 44px; border: 0; background: transparent; color: var(--quiz-ink); font: inherit; font-size: 14px; font-weight: 650; cursor: pointer; padding: 9px 6px; text-align: left; text-decoration: underline; text-underline-offset: 4px; }
.quiz-back[hidden] { display: block; visibility: hidden; }
.quiz-back:disabled { opacity: .45; cursor: default; }
.quiz-progress { padding: 13px 24px; background: #f6f3ed; color: #505866; font-size: 11px; font-weight: 700; letter-spacing: .08em; text-align: center; text-transform: uppercase; }
.quiz-progress-track { width: min(100%, 360px); height: 4px; overflow: hidden; margin: 10px auto 0; background: #e4ded2; border-radius: 4px; }
.quiz-progress-fill { display: block; height: 100%; background: #b1833c; border-radius: inherit; transition: width .3s ease; }
.quiz-log { padding: 28px max(24px, calc((100% - 590px) / 2)) 44px; }
.quiz-row { display: flex; align-items: flex-end; gap: 10px; margin: 0 0 14px; }
.quiz-avatar { width: 31px; height: 31px; flex: 0 0 31px; display: grid; place-items: center; border: 1px solid #e5d8be; border-radius: 50%; color: var(--quiz-gold); background: #f7f1e6; font-size: 20px; line-height: 1; }
.quiz-bubble { width: fit-content; max-width: min(90%, 510px); padding: 15px 18px; border: 1px solid #e9e6df; border-radius: 18px 18px 18px 6px; background: #fff; color: var(--quiz-ink); font-size: 15px; line-height: 1.6; overflow-wrap: anywhere; }
.quiz-question { margin: 0; font-weight: 650; scroll-margin-top: 100px; }
.quiz-question-note { margin: 0 0 6px 41px; color: var(--quiz-muted); font-size: 13px; line-height: 1.5; }
.quiz-choices, .quiz-actions { display: flex; flex-direction: column; gap: 10px; padding: 10px 0 12px 41px; }
.quiz-option, .quiz-button { min-height: 48px; border-radius: 12px; padding: 13px 17px; font: inherit; font-size: 15px; line-height: 1.4; font-weight: 650; text-align: left; cursor: pointer; text-decoration: none; transition: background .18s, border-color .18s, color .18s; }
.quiz-option { width: 100%; border: 1px solid #dcdedc; background: #fff; color: var(--quiz-ink); }
.quiz-option:hover { background: #f7f4ee; border-color: #b7b6b1; }
.quiz-option[aria-pressed="true"] { border-color: #a7662e; background: #fbf3e8; }
.quiz-button { display: inline-flex; align-items: center; justify-content: center; text-align: center; }
.quiz-button--primary { border: 1px solid var(--quiz-vermilion); background: var(--quiz-vermilion); color: #fff; }
.quiz-button--primary:hover { background: #a73712; border-color: #a73712; color: #fff; }
.quiz-button--secondary { border: 1px solid #c1c6c9; background: #fff; color: var(--quiz-ink); }
.quiz-button--secondary:hover { background: #f3f1ed; }
.quiz-button--text { border: 1px solid transparent; background: transparent; color: var(--quiz-ink); text-decoration: underline; text-underline-offset: 4px; }
.quiz-button:disabled { opacity: .6; cursor: wait; }
.quiz-dialog:focus-visible, .quiz-dialog :focus-visible { outline: 3px solid #345aa8; outline-offset: 3px; }
.quiz-invitation h2 { margin: 14px 0 16px; font-family: 'Inter', Arial, sans-serif; font-weight: 650; font-size: clamp(30px, 5vw, 43px); line-height: 1.12; letter-spacing: -.035em; }
.quiz-error, .quiz-save-status { margin: 0; color: #912d22; font-size: 13px; line-height: 1.4; }
.quiz-save-status:empty { display: none; }
.quiz-result-card, .quiz-niche-card { margin: 18px 0; padding: 35px 30px; border: 1px solid #e5e2da; border-radius: 20px; background: #fff; text-align: center; }
.quiz-result-card { border-top: 3px solid var(--result-accent, #b1833c); animation: quiz-reveal .6s ease both; }
.quiz-result-card--maker { --result-accent: #b4532a; background: #fffaf6; }
.quiz-result-card--merchant { --result-accent: #b88a1b; background: #fffcf5; }
.quiz-result-card--guide { --result-accent: #d4771b; background: #fffaf4; }
.quiz-result-card--admin { --result-accent: #526792; background: #f8f9fc; }
@keyframes quiz-reveal { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }
.quiz-result-icon { width: 72px; height: 72px; display: grid; place-items: center; margin: 0 auto 20px; border: 1px solid #e1d3ba; border-radius: 50%; color: var(--quiz-gold); }
.quiz-result-icon svg { width: 39px; height: 39px; }
.quiz-result-overline { margin: 0 0 8px; color: #705934; font-size: 11px; font-weight: 700; letter-spacing: .09em; text-transform: uppercase; overflow-wrap: anywhere; }
.quiz-result-title, .quiz-niche-title { margin: 0; font-family: 'Inter', Arial, sans-serif; font-size: clamp(34px, 6vw, 48px); font-weight: 650; line-height: 1.1; letter-spacing: -.035em; }
.quiz-result-title, .quiz-niche-title, .quiz-invitation h2 { scroll-margin-top: 100px; }
.quiz-result-field { margin: 14px 0 4px; color: #454f5f; font-size: 15px; }
.quiz-result-sanskrit { margin: 4px 0 0; color: #5d6471; font-size: 14px; font-style: italic; }
.quiz-result-insight { max-width: 390px; margin: 20px auto 0; color: #384354; font-size: 17px; line-height: 1.5; }
.quiz-details { padding: 4px 4px 0; }
.quiz-result-section { margin: 22px 0; }
.quiz-result-section h3, .quiz-invitation h3 { margin: 0 0 8px; font-family: 'Inter', Arial, sans-serif; font-size: 15px; font-weight: 700; }
.quiz-result-section p, .quiz-result-list, .quiz-invitation p, .quiz-invitation-list, .quiz-niche-card p { font-size: 15px; line-height: 1.65; }
.quiz-result-section p { margin: 0; }
.quiz-result-list, .quiz-invitation-list { margin: 8px 0 0; padding-left: 21px; }
.quiz-result-list li, .quiz-invitation-list li { padding-left: 4px; margin: 7px 0; }
.quiz-verse { margin: 25px 0 12px; border-left: 2px solid #c2a064; padding: 3px 0 3px 18px; color: #505b6b; font-size: 15px; font-style: italic; line-height: 1.6; }
.quiz-actions--result { padding-left: 0; margin-bottom: 22px; }
.quiz-result-note, .quiz-next p { margin: 16px 0; color: #384354; font-size: 15px; line-height: 1.65; }
.quiz-next { margin-top: 26px; }
.quiz-next h3 { margin: 0; font-size: 19px; line-height: 1.35; }
.quiz-next + .quiz-choices { padding-left: 0; }
.quiz-niche-card { text-align: left; }
.quiz-niche-title { font-size: clamp(32px, 5vw, 42px); }
.quiz-niche-line { margin: 22px 0 8px; color: #70552b; font-family: 'Inter', Arial, sans-serif; font-size: 21px; line-height: 1.3; font-weight: 650; }
.quiz-niche-card p:last-child { margin-bottom: 0; }
.quiz-invitation { margin: 0 0 24px; padding: 28px; border: 1px solid #e5e2da; border-radius: 20px; background: #fff; overflow-wrap: anywhere; }
.quiz-invitation-kicker { color: var(--quiz-gold); font-weight: 700; }
.quiz-invitation .quiz-price { margin-bottom: 0; font-size: 20px; font-weight: 700; }
.quiz-personal-line { font-weight: 700; }
.quiz-invitation .quiz-button { width: 100%; margin-top: 5px; }
.quiz-invitation .quiz-small { color: #606773; font-size: 12px; text-align: center; }
@media (max-width: 560px) {
  .quiz-dialog { border-radius: 18px; scroll-margin-top: 78px; }
  .quiz-header { grid-template-columns: 56px 1fr 56px; padding: 8px 12px; border-radius: 18px 18px 0 0; }
  .quiz-header-brand { font-size: 10px; }
  .quiz-log { padding: 22px 18px 35px; }
  .quiz-bubble { max-width: 88%; }
  .quiz-choices, .quiz-question-note { padding-left: 0; margin-left: 0; }
  .quiz-result-card, .quiz-niche-card { padding: 30px 23px; }
  .quiz-invitation { padding: 22px; }
}
@media (prefers-reduced-motion: reduce) {
  .quiz-dialog *, .quiz-dialog *::before, .quiz-dialog *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}
