/**
 * SSC Answer Review — styles for review mode driven by ssc-solution-shell.js.
 *
 * Review mode reuses the REAL exam shell (topbar / sidebar palettes / footer /
 * full-screen). These rules only (a) keep that chrome visible after the quiz
 * has finished, (b) reveal the correct answer + solution inside the real
 * question cards, (c) recolour the palettes by outcome, and (d) swap the
 * footer to Previous / Next / Back to Result. Everything is scoped to
 * .quizSEO_ssc_official.ssc-review-mode, so nothing here affects the live exam
 * or default-UI quizzes. All colours come from the --ssc-* tokens, so review
 * mode follows the same Day / Eye / Night reading modes as the exam.
 */

/* --- keep the real exam chrome on screen after finish ------------------- */
.quizSEO_ssc_official.ssc-review-mode .ssc-topbar { display: block !important; }
.quizSEO_ssc_official.ssc-review-mode .ssc-exam-body {
    display: grid !important;
    grid-template-columns: 1fr 280px;
}
.quizSEO_ssc_official.ssc-review-mode .ssc-footer-bar { display: flex !important; }
.quizSEO_ssc_official.ssc-review-mode .quizSEO_quiz,
.quizSEO_ssc_official.ssc-review-mode .quizSEO_list { display: block !important; }

/* Keep the category-tab row and the question-meta row visible (ditto exam). */
.quizSEO_ssc_official.ssc-review-mode .ssc-topbar__row--cats,
.quizSEO_ssc_official.ssc-review-mode .ssc-topbar__row--qmeta { display: grid !important; }
/* The tabs themselves sit two levels deep — .quizSEO_allCategoriesNav >
   .quizSEO_categoryTabs > .quizSEO_categoryTab. The plugin's own
   .ssc-quiz-finished rule hides all three once the quiz finishes; review
   only ever restored the innermost .quizSEO_categoryTab, so on desktop the
   two wrapper levels stayed display:none and the whole row rendered empty
   even though its grid cell was visible. A mobile-only rule elsewhere
   already restores the wrappers under a max-width breakpoint (via
   .ssc-mobile-header), which is why this only ever showed up on desktop.
   Restoring the wrappers here, ungated by breakpoint, fixes both. */
.quizSEO_ssc_official.ssc-review-mode .quizSEO_allCategoriesNav,
.quizSEO_ssc_official.ssc-review-mode .quizSEO_categoryTabs { display: flex !important; }
.quizSEO_ssc_official.ssc-review-mode .quizSEO_categoryTab { display: inline-block !important; }

/* The base plugin stylesheet puts a generic "transition: .3s" on every
   .quizSEO_categoryTab (for its own hover/active fade during the live
   exam). On the review page, clicking a tab swaps the active tab
   instantly (ssc-solution-shell.js), so that same fade made the newly
   active tab visibly wash through its unselected/white background on
   the way to its solid colour - a brief "blink". Scoped to review mode
   only, so the live exam's own tab fade is untouched. */
.quizSEO_ssc_official.ssc-review-mode .quizSEO_categoryTab { transition: none !important; }

/* Name row (Quiz Name + Total Time): the plugin's own
   .ssc-quiz-finished .ssc-topbar__row--name rule forces display:flex with no
   justify-content once the quiz finishes, which collapses Total Time flush
   against Quiz Name on the left. Review reuses this same row after finish,
   so put it back on the exam's own 3-column grid (1fr 1fr auto — inherited
   from the base .ssc-topbar__row rule) so Total Time sits pinned to the
   right edge of the top bar, exactly like the running exam's "Time:" clock. */
.quizSEO_ssc_official.ssc-review-mode .ssc-topbar__row--name { display: grid !important; }

/* Topbar time slots: show total time (right of row 1) and section time
   (right of row 2), both static in review. */
.quizSEO_ssc_official.ssc-review-mode .ssc-topbar__global-time,
.quizSEO_ssc_official.ssc-review-mode .ssc-topbar__cat-time { display: inline-flex !important; }
/* 3-mode theme toggle (Day/Eye/Night) + full-screen button stay in the topbar
   during review, same place as the live exam. */
.quizSEO_ssc_official.ssc-review-mode .ssc-theme-toggle,
.quizSEO_ssc_official.ssc-review-mode .ssc-theme-btn,
.quizSEO_ssc_official.ssc-review-mode .ssc-fs-toggle { display: inline-flex !important; }
/* Total Time value: match the running exam's clock digits exactly
   (.quizSEO_time_limit .time span — 14px/700/tabular-nums), not just an
   inherited body size, so review looks identical to the live exam. */
.quizSEO_ssc_official.ssc-review-mode .ssc-rv-total,
.quizSEO_ssc_official.ssc-review-mode .ssc-cat-timer-value {
    font-weight: 700;
    font-size: 14px;
    font-variant-numeric: tabular-nums;
    color: var(--ssc-head);
    margin-left: 6px;
}

/* Bring the Section / Category / All palettes back (finish had hidden them). */
.quizSEO_ssc_official.ssc-review-mode .ssc-section-palette-wrap,
.quizSEO_ssc_official.ssc-review-mode .ssc-cat-palette-slot,
.quizSEO_ssc_official.ssc-review-mode .ssc-main-palette-slot,
.quizSEO_ssc_official.ssc-review-mode .ssc-palette-subtitle { display: block !important; }
.quizSEO_ssc_official.ssc-review-mode .quizSEO_reviewQuestion,
.quizSEO_ssc_official.ssc-review-mode .quizSEO_questionPalette { display: block !important; }

/* Per-question timer: hide the live clock, show the static "time taken". */
.quizSEO_ssc_official.ssc-review-mode .quizSEO_perQuestionTimer { display: none !important; }

/* Per-question meta — soft chips (Demo A):
     [ Time 0:16 ] [ Avg 1:18 ] [ Correct 8% ]
   Separate rounded chips, no outer border box. Time keeps a soft green/red
   tint when the candidate was clearly faster/slower than average. */
.quizSEO_ssc_official.ssc-review-mode .ssc-rv-meta.ssc-rv-pill {
    float: right;                 /* desktop: sits by the question */
    display: inline-flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    padding: 0;
    margin: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    overflow: visible;
    min-height: 0;
    box-sizing: border-box;
    font-variant-numeric: tabular-nums;
    line-height: 1;
}
.quizSEO_ssc_official.ssc-review-mode .ssc-rv-pill > .ssc-rv-seg {
    display: inline-flex;
    flex-direction: row;
    align-items: baseline;
    justify-content: center;
    gap: 6px;
    padding: 5px 10px;
    min-width: 0;
    border: 0;
    border-radius: 4px;
    background: var(--ssc-chip, #f1f5f9);
    text-align: center;
    white-space: nowrap;
}
.quizSEO_ssc_official.ssc-review-mode .ssc-rv-pill > .ssc-rv-seg + .ssc-rv-seg {
    border-left: 0;
}
.quizSEO_ssc_official.ssc-review-mode .ssc-rv-pill .ssc-rv-k {
    display: inline;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: var(--ssc-muted, #64748b);
    line-height: 1;
}
.quizSEO_ssc_official.ssc-review-mode .ssc-rv-pill .ssc-rv-v {
    display: inline;
    font-size: 13px;
    font-weight: 700;
    color: var(--ssc-head, #0f172a);
    line-height: 1.1;
}
/* Time chip: soft tint when faster/slower than average */
.quizSEO_ssc_official.ssc-review-mode .ssc-rv-pill > .ssc-rv-qtime.ssc-t-fast {
    background: color-mix(in srgb, var(--ssc-ok, #10b981) 14%, var(--ssc-surface, #fff));
}
.quizSEO_ssc_official.ssc-review-mode .ssc-rv-pill > .ssc-rv-qtime.ssc-t-fast .ssc-rv-v {
    color: var(--ssc-ok-text, var(--ssc-ok, #047857));
}
.quizSEO_ssc_official.ssc-review-mode .ssc-rv-pill > .ssc-rv-qtime.ssc-t-slow {
    background: color-mix(in srgb, var(--ssc-bad, #ef4444) 12%, var(--ssc-surface, #fff));
}
.quizSEO_ssc_official.ssc-review-mode .ssc-rv-pill > .ssc-rv-qtime.ssc-t-slow .ssc-rv-v {
    color: var(--ssc-bad-text, var(--ssc-bad, #b42318));
}

/* Question label: full text on desktop, compact "Q x/y" on phones (JS emits
   both; CSS shows one). Short form is hidden here and switched on under the
   mobile-header breakpoint below. */
.quizSEO_ssc_official.ssc-review-mode .ssc-qn-short { display: none; }

/* Keep the per-question tools row (Save/bookmark + Report) visible in review,
   in case anything upstream hid it. The Save button itself is provided by the
   Bookmarks feature; it only renders when Bookmarks is enabled and the user is
   logged in. */
.quizSEO_ssc_official.ssc-review-mode .qsQtools {
    display: flex !important;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
}
.quizSEO_ssc_official.ssc-review-mode .qsBm__btn,
.quizSEO_ssc_official.ssc-review-mode .qsRep__link { display: inline-flex !important; }

/* Hide the score page + the plugin's separate answers view while reviewing. */
.quizSEO_ssc_official.ssc-review-mode .quizSEO_results,
.quizSEO_ssc_official.ssc-review-mode .quizSEO_answersView { display: none !important; }

/* The active card is shown via inline style by JS; make sure list chrome
   doesn't fight it. */
.quizSEO_ssc_official.ssc-review-mode .quizSEO_list { margin: 0; padding: 0; list-style: none; }

/* --- lock the question card (read-only) -------------------------------- */
.quizSEO_ssc_official.ssc-review-mode .quizSEO_listItem .quizSEO_questionInput {
    pointer-events: none;
}
.quizSEO_ssc_official.ssc-review-mode .quizSEO_listItem .quizSEO_questionListItem {
    border: 1px solid var(--ssc-line);
    border-radius: 8px;
    padding: 10px 14px;
    margin: 8px 0;
    background: var(--ssc-surface);
    color: var(--ssc-text);
    list-style: none;
}

/* correct option = soft green tint, user's wrong pick = soft red tint —
   colour-mixed against the theme surface (same recipe already used
   elsewhere in ssc-theme.css for "answer" tints) instead of a fully
   saturated solid fill, so it reads as a clear but professional accent
   rather than a harsh block of colour. Border + text use the paired
   --ssc-ok-text / --ssc-bad-text tokens, which the theme already tunes
   per Day/Eye/Night mode for correct contrast against that mix. */
.quizSEO_ssc_official.ssc-review-mode .quizSEO_questionListItem.ssc-rv-correct {
    background: color-mix(in srgb, var(--ssc-ok) 20%, var(--ssc-surface)) !important;
    border: 1.5px solid var(--ssc-ok) !important;
}
.quizSEO_ssc_official.ssc-review-mode .quizSEO_questionListItem.ssc-rv-wrong {
    background: color-mix(in srgb, var(--ssc-bad) 20%, var(--ssc-surface)) !important;
    border: 1.5px solid var(--ssc-bad) !important;
}
.quizSEO_ssc_official.ssc-review-mode .quizSEO_questionListItem.ssc-rv-correct,
.quizSEO_ssc_official.ssc-review-mode .quizSEO_questionListItem.ssc-rv-correct * {
    color: var(--ssc-ok-text, var(--ssc-ok)) !important;
}
.quizSEO_ssc_official.ssc-review-mode .quizSEO_questionListItem.ssc-rv-wrong,
.quizSEO_ssc_official.ssc-review-mode .quizSEO_questionListItem.ssc-rv-wrong * {
    color: var(--ssc-bad-text, var(--ssc-bad)) !important;
}
.quizSEO_ssc_official.ssc-review-mode .quizSEO_questionListItem.ssc-rv-correct,
.quizSEO_ssc_official.ssc-review-mode .quizSEO_questionListItem.ssc-rv-wrong {
    font-weight: 600;
}

/* --- reveal the solution / response block under the options ------------ */
/* Same green / red tint as the option it explains — set on .quizSEO_response
   via the ssc-rv-resp-correct / ssc-rv-resp-wrong class (added in
   prepareCard()) — so the solution box visually matches the shade of the
   answer above it instead of sitting in a neutral card. Kept noticeably
   lighter than the option row's own tint (10% vs. 20%) since this is a
   larger reading surface with a paragraph of text on it — a light, soothing
   wash rather than a strong colour, with the full-strength accent border
   carrying the correct/wrong signal instead. Unattempted keeps the original
   neutral surface + brand accent, since nothing was chosen right or wrong to
   match a colour to. */
.quizSEO_ssc_official.ssc-review-mode .quizSEO_listItem .quizSEO_response {
    display: block !important;
    margin-top: 14px;
    padding: 12px 14px;
    border-left: 4px solid var(--ssc-brand);
    border-radius: 6px;
    /* Whitish solution surface in every reading mode (falls back to the
       page surface only where no override is set, i.e. Night) — see
       --ssc-solution-bg in ssc-theme.css. Previously this read
       var(--ssc-surface) directly, which meant Eye-protector mode's warm
       tan page background (#fbf3da) showed through as a yellow tint. */
    background: var(--ssc-solution-bg, var(--ssc-surface)) !important;
    color: var(--ssc-text);
}
.quizSEO_ssc_official.ssc-review-mode .quizSEO_listItem .quizSEO_response.ssc-rv-resp-correct {
    background: color-mix(in srgb, var(--ssc-ok) 10%, var(--ssc-solution-bg, var(--ssc-surface))) !important;
    border-left-color: var(--ssc-ok) !important;
}
.quizSEO_ssc_official.ssc-review-mode .quizSEO_listItem .quizSEO_response.ssc-rv-resp-wrong {
    background: color-mix(in srgb, var(--ssc-bad) 10%, var(--ssc-solution-bg, var(--ssc-surface))) !important;
    border-left-color: var(--ssc-bad) !important;
}
.quizSEO_ssc_official.ssc-review-mode .quizSEO_listItem .quizSEO_response .quizSEO_respone_span {
    font-weight: 700;
    color: var(--ssc-head);
}
.quizSEO_ssc_official.ssc-review-mode .quizSEO_listItem .quizSEO_response.ssc-rv-resp-correct .quizSEO_respone_span {
    color: var(--ssc-ok-text, var(--ssc-ok));
}
.quizSEO_ssc_official.ssc-review-mode .quizSEO_listItem .quizSEO_response.ssc-rv-resp-wrong .quizSEO_respone_span {
    color: var(--ssc-bad-text, var(--ssc-bad));
}
.quizSEO_ssc_official.ssc-review-mode .quizSEO_listItem .quizSEO_tipp {
    display: block !important;
    margin-top: 10px;
}

/* Hide in-card quiz action buttons (Next / Check / Skip / etc.) in review;
   navigation lives in the footer. */
.quizSEO_ssc_official.ssc-review-mode .quizSEO_listItem input[name="next"],
.quizSEO_ssc_official.ssc-review-mode .quizSEO_listItem input[name="back"],
.quizSEO_ssc_official.ssc-review-mode .quizSEO_listItem input[name="check"],
.quizSEO_ssc_official.ssc-review-mode .quizSEO_listItem input[name="skip"],
.quizSEO_ssc_official.ssc-review-mode .quizSEO_listItem input[name="clearResponse"],
.quizSEO_ssc_official.ssc-review-mode .quizSEO_listItem input[name="review"],
.quizSEO_ssc_official.ssc-review-mode .ssc-question-action-bar { display: none !important; }

/* --- footer: hide exam proxies, show review nav (single row on desktop) - */
.quizSEO_ssc_official.ssc-review-mode .ssc-footer-bar > .ssc-footer-bar__left,
.quizSEO_ssc_official.ssc-review-mode .ssc-footer-bar > .ssc-footer-bar__right {
    display: none !important;
}
/* Same split the running exam uses (.ssc-footer-bar already has
   justify-content: space-between from ssc-exam-template.css) — the review
   nav's own left/right groups sit at the two ends of that same row instead
   of being centered as one block. */
.quizSEO_ssc_official.ssc-review-mode .ssc-footer-bar { justify-content: space-between; }
/* Desktop: ONE row, split like the live exam footer —
   left group:  Previous | Back to Result | My Profile
   right group: Next
   (mirrors "Previous | Clear Response | Mark for Review" on the left and
   "Save & Next" on the right during the running test). flex-wrap: nowrap
   keeps each group on a single line; if the viewport is ever too narrow to
   fit them (but still above the 768px mobile breakpoint, where the nav is
   lifted into .ssc-rv-mobilebar instead), the row scrolls horizontally
   rather than wrapping to a second line. */
.quizSEO_ssc_official.ssc-review-mode .ssc-rv-nav {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    width: 100%;
    max-width: none;
    margin: 0;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}
.quizSEO_ssc_official.ssc-review-mode .ssc-rv-nav__left,
.quizSEO_ssc_official.ssc-review-mode .ssc-rv-nav__right {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    gap: 8px;
}
.quizSEO_ssc_official.ssc-review-mode .ssc-rv-nav .ssc-rv-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    min-width: 100px;
    width: auto;
    white-space: nowrap;
    padding: 10px 14px !important;
    border-radius: 6px !important;
    border: 1px solid var(--ssc-brand) !important;
    background: var(--ssc-surface) !important;
    color: var(--ssc-head) !important;
    font-weight: 600 !important;
    font-size: 13px !important;
    line-height: 1;
    cursor: pointer;
    float: none !important;
    margin: 0 !important;
    text-decoration: none;
    -webkit-appearance: none;
    appearance: none;
    box-shadow: none !important;
    touch-action: manipulation;
    -webkit-tap-highlight-color: rgba(0,0,0,0.08);
}
.quizSEO_ssc_official.ssc-review-mode .ssc-rv-next {
    background: var(--ssc-brand) !important;
    color: var(--ssc-on-brand) !important;
}
.quizSEO_ssc_official.ssc-review-mode .ssc-rv-prev:disabled,
.quizSEO_ssc_official.ssc-review-mode .ssc-rv-next:disabled { opacity: .45; cursor: not-allowed; }
.quizSEO_ssc_official.ssc-review-mode .ssc-rv-mobilebar { display: none; }

/* --- topbar tool alignment (match the running exam) -------------------- */
/* Name row:  Quiz Name .................... Total Time: 00:00:00
   Plain right-aligned clock, no fullscreen button sharing the row — this is
   the same layout the running exam uses, via the row's own grid column
   (.ssc-topbar__global-time already right-justifies itself). */
/* Cats row:  [category tabs] ..... [Full screen][Day|Eye|Night] Section Time: 00:00:00
   Desktop only. On phones the exam shell relocates this row into its own
   ".ssc-mobile-header" grid layout (tabs strip + stacked time/toggle) and
   makes .ssc-topbar__cats scroll sideways — that is the running-exam mobile
   look review is meant to match exactly, so all of this is gated to
   ":not(.ssc-mobile-header)" and gets out of its way rather than
   reimplementing it. Un-gated versions of these rules previously forced
   flex/wrap here on every width and, being loaded after the exam template
   with equal specificity, quietly beat the mobile grid + scroll-strip rules
   — that's what made categories wrap instead of scroll on phones. */
.quizSEO_ssc_official.ssc-review-mode:not(.ssc-mobile-header) .ssc-topbar__row--cats .ssc-theme-toggle { margin-left: auto; }
.quizSEO_ssc_official.ssc-review-mode:not(.ssc-mobile-header) .ssc-topbar__row--cats .ssc-topbar__cat-time { margin-left: 12px; }
.quizSEO_ssc_official.ssc-review-mode:not(.ssc-mobile-header) .ssc-topbar__row--cats { display: flex !important; align-items: center; }
/* Visibility only, every width — .ssc-cats-slot is one of the elements the
   base plugin's "quiz finished" rule hides with !important, so it needs an
   unconditional override just to be on screen at all (mobile included). */
.quizSEO_ssc_official.ssc-review-mode .ssc-cats-slot { display: flex !important; }
/* Desktop-only layout details (wrap + spacing). On phones the exam's own
   ".ssc-mobile-header" rule sets flex-wrap: nowrap + overflow-x: auto for
   the sideways-scrolling strip — leaving that property alone here (rather
   than declaring it un-gated) is what lets that scrolling behaviour win. */
.quizSEO_ssc_official.ssc-review-mode:not(.ssc-mobile-header) .ssc-cats-slot { flex-wrap: wrap; gap: 6px; }
.quizSEO_ssc_official.ssc-review-mode .quizSEO_categoryTab { display: inline-block !important; }

/* Per-category time under each tab. The base plugin already renders this
   element (.category-timer-display, one per tab) for the LIVE running
   timer, but a global "quiz finished" rule hides it with !important once
   the attempt ends — so it stayed hidden all through review too, even
   though ssc-solution-shell.js fills it with the category's final time
   taken. Un-hide it here (higher specificity + loaded after that rule) on
   every screen size, so every category's time is visible at a glance next
   to its tab, not just the currently-open one in "Section Time:" above.
   Deliberately no colour/size/weight overrides below — the base plugin
   already styles this element for the running exam (incl. on phones); we
   only restore its display so it looks exactly like it does there. */
.quizSEO_ssc_official.ssc-review-mode .category-tab-container,
.quizSEO_ssc_official.ssc-review-mode .category-timer-display {
    display: inline-block !important;
}

/* --- palette colours by outcome (Section / Category / All) ------------- */
.quizSEO_ssc_official.ssc-review-mode .ssc-rv-pal-correct {
    background: var(--ssc-ok) !important;
    color: var(--ssc-on-status, #fff) !important;
    border-color: var(--ssc-ok) !important;
}
.quizSEO_ssc_official.ssc-review-mode .ssc-rv-pal-wrong {
    background: var(--ssc-bad) !important;
    color: var(--ssc-on-status, #fff) !important;
    border-color: var(--ssc-bad) !important;
}
.quizSEO_ssc_official.ssc-review-mode .ssc-rv-pal-skipped {
    background: var(--ssc-surface) !important;
    color: var(--ssc-head) !important;
    border-color: var(--ssc-line-strong) !important;
}
/* HY-CHANGE 2026-08-26i: soft current — light shade fill, no solid blue,
   no heavy ring. Kill quizSEO_reviewQuestionTarget solid accent during
   review (it followed clicks / stayed on Q1). Review mode only. */

/* Remove plugin solid blue "target" fill during review */
.quizSEO_ssc_official.ssc-review-mode .quizSEO_reviewQuestion li.quizSEO_reviewQuestionTarget,
.quizSEO_ssc_official.ssc-review-mode .ssc-rv-palettebar .quizSEO_reviewQuestion li.quizSEO_reviewQuestionTarget,
.quizSEO_ssc_official.ssc-review-mode .quizSEO_questionPaletteButton.quizSEO_reviewQuestionTarget,
.quizSEO_ssc_official.ssc-review-mode .quizSEO_questionPalette li.quizSEO_reviewQuestionTarget,
.quizSEO_ssc_official.ssc-review-mode .quizSEO_paletteButtons .quizSEO_reviewQuestionTarget {
    background: transparent !important;
    background-color: transparent !important;
    color: inherit !important;
    border-color: #94a3b8 !important;
    box-shadow: none !important;
}

/* Soft light shade for current question */
.quizSEO_ssc_official.ssc-review-mode .ssc-rv-pal-current {
    outline: none !important;
    box-shadow: none !important;
    border-color: #94a3b8 !important;
    background: #e8f1fb !important;
    background-color: #e8f1fb !important;
    color: #0f172a !important;
}
.quizSEO_ssc_official.ssc-review-mode .ssc-rv-pal-correct.ssc-rv-pal-current {
    background: var(--ssc-ok) !important;
    background-color: var(--ssc-ok) !important;
    border-color: var(--ssc-ok) !important;
    color: #fff !important;
    box-shadow: none !important;
}
.quizSEO_ssc_official.ssc-review-mode .ssc-rv-pal-wrong.ssc-rv-pal-current {
    background: var(--ssc-bad) !important;
    background-color: var(--ssc-bad) !important;
    border-color: var(--ssc-bad) !important;
    color: #fff !important;
    box-shadow: none !important;
}

/* Durable numbers on bottom strip */
.quizSEO_ssc_official.ssc-review-mode .ssc-rv-palettebar .quizSEO_reviewQuestion li[data-ssc-n] {
    font-size: 0 !important;
    color: transparent !important;
}
.quizSEO_ssc_official.ssc-review-mode .ssc-rv-palettebar .quizSEO_reviewQuestion li[data-ssc-n]::before {
    content: attr(data-ssc-n);
    font-size: 13px !important;
    font-weight: 600 !important;
    line-height: 36px !important;
    color: #0f172a !important;
    display: block !important;
    width: 100%;
    text-align: center;
}
.quizSEO_ssc_official.ssc-review-mode .ssc-rv-palettebar .quizSEO_reviewQuestion li.ssc-rv-pal-correct[data-ssc-n]::before,
.quizSEO_ssc_official.ssc-review-mode .ssc-rv-palettebar .quizSEO_reviewQuestion li.ssc-rv-pal-wrong[data-ssc-n]::before {
    color: #fff !important;
}
.quizSEO_ssc_official.ssc-review-mode .ssc-rv-palettebar .quizSEO_reviewQuestion li.ssc-rv-pal-current[data-ssc-n]::before {
    color: #0f172a !important;
}
.quizSEO_ssc_official.ssc-review-mode .ssc-rv-palettebar .quizSEO_reviewQuestion li.ssc-rv-pal-correct.ssc-rv-pal-current[data-ssc-n]::before,
.quizSEO_ssc_official.ssc-review-mode .ssc-rv-palettebar .quizSEO_reviewQuestion li.ssc-rv-pal-wrong.ssc-rv-pal-current[data-ssc-n]::before {
    color: #fff !important;
}
.quizSEO_ssc_official.ssc-review-mode .ssc-rv-palettebar .quizSEO_reviewQuestion li.ssc-rv-pal-current {
    background: #e8f1fb !important;
    background-color: #e8f1fb !important;
    border-color: #94a3b8 !important;
    box-shadow: none !important;
    outline: none !important;
}
/* HY-CHANGE 2026-08-26j: neutral white for non-current cells so leftover
   Target/setColor solid blue (often stuck on Q1) cannot show. */
.quizSEO_ssc_official.ssc-review-mode .ssc-rv-palettebar .quizSEO_reviewQuestion li:not(.ssc-rv-pal-current):not(.ssc-rv-pal-correct):not(.ssc-rv-pal-wrong) {
    background: #fff !important;
    background-color: #fff !important;
    color: #0f172a !important;
    border-color: #94a3b8 !important;
    box-shadow: none !important;
}
.quizSEO_ssc_official.ssc-review-mode .ssc-rv-palettebar .quizSEO_reviewQuestion li:not(.ssc-rv-pal-current):not(.ssc-rv-pal-correct):not(.ssc-rv-pal-wrong)[data-ssc-n]::before {
    color: #0f172a !important;
}

/* --- mobile: ditto exam feel, no horizontal scroll, sticky footer ------- */
@media (max-width: 768px) {
    /* CRITICAL: on iPhone the exam uses PSEUDO fullscreen (root is fixed and
       the page is locked). Without a scroll container the question/solution is
       cut off and the footer overlaps it (and swallows taps). Make the root the
       scroller so everything is reachable and the sticky footer works. */
    .quizSEO_ssc_official.ssc-review-mode.ssc-pseudo-fullscreen,
    .quizSEO_ssc_official.ssc-review-mode {
        overflow-y: auto !important;
        -webkit-overflow-scrolling: touch;
    }
    .quizSEO_ssc_official.ssc-review-mode { overflow-x: hidden !important; }

    .quizSEO_ssc_official.ssc-review-mode .ssc-topbar,
    .quizSEO_ssc_official.ssc-review-mode .ssc-exam-body,
    .quizSEO_ssc_official.ssc-review-mode .ssc-exam-main,
    .quizSEO_ssc_official.ssc-review-mode .ssc-exam-sidebar {
        max-width: 100% !important;
        box-sizing: border-box !important;
    }
    .quizSEO_ssc_official.ssc-review-mode .ssc-exam-body {
        grid-template-columns: 1fr !important;
        padding-bottom: 130px;          /* clear the 2-row sticky footer */
    }

    /* Topbar rows wrap instead of pushing width; keep tools reachable. */
    .quizSEO_ssc_official.ssc-review-mode .ssc-topbar__row {
        flex-wrap: wrap !important;
        gap: 6px 10px !important;
        row-gap: 6px;
    }
    /* Show Quiz Name + Total Time (name row) on mobile too. "Section Time:"
       is deliberately NOT shown on this row any more — see below, it's
       replaced by the per-question meta chips joining "Ques X of Y". */
    .quizSEO_ssc_official.ssc-review-mode .ssc-topbar__row--name { display: flex !important; }
    .quizSEO_ssc_official.ssc-review-mode .ssc-topbar__global-time { flex-wrap: wrap; }
    .quizSEO_ssc_official.ssc-mobile-header.ssc-review-mode .ssc-topbar__cat-time {
        display: none !important;
    }

    /* Mobile review meta — fit full content width:
         Line 1: [Q x/y] …… [Save][Report] …… [Eng|Hindi]  (spread across width)
         Line 2: [ Time ] [ Avg ] [ Correct ]               (full width, centred)
       No horizontal overflow; both rows constrained to the mobile content box. */
    .quizSEO_ssc_official.ssc-mobile-header.ssc-review-mode .ssc-qn-full { display: none; }
    .quizSEO_ssc_official.ssc-mobile-header.ssc-review-mode .ssc-qn-short { display: inline; }

    .quizSEO_ssc_official.ssc-mobile-header.ssc-review-mode .ssc-topbar__row--qmeta {
        flex-wrap: wrap !important;
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }
    .quizSEO_ssc_official.ssc-mobile-header.ssc-review-mode .ssc-topbar__qmeta,
    .quizSEO_ssc_official.ssc-mobile-header.ssc-review-mode .ssc-exam-main > .ssc-topbar__qmeta {
        display: flex !important;
        flex-wrap: wrap !important;
        align-items: center !important;
        justify-content: space-between !important;
        gap: 6px 8px !important;
        row-gap: 8px !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        box-sizing: border-box !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        overflow-x: hidden !important;
    }
    .quizSEO_ssc_official.ssc-mobile-header.ssc-review-mode .ssc-topbar__qnum {
        flex: 0 1 auto;
        min-width: 0;
        max-width: 42%;
    }
    .quizSEO_ssc_official.ssc-mobile-header.ssc-review-mode .ssc-theme-toggle {
        flex: 0 0 auto;
    }
    .quizSEO_ssc_official.ssc-mobile-header.ssc-review-mode .ssc-topbar__qmeta .qsQtools {
        flex: 0 0 auto;
        margin-left: auto;
    }
    .quizSEO_ssc_official.ssc-mobile-header.ssc-review-mode .ssc-topbar__qmeta .quizSEO_langBar {
        flex: 0 0 auto;
        margin-left: 0 !important;
        max-width: 45%;
    }
    .quizSEO_ssc_official.ssc-mobile-header.ssc-review-mode .ssc-topbar__qmeta .quizSEO_langBar .quizSEO_langBtn {
        padding: 3px 8px !important;
        font-size: 11px !important;
    }
    /* Soft chips: always a full-width second row, centred as a group */
    .quizSEO_ssc_official.ssc-mobile-header.ssc-review-mode .ssc-topbar__qmeta > .ssc-rv-meta.ssc-rv-pill {
        display: flex !important;
        flex: 0 0 100% !important;
        flex-wrap: wrap;
        justify-content: center !important;
        align-items: center;
        gap: 6px;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        float: none !important;
        margin: 2px 0 0 !important;
        padding: 0 !important;
        order: 99;
        box-sizing: border-box !important;
    }
    .quizSEO_ssc_official.ssc-mobile-header.ssc-review-mode .ssc-rv-pill > .ssc-rv-seg {
        flex: 0 1 auto;
        max-width: 100%;
        padding: 4px 8px;
        gap: 4px;
        box-sizing: border-box;
    }
    .quizSEO_ssc_official.ssc-mobile-header.ssc-review-mode .ssc-rv-pill .ssc-rv-k {
        font-size: 9px;
    }
    .quizSEO_ssc_official.ssc-mobile-header.ssc-review-mode .ssc-rv-pill .ssc-rv-v {
        font-size: 12px;
    }
    /* Fallback when chips are still on the question card */
    .quizSEO_ssc_official.ssc-mobile-header.ssc-review-mode .quizSEO_listItem .ssc-rv-meta.ssc-rv-pill,
    .quizSEO_ssc_official.ssc-mobile-header.ssc-review-mode .quizSEO_sectionRow .ssc-rv-meta.ssc-rv-pill {
        float: none !important;
        display: flex !important;
        width: 100% !important;
        max-width: 100% !important;
        justify-content: center !important;
        flex-wrap: wrap;
        margin: 6px 0 0 !important;
        box-sizing: border-box !important;
    }
    .quizSEO_ssc_official.ssc-review-mode .quizSEO_sectionRow,
    .quizSEO_ssc_official.ssc-review-mode .quizSEO_question {
        flex-wrap: wrap !important;
    }

    /* Palettes fill the width and WRAP (no long off-screen row). */
    .quizSEO_ssc_official.ssc-review-mode .quizSEO_reviewQuestion,
    .quizSEO_ssc_official.ssc-review-mode .quizSEO_questionPalette,
    .quizSEO_ssc_official.ssc-review-mode .ssc-cat-palette-slot,
    .quizSEO_ssc_official.ssc-review-mode .ssc-main-palette-slot {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }
    .quizSEO_ssc_official.ssc-review-mode .quizSEO_reviewQuestion ol,
    .quizSEO_ssc_official.ssc-review-mode .quizSEO_questionPalette ol,
    .quizSEO_ssc_official.ssc-review-mode .quizSEO_paletteButtons {
        display: flex !important;
        flex-wrap: wrap !important;
        gap: 6px !important;
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        box-sizing: border-box !important;
    }
    .quizSEO_ssc_official.ssc-review-mode .quizSEO_reviewQuestion ol li,
    .quizSEO_ssc_official.ssc-review-mode .quizSEO_questionPalette ol li,
    .quizSEO_ssc_official.ssc-review-mode .quizSEO_questionPaletteButton { flex: 0 0 auto; }

    /* Footer: the nav is lifted into .ssc-rv-mobilebar (a direct child of the
       review root, pinned above the content) so the buttons are always tappable
       — the in-flow .ssc-footer-bar is not used on mobile. */
    .quizSEO_ssc_official.ssc-review-mode .ssc-footer-bar { display: none !important; }
    .quizSEO_ssc_official.ssc-review-mode .ssc-rv-mobilebar {
        display: block !important;
        position: fixed;
        left: 0; right: 0; bottom: 0;
        width: 100%;
        z-index: 2147483000;
        box-sizing: border-box;
        background: var(--ssc-surface);
        border-top: 1px solid var(--ssc-line);
        box-shadow: 0 -2px 10px rgba(0, 0, 0, .2);
        padding: 8px 12px;
        padding-bottom: calc(8px + env(safe-area-inset-bottom, 0px));
    }
    .quizSEO_ssc_official.ssc-review-mode .ssc-rv-mobilebar .ssc-rv-nav {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 8px;
        width: 100%;
        max-width: none;
        margin: 0;
    }
    /* The desktop-only left/right wrapper groups (added so the buttons split
       like the live exam's footer) must not become grid cells themselves on
       mobile — collapse them out of the box model so the 4 buttons inside
       still lay out directly in the 2x2 grid above, exactly as before. */
    .quizSEO_ssc_official.ssc-review-mode .ssc-rv-mobilebar .ssc-rv-nav__left,
    .quizSEO_ssc_official.ssc-review-mode .ssc-rv-mobilebar .ssc-rv-nav__right {
        display: contents;
    }
    /* Desktop markup order is now Previous, Back to Result, My Profile, Next
       (for the left/right split); restore the original mobile 2x2 grid
       arrangement — Previous | Next on top, Back to Result | My Profile
       below — with explicit order, independent of that markup order. */
    .quizSEO_ssc_official.ssc-review-mode .ssc-rv-mobilebar .ssc-rv-prev { order: 1; }
    .quizSEO_ssc_official.ssc-review-mode .ssc-rv-mobilebar .ssc-rv-next { order: 2; }
    .quizSEO_ssc_official.ssc-review-mode .ssc-rv-mobilebar .ssc-rv-back { order: 3; }
    .quizSEO_ssc_official.ssc-review-mode .ssc-rv-mobilebar .ssc-rv-profile { order: 4; }
    .quizSEO_ssc_official.ssc-review-mode .ssc-rv-mobilebar .ssc-rv-btn {
        display: inline-flex; align-items: center; justify-content: center;
        width: 100%;
        padding: 12px 10px !important;
        border-radius: 6px !important;
        border: 1px solid var(--ssc-brand) !important;
        background: var(--ssc-surface) !important;
        color: var(--ssc-head) !important;
        font-weight: 600 !important; font-size: 14px !important;
        line-height: 1; cursor: pointer; text-decoration: none;
        -webkit-appearance: none; appearance: none; box-shadow: none !important;
        touch-action: manipulation; pointer-events: auto !important;
        -webkit-tap-highlight-color: rgba(0,0,0,0.08);
    }
    .quizSEO_ssc_official.ssc-review-mode .ssc-rv-mobilebar .ssc-rv-next {
        background: var(--ssc-brand) !important; color: var(--ssc-on-brand) !important;
    }
    .quizSEO_ssc_official.ssc-review-mode .ssc-rv-mobilebar .ssc-rv-prev:disabled { opacity: .45; }

    /* --- "All Question Palette" — fixed horizontal strip above the mobile
       nav bar --------------------------------------------------------------
       ssc-exam-template.css already has a .ssc-quiz-finished-only version of
       this (bottom: 58px, tuned for the live exam's sticky action bar), but
       review mode replaces that footer with .ssc-rv-mobilebar (a taller,
       2-row fixed bar — see above), so a copy of the palette pinned at only
       58px would sit partly behind/under it. Re-declare it here, scoped to
       .ssc-review-mode (this file loads after ssc-exam-template.css, so an
       equal-specificity selector here already wins — this block also raises
       the offset to actually clear .ssc-rv-mobilebar). Single source of
       truth for review: this is the only place review needs to restyle it,
       since onQuizFinished() no longer inline-hides the wrapper (that inline
       style was the actual reason the strip went missing here — see the
       comment on that function). */
    .quizSEO_ssc_official.ssc-review-mode .ssc-palette-subtitle--all {
        display: none;
    }
    /* The strip is lifted by JS (placeMobilePalette()) into .ssc-rv-palettebar,
       a direct child of the review root — same technique already used for
       .ssc-rv-mobilebar, and for the same two reasons:
       1) Stacking: while .quizSEO_reviewQuestion stayed nested inside
          .ssc-exam-sidebar, an intermediate ancestor could establish its own
          stacking context and place the whole strip behind other page
          content regardless of the strip's own z-index — a leaf z-index only
          wins against siblings in the SAME stacking context. As a root-level
          sibling of .ssc-rv-mobilebar it now competes on equal footing.
       2) Touch scrolling: mobile Safari/Chrome's gesture router did not
          reliably hand horizontal drags to an overflow-x:auto element several
          layers deep inside the pseudo-fullscreen root (which itself sets
          overflow-x:hidden). A shallow, root-level fixed box scrolls
          reliably the same way .ssc-rv-nav's own horizontal fallback does. */
    /* HY-CHANGE 2026-08-26e: force strip + boxes visible on View Answers mobile */
    .quizSEO_ssc_official.ssc-review-mode .ssc-rv-palettebar {
        display: block !important;
        visibility: visible !important;
        position: fixed !important;
        left: 0 !important;
        right: 0 !important;
        bottom: var(--ssc-rv-bar-h, 130px) !important;   /* flush above .ssc-rv-mobilebar */
        z-index: 2147482999 !important;   /* .ssc-rv-mobilebar is 2147483000 */
        height: 54px !important;
        max-height: 54px !important;   /* hard safety cap, see notes above */
        overflow-x: auto !important;
        overflow-y: hidden !important;
        -webkit-overflow-scrolling: touch !important;
        /* The review root sets overflow-x:hidden (it's the fixed,
           pseudo-fullscreen scroll surface for the whole page) — on mobile
           Safari/Chrome that can suppress horizontal touch-panning for a
           descendant too unless it explicitly opts back in here. */
        touch-action: pan-x !important;
        width: 100% !important;
        box-sizing: border-box !important;
        background: var(--ssc-surface) !important;
        border: none !important;
        border-top: 1px solid var(--ssc-line-soft-cool) !important;
        border-bottom: 1px solid var(--ssc-line-soft-cool) !important;
        box-shadow: 0 -2px 6px rgba(15, 61, 76, 0.08) !important;
        margin: 0 !important;
    }
    /* Neutralize the element's own old fixed-positioning look now that the
       wrapper handles it — it becomes a plain block inside the wrapper. */
    .quizSEO_ssc_official.ssc-review-mode .ssc-rv-palettebar .quizSEO_reviewQuestion {
        position: static !important;
        width: 100% !important;
        max-width: none !important;
        height: auto !important;
        max-height: none !important;
        overflow: visible !important;
        background: transparent !important;
        border: none !important;
        box-shadow: none !important;
        margin: 0 !important;
    }
    /* The drag/resize handle has no purpose on a fixed horizontal strip. */
    .quizSEO_ssc_official.ssc-review-mode .ssc-rv-palettebar .quizSEO_reviewQuestion > div {
        display: none !important;
    }
    /* The <ol> holds the floated <li> buttons — make it one flex row. */
    .quizSEO_ssc_official.ssc-review-mode .ssc-rv-palettebar .quizSEO_reviewQuestion ol {
        display: flex !important;
        flex-wrap: nowrap !important;
        flex-direction: row !important;
        align-items: center !important;
        gap: 8px !important;
        width: max-content !important;
        min-width: 100% !important;
        box-sizing: border-box !important;
        margin: 0 !important;
        padding: 8px 14px !important;
        white-space: nowrap !important;
        touch-action: pan-x !important;
    }
    /* float:left (quizSEO_front.css) is ignored inside a flex container per
       spec, but set it explicitly so this stays robust either way. */
    .quizSEO_ssc_official.ssc-review-mode .ssc-rv-palettebar .quizSEO_reviewQuestion li {
        float: none !important;
        flex: 0 0 auto !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        visibility: visible !important;
        width: 36px !important;
        height: 36px !important;
        min-width: 36px !important;
        margin: 0 !important;
        padding: 0 !important;
        border-radius: 6px !important;
        border: 1px solid #94a3b8 !important;
        /* No !important on background — status classes (correct/wrong) must win */
        background: #fff;
        font-weight: 600 !important;
        font-size: 13px !important;
        line-height: 1 !important;
        box-sizing: border-box !important;
        cursor: pointer !important;
        list-style: none !important;
    }

    /* leave room so the last content clears BOTH fixed bars: the palette
       strip (54px tall, starting flush above the nav bar) and
       .ssc-rv-mobilebar below it (height now measured live — see
       syncMobileBarHeight() — since it varies by device/safe-area). */
    .quizSEO_ssc_official.ssc-review-mode .ssc-exam-body {
        padding-bottom: calc(var(--ssc-rv-bar-h, 130px) + 54px + 4px + 20px) !important;
    }
}

/* ==========================================================================
   HY-CHANGE 2026-08-30 — SSC View Answers Demo A: rail on fixed palettebar
   Review-mode only. White ☰ rail on right of .ssc-rv-palettebar.
   Opens .ssc-exam-sidebar as side drawer (same as running test).
   ========================================================================== */
@media (max-width: 768px) {
    html body .quizSEO_ssc_official.ssc-review-mode .ssc-rv-palettebar {
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        overflow: hidden !important;
        padding: 0 !important;
    }

    html body .quizSEO_ssc_official.ssc-review-mode .ssc-rv-palettebar .quizSEO_reviewQuestion {
        flex: 1 1 auto !important;
        min-width: 0 !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        -webkit-overflow-scrolling: touch !important;
        margin: 0 !important;
    }

    html body .quizSEO_ssc_official.ssc-review-mode .ssc-rv-palettebar .ssc-mobile-palette-rail,
    html body .quizSEO_ssc_official.ssc-review-mode .ssc-rv-palette-rail {
        display: inline-flex !important;
        flex: 0 0 42px !important;
        width: 42px !important;
        min-width: 42px !important;
        max-width: 42px !important;
        height: 42px !important;
        align-items: center !important;
        justify-content: center !important;
        align-self: center !important;
        position: relative !important;
        z-index: 5 !important;
        margin: 0 0 0 0 !important;
        padding: 0 !important;
        border: none !important;
        border-left: 1px solid #e2e8f0 !important;
        background: #f1f5f9 !important;
        color: #334155 !important;
        cursor: pointer !important;
        order: 99 !important;
        -webkit-tap-highlight-color: transparent !important;
    }
    html body .quizSEO_ssc_official.ssc-review-mode .ssc-rv-palettebar .ssc-mobile-palette-rail::before,
    html body .quizSEO_ssc_official.ssc-review-mode .ssc-rv-palette-rail::before {
        content: "" !important;
        position: absolute !important;
        left: -20px !important;
        top: 0 !important;
        bottom: 0 !important;
        width: 20px !important;
        background: linear-gradient(to right, rgba(241,245,249,0), #f1f5f9) !important;
        pointer-events: none !important;
    }
    html body .quizSEO_ssc_official.ssc-review-mode .ssc-mobile-palette-rail__ham {
        display: inline-flex !important;
        flex-direction: column !important;
        justify-content: center !important;
        gap: 3px !important;
        width: 18px !important;
        height: 14px !important;
    }
    html body .quizSEO_ssc_official.ssc-review-mode .ssc-mobile-palette-rail__ham i {
        display: block !important;
        width: 18px !important;
        height: 2px !important;
        border-radius: 1px !important;
        background: #334155 !important;
    }

    /* Hide palettebar while drawer open */
    html body .quizSEO_ssc_official.ssc-review-mode.ssc-mobile-palette-open .ssc-rv-palettebar {
        display: none !important;
        visibility: hidden !important;
        pointer-events: none !important;
    }

    /* Review: full drawer parked off-screen; open slides from right */
    html body .quizSEO_ssc_official.ssc-review-mode .ssc-exam-sidebar {
        display: flex !important;
        position: fixed !important;
        top: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
        left: auto !important;
        width: 82% !important;
        max-width: 320px !important;
        height: 100% !important;
        z-index: 10050 !important;
        background: var(--ssc-surface-alt, #f4f7fa) !important;
        box-shadow: -8px 0 28px rgba(15, 23, 42, 0.18) !important;
        padding: 44px 12px 12px !important;
        overflow: hidden !important;
        flex-direction: column !important;
        transform: translateX(105%) !important;
        transition: transform .3s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
        pointer-events: none !important;
        visibility: visible !important;
        opacity: 1 !important;
    }
    html body .quizSEO_ssc_official.ssc-review-mode.ssc-mobile-palette-open .ssc-exam-sidebar {
        transform: translateX(0) !important;
        pointer-events: auto !important;
    }

    html body .quizSEO_ssc_official.ssc-review-mode .ssc-mobile-palette-scrim {
        display: block !important;
        position: fixed !important;
        inset: 0 !important;
        z-index: 10045 !important;
        background: rgba(15, 23, 42, 0.45) !important;
        opacity: 0 !important;
        visibility: hidden !important;
        pointer-events: none !important;
    }
    html body .quizSEO_ssc_official.ssc-review-mode.ssc-mobile-palette-open .ssc-mobile-palette-scrim {
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
    }

    html body .quizSEO_ssc_official.ssc-review-mode.ssc-mobile-palette-open .ssc-mobile-palette-close {
        display: flex !important;
        position: absolute !important;
        top: 8px !important;
        right: 8px !important;
        z-index: 2 !important;
        width: 32px !important;
        height: 32px !important;
        align-items: center !important;
        justify-content: center !important;
        border: 1px solid #c5d0d8 !important;
        border-radius: 6px !important;
        background: #fff !important;
        color: #64748b !important;
        font-size: 18px !important;
        cursor: pointer !important;
    }
}
/* ===================== END HY-CHANGE 2026-08-30 Demo A (review) ===================== */

/* ==========================================================================
   HY-CHANGE 2026-08-30m — View Answers palette fixes
   1) Hide ABOVE-question category strip in review
   2) Marked / correct-marked / wrong-marked colours
   3) Bottom strip keeps outcome colours
   4) Side drawer shows all boxes in 6-col grid
   ========================================================================== */

/* Hide live mobile category strip during View Answers */
.quizSEO_ssc_official.ssc-review-mode .ssc-mobile-palette-strip,
.quizSEO_ssc_official.ssc-review-mode.ssc-mobile-palette-above .ssc-mobile-palette-strip {
    display: none !important;
    visibility: hidden !important;
    height: 0 !important;
    max-height: 0 !important;
    overflow: hidden !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    pointer-events: none !important;
}

/* Extra outcome colours */
.quizSEO_ssc_official.ssc-review-mode .ssc-rv-pal-marked {
    background: #ca8a04 !important;
    background-color: #ca8a04 !important;
    color: #fff !important;
    border-color: #ca8a04 !important;
}
.quizSEO_ssc_official.ssc-review-mode .ssc-rv-pal-correct-marked {
    background: #16a34a !important;
    background-color: #16a34a !important;
    color: #fff !important;
    border-color: #16a34a !important;
}
.quizSEO_ssc_official.ssc-review-mode .ssc-rv-pal-wrong-marked {
    background: #dc2626 !important;
    background-color: #dc2626 !important;
    color: #fff !important;
    border-color: #dc2626 !important;
}
.quizSEO_ssc_official.ssc-review-mode .ssc-rv-palettebar .quizSEO_reviewQuestion li.ssc-rv-pal-marked[data-ssc-n]::before,
.quizSEO_ssc_official.ssc-review-mode .ssc-rv-palettebar .quizSEO_reviewQuestion li.ssc-rv-pal-correct-marked[data-ssc-n]::before,
.quizSEO_ssc_official.ssc-review-mode .ssc-rv-palettebar .quizSEO_reviewQuestion li.ssc-rv-pal-wrong-marked[data-ssc-n]::before {
    color: #fff !important;
}
.quizSEO_ssc_official.ssc-review-mode .ssc-rv-palettebar .quizSEO_reviewQuestion li.ssc-rv-pal-skipped {
    background: #f1f5f9 !important;
    background-color: #f1f5f9 !important;
    color: #0f172a !important;
    border-color: #94a3b8 !important;
}
.quizSEO_ssc_official.ssc-review-mode .ssc-rv-palettebar .quizSEO_reviewQuestion li.ssc-rv-pal-skipped[data-ssc-n]::before {
    color: #0f172a !important;
}

@media (max-width: 768px) {
    /* Drawer: show full numbered list */
    html body .quizSEO_ssc_official.ssc-review-mode.ssc-mobile-palette-open .ssc-exam-sidebar .quizSEO_reviewQuestion,
    html body .quizSEO_ssc_official.ssc-review-mode.ssc-mobile-palette-open .ssc-exam-sidebar .ssc-main-palette-slot,
    html body .quizSEO_ssc_official.ssc-review-mode.ssc-mobile-palette-open .ssc-exam-sidebar .quizSEO_reviewQuestion ol {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        height: auto !important;
        max-height: none !important;
        overflow: visible !important;
    }
    html body .quizSEO_ssc_official.ssc-review-mode.ssc-mobile-palette-open .ssc-exam-sidebar .quizSEO_reviewQuestion ol {
        display: grid !important;
        grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
        gap: 6px !important;
        width: 100% !important;
        list-style: none !important;
        margin: 0 !important;
        padding: 0 !important;
    }
    html body .quizSEO_ssc_official.ssc-review-mode.ssc-mobile-palette-open .ssc-exam-sidebar .quizSEO_reviewQuestion ol li {
        display: flex !important;
        visibility: visible !important;
        opacity: 1 !important;
        width: 100% !important;
        min-width: 0 !important;
        height: 30px !important;
        align-items: center !important;
        justify-content: center !important;
        margin: 0 !important;
        box-sizing: border-box !important;
    }
}
/* ===================== END HY-CHANGE 2026-08-30m ===================== */

/* ==========================================================================
   HY-CHANGE 2026-08-30n — Mobile side drawer: always show numbered boxes
   Overrides ssc-has-section-palette { reviewQuestion: display:none }
   ========================================================================== */
@media (max-width: 768px) {
    html body .quizSEO_ssc_official.ssc-review-mode.ssc-mobile-palette-open .ssc-exam-sidebar,
    html body .quizSEO_ssc_official.ssc-review-mode.ssc-mobile-palette-open .ssc-exam-sidebar.ssc-rv-drawer-sidebar {
        display: flex !important;
        visibility: visible !important;
        opacity: 1 !important;
        pointer-events: auto !important;
        position: fixed !important;
        top: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
        left: auto !important;
        width: 82% !important;
        max-width: 320px !important;
        height: 100% !important;
        z-index: 10050 !important;
        background: #f4f7fa !important;
        box-shadow: -8px 0 28px rgba(15, 23, 42, 0.18) !important;
        padding: 44px 12px 12px !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        flex-direction: column !important;
        transform: translateX(0) !important;
    }

    /* Beat has-section-palette hide of reviewQuestion */
    html body .quizSEO_ssc_official.ssc-review-mode.ssc-mobile-palette-open.ssc-has-section-palette .ssc-exam-sidebar .quizSEO_reviewQuestion,
    html body .quizSEO_ssc_official.ssc-review-mode.ssc-mobile-palette-open .ssc-exam-sidebar .quizSEO_reviewQuestion,
    html body .quizSEO_ssc_official.ssc-review-mode.ssc-mobile-palette-open .ssc-exam-sidebar .ssc-rv-drawer-pal-host,
    html body .quizSEO_ssc_official.ssc-review-mode.ssc-mobile-palette-open .ssc-exam-sidebar .ssc-main-palette-slot,
    html body .quizSEO_ssc_official.ssc-review-mode.ssc-mobile-palette-open .ssc-exam-sidebar .ssc-sidebar-scroll {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        height: auto !important;
        max-height: none !important;
        overflow: visible !important;
        width: 100% !important;
    }

    html body .quizSEO_ssc_official.ssc-review-mode.ssc-mobile-palette-open .ssc-exam-sidebar .quizSEO_reviewQuestion ol {
        display: grid !important;
        grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
        gap: 6px !important;
        width: 100% !important;
        list-style: none !important;
        margin: 0 !important;
        padding: 4px 0 !important;
        overflow: visible !important;
        float: none !important;
    }

    html body .quizSEO_ssc_official.ssc-review-mode.ssc-mobile-palette-open .ssc-exam-sidebar .quizSEO_reviewQuestion ol li {
        display: flex !important;
        visibility: visible !important;
        opacity: 1 !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;
        height: 32px !important;
        min-height: 32px !important;
        align-items: center !important;
        justify-content: center !important;
        margin: 0 !important;
        padding: 0 !important;
        box-sizing: border-box !important;
        border-radius: 4px !important;
        border: 1px solid #94a3b8 !important;
        font-size: 12px !important;
        font-weight: 600 !important;
        line-height: 1 !important;
        color: #0f172a !important;
        cursor: pointer !important;
        float: none !important;
        /* drawer is NOT the bottom strip — show text, not transparent+::before */
    }
    html body .quizSEO_ssc_official.ssc-review-mode.ssc-mobile-palette-open .ssc-exam-sidebar .quizSEO_reviewQuestion ol li[data-ssc-n] {
        font-size: 12px !important;
        color: #0f172a !important;
    }
    html body .quizSEO_ssc_official.ssc-review-mode.ssc-mobile-palette-open .ssc-exam-sidebar .quizSEO_reviewQuestion ol li[data-ssc-n]::before {
        content: none !important;
        display: none !important;
    }

    /* Hide category section grid in review drawer */
    html body .quizSEO_ssc_official.ssc-review-mode.ssc-mobile-palette-open .ssc-exam-sidebar .quizSEO_questionPalette,
    html body .quizSEO_ssc_official.ssc-review-mode.ssc-mobile-palette-open .ssc-exam-sidebar .ssc-cat-palette-slot {
        display: none !important;
    }
}
/* ===================== END HY-CHANGE 2026-08-30n ===================== */

/* ==========================================================================
   HY-CHANGE 2026-08-30o — Mobile side drawer = CURRENT CATEGORY only
   All Question Palette stays on the fixed bottom bar only.
   ========================================================================== */
@media (max-width: 768px) {
    html body .quizSEO_ssc_official.ssc-review-mode.ssc-mobile-palette-open .ssc-exam-sidebar .ssc-rv-drawer-cat-title {
        display: block !important;
        font-size: 13px !important;
        font-weight: 700 !important;
        color: #0f172a !important;
        margin: 0 0 10px !important;
        padding: 0 !important;
        line-height: 1.3 !important;
    }

    /* Only category host list is visible in drawer */
    html body .quizSEO_ssc_official.ssc-review-mode.ssc-mobile-palette-open .ssc-exam-sidebar .ssc-rv-drawer-pal-host,
    html body .quizSEO_ssc_official.ssc-review-mode.ssc-mobile-palette-open .ssc-exam-sidebar .ssc-rv-cat-drawer-pal,
    html body .quizSEO_ssc_official.ssc-review-mode.ssc-mobile-palette-open .ssc-exam-sidebar .ssc-rv-cat-drawer-pal ol {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        width: 100% !important;
        height: auto !important;
        max-height: none !important;
        overflow: visible !important;
    }
    html body .quizSEO_ssc_official.ssc-review-mode.ssc-mobile-palette-open .ssc-exam-sidebar .ssc-rv-cat-drawer-pal ol {
        display: grid !important;
        grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
        gap: 6px !important;
        list-style: none !important;
        margin: 0 !important;
        padding: 0 !important;
    }
    html body .quizSEO_ssc_official.ssc-review-mode.ssc-mobile-palette-open .ssc-exam-sidebar .ssc-rv-cat-drawer-pal ol li {
        display: flex !important;
        visibility: visible !important;
        opacity: 1 !important;
        width: 100% !important;
        min-width: 0 !important;
        height: 32px !important;
        align-items: center !important;
        justify-content: center !important;
        font-size: 12px !important;
        font-weight: 600 !important;
        margin: 0 !important;
        box-sizing: border-box !important;
        border-radius: 4px !important;
        cursor: pointer !important;
    }
    html body .quizSEO_ssc_official.ssc-review-mode.ssc-mobile-palette-open .ssc-exam-sidebar .ssc-rv-cat-drawer-pal ol li[data-ssc-n]::before {
        content: none !important;
        display: none !important;
    }

    /* Never show All Question Palette inside the side drawer */
    html body .quizSEO_ssc_official.ssc-review-mode.ssc-mobile-palette-open .ssc-exam-sidebar .ssc-main-palette-slot,
    html body .quizSEO_ssc_official.ssc-review-mode.ssc-mobile-palette-open .ssc-exam-sidebar .ssc-palette-subtitle--all,
    html body .quizSEO_ssc_official.ssc-review-mode.ssc-mobile-palette-open .ssc-exam-sidebar > .quizSEO_reviewQuestion:not(.ssc-rv-cat-drawer-pal),
    html body .quizSEO_ssc_official.ssc-review-mode.ssc-mobile-palette-open .ssc-exam-sidebar .ssc-main-palette-slot .quizSEO_reviewQuestion {
        display: none !important;
        visibility: hidden !important;
        height: 0 !important;
        overflow: hidden !important;
    }
}
/* ===================== END HY-CHANGE 2026-08-30o ===================== */

/* ==========================================================================
   HY-CHANGE 2026-08-30p — Dedicated View Answers side panel (current category)
   Independent of .ssc-exam-sidebar — no has-section-palette / strip conflicts.
   ========================================================================== */
@media (max-width: 768px) {
    html body .quizSEO_ssc_official.ssc-review-mode .ssc-rv-side-panel {
        position: fixed !important;
        top: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
        left: auto !important;
        width: 82% !important;
        max-width: 320px !important;
        height: 100% !important;
        z-index: 10055 !important;
        background: #f4f7fa !important;
        box-shadow: -8px 0 28px rgba(15, 23, 42, 0.2) !important;
        padding: 48px 14px 20px !important;
        box-sizing: border-box !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        -webkit-overflow-scrolling: touch !important;
        transform: translateX(105%) !important;
        transition: transform 0.3s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
        pointer-events: none !important;
        visibility: visible !important;
        display: block !important;
    }
    html body .quizSEO_ssc_official.ssc-review-mode.ssc-mobile-palette-open .ssc-rv-side-panel {
        transform: translateX(0) !important;
        pointer-events: auto !important;
    }
    html body .quizSEO_ssc_official.ssc-review-mode .ssc-rv-side-panel__close {
        position: absolute !important;
        top: 10px !important;
        right: 10px !important;
        width: 32px !important;
        height: 32px !important;
        border: 1px solid #c5d0d8 !important;
        border-radius: 6px !important;
        background: #fff !important;
        color: #64748b !important;
        font-size: 18px !important;
        line-height: 1 !important;
        cursor: pointer !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        padding: 0 !important;
        z-index: 2 !important;
    }
    html body .quizSEO_ssc_official.ssc-review-mode .ssc-rv-side-panel__title {
        font-size: 14px !important;
        font-weight: 700 !important;
        color: #0f172a !important;
        margin: 0 0 12px !important;
        line-height: 1.3 !important;
    }
    html body .quizSEO_ssc_official.ssc-review-mode .ssc-rv-side-panel__grid {
        display: grid !important;
        grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
        gap: 6px !important;
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
    }
    html body .quizSEO_ssc_official.ssc-review-mode .ssc-rv-side-panel__grid .ssc-rv-side-box {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 100% !important;
        min-width: 0 !important;
        height: 34px !important;
        margin: 0 !important;
        padding: 0 !important;
        border: 1px solid #94a3b8 !important;
        border-radius: 4px !important;
        background: #fff !important;
        color: #0f172a !important;
        font-size: 12px !important;
        font-weight: 600 !important;
        line-height: 1 !important;
        cursor: pointer !important;
        box-sizing: border-box !important;
        -webkit-appearance: none !important;
        appearance: none !important;
    }
    html body .quizSEO_ssc_official.ssc-review-mode .ssc-rv-side-panel__grid .ssc-rv-side-box.ssc-rv-pal-correct,
    html body .quizSEO_ssc_official.ssc-review-mode .ssc-rv-side-panel__grid .ssc-rv-side-box.ssc-rv-pal-correct-marked {
        background: #16a34a !important;
        border-color: #16a34a !important;
        color: #fff !important;
    }
    html body .quizSEO_ssc_official.ssc-review-mode .ssc-rv-side-panel__grid .ssc-rv-side-box.ssc-rv-pal-wrong,
    html body .quizSEO_ssc_official.ssc-review-mode .ssc-rv-side-panel__grid .ssc-rv-side-box.ssc-rv-pal-wrong-marked {
        background: #dc2626 !important;
        border-color: #dc2626 !important;
        color: #fff !important;
    }
    html body .quizSEO_ssc_official.ssc-review-mode .ssc-rv-side-panel__grid .ssc-rv-side-box.ssc-rv-pal-marked {
        background: #ca8a04 !important;
        border-color: #ca8a04 !important;
        color: #fff !important;
    }
    html body .quizSEO_ssc_official.ssc-review-mode .ssc-rv-side-panel__grid .ssc-rv-side-box.ssc-rv-pal-skipped {
        background: #f1f5f9 !important;
        border-color: #94a3b8 !important;
        color: #0f172a !important;
    }
    html body .quizSEO_ssc_official.ssc-review-mode .ssc-rv-side-panel__grid .ssc-rv-side-box.ssc-rv-pal-current {
        box-shadow: inset 0 0 0 2px #2563eb !important;
    }

    /* Keep live exam sidebar parked off-screen in review (unused for boxes now) */
    html body .quizSEO_ssc_official.ssc-review-mode .ssc-exam-sidebar {
        pointer-events: none !important;
    }
    html body .quizSEO_ssc_official.ssc-review-mode.ssc-mobile-palette-open .ssc-mobile-palette-scrim {
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
        z-index: 10050 !important;
    }
}
/* ===================== END HY-CHANGE 2026-08-30p ===================== */

/* ==========================================================================
   HY-CHANGE 2026-08-30q — Side panel: Attempted + legend + category heading
   ========================================================================== */
@media (max-width: 768px) {
    html body .quizSEO_ssc_official.ssc-review-mode .ssc-rv-side-panel__attempted {
        display: block !important;
        font-size: 13px !important;
        font-weight: 600 !important;
        color: #0f172a !important;
        margin: 0 0 10px !important;
        line-height: 1.35 !important;
    }
    html body .quizSEO_ssc_official.ssc-review-mode .ssc-rv-side-panel__attempted strong {
        font-weight: 700 !important;
        color: #0f172a !important;
    }
    html body .quizSEO_ssc_official.ssc-review-mode .ssc-rv-side-panel__legend {
        display: grid !important;
        grid-template-columns: 1fr 1fr !important;
        grid-template-rows: auto auto !important;
        gap: 6px 10px !important;
        margin: 0 0 14px !important;
        font-size: 11px !important;
        color: #64748b !important;
        width: 100% !important;
    }
    html body .quizSEO_ssc_official.ssc-review-mode .ssc-rv-side-panel__legend span {
        display: inline-flex !important;
        align-items: center !important;
        gap: 6px !important;
        white-space: nowrap !important;
    }
    html body .quizSEO_ssc_official.ssc-review-mode .ssc-rv-side-panel__legend .ssc-dot {
        width: 12px !important;
        height: 12px !important;
        border-radius: 50% !important;
        display: inline-block !important;
        flex-shrink: 0 !important;
    }
    html body .quizSEO_ssc_official.ssc-review-mode .ssc-rv-side-panel__legend .ssc-dot--answered {
        background: #16a34a !important;
    }
    html body .quizSEO_ssc_official.ssc-review-mode .ssc-rv-side-panel__legend .ssc-dot--notanswered {
        background: #dc2626 !important;
    }
    html body .quizSEO_ssc_official.ssc-review-mode .ssc-rv-side-panel__legend .ssc-dot--notvisited {
        background: #e2e8f0 !important;
        border: 1px solid #94a3b8 !important;
        box-sizing: border-box !important;
    }
    html body .quizSEO_ssc_official.ssc-review-mode .ssc-rv-side-panel__legend .ssc-dot--marked {
        background: #ca8a04 !important;
    }
    html body .quizSEO_ssc_official.ssc-review-mode .ssc-rv-side-panel__title {
        font-size: 13px !important;
        font-weight: 700 !important;
        color: #0f172a !important;
        margin: 0 0 8px !important;
    }
}
/* ===================== END HY-CHANGE 2026-08-30q ===================== */

/* ==========================================================================
   HY-CHANGE 2026-08-30r — View Answers attempt-state palette colours
   Answered=green · Unattempted=red · Marked=yellow · Not visited=white/grey
   Applies to fixed bottom bar + side panel.
   ========================================================================== */
.quizSEO_ssc_official.ssc-review-mode .ssc-rv-pal-answered {
    background: #16a34a !important;
    background-color: #16a34a !important;
    color: #fff !important;
    border-color: #16a34a !important;
}
.quizSEO_ssc_official.ssc-review-mode .ssc-rv-pal-unattempted {
    background: #dc2626 !important;
    background-color: #dc2626 !important;
    color: #fff !important;
    border-color: #dc2626 !important;
}
.quizSEO_ssc_official.ssc-review-mode .ssc-rv-pal-marked {
    background: #eab308 !important;
    background-color: #eab308 !important;
    color: #0f172a !important;
    border-color: #ca8a04 !important;
}
.quizSEO_ssc_official.ssc-review-mode .ssc-rv-pal-notvisited {
    background: #fff !important;
    background-color: #fff !important;
    color: #0f172a !important;
    border-color: #94a3b8 !important;
}

/* Bottom strip numbers via ::before */
.quizSEO_ssc_official.ssc-review-mode .ssc-rv-palettebar .quizSEO_reviewQuestion li.ssc-rv-pal-answered[data-ssc-n]::before,
.quizSEO_ssc_official.ssc-review-mode .ssc-rv-palettebar .quizSEO_reviewQuestion li.ssc-rv-pal-unattempted[data-ssc-n]::before {
    color: #fff !important;
}
.quizSEO_ssc_official.ssc-review-mode .ssc-rv-palettebar .quizSEO_reviewQuestion li.ssc-rv-pal-marked[data-ssc-n]::before,
.quizSEO_ssc_official.ssc-review-mode .ssc-rv-palettebar .quizSEO_reviewQuestion li.ssc-rv-pal-notvisited[data-ssc-n]::before {
    color: #0f172a !important;
}

/* Side panel boxes */
html body .quizSEO_ssc_official.ssc-review-mode .ssc-rv-side-panel__grid .ssc-rv-side-box.ssc-rv-pal-answered {
    background: #16a34a !important;
    border-color: #16a34a !important;
    color: #fff !important;
}
html body .quizSEO_ssc_official.ssc-review-mode .ssc-rv-side-panel__grid .ssc-rv-side-box.ssc-rv-pal-unattempted {
    background: #dc2626 !important;
    border-color: #dc2626 !important;
    color: #fff !important;
}
html body .quizSEO_ssc_official.ssc-review-mode .ssc-rv-side-panel__grid .ssc-rv-side-box.ssc-rv-pal-marked {
    background: #eab308 !important;
    border-color: #ca8a04 !important;
    color: #0f172a !important;
}
html body .quizSEO_ssc_official.ssc-review-mode .ssc-rv-side-panel__grid .ssc-rv-side-box.ssc-rv-pal-notvisited {
    background: #fff !important;
    border-color: #94a3b8 !important;
    color: #0f172a !important;
}
/* ===================== END HY-CHANGE 2026-08-30r ===================== */

/* ==========================================================================
   HY-CHANGE 2026-08-30s — Side panel ABOVE fixed palette + footer buttons
   Footer bar uses z-index ~2147483000; panel/scrim must sit higher.
   ========================================================================== */
@media (max-width: 768px) {
    html body .quizSEO_ssc_official.ssc-review-mode .ssc-mobile-palette-scrim {
        z-index: 2147483600 !important;
    }
    html body .quizSEO_ssc_official.ssc-review-mode.ssc-mobile-palette-open .ssc-mobile-palette-scrim {
        z-index: 2147483600 !important;
    }
    html body .quizSEO_ssc_official.ssc-review-mode .ssc-rv-side-panel {
        z-index: 2147483610 !important;
    }
    html body .quizSEO_ssc_official.ssc-review-mode.ssc-mobile-palette-open .ssc-rv-side-panel {
        z-index: 2147483610 !important;
    }
    /* While open, keep footer/palette under the overlay (do not raise them) */
    html body .quizSEO_ssc_official.ssc-review-mode.ssc-mobile-palette-open .ssc-rv-mobilebar,
    html body .quizSEO_ssc_official.ssc-review-mode.ssc-mobile-palette-open .ssc-rv-palettebar {
        z-index: 2147482990 !important;
    }
}
/* ===================== END HY-CHANGE 2026-08-30s ===================== */

/* ==========================================================================
   HY-CHANGE 2026-09-02 — SSC solution text matches question (review mode)
   ========================================================================== */
.quizSEO_ssc_official.ssc-review-mode .quizSEO_listItem .quizSEO_response,
.quizSEO_ssc_official.ssc-review-mode .quizSEO_listItem .quizSEO_response p,
.quizSEO_ssc_official.ssc-review-mode .quizSEO_listItem .quizSEO_response .quizSEO_correct,
.quizSEO_ssc_official.ssc-review-mode .quizSEO_listItem .quizSEO_response .quizSEO_incorrect,
.quizSEO_ssc_official.ssc-review-mode .quizSEO_listItem .quizSEO_response .quizSEO_correct p,
.quizSEO_ssc_official.ssc-review-mode .quizSEO_listItem .quizSEO_response .quizSEO_incorrect p {
    font-size: 16px !important;
    line-height: 1.7 !important;
    font-weight: 400 !important;
    letter-spacing: normal !important;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif !important;
}
.quizSEO_ssc_official.ssc-review-mode .quizSEO_listItem .quizSEO_response .quizSEO_respone_span {
    font-weight: 700 !important;
}
/* ===================== END HY-CHANGE 2026-09-02 ===================== */