.demo-start h2,.demo-play h2{margin:0}.demo-actions{flex-wrap:wrap;gap:10px;margin-top:6px;display:flex}.demo-fine{color:var(--mp-muted);margin:4px 0 0;font-size:.78rem;line-height:1.5}.demo-error{background:color-mix(in srgb,#c62828 14%,var(--mp-surface));color:#e05252;border-radius:8px;margin:0;padding:10px 12px;font-size:.88rem}.demo-top{justify-content:space-between;align-items:center;gap:12px;display:flex}.demo-cat{color:var(--mp-muted);margin:0;font-size:.8rem;font-weight:650}.demo-stem{color:var(--mp-strong);white-space:pre-line;margin:0;font-size:1.08rem;line-height:1.65}.demo-opts{gap:8px;margin:4px 0 0;padding:0;list-style:none;display:grid}.demo-opts>*{border:1px solid var(--mp-border);background:var(--mp-surface);color:var(--mp-text);font:inherit;text-align:left;border-radius:10px;align-items:flex-start;gap:12px;padding:12px 14px;line-height:1.5;display:flex}.demo-opts.is-play>button{cursor:pointer}.demo-opts.is-play>button:hover:not(:disabled){border-color:var(--acc);background:var(--mp-soft)}.demo-opts.is-play>button:disabled{cursor:default}.demo-opts>* b{border:1px solid var(--mp-border-strong);border-radius:50%;flex:none;place-items:center;width:28px;height:28px;font-size:.8rem;display:grid}#mp-energy-app .demo-opts>button:disabled{opacity:1;color:var(--mp-text)}#mp-energy-app .demo-opts>[data-state=correct],.demo-opts>[data-state=correct]{background:color-mix(in srgb,#1f8a5b 14%,var(--mp-surface));color:var(--mp-strong);border-color:#1f8a5b}#mp-energy-app .demo-opts>[data-state=correct] b,.demo-opts>[data-state=correct] b{color:#fff;background:#1f8a5b;border-color:#1f8a5b}#mp-energy-app .demo-opts>[data-state=wrong],.demo-opts>[data-state=wrong]{background:color-mix(in srgb,#c62828 12%,var(--mp-surface));color:var(--mp-strong);border-color:#c62828}#mp-energy-app .demo-opts>[data-state=wrong] b,.demo-opts>[data-state=wrong] b{color:#fff;background:#c62828;border-color:#c62828}.demo-exp-box{background:var(--mp-soft);border-left:3px solid #1f8a5b;border-radius:0 10px 10px 0;padding:12px 14px;font-size:.92rem;line-height:1.6}.demo-exp-box.is-bad{border-left-color:#c62828}.demo-exp-box em,.demo-exp em{color:var(--mp-muted);font-size:.84rem;font-style:normal}.demo-review{border-bottom:1px solid var(--mp-border);padding:8px 0}.demo-review:last-child{border-bottom:0}.demo-review summary{cursor:pointer;color:var(--mp-strong);padding:6px 0;font-weight:650}.demo-review summary .xs-pill{margin-right:8px}.demo-review .demo-stem{margin:8px 0;font-size:.98rem}.demo-exp{color:var(--mp-text);margin:8px 0 0;font-size:.9rem;line-height:1.6}@media (max-width:640px){.demo-top{flex-direction:column;align-items:flex-start}.demo-actions>*{flex:calc(50% - 5px)}}.demo-hint{color:var(--mp-muted);margin:0;font-size:.9rem}.demo-nudge{color:#fff;background:#0f2a36;border-radius:12px;grid-template-columns:1fr auto;align-items:center;gap:12px 16px;padding:14px 16px;display:grid}.demo-nudge strong{font-size:1rem}.demo-nudge p{color:#cfe6f1;margin:2px 0 0;font-size:.9rem}.demo-nudge ul{color:#cfe6f1;margin:6px 0 0;padding-left:18px;font-size:.9rem;line-height:1.55}.demo-nudge .xs-btn{color:#fff;background:#4ab5e2;border-color:#4ab5e2}.demo-nudge-actions{justify-items:center;gap:6px;display:grid}.demo-nudge-close{color:#9fb7c4;cursor:pointer;background:0 0;border:0;padding:2px;font-size:.84rem;text-decoration:underline}.demo-nudge.is-end{margin:0}@media (max-width:600px){.demo-nudge{grid-template-columns:1fr}.demo-nudge-actions{justify-items:stretch}}.demo-count{background:color-mix(in srgb,var(--acc,#4ab5e2) 12%,var(--mp-surface,#fff));color:var(--acc-ink,#0e5576);border-radius:10px;align-items:center;gap:10px;margin:0;padding:8px 12px;font-size:.9rem;font-weight:600;display:inline-flex}.demo-count b{font-size:1.5rem;line-height:1}.demo-google{align-items:center;gap:8px;display:inline-flex}.demo-nudge .demo-google{color:#1e2327;background:#fff;border-color:#fff}.demo-fine.is-light{color:#cfe6f1;margin-top:6px}.demo-nudge.is-end .demo-nudge-actions{justify-items:stretch}.demo-play{min-height:min(620px,100svh - 170px)}.demo-play>.demo-actions{margin-top:auto;padding-top:6px}
