/* Quiz-only adaptations of the native POW'HER Form frame. */
.quiz-app { --bg:#fdf7ee; --accent:#c42064; --text:#312331; }
.quiz-app .app-shell { grid-template-rows:auto minmax(0,1fr) auto; }
.quiz-app .app-shell > .flow-footer { grid-row:3; display:flex; flex-wrap:wrap; gap:12px; }
.quiz-app .flow-footer > p { flex:1 1 100%; min-width:0; max-width:none; margin:0; font-size:12px; line-height:1.5; }
.quiz-app .flow-footer .progress-meta { display:block; }
.quiz-app .brand-header { justify-content:space-between; }
.quiz-app .brand-logo { width:72px; height:72px; }
.quiz-app .header-note { margin-right:auto; }
.quiz-app #connection { font:400 13px/1.4 var(--body); color:var(--muted); }
.quiz-app .main { max-width:1040px; }
.quiz-app .screen { padding:16px 0; }
.quiz-app h1 { max-width:900px; font-size:clamp(32px,4vw,52px); }
.quiz-app .quiz-meta { display:flex; align-items:center; justify-content:space-between; gap:20px; color:var(--muted); font-size:17px; margin:6px 0 24px; max-width:760px; }
.quiz-app .quiz-timer { color:var(--accent); font:600 30px/1.1 var(--heading); font-variant-numeric:tabular-nums; white-space:nowrap; }
.quiz-app .choice-list { max-width:760px; }
.quiz-app .choice { min-height:60px; font-weight:400; }
.quiz-app .choice:disabled { opacity:1; cursor:default; }
.quiz-app .choice:disabled:not(.is-correct):not(.is-selected) { border-color:var(--line); }
.quiz-app .choice.is-selected { border:2px solid var(--accent); padding:11px 15px; }
.quiz-app .choice.is-correct { background:#d1e6d7; border-color:#466953; }
.quiz-app .answer-label { font-size:13px; color:#254631; font-weight:400; }
.quiz-app .join-code { font:600 clamp(48px,8vw,80px)/1.2 var(--heading); color:var(--accent); letter-spacing:.12em; margin:26px 0; }
.quiz-app .players { display:flex; flex-wrap:wrap; list-style:none; gap:12px 28px; padding:0; margin:18px 0; font-weight:400; }
.quiz-app .explanation { padding:24px 28px; background:#d1e6d7; max-width:760px; margin:24px 0; }
.quiz-app .explanation h2 { font-size:24px; margin-bottom:12px; }
.quiz-app .explanation p { margin:0; }
.quiz-app .quiz-actions { display:flex; gap:14px; margin-top:26px; flex-wrap:wrap; }
.quiz-app .scores,.quiz-app .podium { list-style:none; padding:0; margin:26px 0; max-width:760px; }
.quiz-app .scores li,.quiz-app .podium li { display:grid; grid-template-columns:36px minmax(0,1fr) auto; gap:14px; align-items:center; border-bottom:1px solid var(--line); padding:18px 0; }
.quiz-app .rank { font:600 24px var(--heading); color:var(--accent); }
.quiz-app .player-name { overflow-wrap:anywhere; font-weight:400; }
.quiz-app .points { font-size:17px; white-space:nowrap; }
.quiz-app .podium li:first-child { background:#d1e6d7; padding:24px; border:0; font-size:26px; }
.quiz-app .podium li:first-child .rank { font-size:36px; }
.quiz-app progress { appearance:none; border:0; width:100%; height:4px; background:var(--line); color:var(--accent); }
.quiz-app progress::-webkit-progress-bar { background:var(--line); }
.quiz-app progress::-webkit-progress-value { background:var(--accent); }
.quiz-app progress::-moz-progress-bar { background:var(--accent); }
.quiz-app #session-code { font:400 14px var(--body); }
.quiz-app [data-role=viewer] { pointer-events:none; }
.quiz-app[data-role=viewer] .main { max-width:1500px; padding-inline:6vw; }
.quiz-app[data-role=viewer] h1 { max-width:1200px; font-size:clamp(38px,4.2vw,72px); }
.quiz-app[data-role=viewer] .choice-list { max-width:1200px; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }
.quiz-app[data-role=viewer] .choice { min-height:100px; font-size:clamp(22px,2vw,32px); padding:22px; }
.quiz-app[data-role=viewer] .choice-key { font-size:19px; width:34px; height:34px; }
.quiz-app[data-role=viewer] .quiz-meta { max-width:1200px; font-size:22px; }
.quiz-app[data-role=viewer] .quiz-timer { font-size:44px; }
@media(max-width:600px){
 .quiz-app .brand-logo { width:56px; height:56px; }
 .quiz-app .header-note { font-size:12px; }
 .quiz-app #connection { font-size:11px; }
 .quiz-app .screen { padding:8px 0; }
 .quiz-app .quiz-meta { margin-bottom:20px; font-size:15px; }
 .quiz-app h1 { font-size:31px; }
 .quiz-app .choice { min-height:62px; font-size:17px; }
 .quiz-app .choice.is-correct { flex-wrap:wrap; }
 .quiz-app .answer-label { margin-left:39px; }
 .quiz-app .primary-button { width:100%; justify-content:center; }
 .quiz-app .explanation { padding:20px; }
 .quiz-app .quiz-actions { display:block; }
 .quiz-app .podium li:first-child { padding:18px 12px; }
 .quiz-app[data-role=viewer] .choice-list { grid-template-columns:1fr; }
}
