/* Layout and interaction only; Glen Ivy/theme tokens provide type and colors. */
.quiz-generator { color: inherit; padding: clamp(32px,6vw,80px) var(--page-pad,24px); text-align: center; }
.quiz-generator [x-cloak] { display: none !important; }
.quiz-generator .qg-inner { max-width: 1000px; margin: auto; }
.quiz-generator h2 { scroll-margin-top:96px; font: inherit; font-family: var(--serif,inherit); font-size: clamp(28px,4vw,42px); line-height: 1.25; max-width: 21ch; margin: 0 auto; }
.quiz-generator h3 { font-family: var(--serif,inherit); font-size: clamp(24px,3vw,34px); line-height: 1.3; margin: 8px 0 18px; }
.quiz-generator .qg-eyebrow { color: var(--accent,currentColor); text-transform: uppercase; letter-spacing: .12em; font-size: .8em; margin: 0 0 8px; }
.quiz-generator .qg-rule { display:block; width:64px; height:3px; background:currentColor; margin:24px auto 18px; }
.quiz-generator .qg-intro { font-family: var(--serif,inherit); font-size:clamp(17px,2.5vw,22px); line-height:1.6; max-width:46ch; margin:0 auto 48px; }
.quiz-generator button, .quiz-generator a { font:inherit; color:inherit; }
.quiz-generator button { cursor:pointer; }
.quiz-generator button:disabled { opacity:.35; cursor:default; }
.quiz-generator button:focus-visible, .quiz-generator a:focus-visible { outline:2px solid currentColor; outline-offset:4px; }
.quiz-generator .qg-icon { display:inline-flex; align-items:center; vertical-align:middle; }
.quiz-generator .qg-icon svg { width:1.4em; height:1.4em; }
.quiz-generator .qg-options { display:flex; flex-wrap:wrap; justify-content:center; gap:20px; margin:0; }
.quiz-generator .qg-option { display:flex; flex:0 1 168px; min-height:168px; box-sizing:border-box; flex-direction:column; align-items:center; justify-content:center; gap:18px; padding:24px 16px; border:1px solid transparent; border-radius:var(--radius,14px); background:var(--bg-card,transparent); box-shadow:0 6px 24px color-mix(in srgb,currentColor 8%,transparent); text-decoration:none; line-height:1.4; transition:border-color .2s,box-shadow .2s; }
.quiz-generator .qg-option > .qg-icon { font-size:24px; }
.quiz-generator .qg-option:hover { border-color:color-mix(in srgb,currentColor 35%,transparent); box-shadow:0 6px 24px color-mix(in srgb,currentColor 12%,transparent); }
.quiz-generator .qg-option[aria-pressed=true] { border-color:var(--green-dark,currentColor); background:color-mix(in srgb,var(--green-dark,currentColor) 12%,var(--bg-card,transparent)); box-shadow:0 0 0 2px var(--green-dark,currentColor),0 0 22px color-mix(in srgb,var(--green-dark,currentColor) 22%,transparent); }
.quiz-generator .qg-questions { position:relative; padding:0 56px; }
.quiz-generator .qg-stepnav { position:absolute; right:0; top:40%; display:grid; justify-items:center; gap:8px; font-size:12px; }
.quiz-generator .qg-stepnav button { border:1px solid var(--border,currentColor); background:var(--bg-card,transparent); width:40px; height:40px; }
.quiz-generator .qg-dots { list-style:none; display:flex; justify-content:center; gap:9px; padding:0; margin:48px 0 0; }
.quiz-generator .qg-dots li { width:9px; height:9px; border-radius:10px; background:currentColor; opacity:.2; }
.quiz-generator .qg-dots li.is-done { opacity:.65; }
.quiz-generator .qg-dots li.is-current { width:26px; opacity:1; background:var(--accent,currentColor); }
.quiz-generator .qg-pills { display:flex; flex-wrap:wrap; justify-content:center; gap:8px; list-style:none; padding:0; margin:0 0 32px; min-height:32px; }
.quiz-generator .qg-pills li { display:flex; align-items:center; border-radius:30px; padding:5px 8px 5px 14px; background:var(--bg-tile,transparent); }
.quiz-generator .qg-pills button { border:0; background:transparent; padding:0 3px; font-size:.85em; }
.quiz-generator .qg-start { display:inline-flex; align-items:center; gap:12px; padding:14px 24px; border:1px solid currentColor; background:var(--bg-tile,transparent); }
.quiz-generator .qg-result { text-align:left; background:var(--bg-card,transparent); box-shadow:0 14px 36px color-mix(in srgb,currentColor 10%,transparent); max-width:850px; margin:auto; }
.quiz-generator .qg-result-with-image { display:grid; grid-template-columns:1fr 1fr; }
.quiz-generator .qg-result > img { width:100%; height:100%; object-fit:cover; min-height:300px; }
.quiz-generator .qg-result-content { padding:clamp(24px,4vw,44px); line-height:1.8; }
.quiz-generator .qg-link { display:inline-flex; align-items:center; gap:8px; margin-top:16px; }
.quiz-generator .qg-others { margin-top:48px; }
.quiz-generator .qg-others > p { margin-bottom:16px; }
.quiz-generator .qg-restart { display:inline-flex; align-items:center; gap:8px; margin-top:48px; padding:8px; border:0; background:transparent; }
@media(max-width:640px) {
 .quiz-generator .qg-questions { padding:0; }
 .quiz-generator .qg-options { gap:12px; }
 .quiz-generator .qg-option { flex-basis:calc(50% - 6px); min-height:140px; }
 .quiz-generator .qg-stepnav { position:static; display:flex; justify-content:center; margin-top:24px; }
 .quiz-generator .qg-result-with-image { grid-template-columns:1fr; }
 .quiz-generator .qg-result > img { min-height:0; max-height:320px; }
}
@media(prefers-reduced-motion:reduce) { .quiz-generator .qg-option { transition:none; } }
.quiz-generator .qg-other { flex-basis:260px; justify-content:flex-start; text-align:left; }
.quiz-generator .qg-other img { width:100%; aspect-ratio:3/2; object-fit:cover; border-radius:inherit; }
.quiz-generator .qg-other small { font-size:.85em; line-height:1.6; }