/* =====================================================================
   Examups Learning — Frontend
   Mobile-first, responsive across all devices.
   Breakpoints:  ≤480 (xs)  ≤768 (sm)  ≤1023 (md)  ≥1024 (lg)  ≥1280 (xl)
===================================================================== */

:root{
  --eu-primary:#2563eb;       --eu-primary-700:#1d4ed8;   --eu-primary-50:#eff6ff;
  --eu-success:#10b981;       --eu-success-50:#dcfce7;
  --eu-warning:#f59e0b;       --eu-warning-50:#fef3c7;
  --eu-danger:#ef4444;        --eu-danger-50:#fee2e2;
  --eu-fg:#0f172a;            --eu-fg-soft:#334155;       --eu-muted:#64748b;
  --eu-bg:#ffffff;            --eu-bg-soft:#f8fafc;       --eu-bg-elev:#ffffff;
  --eu-border:#e5e7eb;        --eu-border-soft:#f1f5f9;
  --eu-radius:12px;           --eu-radius-lg:16px;        --eu-radius-sm:8px;
  --eu-shadow:0 1px 2px rgba(15,23,42,.04), 0 4px 14px rgba(15,23,42,.04);
  --eu-shadow-lg:0 10px 30px rgba(15,23,42,.08);
  --eu-grad:linear-gradient(135deg,#6366f1 0%,#8b5cf6 35%,#ec4899 100%);
  --eu-font:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif;
}
/* Note: Removed @media (prefers-color-scheme: dark) override.
   The player ships with fixed light-mode design tokens because the
   question cards, intro panel and modals all use explicit white
   backgrounds. Following the OS dark setting flipped the text colors
   to near-white and made content unreadable on those white surfaces. */

/* ---------- Buttons ---------- */
.examups-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:6px;
  padding:10px 18px;border-radius:var(--eu-radius-sm);
  border:1px solid transparent;font-weight:600;cursor:pointer;
  text-decoration:none;line-height:1.2;font-size:14px;
  transition:transform .12s ease, background .15s, color .15s, border-color .15s, box-shadow .15s;
  font-family:var(--eu-font);
}
.examups-btn:hover{transform:translateY(-1px);}
.examups-btn:active{transform:translateY(0);}
.examups-btn-primary{background:var(--eu-primary);color:#fff;}
.examups-btn-primary:hover{background:var(--eu-primary-700);box-shadow:0 6px 20px rgba(37,99,235,.35);}
.examups-btn-ghost{background:transparent;color:var(--eu-primary);border-color:var(--eu-primary);}
.examups-btn-ghost:hover{background:var(--eu-primary-50);}
.examups-btn-sm{padding:6px 12px;font-size:12px;}
.examups-btn:disabled{opacity:.55;cursor:not-allowed;transform:none;}

.examups-muted{color:var(--eu-muted);font-size:13px;}
.examups-free{color:var(--eu-success);}

/* ---------- Chips ---------- */
.examups-chip{
  display:inline-flex;align-items:center;gap:4px;
  background:var(--eu-bg-soft);color:var(--eu-fg-soft);
  padding:4px 12px;border-radius:999px;font-size:12px;font-weight:600;
  border:1px solid var(--eu-border-soft);
}
.examups-chip-primary{background:var(--eu-primary-50);color:var(--eu-primary-700);border-color:transparent;}
.examups-chip-success{background:var(--eu-success-50);color:#166534;border-color:transparent;}
.examups-chip-row{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:14px;}

/* ---------- Listing grid ---------- */
.examups-grid{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));
  gap:18px;margin:20px 0;
}
.examups-course-card{
  border:1px solid var(--eu-border);border-radius:var(--eu-radius-lg);
  overflow:hidden;background:var(--eu-bg-elev);box-shadow:var(--eu-shadow);
  display:flex;flex-direction:column;transition:transform .15s, box-shadow .15s;
}
.examups-course-card:hover{transform:translateY(-2px);box-shadow:var(--eu-shadow-lg);}
.examups-card-thumb{height:160px;background:var(--eu-bg-soft) center/cover no-repeat;}
.examups-card-body{padding:16px;display:flex;flex-direction:column;gap:6px;flex:1;}
.examups-card-body h3{margin:0;font-size:18px;color:var(--eu-fg);}
.examups-card-actions{margin-top:auto;display:flex;gap:8px;padding-top:12px;}
.examups-price{font-size:18px;font-weight:700;margin:6px 0;color:var(--eu-fg);}

/* =====================================================================
   COURSE DETAIL PAGE
===================================================================== */
.examups-detail{
  font-family:var(--eu-font);color:var(--eu-fg);
  margin:0 auto 80px;max-width:1200px;
}

/* ---------- Hero ---------- */
.examups-hero{
  position:relative;overflow:hidden;border-radius:var(--eu-radius-lg);
  background:var(--eu-grad);color:#fff;padding:32px 24px 28px;
  margin-bottom:18px;box-shadow:var(--eu-shadow-lg);
}
.examups-hero::before{
  content:"";position:absolute;inset:0;
  background:radial-gradient(800px 400px at 100% -20%, rgba(255,255,255,.18), transparent 60%),
             radial-gradient(600px 300px at -10% 110%, rgba(255,255,255,.12), transparent 60%);
  pointer-events:none;
}
.examups-hero-inner{position:relative;}
.examups-hero .examups-chip{background:rgba(255,255,255,.18);color:#fff;border-color:rgba(255,255,255,.25);}
.examups-hero .examups-chip-primary{background:#fff;color:var(--eu-primary-700);}
.examups-hero .examups-chip-success{background:rgba(16,185,129,.95);color:#fff;}
.examups-hero-title{
  font-size:clamp(22px, 3.4vw, 36px);line-height:1.15;
  margin:6px 0 8px;font-weight:800;letter-spacing:-.01em;color:#fff;
}
.examups-hero-tagline{margin:0 0 18px;font-size:clamp(14px, 1.5vw, 17px);opacity:.92;max-width:60ch;}

.examups-stats-strip{
  list-style:none;padding:0;margin:18px 0 0;
  display:grid;grid-template-columns:repeat(auto-fit,minmax(110px,1fr));gap:8px;
}
.examups-stats-strip li{
  background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.18);
  border-radius:var(--eu-radius-sm);padding:10px 12px;backdrop-filter:blur(6px);
  display:flex;flex-direction:column;align-items:flex-start;gap:2px;
}
.examups-stats-strip .num{font-size:20px;font-weight:800;line-height:1;}
.examups-stats-strip .lbl{font-size:11px;text-transform:uppercase;letter-spacing:.04em;opacity:.85;}

.examups-hero-progress{margin-top:18px;}
.examups-hero-progress .examups-progress-bar{background:rgba(255,255,255,.25);}
.examups-hero-progress .examups-progress-bar span{
  background:linear-gradient(90deg,#fff,#fef3c7);
}
.examups-hero-progress small{display:block;margin-top:6px;color:rgba(255,255,255,.92);}

/* ---------- Anchor nav ---------- */
.examups-anchornav{
  position:sticky;top:0;z-index:20;background:var(--eu-bg);
  display:flex;gap:4px;padding:8px;margin:0 0 18px;
  border:1px solid var(--eu-border);border-radius:999px;
  overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none;
  box-shadow:var(--eu-shadow);
}
.examups-anchornav::-webkit-scrollbar{display:none;}
.examups-anchornav a{
  padding:8px 16px;border-radius:999px;font-size:13px;font-weight:600;
  text-decoration:none;color:var(--eu-fg-soft);white-space:nowrap;
  transition:background .15s, color .15s;
}
.examups-anchornav a:hover{background:var(--eu-primary-50);color:var(--eu-primary-700);}

/* ---------- Two-column body ---------- */
.examups-detail-grid{
  display:grid;grid-template-columns:1fr;gap:20px;align-items:start;
}
.examups-detail-main{min-width:0;}

.examups-block{
  background:var(--eu-bg-elev);border:1px solid var(--eu-border);
  border-radius:var(--eu-radius-lg);padding:20px;margin:0 0 18px;
  box-shadow:var(--eu-shadow);scroll-margin-top:80px;
}
.examups-block h2{
  margin:0 0 14px;font-size:18px;font-weight:700;color:var(--eu-fg);
  display:flex;align-items:center;gap:8px;
}
.examups-block h2::before{
  content:"";display:inline-block;width:4px;height:18px;border-radius:4px;
  background:var(--eu-grad);
}

/* What you get */
.examups-outputs{
  list-style:none;padding:0;margin:0;
  display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:8px;
}
.examups-outputs li{
  background:var(--eu-bg-soft);border:1px solid var(--eu-border-soft);
  border-radius:var(--eu-radius-sm);padding:10px 14px 10px 36px;position:relative;
  font-size:14px;color:var(--eu-fg-soft);
}
.examups-outputs li::before{
  content:"✓";position:absolute;left:12px;top:50%;transform:translateY(-50%);
  width:18px;height:18px;border-radius:999px;background:var(--eu-success-50);
  color:#166534;display:inline-flex;align-items:center;justify-content:center;
  font-size:11px;font-weight:800;
}

/* Syllabus */
.examups-syllabus-view details{
  border:1px solid var(--eu-border);border-radius:var(--eu-radius-sm);
  padding:10px 14px;margin:8px 0;background:var(--eu-bg);
  transition:background .15s;
}
.examups-syllabus-view details[open]{background:var(--eu-bg-soft);}
.examups-syllabus-view summary{cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:10px;font-size:14px;}
.examups-syllabus-view summary::-webkit-details-marker{display:none;}
.examups-syllabus-view summary::before{
  content:"▸";display:inline-block;margin-right:6px;color:var(--eu-muted);
  transition:transform .15s;
}
.examups-syllabus-view details[open] > summary::before{transform:rotate(90deg);}
.examups-syllabus-view .examups-unit-block{margin-left:18px;background:var(--eu-bg-elev);}
.examups-syllabus-view ul{margin:6px 0 0 18px;padding:0 0 0 18px;}
.examups-syllabus-view ul li{font-size:13px;color:var(--eu-fg-soft);padding:4px 0;}

/* Pattern table */
.examups-table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;}
.examups-pattern{width:100%;border-collapse:collapse;font-size:13px;}
.examups-pattern th,.examups-pattern td{
  border-bottom:1px solid var(--eu-border-soft);padding:10px 12px;text-align:left;
}
.examups-pattern th{background:var(--eu-bg-soft);color:var(--eu-fg-soft);font-weight:700;}

/* ---------- Sidebar: enrollment card ---------- */
.examups-detail-side{display:flex;flex-direction:column;gap:18px;min-width:0;}
.examups-enroll-card{
  background:var(--eu-bg-elev);border:1px solid var(--eu-border);
  border-radius:var(--eu-radius-lg);padding:20px;box-shadow:var(--eu-shadow);
}
.examups-enroll-card-price{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin-bottom:12px;}
.examups-enroll-card-price strong{font-size:28px;font-weight:800;color:var(--eu-fg);letter-spacing:-.02em;}
.examups-mrp{color:var(--eu-muted);text-decoration:line-through;font-size:14px;}
.examups-discount{
  background:var(--eu-success-50);color:#166534;padding:2px 10px;
  border-radius:999px;font-size:11px;font-weight:700;
}
.examups-cta-main{width:100%;font-size:15px;padding:14px 18px;}
.examups-cta-meta{margin:10px 0 0;font-size:12px;color:var(--eu-muted);text-align:center;}

.examups-includes{
  list-style:none;padding:14px 0 0;margin:14px 0 0;
  border-top:1px solid var(--eu-border-soft);
  display:flex;flex-direction:column;gap:6px;
}
.examups-includes li{
  font-size:13px;color:var(--eu-fg-soft);padding-left:22px;position:relative;
}
.examups-includes li::before{
  content:"✓";position:absolute;left:0;top:1px;color:var(--eu-success);font-weight:800;
}

/* ---------- Course Library panel ---------- */
.examups-content-panel{
  background:var(--eu-bg-elev);border:1px solid var(--eu-border);
  border-radius:var(--eu-radius-lg);overflow:hidden;box-shadow:var(--eu-shadow);
}
.examups-content-panel-head{
  display:flex;justify-content:space-between;align-items:baseline;
  padding:14px 16px;border-bottom:1px solid var(--eu-border-soft);
  background:var(--eu-bg-soft);
}
.examups-content-panel-head strong{font-size:14px;color:var(--eu-fg);}
.examups-content-summary{
  list-style:none;padding:10px 16px;margin:0;
  display:grid;grid-template-columns:1fr;gap:4px;
  border-bottom:1px solid var(--eu-border-soft);background:var(--eu-bg);
}
.examups-content-summary li{
  display:flex;justify-content:space-between;font-size:12px;color:var(--eu-fg-soft);
}
.examups-content-summary b{color:var(--eu-fg);font-weight:700;}

.examups-content-list{
  list-style:none;padding:6px;margin:0;
  max-height:520px;overflow:auto;
}
.examups-content-item{
  display:grid;grid-template-columns:28px 1fr auto auto;gap:10px;align-items:center;
  padding:10px 8px;border-radius:8px;border:1px solid transparent;
  transition:background .12s, border-color .12s;
}
.examups-content-item + .examups-content-item{margin-top:2px;}
.examups-content-item:hover{background:var(--eu-bg-soft);border-color:var(--eu-border-soft);}
.examups-content-icon{
  width:28px;height:28px;border-radius:8px;background:var(--eu-bg-soft);
  display:flex;align-items:center;justify-content:center;font-size:14px;color:var(--eu-fg-soft);
}
.examups-content-body{display:flex;flex-direction:column;min-width:0;}
.examups-content-body strong{
  font-size:13px;font-weight:600;color:var(--eu-fg);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.examups-content-body small{font-size:11px;color:var(--eu-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.examups-content-status{display:inline-flex;}

.examups-content-item.examups-status-generating{background:#fffbeb;}
.examups-content-item.examups-status-queued{background:var(--eu-bg-soft);}
.examups-content-item.examups-status-failed{background:var(--eu-danger-50);}
@media (prefers-color-scheme:dark){
  .examups-content-item.examups-status-generating{background:rgba(245,158,11,.08);}
  .examups-content-item.examups-status-failed{background:rgba(239,68,68,.08);}
}

.examups-empty{
  display:flex;align-items:center;gap:10px;padding:18px;
  color:var(--eu-muted);font-size:13px;text-align:center;justify-content:center;
}
.examups-locked-note{
  margin:0;padding:10px 16px;font-size:12px;
  background:var(--eu-bg-soft);border-top:1px solid var(--eu-border-soft);
}

/* ---------- Status badges ---------- */
.examups-badge{
  display:inline-flex;align-items:center;justify-content:center;
  width:26px;height:26px;border-radius:999px;font-size:13px;line-height:1;
  font-weight:700;
}
.examups-badge-ready{background:var(--eu-success-50);color:#166534;}
.examups-badge-locked{background:var(--eu-bg-soft);color:var(--eu-muted);}
.examups-badge-gen{background:var(--eu-warning-50);color:#a16207;animation:eu-pulse 1.6s infinite;}
.examups-badge-queued{background:var(--eu-bg-soft);color:var(--eu-muted);}
.examups-badge-failed{background:var(--eu-danger-50);color:#b91c1c;}
@keyframes eu-pulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.7;transform:scale(.95)}}

/* ---------- Progress bar ---------- */
.examups-progress-bar{
  background:var(--eu-bg-soft);border-radius:999px;height:8px;overflow:hidden;
}
.examups-progress-bar span{
  display:block;height:100%;
  background:linear-gradient(90deg,#3b82f6,#8b5cf6,#ec4899);
  background-size:200% 100%;
  animation:eu-shimmer 2.4s linear infinite;
  transition:width .6s cubic-bezier(.4,0,.2,1);
  border-radius:999px;
}
@keyframes eu-shimmer{0%{background-position:0 0}100%{background-position:200% 0}}
.examups-progress{margin:8px 0;}

/* ---------- Generation status page ---------- */
.examups-generation{margin:24px auto;max-width:1200px;}
.examups-gen-head h1{margin:0 0 4px;font-size:clamp(22px,3vw,28px);color:var(--eu-fg);}
.examups-progress-large{margin-top:14px;}
.examups-progress-large .examups-progress-bar{height:14px;}
.examups-progress-meta{display:flex;justify-content:space-between;align-items:baseline;margin-top:8px;}
.examups-progress-meta strong{font-size:20px;color:var(--eu-fg);}
.examups-gen-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:20px;}
.examups-gen-col{
  background:var(--eu-bg-elev);border:1px solid var(--eu-border);
  border-radius:var(--eu-radius-lg);padding:16px;min-height:300px;
  box-shadow:var(--eu-shadow);
}
.examups-gen-col h2{display:flex;align-items:center;gap:8px;font-size:15px;margin:0 0 12px;color:var(--eu-fg);}
.examups-count{margin-left:auto;background:var(--eu-bg-soft);color:var(--eu-fg-soft);padding:2px 10px;border-radius:999px;font-size:11px;font-weight:700;}
.examups-dot{display:inline-block;width:10px;height:10px;border-radius:999px;}
.examups-dot-yellow{background:var(--eu-warning);animation:eu-pulse 1.6s infinite;}
.examups-dot-green{background:var(--eu-success);}
.examups-gen-list{list-style:none;padding:0;margin:0;}
.examups-gen-row{
  display:grid;grid-template-columns:28px 1fr auto;gap:10px;align-items:center;
  padding:10px 8px;border-radius:8px;
}
.examups-gen-row + .examups-gen-row{margin-top:2px;}
.examups-gen-row:hover{background:var(--eu-bg-soft);}
.examups-gen-icon{width:28px;height:28px;border-radius:8px;background:var(--eu-bg-soft);display:flex;align-items:center;justify-content:center;color:var(--eu-fg-soft);}
.examups-gen-body{display:flex;flex-direction:column;min-width:0;}
.examups-gen-body strong{font-size:13px;color:var(--eu-fg);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.examups-gen-body small{font-size:11px;color:var(--eu-muted);}
.examups-gen-spinner{font-size:11px;color:#a16207;background:var(--eu-warning-50);padding:3px 10px;border-radius:999px;font-weight:600;}
.examups-status-failed .examups-gen-spinner{color:#b91c1c;background:var(--eu-danger-50);}

/* ---------- Dashboard (legacy compat) ---------- */
.examups-dashboard{max-width:1200px;margin:0 auto;}

/* ==========================================================
   NEW LEARNER DASHBOARD — all colors use explicit hex so
   dark WordPress themes can NOT override them.
   ========================================================== */
.examups-dashboard-wrap{
  font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif;
  color:#0f172a !important;
  background:#f8fafc !important;
  max-width:1200px;margin:0 auto;padding:24px 16px 60px;
  border-radius:12px;
}
/* Force all text inside the dashboard to be dark */
.examups-dashboard-wrap *{box-sizing:border-box;}
.examups-dashboard-wrap p,
.examups-dashboard-wrap span,
.examups-dashboard-wrap small,
.examups-dashboard-wrap li{ color:#334155; }
.examups-dashboard-wrap h1,
.examups-dashboard-wrap h2,
.examups-dashboard-wrap h3,
.examups-dashboard-wrap strong{ color:#0f172a; }

/* ── Header ────────────────────────────────────────────────── */
.examups-dashboard-wrap .eud-header{
  display:flex;align-items:center;justify-content:space-between;
  flex-wrap:wrap;gap:16px;
  background:linear-gradient(135deg,#6366f1 0%,#8b5cf6 50%,#ec4899 100%) !important;
  color:#fff !important;
  border-radius:16px;padding:28px;
  margin-bottom:28px;
  box-shadow:0 10px 30px rgba(99,102,241,.3);
  position:relative;overflow:hidden;
}
.examups-dashboard-wrap .eud-header::before{
  content:"";position:absolute;inset:0;
  background:radial-gradient(700px 400px at 100% -20%,rgba(255,255,255,.18),transparent 60%);
  pointer-events:none;
}
.examups-dashboard-wrap .eud-header-left{
  display:flex;align-items:center;gap:16px;position:relative;
}
.examups-dashboard-wrap .eud-avatar{
  width:56px;height:56px;border-radius:50%;
  background:rgba(255,255,255,.2);border:2px solid rgba(255,255,255,.35);
  color:#fff !important;font-size:22px;font-weight:800;
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
}
.examups-dashboard-wrap .eud-greeting{
  margin:0;font-size:13px;color:rgba(255,255,255,.85) !important;
}
.examups-dashboard-wrap .eud-username{
  margin:4px 0 0;font-size:clamp(18px,2.5vw,24px);
  font-weight:800;line-height:1.15;color:#fff !important;
}
.examups-dashboard-wrap .eud-header-stats{
  display:flex;gap:16px;position:relative;flex-wrap:wrap;
}
.examups-dashboard-wrap .eud-hstat{
  display:flex;flex-direction:column;align-items:center;
  background:rgba(255,255,255,.15);border:1px solid rgba(255,255,255,.25);
  border-radius:10px;padding:12px 20px;min-width:80px;text-align:center;
}
.examups-dashboard-wrap .eud-hstat strong{
  font-size:28px;font-weight:800;line-height:1;color:#fff !important;
}
.examups-dashboard-wrap .eud-hstat span{
  font-size:11px;color:rgba(255,255,255,.85) !important;
  margin-top:4px;text-transform:uppercase;letter-spacing:.05em;
}

/* ── Section heading ───────────────────────────────────────── */
.examups-dashboard-wrap .eud-section{margin-bottom:32px;}
.examups-dashboard-wrap .eud-section-title{
  font-size:18px;font-weight:800;color:#0f172a !important;
  margin:0 0 16px;padding-bottom:10px;
  border-bottom:2px solid #e2e8f0;
}

/* ── Empty state ────────────────────────────────────────────── */
.examups-dashboard-wrap .eud-empty{
  text-align:center;padding:60px 24px;
  border:2px dashed #e2e8f0;border-radius:16px;
  background:#fff !important;
}
.examups-dashboard-wrap .eud-empty-icon{font-size:52px;margin-bottom:14px;display:block;}
.examups-dashboard-wrap .eud-empty h3{
  margin:0 0 8px;font-size:20px;color:#0f172a !important;
}
.examups-dashboard-wrap .eud-empty p{
  margin:0 0 20px;color:#64748b !important;
  max-width:400px;margin-left:auto;margin-right:auto;
}

/* ── Course card grid ──────────────────────────────────────── */
.examups-dashboard-wrap .eud-course-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(300px,1fr));
  gap:20px;
}
.examups-dashboard-wrap .eud-course-card{
  background:#ffffff !important;
  border:1px solid #e2e8f0 !important;
  border-radius:16px;overflow:hidden;
  box-shadow:0 1px 3px rgba(15,23,42,.06),0 4px 14px rgba(15,23,42,.04);
  display:flex !important;flex-direction:column !important;
  transition:transform .15s,box-shadow .15s;
}
.examups-dashboard-wrap .eud-course-card:hover{
  transform:translateY(-3px);
  box-shadow:0 10px 30px rgba(15,23,42,.12);
}

/* ── Thumbnail ──────────────────────────────────────────────── */
.examups-dashboard-wrap .eud-card-thumb{
  height:160px;
  background:linear-gradient(135deg,#6366f1,#8b5cf6,#ec4899) center/cover no-repeat;
  position:relative;display:flex;align-items:center;justify-content:center;
  flex-shrink:0;
}
.examups-dashboard-wrap .eud-thumb-icon{font-size:48px;opacity:.5;}
.examups-dashboard-wrap .eud-card-status-badge{
  position:absolute;top:12px;right:12px;
  font-size:11px;font-weight:800;padding:4px 12px;border-radius:999px;
  text-transform:uppercase;letter-spacing:.04em;
  box-shadow:0 2px 6px rgba(0,0,0,.15);
}
.examups-dashboard-wrap .eud-badge-active{
  background:#dcfce7 !important;color:#166534 !important;
}
.examups-dashboard-wrap .eud-badge-pending{
  background:#fef3c7 !important;color:#a16207 !important;
}
.examups-dashboard-wrap .eud-badge-expired{
  background:#fee2e2 !important;color:#b91c1c !important;
}

/* ── Card body ──────────────────────────────────────────────── */
.examups-dashboard-wrap .eud-card-body{
  padding:18px;display:flex !important;flex-direction:column !important;
  gap:12px;flex:1;background:#ffffff !important;
}
.examups-dashboard-wrap .eud-card-title{
  margin:0;font-size:16px;font-weight:700;
  color:#0f172a !important;line-height:1.35;
}

/* ── Progress bar ───────────────────────────────────────────── */
.examups-dashboard-wrap .eud-progress-wrap{display:flex;flex-direction:column;gap:6px;}
.examups-dashboard-wrap .eud-progress-bar{
  height:8px;background:#e2e8f0;border-radius:999px;overflow:hidden;
}
.examups-dashboard-wrap .eud-progress-bar span{
  display:block;height:100%;border-radius:999px;
  background:linear-gradient(90deg,#3b82f6,#8b5cf6);
  transition:width .5s cubic-bezier(.4,0,.2,1);
}
.examups-dashboard-wrap .eud-progress-meta{
  display:flex;justify-content:space-between;align-items:center;font-size:12px;
}
.examups-dashboard-wrap .eud-progress-state{
  color:#64748b !important;display:flex;align-items:center;gap:4px;
}
.examups-dashboard-wrap .eud-progress-pct{
  font-weight:700;color:#0f172a !important;
}

/* ── Stats strip ────────────────────────────────────────────── */
.examups-dashboard-wrap .eud-card-stats{
  display:flex;gap:16px;padding:10px 14px;
  background:#f1f5f9 !important;border-radius:8px;
  font-size:13px;color:#475569 !important;
}
.examups-dashboard-wrap .eud-card-stats strong{
  color:#0f172a !important;font-weight:700;
}

/* ── Pending / expired message ──────────────────────────────── */
.examups-dashboard-wrap .eud-pending-msg{
  margin:0;font-size:13.5px;color:#475569 !important;line-height:1.55;
}

/* ── Action button ──────────────────────────────────────────── */
.examups-dashboard-wrap .eud-card-actions{margin-top:auto;padding-top:4px;}
.examups-dashboard-wrap .eud-cta{
  width:100%;justify-content:center;padding:12px 18px;font-size:14px;
  display:flex !important;
}

/* Progress text (legacy) */
.examups-progress-text{display:block;margin-top:6px;}

/* ── Responsive ─────────────────────────────────────────────── */
@media(max-width:768px){
  .examups-dashboard-wrap{padding:16px 12px 40px;}
  .examups-dashboard-wrap .eud-header{padding:20px 16px;}
  .examups-dashboard-wrap .eud-header-stats{gap:10px;}
  .examups-dashboard-wrap .eud-hstat{padding:10px 14px;min-width:64px;}
  .examups-dashboard-wrap .eud-hstat strong{font-size:22px;}
  .examups-dashboard-wrap .eud-course-grid{grid-template-columns:1fr;}
}

/* ---------- Mobile sticky CTA ---------- */
.examups-mobile-cta{
  display:none;position:fixed;left:0;right:0;bottom:0;z-index:50;
  background:var(--eu-bg);border-top:1px solid var(--eu-border);
  box-shadow:0 -4px 14px rgba(15,23,42,.06);
  padding:env(safe-area-inset-bottom) 0 max(8px,env(safe-area-inset-bottom));
}
.examups-mobile-cta-inner{
  display:flex;align-items:center;gap:12px;padding:10px 16px;max-width:1200px;margin:0 auto;
}
.examups-mobile-cta-price{display:flex;flex-direction:column;line-height:1;}
.examups-mobile-cta-price strong{font-size:18px;font-weight:800;color:var(--eu-fg);}
.examups-mobile-cta-price small{font-size:11px;color:var(--eu-muted);text-decoration:line-through;}
.examups-mobile-cta .examups-btn{flex:1;padding:14px 18px;font-size:15px;}

/* =====================================================================
   RESPONSIVE BREAKPOINTS
===================================================================== */

/* lg: ≥1024 — desktop two-column */
@media (min-width:1024px){
  .examups-detail-grid{grid-template-columns:minmax(0,1fr) 360px;gap:24px;}
  .examups-detail-side{position:sticky;top:80px;max-height:calc(100vh - 96px);overflow-y:auto;overflow-x:hidden;padding-right:4px;}
  .examups-library-mobile{display:none;}
  .examups-hero{padding:40px 36px 32px;}
}

/* md: 768–1023 — single column, library still in main flow */
@media (max-width:1023px){
  .examups-library-desktop{display:none;}
  .examups-detail-side{order:-1;} /* enrollment card above syllabus on tablet */
  .examups-enroll-card{position:relative;}
}

/* sm: ≤768 — mobile stacked, sticky bottom CTA */
@media (max-width:768px){
  .examups-detail{margin-bottom:120px;padding:0 12px;}
  .examups-hero{padding:24px 18px 22px;border-radius:var(--eu-radius);}
  .examups-stats-strip{grid-template-columns:repeat(auto-fit,minmax(85px,1fr));gap:6px;}
  .examups-stats-strip li{padding:8px 10px;}
  .examups-stats-strip .num{font-size:17px;}
  .examups-block{padding:16px;border-radius:var(--eu-radius);}
  .examups-anchornav{margin-left:-12px;margin-right:-12px;border-radius:0;border-left:0;border-right:0;}
  .examups-mobile-cta{display:block;}
  /* Hide the inline CTA in the enrollment card on mobile (sticky bar replaces it) */
  .examups-enroll-card .examups-cta-main{display:none;}
  .examups-enroll-card .examups-cta-meta{margin-top:0;}
  /* Stack pattern table cells */
  .examups-pattern thead{display:none;}
  .examups-pattern tr{display:block;border:1px solid var(--eu-border-soft);border-radius:var(--eu-radius-sm);padding:8px;margin-bottom:8px;background:var(--eu-bg);}
  .examups-pattern td{display:flex;justify-content:space-between;border:0;padding:5px 4px;font-size:13px;}
  .examups-pattern td::before{content:attr(data-label);font-weight:700;color:var(--eu-muted);}
}

/* xs: ≤480 — tightest spacing */
@media (max-width:480px){
  .examups-hero-title{font-size:22px;}
  .examups-hero-tagline{font-size:13px;}
  .examups-stats-strip{grid-template-columns:repeat(2,1fr);}
  .examups-content-item{grid-template-columns:24px 1fr auto;}
  .examups-content-item .examups-btn-sm{display:none;} /* tap row to expand instead */
  .examups-content-item.examups-status-ready{cursor:pointer;}
  .examups-anchornav a{padding:6px 12px;font-size:12px;}
  .examups-enroll-card-price strong{font-size:24px;}
}

/* Print */
@media print{
  .examups-anchornav,.examups-mobile-cta,.examups-detail-side,.examups-content-list .examups-btn{display:none !important;}
  .examups-hero{background:#fff;color:#000;box-shadow:none;}
  .examups-hero-title,.examups-hero-tagline,.examups-hero .examups-chip{color:#000;}
}

/* Reduce motion */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;}
}

/* =====================================================================
   Lesson Notes Viewer (full-screen page)
   Reached via ?examups_notes=ID — template_include hijack
   ===================================================================== */
.examups-notes-shell{
  max-width:920px;
  margin:24px auto 64px;
  padding:0 16px;
  color:var(--eu-fg);
}

.examups-notes-header{
  position:sticky;
  top:0;
  z-index:20;
  display:flex;
  flex-wrap:wrap;
  gap:10px 14px;
  align-items:center;
  justify-content:space-between;
  padding:10px 14px;
  margin-bottom:18px;
  background:color-mix(in srgb, var(--eu-bg) 92%, transparent);
  -webkit-backdrop-filter:saturate(160%) blur(10px);
  backdrop-filter:saturate(160%) blur(10px);
  border:1px solid var(--eu-border-soft);
  border-radius:var(--eu-radius);
  box-shadow:var(--eu-shadow);
}

.examups-notes-back{
  display:inline-flex;
  align-items:center;
  gap:6px;
  font-weight:600;
  text-decoration:none;
  color:var(--eu-primary);
  padding:6px 10px;
  border-radius:var(--eu-radius-sm);
  transition:background .15s ease;
}
.examups-notes-back:hover{background:var(--eu-primary-50);}

.examups-notes-crumbs{
  flex:1 1 220px;
  min-width:0;
  font-size:13px;
  color:var(--eu-muted);
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.examups-notes-crumbs span{display:inline-block;max-width:100%;overflow:hidden;text-overflow:ellipsis;}

.examups-notes-actions{display:flex;gap:8px;flex-shrink:0;}

.examups-notes-article{
  background:var(--eu-bg);
  border:1px solid var(--eu-border-soft);
  border-radius:var(--eu-radius);
  padding:clamp(20px, 4vw, 40px);
  box-shadow:var(--eu-shadow);
  line-height:1.7;
  font-size:16px;
}

.examups-notes-title{
  font-size:clamp(22px, 3.4vw, 32px);
  font-weight:800;
  letter-spacing:-.01em;
  margin:0 0 8px;
  line-height:1.25;
  color:var(--eu-fg);
}

.examups-notes-summary{
  font-size:clamp(15px, 1.8vw, 17px);
  color:var(--eu-muted);
  margin:0 0 22px;
  padding:14px 16px;
  background:var(--eu-primary-50);
  border-left:4px solid var(--eu-primary);
  border-radius:var(--eu-radius-sm);
  line-height:1.6;
}

.examups-notes-section{margin:26px 0;}
.examups-notes-section h2{
  font-size:clamp(18px, 2.2vw, 22px);
  font-weight:700;
  margin:0 0 12px;
  padding-bottom:6px;
  border-bottom:2px solid var(--eu-border-soft);
  color:var(--eu-fg);
}

.examups-notes-body{font-size:16px;line-height:1.75;color:var(--eu-fg);}
.examups-notes-body p{margin:0 0 12px;}
.examups-notes-body ul,
.examups-notes-body ol{margin:0 0 14px;padding-left:24px;}
.examups-notes-body li{margin:4px 0;}
.examups-notes-body strong{color:var(--eu-fg);}
.examups-notes-body code{
  background:var(--eu-bg-soft);
  border:1px solid var(--eu-border-soft);
  border-radius:4px;
  padding:1px 6px;
  font-size:.92em;
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
}
.examups-notes-body pre{
  background:var(--eu-bg-soft);
  border:1px solid var(--eu-border-soft);
  border-radius:var(--eu-radius-sm);
  padding:12px 14px;
  overflow-x:auto;
  font-size:13px;
  line-height:1.55;
}
.examups-notes-body pre code{background:transparent;border:0;padding:0;}
.examups-notes-body blockquote{
  margin:14px 0;
  padding:10px 16px;
  border-left:4px solid var(--eu-primary);
  background:var(--eu-bg-soft);
  border-radius:0 var(--eu-radius-sm) var(--eu-radius-sm) 0;
  color:var(--eu-muted);
}
.examups-notes-body table{
  width:100%;
  border-collapse:collapse;
  margin:14px 0;
  font-size:14px;
}
.examups-notes-body th,
.examups-notes-body td{
  border:1px solid var(--eu-border-soft);
  padding:8px 10px;
  text-align:left;
  vertical-align:top;
}
.examups-notes-body th{background:var(--eu-bg-soft);font-weight:700;}
.examups-notes-body img{max-width:100%;height:auto;border-radius:var(--eu-radius-sm);}
.examups-notes-body a{color:var(--eu-primary);text-decoration:underline;}

.examups-notes-card{
  margin:22px 0;
  padding:18px 20px;
  background:var(--eu-bg-soft);
  border:1px solid var(--eu-border-soft);
  border-left:4px solid var(--eu-primary);
  border-radius:var(--eu-radius-sm);
}
.examups-notes-card h2{
  font-size:18px;
  font-weight:700;
  margin:0 0 10px;
  color:var(--eu-fg);
  border:0;
  padding:0;
  display:flex;
  align-items:center;
  gap:8px;
}

.examups-notes-formulas{border-left-color:#7c3aed;background:rgba(124,58,237,.06);}
.examups-notes-mnemonics{border-left-color:#0ea5e9;background:rgba(14,165,233,.06);}
.examups-notes-mistakes{border-left-color:#f59e0b;background:rgba(245,158,11,.07);}
.examups-notes-relevance{border-left-color:#10b981;background:rgba(16,185,129,.07);}

.examups-notes-bullets{margin:0;padding-left:22px;}
.examups-notes-bullets li{margin:6px 0;line-height:1.6;}
.examups-notes-formulas .examups-notes-bullets li code{
  display:inline-block;
  font-size:15px;
  padding:2px 8px;
  background:rgba(124,58,237,.08);
  border-color:rgba(124,58,237,.2);
}

.examups-notes-footer{
  margin-top:28px;
  padding-top:18px;
  border-top:1px solid var(--eu-border-soft);
  display:flex;
  justify-content:flex-start;
}

.examups-notes-empty{
  text-align:center;
  max-width:520px;
  margin:80px auto;
  padding:40px 24px;
  background:var(--eu-bg);
  border:1px dashed var(--eu-border);
  border-radius:var(--eu-radius);
}
.examups-notes-empty h2{margin:0 0 10px;font-size:20px;color:var(--eu-fg);}
.examups-notes-empty p{margin:0 0 16px;color:var(--eu-muted);}

/* Tablet & smaller */
@media (max-width:768px){
  .examups-notes-shell{margin:12px auto 40px;padding:0 12px;}
  .examups-notes-header{
    position:static;
    flex-direction:row;
    padding:8px 10px;
    border-radius:var(--eu-radius-sm);
  }
  .examups-notes-crumbs{order:3;flex-basis:100%;font-size:12px;white-space:normal;}
  .examups-notes-article{padding:18px 16px;font-size:15px;}
  .examups-notes-title{font-size:22px;}
  .examups-notes-summary{font-size:14px;padding:12px 14px;}
  .examups-notes-section h2{font-size:17px;}
  .examups-notes-card{padding:14px 14px;margin:18px 0;}
  .examups-notes-card h2{font-size:16px;}
  .examups-notes-body{font-size:15px;}
}

/* Phones */
@media (max-width:480px){
  .examups-notes-shell{padding:0 10px;}
  .examups-notes-article{padding:14px 12px;}
  .examups-notes-title{font-size:20px;}
  .examups-notes-summary{font-size:13px;line-height:1.55;}
  .examups-notes-body{font-size:14.5px;line-height:1.65;}
  .examups-notes-back{padding:4px 6px;font-size:14px;}
  .examups-notes-actions .examups-btn-sm{font-size:12px;padding:4px 8px;}
}

/* =====================================================================
   MOCK TEST PLAYER  ·  Multi-screen flow
   Loading → Introduction → Live Test → Review → Result
===================================================================== */

/* Reusable: button color variants */
.examups-btn-success{background:var(--eu-success);color:#fff;}
.examups-btn-success:hover{background:#0ea372;box-shadow:0 6px 18px rgba(16,185,129,.35);}
.examups-btn-warning{background:#8b5cf6;color:#fff;}
.examups-btn-warning:hover{background:#7c3aed;box-shadow:0 6px 18px rgba(139,92,246,.32);}
.examups-btn-danger-soft{background:#fee2e2;color:#b91c1c;border:1px solid #fecaca;}
.examups-btn-danger-soft:hover{background:#fecaca;}

.examups-test-shell{
  font-family:var(--eu-font);color:var(--eu-fg);
  position:relative;min-height:60vh;
}

.eu-screen{display:block;}
.eu-screen[hidden]{display:none !important;}

/* ---------- Loading screen ---------- */
.eu-screen-loading{
  min-height:60vh;display:flex;align-items:center;justify-content:center;
}
.eu-loader{display:flex;flex-direction:column;align-items:center;gap:14px;color:var(--eu-fg-soft);}
.eu-loader-ring{
  width:42px;height:42px;border-radius:50%;
  border:3px solid var(--eu-border);
  border-top-color:var(--eu-primary);
  animation:eu-spin 0.9s linear infinite;
}
@keyframes eu-spin{to{transform:rotate(360deg);}}

/* ---------- Reusable icon button ---------- */
.eu-icon-btn{
  width:36px;height:36px;border:0;border-radius:8px;cursor:pointer;
  background:transparent;color:var(--eu-fg-soft);
  display:inline-flex;align-items:center;justify-content:center;
  font-size:18px;transition:background .15s, color .15s;
}
.eu-icon-btn:hover{background:var(--eu-bg-soft);color:var(--eu-primary);}

/* ---------- Step 2 · Introduction ---------- */
.eu-screen-intro{
  background:linear-gradient(180deg,#0f172a 0%, #1e293b 100%);
  color:#fff;min-height:80vh;
  border-radius:16px;overflow:hidden;
  margin-bottom:30px;
  box-shadow:var(--eu-shadow-lg);
}
.eu-intro-topbar{
  display:flex;align-items:center;gap:14px;
  padding:18px 24px;background:rgba(15,23,42,.6);
  border-bottom:1px solid rgba(255,255,255,.08);
  position:sticky;top:0;z-index:10;backdrop-filter:blur(10px);
}
.eu-intro-topbar .eu-icon-btn{color:#fff;}
.eu-intro-topbar .eu-icon-btn:hover{background:rgba(255,255,255,.1);}
.eu-intro-title{font-size:18px;font-weight:700;color:#fff;flex:1;margin:0;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.eu-intro-type-chip{
  background:rgba(255,255,255,.12);color:#fff;
  padding:5px 12px;border-radius:999px;font-size:12px;font-weight:600;
}
.eu-intro-type-chip:empty{display:none;}

.eu-intro-layout{
  max-width:1100px;margin:0 auto;padding:32px 24px;
  display:grid;grid-template-columns:1fr;gap:28px;
}
@media(min-width:900px){
  .eu-intro-layout{grid-template-columns:1.6fr 1fr;align-items:start;}
}

.eu-intro-instructions{color:#cbd5e1;}
.eu-instr-section{margin-bottom:26px;}
.eu-instr-section h3{
  font-size:16px;font-weight:700;color:#fff;
  margin:0 0 12px;padding-bottom:6px;
  border-bottom:2px solid rgba(255,255,255,.18);display:inline-block;
}
.eu-instr-section ul{margin:0;padding:0;list-style:none;}
.eu-instr-section ul li{
  position:relative;padding-left:18px;margin:0 0 10px;font-size:14.5px;line-height:1.65;
}
.eu-instr-section ul li::before{
  content:"•";position:absolute;left:0;top:0;color:#60a5fa;font-weight:800;
}

.eu-legend-row{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px;}
.eu-legend-pill{
  display:inline-flex;align-items:center;gap:6px;
  background:rgba(255,255,255,.06);padding:6px 10px;border-radius:999px;
  font-size:12px;color:#e2e8f0;
}

.eu-summary-card{
  background:linear-gradient(160deg,#1e3a8a 0%, #4338ca 100%);
  color:#fff;border-radius:16px;padding:22px;
  border:1px solid rgba(255,255,255,.1);
  box-shadow:0 18px 38px rgba(15,23,42,.4);
  position:sticky;top:88px;
}
.eu-summary-card h3{margin:0 0 12px;font-size:16px;color:#fff;font-weight:700;}
.eu-summary-row{
  display:flex;justify-content:space-between;align-items:center;
  padding:11px 0;border-bottom:1px solid rgba(255,255,255,.12);font-size:14px;
}
.eu-summary-row:last-of-type{border-bottom:none;}
.eu-summary-row span{opacity:.85;}
.eu-summary-row strong{font-weight:700;color:#fff;}
.eu-section-list{margin-top:14px;background:rgba(0,0,0,.18);
  border-radius:10px;padding:10px 12px;}
.eu-section-list-head{font-size:12px;font-weight:700;color:#cbd5e1;
  text-transform:uppercase;letter-spacing:.06em;margin-bottom:6px;}
.eu-section-list-body{list-style:none;padding:0;margin:0;}
.eu-section-list-body li{
  display:flex;justify-content:space-between;align-items:center;
  padding:6px 0;border-bottom:1px dashed rgba(255,255,255,.1);font-size:13px;
}
.eu-section-list-body li:last-child{border-bottom:none;}
.eu-section-list-body em{font-style:normal;color:#cbd5e1;font-size:12px;}

.eu-agree-box{
  background:rgba(255,255,255,.94);color:var(--eu-fg);
  padding:13px 14px;border-radius:10px;display:flex;gap:10px;
  font-size:13px;line-height:1.5;margin-top:18px;cursor:pointer;
}
.eu-agree-box input{margin-top:2px;flex-shrink:0;width:16px;height:16px;cursor:pointer;}
.eu-intro-error{
  margin-top:10px;color:#fca5a5;font-size:13px;font-weight:600;text-align:center;
}
.eu-begin-btn{width:100%;margin-top:14px;font-size:15px;padding:14px 18px;}
.eu-begin-btn:disabled{background:#cbd5e1;color:#475569;cursor:not-allowed;opacity:1;}

/* ---------- Step 3 · Live Test ---------- */
.eu-screen-live{
  position:fixed;inset:0;background:#f1f5f9;z-index:99990;
  display:flex;flex-direction:column;
}
.eu-screen-live[hidden]{display:none !important;}

.eu-live-topbar{
  height:56px;background:#fff;border-bottom:1px solid var(--eu-border);
  display:flex;align-items:center;justify-content:space-between;
  padding:0 16px;flex-shrink:0;
}
.eu-live-tb-left{display:flex;align-items:center;gap:8px;min-width:0;}
.eu-live-tb-right{display:flex;align-items:center;gap:8px;}
.eu-mobile-menu{display:none;}
.eu-live-title{
  font-size:15px;font-weight:700;margin:0;color:var(--eu-fg);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:320px;
}
.eu-live-timer{
  background:#1e293b;color:#fff;padding:7px 14px;border-radius:8px;
  font-weight:700;font-variant-numeric:tabular-nums;font-size:14px;
  letter-spacing:.04em;min-width:80px;text-align:center;
}
.eu-live-timer.is-warn{background:#f59e0b;}
.eu-live-timer.is-danger{background:#ef4444;animation:eu-pulse 1.2s infinite;}

.eu-live-sections{
  display:flex;align-items:center;gap:18px;
  height:46px;padding:0 18px;background:#fff;
  border-bottom:1px solid var(--eu-border);overflow-x:auto;
  scrollbar-width:none;flex-shrink:0;
}
.eu-live-sections::-webkit-scrollbar{display:none;}
.eu-section-tab{
  background:transparent;border:0;padding:12px 4px;cursor:pointer;
  font-size:13.5px;font-weight:600;color:var(--eu-muted);
  border-bottom:3px solid transparent;white-space:nowrap;
  transition:color .15s, border-color .15s;
}
.eu-section-tab:hover{color:var(--eu-fg);}
.eu-section-tab.is-active{color:var(--eu-primary);border-bottom-color:var(--eu-primary);}

.eu-live-body{
  flex:1;display:grid;grid-template-columns:1fr 340px;
  overflow:hidden;background:#f1f5f9;
}

.eu-live-main{display:flex;flex-direction:column;overflow:hidden;}
.eu-q-scroll{flex:1;overflow-y:auto;padding:24px;}

.eu-q-card{
  background:#fff;border-radius:14px;border:1px solid var(--eu-border);
  padding:24px;margin-bottom:16px;box-shadow:0 1px 3px rgba(15,23,42,.04);
}
.eu-q-meta{
  display:flex;align-items:center;gap:10px;flex-wrap:wrap;
  font-size:12.5px;color:var(--eu-muted);font-weight:600;margin-bottom:14px;
}
.eu-q-num{color:var(--eu-fg);font-weight:700;font-size:14px;}
.eu-q-section{
  background:var(--eu-primary-50);color:var(--eu-primary-700);
  padding:3px 10px;border-radius:999px;font-size:11.5px;
}
.eu-q-marks{margin-left:auto;display:flex;gap:6px;align-items:center;
  font-size:12px;font-weight:700;
  background:var(--eu-bg-soft);padding:4px 10px;border-radius:6px;}
.eu-marks-pos{color:#16a34a;}
.eu-marks-neg{color:#dc2626;}

.eu-q-text{
  font-size:16px;line-height:1.6;font-weight:500;color:var(--eu-fg);
  margin-bottom:18px;
}

.eu-q-options{display:flex;flex-direction:column;gap:10px;}
.eu-q-opt-card{
  display:flex;align-items:center;gap:14px;
  background:#fff;border:1.5px solid var(--eu-border);border-radius:10px;
  padding:14px 16px;cursor:pointer;transition:.15s;
}
.eu-q-opt-card:hover{border-color:var(--eu-primary);background:#f5f7ff;}
.eu-q-opt-card.is-selected{border-color:var(--eu-primary);background:var(--eu-primary-50);}
.eu-q-opt-card input[type=radio]{position:absolute;opacity:0;pointer-events:none;}
.eu-q-opt-idx{
  width:30px;height:30px;border-radius:50%;background:var(--eu-bg-soft);
  color:var(--eu-fg-soft);font-weight:700;font-size:13px;
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
}
.eu-q-opt-card.is-selected .eu-q-opt-idx{background:var(--eu-primary);color:#fff;}
.eu-q-opt-text{flex:1;font-size:14.5px;line-height:1.55;color:var(--eu-fg);}

.eu-live-actions{
  background:#fff;border-top:1px solid var(--eu-border);
  padding:12px 18px;display:flex;justify-content:space-between;align-items:center;
  gap:10px;flex-shrink:0;flex-wrap:wrap;
}
.eu-live-actions-left{display:flex;gap:8px;flex-wrap:wrap;}
.eu-live-actions-right{display:flex;gap:8px;}
.eu-live-actions .examups-btn{padding:9px 16px;font-size:13.5px;}
.eu-btn-prev:disabled{opacity:.4;cursor:not-allowed;}

/* Right palette sidebar */
.eu-live-side{
  background:#fff;border-left:1px solid var(--eu-border);
  display:flex;flex-direction:column;overflow:hidden;
}
.eu-side-user{
  display:flex;align-items:center;gap:10px;padding:12px 16px;
  border-bottom:1px solid var(--eu-border);
}
.eu-avatar{
  width:34px;height:34px;border-radius:50%;background:var(--eu-primary);
  color:#fff;font-weight:700;display:flex;align-items:center;justify-content:center;font-size:14px;
}
.eu-side-name{font-size:14px;font-weight:600;color:var(--eu-fg);}

.eu-status-grid{
  display:grid;grid-template-columns:1fr 1fr;gap:8px;
  padding:14px 16px;border-bottom:1px solid var(--eu-border-soft);
}
.eu-status-tile{
  display:flex;flex-direction:column;align-items:flex-start;gap:2px;
  padding:8px 10px;border-radius:8px;background:var(--eu-bg-soft);
  border:1px solid var(--eu-border-soft);
}
.eu-st-num{font-size:18px;font-weight:800;line-height:1;}
.eu-st-lbl{font-size:11px;color:var(--eu-muted);font-weight:600;text-transform:uppercase;}
.eu-st-answered .eu-st-num{color:var(--eu-success);}
.eu-st-not-answered .eu-st-num{color:var(--eu-danger);}
.eu-st-marked .eu-st-num{color:#8b5cf6;}
.eu-st-not-visited .eu-st-num{color:var(--eu-muted);}

.eu-palette-section-head{
  padding:10px 16px;font-size:11px;font-weight:800;
  color:var(--eu-fg-soft);text-transform:uppercase;letter-spacing:.06em;
  border-bottom:1px solid var(--eu-border-soft);background:var(--eu-bg-soft);
}
.eu-palette-section-head:empty{display:none;}
.eu-palette-grid{
  display:grid;grid-template-columns:repeat(5,1fr);gap:8px;
  padding:14px 16px;flex:1;overflow-y:auto;
  align-content:flex-start;
}

.eu-pal-item{
  width:36px;height:36px;border-radius:6px;
  display:inline-flex;align-items:center;justify-content:center;
  font-size:13px;font-weight:700;cursor:pointer;
  border:1px solid var(--eu-border);background:#fff;color:var(--eu-fg-soft);
  position:relative;transition:transform .12s, box-shadow .12s;
}
.eu-pal-item:hover{transform:translateY(-1px);box-shadow:0 4px 10px rgba(15,23,42,.1);}
.eu-pal-item.is-current{outline:2px solid var(--eu-primary);outline-offset:2px;}
.eu-pal-not-visited{background:#fff;color:var(--eu-fg-soft);}
.eu-pal-not-answered{
  background:#ef4444;color:#fff;border-color:#ef4444;
  border-radius:6px 6px 18px 18px;
}
.eu-pal-answered{
  background:#22c55e;color:#fff;border-color:#22c55e;
  border-radius:6px 6px 18px 18px;
}
.eu-pal-marked{
  background:#8b5cf6;color:#fff;border-color:#8b5cf6;border-radius:50%;
}
.eu-pal-ans-marked{
  background:#8b5cf6;color:#fff;border-color:#8b5cf6;border-radius:50%;
  position:relative;
}
.eu-pal-ans-marked::after{
  content:"";position:absolute;right:-2px;bottom:-2px;
  width:12px;height:12px;border-radius:50%;background:#22c55e;
  border:2px solid #fff;
}

.eu-palette-legend{
  padding:14px 16px;display:grid;grid-template-columns:1fr 1fr;gap:8px;
  border-top:1px solid var(--eu-border-soft);font-size:11.5px;color:var(--eu-fg-soft);
}
.eu-palette-legend > div{display:flex;align-items:center;gap:8px;}
.eu-palette-legend .eu-pal-item{width:22px;height:22px;font-size:10.5px;}
.eu-legend-wide{grid-column:1 / -1;}

.eu-palette-submit{padding:14px 16px;border-top:1px solid var(--eu-border);}
.eu-palette-submit .examups-btn{width:100%;padding:11px 16px;font-size:14px;}

.eu-side-backdrop{
  display:none;position:fixed;inset:0;background:rgba(15,23,42,.5);z-index:99991;
}

/* ---------- Mobile responsiveness ---------- */
@media(max-width:900px){
  .eu-live-body{grid-template-columns:1fr;}
  .eu-live-side{
    position:fixed;top:0;right:-340px;bottom:0;width:300px;
    z-index:99992;box-shadow:-12px 0 30px rgba(15,23,42,.18);
    transition:right .25s ease;
  }
  .eu-live-side.is-open{right:0;}
  .eu-side-backdrop:not([hidden]){display:block;}
  .eu-mobile-menu{display:inline-flex;}
  .eu-live-title{max-width:160px;}
  .eu-q-scroll{padding:16px;}
  .eu-q-card{padding:18px;}
  .eu-live-actions{padding:10px 12px;}
  .eu-live-actions .examups-btn{padding:8px 12px;font-size:12.5px;}
  .eu-intro-layout{padding:20px 16px;}
}

/* ---------- Step 4 · Modal (review/instructions) ---------- */
.eu-modal-overlay{
  position:fixed;inset:0;background:rgba(15,23,42,.55);
  z-index:99999;display:flex;align-items:center;justify-content:center;
  padding:20px;backdrop-filter:blur(2px);
}
.eu-modal-overlay[hidden]{display:none !important;}
.eu-modal-box{
  background:#fff;width:100%;max-width:440px;border-radius:16px;
  padding:28px;position:relative;box-shadow:0 25px 60px rgba(15,23,42,.35);
  animation:eu-pop .2s ease-out;
}
.eu-modal-wide{max-width:680px;}
.eu-modal-close{position:absolute;top:10px;right:10px;font-size:22px;}
.eu-modal-title{margin:0 0 8px;font-size:20px;font-weight:800;color:var(--eu-fg);}
.eu-modal-sub{margin:0 0 20px;color:var(--eu-fg-soft);font-size:13.5px;line-height:1.5;}
.eu-modal-scroll{max-height:60vh;overflow-y:auto;padding-right:4px;}
.eu-modal-scroll h4{margin:14px 0 8px;font-size:14px;color:var(--eu-fg);}
.eu-modal-scroll ul{margin:0 0 12px;padding-left:18px;color:var(--eu-fg-soft);font-size:14px;line-height:1.6;}
@keyframes eu-pop{from{transform:scale(.96);opacity:0;}to{transform:scale(1);opacity:1;}}

.eu-review-grid{
  display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:22px;
}
.eu-review-tile{
  background:var(--eu-bg-soft);border:1px solid var(--eu-border-soft);
  border-radius:10px;padding:14px;text-align:center;
}
.eu-review-tile strong{display:block;font-size:24px;font-weight:800;line-height:1;}
.eu-review-tile span{display:block;font-size:11px;font-weight:700;
  text-transform:uppercase;color:var(--eu-muted);margin-top:6px;}
.eu-rt-answered strong{color:var(--eu-success);}
.eu-rt-not-answered strong{color:var(--eu-danger);}
.eu-rt-marked strong{color:#8b5cf6;}
.eu-rt-not-visited strong{color:var(--eu-fg-soft);}
.eu-review-actions{display:flex;gap:10px;}
.eu-review-actions .examups-btn{flex:1;}

/* =====================================================================
   RESULT PAGE
===================================================================== */
.examups-result-shell{
  font-family:var(--eu-font);color:var(--eu-fg);
  max-width:1200px;margin:0 auto;padding:8px 0 60px;
}

/* Hero / Score banner */
.eu-result-hero{
  background:var(--eu-grad);color:#fff;
  border-radius:20px;padding:32px 28px;margin-bottom:22px;
  display:grid;grid-template-columns:1fr auto;gap:24px;align-items:center;
  box-shadow:var(--eu-shadow-lg);position:relative;overflow:hidden;
}
.eu-result-hero::before{
  content:"";position:absolute;inset:0;
  background:radial-gradient(700px 360px at -10% -20%, rgba(255,255,255,.18), transparent 60%);
  pointer-events:none;
}
.eu-result-hero-left{position:relative;}
.eu-result-eyebrow{
  text-transform:uppercase;letter-spacing:.12em;font-size:11px;
  font-weight:800;opacity:.85;margin-bottom:6px;
}
.eu-result-title{
  margin:0 0 8px;font-size:clamp(22px,3.2vw,32px);font-weight:800;
  letter-spacing:-.01em;color:#fff;line-height:1.15;
}
.eu-result-meta{margin:0;font-size:14.5px;opacity:.9;}

.eu-score-ring{
  --pct:0;
  width:130px;height:130px;border-radius:50%;
  background:conic-gradient(#fff calc(var(--pct)*1%), rgba(255,255,255,.25) 0);
  display:flex;align-items:center;justify-content:center;
  position:relative;flex-shrink:0;
}
.eu-score-ring-inner{
  width:104px;height:104px;border-radius:50%;background:rgba(15,23,42,.45);
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  text-align:center;backdrop-filter:blur(4px);
}
.eu-score-ring-inner strong{font-size:24px;font-weight:800;line-height:1;}
.eu-score-ring-inner span{font-size:10.5px;opacity:.85;margin-top:3px;}
.eu-score-pct{
  position:absolute;bottom:-8px;left:50%;transform:translateX(-50%);
  background:#fff;color:var(--eu-primary-700);font-weight:800;font-size:13px;
  padding:3px 12px;border-radius:999px;box-shadow:0 4px 12px rgba(15,23,42,.18);
}

/* KPI stat grid */
.eu-stat-grid{
  display:grid;grid-template-columns:repeat(auto-fit, minmax(160px, 1fr));
  gap:14px;margin-bottom:24px;
}
.eu-stat-card{
  background:var(--eu-bg-elev);border:1px solid var(--eu-border);
  border-radius:14px;padding:16px;display:flex;align-items:center;gap:14px;
  box-shadow:var(--eu-shadow);
}
.eu-stat-icon{
  width:42px;height:42px;border-radius:12px;background:var(--eu-bg-soft);
  display:flex;align-items:center;justify-content:center;
  font-size:18px;font-weight:800;color:var(--eu-fg-soft);flex-shrink:0;
}
.eu-stat-card strong{display:block;font-size:22px;font-weight:800;color:var(--eu-fg);line-height:1;}
.eu-stat-card span{font-size:12px;color:var(--eu-muted);font-weight:600;text-transform:uppercase;letter-spacing:.04em;margin-top:4px;display:inline-block;}
.eu-stat-correct .eu-stat-icon{background:var(--eu-success-50);color:#16a34a;}
.eu-stat-correct strong{color:#16a34a;}
.eu-stat-wrong .eu-stat-icon{background:var(--eu-danger-50);color:#b91c1c;}
.eu-stat-wrong strong{color:#b91c1c;}
.eu-stat-skipped .eu-stat-icon{background:var(--eu-bg-soft);color:var(--eu-fg-soft);}
.eu-stat-accuracy .eu-stat-icon{background:var(--eu-primary-50);color:var(--eu-primary-700);}
.eu-stat-accuracy strong{color:var(--eu-primary-700);}
.eu-stat-time .eu-stat-icon{background:var(--eu-warning-50);color:#a16207;}

/* Breakdown cards */
.eu-breakdown-grid{
  display:grid;grid-template-columns:1fr;gap:18px;margin-bottom:24px;
}
@media(min-width:900px){.eu-breakdown-grid{grid-template-columns:1fr 1fr;}}
.eu-breakdown-card{
  background:var(--eu-bg-elev);border:1px solid var(--eu-border);
  border-radius:16px;padding:20px;box-shadow:var(--eu-shadow);
}
.eu-breakdown-card h3{margin:0 0 14px;font-size:15px;color:var(--eu-fg);}
.eu-bd-list{display:flex;flex-direction:column;gap:14px;}
.eu-bd-row{display:flex;flex-direction:column;gap:6px;}
.eu-bd-row-head{display:flex;justify-content:space-between;align-items:baseline;}
.eu-bd-row-head strong{font-size:14px;font-weight:700;color:var(--eu-fg);}
.eu-bd-acc{font-size:12px;color:var(--eu-muted);font-weight:600;}
.eu-bd-bar{
  display:flex;height:10px;border-radius:6px;overflow:hidden;background:var(--eu-bg-soft);
}
.eu-seg{display:block;height:100%;}
.eu-seg-correct{background:var(--eu-success);}
.eu-seg-wrong{background:var(--eu-danger);}
.eu-seg-skipped{background:#cbd5e1;}
.eu-bd-row-foot{display:flex;flex-wrap:wrap;gap:14px;font-size:12px;color:var(--eu-fg-soft);}
.eu-bd-row-foot .dot{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:4px;vertical-align:middle;}
.dot-correct{background:var(--eu-success);}
.dot-wrong{background:var(--eu-danger);}
.dot-skipped{background:#94a3b8;}

/* Per-question review */
.eu-review-section{
  background:var(--eu-bg-elev);border:1px solid var(--eu-border);
  border-radius:16px;padding:20px;box-shadow:var(--eu-shadow);
}
.eu-review-section-head{
  display:flex;justify-content:space-between;align-items:center;
  flex-wrap:wrap;gap:14px;margin-bottom:14px;
}
.eu-review-section-head h3{margin:0;font-size:15px;color:var(--eu-fg);}
.eu-review-filters{display:flex;flex-wrap:wrap;gap:6px;}
.eu-review-filter{
  background:var(--eu-bg-soft);border:1px solid var(--eu-border-soft);
  color:var(--eu-fg-soft);font-size:12.5px;font-weight:700;
  padding:6px 12px;border-radius:999px;cursor:pointer;
}
.eu-review-filter:hover{border-color:var(--eu-border);background:#fff;}
.eu-review-filter.is-active{background:var(--eu-primary);color:#fff;border-color:var(--eu-primary);}
.eu-rf-count{
  background:rgba(255,255,255,.2);padding:0 6px;border-radius:999px;
  font-size:11px;margin-left:4px;
}
.eu-review-filter:not(.is-active) .eu-rf-count{background:#fff;color:var(--eu-fg-soft);}

.eu-review-list{display:flex;flex-direction:column;gap:10px;}
.eu-review-item{
  border:1px solid var(--eu-border);border-radius:12px;overflow:hidden;
  background:#fff;
}
.eu-review-item summary{
  display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center;
  padding:14px 16px;cursor:pointer;list-style:none;
}
.eu-review-item summary::-webkit-details-marker{display:none;}
.eu-rev-no{
  width:34px;height:34px;border-radius:8px;background:var(--eu-bg-soft);
  display:flex;align-items:center;justify-content:center;
  font-weight:800;font-size:13px;color:var(--eu-fg-soft);
}
.eu-rev-question{
  font-size:14px;color:var(--eu-fg);font-weight:600;line-height:1.45;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
.eu-rev-tags{display:flex;flex-wrap:wrap;gap:6px;align-items:center;justify-content:flex-end;}
.eu-rev-outcome{
  font-size:11px;font-weight:800;padding:3px 10px;border-radius:999px;text-transform:uppercase;letter-spacing:.04em;
}
.eu-rev-outcome-correct{background:var(--eu-success-50);color:#166534;}
.eu-rev-outcome-wrong{background:var(--eu-danger-50);color:#b91c1c;}
.eu-rev-outcome-skipped{background:var(--eu-bg-soft);color:var(--eu-muted);}
.eu-rev-chip{
  background:var(--eu-bg-soft);color:var(--eu-fg-soft);font-size:11px;font-weight:600;
  padding:3px 10px;border-radius:999px;
}
.eu-review-item[open] summary{background:var(--eu-bg-soft);}

.eu-rev-body{padding:6px 16px 16px;border-top:1px solid var(--eu-border-soft);}
.eu-rev-options{list-style:none;padding:0;margin:14px 0 0;display:flex;flex-direction:column;gap:8px;}
.eu-rev-options li{
  display:flex;align-items:center;gap:12px;
  padding:10px 12px;border:1px solid var(--eu-border);border-radius:10px;
  background:var(--eu-bg);font-size:14px;color:var(--eu-fg);
}
.eu-rev-options li.is-correct{background:var(--eu-success-50);border-color:#86efac;color:#166534;}
.eu-rev-options li.is-wrong{background:var(--eu-danger-50);border-color:#fca5a5;color:#b91c1c;}
.eu-rev-opt-letter{
  width:26px;height:26px;border-radius:50%;background:#fff;
  display:flex;align-items:center;justify-content:center;
  font-weight:800;font-size:12px;color:var(--eu-fg-soft);flex-shrink:0;
  border:1px solid var(--eu-border);
}
.eu-rev-opt-text{flex:1;line-height:1.5;}
.eu-rev-opt-tag{
  font-size:10.5px;font-weight:800;padding:2px 8px;border-radius:999px;
  background:#fff;color:var(--eu-fg-soft);border:1px solid var(--eu-border);text-transform:uppercase;
}
.eu-rev-explain{
  margin-top:14px;padding:14px;border-radius:10px;
  background:linear-gradient(180deg,#fef3c7 0%, #fef9c3 100%);
  border:1px solid #fde68a;font-size:13.5px;line-height:1.55;color:#713f12;
}
.eu-rev-explain strong{display:block;font-size:12px;font-weight:800;
  text-transform:uppercase;letter-spacing:.06em;margin-bottom:6px;color:#a16207;}

.eu-result-actions{margin-top:24px;display:flex;gap:12px;flex-wrap:wrap;justify-content:center;}

@media(max-width:640px){
  .eu-result-hero{grid-template-columns:1fr;text-align:left;padding:24px 20px;}
  .eu-score-ring{margin:0;}
  .eu-review-item summary{grid-template-columns:auto 1fr;gap:10px;}
  .eu-rev-tags{grid-column:1 / -1;justify-content:flex-start;margin-top:6px;}
}

/* Print: clean lesson printout */
@media print{
  .examups-notes-header,
  .examups-notes-footer,
  .examups-notes-actions{display:none !important;}
  .examups-notes-shell{margin:0;max-width:100%;padding:0;}
  .examups-notes-article{
    border:0;
    box-shadow:none;
    padding:0;
    background:#fff;
    color:#000;
  }
  .examups-notes-card{break-inside:avoid;background:#fff !important;}
  .examups-notes-section{break-inside:avoid;}
  .examups-notes-title,
  .examups-notes-section h2,
  .examups-notes-card h2,
  .examups-notes-body{color:#000 !important;}
}

/* =============================================================
 * Safety: pin text colors of the Mock Test player + Result
 * surfaces so any host-theme typography rules can't render the
 * content invisible (e.g. light text on white card backgrounds).
 * Uses concrete hex values, not CSS variables, so prefers-color
 * theming or theme inheritance can't flip them.
 * ============================================================= */
.examups-test-shell,
.examups-test-shell p,
.examups-test-shell li,
.examups-test-shell h1,
.examups-test-shell h2,
.examups-test-shell h3,
.examups-test-shell h4,
.examups-test-shell label,
.examups-test-shell strong,
.examups-test-shell span,
.examups-result-shell,
.examups-result-shell p,
.examups-result-shell li,
.examups-result-shell h1,
.examups-result-shell h2,
.examups-result-shell h3,
.examups-result-shell h4,
.examups-result-shell strong,
.examups-result-shell span{color:#0f172a;}

.eu-q-num{color:#475569 !important;}
.eu-q-section{color:#1d4ed8 !important;}
.eu-q-text{color:#0f172a !important;}
.eu-q-opt-text{color:#0f172a !important;}
.eu-q-opt-idx{color:#0f172a;}

.eu-screen-intro,
.eu-screen-intro h1,
.eu-screen-intro h3,
.eu-screen-intro h4,
.eu-screen-intro p,
.eu-screen-intro li,
.eu-screen-intro span,
.eu-screen-intro label,
.eu-screen-intro strong{color:#e2e8f0;}
.eu-intro-title,
.eu-summary-card h3,
.eu-instr-section h3,
.eu-summary-row strong{color:#ffffff !important;}
.eu-summary-row span{color:#cbd5e1 !important;}
.eu-instr-section li{color:#cbd5e1 !important;}
.eu-agree-box span{color:#0f172a !important;}
.eu-intro-error{color:#fecaca !important;}

.eu-live-side,
.eu-live-side h3,
.eu-live-side span,
.eu-live-side strong,
.eu-live-side div{color:#0f172a;}
.eu-side-name,
.eu-palette-section-head{color:#0f172a !important;}
.eu-st-lbl{color:#475569 !important;}
.eu-palette-legend div{color:#475569 !important;}

.eu-modal-box,
.eu-modal-box h3,
.eu-modal-box h4,
.eu-modal-box p,
.eu-modal-box li,
.eu-modal-box span,
.eu-modal-box strong{color:#0f172a !important;}
.eu-modal-sub{color:#475569 !important;}
.eu-modal-scroll ul li{color:#334155 !important;}
.eu-review-tile span{color:#475569 !important;}

.eu-rev-no{color:#ffffff !important;}
.eu-rev-question{color:#0f172a !important;}
.eu-rev-chip{color:#0f172a !important;}
.eu-rev-explain,
.eu-rev-explain div,
.eu-rev-options li{color:#0f172a !important;}

.eu-result-hero,
.eu-result-hero *{color:#ffffff !important;}
.eu-result-eyebrow{color:#cbd5e1 !important;}
.eu-result-meta{color:#e2e8f0 !important;}
.eu-score-ring-inner span{color:#e2e8f0 !important;}

.eu-stat-card,
.eu-stat-card *,
.eu-breakdown-card,
.eu-breakdown-card *,
.eu-review-section,
.eu-review-section h3{color:#0f172a;}
.eu-stat-card span:last-child{color:#475569;}
.eu-bd-row-foot,
.eu-bd-row-foot span{color:#475569;}
.eu-review-filter{color:#334155;}
.eu-review-filter.is-active{color:#1d4ed8;}

/* Fullscreen toggle icon button states */
.eu-tool-fullscreen{font-size:18px;}
.eu-tool-fullscreen .eu-fs-enter,
.eu-tool-fullscreen .eu-fs-exit{display:inline-block;line-height:1;}
.eu-tool-fullscreen .eu-fs-enter[hidden],
.eu-tool-fullscreen .eu-fs-exit[hidden]{display:none;}

/* ============================================================
 * Frontend Course Curriculum view
 * ============================================================ */
.examups-curriculum-frontend {
	--cf-primary:#0d9488;
	--cf-secondary:#6366f1;
	--cf-bg:#f8fafc;
	--cf-card:#ffffff;
	--cf-border:#e2e8f0;
	--cf-text:#0f172a;
	--cf-muted:#64748b;
	font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
	color:var(--cf-text);
	max-width:980px; margin:0 auto;
}
.examups-cf-head { display:flex; flex-direction:column; gap:10px; padding:18px 20px; background:linear-gradient(120deg,#ecfdf5,#f0fdfa);
	border:1px solid #a7f3d0; border-radius:12px; margin-bottom:18px; }
.examups-cf-head h2 { margin:0; font-size:1.4rem; color:#065f46; }
.examups-cf-progress { display:flex; align-items:center; gap:12px; }
.examups-cf-progress-bar { flex:1; height:10px; background:rgba(13,148,136,.15); border-radius:99px; overflow:hidden; position:relative; }
.examups-cf-progress-bar span { display:block; height:100%; background:linear-gradient(90deg,#0d9488,#14b8a6); border-radius:99px;
	transition:width .4s ease; }
.examups-cf-progress-label { font-weight:700; color:#065f46; font-size:.85rem; white-space:nowrap; }
.examups-cf-locked-note { margin:0; color:#92400e; font-size:.9rem; }

.examups-cf-sections { list-style:none; margin:0; padding:0; }
.examups-cf-section { background:var(--cf-card); border:1px solid var(--cf-border); border-left:4px solid var(--cf-primary);
	border-radius:12px; margin-bottom:14px; overflow:hidden; box-shadow:0 1px 3px rgba(15,23,42,.04); }
.examups-cf-section details > summary { list-style:none; cursor:pointer; padding:14px 18px; display:flex; align-items:center; gap:10px; user-select:none; }
.examups-cf-section details > summary::-webkit-details-marker { display:none; }
.examups-cf-section details > summary::after { content:"▾"; margin-left:auto; color:var(--cf-muted); transition:transform .2s; }
.examups-cf-section details[open] > summary::after { transform:rotate(180deg); }
.examups-cf-section-num { background:var(--cf-primary); color:#fff; width:28px; height:28px; border-radius:8px;
	display:inline-flex; align-items:center; justify-content:center; font-weight:700; }
.examups-cf-section-name { font-weight:700; font-size:1.05rem; color:var(--cf-text); }
.examups-cf-pill { background:var(--cf-bg); color:var(--cf-muted); padding:2px 10px; border-radius:99px; font-size:.7rem; font-weight:700; text-transform:uppercase; letter-spacing:.04em; }

.examups-cf-subs { list-style:none; margin:0; padding:4px 18px 18px; }
.examups-cf-sub { background:var(--cf-bg); border:1px dashed #cbd5e1; border-radius:10px; padding:12px 14px; margin-top:10px; }
.examups-cf-sub-title { display:flex; align-items:center; gap:8px; margin:0 0 8px; font-size:1rem; color:var(--cf-text); }
.examups-cf-sub-num { background:var(--cf-secondary); color:#fff; padding:2px 10px; border-radius:6px; font-size:.75rem; font-weight:700; }

.examups-cf-items { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:6px; }
.examups-cf-item { display:flex; align-items:center; gap:10px; padding:10px 12px; background:#fff;
	border:1px solid var(--cf-border); border-left:3px solid var(--cf-kind,#64748b); border-radius:8px; font-size:.9rem; }
.examups-cf-item-icon { font-size:1.1rem; }
.examups-cf-item-label { flex:1; color:var(--cf-text); }
.examups-cf-item-kind { background:var(--cf-bg); color:var(--cf-muted); padding:2px 8px; border-radius:99px; font-size:.7rem; font-weight:700; text-transform:uppercase; letter-spacing:.04em; }
.examups-cf-item-action { background:var(--cf-kind,#0d9488); color:#fff !important; text-decoration:none; padding:5px 14px; border-radius:6px;
	font-size:.8rem; font-weight:700; transition:transform .12s, opacity .12s; }
.examups-cf-item-action:hover { transform:translateY(-1px); opacity:.9; }
.examups-cf-pending { background:#fef3c7 !important; color:#92400e !important; cursor:default; }
.examups-cf-locked { background:#f3f4f6 !important; color:#64748b !important; cursor:not-allowed; padding:5px 10px; }
.examups-cf-status-pending .examups-cf-item-label { color:var(--cf-muted); }
.examups-cf-status-locked .examups-cf-item-label { color:var(--cf-muted); }

@media (max-width:640px) {
	.examups-cf-head h2 { font-size:1.1rem; }
	.examups-cf-section-name { font-size:.95rem; }
	.examups-cf-item { flex-wrap:wrap; }
	.examups-cf-item-kind { order:3; }
}

/* ============================================================
 * Test-Player Extras (language, theme, font, anti-cheat, etc.)
 * ============================================================ */
:root { --eu-fz:100%; }
.examups-test-shell { font-size:var(--eu-fz); }

/* Dark mode overrides */
[data-eu-theme="dark"] body { background:#0f172a; color:#e2e8f0; }
[data-eu-theme="dark"] .examups-test-shell,
[data-eu-theme="dark"] .eu-screen-live,
[data-eu-theme="dark"] .eu-screen-intro { background:#0f172a !important; color:#e2e8f0; }
[data-eu-theme="dark"] .eu-q-card,
[data-eu-theme="dark"] .eu-live-side,
[data-eu-theme="dark"] .eu-summary-card { background:#1e293b !important; color:#e2e8f0; border-color:#334155 !important; }
[data-eu-theme="dark"] .eu-q-opt-card { background:#0f172a; color:#e2e8f0; border-color:#334155; }
[data-eu-theme="dark"] .eu-q-opt-card.is-selected { background:#1e40af; }
[data-eu-theme="dark"] .eu-modal-box { background:#1e293b; color:#e2e8f0; }

/* Toolbar buttons in topbar right */
.eu-extras-bar { display:inline-flex; gap:6px; margin-right:10px; align-items:center; }
.eu-extras-bar .eu-icon-btn { font-weight:700; min-width:34px; }
.eu-tool-lang { background:#0d9488 !important; color:#fff !important; }
.eu-tool-theme { background:#6366f1 !important; color:#fff !important; }
.eu-tool-font-up, .eu-tool-font-down { background:#f59e0b !important; color:#fff !important; }

.eu-tabswitch-warn { background:#fee2e2; color:#dc2626; padding:3px 10px; border-radius:99px; font-size:.75rem; font-weight:700; }
.eu-flash-warn {
	position:fixed; top:20px; left:50%; transform:translateX(-50%);
	background:#dc2626; color:#fff; padding:10px 20px; border-radius:8px; font-weight:700;
	box-shadow:0 4px 12px rgba(220,38,38,.3); z-index:99999;
}

/* Section progress bar */
.eu-progress-wrap { display:flex; align-items:center; gap:10px; padding:8px 16px; background:#f1f5f9; border-bottom:1px solid #e2e8f0; }
.eu-progress-bar { flex:1; height:8px; background:rgba(0,0,0,.08); border-radius:99px; overflow:hidden; }
.eu-progress-fill { display:block; height:100%; background:linear-gradient(90deg,#0d9488,#14b8a6); transition:width .3s; }
.eu-progress-label { font-size:.8rem; font-weight:700; color:#0d9488; min-width:90px; text-align:right; }
[data-eu-theme="dark"] .eu-progress-wrap { background:#1e293b; border-bottom-color:#334155; }
[data-eu-theme="dark"] .eu-progress-label { color:#2dd4bf; }

/* Numerical answer input */
.eu-q-numerical { background:#fef3c7; padding:14px 16px; border-radius:8px; border:1px dashed #fbbf24; }
.eu-q-numerical label { display:block; font-weight:700; margin-bottom:6px; color:#92400e; }
.eu-q-num-input { width:280px; max-width:100%; font-size:1.1rem; padding:8px 12px; border:2px solid #fbbf24; border-radius:6px; }
.eu-q-numerical small { display:block; margin-top:6px; color:#92400e; font-size:.75rem; }

/* Match the following table */
.eu-q-match { width:100%; border-collapse:collapse; }
.eu-q-match th, .eu-q-match td { padding:8px 10px; border:1px solid #e2e8f0; text-align:left; }
.eu-q-match th { background:#f1f5f9; font-size:.85rem; }
.eu-q-match-sel { width:100%; padding:5px 8px; border:1px solid #cbd5e1; border-radius:5px; }

/* MSQ checkbox styling */
.eu-q-opt-msq.is-selected { background:#dbeafe; border-color:#2563eb; }
[data-eu-theme="dark"] .eu-q-opt-msq.is-selected { background:#1e40af; }

/* Image questions */
.eu-q-img { max-width:100%; max-height:320px; border-radius:8px; margin-bottom:12px; box-shadow:0 2px 8px rgba(0,0,0,.1); }

/* Webcam proctoring preview */
.eu-proctor {
	position:fixed; bottom:16px; right:16px; width:160px; height:120px;
	border:2px solid #0d9488; border-radius:8px; z-index:9999;
	box-shadow:0 4px 12px rgba(13,148,136,.3);
}

/* Sectional timer */
.eu-section-tab .eu-sec-time { display:block; font-size:.7rem; color:#64748b; font-weight:600; }

/* ============================================================
 * Course Library (curriculum-style cards)
 * ============================================================ */
.examups-library {
	max-width:1200px; margin:0 auto; padding:20px;
	font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
	color:#0f172a;
}
.examups-library-head { margin-bottom:24px; }
.examups-library-head h2 { margin:0 0 6px; font-size:1.6rem; color:#0d9488; }
.examups-library-head .examups-muted { color:#64748b; margin:0; }

.examups-lib-grid {
	display:grid; grid-template-columns:repeat(auto-fill,minmax(320px,1fr)); gap:20px;
}

.examups-lib-card {
	background:#fff; border:1px solid #e2e8f0; border-radius:14px; overflow:hidden;
	box-shadow:0 2px 8px rgba(15,23,42,.04); transition:transform .15s, box-shadow .15s;
	display:flex; flex-direction:column;
}
.examups-lib-card:hover { transform:translateY(-3px); box-shadow:0 6px 18px rgba(15,23,42,.12); }

.examups-lib-thumb {
	position:relative; height:160px; background:#f1f5f9 center/cover no-repeat;
}
.examups-lib-thumb-empty {
	background:linear-gradient(135deg,#0d9488 0%, #14b8a6 100%);
	display:flex; align-items:center; justify-content:center;
}
.examups-lib-thumb-icon { font-size:3rem; opacity:.45; }
.examups-lib-badge {
	position:absolute; top:12px; left:12px;
	background:rgba(0,0,0,.6); color:#fff; padding:4px 10px;
	border-radius:99px; font-size:.7rem; font-weight:700; text-transform:uppercase; letter-spacing:.04em;
}

.examups-lib-body {
	padding:16px 18px 18px; display:flex; flex-direction:column; gap:10px; flex:1;
}
.examups-lib-title { margin:0; font-size:1.05rem; line-height:1.3; color:#0f172a; }
.examups-lib-tag { margin:0; font-size:.85rem; color:#64748b; }

/* Stats row */
.examups-lib-stats { display:flex; gap:14px; flex-wrap:wrap; }
.examups-lib-stat { font-size:.78rem; color:#64748b; }
.examups-lib-stat strong { color:#0f172a; font-size:1rem; margin-right:3px; }

/* Kind chips */
.examups-lib-kinds {
	list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; gap:6px;
}
.examups-lib-kinds li {
	display:inline-flex; align-items:center; gap:5px;
	background:rgba(0,0,0,.04); border-left:3px solid var(--lk,#64748b); border-radius:6px;
	padding:3px 10px; font-size:.75rem; color:#0f172a;
}
.examups-lib-kind-count { font-weight:700; color:var(--lk,#64748b); }
.examups-lib-kind-name  { color:#64748b; }

/* Outline preview */
.examups-lib-outline summary {
	cursor:pointer; color:#0d9488; font-size:.82rem; font-weight:700; padding:6px 0;
	list-style:none;
}
.examups-lib-outline summary::-webkit-details-marker { display:none; }
.examups-lib-outline summary::before { content:"▸ "; transition:transform .2s; display:inline-block; }
.examups-lib-outline[open] summary::before { transform:rotate(90deg); }
.examups-lib-sec-list {
	list-style:none; margin:6px 0 0; padding:0; border-top:1px dashed #e2e8f0; padding-top:10px;
}
.examups-lib-sec-list li {
	font-size:.82rem; color:#475569; padding:4px 0; display:flex; gap:8px; align-items:baseline; flex-wrap:wrap;
}
.examups-lib-sec-list strong { color:#0f172a; }
.examups-lib-sec-modules { color:#94a3b8; font-size:.75rem; }
.examups-lib-more { color:#0d9488; font-style:italic; }

/* Foot row */
.examups-lib-foot {
	display:flex; align-items:center; justify-content:space-between; gap:10px;
	margin-top:auto; padding-top:12px; border-top:1px solid #e2e8f0;
}
.examups-lib-price { font-size:1.1rem; font-weight:700; color:#0d9488; }
.examups-lib-free { color:#10b981; }
.examups-lib-actions { display:flex; gap:6px; }
.examups-lib-actions .examups-btn { font-size:.85rem; padding:6px 14px; }

.examups-lib-empty { color:#94a3b8; font-style:italic; }
.examups-lib-empty-state { text-align:center; padding:60px 20px; color:#94a3b8; font-size:1rem; }

@media (max-width:540px) {
	.examups-lib-grid { grid-template-columns:1fr; }
}

/* =====================================================================
   PROFESSIONAL LEARNER DASHBOARD (.examups-pdash, .epd-*)
   - Sidebar layout, hero, KPI stats, course cards, tests table,
     achievements, profile. All colors hex-locked so themes can't override.
   ===================================================================== */
.examups-pdash{
  --epd-bg:#f6f7fb; --epd-card:#ffffff; --epd-border:#e5e7eb; --epd-border-soft:#eef0f4;
  --epd-text:#0f172a; --epd-text-soft:#475569; --epd-muted:#64748b;
  --epd-accent:#6366f1; --epd-accent-2:#8b5cf6; --epd-accent-3:#ec4899;
  --epd-success:#10b981; --epd-warning:#f59e0b; --epd-danger:#ef4444;
  --epd-radius:14px; --epd-radius-lg:18px;
  --epd-shadow:0 1px 2px rgba(15,23,42,.04),0 4px 14px rgba(15,23,42,.06);
  --epd-shadow-lg:0 10px 28px rgba(15,23,42,.08);
  display:grid;grid-template-columns:260px 1fr;
  background:var(--epd-bg) !important;color:var(--epd-text) !important;
  font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif;
  margin:0 auto;
  height:100vh;
  min-height:600px;
  overflow:hidden;
  border:none;
  border-radius:0;
}
.examups-pdash *{box-sizing:border-box;}
.examups-pdash a{color:inherit;text-decoration:none;}
.examups-pdash p{color:var(--epd-text-soft) !important;margin:0 0 8px;}
.examups-pdash .material-icons-round{vertical-align:middle;line-height:1;display:inline-flex;}
.examups-pdash h1,.examups-pdash h2,.examups-pdash h3{color:var(--epd-text) !important;margin:0;}
.examups-pdash strong{color:var(--epd-text) !important;}
.examups-pdash .epd-muted{color:var(--epd-muted) !important;font-size:13px;}

/* ---------- Sidebar ---------- */
.examups-pdash .epd-sidebar{
  background:#ffffff !important;border-right:1px solid var(--epd-border);
  position:relative;
  height:100%;
  overflow-y:auto;
  display:flex;flex-direction:column;padding:22px 16px;
  z-index:5;
}
.examups-pdash .epd-brand{
  display:flex;align-items:center;gap:10px;padding:6px 8px 18px;
  border-bottom:1px solid var(--epd-border-soft);margin-bottom:14px;
}
.examups-pdash .epd-brand-logo{
  width:36px;height:36px;border-radius:10px;
  background:linear-gradient(135deg,var(--epd-accent),var(--epd-accent-2),var(--epd-accent-3));
  display:flex;align-items:center;justify-content:center;font-size:18px;
  box-shadow:var(--epd-shadow);
}
.examups-pdash .epd-brand-name{
  font-weight:800;font-size:18px;letter-spacing:-.01em;color:var(--epd-text) !important;
}
.examups-pdash .epd-nav{display:flex;flex-direction:column;gap:4px;flex:1;}
.examups-pdash .epd-nav-item{
  display:flex;align-items:center;gap:12px;
  padding:10px 12px;border-radius:10px;
  color:var(--epd-text-soft) !important;font-weight:500;font-size:14px;
  transition:background .15s,color .15s,transform .15s;
}
.examups-pdash .epd-nav-item:hover{background:#f1f5f9 !important;color:var(--epd-text) !important;}
.examups-pdash .epd-nav-item.is-active{
  background:linear-gradient(135deg,var(--epd-accent),var(--epd-accent-2)) !important;
  color:#fff !important;box-shadow:0 6px 18px rgba(99,102,241,.35);
}
.examups-pdash .epd-nav-item.is-active .epd-nav-pill{background:rgba(255,255,255,.25);color:#fff;}
.examups-pdash .epd-nav-icon{
  width:24px;text-align:center;font-size:18px;flex-shrink:0;
}
.examups-pdash .epd-nav-label{flex:1;}
.examups-pdash .epd-nav-pill{
  font-size:11px;font-weight:700;background:#e0e7ff;color:#3730a3;
  padding:2px 8px;border-radius:999px;
}
.examups-pdash .epd-sidebar-footer{
  margin-top:auto;padding-top:14px;border-top:1px solid var(--epd-border-soft);
}
.examups-pdash .epd-logout{
  display:flex;align-items:center;gap:12px;padding:10px 12px;
  border-radius:10px;color:#dc2626 !important;font-weight:500;font-size:14px;
}
.examups-pdash .epd-logout:hover{background:#fee2e2 !important;}

/* ---------- Main + Topbar ---------- */
.examups-pdash .epd-main{
  padding:20px 28px 60px;min-width:0;
  height:100%;
  overflow-y:auto;
}
.examups-pdash .epd-topbar{
  display:flex;align-items:center;gap:14px;
  background:#fff;border:1px solid var(--epd-border);
  border-radius:var(--epd-radius);padding:10px 14px;
  margin-bottom:20px;box-shadow:var(--epd-shadow);
}
.examups-pdash .epd-burger{
  display:none;border:none;background:transparent;font-size:22px;cursor:pointer;
  color:var(--epd-text-soft);
}
.examups-pdash .epd-search{
  flex:1;display:flex;align-items:center;gap:8px;
  background:#f1f5f9;border-radius:10px;padding:8px 14px;
}
.examups-pdash .epd-search-icon{color:var(--epd-muted);font-size:14px;}
.examups-pdash .epd-search input{
  flex:1;border:none;background:transparent;outline:none;
  font-size:14px;color:var(--epd-text);font-family:inherit;
}
.examups-pdash .epd-topbar-actions{display:flex;align-items:center;gap:10px;}
.examups-pdash .epd-iconbtn{
  position:relative;width:40px;height:40px;border-radius:10px;
  border:1px solid var(--epd-border);background:#fff;cursor:pointer;
  font-size:18px;color:var(--epd-text-soft);
  display:flex;align-items:center;justify-content:center;
  transition:background .15s,transform .15s;
}
.examups-pdash .epd-iconbtn:hover{background:#f1f5f9;transform:translateY(-1px);}
.examups-pdash .epd-dot-red{
  position:absolute;top:8px;right:8px;width:8px;height:8px;
  background:var(--epd-danger);border-radius:50%;border:2px solid #fff;
}
.examups-pdash .epd-profile-chip{
  display:flex;align-items:center;gap:10px;padding:4px 10px 4px 4px;
  border:1px solid var(--epd-border);border-radius:999px;background:#fff;
  transition:background .15s;
}
.examups-pdash .epd-profile-chip:hover{background:#f8fafc;}
.examups-pdash .epd-profile-avatar{
  width:32px;height:32px;border-radius:50%;object-fit:cover;display:block;
}
.examups-pdash .epd-profile-initials{
  width:32px;height:32px;border-radius:50%;
  background:linear-gradient(135deg,var(--epd-accent),var(--epd-accent-2));
  color:#fff !important;font-weight:800;font-size:12px;
  display:flex;align-items:center;justify-content:center;
}
.examups-pdash .epd-profile-name{
  font-weight:600;font-size:13px;color:var(--epd-text) !important;
  max-width:130px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}

/* ---------- Tabs ---------- */
.examups-pdash .epd-tab{display:none;}
.examups-pdash .epd-tab.is-active{display:block;animation:epd-fade .25s ease;}
@keyframes epd-fade{from{opacity:0;transform:translateY(6px);}to{opacity:1;transform:none;}}

/* ---------- Hero ---------- */
.examups-pdash .epd-hero{
  position:relative;overflow:hidden;
  background:linear-gradient(135deg,#6366f1 0%,#8b5cf6 50%,#ec4899 100%) !important;
  color:#fff !important;
  border-radius:var(--epd-radius-lg);padding:28px;margin-bottom:24px;
  box-shadow:0 18px 38px rgba(99,102,241,.32);
  display:flex;align-items:center;justify-content:space-between;gap:24px;
}
.examups-pdash .epd-hero::before{
  content:"";position:absolute;inset:0;
  background:radial-gradient(700px 380px at 100% -20%,rgba(255,255,255,.18),transparent 60%);
  pointer-events:none;
}
.examups-pdash .epd-hero-text{position:relative;z-index:1;}
.examups-pdash .epd-hero-greet{
  margin:0;color:rgba(255,255,255,.85) !important;font-size:14px;
}
.examups-pdash .epd-hero-name{
  margin:6px 0 8px;font-size:clamp(22px,3vw,32px);font-weight:800;
  color:#fff !important;letter-spacing:-.01em;
}
.examups-pdash .epd-hero-sub{
  margin:0;color:rgba(255,255,255,.92) !important;font-size:15px;
}
.examups-pdash .epd-hero-sub strong{color:#fff !important;}
.examups-pdash .epd-hero-illus{position:relative;width:120px;height:120px;flex-shrink:0;}
.examups-pdash .epd-hero-blob{
  position:absolute;inset:0;border-radius:50%;
  background:rgba(255,255,255,.18);
  animation:epd-pulse 3s ease-in-out infinite;
}
.examups-pdash .epd-hero-emoji{
  position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  font-size:54px;
}
@keyframes epd-pulse{0%,100%{transform:scale(.95);}50%{transform:scale(1.05);}}

/* ---------- Stats grid ---------- */
.examups-pdash .epd-stats{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));
  gap:14px;margin-bottom:26px;
}
.examups-pdash .epd-stat{
  background:#fff;border:1px solid var(--epd-border);
  border-radius:var(--epd-radius);padding:18px;
  display:flex;align-items:center;gap:14px;
  box-shadow:var(--epd-shadow);
  transition:transform .15s,box-shadow .15s;
}
.examups-pdash .epd-stat:hover{transform:translateY(-2px);box-shadow:var(--epd-shadow-lg);}
.examups-pdash .epd-stat-icon{
  width:48px;height:48px;border-radius:12px;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;font-size:22px;
}
.examups-pdash .epd-stat-blue   .epd-stat-icon{background:#dbeafe;color:#2563eb;}
.examups-pdash .epd-stat-green  .epd-stat-icon{background:#dcfce7;color:#15803d;}
.examups-pdash .epd-stat-orange .epd-stat-icon{background:#fef3c7;color:#b45309;}
.examups-pdash .epd-stat-purple .epd-stat-icon{background:#ede9fe;color:#7c3aed;}
.examups-pdash .epd-stat-pink   .epd-stat-icon{background:#fce7f3;color:#be185d;}
.examups-pdash .epd-stat-red    .epd-stat-icon{background:#fee2e2;color:#dc2626;}
.examups-pdash .epd-stat-num{
  font-size:24px;font-weight:800;color:var(--epd-text) !important;line-height:1;
}
.examups-pdash .epd-stat-label{
  font-size:12px;color:var(--epd-muted) !important;
  text-transform:uppercase;letter-spacing:.04em;margin-top:4px;
}

/* ---------- Section ---------- */
.examups-pdash .epd-section{margin-bottom:28px;}
.examups-pdash .epd-section-head{
  display:flex;align-items:center;justify-content:space-between;
  margin-bottom:14px;gap:10px;flex-wrap:wrap;
}
.examups-pdash .epd-section-head h2{
  font-size:18px;font-weight:800;color:var(--epd-text) !important;
}
.examups-pdash .epd-section-link{
  font-size:13px;color:var(--epd-accent) !important;font-weight:600;
}
.examups-pdash .epd-section-link:hover{text-decoration:underline;}
.examups-pdash .epd-section-head-sticky{
  position:sticky;top:8px;background:var(--epd-bg);padding:8px 0;z-index:2;
}

/* ---------- Continue Learning grid ---------- */
.examups-pdash .epd-continue-grid{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px;
}
.examups-pdash .epd-continue-card{
  display:flex;flex-direction:column;
  background:#fff;border:1px solid var(--epd-border);border-radius:var(--epd-radius);
  overflow:hidden;box-shadow:var(--epd-shadow);
  transition:transform .15s,box-shadow .15s;cursor:pointer;
}
.examups-pdash .epd-continue-card:hover{transform:translateY(-3px);box-shadow:var(--epd-shadow-lg);}
.examups-pdash .epd-continue-card .epd-cc-thumb{
  height:130px;position:relative;
  background:linear-gradient(135deg,#6366f1,#8b5cf6,#ec4899) center/cover no-repeat;
  display:flex;align-items:center;justify-content:center;font-size:42px;color:#fff;
}
.examups-pdash .epd-continue-card .epd-cc-play{
  position:absolute;inset:auto auto 10px 10px;
  width:34px;height:34px;border-radius:50%;background:rgba(0,0,0,.55);color:#fff;
  display:flex;align-items:center;justify-content:center;font-size:14px;
}
.examups-pdash .epd-continue-card .epd-cc-body{padding:14px 16px;}
.examups-pdash .epd-continue-card .epd-cc-title{
  font-size:15px;font-weight:700;color:var(--epd-text) !important;
  margin:0 0 8px;line-height:1.3;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
.examups-pdash .epd-continue-card .epd-cc-meta{
  display:flex;justify-content:space-between;font-size:12px;
  color:var(--epd-muted) !important;margin-bottom:6px;
}
.examups-pdash .epd-continue-card .epd-cc-pct{font-weight:800;color:var(--epd-accent) !important;}
.examups-pdash .epd-continue-card .epd-cc-bar,
.examups-pdash .epd-cc-bar{
  height:6px;background:#eef0f4;border-radius:999px;overflow:hidden;
}
.examups-pdash .epd-continue-card .epd-cc-bar span,
.examups-pdash .epd-cc-bar span{
  display:block;height:100%;border-radius:999px;
  background:linear-gradient(90deg,var(--epd-accent),var(--epd-accent-2),var(--epd-accent-3));
  transition:width .5s cubic-bezier(.4,0,.2,1);
}

/* ---------- Course cards (My Courses + Explore) ---------- */
.examups-pdash .epd-course-grid{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:18px;
}
.examups-pdash .epd-course-card{
  background:#fff !important;border:1px solid var(--epd-border) !important;
  border-radius:var(--epd-radius);overflow:hidden;
  box-shadow:var(--epd-shadow);
  display:flex !important;flex-direction:column !important;
  transition:transform .15s,box-shadow .15s;
}
.examups-pdash .epd-course-card:hover{transform:translateY(-3px);box-shadow:var(--epd-shadow-lg);}
.examups-pdash .epd-course-card .epd-cc-thumb{
  height:160px;
  background:linear-gradient(135deg,var(--epd-accent),var(--epd-accent-2),var(--epd-accent-3)) center/cover no-repeat;
  position:relative;display:flex;align-items:center;justify-content:center;
}
.examups-pdash .epd-cc-thumb-icon{font-size:46px;opacity:.55;color:#fff;}
.examups-pdash .epd-cc-badge{
  position:absolute;top:12px;right:12px;
  font-size:11px;font-weight:800;padding:4px 12px;border-radius:999px;
  text-transform:uppercase;letter-spacing:.04em;
  box-shadow:0 2px 6px rgba(0,0,0,.15);
}
.examups-pdash .epd-cc-badge-active  {background:#dcfce7 !important;color:#166534 !important;}
.examups-pdash .epd-cc-badge-pending {background:#fef3c7 !important;color:#a16207 !important;}
.examups-pdash .epd-cc-badge-expired {background:#fee2e2 !important;color:#b91c1c !important;}
.examups-pdash .epd-cc-content{
  padding:16px 18px;display:flex !important;flex-direction:column !important;gap:12px;flex:1;
}
.examups-pdash .epd-course-card .epd-cc-title{
  margin:0;font-size:16px;font-weight:700;color:var(--epd-text) !important;line-height:1.35;
}
.examups-pdash .epd-cc-state{
  display:flex;align-items:center;gap:8px;font-size:13px;color:var(--epd-text-soft) !important;
}
.examups-pdash .epd-cc-state-icon{font-size:16px;}
.examups-pdash .epd-cc-stats{
  display:grid;grid-template-columns:repeat(3,1fr);gap:8px;
  background:#f8fafc;padding:10px;border-radius:10px;
}
.examups-pdash .epd-cc-stats > div{display:flex;flex-direction:column;align-items:center;gap:2px;}
.examups-pdash .epd-cc-stats strong{font-size:16px;color:var(--epd-text) !important;}
.examups-pdash .epd-cc-stats small{font-size:11px;color:var(--epd-muted) !important;text-transform:uppercase;}
.examups-pdash .epd-cc-msg{font-size:13.5px;color:var(--epd-text-soft) !important;line-height:1.5;margin:0;}
.examups-pdash .epd-cc-actions{margin-top:auto;display:flex;gap:8px;flex-wrap:wrap;}
.examups-pdash .epd-cc-actions .examups-btn{flex:1;justify-content:center;}
.examups-pdash .epd-cc-actions .examups-btn-primary{background:var(--epd-accent);}
.examups-pdash .epd-cc-actions .examups-btn-primary:hover{background:#4f46e5;}

/* ---------- Filter chips ---------- */
.examups-pdash .epd-filter{display:flex;gap:6px;flex-wrap:wrap;}
.examups-pdash .epd-chip{
  border:1px solid var(--epd-border);background:#fff;color:var(--epd-text-soft);
  padding:6px 14px;border-radius:999px;font-size:13px;font-weight:600;
  cursor:pointer;transition:all .15s;
}
.examups-pdash .epd-chip:hover{background:#f1f5f9;}
.examups-pdash .epd-chip.is-active{
  background:var(--epd-accent) !important;color:#fff !important;border-color:var(--epd-accent);
}

/* ---------- Card / generic surfaces ---------- */
.examups-pdash .epd-card{
  background:#fff;border:1px solid var(--epd-border);
  border-radius:var(--epd-radius);padding:18px;box-shadow:var(--epd-shadow);
}
.examups-pdash .epd-grid-2{
  display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-bottom:24px;
}
@media(max-width:900px){.examups-pdash .epd-grid-2{grid-template-columns:1fr;}}

/* ---------- Activity list ---------- */
.examups-pdash .epd-activity{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px;}
.examups-pdash .epd-activity li{
  display:flex;align-items:center;gap:12px;
  padding:10px 12px;background:#f8fafc;border-radius:10px;
}
.examups-pdash .epd-activity-emoji{font-size:22px;}
.examups-pdash .epd-activity-body{flex:1;display:flex;flex-direction:column;gap:2px;min-width:0;}
.examups-pdash .epd-activity-body strong{font-size:14px;color:var(--epd-text) !important;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.examups-pdash .epd-activity-meta{font-size:12px;color:var(--epd-muted) !important;}
.examups-pdash .epd-activity-score{
  font-weight:800;font-size:14px;padding:4px 10px;border-radius:999px;
}
.examups-pdash .epd-tone-green {background:#dcfce7;color:#166534 !important;}
.examups-pdash .epd-tone-orange{background:#fef3c7;color:#a16207 !important;}
.examups-pdash .epd-tone-red   {background:#fee2e2;color:#b91c1c !important;}

/* ---------- Empty mini ---------- */
.examups-pdash .epd-empty-mini{
  text-align:center;padding:18px 14px;color:var(--epd-muted) !important;
}
.examups-pdash .epd-empty-emoji{font-size:36px;display:block;margin-bottom:6px;}

/* ---------- Empty (full) ---------- */
.examups-pdash .epd-empty{
  text-align:center;padding:60px 24px;
  border:2px dashed var(--epd-border);border-radius:var(--epd-radius-lg);
  background:#fff;
}
.examups-pdash .epd-empty-icon{font-size:54px;margin-bottom:14px;display:block;}
.examups-pdash .epd-empty h3{font-size:20px;margin:0 0 8px;color:var(--epd-text) !important;}
.examups-pdash .epd-empty p{color:var(--epd-muted) !important;max-width:420px;margin:0 auto 18px;}

/* ---------- Achievements / badges ---------- */
.examups-pdash .epd-badge-grid{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:12px;
}
.examups-pdash .epd-badge-grid-large{
  grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:16px;
}
.examups-pdash .epd-badge{
  position:relative;background:#fff;border:1px solid var(--epd-border);
  border-radius:var(--epd-radius);padding:16px;text-align:center;
  display:flex;flex-direction:column;align-items:center;gap:6px;
  transition:transform .15s,box-shadow .15s;
}
.examups-pdash .epd-badge:hover{transform:translateY(-2px);box-shadow:var(--epd-shadow-lg);}
.examups-pdash .epd-badge-emoji{font-size:36px;line-height:1;}
.examups-pdash .epd-badge strong{font-size:14px;color:var(--epd-text) !important;}
.examups-pdash .epd-badge small{font-size:11px;color:var(--epd-muted) !important;line-height:1.35;}
.examups-pdash .epd-badge.is-locked{opacity:.45;filter:grayscale(60%);}
.examups-pdash .epd-badge.is-earned{
  border-color:#bbf7d0;
  background:linear-gradient(180deg,#ffffff 0%,#f0fdf4 100%);
}
.examups-pdash .epd-badge-tick{
  position:absolute;top:8px;right:8px;
  width:22px;height:22px;border-radius:50%;
  background:var(--epd-success);color:#fff !important;
  display:flex;align-items:center;justify-content:center;
  font-size:13px;font-weight:800;
}
.examups-pdash .epd-badge-large{padding:20px;gap:8px;}

/* ---------- Test summary cards ---------- */
.examups-pdash .epd-tests-summary{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));
  gap:12px;margin-bottom:18px;
}
.examups-pdash .epd-ts-card{
  background:#fff;border:1px solid var(--epd-border);border-radius:var(--epd-radius);
  padding:14px 18px;display:flex;flex-direction:column;gap:4px;box-shadow:var(--epd-shadow);
}
.examups-pdash .epd-ts-card small{font-size:12px;color:var(--epd-muted) !important;text-transform:uppercase;letter-spacing:.04em;}
.examups-pdash .epd-ts-card strong{font-size:24px;color:var(--epd-text) !important;font-weight:800;}

/* ---------- Test history table ---------- */
.examups-pdash .epd-table-wrap{
  background:#fff;border:1px solid var(--epd-border);border-radius:var(--epd-radius);
  overflow:auto;box-shadow:var(--epd-shadow);
}
.examups-pdash .epd-table{
  width:100%;border-collapse:collapse;font-size:14px;
}
.examups-pdash .epd-table thead th{
  text-align:left;padding:14px 16px;background:#f8fafc;
  font-size:12px;color:var(--epd-muted) !important;
  text-transform:uppercase;letter-spacing:.04em;font-weight:700;
  border-bottom:1px solid var(--epd-border);
}
.examups-pdash .epd-table tbody td{
  padding:14px 16px;border-bottom:1px solid var(--epd-border-soft);
  color:var(--epd-text-soft) !important;vertical-align:middle;
}
.examups-pdash .epd-table tbody tr:last-child td{border-bottom:none;}
.examups-pdash .epd-table tbody tr:hover{background:#f8fafc;}
.examups-pdash .epd-table strong{color:var(--epd-text) !important;}
.examups-pdash .epd-tag{
  font-size:11px;font-weight:700;padding:3px 10px;border-radius:999px;
  background:#e0e7ff;color:#3730a3 !important;text-transform:capitalize;
}
.examups-pdash .epd-score-pill{
  font-weight:800;font-size:13px;padding:4px 12px;border-radius:999px;
}
.examups-pdash .epd-muted{color:var(--epd-muted) !important;}

/* ---------- Alert ---------- */
.examups-pdash .epd-alert{
  display:flex;align-items:center;gap:14px;
  background:#fff;border:1px solid var(--epd-border);border-left:4px solid var(--epd-warning);
  border-radius:var(--epd-radius);padding:14px 18px;margin-bottom:20px;
  box-shadow:var(--epd-shadow);
}
.examups-pdash .epd-alert-warning{border-left-color:var(--epd-warning);}
.examups-pdash .epd-alert-icon{font-size:24px;}
.examups-pdash .epd-alert-body{flex:1;}
.examups-pdash .epd-alert-body strong{display:block;color:var(--epd-text) !important;margin-bottom:2px;}
.examups-pdash .epd-alert-body p{margin:0;font-size:13px;color:var(--epd-muted) !important;}

/* ---------- Purchase banner ---------- */
.examups-pdash .epd-purchase-banner{
  display:flex;align-items:center;gap:18px;flex-wrap:wrap;
  background:linear-gradient(135deg,#10b981 0%,#22c55e 100%) !important;
  color:#fff !important;border-radius:var(--epd-radius-lg);
  padding:20px 24px;margin-bottom:18px;
  box-shadow:0 14px 30px rgba(16,185,129,.3);
}
.examups-pdash .epd-pb-icon{font-size:42px;}
.examups-pdash .epd-pb-text{flex:1;min-width:240px;}
.examups-pdash .epd-pb-text h3{color:#fff !important;font-size:18px;margin:0 0 4px;}
.examups-pdash .epd-pb-text p{color:rgba(255,255,255,.92) !important;margin:0;font-size:14px;}
.examups-pdash .epd-pb-text strong{color:#fff !important;}
.examups-pdash .epd-pb-progress{margin-top:10px;}
.examups-pdash .epd-pb-bar{height:8px;background:rgba(255,255,255,.25);border-radius:999px;overflow:hidden;}
.examups-pdash .epd-pb-bar span{display:block;height:100%;background:#fff;border-radius:999px;transition:width .5s;}
.examups-pdash .epd-pb-meta{display:flex;justify-content:space-between;font-size:12px;color:rgba(255,255,255,.95) !important;margin-top:6px;}
.examups-pdash .epd-pb-meta strong{color:#fff !important;}
.examups-pdash .epd-pb-cta .examups-btn{
  background:#fff !important;color:#0f172a !important;border:none;font-weight:700;
}
.examups-pdash .epd-pb-cta .examups-btn:hover{transform:translateY(-1px);box-shadow:0 8px 22px rgba(0,0,0,.2);}

.examups-pdash .epd-inline-gen{
  background:#fff;border:1px solid var(--epd-border);border-radius:var(--epd-radius-lg);
  padding:18px;margin-bottom:24px;box-shadow:var(--epd-shadow);
}

/* ---------- Profile card ---------- */
.examups-pdash .epd-profile-card{
  background:#fff;border:1px solid var(--epd-border);border-radius:var(--epd-radius-lg);
  padding:24px;box-shadow:var(--epd-shadow);
}
.examups-pdash .epd-profile-head{
  display:flex;gap:18px;align-items:center;flex-wrap:wrap;
  border-bottom:1px solid var(--epd-border-soft);padding-bottom:18px;margin-bottom:18px;
}
.examups-pdash .epd-profile-bigavatar{
  width:96px;height:96px;border-radius:50%;object-fit:cover;
  border:3px solid #fff;box-shadow:var(--epd-shadow-lg);
}
.examups-pdash .epd-profile-bigavatar-fallback{
  background:linear-gradient(135deg,var(--epd-accent),var(--epd-accent-2),var(--epd-accent-3));
  color:#fff !important;font-size:36px;font-weight:800;
  display:flex;align-items:center;justify-content:center;
}
.examups-pdash .epd-profile-head h3{font-size:22px;margin:0 0 4px;}
.examups-pdash .epd-profile-stats{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:12px;margin-bottom:18px;
}
.examups-pdash .epd-profile-stats > div{
  background:#f8fafc;border-radius:10px;padding:14px;text-align:center;
}
.examups-pdash .epd-profile-stats strong{font-size:22px;color:var(--epd-text) !important;display:block;}
.examups-pdash .epd-profile-stats span{font-size:12px;color:var(--epd-muted) !important;}
.examups-pdash .epd-profile-actions{display:flex;gap:10px;flex-wrap:wrap;}

/* ---------- Login prompt fallback ---------- */
.examups-dashboard-login-prompt{
  max-width:400px;margin:60px auto;padding:30px;text-align:center;
  background:#fff;border:1px solid #e5e7eb;border-radius:14px;box-shadow:0 4px 14px rgba(15,23,42,.08);
}

/* ---------- Responsive ---------- */
@media(max-width:1024px){
  .examups-pdash{grid-template-columns:1fr;margin:0;}
  .examups-pdash .epd-sidebar{
    position:fixed;left:-280px;top:0;bottom:0;width:260px;height:100vh;
    transition:left .25s ease;box-shadow:0 0 30px rgba(0,0,0,.15);
  }
  .examups-pdash.is-sidebar-open .epd-sidebar{left:0;}
  .examups-pdash .epd-burger{display:flex;}
}
@media(max-width:768px){
  .examups-pdash .epd-main{padding:16px;}
  .examups-pdash .epd-hero{padding:22px;flex-direction:column;align-items:flex-start;gap:14px;}
  .examups-pdash .epd-hero-illus{align-self:flex-end;width:80px;height:80px;}
  .examups-pdash .epd-hero-emoji{font-size:38px;}
  .examups-pdash .epd-stats{grid-template-columns:repeat(2,1fr);}
  .examups-pdash .epd-stat-num{font-size:20px;}
  .examups-pdash .epd-search{display:none;}
  .examups-pdash .epd-profile-name{display:none;}
  .examups-pdash .epd-table-wrap{font-size:13px;}
  .examups-pdash .epd-table thead th,
  .examups-pdash .epd-table tbody td{padding:10px 12px;}
}
@media(max-width:480px){
  .examups-pdash .epd-stats{grid-template-columns:1fr 1fr;}
  .examups-pdash .epd-course-grid,
  .examups-pdash .epd-continue-grid{grid-template-columns:1fr;}
  .examups-pdash .epd-purchase-banner{flex-direction:column;align-items:flex-start;}
}

/* ============================================================
 * Examups Learning v1.6 — rich question types, charts, tables,
 * language switcher, split-screen instruction layout
 * ============================================================ */

/* Language switcher in topbar */
.eu-lang-switch{display:inline-flex;background:#f1f5f9;border-radius:999px;padding:3px;margin-right:6px;}
.eu-lang-switch .eu-lang-btn{border:0;background:transparent;font:600 12px/1 system-ui;padding:6px 12px;border-radius:999px;cursor:pointer;color:#475569;}
.eu-lang-switch .eu-lang-btn.is-active{background:#fff;color:#0f172a;box-shadow:0 1px 3px rgba(15,23,42,.1);}

/* Question type chip */
.eu-q-type-chip{display:inline-block;background:#eff6ff;color:#1d4ed8;font:600 11px/1 system-ui;padding:4px 10px;border-radius:999px;margin-left:8px;letter-spacing:.2px;}

/* Split layout: instruction pane (left) + question pane (right) */
.eu-q-layout{display:block;}
.eu-q-layout.has-instruction{display:grid;grid-template-columns:minmax(280px, 0.9fr) 1.1fr;gap:18px;align-items:start;}
.eu-q-layout > .eu-q-instruction[hidden]{display:none;}
.eu-q-instruction{background:#fff8e1;border:1px solid #facc15;border-radius:14px;padding:18px;font-size:14px;line-height:1.6;color:#1f2937;max-height:78vh;overflow:auto;position:sticky;top:14px;}
.eu-q-instruction-head{display:flex;align-items:center;gap:8px;font-weight:700;color:#92400e;margin-bottom:10px;border-bottom:1px dashed #f59e0b;padding-bottom:8px;}
.eu-q-instruction-body{font-size:14px;}
.eu-q-instruction-body table,
.eu-q-instruction-body img,
.eu-q-chart img,
.eu-q-chart canvas,
.eu-q-text table,
.eu-md-table{max-width:100%;}
.eu-q-chart{margin-top:12px;text-align:center;}
.eu-q-chart img{max-width:100%;height:auto;}

/* Embedded data tables (markdown-converted or AI-emitted) */
.eu-q-text table,
.eu-q-instruction-body table,
.eu-md-table{
  border-collapse:collapse;
  width:100%;
  margin:10px 0;
  background:#fff;
  border:1px solid #cbd5e1;
  font-size:13px;
}
.eu-q-text th, .eu-q-text td,
.eu-q-instruction-body th, .eu-q-instruction-body td,
.eu-md-table th, .eu-md-table td{border:1px solid #cbd5e1;padding:8px 10px;text-align:center;}
.eu-q-text th, .eu-q-instruction-body th, .eu-md-table th{background:#f1f5f9;font-weight:700;color:#0f172a;}

/* Inline question image */
.eu-q-img{display:block;max-width:100%;margin:0 auto 14px;border-radius:10px;}

/* Multi-select option (checkbox) */
.eu-q-opt-msq input{margin-left:auto;width:18px;height:18px;}

/* True/False option strip */
.eu-q-opt-tf .eu-q-opt-idx{background:#dcfce7;color:#166534;}
.eu-q-opt-tf:nth-child(2) .eu-q-opt-idx{background:#fee2e2;color:#991b1b;}

/* Match-the-following table */
.eu-q-match{width:100%;border-collapse:collapse;margin:10px 0;}
.eu-q-match th, .eu-q-match td{border:1px solid #cbd5e1;padding:10px;font-size:14px;}
.eu-q-match thead th{background:#0f172a;color:#fff;text-align:left;}
.eu-q-match-sel{width:100%;padding:6px 8px;border:1px solid #cbd5e1;border-radius:6px;background:#fff;font:14px system-ui;}

/* Fill-in-the-blanks inputs */
.eu-q-blanks{display:flex;flex-direction:column;gap:10px;}
.eu-q-blank-row{display:flex;align-items:center;gap:12px;}
.eu-q-blank-label{min-width:78px;font-weight:600;color:#475569;font-size:13px;}
.eu-q-blank-input{flex:1;padding:9px 12px;border:1px solid #cbd5e1;border-radius:8px;font:15px system-ui;background:#fff;}
.eu-q-blank-input:focus{outline:2px solid #2563eb;outline-offset:1px;}

/* Numerical answer */
.eu-q-numerical{display:flex;flex-direction:column;gap:6px;}
.eu-q-numerical input{padding:10px 14px;border:1px solid #cbd5e1;border-radius:8px;font:16px system-ui;max-width:240px;}
.eu-q-numerical small{color:#64748b;font-size:12px;}

@media (max-width: 1024px){
  .eu-q-layout.has-instruction{grid-template-columns:1fr;}
  .eu-q-instruction{position:static;max-height:none;}
}


/* ============================================================
 * Examups Learning v1.6 — branded login gate (templates/partials/login-gate.php)
 * Used by dashboard, course player, notes viewer, generation status,
 * and any other gate that requires authentication.
 * ============================================================ */
.examups-login-shell{
    min-height:100vh;
    display:flex;align-items:center;justify-content:center;
    padding:48px 20px;
    background:
        radial-gradient(circle at 20% 0%, rgba(99,102,241,.18), transparent 55%),
        radial-gradient(circle at 80% 100%, rgba(139,92,246,.22), transparent 60%),
        linear-gradient(160deg,#0b1224 0%, #111c3b 50%, #1a1147 100%);
    color:#e2e8f0;
    font-family:'Segoe UI', system-ui, -apple-system, sans-serif;
    box-sizing:border-box;
}
.examups-login-shell.is-compact{
    min-height:auto;
    padding:36px 16px;
}
.examups-login-shell *,
.examups-login-shell *::before,
.examups-login-shell *::after{box-sizing:border-box;}

.examups-login-card{
    position:relative;
    width:100%;max-width:460px;
    background:rgba(255,255,255,.96);
    backdrop-filter:blur(14px);
    border-radius:22px;
    padding:32px 34px 28px;
    box-shadow:
        0 30px 70px -20px rgba(15,23,42,.55),
        0 0 0 1px rgba(255,255,255,.06);
    color:#0f172a;
    overflow:hidden;
    animation:euLoginIn .6s cubic-bezier(.2,.9,.3,1.2);
}
@keyframes euLoginIn{
    from{transform:translateY(18px) scale(.97);opacity:0;}
    to  {transform:none;opacity:1;}
}

/* Soft animated glow behind the card */
.examups-login-card-glow{
    position:absolute;inset:-40% -10% auto -10%;
    height:80%;
    background:conic-gradient(from 90deg, #6366f1, #8b5cf6, #ec4899, #6366f1);
    filter:blur(50px);opacity:.2;
    pointer-events:none;
    z-index:0;
    animation:euGlowSpin 14s linear infinite;
}
@keyframes euGlowSpin{
    to{transform:rotate(360deg);}
}

.examups-login-card > *{position:relative;z-index:1;}

/* --- Brand bar (logo + site name + tagline) --- */
.examups-login-brand{
    display:flex;align-items:center;gap:12px;
    padding-bottom:22px;
    border-bottom:1px solid #eef2f7;
    margin-bottom:22px;
}
.examups-login-logo{
    width:52px;height:52px;
    border-radius:14px;
    background:linear-gradient(135deg,#6366f1,#8b5cf6);
    display:flex;align-items:center;justify-content:center;
    color:#fff;font-weight:800;font-size:20px;letter-spacing:.5px;
    box-shadow:0 8px 22px rgba(99,102,241,.4);
    flex-shrink:0;
    overflow:hidden;
}
.examups-login-logo img{max-width:38px;max-height:38px;}
.examups-login-logo-mono{
    font-family:'Segoe UI', system-ui, sans-serif;
    font-weight:800;font-size:20px;
    color:#fff;
}
.examups-login-brand-text{display:flex;flex-direction:column;line-height:1.2;}
.examups-login-brand-name{font-size:17px;font-weight:700;color:#0f172a;}
.examups-login-brand-tag{font-size:12px;color:#64748b;margin-top:3px;}

/* --- Hero pill + heading --- */
.examups-login-hero{margin-bottom:24px;}
.examups-login-hero-pill{
    display:inline-flex;align-items:center;gap:6px;
    background:linear-gradient(135deg, rgba(99,102,241,.12), rgba(139,92,246,.12));
    color:#4f46e5;font-weight:600;font-size:11px;
    text-transform:uppercase;letter-spacing:.5px;
    padding:5px 11px;border-radius:999px;margin-bottom:14px;
}
.examups-login-hero-pill .material-icons-round{font-size:14px;}
.examups-login-heading{
    margin:0 0 8px;font-size:24px;font-weight:700;color:#0f172a;
    letter-spacing:-.4px;line-height:1.2;
}
.examups-login-subtext{margin:0;color:#475569;font-size:14px;line-height:1.5;}

/* --- The actual login form --- */
.examups-login-form-wrap{margin-bottom:22px;}
.examups-login-form-wrap form{margin:0;}
.examups-login-form-wrap p{margin:0 0 14px;}
.examups-login-form-wrap label{
    display:block;font-size:13px;font-weight:600;color:#334155;
    margin-bottom:6px;
}
.examups-login-form-wrap input[type=text],
.examups-login-form-wrap input[type=email],
.examups-login-form-wrap input[type=password]{
    width:100%;
    padding:12px 14px;
    border:1.5px solid #e2e8f0;
    border-radius:11px;
    font:15px 'Segoe UI', system-ui, sans-serif;
    color:#0f172a;
    background:#fff;
    transition:border-color .15s, box-shadow .15s, background .15s;
}
.examups-login-form-wrap input[type=text]:focus,
.examups-login-form-wrap input[type=email]:focus,
.examups-login-form-wrap input[type=password]:focus{
    outline:0;
    border-color:#6366f1;
    background:#fefefe;
    box-shadow:0 0 0 4px rgba(99,102,241,.15);
}
.examups-login-form-wrap .login-remember{
    display:flex;align-items:center;gap:8px;
    font-size:13px;color:#475569;font-weight:500;
    margin:6px 0 18px;cursor:pointer;
}
.examups-login-form-wrap .login-remember label{margin:0;cursor:pointer;font-weight:500;color:#475569;}
.examups-login-form-wrap .login-remember input[type=checkbox]{
    width:16px;height:16px;accent-color:#6366f1;cursor:pointer;
}
.examups-login-form-wrap .login-submit{margin:0;}
.examups-login-form-wrap input[type=submit]{
    width:100%;
    padding:13px 16px;
    background:linear-gradient(135deg,#6366f1 0%,#8b5cf6 100%);
    color:#fff;
    border:0;
    border-radius:12px;
    font:600 15px 'Segoe UI', system-ui, sans-serif;
    letter-spacing:.2px;
    cursor:pointer;
    transition:transform .12s, box-shadow .15s, filter .15s;
    box-shadow:0 10px 24px -8px rgba(99,102,241,.55);
}
.examups-login-form-wrap input[type=submit]:hover{
    transform:translateY(-1px);
    filter:brightness(1.05);
    box-shadow:0 14px 30px -10px rgba(99,102,241,.65);
}
.examups-login-form-wrap input[type=submit]:active{transform:translateY(0);}

/* --- Forgot / Register row --- */
.examups-login-row{
    display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:8px;
    margin-top:14px;font-size:13px;color:#64748b;
}
.examups-login-row a{color:#4f46e5;text-decoration:none;font-weight:600;}
.examups-login-row a:hover{text-decoration:underline;}
.examups-login-forgot{margin-left:auto;}

/* --- Perks list --- */
.examups-login-perks{
    list-style:none;
    margin:24px 0 18px;padding:18px 16px;
    background:linear-gradient(135deg,#f8fafc,#eef2ff);
    border:1px solid #e2e8f0;border-radius:12px;
    display:flex;flex-direction:column;gap:8px;
}
.examups-login-perks li{
    display:flex;align-items:center;gap:8px;
    font-size:13px;color:#334155;
}
.examups-login-perks .material-icons-round{
    color:#6366f1;font-size:18px;
    background:rgba(99,102,241,.1);
    padding:4px;border-radius:6px;
}

/* --- Footer (back-to-home + copyright) --- */
.examups-login-foot{
    display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:8px;
    padding-top:16px;
    border-top:1px solid #eef2f7;
    font-size:12px;color:#94a3b8;
}
.examups-login-foot a{
    display:inline-flex;align-items:center;gap:4px;
    color:#475569;text-decoration:none;font-weight:600;
}
.examups-login-foot a:hover{color:#6366f1;}
.examups-login-foot .material-icons-round{font-size:14px;}

/* --- Login error styles (WP renders these inline) --- */
.examups-login-shell .login-error,
.examups-login-shell #login_error{
    background:#fef2f2;border:1px solid #fecaca;color:#991b1b;
    padding:10px 14px;border-radius:10px;font-size:13px;margin-bottom:14px;
}

/* --- Compact variant for inline blockers (course player / notes viewer) --- */
.examups-login-shell.is-compact{
    background:transparent;
    color:#0f172a;
}
.examups-login-shell.is-compact .examups-login-card{
    box-shadow:0 6px 24px -8px rgba(15,23,42,.18), 0 0 0 1px #e2e8f0;
}

/* --- Mobile --- */
@media (max-width:480px){
    .examups-login-shell{padding:24px 14px;}
    .examups-login-card{padding:24px 22px 22px;border-radius:18px;}
    .examups-login-heading{font-size:21px;}
    .examups-login-perks{padding:14px;}
}