/*
 * MPJE Review: palette depth, premium finish and purchase guidance.
 * Loaded last. Navy stays the anchor; teal (from the MPJE marketing site) and a
 * warm amber are the only accents, each with a single job:
 *   teal  = progress you have made, guidance, "add more"
 *   amber = time pressure (exam soon, streak at risk)
 *   green/red stay reserved for right/wrong answers.
 */
:root {
  --mpj-teal: #12807c;
  --mpj-teal-bright: #3bc6c2;
  --mpj-teal-soft: #e5f4f3;
  --mpj-teal-line: #b9e1df;
  --mpj-amber: #9a5b0b;
  --mpj-amber-bright: #f2b84b;
  --mpj-amber-soft: #fcf2e1;
  --mpj-ink: linear-gradient(135deg, #132a52 0%, #1a3a6d 55%, #15485e 100%);
  --mpj-shadow-md: 0 1px 2px rgba(15, 33, 66, .05), 0 4px 14px rgba(15, 33, 66, .06);
  --mpj-shadow-lg: 0 2px 4px rgba(15, 33, 66, .06), 0 14px 34px rgba(15, 33, 66, .14);
  --mpj-ease: cubic-bezier(.2, .7, .2, 1);
}

/* ---------- Page atmosphere: a faint cool wash behind the top of every page ---------- */
html body.mpj-ui .mpj-shell,
html body.mpj-ui .medexp-dashboardPage .tw-shell {
  background:
    radial-gradient(1200px 380px at 70% -120px, rgba(26, 79, 156, .07), transparent 70%),
    var(--mpj-paper) !important;
}

/* Panels get real depth instead of flat outlines */
html body.mpj-ui .mpj-panel { box-shadow: var(--mpj-shadow-md); border-color: #e1e6ee; }

/* Headline type: tighter, more editorial */
html body.mpj-ui .mpj-h1 { letter-spacing: -0.015em; }
html body.mpj-ui .mpj-lede { color: var(--mpj-muted); max-width: 62ch; }

/* ---------- Buttons ---------- */
html body.mpj-ui .mpj-btn { transition: background-color .18s var(--mpj-ease), border-color .18s, color .18s, box-shadow .18s, transform .18s var(--mpj-ease); }
html body.mpj-ui .mpj-btn--primary { box-shadow: 0 1px 2px rgba(15, 33, 66, .18), inset 0 1px 0 rgba(255, 255, 255, .08); }
html body.mpj-ui .mpj-btn--primary:hover { box-shadow: 0 4px 12px rgba(26, 79, 156, .28); transform: translateY(-1px); }
html body.mpj-ui .mpj-btn--secondary { box-shadow: var(--mpj-shadow-sm); }
html body.mpj-ui .mpj-btn:focus-visible { outline: none; box-shadow: var(--mpj-focus); }
html body.mpj-ui .mpj-btn--accent { background: var(--mpj-teal-bright); color: #0d2a3d !important; font-weight: 700; box-shadow: 0 6px 18px rgba(59, 198, 194, .28); }
html body.mpj-ui .mpj-btn--accent:hover { background: #5fd3cf; transform: translateY(-1px); }
html body.mpj-ui .mpj-btn--onDark { background: rgba(255, 255, 255, .08); color: #fff !important; border-color: rgba(255, 255, 255, .28); }
html body.mpj-ui .mpj-btn--onDark:hover { background: rgba(255, 255, 255, .16); border-color: rgba(255, 255, 255, .5); }

/* ---------- Dashboard: next step is the hero, on navy ---------- */
html body.mpj-ui .mpj-next {
  position: relative; overflow: hidden; isolation: isolate;
  background: var(--mpj-ink) !important; border: 0 !important; color: #fff;
  box-shadow: var(--mpj-shadow-lg); border-radius: var(--mpj-r-lg) !important;
}
html body.mpj-ui .mpj-next::before {
  content: ""; position: absolute; z-index: -1; right: -140px; top: -160px; width: 460px; height: 460px; border-radius: 50%;
  background: radial-gradient(circle, rgba(59, 198, 194, .16), transparent 68%);
}
html body.mpj-ui .mpj-next::after {
  content: ""; position: absolute; z-index: -1; inset: 0; pointer-events: none;
  background-image: linear-gradient(rgba(255, 255, 255, .035) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, .035) 1px, transparent 1px);
  background-size: 28px 28px; mask-image: linear-gradient(90deg, transparent 35%, #000 100%); -webkit-mask-image: linear-gradient(90deg, transparent 35%, #000 100%);
}
html body.mpj-ui .mpj-next__label { color: var(--mpj-teal-bright) !important; font-weight: 600; letter-spacing: .01em; }
html body.mpj-ui .mpj-next__title { color: #fff !important; -webkit-text-fill-color: #fff; }
html body.mpj-ui .mpj-next .mpj-meta { color: rgba(255, 255, 255, .72) !important; }
html body.mpj-ui .mpj-next .mpj-btn--primary { background: #fff; color: var(--mpj-navy) !important; box-shadow: 0 6px 18px rgba(0, 0, 0, .18); }
html body.mpj-ui .mpj-next .mpj-btn--primary:hover { background: #f1f5fb; }
html body.mpj-ui .mpj-next .mpj-btn--ghost { color: #fff !important; border: 1px solid rgba(255, 255, 255, .28); padding: 0 var(--mpj-s4); }
html body.mpj-ui .mpj-next .mpj-btn--ghost:hover { background: rgba(255, 255, 255, .1); }
html body.mpj-ui .mpj-next__progress { border-color: rgba(255, 255, 255, .14) !important; }
html body.mpj-ui .mpj-next__pct { color: rgba(255, 255, 255, .7) !important; }
html body.mpj-ui .mpj-next__pct .mpj-num { color: #fff !important; -webkit-text-fill-color: #fff; }
html body.mpj-ui .mpj-next .mpj-bar { background: rgba(255, 255, 255, .14) !important; }
html body.mpj-ui .mpj-next .mpj-bar > span { background: linear-gradient(90deg, var(--mpj-teal), var(--mpj-teal-bright)) !important; box-shadow: 0 0 12px rgba(59, 198, 194, .45); }

/* Exam date chip: calendar + tone by urgency */
html body.mpj-ui .mpj-examdate { display: flex !important; align-items: center; gap: var(--mpj-s3); text-align: left !important; box-shadow: var(--mpj-shadow-sm); padding: var(--mpj-s2) var(--mpj-s4) var(--mpj-s2) var(--mpj-s2) !important; }
.mpj-examdate__icon { display: grid; place-items: center; width: 36px; height: 36px; border-radius: var(--mpj-r); background: var(--mpj-teal-soft); color: var(--mpj-teal); }
.mpj-examdate__text { display: grid; gap: 1px; }
html body.mpj-ui .mpj-examdate.is-soon { border-color: #efd7ae !important; background: var(--mpj-amber-soft) !important; }
html body.mpj-ui .mpj-examdate.is-soon .mpj-examdate__icon { background: #f8e2bb; color: var(--mpj-amber); }
html body.mpj-ui .mpj-examdate.is-soon .mpj-examdate__days { color: var(--mpj-amber) !important; }
html body.mpj-ui .mpj-examdate.is-past .mpj-examdate__icon { background: var(--mpj-sunken); color: var(--mpj-muted); }

/* Stats: each number gets a quiet color key */
html body.mpj-ui .mpj-stat { position: relative; padding-top: var(--mpj-s5) !important; padding-bottom: var(--mpj-s5) !important; }
.mpj-stat__icon { display: grid; place-items: center; width: 32px; height: 32px; margin-bottom: var(--mpj-s3); border-radius: var(--mpj-r); background: var(--mpj-blue-soft); color: var(--mpj-blue); }
.mpj-stat--questions .mpj-stat__icon { background: var(--mpj-teal-soft); color: var(--mpj-teal); }
.mpj-stat--accuracy .mpj-stat__icon { background: var(--mpj-success-bg); color: var(--mpj-success); }
.mpj-stat--streak .mpj-stat__icon { background: var(--mpj-amber-soft); color: var(--mpj-amber); }

/* Today: steps in teal, row hover */
html body.mpj-ui .mpj-today__step { border: 0 !important; background: var(--mpj-teal-soft); color: var(--mpj-teal) !important; font-weight: 700; }
html body.mpj-ui .mpj-today__item { transition: background-color .15s; }
html body.mpj-ui .mpj-today__item:hover { background: #fafbfd; }

/* Chapter table: rounded bars, clear numbers */
html body.mpj-ui .mpj-bar { border-radius: 999px; overflow: hidden; }
html body.mpj-ui .mpj-bar > span { border-radius: 999px; transition: width .6s var(--mpj-ease); }
html body.mpj-ui .mpj-chapters__table tbody tr { transition: background-color .15s; }
html body.mpj-ui .mpj-chapters__table tbody tr:hover { background: #fafbfd; }
html body.mpj-ui .mpj-chapters__n { display: inline-grid !important; place-items: center; width: 22px !important; height: 22px; margin-right: 6px; border-radius: 6px; background: var(--mpj-sunken); color: var(--mpj-muted) !important; font-size: 11px; font-weight: 600 !important; }

/* ---------- Sidebar polish ---------- */
html body.mpj-ui .mpj-side__link.is-active,
html body.mpj-ui .medexp-dashboardPage .tw-sidebar a.tw-navlink.is-active,
html body.mpj-ui .medexp-dashboardPage .tw-navlink.is-active {
  background: linear-gradient(90deg, var(--mpj-blue-soft), rgba(234, 241, 251, .4)) !important;
}

/* Sidebar "add a course" card */
html body.mpj-ui .mpj-sidecard {
  display: grid; gap: 4px; margin: var(--mpj-s5) var(--mpj-s1) var(--mpj-s2); padding: var(--mpj-s4);
  border-radius: var(--mpj-r-lg); background: var(--mpj-ink); color: #fff !important; text-decoration: none !important;
  box-shadow: var(--mpj-shadow-md); position: relative; overflow: hidden; transition: transform .2s var(--mpj-ease), box-shadow .2s;
}
html body.mpj-ui .mpj-sidecard::after { content: ""; position: absolute; right: -40px; top: -50px; width: 140px; height: 140px; border-radius: 50%; background: radial-gradient(circle, rgba(59, 198, 194, .25), transparent 70%); }
html body.mpj-ui .mpj-sidecard:hover { transform: translateY(-2px); box-shadow: var(--mpj-shadow-lg); }
.mpj-sidecard__title { font: 600 var(--mpj-fs-base)/1.25 var(--mpj-serif); color: #fff; }
.mpj-sidecard__body { font-size: var(--mpj-fs-xs); line-height: 1.45; color: rgba(255, 255, 255, .72); }
.mpj-sidecard__cta { margin-top: 6px; font-size: var(--mpj-fs-xs); font-weight: 700; color: var(--mpj-teal-bright); }
@media (max-height: 760px) and (min-width: 1025px) { html body.mpj-ui .mpj-sidecard__body { display: none; } }

/* ---------- Purchase guidance ---------- */
html body.mpj-ui .mpj-offer {
  position: relative; overflow: hidden; isolation: isolate;
  display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: var(--mpj-s6); align-items: center;
  margin: 0 0 var(--mpj-s5); padding: var(--mpj-s7) var(--mpj-s6);
  border-radius: var(--mpj-r-lg); background: var(--mpj-ink); color: #fff; box-shadow: var(--mpj-shadow-lg); text-align: left;
}
html body.mpj-ui .mpj-offer::before { content: ""; position: absolute; z-index: -1; right: -120px; top: -140px; width: 480px; height: 480px; border-radius: 50%; background: radial-gradient(circle, rgba(59, 198, 194, .18), transparent 68%); }
.mpj-offer__kicker { margin: 0 0 var(--mpj-s2); font-size: var(--mpj-fs-sm); font-weight: 600; color: var(--mpj-teal-bright); }
html body.mpj-ui .mpj-offer__title { margin: 0; font: 600 var(--mpj-fs-xl)/1.18 var(--mpj-serif) !important; color: #fff !important; -webkit-text-fill-color: #fff; letter-spacing: -0.01em; }
.mpj-offer__body { margin: var(--mpj-s3) 0 0; font-size: var(--mpj-fs-base); line-height: 1.6; color: rgba(255, 255, 255, .78); max-width: 46ch; }
.mpj-offer__actions { display: flex; flex-wrap: wrap; gap: var(--mpj-s2); margin-top: var(--mpj-s5); }
.mpj-offer__note { margin: var(--mpj-s3) 0 0; font-size: var(--mpj-fs-xs); color: rgba(255, 255, 255, .6); }
html body.mpj-ui .mpj-offer__list { list-style: none; margin: 0; padding: var(--mpj-s5); display: grid; gap: var(--mpj-s3); border-radius: var(--mpj-r-lg); background: rgba(255, 255, 255, .06); border: 1px solid rgba(255, 255, 255, .1); }
html body.mpj-ui .mpj-offer__list li { display: flex; gap: var(--mpj-s3); align-items: flex-start; margin: 0; font-size: var(--mpj-fs-sm); line-height: 1.45; color: rgba(255, 255, 255, .9); }
.mpj-offer__list svg { flex: 0 0 auto; margin-top: 1px; color: var(--mpj-teal-bright); }
@media (max-width: 860px) {
  html body.mpj-ui .mpj-offer { grid-template-columns: 1fr; padding: var(--mpj-s6) var(--mpj-s5); gap: var(--mpj-s5); }
  html body.mpj-ui .mpj-offer__title { font-size: var(--mpj-fs-lg) !important; }
}
/* An offer inside a legacy tab container should not sit in another card */
html body.mpj-ui .tw-card:has(> .mpj-offer), html body.mpj-ui .tw-card:has(> * > .mpj-offer) { background: transparent !important; border: 0 !important; box-shadow: none !important; padding: 0 !important; }

/* Enrolled: quiet "add a state" row */
html body.mpj-ui .mpj-more {
  display: grid; grid-template-columns: 40px minmax(0, 1fr) auto; gap: var(--mpj-s4); align-items: center;
  margin-top: var(--mpj-s5); padding: var(--mpj-s4) var(--mpj-s5);
  border: 1px dashed var(--mpj-teal-line); border-radius: var(--mpj-r-lg); background: linear-gradient(90deg, var(--mpj-teal-soft), rgba(229, 244, 243, .25));
}
.mpj-more__icon { display: grid; place-items: center; width: 40px; height: 40px; border-radius: var(--mpj-r); background: #fff; color: var(--mpj-teal); box-shadow: var(--mpj-shadow-sm); }
.mpj-more__body { display: grid; gap: 2px; min-width: 0; }
@media (max-width: 600px) {
  html body.mpj-ui .mpj-more { grid-template-columns: 40px minmax(0, 1fr); }
  html body.mpj-ui .mpj-more .mpj-btn { grid-column: 1 / -1; justify-self: start; }
}

/* Course without a question bank (rendered by qbank.js with inline styles) */
html body.mpj-ui .medexp-qb-noqbank { border: 1px solid var(--mpj-line) !important; border-radius: var(--mpj-r-lg) !important; box-shadow: var(--mpj-shadow-md) !important; font-family: var(--mpj-sans) !important; }
html body.mpj-ui .medexp-qb-noqbank > div:first-child { background: var(--mpj-teal-soft) !important; }
html body.mpj-ui .medexp-qb-noqbank svg { stroke: var(--mpj-teal) !important; }
html body.mpj-ui .medexp-qb-noqbank a { background: var(--mpj-blue) !important; border-radius: var(--mpj-r) !important; box-shadow: none !important; font-weight: 600 !important; color: #fff !important; }

/* ---------- Never cut text off ---------- */
html body.mpj-ui .medexp-ql-topic__title { white-space: normal !important; overflow: visible !important; text-overflow: clip !important; display: block !important; -webkit-line-clamp: unset !important; }
html body.mpj-ui .medexp-mapAcc__title { white-space: normal !important; overflow: visible !important; text-overflow: clip !important; }
html body.mpj-ui .medexp-ql-filters { flex-wrap: wrap !important; overflow: visible !important; }
html body.mpj-ui .medexp-ql-stats, html body.mpj-ui .medexp-ql-statPills { flex-wrap: wrap !important; }
html body.mpj-ui .tw-courseTopSwitch__pill { max-width: none !important; }

/* ---------- Motion: content settles in, once ---------- */
@media (prefers-reduced-motion: no-preference) {
  html body.mpj-ui .mpj-dash > *, html body.mpj-ui .mpj-tab-head, html body.mpj-ui .mpj-offer {
    animation: mpj-rise .5s var(--mpj-ease) both;
  }
  html body.mpj-ui .mpj-dash > *:nth-child(2) { animation-delay: .04s; }
  html body.mpj-ui .mpj-dash > *:nth-child(3) { animation-delay: .08s; }
  html body.mpj-ui .mpj-dash > *:nth-child(4) { animation-delay: .12s; }
  html body.mpj-ui .mpj-dash > *:nth-child(5) { animation-delay: .16s; }
}
@keyframes mpj-rise { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }

/* ---------- Round 3 fixes ---------- */
/* Dashboard: columns size to content; footers sit at the bottom; room for the Mochi button */
html body.mpj-ui .mpj-dash__cols { align-items: start; }
html body.mpj-ui .mpj-dash { padding-bottom: 96px; }
html body.mpj-ui .mpj-chapters__table td:first-child { display: flex; align-items: flex-start; gap: 4px; }
html body.mpj-ui .mpj-chapters__table td:first-child .mpj-chapters__n { flex: 0 0 auto; margin-top: -1px; }
html body.mpj-ui .mpj-next .mpj-btn--ghost { height: 46px; font-size: var(--mpj-fs-base); }

/* Sidebar card text weights (legacy forces bold on sidebar links) */
html body.mpj-ui .mpj-sidecard .mpj-sidecard__title { font: 600 var(--mpj-fs-md)/1.25 var(--mpj-serif) !important; color: #fff !important; }
html body.mpj-ui .mpj-sidecard .mpj-sidecard__body { font: 400 var(--mpj-fs-xs)/1.45 var(--mpj-sans) !important; color: rgba(255, 255, 255, .74) !important; }
html body.mpj-ui .mpj-sidecard .mpj-sidecard__cta { font: 700 var(--mpj-fs-xs)/1.2 var(--mpj-sans) !important; color: var(--mpj-teal-bright) !important; }

/* Practice blocks: sub-tabs wrap instead of hiding "Advanced" */
html body.mpj-ui .medexp-qb-subtabs { flex-wrap: wrap !important; overflow: visible !important; row-gap: 4px; }
/* Hero: description first, quick starts on one line beneath */
html body.mpj-ui .medexp-qb-hero__row { flex-direction: column !important; align-items: stretch !important; gap: var(--mpj-s4) !important; }
html body.mpj-ui .medexp-qb-hero__right, html body.mpj-ui .medexp-qb-hero__quick { width: 100%; align-items: flex-start !important; text-align: left !important; }
html body.mpj-ui .medexp-qb-hero__quick { display: flex !important; flex-wrap: wrap; align-items: center !important; gap: var(--mpj-s3); padding-top: var(--mpj-s4); border-top: 1px solid var(--mpj-line); }
html body.mpj-ui .medexp-qb-hero__quickLabel { margin: 0 !important; font: 600 var(--mpj-fs-sm) var(--mpj-sans) !important; color: var(--mpj-navy) !important; }
html body.mpj-ui .medexp-qb-presets { justify-content: flex-start !important; gap: var(--mpj-s2) !important; }
/* Performance tiles: one neutral style */
html body.mpj-ui .medexp-qb-perfStat { border: 1px solid var(--mpj-line) !important; border-left-width: 1px !important; background: var(--mpj-surface) !important; box-shadow: none !important; border-radius: var(--mpj-r) !important; }
html body.mpj-ui .medexp-qb-perfStat::before, html body.mpj-ui .medexp-qb-perfStat::after { display: none !important; }
html body.mpj-ui .medexp-qb-perfStat__k { color: var(--mpj-muted) !important; font-size: var(--mpj-fs-xs) !important; }
html body.mpj-ui .medexp-qb-perfStat__v { color: var(--mpj-navy) !important; -webkit-text-fill-color: currentColor !important; font: 600 var(--mpj-fs-md)/1.2 var(--mpj-serif) !important; }
/* Practice by chapter hero: one number, visible "Continue" */
html body.mpj-ui .medexp-ql-hero__ring { display: none !important; }
html body.mpj-ui .medexp-ql-hero__rec { background: var(--mpj-teal-soft) !important; border: 1px solid var(--mpj-teal-line) !important; border-radius: var(--mpj-r) !important; }
html body.mpj-ui .medexp-ql-hero__recLabel svg, html body.mpj-ui .medexp-ql-hero__recLabel svg path { color: var(--mpj-teal) !important; fill: currentColor; }
html body.mpj-ui .medexp-ql-hero__recLabel { color: var(--mpj-teal) !important; font-weight: 600 !important; }
html body.mpj-ui a.medexp-ql-hero__recBtn { display: inline-flex !important; align-items: center; gap: 6px; height: 34px; padding: 0 var(--mpj-s4) !important; border-radius: var(--mpj-r) !important; background: var(--mpj-blue) !important; color: #fff !important; -webkit-text-fill-color: #fff !important; font: 600 var(--mpj-fs-sm)/1 var(--mpj-sans) !important; text-decoration: none !important; box-shadow: var(--mpj-shadow-sm) !important; }
html body.mpj-ui a.medexp-ql-hero__recBtn:hover { background: var(--mpj-blue-hover) !important; }
/* My sessions: progress cell */
html body.mpj-ui .tw-practicePanel .ml-session-progress { display: grid !important; gap: 4px; min-width: 110px; }
html body.mpj-ui .tw-practicePanel span.ml-session-progress > span.ml-session-progress__bar { display: block !important; height: 6px !important; border-radius: 999px !important; background: var(--mpj-sunken) !important; overflow: hidden; }
html body.mpj-ui .tw-practicePanel span.ml-session-progress__bar > span.ml-session-progress__bar-fill { display: block !important; height: 100% !important; border-radius: 999px !important; background: var(--mpj-teal) !important; }
html body.mpj-ui .tw-practicePanel span.ml-session-progress > span.ml-session-progress__text { background: none !important; font-size: var(--mpj-fs-xs) !important; color: var(--mpj-muted) !important; font-variant-numeric: tabular-nums; }
/* Video lessons page */
html body.mpj-ui .mxpvl-title { font: 600 var(--mpj-fs-xl)/1.2 var(--mpj-serif) !important; color: var(--mpj-navy) !important; letter-spacing: -0.015em !important; }
html body.mpj-ui .mxpvl-card { box-shadow: var(--mpj-shadow-md) !important; transition: transform .2s var(--mpj-ease), box-shadow .2s !important; }
html body.mpj-ui .mxpvl-card:hover { transform: translateY(-2px); box-shadow: var(--mpj-shadow-lg) !important; }
html body.mpj-ui .mpj-addtile { display: flex; flex-direction: column; justify-content: center; gap: 6px; min-height: 100%; padding: var(--mpj-s5); border: 1.5px dashed var(--mpj-teal-line); border-radius: var(--mpj-r-lg); background: linear-gradient(160deg, var(--mpj-teal-soft), #fff 80%); color: var(--mpj-text) !important; text-decoration: none !important; transition: border-color .2s, transform .2s var(--mpj-ease); }
html body.mpj-ui .mpj-addtile:hover { border-color: var(--mpj-teal); transform: translateY(-2px); }
.mpj-addtile__plus { display: grid; place-items: center; width: 40px; height: 40px; margin-bottom: 6px; border-radius: 50%; background: #fff; color: var(--mpj-teal); font: 400 26px/1 var(--mpj-sans); box-shadow: var(--mpj-shadow-sm); }
.mpj-addtile__title { font: 600 var(--mpj-fs-md)/1.25 var(--mpj-serif); color: var(--mpj-navy); }
.mpj-addtile__body { font-size: var(--mpj-fs-sm); line-height: 1.5; color: var(--mpj-muted); }
.mpj-addtile__cta { margin-top: 4px; font-size: var(--mpj-fs-sm); font-weight: 600; color: var(--mpj-teal); }
/* My courses library */
html body.mpj-ui .mpj-materials__link { grid-template-columns: 36px minmax(0, 1fr) auto auto !important; padding: var(--mpj-s4) var(--mpj-s5) !important; }
html body.mpj-ui .mpj-materials__link:hover { background: #fafbfd !important; }
.mpj-materials__icon { display: grid; place-items: center; width: 36px; height: 36px; border-radius: var(--mpj-r); background: var(--mpj-blue-soft); color: var(--mpj-blue); }
.mpj-materials__item--guide .mpj-materials__icon { background: var(--mpj-teal-soft); color: var(--mpj-teal); }
.mpj-materials__item--cheat .mpj-materials__icon { background: var(--mpj-amber-soft); color: var(--mpj-amber); }
html body.mpj-ui .mpj-materials__open { display: inline-flex; align-items: center; height: 32px; padding: 0 var(--mpj-s3); border: 1px solid var(--mpj-line-strong); border-radius: var(--mpj-r); color: var(--mpj-navy) !important; font-size: var(--mpj-fs-xs) !important; background: #fff; box-shadow: var(--mpj-shadow-sm); }
html body.mpj-ui .mpj-materials__link:hover .mpj-materials__open { border-color: var(--mpj-navy); }
html body.mpj-ui .mpj-materials .mpj-h2 .mpj-meta { margin-left: 6px; font: 400 var(--mpj-fs-sm) var(--mpj-sans); }
@media (max-width: 600px) { html body.mpj-ui .mpj-materials__link { grid-template-columns: 36px minmax(0, 1fr) auto !important; } }
/* Account / billing / support card rows fill the width evenly; one button style per row */
html body.mpj-ui #medexp-dash-content .tw-grid-12:has(> .tw-col-4):not(:has(> :not(.tw-col-4))) { grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)) !important; }
html body.mpj-ui #medexp-dash-content .tw-grid-12:has(> .tw-col-4):not(:has(> :not(.tw-col-4))) > .tw-col-4 { grid-column: auto !important; display: flex; flex-direction: column; }
/* Form + side panel rows (e.g. Support > Contact) */
html body.mpj-ui #medexp-dash-content .tw-grid-12:has(> .tw-col-8):has(> .tw-col-4) { grid-template-columns: minmax(0, 1fr) 320px !important; align-items: start; }
html body.mpj-ui #medexp-dash-content .tw-grid-12:has(> .tw-col-8):has(> .tw-col-4) > * { grid-column: auto !important; }
@media (max-width: 1000px) { html body.mpj-ui #medexp-dash-content .tw-grid-12:has(> .tw-col-8):has(> .tw-col-4) { grid-template-columns: 1fr !important; } }
html body.mpj-ui #medexp-dash-content .tw-grid-12:has(> .tw-col-4):not(:has(> :not(.tw-col-4))) > .tw-col-4 .tw-btn { margin-top: auto; align-self: flex-start; background: #fff !important; color: var(--mpj-navy) !important; border: 1px solid var(--mpj-line-strong) !important; box-shadow: var(--mpj-shadow-sm) !important; }
html body.mpj-ui #medexp-dash-content .tw-grid-12:has(> .tw-col-4):not(:has(> :not(.tw-col-4))) > .tw-col-4 .tw-btn:hover { border-color: var(--mpj-navy) !important; }
/* Support FAQs: one quiet list style instead of boxes in boxes */
html body.mpj-ui .tw-faqCat { border: 1px solid var(--mpj-line) !important; border-radius: var(--mpj-r) !important; box-shadow: none !important; background: #fff !important; margin-bottom: var(--mpj-s2) !important; }
html body.mpj-ui .tw-faqCat > summary { background: transparent !important; padding: var(--mpj-s3) var(--mpj-s4) !important; }
html body.mpj-ui .tw-faqCat[open] > summary { border-bottom: 1px solid var(--mpj-line); }
html body.mpj-ui .tw-faqList { gap: 0 !important; padding: 0 var(--mpj-s4) !important; }
html body.mpj-ui .tw-faq { border: 0 !important; border-bottom: 1px solid var(--mpj-line) !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; margin: 0 !important; }
html body.mpj-ui .tw-faq:last-child { border-bottom: 0 !important; }
html body.mpj-ui .tw-faq > summary { padding: var(--mpj-s3) 0 !important; font-weight: 500 !important; }
html body.mpj-ui .tw-faq > summary::before, html body.mpj-ui .tw-faq > summary > span:first-child:empty, html body.mpj-ui .tw-faq [class*="dot"] { display: none !important; }
html body.mpj-ui .tw-faq[open] > summary { color: var(--mpj-blue) !important; }
html body.mpj-ui .tw-col-5 .tw-faq { border: 1px solid var(--mpj-line) !important; border-radius: var(--mpj-r) !important; margin-bottom: var(--mpj-s2) !important; padding: 0 var(--mpj-s4) !important; }
html body.mpj-ui .tw-faqCat [class*="count"], html body.mpj-ui .tw-faqCat__count { background: var(--mpj-sunken) !important; color: var(--mpj-muted) !important; box-shadow: none !important; }
html body.mpj-ui .medexp-qb-hero .medexp-qb-hero__right .medexp-qb-hero__quick { flex-direction: row !important; align-items: center !important; justify-content: flex-start !important; }
html body.mpj-ui .medexp-qb-hero .medexp-qb-presets { width: auto !important; flex: 1 1 auto; }
/* The setup sub-tabs repeat what the Session summary already shows */
html body.mpj-ui .medexp-qb-subtab__meta { display: none !important; }
/* Course page: one "continue" action, clearer next-up card */
html body.mpj-ui .medexp-nextUp__label { display: none !important; }
html body.mpj-ui .medexp-progress__actions { display: none !important; }
html body.mpj-ui .medexp-nextUp { border-top: 0 !important; box-shadow: var(--mpj-shadow-md) !important; position: relative; overflow: hidden; }
html body.mpj-ui .medexp-nextUp::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 3px; background: linear-gradient(var(--mpj-teal-bright), var(--mpj-teal)); }
html body.mpj-ui .medexp-nextUp__kicker { color: var(--mpj-teal) !important; font-weight: 600 !important; text-transform: none !important; letter-spacing: 0 !important; }
html body.mpj-ui .medexp-progress { box-shadow: var(--mpj-shadow-md) !important; }
html body.mpj-ui .medexp-progress [class*="fill"], html body.mpj-ui .medexp-progress [class*="bar"] > span { background: linear-gradient(90deg, var(--mpj-teal), var(--mpj-teal-bright)) !important; }
/* Mastery map: fewer pills, quieter numbers */
html body.mpj-ui .medexp-mapLegend--inside { display: none !important; }
html body.mpj-ui .medexp-kpiPill { border: 0 !important; background: var(--mpj-sunken) !important; color: var(--mpj-muted) !important; font-weight: 500 !important; box-shadow: none !important; }
html body.mpj-ui .medexp-kpiMini { border: 0 !important; background: none !important; padding: 0 !important; color: var(--mpj-muted) !important; font-weight: 400 !important; font-size: var(--mpj-fs-xs) !important; }
html body.mpj-ui .medexp-kpiMini + .medexp-kpiMini::before { content: "\00B7"; margin: 0 6px; color: var(--mpj-faint); }
html body.mpj-ui .medexp-mapTopic__meta { gap: 0 !important; flex-wrap: wrap; }
html body.mpj-ui .medexp-mapAcc.is-recommended { border-color: var(--mpj-teal-line) !important; box-shadow: 0 0 0 3px var(--mpj-teal-soft) !important; }
/* Offer text colors must beat legacy paragraph colors */
html body.mpj-ui .mpj-offer p.mpj-offer__kicker { color: var(--mpj-teal-bright) !important; }
html body.mpj-ui .mpj-offer p.mpj-offer__body { color: rgba(255, 255, 255, .8) !important; }
html body.mpj-ui .mpj-offer p.mpj-offer__note { color: rgba(255, 255, 255, .62) !important; }
html body.mpj-ui .mpj-offer__help { margin: 0 0 var(--mpj-s5); font-size: var(--mpj-fs-sm); color: var(--mpj-muted); }
html body.mpj-ui .mpj-offer__help a { color: var(--mpj-blue) !important; font-weight: 600; }
html body.mpj-ui .medexp-progress { align-self: start; }
.mpj-more__actions { display: inline-flex; gap: var(--mpj-s2); flex-wrap: wrap; }
@media (max-width: 600px) { html body.mpj-ui .mpj-more .mpj-more__actions { grid-column: 1 / -1; } }
/* Offer inside the practice hub (which strips decorative backgrounds) */
html body.mpj-ui .tw-practicePanel .mpj-offer, html body.mpj-ui .mpj-offer-host .mpj-offer { background-image: var(--mpj-ink) !important; box-shadow: var(--mpj-shadow-lg) !important; }
html body.mpj-ui .tw-practicePanel .mpj-offer::before { background-image: radial-gradient(circle, rgba(59, 198, 194, .18), transparent 68%) !important; }
html body.mpj-ui .tw-practicePanel .mpj-btn--accent { box-shadow: 0 6px 18px rgba(59, 198, 194, .28) !important; }
html body.mpj-ui .mpj-offer-host { max-width: none !important; margin: 0 !important; padding: 0 !important; text-align: left !important; }
/* Active nav icon: legacy forces white strokes on every descendant */
html body.mpj-ui .medexp-dashboardPage .tw-navlink.is-active .tw-navicon,
html body.mpj-ui .medexp-dashboardPage .tw-navlink.is-active svg { color: var(--mpj-blue) !important; opacity: 1 !important; }
html body.mpj-ui .medexp-dashboardPage .tw-navlink.is-active svg *:not(.mpj-i__duo):not(.mpj-i__duo *),
html body.mpj-ui .mpj-side__link.is-active svg *:not(.mpj-i__duo):not(.mpj-i__duo *) { color: var(--mpj-blue) !important; stroke: var(--mpj-blue) !important; -webkit-text-fill-color: currentColor !important; }
html body.mpj-ui .medexp-dashboardPage .tw-navlink.is-active svg [fill]:not([fill="none"]) { fill: var(--mpj-blue) !important; }
html body.mpj-ui .mpj-offer p.mpj-offer__body { margin-top: var(--mpj-s3) !important; }
html body.mpj-ui .mpj-offer h2.mpj-offer__title { margin: 0 !important; }
@media (max-width: 600px) {
  html body.mpj-ui .mpj-offer__actions { display: grid; grid-template-columns: 1fr; }
  html body.mpj-ui .mpj-offer__actions .mpj-btn { width: 100%; }
  html body.mpj-ui .mpj-offer { padding: var(--mpj-s5) var(--mpj-s4); }
  html body.mpj-ui .mpj-offer__list { padding: var(--mpj-s4); }
  html body.mpj-ui .mpj-dash, html body.mpj-ui .mpj-offer__help { padding-bottom: 110px; }
}
/* Mochi: bottom-right on every study page; pages keep room at the bottom so it never covers a button */
@media (min-width: 601px) {
  html body.mpj-ui .mlc3-mochi-floater,
  html body.mpj-ui .medexp-mochi-drawer-trigger { left: auto !important; right: 24px !important; bottom: 24px !important; transform-origin: bottom right !important; }
}
html body.mpj-ui .mpj-shell__content, html body.mpj-ui .medexp-dashboardPage .tw-main { padding-bottom: 96px !important; }
html body.mpj-ui .mpj-shell--reader .mpj-shell__content { padding-bottom: 0 !important; }
html body.mpj-ui .medexp-mochi-drawer-trigger { box-shadow: 0 8px 24px rgba(15, 33, 66, .22) !important; }

/* ---------- Top-bar course menu ---------- */
html body.mpj-ui .mpj-cswitch { position: relative; }
html body.mpj-ui .mpj-cswitch__btn { list-style: none; display: inline-flex; align-items: center; gap: 10px; height: 44px; padding: 0 10px 0 14px; border: 1px solid var(--mpj-line-strong); border-radius: var(--mpj-r); background: #fff; box-shadow: var(--mpj-shadow-sm); cursor: pointer; transition: border-color .15s, box-shadow .15s; }
html body.mpj-ui .mpj-cswitch__btn::-webkit-details-marker { display: none; }
html body.mpj-ui .mpj-cswitch__btn:hover, html body.mpj-ui .mpj-cswitch[open] .mpj-cswitch__btn { border-color: var(--mpj-blue); box-shadow: var(--mpj-focus); }
.mpj-cswitch__text { display: grid; line-height: 1.15; text-align: left; min-width: 0; }
html body.mpj-ui .mpj-cswitch__label { font: 500 11px/1.2 var(--mpj-sans) !important; color: var(--mpj-muted) !important; letter-spacing: .02em; text-transform: none !important; }
html body.mpj-ui .mpj-cswitch__name { font: 600 var(--mpj-fs-sm)/1.25 var(--mpj-sans) !important; color: var(--mpj-navy) !important; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 260px; }
.mpj-cswitch__chev { flex: 0 0 auto; color: var(--mpj-blue); transition: transform .2s var(--mpj-ease); }
.mpj-cswitch[open] .mpj-cswitch__chev { transform: rotate(180deg); }
html body.mpj-ui .mpj-cswitch__menu { position: absolute; right: 0; top: calc(100% + 8px); z-index: 80; width: 320px; max-width: calc(100vw - 24px); padding: 6px; border: 1px solid var(--mpj-line); border-radius: var(--mpj-r-lg); background: #fff; box-shadow: var(--mpj-shadow-lg); animation: mpj-rise .18s var(--mpj-ease) both; }
html body.mpj-ui .mpj-cswitch__head { margin: 6px 10px 4px; font-size: var(--mpj-fs-xs); color: var(--mpj-faint); }
html body.mpj-ui .mpj-cswitch__item { display: grid; grid-template-columns: 34px minmax(0, 1fr) 18px; gap: 10px; align-items: center; padding: 8px 10px; border-radius: var(--mpj-r); color: var(--mpj-text) !important; text-decoration: none !important; }
html body.mpj-ui .mpj-cswitch__item:hover { background: var(--mpj-sunken); }
html body.mpj-ui .mpj-cswitch__item.is-current { background: var(--mpj-blue-soft); }
.mpj-cswitch__mono { display: grid; place-items: center; width: 34px; height: 34px; border-radius: var(--mpj-r); background: var(--mpj-navy); color: #fff; font: 700 11px var(--mpj-sans); letter-spacing: .02em; }
.mpj-cswitch__itemName { font-weight: 600; font-size: var(--mpj-fs-sm); color: var(--mpj-navy); }
.mpj-cswitch__check { color: var(--mpj-blue); display: grid; }
html body.mpj-ui .mpj-cswitch__foot, html body.mpj-ui .tw-courseDropdown__menu .mpj-cswitch__foot { margin-top: 6px; padding-top: 6px; border-top: 1px solid var(--mpj-line); display: grid; gap: 2px; }
html body.mpj-ui .mpj-cswitch__add { display: grid; grid-template-columns: 34px minmax(0, 1fr); gap: 10px; align-items: center; padding: 8px 10px; border-radius: var(--mpj-r); text-decoration: none !important; color: var(--mpj-text) !important; }
html body.mpj-ui .mpj-cswitch__add:hover { background: var(--mpj-teal-soft); }
.mpj-cswitch__plus { display: grid; place-items: center; width: 34px; height: 34px; border-radius: var(--mpj-r); border: 1.5px dashed var(--mpj-teal); color: var(--mpj-teal); font: 400 20px/1 var(--mpj-sans); }
html body.mpj-ui .mpj-cswitch__add strong { display: block; font-size: var(--mpj-fs-sm); font-weight: 600; color: var(--mpj-navy); }
html body.mpj-ui .mpj-cswitch__add small { display: block; font-size: var(--mpj-fs-xs); color: var(--mpj-muted); }
html body.mpj-ui .mpj-cswitch__bundle { padding: 8px 10px 6px 54px; font-size: var(--mpj-fs-xs); font-weight: 600; color: var(--mpj-teal) !important; text-decoration: none !important; }
html body.mpj-ui .mpj-cswitch__bundle:hover { text-decoration: underline !important; }
@media (max-width: 600px) {
  html body.mpj-ui .mpj-cswitch__name { max-width: 120px; }
  html body.mpj-ui .mpj-cswitch__label { display: none; }
  html body.mpj-ui .mpj-cswitch__btn { height: 38px; padding: 0 8px 0 10px; }
  html body.mpj-ui .mpj-cswitch__menu { position: fixed; left: 12px; right: 12px; top: 64px; width: auto; }
}
/* Multi-course dropdown gets the same affordance */
html body.mpj-ui .tw-courseTopSwitch { display: inline-flex !important; align-items: center; gap: 8px; }
html body.mpj-ui .tw-courseTopSwitch__label { font: 500 var(--mpj-fs-xs) var(--mpj-sans) !important; color: var(--mpj-muted) !important; text-transform: none !important; letter-spacing: 0 !important; }
html body.mpj-ui .tw-courseDropdown__btn { border: 1px solid var(--mpj-line-strong) !important; border-radius: var(--mpj-r) !important; background: #fff !important; box-shadow: var(--mpj-shadow-sm) !important; }
html body.mpj-ui .tw-courseDropdown__btn:hover { border-color: var(--mpj-blue) !important; }
html body.mpj-ui .tw-courseDropdown__chev { color: var(--mpj-blue) !important; }
html body.mpj-ui details.mpj-cswitch { position: relative !important; display: block; }
html body.mpj-ui .mpj-cswitch .mpj-cswitch__mono { color: #fff !important; -webkit-text-fill-color: #fff !important; }
html body.mpj-ui .mpj-cswitch__add small { font-weight: 400 !important; }
html body.mpj-ui .mpj-cswitchWrap .tw-courseTopSwitch__label { display: none !important; }
html body.mpj-ui .mpj-cswitch__plus { color: var(--mpj-teal) !important; }
html body.mpj-ui .mpj-cswitch .mpj-cswitch__mono { font-size: 9.5px !important; letter-spacing: 0 !important; width: 38px; }
html body.mpj-ui .mpj-cswitch__item { grid-template-columns: 38px minmax(0, 1fr) 18px; }

/* ---------- Icons: one family everywhere ---------- */
html body.mpj-ui svg.mpj-i { flex: 0 0 auto; overflow: visible; }
html body.mpj-ui svg.mpj-i .mpj-i__duo, html body.mpj-ui svg.mpj-i .mpj-i__duo * { fill: currentColor !important; fill-opacity: .14 !important; stroke: none !important; }
/* Third-party/legacy line icons drawn by scripts: same stroke weight and ends */
html body.mpj-ui svg[stroke="currentColor"]:not(.mpj-i):not([class*="ring"]):not([class*="donut"]) { stroke-width: 1.75; stroke-linecap: round; stroke-linejoin: round; }
/* Sidebar: icons in the text color (not washed-out gray); active gets the blue + fill */
html body.mpj-ui .mpj-side__link svg, html body.mpj-ui .medexp-dashboardPage .tw-navlink svg { width: 19px !important; height: 19px !important; opacity: 1 !important; color: #6b7889 !important; }
html body.mpj-ui .mpj-side__link:hover svg, html body.mpj-ui .medexp-dashboardPage .tw-navlink:hover svg { color: var(--mpj-navy) !important; }
html body.mpj-ui .mpj-side__link.is-active svg, html body.mpj-ui .medexp-dashboardPage .tw-navlink.is-active svg { color: var(--mpj-blue) !important; }
html body.mpj-ui .medexp-dashboardPage .tw-navlink.is-active svg .mpj-i__duo, html body.mpj-ui .mpj-side__link.is-active svg .mpj-i__duo { fill-opacity: .2 !important; }
html body.mpj-ui .medexp-dashboardPage .tw-navlink.is-active svg *:not(.mpj-i__duo):not(.mpj-i__duo *) { stroke: var(--mpj-blue) !important; }
/* Icon tiles */
html body.mpj-ui .mpj-stat__icon { width: 36px; height: 36px; border-radius: 10px; }
html body.mpj-ui .mpj-stat__icon .mpj-i__duo { fill-opacity: .22 !important; }

/* ---------- Lesson reader ---------- */
html body.mpj-ui .mpj-shell.mpj-shell--reader { display: block !important; }
html body.mpj-ui .mpj-shell--reader > .mpj-shell__content { width: 100%; }
html body.mpj-ui .medexp-lessonRail { overflow-x: hidden !important; }
html body.mpj-ui .medexp-metaHeading, html body.mpj-ui .medexp-metaHeading__txt { font-family: var(--mpj-sans) !important; font-weight: 700 !important; font-size: 1em !important; letter-spacing: 0 !important; text-transform: none !important; color: var(--mpj-text) !important; }
html body.mpj-ui .mpj-emoji-icon { display: inline-grid !important; place-items: center; color: var(--mpj-blue); line-height: 0; }
html body.mpj-ui .mpj-emoji-icon svg { width: 18px; height: 18px; }
html body.mpj-ui .mpj-shell--reader .medexp-shell--lesson { left: 0 !important; width: 100% !important; }
html body.mpj-ui .medexp-lessonBrand__logo { height: 36px !important; width: auto !important; }
html body.mpj-ui .medexp-lessonBrand { padding-left: var(--mpj-s4) !important; }
/* Answer options and other self-labeled lists: no second number */
html body.mpj-ui ol.mpj-own-labels { list-style: none !important; padding-left: 0 !important; margin-left: 0 !important; counter-reset: none !important; }
html body.mpj-ui ol.mpj-own-labels > li { padding-left: 0 !important; margin-left: 0 !important; }
html body.mpj-ui ol.mpj-own-labels > li::before, html body.mpj-ui ol.mpj-own-labels > li::marker { content: none !important; display: none !important; }
html body.mpj-ui ol.mpj-own-labels > li + li { margin-top: var(--mpj-s3) !important; }

/* ---------- Lesson concept flows: clean vertical stepper ---------- */
html body.mpj-ui .medexp-flow { display: grid !important; gap: 12px !important; --medexp-flow-gap: 12px; }
html body.mpj-ui .medexp-flow__step { position: relative !important; display: grid !important; grid-template-columns: 32px minmax(0, 1fr) !important; gap: 14px !important; align-items: start !important; }
html body.mpj-ui .medexp-flow__step::before { display: none !important; content: none !important; }
html body.mpj-ui .medexp-flow__step:not(:last-child)::before {
  content: "" !important; display: block !important; position: absolute !important; z-index: 1;
  left: 11px !important; top: auto !important; bottom: -9px !important; width: 0 !important; height: 0 !important; background: none !important; transform: none !important;
  border-left: 5px solid transparent !important; border-right: 5px solid transparent !important; border-top: 6px solid var(--mpj-line-strong) !important; border-bottom: 0 !important;
}
html body.mpj-ui .medexp-flow__step:not(:last-child)::after {
  content: "" !important; display: block !important; position: absolute !important;
  left: 15px !important; top: 40px !important; bottom: -4px !important; height: auto !important; width: 2px !important;
  border: 0 !important; background: var(--mpj-line-strong) !important; border-radius: 2px; transform: none !important;
}
html body.mpj-ui .medexp-flow__marker { box-sizing: border-box !important; flex: none !important; padding: 0 !important; min-width: 32px !important; min-height: 32px !important; max-height: 32px !important; aspect-ratio: 1 / 1 !important; align-self: start !important; line-height: 1 !important; width: 32px !important; height: 32px !important; margin: 4px 0 0 !important; border-radius: 50% !important; display: grid !important; place-items: center !important; background: var(--mpj-navy) !important; box-shadow: 0 0 0 4px var(--mpj-blue-soft) !important; border: 0 !important; }
html body.mpj-ui .medexp-flow__marker::after, html body.mpj-ui .medexp-flow__marker::before { display: none !important; content: none !important; }
html body.mpj-ui .medexp-flow__num { color: #fff !important; -webkit-text-fill-color: #fff !important; font: 700 13px/1 var(--mpj-sans) !important; }
html body.mpj-ui .medexp-flow__card { width: 100% !important; max-width: none !important; box-sizing: border-box; padding: 12px 16px !important; border: 1px solid var(--mpj-line) !important; border-radius: 10px !important; background: #fff !important; box-shadow: var(--mpj-shadow-sm) !important; transform: none !important; }
html body.mpj-ui .medexp-flow__card:hover { border-color: var(--mpj-line-strong) !important; }
html body.mpj-ui .medexp-flow__title { font: 600 15px/1.35 var(--mpj-sans) !important; color: var(--mpj-navy) !important; margin: 0 0 2px !important; }
html body.mpj-ui .medexp-flow__text { font: 400 14px/1.55 var(--mpj-sans) !important; color: var(--mpj-muted) !important; }
html body.mpj-ui .medexp-flow__card[data-variant="decision"] { border-left: 3px solid var(--mpj-blue) !important; }
html body.mpj-ui .medexp-flow__card[data-variant="warning"] { border-left: 3px solid var(--mpj-warn) !important; background: var(--mpj-warn-bg) !important; }
html body.mpj-ui .medexp-flow__step:last-child .medexp-flow__marker { background: var(--mpj-teal) !important; box-shadow: 0 0 0 4px var(--mpj-teal-soft) !important; }
html body.mpj-ui .medexp-diagram figcaption { margin-bottom: 12px !important; color: var(--mpj-muted) !important; }

/* ---------- Lesson outline rail: compact, tree-like ---------- */
html body.mpj-ui .medexp-lessonWorkspace { grid-template-columns: 300px minmax(0, 1fr) !important; }
html body.mpj-ui .medexp-lessonRail { width: 300px !important; background: #fbfcfd !important; border-right: 1px solid var(--mpj-line) !important; }
html body.mpj-ui .medexp-toc.medexp-card { background: transparent !important; border: 0 !important; box-shadow: none !important; padding: 4px 8px 24px !important; margin: 0 !important; }
html body.mpj-ui .medexp-toc__header { padding: 12px 10px 8px !important; margin: 0 !important; border: 0 !important; }
html body.mpj-ui .medexp-toc__title { font: 600 12px/1.2 var(--mpj-sans) !important; color: var(--mpj-faint) !important; letter-spacing: .02em !important; text-transform: none !important; }
html body.mpj-ui .medexp-toc__body { padding: 0 !important; }
html body.mpj-ui .medexp-tocLinks { list-style: none !important; margin: 0 !important; padding: 0 !important; display: grid !important; gap: 1px !important; }
html body.mpj-ui .medexp-tocLink { margin: 0 !important; padding: 0 !important; border: 0 !important; background: none !important; }
html body.mpj-ui .medexp-tocLink::before, html body.mpj-ui .medexp-tocLink::after, html body.mpj-ui .medexp-tocLink > a::before { display: none !important; content: none !important; }
html body.mpj-ui .medexp-tocLink > a {
  display: block !important; margin: 0 !important; padding: 6px 10px !important; border-radius: 6px !important; border: 0 !important; box-shadow: none !important;
  font: 600 13.5px/1.35 var(--mpj-sans) !important; color: var(--mpj-navy) !important; text-decoration: none !important; background: transparent !important;
}
html body.mpj-ui .medexp-tocLink:not(.is-sub) + .medexp-tocLink:not(.is-sub) > a, html body.mpj-ui .medexp-tocLink.is-sub + .medexp-tocLink:not(.is-sub) > a { margin-top: 4px !important; }
html body.mpj-ui .medexp-tocLink.is-sub > a {
  margin-left: 12px !important; padding: 5px 10px 5px 12px !important; border-left: 1px solid var(--mpj-line) !important; border-radius: 0 6px 6px 0 !important;
  font: 400 13px/1.4 var(--mpj-sans) !important; color: var(--mpj-muted) !important;
}
html body.mpj-ui .medexp-tocLink > a:hover { background: var(--mpj-sunken) !important; color: var(--mpj-navy) !important; }
html body.mpj-ui .medexp-tocLink.is-active > a { background: var(--mpj-blue-soft) !important; color: var(--mpj-blue) !important; }
html body.mpj-ui .medexp-tocLink.is-sub.is-active > a { border-left: 2px solid var(--mpj-blue) !important; padding-left: 11px !important; font-weight: 500 !important; }
html body.mpj-ui .mpj-tocnum { display: inline-block; min-width: 3.4em; color: var(--mpj-faint); font-variant-numeric: tabular-nums; font-size: 12px; }
html body.mpj-ui .medexp-tocLink.is-active .mpj-tocnum { color: var(--mpj-blue); opacity: .7; }
html body.mpj-ui .medexp-tocLink > a:has(.mpj-tocnum) { display: flex !important; gap: 8px; align-items: baseline; }
html body.mpj-ui .mpj-tocnum { min-width: 0 !important; flex: 0 0 auto; margin: 0 !important; }
html body.mpj-ui .medexp-tocLink.is-sub > a { color: #46546a !important; }

/* ---------- Readiness checks ---------- */
html body.mpj-ui .mpj-rd { display: grid; gap: var(--mpj-s5); }
html body.mpj-ui .mpj-rd__intro { display: flex; justify-content: space-between; align-items: flex-end; gap: var(--mpj-s5); flex-wrap: wrap; }
html body.mpj-ui .mpj-rd__title { margin: 0 0 4px !important; font: 600 var(--mpj-fs-lg)/1.25 var(--mpj-serif) !important; color: var(--mpj-navy) !important; }
html body.mpj-ui .mpj-rd__lede { margin: 0 !important; max-width: 62ch; color: var(--mpj-muted) !important; font-size: var(--mpj-fs-sm) !important; line-height: 1.6; }
html body.mpj-ui .mpj-rd__bands { list-style: none; display: flex; gap: 4px; margin: 0; padding: 0; }
html body.mpj-ui .mpj-rd__bands li { margin: 0; padding: 4px 10px; border-radius: 999px; font-size: 12px; font-weight: 600; }
.mpj-rd .is-low { background: var(--mpj-danger-bg); color: var(--mpj-danger); }
.mpj-rd .is-mid { background: var(--mpj-amber-soft); color: var(--mpj-amber); }
.mpj-rd .is-good { background: var(--mpj-teal-soft); color: var(--mpj-teal); }
.mpj-rd .is-great { background: var(--mpj-success-bg); color: var(--mpj-success); }
html body.mpj-ui .mpj-rd__sub { margin: 0 0 var(--mpj-s3) !important; font: 600 var(--mpj-fs-base)/1.3 var(--mpj-sans) !important; color: var(--mpj-navy) !important; }
html body.mpj-ui .mpj-rd__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: var(--mpj-s4); }
html body.mpj-ui .mpj-rd__card { position: relative; display: flex; flex-direction: column; gap: var(--mpj-s2); padding: var(--mpj-s5); border: 1px solid var(--mpj-line); border-radius: var(--mpj-r-lg); background: #fff; box-shadow: var(--mpj-shadow-md); transition: border-color .15s, box-shadow .2s, transform .2s var(--mpj-ease); }
html body.mpj-ui .mpj-rd__card:hover { border-color: var(--mpj-line-strong); box-shadow: var(--mpj-shadow-lg); transform: translateY(-1px); }
html body.mpj-ui .mpj-rd__card.is-recommended { border-color: var(--mpj-teal-line); box-shadow: 0 0 0 3px var(--mpj-teal-soft), var(--mpj-shadow-md); }
html body.mpj-ui .mpj-rd__tag { align-self: flex-start; padding: 3px 9px; border-radius: 999px; background: var(--mpj-teal); color: #fff; font-size: 11px; font-weight: 700; letter-spacing: .02em; }
html body.mpj-ui .mpj-rd__cardTitle { margin: 0 !important; font: 600 var(--mpj-fs-md)/1.3 var(--mpj-serif) !important; color: var(--mpj-navy) !important; }
html body.mpj-ui .mpj-rd__cardDesc { margin: 0 !important; font-size: var(--mpj-fs-sm) !important; line-height: 1.55 !important; color: var(--mpj-muted) !important; }
html body.mpj-ui .mpj-rd__facts { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 2px; }
html body.mpj-ui .mpj-rd__facts span { padding: 3px 9px; border-radius: 999px; background: var(--mpj-sunken); color: var(--mpj-text); font-size: 12px; font-weight: 500; }
html body.mpj-ui .mpj-rd__cardFoot { display: flex; align-items: center; justify-content: space-between; gap: var(--mpj-s3); margin-top: auto; padding-top: var(--mpj-s4); border-top: 1px solid var(--mpj-line); }
html body.mpj-ui .mpj-rd__timed { display: inline-flex; align-items: center; gap: 8px; margin: 0; font-size: var(--mpj-fs-sm); font-weight: 500; color: var(--mpj-text); cursor: pointer; }
html body.mpj-ui .mpj-rd__start { height: 38px !important; padding: 0 var(--mpj-s4) !important; border-radius: var(--mpj-r) !important; font-size: var(--mpj-fs-sm) !important; }
html body.mpj-ui .mpj-rd__note { margin: var(--mpj-s3) 0 0 !important; font-size: var(--mpj-fs-xs) !important; color: var(--mpj-faint) !important; }
html body.mpj-ui .mpj-rd__results { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: var(--mpj-s4); }
html body.mpj-ui .mpj-rd__results:empty { display: none; }
html body.mpj-ui .mpj-rd__latest { padding: var(--mpj-s5); border-radius: var(--mpj-r-lg); background: var(--mpj-ink); color: #fff; box-shadow: var(--mpj-shadow-lg); display: grid; gap: var(--mpj-s4); }
html body.mpj-ui .mpj-rd__k { font-size: var(--mpj-fs-xs); font-weight: 600; color: var(--mpj-teal-bright); }
html body.mpj-ui .mpj-rd__big { display: flex; align-items: baseline; gap: 8px; margin: 2px 0 6px; }
html body.mpj-ui .mpj-rd__big .mpj-num { font: 600 52px/1 var(--mpj-serif) !important; color: #fff !important; -webkit-text-fill-color: #fff; }
html body.mpj-ui .mpj-rd__big small { font-size: var(--mpj-fs-sm); color: rgba(255,255,255,.75); }
html body.mpj-ui .mpj-rd__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px; font-size: var(--mpj-fs-sm); color: rgba(255,255,255,.8); }
html body.mpj-ui .mpj-rd__band { padding: 3px 9px; border-radius: 999px; font-size: 12px; font-weight: 700; }
html body.mpj-ui .mpj-rd__up { color: #7ee2c4; font-weight: 600; }
html body.mpj-ui .mpj-rd__down { color: #f6b0a6; font-weight: 600; }
html body.mpj-ui .mpj-rd__chartWrap { height: 110px; }
html body.mpj-ui .mpj-rd__chart { width: 100%; height: 100%; display: block; overflow: visible; }
html body.mpj-ui .mpj-rd__grid line, .mpj-rd__chart .mpj-rd__grid { stroke: rgba(255,255,255,.12); stroke-width: 1; }
.mpj-rd__chart .mpj-rd__line { fill: none; stroke: var(--mpj-teal-bright); stroke-width: 2.5; vector-effect: non-scaling-stroke; }
.mpj-rd__chart .mpj-rd__dot { fill: #fff; stroke: var(--mpj-teal-bright); stroke-width: 2; vector-effect: non-scaling-stroke; }
html body.mpj-ui .mpj-rd__history { border: 1px solid var(--mpj-line); border-radius: var(--mpj-r-lg); background: #fff; box-shadow: var(--mpj-shadow-md); overflow: hidden; }
html body.mpj-ui .mpj-rd__histHead { padding: var(--mpj-s3) var(--mpj-s4); font-weight: 600; font-size: var(--mpj-fs-sm); color: var(--mpj-navy); border-bottom: 1px solid var(--mpj-line); }
html body.mpj-ui .mpj-rd__row { display: grid; grid-template-columns: minmax(0, 1fr) auto auto 14px; gap: var(--mpj-s3); align-items: center; padding: 10px var(--mpj-s4); border-bottom: 1px solid var(--mpj-line); color: var(--mpj-text) !important; text-decoration: none !important; }
html body.mpj-ui .mpj-rd__row:last-child { border-bottom: 0; }
html body.mpj-ui .mpj-rd__row:hover { background: #fafbfd; }
html body.mpj-ui .mpj-rd__rowName { display: grid; font-weight: 500; font-size: var(--mpj-fs-sm); color: var(--mpj-navy); }
html body.mpj-ui .mpj-rd__rowName small { font-weight: 400; font-size: 12px; color: var(--mpj-faint); }
html body.mpj-ui .mpj-rd__rowScore { font-variant-numeric: tabular-nums; font-weight: 600; font-size: var(--mpj-fs-sm); }
html body.mpj-ui .mpj-rd__rowGo { color: var(--mpj-faint); }
@media (max-width: 900px) { html body.mpj-ui .mpj-rd__results { grid-template-columns: 1fr; } }
html body.mpj-ui .tw-practicePanel .mpj-rd__latest { background-image: var(--mpj-ink) !important; box-shadow: var(--mpj-shadow-lg) !important; }
html body.mpj-ui .tw-practicePanel .mpj-rd__card { box-shadow: var(--mpj-shadow-md) !important; }
html body.mpj-ui .tw-practicePanel .mpj-rd__card.is-recommended { box-shadow: 0 0 0 3px var(--mpj-teal-soft), var(--mpj-shadow-md) !important; }
html body.mpj-ui .tw-practicePanel .mpj-rd__history { box-shadow: var(--mpj-shadow-md) !important; }
html body.mpj-ui .mpj-rd__results { align-items: start; }

/* Mochi replies: readable formatting */
html body.mpj-ui .medexp-mochi-drawer__msg-body p { margin: 0 0 6px; }
html body.mpj-ui .medexp-mochi-drawer__msg-body p:last-child { margin-bottom: 0; }
html body.mpj-ui .medexp-mochi-drawer__msg-body ul, html body.mpj-ui .medexp-mochi-drawer__msg-body ol { margin: 4px 0 6px 18px; padding: 0; }
html body.mpj-ui .medexp-mochi-drawer__msg-body li { margin: 2px 0; }
html body.mpj-ui .medexp-mochi-drawer__msg-body strong { color: var(--mpj-navy); font-weight: 650; }
html body.mpj-ui .medexp-mochi-drawer__quick.is-hidden, html body.mpj-ui .is-collapsed > .medexp-mochi-drawer__quick:nth-child(n+3) { display: none !important; }
/* Mochi panel spacing */
html body.mpj-ui .medexp-mochi-drawer__quicks { display: flex !important; flex-wrap: wrap; gap: 8px !important; padding: 14px 16px 6px !important; margin: 0 !important; }
html body.mpj-ui .medexp-mochi-drawer__quick { width: auto !important; flex: 0 0 auto; display: inline-flex !important; align-items: center; gap: 8px; padding: 8px 12px !important; border: 1px solid var(--mpj-line) !important; border-radius: 999px !important; background: #fff !important; font: 500 13px/1.2 var(--mpj-sans) !important; color: var(--mpj-navy) !important; box-shadow: var(--mpj-shadow-sm) !important; }
html body.mpj-ui .medexp-mochi-drawer__quick:hover { border-color: var(--mpj-blue) !important; background: var(--mpj-blue-soft) !important; }
html body.mpj-ui .medexp-mochi-drawer__quick-icon svg { width: 16px; height: 16px; }
html body.mpj-ui .medexp-mochi-drawer__composer { gap: 10px !important; padding: 12px 16px 16px !important; align-items: flex-end !important; }
html body.mpj-ui .medexp-mochi-drawer__input { padding: 11px 14px !important; line-height: 1.45 !important; font: 400 14px/1.45 var(--mpj-sans) !important; border-radius: 12px !important; min-height: 44px; }
html body.mpj-ui .medexp-mochi-drawer__msg-body { line-height: 1.55 !important; }
/* Mochi action buttons: light, readable in every state */
html body.mpj-ui .medexp-mochi-drawer__thread { padding: 12px 16px !important; }
html body.mpj-ui .medexp-mochi-drawer__chips { display: grid !important; gap: 6px !important; margin-top: 10px !important; }
html body.mpj-ui a.medexp-mochi-drawer__chip,
html body.mpj-ui a.medexp-mochi-drawer__chip:visited,
html body.mpj-ui a.medexp-mochi-drawer__chip:hover,
html body.mpj-ui a.medexp-mochi-drawer__chip:focus {
  display: flex !important; align-items: center; gap: 10px; padding: 9px 12px !important; border-radius: 10px !important;
  background: #fff !important; background-image: none !important; border: 1px solid var(--mpj-line) !important; box-shadow: none !important;
  color: var(--mpj-navy) !important; -webkit-text-fill-color: var(--mpj-navy) !important; text-decoration: none !important; font: 600 13px/1.3 var(--mpj-sans) !important;
}
html body.mpj-ui a.medexp-mochi-drawer__chip:hover { border-color: var(--mpj-blue) !important; background: var(--mpj-blue-soft) !important; }
html body.mpj-ui a.medexp-mochi-drawer__chip * { text-decoration: none !important; color: inherit !important; -webkit-text-fill-color: currentColor !important; }
html body.mpj-ui .medexp-mochi-drawer__chip-icon { display: grid !important; place-items: center; width: 26px; height: 26px; border-radius: 8px; background: var(--mpj-teal-soft) !important; color: var(--mpj-teal) !important; flex: 0 0 auto; }
html body.mpj-ui .medexp-mochi-drawer__chip-icon svg { width: 15px; height: 15px; }
html body.mpj-ui .medexp-mochi-drawer__chip-label { flex: 1; min-width: 0; }
html body.mpj-ui .medexp-mochi-drawer__chip-arrow { color: var(--mpj-blue) !important; }

/* ---------- Layout-true loading skeletons ---------- */
html body.mpj-ui .mpj-skel, html body.mpj-ui .medexp-ql-skeleton.mpj-skel { display: grid !important; grid-template-columns: minmax(0, 1fr) !important; gap: var(--mpj-s4) !important; width: 100%; }
html body.mpj-ui .mpj-skel .mpj-sk,
html body.mpj-ui .tw-practicePanel .mpj-skel .mpj-sk {
  display: block; flex: 0 0 auto; max-width: 100%; border-radius: 6px;
  background-color: #e9edf3 !important;
  background-image: linear-gradient(90deg, rgba(255,255,255,0) 0%, rgba(255,255,255,.65) 50%, rgba(255,255,255,0) 100%) !important;
  background-size: 200% 100% !important; background-repeat: no-repeat !important;
  animation: mpj-shimmer 1.4s ease-in-out infinite;
}
html body.mpj-ui .mpj-sk.is-pill { border-radius: 999px; }
html body.mpj-ui .mpj-sk.is-btn { border-radius: var(--mpj-r); }
html body.mpj-ui .mpj-sk.is-circle { border-radius: 50%; }
html body.mpj-ui .mpj-sk.is-dot { border-radius: 50%; }
html body.mpj-ui .mpj-sk.is-check { border-radius: 4px; }
html body.mpj-ui .mpj-sk.is-rule { background: var(--mpj-line) !important; animation: none; }
html body.mpj-ui .mpj-sk-row { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
html body.mpj-ui .mpj-sk-row.is-split { justify-content: space-between; align-items: flex-end; }
html body.mpj-ui .mpj-sk-col { display: grid; gap: 8px; min-width: 0; }
html body.mpj-ui .mpj-sk-card { display: grid; gap: 10px; align-content: start; padding: var(--mpj-s5); border: 1px solid var(--mpj-line); border-radius: var(--mpj-r-lg); background: #fff !important; box-shadow: var(--mpj-shadow-sm) !important; }
html body.mpj-ui .mpj-sk-card.is-table { padding: 0; gap: 0; overflow: hidden; }
html body.mpj-ui .mpj-sk-card.is-option { padding: 14px 18px; }
html body.mpj-ui .mpj-sk-row.is-th { padding: 12px 18px; background: var(--mpj-sunken); gap: 4%; flex-wrap: nowrap; }
html body.mpj-ui .mpj-sk-row.is-tr { padding: 14px 18px; border-top: 1px solid var(--mpj-line); gap: 4%; flex-wrap: nowrap; }
html body.mpj-ui .mpj-sk-row.is-tr:first-child { border-top: 0; }
html body.mpj-ui .mpj-sk-row.is-tr.is-stack { gap: 16px; }
html body.mpj-ui .mpj-sk-foot { display: flex; justify-content: space-between; align-items: center; margin-top: 8px; padding-top: 14px; border-top: 1px solid var(--mpj-line); }
html body.mpj-ui .mpj-sk-grid3 { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: var(--mpj-s4); }
html body.mpj-ui .mpj-sk-grid4 { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; }
html body.mpj-ui .mpj-sk-mini { display: grid; gap: 6px; justify-items: center; padding: 10px 4px; border-radius: 8px; background: var(--mpj-sunken); }
@keyframes mpj-shimmer { 0% { background-position: 150% 0; } 100% { background-position: -50% 0; } }
@media (prefers-reduced-motion: reduce) { html body.mpj-ui .mpj-sk { animation: none; } }
@media (max-width: 700px) { html body.mpj-ui .mpj-sk-row.is-th, html body.mpj-ui .mpj-sk-row.is-tr > *:nth-child(n+3):not(:last-child) { display: none; } }
/* Older skeleton markup elsewhere gets the same tone and motion */
html body.mpj-ui .medexp-skel, html body.mpj-ui .tw-skel, html body.mpj-ui [class*="skeleton"] .medexp-skelLine, html body.mpj-ui .medexp-skelBlock {
  background-color: #e9edf3 !important; background-image: linear-gradient(90deg, rgba(255,255,255,0), rgba(255,255,255,.65), rgba(255,255,255,0)) !important;
  background-size: 200% 100% !important; animation: mpj-shimmer 1.4s ease-in-out infinite !important; border-radius: 6px;
}

/* Mastery map rows: menus are never clipped; consistent controls */
html body.mpj-ui details.medexp-mapAcc { overflow: visible !important; }
html body.mpj-ui details.medexp-mapAcc[open] { z-index: 2; position: relative; }
html body.mpj-ui .medexp-mapAcc__moreWrap { position: relative !important; }
html body.mpj-ui .medexp-mapAcc__moreWrap:focus-within, html body.mpj-ui .medexp-mapAcc:has(.medexp-popMenu:not([hidden])) { z-index: 30; position: relative; }
html body.mpj-ui .medexp-popMenu {
  z-index: 60 !important; min-width: 210px; padding: 6px !important; border: 1px solid var(--mpj-line) !important; border-radius: var(--mpj-r-lg) !important;
  background: #fff !important; box-shadow: var(--mpj-shadow-lg) !important; right: 0 !important; left: auto !important; top: calc(100% + 6px) !important;
}
html body.mpj-ui .medexp-popMenu a, html body.mpj-ui .medexp-popMenu button {
  display: flex !important; align-items: center; gap: 10px; width: 100%; padding: 9px 12px !important; border: 0 !important; border-radius: 8px !important;
  background: transparent !important; color: var(--mpj-navy) !important; font: 500 13.5px/1.3 var(--mpj-sans) !important; text-align: left; text-decoration: none !important; box-shadow: none !important;
}
html body.mpj-ui .medexp-popMenu a:hover, html body.mpj-ui .medexp-popMenu button:hover { background: var(--mpj-sunken) !important; }
html body.mpj-ui .medexp-mapAcc [class*="bar"] [class*="fill"], html body.mpj-ui .medexp-mapAcc [class*="progress"] > span { background: linear-gradient(90deg, var(--mpj-teal), var(--mpj-teal-bright)) !important; }
html body.mpj-ui .medexp-mapAcc__summary .medexp-btn--primary, html body.mpj-ui .medexp-mapAcc__summary .medexp-btn { min-width: 96px; justify-content: center; }
html body.mpj-ui .medexp-mapAcc__summary::after, html body.mpj-ui .medexp-mapAcc__chev { color: var(--mpj-faint) !important; }

/* ---------- Dashboard: variants and finish ---------- */
html body.mpj-ui .mpj-table-wrap { overflow-x: auto; }
html body.mpj-ui .mpj-chapters__t { min-width: 0; }
html body.mpj-ui .mpj-stat--readiness .mpj-stat__icon { background: var(--mpj-teal-soft); color: var(--mpj-teal); }
html body.mpj-ui .mpj-stat--flashcards .mpj-stat__icon { background: var(--mpj-blue-soft); color: var(--mpj-blue); }
html body.mpj-ui .mpj-stat--readiness.is-low .mpj-stat__value { color: var(--mpj-danger) !important; }
html body.mpj-ui .mpj-stat--readiness.is-borderline .mpj-stat__value { color: var(--mpj-amber) !important; }
html body.mpj-ui .mpj-stat--readiness.is-high .mpj-stat__value { color: var(--mpj-teal) !important; }
html body.mpj-ui .mpj-stat--readiness.is-very_high .mpj-stat__value { color: var(--mpj-success) !important; }
html body.mpj-ui .mpj-stat { transition: background-color .15s; }
html body.mpj-ui .mpj-stat:hover { background: #fbfcfe; }
html body.mpj-ui .mpj-stat__note { line-height: 1.4; }
html body.mpj-ui .mpj-more--upgrade { border-style: solid; border-color: var(--mpj-blue-line); background: linear-gradient(90deg, var(--mpj-blue-soft), rgba(234, 241, 251, .3)); }
html body.mpj-ui .mpj-more--upgrade .mpj-more__icon { color: var(--mpj-blue); }

/* Study-materials dashboard */
html body.mpj-ui .mpj-mats { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: var(--mpj-s4); margin-bottom: var(--mpj-s5); }
html body.mpj-ui .mpj-mat { display: grid; gap: 6px; align-content: start; padding: var(--mpj-s5); border: 1px solid var(--mpj-line); border-radius: var(--mpj-r-lg); background: #fff; box-shadow: var(--mpj-shadow-md); color: var(--mpj-text) !important; text-decoration: none !important; transition: transform .2s var(--mpj-ease), box-shadow .2s, border-color .15s; }
html body.mpj-ui .mpj-mat:hover { transform: translateY(-2px); box-shadow: var(--mpj-shadow-lg); border-color: var(--mpj-line-strong); }
.mpj-mat__icon { display: grid; place-items: center; width: 44px; height: 44px; margin-bottom: 6px; border-radius: 12px; background: var(--mpj-blue-soft); color: var(--mpj-blue); }
.mpj-mat--guide .mpj-mat__icon { background: var(--mpj-teal-soft); color: var(--mpj-teal); }
.mpj-mat--cheat .mpj-mat__icon { background: var(--mpj-amber-soft); color: var(--mpj-amber); }
html body.mpj-ui .mpj-mat__kind { font-size: 12px; font-weight: 600; color: var(--mpj-muted); }
html body.mpj-ui .mpj-mat__title { font: 600 var(--mpj-fs-md)/1.3 var(--mpj-serif); color: var(--mpj-navy); }
html body.mpj-ui .mpj-mat__cta { margin-top: 8px; font-size: var(--mpj-fs-sm); font-weight: 600; color: var(--mpj-blue); }

/* Hero: depth and motion details */
html body.mpj-ui .mpj-next__title { font-size: clamp(22px, 2.2vw, 28px) !important; max-width: 32ch; }
html body.mpj-ui .mpj-next .mpj-bar > span { animation: mpj-grow 1s var(--mpj-ease) both; transform-origin: left; }
@keyframes mpj-grow { from { transform: scaleX(0); } to { transform: none; } }
html body.mpj-ui .mpj-bar > span { min-width: 3px; }
@media (max-width: 1100px) { html body.mpj-ui .mpj-dash__cols { grid-template-columns: 1fr !important; } }
html body.mpj-ui .mpj-chapters__table tr.is-extra { display: none; }
html body.mpj-ui .mpj-chapters.is-all .mpj-chapters__table tr.is-extra { display: table-row; }
html body.mpj-ui .mpj-chapters__more { display: block; width: 100%; padding: 12px; border: 0; border-top: 1px solid var(--mpj-line); background: #fff; color: var(--mpj-blue); font: 600 var(--mpj-fs-sm) var(--mpj-sans); cursor: pointer; }
html body.mpj-ui .mpj-chapters__more:hover { background: var(--mpj-blue-soft); }
@media (min-width: 1101px) { html body.mpj-ui .mpj-today { position: sticky; top: calc(var(--mpj-topbar-h) + 16px); } }
/* Admins: WordPress toolbar sits above the app chrome */
html body.mpj-ui.admin-bar .medexp-dashboardPage .tw-sidebar { top: 32px !important; height: calc(100vh - 32px) !important; }
html body.mpj-ui.admin-bar .medexp-dashboardPage .tw-topbar { top: 32px !important; }
@media (max-width: 782px) { html body.mpj-ui.admin-bar .medexp-dashboardPage .tw-sidebar, html body.mpj-ui.admin-bar .medexp-dashboardPage .tw-topbar { top: 46px !important; } }

/* ===================================================================
 * Study plan setup (2026): three steps with a live summary.
 * Colors come from the shared tokens, so each site keeps its brand.
 * =================================================================== */
html body.mpj-ui .tw-studyPlanShell:has(> .mpj-pw) {
  background: transparent !important; border: 0 !important; box-shadow: none !important; padding: 0 !important; overflow: visible !important;
}
html body.mpj-ui .tw-studyPlanShell:has(> .mpj-pw)::before { display: none !important; }
.mpj-pw {
  background: var(--mpj-surface);
  border: 1px solid var(--mpj-line);
  border-radius: 16px;
  box-shadow: var(--mpj-shadow-md, 0 1px 2px rgba(15,33,66,.05), 0 4px 14px rgba(15,33,66,.06));
  overflow: hidden;
  color: var(--mpj-text);
  font-family: var(--mpj-sans);
}
.mpj-pw--modal { border: 0; box-shadow: none; border-radius: 0; }
.mpj-pw *, .mpj-pw *::before, .mpj-pw *::after { box-sizing: border-box; }

/* Header + stepper */
.mpj-pw__head { padding: 22px 28px 0; border-bottom: 1px solid var(--mpj-line); }
.mpj-pw__kicker { margin: 0 0 14px; font-size: 13px; font-weight: 600; color: var(--mpj-navy); }
.mpj-pw__kicker span { font-weight: 500; color: var(--mpj-muted); }
.mpj-pw__steps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.mpj-pw__stepItem { margin: 0; position: relative; }
.mpj-pw__stepItem::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 3px; border-radius: 3px 3px 0 0;
  background: transparent; transition: background-color .2s var(--mpj-ease, ease);
}
.mpj-pw__stepItem.is-active::after { background: var(--mpj-blue); }
.mpj-pw__stepItem.is-done::after { background: var(--mpj-blue-line); }
html body.mpj-ui .mpj-pw__stepBtn {
  display: flex; align-items: center; gap: 10px; width: 100%;
  margin: 0; padding: 4px 0 14px; border: 0; background: none; box-shadow: none;
  font: 500 14px/1.3 var(--mpj-sans); color: var(--mpj-muted); text-align: left; cursor: pointer;
}
html body.mpj-ui .mpj-pw__stepBtn:disabled { cursor: default; opacity: 1; }
.mpj-pw__stepNum {
  flex: 0 0 26px; width: 26px; height: 26px; border-radius: 50%;
  display: inline-flex; align-items: center; justify-content: center;
  border: 1.5px solid var(--mpj-line-strong); background: var(--mpj-surface);
  font-size: 12px; font-weight: 700; color: var(--mpj-muted);
}
.mpj-pw__stepNum svg { width: 15px; height: 15px; }
.mpj-pw__stepItem.is-active .mpj-pw__stepNum { background: var(--mpj-blue); border-color: var(--mpj-blue); color: #fff; }
.mpj-pw__stepItem.is-done .mpj-pw__stepNum { background: var(--mpj-blue-soft); border-color: var(--mpj-blue-line); color: var(--mpj-blue); }
.mpj-pw__stepItem.is-active .mpj-pw__stepLabel { color: var(--mpj-navy); font-weight: 600; }
.mpj-pw__stepItem.is-done .mpj-pw__stepBtn:hover .mpj-pw__stepLabel { color: var(--mpj-navy); text-decoration: underline; }

/* Body: step + summary */
.mpj-pw__grid { display: grid; grid-template-columns: minmax(0, 1fr) 280px; }
.mpj-pw__main { padding: 28px 28px 8px; min-width: 0; }
.mpj-pw__pane { max-width: 640px; }
html body.mpj-ui .mpj-pw__title {
  margin: 0 0 6px; padding: 0; border: 0;
  font: 600 24px/1.25 var(--mpj-serif); letter-spacing: -.01em; color: var(--mpj-navy);
}
.mpj-pw__lede { margin: 0 0 24px; font-size: 15px; line-height: 1.5; color: var(--mpj-muted); }

/* Big choice cards (I have a date / not scheduled) */
.mpj-pw__choices { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-bottom: 24px; }
html body.mpj-ui .mpj-pw__choice {
  display: flex; align-items: center; gap: 12px; width: 100%; min-height: 72px;
  margin: 0; padding: 14px 16px; text-align: left;
  border: 1.5px solid var(--mpj-line-strong); border-radius: 12px; background: var(--mpj-surface);
  color: var(--mpj-text); box-shadow: none; cursor: pointer;
  transition: border-color .15s, background-color .15s, box-shadow .15s;
}
html body.mpj-ui .mpj-pw__choice:hover { border-color: var(--mpj-blue); }
html body.mpj-ui .mpj-pw__choice.is-on { border-color: var(--mpj-blue); background: var(--mpj-blue-soft); box-shadow: 0 0 0 1px var(--mpj-blue) inset; }
.mpj-pw__choiceIcon { flex: 0 0 38px; height: 38px; border-radius: 10px; display: inline-flex; align-items: center; justify-content: center; background: var(--mpj-sunken); color: var(--mpj-navy); }
.mpj-pw__choice.is-on .mpj-pw__choiceIcon { background: var(--mpj-surface); color: var(--mpj-blue); }
.mpj-pw__choiceIcon svg { width: 20px; height: 20px; }
.mpj-pw__choiceText { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.mpj-pw__choiceText strong { font-size: 15px; font-weight: 600; color: var(--mpj-navy); }
.mpj-pw__choiceText span { font-size: 13px; color: var(--mpj-muted); }
.mpj-pw__radio { flex: 0 0 20px; width: 20px; height: 20px; border-radius: 50%; border: 1.5px solid var(--mpj-line-strong); background: var(--mpj-surface); position: relative; }
.mpj-pw__choice.is-on .mpj-pw__radio { border-color: var(--mpj-blue); }
.mpj-pw__choice.is-on .mpj-pw__radio::after { content: ""; position: absolute; inset: 4px; border-radius: 50%; background: var(--mpj-blue); }

/* Fields */
.mpj-pw__field { margin: 0 0 24px; }
.mpj-pw__label { display: block; margin: 0 0 8px; font-size: 14px; font-weight: 600; color: var(--mpj-navy); }
.mpj-pw__labelRow { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 8px; }
.mpj-pw__labelRow .mpj-pw__label { margin: 0; }
.mpj-pw__help { margin: 8px 0 0; font-size: 13px; line-height: 1.45; color: var(--mpj-muted); }
.mpj-pw__section .mpj-pw__help { margin: 2px 0 12px; }
html body.mpj-ui .mpj-pw__input {
  display: block; width: 100%; max-width: 360px; height: 46px; margin: 0; padding: 0 14px;
  border: 1px solid var(--mpj-line-strong); border-radius: 10px; background: var(--mpj-surface);
  font: 400 16px/1.2 var(--mpj-sans); color: var(--mpj-text);
  box-shadow: inset 0 1px 1px rgba(15,33,66,.04); appearance: auto;
}
html body.mpj-ui select.mpj-pw__input { padding-right: 36px; cursor: pointer; }
html body.mpj-ui .mpj-pw__input:hover { border-color: var(--mpj-faint); }
html body.mpj-ui .mpj-pw__input:focus { outline: none; border-color: var(--mpj-blue); box-shadow: var(--mpj-focus); }
html body.mpj-ui .mpj-pw__input--short { width: 110px; max-width: 110px; padding-right: 64px; }
.mpj-pw__suffixWrap { position: relative; display: inline-flex; align-items: center; margin-top: 12px; }
.mpj-pw__inline .mpj-pw__suffixWrap { margin-top: 0; }
.mpj-pw__suffix { position: absolute; right: 12px; font-size: 14px; color: var(--mpj-muted); pointer-events: none; }
html body.mpj-ui .mpj-pw__inline .mpj-pw__input--short { width: 104px; max-width: 104px; padding-right: 30px; }
.mpj-pw__section[hidden] { display: none; }
.mpj-pw__section:not([hidden]) ~ .mpj-pw__section { }
.mpj-pw__pane > .mpj-pw__section[hidden] + .mpj-pw__section { padding-top: 0; border-top: 0; }
.mpj-pw__inline { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
html body.mpj-ui .mpj-pw__inline .mpj-pw__input { width: auto; flex: 1 1 200px; max-width: 280px; }
html body.mpj-ui .mpj-pw__inline .mpj-btn { height: 46px; }

/* Tiles (timeline, time per day) */
.mpj-pw__tiles { display: grid; grid-template-columns: repeat(auto-fill, minmax(112px, 1fr)); gap: 10px; }
.mpj-pw__tiles--time { grid-template-columns: repeat(auto-fill, minmax(96px, 1fr)); }
html body.mpj-ui .mpj-pw__tile {
  display: flex; flex-direction: column; align-items: flex-start; justify-content: center; gap: 2px;
  min-height: 52px; margin: 0; padding: 10px 14px; text-align: left;
  border: 1.5px solid var(--mpj-line-strong); border-radius: 10px; background: var(--mpj-surface);
  color: var(--mpj-text); box-shadow: none; cursor: pointer;
  transition: border-color .15s, background-color .15s;
}
html body.mpj-ui .mpj-pw__tiles--time .mpj-pw__tile { align-items: center; text-align: center; }
html body.mpj-ui .mpj-pw__tile strong { font-size: 14px; font-weight: 600; color: var(--mpj-navy); }
html body.mpj-ui .mpj-pw__tile span { font-size: 12px; color: var(--mpj-muted); }
html body.mpj-ui .mpj-pw__tile:hover { border-color: var(--mpj-blue); }
html body.mpj-ui .mpj-pw__tile.is-on { border-color: var(--mpj-blue); background: var(--mpj-blue-soft); box-shadow: 0 0 0 1px var(--mpj-blue) inset; }
html body.mpj-ui .mpj-pw__tile.is-on strong { color: var(--mpj-blue); }

/* Study days */
.mpj-pw__days { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 8px; max-width: 560px; }
html body.mpj-ui .mpj-pw__day {
  height: 48px; margin: 0; padding: 0;
  border: 1.5px solid var(--mpj-line-strong); border-radius: 10px; background: var(--mpj-surface);
  font: 600 14px/1 var(--mpj-sans); color: var(--mpj-muted); box-shadow: none; cursor: pointer;
  transition: border-color .15s, background-color .15s, color .15s;
}
html body.mpj-ui .mpj-pw__day:hover { border-color: var(--mpj-blue); color: var(--mpj-navy); }
html body.mpj-ui .mpj-pw__day.is-on { background: var(--mpj-blue); border-color: var(--mpj-blue); color: #fff; }
.mpj-pw__dayShort { display: none; }
.mpj-pw__presets { display: flex; gap: 14px; }
html body.mpj-ui .mpj-pw__link {
  margin: 0; padding: 0; border: 0; background: none; box-shadow: none;
  font: 600 13px/1.3 var(--mpj-sans); color: var(--mpj-blue); cursor: pointer;
}
html body.mpj-ui .mpj-pw__link:hover { text-decoration: underline; }

/* Fine-tune sections */
.mpj-pw__section { padding: 20px 0; border-top: 1px solid var(--mpj-line); }
.mpj-pw__pane > .mpj-pw__section:first-of-type { padding-top: 0; border-top: 0; }
html body.mpj-ui .mpj-pw__sectionTitle { margin: 0; padding: 0; font: 600 15px/1.35 var(--mpj-sans); color: var(--mpj-navy); }
.mpj-pw__chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
html body.mpj-ui .mpj-pw__search { margin-bottom: 4px; max-width: 320px; height: 40px; font-size: 15px; }
html body.mpj-ui .mpj-pw__chip {
  display: inline-flex; align-items: center; gap: 6px; max-width: 100%;
  min-height: 34px; margin: 0; padding: 6px 12px;
  border: 1px solid var(--mpj-line-strong); border-radius: 999px; background: var(--mpj-surface);
  font: 500 13px/1.3 var(--mpj-sans); color: var(--mpj-text); text-align: left; box-shadow: none; cursor: pointer;
}
html body.mpj-ui .mpj-pw__chip[hidden] { display: none; }
html body.mpj-ui .mpj-pw__chip:hover { border-color: var(--mpj-blue); }
html body.mpj-ui .mpj-pw__chip.is-on { background: var(--mpj-blue-soft); border-color: var(--mpj-blue); color: var(--mpj-blue); font-weight: 600; }
html body.mpj-ui .mpj-pw__chip.is-on::before { content: "✓"; font-weight: 700; }
html body.mpj-ui .mpj-pw__chip.is-tag { cursor: default; background: var(--mpj-sunken); border-color: var(--mpj-line); padding-right: 6px; }
html body.mpj-ui .mpj-pw__chipX {
  width: 22px; height: 22px; margin: 0; padding: 0; border: 0; border-radius: 50%;
  background: transparent; color: var(--mpj-muted); font-size: 16px; line-height: 1; cursor: pointer; box-shadow: none;
}
html body.mpj-ui .mpj-pw__chipX:hover { background: var(--mpj-line); color: var(--mpj-text); }
.mpj-pw__empty { margin: 8px 0 0; font-size: 14px; color: var(--mpj-muted); }
.mpj-pw__skel { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.mpj-pw__skel span { width: 120px; height: 34px; border-radius: 999px; background: linear-gradient(90deg, var(--mpj-sunken) 25%, #f7f9fb 37%, var(--mpj-sunken) 63%); background-size: 400% 100%; animation: mpjPwSk 1.4s ease infinite; }
.mpj-pw__skel span:nth-child(2) { width: 160px; } .mpj-pw__skel span:nth-child(3) { width: 96px; } .mpj-pw__skel span:nth-child(4) { width: 140px; }
@keyframes mpjPwSk { 0% { background-position: 100% 50%; } 100% { background-position: 0 50%; } }

/* Errors */
.mpj-pw__error { margin: 4px 0 20px; padding: 12px 14px; border-radius: 10px; background: var(--mpj-danger-bg); border: 1px solid #f1c9c9; color: var(--mpj-danger); font-size: 14px; line-height: 1.45; max-width: 640px; }

/* Live summary */
.mpj-pw__sum { margin: 0; padding: 28px 24px; background: var(--mpj-sunken); border-left: 1px solid var(--mpj-line); }
.mpj-pw__sumKicker { margin: 0 0 14px; font-size: 12px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--mpj-muted); }
.mpj-pw__sumList { margin: 0; padding: 0; display: grid; gap: 14px; }
.mpj-pw__sumRow { display: grid; gap: 2px; margin: 0; }
.mpj-pw__sumRow dt { margin: 0; font-size: 12px; color: var(--mpj-muted); }
.mpj-pw__sumRow dd { margin: 0; font-size: 15px; font-weight: 600; color: var(--mpj-navy); line-height: 1.35; overflow-wrap: anywhere; }
.mpj-pw__sumRow dd.is-muted { font-weight: 500; color: var(--mpj-faint); }
.mpj-pw__sumTotal { margin-top: 20px; padding: 14px; border-radius: 12px; background: var(--mpj-surface); border: 1px solid var(--mpj-line); display: grid; gap: 2px; }
.mpj-pw__sumTotal strong { font-size: 16px; color: var(--mpj-blue); }
.mpj-pw__sumTotal span { font-size: 13px; color: var(--mpj-muted); }

/* Footer */
.mpj-pw__foot {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 16px 28px; border-top: 1px solid var(--mpj-line); background: var(--mpj-surface);
}
.mpj-pw__footRight { display: flex; align-items: center; gap: 14px; margin-left: auto; }
.mpj-pw__footNote { font-size: 13px; color: var(--mpj-muted); }
html body.mpj-ui .mpj-pw__foot .mpj-btn--lg { min-width: 160px; }
html body.mpj-ui .mpj-pw .mpj-btn.is-busy { opacity: .8; cursor: progress; }

/* Success */
.mpj-pw__done { padding: 56px 28px; text-align: center; display: flex; flex-direction: column; align-items: center; }
.mpj-pw__doneIcon { width: 60px; height: 60px; margin-bottom: 18px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; background: var(--mpj-success-bg); color: var(--mpj-success); }
.mpj-pw__doneIcon svg { width: 30px; height: 30px; }
.mpj-pw__done .mpj-pw__lede { max-width: 440px; }
.mpj-pw__doneActions { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; }

/* Smaller screens */
@media (max-width: 900px) {
  .mpj-pw__grid { grid-template-columns: 1fr; }
  .mpj-pw__sum { border-left: 0; border-top: 1px solid var(--mpj-line); padding: 18px 20px; }
  .mpj-pw__sumList { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 16px; }
}
@media (max-width: 600px) {
  .mpj-pw { border-radius: 14px; }
  .mpj-pw__head { padding: 18px 16px 0; }
  .mpj-pw__stepLabel { display: none; }
  .mpj-pw__stepItem.is-active .mpj-pw__stepLabel { display: inline; }
  .mpj-pw__main { padding: 22px 16px 4px; }
  html body.mpj-ui .mpj-pw__title { font-size: 21px; }
  .mpj-pw__choices { grid-template-columns: 1fr; }
  .mpj-pw__days { gap: 5px; }
  html body.mpj-ui .mpj-pw__day { height: 44px; }
  .mpj-pw__dayLong { display: none; }
  .mpj-pw__dayShort { display: inline; }
  html body.mpj-ui .mpj-pw__input { max-width: none; }
  .mpj-pw__foot { padding: 12px 16px; position: sticky; bottom: 0; z-index: 2; box-shadow: 0 -6px 16px rgba(15,33,66,.06); }
  .mpj-pw__footNote { display: none; }
  html body.mpj-ui .mpj-pw__foot .mpj-btn--lg { min-width: 0; flex: 1; }
  .mpj-pw__footRight { flex: 1; }
  .mpj-pw__done { padding: 40px 16px; }
}
@media (prefers-reduced-motion: reduce) { .mpj-pw__skel span { animation: none; } }

/* The legacy plugin forces `.medexp-scope button { background: inherit !important }`.
   Setup buttons state their own colors with the same strength. */
html body.mpj-ui .mpj-pw button.mpj-pw__choice,
html body.mpj-ui .mpj-pw button.mpj-pw__tile,
html body.mpj-ui .mpj-pw button.mpj-pw__day,
html body.mpj-ui .mpj-pw button.mpj-pw__chip { background: var(--mpj-surface) !important; }
html body.mpj-ui .mpj-pw button.mpj-pw__choice.is-on,
html body.mpj-ui .mpj-pw button.mpj-pw__tile.is-on,
html body.mpj-ui .mpj-pw button.mpj-pw__chip.is-on { background: var(--mpj-blue-soft) !important; }
html body.mpj-ui .mpj-pw button.mpj-pw__day.is-on { background: var(--mpj-blue) !important; color: #fff !important; }
html body.mpj-ui .mpj-pw button.mpj-pw__stepBtn,
html body.mpj-ui .mpj-pw button.mpj-pw__link,
html body.mpj-ui .mpj-pw button.mpj-pw__chipX { background: transparent !important; }
html body.mpj-ui .mpj-pw button.mpj-pw__chipX:hover { background: var(--mpj-line) !important; }
html body.mpj-ui .mpj-pw .mpj-btn--primary { background: var(--mpj-blue) !important; border-color: var(--mpj-blue) !important; color: #fff !important; }
html body.mpj-ui .mpj-pw .mpj-btn--primary:hover { background: var(--mpj-blue-hover) !important; }
html body.mpj-ui .mpj-pw .mpj-btn--secondary { background: var(--mpj-surface) !important; border-color: var(--mpj-line-strong) !important; color: var(--mpj-navy) !important; }
html body.mpj-ui .mpj-pw .mpj-btn--secondary:hover { border-color: var(--mpj-blue) !important; }
html body.mpj-ui .mpj-pw .mpj-btn--ghost { background: transparent !important; color: var(--mpj-navy) !important; }
html body.mpj-ui .mpj-pw .mpj-btn--ghost:hover { background: var(--mpj-sunken) !important; }

/* ===================================================================
 * Study plan view (2026): countdown, today's tasks, compact calendar.
 * =================================================================== */
.mpj-sp { display: grid; gap: 20px; font-family: var(--mpj-sans); color: var(--mpj-text); }
.mpj-sp *, .mpj-sp *::before, .mpj-sp *::after { box-sizing: border-box; }
.mpj-sp__error { padding: 12px 14px; border-radius: 10px; background: var(--mpj-danger-bg); border: 1px solid #f1c9c9; color: var(--mpj-danger); font-size: 14px; }

/* Hero */
.mpj-sp__hero {
  position: relative; display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 24px;
  padding: 28px 32px; border-radius: 16px; background: var(--mpj-ink); color: #fff; overflow: hidden; isolation: isolate;
  box-shadow: var(--mpj-shadow-lg, 0 14px 34px rgba(15,33,66,.14));
}
.mpj-sp__hero::after { content: ""; position: absolute; right: -120px; top: -140px; width: 380px; height: 380px; border-radius: 50%; background: radial-gradient(circle, rgba(255,255,255,.10), rgba(255,255,255,0) 70%); z-index: -1; }
.mpj-sp__eyebrow { margin: 0 0 6px; font-size: 12px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--mpj-teal-bright, #7fd8d4); }
html body.mpj-ui .mpj-sp__count { margin: 0; padding: 0; border: 0; font: 600 34px/1.15 var(--mpj-serif); letter-spacing: -.01em; color: #fff; }
.mpj-sp__facts { margin: 8px 0 0; font-size: 15px; color: rgba(255,255,255,.82); }
.mpj-sp__note { margin: 10px 0 0; font-size: 13px; color: rgba(255,255,255,.7); }
.mpj-sp__heroSide { display: flex; align-items: center; gap: 14px; padding: 14px 18px; border-radius: 14px; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.14); }
.mpj-sp__ring { position: relative; width: 72px; height: 72px; flex: 0 0 72px; color: var(--mpj-teal-bright, #7fd8d4); }
.mpj-sp__ring svg { display: block; }
.mpj-sp__ring span { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-size: 15px; font-weight: 700; color: #fff; }
.mpj-sp__heroToday { display: grid; gap: 2px; min-width: 150px; }
.mpj-sp__heroToday strong { font-size: 16px; color: #fff; }
.mpj-sp__heroToday span { font-size: 13px; color: rgba(255,255,255,.75); }
.mpj-sp__heroToday .mpj-sp__heroWarn { color: var(--mpj-amber-bright, #f2b84b); font-weight: 600; }
html body.mpj-ui .mpj-sp__edit { position: absolute; top: 18px; right: 20px; }

/* Layout */
.mpj-sp__grid { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 20px; align-items: start; }
.mpj-sp__side { display: grid; gap: 20px; position: sticky; top: calc(var(--mpj-topbar-h, 60px) + 16px); }
.mpj-sp__card { background: var(--mpj-surface); border: 1px solid var(--mpj-line); border-radius: 16px; box-shadow: var(--mpj-shadow-md, 0 4px 14px rgba(15,33,66,.06)); }
.mpj-sp__cardHead { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; padding: 22px 24px 14px; }
html body.mpj-ui .mpj-sp__h2 { margin: 0; padding: 0; border: 0; font: 600 22px/1.25 var(--mpj-serif); color: var(--mpj-navy); }
html body.mpj-ui .mpj-sp__h3 { margin: 0; padding: 0; border: 0; font: 600 16px/1.3 var(--mpj-sans); color: var(--mpj-navy); }
.mpj-sp__sub { margin: 4px 0 0; font-size: 14px; color: var(--mpj-muted); }

/* Tasks */
.mpj-sp__group { margin: 6px 24px 6px; font-size: 12px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--mpj-muted); }
.mpj-sp__group--late { color: var(--mpj-amber, #9a5b0b); }
.mpj-sp__tasks { list-style: none; margin: 0; padding: 0 12px 12px; }
.mpj-sp__task { display: flex; align-items: center; gap: 14px; margin: 0; padding: 14px 12px; border-radius: 12px; transition: background-color .15s; }
.mpj-sp__task + .mpj-sp__task { border-top: 1px solid var(--mpj-line); border-radius: 0; }
.mpj-sp__task:hover { background: var(--mpj-sunken); border-radius: 12px; }
.mpj-sp__task.is-overdue { background: var(--mpj-amber-soft, #fcf2e1); border-radius: 12px; }
.mpj-sp__task.is-overdue + .mpj-sp__task.is-overdue { margin-top: 6px; border-top: 0; }
html body.mpj-ui .mpj-sp button.mpj-sp__check {
  flex: 0 0 26px; width: 26px; height: 26px; margin: 0; padding: 0;
  display: inline-flex; align-items: center; justify-content: center;
  border: 2px solid var(--mpj-line-strong) !important; border-radius: 50%;
  background: var(--mpj-surface) !important; color: #fff !important; cursor: pointer; box-shadow: none;
  transition: background-color .15s, border-color .15s;
}
html body.mpj-ui .mpj-sp button.mpj-sp__check:hover { border-color: var(--mpj-blue) !important; }
html body.mpj-ui .mpj-sp .is-done button.mpj-sp__check { background: var(--mpj-success) !important; border-color: var(--mpj-success) !important; }
.mpj-sp__check svg { width: 16px; height: 16px; }
.mpj-sp__taskBody { flex: 1; min-width: 0; display: grid; gap: 4px; }
html body.mpj-ui .mpj-sp__taskTitle { font-size: 15px; font-weight: 600; line-height: 1.4; color: var(--mpj-navy) !important; text-decoration: none; overflow-wrap: anywhere; }
html body.mpj-ui a.mpj-sp__taskTitle:hover { color: var(--mpj-blue) !important; text-decoration: underline; }
.mpj-sp__task.is-done .mpj-sp__taskTitle { color: var(--mpj-faint) !important; text-decoration: line-through; }
.mpj-sp__taskMeta { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; font-size: 13px; color: var(--mpj-muted); }
.mpj-sp__type { width: 22px; height: 22px; display: inline-flex; align-items: center; justify-content: center; border-radius: 6px; background: var(--mpj-blue-soft); color: var(--mpj-blue); }
.mpj-sp__type svg { width: 14px; height: 14px; }
.mpj-sp__type--qbank { background: var(--mpj-teal-soft, #e5f4f3); color: var(--mpj-teal, #12807c); }
.mpj-sp__type--flashcard { background: var(--mpj-amber-soft, #fcf2e1); color: var(--mpj-amber, #9a5b0b); }
.mpj-sp__dotSep { color: var(--mpj-faint); }
.mpj-sp__late { margin-left: 4px; padding: 1px 8px; border-radius: 999px; background: var(--mpj-amber-soft, #fcf2e1); color: var(--mpj-amber, #9a5b0b); font-weight: 600; font-size: 12px; }
.mpj-sp__task.is-overdue .mpj-sp__late { background: var(--mpj-surface); }
.mpj-sp__taskActions { display: flex; align-items: center; gap: 6px; flex-shrink: 0; }
html body.mpj-ui .mpj-sp button.mpj-sp__snooze {
  height: 32px; margin: 0; padding: 0 10px; border: 0; border-radius: 8px;
  background: transparent !important; color: var(--mpj-muted) !important;
  font: 600 13px/1 var(--mpj-sans); cursor: pointer; box-shadow: none;
}
html body.mpj-ui .mpj-sp button.mpj-sp__snooze:hover { background: var(--mpj-sunken) !important; color: var(--mpj-navy) !important; }
.mpj-sp__empty { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 6px; padding: 36px 24px 44px; color: var(--mpj-muted); font-size: 14px; }
.mpj-sp__empty strong { font-size: 16px; color: var(--mpj-navy); }
.mpj-sp__emptyIcon { width: 48px; height: 48px; margin-bottom: 6px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; background: var(--mpj-blue-soft); color: var(--mpj-blue); }
.mpj-sp__skel { display: grid; gap: 10px; padding: 8px 24px 24px; }
.mpj-sp__skel span { height: 52px; border-radius: 12px; background: linear-gradient(90deg, var(--mpj-sunken) 25%, #f7f9fb 37%, var(--mpj-sunken) 63%); background-size: 400% 100%; animation: mpjPwSk 1.4s ease infinite; }

/* Compact calendar */
.mpj-sp__cal { padding: 18px 18px 14px; }
.mpj-sp__calHead { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; }
.mpj-sp__calNavs { display: flex; gap: 4px; }
html body.mpj-ui .mpj-sp button.mpj-sp__calNav {
  width: 32px; height: 32px; margin: 0; padding: 0; display: inline-flex; align-items: center; justify-content: center;
  border: 1px solid var(--mpj-line) !important; border-radius: 8px; background: var(--mpj-surface) !important; color: var(--mpj-navy) !important; cursor: pointer; box-shadow: none;
}
html body.mpj-ui .mpj-sp button.mpj-sp__calNav:hover { border-color: var(--mpj-blue) !important; }
.mpj-sp__calGrid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 4px; }
.mpj-sp__dow { text-align: center; font-size: 11px; font-weight: 600; color: var(--mpj-faint); padding: 4px 0; }
html body.mpj-ui .mpj-sp button.mpj-sp__d {
  position: relative; aspect-ratio: 1; width: 100%; min-height: 0; margin: 0; padding: 0;
  display: flex; align-items: center; justify-content: center;
  border: 0 !important; border-radius: 10px; background: transparent !important;
  font: 500 13px/1 var(--mpj-sans); color: var(--mpj-text) !important; cursor: pointer; box-shadow: none;
}
html body.mpj-ui .mpj-sp button.mpj-sp__d:hover { background: var(--mpj-sunken) !important; }
html body.mpj-ui .mpj-sp button.mpj-sp__d.is-out { color: transparent !important; cursor: default; }
html body.mpj-ui .mpj-sp button.mpj-sp__d::after { content: ""; position: absolute; bottom: 5px; left: 50%; width: 5px; height: 5px; margin-left: -2.5px; border-radius: 50%; background: transparent; }
html body.mpj-ui .mpj-sp button.mpj-sp__d.is-planned::after { background: var(--mpj-blue); }
html body.mpj-ui .mpj-sp button.mpj-sp__d.is-complete::after { background: var(--mpj-success); }
html body.mpj-ui .mpj-sp button.mpj-sp__d.is-missed::after { background: var(--mpj-amber-bright, #f2b84b); }
html body.mpj-ui .mpj-sp button.mpj-sp__d.is-today { font-weight: 700; color: var(--mpj-blue) !important; box-shadow: inset 0 0 0 1.5px var(--mpj-blue); }
html body.mpj-ui .mpj-sp button.mpj-sp__d.is-sel { background: var(--mpj-blue) !important; color: #fff !important; font-weight: 700; }
html body.mpj-ui .mpj-sp button.mpj-sp__d.is-sel::after { background: #fff; }
html body.mpj-ui .mpj-sp button.mpj-sp__d.is-exam { box-shadow: inset 0 0 0 2px var(--mpj-amber-bright, #f2b84b); font-weight: 700; }
.mpj-sp__legend { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--mpj-line); font-size: 12px; color: var(--mpj-muted); }
.mpj-sp__legend span { display: inline-flex; align-items: center; gap: 5px; }
.mpj-sp__legend i { width: 7px; height: 7px; border-radius: 50%; display: inline-block; }
.mpj-sp__legend i.is-planned { background: var(--mpj-blue); }
.mpj-sp__legend i.is-complete { background: var(--mpj-success); }
.mpj-sp__legend i.is-missed { background: var(--mpj-amber-bright, #f2b84b); }
.mpj-sp__legend i.is-exam { width: 10px; height: 10px; border-radius: 3px; background: transparent; box-shadow: inset 0 0 0 2px var(--mpj-amber-bright, #f2b84b); }

/* Flashcards */
.mpj-sp__flash { padding: 18px; display: grid; gap: 14px; }
.mpj-sp__flashTop { display: flex; align-items: center; gap: 12px; }
.mpj-sp__flashIcon { flex: 0 0 40px; height: 40px; border-radius: 10px; display: inline-flex; align-items: center; justify-content: center; background: var(--mpj-amber-soft, #fcf2e1); color: var(--mpj-amber, #9a5b0b); }
.mpj-sp__flashTop .mpj-sp__sub { margin-top: 2px; }
html body.mpj-ui .mpj-sp__flashBtn { justify-self: start; }

@media (max-width: 1080px) {
  .mpj-sp__grid { grid-template-columns: 1fr; }
  .mpj-sp__side { position: static; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); align-items: start; }
}
@media (max-width: 720px) {
  .mpj-sp__hero { grid-template-columns: 1fr; padding: 22px 20px; }
  html body.mpj-ui .mpj-sp__count { font-size: 28px; padding-right: 96px; }
  html body.mpj-ui .mpj-sp__edit { top: 16px; right: 14px; }
  .mpj-sp__heroSide { padding: 12px 14px; }
  .mpj-sp__cardHead { padding: 18px 16px 10px; }
  .mpj-sp__tasks { padding: 0 6px 8px; }
  .mpj-sp__task { flex-wrap: wrap; padding: 12px 10px; }
  .mpj-sp__taskBody { flex-basis: calc(100% - 40px); }
  .mpj-sp__taskActions { margin-left: 40px; }
  .mpj-sp__group { margin: 6px 16px; }
}
/* Hero text stays white over the shared heading/paragraph colors. */
html body.mpj-ui .mpj-sp__hero .mpj-sp__eyebrow { color: var(--mpj-teal-bright, #7fd8d4) !important; }
html body.mpj-ui .mpj-sp__hero .mpj-sp__count { color: #fff !important; }
html body.mpj-ui .mpj-sp__hero .mpj-sp__facts { color: rgba(255,255,255,.85) !important; }
html body.mpj-ui .mpj-sp__hero .mpj-sp__note { color: rgba(255,255,255,.72) !important; }
html body.mpj-ui .mpj-sp__hero .mpj-sp__heroToday strong { color: #fff !important; }
html body.mpj-ui .mpj-sp__hero .mpj-sp__heroToday span { color: rgba(255,255,255,.78) !important; }
html body.mpj-ui .mpj-sp__hero .mpj-sp__heroToday .mpj-sp__heroWarn { color: var(--mpj-amber-bright, #f2b84b) !important; }
/* Loading shape */
.mpj-sp__hero--skel { min-height: 150px; opacity: .55; }
.mpj-sp--loading .mpj-sp__card.mpj-sp__skel { padding: 24px; }
.mpj-sp--loading .mpj-sp__card.mpj-sp__skel span { height: 56px; }

/* ===================================================================
 * Flashcards (2026): one home screen + focused study player.
 * =================================================================== */
.mpj-fc { display: grid; gap: 20px; font-family: var(--mpj-sans); color: var(--mpj-text); }
.mpj-fc *, .mpj-fx *, .mpj-fc *::before, .mpj-fx *::before, .mpj-fc *::after, .mpj-fx *::after { box-sizing: border-box; }

/* Hero */
.mpj-fc__hero {
  position: relative; display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: 24px;
  padding: 30px 32px; border-radius: 18px; background: var(--mpj-ink); color: #fff; overflow: hidden; isolation: isolate;
  box-shadow: var(--mpj-shadow-lg, 0 14px 34px rgba(15,33,66,.14));
}
.mpj-fc__hero::before {
  content: ""; position: absolute; right: 28%; top: -60px; width: 150px; height: 190px; border-radius: 16px; z-index: -1;
  background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.10); transform: rotate(-10deg);
}
.mpj-fc__hero::after {
  content: ""; position: absolute; right: calc(28% - 70px); top: -30px; width: 150px; height: 190px; border-radius: 16px; z-index: -1;
  background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.12); transform: rotate(6deg);
}
.mpj-fc__hero--skel { min-height: 190px; }
html body.mpj-ui .mpj-fc__eyebrow { margin: 0 0 6px; font-size: 12px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--mpj-teal-bright, #7fd8d4) !important; }
html body.mpj-ui .mpj-fc__big { margin: 0; padding: 0; border: 0; font: 600 34px/1.15 var(--mpj-serif); letter-spacing: -.01em; color: #fff !important; }
html body.mpj-ui .mpj-fc__lede { margin: 8px 0 0; font-size: 15px; color: rgba(255,255,255,.82) !important; max-width: 520px; }
.mpj-fc__actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 22px; }
html body.mpj-ui .mpj-fc__start { min-width: 190px; }
.mpj-fc__stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1px; border-radius: 14px; overflow: hidden; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.14); }
.mpj-fc__stat { display: grid; gap: 2px; padding: 14px 18px; min-width: 104px; background: rgba(9,22,48,.35); }
html body.mpj-ui .mpj-fc__stat strong { font-size: 22px; line-height: 1.1; color: #fff !important; }
html body.mpj-ui .mpj-fc__stat span { font-size: 12px; color: rgba(255,255,255,.72) !important; }

/* Customize */
.mpj-fc__custom { display: flex; flex-wrap: wrap; gap: 20px 28px; padding: 20px 24px; background: var(--mpj-surface); border: 1px solid var(--mpj-line); border-radius: 16px; box-shadow: var(--mpj-shadow-md, 0 4px 14px rgba(15,33,66,.06)); }
.mpj-fc__field { display: grid; gap: 8px; }
.mpj-fc__label { font-size: 13px; font-weight: 600; color: var(--mpj-navy); }
.mpj-fc__seg { display: inline-flex; padding: 3px; gap: 2px; border-radius: 10px; background: var(--mpj-sunken); border: 1px solid var(--mpj-line); }
html body.mpj-ui .mpj-fc button.mpj-fc__segBtn {
  height: 36px; margin: 0; padding: 0 14px; border: 0; border-radius: 8px; box-shadow: none; cursor: pointer;
  background: transparent !important; color: var(--mpj-muted) !important; font: 600 13px/1 var(--mpj-sans);
}
html body.mpj-ui .mpj-fc button.mpj-fc__segBtn:hover { color: var(--mpj-navy) !important; }
html body.mpj-ui .mpj-fc button.mpj-fc__segBtn.is-on { background: var(--mpj-surface) !important; color: var(--mpj-navy) !important; box-shadow: 0 1px 2px rgba(15,33,66,.12); }
html body.mpj-ui .mpj-fc__select, html body.mpj-ui .mpj-fc__search {
  height: 42px; min-width: 220px; margin: 0; padding: 0 12px; border: 1px solid var(--mpj-line-strong); border-radius: 10px;
  background: var(--mpj-surface); color: var(--mpj-text); font: 400 15px var(--mpj-sans);
}
html body.mpj-ui .mpj-fc__select:focus, html body.mpj-ui .mpj-fc__search:focus { outline: none; border-color: var(--mpj-blue); box-shadow: var(--mpj-focus); }

/* Decks */
.mpj-fc__sectionHead { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 4px; }
html body.mpj-ui .mpj-fc__h2 { margin: 0; padding: 0; border: 0; font: 600 20px/1.25 var(--mpj-serif); color: var(--mpj-navy); }
.mpj-fc__decks { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 16px; }
.mpj-fc__deck {
  display: flex; flex-direction: column; justify-content: space-between; gap: 18px; min-height: 150px; padding: 20px;
  background: var(--mpj-surface); border: 1px solid var(--mpj-line); border-radius: 16px;
  box-shadow: var(--mpj-shadow-md, 0 4px 14px rgba(15,33,66,.06)); transition: border-color .15s, transform .15s, box-shadow .15s;
}
.mpj-fc__deck:hover { border-color: var(--mpj-blue-line); transform: translateY(-1px); }
.mpj-fc__deck.is-current { border-color: var(--mpj-blue); }
.mpj-fc__deck--skel { min-height: 150px; }
.mpj-fc__deck--skel:hover { transform: none; border-color: var(--mpj-line); }
.mpj-fc__deckTop { display: flex; gap: 14px; align-items: flex-start; }
.mpj-fc__deckIcon { flex: 0 0 42px; height: 42px; border-radius: 12px; display: inline-flex; align-items: center; justify-content: center; background: var(--mpj-blue-soft); color: var(--mpj-blue); }
.mpj-fc__deckIcon svg { width: 20px; height: 20px; }
.mpj-fc__deckText { min-width: 0; }
html body.mpj-ui .mpj-fc__deckName { margin: 0; padding: 0; border: 0; font: 600 16px/1.35 var(--mpj-sans); color: var(--mpj-navy); overflow-wrap: anywhere; }
.mpj-fc__deckMeta { margin: 4px 0 0; font-size: 13px; color: var(--mpj-muted); }
.mpj-fc__deckActions { display: flex; align-items: center; gap: 8px; }
html body.mpj-ui .mpj-fc .mpj-btn--primary { background: var(--mpj-blue) !important; border-color: var(--mpj-blue) !important; color: #fff !important; }
html body.mpj-ui .mpj-fc .mpj-btn--primary:hover { background: var(--mpj-blue-hover) !important; }
html body.mpj-ui .mpj-fc .mpj-btn--ghost { background: transparent !important; color: var(--mpj-navy) !important; }
html body.mpj-ui .mpj-fc .mpj-btn--ghost:hover { background: var(--mpj-sunken) !important; }
html body.mpj-ui .mpj-fc .mpj-btn--accent { background: var(--mpj-teal-bright, #3bc6c2) !important; border-color: transparent !important; color: var(--mpj-navy-2, #0f2142) !important; }
html body.mpj-ui .mpj-fc .mpj-btn--accent:hover { filter: brightness(1.05); }
html body.mpj-ui .mpj-fc .mpj-btn--onDark { background: rgba(255,255,255,.10) !important; border-color: rgba(255,255,255,.28) !important; color: #fff !important; }
html body.mpj-ui .mpj-fc .mpj-btn--onDark:hover { background: rgba(255,255,255,.18) !important; }
html body.mpj-ui .mpj-fc .mpj-btn:disabled { opacity: .5; cursor: not-allowed; }
html body.mpj-ui .mpj-fc button.mpj-fc__del {
  width: 34px; height: 34px; margin: 0 0 0 auto; padding: 0; border: 0; border-radius: 8px; box-shadow: none; cursor: pointer;
  display: inline-flex; align-items: center; justify-content: center; background: transparent !important; color: var(--mpj-faint) !important;
}
html body.mpj-ui .mpj-fc button.mpj-fc__del:hover { background: var(--mpj-danger-bg) !important; color: var(--mpj-danger) !important; }
.mpj-fc__empty { margin: 0; padding: 18px 0; color: var(--mpj-muted); font-size: 14px; }

/* ---------- Study player (covers the whole screen) ---------- */
html.mpj-fx-open, html.mpj-fx-open body { overflow: hidden !important; }
html.mpj-fx-open .medexp-mochi-drawer-root, html.mpj-fx-open [class*="mochi-fab"], html.mpj-fx-open .medexp-mochi-fab, html.mpj-fx-open #mlc3-mochi-floater { display: none !important; }
.mpj-fx {
  position: fixed; inset: 0; z-index: 100050;
  display: grid; grid-template-rows: auto minmax(0, 1fr) auto;
  background: var(--mpj-paper, #f5f7fa); color: var(--mpj-text);
  font-family: var(--mpj-sans);
  animation: mpjFxIn .18s ease-out;
}
@keyframes mpjFxIn { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
.mpj-fx__bar {
  display: flex; align-items: center; gap: 14px; padding: 12px max(16px, env(safe-area-inset-right)) 12px max(16px, env(safe-area-inset-left));
  padding-top: max(12px, env(safe-area-inset-top));
  background: var(--mpj-surface); border-bottom: 1px solid var(--mpj-line);
}
.mpj-fx button.mpj-fx__icon {
  flex: 0 0 40px; width: 40px; height: 40px; margin: 0; padding: 0; border: 0; border-radius: 10px; cursor: pointer;
  display: inline-flex; align-items: center; justify-content: center; background: transparent; color: var(--mpj-muted); box-shadow: none;
}
.mpj-fx button.mpj-fx__icon:hover { background: var(--mpj-sunken); color: var(--mpj-navy); }
.mpj-fx__progress { flex: 1; min-width: 0; display: grid; gap: 6px; }
.mpj-fx__title { font-size: 13px; font-weight: 600; color: var(--mpj-navy); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mpj-fx__track { height: 6px; border-radius: 6px; background: var(--mpj-sunken); overflow: hidden; }
.mpj-fx__fill { display: block; height: 100%; width: 0; border-radius: 6px; background: var(--mpj-blue); transition: width .3s var(--mpj-ease, ease); }
.mpj-fx__count { font-size: 14px; font-weight: 600; color: var(--mpj-muted); font-variant-numeric: tabular-nums; min-width: 56px; text-align: right; }

.mpj-fx__stage { overflow-y: auto; padding: clamp(16px, 4vh, 48px) 16px; display: flex; flex-direction: column; align-items: center; -webkit-overflow-scrolling: touch; }
.mpj-fx__card {
  position: relative; width: 100%; max-width: 760px; margin: auto 0;
  padding: clamp(24px, 4vw, 44px) clamp(20px, 4vw, 48px) 44px;
  background: var(--mpj-surface); border: 1px solid var(--mpj-line); border-radius: 20px;
  box-shadow: 0 1px 2px rgba(15,33,66,.05), 0 18px 40px rgba(15,33,66,.08);
  outline: none; animation: mpjFxCard .22s var(--mpj-ease, ease);
}
.mpj-fx__card:not(.is-revealed) { cursor: pointer; }
@keyframes mpjFxCard { from { opacity: 0; transform: translateY(10px) scale(.99); } to { opacity: 1; transform: none; } }
.mpj-fx__meta { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 18px; }
.mpj-fx__badge { padding: 3px 10px; border-radius: 999px; font-size: 12px; font-weight: 700; background: var(--mpj-blue-soft); color: var(--mpj-blue); }
.mpj-fx__badge.is-new { background: var(--mpj-amber-soft, #fcf2e1); color: var(--mpj-amber, #9a5b0b); }
.mpj-fx__tag { padding: 3px 10px; border-radius: 999px; font-size: 12px; font-weight: 500; background: var(--mpj-sunken); color: var(--mpj-muted); max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mpj-fx__q { font-size: clamp(19px, 2.2vw, 23px); line-height: 1.5; font-weight: 500; color: var(--mpj-navy); overflow-wrap: anywhere; }
.mpj-fx__q strong { font-weight: 700; }
.mpj-fx__a { margin-top: 26px; padding-top: 22px; border-top: 1px dashed var(--mpj-line-strong); animation: mpjFxCard .2s ease; }
.mpj-fx__aLabel { display: block; margin-bottom: 8px; font-size: 12px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--mpj-success); }
.mpj-fx__aBody { font-size: 17px; line-height: 1.6; color: var(--mpj-text); overflow-wrap: anywhere; }
.mpj-fx__aBody ul, .mpj-fx__q ul { margin: 8px 0 0 1.2em; padding: 0; }
.mpj-fx__aBody li, .mpj-fx__q li { margin: 4px 0; }
.mpj-fx__blank { display: inline-block; min-width: 3.2em; padding: 0 .5em; border-radius: 6px; background: var(--mpj-blue-soft); color: var(--mpj-blue); font-weight: 600; text-align: center; }
.mpj-fx__cloze { padding: 0 .3em; border-radius: 6px; background: var(--mpj-success-bg); color: var(--mpj-success); font-weight: 700; }
.mpj-fx button.mpj-fx__report {
  position: absolute; right: 16px; bottom: 12px; margin: 0; padding: 4px 8px; border: 0; border-radius: 6px;
  background: transparent; color: var(--mpj-faint); font: 500 12px var(--mpj-sans); cursor: pointer; box-shadow: none;
}
.mpj-fx button.mpj-fx__report:hover { color: var(--mpj-navy); background: var(--mpj-sunken); }
.mpj-fx__loading, .mpj-fx__msg { margin: auto; text-align: center; color: var(--mpj-muted); font-size: 15px; }
.mpj-fx__msg h2 { margin: 0 0 6px; font: 600 22px var(--mpj-serif); color: var(--mpj-navy); }

/* Dock: thumb-reach actions */
.mpj-fx__dock {
  display: grid; justify-items: center; gap: 10px;
  padding: 14px 16px max(16px, env(safe-area-inset-bottom));
  background: var(--mpj-surface); border-top: 1px solid var(--mpj-line);
  box-shadow: 0 -8px 24px rgba(15,33,66,.05);
}
.mpj-fx button.mpj-fx__show {
  display: inline-flex; align-items: center; justify-content: center; gap: 12px;
  width: min(100%, 420px); height: 54px; margin: 0; padding: 0 24px; border: 0; border-radius: 14px; cursor: pointer;
  background: var(--mpj-blue); color: #fff; font: 600 17px var(--mpj-sans); box-shadow: 0 6px 16px color-mix(in srgb, var(--mpj-blue) 28%, transparent);
  transition: background-color .15s, transform .1s;
}
.mpj-fx button.mpj-fx__show:hover { background: var(--mpj-blue-hover); }
.mpj-fx button.mpj-fx__show:active { transform: translateY(1px); }
.mpj-fx__kbd { display: inline-block; padding: 2px 7px; border-radius: 6px; border: 1px solid currentColor; font: 600 11px/1.4 var(--mpj-sans); opacity: .65; }
.mpj-fx__ask { margin: 0; font-size: 13px; font-weight: 600; color: var(--mpj-muted); }
.mpj-fx__grades { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; width: min(100%, 680px); }
.mpj-fx button.mpj-fx__grade {
  position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px;
  height: 66px; margin: 0; padding: 6px; border-radius: 14px; cursor: pointer; box-shadow: none;
  border: 1.5px solid var(--g-line); background: var(--g-bg); color: var(--g-ink);
  transition: transform .1s, filter .15s, background-color .15s;
}
.mpj-fx button.mpj-fx__grade:hover { filter: brightness(.97); transform: translateY(-1px); }
.mpj-fx button.mpj-fx__grade:active { transform: translateY(1px); }
.mpj-fx button.mpj-fx__grade:disabled { opacity: .55; cursor: progress; transform: none; }
.mpj-fx__gradeLabel { font: 700 16px/1 var(--mpj-sans); }
.mpj-fx__gradeWhen { font: 500 12px/1 var(--mpj-sans); opacity: .8; }
.mpj-fx__grade .mpj-fx__kbd { position: absolute; top: 6px; right: 8px; padding: 0 5px; font-size: 10px; opacity: .45; }
.mpj-fx__grade--again { --g-bg: #fdf0ef; --g-line: #f3c7c3; --g-ink: #a33030; }
.mpj-fx__grade--hard  { --g-bg: #fdf5e6; --g-line: #f0d9ab; --g-ink: #8a5a12; }
.mpj-fx__grade--good  { --g-bg: var(--mpj-blue-soft); --g-line: var(--mpj-blue-line); --g-ink: var(--mpj-blue); }
.mpj-fx__grade--easy  { --g-bg: #eaf5ef; --g-line: #bfdfcc; --g-ink: #26704a; }
.mpj-fx__err { margin: 0; min-height: 0; font-size: 13px; color: var(--mpj-danger); }
.mpj-fx__err:empty { display: none; }
.mpj-fx__browse { display: flex; align-items: center; gap: 12px; width: min(100%, 520px); }
.mpj-fx__browse .mpj-fx__show { flex: 1; }
.mpj-fx button.mpj-fx__nav {
  flex: 0 0 54px; width: 54px; height: 54px; margin: 0; padding: 0; border-radius: 14px; cursor: pointer;
  display: inline-flex; align-items: center; justify-content: center;
  border: 1px solid var(--mpj-line-strong); background: var(--mpj-surface); color: var(--mpj-navy); box-shadow: none;
}
.mpj-fx button.mpj-fx__nav:hover { border-color: var(--mpj-blue); }
.mpj-fx button.mpj-fx__nav:disabled { opacity: .4; cursor: default; }
.mpj-fx__hint { margin: 0; font-size: 12px; color: var(--mpj-faint); }

/* Session summary */
.mpj-fx__done { margin: auto; max-width: 520px; text-align: center; display: flex; flex-direction: column; align-items: center; animation: mpjFxCard .25s ease; }
.mpj-fx__doneIcon { width: 72px; height: 72px; margin-bottom: 18px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; background: var(--mpj-amber-soft, #fcf2e1); color: var(--mpj-amber, #9a5b0b); }
.mpj-fx__doneIcon svg { width: 34px; height: 34px; }
.mpj-fx__doneTitle { margin: 0 0 18px; font: 600 28px/1.2 var(--mpj-serif); color: var(--mpj-navy); }
.mpj-fx__doneStats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; width: 100%; margin-bottom: 16px; }
.mpj-fx__doneStats div { display: grid; gap: 2px; padding: 16px 10px; border-radius: 14px; background: var(--mpj-surface); border: 1px solid var(--mpj-line); }
.mpj-fx__doneStats strong { font-size: 24px; color: var(--mpj-navy); }
.mpj-fx__doneStats span { font-size: 13px; color: var(--mpj-muted); }
.mpj-fx__doneText { margin: 0; font-size: 15px; color: var(--mpj-muted); }

/* Brand fonts for the player (it lives outside the app frame) */
html body.mpj-site-medexprep .mpj-fx { font-family: var(--mpj-sans); }

@media (max-width: 760px) {
  .mpj-fc__hero { grid-template-columns: 1fr; padding: 24px 20px; }
  .mpj-fc__hero::before, .mpj-fc__hero::after { display: none; }
  html body.mpj-ui .mpj-fc__big { font-size: 28px; }
  .mpj-fc__actions .mpj-btn { flex: 1 1 auto; }
  .mpj-fc__stat { min-width: 0; padding: 12px; }
  .mpj-fc__custom { padding: 16px; }
  .mpj-fc__seg { display: flex; }
  html body.mpj-ui .mpj-fc button.mpj-fc__segBtn { flex: 1; padding: 0 8px; }
  html body.mpj-ui .mpj-fc__select { width: 100%; min-width: 0; }
  .mpj-fc__sectionHead { flex-wrap: wrap; }
  html body.mpj-ui .mpj-fc__search { width: 100%; min-width: 0; }
  .mpj-fc__decks { grid-template-columns: 1fr; }
  .mpj-fx__full { display: none !important; }
  .mpj-fx__card { border-radius: 16px; }
  .mpj-fx__grades { gap: 8px; }
  .mpj-fx button.mpj-fx__grade { height: 62px; border-radius: 12px; }
  .mpj-fx__gradeLabel { font-size: 15px; }
  .mpj-fx__kbd { display: none; }
  .mpj-fx__hint { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  .mpj-fx, .mpj-fx__card, .mpj-fx__a, .mpj-fx__done { animation: none; }
}

/* Study card never shows a focus ring when it receives focus programmatically */
html body .mpj-fx .mpj-fx__card:focus, html body .mpj-fx .mpj-fx__card:focus-visible { outline: none !important; border-color: var(--mpj-line) !important; box-shadow: 0 1px 2px rgba(15,33,66,.05), 0 18px 40px rgba(15,33,66,.08) !important; }

/* Flashcards loading shape: same layout as the real screen, soft shimmer */
.mpj-sk { display: block; max-width: 100%; border-radius: 8px; background: linear-gradient(90deg, var(--mpj-sunken) 25%, #f8fafc 45%, var(--mpj-sunken) 65%); background-size: 300% 100%; animation: mpjSkMove 1.5s ease-in-out infinite; }
.mpj-sk.is-dark { background: linear-gradient(90deg, rgba(255,255,255,.08) 25%, rgba(255,255,255,.18) 45%, rgba(255,255,255,.08) 65%); background-size: 300% 100%; border-radius: 10px; }
@keyframes mpjSkMove { 0% { background-position: 100% 0; } 100% { background-position: -50% 0; } }
.mpj-fc__skLines { display: grid; gap: 10px; flex: 1; min-width: 0; }
.mpj-fc__skRow { display: flex; gap: 10px; margin-top: 10px; }
.mpj-fc__skStats { width: 320px; max-width: 100%; }
.mpj-fc__skHead { margin-top: 4px; }
@media (max-width: 760px) { .mpj-fc__skStats { width: 100%; } }
@media (prefers-reduced-motion: reduce) { .mpj-sk { animation: none; } }

/* ===================================================================
 * Support (2026): self-help first, contact form as the last step.
 * =================================================================== */
.mpj-help { display: grid; gap: 22px; font-family: var(--mpj-sans); color: var(--mpj-text); max-width: 980px; }
.mpj-help *, .mpj-help *::before, .mpj-help *::after { box-sizing: border-box; }
.mpj-help [hidden] { display: none !important; }

/* Hero + search */
.mpj-help__hero { padding: 30px 32px 32px; border-radius: 18px; background: var(--mpj-ink); color: #fff; box-shadow: var(--mpj-shadow-lg, 0 14px 34px rgba(15,33,66,.14)); }
html body.mpj-ui .mpj-help__title { margin: 0; padding: 0; border: 0; font: 600 30px/1.2 var(--mpj-serif); color: #fff !important; }
html body.mpj-ui .mpj-help__lede { margin: 8px 0 20px; font-size: 15px; color: rgba(255,255,255,.8) !important; }
.mpj-help__search { position: relative; display: block; max-width: 680px; margin: 0; }
html body.mpj-ui .mpj-help__searchIcon { position: absolute; z-index: 1; left: 16px; top: 50%; transform: translateY(-50%); color: var(--mpj-muted) !important; display: inline-flex; pointer-events: none; }
html body.mpj-ui .mpj-help__search input {
  display: block; width: 100%; height: 56px; margin: 0; padding: 0 18px 0 48px;
  border: 0; border-radius: 12px; background: #fff; color: var(--mpj-text);
  font: 400 16px var(--mpj-sans); box-shadow: 0 6px 18px rgba(9,22,48,.25);
}
html body.mpj-ui .mpj-help__search input:focus { outline: none; box-shadow: 0 0 0 3px var(--mpj-teal-bright, #7fd8d4), 0 6px 18px rgba(9,22,48,.25); }

/* Sections */
.mpj-help__section { display: grid; gap: 12px; }
html body.mpj-ui .mpj-help__h3 { margin: 0; padding: 0; border: 0; font: 600 13px/1.3 var(--mpj-sans); letter-spacing: .06em; text-transform: uppercase; color: var(--mpj-muted); }
html body.mpj-ui .mpj-help__h2 { margin: 0; padding: 0; border: 0; font: 600 22px/1.25 var(--mpj-serif); color: var(--mpj-navy); }
.mpj-help__muted { margin: 0; font-size: 15px; line-height: 1.55; color: var(--mpj-muted); }

/* Common fixes (expandable cards) */
.mpj-help__fixes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; align-items: start; }
.mpj-help__fix, .mpj-help__qa, .mpj-help__moreItem { background: var(--mpj-surface); border: 1px solid var(--mpj-line); border-radius: 14px; box-shadow: 0 1px 2px rgba(15,33,66,.04); transition: border-color .15s, box-shadow .15s; }
.mpj-help__fix[open], .mpj-help__qa[open], .mpj-help__moreItem[open] { border-color: var(--mpj-blue-line); box-shadow: var(--mpj-shadow-md, 0 4px 14px rgba(15,33,66,.06)); }
.mpj-help summary { list-style: none; cursor: pointer; display: flex; align-items: center; gap: 12px; padding: 16px 18px; border-radius: 14px; }
.mpj-help summary::-webkit-details-marker { display: none; }
.mpj-help summary:hover { background: var(--mpj-sunken); }
.mpj-help summary:focus-visible { outline: 2px solid var(--mpj-blue); outline-offset: 2px; }
.mpj-help__fixIcon, .mpj-help__topicIcon { flex: 0 0 38px; width: 38px; height: 38px; border-radius: 10px; display: inline-flex; align-items: center; justify-content: center; background: var(--mpj-blue-soft); color: var(--mpj-blue); }
.mpj-help__fixQ, .mpj-help__q { flex: 1; min-width: 0; font-size: 15px; font-weight: 600; line-height: 1.4; color: var(--mpj-navy); }
.mpj-help__chev { flex: 0 0 18px; width: 18px; height: 18px; margin-left: auto; position: relative; }
.mpj-help__chev::before { content: ""; position: absolute; inset: 4px 4px 6px; border-right: 2px solid var(--mpj-faint); border-bottom: 2px solid var(--mpj-faint); transform: rotate(45deg); transition: transform .15s; }
details[open] > summary .mpj-help__chev::before { transform: rotate(-135deg); top: 7px; }
.mpj-help__answer { padding: 2px 20px 18px 68px; font-size: 15px; line-height: 1.6; color: var(--mpj-text); }
.mpj-help__qa .mpj-help__answer { padding-left: 20px; }
.mpj-help__answer ol, .mpj-help__answer ul { margin: 0 0 4px 1.2em; padding: 0; }
.mpj-help__answer li { margin: 0 0 6px; padding-left: 2px; }
.mpj-help__answer p { margin: 0 0 8px; }
html body.mpj-ui .mpj-help__answer a:not(.mpj-btn) { color: var(--mpj-blue); font-weight: 600; text-decoration: underline; text-underline-offset: 2px; }
.mpj-help__answerActions { margin: 10px 0 0 !important; }

/* Feedback */
.mpj-help__fb { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--mpj-line); font-size: 13px; color: var(--mpj-muted); }
html body.mpj-ui .mpj-help button.mpj-help__fbBtn {
  height: 30px; margin: 0; padding: 0 14px; border: 1px solid var(--mpj-line-strong) !important; border-radius: 999px;
  background: var(--mpj-surface) !important; color: var(--mpj-navy) !important; font: 600 13px var(--mpj-sans); cursor: pointer; box-shadow: none;
}
html body.mpj-ui .mpj-help button.mpj-help__fbBtn:hover { border-color: var(--mpj-blue) !important; color: var(--mpj-blue) !important; }
.mpj-help__fbDone { color: var(--mpj-success); font-weight: 600; }

/* Topics */
.mpj-help__topics { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 12px; }
html body.mpj-ui .mpj-help button.mpj-help__topic {
  display: flex; align-items: center; gap: 12px; width: 100%; min-height: 70px; margin: 0; padding: 14px 16px; text-align: left;
  border: 1px solid var(--mpj-line) !important; border-radius: 14px; background: var(--mpj-surface) !important; color: var(--mpj-text) !important;
  box-shadow: 0 1px 2px rgba(15,33,66,.04); cursor: pointer; transition: border-color .15s, transform .15s, box-shadow .15s;
}
html body.mpj-ui .mpj-help button.mpj-help__topic:hover { border-color: var(--mpj-blue-line) !important; transform: translateY(-1px); box-shadow: var(--mpj-shadow-md, 0 4px 14px rgba(15,33,66,.06)); }
.mpj-help__topicText { display: grid; gap: 2px; min-width: 0; }
.mpj-help__topicText strong { font-size: 15px; font-weight: 600; color: var(--mpj-navy); line-height: 1.3; }
.mpj-help__topicText span { font-size: 12px; color: var(--mpj-muted); }

/* Panels (results, topic view, escalation, contact) */
.mpj-help__panel { display: grid; gap: 14px; padding: 24px; background: var(--mpj-surface); border: 1px solid var(--mpj-line); border-radius: 16px; box-shadow: var(--mpj-shadow-md, 0 4px 14px rgba(15,33,66,.06)); outline: none; }
.mpj-help__list { display: grid; gap: 10px; }
.mpj-help__panel .mpj-help__qa { box-shadow: none; }
.mpj-help__topicHead, .mpj-help__contactHead { display: flex; align-items: center; gap: 12px; }
.mpj-help__contactHead { align-items: flex-start; }
html body.mpj-ui .mpj-help button.mpj-help__back {
  justify-self: start; margin: 0; padding: 4px 0; border: 0; background: transparent !important; color: var(--mpj-blue) !important;
  font: 600 14px var(--mpj-sans); cursor: pointer; box-shadow: none;
}
html body.mpj-ui .mpj-help button.mpj-help__back:hover { text-decoration: underline; }
.mpj-help__resultTopic { flex: 0 0 auto; padding: 3px 9px; border-radius: 999px; background: var(--mpj-sunken); color: var(--mpj-muted); font-size: 11px; font-weight: 600; white-space: nowrap; }
.mpj-help__resultTopic + .mpj-help__chev { margin-left: 0; }
.mpj-help [data-help-home] { display: grid; gap: 28px; }
.mpj-help__more { margin-top: 8px; }
.mpj-help__chips { display: flex; flex-wrap: wrap; gap: 8px; }
html body.mpj-ui .mpj-help button.mpj-help__chip {
  height: 36px; margin: 0; padding: 0 14px; border: 1px solid var(--mpj-line-strong) !important; border-radius: 999px;
  background: var(--mpj-surface) !important; color: var(--mpj-navy) !important; font: 600 13px var(--mpj-sans); cursor: pointer; box-shadow: none;
}
html body.mpj-ui .mpj-help button.mpj-help__chip:hover { border-color: var(--mpj-blue) !important; background: var(--mpj-blue-soft) !important; }
.mpj-help__escalate { border-color: var(--mpj-blue-line); }
.mpj-help__escActions { display: flex; flex-wrap: wrap; gap: 10px; padding-top: 6px; border-top: 1px solid var(--mpj-line); margin-top: 4px; padding-top: 16px; }

/* Buttons inside support (beat the legacy `button { background: inherit !important }`) */
html body.mpj-ui .mpj-help .mpj-btn--primary { background: var(--mpj-blue) !important; border-color: var(--mpj-blue) !important; color: #fff !important; }
html body.mpj-ui .mpj-help .mpj-btn--primary:hover { background: var(--mpj-blue-hover) !important; }
html body.mpj-ui .mpj-help .mpj-btn--secondary { background: var(--mpj-surface) !important; border-color: var(--mpj-line-strong) !important; color: var(--mpj-navy) !important; }
html body.mpj-ui .mpj-help .mpj-btn--secondary:hover { border-color: var(--mpj-blue) !important; }
html body.mpj-ui .mpj-help .mpj-btn--ghost { background: transparent !important; color: var(--mpj-navy) !important; }
html body.mpj-ui .mpj-help .mpj-btn--ghost:hover { background: var(--mpj-sunken) !important; }
html body.mpj-ui .mpj-help .mpj-btn svg { width: 16px; height: 16px; }

/* Contact form */
.mpj-help__form { display: grid; gap: 18px; max-width: 640px; }
.mpj-help__field { display: grid; gap: 6px; }
.mpj-help__field label { font-size: 14px; font-weight: 600; color: var(--mpj-navy); }
html body.mpj-ui .mpj-help__input {
  display: block; width: 100%; margin: 0; padding: 11px 14px; min-height: 46px;
  border: 1px solid var(--mpj-line-strong); border-radius: 10px; background: var(--mpj-surface); color: var(--mpj-text);
  font: 400 15px/1.5 var(--mpj-sans); box-shadow: inset 0 1px 1px rgba(15,33,66,.04);
}
html body.mpj-ui textarea.mpj-help__input { min-height: 150px; resize: vertical; }
html body.mpj-ui .mpj-help__input:focus { outline: none; border-color: var(--mpj-blue); box-shadow: var(--mpj-focus); }
.mpj-help__hint { margin: 2px 0 0; font-size: 13px; color: var(--mpj-muted); }
.mpj-help__attach { display: flex; gap: 8px; align-items: flex-start; margin: 0; padding: 12px 14px; border-radius: 10px; background: var(--mpj-sunken); font-size: 13px; color: var(--mpj-muted); }
.mpj-help__attach svg { flex: 0 0 16px; margin-top: 2px; color: var(--mpj-blue); }
.mpj-help__formActions { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.mpj-help__form [data-support-status] { margin: 0 !important; }
.mpj-help__sent { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 24px 0 8px; text-align: center; }
.mpj-help__sentIcon { width: 56px; height: 56px; margin-bottom: 6px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; background: var(--mpj-success-bg); color: var(--mpj-success); }

/* More help */
.mpj-help__more { display: grid; gap: 10px; padding-top: 6px; }
.mpj-help__moreItem summary > span:nth-child(2) { flex: 1; min-width: 0; display: grid; gap: 2px; }
.mpj-help__moreItem summary strong { font-size: 15px; font-weight: 600; color: var(--mpj-navy); }
.mpj-help__moreItem summary small { font-size: 13px; color: var(--mpj-muted); }
.mpj-help__moreItem .mpj-help__fixIcon { flex-basis: 34px; width: 34px; height: 34px; background: var(--mpj-sunken); color: var(--mpj-muted); }
.mpj-help__moreBody { padding: 4px 18px 18px; display: grid; gap: 12px; }
.mpj-help__moreBody .tw-pill { margin-left: 4px; }

@media (max-width: 760px) {
  .mpj-help__hero { padding: 24px 18px; border-radius: 16px; }
  html body.mpj-ui .mpj-help__title { font-size: 25px; }
  .mpj-help__fixes { grid-template-columns: 1fr; }
  .mpj-help__topics { grid-template-columns: 1fr 1fr; gap: 10px; }
  html body.mpj-ui .mpj-help button.mpj-help__topic { flex-direction: column; align-items: flex-start; min-height: 0; }
  .mpj-help__answer { padding-left: 18px; }
  .mpj-help__panel { padding: 18px 16px; }
  .mpj-help__formActions .mpj-btn--lg { flex: 1; }
}

html body.mpj-ui .mpj-help__panel:focus { outline: none !important; }
/* Screen-reader-only text (some themes don't define it) */
html body.mpj-ui .screen-reader-text { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* =====================================================================
 * Lesson audio: one player (listen.js). The old tutor card, the duplicate
 * "Audio lecture" card, the floating banner and the old bottom player are
 * hidden; the engine keeps running underneath.
 * ===================================================================== */
html.mpj-has-listen body.mpj-ui .medexp-playlist[data-medexp-playlist] { position: absolute !important; width: 1px !important; height: 1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; margin: 0 !important; padding: 0 !important; border: 0 !important; }
html.mpj-has-listen body.mpj-ui .medexp-narrating-banner,
html.mpj-has-listen body.mpj-ui .medexp-audio-section,
html.mpj-has-listen body.mpj-ui #mxp-mini-player { display: none !important; }

html body.mpj-ui .mpj-ls {
  margin: 4px 0 28px; padding: 16px 18px 14px; border-radius: 16px;
  background: #fff; border: 1px solid var(--mpj-line, #e3e8ef);
  box-shadow: 0 1px 2px rgba(16,24,40,.04), 0 8px 24px -12px rgba(16,24,40,.12);
  font-family: var(--mpj-sans); color: var(--mpj-text);
}
html body.mpj-ui .mpj-ls * { box-sizing: border-box; }
html body.mpj-ui .mpj-ls p { margin: 0 !important; }
html body.mpj-ui .mpj-ls__top { display: flex; align-items: center; gap: 16px; }
html body.mpj-ui .mpj-ls__ctrls { display: flex; align-items: center; gap: 4px; flex: none; order: 0; }
html body.mpj-ui .mpj-ls__info { flex: 1; min-width: 0; }
html body.mpj-ui .mpj-ls__tools { display: flex; align-items: center; gap: 6px; flex: none; }
html body.mpj-ui .mpj-ls__eyebrow { display: flex; align-items: center; gap: 6px; font-size: 11.5px !important; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--mpj-blue) !important; }
html body.mpj-ui .mpj-ls__title { font-size: 15.5px !important; font-weight: 650; line-height: 1.3 !important; margin-top: 3px !important; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: var(--mpj-text) !important; }
html body.mpj-ui .mpj-ls__meta { font-size: 13px !important; color: var(--mpj-muted) !important; margin-top: 2px !important; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

html body.mpj-ui .mpj-ls button { font-family: inherit; cursor: pointer; -webkit-tap-highlight-color: transparent; }
html body.mpj-ui .mpj-ls__btn {
  width: 38px; height: 38px; border-radius: 10px; border: 0 !important; padding: 0 !important;
  display: inline-flex; align-items: center; justify-content: center;
  background: transparent !important; color: var(--mpj-text) !important; transition: background .15s, color .15s;
}
html body.mpj-ui .mpj-ls__btn:hover, html body.mpj-ui .mpj-ls__btn.is-on { background: var(--mpj-blue-soft) !important; color: var(--mpj-blue) !important; }
html body.mpj-ui .mpj-ls__play {
  width: 52px; height: 52px; border-radius: 50% !important; border: 0 !important; padding: 0 !important; margin: 0 4px;
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--mpj-blue) !important; color: #fff !important;
  box-shadow: 0 6px 16px -6px var(--mpj-blue); transition: transform .12s, background .15s;
}
html body.mpj-ui .mpj-ls__play:hover { background: var(--mpj-blue-hover) !important; transform: scale(1.04); }
html body.mpj-ui .mpj-ls__play:active { transform: scale(.96); }
html body.mpj-ui .mpj-ls__play--sm { width: 42px; height: 42px; margin: 0; }
html body.mpj-ui .mpj-ls__speed {
  min-width: 48px; height: 32px; padding: 0 10px !important; border-radius: 999px !important;
  border: 1px solid var(--mpj-line, #e3e8ef) !important; background: #fff !important; color: var(--mpj-text) !important;
  font-size: 13px; font-weight: 700; font-variant-numeric: tabular-nums;
}
html body.mpj-ui .mpj-ls__speed:hover { border-color: var(--mpj-blue) !important; color: var(--mpj-blue) !important; }
html body.mpj-ui .mpj-ls :focus-visible { outline: none; box-shadow: var(--mpj-focus) !important; }

html body.mpj-ui .mpj-ls__bar { display: flex; gap: 3px; height: 8px; margin-top: 14px; cursor: pointer; padding: 0; border-radius: 4px; }
html body.mpj-ui .mpj-ls__seg { position: relative; flex-basis: 0; min-width: 4px; height: 100%; border-radius: 3px; background: var(--mpj-blue-soft); overflow: hidden; transition: transform .15s; }
html body.mpj-ui .mpj-ls__bar:hover .mpj-ls__seg { transform: scaleY(1.35); }
html body.mpj-ui .mpj-ls__segFill { position: absolute; inset: 0 auto 0 0; width: 0; background: var(--mpj-blue); border-radius: inherit; transition: width .25s linear; }
html body.mpj-ui .mpj-ls__times { display: flex; justify-content: space-between; margin-top: 7px; font-size: 12.5px; color: var(--mpj-muted); font-variant-numeric: tabular-nums; }

html body.mpj-ui .mpj-ls__list { list-style: none !important; margin: 12px 0 0 !important; padding: 8px 0 0 !important; border-top: 1px solid var(--mpj-line, #e3e8ef); max-height: 340px; overflow-y: auto; }
html body.mpj-ui .mpj-ls__list[hidden] { display: none !important; }
html body.mpj-ui .mpj-ls__times[hidden] { display: none !important; }
html body.mpj-ui .mpj-ls__item { margin: 0 !important; padding: 0 !important; }
html body.mpj-ui .mpj-ls__item::before, html body.mpj-ui .mpj-ls__item::marker { content: none !important; }
html body.mpj-ui .mpj-ls__itemBtn {
  width: 100%; display: flex; align-items: center; gap: 12px; padding: 9px 10px !important; border: 0 !important; border-radius: 10px;
  background: transparent !important; color: var(--mpj-text) !important; text-align: left; font-size: 14px; line-height: 1.35;
}
html body.mpj-ui .mpj-ls__itemBtn:hover { background: #f4f7fa !important; }
html body.mpj-ui .mpj-ls__itemBtn:disabled { opacity: .45; cursor: default; }
html body.mpj-ui .mpj-ls__num { flex: none; width: 24px; height: 24px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-size: 12px; font-weight: 700; background: #eef2f6; color: var(--mpj-muted); }
html body.mpj-ui .mpj-ls__itemLabel { flex: 1; min-width: 0; }
html body.mpj-ui .mpj-ls__dur { flex: none; font-size: 12.5px; color: var(--mpj-muted); font-variant-numeric: tabular-nums; }
html body.mpj-ui .mpj-ls__item.is-done .mpj-ls__num { background: var(--mpj-blue-soft); color: var(--mpj-blue); }
html body.mpj-ui .mpj-ls__item.is-active .mpj-ls__itemBtn { background: var(--mpj-blue-soft) !important; color: var(--mpj-blue) !important; font-weight: 650; }
html body.mpj-ui .mpj-ls__item.is-active .mpj-ls__num { background: var(--mpj-blue); color: #fff; }
html body.mpj-ui .mpj-ls__eq { display: none; align-items: flex-end; gap: 2px; height: 14px; flex: none; }
html body.mpj-ui .mpj-ls__eq i { width: 3px; height: 100%; background: var(--mpj-blue); border-radius: 1px; animation: mpj-ls-eq 1s ease-in-out infinite; }
html body.mpj-ui .mpj-ls__eq i:nth-child(2) { animation-delay: .2s; }
html body.mpj-ui .mpj-ls__eq i:nth-child(3) { animation-delay: .4s; }
html body.mpj-ui .mpj-ls__item.is-playing .mpj-ls__eq { display: inline-flex; }
@keyframes mpj-ls-eq { 0%, 100% { transform: scaleY(.35); } 50% { transform: scaleY(1); } }

/* Docked mini player */
html body.mpj-ui .mpj-ls-dock {
  position: fixed; left: 50%; bottom: 16px; z-index: 9990; width: min(720px, calc(100vw - 24px));
  display: flex; align-items: center; gap: 6px; padding: 8px 10px 12px 8px; border-radius: 16px;
  background: var(--mpj-navy); color: #fff; box-shadow: 0 18px 40px -12px rgba(10,20,40,.45);
  transform: translate(-50%, 140%); opacity: 0; pointer-events: none; transition: transform .3s cubic-bezier(.2,.7,.2,1), opacity .2s;
  font-family: var(--mpj-sans); overflow: hidden;
}
html body.mpj-ui .mpj-ls-dock.is-on { transform: translate(-50%, 0); opacity: 1; pointer-events: auto; }
html body.mpj-ui .mpj-ls-dock button { font-family: inherit; cursor: pointer; }
html body.mpj-ui .mpj-ls-dock .mpj-ls__play { background: #fff !important; color: var(--mpj-navy) !important; box-shadow: none; }
html body.mpj-ui.mpj-site-medexprep .mpj-ls-dock .mpj-ls__play { background: var(--mpj-teal-bright) !important; color: var(--mpj-navy-2) !important; }
html body.mpj-ui .mpj-ls-dock .mpj-ls__btn { color: rgba(255,255,255,.85) !important; width: 36px; height: 36px; display: inline-flex; align-items: center; justify-content: center; border: 0 !important; padding: 0 !important; border-radius: 10px; background: transparent !important; }
html body.mpj-ui .mpj-ls-dock .mpj-ls__btn:hover { background: rgba(255,255,255,.12) !important; color: #fff !important; }
html body.mpj-ui .mpj-ls-dock .mpj-ls__speed { background: transparent !important; border-color: rgba(255,255,255,.3) !important; color: #fff !important; min-width: 44px; height: 30px; padding: 0 8px !important; border-radius: 999px !important; border: 1px solid; font-weight: 700; font-size: 12.5px; }
html body.mpj-ui .mpj-ls-dock__info { flex: 1; min-width: 0; display: flex; flex-direction: column; align-items: flex-start; gap: 1px; padding: 2px 8px !important; border: 0 !important; background: transparent !important; color: #fff !important; text-align: left; }
html body.mpj-ui .mpj-ls-dock__title { max-width: 100%; font-size: 14px; font-weight: 650; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
html body.mpj-ui .mpj-ls-dock__meta { font-size: 12px; opacity: .72; font-variant-numeric: tabular-nums; }
html body.mpj-ui .mpj-ls-dock__bar { position: absolute; left: 0; right: 0; bottom: 0; height: 3px; background: rgba(255,255,255,.14); }
html body.mpj-ui .mpj-ls-dock__bar span { display: block; height: 100%; width: 0; background: var(--mpj-teal-bright, #7cc4ff); transition: width .25s linear; }
html.mpj-ls-docked body.mpj-ui { padding-bottom: 84px; }
html.mpj-ls-docked body.mpj-ui .mochi-drawer-launcher,
html.mpj-ls-docked body.mpj-ui [class*="mochi"][class*="fab"] { bottom: 96px !important; }

/* Calmer "now reading" highlight in the lesson text */
html.mpj-has-listen body.mpj-ui .medexp-block-active {
  outline: 0 !important; animation: none !important; padding: inherit; background: transparent;
  box-shadow: -4px 0 0 0 var(--mpj-blue) !important; border-radius: 0 !important;
  background: linear-gradient(90deg, var(--mpj-blue-soft), transparent 70%) !important;
  scroll-margin-top: 120px;
}

html.mpj-has-listen body.mpj-ui .medexp-block-active::before,
html.mpj-has-listen body.mpj-ui .medexp-block-active::after,
html.mpj-has-listen body.mpj-ui .medexp-section-card.is-narrating::before { content: none !important; display: none !important; }
html.mpj-has-listen body.mpj-ui .medexp-section-card.is-narrating { animation: none !important; box-shadow: 0 0 0 2px var(--mpj-blue-line), 0 10px 30px -14px rgba(16,24,40,.2) !important; }
html.mpj-has-listen body.mpj-ui .medexp-section-toc li.is-narrating { color: var(--mpj-blue) !important; }
html.mpj-has-listen body.mpj-ui .medexp-section-toc li.is-narrating::before { border-left-color: var(--mpj-blue) !important; animation: none !important; }
html.mpj-has-listen body.mpj-ui .medexp-tp-section-play {
  background: transparent !important; color: var(--mpj-blue) !important; border: 1px solid var(--mpj-blue-line) !important;
  font-size: 11.5px !important; padding: 4px 10px 4px 8px !important; animation: none !important; box-shadow: none !important; transform: none !important;
}
html.mpj-has-listen body.mpj-ui .medexp-tp-section-play:hover,
html.mpj-has-listen body.mpj-ui .medexp-tp-section-play.is-active { background: var(--mpj-blue) !important; color: #fff !important; border-color: var(--mpj-blue) !important; }

@media (max-width: 640px) {
  html body.mpj-ui .mpj-ls { padding: 14px 14px 12px; border-radius: 14px; margin-bottom: 20px; }
  html body.mpj-ui .mpj-ls__top { flex-wrap: wrap; gap: 10px; }
  html body.mpj-ui .mpj-ls__info { order: -1; flex-basis: calc(100% - 110px); }
  html body.mpj-ui .mpj-ls__tools { order: -1; }
  html body.mpj-ui .mpj-ls__ctrls { width: 100%; justify-content: center; gap: 10px; }
  html body.mpj-ui .mpj-ls__hideSm { display: inline-flex; }
  html body.mpj-ui .mpj-ls-dock { bottom: 10px; gap: 2px; }
  html body.mpj-ui .mpj-ls-dock .mpj-ls__hideSm, html body.mpj-ui .mpj-ls-dock .mpj-ls__speed { display: none !important; }
}
@media (prefers-reduced-motion: reduce) {
  html body.mpj-ui .mpj-ls__eq i, html body.mpj-ui .mpj-ls-dock { animation: none !important; transition: none !important; }
}
/* Old per-section pills and highlights replaced by listen.js chips */
html.mpj-has-listen body.mpj-ui .mxp-play-pill,
html.mpj-has-listen body.mpj-ui .medexp-tp-section-play { display: none !important; }
html.mpj-has-listen body.mpj-ui .mxp-now-playing:not(.medexp-block-active) { outline: 0 !important; animation: none !important; }
html.mpj-has-listen body.mpj-ui .mxp-now-playing::before,
html.mpj-has-listen body.mpj-ui .mxp-now-playing::after { content: none !important; display: none !important; }
html body.mpj-ui .mpj-ls-host { position: relative !important; }
html body.mpj-ui .mpj-ls-chip {
  position: absolute; top: 14px; right: 14px; z-index: 2;
  display: inline-flex; align-items: center; gap: 6px; height: 28px; padding: 0 11px 0 9px !important;
  border-radius: 999px !important; border: 1px solid var(--mpj-blue-line) !important;
  background: #fff !important; color: var(--mpj-blue) !important; cursor: pointer;
  font: 600 12px/1 var(--mpj-sans) !important; letter-spacing: 0 !important; text-transform: none !important;
  opacity: .8; transition: opacity .15s, background .15s, color .15s;
}
html body.mpj-ui .mpj-ls-chip em { font-style: normal; font-weight: 500; color: var(--mpj-muted); font-variant-numeric: tabular-nums; }
html body.mpj-ui .mpj-ls-chip.is-inline { position: static; margin-left: 10px; vertical-align: middle; }
html body.mpj-ui .mpj-ls-host:hover > .mpj-ls-chip, html body.mpj-ui .mpj-ls-chip:hover, html body.mpj-ui .mpj-ls-chip:focus-visible { opacity: 1; }
html body.mpj-ui .mpj-ls-chip:hover { border-color: var(--mpj-blue) !important; }
html body.mpj-ui .mpj-ls-chip.is-active { opacity: 1; background: var(--mpj-blue) !important; color: #fff !important; border-color: var(--mpj-blue) !important; }
@media (max-width: 640px) { html body.mpj-ui .mpj-ls-chip { top: 10px; right: 10px; } html body.mpj-ui .mpj-ls-chip em { display: none; } }
/* Quiz answer choices in lessons: letter badges (A, B, C, D) */
html body.mpj-ui .medexp-lesson__content ol[type="A"] > li,
html body.mpj-ui .medexp-lesson__content ol.medexp-quizChoices > li { padding-left: 2.4rem !important; margin: 0 0 8px !important; min-height: 26px; display: flex; align-items: center; }
html body.mpj-ui .medexp-lesson__content ol[type="A"] > li::before,
html body.mpj-ui .medexp-lesson__content ol.medexp-quizChoices > li::before {
  content: counter(medexp-ol, upper-alpha) !important; top: 50%; transform: translateY(-50%);
  width: 26px; height: 26px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center;
  background: var(--mpj-blue-soft); color: var(--mpj-blue) !important; font-size: 12.5px !important; font-weight: 700;
}
html body.mpj-ui .medexp-lesson__content li ol[type="A"] > li::before,
html body.mpj-ui .medexp-lesson__content li ol.medexp-quizChoices > li::before { content: counter(medexp-ol-nested, upper-alpha) !important; }
/* Support: clearer feedback after Yes / No */
html body.mpj-ui .mpj-help__fbDone { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border-radius: 999px; background: #e8f6ee; color: #137a45 !important; font-weight: 650; font-size: 13.5px; }
html body.mpj-ui .mpj-help__fbNo { display: inline-flex; align-items: center; padding: 6px 12px; border-radius: 999px; background: var(--mpj-blue-soft); color: var(--mpj-blue) !important; font-weight: 600; font-size: 13.5px; }
html body.mpj-ui .mpj-help .is-flash { animation: mpj-help-flash 1.2s ease-out 1; }
@keyframes mpj-help-flash { 0% { box-shadow: 0 0 0 0 rgba(26,79,156,0), 0 0 0 0 transparent; } 25% { box-shadow: 0 0 0 4px var(--mpj-blue-line); } 100% { box-shadow: 0 0 0 0 rgba(26,79,156,0); } }

/* =====================================================================
 * Phone fixes (audit, Oct 2026)
 * ===================================================================== */
@media (max-width: 859px) {
  /* Lesson: the hidden outline rail kept a 90px column, which cut the lesson off on phones */
  html body.mpj-ui .medexp-lessonWorkspace { grid-template-columns: minmax(0, 1fr) !important; }
  html body.mpj-ui .medexp-lessonWorkspace > .medexp-lessonStage { grid-column: 1 / -1 !important; min-width: 0 !important; }
  html body.mpj-ui .medexp-main { grid-template-columns: minmax(0, 1fr) !important; min-width: 0 !important; }
  html body.mpj-ui .medexp-lessonScroll, html body.mpj-ui .medexp-lessonStage { min-width: 0 !important; max-width: 100% !important; }
  /* Lesson mode tabs on one swipeable row; toolbar scrolls sideways instead of being cut */
  html body.mpj-ui .medexp-lessonTabsRow__left { min-width: 0 !important; flex: 1 1 auto !important; }
  html body.mpj-ui .medexp-lessonModes { flex-wrap: nowrap !important; overflow-x: auto !important; scrollbar-width: none; gap: 6px !important; }
  html body.mpj-ui .medexp-lessonModes::-webkit-scrollbar { display: none; }
  html body.mpj-ui .medexp-lessonMode { flex: none !important; white-space: nowrap !important; }
  html body.mpj-ui .medexp-lessonToolbar { max-width: 100% !important; overflow-x: auto !important; flex-wrap: nowrap !important; scrollbar-width: none; }
  html body.mpj-ui .medexp-lessonToolbar::-webkit-scrollbar { display: none; }
  html body.mpj-ui .medexp-lessonToolbar > * { flex: none !important; }
}
@media (max-width: 640px) {
  /* Course switcher: share the top bar instead of being pushed off screen */
  html body.mpj-ui .tw-topbar__inner { gap: 8px !important; }
  html body.mpj-ui .tw-courseTopSwitch { order: 2 !important; flex: 1 1 auto !important; min-width: 0 !important; }
  html body.mpj-ui .tw-topbarActions { order: 3 !important; flex: none !important; }
  html body.mpj-ui .tw-courseDropdown { min-width: 0 !important; width: 100% !important; }
  html body.mpj-ui .tw-courseDropdown__btn { min-width: 0 !important; width: 100% !important; max-width: 100% !important; }
  html body.mpj-ui .tw-courseDropdown__text { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  html body.mpj-ui .tw-topbarActions .display-name { display: none !important; }
  /* Practice: filter chips and stats swipe sideways */
  html body.mpj-ui .medexp-ql-filters { max-width: 100% !important; overflow-x: auto !important; flex-wrap: nowrap !important; scrollbar-width: none; }
  html body.mpj-ui .medexp-ql-filters > * { flex: none !important; }
  html body.mpj-ui .medexp-ql-header__stats { max-width: 100% !important; overflow-x: auto !important; scrollbar-width: none; }
  html body.mpj-ui .medexp-ql-header__stats::-webkit-scrollbar { display: none; }
  html body.mpj-ui .medexp-ql-statPill { flex: none !important; }
  /* Dashboard panels and support reports never wider than the screen */
  html body.mpj-ui .mpj-panel, html body.mpj-ui .medexp-myReports { max-width: 100% !important; min-width: 0 !important; box-sizing: border-box !important; }
  html body.mpj-ui .medexp-myReports { overflow-x: auto !important; }
}
/* Video lesson thumbnails: the play icon had a stray square outline */
html body.mpj-ui .mxpvl-play { border: 0 !important; background: none !important; box-shadow: none !important; }
/* Credentials tab: the page header already says this */
html body.mpj-ui .mpj-tab-head ~ * .medexp-ucm-dashtab__header,
html body.mpj-ui .medexp-ucm-dashtab__header { display: none !important; }

/* ---- Empty states (Notebook, Billing) ---- */
html body.mpj-ui .mpj-empty { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 8px; padding: 40px 24px !important; border: 1px dashed var(--mpj-line) !important; border-radius: 16px !important; background: linear-gradient(180deg, #fff, var(--mpj-sunken, #f6f8fb)) !important; }
html body.mpj-ui .mpj-empty__icon { width: 56px; height: 56px; border-radius: 16px; display: inline-flex; align-items: center; justify-content: center; background: var(--mpj-blue-soft); color: var(--mpj-blue); margin-bottom: 6px; }
html body.mpj-ui .mpj-empty__title { margin: 0 !important; font-size: 17px !important; font-weight: 700 !important; color: var(--mpj-navy) !important; }
html body.mpj-ui .mpj-empty__body { margin: 0 !important; max-width: 460px; font-size: 14px !important; line-height: 1.55 !important; color: var(--mpj-muted) !important; }
html body.mpj-ui .mpj-empty__actions { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; margin-top: 10px; }

/* ---- CAT simulation intro ---- */
html body.mpj-ui .mpj-cat__hero { display: grid; grid-template-columns: minmax(0, 1fr) 280px; gap: 24px; align-items: center; padding: 28px; border-radius: 18px; background: var(--mpj-ink, linear-gradient(135deg, #10254a 0%, #17386e 55%, #1a4f9c 100%)) !important; color: #fff; margin-bottom: 18px; }
html body.mpj-ui .mpj-cat__hero p { margin: 0; }
html body.mpj-ui .mpj-cat__kicker { font-size: 12px !important; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--mpj-teal-bright, #8fd3ff) !important; }
html body.mpj-ui .mpj-cat__title { margin: 6px 0 8px !important; font-size: 26px !important; line-height: 1.2 !important; color: #fff !important; }
html body.mpj-ui .mpj-cat__lede { max-width: 560px; font-size: 15px; line-height: 1.55; color: rgba(255,255,255,.82) !important; }
html body.mpj-ui .mpj-cat__facts { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; }
html body.mpj-ui .mpj-cat__fact { padding: 6px 12px; border-radius: 999px; background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.18); font-size: 13px; font-weight: 600; color: #fff; }
html body.mpj-ui .mpj-cat__startBox { display: flex; flex-direction: column; gap: 6px; padding: 18px; border-radius: 14px; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.16); }
html body.mpj-ui .mpj-cat__courseLbl { font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: rgba(255,255,255,.6) !important; }
html body.mpj-ui .mpj-cat__course { font-size: 15px; font-weight: 650; color: #fff !important; margin-bottom: 8px !important; }
html body.mpj-ui .mpj-cat__go { width: 100%; height: 46px; justify-content: center; font-size: 15px !important; background: #fff !important; color: var(--mpj-navy) !important; border: 0 !important; }
html body.mpj-ui.mpj-site-medexprep .mpj-cat__go { background: var(--mpj-teal-bright) !important; color: var(--mpj-navy-2) !important; }
html body.mpj-ui .mpj-cat__go:hover { filter: brightness(.96); }
html body.mpj-ui .mpj-cat__tip { font-size: 12.5px; color: rgba(255,255,255,.65) !important; text-align: center; margin-top: 4px !important; }
html body.mpj-ui .mpj-cat__how { padding: 24px; border-radius: 16px; background: #fff; border: 1px solid var(--mpj-line); }
html body.mpj-ui .mpj-cat__howTitle { margin: 0 0 4px !important; font-size: 18px !important; color: var(--mpj-navy) !important; }
html body.mpj-ui .mpj-cat__howLede { margin: 0 0 16px !important; font-size: 14px; color: var(--mpj-muted) !important; }
html body.mpj-ui .mpj-cat__steps { list-style: none !important; margin: 0 !important; padding: 0 !important; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
html body.mpj-ui .mpj-cat__step { display: flex; gap: 12px; align-items: flex-start; padding: 14px; border-radius: 12px; background: var(--mpj-sunken, #f6f8fb); margin: 0 !important; }
html body.mpj-ui .mpj-cat__step::before, html body.mpj-ui .mpj-cat__step::marker { content: none !important; }
html body.mpj-ui .mpj-cat__num { flex: none; width: 28px; height: 28px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; background: var(--mpj-blue); color: #fff; font-size: 13px; font-weight: 700; }
html body.mpj-ui .mpj-cat__stepT { margin: 0 0 3px !important; font-size: 14.5px; font-weight: 650; color: var(--mpj-navy) !important; }
html body.mpj-ui .mpj-cat__stepB { margin: 0 !important; font-size: 13.5px; line-height: 1.5; color: var(--mpj-muted) !important; }
@media (max-width: 760px) {
  html body.mpj-ui .mpj-cat__hero { grid-template-columns: 1fr; padding: 22px; }
  html body.mpj-ui .mpj-cat__steps { grid-template-columns: 1fr; }
}

/* =====================================================================
 * Lesson header (lesson-header.js adds .medexp-lessonSubheader and the outline toggle).
 * Row 1: outline toggle · course + title · lesson navigation
 * Row 2: Lessons / Practice / Flashcards switch · reading tools
 * Row 3: reading progress line
 * ===================================================================== */
html body.mpj-ui .medexp-lessonSubheader {
  display: grid !important;
  grid-template-columns: minmax(40px, auto) minmax(0, 1fr) auto;
  grid-template-areas: "toggle head nav" "modes modes tools" "prog prog prog";
  align-items: center;
  column-gap: 14px; row-gap: 12px;
  padding: 14px clamp(16px, 2.4vw, 32px) 0 !important;
  background: rgba(255,255,255,.96) !important;
  backdrop-filter: saturate(1.2) blur(8px);
  border-bottom: 1px solid var(--mpj-line, #e3e8ef) !important;
  box-shadow: 0 1px 0 rgba(16,24,40,.02), 0 8px 20px -18px rgba(16,24,40,.25);
  position: relative; z-index: 20;
}
html body.mpj-ui .medexp-lessonSubheader .medexp-lessonTabsRow,
html body.mpj-ui .medexp-lessonSubheader .medexp-pageheader { display: contents !important; }
html body.mpj-ui .medexp-lessonSubheader .medexp-lessonTabsRow__left { grid-area: modes; min-width: 0; margin: 0 !important; padding: 0 !important; }
html body.mpj-ui .medexp-lessonSubheader .medexp-lessonTabsRow__right { grid-area: nav; display: flex !important; align-items: center; gap: 8px; margin: 0 !important; padding: 0 !important; }
html body.mpj-ui .medexp-lessonSubheader .medexp-pageheader__left { grid-area: head; min-width: 0; margin: 0 !important; padding: 0 !important; display: flex; flex-direction: column; gap: 2px; }
html body.mpj-ui .medexp-lessonSubheader .medexp-pageheader__actions { grid-area: tools; min-width: 0; margin: 0 !important; padding: 0 !important; display: flex; justify-content: flex-end; }
html body.mpj-ui .medexp-lessonSubheader .medexp-lessonReadProgress { grid-area: prog; margin: 0 calc(-1 * clamp(16px, 2.4vw, 32px)) !important; padding: 0 !important; position: relative; height: 3px; display: block !important; }

/* Outline toggle */
html body.mpj-ui .mpj-lh-toggle {
  grid-area: toggle; align-self: center;
  display: inline-flex; align-items: center; gap: 8px; height: 40px; padding: 0 12px 0 10px !important;
  border: 1px solid var(--mpj-line, #e3e8ef) !important; border-radius: 12px !important;
  background: #fff !important; color: var(--mpj-navy) !important; cursor: pointer;
  font: 600 13.5px/1 var(--mpj-sans) !important; transition: background .15s, border-color .15s, color .15s;
}
html body.mpj-ui .mpj-lh-toggle:hover { border-color: var(--mpj-blue-line) !important; background: var(--mpj-blue-soft) !important; color: var(--mpj-blue) !important; }
html body.mpj-ui .mpj-lh-toggle .mpj-lh-chev { transition: transform .2s; transform-origin: 14px 12px; }
html body.mpj-ui .mpj-lh-toggle:not(.is-open) .mpj-lh-chev { transform: scaleX(-1); }
html body.mpj-ui .mpj-lh-toggle.is-open .mpj-lh-toggle__lbl { display: none; }
html body.mpj-ui .mpj-lh-toggle.is-open { padding: 0 !important; width: 40px; justify-content: center; }
html body.mpj-ui .mpj-lh-toggle:focus-visible, html body.mpj-ui .medexp-lessonSubheader button:focus-visible, html body.mpj-ui .medexp-lessonSubheader a:focus-visible { outline: none !important; box-shadow: var(--mpj-focus) !important; }

/* Course + title */
html body.mpj-ui .medexp-lessonSubheader .medexp-breadcrumbs { margin: 0 !important; font-size: 12.5px !important; line-height: 1.3 !important; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: var(--mpj-muted) !important; }
html body.mpj-ui .medexp-lessonSubheader .medexp-breadcrumbs a { color: var(--mpj-blue) !important; font-weight: 600; text-decoration: none !important; }
html body.mpj-ui .medexp-lessonSubheader .medexp-breadcrumbs a:hover { text-decoration: underline !important; }
html body.mpj-ui .medexp-lessonSubheader .medexp-breadcrumbs > :last-child { color: var(--mpj-faint) !important; }
html body.mpj-ui .medexp-lessonSubheader .medexp-title { margin: 0 !important; font-size: clamp(18px, 1.5vw, 22px) !important; line-height: 1.25 !important; font-weight: 700 !important; color: var(--mpj-navy) !important; letter-spacing: -.01em; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }

/* Lesson navigation buttons */
html body.mpj-ui .medexp-lessonSubheader .medexp-lessonNavBtn {
  display: inline-flex !important; align-items: center; gap: 7px; height: 40px !important; padding: 0 14px !important; white-space: nowrap;
  border-radius: 12px !important; border: 1px solid var(--mpj-line, #e3e8ef) !important; background: #fff !important; color: var(--mpj-navy) !important;
  font: 600 14px/1 var(--mpj-sans) !important; box-shadow: none !important; text-decoration: none !important; transition: background .15s, border-color .15s, transform .1s;
}
html body.mpj-ui .medexp-lessonSubheader .medexp-lessonNavBtn:hover { border-color: var(--mpj-blue-line) !important; background: var(--mpj-blue-soft) !important; color: var(--mpj-blue) !important; }
html body.mpj-ui .medexp-lessonSubheader .medexp-lessonNavBtn:active { transform: translateY(1px); }
html body.mpj-ui .medexp-lessonSubheader .medexp-lessonNavBtn.mpj-lh-done { background: var(--mpj-blue) !important; border-color: var(--mpj-blue) !important; color: #fff !important; padding: 0 16px !important; box-shadow: 0 6px 16px -8px var(--mpj-blue) !important; }
html body.mpj-ui .medexp-lessonSubheader .medexp-lessonNavBtn.mpj-lh-done:hover { background: var(--mpj-blue-hover) !important; color: #fff !important; }
html body.mpj-ui .medexp-lessonSubheader .medexp-lessonNavBtn svg { width: 16px; height: 16px; flex: none; }

/* Lessons / Practice / Flashcards: one segmented switch */
html body.mpj-ui .medexp-lessonSubheader .medexp-lessonModes { display: inline-flex !important; flex-wrap: nowrap !important; gap: 2px !important; padding: 3px !important; margin: 0 !important; border-radius: 12px !important; background: var(--mpj-sunken, #f1f4f8) !important; border: 1px solid var(--mpj-line, #e3e8ef) !important; max-width: 100%; overflow-x: auto; scrollbar-width: none; }
html body.mpj-ui .medexp-lessonSubheader .medexp-lessonModes::-webkit-scrollbar { display: none; }
html body.mpj-ui .medexp-lessonSubheader .medexp-lessonMode { display: inline-flex !important; align-items: center; height: 32px !important; padding: 0 14px !important; border-radius: 9px !important; border: 0 !important; background: transparent !important; color: var(--mpj-muted) !important; font: 600 13.5px/1 var(--mpj-sans) !important; text-decoration: none !important; white-space: nowrap; box-shadow: none !important; transition: color .15s, background .15s; }
html body.mpj-ui .medexp-lessonSubheader .medexp-lessonMode:hover { color: var(--mpj-navy) !important; }
html body.mpj-ui .medexp-lessonSubheader .medexp-lessonMode.is-active { background: #fff !important; color: var(--mpj-blue) !important; box-shadow: 0 1px 2px rgba(16,24,40,.08), 0 0 0 1px var(--mpj-line, #e3e8ef) !important; }

/* Reading tools */
html body.mpj-ui .medexp-lessonSubheader .medexp-lessonToolbar { display: flex !important; align-items: center; gap: 2px !important; flex-wrap: nowrap !important; margin: 0 !important; padding: 0 !important; border: 0 !important; background: none !important; max-width: 100%; overflow-x: auto; scrollbar-width: none; }
html body.mpj-ui .medexp-lessonSubheader .medexp-lessonToolbar::-webkit-scrollbar { display: none; }
html body.mpj-ui .medexp-lessonSubheader .medexp-lessonToolbar > button, html body.mpj-ui .medexp-lessonSubheader .medexp-lessonToolbar > .medexp-hlWrap, html body.mpj-ui .medexp-lessonSubheader .medexp-lessonToolbar > div:not([style*="none"]) { flex: none; }
html body.mpj-ui .medexp-lessonSubheader .medexp-lessonToolbar > button { display: inline-flex; align-items: center; gap: 6px; height: 34px !important; padding: 0 10px !important; border-radius: 9px !important; border: 0 !important; background: transparent !important; color: var(--mpj-muted) !important; font: 600 13px/1 var(--mpj-sans) !important; box-shadow: none !important; }
html body.mpj-ui .medexp-lessonSubheader .medexp-lessonToolbar > button:hover { background: var(--mpj-sunken, #f1f4f8) !important; color: var(--mpj-navy) !important; }
html body.mpj-ui .medexp-lessonSubheader .medexp-lessonToolbar > button[aria-pressed="true"], html body.mpj-ui .medexp-lessonSubheader .medexp-lessonToolbar > button[aria-expanded="true"], html body.mpj-ui .medexp-lessonSubheader .medexp-lessonToolbar > button.is-active { background: var(--mpj-blue-soft) !important; color: var(--mpj-blue) !important; }
html body.mpj-ui .medexp-lessonSubheader .medexp-lessonToolbar > .medexp-railToggle { display: none !important; }
html body.mpj-ui .medexp-lessonSubheader .medexp-lessonToolbar svg { width: 17px; height: 17px; flex: none; }

/* Reading progress: a quiet line under the header */
html body.mpj-ui .medexp-lessonSubheader .medexp-appbar__progressBar { position: absolute !important; inset: 0 !important; height: 3px !important; margin: 0 !important; border-radius: 0 !important; background: transparent !important; overflow: hidden; }
html body.mpj-ui .medexp-lessonSubheader .medexp-appbar__progressBar > * { height: 100% !important; border-radius: 0 3px 3px 0 !important; background: var(--mpj-blue) !important; }
html body.mpj-ui .medexp-lessonSubheader .medexp-appbar__progressText { position: absolute !important; right: clamp(16px, 2.4vw, 32px); bottom: 8px; margin: 0 !important; font-size: 11.5px !important; font-weight: 600; color: var(--mpj-faint) !important; background: rgba(255,255,255,.9); padding: 1px 6px; border-radius: 6px; pointer-events: none; }

/* Outline sidebar: real collapse (the old toggle left an empty column) + edge handle */
@media (min-width: 860px) {
  html body.mpj-ui .medexp-lessonWorkspace { transition: grid-template-columns .25s ease; }
  html body.mpj-ui.medexp-lesson-rail-collapsed .medexp-lessonWorkspace { grid-template-columns: 0 minmax(0, 1fr) !important; }
  html body.mpj-ui.medexp-lesson-rail-collapsed .medexp-lessonRail { min-width: 0 !important; width: 0 !important; overflow: hidden !important; border: 0 !important; padding: 0 !important; }
  html body.mpj-ui .medexp-lessonRail { position: relative !important; }
  html body.mpj-ui .mpj-rail-handle {
    position: absolute; top: 50%; right: -1px; transform: translate(50%, -50%); z-index: 30;
    width: 24px; height: 48px; padding: 0 !important; border-radius: 12px !important;
    border: 1px solid var(--mpj-line, #e3e8ef) !important; background: #fff !important; color: var(--mpj-muted) !important;
    display: inline-flex; align-items: center; justify-content: center; cursor: pointer;
    box-shadow: 0 4px 12px -6px rgba(16,24,40,.25); opacity: 0; transition: opacity .15s, color .15s, background .15s;
  }
  html body.mpj-ui .medexp-lessonRail:hover .mpj-rail-handle, html body.mpj-ui .mpj-rail-handle:focus-visible { opacity: 1; }
  html body.mpj-ui .mpj-rail-handle:hover { background: var(--mpj-blue-soft) !important; color: var(--mpj-blue) !important; }
  html body.mpj-ui.medexp-lesson-rail-collapsed .mpj-rail-handle { display: none; }
}
@media (max-width: 859px) { html body.mpj-ui .mpj-rail-handle { display: none !important; } }

/* The header adapts to the space the lesson actually has (sidebar open or closed). */
html body.mpj-ui .medexp-lessonStage { container-type: inline-size; container-name: lesson; }
@container lesson (max-width: 1080px) {
  html body.mpj-ui .medexp-lessonSubheader .medexp-lessonToolbar > button > span > span:not([class]),
  html body.mpj-ui .medexp-lessonSubheader .medexp-lessonToolbar .mpj-lh-lbl { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; }
  html body.mpj-ui .medexp-lessonSubheader .medexp-lessonToolbar > button { padding: 0 9px !important; }
}
html body.mpj-ui .medexp-lessonSubheader .medexp-lessonNavBtn .medexp-lessonNavBtn__text { display: inline !important; position: static !important; width: auto !important; height: auto !important; clip: auto !important; font-size: inherit !important; }
html body.mpj-ui .medexp-lessonSubheader .medexp-lessonNavBtn .medexp-lessonNavBtn__icon { display: inline-flex !important; }
@container lesson (max-width: 900px) {
  html body.mpj-ui .medexp-lessonSubheader .medexp-lessonNavBtn:not(.mpj-lh-done) .medexp-lessonNavBtn__text { position: absolute !important; width: 1px !important; height: 1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; }
  html body.mpj-ui .medexp-lessonSubheader .medexp-lessonNavBtn:not(.mpj-lh-done) .mpj-lh-lbl { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0,0,0,0); }
  html body.mpj-ui .medexp-lessonSubheader .medexp-lessonNavBtn:not(.mpj-lh-done) { width: 40px; padding: 0 !important; justify-content: center; }
}
@container lesson (max-width: 760px) {
  html body.mpj-ui .medexp-lessonSubheader {
    grid-template-columns: minmax(40px, auto) minmax(0, 1fr) !important;
    grid-template-areas: "toggle head" "nav nav" "modes modes" "tools tools" "prog prog" !important;
    row-gap: 10px !important;
  }
  html body.mpj-ui .medexp-lessonSubheader .medexp-lessonTabsRow__right { width: 100%; }
  html body.mpj-ui .medexp-lessonSubheader .medexp-lessonNavBtn.mpj-lh-done { flex: 1; justify-content: center; }
  html body.mpj-ui .medexp-lessonSubheader .medexp-pageheader__actions { justify-content: flex-start !important; }
  html body.mpj-ui .medexp-lessonSubheader .medexp-lessonModes { width: 100%; box-sizing: border-box; }
  html body.mpj-ui .medexp-lessonSubheader .medexp-lessonMode { flex: 1; justify-content: center; }
  html body.mpj-ui .medexp-lessonSubheader .mpj-lh-toggle__lbl { display: none; }
  html body.mpj-ui .medexp-lessonSubheader .mpj-lh-toggle { width: 40px; padding: 0 !important; justify-content: center; }
  html body.mpj-ui .medexp-lessonSubheader .medexp-title { font-size: 18px !important; }
}
@media (prefers-reduced-motion: reduce) {
  html body.mpj-ui .medexp-lessonWorkspace, html body.mpj-ui .mpj-lh-toggle .mpj-lh-chev { transition: none !important; }
}
html body.mpj-ui .medexp-lessonSubheader .medexp-pageheader__actions { border: 0 !important; }
html body.mpj-ui .medexp-lessonSubheader .medexp-breadcrumbs { display: flex !important; flex-wrap: nowrap !important; align-items: center; gap: 6px; }
html body.mpj-ui .medexp-lessonSubheader .medexp-breadcrumbs > * { flex: none; }
html body.mpj-ui .medexp-lessonSubheader .medexp-breadcrumbs > a { min-width: 0; flex: 0 1 auto; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* The last crumb repeats the lesson title right below it */
html body.mpj-ui .medexp-lessonSubheader .medexp-breadcrumbs > span:last-child:not(:only-child),
html body.mpj-ui .medexp-lessonSubheader .medexp-breadcrumbs > .medexp-breadcrumbs__sep:nth-last-child(2) { display: none !important; }
html body.mpj-ui .medexp-lessonSubheader .medexp-appbar__progressText { display: none !important; }
/* One Search button with two choices */
html body.mpj-ui .medexp-lessonSubheader .medexp-lessonToolbar > .mpj-lh-hide { display: none !important; }
html body.mpj-ui .mpj-lh-search { position: relative; flex: none; }
html body.mpj-ui .mpj-lh-search__btn { display: inline-flex; align-items: center; gap: 6px; height: 34px; padding: 0 10px !important; border-radius: 9px !important; border: 0 !important; background: transparent !important; color: var(--mpj-muted) !important; font: 600 13px/1 var(--mpj-sans) !important; cursor: pointer; }
html body.mpj-ui .mpj-lh-search__btn:hover, html body.mpj-ui .mpj-lh-search__btn[aria-expanded="true"] { background: var(--mpj-sunken, #f1f4f8) !important; color: var(--mpj-navy) !important; }
html body.mpj-ui .mpj-lh-search__caret { opacity: .7; }
html body.mpj-ui .mpj-lh-search__menu { position: fixed; z-index: 1000; width: 300px; padding: 6px; background: #fff; border: 1px solid var(--mpj-line, #e3e8ef); border-radius: 14px; box-shadow: 0 18px 40px -16px rgba(16,24,40,.3); }
html body.mpj-ui .mpj-lh-search__menu[hidden] { display: none !important; }
html body.mpj-ui .mpj-lh-search__menu button { width: 100%; display: flex; align-items: flex-start; gap: 12px; padding: 10px 12px !important; border: 0 !important; border-radius: 10px !important; background: transparent !important; color: var(--mpj-navy) !important; text-align: left; cursor: pointer; font-family: var(--mpj-sans) !important; }
html body.mpj-ui .mpj-lh-search__menu button:hover, html body.mpj-ui .mpj-lh-search__menu button:focus-visible { background: var(--mpj-blue-soft) !important; outline: none; }
html body.mpj-ui .mpj-lh-search__menu button > svg { flex: none; margin-top: 1px; color: var(--mpj-blue); }
html body.mpj-ui .mpj-lh-search__menu b { display: block; font-size: 14px; font-weight: 650; line-height: 1.3; }
html body.mpj-ui .mpj-lh-search__menu small { display: block; margin-top: 2px; font-size: 12.5px; color: var(--mpj-muted); line-height: 1.35; }
@container lesson (max-width: 1080px) {
  html body.mpj-ui .medexp-lessonSubheader .mpj-lh-search__btn .mpj-lh-lbl { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0,0,0,0); }
}

/* =====================================================================
 * Lesson column: one width, one rhythm.
 * Player, lesson summary card and every section card share the same left
 * and right edges and the same 24px gap. The header strip no longer adds a
 * white band (that made the first card's border look pushed down), and the
 * content wrapper no longer indents sections by 32px on each side.
 * ===================================================================== */
html body.mpj-ui .medexp-main { padding-top: 24px !important; padding-bottom: 40px !important; }
html body.mpj-ui .medexp-main > .mpj-ls { margin: 0 0 24px !important; }
html body.mpj-ui .medexp-lesson__header { background: transparent !important; padding: 0 !important; margin: 0 !important; border: 0 !important; box-shadow: none !important; }
html body.mpj-ui .medexp-lesson__header > .medexp-card { margin: 0 !important; }
html body.mpj-ui .medexp-lesson__content { padding: 0 !important; margin: 24px 0 0 !important; background: transparent !important; border: 0 !important; box-shadow: none !important; }
html body.mpj-ui .medexp-lesson__content > .medexp-card,
html body.mpj-ui .medexp-lesson__content > section,
html body.mpj-ui .medexp-lesson__content > .medexp-section { margin: 0 0 24px !important; max-width: none !important; width: auto !important; }
html body.mpj-ui .medexp-lesson__content > :last-child { margin-bottom: 0 !important; }
html body.mpj-ui .medexp-lesson .medexp-card.medexp-section { border-radius: 16px !important; }
@container lesson (max-width: 640px) {
  html body.mpj-ui .medexp-main { padding-left: 12px !important; padding-right: 12px !important; padding-top: 16px !important; }
  html body.mpj-ui .medexp-lesson .medexp-card.medexp-section { padding: 20px 18px !important; border-radius: 14px !important; }
  html body.mpj-ui .medexp-main > .mpj-ls, html body.mpj-ui .medexp-lesson__content > .medexp-card, html body.mpj-ui .medexp-lesson__content > section { margin-bottom: 16px !important; }
  html body.mpj-ui .medexp-lesson__content { margin-top: 16px !important; }
}

/* =====================================================================
 * Follow along (listen.js): the passage being read is lit, with a thin
 * line that fills as it is read; the page scrolls with the narration.
 * ===================================================================== */
html body.mpj-ui .mpj-reading {
  border-radius: 8px;
  background:
    linear-gradient(var(--mpj-blue), var(--mpj-blue)) left bottom / calc(var(--mpj-read, 0) * 100%) 2px no-repeat,
    var(--mpj-blue-soft) !important;
  box-shadow: 0 0 0 8px var(--mpj-blue-soft) !important;
  transition: background-color .35s ease, box-shadow .35s ease, background-size .3s linear;
  scroll-margin: 120px 0;
}
html body.mpj-ui .mpj-reading.is-live { animation: mpj-read-breathe 2.6s ease-in-out infinite; }
@keyframes mpj-read-breathe { 0%, 100% { box-shadow: 0 0 0 8px var(--mpj-blue-soft); } 50% { box-shadow: 0 0 0 10px var(--mpj-blue-soft); } }
html body.mpj-ui img.mpj-reading, html body.mpj-ui figure.mpj-reading, html body.mpj-ui table.mpj-reading, html body.mpj-ui svg.mpj-reading, html body.mpj-ui .medexp-diagram.mpj-reading {
  background: transparent !important; box-shadow: 0 0 0 4px #fff, 0 0 0 7px var(--mpj-blue) !important; border-radius: 10px;
}
/* With paragraph-level cues on, the whole-section highlight steps back to a quiet edge line. */


/* Player: Follow switch */
html body.mpj-ui .mpj-ls__follow { display: inline-flex; align-items: center; gap: 6px; height: 32px; padding: 0 11px !important; border-radius: 999px !important; border: 1px solid var(--mpj-line, #e3e8ef) !important; background: #fff !important; color: var(--mpj-muted) !important; font: 600 13px/1 var(--mpj-sans) !important; cursor: pointer; }
html body.mpj-ui .mpj-ls__follow.is-on { background: var(--mpj-blue-soft) !important; border-color: var(--mpj-blue-line) !important; color: var(--mpj-blue) !important; }
@media (max-width: 640px) { html body.mpj-ui .mpj-ls__follow span { display: none; } html body.mpj-ui .mpj-ls__follow { width: 36px; padding: 0 !important; justify-content: center; } }

/* "Back to where the audio is" pill after the learner scrolls away */
html body.mpj-ui .mpj-follow-pill { position: fixed; left: 50%; bottom: 24px; z-index: 9989; transform: translate(-50%, 20px); opacity: 0; pointer-events: none; transition: transform .25s ease, opacity .2s; }
html.mpj-ls-docked body.mpj-ui .mpj-follow-pill { bottom: 92px; }
html body.mpj-ui .mpj-follow-pill.is-on { transform: translate(-50%, 0); opacity: 1; pointer-events: auto; }
html body.mpj-ui .mpj-follow-pill__btn { display: inline-flex; align-items: center; gap: 8px; height: 40px; padding: 0 16px !important; border-radius: 999px !important; border: 0 !important; background: var(--mpj-navy) !important; color: #fff !important; font: 600 13.5px/1 var(--mpj-sans) !important; box-shadow: 0 12px 28px -10px rgba(10,20,40,.5); cursor: pointer; white-space: nowrap; }
html body.mpj-ui .mpj-follow-pill__btn:hover { filter: brightness(1.1); }
@media (prefers-reduced-motion: reduce) { html body.mpj-ui .mpj-reading.is-live { animation: none; } }
/* Outline sidebar: the section being read */
html body.mpj-ui .medexp-lessonRail a.mpj-toc-now { position: relative; color: var(--mpj-blue) !important; font-weight: 700 !important; background: var(--mpj-blue-soft) !important; border-radius: 8px; box-shadow: inset 3px 0 0 var(--mpj-blue); }
html body.mpj-ui .medexp-lessonRail a.mpj-toc-done { color: var(--mpj-muted) !important; }
html body.mpj-ui .mpj-toc-eq { display: none; align-items: flex-end; gap: 2px; height: 11px; margin-left: 6px; vertical-align: middle; }
html body.mpj-ui .mpj-toc-eq i { width: 2.5px; height: 100%; border-radius: 1px; background: var(--mpj-blue); animation: mpj-ls-eq 1s ease-in-out infinite; }
html body.mpj-ui .mpj-toc-eq i:nth-child(2) { animation-delay: .2s; }
html body.mpj-ui .mpj-toc-eq i:nth-child(3) { animation-delay: .4s; }
html body.mpj-ui a.mpj-toc-now .mpj-toc-eq { display: inline-flex; }
html body.mpj-ui a.mpj-toc-now:not(.is-live) .mpj-toc-eq i { animation: none; height: 45%; }
@media (prefers-reduced-motion: reduce) { html body.mpj-ui .mpj-toc-eq i { animation: none; } }
/* No flash of the old players: hidden from the first paint, with a same-size
   placeholder holding the new player's spot until it appears. */
body.mpj-ui.mpj-listen-on .medexp-narrating-banner,
body.mpj-ui.mpj-listen-on .medexp-audio-section,
body.mpj-ui.mpj-listen-on #mxp-mini-player,
body.mpj-ui.mpj-listen-on .mxp-play-pill,
body.mpj-ui.mpj-listen-on .medexp-tp-section-play { display: none !important; }
html:not(.mpj-has-listen):not(.mpj-listen-none) body.mpj-ui.mpj-listen-on .medexp-playlist[data-medexp-playlist] {
  display: block !important; height: 119px !important; min-height: 0 !important; margin: 0 0 24px !important; padding: 0 !important;
  overflow: hidden !important; border-radius: 16px !important; border: 1px solid var(--mpj-line, #e3e8ef) !important;
  background: linear-gradient(90deg, #fff 0%, #f3f6f9 40%, #fff 80%) 0 0 / 200% 100% #fff !important; box-shadow: none !important;
  animation: mpj-ls-shimmer 1.4s linear infinite;
}
html:not(.mpj-has-listen):not(.mpj-listen-none) body.mpj-ui.mpj-listen-on .medexp-playlist[data-medexp-playlist] > * { visibility: hidden !important; }
@keyframes mpj-ls-shimmer { to { background-position: -200% 0; } }

/* Lesson text uses the card's full width (no per-paragraph cap). */
html body.mpj-ui .medexp-lesson__content .medexp-section > *,
html body.mpj-ui .medexp-lesson__header .medexp-section > * { max-width: none !important; }
/* The section being played gets no box of its own (it shifted cards and headings);
   the lit passage, the Playing chip and the outline show where the narration is. */
html.mpj-has-listen body.mpj-ui .medexp-section-card.is-narrating { box-shadow: none !important; animation: none !important; }

/* Until the header script runs: the two search buttons are about to become one */
html body.mpj-ui .medexp-lessonSubheader .medexp-lessonToolbar > .medexp-findToggle,
html body.mpj-ui .medexp-lessonSubheader .medexp-lessonToolbar > .medexp-searchToggle { display: none !important; }

/* =====================================================================
 * Textbook lesson design. Every tint is mixed from the site's own palette
 * (--mpj-blue = main action color, --mpj-navy, --mpj-teal = second color),
 * so MPJE Review reads blue and MedExPrep reads teal.
 * Hooks come from lesson-header.js: [data-mpj-sec] on sections and
 * [data-mpj-kind] on callouts.
 * ===================================================================== */
html body.mpj-ui .medexp-lesson {
  --bk-brand: var(--mpj-blue);
  --bk-brand-2: var(--mpj-teal);
  --bk-amber: color-mix(in srgb, #d97706 80%, var(--mpj-blue));
  --bk-rose: color-mix(in srgb, #e11d48 80%, var(--mpj-blue));
  --bk-green: color-mix(in srgb, #16a34a 75%, var(--mpj-blue));
  --bk-violet: color-mix(in srgb, #7c3aed 75%, var(--mpj-blue));
  --bk-slate: color-mix(in srgb, #64748b 85%, var(--mpj-blue));
}
html body.mpj-ui .medexp-lesson [data-mpj-sec] { --sec: var(--bk-brand); position: relative; overflow: hidden; }
html body.mpj-ui .medexp-lesson [data-mpj-sec="opener"] { --sec: var(--bk-brand); }
html body.mpj-ui .medexp-lesson [data-mpj-sec="why-it-matters"] { --sec: var(--bk-amber); }
html body.mpj-ui .medexp-lesson [data-mpj-sec="key-terms"] { --sec: var(--bk-brand-2); }
html body.mpj-ui .medexp-lesson [data-mpj-sec="exam-traps"] { --sec: var(--bk-rose); }
html body.mpj-ui .medexp-lesson [data-mpj-sec="algorithm"] { --sec: var(--mpj-navy); }
html body.mpj-ui .medexp-lesson [data-mpj-sec="rapid-review"] { --sec: var(--bk-green); }
html body.mpj-ui .medexp-lesson [data-mpj-sec="self-check-quiz"] { --sec: var(--bk-violet); }
html body.mpj-ui .medexp-lesson [data-mpj-sec="answer-key"] { --sec: var(--bk-slate); }

/* Feature sections: a soft wash of their color that fades into the page, and a thin top rule */
html body.mpj-ui .medexp-lesson [data-mpj-sec]:not([data-mpj-sec="core-content"]):not([data-mpj-sec="core"]):not([data-mpj-sec="tables"]) {
  background: linear-gradient(180deg, color-mix(in srgb, var(--sec) 9%, #fff) 0, #fff 260px) !important;
  border-color: color-mix(in srgb, var(--sec) 18%, var(--mpj-line, #e3e8ef)) !important;
}
html body.mpj-ui .medexp-lesson [data-mpj-sec]:not([data-mpj-sec="core-content"]):not([data-mpj-sec="core"]):not([data-mpj-sec="tables"])::after {
  content: ""; position: absolute; left: 0; right: 0; top: 0; height: 4px; pointer-events: none;
  background: linear-gradient(90deg, var(--sec), color-mix(in srgb, var(--sec) 35%, #fff) 70%, transparent);
}
/* Section label pill takes the section color */
html body.mpj-ui .medexp-lesson [data-mpj-sec] .medexp-sectionPill {
  background: color-mix(in srgb, var(--sec) 12%, #fff) !important; color: var(--sec) !important;
  border: 1px solid color-mix(in srgb, var(--sec) 25%, #fff) !important; border-radius: 999px !important; padding: 4px 10px !important;
}
html body.mpj-ui .medexp-lesson [data-mpj-sec] .medexp-sectionPill * { color: inherit !important; }
html body.mpj-ui .medexp-lesson [data-mpj-sec] .medexp-sectionPill__txt { font-weight: 700 !important; letter-spacing: .08em; font-size: 11.5px !important; }

/* Lesson opener: a title page */
html body.mpj-ui .medexp-lesson [data-mpj-sec="opener"] > h2:first-child { font-size: clamp(22px, 2vw, 28px) !important; line-height: 1.2 !important; color: var(--mpj-navy) !important; margin: 4px 0 14px !important; letter-spacing: -.01em; }
html body.mpj-ui .medexp-lesson [data-mpj-sec="opener"] .medexp-lesson__meta { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 10px; margin: 0 0 18px !important; }
html body.mpj-ui .medexp-lesson [data-mpj-sec="opener"] .medexp-lesson__meta > p { margin: 0 !important; padding: 10px 12px !important; border-radius: 12px; background: rgba(255,255,255,.75); border: 1px solid color-mix(in srgb, var(--sec) 16%, var(--mpj-line, #e3e8ef)); font-size: 14px; line-height: 1.45; }
html body.mpj-ui .medexp-lesson [data-mpj-sec="opener"] .medexp-lesson__meta > p > strong:first-child { display: block !important; font-size: 11px !important; font-weight: 700 !important; letter-spacing: .06em !important; text-transform: uppercase !important; color: var(--sec) !important; margin: 0 0 2px !important; }
html body.mpj-ui .medexp-lesson [data-mpj-sec="opener"] .medexp-lesson__meta > p.mpj-meta-wide { grid-column: 1 / -1; }
html body.mpj-ui .medexp-lesson [data-mpj-sec="opener"] > h3 { font-size: 13px !important; font-weight: 700 !important; letter-spacing: .07em; text-transform: uppercase; color: var(--sec) !important; margin: 22px 0 8px !important; }

/* Key terms: the defined word stands out */
html body.mpj-ui .medexp-lesson [data-mpj-sec="key-terms"] li > strong:first-child { color: var(--sec) !important; }
/* Exam traps: warning bullets */
html body.mpj-ui .medexp-lesson [data-mpj-sec="exam-traps"] ul > li::before { background: var(--sec) !important; }
/* Rapid review: check-mark bullets */
html body.mpj-ui .medexp-lesson [data-mpj-sec="rapid-review"] ul > li { list-style: none !important; position: relative; padding-left: 28px !important; }
html body.mpj-ui .medexp-lesson [data-mpj-sec="rapid-review"] ul > li::before {
  content: "" !important; position: absolute !important; left: 0 !important; top: .3em !important; width: 18px !important; height: 18px !important; border-radius: 50% !important;
  background: color-mix(in srgb, var(--sec) 15%, #fff) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2316a34a' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center / 11px no-repeat !important;
}
/* Self-check quiz: each question as an index card */
html body.mpj-ui .medexp-lesson [data-mpj-sec="self-check-quiz"] .medexp-card { background: #fff !important; border: 1px solid color-mix(in srgb, var(--sec) 18%, var(--mpj-line, #e3e8ef)) !important; border-radius: 14px !important; box-shadow: 0 6px 18px -14px color-mix(in srgb, var(--sec) 60%, transparent) !important; }
html body.mpj-ui .medexp-lesson [data-mpj-sec="self-check-quiz"] ol[type="A"] > li::before { background: color-mix(in srgb, var(--sec) 12%, #fff) !important; color: var(--sec) !important; }
/* Answer key: quieter */
html body.mpj-ui .medexp-lesson [data-mpj-sec="answer-key"] { color: color-mix(in srgb, var(--mpj-text) 92%, #fff); }

/* Callouts: gradient band, soft wash, icon per kind */
html body.mpj-ui .medexp-lesson .medexp-callout[data-mpj-kind] { --co: var(--bk-brand); }
html body.mpj-ui .medexp-lesson .medexp-callout[data-mpj-kind="memory"] { --co: var(--bk-violet); }
html body.mpj-ui .medexp-lesson .medexp-callout[data-mpj-kind="highyield"] { --co: var(--bk-amber); }
html body.mpj-ui .medexp-lesson .medexp-callout[data-mpj-kind="action"] { --co: var(--bk-green); }
html body.mpj-ui .medexp-lesson .medexp-callout[data-mpj-kind="wrong"] { --co: var(--bk-rose); }
html body.mpj-ui .medexp-lesson .medexp-callout[data-mpj-kind="missed"] { --co: var(--bk-slate); }
html body.mpj-ui .medexp-lesson .medexp-callout[data-mpj-kind="rule"] { --co: var(--mpj-navy); }
html body.mpj-ui .medexp-lesson .medexp-callout[data-mpj-kind="link"] { --co: var(--bk-brand-2); }
html body.mpj-ui .medexp-lesson .medexp-callout[data-mpj-kind] {
  position: relative; overflow: hidden;
  background: linear-gradient(90deg, color-mix(in srgb, var(--co) 10%, #fff) 0%, color-mix(in srgb, var(--co) 3%, #fff) 70%, #fff 100%) !important;
  border: 1px solid color-mix(in srgb, var(--co) 22%, #fff) !important; border-radius: 14px !important;
  padding: 16px 20px 16px 26px !important;
}
html body.mpj-ui .medexp-lesson .medexp-callout[data-mpj-kind]::before {
  content: "" !important; position: absolute !important; left: 0 !important; top: 0 !important; bottom: 0 !important; width: 6px !important; height: auto !important; border-radius: 0 !important;
  background: linear-gradient(180deg, var(--co) 0%, color-mix(in srgb, var(--co) 45%, #fff) 100%) !important;
}
html body.mpj-ui .medexp-lesson .medexp-callout[data-mpj-kind] > strong:first-of-type { color: var(--co) !important; }
html body.mpj-ui .mpj-callout-ico { display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; margin: -2px 8px 0 0; vertical-align: middle; border-radius: 8px; color: #fff; background: linear-gradient(135deg, var(--co), color-mix(in srgb, var(--co) 55%, #fff)); }

/* Numbered markers: a gentle gradient in the site colors */
html body.mpj-ui .medexp-flow__marker { background: linear-gradient(145deg, color-mix(in srgb, var(--mpj-navy) 85%, var(--mpj-blue)) 0%, var(--mpj-blue) 100%) !important; box-shadow: 0 4px 10px -4px color-mix(in srgb, var(--mpj-blue) 70%, transparent), inset 0 1px 0 rgba(255,255,255,.25) !important; }
html body.mpj-ui .medexp-flow__step:last-child .medexp-flow__marker, html body.mpj-ui .medexp-flow__marker:last-child { background: linear-gradient(145deg, var(--mpj-blue) 0%, color-mix(in srgb, var(--mpj-teal-bright, #5fd4cc) 70%, var(--mpj-blue)) 100%) !important; }
html body.mpj-ui .mpj-cat__num, html body.mpj-ui .mpj-ls__item.is-active .mpj-ls__num { background: linear-gradient(145deg, var(--mpj-navy), var(--mpj-blue)) !important; }

/* Sidebar search: sized like the outline beside it */
html body.mpj-ui .medexp-lessonRail .medexp-courseSearch { padding: 12px !important; border-radius: 12px !important; box-shadow: none !important; margin: 0 0 12px !important; }
html body.mpj-ui .medexp-lessonRail .medexp-courseSearch__title { font-size: 11.5px !important; font-weight: 700 !important; letter-spacing: .07em; text-transform: uppercase; color: var(--mpj-faint) !important; margin: 0 0 8px !important; }
html body.mpj-ui .medexp-lessonRail .medexp-courseSearch__pillrow { display: none !important; }
html body.mpj-ui .medexp-lessonRail .medexp-courseSearch__form { display: flex !important; flex-direction: column; gap: 6px !important; }
html body.mpj-ui .medexp-lessonRail .medexp-courseSearch__input { height: 34px !important; font-size: 13.5px !important; padding: 0 30px 0 12px !important; border-radius: 10px !important; width: 100% !important; box-sizing: border-box; }
html body.mpj-ui .medexp-lessonRail .medexp-courseSearch__scope { height: 32px !important; font-size: 12.5px !important; padding: 0 8px !important; border-radius: 9px !important; width: 100% !important; color: var(--mpj-muted) !important; }
html body.mpj-ui .medexp-lessonRail .medexp-courseSearch button:not(.medexp-courseSearch__clear) { height: 32px !important; min-height: 0 !important; font-size: 13px !important; padding: 0 12px !important; border-radius: 9px !important; }
html body.mpj-ui .medexp-lessonRail .medexp-courseSearch [class*="hint"], html body.mpj-ui .medexp-lessonRail .medexp-courseSearch [class*="empty"] { font-size: 12.5px !important; padding: 8px 10px !important; font-weight: 500 !important; color: var(--mpj-muted) !important; }

/* Highlight popup: a polished floating toolbar */
html body.mpj-ui .medexp-uw-hlPop {
  padding: 6px !important; border-radius: 14px !important; border: 1px solid rgba(255,255,255,.08) !important;
  background: linear-gradient(180deg, color-mix(in srgb, var(--mpj-navy) 92%, #fff), var(--mpj-navy)) !important;
  box-shadow: 0 18px 40px -14px rgba(10,20,40,.55), 0 2px 6px rgba(10,20,40,.2) !important; color: #fff !important;
}
html body.mpj-ui .medexp-uw-hlPop__row { display: flex !important; align-items: center !important; gap: 2px !important; flex-wrap: nowrap !important; }
html body.mpj-ui .medexp-uw-hlPop__rm {
  display: inline-flex !important; align-items: center; gap: 6px; height: 32px !important; padding: 0 10px !important; margin: 0 !important;
  border: 0 !important; border-radius: 9px !important; background: transparent !important; color: rgba(255,255,255,.9) !important;
  font: 600 13px/1 var(--mpj-sans) !important; box-shadow: none !important; cursor: pointer; white-space: nowrap;
}
html body.mpj-ui .medexp-uw-hlPop__rm:hover { background: rgba(255,255,255,.12) !important; color: #fff !important; }
html body.mpj-ui .medexp-uw-hlPop__rm::before { content: ""; width: 15px; height: 15px; flex: none; background: currentColor; -webkit-mask: var(--ico) center / contain no-repeat; mask: var(--ico) center / contain no-repeat; }
html body.mpj-ui .medexp-uw-hlPop__row > .medexp-uw-hlPop__rm:nth-of-type(1) { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 20h9'/%3E%3Cpath d='M16.5 3.5a2.1 2.1 0 0 1 3 3L7 19l-4 1 1-4z'/%3E%3C/svg%3E"); }
html body.mpj-ui .medexp-uw-hlPop__row > .medexp-uw-hlPop__rm:nth-of-type(2) { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10 13a5 5 0 0 0 7.5.5l3-3a5 5 0 0 0-7-7l-1.7 1.7'/%3E%3Cpath d='M14 11a5 5 0 0 0-7.5-.5l-3 3a5 5 0 0 0 7 7l1.7-1.7'/%3E%3C/svg%3E"); }
html body.mpj-ui .medexp-uw-hlPop__row > .medexp-uw-hlPop__rm:nth-of-type(3) { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 6h18M8 6V4h8v2M6 6l1 14h10l1-14'/%3E%3C/svg%3E"); }
html body.mpj-ui .medexp-uw-hlPop__row > .medexp-uw-hlPop__rm:nth-of-type(3):hover { background: rgba(244,63,94,.22) !important; color: #ffd5dc !important; }
html body.mpj-ui .medexp-uw-hlPop__colors { display: inline-flex !important; align-items: center; gap: 6px !important; margin: 0 0 0 6px !important; padding: 0 4px 0 10px !important; border-left: 1px solid rgba(255,255,255,.16) !important; }
html body.mpj-ui .medexp-uw-hlPop__sw { width: 20px !important; height: 20px !important; min-width: 0 !important; padding: 0 !important; border-radius: 50% !important; border: 2px solid rgba(255,255,255,.25) !important; box-shadow: none !important; cursor: pointer; transition: transform .12s, border-color .12s; }
html body.mpj-ui .medexp-uw-hlPop__sw:hover { transform: scale(1.12); border-color: rgba(255,255,255,.7) !important; }
html body.mpj-ui .medexp-uw-hlPop__sw.is-active { border-color: #fff !important; box-shadow: 0 0 0 2px color-mix(in srgb, var(--mpj-blue) 60%, #fff) !important; }
html body.mpj-ui .medexp-uw-hlPop__colorInput { width: 24px !important; height: 22px !important; padding: 0 !important; border: 0 !important; border-radius: 6px !important; background: transparent !important; cursor: pointer; }
@media (max-width: 520px) { html body.mpj-ui .medexp-uw-hlPop__rm { font-size: 0 !important; gap: 0; padding: 0 9px !important; } html body.mpj-ui .medexp-uw-hlPop__rm::before { width: 17px; height: 17px; } }
/* Section headers: label pill, then the section's name as a real heading */
html body.mpj-ui .medexp-lesson [data-mpj-sec] > .medexp-sectionHeader { display: grid !important; grid-template-columns: auto 1fr auto; grid-template-areas: "pill . report" "title title title"; align-items: center; row-gap: 8px; margin: 0 0 16px !important; padding: 0 !important; border: 0 !important; }
html body.mpj-ui .medexp-lesson [data-mpj-sec] > .medexp-sectionHeader > .medexp-sectionPill { grid-area: pill; }
html body.mpj-ui .medexp-lesson [data-mpj-sec] > .medexp-sectionHeader > .medexp-sectionReportBtn { grid-area: report; }
html body.mpj-ui .medexp-lesson [data-mpj-sec] > .medexp-sectionHeader > .medexp-sectionTitle {
  grid-area: title; position: static !important; width: auto !important; height: auto !important; clip: auto !important; overflow: visible !important; white-space: normal !important; margin: 0 !important; padding: 0 !important;
  font-size: clamp(20px, 1.6vw, 24px) !important; line-height: 1.25 !important; font-weight: 700 !important; color: var(--mpj-navy) !important; letter-spacing: -.01em;
}
/* Report issue: still there, but quiet until you need it */
html body.mpj-ui .medexp-lesson .medexp-sectionReportBtn { height: 28px !important; padding: 0 10px !important; font-size: 12px !important; font-weight: 600 !important; border: 1px solid transparent !important; background: transparent !important; color: var(--mpj-faint) !important; box-shadow: none !important; border-radius: 8px !important; opacity: .75; transition: opacity .15s, color .15s, border-color .15s; }
html body.mpj-ui .medexp-lesson .medexp-section:hover .medexp-sectionReportBtn, html body.mpj-ui .medexp-lesson .medexp-sectionReportBtn:focus-visible { opacity: 1; }
html body.mpj-ui .medexp-lesson .medexp-sectionReportBtn:hover { color: var(--mpj-text) !important; border-color: var(--mpj-line, #e3e8ef) !important; background: #fff !important; }
/* Sidebar brand bar: logo sized properly, same height and bottom edge as the lesson header */
html body.mpj-ui .medexp-lessonRail .medexp-lessonBrand {
  display: flex !important; align-items: center !important; box-sizing: border-box;
  height: var(--mpj-lh-h, 120px) !important; min-height: 64px; padding: 0 20px !important; margin: 0 !important;
  border-bottom: 1px solid var(--mpj-line, #e3e8ef) !important; background: rgba(255,255,255,.96) !important;
}
html body.mpj-ui .medexp-lessonRail .medexp-lessonBrand { justify-content: center !important; }
html body.mpj-ui .medexp-lessonRail .medexp-lessonBrand__link { display: inline-flex !important; align-items: center; justify-content: center; padding: 6px 10px; margin: 0; border-radius: 12px; transition: background .15s; }
html body.mpj-ui .medexp-lessonRail .medexp-lessonBrand__link:hover { background: var(--mpj-sunken, #f1f4f8); }
html body.mpj-ui .medexp-lessonRail .medexp-lessonBrand__logo { height: auto !important; width: auto !important; max-height: 58px !important; max-width: 210px !important; }
html body.mpj-ui.mpj-site-medexprep .medexp-lessonRail .medexp-lessonBrand__logo { max-height: 48px !important; max-width: 220px !important; }

/* Rail: tighter rhythm between brand, search and "On this page" */
html body.mpj-ui .medexp-lessonRail .medexp-sidebar__inner { row-gap: 10px !important; }
html body.mpj-ui .medexp-lessonRail .medexp-courseSearch { margin: 0 !important; position: relative; }
html body.mpj-ui .medexp-lessonRail .medexp-toc--onpage { padding-top: 0 !important; }
html body.mpj-ui .medexp-lessonRail .medexp-toc--onpage .medexp-toc__header { padding-top: 6px !important; }
/* Close button on the sidebar search card (desktop; on phones search lives in the drawer) */
html body.mpj-ui .mpj-cs-close { position: absolute; top: 8px; right: 8px; width: 26px; height: 26px; display: inline-flex; align-items: center; justify-content: center; border: 0; border-radius: 8px; background: transparent; color: var(--mpj-faint); cursor: pointer; padding: 0; transition: background .15s, color .15s; }
html body.mpj-ui .mpj-cs-close:hover, html body.mpj-ui .mpj-cs-close:focus-visible { background: var(--mpj-sunken, #f1f4f8); color: var(--mpj-text); }
@media (max-width: 859px) { html body.mpj-ui .mpj-cs-close { display: none; } }

/* Color-matched icon tiles: the callout look, everywhere in the lesson */
html body.mpj-ui .medexp-lesson [data-mpj-sec] { --sec-tile: linear-gradient(135deg, var(--sec), color-mix(in srgb, var(--sec) 55%, #fff)); }
html body.mpj-ui .medexp-lesson [data-mpj-sec] .medexp-sectionPill { display: inline-flex !important; align-items: center; gap: 10px; background: transparent !important; border: 0 !important; padding: 0 !important; border-radius: 0 !important; }
html body.mpj-ui .medexp-lesson [data-mpj-sec] .medexp-sectionPill__ico { display: inline-flex !important; align-items: center; justify-content: center; width: 30px; height: 30px; border-radius: 9px; background: var(--sec-tile); color: #fff !important; box-shadow: 0 4px 10px -5px color-mix(in srgb, var(--sec) 80%, transparent), inset 0 1px 0 rgba(255,255,255,.25); flex: 0 0 auto; }
html body.mpj-ui .medexp-lesson [data-mpj-sec] .medexp-sectionPill__ico svg { width: 17px !important; height: 17px !important; color: #fff !important; display: block !important; }
html body.mpj-ui .medexp-lesson [data-mpj-sec] .medexp-sectionPill__ico .mpj-i__duo { fill-opacity: .25; }
html body.mpj-ui .medexp-lesson [data-mpj-sec] .medexp-sectionPill__txt { color: var(--sec) !important; }
/* Numbered heading chips and letter markers take the section color */
html body.mpj-ui .medexp-lesson [data-mpj-sec] .medexp-hnum { background: color-mix(in srgb, var(--sec) 10%, #fff) !important; color: var(--sec) !important; border-color: color-mix(in srgb, var(--sec) 24%, #fff) !important; font-weight: 700 !important; }
html body.mpj-ui .medexp-lesson [data-mpj-sec] .medexp-hlet { background: var(--sec-tile) !important; color: #fff !important; border-color: transparent !important; border-radius: 8px !important; font-weight: 700 !important; box-shadow: 0 3px 8px -4px color-mix(in srgb, var(--sec) 80%, transparent); }
/* Quiz question numbers as tiles */
html body.mpj-ui .medexp-lesson [data-mpj-sec="self-check-quiz"] .medexp-card > p:first-child > strong:first-child { display: inline-flex; align-items: center; justify-content: center; min-width: 28px; height: 28px; padding: 0 6px; margin-right: 8px; border-radius: 8px; background: var(--sec-tile); color: #fff !important; font-size: 13.5px; vertical-align: 1px; box-shadow: 0 3px 8px -4px color-mix(in srgb, var(--sec) 80%, transparent); }
/* Opener: fact labels and subheads with tiles */
html body.mpj-ui .mpj-tile { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; width: 20px; height: 20px; border-radius: 6px; color: #fff; background: var(--sec-tile, var(--mpj-blue)); vertical-align: middle; }
html body.mpj-ui .mpj-tile svg { width: 12px; height: 12px; }
html body.mpj-ui .medexp-lesson [data-mpj-sec="opener"] .medexp-lesson__meta > p > strong:first-child { display: flex !important; align-items: center; gap: 7px; margin-bottom: 4px !important; }
html body.mpj-ui .medexp-lesson [data-mpj-sec="opener"] > h3 { display: flex; align-items: center; gap: 9px; }
html body.mpj-ui .medexp-lesson [data-mpj-sec="opener"] > h3 .mpj-tile { width: 26px; height: 26px; border-radius: 8px; }
html body.mpj-ui .medexp-lesson [data-mpj-sec="opener"] > h3 .mpj-tile svg { width: 15px; height: 15px; }
/* Outline: each top-level entry carries its section color */
html body.mpj-ui .medexp-lessonRail .medexp-tocLink[data-mpj-sec]:not(.is-sub) { position: relative; padding-left: 26px !important; }
html body.mpj-ui .medexp-lessonRail .medexp-tocLink[data-mpj-sec]:not(.is-sub)::before { content: ""; position: absolute; left: 9px; top: .78em; width: 9px; height: 9px; border-radius: 3px; background: linear-gradient(135deg, var(--sec), color-mix(in srgb, var(--sec) 55%, #fff)); }
/* Meta headings that come with their own markup (Est. time, Prerequisites, Outcomes) match the others */
html body.mpj-ui .mpj-tile svg { display: block !important; }
html body.mpj-ui .medexp-lesson [data-mpj-sec="opener"] .medexp-lesson__meta .medexp-metaHeading,
html body.mpj-ui .medexp-lesson [data-mpj-sec="opener"] .medexp-lesson__meta .medexp-metaHeading__txt { font-size: 11px !important; font-weight: 700 !important; letter-spacing: .06em !important; text-transform: uppercase !important; color: var(--sec) !important; }

/* =====================================================================
 * End-of-lesson wrap-up (.mpj-wrap): progress, study cards, up next.
 * Same color-matched tile language as the lesson sections.
 * ===================================================================== */
html body.mpj-ui .mpj-wrap {
  --w-brand: var(--mpj-blue); --w-violet: color-mix(in srgb, #7c3aed 75%, var(--mpj-blue)); --w-teal: var(--mpj-teal); --w-green: color-mix(in srgb, #16a34a 75%, var(--mpj-blue));
  --sec: var(--w-green);
  margin: 8px 0 32px; padding: 28px; border-radius: 20px; position: relative; overflow: hidden;
  background: linear-gradient(180deg, color-mix(in srgb, var(--mpj-blue) 7%, #fff) 0, #fff 280px);
  border: 1px solid color-mix(in srgb, var(--mpj-blue) 16%, var(--mpj-line, #e3e8ef));
  box-shadow: 0 18px 40px -32px color-mix(in srgb, var(--mpj-navy) 60%, transparent);
  font-family: var(--mpj-sans);
}
html body.mpj-ui .mpj-wrap::after { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 4px; background: linear-gradient(90deg, var(--mpj-blue), color-mix(in srgb, var(--mpj-blue) 35%, #fff) 70%, transparent); }
html body.mpj-ui .mpj-wrap__tile { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; width: 40px; height: 40px; border-radius: 12px; color: #fff; background: linear-gradient(135deg, var(--sec), color-mix(in srgb, var(--sec) 55%, #fff)); box-shadow: 0 6px 14px -8px color-mix(in srgb, var(--sec) 85%, transparent), inset 0 1px 0 rgba(255,255,255,.25); }
html body.mpj-ui .mpj-wrap__tile svg { display: block !important; }
html body.mpj-ui .mpj-wrap__head { display: flex; align-items: center; gap: 16px; margin-bottom: 22px; }
html body.mpj-ui .mpj-wrap__head > .mpj-wrap__tile { --sec: var(--w-brand); width: 46px; height: 46px; border-radius: 14px; }
html body.mpj-ui .mpj-wrap__intro { flex: 1 1 auto; min-width: 0; }
html body.mpj-ui .mpj-wrap__eyebrow { font-size: 11.5px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--mpj-blue); }
html body.mpj-ui .mpj-wrap__title { margin: 2px 0 4px !important; font-size: clamp(19px, 1.6vw, 23px) !important; line-height: 1.25 !important; font-weight: 700 !important; color: var(--mpj-navy) !important; letter-spacing: -.01em; }
html body.mpj-ui .mpj-wrap__lede { margin: 0 !important; font-size: 14.5px; color: var(--mpj-muted); line-height: 1.5; }
html body.mpj-ui .mpj-wrap__ring { flex: 0 0 auto; display: flex; align-items: center; gap: 10px; }
html body.mpj-ui .mpj-wrap__ringNum { display: inline-flex; align-items: center; justify-content: center; width: 58px; height: 58px; border-radius: 50%; font-weight: 800; font-size: 16px; color: var(--mpj-navy);
  background: radial-gradient(closest-side, #fff 76%, transparent 78% 100%), conic-gradient(var(--mpj-blue) calc(var(--p) * 1%), color-mix(in srgb, var(--mpj-blue) 12%, #fff) 0); }
html body.mpj-ui .mpj-wrap__ringNum small { font-size: 11px; font-weight: 700; margin-left: 1px; }
html body.mpj-ui .mpj-wrap__ringLbl { font-size: 12.5px; line-height: 1.3; color: var(--mpj-muted); font-weight: 600; }

html body.mpj-ui .mpj-wrap__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 14px; }
html body.mpj-ui .mpj-wrap__card { position: relative; display: flex; flex-direction: column; gap: 4px; padding: 18px; border-radius: 16px; text-decoration: none !important; color: var(--mpj-text) !important;
  background: linear-gradient(180deg, color-mix(in srgb, var(--sec) 8%, #fff) 0, #fff 120px); border: 1px solid color-mix(in srgb, var(--sec) 20%, var(--mpj-line, #e3e8ef));
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; }
html body.mpj-ui .mpj-wrap__card[hidden] { display: none; }
html body.mpj-ui .mpj-wrap__card[data-k="quiz"] { --sec: var(--w-violet); }
html body.mpj-ui .mpj-wrap__card[data-k="cards"] { --sec: var(--w-teal); }
html body.mpj-ui .mpj-wrap__card[data-k="qbank"] { --sec: var(--w-brand); }
html body.mpj-ui .mpj-wrap__card:hover, html body.mpj-ui .mpj-wrap__card:focus-visible { transform: translateY(-2px); border-color: color-mix(in srgb, var(--sec) 45%, #fff); box-shadow: 0 14px 28px -18px color-mix(in srgb, var(--sec) 70%, transparent); }
html body.mpj-ui .mpj-wrap__card.is-rec { border-color: color-mix(in srgb, var(--sec) 45%, #fff); box-shadow: 0 0 0 3px color-mix(in srgb, var(--sec) 12%, transparent); }
html body.mpj-ui .mpj-wrap__card.is-quiet .mpj-wrap__tile { filter: saturate(.55); opacity: .85; }
html body.mpj-ui .mpj-wrap__card > .mpj-wrap__tile { margin-bottom: 8px; }
html body.mpj-ui .mpj-wrap__rec { position: absolute; top: 14px; right: 14px; font-size: 10.5px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: #fff; padding: 3px 8px; border-radius: 999px; background: linear-gradient(135deg, var(--sec), color-mix(in srgb, var(--sec) 60%, #fff)); }
html body.mpj-ui .mpj-wrap__name { font-size: 12px; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; color: var(--sec); }
html body.mpj-ui .mpj-wrap__stat { font-size: 15.5px; font-weight: 600; color: var(--mpj-navy); }
html body.mpj-ui .mpj-wrap__stat b { font-size: 26px; font-weight: 800; letter-spacing: -.02em; margin-right: 4px; vertical-align: -2px; color: var(--mpj-navy); }
html body.mpj-ui .mpj-wrap__why { font-size: 13.5px; line-height: 1.45; color: var(--mpj-muted); flex: 1 1 auto; }
html body.mpj-ui .mpj-wrap__go { display: inline-flex; align-items: center; gap: 6px; margin-top: 10px; font-size: 14px; font-weight: 700; color: var(--sec); }
html body.mpj-ui .mpj-wrap__go svg { transition: transform .18s ease; }
html body.mpj-ui .mpj-wrap__card:hover .mpj-wrap__go svg { transform: translateX(3px); }

html body.mpj-ui .mpj-wrap__next { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: 18px; padding: 16px 18px; border-radius: 16px;
  background: linear-gradient(90deg, color-mix(in srgb, var(--mpj-navy) 6%, #fff), #fff); border: 1px solid var(--mpj-line, #e3e8ef); }
html body.mpj-ui .mpj-wrap__nextTxt { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
html body.mpj-ui .mpj-wrap__nextLbl { font-size: 11.5px; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; color: var(--mpj-faint); }
html body.mpj-ui .mpj-wrap__next.is-done .mpj-wrap__nextLbl { color: var(--w-green); }
html body.mpj-ui .mpj-wrap__nextName { font-size: 16px; font-weight: 700; color: var(--mpj-navy); overflow-wrap: anywhere; }
html body.mpj-ui .mpj-wrap__btn { display: inline-flex; align-items: center; gap: 8px; height: 44px; padding: 0 20px; border-radius: 12px; font-size: 14.5px; font-weight: 700; white-space: nowrap; text-decoration: none !important; }
html body.mpj-ui .mpj-wrap__btn.is-primary { color: #fff !important; background: linear-gradient(135deg, var(--mpj-blue), color-mix(in srgb, var(--mpj-blue) 70%, var(--mpj-navy))); box-shadow: 0 10px 20px -12px color-mix(in srgb, var(--mpj-blue) 90%, transparent); transition: transform .15s, box-shadow .15s; }
html body.mpj-ui .mpj-wrap__btn.is-primary:hover { transform: translateY(-1px); box-shadow: 0 14px 24px -12px color-mix(in srgb, var(--mpj-blue) 90%, transparent); }
html body.mpj-ui .mpj-wrap__nav { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-top: 14px; padding: 0 4px; }
html body.mpj-ui .mpj-wrap__nav a { font-size: 13.5px; font-weight: 600; color: var(--mpj-muted) !important; text-decoration: none !important; padding: 6px 8px; border-radius: 8px; }
html body.mpj-ui .mpj-wrap__nav a:hover { color: var(--mpj-navy) !important; background: var(--mpj-sunken, #f1f4f8); }
@container lesson (max-width: 640px) {
  html body.mpj-ui .mpj-wrap { padding: 20px 16px; border-radius: 16px; }
  html body.mpj-ui .mpj-wrap__head { flex-wrap: wrap; }
  html body.mpj-ui .mpj-wrap__ring { order: 3; width: 100%; }
  html body.mpj-ui .mpj-wrap__next { flex-direction: column; align-items: stretch; }
  html body.mpj-ui .mpj-wrap__btn { justify-content: center; }
}

/* =====================================================================
 * Figures: textbook plates. Numbered title above, takeaway below,
 * standardized diagram styling (padding, rounded nodes, clear arrows).
 * ===================================================================== */
html body.mpj-ui .medexp-lesson figure.medexp-figure,
html body.mpj-ui .medexp-lesson figure.medexp-diagram {
  --fig: var(--mpj-blue); --fig-line: color-mix(in srgb, var(--mpj-navy) 60%, var(--mpj-blue));
  margin: 28px 0 !important; padding: 0 !important; border-radius: 16px !important; overflow: hidden;
  background: #fff !important; border: 1px solid color-mix(in srgb, var(--fig) 16%, var(--mpj-line, #e3e8ef)) !important;
  box-shadow: 0 14px 30px -26px color-mix(in srgb, var(--mpj-navy) 70%, transparent) !important;
  display: flex !important; flex-direction: column;
}
html body.mpj-ui .medexp-lesson figure.medexp-figure--image { --fig: var(--mpj-teal); }
html body.mpj-ui .medexp-lesson figure.mpj-fig > figcaption { display: contents !important; }
html body.mpj-ui .mpj-fig-head { order: 0; display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; padding: 14px 20px 12px; border-bottom: 1px solid color-mix(in srgb, var(--fig) 12%, var(--mpj-line, #e3e8ef)); background: linear-gradient(90deg, color-mix(in srgb, var(--fig) 8%, #fff), #fff 70%); text-align: left; }
html body.mpj-ui .mpj-fig-num { flex: 0 0 auto; font-size: 11.5px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: #fff; padding: 3px 9px; border-radius: 7px; background: linear-gradient(135deg, var(--fig), color-mix(in srgb, var(--fig) 60%, #fff)); transform: translateY(-1px); }
html body.mpj-ui .mpj-fig-title { font-size: 15px; font-weight: 700; color: var(--mpj-navy); font-style: normal; line-height: 1.35; }
html body.mpj-ui .medexp-lesson figure.mpj-fig .medexp-figure__canvas,
html body.mpj-ui .medexp-lesson figure.mpj-fig > div:not(.mpj-fig-head):not(.mpj-fig-take) { order: 1; margin: 0 !important; padding: 22px 20px !important; background: radial-gradient(circle at 1px 1px, color-mix(in srgb, var(--fig) 10%, transparent) 1px, transparent 0) 0 0 / 18px 18px, #fff; }
html body.mpj-ui .medexp-lesson figure.mpj-fig.medexp-figure--image > div:not(.mpj-fig-head):not(.mpj-fig-take) { background: #fff; }
html body.mpj-ui .medexp-lesson figure.mpj-fig .medexp-figure__canvas img, html body.mpj-ui .medexp-lesson figure.mpj-fig > div img { border-radius: 10px; }
html body.mpj-ui .medexp-lesson figure.mpj-fig > pre { order: 2; }
html body.mpj-ui .mpj-fig-take { order: 3; display: flex; align-items: flex-start; gap: 10px; padding: 12px 20px 14px; border-top: 1px solid color-mix(in srgb, var(--fig) 12%, var(--mpj-line, #e3e8ef)); background: color-mix(in srgb, var(--fig) 5%, #fff); font-size: 14px; line-height: 1.5; color: var(--mpj-text); text-align: left; font-style: normal; }
html body.mpj-ui .mpj-fig-take b { color: var(--fig); font-weight: 700; margin-right: 4px; }
html body.mpj-ui .mpj-fig-take .mpj-tile { --sec-tile: linear-gradient(135deg, var(--fig), color-mix(in srgb, var(--fig) 55%, #fff)); margin-top: 1px; }
html body.mpj-ui .medexp-lesson figure.mpj-fig .medexp-mermaid-expand { top: 10px !important; right: 12px !important; }
@container lesson (max-width: 640px) {
  html body.mpj-ui .mpj-fig-head, html body.mpj-ui .mpj-fig-take { padding-left: 14px; padding-right: 14px; }
  html body.mpj-ui .medexp-lesson figure.mpj-fig .medexp-figure__canvas { padding: 16px 10px !important; }
}
/* Diagram drawing: clearer arrows, rounded nodes, breathing room on edge labels */
html body.mpj-ui .medexp-figure--mermaid svg .flowchart-link,
html body.mpj-ui .medexp-figure--mermaid svg .edgePath .path { stroke: var(--fig-line) !important; stroke-width: 1.8px !important; }
html body.mpj-ui .medexp-figure--mermaid svg marker path,
html body.mpj-ui .medexp-figure--mermaid svg .arrowheadPath { fill: var(--fig-line) !important; stroke: var(--fig-line) !important; }
html body.mpj-ui .medexp-figure--mermaid svg .node rect { rx: 10px; ry: 10px; }
html body.mpj-ui .medexp-figure--mermaid svg .node rect, html body.mpj-ui .medexp-figure--mermaid svg .node polygon, html body.mpj-ui .medexp-figure--mermaid svg .node circle { stroke-width: 1.4px !important; }
html body.mpj-ui .medexp-figure--mermaid svg .edgeLabel, html body.mpj-ui .medexp-figure--mermaid svg .edgeLabel p, html body.mpj-ui .medexp-figure--mermaid svg .labelBkg { background: #fff !important; background-color: #fff !important; }

/* Diagram lightbox: whole figure fits the screen, titled, no scrolling */
html body .medexp-mermaid-lightbox__inner { display: flex !important; flex-direction: column; overflow: hidden !important; padding: 0 !important; max-width: 96vw !important; max-height: 92vh !important; border-radius: 18px !important; }
html body .medexp-mermaid-lightbox__bar { display: flex; align-items: center; justify-content: space-between; gap: 12px; height: 56px; padding: 0 12px 0 20px; border-bottom: 1px solid var(--mpj-line, #e3e8ef); flex: 0 0 auto; }
html body .medexp-mermaid-lightbox__title { font: 700 15px/1.3 var(--mpj-sans, system-ui, sans-serif); color: var(--mpj-navy, #0f172a); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
html body .medexp-mermaid-lightbox__close { position: static !important; float: none !important; margin: 0 !important; flex: 0 0 auto; width: 36px !important; height: 36px !important; border-radius: 10px !important; }
html body .medexp-mermaid-lightbox__stage { display: flex; align-items: center; justify-content: center; padding: 20px 28px; overflow: hidden; }
@media (max-width: 639px) { html body .medexp-mermaid-lightbox__stage { padding: 12px; } }
html body .medexp-mermaid-lightbox__inner svg { height: auto; max-height: none !important; }
html body .medexp-mermaid-lightbox svg .flowchart-link, html body .medexp-mermaid-lightbox svg .edgePath .path { stroke: color-mix(in srgb, var(--mpj-navy) 60%, var(--mpj-blue)) !important; stroke-width: 1.8px !important; }
html body .medexp-mermaid-lightbox svg marker path { fill: color-mix(in srgb, var(--mpj-navy) 60%, var(--mpj-blue)) !important; stroke: color-mix(in srgb, var(--mpj-navy) 60%, var(--mpj-blue)) !important; }
html body .medexp-mermaid-lightbox svg .node rect { rx: 10px; ry: 10px; }

/* =====================================================================
 * Tables: textbook plates with a numbered title, tinted header,
 * strong first column, quiet zebra rows.
 * ===================================================================== */
html body.mpj-ui .medexp-lesson .medexp-table__wrap {
  --tb: var(--sec, var(--mpj-blue));
  margin: 24px 0 !important; border-radius: 16px !important; overflow: hidden !important; overflow-x: auto !important;
  background: #fff !important; border: 1px solid color-mix(in srgb, var(--tb) 16%, var(--mpj-line, #e3e8ef)) !important;
  box-shadow: 0 14px 30px -26px color-mix(in srgb, var(--mpj-navy) 70%, transparent) !important;
}
html body.mpj-ui .mpj-tbl-head { position: sticky; left: 0; display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; padding: 14px 18px 12px; border-bottom: 1px solid color-mix(in srgb, var(--tb) 14%, var(--mpj-line, #e3e8ef)); background: linear-gradient(90deg, color-mix(in srgb, var(--tb) 8%, #fff), #fff 70%); }
html body.mpj-ui .mpj-tbl-num { flex: 0 0 auto; font-size: 11.5px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: #fff; padding: 3px 9px; border-radius: 7px; background: linear-gradient(135deg, var(--tb), color-mix(in srgb, var(--tb) 60%, #fff)); transform: translateY(-1px); }
html body.mpj-ui .mpj-tbl-title { font-size: 15px; font-weight: 700; color: var(--mpj-navy); line-height: 1.35; }
html body.mpj-ui .medexp-lesson .medexp-table__wrap > table { margin: 0 !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; width: 100%; border-collapse: collapse !important; }
html body.mpj-ui .medexp-lesson .medexp-table__wrap > table caption.mpj-sr { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
html body.mpj-ui .medexp-lesson .medexp-table__wrap thead th { background: color-mix(in srgb, var(--tb) 7%, #fff) !important; color: var(--mpj-navy) !important; font-size: 12.5px !important; font-weight: 700 !important; letter-spacing: .04em; text-transform: uppercase; padding: 12px 16px !important; border-bottom: 2px solid color-mix(in srgb, var(--tb) 30%, #fff) !important; vertical-align: bottom; }
html body.mpj-ui .medexp-lesson .medexp-table__wrap tbody td { padding: 12px 16px !important; font-size: 14.5px; line-height: 1.5; vertical-align: top; border-bottom: 1px solid color-mix(in srgb, var(--mpj-line, #e3e8ef) 80%, #fff) !important; }
html body.mpj-ui .medexp-lesson .medexp-table__wrap tbody tr:nth-child(even) td { background: color-mix(in srgb, var(--tb) 2.5%, #fff); }
html body.mpj-ui .medexp-lesson .medexp-table__wrap tbody tr:last-child td { border-bottom: 0 !important; }
html body.mpj-ui .medexp-lesson .medexp-table__wrap tbody tr:hover td { background: color-mix(in srgb, var(--tb) 6%, #fff) !important; }
html body.mpj-ui .medexp-lesson .medexp-table__wrap tbody td:first-child { font-weight: 600; color: var(--mpj-navy); }

/* Arrow labels: plain white background, same size Mermaid measured (no outline, no font change) */
html body.mpj-ui .medexp-figure--mermaid svg .edgeLabel, html body.mpj-ui .medexp-mermaid-lightbox svg .edgeLabel { color: var(--mpj-muted) !important; box-shadow: none !important; }
html body.mpj-ui .medexp-figure--mermaid svg .edgeLabel foreignObject, html body.mpj-ui .medexp-figure--mermaid svg foreignObject { overflow: visible !important; }
/* Figure plates always span the full text column, header and takeaway edge to edge */
html body.mpj-ui .medexp-lesson figure.mpj-fig { align-items: stretch !important; width: 100% !important; max-width: none !important; box-sizing: border-box; }
html body.mpj-ui .medexp-lesson figure.mpj-fig .mpj-fig-head, html body.mpj-ui .medexp-lesson figure.mpj-fig .mpj-fig-take { font-style: normal !important; text-align: left !important; }
html body.mpj-ui .medexp-lesson figure.mpj-fig .medexp-figure__canvas { display: flex; justify-content: center; }
html body.mpj-ui .medexp-figure--mermaid svg .edgeLabel:empty, html body.mpj-ui .medexp-figure--mermaid svg .labelBkg:empty { background: transparent !important; }
html body.mpj-ui .medexp-lesson figure.mpj-fig .medexp-figure__canvas { width: 100% !important; max-width: none !important; box-sizing: border-box; }
html body.mpj-ui .medexp-lesson figure.mpj-fig .medexp-figure__canvas > img { max-width: 100%; height: auto; margin: 0 auto !important; }
/* Arrow-label boxes (drawn by lesson-header.js) */
html body .medexp-figure--mermaid svg rect.mpj-edge-box, html body .medexp-mermaid-lightbox svg rect.mpj-edge-box { opacity: 1 !important; fill-opacity: 1 !important; fill: #fff !important; stroke: color-mix(in srgb, var(--mpj-navy, #1e293b) 26%, #fff) !important; stroke-width: 1px !important; }
/* Images: natural proportions, capped height, never upscaled; click to view full size */
html body.mpj-ui .medexp-lesson figure.medexp-figure--image .medexp-figure__canvas { padding: 20px !important; background: color-mix(in srgb, var(--fig) 3%, #fff) !important; }
html body.mpj-ui .medexp-lesson figure.medexp-figure--image img {
  width: auto !important; max-width: min(100%, 760px) !important; max-height: min(460px, 62vh) !important; height: auto !important;
  object-fit: contain; margin: 0 auto !important; display: block; border-radius: 10px !important;
  border: 1px solid color-mix(in srgb, var(--fig) 14%, var(--mpj-line, #e3e8ef)) !important; box-shadow: 0 8px 20px -14px rgba(15,23,42,.35) !important; background: #fff;
  cursor: zoom-in; transition: transform .18s ease, box-shadow .18s ease;
}
html body.mpj-ui .medexp-lesson figure.medexp-figure--image img:hover { box-shadow: 0 14px 28px -16px rgba(15,23,42,.45) !important; }
html body.mpj-ui .medexp-lesson figure.medexp-figure--image a { width: auto !important; display: block; }
@container lesson (max-width: 640px) { html body.mpj-ui .medexp-lesson figure.medexp-figure--image img { max-height: 70vh !important; } }
.mpj-imgbox { position: fixed; inset: 0; z-index: 999999; display: flex; align-items: center; justify-content: center; padding: 3vh 3vw; background: rgba(2,6,23,.78); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); cursor: zoom-out; opacity: 0; transition: opacity .18s ease; }
.mpj-imgbox.is-on { opacity: 1; }
.mpj-imgbox img { max-width: 94vw; max-height: 90vh; width: auto; height: auto; object-fit: contain; border-radius: 12px; background: #fff; box-shadow: 0 20px 60px rgba(0,0,0,.4); }
.mpj-imgbox__cap { position: absolute; left: 0; right: 0; bottom: 2vh; text-align: center; color: #fff; font: 600 14px/1.4 var(--mpj-sans, system-ui, sans-serif); padding: 0 16px; text-shadow: 0 1px 3px rgba(0,0,0,.6); }
/* Diagram text stays at the size Mermaid measured (reading-size scaling must not reach inside diagrams) */
html body.mpj-ui .medexp-figure--mermaid svg foreignObject, html body.mpj-ui .medexp-figure--mermaid svg foreignObject * { font-size: 16px !important; line-height: 1.5 !important; letter-spacing: normal !important; }
/* Brand bar: compact, no forced height (it no longer mirrors the lesson header) */
html body.mpj-ui .medexp-lessonRail .medexp-lessonBrand { height: auto !important; min-height: 0 !important; padding: 14px 16px 6px !important; border-bottom: 0 !important; background: transparent !important; }
html body.mpj-ui .medexp-lessonRail .medexp-lessonBrand__link { padding: 4px 8px !important; }
html body.mpj-ui .medexp-lessonRail .medexp-lessonBrand__logo { max-height: 52px !important; }
html body.mpj-ui.mpj-site-medexprep .medexp-lessonRail .medexp-lessonBrand__logo { max-height: 42px !important; }
html body.mpj-ui .medexp-lessonRail .medexp-courseSearch > button.mpj-cs-close { position: absolute !important; top: 8px !important; right: 8px !important; left: auto !important; width: 26px !important; height: 26px !important; min-height: 0 !important; padding: 0 !important; display: inline-flex !important; align-items: center; justify-content: center; background: transparent !important; color: var(--mpj-faint) !important; border: 0 !important; box-shadow: none !important; border-radius: 8px !important; z-index: 2; }
html body.mpj-ui .medexp-lessonRail .medexp-courseSearch > button.mpj-cs-close:hover { background: var(--mpj-sunken, #f1f4f8) !important; color: var(--mpj-text) !important; }
html body.mpj-ui .medexp-lessonRail .medexp-courseSearch > button.mpj-cs-close svg { display: block !important; width: 14px; height: 14px; }
@media (min-width: 860px) { html.mpj-search-hidden body.mpj-ui .medexp-lessonRail .medexp-courseSearch { display: none !important; } }
@media (max-width: 859px) { html body.mpj-ui .medexp-lessonRail .medexp-courseSearch > button.mpj-cs-close { display: none !important; } }
html body.mpj-ui .medexp-lessonRail .medexp-courseSearch { position: relative !important; }
html body.mpj-ui .medexp-lesson .medexp-hlet { margin-right: 10px !important; }
html body.mpj-ui .medexp-lesson .medexp-hnum { margin-right: 10px !important; }
/* The drawn label box supplies the white fill; inner label backgrounds would cover its border */
html body .medexp-figure--mermaid svg g.edgeLabel .labelBkg, html body .medexp-figure--mermaid svg g.edgeLabel span.edgeLabel, html body .medexp-figure--mermaid svg g.edgeLabel p,
html body .medexp-mermaid-lightbox svg g.edgeLabel .labelBkg, html body .medexp-mermaid-lightbox svg g.edgeLabel span.edgeLabel, html body .medexp-mermaid-lightbox svg g.edgeLabel p { background: transparent !important; background-color: transparent !important; }
/* Search close button lives in the card's title row */
html body.mpj-ui .medexp-lessonRail .medexp-courseSearch__head { display: flex !important; align-items: center; justify-content: space-between; gap: 8px; margin: 0 0 8px !important; }
html body.mpj-ui .medexp-lessonRail .medexp-courseSearch__head .medexp-courseSearch__title { margin: 0 !important; }
html body.mpj-ui .medexp-lessonRail .medexp-courseSearch button.mpj-cs-close { position: static !important; margin: -4px -4px -4px 0 !important; }
@media (min-width: 860px) { html.mpj-search-hidden body .medexp-lessonRail .medexp-courseSearch { display: none !important; } }
/* Pinned logo bar keeps a solid background so the outline never shows through */
html body.mpj-ui .medexp-lessonRail .medexp-lessonBrand { position: sticky !important; top: 0 !important; z-index: 5 !important; background: #fbfcfd !important; border-bottom: 1px solid color-mix(in srgb, var(--mpj-line, #e3e8ef) 70%, transparent) !important; padding-bottom: 10px !important; }
/* Close button visuals (it now sits in the title row, so match it anywhere in the card) */
html body.mpj-ui .medexp-lessonRail .medexp-courseSearch button.mpj-cs-close { width: 26px !important; height: 26px !important; min-height: 0 !important; padding: 0 !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; flex: 0 0 auto; background: var(--mpj-sunken, #f1f4f8) !important; color: var(--mpj-muted, #5b6474) !important; border: 1px solid var(--mpj-line, #e3e8ef) !important; border-radius: 8px !important; box-shadow: none !important; cursor: pointer; }
html body.mpj-ui .medexp-lessonRail .medexp-courseSearch button.mpj-cs-close:hover { background: #fff !important; color: var(--mpj-navy) !important; border-color: color-mix(in srgb, var(--mpj-navy) 25%, #fff) !important; }
html body.mpj-ui .medexp-lessonRail .medexp-courseSearch button.mpj-cs-close svg { display: block !important; width: 13px !important; height: 13px !important; stroke: currentColor !important; fill: none !important; opacity: 1 !important; visibility: visible !important; }
/* Follow-along on figures, diagram steps and table rows: clearly visible, never hidden by the plate styling */
html body.mpj-ui .medexp-lesson figure.mpj-fig.mpj-reading, html body.mpj-ui .medexp-lesson .medexp-table__wrap:has(> table.mpj-reading) {
  box-shadow: 0 0 0 3px #fff, 0 0 0 6px color-mix(in srgb, var(--mpj-blue) 70%, #fff), 0 18px 40px -24px color-mix(in srgb, var(--mpj-blue) 60%, transparent) !important;
}
html body.mpj-ui .medexp-lesson .medexp-flow__step.mpj-reading { background: var(--mpj-blue-soft) !important; box-shadow: 0 0 0 2px color-mix(in srgb, var(--mpj-blue) 55%, #fff) !important; border-radius: 10px; }
html body.mpj-ui .medexp-lesson tr.mpj-reading { box-shadow: none !important; background: transparent !important; animation: none !important; }
html body.mpj-ui .medexp-lesson tr.mpj-reading > td, html body.mpj-ui .medexp-lesson tr.mpj-reading > th { background: var(--mpj-blue-soft) !important; }
html body.mpj-ui .medexp-lesson tr.mpj-reading > td:first-child { box-shadow: inset 3px 0 0 var(--mpj-blue); }
html body.mpj-ui .medexp-figure--mermaid svg foreignObject p.mpj-reading { box-shadow: none !important; background: color-mix(in srgb, var(--mpj-blue) 18%, #fff) !important; border-radius: 4px; animation: none !important; }
html body.mpj-ui .medexp-lesson .mpj-read-done:not(tr):not(figure) { opacity: .92; }
/* Diagram boxes: soft top-to-bottom gradient and a gentle lift */
html body .medexp-figure--mermaid svg.mpj-graded .node rect, html body .medexp-mermaid-lightbox svg.mpj-graded .node rect { fill: url(#mpj-node-grad) !important; }
html body .medexp-figure--mermaid svg.mpj-graded .node polygon, html body .medexp-mermaid-lightbox svg.mpj-graded .node polygon { fill: url(#mpj-dec-grad) !important; stroke: color-mix(in srgb, var(--mpj-teal, #0f7d79) 40%, #fff) !important; }
html body .medexp-figure--mermaid svg.mpj-graded .node rect, html body .medexp-figure--mermaid svg.mpj-graded .node polygon,
html body .medexp-mermaid-lightbox svg.mpj-graded .node rect, html body .medexp-mermaid-lightbox svg.mpj-graded .node polygon { filter: drop-shadow(0 2px 3px rgba(15, 23, 42, .08)); }

/* =====================================================================
 * Session summary (qbank.js initSessionSummary, mpj-ui)
 * ===================================================================== */
html body.mpj-ui .mpj-ssum {
  --ok: color-mix(in srgb, #16a34a 80%, var(--mpj-blue)); --bad: color-mix(in srgb, #e11d48 82%, var(--mpj-blue)); --skip: color-mix(in srgb, #64748b 85%, var(--mpj-blue)); --tone: var(--mpj-blue);
  display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 24px;
  padding: 26px 28px; margin: 0 0 16px; border-radius: 20px; position: relative; overflow: hidden;
  background: linear-gradient(135deg, color-mix(in srgb, var(--tone) 9%, #fff) 0%, #fff 65%);
  border: 1px solid color-mix(in srgb, var(--tone) 18%, var(--mpj-line, #e3e8ef));
  box-shadow: 0 18px 40px -32px color-mix(in srgb, var(--mpj-navy) 60%, transparent);
}
html body.mpj-ui .mpj-ssum::after { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 4px; background: linear-gradient(90deg, var(--tone), color-mix(in srgb, var(--tone) 35%, #fff) 70%, transparent); }
html body.mpj-ui .mpj-ssum.is-good { --tone: color-mix(in srgb, #16a34a 75%, var(--mpj-blue)); }
html body.mpj-ui .mpj-ssum.is-mid { --tone: var(--mpj-blue); }
html body.mpj-ui .mpj-ssum.is-low { --tone: color-mix(in srgb, #d97706 80%, var(--mpj-blue)); }
html body.mpj-ui .mpj-ssum__ring { --c: var(--tone); width: 124px; height: 124px; border-radius: 50%; display: flex; flex-direction: column; align-items: center; justify-content: center;
  background: radial-gradient(closest-side, #fff 78%, transparent 80% 100%), conic-gradient(var(--c) calc(var(--p) * 1%), color-mix(in srgb, var(--c) 13%, #fff) 0); }
html body.mpj-ui .mpj-ssum__ring.is-good { --c: color-mix(in srgb, #16a34a 75%, var(--mpj-blue)); }
html body.mpj-ui .mpj-ssum__ring.is-mid { --c: var(--mpj-blue); }
html body.mpj-ui .mpj-ssum__ring.is-low { --c: color-mix(in srgb, #d97706 80%, var(--mpj-blue)); }
html body.mpj-ui .mpj-ssum__ringNum { font: 800 34px/1 var(--mpj-sans); color: var(--mpj-navy); letter-spacing: -.02em; }
html body.mpj-ui .mpj-ssum__ringNum small { font-size: 16px; font-weight: 700; margin-left: 1px; }
html body.mpj-ui .mpj-ssum__ringLbl { margin-top: 4px; font: 700 11px/1 var(--mpj-sans); letter-spacing: .08em; text-transform: uppercase; color: var(--mpj-muted); }
html body.mpj-ui .mpj-ssum__eyebrow { font: 700 11.5px/1.2 var(--mpj-sans); letter-spacing: .08em; text-transform: uppercase; color: var(--tone); }
html body.mpj-ui .mpj-ssum__title { margin: 4px 0 6px !important; font: 700 clamp(22px, 2.2vw, 28px)/1.2 var(--mpj-serif, var(--mpj-sans)) !important; color: var(--mpj-navy) !important; letter-spacing: -.01em; }
html body.mpj-ui .mpj-ssum__verdict { font-size: 15.5px; color: var(--mpj-text); line-height: 1.5; }
html body.mpj-ui .mpj-ssum__verdict strong { color: var(--mpj-navy); }
html body.mpj-ui .mpj-ssum__chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
html body.mpj-ui .mpj-ssum__chip { font: 600 12.5px/1 var(--mpj-sans); padding: 7px 11px; border-radius: 999px; background: #fff; border: 1px solid var(--mpj-line, #e3e8ef); color: var(--mpj-muted); }
html body.mpj-ui .mpj-ssum__chip.is-warn { color: var(--skip); border-color: color-mix(in srgb, var(--skip) 30%, #fff); background: color-mix(in srgb, var(--skip) 7%, #fff); }
html body.mpj-ui .mpj-ssum__cta { display: flex; flex-direction: column; gap: 8px; min-width: 190px; }
html body.mpj-ui .mpj-ssum__cta .medexp-btn { justify-content: center; text-align: center; }
html body.mpj-ui .mpj-ssum__tiles { --ok: color-mix(in srgb, #16a34a 80%, var(--mpj-blue)); --bad: color-mix(in srgb, #e11d48 82%, var(--mpj-blue)); --skip: color-mix(in srgb, #64748b 85%, var(--mpj-blue)); display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin: 0 0 16px; }
html body.mpj-ui .mpj-ssum__tile { --t: var(--mpj-blue); display: flex; align-items: flex-start; gap: 12px; padding: 16px; border-radius: 16px; background: linear-gradient(180deg, color-mix(in srgb, var(--t) 7%, #fff), #fff 90px); border: 1px solid color-mix(in srgb, var(--t) 18%, var(--mpj-line, #e3e8ef)); }
html body.mpj-ui .mpj-ssum__tile[data-k="ok"] { --t: var(--ok); }
html body.mpj-ui .mpj-ssum__tile[data-k="bad"] { --t: var(--bad); }
html body.mpj-ui .mpj-ssum__tile[data-k="skip"] { --t: var(--skip); }
html body.mpj-ui .mpj-ssum__tile[data-k="time"] { --t: var(--mpj-navy); }
html body.mpj-ui .mpj-ssum__tileIco { flex: 0 0 auto; width: 34px; height: 34px; border-radius: 10px; display: inline-flex; align-items: center; justify-content: center; color: #fff; background: linear-gradient(135deg, var(--t), color-mix(in srgb, var(--t) 55%, #fff)); box-shadow: 0 6px 14px -8px var(--t); }
html body.mpj-ui .mpj-ssum__tileIco svg { display: block !important; }
html body.mpj-ui .mpj-ssum__tileVal { font: 800 26px/1 var(--mpj-sans); color: var(--mpj-navy); letter-spacing: -.02em; }
html body.mpj-ui .mpj-ssum__tileLbl { margin-top: 4px; font: 700 12px/1.2 var(--mpj-sans); letter-spacing: .06em; text-transform: uppercase; color: var(--t); }
html body.mpj-ui .mpj-ssum__tileSub { margin-top: 4px; font-size: 12.5px; color: var(--mpj-muted); }
html body.mpj-ui .mpj-ssum__card { --ok: color-mix(in srgb, #16a34a 80%, var(--mpj-blue)); --bad: color-mix(in srgb, #e11d48 82%, var(--mpj-blue)); --skip: color-mix(in srgb, #64748b 85%, var(--mpj-blue)); padding: 20px 22px; margin: 0 0 16px; border-radius: 18px; background: #fff; border: 1px solid var(--mpj-line, #e3e8ef); }
html body.mpj-ui .mpj-ssum__cardHead { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-bottom: 14px; }
html body.mpj-ui .mpj-ssum__cardHead h3 { margin: 0 !important; font: 700 17px/1.3 var(--mpj-sans) !important; color: var(--mpj-navy) !important; }
html body.mpj-ui .mpj-ssum__legend { display: flex; gap: 14px; font: 600 12.5px/1 var(--mpj-sans); color: var(--mpj-muted); }
html body.mpj-ui .mpj-ssum__legend span::before { content: ""; display: inline-block; width: 10px; height: 10px; border-radius: 3px; margin-right: 6px; vertical-align: -1px; }
html body.mpj-ui .mpj-ssum__legend .is-ok::before { background: var(--ok); }
html body.mpj-ui .mpj-ssum__legend .is-bad::before { background: var(--bad); }
html body.mpj-ui .mpj-ssum__legend .is-skip::before { background: color-mix(in srgb, var(--skip) 30%, #fff); border: 1px dashed var(--skip); box-sizing: border-box; }
html body.mpj-ui .mpj-ssum__map { display: grid; grid-template-columns: repeat(auto-fill, minmax(42px, 1fr)); gap: 8px; }
html body.mpj-ui .mpj-ssum__q { position: relative; display: flex; align-items: center; justify-content: center; height: 42px; border-radius: 10px; font: 700 14px/1 var(--mpj-sans); text-decoration: none !important; transition: transform .12s, box-shadow .12s; }
html body.mpj-ui .mpj-ssum__q:hover { transform: translateY(-2px); box-shadow: 0 8px 16px -10px rgba(15,23,42,.5); }
html body.mpj-ui .mpj-ssum__q.is-ok { color: #fff !important; background: linear-gradient(135deg, var(--ok), color-mix(in srgb, var(--ok) 70%, #fff)); }
html body.mpj-ui .mpj-ssum__q.is-bad { color: #fff !important; background: linear-gradient(135deg, var(--bad), color-mix(in srgb, var(--bad) 70%, #fff)); }
html body.mpj-ui .mpj-ssum__q.is-skip { color: var(--skip) !important; background: color-mix(in srgb, var(--skip) 7%, #fff); border: 1.5px dashed color-mix(in srgb, var(--skip) 55%, #fff); }
html body.mpj-ui .mpj-ssum__q.is-marked::after { content: ""; position: absolute; top: 4px; right: 4px; width: 7px; height: 7px; border-radius: 50%; background: #f59e0b; box-shadow: 0 0 0 2px #fff; }
html body.mpj-ui .mpj-ssum__hint { margin-top: 10px; font-size: 12.5px; color: var(--mpj-faint); }
html body.mpj-ui .mpj-ssum__steps { list-style: none !important; margin: 0 !important; padding: 0 !important; display: grid; gap: 10px; }
html body.mpj-ui .mpj-ssum__steps li { --t: var(--mpj-blue); display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 14px; padding: 14px 16px; border-radius: 14px; background: linear-gradient(90deg, color-mix(in srgb, var(--t) 7%, #fff), #fff 70%); border: 1px solid color-mix(in srgb, var(--t) 16%, var(--mpj-line, #e3e8ef)); }
html body.mpj-ui .mpj-ssum__steps li[data-k="bad"] { --t: var(--bad); }
html body.mpj-ui .mpj-ssum__steps li[data-k="skip"] { --t: var(--skip); }
html body.mpj-ui .mpj-ssum__steps li[data-k="weak"] { --t: color-mix(in srgb, #d97706 80%, var(--mpj-blue)); }
html body.mpj-ui .mpj-ssum__steps li[data-k="ok"] { --t: var(--ok); }
html body.mpj-ui .mpj-ssum__stepNum { width: 30px; height: 30px; border-radius: 9px; display: inline-flex; align-items: center; justify-content: center; color: #fff; font: 800 14px/1 var(--mpj-sans); background: linear-gradient(135deg, var(--t), color-mix(in srgb, var(--t) 55%, #fff)); }
html body.mpj-ui .mpj-ssum__stepBody { display: flex; flex-direction: column; gap: 3px; }
html body.mpj-ui .mpj-ssum__stepBody strong { color: var(--mpj-navy); font-size: 15px; }
html body.mpj-ui .mpj-ssum__stepBody span { color: var(--mpj-muted); font-size: 13.5px; line-height: 1.45; }
@media (max-width: 900px) {
  html body.mpj-ui .mpj-ssum { grid-template-columns: auto minmax(0, 1fr); }
  html body.mpj-ui .mpj-ssum__cta { grid-column: 1 / -1; flex-direction: row; flex-wrap: wrap; }
  html body.mpj-ui .mpj-ssum__tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 560px) {
  html body.mpj-ui .mpj-ssum { grid-template-columns: 1fr; justify-items: start; padding: 20px; }
  html body.mpj-ui .mpj-ssum__ring { width: 104px; height: 104px; }
  html body.mpj-ui .mpj-ssum__steps li { grid-template-columns: auto minmax(0, 1fr); }
  html body.mpj-ui .mpj-ssum__steps li > .medexp-btn { grid-column: 2; justify-self: start; }
}

/* Unfinished session panel (Summary and Review) */
html body.mpj-ui .mpj-unf { display: flex; gap: 18px; align-items: flex-start; padding: 26px 28px; border-radius: 20px; background: linear-gradient(135deg, color-mix(in srgb, var(--mpj-blue) 8%, #fff), #fff 70%); border: 1px solid color-mix(in srgb, var(--mpj-blue) 18%, var(--mpj-line, #e3e8ef)); }
html body.mpj-ui .mpj-unf__icon { flex: 0 0 auto; width: 46px; height: 46px; border-radius: 14px; display: inline-flex; align-items: center; justify-content: center; color: #fff; background: linear-gradient(135deg, var(--mpj-blue), color-mix(in srgb, var(--mpj-blue) 55%, #fff)); }
html body.mpj-ui .mpj-unf__icon svg { display: block !important; }
html body.mpj-ui .mpj-unf__main { flex: 1 1 auto; min-width: 0; }
html body.mpj-ui .mpj-unf__eyebrow { font: 700 11.5px/1.2 var(--mpj-sans); letter-spacing: .08em; text-transform: uppercase; color: var(--mpj-blue); }
html body.mpj-ui .mpj-unf__title { margin: 4px 0 12px; font: 700 21px/1.3 var(--mpj-sans); color: var(--mpj-navy); }
html body.mpj-ui .mpj-unf__bar { height: 8px; border-radius: 999px; background: color-mix(in srgb, var(--mpj-blue) 12%, #fff); overflow: hidden; max-width: 460px; }
html body.mpj-ui .mpj-unf__bar span { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--mpj-blue), color-mix(in srgb, var(--mpj-blue) 60%, #fff)); }
html body.mpj-ui .mpj-unf__text { margin-top: 12px; font-size: 14.5px; line-height: 1.55; color: var(--mpj-muted); max-width: 620px; }
html body.mpj-ui .mpj-unf__actions { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 16px; }
html body.mpj-ui .mpj-unf__msg { margin-top: 10px; color: #b91c1c; font-size: 13.5px; }
@media (max-width: 560px) { html body.mpj-ui .mpj-unf { flex-direction: column; padding: 20px; } }

/* =====================================================================
 * Session review (qbank.js initSessionReview, mpj-ui)
 * ===================================================================== */
html body.mpj-ui .medexp-qb-sessionReview { --ok: color-mix(in srgb, #16a34a 80%, var(--mpj-blue)); --bad: color-mix(in srgb, #e11d48 82%, var(--mpj-blue)); --skip: color-mix(in srgb, #64748b 85%, var(--mpj-blue)); align-items: start !important; }
/* Question list: sticky, compact, status-colored numbers */
html body.mpj-ui .medexp-qb-sessionReview .medexp-sr-left { position: sticky !important; top: 72px; max-height: calc(100vh - 96px); overflow-y: auto; padding: 16px !important; border-radius: 18px !important; }
html body.mpj-ui .medexp-sr-left__title { font: 700 12px/1 var(--mpj-sans) !important; letter-spacing: .08em; text-transform: uppercase; color: var(--mpj-muted) !important; margin: 2px 4px 12px !important; }
html body.mpj-ui .medexp-sr-list { display: grid !important; gap: 6px !important; }
html body.mpj-ui .medexp-sr-row { display: flex !important; align-items: center; gap: 10px !important; min-height: 44px; padding: 6px 10px !important; border-radius: 12px !important; border: 1px solid transparent !important; background: transparent !important; box-shadow: none !important; transition: background .15s, border-color .15s; text-align: left; }
html body.mpj-ui .medexp-sr-row:hover { background: var(--mpj-sunken, #f1f4f8) !important; }
html body.mpj-ui .medexp-sr-row.is-active { background: color-mix(in srgb, var(--mpj-blue) 8%, #fff) !important; border-color: color-mix(in srgb, var(--mpj-blue) 30%, #fff) !important; }
html body.mpj-ui .medexp-sr-row__dot { display: none !important; }
html body.mpj-ui .medexp-sr-row__n { flex: 0 0 auto; width: 30px !important; height: 30px !important; border-radius: 9px !important; display: inline-flex !important; align-items: center; justify-content: center; font: 800 13px/1 var(--mpj-sans) !important; border: 0 !important; color: var(--skip) !important; background: color-mix(in srgb, var(--skip) 10%, #fff) !important; }
html body.mpj-ui .medexp-sr-row:has(.medexp-sr-row__dot.is-ok) .medexp-sr-row__n { color: #fff !important; background: linear-gradient(135deg, var(--ok), color-mix(in srgb, var(--ok) 65%, #fff)) !important; }
html body.mpj-ui .medexp-sr-row:has(.medexp-sr-row__dot.is-bad) .medexp-sr-row__n { color: #fff !important; background: linear-gradient(135deg, var(--bad), color-mix(in srgb, var(--bad) 65%, #fff)) !important; }
html body.mpj-ui .medexp-sr-row__type { font: 600 13.5px/1.35 var(--mpj-sans) !important; color: var(--mpj-text) !important; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
html body.mpj-ui .medexp-sr-row:has(.medexp-sr-row__dot.is-bad) .medexp-sr-row__type { color: var(--bad) !important; }
html body.mpj-ui .medexp-sr-row:has(.medexp-sr-row__dot.is-ok) .medexp-sr-row__type { color: var(--mpj-text) !important; }
/* Review header */
html body.mpj-ui .medexp-sr-head { padding: 20px 22px !important; border-radius: 18px !important; background: linear-gradient(135deg, color-mix(in srgb, var(--mpj-blue) 7%, #fff), #fff 65%) !important; border: 1px solid color-mix(in srgb, var(--mpj-blue) 16%, var(--mpj-line, #e3e8ef)) !important; box-shadow: none !important; }
html body.mpj-ui .medexp-sr-head__title { font: 700 clamp(19px, 1.8vw, 23px)/1.25 var(--mpj-serif, var(--mpj-sans)) !important; color: var(--mpj-navy) !important; margin: 0 0 12px !important; }
html body.mpj-ui .medexp-sr-tabs { display: inline-flex !important; gap: 4px !important; padding: 4px; border-radius: 12px; background: var(--mpj-sunken, #f1f4f8); }
html body.mpj-ui .medexp-sr-tab { display: inline-flex !important; align-items: center; gap: 8px; height: 34px; padding: 0 12px !important; border-radius: 9px !important; border: 0 !important; background: transparent !important; box-shadow: none !important; font: 600 13.5px/1 var(--mpj-sans) !important; color: var(--mpj-muted) !important; }
html body.mpj-ui .medexp-sr-tab.is-active { background: #fff !important; color: var(--mpj-navy) !important; box-shadow: 0 1px 3px rgba(15,23,42,.12) !important; }
html body.mpj-ui .medexp-sr-tab__count { min-width: 22px; height: 20px; padding: 0 6px; border-radius: 999px; display: inline-flex; align-items: center; justify-content: center; font: 700 11.5px/1 var(--mpj-sans) !important; background: color-mix(in srgb, var(--mpj-blue) 10%, #fff) !important; color: var(--mpj-blue) !important; }
html body.mpj-ui .medexp-sr-meta { margin: 12px 0 0 !important; }
html body.mpj-ui .medexp-sr-meta .medexp-qb-chip { text-transform: capitalize; font-weight: 600 !important; }
html body.mpj-ui .medexp-sr-quick { margin-top: 14px !important; display: flex; gap: 8px; flex-wrap: wrap; }
/* Question bar, stem, choices */
html body.mpj-ui .medexp-sr-qwrap .medexp-qb-nav { padding: 12px 16px !important; border-radius: 14px !important; }
html body.mpj-ui .medexp-sr-qwrap .medexp-qb-nav__count { font: 800 16px/1 var(--mpj-sans) !important; color: var(--mpj-navy) !important; }
html body.mpj-ui .medexp-sr-qwrap .medexp-qb-result { font-weight: 700 !important; border-radius: 999px !important; }
html body.mpj-ui .medexp-sr-qwrap .medexp-qb-stem { position: relative; padding: 22px 24px 22px 28px !important; border-radius: 16px !important; background: #fff !important; border: 1px solid var(--mpj-line, #e3e8ef) !important; font-size: 16.5px !important; line-height: 1.7 !important; color: var(--mpj-text) !important; }
html body.mpj-ui .medexp-sr-qwrap .medexp-qb-stem::before { content: ""; position: absolute; left: 0; top: 14px; bottom: 14px; width: 4px; border-radius: 0 4px 4px 0; background: linear-gradient(180deg, var(--mpj-blue), color-mix(in srgb, var(--mpj-blue) 40%, #fff)); }
html body.mpj-ui .medexp-sr-qwrap .medexp-qb-choice { border-radius: 14px !important; transition: box-shadow .15s; }
html body.mpj-ui .medexp-sr-qwrap .medexp-qb-choice.is-missed, html body.mpj-ui .medexp-sr-qwrap .medexp-qb-choice.is-correct { background: linear-gradient(90deg, color-mix(in srgb, var(--ok) 10%, #fff), #fff 80%) !important; border-color: color-mix(in srgb, var(--ok) 55%, #fff) !important; box-shadow: inset 4px 0 0 var(--ok) !important; }
html body.mpj-ui .medexp-sr-qwrap .medexp-qb-choice.is-wrong { background: linear-gradient(90deg, color-mix(in srgb, var(--bad) 9%, #fff), #fff 80%) !important; border-color: color-mix(in srgb, var(--bad) 50%, #fff) !important; box-shadow: inset 4px 0 0 var(--bad) !important; }
html body.mpj-ui .medexp-sr-qwrap .medexp-qb-choice.is-missed .medexp-qb-choice__label, html body.mpj-ui .medexp-sr-qwrap .medexp-qb-choice.is-correct .medexp-qb-choice__label { color: #fff !important; background: linear-gradient(135deg, var(--ok), color-mix(in srgb, var(--ok) 60%, #fff)) !important; border-color: transparent !important; }
html body.mpj-ui .medexp-sr-qwrap .medexp-qb-choice.is-wrong .medexp-qb-choice__label { color: #fff !important; background: linear-gradient(135deg, var(--bad), color-mix(in srgb, var(--bad) 60%, #fff)) !important; border-color: transparent !important; }
/* Explanation as a textbook panel */
html body.mpj-ui .medexp-sr-qwrap .medexp-qb-feedback { border-radius: 18px !important; padding: 20px 22px !important; border: 1px solid var(--mpj-line, #e3e8ef) !important; background: #fff !important; }
html body.mpj-ui .medexp-sr-qwrap .medexp-qb-feedback__body { position: relative; padding: 18px 20px 18px 24px !important; margin: 14px 0 !important; border-radius: 14px; background: linear-gradient(90deg, color-mix(in srgb, var(--ok) 7%, #fff), #fff 75%); border: 1px solid color-mix(in srgb, var(--ok) 20%, #fff); font-size: 15.5px; line-height: 1.7; }
html body.mpj-ui .medexp-sr-qwrap .medexp-qb-feedback__body::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 5px; border-radius: 14px 0 0 14px; background: linear-gradient(180deg, var(--ok), color-mix(in srgb, var(--ok) 40%, #fff)); }
html body.mpj-ui .medexp-sr-qwrap .medexp-qb-feedback__body > p:first-child > strong:first-child { color: var(--ok); }
html body.mpj-ui .medexp-sr-qwrap .medexp-qb-feedback__body li > strong:first-child { color: var(--mpj-navy); }
html body.mpj-ui .medexp-sr-qwrap .medexp-qb-references { margin-top: 14px !important; padding: 14px 16px !important; border-radius: 12px; background: var(--mpj-sunken, #f6f8fb); border: 0 !important; }
html body.mpj-ui .medexp-sr-qwrap .medexp-qb-references__title { font: 700 11.5px/1 var(--mpj-sans) !important; letter-spacing: .08em; text-transform: uppercase; color: var(--mpj-muted) !important; }
html body.mpj-ui .medexp-sr-qwrap .medexp-qb-references__list { font-size: 12.5px !important; color: var(--mpj-muted) !important; overflow-wrap: anywhere; }
html body.mpj-ui .medexp-sr-qwrap .medexp-dna { border-radius: 14px !important; background: linear-gradient(135deg, color-mix(in srgb, #7c3aed 8%, #fff), #fff 70%) !important; border: 1px solid color-mix(in srgb, #7c3aed 20%, #fff) !important; }
html body.mpj-ui .medexp-sr-qwrap .medexp-dna__kickerLabel { color: color-mix(in srgb, #7c3aed 85%, var(--mpj-navy)) !important; font-weight: 700 !important; letter-spacing: .06em; text-transform: uppercase; font-size: 11.5px !important; }
html body.mpj-ui .medexp-sr-qwrap details > summary { cursor: pointer; font: 700 15px/1.3 var(--mpj-sans); color: var(--mpj-navy); padding: 12px 4px; }
@media (max-width: 900px) { html body.mpj-ui .medexp-qb-sessionReview .medexp-sr-left { position: static !important; max-height: none; } }
/* Summary charts in brand colors */
html body.mpj-ui .medexp-summaryGrid .medexp-miniChart { color: var(--mpj-blue); }
html body.mpj-ui .medexp-summaryGrid .medexp-hbars__fill { background: linear-gradient(90deg, var(--mpj-blue), color-mix(in srgb, var(--mpj-blue) 60%, #fff)) !important; }
/* Let the review question list stay pinned (ancestors must not clip) */
html body.mpj-ui .medexp-card:has(.medexp-qb-sessionReview), html body.mpj-ui .medexp-qbank:has(.medexp-qb-sessionReview), html body.mpj-ui .medexp-qb-body:has(.medexp-qb-sessionReview), html body.mpj-ui .medexp-container:has(.medexp-qb-sessionReview), html body.mpj-ui .medexp-qb-sessionReview { overflow: visible !important; }

/* =====================================================================
 * Flashcard editor modal (from review/QBank)
 * ===================================================================== */
html body.mpj-ui .mpj-fcModal { --fc: var(--mpj-teal, #0f7d79); --fc2: var(--mpj-blue); border-radius: 20px !important; overflow: hidden; max-width: min(1080px, 96vw) !important; }
html body.mpj-ui .mpj-fcModal .medexp-qb-modal__head { padding: 18px 22px !important; background: linear-gradient(135deg, color-mix(in srgb, var(--fc) 9%, #fff), #fff 65%) !important; border-bottom: 1px solid color-mix(in srgb, var(--fc) 15%, var(--mpj-line, #e3e8ef)) !important; }
html body.mpj-ui .mpj-fcModal .medexp-qb-modal__headLeft { position: relative; padding-left: 52px; min-height: 40px; }
html body.mpj-ui .mpj-fcModal .medexp-qb-modal__headLeft::before { content: ""; position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 40px; height: 40px; border-radius: 12px; background: linear-gradient(135deg, var(--fc), color-mix(in srgb, var(--fc) 55%, #fff)); box-shadow: 0 6px 14px -8px var(--fc); }
html body.mpj-ui .mpj-fcModal .medexp-qb-modal__headLeft::after { content: ""; position: absolute; left: 10px; top: 50%; transform: translateY(-50%); width: 20px; height: 20px; background: #fff; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='6' width='14' height='14' rx='2'/%3E%3Cpath d='M7 3h12a2 2 0 0 1 2 2v12'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='6' width='14' height='14' rx='2'/%3E%3Cpath d='M7 3h12a2 2 0 0 1 2 2v12'/%3E%3C/svg%3E") center / contain no-repeat; }
html body.mpj-ui .mpj-fcModal .medexp-qb-modal__title { font: 700 18px/1.25 var(--mpj-sans) !important; color: var(--mpj-navy) !important; }
html body.mpj-ui .mpj-fcModal .medexp-qb-modal__sub { font: 500 13.5px/1.45 var(--mpj-sans) !important; color: var(--mpj-muted) !important; margin-top: 2px; }
html body.mpj-ui .mpj-fcModal .medexp-qb-modal__body { padding: 18px 22px !important; background: #fbfcfd; }
html body.mpj-ui .mpj-fcModal .medexp-fcMgr { gap: 18px !important; align-items: start; }
/* Sidebar: deck picker and the card list */
html body.mpj-ui .mpj-fcModal .medexp-fcMgr__sidebar { padding: 14px !important; border-radius: 16px !important; background: #fff !important; border: 1px solid var(--mpj-line, #e3e8ef) !important; box-shadow: none !important; }
html body.mpj-ui .mpj-fcModal .medexp-fcMgr__deckRow { display: flex; flex-direction: column; align-items: stretch !important; gap: 6px !important; margin-bottom: 12px; }
html body.mpj-ui .mpj-fcModal .medexp-fcMgr__deckLabel { font: 700 11.5px/1 var(--mpj-sans) !important; letter-spacing: .08em; text-transform: uppercase; color: var(--mpj-muted) !important; }
html body.mpj-ui .mpj-fcModal .medexp-fcMgr__deckSel { width: 100%; height: 38px; border-radius: 10px !important; font: 600 14px/1 var(--mpj-sans) !important; }
html body.mpj-ui .mpj-fcModal .medexp-fcMgr__list { display: grid; gap: 6px; max-height: 340px; overflow-y: auto; }
html body.mpj-ui .mpj-fcModal .medexp-fcMgr__cardBtn { text-align: left; width: 100%; padding: 10px 12px !important; border-radius: 12px !important; border: 1px solid var(--mpj-line, #e3e8ef) !important; background: #fff !important; font: 600 13px/1.4 var(--mpj-sans) !important; color: var(--mpj-text) !important; box-shadow: none !important; }
html body.mpj-ui .mpj-fcModal .medexp-fcMgr__cardBtn:hover { border-color: color-mix(in srgb, var(--fc) 35%, #fff) !important; }
html body.mpj-ui .mpj-fcModal .medexp-fcMgr__cardBtn.is-active { background: color-mix(in srgb, var(--fc) 8%, #fff) !important; border-color: color-mix(in srgb, var(--fc) 45%, #fff) !important; box-shadow: inset 3px 0 0 var(--fc) !important; }
/* Front and back as two card faces */
html body.mpj-ui .mpj-fcModal .medexp-fcMgr__pane { position: relative; padding: 14px 14px 12px !important; border-radius: 16px !important; background: #fff !important; border: 1px solid var(--mpj-line, #e3e8ef) !important; overflow: hidden; }
html body.mpj-ui .mpj-fcModal .medexp-fcMgr__pane::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 4px; background: linear-gradient(90deg, var(--fc2), color-mix(in srgb, var(--fc2) 35%, #fff)); }
html body.mpj-ui .mpj-fcModal .medexp-fcMgr__grid > .medexp-fcMgr__pane:last-child::before { background: linear-gradient(90deg, var(--fc), color-mix(in srgb, var(--fc) 35%, #fff)); }
html body.mpj-ui .mpj-fcModal .medexp-fcMgr__paneHead { display: flex; align-items: center; justify-content: space-between; margin: 2px 0 8px !important; }
html body.mpj-ui .mpj-fcModal .medexp-fcMgr__paneTitle { font: 700 12px/1 var(--mpj-sans) !important; letter-spacing: .08em; text-transform: uppercase; color: var(--fc2) !important; }
html body.mpj-ui .mpj-fcModal .medexp-fcMgr__grid > .medexp-fcMgr__pane:last-child .medexp-fcMgr__paneTitle { color: var(--fc) !important; }
html body.mpj-ui .mpj-fcModal .medexp-fcMgr__count { font: 600 11.5px/1 var(--mpj-sans) !important; color: var(--mpj-faint) !important; }
html body.mpj-ui .mpj-fcModal .medexp-fcMgr__ta { width: 100%; box-sizing: border-box; min-height: 260px; resize: vertical; padding: 12px 14px !important; border-radius: 12px !important; border: 1px solid var(--mpj-line, #e3e8ef) !important; background: #fcfdfe !important; font: 400 14.5px/1.6 var(--mpj-sans) !important; color: var(--mpj-text) !important; box-shadow: none !important; }
html body.mpj-ui .mpj-fcModal .medexp-fcMgr__ta:focus { outline: none; border-color: color-mix(in srgb, var(--fc2) 50%, #fff) !important; box-shadow: 0 0 0 3px color-mix(in srgb, var(--fc2) 15%, transparent) !important; background: #fff !important; }
html body.mpj-ui .mpj-fcModal .medexp-fcMgr__swap { width: 38px; height: 38px; padding: 0 !important; border-radius: 50% !important; display: inline-flex; align-items: center; justify-content: center; background: #fff !important; border: 1px solid var(--mpj-line, #e3e8ef) !important; color: var(--mpj-muted) !important; box-shadow: 0 4px 10px -6px rgba(15,23,42,.3) !important; }
html body.mpj-ui .mpj-fcModal .medexp-fcMgr__swap:hover { color: var(--mpj-navy) !important; border-color: color-mix(in srgb, var(--mpj-navy) 25%, #fff) !important; }
html body.mpj-ui .mpj-fcModal .medexp-fcMgr__swap svg { width: 17px; height: 17px; display: block !important; }
html body.mpj-ui .mpj-fcModal .medexp-fcMgr__tagsRow { display: flex; align-items: center; gap: 12px; margin-top: 14px !important; }
html body.mpj-ui .mpj-fcModal .medexp-fcMgr__tagsLabel { font: 700 11.5px/1 var(--mpj-sans) !important; letter-spacing: .08em; text-transform: uppercase; color: var(--mpj-muted) !important; }
html body.mpj-ui .mpj-fcModal .medexp-fcMgr__tags { flex: 1 1 auto; height: 40px; border-radius: 999px !important; padding: 0 16px !important; font: 500 14px/1 var(--mpj-sans) !important; }
html body.mpj-ui .mpj-fcModal .medexp-qb-modal__foot { padding: 14px 22px !important; border-top: 1px solid var(--mpj-line, #e3e8ef) !important; background: #fff; gap: 10px; }
html body.mpj-ui .mpj-fcModal .medexp-btn--danger { background: transparent !important; color: #b91c1c !important; border: 1px solid color-mix(in srgb, #b91c1c 25%, #fff) !important; }
html body.mpj-ui .mpj-fcModal .medexp-btn--danger:hover { background: color-mix(in srgb, #b91c1c 6%, #fff) !important; }
@media (max-width: 760px) {
  html body.mpj-ui .mpj-fcModal .medexp-fcMgr { grid-template-columns: 1fr !important; display: grid !important; }
  html body.mpj-ui .mpj-fcModal .medexp-fcMgr__grid { grid-template-columns: 1fr !important; display: grid !important; }
  html body.mpj-ui .mpj-fcModal .medexp-fcMgr__mid { justify-self: center; }
  html body.mpj-ui .mpj-fcModal .medexp-fcMgr__ta { min-height: 160px; }
  html body.mpj-ui .mpj-fcModal .medexp-fcMgr__list { max-height: 140px; }
}

/* =====================================================================
 * Dashboard, Practice by chapter, Practice blocks: same textbook language
 * (color-matched gradient tiles, tinted cards, mastery colors)
 * ===================================================================== */
html body.mpj-ui { --lv0: #a3adbb; --lv1: #d48a1e; --lv2: #3f7fc2; --lv3: #1a9488; --lv4: #1f9d57; }
/* Dashboard stat strip */
html body.mpj-ui .mpj-dash__stats .mpj-stat { --t: var(--mpj-blue); position: relative; background: linear-gradient(180deg, color-mix(in srgb, var(--t) 7%, #fff), #fff 110px) !important; }
html body.mpj-ui .mpj-dash__stats .mpj-stat::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 3px; background: linear-gradient(90deg, var(--t), color-mix(in srgb, var(--t) 30%, #fff) 70%, transparent); }
html body.mpj-ui .mpj-stat--questions { --t: var(--mpj-blue); }
html body.mpj-ui .mpj-stat--accuracy, html body.mpj-ui .mpj-stat--progress { --t: var(--lv3); }
html body.mpj-ui .mpj-stat--readiness { --t: color-mix(in srgb, #7c3aed 75%, var(--mpj-blue)); }
html body.mpj-ui .mpj-stat--readiness[class*="is-low"], html body.mpj-ui .mpj-stat--readiness[class*="is-very"] { --t: color-mix(in srgb, #e11d48 82%, var(--mpj-blue)); }
html body.mpj-ui .mpj-stat--readiness[class*="is-mod"], html body.mpj-ui .mpj-stat--readiness[class*="is-mid"], html body.mpj-ui .mpj-stat--readiness[class*="is-border"] { --t: var(--lv1); }
html body.mpj-ui .mpj-stat--readiness[class*="is-high"], html body.mpj-ui .mpj-stat--readiness[class*="is-likely"], html body.mpj-ui .mpj-stat--readiness[class*="is-good"] { --t: var(--lv4); }
html body.mpj-ui .mpj-stat--streak { --t: color-mix(in srgb, #ea580c 80%, var(--mpj-blue)); }
html body.mpj-ui .mpj-stat--flashcards { --t: var(--mpj-teal); }
html body.mpj-ui .mpj-dash__stats .mpj-stat__icon { width: 38px !important; height: 38px !important; border-radius: 11px !important; display: inline-flex !important; align-items: center; justify-content: center; color: #fff !important; background: linear-gradient(135deg, var(--t), color-mix(in srgb, var(--t) 55%, #fff)) !important; box-shadow: 0 6px 14px -8px var(--t); border: 0 !important; }
html body.mpj-ui .mpj-dash__stats .mpj-stat__icon svg { display: block !important; color: #fff !important; stroke: currentColor; }
html body.mpj-ui .mpj-dash__stats .mpj-stat__label { color: var(--t) !important; font-weight: 700 !important; letter-spacing: .02em; }
/* Mastery bars and chapter numbers by level (dashboard table) */
html body.mpj-ui .mpj-mastery { --lv: var(--lv0); }
html body.mpj-ui .mpj-mastery--l1 { --lv: var(--lv1); } html body.mpj-ui .mpj-mastery--l2 { --lv: var(--lv2); } html body.mpj-ui .mpj-mastery--l3 { --lv: var(--lv3); } html body.mpj-ui .mpj-mastery--l4 { --lv: var(--lv4); }
html body.mpj-ui .mpj-mastery .mpj-bar { background: color-mix(in srgb, var(--lv) 14%, #fff) !important; }
html body.mpj-ui .mpj-mastery .mpj-bar > span { background: linear-gradient(90deg, var(--lv), color-mix(in srgb, var(--lv) 60%, #fff)) !important; min-width: 4px; }
html body.mpj-ui .mpj-mastery__pct { color: var(--lv) !important; font-weight: 700 !important; }
html body.mpj-ui .mpj-chapters__table tr { --lv: var(--lv0); }
html body.mpj-ui .mpj-chapters__table tr:has(.mpj-mastery--l1) { --lv: var(--lv1); } html body.mpj-ui .mpj-chapters__table tr:has(.mpj-mastery--l2) { --lv: var(--lv2); } html body.mpj-ui .mpj-chapters__table tr:has(.mpj-mastery--l3) { --lv: var(--lv3); } html body.mpj-ui .mpj-chapters__table tr:has(.mpj-mastery--l4) { --lv: var(--lv4); }
html body.mpj-ui .mpj-chapters__n { min-width: 26px; height: 26px; border-radius: 8px !important; display: inline-flex !important; align-items: center; justify-content: center; font-weight: 800 !important; color: #fff !important; border: 0 !important; background: linear-gradient(135deg, var(--lv), color-mix(in srgb, var(--lv) 55%, #fff)) !important; }
html body.mpj-ui .mpj-chapters__table tbody tr:hover td { background: color-mix(in srgb, var(--mpj-blue) 4%, #fff); }
/* Today steps */
html body.mpj-ui .mpj-today__step { width: 30px !important; height: 30px !important; border-radius: 9px !important; color: #fff !important; font-weight: 800 !important; border: 0 !important; background: linear-gradient(135deg, var(--mpj-blue), color-mix(in srgb, var(--mpj-blue) 55%, #fff)) !important; box-shadow: 0 6px 12px -8px var(--mpj-blue); }
html body.mpj-ui .mpj-today__item:nth-child(2) .mpj-today__step { background: linear-gradient(135deg, var(--lv3), color-mix(in srgb, var(--lv3) 55%, #fff)) !important; }
html body.mpj-ui .mpj-today__item:nth-child(3) .mpj-today__step { background: linear-gradient(135deg, color-mix(in srgb, #7c3aed 75%, var(--mpj-blue)), color-mix(in srgb, #7c3aed 40%, #fff)) !important; }
/* Practice by chapter: header pills, hero, cards */
html body.mpj-ui .medexp-ql-statPill { background: linear-gradient(180deg, color-mix(in srgb, var(--mpj-blue) 6%, #fff), #fff) !important; border-color: color-mix(in srgb, var(--mpj-blue) 16%, var(--mpj-line, #e3e8ef)) !important; }
html body.mpj-ui .medexp-ql-statPill__v { color: var(--mpj-navy) !important; font-weight: 800 !important; }
html body.mpj-ui .medexp-ql-hero { background: linear-gradient(135deg, color-mix(in srgb, var(--mpj-blue) 7%, #fff), #fff 65%) !important; border: 1px solid color-mix(in srgb, var(--mpj-blue) 16%, var(--mpj-line, #e3e8ef)) !important; border-radius: 20px !important; position: relative; overflow: hidden; }
html body.mpj-ui .medexp-ql-hero::after { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 4px; background: linear-gradient(90deg, var(--mpj-blue), color-mix(in srgb, var(--mpj-blue) 35%, #fff) 70%, transparent); }
html body.mpj-ui .medexp-ql-hero__title { font: 700 11.5px/1 var(--mpj-sans) !important; letter-spacing: .08em; text-transform: uppercase; color: var(--mpj-blue) !important; }
html body.mpj-ui .medexp-ql-hero__distBar { height: 10px !important; border-radius: 999px !important; overflow: hidden; gap: 2px; }
html body.mpj-ui .medexp-ql-hero__rec { border-radius: 14px !important; background: linear-gradient(90deg, color-mix(in srgb, var(--lv3) 10%, #fff), #fff 80%) !important; border: 1px solid color-mix(in srgb, var(--lv3) 25%, #fff) !important; }
html body.mpj-ui .medexp-ql-card { border-radius: 18px !important; background: linear-gradient(180deg, color-mix(in srgb, var(--ql-accent, var(--mpj-blue)) 7%, #fff), #fff 120px) !important; border: 1px solid color-mix(in srgb, var(--ql-accent, var(--mpj-blue)) 22%, var(--mpj-line, #e3e8ef)) !important; transition: transform .18s ease, box-shadow .18s ease !important; position: relative; overflow: hidden; }
html body.mpj-ui .medexp-ql-card::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 3px; background: linear-gradient(90deg, var(--ql-accent, var(--mpj-blue)), color-mix(in srgb, var(--ql-accent, var(--mpj-blue)) 30%, #fff) 70%, transparent); }
html body.mpj-ui .medexp-ql-card--clickable:hover { transform: translateY(-2px); box-shadow: 0 16px 30px -22px color-mix(in srgb, var(--mpj-navy) 70%, transparent) !important; }
html body.mpj-ui .medexp-ql-card__num { display: inline-flex !important; align-items: center; justify-content: center; width: 26px; height: 26px; border-radius: 8px; font: 800 13px/1 var(--mpj-sans) !important; color: #fff !important; background: linear-gradient(135deg, var(--ql-accent, var(--mpj-blue)), color-mix(in srgb, var(--ql-accent, var(--mpj-blue)) 55%, #fff)); }
html body.mpj-ui .medexp-ql-badge { font-weight: 700 !important; border: 1px solid color-mix(in srgb, currentColor 30%, transparent) !important; border-radius: 999px !important; padding: 3px 10px !important; }
html body.mpj-ui .medexp-ql-startHere { color: #8a5a00 !important; background: linear-gradient(135deg, #fff3d6, #ffe7a8) !important; border: 1px solid #f3d27a !important; font-weight: 700 !important; border-radius: 999px !important; }
html body.mpj-ui .medexp-ql-miniStat { background: #fff !important; border: 1px solid color-mix(in srgb, var(--ql-accent, var(--mpj-blue)) 14%, var(--mpj-line, #e3e8ef)) !important; border-radius: 12px !important; }
html body.mpj-ui .medexp-ql-miniStat__v { color: var(--mpj-navy) !important; font-weight: 800 !important; }
html body.mpj-ui .medexp-ql-card__barTrack, html body.mpj-ui .medexp-ql-row__barTrack { background: color-mix(in srgb, var(--ql-accent, var(--mpj-blue)) 12%, #fff) !important; border-radius: 999px !important; }
html body.mpj-ui .medexp-ql-card__barFill, html body.mpj-ui .medexp-ql-row__barFill { background: linear-gradient(90deg, var(--ql-accent, var(--mpj-blue)), color-mix(in srgb, var(--ql-accent, var(--mpj-blue)) 55%, #fff)) !important; min-width: 4px; border-radius: 999px !important; }
html body.mpj-ui .medexp-ql-ring__label { font-weight: 800 !important; }
/* Practice blocks builder */
html body.mpj-ui .medexp-qb-hero { border-radius: 20px !important; background: linear-gradient(135deg, color-mix(in srgb, var(--mpj-blue) 7%, #fff), #fff 65%) !important; border: 1px solid color-mix(in srgb, var(--mpj-blue) 16%, var(--mpj-line, #e3e8ef)) !important; position: relative; overflow: hidden; }
html body.mpj-ui .medexp-qb-presets .medexp-btn { border-radius: 12px !important; background: #fff !important; font-weight: 600 !important; transition: transform .15s, box-shadow .15s, border-color .15s; }
html body.mpj-ui .medexp-qb-presets .medexp-btn:hover { transform: translateY(-1px); border-color: color-mix(in srgb, var(--mpj-blue) 40%, #fff) !important; box-shadow: 0 8px 18px -12px var(--mpj-blue) !important; }
html body.mpj-ui .medexp-qb-presets .medexp-btn svg { color: var(--mpj-blue); }
html body.mpj-ui .medexp-qb-summaryCard { border-radius: 18px !important; background: linear-gradient(180deg, color-mix(in srgb, var(--mpj-blue) 6%, #fff), #fff 140px) !important; border: 1px solid color-mix(in srgb, var(--mpj-blue) 16%, var(--mpj-line, #e3e8ef)) !important; position: relative; overflow: hidden; }
html body.mpj-ui .medexp-qb-summaryCard::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 4px; background: linear-gradient(90deg, var(--mpj-blue), color-mix(in srgb, var(--mpj-blue) 35%, #fff) 70%, transparent); }
html body.mpj-ui .medexp-qb-summaryCard__title { font: 700 17px/1.3 var(--mpj-sans) !important; color: var(--mpj-navy) !important; }
html body.mpj-ui .medexp-qb-sumRow__v { color: var(--mpj-navy) !important; font-weight: 700 !important; }
html body.mpj-ui .medexp-qb-perfStrip__head { font: 700 11.5px/1 var(--mpj-sans) !important; letter-spacing: .08em; text-transform: uppercase; color: var(--mpj-blue) !important; }
html body.mpj-ui .medexp-qb-perfStrip [class*="medexp-qb-perf"][class*="__cell"], html body.mpj-ui .medexp-qb-perfStrip [class*="medexp-qb-perf"][class*="__tile"], html body.mpj-ui .medexp-qb-perfStrip [class*="medexp-qb-perf"][class*="__item"] { border-radius: 12px !important; background: #fff !important; border: 1px solid color-mix(in srgb, var(--mpj-blue) 14%, var(--mpj-line, #e3e8ef)) !important; }
html body.mpj-ui .medexp-qb-summaryCard__cta .medexp-btn--primary { height: 48px; border-radius: 14px !important; font-size: 15.5px !important; font-weight: 700 !important; background: linear-gradient(135deg, var(--mpj-blue), color-mix(in srgb, var(--mpj-blue) 70%, var(--mpj-navy))) !important; box-shadow: 0 12px 24px -14px var(--mpj-blue) !important; }
html body.mpj-ui .medexp-qb-section, html body.mpj-ui .medexp-qb-historyCard { border-radius: 18px !important; }
html body.mpj-ui .medexp-qb-subtabs { border-radius: 12px !important; }
html body.mpj-ui .medexp-qb-subtab.is-active { color: var(--mpj-navy) !important; font-weight: 700 !important; }
html body.mpj-ui .medexp-ql-card .medexp-ql-card__num { background: linear-gradient(135deg, var(--ql-accent, var(--mpj-blue)), color-mix(in srgb, var(--ql-accent, var(--mpj-blue)) 55%, #fff)) !important; color: #fff !important; margin-bottom: 6px; }

/* =====================================================================
 * Course page: hero, progress, mastery map, outline
 * ===================================================================== */
/* Next up */
html body.mpj-ui .medexp-hero .medexp-nextUp { position: relative; overflow: hidden; border-radius: 20px !important; background: linear-gradient(135deg, color-mix(in srgb, var(--mpj-blue) 8%, #fff), #fff 65%) !important; border: 1px solid color-mix(in srgb, var(--mpj-blue) 18%, var(--mpj-line, #e3e8ef)) !important; box-shadow: 0 18px 40px -32px color-mix(in srgb, var(--mpj-navy) 60%, transparent) !important; }
html body.mpj-ui .medexp-hero .medexp-nextUp::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 4px; background: linear-gradient(90deg, var(--mpj-blue), color-mix(in srgb, var(--mpj-blue) 35%, #fff) 70%, transparent); }
html body.mpj-ui .medexp-nextUp__kicker { display: inline-flex; align-items: center; gap: 8px; font: 700 11.5px/1 var(--mpj-sans) !important; letter-spacing: .08em; text-transform: uppercase; color: var(--mpj-blue) !important; }
html body.mpj-ui .medexp-nextUp__kicker::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--mpj-blue); box-shadow: 0 0 0 4px color-mix(in srgb, var(--mpj-blue) 18%, transparent); }
/* Progress card: compact, no empty space */
html body.mpj-ui .medexp-hero__right .medexp-progress { align-self: start; border-radius: 20px !important; background: linear-gradient(180deg, color-mix(in srgb, var(--lv3, #1a9488) 7%, #fff), #fff 140px) !important; border: 1px solid color-mix(in srgb, var(--lv3, #1a9488) 18%, var(--mpj-line, #e3e8ef)) !important; position: relative; overflow: hidden; }
html body.mpj-ui .medexp-hero__right .medexp-progress::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 4px; background: linear-gradient(90deg, var(--lv3, #1a9488), color-mix(in srgb, var(--lv3, #1a9488) 35%, #fff) 70%, transparent); }
html body.mpj-ui .medexp-progress__title { font: 700 11.5px/1 var(--mpj-sans) !important; letter-spacing: .08em; text-transform: uppercase; color: var(--lv3, #1a9488) !important; }
html body.mpj-ui .medexp-progress__pct { font: 800 30px/1 var(--mpj-sans) !important; color: var(--mpj-navy) !important; letter-spacing: -.02em; }
html body.mpj-ui .medexp-progress__bar { height: 10px !important; border-radius: 999px !important; background: color-mix(in srgb, var(--lv3, #1a9488) 13%, #fff) !important; }
html body.mpj-ui .medexp-progress__fill { border-radius: 999px !important; min-width: 6px; background: linear-gradient(90deg, var(--lv3, #1a9488), color-mix(in srgb, var(--lv3, #1a9488) 55%, #fff)) !important; }
html body.mpj-ui .medexp-progress__meta { display: grid !important; gap: 8px !important; }
html body.mpj-ui .medexp-progress__stat { display: flex !important; justify-content: space-between; align-items: baseline; gap: 12px; padding: 10px 12px; border-radius: 12px; background: #fff; border: 1px solid var(--mpj-line, #e3e8ef); }
html body.mpj-ui .medexp-progress__label { font: 600 12.5px/1.2 var(--mpj-sans) !important; color: var(--mpj-muted) !important; text-transform: none !important; letter-spacing: 0 !important; }
html body.mpj-ui .medexp-progress__value { font: 700 14.5px/1.3 var(--mpj-sans) !important; color: var(--mpj-navy) !important; text-align: right; }
/* Mode bar */
html body.mpj-ui .medexp-modeBar { border-radius: 16px !important; }
html body.mpj-ui .medexp-seg { padding: 4px !important; border-radius: 12px !important; background: var(--mpj-sunken, #f1f4f8) !important; gap: 4px; }
html body.mpj-ui .medexp-seg__btn { border-radius: 9px !important; font-weight: 600 !important; color: var(--mpj-muted) !important; }
html body.mpj-ui .medexp-seg__btn.is-active { background: #fff !important; color: var(--mpj-navy) !important; box-shadow: 0 1px 3px rgba(15,23,42,.12) !important; }
/* Mastery map */
html body.mpj-ui .medexp-mapChapter { counter-increment: mpjch; border-radius: 18px !important; border: 1px solid var(--mpj-line, #e3e8ef) !important; overflow: hidden; background: #fff; }
html body.mpj-ui .medexp-mapBody { counter-reset: mpjch; }
html body.mpj-ui .medexp-mapChapter__head { display: flex !important; align-items: center; gap: 12px; padding: 16px 18px !important; background: linear-gradient(90deg, color-mix(in srgb, var(--mpj-blue) 8%, #fff), #fff 75%) !important; border-bottom: 1px solid color-mix(in srgb, var(--mpj-blue) 14%, var(--mpj-line, #e3e8ef)); }
html body.mpj-ui .medexp-mapChapter__head::before { content: counter(mpjch); flex: 0 0 auto; width: 32px; height: 32px; border-radius: 10px; display: inline-flex; align-items: center; justify-content: center; color: #fff; font: 800 14px/1 var(--mpj-sans); background: linear-gradient(135deg, var(--mpj-blue), color-mix(in srgb, var(--mpj-blue) 55%, #fff)); box-shadow: 0 6px 12px -8px var(--mpj-blue); }
html body.mpj-ui .medexp-mapChapter__title { flex: 1 1 auto; font: 700 17px/1.3 var(--mpj-sans) !important; color: var(--mpj-navy) !important; }
html body.mpj-ui .medexp-mapChapter__meta { font: 600 13px/1.3 var(--mpj-sans) !important; color: var(--mpj-muted) !important; }
html body.mpj-ui .medexp-mapAccList { padding: 12px !important; display: grid; gap: 10px; }
html body.mpj-ui .medexp-mapAcc { --lv: var(--lv0, #a3adbb); border-radius: 14px !important; border: 1px solid color-mix(in srgb, var(--lv) 22%, var(--mpj-line, #e3e8ef)) !important; background: linear-gradient(90deg, color-mix(in srgb, var(--lv) 6%, #fff), #fff 60%) !important; box-shadow: inset 4px 0 0 var(--lv) !important; overflow: hidden; }
html body.mpj-ui .medexp-mapAcc.is-l1 { --lv: var(--lv1, #d48a1e); } html body.mpj-ui .medexp-mapAcc.is-l2 { --lv: var(--lv2, #3f7fc2); } html body.mpj-ui .medexp-mapAcc.is-l3 { --lv: var(--lv3, #1a9488); } html body.mpj-ui .medexp-mapAcc.is-l4 { --lv: var(--lv4, #1f9d57); }
html body.mpj-ui .medexp-mapAcc.is-recommended { box-shadow: inset 4px 0 0 var(--lv), 0 0 0 3px color-mix(in srgb, var(--mpj-blue) 14%, transparent) !important; }
html body.mpj-ui .medexp-mapAcc__title { font: 700 15.5px/1.3 var(--mpj-sans) !important; color: var(--mpj-navy) !important; }
html body.mpj-ui .medexp-mapAcc__sub { font: 500 13px/1.3 var(--mpj-sans) !important; color: var(--mpj-muted) !important; }
html body.mpj-ui .medexp-mapAcc .medexp-progBar { height: 8px !important; border-radius: 999px !important; background: color-mix(in srgb, var(--lv) 14%, #fff) !important; }
html body.mpj-ui .medexp-mapAcc .medexp-progBar__fill { border-radius: 999px !important; min-width: 6px; background: linear-gradient(90deg, var(--lv), color-mix(in srgb, var(--lv) 55%, #fff)) !important; }
html body.mpj-ui .medexp-mapAcc .medexp-progPct { color: var(--lv) !important; font-weight: 800 !important; }
html body.mpj-ui .medexp-mapAcc__more { border-radius: 10px !important; }
html body.mpj-ui .medexp-mapAcc__chips > * { border-radius: 999px !important; background: #fff !important; border: 1px solid color-mix(in srgb, var(--lv) 22%, var(--mpj-line, #e3e8ef)) !important; font-weight: 600 !important; }
html body.mpj-ui .medexp-mapTopic { border-radius: 12px !important; border: 1px solid var(--mpj-line, #e3e8ef) !important; background: #fff !important; }
/* Outline */
html body.mpj-ui .medexp-outline__node--chapter { counter-increment: none; margin-bottom: 10px; border-radius: 14px; border: 1px solid var(--mpj-line, #e3e8ef); background: #fff; overflow: hidden; }
html body.mpj-ui .medexp-outline__node--chapter > .medexp-outline__toggle { padding: 12px 14px !important; background: linear-gradient(90deg, color-mix(in srgb, var(--mpj-blue) 7%, #fff), #fff 75%) !important; border-bottom: 1px solid color-mix(in srgb, var(--mpj-blue) 12%, var(--mpj-line, #e3e8ef)); }
html body.mpj-ui .medexp-outline__node--chapter > .medexp-outline__toggle .medexp-outline__summaryTitle { font: 700 15.5px/1.3 var(--mpj-sans) !important; color: var(--mpj-navy) !important; display: inline-flex; align-items: center; gap: 10px; }
html body.mpj-ui .medexp-outline__node--chapter > .medexp-outline__toggle .medexp-outline__num { min-width: 28px; height: 28px; border-radius: 9px; display: inline-flex; align-items: center; justify-content: center; color: #fff !important; font: 800 13px/1 var(--mpj-sans) !important; background: linear-gradient(135deg, var(--mpj-blue), color-mix(in srgb, var(--mpj-blue) 55%, #fff)); }
html body.mpj-ui .medexp-outline__node--section > .medexp-outline__toggle { padding: 8px 14px 8px 18px !important; }
html body.mpj-ui .medexp-outline__node--section > .medexp-outline__toggle .medexp-outline__summaryTitle { font: 700 14px/1.3 var(--mpj-sans) !important; color: var(--mpj-text) !important; }
html body.mpj-ui .medexp-outline__node--section .medexp-outline__num { color: var(--mpj-blue) !important; font-weight: 700 !important; }
html body.mpj-ui .medexp-outline__count { font: 700 11.5px/1 var(--mpj-sans) !important; padding: 4px 8px; border-radius: 999px; background: var(--mpj-sunken, #f1f4f8); color: var(--mpj-muted) !important; }
html body.mpj-ui .medexp-outline__node--topic { display: flex !important; align-items: center; gap: 10px; padding: 6px 14px 6px 34px !important; border-radius: 10px; transition: background .15s; }
html body.mpj-ui .medexp-outline__node--topic:hover { background: color-mix(in srgb, var(--mpj-blue) 5%, #fff); }
html body.mpj-ui .medexp-outline__link { flex: 1 1 auto; font: 500 14px/1.4 var(--mpj-sans) !important; color: var(--mpj-text) !important; text-decoration: none !important; }
html body.mpj-ui .medexp-outline__link .medexp-outline__num { color: var(--mpj-faint) !important; font-weight: 600 !important; margin-right: 4px; }
html body.mpj-ui .medexp-outline__dot { width: 10px !important; height: 10px !important; border-radius: 50% !important; background: transparent !important; border: 2px solid color-mix(in srgb, var(--lv0, #a3adbb) 70%, #fff) !important; }
html body.mpj-ui .medexp-outline__dot--progress { border-color: var(--lv1, #d48a1e) !important; background: color-mix(in srgb, var(--lv1, #d48a1e) 30%, #fff) !important; }
html body.mpj-ui .medexp-outline__dot--done { border-color: var(--lv4, #1f9d57) !important; background: var(--lv4, #1f9d57) !important; }
/* Outline: one frame per chapter only (no box-in-box double lines) */
html body.mpj-ui .medexp-modeContent .medexp-outline { border: 0 !important; padding: 0 !important; background: transparent !important; box-shadow: none !important; }
html body.mpj-ui .medexp-outline__node--section { border: 0 !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; margin: 0 !important; }
html body.mpj-ui .medexp-outline__node--section + .medexp-outline__node--section { border-top: 1px solid color-mix(in srgb, var(--mpj-line, #e3e8ef) 70%, #fff) !important; }
html body.mpj-ui .medexp-outline__node--section > .medexp-outline__toggle { background: transparent !important; border: 0 !important; }
html body.mpj-ui .medexp-outline__node--section > .medexp-outline__toggle:hover { background: color-mix(in srgb, var(--mpj-blue) 4%, #fff) !important; }
html body.mpj-ui .medexp-outline__chev { display: inline-flex !important; align-items: center; justify-content: center; width: 16px; font-size: 12px !important; line-height: 1 !important; color: var(--mpj-muted) !important; transition: transform .15s; }
html body.mpj-ui details.medexp-outline__node:not([open]) > .medexp-outline__toggle .medexp-outline__chev { transform: rotate(-90deg); }
html body.mpj-ui .medexp-outline__node--chapter > .medexp-outline__toggle .medexp-outline__num { opacity: 1 !important; }
html body.mpj-ui .medexp-outline__chev { font-size: 0 !important; width: 18px !important; height: 18px; }
html body.mpj-ui .medexp-outline__chev::before { content: ""; width: 14px; height: 14px; background: currentColor; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") center / contain no-repeat; }
/* Mastery map: header band fills the chapter card; one clean colored edge per row */
html body.mpj-ui .medexp-mapChapter { padding: 0 !important; box-shadow: none !important; }
html body.mpj-ui .medexp-mapChapter__head { margin: 0 !important; border-radius: 17px 17px 0 0 !important; }
html body.mpj-ui .medexp-mapChapter .medexp-mapAccList { padding: 14px !important; }
html body.mpj-ui .medexp-mapAcc, html body.mpj-ui .medexp-mapAcc.is-recommended, html body.mpj-ui .medexp-mapAcc[open] { position: relative; box-shadow: none !important; outline: none !important; border-left-width: 1px !important; }
html body.mpj-ui .medexp-mapAcc::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; background: var(--lv); z-index: 1; pointer-events: none; }
html body.mpj-ui .medexp-mapAcc.is-recommended { border-color: color-mix(in srgb, var(--lv) 45%, #fff) !important; }
html body.mpj-ui .medexp-mapAcc__summary { outline: none !important; box-shadow: none !important; padding-left: 18px !important; }
html body.mpj-ui .medexp-mapAcc__summary:focus-visible { box-shadow: inset 0 0 0 2px color-mix(in srgb, var(--mpj-blue) 45%, #fff) !important; border-radius: 13px; }
html body.mpj-ui .medexp-mapAcc[open] > .medexp-mapAcc__summary { border-bottom: 1px solid color-mix(in srgb, var(--lv) 18%, var(--mpj-line, #e3e8ef)) !important; }
html body.mpj-ui .medexp-mapAcc__panel { padding-left: 18px !important; border: 0 !important; box-shadow: none !important; }
html body.mpj-ui .medexp-mapAcc[open] > .medexp-mapAcc__panel { padding-bottom: 16px !important; padding-right: 14px !important; }
/* Mastery map rows: the colored band is the row's own left border, so it follows the rounded corners */
html body.mpj-ui .medexp-mapAcc::before { content: none !important; }
html body.mpj-ui .medexp-mapAcc, html body.mpj-ui .medexp-mapAcc.is-recommended, html body.mpj-ui .medexp-mapAcc[open] { border-left: 5px solid var(--lv) !important; }
html body.mpj-ui .medexp-mapAcc__summary, html body.mpj-ui .medexp-mapAcc__panel { padding-left: 14px !important; }
/* Let the ⋯ menu spill out of section rows and chapter cards */
html body.mpj-ui .medexp-mapAcc, html body.mpj-ui .medexp-mapChapter, html body.mpj-ui .medexp-mapAccList, html body.mpj-ui .medexp-mapBody, html body.mpj-ui .medexp-mapCard, html body.mpj-ui .medexp-mapAcc__summary { overflow: visible !important; }
html body.mpj-ui .medexp-mapAcc__moreWrap { position: relative; z-index: 30; }
html body.mpj-ui .medexp-mapAcc:has(.medexp-popMenu:not([hidden])) { z-index: 40; position: relative; }
html body.mpj-ui .medexp-mapAcc .medexp-popMenu { z-index: 50 !important; border-radius: 14px !important; box-shadow: 0 18px 40px -16px rgba(15,23,42,.35) !important; }
/* App sidebar logo (dashboard, practice, courses…): centered and sized like the lesson sidebar */
html body.mpj-shell-page:not(.mpj-shell-reader) .mpj-side .mpj-brand, html body.mpj-ui .mpj-side .mpj-brand { justify-content: center !important; height: auto !important; padding: 6px 8px 14px !important; margin: 0 0 8px !important; border-bottom: 1px solid color-mix(in srgb, var(--mpj-line, #e3e8ef) 70%, transparent); border-radius: 0 !important; }
html body.mpj-shell-page:not(.mpj-shell-reader) .mpj-side .mpj-brand__img, html body.mpj-ui .mpj-side .mpj-brand__img { height: auto !important; max-height: 52px !important; max-width: 190px !important; }
html body.mpj-ui.mpj-site-medexprep .mpj-side .mpj-brand__img { max-height: 42px !important; max-width: 200px !important; }
/* Opener: only short "Label: value" facts become cards; lists and their labels span the full width */
html body.mpj-ui .medexp-lesson [data-mpj-sec="opener"] .medexp-lesson__meta > :not(p) { grid-column: 1 / -1 !important; margin: 0 0 6px !important; }
html body.mpj-ui .medexp-lesson [data-mpj-sec="opener"] .medexp-lesson__meta > p:has(+ ul), html body.mpj-ui .medexp-lesson [data-mpj-sec="opener"] .medexp-lesson__meta > p:has(+ ol) { grid-column: 1 / -1 !important; background: transparent !important; border: 0 !important; padding: 10px 0 0 !important; }
html body.mpj-ui .medexp-lesson [data-mpj-sec="opener"] .medexp-lesson__meta > ul, html body.mpj-ui .medexp-lesson [data-mpj-sec="opener"] .medexp-lesson__meta > ol { padding: 4px 0 4px 22px !important; font-size: 16px; line-height: 1.6; }

/* Concept card: fallback for one-line mindmaps that Mermaid cannot parse */
html body.mpj-ui .mpj-cmap{ padding:18px 18px 20px; display:flex; flex-direction:column; align-items:center; gap:16px; }
html body.mpj-ui .mpj-cmap__root{ padding:10px 22px; border-radius:999px; font-weight:700; font-size:16px; line-height:1.35; text-align:center; color:#fff; background:linear-gradient(135deg, var(--mpj-blue,#3f7fc2), color-mix(in srgb, var(--mpj-blue,#3f7fc2) 55%, #fff)); box-shadow:0 4px 12px color-mix(in srgb, var(--mpj-blue,#3f7fc2) 25%, transparent); max-width:100%; }
html body.mpj-ui .mpj-cmap__items{ list-style:none; margin:0; padding:0; width:100%; display:grid; grid-template-columns:repeat(auto-fill, minmax(190px, 1fr)); gap:10px; }
html body.mpj-ui .mpj-cmap__items li{ margin:0; padding:10px 12px; border:1px solid color-mix(in srgb, var(--mpj-blue,#3f7fc2) 30%, #fff); border-left:4px solid var(--mpj-blue,#3f7fc2); border-radius:10px; background:linear-gradient(180deg, #fff, color-mix(in srgb, var(--mpj-blue,#3f7fc2) 6%, #fff)); font-size:15px; line-height:1.45; color:#2b3442; }
html body.mpj-ui .mpj-cmap__items li strong{ color:#1d2b40; font-weight:650; }
html body.mpj-ui .medexp-figure--mermaid.is-cmap .medexp-figure__code{ display:none !important; }
html body.mpj-ui .medexp-figure--mermaid.is-cmap .medexp-figure__canvas{ display:block !important; width:100% !important; }
html body.mpj-ui .mpj-cmap{ width:100%; box-sizing:border-box; }
html body.mpj-ui .mpj-cmap__items li::before, html body.mpj-ui .mpj-cmap__items li::marker{ content:none !important; display:none !important; }
html body.mpj-ui .mpj-cmap__items li strong{ color:var(--mpj-blue,#1a4f9c) !important; }
html body.mpj-ui .mpj-fc__scope{ display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:8px 16px; margin:14px 0 0; padding:10px 14px; border:1px solid color-mix(in srgb, var(--mpj-blue,#1a4f9c) 22%, #fff); border-left:4px solid var(--mpj-blue,#1a4f9c); border-radius:10px; background:color-mix(in srgb, var(--mpj-blue,#1a4f9c) 5%, #fff); font-size:14px; color:#334155; }
html body.mpj-ui .mpj-fc__scopeAll{ font-weight:600; color:var(--mpj-blue,#1a4f9c); text-decoration:none; }
html body.mpj-ui .mpj-fc__scopeAll:hover{ text-decoration:underline; }
html body.mpj-ui .medexp-qb-pill--custom.is-active .medexp-qb-pill__val{ color:#0f1e36 !important; -webkit-text-fill-color:#0f1e36; font-weight:700; }

/* ===== Practice builder: Focus pane + session summary polish ===== */
html body.mpj-ui{ overflow-x:clip; }
html body.mpj-ui .medexp-figure--mermaid svg g.node g.label > rect{ display:none !important; }
html body.mpj-ui [data-pane=focus] .medexp-qb-advGrid{ display:grid !important; grid-template-columns:repeat(auto-fit, minmax(260px, 1fr)) !important; gap:14px !important; align-items:start; }
html body.mpj-ui [data-pane] .medexp-qb-subcard{ background:#fff !important; border:1px solid var(--mpj-line, #e3e8ef) !important; border-radius:14px !important; padding:16px 16px 14px !important; box-shadow:0 1px 2px rgba(15,30,54,.04) !important; }
html body.mpj-ui [data-pane] .medexp-qb-subcard__title{ display:flex !important; align-items:center; gap:10px; font-weight:650 !important; font-size:15px !important; color:var(--mpj-navy, #0f1e36) !important; margin:0 0 4px !important; }
html body.mpj-ui [data-pane] .medexp-qb-subcard__title svg{ box-sizing:content-box; width:16px !important; height:16px !important; padding:7px; border-radius:9px; color:#fff; background:linear-gradient(135deg, var(--mpj-blue, #1a4f9c), color-mix(in srgb, var(--mpj-blue, #1a4f9c) 55%, #fff)); flex:none; }
html body.mpj-ui [data-pane] .medexp-qb-subcard:nth-child(2) .medexp-qb-subcard__title svg{ background:linear-gradient(135deg, #1a9488, color-mix(in srgb, #1a9488 55%, #fff)); }
html body.mpj-ui [data-pane] .medexp-qb-subcard:nth-child(3) .medexp-qb-subcard__title svg{ background:linear-gradient(135deg, #d48a1e, color-mix(in srgb, #d48a1e 55%, #fff)); }
html body.mpj-ui [data-pane] .medexp-qb-subcard__hint{ color:var(--mpj-muted, #5b6676) !important; font-size:13.5px !important; line-height:1.5 !important; margin:0 0 12px 44px !important; }
html body.mpj-ui [data-pane] .medexp-qb-subcard .medexp-qb-formRow > label:not(:has(input)){ font-size:12px !important; font-weight:650 !important; letter-spacing:.04em; text-transform:uppercase; color:var(--mpj-muted, #5b6676) !important; margin:0 0 6px !important; }
html body.mpj-ui [data-pane] .medexp-qb-subcard.is-empty .medexp-qb-input,
html body.mpj-ui [data-pane] .medexp-qb-subcard.is-empty .medexp-subjects__actions,
html body.mpj-ui [data-pane] .medexp-qb-subcard.is-empty .medexp-subjects__scrollHint{ display:none !important; }
html body.mpj-ui .mpj-qb-emptyNote{ font-size:13.5px !important; font-weight:400 !important; color:var(--mpj-muted, #5b6676) !important; background:#f6f8fb; border:1px dashed var(--mpj-line, #d9e0ea); border-radius:10px; padding:10px 12px; }
html body.mpj-ui .medexp-subjects__actions{ display:flex; gap:6px; margin:8px 0 !important; }
/* Topic chips */
html body.mpj-ui .medexp-topicField{ display:flex; flex-wrap:wrap; align-items:center; gap:8px; }
html body.mpj-ui .medexp-topicField__chips{ display:flex; flex-wrap:wrap; gap:6px; width:100%; }
html body.mpj-ui .medexp-chipInput__chip{ display:inline-flex !important; align-items:center; gap:6px; max-width:100%; padding:6px 6px 6px 12px !important; border-radius:999px !important; border:1px solid color-mix(in srgb, var(--mpj-blue, #1a4f9c) 28%, #fff) !important; background:color-mix(in srgb, var(--mpj-blue, #1a4f9c) 7%, #fff) !important; color:var(--mpj-navy, #0f1e36) !important; font-size:14px !important; font-weight:600 !important; line-height:1.3; text-transform:none !important; }
html body.mpj-ui .medexp-chipInput__x{ display:inline-grid !important; place-items:center; width:22px !important; height:22px !important; min-width:0 !important; padding:0 !important; border:0 !important; border-radius:50% !important; background:color-mix(in srgb, var(--mpj-blue, #1a4f9c) 14%, #fff) !important; color:var(--mpj-blue, #1a4f9c) !important; font-size:15px !important; line-height:1 !important; cursor:pointer; box-shadow:none !important; }
html body.mpj-ui .medexp-chipInput__x:hover{ background:var(--mpj-blue, #1a4f9c) !important; color:#fff !important; }
/* Checkbox rows */
html body.mpj-ui [data-pane] .medexp-qb-subcard .medexp-qb-formRow > label:has(input[type=checkbox]){ display:flex !important; align-items:center; gap:10px; margin:0 !important; padding:8px 10px !important; border-radius:9px; font-size:14px !important; font-weight:500 !important; color:#2b3442 !important; text-transform:none !important; letter-spacing:0 !important; cursor:pointer; }
html body.mpj-ui [data-pane] .medexp-qb-subcard .medexp-qb-formRow > label:has(input[type=checkbox]):hover{ background:#f4f7fb; }
html body.mpj-ui [data-pane] .medexp-qb-subcard .medexp-qb-formRow > label:has(input:checked){ background:color-mix(in srgb, var(--mpj-blue, #1a4f9c) 7%, #fff); color:var(--mpj-navy, #0f1e36) !important; }
html body.mpj-ui [data-pane] .medexp-qb-subcard input[type=checkbox]{ width:17px; height:17px; margin:0 !important; accent-color:var(--mpj-blue, #1a4f9c); flex:none; }
html body.mpj-ui [data-pane] .medexp-qb-subcard .medexp-qb-formRow{ margin:0 0 2px !important; }
html body.mpj-ui .medexp-qb-presets{ display:flex !important; flex-wrap:wrap; gap:6px; margin:0 0 10px !important; }
html body.mpj-ui .medexp-qb-presets .medexp-btn{ border-radius:999px !important; padding:6px 14px !important; font-size:13.5px !important; font-weight:600 !important; min-height:0 !important; }
/* Session summary */
html body.mpj-ui .medexp-qb-summaryCard .medexp-qb-sumRow{ padding:9px 0 !important; }
html body.mpj-ui .medexp-qb-summaryCard .medexp-qb-sumRow__k{ color:var(--mpj-muted, #5b6676) !important; font-size:14px !important; }
html body.mpj-ui .medexp-qb-summaryCard .medexp-qb-sumRow__v{ color:var(--mpj-navy, #0f1e36) !important; font-weight:650 !important; font-size:14.5px !important; text-align:right; }
html body.mpj-ui .medexp-qb-summaryCard .medexp-qb-perfStrip__grid{ display:grid !important; grid-template-columns:1fr 1fr !important; gap:8px !important; }
html body.mpj-ui .medexp-qb-summaryCard .medexp-qb-perfStat{ position:relative; padding:10px 12px 10px 14px !important; border:1px solid var(--mpj-line, #e3e8ef) !important; border-left:1px solid var(--mpj-line, #e3e8ef) !important; border-radius:11px !important; background:#fff !important; box-shadow:none !important; overflow:hidden; }
html body.mpj-ui .medexp-qb-summaryCard .medexp-qb-perfStat::before{ content:"" !important; display:block !important; position:absolute; left:0; top:0; bottom:0; width:4px; background:var(--k, #3f7fc2); }
html body.mpj-ui .medexp-qb-summaryCard .medexp-qb-perfStat:nth-child(1){ --k:#1f9d57; }
html body.mpj-ui .medexp-qb-summaryCard .medexp-qb-perfStat:nth-child(2){ --k:#3f7fc2; }
html body.mpj-ui .medexp-qb-summaryCard .medexp-qb-perfStat:nth-child(3){ --k:#7c5cc4; }
html body.mpj-ui .medexp-qb-summaryCard .medexp-qb-perfStat:nth-child(4){ --k:#d48a1e; }
html body.mpj-ui .medexp-qb-summaryCard .medexp-qb-perfStat__k{ font-size:12px !important; font-weight:600 !important; color:var(--mpj-muted, #5b6676) !important; }
html body.mpj-ui .medexp-qb-summaryCard .medexp-qb-perfStat__v{ margin-top:2px; font:700 19px/1.2 var(--mpj-sans, inherit) !important; font-variant-numeric:tabular-nums; color:var(--mpj-navy, #0f1e36) !important; -webkit-text-fill-color:currentColor !important; }
html body.mpj-ui .medexp-qb-summaryCard .medexp-qb-perfStrip__hint{ font-size:13px !important; font-weight:500 !important; color:var(--mpj-muted, #5b6676) !important; margin-top:10px !important; }
html body.mpj-ui [data-pane] .medexp-qb-subcard.is-empty{ display:none !important; }
html body.mpj-ui [data-pane] .medexp-qb-subcard__hint{ margin-left:0 !important; }
html body.mpj-ui .medexp-qb-summaryCard .medexp-qb-perfStat .medexp-qb-perfStat__v,
html body.mpj-ui .medexp-qb-summaryCard .medexp-qb-perfStat .medexp-qb-perfStat__v *{ color:#0f1e36 !important; -webkit-text-fill-color:#0f1e36 !important; background:none !important; }
html body.mpj-ui .medexp-qb-paneIntro{ display:flex !important; align-items:center; gap:12px; margin:4px 0 14px !important; }
html body.mpj-ui .medexp-qb-paneIntro > svg{ box-sizing:content-box; width:18px !important; height:18px !important; padding:9px; border-radius:11px; color:#fff; background:linear-gradient(135deg, var(--mpj-navy, #0f1e36), color-mix(in srgb, var(--mpj-blue, #1a4f9c) 70%, #fff)); flex:none; }
html body.mpj-ui .medexp-qb-paneIntro__title{ font-weight:700 !important; font-size:16px !important; color:var(--mpj-navy, #0f1e36) !important; }
html body.mpj-ui .medexp-qb-paneIntro__sub{ font-size:13.5px !important; color:var(--mpj-muted, #5b6676) !important; margin:0 !important; }

/* Formats: only available ones, with counts */
html body.mpj-ui .medexp-qb-chip[hidden]{ display:none !important; }
html body.mpj-ui .medexp-qb-chip .mpj-chipCount{ margin-left:2px; min-width:20px; padding:1px 7px; border-radius:999px; font-size:12px; font-weight:700; line-height:18px; text-align:center; background:rgba(255,255,255,.18); color:inherit; }
html body.mpj-ui .medexp-qb-chip .mpj-chipCount:empty{ display:none; }
html body.mpj-ui .medexp-qb-chip:not(.is-active) .mpj-chipCount{ background:color-mix(in srgb, var(--mpj-blue,#1a4f9c) 10%, #fff); color:var(--mpj-blue,#1a4f9c); }

/* Difficulty levels */
html body.mpj-ui .mpj-diff__presets{ display:flex; flex-wrap:wrap; gap:6px; margin:2px 0 14px; }
html body.mpj-ui .mpj-diff__preset{ padding:7px 16px; border-radius:999px; border:1px solid var(--mpj-line,#d9e0ea); background:#fff; color:#2b3442; font:600 14px/1.2 inherit; cursor:pointer; }
html body.mpj-ui .mpj-diff__preset:hover{ border-color:color-mix(in srgb, var(--mpj-blue,#1a4f9c) 45%, #fff); }
html body.mpj-ui .mpj-diff__preset.is-on{ background:var(--mpj-navy,#0f1e36); border-color:var(--mpj-navy,#0f1e36); color:#fff; }
html body.mpj-ui .mpj-diff__levels{ display:flex; flex-direction:column; gap:8px; }
html body.mpj-ui .mpj-diff__level{ display:flex; align-items:center; gap:14px; width:100%; padding:11px 14px; text-align:left; border-radius:12px; border:1px solid var(--mpj-line,#e3e8ef); background:#fff; cursor:pointer; color:#2b3442; transition:border-color .15s, background .15s; }
html body.mpj-ui .mpj-diff__level:hover{ border-color:color-mix(in srgb, var(--mpj-blue,#1a4f9c) 40%, #fff); }
html body.mpj-ui .mpj-diff__level.is-on{ border-color:color-mix(in srgb, var(--lvc) 55%, #fff); background:color-mix(in srgb, var(--lvc) 7%, #fff); }
html body.mpj-ui .mpj-diff__level:not(.is-on){ opacity:.62; }
html body.mpj-ui .mpj-diff__level.is-empty .mpj-diff__cnt{ color:#9aa4b2; }
html body.mpj-ui .mpj-diff__level[data-lv="1"]{ --lvc:#1f9d57; }
html body.mpj-ui .mpj-diff__level[data-lv="2"]{ --lvc:#1a9488; }
html body.mpj-ui .mpj-diff__level[data-lv="3"]{ --lvc:#3f7fc2; }
html body.mpj-ui .mpj-diff__level[data-lv="4"]{ --lvc:#d48a1e; }
html body.mpj-ui .mpj-diff__level[data-lv="5"]{ --lvc:#c2453f; }
html body.mpj-ui .mpj-diff__bars{ display:inline-flex; align-items:flex-end; gap:3px; height:22px; flex:none; }
html body.mpj-ui .mpj-diff__bars i{ display:block; width:5px; border-radius:2px; background:#e3e8ef; }
html body.mpj-ui .mpj-diff__bars i:nth-child(1){ height:8px; } html body.mpj-ui .mpj-diff__bars i:nth-child(2){ height:11px; } html body.mpj-ui .mpj-diff__bars i:nth-child(3){ height:15px; } html body.mpj-ui .mpj-diff__bars i:nth-child(4){ height:18px; } html body.mpj-ui .mpj-diff__bars i:nth-child(5){ height:22px; }
html body.mpj-ui .mpj-diff__bars i.is-fill{ background:var(--lvc); }
html body.mpj-ui .mpj-diff__txt{ display:flex; flex-direction:column; gap:1px; flex:1; min-width:0; }
html body.mpj-ui .mpj-diff__txt strong{ font-size:15px; font-weight:650; color:var(--mpj-navy,#0f1e36); }
html body.mpj-ui .mpj-diff__txt span{ font-size:13.5px; color:var(--mpj-muted,#5b6676); }
html body.mpj-ui .mpj-diff__cnt{ flex:none; font-size:13px; font-weight:600; color:var(--mpj-muted,#5b6676); font-variant-numeric:tabular-nums; }
html body.mpj-ui .mpj-diff__note{ margin-top:12px; padding:10px 12px; border-radius:10px; background:#f6f8fb; font-size:13.5px; color:#334155; }
html body.mpj-ui .mpj-diff__level.is-empty{ cursor:default; }
html body.mpj-ui .mpj-diff__level.is-empty .mpj-diff__bars i.is-fill{ background:#cfd6df; }
html body.mpj-ui .medexp-qb-chips.is-loading .medexp-qb-chip{ visibility:hidden; }
html body.mpj-ui .mpj-diff__preset:disabled{ opacity:.45; cursor:not-allowed; }

/* ===================== Dashboard 2.0 ===================== */
/* Columns: chapters + activity on the left, today + this week on the right */
html body.mpj-ui .mpj-dash__main, html body.mpj-ui .mpj-dash__side { display: flex; flex-direction: column; gap: var(--mpj-s5, 20px); min-width: 0; }
html body.mpj-ui .mpj-dash__side { position: sticky; top: calc(var(--mpj-topbar-h, 56px) + 16px); }
html body.mpj-ui .mpj-dash__side > *, html body.mpj-ui .mpj-dash__main > * { position: relative !important; top: auto !important; }
@media (max-width: 1100px) { html body.mpj-ui .mpj-dash__side { position: static; } }

/* Entrance: panels rise in, one after another */
@media (prefers-reduced-motion: no-preference) {
  html body.mpj-ui .mpj-dash > *, html body.mpj-ui .mpj-dash__main > *, html body.mpj-ui .mpj-dash__side > * { animation: mpjRise .5s cubic-bezier(.2,.7,.2,1) both; }
  html body.mpj-ui .mpj-dash > :nth-child(2) { animation-delay: .04s; }
  html body.mpj-ui .mpj-dash > :nth-child(3) { animation-delay: .08s; }
  html body.mpj-ui .mpj-dash__main > :nth-child(1), html body.mpj-ui .mpj-dash__side > :nth-child(1) { animation-delay: .12s; }
  html body.mpj-ui .mpj-dash__main > :nth-child(2), html body.mpj-ui .mpj-dash__side > :nth-child(2) { animation-delay: .18s; }
  html body.mpj-ui .mpj-dash .mpj-bar > span, html body.mpj-ui .mpj-today__prog > span { animation: mpjGrow .9s cubic-bezier(.2,.7,.2,1) .25s both; transform-origin: left center; }
  html body.mpj-ui .mpj-week__bar > span { animation: mpjGrowY .7s cubic-bezier(.2,.7,.2,1) both; transform-origin: bottom center; }
  html body.mpj-ui .mpj-week__day:nth-child(2) .mpj-week__bar > span { animation-delay: .04s; }
  html body.mpj-ui .mpj-week__day:nth-child(3) .mpj-week__bar > span { animation-delay: .08s; }
  html body.mpj-ui .mpj-week__day:nth-child(4) .mpj-week__bar > span { animation-delay: .12s; }
  html body.mpj-ui .mpj-week__day:nth-child(5) .mpj-week__bar > span { animation-delay: .16s; }
  html body.mpj-ui .mpj-week__day:nth-child(6) .mpj-week__bar > span { animation-delay: .2s; }
  html body.mpj-ui .mpj-week__day:nth-child(7) .mpj-week__bar > span { animation-delay: .24s; }
  html body.mpj-ui .mpj-week__arc { animation: mpjArc 1.1s cubic-bezier(.2,.7,.2,1) .2s both; }
  html body.mpj-ui .mpj-spark__line { stroke-dasharray: 300; animation: mpjDraw 1.2s ease .3s both; }
  html body.mpj-ui .mpj-spark__dot { animation: mpjPop .4s ease 1.3s both; }
  html body.mpj-ui .mpj-heat__cells i { animation: mpjFade .5s ease both; }
}
@keyframes mpjRise { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
@keyframes mpjGrow { from { transform: scaleX(0); } }
@keyframes mpjGrowY { from { transform: scaleY(0); } }
@keyframes mpjArc { from { stroke-dashoffset: var(--c); } }
@keyframes mpjDraw { from { stroke-dashoffset: 300; } to { stroke-dashoffset: 0; } }
@keyframes mpjPop { from { opacity: 0; transform: scale(0); } }
@keyframes mpjFade { from { opacity: 0; } }

/* Tooltips: any element with data-tip */
html body.mpj-ui [data-tip] { position: relative; }
@keyframes mpjTip { from { opacity: 0; transform: translate(-50%, 4px); } }

/* Stat tiles: numbers, sparklines, lift */
html body.mpj-ui .mpj-dash__stats { overflow: visible; }
html body.mpj-ui .mpj-stat { transition: background-color .2s, transform .2s, box-shadow .2s; }
@media (hover: hover) { html body.mpj-ui .mpj-dash__stats .mpj-stat:hover { transform: translateY(-2px); box-shadow: 0 10px 24px rgba(15,30,54,.08); z-index: 1; background: #fff; } }
html body.mpj-ui .mpj-stat__value b { font-weight: inherit; font-variant-numeric: tabular-nums; }
html body.mpj-ui .mpj-stat__spark { display: block; margin-top: 10px; height: 28px; }
html body.mpj-ui .mpj-spark { display: block; width: 100%; height: 28px; overflow: visible; color: var(--mpj-blue, #1a4f9c); }
html body.mpj-ui .mpj-stat--questions .mpj-spark { color: var(--mpj-teal, #1a9488); }
html body.mpj-ui .mpj-stat--accuracy .mpj-spark { color: var(--mpj-success, #1f9d57); }
html body.mpj-ui .mpj-spark__line { fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
html body.mpj-ui .mpj-spark__area { fill: currentColor; opacity: .09; }
html body.mpj-ui .mpj-spark__dot { fill: currentColor; stroke: #fff; stroke-width: 1.5; transform-box: fill-box; transform-origin: center; }
html body.mpj-ui .mpj-stat__dots { display: flex; gap: 5px; margin-top: 12px; }
html body.mpj-ui .mpj-stat__dots i { width: 14px; height: 14px; border-radius: 50%; background: #e7ebf1; box-shadow: inset 0 0 0 1px rgba(15,30,54,.04); }
html body.mpj-ui .mpj-stat__dots i.is-on { background: linear-gradient(135deg, var(--mpj-amber, #d48a1e), color-mix(in srgb, var(--mpj-amber, #d48a1e) 55%, #fff)); }
html body.mpj-ui .mpj-stat__dots i.is-today { box-shadow: 0 0 0 2px #fff, 0 0 0 3.5px var(--mpj-amber, #d48a1e); }

/* Chapter rows open chapter practice */
html body.mpj-ui .mpj-chapters__table tr.is-link { cursor: pointer; }
html body.mpj-ui .mpj-chapters__table tr.is-link:hover { background: color-mix(in srgb, var(--mpj-blue, #1a4f9c) 4%, #fff) !important; }
html body.mpj-ui .mpj-chapters__table tr.is-link:hover .mpj-chapters__t { color: var(--mpj-blue, #1a4f9c); }
html body.mpj-ui .mpj-chapters__table tr.is-link td:last-child { position: relative; }
html body.mpj-ui .mpj-chapters__table tr.is-link:focus-visible { outline: 2px solid var(--mpj-blue, #1a4f9c); outline-offset: -2px; }

/* Today: done items and progress */
html body.mpj-ui .mpj-today__item.is-done .mpj-today__step { background: linear-gradient(135deg, var(--mpj-success, #1f9d57), color-mix(in srgb, var(--mpj-success, #1f9d57) 55%, #fff)) !important; color: #fff !important; }
html body.mpj-ui .mpj-today__item.is-done .mpj-h3 { color: var(--mpj-muted, #5b6676) !important; text-decoration: line-through; text-decoration-color: color-mix(in srgb, var(--mpj-muted, #5b6676) 50%, transparent); }
html body.mpj-ui .mpj-today__prog { display: block; height: 5px; margin-top: 8px; border-radius: 99px; background: #e9edf3; overflow: hidden; max-width: 180px; }
html body.mpj-ui .mpj-today__prog > span { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--mpj-teal, #1a9488), color-mix(in srgb, var(--mpj-teal, #1a9488) 55%, #fff)); }
html body.mpj-ui .mpj-today__progTxt { display: block; margin-top: 4px; font-size: 12px; color: var(--mpj-muted, #5b6676); }

/* This week */
html body.mpj-ui .mpj-week { padding-bottom: 6px; }
html body.mpj-ui .mpj-week__body { display: flex; align-items: center; gap: 16px; padding: 4px var(--mpj-s5, 20px) 6px; }
html body.mpj-ui .mpj-week__goal { position: relative; width: 76px; height: 76px; flex: none; }
html body.mpj-ui .mpj-week__goal svg { width: 100%; height: 100%; transform: rotate(-90deg); }
html body.mpj-ui .mpj-week__track { fill: none; stroke: #e9edf3; stroke-width: 7; }
html body.mpj-ui .mpj-week__arc { fill: none; stroke: var(--mpj-teal, #1a9488); stroke-width: 7; stroke-linecap: round; transition: stroke-dashoffset .6s ease; }
html body.mpj-ui .mpj-week__goal.is-done .mpj-week__arc { stroke: var(--mpj-success, #1f9d57); }
html body.mpj-ui .mpj-week__goalNum { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; line-height: 1.05; }
html body.mpj-ui .mpj-week__goalNum b { font: 700 19px/1 var(--mpj-sans, system-ui); color: var(--mpj-navy, #0f1e36); font-variant-numeric: tabular-nums; }
html body.mpj-ui .mpj-week__goalNum small { font-size: 11px; color: var(--mpj-muted, #5b6676); margin-top: 2px; }
html body.mpj-ui .mpj-week__text { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
html body.mpj-ui .mpj-trend { font-size: 13px; font-weight: 600; }
html body.mpj-ui .mpj-trend.is-up { color: var(--mpj-success, #1f9d57); }
html body.mpj-ui .mpj-trend.is-down { color: var(--mpj-amber, #b5701a); }
html body.mpj-ui .mpj-week__bars { list-style: none; margin: 8px 0 0; padding: 0 var(--mpj-s5, 20px) 14px; display: grid; grid-template-columns: repeat(7, 1fr); gap: 8px; }
html body.mpj-ui .mpj-week__day { margin: 0; display: flex; flex-direction: column; align-items: center; gap: 6px; }
html body.mpj-ui .mpj-week__bar { position: relative; width: 100%; max-width: 30px; height: 70px; border-radius: 8px; background: #f1f4f8; overflow: hidden; display: flex; align-items: flex-end; }
html body.mpj-ui .mpj-week__bar > span { display: block; width: 100%; height: var(--h, 0%); border-radius: 8px; background: linear-gradient(180deg, color-mix(in srgb, var(--mpj-blue, #3f7fc2) 70%, #fff), var(--mpj-blue, #3f7fc2)); }
html body.mpj-ui .mpj-week__day.is-today .mpj-week__bar { box-shadow: inset 0 0 0 1.5px color-mix(in srgb, var(--mpj-blue, #3f7fc2) 45%, #fff); }
html body.mpj-ui .mpj-week__day.is-future .mpj-week__bar { background: repeating-linear-gradient(135deg, #f4f6f9 0 4px, #eef1f5 4px 8px); }
html body.mpj-ui .mpj-week__lbl { font-size: 12px; font-weight: 600; color: var(--mpj-faint, #8792a2); }
html body.mpj-ui .mpj-week__day.is-today .mpj-week__lbl { color: var(--mpj-navy, #0f1e36); }

/* Study activity heatmap */
html body.mpj-ui .mpj-heat__sum { display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); gap: 10px; padding: 2px var(--mpj-s5, 20px) 14px; }
html body.mpj-ui .mpj-heat__sum span { display: flex; flex-direction: column; gap: 2px; font-size: 12.5px; color: var(--mpj-muted, #5b6676); line-height: 1.35; }
html body.mpj-ui .mpj-heat__sum b { font: 700 20px/1.1 var(--mpj-sans, system-ui); color: var(--mpj-navy, #0f1e36); font-variant-numeric: tabular-nums; }
html body.mpj-ui .mpj-heat__scroll { overflow-x: auto; padding: 4px var(--mpj-s5, 20px) 6px; scrollbar-width: thin; }
html body.mpj-ui .mpj-heat__grid { display: inline-flex; flex-direction: column; gap: 4px; min-width: 100%; }
html body.mpj-ui .mpj-heat__months { display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; gap: 4px; font-size: 11px; color: var(--mpj-faint, #8792a2); height: 14px; }
html body.mpj-ui .mpj-heat__months span { white-space: nowrap; overflow: visible; }
html body.mpj-ui .mpj-heat__cells { display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; gap: 4px; }
html body.mpj-ui .mpj-heat__col { display: grid; grid-template-rows: repeat(7, auto); gap: 4px; }
html body.mpj-ui .mpj-heat__cells i, html body.mpj-ui .mpj-heat__legend i { display: block; aspect-ratio: 1; min-width: 11px; width: auto; height: auto; padding: 0; margin: 0; border-radius: 3px; background: #ebeff4; }
html body.mpj-ui .mpj-heat__cells i.is-future { background: transparent; }
html body.mpj-ui .mpj-heat i.hl1 { background: color-mix(in srgb, var(--mpj-teal, #1a9488) 25%, #fff); }
html body.mpj-ui .mpj-heat i.hl2 { background: color-mix(in srgb, var(--mpj-teal, #1a9488) 48%, #fff); }
html body.mpj-ui .mpj-heat i.hl3 { background: color-mix(in srgb, var(--mpj-teal, #1a9488) 74%, #fff); }
html body.mpj-ui .mpj-heat i.hl4 { background: var(--mpj-teal, #1a9488); }
html body.mpj-ui .mpj-heat__cells i.is-today { box-shadow: 0 0 0 1.5px var(--mpj-navy, #0f1e36); }
html body.mpj-ui .mpj-heat__cells i[data-tip] { transition: transform .12s; }
html body.mpj-ui .mpj-heat__cells i[data-tip]:hover { transform: scale(1.35); z-index: 2; }
html body.mpj-ui .mpj-heat__legend { display: flex; align-items: center; justify-content: flex-end; gap: 4px; padding: 4px var(--mpj-s5, 20px) 16px; font-size: 11.5px; color: var(--mpj-faint, #8792a2); }
html body.mpj-ui .mpj-heat__legend i { width: 11px; min-width: 11px; }
html body.mpj-ui .mpj-heat__legend span { margin: 0 4px; }

/* Hero: progress bar shimmer + CTA lift */
html body.mpj-ui .mpj-next .mpj-bar > span { position: relative; overflow: hidden; }
@media (prefers-reduced-motion: no-preference) {
  html body.mpj-ui .mpj-next .mpj-bar > span::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, transparent, rgba(255,255,255,.55), transparent); transform: translateX(-100%); animation: mpjShine 2.6s ease 1.2s infinite; }
}
@keyframes mpjShine { to { transform: translateX(100%); } }
html body.mpj-ui .mpj-dash .mpj-btn { transition: transform .15s ease, box-shadow .15s ease, background-color .15s ease; }
@media (hover: hover) { html body.mpj-ui .mpj-dash .mpj-btn:hover { transform: translateY(-1px); } }
html body.mpj-ui .mpj-dash .mpj-btn:active { transform: translateY(0) scale(.98); }

/* Collapsible sidebar: slim icon rail (desktop) */
@media (min-width: 901px) {
  html body.mpj-ui.mlc3-sidebar-collapsed .medexp-dashboardPage .tw-sidebar { padding-left: 10px !important; padding-right: 10px !important; overflow: visible !important; }
  html body.mpj-ui.mlc3-sidebar-collapsed .medexp-dashboardPage .tw-sidebar .truncate,
  html body.mpj-ui.mlc3-sidebar-collapsed .medexp-dashboardPage .tw-sidebar .mlc3-sidebar-section,
  html body.mpj-ui.mlc3-sidebar-collapsed .medexp-dashboardPage .tw-sidebar .mpj-sidecard { display: none !important; }
  html body.mpj-ui.mlc3-sidebar-collapsed .medexp-dashboardPage .tw-sidebar a.tw-navlink { justify-content: center !important; padding: 0 !important; gap: 0 !important; }
  html body.mpj-ui.mlc3-sidebar-collapsed .medexp-dashboardPage .tw-sidebar .tw-brandLogo { height: auto !important; width: 52px !important; max-height: 40px !important; object-fit: contain; }
  html body.mpj-ui.mlc3-sidebar-collapsed .medexp-dashboardPage .tw-sidebar .mlc3-sidebar-section + a { margin-top: 14px; }
}
html body.mpj-ui .medexp-dashboardPage .tw-sidebar, html body.mpj-ui .medexp-dashboardPage .tw-topbar, html body.mpj-ui .medexp-dashboardPage main.tw-main { will-change: auto; }

/* Search shortcut hint */
html body.mpj-ui .mpj-kbd { margin-left: auto; padding: 1px 6px; border: 1px solid #dfe4ec; border-bottom-width: 2px; border-radius: 6px; background: #fff; color: #6b7889; font: 600 11px/16px var(--mpj-sans, system-ui); white-space: nowrap; pointer-events: none; }
html body.mpj-ui .mpj-sr { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0 0 0 0) !important; white-space: nowrap !important; border: 0 !important; }
html body.mpj-ui .mpj-minibars { display: grid; grid-template-columns: repeat(14, 1fr); align-items: end; gap: 3px; height: 28px; }
html body.mpj-ui .mpj-minibars i { display: block; height: 100%; border-radius: 3px; background: #edf1f5; position: relative; }
html body.mpj-ui .mpj-minibars i.is-on { background: linear-gradient(180deg, color-mix(in srgb, var(--mpj-teal, #1a9488) 60%, #fff), var(--mpj-teal, #1a9488)); height: var(--h); }
html body.mpj-ui .mpj-minibars i:not(.is-on) { height: 3px; }
@media (prefers-reduced-motion: no-preference) { html body.mpj-ui .mpj-minibars i.is-on { animation: mpjGrowY .6s cubic-bezier(.2,.7,.2,1) .3s both; transform-origin: bottom; } }
html body .mpj-tipbox { position: fixed; z-index: 100000; max-width: 260px; padding: 6px 10px; border-radius: 8px; background: #0f1e36; color: #fff; font: 500 12px/1.35 var(--mpj-sans, system-ui, sans-serif); box-shadow: 0 8px 22px rgba(15,30,54,.25); pointer-events: none; opacity: 0; transform: translateY(3px); transition: opacity .12s ease, transform .12s ease; }
html body .mpj-tipbox.is-on { opacity: 1; transform: none; }
html body.mpj-ui .mpj-insight { display: inline-flex; align-items: center; gap: 8px; margin: 10px 0 0; padding: 6px 12px 6px 6px; border-radius: 999px; background: #fff; border: 1px solid #e3e8ef; box-shadow: 0 1px 2px rgba(15,30,54,.04); font-size: 13.5px; font-weight: 500; color: #2b3442; }
html body.mpj-ui .mpj-insight__ico { display: grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; color: #fff; background: linear-gradient(135deg, var(--mpj-blue, #3f7fc2), color-mix(in srgb, var(--mpj-blue, #3f7fc2) 55%, #fff)); flex: none; }
html body.mpj-ui .mpj-insight--flame .mpj-insight__ico { background: linear-gradient(135deg, #e0772b, #f3b06b); }
html body.mpj-ui .mpj-insight--check .mpj-insight__ico { background: linear-gradient(135deg, var(--mpj-success, #1f9d57), color-mix(in srgb, var(--mpj-success, #1f9d57) 55%, #fff)); }
html body.mpj-ui .mpj-insight--calendar .mpj-insight__ico { background: linear-gradient(135deg, #c2453f, #e58b85); }
@media (prefers-reduced-motion: no-preference) { html body.mpj-ui .mpj-insight--flame .mpj-insight__ico svg { animation: mpjFlicker 1.8s ease-in-out infinite; transform-origin: 50% 90%; } }
@keyframes mpjFlicker { 0%,100% { transform: scale(1) rotate(0); } 30% { transform: scale(1.08) rotate(-3deg); } 60% { transform: scale(.96) rotate(2deg); } }
@media (max-width: 1100px) {
  html body.mpj-ui .mpj-dash__cols { display: flex !important; flex-direction: column; }
  html body.mpj-ui .mpj-dash__side { order: -1; }
}
@media (max-width: 560px) {
  html body.mpj-ui .mpj-chapters__table th:nth-child(3), html body.mpj-ui .mpj-chapters__table td:nth-child(3) { display: none; }
  html body.mpj-ui .mpj-chapters__table td.mpj-chapters__mcol { min-width: 110px; }
  html body.mpj-ui .mpj-week__body { padding-left: 16px; padding-right: 16px; }
  html body.mpj-ui .mpj-heat__sum { grid-template-columns: 1fr 1fr; }
}
html body.mpj-ui .medexp-dashboardPage .tw-sidebar .tw-brandIcon { display: none; }
@media (min-width: 901px) {
  html body.mpj-ui.mlc3-sidebar-collapsed .medexp-dashboardPage .tw-sidebar .tw-brandLink:has(.tw-brandIcon) .tw-brandLogo { display: none !important; }
  html body.mpj-ui.mlc3-sidebar-collapsed .medexp-dashboardPage .tw-sidebar .tw-brandIcon { display: block; width: 36px; height: 36px; border-radius: 9px; margin: 2px auto; }
  html body.mpj-ui.mlc3-sidebar-collapsed .medexp-dashboardPage .tw-sidebar .tw-brandLink { display: flex; justify-content: center; width: 100%; }
}
/* Learners never see an illustration that has not been generated yet (editors still see it, with Retry). */
html body.mpj-ui:not(.admin-bar) figure.medexp-figure--openai-image { display: none !important; }

/* ===== Exam player: question navigator ===== */
html body.mpj-ui .medexp-pv-navOverlay { background: rgba(15, 30, 54, .42) !important; backdrop-filter: blur(3px); padding: 20px !important; animation: mpjFade .16s ease both; }
html body.mpj-ui .medexp-pv-navModal { width: min(760px, 96vw) !important; height: auto !important; max-height: min(640px, 90vh) !important; display: flex !important; flex-direction: column; background: #fff !important; border: 1px solid #e1e6ee !important; border-radius: 18px !important; box-shadow: 0 24px 64px rgba(15,30,54,.28) !important; overflow: hidden; animation: mpjRise .22s cubic-bezier(.2,.7,.2,1) both; }
html body.mpj-ui .medexp-pv-navTop { display: flex !important; align-items: center !important; justify-content: space-between; gap: 12px; padding: 18px 20px 14px !important; background: #fff !important; color: var(--mpj-navy, #0f1e36) !important; border-bottom: 1px solid #edf0f5 !important; }
html body.mpj-ui .medexp-pv-navTop__left { display: flex !important; align-items: center; gap: 12px; font: inherit !important; color: inherit !important; }
html body.mpj-ui .medexp-pv-navTop__left > span:last-child { display: flex; flex-direction: column; gap: 1px; }
html body.mpj-ui .mpj-nav__ico { display: grid; place-items: center; width: 36px; height: 36px; border-radius: 10px; color: #fff; background: linear-gradient(135deg, var(--mpj-blue, #1a4f9c), color-mix(in srgb, var(--mpj-blue, #1a4f9c) 55%, #fff)); flex: none; }
html body.mpj-ui .mpj-nav__title { font: 700 17px/1.2 var(--mpj-sans, system-ui) !important; color: var(--mpj-navy, #0f1e36); }
html body.mpj-ui .medexp-pv-navTop__sub { font: 400 13px/1.3 var(--mpj-sans, system-ui) !important; color: var(--mpj-muted, #5b6676) !important; opacity: 1 !important; }
html body.mpj-ui .medexp-pv-navX { display: grid !important; place-items: center; width: 36px !important; height: 36px !important; padding: 0 !important; border: 1px solid #e1e6ee !important; border-radius: 10px !important; background: #fff !important; color: var(--mpj-navy, #0f1e36) !important; cursor: pointer; transition: background .15s; }
html body.mpj-ui .medexp-pv-navX:hover { background: #f3f6fa !important; }
html body.mpj-ui .medexp-pv-navBody { flex: 1 1 auto; min-height: 0; overflow: auto !important; padding: 16px 20px 20px !important; background: #fff !important; border: 0 !important; }
html body.mpj-ui .mpj-nav__summary { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 20px; margin-bottom: 16px; }
html body.mpj-ui .mpj-nav__progress { flex: 1 1 200px; min-width: 180px; }
html body.mpj-ui .mpj-nav__progressTxt { font-size: 14px; color: var(--mpj-muted, #5b6676); margin-bottom: 6px; }
html body.mpj-ui .mpj-nav__progressTxt strong { color: var(--mpj-navy, #0f1e36); }
html body.mpj-ui .mpj-nav__bar { height: 7px; border-radius: 99px; background: #edf1f5; overflow: hidden; }
html body.mpj-ui .mpj-nav__bar > span { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--mpj-teal, #1a9488), color-mix(in srgb, var(--mpj-teal, #1a9488) 60%, #fff)); }
html body.mpj-ui .mpj-nav__filters { display: inline-flex; gap: 4px; padding: 4px; border-radius: 12px; background: #f1f4f8; }
html body.mpj-ui .mpj-nav__filter { display: inline-flex; align-items: center; gap: 6px; padding: 6px 11px; border: 0; border-radius: 9px; background: transparent; color: #4a5566; font: 600 13px/1.2 var(--mpj-sans, system-ui); cursor: pointer; transition: background .15s, color .15s, box-shadow .15s; }
html body.mpj-ui .mpj-nav__filter:hover { color: var(--mpj-navy, #0f1e36); }
html body.mpj-ui .mpj-nav__filter.is-on { background: #fff; color: var(--mpj-navy, #0f1e36); box-shadow: 0 1px 3px rgba(15,30,54,.12); }
html body.mpj-ui .mpj-nav__count { min-width: 20px; padding: 0 6px; border-radius: 99px; background: #e3e8ef; font-size: 11.5px; line-height: 18px; text-align: center; font-variant-numeric: tabular-nums; }
html body.mpj-ui .mpj-nav__filter.is-on .mpj-nav__count { background: color-mix(in srgb, var(--mpj-blue, #1a4f9c) 14%, #fff); color: var(--mpj-blue, #1a4f9c); }
html body.mpj-ui .mpj-nav__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(52px, 1fr)); gap: 8px; }
html body.mpj-ui .mpj-nav__q { position: relative; display: grid; place-items: center; height: 48px; padding: 0; border-radius: 11px; border: 1.5px solid #dfe5ed; background: #fff; color: var(--mpj-navy, #0f1e36); font: 650 15px/1 var(--mpj-sans, system-ui); font-variant-numeric: tabular-nums; cursor: pointer; transition: transform .12s ease, box-shadow .12s ease, border-color .12s ease; }
html body.mpj-ui .mpj-nav__q:hover { transform: translateY(-2px); box-shadow: 0 6px 14px rgba(15,30,54,.12); border-color: color-mix(in srgb, var(--mpj-blue, #1a4f9c) 45%, #fff); }
html body.mpj-ui .mpj-nav__q:focus-visible { outline: 2px solid var(--mpj-blue, #1a4f9c); outline-offset: 2px; }
html body.mpj-ui .mpj-nav__q.is-done { background: linear-gradient(135deg, var(--mpj-teal, #1a9488), color-mix(in srgb, var(--mpj-teal, #1a9488) 62%, #fff)); border-color: transparent; color: #fff; }
html body.mpj-ui .mpj-nav__q.is-open { background: color-mix(in srgb, var(--mpj-amber, #d48a1e) 12%, #fff); border-color: color-mix(in srgb, var(--mpj-amber, #d48a1e) 55%, #fff); color: #8a5310; }
html body.mpj-ui .mpj-nav__q.is-current { box-shadow: 0 0 0 2.5px #fff, 0 0 0 4.5px var(--mpj-navy, #0f1e36); }
html body.mpj-ui .mpj-nav__badges { position: absolute; top: -6px; right: -6px; display: flex; gap: 2px; }
html body.mpj-ui .mpj-nav__badges i { display: grid; place-items: center; width: 18px; height: 18px; border-radius: 50%; color: #fff; box-shadow: 0 0 0 2px #fff; }
html body.mpj-ui .mpj-nav__badges i.is-flag { background: #e0772b; }
html body.mpj-ui .mpj-nav__badges i.is-note { background: var(--mpj-blue, #1a4f9c); }
html body.mpj-ui .mpj-nav__empty { grid-column: 1 / -1; margin: 18px 0; text-align: center; color: var(--mpj-muted, #5b6676); font-size: 14px; }
html body.mpj-ui .medexp-pv-navBottom { display: flex !important; align-items: center !important; justify-content: space-between; gap: 12px; padding: 12px 20px !important; background: #f8fafc !important; border-top: 1px solid #edf0f5 !important; color: var(--mpj-muted, #5b6676) !important; }
html body.mpj-ui .mpj-nav__legend { display: flex; flex-wrap: wrap; gap: 6px 14px; font-size: 12.5px; color: var(--mpj-muted, #5b6676); }
html body.mpj-ui .mpj-nav__legend span { display: inline-flex; align-items: center; gap: 6px; }
html body.mpj-ui .mpj-nav__legend i { width: 12px; height: 12px; border-radius: 4px; border: 1.5px solid #dfe5ed; background: #fff; }
html body.mpj-ui .mpj-nav__legend i.is-done { background: var(--mpj-teal, #1a9488); border-color: transparent; }
html body.mpj-ui .mpj-nav__legend i.is-open { background: color-mix(in srgb, var(--mpj-amber, #d48a1e) 12%, #fff); border-color: color-mix(in srgb, var(--mpj-amber, #d48a1e) 55%, #fff); }
html body.mpj-ui .mpj-nav__legend i.is-cur { box-shadow: 0 0 0 1.5px #fff, 0 0 0 3px var(--mpj-navy, #0f1e36); }
html body.mpj-ui .medexp-pv-navClose { padding: 8px 18px !important; border-radius: 10px !important; border: 1px solid #d6dde7 !important; background: #fff !important; color: var(--mpj-navy, #0f1e36) !important; font: 600 14px/1.2 var(--mpj-sans, system-ui) !important; cursor: pointer; }
html body.mpj-ui .medexp-pv-navClose:hover { background: #f1f4f8 !important; }
@media (max-width: 560px) { html body.mpj-ui .mpj-nav__filters { width: 100%; overflow-x: auto; } html body.mpj-ui .mpj-nav__legend { display: none; } }

/* ===== Notes: clear open state + arrival highlight ===== */
html body.mpj-ui .medexp-uw-iconBtn.is-active { background: color-mix(in srgb, var(--mpj-blue, #1a4f9c) 14%, #fff) !important; color: var(--mpj-blue, #1a4f9c) !important; box-shadow: inset 0 0 0 1.5px color-mix(in srgb, var(--mpj-blue, #1a4f9c) 45%, #fff) !important; border-radius: 8px; }
html body.mpj-ui .medexp-uw-iconBtn.has-note { position: relative; }
html body.mpj-ui .medexp-uw-iconBtn.has-note::after { content: ""; position: absolute; top: 3px; right: 3px; width: 7px; height: 7px; border-radius: 50%; background: #e0772b; box-shadow: 0 0 0 1.5px #fff; }
html body.mpj-ui .medexp-reviewToolsBar .medexp-btn.is-active { background: color-mix(in srgb, var(--mpj-blue, #1a4f9c) 12%, #fff) !important; color: var(--mpj-blue, #1a4f9c) !important; border-color: color-mix(in srgb, var(--mpj-blue, #1a4f9c) 40%, #fff) !important; }
@keyframes mpjNoteFlash { 0% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--mpj-blue, #1a4f9c) 45%, transparent); } 100% { box-shadow: 0 0 0 14px transparent; } }
html body.mpj-ui .medexp-notePanel.is-flash { animation: mpjNoteFlash 1s ease-out .35s 1; border-color: color-mix(in srgb, var(--mpj-blue, #1a4f9c) 45%, #fff) !important; }
/* Navigator: stays tidy with long sessions (100-200+ questions) */
html body.mpj-ui .medexp-pv-navBody { padding-top: 0 !important; }
html body.mpj-ui .mpj-nav__summary { position: sticky; top: 0; z-index: 2; margin: 0 -20px 14px; padding: 16px 20px 12px; background: rgba(255,255,255,.96); backdrop-filter: blur(6px); border-bottom: 1px solid #f0f3f7; }
html body.mpj-ui .mpj-nav__grid { padding: 6px 4px 4px; }
html body.mpj-ui .mpj-nav__grid.is-dense { grid-template-columns: repeat(auto-fill, minmax(44px, 1fr)); gap: 6px; }
html body.mpj-ui .mpj-nav__grid.is-dense .mpj-nav__q { height: 40px; border-radius: 9px; font-size: 13.5px; }
html body.mpj-ui .mpj-nav__grid.is-dense .mpj-nav__badges i { width: 15px; height: 15px; }
html body.mpj-ui .medexp-pv-navModal { max-height: min(720px, 92vh) !important; }
/* One flag control only: the toolbar's "Flag for Review" */
html body.mpj-ui .medexp-pv-topbar .medexp-pv-markBtn { display: none !important; }

/* ===== QBank review: answer states after submit (beat the blue :checked selection) ===== */
html body.mpj-ui .medexp-qb-interaction.is-review .medexp-qb-choice.is-correct,
html body.mpj-ui .medexp-qb-interaction.is-review .medexp-qb-choice.is-correct:has(input:checked) { border-color: var(--mpj-success, #16a34a) !important; background: linear-gradient(90deg, color-mix(in srgb, var(--mpj-success, #16a34a) 11%, #fff), #fff 85%) !important; box-shadow: inset 4px 0 0 var(--mpj-success, #16a34a), 0 0 0 1px color-mix(in srgb, var(--mpj-success, #16a34a) 40%, transparent) !important; }
html body.mpj-ui .medexp-qb-interaction.is-review .medexp-qb-choice.is-missed { border-color: color-mix(in srgb, var(--mpj-success, #16a34a) 60%, #fff) !important; border-style: dashed !important; background: color-mix(in srgb, var(--mpj-success, #16a34a) 6%, #fff) !important; box-shadow: inset 4px 0 0 var(--mpj-success, #16a34a) !important; }
html body.mpj-ui .medexp-qb-interaction.is-review .medexp-qb-choice.is-wrong,
html body.mpj-ui .medexp-qb-interaction.is-review .medexp-qb-choice.is-wrong:has(input:checked) { border-color: var(--mpj-danger, #dc2626) !important; background: linear-gradient(90deg, color-mix(in srgb, var(--mpj-danger, #dc2626) 9%, #fff), #fff 85%) !important; box-shadow: inset 4px 0 0 var(--mpj-danger, #dc2626), 0 0 0 1px color-mix(in srgb, var(--mpj-danger, #dc2626) 35%, transparent) !important; }
html body.mpj-ui .medexp-qb-interaction.is-review .medexp-qb-choice.is-correct .medexp-qb-choice__label,
html body.mpj-ui .medexp-qb-interaction.is-review .medexp-qb-choice.is-missed .medexp-qb-choice__label { background: var(--mpj-success, #16a34a) !important; color: #fff !important; border-color: transparent !important; }
html body.mpj-ui .medexp-qb-interaction.is-review .medexp-qb-choice.is-wrong .medexp-qb-choice__label { background: var(--mpj-danger, #dc2626) !important; color: #fff !important; border-color: transparent !important; }
html body.mpj-ui .medexp-qb-interaction.is-review .medexp-qb-choice:not(.is-correct):not(.is-missed):not(.is-wrong) { opacity: .62; }
html body.mpj-ui .medexp-qb-interaction.is-review .medexp-qb-choice.is-wrong .medexp-qb-choice__text { text-decoration: line-through; text-decoration-color: color-mix(in srgb, var(--mpj-danger, #dc2626) 45%, transparent); }

/* Confidence chips after submit */
html body.mpj-ui .medexp-qb-confidence.is-locked { opacity: 1 !important; }
html body.mpj-ui .medexp-qb-confidence.is-locked .medexp-qb-confidence__btn:not(.is-chosen) { opacity: .45; }
html body.mpj-ui .medexp-qb-confidence .medexp-qb-confidence__btn.is-chosen { opacity: 1 !important; background: var(--mpj-navy, #132a52) !important; color: #fff !important; border-color: transparent !important; box-shadow: 0 4px 12px -4px color-mix(in srgb, var(--mpj-navy, #132a52) 60%, transparent) !important; }
html body.mpj-ui .medexp-qb-confidence .medexp-qb-confidence__btn.is-chosen .medexp-qb-confidence__btn-kbd { display: none; }
html body.mpj-ui .medexp-qb-confidence.is-locked .medexp-qb-confidence__hint { font-weight: 600; color: var(--mpj-navy, #132a52); }

/* ===== Explanation: textbook layout ===== */
@keyframes mpjXpIn { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
html body.mpj-ui .medexp-qb-feedback.mpj-xp--in { animation: mpjXpIn .35s cubic-bezier(.2,.8,.2,1); }
html body.mpj-ui .medexp-qb-feedback.mpj-xp .medexp-qb-feedback__head { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; }
html body.mpj-ui .mpj-xp__verdict { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; font-size: 14px; color: var(--mpj-muted, #556274); }
html body.mpj-ui .mpj-xp__verdict b { color: var(--mpj-navy, #132a52); font-weight: 700; }
html body.mpj-ui .mpj-xp__verdict b.is-ok { color: var(--mpj-success, #16a34a); }
html body.mpj-ui .mpj-xp__verdict b.is-bad { color: var(--mpj-danger, #dc2626); }
html body.mpj-ui .mpj-xp__dot { opacity: .5; }
html body.mpj-ui .mpj-xp__calib { flex-basis: 100%; font-size: 13px; padding: 7px 12px; border-radius: 10px; background: #fff7e6; color: #8a5300; border: 1px solid #f6dfb1; }
html body.mpj-ui .medexp-qb-feedback.mpj-xp .medexp-qb-feedback__body { font-size: 15.5px; line-height: 1.7; }
html body.mpj-ui .mpj-xp__h { display: flex; align-items: center; gap: 8px; margin: 2px 0 8px; font-size: 12.5px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--mpj-navy, #132a52); }
html body.mpj-ui .mpj-xp__h + .mpj-xp__lead { margin-top: 0 !important; }
html body.mpj-ui .mpj-xp__list + .mpj-xp__h, html body.mpj-ui .mpj-xp__lead + .mpj-xp__h, html body.mpj-ui p + .mpj-xp__h { margin-top: 20px; }
html body.mpj-ui .mpj-xp__hIc { width: 20px; height: 20px; border-radius: 50%; display: inline-grid; place-items: center; font-size: 11px; color: #fff; background: var(--mpj-success, #16a34a); letter-spacing: 0; }
html body.mpj-ui .mpj-xp__hIc.is-bad { background: var(--mpj-danger, #dc2626); }
html body.mpj-ui .mpj-xp__badge { display: inline-grid; place-items: center; min-width: 24px; height: 24px; padding: 0 6px; border-radius: 7px; font-size: 13px; font-weight: 700; letter-spacing: 0; text-transform: none; background: #eef2f7; color: var(--mpj-navy, #132a52); flex: none; }
html body.mpj-ui .mpj-xp__badge.is-ok { background: var(--mpj-success, #16a34a); color: #fff; }
html body.mpj-ui .mpj-xp__badge.is-bad { background: var(--mpj-danger, #dc2626); color: #fff; }
html body.mpj-ui .medexp-qb-feedback__body ul.mpj-xp__list { list-style: none !important; padding: 0 !important; margin: 0 !important; display: grid; grid-template-columns: minmax(0, 1fr); gap: 10px; }
html body.mpj-ui ul.mpj-xp__list > li { min-width: 0; margin: 0 !important; padding: 12px 14px !important; border-radius: 12px; background: #fff; border: 1px solid var(--mpj-line, #e3e8ef); }
html body.mpj-ui ul.mpj-xp__list > li::before, html body.mpj-ui ul.mpj-xp__list > li::marker { content: none !important; }
html body.mpj-ui ul.mpj-xp__list > li.is-mine { border-color: color-mix(in srgb, var(--mpj-danger, #dc2626) 35%, #fff); background: color-mix(in srgb, var(--mpj-danger, #dc2626) 4%, #fff); }
html body.mpj-ui .mpj-xp__opt { display: flex; align-items: center; gap: 10px; min-width: 0; margin-bottom: 4px; }
html body.mpj-ui .mpj-xp__optText { flex: 1; min-width: 0; font-size: 13.5px; color: var(--mpj-muted, #556274); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
html body.mpj-ui .mpj-xp__you { flex: none; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--mpj-danger, #dc2626); background: #fff; border: 1px solid color-mix(in srgb, var(--mpj-danger, #dc2626) 30%, #fff); padding: 2px 8px; border-radius: 999px; }
html body.mpj-ui .mpj-xp__reason { padding-left: 34px; color: var(--mpj-text, #1f2a3c); }
html body.mpj-ui .medexp-qb-feedback.mpj-xp .medexp-qb-references { border: 0 !important; background: none !important; padding: 0 !important; margin: 14px 0 0 !important; display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px; }
html body.mpj-ui .medexp-qb-feedback.mpj-xp .medexp-qb-references__lesson { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
html body.mpj-ui .medexp-qb-feedback.mpj-xp .medexp-qb-references__lessonLabel { font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: var(--mpj-muted, #556274); }
html body.mpj-ui a.mpj-xp__lessonBtn { display: inline-flex; align-items: center; gap: 6px; padding: 7px 14px; border-radius: 999px; background: color-mix(in srgb, var(--mpj-blue) 10%, #fff); color: var(--mpj-blue) !important; font-weight: 600; font-size: 13.5px; text-decoration: none !important; border: 1px solid color-mix(in srgb, var(--mpj-blue) 25%, #fff); transition: background .15s, transform .15s; }
html body.mpj-ui a.mpj-xp__lessonBtn::after { content: "\2192"; }
html body.mpj-ui a.mpj-xp__lessonBtn:hover { background: color-mix(in srgb, var(--mpj-blue) 16%, #fff); transform: translateX(2px); }
html body.mpj-ui details.mpj-xp__sources { flex-basis: 100%; font-size: 13px; color: var(--mpj-muted, #556274); }
html body.mpj-ui details.mpj-xp__sources > summary { cursor: pointer; list-style: none; display: inline-flex; align-items: center; gap: 6px; font-weight: 600; font-size: 13px; color: var(--mpj-muted, #556274); padding: 4px 0; }
html body.mpj-ui details.mpj-xp__sources > summary::-webkit-details-marker { display: none; }
html body.mpj-ui details.mpj-xp__sources > summary::before { content: "\25B8"; transition: transform .15s; }
html body.mpj-ui details.mpj-xp__sources[open] > summary::before { transform: rotate(90deg); }
html body.mpj-ui details.mpj-xp__sources ol { margin: 6px 0 0 18px !important; padding: 0 !important; display: grid; gap: 6px; line-height: 1.5; }
html body.mpj-ui a.mpj-xp__src { color: var(--mpj-blue) !important; font-weight: 600; text-decoration: none !important; border-bottom: 1px dotted currentColor; }
html body.mpj-ui .medexp-qb-feedback.mpj-xp .medexp-dnaMount { margin-top: 16px; }
html body.mpj-ui .mpj-xp__acts { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--mpj-line, #e3e8ef); }
html body.mpj-ui .mpj-xp__act { appearance: none; border: 1px solid var(--mpj-line, #e3e8ef); background: #fff; color: var(--mpj-navy, #132a52); font: inherit; font-size: 13px; font-weight: 600; padding: 7px 14px; border-radius: 999px; cursor: pointer; transition: border-color .15s, background .15s, transform .15s; }
html body.mpj-ui .mpj-xp__act:hover { border-color: var(--mpj-blue); background: color-mix(in srgb, var(--mpj-blue) 6%, #fff); transform: translateY(-1px); }
@media (max-width: 640px) {
  html body.mpj-ui .mpj-xp__reason { padding-left: 0; }
  html body.mpj-ui .mpj-xp__optText { white-space: normal; order: 3; flex-basis: 100%; }
  html body.mpj-ui .mpj-xp__opt { flex-wrap: wrap; gap: 6px 10px; }
  html body.mpj-ui .mpj-xp__verdict { gap: 2px 12px; }
  html body.mpj-ui .mpj-xp__dot { display: none; }
  html body.mpj-ui .medexp-qb-feedback.mpj-xp .medexp-qb-feedback__body { font-size: 15px; }
}
@media (prefers-reduced-motion: reduce) { html body.mpj-ui .medexp-qb-feedback.mpj-xp--in { animation: none; } }

/* Session review in fullscreen shell: the fixed .medexp-qbank must be the scroller, or the explanation is unreachable */
html body.mpj-ui.medexp-exam-fullscreen .medexp-qbank:has(.medexp-qb-sessionReview),
html body.mpj-ui.medexp-exam-fullscreen .medexp-qbank:has(.medexp-qb-summary) { overflow-y: auto !important; overscroll-behavior: contain; }

/* Cross-out mode for answer choices */
html body.mpj-ui.mpj-crossout .medexp-examRight .medexp-qb-choice { cursor: crosshair !important; }
html body.mpj-ui.mpj-crossout .medexp-examRight .medexp-qb-choice:hover { box-shadow: inset 0 0 0 2px color-mix(in srgb, var(--mpj-danger, #dc2626) 35%, transparent) !important; }
html body.mpj-ui .medexp-uw-toolBtn.is-active { background: rgba(255,255,255,.18) !important; box-shadow: inset 0 0 0 1px rgba(255,255,255,.35); }
html body.mpj-ui .medexp-qb-choice:has(.medexp-anno--so) .medexp-qb-choice__label { opacity: .45; }

/* Session review inside the normal app shell (matches the summary page) */
html body.mpj-ui .mpj-shell__content .medexp-qb-sessionReview.medexp-qb-case { left: 0 !important; transform: none !important; width: 100% !important; max-width: 1240px; margin: 0 auto 32px !important; grid-template-columns: minmax(230px, 280px) minmax(0, 1fr) !important; border: 0 !important; background: none !important; box-shadow: none !important; padding: 0 !important; }
@media (max-width: 1100px) { html body.mpj-ui .mpj-shell__content .medexp-qb-sessionReview.medexp-qb-case { grid-template-columns: minmax(0, 1fr) !important; padding: 12px !important; } html body.mpj-ui .mpj-shell__content .medexp-qb-sessionReview .medexp-sr-left { position: static !important; max-height: none; } }

/* Phones: review question list becomes a swipeable strip so the question is on screen first */
@media (max-width: 760px) {
  html body.mpj-ui .medexp-qb-sessionReview .medexp-sr-left { position: sticky !important; top: 56px; z-index: 5; padding: 10px !important; max-height: none; overflow: visible; }
  html body.mpj-ui .medexp-qb-sessionReview .medexp-sr-left__title { display: none !important; }
  html body.mpj-ui .medexp-qb-sessionReview .medexp-sr-list { display: flex !important; flex-direction: row !important; gap: 8px; overflow-x: auto; scroll-snap-type: x proximity; padding: 2px 2px 4px; scrollbar-width: none; }
  html body.mpj-ui .medexp-qb-sessionReview .medexp-sr-list::-webkit-scrollbar { display: none; }
  html body.mpj-ui .medexp-qb-sessionReview .medexp-sr-row { flex: none; width: auto !important; min-width: 0; padding: 4px !important; border-radius: 12px !important; scroll-snap-align: start; position: relative; }
  html body.mpj-ui .medexp-qb-sessionReview .medexp-sr-row__type, html body.mpj-ui .medexp-qb-sessionReview .medexp-sr-row__dot { display: none !important; }
  html body.mpj-ui .medexp-qb-sessionReview .medexp-sr-row__note { position: absolute; top: -4px; right: -4px; transform: scale(.7); }
  html body.mpj-ui .medexp-qb-sessionReview .medexp-sr-row.is-active { box-shadow: 0 0 0 2px var(--mpj-blue) !important; }
  html body.mpj-ui .mpj-shell__content .medexp-card:has(.medexp-qb-sessionReview) { padding: 10px !important; }
  html body.mpj-ui .mpj-shell__content .medexp-card:has(.mpj-ssum) { padding: 12px !important; }
}