.learning-bar,.learning-complete{margin:16px 0;padding:18px 20px;border:1px solid var(--border,#dce3ed);border-radius:18px;background:var(--card,#fff);color:var(--text,#243944)}
.learning-bar[hidden],.learning-feedback[hidden],.q-learning[hidden],.learning-next[hidden]{display:none}
.learning-bar p,.learning-complete p{margin:8px 0 12px;line-height:1.5}
.learning-bar small{display:block;margin-top:10px;color:var(--text-light,#64748b)}
.learning-review-active :is(#questionViewBar,#catFilterRow,#catFilterNote,.top-row,.question-update-notice,.header-stats,.header-progress-wrap){display:none!important}
.learning-bar.review-active{position:sticky;top:var(--learning-header-height,64px);z-index:40;margin:0 0 24px;padding:16px 20px;background:var(--card,#fff);border:1px solid var(--primary,#345dd5);border-inline-start:4px solid var(--primary,#345dd5);box-shadow:0 6px 20px #0001}
.learning-bar.review-active h2{font-size:22px;line-height:1.35;margin:10px 0 0}
.learning-bar.review-active .learning-exit{background:transparent;border:0;padding:4px 0;color:var(--primary,#345dd5);font-weight:650;text-align:start;min-height:36px}
.learning-bar.review-active .learning-session-hint{font-size:14px;color:var(--text-light,#64748b);margin:6px 0 12px}
.learning-session-status{display:flex;justify-content:space-between;flex-wrap:wrap;gap:4px 16px;font-size:14px;line-height:1.4}
.learning-session-status span{color:var(--text-light,#64748b)}
.learning-bar progress{display:block;width:100%;height:6px;margin-top:10px;appearance:none;border:0;border-radius:6px;overflow:hidden;background:var(--border,#dce3ed);accent-color:var(--primary,#345dd5)}
.learning-bar progress::-webkit-progress-bar{background:var(--border,#dce3ed)}
.learning-bar progress::-webkit-progress-value{background:var(--primary,#345dd5)}
.learning-bar progress::-moz-progress-bar{background:var(--primary,#345dd5)}
html.theme-dark .learning-bar.review-active .learning-exit{color:#a9c2ff}
.learning-review-active #qList{max-width:900px;margin-inline:auto}
.learning-review-active .q-card{scroll-margin-top:calc(var(--learning-header-height,64px) + 180px)}
.learning-actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
:is(.learning-bar,.q-learning,.learning-complete) button{font:inherit;font-size:14px;line-height:1.3;min-height:40px;padding:8px 12px;border-radius:12px;border:1px solid var(--border,#dce3ed);background:var(--card,#fff);color:var(--text,#243944);cursor:pointer;white-space:normal}
:is(.learning-bar,.q-learning,.learning-complete) button:focus-visible{outline:3px solid #608aef;outline-offset:3px}
:is(.learning-bar,.q-learning) button:disabled{opacity:.5;cursor:default}
.q-learning{margin-block:12px;min-width:0;order:5}
.q-scene-immersive .q-learning{order:0}
.learning-unsure[aria-pressed=true]{background:#edf3ff;color:#284eac;border-color:#86a5ec}
.learning-status{font-size:13px;color:var(--text-light,#64748b);margin:8px 0}
.learning-status:empty{display:none}
.learning-feedback{margin-top:12px;padding:14px;border-radius:14px;background:var(--bg,#f5f8fc);border:1px solid var(--border,#dce3ed);overflow-wrap:anywhere}
.learning-feedback summary{cursor:pointer;font-weight:700;min-height:32px;line-height:1.4}
.learning-feedback p{font-size:14px;line-height:1.55;margin:10px 0}
.learning-correct{border-inline-start:3px solid #24a66a;padding-inline-start:10px}
.learning-selected{border-inline-start:3px solid #dd5a65;padding-inline-start:10px}
.learning-explanation{font-size:14px;line-height:1.55;margin:12px 0}
.learning-sources{display:flex;flex-wrap:wrap;gap:4px 8px;font-size:12px!important;line-height:1.6}
.learning-sources a{color:var(--primary,#355fd3);text-decoration:underline;text-underline-offset:3px}
html.theme-dark .learning-sources a{color:#a9c2ff}
.learning-source-notice{padding:12px;border-inline-start:3px solid #d9942f;background:rgba(217,148,47,.08);border-radius:8px}
.learning-next,.learning-complete button{background:#345dd5;color:white;border-color:#345dd5;margin-top:8px}
html.theme-dark .learning-unsure[aria-pressed=true]{background:#23365e;color:#cfddff;border-color:#608aef}
@media(max-width:600px){.learning-bar{padding:14px}.q-learning button,.learning-bar button{min-height:44px}.learning-feedback{padding:12px}}

.learning-next{display:block;align-self:flex-end;order:7;font:inherit;font-size:14px;min-height:44px;padding:10px 14px;border:1px solid #345dd5;border-radius:12px;cursor:pointer}
#qList .q-scene-immersive .learning-next{display:none}