/* ==========================================================================
   MRCSBANK — CONSOLIDATED STYLESHEET
   Rebuilt from the appended stylesheet into one maintainable CSS file.

   Important:
   - Existing IDs/classes are preserved so main.js does not need changes.
   - Dashboard v1.7 duplicate block removed.
   - Later dashboard patches folded into the final declarations.
   - Current-rank spotlight is ICON-ONLY: the whole rank node is not highlighted.
   - Future-rank grayscale excludes the current rank.
   - Existing !important flags are retained where the source relied on them
     to beat styles injected by functions.php / style.css.
   ========================================================================== */


/* --------------------------------------------------------------------------
   1. CORE QUIZ ENGINE
   -------------------------------------------------------------------------- */


#mrcs_qbank_app,
.mrcs-dashboard-wrapper {
    --mrcs-blue: #0078D7;
    --mrcs-blue-deep: #005A9C;
    --mrcs-blue-soft: #EAF4FD;
    --mrcs-blue-line: #BEDDF6;
    --mrcs-ok: #1D9E75;
    --mrcs-ok-deep: #0E6B52;
    --mrcs-ok-soft: #E5F5EF;
    --mrcs-ok-line: #B4E1D0;
    --mrcs-bad: #C9524A;
    --mrcs-bad-deep: #93332C;
    --mrcs-bad-soft: #FBEDEB;
    --mrcs-bad-line: #F0CDC9;
    --mrcs-amber: #A9700F;
    --mrcs-amber-soft: #FBF1DE;
    --mrcs-amber-line: #EBD5AC;
    --mrcs-ink: #12202E;
    --mrcs-slate: #566878;
    --mrcs-faint: #8795A3;
    --mrcs-line: #DCE3EA;
    --mrcs-line-soft: #E9EEF3;
    --mrcs-surface: #FFFFFF;
    --mrcs-sunken: #F5F8FB;
    --mrcs-canvas: #EDF1F5;
    --mrcs-r-lg: 14px;
    --mrcs-r-md: 10px;
    --mrcs-r-sm: 6px;
    --mrcs-shadow: 0 1px 1px rgba(18,32,46,.03), 0 6px 20px rgba(18,32,46,.05);
    --mrcs-mono: "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
    --mrcs-display: "Archivo", system-ui, sans-serif;
    --mrcs-body: "Inter", system-ui, -apple-system, sans-serif;
    --mrcs-dark: var(--mrcs-blue-deep);
    --mrcs-light: var(--mrcs-blue-soft);
    --mrcs-text: var(--mrcs-ink);
    --mrcs-white: var(--mrcs-surface);
    --mrcs-gray: var(--mrcs-sunken);
    --mrcs-green: var(--mrcs-ok);
    --mrcs-red: var(--mrcs-bad);
    --mrcs-border: var(--mrcs-line);
    --mrcs-radius: var(--mrcs-r-lg);
    --mrcs-pill: var(--mrcs-r-md);
}

#mrcs_qbank_app {
    margin: 34px auto !important;
    font-family: var(--mrcs-body) !important;
    color: var(--mrcs-ink);
    box-sizing: border-box;
    -webkit-font-smoothing: antialiased;
    max-width: 1280px !important;
    padding: 0 24px !important;
}

#mrcs_qbank_app *,
#mrcs_qbank_app *::before,
#mrcs_qbank_app *::after {
    box-sizing: border-box;
}

#mrcs_qbank_app :focus-visible {
    outline: 2px solid var(--mrcs-blue);
    outline-offset: 2px;
    border-radius: 3px;
}

#mrcs_qbank_app .quiz-content-wrapper {
    display: flex !important;
    gap: 20px !important;
    align-items: flex-start !important;
    width: 100% !important;
}

#mrcs_qbank_app #mainQuizContainer,
#mrcs_qbank_app #quizTypeSelection,
#mrcs_qbank_app #results,
#mrcs_qbank_app #progressBox {
    background: var(--mrcs-surface) !important;
    border: 1px solid var(--mrcs-line) !important;
    border-radius: var(--mrcs-r-lg) !important;
    box-shadow: var(--mrcs-shadow) !important;
    padding: 30px !important;
    position: relative !important;
    overflow: visible !important;
    margin-bottom: 20px !important;
}

#mrcs_qbank_app #quizTypeSelection::before,
#mrcs_qbank_app #mainQuizContainer::before,
#mrcs_qbank_app #progressBox::before,
#mrcs_qbank_app #results::before {
    display: none !important;
    content: none !important;
}

#mrcs_qbank_app #mainQuizContainer {
    flex: 1 !important;
    min-width: 0 !important;
}

#mrcs_qbank_app #progressBox {
    width: 264px !important;
    flex-shrink: 0 !important;
    padding: 20px !important;
    position: sticky !important;
    top: 20px !important;
}

#mrcs_qbank_app #quizTypeSelection,
#mrcs_qbank_app #results {
    width: 100% !important;
}

#mrcs_qbank_app #mainQuizContainer,
#mrcs_qbank_app #progressBox,
#mrcs_qbank_app #results {
    display: none;
}

#mrcs_qbank_app .back-btn-modern {
    background: var(--mrcs-surface) !important;
    border: 1px solid var(--mrcs-line) !important;
    color: var(--mrcs-slate) !important;
    padding: 8px 15px !important;
    border-radius: var(--mrcs-r-md) !important;
    font-family: var(--mrcs-body) !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
    cursor: pointer;
    display: inline-flex !important;
    align-items: center;
    gap: 7px;
    transition: border-color .14s ease, color .14s ease, background .14s ease;
    margin-bottom: 18px;
}

#mrcs_qbank_app .back-btn-modern:hover {
    background: var(--mrcs-sunken) !important;
    border-color: var(--mrcs-faint) !important;
    color: var(--mrcs-ink) !important;
}

#mrcs_qbank_app .quiz-header-nav {
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding-bottom: 16px !important;
    border-bottom: 1px solid var(--mrcs-line-soft) !important;
    margin-bottom: 22px !important;
}

#mrcs_qbank_app .quiz-header-nav h2 {
    margin: 0 !important;
    font-family: var(--mrcs-display) !important;
    font-weight: 600 !important;
    font-size: 20px !important;
    letter-spacing: -.015em !important;
    color: var(--mrcs-ink) !important;
    border: 0 !important;
    padding: 0 !important;
    text-align: center;
    flex: 1;
    min-width: 0;
}

#mrcs_qbank_app .nav-arrow {
    width: 36px !important;
    height: 36px !important;
    border-radius: var(--mrcs-r-sm) !important;
    background: var(--mrcs-surface) !important;
    border: 1px solid var(--mrcs-line) !important;
    color: var(--mrcs-slate) !important;
    font-size: 13px !important;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    box-shadow: none !important;
    transition: all .14s ease;
    flex-shrink: 0;
}

#mrcs_qbank_app .nav-arrow i {
    pointer-events: none;
}

#mrcs_qbank_app .nav-arrow:hover {
    background: var(--mrcs-sunken) !important;
    border-color: var(--mrcs-faint) !important;
    color: var(--mrcs-ink) !important;
    transform: none !important;
    box-shadow: none !important;
}

#mrcs_qbank_app .nav-arrow:disabled {
    opacity: .35;
    cursor: default;
    background: var(--mrcs-surface) !important;
}

#mrcs_qbank_app .timer-display {
    font-family: var(--mrcs-mono) !important;
    font-variant-numeric: tabular-nums;
    font-size: 14px !important;
    font-weight: 500;
    color: var(--mrcs-slate) !important;
    background: var(--mrcs-sunken);
    border: 1px solid var(--mrcs-line);
    border-radius: var(--mrcs-r-sm);
    padding: 6px 12px;
}

#mrcs_qbank_app .flag-toggle-btn {
    float: right !important;
    background: var(--mrcs-surface) !important;
    border: 1px solid var(--mrcs-line) !important;
    border-radius: var(--mrcs-r-sm) !important;
    padding: 7px 13px !important;
    cursor: pointer !important;
    font-family: var(--mrcs-body) !important;
    font-size: 12.5px !important;
    font-weight: 500 !important;
    color: var(--mrcs-slate) !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    margin-bottom: 14px !important;
    transition: all .14s ease;
}

#mrcs_qbank_app .flag-toggle-btn:hover {
    border-color: var(--mrcs-faint) !important;
    color: var(--mrcs-ink) !important;
}

#mrcs_qbank_app .flag-toggle-btn.active {
    border-color: var(--mrcs-amber-line) !important;
    color: var(--mrcs-amber) !important;
    background: var(--mrcs-amber-soft) !important;
}

#mrcs_qbank_app #quiz {
    font-weight: 400;
}

#mrcs_qbank_app #quiz .question {
    font-family: var(--mrcs-body) !important;
    font-size: 16.5px !important;
    font-weight: 400 !important;
    line-height: 1.65 !important;
    color: var(--mrcs-ink) !important;
    margin-bottom: 22px !important;
    text-align: left !important;
}

#mrcs_qbank_app #quiz .question p {
    font-size: 16.5px !important;
    line-height: 1.65 !important;
    font-weight: 400 !important;
    color: var(--mrcs-ink) !important;
    margin: 0 0 13px 0 !important;
    text-align: left !important;
}

#mrcs_qbank_app #quiz .question p:last-of-type {
    font-weight: 600 !important;
    margin-bottom: 0 !important;
}

#mrcs_qbank_app .answers {
    display: flex;
    flex-direction: column;
    gap: 9px;
}

#mrcs_qbank_app .answers label {
    display: flex !important;
    align-items: flex-start !important;
    gap: 13px !important;
    padding: 14px 16px !important;
    margin-bottom: 0 !important;
    background: var(--mrcs-surface) !important;
    border: 1px solid var(--mrcs-line) !important;
    border-radius: var(--mrcs-r-md) !important;
    cursor: pointer !important;
    font-family: var(--mrcs-body) !important;
    font-size: 15px !important;
    font-weight: 400 !important;
    line-height: 1.5 !important;
    color: var(--mrcs-ink) !important;
    transition: border-color .13s ease, background .13s ease !important;
    transform: none !important;
    box-shadow: none !important;
    position: relative;
}

#mrcs_qbank_app .answers label:hover {
    border-color: var(--mrcs-faint) !important;
    background: var(--mrcs-sunken) !important;
    transform: none !important;
    box-shadow: none !important;
}

#mrcs_qbank_app .answers input[type="radio"] {
    -webkit-appearance: none !important;
    appearance: none !important;
    width: 26px !important;
    height: 26px !important;
    margin: 0 !important;
    flex-shrink: 0;
    border: 1px solid var(--mrcs-line) !important;
    border-radius: var(--mrcs-r-sm) !important;
    background: var(--mrcs-sunken) !important;
    cursor: pointer;
    position: relative;
    transition: all .13s ease;
}

#mrcs_qbank_app .answers label strong {
    position: absolute !important;
    left: 16px;
    top: 14px;
    width: 26px;
    height: 26px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: var(--mrcs-mono) !important;
    font-size: 12.5px !important;
    font-weight: 600 !important;
    color: var(--mrcs-slate) !important;
    pointer-events: none;
    transition: color .13s ease;
}

#mrcs_qbank_app .answers label:has(input:checked) {
    border-color: var(--mrcs-blue) !important;
    background: var(--mrcs-blue-soft) !important;
    color: var(--mrcs-ink) !important;
}

#mrcs_qbank_app .answers label:has(input:checked) input[type="radio"] {
    background: var(--mrcs-blue) !important;
    border-color: var(--mrcs-blue) !important;
}

#mrcs_qbank_app .answers label:has(input:checked) strong {
    color: #fff !important;
}

#mrcs_qbank_app .answers label.is-correct {
    background: var(--mrcs-ok-soft) !important;
    border-color: var(--mrcs-ok) !important;
    color: var(--mrcs-ink) !important;
}

#mrcs_qbank_app .answers label.is-correct input[type="radio"] {
    background: var(--mrcs-ok) !important;
    border-color: var(--mrcs-ok) !important;
}

#mrcs_qbank_app .answers label.is-correct strong {
    color: #fff !important;
}

#mrcs_qbank_app .answers label.is-correct::after {
    content: "Correct";
    margin-left: auto;
    font-family: var(--mrcs-mono);
    font-size: 10.5px;
    font-weight: 600;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--mrcs-ok-deep);
    padding-top: 5px;
    flex-shrink: 0;
}

#mrcs_qbank_app .answers label.is-incorrect {
    background: var(--mrcs-bad-soft) !important;
    border-color: var(--mrcs-bad-line) !important;
    color: var(--mrcs-ink) !important;
}

#mrcs_qbank_app .answers label.is-incorrect input[type="radio"] {
    background: var(--mrcs-bad) !important;
    border-color: var(--mrcs-bad) !important;
}

#mrcs_qbank_app .answers label.is-incorrect strong {
    color: #fff !important;
}

#mrcs_qbank_app .answers label.is-incorrect::after {
    content: "Your answer";
    margin-left: auto;
    font-family: var(--mrcs-mono);
    font-size: 10.5px;
    font-weight: 600;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--mrcs-bad-deep);
    padding-top: 5px;
    flex-shrink: 0;
}

#mrcs_qbank_app .answers input:disabled {
    cursor: default;
}

#mrcs_qbank_app .answers label:has(input:disabled) {
    cursor: default !important;
}

#mrcs_qbank_app .answers label:has(input:disabled):hover {
    border-color: var(--mrcs-line);
    background: var(--mrcs-surface);
}

#mrcs_qbank_app .answers label.is-correct:has(input:disabled):hover {
    border-color: var(--mrcs-ok) !important;
    background: var(--mrcs-ok-soft) !important;
}

#mrcs_qbank_app .answers label.is-incorrect:has(input:disabled):hover {
    border-color: var(--mrcs-bad-line) !important;
    background: var(--mrcs-bad-soft) !important;
}

#mrcs_qbank_app .quiz-controls {
    display: flex !important;
    gap: 10px !important;
    margin-top: 26px !important;
    padding-top: 20px !important;
    border-top: 1px solid var(--mrcs-line-soft) !important;
}

#mrcs_qbank_app .quiz-controls button {
    padding: 12px 22px !important;
    border-radius: var(--mrcs-r-md) !important;
    font-family: var(--mrcs-body) !important;
    font-size: 14.5px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    border: 1px solid transparent !important;
    transition: background .14s ease, border-color .14s ease, color .14s ease !important;
    transform: none !important;
    box-shadow: none !important;
}

#mrcs_qbank_app #next,
#mrcs_qbank_app #submit {
    background: var(--mrcs-blue) !important;
    color: #ffffff !important;
    border-color: var(--mrcs-blue) !important;
    flex: 1 !important;
}

#mrcs_qbank_app #next:hover,
#mrcs_qbank_app #submit:hover {
    background: var(--mrcs-blue-deep) !important;
    border-color: var(--mrcs-blue-deep) !important;
    transform: none !important;
    box-shadow: none !important;
}

#mrcs_qbank_app #prev {
    background: var(--mrcs-surface) !important;
    border: 1px solid var(--mrcs-line) !important;
    color: var(--mrcs-ink) !important;
    flex: 0 0 auto !important;
}

#mrcs_qbank_app #prev:hover {
    background: var(--mrcs-sunken) !important;
    border-color: var(--mrcs-faint) !important;
    transform: none !important;
}

#mrcs_qbank_app #immediateFeedbackArea {
    margin-top: 24px;
}

#mrcs_qbank_app .question-feedback-box {
    margin: 0 0 22px 0 !important;
    padding: 0 !important;
    border: 1px solid var(--mrcs-line) !important;
    border-radius: var(--mrcs-r-lg) !important;
    overflow: hidden !important;
    background: var(--mrcs-surface) !important;
    animation: mrcsRise .18s ease-out;
    display: flex !important;
    flex-direction: column !important;
}

#mrcs_qbank_app .question-feedback-box h4 {
    margin: 0 !important;
    padding: 15px 22px !important;
    font-family: var(--mrcs-display) !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    letter-spacing: -.01em !important;
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    border-bottom: 1px solid var(--mrcs-line-soft) !important;
}

#mrcs_qbank_app .question-feedback-box.correct {
    border-color: var(--mrcs-ok-line) !important;
}

#mrcs_qbank_app .question-feedback-box.incorrect {
    border-color: var(--mrcs-bad-line) !important;
}

#mrcs_qbank_app .question-feedback-box.correct h4 {
    background: var(--mrcs-ok-soft) !important;
    color: var(--mrcs-ok-deep) !important;
    border-bottom-color: var(--mrcs-ok-line) !important;
}

#mrcs_qbank_app .question-feedback-box.incorrect h4 {
    background: var(--mrcs-bad-soft) !important;
    color: var(--mrcs-bad-deep) !important;
    border-bottom-color: var(--mrcs-bad-line) !important;
}

#mrcs_qbank_app .question-feedback-box.correct h4::before,
#mrcs_qbank_app .question-feedback-box.incorrect h4::before {
    width: 22px;
    height: 22px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    font-weight: 700;
    color: #fff;
    margin-right: 0 !important;
    flex-shrink: 0;
}

#mrcs_qbank_app .question-feedback-box.correct h4::before {
    content: "✓";
    background: var(--mrcs-ok);
}

#mrcs_qbank_app .question-feedback-box.incorrect h4::before {
    content: "✕";
    background: var(--mrcs-bad);
}

#mrcs_qbank_app .question-feedback-box > div:last-child {
    padding: 22px !important;
    font-family: var(--mrcs-body) !important;
    font-size: 15px !important;
    line-height: 1.7 !important;
    color: var(--mrcs-ink) !important;
    background: var(--mrcs-surface);
    order: 2;
}

#mrcs_qbank_app .question-feedback-box > div:last-child > *:first-child {
    margin-top: 0 !important;
}

#mrcs_qbank_app .question-feedback-box > div:last-child > *:last-child {
    margin-bottom: 0 !important;
}

#mrcs_qbank_app .question-feedback-box > div:last-child p {
    margin: 0 0 14px 0 !important;
    font-size: 15px !important;
    line-height: 1.7 !important;
    color: var(--mrcs-ink) !important;
}

#mrcs_qbank_app .question-feedback-box > div:last-child strong,
#mrcs_qbank_app .question-feedback-box > div:last-child b {
    font-weight: 600 !important;
    color: var(--mrcs-ink) !important;
}

#mrcs_qbank_app .question-feedback-box > div:last-child em,
#mrcs_qbank_app .question-feedback-box > div:last-child i {
    font-style: italic;
}

#mrcs_qbank_app .question-feedback-box > div:last-child h2,
#mrcs_qbank_app .question-feedback-box > div:last-child h3,
#mrcs_qbank_app .question-feedback-box > div:last-child h4,
#mrcs_qbank_app .question-feedback-box > div:last-child h5 {
    font-family: var(--mrcs-display) !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    letter-spacing: .01em !important;
    color: var(--mrcs-ink) !important;
    margin: 26px 0 10px !important;
    padding: 0 0 7px 0 !important;
    border: 0 !important;
    border-bottom: 1px solid var(--mrcs-line-soft) !important;
    background: none !important;
    display: block !important;
}

#mrcs_qbank_app .question-feedback-box > div:last-child h2::before,
#mrcs_qbank_app .question-feedback-box > div:last-child h3::before,
#mrcs_qbank_app .question-feedback-box > div:last-child h4::before {
    content: none !important;
}

#mrcs_qbank_app .question-feedback-box > div:last-child ul,
#mrcs_qbank_app .question-feedback-box > div:last-child ol {
    margin: 0 0 16px 0 !important;
    padding-left: 0 !important;
    list-style: none !important;
}

#mrcs_qbank_app .question-feedback-box > div:last-child ol {
    counter-reset: mrcsexp;
}

#mrcs_qbank_app .question-feedback-box > div:last-child li {
    position: relative !important;
    padding-left: 24px !important;
    margin-bottom: 8px !important;
    font-size: 14.5px !important;
    line-height: 1.65 !important;
    color: var(--mrcs-slate) !important;
}

#mrcs_qbank_app .question-feedback-box > div:last-child li:last-child {
    margin-bottom: 0 !important;
}

#mrcs_qbank_app .question-feedback-box > div:last-child li strong {
    color: var(--mrcs-ink) !important;
}

#mrcs_qbank_app .question-feedback-box > div:last-child ul > li::before {
    content: "" !important;
    position: absolute !important;
    left: 7px !important;
    top: 10px !important;
    width: 5px !important;
    height: 5px !important;
    border-radius: 50% !important;
    background: var(--mrcs-blue) !important;
    font-size: 0 !important;
    color: transparent !important;
}

#mrcs_qbank_app .question-feedback-box > div:last-child ol > li {
    counter-increment: mrcsexp;
}

#mrcs_qbank_app .question-feedback-box > div:last-child ol > li::before {
    content: counter(mrcsexp) !important;
    position: absolute !important;
    left: 0 !important;
    top: 0 !important;
    width: auto !important;
    height: auto !important;
    background: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    font-family: var(--mrcs-mono) !important;
    font-size: 11.5px !important;
    font-weight: 600 !important;
    color: var(--mrcs-blue) !important;
    display: block !important;
}

#mrcs_qbank_app .question-feedback-box > div:last-child blockquote {
    margin: 0 0 16px 0 !important;
    padding: 14px 18px !important;
    border: 0 !important;
    border-left: 3px solid var(--mrcs-blue) !important;
    background: var(--mrcs-blue-soft) !important;
    border-radius: 0 var(--mrcs-r-md) var(--mrcs-r-md) 0 !important;
}

#mrcs_qbank_app .question-feedback-box > div:last-child blockquote p:last-child {
    margin-bottom: 0 !important;
}

#mrcs_qbank_app .question-feedback-box > div:last-child table {
    width: 100% !important;
    border-collapse: collapse !important;
    margin: 0 0 16px 0 !important;
    font-size: 14px !important;
    box-shadow: none !important;
    border-radius: var(--mrcs-r-sm);
    overflow: hidden;
}

#mrcs_qbank_app .question-feedback-box > div:last-child th,
#mrcs_qbank_app .question-feedback-box > div:last-child td {
    padding: 9px 12px !important;
    border: 1px solid var(--mrcs-line-soft) !important;
    text-align: left !important;
    font-size: 14px !important;
}

#mrcs_qbank_app .question-feedback-box > div:last-child th {
    background: var(--mrcs-sunken) !important;
    font-family: var(--mrcs-body) !important;
    font-weight: 600 !important;
    font-size: 12.5px !important;
    color: var(--mrcs-ink) !important;
    text-transform: none !important;
    letter-spacing: .02em !important;
}

#mrcs_qbank_app .question-feedback-box > div:last-child td {
    color: var(--mrcs-slate) !important;
}

#mrcs_qbank_app .question-feedback-box > div:last-child img {
    max-width: 100% !important;
    height: auto !important;
    border: 1px solid var(--mrcs-line) !important;
    border-radius: var(--mrcs-r-md) !important;
    margin: 0 0 16px 0 !important;
}

#mrcs_qbank_app .question-feedback-box > div:last-child a {
    color: var(--mrcs-blue) !important;
    text-decoration: underline;
    text-underline-offset: 2px;
}

#mrcs_qbank_app .question-feedback-box > div:last-child hr {
    border: 0 !important;
    border-top: 1px solid var(--mrcs-line-soft) !important;
    margin: 22px 0 !important;
}

#mrcs_qbank_app .question-feedback-box > h4 {
    order: 1;
}

#mrcs_qbank_app .question-feedback-box > #stats-placeholder {
    order: 3;
}

#mrcs_qbank_app .stats-chart-box {
    background: var(--mrcs-sunken) !important;
    border: 0 !important;
    border-top: 1px solid var(--mrcs-line-soft) !important;
    border-radius: 0 !important;
    padding: 18px 22px !important;
    margin: 0 !important;
    font-family: var(--mrcs-body) !important;
}

#mrcs_qbank_app .stats-header {
    display: flex !important;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 13px !important;
    font-family: var(--mrcs-mono) !important;
    font-size: 10.5px !important;
    font-weight: 500 !important;
    letter-spacing: .14em !important;
    text-transform: uppercase !important;
    color: var(--mrcs-faint) !important;
}

#mrcs_qbank_app .pass-rate-badge {
    background: var(--mrcs-surface) !important;
    border: 1px solid var(--mrcs-line) !important;
    color: var(--mrcs-slate) !important;
    padding: 3px 10px !important;
    border-radius: 100px !important;
    font-size: 10.5px !important;
    letter-spacing: .04em !important;
}

#mrcs_qbank_app .chart-row {
    display: flex !important;
    align-items: center !important;
    margin-bottom: 7px !important;
}

#mrcs_qbank_app .chart-row:last-child {
    margin-bottom: 0 !important;
}

#mrcs_qbank_app .chart-label {
    width: 22px !important;
    font-family: var(--mrcs-mono) !important;
    font-size: 11.5px !important;
    font-weight: 600 !important;
    color: var(--mrcs-faint) !important;
}

#mrcs_qbank_app .chart-track {
    flex: 1 !important;
    height: 6px !important;
    background: var(--mrcs-line-soft) !important;
    border-radius: 100px !important;
    margin: 0 12px !important;
    overflow: hidden !important;
}

#mrcs_qbank_app .chart-fill {
    height: 100% !important;
    background: var(--mrcs-faint) !important;
    opacity: .5;
    border-radius: 100px !important;
    transition: width .5s ease-out !important;
}

#mrcs_qbank_app .chart-fill.is-correct-bar {
    background: var(--mrcs-ok) !important;
    opacity: 1;
}

#mrcs_qbank_app .chart-fill.is-user-wrong {
    background: var(--mrcs-bad) !important;
    opacity: 1;
}

#mrcs_qbank_app .chart-pct {
    width: 36px !important;
    text-align: right !important;
    font-family: var(--mrcs-mono) !important;
    font-size: 11.5px !important;
    font-weight: 500 !important;
    color: var(--mrcs-faint) !important;
}

#mrcs_qbank_app .question-feedback-toggle {
    margin-top: 20px !important;
}

#mrcs_qbank_app .feedback-toggle-btn {
    background: var(--mrcs-surface) !important;
    border: 1px solid var(--mrcs-line) !important;
    color: var(--mrcs-slate) !important;
    padding: 9px 15px !important;
    border-radius: var(--mrcs-r-md) !important;
    font-family: var(--mrcs-body) !important;
    font-weight: 500 !important;
    font-size: 13px !important;
    cursor: pointer;
    transition: all .14s ease;
}

#mrcs_qbank_app .feedback-toggle-btn:hover {
    background: var(--mrcs-sunken) !important;
    border-color: var(--mrcs-faint) !important;
    color: var(--mrcs-ink) !important;
}

#mrcs_qbank_app .feedback-form {
    margin-top: 12px !important;
    padding: 18px !important;
    border-radius: var(--mrcs-r-md) !important;
    background: var(--mrcs-sunken) !important;
    border: 1px solid var(--mrcs-line) !important;
}

#mrcs_qbank_app .feedback-help {
    font-size: 13.5px;
    color: var(--mrcs-slate);
    margin: 0 0 4px;
}

#mrcs_qbank_app .feedback-form label {
    display: block !important;
    margin: 12px 0 6px !important;
    font-family: var(--mrcs-body) !important;
    font-weight: 500 !important;
    font-size: 13px !important;
    color: var(--mrcs-ink) !important;
}

#mrcs_qbank_app .feedback-form textarea,
#mrcs_qbank_app .feedback-form input[type="email"] {
    width: 100% !important;
    border: 1px solid var(--mrcs-line) !important;
    border-radius: var(--mrcs-r-sm) !important;
    padding: 10px 12px !important;
    font-size: 14px !important;
    font-family: var(--mrcs-body) !important;
    background: var(--mrcs-surface) !important;
    color: var(--mrcs-ink) !important;
}

#mrcs_qbank_app .feedback-form textarea:focus,
#mrcs_qbank_app .feedback-form input[type="email"]:focus {
    outline: none;
    border-color: var(--mrcs-blue) !important;
}

#mrcs_qbank_app .feedback-submit-btn {
    margin-top: 12px !important;
    background: var(--mrcs-blue) !important;
    color: #fff !important;
    border: none !important;
    padding: 10px 18px !important;
    border-radius: var(--mrcs-r-md) !important;
    font-family: var(--mrcs-body) !important;
    font-weight: 600 !important;
    font-size: 14px !important;
    cursor: pointer;
}

#mrcs_qbank_app .feedback-submit-btn:hover {
    background: var(--mrcs-blue-deep) !important;
}

#mrcs_qbank_app .feedback-submit-btn:disabled {
    opacity: .5;
    cursor: default;
}

#mrcs_qbank_app .feedback-status {
    margin-top: 8px;
    font-size: 13px;
}

#mrcs_qbank_app .feedback-status.is-error {
    color: var(--mrcs-bad-deep);
}

#mrcs_qbank_app .feedback-status.is-success {
    color: var(--mrcs-ok-deep);
}

#mrcs_qbank_app #progressBox h3 {
    margin: 0 0 16px 0 !important;
    font-family: var(--mrcs-display) !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    letter-spacing: -.01em !important;
    color: var(--mrcs-ink) !important;
    text-align: left !important;
    border: 0 !important;
    padding: 0 !important;
}

#mrcs_qbank_app #progressBox h4 {
    font-family: var(--mrcs-mono) !important;
    font-size: 10.5px !important;
    font-weight: 500 !important;
    letter-spacing: .14em !important;
    text-transform: uppercase !important;
    color: var(--mrcs-faint) !important;
    margin: 0 0 12px 0 !important;
}

#mrcs_qbank_app .progress-info {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1px;
    background: var(--mrcs-line-soft);
    border: 1px solid var(--mrcs-line-soft);
    border-radius: var(--mrcs-r-md);
    overflow: hidden;
    margin-bottom: 16px;
}

#mrcs_qbank_app .progress-info p {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 3px !important;
    margin: 0 !important;
    padding: 11px 13px !important;
    background: var(--mrcs-surface) !important;
    border: 0 !important;
    font-family: var(--mrcs-body) !important;
    font-size: 11.5px !important;
    color: var(--mrcs-slate) !important;
}

#mrcs_qbank_app .progress-info p strong,
#mrcs_qbank_app .progress-info p span {
    font-family: var(--mrcs-mono) !important;
    font-size: 17px !important;
    font-weight: 600 !important;
    color: var(--mrcs-ink) !important;
    letter-spacing: -.02em;
}

#mrcs_qbank_app .progress-info p span strong {
    font-size: 17px !important;
}

#mrcs_qbank_app .progress-track,
#mrcs_qbank_app .progress-bar-track {
    height: 4px !important;
    background: var(--mrcs-line-soft) !important;
    border-radius: 100px !important;
    overflow: hidden !important;
    margin-bottom: 4px;
}

#mrcs_qbank_app #progressBar {
    height: 100% !important;
    background: var(--mrcs-blue) !important;
    border-radius: 100px !important;
    transition: width .3s ease !important;
    display: block;
}

#mrcs_qbank_app #visualProgressGrid {
    display: grid !important;
    grid-template-columns: repeat(auto-fill, minmax(30px, 1fr)) !important;
    gap: 6px !important;
}

#mrcs_qbank_app .progress-dot {
    width: auto !important;
    height: auto !important;
    aspect-ratio: 1 !important;
    background: var(--mrcs-surface) !important;
    border: 1px solid var(--mrcs-line) !important;
    border-radius: var(--mrcs-r-sm) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-family: var(--mrcs-mono) !important;
    font-size: 11.5px !important;
    font-weight: 500 !important;
    color: var(--mrcs-faint) !important;
    cursor: pointer;
    transition: all .12s ease !important;
}

#mrcs_qbank_app .progress-dot:hover {
    border-color: var(--mrcs-faint) !important;
    color: var(--mrcs-ink) !important;
}

#mrcs_qbank_app .progress-dot.is-correct {
    background: var(--mrcs-ok-soft) !important;
    border-color: var(--mrcs-ok-line) !important;
    color: var(--mrcs-ok-deep) !important;
}

#mrcs_qbank_app .progress-dot.is-wrong {
    background: var(--mrcs-bad-soft) !important;
    border-color: var(--mrcs-bad-line) !important;
    color: var(--mrcs-bad-deep) !important;
}

#mrcs_qbank_app .progress-dot.is-flagged {
    box-shadow: inset 0 0 0 2px var(--mrcs-amber) !important;
    border-color: var(--mrcs-amber) !important;
}

#mrcs_qbank_app .progress-dot.is-flagged::after {
    content: none !important;
}

#mrcs_qbank_app .progress-dot.is-active {
    background: var(--mrcs-ink) !important;
    border-color: var(--mrcs-ink) !important;
    color: var(--mrcs-surface) !important;
}

#mrcs_qbank_app .grid-pagination {
    grid-column: 1 / -1 !important;
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    gap: 10px !important;
    margin-top: 12px !important;
    padding-top: 12px !important;
    border-top: 1px solid var(--mrcs-line-soft) !important;
}

#mrcs_qbank_app .grid-page-btn {
    background: var(--mrcs-surface) !important;
    border: 1px solid var(--mrcs-line) !important;
    color: var(--mrcs-slate) !important;
    padding: 5px 12px !important;
    border-radius: var(--mrcs-r-sm) !important;
    cursor: pointer !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    transition: all .12s ease !important;
}

#mrcs_qbank_app .grid-page-btn:hover {
    background: var(--mrcs-sunken) !important;
    border-color: var(--mrcs-faint) !important;
    color: var(--mrcs-ink) !important;
}

#mrcs_qbank_app .grid-page-btn:disabled {
    opacity: .35 !important;
    cursor: default !important;
}

#mrcs_qbank_app .grid-page-info {
    font-family: var(--mrcs-mono) !important;
    font-size: 11px !important;
    color: var(--mrcs-faint) !important;
}

#mrcs_qbank_app #results h3 {
    font-family: var(--mrcs-display) !important;
    font-size: 22px !important;
    font-weight: 600 !important;
    color: var(--mrcs-ink) !important;
    margin: 0 0 8px 0 !important;
    border: 0 !important;
    padding: 0 !important;
}

#mrcs_qbank_app #results p {
    font-size: 15px !important;
    color: var(--mrcs-slate) !important;
    margin-bottom: 18px !important;
}

#mrcs_qbank_app #results button {
    background: var(--mrcs-blue) !important;
    color: #fff !important;
    border: none !important;
    padding: 12px 24px !important;
    border-radius: var(--mrcs-r-md) !important;
    font-family: var(--mrcs-body) !important;
    font-weight: 600 !important;
    font-size: 14.5px !important;
    cursor: pointer;
}

#mrcs_qbank_app #results button:hover {
    background: var(--mrcs-blue-deep) !important;
}


/* --------------------------------------------------------------------------
   2. DASHBOARD FOUNDATION
   -------------------------------------------------------------------------- */


.mrcs-dashboard-wrapper {
    margin: 0 auto;
    padding: 0 0 60px;
    font-family: var(--mrcs-body);
    color: var(--mrcs-ink);
    max-width: 1280px;
}

.mrcsb-eyebrow {
    font-family: var(--mrcs-mono);
    font-size: 10.5px;
    font-weight: 500;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--mrcs-faint);
    display: block;
}

.mrcsb-section-h {
    font-family: var(--mrcs-display);
    font-size: 17px;
    font-weight: 600;
    letter-spacing: -.015em;
    color: var(--mrcs-ink);
    margin: 32px 0 14px;
    border: 0;
    padding: 0;
}

.mrcsb-section-h--quiet {
    font-family: var(--mrcs-mono);
    font-size: 10.5px;
    font-weight: 500;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--mrcs-faint);
}

.dash-hero.modern-rank-layout {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 34px;
    background: var(--mrcs-surface);
    border: 1px solid var(--mrcs-line);
    border-radius: var(--mrcs-r-lg);
    box-shadow: var(--mrcs-shadow);
    padding: 26px 28px;
    margin-bottom: 20px;
    overflow: visible;
}

.hero-rank-section {
    flex: 2;
    min-width: 0;
}

.hero-stat {
    flex: 0 0 190px;
    text-align: center;
}

.rank-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 16px;
    margin-bottom: 40px;
}

.rank-header h2 {
    font-family: var(--mrcs-display);
    font-size: 24px;
    font-weight: 600;
    letter-spacing: -.02em;
    color: var(--mrcs-ink);
    margin: 6px 0 8px;
    border: 0;
    padding: 0;
}

.xp-badge {
    background: var(--mrcs-blue-soft);
    border: 1px solid var(--mrcs-blue-line);
    color: var(--mrcs-blue-deep);
    padding: 7px 14px;
    border-radius: 100px;
    font-size: 12.5px;
    font-weight: 500;
    white-space: nowrap;
    box-shadow: none;
}

.xp-rules-text {
    font-size: 13.5px;
    color: var(--mrcs-slate);
}

.xp-rules-text strong {
    font-family: var(--mrcs-mono);
    color: var(--mrcs-ink);
}

.xp-rules-sub {
    display: flex;
    gap: 14px;
    margin-top: 5px;
    font-size: 12.5px;
}

.timeline-container {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    position: relative;
    width: 100%;
    margin-top: 26px;
    overflow: visible;
}

.timeline-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    position: relative;
    flex: 1;
}

.timeline-item:last-child {
    flex: 0;
}

.timeline-marker {
    position: relative;
    width: 100%;
    display: flex;
    justify-content: center;
    margin-bottom: 13px;
}

.marker-icon {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    background: var(--mrcs-surface);
    border: 1px solid var(--mrcs-line);
    color: var(--mrcs-faint);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 17px;
    position: relative;
    z-index: 2;
    transition: all .3s ease;
}

.timeline-line-track {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100%;
    height: 4px;
    background: var(--mrcs-line-soft);
    transform: translateY(-50%);
    z-index: 1;
    border-radius: 100px;
    overflow: hidden;
}

.timeline-line-fill {
    height: 100%;
    width: 0;
    background: var(--mrcs-blue);
    transition: width 1.2s cubic-bezier(.4,0,.2,1);
}

.timeline-content {
    text-align: center;
    opacity: .55;
    transition: opacity .3s;
}

.rank-name {
    display: block;
    font-weight: 500;
    font-size: 12.5px;
    color: var(--mrcs-ink);
    margin-bottom: 2px;
}

.rank-xp {
    font-family: var(--mrcs-mono);
    font-size: 11px;
    color: var(--mrcs-faint);
}

.timeline-item.achieved .marker-icon {
    background: var(--mrcs-blue-soft);
    border-color: var(--mrcs-blue-line);
}

.timeline-item.achieved .timeline-content {
    opacity: 1;
}

.timeline-item.current .marker-icon {
    background: var(--mrcs-blue);
    border-color: var(--mrcs-blue);
    color: #fff;
    box-shadow: 0 0 0 4px var(--mrcs-blue-soft);
}

.timeline-item.current .rank-name {
    color: var(--mrcs-blue-deep);
    font-weight: 600;
}

.timeline-item.current .timeline-content {
    opacity: 1;
}

.current-score-floater {
    position: absolute;
    top: -46px;
    left: 50%;
    transform: translateX(-50%);
    background: var(--mrcs-ink);
    color: #fff;
    padding: 5px 11px;
    border-radius: var(--mrcs-r-sm);
    font-family: var(--mrcs-mono);
    font-weight: 500;
    font-size: 12px;
    white-space: nowrap;
    z-index: 20;
    pointer-events: none;
}

.current-score-floater::after {
    content: "";
    position: absolute;
    bottom: -5px;
    left: 50%;
    margin-left: -5px;
    border-width: 5px 5px 0;
    border-style: solid;
    border-color: var(--mrcs-ink) transparent transparent transparent;
}

.donut-chart {
    position: relative;
    width: 130px;
    height: 130px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto;
    background: var(--mrcs-line-soft);
}

.donut-inner {
    width: 104px;
    height: 104px;
    background: var(--mrcs-surface);
    border-radius: 50%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.big-percent {
    font-family: var(--mrcs-mono);
    font-size: 26px;
    font-weight: 600;
    letter-spacing: -.02em;
    color: var(--mrcs-ink);
    line-height: 1;
}

.donut-inner .label {
    font-size: 10.5px;
    text-transform: uppercase;
    letter-spacing: .1em;
    color: var(--mrcs-faint);
    font-family: var(--mrcs-mono);
    margin-top: 3px;
}

.stat-pills-row {
    display: flex;
    gap: 8px;
    justify-content: center;
    margin-top: 12px;
}

.d-pill {
    font-family: var(--mrcs-mono);
    font-size: 11.5px;
    padding: 4px 10px;
    border-radius: 100px;
    border: 1px solid var(--mrcs-line);
}

.d-pill.correct {
    background: var(--mrcs-ok-soft);
    border-color: var(--mrcs-ok-line);
    color: var(--mrcs-ok-deep);
}

.d-pill.wrong {
    background: var(--mrcs-bad-soft);
    border-color: var(--mrcs-bad-line);
    color: var(--mrcs-bad-deep);
}

.mini-ring {
    width: 46px;
    height: 46px;
    border-radius: 50%;
    background: var(--mrcs-line-soft);
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    box-shadow: none;
}

.mini-ring::after {
    content: "";
    width: 36px;
    height: 36px;
    background: var(--mrcs-surface);
    border-radius: 50%;
    position: absolute;
}

.ring-text {
    position: relative;
    z-index: 2;
    font-family: var(--mrcs-mono);
    font-size: 12px;
    font-weight: 600;
    color: var(--mrcs-ink);
}

.smart-stats-row {
    display: flex;
    gap: 14px;
    margin-bottom: 24px;
}

.smart-card {
    flex: 1;
    background: var(--mrcs-surface);
    border: 1px solid var(--mrcs-line);
    border-radius: var(--mrcs-r-lg);
    padding: 15px 18px;
    display: flex;
    align-items: center;
    gap: 13px;
    box-shadow: none;
}

.smart-card.clickable {
    cursor: pointer;
    transition: border-color .14s ease, background .14s ease;
}

.smart-card.clickable:hover {
    border-color: var(--mrcs-blue);
    background: var(--mrcs-blue-soft);
}

.smart-icon {
    width: 38px;
    height: 38px;
    border-radius: var(--mrcs-r-sm);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    background: var(--mrcs-sunken);
    border: 1px solid var(--mrcs-line);
    flex-shrink: 0;
}

.smart-content {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.smart-label {
    font-family: var(--mrcs-mono);
    font-size: 10px;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--mrcs-faint);
}

.smart-value {
    font-family: var(--mrcs-body);
    font-size: 15px;
    font-weight: 600;
    color: var(--mrcs-ink);
    margin-top: 2px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.smart-sub {
    font-size: 12px;
    color: var(--mrcs-slate);
    margin-top: 1px;
}

#btnSmartQuiz {
    display: flex;
    width: 100%;
    margin: 0 0 14px;
    background: var(--mrcs-surface);
    border: 1px solid var(--mrcs-blue-line);
    border-left: 3px solid var(--mrcs-blue);
    border-radius: var(--mrcs-r-lg);
    cursor: pointer;
    box-shadow: none;
    transition: border-color .14s ease, background .14s ease;
    box-sizing: border-box;
    align-items: flex-start;
    gap: 18px;
    padding: 22px 26px;
}

#btnSmartQuiz:hover {
    background: var(--mrcs-blue-soft);
}

#btnSmartQuiz h3 {
    font-family: var(--mrcs-display);
    font-weight: 600;
    color: var(--mrcs-ink);
    border: 0;
    padding: 0;
    font-size: 16px !important;
    line-height: 1.35;
    margin: 0 0 12px !important;
}

#btnSmartQuiz p {
    margin: 4px 0 0;
    font-size: 13.5px;
    color: var(--mrcs-slate);
}

.smart-quiz-btn-icon {
    width: 40px;
    height: auto;
    flex-shrink: 0;
}

.secondary-menu-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    gap: 14px;
    margin-bottom: 26px;
}

#btnMock, #btnRandom, #btnBetweenCases {
    display: flex;
    align-items: flex-start;
    gap: 13px;
    background: var(--mrcs-surface);
    border: 1px solid var(--mrcs-line);
    border-radius: var(--mrcs-r-lg);
    padding: 16px 18px;
    cursor: pointer;
    box-shadow: none;
    transition: border-color .14s ease, background .14s ease;
    box-sizing: border-box;
}

#btnMock:hover, #btnRandom:hover, #btnBetweenCases:hover {
    border-color: var(--mrcs-faint);
    background: var(--mrcs-sunken);
}

#btnMock > span, #btnRandom > span, #btnBetweenCases > span {
    font-size: 20px;
    line-height: 1.2;
}

#btnMock h3, #btnRandom h3, #btnBetweenCases h3 {
    font-family: var(--mrcs-display);
    font-size: 15px;
    font-weight: 600;
    color: var(--mrcs-ink);
    margin: 0;
    border: 0;
    padding: 0;
}

#btnMock p, #btnRandom p, #btnBetweenCases p {
    margin: 3px 0 0;
    font-size: 12.5px;
    color: var(--mrcs-slate);
    line-height: 1.45;
}

.topic-split-card {
    display: flex;
    align-items: stretch;
    justify-content: space-between;
    background: var(--mrcs-surface);
    border: 1px solid var(--mrcs-line);
    border-radius: var(--mrcs-r-lg);
    margin-bottom: 12px;
    overflow: hidden;
    min-height: 88px;
    transition: border-color .14s ease;
}

.topic-split-card:hover {
    border-color: var(--mrcs-faint);
    transform: none;
    box-shadow: none;
}

.topic-main-info {
    flex: 2;
    padding: 18px 22px;
    border-right: 1px solid var(--mrcs-line-soft);
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.topic-main-info h4 {
    font-family: var(--mrcs-display);
    font-size: 16px;
    font-weight: 600;
    color: var(--mrcs-ink);
    margin: 0 0 4px;
    border: 0;
    padding: 0;
}

.topic-meta-counts {
    font-family: var(--mrcs-mono);
    font-size: 11.5px;
    color: var(--mrcs-faint);
    display: flex;
    gap: 14px;
}

.topic-stats-area {
    flex: 2;
    display: flex;
    align-items: center;
    justify-content: space-around;
    padding: 12px 20px;
    gap: 16px;
}

.stat-group-linear {
    display: flex;
    flex-direction: column;
    width: 130px;
}

.stat-label {
    font-family: var(--mrcs-mono);
    font-size: 10px;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--mrcs-faint);
    margin-bottom: 5px;
}

.topic-progress-track {
    width: 100%;
    height: 5px;
    background: var(--mrcs-line-soft);
    border-radius: 100px;
    overflow: hidden;
}

.topic-progress-fill {
    height: 100%;
    background: var(--mrcs-blue);
    border-radius: 100px;
}

.stat-value-text {
    font-family: var(--mrcs-mono);
    font-size: 12px;
    color: var(--mrcs-slate);
    margin-top: 5px;
}

.stat-group-circle {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 5px;
}

.topic-actions {
    flex: 1;
    display: flex;
    flex-direction: column;
    border-left: 1px solid var(--mrcs-line-soft);
}

.btn-topic-start {
    flex: 1;
    background: var(--mrcs-blue);
    border: none;
    color: #fff;
    font-family: var(--mrcs-body);
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 14px;
    transition: background .14s ease;
}

.btn-topic-start:hover {
    background: var(--mrcs-blue-deep);
}

.btn-topic-start.btn-locked {
    background: var(--mrcs-faint);
}

.btn-topic-subs {
    padding: 10px;
    text-align: center;
    font-size: 12px;
    color: var(--mrcs-blue);
    background: var(--mrcs-surface);
    border-top: 1px solid var(--mrcs-line-soft);
    cursor: pointer;
    font-weight: 500;
}

.btn-topic-subs:hover {
    background: var(--mrcs-blue-soft);
}

.btn-topic-subs.is-disabled,
.topic-drill-disabled {
    opacity: .35;
    cursor: default;
    pointer-events: none;
}

.sub-menu-options {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-top: 18px;
}

.sub-menu-btn {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    padding: 17px 22px;
    background: var(--mrcs-surface);
    border: 1px solid var(--mrcs-line);
    border-radius: var(--mrcs-r-lg);
    font-family: var(--mrcs-body);
    font-size: 15px;
    font-weight: 500;
    color: var(--mrcs-ink);
    cursor: pointer;
    transition: border-color .14s ease, background .14s ease;
    box-sizing: border-box;
}

.sub-menu-btn:hover {
    border-color: var(--mrcs-faint);
    background: var(--mrcs-sunken);
    transform: none;
}

.sub-menu-btn small {
    font-family: var(--mrcs-mono);
    font-size: 12.5px;
    color: var(--mrcs-faint);
}

#mrcs-trial-cta {
    background: var(--mrcs-surface);
    border: 1px solid var(--mrcs-line);
    border-top: 3px solid var(--mrcs-blue);
    border-radius: var(--mrcs-r-lg);
    padding: 30px;
    margin-bottom: 26px;
    text-align: center;
    box-shadow: var(--mrcs-shadow);
}

.mrcsb-cta-eyebrow {
    font-family: var(--mrcs-mono);
    font-size: 10.5px;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--mrcs-faint);
    margin-bottom: 8px;
}

#mrcs-trial-cta h2 {
    font-family: var(--mrcs-display);
    font-size: 24px;
    font-weight: 600;
    letter-spacing: -.02em;
    color: var(--mrcs-ink);
    margin: 0 0 10px;
    border: 0;
    padding: 0;
}

#mrcs-trial-cta p {
    font-size: 14.5px;
    color: var(--mrcs-slate);
    max-width: 56ch;
    margin: 0 auto 20px;
    line-height: 1.6;
}

#btnStartLockedTrial {
    background: var(--mrcs-blue);
    color: #fff;
    border: none;
    padding: 13px 32px;
    font-family: var(--mrcs-body);
    font-size: 15px;
    font-weight: 600;
    border-radius: var(--mrcs-r-md);
    cursor: pointer;
    transition: background .14s ease;
}

#btnStartLockedTrial:hover {
    background: var(--mrcs-blue-deep);
}

.mrcsb-cta-foot {
    margin-top: 12px;
    font-size: 12.5px;
    color: var(--mrcs-faint);
}

.mrcsb-smart-title {
    font-family: var(--mrcs-display);
    font-size: 26px;
    font-weight: 600;
    color: var(--mrcs-ink);
    margin: 14px 0 6px;
    border: 0;
    padding: 0;
}

.mrcsb-smart-sub {
    font-size: 14.5px;
    color: var(--mrcs-slate);
    margin-bottom: 26px;
}

.smart-algo-list {
    text-align: left;
    max-width: 460px;
    margin: 0 auto 30px;
    background: var(--mrcs-sunken);
    border: 1px solid var(--mrcs-line);
    border-radius: var(--mrcs-r-lg);
    padding: 20px;
}

.smart-algo-item {
    display: flex;
    align-items: flex-start;
    gap: 13px;
    margin-bottom: 16px;
}

.smart-algo-item:last-child {
    margin-bottom: 0;
}

.smart-algo-item strong {
    font-size: 14px;
    color: var(--mrcs-ink);
}

.smart-algo-item span {
    font-size: 13px;
    color: var(--mrcs-slate);
}

.smart-algo-icon {
    width: 26px;
    height: 26px;
    background: var(--mrcs-blue-soft);
    border: 1px solid var(--mrcs-blue-line);
    color: var(--mrcs-blue-deep);
    border-radius: var(--mrcs-r-sm);
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: var(--mrcs-mono);
    font-size: 12px;
    font-weight: 600;
    flex-shrink: 0;
}

.mrcsb-btn-primary-lg {
    background: var(--mrcs-blue);
    color: #fff;
    border: none;
    padding: 14px 36px;
    font-family: var(--mrcs-body);
    font-size: 15px;
    font-weight: 600;
    border-radius: var(--mrcs-r-md);
    cursor: pointer;
}

.mrcsb-btn-primary-lg:hover {
    background: var(--mrcs-blue-deep);
}

.smart-logo-anim {
    width: 76px;
    height: auto;
    animation: mrcsbSpin 10s linear infinite;
}

.smart-logo-anim.generating {
    animation-duration: 1.2s;
}

.smart-logo-anim.hyper-speed {
    animation-duration: .15s;
}

.mrcsb-loading {
    text-align: center;
    padding: 44px 20px;
}

.mrcsb-spinner {
    border: 3px solid var(--mrcs-line-soft);
    border-top-color: var(--mrcs-blue);
    border-radius: 50%;
    width: 32px;
    height: 32px;
    animation: mrcsbSpin 1s linear infinite;
    margin: 0 auto 16px;
}

.mrcsb-reset-link {
    background: none;
    border: none;
    color: var(--mrcs-faint);
    text-decoration: underline;
    cursor: pointer;
    font-family: var(--mrcs-body);
    font-size: 12.5px;
}

.mrcsb-reset-link:hover {
    color: var(--mrcs-slate);
}

.mrcsb-map-wrap {
    margin-top: 22px;
    border-top: 1px solid var(--mrcs-line-soft);
    padding-top: 16px;
}

.section-title {
    font-family: var(--mrcs-display);
    font-size: 17px;
    font-weight: 600;
    color: var(--mrcs-ink);
    margin: 32px 0 14px;
    border: 0;
    padding: 0;
    display: block;
}

.section-title::before {
    content: none;
}

.papers-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 14px;
    margin-bottom: 24px;
}

.paper-card {
    background: var(--mrcs-surface);
    border: 1px solid var(--mrcs-line);
    border-radius: var(--mrcs-r-lg);
    overflow: hidden;
    box-shadow: none;
    transition: border-color .14s ease;
}

.paper-card::before {
    content: none;
}

.paper-card.dashboard-link:hover {
    border-color: var(--mrcs-blue);
    transform: none;
    box-shadow: var(--mrcs-shadow);
}

.paper-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 18px 8px;
    gap: 10px;
}

.paper-head h4 {
    font-family: var(--mrcs-display);
    font-size: 14.5px;
    font-weight: 600;
    color: var(--mrcs-ink);
    margin: 0;
    border: 0;
    padding: 0;
}

.paper-badge {
    font-family: var(--mrcs-mono);
    font-size: 12.5px;
    font-weight: 600;
    color: #fff;
    padding: 3px 10px;
    border-radius: 100px;
    flex-shrink: 0;
}

.paper-stats {
    display: flex;
    gap: 18px;
    padding: 0 18px 12px;
    font-size: 12.5px;
    color: var(--mrcs-slate);
}

.paper-stats b {
    font-family: var(--mrcs-mono);
    color: var(--mrcs-ink);
}

.mini-track {
    margin: 0 18px 16px;
    height: 5px;
    background: var(--mrcs-line-soft);
    border-radius: 100px;
    overflow: hidden;
}

.mini-fill {
    height: 100%;
    border-radius: 100px;
}

.dash-grid-body {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
    margin-top: 24px;
}

.dash-panel {
    background: var(--mrcs-surface);
    border: 1px solid var(--mrcs-line);
    border-radius: var(--mrcs-r-lg);
    overflow: hidden;
    box-shadow: none;
}

.panel-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 15px 18px;
    border-bottom: 1px solid var(--mrcs-line-soft);
}

.panel-head h3 {
    font-family: var(--mrcs-display);
    font-size: 14.5px;
    font-weight: 600;
    color: var(--mrcs-ink);
    margin: 0;
    border: 0;
    padding: 0;
}

.panel-head small {
    font-family: var(--mrcs-mono);
    font-size: 10px;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--mrcs-faint);
}

.weak-panel .panel-head {
    border-left: 3px solid var(--mrcs-bad);
}

.strong-panel .panel-head {
    border-left: 3px solid var(--mrcs-ok);
}

.topic-bars {
    padding: 6px 0;
}

.topic-bar-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 18px;
    font-size: 13.5px;
    border-bottom: 1px solid var(--mrcs-line-soft);
    gap: 12px;
}

.topic-bar-item:last-child {
    border-bottom: none;
}

.topic-bar-item:hover {
    background: var(--mrcs-sunken);
}

.topic-bar-item span:first-child {
    flex: 1;
    font-weight: 500;
    color: var(--mrcs-ink);
}

.topic-bar-item span:last-child {
    font-family: var(--mrcs-mono);
    font-weight: 600;
    min-width: 40px;
    text-align: right;
}

.empty-state {
    padding: 26px 18px;
    text-align: center;
    color: var(--mrcs-faint);
    font-size: 13.5px;
}

.mrcs-dashboard-login-msg {
    padding: 40px;
    text-align: center;
    font-family: var(--mrcs-body);
    color: var(--mrcs-slate);
}


/* --------------------------------------------------------------------------
   3. DASHBOARD COMPONENTS
   -------------------------------------------------------------------------- */


.mrcsb-register {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    background: var(--mrcs-surface);
    border: 1px solid var(--mrcs-line);
    border-radius: var(--mrcs-r-lg);
    overflow: hidden;
    margin-bottom: 20px;
}

.mrcsb-reg-cell {
    border-left: 1px solid var(--mrcs-line-soft);
    padding: 16px 20px;
}

.mrcsb-reg-cell:first-child {
    border-left: 0;
}

.mrcsb-reg-val {
    font-family: var(--mrcs-mono);
    font-size: 23px;
    font-weight: 600;
    letter-spacing: -.02em;
    line-height: 1.1;
    color: var(--mrcs-ink);
    display: block;
    margin-bottom: 3px;
}

.mrcsb-reg-val--word {
    font-family: var(--mrcs-display);
    font-size: 17px;
    letter-spacing: -.015em;
}

.mrcsb-reg-val small {
    font-size: 13px;
    font-weight: 400;
    color: var(--mrcs-faint);
}

.mrcsb-reg-lab {
    font-size: 11.5px;
    color: var(--mrcs-slate);
}

.mrcsb-band {
    display: flex;
    background: var(--mrcs-surface);
    border: 1px solid var(--mrcs-line);
    border-radius: var(--mrcs-r-lg);
    box-shadow: var(--mrcs-shadow);
    margin-bottom: 20px;
    padding: 32px 34px;
    gap: 40px;
    align-items: center;
}

.mrcsb-band-body {
    flex: 1;
    min-width: 0;
}

.mrcsb-band h1 {
    font-family: var(--mrcs-display);
    font-weight: 600;
    color: var(--mrcs-ink);
    border: 0;
    padding: 0;
    font-size: 30px;
    line-height: 1.15;
    letter-spacing: -.025em;
    margin: 8px 0 6px;
}

.mrcsb-band p {
    margin: 0 0 18px;
    color: var(--mrcs-slate);
    font-size: 14.5px;
    max-width: 56ch;
    line-height: 1.6;
    margin-bottom: 20px;
}

.mrcsb-band p b {
    color: var(--mrcs-ink);
    font-weight: 600;
}

.mrcsb-btn-row {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

.mrcsb-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 11px 20px;
    border-radius: var(--mrcs-r-md);
    font-family: var(--mrcs-body);
    font-weight: 600;
    font-size: 14.5px;
    cursor: pointer;
    border: 1px solid transparent;
    transition: background .14s ease, border-color .14s ease, color .14s ease;
}

.mrcsb-btn-primary {
    background: var(--mrcs-blue);
    color: #fff;
    border-color: var(--mrcs-blue);
}

.mrcsb-btn-primary:hover {
    background: var(--mrcs-blue-deep);
    border-color: var(--mrcs-blue-deep);
}

.mrcsb-btn-ghost {
    border-color: var(--mrcs-line);
    color: var(--mrcs-ink);
    background: var(--mrcs-surface);
}

.mrcsb-btn-ghost:hover {
    border-color: var(--mrcs-faint);
    background: var(--mrcs-sunken);
}

.mrcsb-btn:disabled {
    opacity: .4;
    cursor: default;
}

.mrcsb-btn:disabled:hover {
    border-color: var(--mrcs-line);
    background: var(--mrcs-surface);
}

.mrcsb-dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--mrcs-amber);
    flex-shrink: 0;
}

.mrcsb-btn:disabled .mrcsb-dot {
    background: var(--mrcs-faint);
}

.mrcsb-resume-caption {
    margin-top: 13px;
    font-family: var(--mrcs-mono);
    font-size: 11.5px;
    color: var(--mrcs-faint);
}

.mrcsb-resume-caption b {
    color: var(--mrcs-slate);
    font-weight: 500;
}

.mrcsb-ring-block {
    text-align: center;
    flex-shrink: 0;
    opacity: .92;
}

.mrcsb-ring {
    position: relative;
    width: 120px;
    height: 120px;
}

.mrcsb-ring svg {
    transform: rotate(-90deg);
}

.mrcsb-ring circle {
    transition: stroke-dashoffset 1s ease;
}

.mrcsb-ring-mid {
    position: absolute;
    inset: 0;
    display: grid;
    place-content: center;
    text-align: center;
}

.mrcsb-ring-mid .v {
    font-family: var(--mrcs-mono);
    font-size: 26px;
    font-weight: 600;
    letter-spacing: -.02em;
    line-height: 1;
    color: var(--mrcs-ink);
}

.mrcsb-ring-mid .l {
    font-size: 11px;
    color: var(--mrcs-faint);
    margin-top: 2px;
}

.mrcsb-ring-note {
    font-size: 12px;
    color: var(--mrcs-slate);
    margin-top: 9px;
}

.mrcsb-grid-2 {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
    gap: 20px;
    align-items: stretch;
}

.mrcsb-col {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.mrcsb-card {
    background: var(--mrcs-surface);
    border: 1px solid var(--mrcs-line);
    border-radius: var(--mrcs-r-lg);
    overflow: hidden;
}

.mrcsb-card-head {
    padding: 15px 20px;
    border-bottom: 1px solid var(--mrcs-line-soft);
    display: flex;
    align-items: center;
    gap: 12px;
}

.mrcsb-card-head h2 {
    font-family: var(--mrcs-display);
    font-size: 15.5px;
    font-weight: 600;
    color: var(--mrcs-ink);
    margin: 0;
    border: 0;
    padding: 0;
}

.mrcsb-card-head .mrcsb-eyebrow {
    margin-left: auto;
}

.mrcsb-card-body {
    padding: 8px 0;
}

.mrcsb-topic-row {
    display: grid;
    grid-template-columns: 1fr 116px 54px;
    align-items: center;
    gap: 14px;
    width: 100%;
    text-align: left;
    padding: 11px 20px;
    background: none;
    border: 0;
    border-bottom: 1px solid var(--mrcs-line-soft);
    cursor: pointer;
    font-family: var(--mrcs-body);
}

.mrcsb-topic-row:last-child {
    border-bottom: 0;
}

.mrcsb-topic-row:hover {
    background: var(--mrcs-sunken);
}

.mrcsb-topic-name {
    font-size: 14px;
    font-weight: 500;
    color: var(--mrcs-ink);
}

.mrcsb-topic-sub {
    font-family: var(--mrcs-mono);
    font-size: 11px;
    color: var(--mrcs-faint);
    margin-top: 1px;
}

.mrcsb-bar {
    height: 5px;
    border-radius: 100px;
    background: var(--mrcs-line-soft);
    overflow: hidden;
}

.mrcsb-bar span {
    display: block;
    height: 100%;
    border-radius: 100px;
    background: var(--mrcs-ok);
}

.mrcsb-bar.weak span {
    background: var(--mrcs-bad);
}

.mrcsb-bar.mid span {
    background: var(--mrcs-amber);
}

.mrcsb-topic-pct {
    font-family: var(--mrcs-mono);
    font-size: 14px;
    font-weight: 600;
    text-align: right;
    color: var(--mrcs-ink);
}

.mrcsb-topic-pct.weak {
    color: var(--mrcs-bad);
}

.mrcsb-topic-pct.mid {
    color: var(--mrcs-amber);
}

.mrcsb-queue {
    display: flex;
    align-items: center;
    gap: 13px;
    padding: 13px 20px;
    width: 100%;
    text-align: left;
    background: none;
    border: 0;
    border-bottom: 1px solid var(--mrcs-line-soft);
    cursor: pointer;
    font-family: var(--mrcs-body);
}

.mrcsb-queue:last-child {
    border-bottom: 0;
}

.mrcsb-queue:hover {
    background: var(--mrcs-sunken);
}

.mrcsb-queue-chip {
    min-width: 38px;
    height: 34px;
    padding: 0 8px;
    border-radius: var(--mrcs-r-sm);
    display: grid;
    place-items: center;
    flex-shrink: 0;
    font-family: var(--mrcs-mono);
    font-size: 12px;
    font-weight: 600;
    background: var(--mrcs-sunken);
    border: 1px solid var(--mrcs-line);
    color: var(--mrcs-slate);
}

.mrcsb-queue-chip.wrong {
    background: var(--mrcs-bad-soft);
    border-color: var(--mrcs-bad-line);
    color: var(--mrcs-bad-deep);
}

.mrcsb-queue-chip.new {
    background: var(--mrcs-blue-soft);
    border-color: var(--mrcs-blue-line);
    color: var(--mrcs-blue-deep);
}

.mrcsb-queue-t {
    font-size: 14px;
    font-weight: 500;
    color: var(--mrcs-ink);
}

.mrcsb-queue-s {
    font-size: 12.5px;
    color: var(--mrcs-slate);
}

.mrcsb-queue-go {
    margin-left: auto;
    color: var(--mrcs-faint);
    font-size: 18px;
}

.mrcsb-rank-row {
    display: flex;
    align-items: center;
    gap: 11px;
    padding: 9px 20px;
    font-size: 13.5px;
    color: var(--mrcs-faint);
}

.mrcsb-rank-ico {
    font-size: 15px;
    filter: grayscale(1);
    opacity: .5;
}

.mrcsb-rank-name {
    flex: 1;
}

.mrcsb-rank-xp {
    font-family: var(--mrcs-mono);
    font-size: 11.5px;
}

.mrcsb-rank-row.done {
    color: var(--mrcs-slate);
}

.mrcsb-rank-row.done .mrcsb-rank-ico {
    filter: none;
    opacity: 1;
}

.mrcsb-rank-row.now {
    color: var(--mrcs-blue-deep);
    font-weight: 600;
    background: var(--mrcs-blue-soft);
    border-left: 3px solid var(--mrcs-blue);
    padding-left: 17px;
}

.mrcsb-lock-note {
    display: inline-block;
    margin-top: 4px;
    font-size: 12.5px;
    font-weight: 600;
    color: var(--mrcs-amber);
}

#btnSmartQuiz.is-locked {
    border-left-color: var(--mrcs-faint);
    opacity: 1 !important;
    cursor: pointer;
    background: var(--mrcs-sunken) !important;
    border-color: var(--mrcs-line) !important;
    border-left: 3px solid var(--mrcs-line) !important;
}


/* --------------------------------------------------------------------------
   4. SET BUILDER MODAL
   -------------------------------------------------------------------------- */


.mrcsb-scrim {
    position: fixed;
    inset: 0;
    background: rgba(12,22,32,.5);
    z-index: 100200;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 44px 18px;
    overflow-y: auto;
    font-family: var(--mrcs-body);
    --mrcs-blue: #0078D7;
    --mrcs-blue-deep: #005A9C;
    --mrcs-blue-soft: #EAF4FD;
    --mrcs-blue-line: #BEDDF6;
    --mrcs-ink: #12202E;
    --mrcs-slate: #566878;
    --mrcs-faint: #8795A3;
    --mrcs-line: #DCE3EA;
    --mrcs-line-soft: #E9EEF3;
    --mrcs-surface: #FFFFFF;
    --mrcs-sunken: #F5F8FB;
    --mrcs-r-lg: 14px;
    --mrcs-r-md: 10px;
    --mrcs-r-sm: 6px;
    --mrcs-mono: "IBM Plex Mono",ui-monospace,monospace;
    --mrcs-display: "Archivo",system-ui,sans-serif;
    --mrcs-body: "Inter",system-ui,sans-serif;
}

.mrcsb-sheet {
    width: 100%;
    max-width: 660px;
    background: var(--mrcs-surface);
    border: 1px solid var(--mrcs-line);
    border-radius: var(--mrcs-r-lg);
    box-shadow: 0 2px 4px rgba(18,32,46,.06), 0 18px 42px rgba(18,32,46,.18);
    overflow: hidden;
    animation: mrcsbPop .2s ease-out;
}

.mrcsb-sheet-head {
    padding: 20px 24px;
    border-bottom: 1px solid var(--mrcs-line-soft);
    display: flex;
    align-items: flex-start;
    gap: 14px;
}

.mrcsb-sheet-head h2 {
    font-family: var(--mrcs-display);
    font-size: 19px;
    font-weight: 600;
    color: var(--mrcs-ink);
    margin: 0;
    border: 0;
    padding: 0;
}

.mrcsb-sheet-head p {
    margin: 4px 0 0;
    font-size: 13.5px;
    color: var(--mrcs-slate);
}

.mrcsb-sheet-close {
    margin-left: auto;
    width: 32px;
    height: 32px;
    border-radius: var(--mrcs-r-sm);
    border: 1px solid var(--mrcs-line);
    background: var(--mrcs-surface);
    color: var(--mrcs-slate);
    font-size: 18px;
    line-height: 1;
    cursor: pointer;
    flex-shrink: 0;
}

.mrcsb-sheet-close:hover {
    background: var(--mrcs-sunken);
    color: var(--mrcs-ink);
}

.mrcsb-sheet-body {
    padding: 22px 24px;
}

.mrcsb-sheet-sec {
    margin-bottom: 24px;
}

.mrcsb-sheet-sec:last-child {
    margin-bottom: 0;
}

.mrcsb-sheet-sec > .mrcsb-eyebrow {
    display: block;
    margin-bottom: 10px;
}

.mrcsb-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.mrcsb-chip {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 13px;
    border-radius: 100px;
    border: 1px solid var(--mrcs-line);
    background: var(--mrcs-surface);
    color: var(--mrcs-ink);
    font-family: var(--mrcs-body);
    font-size: 13.5px;
    font-weight: 500;
    cursor: pointer;
    transition: all .12s ease;
}

.mrcsb-chip:hover {
    border-color: var(--mrcs-faint);
}

.mrcsb-chip.on {
    background: var(--mrcs-blue-soft);
    border-color: var(--mrcs-blue);
    color: var(--mrcs-blue-deep);
}

.mrcsb-chip-n {
    font-family: var(--mrcs-mono);
    font-size: 11.5px;
    color: var(--mrcs-faint);
}

.mrcsb-chip.on .mrcsb-chip-n {
    color: var(--mrcs-blue-deep);
}

.mrcsb-chip-dashed {
    border-style: dashed;
    margin-top: 10px;
}

.mrcsb-rows {
    display: flex;
    flex-direction: column;
    border: 1px solid var(--mrcs-line);
    border-radius: var(--mrcs-r-md);
    overflow: hidden;
}

.mrcsb-srow {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 15px;
    width: 100%;
    text-align: left;
    background: var(--mrcs-surface);
    border: 0;
    border-bottom: 1px solid var(--mrcs-line-soft);
    cursor: pointer;
    font-family: var(--mrcs-body);
}

.mrcsb-srow:last-child {
    border-bottom: 0;
}

.mrcsb-srow:hover {
    background: var(--mrcs-sunken);
}

.mrcsb-radio {
    width: 16px;
    height: 16px;
    border-radius: 50%;
    border: 1.5px solid var(--mrcs-line);
    flex-shrink: 0;
    display: grid;
    place-items: center;
}

.mrcsb-srow.on .mrcsb-radio {
    border-color: var(--mrcs-blue);
}

.mrcsb-srow.on .mrcsb-radio::after {
    content: "";
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--mrcs-blue);
}

.mrcsb-srow-t {
    font-size: 14px;
    font-weight: 500;
    color: var(--mrcs-ink);
}

.mrcsb-srow-s {
    font-size: 12.5px;
    color: var(--mrcs-slate);
}

.mrcsb-srow-n {
    margin-left: auto;
    font-family: var(--mrcs-mono);
    font-size: 12.5px;
    color: var(--mrcs-faint);
}

.mrcsb-seg {
    display: flex;
    flex-wrap: wrap;
    border: 1px solid var(--mrcs-line);
    border-radius: var(--mrcs-r-md);
    overflow: hidden;
    width: fit-content;
}

.mrcsb-seg button {
    padding: 8px 16px;
    font-family: var(--mrcs-body);
    font-size: 13.5px;
    font-weight: 500;
    color: var(--mrcs-slate);
    background: var(--mrcs-surface);
    border: 0;
    border-right: 1px solid var(--mrcs-line);
    cursor: pointer;
}

.mrcsb-seg button:last-child {
    border-right: 0;
}

.mrcsb-seg button.on {
    background: var(--mrcs-blue);
    color: #fff;
}

.mrcsb-toggle-row {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 13px 15px;
    border: 1px solid var(--mrcs-line);
    border-radius: var(--mrcs-r-md);
}

.mrcsb-switch {
    margin-left: auto;
    width: 40px;
    height: 23px;
    border-radius: 100px;
    background: var(--mrcs-line);
    position: relative;
    flex-shrink: 0;
    cursor: pointer;
    transition: background .15s ease;
}

.mrcsb-switch::after {
    content: "";
    position: absolute;
    top: 3px;
    left: 3px;
    width: 17px;
    height: 17px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 1px 2px rgba(0,0,0,.2);
    transition: transform .15s ease;
}

.mrcsb-switch.on {
    background: var(--mrcs-blue);
}

.mrcsb-switch.on::after {
    transform: translateX(17px);
}

.mrcsb-sheet-foot {
    padding: 16px 24px;
    border-top: 1px solid var(--mrcs-line-soft);
    background: var(--mrcs-sunken);
    display: flex;
    align-items: center;
    gap: 12px;
}

.mrcsb-pool-count {
    font-family: var(--mrcs-mono);
    font-size: 12.5px;
    color: var(--mrcs-slate);
}

.mrcsb-pool-count b {
    color: var(--mrcs-ink);
    font-weight: 600;
}

.mrcsb-sheet-foot .mrcsb-btn-primary {
    margin-left: auto;
    padding: 11px 20px;
    border-radius: var(--mrcs-r-md);
    background: var(--mrcs-blue);
    color: #fff;
    border: 0;
    font-family: var(--mrcs-body);
    font-size: 14.5px;
    font-weight: 600;
    cursor: pointer;
}

.mrcsb-sheet-foot .mrcsb-btn-primary:hover {
    background: var(--mrcs-blue-deep);
}

.mrcsb-sheet-foot .mrcsb-btn-primary:disabled {
    opacity: .45;
    cursor: default;
}


/* --------------------------------------------------------------------------
   5. KEYBOARD / INTERACTION
   -------------------------------------------------------------------------- */


#mrcs_qbank_app .mrcsb-kbd-hint {
    margin-top: 16px;
    font-family: var(--mrcs-mono);
    font-size: 11px;
    color: var(--mrcs-faint);
    display: flex;
    align-items: center;
    gap: 5px;
    flex-wrap: wrap;
}

#mrcs_qbank_app .mrcsb-kbd-hint b {
    display: inline-block;
    border: 1px solid var(--mrcs-line);
    border-bottom-width: 2px;
    border-radius: 4px;
    padding: 1px 6px;
    color: var(--mrcs-slate);
    font-weight: 500;
    background: var(--mrcs-surface);
    line-height: 1.5;
}


/* --------------------------------------------------------------------------
   6. DASHBOARD — CONSOLIDATED FINAL STATE
   -------------------------------------------------------------------------- */


.mrcsb-resume-card {
    border-color: var(--mrcs-blue-line);
    border: 1px solid var(--mrcs-line);
    border-left: 1px solid var(--mrcs-line);
}

.mrcsb-resume-title {
    font-family: var(--mrcs-display);
    font-size: 16px;
    font-weight: 600;
    letter-spacing: -.015em;
    color: var(--mrcs-ink);
    flex-wrap: wrap;
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
    margin-bottom: 18px;
}

.mrcsb-resume-tag {
    font-family: var(--mrcs-mono);
    font-size: 10px;
    font-weight: 500;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--mrcs-amber);
    background: var(--mrcs-amber-soft);
    border: 1px solid var(--mrcs-amber-line);
    padding: 2px 7px;
    border-radius: 100px;
}

.mrcsb-resume-track {
    background: var(--mrcs-line-soft);
    border-radius: 100px;
    overflow: hidden;
    height: 6px;
    margin-bottom: 18px;
}

.mrcsb-resume-track span {
    display: block;
    height: 100%;
    background: var(--mrcs-blue);
    border-radius: 100px;
    min-width: 6px;
}

.mrcsb-resume-stats {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    border-top: 1px solid var(--mrcs-line-soft);
    border-bottom: 1px solid var(--mrcs-line-soft);
    background: var(--mrcs-sunken);
    border: 1px solid var(--mrcs-line-soft);
    border-radius: var(--mrcs-r-md);
    gap: 0;
    padding: 2px 0;
    overflow: hidden;
    margin-bottom: 20px;
}

.mrcsb-resume-stats > div {
    display: flex;
    flex-direction: column;
    background: transparent;
    align-items: center;
    text-align: center;
    gap: 3px;
    padding: 14px 10px;
}

.mrcsb-resume-stats .v {
    font-family: var(--mrcs-mono);
    font-weight: 600;
    letter-spacing: -.02em;
    color: var(--mrcs-ink);
    font-size: 17px;
    line-height: 1.15;
}

.mrcsb-resume-stats .v small {
    font-size: 11px;
    font-weight: 400;
    color: var(--mrcs-faint);
}

.mrcsb-resume-stats .l {
    font-family: var(--mrcs-mono);
    text-transform: uppercase;
    color: var(--mrcs-faint);
    font-size: 9px;
    letter-spacing: .13em;
}

.mrcsb-resume-actions {
    display: flex;
    align-items: center;
    gap: 10px;
}

.mrcsb-resume-actions .mrcsb-btn-primary {
    flex: 1;
    justify-content: center;
}

.mrcsb-discard {
    font-family: var(--mrcs-body);
    cursor: pointer;
    text-underline-offset: 2px;
    flex-shrink: 0;
    height: 40px;
    padding: 0 14px;
    border: 1px solid var(--mrcs-line);
    border-radius: var(--mrcs-r-md);
    background: var(--mrcs-surface);
    color: var(--mrcs-slate);
    font-size: 13px;
    font-weight: 500;
    text-decoration: none;
    flex: 0 0 auto;
    transition: border-color .14s ease, color .14s ease, background .14s ease;
}

.mrcsb-discard:hover {
    border-color: var(--mrcs-bad-line);
    background: var(--mrcs-bad-soft);
    color: var(--mrcs-bad-deep);
}

#mrcsbTopicList .mrcsb-topic-row.is-extra {
    display: none;
}

#mrcsbTopicList.is-expanded .mrcsb-topic-row.is-extra {
    display: grid;
}

.mrcsb-topic-more {
    width: 100%;
    background: var(--mrcs-sunken);
    border: none;
    border-top: 1px solid var(--mrcs-line-soft);
    padding: 12px;
    font-family: var(--mrcs-body);
    font-size: 12.5px;
    font-weight: 500;
    color: var(--mrcs-blue);
    cursor: pointer;
    transition: background .14s ease;
}

.mrcsb-topic-more:hover {
    background: var(--mrcs-blue-soft);
}

.mrcsb-resume-btn {
    display: flex;
    border: none;
    font-family: var(--mrcs-body);
    cursor: pointer;
    transition: background .14s ease, box-shadow .14s ease;
    flex: 1 1 auto;
    height: 40px;
    padding: 0 18px;
    gap: 9px;
    justify-content: center;
    align-items: center;
    border-radius: var(--mrcs-r-md);
    background: var(--mrcs-blue);
    color: #fff;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: -.005em;
    box-shadow: none;
}

.mrcsb-resume-btn:hover {
    background: var(--mrcs-blue-deep);
    box-shadow: none;
}

.mrcsb-resume-btn:active {
    box-shadow: none;
}

.mrcsb-resume-btn-ico {
    place-items: center;
    flex-shrink: 0;
    width: auto;
    height: auto;
    background: none;
    border-radius: 0;
    opacity: .9;
    display: inline-flex;
    align-items: center;
}

.mrcsb-resume-btn-ico svg {
    margin-left: 1px;
    margin: 0;
    width: 9px;
    height: 10px;
}

.mrcsb-resume-btn-label {
    letter-spacing: -.01em;
    flex: 0 0 auto;
    text-align: center;
}

.mrcsb-resume-btn-count {
    font-family: var(--mrcs-mono);
    font-size: 11.5px;
    font-weight: 500;
    letter-spacing: .02em;
    background: rgba(255, 255, 255, .16);
    padding: 5px 10px;
    border-radius: var(--mrcs-r-sm);
    flex-shrink: 0;
    display: none;
}

.mrcsb-split-head {
    font-family: var(--mrcs-mono);
    font-size: 10px;
    font-weight: 500;
    letter-spacing: .14em;
    text-transform: uppercase;
    padding: 11px 20px 9px;
    background: var(--mrcs-sunken);
    border-bottom: 1px solid var(--mrcs-line-soft);
    border-top: 1px solid var(--mrcs-line-soft);
    display: flex;
    align-items: center;
    gap: 8px;
}

.mrcsb-split-head:first-child {
    border-top: none;
}

.mrcsb-split-head::before {
    content: "";
    width: 6px;
    height: 6px;
    border-radius: 50%;
    flex-shrink: 0;
}

.mrcsb-split-head.strong {
    color: var(--mrcs-ok-deep);
}

.mrcsb-split-head.strong::before {
    background: var(--mrcs-ok);
}

.mrcsb-split-head.weak {
    color: var(--mrcs-bad-deep);
}

.mrcsb-split-head.weak::before {
    background: var(--mrcs-bad);
}

.mrcsb-locked-panel {
    padding: 30px 24px 26px;
    text-align: center;
}

.mrcsb-locked-ico {
    width: 40px;
    height: 40px;
    margin: 0 auto 14px;
    border-radius: 50%;
    background: var(--mrcs-sunken);
    border: 1px solid var(--mrcs-line);
    color: var(--mrcs-faint);
    display: grid;
    place-items: center;
}

.mrcsb-locked-title {
    font-family: var(--mrcs-display);
    font-size: 15px;
    font-weight: 600;
    color: var(--mrcs-ink);
    margin-bottom: 6px;
}

.mrcsb-locked-text {
    font-size: 13.5px;
    line-height: 1.6;
    color: var(--mrcs-slate);
    max-width: 40ch;
    margin: 0 auto 20px;
}

.mrcsb-locked-text b {
    font-family: var(--mrcs-mono);
    font-weight: 600;
    color: var(--mrcs-ink);
}

.mrcsb-locked-meters {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
    max-width: 320px;
    margin: 0 auto;
}

.mrcsb-locked-meter {
    height: 4px;
    background: var(--mrcs-line-soft);
    border-radius: 100px;
    overflow: hidden;
    margin-bottom: 7px;
}

.mrcsb-locked-meter span {
    display: block;
    height: 100%;
    background: var(--mrcs-blue);
    border-radius: 100px;
    transition: width .6s ease;
}

.mrcsb-locked-lab {
    font-family: var(--mrcs-mono);
    font-size: 10.5px;
    color: var(--mrcs-faint);
}

.mrcsb-grid-2 > .mrcsb-col {
    gap: 16px;
    min-width: 0;
    display: flex;
    flex-direction: column;
    min-height: 100%;
}

.mrcsb-grid-2 > .mrcsb-col > .mrcsb-card:last-child {
    display: flex;
    flex-direction: column;
    flex: 0 0 auto;
}

.mrcsb-grid-2 > .mrcsb-col > .mrcsb-card:last-child > #mrcsbRankTrack {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 4px;
}

.mrcsb-grid-2 > .mrcsb-col > .mrcsb-card:last-child > .mrcsb-queue:last-child {
    margin-top: auto;
}

.mrcsb-grid-2 > .mrcsb-col > .mrcsb-card:last-child > #mrcsbTopicList {
    flex: 1 1 auto;
}

.mrcsb-resume-title-text {
    min-width: 0;
    display: block;
    font-family: var(--mrcs-display);
    font-size: 17px;
    font-weight: 600;
    letter-spacing: -.02em;
    line-height: 1.25;
    color: var(--mrcs-ink);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.mrcsb-resume-stats > div:first-child {
    padding-left: 10px;
}

.mrcsb-resume-stats > div + div {
    border-left: 1px solid var(--mrcs-line-soft);
}

.mrcsb-resume-kind {
    display: flex;
    align-items: center;
    gap: 8px;
    font-family: var(--mrcs-mono);
    font-size: 10px;
    font-weight: 500;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--mrcs-faint);
    margin-bottom: 4px;
}

.mrcsb-resume-kind .mrcsb-resume-tag {
    font-size: 10px;
    letter-spacing: .14em;
    padding: 1px 7px;
}

.mrcsb-band-meta {
    font-family: var(--mrcs-mono);
    font-size: 12px;
    color: var(--mrcs-slate);
    margin-bottom: 10px;
}

.mrcsb-band-facts {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    margin-bottom: 14px;
}

.mrcsb-fact {
    font-family: var(--mrcs-mono);
    font-size: 12px;
    font-weight: 600;
    padding: 4px 10px;
    border-radius: 100px;
    background: var(--mrcs-sunken);
    border: 1px solid var(--mrcs-line);
    color: var(--mrcs-ink);
}

.mrcsb-fact.weak {
    background: var(--mrcs-bad-soft);
    border-color: var(--mrcs-bad-line);
    color: var(--mrcs-bad-deep);
}

.mrcsb-fact.mid {
    background: var(--mrcs-amber-soft);
    border-color: var(--mrcs-amber-line);
    color: var(--mrcs-amber);
}

.mrcsb-fact-sep {
    color: var(--mrcs-faint);
}

.mrcsb-fact-note {
    font-size: 13px;
    color: var(--mrcs-slate);
}

.mrcsb-btn-lg {
    height: 48px;
    padding: 0 28px;
    font-size: 15.5px;
    gap: 9px;
    box-shadow: 0 1px 2px rgba(0,90,156,.2), 0 6px 16px rgba(0,120,215,.22);
}

.mrcsb-btn-lg:hover {
    box-shadow: 0 2px 4px rgba(0,90,156,.24), 0 10px 22px rgba(0,120,215,.28);
    transform: translateY(-1px);
}

.mrcsb-ring--sm {
    width: 96px;
    height: 96px;
}

.mrcsb-ring--sm .mrcsb-ring-mid .v {
    font-size: 22px;
}

.mrcsb-ring--sm .mrcsb-ring-mid .l {
    font-size: 10px;
}

.mrcsb-reg-ico {
    font-size: 15px;
    margin-right: 7px;
    vertical-align: -1px;
}

.mrcsb-topic-row.has-dot .mrcsb-topic-name {
    display: flex;
    align-items: center;
    gap: 9px;
}

.mrcsb-topic-name i {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
    display: inline-block;
}

.mrcsb-dot-weak {
    background: var(--mrcs-bad);
}

.mrcsb-dot-mid {
    background: var(--mrcs-amber);
}

.mrcsb-dot-good {
    background: var(--mrcs-ok);
}

.mrcsb-limited-val {
    font-family: var(--mrcs-mono);
    font-size: 13px;
    font-weight: 500;
    color: var(--mrcs-slate);
}

.mrcsb-limited-tag {
    font-family: var(--mrcs-mono);
    font-size: 9.5px;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--mrcs-faint);
    background: var(--mrcs-sunken);
    border: 1px solid var(--mrcs-line-soft);
    padding: 1px 6px;
    border-radius: 100px;
}

.mrcsb-nodata {
    color: var(--mrcs-faint);
}

.mrcsb-bar.is-muted span {
    background: var(--mrcs-line);
}

.mrcsb-topic-pct.good {
    color: var(--mrcs-ok-deep);
}

.mrcsb-focus-foot {
    padding: 14px 20px;
    border-top: 1px solid var(--mrcs-line-soft);
}

.mrcsb-btn-sm {
    height: 36px;
    padding: 0 16px;
    font-size: 13.5px;
    gap: 7px;
    width: 100%;
    justify-content: center;
}

.mrcsb-all-topics {
    border-top: 1px solid var(--mrcs-line-soft);
    max-height: 420px;
    overflow-y: auto;
}

.mrcsb-topic-more.is-open {
    background: var(--mrcs-blue-soft);
}

.mrcsb-xp-now {
    display: flex;
    align-items: center;
    gap: 9px;
    margin-bottom: 12px;
}

.mrcsb-xp-ico {
    font-size: 17px;
}

.mrcsb-xp-rank {
    font-family: var(--mrcs-display);
    font-size: 15px;
    font-weight: 600;
    letter-spacing: -.015em;
    color: var(--mrcs-ink);
}

.mrcsb-xp-count {
    margin-left: auto;
    font-family: var(--mrcs-mono);
    font-size: 12px;
    color: var(--mrcs-slate);
}

.mrcsb-xp-track {
    height: 8px;
    background: var(--mrcs-line-soft);
    border-radius: 100px;
    overflow: hidden;
    margin-bottom: 10px;
}

.mrcsb-xp-track span {
    display: block;
    height: 100%;
    border-radius: 100px;
    background: linear-gradient(90deg, var(--mrcs-blue-deep), var(--mrcs-blue));
    transition: width 1s cubic-bezier(.4,0,.2,1);
}

.mrcsb-xp-sub {
    font-size: 12.5px;
    color: var(--mrcs-slate);
    margin-bottom: 20px;
}

.mrcsb-xp-sub b {
    font-family: var(--mrcs-mono);
    font-weight: 600;
    color: var(--mrcs-ink);
}

.mrcsb-chain {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    align-items: start;
    border-top: 1px solid var(--mrcs-line-soft);
    flex-wrap: nowrap;
    position: relative;
    gap: 0;
    padding-top: 30px;
    padding-bottom: 6px;
}

.mrcsb-chain-node {
    border-radius: 100px;
    font-size: 11px;
    color: var(--mrcs-faint);
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    background: none;
    border: 0;
    white-space: normal;
    text-align: center;
    min-width: 0;
    padding: 0 2px;
    gap: 16px;
}

.mrcsb-chain-node i {
    font-style: normal;
    font-size: 12px;
    filter: grayscale(1);
    opacity: .5;
}

.mrcsb-chain-node b {
    font-weight: 500;
}

.mrcsb-chain-node.done {
    color: var(--mrcs-slate);
}

.mrcsb-chain-node.done i {
    filter: none;
    opacity: 1;
}

.mrcsb-chain-node.now b {
    font-weight: 600;
}

.mrcsb-chain-sep {
    color: var(--mrcs-line);
    font-size: 12px;
    display: none;
}

.mrcsb-smart-body {
    flex: 1;
    min-width: 0;
}

.mrcsb-smart-kicker {
    font-family: var(--mrcs-mono);
    font-size: 10px;
    font-weight: 500;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: var(--mrcs-blue);
    margin-bottom: 5px;
}

.mrcsb-smart-progress {
    max-width: 460px;
}

.mrcsb-smart-track {
    height: 7px;
    background: var(--mrcs-line-soft);
    border-radius: 100px;
    overflow: hidden;
    margin-bottom: 8px;
}

.mrcsb-smart-track span {
    display: block;
    height: 100%;
    border-radius: 100px;
    background: linear-gradient(90deg, var(--mrcs-blue-deep), var(--mrcs-blue));
    transition: width 1s cubic-bezier(.4,0,.2,1);
}

.mrcsb-smart-meta {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    font-family: var(--mrcs-mono);
    font-size: 11.5px;
    color: var(--mrcs-faint);
}

.mrcsb-smart-meta b {
    color: var(--mrcs-ink);
    font-weight: 600;
}

.mrcsb-card > .mrcsb-card-head {
    padding: 16px 22px;
}

.mrcsb-card > .mrcsb-card-body {
    padding: 20px 22px 22px;
}

.mrcsb-card > #mrcsbTopicList .mrcsb-topic-row,
.mrcsb-card > .mrcsb-queue {
    padding-left: 22px;
    padding-right: 22px;
}

.mrcsb-focus-foot,
.mrcsb-topic-more {
    padding-left: 22px;
    padding-right: 22px;
}

.mrcsb-resume-card > .mrcsb-card-body {
    padding: 18px 22px 22px;
}

.mrcsb-xp-card > .mrcsb-card-body {
    padding: 20px 22px 22px;
}

.mrcsb-chain::before {
    position: absolute;
    left: 10%;
    right: 10%;
    top: 18px;
    height: 2px;
    margin-top: 13px;
    background: var(--mrcs-line-soft);
    border-radius: 100px;
    content: none;
}

.mrcsb-chain-ico {
    border-radius: 50%;
    display: grid;
    place-items: center;
    border: 1px solid var(--mrcs-line);
    filter: grayscale(1);
    opacity: .45;
    transition: all .2s ease;
    position: relative;
    width: 38px;
    height: 38px;
    font-size: 17px;
    border-width: 2px;
    background: var(--mrcs-surface);
}

.mrcsb-chain-lab {
    letter-spacing: .01em;
    padding: 0 2px;
    word-break: break-word;
    font-size: 11px;
    font-weight: 500;
    line-height: 1.3;
    color: var(--mrcs-slate);
}

.mrcsb-chain-node.done .mrcsb-chain-ico {
    filter: none;
    opacity: 1;
    background: var(--mrcs-blue-soft);
    border-color: var(--mrcs-blue-line);
}

.mrcsb-chain-node.done .mrcsb-chain-lab {
    color: var(--mrcs-ink);
}

.mrcsb-chain-node.now .mrcsb-chain-ico {
    filter: none;
    opacity: 1;
    background: var(--mrcs-blue);
    border-color: var(--mrcs-blue);
    box-shadow: 0 2px 10px rgba(0, 120, 215, .3);
}

.mrcsb-chain-node.now .mrcsb-chain-lab {
    color: var(--mrcs-blue-deep);
    font-weight: 600;
}

.mrcsb-queue-card .mrcsb-queue:last-child {
    margin-top: 0;
}

.mrcsb-daily {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 16px 22px;
    background: var(--mrcs-sunken);
    border-top: 1px solid var(--mrcs-line-soft);
    border-bottom: 1px solid var(--mrcs-line-soft);
}

.mrcsb-daily-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 10px;
}

.mrcsb-daily-t {
    font-family: var(--mrcs-mono);
    font-size: 10px;
    font-weight: 500;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--mrcs-faint);
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.mrcsb-daily-tick {
    color: var(--mrcs-ok);
    font-size: 12px;
}

.mrcsb-daily-goal {
    font-family: var(--mrcs-mono);
    font-size: 12px;
    font-weight: 600;
    color: var(--mrcs-ink);
    background: var(--mrcs-sunken);
    border: 1px solid var(--mrcs-line);
    border-radius: 100px;
    padding: 4px 12px;
    cursor: pointer;
    transition: all .14s ease;
    line-height: 1.4;
}

.mrcsb-daily-goal:hover {
    border-color: var(--mrcs-blue);
    background: var(--mrcs-blue-soft);
    color: var(--mrcs-blue-deep);
}

.mrcsb-daily-track {
    height: 8px;
    background: var(--mrcs-line-soft);
    border-radius: 100px;
    overflow: hidden;
    margin-bottom: 11px;
}

.mrcsb-daily-track span {
    display: block;
    height: 100%;
    border-radius: 100px;
    background: linear-gradient(90deg, var(--mrcs-blue-deep), var(--mrcs-blue));
    transition: width .7s cubic-bezier(.4, 0, .2, 1);
}

.mrcsb-daily.is-met .mrcsb-daily-track span {
    background: linear-gradient(90deg, var(--mrcs-ok-deep), var(--mrcs-ok));
}

.mrcsb-daily-meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    font-family: var(--mrcs-mono);
    font-size: 11.5px;
    color: var(--mrcs-faint);
}

.mrcsb-daily-meta b {
    color: var(--mrcs-ink);
    font-weight: 600;
}

.mrcsb-daily-go {
    font-family: var(--mrcs-mono);
    font-size: 11.5px;
    font-weight: 500;
    color: var(--mrcs-blue);
    background: none;
    border: 0;
    padding: 0;
    cursor: pointer;
}

.mrcsb-daily-go:hover {
    color: var(--mrcs-blue-deep);
    text-decoration: underline;
}

.mrcsb-daily-go b {
    color: inherit;
}

.mrcsb-daily-done {
    color: var(--mrcs-ok-deep);
    font-weight: 600;
}

.mrcsb-lock-chip {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin-left: 9px;
    padding: 2px 8px 2px 6px;
    border-radius: 100px;
    background: var(--mrcs-sunken);
    border: 1px solid var(--mrcs-line);
    color: var(--mrcs-faint);
    font-size: 9px;
    font-weight: 600;
    letter-spacing: .12em;
    vertical-align: 1px;
}

.mrcsb-lock-chip svg {
    flex-shrink: 0;
}

#btnSmartQuiz.is-locked .smart-quiz-btn-icon {
    filter: grayscale(1);
    opacity: .45;
}

#btnSmartQuiz.is-locked .mrcsb-smart-kicker {
    color: var(--mrcs-faint);
}

#btnSmartQuiz.is-locked h3 {
    color: var(--mrcs-slate) !important;
}

#btnSmartQuiz.is-locked:hover {
    border-color: var(--mrcs-faint) !important;
    background: var(--mrcs-sunken) !important;
}

#btnSmartQuiz.is-locked .mrcsb-smart-track span {
    opacity: 1;
}

.mrcsb-grid-2 > .mrcsb-col > .mrcsb-focus-card,
.mrcsb-grid-2 > .mrcsb-col > .mrcsb-xp-card {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
}

.mrcsb-grid-2 > .mrcsb-col > .mrcsb-focus-card > #mrcsbTopicList {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
}

.mrcsb-grid-2 > .mrcsb-col > .mrcsb-xp-card > .mrcsb-card-body {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
}

.mrcsb-grid-2 > .mrcsb-col > .mrcsb-xp-card .mrcsb-chain {
    margin-top: auto;
}

.mrcsb-daily-card .mrcsb-card-head {
    align-items: center;
}

.mrcsb-daily-card.is-met .mrcsb-card-head h2 {
    color: var(--mrcs-ok-deep);
}

.mrcsb-daily-card .mrcsb-card-body {
    padding: 18px 22px 20px;
    position: relative;
}

.mrcsb-daily-goal span {
    font-weight: 400;
    color: var(--mrcs-faint);
}

.mrcsb-daily-goal:hover span {
    color: var(--mrcs-blue);
}

.mrcsb-goal-edit {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.mrcsb-goal-edit input {
    width: 74px;
    height: 30px;
    padding: 0 10px;
    font-family: var(--mrcs-mono);
    font-size: 13px;
    font-weight: 600;
    color: var(--mrcs-ink);
    background: var(--mrcs-surface);
    border: 1px solid var(--mrcs-blue);
    border-radius: var(--mrcs-r-sm);
    outline: none;
    box-shadow: 0 0 0 3px var(--mrcs-blue-soft);
    -moz-appearance: textfield;
}

.mrcsb-goal-edit input::-webkit-outer-spin-button,
.mrcsb-goal-edit input::-webkit-inner-spin-button {
    opacity: 1;
    height: 24px;
}

.mrcsb-goal-presets {
    display: inline-flex;
    gap: 4px;
}

.mrcsb-goal-presets button {
    font-family: var(--mrcs-mono);
    font-size: 11px;
    font-weight: 500;
    color: var(--mrcs-slate);
    background: var(--mrcs-surface);
    border: 1px solid var(--mrcs-line);
    border-radius: var(--mrcs-r-sm);
    padding: 4px 8px;
    cursor: pointer;
    transition: all .12s ease;
}

.mrcsb-goal-presets button:hover {
    border-color: var(--mrcs-blue);
    background: var(--mrcs-blue-soft);
    color: var(--mrcs-blue-deep);
}

.mrcsb-daily-card.is-met .mrcsb-daily-track span {
    background: linear-gradient(90deg, var(--mrcs-ok-deep), var(--mrcs-ok));
}

.mrcsb-queue-card .mrcsb-daily {
    display: none;
}

.mrcsb-grid-2 > .mrcsb-col > .mrcsb-card.mrcsb-queue-card,
.mrcsb-grid-2 > .mrcsb-col > .mrcsb-card.mrcsb-daily-card,
.mrcsb-grid-2 > .mrcsb-col > .mrcsb-card.mrcsb-resume-card {
    flex: 0 0 auto;
}

.mrcsb-grid-2 > .mrcsb-col > .mrcsb-card.mrcsb-focus-card,
.mrcsb-grid-2 > .mrcsb-col > .mrcsb-card.mrcsb-focus-card:last-child,
.mrcsb-grid-2 > .mrcsb-col > .mrcsb-card.mrcsb-xp-card,
.mrcsb-grid-2 > .mrcsb-col > .mrcsb-card.mrcsb-xp-card:last-child {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
}

.mrcsb-grid-2 > .mrcsb-col > .mrcsb-focus-card #mrcsbTopicMore {
    margin-top: auto;
}

.mrcsb-chain-rail {
    position: absolute;
    left: 10%;
    right: 10%;
    margin-top: 19px;
    height: 3px;
    background: var(--mrcs-line-soft);
    border-radius: 100px;
    overflow: hidden;
    z-index: 0;
    top: 30px;
}

.mrcsb-chain-rail span {
    display: block;
    height: 100%;
    border-radius: 100px;
    background: linear-gradient(90deg, var(--mrcs-blue-deep), var(--mrcs-blue));
    transition: width 1.1s cubic-bezier(.4, 0, .2, 1);
}

.mrcsb-chain-tick {
    position: absolute;
    right: -3px;
    bottom: -3px;
    width: 15px;
    height: 15px;
    border-radius: 50%;
    background: var(--mrcs-ok);
    color: #fff;
    font-size: 8px;
    font-style: normal;
    font-weight: 700;
    display: grid;
    place-items: center;
    border: 2px solid var(--mrcs-surface);
    line-height: 1;
}

.mrcsb-chain-xp {
    font-family: var(--mrcs-mono);
    font-size: 9.5px;
    letter-spacing: .04em;
    color: var(--mrcs-faint);
    line-height: 1.2;
}

.mrcsb-chain-node.done .mrcsb-chain-xp {
    color: var(--mrcs-slate);
}

.mrcsb-chain-node.now .mrcsb-chain-xp {
    color: var(--mrcs-blue);
    font-weight: 500;
}

.mrcsb-chain-node:not(.done):not(.now) .mrcsb-chain-ico {
    filter: grayscale(1);
    opacity: .5;
    border-color: var(--mrcs-line);
}

.mrcsb-xp-card .mrcsb-xp-sub {
    margin-bottom: 22px;
}

.mrcsb-chain-node .mrcsb-chain-ico {
    position: relative;
    isolation: isolate;
}

.mrcsb-chain-node.now .mrcsb-chain-ico::before {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    width: 62px;
    height: 62px;
    margin: -31px 0 0 -31px;
    border-radius: 50%;
    background: var(--mrcs-blue-soft);
    z-index: -1;
    animation: mrcsbHalo 2.6s ease-in-out infinite;
}

.mrcsb-hero-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 300px;
    gap: 20px;
    align-items: stretch;
    margin-bottom: 20px;
}

.mrcsb-hero-row .mrcsb-band {
    margin-bottom: 0;
    height: 100%;
    display: flex;
    align-items: center;
}

.mrcsb-hero-row .mrcsb-band-body {
    width: 100%;
}

.mrcsb-hero-row .mrcsb-ring-block {
    display: none;
}

.mrcsb-acc-card {
    display: flex;
    flex-direction: column;
}

.mrcsb-acc-card > .mrcsb-card-body {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 22px 22px 18px;
}

.mrcsb-acc-ring {
    position: relative;
    width: 140px;
    height: 140px;
    margin-bottom: 16px;
}

.mrcsb-acc-ring svg {
    transform: rotate(-90deg);
    display: block;
}

.mrcsb-acc-arc {
    stroke: var(--mrcs-blue);
    transition: stroke-dashoffset 1.1s cubic-bezier(.4, 0, .2, 1);
}

.tone-ok  .mrcsb-acc-arc {
    stroke: var(--mrcs-ok);
}

.tone-mid .mrcsb-acc-arc {
    stroke: var(--mrcs-amber);
}

.tone-bad .mrcsb-acc-arc {
    stroke: var(--mrcs-bad);
}

.mrcsb-acc-tick {
    position: absolute;
    inset: 0;
    pointer-events: none;
}

.mrcsb-acc-tick i {
    position: absolute;
    left: 50%;
    top: 0;
    width: 2px;
    height: 15px;
    margin-left: -1px;
    background: var(--mrcs-ink);
    opacity: .55;
    border-radius: 2px;
}

.mrcsb-acc-mid {
    position: absolute;
    inset: 0;
    display: grid;
    place-content: center;
    text-align: center;
}

.mrcsb-acc-mid .v {
    font-family: var(--mrcs-display);
    font-size: 38px;
    font-weight: 700;
    letter-spacing: -.035em;
    line-height: 1;
    color: var(--mrcs-ink);
    display: block;
}

.mrcsb-acc-mid .v small {
    font-size: 19px;
    font-weight: 600;
    color: var(--mrcs-faint);
    margin-left: 1px;
}

.mrcsb-acc-mid .l {
    font-family: var(--mrcs-mono);
    font-size: 10px;
    letter-spacing: .1em;
    color: var(--mrcs-faint);
    margin-top: 5px;
    display: block;
}

.mrcsb-acc-verdict {
    font-size: 13px;
    color: var(--mrcs-slate);
    text-align: center;
    margin-bottom: 16px;
    line-height: 1.4;
}

.mrcsb-acc-verdict b {
    font-family: var(--mrcs-mono);
    font-weight: 600;
    color: var(--mrcs-ink);
}

.tone-ok  .mrcsb-acc-verdict b {
    color: var(--mrcs-ok-deep);
}

.tone-mid .mrcsb-acc-verdict b {
    color: var(--mrcs-amber);
}

.tone-bad .mrcsb-acc-verdict b {
    color: var(--mrcs-bad-deep);
}

.mrcsb-acc-split {
    display: grid;
    grid-template-columns: 1fr 1fr;
    width: 100%;
    border-top: 1px solid var(--mrcs-line-soft);
    border-bottom: 1px solid var(--mrcs-line-soft);
    margin-bottom: 14px;
}

.mrcsb-acc-split > div {
    padding: 13px 8px;
    text-align: center;
}

.mrcsb-acc-split > div + div {
    border-left: 1px solid var(--mrcs-line-soft);
}

.mrcsb-acc-split .v {
    display: block;
    font-family: var(--mrcs-mono);
    font-size: 17px;
    font-weight: 600;
    letter-spacing: -.02em;
    line-height: 1.15;
}

.mrcsb-acc-split .v.ok {
    color: var(--mrcs-ok-deep);
}

.mrcsb-acc-split .v.bad {
    color: var(--mrcs-bad-deep);
}

.mrcsb-acc-split .l {
    display: block;
    font-family: var(--mrcs-mono);
    font-size: 9px;
    letter-spacing: .13em;
    text-transform: uppercase;
    color: var(--mrcs-faint);
    margin-top: 3px;
}

.mrcsb-acc-foot {
    margin-top: auto;
    display: flex;
    align-items: center;
    gap: 7px;
    font-family: var(--mrcs-mono);
    font-size: 10.5px;
    color: var(--mrcs-faint);
}

.mrcsb-acc-foot i {
    width: 2px;
    height: 11px;
    background: var(--mrcs-ink);
    opacity: .55;
    border-radius: 2px;
    display: inline-block;
}


/* --------------------------------------------------------------------------
   7. ANIMATIONS
   -------------------------------------------------------------------------- */


@keyframes mrcsRise {
    from { opacity: 0; transform: translateY(5px); }
    to   { opacity: 1; transform: none; }
}

@keyframes mrcsbSpin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } }

@keyframes mrcsbPop { from { opacity:0; transform: translateY(12px); } to { opacity:1; transform:none; } }

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


/* --------------------------------------------------------------------------
   8. RESPONSIVE / ACCESSIBILITY
   -------------------------------------------------------------------------- */


@media (max-width: 1100px) {
    .mrcsb-chain-node b {
        display: none;
    }

    .mrcsb-chain-node {
        padding: 4px 6px;
    }

    .mrcsb-chain-node b,
        .mrcsb-chain-lab {
        display: block;
    }

    .mrcsb-chain-lab {
        display: block;
    }

    .mrcsb-hero-row {
        grid-template-columns: minmax(0, 1fr) 260px;
    }

    .mrcsb-acc-ring {
        width: 124px;
        height: 124px;
    }

    .mrcsb-acc-ring svg {
        width: 124px;
        height: 124px;
    }

    .mrcsb-acc-mid .v {
        font-size: 33px;
    }
}

@media (max-width: 991px) {
    #mrcs_qbank_app .quiz-content-wrapper {
        flex-direction: column !important;
    }

    #mrcs_qbank_app #progressBox {
        width: 100% !important;
        position: static !important;
        order: -1 !important;
    }
}

@media (max-width: 900px) {
    .dash-hero.modern-rank-layout {
        flex-direction: column;
        align-items: stretch;
        padding: 20px;
    }

    .hero-stat {
        flex: none;
    }

    .rank-header {
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
        margin-bottom: 24px;
    }

    .timeline-container {
        flex-direction: column;
        align-items: flex-start;
        padding-left: 8px;
    }

    .timeline-item {
        flex-direction: row;
        align-items: flex-start;
        width: 100%;
        min-height: 74px;
        flex: unset;
    }

    .timeline-marker {
        width: auto;
        justify-content: flex-start;
        margin-right: 18px;
        margin-bottom: 0;
    }

    .timeline-line-track {
        top: 42px;
        left: 20px;
        width: 4px;
        height: calc(100% - 4px);
        transform: none;
    }

    .timeline-line-fill {
        width: 100% !important;
        height: 0;
        transition: height 1.2s ease;
    }

    .timeline-item:last-child .timeline-line-track {
        display: none;
    }

    .timeline-content {
        text-align: left;
        padding-top: 8px;
    }

    .current-score-floater {
        display: none;
    }

    .smart-stats-row {
        flex-direction: column;
    }

    .dash-grid-body {
        grid-template-columns: 1fr;
    }

    .papers-grid {
        grid-template-columns: 1fr;
    }

    .topic-split-card {
        flex-direction: column;
    }

    .topic-main-info, .topic-stats-area, .topic-actions {
        width: 100%;
        border-right: none;
        border-left: none;
        border-bottom: 1px solid var(--mrcs-line-soft);
    }

    .topic-actions {
        flex-direction: row;
        border-bottom: none;
    }

    .btn-topic-start, .btn-topic-subs {
        flex: 1;
        border-top: none;
    }

    .btn-topic-subs {
        display: flex;
        align-items: center;
        justify-content: center;
        border-left: 1px solid var(--mrcs-line-soft);
    }

    .mrcsb-grid-2 {
        grid-template-columns: 1fr;
    }

    .mrcsb-grid-2 > .mrcsb-col > .mrcsb-card:last-child {
        flex: 0 0 auto;
        display: block;
    }

    .mrcsb-grid-2 > .mrcsb-col > .mrcsb-card:last-child > #mrcsbRankTrack {
        display: block;
    }

    .mrcsb-grid-2 > .mrcsb-col > .mrcsb-card:last-child > .mrcsb-queue:last-child {
        margin-top: 0;
    }

    #mrcs_qbank_app {
        padding: 0 14px !important;
    }

    .mrcsb-band {
        padding: 22px;
        gap: 22px;
    }

    .mrcsb-band h1 {
        font-size: 24px;
    }

    .mrcsb-btn-lg {
        width: 100%;
    }

    #btnSmartQuiz {
        flex-direction: column;
    }

    .mrcsb-daily {
        padding: 14px 18px;
    }

    .mrcsb-grid-2 > .mrcsb-col {
        min-height: 0;
    }

    .mrcsb-grid-2 > .mrcsb-col > .mrcsb-card.mrcsb-focus-card,
        .mrcsb-grid-2 > .mrcsb-col > .mrcsb-card.mrcsb-focus-card:last-child,
        .mrcsb-grid-2 > .mrcsb-col > .mrcsb-card.mrcsb-xp-card,
        .mrcsb-grid-2 > .mrcsb-col > .mrcsb-card.mrcsb-xp-card:last-child {
        flex: 0 0 auto;
        display: block;
    }

    .mrcsb-grid-2 > .mrcsb-col > .mrcsb-xp-card > .mrcsb-card-body {
        display: block;
    }

    .mrcsb-grid-2 > .mrcsb-col > .mrcsb-focus-card > #mrcsbTopicList {
        display: block;
    }

    .mrcsb-grid-2 > .mrcsb-col > .mrcsb-focus-card #mrcsbTopicMore {
        margin-top: 0;
    }

    .mrcsb-hero-row {
        grid-template-columns: 1fr;
    }

    .mrcsb-hero-row .mrcsb-band {
        display: block;
    }

    .mrcsb-acc-card > .mrcsb-card-body {
        padding-bottom: 20px;
    }
}

@media (max-width: 900px), (hover: none) {
    #mrcs_qbank_app .mrcsb-kbd-hint {
        display: none;
    }
}

@media (max-width: 820px) {
    .mrcsb-band {
        flex-direction: column;
        align-items: flex-start;
        gap: 24px;
        padding: 22px;
    }

    .mrcsb-band h1 {
        font-size: 22px;
    }

    .mrcsb-btn-row {
        width: 100%;
    }

    .mrcsb-btn {
        flex: 1;
        justify-content: center;
    }
}

@media (max-width: 700px) {
    .mrcsb-register {
        grid-template-columns: repeat(2, 1fr);
    }

    .mrcsb-reg-cell:nth-child(3) {
        border-left: 0;
    }

    .mrcsb-reg-cell:nth-child(n/**/+3) {
        border-top: 1px solid var(--mrcs-line-soft);
    }
}

@media (max-width: 640px) {
    #mrcs_qbank_app {
        margin: 20px auto !important;
        padding: 0 12px !important;
    }

    #mrcs_qbank_app #mainQuizContainer,
        #mrcs_qbank_app #quizTypeSelection,
        #mrcs_qbank_app #results,
        #mrcs_qbank_app #progressBox {
        padding: 18px !important;
    }

    #mrcs_qbank_app .quiz-header-nav {
        gap: 10px;
        margin-bottom: 18px !important;
    }

    #mrcs_qbank_app .quiz-header-nav h2 {
        font-size: 16px !important;
    }

    #mrcs_qbank_app #quiz .question,
        #mrcs_qbank_app #quiz .question p {
        font-size: 15.5px !important;
    }

    #mrcs_qbank_app .answers label {
        padding: 13px 14px !important;
        font-size: 14.5px !important;
    }

    #mrcs_qbank_app .answers label strong {
        left: 14px;
        top: 13px;
    }

    #mrcs_qbank_app .answers label.is-correct::after,
        #mrcs_qbank_app .answers label.is-incorrect::after {
        display: none;
    }

    #mrcs_qbank_app .quiz-controls {
        flex-direction: column !important;
    }

    #mrcs_qbank_app .quiz-controls button {
        width: 100% !important;
    }

    #mrcs_qbank_app .question-feedback-box h4 {
        padding: 13px 16px !important;
        font-size: 15px !important;
    }

    #mrcs_qbank_app .question-feedback-box > div:last-child {
        padding: 18px 16px !important;
    }

    #mrcs_qbank_app .stats-chart-box {
        padding: 15px 16px !important;
    }

    #mrcs_qbank_app .flag-toggle-btn {
        float: none !important;
        width: 100% !important;
        justify-content: center !important;
    }

    #mrcs_qbank_app #visualProgressGrid {
        grid-template-columns: repeat(auto-fill, minmax(28px, 1fr)) !important;
    }
}

@media (max-width: 600px) {
    .mrcsb-scrim {
        padding: 20px 12px;
    }

    .mrcsb-sheet-body {
        padding: 18px;
    }

    .mrcsb-seg {
        width: 100%;
    }

    .mrcsb-seg button {
        flex: 1;
        text-align: center;
    }

    .mrcsb-sheet-foot {
        flex-direction: column;
        align-items: stretch;
    }

    .mrcsb-sheet-foot .mrcsb-btn-primary {
        margin-left: 0;
        width: 100%;
    }
}

@media (max-width: 520px) {
    .mrcsb-topic-row {
        grid-template-columns: 1fr 46px;
        gap: 10px;
    }

    .mrcsb-topic-row .mrcsb-bar {
        display: none;
    }
}

@media (max-width: 480px) {
    .mrcsb-goal-presets {
        display: none;
    }

    .mrcsb-chain-ico {
        width: 32px;
        height: 32px;
        font-size: 14px;
    }

    .mrcsb-chain-rail {
        margin-top: 16px;
    }

    .mrcsb-chain-lab {
        font-size: 9.5px;
    }

    .mrcsb-chain-xp {
        font-size: 8.5px;
    }

    .mrcsb-chain-tick {
        width: 13px;
        height: 13px;
        font-size: 7px;
    }

    .mrcsb-chain-node {
        gap: 13px;
    }

    .mrcsb-chain-node.now .mrcsb-chain-ico::before {
        width: 52px;
        height: 52px;
        margin: -26px 0 0 -26px;
    }
}

@media (max-width: 420px) {
    .mrcsb-chain-lab {
        font-size: 8.5px;
    }

    .mrcsb-chain-ico {
        width: 24px;
        height: 24px;
        font-size: 11px;
    }

    .mrcsb-chain::before {
        margin-top: 11px;
    }
}

@media (prefers-reduced-motion: reduce) {
    #mrcs_qbank_app *, .mrcs-dashboard-wrapper * {
        animation: none !important;
        transition: none !important;
    }

    .mrcsb-chain-node.now .mrcsb-chain-ico::before {
        animation: none;
    }
}

/* ============================================================================
   CURRENT RANK — ICON-ONLY SPOTLIGHT
   Prevent any legacy/current-rank highlight from painting the whole level node.
   The only visual emphasis is applied directly to the current rank icon.
   ============================================================================ */

/* Never highlight the whole current-rank item. */
.mrcsb-chain-node.now {
    background: transparent !important;
    border-color: transparent !important;
    box-shadow: none !important;
    outline: none !important;
}

/* Kill any legacy pseudo-element spotlight attached to the whole node. */
.mrcsb-chain-node.now::before,
.mrcsb-chain-node.now::after {
    content: none !important;
    display: none !important;
    background: none !important;
    box-shadow: none !important;
}

/* Kill the second halo/pseudo spotlight around the icon itself. */
.mrcsb-chain-node.now .mrcsb-chain-ico::before,
.mrcsb-chain-node.now .mrcsb-chain-ico::after {
    content: none !important;
    display: none !important;
}

/* Keep ONE spotlight only: the icon circle. */
.mrcsb-chain-node.now .mrcsb-chain-ico {
    filter: none !important;
    opacity: 1 !important;
    background: var(--mrcs-blue-soft) !important;
    border-color: var(--mrcs-blue-line) !important;
    box-shadow: 0 0 0 5px rgba(0, 120, 215, .10),
                0 2px 9px rgba(0, 120, 215, .18) !important;
}

/* ============================================================================
   CURRENT RANK — HARD RESET (v3)
   High-specificity override for legacy dashboard CSS that is still styling
   the entire .now node after this stylesheet's normal rules.
   Only .mrcsb-chain-ico is allowed to carry current-rank emphasis.
   ============================================================================ */

html body .mrcs-dashboard-wrapper .mrcsb-xp-card .mrcsb-chain > .mrcsb-chain-node.now,
html body #mrcs_qbank_app .mrcsb-xp-card .mrcsb-chain > .mrcsb-chain-node.now {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    border: 0 !important;
    border-color: transparent !important;
    box-shadow: none !important;
    outline: 0 !important;
    filter: none !important;
}

/* Nothing attached to the whole node may paint a spotlight. */
html body .mrcs-dashboard-wrapper .mrcsb-xp-card .mrcsb-chain > .mrcsb-chain-node.now::before,
html body .mrcs-dashboard-wrapper .mrcsb-xp-card .mrcsb-chain > .mrcsb-chain-node.now::after,
html body #mrcs_qbank_app .mrcsb-xp-card .mrcsb-chain > .mrcsb-chain-node.now::before,
html body #mrcs_qbank_app .mrcsb-xp-card .mrcsb-chain > .mrcsb-chain-node.now::after {
    content: none !important;
    display: none !important;
    width: 0 !important;
    height: 0 !important;
    background: transparent !important;
    background-image: none !important;
    border: 0 !important;
    box-shadow: none !important;
}

/* Current icon: the ONLY highlighted element. */
html body .mrcs-dashboard-wrapper .mrcsb-xp-card .mrcsb-chain > .mrcsb-chain-node.now > .mrcsb-chain-ico,
html body #mrcs_qbank_app .mrcsb-xp-card .mrcsb-chain > .mrcsb-chain-node.now > .mrcsb-chain-ico {
    position: relative !important;
    z-index: 3 !important;
    filter: none !important;
    opacity: 1 !important;
    background: var(--mrcs-blue-soft) !important;
    border: 2px solid var(--mrcs-blue-line) !important;
    border-radius: 50% !important;
    box-shadow: 0 0 0 5px rgba(0, 120, 215, .10),
                0 2px 9px rgba(0, 120, 215, .18) !important;
}

/* Do not allow an additional icon pseudo-element to create a second halo. */
html body .mrcs-dashboard-wrapper .mrcsb-xp-card .mrcsb-chain > .mrcsb-chain-node.now > .mrcsb-chain-ico::before,
html body .mrcs-dashboard-wrapper .mrcsb-xp-card .mrcsb-chain > .mrcsb-chain-node.now > .mrcsb-chain-ico::after,
html body #mrcs_qbank_app .mrcsb-xp-card .mrcsb-chain > .mrcsb-chain-node.now > .mrcsb-chain-ico::before,
html body #mrcs_qbank_app .mrcsb-xp-card .mrcsb-chain > .mrcsb-chain-node.now > .mrcsb-chain-ico::after {
    content: none !important;
    display: none !important;
}

/* Fallback when progression markup is not inside .mrcsb-xp-card / #mrcs_qbank_app. */
html body .mrcsb-chain > .mrcsb-chain-node.now {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    border: 0 !important;
    box-shadow: none !important;
    outline: 0 !important;
}
html body .mrcsb-chain > .mrcsb-chain-node.now::before,
html body .mrcsb-chain > .mrcsb-chain-node.now::after {
    content: none !important;
    display: none !important;
    background: none !important;
    box-shadow: none !important;
}
html body .mrcsb-chain > .mrcsb-chain-node.now > .mrcsb-chain-ico {
    background: var(--mrcs-blue-soft) !important;
    border: 2px solid var(--mrcs-blue-line) !important;
    box-shadow: 0 0 0 5px rgba(0,120,215,.10), 0 2px 9px rgba(0,120,215,.18) !important;
    filter: none !important;
    opacity: 1 !important;
}
html body .mrcsb-chain > .mrcsb-chain-node.now > .mrcsb-chain-ico::before,
html body .mrcsb-chain > .mrcsb-chain-node.now > .mrcsb-chain-ico::after {
    content: none !important;
    display: none !important;
}

/* =========================================================
   FIX — CENTRE A–E LETTER BADGES IN ANSWER OPTIONS
   ========================================================= */

/*
 * The old design put the visible radio square and the <strong>A–E</strong>
 * text on top of each other using absolute positioning. On some browsers /
 * inherited theme styles the two layers do not share exactly the same x/y
 * position, which is why the letter sits off-centre.
 *
 * Make the real radio visually hidden but still functional, and use the
 * <strong> element itself as the visible A–E badge.
 */

#mrcs_qbank_app .answers label {
    position: relative !important;
    display: flex !important;
    align-items: flex-start !important;
    gap: 14px !important;
}

/* Keep the real radio accessible and functional, but not visually painted. */
#mrcs_qbank_app .answers input[type="radio"] {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    margin: 0 !important;
    padding: 0 !important;
    opacity: 0 !important;
    overflow: hidden !important;
    pointer-events: none !important;
}

/* The A–E element is now the actual visible badge. */
#mrcs_qbank_app .answers label strong {
    position: static !important;
    left: auto !important;
    top: auto !important;

    flex: 0 0 26px !important;
    width: 26px !important;
    height: 26px !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    margin: 0 !important;
    padding: 0 !important;

    background: var(--mrcs-sunken) !important;
    border: 1px solid var(--mrcs-line) !important;
    border-radius: var(--mrcs-r-sm) !important;

    font-family: var(--mrcs-mono) !important;
    font-size: 12.5px !important;
    font-weight: 600 !important;
    line-height: 1 !important;
    text-align: center !important;

    color: var(--mrcs-slate) !important;

    pointer-events: none !important;
    transition:
        color .13s ease,
        background .13s ease,
        border-color .13s ease !important;
}

/* Keyboard focus remains visible even though the real radio is hidden. */
#mrcs_qbank_app .answers label:has(input[type="radio"]:focus-visible) {
    outline: 2px solid var(--mrcs-blue) !important;
    outline-offset: 2px !important;
}

/* Selected answer */
#mrcs_qbank_app .answers label:has(input:checked) strong {
    background: var(--mrcs-blue) !important;
    border-color: var(--mrcs-blue) !important;
    color: #ffffff !important;
}

/* Correct answer after submission */
#mrcs_qbank_app .answers label.is-correct strong {
    background: var(--mrcs-ok) !important;
    border-color: var(--mrcs-ok) !important;
    color: #ffffff !important;
}

/* Incorrect selected answer after submission */
#mrcs_qbank_app .answers label.is-incorrect strong {
    background: var(--mrcs-bad) !important;
    border-color: var(--mrcs-bad) !important;
    color: #ffffff !important;
}