.arsh-mcq-app{max-width:920px;margin:25px auto;font-family:Arial,sans-serif;color:#172033;background:#f5f7fb;border:1px solid #e1e6ef;border-radius:18px;overflow:hidden;box-shadow:0 8px 28px rgba(20,30,50,.08)}
.arsh-head{display:flex;justify-content:space-between;gap:20px;padding:25px;background:#fff}.arsh-brand{font-size:13px;font-weight:700;letter-spacing:1.3px;opacity:.7}.arsh-head h2{margin:5px 0;font-size:24px}.arsh-head p{margin:0;color:#667085}
.arsh-level{background:#edf2ff;border-radius:15px;padding:12px 22px;text-align:center;min-width:105px;align-self:center}.arsh-level span{display:block;font-size:12px;color:#667085}.arsh-level strong{font-size:30px}.arsh-level small{font-size:12px}
.arsh-progress{padding:15px 25px;background:#eef1f5}.arsh-progress-track{height:8px;background:#d9dfe8;border-radius:20px;overflow:hidden}.arsh-progress-track span{display:block;height:100%;width:0;background:#315efb;transition:width .3s}.arsh-progress>div:last-child{margin-top:7px;font-size:12px;color:#667085}
.arsh-meta{display:flex;justify-content:space-between;padding:14px 25px;font-size:13px}.arsh-meta span:last-child{font-weight:700}.arsh-card{margin:0 25px 20px;padding:28px;background:#fff;border:1px solid #e0e5ec;border-radius:16px}.arsh-qnum{font-size:12px;font-weight:700;color:#315efb}.arsh-question{font-size:21px;font-weight:600;line-height:1.45;margin:10px 0 22px}.arsh-options{display:grid;grid-template-columns:1fr 1fr;gap:12px}.arsh-option{padding:14px;text-align:left;background:#fff;color:#172033;border:1px solid #cfd6df;border-radius:10px;cursor:pointer;font-size:15px;transition:.12s}.arsh-option:hover:not(:disabled){border-color:#315efb;transform:translateY(-1px)}.arsh-option.correct{background:#eaf8f0;border-color:#16854a}.arsh-option.wrong{background:#fff0f0;border-color:#d92d20}.arsh-option:disabled{cursor:default}
.arsh-feedback{margin-top:16px;min-height:22px;font-size:14px;line-height:1.5}.arsh-feedback.good{color:#167044}.arsh-feedback.bad{color:#b42318}.arsh-next,.arsh-practice,.arsh-restart{margin-top:18px;padding:12px 19px;border:0;border-radius:9px;background:#315efb;color:#fff;font-weight:700;cursor:pointer}.arsh-next:disabled{opacity:.45;cursor:not-allowed}.arsh-restart{background:#64748b;margin-left:7px}.arsh-practice{background:#16854a}
.arsh-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:#e1e5ea}.arsh-stats div{background:#fff;text-align:center;padding:15px}.arsh-stats span{display:block;font-size:12px;color:#667085}.arsh-stats b{font-size:20px}
.arsh-result{background:#fff;margin:25px;padding:28px;border-radius:16px;text-align:left}.arsh-result-head{text-align:center}.arsh-result-icon{font-size:42px}.arsh-score{font-size:44px;font-weight:800;color:#315efb;margin:8px}.arsh-comparison{display:inline-block;margin-top:8px;padding:9px 13px;border-radius:9px;background:#eef2f6;font-size:14px}.arsh-comparison.good{background:#eaf8f0;color:#167044}.arsh-comparison.bad{background:#fff0f0;color:#b42318}
.arsh-report{margin-top:25px}.arsh-topic-line{display:grid;grid-template-columns:170px 1fr 55px;gap:12px;align-items:center;margin:12px 0}.arsh-topic-line span{display:block;font-size:12px;color:#667085;font-weight:400}.arsh-bar{height:9px;background:#e4e8ee;border-radius:20px;overflow:hidden}.arsh-bar i{display:block;height:100%;background:#315efb}.arsh-topic-line>strong{text-align:right}
.arsh-insights{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:24px}.arsh-insights>div{background:#f6f8fb;padding:18px;border-radius:12px}.arsh-insights h3{margin-top:0}.arsh-insights li{margin:8px 0}.arsh-result-actions{display:flex;flex-wrap:wrap;gap:8px}
@media(max-width:650px){.arsh-head{flex-direction:column}.arsh-level{align-self:stretch}.arsh-card{margin:0 12px 15px;padding:20px}.arsh-meta,.arsh-progress{padding-left:12px;padding-right:12px}.arsh-options{grid-template-columns:1fr}.arsh-insights{grid-template-columns:1fr}.arsh-topic-line{grid-template-columns:105px 1fr 45px}.arsh-head h2{font-size:20px}}

.arsh-practice-heading{margin:0 25px 4px;padding:13px 16px;background:#eef6ff;border:1px solid #cfe1ff;border-radius:10px;color:#1d4ed8;font-size:15px;font-weight:800}
@media(max-width:650px){.arsh-practice-heading{margin:0 12px 4px;font-size:14px}}

.arsh-visual-explanation{margin-top:18px;border:1px solid #cfe1ff;border-radius:14px;background:linear-gradient(180deg,#f8fbff 0%,#ffffff 100%);overflow:hidden;animation:arshVisualIn .28s ease-out}.arsh-visual-head{display:flex;justify-content:space-between;gap:12px;align-items:center;padding:14px 16px;background:#eef6ff;border-bottom:1px solid #d8e8ff}.arsh-visual-head b{display:block;font-size:16px;color:#1d4ed8}.arsh-visual-head span:not(.arsh-visual-badge){display:block;margin-top:4px;color:#667085;font-size:13px;line-height:1.4}.arsh-visual-badge{font-size:10px;font-weight:800;letter-spacing:.7px;padding:6px 8px;border-radius:20px;background:#315efb;color:#fff;white-space:nowrap}.arsh-visual-svg{padding:8px 12px 0;text-align:center}.arsh-visual-svg svg{width:100%;max-width:560px;height:auto;min-height:180px}.arsh-visual-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;padding:12px 14px 16px}.arsh-visual-steps>div{display:flex;gap:9px;align-items:flex-start;background:#f7f9fc;border-radius:10px;padding:11px}.arsh-visual-steps b{flex:0 0 24px;height:24px;border-radius:50%;display:grid;place-items:center;background:#315efb;color:#fff;font-size:12px}.arsh-visual-steps span{font-size:13px;line-height:1.45;color:#344054}@keyframes arshVisualIn{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:650px){.arsh-visual-head{align-items:flex-start}.arsh-visual-steps{grid-template-columns:1fr}.arsh-visual-svg svg{min-height:150px}.arsh-visual-badge{display:none}}

.arsh-visual-given{margin:14px 16px 0;border:1px solid #d8e8ff;border-radius:12px;background:#fff;overflow:hidden}.arsh-visual-section-title{padding:10px 14px;background:#eef4ff;color:#1d4ed8;font-weight:800;font-size:13px}.arsh-visual-question{padding:14px 16px;color:#172033;font-size:15px;line-height:1.55}.arsh-visual-criterion{margin:0 16px 2px;padding:14px 16px;border:1px solid #f2c7d7;border-radius:12px;background:linear-gradient(135deg,#fff7fa,#fff);text-align:center}.arsh-visual-criterion span{display:block;font-size:12px;color:#667085;text-transform:uppercase;letter-spacing:.5px}.arsh-visual-criterion b{display:block;margin:3px 0;font-size:25px;color:#c2185b}.arsh-visual-criterion small{display:block;color:#475467;font-size:13px;line-height:1.4}

/* Teacher Mode v1.0.0 */
.arsh-head{position:relative}
.arsh-teacher-toggle{margin-top:10px;border:1px solid #315efb;background:#fff;color:#1d4ed8;border-radius:999px;padding:8px 13px;font-weight:800;font-size:12px;cursor:pointer;transition:.2s}
.arsh-teacher-toggle:hover,.arsh-teacher-toggle.active{background:#315efb;color:#fff}
.arsh-teacher-controls{margin:16px 0 4px;padding:14px;border:1px solid #cfdcff;border-radius:14px;background:linear-gradient(135deg,#f4f8ff,#ffffff)}
.arsh-teacher-title{font-weight:900;color:#1d4ed8;font-size:15px;margin-bottom:10px}
.arsh-teacher-actions{display:flex;flex-wrap:wrap;gap:8px}
.arsh-teacher-actions button{border:1px solid #b8c7e8;background:#fff;color:#172033;border-radius:9px;padding:9px 12px;font-weight:800;cursor:pointer}
.arsh-teacher-actions button:hover:not(:disabled){background:#eef4ff;border-color:#315efb;color:#1d4ed8}
.arsh-teacher-actions button:disabled{opacity:.45;cursor:not-allowed}
.arsh-teacher-note{margin-top:10px;color:#667085;font-size:12px;line-height:1.45}
.arsh-option.arsh-teacher-option{cursor:default}
.arsh-option.arsh-teacher-option:disabled{opacity:1}
@media(max-width:650px){.arsh-teacher-actions button{flex:1 1 45%}.arsh-teacher-toggle{width:100%}}


/* Visual Explanation Animation v0.9.6 — works with all 200 reviewed SVG visuals */
.arsh-visual-controls{display:flex;align-items:center;flex-wrap:wrap;gap:8px;padding:10px 14px 2px}
.arsh-visual-controls button{border:1px solid #b8c7e8;background:#fff;color:#1d4ed8;border-radius:9px;padding:8px 12px;font-weight:800;cursor:pointer}
.arsh-visual-controls button:hover:not(:disabled){background:#eef4ff;border-color:#315efb}
.arsh-visual-next{font-weight:900}
.arsh-visual-controls button:disabled{opacity:.5;cursor:not-allowed}
.arsh-visual-status{font-size:12px;color:#667085;margin-left:4px}
.arsh-visual-svg svg{overflow:visible}
.arsh-visual-playing .arsh-visual-svg svg{filter:drop-shadow(0 2px 3px rgba(49,94,251,.08))}
.arsh-visual-finished .arsh-visual-svg svg{filter:none}
@keyframes arshArcPulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.55;transform:scale(1.035)}}
@media(max-width:650px){.arsh-visual-controls{padding-left:12px;padding-right:12px}.arsh-visual-controls button{flex:0 1 auto}.arsh-visual-status{width:100%;margin-left:0}}

@keyframes arshLabelPulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.7;transform:scale(1.06)}}

/* v0.9.9 — strict one-click/one-step visual animation */
.arsh-visual-steps>div{opacity:0;transition:opacity .2s ease}
.arsh-visual-steps>div.arsh-step-active{outline:2px solid #cfe1ff;background:#eef6ff}
@keyframes arshStagePulse{0%{transform:scale(1);filter:brightness(1)}45%{transform:scale(1.018);filter:brightness(1.08)}100%{transform:scale(1);filter:brightness(1)}}
@keyframes arshGeometryPulse{0%,100%{opacity:1;stroke-width:inherit}50%{opacity:.55}}
@keyframes arshStepReveal{0%{opacity:0;transform:translateY(8px)}100%{opacity:1;transform:translateY(0)}}

.arsh-question{white-space:pre-line;}