/* ExamPro – design layer on top of Bootstrap 5.3 */
:root {
  --ep-primary: #4f46e5;
  --ep-primary-2: #7c3aed;
  --ep-sidebar: #0f172a;
  --ep-sidebar-text: #cbd5e1;
  --ep-radius: 14px;
  --bs-primary: #4f46e5;
  --bs-primary-rgb: 79, 70, 229;
  --bs-link-color: #4f46e5;
  --bs-link-color-rgb: 79, 70, 229;
  --bs-link-hover-color: #4338ca;
  --bs-body-font-family: "Inter", "Noto Sans Devanagari", "Noto Sans Gujarati", "Noto Sans Arabic", system-ui, -apple-system, "Segoe UI", sans-serif;
  --bs-body-bg: #f4f6fb;
  --pal-ans: #16a34a; --pal-na: #dc2626; --pal-nv: #e2e8f0; --pal-mk: #7c3aed;
}
[data-bs-theme="dark"] {
  --bs-body-bg: #0b1120;
  --bs-body-color: #e2e8f0;
  --bs-secondary-bg: #111827;
  --bs-tertiary-bg: #0f172a;
  --bs-border-color: #1f2a3d;
  --ep-sidebar: #070b16;
  --pal-nv: #334155;
  --bs-primary: #818cf8;
  --bs-link-color: #a5b4fc;
  --bs-link-hover-color: #c7d2fe;
}
.btn-primary { --bs-btn-bg: var(--ep-primary); --bs-btn-border-color: var(--ep-primary); --bs-btn-hover-bg: #4338ca; --bs-btn-hover-border-color: #4338ca; --bs-btn-active-bg: #3730a3; --bs-btn-disabled-bg: var(--ep-primary); --bs-btn-disabled-border-color: var(--ep-primary); }
.btn-outline-primary { --bs-btn-color: var(--ep-primary); --bs-btn-border-color: var(--ep-primary); --bs-btn-hover-bg: var(--ep-primary); --bs-btn-hover-border-color: var(--ep-primary); --bs-btn-active-bg: var(--ep-primary); --bs-btn-active-border-color: var(--ep-primary); }
[data-bs-theme="dark"] .btn-outline-primary { --bs-btn-color: #a5b4fc; --bs-btn-border-color: #6366f1; }
.nav-pills { --bs-nav-pills-link-active-bg: var(--ep-primary); }
.text-bg-primary { background-color: var(--ep-primary) !important; }
.form-check-input:checked { background-color: var(--ep-primary); border-color: var(--ep-primary); }
.page-item.active .page-link { background: var(--ep-primary); border-color: var(--ep-primary); }
[data-bs-theme="dark"] .btn-light { --bs-btn-bg: #1e293b; --bs-btn-border-color: #334155; --bs-btn-color: #e2e8f0; --bs-btn-hover-bg: #334155; --bs-btn-hover-color: #fff; }
[data-bs-theme="dark"] .text-bg-light { background-color: #1e293b !important; color: #e2e8f0 !important; }
[data-bs-theme="dark"] .table-light { --bs-table-bg: #1e293b; --bs-table-color: #e2e8f0; }

body { font-feature-settings: "cv11", "ss01"; -webkit-font-smoothing: antialiased; }
.min-w-0 { min-width: 0; }
.line-clamp-2 { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.card { border-radius: var(--ep-radius); border: 1px solid var(--bs-border-color-translucent); box-shadow: 0 1px 2px rgba(15, 23, 42, .04), 0 4px 14px rgba(15, 23, 42, .04); }
.card-header { background: transparent; font-weight: 600; padding: .9rem 1.1rem; border-bottom-color: var(--bs-border-color-translucent); }
.table > :not(caption) > * > * { padding: .7rem .9rem; }
.table thead th { font-size: .74rem; text-transform: uppercase; letter-spacing: .04em; color: var(--bs-secondary-color); font-weight: 600; white-space: nowrap; background: transparent; }
.badge { font-weight: 600; }

/* ---------- brand ---------- */
.brand-logo { width: 38px; height: 38px; border-radius: 11px; display: inline-grid; place-items: center; color: #fff; font-size: 1.15rem; background: linear-gradient(135deg, var(--ep-primary), var(--ep-primary-2)); box-shadow: 0 6px 16px rgba(79, 70, 229, .35); flex: none; }
.brand-logo-sm { width: 32px; height: 32px; font-size: 1rem; border-radius: 9px; }
.avatar { width: 36px; height: 36px; border-radius: 50%; display: inline-grid; place-items: center; font-weight: 700; font-size: .8rem; color: #fff; background: linear-gradient(135deg, #6366f1, #a855f7); flex: none; }
.avatar-sm { width: 26px; height: 26px; font-size: .62rem; }
.avatar-lg { width: 56px; height: 56px; font-size: 1.1rem; display: grid; }
.avatar-xl { width: 88px; height: 88px; font-size: 1.8rem; display: grid; }

/* ---------- app shell ---------- */
.app-shell { display: flex; min-height: 100vh; }
.sidebar { width: 260px; flex: none; background: var(--ep-sidebar); color: var(--ep-sidebar-text); display: flex; flex-direction: column; position: sticky; top: 0; height: 100vh; z-index: 1040; transition: transform .25s ease; }
.sidebar-brand { display: flex; align-items: center; gap: .7rem; padding: 1.1rem 1.25rem; color: #fff; text-decoration: none; font-weight: 800; font-size: 1.12rem; }
.sidebar-nav { flex: 1; overflow-y: auto; padding: .5rem .8rem; }
.nav-heading { font-size: .68rem; text-transform: uppercase; letter-spacing: .09em; color: #64748b; padding: 1rem .7rem .4rem; font-weight: 700; }
.sidebar .nav-link { display: flex; align-items: center; gap: .75rem; color: var(--ep-sidebar-text); padding: .6rem .8rem; border-radius: 10px; font-weight: 500; font-size: .93rem; margin-bottom: 2px; transition: background .15s, color .15s; }
.sidebar .nav-link i { font-size: 1.05rem; width: 20px; text-align: center; opacity: .85; }
.sidebar .nav-link:hover { background: rgba(255, 255, 255, .06); color: #fff; }
.sidebar .nav-link.active { background: linear-gradient(135deg, var(--ep-primary), var(--ep-primary-2)); color: #fff; box-shadow: 0 6px 18px rgba(79, 70, 229, .35); }
.sidebar-footer { padding: 1rem 1.25rem; border-top: 1px solid rgba(255, 255, 255, .07); color: #fff; }
.sidebar-backdrop { display: none; }
.main { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.topbar { position: sticky; top: 0; z-index: 1030; display: flex; align-items: center; gap: .75rem; padding: .75rem 1.5rem; background: color-mix(in srgb, var(--bs-body-bg) 85%, transparent); backdrop-filter: blur(10px); border-bottom: 1px solid var(--bs-border-color-translucent); }
.topbar-title { font-size: 1.15rem; font-weight: 700; margin: 0; }
.content { padding: 1.5rem; flex: 1; }
.app-footer { padding: 1rem 1.5rem; font-size: .8rem; color: var(--bs-secondary-color); border-top: 1px solid var(--bs-border-color-translucent); }
@media (max-width: 991.98px) {
  .sidebar { position: fixed; inset-inline-start: 0; transform: translateX(-100%); }
  [dir="rtl"] .sidebar { transform: translateX(100%); }
  body.sidebar-open .sidebar { transform: none; }
  body.sidebar-open .sidebar-backdrop { display: block; position: fixed; inset: 0; background: rgba(0, 0, 0, .45); z-index: 1035; }
  .content { padding: 1rem; }
  .topbar { padding: .6rem 1rem; }
}

/* ---------- stats ---------- */
.stat-card .card-body { display: flex; align-items: center; gap: .9rem; }
.stat-icon { width: 48px; height: 48px; border-radius: 12px; display: grid; place-items: center; font-size: 1.35rem; flex: none; }
.stat-value { font-size: 1.45rem; font-weight: 800; line-height: 1.1; color: var(--bs-body-color); }
.stat-label { font-size: .8rem; color: var(--bs-secondary-color); }
.stat-card-sm .stat-icon { width: 40px; height: 40px; font-size: 1.1rem; }
.stat-card-sm .stat-value { font-size: 1.15rem; }
a.stat-card { transition: transform .15s, box-shadow .15s; }
a.stat-card:hover { transform: translateY(-2px); box-shadow: 0 10px 24px rgba(15, 23, 42, .08); }
.mini-stat { padding: .9rem; border-radius: 12px; background: var(--bs-tertiary-bg); }
.mini-stat i { color: var(--ep-primary); font-size: 1.2rem; }
.chart-box { position: relative; height: 290px; }
.chart-box-sm { height: 220px; }
.empty-state { text-align: center; color: var(--bs-secondary-color); padding: 2rem 1rem; }
.empty-state i { font-size: 2.2rem; opacity: .4; display: block; margin-bottom: .5rem; }
.empty-state p { margin-bottom: .75rem; }
.welcome-card { display: flex; flex-wrap: wrap; gap: 1rem; justify-content: space-between; align-items: center; padding: 1.5rem 1.75rem; border-radius: var(--ep-radius); color: #fff; background: radial-gradient(circle at 85% 20%, rgba(255, 255, 255, .18), transparent 40%), linear-gradient(135deg, var(--ep-primary), var(--ep-primary-2)); box-shadow: 0 12px 30px rgba(79, 70, 229, .3); }
.exam-icon { width: 42px; height: 42px; border-radius: 10px; display: grid; place-items: center; background: rgba(79, 70, 229, .1); color: var(--ep-primary); font-size: 1.2rem; flex: none; }
.exam-card { transition: transform .15s, box-shadow .15s; }
.exam-card:hover { transform: translateY(-3px); box-shadow: 0 14px 30px rgba(15, 23, 42, .1); }
.exam-meta { display: grid; grid-template-columns: 1fr 1fr; gap: .35rem .75rem; font-size: .82rem; color: var(--bs-secondary-color); }
.rank-pill { display: inline-grid; place-items: center; min-width: 26px; height: 26px; border-radius: 8px; background: var(--bs-tertiary-bg); font-weight: 700; font-size: .8rem; border: 1px solid var(--bs-border-color); }
.lang-dot { font-size: .45rem; vertical-align: middle; color: var(--bs-border-color); }
.lang-dot.filled { color: #16a34a; }
.key-btn { min-width: 44px; font-weight: 700; }
.section-card .card-header { background: var(--bs-tertiary-bg); }

/* ---------- palette states (shared) ---------- */
.pal { display: inline-grid; place-items: center; min-width: 34px; height: 34px; padding: 0 .3rem; font-size: .8rem; font-weight: 700; border: 0; border-radius: 8px; background: var(--pal-nv); color: var(--bs-body-color); cursor: pointer; position: relative; transition: transform .1s; }
.pal:hover { transform: scale(1.06); }
.pal-ans { background: var(--pal-ans); color: #fff; clip-path: polygon(0 18%, 50% 0, 100% 18%, 100% 100%, 0 100%); }
.pal-na { background: var(--pal-na); color: #fff; clip-path: polygon(0 0, 100% 0, 100% 82%, 50% 100%, 0 82%); }
.pal-mk { background: var(--pal-mk); color: #fff; border-radius: 50%; }
.pal-am { background: var(--pal-mk); color: #fff; border-radius: 50%; }
.pal-am::after { content: ""; position: absolute; right: -1px; bottom: -1px; width: 12px; height: 12px; border-radius: 50%; background: var(--pal-ans); border: 2px solid var(--bs-body-bg); }
.pal.current { outline: 3px solid #f59e0b; outline-offset: 2px; }
.legend-grid { display: flex; flex-wrap: wrap; gap: .75rem 1.25rem; font-size: .85rem; padding: .75rem; background: var(--bs-tertiary-bg); border-radius: 12px; }
.legend-grid .pal { min-width: 28px; height: 28px; cursor: default; }
.instructions-list li { margin-bottom: .4rem; }

/* ---------- CBT exam screen ---------- */
.exam-body { background: var(--bs-body-bg); overflow: hidden; }
.cbt { display: flex; flex-direction: column; height: 100vh; height: 100dvh; }
.cbt.no-select { user-select: none; -webkit-user-select: none; }
.cbt.no-select input { user-select: text; }
.cbt-header { display: flex; align-items: center; gap: 1rem; padding: .6rem 1rem; color: #fff; background: linear-gradient(135deg, #1e1b4b, var(--ep-primary)); box-shadow: 0 2px 10px rgba(0, 0, 0, .15); }
.cbt-header .brand-logo { background: rgba(255, 255, 255, .15); box-shadow: none; }
.cbt-lang { width: auto; flex-wrap: nowrap; }
@media (max-width: 575.98px) { .cbt-lang .input-group-text { display: none; } .cbt-lang .form-select { min-width: 96px; } .cbt-header { gap: .5rem; padding: .5rem .6rem; } .cbt-timer { font-size: 1rem; padding: .25rem .5rem; } .cbt-actions #btnNext { flex: 1; } }
.cbt-lang .form-select { min-width: 120px; }
.cbt-timer { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 1.15rem; font-weight: 800; background: rgba(255, 255, 255, .15); padding: .3rem .8rem; border-radius: 10px; white-space: nowrap; }
.cbt-timer.warn { background: #f59e0b; color: #1e1b4b; }
.cbt-timer.danger { background: #dc2626; animation: pulse 1s infinite; }
@keyframes pulse { 50% { opacity: .65; } }
.save-state { font-size: .78rem; color: #e0e7ff !important; opacity: .9; }
.save-state.text-danger { color: #fecaca !important; }
.cbt-body { flex: 1; display: flex; min-height: 0; }
.cbt-main { flex: 1; display: flex; flex-direction: column; min-width: 0; background: var(--bs-body-bg); }
.cbt-sections { display: flex; gap: .4rem; padding: .6rem 1rem; overflow-x: auto; border-bottom: 1px solid var(--bs-border-color); background: var(--bs-secondary-bg); }
.sec-tab { border: 1px solid var(--bs-border-color); background: var(--bs-body-bg); color: var(--bs-body-color); border-radius: 999px; padding: .35rem .9rem; font-size: .85rem; font-weight: 600; white-space: nowrap; }
.sec-tab .badge { background: var(--bs-tertiary-bg); color: var(--bs-secondary-color); }
.sec-tab.active { background: var(--ep-primary); border-color: var(--ep-primary); color: #fff; }
.sec-tab.active .badge { background: rgba(255, 255, 255, .25); color: #fff; }
.cbt-qhead { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: .5rem; padding: .75rem 1.25rem; border-bottom: 1px solid var(--bs-border-color); }
.cbt-question { flex: 1; overflow-y: auto; padding: 1.25rem 1.5rem 2rem; }
.q-text { font-size: 1.1rem; line-height: 1.7; font-weight: 500; margin-bottom: 1.25rem; white-space: normal; }
.q-img { max-width: 100%; max-height: 320px; border-radius: 10px; border: 1px solid var(--bs-border-color); margin-bottom: 1rem; display: block; }
.q-options { display: grid; gap: .65rem; max-width: 860px; }
.q-option { display: flex; align-items: center; gap: .9rem; padding: .85rem 1rem; border: 2px solid var(--bs-border-color); border-radius: 12px; cursor: pointer; background: var(--bs-secondary-bg); transition: border-color .12s, background .12s, transform .12s; }
.q-option:hover { border-color: #a5b4fc; transform: translateX(2px); }
[dir="rtl"] .q-option:hover { transform: translateX(-2px); }
.q-option input { position: absolute; opacity: 0; pointer-events: none; }
.opt-key { flex: none; width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center; font-weight: 700; background: var(--bs-tertiary-bg); border: 1px solid var(--bs-border-color); }
.q-option input[type=checkbox] + .opt-key { border-radius: 8px; }
.q-option.selected { border-color: var(--ep-primary); background: color-mix(in srgb, var(--ep-primary) 9%, var(--bs-secondary-bg)); }
.q-option.selected .opt-key { background: var(--ep-primary); color: #fff; border-color: var(--ep-primary); }
.opt-text { flex: 1; }
.q-numeric { max-width: 340px; }
.keypad { display: grid; grid-template-columns: repeat(3, 1fr); gap: .4rem; margin-top: .6rem; }
.keypad button { padding: .55rem; border-radius: 10px; border: 1px solid var(--bs-border-color); background: var(--bs-secondary-bg); color: var(--bs-body-color); font-weight: 700; font-size: 1.05rem; }
.keypad button:active { background: var(--ep-primary); color: #fff; }
.keypad .kp-wide { grid-column: span 3; }
.cbt-actions { display: flex; flex-wrap: wrap; justify-content: space-between; gap: .5rem; padding: .75rem 1.25rem; border-top: 1px solid var(--bs-border-color); background: var(--bs-secondary-bg); }
.cbt-side { width: 330px; flex: none; border-inline-start: 1px solid var(--bs-border-color); background: var(--bs-secondary-bg); overflow-y: auto; }
.cbt-side > div, .offcanvas-body > div { width: 100%; display: flex; }
.palette-panel { display: flex; flex-direction: column; gap: 1rem; padding: 1rem; width: 100%; min-height: 100%; }
.candidate { display: flex; gap: .7rem; align-items: center; padding-bottom: .9rem; border-bottom: 1px solid var(--bs-border-color); }
.palette-panel .legend { display: flex; flex-wrap: wrap; gap: .55rem .9rem; font-size: .78rem; }
.palette-panel .legend > div { display: flex; align-items: center; gap: .4rem; width: calc(50% - .5rem); }
.palette-panel .legend .pal { min-width: 28px; height: 28px; font-size: .72rem; cursor: default; }
.palette-section-title { font-weight: 700; font-size: .85rem; padding: .45rem .7rem; border-radius: 8px; background: var(--ep-primary); color: #fff; }
.palette-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: .5rem; }
.palette-grid .pal { width: 100%; height: 40px; }
.proctor-box { font-size: .82rem; padding: .5rem .7rem; border-radius: 8px; background: rgba(220, 38, 38, .1); color: #dc2626; }
.fs-gate { position: fixed; inset: 0; z-index: 2000; background: var(--bs-body-bg); display: grid; place-items: center; }

/* ---------- results ---------- */
.result-hero { overflow: hidden; position: relative; }
.result-hero::before { content: ""; position: absolute; inset: 0 0 auto 0; height: 5px; }
.result-hero.is-pass::before { background: linear-gradient(90deg, #16a34a, #22c55e); }
.result-hero.is-fail::before { background: linear-gradient(90deg, #dc2626, #f97316); }
.score-ring { --c: var(--ep-primary); width: 150px; height: 150px; border-radius: 50%; display: grid; place-items: center; margin: auto; background: conic-gradient(var(--c) calc(var(--p) * 1%), var(--bs-tertiary-bg) 0); }
.is-pass .score-ring { --c: #16a34a; }
.is-fail .score-ring { --c: #dc2626; }
.score-ring > div { width: 118px; height: 118px; border-radius: 50%; background: var(--bs-body-bg); display: flex; flex-direction: column; align-items: center; justify-content: center; }
.score-ring span { font-size: 1.6rem; font-weight: 800; }
.score-ring small { color: var(--bs-secondary-color); }
.rank-box { display: flex; gap: 1rem; }
.rank-box > div { text-align: center; padding: .9rem 1.2rem; border-radius: 12px; background: var(--bs-tertiary-bg); min-width: 110px; }
.rank-num { font-size: 1.6rem; font-weight: 800; color: var(--ep-primary); }
.review-card { border-inline-start: 4px solid var(--bs-border-color); }
.review-correct { border-inline-start-color: #16a34a; }
.review-wrong { border-inline-start-color: #dc2626; }
.review-partial { border-inline-start-color: #f59e0b; }
.review-opt { display: flex; align-items: center; gap: .7rem; padding: .55rem .8rem; border-radius: 10px; border: 1px solid var(--bs-border-color); background: var(--bs-tertiary-bg); }
.review-opt .opt-key { width: 28px; height: 28px; font-size: .8rem; }
.review-opt.is-correct { border-color: #16a34a; background: rgba(22, 163, 74, .1); }
.review-opt.is-correct .opt-key { background: #16a34a; color: #fff; border-color: #16a34a; }
.review-opt.is-wrong { border-color: #dc2626; background: rgba(220, 38, 38, .08); }
.review-opt.is-wrong .opt-key { background: #dc2626; color: #fff; border-color: #dc2626; }
.explanation { padding: .75rem 1rem; border-radius: 10px; background: rgba(245, 158, 11, .1); border: 1px dashed rgba(245, 158, 11, .5); font-size: .92rem; }
.podium-card { border-top: 4px solid transparent; }
.podium-1 { border-top-color: #f59e0b; transform: translateY(-8px); }
.podium-2 { border-top-color: #94a3b8; }
.podium-3 { border-top-color: #b45309; }
.podium-medal { font-size: 2rem; }

/* ---------- auth & public ---------- */
.auth-wrap { min-height: 100vh; display: flex; }
.auth-side { flex: 1; align-items: center; padding: 4rem; color: #fff; background: radial-gradient(circle at 20% 20%, rgba(255, 255, 255, .15), transparent 35%), radial-gradient(circle at 80% 80%, rgba(168, 85, 247, .5), transparent 40%), linear-gradient(135deg, #1e1b4b, var(--ep-primary)); }
.auth-side .brand-logo { background: rgba(255, 255, 255, .15); box-shadow: none; }
.auth-main { flex: 0 0 min(560px, 100%); padding: 2rem clamp(1rem, 4vw, 3.5rem); display: flex; flex-direction: column; justify-content: center; background: var(--bs-body-bg); }
.auth-card { width: 100%; max-width: 460px; margin: 0 auto; }
.demo-box { padding: .9rem; border-radius: 12px; border: 1px dashed var(--bs-border-color); background: var(--bs-tertiary-bg); }
.pw-meter { height: 4px; border-radius: 4px; background: var(--bs-tertiary-bg); overflow: hidden; }
.pw-meter div { height: 100%; width: 0; transition: width .2s; }
.public-nav { background: color-mix(in srgb, var(--bs-body-bg) 85%, transparent); backdrop-filter: blur(10px); border-bottom: 1px solid var(--bs-border-color-translucent); }
.hero { background: radial-gradient(circle at 10% 10%, rgba(79, 70, 229, .12), transparent 40%), radial-gradient(circle at 90% 60%, rgba(168, 85, 247, .12), transparent 40%); }
.hero h1 { background: linear-gradient(135deg, var(--bs-body-color) 30%, var(--ep-primary)); -webkit-background-clip: text; background-clip: text; color: transparent; }
.hero-mock { padding: 1.5rem; border-radius: 20px; background: var(--bs-secondary-bg); border: 1px solid var(--bs-border-color); transform: rotate(-1.5deg); }
.mock-opt { display: flex; gap: .7rem; align-items: center; padding: .55rem .8rem; border: 2px solid var(--bs-border-color); border-radius: 10px; margin-bottom: .45rem; font-size: .92rem; }
.mock-opt span { width: 26px; height: 26px; border-radius: 50%; display: grid; place-items: center; font-weight: 700; font-size: .78rem; background: var(--bs-tertiary-bg); }
.mock-opt.sel { border-color: var(--ep-primary); background: rgba(79, 70, 229, .08); }
.mock-opt.sel span { background: var(--ep-primary); color: #fff; }
.feature-icon { width: 52px; height: 52px; border-radius: 14px; display: grid; place-items: center; font-size: 1.5rem; }
.feature-card { transition: transform .15s; }
.feature-card:hover { transform: translateY(-4px); }

/* ---------- certificate ---------- */
.print-body { background: #e2e8f0; }
.cert-toolbar { display: flex; justify-content: center; gap: .5rem; padding: 1rem; }
.certificate { width: min(1050px, 96vw); aspect-ratio: 1.414; margin: 0 auto 2rem; background: #fffdf7; color: #1e293b; padding: 22px; box-shadow: 0 20px 50px rgba(0, 0, 0, .15); font-family: Georgia, "Noto Serif", "Noto Sans Devanagari", serif; }
.cert-inner { height: 100%; border: 3px double #b8860b; outline: 10px solid #1e1b4b; outline-offset: -18px; padding: 3.2rem 4rem; display: flex; flex-direction: column; align-items: center; text-align: center; position: relative; background: radial-gradient(circle at 50% 40%, rgba(184, 134, 11, .06), transparent 60%); }
.cert-seal { position: absolute; top: 2.4rem; right: 3rem; width: 84px; height: 84px; border-radius: 50%; background: radial-gradient(#f5c542, #b8860b); display: grid; place-items: center; color: #fff; font-size: 2.4rem; box-shadow: 0 4px 12px rgba(184, 134, 11, .4); }
.cert-org { text-transform: uppercase; letter-spacing: .25em; font-size: .9rem; color: #64748b; margin-top: .5rem; }
.cert-title { font-size: clamp(1.8rem, 4vw, 3rem); font-weight: 700; color: #1e1b4b; margin: .6rem 0 1.2rem; letter-spacing: .02em; }
.cert-line { font-size: 1.05rem; color: #475569; margin: .3rem 0; }
.cert-name { font-size: clamp(1.8rem, 4vw, 2.8rem); font-style: italic; color: #b8860b; border-bottom: 1px solid #cbd5e1; padding: 0 2rem .3rem; margin: .4rem 0 .8rem; }
.cert-exam { font-size: 1.5rem; font-weight: 700; color: #1e1b4b; margin: .3rem 0; }
.cert-footer { margin-top: auto; width: 100%; display: flex; justify-content: space-between; align-items: flex-end; }
.cert-sign { min-width: 220px; }
.sig-line { border-bottom: 1px solid #1e293b; height: 46px; margin-bottom: .4rem; }
.cert-verify { text-align: end; font-family: system-ui, sans-serif; }

@media print {
  .no-print, .sidebar, .topbar, .app-footer, .btn, .cert-toolbar { display: none !important; }
  .print-body { background: #fff; }
  .certificate { box-shadow: none; width: 100%; margin: 0; }
  @page { size: A4 landscape; margin: 0; }
  .content { padding: 0; }
  .card { break-inside: avoid; box-shadow: none; }
}

/* ---------- v2: branding, multi-institute ---------- */
.brand-img { width: 38px; height: 38px; border-radius: 10px; object-fit: contain; background: #fff; padding: 2px; flex: none; }
.sidebar .nav-link .badge { font-size: .68rem; }
.inst-card { transition: transform .15s, box-shadow .15s; }
.inst-card:hover { transform: translateY(-2px); box-shadow: 0 10px 24px rgba(15, 23, 42, .08); }
.inst-dot { width: 12px; height: 12px; border-radius: 50%; display: inline-block; flex: none; }
.color-input { width: 56px; padding: .2rem; height: 38px; }
.settings-nav .nav-link { color: var(--bs-body-color); border-radius: 10px; }
.settings-nav .nav-link.active { background: var(--ep-primary); color: #fff; }
.code-sm { font-size: .8rem; }

/* ===== v2: rich content, passages, subjective answers, webcam ===== */
.rich p { margin-bottom: .6rem; } .rich p:last-child { margin-bottom: 0; }
.rich ul { margin: .25rem 0 .6rem; padding-inline-start: 1.25rem; }
.rich code { background: var(--bs-tertiary-bg); padding: .05rem .3rem; border-radius: 4px; }
.mx-d { display: block; text-align: center; margin: .5rem 0; overflow-x: auto; overflow-y: hidden; }
.katex { font-size: 1.08em; }
.opt-text .katex { font-size: 1em; }
.rich-preview { border: 1px dashed var(--bs-border-color); border-radius: 8px; padding: .6rem .8rem; margin-top: .4rem; background: var(--bs-tertiary-bg); font-size: .95rem; }
.rich-preview::before { content: attr(data-label); display: block; font-size: .7rem; text-transform: uppercase; letter-spacing: .05em; color: var(--bs-secondary-color); margin-bottom: .25rem; }

.cbt-question.has-passage { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 1.25rem; align-items: start; }
.cbt-passage { border: 1px solid var(--bs-border-color); border-radius: 12px; background: var(--bs-tertiary-bg); display: flex; flex-direction: column; max-height: calc(100vh - 220px); position: sticky; top: 0; }
.passage-head { display: flex; align-items: center; gap: .4rem; padding: .55rem .9rem; border-bottom: 1px solid var(--bs-border-color); font-weight: 600; font-size: .9rem; }
.passage-body { padding: .9rem 1rem; overflow-y: auto; line-height: 1.7; }
.passage-title { font-weight: 700; margin-bottom: .5rem; }
@media (max-width: 991.98px) {
  .cbt-question.has-passage { grid-template-columns: 1fr; }
  .cbt-passage { position: static; max-height: 45vh; }
  .cbt-passage.collapsed .passage-body { display: none; }
}
.opt-text { flex: 1; min-width: 0; }
.opt-img { display: block; max-width: 100%; max-height: 180px; border-radius: 8px; margin-top: .4rem; border: 1px solid var(--bs-border-color); background: #fff; }
.q-desc, .q-file { max-width: 860px; }
.q-desc textarea { font-size: 1rem; line-height: 1.6; resize: vertical; min-height: 220px; }
.upload-drop { display: flex; flex-direction: column; align-items: center; gap: .3rem; padding: 1.75rem 1rem; border: 2px dashed var(--bs-border-color); border-radius: 14px; cursor: pointer; text-align: center; color: var(--bs-secondary-color); transition: border-color .15s, background .15s; }
.upload-drop:hover, .upload-drop.drag { border-color: var(--ep-primary); background: color-mix(in srgb, var(--ep-primary) 6%, transparent); color: var(--bs-body-color); }
.upload-status:empty { display: none; }
.upload-status { padding: .6rem .8rem; border: 1px solid var(--bs-border-color); border-radius: 10px; }

.cam-video { display: none; }
.cam-video.on { display: block; width: 100%; aspect-ratio: 4/3; object-fit: cover; border-radius: 10px; background: #000; transform: scaleX(-1); }
.webcam-box { margin-top: .75rem; padding: .5rem; border: 1px solid var(--bs-border-color); border-radius: 12px; background: var(--bs-tertiary-bg); }
.webcam-slot { max-width: 220px; margin: 0 auto; }
.rec-dot { width: 8px; height: 8px; border-radius: 50%; background: #ef4444; display: inline-block; animation: recPulse 1.4s infinite; }
.webcam-box.cam-bad { border-color: #ef4444; background: color-mix(in srgb, #ef4444 8%, var(--bs-tertiary-bg)); }
.webcam-box.cam-bad [data-role=cam-status] { color: #dc2626; font-weight: 600; }
@keyframes recPulse { 50% { opacity: .25; } }

.answer-box { white-space: normal; padding: .8rem 1rem; border: 1px solid var(--bs-border-color); border-radius: 10px; background: var(--bs-tertiary-bg); max-height: 420px; overflow: auto; line-height: 1.65; }
.line-clamp-3 { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.snap-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: .6rem; }
.snap-grid figure { margin: 0; position: relative; }
.snap-grid img { width: 100%; aspect-ratio: 4/3; object-fit: cover; border-radius: 8px; border: 2px solid transparent; }
.snap-grid .flagged img { border-color: #ef4444; }
.snap-grid figcaption { font-size: .72rem; color: var(--bs-secondary-color); display: flex; justify-content: space-between; margin-top: .15rem; }
.feedback-box { border-inline-start: 3px solid var(--ep-primary); padding: .5rem .8rem; background: color-mix(in srgb, var(--ep-primary) 6%, transparent); border-radius: 0 8px 8px 0; }
.line-clamp-2 .rich p, .line-clamp-3 .rich p { display: inline; margin: 0; } .line-clamp-2 .mx-d, .line-clamp-3 .mx-d { display: inline; margin: 0; } .line-clamp-2 .rich ul { display: inline; padding: 0; } .line-clamp-2 .rich li { display: inline; margin-inline-end: .5rem; }

/* ===== Practice mode ===== */
.practice-shell { min-height: 100vh; display: flex; flex-direction: column; background: var(--bs-tertiary-bg); }
.practice-top { display: flex; align-items: center; gap: .9rem; padding: .7rem 1.25rem; background: var(--bs-body-bg); border-bottom: 1px solid var(--bs-border-color); position: sticky; top: 0; z-index: 5; }
.practice-score { white-space: nowrap; font-size: .95rem; }
.practice-main { width: 100%; max-width: 900px; margin: 0 auto; padding: 1.25rem 1rem 2rem; }
.practice-dots { display: flex; flex-wrap: wrap; gap: .35rem; margin-bottom: 1rem; }
.pdot { width: 32px; height: 32px; border-radius: 50%; border: 1px solid var(--bs-border-color); background: var(--bs-body-bg); font-size: .8rem; font-weight: 600; color: var(--bs-secondary-color); }
.pdot.ok { background: #16a34a; border-color: #16a34a; color: #fff; }
.pdot.bad { background: #dc2626; border-color: #dc2626; color: #fff; }
.pdot.current { outline: 3px solid color-mix(in srgb, var(--ep-primary) 45%, transparent); outline-offset: 1px; }
.practice-card { border-radius: 16px; }
.q-option.is-correct { border-color: #16a34a !important; background: color-mix(in srgb, #16a34a 10%, var(--bs-secondary-bg)) !important; }
.q-option.is-correct .opt-key { background: #16a34a; color: #fff; border-color: #16a34a; }
.q-option.is-wrong { border-color: #dc2626 !important; background: color-mix(in srgb, #dc2626 9%, var(--bs-secondary-bg)) !important; }
.q-option.is-wrong .opt-key { background: #dc2626; color: #fff; border-color: #dc2626; }
.q-option:has(input:disabled) { cursor: default; transform: none !important; }
.practice-feedback { padding: 1rem 1.1rem; border-radius: 12px; border: 1px solid; animation: fbIn .25s ease; }
.practice-feedback.is-ok { border-color: #86efac; background: color-mix(in srgb, #16a34a 7%, transparent); }
.practice-feedback.is-bad { border-color: #fca5a5; background: color-mix(in srgb, #dc2626 6%, transparent); }
@keyframes fbIn { from { opacity: 0; transform: translateY(6px); } }
.shake { animation: shake .35s; } @keyframes shake { 25% { transform: translateX(-4px); } 75% { transform: translateX(4px); } }
.tip-icon { width: 38px; height: 38px; border-radius: 10px; display: grid; place-items: center; font-size: 1.15rem; background: var(--bs-tertiary-bg); flex-shrink: 0; }
.tip-danger { border-inline-start: 3px solid #dc2626; } .tip-warning { border-inline-start: 3px solid #f59e0b; }
.tip-info { border-inline-start: 3px solid #0ea5e9; } .tip-success { border-inline-start: 3px solid #16a34a; }
.streak-pill { background: rgba(255,255,255,.18); padding: .5rem 1rem; border-radius: 999px; font-weight: 700; white-space: nowrap; }
.streak-pill .bi { color: #fdba74; }
.mode-btn { font-size: .9rem; padding: .55rem .75rem; }
.min-w-0 { min-width: 0; }
.otp-input { font-size: 2rem; letter-spacing: .6em; font-weight: 700; padding-inline-start: 1.2em; }
.divider-text { display: flex; align-items: center; gap: .75rem; color: var(--bs-secondary-color); font-size: .85rem; }
.divider-text::before, .divider-text::after { content: ""; flex: 1; border-top: 1px solid var(--bs-border-color); }

/* ===== Printable documents (A4) ===== */
.doc-toolbar { position: sticky; top: 0; z-index: 10; display: flex; gap: .5rem; align-items: center; padding: .6rem 1rem; background: #0f172a; }
.paper { background: #fff; color: #0f172a; width: 210mm; min-height: 297mm; margin: 1.25rem auto; padding: 14mm 15mm; box-shadow: 0 10px 30px rgba(15,23,42,.18); font-size: 10.5pt; line-height: 1.45; }
.paper-landscape { width: 297mm; min-height: 210mm; }
.paper .text-body-secondary { color: #64748b !important; }
.doc-head { display: flex; justify-content: space-between; align-items: center; gap: 1rem; border-bottom: 2.5px solid var(--ep-primary); padding-bottom: .6rem; margin-bottom: 1rem; }
.doc-brand { display: flex; align-items: center; gap: .7rem; }
.doc-logo { width: 46px; height: 46px; object-fit: contain; border-radius: 8px; }
.doc-logo-icon { display: grid; place-items: center; background: var(--ep-primary); color: #fff; font-size: 1.4rem; }
.doc-inst { font-weight: 800; font-size: 14pt; }
.doc-contact { font-size: 8.5pt; color: #64748b; max-width: 95mm; }
.doc-title-wrap { text-align: end; }
.doc-title { font-weight: 800; font-size: 13pt; text-transform: uppercase; letter-spacing: .04em; color: var(--ep-primary); }
.doc-sub { font-size: 9.5pt; color: #475569; }
.doc-table { width: 100%; border-collapse: collapse; margin: .5rem 0 1rem; }
.doc-table th, .doc-table td { border: 1px solid #cbd5e1; padding: 5px 7px; vertical-align: top; }
.doc-table thead th, .doc-table tfoot th { background: #f1f5f9; font-size: 9pt; }
.doc-table-sm { font-size: 9pt; } .doc-table-sm th, .doc-table-sm td { padding: 3px 5px; }
.doc-stats { display: grid; grid-template-columns: repeat(5, 1fr); gap: .5rem; margin-bottom: .8rem; }
.doc-stats div, .sc-boxes div { border: 1px solid #e2e8f0; border-radius: 8px; padding: .45rem; text-align: center; }
.doc-stats b, .sc-boxes b { display: block; font-size: 12pt; } .doc-stats span, .sc-boxes span { font-size: 8pt; color: #64748b; }
.doc-legend { display: flex; flex-wrap: wrap; gap: .3rem 1rem; font-size: 8.5pt; color: #475569; }
.doc-sign { display: flex; justify-content: space-between; gap: 2rem; margin-top: 2.5rem; font-size: 9pt; text-align: center; }
.doc-sign > div { flex: 1; max-width: 55mm; margin-inline-start: auto; } .doc-sign .sig-line { border: 0; border-top: 1px solid #334155; width: auto; margin-bottom: .25rem; height: 1.2rem; }
.paper-foot { margin-top: 1.2rem; text-align: center; font-size: 8pt; color: #94a3b8; }
.paper-meta, .paper-fill { display: flex; flex-wrap: wrap; justify-content: space-between; gap: .4rem 1rem; font-size: 9.5pt; padding: .4rem 0; }
.paper-fill { border-top: 1px dashed #cbd5e1; border-bottom: 1px dashed #cbd5e1; margin-bottom: .6rem; padding: .6rem 0; }
.paper-instr { font-size: 9pt; background: #f8fafc; border: 1px solid #e2e8f0; border-radius: 6px; padding: .5rem .7rem; margin-bottom: .8rem; }
.paper-section { font-size: 11.5pt; font-weight: 800; text-transform: uppercase; border-bottom: 1px solid #0f172a; padding-bottom: 2px; margin: 1rem 0 .6rem; }
.paper-q { break-inside: avoid; margin-bottom: .75rem; }
.paper-qhead { display: flex; gap: .4rem; }
.paper-qn { font-weight: 700; min-width: 1.6rem; }
.paper-marks { font-size: 9pt; color: #475569; white-space: nowrap; }
.paper-img { max-width: 70%; max-height: 60mm; margin: .3rem 0 .3rem 1.6rem; display: block; }
.paper-opts { display: grid; gap: .15rem 1rem; padding-inline-start: 1.6rem; margin-top: .2rem; }
.paper-opts.cols-2 { grid-template-columns: 1fr 1fr; }
.paper-opt { display: flex; gap: .35rem; align-items: baseline; flex-wrap: wrap; }
.paper-opt.is-key { font-weight: 700; text-decoration: underline; text-decoration-color: #16a34a; text-decoration-thickness: 2px; }
.paper-opt-img { display: block; max-height: 28mm; max-width: 60mm; margin-top: .2rem; }
.paper-answer-line { padding-inline-start: 1.6rem; margin-top: .3rem; }
.paper-lines { margin: .4rem 0 0 1.6rem; height: calc(var(--lines) * 7.5mm); background: repeating-linear-gradient(transparent 0 calc(7.5mm - 1px), #cbd5e1 calc(7.5mm - 1px) 7.5mm); }
.paper-passage { border: 1px solid #cbd5e1; border-radius: 6px; padding: .5rem .7rem; margin: .4rem 0 .7rem; font-size: 10pt; background: #f8fafc; break-inside: avoid; }
.paper-model { margin: .3rem 0 0 1.6rem; font-size: 9pt; background: #f0fdf4; border: 1px solid #bbf7d0; padding: .3rem .5rem; border-radius: 4px; }
.paper-key { break-before: page; } .key-grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: .3rem; font-size: 10pt; }
.paper .rich p { margin-bottom: .3rem; }
.rc-student { display: grid; grid-template-columns: repeat(4, 1fr); gap: .5rem; margin-bottom: .9rem; }
.rc-student div { border: 1px solid #e2e8f0; border-radius: 8px; padding: .4rem .55rem; }
.rc-student span { display: block; font-size: 8pt; color: #64748b; text-transform: uppercase; } .rc-student b { font-size: 10pt; word-break: break-word; }
.rc-remark { border: 1px dashed #cbd5e1; border-radius: 6px; padding: .5rem .7rem; font-size: 10pt; }
.sc-hero { display: flex; gap: 1rem; align-items: center; margin: .5rem 0 1rem; }
.sc-score { min-width: 40mm; text-align: center; border: 3px solid var(--ep-primary); border-radius: 12px; padding: .6rem; }
.sc-score b { font-size: 26pt; display: block; line-height: 1; } .sc-score span { color: #64748b; }
.sc-boxes { flex: 1; display: grid; grid-template-columns: repeat(5, 1fr); gap: .45rem; }
.report-card { break-after: page; }
@media print {
  @page { size: A4; margin: 10mm; }
  .doc-toolbar { display: none !important; }
  .paper { width: auto; min-height: 0; margin: 0; padding: 0; box-shadow: none; }
  .paper + .paper { break-before: page; }
  @page landscape { size: A4 landscape; margin: 10mm; }
  .paper-landscape { page: landscape; }
  .report-card:last-child { break-after: auto; }
}
@media screen and (max-width: 900px) { .paper, .paper-landscape { width: auto; margin: .5rem; padding: 1rem; } }

/* ---------- Floating, database-grounded AI assistant ---------- */
.ep-ai-root { position: fixed; inset-inline-end: 24px; bottom: 22px; z-index: 1080; font-family: inherit; }
.ep-ai-launcher { display: flex; align-items: center; gap: 10px; border: 0; color: #fff; border-radius: 999px; padding: 8px 15px 8px 9px; background: linear-gradient(135deg,#4f46e5,#7c3aed); box-shadow: 0 12px 32px rgba(79,70,229,.32); font-size: .91rem; font-weight: 700; transition: transform .18s ease,box-shadow .18s ease; }
.ep-ai-launcher:hover { transform: translateY(-2px); box-shadow: 0 16px 36px rgba(79,70,229,.4); }
.ep-ai-launcher-icon { width: 38px; height: 38px; border-radius: 50%; background: rgba(255,255,255,.18); display: grid; place-items: center; font-size: 1.2rem; }
.ep-ai-launcher-label { white-space: nowrap; }
.ep-ai-online-dot,.ep-ai-status-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: #4ade80; box-shadow: 0 0 0 3px rgba(74,222,128,.16); }
.ep-ai-panel { position: absolute; inset-inline-end: 0; bottom: 66px; display: flex; flex-direction: column; width: min(410px,calc(100vw - 28px)); height: min(650px,calc(100vh - 115px)); min-height: 390px; overflow: hidden; border: 1px solid var(--bs-border-color); border-radius: 20px; background: var(--bs-body-bg); color: var(--bs-body-color); box-shadow: 0 22px 70px rgba(15,23,42,.25); animation: epAiIn .16s ease-out; }
.ep-ai-panel[hidden] { display: none !important; }
@keyframes epAiIn { from { opacity: 0; transform: translateY(8px) scale(.985); } to { opacity: 1; transform: translateY(0) scale(1); } }
.ep-ai-header { display: flex; align-items: center; gap: 11px; padding: 15px 16px; color: #fff; background: linear-gradient(115deg,#312e81,#5b21b6 72%,#6d28d9); flex: none; }
.ep-ai-brand-icon { display: grid; place-items: center; width: 42px; height: 42px; flex: none; border-radius: 14px; background: rgba(255,255,255,.16); font-size: 1.25rem; }
.ep-ai-heading { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.ep-ai-heading strong { font-size: .98rem; line-height: 1.2; }
.ep-ai-heading span { display: flex; align-items: center; gap: 7px; font-size: .74rem; opacity: .88; }
.ep-ai-status-dot { width: 6px; height: 6px; box-shadow: none; }
.ep-ai-close { margin-inline-start: auto; flex: none; width: 32px; height: 32px; border: 0; border-radius: 10px; color: #fff; background: rgba(255,255,255,.12); }
.ep-ai-close:hover { background: rgba(255,255,255,.22); }
.ep-ai-trust { display: flex; align-items: center; gap: 7px; padding: 9px 15px; background: var(--bs-tertiary-bg); color: var(--bs-secondary-color); font-size: .72rem; border-bottom: 1px solid var(--bs-border-color-translucent); }
.ep-ai-trust i { color: var(--bs-success); font-size: .9rem; }
.ep-ai-prompts-wrap { padding: 12px 13px 10px; border-bottom: 1px solid var(--bs-border-color-translucent); flex: none; }
.ep-ai-prompts-title { margin: 0 0 8px 2px; color: var(--bs-secondary-color); font-size: .7rem; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }
.ep-ai-prompts { display: flex; flex-wrap: wrap; gap: 6px; max-height: 91px; overflow-y: auto; }
.ep-ai-prompt { max-width: 100%; padding: 6px 10px; text-align: start; border: 1px solid color-mix(in srgb,var(--ep-primary) 25%,var(--bs-border-color)); border-radius: 999px; color: var(--ep-primary); background: var(--bs-body-bg); font-size: .75rem; line-height: 1.25; transition: color .15s,background .15s,border-color .15s; }
.ep-ai-prompt:hover { color: #fff; background: var(--ep-primary); border-color: var(--ep-primary); }
.ep-ai-muted { color: var(--bs-secondary-color); font-size: .78rem; padding: 3px 2px; }
.ep-ai-messages { display: flex; flex: 1; min-height: 100px; flex-direction: column; gap: 13px; overflow-y: auto; padding: 15px 13px; scroll-behavior: smooth; }
.ep-ai-message { display: flex; align-items: flex-start; gap: 8px; max-width: 100%; }
.ep-ai-message-avatar { display: grid; place-items: center; flex: none; width: 27px; height: 27px; border-radius: 9px; color: #fff; background: linear-gradient(135deg,#4f46e5,#7c3aed); font-size: .82rem; }
.ep-ai-message-body { display: flex; flex-direction: column; align-items: flex-start; min-width: 0; max-width: calc(100% - 35px); }
.ep-ai-message-content { white-space: pre-wrap; overflow-wrap: anywhere; padding: 10px 12px; background: var(--bs-tertiary-bg); border: 1px solid var(--bs-border-color-translucent); border-radius: 4px 13px 13px 13px; font-size: .83rem; line-height: 1.5; }
.ep-ai-message-meta { margin: 4px 2px 0; color: var(--bs-secondary-color); font-size: .65rem; line-height: 1.3; }
.ep-ai-user { justify-content: flex-end; }
.ep-ai-user .ep-ai-message-body { align-items: flex-end; max-width: 87%; }
.ep-ai-user .ep-ai-message-content { color: #fff; background: var(--ep-primary); border-color: var(--ep-primary); border-radius: 13px 4px 13px 13px; }
.ep-ai-user .ep-ai-message-meta { text-align: end; }
.ep-ai-pending .ep-ai-message-content { color: var(--bs-secondary-color); font-style: italic; }
.ep-ai-action-link { margin: 7px 2px 0; color: var(--ep-primary); text-decoration: none; font-size: .75rem; font-weight: 700; }
.ep-ai-action-link:hover { text-decoration: underline; }
.ep-ai-input-row { display: flex; align-items: center; gap: 9px; margin: 0 12px; padding: 7px; border: 1px solid var(--bs-border-color); border-radius: 14px; background: var(--bs-body-bg); flex: none; }
.ep-ai-input-row:focus-within { border-color: var(--ep-primary); box-shadow: 0 0 0 3px color-mix(in srgb,var(--ep-primary) 13%,transparent); }
.ep-ai-input-row input { min-width: 0; flex: 1; border: 0; outline: 0; padding: 5px 7px; color: var(--bs-body-color); background: transparent; font: inherit; font-size: .85rem; }
.ep-ai-input-row button { display: grid; flex: none; place-items: center; width: 36px; height: 36px; border: 0; border-radius: 11px; color: #fff; background: var(--ep-primary); font-size: 1.12rem; }
.ep-ai-input-row button:disabled { opacity: .55; cursor: wait; }
.ep-ai-footnote { padding: 8px 12px 10px; text-align: center; font-size: .64rem; color: var(--bs-secondary-color); flex: none; }
.assistant-question-number { display: inline-grid; place-items: center; width: 30px; height: 30px; flex: none; border-radius: 10px; color: var(--ep-primary); background: var(--bs-primary-bg-subtle); font-size: .7rem; font-weight: 800; }
.assistant-edit-form { max-width: 560px; }
@media (max-width: 575.98px) {
  .ep-ai-root { inset-inline-end: 12px; bottom: 12px; }
  .ep-ai-panel { width: min(410px,calc(100vw - 24px)); height: min(680px,calc(100dvh - 92px)); bottom: 62px; border-radius: 17px; }
  .ep-ai-launcher { padding-inline: 8px 12px; }
  .ep-ai-launcher-icon { width: 35px; height: 35px; }
}
@media (prefers-reduced-motion: reduce) { .ep-ai-panel,.ep-ai-launcher { animation: none; transition: none; } }